pivotick - v1.5.0
    Preparing search index...

    Interface InterractionCallbacks<TElement>

    interface InterractionCallbacks<TElement = unknown> {
        isValidConnection?: (source: Note | Node, target: Node) => boolean;
        onBeforeEdgeCreate?: (
            context: EdgeCreateContext,
        ) => EdgeCreateDecision | Promise<EdgeCreateDecision>;
        onBeforeNodeEditCommit?: (
            context: NodeEditCommitContext,
        ) => boolean | Promise<boolean>;
        onCanvasBeforeZoom?: (event: unknown) => void;
        onCanvasClick?: (event: PointerEvent) => void;
        onCanvasContextmenu?: (event: PointerEvent) => void;
        onCanvasMousemove?: (event: MouseEvent) => void;
        onCanvasPointerDown?: (event: PointerEvent) => void;
        onCanvasPointerUp?: (event: PointerEvent) => void;
        onCanvasZoom?: (event: unknown) => void;
        onEdgeBlur?: (edge: Edge, element: TElement) => void;
        onEdgeClick?: (event: PointerEvent, edge: Edge, element: TElement) => void;
        onEdgeContextmenu?: (
            event: PointerEvent,
            edge: Edge,
            element: TElement,
        ) => void;
        onEdgeDbclick?: (
            event: PointerEvent,
            edge: Edge,
            element: TElement,
        ) => void;
        onEdgeHoverIn?: (
            event: PointerEvent,
            edge: Edge,
            element: TElement,
        ) => void;
        onEdgeHoverOut?: (
            event: PointerEvent,
            edge: Edge,
            element: TElement,
        ) => void;
        onEdgeSelect?: (edge: Edge, element: TElement) => void;
        onNodeBlur?: (node: Node, element: TElement) => void;
        onNodeClick?: (event: PointerEvent, node: Node, element: TElement) => void;
        onNodeContextmenu?: (
            event: PointerEvent,
            node: Node,
            element: TElement,
        ) => void;
        onNodeDbclick?: (
            event: PointerEvent,
            node: Node,
            element: TElement,
        ) => void;
        onNodeDragended?: (event: MouseEvent, node: Node) => void;
        onNodeDragging?: (event: MouseEvent, node: Node) => void;
        onNodeEdit?: (session: NodeEditSession) => HTMLDivElement;
        onNodeEditCancel?: (node: Node) => void;
        onNodeExpansion?: (
            event: PointerEvent,
            edge: Edge,
            element: TElement,
        ) => void;
        onNodeHoverIn?: (
            event: PointerEvent,
            node: Node,
            element: TElement,
        ) => void;
        onNodeHoverOut?: (
            event: PointerEvent,
            node: Node,
            element: TElement,
        ) => void;
        onNodePointerDown?: (
            event: PointerEvent,
            node: Node,
            element: TElement,
        ) => void;
        onNodePointerUp?: (
            event: PointerEvent,
            node: Node,
            element: TElement,
        ) => void;
        onNodeSelect?: (node: Node, element: TElement) => void;
        onNodesSelect?: (selection: NodeSelection<TElement>[]) => void;
        onNoteClick?: (event: PointerEvent, note: Note, element: TElement) => void;
        onNoteContextmenu?: (
            event: PointerEvent,
            note: Note,
            element: TElement,
        ) => void;
        onNoteDbclick?: (
            event: PointerEvent,
            note: Note,
            element: TElement,
        ) => void;
        onNoteDragging?: (event: PointerEvent, note: Note) => void;
        onNoteHandleClick?: (
            event: PointerEvent,
            note: Note,
            handle: HTMLElement,
        ) => void;
        onNoteHandlePointerDown?: (
            event: PointerEvent,
            note: Note,
            handle: HTMLElement,
        ) => void;
        onNoteHoverIn?: (
            event: PointerEvent,
            note: Note,
            element: TElement,
        ) => void;
        onNoteHoverOut?: (
            event: PointerEvent,
            note: Note,
            element: TElement,
        ) => void;
        onNotePointerDown?: (
            event: PointerEvent,
            note: Note,
            element: TElement,
        ) => void;
        onNotePointerUp?: (
            event: PointerEvent,
            note: Note,
            element: TElement,
        ) => void;
        onSimulationSlowTick?: () => void;
        onSimulationTick?: () => void;
    }

    Type Parameters

    • TElement = unknown
    Index

    Properties

    isValidConnection? onBeforeEdgeCreate? onBeforeNodeEditCommit? onCanvasBeforeZoom? onCanvasClick? onCanvasContextmenu? onCanvasMousemove? onCanvasPointerDown? onCanvasPointerUp? onCanvasZoom? onEdgeBlur? onEdgeClick? onEdgeContextmenu? onEdgeDbclick? onEdgeHoverIn? onEdgeHoverOut? onEdgeSelect? onNodeBlur? onNodeClick? onNodeContextmenu? onNodeDbclick? onNodeDragended? onNodeDragging? onNodeEdit? onNodeEditCancel? onNodeExpansion? onNodeHoverIn? onNodeHoverOut? onNodePointerDown? onNodePointerUp? onNodeSelect? onNodesSelect? onNoteClick? onNoteContextmenu? onNoteDbclick? onNoteDragging? onNoteHandleClick? onNoteHandlePointerDown? onNoteHoverIn? onNoteHoverOut? onNotePointerDown? onNotePointerUp? onSimulationSlowTick? onSimulationTick?

    Properties

    isValidConnection?: (source: Note | Node, target: Node) => boolean

    Live validity predicate evaluated during the connect gesture as the cursor hovers candidate targets (à la React Flow's isValidConnection). Return false to mark the hovered target invalid: the shadow edge renders in an invalid style, and releasing / clicking on it creates nothing (in that case onBeforeEdgeCreate is not consulted). Runs on every pointer move, so it must be synchronous and cheap.

    onBeforeEdgeCreate?: (
        context: EdgeCreateContext,
    ) => EdgeCreateDecision | Promise<EdgeCreateDecision>

    Called during a connect gesture, after the target node is resolved but before the edge (or note-link) is created. Acts as the edge equivalent of onBeforeNodeEditCommit: a validation / enrichment / veto hook.

    • Return false / { accept: false } to veto: the preview is dropped, nothing is added, and connect mode stays armed so the user can retry.
    • Return true to accept with defaults.
    • Return { accept: true, data?, style?, id?, directed? } to accept and supply the new edge's payload/style/id/direction.

    May be async (e.g. persist to a backend before deciding); the shadow-edge preview persists until the promise settles, and no new connect gesture is accepted while it is pending. Fires for both click- and drag-to-connect. Also fires for note→node links (EdgeCreateContext.kind 'note-link'), where the edge-specific fields of the decision are ignored.

    Type Declaration

    onBeforeNodeEditCommit?: (
        context: NodeEditCommitContext,
    ) => boolean | Promise<boolean>

    Called when an node edit session is about to be commited Act as a validation/interception hook.

    Type Declaration

    onCanvasBeforeZoom?: (event: unknown) => void

    Called when the canvas is about to be zoomed.

    onCanvasClick?: (event: PointerEvent) => void

    Called when the canvas is clicked.

    onCanvasContextmenu?: (event: PointerEvent) => void

    Called when the canvas is right clicked.

    onCanvasMousemove?: (event: MouseEvent) => void

    Called when the mouse move over the canvas.

    onCanvasPointerDown?: (event: PointerEvent) => void

    Called when a user pointer down the canvas.

    onCanvasPointerUp?: (event: PointerEvent) => void

    Called when a user pointer up the canvas.

    onCanvasZoom?: (event: unknown) => void

    Called when the canvas is zoomed.

    onEdgeBlur?: (edge: Edge, element: TElement) => void

    Called when an edge is unselected by the user.

    onEdgeClick?: (event: PointerEvent, edge: Edge, element: TElement) => void

    Called when an edge is selected by the user.

    onEdgeContextmenu?: (event: PointerEvent, edge: Edge, element: TElement) => void

    Called when an edge is right clicked.

    onEdgeDbclick?: (event: PointerEvent, edge: Edge, element: TElement) => void

    Called when an edge is selected by the user.

    onEdgeHoverIn?: (event: PointerEvent, edge: Edge, element: TElement) => void

    Called when a user hovers over an edge.

    onEdgeHoverOut?: (event: PointerEvent, edge: Edge, element: TElement) => void

    Called when a user hovers over an edge.

    onEdgeSelect?: (edge: Edge, element: TElement) => void

    Called when an edge is selected by the user.

    onNodeBlur?: (node: Node, element: TElement) => void

    Called when a node is unselected by the user.

    onNodeClick?: (event: PointerEvent, node: Node, element: TElement) => void

    Called when a node is clicked.

    onNodeContextmenu?: (event: PointerEvent, node: Node, element: TElement) => void

    Called when a node is right clicked.

    onNodeDbclick?: (event: PointerEvent, node: Node, element: TElement) => void

    Called when a node is double clicked.

    onNodeDragended?: (event: MouseEvent, node: Node) => void

    Called when a node drag ends.

    onNodeDragging?: (event: MouseEvent, node: Node) => void

    Called when a node is dragged.

    onNodeEdit?: (session: NodeEditSession) => HTMLDivElement

    Called when a node edit session starts. Act as a UI hook.

    Type Declaration

      • (session: NodeEditSession): HTMLDivElement

      • Parameters

        • session: NodeEditSession

          The node edit session

        Returns HTMLDivElement

        A HTML Div that will be injected in the modal's body

    onNodeEditCancel?: (node: Node) => void

    Called when an node edit session gets cancelled

    onNodeExpansion?: (event: PointerEvent, edge: Edge, element: TElement) => void

    Called when a node is expanded (e.g., drilled down or pivoted).

    onNodeHoverIn?: (event: PointerEvent, node: Node, element: TElement) => void

    Called when a user hovers over a node.

    onNodeHoverOut?: (event: PointerEvent, node: Node, element: TElement) => void

    Called when a user hovers out of a node.

    onNodePointerDown?: (event: PointerEvent, node: Node, element: TElement) => void

    Called when a user pointer down a node.

    onNodePointerUp?: (event: PointerEvent, node: Node, element: TElement) => void

    Called when a user pointer up a node.

    onNodeSelect?: (node: Node, element: TElement) => void

    Called when a node is selected by the user.

    onNodesSelect?: (selection: NodeSelection<TElement>[]) => void

    Called when nodes are selected by the user.

    onNoteClick?: (event: PointerEvent, note: Note, element: TElement) => void

    Called when a note is clicked.

    onNoteContextmenu?: (event: PointerEvent, note: Note, element: TElement) => void

    Called when a note is right clicked.

    onNoteDbclick?: (event: PointerEvent, note: Note, element: TElement) => void

    Called when a note is double clicked.

    onNoteDragging?: (event: PointerEvent, note: Note) => void

    Called when a user pointer up a node.

    onNoteHandleClick?: (
        event: PointerEvent,
        note: Note,
        handle: HTMLElement,
    ) => void

    Called when a user pointer down a node.

    onNoteHandlePointerDown?: (
        event: PointerEvent,
        note: Note,
        handle: HTMLElement,
    ) => void

    Called when a user pointer up a node.

    onNoteHoverIn?: (event: PointerEvent, note: Note, element: TElement) => void

    Called when a user hovers over a note.

    onNoteHoverOut?: (event: PointerEvent, note: Note, element: TElement) => void

    Called when a user hovers out of a note.

    onNotePointerDown?: (event: PointerEvent, note: Note, element: TElement) => void

    Called when a user pointer down a node.

    onNotePointerUp?: (event: PointerEvent, note: Note, element: TElement) => void

    Called when a user pointer up a node.

    onSimulationSlowTick?: () => void

    Called when the every tenth of simulation ticks.

    onSimulationTick?: () => void

    Called when the simulation ticks.

    Settings

    Member Visibility

    On This Page

    Properties