import type { OnSelectionChangeFunc, Node, Edge } from '../types'; export type UseOnSelectionChangeOptions = { /** The handler to register. */ onChange: OnSelectionChangeFunc; }; /** * This hook lets you listen for changes to both node and edge selection. As the *name implies, the callback you provide will be called whenever the selection of *_either_ nodes or edges changes. * * @public * @example * ```jsx *import { useState } from 'react'; *import { ReactFlow, useOnSelectionChange } from '@xyflow/react'; * *function SelectionDisplay() { * const [selectedNodes, setSelectedNodes] = useState([]); * const [selectedEdges, setSelectedEdges] = useState([]); * * // the passed handler has to be memoized, otherwise the hook will not work correctly * const onChange = useCallback(({ nodes, edges }) => { * setSelectedNodes(nodes.map((node) => node.id)); * setSelectedEdges(edges.map((edge) => edge.id)); * }, []); * * useOnSelectionChange({ * onChange, * }); * * return ( *
*

Selected nodes: {selectedNodes.join(', ')}

*

Selected edges: {selectedEdges.join(', ')}

*
* ); *} *``` * * @remarks You need to memoize the passed `onChange` handler, otherwise the hook will not work correctly. */ export declare function useOnSelectionChange({ onChange, }: UseOnSelectionChangeOptions): void; //# sourceMappingURL=useOnSelectionChange.d.ts.map