@uipath/apollo-react 4.12.0 → 4.12.1-pr556.9394355

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.
Files changed (118) hide show
  1. package/dist/canvas/components/AddNodePanel/AddNodeManager.cjs +26 -7
  2. package/dist/canvas/components/AddNodePanel/AddNodeManager.d.ts.map +1 -1
  3. package/dist/canvas/components/AddNodePanel/AddNodeManager.js +26 -7
  4. package/dist/canvas/components/AddNodePanel/createAddNodePreview.cjs +2 -2
  5. package/dist/canvas/components/AddNodePanel/createAddNodePreview.d.ts +8 -1
  6. package/dist/canvas/components/AddNodePanel/createAddNodePreview.d.ts.map +1 -1
  7. package/dist/canvas/components/AddNodePanel/createAddNodePreview.js +2 -2
  8. package/dist/canvas/components/AgentCanvas/agent-flow.manifest.d.ts +1 -0
  9. package/dist/canvas/components/AgentCanvas/agent-flow.manifest.d.ts.map +1 -1
  10. package/dist/canvas/components/BaseNode/BaseNode.cjs +8 -3
  11. package/dist/canvas/components/BaseNode/BaseNode.d.ts +2 -1
  12. package/dist/canvas/components/BaseNode/BaseNode.d.ts.map +1 -1
  13. package/dist/canvas/components/BaseNode/BaseNode.js +5 -3
  14. package/dist/canvas/components/ButtonHandle/ButtonHandle.cjs +115 -34
  15. package/dist/canvas/components/ButtonHandle/ButtonHandle.d.ts +4 -2
  16. package/dist/canvas/components/ButtonHandle/ButtonHandle.d.ts.map +1 -1
  17. package/dist/canvas/components/ButtonHandle/ButtonHandle.js +117 -36
  18. package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.cjs +48 -1
  19. package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.d.ts +4 -0
  20. package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.d.ts.map +1 -1
  21. package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.js +36 -1
  22. package/dist/canvas/components/ButtonHandle/SmartHandle.cjs +1 -1
  23. package/dist/canvas/components/ButtonHandle/SmartHandle.js +1 -1
  24. package/dist/canvas/components/Edges/SequenceEdge.cjs +3 -2
  25. package/dist/canvas/components/Edges/SequenceEdge.d.ts +11 -2
  26. package/dist/canvas/components/Edges/SequenceEdge.d.ts.map +1 -1
  27. package/dist/canvas/components/Edges/SequenceEdge.js +4 -3
  28. package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.cjs +20 -10
  29. package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.d.ts +2 -0
  30. package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.d.ts.map +1 -1
  31. package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.js +21 -11
  32. package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvasWithControls.cjs +5 -8
  33. package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvasWithControls.d.ts.map +1 -1
  34. package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvasWithControls.js +5 -8
  35. package/dist/canvas/components/LoopNode/LoopCanvasNode.cjs +80 -0
  36. package/dist/canvas/components/LoopNode/LoopCanvasNode.d.ts +6 -0
  37. package/dist/canvas/components/LoopNode/LoopCanvasNode.d.ts.map +1 -0
  38. package/dist/canvas/components/LoopNode/LoopCanvasNode.js +46 -0
  39. package/dist/canvas/components/LoopNode/LoopNode.cjs +440 -0
  40. package/dist/canvas/components/LoopNode/LoopNode.constants.cjs +77 -0
  41. package/dist/canvas/components/LoopNode/LoopNode.constants.d.ts +12 -0
  42. package/dist/canvas/components/LoopNode/LoopNode.constants.d.ts.map +1 -0
  43. package/dist/canvas/components/LoopNode/LoopNode.constants.js +13 -0
  44. package/dist/canvas/components/LoopNode/LoopNode.d.ts +5 -0
  45. package/dist/canvas/components/LoopNode/LoopNode.d.ts.map +1 -0
  46. package/dist/canvas/components/LoopNode/LoopNode.helpers.cjs +110 -0
  47. package/dist/canvas/components/LoopNode/LoopNode.helpers.d.ts +19 -0
  48. package/dist/canvas/components/LoopNode/LoopNode.helpers.d.ts.map +1 -0
  49. package/dist/canvas/components/LoopNode/LoopNode.helpers.js +70 -0
  50. package/dist/canvas/components/LoopNode/LoopNode.js +406 -0
  51. package/dist/canvas/components/LoopNode/LoopNode.types.cjs +18 -0
  52. package/dist/canvas/components/LoopNode/LoopNode.types.d.ts +16 -0
  53. package/dist/canvas/components/LoopNode/LoopNode.types.d.ts.map +1 -0
  54. package/dist/canvas/components/LoopNode/LoopNode.types.js +0 -0
  55. package/dist/canvas/components/LoopNode/LoopNodePreview.cjs +81 -0
  56. package/dist/canvas/components/LoopNode/LoopNodePreview.d.ts +8 -0
  57. package/dist/canvas/components/LoopNode/LoopNodePreview.d.ts.map +1 -0
  58. package/dist/canvas/components/LoopNode/LoopNodePreview.js +44 -0
  59. package/dist/canvas/components/LoopNode/index.cjs +72 -0
  60. package/dist/canvas/components/LoopNode/index.d.ts +4 -0
  61. package/dist/canvas/components/LoopNode/index.d.ts.map +1 -0
  62. package/dist/canvas/components/LoopNode/index.js +3 -0
  63. package/dist/canvas/components/Toolbar/EdgeToolbar/useEdgeToolbarState.cjs +20 -18
  64. package/dist/canvas/components/Toolbar/EdgeToolbar/useEdgeToolbarState.d.ts +2 -1
  65. package/dist/canvas/components/Toolbar/EdgeToolbar/useEdgeToolbarState.d.ts.map +1 -1
  66. package/dist/canvas/components/Toolbar/EdgeToolbar/useEdgeToolbarState.js +21 -19
  67. package/dist/canvas/components/Toolbox/ListView.cjs +3 -2
  68. package/dist/canvas/components/Toolbox/ListView.d.ts +1 -0
  69. package/dist/canvas/components/Toolbox/ListView.d.ts.map +1 -1
  70. package/dist/canvas/components/Toolbox/ListView.js +3 -2
  71. package/dist/canvas/components/Toolbox/Toolbox.cjs +38 -9
  72. package/dist/canvas/components/Toolbox/Toolbox.d.ts.map +1 -1
  73. package/dist/canvas/components/Toolbox/Toolbox.js +38 -9
  74. package/dist/canvas/components/index.cjs +27 -20
  75. package/dist/canvas/components/index.d.ts +1 -0
  76. package/dist/canvas/components/index.d.ts.map +1 -1
  77. package/dist/canvas/components/index.js +1 -0
  78. package/dist/canvas/core/NodeTypeRegistry.cjs +41 -23
  79. package/dist/canvas/core/NodeTypeRegistry.d.ts +8 -4
  80. package/dist/canvas/core/NodeTypeRegistry.d.ts.map +1 -1
  81. package/dist/canvas/core/NodeTypeRegistry.js +41 -23
  82. package/dist/canvas/core/useNodeTypeRegistry.cjs +4 -3
  83. package/dist/canvas/core/useNodeTypeRegistry.d.ts +1 -1
  84. package/dist/canvas/core/useNodeTypeRegistry.d.ts.map +1 -1
  85. package/dist/canvas/core/useNodeTypeRegistry.js +4 -3
  86. package/dist/canvas/hooks/useAddNodeOnConnectEnd.cjs +4 -3
  87. package/dist/canvas/hooks/useAddNodeOnConnectEnd.d.ts.map +1 -1
  88. package/dist/canvas/hooks/useAddNodeOnConnectEnd.js +4 -3
  89. package/dist/canvas/hooks/usePreviewNode.cjs +4 -2
  90. package/dist/canvas/hooks/usePreviewNode.d.ts.map +1 -1
  91. package/dist/canvas/hooks/usePreviewNode.js +4 -2
  92. package/dist/canvas/schema/node-definition/handle.cjs +10 -2
  93. package/dist/canvas/schema/node-definition/handle.d.ts +9 -0
  94. package/dist/canvas/schema/node-definition/handle.d.ts.map +1 -1
  95. package/dist/canvas/schema/node-definition/handle.js +6 -1
  96. package/dist/canvas/schema/node-definition/index.cjs +4 -1
  97. package/dist/canvas/schema/node-definition/index.d.ts +3 -3
  98. package/dist/canvas/schema/node-definition/index.d.ts.map +1 -1
  99. package/dist/canvas/schema/node-definition/index.js +2 -2
  100. package/dist/canvas/schema/node-definition/node-manifest.d.ts +4 -0
  101. package/dist/canvas/schema/node-definition/node-manifest.d.ts.map +1 -1
  102. package/dist/canvas/storybook-utils/manifests/index.d.ts +1 -0
  103. package/dist/canvas/storybook-utils/manifests/index.d.ts.map +1 -1
  104. package/dist/canvas/storybook-utils/manifests/node-definitions.d.ts.map +1 -1
  105. package/dist/canvas/styles/tailwind.canvas.css +1 -1
  106. package/dist/canvas/utils/createPreviewGraph.cjs +94 -0
  107. package/dist/canvas/utils/createPreviewGraph.d.ts +24 -0
  108. package/dist/canvas/utils/createPreviewGraph.d.ts.map +1 -0
  109. package/dist/canvas/utils/createPreviewGraph.js +51 -0
  110. package/dist/canvas/utils/createPreviewNode.cjs +29 -13
  111. package/dist/canvas/utils/createPreviewNode.d.ts +5 -1
  112. package/dist/canvas/utils/createPreviewNode.d.ts.map +1 -1
  113. package/dist/canvas/utils/createPreviewNode.js +23 -13
  114. package/dist/canvas/utils/index.cjs +33 -26
  115. package/dist/canvas/utils/index.d.ts +2 -1
  116. package/dist/canvas/utils/index.d.ts.map +1 -1
  117. package/dist/canvas/utils/index.js +2 -1
  118. package/package.json +1 -1
@@ -0,0 +1,3 @@
1
+ export * from "./LoopCanvasNode.js";
2
+ export * from "./LoopNode.js";
3
+ export * from "./LoopNode.types.js";
@@ -29,10 +29,11 @@ __webpack_require__.d(__webpack_exports__, {
29
29
  const react_cjs_namespaceObject = require("../../../xyflow/react.cjs");
30
30
  const external_react_namespaceObject = require("react");
31
31
  const external_constants_cjs_namespaceObject = require("../../../constants.cjs");
32
+ const createPreviewGraph_cjs_namespaceObject = require("../../../utils/createPreviewGraph.cjs");
32
33
  const createPreviewNode_cjs_namespaceObject = require("../../../utils/createPreviewNode.cjs");
33
34
  const BaseCanvasModeProvider_cjs_namespaceObject = require("../../BaseCanvas/BaseCanvasModeProvider.cjs");
34
35
  const external_useEdgeToolbarPositioning_cjs_namespaceObject = require("./useEdgeToolbarPositioning.cjs");
35
- function useEdgeToolbarState({ edgeId, pathElementRef, isHovered, source, target, sourceHandleId, targetHandleId, sourcePosition, targetPosition, ignoredNodeTypes }) {
36
+ function useEdgeToolbarState({ edgeId, pathElementRef, isHovered, source, target, sourceHandleId, targetHandleId, sourcePosition, targetPosition, ignoredNodeTypes, parentId }) {
36
37
  const reactFlow = (0, react_cjs_namespaceObject.useReactFlow)();
37
38
  const { mode } = (0, BaseCanvasModeProvider_cjs_namespaceObject.useBaseCanvasMode)();
38
39
  const isDesignMode = 'design' === mode;
@@ -43,34 +44,34 @@ function useEdgeToolbarState({ edgeId, pathElementRef, isHovered, source, target
43
44
  targetPosition
44
45
  });
45
46
  const handleAddNodeOnEdge = (0, external_react_namespaceObject.useCallback)((position)=>{
47
+ const previewEdgeData = parentId ? {
48
+ parentId
49
+ } : void 0;
46
50
  const originalEdge = {
47
51
  id: edgeId,
48
52
  source,
49
53
  sourceHandle: sourceHandleId,
50
54
  target,
51
55
  targetHandle: targetHandleId,
52
- type: 'default'
56
+ type: 'default',
57
+ data: previewEdgeData
53
58
  };
54
59
  const preview = (0, createPreviewNode_cjs_namespaceObject.createPreviewNode)(source, sourceHandleId || 'output', reactFlow, position, {
55
60
  originalEdge
56
61
  }, 'source', void 0, sourcePosition, ignoredNodeTypes);
57
62
  if (!preview) return;
58
- const secondEdge = {
59
- id: `${external_constants_cjs_namespaceObject.PREVIEW_NODE_ID}-${target}`,
60
- source: external_constants_cjs_namespaceObject.PREVIEW_NODE_ID,
61
- sourceHandle: 'output',
63
+ const previewGraph = (0, createPreviewGraph_cjs_namespaceObject.createPreviewGraph)({
64
+ preview,
62
65
  target,
63
- targetHandle: targetHandleId,
64
- type: 'default'
65
- };
66
- (0, createPreviewNode_cjs_namespaceObject.applyPreviewToReactFlow)(preview, reactFlow);
67
- reactFlow.setEdges((edges)=>[
68
- ...edges.filter((e)=>e.id !== edgeId).map((e)=>({
69
- ...e,
70
- selected: false
71
- })),
72
- secondEdge
73
- ]);
66
+ targetHandleId,
67
+ reactFlowInstance: reactFlow,
68
+ containerId: parentId,
69
+ removedEdgeIds: [
70
+ edgeId
71
+ ]
72
+ });
73
+ if (!previewGraph) return;
74
+ (0, createPreviewNode_cjs_namespaceObject.applyPreviewGraphToReactFlow)(previewGraph, reactFlow);
74
75
  }, [
75
76
  sourcePosition,
76
77
  source,
@@ -79,7 +80,8 @@ function useEdgeToolbarState({ edgeId, pathElementRef, isHovered, source, target
79
80
  target,
80
81
  targetHandleId,
81
82
  edgeId,
82
- ignoredNodeTypes
83
+ ignoredNodeTypes,
84
+ parentId
83
85
  ]);
84
86
  const config = (0, external_react_namespaceObject.useMemo)(()=>({
85
87
  actions: [
@@ -11,6 +11,7 @@ export interface UseEdgeToolbarStateProps {
11
11
  sourcePosition: Position;
12
12
  targetPosition: Position;
13
13
  ignoredNodeTypes?: string[];
14
+ parentId?: string;
14
15
  }
15
16
  export interface EdgeToolbarState {
16
17
  showToolbar: boolean;
@@ -18,5 +19,5 @@ export interface EdgeToolbarState {
18
19
  config: EdgeToolbarConfig;
19
20
  handleMouseMoveOnPath?: (event: React.MouseEvent) => void;
20
21
  }
21
- export declare function useEdgeToolbarState({ edgeId, pathElementRef, isHovered, source, target, sourceHandleId, targetHandleId, sourcePosition, targetPosition, ignoredNodeTypes, }: UseEdgeToolbarStateProps): EdgeToolbarState;
22
+ export declare function useEdgeToolbarState({ edgeId, pathElementRef, isHovered, source, target, sourceHandleId, targetHandleId, sourcePosition, targetPosition, ignoredNodeTypes, parentId, }: UseEdgeToolbarStateProps): EdgeToolbarState;
22
23
  //# sourceMappingURL=useEdgeToolbarState.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"useEdgeToolbarState.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/Toolbar/EdgeToolbar/useEdgeToolbarState.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,QAAQ,EAAgB,MAAM,0CAA0C,CAAC;AAKlG,OAAO,KAAK,EAAE,iBAAiB,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAGtF,MAAM,WAAW,wBAAwB;IACvC,MAAM,EAAE,MAAM,CAAC;IACf,cAAc,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC9D,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,cAAc,EAAE,QAAQ,CAAC;IACzB,cAAc,EAAE,QAAQ,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;CAC7B;AAED,MAAM,WAAW,gBAAgB;IAC/B,WAAW,EAAE,OAAO,CAAC;IACrB,kBAAkB,EAAE,uBAAuB,GAAG,IAAI,CAAC;IACnD,MAAM,EAAE,iBAAiB,CAAC;IAC1B,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CAC3D;AAED,wBAAgB,mBAAmB,CAAC,EAClC,MAAM,EACN,cAAc,EACd,SAAS,EACT,MAAM,EACN,MAAM,EACN,cAAc,EACd,cAAc,EACd,cAAc,EACd,cAAc,EACd,gBAAgB,GACjB,EAAE,wBAAwB,GAAG,gBAAgB,CAoG7C"}
1
+ {"version":3,"file":"useEdgeToolbarState.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/Toolbar/EdgeToolbar/useEdgeToolbarState.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,QAAQ,EAAgB,MAAM,0CAA0C,CAAC;AAMlG,OAAO,KAAK,EAAE,iBAAiB,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAGtF,MAAM,WAAW,wBAAwB;IACvC,MAAM,EAAE,MAAM,CAAC;IACf,cAAc,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC9D,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,cAAc,EAAE,QAAQ,CAAC;IACzB,cAAc,EAAE,QAAQ,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,gBAAgB;IAC/B,WAAW,EAAE,OAAO,CAAC;IACrB,kBAAkB,EAAE,uBAAuB,GAAG,IAAI,CAAC;IACnD,MAAM,EAAE,iBAAiB,CAAC;IAC1B,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CAC3D;AAED,wBAAgB,mBAAmB,CAAC,EAClC,MAAM,EACN,cAAc,EACd,SAAS,EACT,MAAM,EACN,MAAM,EACN,cAAc,EACd,cAAc,EACd,cAAc,EACd,cAAc,EACd,gBAAgB,EAChB,QAAQ,GACT,EAAE,wBAAwB,GAAG,gBAAgB,CAiG7C"}
@@ -1,10 +1,11 @@
1
1
  import { useReactFlow } from "../../../xyflow/react.js";
2
2
  import { useCallback, useMemo } from "react";
3
3
  import { PREVIEW_NODE_ID } from "../../../constants.js";
4
- import { applyPreviewToReactFlow, createPreviewNode } from "../../../utils/createPreviewNode.js";
4
+ import { createPreviewGraph } from "../../../utils/createPreviewGraph.js";
5
+ import { applyPreviewGraphToReactFlow, createPreviewNode } from "../../../utils/createPreviewNode.js";
5
6
  import { useBaseCanvasMode } from "../../BaseCanvas/BaseCanvasModeProvider.js";
6
7
  import { useEdgeToolbarPositioning } from "./useEdgeToolbarPositioning.js";
7
- function useEdgeToolbarState({ edgeId, pathElementRef, isHovered, source, target, sourceHandleId, targetHandleId, sourcePosition, targetPosition, ignoredNodeTypes }) {
8
+ function useEdgeToolbarState({ edgeId, pathElementRef, isHovered, source, target, sourceHandleId, targetHandleId, sourcePosition, targetPosition, ignoredNodeTypes, parentId }) {
8
9
  const reactFlow = useReactFlow();
9
10
  const { mode } = useBaseCanvasMode();
10
11
  const isDesignMode = 'design' === mode;
@@ -15,34 +16,34 @@ function useEdgeToolbarState({ edgeId, pathElementRef, isHovered, source, target
15
16
  targetPosition
16
17
  });
17
18
  const handleAddNodeOnEdge = useCallback((position)=>{
19
+ const previewEdgeData = parentId ? {
20
+ parentId
21
+ } : void 0;
18
22
  const originalEdge = {
19
23
  id: edgeId,
20
24
  source,
21
25
  sourceHandle: sourceHandleId,
22
26
  target,
23
27
  targetHandle: targetHandleId,
24
- type: 'default'
28
+ type: 'default',
29
+ data: previewEdgeData
25
30
  };
26
31
  const preview = createPreviewNode(source, sourceHandleId || 'output', reactFlow, position, {
27
32
  originalEdge
28
33
  }, 'source', void 0, sourcePosition, ignoredNodeTypes);
29
34
  if (!preview) return;
30
- const secondEdge = {
31
- id: `${PREVIEW_NODE_ID}-${target}`,
32
- source: PREVIEW_NODE_ID,
33
- sourceHandle: 'output',
35
+ const previewGraph = createPreviewGraph({
36
+ preview,
34
37
  target,
35
- targetHandle: targetHandleId,
36
- type: 'default'
37
- };
38
- applyPreviewToReactFlow(preview, reactFlow);
39
- reactFlow.setEdges((edges)=>[
40
- ...edges.filter((e)=>e.id !== edgeId).map((e)=>({
41
- ...e,
42
- selected: false
43
- })),
44
- secondEdge
45
- ]);
38
+ targetHandleId,
39
+ reactFlowInstance: reactFlow,
40
+ containerId: parentId,
41
+ removedEdgeIds: [
42
+ edgeId
43
+ ]
44
+ });
45
+ if (!previewGraph) return;
46
+ applyPreviewGraphToReactFlow(previewGraph, reactFlow);
46
47
  }, [
47
48
  sourcePosition,
48
49
  source,
@@ -51,7 +52,8 @@ function useEdgeToolbarState({ edgeId, pathElementRef, isHovered, source, target
51
52
  target,
52
53
  targetHandleId,
53
54
  edgeId,
54
- ignoredNodeTypes
55
+ ignoredNodeTypes,
56
+ parentId
55
57
  ]);
56
58
  const config = useMemo(()=>({
57
59
  actions: [
@@ -167,7 +167,7 @@ const ListViewRow = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ in
167
167
  ]
168
168
  });
169
169
  });
170
- const ListViewInner = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)(function({ items, activeIndex = -1, listRef, onItemClick, onItemHover, emptyStateMessage = 'No items found', emptyStateIcon = 'search-x', isLoading = false, enableSections = true }, ref) {
170
+ const ListViewInner = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)(function({ items, activeIndex = -1, listRef, onItemClick, onItemHover, onScroll, emptyStateMessage = 'No items found', emptyStateIcon = 'search-x', isLoading = false, enableSections = true }, ref) {
171
171
  const { isDarkMode } = (0, CanvasThemeContext_cjs_namespaceObject.useCanvasTheme)();
172
172
  const renderedItems = (0, external_react_namespaceObject.useMemo)(()=>buildRenderedItems(items, enableSections), [
173
173
  items,
@@ -229,7 +229,8 @@ const ListViewInner = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRe
229
229
  rowComponent: ListViewRow,
230
230
  rowCount: renderedItems.length,
231
231
  rowHeight: 40,
232
- overscanCount: 20
232
+ overscanCount: 20,
233
+ onScroll: onScroll
233
234
  });
234
235
  });
235
236
  const ListView_ListView = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(ListViewInner);
@@ -40,6 +40,7 @@ interface ListViewProps<T extends ListItem> {
40
40
  listRef?: React.RefObject<ListImperativeAPI | null>;
41
41
  onItemClick: (item: T, index: number) => void;
42
42
  onItemHover?: (item: T) => void;
43
+ onScroll?: React.UIEventHandler<HTMLDivElement>;
43
44
  emptyStateMessage?: string;
44
45
  emptyStateIcon?: string;
45
46
  isLoading?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"ListView.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Toolbox/ListView.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,iBAAiB,EAAqB,MAAM,cAAc,CAAC;AAKzE,MAAM,WAAW,YAAY;IAI3B,IAAI,CAAC,EAAE,MAAM,CAAC;IAId,GAAG,CAAC,EAAE,MAAM,CAAC;IAIb,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACjC;AAED,MAAM,MAAM,QAAQ,CAAC,CAAC,GAAG,GAAG,IAAI;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,CAAC,CAAC;IACR,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;CACnF,CAAC;AAEF,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,QAAQ,IACrC;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,GACxC;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,CAAC,CAAA;CAAE,CAAC;AAE9B,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,QAAQ,EACnD,KAAK,EAAE,CAAC,EAAE,EACV,cAAc,EAAE,OAAO,GACtB,UAAU,CAAC,CAAC,CAAC,EAAE,CAqCjB;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,QAAQ;IAClD,aAAa,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;IAC/B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;CACjC;AA8FD,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,QAAQ,GAAG,QAAQ;IAC3D,aAAa,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;CAChC;AAED,UAAU,aAAa,CAAC,CAAC,SAAS,QAAQ;IACxC,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;IACpD,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAiED,eAAO,MAAM,QAAQ,EAA0B,CAAC,CAAC,SAAS,QAAQ,EAChE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAA;CAAE,KAC7D,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC"}
1
+ {"version":3,"file":"ListView.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Toolbox/ListView.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,iBAAiB,EAAqB,MAAM,cAAc,CAAC;AAKzE,MAAM,WAAW,YAAY;IAI3B,IAAI,CAAC,EAAE,MAAM,CAAC;IAId,GAAG,CAAC,EAAE,MAAM,CAAC;IAIb,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACjC;AAED,MAAM,MAAM,QAAQ,CAAC,CAAC,GAAG,GAAG,IAAI;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,CAAC,CAAC;IACR,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;CACnF,CAAC;AAEF,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,QAAQ,IACrC;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,GACxC;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,CAAC,CAAA;CAAE,CAAC;AAE9B,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,QAAQ,EACnD,KAAK,EAAE,CAAC,EAAE,EACV,cAAc,EAAE,OAAO,GACtB,UAAU,CAAC,CAAC,CAAC,EAAE,CAqCjB;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,QAAQ;IAClD,aAAa,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;IAC/B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;CACjC;AA8FD,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,QAAQ,GAAG,QAAQ;IAC3D,aAAa,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;CAChC;AAED,UAAU,aAAa,CAAC,CAAC,SAAS,QAAQ;IACxC,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;IACpD,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAChC,QAAQ,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;IAChD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAmED,eAAO,MAAM,QAAQ,EAA0B,CAAC,CAAC,SAAS,QAAQ,EAChE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAA;CAAE,KAC7D,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC"}
@@ -138,7 +138,7 @@ const ListViewRow = /*#__PURE__*/ memo(({ index, style, ariaAttributes, rendered
138
138
  ]
139
139
  });
140
140
  });
141
- const ListViewInner = /*#__PURE__*/ forwardRef(function({ items, activeIndex = -1, listRef, onItemClick, onItemHover, emptyStateMessage = 'No items found', emptyStateIcon = 'search-x', isLoading = false, enableSections = true }, ref) {
141
+ const ListViewInner = /*#__PURE__*/ forwardRef(function({ items, activeIndex = -1, listRef, onItemClick, onItemHover, onScroll, emptyStateMessage = 'No items found', emptyStateIcon = 'search-x', isLoading = false, enableSections = true }, ref) {
142
142
  const { isDarkMode } = useCanvasTheme();
143
143
  const renderedItems = useMemo(()=>buildRenderedItems(items, enableSections), [
144
144
  items,
@@ -200,7 +200,8 @@ const ListViewInner = /*#__PURE__*/ forwardRef(function({ items, activeIndex = -
200
200
  rowComponent: ListViewRow,
201
201
  rowCount: renderedItems.length,
202
202
  rowHeight: 40,
203
- overscanCount: 20
203
+ overscanCount: 20,
204
+ onScroll: onScroll
204
205
  });
205
206
  });
206
207
  const ListView_ListView = /*#__PURE__*/ memo(ListViewInner);
@@ -100,6 +100,10 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
100
100
  const listViewRef = (0, external_react_namespaceObject.useRef)(null);
101
101
  const searchInputRef = (0, external_react_namespaceObject.useRef)(null);
102
102
  const clearButtonRef = (0, external_react_namespaceObject.useRef)(null);
103
+ const lastScrollTopRef = (0, external_react_namespaceObject.useRef)(0);
104
+ const handleListScroll = (0, external_react_namespaceObject.useCallback)((e)=>{
105
+ lastScrollTopRef.current = e.currentTarget.scrollTop;
106
+ }, []);
103
107
  const isSearching = (0, external_react_namespaceObject.useMemo)(()=>search.length > 0, [
104
108
  search
105
109
  ]);
@@ -185,31 +189,45 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
185
189
  setSearchLoading(false);
186
190
  setIsSearchingInitialItems(true);
187
191
  const restoredIndex = previousState?.data.activeIndex ?? SEARCH_BAR_INDEX;
188
- navigateToIndex(restoredIndex);
192
+ const restoredScrollTop = previousState?.data.scrollTop ?? 0;
193
+ setActiveIndex(restoredIndex);
194
+ searchInputRef.current?.focus();
195
+ requestAnimationFrame(()=>{
196
+ const element = listRef.current?.element;
197
+ if (element) element.scrollTop = restoredScrollTop;
198
+ lastScrollTopRef.current = restoredScrollTop;
199
+ });
189
200
  onBack?.();
190
201
  }, [
191
202
  navigationStack,
192
203
  onBack,
193
204
  startTransition,
194
- navigateToIndex
205
+ listRef
195
206
  ]);
196
207
  const handleItemSelect = (0, external_react_namespaceObject.useCallback)(async (item, index)=>{
197
208
  if (!item.children) return void onItemSelect(item);
198
209
  setChildrenLoading(true);
199
210
  const nestedItems = 'function' == typeof item.children ? await item.children(item.id, item.name) : item.children;
200
211
  const savedIndex = isSearching ? SEARCH_BAR_INDEX : index ?? activeIndex;
212
+ const savedScrollTop = isSearching ? 0 : lastScrollTopRef.current;
201
213
  navigationStack.push({
202
214
  title: currentParentItem?.name || title,
203
215
  data: {
204
216
  items,
205
217
  parentItem: currentParentItem,
206
- activeIndex: savedIndex
218
+ activeIndex: savedIndex,
219
+ scrollTop: savedScrollTop
207
220
  }
208
221
  });
209
222
  setItems(nestedItems);
210
223
  setCurrentParentItem(item);
211
224
  clearSearch();
212
225
  setActiveIndex(SEARCH_BAR_INDEX);
226
+ requestAnimationFrame(()=>{
227
+ const element = listRef.current?.element;
228
+ if (element) element.scrollTop = 0;
229
+ lastScrollTopRef.current = 0;
230
+ });
213
231
  startTransition('forward');
214
232
  setChildrenLoading(false);
215
233
  }, [
@@ -221,7 +239,8 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
221
239
  isSearching,
222
240
  clearSearch,
223
241
  startTransition,
224
- onItemSelect
242
+ onItemSelect,
243
+ listRef
225
244
  ]);
226
245
  (0, external_react_namespaceObject.useEffect)(()=>()=>{
227
246
  if (transitionTimeoutRef.current) clearTimeout(transitionTimeoutRef.current);
@@ -242,7 +261,8 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
242
261
  data: {
243
262
  items: newInitialItems,
244
263
  parentItem: null,
245
- activeIndex: stackItem.data.activeIndex
264
+ activeIndex: stackItem.data.activeIndex,
265
+ scrollTop: stackItem.data.scrollTop
246
266
  }
247
267
  };
248
268
  const updatedParentItem = findItemById(newInitialItems, stackItem.data.parentItem.id);
@@ -253,7 +273,8 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
253
273
  data: {
254
274
  items: updatedItems,
255
275
  parentItem: updatedParentItem,
256
- activeIndex: stackItem.data.activeIndex
276
+ activeIndex: stackItem.data.activeIndex,
277
+ scrollTop: stackItem.data.scrollTop
257
278
  }
258
279
  };
259
280
  });
@@ -360,6 +381,13 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
360
381
  handleItemSelect,
361
382
  handleBackTransition
362
383
  ]);
384
+ const handleClose = (0, external_react_namespaceObject.useCallback)(()=>{
385
+ navigationStack.clear();
386
+ onClose();
387
+ }, [
388
+ navigationStack,
389
+ onClose
390
+ ]);
363
391
  (0, external_react_namespaceObject.useEffect)(()=>{
364
392
  const handleKeyDown = (e)=>{
365
393
  if ('Escape' === e.key) if (isSearching) {
@@ -367,10 +395,10 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
367
395
  startTransition('back');
368
396
  clearSearch();
369
397
  } else if (navigationStack.canGoBack) handleBackTransition();
370
- else onClose();
398
+ else handleClose();
371
399
  };
372
400
  const handleClickOutside = (e)=>{
373
- if (containerRef.current && !containerRef.current.contains(e.target)) onClose();
401
+ if (containerRef.current && !containerRef.current.contains(e.target)) handleClose();
374
402
  };
375
403
  document.addEventListener('keydown', handleKeyDown);
376
404
  document.addEventListener('mousedown', handleClickOutside);
@@ -381,7 +409,7 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
381
409
  }, [
382
410
  isSearching,
383
411
  navigationStack.canGoBack,
384
- onClose,
412
+ handleClose,
385
413
  clearSearch,
386
414
  startTransition,
387
415
  handleBackTransition
@@ -425,6 +453,7 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
425
453
  emptyStateMessage: isSearching ? 'No matching nodes found' : 'No nodes found',
426
454
  onItemClick: handleItemSelect,
427
455
  onItemHover: onItemHover,
456
+ onScroll: handleListScroll,
428
457
  enableSections: !isSearching
429
458
  })
430
459
  })
@@ -1 +1 @@
1
- {"version":3,"file":"Toolbox.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Toolbox/Toolbox.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,KAAK,QAAQ,EAAkD,MAAM,YAAY,CAAC;AAwC3F,MAAM,MAAM,oBAAoB,CAAC,CAAC,GAAG,GAAG,IAAI,CAC1C,KAAK,EAAE,MAAM,EACb,gBAAgB,EAAE,OAAO,EACzB,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE;IAAE,YAAY,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,KAC5E,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AAE5B,MAAM,WAAW,YAAY,CAAC,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAC1D,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAC1C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAC,CAAC;CACpC;AAgDD,wBAAgB,OAAO,CAAC,CAAC,EAAE,EACzB,OAAO,EACP,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,KAAK,EACL,YAAY,EACZ,OAAO,EACP,SAAiB,EACjB,UAAkB,GACnB,EAAE,YAAY,CAAC,CAAC,CAAC,2CA0cjB"}
1
+ {"version":3,"file":"Toolbox.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Toolbox/Toolbox.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,KAAK,QAAQ,EAAkD,MAAM,YAAY,CAAC;AAwC3F,MAAM,MAAM,oBAAoB,CAAC,CAAC,GAAG,GAAG,IAAI,CAC1C,KAAK,EAAE,MAAM,EACb,gBAAgB,EAAE,OAAO,EACzB,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE;IAAE,YAAY,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,KAC5E,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AAE5B,MAAM,WAAW,YAAY,CAAC,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAC1D,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAC1C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAC,CAAC;CACpC;AAgDD,wBAAgB,OAAO,CAAC,CAAC,EAAE,EACzB,OAAO,EACP,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,KAAK,EACL,YAAY,EACZ,OAAO,EACP,SAAiB,EACjB,UAAkB,GACnB,EAAE,YAAY,CAAC,CAAC,CAAC,2CAwfjB"}
@@ -72,6 +72,10 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
72
72
  const listViewRef = useRef(null);
73
73
  const searchInputRef = useRef(null);
74
74
  const clearButtonRef = useRef(null);
75
+ const lastScrollTopRef = useRef(0);
76
+ const handleListScroll = useCallback((e)=>{
77
+ lastScrollTopRef.current = e.currentTarget.scrollTop;
78
+ }, []);
75
79
  const isSearching = useMemo(()=>search.length > 0, [
76
80
  search
77
81
  ]);
@@ -157,31 +161,45 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
157
161
  setSearchLoading(false);
158
162
  setIsSearchingInitialItems(true);
159
163
  const restoredIndex = previousState?.data.activeIndex ?? SEARCH_BAR_INDEX;
160
- navigateToIndex(restoredIndex);
164
+ const restoredScrollTop = previousState?.data.scrollTop ?? 0;
165
+ setActiveIndex(restoredIndex);
166
+ searchInputRef.current?.focus();
167
+ requestAnimationFrame(()=>{
168
+ const element = listRef.current?.element;
169
+ if (element) element.scrollTop = restoredScrollTop;
170
+ lastScrollTopRef.current = restoredScrollTop;
171
+ });
161
172
  onBack?.();
162
173
  }, [
163
174
  navigationStack,
164
175
  onBack,
165
176
  startTransition,
166
- navigateToIndex
177
+ listRef
167
178
  ]);
168
179
  const handleItemSelect = useCallback(async (item, index)=>{
169
180
  if (!item.children) return void onItemSelect(item);
170
181
  setChildrenLoading(true);
171
182
  const nestedItems = 'function' == typeof item.children ? await item.children(item.id, item.name) : item.children;
172
183
  const savedIndex = isSearching ? SEARCH_BAR_INDEX : index ?? activeIndex;
184
+ const savedScrollTop = isSearching ? 0 : lastScrollTopRef.current;
173
185
  navigationStack.push({
174
186
  title: currentParentItem?.name || title,
175
187
  data: {
176
188
  items,
177
189
  parentItem: currentParentItem,
178
- activeIndex: savedIndex
190
+ activeIndex: savedIndex,
191
+ scrollTop: savedScrollTop
179
192
  }
180
193
  });
181
194
  setItems(nestedItems);
182
195
  setCurrentParentItem(item);
183
196
  clearSearch();
184
197
  setActiveIndex(SEARCH_BAR_INDEX);
198
+ requestAnimationFrame(()=>{
199
+ const element = listRef.current?.element;
200
+ if (element) element.scrollTop = 0;
201
+ lastScrollTopRef.current = 0;
202
+ });
185
203
  startTransition('forward');
186
204
  setChildrenLoading(false);
187
205
  }, [
@@ -193,7 +211,8 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
193
211
  isSearching,
194
212
  clearSearch,
195
213
  startTransition,
196
- onItemSelect
214
+ onItemSelect,
215
+ listRef
197
216
  ]);
198
217
  useEffect(()=>()=>{
199
218
  if (transitionTimeoutRef.current) clearTimeout(transitionTimeoutRef.current);
@@ -214,7 +233,8 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
214
233
  data: {
215
234
  items: newInitialItems,
216
235
  parentItem: null,
217
- activeIndex: stackItem.data.activeIndex
236
+ activeIndex: stackItem.data.activeIndex,
237
+ scrollTop: stackItem.data.scrollTop
218
238
  }
219
239
  };
220
240
  const updatedParentItem = findItemById(newInitialItems, stackItem.data.parentItem.id);
@@ -225,7 +245,8 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
225
245
  data: {
226
246
  items: updatedItems,
227
247
  parentItem: updatedParentItem,
228
- activeIndex: stackItem.data.activeIndex
248
+ activeIndex: stackItem.data.activeIndex,
249
+ scrollTop: stackItem.data.scrollTop
229
250
  }
230
251
  };
231
252
  });
@@ -332,6 +353,13 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
332
353
  handleItemSelect,
333
354
  handleBackTransition
334
355
  ]);
356
+ const handleClose = useCallback(()=>{
357
+ navigationStack.clear();
358
+ onClose();
359
+ }, [
360
+ navigationStack,
361
+ onClose
362
+ ]);
335
363
  useEffect(()=>{
336
364
  const handleKeyDown = (e)=>{
337
365
  if ('Escape' === e.key) if (isSearching) {
@@ -339,10 +367,10 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
339
367
  startTransition('back');
340
368
  clearSearch();
341
369
  } else if (navigationStack.canGoBack) handleBackTransition();
342
- else onClose();
370
+ else handleClose();
343
371
  };
344
372
  const handleClickOutside = (e)=>{
345
- if (containerRef.current && !containerRef.current.contains(e.target)) onClose();
373
+ if (containerRef.current && !containerRef.current.contains(e.target)) handleClose();
346
374
  };
347
375
  document.addEventListener('keydown', handleKeyDown);
348
376
  document.addEventListener('mousedown', handleClickOutside);
@@ -353,7 +381,7 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
353
381
  }, [
354
382
  isSearching,
355
383
  navigationStack.canGoBack,
356
- onClose,
384
+ handleClose,
357
385
  clearSearch,
358
386
  startTransition,
359
387
  handleBackTransition
@@ -397,6 +425,7 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
397
425
  emptyStateMessage: isSearching ? 'No matching nodes found' : 'No nodes found',
398
426
  onItemClick: handleItemSelect,
399
427
  onItemHover: onItemHover,
428
+ onScroll: handleListScroll,
400
429
  enableSections: !isSearching
401
430
  })
402
431
  })
@@ -36,6 +36,9 @@ var __webpack_modules__ = {
36
36
  "./HierarchicalCanvas" (module) {
37
37
  module.exports = require("./HierarchicalCanvas/index.cjs");
38
38
  },
39
+ "./LoopNode?4ffc" (module) {
40
+ module.exports = require("./LoopNode/index.cjs");
41
+ },
39
42
  "./MiniCanvasNavigator?564d" (module) {
40
43
  module.exports = require("./MiniCanvasNavigator/index.cjs");
41
44
  },
@@ -158,45 +161,49 @@ var __webpack_exports__ = {};
158
161
  var __rspack_reexport = {};
159
162
  for(const __rspack_import_key in _HierarchicalCanvas__rspack_import_11)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_HierarchicalCanvas__rspack_import_11[__rspack_import_key];
160
163
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
161
- var _MiniCanvasNavigator__rspack_import_12 = __webpack_require__("./MiniCanvasNavigator?564d");
164
+ var _LoopNode__rspack_import_12 = __webpack_require__("./LoopNode?4ffc");
165
+ var __rspack_reexport = {};
166
+ for(const __rspack_import_key in _LoopNode__rspack_import_12)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_LoopNode__rspack_import_12[__rspack_import_key];
167
+ __webpack_require__.d(__webpack_exports__, __rspack_reexport);
168
+ var _MiniCanvasNavigator__rspack_import_13 = __webpack_require__("./MiniCanvasNavigator?564d");
162
169
  var __rspack_reexport = {};
163
- for(const __rspack_import_key in _MiniCanvasNavigator__rspack_import_12)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_MiniCanvasNavigator__rspack_import_12[__rspack_import_key];
170
+ for(const __rspack_import_key in _MiniCanvasNavigator__rspack_import_13)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_MiniCanvasNavigator__rspack_import_13[__rspack_import_key];
164
171
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
165
- var _NodeContextMenu__rspack_import_13 = __webpack_require__("./NodeContextMenu");
172
+ var _NodeContextMenu__rspack_import_14 = __webpack_require__("./NodeContextMenu");
166
173
  var __rspack_reexport = {};
167
- for(const __rspack_import_key in _NodeContextMenu__rspack_import_13)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodeContextMenu__rspack_import_13[__rspack_import_key];
174
+ for(const __rspack_import_key in _NodeContextMenu__rspack_import_14)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodeContextMenu__rspack_import_14[__rspack_import_key];
168
175
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
169
- var _NodeInspector__rspack_import_14 = __webpack_require__("./NodeInspector");
176
+ var _NodeInspector__rspack_import_15 = __webpack_require__("./NodeInspector");
170
177
  var __rspack_reexport = {};
171
- for(const __rspack_import_key in _NodeInspector__rspack_import_14)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodeInspector__rspack_import_14[__rspack_import_key];
178
+ for(const __rspack_import_key in _NodeInspector__rspack_import_15)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodeInspector__rspack_import_15[__rspack_import_key];
172
179
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
173
- var _NodePropertiesPanel__rspack_import_15 = __webpack_require__("./NodePropertiesPanel?a3e8");
180
+ var _NodePropertiesPanel__rspack_import_16 = __webpack_require__("./NodePropertiesPanel?a3e8");
174
181
  var __rspack_reexport = {};
175
- for(const __rspack_import_key in _NodePropertiesPanel__rspack_import_15)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodePropertiesPanel__rspack_import_15[__rspack_import_key];
182
+ for(const __rspack_import_key in _NodePropertiesPanel__rspack_import_16)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodePropertiesPanel__rspack_import_16[__rspack_import_key];
176
183
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
177
- var _StageNode__rspack_import_16 = __webpack_require__("./StageNode");
184
+ var _StageNode__rspack_import_17 = __webpack_require__("./StageNode");
178
185
  var __rspack_reexport = {};
179
- for(const __rspack_import_key in _StageNode__rspack_import_16)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_StageNode__rspack_import_16[__rspack_import_key];
186
+ for(const __rspack_import_key in _StageNode__rspack_import_17)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_StageNode__rspack_import_17[__rspack_import_key];
180
187
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
181
- var _StickyNoteNode__rspack_import_17 = __webpack_require__("./StickyNoteNode?d2a3");
188
+ var _StickyNoteNode__rspack_import_18 = __webpack_require__("./StickyNoteNode?d2a3");
182
189
  var __rspack_reexport = {};
183
- for(const __rspack_import_key in _StickyNoteNode__rspack_import_17)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_StickyNoteNode__rspack_import_17[__rspack_import_key];
190
+ for(const __rspack_import_key in _StickyNoteNode__rspack_import_18)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_StickyNoteNode__rspack_import_18[__rspack_import_key];
184
191
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
185
- var _TaskIcon__rspack_import_18 = __webpack_require__("./TaskIcon");
192
+ var _TaskIcon__rspack_import_19 = __webpack_require__("./TaskIcon");
186
193
  var __rspack_reexport = {};
187
- for(const __rspack_import_key in _TaskIcon__rspack_import_18)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_TaskIcon__rspack_import_18[__rspack_import_key];
194
+ for(const __rspack_import_key in _TaskIcon__rspack_import_19)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_TaskIcon__rspack_import_19[__rspack_import_key];
188
195
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
189
- var _Toolbar__rspack_import_19 = __webpack_require__("./Toolbar");
196
+ var _Toolbar__rspack_import_20 = __webpack_require__("./Toolbar");
190
197
  var __rspack_reexport = {};
191
- for(const __rspack_import_key in _Toolbar__rspack_import_19)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Toolbar__rspack_import_19[__rspack_import_key];
198
+ for(const __rspack_import_key in _Toolbar__rspack_import_20)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Toolbar__rspack_import_20[__rspack_import_key];
192
199
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
193
- var _Toolbox__rspack_import_20 = __webpack_require__("./Toolbox?2740");
200
+ var _Toolbox__rspack_import_21 = __webpack_require__("./Toolbox?2740");
194
201
  var __rspack_reexport = {};
195
- for(const __rspack_import_key in _Toolbox__rspack_import_20)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Toolbox__rspack_import_20[__rspack_import_key];
202
+ for(const __rspack_import_key in _Toolbox__rspack_import_21)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Toolbox__rspack_import_21[__rspack_import_key];
196
203
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
197
- var _TriggerNode__rspack_import_21 = __webpack_require__("./TriggerNode");
204
+ var _TriggerNode__rspack_import_22 = __webpack_require__("./TriggerNode");
198
205
  var __rspack_reexport = {};
199
- for(const __rspack_import_key in _TriggerNode__rspack_import_21)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_TriggerNode__rspack_import_21[__rspack_import_key];
206
+ for(const __rspack_import_key in _TriggerNode__rspack_import_22)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_TriggerNode__rspack_import_22[__rspack_import_key];
200
207
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
201
208
  })();
202
209
  for(var __rspack_i in __webpack_exports__)exports[__rspack_i] = __webpack_exports__[__rspack_i];
@@ -10,6 +10,7 @@ export * from './ExecutionStatusIcon';
10
10
  export * from './FloatingCanvasPanel';
11
11
  export * from './GroupNode';
12
12
  export * from './HierarchicalCanvas';
13
+ export * from './LoopNode';
13
14
  export * from './MiniCanvasNavigator';
14
15
  export * from './NodeContextMenu';
15
16
  export * from './NodeInspector';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/canvas/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,0BAA0B,CAAC;AACzC,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/canvas/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,0BAA0B,CAAC;AACzC,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,sBAAsB,CAAC;AACrC,cAAc,YAAY,CAAC;AAC3B,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC"}
@@ -10,6 +10,7 @@ export * from "./ExecutionStatusIcon/index.js";
10
10
  export * from "./FloatingCanvasPanel/index.js";
11
11
  export * from "./GroupNode/index.js";
12
12
  export * from "./HierarchicalCanvas/index.js";
13
+ export * from "./LoopNode/index.js";
13
14
  export * from "./MiniCanvasNavigator/index.js";
14
15
  export * from "./NodeContextMenu/index.js";
15
16
  export * from "./NodeInspector.js";