@hitachivantara/uikit-react-lab 5.5.1 → 5.5.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/dist/cjs/components/Flow/Background/Background.cjs +2 -5
  2. package/dist/cjs/components/Flow/Background/Background.cjs.map +1 -1
  3. package/dist/cjs/components/Flow/Controls/Controls.cjs +8 -41
  4. package/dist/cjs/components/Flow/Controls/Controls.cjs.map +1 -1
  5. package/dist/cjs/components/Flow/DroppableFlow.cjs +2 -16
  6. package/dist/cjs/components/Flow/DroppableFlow.cjs.map +1 -1
  7. package/dist/cjs/components/Flow/Flow.cjs +6 -23
  8. package/dist/cjs/components/Flow/Flow.cjs.map +1 -1
  9. package/dist/cjs/components/Flow/FlowContext/FlowContext.cjs +2 -5
  10. package/dist/cjs/components/Flow/FlowContext/FlowContext.cjs.map +1 -1
  11. package/dist/cjs/components/Flow/Minimap/Minimap.cjs +2 -9
  12. package/dist/cjs/components/Flow/Minimap/Minimap.cjs.map +1 -1
  13. package/dist/cjs/components/Flow/Sidebar/Sidebar.cjs +20 -54
  14. package/dist/cjs/components/Flow/Sidebar/Sidebar.cjs.map +1 -1
  15. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroup.cjs +14 -41
  16. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroup.cjs.map +1 -1
  17. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.cjs +2 -10
  18. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.cjs.map +1 -1
  19. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.cjs +7 -13
  20. package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.cjs.map +1 -1
  21. package/dist/cjs/components/StepNavigation/DefaultNavigation/DefaultNavigation.cjs +6 -6
  22. package/dist/cjs/components/StepNavigation/DefaultNavigation/DefaultNavigation.cjs.map +1 -1
  23. package/dist/cjs/components/StepNavigation/DefaultNavigation/Step/Step.cjs +6 -29
  24. package/dist/cjs/components/StepNavigation/DefaultNavigation/Step/Step.cjs.map +1 -1
  25. package/dist/cjs/components/StepNavigation/SimpleNavigation/Dot/Dot.cjs +12 -20
  26. package/dist/cjs/components/StepNavigation/SimpleNavigation/Dot/Dot.cjs.map +1 -1
  27. package/dist/cjs/components/StepNavigation/SimpleNavigation/SimpleNavigation.cjs +6 -6
  28. package/dist/cjs/components/StepNavigation/SimpleNavigation/SimpleNavigation.cjs.map +1 -1
  29. package/dist/cjs/components/StepNavigation/StepNavigation.cjs +37 -87
  30. package/dist/cjs/components/StepNavigation/StepNavigation.cjs.map +1 -1
  31. package/dist/cjs/components/Wizard/Wizard.cjs +8 -30
  32. package/dist/cjs/components/Wizard/Wizard.cjs.map +1 -1
  33. package/dist/cjs/components/Wizard/WizardActions/WizardActions.cjs +12 -45
  34. package/dist/cjs/components/Wizard/WizardActions/WizardActions.cjs.map +1 -1
  35. package/dist/cjs/components/Wizard/WizardContainer/WizardContainer.cjs +5 -13
  36. package/dist/cjs/components/Wizard/WizardContainer/WizardContainer.cjs.map +1 -1
  37. package/dist/cjs/components/Wizard/WizardContent/LoadingContainer.cjs +16 -26
  38. package/dist/cjs/components/Wizard/WizardContent/LoadingContainer.cjs.map +1 -1
  39. package/dist/cjs/components/Wizard/WizardContent/WizardContent.cjs +23 -38
  40. package/dist/cjs/components/Wizard/WizardContent/WizardContent.cjs.map +1 -1
  41. package/dist/cjs/components/Wizard/WizardTitle/WizardTitle.cjs +16 -37
  42. package/dist/cjs/components/Wizard/WizardTitle/WizardTitle.cjs.map +1 -1
  43. package/dist/esm/components/Flow/Background/Background.js +2 -5
  44. package/dist/esm/components/Flow/Background/Background.js.map +1 -1
  45. package/dist/esm/components/Flow/Controls/Controls.js +8 -41
  46. package/dist/esm/components/Flow/Controls/Controls.js.map +1 -1
  47. package/dist/esm/components/Flow/DroppableFlow.js +2 -16
  48. package/dist/esm/components/Flow/DroppableFlow.js.map +1 -1
  49. package/dist/esm/components/Flow/Flow.js +6 -23
  50. package/dist/esm/components/Flow/Flow.js.map +1 -1
  51. package/dist/esm/components/Flow/FlowContext/FlowContext.js +2 -5
  52. package/dist/esm/components/Flow/FlowContext/FlowContext.js.map +1 -1
  53. package/dist/esm/components/Flow/Minimap/Minimap.js +2 -9
  54. package/dist/esm/components/Flow/Minimap/Minimap.js.map +1 -1
  55. package/dist/esm/components/Flow/Sidebar/Sidebar.js +20 -54
  56. package/dist/esm/components/Flow/Sidebar/Sidebar.js.map +1 -1
  57. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroup.js +14 -41
  58. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroup.js.map +1 -1
  59. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.js +2 -10
  60. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.js.map +1 -1
  61. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.js +7 -13
  62. package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.js.map +1 -1
  63. package/dist/esm/components/StepNavigation/DefaultNavigation/DefaultNavigation.js +6 -6
  64. package/dist/esm/components/StepNavigation/DefaultNavigation/DefaultNavigation.js.map +1 -1
  65. package/dist/esm/components/StepNavigation/DefaultNavigation/Step/Step.js +6 -29
  66. package/dist/esm/components/StepNavigation/DefaultNavigation/Step/Step.js.map +1 -1
  67. package/dist/esm/components/StepNavigation/SimpleNavigation/Dot/Dot.js +12 -20
  68. package/dist/esm/components/StepNavigation/SimpleNavigation/Dot/Dot.js.map +1 -1
  69. package/dist/esm/components/StepNavigation/SimpleNavigation/SimpleNavigation.js +6 -6
  70. package/dist/esm/components/StepNavigation/SimpleNavigation/SimpleNavigation.js.map +1 -1
  71. package/dist/esm/components/StepNavigation/StepNavigation.js +37 -87
  72. package/dist/esm/components/StepNavigation/StepNavigation.js.map +1 -1
  73. package/dist/esm/components/Wizard/Wizard.js +8 -30
  74. package/dist/esm/components/Wizard/Wizard.js.map +1 -1
  75. package/dist/esm/components/Wizard/WizardActions/WizardActions.js +12 -45
  76. package/dist/esm/components/Wizard/WizardActions/WizardActions.js.map +1 -1
  77. package/dist/esm/components/Wizard/WizardContainer/WizardContainer.js +5 -13
  78. package/dist/esm/components/Wizard/WizardContainer/WizardContainer.js.map +1 -1
  79. package/dist/esm/components/Wizard/WizardContent/LoadingContainer.js +16 -26
  80. package/dist/esm/components/Wizard/WizardContent/LoadingContainer.js.map +1 -1
  81. package/dist/esm/components/Wizard/WizardContent/WizardContent.js +23 -38
  82. package/dist/esm/components/Wizard/WizardContent/WizardContent.js.map +1 -1
  83. package/dist/esm/components/Wizard/WizardTitle/WizardTitle.js +16 -37
  84. package/dist/esm/components/Wizard/WizardTitle/WizardTitle.js.map +1 -1
  85. package/package.json +4 -4
@@ -1,10 +1,10 @@
1
+ import { jsx } from "@emotion/react/jsx-runtime";
1
2
  import _styled from "@emotion/styled/base";
2
3
  import { theme } from "@hitachivantara/uikit-styles";
3
4
  import { useTheme, useWidth, HvBox, HvTooltip, HvTypography } from "@hitachivantara/uikit-react-core";
4
5
  import { TITLE_WIDTH, TITLE_MARGIN, SEPARATOR_WIDTH } from "./utils.js";
5
6
  import { useClasses } from "./StepNavigation.styles.js";
6
7
  import { staticClasses } from "./StepNavigation.styles.js";
7
- import { jsx } from "@emotion/react/jsx-runtime";
8
8
  import { HvDefaultNavigation } from "./DefaultNavigation/DefaultNavigation.js";
9
9
  import { HvSimpleNavigation } from "./SimpleNavigation/SimpleNavigation.js";
10
10
  const HvStepNavigation = ({
@@ -49,18 +49,12 @@ const HvStepNavigation = ({
49
49
  }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2xhYi9zcmMvY29tcG9uZW50cy9TdGVwTmF2aWdhdGlvbi9TdGVwTmF2aWdhdGlvbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUdJIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2xhYi9zcmMvY29tcG9uZW50cy9TdGVwTmF2aWdhdGlvbi9TdGVwTmF2aWdhdGlvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBSZWFjdE5vZGUgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQge1xuICBIdkJhc2VQcm9wcyxcbiAgSHZCcmVha3BvaW50cyxcbiAgdXNlVGhlbWUsXG4gIHVzZVdpZHRoLFxuICBIdkJveCxcbiAgSHZUb29sdGlwLFxuICBIdlR5cG9ncmFwaHksXG4gIEV4dHJhY3ROYW1lcyxcbn0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1yZWFjdC1jb3JlXCI7XG5cbmltcG9ydCB7XG4gIEh2RGVmYXVsdE5hdmlnYXRpb24sXG4gIEh2RGVmYXVsdE5hdmlnYXRpb25Qcm9wcyxcbiAgSHZTdGVwUHJvcHMsXG59IGZyb20gXCIuL0RlZmF1bHROYXZpZ2F0aW9uXCI7XG5pbXBvcnQgeyBIdlNpbXBsZU5hdmlnYXRpb24gfSBmcm9tIFwiLi9TaW1wbGVOYXZpZ2F0aW9uXCI7XG5pbXBvcnQgeyBTRVBBUkFUT1JfV0lEVEgsIFRJVExFX01BUkdJTiwgVElUTEVfV0lEVEggfSBmcm9tIFwiLi91dGlsc1wiO1xuaW1wb3J0IHsgc3RhdGljQ2xhc3NlcywgdXNlQ2xhc3NlcyB9IGZyb20gXCIuL1N0ZXBOYXZpZ2F0aW9uLnN0eWxlc1wiO1xuXG5leHBvcnQgeyBzdGF0aWNDbGFzc2VzIGFzIHN0ZXBOYXZpZ2F0aW9uQ2xhc3NlcyB9O1xuXG5leHBvcnQgdHlwZSBIdlN0ZXBOYXZpZ2F0aW9uQ2xhc3NlcyA9IEV4dHJhY3ROYW1lczx0eXBlb2YgdXNlQ2xhc3Nlcz47XG5cbmV4cG9ydCBpbnRlcmZhY2UgSHZTdGVwTmF2aWdhdGlvblByb3BzIGV4dGVuZHMgSHZCYXNlUHJvcHMge1xuICAvKiogVHlwZSBvZiBzdGVwIG5hdmlnYXRpb24uIFZhbHVlcyA9IHtcIlNpbXBsZVwiLCBcIkRlZmF1bHRcIn0gKi9cbiAgdHlwZT86IFwiU2ltcGxlXCIgfCBcIkRlZmF1bHRcIjtcbiAgLyoqIFN0ZXBzIHRvIHNob3cgb24gdGhlIGNvbXBvbmVudC4gKi9cbiAgc3RlcHM6IEFycmF5PFxuICAgIFBpY2s8XG4gICAgICBIdlN0ZXBQcm9wcyxcbiAgICAgIFwic3RhdGVcIiB8IFwidGl0bGVcIiB8IFwib25DbGlja1wiIHwgXCJjbGFzc05hbWVcIiB8IFwiZGlzYWJsZWRcIlxuICAgID4gJiB7XG4gICAgICAvKiogQ2xhc3MgbmFtZXMgdG8gb3ZlcnJpZGUgc3R5bGVzIG9uIHRoZSBzZXBhcmF0b3IgY29tcG9uZW50IGFmdGVyIHRoZSBzdGVwLiAqL1xuICAgICAgc2VwYXJhdG9yQ2xhc3NOYW1lPzogc3RyaW5nO1xuICAgICAgLyoqIENsYXNzIG5hbWVzIHRvIG92ZXJyaWRlIHN0eWxlcyBvbiB0aGUgdGl0bGUgY29tcG9uZW50IGFib3ZlIHRoZSBzdGVwLiAqL1xuICAgICAgdGl0bGVDbGFzc05hbWU/OiBzdHJpbmc7XG4gICAgfVxuICA+O1xuICAvKiogU2V0cyBvbmUgb2YgdGhlIHN0YW5kYXJkIHNpemVzIG9mIHRoZSBzdGVwcy4gKi9cbiAgc3RlcFNpemU/OiBcInhzXCIgfCBcInNtXCIgfCBcIm1kXCIgfCBcImxnXCIgfCBcInhsXCI7XG4gIC8qKiBXaWR0aCBvZiB0aGUgY29tcG9uZW50IGVsZW1lbnQgb24gZWFjaCBicmVha3BvaW50IHNjcmVlbiByZXNvbHV0aW9uLiAqL1xuICB3aWR0aD86IHsgW2JyZWFrcG9pbnQgaW4gSHZCcmVha3BvaW50c10/OiBudW1iZXIgfTtcbiAgLyoqIERlZmluZXMgZWl0aGVyIHNob3cgYSB0aXRsZSBvciBvbmx5IGEgdG9vbHRpcCBvbiBlYWNoIHN0ZXAgY29tcG9uZW50LiAqL1xuICBzaG93VGl0bGVzPzogYm9vbGVhbjtcbiAgLyoqIEEgSnNzIE9iamVjdCB1c2VkIHRvIG92ZXJyaWRlIG9yIGV4dGVuZCB0aGUgc3R5bGVzIGFwcGxpZWQgdG8gdGhlIGVtcHR5IHN0YXRlIFN0ZXBOYXZpZ2F0aW9uLiAqL1xuICBjbGFzc2VzPzogSHZTdGVwTmF2aWdhdGlvbkNsYXNzZXM7XG59XG5cbi8qKlxuICogTmF2aWdhdGlvbiBwYWdlIHdpdGggc3RlcHMuXG4gKlxuICogWW91IG5lZWQgdG8gZGVmaW5lIHRoZSA8Yj5zdGVwczxiLz4gZGlzcGxheWVkIG9uIHRoZSBjb21wb25lbnQgc28gdGhhdCBpdHNlbGYgY2FuIGJlIGRyYXduIG9uIHRoZSBVSS5cbiAqIE9uIGVhY2ggc3RlcCwgeW91IG5lZWQgdG8gZGVmaW5lIGEgPGI+c3RhdGU8L2I+IC0gJ1BlbmRpbmcnLCAnRmFpbGVkJywgJ0NvbXBsZXRlZCcsICdDdXJyZW50JywgJ0Rpc2FibGVkJyAtXG4gKiBhbmQgYSA8Yj50aXRsZTwvYj4gdG8gYmUgc2hvd24gYXMgYSB0b29sdGlwIG9yIGEgdGV4dCBhYm92ZSBvZiB0aGUgc3RlcC4gWW91IGNhbiBhbHNvOlxuICogKiBEZWZpbmUgYSA8Yj5jbGFzc05hbWU8L2I+IG9uIGVhY2ggc3RlcCBlbGVtZW50O1xuICogKiBEZWZpbmUgYSA8Yj5zZXBhcmF0b3JDbGFzc05hbWU8L2I+IHRvIHNwZWNpZnkgYSBjbGFzc05hbWUgZm9yIHRoZSBzZXBhcmF0b3IgZWxlbWVudC4gVGhlIGRlZmF1bHQgaGVpZ2h0XG4gKiB2YWx1ZXMgb2YgdGhlIHNlcGFyYXRvciBlbGVtZW50IGFyZSAycHgvM3B4IG9uICdTaW1wbGUnLydEZWZhdWx0JyBsYXlvdXRzIHJlc3BlY3RpdmVseTtcbiAqICogRGVmaW5lIGEgPGI+dGl0bGVDbGFzc05hbWU8L2I+IHRvIHNwZWNpZnkgYSBjbGFzc05hbWUgZm9yIHRoZSB0aXRsZSBhYm92ZSBlYWNoIHN0ZXAgZWxlbWVudC5cbiAqXG4gKiBGb3IgdGhlIHJvb3QgZWxlbWVudCwgeW91IGNhbjpcbiAqICogRGVmaW5lIGEgPGI+Y2xhc3NOYW1lPC9iPjtcbiAqICogQ2hvb3NlIGEgPGI+dHlwZTwvYj4gb2YgbGF5b3V0OiAnU2ltcGxlJyBvciAnRGVmYXVsdCc7XG4gKiAqIENob29zZSB0aGUgPGI+c3RlcFNpemU8L2I+IG9mIHRoZSBzdGVwIGNvbXBvbmVudDogXCJ4c1wiLCBcInNtXCIsIFwibWRcIiwgXCJsZ1wiLCBcInhsXCIuIFRoZSBkZWZhdWx0IHNpemUgd2lsbCBiZVxuICogY29ycmVzcG9uZGVudCB0byB0aGUgY3VycmVudCBtZWRpYSBicmVha3BvaW50O1xuICogKiBDaG9vc2UgZWl0aGVyIHlvdSB3YW50IHRvIDxiPnNob3dUaXRsZXM8L2I+IG5lYXIgdG8gZWFjaCBzdGVwIGNvbXBvbmVudCBvciBhIHRvb2x0aXAgb24gaG92ZXI7XG4gKiAqIERlZmluZSBhIDxiPndpZHRoPC9iPiBvZiB0aGUgY29tcG9uZW50LiBJZiB5b3UgZG9uJ3QgZGVmaW5lIGFueSB2YWx1ZSBhbmQgdGhlIHN0ZXAgY29tcG9uZW50IGhhcyBubyB0aXRsZVxuICogZGlzcGxheWVkIGFib3ZlLCB0aGUgd2lkdGggb2YgdGhlIHNlcGFyYXRvciBlbGVtZW50IHdpbGwgYmUgMTAwcHguXG4gKiBJZiB0aGUgc3RlcCBjb21wb25lbnQgaGFzIHRpdGxlcywgZWFjaCBvbmUgd2lsbCBoYXZlIDIxNXB4IG9mIHdpZHRoIGJ5IGRlZmF1bHQuXG4gKi9cbmV4cG9ydCBjb25zdCBIdlN0ZXBOYXZpZ2F0aW9uID0gKHtcbiAgY2xhc3NOYW1lLFxuICBjbGFzc2VzOiBjbGFzc2VzUHJvcCxcbiAgd2lkdGgsXG4gIHN0ZXBzLFxuICBzdGVwU2l6ZSxcbiAgc2hvd1RpdGxlcyxcbiAgdHlwZSA9IFwiRGVmYXVsdFwiLFxuICBcImFyaWEtbGFiZWxcIjogYXJpYUxhYmVsLFxuICAuLi5vdGhlcnNcbn06IEh2U3RlcE5hdmlnYXRpb25Qcm9wcykgPT4ge1xuICBjb25zdCB7IGNsYXNzZXMsIGNzcywgY3ggfSA9IHVzZUNsYXNzZXMoY2xhc3Nlc1Byb3ApO1xuXG4gIGNvbnN0IHsgYWN0aXZlVGhlbWUgfSA9IHVzZVRoZW1lKCk7XG5cbiAgLy8gY3VycmVudCBicmVha3BvaW50ICd4cycgfCAnc20nIHwgJ21kJyB8ICdsZycgfCAneGwnXG4gIGNvbnN0IGJyZWFrcG9pbnQgPSB1c2VXaWR0aCgpO1xuICAvLyBzdGVwIGNvbmZpZ3VyYXRpb25zXG4gIGNvbnN0IHN0ZXBTaXplS2V5ID1cbiAgICBzdGVwU2l6ZSA/PyAoW1wieHNcIiwgXCJzbVwiXS5pbmNsdWRlcyhicmVha3BvaW50KSA/IFwic21cIiA6IFwibWRcIik7XG4gIGNvbnN0IGhhc1RpdGxlcyA9IHNob3dUaXRsZXMgPz8gIVtcInhzXCIsIFwic21cIl0uaW5jbHVkZXMoYnJlYWtwb2ludCk7XG5cbiAgY29uc3Qgc3R5bGVkTGkgPSAoY29udGFpbmVyU2l6ZSkgPT5cbiAgICBzdHlsZWQoXCJsaVwiKSh7XG4gICAgICB3aWR0aDogY29udGFpbmVyU2l6ZSxcbiAgICAgIGhlaWdodDogY29udGFpbmVyU2l6ZSxcbiAgICB9KTtcblxuICBjb25zdCBzdHlsZWREaXYgPSAoY29udGFpbmVyU2l6ZSkgPT5cbiAgICBzdHlsZWQoXCJkaXZcIikoe1xuICAgICAgd2lkdGg6IGNvbnRhaW5lclNpemUsXG4gICAgICBoZWlnaHQ6IGNvbnRhaW5lclNpemUsXG4gICAgfSk7XG5cbiAgY29uc3Qgc3R5bGVkU2VwYXJhdG9yRWxlbWVudCA9IChcbiAgICB0aXRsZSxcbiAgICBzZXBhcmF0b3JDbGFzc05hbWUsXG4gICAgc2VwYXJhdG9ySGVpZ2h0LFxuICAgIHNlcGFyYXRvcldpZHRoLFxuICAgIGJhY2tncm91bmRDb2xvclxuICApID0+IHtcbiAgICBjb25zdCB3aWR0aFZhbHVlID1cbiAgICAgIHNlcGFyYXRvcldpZHRoIC1cbiAgICAgIDIgKlxuICAgICAgICBOdW1iZXIoXG4gICAgICAgICAgKGFjdGl2ZVRoZW1lPy5zdGVwTmF2aWdhdGlvbi5zZXBhcmF0b3JNYXJnaW4gfHwgXCIwcHhcIikucmVwbGFjZShcbiAgICAgICAgICAgIFwicHhcIixcbiAgICAgICAgICAgIFwiXCJcbiAgICAgICAgICApXG4gICAgICAgICk7XG5cbiAgICByZXR1cm4gKFxuICAgICAgPGxpXG4gICAgICAgIGFyaWEtaGlkZGVuXG4gICAgICAgIGtleT17YHNlcGFyYXRvci0ke3RpdGxlfWB9XG4gICAgICAgIGNsYXNzTmFtZT17Y3goXG4gICAgICAgICAgY3NzKHtcbiAgICAgICAgICAgIGhlaWdodDogc2VwYXJhdG9ySGVpZ2h0LFxuICAgICAgICAgICAgd2lkdGg6IHdpZHRoVmFsdWUsXG4gICAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3IsXG4gICAgICAgICAgICBtYXJnaW46IGAwICR7dGhlbWUuc3RlcE5hdmlnYXRpb24uc2VwYXJhdG9yTWFyZ2lufWAsXG4gICAgICAgICAgfSksXG4gICAgICAgICAgY2xhc3Nlcy5zZXBhcmF0b3JcbiAgICAgICAgKX1cbiAgICAgID5cbiAgICAgICAgPGRpdiBjbGFzc05hbWU9e3NlcGFyYXRvckNsYXNzTmFtZX0gLz5cbiAgICAgIDwvbGk+XG4gICAgKTtcbiAgfTtcblxuICBjb25zdCBkcmF3SXRlbXMgPSAoe1xuICAgIHNlcGFyYXRvclZhbHVlczogeyBtaW5XaWR0aCwgbWF4V2lkdGgsIGdldENvbG9yLCBoZWlnaHQgfSxcbiAgICBzdGVwVmFsdWVzOiB7IG1pblNpemUsIG1heFNpemUsIFN0ZXBDb21wb25lbnQgfSxcbiAgfTogYW55KSA9PiB7XG4gICAgY29uc3QgaXRlbXMgPSBzdGVwcy5yZWR1Y2U8UmVhY3ROb2RlW10+KFxuICAgICAgKGFjYywgeyBzdGF0ZSwgdGl0bGUsIHNlcGFyYXRvckNsYXNzTmFtZSwgLi4ucHJvcHMgfSwgaW5kZXgpOiBhbnkgPT4ge1xuICAgICAgICBjb25zdCBjb250YWluZXJTaXplID0gc3RhdGUgPT09IFwiQ3VycmVudFwiID8gbWF4U2l6ZSA6IG1pblNpemU7XG4gICAgICAgIGNvbnN0IFN0ZXBDb250YWluZXIgPSBzdHlsZWRMaShjb250YWluZXJTaXplKTtcbiAgICAgICAgY29uc3QgU3RlcCA9IHN0eWxlZERpdihNYXRoLm1heChjb250YWluZXJTaXplLCAzMCkpO1xuICAgICAgICBjb25zdCBzdGVwUHJvcHMgPSB7XG4gICAgICAgICAgLi4ue1xuICAgICAgICAgICAgc2l6ZTogc3RlcFNpemVLZXksXG4gICAgICAgICAgICBzdGF0ZSxcbiAgICAgICAgICAgIHRpdGxlLFxuICAgICAgICAgICAgbnVtYmVyOiBpbmRleCArIDEsXG4gICAgICAgICAgICAuLi5wcm9wcyxcbiAgICAgICAgICB9LFxuICAgICAgICB9O1xuICAgICAgICBjb25zdCBzdGVwRWxlbWVudCA9IChcbiAgICAgICAgICA8U3RlcENvbnRhaW5lciBrZXk9e2BzdGVwLSR7dGl0bGV9YH0gY2xhc3NOYW1lPXtjbGFzc2VzLmxpfT5cbiAgICAgICAgICAgIHtoYXNUaXRsZXMgPyAoXG4gICAgICAgICAgICAgIDxTdGVwQ29tcG9uZW50XG4gICAgICAgICAgICAgICAga2V5PXtgc3RlcC0ke3RpdGxlfWB9XG4gICAgICAgICAgICAgICAgYXJpYS1sYWJlbD17YCR7dGl0bGV9YH1cbiAgICAgICAgICAgICAgICB7Li4uc3RlcFByb3BzfVxuICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgKSA6IChcbiAgICAgICAgICAgICAgPEh2VG9vbHRpcFxuICAgICAgICAgICAgICAgIHBsYWNlbWVudD1cImJvdHRvbVwiXG4gICAgICAgICAgICAgICAgdGl0bGU9ezxIdlR5cG9ncmFwaHk+e2Ake2luZGV4ICsgMX0uICR7dGl0bGV9YH08L0h2VHlwb2dyYXBoeT59XG4gICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICA8ZGl2PlxuICAgICAgICAgICAgICAgICAgPFN0ZXAgY2xhc3NOYW1lPXtjbGFzc2VzLmxpfT5cbiAgICAgICAgICAgICAgICAgICAgPFN0ZXBDb21wb25lbnQgYXJpYS1sYWJlbD17YCR7dGl0bGV9YH0gey4uLnN0ZXBQcm9wc30gLz5cbiAgICAgICAgICAgICAgICAgIDwvU3RlcD5cbiAgICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgICAgPC9IdlRvb2x0aXA+XG4gICAgICAgICAgICApfVxuICAgICAgICAgIDwvU3RlcENvbnRhaW5lcj5cbiAgICAgICAgKTtcbiAgICAgICAgaWYgKGluZGV4IDwgc3RlcHMubGVuZ3RoIC0gMSkge1xuICAgICAgICAgIGNvbnN0IHNlcGFyYXRvckVsZW1lbnQgPSBzdHlsZWRTZXBhcmF0b3JFbGVtZW50KFxuICAgICAgICAgICAgdGl0bGUsXG4gICAgICAgICAgICBzZXBhcmF0b3JDbGFzc05hbWUsXG4gICAgICAgICAgICBoZWlnaHQsXG4gICAgICAgICAgICBbc3RlcHNbaW5kZXggKyAxXS5zdGF0ZSwgc3RhdGVdLmluY2x1ZGVzKFwiQ3VycmVudFwiKVxuICAgICAgICAgICAgICA/IG1pbldpZHRoXG4gICAgICAgICAgICAgIDogbWF4V2lkdGgsXG4gICAgICAgICAgICBnZXRDb2xvcihcbiAgICAgICAgICAgICAgc3RlcHNbaW5kZXggKyAxXS5zdGF0ZSA9PT0gXCJEaXNhYmxlZFwiID8gXCJEaXNhYmxlZFwiIDogc3RhdGUsXG4gICAgICAgICAgICAgIHRoZW1lXG4gICAgICAgICAgICApXG4gICAgICAgICAgKTtcbiAgICAgICAgICByZXR1cm4gWy4uLmFjYywgc3RlcEVsZW1lbnQsIHNlcGFyYXRvckVsZW1lbnRdO1xuICAgICAgICB9XG4gICAgICAgIHJldHVybiBbLi4uYWNjLCBzdGVwRWxlbWVudF07XG4gICAgICB9LFxuICAgICAgW11cbiAgICApO1xuXG4gICAgcmV0dXJuIDxvbCBjbGFzc05hbWU9e2NsYXNzZXMub2x9PntpdGVtc308L29sPjtcbiAgfTtcblxuICBjb25zdCBnZXREeW5hbWljVmFsdWVzOiBIdkRlZmF1bHROYXZpZ2F0aW9uUHJvcHNbXCJnZXREeW5hbWljVmFsdWVzXCJdID0gKFxuICAgIHN0ZXBzV2lkdGhcbiAgKSA9PiB7XG4gICAgY29uc3QgdGhlbWVCcmVha3BvaW50cyA9IGFjdGl2ZVRoZW1lPy5icmVha3BvaW50cy52YWx1ZXMgfHwge307XG4gICAgY29uc3QgbWF4V2lkdGggPVxuICAgICAgd2lkdGg/LlticmVha3BvaW50XSA/P1xuICAgICAgTWF0aC5tYXgoXG4gICAgICAgIE51bWJlcihoYXNUaXRsZXMpICogKFRJVExFX1dJRFRIICsgVElUTEVfTUFSR0lOKSAqIHN0ZXBzLmxlbmd0aCAtXG4gICAgICAgICAgVElUTEVfTUFSR0lOLFxuICAgICAgICBTRVBBUkFUT1JfV0lEVEggKiAoc3RlcHMubGVuZ3RoIC0gMSkgKyBzdGVwc1dpZHRoXG4gICAgICApO1xuICAgIGNvbnN0IG5leHQgPSBPYmplY3Qua2V5cyh0aGVtZUJyZWFrcG9pbnRzKS5maW5kKChfLCBpbmRleCwgc2VsZikgPT5cbiAgICAgIGluZGV4IC0gMSA+PSAwID8gc2VsZltpbmRleCAtIDFdID09PSBicmVha3BvaW50IDogZmFsc2VcbiAgICApO1xuICAgIGNvbnN0IG5hdldpZHRoID0gTWF0aC5taW4oXG4gICAgICBtYXhXaWR0aCxcbiAgICAgIG5leHQgPyB0aGVtZUJyZWFrcG9pbnRzW25leHRdIDogbWF4V2lkdGhcbiAgICApO1xuICAgIGNvbnN0IHRpdGxlV2lkdGggPVxuICAgICAgTnVtYmVyKGhhc1RpdGxlcykgKiBNYXRoLmNlaWwoKG5hdldpZHRoICsgVElUTEVfTUFSR0lOKSAvIHN0ZXBzLmxlbmd0aCk7XG4gICAgY29uc3Qgc2VwYXJhdG9yV2lkdGggPVxuICAgICAgTnVtYmVyKCFoYXNUaXRsZXMpICpcbiAgICAgIE1hdGguY2VpbCgobmF2V2lkdGggLSBzdGVwc1dpZHRoKSAvIChzdGVwcy5sZW5ndGggLSAxKSk7XG4gICAgcmV0dXJuIHsgd2lkdGg6IG5hdldpZHRoLCB0aXRsZVdpZHRoLCBzZXBhcmF0b3JXaWR0aCB9O1xuICB9O1xuXG4gIGNvbnN0IGdldFRpdGxlcyA9IChnZXRUaXRsZVByb3BzKSA9PlxuICAgIGhhc1RpdGxlcyA/IChcbiAgICAgIDxkaXYgY2xhc3NOYW1lPXtjbGFzc2VzLnRpdGxlc30+XG4gICAgICAgIHtzdGVwcy5tYXAoKHsgdGl0bGU6IHJhd1RpdGxlLCBzdGF0ZSwgdGl0bGVDbGFzc05hbWUgfSwgaW5kZXgpID0+IHtcbiAgICAgICAgICBjb25zdCB7XG4gICAgICAgICAgICB2YXJpYW50ID0gXCJsYWJlbFwiLFxuICAgICAgICAgICAgdGl0bGUgPSByYXdUaXRsZSxcbiAgICAgICAgICAgIHRpdGxlV2lkdGggPSAwLFxuICAgICAgICAgICAgdGl0bGVEaXNhYmxlZCA9IGZhbHNlLFxuICAgICAgICAgIH0gPSBnZXRUaXRsZVByb3BzKHtcbiAgICAgICAgICAgIHN0YXRlLFxuICAgICAgICAgICAgcmF3VGl0bGUsXG4gICAgICAgICAgICBudW1iZXI6IGluZGV4ICsgMSxcbiAgICAgICAgICB9KTtcblxuICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICA8SHZUeXBvZ3JhcGh5XG4gICAgICAgICAgICAgIHZhcmlhbnQ9e3ZhcmlhbnR9XG4gICAgICAgICAgICAgIGNsYXNzTmFtZT17Y3goXG4gICAgICAgICAgICAgICAgY3NzKHtcbiAgICAgICAgICAgICAgICAgIHRleHRBbGlnbjogXCJjZW50ZXJcIixcbiAgICAgICAgICAgICAgICAgIHdpZHRoOiB0aXRsZVdpZHRoIC0gVElUTEVfTUFSR0lOLFxuICAgICAgICAgICAgICAgICAgbWFyZ2luUmlnaHQ6IFRJVExFX01BUkdJTixcbiAgICAgICAgICAgICAgICB9KSxcbiAgICAgICAgICAgICAgICB0aXRsZUNsYXNzTmFtZVxuICAgICAgICAgICAgICApfVxuICAgICAgICAgICAgICBkaXNhYmxlZD17dGl0bGVEaXNhYmxlZH1cbiAgICAgICAgICAgICAga2V5PXt0aXRsZX1cbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAge3RpdGxlfVxuICAgICAgICAgICAgPC9IdlR5cG9ncmFwaHk+XG4gICAgICAgICAgKTtcbiAgICAgICAgfSl9XG4gICAgICA8L2Rpdj5cbiAgICApIDogbnVsbDtcblxuICBjb25zdCBTdGVwTmF2aWdhdGlvbiA9IHtcbiAgICBEZWZhdWx0OiBIdkRlZmF1bHROYXZpZ2F0aW9uLFxuICAgIFNpbXBsZTogSHZTaW1wbGVOYXZpZ2F0aW9uLFxuICB9W3R5cGVdO1xuXG4gIHJldHVybiAoXG4gICAgPFN0ZXBOYXZpZ2F0aW9uXG4gICAgICBudW1TdGVwcz17c3RlcHMubGVuZ3RofVxuICAgICAgc3RlcFNpemU9e3N0ZXBTaXplS2V5fVxuICAgICAgZ2V0VGl0bGVzPXtnZXRUaXRsZXN9XG4gICAgICBnZXREeW5hbWljVmFsdWVzPXtnZXREeW5hbWljVmFsdWVzfVxuICAgICAgY2xhc3NOYW1lPXtjeChjbGFzc2VzLnJvb3QsIGNsYXNzTmFtZSl9XG4gICAgICB7Li4ub3RoZXJzfVxuICAgID5cbiAgICAgIHsoeyBzdGVwc1dpZHRoLCBuYXZXaWR0aCwgLi4uaXRlbXNQcm9wcyB9KSA9PiAoXG4gICAgICAgIDxIdkJveFxuICAgICAgICAgIGNvbXBvbmVudD1cIm5hdlwiXG4gICAgICAgICAgc3R5bGU9e3tcbiAgICAgICAgICAgIHdpZHRoOiBgJHtuYXZXaWR0aH1weGAsXG4gICAgICAgICAgICBtYXJnaW46IDAsXG4gICAgICAgICAgfX1cbiAgICAgICAgICBhcmlhLWxhYmVsPXthcmlhTGFiZWx9XG4gICAgICAgID5cbiAgICAgICAgICB7ZHJhd0l0ZW1zKGl0ZW1zUHJvcHMpfVxuICAgICAgICA8L0h2Qm94PlxuICAgICAgKX1cbiAgICA8L1N0ZXBOYXZpZ2F0aW9uPlxuICApO1xufTtcbiJdfQ== */");
50
50
  const styledSeparatorElement = (title, separatorClassName, separatorHeight, separatorWidth, backgroundColor) => {
51
51
  const widthValue = separatorWidth - 2 * Number(((activeTheme == null ? void 0 : activeTheme.stepNavigation.separatorMargin) || "0px").replace("px", ""));
52
- return /* @__PURE__ */ jsx("li", {
53
- "aria-hidden": true,
54
- className: cx(css({
55
- height: separatorHeight,
56
- width: widthValue,
57
- backgroundColor,
58
- margin: `0 ${theme.stepNavigation.separatorMargin}`
59
- }), classes.separator),
60
- children: /* @__PURE__ */ jsx("div", {
61
- className: separatorClassName
62
- })
63
- }, `separator-${title}`);
52
+ return /* @__PURE__ */ jsx("li", { "aria-hidden": true, className: cx(css({
53
+ height: separatorHeight,
54
+ width: widthValue,
55
+ backgroundColor,
56
+ margin: `0 ${theme.stepNavigation.separatorMargin}`
57
+ }), classes.separator), children: /* @__PURE__ */ jsx("div", { className: separatorClassName }) }, `separator-${title}`);
64
58
  };
65
59
  const drawItems = ({
66
60
  separatorValues: {
@@ -93,37 +87,14 @@ const HvStepNavigation = ({
93
87
  ...props
94
88
  }
95
89
  };
96
- const stepElement = /* @__PURE__ */ jsx(StepContainer, {
97
- className: classes.li,
98
- children: hasTitles ? /* @__PURE__ */ jsx(StepComponent, {
99
- "aria-label": `${title}`,
100
- ...stepProps
101
- }, `step-${title}`) : /* @__PURE__ */ jsx(HvTooltip, {
102
- placement: "bottom",
103
- title: /* @__PURE__ */ jsx(HvTypography, {
104
- children: `${index + 1}. ${title}`
105
- }),
106
- children: /* @__PURE__ */ jsx("div", {
107
- children: /* @__PURE__ */ jsx(Step, {
108
- className: classes.li,
109
- children: /* @__PURE__ */ jsx(StepComponent, {
110
- "aria-label": `${title}`,
111
- ...stepProps
112
- })
113
- })
114
- })
115
- })
116
- }, `step-${title}`);
90
+ const stepElement = /* @__PURE__ */ jsx(StepContainer, { className: classes.li, children: hasTitles ? /* @__PURE__ */ jsx(StepComponent, { "aria-label": `${title}`, ...stepProps }, `step-${title}`) : /* @__PURE__ */ jsx(HvTooltip, { placement: "bottom", title: /* @__PURE__ */ jsx(HvTypography, { children: `${index + 1}. ${title}` }), children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Step, { className: classes.li, children: /* @__PURE__ */ jsx(StepComponent, { "aria-label": `${title}`, ...stepProps }) }) }) }) }, `step-${title}`);
117
91
  if (index < steps.length - 1) {
118
92
  const separatorElement = styledSeparatorElement(title, separatorClassName, height, [steps[index + 1].state, state].includes("Current") ? minWidth : maxWidth, getColor(steps[index + 1].state === "Disabled" ? "Disabled" : state, theme));
119
93
  return [...acc, stepElement, separatorElement];
120
94
  }
121
95
  return [...acc, stepElement];
122
96
  }, []);
123
- return /* @__PURE__ */ jsx("ol", {
124
- className: classes.ol,
125
- children: items
126
- });
97
+ return /* @__PURE__ */ jsx("ol", { className: classes.ol, children: items });
127
98
  };
128
99
  const getDynamicValues = (stepsWidth) => {
129
100
  const themeBreakpoints = (activeTheme == null ? void 0 : activeTheme.breakpoints.values) || {};
@@ -138,60 +109,39 @@ const HvStepNavigation = ({
138
109
  separatorWidth
139
110
  };
140
111
  };
141
- const getTitles = (getTitleProps) => hasTitles ? /* @__PURE__ */ jsx("div", {
142
- className: classes.titles,
143
- children: steps.map(({
144
- title: rawTitle,
112
+ const getTitles = (getTitleProps) => hasTitles ? /* @__PURE__ */ jsx("div", { className: classes.titles, children: steps.map(({
113
+ title: rawTitle,
114
+ state,
115
+ titleClassName
116
+ }, index) => {
117
+ const {
118
+ variant = "label",
119
+ title = rawTitle,
120
+ titleWidth = 0,
121
+ titleDisabled = false
122
+ } = getTitleProps({
145
123
  state,
146
- titleClassName
147
- }, index) => {
148
- const {
149
- variant = "label",
150
- title = rawTitle,
151
- titleWidth = 0,
152
- titleDisabled = false
153
- } = getTitleProps({
154
- state,
155
- rawTitle,
156
- number: index + 1
157
- });
158
- return /* @__PURE__ */ jsx(HvTypography, {
159
- variant,
160
- className: cx(css({
161
- textAlign: "center",
162
- width: titleWidth - TITLE_MARGIN,
163
- marginRight: TITLE_MARGIN
164
- }), titleClassName),
165
- disabled: titleDisabled,
166
- children: title
167
- }, title);
168
- })
169
- }) : null;
124
+ rawTitle,
125
+ number: index + 1
126
+ });
127
+ return /* @__PURE__ */ jsx(HvTypography, { variant, className: cx(css({
128
+ textAlign: "center",
129
+ width: titleWidth - TITLE_MARGIN,
130
+ marginRight: TITLE_MARGIN
131
+ }), titleClassName), disabled: titleDisabled, children: title }, title);
132
+ }) }) : null;
170
133
  const StepNavigation = {
171
134
  Default: HvDefaultNavigation,
172
135
  Simple: HvSimpleNavigation
173
136
  }[type];
174
- return /* @__PURE__ */ jsx(StepNavigation, {
175
- numSteps: steps.length,
176
- stepSize: stepSizeKey,
177
- getTitles,
178
- getDynamicValues,
179
- className: cx(classes.root, className),
180
- ...others,
181
- children: ({
182
- stepsWidth,
183
- navWidth,
184
- ...itemsProps
185
- }) => /* @__PURE__ */ jsx(HvBox, {
186
- component: "nav",
187
- style: {
188
- width: `${navWidth}px`,
189
- margin: 0
190
- },
191
- "aria-label": ariaLabel,
192
- children: drawItems(itemsProps)
193
- })
194
- });
137
+ return /* @__PURE__ */ jsx(StepNavigation, { numSteps: steps.length, stepSize: stepSizeKey, getTitles, getDynamicValues, className: cx(classes.root, className), ...others, children: ({
138
+ stepsWidth,
139
+ navWidth,
140
+ ...itemsProps
141
+ }) => /* @__PURE__ */ jsx(HvBox, { component: "nav", style: {
142
+ width: `${navWidth}px`,
143
+ margin: 0
144
+ }, "aria-label": ariaLabel, children: drawItems(itemsProps) }) });
195
145
  };
196
146
  export {
197
147
  HvStepNavigation,
@@ -1 +1 @@
1
- {"version":3,"file":"StepNavigation.js","sources":["../../../../src/components/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":["HvStepNavigation","className","classes","classesProp","width","steps","stepSize","showTitles","type","ariaLabel","others","css","cx","useClasses","activeTheme","useTheme","breakpoint","useWidth","stepSizeKey","includes","hasTitles","styledLi","containerSize","_styled","process","env","NODE_ENV","target","label","height","styledDiv","styledSeparatorElement","title","separatorClassName","separatorHeight","separatorWidth","backgroundColor","widthValue","Number","stepNavigation","separatorMargin","replace","margin","theme","separator","children","drawItems","separatorValues","minWidth","maxWidth","getColor","stepValues","minSize","maxSize","StepComponent","items","reduce","acc","state","props","index","StepContainer","Step","Math","max","stepProps","size","number","stepElement","li","_jsx","HvTooltip","placement","HvTypography","length","separatorElement","ol","getDynamicValues","stepsWidth","themeBreakpoints","breakpoints","values","TITLE_WIDTH","TITLE_MARGIN","SEPARATOR_WIDTH","next","Object","keys","find","_","self","navWidth","min","titleWidth","ceil","getTitles","getTitleProps","titles","map","rawTitle","titleClassName","variant","titleDisabled","textAlign","marginRight","disabled","StepNavigation","Default","HvDefaultNavigation","Simple","HvSimpleNavigation","numSteps","root","itemsProps","HvBox","component","style"],"mappings":"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"}
1
+ {"version":3,"file":"StepNavigation.js","sources":["../../../../src/components/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":["HvStepNavigation","className","classes","classesProp","width","steps","stepSize","showTitles","type","ariaLabel","others","css","cx","useClasses","activeTheme","useTheme","breakpoint","useWidth","stepSizeKey","includes","hasTitles","styledLi","containerSize","_styled","process","env","NODE_ENV","target","label","height","styledDiv","styledSeparatorElement","title","separatorClassName","separatorHeight","separatorWidth","backgroundColor","widthValue","Number","stepNavigation","separatorMargin","replace","margin","theme","separator","drawItems","separatorValues","minWidth","maxWidth","getColor","stepValues","minSize","maxSize","StepComponent","items","reduce","acc","state","props","index","StepContainer","Step","Math","max","stepProps","size","number","stepElement","li","length","separatorElement","ol","getDynamicValues","stepsWidth","themeBreakpoints","breakpoints","values","TITLE_WIDTH","TITLE_MARGIN","SEPARATOR_WIDTH","next","Object","keys","find","_","self","navWidth","min","titleWidth","ceil","getTitles","getTitleProps","titles","map","rawTitle","titleClassName","variant","titleDisabled","textAlign","marginRight","StepNavigation","Default","HvDefaultNavigation","Simple","HvSimpleNavigation","root","itemsProps"],"mappings":"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"}
@@ -1,7 +1,7 @@
1
+ import { jsx, jsxs } from "@emotion/react/jsx-runtime";
1
2
  import { useState, useCallback, useEffect, useMemo } from "react";
2
3
  import { useClasses } from "./Wizard.styles.js";
3
4
  import { staticClasses } from "./Wizard.styles.js";
4
- import { jsx, jsxs } from "@emotion/react/jsx-runtime";
5
5
  import HvWizardContext from "./WizardContext/WizardContext.js";
6
6
  import { HvWizardContainer } from "./WizardContainer/WizardContainer.js";
7
7
  import { HvWizardTitle } from "./WizardTitle/WizardTitle.js";
@@ -64,35 +64,13 @@ const HvWizard = ({
64
64
  tab,
65
65
  setTab
66
66
  }), [context, setContext, summary, setSummary, tab, setTab]);
67
- return /* @__PURE__ */ jsx(HvWizardContext.Provider, {
68
- value,
69
- children: /* @__PURE__ */ jsxs(HvWizardContainer, {
70
- className,
71
- classes: {
72
- root: classes.root
73
- },
74
- handleClose,
75
- open,
76
- ...others,
77
- children: [/* @__PURE__ */ jsx(HvWizardTitle, {
78
- title,
79
- hasSummary,
80
- labels,
81
- customStep
82
- }), /* @__PURE__ */ jsx(HvWizardContent, {
83
- loading,
84
- fixedHeight,
85
- summaryContent,
86
- children
87
- }), /* @__PURE__ */ jsx(HvWizardActions, {
88
- loading,
89
- skippable,
90
- labels,
91
- handleClose,
92
- handleSubmit
93
- })]
94
- })
95
- });
67
+ return /* @__PURE__ */ jsx(HvWizardContext.Provider, { value, children: /* @__PURE__ */ jsxs(HvWizardContainer, { className, classes: {
68
+ root: classes.root
69
+ }, handleClose, open, ...others, children: [
70
+ /* @__PURE__ */ jsx(HvWizardTitle, { title, hasSummary, labels, customStep }),
71
+ /* @__PURE__ */ jsx(HvWizardContent, { loading, fixedHeight, summaryContent, children }),
72
+ /* @__PURE__ */ jsx(HvWizardActions, { loading, skippable, labels, handleClose, handleSubmit })
73
+ ] }) });
96
74
  };
97
75
  export {
98
76
  HvWizard,
@@ -1 +1 @@
1
- {"version":3,"file":"Wizard.js","sources":["../../../../src/components/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\";\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":["HvWizard","className","children","onClose","handleSubmit","title","open","skippable","loading","hasSummary","summaryContent","labels","cancel","next","previous","skip","submit","summary","fixedHeight","customStep","classes","classesProp","others","useClasses","context","setContext","useState","setSummary","tab","setTab","handleClose","useCallback","evt","reason","useEffect","c","Object","entries","reduce","acc","key","child","touched","value","useMemo","_jsx","HvWizardContext","Provider","HvWizardContainer","root","HvWizardTitle","HvWizardContent","HvWizardActions"],"mappings":";;;;;;;;;AAoDO,MAAMA,WAAWA,CAAC;AAAA,EACvBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,YAAY;AAAA,EACZC,UAAU;AAAA,EACVC,aAAa;AAAA,EACbC;AAAAA,EACAC,SAAS;AAAA,IACPC,QAAQ;AAAA,IACRC,MAAM;AAAA,IACNC,UAAU;AAAA,IACVC,MAAM;AAAA,IACNC,QAAQ;AAAA,IACRC,SAAS;AAAA,EACX;AAAA,EACAC,cAAc;AAAA,EACdC;AAAAA,EACAC,SAASC;AAAAA,EACT,GAAGC;AACU,MAAM;AACb,QAAA;AAAA,IAAEF;AAAAA,EAAAA,IAAYG,WAAWF,WAAW;AAE1C,QAAM,CAACG,SAASC,UAAU,IAAIC,SAAuB,CAAE,CAAA;AACvD,QAAM,CAACT,SAASU,UAAU,IAAID,SAAS,KAAK;AAC5C,QAAM,CAACE,KAAKC,MAAM,IAAIH,SAAS,CAAC;AAEhC,QAAMI,cAAcC,YAClB,CAACC,KAAKC,WAAW;AACf,QAAIA,WAAW,iBAAiB;AAC9B9B,yCAAU6B,KAAKC;AAAAA,IACjB;AAAA,EAAA,GAEF,CAAC9B,OAAO,CACV;AAGA+B,YAAU,MAAM;AACd,WAAO,MAAM;AACX,UAAI,CAAC5B,MAAM;AACG6B,mBAAAA,CAAAA,MACVC,OAAOC,QAAQF,CAAC,EAAEG,OAChB,CAACC,KAAK,CAACC,KAAKC,KAAK,OAAO;AAAA,UACtB,GAAGF;AAAAA,UACH,CAAC,CAACC,GAAG,GAAG;AAAA,YACN,GAAGC;AAAAA,YACHC,SAAS;AAAA,UACX;AAAA,QAAA,IAEF,CACF,CAAA,CACF;AACAb,eAAO,CAAC;AAAA,MACV;AAAA,IAAA;AAAA,EACF,GACC,CAACvB,IAAI,CAAC;AAEHqC,QAAAA,QAAQC,QACZ,OAAO;AAAA,IAAEpB;AAAAA,IAASC;AAAAA,IAAYR;AAAAA,IAASU;AAAAA,IAAYC;AAAAA,IAAKC;AAAAA,EAAAA,IACxD,CAACL,SAASC,YAAYR,SAASU,YAAYC,KAAKC,MAAM,CACxD;AAGEgB,SAAAA,oBAACC,gBAAgBC,UAAQ;AAAA,IAACJ;AAAAA,IAAazC,+BACpC8C,mBAAiB;AAAA,MAChB/C;AAAAA,MACAmB,SAAS;AAAA,QAAE6B,MAAM7B,QAAQ6B;AAAAA,MAAK;AAAA,MAC9BnB;AAAAA,MACAxB;AAAAA,MAAW,GACPgB;AAAAA,MAAMpB,UAAA,CAEV2C,oBAACK,eAAa;AAAA,QACZ7C;AAAAA,QACAI;AAAAA,QACAE;AAAAA,QACAQ;AAAAA,MAAAA,CACD,GACD0B,oBAACM,iBAAe;AAAA,QACd3C;AAAAA,QACAU;AAAAA,QACAR;AAAAA,QAA+BR;AAAAA,MAAAA,CAGhB,GACjB2C,oBAACO,iBAAe;AAAA,QACd5C;AAAAA,QACAD;AAAAA,QACAI;AAAAA,QACAmB;AAAAA,QACA1B;AAAAA,MAAAA,CACD,CAAC;AAAA,IAAA,CACe;AAAA,EAAA,CACK;AAE9B;"}
1
+ {"version":3,"file":"Wizard.js","sources":["../../../../src/components/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\";\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":["HvWizard","className","children","onClose","handleSubmit","title","open","skippable","loading","hasSummary","summaryContent","labels","cancel","next","previous","skip","submit","summary","fixedHeight","customStep","classes","classesProp","others","useClasses","context","setContext","useState","setSummary","tab","setTab","handleClose","useCallback","evt","reason","useEffect","c","Object","entries","reduce","acc","key","child","touched","value","useMemo","root"],"mappings":";;;;;;;;;AAoDO,MAAMA,WAAWA,CAAC;AAAA,EACvBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,YAAY;AAAA,EACZC,UAAU;AAAA,EACVC,aAAa;AAAA,EACbC;AAAAA,EACAC,SAAS;AAAA,IACPC,QAAQ;AAAA,IACRC,MAAM;AAAA,IACNC,UAAU;AAAA,IACVC,MAAM;AAAA,IACNC,QAAQ;AAAA,IACRC,SAAS;AAAA,EACX;AAAA,EACAC,cAAc;AAAA,EACdC;AAAAA,EACAC,SAASC;AAAAA,EACT,GAAGC;AACU,MAAM;AACb,QAAA;AAAA,IAAEF;AAAAA,EAAAA,IAAYG,WAAWF,WAAW;AAE1C,QAAM,CAACG,SAASC,UAAU,IAAIC,SAAuB,CAAE,CAAA;AACvD,QAAM,CAACT,SAASU,UAAU,IAAID,SAAS,KAAK;AAC5C,QAAM,CAACE,KAAKC,MAAM,IAAIH,SAAS,CAAC;AAEhC,QAAMI,cAAcC,YAClB,CAACC,KAAKC,WAAW;AACf,QAAIA,WAAW,iBAAiB;AAC9B9B,yCAAU6B,KAAKC;AAAAA,IACjB;AAAA,EAAA,GAEF,CAAC9B,OAAO,CACV;AAGA+B,YAAU,MAAM;AACd,WAAO,MAAM;AACX,UAAI,CAAC5B,MAAM;AACG6B,mBAAAA,CAAAA,MACVC,OAAOC,QAAQF,CAAC,EAAEG,OAChB,CAACC,KAAK,CAACC,KAAKC,KAAK,OAAO;AAAA,UACtB,GAAGF;AAAAA,UACH,CAAC,CAACC,GAAG,GAAG;AAAA,YACN,GAAGC;AAAAA,YACHC,SAAS;AAAA,UACX;AAAA,QAAA,IAEF,CACF,CAAA,CACF;AACAb,eAAO,CAAC;AAAA,MACV;AAAA,IAAA;AAAA,EACF,GACC,CAACvB,IAAI,CAAC;AAEHqC,QAAAA,QAAQC,QACZ,OAAO;AAAA,IAAEpB;AAAAA,IAASC;AAAAA,IAAYR;AAAAA,IAASU;AAAAA,IAAYC;AAAAA,IAAKC;AAAAA,EAAAA,IACxD,CAACL,SAASC,YAAYR,SAASU,YAAYC,KAAKC,MAAM,CACxD;AAGE,SAAA,oBAAC,gBAAgB,UAAhB,EAAyB,OACxB,UAAC,qBAAA,mBAAA,EACC,WACA,SAAS;AAAA,IAAEgB,MAAMzB,QAAQyB;AAAAA,EACzB,GAAA,aACA,MACA,GAAIvB,QAEJ,UAAA;AAAA,IAAA,oBAAC,eACC,EAAA,OACA,YACA,QACA,YAAuB;AAAA,IAExB,oBAAA,iBAAA,EACC,SACA,aACA,gBAECpB,UACH;AAAA,wBACC,iBACC,EAAA,SACA,WACA,QACA,aACA,cAA2B;AAAA,EAAA,EAE/B,CAAA,EACF,CAAA;AAEJ;"}
@@ -1,9 +1,9 @@
1
+ import { jsxs, jsx } from "@emotion/react/jsx-runtime";
1
2
  import { useContext, useState, useEffect, useCallback } from "react";
2
3
  import { HvDialogActions, HvButton } from "@hitachivantara/uikit-react-core";
3
4
  import { Backwards, Forwards } from "@hitachivantara/uikit-react-icons";
4
5
  import { useClasses } from "./WizardActions.styles.js";
5
6
  import { staticClasses } from "./WizardActions.styles.js";
6
- import { jsxs, jsx } from "@emotion/react/jsx-runtime";
7
7
  import HvWizardContext from "../WizardContext/WizardContext.js";
8
8
  const HvWizardActions = ({
9
9
  classes: classesProp,
@@ -56,50 +56,17 @@ const HvWizardActions = ({
56
56
  setTab(lastPage);
57
57
  }, [setTab, lastPage, setContext]);
58
58
  const handleSubmitInternal = useCallback(() => handleSubmit(context), [handleSubmit, context]);
59
- return /* @__PURE__ */ jsxs(HvDialogActions, {
60
- className: classes.actionsContainer,
61
- children: [/* @__PURE__ */ jsx(HvButton, {
62
- variant: "secondaryGhost",
63
- onClick: handleClose,
64
- className: classes.buttonWidth,
65
- children: `${labels.cancel ?? "Cancel"}`
66
- }), skippable && /* @__PURE__ */ jsx(HvButton, {
67
- variant: "secondaryGhost",
68
- disabled: isLastPage,
69
- className: classes.buttonWidth,
70
- onClick: handleSkip,
71
- children: `${labels.skip ?? "Skip"}`
72
- }), /* @__PURE__ */ jsx("div", {
73
- "aria-hidden": true,
74
- className: css({
75
- flex: 1
76
- }),
77
- children: " "
78
- }), /* @__PURE__ */ jsxs("div", {
79
- className: classes.buttonsContainer,
80
- children: [/* @__PURE__ */ jsx(HvButton, {
81
- variant: "secondaryGhost",
82
- className: classes.buttonWidth,
83
- disabled: tab <= 0,
84
- onClick: () => setTab((t) => t - 1),
85
- startIcon: /* @__PURE__ */ jsx(Backwards, {}),
86
- children: `${labels.previous ?? "Previous"}`
87
- }), isLastPage ? /* @__PURE__ */ jsx(HvButton, {
88
- variant: "primary",
89
- className: classes.buttonWidth,
90
- disabled: loading || !canSubmit,
91
- onClick: handleSubmitInternal,
92
- children: `${labels.submit ?? "Submit"}`
93
- }) : /* @__PURE__ */ jsx(HvButton, {
94
- variant: "secondaryGhost",
95
- className: cx(classes.buttonWidth, classes.buttonSpacing),
96
- onClick: () => setTab((t) => t + 1),
97
- disabled: !skippable && !((_a = context == null ? void 0 : context[tab]) == null ? void 0 : _a.valid),
98
- endIcon: /* @__PURE__ */ jsx(Forwards, {}),
99
- children: `${labels.next ?? "Next"}`
100
- })]
101
- })]
102
- });
59
+ return /* @__PURE__ */ jsxs(HvDialogActions, { className: classes.actionsContainer, children: [
60
+ /* @__PURE__ */ jsx(HvButton, { variant: "secondaryGhost", onClick: handleClose, className: classes.buttonWidth, children: `${labels.cancel ?? "Cancel"}` }),
61
+ skippable && /* @__PURE__ */ jsx(HvButton, { variant: "secondaryGhost", disabled: isLastPage, className: classes.buttonWidth, onClick: handleSkip, children: `${labels.skip ?? "Skip"}` }),
62
+ /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: css({
63
+ flex: 1
64
+ }), children: " " }),
65
+ /* @__PURE__ */ jsxs("div", { className: classes.buttonsContainer, children: [
66
+ /* @__PURE__ */ jsx(HvButton, { variant: "secondaryGhost", className: classes.buttonWidth, disabled: tab <= 0, onClick: () => setTab((t) => t - 1), startIcon: /* @__PURE__ */ jsx(Backwards, {}), children: `${labels.previous ?? "Previous"}` }),
67
+ isLastPage ? /* @__PURE__ */ jsx(HvButton, { variant: "primary", className: classes.buttonWidth, disabled: loading || !canSubmit, onClick: handleSubmitInternal, children: `${labels.submit ?? "Submit"}` }) : /* @__PURE__ */ jsx(HvButton, { variant: "secondaryGhost", className: cx(classes.buttonWidth, classes.buttonSpacing), onClick: () => setTab((t) => t + 1), disabled: !skippable && !((_a = context == null ? void 0 : context[tab]) == null ? void 0 : _a.valid), endIcon: /* @__PURE__ */ jsx(Forwards, {}), children: `${labels.next ?? "Next"}` })
68
+ ] })
69
+ ] });
103
70
  };
104
71
  export {
105
72
  HvWizardActions,
@@ -1 +1 @@
1
- {"version":3,"file":"WizardActions.js","sources":["../../../../../src/components/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":["HvWizardActions","classes","classesProp","handleClose","handleSubmit","loading","skippable","labels","cancel","next","previous","skip","submit","css","cx","useClasses","context","setContext","tab","setTab","useContext","HvWizardContext","pages","setPages","useState","canSubmit","setCanSubmit","useEffect","contextEntries","Object","entries","length","validWizard","every","value","valid","lastPage","isLastPage","handleSkip","useCallback","c","reduce","acc","key","child","handleSubmitInternal","HvDialogActions","className","actionsContainer","children","_jsx","HvButton","variant","onClick","buttonWidth","disabled","flex","_jsxs","buttonsContainer","t","startIcon","Backwards","buttonSpacing","endIcon","Forwards"],"mappings":"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"}
1
+ {"version":3,"file":"WizardActions.js","sources":["../../../../../src/components/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":["HvWizardActions","classes","classesProp","handleClose","handleSubmit","loading","skippable","labels","cancel","next","previous","skip","submit","css","cx","useClasses","context","setContext","tab","setTab","useContext","HvWizardContext","pages","setPages","useState","canSubmit","setCanSubmit","useEffect","contextEntries","Object","entries","length","validWizard","every","value","valid","lastPage","isLastPage","handleSkip","useCallback","c","reduce","acc","key","child","handleSubmitInternal","actionsContainer","buttonWidth","flex","buttonsContainer","t","buttonSpacing"],"mappings":"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"}
@@ -1,7 +1,7 @@
1
+ import { jsx } from "@emotion/react/jsx-runtime";
1
2
  import { HvDialog } from "@hitachivantara/uikit-react-core";
2
3
  import { useClasses } from "./WizardContainer.styles.js";
3
4
  import { staticClasses } from "./WizardContainer.styles.js";
4
- import { jsx } from "@emotion/react/jsx-runtime";
5
5
  const HvWizardContainer = ({
6
6
  classes: classesProp,
7
7
  className,
@@ -13,18 +13,10 @@ const HvWizardContainer = ({
13
13
  const {
14
14
  classes
15
15
  } = useClasses(classesProp);
16
- return /* @__PURE__ */ jsx(HvDialog, {
17
- classes: {
18
- closeButton: classes.closeButton,
19
- paper: classes.paper
20
- },
21
- className: classes.root,
22
- open,
23
- onClose: handleClose,
24
- maxWidth: "lg",
25
- ...others,
26
- children
27
- });
16
+ return /* @__PURE__ */ jsx(HvDialog, { classes: {
17
+ closeButton: classes.closeButton,
18
+ paper: classes.paper
19
+ }, className: classes.root, open, onClose: handleClose, maxWidth: "lg", ...others, children });
28
20
  };
29
21
  export {
30
22
  HvWizardContainer,
@@ -1 +1 @@
1
- {"version":3,"file":"WizardContainer.js","sources":["../../../../../src/components/Wizard/WizardContainer/WizardContainer.tsx"],"sourcesContent":["import React from \"react\";\n\nimport {\n ExtractNames,\n HvBaseProps,\n HvDialog,\n HvDialogProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { staticClasses, useClasses } from \"./WizardContainer.styles\";\n\nexport { staticClasses as wizardContainerClasses };\n\nexport type HvWizardContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvWizardContainerProps\n extends Omit<HvBaseProps, \"onClose\">,\n Pick<HvDialogProps, \"maxWidth\" | \"fullWidth\"> {\n /** Current state of the Wizard. */\n open: boolean;\n /** Function executed on close. */\n handleClose: (\n event: React.SyntheticEvent,\n reason?: \"escapeKeyDown\" | \"backdropClick\"\n ) => void;\n /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n classes?: HvWizardContainerClasses;\n}\n\nexport const HvWizardContainer = ({\n classes: classesProp,\n className,\n children,\n handleClose,\n open,\n ...others\n}: HvWizardContainerProps) => {\n const { classes } = useClasses(classesProp);\n\n return (\n <HvDialog\n classes={{\n closeButton: classes.closeButton,\n paper: classes.paper,\n }}\n className={classes.root}\n open={open}\n onClose={handleClose}\n maxWidth=\"lg\"\n {...others}\n >\n {children}\n </HvDialog>\n );\n};\n"],"names":["HvWizardContainer","classes","classesProp","className","children","handleClose","open","others","useClasses","HvDialog","closeButton","paper","root","onClose","maxWidth"],"mappings":";;;;AA6BO,MAAMA,oBAAoBA,CAAC;AAAA,EAChCC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACmB,MAAM;AACtB,QAAA;AAAA,IAAEN;AAAAA,EAAAA,IAAYO,WAAWN,WAAW;AAE1C,6BACGO,UAAQ;AAAA,IACPR,SAAS;AAAA,MACPS,aAAaT,QAAQS;AAAAA,MACrBC,OAAOV,QAAQU;AAAAA,IACjB;AAAA,IACAR,WAAWF,QAAQW;AAAAA,IACnBN;AAAAA,IACAO,SAASR;AAAAA,IACTS,UAAS;AAAA,IAAI,GACTP;AAAAA,IAAMH;AAAAA,EAAAA,CAGF;AAEd;"}
1
+ {"version":3,"file":"WizardContainer.js","sources":["../../../../../src/components/Wizard/WizardContainer/WizardContainer.tsx"],"sourcesContent":["import React from \"react\";\n\nimport {\n ExtractNames,\n HvBaseProps,\n HvDialog,\n HvDialogProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { staticClasses, useClasses } from \"./WizardContainer.styles\";\n\nexport { staticClasses as wizardContainerClasses };\n\nexport type HvWizardContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvWizardContainerProps\n extends Omit<HvBaseProps, \"onClose\">,\n Pick<HvDialogProps, \"maxWidth\" | \"fullWidth\"> {\n /** Current state of the Wizard. */\n open: boolean;\n /** Function executed on close. */\n handleClose: (\n event: React.SyntheticEvent,\n reason?: \"escapeKeyDown\" | \"backdropClick\"\n ) => void;\n /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n classes?: HvWizardContainerClasses;\n}\n\nexport const HvWizardContainer = ({\n classes: classesProp,\n className,\n children,\n handleClose,\n open,\n ...others\n}: HvWizardContainerProps) => {\n const { classes } = useClasses(classesProp);\n\n return (\n <HvDialog\n classes={{\n closeButton: classes.closeButton,\n paper: classes.paper,\n }}\n className={classes.root}\n open={open}\n onClose={handleClose}\n maxWidth=\"lg\"\n {...others}\n >\n {children}\n </HvDialog>\n );\n};\n"],"names":["HvWizardContainer","classes","classesProp","className","children","handleClose","open","others","useClasses","closeButton","paper","root"],"mappings":";;;;AA6BO,MAAMA,oBAAoBA,CAAC;AAAA,EAChCC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACmB,MAAM;AACtB,QAAA;AAAA,IAAEN;AAAAA,EAAAA,IAAYO,WAAWN,WAAW;AAGxC,SAAA,oBAAC,YACC,SAAS;AAAA,IACPO,aAAaR,QAAQQ;AAAAA,IACrBC,OAAOT,QAAQS;AAAAA,EACjB,GACA,WAAWT,QAAQU,MACnB,MACA,SAASN,aACT,UAAS,MACLE,GAAAA,QAEHH,SACH,CAAA;AAEJ;"}
@@ -1,6 +1,6 @@
1
+ import { jsxs, Fragment, jsx } from "@emotion/react/jsx-runtime";
1
2
  import { HvLoading } from "@hitachivantara/uikit-react-core";
2
3
  import { useClasses } from "./LoadingContainer.styles.js";
3
- import { jsxs, Fragment, jsx } from "@emotion/react/jsx-runtime";
4
4
  const LoadingContainer = ({
5
5
  children,
6
6
  hidden,
@@ -11,31 +11,21 @@ const LoadingContainer = ({
11
11
  classes,
12
12
  cx
13
13
  } = useClasses(classesProp);
14
- return /* @__PURE__ */ jsxs(Fragment, {
15
- children: [/* @__PURE__ */ jsx("div", {
16
- style: {
17
- top: 0,
18
- left: 0,
19
- height: "100%",
20
- width: "100%"
21
- },
22
- className: cx(classes.overlay, {
23
- [classes.blur]: !hidden
24
- }),
25
- children: /* @__PURE__ */ jsx(HvLoading, {
26
- classes: {
27
- root: classes.loading
28
- },
29
- hidden,
30
- ...others
31
- })
32
- }), /* @__PURE__ */ jsx("div", {
33
- style: {
34
- display: "flow-root"
35
- },
36
- children
37
- })]
38
- });
14
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
15
+ /* @__PURE__ */ jsx("div", { style: {
16
+ top: 0,
17
+ left: 0,
18
+ height: "100%",
19
+ width: "100%"
20
+ }, className: cx(classes.overlay, {
21
+ [classes.blur]: !hidden
22
+ }), children: /* @__PURE__ */ jsx(HvLoading, { classes: {
23
+ root: classes.loading
24
+ }, hidden, ...others }) }),
25
+ /* @__PURE__ */ jsx("div", { style: {
26
+ display: "flow-root"
27
+ }, children })
28
+ ] });
39
29
  };
40
30
  export {
41
31
  LoadingContainer
@@ -1 +1 @@
1
- {"version":3,"file":"LoadingContainer.js","sources":["../../../../../src/components/Wizard/WizardContent/LoadingContainer.tsx"],"sourcesContent":["import {\n HvLoading,\n HvLoadingProps,\n ExtractNames,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./LoadingContainer.styles\";\n\ntype HvWizardLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\ninterface LoadingContainerProps extends Omit<HvLoadingProps, \"classes\"> {\n classes?: HvWizardLoadingContainerClasses;\n}\n\nexport const LoadingContainer = ({\n children,\n hidden,\n classes: classesProp,\n ...others\n}: LoadingContainerProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <>\n <div\n style={{\n top: 0,\n left: 0,\n height: \"100%\",\n width: \"100%\",\n }}\n className={cx(classes.overlay, { [classes.blur]: !hidden })}\n >\n <HvLoading\n classes={{\n root: classes.loading,\n }}\n hidden={hidden}\n {...others}\n />\n </div>\n <div style={{ display: \"flow-root\" }}>{children}</div>\n </>\n );\n};\n"],"names":["LoadingContainer","children","hidden","classes","classesProp","others","cx","useClasses","_Fragment","_jsx","style","top","left","height","width","className","overlay","blur","HvLoading","root","loading","display"],"mappings":";;;AAcO,MAAMA,mBAAmBA,CAAC;AAAA,EAC/BC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACT,GAAGC;AACkB,MAAM;AACrB,QAAA;AAAA,IAAEF;AAAAA,IAASG;AAAAA,EAAAA,IAAOC,WAAWH,WAAW;AAE9C,8BACEI,UAAA;AAAA,IAAAP,WACEQ,oBAAA,OAAA;AAAA,MACEC,OAAO;AAAA,QACLC,KAAK;AAAA,QACLC,MAAM;AAAA,QACNC,QAAQ;AAAA,QACRC,OAAO;AAAA,MACT;AAAA,MACAC,WAAWT,GAAGH,QAAQa,SAAS;AAAA,QAAE,CAACb,QAAQc,IAAI,GAAG,CAACf;AAAAA,MAAAA,CAAQ;AAAA,MAAED,8BAE3DiB,WAAS;AAAA,QACRf,SAAS;AAAA,UACPgB,MAAMhB,QAAQiB;AAAAA,QAChB;AAAA,QACAlB;AAAAA,QAAe,GACXG;AAAAA,MAAAA,CACL;AAAA,IAAA,CACE,GACLI,oBAAA,OAAA;AAAA,MAAKC,OAAO;AAAA,QAAEW,SAAS;AAAA,MAAY;AAAA,MAAEpB;AAAAA,IAAAA,CAAgB,CAAC;AAAA,EAAA,CACtD;AAEN;"}
1
+ {"version":3,"file":"LoadingContainer.js","sources":["../../../../../src/components/Wizard/WizardContent/LoadingContainer.tsx"],"sourcesContent":["import {\n HvLoading,\n HvLoadingProps,\n ExtractNames,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./LoadingContainer.styles\";\n\ntype HvWizardLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\ninterface LoadingContainerProps extends Omit<HvLoadingProps, \"classes\"> {\n classes?: HvWizardLoadingContainerClasses;\n}\n\nexport const LoadingContainer = ({\n children,\n hidden,\n classes: classesProp,\n ...others\n}: LoadingContainerProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <>\n <div\n style={{\n top: 0,\n left: 0,\n height: \"100%\",\n width: \"100%\",\n }}\n className={cx(classes.overlay, { [classes.blur]: !hidden })}\n >\n <HvLoading\n classes={{\n root: classes.loading,\n }}\n hidden={hidden}\n {...others}\n />\n </div>\n <div style={{ display: \"flow-root\" }}>{children}</div>\n </>\n );\n};\n"],"names":["LoadingContainer","children","hidden","classes","classesProp","others","cx","useClasses","top","left","height","width","overlay","blur","root","loading","display"],"mappings":";;;AAcO,MAAMA,mBAAmBA,CAAC;AAAA,EAC/BC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACT,GAAGC;AACkB,MAAM;AACrB,QAAA;AAAA,IAAEF;AAAAA,IAASG;AAAAA,EAAAA,IAAOC,WAAWH,WAAW;AAE9C,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA,oBAAC,SACC,OAAO;AAAA,MACLI,KAAK;AAAA,MACLC,MAAM;AAAA,MACNC,QAAQ;AAAA,MACRC,OAAO;AAAA,IAET,GAAA,WAAWL,GAAGH,QAAQS,SAAS;AAAA,MAAE,CAACT,QAAQU,IAAI,GAAG,CAACX;AAAAA,IAAQ,CAAA,GAE1D,UAAC,oBAAA,WAAA,EACC,SAAS;AAAA,MACPY,MAAMX,QAAQY;AAAAA,IAEhB,GAAA,QACIV,GAAAA,OAAO,CAAA,GAEf;AAAA,IACA,oBAAC,SAAI,OAAO;AAAA,MAAEW,SAAS;AAAA,OAAgBf,SAAS,CAAA;AAAA,EAClD,EAAA,CAAA;AAEJ;"}