@hitachivantara/uikit-react-lab 5.20.3 → 5.20.4

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 (175) hide show
  1. package/dist/esm/Dashboard/{Dashboard.js → Dashboard.mjs} +3 -3
  2. package/dist/esm/Dashboard/Dashboard.mjs.map +1 -0
  3. package/dist/esm/Dashboard/{Dashboard.styles.js → Dashboard.styles.mjs} +1 -1
  4. package/dist/esm/Dashboard/Dashboard.styles.mjs.map +1 -0
  5. package/dist/esm/Flow/Background/{Background.js → Background.mjs} +1 -1
  6. package/dist/esm/Flow/Background/Background.mjs.map +1 -0
  7. package/dist/esm/Flow/Controls/{Controls.js → Controls.mjs} +1 -1
  8. package/dist/esm/Flow/Controls/Controls.mjs.map +1 -0
  9. package/dist/esm/Flow/{DroppableFlow.js → DroppableFlow.mjs} +6 -6
  10. package/dist/esm/Flow/DroppableFlow.mjs.map +1 -0
  11. package/dist/esm/Flow/Empty/{Empty.js → Empty.mjs} +2 -2
  12. package/dist/esm/Flow/Empty/Empty.mjs.map +1 -0
  13. package/dist/esm/Flow/Empty/{Empty.styles.js → Empty.styles.mjs} +1 -1
  14. package/dist/esm/Flow/Empty/Empty.styles.mjs.map +1 -0
  15. package/dist/esm/Flow/{Flow.js → Flow.mjs} +3 -3
  16. package/dist/esm/Flow/Flow.mjs.map +1 -0
  17. package/dist/esm/Flow/{Flow.styles.js → Flow.styles.mjs} +2 -2
  18. package/dist/esm/Flow/Flow.styles.mjs.map +1 -0
  19. package/dist/esm/Flow/FlowContext/{FlowContext.js → FlowContext.mjs} +2 -2
  20. package/dist/esm/Flow/FlowContext/FlowContext.mjs.map +1 -0
  21. package/dist/esm/Flow/FlowContext/{NodeMetaContext.js → NodeMetaContext.mjs} +1 -1
  22. package/dist/esm/Flow/FlowContext/NodeMetaContext.mjs.map +1 -0
  23. package/dist/esm/Flow/Minimap/{Minimap.js → Minimap.mjs} +3 -3
  24. package/dist/esm/Flow/Minimap/Minimap.mjs.map +1 -0
  25. package/dist/esm/Flow/Minimap/{Minimap.styles.js → Minimap.styles.mjs} +1 -1
  26. package/dist/esm/Flow/Minimap/Minimap.styles.mjs.map +1 -0
  27. package/dist/esm/Flow/Node/{BaseNode.js → BaseNode.mjs} +5 -5
  28. package/dist/esm/Flow/Node/BaseNode.mjs.map +1 -0
  29. package/dist/esm/Flow/Node/{BaseNode.styles.js → BaseNode.styles.mjs} +1 -1
  30. package/dist/esm/Flow/Node/BaseNode.styles.mjs.map +1 -0
  31. package/dist/esm/Flow/Node/{Node.js → Node.mjs} +7 -7
  32. package/dist/esm/Flow/Node/Node.mjs.map +1 -0
  33. package/dist/esm/Flow/Node/{Node.styles.js → Node.styles.mjs} +1 -1
  34. package/dist/esm/Flow/Node/Node.styles.mjs.map +1 -0
  35. package/dist/esm/Flow/Node/Parameters/{ParamRenderer.js → ParamRenderer.mjs} +3 -3
  36. package/dist/esm/Flow/Node/Parameters/ParamRenderer.mjs.map +1 -0
  37. package/dist/esm/Flow/Node/Parameters/{Select.js → Select.mjs} +1 -1
  38. package/dist/esm/Flow/Node/Parameters/Select.mjs.map +1 -0
  39. package/dist/esm/Flow/Node/Parameters/{Text.js → Text.mjs} +1 -1
  40. package/dist/esm/Flow/Node/Parameters/Text.mjs.map +1 -0
  41. package/dist/esm/Flow/Sidebar/{Sidebar.js → Sidebar.mjs} +8 -8
  42. package/dist/esm/Flow/Sidebar/Sidebar.mjs.map +1 -0
  43. package/dist/esm/Flow/Sidebar/{Sidebar.styles.js → Sidebar.styles.mjs} +1 -1
  44. package/dist/esm/Flow/Sidebar/Sidebar.styles.mjs.map +1 -0
  45. package/dist/esm/Flow/Sidebar/SidebarGroup/{SidebarGroup.js → SidebarGroup.mjs} +5 -5
  46. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroup.mjs.map +1 -0
  47. package/dist/esm/Flow/Sidebar/SidebarGroup/{SidebarGroup.styles.js → SidebarGroup.styles.mjs} +1 -1
  48. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.mjs.map +1 -0
  49. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/{DraggableSidebarGroupItem.js → DraggableSidebarGroupItem.mjs} +2 -2
  50. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.mjs.map +1 -0
  51. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/{SidebarGroupItem.js → SidebarGroupItem.mjs} +3 -3
  52. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.mjs.map +1 -0
  53. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/{SidebarGroupItem.styles.js → SidebarGroupItem.styles.mjs} +1 -1
  54. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.mjs.map +1 -0
  55. package/dist/esm/Flow/Sidebar/{utils.js → utils.mjs} +1 -1
  56. package/dist/esm/Flow/Sidebar/utils.mjs.map +1 -0
  57. package/dist/esm/Flow/{base.js → base.mjs} +1 -1
  58. package/dist/esm/Flow/base.mjs.map +1 -0
  59. package/dist/esm/Flow/hooks/{useFlowContext.js → useFlowContext.mjs} +2 -2
  60. package/dist/esm/Flow/hooks/useFlowContext.mjs.map +1 -0
  61. package/dist/esm/Flow/hooks/{useFlowNode.js → useFlowNode.mjs} +1 -1
  62. package/dist/esm/Flow/hooks/useFlowNode.mjs.map +1 -0
  63. package/dist/esm/Flow/hooks/{useFlowNodeMeta.js → useFlowNodeMeta.mjs} +2 -2
  64. package/dist/esm/Flow/hooks/useFlowNodeMeta.mjs.map +1 -0
  65. package/dist/esm/Flow/nodes/{DashboardNode.js → DashboardNode.mjs} +3 -3
  66. package/dist/esm/Flow/nodes/DashboardNode.mjs.map +1 -0
  67. package/dist/esm/StepNavigation/DefaultNavigation/{DefaultNavigation.js → DefaultNavigation.mjs} +3 -3
  68. package/dist/esm/StepNavigation/DefaultNavigation/DefaultNavigation.mjs.map +1 -0
  69. package/dist/esm/StepNavigation/DefaultNavigation/Step/{Step.js → Step.mjs} +3 -3
  70. package/dist/esm/StepNavigation/DefaultNavigation/Step/Step.mjs.map +1 -0
  71. package/dist/esm/StepNavigation/DefaultNavigation/Step/{Step.styles.js → Step.styles.mjs} +1 -1
  72. package/dist/esm/StepNavigation/DefaultNavigation/Step/Step.styles.mjs.map +1 -0
  73. package/dist/esm/StepNavigation/DefaultNavigation/{utils.js → utils.mjs} +1 -1
  74. package/dist/esm/StepNavigation/DefaultNavigation/utils.mjs.map +1 -0
  75. package/dist/esm/StepNavigation/SimpleNavigation/Dot/{Dot.js → Dot.mjs} +4 -4
  76. package/dist/esm/StepNavigation/SimpleNavigation/Dot/Dot.mjs.map +1 -0
  77. package/dist/esm/StepNavigation/SimpleNavigation/Dot/{Dot.styles.js → Dot.styles.mjs} +1 -1
  78. package/dist/esm/StepNavigation/SimpleNavigation/Dot/Dot.styles.mjs.map +1 -0
  79. package/dist/esm/StepNavigation/SimpleNavigation/{SimpleNavigation.js → SimpleNavigation.mjs} +3 -3
  80. package/dist/esm/StepNavigation/SimpleNavigation/SimpleNavigation.mjs.map +1 -0
  81. package/dist/esm/StepNavigation/SimpleNavigation/{utils.js → utils.mjs} +1 -1
  82. package/dist/esm/StepNavigation/SimpleNavigation/utils.mjs.map +1 -0
  83. package/dist/esm/StepNavigation/{StepNavigation.js → StepNavigation.mjs} +6 -6
  84. package/dist/esm/StepNavigation/StepNavigation.mjs.map +1 -0
  85. package/dist/esm/StepNavigation/{StepNavigation.styles.js → StepNavigation.styles.mjs} +1 -1
  86. package/dist/esm/StepNavigation/StepNavigation.styles.mjs.map +1 -0
  87. package/dist/esm/StepNavigation/{utils.js → utils.mjs} +1 -1
  88. package/dist/esm/StepNavigation/utils.mjs.map +1 -0
  89. package/dist/esm/Wizard/{Wizard.js → Wizard.mjs} +8 -8
  90. package/dist/esm/Wizard/Wizard.mjs.map +1 -0
  91. package/dist/esm/Wizard/{Wizard.styles.js → Wizard.styles.mjs} +1 -1
  92. package/dist/esm/Wizard/Wizard.styles.mjs.map +1 -0
  93. package/dist/esm/Wizard/WizardActions/{WizardActions.js → WizardActions.mjs} +4 -4
  94. package/dist/esm/Wizard/WizardActions/WizardActions.mjs.map +1 -0
  95. package/dist/esm/Wizard/WizardActions/{WizardActions.styles.js → WizardActions.styles.mjs} +1 -1
  96. package/dist/esm/Wizard/WizardActions/WizardActions.styles.mjs.map +1 -0
  97. package/dist/esm/Wizard/WizardContainer/{WizardContainer.js → WizardContainer.mjs} +3 -3
  98. package/dist/esm/Wizard/WizardContainer/WizardContainer.mjs.map +1 -0
  99. package/dist/esm/Wizard/WizardContainer/{WizardContainer.styles.js → WizardContainer.styles.mjs} +1 -1
  100. package/dist/esm/Wizard/WizardContainer/WizardContainer.styles.mjs.map +1 -0
  101. package/dist/esm/Wizard/WizardContent/{LoadingContainer.js → LoadingContainer.mjs} +2 -2
  102. package/dist/esm/Wizard/WizardContent/LoadingContainer.mjs.map +1 -0
  103. package/dist/esm/Wizard/WizardContent/{LoadingContainer.styles.js → LoadingContainer.styles.mjs} +1 -1
  104. package/dist/esm/Wizard/WizardContent/LoadingContainer.styles.mjs.map +1 -0
  105. package/dist/esm/Wizard/WizardContent/{WizardContent.js → WizardContent.mjs} +5 -5
  106. package/dist/esm/Wizard/WizardContent/WizardContent.mjs.map +1 -0
  107. package/dist/esm/Wizard/WizardContent/{WizardContent.styles.js → WizardContent.styles.mjs} +1 -1
  108. package/dist/esm/Wizard/WizardContent/WizardContent.styles.mjs.map +1 -0
  109. package/dist/esm/Wizard/WizardContext/{WizardContext.js → WizardContext.mjs} +1 -1
  110. package/dist/esm/Wizard/WizardContext/WizardContext.mjs.map +1 -0
  111. package/dist/esm/Wizard/WizardTitle/{WizardTitle.js → WizardTitle.mjs} +5 -5
  112. package/dist/esm/Wizard/WizardTitle/WizardTitle.mjs.map +1 -0
  113. package/dist/esm/Wizard/WizardTitle/{WizardTitle.styles.js → WizardTitle.styles.mjs} +1 -1
  114. package/dist/esm/Wizard/WizardTitle/WizardTitle.styles.mjs.map +1 -0
  115. package/dist/esm/{index.js → index.mjs} +33 -33
  116. package/dist/esm/index.mjs.map +1 -0
  117. package/package.json +7 -7
  118. package/dist/esm/Dashboard/Dashboard.js.map +0 -1
  119. package/dist/esm/Dashboard/Dashboard.styles.js.map +0 -1
  120. package/dist/esm/Flow/Background/Background.js.map +0 -1
  121. package/dist/esm/Flow/Controls/Controls.js.map +0 -1
  122. package/dist/esm/Flow/DroppableFlow.js.map +0 -1
  123. package/dist/esm/Flow/Empty/Empty.js.map +0 -1
  124. package/dist/esm/Flow/Empty/Empty.styles.js.map +0 -1
  125. package/dist/esm/Flow/Flow.js.map +0 -1
  126. package/dist/esm/Flow/Flow.styles.js.map +0 -1
  127. package/dist/esm/Flow/FlowContext/FlowContext.js.map +0 -1
  128. package/dist/esm/Flow/FlowContext/NodeMetaContext.js.map +0 -1
  129. package/dist/esm/Flow/Minimap/Minimap.js.map +0 -1
  130. package/dist/esm/Flow/Minimap/Minimap.styles.js.map +0 -1
  131. package/dist/esm/Flow/Node/BaseNode.js.map +0 -1
  132. package/dist/esm/Flow/Node/BaseNode.styles.js.map +0 -1
  133. package/dist/esm/Flow/Node/Node.js.map +0 -1
  134. package/dist/esm/Flow/Node/Node.styles.js.map +0 -1
  135. package/dist/esm/Flow/Node/Parameters/ParamRenderer.js.map +0 -1
  136. package/dist/esm/Flow/Node/Parameters/Select.js.map +0 -1
  137. package/dist/esm/Flow/Node/Parameters/Text.js.map +0 -1
  138. package/dist/esm/Flow/Sidebar/Sidebar.js.map +0 -1
  139. package/dist/esm/Flow/Sidebar/Sidebar.styles.js.map +0 -1
  140. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroup.js.map +0 -1
  141. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.js.map +0 -1
  142. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.js.map +0 -1
  143. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.js.map +0 -1
  144. package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.js.map +0 -1
  145. package/dist/esm/Flow/Sidebar/utils.js.map +0 -1
  146. package/dist/esm/Flow/base.js.map +0 -1
  147. package/dist/esm/Flow/hooks/useFlowContext.js.map +0 -1
  148. package/dist/esm/Flow/hooks/useFlowNode.js.map +0 -1
  149. package/dist/esm/Flow/hooks/useFlowNodeMeta.js.map +0 -1
  150. package/dist/esm/Flow/nodes/DashboardNode.js.map +0 -1
  151. package/dist/esm/StepNavigation/DefaultNavigation/DefaultNavigation.js.map +0 -1
  152. package/dist/esm/StepNavigation/DefaultNavigation/Step/Step.js.map +0 -1
  153. package/dist/esm/StepNavigation/DefaultNavigation/Step/Step.styles.js.map +0 -1
  154. package/dist/esm/StepNavigation/DefaultNavigation/utils.js.map +0 -1
  155. package/dist/esm/StepNavigation/SimpleNavigation/Dot/Dot.js.map +0 -1
  156. package/dist/esm/StepNavigation/SimpleNavigation/Dot/Dot.styles.js.map +0 -1
  157. package/dist/esm/StepNavigation/SimpleNavigation/SimpleNavigation.js.map +0 -1
  158. package/dist/esm/StepNavigation/SimpleNavigation/utils.js.map +0 -1
  159. package/dist/esm/StepNavigation/StepNavigation.js.map +0 -1
  160. package/dist/esm/StepNavigation/StepNavigation.styles.js.map +0 -1
  161. package/dist/esm/StepNavigation/utils.js.map +0 -1
  162. package/dist/esm/Wizard/Wizard.js.map +0 -1
  163. package/dist/esm/Wizard/Wizard.styles.js.map +0 -1
  164. package/dist/esm/Wizard/WizardActions/WizardActions.js.map +0 -1
  165. package/dist/esm/Wizard/WizardActions/WizardActions.styles.js.map +0 -1
  166. package/dist/esm/Wizard/WizardContainer/WizardContainer.js.map +0 -1
  167. package/dist/esm/Wizard/WizardContainer/WizardContainer.styles.js.map +0 -1
  168. package/dist/esm/Wizard/WizardContent/LoadingContainer.js.map +0 -1
  169. package/dist/esm/Wizard/WizardContent/LoadingContainer.styles.js.map +0 -1
  170. package/dist/esm/Wizard/WizardContent/WizardContent.js.map +0 -1
  171. package/dist/esm/Wizard/WizardContent/WizardContent.styles.js.map +0 -1
  172. package/dist/esm/Wizard/WizardContext/WizardContext.js.map +0 -1
  173. package/dist/esm/Wizard/WizardTitle/WizardTitle.js.map +0 -1
  174. package/dist/esm/Wizard/WizardTitle/WizardTitle.styles.js.map +0 -1
  175. package/dist/esm/index.js.map +0 -1
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SidebarGroup.mjs","sources":["../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroup.tsx"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\n\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\nimport {\n ExtractNames,\n HvButton,\n HvButtonProps,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { getColor } from \"@hitachivantara/uikit-styles\";\n\nimport { HvFlowNodeGroup } from \"../../types\";\nimport { staticClasses, useClasses } from \"./SidebarGroup.styles\";\nimport {\n HvFlowDraggableSidebarGroupItem,\n HvFlowDraggableSidebarGroupItemProps,\n} from \"./SidebarGroupItem\";\nimport { useFlowContext } from \"../../hooks\";\n\nexport { staticClasses as flowSidebarGroupClasses };\n\nexport type HvFlowSidebarGroupClasses = ExtractNames<typeof useClasses>;\n\nexport type HvFlowSidebarGroupNode = {\n type: string;\n label: string;\n data?: unknown;\n};\n\nexport type HvFlowSidebarGroupNodes = HvFlowSidebarGroupNode[];\n\nexport interface HvFlowSidebarGroupProps extends HvFlowNodeGroup {\n /** Group id. */\n id: string;\n /** Group nodes. */\n nodes: HvFlowSidebarGroupNodes;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowSidebarGroupClasses;\n /** Expand button props. */\n expandButtonProps?: HvButtonProps;\n /** Item group props. */\n itemProps?: Partial<HvFlowDraggableSidebarGroupItemProps>;\n}\n\nexport const HvFlowSidebarGroup = ({\n id,\n label,\n nodes,\n color,\n description,\n icon,\n expandButtonProps,\n classes: classesProp,\n itemProps,\n}: HvFlowSidebarGroupProps) => {\n const { classes, cx, css } = useClasses(classesProp);\n\n const { expandedNodeGroups, setExpandedNodeGroups } = useFlowContext();\n\n const opened = useMemo(\n () => !!expandedNodeGroups?.find((groupId) => groupId === id),\n [expandedNodeGroups, id]\n );\n\n const handleClick = useCallback(() => {\n setExpandedNodeGroups?.((prev) =>\n opened ? prev.filter((groupId) => id !== groupId) : [...prev, id]\n );\n }, [id, opened, setExpandedNodeGroups]);\n\n return (\n <li className={cx(css({ borderColor: getColor(color) }), classes.root)}>\n <div className={classes.titleContainer}>\n <div className={classes.labelContainer}>\n <div className={classes.icon} role=\"none\">\n {icon}\n </div>\n <HvTypography component=\"p\" variant=\"title4\">\n {nodes.length > 1 ? `${label} (${nodes.length})` : label}\n </HvTypography>\n </div>\n <HvButton\n icon\n onClick={handleClick}\n aria-expanded={opened}\n {...expandButtonProps}\n >\n {opened ? <Up role=\"none\" /> : <Down role=\"none\" />}\n </HvButton>\n </div>\n {description && (\n <div className={classes.descriptionContainer}>\n <HvTypography>{description}</HvTypography>\n </div>\n )}\n {opened && (\n <div className={classes.itemsContainer}>\n {nodes.map((obj) => (\n <HvFlowDraggableSidebarGroupItem\n key={obj.type}\n {...itemProps}\n {...obj}\n />\n ))}\n </div>\n )}\n </li>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;AA4CO,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AACF,MAA+B;AAC7B,QAAM,EAAE,SAAS,IAAI,IAAI,IAAI,WAAW,WAAW;AAEnD,QAAM,EAAE,oBAAoB,sBAAsB,IAAI,eAAe;AAErE,QAAM,SAAS;AAAA,IACb,MAAM,CAAC,CAAC,oBAAoB,KAAK,CAAC,YAAY,YAAY,EAAE;AAAA,IAC5D,CAAC,oBAAoB,EAAE;AAAA,EAAA;AAGnB,QAAA,cAAc,YAAY,MAAM;AACpC;AAAA,MAAwB,CAAC,SACvB,SAAS,KAAK,OAAO,CAAC,YAAY,OAAO,OAAO,IAAI,CAAC,GAAG,MAAM,EAAE;AAAA,IAAA;AAAA,EAEjE,GAAA,CAAC,IAAI,QAAQ,qBAAqB,CAAC;AAEtC,SACG,qBAAA,MAAA,EAAG,WAAW,GAAG,IAAI,EAAE,aAAa,SAAS,KAAK,EAAE,CAAC,GAAG,QAAQ,IAAI,GACnE,UAAA;AAAA,IAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,gBACtB,UAAA;AAAA,MAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,gBACtB,UAAA;AAAA,QAAA,oBAAC,SAAI,WAAW,QAAQ,MAAM,MAAK,QAChC,UACH,MAAA;AAAA,QACC,oBAAA,cAAA,EAAa,WAAU,KAAI,SAAQ,UACjC,UAAA,MAAM,SAAS,IAAI,GAAG,KAAK,KAAK,MAAM,MAAM,MAAM,OACrD;AAAA,MAAA,GACF;AAAA,MACA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAI;AAAA,UACJ,SAAS;AAAA,UACT,iBAAe;AAAA,UACd,GAAG;AAAA,UAEH,UAAA,6BAAU,IAAG,EAAA,MAAK,QAAO,IAAK,oBAAC,MAAK,EAAA,MAAK,OAAO,CAAA;AAAA,QAAA;AAAA,MACnD;AAAA,IAAA,GACF;AAAA,IACC,mCACE,OAAI,EAAA,WAAW,QAAQ,sBACtB,UAAA,oBAAC,cAAc,EAAA,UAAA,YAAA,CAAY,EAC7B,CAAA;AAAA,IAED,8BACE,OAAI,EAAA,WAAW,QAAQ,gBACrB,UAAA,MAAM,IAAI,CAAC,QACV;AAAA,MAAC;AAAA,MAAA;AAAA,QAEE,GAAG;AAAA,QACH,GAAG;AAAA,MAAA;AAAA,MAFC,IAAI;AAAA,IAIZ,CAAA,GACH;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}
@@ -32,4 +32,4 @@ export {
32
32
  staticClasses,
33
33
  useClasses
34
34
  };
35
- //# sourceMappingURL=SidebarGroup.styles.js.map
35
+ //# sourceMappingURL=SidebarGroup.styles.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SidebarGroup.styles.mjs","sources":["../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\n \"HvFlowSidebarGroup\",\n {\n root: {\n padding: theme.space.sm,\n borderRadius: theme.radii.round,\n borderWidth: \"1px\",\n borderTopWidth: \"3px\",\n },\n titleContainer: {\n display: \"flex\",\n justifyContent: \"space-between\",\n },\n labelContainer: {\n display: \"flex\",\n alignItems: \"center\",\n },\n icon: { paddingRight: theme.space.xs },\n descriptionContainer: {\n padding: `${theme.space.xs} 0 ${theme.space.sm} calc(32px + ${theme.space.xs})`,\n },\n itemsContainer: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: theme.space.xs,\n paddingLeft: theme.space.sm,\n },\n }\n);\n"],"names":[],"mappings":";AAEa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS,MAAM,MAAM;AAAA,MACrB,cAAc,MAAM,MAAM;AAAA,MAC1B,aAAa;AAAA,MACb,gBAAgB;AAAA,IAClB;AAAA,IACA,gBAAgB;AAAA,MACd,SAAS;AAAA,MACT,gBAAgB;AAAA,IAClB;AAAA,IACA,gBAAgB;AAAA,MACd,SAAS;AAAA,MACT,YAAY;AAAA,IACd;AAAA,IACA,MAAM,EAAE,cAAc,MAAM,MAAM,GAAG;AAAA,IACrC,sBAAsB;AAAA,MACpB,SAAS,GAAG,MAAM,MAAM,EAAE,MAAM,MAAM,MAAM,EAAE,gBAAgB,MAAM,MAAM,EAAE;AAAA,IAC9E;AAAA,IACA,gBAAgB;AAAA,MACd,SAAS;AAAA,MACT,eAAe;AAAA,MACf,KAAK,MAAM,MAAM;AAAA,MACjB,aAAa,MAAM,MAAM;AAAA,IAC3B;AAAA,EACF;AACF;"}
@@ -3,7 +3,7 @@ import { useRef } from "react";
3
3
  import { useForkRef } from "@mui/material/utils";
4
4
  import { useDraggable } from "@dnd-kit/core";
5
5
  import { useUniqueId } from "@hitachivantara/uikit-react-core";
6
- import { HvFlowSidebarGroupItem } from "./SidebarGroupItem.js";
6
+ import { HvFlowSidebarGroupItem } from "./SidebarGroupItem.mjs";
7
7
  const HvFlowDraggableSidebarGroupItem = ({
8
8
  id,
9
9
  label,
@@ -49,4 +49,4 @@ const HvFlowDraggableSidebarGroupItem = ({
49
49
  export {
50
50
  HvFlowDraggableSidebarGroupItem
51
51
  };
52
- //# sourceMappingURL=DraggableSidebarGroupItem.js.map
52
+ //# sourceMappingURL=DraggableSidebarGroupItem.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DraggableSidebarGroupItem.mjs","sources":["../../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.tsx"],"sourcesContent":["import { useRef } from \"react\";\n\nimport { useForkRef } from \"@mui/material/utils\";\n\nimport { useDraggable } from \"@dnd-kit/core\";\n\nimport { useUniqueId } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n HvFlowSidebarGroupItem,\n HvFlowSidebarGroupItemProps,\n} from \"./SidebarGroupItem\";\n\nexport interface HvFlowDraggableSidebarGroupItemProps\n extends HvFlowSidebarGroupItemProps {\n /** Item type. */\n type: string;\n /** Item data. */\n data?: unknown;\n}\n\nexport const HvFlowDraggableSidebarGroupItem = ({\n id,\n label,\n type,\n data,\n ...others\n}: HvFlowDraggableSidebarGroupItemProps) => {\n const itemRef = useRef<HTMLElement>(null);\n\n const elementId = useUniqueId(id, `hvFlowDraggableItem-${type}`);\n\n const { attributes, listeners, setNodeRef, isDragging, transform } =\n useDraggable({\n id: elementId,\n data: {\n hvFlow: {\n // Needed to know which item is being dragged and dropped\n type,\n // Needed for the drag overlay: otherwise the item is cut by the drawer because of overflow\n label,\n // Item position: used to position the item when dropped\n x: itemRef.current?.getBoundingClientRect().x,\n y: itemRef.current?.getBoundingClientRect().y,\n // Data\n data,\n },\n },\n });\n\n const forkedRef = useForkRef(itemRef, setNodeRef);\n\n const style = transform\n ? {\n transform: `translate3d(${transform.x}px, ${transform.y}px, 0)`,\n }\n : undefined;\n\n return (\n <HvFlowSidebarGroupItem\n ref={forkedRef}\n style={style}\n label={label}\n isDragging={isDragging}\n {...listeners}\n {...attributes}\n {...others}\n />\n );\n};\n"],"names":[],"mappings":";;;;;;AAqBO,MAAM,kCAAkC,CAAC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA4C;AACpC,QAAA,UAAU,OAAoB,IAAI;AAExC,QAAM,YAAY,YAAY,IAAI,uBAAuB,IAAI,EAAE;AAE/D,QAAM,EAAE,YAAY,WAAW,YAAY,YAAY,cACrD,aAAa;AAAA,IACX,IAAI;AAAA,IACJ,MAAM;AAAA,MACJ,QAAQ;AAAA;AAAA,QAEN;AAAA;AAAA,QAEA;AAAA;AAAA,QAEA,GAAG,QAAQ,SAAS,sBAAwB,EAAA;AAAA,QAC5C,GAAG,QAAQ,SAAS,sBAAwB,EAAA;AAAA;AAAA,QAE5C;AAAA,MACF;AAAA,IACF;AAAA,EAAA,CACD;AAEG,QAAA,YAAY,WAAW,SAAS,UAAU;AAEhD,QAAM,QAAQ,YACV;AAAA,IACE,WAAW,eAAe,UAAU,CAAC,OAAO,UAAU,CAAC;AAAA,EAEzD,IAAA;AAGF,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;"}
@@ -2,8 +2,8 @@ import { jsxs, jsx } from "@emotion/react/jsx-runtime";
2
2
  import { forwardRef } from "react";
3
3
  import { HvTypography } from "@hitachivantara/uikit-react-core";
4
4
  import { Drag } from "@hitachivantara/uikit-react-icons";
5
- import { useClasses } from "./SidebarGroupItem.styles.js";
6
- import { staticClasses } from "./SidebarGroupItem.styles.js";
5
+ import { useClasses } from "./SidebarGroupItem.styles.mjs";
6
+ import { staticClasses } from "./SidebarGroupItem.styles.mjs";
7
7
  const HvFlowSidebarGroupItem = forwardRef(
8
8
  ({
9
9
  label,
@@ -35,4 +35,4 @@ export {
35
35
  HvFlowSidebarGroupItem,
36
36
  staticClasses as flowSidebarGroupItemClasses
37
37
  };
38
- //# sourceMappingURL=SidebarGroupItem.js.map
38
+ //# sourceMappingURL=SidebarGroupItem.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SidebarGroupItem.mjs","sources":["../../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport {\n ExtractNames,\n HvBaseProps,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Drag } from \"@hitachivantara/uikit-react-icons\";\n\nimport { staticClasses, useClasses } from \"./SidebarGroupItem.styles\";\n\nexport { staticClasses as flowSidebarGroupItemClasses };\n\nexport type HvFlowSidebarGroupItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowSidebarGroupItemProps extends HvBaseProps {\n /** Item label. */\n label: string;\n /** Whether the item is being dragged. */\n isDragging?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowSidebarGroupItemClasses;\n}\n\nexport const HvFlowSidebarGroupItem = forwardRef<\n HTMLDivElement,\n HvFlowSidebarGroupItemProps\n>(\n (\n {\n label,\n isDragging,\n classes: classesProp,\n className,\n ...others\n }: HvFlowSidebarGroupItemProps,\n ref\n ) => {\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <div\n ref={ref}\n className={cx(\n classes.root,\n { [classes.dragging]: isDragging },\n className\n )}\n {...others}\n >\n <HvTypography>{label}</HvTypography>\n <Drag role=\"none\" />\n </div>\n );\n }\n);\n"],"names":[],"mappings":";;;;;;AAwBO,MAAM,yBAAyB;AAAA,EAIpC,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,KAEL,QACG;AACH,UAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,UACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,WAAW;AAAA,UACjC;AAAA,QACF;AAAA,QACC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAA,oBAAC,gBAAc,UAAM,MAAA,CAAA;AAAA,UACrB,oBAAC,MAAK,EAAA,MAAK,OAAO,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGxB;AACF;"}
@@ -21,4 +21,4 @@ export {
21
21
  staticClasses,
22
22
  useClasses
23
23
  };
24
- //# sourceMappingURL=SidebarGroupItem.styles.js.map
24
+ //# sourceMappingURL=SidebarGroupItem.styles.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SidebarGroupItem.styles.mjs","sources":["../../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.tsx"],"sourcesContent":["import {\n createClasses,\n outlineStyles,\n theme,\n} from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\n \"HvFlowSidebarGroupItem\",\n {\n root: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n border: `1px solid ${theme.colors.atmo4}`,\n padding: theme.spacing(0, 0, 0, \"sm\"),\n cursor: \"pointer\",\n boxShadow: `0 1px 0 ${theme.colors.shad1}`,\n\n \"&:focus-visible\": {\n ...outlineStyles,\n },\n },\n dragging: { borderColor: theme.colors.primary_80 },\n }\n);\n"],"names":[],"mappings":";AAMa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,QAAQ,aAAa,MAAM,OAAO,KAAK;AAAA,MACvC,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG,IAAI;AAAA,MACpC,QAAQ;AAAA,MACR,WAAW,WAAW,MAAM,OAAO,KAAK;AAAA,MAExC,mBAAmB;AAAA,QACjB,GAAG;AAAA,MACL;AAAA,IACF;AAAA,IACA,UAAU,EAAE,aAAa,MAAM,OAAO,WAAW;AAAA,EACnD;AACF;"}
@@ -40,4 +40,4 @@ const buildGroups = (nodeGroups, nodeTypes, defaultGroupProps) => {
40
40
  export {
41
41
  buildGroups
42
42
  };
43
- //# sourceMappingURL=utils.js.map
43
+ //# sourceMappingURL=utils.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"utils.mjs","sources":["../../../../src/Flow/Sidebar/utils.ts"],"sourcesContent":["import { HvFlowContextValue } from \"../FlowContext\";\nimport { HvFlowNodeGroup } from \"../types\";\nimport {\n HvFlowSidebarGroupNodes,\n HvFlowSidebarGroupNode,\n} from \"./SidebarGroup\";\n\ntype NodeGroup = HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes };\n\nexport const buildGroups = (\n nodeGroups: HvFlowContextValue[\"nodeGroups\"],\n nodeTypes: HvFlowContextValue[\"nodeTypes\"],\n defaultGroupProps?: HvFlowNodeGroup\n) => {\n if (!nodeGroups) return {};\n\n return Object.entries(nodeGroups).reduce((acc, curr) => {\n const nodesWithGroupId: HvFlowSidebarGroupNode[] = [];\n const nodesWithoutGroupId: HvFlowSidebarGroupNode[] = [];\n\n if (nodeTypes) {\n for (const [nodeType, node] of Object.entries(nodeTypes)) {\n if (node.meta?.groupId === curr[0]) {\n nodesWithGroupId.push({\n type: nodeType,\n label: node.meta?.label,\n data: node.meta?.data,\n });\n } else if (!node.meta?.groupId) {\n nodesWithoutGroupId.push({\n type: nodeType,\n label: node.meta?.label || \"\",\n data: node.meta?.data,\n });\n }\n }\n }\n\n acc[curr[0]] = {\n ...curr[1],\n nodes: nodesWithGroupId,\n };\n\n // Create a \"Default\" group for nodes without a groupId\n if (nodesWithoutGroupId.length > 0) {\n acc.Default = {\n // @ts-ignore\n name: \"Default\",\n label: \"Default\",\n nodes: nodesWithoutGroupId,\n ...defaultGroupProps,\n };\n }\n\n return acc;\n }, {} as Record<string, NodeGroup>);\n};\n"],"names":[],"mappings":"AASO,MAAM,cAAc,CACzB,YACA,WACA,sBACG;AACH,MAAI,CAAC;AAAY,WAAO;AAExB,SAAO,OAAO,QAAQ,UAAU,EAAE,OAAO,CAAC,KAAK,SAAS;AACtD,UAAM,mBAA6C,CAAA;AACnD,UAAM,sBAAgD,CAAA;AAEtD,QAAI,WAAW;AACb,iBAAW,CAAC,UAAU,IAAI,KAAK,OAAO,QAAQ,SAAS,GAAG;AACxD,YAAI,KAAK,MAAM,YAAY,KAAK,CAAC,GAAG;AAClC,2BAAiB,KAAK;AAAA,YACpB,MAAM;AAAA,YACN,OAAO,KAAK,MAAM;AAAA,YAClB,MAAM,KAAK,MAAM;AAAA,UAAA,CAClB;AAAA,QACQ,WAAA,CAAC,KAAK,MAAM,SAAS;AAC9B,8BAAoB,KAAK;AAAA,YACvB,MAAM;AAAA,YACN,OAAO,KAAK,MAAM,SAAS;AAAA,YAC3B,MAAM,KAAK,MAAM;AAAA,UAAA,CAClB;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAEI,QAAA,KAAK,CAAC,CAAC,IAAI;AAAA,MACb,GAAG,KAAK,CAAC;AAAA,MACT,OAAO;AAAA,IAAA;AAIL,QAAA,oBAAoB,SAAS,GAAG;AAClC,UAAI,UAAU;AAAA;AAAA,QAEZ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,OAAO;AAAA,QACP,GAAG;AAAA,MAAA;AAAA,IAEP;AAEO,WAAA;AAAA,EACT,GAAG,CAA+B,CAAA;AACpC;"}
@@ -409,4 +409,4 @@ const flowStyles = css`
409
409
  export {
410
410
  flowStyles
411
411
  };
412
- //# sourceMappingURL=base.js.map
412
+ //# sourceMappingURL=base.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"base.mjs","sources":["../../../src/Flow/base.ts"],"sourcesContent":["import { css } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const flowStyles = css`\n /* this gets exported as style.css and can be used for the default theming */\n /* these are the necessary styles for React Flow, they get used by base.css and style.css */\n .react-flow__container {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n }\n .react-flow__pane {\n z-index: 1;\n cursor: -webkit-grab;\n cursor: grab;\n }\n .react-flow__pane.selection {\n cursor: pointer;\n }\n .react-flow__pane.dragging {\n cursor: -webkit-grabbing;\n cursor: grabbing;\n }\n .react-flow__viewport {\n transform-origin: 0 0;\n z-index: 2;\n pointer-events: none;\n }\n .react-flow__renderer {\n z-index: 4;\n }\n .react-flow__selection {\n z-index: 6;\n }\n .react-flow__nodesselection-rect:focus,\n .react-flow__nodesselection-rect:focus-visible {\n outline: none;\n }\n .react-flow .react-flow__edges {\n pointer-events: none;\n overflow: visible;\n }\n .react-flow__edge-path,\n .react-flow__connection-path {\n stroke: ${theme.colors.secondary};\n stroke-width: 1;\n fill: none;\n }\n .react-flow__edge {\n pointer-events: visibleStroke;\n cursor: pointer;\n }\n .react-flow__edge.animated path {\n stroke-dasharray: 5;\n -webkit-animation: dashdraw 0.5s linear infinite;\n animation: dashdraw 0.5s linear infinite;\n }\n .react-flow__edge.animated path.react-flow__edge-interaction {\n stroke-dasharray: none;\n -webkit-animation: none;\n animation: none;\n }\n .react-flow__edge.inactive {\n pointer-events: none;\n }\n .react-flow__edge.selected,\n .react-flow__edge:focus,\n .react-flow__edge:focus-visible {\n outline: none;\n }\n .react-flow__edge.selected .react-flow__edge-path,\n .react-flow__edge:focus .react-flow__edge-path,\n .react-flow__edge:focus-visible .react-flow__edge-path {\n stroke: #555;\n }\n .react-flow__edge-textwrapper {\n pointer-events: all;\n }\n .react-flow__edge-textbg {\n fill: white;\n }\n .react-flow__edge .react-flow__edge-text {\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n .react-flow__connection {\n pointer-events: none;\n }\n .react-flow__connection .animated {\n stroke-dasharray: 5;\n -webkit-animation: dashdraw 0.5s linear infinite;\n animation: dashdraw 0.5s linear infinite;\n }\n .react-flow__connectionline {\n z-index: 1001;\n }\n .react-flow__nodes {\n pointer-events: none;\n transform-origin: 0 0;\n }\n .react-flow__node {\n position: absolute;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n pointer-events: all;\n transform-origin: 0 0;\n box-sizing: border-box;\n cursor: -webkit-grab;\n cursor: grab;\n }\n .react-flow__node.dragging {\n cursor: -webkit-grabbing;\n cursor: grabbing;\n }\n .react-flow__nodesselection {\n z-index: 3;\n transform-origin: left top;\n pointer-events: none;\n }\n .react-flow__nodesselection-rect {\n position: absolute;\n pointer-events: all;\n cursor: -webkit-grab;\n cursor: grab;\n }\n .react-flow__handle {\n position: absolute;\n pointer-events: none;\n min-width: 5px;\n min-height: 5px;\n width: 6px;\n height: 6px;\n background: #1a192b;\n border: 1px solid white;\n border-radius: 100%;\n }\n .react-flow__handle.connectionindicator {\n pointer-events: all;\n cursor: crosshair;\n }\n .react-flow__handle-bottom {\n top: auto;\n left: 50%;\n bottom: -4px;\n transform: translate(-50%, 0);\n }\n .react-flow__handle-top {\n left: 50%;\n top: -4px;\n transform: translate(-50%, 0);\n }\n .react-flow__handle-left {\n top: 50%;\n left: -4px;\n transform: translate(0, -50%);\n }\n .react-flow__handle-right {\n right: -4px;\n top: 50%;\n transform: translate(0, -50%);\n }\n .react-flow__edgeupdater {\n cursor: move;\n pointer-events: all;\n }\n .react-flow__panel {\n position: absolute;\n z-index: 5;\n margin: 15px;\n }\n .react-flow__panel.top {\n top: 0;\n }\n .react-flow__panel.bottom {\n bottom: 0;\n }\n .react-flow__panel.left {\n left: 0;\n }\n .react-flow__panel.right {\n right: 0;\n }\n .react-flow__panel.center {\n left: 50%;\n transform: translateX(-50%);\n }\n .react-flow__attribution {\n font-size: 10px;\n background: rgba(255, 255, 255, 0.5);\n padding: 2px 3px;\n margin: 0;\n }\n .react-flow__attribution a {\n text-decoration: none;\n color: #999;\n }\n @-webkit-keyframes dashdraw {\n from {\n stroke-dashoffset: 10;\n }\n }\n @keyframes dashdraw {\n from {\n stroke-dashoffset: 10;\n }\n }\n .react-flow__edgelabel-renderer {\n position: absolute;\n width: 100%;\n height: 100%;\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n .react-flow__edge.updating .react-flow__edge-path {\n stroke: #777;\n }\n .react-flow__edge-text {\n font-size: 10px;\n }\n .react-flow__node.selectable:focus,\n .react-flow__node.selectable:focus-visible {\n outline: none;\n }\n .react-flow__node-default,\n .react-flow__node-input,\n .react-flow__node-output,\n .react-flow__node-group {\n padding: ${theme.space.sm};\n border-radius: ${theme.radii.round};\n width: 150px;\n color: ${theme.colors.secondary};\n text-align: center;\n border: 1px solid ${theme.colors.negative};\n background-color: ${theme.colors.negative_20};\n }\n .react-flow__node-default::before {\n content: \"Unknown node type\";\n display: block;\n }\n .react-flow__node-default.selectable:hover,\n .react-flow__node-input.selectable:hover,\n .react-flow__node-output.selectable:hover,\n .react-flow__node-group.selectable:hover {\n box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.08);\n }\n .react-flow__node-default.selectable.selected,\n .react-flow__node-default.selectable:focus,\n .react-flow__node-default.selectable:focus-visible,\n .react-flow__node-input.selectable.selected,\n .react-flow__node-input.selectable:focus,\n .react-flow__node-input.selectable:focus-visible,\n .react-flow__node-output.selectable.selected,\n .react-flow__node-output.selectable:focus,\n .react-flow__node-output.selectable:focus-visible,\n .react-flow__node-group.selectable.selected,\n .react-flow__node-group.selectable:focus,\n .react-flow__node-group.selectable:focus-visible {\n box-shadow: 0 0 0 0.5px #1a192b;\n }\n .react-flow__node-group {\n background-color: rgba(240, 240, 240, 0.25);\n }\n .react-flow__nodesselection-rect,\n .react-flow__selection {\n background: rgba(0, 89, 220, 0.08);\n border: 1px dotted rgba(0, 89, 220, 0.8);\n }\n .react-flow__nodesselection-rect:focus,\n .react-flow__nodesselection-rect:focus-visible,\n .react-flow__selection:focus,\n .react-flow__selection:focus-visible {\n outline: none;\n }\n .react-flow__controls {\n box-shadow: ${theme.colors.shadow};\n }\n .react-flow__controls-button {\n border: none;\n background: #fefefe;\n border-bottom: 1px solid #eee;\n box-sizing: content-box;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 16px;\n height: 16px;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n padding: 5px;\n }\n .react-flow__controls-button:hover {\n background: #f4f4f4;\n }\n .react-flow__controls-button svg {\n width: 100%;\n max-width: 12px;\n max-height: 12px;\n }\n .react-flow__controls-button:disabled {\n pointer-events: none;\n }\n .react-flow__controls-button:disabled svg {\n fill-opacity: 0.4;\n }\n .react-flow__minimap {\n background-color: #fff;\n }\n .react-flow__resize-control {\n position: absolute;\n }\n .react-flow__resize-control.left,\n .react-flow__resize-control.right {\n cursor: ew-resize;\n }\n .react-flow__resize-control.top,\n .react-flow__resize-control.bottom {\n cursor: ns-resize;\n }\n .react-flow__resize-control.top.left,\n .react-flow__resize-control.bottom.right {\n cursor: nwse-resize;\n }\n .react-flow__resize-control.bottom.left,\n .react-flow__resize-control.top.right {\n cursor: nesw-resize;\n }\n /* handle styles */\n .react-flow__resize-control.handle {\n width: 4px;\n height: 4px;\n border: 1px solid #fff;\n border-radius: 1px;\n background-color: ${theme.colors.primary};\n transform: translate(-50%, -50%);\n }\n .react-flow__resize-control.handle.left {\n left: 0;\n top: 50%;\n }\n .react-flow__resize-control.handle.right {\n left: 100%;\n top: 50%;\n }\n .react-flow__resize-control.handle.top {\n left: 50%;\n top: 0;\n }\n .react-flow__resize-control.handle.bottom {\n left: 50%;\n top: 100%;\n }\n .react-flow__resize-control.handle.top.left {\n left: 0;\n }\n .react-flow__resize-control.handle.bottom.left {\n left: 0;\n }\n .react-flow__resize-control.handle.top.right {\n left: 100%;\n }\n .react-flow__resize-control.handle.bottom.right {\n left: 100%;\n }\n /* line styles */\n .react-flow__resize-control.line {\n border-color: ${theme.colors.primary};\n border-width: 0;\n border-style: solid;\n }\n .react-flow__resize-control.line.left,\n .react-flow__resize-control.line.right {\n width: 1px;\n transform: translate(-50%, 0);\n top: 0;\n height: 100%;\n }\n .react-flow__resize-control.line.left {\n left: 0;\n border-left-width: 1px;\n }\n .react-flow__resize-control.line.right {\n left: 100%;\n border-right-width: 1px;\n }\n .react-flow__resize-control.line.top,\n .react-flow__resize-control.line.bottom {\n height: 1px;\n transform: translate(0, -50%);\n left: 0;\n width: 100%;\n }\n .react-flow__resize-control.line.top {\n top: 0;\n border-top-width: 1px;\n }\n .react-flow__resize-control.line.bottom {\n border-bottom-width: 1px;\n top: 100%;\n }\n`;\n"],"names":[],"mappings":";;AAGO,MAAM,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cA2CZ,MAAM,OAAO,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eA4LrB,MAAM,MAAM,EAAE;AAAA,qBACR,MAAM,MAAM,KAAK;AAAA;AAAA,aAEzB,MAAM,OAAO,SAAS;AAAA;AAAA,wBAEX,MAAM,OAAO,QAAQ;AAAA,wBACrB,MAAM,OAAO,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAyC9B,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBA4Db,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAiCxB,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
@@ -1,7 +1,7 @@
1
1
  import { useContext } from "react";
2
- import { HvFlowContext } from "../FlowContext/FlowContext.js";
2
+ import { HvFlowContext } from "../FlowContext/FlowContext.mjs";
3
3
  const useFlowContext = () => useContext(HvFlowContext);
4
4
  export {
5
5
  useFlowContext
6
6
  };
7
- //# sourceMappingURL=useFlowContext.js.map
7
+ //# sourceMappingURL=useFlowContext.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useFlowContext.mjs","sources":["../../../../src/Flow/hooks/useFlowContext.ts"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { HvFlowContext } from \"../FlowContext\";\n\nexport const useFlowContext = () => useContext(HvFlowContext);\n"],"names":[],"mappings":";;AAIa,MAAA,iBAAiB,MAAM,WAAW,aAAa;"}
@@ -61,4 +61,4 @@ export {
61
61
  useFlowNodeParents,
62
62
  useFlowOutputNodes
63
63
  };
64
- //# sourceMappingURL=useFlowNode.js.map
64
+ //# sourceMappingURL=useFlowNode.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useFlowNode.mjs","sources":["../../../../src/Flow/hooks/useFlowNode.ts"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\nimport {\n Node,\n Edge,\n ReactFlowState,\n useStore,\n useNodes,\n useEdges,\n} from \"reactflow\";\n\nexport function useFlowNode<T extends Node = Node>(id: string) {\n const nodeSelector = useCallback(\n (state: ReactFlowState) =>\n state.getNodes().find((n: Node): n is T => n.id === id),\n [id]\n );\n return useStore<T | undefined>(nodeSelector);\n}\n\nexport function useFlowNodeInputEdges(id: string) {\n const inputEdgesSelector = useCallback(\n (state: ReactFlowState) => state.edges.filter((e: Edge) => e.target === id),\n [id]\n );\n return useStore(inputEdgesSelector);\n}\n\nexport function useFlowNodeOutputEdges(id: string) {\n const outputEdgesSelector = useCallback(\n (state: ReactFlowState) => state.edges.filter((e: Edge) => e.source === id),\n [id]\n );\n return useStore(outputEdgesSelector);\n}\n\nexport function useFlowNodeEdges(id: string) {\n const edgesSelector = useCallback(\n (state: ReactFlowState) =>\n state.edges.filter((e: Edge) => e.source === id || e.target === id),\n [id]\n );\n return useStore(edgesSelector);\n}\n\nexport function useFlowNodeParents(id: string) {\n const inputEdges = useFlowNodeInputEdges(id);\n const parentNodesSelector = useCallback(\n (state: ReactFlowState) => {\n return inputEdges\n .map((e) => state.getNodes().find((n: Node) => n.id === e.source))\n .filter((n): n is Node => n !== null);\n },\n [inputEdges]\n );\n return useStore(parentNodesSelector);\n}\n\nexport function useFlowInputNodes<T = any>(id: string) {\n const nodes = useNodes();\n const edges = useEdges();\n\n return useMemo(() => {\n return edges\n .filter((e) => e.target === id)\n .map((e) => nodes.find((n) => n.id === e.source))\n .filter((n): n is Node<T> => n !== null);\n }, [edges, id, nodes]);\n}\n\nexport function useFlowOutputNodes<T = any>(id: string) {\n const nodes = useNodes();\n const edges = useEdges();\n\n return useMemo(() => {\n return edges\n .filter((e) => e.source === id)\n .map((e) => nodes.find((n) => n.id === e.target))\n .filter((n): n is Node<T> => n !== null);\n }, [edges, id, nodes]);\n}\n"],"names":[],"mappings":";;AAUO,SAAS,YAAmC,IAAY;AAC7D,QAAM,eAAe;AAAA,IACnB,CAAC,UACC,MAAM,WAAW,KAAK,CAAC,MAAoB,EAAE,OAAO,EAAE;AAAA,IACxD,CAAC,EAAE;AAAA,EAAA;AAEL,SAAO,SAAwB,YAAY;AAC7C;AAEO,SAAS,sBAAsB,IAAY;AAChD,QAAM,qBAAqB;AAAA,IACzB,CAAC,UAA0B,MAAM,MAAM,OAAO,CAAC,MAAY,EAAE,WAAW,EAAE;AAAA,IAC1E,CAAC,EAAE;AAAA,EAAA;AAEL,SAAO,SAAS,kBAAkB;AACpC;AAEO,SAAS,uBAAuB,IAAY;AACjD,QAAM,sBAAsB;AAAA,IAC1B,CAAC,UAA0B,MAAM,MAAM,OAAO,CAAC,MAAY,EAAE,WAAW,EAAE;AAAA,IAC1E,CAAC,EAAE;AAAA,EAAA;AAEL,SAAO,SAAS,mBAAmB;AACrC;AAEO,SAAS,iBAAiB,IAAY;AAC3C,QAAM,gBAAgB;AAAA,IACpB,CAAC,UACC,MAAM,MAAM,OAAO,CAAC,MAAY,EAAE,WAAW,MAAM,EAAE,WAAW,EAAE;AAAA,IACpE,CAAC,EAAE;AAAA,EAAA;AAEL,SAAO,SAAS,aAAa;AAC/B;AAEO,SAAS,mBAAmB,IAAY;AACvC,QAAA,aAAa,sBAAsB,EAAE;AAC3C,QAAM,sBAAsB;AAAA,IAC1B,CAAC,UAA0B;AAClB,aAAA,WACJ,IAAI,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,CAAC,MAAY,EAAE,OAAO,EAAE,MAAM,CAAC,EAChE,OAAO,CAAC,MAAiB,MAAM,IAAI;AAAA,IACxC;AAAA,IACA,CAAC,UAAU;AAAA,EAAA;AAEb,SAAO,SAAS,mBAAmB;AACrC;AAEO,SAAS,kBAA2B,IAAY;AACrD,QAAM,QAAQ;AACd,QAAM,QAAQ;AAEd,SAAO,QAAQ,MAAM;AACZ,WAAA,MACJ,OAAO,CAAC,MAAM,EAAE,WAAW,EAAE,EAC7B,IAAI,CAAC,MAAM,MAAM,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,EAC/C,OAAO,CAAC,MAAoB,MAAM,IAAI;AAAA,EACxC,GAAA,CAAC,OAAO,IAAI,KAAK,CAAC;AACvB;AAEO,SAAS,mBAA4B,IAAY;AACtD,QAAM,QAAQ;AACd,QAAM,QAAQ;AAEd,SAAO,QAAQ,MAAM;AACZ,WAAA,MACJ,OAAO,CAAC,MAAM,EAAE,WAAW,EAAE,EAC7B,IAAI,CAAC,MAAM,MAAM,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,EAC/C,OAAO,CAAC,MAAoB,MAAM,IAAI;AAAA,EACxC,GAAA,CAAC,OAAO,IAAI,KAAK,CAAC;AACvB;"}
@@ -1,4 +1,4 @@
1
- import { useNodeMetaRegistry } from "../FlowContext/NodeMetaContext.js";
1
+ import { useNodeMetaRegistry } from "../FlowContext/NodeMetaContext.mjs";
2
2
  function useFlowNodeMeta(id) {
3
3
  const { registry } = useNodeMetaRegistry();
4
4
  return registry[id];
@@ -6,4 +6,4 @@ function useFlowNodeMeta(id) {
6
6
  export {
7
7
  useFlowNodeMeta
8
8
  };
9
- //# sourceMappingURL=useFlowNodeMeta.js.map
9
+ //# sourceMappingURL=useFlowNodeMeta.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useFlowNodeMeta.mjs","sources":["../../../../src/Flow/hooks/useFlowNodeMeta.ts"],"sourcesContent":["import { useNodeMetaRegistry } from \"../FlowContext/NodeMetaContext\";\n\nexport function useFlowNodeMeta(id: string) {\n const { registry } = useNodeMetaRegistry();\n\n return registry[id];\n}\n"],"names":[],"mappings":";AAEO,SAAS,gBAAgB,IAAY;AACpC,QAAA,EAAE,aAAa;AAErB,SAAO,SAAS,EAAE;AACpB;"}
@@ -1,8 +1,8 @@
1
1
  import { jsxs, jsx } from "@emotion/react/jsx-runtime";
2
2
  import { createClasses, theme, useLabels, HvDialog, HvDialogTitle, HvDialogContent, HvEmptyState, HvDialogActions, HvButton } from "@hitachivantara/uikit-react-core";
3
3
  import { Info } from "@hitachivantara/uikit-react-icons";
4
- import { HvFlowNode } from "../Node/Node.js";
5
- import { HvDashboard } from "../../Dashboard/Dashboard.js";
4
+ import { HvFlowNode } from "../Node/Node.mjs";
5
+ import { HvDashboard } from "../../Dashboard/Dashboard.mjs";
6
6
  const { staticClasses, useClasses } = createClasses("HvDashboardNode", {
7
7
  actions: {
8
8
  display: "flex",
@@ -88,4 +88,4 @@ export {
88
88
  HvDashboardNode,
89
89
  staticClasses as hvDashboardNodeClasses
90
90
  };
91
- //# sourceMappingURL=DashboardNode.js.map
91
+ //# sourceMappingURL=DashboardNode.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DashboardNode.mjs","sources":["../../../../src/Flow/nodes/DashboardNode.tsx"],"sourcesContent":["import {\n ExtractNames,\n HvButton,\n HvDialog,\n HvDialogActions,\n HvDialogContent,\n HvDialogProps,\n HvDialogTitle,\n HvEmptyState,\n createClasses,\n theme,\n useLabels,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Info } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvDashboard, HvDashboardProps } from \"../../Dashboard\";\nimport { HvFlowNode, HvFlowNodeProps, HvFlowNodeClasses } from \"../Node\";\n\nconst { staticClasses, useClasses } = createClasses(\"HvDashboardNode\", {\n actions: {\n display: \"flex\",\n justifyContent: \"space-around\",\n padding: theme.space.xs,\n },\n empty: {\n padding: theme.spacing(\"sm\", 0, 0, 0),\n },\n});\n\nexport { staticClasses as hvDashboardNodeClasses };\n\nconst DEFAULT_LABELS = {\n title: \"Dashboard\",\n description: \"Dashboard\",\n emptyMessage: \"No visualizations connected to the dashboard.\",\n dialogTitle: \"Configure dashboard\",\n dialogSubtitle: \"Please configure the layout of your dashboard as needed.\",\n dialogApply: \"Apply\",\n dialogCancel: \"Cancel\",\n};\n\nexport interface HvDashboardNodeClasses\n extends ExtractNames<typeof useClasses>,\n HvFlowNodeClasses {}\n\nexport interface HvDashboardNodeProps\n extends HvFlowNodeProps,\n Pick<HvDialogProps, \"open\" | \"onClose\">,\n Pick<HvDashboardProps, \"layout\"> {\n classes?: HvDashboardNodeClasses;\n labels?: typeof DEFAULT_LABELS;\n previewItems?: React.ReactNode;\n onApply?: () => void;\n onCancel?: () => void;\n\n dashboardProps?: Omit<HvDashboardProps, \"children\">;\n dialogProps?: HvDialogProps;\n}\n\nexport const HvDashboardNode = (props: HvDashboardNodeProps) => {\n const {\n id,\n open,\n layout,\n labels: labelsProp,\n classes: classesProp,\n previewItems,\n children,\n dialogProps,\n dashboardProps,\n onApply,\n onCancel,\n onClose,\n ...others\n } = props;\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n const { classes } = useClasses(classesProp);\n\n return (\n <HvFlowNode id={id} classes={classes as any} {...others}>\n <div className={classes.actions}>{children}</div>\n <HvDialog\n open={open}\n maxWidth=\"lg\"\n fullWidth\n onClose={onClose}\n {...dialogProps}\n >\n <HvDialogTitle variant=\"info\">{labels?.dialogTitle}</HvDialogTitle>\n <HvDialogContent indentContent>\n {labels?.dialogSubtitle}\n {layout && layout?.length > 0 ? (\n <HvDashboard\n cols={12}\n layout={layout}\n compactType=\"vertical\"\n rowHeight={80}\n margin={[16, 16]}\n containerPadding={[0, 16]}\n {...dashboardProps}\n >\n {previewItems}\n </HvDashboard>\n ) : (\n <HvEmptyState\n className={classes.empty}\n icon={<Info role=\"none\" />}\n message={labels?.emptyMessage}\n />\n )}\n </HvDialogContent>\n <HvDialogActions>\n <HvButton variant=\"primary\" onClick={onApply}>\n {labels?.dialogApply}\n </HvButton>\n <HvButton variant=\"secondarySubtle\" onClick={onCancel}>\n {labels?.dialogCancel}\n </HvButton>\n </HvDialogActions>\n </HvDialog>\n </HvFlowNode>\n );\n};\n"],"names":[],"mappings":";;;;;AAkBA,MAAM,EAAE,eAAe,eAAe,cAAc,mBAAmB;AAAA,EACrE,SAAS;AAAA,IACP,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,SAAS,MAAM,MAAM;AAAA,EACvB;AAAA,EACA,OAAO;AAAA,IACL,SAAS,MAAM,QAAQ,MAAM,GAAG,GAAG,CAAC;AAAA,EACtC;AACF,CAAC;AAID,MAAM,iBAAiB;AAAA,EACrB,OAAO;AAAA,EACP,aAAa;AAAA,EACb,cAAc;AAAA,EACd,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,aAAa;AAAA,EACb,cAAc;AAChB;AAoBa,MAAA,kBAAkB,CAAC,UAAgC;AACxD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACD,IAAA;AACE,QAAA,SAAS,UAAU,gBAAgB,UAAU;AACnD,QAAM,EAAE,QAAA,IAAY,WAAW,WAAW;AAE1C,SACG,qBAAA,YAAA,EAAW,IAAQ,SAA0B,GAAG,QAC/C,UAAA;AAAA,IAAA,oBAAC,OAAI,EAAA,WAAW,QAAQ,SAAU,UAAS;AAAA,IAC3C;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,UAAS;AAAA,QACT,WAAS;AAAA,QACT;AAAA,QACC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAA,oBAAC,eAAc,EAAA,SAAQ,QAAQ,UAAA,QAAQ,aAAY;AAAA,UACnD,qBAAC,iBAAgB,EAAA,eAAa,MAC3B,UAAA;AAAA,YAAQ,QAAA;AAAA,YACR,UAAU,QAAQ,SAAS,IAC1B;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,MAAM;AAAA,gBACN;AAAA,gBACA,aAAY;AAAA,gBACZ,WAAW;AAAA,gBACX,QAAQ,CAAC,IAAI,EAAE;AAAA,gBACf,kBAAkB,CAAC,GAAG,EAAE;AAAA,gBACvB,GAAG;AAAA,gBAEH,UAAA;AAAA,cAAA;AAAA,YAAA,IAGH;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAW,QAAQ;AAAA,gBACnB,MAAM,oBAAC,MAAK,EAAA,MAAK,OAAO,CAAA;AAAA,gBACxB,SAAS,QAAQ;AAAA,cAAA;AAAA,YACnB;AAAA,UAAA,GAEJ;AAAA,+BACC,iBACC,EAAA,UAAA;AAAA,YAAA,oBAAC,YAAS,SAAQ,WAAU,SAAS,SAClC,kBAAQ,aACX;AAAA,gCACC,UAAS,EAAA,SAAQ,mBAAkB,SAAS,UAC1C,kBAAQ,cACX;AAAA,UAAA,GACF;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;"}
@@ -1,7 +1,7 @@
1
1
  import { jsxs, jsx } from "@emotion/react/jsx-runtime";
2
2
  import { useTheme } from "@hitachivantara/uikit-react-core";
3
- import { getColor, stepSizes } from "./utils.js";
4
- import { HvStep } from "./Step/Step.js";
3
+ import { getColor, stepSizes } from "./utils.mjs";
4
+ import { HvStep } from "./Step/Step.mjs";
5
5
  const HvDefaultNavigation = ({
6
6
  numSteps,
7
7
  stepSize,
@@ -54,4 +54,4 @@ const HvDefaultNavigation = ({
54
54
  export {
55
55
  HvDefaultNavigation
56
56
  };
57
- //# sourceMappingURL=DefaultNavigation.js.map
57
+ //# sourceMappingURL=DefaultNavigation.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DefaultNavigation.mjs","sources":["../../../../src/StepNavigation/DefaultNavigation/DefaultNavigation.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { HvStep, HvStepProps } from \"./Step\";\nimport { getColor, stepSizes } from \"./utils\";\n\nexport type ComponentChildProps = {\n stepsWidth: number;\n navWidth: number;\n separatorValues: {\n minWidth: number;\n maxWidth: number;\n getColor: (state: HvStepProps[\"state\"], activeTheme: HvTheme) => any;\n height: number;\n };\n stepValues: {\n minSize: number;\n maxSize: number;\n StepComponent: React.ComponentType<HvStepProps>;\n };\n};\n\nexport interface HvDefaultNavigationProps\n extends Omit<HvBaseProps, \"children\"> {\n /** Number of steps to show on the component. */\n numSteps: number;\n /** Sets one of the standard sizes of the steps. */\n stepSize: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Returns a `ReactNode` of the titles container. */\n getTitles: (\n getTitleProps?: (params: {\n state: HvStepProps[\"state\"];\n rawTitle: string;\n number: number;\n }) => { variant?: string; title?: string }\n ) => ReactNode;\n /** Returns dynamic width values of the component (width, titleWidth, separatorWidth). */\n getDynamicValues: (stepsWidth: number) => {\n width: number;\n titleWidth: number;\n separatorWidth: number;\n };\n /** Component to render Step Navigation with props = {separatorValues, stepValues, stepsWidth} */\n children: React.FunctionComponent<ComponentChildProps>;\n}\n\nexport const HvDefaultNavigation = ({\n numSteps,\n stepSize,\n getTitles,\n getDynamicValues,\n className,\n children,\n ...other\n}: HvDefaultNavigationProps) => {\n const { activeTheme } = useTheme();\n\n // step values\n const { container: maxSize, avatar: minSize } = stepSizes[stepSize];\n const StepComponent = HvStep;\n //\n\n const stepsWidth = maxSize + minSize * (numSteps - 1);\n const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);\n\n // separator values\n const maxWidth = Math.max(titleWidth - minSize, separatorWidth);\n const minWidth = Math.max(\n titleWidth - (maxSize + minSize) * 0.5,\n separatorWidth\n );\n //\n\n const Steps = children;\n\n const titles = getTitles(({ state }) => ({\n variant: \"label\",\n titleWidth,\n titleDisabled: state === \"Disabled\",\n }));\n\n return (\n <div {...other}>\n <Steps\n {...{\n stepsWidth,\n navWidth: width,\n separatorValues: {\n minWidth,\n maxWidth,\n getColor,\n height: activeTheme?.stepNavigation.defaultSeparatorHeight || 0,\n },\n stepValues: {\n minSize,\n maxSize,\n StepComponent,\n },\n }}\n />\n {titles}\n </div>\n );\n};\n"],"names":[],"mappings":";;;;AAkDO,MAAM,sBAAsB,CAAC;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAgC;AACxB,QAAA,EAAE,gBAAgB;AAGxB,QAAM,EAAE,WAAW,SAAS,QAAQ,YAAY,UAAU,QAAQ;AAClE,QAAM,gBAAgB;AAGhB,QAAA,aAAa,UAAU,WAAW,WAAW;AACnD,QAAM,EAAE,OAAO,YAAY,eAAe,IAAI,iBAAiB,UAAU;AAGzE,QAAM,WAAW,KAAK,IAAI,aAAa,SAAS,cAAc;AAC9D,QAAM,WAAW,KAAK;AAAA,IACpB,cAAc,UAAU,WAAW;AAAA,IACnC;AAAA,EAAA;AAIF,QAAM,QAAQ;AAEd,QAAM,SAAS,UAAU,CAAC,EAAE,aAAa;AAAA,IACvC,SAAS;AAAA,IACT;AAAA,IACA,eAAe,UAAU;AAAA,EACzB,EAAA;AAGA,SAAA,qBAAC,OAAK,EAAA,GAAG,OACP,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,UACF;AAAA,UACA,UAAU;AAAA,UACV,iBAAiB;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA,QAAQ,aAAa,eAAe,0BAA0B;AAAA,UAChE;AAAA,UACA,YAAY;AAAA,YACV;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,IACC;AAAA,EACH,EAAA,CAAA;AAEJ;"}
@@ -1,8 +1,8 @@
1
1
  import { jsx } from "@emotion/react/jsx-runtime";
2
2
  import { HourGlass, Level3Bad, Level0Good } from "@hitachivantara/uikit-react-icons";
3
3
  import { HvButton, HvAvatar } from "@hitachivantara/uikit-react-core";
4
- import { getColor, getSemantic } from "../utils.js";
5
- import { useClasses } from "./Step.styles.js";
4
+ import { getColor, getSemantic } from "../utils.mjs";
5
+ import { useClasses } from "./Step.styles.mjs";
6
6
  const HvStep = ({
7
7
  className,
8
8
  classes: classesProp,
@@ -90,4 +90,4 @@ const HvStep = ({
90
90
  export {
91
91
  HvStep
92
92
  };
93
- //# sourceMappingURL=Step.js.map
93
+ //# sourceMappingURL=Step.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Step.mjs","sources":["../../../../../src/StepNavigation/DefaultNavigation/Step/Step.tsx"],"sourcesContent":["import {\n Level0Good,\n Level3Bad,\n HourGlass,\n} from \"@hitachivantara/uikit-react-icons\";\nimport {\n HvAvatarSize,\n HvButtonProps,\n HvBaseProps,\n ExtractNames,\n HvAvatar,\n HvButton,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { getColor, getSemantic } from \"../utils\";\nimport { useClasses } from \"./Step.styles\";\n\ntype HvStepClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvStepProps\n extends Pick<HvButtonProps, \"onClick\">,\n Omit<HvBaseProps, \"onClick\"> {\n /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvStepClasses;\n /** State of the step. Values = {\"Pending\", \"Failed\", \"Completed\", \"Current\", \"Disabled\", \"Enabled\"} */\n state:\n | \"Pending\"\n | \"Failed\"\n | \"Completed\"\n | \"Current\"\n | \"Disabled\"\n | \"Enabled\";\n /** Title of the step. */\n title: string;\n /** Sets one of the standard sizes of the step */\n size?: HvAvatarSize;\n /** Number of the step. */\n number?: number;\n /**\n * Define if a step is disabled/enabled.\n * If this property is not defined and the step is on state \"Disabled\", the step component will be disabled\n */\n disabled?: boolean;\n}\n\n/**\n * Step element of \"Default\" Step Navigation root component\n */\nexport const HvStep = ({\n className,\n classes: classesProp,\n state,\n title,\n onClick,\n disabled,\n size = \"md\",\n number = 1,\n}: HvStepProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const iconSize = {\n xs: \"XS\",\n sm: \"XS\",\n md: \"S\",\n ml: \"M\",\n xl: \"M\",\n }[size];\n\n const squareL = {\n Pending: 16,\n Failed: 24,\n Completed: 24,\n }[state];\n\n const svgSize = {\n xs: squareL - 8,\n sm: squareL,\n md: squareL + 8,\n lg: squareL + 16,\n xl: squareL + 24,\n }[size];\n\n const backgroundColor = getColor(state);\n\n const color = state === \"Pending\" ? \"atmo2\" : undefined;\n const semantic = state !== \"Pending\" ? getSemantic(state) : undefined;\n const status = state === \"Current\" ? \"secondary_60\" : undefined;\n\n const IconComponent = {\n Pending: HourGlass,\n Failed: Level3Bad,\n Completed: Level0Good,\n }[state];\n\n return (\n <div\n className={cx(\n classes.root,\n {\n [classes.notCurrent]: state !== \"Current\",\n },\n className\n )}\n >\n <HvButton\n className={cx(classes.ghost, {\n [classes.ghostDisabled]: state === \"Current\",\n })}\n aria-label={`${title}`}\n icon\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n <HvAvatar\n className={cx(classes.avatar, classes[size])}\n backgroundColor={backgroundColor}\n status={status}\n size={size}\n >\n {IconComponent ? (\n <IconComponent\n color={color}\n semantic={semantic}\n width={svgSize}\n height={svgSize}\n iconSize={iconSize}\n />\n ) : (\n number\n )}\n </HvAvatar>\n </HvButton>\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;AAgDO,MAAM,SAAS,CAAC;AAAA,EACrB;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,SAAS;AACX,MAAmB;AACjB,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,WAAW;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAEN,QAAM,UAAU;AAAA,IACd,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,KAAK;AAEP,QAAM,UAAU;AAAA,IACd,IAAI,UAAU;AAAA,IACd,IAAI;AAAA,IACJ,IAAI,UAAU;AAAA,IACd,IAAI,UAAU;AAAA,IACd,IAAI,UAAU;AAAA,IACd,IAAI;AAEA,QAAA,kBAAkB,SAAS,KAAK;AAEhC,QAAA,QAAQ,UAAU,YAAY,UAAU;AAC9C,QAAM,WAAW,UAAU,YAAY,YAAY,KAAK,IAAI;AACtD,QAAA,SAAS,UAAU,YAAY,iBAAiB;AAEtD,QAAM,gBAAgB;AAAA,IACpB,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,KAAK;AAGL,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,UAAU,GAAG,UAAU;AAAA,QAClC;AAAA,QACA;AAAA,MACF;AAAA,MAEA,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,GAAG,QAAQ,OAAO;AAAA,YAC3B,CAAC,QAAQ,aAAa,GAAG,UAAU;AAAA,UAAA,CACpC;AAAA,UACD,cAAY,GAAG,KAAK;AAAA,UACpB,MAAI;AAAA,UACJ,oBAAoB;AAAA,UACpB,UAAU,YAAY,CAAC,WAAW,UAAU,EAAE,SAAS,KAAK;AAAA,UAC5D;AAAA,UAEA,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,GAAG,QAAQ,QAAQ,QAAQ,IAAI,CAAC;AAAA,cAC3C;AAAA,cACA;AAAA,cACA;AAAA,cAEC,UACC,gBAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC;AAAA,kBACA;AAAA,kBACA,OAAO;AAAA,kBACP,QAAQ;AAAA,kBACR;AAAA,gBAAA;AAAA,cAAA,IAGF;AAAA,YAAA;AAAA,UAEJ;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
@@ -41,4 +41,4 @@ export {
41
41
  staticClasses,
42
42
  useClasses
43
43
  };
44
- //# sourceMappingURL=Step.styles.js.map
44
+ //# sourceMappingURL=Step.styles.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Step.styles.mjs","sources":["../../../../../src/StepNavigation/DefaultNavigation/Step/Step.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvStep\", {\n root: {},\n ghost: {\n \"&:hover\": {\n backgroundColor: \"transparent\",\n },\n \"&$ghostDisabled\": {\n cursor: \"default\",\n },\n \"&$ghostDisabled&:hover\": {\n cursor: \"default\",\n },\n },\n ghostDisabled: {},\n notCurrent: { margin: \"-8px\" },\n xs: {},\n sm: {},\n md: {},\n lg: {},\n xl: {},\n avatar: {\n \"&$xs\": {\n fontSize: \"0.625rem\",\n },\n \"&$sm\": {\n fontSize: \"1rem\",\n },\n \"&$md\": {\n fontSize: \"1.5rem\",\n },\n \"&$lg\": {\n fontSize: \"2rem\",\n },\n \"&$xl\": {\n fontSize: \"2.5rem\",\n },\n },\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,UAAU;AAAA,EACnE,MAAM,CAAC;AAAA,EACP,OAAO;AAAA,IACL,WAAW;AAAA,MACT,iBAAiB;AAAA,IACnB;AAAA,IACA,mBAAmB;AAAA,MACjB,QAAQ;AAAA,IACV;AAAA,IACA,0BAA0B;AAAA,MACxB,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,YAAY,EAAE,QAAQ,OAAO;AAAA,EAC7B,IAAI,CAAC;AAAA,EACL,IAAI,CAAC;AAAA,EACL,IAAI,CAAC;AAAA,EACL,IAAI,CAAC;AAAA,EACL,IAAI,CAAC;AAAA,EACL,QAAQ;AAAA,IACN,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,EACF;AACF,CAAC;"}
@@ -32,4 +32,4 @@ export {
32
32
  getSemantic,
33
33
  stepSizes
34
34
  };
35
- //# sourceMappingURL=utils.js.map
35
+ //# sourceMappingURL=utils.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"utils.mjs","sources":["../../../../src/StepNavigation/DefaultNavigation/utils.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport type { HvStepProps } from \"./Step\";\n\nexport const getColor = (state: HvStepProps[\"state\"]) =>\n ({\n Pending: theme.colors.warning ?? \"warning\",\n Failed: theme.colors.negative ?? \"negative\",\n Completed: theme.colors.positive ?? \"positive\",\n Current: theme.colors.secondary ?? \"secondary\",\n Disabled: theme.colors.secondary_60 ?? \"secondary_60\",\n Enabled: theme.colors.secondary ?? \"secondary\",\n }[state]);\n\nexport const getSemantic = (state: HvStepProps[\"state\"]) =>\n ({\n Pending: \"warning\",\n Failed: \"negative\",\n Completed: \"positive\",\n Current: \"secondary\",\n Disabled: \"secondary_60\",\n Enabled: \"secondary\",\n }[state]);\n\nconst EXTRA_SMALL = { container: 32, avatar: 24 };\nconst SMALL = { container: 40, avatar: 32 };\nconst MEDIUM = { container: 48, avatar: 40 };\nconst LARGE = { container: 60, avatar: 52 };\nconst EXTRA_LARGE = { container: 96, avatar: 88 };\n\nexport const stepSizes = {\n xs: EXTRA_SMALL,\n sm: SMALL,\n md: MEDIUM,\n lg: LARGE,\n xl: EXTRA_LARGE,\n};\n"],"names":[],"mappings":";AAIa,MAAA,WAAW,CAAC,WACtB;AAAA,EACC,SAAS,MAAM,OAAO,WAAW;AAAA,EACjC,QAAQ,MAAM,OAAO,YAAY;AAAA,EACjC,WAAW,MAAM,OAAO,YAAY;AAAA,EACpC,SAAS,MAAM,OAAO,aAAa;AAAA,EACnC,UAAU,MAAM,OAAO,gBAAgB;AAAA,EACvC,SAAS,MAAM,OAAO,aAAa;AACrC,GAAE,KAAK;AAEI,MAAA,cAAc,CAAC,WACzB;AAAA,EACC,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,SAAS;AAAA,EACT,UAAU;AAAA,EACV,SAAS;AACX,GAAE,KAAK;AAET,MAAM,cAAc,EAAE,WAAW,IAAI,QAAQ,GAAG;AAChD,MAAM,QAAQ,EAAE,WAAW,IAAI,QAAQ,GAAG;AAC1C,MAAM,SAAS,EAAE,WAAW,IAAI,QAAQ,GAAG;AAC3C,MAAM,QAAQ,EAAE,WAAW,IAAI,QAAQ,GAAG;AAC1C,MAAM,cAAc,EAAE,WAAW,IAAI,QAAQ,GAAG;AAEzC,MAAM,YAAY;AAAA,EACvB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;"}
@@ -1,8 +1,8 @@
1
1
  import { jsx } from "@emotion/react/jsx-runtime";
2
2
  import { HvButton } from "@hitachivantara/uikit-react-core";
3
- import { getColor, dotSizes } from "../utils.js";
4
- import { useClasses } from "./Dot.styles.js";
5
- import { staticClasses } from "./Dot.styles.js";
3
+ import { getColor, dotSizes } from "../utils.mjs";
4
+ import { useClasses } from "./Dot.styles.mjs";
5
+ import { staticClasses } from "./Dot.styles.mjs";
6
6
  const HvDot = ({
7
7
  classes: classesProp,
8
8
  className,
@@ -46,4 +46,4 @@ export {
46
46
  HvDot,
47
47
  staticClasses as dotClasses
48
48
  };
49
- //# sourceMappingURL=Dot.js.map
49
+ //# sourceMappingURL=Dot.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Dot.mjs","sources":["../../../../../src/StepNavigation/SimpleNavigation/Dot/Dot.tsx"],"sourcesContent":["import {\n ExtractNames,\n HvBaseProps,\n HvButton,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { HvStepProps } from \"../../DefaultNavigation\";\nimport { getColor, dotSizes } from \"../utils\";\nimport { staticClasses, useClasses } from \"./Dot.styles\";\n\nexport { staticClasses as dotClasses };\n\nexport type HvDotClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDotProps\n extends Pick<\n HvStepProps,\n \"size\" | \"title\" | \"state\" | \"onClick\" | \"disabled\"\n >,\n Omit<HvBaseProps, \"title\" | \"onClick\"> {\n /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvDotClasses;\n}\n\nexport const HvDot = ({\n classes: classesProp,\n className,\n state,\n title,\n size = \"sm\",\n onClick,\n disabled,\n}: HvDotProps) => {\n const { classes, cx, css } = useClasses(classesProp);\n\n const dotSize = dotSizes[size] * (state === \"Current\" ? 1.5 : 1);\n\n return (\n <HvButton\n className={cx(\n css({\n backgroundColor: getColor(state),\n width: dotSize,\n height: dotSize,\n \"&:hover, &:disabled\": {\n backgroundColor: getColor(state),\n },\n }),\n classes.root,\n {\n [classes.active]: state === \"Current\",\n [classes.ghostDisabled]:\n disabled ?? [\"Current\", \"Disabled\"].includes(state),\n },\n className\n )}\n aria-label={`${title}`}\n icon\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n {[]}\n </HvButton>\n );\n};\n"],"names":[],"mappings":";;;;;AAwBO,MAAM,QAAQ,CAAC;AAAA,EACpB,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AACF,MAAkB;AAChB,QAAM,EAAE,SAAS,IAAI,IAAI,IAAI,WAAW,WAAW;AAEnD,QAAM,UAAU,SAAS,IAAI,KAAK,UAAU,YAAY,MAAM;AAG5D,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,IAAI;AAAA,UACF,iBAAiB,SAAS,KAAK;AAAA,UAC/B,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,uBAAuB;AAAA,YACrB,iBAAiB,SAAS,KAAK;AAAA,UACjC;AAAA,QAAA,CACD;AAAA,QACD,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,MAAM,GAAG,UAAU;AAAA,UAC5B,CAAC,QAAQ,aAAa,GACpB,YAAY,CAAC,WAAW,UAAU,EAAE,SAAS,KAAK;AAAA,QACtD;AAAA,QACA;AAAA,MACF;AAAA,MACA,cAAY,GAAG,KAAK;AAAA,MACpB,MAAI;AAAA,MACJ,oBAAoB;AAAA,MACpB,UAAU,YAAY,CAAC,WAAW,UAAU,EAAE,SAAS,KAAK;AAAA,MAC5D;AAAA,MAEC,UAAC,CAAA;AAAA,IAAA;AAAA,EAAA;AAGR;"}
@@ -8,4 +8,4 @@ export {
8
8
  staticClasses,
9
9
  useClasses
10
10
  };
11
- //# sourceMappingURL=Dot.styles.js.map
11
+ //# sourceMappingURL=Dot.styles.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Dot.styles.mjs","sources":["../../../../../src/StepNavigation/SimpleNavigation/Dot/Dot.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvDot\", {\n root: { borderRadius: \"50%\", zIndex: 1 },\n active: {},\n ghostDisabled: {},\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,SAAS;AAAA,EAClE,MAAM,EAAE,cAAc,OAAO,QAAQ,EAAE;AAAA,EACvC,QAAQ,CAAC;AAAA,EACT,eAAe,CAAC;AAClB,CAAC;"}
@@ -1,7 +1,7 @@
1
1
  import { jsxs, jsx } from "@emotion/react/jsx-runtime";
2
2
  import { useTheme } from "@hitachivantara/uikit-react-core";
3
- import { getColor, dotSizes } from "./utils.js";
4
- import { HvDot } from "./Dot/Dot.js";
3
+ import { getColor, dotSizes } from "./utils.mjs";
4
+ import { HvDot } from "./Dot/Dot.mjs";
5
5
  const HvSimpleNavigation = ({
6
6
  numSteps,
7
7
  stepSize = "sm",
@@ -50,4 +50,4 @@ const HvSimpleNavigation = ({
50
50
  export {
51
51
  HvSimpleNavigation
52
52
  };
53
- //# sourceMappingURL=SimpleNavigation.js.map
53
+ //# sourceMappingURL=SimpleNavigation.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SimpleNavigation.mjs","sources":["../../../../src/StepNavigation/SimpleNavigation/SimpleNavigation.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { HvDot, HvDotProps } from \"./Dot\";\nimport { getColor, dotSizes } from \"./utils\";\n\nexport type ComponentChildProps = {\n stepsWidth: number;\n navWidth: number;\n separatorValues: {\n minWidth: number;\n maxWidth: number;\n getColor: (state: HvDotProps[\"state\"], activeTheme: HvTheme) => any;\n height: number;\n };\n stepValues: {\n minSize: number;\n maxSize: number;\n StepComponent: React.ComponentType<HvDotProps>;\n };\n};\n\nexport interface HvSimpleNavigationProps extends Omit<HvBaseProps, \"children\"> {\n /** Sets one of the standard sizes of the steps. */\n stepSize?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Number of steps to show on the component. */\n numSteps: number;\n /** Returns a `ReactNode` of the titles container. */\n getTitles: (\n getTitleProps?: (params: {\n state: HvDotProps[\"state\"];\n rawTitle: string;\n number: number;\n }) => { variant: string; title: string }\n ) => ReactNode;\n /** Returns dynamic width values of the component (width, titleWidth, separatorWidth). */\n getDynamicValues: (stepsWidth: number) => {\n width: number;\n titleWidth: number;\n separatorWidth: number;\n };\n /** Component to render Step Navigation with props = {separatorValues, stepValues, stepsWidth} */\n children: React.FunctionComponent<ComponentChildProps>;\n}\n\nexport const HvSimpleNavigation = ({\n numSteps,\n stepSize = \"sm\",\n getTitles,\n getDynamicValues,\n children,\n ...others\n}: HvSimpleNavigationProps) => {\n const { activeTheme } = useTheme();\n\n // step values\n const dotSize = dotSizes[stepSize];\n const StepComponent = HvDot;\n //\n\n const stepsWidth = (numSteps + 0.5) * dotSize;\n const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);\n\n // separator values\n const maxWidth = Math.max(titleWidth - dotSize, separatorWidth);\n const minWidth = Math.max(titleWidth - dotSize * 1.25, separatorWidth);\n //\n\n const Steps = children;\n\n const titles = getTitles(({ rawTitle, number }) => ({\n variant: \"label\",\n title: `${number}. ${rawTitle}`,\n titleWidth,\n }));\n\n return (\n <div {...others}>\n {titles}\n <Steps\n {...{\n stepsWidth,\n navWidth: width,\n separatorValues: {\n minWidth,\n maxWidth,\n getColor,\n height: activeTheme?.stepNavigation.simpleSeparatorHeight || 0,\n },\n stepValues: {\n minSize: dotSize,\n maxSize: 1.5 * dotSize,\n StepComponent,\n },\n }}\n />\n </div>\n );\n};\n"],"names":[],"mappings":";;;;AAiDO,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA+B;AACvB,QAAA,EAAE,gBAAgB;AAGlB,QAAA,UAAU,SAAS,QAAQ;AACjC,QAAM,gBAAgB;AAGhB,QAAA,cAAc,WAAW,OAAO;AACtC,QAAM,EAAE,OAAO,YAAY,eAAe,IAAI,iBAAiB,UAAU;AAGzE,QAAM,WAAW,KAAK,IAAI,aAAa,SAAS,cAAc;AAC9D,QAAM,WAAW,KAAK,IAAI,aAAa,UAAU,MAAM,cAAc;AAGrE,QAAM,QAAQ;AAEd,QAAM,SAAS,UAAU,CAAC,EAAE,UAAU,cAAc;AAAA,IAClD,SAAS;AAAA,IACT,OAAO,GAAG,MAAM,KAAK,QAAQ;AAAA,IAC7B;AAAA,EACA,EAAA;AAGA,SAAA,qBAAC,OAAK,EAAA,GAAG,QACN,UAAA;AAAA,IAAA;AAAA,IACD;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,UACF;AAAA,UACA,UAAU;AAAA,UACV,iBAAiB;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA,QAAQ,aAAa,eAAe,yBAAyB;AAAA,UAC/D;AAAA,UACA,YAAY;AAAA,YACV,SAAS;AAAA,YACT,SAAS,MAAM;AAAA,YACf;AAAA,UACF;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;"}
@@ -11,4 +11,4 @@ export {
11
11
  dotSizes,
12
12
  getColor
13
13
  };
14
- //# sourceMappingURL=utils.js.map
14
+ //# sourceMappingURL=utils.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"utils.mjs","sources":["../../../../src/StepNavigation/SimpleNavigation/utils.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvStepProps } from \"../DefaultNavigation\";\n\nexport const dotSizes = {\n xs: 8,\n sm: 10,\n md: 12,\n lg: 14,\n xl: 16,\n};\n\nexport const getColor = (state: HvStepProps[\"state\"]) =>\n state === \"Disabled\" ? theme.colors.secondary_60 : theme.colors.secondary;\n"],"names":[],"mappings":";AAIO,MAAM,WAAW;AAAA,EACtB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEa,MAAA,WAAW,CAAC,UACvB,UAAU,aAAa,MAAM,OAAO,eAAe,MAAM,OAAO;"}
@@ -2,11 +2,11 @@ import { jsx } from "@emotion/react/jsx-runtime";
2
2
  import styled from "@emotion/styled";
3
3
  import { theme } from "@hitachivantara/uikit-styles";
4
4
  import { useTheme, useWidth, HvBox, HvTooltip, HvTypography } from "@hitachivantara/uikit-react-core";
5
- import { TITLE_WIDTH, TITLE_MARGIN, SEPARATOR_WIDTH } from "./utils.js";
6
- import { useClasses } from "./StepNavigation.styles.js";
7
- import { staticClasses } from "./StepNavigation.styles.js";
8
- import { HvDefaultNavigation } from "./DefaultNavigation/DefaultNavigation.js";
9
- import { HvSimpleNavigation } from "./SimpleNavigation/SimpleNavigation.js";
5
+ import { TITLE_WIDTH, TITLE_MARGIN, SEPARATOR_WIDTH } from "./utils.mjs";
6
+ import { useClasses } from "./StepNavigation.styles.mjs";
7
+ import { staticClasses } from "./StepNavigation.styles.mjs";
8
+ import { HvDefaultNavigation } from "./DefaultNavigation/DefaultNavigation.mjs";
9
+ import { HvSimpleNavigation } from "./SimpleNavigation/SimpleNavigation.mjs";
10
10
  const HvStepNavigation = ({
11
11
  className,
12
12
  classes: classesProp,
@@ -186,4 +186,4 @@ export {
186
186
  HvStepNavigation,
187
187
  staticClasses as stepNavigationClasses
188
188
  };
189
- //# sourceMappingURL=StepNavigation.js.map
189
+ //# sourceMappingURL=StepNavigation.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"StepNavigation.mjs","sources":["../../../src/StepNavigation/StepNavigation.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport styled from \"@emotion/styled\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport {\n HvBaseProps,\n HvBreakpoints,\n useTheme,\n useWidth,\n HvBox,\n HvTooltip,\n HvTypography,\n ExtractNames,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport {\n HvDefaultNavigation,\n HvDefaultNavigationProps,\n HvStepProps,\n} from \"./DefaultNavigation\";\nimport { HvSimpleNavigation } from \"./SimpleNavigation\";\nimport { SEPARATOR_WIDTH, TITLE_MARGIN, TITLE_WIDTH } from \"./utils\";\nimport { staticClasses, useClasses } from \"./StepNavigation.styles\";\n\nexport { staticClasses as stepNavigationClasses };\n\nexport type HvStepNavigationClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvStepNavigationProps extends HvBaseProps {\n /** Type of step navigation. Values = {\"Simple\", \"Default\"} */\n type?: \"Simple\" | \"Default\";\n /** Steps to show on the component. */\n steps: Array<\n Pick<\n HvStepProps,\n \"state\" | \"title\" | \"onClick\" | \"className\" | \"disabled\"\n > & {\n /** Class names to override styles on the separator component after the step. */\n separatorClassName?: string;\n /** Class names to override styles on the title component above the step. */\n titleClassName?: string;\n }\n >;\n /** Sets one of the standard sizes of the steps. */\n stepSize?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Width of the component element on each breakpoint screen resolution. */\n width?: { [breakpoint in HvBreakpoints]?: number };\n /** Defines either show a title or only a tooltip on each step component. */\n showTitles?: boolean;\n /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvStepNavigationClasses;\n}\n\n/**\n * Navigation page with steps.\n *\n * You need to define the <b>steps<b/> displayed on the component so that itself can be drawn on the UI.\n * On each step, you need to define a <b>state</b> - 'Pending', 'Failed', 'Completed', 'Current', 'Disabled' -\n * and a <b>title</b> to be shown as a tooltip or a text above of the step. You can also:\n * * Define a <b>className</b> on each step element;\n * * Define a <b>separatorClassName</b> to specify a className for the separator element. The default height\n * values of the separator element are 2px/3px on 'Simple'/'Default' layouts respectively;\n * * Define a <b>titleClassName</b> to specify a className for the title above each step element.\n *\n * For the root element, you can:\n * * Define a <b>className</b>;\n * * Choose a <b>type</b> of layout: 'Simple' or 'Default';\n * * Choose the <b>stepSize</b> of the step component: \"xs\", \"sm\", \"md\", \"lg\", \"xl\". The default size will be\n * correspondent to the current media breakpoint;\n * * Choose either you want to <b>showTitles</b> near to each step component or a tooltip on hover;\n * * Define a <b>width</b> of the component. If you don't define any value and the step component has no title\n * displayed above, the width of the separator element will be 100px.\n * If the step component has titles, each one will have 215px of width by default.\n */\nexport const HvStepNavigation = ({\n className,\n classes: classesProp,\n width,\n steps,\n stepSize,\n showTitles,\n type = \"Default\",\n \"aria-label\": ariaLabel,\n ...others\n}: HvStepNavigationProps) => {\n const { classes, css, cx } = useClasses(classesProp);\n\n const { activeTheme } = useTheme();\n\n // current breakpoint 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n const breakpoint = useWidth();\n // step configurations\n const stepSizeKey =\n stepSize ?? ([\"xs\", \"sm\"].includes(breakpoint) ? \"sm\" : \"md\");\n const hasTitles = showTitles ?? ![\"xs\", \"sm\"].includes(breakpoint);\n\n const styledLi = (containerSize) =>\n styled(\"li\")({\n width: containerSize,\n height: containerSize,\n });\n\n const styledDiv = (containerSize) =>\n styled(\"div\")({\n width: containerSize,\n height: containerSize,\n });\n\n const styledSeparatorElement = (\n title,\n separatorClassName,\n separatorHeight,\n separatorWidth,\n backgroundColor\n ) => {\n const widthValue =\n separatorWidth -\n 2 *\n Number(\n (activeTheme?.stepNavigation.separatorMargin || \"0px\").replace(\n \"px\",\n \"\"\n )\n );\n\n return (\n <li\n aria-hidden\n key={`separator-${title}`}\n className={cx(\n css({\n height: separatorHeight,\n width: widthValue,\n backgroundColor,\n margin: `0 ${theme.stepNavigation.separatorMargin}`,\n }),\n classes.separator\n )}\n >\n <div className={separatorClassName} />\n </li>\n );\n };\n\n const drawItems = ({\n separatorValues: { minWidth, maxWidth, getColor, height },\n stepValues: { minSize, maxSize, StepComponent },\n }: any) => {\n const items = steps.reduce<ReactNode[]>(\n (acc, { state, title, separatorClassName, ...props }, index): any => {\n const containerSize = state === \"Current\" ? maxSize : minSize;\n const StepContainer = styledLi(containerSize);\n const Step = styledDiv(Math.max(containerSize, 30));\n const stepProps = {\n ...{\n size: stepSizeKey,\n state,\n title,\n number: index + 1,\n ...props,\n },\n };\n const stepElement = (\n <StepContainer key={`step-${title}`} className={classes.li}>\n {hasTitles ? (\n <StepComponent\n key={`step-${title}`}\n aria-label={`${title}`}\n {...stepProps}\n />\n ) : (\n <HvTooltip\n placement=\"bottom\"\n title={<HvTypography>{`${index + 1}. ${title}`}</HvTypography>}\n >\n <div>\n <Step className={classes.li}>\n <StepComponent aria-label={`${title}`} {...stepProps} />\n </Step>\n </div>\n </HvTooltip>\n )}\n </StepContainer>\n );\n if (index < steps.length - 1) {\n const separatorElement = styledSeparatorElement(\n title,\n separatorClassName,\n height,\n [steps[index + 1].state, state].includes(\"Current\")\n ? minWidth\n : maxWidth,\n getColor(\n steps[index + 1].state === \"Disabled\" ? \"Disabled\" : state,\n theme\n )\n );\n return [...acc, stepElement, separatorElement];\n }\n return [...acc, stepElement];\n },\n []\n );\n\n return <ol className={classes.ol}>{items}</ol>;\n };\n\n const getDynamicValues: HvDefaultNavigationProps[\"getDynamicValues\"] = (\n stepsWidth\n ) => {\n const themeBreakpoints = activeTheme?.breakpoints.values || {};\n const maxWidth =\n width?.[breakpoint] ??\n Math.max(\n Number(hasTitles) * (TITLE_WIDTH + TITLE_MARGIN) * steps.length -\n TITLE_MARGIN,\n SEPARATOR_WIDTH * (steps.length - 1) + stepsWidth\n );\n const next = Object.keys(themeBreakpoints).find((_, index, self) =>\n index - 1 >= 0 ? self[index - 1] === breakpoint : false\n );\n const navWidth = Math.min(\n maxWidth,\n next ? themeBreakpoints[next] : maxWidth\n );\n const titleWidth =\n Number(hasTitles) * Math.ceil((navWidth + TITLE_MARGIN) / steps.length);\n const separatorWidth =\n Number(!hasTitles) *\n Math.ceil((navWidth - stepsWidth) / (steps.length - 1));\n return { width: navWidth, titleWidth, separatorWidth };\n };\n\n const getTitles = (getTitleProps) =>\n hasTitles ? (\n <div className={classes.titles}>\n {steps.map(({ title: rawTitle, state, titleClassName }, index) => {\n const {\n variant = \"label\",\n title = rawTitle,\n titleWidth = 0,\n titleDisabled = false,\n } = getTitleProps({\n state,\n rawTitle,\n number: index + 1,\n });\n\n return (\n <HvTypography\n variant={variant}\n className={cx(\n css({\n textAlign: \"center\",\n width: titleWidth - TITLE_MARGIN,\n marginRight: TITLE_MARGIN,\n }),\n titleClassName\n )}\n disabled={titleDisabled}\n key={title}\n >\n {title}\n </HvTypography>\n );\n })}\n </div>\n ) : null;\n\n const StepNavigation = {\n Default: HvDefaultNavigation,\n Simple: HvSimpleNavigation,\n }[type];\n\n return (\n <StepNavigation\n numSteps={steps.length}\n stepSize={stepSizeKey}\n getTitles={getTitles}\n getDynamicValues={getDynamicValues}\n className={cx(classes.root, className)}\n {...others}\n >\n {({ stepsWidth, navWidth, ...itemsProps }) => (\n <HvBox\n component=\"nav\"\n style={{\n width: `${navWidth}px`,\n margin: 0,\n }}\n aria-label={ariaLabel}\n >\n {drawItems(itemsProps)}\n </HvBox>\n )}\n </StepNavigation>\n );\n};\n"],"names":[],"mappings":"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"}
@@ -32,4 +32,4 @@ export {
32
32
  staticClasses,
33
33
  useClasses
34
34
  };
35
- //# sourceMappingURL=StepNavigation.styles.js.map
35
+ //# sourceMappingURL=StepNavigation.styles.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"StepNavigation.styles.mjs","sources":["../../../src/StepNavigation/StepNavigation.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvStepNavigation\", {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n },\n titles: {\n marginTop: 8,\n display: \"flex\",\n },\n ol: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n flexWrap: \"wrap\",\n padding: 0,\n listStyle: \"none\",\n },\n li: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n separator: {\n userSelect: \"none\",\n \"& > div\": {\n display: \"flex\",\n },\n },\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,oBAAoB;AAAA,EAC7E,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,eAAe;AAAA,EACjB;AAAA,EACA,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,SAAS;AAAA,EACX;AAAA,EACA,IAAI;AAAA,IACF,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,UAAU;AAAA,IACV,SAAS;AAAA,IACT,WAAW;AAAA,EACb;AAAA,EACA,IAAI;AAAA,IACF,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,EAClB;AAAA,EACA,WAAW;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,MACT,SAAS;AAAA,IACX;AAAA,EACF;AACF,CAAC;"}
@@ -6,4 +6,4 @@ export {
6
6
  TITLE_MARGIN,
7
7
  TITLE_WIDTH
8
8
  };
9
- //# sourceMappingURL=utils.js.map
9
+ //# sourceMappingURL=utils.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"utils.mjs","sources":["../../../src/StepNavigation/utils.ts"],"sourcesContent":["const TITLE_MARGIN = 20;\nconst TITLE_WIDTH = 215;\nconst STEP_MARGIN = 20;\nconst SEPARATOR_WIDTH = 100;\n\nexport { STEP_MARGIN, TITLE_MARGIN, TITLE_WIDTH, SEPARATOR_WIDTH };\n"],"names":[],"mappings":"AAAA,MAAM,eAAe;AACrB,MAAM,cAAc;AAEpB,MAAM,kBAAkB;"}
@@ -1,12 +1,12 @@
1
1
  import { jsx, jsxs } from "@emotion/react/jsx-runtime";
2
2
  import { useState, useCallback, useEffect, useMemo } from "react";
3
- import { useClasses } from "./Wizard.styles.js";
4
- import { staticClasses } from "./Wizard.styles.js";
5
- import HvWizardContext from "./WizardContext/WizardContext.js";
6
- import { HvWizardContainer } from "./WizardContainer/WizardContainer.js";
7
- import { HvWizardTitle } from "./WizardTitle/WizardTitle.js";
8
- import { HvWizardContent } from "./WizardContent/WizardContent.js";
9
- import { HvWizardActions } from "./WizardActions/WizardActions.js";
3
+ import { useClasses } from "./Wizard.styles.mjs";
4
+ import { staticClasses } from "./Wizard.styles.mjs";
5
+ import HvWizardContext from "./WizardContext/WizardContext.mjs";
6
+ import { HvWizardContainer } from "./WizardContainer/WizardContainer.mjs";
7
+ import { HvWizardTitle } from "./WizardTitle/WizardTitle.mjs";
8
+ import { HvWizardContent } from "./WizardContent/WizardContent.mjs";
9
+ import { HvWizardActions } from "./WizardActions/WizardActions.mjs";
10
10
  const HvWizard = ({
11
11
  className,
12
12
  children,
@@ -111,4 +111,4 @@ export {
111
111
  HvWizard,
112
112
  staticClasses as wizardClasses
113
113
  };
114
- //# sourceMappingURL=Wizard.js.map
114
+ //# sourceMappingURL=Wizard.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Wizard.mjs","sources":["../../../src/Wizard/Wizard.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\n\nimport {\n ExtractNames,\n HvBaseProps,\n HvDialogProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { ModalProps } from \"@mui/material/Modal\";\n\nimport { HvStepNavigationProps } from \"../StepNavigation\";\nimport { HvWizardContent } from \"./WizardContent\";\nimport { HvWizardContext, HvWizardTabs } from \"./WizardContext\";\nimport { HvWizardTitle, HvWizardTitleProps } from \"./WizardTitle\";\nimport { HvWizardActions, HvWizardActionsProps } from \"./WizardActions\";\nimport { HvWizardContainer } from \"./WizardContainer\";\n\nimport { staticClasses, useClasses } from \"./Wizard.styles\";\n\nexport { staticClasses as wizardClasses };\n\nexport type HvWizardClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvWizardProps\n extends HvBaseProps,\n Pick<HvDialogProps, \"maxWidth\" | \"fullWidth\"> {\n /** Current state of the Wizard. */\n open: boolean;\n /** Function executed on close. */\n onClose: ModalProps[\"onClose\"];\n /** Function executed on submit. */\n handleSubmit: (context: HvWizardTabs) => void;\n /** Title for the wizard. */\n title?: string;\n /** An object containing all the labels for the wizard. */\n labels?: HvWizardActionsProps[\"labels\"] & HvWizardTitleProps[\"labels\"];\n /** Shows the summary button. */\n hasSummary?: boolean;\n /** The content of the summary. */\n summaryContent?: React.ReactNode;\n /** Enables the skip button. */\n skippable?: boolean;\n /** Forces minimum height to the component. */\n fixedHeight?: boolean;\n /** Whether the loading animation is shown. */\n loading?: boolean;\n /** Custom object to define type, size and width of the StepNavigation component */\n customStep?: Pick<HvStepNavigationProps, \"type\" | \"stepSize\" | \"width\">;\n /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n classes?: HvWizardClasses;\n}\n\nexport const HvWizard = ({\n className,\n children,\n onClose,\n handleSubmit,\n title,\n open,\n skippable = true,\n loading = false,\n hasSummary = false,\n summaryContent,\n labels = {\n cancel: \"Cancel\",\n next: \"Next\",\n previous: \"Previous\",\n skip: \"Skip\",\n submit: \"Submit\",\n summary: \"Summary\",\n },\n fixedHeight = false,\n customStep,\n classes: classesProp,\n ...others\n}: HvWizardProps) => {\n const { classes } = useClasses(classesProp);\n\n const [context, setContext] = useState<HvWizardTabs>({});\n const [summary, setSummary] = useState(false);\n const [tab, setTab] = useState(0);\n\n const handleClose = useCallback(\n (evt, reason) => {\n if (reason !== \"backdropClick\") {\n onClose?.(evt, reason);\n }\n },\n [onClose]\n );\n\n // on unmount\n useEffect(() => {\n return () => {\n if (!open) {\n setContext((c) =>\n Object.entries(c).reduce(\n (acc, [key, child]) => ({\n ...acc,\n [+key]: {\n ...child,\n touched: false,\n },\n }),\n {} as HvWizardTabs\n )\n );\n setTab(0);\n }\n };\n }, [open]);\n\n const value = useMemo(\n () => ({ context, setContext, summary, setSummary, tab, setTab }),\n [context, setContext, summary, setSummary, tab, setTab]\n );\n\n return (\n <HvWizardContext.Provider value={value}>\n <HvWizardContainer\n className={className}\n classes={{ root: classes.root }}\n handleClose={handleClose}\n open={open}\n {...others}\n >\n <HvWizardTitle\n title={title}\n hasSummary={hasSummary}\n labels={labels}\n customStep={customStep}\n />\n <HvWizardContent\n loading={loading}\n fixedHeight={fixedHeight}\n summaryContent={summaryContent}\n >\n {children}\n </HvWizardContent>\n <HvWizardActions\n loading={loading}\n skippable={skippable}\n labels={labels}\n handleClose={handleClose}\n handleSubmit={handleSubmit}\n />\n </HvWizardContainer>\n </HvWizardContext.Provider>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;AAoDO,MAAM,WAAW,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,aAAa;AAAA,EACb;AAAA,EACA,SAAS;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,UAAU;AAAA,IACV,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA,SAAS;AAAA,EACT,GAAG;AACL,MAAqB;AACnB,QAAM,EAAE,QAAA,IAAY,WAAW,WAAW;AAE1C,QAAM,CAAC,SAAS,UAAU,IAAI,SAAuB,CAAE,CAAA;AACvD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,CAAC;AAEhC,QAAM,cAAc;AAAA,IAClB,CAAC,KAAK,WAAW;AACf,UAAI,WAAW,iBAAiB;AAC9B,kBAAU,KAAK,MAAM;AAAA,MACvB;AAAA,IACF;AAAA,IACA,CAAC,OAAO;AAAA,EAAA;AAIV,YAAU,MAAM;AACd,WAAO,MAAM;AACX,UAAI,CAAC,MAAM;AACT;AAAA,UAAW,CAAC,MACV,OAAO,QAAQ,CAAC,EAAE;AAAA,YAChB,CAAC,KAAK,CAAC,KAAK,KAAK,OAAO;AAAA,cACtB,GAAG;AAAA,cACH,CAAC,CAAC,GAAG,GAAG;AAAA,gBACN,GAAG;AAAA,gBACH,SAAS;AAAA,cACX;AAAA,YAAA;AAAA,YAEF,CAAC;AAAA,UACH;AAAA,QAAA;AAEF,eAAO,CAAC;AAAA,MACV;AAAA,IAAA;AAAA,EACF,GACC,CAAC,IAAI,CAAC;AAET,QAAM,QAAQ;AAAA,IACZ,OAAO,EAAE,SAAS,YAAY,SAAS,YAAY,KAAK;IACxD,CAAC,SAAS,YAAY,SAAS,YAAY,KAAK,MAAM;AAAA,EAAA;AAGxD,SACG,oBAAA,gBAAgB,UAAhB,EAAyB,OACxB,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,SAAS,EAAE,MAAM,QAAQ,KAAK;AAAA,MAC9B;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,QACA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YAEC;AAAA,UAAA;AAAA,QACH;AAAA,QACA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}
@@ -6,4 +6,4 @@ export {
6
6
  staticClasses,
7
7
  useClasses
8
8
  };
9
- //# sourceMappingURL=Wizard.styles.js.map
9
+ //# sourceMappingURL=Wizard.styles.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Wizard.styles.mjs","sources":["../../../src/Wizard/Wizard.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvWizard\", {\n root: {},\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,YAAY;AAAA,EACrE,MAAM,CAAC;AACT,CAAC;"}
@@ -2,9 +2,9 @@ import { jsxs, jsx } from "@emotion/react/jsx-runtime";
2
2
  import { useContext, useState, useEffect, useCallback } from "react";
3
3
  import { HvDialogActions, HvButton } from "@hitachivantara/uikit-react-core";
4
4
  import { Backwards, Forwards } from "@hitachivantara/uikit-react-icons";
5
- import { useClasses } from "./WizardActions.styles.js";
6
- import { staticClasses } from "./WizardActions.styles.js";
7
- import HvWizardContext from "../WizardContext/WizardContext.js";
5
+ import { useClasses } from "./WizardActions.styles.mjs";
6
+ import { staticClasses } from "./WizardActions.styles.mjs";
7
+ import HvWizardContext from "../WizardContext/WizardContext.mjs";
8
8
  const HvWizardActions = ({
9
9
  classes: classesProp,
10
10
  handleClose,
@@ -116,4 +116,4 @@ export {
116
116
  HvWizardActions,
117
117
  staticClasses as wizardActionsClasses
118
118
  };
119
- //# sourceMappingURL=WizardActions.js.map
119
+ //# sourceMappingURL=WizardActions.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"WizardActions.mjs","sources":["../../../../src/Wizard/WizardActions/WizardActions.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useState } from \"react\";\n\nimport {\n ExtractNames,\n HvBaseProps,\n HvButton,\n HvDialogActions,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Backwards, Forwards } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvWizardContext, HvWizardTabs } from \"../WizardContext\";\nimport { staticClasses, useClasses } from \"./WizardActions.styles\";\n\nexport { staticClasses as wizardActionsClasses };\n\nexport type HvWizardActionsClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvWizardActionsProps extends HvBaseProps {\n /** Function to handle the cancel button. */\n handleClose: (\n event: React.SyntheticEvent,\n reason?: \"escapeKeyDown\" | \"backdropClick\"\n ) => void;\n /** Function to handle the submit button. Also sends the current context state. */\n handleSubmit: (context: any) => void;\n /** An object containing all the labels for the wizard actions component. */\n labels?: {\n /** Cancel button label. */\n cancel?: string;\n /** Skip button label. */\n skip?: string;\n /** Previous button label. */\n previous?: string;\n /** Next button label. */\n next?: string;\n /** Submit button label. */\n submit?: string;\n };\n /** Whether the submit button is disabled. */\n loading?: boolean;\n /** Enables the skip button. */\n skippable?: boolean;\n /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n classes?: HvWizardActionsClasses;\n}\n\nexport const HvWizardActions = ({\n classes: classesProp,\n handleClose,\n handleSubmit,\n loading = false,\n skippable = false,\n labels = {\n cancel: \"Cancel\",\n next: \"Next\",\n previous: \"Previous\",\n skip: \"Skip\",\n submit: \"Submit\",\n },\n}: HvWizardActionsProps) => {\n const { classes, css, cx } = useClasses(classesProp);\n\n const { context, setContext, tab, setTab } = useContext(HvWizardContext);\n const [pages, setPages] = useState(0);\n const [canSubmit, setCanSubmit] = useState(false);\n\n useEffect(() => {\n const contextEntries = Object.entries(context);\n if (contextEntries.length) {\n setPages(contextEntries.length);\n\n const validWizard = Object.entries(context).every(\n ([, value]) => value?.valid\n );\n if (validWizard !== canSubmit) {\n setCanSubmit(validWizard);\n }\n }\n }, [context, canSubmit, setCanSubmit, setPages]);\n\n const lastPage = pages - 1;\n const isLastPage = tab >= lastPage;\n\n const handleSkip = useCallback(() => {\n setContext((c) =>\n Object.entries(c).reduce(\n (acc, [key, child]) => ({\n ...acc,\n [+key]: {\n ...child,\n valid: child?.valid !== false,\n },\n }),\n {} as HvWizardTabs\n )\n );\n setTab(lastPage);\n }, [setTab, lastPage, setContext]);\n\n const handleSubmitInternal = useCallback(\n () => handleSubmit(context),\n [handleSubmit, context]\n );\n\n return (\n <HvDialogActions className={classes.actionsContainer}>\n <HvButton\n variant=\"secondaryGhost\"\n onClick={handleClose}\n className={classes.buttonWidth}\n >\n {`${labels.cancel ?? \"Cancel\"}`}\n </HvButton>\n {skippable && (\n <HvButton\n variant=\"secondaryGhost\"\n disabled={isLastPage}\n className={classes.buttonWidth}\n onClick={handleSkip}\n >\n {`${labels.skip ?? \"Skip\"}`}\n </HvButton>\n )}\n <div aria-hidden className={css({ flex: 1 })}>\n &nbsp;\n </div>\n <div className={classes.buttonsContainer}>\n <HvButton\n variant=\"secondaryGhost\"\n className={classes.buttonWidth}\n disabled={tab <= 0}\n onClick={() => setTab((t) => t - 1)}\n startIcon={<Backwards />}\n >\n {`${labels.previous ?? \"Previous\"}`}\n </HvButton>\n {isLastPage ? (\n <HvButton\n variant=\"primary\"\n className={classes.buttonWidth}\n disabled={loading || !canSubmit}\n onClick={handleSubmitInternal}\n >\n {`${labels.submit ?? \"Submit\"}`}\n </HvButton>\n ) : (\n <HvButton\n variant=\"secondaryGhost\"\n className={cx(classes.buttonWidth, classes.buttonSpacing)}\n onClick={() => setTab((t) => t + 1)}\n disabled={!skippable && !context?.[tab]?.valid}\n endIcon={<Forwards />}\n >\n {`${labels.next ?? \"Next\"}`}\n </HvButton>\n )}\n </div>\n </HvDialogActions>\n );\n};\n"],"names":[],"mappings":"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"}