@uipath/apollo-react 3.68.3 → 3.69.0-pr458.25d2dee

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 (57) hide show
  1. package/dist/canvas/components/CanvasPerformance.stories.cjs +349 -0
  2. package/dist/canvas/components/CanvasPerformance.stories.d.ts +6 -0
  3. package/dist/canvas/components/CanvasPerformance.stories.d.ts.map +1 -0
  4. package/dist/canvas/components/CanvasPerformance.stories.js +312 -0
  5. package/dist/canvas/components/NodePropertiesPanel/hooks/index.cjs +4 -1
  6. package/dist/canvas/components/NodePropertiesPanel/hooks/index.d.ts +1 -1
  7. package/dist/canvas/components/NodePropertiesPanel/hooks/index.d.ts.map +1 -1
  8. package/dist/canvas/components/NodePropertiesPanel/hooks/index.js +2 -2
  9. package/dist/canvas/components/NodePropertiesPanel/hooks/useNodeSelection.cjs +27 -6
  10. package/dist/canvas/components/NodePropertiesPanel/hooks/useNodeSelection.d.ts +3 -0
  11. package/dist/canvas/components/NodePropertiesPanel/hooks/useNodeSelection.d.ts.map +1 -1
  12. package/dist/canvas/components/NodePropertiesPanel/hooks/useNodeSelection.js +23 -5
  13. package/dist/canvas/components/StageNode/AdhocTask.cjs +4 -5
  14. package/dist/canvas/components/StageNode/AdhocTask.d.ts +2 -3
  15. package/dist/canvas/components/StageNode/AdhocTask.d.ts.map +1 -1
  16. package/dist/canvas/components/StageNode/AdhocTask.js +4 -5
  17. package/dist/canvas/components/StageNode/DraggableTask.cjs +14 -5
  18. package/dist/canvas/components/StageNode/DraggableTask.d.ts +1 -1
  19. package/dist/canvas/components/StageNode/DraggableTask.d.ts.map +1 -1
  20. package/dist/canvas/components/StageNode/DraggableTask.js +14 -5
  21. package/dist/canvas/components/StageNode/DraggableTask.types.d.ts +3 -3
  22. package/dist/canvas/components/StageNode/DraggableTask.types.d.ts.map +1 -1
  23. package/dist/canvas/components/StageNode/StageEdge.cjs +34 -11
  24. package/dist/canvas/components/StageNode/StageEdge.d.ts +2 -1
  25. package/dist/canvas/components/StageNode/StageEdge.d.ts.map +1 -1
  26. package/dist/canvas/components/StageNode/StageEdge.js +35 -12
  27. package/dist/canvas/components/StageNode/StageNode.cjs +30 -59
  28. package/dist/canvas/components/StageNode/StageNode.d.ts.map +1 -1
  29. package/dist/canvas/components/StageNode/StageNode.js +35 -64
  30. package/dist/canvas/components/StageNode/StageNode.stories.cjs +127 -179
  31. package/dist/canvas/components/StageNode/StageNode.stories.d.ts +2 -2
  32. package/dist/canvas/components/StageNode/StageNode.stories.d.ts.map +1 -1
  33. package/dist/canvas/components/StageNode/StageNode.stories.js +123 -175
  34. package/dist/canvas/components/StageNode/StageNode.stories.utils.cjs +45 -0
  35. package/dist/canvas/components/StageNode/StageNode.stories.utils.d.ts +8 -0
  36. package/dist/canvas/components/StageNode/StageNode.stories.utils.d.ts.map +1 -0
  37. package/dist/canvas/components/StageNode/StageNode.stories.utils.js +11 -0
  38. package/dist/canvas/components/StageNode/StageNode.types.d.ts +9 -4
  39. package/dist/canvas/components/StageNode/StageNode.types.d.ts.map +1 -1
  40. package/dist/canvas/components/StageNode/StageTaskDragOverlay.cjs +69 -0
  41. package/dist/canvas/components/StageNode/StageTaskDragOverlay.d.ts +3 -0
  42. package/dist/canvas/components/StageNode/StageTaskDragOverlay.d.ts.map +1 -0
  43. package/dist/canvas/components/StageNode/StageTaskDragOverlay.js +35 -0
  44. package/dist/canvas/components/StageNode/TaskMenu.cjs +14 -17
  45. package/dist/canvas/components/StageNode/TaskMenu.d.ts +1 -2
  46. package/dist/canvas/components/StageNode/TaskMenu.d.ts.map +1 -1
  47. package/dist/canvas/components/StageNode/TaskMenu.js +15 -18
  48. package/dist/canvas/components/StageNode/index.d.ts +1 -1
  49. package/dist/canvas/components/StageNode/index.d.ts.map +1 -1
  50. package/dist/canvas/components/StickyNoteNode/StickyNoteNode.cjs +10 -2
  51. package/dist/canvas/components/StickyNoteNode/StickyNoteNode.d.ts.map +1 -1
  52. package/dist/canvas/components/StickyNoteNode/StickyNoteNode.js +9 -2
  53. package/dist/canvas/components/StickyNoteNode/useScrollCapture.cjs +72 -0
  54. package/dist/canvas/components/StickyNoteNode/useScrollCapture.d.ts +9 -0
  55. package/dist/canvas/components/StickyNoteNode/useScrollCapture.d.ts.map +1 -0
  56. package/dist/canvas/components/StickyNoteNode/useScrollCapture.js +38 -0
  57. package/package.json +5 -4
@@ -49,7 +49,54 @@ const external_TaskIcon_index_cjs_namespaceObject = require("../TaskIcon/index.c
49
49
  const external_StageConnectionEdge_cjs_namespaceObject = require("./StageConnectionEdge.cjs");
50
50
  const external_StageEdge_cjs_namespaceObject = require("./StageEdge.cjs");
51
51
  const external_StageNode_cjs_namespaceObject = require("./StageNode.cjs");
52
+ const external_StageNode_stories_utils_cjs_namespaceObject = require("./StageNode.stories.utils.cjs");
52
53
  const external_StageNode_types_cjs_namespaceObject = require("./StageNode.types.cjs");
54
+ const DefaultCanvasDecorator = ({ initialNodes, initialEdges = [] })=>{
55
+ const [nodes, _setNodes, onNodesChange] = (0, react_cjs_namespaceObject.useNodesState)(initialNodes);
56
+ const [edges, setEdges, onEdgesChange] = (0, react_cjs_namespaceObject.useEdgesState)(initialEdges);
57
+ const onConnect = (0, external_react_namespaceObject.useCallback)((connection)=>{
58
+ setEdges((eds)=>(0, react_cjs_namespaceObject.addEdge)(connection, eds));
59
+ }, [
60
+ setEdges
61
+ ]);
62
+ const nodeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
63
+ stage: external_StageNode_stories_utils_cjs_namespaceObject.StageNodeWrapper
64
+ }), []);
65
+ const edgeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
66
+ stage: external_StageEdge_cjs_namespaceObject.StageEdge
67
+ }), []);
68
+ const defaultEdgeOptions = (0, external_react_namespaceObject.useMemo)(()=>({
69
+ type: 'stage'
70
+ }), []);
71
+ return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
72
+ style: {
73
+ width: '100vw',
74
+ height: '100vh'
75
+ },
76
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.ReactFlowProvider, {
77
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_BaseCanvas_index_cjs_namespaceObject.BaseCanvas, {
78
+ nodes: nodes,
79
+ edges: edges,
80
+ onNodesChange: onNodesChange,
81
+ onEdgesChange: onEdgesChange,
82
+ onConnect: onConnect,
83
+ nodeTypes: nodeTypes,
84
+ edgeTypes: edgeTypes,
85
+ mode: "design",
86
+ connectionMode: react_cjs_namespaceObject.ConnectionMode.Strict,
87
+ defaultEdgeOptions: defaultEdgeOptions,
88
+ connectionLineComponent: external_StageConnectionEdge_cjs_namespaceObject.StageConnectionEdge,
89
+ elevateEdgesOnSelect: true,
90
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.Panel, {
91
+ position: "bottom-right",
92
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasPositionControls_cjs_namespaceObject.CanvasPositionControls, {
93
+ translations: external_types_cjs_namespaceObject.DefaultCanvasTranslations
94
+ })
95
+ })
96
+ })
97
+ })
98
+ });
99
+ };
53
100
  const meta = {
54
101
  title: 'Canvas/StageNode',
55
102
  component: external_StageNode_cjs_namespaceObject.StageNode,
@@ -59,10 +106,6 @@ const meta = {
59
106
  decorators: [
60
107
  (Story, context)=>{
61
108
  if (context.parameters?.useCustomRender) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Story, {});
62
- const StageNodeWrapper = (props)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_cjs_namespaceObject.StageNode, {
63
- ...props,
64
- ...props.data
65
- });
66
109
  const initialNodes = context.parameters?.nodes || [
67
110
  {
68
111
  id: '1',
@@ -82,51 +125,9 @@ const meta = {
82
125
  }
83
126
  ];
84
127
  const initialEdges = context.parameters?.edges || [];
85
- const [nodes, _setNodes, onNodesChange] = (0, react_cjs_namespaceObject.useNodesState)(initialNodes);
86
- const [edges, setEdges, onEdgesChange] = (0, react_cjs_namespaceObject.useEdgesState)(initialEdges);
87
- const onConnect = (0, external_react_namespaceObject.useCallback)((connection)=>{
88
- setEdges((eds)=>(0, react_cjs_namespaceObject.addEdge)(connection, eds));
89
- }, [
90
- setEdges
91
- ]);
92
- const nodeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
93
- stage: StageNodeWrapper
94
- }), [
95
- StageNodeWrapper
96
- ]);
97
- const edgeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
98
- stage: external_StageEdge_cjs_namespaceObject.StageEdge
99
- }), []);
100
- const defaultEdgeOptions = (0, external_react_namespaceObject.useMemo)(()=>({
101
- type: 'stage'
102
- }), []);
103
- return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
104
- style: {
105
- width: '100vw',
106
- height: '100vh'
107
- },
108
- children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.ReactFlowProvider, {
109
- children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_BaseCanvas_index_cjs_namespaceObject.BaseCanvas, {
110
- nodes: nodes,
111
- edges: edges,
112
- onNodesChange: onNodesChange,
113
- onEdgesChange: onEdgesChange,
114
- onConnect: onConnect,
115
- nodeTypes: nodeTypes,
116
- edgeTypes: edgeTypes,
117
- mode: "design",
118
- connectionMode: react_cjs_namespaceObject.ConnectionMode.Strict,
119
- defaultEdgeOptions: defaultEdgeOptions,
120
- connectionLineComponent: external_StageConnectionEdge_cjs_namespaceObject.StageConnectionEdge,
121
- elevateEdgesOnSelect: true,
122
- children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.Panel, {
123
- position: "bottom-right",
124
- children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasPositionControls_cjs_namespaceObject.CanvasPositionControls, {
125
- translations: external_types_cjs_namespaceObject.DefaultCanvasTranslations
126
- })
127
- })
128
- })
129
- })
128
+ return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(DefaultCanvasDecorator, {
129
+ initialNodes: initialNodes,
130
+ initialEdges: initialEdges
130
131
  });
131
132
  }
132
133
  ],
@@ -202,7 +203,7 @@ const DocumentIcon = ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("sv
202
203
  strokeWidth: "1.5",
203
204
  children: [
204
205
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("path", {
205
- d: "M14 2H6C4.9 2 4 2.9 4 4V20C20 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2Z"
206
+ d: "M14 2H6C4.9 2 4 2.9 4 4V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2Z"
206
207
  }),
207
208
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("path", {
208
209
  d: "M14 2V8H20"
@@ -402,8 +403,7 @@ const Default = {
402
403
  }
403
404
  }
404
405
  ]
405
- },
406
- args: {}
406
+ }
407
407
  };
408
408
  const WithTaskIcons = {
409
409
  name: 'With Task Icons',
@@ -500,8 +500,7 @@ const WithTaskIcons = {
500
500
  }
501
501
  }
502
502
  ]
503
- },
504
- args: {}
503
+ }
505
504
  };
506
505
  const ExecutionStatus = {
507
506
  name: 'Execution Status',
@@ -821,8 +820,7 @@ const ExecutionStatus = {
821
820
  targetHandle: '3____target____left'
822
821
  }
823
822
  ]
824
- },
825
- args: {}
823
+ }
826
824
  };
827
825
  const InteractiveTaskManagement = {
828
826
  name: 'Interactive Task Management',
@@ -983,8 +981,7 @@ const InteractiveTaskManagement = {
983
981
  }
984
982
  }
985
983
  ]
986
- },
987
- args: {}
984
+ }
988
985
  };
989
986
  const LoanProcessingWorkflow = {
990
987
  name: 'Loan Processing Workflow',
@@ -1269,8 +1266,7 @@ const LoanProcessingWorkflow = {
1269
1266
  targetHandle: 'funding____target____left'
1270
1267
  }
1271
1268
  ]
1272
- },
1273
- args: {}
1269
+ }
1274
1270
  };
1275
1271
  const initialTasks = [
1276
1272
  [
@@ -1313,17 +1309,9 @@ const initialTasks = [
1313
1309
  ]
1314
1310
  ];
1315
1311
  const DraggableTaskReorderingStory = ()=>{
1316
- const StageNodeWrapper = (0, external_react_namespaceObject.useMemo)(()=>function(props) {
1317
- return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_cjs_namespaceObject.StageNode, {
1318
- ...props,
1319
- ...props.data
1320
- });
1321
- }, []);
1322
1312
  const nodeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
1323
- stage: StageNodeWrapper
1324
- }), [
1325
- StageNodeWrapper
1326
- ]);
1313
+ stage: external_StageNode_stories_utils_cjs_namespaceObject.StageNodeWrapper
1314
+ }), []);
1327
1315
  const edgeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
1328
1316
  stage: external_StageEdge_cjs_namespaceObject.StageEdge
1329
1317
  }), []);
@@ -1413,8 +1401,7 @@ const DraggableTaskReordering = {
1413
1401
  parameters: {
1414
1402
  useCustomRender: true
1415
1403
  },
1416
- render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(DraggableTaskReorderingStory, {}),
1417
- args: {}
1404
+ render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(DraggableTaskReorderingStory, {})
1418
1405
  };
1419
1406
  const initialTasksForAddReplace = [
1420
1407
  [
@@ -1492,17 +1479,9 @@ const availableTaskOptions = [
1492
1479
  }
1493
1480
  ];
1494
1481
  const AddAndReplaceTasksStory = ()=>{
1495
- const StageNodeWrapper = (0, external_react_namespaceObject.useMemo)(()=>function(props) {
1496
- return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_cjs_namespaceObject.StageNode, {
1497
- ...props,
1498
- ...props.data
1499
- });
1500
- }, []);
1501
1482
  const nodeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
1502
- stage: StageNodeWrapper
1503
- }), [
1504
- StageNodeWrapper
1505
- ]);
1483
+ stage: external_StageNode_stories_utils_cjs_namespaceObject.StageNodeWrapper
1484
+ }), []);
1506
1485
  const edgeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
1507
1486
  stage: external_StageEdge_cjs_namespaceObject.StageEdge
1508
1487
  }), []);
@@ -1739,24 +1718,28 @@ const AddAndReplaceTasks = {
1739
1718
  parameters: {
1740
1719
  useCustomRender: true
1741
1720
  },
1742
- render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(AddAndReplaceTasksStory, {}),
1743
- args: {}
1721
+ render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(AddAndReplaceTasksStory, {})
1744
1722
  };
1745
1723
  const InlineTitleEditStory = ()=>{
1746
- const StageNodeWrapper = (0, external_react_namespaceObject.useMemo)(()=>function(props) {
1747
- return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_cjs_namespaceObject.StageNode, {
1748
- ...props,
1749
- ...props.data
1750
- });
1751
- }, []);
1752
1724
  const nodeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
1753
- stage: StageNodeWrapper
1754
- }), [
1755
- StageNodeWrapper
1756
- ]);
1725
+ stage: external_StageNode_stories_utils_cjs_namespaceObject.StageNodeWrapper
1726
+ }), []);
1757
1727
  const edgeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
1758
1728
  stage: external_StageEdge_cjs_namespaceObject.StageEdge
1759
1729
  }), []);
1730
+ const setNodesRef = (0, external_react_namespaceObject.useRef)(null);
1731
+ const createTitleChangeHandler = (0, external_react_namespaceObject.useCallback)((nodeId)=>(newTitle)=>{
1732
+ setNodesRef.current((nds)=>nds.map((node)=>node.id === nodeId ? {
1733
+ ...node,
1734
+ data: {
1735
+ ...node.data,
1736
+ stageDetails: {
1737
+ ...node.data.stageDetails,
1738
+ label: newTitle
1739
+ }
1740
+ }
1741
+ } : node));
1742
+ }, []);
1760
1743
  const initialNodes = (0, external_react_namespaceObject.useMemo)(()=>[
1761
1744
  {
1762
1745
  id: 'editable-stage',
@@ -1788,7 +1771,8 @@ const InlineTitleEditStory = ()=>{
1788
1771
  },
1789
1772
  onTaskAdd: ()=>{
1790
1773
  window.alert('Add task functionality - this would open a dialog to add a new task');
1791
- }
1774
+ },
1775
+ onStageTitleChange: createTitleChangeHandler('editable-stage')
1792
1776
  }
1793
1777
  },
1794
1778
  {
@@ -1814,36 +1798,16 @@ const InlineTitleEditStory = ()=>{
1814
1798
  },
1815
1799
  onTaskAdd: ()=>{
1816
1800
  window.alert('Add task functionality - this would open a dialog to add a new task');
1817
- }
1801
+ },
1802
+ onStageTitleChange: createTitleChangeHandler('long-title-stage')
1818
1803
  }
1819
1804
  }
1820
- ], []);
1821
- const [nodes, setNodes, onNodesChange] = (0, react_cjs_namespaceObject.useNodesState)(initialNodes);
1822
- const [edges, setEdges, onEdgesChange] = (0, react_cjs_namespaceObject.useEdgesState)([]);
1823
- const createTitleChangeHandler = (0, external_react_namespaceObject.useCallback)((nodeId)=>(newTitle)=>{
1824
- setNodes((nds)=>nds.map((node)=>node.id === nodeId ? {
1825
- ...node,
1826
- data: {
1827
- ...node.data,
1828
- stageDetails: {
1829
- ...node.data.stageDetails,
1830
- label: newTitle
1831
- }
1832
- }
1833
- } : node));
1834
- }, [
1835
- setNodes
1836
- ]);
1837
- const nodesWithHandlers = (0, external_react_namespaceObject.useMemo)(()=>nodes.map((node)=>({
1838
- ...node,
1839
- data: {
1840
- ...node.data,
1841
- onStageTitleChange: createTitleChangeHandler(node.id)
1842
- }
1843
- })), [
1844
- nodes,
1805
+ ], [
1845
1806
  createTitleChangeHandler
1846
1807
  ]);
1808
+ const [nodes, setNodes, onNodesChange] = (0, react_cjs_namespaceObject.useNodesState)(initialNodes);
1809
+ setNodesRef.current = setNodes;
1810
+ const [edges, setEdges, onEdgesChange] = (0, react_cjs_namespaceObject.useEdgesState)([]);
1847
1811
  const onConnect = (0, external_react_namespaceObject.useCallback)((connection)=>setEdges((eds)=>(0, react_cjs_namespaceObject.addEdge)(connection, eds)), [
1848
1812
  setEdges
1849
1813
  ]);
@@ -1854,7 +1818,7 @@ const InlineTitleEditStory = ()=>{
1854
1818
  },
1855
1819
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.ReactFlowProvider, {
1856
1820
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_BaseCanvas_index_cjs_namespaceObject.BaseCanvas, {
1857
- nodes: nodesWithHandlers,
1821
+ nodes: nodes,
1858
1822
  edges: edges,
1859
1823
  onNodesChange: onNodesChange,
1860
1824
  onEdgesChange: onEdgesChange,
@@ -1888,8 +1852,7 @@ const EditableStageTitle = {
1888
1852
  parameters: {
1889
1853
  useCustomRender: true
1890
1854
  },
1891
- render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(InlineTitleEditStory, {}),
1892
- args: {}
1855
+ render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(InlineTitleEditStory, {})
1893
1856
  };
1894
1857
  const fetchChildren = (id)=>new Promise((resolve)=>{
1895
1858
  setTimeout(()=>{
@@ -1945,20 +1908,33 @@ const loadedTaskOptionsWithChildren = [
1945
1908
  }
1946
1909
  ];
1947
1910
  const AddTaskLoadingStory = ()=>{
1948
- const StageNodeWrapper = (0, external_react_namespaceObject.useMemo)(()=>function(props) {
1949
- return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_cjs_namespaceObject.StageNode, {
1950
- ...props,
1951
- ...props.data
1952
- });
1953
- }, []);
1954
1911
  const nodeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
1955
- stage: StageNodeWrapper
1956
- }), [
1957
- StageNodeWrapper
1958
- ]);
1912
+ stage: external_StageNode_stories_utils_cjs_namespaceObject.StageNodeWrapper
1913
+ }), []);
1959
1914
  const edgeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
1960
1915
  stage: external_StageEdge_cjs_namespaceObject.StageEdge
1961
1916
  }), []);
1917
+ const setNodesRef = (0, external_react_namespaceObject.useRef)(null);
1918
+ const timeoutRef = (0, external_react_namespaceObject.useRef)(void 0);
1919
+ const handleAddTaskFromToolbox = (0, external_react_namespaceObject.useCallback)((nodeId, _taskItem)=>{
1920
+ clearTimeout(timeoutRef.current);
1921
+ setNodesRef.current((nds)=>nds.map((n)=>n.id === nodeId ? {
1922
+ ...n,
1923
+ data: {
1924
+ ...n.data,
1925
+ addTaskLoading: true
1926
+ }
1927
+ } : n));
1928
+ timeoutRef.current = setTimeout(()=>{
1929
+ setNodesRef.current((nds)=>nds.map((n)=>n.id === nodeId ? {
1930
+ ...n,
1931
+ data: {
1932
+ ...n.data,
1933
+ addTaskLoading: false
1934
+ }
1935
+ } : n));
1936
+ }, 2000);
1937
+ }, []);
1962
1938
  const initialNodes = (0, external_react_namespaceObject.useMemo)(()=>[
1963
1939
  {
1964
1940
  id: 'loading-stage-empty',
@@ -1974,7 +1950,10 @@ const AddTaskLoadingStory = ()=>{
1974
1950
  tasks: []
1975
1951
  },
1976
1952
  addTaskLoading: true,
1977
- taskOptions: []
1953
+ taskOptions: [],
1954
+ onAddTaskFromToolbox: (taskItem)=>{
1955
+ handleAddTaskFromToolbox('loading-stage-empty', taskItem);
1956
+ }
1978
1957
  }
1979
1958
  },
1980
1959
  {
@@ -1999,11 +1978,17 @@ const AddTaskLoadingStory = ()=>{
1999
1978
  ]
2000
1979
  },
2001
1980
  addTaskLoading: false,
2002
- taskOptions: loadedTaskOptionsWithChildren
1981
+ taskOptions: loadedTaskOptionsWithChildren,
1982
+ onAddTaskFromToolbox: (taskItem)=>{
1983
+ handleAddTaskFromToolbox('loading-stage-children', taskItem);
1984
+ }
2003
1985
  }
2004
1986
  }
2005
- ], []);
2006
- const [nodesState, setNodes, onNodesChange] = (0, react_cjs_namespaceObject.useNodesState)(initialNodes);
1987
+ ], [
1988
+ handleAddTaskFromToolbox
1989
+ ]);
1990
+ const [nodes, setNodes, onNodesChange] = (0, react_cjs_namespaceObject.useNodesState)(initialNodes);
1991
+ setNodesRef.current = setNodes;
2007
1992
  const [edges, setEdges, onEdgesChange] = (0, react_cjs_namespaceObject.useEdgesState)([]);
2008
1993
  (0, external_react_namespaceObject.useEffect)(()=>{
2009
1994
  const timeout = setTimeout(()=>{
@@ -2020,41 +2005,7 @@ const AddTaskLoadingStory = ()=>{
2020
2005
  }, [
2021
2006
  setNodes
2022
2007
  ]);
2023
- const timeoutRef = (0, external_react_namespaceObject.useRef)(void 0);
2024
2008
  (0, external_react_namespaceObject.useEffect)(()=>()=>clearTimeout(timeoutRef.current), []);
2025
- const handleAddTaskFromToolbox = (0, external_react_namespaceObject.useCallback)((nodeId, _taskItem)=>{
2026
- clearTimeout(timeoutRef.current);
2027
- setNodes((nds)=>nds.map((n)=>n.id === nodeId ? {
2028
- ...n,
2029
- data: {
2030
- ...n.data,
2031
- addTaskLoading: true
2032
- }
2033
- } : n));
2034
- timeoutRef.current = setTimeout(()=>{
2035
- setNodes((nds)=>nds.map((n)=>n.id === nodeId ? {
2036
- ...n,
2037
- data: {
2038
- ...n.data,
2039
- addTaskLoading: false
2040
- }
2041
- } : n));
2042
- }, 2000);
2043
- }, [
2044
- setNodes
2045
- ]);
2046
- const nodesWithHandler = (0, external_react_namespaceObject.useMemo)(()=>nodesState.map((node)=>({
2047
- ...node,
2048
- data: {
2049
- ...node.data,
2050
- onAddTaskFromToolbox: (taskItem)=>{
2051
- handleAddTaskFromToolbox(node.id, taskItem);
2052
- }
2053
- }
2054
- })), [
2055
- nodesState,
2056
- handleAddTaskFromToolbox
2057
- ]);
2058
2009
  const onConnect = (0, external_react_namespaceObject.useCallback)((connection)=>setEdges((eds)=>(0, react_cjs_namespaceObject.addEdge)(connection, eds)), [
2059
2010
  setEdges
2060
2011
  ]);
@@ -2065,7 +2016,7 @@ const AddTaskLoadingStory = ()=>{
2065
2016
  },
2066
2017
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.ReactFlowProvider, {
2067
2018
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_BaseCanvas_index_cjs_namespaceObject.BaseCanvas, {
2068
- nodes: nodesWithHandler,
2019
+ nodes: nodes,
2069
2020
  edges: edges,
2070
2021
  onNodesChange: onNodesChange,
2071
2022
  onEdgesChange: onEdgesChange,
@@ -2099,8 +2050,7 @@ const AddTaskLoading = {
2099
2050
  parameters: {
2100
2051
  useCustomRender: true
2101
2052
  },
2102
- render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(AddTaskLoadingStory, {}),
2103
- args: {}
2053
+ render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(AddTaskLoadingStory, {})
2104
2054
  };
2105
2055
  const AdhocTasks = {
2106
2056
  name: 'Adhoc Tasks',
@@ -2236,8 +2186,7 @@ const AdhocTasks = {
2236
2186
  }
2237
2187
  }
2238
2188
  ]
2239
- },
2240
- args: {}
2189
+ }
2241
2190
  };
2242
2191
  const WithRulesTags = {
2243
2192
  name: 'With Rules & Tags',
@@ -2572,8 +2521,7 @@ const WithRulesTags = {
2572
2521
  }
2573
2522
  }
2574
2523
  ]
2575
- },
2576
- args: {}
2524
+ }
2577
2525
  };
2578
2526
  exports.AddAndReplaceTasks = __webpack_exports__.AddAndReplaceTasks;
2579
2527
  exports.AddTaskLoading = __webpack_exports__.AddTaskLoading;
@@ -1,6 +1,6 @@
1
1
  import type { Meta, StoryObj } from '@storybook/react';
2
- import { StageNode } from './StageNode';
3
- declare const meta: Meta<typeof StageNode>;
2
+ import { type StageNodeProps } from './StageNode.types';
3
+ declare const meta: Meta<StageNodeProps>;
4
4
  export default meta;
5
5
  type Story = StoryObj<typeof meta>;
6
6
  export declare const Default: Story;
@@ -1 +1 @@
1
- {"version":3,"file":"StageNode.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAyBvD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CA0FD,CAAC;AAEjC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AA4CnC,eAAO,MAAM,OAAO,EAAE,KAoHrB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAsE3B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KA8M7B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KA+HvC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KAoKpC,CAAC;AA8GF,eAAO,MAAM,uBAAuB,EAAE,KAOrC,CAAC;AAkVF,eAAO,MAAM,kBAAkB,EAAE,KAOhC,CAAC;AA2HF,eAAO,MAAM,kBAAkB,EAAE,KAOhC,CAAC;AA0KF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KA+HxB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAkO3B,CAAC"}
1
+ {"version":3,"file":"StageNode.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AA2BvD,OAAO,EAAuB,KAAK,cAAc,EAAsB,MAAM,mBAAmB,CAAC;AAiDjG,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,cAAc,CA8C9B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AA4CnC,eAAO,MAAM,OAAO,EAAE,KAmHrB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAqE3B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KA6M7B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KA8HvC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KAmKpC,CAAC;AAsGF,eAAO,MAAM,uBAAuB,EAAE,KAMrC,CAAC;AA0UF,eAAO,MAAM,kBAAkB,EAAE,KAMhC,CAAC;AA4GF,eAAO,MAAM,kBAAkB,EAAE,KAMhC,CAAC;AAqJF,eAAO,MAAM,cAAc,EAAE,KAM5B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KA8HxB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAiO3B,CAAC"}