import { ActionUnion, BoundActionCreators } from '../../../../utils/typedActions'; import { NodeId, ConnectionId, PortId, Position, Size, Port as BasePort, DragState, ResizeState, ResizeHandle, ConnectionDragState, ConnectionDisconnectState } from '../../../../types/core'; /** * @file Context for canvas-specific interaction states (selection box, drag, resize, connection drag) */ import * as React from "react"; export type SelectionBox = { start: Position; end: Position; }; export type CanvasInteractionState = { selectionBox: SelectionBox | null; dragState: DragState | null; resizeState: ResizeState | null; connectionDragState: ConnectionDragState | null; connectionDisconnectState: ConnectionDisconnectState | null; }; export declare const canvasInteractionActions: { readonly setSelectionBox: ((box: SelectionBox | null) => { type: "SET_SELECTION_BOX"; payload: { box: SelectionBox | null; }; }) & { readonly type: "SET_SELECTION_BOX"; }; readonly startNodeDrag: ((nodeIds: string[], startPosition: Position, initialPositions: Record, affectedChildNodes: Record) => { type: "START_NODE_DRAG"; payload: { nodeIds: string[]; startPosition: Position; initialPositions: Record; affectedChildNodes: Record; }; }) & { readonly type: "START_NODE_DRAG"; }; readonly updateNodeDrag: ((offset: Position) => { type: "UPDATE_NODE_DRAG"; payload: { offset: Position; }; }) & { readonly type: "UPDATE_NODE_DRAG"; }; readonly endNodeDrag: (() => { type: "END_NODE_DRAG"; }) & { readonly type: "END_NODE_DRAG"; }; readonly startConnectionDrag: ((fromPort: BasePort) => { type: "START_CONNECTION_DRAG"; payload: { fromPort: BasePort; }; }) & { readonly type: "START_CONNECTION_DRAG"; }; readonly updateConnectionDrag: ((toPosition: Position, candidatePort: BasePort | null) => { type: "UPDATE_CONNECTION_DRAG"; payload: { toPosition: Position; candidatePort: BasePort | null; }; }) & { readonly type: "UPDATE_CONNECTION_DRAG"; }; readonly endConnectionDrag: (() => { type: "END_CONNECTION_DRAG"; }) & { readonly type: "END_CONNECTION_DRAG"; }; readonly startConnectionDisconnect: ((originalConnection: { id: ConnectionId; fromNodeId: NodeId; fromPortId: PortId; toNodeId: NodeId; toPortId: PortId; }, disconnectedEnd: "from" | "to", fixedPort: BasePort, draggingPosition: Position) => { type: "START_CONNECTION_DISCONNECT"; payload: { originalConnection: { id: ConnectionId; fromNodeId: NodeId; fromPortId: PortId; toNodeId: NodeId; toPortId: PortId; }; disconnectedEnd: "from" | "to"; fixedPort: BasePort; draggingPosition: Position; }; }) & { readonly type: "START_CONNECTION_DISCONNECT"; }; readonly updateConnectionDisconnect: ((draggingPosition: Position, candidatePort: BasePort | null) => { type: "UPDATE_CONNECTION_DISCONNECT"; payload: { draggingPosition: Position; candidatePort: BasePort | null; }; }) & { readonly type: "UPDATE_CONNECTION_DISCONNECT"; }; readonly endConnectionDisconnect: (() => { type: "END_CONNECTION_DISCONNECT"; }) & { readonly type: "END_CONNECTION_DISCONNECT"; }; readonly startNodeResize: ((nodeId: string, startPosition: Position, startSize: Size, handle: ResizeHandle, startNodePosition: Position) => { type: "START_NODE_RESIZE"; payload: { nodeId: string; startPosition: Position; startSize: Size; handle: ResizeHandle; startNodePosition: Position; }; }) & { readonly type: "START_NODE_RESIZE"; }; readonly updateNodeResize: ((currentSize: Size, currentPosition: Position) => { type: "UPDATE_NODE_RESIZE"; payload: { currentSize: Size; currentPosition: Position; }; }) & { readonly type: "UPDATE_NODE_RESIZE"; }; readonly endNodeResize: (() => { type: "END_NODE_RESIZE"; }) & { readonly type: "END_NODE_RESIZE"; }; }; export type CanvasInteractionAction = ActionUnion; export type CanvasInteractionActionsValue = { dispatch: React.Dispatch; actions: BoundActionCreators; actionCreators: typeof canvasInteractionActions; getState: () => CanvasInteractionState; subscribe: (listener: () => void) => () => void; }; export type CanvasInteractionContextValue = CanvasInteractionActionsValue & { state: CanvasInteractionState; }; declare const CanvasInteractionStateContext: React.Context; declare const CanvasInteractionDragStateContext: React.Context; export type ConnectionDragMeta = { fromPort: BasePort; candidatePortId: string | null; candidatePortNodeId: NodeId | null; }; declare const CanvasInteractionConnectionDragMetaContext: React.Context; declare const CanvasInteractionResizeStateContext: React.Context; declare const CanvasInteractionConnectionDisconnectActiveContext: React.Context; declare const CanvasInteractionActionsContext: React.Context; export declare const CanvasInteractionContext: React.Context; /** * Hook to access only the canvas interaction state * Use this when you only need to read state and don't need actions */ export declare const useCanvasInteractionState: () => CanvasInteractionState; export declare const useCanvasInteractionDragState: () => DragState | null; export declare const useCanvasInteractionConnectionDragMeta: () => ConnectionDragMeta | null; export declare const useCanvasInteractionResizeState: () => ResizeState | null; export declare const useCanvasInteractionConnectionDisconnectActive: () => boolean; /** * Hook to access only the canvas interaction actions * Use this when you only need to dispatch actions and don't need to re-render on state changes * The returned actions have stable references and won't cause re-renders */ export declare const useCanvasInteractionActions: () => CanvasInteractionActionsValue; /** * Selects a derived value from the canvas interaction state without forcing consumers * to re-render for unrelated state changes. */ export declare function useCanvasInteractionSelector(selector: (state: CanvasInteractionState) => T, options?: { areEqual?: (a: T, b: T) => boolean; }): T; /** * Hook to access both state and actions * Prefer useCanvasInteractionState or useCanvasInteractionActions for better performance */ export declare const useCanvasInteraction: () => CanvasInteractionContextValue; export { CanvasInteractionStateContext, CanvasInteractionDragStateContext, CanvasInteractionConnectionDragMetaContext, CanvasInteractionResizeStateContext, CanvasInteractionConnectionDisconnectActiveContext, CanvasInteractionActionsContext, }; /** * Returns memoized Sets for drag state lookup. * - directlyDraggedNodeIds: only the nodes being directly dragged * - affectedChildNodeIds: only the child nodes affected by group dragging * - allDraggedNodeIds: union of both (for connection rendering) */ export type DragNodeIdsSets = { directlyDraggedNodeIds: ReadonlySet; affectedChildNodeIds: ReadonlySet; allDraggedNodeIds: ReadonlySet; }; export declare const useDragNodeIdsSets: () => DragNodeIdsSets | null; /** * Returns a memoized Set of all dragged node IDs (including affected children) for O(1) lookup. * Convenience hook for cases where you only need the combined set. * Returns null when no drag is in progress. */ export declare const useDraggedNodeIdsSet: () => ReadonlySet | null;