NavigatorLinkStyleCallback

type NavigatorLinkStyleCallback<T> = (payload) => NavigatorLinkStyle;

Per-link styling hook for the mini-map. Receives the link's dia.Link model and its resolved record, and returns a style map (NavigatorLinkStyle) applied to the rendered <path> — handy for coloring or dashing links based on their data. Returned values are applied as inline CSS, except d, which is set as an attribute (the CSS d property is not reliably supported across browsers).

Type Parameters

Type Parameter	Description
T	Shape of the custom data payload carried on the link.

Parameters

Parameter	Type
payload	{ model: dia.Link; record: Computed<LinkRecord<T>>; }
payload.model	dia.Link
payload.record	Computed<LinkRecord<T>>

Returns

NavigatorLinkStyle

Example

import type { NavigatorLinkStyleCallback } from '@joint/react-plus';

const styleBySelection: NavigatorLinkStyleCallback<{ selected: boolean }> = ({ record }) => ({
  stroke: record.data.selected ? '#2980b9' : '#bdc3c7',
});