@uipath/apollo-react 4.15.1 → 4.16.1

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 (139) hide show
  1. package/dist/canvas/components/AddNodePanel/AddNodeManager.cjs +6 -1
  2. package/dist/canvas/components/AddNodePanel/AddNodeManager.d.ts.map +1 -1
  3. package/dist/canvas/components/AddNodePanel/AddNodeManager.js +6 -1
  4. package/dist/canvas/components/AddNodePanel/createAddNodePreview.cjs +9 -3
  5. package/dist/canvas/components/AddNodePanel/createAddNodePreview.d.ts.map +1 -1
  6. package/dist/canvas/components/AddNodePanel/createAddNodePreview.js +9 -3
  7. package/dist/canvas/components/AgentCanvas/agent-flow.manifest.d.ts +2 -1
  8. package/dist/canvas/components/AgentCanvas/agent-flow.manifest.d.ts.map +1 -1
  9. package/dist/canvas/components/BaseNode/BaseNode.cjs +5 -4
  10. package/dist/canvas/components/BaseNode/BaseNode.d.ts.map +1 -1
  11. package/dist/canvas/components/BaseNode/BaseNode.js +4 -3
  12. package/dist/canvas/components/ButtonHandle/ButtonHandle.cjs +108 -13
  13. package/dist/canvas/components/ButtonHandle/ButtonHandle.d.ts +10 -5
  14. package/dist/canvas/components/ButtonHandle/ButtonHandle.d.ts.map +1 -1
  15. package/dist/canvas/components/ButtonHandle/ButtonHandle.js +108 -13
  16. package/dist/canvas/components/ButtonHandle/ButtonHandleLayoutUtils.cjs +159 -0
  17. package/dist/canvas/components/ButtonHandle/ButtonHandleLayoutUtils.d.ts +21 -0
  18. package/dist/canvas/components/ButtonHandle/ButtonHandleLayoutUtils.d.ts.map +1 -0
  19. package/dist/canvas/components/ButtonHandle/ButtonHandleLayoutUtils.js +122 -0
  20. package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.cjs +10 -2
  21. package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.d.ts +2 -0
  22. package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.d.ts.map +1 -1
  23. package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.js +5 -3
  24. package/dist/canvas/components/ButtonHandle/HandleButton.cjs +13 -2
  25. package/dist/canvas/components/ButtonHandle/HandleButton.d.ts +10 -1
  26. package/dist/canvas/components/ButtonHandle/HandleButton.d.ts.map +1 -1
  27. package/dist/canvas/components/ButtonHandle/HandleButton.js +13 -2
  28. package/dist/canvas/components/ButtonHandle/useButtonHandles.cjs +4 -2
  29. package/dist/canvas/components/ButtonHandle/useButtonHandles.d.ts +2 -1
  30. package/dist/canvas/components/ButtonHandle/useButtonHandles.d.ts.map +1 -1
  31. package/dist/canvas/components/ButtonHandle/useButtonHandles.js +4 -2
  32. package/dist/canvas/components/CanvasTooltip.cjs +2 -0
  33. package/dist/canvas/components/CanvasTooltip.d.ts +2 -2
  34. package/dist/canvas/components/CanvasTooltip.d.ts.map +1 -1
  35. package/dist/canvas/components/CanvasTooltip.js +2 -0
  36. package/dist/canvas/components/Edges/SequenceEdge.cjs +8 -4
  37. package/dist/canvas/components/Edges/SequenceEdge.js +8 -4
  38. package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.cjs +24 -22
  39. package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.d.ts.map +1 -1
  40. package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.js +25 -23
  41. package/dist/canvas/components/LoopNode/LoopCanvasNode.cjs +75 -0
  42. package/dist/canvas/components/LoopNode/LoopCanvasNode.d.ts +6 -0
  43. package/dist/canvas/components/LoopNode/LoopCanvasNode.d.ts.map +1 -0
  44. package/dist/canvas/components/LoopNode/LoopCanvasNode.js +41 -0
  45. package/dist/canvas/components/LoopNode/LoopNode.cjs +447 -0
  46. package/dist/canvas/components/LoopNode/LoopNode.constants.cjs +56 -0
  47. package/dist/canvas/components/LoopNode/LoopNode.constants.d.ts +7 -0
  48. package/dist/canvas/components/LoopNode/LoopNode.constants.d.ts.map +1 -0
  49. package/dist/canvas/components/LoopNode/LoopNode.constants.js +7 -0
  50. package/dist/canvas/components/LoopNode/LoopNode.d.ts +5 -0
  51. package/dist/canvas/components/LoopNode/LoopNode.d.ts.map +1 -0
  52. package/dist/canvas/components/LoopNode/LoopNode.helpers.cjs +145 -0
  53. package/dist/canvas/components/LoopNode/LoopNode.helpers.d.ts +29 -0
  54. package/dist/canvas/components/LoopNode/LoopNode.helpers.d.ts.map +1 -0
  55. package/dist/canvas/components/LoopNode/LoopNode.helpers.js +99 -0
  56. package/dist/canvas/components/LoopNode/LoopNode.js +413 -0
  57. package/dist/canvas/components/LoopNode/LoopNode.types.cjs +18 -0
  58. package/dist/canvas/components/LoopNode/LoopNode.types.d.ts +22 -0
  59. package/dist/canvas/components/LoopNode/LoopNode.types.d.ts.map +1 -0
  60. package/dist/canvas/components/LoopNode/LoopNode.types.js +0 -0
  61. package/dist/canvas/components/LoopNode/LoopNodePreview.cjs +61 -0
  62. package/dist/canvas/components/LoopNode/LoopNodePreview.d.ts +9 -0
  63. package/dist/canvas/components/LoopNode/LoopNodePreview.d.ts.map +1 -0
  64. package/dist/canvas/components/LoopNode/LoopNodePreview.js +27 -0
  65. package/dist/canvas/components/LoopNode/index.cjs +79 -0
  66. package/dist/canvas/components/LoopNode/index.d.ts +5 -0
  67. package/dist/canvas/components/LoopNode/index.d.ts.map +1 -0
  68. package/dist/canvas/components/LoopNode/index.js +4 -0
  69. package/dist/canvas/components/NodeViewportOverlay.cjs +63 -0
  70. package/dist/canvas/components/NodeViewportOverlay.d.ts +22 -0
  71. package/dist/canvas/components/NodeViewportOverlay.d.ts.map +1 -0
  72. package/dist/canvas/components/NodeViewportOverlay.js +29 -0
  73. package/dist/canvas/components/Toolbar/EdgeToolbar/EdgeToolbar.cjs +1 -1
  74. package/dist/canvas/components/Toolbar/EdgeToolbar/EdgeToolbar.js +1 -1
  75. package/dist/canvas/components/Toolbar/EdgeToolbar/useEdgeToolbarState.cjs +25 -23
  76. package/dist/canvas/components/Toolbar/EdgeToolbar/useEdgeToolbarState.d.ts.map +1 -1
  77. package/dist/canvas/components/Toolbar/EdgeToolbar/useEdgeToolbarState.js +27 -25
  78. package/dist/canvas/components/Toolbar/NodeToolbar/NodeToolbar.cjs +10 -3
  79. package/dist/canvas/components/Toolbar/NodeToolbar/NodeToolbar.d.ts +1 -1
  80. package/dist/canvas/components/Toolbar/NodeToolbar/NodeToolbar.d.ts.map +1 -1
  81. package/dist/canvas/components/Toolbar/NodeToolbar/NodeToolbar.js +10 -3
  82. package/dist/canvas/components/Toolbar/NodeToolbar/NodeToolbar.types.d.ts +1 -0
  83. package/dist/canvas/components/Toolbar/NodeToolbar/NodeToolbar.types.d.ts.map +1 -1
  84. package/dist/canvas/components/index.cjs +27 -20
  85. package/dist/canvas/components/index.d.ts +1 -0
  86. package/dist/canvas/components/index.d.ts.map +1 -1
  87. package/dist/canvas/components/index.js +1 -0
  88. package/dist/canvas/constants.cjs +12 -0
  89. package/dist/canvas/constants.d.ts +3 -0
  90. package/dist/canvas/constants.d.ts.map +1 -1
  91. package/dist/canvas/constants.js +4 -1
  92. package/dist/canvas/hooks/useAddNodeOnConnectEnd.cjs +22 -23
  93. package/dist/canvas/hooks/useAddNodeOnConnectEnd.d.ts.map +1 -1
  94. package/dist/canvas/hooks/useAddNodeOnConnectEnd.js +23 -24
  95. package/dist/canvas/hooks/usePreviewNode.cjs +2 -1
  96. package/dist/canvas/hooks/usePreviewNode.d.ts.map +1 -1
  97. package/dist/canvas/hooks/usePreviewNode.js +2 -1
  98. package/dist/canvas/schema/node-definition/handle.cjs +10 -2
  99. package/dist/canvas/schema/node-definition/handle.d.ts +9 -0
  100. package/dist/canvas/schema/node-definition/handle.d.ts.map +1 -1
  101. package/dist/canvas/schema/node-definition/handle.js +6 -1
  102. package/dist/canvas/schema/node-definition/index.cjs +4 -1
  103. package/dist/canvas/schema/node-definition/index.d.ts +3 -3
  104. package/dist/canvas/schema/node-definition/index.d.ts.map +1 -1
  105. package/dist/canvas/schema/node-definition/index.js +2 -2
  106. package/dist/canvas/schema/node-definition/node-manifest.cjs +2 -1
  107. package/dist/canvas/schema/node-definition/node-manifest.d.ts +7 -0
  108. package/dist/canvas/schema/node-definition/node-manifest.d.ts.map +1 -1
  109. package/dist/canvas/schema/node-definition/node-manifest.js +2 -1
  110. package/dist/canvas/schema/node-instance/base.d.ts +1 -0
  111. package/dist/canvas/schema/node-instance/base.d.ts.map +1 -1
  112. package/dist/canvas/schema/node-instance/node.d.ts +1 -0
  113. package/dist/canvas/schema/node-instance/node.d.ts.map +1 -1
  114. package/dist/canvas/storybook-utils/hooks/useCanvasStory.d.ts.map +1 -1
  115. package/dist/canvas/storybook-utils/manifests/index.d.ts +2 -1
  116. package/dist/canvas/storybook-utils/manifests/index.d.ts.map +1 -1
  117. package/dist/canvas/storybook-utils/manifests/node-definitions.d.ts.map +1 -1
  118. package/dist/canvas/styles/reactflow-reset.css +2 -2
  119. package/dist/canvas/styles/tailwind.canvas.css +1 -1
  120. package/dist/canvas/utils/NodeUtils.cjs +4 -0
  121. package/dist/canvas/utils/NodeUtils.d.ts +2 -1
  122. package/dist/canvas/utils/NodeUtils.d.ts.map +1 -1
  123. package/dist/canvas/utils/NodeUtils.js +2 -1
  124. package/dist/canvas/utils/collapse.cjs +13 -6
  125. package/dist/canvas/utils/collapse.d.ts.map +1 -1
  126. package/dist/canvas/utils/collapse.js +9 -2
  127. package/dist/canvas/utils/createPreviewGraph.cjs +126 -0
  128. package/dist/canvas/utils/createPreviewGraph.d.ts +36 -0
  129. package/dist/canvas/utils/createPreviewGraph.d.ts.map +1 -0
  130. package/dist/canvas/utils/createPreviewGraph.js +83 -0
  131. package/dist/canvas/utils/createPreviewNode.cjs +30 -11
  132. package/dist/canvas/utils/createPreviewNode.d.ts +10 -2
  133. package/dist/canvas/utils/createPreviewNode.d.ts.map +1 -1
  134. package/dist/canvas/utils/createPreviewNode.js +21 -11
  135. package/dist/canvas/utils/index.cjs +33 -26
  136. package/dist/canvas/utils/index.d.ts +2 -1
  137. package/dist/canvas/utils/index.d.ts.map +1 -1
  138. package/dist/canvas/utils/index.js +2 -1
  139. package/package.json +3 -3
@@ -1,5 +1,13 @@
1
1
  import { Position } from '../../xyflow/react.ts';
2
- export declare const HandleButton: import("react").MemoExoticComponent<({ visible, labelVisible, position, onAction, handleRef, label, labelIcon, labelBackgroundColor, }: {
2
+ export type HandleButtonPortal = {
3
+ nodeId: string;
4
+ left: number;
5
+ top: number;
6
+ width: number;
7
+ height: number;
8
+ transform: string;
9
+ };
10
+ export declare const HandleButton: import("react").MemoExoticComponent<({ visible, labelVisible, position, onAction, handleRef, label, labelIcon, labelBackgroundColor, portal, }: {
3
11
  visible?: boolean;
4
12
  labelVisible?: boolean;
5
13
  position: Position;
@@ -8,6 +16,7 @@ export declare const HandleButton: import("react").MemoExoticComponent<({ visibl
8
16
  label?: string;
9
17
  labelIcon?: React.ReactNode;
10
18
  labelBackgroundColor?: string;
19
+ portal?: HandleButtonPortal;
11
20
  }) => import("react/jsx-runtime").JSX.Element>;
12
21
  export declare const HandleHoverBridge: import("react").MemoExoticComponent<({ position, visible }: {
13
22
  position: Position;
@@ -1 +1 @@
1
- {"version":3,"file":"HandleButton.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ButtonHandle/HandleButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,0CAA0C,CAAC;AAqBpE,eAAO,MAAM,YAAY,0IAUpB;IACD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,6CAiGF,CAAC;AA0CF,eAAO,MAAM,iBAAiB,8DACJ;IAAE,QAAQ,EAAE,QAAQ,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,oDAOlE,CAAC"}
1
+ {"version":3,"file":"HandleButton.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ButtonHandle/HandleButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,0CAA0C,CAAC;AAepE,MAAM,MAAM,kBAAkB,GAAG;IAC/B,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAUF,eAAO,MAAM,YAAY,kJAWpB;IACD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,MAAM,CAAC,EAAE,kBAAkB,CAAC;CAC7B,6CA6GF,CAAC;AA0CF,eAAO,MAAM,iBAAiB,8DACJ;IAAE,QAAQ,EAAE,QAAQ,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,oDAOlE,CAAC"}
@@ -3,6 +3,7 @@ import { Row } from "../../layouts/index.js";
3
3
  import { Position } from "../../xyflow/react.js";
4
4
  import { memo, useCallback, useEffect, useRef } from "react";
5
5
  import { cx } from "../../utils/CssUtil.js";
6
+ import { NodeViewportOverlay } from "../NodeViewportOverlay.js";
6
7
  import { CanvasInlineButton } from "./CanvasInlineButton.js";
7
8
  import { LABEL_SHADOW_STYLE } from "./HandleLabel.js";
8
9
  const BUTTON_POSITION = {
@@ -12,7 +13,7 @@ const BUTTON_POSITION = {
12
13
  [Position.Right]: 'flex-row left-full top-1/2 -translate-y-1/2'
13
14
  };
14
15
  const DRAG_THRESHOLD = 5;
15
- const HandleButton = /*#__PURE__*/ memo(({ visible, labelVisible, position, onAction, handleRef, label, labelIcon, labelBackgroundColor })=>{
16
+ const HandleButton = /*#__PURE__*/ memo(({ visible, labelVisible, position, onAction, handleRef, label, labelIcon, labelBackgroundColor, portal })=>{
16
17
  const didDragRef = useRef(false);
17
18
  const teardownRef = useRef(null);
18
19
  useEffect(()=>()=>teardownRef.current?.(), []);
@@ -60,7 +61,7 @@ const HandleButton = /*#__PURE__*/ memo(({ visible, labelVisible, position, onAc
60
61
  document.addEventListener('pointercancel', cleanup);
61
62
  teardownRef.current = cleanup;
62
63
  }, []);
63
- return /*#__PURE__*/ jsxs("div", {
64
+ const content = /*#__PURE__*/ jsxs("div", {
64
65
  className: cx('absolute flex items-center pointer-events-none', BUTTON_POSITION[position]),
65
66
  children: [
66
67
  visible && /*#__PURE__*/ jsx(CanvasInlineButton, {
@@ -77,6 +78,16 @@ const HandleButton = /*#__PURE__*/ memo(({ visible, labelVisible, position, onAc
77
78
  })
78
79
  ]
79
80
  });
81
+ if (portal) {
82
+ const { nodeId, ...anchor } = portal;
83
+ return /*#__PURE__*/ jsx(NodeViewportOverlay, {
84
+ nodeId: nodeId,
85
+ anchor: anchor,
86
+ layer: "nodeHandleAffordance",
87
+ children: content
88
+ });
89
+ }
90
+ return content;
80
91
  });
81
92
  const InlineLabel = ({ label, labelIcon, backgroundColor, visible = true })=>/*#__PURE__*/ jsx("div", {
82
93
  className: cx('px-1.5 py-0.5 rounded-sm whitespace-nowrap select-none transition-opacity duration-250 z-10', visible ? 'opacity-100' : 'opacity-0'),
@@ -32,7 +32,7 @@ const external_react_namespaceObject = require("react");
32
32
  const manifest_resolver_cjs_namespaceObject = require("../../utils/manifest-resolver.cjs");
33
33
  const ConnectedHandlesContext_cjs_namespaceObject = require("../BaseCanvas/ConnectedHandlesContext.cjs");
34
34
  const external_index_cjs_namespaceObject = require("./index.cjs");
35
- const useButtonHandles = ({ handleConfigurations, shouldShowHandles, handleAction, nodeId, selected, hovered, showAddButton, showNotches, shouldShowAddButtonFn, nodeWidth, nodeHeight })=>{
35
+ const useButtonHandles = ({ handleConfigurations, shouldShowHandles, handleAction, nodeId, selected, hovered, showAddButton, showNotches, shouldShowAddButtonFn, nodeWidth, nodeHeight, portalActions })=>{
36
36
  const connectedHandleIds = (0, ConnectedHandlesContext_cjs_namespaceObject.useConnectedHandles)(nodeId);
37
37
  const node = (0, react_namespaceObject.useNodesData)(nodeId);
38
38
  const handleElements = (0, external_react_namespaceObject.useMemo)(()=>{
@@ -56,7 +56,8 @@ const useButtonHandles = ({ handleConfigurations, shouldShowHandles, handleActio
56
56
  customPositionAndOffsets: config.customPositionAndOffsets,
57
57
  shouldShowAddButtonFn: shouldShowAddButtonFn,
58
58
  nodeWidth: nodeWidth,
59
- nodeHeight: nodeHeight
59
+ nodeHeight: nodeHeight,
60
+ portalActions: portalActions
60
61
  }, `${i}:${config.position}:${config.handles.map((h)=>h.id).join(',')}`);
61
62
  });
62
63
  return elements;
@@ -73,6 +74,7 @@ const useButtonHandles = ({ handleConfigurations, shouldShowHandles, handleActio
73
74
  shouldShowAddButtonFn,
74
75
  nodeWidth,
75
76
  nodeHeight,
77
+ portalActions,
76
78
  node?.data
77
79
  ]);
78
80
  return handleElements;
@@ -1,6 +1,6 @@
1
1
  import type { HandleGroupManifest } from '../../schema/node-definition';
2
2
  import type { HandleActionEvent } from '../ButtonHandle';
3
- export declare const useButtonHandles: ({ handleConfigurations, shouldShowHandles, handleAction, nodeId, selected, hovered, showAddButton, showNotches, shouldShowAddButtonFn, nodeWidth, nodeHeight, }: {
3
+ export declare const useButtonHandles: ({ handleConfigurations, shouldShowHandles, handleAction, nodeId, selected, hovered, showAddButton, showNotches, shouldShowAddButtonFn, nodeWidth, nodeHeight, portalActions, }: {
4
4
  handleConfigurations: HandleGroupManifest[];
5
5
  shouldShowHandles: boolean;
6
6
  nodeId: string;
@@ -11,6 +11,7 @@ export declare const useButtonHandles: ({ handleConfigurations, shouldShowHandle
11
11
  showNotches?: boolean;
12
12
  nodeWidth?: number;
13
13
  nodeHeight?: number;
14
+ portalActions?: boolean;
14
15
  shouldShowAddButtonFn?: ({ showAddButton, selected, hovered, }: {
15
16
  showAddButton: boolean;
16
17
  selected: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"useButtonHandles.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ButtonHandle/useButtonHandles.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAGxE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAGzD,eAAO,MAAM,gBAAgB,GAAI,iKAY9B;IACD,oBAAoB,EAAE,mBAAmB,EAAE,CAAC;IAC5C,iBAAiB,EAAE,OAAO,CAAC;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IAUpB,qBAAqB,CAAC,EAAE,CAAC,EACvB,aAAa,EACb,QAAQ,EACR,OAAO,GACR,EAAE;QACD,aAAa,EAAE,OAAO,CAAC;QACvB,QAAQ,EAAE,OAAO,CAAC;QAClB,OAAO,EAAE,OAAO,CAAC;KAClB,KAAK,OAAO,CAAC;CACf,wFAgEA,CAAC"}
1
+ {"version":3,"file":"useButtonHandles.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ButtonHandle/useButtonHandles.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAGxE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAGzD,eAAO,MAAM,gBAAgB,GAAI,gLAa9B;IACD,oBAAoB,EAAE,mBAAmB,EAAE,CAAC;IAC5C,iBAAiB,EAAE,OAAO,CAAC;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;IAUxB,qBAAqB,CAAC,EAAE,CAAC,EACvB,aAAa,EACb,QAAQ,EACR,OAAO,GACR,EAAE;QACD,aAAa,EAAE,OAAO,CAAC;QACvB,QAAQ,EAAE,OAAO,CAAC;QAClB,OAAO,EAAE,OAAO,CAAC;KAClB,KAAK,OAAO,CAAC;CACf,wFAkEA,CAAC"}
@@ -4,7 +4,7 @@ import { useMemo } from "react";
4
4
  import { resolveHandles } from "../../utils/manifest-resolver.js";
5
5
  import { useConnectedHandles } from "../BaseCanvas/ConnectedHandlesContext.js";
6
6
  import { ButtonHandles } from "./index.js";
7
- const useButtonHandles = ({ handleConfigurations, shouldShowHandles, handleAction, nodeId, selected, hovered, showAddButton, showNotches, shouldShowAddButtonFn, nodeWidth, nodeHeight })=>{
7
+ const useButtonHandles = ({ handleConfigurations, shouldShowHandles, handleAction, nodeId, selected, hovered, showAddButton, showNotches, shouldShowAddButtonFn, nodeWidth, nodeHeight, portalActions })=>{
8
8
  const connectedHandleIds = useConnectedHandles(nodeId);
9
9
  const node = useNodesData(nodeId);
10
10
  const handleElements = useMemo(()=>{
@@ -28,7 +28,8 @@ const useButtonHandles = ({ handleConfigurations, shouldShowHandles, handleActio
28
28
  customPositionAndOffsets: config.customPositionAndOffsets,
29
29
  shouldShowAddButtonFn: shouldShowAddButtonFn,
30
30
  nodeWidth: nodeWidth,
31
- nodeHeight: nodeHeight
31
+ nodeHeight: nodeHeight,
32
+ portalActions: portalActions
32
33
  }, `${i}:${config.position}:${config.handles.map((h)=>h.id).join(',')}`);
33
34
  });
34
35
  return elements;
@@ -45,6 +46,7 @@ const useButtonHandles = ({ handleConfigurations, shouldShowHandles, handleActio
45
46
  shouldShowAddButtonFn,
46
47
  nodeWidth,
47
48
  nodeHeight,
49
+ portalActions,
48
50
  node?.data
49
51
  ]);
50
52
  return handleElements;
@@ -102,6 +102,8 @@ function CanvasTooltip({ content, placement = 'top', smartTooltip = false, delay
102
102
  ]);
103
103
  const effectiveOpen = isTooltipHidden ? false : isOpen ?? hoverOpen;
104
104
  const hasProvider = (0, external_react_namespaceObject.useContext)(HasTooltipProviderContext);
105
+ const isEmptyContent = null == content || false === content || 'string' == typeof content && '' === content.trim();
106
+ if (isEmptyContent) return children;
105
107
  const tooltip = /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(tooltip_namespaceObject.Tooltip, {
106
108
  open: effectiveOpen,
107
109
  onOpenChange: handleOpenChange,
@@ -1,4 +1,4 @@
1
- import { type PropsWithChildren, type ReactNode } from 'react';
1
+ import React, { type PropsWithChildren, type ReactNode } from 'react';
2
2
  export declare function CanvasTooltipProviderMarker({ children }: PropsWithChildren): import("react/jsx-runtime").JSX.Element;
3
3
  type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';
4
4
  interface CanvasTooltipProps extends PropsWithChildren {
@@ -9,6 +9,6 @@ interface CanvasTooltipProps extends PropsWithChildren {
9
9
  isOpen?: boolean;
10
10
  hide?: boolean;
11
11
  }
12
- export declare function CanvasTooltip({ content, placement, smartTooltip, delay, isOpen, hide, children, }: Readonly<CanvasTooltipProps>): import("react/jsx-runtime").JSX.Element;
12
+ export declare function CanvasTooltip({ content, placement, smartTooltip, delay, isOpen, hide, children, }: Readonly<CanvasTooltipProps>): string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null | undefined;
13
13
  export type { CanvasTooltipProps };
14
14
  //# sourceMappingURL=CanvasTooltip.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"CanvasTooltip.d.ts","sourceRoot":"","sources":["../../../src/canvas/components/CanvasTooltip.tsx"],"names":[],"mappings":"AAOA,OAAc,EAEZ,KAAK,iBAAiB,EACtB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AASf,wBAAgB,2BAA2B,CAAC,EAAE,QAAQ,EAAE,EAAE,iBAAiB,2CAI1E;AAED,KAAK,gBAAgB,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAE5D,UAAU,kBAAmB,SAAQ,iBAAiB;IAEpD,OAAO,EAAE,SAAS,CAAC;IAEnB,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAE7B,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AASD,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,SAAiB,EACjB,YAAoB,EACpB,KAAa,EACb,MAAM,EACN,IAAI,EACJ,QAAQ,GACT,EAAE,QAAQ,CAAC,kBAAkB,CAAC,2CA2F9B;AAED,YAAY,EAAE,kBAAkB,EAAE,CAAC"}
1
+ {"version":3,"file":"CanvasTooltip.d.ts","sourceRoot":"","sources":["../../../src/canvas/components/CanvasTooltip.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,EAEZ,KAAK,iBAAiB,EACtB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AASf,wBAAgB,2BAA2B,CAAC,EAAE,QAAQ,EAAE,EAAE,iBAAiB,2CAI1E;AAED,KAAK,gBAAgB,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAE5D,UAAU,kBAAmB,SAAQ,iBAAiB;IAEpD,OAAO,EAAE,SAAS,CAAC;IAEnB,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAE7B,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AASD,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,SAAiB,EACjB,YAAoB,EACpB,KAAa,EACb,MAAM,EACN,IAAI,EACJ,QAAQ,GACT,EAAE,QAAQ,CAAC,kBAAkB,CAAC,yTAkG9B;AAED,YAAY,EAAE,kBAAkB,EAAE,CAAC"}
@@ -63,6 +63,8 @@ function CanvasTooltip({ content, placement = 'top', smartTooltip = false, delay
63
63
  ]);
64
64
  const effectiveOpen = isTooltipHidden ? false : isOpen ?? hoverOpen;
65
65
  const hasProvider = useContext(HasTooltipProviderContext);
66
+ const isEmptyContent = null == content || false === content || 'string' == typeof content && '' === content.trim();
67
+ if (isEmptyContent) return children;
66
68
  const tooltip = /*#__PURE__*/ jsxs(Tooltip, {
67
69
  open: effectiveOpen,
68
70
  onOpenChange: handleOpenChange,
@@ -29,8 +29,8 @@ __webpack_require__.d(__webpack_exports__, {
29
29
  const jsx_runtime_namespaceObject = require("react/jsx-runtime");
30
30
  const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
31
31
  const external_react_namespaceObject = require("react");
32
- const external_constants_cjs_namespaceObject = require("../../constants.cjs");
33
32
  const index_cjs_namespaceObject = require("../../hooks/index.cjs");
33
+ const createPreviewNode_cjs_namespaceObject = require("../../utils/createPreviewNode.cjs");
34
34
  const BaseCanvasModeProvider_cjs_namespaceObject = require("../BaseCanvas/BaseCanvasModeProvider.cjs");
35
35
  const external_Toolbar_index_cjs_namespaceObject = require("../Toolbar/index.cjs");
36
36
  const external_EdgeUtils_cjs_namespaceObject = require("./EdgeUtils.cjs");
@@ -80,7 +80,11 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ (0, external_react_namespaceObje
80
80
  const pathElementRef = (0, external_react_namespaceObject.useRef)(null);
81
81
  const { mode } = (0, BaseCanvasModeProvider_cjs_namespaceObject.useBaseCanvasMode)();
82
82
  const isReadOnly = 'readonly' === mode;
83
- const isPreviewEdge = id === external_constants_cjs_namespaceObject.PREVIEW_EDGE_ID;
83
+ const previewEdge = (0, createPreviewNode_cjs_namespaceObject.isPreviewEdge)({
84
+ id,
85
+ source,
86
+ target
87
+ });
84
88
  const executionStatus = (0, index_cjs_namespaceObject.useEdgeExecutionState)(id, target);
85
89
  const { validationStatus } = (0, index_cjs_namespaceObject.useElementValidationStatus)(id) ?? {
86
90
  validationStatus: void 0
@@ -118,7 +122,7 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ (0, external_react_namespaceObje
118
122
  const getEdgeColor = ()=>{
119
123
  if (isDiffAdded) return 'var(--canvas-success-icon)';
120
124
  if (isDiffRemoved) return 'var(--canvas-error-icon)';
121
- if (isPreviewEdge) return 'var(--canvas-primary)';
125
+ if (previewEdge) return 'var(--canvas-primary)';
122
126
  if (selected) return 'var(--canvas-primary)';
123
127
  if (isHovered) return 'var(--canvas-primary-hover)';
124
128
  if (status) return external_EdgeUtils_cjs_namespaceObject.edgeTargetStatusToEdgeColor[status] ?? 'var(--canvas-border)';
@@ -162,7 +166,7 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ (0, external_react_namespaceObje
162
166
  strokeWidth: style?.strokeWidth || 2,
163
167
  style: {
164
168
  stroke: edgeColor,
165
- strokeDasharray: isDiffRemoved ? style?.strokeDasharray || '5,5' : isPreviewEdge ? '5,5' : '0',
169
+ strokeDasharray: isDiffRemoved ? style?.strokeDasharray || '5,5' : previewEdge ? '5,5' : '0',
166
170
  opacity: style?.opacity !== void 0 ? style.opacity : 1,
167
171
  transition: 'stroke 0.2s ease, opacity 0.2s ease'
168
172
  },
@@ -1,8 +1,8 @@
1
1
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
2
2
  import { Position } from "../../xyflow/react.js";
3
3
  import { memo, useRef, useState } from "react";
4
- import { PREVIEW_EDGE_ID } from "../../constants.js";
5
4
  import { useEdgeExecutionState, useEdgePath, useElementValidationStatus } from "../../hooks/index.js";
5
+ import { isPreviewEdge } from "../../utils/createPreviewNode.js";
6
6
  import { useBaseCanvasMode } from "../BaseCanvas/BaseCanvasModeProvider.js";
7
7
  import { EdgeToolbar, useEdgeToolbarState } from "../Toolbar/index.js";
8
8
  import { edgeTargetStatusToEdgeColor, getStatusAnimation } from "./EdgeUtils.js";
@@ -52,7 +52,11 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ memo(function({ id, selected, so
52
52
  const pathElementRef = useRef(null);
53
53
  const { mode } = useBaseCanvasMode();
54
54
  const isReadOnly = 'readonly' === mode;
55
- const isPreviewEdge = id === PREVIEW_EDGE_ID;
55
+ const previewEdge = isPreviewEdge({
56
+ id,
57
+ source,
58
+ target
59
+ });
56
60
  const executionStatus = useEdgeExecutionState(id, target);
57
61
  const { validationStatus } = useElementValidationStatus(id) ?? {
58
62
  validationStatus: void 0
@@ -90,7 +94,7 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ memo(function({ id, selected, so
90
94
  const getEdgeColor = ()=>{
91
95
  if (isDiffAdded) return 'var(--canvas-success-icon)';
92
96
  if (isDiffRemoved) return 'var(--canvas-error-icon)';
93
- if (isPreviewEdge) return 'var(--canvas-primary)';
97
+ if (previewEdge) return 'var(--canvas-primary)';
94
98
  if (selected) return 'var(--canvas-primary)';
95
99
  if (isHovered) return 'var(--canvas-primary-hover)';
96
100
  if (status) return edgeTargetStatusToEdgeColor[status] ?? 'var(--canvas-border)';
@@ -134,7 +138,7 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ memo(function({ id, selected, so
134
138
  strokeWidth: style?.strokeWidth || 2,
135
139
  style: {
136
140
  stroke: edgeColor,
137
- strokeDasharray: isDiffRemoved ? style?.strokeDasharray || '5,5' : isPreviewEdge ? '5,5' : '0',
141
+ strokeDasharray: isDiffRemoved ? style?.strokeDasharray || '5,5' : previewEdge ? '5,5' : '0',
138
142
  opacity: style?.opacity !== void 0 ? style.opacity : 1,
139
143
  transition: 'stroke 0.2s ease, opacity 0.2s ease'
140
144
  },
@@ -38,6 +38,7 @@ const animatedViewportManager_cjs_namespaceObject = require("../../stores/animat
38
38
  const canvasStore_cjs_namespaceObject = require("../../stores/canvasStore.cjs");
39
39
  const viewportManager_cjs_namespaceObject = require("../../stores/viewportManager.cjs");
40
40
  const external_types_cjs_namespaceObject = require("../../types.cjs");
41
+ const createPreviewNode_cjs_namespaceObject = require("../../utils/createPreviewNode.cjs");
41
42
  const icon_registry_cjs_namespaceObject = require("../../utils/icon-registry.cjs");
42
43
  const transitions_cjs_namespaceObject = require("../../utils/transitions.cjs");
43
44
  const AddNodeManager_cjs_namespaceObject = require("../AddNodePanel/AddNodeManager.cjs");
@@ -46,12 +47,21 @@ const external_BaseCanvas_index_cjs_namespaceObject = require("../BaseCanvas/ind
46
47
  const external_BaseNode_index_cjs_namespaceObject = require("../BaseNode/index.cjs");
47
48
  const external_BlankCanvasNode_index_cjs_namespaceObject = require("../BlankCanvasNode/index.cjs");
48
49
  const external_CanvasPositionControls_cjs_namespaceObject = require("../CanvasPositionControls.cjs");
50
+ const external_LoopNode_index_cjs_namespaceObject = require("../LoopNode/index.cjs");
49
51
  const external_MiniCanvasNavigator_index_cjs_namespaceObject = require("../MiniCanvasNavigator/index.cjs");
50
52
  const DEFAULT_NODE_TYPES = {
51
53
  default: external_BaseNode_index_cjs_namespaceObject.BaseNode,
52
54
  'blank-canvas-node': external_BlankCanvasNode_index_cjs_namespaceObject.BlankCanvasNode,
53
55
  preview: AddNodePreview_cjs_namespaceObject.AddNodePreview
54
56
  };
57
+ function shouldPersistNodeChange(change) {
58
+ if ('position' === change.type) return !!change.dragging;
59
+ if ('dimensions' === change.type) return !!change.setAttributes;
60
+ return true;
61
+ }
62
+ function isDefaultViewport(viewport) {
63
+ return 0 === viewport.x && 0 === viewport.y && 1 === viewport.zoom;
64
+ }
55
65
  const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onCanvasesChange, onPathChange })=>{
56
66
  const canvasRef = (0, external_react_namespaceObject.useRef)(null);
57
67
  const containerRef = (0, external_react_namespaceObject.useRef)(null);
@@ -64,15 +74,12 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
64
74
  const lastCanvasIdRef = (0, external_react_namespaceObject.useRef)(null);
65
75
  const shouldAnimate = 'design' === mode && !(0, transitions_cjs_namespaceObject.prefersReducedMotion)();
66
76
  const nodeManifests = (0, external_core_index_cjs_namespaceObject.useNodeManifests)();
67
- const nodeTypes = (0, external_react_namespaceObject.useMemo)(()=>{
68
- const types = nodeManifests.reduce((acc, manifest)=>{
69
- if (!acc[manifest.nodeType]) acc[manifest.nodeType] = external_BaseNode_index_cjs_namespaceObject.BaseNode;
77
+ const nodeTypes = (0, external_react_namespaceObject.useMemo)(()=>nodeManifests.reduce((acc, manifest)=>{
78
+ acc[manifest.nodeType] = (0, external_LoopNode_index_cjs_namespaceObject.isContainerNodeManifest)(manifest) ? external_LoopNode_index_cjs_namespaceObject.LoopCanvasNode : external_BaseNode_index_cjs_namespaceObject.BaseNode;
70
79
  return acc;
71
80
  }, {
72
81
  ...DEFAULT_NODE_TYPES
73
- });
74
- return types;
75
- }, [
82
+ }), [
76
83
  nodeManifests
77
84
  ]);
78
85
  const currentCanvas = (0, canvasStore_cjs_namespaceObject.useCanvasStore)(canvasStore_cjs_namespaceObject.selectCurrentCanvas);
@@ -148,15 +155,14 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
148
155
  if (currentCanvasId && lastCanvasIdRef.current && currentCanvasId !== lastCanvasIdRef.current) {
149
156
  if (reactFlowInstance && currentCanvas?.viewport) {
150
157
  const viewport = currentCanvas.viewport;
151
- if (0 !== viewport.x || 0 !== viewport.y || 1 !== viewport.zoom) setTimeout(()=>{
152
- reactFlowInstance.setViewport(viewport);
158
+ if (isDefaultViewport(viewport)) {
153
159
  currentViewportRef.current = viewport;
154
160
  viewportManager_cjs_namespaceObject.viewportManager.setCurrentViewport(viewport);
155
- }, 0);
156
- else {
161
+ } else setTimeout(()=>{
162
+ reactFlowInstance.setViewport(viewport);
157
163
  currentViewportRef.current = viewport;
158
164
  viewportManager_cjs_namespaceObject.viewportManager.setCurrentViewport(viewport);
159
- }
165
+ }, 0);
160
166
  }
161
167
  }
162
168
  lastCanvasIdRef.current = currentCanvasId || null;
@@ -171,9 +177,7 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
171
177
  const handleNodesChange = (0, external_react_namespaceObject.useCallback)((changes)=>{
172
178
  const canvas = currentCanvasRef.current;
173
179
  if (!canvas) return;
174
- const hasMeaningfulChanges = changes.some((change)=>'dimensions' !== change.type && 'position' !== change.type);
175
- const hasPositionChanges = changes.some((change)=>'position' === change.type && change.dragging);
176
- if (!hasMeaningfulChanges && !hasPositionChanges) return;
180
+ if (!changes.some(shouldPersistNodeChange)) return;
177
181
  const updatedNodes = (0, react_cjs_namespaceObject.applyNodeChanges)(changes, canvas.nodes ?? []);
178
182
  updateNodes(updatedNodes);
179
183
  }, [
@@ -205,7 +209,7 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
205
209
  const handleConnect = (0, external_react_namespaceObject.useCallback)((connection)=>{
206
210
  const canvas = currentCanvasRef.current;
207
211
  if (!connection.source || !connection.target || !canvas) return;
208
- if (connection.target === external_constants_cjs_namespaceObject.PREVIEW_NODE_ID || connection.source === external_constants_cjs_namespaceObject.PREVIEW_NODE_ID) return;
212
+ if ((0, createPreviewNode_cjs_namespaceObject.isPreviewEdge)(connection)) return;
209
213
  const newEdge = {
210
214
  id: `${connection.source}-${connection.target}-${Date.now()}`,
211
215
  source: connection.source,
@@ -213,15 +217,13 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
213
217
  sourceHandle: connection.sourceHandle || void 0,
214
218
  targetHandle: connection.targetHandle || void 0
215
219
  };
220
+ const hasPreview = canvas.nodes.some((n)=>n.id === external_constants_cjs_namespaceObject.PREVIEW_NODE_ID);
221
+ const baseEdges = hasPreview ? canvas.edges.filter((edge)=>!(0, createPreviewNode_cjs_namespaceObject.isPreviewEdge)(edge)) : canvas.edges;
216
222
  updateEdges([
217
- ...canvas.edges,
223
+ ...baseEdges,
218
224
  newEdge
219
225
  ]);
220
- const hasPreview = canvas.nodes.some((n)=>n.id === external_constants_cjs_namespaceObject.PREVIEW_NODE_ID);
221
- if (hasPreview) {
222
- updateNodes(canvas.nodes.filter((n)=>n.id !== external_constants_cjs_namespaceObject.PREVIEW_NODE_ID));
223
- updateEdges(canvas.edges.filter((e)=>e.id !== external_constants_cjs_namespaceObject.PREVIEW_EDGE_ID));
224
- }
226
+ if (hasPreview) updateNodes(canvas.nodes.filter((n)=>n.id !== external_constants_cjs_namespaceObject.PREVIEW_NODE_ID));
225
227
  }, [
226
228
  updateNodes,
227
229
  updateEdges
@@ -255,7 +257,7 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
255
257
  ]);
256
258
  const shouldFitView = (0, external_react_namespaceObject.useMemo)(()=>{
257
259
  const viewport = currentCanvas?.viewport;
258
- return viewport ? 0 === viewport.x && 0 === viewport.y && 1 === viewport.zoom : false;
260
+ return viewport ? isDefaultViewport(viewport) : false;
259
261
  }, [
260
262
  currentCanvas?.viewport
261
263
  ]);
@@ -1 +1 @@
1
- {"version":3,"file":"HierarchicalCanvas.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/HierarchicalCanvas/HierarchicalCanvas.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA4B/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAW5D,UAAU,uBAAuB;IAC/B,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;IAKtC,eAAe,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IAK9C,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IAMvB,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,KAAK,IAAI,CAAC;IAInE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACzC;AASD,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA2YhE,CAAC"}
1
+ {"version":3,"file":"HierarchicalCanvas.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/HierarchicalCanvas/HierarchicalCanvas.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA4B/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAa5D,UAAU,uBAAuB;IAC/B,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;IAKtC,eAAe,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IAK9C,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IAMvB,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,KAAK,IAAI,CAAC;IAInE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACzC;AAyBD,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA+XhE,CAAC"}
@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { Panel, applyEdgeChanges, applyNodeChanges } from "../../xyflow/react.js";
3
3
  import { Spinner } from "@uipath/apollo-wind";
4
4
  import { useCallback, useEffect, useMemo, useRef, useState } from "react";
5
- import { PREVIEW_EDGE_ID, PREVIEW_NODE_ID } from "../../constants.js";
5
+ import { PREVIEW_NODE_ID } from "../../constants.js";
6
6
  import { Breadcrumb } from "../../controls/index.js";
7
7
  import { useNodeManifests } from "../../core/index.js";
8
8
  import { useAddNodeOnConnectEnd } from "../../hooks/useAddNodeOnConnectEnd.js";
@@ -10,6 +10,7 @@ import { animatedViewportManager } from "../../stores/animatedViewportManager.js
10
10
  import { selectBreadcrumbs, selectCanvasStack, selectCurrentCanvas, selectCurrentPath, selectDrillIntoNode, selectInitializeCanvas, selectInitializeWithData, selectNavigateToDepth, selectNavigateToSiblingCanvas, selectPreviousCanvas, selectTransitionState, selectUpdateEdges, selectUpdateNodes, selectUpdateSelection, selectUpdateViewport, useCanvasStore } from "../../stores/canvasStore.js";
11
11
  import { viewportManager } from "../../stores/viewportManager.js";
12
12
  import { DefaultCanvasTranslations } from "../../types.js";
13
+ import { isPreviewEdge } from "../../utils/createPreviewNode.js";
13
14
  import { CanvasIcon } from "../../utils/icon-registry.js";
14
15
  import { prefersReducedMotion } from "../../utils/transitions.js";
15
16
  import { AddNodeManager } from "../AddNodePanel/AddNodeManager.js";
@@ -18,12 +19,21 @@ import { BaseCanvas } from "../BaseCanvas/index.js";
18
19
  import { BaseNode } from "../BaseNode/index.js";
19
20
  import { BlankCanvasNode } from "../BlankCanvasNode/index.js";
20
21
  import { CanvasPositionControls } from "../CanvasPositionControls.js";
22
+ import { LoopCanvasNode, isContainerNodeManifest } from "../LoopNode/index.js";
21
23
  import { MiniCanvasNavigator } from "../MiniCanvasNavigator/index.js";
22
24
  const DEFAULT_NODE_TYPES = {
23
25
  default: BaseNode,
24
26
  'blank-canvas-node': BlankCanvasNode,
25
27
  preview: AddNodePreview
26
28
  };
29
+ function shouldPersistNodeChange(change) {
30
+ if ('position' === change.type) return !!change.dragging;
31
+ if ('dimensions' === change.type) return !!change.setAttributes;
32
+ return true;
33
+ }
34
+ function isDefaultViewport(viewport) {
35
+ return 0 === viewport.x && 0 === viewport.y && 1 === viewport.zoom;
36
+ }
27
37
  const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onCanvasesChange, onPathChange })=>{
28
38
  const canvasRef = useRef(null);
29
39
  const containerRef = useRef(null);
@@ -36,15 +46,12 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
36
46
  const lastCanvasIdRef = useRef(null);
37
47
  const shouldAnimate = 'design' === mode && !prefersReducedMotion();
38
48
  const nodeManifests = useNodeManifests();
39
- const nodeTypes = useMemo(()=>{
40
- const types = nodeManifests.reduce((acc, manifest)=>{
41
- if (!acc[manifest.nodeType]) acc[manifest.nodeType] = BaseNode;
49
+ const nodeTypes = useMemo(()=>nodeManifests.reduce((acc, manifest)=>{
50
+ acc[manifest.nodeType] = isContainerNodeManifest(manifest) ? LoopCanvasNode : BaseNode;
42
51
  return acc;
43
52
  }, {
44
53
  ...DEFAULT_NODE_TYPES
45
- });
46
- return types;
47
- }, [
54
+ }), [
48
55
  nodeManifests
49
56
  ]);
50
57
  const currentCanvas = useCanvasStore(selectCurrentCanvas);
@@ -120,15 +127,14 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
120
127
  if (currentCanvasId && lastCanvasIdRef.current && currentCanvasId !== lastCanvasIdRef.current) {
121
128
  if (reactFlowInstance && currentCanvas?.viewport) {
122
129
  const viewport = currentCanvas.viewport;
123
- if (0 !== viewport.x || 0 !== viewport.y || 1 !== viewport.zoom) setTimeout(()=>{
124
- reactFlowInstance.setViewport(viewport);
130
+ if (isDefaultViewport(viewport)) {
125
131
  currentViewportRef.current = viewport;
126
132
  viewportManager.setCurrentViewport(viewport);
127
- }, 0);
128
- else {
133
+ } else setTimeout(()=>{
134
+ reactFlowInstance.setViewport(viewport);
129
135
  currentViewportRef.current = viewport;
130
136
  viewportManager.setCurrentViewport(viewport);
131
- }
137
+ }, 0);
132
138
  }
133
139
  }
134
140
  lastCanvasIdRef.current = currentCanvasId || null;
@@ -143,9 +149,7 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
143
149
  const handleNodesChange = useCallback((changes)=>{
144
150
  const canvas = currentCanvasRef.current;
145
151
  if (!canvas) return;
146
- const hasMeaningfulChanges = changes.some((change)=>'dimensions' !== change.type && 'position' !== change.type);
147
- const hasPositionChanges = changes.some((change)=>'position' === change.type && change.dragging);
148
- if (!hasMeaningfulChanges && !hasPositionChanges) return;
152
+ if (!changes.some(shouldPersistNodeChange)) return;
149
153
  const updatedNodes = applyNodeChanges(changes, canvas.nodes ?? []);
150
154
  updateNodes(updatedNodes);
151
155
  }, [
@@ -177,7 +181,7 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
177
181
  const handleConnect = useCallback((connection)=>{
178
182
  const canvas = currentCanvasRef.current;
179
183
  if (!connection.source || !connection.target || !canvas) return;
180
- if (connection.target === PREVIEW_NODE_ID || connection.source === PREVIEW_NODE_ID) return;
184
+ if (isPreviewEdge(connection)) return;
181
185
  const newEdge = {
182
186
  id: `${connection.source}-${connection.target}-${Date.now()}`,
183
187
  source: connection.source,
@@ -185,15 +189,13 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
185
189
  sourceHandle: connection.sourceHandle || void 0,
186
190
  targetHandle: connection.targetHandle || void 0
187
191
  };
192
+ const hasPreview = canvas.nodes.some((n)=>n.id === PREVIEW_NODE_ID);
193
+ const baseEdges = hasPreview ? canvas.edges.filter((edge)=>!isPreviewEdge(edge)) : canvas.edges;
188
194
  updateEdges([
189
- ...canvas.edges,
195
+ ...baseEdges,
190
196
  newEdge
191
197
  ]);
192
- const hasPreview = canvas.nodes.some((n)=>n.id === PREVIEW_NODE_ID);
193
- if (hasPreview) {
194
- updateNodes(canvas.nodes.filter((n)=>n.id !== PREVIEW_NODE_ID));
195
- updateEdges(canvas.edges.filter((e)=>e.id !== PREVIEW_EDGE_ID));
196
- }
198
+ if (hasPreview) updateNodes(canvas.nodes.filter((n)=>n.id !== PREVIEW_NODE_ID));
197
199
  }, [
198
200
  updateNodes,
199
201
  updateEdges
@@ -227,7 +229,7 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
227
229
  ]);
228
230
  const shouldFitView = useMemo(()=>{
229
231
  const viewport = currentCanvas?.viewport;
230
- return viewport ? 0 === viewport.x && 0 === viewport.y && 1 === viewport.zoom : false;
232
+ return viewport ? isDefaultViewport(viewport) : false;
231
233
  }, [
232
234
  currentCanvas?.viewport
233
235
  ]);
@@ -0,0 +1,75 @@
1
+ "use strict";
2
+ var __webpack_require__ = {};
3
+ (()=>{
4
+ __webpack_require__.d = (exports1, definition)=>{
5
+ for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
6
+ enumerable: true,
7
+ get: definition[key]
8
+ });
9
+ };
10
+ })();
11
+ (()=>{
12
+ __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
13
+ })();
14
+ (()=>{
15
+ __webpack_require__.r = (exports1)=>{
16
+ if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
17
+ value: 'Module'
18
+ });
19
+ Object.defineProperty(exports1, '__esModule', {
20
+ value: true
21
+ });
22
+ };
23
+ })();
24
+ var __webpack_exports__ = {};
25
+ __webpack_require__.r(__webpack_exports__);
26
+ __webpack_require__.d(__webpack_exports__, {
27
+ LoopCanvasNode: ()=>LoopCanvasNode
28
+ });
29
+ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
30
+ const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
31
+ const external_react_namespaceObject = require("react");
32
+ const index_cjs_namespaceObject = require("../../core/index.cjs");
33
+ const external_LoopNode_cjs_namespaceObject = require("./LoopNode.cjs");
34
+ const external_LoopNode_helpers_cjs_namespaceObject = require("./LoopNode.helpers.cjs");
35
+ const external_LoopNodePreview_cjs_namespaceObject = require("./LoopNodePreview.cjs");
36
+ function LoopCanvasNodeComponent(props) {
37
+ const reactFlow = (0, react_cjs_namespaceObject.useReactFlow)();
38
+ const nodeTypeRegistry = (0, index_cjs_namespaceObject.useOptionalNodeTypeRegistry)();
39
+ const nodeManifest = (0, external_react_namespaceObject.useMemo)(()=>props.type ? nodeTypeRegistry?.getManifest(props.type) : void 0, [
40
+ nodeTypeRegistry,
41
+ props.type
42
+ ]);
43
+ const containerPreviewHandles = (0, external_react_namespaceObject.useMemo)(()=>(0, external_LoopNode_helpers_cjs_namespaceObject.resolveContainerPreviewConnectionHandles)(nodeManifest, {
44
+ ...props.data ?? {},
45
+ nodeId: props.id
46
+ }), [
47
+ nodeManifest,
48
+ props.data,
49
+ props.id
50
+ ]);
51
+ const handleAddFirstChild = (0, external_react_namespaceObject.useCallback)(()=>{
52
+ if (!containerPreviewHandles) return;
53
+ (0, external_LoopNodePreview_cjs_namespaceObject.showCenteredContainerPreview)({
54
+ containerId: props.id,
55
+ reactFlowInstance: reactFlow,
56
+ previewHandles: containerPreviewHandles
57
+ });
58
+ }, [
59
+ containerPreviewHandles,
60
+ props.id,
61
+ reactFlow
62
+ ]);
63
+ return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_LoopNode_cjs_namespaceObject.LoopNode, {
64
+ ...props,
65
+ onAddFirstChild: containerPreviewHandles ? handleAddFirstChild : void 0
66
+ });
67
+ }
68
+ const LoopCanvasNode = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(LoopCanvasNodeComponent);
69
+ exports.LoopCanvasNode = __webpack_exports__.LoopCanvasNode;
70
+ for(var __rspack_i in __webpack_exports__)if (-1 === [
71
+ "LoopCanvasNode"
72
+ ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
73
+ Object.defineProperty(exports, '__esModule', {
74
+ value: true
75
+ });
@@ -0,0 +1,6 @@
1
+ import type { Node, NodeProps } from '../../xyflow/react.ts';
2
+ import type { LoopNodeData } from './LoopNode.types';
3
+ declare function LoopCanvasNodeComponent(props: NodeProps<Node<LoopNodeData>>): import("react/jsx-runtime").JSX.Element;
4
+ export declare const LoopCanvasNode: import("react").MemoExoticComponent<typeof LoopCanvasNodeComponent>;
5
+ export {};
6
+ //# sourceMappingURL=LoopCanvasNode.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LoopCanvasNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/LoopNode/LoopCanvasNode.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AAMhF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAGrD,iBAAS,uBAAuB,CAAC,KAAK,EAAE,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,2CAkCpE;AAED,eAAO,MAAM,cAAc,qEAAgC,CAAC"}