@hitachivantara/uikit-react-lab 5.19.0 → 5.19.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 (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
@@ -1 +1 @@
1
- {"version":3,"file":"Empty.js","sources":["../../../../../src/components/Flow/Empty/Empty.tsx"],"sourcesContent":["import { useNodes } from \"reactflow\";\nimport {\n HvEmptyState,\n HvEmptyStateProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./Empty.styles\";\n\nexport interface HvFlowEmptyProps extends HvEmptyStateProps {}\n\nexport const HvFlowEmpty = ({ className, ...others }: HvFlowEmptyProps) => {\n const { classes, cx } = useClasses();\n const nodes = useNodes();\n return (\n !nodes ||\n (nodes.length === 0 ? (\n <HvEmptyState className={cx(classes.root, className)} {...others} />\n ) : null)\n );\n};\n"],"names":["HvFlowEmpty","className","others","classes","cx","useClasses","nodes","useNodes","length","root"],"mappings":";;;;AAUO,MAAMA,cAAcA,CAAC;AAAA,EAAEC;AAAAA,EAAW,GAAGC;AAAyB,MAAM;AACnE,QAAA;AAAA,IAAEC;AAAAA,IAASC;AAAAA,MAAOC,WAAW;AACnC,QAAMC,QAAQC;AACd,SACE,CAACD,UACAA,MAAME,WAAW,IACf,oBAAA,cAAA,EAAa,WAAWJ,GAAGD,QAAQM,MAAMR,SAAS,GAAG,GAAIC,OAAU,CAAA,IAClE;AAER;"}
1
+ {"version":3,"file":"Empty.js","sources":["../../../../../src/components/Flow/Empty/Empty.tsx"],"sourcesContent":["import { useNodes } from \"reactflow\";\nimport {\n HvEmptyState,\n HvEmptyStateProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./Empty.styles\";\n\nexport interface HvFlowEmptyProps extends HvEmptyStateProps {}\n\nexport const HvFlowEmpty = ({ className, ...others }: HvFlowEmptyProps) => {\n const { classes, cx } = useClasses();\n const nodes = useNodes();\n return (\n !nodes ||\n (nodes.length === 0 ? (\n <HvEmptyState className={cx(classes.root, className)} {...others} />\n ) : null)\n );\n};\n"],"names":[],"mappings":";;;;AAUO,MAAM,cAAc,CAAC,EAAE,WAAW,GAAG,aAA+B;AACzE,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW;AACnC,QAAM,QAAQ;AACd,SACE,CAAC,UACA,MAAM,WAAW,IACf,oBAAA,cAAA,EAAa,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,OAAQ,CAAA,IAChE;AAER;"}
@@ -1,8 +1,5 @@
1
1
  import { createClasses, theme } from "@hitachivantara/uikit-react-core";
2
- const {
3
- staticClasses,
4
- useClasses
5
- } = createClasses("HvFlowEmpty", {
2
+ const { staticClasses, useClasses } = createClasses("HvFlowEmpty", {
6
3
  root: {
7
4
  width: "100%",
8
5
  height: "100%",
@@ -1 +1 @@
1
- {"version":3,"file":"Empty.styles.js","sources":["../../../../../src/components/Flow/Empty/Empty.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowEmpty\", {\n root: {\n width: \"100%\",\n height: \"100%\",\n alignItems: \"center\",\n justifyContent: \"center\",\n backgroundColor: theme.colors.backgroundColor,\n position: \"absolute\",\n zIndex: theme.zIndices.popover,\n },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","width","height","alignItems","justifyContent","backgroundColor","theme","colors","position","zIndex","zIndices","popover"],"mappings":";AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,eAAe;AAAA,EACxEC,MAAM;AAAA,IACJC,OAAO;AAAA,IACPC,QAAQ;AAAA,IACRC,YAAY;AAAA,IACZC,gBAAgB;AAAA,IAChBC,iBAAiBC,MAAMC,OAAOF;AAAAA,IAC9BG,UAAU;AAAA,IACVC,QAAQH,MAAMI,SAASC;AAAAA,EACzB;AACF,CAAC;"}
1
+ {"version":3,"file":"Empty.styles.js","sources":["../../../../../src/components/Flow/Empty/Empty.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowEmpty\", {\n root: {\n width: \"100%\",\n height: \"100%\",\n alignItems: \"center\",\n justifyContent: \"center\",\n backgroundColor: theme.colors.backgroundColor,\n position: \"absolute\",\n zIndex: theme.zIndices.popover,\n },\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,eAAe;AAAA,EACxE,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,iBAAiB,MAAM,OAAO;AAAA,IAC9B,UAAU;AAAA,IACV,QAAQ,MAAM,SAAS;AAAA,EACzB;AACF,CAAC;"}
@@ -12,11 +12,30 @@ const HvFlow = ({
12
12
  dndContextProps,
13
13
  ...others
14
14
  }) => {
15
- const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor));
16
- return /* @__PURE__ */ jsx(ReactFlowProvider, { children: /* @__PURE__ */ jsx(HvFlowProvider, { nodeGroups, nodeTypes, defaultActions, children: /* @__PURE__ */ jsxs(DndContext, { sensors, modifiers: [restrictToWindowEdges], ...dndContextProps, children: [
17
- /* @__PURE__ */ jsx(HvDroppableFlow, { ...others }),
18
- sidebar
19
- ] }) }) });
15
+ const sensors = useSensors(
16
+ useSensor(PointerSensor),
17
+ useSensor(KeyboardSensor)
18
+ );
19
+ return /* @__PURE__ */ jsx(ReactFlowProvider, { children: /* @__PURE__ */ jsx(
20
+ HvFlowProvider,
21
+ {
22
+ nodeGroups,
23
+ nodeTypes,
24
+ defaultActions,
25
+ children: /* @__PURE__ */ jsxs(
26
+ DndContext,
27
+ {
28
+ sensors,
29
+ modifiers: [restrictToWindowEdges],
30
+ ...dndContextProps,
31
+ children: [
32
+ /* @__PURE__ */ jsx(HvDroppableFlow, { ...others }),
33
+ sidebar
34
+ ]
35
+ }
36
+ )
37
+ }
38
+ ) });
20
39
  };
21
40
  export {
22
41
  HvFlow
@@ -1 +1 @@
1
- {"version":3,"file":"Flow.js","sources":["../../../../src/components/Flow/Flow.tsx"],"sourcesContent":["import {\n DndContext,\n DndContextProps,\n KeyboardSensor,\n PointerSensor,\n useSensor,\n useSensors,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\n\nimport { ReactFlowProvider } from \"reactflow\";\n\nimport { HvFlowNodeAction, HvFlowNodeGroups, HvFlowNodeTypes } from \"./types\";\nimport { HvFlowProvider } from \"./FlowContext\";\nimport { HvDroppableFlow, HvDroppableFlowProps } from \"./DroppableFlow\";\n\nexport interface HvFlowProps<\n NodeGroups extends keyof any = string,\n NodeType extends string | undefined = string | undefined,\n NodeData = any\n> extends HvDroppableFlowProps<NodeType, NodeData> {\n /** Flow nodes groups. */\n nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n /** Flow nodes types. */\n nodeTypes?: HvFlowNodeTypes<NodeGroups, NodeData>;\n /** Flow sidebar. */\n sidebar?: React.ReactNode;\n /** Flow default actions. */\n defaultActions?: HvFlowNodeAction[];\n /**\n * Dnd Kit context props. This should be used for accessibility purposes.\n *\n * More information can be found on the [Dnd Kit documentation](https://docs.dndkit.com/guides/accessibility)\n */\n dndContextProps?: Pick<DndContextProps, \"accessibility\">;\n}\n\n/**\n * Flow component to build interactive node-based UIs.\n *\n * This implementation leverages [React Flow](https://reactflow.dev).\n * The drag and drop functionality leverages [Dnd Kit](https://docs.dndkit.com)\n *\n * DISCLAIMER: This component is a work in progress and there might be breaking changes.\n */\nexport const HvFlow = ({\n nodeTypes,\n nodeGroups,\n sidebar,\n defaultActions,\n dndContextProps,\n ...others\n}: HvFlowProps) => {\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor)\n );\n\n // We're wrapping the main Flow component with the ReactFlowProvider to access the react flow instance.\n // HvFlowContext is our custom internal context.\n return (\n <ReactFlowProvider>\n <HvFlowProvider\n nodeGroups={nodeGroups}\n nodeTypes={nodeTypes}\n defaultActions={defaultActions}\n >\n <DndContext\n sensors={sensors}\n modifiers={[restrictToWindowEdges]}\n {...dndContextProps}\n >\n <HvDroppableFlow {...others} />\n {sidebar}\n </DndContext>\n </HvFlowProvider>\n </ReactFlowProvider>\n );\n};\n"],"names":["HvFlow","nodeTypes","nodeGroups","sidebar","defaultActions","dndContextProps","others","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","restrictToWindowEdges"],"mappings":";;;;;;AA6CO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACQ,MAAM;AACjB,QAAMC,UAAUC,WACdC,UAAUC,aAAa,GACvBD,UAAUE,cAAc,CAC1B;AAIA,SACG,oBAAA,mBAAA,EACC,UAAC,oBAAA,gBAAA,EACC,YACA,WACA,gBAEA,UAAC,qBAAA,YAAA,EACC,SACA,WAAW,CAACC,qBAAqB,GACjC,GAAIP,iBAEJ,UAAA;AAAA,IAAC,oBAAA,iBAAA,EAAgB,GAAIC,QAAO;AAAA,IAC3BH;AAAAA,EAAAA,GACH,GACF,EACF,CAAA;AAEJ;"}
1
+ {"version":3,"file":"Flow.js","sources":["../../../../src/components/Flow/Flow.tsx"],"sourcesContent":["import {\n DndContext,\n DndContextProps,\n KeyboardSensor,\n PointerSensor,\n useSensor,\n useSensors,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\n\nimport { ReactFlowProvider } from \"reactflow\";\n\nimport { HvFlowNodeAction, HvFlowNodeGroups, HvFlowNodeTypes } from \"./types\";\nimport { HvFlowProvider } from \"./FlowContext\";\nimport { HvDroppableFlow, HvDroppableFlowProps } from \"./DroppableFlow\";\n\nexport interface HvFlowProps<\n NodeGroups extends keyof any = string,\n NodeType extends string | undefined = string | undefined,\n NodeData = any\n> extends HvDroppableFlowProps<NodeType, NodeData> {\n /** Flow nodes groups. */\n nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n /** Flow nodes types. */\n nodeTypes?: HvFlowNodeTypes<NodeGroups, NodeData>;\n /** Flow sidebar. */\n sidebar?: React.ReactNode;\n /** Flow default actions. */\n defaultActions?: HvFlowNodeAction[];\n /**\n * Dnd Kit context props. This should be used for accessibility purposes.\n *\n * More information can be found on the [Dnd Kit documentation](https://docs.dndkit.com/guides/accessibility)\n */\n dndContextProps?: Pick<DndContextProps, \"accessibility\">;\n}\n\n/**\n * Flow component to build interactive node-based UIs.\n *\n * This implementation leverages [React Flow](https://reactflow.dev).\n * The drag and drop functionality leverages [Dnd Kit](https://docs.dndkit.com)\n *\n * DISCLAIMER: This component is a work in progress and there might be breaking changes.\n */\nexport const HvFlow = ({\n nodeTypes,\n nodeGroups,\n sidebar,\n defaultActions,\n dndContextProps,\n ...others\n}: HvFlowProps) => {\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor)\n );\n\n // We're wrapping the main Flow component with the ReactFlowProvider to access the react flow instance.\n // HvFlowContext is our custom internal context.\n return (\n <ReactFlowProvider>\n <HvFlowProvider\n nodeGroups={nodeGroups}\n nodeTypes={nodeTypes}\n defaultActions={defaultActions}\n >\n <DndContext\n sensors={sensors}\n modifiers={[restrictToWindowEdges]}\n {...dndContextProps}\n >\n <HvDroppableFlow {...others} />\n {sidebar}\n </DndContext>\n </HvFlowProvider>\n </ReactFlowProvider>\n );\n};\n"],"names":[],"mappings":";;;;;;AA6CO,MAAM,SAAS,CAAC;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAmB;AACjB,QAAM,UAAU;AAAA,IACd,UAAU,aAAa;AAAA,IACvB,UAAU,cAAc;AAAA,EAAA;AAK1B,6BACG,mBACC,EAAA,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MAEA,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA,WAAW,CAAC,qBAAqB;AAAA,UAChC,GAAG;AAAA,UAEJ,UAAA;AAAA,YAAC,oBAAA,iBAAA,EAAiB,GAAG,QAAQ;AAAA,YAC5B;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}
@@ -6,10 +6,7 @@ import "reactflow";
6
6
  import "uid";
7
7
  import "@hitachivantara/uikit-react-icons";
8
8
  import "@hitachivantara/uikit-styles";
9
- const {
10
- staticClasses,
11
- useClasses
12
- } = createClasses("HvFlow", {
9
+ const { staticClasses, useClasses } = createClasses("HvFlow", {
13
10
  root: {
14
11
  height: "100%",
15
12
  "& .react-flow__handle": {
@@ -1 +1 @@
1
- {"version":3,"file":"Flow.styles.js","sources":["../../../../src/components/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nimport { flowBaseNodeClasses } from \"./Node\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlow\", {\n root: {\n height: \"100%\",\n \"& .react-flow__handle\": {\n backgroundColor: theme.colors.secondary_60,\n width: 8,\n height: 8,\n zIndex: theme.zIndices.overlay,\n },\n \"& .react-flow__handle-connecting\": {\n backgroundColor: theme.colors.negative_20,\n width: 12,\n height: 12,\n \"&.react-flow__handle-left\": {\n translate: \"0 4px\",\n },\n },\n \"& .react-flow__handle-valid\": {\n backgroundColor: theme.colors.positive_20,\n width: 12,\n height: 12,\n \"&.react-flow__handle-left\": {\n translate: \"0 4px\",\n },\n },\n [`& .selected > .${flowBaseNodeClasses.root}`]: {\n border: `1px solid ${theme.colors.secondary_60}`,\n borderRadius: theme.radii.round,\n boxSizing: \"border-box\",\n },\n },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","height","backgroundColor","theme","colors","secondary_60","width","zIndex","zIndices","overlay","negative_20","translate","positive_20","flowBaseNodeClasses","border","borderRadius","radii","round","boxSizing"],"mappings":";;;;;;;;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,UAAU;AAAA,EACnEC,MAAM;AAAA,IACJC,QAAQ;AAAA,IACR,yBAAyB;AAAA,MACvBC,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9BC,OAAO;AAAA,MACPL,QAAQ;AAAA,MACRM,QAAQJ,MAAMK,SAASC;AAAAA,IACzB;AAAA,IACA,oCAAoC;AAAA,MAClCP,iBAAiBC,MAAMC,OAAOM;AAAAA,MAC9BJ,OAAO;AAAA,MACPL,QAAQ;AAAA,MACR,6BAA6B;AAAA,QAC3BU,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,+BAA+B;AAAA,MAC7BT,iBAAiBC,MAAMC,OAAOQ;AAAAA,MAC9BN,OAAO;AAAA,MACPL,QAAQ;AAAA,MACR,6BAA6B;AAAA,QAC3BU,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,CAAE,kBAAiBE,gBAAoBb,IAAK,EAAC,GAAG;AAAA,MAC9Cc,QAAS,aAAYX,MAAMC,OAAOC,YAAa;AAAA,MAC/CU,cAAcZ,MAAMa,MAAMC;AAAAA,MAC1BC,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;"}
1
+ {"version":3,"file":"Flow.styles.js","sources":["../../../../src/components/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nimport { flowBaseNodeClasses } from \"./Node\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlow\", {\n root: {\n height: \"100%\",\n \"& .react-flow__handle\": {\n backgroundColor: theme.colors.secondary_60,\n width: 8,\n height: 8,\n zIndex: theme.zIndices.overlay,\n },\n \"& .react-flow__handle-connecting\": {\n backgroundColor: theme.colors.negative_20,\n width: 12,\n height: 12,\n \"&.react-flow__handle-left\": {\n translate: \"0 4px\",\n },\n },\n \"& .react-flow__handle-valid\": {\n backgroundColor: theme.colors.positive_20,\n width: 12,\n height: 12,\n \"&.react-flow__handle-left\": {\n translate: \"0 4px\",\n },\n },\n [`& .selected > .${flowBaseNodeClasses.root}`]: {\n border: `1px solid ${theme.colors.secondary_60}`,\n borderRadius: theme.radii.round,\n boxSizing: \"border-box\",\n },\n },\n});\n"],"names":["flowBaseNodeClasses"],"mappings":";;;;;;;;AAIO,MAAM,EAAE,eAAe,eAAe,cAAc,UAAU;AAAA,EACnE,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,yBAAyB;AAAA,MACvB,iBAAiB,MAAM,OAAO;AAAA,MAC9B,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,QAAQ,MAAM,SAAS;AAAA,IACzB;AAAA,IACA,oCAAoC;AAAA,MAClC,iBAAiB,MAAM,OAAO;AAAA,MAC9B,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,6BAA6B;AAAA,QAC3B,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,+BAA+B;AAAA,MAC7B,iBAAiB,MAAM,OAAO;AAAA,MAC9B,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,6BAA6B;AAAA,QAC3B,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,CAAC,kBAAkBA,gBAAoB,IAAI,EAAE,GAAG;AAAA,MAC9C,QAAQ,aAAa,MAAM,OAAO,YAAY;AAAA,MAC9C,cAAc,MAAM,MAAM;AAAA,MAC1B,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;"}
@@ -9,13 +9,16 @@ const HvFlowProvider = ({
9
9
  children
10
10
  }) => {
11
11
  const [expandedNodeGroups, setExpandedNodeGroups] = useState([]);
12
- const value = useMemo(() => ({
13
- nodeTypes,
14
- nodeGroups,
15
- defaultActions,
16
- expandedNodeGroups,
17
- setExpandedNodeGroups
18
- }), [nodeTypes, nodeGroups, defaultActions, expandedNodeGroups]);
12
+ const value = useMemo(
13
+ () => ({
14
+ nodeTypes,
15
+ nodeGroups,
16
+ defaultActions,
17
+ expandedNodeGroups,
18
+ setExpandedNodeGroups
19
+ }),
20
+ [nodeTypes, nodeGroups, defaultActions, expandedNodeGroups]
21
+ );
19
22
  return /* @__PURE__ */ jsx(HvFlowNodeMetaProvider, { children: /* @__PURE__ */ jsx(HvFlowContext.Provider, { value, children }) });
20
23
  };
21
24
  export {
@@ -1 +1 @@
1
- {"version":3,"file":"FlowContext.js","sources":["../../../../../src/components/Flow/FlowContext/FlowContext.tsx"],"sourcesContent":["import {\n Dispatch,\n SetStateAction,\n createContext,\n useMemo,\n useState,\n} from \"react\";\n\nimport { HvFlowNodeAction, HvFlowNodeGroups, HvFlowNodeTypes } from \"../types\";\nimport { HvFlowNodeMetaProvider } from \"./NodeMetaContext\";\n\nexport interface HvFlowContextValue<NodeGroups extends keyof any = string> {\n /** Flow nodes types. */\n nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n /** Flow nodes groups. */\n nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n /** Flow nodes groups expanded on sidebar. */\n expandedNodeGroups?: string[];\n /** Flow default actions. */\n defaultActions?: HvFlowNodeAction[];\n /** Function to set `expandedNodeGroups`. */\n setExpandedNodeGroups?: Dispatch<SetStateAction<string[]>>;\n}\n\nexport const HvFlowContext = createContext<HvFlowContextValue>({});\n\nexport interface HvFlowProviderProps<NodeGroups extends keyof any = string> {\n /** Flow nodes types. */\n nodeTypes?: HvFlowContextValue<NodeGroups>[\"nodeTypes\"];\n /** Flow nodes groups. */\n nodeGroups?: HvFlowContextValue<NodeGroups>[\"nodeGroups\"];\n /** Flow default actions. */\n defaultActions?: HvFlowNodeAction[];\n /** Children. */\n children?: React.ReactNode;\n}\n\nexport const HvFlowProvider = ({\n nodeGroups,\n nodeTypes,\n defaultActions,\n children,\n}: HvFlowProviderProps) => {\n const [expandedNodeGroups, setExpandedNodeGroups] = useState<string[]>([]);\n\n const value = useMemo(\n () => ({\n nodeTypes,\n nodeGroups,\n defaultActions,\n expandedNodeGroups,\n setExpandedNodeGroups,\n }),\n [nodeTypes, nodeGroups, defaultActions, expandedNodeGroups]\n );\n\n return (\n <HvFlowNodeMetaProvider>\n <HvFlowContext.Provider value={value}>{children}</HvFlowContext.Provider>\n </HvFlowNodeMetaProvider>\n );\n};\n"],"names":["HvFlowContext","createContext","HvFlowProvider","nodeGroups","nodeTypes","defaultActions","children","expandedNodeGroups","setExpandedNodeGroups","useState","value","useMemo"],"mappings":";;;AAwBaA,MAAAA,gBAAgBC,cAAkC,EAAE;AAa1D,MAAMC,iBAAiBA,CAAC;AAAA,EAC7BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AACmB,MAAM;AACzB,QAAM,CAACC,oBAAoBC,qBAAqB,IAAIC,SAAmB,CAAE,CAAA;AAEnEC,QAAAA,QAAQC,QACZ,OAAO;AAAA,IACLP;AAAAA,IACAD;AAAAA,IACAE;AAAAA,IACAE;AAAAA,IACAC;AAAAA,EAAAA,IAEF,CAACJ,WAAWD,YAAYE,gBAAgBE,kBAAkB,CAC5D;AAGE,SAAA,oBAAC,0BACC,UAAC,oBAAA,cAAc,UAAd,EAAuB,OAAeD,SAAS,CAAA,EAClD,CAAA;AAEJ;"}
1
+ {"version":3,"file":"FlowContext.js","sources":["../../../../../src/components/Flow/FlowContext/FlowContext.tsx"],"sourcesContent":["import {\n Dispatch,\n SetStateAction,\n createContext,\n useMemo,\n useState,\n} from \"react\";\n\nimport { HvFlowNodeAction, HvFlowNodeGroups, HvFlowNodeTypes } from \"../types\";\nimport { HvFlowNodeMetaProvider } from \"./NodeMetaContext\";\n\nexport interface HvFlowContextValue<NodeGroups extends keyof any = string> {\n /** Flow nodes types. */\n nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n /** Flow nodes groups. */\n nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n /** Flow nodes groups expanded on sidebar. */\n expandedNodeGroups?: string[];\n /** Flow default actions. */\n defaultActions?: HvFlowNodeAction[];\n /** Function to set `expandedNodeGroups`. */\n setExpandedNodeGroups?: Dispatch<SetStateAction<string[]>>;\n}\n\nexport const HvFlowContext = createContext<HvFlowContextValue>({});\n\nexport interface HvFlowProviderProps<NodeGroups extends keyof any = string> {\n /** Flow nodes types. */\n nodeTypes?: HvFlowContextValue<NodeGroups>[\"nodeTypes\"];\n /** Flow nodes groups. */\n nodeGroups?: HvFlowContextValue<NodeGroups>[\"nodeGroups\"];\n /** Flow default actions. */\n defaultActions?: HvFlowNodeAction[];\n /** Children. */\n children?: React.ReactNode;\n}\n\nexport const HvFlowProvider = ({\n nodeGroups,\n nodeTypes,\n defaultActions,\n children,\n}: HvFlowProviderProps) => {\n const [expandedNodeGroups, setExpandedNodeGroups] = useState<string[]>([]);\n\n const value = useMemo(\n () => ({\n nodeTypes,\n nodeGroups,\n defaultActions,\n expandedNodeGroups,\n setExpandedNodeGroups,\n }),\n [nodeTypes, nodeGroups, defaultActions, expandedNodeGroups]\n );\n\n return (\n <HvFlowNodeMetaProvider>\n <HvFlowContext.Provider value={value}>{children}</HvFlowContext.Provider>\n </HvFlowNodeMetaProvider>\n );\n};\n"],"names":[],"mappings":";;;AAwBa,MAAA,gBAAgB,cAAkC,EAAE;AAa1D,MAAM,iBAAiB,CAAC;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA2B;AACzB,QAAM,CAAC,oBAAoB,qBAAqB,IAAI,SAAmB,CAAE,CAAA;AAEzE,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF,CAAC,WAAW,YAAY,gBAAgB,kBAAkB;AAAA,EAAA;AAI1D,SAAA,oBAAC,0BACC,UAAC,oBAAA,cAAc,UAAd,EAAuB,OAAe,SAAS,CAAA,EAClD,CAAA;AAEJ;"}
@@ -14,17 +14,22 @@ const HvFlowNodeMetaProvider = ({
14
14
  const getRegistry = useCallback(() => {
15
15
  return registryRef.current;
16
16
  }, []);
17
- const value = useMemo(() => ({
18
- registerNode,
19
- unregisterNode,
20
- getRegistry
21
- }), [registerNode, unregisterNode, getRegistry]);
17
+ const value = useMemo(
18
+ () => ({
19
+ registerNode,
20
+ unregisterNode,
21
+ getRegistry
22
+ }),
23
+ [registerNode, unregisterNode, getRegistry]
24
+ );
22
25
  return /* @__PURE__ */ jsx(HvFlowNodeMetaContext.Provider, { value, children });
23
26
  };
24
27
  function useNodeMetaRegistry() {
25
28
  const context = useContext(HvFlowNodeMetaContext);
26
29
  if (context === void 0) {
27
- throw new Error("useNodeRegistry must be used within a HvFlowNodeMetaProvider");
30
+ throw new Error(
31
+ "useNodeRegistry must be used within a HvFlowNodeMetaProvider"
32
+ );
28
33
  }
29
34
  return {
30
35
  registerNode: context.registerNode,
@@ -1 +1 @@
1
- {"version":3,"file":"NodeMetaContext.js","sources":["../../../../../src/components/Flow/FlowContext/NodeMetaContext.tsx"],"sourcesContent":["import { createContext, useRef, useCallback, useContext, useMemo } from \"react\";\n\nimport { HvFlowNodeMeta } from \"../types\";\n\ninterface HvFlowNodeMetaContextType {\n registerNode: (id: string, nodeInfo: HvFlowNodeMeta) => void;\n unregisterNode: (id: string) => void;\n getRegistry: () => Record<string, HvFlowNodeMeta>;\n}\n\nconst HvFlowNodeMetaContext = createContext<\n HvFlowNodeMetaContextType | undefined\n>(undefined);\n\nexport const HvFlowNodeMetaProvider = ({\n children,\n}: {\n children: React.ReactNode;\n}) => {\n const registryRef = useRef<Record<string, HvFlowNodeMeta>>({});\n\n const registerNode = useCallback((id: string, nodeInfo: HvFlowNodeMeta) => {\n registryRef.current[id] = nodeInfo;\n }, []);\n\n const unregisterNode = useCallback((id: string) => {\n delete registryRef.current[id];\n }, []);\n\n const getRegistry = useCallback(() => {\n return registryRef.current;\n }, []);\n\n const value = useMemo<HvFlowNodeMetaContextType>(\n () => ({\n registerNode,\n unregisterNode,\n getRegistry,\n }),\n [registerNode, unregisterNode, getRegistry]\n );\n\n return (\n <HvFlowNodeMetaContext.Provider value={value}>\n {children}\n </HvFlowNodeMetaContext.Provider>\n );\n};\n\nexport function useNodeMetaRegistry() {\n const context = useContext(HvFlowNodeMetaContext);\n\n if (context === undefined) {\n throw new Error(\n \"useNodeRegistry must be used within a HvFlowNodeMetaProvider\"\n );\n }\n\n return {\n registerNode: context.registerNode,\n unregisterNode: context.unregisterNode,\n registry: context.getRegistry(),\n };\n}\n"],"names":["HvFlowNodeMetaContext","createContext","undefined","HvFlowNodeMetaProvider","children","registryRef","useRef","registerNode","useCallback","id","nodeInfo","current","unregisterNode","getRegistry","value","useMemo","useNodeMetaRegistry","context","useContext","Error","registry"],"mappings":";;AAUA,MAAMA,wBAAwBC,cAE5BC,MAAS;AAEJ,MAAMC,yBAAyBA,CAAC;AAAA,EACrCC;AAGF,MAAM;AACEC,QAAAA,cAAcC,OAAuC,CAAA,CAAE;AAE7D,QAAMC,eAAeC,YAAY,CAACC,IAAYC,aAA6B;AAC7DC,gBAAAA,QAAQF,EAAE,IAAIC;AAAAA,EAC5B,GAAG,CAAE,CAAA;AAECE,QAAAA,iBAAiBJ,YAAY,CAACC,OAAe;AAC1CJ,WAAAA,YAAYM,QAAQF,EAAE;AAAA,EAC/B,GAAG,CAAE,CAAA;AAECI,QAAAA,cAAcL,YAAY,MAAM;AACpC,WAAOH,YAAYM;AAAAA,EACrB,GAAG,CAAE,CAAA;AAECG,QAAAA,QAAQC,QACZ,OAAO;AAAA,IACLR;AAAAA,IACAK;AAAAA,IACAC;AAAAA,EAEF,IAAA,CAACN,cAAcK,gBAAgBC,WAAW,CAC5C;AAEA,SACG,oBAAA,sBAAsB,UAAtB,EAA+B,OAC7BT,SACH,CAAA;AAEJ;AAEO,SAASY,sBAAsB;AAC9BC,QAAAA,UAAUC,WAAWlB,qBAAqB;AAEhD,MAAIiB,YAAYf,QAAW;AACnB,UAAA,IAAIiB,MACR,8DACF;AAAA,EACF;AAEO,SAAA;AAAA,IACLZ,cAAcU,QAAQV;AAAAA,IACtBK,gBAAgBK,QAAQL;AAAAA,IACxBQ,UAAUH,QAAQJ,YAAY;AAAA,EAAA;AAElC;"}
1
+ {"version":3,"file":"NodeMetaContext.js","sources":["../../../../../src/components/Flow/FlowContext/NodeMetaContext.tsx"],"sourcesContent":["import { createContext, useRef, useCallback, useContext, useMemo } from \"react\";\n\nimport { HvFlowNodeMeta } from \"../types\";\n\ninterface HvFlowNodeMetaContextType {\n registerNode: (id: string, nodeInfo: HvFlowNodeMeta) => void;\n unregisterNode: (id: string) => void;\n getRegistry: () => Record<string, HvFlowNodeMeta>;\n}\n\nconst HvFlowNodeMetaContext = createContext<\n HvFlowNodeMetaContextType | undefined\n>(undefined);\n\nexport const HvFlowNodeMetaProvider = ({\n children,\n}: {\n children: React.ReactNode;\n}) => {\n const registryRef = useRef<Record<string, HvFlowNodeMeta>>({});\n\n const registerNode = useCallback((id: string, nodeInfo: HvFlowNodeMeta) => {\n registryRef.current[id] = nodeInfo;\n }, []);\n\n const unregisterNode = useCallback((id: string) => {\n delete registryRef.current[id];\n }, []);\n\n const getRegistry = useCallback(() => {\n return registryRef.current;\n }, []);\n\n const value = useMemo<HvFlowNodeMetaContextType>(\n () => ({\n registerNode,\n unregisterNode,\n getRegistry,\n }),\n [registerNode, unregisterNode, getRegistry]\n );\n\n return (\n <HvFlowNodeMetaContext.Provider value={value}>\n {children}\n </HvFlowNodeMetaContext.Provider>\n );\n};\n\nexport function useNodeMetaRegistry() {\n const context = useContext(HvFlowNodeMetaContext);\n\n if (context === undefined) {\n throw new Error(\n \"useNodeRegistry must be used within a HvFlowNodeMetaProvider\"\n );\n }\n\n return {\n registerNode: context.registerNode,\n unregisterNode: context.unregisterNode,\n registry: context.getRegistry(),\n };\n}\n"],"names":[],"mappings":";;AAUA,MAAM,wBAAwB,cAE5B,MAAS;AAEJ,MAAM,yBAAyB,CAAC;AAAA,EACrC;AACF,MAEM;AACE,QAAA,cAAc,OAAuC,CAAA,CAAE;AAE7D,QAAM,eAAe,YAAY,CAAC,IAAY,aAA6B;AAC7D,gBAAA,QAAQ,EAAE,IAAI;AAAA,EAC5B,GAAG,CAAE,CAAA;AAEC,QAAA,iBAAiB,YAAY,CAAC,OAAe;AAC1C,WAAA,YAAY,QAAQ,EAAE;AAAA,EAC/B,GAAG,CAAE,CAAA;AAEC,QAAA,cAAc,YAAY,MAAM;AACpC,WAAO,YAAY;AAAA,EACrB,GAAG,CAAE,CAAA;AAEL,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF,CAAC,cAAc,gBAAgB,WAAW;AAAA,EAAA;AAG5C,SACG,oBAAA,sBAAsB,UAAtB,EAA+B,OAC7B,SACH,CAAA;AAEJ;AAEO,SAAS,sBAAsB;AAC9B,QAAA,UAAU,WAAW,qBAAqB;AAEhD,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI;AAAA,MACR;AAAA,IAAA;AAAA,EAEJ;AAEO,SAAA;AAAA,IACL,cAAc,QAAQ;AAAA,IACtB,gBAAgB,QAAQ;AAAA,IACxB,UAAU,QAAQ,YAAY;AAAA,EAAA;AAElC;"}
@@ -12,11 +12,18 @@ const HvFlowMinimap = ({
12
12
  className,
13
13
  ...others
14
14
  }) => {
15
- const {
16
- classes,
17
- cx
18
- } = useClasses(classesProp);
19
- return /* @__PURE__ */ jsx(MiniMap, { className: cx(classes.root, className), nodeColor: typeof nodeColor === "string" ? getColor(nodeColor, "atmo4") : nodeColor, nodeStrokeColor: typeof nodeStrokeColor === "string" ? getColor(nodeStrokeColor, "atmo4") : nodeStrokeColor, maskColor: getColor(maskColor, "atmo3"), maskStrokeColor: getColor(maskStrokeColor, "atmo3"), ...others });
15
+ const { classes, cx } = useClasses(classesProp);
16
+ return /* @__PURE__ */ jsx(
17
+ MiniMap,
18
+ {
19
+ className: cx(classes.root, className),
20
+ nodeColor: typeof nodeColor === "string" ? getColor(nodeColor, "atmo4") : nodeColor,
21
+ nodeStrokeColor: typeof nodeStrokeColor === "string" ? getColor(nodeStrokeColor, "atmo4") : nodeStrokeColor,
22
+ maskColor: getColor(maskColor, "atmo3"),
23
+ maskStrokeColor: getColor(maskStrokeColor, "atmo3"),
24
+ ...others
25
+ }
26
+ );
20
27
  };
21
28
  export {
22
29
  HvFlowMinimap,
@@ -1 +1 @@
1
- {"version":3,"file":"Minimap.js","sources":["../../../../../src/components/Flow/Minimap/Minimap.tsx"],"sourcesContent":["import { GetMiniMapNodeAttribute, MiniMap, MiniMapProps } from \"reactflow\";\n\nimport { ExtractNames } from \"@hitachivantara/uikit-react-core\";\nimport { HvColorAny, getColor } from \"@hitachivantara/uikit-styles\";\n\nimport { staticClasses, useClasses } from \"./Minimap.styles\";\n\nexport { staticClasses as flowMinimapClasses };\n\nexport type HvFlowMinimapClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowMinimapProps<NodeData = any>\n extends Omit<\n MiniMapProps<NodeData>,\n \"nodeColor\" | \"nodeStrokeColor\" | \"maskColor\" | \"maskStrokeColor\"\n > {\n /** Node color. Defaults to `atmo4`. */\n nodeColor?: HvColorAny | GetMiniMapNodeAttribute<NodeData>;\n /** Node stroke color. Defaults to `atmo4`. */\n nodeStrokeColor?: HvColorAny | GetMiniMapNodeAttribute<NodeData>;\n /** Mask color. Defaults to `atmo3`. */\n maskColor?: HvColorAny;\n /** Mask stroke color. Defaults to `atmo3`. */\n maskStrokeColor?: HvColorAny;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowMinimapClasses;\n}\n\nexport const HvFlowMinimap = ({\n nodeColor = \"atmo4\",\n maskColor = \"atmo3\",\n maskStrokeColor = \"atmo3\",\n nodeStrokeColor = \"atmo4\",\n classes: classesProp,\n className,\n ...others\n}: HvFlowMinimapProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <MiniMap\n className={cx(classes.root, className)}\n nodeColor={\n typeof nodeColor === \"string\" ? getColor(nodeColor, \"atmo4\") : nodeColor\n }\n nodeStrokeColor={\n typeof nodeStrokeColor === \"string\"\n ? getColor(nodeStrokeColor, \"atmo4\")\n : nodeStrokeColor\n }\n maskColor={getColor(maskColor, \"atmo3\")}\n maskStrokeColor={getColor(maskStrokeColor, \"atmo3\")}\n {...others}\n />\n );\n};\n"],"names":["HvFlowMinimap","nodeColor","maskColor","maskStrokeColor","nodeStrokeColor","classes","classesProp","className","others","cx","useClasses","root","getColor"],"mappings":";;;;;AA4BO,MAAMA,gBAAgBA,CAAC;AAAA,EAC5BC,YAAY;AAAA,EACZC,YAAY;AAAA,EACZC,kBAAkB;AAAA,EAClBC,kBAAkB;AAAA,EAClBC,SAASC;AAAAA,EACTC;AAAAA,EACA,GAAGC;AACe,MAAM;AAClB,QAAA;AAAA,IAAEH;AAAAA,IAASI;AAAAA,EAAAA,IAAOC,WAAWJ,WAAW;AAE9C,6BACG,SACC,EAAA,WAAWG,GAAGJ,QAAQM,MAAMJ,SAAS,GACrC,WACE,OAAON,cAAc,WAAWW,SAASX,WAAW,OAAO,IAAIA,WAEjE,iBACE,OAAOG,oBAAoB,WACvBQ,SAASR,iBAAiB,OAAO,IACjCA,iBAEN,WAAWQ,SAASV,WAAW,OAAO,GACtC,iBAAiBU,SAAST,iBAAiB,OAAO,GAC9CK,GAAAA,OACJ,CAAA;AAEN;"}
1
+ {"version":3,"file":"Minimap.js","sources":["../../../../../src/components/Flow/Minimap/Minimap.tsx"],"sourcesContent":["import { GetMiniMapNodeAttribute, MiniMap, MiniMapProps } from \"reactflow\";\n\nimport { ExtractNames } from \"@hitachivantara/uikit-react-core\";\nimport { HvColorAny, getColor } from \"@hitachivantara/uikit-styles\";\n\nimport { staticClasses, useClasses } from \"./Minimap.styles\";\n\nexport { staticClasses as flowMinimapClasses };\n\nexport type HvFlowMinimapClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowMinimapProps<NodeData = any>\n extends Omit<\n MiniMapProps<NodeData>,\n \"nodeColor\" | \"nodeStrokeColor\" | \"maskColor\" | \"maskStrokeColor\"\n > {\n /** Node color. Defaults to `atmo4`. */\n nodeColor?: HvColorAny | GetMiniMapNodeAttribute<NodeData>;\n /** Node stroke color. Defaults to `atmo4`. */\n nodeStrokeColor?: HvColorAny | GetMiniMapNodeAttribute<NodeData>;\n /** Mask color. Defaults to `atmo3`. */\n maskColor?: HvColorAny;\n /** Mask stroke color. Defaults to `atmo3`. */\n maskStrokeColor?: HvColorAny;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowMinimapClasses;\n}\n\nexport const HvFlowMinimap = ({\n nodeColor = \"atmo4\",\n maskColor = \"atmo3\",\n maskStrokeColor = \"atmo3\",\n nodeStrokeColor = \"atmo4\",\n classes: classesProp,\n className,\n ...others\n}: HvFlowMinimapProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <MiniMap\n className={cx(classes.root, className)}\n nodeColor={\n typeof nodeColor === \"string\" ? getColor(nodeColor, \"atmo4\") : nodeColor\n }\n nodeStrokeColor={\n typeof nodeStrokeColor === \"string\"\n ? getColor(nodeStrokeColor, \"atmo4\")\n : nodeStrokeColor\n }\n maskColor={getColor(maskColor, \"atmo3\")}\n maskStrokeColor={getColor(maskStrokeColor, \"atmo3\")}\n {...others}\n />\n );\n};\n"],"names":[],"mappings":";;;;;AA4BO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,MAA0B;AACxB,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACrC,WACE,OAAO,cAAc,WAAW,SAAS,WAAW,OAAO,IAAI;AAAA,MAEjE,iBACE,OAAO,oBAAoB,WACvB,SAAS,iBAAiB,OAAO,IACjC;AAAA,MAEN,WAAW,SAAS,WAAW,OAAO;AAAA,MACtC,iBAAiB,SAAS,iBAAiB,OAAO;AAAA,MACjD,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;"}
@@ -1,12 +1,7 @@
1
1
  import { createClasses, theme } from "@hitachivantara/uikit-react-core";
2
- const {
3
- staticClasses,
4
- useClasses
5
- } = createClasses("HvFlowMinimap", {
2
+ const { staticClasses, useClasses } = createClasses("HvFlowMinimap", {
6
3
  root: {
7
- "&.react-flow__minimap": {
8
- backgroundColor: theme.colors.atmo2
9
- }
4
+ "&.react-flow__minimap": { backgroundColor: theme.colors.atmo2 }
10
5
  }
11
6
  });
12
7
  export {
@@ -1 +1 @@
1
- {"version":3,"file":"Minimap.styles.js","sources":["../../../../../src/components/Flow/Minimap/Minimap.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowMinimap\", {\n root: {\n \"&.react-flow__minimap\": { backgroundColor: theme.colors.atmo2 },\n },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","backgroundColor","theme","colors","atmo2"],"mappings":";AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,iBAAiB;AAAA,EAC1EC,MAAM;AAAA,IACJ,yBAAyB;AAAA,MAAEC,iBAAiBC,MAAMC,OAAOC;AAAAA,IAAM;AAAA,EACjE;AACF,CAAC;"}
1
+ {"version":3,"file":"Minimap.styles.js","sources":["../../../../../src/components/Flow/Minimap/Minimap.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowMinimap\", {\n root: {\n \"&.react-flow__minimap\": { backgroundColor: theme.colors.atmo2 },\n },\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,iBAAiB;AAAA,EAC1E,MAAM;AAAA,IACJ,yBAAyB,EAAE,iBAAiB,MAAM,OAAO,MAAM;AAAA,EACjE;AACF,CAAC;"}
@@ -18,15 +18,10 @@ const isInputConnected = (id, type, handleId, edges) => {
18
18
  }
19
19
  return false;
20
20
  };
21
- const defaultActions = [{
22
- id: "delete",
23
- label: "Delete",
24
- icon: /* @__PURE__ */ jsx(Delete, {})
25
- }, {
26
- id: "duplicate",
27
- label: "Duplicate",
28
- icon: /* @__PURE__ */ jsx(Duplicate, {})
29
- }];
21
+ const defaultActions = [
22
+ { id: "delete", label: "Delete", icon: /* @__PURE__ */ jsx(Delete, {}) },
23
+ { id: "duplicate", label: "Duplicate", icon: /* @__PURE__ */ jsx(Duplicate, {}) }
24
+ ];
30
25
  const renderedIcon = (actionIcon) => isValidElement(actionIcon) ? actionIcon : actionIcon?.();
31
26
  const HvFlowBaseNode = ({
32
27
  id,
@@ -41,114 +36,153 @@ const HvFlowBaseNode = ({
41
36
  className,
42
37
  children
43
38
  }) => {
44
- const {
45
- registerNode,
46
- unregisterNode
47
- } = useNodeMetaRegistry();
39
+ const { registerNode, unregisterNode } = useNodeMetaRegistry();
48
40
  useEffect(() => {
49
- registerNode(id, {
50
- label: title || "",
51
- inputs,
52
- outputs
53
- });
41
+ registerNode(id, { label: title || "", inputs, outputs });
54
42
  return () => unregisterNode(id);
55
43
  }, [id, title, inputs, outputs, registerNode, unregisterNode]);
56
44
  const [showActions, setShowActions] = useState(false);
57
45
  const reactFlowInstance = useReactFlow();
58
- const {
59
- classes,
60
- cx,
61
- css
62
- } = useClasses(classesProp);
46
+ const { classes, cx, css } = useClasses(classesProp);
63
47
  const node = useFlowNode(id);
64
48
  const inputEdges = useFlowNodeInputEdges(id);
65
49
  const outputEdges = useFlowNodeOutputEdges(id);
66
- const handleDefaultAction = useCallback((action) => {
67
- if (!node)
68
- return;
69
- if (action.callback) {
70
- action.callback(node);
71
- return;
72
- }
73
- switch (action.id) {
74
- case "delete":
75
- reactFlowInstance.deleteElements({
76
- nodes: [node]
77
- });
78
- break;
79
- case "duplicate":
80
- reactFlowInstance.addNodes([{
81
- ...node,
82
- id: uid(),
83
- position: {
84
- x: node.position.x,
85
- y: node.position.y + (node.height || 0) + 20
86
- },
87
- selected: false,
88
- zIndex: Number(theme.zIndices.overlay)
89
- }]);
90
- break;
91
- }
92
- }, [node, reactFlowInstance]);
50
+ const handleDefaultAction = useCallback(
51
+ (action) => {
52
+ if (!node)
53
+ return;
54
+ if (action.callback) {
55
+ action.callback(node);
56
+ return;
57
+ }
58
+ switch (action.id) {
59
+ case "delete":
60
+ reactFlowInstance.deleteElements({ nodes: [node] });
61
+ break;
62
+ case "duplicate":
63
+ reactFlowInstance.addNodes([
64
+ {
65
+ ...node,
66
+ id: uid(),
67
+ position: {
68
+ x: node.position.x,
69
+ y: node.position.y + (node.height || 0) + 20
70
+ },
71
+ selected: false,
72
+ zIndex: Number(theme.zIndices.overlay)
73
+ }
74
+ ]);
75
+ break;
76
+ }
77
+ },
78
+ [node, reactFlowInstance]
79
+ );
93
80
  if (!node)
94
81
  return null;
95
82
  const color = getColor(colorProp);
96
83
  const iconColor = isValidElement(icon) ? getColor(icon.props.color || "base_dark") : getColor("base_dark");
97
- return /* @__PURE__ */ jsxs("div", { className: cx(
98
- "nowheel",
99
- // Disables the default canvas pan behaviour when scrolling inside the node
100
- css({
101
- border: `1px solid ${color}`
102
- }),
103
- classes.root,
104
- className
105
- ), onMouseEnter: () => setShowActions(true), onMouseLeave: () => setShowActions(false), children: [
106
- /* @__PURE__ */ jsx(NodeToolbar, { isVisible: showActions, offset: 0, children: nodeActions?.map((action) => /* @__PURE__ */ jsx(HvButton, { icon: true, onClick: () => handleDefaultAction(action), children: renderedIcon(action.icon) }, action.id)) }),
107
- /* @__PURE__ */ jsxs("div", { className: cx(css({
108
- backgroundColor: color
109
- }), classes.headerContainer), children: [
110
- /* @__PURE__ */ jsxs("div", { className: cx(classes.titleContainer, css({
111
- "& svg *.color0": {
112
- fill: iconColor
113
- }
114
- })), children: [
115
- icon,
116
- /* @__PURE__ */ jsx(HvTypography, { component: "p", variant: "title4", className: classes.title, children: title })
117
- ] }),
118
- headerItems && /* @__PURE__ */ jsx("div", { style: {
119
- display: "flex"
120
- }, children: headerItems })
121
- ] }),
122
- children && /* @__PURE__ */ jsx("div", { className: classes.contentContainer, children }),
123
- inputs && inputs.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
124
- /* @__PURE__ */ jsx("div", { className: classes.inputsTitleContainer, children: /* @__PURE__ */ jsx(HvTypography, { children: "Inputs" }) }),
125
- /* @__PURE__ */ jsx("div", { className: classes.inputsContainer, children: inputs?.map((input, idx) => {
126
- const handleId = input.id ?? idx.toString();
127
- return /* @__PURE__ */ jsxs("div", { className: classes.inputContainer, children: [
128
- /* @__PURE__ */ jsx(Handle, { type: "target", isConnectableStart: false, id: handleId, position: Position.Left, style: {
129
- top: "auto",
130
- bottom: (outputs?.length ? 80 : 18) + (outputs?.length || 0) * 29 + 29 * idx
131
- } }),
132
- /* @__PURE__ */ jsx(HvTypography, { children: input.label }),
133
- input.isMandatory && !isInputConnected(id, "target", handleId, inputEdges) && /* @__PURE__ */ jsx("div", { className: classes.mandatory })
134
- ] }, idx);
135
- }) })
136
- ] }),
137
- outputs && outputs.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
138
- /* @__PURE__ */ jsx("div", { className: classes.outputsTitleContainer, children: /* @__PURE__ */ jsx(HvTypography, { children: "Outputs" }) }),
139
- /* @__PURE__ */ jsx("div", { className: classes.outputsContainer, children: outputs?.map((output, idx) => {
140
- const handleId = output.id ?? idx.toString();
141
- return /* @__PURE__ */ jsxs("div", { className: classes.outputContainer, children: [
142
- /* @__PURE__ */ jsx(Handle, { type: "source", isConnectableEnd: false, id: handleId, position: Position.Right, style: {
143
- bottom: -10 + 29 * (outputs.length - idx),
144
- top: "auto"
145
- } }),
146
- output.isMandatory && !isInputConnected(id, "source", handleId, outputEdges) && /* @__PURE__ */ jsx("div", { className: classes.mandatory }),
147
- /* @__PURE__ */ jsx(HvTypography, { children: output.label })
148
- ] }, idx);
149
- }) })
150
- ] })
151
- ] });
84
+ return /* @__PURE__ */ jsxs(
85
+ "div",
86
+ {
87
+ className: cx(
88
+ "nowheel",
89
+ // Disables the default canvas pan behaviour when scrolling inside the node
90
+ css({ border: `1px solid ${color}` }),
91
+ classes.root,
92
+ className
93
+ ),
94
+ onMouseEnter: () => setShowActions(true),
95
+ onMouseLeave: () => setShowActions(false),
96
+ children: [
97
+ /* @__PURE__ */ jsx(NodeToolbar, { isVisible: showActions, offset: 0, children: nodeActions?.map((action) => /* @__PURE__ */ jsx(
98
+ HvButton,
99
+ {
100
+ icon: true,
101
+ onClick: () => handleDefaultAction(action),
102
+ children: renderedIcon(action.icon)
103
+ },
104
+ action.id
105
+ )) }),
106
+ /* @__PURE__ */ jsxs(
107
+ "div",
108
+ {
109
+ className: cx(css({ backgroundColor: color }), classes.headerContainer),
110
+ children: [
111
+ /* @__PURE__ */ jsxs(
112
+ "div",
113
+ {
114
+ className: cx(
115
+ classes.titleContainer,
116
+ css({ "& svg *.color0": { fill: iconColor } })
117
+ ),
118
+ children: [
119
+ icon,
120
+ /* @__PURE__ */ jsx(
121
+ HvTypography,
122
+ {
123
+ component: "p",
124
+ variant: "title4",
125
+ className: classes.title,
126
+ children: title
127
+ }
128
+ )
129
+ ]
130
+ }
131
+ ),
132
+ headerItems && /* @__PURE__ */ jsx("div", { style: { display: "flex" }, children: headerItems })
133
+ ]
134
+ }
135
+ ),
136
+ children && /* @__PURE__ */ jsx("div", { className: classes.contentContainer, children }),
137
+ inputs && inputs.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
138
+ /* @__PURE__ */ jsx("div", { className: classes.inputsTitleContainer, children: /* @__PURE__ */ jsx(HvTypography, { children: "Inputs" }) }),
139
+ /* @__PURE__ */ jsx("div", { className: classes.inputsContainer, children: inputs?.map((input, idx) => {
140
+ const handleId = input.id ?? idx.toString();
141
+ return /* @__PURE__ */ jsxs("div", { className: classes.inputContainer, children: [
142
+ /* @__PURE__ */ jsx(
143
+ Handle,
144
+ {
145
+ type: "target",
146
+ isConnectableStart: false,
147
+ id: handleId,
148
+ position: Position.Left,
149
+ style: {
150
+ top: "auto",
151
+ bottom: (outputs?.length ? 80 : 18) + (outputs?.length || 0) * 29 + 29 * idx
152
+ }
153
+ }
154
+ ),
155
+ /* @__PURE__ */ jsx(HvTypography, { children: input.label }),
156
+ input.isMandatory && !isInputConnected(id, "target", handleId, inputEdges) && /* @__PURE__ */ jsx("div", { className: classes.mandatory })
157
+ ] }, idx);
158
+ }) })
159
+ ] }),
160
+ outputs && outputs.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
161
+ /* @__PURE__ */ jsx("div", { className: classes.outputsTitleContainer, children: /* @__PURE__ */ jsx(HvTypography, { children: "Outputs" }) }),
162
+ /* @__PURE__ */ jsx("div", { className: classes.outputsContainer, children: outputs?.map((output, idx) => {
163
+ const handleId = output.id ?? idx.toString();
164
+ return /* @__PURE__ */ jsxs("div", { className: classes.outputContainer, children: [
165
+ /* @__PURE__ */ jsx(
166
+ Handle,
167
+ {
168
+ type: "source",
169
+ isConnectableEnd: false,
170
+ id: handleId,
171
+ position: Position.Right,
172
+ style: {
173
+ bottom: -10 + 29 * (outputs.length - idx),
174
+ top: "auto"
175
+ }
176
+ }
177
+ ),
178
+ output.isMandatory && !isInputConnected(id, "source", handleId, outputEdges) && /* @__PURE__ */ jsx("div", { className: classes.mandatory }),
179
+ /* @__PURE__ */ jsx(HvTypography, { children: output.label })
180
+ ] }, idx);
181
+ }) })
182
+ ] })
183
+ ]
184
+ }
185
+ );
152
186
  };
153
187
  export {
154
188
  HvFlowBaseNode,
@@ -1 +1 @@
1
- {"version":3,"file":"BaseNode.js","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","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","border","root","map","backgroundColor","headerContainer","titleContainer","fill","display","contentContainer","length","inputsTitleContainer","inputsContainer","input","idx","toString","inputContainer","Position","Left","top","bottom","isMandatory","mandatory","outputsTitleContainer","outputsContainer","output","outputContainer","Right"],"mappings":"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"}
1
+ {"version":3,"file":"BaseNode.js","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":[],"mappings":"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"}