@hitachivantara/uikit-react-lab 5.19.0 → 5.19.2

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 (213) hide show
  1. package/dist/cjs/components/Dashboard/Dashboard.cjs +14 -15
  2. package/dist/cjs/components/Dashboard/Dashboard.cjs.map +1 -1
  3. package/dist/cjs/components/Dashboard/Dashboard.styles.cjs +187 -5
  4. package/dist/cjs/components/Dashboard/Dashboard.styles.cjs.map +1 -1
  5. package/dist/cjs/components/Flow/Background/Background.cjs.map +1 -1
  6. package/dist/cjs/components/Flow/Controls/Controls.cjs +34 -13
  7. package/dist/cjs/components/Flow/Controls/Controls.cjs.map +1 -1
  8. package/dist/cjs/components/Flow/DroppableFlow.cjs +101 -66
  9. package/dist/cjs/components/Flow/DroppableFlow.cjs.map +1 -1
  10. package/dist/cjs/components/Flow/Empty/Empty.cjs +2 -8
  11. package/dist/cjs/components/Flow/Empty/Empty.cjs.map +1 -1
  12. package/dist/cjs/components/Flow/Empty/Empty.styles.cjs +1 -4
  13. package/dist/cjs/components/Flow/Empty/Empty.styles.cjs.map +1 -1
  14. package/dist/cjs/components/Flow/Flow.cjs +24 -5
  15. package/dist/cjs/components/Flow/Flow.cjs.map +1 -1
  16. package/dist/cjs/components/Flow/Flow.styles.cjs +1 -4
  17. package/dist/cjs/components/Flow/Flow.styles.cjs.map +1 -1
  18. package/dist/cjs/components/Flow/FlowContext/FlowContext.cjs +10 -7
  19. package/dist/cjs/components/Flow/FlowContext/FlowContext.cjs.map +1 -1
  20. package/dist/cjs/components/Flow/FlowContext/NodeMetaContext.cjs +11 -6
  21. package/dist/cjs/components/Flow/FlowContext/NodeMetaContext.cjs.map +1 -1
  22. package/dist/cjs/components/Flow/Minimap/Minimap.cjs +12 -5
  23. package/dist/cjs/components/Flow/Minimap/Minimap.cjs.map +1 -1
  24. package/dist/cjs/components/Flow/Minimap/Minimap.styles.cjs +2 -7
  25. package/dist/cjs/components/Flow/Minimap/Minimap.styles.cjs.map +1 -1
  26. package/dist/cjs/components/Flow/Node/BaseNode.cjs +139 -105
  27. package/dist/cjs/components/Flow/Node/BaseNode.cjs.map +1 -1
  28. package/dist/cjs/components/Flow/Node/BaseNode.styles.cjs +1 -4
  29. package/dist/cjs/components/Flow/Node/BaseNode.styles.cjs.map +1 -1
  30. package/dist/cjs/components/Flow/Node/Node.cjs +65 -30
  31. package/dist/cjs/components/Flow/Node/Node.cjs.map +1 -1
  32. package/dist/cjs/components/Flow/Node/Node.styles.cjs +7 -5
  33. package/dist/cjs/components/Flow/Node/Node.styles.cjs.map +1 -1
  34. package/dist/cjs/components/Flow/Node/Parameters/ParamRenderer.cjs +1 -5
  35. package/dist/cjs/components/Flow/Node/Parameters/ParamRenderer.cjs.map +1 -1
  36. package/dist/cjs/components/Flow/Node/Parameters/Select.cjs +9 -18
  37. package/dist/cjs/components/Flow/Node/Parameters/Select.cjs.map +1 -1
  38. package/dist/cjs/components/Flow/Node/Parameters/Text.cjs +3 -13
  39. package/dist/cjs/components/Flow/Node/Parameters/Text.cjs.map +1 -1
  40. package/dist/cjs/components/Flow/Sidebar/Sidebar.cjs +78 -39
  41. package/dist/cjs/components/Flow/Sidebar/Sidebar.cjs.map +1 -1
  42. package/dist/cjs/components/Flow/Sidebar/Sidebar.styles.cjs +4 -13
  43. package/dist/cjs/components/Flow/Sidebar/Sidebar.styles.cjs.map +1 -1
  44. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroup.cjs +28 -16
  45. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroup.cjs.map +1 -1
  46. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.cjs +28 -30
  47. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.cjs.map +1 -1
  48. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.cjs +13 -8
  49. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.cjs.map +1 -1
  50. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.cjs +27 -18
  51. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.cjs.map +1 -1
  52. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.cjs +17 -19
  53. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.cjs.map +1 -1
  54. package/dist/cjs/components/Flow/Sidebar/utils.cjs.map +1 -1
  55. package/dist/cjs/components/Flow/base.cjs +406 -1
  56. package/dist/cjs/components/Flow/base.cjs.map +1 -1
  57. package/dist/cjs/components/Flow/hooks/useFlowContext.cjs.map +1 -1
  58. package/dist/cjs/components/Flow/hooks/useFlowNode.cjs +22 -7
  59. package/dist/cjs/components/Flow/hooks/useFlowNode.cjs.map +1 -1
  60. package/dist/cjs/components/Flow/hooks/useFlowNodeMeta.cjs +1 -3
  61. package/dist/cjs/components/Flow/hooks/useFlowNodeMeta.cjs.map +1 -1
  62. package/dist/cjs/components/StepNavigation/DefaultNavigation/DefaultNavigation.cjs +27 -30
  63. package/dist/cjs/components/StepNavigation/DefaultNavigation/DefaultNavigation.cjs.map +1 -1
  64. package/dist/cjs/components/StepNavigation/DefaultNavigation/Step/Step.cjs +45 -9
  65. package/dist/cjs/components/StepNavigation/DefaultNavigation/Step/Step.cjs.map +1 -1
  66. package/dist/cjs/components/StepNavigation/DefaultNavigation/Step/Step.styles.cjs +2 -7
  67. package/dist/cjs/components/StepNavigation/DefaultNavigation/Step/Step.styles.cjs.map +1 -1
  68. package/dist/cjs/components/StepNavigation/DefaultNavigation/utils.cjs +5 -20
  69. package/dist/cjs/components/StepNavigation/DefaultNavigation/utils.cjs.map +1 -1
  70. package/dist/cjs/components/StepNavigation/SimpleNavigation/Dot/Dot.cjs +27 -15
  71. package/dist/cjs/components/StepNavigation/SimpleNavigation/Dot/Dot.cjs.map +1 -1
  72. package/dist/cjs/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.cjs +2 -8
  73. package/dist/cjs/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.cjs.map +1 -1
  74. package/dist/cjs/components/StepNavigation/SimpleNavigation/SimpleNavigation.cjs +22 -26
  75. package/dist/cjs/components/StepNavigation/SimpleNavigation/SimpleNavigation.cjs.map +1 -1
  76. package/dist/cjs/components/StepNavigation/SimpleNavigation/utils.cjs.map +1 -1
  77. package/dist/cjs/components/StepNavigation/StepNavigation.cjs +131 -92
  78. package/dist/cjs/components/StepNavigation/StepNavigation.cjs.map +1 -1
  79. package/dist/cjs/components/StepNavigation/StepNavigation.styles.cjs +1 -4
  80. package/dist/cjs/components/StepNavigation/StepNavigation.styles.cjs.map +1 -1
  81. package/dist/cjs/components/StepNavigation/utils.cjs.map +1 -1
  82. package/dist/cjs/components/Wizard/Wizard.cjs +65 -30
  83. package/dist/cjs/components/Wizard/Wizard.cjs.map +1 -1
  84. package/dist/cjs/components/Wizard/Wizard.styles.cjs +1 -4
  85. package/dist/cjs/components/Wizard/Wizard.styles.cjs.map +1 -1
  86. package/dist/cjs/components/Wizard/WizardActions/WizardActions.cjs +72 -27
  87. package/dist/cjs/components/Wizard/WizardActions/WizardActions.cjs.map +1 -1
  88. package/dist/cjs/components/Wizard/WizardActions/WizardActions.styles.cjs +1 -4
  89. package/dist/cjs/components/Wizard/WizardActions/WizardActions.styles.cjs.map +1 -1
  90. package/dist/cjs/components/Wizard/WizardContainer/WizardContainer.cjs +16 -7
  91. package/dist/cjs/components/Wizard/WizardContainer/WizardContainer.cjs.map +1 -1
  92. package/dist/cjs/components/Wizard/WizardContainer/WizardContainer.styles.cjs +13 -13
  93. package/dist/cjs/components/Wizard/WizardContainer/WizardContainer.styles.cjs.map +1 -1
  94. package/dist/cjs/components/Wizard/WizardContent/LoadingContainer.cjs +24 -17
  95. package/dist/cjs/components/Wizard/WizardContent/LoadingContainer.cjs.map +1 -1
  96. package/dist/cjs/components/Wizard/WizardContent/LoadingContainer.styles.cjs +17 -18
  97. package/dist/cjs/components/Wizard/WizardContent/LoadingContainer.styles.cjs.map +1 -1
  98. package/dist/cjs/components/Wizard/WizardContent/WizardContent.cjs +70 -61
  99. package/dist/cjs/components/Wizard/WizardContent/WizardContent.cjs.map +1 -1
  100. package/dist/cjs/components/Wizard/WizardContent/WizardContent.styles.cjs +1 -4
  101. package/dist/cjs/components/Wizard/WizardContent/WizardContent.styles.cjs.map +1 -1
  102. package/dist/cjs/components/Wizard/WizardContext/WizardContext.cjs.map +1 -1
  103. package/dist/cjs/components/Wizard/WizardTitle/WizardTitle.cjs +53 -31
  104. package/dist/cjs/components/Wizard/WizardTitle/WizardTitle.cjs.map +1 -1
  105. package/dist/cjs/components/Wizard/WizardTitle/WizardTitle.styles.cjs +1 -4
  106. package/dist/cjs/components/Wizard/WizardTitle/WizardTitle.styles.cjs.map +1 -1
  107. package/dist/esm/components/Dashboard/Dashboard.js +14 -15
  108. package/dist/esm/components/Dashboard/Dashboard.js.map +1 -1
  109. package/dist/esm/components/Dashboard/Dashboard.styles.js +187 -5
  110. package/dist/esm/components/Dashboard/Dashboard.styles.js.map +1 -1
  111. package/dist/esm/components/Flow/Background/Background.js.map +1 -1
  112. package/dist/esm/components/Flow/Controls/Controls.js +34 -13
  113. package/dist/esm/components/Flow/Controls/Controls.js.map +1 -1
  114. package/dist/esm/components/Flow/DroppableFlow.js +101 -66
  115. package/dist/esm/components/Flow/DroppableFlow.js.map +1 -1
  116. package/dist/esm/components/Flow/Empty/Empty.js +2 -8
  117. package/dist/esm/components/Flow/Empty/Empty.js.map +1 -1
  118. package/dist/esm/components/Flow/Empty/Empty.styles.js +1 -4
  119. package/dist/esm/components/Flow/Empty/Empty.styles.js.map +1 -1
  120. package/dist/esm/components/Flow/Flow.js +24 -5
  121. package/dist/esm/components/Flow/Flow.js.map +1 -1
  122. package/dist/esm/components/Flow/Flow.styles.js +1 -4
  123. package/dist/esm/components/Flow/Flow.styles.js.map +1 -1
  124. package/dist/esm/components/Flow/FlowContext/FlowContext.js +10 -7
  125. package/dist/esm/components/Flow/FlowContext/FlowContext.js.map +1 -1
  126. package/dist/esm/components/Flow/FlowContext/NodeMetaContext.js +11 -6
  127. package/dist/esm/components/Flow/FlowContext/NodeMetaContext.js.map +1 -1
  128. package/dist/esm/components/Flow/Minimap/Minimap.js +12 -5
  129. package/dist/esm/components/Flow/Minimap/Minimap.js.map +1 -1
  130. package/dist/esm/components/Flow/Minimap/Minimap.styles.js +2 -7
  131. package/dist/esm/components/Flow/Minimap/Minimap.styles.js.map +1 -1
  132. package/dist/esm/components/Flow/Node/BaseNode.js +139 -105
  133. package/dist/esm/components/Flow/Node/BaseNode.js.map +1 -1
  134. package/dist/esm/components/Flow/Node/BaseNode.styles.js +1 -4
  135. package/dist/esm/components/Flow/Node/BaseNode.styles.js.map +1 -1
  136. package/dist/esm/components/Flow/Node/Node.js +65 -30
  137. package/dist/esm/components/Flow/Node/Node.js.map +1 -1
  138. package/dist/esm/components/Flow/Node/Node.styles.js +7 -5
  139. package/dist/esm/components/Flow/Node/Node.styles.js.map +1 -1
  140. package/dist/esm/components/Flow/Node/Parameters/ParamRenderer.js +1 -5
  141. package/dist/esm/components/Flow/Node/Parameters/ParamRenderer.js.map +1 -1
  142. package/dist/esm/components/Flow/Node/Parameters/Select.js +9 -18
  143. package/dist/esm/components/Flow/Node/Parameters/Select.js.map +1 -1
  144. package/dist/esm/components/Flow/Node/Parameters/Text.js +3 -13
  145. package/dist/esm/components/Flow/Node/Parameters/Text.js.map +1 -1
  146. package/dist/esm/components/Flow/Sidebar/Sidebar.js +78 -39
  147. package/dist/esm/components/Flow/Sidebar/Sidebar.js.map +1 -1
  148. package/dist/esm/components/Flow/Sidebar/Sidebar.styles.js +4 -13
  149. package/dist/esm/components/Flow/Sidebar/Sidebar.styles.js.map +1 -1
  150. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroup.js +28 -16
  151. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroup.js.map +1 -1
  152. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.js +28 -30
  153. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.js.map +1 -1
  154. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.js +13 -8
  155. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.js.map +1 -1
  156. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.js +27 -18
  157. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.js.map +1 -1
  158. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.js +17 -19
  159. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.js.map +1 -1
  160. package/dist/esm/components/Flow/Sidebar/utils.js.map +1 -1
  161. package/dist/esm/components/Flow/base.js +406 -1
  162. package/dist/esm/components/Flow/base.js.map +1 -1
  163. package/dist/esm/components/Flow/hooks/useFlowContext.js.map +1 -1
  164. package/dist/esm/components/Flow/hooks/useFlowNode.js +22 -7
  165. package/dist/esm/components/Flow/hooks/useFlowNode.js.map +1 -1
  166. package/dist/esm/components/Flow/hooks/useFlowNodeMeta.js +1 -3
  167. package/dist/esm/components/Flow/hooks/useFlowNodeMeta.js.map +1 -1
  168. package/dist/esm/components/StepNavigation/DefaultNavigation/DefaultNavigation.js +27 -30
  169. package/dist/esm/components/StepNavigation/DefaultNavigation/DefaultNavigation.js.map +1 -1
  170. package/dist/esm/components/StepNavigation/DefaultNavigation/Step/Step.js +45 -9
  171. package/dist/esm/components/StepNavigation/DefaultNavigation/Step/Step.js.map +1 -1
  172. package/dist/esm/components/StepNavigation/DefaultNavigation/Step/Step.styles.js +2 -7
  173. package/dist/esm/components/StepNavigation/DefaultNavigation/Step/Step.styles.js.map +1 -1
  174. package/dist/esm/components/StepNavigation/DefaultNavigation/utils.js +5 -20
  175. package/dist/esm/components/StepNavigation/DefaultNavigation/utils.js.map +1 -1
  176. package/dist/esm/components/StepNavigation/SimpleNavigation/Dot/Dot.js +27 -15
  177. package/dist/esm/components/StepNavigation/SimpleNavigation/Dot/Dot.js.map +1 -1
  178. package/dist/esm/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.js +2 -8
  179. package/dist/esm/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.js.map +1 -1
  180. package/dist/esm/components/StepNavigation/SimpleNavigation/SimpleNavigation.js +22 -26
  181. package/dist/esm/components/StepNavigation/SimpleNavigation/SimpleNavigation.js.map +1 -1
  182. package/dist/esm/components/StepNavigation/SimpleNavigation/utils.js.map +1 -1
  183. package/dist/esm/components/StepNavigation/StepNavigation.js +130 -91
  184. package/dist/esm/components/StepNavigation/StepNavigation.js.map +1 -1
  185. package/dist/esm/components/StepNavigation/StepNavigation.styles.js +1 -4
  186. package/dist/esm/components/StepNavigation/StepNavigation.styles.js.map +1 -1
  187. package/dist/esm/components/StepNavigation/utils.js.map +1 -1
  188. package/dist/esm/components/Wizard/Wizard.js +65 -30
  189. package/dist/esm/components/Wizard/Wizard.js.map +1 -1
  190. package/dist/esm/components/Wizard/Wizard.styles.js +1 -4
  191. package/dist/esm/components/Wizard/Wizard.styles.js.map +1 -1
  192. package/dist/esm/components/Wizard/WizardActions/WizardActions.js +72 -27
  193. package/dist/esm/components/Wizard/WizardActions/WizardActions.js.map +1 -1
  194. package/dist/esm/components/Wizard/WizardActions/WizardActions.styles.js +1 -4
  195. package/dist/esm/components/Wizard/WizardActions/WizardActions.styles.js.map +1 -1
  196. package/dist/esm/components/Wizard/WizardContainer/WizardContainer.js +16 -7
  197. package/dist/esm/components/Wizard/WizardContainer/WizardContainer.js.map +1 -1
  198. package/dist/esm/components/Wizard/WizardContainer/WizardContainer.styles.js +13 -13
  199. package/dist/esm/components/Wizard/WizardContainer/WizardContainer.styles.js.map +1 -1
  200. package/dist/esm/components/Wizard/WizardContent/LoadingContainer.js +24 -17
  201. package/dist/esm/components/Wizard/WizardContent/LoadingContainer.js.map +1 -1
  202. package/dist/esm/components/Wizard/WizardContent/LoadingContainer.styles.js +18 -19
  203. package/dist/esm/components/Wizard/WizardContent/LoadingContainer.styles.js.map +1 -1
  204. package/dist/esm/components/Wizard/WizardContent/WizardContent.js +70 -61
  205. package/dist/esm/components/Wizard/WizardContent/WizardContent.js.map +1 -1
  206. package/dist/esm/components/Wizard/WizardContent/WizardContent.styles.js +1 -4
  207. package/dist/esm/components/Wizard/WizardContent/WizardContent.styles.js.map +1 -1
  208. package/dist/esm/components/Wizard/WizardContext/WizardContext.js.map +1 -1
  209. package/dist/esm/components/Wizard/WizardTitle/WizardTitle.js +53 -31
  210. package/dist/esm/components/Wizard/WizardTitle/WizardTitle.js.map +1 -1
  211. package/dist/esm/components/Wizard/WizardTitle/WizardTitle.styles.js +1 -4
  212. package/dist/esm/components/Wizard/WizardTitle/WizardTitle.styles.js.map +1 -1
  213. package/package.json +11 -11
@@ -19,15 +19,10 @@ const isInputConnected = (id, type, handleId, edges) => {
19
19
  }
20
20
  return false;
21
21
  };
22
- const defaultActions = [{
23
- id: "delete",
24
- label: "Delete",
25
- icon: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Delete, {})
26
- }, {
27
- id: "duplicate",
28
- label: "Duplicate",
29
- icon: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Duplicate, {})
30
- }];
22
+ const defaultActions = [
23
+ { id: "delete", label: "Delete", icon: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Delete, {}) },
24
+ { id: "duplicate", label: "Duplicate", icon: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Duplicate, {}) }
25
+ ];
31
26
  const renderedIcon = (actionIcon) => React.isValidElement(actionIcon) ? actionIcon : actionIcon?.();
32
27
  const HvFlowBaseNode = ({
33
28
  id,
@@ -42,114 +37,153 @@ const HvFlowBaseNode = ({
42
37
  className,
43
38
  children
44
39
  }) => {
45
- const {
46
- registerNode,
47
- unregisterNode
48
- } = NodeMetaContext.useNodeMetaRegistry();
40
+ const { registerNode, unregisterNode } = NodeMetaContext.useNodeMetaRegistry();
49
41
  React.useEffect(() => {
50
- registerNode(id, {
51
- label: title || "",
52
- inputs,
53
- outputs
54
- });
42
+ registerNode(id, { label: title || "", inputs, outputs });
55
43
  return () => unregisterNode(id);
56
44
  }, [id, title, inputs, outputs, registerNode, unregisterNode]);
57
45
  const [showActions, setShowActions] = React.useState(false);
58
46
  const reactFlowInstance = ReactFlow.useReactFlow();
59
- const {
60
- classes,
61
- cx,
62
- css
63
- } = BaseNode_styles.useClasses(classesProp);
47
+ const { classes, cx, css } = BaseNode_styles.useClasses(classesProp);
64
48
  const node = useFlowNode.useFlowNode(id);
65
49
  const inputEdges = useFlowNode.useFlowNodeInputEdges(id);
66
50
  const outputEdges = useFlowNode.useFlowNodeOutputEdges(id);
67
- const handleDefaultAction = React.useCallback((action) => {
68
- if (!node)
69
- return;
70
- if (action.callback) {
71
- action.callback(node);
72
- return;
73
- }
74
- switch (action.id) {
75
- case "delete":
76
- reactFlowInstance.deleteElements({
77
- nodes: [node]
78
- });
79
- break;
80
- case "duplicate":
81
- reactFlowInstance.addNodes([{
82
- ...node,
83
- id: uid.uid(),
84
- position: {
85
- x: node.position.x,
86
- y: node.position.y + (node.height || 0) + 20
87
- },
88
- selected: false,
89
- zIndex: Number(uikitStyles.theme.zIndices.overlay)
90
- }]);
91
- break;
92
- }
93
- }, [node, reactFlowInstance]);
51
+ const handleDefaultAction = React.useCallback(
52
+ (action) => {
53
+ if (!node)
54
+ return;
55
+ if (action.callback) {
56
+ action.callback(node);
57
+ return;
58
+ }
59
+ switch (action.id) {
60
+ case "delete":
61
+ reactFlowInstance.deleteElements({ nodes: [node] });
62
+ break;
63
+ case "duplicate":
64
+ reactFlowInstance.addNodes([
65
+ {
66
+ ...node,
67
+ id: uid.uid(),
68
+ position: {
69
+ x: node.position.x,
70
+ y: node.position.y + (node.height || 0) + 20
71
+ },
72
+ selected: false,
73
+ zIndex: Number(uikitStyles.theme.zIndices.overlay)
74
+ }
75
+ ]);
76
+ break;
77
+ }
78
+ },
79
+ [node, reactFlowInstance]
80
+ );
94
81
  if (!node)
95
82
  return null;
96
83
  const color = uikitStyles.getColor(colorProp);
97
84
  const iconColor = React.isValidElement(icon) ? uikitStyles.getColor(icon.props.color || "base_dark") : uikitStyles.getColor("base_dark");
98
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(
99
- "nowheel",
100
- // Disables the default canvas pan behaviour when scrolling inside the node
101
- css({
102
- border: `1px solid ${color}`
103
- }),
104
- classes.root,
105
- className
106
- ), onMouseEnter: () => setShowActions(true), onMouseLeave: () => setShowActions(false), children: [
107
- /* @__PURE__ */ jsxRuntime.jsx(ReactFlow.NodeToolbar, { isVisible: showActions, offset: 0, children: nodeActions?.map((action) => /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvButton, { icon: true, onClick: () => handleDefaultAction(action), children: renderedIcon(action.icon) }, action.id)) }),
108
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(css({
109
- backgroundColor: color
110
- }), classes.headerContainer), children: [
111
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(classes.titleContainer, css({
112
- "& svg *.color0": {
113
- fill: iconColor
114
- }
115
- })), children: [
116
- icon,
117
- /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { component: "p", variant: "title4", className: classes.title, children: title })
118
- ] }),
119
- headerItems && /* @__PURE__ */ jsxRuntime.jsx("div", { style: {
120
- display: "flex"
121
- }, children: headerItems })
122
- ] }),
123
- children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.contentContainer, children }),
124
- inputs && inputs.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
125
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.inputsTitleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: "Inputs" }) }),
126
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.inputsContainer, children: inputs?.map((input, idx) => {
127
- const handleId = input.id ?? idx.toString();
128
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.inputContainer, children: [
129
- /* @__PURE__ */ jsxRuntime.jsx(ReactFlow.Handle, { type: "target", isConnectableStart: false, id: handleId, position: ReactFlow.Position.Left, style: {
130
- top: "auto",
131
- bottom: (outputs?.length ? 80 : 18) + (outputs?.length || 0) * 29 + 29 * idx
132
- } }),
133
- /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: input.label }),
134
- input.isMandatory && !isInputConnected(id, "target", handleId, inputEdges) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.mandatory })
135
- ] }, idx);
136
- }) })
137
- ] }),
138
- outputs && outputs.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
139
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.outputsTitleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: "Outputs" }) }),
140
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.outputsContainer, children: outputs?.map((output, idx) => {
141
- const handleId = output.id ?? idx.toString();
142
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.outputContainer, children: [
143
- /* @__PURE__ */ jsxRuntime.jsx(ReactFlow.Handle, { type: "source", isConnectableEnd: false, id: handleId, position: ReactFlow.Position.Right, style: {
144
- bottom: -10 + 29 * (outputs.length - idx),
145
- top: "auto"
146
- } }),
147
- output.isMandatory && !isInputConnected(id, "source", handleId, outputEdges) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.mandatory }),
148
- /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: output.label })
149
- ] }, idx);
150
- }) })
151
- ] })
152
- ] });
85
+ return /* @__PURE__ */ jsxRuntime.jsxs(
86
+ "div",
87
+ {
88
+ className: cx(
89
+ "nowheel",
90
+ // Disables the default canvas pan behaviour when scrolling inside the node
91
+ css({ border: `1px solid ${color}` }),
92
+ classes.root,
93
+ className
94
+ ),
95
+ onMouseEnter: () => setShowActions(true),
96
+ onMouseLeave: () => setShowActions(false),
97
+ children: [
98
+ /* @__PURE__ */ jsxRuntime.jsx(ReactFlow.NodeToolbar, { isVisible: showActions, offset: 0, children: nodeActions?.map((action) => /* @__PURE__ */ jsxRuntime.jsx(
99
+ uikitReactCore.HvButton,
100
+ {
101
+ icon: true,
102
+ onClick: () => handleDefaultAction(action),
103
+ children: renderedIcon(action.icon)
104
+ },
105
+ action.id
106
+ )) }),
107
+ /* @__PURE__ */ jsxRuntime.jsxs(
108
+ "div",
109
+ {
110
+ className: cx(css({ backgroundColor: color }), classes.headerContainer),
111
+ children: [
112
+ /* @__PURE__ */ jsxRuntime.jsxs(
113
+ "div",
114
+ {
115
+ className: cx(
116
+ classes.titleContainer,
117
+ css({ "& svg *.color0": { fill: iconColor } })
118
+ ),
119
+ children: [
120
+ icon,
121
+ /* @__PURE__ */ jsxRuntime.jsx(
122
+ uikitReactCore.HvTypography,
123
+ {
124
+ component: "p",
125
+ variant: "title4",
126
+ className: classes.title,
127
+ children: title
128
+ }
129
+ )
130
+ ]
131
+ }
132
+ ),
133
+ headerItems && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex" }, children: headerItems })
134
+ ]
135
+ }
136
+ ),
137
+ children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.contentContainer, children }),
138
+ inputs && inputs.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
139
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.inputsTitleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: "Inputs" }) }),
140
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.inputsContainer, children: inputs?.map((input, idx) => {
141
+ const handleId = input.id ?? idx.toString();
142
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.inputContainer, children: [
143
+ /* @__PURE__ */ jsxRuntime.jsx(
144
+ ReactFlow.Handle,
145
+ {
146
+ type: "target",
147
+ isConnectableStart: false,
148
+ id: handleId,
149
+ position: ReactFlow.Position.Left,
150
+ style: {
151
+ top: "auto",
152
+ bottom: (outputs?.length ? 80 : 18) + (outputs?.length || 0) * 29 + 29 * idx
153
+ }
154
+ }
155
+ ),
156
+ /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: input.label }),
157
+ input.isMandatory && !isInputConnected(id, "target", handleId, inputEdges) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.mandatory })
158
+ ] }, idx);
159
+ }) })
160
+ ] }),
161
+ outputs && outputs.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
162
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.outputsTitleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: "Outputs" }) }),
163
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.outputsContainer, children: outputs?.map((output, idx) => {
164
+ const handleId = output.id ?? idx.toString();
165
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.outputContainer, children: [
166
+ /* @__PURE__ */ jsxRuntime.jsx(
167
+ ReactFlow.Handle,
168
+ {
169
+ type: "source",
170
+ isConnectableEnd: false,
171
+ id: handleId,
172
+ position: ReactFlow.Position.Right,
173
+ style: {
174
+ bottom: -10 + 29 * (outputs.length - idx),
175
+ top: "auto"
176
+ }
177
+ }
178
+ ),
179
+ output.isMandatory && !isInputConnected(id, "source", handleId, outputEdges) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.mandatory }),
180
+ /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: output.label })
181
+ ] }, idx);
182
+ }) })
183
+ ] })
184
+ ]
185
+ }
186
+ );
153
187
  };
154
188
  exports.flowBaseNodeClasses = BaseNode_styles.staticClasses;
155
189
  exports.HvFlowBaseNode = HvFlowBaseNode;
@@ -1 +1 @@
1
- {"version":3,"file":"BaseNode.cjs","sources":["../../../../../src/components/Flow/Node/BaseNode.tsx"],"sourcesContent":["import { isValidElement, useCallback, useEffect, useState } from \"react\";\nimport {\n Edge,\n Handle,\n NodeProps,\n NodeToolbar,\n Position,\n useReactFlow,\n} from \"reactflow\";\nimport { uid } from \"uid\";\nimport {\n ExtractNames,\n HvActionGeneric,\n HvBaseProps,\n HvButton,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Delete, Duplicate } from \"@hitachivantara/uikit-react-icons\";\nimport { HvColorAny, getColor, theme } from \"@hitachivantara/uikit-styles\";\n\nimport {\n HvFlowNodeAction,\n HvFlowBuiltInActions,\n HvFlowNodeInput,\n HvFlowNodeOutput,\n} from \"../types\";\nimport {\n useFlowNode,\n useFlowNodeInputEdges,\n useFlowNodeOutputEdges,\n} from \"../hooks/useFlowNode\";\nimport { useNodeMetaRegistry } from \"../FlowContext/NodeMetaContext\";\nimport { staticClasses, useClasses } from \"./BaseNode.styles\";\n\nexport { staticClasses as flowBaseNodeClasses };\n\nexport type HvFlowBaseNodeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowBaseNodeProps<T = any>\n extends Omit<HvBaseProps, \"id\">,\n NodeProps<T> {\n /** Header title */\n title?: string;\n /** Header icon */\n icon?: React.ReactNode;\n /** Header color */\n color?: HvColorAny;\n /** Header items */\n headerItems?: React.ReactNode;\n /** Node inputs */\n inputs?: HvFlowNodeInput[];\n /** Node outputs */\n outputs?: HvFlowNodeOutput[];\n /** Node actions */\n nodeActions?: HvFlowNodeAction[];\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowBaseNodeClasses;\n}\n\nconst isInputConnected = (\n id: string,\n type: \"target\" | \"source\",\n handleId: string,\n edges: Edge[]\n) => {\n if (type === \"target\") {\n return edges.some((e) => e.target === id && e.targetHandle === handleId);\n }\n if (type === \"source\") {\n return edges.some((e) => e.source === id && e.sourceHandle === handleId);\n }\n\n return false;\n};\n\nconst defaultActions: HvFlowBuiltInActions[] = [\n { id: \"delete\", label: \"Delete\", icon: <Delete /> },\n { id: \"duplicate\", label: \"Duplicate\", icon: <Duplicate /> },\n];\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowBaseNode = ({\n id,\n title,\n headerItems,\n icon,\n color: colorProp,\n inputs,\n outputs,\n nodeActions = defaultActions,\n classes: classesProp,\n className,\n children,\n}: HvFlowBaseNodeProps<unknown>) => {\n const { registerNode, unregisterNode } = useNodeMetaRegistry();\n useEffect(() => {\n registerNode(id, { label: title || \"\", inputs, outputs });\n return () => unregisterNode(id);\n }, [id, title, inputs, outputs, registerNode, unregisterNode]);\n\n const [showActions, setShowActions] = useState(false);\n const reactFlowInstance = useReactFlow();\n\n const { classes, cx, css } = useClasses(classesProp);\n\n const node = useFlowNode(id);\n const inputEdges = useFlowNodeInputEdges(id);\n const outputEdges = useFlowNodeOutputEdges(id);\n\n const handleDefaultAction = useCallback(\n (action: HvFlowNodeAction) => {\n if (!node) return;\n\n if (action.callback) {\n action.callback(node);\n return;\n }\n\n // built-in actions\n switch (action.id) {\n case \"delete\":\n reactFlowInstance.deleteElements({ nodes: [node] });\n break;\n case \"duplicate\":\n reactFlowInstance.addNodes([\n {\n ...node,\n id: uid(),\n position: {\n x: node.position.x,\n y: node.position.y + (node.height || 0) + 20,\n },\n selected: false,\n zIndex: Number(theme.zIndices.overlay),\n },\n ]);\n break;\n default:\n break;\n }\n },\n [node, reactFlowInstance]\n );\n\n if (!node) return null;\n\n const color = getColor(colorProp);\n const iconColor = isValidElement(icon)\n ? getColor(icon.props.color || \"base_dark\")\n : getColor(\"base_dark\");\n\n return (\n <div\n className={cx(\n \"nowheel\", // Disables the default canvas pan behaviour when scrolling inside the node\n css({ border: `1px solid ${color}` }),\n classes.root,\n className\n )}\n onMouseEnter={() => setShowActions(true)}\n onMouseLeave={() => setShowActions(false)}\n >\n <NodeToolbar isVisible={showActions} offset={0}>\n {nodeActions?.map((action) => (\n <HvButton\n key={action.id}\n icon\n onClick={() => handleDefaultAction(action)}\n >\n {renderedIcon(action.icon)}\n </HvButton>\n ))}\n </NodeToolbar>\n <div\n className={cx(css({ backgroundColor: color }), classes.headerContainer)}\n >\n <div\n className={cx(\n classes.titleContainer,\n css({ \"& svg *.color0\": { fill: iconColor } })\n )}\n >\n {icon}\n <HvTypography\n component=\"p\"\n variant=\"title4\"\n className={classes.title}\n >\n {title}\n </HvTypography>\n </div>\n {headerItems && <div style={{ display: \"flex\" }}>{headerItems}</div>}\n </div>\n {children && <div className={classes.contentContainer}>{children}</div>}\n {inputs && inputs.length > 0 && (\n <>\n <div className={classes.inputsTitleContainer}>\n <HvTypography>Inputs</HvTypography>\n </div>\n\n <div className={classes.inputsContainer}>\n {inputs?.map((input, idx) => {\n const handleId = input.id ?? idx.toString();\n return (\n <div className={classes.inputContainer} key={idx}>\n <Handle\n type=\"target\"\n isConnectableStart={false}\n id={handleId}\n position={Position.Left}\n style={{\n top: \"auto\",\n bottom:\n (outputs?.length ? 80 : 18) +\n (outputs?.length || 0) * 29 +\n 29 * idx,\n }}\n />\n <HvTypography>{input.label}</HvTypography>\n {input.isMandatory &&\n !isInputConnected(id, \"target\", handleId, inputEdges) && (\n <div className={classes.mandatory} />\n )}\n </div>\n );\n })}\n </div>\n </>\n )}\n {outputs && outputs.length > 0 && (\n <>\n <div className={classes.outputsTitleContainer}>\n <HvTypography>Outputs</HvTypography>\n </div>\n <div className={classes.outputsContainer}>\n {outputs?.map((output, idx) => {\n const handleId = output.id ?? idx.toString();\n return (\n <div className={classes.outputContainer} key={idx}>\n <Handle\n type=\"source\"\n isConnectableEnd={false}\n id={handleId}\n position={Position.Right}\n style={{\n bottom: -10 + 29 * (outputs.length - idx),\n top: \"auto\",\n }}\n />\n {output.isMandatory &&\n !isInputConnected(id, \"source\", handleId, outputEdges) && (\n <div className={classes.mandatory} />\n )}\n <HvTypography>{output.label}</HvTypography>\n </div>\n );\n })}\n </div>\n </>\n )}\n </div>\n );\n};\n"],"names":["isInputConnected","id","type","handleId","edges","some","e","target","targetHandle","source","sourceHandle","defaultActions","label","icon","Delete","Duplicate","renderedIcon","actionIcon","isValidElement","HvFlowBaseNode","title","headerItems","color","colorProp","inputs","outputs","nodeActions","classes","classesProp","className","children","registerNode","unregisterNode","useNodeMetaRegistry","useEffect","showActions","setShowActions","useState","reactFlowInstance","useReactFlow","cx","css","useClasses","node","useFlowNode","inputEdges","useFlowNodeInputEdges","outputEdges","useFlowNodeOutputEdges","handleDefaultAction","useCallback","action","callback","deleteElements","nodes","addNodes","uid","position","x","y","height","selected","zIndex","Number","theme","zIndices","overlay","getColor","iconColor","props","jsxs","border","root","jsx","NodeToolbar","map","HvButton","backgroundColor","headerContainer","titleContainer","fill","HvTypography","display","contentContainer","length","Fragment","inputsTitleContainer","inputsContainer","input","idx","toString","inputContainer","Handle","Position","Left","top","bottom","isMandatory","mandatory","outputsTitleContainer","outputsContainer","output","outputContainer","Right"],"mappings":"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"}
1
+ {"version":3,"file":"BaseNode.cjs","sources":["../../../../../src/components/Flow/Node/BaseNode.tsx"],"sourcesContent":["import { isValidElement, useCallback, useEffect, useState } from \"react\";\nimport {\n Edge,\n Handle,\n NodeProps,\n NodeToolbar,\n Position,\n useReactFlow,\n} from \"reactflow\";\nimport { uid } from \"uid\";\nimport {\n ExtractNames,\n HvActionGeneric,\n HvBaseProps,\n HvButton,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Delete, Duplicate } from \"@hitachivantara/uikit-react-icons\";\nimport { HvColorAny, getColor, theme } from \"@hitachivantara/uikit-styles\";\n\nimport {\n HvFlowNodeAction,\n HvFlowBuiltInActions,\n HvFlowNodeInput,\n HvFlowNodeOutput,\n} from \"../types\";\nimport {\n useFlowNode,\n useFlowNodeInputEdges,\n useFlowNodeOutputEdges,\n} from \"../hooks/useFlowNode\";\nimport { useNodeMetaRegistry } from \"../FlowContext/NodeMetaContext\";\nimport { staticClasses, useClasses } from \"./BaseNode.styles\";\n\nexport { staticClasses as flowBaseNodeClasses };\n\nexport type HvFlowBaseNodeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowBaseNodeProps<T = any>\n extends Omit<HvBaseProps, \"id\">,\n NodeProps<T> {\n /** Header title */\n title?: string;\n /** Header icon */\n icon?: React.ReactNode;\n /** Header color */\n color?: HvColorAny;\n /** Header items */\n headerItems?: React.ReactNode;\n /** Node inputs */\n inputs?: HvFlowNodeInput[];\n /** Node outputs */\n outputs?: HvFlowNodeOutput[];\n /** Node actions */\n nodeActions?: HvFlowNodeAction[];\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowBaseNodeClasses;\n}\n\nconst isInputConnected = (\n id: string,\n type: \"target\" | \"source\",\n handleId: string,\n edges: Edge[]\n) => {\n if (type === \"target\") {\n return edges.some((e) => e.target === id && e.targetHandle === handleId);\n }\n if (type === \"source\") {\n return edges.some((e) => e.source === id && e.sourceHandle === handleId);\n }\n\n return false;\n};\n\nconst defaultActions: HvFlowBuiltInActions[] = [\n { id: \"delete\", label: \"Delete\", icon: <Delete /> },\n { id: \"duplicate\", label: \"Duplicate\", icon: <Duplicate /> },\n];\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowBaseNode = ({\n id,\n title,\n headerItems,\n icon,\n color: colorProp,\n inputs,\n outputs,\n nodeActions = defaultActions,\n classes: classesProp,\n className,\n children,\n}: HvFlowBaseNodeProps<unknown>) => {\n const { registerNode, unregisterNode } = useNodeMetaRegistry();\n useEffect(() => {\n registerNode(id, { label: title || \"\", inputs, outputs });\n return () => unregisterNode(id);\n }, [id, title, inputs, outputs, registerNode, unregisterNode]);\n\n const [showActions, setShowActions] = useState(false);\n const reactFlowInstance = useReactFlow();\n\n const { classes, cx, css } = useClasses(classesProp);\n\n const node = useFlowNode(id);\n const inputEdges = useFlowNodeInputEdges(id);\n const outputEdges = useFlowNodeOutputEdges(id);\n\n const handleDefaultAction = useCallback(\n (action: HvFlowNodeAction) => {\n if (!node) return;\n\n if (action.callback) {\n action.callback(node);\n return;\n }\n\n // built-in actions\n switch (action.id) {\n case \"delete\":\n reactFlowInstance.deleteElements({ nodes: [node] });\n break;\n case \"duplicate\":\n reactFlowInstance.addNodes([\n {\n ...node,\n id: uid(),\n position: {\n x: node.position.x,\n y: node.position.y + (node.height || 0) + 20,\n },\n selected: false,\n zIndex: Number(theme.zIndices.overlay),\n },\n ]);\n break;\n default:\n break;\n }\n },\n [node, reactFlowInstance]\n );\n\n if (!node) return null;\n\n const color = getColor(colorProp);\n const iconColor = isValidElement(icon)\n ? getColor(icon.props.color || \"base_dark\")\n : getColor(\"base_dark\");\n\n return (\n <div\n className={cx(\n \"nowheel\", // Disables the default canvas pan behaviour when scrolling inside the node\n css({ border: `1px solid ${color}` }),\n classes.root,\n className\n )}\n onMouseEnter={() => setShowActions(true)}\n onMouseLeave={() => setShowActions(false)}\n >\n <NodeToolbar isVisible={showActions} offset={0}>\n {nodeActions?.map((action) => (\n <HvButton\n key={action.id}\n icon\n onClick={() => handleDefaultAction(action)}\n >\n {renderedIcon(action.icon)}\n </HvButton>\n ))}\n </NodeToolbar>\n <div\n className={cx(css({ backgroundColor: color }), classes.headerContainer)}\n >\n <div\n className={cx(\n classes.titleContainer,\n css({ \"& svg *.color0\": { fill: iconColor } })\n )}\n >\n {icon}\n <HvTypography\n component=\"p\"\n variant=\"title4\"\n className={classes.title}\n >\n {title}\n </HvTypography>\n </div>\n {headerItems && <div style={{ display: \"flex\" }}>{headerItems}</div>}\n </div>\n {children && <div className={classes.contentContainer}>{children}</div>}\n {inputs && inputs.length > 0 && (\n <>\n <div className={classes.inputsTitleContainer}>\n <HvTypography>Inputs</HvTypography>\n </div>\n\n <div className={classes.inputsContainer}>\n {inputs?.map((input, idx) => {\n const handleId = input.id ?? idx.toString();\n return (\n <div className={classes.inputContainer} key={idx}>\n <Handle\n type=\"target\"\n isConnectableStart={false}\n id={handleId}\n position={Position.Left}\n style={{\n top: \"auto\",\n bottom:\n (outputs?.length ? 80 : 18) +\n (outputs?.length || 0) * 29 +\n 29 * idx,\n }}\n />\n <HvTypography>{input.label}</HvTypography>\n {input.isMandatory &&\n !isInputConnected(id, \"target\", handleId, inputEdges) && (\n <div className={classes.mandatory} />\n )}\n </div>\n );\n })}\n </div>\n </>\n )}\n {outputs && outputs.length > 0 && (\n <>\n <div className={classes.outputsTitleContainer}>\n <HvTypography>Outputs</HvTypography>\n </div>\n <div className={classes.outputsContainer}>\n {outputs?.map((output, idx) => {\n const handleId = output.id ?? idx.toString();\n return (\n <div className={classes.outputContainer} key={idx}>\n <Handle\n type=\"source\"\n isConnectableEnd={false}\n id={handleId}\n position={Position.Right}\n style={{\n bottom: -10 + 29 * (outputs.length - idx),\n top: \"auto\",\n }}\n />\n {output.isMandatory &&\n !isInputConnected(id, \"source\", handleId, outputEdges) && (\n <div className={classes.mandatory} />\n )}\n <HvTypography>{output.label}</HvTypography>\n </div>\n );\n })}\n </div>\n </>\n )}\n </div>\n );\n};\n"],"names":["jsx","Delete","Duplicate","isValidElement","useNodeMetaRegistry","useEffect","useState","useReactFlow","useClasses","useFlowNode","useFlowNodeInputEdges","useFlowNodeOutputEdges","useCallback","uid","theme","getColor","jsxs","NodeToolbar","HvButton","HvTypography","Fragment","Handle","Position"],"mappings":"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"}
@@ -1,10 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const uikitReactCore = require("@hitachivantara/uikit-react-core");
4
- const {
5
- staticClasses,
6
- useClasses
7
- } = uikitReactCore.createClasses("HvFlowBaseNode", {
4
+ const { staticClasses, useClasses } = uikitReactCore.createClasses("HvFlowBaseNode", {
8
5
  root: {
9
6
  borderRadius: uikitReactCore.theme.radii.round,
10
7
  backgroundColor: uikitReactCore.theme.colors.atmo1,
@@ -1 +1 @@
1
- {"version":3,"file":"BaseNode.styles.cjs","sources":["../../../../../src/components/Flow/Node/BaseNode.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowBaseNode\", {\n root: {\n borderRadius: theme.radii.round,\n backgroundColor: theme.colors.atmo1,\n boxShadow: theme.colors.shadow,\n minWidth: \"250px\",\n },\n headerContainer: {\n padding: theme.spacing(0.5, 1),\n display: \"flex\",\n flexDirection: \"row\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n borderTopLeftRadius: \"inherit\",\n borderTopRightRadius: \"inherit\",\n },\n titleContainer: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n },\n title: {\n color: theme.colors.base_dark,\n },\n inputsTitleContainer: {\n display: \"flex\",\n justifyContent: \"center\",\n padding: theme.space.xs,\n backgroundColor: theme.colors.atmo2,\n borderTop: `1px solid ${theme.colors.atmo4}`,\n borderBottom: `1px solid ${theme.colors.atmo4}`,\n },\n outputsTitleContainer: {\n display: \"flex\",\n justifyContent: \"center\",\n padding: theme.space.xs,\n backgroundColor: theme.colors.atmo2,\n borderTop: `1px solid ${theme.colors.atmo4}`,\n borderBottom: `1px solid ${theme.colors.atmo4}`,\n },\n contentContainer: {},\n inputsContainer: {\n display: \"flex\",\n flexDirection: \"column\",\n padding: theme.space.sm,\n gap: theme.space.xs,\n alignItems: \"flex-start\",\n },\n outputsContainer: {\n display: \"flex\",\n flexDirection: \"column\",\n padding: theme.space.sm,\n gap: theme.space.xs,\n alignItems: \"flex-end\",\n },\n inputContainer: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n },\n outputContainer: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n },\n mandatory: {\n width: 10,\n height: 10,\n margin: theme.spacing(0, theme.space.xs),\n borderRadius: theme.radii.circle,\n backgroundColor: theme.colors.negative_20,\n },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","borderRadius","theme","radii","round","backgroundColor","colors","atmo1","boxShadow","shadow","minWidth","headerContainer","padding","spacing","display","flexDirection","justifyContent","alignItems","borderTopLeftRadius","borderTopRightRadius","titleContainer","title","color","base_dark","inputsTitleContainer","space","xs","atmo2","borderTop","atmo4","borderBottom","outputsTitleContainer","contentContainer","inputsContainer","sm","gap","outputsContainer","inputContainer","outputContainer","mandatory","width","height","margin","circle","negative_20"],"mappings":";;;AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,eAAAA,cAAc,kBAAkB;AAAA,EAC3EC,MAAM;AAAA,IACJC,cAAcC,eAAAA,MAAMC,MAAMC;AAAAA,IAC1BC,iBAAiBH,eAAAA,MAAMI,OAAOC;AAAAA,IAC9BC,WAAWN,eAAAA,MAAMI,OAAOG;AAAAA,IACxBC,UAAU;AAAA,EACZ;AAAA,EACAC,iBAAiB;AAAA,IACfC,SAASV,eAAAA,MAAMW,QAAQ,KAAK,CAAC;AAAA,IAC7BC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZC,qBAAqB;AAAA,IACrBC,sBAAsB;AAAA,EACxB;AAAA,EACAC,gBAAgB;AAAA,IACdN,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAI,OAAO;AAAA,IACLC,OAAOpB,eAAAA,MAAMI,OAAOiB;AAAAA,EACtB;AAAA,EACAC,sBAAsB;AAAA,IACpBV,SAAS;AAAA,IACTE,gBAAgB;AAAA,IAChBJ,SAASV,eAAAA,MAAMuB,MAAMC;AAAAA,IACrBrB,iBAAiBH,eAAAA,MAAMI,OAAOqB;AAAAA,IAC9BC,WAAY,aAAY1B,eAAMI,MAAAA,OAAOuB,KAAM;AAAA,IAC3CC,cAAe,aAAY5B,eAAMI,MAAAA,OAAOuB,KAAM;AAAA,EAChD;AAAA,EACAE,uBAAuB;AAAA,IACrBjB,SAAS;AAAA,IACTE,gBAAgB;AAAA,IAChBJ,SAASV,eAAAA,MAAMuB,MAAMC;AAAAA,IACrBrB,iBAAiBH,eAAAA,MAAMI,OAAOqB;AAAAA,IAC9BC,WAAY,aAAY1B,eAAMI,MAAAA,OAAOuB,KAAM;AAAA,IAC3CC,cAAe,aAAY5B,eAAMI,MAAAA,OAAOuB,KAAM;AAAA,EAChD;AAAA,EACAG,kBAAkB,CAAC;AAAA,EACnBC,iBAAiB;AAAA,IACfnB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfH,SAASV,eAAAA,MAAMuB,MAAMS;AAAAA,IACrBC,KAAKjC,eAAAA,MAAMuB,MAAMC;AAAAA,IACjBT,YAAY;AAAA,EACd;AAAA,EACAmB,kBAAkB;AAAA,IAChBtB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfH,SAASV,eAAAA,MAAMuB,MAAMS;AAAAA,IACrBC,KAAKjC,eAAAA,MAAMuB,MAAMC;AAAAA,IACjBT,YAAY;AAAA,EACd;AAAA,EACAoB,gBAAgB;AAAA,IACdvB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAqB,iBAAiB;AAAA,IACfxB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAsB,WAAW;AAAA,IACTC,OAAO;AAAA,IACPC,QAAQ;AAAA,IACRC,QAAQxC,eAAMW,MAAAA,QAAQ,GAAGX,eAAAA,MAAMuB,MAAMC,EAAE;AAAA,IACvCzB,cAAcC,eAAAA,MAAMC,MAAMwC;AAAAA,IAC1BtC,iBAAiBH,eAAAA,MAAMI,OAAOsC;AAAAA,EAChC;AACF,CAAC;;;"}
1
+ {"version":3,"file":"BaseNode.styles.cjs","sources":["../../../../../src/components/Flow/Node/BaseNode.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowBaseNode\", {\n root: {\n borderRadius: theme.radii.round,\n backgroundColor: theme.colors.atmo1,\n boxShadow: theme.colors.shadow,\n minWidth: \"250px\",\n },\n headerContainer: {\n padding: theme.spacing(0.5, 1),\n display: \"flex\",\n flexDirection: \"row\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n borderTopLeftRadius: \"inherit\",\n borderTopRightRadius: \"inherit\",\n },\n titleContainer: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n },\n title: {\n color: theme.colors.base_dark,\n },\n inputsTitleContainer: {\n display: \"flex\",\n justifyContent: \"center\",\n padding: theme.space.xs,\n backgroundColor: theme.colors.atmo2,\n borderTop: `1px solid ${theme.colors.atmo4}`,\n borderBottom: `1px solid ${theme.colors.atmo4}`,\n },\n outputsTitleContainer: {\n display: \"flex\",\n justifyContent: \"center\",\n padding: theme.space.xs,\n backgroundColor: theme.colors.atmo2,\n borderTop: `1px solid ${theme.colors.atmo4}`,\n borderBottom: `1px solid ${theme.colors.atmo4}`,\n },\n contentContainer: {},\n inputsContainer: {\n display: \"flex\",\n flexDirection: \"column\",\n padding: theme.space.sm,\n gap: theme.space.xs,\n alignItems: \"flex-start\",\n },\n outputsContainer: {\n display: \"flex\",\n flexDirection: \"column\",\n padding: theme.space.sm,\n gap: theme.space.xs,\n alignItems: \"flex-end\",\n },\n inputContainer: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n },\n outputContainer: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n },\n mandatory: {\n width: 10,\n height: 10,\n margin: theme.spacing(0, theme.space.xs),\n borderRadius: theme.radii.circle,\n backgroundColor: theme.colors.negative_20,\n },\n});\n"],"names":["createClasses","theme"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,kBAAkB;AAAA,EAC3E,MAAM;AAAA,IACJ,cAAcC,eAAAA,MAAM,MAAM;AAAA,IAC1B,iBAAiBA,eAAAA,MAAM,OAAO;AAAA,IAC9B,WAAWA,eAAAA,MAAM,OAAO;AAAA,IACxB,UAAU;AAAA,EACZ;AAAA,EACA,iBAAiB;AAAA,IACf,SAASA,eAAA,MAAM,QAAQ,KAAK,CAAC;AAAA,IAC7B,SAAS;AAAA,IACT,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,qBAAqB;AAAA,IACrB,sBAAsB;AAAA,EACxB;AAAA,EACA,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,IACL,OAAOA,eAAAA,MAAM,OAAO;AAAA,EACtB;AAAA,EACA,sBAAsB;AAAA,IACpB,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,SAASA,eAAAA,MAAM,MAAM;AAAA,IACrB,iBAAiBA,eAAAA,MAAM,OAAO;AAAA,IAC9B,WAAW,aAAaA,eAAM,MAAA,OAAO,KAAK;AAAA,IAC1C,cAAc,aAAaA,eAAM,MAAA,OAAO,KAAK;AAAA,EAC/C;AAAA,EACA,uBAAuB;AAAA,IACrB,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,SAASA,eAAAA,MAAM,MAAM;AAAA,IACrB,iBAAiBA,eAAAA,MAAM,OAAO;AAAA,IAC9B,WAAW,aAAaA,eAAM,MAAA,OAAO,KAAK;AAAA,IAC1C,cAAc,aAAaA,eAAM,MAAA,OAAO,KAAK;AAAA,EAC/C;AAAA,EACA,kBAAkB,CAAC;AAAA,EACnB,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,eAAe;AAAA,IACf,SAASA,eAAAA,MAAM,MAAM;AAAA,IACrB,KAAKA,eAAAA,MAAM,MAAM;AAAA,IACjB,YAAY;AAAA,EACd;AAAA,EACA,kBAAkB;AAAA,IAChB,SAAS;AAAA,IACT,eAAe;AAAA,IACf,SAASA,eAAAA,MAAM,MAAM;AAAA,IACrB,KAAKA,eAAAA,MAAM,MAAM;AAAA,IACjB,YAAY;AAAA,EACd;AAAA,EACA,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,EACd;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,EACd;AAAA,EACA,WAAW;AAAA,IACT,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,QAAQA,eAAM,MAAA,QAAQ,GAAGA,eAAA,MAAM,MAAM,EAAE;AAAA,IACvC,cAAcA,eAAAA,MAAM,MAAM;AAAA,IAC1B,iBAAiBA,eAAAA,MAAM,OAAO;AAAA,EAChC;AACF,CAAC;;;"}
@@ -28,16 +28,10 @@ const HvFlowNode = ({
28
28
  expandParamsButtonProps,
29
29
  ...props
30
30
  }) => {
31
- const {
32
- classes
33
- } = Node_styles.useClasses(classesProp);
31
+ const { classes } = Node_styles.useClasses(classesProp);
34
32
  const [showParams, setShowParams] = React.useState(expanded);
35
33
  const node = useFlowNode.useFlowNode(id);
36
- const {
37
- nodeGroups,
38
- nodeTypes,
39
- defaultActions
40
- } = useFlowContext.useFlowContext();
34
+ const { nodeGroups, nodeTypes, defaultActions } = useFlowContext.useFlowContext();
41
35
  const subtitle = nodeTypes?.[type].meta?.label || nodeDefaults?.subTitle;
42
36
  const groupId = nodeTypes?.[type].meta?.groupId;
43
37
  const group = groupId && nodeGroups && nodeGroups[groupId] || void 0;
@@ -47,28 +41,69 @@ const HvFlowNode = ({
47
41
  const actsVisible = actions?.slice(0, maxVisibleActions);
48
42
  const actsDropdown = actions?.slice(maxVisibleActions);
49
43
  const hasParams = !!(params && params.length > 0);
50
- return /* @__PURE__ */ jsxRuntime.jsxs(BaseNode.HvFlowBaseNode, { id, type, title: groupLabel, icon, color, inputs, outputs, nodeActions: defaultActions, classes: classesProp, headerItems: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
51
- headerItems,
52
- description && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTooltip, { title: description, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Info, { color: "base_dark" }) }) }),
53
- hasParams && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvButton, { icon: true, overrideIconColors: false, onClick: () => setShowParams((p) => !p), "aria-label": showParams ? "Collapse" : "Expand", ...expandParamsButtonProps, children: showParams ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Up, { role: "none", color: "base_dark" }) : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Down, { role: "none", color: "base_dark" }) })
54
- ] }), ...props, children: [
55
- (subtitle || actsVisible?.length || actsDropdown?.length) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.subtitleContainer, children: [
56
- subtitle && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: subtitle }) }),
57
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.actions, children: actions?.length && actions?.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
58
- actsVisible?.map((action) => /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTooltip, { title: action.label, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvButton, { icon: true, onClick: (event) => {
59
- actionCallback?.(event, id, action);
60
- }, "aria-label": action.label, children: renderedIcon(action.icon) }) }, action.id)),
61
- actsDropdown && actsDropdown.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvDropDownMenu, { keepOpened: false, dataList: actsDropdown?.map((action) => ({
62
- id: action.id,
63
- label: action.label
64
- })), onClick: (event, action) => {
65
- actionCallback?.(event, id, action);
66
- } })
67
- ] }) })
68
- ] }),
69
- children,
70
- showParams && params && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.paramsContainer, children: /* @__PURE__ */ jsxRuntime.jsx(ParamRenderer.default, { nodeId: id, params, data: node?.data }) })
71
- ] });
44
+ return /* @__PURE__ */ jsxRuntime.jsxs(
45
+ BaseNode.HvFlowBaseNode,
46
+ {
47
+ id,
48
+ type,
49
+ title: groupLabel,
50
+ icon,
51
+ color,
52
+ inputs,
53
+ outputs,
54
+ nodeActions: defaultActions,
55
+ classes: classesProp,
56
+ headerItems: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
57
+ headerItems,
58
+ description && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTooltip, { title: description, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Info, { color: "base_dark" }) }) }),
59
+ hasParams && /* @__PURE__ */ jsxRuntime.jsx(
60
+ uikitReactCore.HvButton,
61
+ {
62
+ icon: true,
63
+ overrideIconColors: false,
64
+ onClick: () => setShowParams((p) => !p),
65
+ "aria-label": showParams ? "Collapse" : "Expand",
66
+ ...expandParamsButtonProps,
67
+ children: showParams ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Up, { role: "none", color: "base_dark" }) : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Down, { role: "none", color: "base_dark" })
68
+ }
69
+ )
70
+ ] }),
71
+ ...props,
72
+ children: [
73
+ (subtitle || actsVisible?.length || actsDropdown?.length) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.subtitleContainer, children: [
74
+ subtitle && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: subtitle }) }),
75
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.actions, children: actions?.length && actions?.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
76
+ actsVisible?.map((action) => /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTooltip, { title: action.label, children: /* @__PURE__ */ jsxRuntime.jsx(
77
+ uikitReactCore.HvButton,
78
+ {
79
+ icon: true,
80
+ onClick: (event) => {
81
+ actionCallback?.(event, id, action);
82
+ },
83
+ "aria-label": action.label,
84
+ children: renderedIcon(action.icon)
85
+ }
86
+ ) }, action.id)),
87
+ actsDropdown && actsDropdown.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
88
+ uikitReactCore.HvDropDownMenu,
89
+ {
90
+ keepOpened: false,
91
+ dataList: actsDropdown?.map((action) => ({
92
+ id: action.id,
93
+ label: action.label
94
+ })),
95
+ onClick: (event, action) => {
96
+ actionCallback?.(event, id, action);
97
+ }
98
+ }
99
+ )
100
+ ] }) })
101
+ ] }),
102
+ children,
103
+ showParams && params && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.paramsContainer, children: /* @__PURE__ */ jsxRuntime.jsx(ParamRenderer.default, { nodeId: id, params, data: node?.data }) })
104
+ ]
105
+ }
106
+ );
72
107
  };
73
108
  exports.flowNodeClasses = Node_styles.staticClasses;
74
109
  exports.HvFlowNode = HvFlowNode;
@@ -1 +1 @@
1
- {"version":3,"file":"Node.cjs","sources":["../../../../../src/components/Flow/Node/Node.tsx"],"sourcesContent":["import React, { isValidElement, useState } from \"react\";\n\nimport {\n ExtractNames,\n HvActionGeneric,\n HvActionsGenericProps,\n HvButton,\n HvButtonProps,\n HvDropDownMenu,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useFlowContext, useFlowNode } from \"../hooks\";\nimport { HvFlowNodeInput, HvFlowNodeOutput, HvFlowNodeParam } from \"../types\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\nimport {\n HvFlowBaseNode,\n HvFlowBaseNodeProps,\n HvFlowBaseNodeClasses,\n} from \"./BaseNode\";\n\nexport { staticClasses as flowNodeClasses };\n\nexport interface HvFlowNodeClasses\n extends ExtractNames<typeof useClasses>,\n HvFlowBaseNodeClasses {}\n\nexport type HvFlowNodeDefaults = {\n title?: string;\n subTitle?: string;\n color?: string;\n icon?: React.ReactNode;\n};\n\nexport interface HvFlowNodeProps<T = any> extends HvFlowBaseNodeProps<T> {\n /** Node description */\n description?: string;\n /** Node actions */\n actions?: HvActionGeneric[]; // HvFlowNodeActions[];\n /** Node action callback */\n actionCallback?: HvActionsGenericProps[\"actionsCallback\"];\n /** Node maximum number of actions visible */\n maxVisibleActions?: number;\n /** Node expanded */\n expanded?: boolean;\n /** Node parameters */\n params?: HvFlowNodeParam[];\n /** A set of node default values for when there are no groups to fetch this data from. */\n nodeDefaults?: HvFlowNodeDefaults;\n /** Props to be passed to the expand parameters button. */\n expandParamsButtonProps?: HvButtonProps;\n /** Node outputs. */\n outputs?: HvFlowNodeOutput[];\n /** Node inputs. */\n inputs?: HvFlowNodeInput[];\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowNodeClasses;\n}\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowNode = ({\n id,\n type,\n headerItems,\n description,\n actions,\n outputs,\n inputs,\n actionCallback,\n maxVisibleActions = 1,\n expanded = false,\n params,\n nodeDefaults,\n classes: classesProp,\n children,\n expandParamsButtonProps,\n ...props\n}: HvFlowNodeProps<unknown>) => {\n const { classes } = useClasses(classesProp as HvFlowNodeClasses);\n\n const [showParams, setShowParams] = useState(expanded);\n\n const node = useFlowNode(id);\n\n const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n\n const subtitle = nodeTypes?.[type].meta?.label || nodeDefaults?.subTitle;\n const groupId = nodeTypes?.[type].meta?.groupId;\n\n const group = (groupId && nodeGroups && nodeGroups[groupId]) || undefined;\n const groupLabel = group?.label || nodeDefaults?.title;\n const icon = group?.icon || nodeDefaults?.icon;\n const color = group?.color || nodeDefaults?.color;\n\n const actsVisible = actions?.slice(0, maxVisibleActions);\n const actsDropdown = actions?.slice(maxVisibleActions);\n\n const hasParams = !!(params && params.length > 0);\n\n return (\n <HvFlowBaseNode\n id={id}\n type={type}\n title={groupLabel}\n icon={icon}\n color={color}\n inputs={inputs}\n outputs={outputs}\n nodeActions={defaultActions}\n classes={classesProp as HvFlowBaseNodeClasses}\n headerItems={\n <>\n {headerItems}\n {description && (\n <HvTooltip title={description}>\n <div>\n <Info color=\"base_dark\" />\n </div>\n </HvTooltip>\n )}\n {hasParams && (\n <HvButton\n icon\n overrideIconColors={false}\n onClick={() => setShowParams((p) => !p)}\n aria-label={showParams ? \"Collapse\" : \"Expand\"}\n {...expandParamsButtonProps}\n >\n {showParams ? (\n <Up role=\"none\" color=\"base_dark\" />\n ) : (\n <Down role=\"none\" color=\"base_dark\" />\n )}\n </HvButton>\n )}\n </>\n }\n {...props}\n >\n {(subtitle || actsVisible?.length || actsDropdown?.length) && (\n <div className={classes.subtitleContainer}>\n {subtitle && (\n <div>\n <HvTypography>{subtitle}</HvTypography>\n </div>\n )}\n <div className={classes.actions}>\n {actions?.length && actions?.length > 0 && (\n <>\n {actsVisible?.map((action) => (\n <HvTooltip key={action.id} title={action.label}>\n <HvButton\n icon\n onClick={(event) => {\n actionCallback?.(event, id, action);\n }}\n aria-label={action.label}\n >\n {renderedIcon(action.icon)}\n </HvButton>\n </HvTooltip>\n ))}\n\n {actsDropdown && actsDropdown.length > 0 && (\n <HvDropDownMenu\n keepOpened={false}\n dataList={actsDropdown?.map((action) => ({\n id: action.id,\n label: action.label,\n }))}\n onClick={(event, action) => {\n actionCallback?.(event, id, action as HvActionGeneric);\n }}\n />\n )}\n </>\n )}\n </div>\n </div>\n )}\n {children}\n {showParams && params && (\n <div className={classes.paramsContainer}>\n <ParamRenderer nodeId={id} params={params} data={node?.data} />\n </div>\n )}\n </HvFlowBaseNode>\n );\n};\n"],"names":["renderedIcon","actionIcon","isValidElement","HvFlowNode","id","type","headerItems","description","actions","outputs","inputs","actionCallback","maxVisibleActions","expanded","params","nodeDefaults","classes","classesProp","children","expandParamsButtonProps","props","useClasses","showParams","setShowParams","useState","node","useFlowNode","nodeGroups","nodeTypes","defaultActions","useFlowContext","subtitle","meta","label","subTitle","groupId","group","undefined","groupLabel","title","icon","color","actsVisible","slice","actsDropdown","hasParams","length","jsxs","HvFlowBaseNode","jsx","HvTooltip","Info","HvButton","p","Up","Down","subtitleContainer","HvTypography","map","action","event","HvDropDownMenu","paramsContainer","ParamRenderer","data"],"mappings":"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"}
1
+ {"version":3,"file":"Node.cjs","sources":["../../../../../src/components/Flow/Node/Node.tsx"],"sourcesContent":["import React, { isValidElement, useState } from \"react\";\n\nimport {\n ExtractNames,\n HvActionGeneric,\n HvActionsGenericProps,\n HvButton,\n HvButtonProps,\n HvDropDownMenu,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useFlowContext, useFlowNode } from \"../hooks\";\nimport { HvFlowNodeInput, HvFlowNodeOutput, HvFlowNodeParam } from \"../types\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\nimport {\n HvFlowBaseNode,\n HvFlowBaseNodeProps,\n HvFlowBaseNodeClasses,\n} from \"./BaseNode\";\n\nexport { staticClasses as flowNodeClasses };\n\nexport interface HvFlowNodeClasses\n extends ExtractNames<typeof useClasses>,\n HvFlowBaseNodeClasses {}\n\nexport type HvFlowNodeDefaults = {\n title?: string;\n subTitle?: string;\n color?: string;\n icon?: React.ReactNode;\n};\n\nexport interface HvFlowNodeProps<T = any> extends HvFlowBaseNodeProps<T> {\n /** Node description */\n description?: string;\n /** Node actions */\n actions?: HvActionGeneric[]; // HvFlowNodeActions[];\n /** Node action callback */\n actionCallback?: HvActionsGenericProps[\"actionsCallback\"];\n /** Node maximum number of actions visible */\n maxVisibleActions?: number;\n /** Node expanded */\n expanded?: boolean;\n /** Node parameters */\n params?: HvFlowNodeParam[];\n /** A set of node default values for when there are no groups to fetch this data from. */\n nodeDefaults?: HvFlowNodeDefaults;\n /** Props to be passed to the expand parameters button. */\n expandParamsButtonProps?: HvButtonProps;\n /** Node outputs. */\n outputs?: HvFlowNodeOutput[];\n /** Node inputs. */\n inputs?: HvFlowNodeInput[];\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowNodeClasses;\n}\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowNode = ({\n id,\n type,\n headerItems,\n description,\n actions,\n outputs,\n inputs,\n actionCallback,\n maxVisibleActions = 1,\n expanded = false,\n params,\n nodeDefaults,\n classes: classesProp,\n children,\n expandParamsButtonProps,\n ...props\n}: HvFlowNodeProps<unknown>) => {\n const { classes } = useClasses(classesProp as HvFlowNodeClasses);\n\n const [showParams, setShowParams] = useState(expanded);\n\n const node = useFlowNode(id);\n\n const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n\n const subtitle = nodeTypes?.[type].meta?.label || nodeDefaults?.subTitle;\n const groupId = nodeTypes?.[type].meta?.groupId;\n\n const group = (groupId && nodeGroups && nodeGroups[groupId]) || undefined;\n const groupLabel = group?.label || nodeDefaults?.title;\n const icon = group?.icon || nodeDefaults?.icon;\n const color = group?.color || nodeDefaults?.color;\n\n const actsVisible = actions?.slice(0, maxVisibleActions);\n const actsDropdown = actions?.slice(maxVisibleActions);\n\n const hasParams = !!(params && params.length > 0);\n\n return (\n <HvFlowBaseNode\n id={id}\n type={type}\n title={groupLabel}\n icon={icon}\n color={color}\n inputs={inputs}\n outputs={outputs}\n nodeActions={defaultActions}\n classes={classesProp as HvFlowBaseNodeClasses}\n headerItems={\n <>\n {headerItems}\n {description && (\n <HvTooltip title={description}>\n <div>\n <Info color=\"base_dark\" />\n </div>\n </HvTooltip>\n )}\n {hasParams && (\n <HvButton\n icon\n overrideIconColors={false}\n onClick={() => setShowParams((p) => !p)}\n aria-label={showParams ? \"Collapse\" : \"Expand\"}\n {...expandParamsButtonProps}\n >\n {showParams ? (\n <Up role=\"none\" color=\"base_dark\" />\n ) : (\n <Down role=\"none\" color=\"base_dark\" />\n )}\n </HvButton>\n )}\n </>\n }\n {...props}\n >\n {(subtitle || actsVisible?.length || actsDropdown?.length) && (\n <div className={classes.subtitleContainer}>\n {subtitle && (\n <div>\n <HvTypography>{subtitle}</HvTypography>\n </div>\n )}\n <div className={classes.actions}>\n {actions?.length && actions?.length > 0 && (\n <>\n {actsVisible?.map((action) => (\n <HvTooltip key={action.id} title={action.label}>\n <HvButton\n icon\n onClick={(event) => {\n actionCallback?.(event, id, action);\n }}\n aria-label={action.label}\n >\n {renderedIcon(action.icon)}\n </HvButton>\n </HvTooltip>\n ))}\n\n {actsDropdown && actsDropdown.length > 0 && (\n <HvDropDownMenu\n keepOpened={false}\n dataList={actsDropdown?.map((action) => ({\n id: action.id,\n label: action.label,\n }))}\n onClick={(event, action) => {\n actionCallback?.(event, id, action as HvActionGeneric);\n }}\n />\n )}\n </>\n )}\n </div>\n </div>\n )}\n {children}\n {showParams && params && (\n <div className={classes.paramsContainer}>\n <ParamRenderer nodeId={id} params={params} data={node?.data} />\n </div>\n )}\n </HvFlowBaseNode>\n );\n};\n"],"names":["isValidElement","useClasses","useState","useFlowNode","useFlowContext","jsxs","HvFlowBaseNode","Fragment","jsx","HvTooltip","Info","HvButton","Up","Down","HvTypography","HvDropDownMenu","ParamRenderer"],"mappings":"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"}
@@ -1,13 +1,15 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const uikitReactCore = require("@hitachivantara/uikit-react-core");
4
- const {
5
- staticClasses,
6
- useClasses
7
- } = uikitReactCore.createClasses("HvFlowNode", {
4
+ const { staticClasses, useClasses } = uikitReactCore.createClasses("HvFlowNode", {
8
5
  subtitleContainer: {
9
6
  minHeight: 48,
10
- padding: uikitReactCore.theme.spacing(uikitReactCore.theme.space.xs, uikitReactCore.theme.space.xs, uikitReactCore.theme.space.xs, uikitReactCore.theme.space.sm),
7
+ padding: uikitReactCore.theme.spacing(
8
+ uikitReactCore.theme.space.xs,
9
+ uikitReactCore.theme.space.xs,
10
+ uikitReactCore.theme.space.xs,
11
+ uikitReactCore.theme.space.sm
12
+ ),
11
13
  display: "flex",
12
14
  flexDirection: "row",
13
15
  justifyContent: "space-between",
@@ -1 +1 @@
1
- {"version":3,"file":"Node.styles.cjs","sources":["../../../../../src/components/Flow/Node/Node.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowNode\", {\n subtitleContainer: {\n minHeight: 48,\n padding: theme.spacing(\n theme.space.xs,\n theme.space.xs,\n theme.space.xs,\n theme.space.sm\n ),\n display: \"flex\",\n flexDirection: \"row\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n },\n actions: {\n display: \"flex\",\n alignItems: \"center\",\n },\n paramsContainer: {\n borderTop: `1px solid ${theme.colors.atmo4}`,\n display: \"flex\",\n flexDirection: \"column\",\n gap: theme.space.xs,\n padding: theme.space.sm,\n },\n});\n"],"names":["staticClasses","useClasses","createClasses","subtitleContainer","minHeight","padding","theme","spacing","space","xs","sm","display","flexDirection","justifyContent","alignItems","actions","paramsContainer","borderTop","colors","atmo4","gap"],"mappings":";;;AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,eAAAA,cAAc,cAAc;AAAA,EACvEC,mBAAmB;AAAA,IACjBC,WAAW;AAAA,IACXC,SAASC,eAAAA,MAAMC,QACbD,eAAAA,MAAME,MAAMC,IACZH,eAAAA,MAAME,MAAMC,IACZH,eAAME,MAAAA,MAAMC,IACZH,eAAAA,MAAME,MAAME,EACd;AAAA,IACAC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAC,SAAS;AAAA,IACPJ,SAAS;AAAA,IACTG,YAAY;AAAA,EACd;AAAA,EACAE,iBAAiB;AAAA,IACfC,WAAY,aAAYX,eAAMY,MAAAA,OAAOC,KAAM;AAAA,IAC3CR,SAAS;AAAA,IACTC,eAAe;AAAA,IACfQ,KAAKd,eAAAA,MAAME,MAAMC;AAAAA,IACjBJ,SAASC,eAAAA,MAAME,MAAME;AAAAA,EACvB;AACF,CAAC;;;"}
1
+ {"version":3,"file":"Node.styles.cjs","sources":["../../../../../src/components/Flow/Node/Node.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowNode\", {\n subtitleContainer: {\n minHeight: 48,\n padding: theme.spacing(\n theme.space.xs,\n theme.space.xs,\n theme.space.xs,\n theme.space.sm\n ),\n display: \"flex\",\n flexDirection: \"row\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n },\n actions: {\n display: \"flex\",\n alignItems: \"center\",\n },\n paramsContainer: {\n borderTop: `1px solid ${theme.colors.atmo4}`,\n display: \"flex\",\n flexDirection: \"column\",\n gap: theme.space.xs,\n padding: theme.space.sm,\n },\n});\n"],"names":["createClasses","theme"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,cAAc;AAAA,EACvE,mBAAmB;AAAA,IACjB,WAAW;AAAA,IACX,SAASC,eAAM,MAAA;AAAA,MACbA,qBAAM,MAAM;AAAA,MACZA,qBAAM,MAAM;AAAA,MACZA,qBAAM,MAAM;AAAA,MACZA,qBAAM,MAAM;AAAA,IACd;AAAA,IACA,SAAS;AAAA,IACT,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,YAAY;AAAA,EACd;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AAAA,EACA,iBAAiB;AAAA,IACf,WAAW,aAAaA,eAAM,MAAA,OAAO,KAAK;AAAA,IAC1C,SAAS;AAAA,IACT,eAAe;AAAA,IACf,KAAKA,eAAAA,MAAM,MAAM;AAAA,IACjB,SAASA,eAAAA,MAAM,MAAM;AAAA,EACvB;AACF,CAAC;;;"}
@@ -7,11 +7,7 @@ const renderers = {
7
7
  text: Text.default,
8
8
  select: Select.default
9
9
  };
10
- const ParamRenderer = ({
11
- nodeId,
12
- params,
13
- data
14
- }) => {
10
+ const ParamRenderer = ({ nodeId, params, data }) => {
15
11
  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: params.map((param, idx) => {
16
12
  const Renderer = renderers[param.type];
17
13
  if (!Renderer)