@xyflow/react 12.5.3 → 12.5.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/base.css +2 -2
- package/dist/esm/additional-components/Background/types.d.ts +9 -9
- package/dist/esm/additional-components/Background/types.d.ts.map +1 -1
- package/dist/esm/additional-components/MiniMap/MiniMapNodes.d.ts.map +1 -1
- package/dist/esm/additional-components/MiniMap/types.d.ts +65 -19
- package/dist/esm/additional-components/MiniMap/types.d.ts.map +1 -1
- package/dist/esm/additional-components/NodeResizer/NodeResizeControl.d.ts.map +1 -1
- package/dist/esm/additional-components/NodeResizer/types.d.ts +37 -18
- package/dist/esm/additional-components/NodeResizer/types.d.ts.map +1 -1
- package/dist/esm/additional-components/NodeToolbar/types.d.ts +6 -5
- package/dist/esm/additional-components/NodeToolbar/types.d.ts.map +1 -1
- package/dist/esm/components/Edges/SimpleBezierEdge.d.ts +10 -0
- package/dist/esm/components/Edges/SimpleBezierEdge.d.ts.map +1 -1
- package/dist/esm/components/Panel/index.d.ts +5 -5
- package/dist/esm/components/Panel/index.d.ts.map +1 -1
- package/dist/esm/contexts/NodeIdContext.d.ts +1 -1
- package/dist/esm/hooks/useConnection.d.ts +4 -0
- package/dist/esm/hooks/useConnection.d.ts.map +1 -1
- package/dist/esm/hooks/useEdges.d.ts +1 -1
- package/dist/esm/hooks/useHandleConnections.d.ts +8 -8
- package/dist/esm/hooks/useHandleConnections.d.ts.map +1 -1
- package/dist/esm/hooks/useInternalNode.d.ts +2 -2
- package/dist/esm/hooks/useKeyPress.d.ts +23 -4
- package/dist/esm/hooks/useKeyPress.d.ts.map +1 -1
- package/dist/esm/hooks/useNodeConnections.d.ts +6 -6
- package/dist/esm/hooks/useNodeConnections.d.ts.map +1 -1
- package/dist/esm/hooks/useNodes.d.ts +1 -1
- package/dist/esm/hooks/useNodesData.d.ts +7 -5
- package/dist/esm/hooks/useNodesData.d.ts.map +1 -1
- package/dist/esm/hooks/useNodesEdgesState.d.ts +32 -6
- package/dist/esm/hooks/useNodesEdgesState.d.ts.map +1 -1
- package/dist/esm/hooks/useNodesInitialized.d.ts +3 -2
- package/dist/esm/hooks/useNodesInitialized.d.ts.map +1 -1
- package/dist/esm/hooks/useOnSelectionChange.d.ts +1 -2
- package/dist/esm/hooks/useOnSelectionChange.d.ts.map +1 -1
- package/dist/esm/hooks/useOnViewportChange.d.ts +5 -6
- package/dist/esm/hooks/useOnViewportChange.d.ts.map +1 -1
- package/dist/esm/hooks/useReactFlow.d.ts +0 -2
- package/dist/esm/hooks/useReactFlow.d.ts.map +1 -1
- package/dist/esm/hooks/useStore.d.ts +8 -5
- package/dist/esm/hooks/useStore.d.ts.map +1 -1
- package/dist/esm/hooks/useUpdateNodeInternals.d.ts +5 -4
- package/dist/esm/hooks/useUpdateNodeInternals.d.ts.map +1 -1
- package/dist/esm/hooks/useViewport.d.ts +3 -3
- package/dist/esm/index.js +103 -74
- package/dist/esm/index.mjs +103 -74
- package/dist/esm/types/component-props.d.ts +234 -116
- package/dist/esm/types/component-props.d.ts.map +1 -1
- package/dist/esm/types/edges.d.ts +26 -8
- package/dist/esm/types/edges.d.ts.map +1 -1
- package/dist/esm/types/general.d.ts +11 -6
- package/dist/esm/types/general.d.ts.map +1 -1
- package/dist/esm/types/instance.d.ts +23 -8
- package/dist/esm/types/instance.d.ts.map +1 -1
- package/dist/esm/utils/changes.d.ts +6 -6
- package/dist/esm/utils/general.d.ts +11 -7
- package/dist/esm/utils/general.d.ts.map +1 -1
- package/dist/style.css +2 -2
- package/dist/umd/additional-components/Background/types.d.ts +9 -9
- package/dist/umd/additional-components/Background/types.d.ts.map +1 -1
- package/dist/umd/additional-components/MiniMap/MiniMapNodes.d.ts.map +1 -1
- package/dist/umd/additional-components/MiniMap/types.d.ts +65 -19
- package/dist/umd/additional-components/MiniMap/types.d.ts.map +1 -1
- package/dist/umd/additional-components/NodeResizer/NodeResizeControl.d.ts.map +1 -1
- package/dist/umd/additional-components/NodeResizer/types.d.ts +37 -18
- package/dist/umd/additional-components/NodeResizer/types.d.ts.map +1 -1
- package/dist/umd/additional-components/NodeToolbar/types.d.ts +6 -5
- package/dist/umd/additional-components/NodeToolbar/types.d.ts.map +1 -1
- package/dist/umd/components/Edges/SimpleBezierEdge.d.ts +10 -0
- package/dist/umd/components/Edges/SimpleBezierEdge.d.ts.map +1 -1
- package/dist/umd/components/Panel/index.d.ts +5 -5
- package/dist/umd/components/Panel/index.d.ts.map +1 -1
- package/dist/umd/contexts/NodeIdContext.d.ts +1 -1
- package/dist/umd/hooks/useConnection.d.ts +4 -0
- package/dist/umd/hooks/useConnection.d.ts.map +1 -1
- package/dist/umd/hooks/useEdges.d.ts +1 -1
- package/dist/umd/hooks/useHandleConnections.d.ts +8 -8
- package/dist/umd/hooks/useHandleConnections.d.ts.map +1 -1
- package/dist/umd/hooks/useInternalNode.d.ts +2 -2
- package/dist/umd/hooks/useKeyPress.d.ts +23 -4
- package/dist/umd/hooks/useKeyPress.d.ts.map +1 -1
- package/dist/umd/hooks/useNodeConnections.d.ts +6 -6
- package/dist/umd/hooks/useNodeConnections.d.ts.map +1 -1
- package/dist/umd/hooks/useNodes.d.ts +1 -1
- package/dist/umd/hooks/useNodesData.d.ts +7 -5
- package/dist/umd/hooks/useNodesData.d.ts.map +1 -1
- package/dist/umd/hooks/useNodesEdgesState.d.ts +32 -6
- package/dist/umd/hooks/useNodesEdgesState.d.ts.map +1 -1
- package/dist/umd/hooks/useNodesInitialized.d.ts +3 -2
- package/dist/umd/hooks/useNodesInitialized.d.ts.map +1 -1
- package/dist/umd/hooks/useOnSelectionChange.d.ts +1 -2
- package/dist/umd/hooks/useOnSelectionChange.d.ts.map +1 -1
- package/dist/umd/hooks/useOnViewportChange.d.ts +5 -6
- package/dist/umd/hooks/useOnViewportChange.d.ts.map +1 -1
- package/dist/umd/hooks/useReactFlow.d.ts +0 -2
- package/dist/umd/hooks/useReactFlow.d.ts.map +1 -1
- package/dist/umd/hooks/useStore.d.ts +8 -5
- package/dist/umd/hooks/useStore.d.ts.map +1 -1
- package/dist/umd/hooks/useUpdateNodeInternals.d.ts +5 -4
- package/dist/umd/hooks/useUpdateNodeInternals.d.ts.map +1 -1
- package/dist/umd/hooks/useViewport.d.ts +3 -3
- package/dist/umd/index.js +2 -2
- package/dist/umd/types/component-props.d.ts +234 -116
- package/dist/umd/types/component-props.d.ts.map +1 -1
- package/dist/umd/types/edges.d.ts +26 -8
- package/dist/umd/types/edges.d.ts.map +1 -1
- package/dist/umd/types/general.d.ts +11 -6
- package/dist/umd/types/general.d.ts.map +1 -1
- package/dist/umd/types/instance.d.ts +23 -8
- package/dist/umd/types/instance.d.ts.map +1 -1
- package/dist/umd/utils/changes.d.ts +6 -6
- package/dist/umd/utils/general.d.ts +11 -7
- package/dist/umd/utils/general.d.ts.map +1 -1
- package/package.json +4 -4
|
@@ -3,11 +3,9 @@ import type { Node } from '../types';
|
|
|
3
3
|
* This hook lets you subscribe to changes of a specific nodes `data` object.
|
|
4
4
|
*
|
|
5
5
|
* @public
|
|
6
|
-
* @
|
|
7
|
-
* @returns An object (or array of object) with {id, type, data} representing each node
|
|
6
|
+
* @returns An object (or array of object) with `id`, `type`, `data` representing each node.
|
|
8
7
|
*
|
|
9
8
|
* @example
|
|
10
|
-
*
|
|
11
9
|
*```jsx
|
|
12
10
|
*import { useNodesData } from '@xyflow/react';
|
|
13
11
|
*
|
|
@@ -19,6 +17,10 @@ import type { Node } from '../types';
|
|
|
19
17
|
*}
|
|
20
18
|
*```
|
|
21
19
|
*/
|
|
22
|
-
export declare function useNodesData<NodeType extends Node = Node>(
|
|
23
|
-
|
|
20
|
+
export declare function useNodesData<NodeType extends Node = Node>(
|
|
21
|
+
/** The id of the node to get the data from. */
|
|
22
|
+
nodeId: string): Pick<NodeType, 'id' | 'type' | 'data'> | null;
|
|
23
|
+
export declare function useNodesData<NodeType extends Node = Node>(
|
|
24
|
+
/** The ids of the nodes to get the data from. */
|
|
25
|
+
nodeIds: string[]): Pick<NodeType, 'id' | 'type' | 'data'>[];
|
|
24
26
|
//# sourceMappingURL=useNodesData.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useNodesData.d.ts","sourceRoot":"","sources":["../../src/hooks/useNodesData.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAErC
|
|
1
|
+
{"version":3,"file":"useNodesData.d.ts","sourceRoot":"","sources":["../../src/hooks/useNodesData.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAErC;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI;AACvD,+CAA+C;AAC/C,MAAM,EAAE,MAAM,GACb,IAAI,CAAC,QAAQ,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC,GAAG,IAAI,CAAC;AACjD,wBAAgB,YAAY,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI;AACvD,iDAAiD;AACjD,OAAO,EAAE,MAAM,EAAE,GAChB,IAAI,CAAC,QAAQ,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC"}
|
|
@@ -6,8 +6,16 @@ import type { Node, Edge, OnNodesChange, OnEdgesChange } from '../types';
|
|
|
6
6
|
* like React's `useState` hook with an additional helper callback.
|
|
7
7
|
*
|
|
8
8
|
* @public
|
|
9
|
-
* @
|
|
10
|
-
*
|
|
9
|
+
* @returns
|
|
10
|
+
* - `nodes`: The current array of nodes. You might pass this directly to the `nodes` prop of your
|
|
11
|
+
* `<ReactFlow />` component, or you may want to manipulate it first to perform some layouting,
|
|
12
|
+
* for example.
|
|
13
|
+
* - `setNodes`: A function that you can use to update the nodes. You can pass it a new array of
|
|
14
|
+
* nodes or a callback that receives the current array of nodes and returns a new array of nodes.
|
|
15
|
+
* This is the same as the second element of the tuple returned by React's `useState` hook.
|
|
16
|
+
* - `onNodesChange`: A handy callback that can take an array of `NodeChanges` and update the nodes
|
|
17
|
+
* state accordingly. You'll typically pass this directly to the `onNodesChange` prop of your
|
|
18
|
+
* `<ReactFlow />` component.
|
|
11
19
|
* @example
|
|
12
20
|
*
|
|
13
21
|
*```tsx
|
|
@@ -37,15 +45,29 @@ import type { Node, Edge, OnNodesChange, OnEdgesChange } from '../types';
|
|
|
37
45
|
* like Zustand {@link https://reactflow.dev/docs/guides/state-management/} instead.
|
|
38
46
|
*
|
|
39
47
|
*/
|
|
40
|
-
export declare function useNodesState<NodeType extends Node>(initialNodes: NodeType[]): [
|
|
48
|
+
export declare function useNodesState<NodeType extends Node>(initialNodes: NodeType[]): [
|
|
49
|
+
nodes: NodeType[],
|
|
50
|
+
setNodes: Dispatch<SetStateAction<NodeType[]>>,
|
|
51
|
+
onNodesChange: OnNodesChange<NodeType>
|
|
52
|
+
];
|
|
41
53
|
/**
|
|
42
54
|
* This hook makes it easy to prototype a controlled flow where you manage the
|
|
43
55
|
* state of nodes and edges outside the `ReactFlowInstance`. You can think of it
|
|
44
56
|
* like React's `useState` hook with an additional helper callback.
|
|
45
57
|
*
|
|
46
58
|
* @public
|
|
47
|
-
* @
|
|
48
|
-
*
|
|
59
|
+
* @returns
|
|
60
|
+
* - `edges`: The current array of edges. You might pass this directly to the `edges` prop of your
|
|
61
|
+
* `<ReactFlow />` component, or you may want to manipulate it first to perform some layouting,
|
|
62
|
+
* for example.
|
|
63
|
+
*
|
|
64
|
+
* - `setEdges`: A function that you can use to update the edges. You can pass it a new array of
|
|
65
|
+
* edges or a callback that receives the current array of edges and returns a new array of edges.
|
|
66
|
+
* This is the same as the second element of the tuple returned by React's `useState` hook.
|
|
67
|
+
*
|
|
68
|
+
* - `onEdgesChange`: A handy callback that can take an array of `EdgeChanges` and update the edges
|
|
69
|
+
* state accordingly. You'll typically pass this directly to the `onEdgesChange` prop of your
|
|
70
|
+
* `<ReactFlow />` component.
|
|
49
71
|
* @example
|
|
50
72
|
*
|
|
51
73
|
*```tsx
|
|
@@ -75,5 +97,9 @@ export declare function useNodesState<NodeType extends Node>(initialNodes: NodeT
|
|
|
75
97
|
* like Zustand {@link https://reactflow.dev/docs/guides/state-management/} instead.
|
|
76
98
|
*
|
|
77
99
|
*/
|
|
78
|
-
export declare function useEdgesState<EdgeType extends Edge = Edge>(initialEdges: EdgeType[]): [
|
|
100
|
+
export declare function useEdgesState<EdgeType extends Edge = Edge>(initialEdges: EdgeType[]): [
|
|
101
|
+
edges: EdgeType[],
|
|
102
|
+
setEdges: Dispatch<SetStateAction<EdgeType[]>>,
|
|
103
|
+
onEdgesChange: OnEdgesChange<EdgeType>
|
|
104
|
+
];
|
|
79
105
|
//# sourceMappingURL=useNodesEdgesState.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useNodesEdgesState.d.ts","sourceRoot":"","sources":["../../src/hooks/useNodesEdgesState.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAGlF,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzE
|
|
1
|
+
{"version":3,"file":"useNodesEdgesState.d.ts","sourceRoot":"","sources":["../../src/hooks/useNodesEdgesState.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAGlF,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,wBAAgB,aAAa,CAAC,QAAQ,SAAS,IAAI,EACjD,YAAY,EAAE,QAAQ,EAAE,GACvB;IAED,KAAK,EAAE,QAAQ,EAAE;IACjB,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAAC;IAC9C,aAAa,EAAE,aAAa,CAAC,QAAQ,CAAC;CACvC,CAQA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,wBAAgB,aAAa,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EACxD,YAAY,EAAE,QAAQ,EAAE,GACvB;IAED,KAAK,EAAE,QAAQ,EAAE;IACjB,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAAC;IAC9C,aAAa,EAAE,aAAa,CAAC,QAAQ,CAAC;CACvC,CAQA"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export type UseNodesInitializedOptions = {
|
|
2
|
+
/** @default false */
|
|
2
3
|
includeHiddenNodes?: boolean;
|
|
3
4
|
};
|
|
4
5
|
/**
|
|
@@ -7,8 +8,8 @@ export type UseNodesInitializedOptions = {
|
|
|
7
8
|
*`false` and then `true` again once the node has been measured.
|
|
8
9
|
*
|
|
9
10
|
* @public
|
|
10
|
-
* @
|
|
11
|
-
*
|
|
11
|
+
* @returns Whether or not the nodes have been initialized by the `<ReactFlow />` component and
|
|
12
|
+
* given a width and height.
|
|
12
13
|
*
|
|
13
14
|
* @example
|
|
14
15
|
* ```jsx
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useNodesInitialized.d.ts","sourceRoot":"","sources":["../../src/hooks/useNodesInitialized.ts"],"names":[],"mappings":"AAKA,MAAM,MAAM,0BAA0B,GAAG;IACvC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAkBF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,mBAAmB,CACjC,OAAO,GAAE,0BAER,GACA,OAAO,CAIT"}
|
|
1
|
+
{"version":3,"file":"useNodesInitialized.d.ts","sourceRoot":"","sources":["../../src/hooks/useNodesInitialized.ts"],"names":[],"mappings":"AAKA,MAAM,MAAM,0BAA0B,GAAG;IACvC,qBAAqB;IACrB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAkBF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,mBAAmB,CACjC,OAAO,GAAE,0BAER,GACA,OAAO,CAIT"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { OnSelectionChangeFunc, Node, Edge } from '../types';
|
|
2
2
|
export type UseOnSelectionChangeOptions<NodeType extends Node = Node, EdgeType extends Edge = Edge> = {
|
|
3
|
+
/** The handler to register. */
|
|
3
4
|
onChange: OnSelectionChangeFunc<NodeType, EdgeType>;
|
|
4
5
|
};
|
|
5
6
|
/**
|
|
@@ -8,8 +9,6 @@ export type UseOnSelectionChangeOptions<NodeType extends Node = Node, EdgeType e
|
|
|
8
9
|
*_either_ nodes or edges changes.
|
|
9
10
|
*
|
|
10
11
|
* @public
|
|
11
|
-
* @param params.onChange - The handler to register
|
|
12
|
-
*
|
|
13
12
|
* @example
|
|
14
13
|
* ```jsx
|
|
15
14
|
*import { useState } from 'react';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useOnSelectionChange.d.ts","sourceRoot":"","sources":["../../src/hooks/useOnSelectionChange.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAElE,MAAM,MAAM,2BAA2B,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI,IAAI;IACpG,QAAQ,EAAE,qBAAqB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;CACrD,CAAC;AAEF
|
|
1
|
+
{"version":3,"file":"useOnSelectionChange.d.ts","sourceRoot":"","sources":["../../src/hooks/useOnSelectionChange.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAElE,MAAM,MAAM,2BAA2B,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI,IAAI;IACpG,+BAA+B;IAC/B,QAAQ,EAAE,qBAAqB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;CACrD,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,oBAAoB,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,EAC/F,QAAQ,GACT,EAAE,2BAA2B,CAAC,QAAQ,EAAE,QAAQ,CAAC,QAYjD"}
|
|
@@ -1,19 +1,18 @@
|
|
|
1
1
|
import type { OnViewportChange } from '@xyflow/system';
|
|
2
2
|
export type UseOnViewportChangeOptions = {
|
|
3
|
+
/** Gets called when the viewport starts changing. */
|
|
3
4
|
onStart?: OnViewportChange;
|
|
5
|
+
/** Gets called when the viewport changes. */
|
|
4
6
|
onChange?: OnViewportChange;
|
|
7
|
+
/** Gets called when the viewport stops changing. */
|
|
5
8
|
onEnd?: OnViewportChange;
|
|
6
9
|
};
|
|
7
10
|
/**
|
|
8
11
|
* The `useOnViewportChange` hook lets you listen for changes to the viewport such
|
|
9
|
-
*as panning and zooming. You can provide a callback for each phase of a viewport
|
|
10
|
-
*change: `onStart`, `onChange`, and `onEnd`.
|
|
12
|
+
* as panning and zooming. You can provide a callback for each phase of a viewport
|
|
13
|
+
* change: `onStart`, `onChange`, and `onEnd`.
|
|
11
14
|
*
|
|
12
15
|
* @public
|
|
13
|
-
* @param params.onStart - gets called when the viewport starts changing
|
|
14
|
-
* @param params.onChange - gets called when the viewport changes
|
|
15
|
-
* @param params.onEnd - gets called when the viewport stops changing
|
|
16
|
-
*
|
|
17
16
|
* @example
|
|
18
17
|
* ```jsx
|
|
19
18
|
*import { useCallback } from 'react';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useOnViewportChange.d.ts","sourceRoot":"","sources":["../../src/hooks/useOnViewportChange.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAIvD,MAAM,MAAM,0BAA0B,GAAG;IACvC,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B,CAAC;AAEF
|
|
1
|
+
{"version":3,"file":"useOnViewportChange.d.ts","sourceRoot":"","sources":["../../src/hooks/useOnViewportChange.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAIvD,MAAM,MAAM,0BAA0B,GAAG;IACvC,qDAAqD;IACrD,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B,oDAAoD;IACpD,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,mBAAmB,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,0BAA0B,QAc3F"}
|
|
@@ -3,8 +3,6 @@ import type { ReactFlowInstance, Node, Edge } from '../types';
|
|
|
3
3
|
* This hook returns a ReactFlowInstance that can be used to update nodes and edges, manipulate the viewport, or query the current state of the flow.
|
|
4
4
|
*
|
|
5
5
|
* @public
|
|
6
|
-
* @returns ReactFlowInstance
|
|
7
|
-
*
|
|
8
6
|
* @example
|
|
9
7
|
* ```jsx
|
|
10
8
|
*import { useCallback, useState } from 'react';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useReactFlow.d.ts","sourceRoot":"","sources":["../../src/hooks/useReactFlow.ts"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EACV,iBAAiB,EACjB,IAAI,EACJ,IAAI,EAKL,MAAM,UAAU,CAAC;AAIlB
|
|
1
|
+
{"version":3,"file":"useReactFlow.d.ts","sourceRoot":"","sources":["../../src/hooks/useReactFlow.ts"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EACV,iBAAiB,EACjB,IAAI,EACJ,IAAI,EAKL,MAAM,UAAU,CAAC;AAIlB;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,YAAY,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI,KAAK,iBAAiB,CAC3G,QAAQ,EACR,QAAQ,CACT,CAiPA"}
|
|
@@ -5,9 +5,13 @@ import type { Edge, Node, ReactFlowState } from '../types';
|
|
|
5
5
|
* state management library, so you should check out their docs for more details.
|
|
6
6
|
*
|
|
7
7
|
* @public
|
|
8
|
-
* @param selector
|
|
9
|
-
*
|
|
10
|
-
*
|
|
8
|
+
* @param selector - A selector function that returns a slice of the flow's internal state.
|
|
9
|
+
* Extracting or transforming just the state you need is a good practice to avoid unnecessary
|
|
10
|
+
* re-renders.
|
|
11
|
+
* @param equalityFn - A function to compare the previous and next value. This is incredibly useful
|
|
12
|
+
* for preventing unnecessary re-renders. Good sensible defaults are using `Object.is` or importing
|
|
13
|
+
* `zustand/shallow`, but you can be as granular as you like.
|
|
14
|
+
* @returns The selected state slice.
|
|
11
15
|
*
|
|
12
16
|
* @example
|
|
13
17
|
* ```ts
|
|
@@ -22,8 +26,7 @@ declare function useStore<StateSlice = unknown>(selector: (state: ReactFlowState
|
|
|
22
26
|
/**
|
|
23
27
|
* In some cases, you might need to access the store directly. This hook returns the store object which can be used on demand to access the state or dispatch actions.
|
|
24
28
|
*
|
|
25
|
-
* @returns The store object
|
|
26
|
-
*
|
|
29
|
+
* @returns The store object.
|
|
27
30
|
* @example
|
|
28
31
|
* ```ts
|
|
29
32
|
* const store = useStoreApi();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useStore.d.ts","sourceRoot":"","sources":["../../src/hooks/useStore.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAI3D
|
|
1
|
+
{"version":3,"file":"useStore.d.ts","sourceRoot":"","sources":["../../src/hooks/useStore.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAI3D;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,iBAAS,QAAQ,CAAC,UAAU,GAAG,OAAO,EACpC,QAAQ,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,UAAU,EAC/C,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,UAAU,KAAK,OAAO,cASvD;AAED;;;;;;;;;;;;GAYG;AACH,iBAAS,WAAW,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI;;;;EAiB9E;AAED,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import type { UpdateNodeInternals } from '@xyflow/system';
|
|
2
2
|
/**
|
|
3
3
|
* When you programmatically add or remove handles to a node or update a node's
|
|
4
|
-
*handle position, you need to let React Flow know about it using this hook. This
|
|
5
|
-
*will update the internal dimensions of the node and properly reposition handles
|
|
6
|
-
*on the canvas if necessary.
|
|
4
|
+
* handle position, you need to let React Flow know about it using this hook. This
|
|
5
|
+
* will update the internal dimensions of the node and properly reposition handles
|
|
6
|
+
* on the canvas if necessary.
|
|
7
7
|
*
|
|
8
8
|
* @public
|
|
9
|
-
* @returns function
|
|
9
|
+
* @returns Use this function to tell React Flow to update the internal state of one or more nodes
|
|
10
|
+
* that you have changed programmatically.
|
|
10
11
|
*
|
|
11
12
|
* @example
|
|
12
13
|
* ```jsx
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useUpdateNodeInternals.d.ts","sourceRoot":"","sources":["../../src/hooks/useUpdateNodeInternals.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAsB,MAAM,gBAAgB,CAAC;AAI9E
|
|
1
|
+
{"version":3,"file":"useUpdateNodeInternals.d.ts","sourceRoot":"","sources":["../../src/hooks/useUpdateNodeInternals.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAsB,MAAM,gBAAgB,CAAC;AAI9E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,wBAAgB,sBAAsB,IAAI,mBAAmB,CAkB5D"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import type { Viewport } from '@xyflow/system';
|
|
2
2
|
/**
|
|
3
3
|
* The `useViewport` hook is a convenient way to read the current state of the
|
|
4
|
-
*{@link Viewport} in a component. Components that use this hook
|
|
5
|
-
*will re-render **whenever the viewport changes**.
|
|
4
|
+
* {@link Viewport} in a component. Components that use this hook
|
|
5
|
+
* will re-render **whenever the viewport changes**.
|
|
6
6
|
*
|
|
7
7
|
* @public
|
|
8
|
-
* @returns The current viewport
|
|
8
|
+
* @returns The current viewport.
|
|
9
9
|
*
|
|
10
10
|
* @example
|
|
11
11
|
*
|