@hitachivantara/uikit-react-lab 5.4.7 → 5.4.8

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 (29) hide show
  1. package/dist/cjs/components/StepNavigation/DefaultNavigation/DefaultNavigation.cjs.map +1 -1
  2. package/dist/cjs/components/StepNavigation/DefaultNavigation/Step/Step.cjs.map +1 -1
  3. package/dist/cjs/components/StepNavigation/DefaultNavigation/Step/Step.styles.cjs.map +1 -1
  4. package/dist/cjs/components/StepNavigation/SimpleNavigation/Dot/Dot.cjs.map +1 -1
  5. package/dist/cjs/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.cjs.map +1 -1
  6. package/dist/cjs/components/StepNavigation/SimpleNavigation/SimpleNavigation.cjs.map +1 -1
  7. package/dist/cjs/components/StepNavigation/StepNavigation.cjs.map +1 -1
  8. package/dist/cjs/components/Wizard/Wizard.cjs.map +1 -1
  9. package/dist/cjs/components/Wizard/WizardActions/WizardActions.cjs.map +1 -1
  10. package/dist/cjs/components/Wizard/WizardContainer/WizardContainer.cjs.map +1 -1
  11. package/dist/cjs/components/Wizard/WizardContent/LoadingContainer.cjs.map +1 -1
  12. package/dist/cjs/components/Wizard/WizardContent/WizardContent.cjs.map +1 -1
  13. package/dist/cjs/components/Wizard/WizardContent/loadingContainerClasses.cjs.map +1 -1
  14. package/dist/cjs/components/Wizard/WizardTitle/WizardTitle.cjs.map +1 -1
  15. package/dist/esm/components/StepNavigation/DefaultNavigation/DefaultNavigation.js.map +1 -1
  16. package/dist/esm/components/StepNavigation/DefaultNavigation/Step/Step.js.map +1 -1
  17. package/dist/esm/components/StepNavigation/DefaultNavigation/Step/Step.styles.js.map +1 -1
  18. package/dist/esm/components/StepNavigation/SimpleNavigation/Dot/Dot.js.map +1 -1
  19. package/dist/esm/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.js.map +1 -1
  20. package/dist/esm/components/StepNavigation/SimpleNavigation/SimpleNavigation.js.map +1 -1
  21. package/dist/esm/components/StepNavigation/StepNavigation.js.map +1 -1
  22. package/dist/esm/components/Wizard/Wizard.js.map +1 -1
  23. package/dist/esm/components/Wizard/WizardActions/WizardActions.js.map +1 -1
  24. package/dist/esm/components/Wizard/WizardContainer/WizardContainer.js.map +1 -1
  25. package/dist/esm/components/Wizard/WizardContent/LoadingContainer.js.map +1 -1
  26. package/dist/esm/components/Wizard/WizardContent/WizardContent.js.map +1 -1
  27. package/dist/esm/components/Wizard/WizardContent/loadingContainerClasses.js.map +1 -1
  28. package/dist/esm/components/Wizard/WizardTitle/WizardTitle.js.map +1 -1
  29. package/package.json +7 -4
@@ -1 +1 @@
1
- {"version":3,"file":"DefaultNavigation.cjs","sources":["../../../../../src/components/StepNavigation/DefaultNavigation/DefaultNavigation.tsx"],"sourcesContent":["import {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvDefaultNavigationClasses } from \"./defaultNavigationClasses\";\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 JSX.element 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 ) => JSX.Element | null;\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 /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvDefaultNavigationClasses;\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":["HvDefaultNavigation","numSteps","stepSize","getTitles","getDynamicValues","className","children","other","activeTheme","useTheme","container","maxSize","avatar","minSize","stepSizes","StepComponent","HvStep","stepsWidth","width","titleWidth","separatorWidth","maxWidth","Math","max","minWidth","Steps","titles","state","variant","titleDisabled","_jsx","navWidth","separatorValues","getColor","height","stepNavigation","defaultSeparatorHeight","stepValues"],"mappings":";;;;;;AAmDO,MAAMA,sBAAsBA,CAAC;AAAA,EAClCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACqB,MAAM;AACxB,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,eAAU,SAAA;AAG5B,QAAA;AAAA,IAAEC,WAAWC;AAAAA,IAASC,QAAQC;AAAAA,EAAAA,IAAYC,MAAAA,UAAUZ,QAAQ;AAClE,QAAMa,gBAAgBC,KAAAA;AAGhBC,QAAAA,aAAaN,UAAUE,WAAWZ,WAAW;AAC7C,QAAA;AAAA,IAAEiB;AAAAA,IAAOC;AAAAA,IAAYC;AAAAA,EAAAA,IAAmBhB,iBAAiBa,UAAU;AAGzE,QAAMI,WAAWC,KAAKC,IAAIJ,aAAaN,SAASO,cAAc;AAC9D,QAAMI,WAAWF,KAAKC,IACpBJ,cAAcR,UAAUE,WAAW,KACnCO,cAAc;AAIhB,QAAMK,QAAQnB;AAERoB,QAAAA,SAASvB,UAAU,CAAC;AAAA,IAAEwB;AAAAA,EAAAA,OAAa;AAAA,IACvCC,SAAS;AAAA,IACTT;AAAAA,IACAU,eAAeF,UAAU;AAAA,EACzB,EAAA;AAEF,yCACE,OAAA;AAAA,IAAA,GAASpB;AAAAA,IAAKD,UAAA,CACZwB,2BAAAA,IAACL,OAAK;AAAA,MAEFR;AAAAA,MACAc,UAAUb;AAAAA,MACVc,iBAAiB;AAAA,QACfR;AAAAA,QACAH;AAAAA,QAAAA,UACAY,MAAAA;AAAAA,QACAC,SAAQ1B,2CAAa2B,eAAeC,2BAA0B;AAAA,MAChE;AAAA,MACAC,YAAY;AAAA,QACVxB;AAAAA,QACAF;AAAAA,QACAI;AAAAA,MACF;AAAA,IAAC,CAAA,GAGJW,MAAM;AAAA,EAAA,CACH;AAEV;;"}
1
+ {"version":3,"file":"DefaultNavigation.cjs","sources":["../../../../../src/components/StepNavigation/DefaultNavigation/DefaultNavigation.tsx"],"sourcesContent":["import {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvDefaultNavigationClasses } from \"./defaultNavigationClasses\";\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 JSX.element 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 ) => JSX.Element | null;\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 /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvDefaultNavigationClasses;\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":["HvDefaultNavigation","numSteps","stepSize","getTitles","getDynamicValues","className","children","other","activeTheme","useTheme","container","maxSize","avatar","minSize","stepSizes","StepComponent","HvStep","stepsWidth","width","titleWidth","separatorWidth","maxWidth","Math","max","minWidth","Steps","titles","state","variant","titleDisabled","_jsx","navWidth","separatorValues","getColor","height","stepNavigation","defaultSeparatorHeight","stepValues"],"mappings":";;;;;;AAmDO,MAAMA,sBAAsBA,CAAC;AAAA,EAClCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACqB,MAAM;AACxB,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,eAAS,SAAA;AAG3B,QAAA;AAAA,IAAEC,WAAWC;AAAAA,IAASC,QAAQC;AAAAA,EAAAA,IAAYC,MAAAA,UAAUZ,QAAQ;AAClE,QAAMa,gBAAgBC,KAAAA;AAGhBC,QAAAA,aAAaN,UAAUE,WAAWZ,WAAW;AAC7C,QAAA;AAAA,IAAEiB;AAAAA,IAAOC;AAAAA,IAAYC;AAAAA,EAAAA,IAAmBhB,iBAAiBa,UAAU;AAGzE,QAAMI,WAAWC,KAAKC,IAAIJ,aAAaN,SAASO,cAAc;AAC9D,QAAMI,WAAWF,KAAKC,IACpBJ,cAAcR,UAAUE,WAAW,KACnCO,cACF;AAGA,QAAMK,QAAQnB;AAERoB,QAAAA,SAASvB,UAAU,CAAC;AAAA,IAAEwB;AAAAA,EAAAA,OAAa;AAAA,IACvCC,SAAS;AAAA,IACTT;AAAAA,IACAU,eAAeF,UAAU;AAAA,EACzB,EAAA;AAEF,yCACE,OAAA;AAAA,IAAA,GAASpB;AAAAA,IAAKD,UAAA,CACZwB,2BAAAA,IAACL,OAAK;AAAA,MAEFR;AAAAA,MACAc,UAAUb;AAAAA,MACVc,iBAAiB;AAAA,QACfR;AAAAA,QACAH;AAAAA,QAAAA,UACAY,MAAAA;AAAAA,QACAC,SAAQ1B,2CAAa2B,eAAeC,2BAA0B;AAAA,MAChE;AAAA,MACAC,YAAY;AAAA,QACVxB;AAAAA,QACAF;AAAAA,QACAI;AAAAA,MACF;AAAA,IAEH,CAAA,GACAW,MAAM;AAAA,EAAA,CACJ;AAET;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Step.cjs","sources":["../../../../../../src/components/StepNavigation/DefaultNavigation/Step/Step.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n Level0Good,\n Level3Bad,\n HourGlass,\n} from \"@hitachivantara/uikit-react-icons\";\nimport {\n HvAvatarSize,\n HvButtonProps,\n HvBaseProps,\n} from \"@hitachivantara/uikit-react-core\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { StyledRoot, StyledButton, StyledAvatar } from \"./Step.styles\";\nimport stepClasses, { HvStepClasses } from \"./stepClasses\";\nimport { getColor, getSemantic } from \"../utils\";\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,\n state,\n title,\n onClick,\n disabled,\n size = \"md\",\n number = 1,\n}: HvStepProps) => {\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, theme);\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 <StyledRoot\n className={clsx(\n className,\n stepClasses.root,\n classes?.root,\n state !== \"Current\" && clsx(stepClasses.notCurrent, classes?.notCurrent)\n )}\n $notCurrent={state !== \"Current\"}\n >\n <StyledButton\n className={clsx(\n stepClasses.ghost,\n classes?.ghost,\n state === \"Current\" &&\n clsx(stepClasses.ghostDisabled, classes?.ghostDisabled)\n )}\n aria-label={`step-${title}`}\n icon\n variant=\"secondaryGhost\"\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n <StyledAvatar\n className={clsx(\n stepClasses.avatar,\n classes?.avatar,\n stepClasses[size],\n classes?.[size]\n )}\n backgroundColor={backgroundColor}\n status={status}\n size={size}\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 </StyledAvatar>\n </StyledButton>\n </StyledRoot>\n );\n};\n"],"names":["HvStep","className","classes","state","title","onClick","disabled","size","number","iconSize","xs","sm","md","ml","xl","squareL","Pending","Failed","Completed","svgSize","lg","backgroundColor","getColor","theme","color","undefined","semantic","getSemantic","status","IconComponent","HourGlass","Level3Bad","Level0Good","StyledRoot","clsx","stepClasses","root","notCurrent","$notCurrent","children","StyledButton","ghost","ghostDisabled","icon","variant","overrideIconColors","includes","StyledAvatar","avatar","$size","_jsx","width","height"],"mappings":";;;;;;;;;AA6CO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,OAAO;AAAA,EACPC,SAAS;AACE,MAAM;AACjB,QAAMC,WAAW;AAAA,IACfC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJP,IAAI;AAEN,QAAMQ,UAAU;AAAA,IACdC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,WAAW;AAAA,IACXf,KAAK;AAEP,QAAMgB,UAAU;AAAA,IACdT,IAAIK,UAAU;AAAA,IACdJ,IAAII;AAAAA,IACJH,IAAIG,UAAU;AAAA,IACdK,IAAIL,UAAU;AAAA,IACdD,IAAIC,UAAU;AAAA,IACdR,IAAI;AAEAc,QAAAA,kBAAkBC,MAAAA,SAASnB,OAAOoB,YAAK,KAAA;AAEvCC,QAAAA,QAAQrB,UAAU,YAAY,UAAUsB;AAC9C,QAAMC,WAAWvB,UAAU,YAAYwB,MAAAA,YAAYxB,KAAK,IAAIsB;AACtDG,QAAAA,SAASzB,UAAU,YAAY,iBAAiBsB;AAEtD,QAAMI,gBAAgB;AAAA,IACpBb,SAASc,gBAAAA;AAAAA,IACTb,QAAQc,gBAAAA;AAAAA,IACRb,WAAWc,gBAAAA;AAAAA,IACX7B,KAAK;AAEP,wCACG8B,YAAAA,YAAU;AAAA,IACThC,WAAWiC,KAAAA,KACTjC,WACAkC,YAAAA,QAAYC,MACZlC,mCAASkC,MACTjC,UAAU,aAAa+B,KAAKC,KAAAA,YAAAA,QAAYE,YAAYnC,mCAASmC,UAAU,CAAC;AAAA,IAE1EC,aAAanC,UAAU;AAAA,IAAUoC,yCAEhCC,0BAAY;AAAA,MACXvC,WAAWiC,KAAAA,KACTC,YAAAA,QAAYM,OACZvC,mCAASuC,OACTtC,UAAU,aACR+B,KAAKC,KAAAA,YAAAA,QAAYO,eAAexC,mCAASwC,aAAa,CAAC;AAAA,MAE3D,cAAa,QAAOtC;AAAAA,MACpBuC,MAAI;AAAA,MACJC,SAAQ;AAAA,MACRC,oBAAoB;AAAA,MACpBvC,UAAUA,YAAY,CAAC,WAAW,UAAU,EAAEwC,SAAS3C,KAAK;AAAA,MAC5DE;AAAAA,MAAiBkC,yCAEhBQ,0BAAY;AAAA,QACX9C,WAAWiC,KACTC,KAAAA,oBAAYa,QACZ9C,mCAAS8C,QACTb,YAAAA,QAAY5B,IAAI,GAChBL,mCAAUK,KAAK;AAAA,QAEjBc;AAAAA,QACAO;AAAAA,QACArB;AAAAA,QACA0C,OAAO1C;AAAAA,QAAKgC,UAEXV,gBACCqB,2BAAAA,IAACrB,eAAa;AAAA,UACZL;AAAAA,UACAE;AAAAA,UACAyB,OAAOhC;AAAAA,UACPiC,QAAQjC;AAAAA,UACRV;AAAAA,QAAmB,CAAA,IAGrBD;AAAAA,MAAAA,CACD;AAAA,IAAA,CACY;AAAA,EAAA,CAEN;AAEjB;;"}
1
+ {"version":3,"file":"Step.cjs","sources":["../../../../../../src/components/StepNavigation/DefaultNavigation/Step/Step.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n Level0Good,\n Level3Bad,\n HourGlass,\n} from \"@hitachivantara/uikit-react-icons\";\nimport {\n HvAvatarSize,\n HvButtonProps,\n HvBaseProps,\n} from \"@hitachivantara/uikit-react-core\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { StyledRoot, StyledButton, StyledAvatar } from \"./Step.styles\";\nimport stepClasses, { HvStepClasses } from \"./stepClasses\";\nimport { getColor, getSemantic } from \"../utils\";\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,\n state,\n title,\n onClick,\n disabled,\n size = \"md\",\n number = 1,\n}: HvStepProps) => {\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, theme);\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 <StyledRoot\n className={clsx(\n className,\n stepClasses.root,\n classes?.root,\n state !== \"Current\" && clsx(stepClasses.notCurrent, classes?.notCurrent)\n )}\n $notCurrent={state !== \"Current\"}\n >\n <StyledButton\n className={clsx(\n stepClasses.ghost,\n classes?.ghost,\n state === \"Current\" &&\n clsx(stepClasses.ghostDisabled, classes?.ghostDisabled)\n )}\n aria-label={`step-${title}`}\n icon\n variant=\"secondaryGhost\"\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n <StyledAvatar\n className={clsx(\n stepClasses.avatar,\n classes?.avatar,\n stepClasses[size],\n classes?.[size]\n )}\n backgroundColor={backgroundColor}\n status={status}\n size={size}\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 </StyledAvatar>\n </StyledButton>\n </StyledRoot>\n );\n};\n"],"names":["HvStep","className","classes","state","title","onClick","disabled","size","number","iconSize","xs","sm","md","ml","xl","squareL","Pending","Failed","Completed","svgSize","lg","backgroundColor","getColor","theme","color","undefined","semantic","getSemantic","status","IconComponent","HourGlass","Level3Bad","Level0Good","StyledRoot","clsx","stepClasses","root","notCurrent","$notCurrent","children","StyledButton","ghost","ghostDisabled","icon","variant","overrideIconColors","includes","StyledAvatar","avatar","$size","_jsx","width","height"],"mappings":";;;;;;;;;AA6CO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,OAAO;AAAA,EACPC,SAAS;AACE,MAAM;AACjB,QAAMC,WAAW;AAAA,IACfC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJP,IAAI;AAEN,QAAMQ,UAAU;AAAA,IACdC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,WAAW;AAAA,IACXf,KAAK;AAEP,QAAMgB,UAAU;AAAA,IACdT,IAAIK,UAAU;AAAA,IACdJ,IAAII;AAAAA,IACJH,IAAIG,UAAU;AAAA,IACdK,IAAIL,UAAU;AAAA,IACdD,IAAIC,UAAU;AAAA,IACdR,IAAI;AAEAc,QAAAA,kBAAkBC,MAAAA,SAASnB,OAAOoB,YAAK,KAAA;AAEvCC,QAAAA,QAAQrB,UAAU,YAAY,UAAUsB;AAC9C,QAAMC,WAAWvB,UAAU,YAAYwB,MAAAA,YAAYxB,KAAK,IAAIsB;AACtDG,QAAAA,SAASzB,UAAU,YAAY,iBAAiBsB;AAEtD,QAAMI,gBAAgB;AAAA,IACpBb,SAASc,gBAAAA;AAAAA,IACTb,QAAQc,gBAAAA;AAAAA,IACRb,WAAWc,gBAAAA;AAAAA,IACX7B,KAAK;AAEP,wCACG8B,YAAAA,YAAU;AAAA,IACThC,WAAWiC,KAAAA,KACTjC,WACAkC,YAAAA,QAAYC,MACZlC,mCAASkC,MACTjC,UAAU,aAAa+B,KAAKC,KAAAA,YAAAA,QAAYE,YAAYnC,mCAASmC,UAAU,CACzE;AAAA,IACAC,aAAanC,UAAU;AAAA,IAAUoC,yCAEhCC,0BAAY;AAAA,MACXvC,WAAWiC,KAAAA,KACTC,YAAAA,QAAYM,OACZvC,mCAASuC,OACTtC,UAAU,aACR+B,KAAKC,KAAAA,YAAAA,QAAYO,eAAexC,mCAASwC,aAAa,CAC1D;AAAA,MACA,cAAa,QAAOtC;AAAAA,MACpBuC,MAAI;AAAA,MACJC,SAAQ;AAAA,MACRC,oBAAoB;AAAA,MACpBvC,UAAUA,YAAY,CAAC,WAAW,UAAU,EAAEwC,SAAS3C,KAAK;AAAA,MAC5DE;AAAAA,MAAiBkC,yCAEhBQ,0BAAY;AAAA,QACX9C,WAAWiC,KACTC,KAAAA,oBAAYa,QACZ9C,mCAAS8C,QACTb,YAAAA,QAAY5B,IAAI,GAChBL,mCAAUK,KACZ;AAAA,QACAc;AAAAA,QACAO;AAAAA,QACArB;AAAAA,QACA0C,OAAO1C;AAAAA,QAAKgC,UAEXV,gBACCqB,2BAAAA,IAACrB,eAAa;AAAA,UACZL;AAAAA,UACAE;AAAAA,UACAyB,OAAOhC;AAAAA,UACPiC,QAAQjC;AAAAA,UACRV;AAAAA,QACD,CAAA,IAEDD;AAAAA,MAAAA,CAEU;AAAA,IAAA,CACF;AAAA,EAAA,CACJ;AAEhB;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Step.styles.cjs","sources":["../../../../../../src/components/StepNavigation/DefaultNavigation/Step/Step.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { HvAvatar, HvButton } from \"@hitachivantara/uikit-react-core\";\n\nexport const StyledRoot = styled(\"div\")(\n ({ $notCurrent }: { $notCurrent: boolean }) => ({\n ...($notCurrent && {\n margin: \"-8px\",\n }),\n })\n);\n\nexport const StyledButton = styled(HvButton)({\n \"&:hover\": {\n backgroundColor: \"transparent\",\n },\n \"&$ghostDisabled\": {\n cursor: \"default\",\n },\n \"&$ghostDisabled&:hover\": {\n cursor: \"default\",\n },\n});\n\nexport const StyledAvatar = styled(HvAvatar)(\n ({ $size }: { $size: string }) => ({\n ...($size === \"xs\" && {\n fontSize: \"0.625rem\",\n }),\n ...($size === \"sm\" && {\n fontSize: \"1rem\",\n }),\n ...($size === \"md\" && {\n fontSize: \"1.5rem\",\n }),\n ...($size === \"lg\" && {\n fontSize: \"2rem\",\n }),\n ...($size === \"xl\" && {\n fontSize: \"2.5rem\",\n }),\n })\n);\n"],"names":["StyledRoot","_styled","process","env","NODE_ENV","target","label","$notCurrent","margin","StyledButton","HvButton","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledAvatar","HvAvatar","$size","fontSize"],"mappings":";;;;;;;;;AAGO,MAAMA,aAAoBC,iCAAA,QAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACpC,CAAC;AAAA,EAAEC;AAAsC,OAAO;AAAA,EAC9C,GAAIA,eAAe;AAAA,IACjBC,QAAQ;AAAA,EACV;AACF,IAAEN,QAAAC,IAAAC,aACH,eAAA,KAAA,iyDAAA;AAEM,MAAMK,eAAsBC,iCAAAA,QAAAA,eAAAA,UAAQR,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAO,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAU1C;AAEK,MAAMC,eAAsBC,iCAAAA,QAAAA,eAAAA,UAAQf,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACzC,CAAC;AAAA,EAAEY;AAAyB,OAAO;AAAA,EACjC,GAAIA,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AACF,IAAEjB,QAAAC,IAAAC,aACH,eAAA,KAAA,iyDAAA;;;;"}
1
+ {"version":3,"file":"Step.styles.cjs","sources":["../../../../../../src/components/StepNavigation/DefaultNavigation/Step/Step.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { HvAvatar, HvButton } from \"@hitachivantara/uikit-react-core\";\n\nexport const StyledRoot = styled(\"div\")(\n ({ $notCurrent }: { $notCurrent: boolean }) => ({\n ...($notCurrent && {\n margin: \"-8px\",\n }),\n })\n);\n\nexport const StyledButton = styled(HvButton)({\n \"&:hover\": {\n backgroundColor: \"transparent\",\n },\n \"&$ghostDisabled\": {\n cursor: \"default\",\n },\n \"&$ghostDisabled&:hover\": {\n cursor: \"default\",\n },\n});\n\nexport const StyledAvatar = styled(HvAvatar)(\n ({ $size }: { $size: string }) => ({\n ...($size === \"xs\" && {\n fontSize: \"0.625rem\",\n }),\n ...($size === \"sm\" && {\n fontSize: \"1rem\",\n }),\n ...($size === \"md\" && {\n fontSize: \"1.5rem\",\n }),\n ...($size === \"lg\" && {\n fontSize: \"2rem\",\n }),\n ...($size === \"xl\" && {\n fontSize: \"2.5rem\",\n }),\n })\n);\n"],"names":["StyledRoot","_styled","process","env","NODE_ENV","target","label","$notCurrent","margin","StyledButton","HvButton","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledAvatar","HvAvatar","$size","fontSize"],"mappings":";;;;;;;;;AAGO,MAAMA,aAAoBC,iCAAA,QAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACpC,CAAC;AAAA,EAAEC;AAAsC,OAAO;AAAA,EAC9C,GAAIA,eAAe;AAAA,IACjBC,QAAQ;AAAA,EACV;AACF,IAAEN,QAAAC,IAAAC,k0DACJ;AAEO,MAAMK,eAAsBC,iCAAAA,QAAAA,eAAAA,UAAQR,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAO,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAU3C;AAEM,MAAMC,eAAsBC,iCAAAA,QAAAA,eAAAA,UAAQf,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACzC,CAAC;AAAA,EAAEY;AAAyB,OAAO;AAAA,EACjC,GAAIA,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AACF,IAAEjB,QAAAC,IAAAC,k0DACJ;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Dot.cjs","sources":["../../../../../../src/components/StepNavigation/SimpleNavigation/Dot/Dot.tsx"],"sourcesContent":["import { HvBaseProps } from \"@hitachivantara/uikit-react-core\";\nimport { ClassNames } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvStepProps } from \"../../DefaultNavigation\";\nimport { StyledButton } from \"./Dot.styles\";\nimport dotClasses, { HvDotClasses } from \"./dotClasses\";\nimport { getColor, dotSizes } from \"../utils\";\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,\n className,\n state,\n title,\n size = \"sm\",\n onClick,\n disabled,\n}: HvDotProps) => {\n const dotSize = dotSizes[size] * (state === \"Current\" ? 1.5 : 1);\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <StyledButton\n className={cx(\n dotClasses.root,\n state === \"Current\" && dotClasses.active,\n (disabled ?? [\"Current\", \"Disabled\"].includes(state)) &&\n dotClasses.ghostDisabled,\n css({\n backgroundColor: getColor(state, theme),\n width: dotSize,\n height: dotSize,\n \"&:hover\": {\n backgroundColor: getColor(state, theme),\n },\n }),\n className,\n classes?.root,\n state === \"Current\" && classes?.active,\n (disabled ?? [\"Current\", \"Disabled\"].includes(state)) &&\n classes?.ghostDisabled\n )}\n aria-label={`step-${title}`}\n icon\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n {[]}\n </StyledButton>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvDot","classes","className","state","title","size","onClick","disabled","dotSize","dotSizes","ClassNames","children","css","cx","StyledButton","dotClasses","root","active","includes","ghostDisabled","backgroundColor","getColor","theme","width","height","icon","overrideIconColors"],"mappings":";;;;;;;;AAkBO,MAAMA,QAAQA,CAAC;AAAA,EACpBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,OAAO;AAAA,EACPC;AAAAA,EACAC;AACU,MAAM;AAChB,QAAMC,UAAUC,MAASJ,SAAAA,IAAI,KAAKF,UAAU,YAAY,MAAM;AAE9D,wCACGO,MAAAA,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA,qCACNC,WAAAA,cAAY;AAAA,MACXZ,WAAWW,GACTE,mBAAWC,MACXb,UAAU,aAAaY,mBAAWE,SACjCV,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK,MACjDY,WAAAA,QAAWI,eACbP,IAAI;AAAA,QACFQ,iBAAiBC,MAAAA,SAASlB,OAAOmB,iBAAK;AAAA,QACtCC,OAAOf;AAAAA,QACPgB,QAAQhB;AAAAA,QACR,WAAW;AAAA,UACTY,iBAAiBC,MAAAA,SAASlB,OAAOmB,iBAAK;AAAA,QACxC;AAAA,MAAA,CACD,GACDpB,WACAD,mCAASe,MACTb,UAAU,cAAaF,mCAASgB,UAC/BV,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK,OACjDF,mCAASkB,cAAa;AAAA,MAE1B,cAAa,QAAOf;AAAAA,MACpBqB,MAAI;AAAA,MACJC,oBAAoB;AAAA,MACpBnB,UAAUA,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK;AAAA,MAC5DG;AAAAA,MAAiBK,UAEhB,CAAA;AAAA,IAAA,CAAE;AAAA,EAAA,CAGI;AAEjB;;"}
1
+ {"version":3,"file":"Dot.cjs","sources":["../../../../../../src/components/StepNavigation/SimpleNavigation/Dot/Dot.tsx"],"sourcesContent":["import { HvBaseProps } from \"@hitachivantara/uikit-react-core\";\nimport { ClassNames } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvStepProps } from \"../../DefaultNavigation\";\nimport { StyledButton } from \"./Dot.styles\";\nimport dotClasses, { HvDotClasses } from \"./dotClasses\";\nimport { getColor, dotSizes } from \"../utils\";\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,\n className,\n state,\n title,\n size = \"sm\",\n onClick,\n disabled,\n}: HvDotProps) => {\n const dotSize = dotSizes[size] * (state === \"Current\" ? 1.5 : 1);\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <StyledButton\n className={cx(\n dotClasses.root,\n state === \"Current\" && dotClasses.active,\n (disabled ?? [\"Current\", \"Disabled\"].includes(state)) &&\n dotClasses.ghostDisabled,\n css({\n backgroundColor: getColor(state, theme),\n width: dotSize,\n height: dotSize,\n \"&:hover\": {\n backgroundColor: getColor(state, theme),\n },\n }),\n className,\n classes?.root,\n state === \"Current\" && classes?.active,\n (disabled ?? [\"Current\", \"Disabled\"].includes(state)) &&\n classes?.ghostDisabled\n )}\n aria-label={`step-${title}`}\n icon\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n {[]}\n </StyledButton>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvDot","classes","className","state","title","size","onClick","disabled","dotSize","dotSizes","ClassNames","children","css","cx","StyledButton","dotClasses","root","active","includes","ghostDisabled","backgroundColor","getColor","theme","width","height","icon","overrideIconColors"],"mappings":";;;;;;;;AAkBO,MAAMA,QAAQA,CAAC;AAAA,EACpBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,OAAO;AAAA,EACPC;AAAAA,EACAC;AACU,MAAM;AAChB,QAAMC,UAAUC,MAASJ,SAAAA,IAAI,KAAKF,UAAU,YAAY,MAAM;AAE9D,wCACGO,MAAAA,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA,qCACNC,WAAAA,cAAY;AAAA,MACXZ,WAAWW,GACTE,mBAAWC,MACXb,UAAU,aAAaY,mBAAWE,SACjCV,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK,MACjDY,WAAAA,QAAWI,eACbP,IAAI;AAAA,QACFQ,iBAAiBC,MAAAA,SAASlB,OAAOmB,iBAAK;AAAA,QACtCC,OAAOf;AAAAA,QACPgB,QAAQhB;AAAAA,QACR,WAAW;AAAA,UACTY,iBAAiBC,MAAAA,SAASlB,OAAOmB,iBAAK;AAAA,QACxC;AAAA,MAAA,CACD,GACDpB,WACAD,mCAASe,MACTb,UAAU,cAAaF,mCAASgB,UAC/BV,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK,OACjDF,mCAASkB,cACb;AAAA,MACA,cAAa,QAAOf;AAAAA,MACpBqB,MAAI;AAAA,MACJC,oBAAoB;AAAA,MACpBnB,UAAUA,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK;AAAA,MAC5DG;AAAAA,MAAiBK,UAEhB,CAAA;AAAA,IAAA,CACW;AAAA,EAAA,CAEN;AAEhB;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Dot.styles.cjs","sources":["../../../../../../src/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { HvButton } from \"@hitachivantara/uikit-react-core\";\n\nexport const StyledButton = styled(HvButton)({\n borderRadius: \"50%\",\n zIndex: 1,\n});\n"],"names":["StyledButton","HvButton","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__"],"mappings":";;;;;;;;;AAGO,MAAMA,eAAsBC,iCAAAA,QAAAA,eAAAA,UAAQC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAG1C;;"}
1
+ {"version":3,"file":"Dot.styles.cjs","sources":["../../../../../../src/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { HvButton } from \"@hitachivantara/uikit-react-core\";\n\nexport const StyledButton = styled(HvButton)({\n borderRadius: \"50%\",\n zIndex: 1,\n});\n"],"names":["StyledButton","HvButton","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__"],"mappings":";;;;;;;;;AAGO,MAAMA,eAAsBC,iCAAAA,QAAAA,eAAAA,UAAQC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAG3C;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"SimpleNavigation.cjs","sources":["../../../../../src/components/StepNavigation/SimpleNavigation/SimpleNavigation.tsx"],"sourcesContent":["import {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvStepNavigationProps } from \"../StepNavigation\";\nimport { HvDot, HvDotProps } from \"./Dot\";\nimport { HvSimpleNavigationClasses } from \"./simpleNavigationClasses\";\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\n extends Pick<HvStepNavigationProps, \"stepSize\">,\n Omit<HvBaseProps, \"children\"> {\n /** Number of steps to show on the component. */\n numSteps: number;\n /** Returns a JSX.element 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 ) => JSX.Element | null;\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 /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvSimpleNavigationClasses;\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":["HvSimpleNavigation","numSteps","stepSize","getTitles","getDynamicValues","children","others","activeTheme","useTheme","dotSize","dotSizes","StepComponent","HvDot","stepsWidth","width","titleWidth","separatorWidth","maxWidth","Math","max","minWidth","Steps","titles","rawTitle","number","variant","title","_jsx","navWidth","separatorValues","getColor","height","stepNavigation","simpleSeparatorHeight","stepValues","minSize","maxSize"],"mappings":";;;;;;AAmDO,MAAMA,qBAAqBA,CAAC;AAAA,EACjCC;AAAAA,EACAC,WAAW;AAAA,EACXC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACoB,MAAM;AACvB,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,eAAU,SAAA;AAG5BC,QAAAA,UAAUC,eAASR,QAAQ;AACjC,QAAMS,gBAAgBC,IAAAA;AAGhBC,QAAAA,cAAcZ,WAAW,OAAOQ;AAChC,QAAA;AAAA,IAAEK;AAAAA,IAAOC;AAAAA,IAAYC;AAAAA,EAAAA,IAAmBZ,iBAAiBS,UAAU;AAGzE,QAAMI,WAAWC,KAAKC,IAAIJ,aAAaN,SAASO,cAAc;AAC9D,QAAMI,WAAWF,KAAKC,IAAIJ,aAAaN,UAAU,MAAMO,cAAc;AAGrE,QAAMK,QAAQhB;AAERiB,QAAAA,SAASnB,UAAU,CAAC;AAAA,IAAEoB;AAAAA,IAAUC;AAAAA,EAAAA,OAAc;AAAA,IAClDC,SAAS;AAAA,IACTC,OAAQ,GAAEF,WAAWD;AAAAA,IACrBR;AAAAA,EACA,EAAA;AAEF,yCACE,OAAA;AAAA,IAAA,GAAST;AAAAA,IAAMD,UACZiB,CAAAA,QACDK,2BAAAA,IAACN,OAAK;AAAA,MAEFR;AAAAA,MACAe,UAAUd;AAAAA,MACVe,iBAAiB;AAAA,QACfT;AAAAA,QACAH;AAAAA,QAAAA,UACAa,MAAAA;AAAAA,QACAC,SAAQxB,2CAAayB,eAAeC,0BAAyB;AAAA,MAC/D;AAAA,MACAC,YAAY;AAAA,QACVC,SAAS1B;AAAAA,QACT2B,SAAS,MAAM3B;AAAAA,QACfE;AAAAA,MACF;AAAA,IAAA,CAEF,CAAA;AAAA,EAAA,CACE;AAEV;;"}
1
+ {"version":3,"file":"SimpleNavigation.cjs","sources":["../../../../../src/components/StepNavigation/SimpleNavigation/SimpleNavigation.tsx"],"sourcesContent":["import {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvStepNavigationProps } from \"../StepNavigation\";\nimport { HvDot, HvDotProps } from \"./Dot\";\nimport { HvSimpleNavigationClasses } from \"./simpleNavigationClasses\";\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\n extends Pick<HvStepNavigationProps, \"stepSize\">,\n Omit<HvBaseProps, \"children\"> {\n /** Number of steps to show on the component. */\n numSteps: number;\n /** Returns a JSX.element 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 ) => JSX.Element | null;\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 /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvSimpleNavigationClasses;\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":["HvSimpleNavigation","numSteps","stepSize","getTitles","getDynamicValues","children","others","activeTheme","useTheme","dotSize","dotSizes","StepComponent","HvDot","stepsWidth","width","titleWidth","separatorWidth","maxWidth","Math","max","minWidth","Steps","titles","rawTitle","number","variant","title","_jsx","navWidth","separatorValues","getColor","height","stepNavigation","simpleSeparatorHeight","stepValues","minSize","maxSize"],"mappings":";;;;;;AAmDO,MAAMA,qBAAqBA,CAAC;AAAA,EACjCC;AAAAA,EACAC,WAAW;AAAA,EACXC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACoB,MAAM;AACvB,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,eAAS,SAAA;AAG3BC,QAAAA,UAAUC,eAASR,QAAQ;AACjC,QAAMS,gBAAgBC,IAAAA;AAGhBC,QAAAA,cAAcZ,WAAW,OAAOQ;AAChC,QAAA;AAAA,IAAEK;AAAAA,IAAOC;AAAAA,IAAYC;AAAAA,EAAAA,IAAmBZ,iBAAiBS,UAAU;AAGzE,QAAMI,WAAWC,KAAKC,IAAIJ,aAAaN,SAASO,cAAc;AAC9D,QAAMI,WAAWF,KAAKC,IAAIJ,aAAaN,UAAU,MAAMO,cAAc;AAGrE,QAAMK,QAAQhB;AAERiB,QAAAA,SAASnB,UAAU,CAAC;AAAA,IAAEoB;AAAAA,IAAUC;AAAAA,EAAAA,OAAc;AAAA,IAClDC,SAAS;AAAA,IACTC,OAAQ,GAAEF,WAAWD;AAAAA,IACrBR;AAAAA,EACA,EAAA;AAEF,yCACE,OAAA;AAAA,IAAA,GAAST;AAAAA,IAAMD,UACZiB,CAAAA,QACDK,2BAAAA,IAACN,OAAK;AAAA,MAEFR;AAAAA,MACAe,UAAUd;AAAAA,MACVe,iBAAiB;AAAA,QACfT;AAAAA,QACAH;AAAAA,QAAAA,UACAa,MAAAA;AAAAA,QACAC,SAAQxB,2CAAayB,eAAeC,0BAAyB;AAAA,MAC/D;AAAA,MACAC,YAAY;AAAA,QACVC,SAAS1B;AAAAA,QACT2B,SAAS,MAAM3B;AAAAA,QACfE;AAAAA,MACF;AAAA,IAAA,CAEH,CAAC;AAAA,EAAA,CACC;AAET;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"StepNavigation.cjs","sources":["../../../../src/components/StepNavigation/StepNavigation.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport {\n HvBaseProps,\n HvBreakpoints,\n useTheme,\n useWidth,\n HvBox,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvDefaultNavigation, HvStepProps } from \"./DefaultNavigation\";\nimport { HvSimpleNavigation } from \"./SimpleNavigation\";\nimport { styles } from \"./StepNavigation.styles\";\nimport stepNavigationClasses, {\n HvStepNavigationClasses,\n} from \"./stepNavigationClasses\";\nimport { SEPARATOR_WIDTH, TITLE_MARGIN, TITLE_WIDTH } from \"./utils\";\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,\n width,\n steps,\n stepSize,\n showTitles,\n type = \"Default\",\n ...others\n}: HvStepNavigationProps) => {\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 StyledLi = styled(\"li\")({\n height: separatorHeight,\n width:\n separatorWidth -\n 2 *\n Number(\n (activeTheme?.stepNavigation.separatorMargin || \"0px\").replace(\n \"px\",\n \"\"\n )\n ),\n backgroundColor,\n margin: `0 ${theme.stepNavigation.separatorMargin}`,\n });\n\n return (\n <ClassNames key={`separator-${title}`}>\n {({ css, cx }) => (\n <StyledLi\n aria-hidden\n className={cx(\n stepNavigationClasses.separator,\n css(styles.separator),\n classes?.separator\n )}\n >\n <div\n aria-label={`separator-${title}`}\n className={separatorClassName}\n />\n </StyledLi>\n )}\n </ClassNames>\n );\n };\n\n const drawItems = ({\n separatorValues: { minWidth, maxWidth, getColor, height },\n stepValues: { minSize, maxSize, StepComponent },\n }: any) => {\n const items = steps.reduce(\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 <ClassNames key={`step-${title}`}>\n {({ css, cx }) => (\n <StepContainer\n className={cx(\n stepNavigationClasses.li,\n css(styles.li),\n classes?.li\n )}\n >\n {hasTitles ? (\n <StepComponent\n key={`step-${title}`}\n aria-label={`step-${title}`}\n {...stepProps}\n />\n ) : (\n <HvTooltip\n placement=\"bottom\"\n title={\n <HvTypography>{`${index + 1}. ${title}`}</HvTypography>\n }\n >\n <div aria-label={`step-container-${title}`}>\n <Step\n className={cx(\n stepNavigationClasses.li,\n css(styles.li),\n classes?.li\n )}\n >\n <StepComponent\n aria-label={`step-${title}`}\n {...stepProps}\n />\n </Step>\n </div>\n </HvTooltip>\n )}\n </StepContainer>\n )}\n </ClassNames>\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 (\n <ClassNames>\n {({ css, cx }) => (\n <ol\n className={cx(\n stepNavigationClasses.ol,\n css(styles.ol),\n classes?.ol\n )}\n >\n {items}\n </ol>\n )}\n </ClassNames>\n );\n };\n\n const getDynamicValues = (stepsWidth) => {\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 styledTitle = (\n titleClassName,\n variant,\n title,\n titleWidth,\n titleDisabled\n ) => {\n const StyledTitle = styled(HvTypography)({\n textAlign: \"center\",\n width: titleWidth - TITLE_MARGIN,\n marginRight: TITLE_MARGIN,\n });\n\n return (\n <StyledTitle\n variant={variant}\n className={titleClassName}\n disabled={titleDisabled}\n key={`title-${title}`}\n >\n {title}\n </StyledTitle>\n );\n };\n\n const getTitles = (getTitleProps) =>\n hasTitles ? (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n stepNavigationClasses.titles,\n css(styles.titles),\n classes?.titles\n )}\n >\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 const Title = styledTitle(\n titleClassName,\n variant,\n title,\n titleWidth,\n titleDisabled\n );\n return Title;\n })}\n </div>\n )}\n </ClassNames>\n ) : null;\n\n const StepNavigation = {\n Default: HvDefaultNavigation,\n Simple: HvSimpleNavigation,\n }[type];\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <StepNavigation\n {...{\n numSteps: steps.length,\n stepSize: stepSizeKey,\n getTitles,\n getDynamicValues,\n className: cx(\n stepNavigationClasses.root,\n css(styles.root),\n className,\n classes?.root\n ),\n ...others,\n }}\n >\n {({ stepsWidth, navWidth, ...itemsProps }) => (\n <HvBox\n component=\"nav\"\n style={{\n width: `${navWidth}px`,\n margin: 0,\n }}\n >\n {drawItems(itemsProps)}\n </HvBox>\n )}\n </StepNavigation>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvStepNavigation","className","classes","width","steps","stepSize","showTitles","type","others","activeTheme","useTheme","breakpoint","useWidth","stepSizeKey","includes","hasTitles","styledLi","containerSize","_styled","process","env","NODE_ENV","target","label","height","styledDiv","styledSeparatorElement","title","separatorClassName","separatorHeight","separatorWidth","backgroundColor","StyledLi","Number","stepNavigation","separatorMargin","replace","margin","theme","ClassNames","children","css","cx","stepNavigationClasses","separator","styles","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","styledTitle","titleClassName","variant","titleDisabled","StyledTitle","textAlign","marginRight","disabled","getTitles","getTitleProps","titles","map","rawTitle","Title","StepNavigation","Default","HvDefaultNavigation","Simple","HvSimpleNavigation","numSteps","root","itemsProps","HvBox","component","style"],"mappings":"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"}
1
+ {"version":3,"file":"StepNavigation.cjs","sources":["../../../../src/components/StepNavigation/StepNavigation.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport {\n HvBaseProps,\n HvBreakpoints,\n useTheme,\n useWidth,\n HvBox,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvDefaultNavigation, HvStepProps } from \"./DefaultNavigation\";\nimport { HvSimpleNavigation } from \"./SimpleNavigation\";\nimport { styles } from \"./StepNavigation.styles\";\nimport stepNavigationClasses, {\n HvStepNavigationClasses,\n} from \"./stepNavigationClasses\";\nimport { SEPARATOR_WIDTH, TITLE_MARGIN, TITLE_WIDTH } from \"./utils\";\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,\n width,\n steps,\n stepSize,\n showTitles,\n type = \"Default\",\n ...others\n}: HvStepNavigationProps) => {\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 StyledLi = styled(\"li\")({\n height: separatorHeight,\n width:\n separatorWidth -\n 2 *\n Number(\n (activeTheme?.stepNavigation.separatorMargin || \"0px\").replace(\n \"px\",\n \"\"\n )\n ),\n backgroundColor,\n margin: `0 ${theme.stepNavigation.separatorMargin}`,\n });\n\n return (\n <ClassNames key={`separator-${title}`}>\n {({ css, cx }) => (\n <StyledLi\n aria-hidden\n className={cx(\n stepNavigationClasses.separator,\n css(styles.separator),\n classes?.separator\n )}\n >\n <div\n aria-label={`separator-${title}`}\n className={separatorClassName}\n />\n </StyledLi>\n )}\n </ClassNames>\n );\n };\n\n const drawItems = ({\n separatorValues: { minWidth, maxWidth, getColor, height },\n stepValues: { minSize, maxSize, StepComponent },\n }: any) => {\n const items = steps.reduce(\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 <ClassNames key={`step-${title}`}>\n {({ css, cx }) => (\n <StepContainer\n className={cx(\n stepNavigationClasses.li,\n css(styles.li),\n classes?.li\n )}\n >\n {hasTitles ? (\n <StepComponent\n key={`step-${title}`}\n aria-label={`step-${title}`}\n {...stepProps}\n />\n ) : (\n <HvTooltip\n placement=\"bottom\"\n title={\n <HvTypography>{`${index + 1}. ${title}`}</HvTypography>\n }\n >\n <div aria-label={`step-container-${title}`}>\n <Step\n className={cx(\n stepNavigationClasses.li,\n css(styles.li),\n classes?.li\n )}\n >\n <StepComponent\n aria-label={`step-${title}`}\n {...stepProps}\n />\n </Step>\n </div>\n </HvTooltip>\n )}\n </StepContainer>\n )}\n </ClassNames>\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 (\n <ClassNames>\n {({ css, cx }) => (\n <ol\n className={cx(\n stepNavigationClasses.ol,\n css(styles.ol),\n classes?.ol\n )}\n >\n {items}\n </ol>\n )}\n </ClassNames>\n );\n };\n\n const getDynamicValues = (stepsWidth) => {\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 styledTitle = (\n titleClassName,\n variant,\n title,\n titleWidth,\n titleDisabled\n ) => {\n const StyledTitle = styled(HvTypography)({\n textAlign: \"center\",\n width: titleWidth - TITLE_MARGIN,\n marginRight: TITLE_MARGIN,\n });\n\n return (\n <StyledTitle\n variant={variant}\n className={titleClassName}\n disabled={titleDisabled}\n key={`title-${title}`}\n >\n {title}\n </StyledTitle>\n );\n };\n\n const getTitles = (getTitleProps) =>\n hasTitles ? (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n stepNavigationClasses.titles,\n css(styles.titles),\n classes?.titles\n )}\n >\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 const Title = styledTitle(\n titleClassName,\n variant,\n title,\n titleWidth,\n titleDisabled\n );\n return Title;\n })}\n </div>\n )}\n </ClassNames>\n ) : null;\n\n const StepNavigation = {\n Default: HvDefaultNavigation,\n Simple: HvSimpleNavigation,\n }[type];\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <StepNavigation\n {...{\n numSteps: steps.length,\n stepSize: stepSizeKey,\n getTitles,\n getDynamicValues,\n className: cx(\n stepNavigationClasses.root,\n css(styles.root),\n className,\n classes?.root\n ),\n ...others,\n }}\n >\n {({ stepsWidth, navWidth, ...itemsProps }) => (\n <HvBox\n component=\"nav\"\n style={{\n width: `${navWidth}px`,\n margin: 0,\n }}\n >\n {drawItems(itemsProps)}\n </HvBox>\n )}\n </StepNavigation>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvStepNavigation","className","classes","width","steps","stepSize","showTitles","type","others","activeTheme","useTheme","breakpoint","useWidth","stepSizeKey","includes","hasTitles","styledLi","containerSize","_styled","process","env","NODE_ENV","target","label","height","styledDiv","styledSeparatorElement","title","separatorClassName","separatorHeight","separatorWidth","backgroundColor","StyledLi","Number","stepNavigation","separatorMargin","replace","margin","theme","ClassNames","children","css","cx","stepNavigationClasses","separator","styles","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","styledTitle","titleClassName","variant","titleDisabled","StyledTitle","textAlign","marginRight","disabled","getTitles","getTitleProps","titles","map","rawTitle","Title","StepNavigation","Default","HvDefaultNavigation","Simple","HvSimpleNavigation","numSteps","root","itemsProps","HvBox","component","style"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Wizard.cjs","sources":["../../../../src/components/Wizard/Wizard.tsx"],"sourcesContent":["import { HvBaseProps, HvDialogProps } from \"@hitachivantara/uikit-react-core\";\nimport { ModalProps } from \"@mui/material\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { HvWizardClasses } from \"./wizardClasses\";\nimport {\n HvWizardContainer,\n HvWizardContent,\n HvWizardContext,\n HvWizardTitle,\n HvWizardTitleProps,\n HvWizardTabs,\n HvWizardActions,\n HvWizardActionsProps,\n} from \".\";\nimport { HvStepNavigationProps } from \"..\";\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 ...others\n}: HvWizardProps) => {\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 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","others","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","HvWizardTitle","HvWizardContent","HvWizardActions"],"mappings":";;;;;;;;;AA6CO,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,EACA,GAAGC;AACU,MAAM;AACnB,QAAM,CAACC,SAASC,UAAU,IAAIC,MAAAA,SAAuB,CAAE,CAAA;AACvD,QAAM,CAACN,SAASO,UAAU,IAAID,eAAS,KAAK;AAC5C,QAAM,CAACE,KAAKC,MAAM,IAAIH,eAAS,CAAC;AAEhC,QAAMI,cAAcC,MAAAA,YAClB,CAACC,KAAKC,WAAW;AACf,QAAIA,WAAW,iBAAiB;AAC9B3B,yCAAU0B,KAAKC;AAAAA,IACjB;AAAA,EAAA,GAEF,CAAC3B,OAAO,CAAC;AAIX4B,QAAAA,UAAU,MAAM;AACd,WAAO,MAAM;AACX,UAAI,CAACzB,MAAM;AACG0B,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,GACD;AAEHb,eAAO,CAAC;AAAA,MACV;AAAA,IAAA;AAAA,EACF,GACC,CAACpB,IAAI,CAAC;AAEHkC,QAAAA,QAAQC,MAAAA,QACZ,OAAO;AAAA,IAAEpB;AAAAA,IAASC;AAAAA,IAAYL;AAAAA,IAASO;AAAAA,IAAYC;AAAAA,IAAKC;AAAAA,EAAAA,IACxD,CAACL,SAASC,YAAYL,SAASO,YAAYC,KAAKC,MAAM,CAAC;AAIvDgB,SAAAA,2BAAAA,IAACC,sBAAgBC,UAAQ;AAAA,IAACJ;AAAAA,IAAatC,0CACpC2C,mCAAiB;AAAA,MAChB5C;AAAAA,MACA0B;AAAAA,MACArB;AAAAA,MAAW,GACPc;AAAAA,MAAMlB,UAAA,CAEVwC,2BAAAA,IAACI,2BAAa;AAAA,QACZzC;AAAAA,QACAI;AAAAA,QACAE;AAAAA,QACAQ;AAAAA,MAAAA,CACA,GACFuB,2BAAAA,IAACK,+BAAe;AAAA,QACdvC;AAAAA,QACAU;AAAAA,QACAR;AAAAA,QAA+BR;AAAAA,MAAAA,CAGf,GAClBwC,2BAAAA,IAACM,+BAAe;AAAA,QACdxC;AAAAA,QACAD;AAAAA,QACAI;AAAAA,QACAgB;AAAAA,QACAvB;AAAAA,MAAAA,CACA,CAAA;AAAA,IAAA,CAAA;AAAA,EAAA,CAEqB;AAE/B;;"}
1
+ {"version":3,"file":"Wizard.cjs","sources":["../../../../src/components/Wizard/Wizard.tsx"],"sourcesContent":["import { HvBaseProps, HvDialogProps } from \"@hitachivantara/uikit-react-core\";\nimport { ModalProps } from \"@mui/material\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { HvWizardClasses } from \"./wizardClasses\";\nimport {\n HvWizardContainer,\n HvWizardContent,\n HvWizardContext,\n HvWizardTitle,\n HvWizardTitleProps,\n HvWizardTabs,\n HvWizardActions,\n HvWizardActionsProps,\n} from \".\";\nimport { HvStepNavigationProps } from \"..\";\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 ...others\n}: HvWizardProps) => {\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 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","others","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","HvWizardTitle","HvWizardContent","HvWizardActions"],"mappings":";;;;;;;;;AA6CO,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,EACA,GAAGC;AACU,MAAM;AACnB,QAAM,CAACC,SAASC,UAAU,IAAIC,MAAAA,SAAuB,CAAE,CAAA;AACvD,QAAM,CAACN,SAASO,UAAU,IAAID,eAAS,KAAK;AAC5C,QAAM,CAACE,KAAKC,MAAM,IAAIH,eAAS,CAAC;AAEhC,QAAMI,cAAcC,MAAAA,YAClB,CAACC,KAAKC,WAAW;AACf,QAAIA,WAAW,iBAAiB;AAC9B3B,yCAAU0B,KAAKC;AAAAA,IACjB;AAAA,EAAA,GAEF,CAAC3B,OAAO,CACV;AAGA4B,QAAAA,UAAU,MAAM;AACd,WAAO,MAAM;AACX,UAAI,CAACzB,MAAM;AACG0B,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,CAACpB,IAAI,CAAC;AAEHkC,QAAAA,QAAQC,MAAAA,QACZ,OAAO;AAAA,IAAEpB;AAAAA,IAASC;AAAAA,IAAYL;AAAAA,IAASO;AAAAA,IAAYC;AAAAA,IAAKC;AAAAA,EAAAA,IACxD,CAACL,SAASC,YAAYL,SAASO,YAAYC,KAAKC,MAAM,CACxD;AAGEgB,SAAAA,2BAAAA,IAACC,sBAAgBC,UAAQ;AAAA,IAACJ;AAAAA,IAAatC,0CACpC2C,mCAAiB;AAAA,MAChB5C;AAAAA,MACA0B;AAAAA,MACArB;AAAAA,MAAW,GACPc;AAAAA,MAAMlB,UAAA,CAEVwC,2BAAAA,IAACI,2BAAa;AAAA,QACZzC;AAAAA,QACAI;AAAAA,QACAE;AAAAA,QACAQ;AAAAA,MAAAA,CACD,GACDuB,2BAAAA,IAACK,+BAAe;AAAA,QACdvC;AAAAA,QACAU;AAAAA,QACAR;AAAAA,QAA+BR;AAAAA,MAAAA,CAGhB,GACjBwC,2BAAAA,IAACM,+BAAe;AAAA,QACdxC;AAAAA,QACAD;AAAAA,QACAI;AAAAA,QACAgB;AAAAA,QACAvB;AAAAA,MAAAA,CACD,CAAC;AAAA,IAAA,CACe;AAAA,EAAA,CACK;AAE9B;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"WizardActions.cjs","sources":["../../../../../src/components/Wizard/WizardActions/WizardActions.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useState } from \"react\";\nimport { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvButton,\n HvDialogActions,\n HvGrid,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Backwards, Forwards } from \"@hitachivantara/uikit-react-icons\";\nimport { styles } from \"./WizardActions.styles\";\nimport {\n HvWizardContext,\n HvWizardTabs,\n wizardActionsClasses,\n HvWizardActionsClasses,\n} from \"..\";\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,\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 { 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]);\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 <ClassNames>\n {({ css, cx }) => (\n <HvDialogActions\n className={cx(\n wizardActionsClasses.actionsContainer,\n css(styles.actionsContainer),\n classes?.actionsContainer\n )}\n >\n <HvGrid>\n <HvButton\n variant=\"secondaryGhost\"\n onClick={handleClose}\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n >\n {`${labels.cancel ?? \"Cancel\"}`}\n </HvButton>\n {skippable && (\n <HvButton\n variant=\"secondaryGhost\"\n disabled={isLastPage}\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n onClick={handleSkip}\n >\n {`${labels.skip ?? \"Skip\"}`}\n </HvButton>\n )}\n </HvGrid>\n <HvGrid\n className={cx(\n wizardActionsClasses.buttonsContainer,\n css(styles.buttonsContainer),\n classes?.buttonsContainer\n )}\n >\n <HvButton\n variant=\"secondaryGhost\"\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\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={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n disabled={loading || !canSubmit}\n onClick={handleSubmitInternal}\n >\n {`${labels.submit ?? \"Submit\"}`}\n </HvButton>\n ) : (\n <HvButton\n variant=\"secondaryGhost\"\n className={cx(\n wizardActionsClasses.buttonWidth,\n wizardActionsClasses.buttonSpacing,\n css(styles.buttonWidth),\n css(styles.buttonSpacing),\n classes?.buttonWidth,\n classes?.buttonSpacing\n )}\n onClick={() => setTab((t) => t + 1)}\n disabled={!skippable && !context?.[tab]?.valid}\n endIcon={<Forwards />}\n >\n {`${labels.next ?? \"Next\"}`}\n </HvButton>\n )}\n </HvGrid>\n </HvDialogActions>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvWizardActions","classes","handleClose","handleSubmit","loading","skippable","labels","cancel","next","previous","skip","submit","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","ClassNames","children","css","cx","HvDialogActions","className","wizardActionsClasses","actionsContainer","styles","_jsxs","HvGrid","_jsx","HvButton","variant","onClick","buttonWidth","disabled","buttonsContainer","t","startIcon","Backwards","buttonSpacing","endIcon","Forwards"],"mappings":"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"}
1
+ {"version":3,"file":"WizardActions.cjs","sources":["../../../../../src/components/Wizard/WizardActions/WizardActions.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useState } from \"react\";\nimport { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvButton,\n HvDialogActions,\n HvGrid,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Backwards, Forwards } from \"@hitachivantara/uikit-react-icons\";\nimport { styles } from \"./WizardActions.styles\";\nimport {\n HvWizardContext,\n HvWizardTabs,\n wizardActionsClasses,\n HvWizardActionsClasses,\n} from \"..\";\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,\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 { 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]);\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 <ClassNames>\n {({ css, cx }) => (\n <HvDialogActions\n className={cx(\n wizardActionsClasses.actionsContainer,\n css(styles.actionsContainer),\n classes?.actionsContainer\n )}\n >\n <HvGrid>\n <HvButton\n variant=\"secondaryGhost\"\n onClick={handleClose}\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n >\n {`${labels.cancel ?? \"Cancel\"}`}\n </HvButton>\n {skippable && (\n <HvButton\n variant=\"secondaryGhost\"\n disabled={isLastPage}\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n onClick={handleSkip}\n >\n {`${labels.skip ?? \"Skip\"}`}\n </HvButton>\n )}\n </HvGrid>\n <HvGrid\n className={cx(\n wizardActionsClasses.buttonsContainer,\n css(styles.buttonsContainer),\n classes?.buttonsContainer\n )}\n >\n <HvButton\n variant=\"secondaryGhost\"\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\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={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n disabled={loading || !canSubmit}\n onClick={handleSubmitInternal}\n >\n {`${labels.submit ?? \"Submit\"}`}\n </HvButton>\n ) : (\n <HvButton\n variant=\"secondaryGhost\"\n className={cx(\n wizardActionsClasses.buttonWidth,\n wizardActionsClasses.buttonSpacing,\n css(styles.buttonWidth),\n css(styles.buttonSpacing),\n classes?.buttonWidth,\n classes?.buttonSpacing\n )}\n onClick={() => setTab((t) => t + 1)}\n disabled={!skippable && !context?.[tab]?.valid}\n endIcon={<Forwards />}\n >\n {`${labels.next ?? \"Next\"}`}\n </HvButton>\n )}\n </HvGrid>\n </HvDialogActions>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvWizardActions","classes","handleClose","handleSubmit","loading","skippable","labels","cancel","next","previous","skip","submit","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","ClassNames","children","css","cx","HvDialogActions","className","wizardActionsClasses","actionsContainer","styles","_jsxs","HvGrid","_jsx","HvButton","variant","onClick","buttonWidth","disabled","buttonsContainer","t","startIcon","Backwards","buttonSpacing","endIcon","Forwards"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"WizardContainer.cjs","sources":["../../../../../src/components/Wizard/WizardContainer/WizardContainer.tsx"],"sourcesContent":["import React from \"react\";\nimport { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvDialog,\n HvDialogProps,\n} from \"@hitachivantara/uikit-react-core\";\nimport wizardContainerClasses, {\n HvWizardContainerClasses,\n} from \"./wizardContainerClasses\";\nimport { styles } from \"./WizardContainer.styles\";\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,\n className,\n children,\n handleClose,\n open,\n ...others\n}: HvWizardContainerProps) => {\n return (\n <ClassNames>\n {({ css, cx }) => (\n <HvDialog\n classes={{\n closeButton: cx(\n wizardContainerClasses.closeButton,\n css(styles.closeButton),\n classes?.closeButton\n ),\n paper: cx(\n wizardContainerClasses.paper,\n css(styles.paper),\n classes?.paper\n ),\n }}\n className={cx(wizardContainerClasses.root, className, classes?.root)}\n open={open}\n onClose={handleClose}\n maxWidth=\"lg\"\n {...others}\n >\n {children}\n </HvDialog>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvWizardContainer","classes","className","children","handleClose","open","others","ClassNames","css","cx","HvDialog","closeButton","wizardContainerClasses","styles","paper","root","onClose","maxWidth"],"mappings":";;;;;;;AA0BO,MAAMA,oBAAoBA,CAAC;AAAA,EAChCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACmB,MAAM;AAC5B,wCACGC,MAAAA,YAAU;AAAA,IAAAJ,UACRA,CAAC;AAAA,MAAEK;AAAAA,MAAKC;AAAAA,IAAAA,qCACNC,eAAAA,UAAQ;AAAA,MACPT,SAAS;AAAA,QACPU,aAAaF,GACXG,uBAAuBD,QAAAA,aACvBH,IAAIK,uBAAAA,OAAOF,WAAW,GACtBV,mCAASU,WAAW;AAAA,QAEtBG,OAAOL,GACLG,uBAAuBE,QAAAA,OACvBN,IAAIK,uBAAAA,OAAOC,KAAK,GAChBb,mCAASa,KAAK;AAAA,MAElB;AAAA,MACAZ,WAAWO,GAAGG,uBAAAA,QAAuBG,MAAMb,WAAWD,mCAASc,IAAI;AAAA,MACnEV;AAAAA,MACAW,SAASZ;AAAAA,MACTa,UAAS;AAAA,MAAI,GACTX;AAAAA,MAAMH;AAAAA,IAAAA,CAED;AAAA,EAAA,CAGF;AAEjB;;"}
1
+ {"version":3,"file":"WizardContainer.cjs","sources":["../../../../../src/components/Wizard/WizardContainer/WizardContainer.tsx"],"sourcesContent":["import React from \"react\";\nimport { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvDialog,\n HvDialogProps,\n} from \"@hitachivantara/uikit-react-core\";\nimport wizardContainerClasses, {\n HvWizardContainerClasses,\n} from \"./wizardContainerClasses\";\nimport { styles } from \"./WizardContainer.styles\";\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,\n className,\n children,\n handleClose,\n open,\n ...others\n}: HvWizardContainerProps) => {\n return (\n <ClassNames>\n {({ css, cx }) => (\n <HvDialog\n classes={{\n closeButton: cx(\n wizardContainerClasses.closeButton,\n css(styles.closeButton),\n classes?.closeButton\n ),\n paper: cx(\n wizardContainerClasses.paper,\n css(styles.paper),\n classes?.paper\n ),\n }}\n className={cx(wizardContainerClasses.root, className, classes?.root)}\n open={open}\n onClose={handleClose}\n maxWidth=\"lg\"\n {...others}\n >\n {children}\n </HvDialog>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvWizardContainer","classes","className","children","handleClose","open","others","ClassNames","css","cx","HvDialog","closeButton","wizardContainerClasses","styles","paper","root","onClose","maxWidth"],"mappings":";;;;;;;AA0BO,MAAMA,oBAAoBA,CAAC;AAAA,EAChCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACmB,MAAM;AAC5B,wCACGC,MAAAA,YAAU;AAAA,IAAAJ,UACRA,CAAC;AAAA,MAAEK;AAAAA,MAAKC;AAAAA,IAAAA,qCACNC,eAAAA,UAAQ;AAAA,MACPT,SAAS;AAAA,QACPU,aAAaF,GACXG,uBAAuBD,QAAAA,aACvBH,IAAIK,uBAAAA,OAAOF,WAAW,GACtBV,mCAASU,WACX;AAAA,QACAG,OAAOL,GACLG,uBAAuBE,QAAAA,OACvBN,IAAIK,uBAAAA,OAAOC,KAAK,GAChBb,mCAASa,KACX;AAAA,MACF;AAAA,MACAZ,WAAWO,GAAGG,uBAAAA,QAAuBG,MAAMb,WAAWD,mCAASc,IAAI;AAAA,MACnEV;AAAAA,MACAW,SAASZ;AAAAA,MACTa,UAAS;AAAA,MAAI,GACTX;AAAAA,MAAMH;AAAAA,IAAAA,CAGF;AAAA,EAAA,CAEF;AAEhB;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"LoadingContainer.cjs","sources":["../../../../../src/components/Wizard/WizardContent/LoadingContainer.tsx"],"sourcesContent":["import { HvLoading, HvLoadingProps } from \"@hitachivantara/uikit-react-core\";\nimport { ClassNames } from \"@emotion/react\";\nimport { styles } from \"./LoadingContainer.styles\";\nimport wizardLoadingContainerClasses, {\n HvWizardLoadingContainerClasses,\n} from \"./loadingContainerClasses\";\n\ninterface LoadingContainerProps extends Omit<HvLoadingProps, \"classes\"> {\n classes?: HvWizardLoadingContainerClasses;\n}\n\nexport const LoadingContainer = ({\n children,\n hidden,\n classes,\n ...others\n}: LoadingContainerProps) => {\n return (\n <ClassNames>\n {({ css, cx }) => (\n <>\n <div\n style={{\n top: 0,\n left: 0,\n height: \"100%\",\n width: \"100%\",\n }}\n className={cx(\n wizardLoadingContainerClasses.overlay,\n !hidden && wizardLoadingContainerClasses.blur,\n css(styles.overlay),\n !hidden && css(styles.blur),\n classes?.overlay,\n !hidden && classes?.blur\n )}\n >\n <HvLoading\n classes={{\n root: cx(\n wizardLoadingContainerClasses.loading,\n css(styles.loading),\n classes?.loading\n ),\n }}\n hidden={hidden}\n {...others}\n />\n </div>\n <div style={{ display: \"flow-root\" }}>{children}</div>\n </>\n )}\n </ClassNames>\n );\n};\n"],"names":["LoadingContainer","children","hidden","classes","others","ClassNames","css","cx","_Fragment","_jsx","style","top","left","height","width","className","wizardLoadingContainerClasses","overlay","blur","styles","HvLoading","root","loading","display"],"mappings":";;;;;;;AAWO,MAAMA,mBAAmBA,CAAC;AAAA,EAC/BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACkB,MAAM;AAC3B,wCACGC,MAAAA,YAAU;AAAA,IAAAJ,UACRA,CAAC;AAAA,MAAEK;AAAAA,MAAKC;AAAAA,IAAAA,sCACPC,WAAAA,UAAA;AAAA,MAAAP,WACEQ,2BAAAA,IAAA,OAAA;AAAA,QACEC,OAAO;AAAA,UACLC,KAAK;AAAA,UACLC,MAAM;AAAA,UACNC,QAAQ;AAAA,UACRC,OAAO;AAAA,QACT;AAAA,QACAC,WAAWR,GACTS,wBAA8BC,QAAAA,SAC9B,CAACf,UAAUc,wBAAAA,QAA8BE,MACzCZ,IAAIa,wBAAAA,OAAOF,OAAO,GAClB,CAACf,UAAUI,IAAIa,wBAAAA,OAAOD,IAAI,GAC1Bf,mCAASc,SACT,CAACf,WAAUC,mCAASe,KAAI;AAAA,QACxBjB,yCAEDmB,0BAAS;AAAA,UACRjB,SAAS;AAAA,YACPkB,MAAMd,GACJS,wBAA8BM,QAAAA,SAC9BhB,IAAIa,wBAAAA,OAAOG,OAAO,GAClBnB,mCAASmB,OAAO;AAAA,UAEpB;AAAA,UACApB;AAAAA,UAAe,GACXE;AAAAA,QAAAA,CAAM;AAAA,MAAA,CACV,GAEJK,2BAAAA,IAAA,OAAA;AAAA,QAAKC,OAAO;AAAA,UAAEa,SAAS;AAAA,QAAY;AAAA,QAAEtB;AAAAA,MAAAA,CAAiB,CAAA;AAAA,IAAA,CAAA;AAAA,EAAA,CAG/C;AAEjB;;"}
1
+ {"version":3,"file":"LoadingContainer.cjs","sources":["../../../../../src/components/Wizard/WizardContent/LoadingContainer.tsx"],"sourcesContent":["import { HvLoading, HvLoadingProps } from \"@hitachivantara/uikit-react-core\";\nimport { ClassNames } from \"@emotion/react\";\nimport { styles } from \"./LoadingContainer.styles\";\nimport wizardLoadingContainerClasses, {\n HvWizardLoadingContainerClasses,\n} from \"./loadingContainerClasses\";\n\ninterface LoadingContainerProps extends Omit<HvLoadingProps, \"classes\"> {\n classes?: HvWizardLoadingContainerClasses;\n}\n\nexport const LoadingContainer = ({\n children,\n hidden,\n classes,\n ...others\n}: LoadingContainerProps) => {\n return (\n <ClassNames>\n {({ css, cx }) => (\n <>\n <div\n style={{\n top: 0,\n left: 0,\n height: \"100%\",\n width: \"100%\",\n }}\n className={cx(\n wizardLoadingContainerClasses.overlay,\n !hidden && wizardLoadingContainerClasses.blur,\n css(styles.overlay),\n !hidden && css(styles.blur),\n classes?.overlay,\n !hidden && classes?.blur\n )}\n >\n <HvLoading\n classes={{\n root: cx(\n wizardLoadingContainerClasses.loading,\n css(styles.loading),\n classes?.loading\n ),\n }}\n hidden={hidden}\n {...others}\n />\n </div>\n <div style={{ display: \"flow-root\" }}>{children}</div>\n </>\n )}\n </ClassNames>\n );\n};\n"],"names":["LoadingContainer","children","hidden","classes","others","ClassNames","css","cx","_Fragment","_jsx","style","top","left","height","width","className","wizardLoadingContainerClasses","overlay","blur","styles","HvLoading","root","loading","display"],"mappings":";;;;;;;AAWO,MAAMA,mBAAmBA,CAAC;AAAA,EAC/BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACkB,MAAM;AAC3B,wCACGC,MAAAA,YAAU;AAAA,IAAAJ,UACRA,CAAC;AAAA,MAAEK;AAAAA,MAAKC;AAAAA,IAAAA,sCACPC,WAAAA,UAAA;AAAA,MAAAP,WACEQ,2BAAAA,IAAA,OAAA;AAAA,QACEC,OAAO;AAAA,UACLC,KAAK;AAAA,UACLC,MAAM;AAAA,UACNC,QAAQ;AAAA,UACRC,OAAO;AAAA,QACT;AAAA,QACAC,WAAWR,GACTS,wBAA8BC,QAAAA,SAC9B,CAACf,UAAUc,wBAAAA,QAA8BE,MACzCZ,IAAIa,wBAAAA,OAAOF,OAAO,GAClB,CAACf,UAAUI,IAAIa,wBAAAA,OAAOD,IAAI,GAC1Bf,mCAASc,SACT,CAACf,WAAUC,mCAASe,KACtB;AAAA,QAAEjB,yCAEDmB,0BAAS;AAAA,UACRjB,SAAS;AAAA,YACPkB,MAAMd,GACJS,wBAA8BM,QAAAA,SAC9BhB,IAAIa,wBAAAA,OAAOG,OAAO,GAClBnB,mCAASmB,OACX;AAAA,UACF;AAAA,UACApB;AAAAA,UAAe,GACXE;AAAAA,QAAAA,CACL;AAAA,MAAA,CACE,GACLK,2BAAAA,IAAA,OAAA;AAAA,QAAKC,OAAO;AAAA,UAAEa,SAAS;AAAA,QAAY;AAAA,QAAEtB;AAAAA,MAAAA,CAAgB,CAAC;AAAA,IAAA,CACtD;AAAA,EAAA,CAEM;AAEhB;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"WizardContent.cjs","sources":["../../../../../src/components/Wizard/WizardContent/WizardContent.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport { HvBaseProps, HvDialogContent } from \"@hitachivantara/uikit-react-core\";\nimport { useElementSize } from \"usehooks-ts\";\nimport React, {\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n HvWizardContext,\n HvWizardTabs,\n wizardContentClasses,\n HvWizardContentClasses,\n} from \"..\";\nimport { styles } from \"./WizardContent.styles\";\nimport { LoadingContainer } from \"./LoadingContainer\";\n\nexport interface HvWizardContentProps extends HvBaseProps {\n /** Forces minimum height to the component. */\n fixedHeight?: boolean;\n /** Whether the loading animation is shown. */\n loading?: boolean;\n /** The content of the summary. */\n summaryContent?: React.ReactNode;\n /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n classes?: HvWizardContentClasses;\n}\n\ntype ChildElement = React.ReactElement<HvWizardTabs>;\n\nconst DRAWER_PERCENTAGE = 0.3;\nconst DRAWER_MIN_WIDTH = 280;\n\nexport const HvWizardContent = ({\n classes,\n fixedHeight = false,\n loading = false,\n children,\n summaryContent,\n}: HvWizardContentProps) => {\n const { context, setContext, summary, tab } = useContext(HvWizardContext);\n\n const arrayChildren = React.Children.toArray(children) as ChildElement[];\n\n const initialContext = arrayChildren.reduce(\n (acc, child: ChildElement, index) => {\n const invalid =\n \"mustValidate\" in child.props && child.props.mustValidate === true\n ? false\n : null;\n const valid = invalid ?? (index === 0 || null);\n return {\n ...acc,\n [index]: { ...child.props, form: {}, valid, touched: index === 0 },\n };\n },\n {}\n );\n\n const summaryRef = useRef<HTMLElement>();\n const resizedRef = useRef({ height: 0, width: 0 });\n const [containerRef, sizes] = useElementSize();\n\n const [summaryHeight, setSummaryHeight] = useState(0);\n const [summaryWidth, setSummaryWidth] = useState(0);\n const [summaryLeft, setSummaryLeft] = useState(0);\n\n const updateSummaryMeasures = useCallback((newSizes) => {\n const modalWidth = newSizes.width;\n const drawerWidth = modalWidth * DRAWER_PERCENTAGE;\n setSummaryHeight(newSizes.height);\n setSummaryWidth(Math.max(drawerWidth, DRAWER_MIN_WIDTH));\n setSummaryLeft(modalWidth - Math.max(drawerWidth, DRAWER_MIN_WIDTH));\n\n resizedRef.current = {\n height: newSizes.height,\n width: newSizes.width,\n };\n }, []);\n\n useEffect(() => {\n const pageHeight = summaryRef.current?.getBoundingClientRect?.()?.height;\n if (\n (summary && sizes.height !== resizedRef.current.height) ||\n sizes.width !== resizedRef.current.width\n ) {\n updateSummaryMeasures(sizes);\n }\n\n if (pageHeight && sizes.height !== pageHeight) {\n updateSummaryMeasures({\n width: sizes.width,\n height: pageHeight,\n });\n }\n }, [tab, sizes, summary, updateSummaryMeasures]);\n\n useEffect(() => {\n setContext(initialContext);\n }, []);\n\n useEffect(() => {\n if (tab && !context[tab]?.touched) {\n const updatedContext = Object.entries(context).reduce(\n (acc, [key, childState]) => ({\n ...acc,\n ...(+key <= tab\n ? {\n [key]: {\n ...childState,\n touched: true,\n valid: childState?.valid ?? true,\n },\n }\n : { [key]: childState }),\n }),\n {}\n );\n\n setContext(updatedContext);\n }\n }, [tab]);\n\n const translateX = summaryWidth ? summaryWidth + 10 : 450;\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n wizardContentClasses.summaryRef,\n css(styles.summaryRef),\n classes?.summaryRef\n )}\n ref={(el) => {\n containerRef(el);\n if (el) {\n summaryRef.current = el;\n }\n }}\n >\n {summary !== null && (\n <div\n className={cx(\n wizardContentClasses.summarySticky,\n css(styles.summarySticky),\n classes?.summarySticky\n )}\n >\n <div\n className={cx(\n wizardContentClasses.summaryContainer,\n css(styles.summaryContainer),\n classes?.summaryContainer\n )}\n style={{\n left: summaryLeft,\n width: summaryWidth,\n height: summaryHeight,\n transform: `translate(${summary ? 0 : translateX}px, 0)`,\n }}\n >\n {summaryContent}\n </div>\n </div>\n )}\n <HvDialogContent\n className={cx(\n wizardContentClasses.contentContainer,\n fixedHeight && wizardContentClasses.fixedHeight,\n css(styles.contentContainer),\n fixedHeight && css(styles.fixedHeight),\n classes?.contentContainer,\n fixedHeight && classes?.fixedHeight\n )}\n indentContent\n >\n <LoadingContainer hidden={!loading}>\n {React.Children.map(arrayChildren, (child, index) => {\n if (index === tab) {\n return React.cloneElement(child as React.ReactElement, {\n tab,\n });\n }\n return null;\n })}\n </LoadingContainer>\n </HvDialogContent>\n </div>\n )}\n </ClassNames>\n );\n};\n"],"names":["DRAWER_PERCENTAGE","DRAWER_MIN_WIDTH","HvWizardContent","classes","fixedHeight","loading","children","summaryContent","context","setContext","summary","tab","useContext","HvWizardContext","arrayChildren","React","Children","toArray","initialContext","reduce","acc","child","index","invalid","props","mustValidate","valid","form","touched","summaryRef","useRef","resizedRef","height","width","containerRef","sizes","useElementSize","summaryHeight","setSummaryHeight","useState","summaryWidth","setSummaryWidth","summaryLeft","setSummaryLeft","updateSummaryMeasures","useCallback","newSizes","modalWidth","drawerWidth","Math","max","current","useEffect","pageHeight","getBoundingClientRect","updatedContext","Object","entries","key","childState","translateX","ClassNames","css","cx","className","wizardContentClasses","styles","ref","el","summarySticky","summaryContainer","style","left","transform","_jsx","HvDialogContent","contentContainer","indentContent","LoadingContainer","hidden","map","cloneElement"],"mappings":"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"}
1
+ {"version":3,"file":"WizardContent.cjs","sources":["../../../../../src/components/Wizard/WizardContent/WizardContent.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport { HvBaseProps, HvDialogContent } from \"@hitachivantara/uikit-react-core\";\nimport { useElementSize } from \"usehooks-ts\";\nimport React, {\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n HvWizardContext,\n HvWizardTabs,\n wizardContentClasses,\n HvWizardContentClasses,\n} from \"..\";\nimport { styles } from \"./WizardContent.styles\";\nimport { LoadingContainer } from \"./LoadingContainer\";\n\nexport interface HvWizardContentProps extends HvBaseProps {\n /** Forces minimum height to the component. */\n fixedHeight?: boolean;\n /** Whether the loading animation is shown. */\n loading?: boolean;\n /** The content of the summary. */\n summaryContent?: React.ReactNode;\n /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n classes?: HvWizardContentClasses;\n}\n\ntype ChildElement = React.ReactElement<HvWizardTabs>;\n\nconst DRAWER_PERCENTAGE = 0.3;\nconst DRAWER_MIN_WIDTH = 280;\n\nexport const HvWizardContent = ({\n classes,\n fixedHeight = false,\n loading = false,\n children,\n summaryContent,\n}: HvWizardContentProps) => {\n const { context, setContext, summary, tab } = useContext(HvWizardContext);\n\n const arrayChildren = React.Children.toArray(children) as ChildElement[];\n\n const initialContext = arrayChildren.reduce(\n (acc, child: ChildElement, index) => {\n const invalid =\n \"mustValidate\" in child.props && child.props.mustValidate === true\n ? false\n : null;\n const valid = invalid ?? (index === 0 || null);\n return {\n ...acc,\n [index]: { ...child.props, form: {}, valid, touched: index === 0 },\n };\n },\n {}\n );\n\n const summaryRef = useRef<HTMLElement>();\n const resizedRef = useRef({ height: 0, width: 0 });\n const [containerRef, sizes] = useElementSize();\n\n const [summaryHeight, setSummaryHeight] = useState(0);\n const [summaryWidth, setSummaryWidth] = useState(0);\n const [summaryLeft, setSummaryLeft] = useState(0);\n\n const updateSummaryMeasures = useCallback((newSizes) => {\n const modalWidth = newSizes.width;\n const drawerWidth = modalWidth * DRAWER_PERCENTAGE;\n setSummaryHeight(newSizes.height);\n setSummaryWidth(Math.max(drawerWidth, DRAWER_MIN_WIDTH));\n setSummaryLeft(modalWidth - Math.max(drawerWidth, DRAWER_MIN_WIDTH));\n\n resizedRef.current = {\n height: newSizes.height,\n width: newSizes.width,\n };\n }, []);\n\n useEffect(() => {\n const pageHeight = summaryRef.current?.getBoundingClientRect?.()?.height;\n if (\n (summary && sizes.height !== resizedRef.current.height) ||\n sizes.width !== resizedRef.current.width\n ) {\n updateSummaryMeasures(sizes);\n }\n\n if (pageHeight && sizes.height !== pageHeight) {\n updateSummaryMeasures({\n width: sizes.width,\n height: pageHeight,\n });\n }\n }, [tab, sizes, summary, updateSummaryMeasures]);\n\n useEffect(() => {\n setContext(initialContext);\n }, []);\n\n useEffect(() => {\n if (tab && !context[tab]?.touched) {\n const updatedContext = Object.entries(context).reduce(\n (acc, [key, childState]) => ({\n ...acc,\n ...(+key <= tab\n ? {\n [key]: {\n ...childState,\n touched: true,\n valid: childState?.valid ?? true,\n },\n }\n : { [key]: childState }),\n }),\n {}\n );\n\n setContext(updatedContext);\n }\n }, [tab]);\n\n const translateX = summaryWidth ? summaryWidth + 10 : 450;\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n wizardContentClasses.summaryRef,\n css(styles.summaryRef),\n classes?.summaryRef\n )}\n ref={(el) => {\n containerRef(el);\n if (el) {\n summaryRef.current = el;\n }\n }}\n >\n {summary !== null && (\n <div\n className={cx(\n wizardContentClasses.summarySticky,\n css(styles.summarySticky),\n classes?.summarySticky\n )}\n >\n <div\n className={cx(\n wizardContentClasses.summaryContainer,\n css(styles.summaryContainer),\n classes?.summaryContainer\n )}\n style={{\n left: summaryLeft,\n width: summaryWidth,\n height: summaryHeight,\n transform: `translate(${summary ? 0 : translateX}px, 0)`,\n }}\n >\n {summaryContent}\n </div>\n </div>\n )}\n <HvDialogContent\n className={cx(\n wizardContentClasses.contentContainer,\n fixedHeight && wizardContentClasses.fixedHeight,\n css(styles.contentContainer),\n fixedHeight && css(styles.fixedHeight),\n classes?.contentContainer,\n fixedHeight && classes?.fixedHeight\n )}\n indentContent\n >\n <LoadingContainer hidden={!loading}>\n {React.Children.map(arrayChildren, (child, index) => {\n if (index === tab) {\n return React.cloneElement(child as React.ReactElement, {\n tab,\n });\n }\n return null;\n })}\n </LoadingContainer>\n </HvDialogContent>\n </div>\n )}\n </ClassNames>\n );\n};\n"],"names":["DRAWER_PERCENTAGE","DRAWER_MIN_WIDTH","HvWizardContent","classes","fixedHeight","loading","children","summaryContent","context","setContext","summary","tab","useContext","HvWizardContext","arrayChildren","React","Children","toArray","initialContext","reduce","acc","child","index","invalid","props","mustValidate","valid","form","touched","summaryRef","useRef","resizedRef","height","width","containerRef","sizes","useElementSize","summaryHeight","setSummaryHeight","useState","summaryWidth","setSummaryWidth","summaryLeft","setSummaryLeft","updateSummaryMeasures","useCallback","newSizes","modalWidth","drawerWidth","Math","max","current","useEffect","pageHeight","getBoundingClientRect","updatedContext","Object","entries","key","childState","translateX","ClassNames","css","cx","className","wizardContentClasses","styles","ref","el","summarySticky","summaryContainer","style","left","transform","_jsx","HvDialogContent","contentContainer","indentContent","LoadingContainer","hidden","map","cloneElement"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"loadingContainerClasses.cjs","sources":["../../../../../src/components/Wizard/WizardContent/loadingContainerClasses.ts"],"sourcesContent":["import { getClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport type HvWizardLoadingContainerClasses = {\n loading?: string;\n overlay?: string;\n blur?: string;\n};\n\nconst classKeys: (keyof HvWizardLoadingContainerClasses)[] = [\n \"blur\",\n \"loading\",\n \"overlay\",\n];\n\nconst wizardLoadingContainerClasses = getClasses(\n classKeys,\n \"HvWizard-LoadingContainer\"\n);\n\nexport default wizardLoadingContainerClasses;\n"],"names":["classKeys","wizardLoadingContainerClasses","getClasses"],"mappings":";;;AAQA,MAAMA,YAAuD,CAC3D,QACA,WACA,SAAS;AAGX,MAAMC,gCAAgCC,eACpCF,WAAAA,WACA,2BAA2B;AAG7B,MAAA,kCAAeC;;"}
1
+ {"version":3,"file":"loadingContainerClasses.cjs","sources":["../../../../../src/components/Wizard/WizardContent/loadingContainerClasses.ts"],"sourcesContent":["import { getClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport type HvWizardLoadingContainerClasses = {\n loading?: string;\n overlay?: string;\n blur?: string;\n};\n\nconst classKeys: (keyof HvWizardLoadingContainerClasses)[] = [\n \"blur\",\n \"loading\",\n \"overlay\",\n];\n\nconst wizardLoadingContainerClasses = getClasses(\n classKeys,\n \"HvWizard-LoadingContainer\"\n);\n\nexport default wizardLoadingContainerClasses;\n"],"names":["classKeys","wizardLoadingContainerClasses","getClasses"],"mappings":";;;AAQA,MAAMA,YAAuD,CAC3D,QACA,WACA,SAAS;AAGX,MAAMC,gCAAgCC,eACpCF,WAAAA,WACA,2BACF;AAEA,MAAA,kCAAeC;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"WizardTitle.cjs","sources":["../../../../../src/components/Wizard/WizardTitle/WizardTitle.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvButton,\n HvDialogTitle,\n HvGrid,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Report } from \"@hitachivantara/uikit-react-icons\";\nimport { useContext, useEffect, useState } from \"react\";\nimport { HvStepNavigation, HvStepNavigationProps } from \"../../StepNavigation\";\nimport { HvStepProps } from \"../../StepNavigation/DefaultNavigation\";\nimport { HvWizardContext, wizardTitleClasses, HvWizardTitleClasses } from \"..\";\nimport { styles } from \"./WizardTitle.styles\";\n\nexport interface HvWizardTitleProps extends HvBaseProps {\n /** Title for the wizard. */\n title?: string;\n /** Shows the summary button. */\n hasSummary?: boolean;\n /** An object containing all the labels for the wizard header. */\n labels?: {\n /** Summary button label. */\n summary?: string;\n };\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?: HvWizardTitleClasses;\n}\n\nconst switchTabState = (state, currentTab, index) => {\n if (index === currentTab) return \"Current\";\n if (state.valid) return \"Completed\";\n if (state.valid === null) return \"Enabled\";\n if (state.touched && state.valid === false) return \"Failed\";\n // \"Disabled\"\n // \"Pending\"\n return \"Enabled\";\n};\n\nexport const HvWizardTitle = ({\n title,\n hasSummary = false,\n labels = {},\n classes,\n customStep = {},\n}: HvWizardTitleProps) => {\n const { context, summary, setSummary, tab, setTab } =\n useContext(HvWizardContext);\n\n const [steps, setSteps] = useState<HvStepProps[]>([]);\n\n useEffect(() => {\n if (summary === null && hasSummary) {\n setSummary(false);\n }\n\n return () => {\n setSummary(false);\n };\n }, []);\n\n useEffect(() => {\n const contextArray = Object.entries(context);\n\n if (contextArray.length) {\n const updatedSteps: HvStepProps[] = contextArray.map(\n ([, childState], index) => {\n return {\n title: childState?.name ?? `${index + 1}`,\n state: switchTabState(childState, tab, index),\n onClick: () => setTab(index),\n };\n }\n );\n\n setSteps(updatedSteps);\n }\n }, [context, tab, setTab]);\n\n const toggleSummary = () => {\n setSummary((oldSummary) => !oldSummary);\n };\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <HvDialogTitle\n className={cx(\n wizardTitleClasses.headerContainer,\n css(styles.headerContainer),\n classes?.headerContainer\n )}\n classes={{\n messageContainer: cx(\n wizardTitleClasses.messageContainer,\n css(styles.messageContainer),\n classes?.messageContainer\n ),\n }}\n >\n <HvGrid\n container\n justifyContent=\"space-between\"\n alignItems=\"center\"\n className={cx(\n wizardTitleClasses.titleContainer,\n css(styles.titleContainer),\n classes?.titleContainer\n )}\n >\n {title && (\n <HvTypography variant=\"title3\" component=\"h3\">\n {title}\n </HvTypography>\n )}\n {!!steps.length && (\n <HvStepNavigation\n className={cx(\n wizardTitleClasses.stepContainer,\n css(styles.stepContainer),\n classes?.stepContainer\n )}\n steps={steps}\n type=\"Default\"\n stepSize=\"xs\"\n width={{\n xs: 200,\n sm: 350,\n md: 600,\n lg: 800,\n xl: 1000,\n }}\n {...customStep}\n />\n )}\n {hasSummary && (\n <HvButton\n variant=\"secondarySubtle\"\n className={cx(\n wizardTitleClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n classes={{\n root: cx(\n wizardTitleClasses.rootSummaryButton,\n css(styles.rootSummaryButton),\n classes?.rootSummaryButton\n ),\n }}\n onClick={toggleSummary}\n startIcon={<Report />}\n >\n {`${labels.summary ?? \"Summary\"}`}\n </HvButton>\n )}\n </HvGrid>\n </HvDialogTitle>\n )}\n </ClassNames>\n );\n};\n"],"names":["switchTabState","state","currentTab","index","valid","touched","HvWizardTitle","title","hasSummary","labels","classes","customStep","context","summary","setSummary","tab","setTab","useContext","HvWizardContext","steps","setSteps","useState","useEffect","contextArray","Object","entries","length","updatedSteps","map","childState","name","onClick","toggleSummary","oldSummary","ClassNames","children","css","cx","HvDialogTitle","className","wizardTitleClasses","headerContainer","styles","messageContainer","HvGrid","container","justifyContent","alignItems","titleContainer","_jsx","HvTypography","variant","component","HvStepNavigation","stepContainer","type","stepSize","width","xs","sm","md","lg","xl","HvButton","buttonWidth","root","rootSummaryButton","startIcon","Report"],"mappings":"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"}
1
+ {"version":3,"file":"WizardTitle.cjs","sources":["../../../../../src/components/Wizard/WizardTitle/WizardTitle.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvButton,\n HvDialogTitle,\n HvGrid,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Report } from \"@hitachivantara/uikit-react-icons\";\nimport { useContext, useEffect, useState } from \"react\";\nimport { HvStepNavigation, HvStepNavigationProps } from \"../../StepNavigation\";\nimport { HvStepProps } from \"../../StepNavigation/DefaultNavigation\";\nimport { HvWizardContext, wizardTitleClasses, HvWizardTitleClasses } from \"..\";\nimport { styles } from \"./WizardTitle.styles\";\n\nexport interface HvWizardTitleProps extends HvBaseProps {\n /** Title for the wizard. */\n title?: string;\n /** Shows the summary button. */\n hasSummary?: boolean;\n /** An object containing all the labels for the wizard header. */\n labels?: {\n /** Summary button label. */\n summary?: string;\n };\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?: HvWizardTitleClasses;\n}\n\nconst switchTabState = (state, currentTab, index) => {\n if (index === currentTab) return \"Current\";\n if (state.valid) return \"Completed\";\n if (state.valid === null) return \"Enabled\";\n if (state.touched && state.valid === false) return \"Failed\";\n // \"Disabled\"\n // \"Pending\"\n return \"Enabled\";\n};\n\nexport const HvWizardTitle = ({\n title,\n hasSummary = false,\n labels = {},\n classes,\n customStep = {},\n}: HvWizardTitleProps) => {\n const { context, summary, setSummary, tab, setTab } =\n useContext(HvWizardContext);\n\n const [steps, setSteps] = useState<HvStepProps[]>([]);\n\n useEffect(() => {\n if (summary === null && hasSummary) {\n setSummary(false);\n }\n\n return () => {\n setSummary(false);\n };\n }, []);\n\n useEffect(() => {\n const contextArray = Object.entries(context);\n\n if (contextArray.length) {\n const updatedSteps: HvStepProps[] = contextArray.map(\n ([, childState], index) => {\n return {\n title: childState?.name ?? `${index + 1}`,\n state: switchTabState(childState, tab, index),\n onClick: () => setTab(index),\n };\n }\n );\n\n setSteps(updatedSteps);\n }\n }, [context, tab, setTab]);\n\n const toggleSummary = () => {\n setSummary((oldSummary) => !oldSummary);\n };\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <HvDialogTitle\n className={cx(\n wizardTitleClasses.headerContainer,\n css(styles.headerContainer),\n classes?.headerContainer\n )}\n classes={{\n messageContainer: cx(\n wizardTitleClasses.messageContainer,\n css(styles.messageContainer),\n classes?.messageContainer\n ),\n }}\n >\n <HvGrid\n container\n justifyContent=\"space-between\"\n alignItems=\"center\"\n className={cx(\n wizardTitleClasses.titleContainer,\n css(styles.titleContainer),\n classes?.titleContainer\n )}\n >\n {title && (\n <HvTypography variant=\"title3\" component=\"h3\">\n {title}\n </HvTypography>\n )}\n {!!steps.length && (\n <HvStepNavigation\n className={cx(\n wizardTitleClasses.stepContainer,\n css(styles.stepContainer),\n classes?.stepContainer\n )}\n steps={steps}\n type=\"Default\"\n stepSize=\"xs\"\n width={{\n xs: 200,\n sm: 350,\n md: 600,\n lg: 800,\n xl: 1000,\n }}\n {...customStep}\n />\n )}\n {hasSummary && (\n <HvButton\n variant=\"secondarySubtle\"\n className={cx(\n wizardTitleClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n classes={{\n root: cx(\n wizardTitleClasses.rootSummaryButton,\n css(styles.rootSummaryButton),\n classes?.rootSummaryButton\n ),\n }}\n onClick={toggleSummary}\n startIcon={<Report />}\n >\n {`${labels.summary ?? \"Summary\"}`}\n </HvButton>\n )}\n </HvGrid>\n </HvDialogTitle>\n )}\n </ClassNames>\n );\n};\n"],"names":["switchTabState","state","currentTab","index","valid","touched","HvWizardTitle","title","hasSummary","labels","classes","customStep","context","summary","setSummary","tab","setTab","useContext","HvWizardContext","steps","setSteps","useState","useEffect","contextArray","Object","entries","length","updatedSteps","map","childState","name","onClick","toggleSummary","oldSummary","ClassNames","children","css","cx","HvDialogTitle","className","wizardTitleClasses","headerContainer","styles","messageContainer","HvGrid","container","justifyContent","alignItems","titleContainer","_jsx","HvTypography","variant","component","HvStepNavigation","stepContainer","type","stepSize","width","xs","sm","md","lg","xl","HvButton","buttonWidth","root","rootSummaryButton","startIcon","Report"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"DefaultNavigation.js","sources":["../../../../../src/components/StepNavigation/DefaultNavigation/DefaultNavigation.tsx"],"sourcesContent":["import {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvDefaultNavigationClasses } from \"./defaultNavigationClasses\";\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 JSX.element 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 ) => JSX.Element | null;\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 /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvDefaultNavigationClasses;\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":["HvDefaultNavigation","numSteps","stepSize","getTitles","getDynamicValues","className","children","other","activeTheme","useTheme","container","maxSize","avatar","minSize","stepSizes","StepComponent","HvStep","stepsWidth","width","titleWidth","separatorWidth","maxWidth","Math","max","minWidth","Steps","titles","state","variant","titleDisabled","_jsx","navWidth","separatorValues","getColor","height","stepNavigation","defaultSeparatorHeight","stepValues"],"mappings":";;;;AAmDO,MAAMA,sBAAsBA,CAAC;AAAA,EAClCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACqB,MAAM;AACxB,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,SAAU;AAG5B,QAAA;AAAA,IAAEC,WAAWC;AAAAA,IAASC,QAAQC;AAAAA,EAAAA,IAAYC,UAAUZ,QAAQ;AAClE,QAAMa,gBAAgBC;AAGhBC,QAAAA,aAAaN,UAAUE,WAAWZ,WAAW;AAC7C,QAAA;AAAA,IAAEiB;AAAAA,IAAOC;AAAAA,IAAYC;AAAAA,EAAAA,IAAmBhB,iBAAiBa,UAAU;AAGzE,QAAMI,WAAWC,KAAKC,IAAIJ,aAAaN,SAASO,cAAc;AAC9D,QAAMI,WAAWF,KAAKC,IACpBJ,cAAcR,UAAUE,WAAW,KACnCO,cAAc;AAIhB,QAAMK,QAAQnB;AAERoB,QAAAA,SAASvB,UAAU,CAAC;AAAA,IAAEwB;AAAAA,EAAAA,OAAa;AAAA,IACvCC,SAAS;AAAA,IACTT;AAAAA,IACAU,eAAeF,UAAU;AAAA,EACzB,EAAA;AAEF,8BACE,OAAA;AAAA,IAAA,GAASpB;AAAAA,IAAKD,UAAA,CACZwB,oBAACL,OAAK;AAAA,MAEFR;AAAAA,MACAc,UAAUb;AAAAA,MACVc,iBAAiB;AAAA,QACfR;AAAAA,QACAH;AAAAA,QACAY;AAAAA,QACAC,SAAQ1B,2CAAa2B,eAAeC,2BAA0B;AAAA,MAChE;AAAA,MACAC,YAAY;AAAA,QACVxB;AAAAA,QACAF;AAAAA,QACAI;AAAAA,MACF;AAAA,IAAC,CAAA,GAGJW,MAAM;AAAA,EAAA,CACH;AAEV;"}
1
+ {"version":3,"file":"DefaultNavigation.js","sources":["../../../../../src/components/StepNavigation/DefaultNavigation/DefaultNavigation.tsx"],"sourcesContent":["import {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvDefaultNavigationClasses } from \"./defaultNavigationClasses\";\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 JSX.element 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 ) => JSX.Element | null;\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 /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvDefaultNavigationClasses;\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":["HvDefaultNavigation","numSteps","stepSize","getTitles","getDynamicValues","className","children","other","activeTheme","useTheme","container","maxSize","avatar","minSize","stepSizes","StepComponent","HvStep","stepsWidth","width","titleWidth","separatorWidth","maxWidth","Math","max","minWidth","Steps","titles","state","variant","titleDisabled","_jsx","navWidth","separatorValues","getColor","height","stepNavigation","defaultSeparatorHeight","stepValues"],"mappings":";;;;AAmDO,MAAMA,sBAAsBA,CAAC;AAAA,EAClCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACqB,MAAM;AACxB,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,SAAS;AAG3B,QAAA;AAAA,IAAEC,WAAWC;AAAAA,IAASC,QAAQC;AAAAA,EAAAA,IAAYC,UAAUZ,QAAQ;AAClE,QAAMa,gBAAgBC;AAGhBC,QAAAA,aAAaN,UAAUE,WAAWZ,WAAW;AAC7C,QAAA;AAAA,IAAEiB;AAAAA,IAAOC;AAAAA,IAAYC;AAAAA,EAAAA,IAAmBhB,iBAAiBa,UAAU;AAGzE,QAAMI,WAAWC,KAAKC,IAAIJ,aAAaN,SAASO,cAAc;AAC9D,QAAMI,WAAWF,KAAKC,IACpBJ,cAAcR,UAAUE,WAAW,KACnCO,cACF;AAGA,QAAMK,QAAQnB;AAERoB,QAAAA,SAASvB,UAAU,CAAC;AAAA,IAAEwB;AAAAA,EAAAA,OAAa;AAAA,IACvCC,SAAS;AAAA,IACTT;AAAAA,IACAU,eAAeF,UAAU;AAAA,EACzB,EAAA;AAEF,8BACE,OAAA;AAAA,IAAA,GAASpB;AAAAA,IAAKD,UAAA,CACZwB,oBAACL,OAAK;AAAA,MAEFR;AAAAA,MACAc,UAAUb;AAAAA,MACVc,iBAAiB;AAAA,QACfR;AAAAA,QACAH;AAAAA,QACAY;AAAAA,QACAC,SAAQ1B,2CAAa2B,eAAeC,2BAA0B;AAAA,MAChE;AAAA,MACAC,YAAY;AAAA,QACVxB;AAAAA,QACAF;AAAAA,QACAI;AAAAA,MACF;AAAA,IAEH,CAAA,GACAW,MAAM;AAAA,EAAA,CACJ;AAET;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Step.js","sources":["../../../../../../src/components/StepNavigation/DefaultNavigation/Step/Step.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n Level0Good,\n Level3Bad,\n HourGlass,\n} from \"@hitachivantara/uikit-react-icons\";\nimport {\n HvAvatarSize,\n HvButtonProps,\n HvBaseProps,\n} from \"@hitachivantara/uikit-react-core\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { StyledRoot, StyledButton, StyledAvatar } from \"./Step.styles\";\nimport stepClasses, { HvStepClasses } from \"./stepClasses\";\nimport { getColor, getSemantic } from \"../utils\";\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,\n state,\n title,\n onClick,\n disabled,\n size = \"md\",\n number = 1,\n}: HvStepProps) => {\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, theme);\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 <StyledRoot\n className={clsx(\n className,\n stepClasses.root,\n classes?.root,\n state !== \"Current\" && clsx(stepClasses.notCurrent, classes?.notCurrent)\n )}\n $notCurrent={state !== \"Current\"}\n >\n <StyledButton\n className={clsx(\n stepClasses.ghost,\n classes?.ghost,\n state === \"Current\" &&\n clsx(stepClasses.ghostDisabled, classes?.ghostDisabled)\n )}\n aria-label={`step-${title}`}\n icon\n variant=\"secondaryGhost\"\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n <StyledAvatar\n className={clsx(\n stepClasses.avatar,\n classes?.avatar,\n stepClasses[size],\n classes?.[size]\n )}\n backgroundColor={backgroundColor}\n status={status}\n size={size}\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 </StyledAvatar>\n </StyledButton>\n </StyledRoot>\n );\n};\n"],"names":["HvStep","className","classes","state","title","onClick","disabled","size","number","iconSize","xs","sm","md","ml","xl","squareL","Pending","Failed","Completed","svgSize","lg","backgroundColor","getColor","theme","color","undefined","semantic","getSemantic","status","IconComponent","HourGlass","Level3Bad","Level0Good","StyledRoot","clsx","stepClasses","root","notCurrent","$notCurrent","children","StyledButton","ghost","ghostDisabled","icon","variant","overrideIconColors","includes","StyledAvatar","avatar","$size","_jsx","width","height"],"mappings":";;;;;;;AA6CO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,OAAO;AAAA,EACPC,SAAS;AACE,MAAM;AACjB,QAAMC,WAAW;AAAA,IACfC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJP,IAAI;AAEN,QAAMQ,UAAU;AAAA,IACdC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,WAAW;AAAA,IACXf,KAAK;AAEP,QAAMgB,UAAU;AAAA,IACdT,IAAIK,UAAU;AAAA,IACdJ,IAAII;AAAAA,IACJH,IAAIG,UAAU;AAAA,IACdK,IAAIL,UAAU;AAAA,IACdD,IAAIC,UAAU;AAAA,IACdR,IAAI;AAEAc,QAAAA,kBAAkBC,SAASnB,OAAOoB,KAAK;AAEvCC,QAAAA,QAAQrB,UAAU,YAAY,UAAUsB;AAC9C,QAAMC,WAAWvB,UAAU,YAAYwB,YAAYxB,KAAK,IAAIsB;AACtDG,QAAAA,SAASzB,UAAU,YAAY,iBAAiBsB;AAEtD,QAAMI,gBAAgB;AAAA,IACpBb,SAASc;AAAAA,IACTb,QAAQc;AAAAA,IACRb,WAAWc;AAAAA,IACX7B,KAAK;AAEP,6BACG8B,YAAU;AAAA,IACThC,WAAWiC,KACTjC,WACAkC,YAAYC,MACZlC,mCAASkC,MACTjC,UAAU,aAAa+B,KAAKC,YAAYE,YAAYnC,mCAASmC,UAAU,CAAC;AAAA,IAE1EC,aAAanC,UAAU;AAAA,IAAUoC,8BAEhCC,cAAY;AAAA,MACXvC,WAAWiC,KACTC,YAAYM,OACZvC,mCAASuC,OACTtC,UAAU,aACR+B,KAAKC,YAAYO,eAAexC,mCAASwC,aAAa,CAAC;AAAA,MAE3D,cAAa,QAAOtC;AAAAA,MACpBuC,MAAI;AAAA,MACJC,SAAQ;AAAA,MACRC,oBAAoB;AAAA,MACpBvC,UAAUA,YAAY,CAAC,WAAW,UAAU,EAAEwC,SAAS3C,KAAK;AAAA,MAC5DE;AAAAA,MAAiBkC,8BAEhBQ,cAAY;AAAA,QACX9C,WAAWiC,KACTC,YAAYa,QACZ9C,mCAAS8C,QACTb,YAAY5B,IAAI,GAChBL,mCAAUK,KAAK;AAAA,QAEjBc;AAAAA,QACAO;AAAAA,QACArB;AAAAA,QACA0C,OAAO1C;AAAAA,QAAKgC,UAEXV,gBACCqB,oBAACrB,eAAa;AAAA,UACZL;AAAAA,UACAE;AAAAA,UACAyB,OAAOhC;AAAAA,UACPiC,QAAQjC;AAAAA,UACRV;AAAAA,QAAmB,CAAA,IAGrBD;AAAAA,MAAAA,CACD;AAAA,IAAA,CACY;AAAA,EAAA,CAEN;AAEjB;"}
1
+ {"version":3,"file":"Step.js","sources":["../../../../../../src/components/StepNavigation/DefaultNavigation/Step/Step.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n Level0Good,\n Level3Bad,\n HourGlass,\n} from \"@hitachivantara/uikit-react-icons\";\nimport {\n HvAvatarSize,\n HvButtonProps,\n HvBaseProps,\n} from \"@hitachivantara/uikit-react-core\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { StyledRoot, StyledButton, StyledAvatar } from \"./Step.styles\";\nimport stepClasses, { HvStepClasses } from \"./stepClasses\";\nimport { getColor, getSemantic } from \"../utils\";\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,\n state,\n title,\n onClick,\n disabled,\n size = \"md\",\n number = 1,\n}: HvStepProps) => {\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, theme);\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 <StyledRoot\n className={clsx(\n className,\n stepClasses.root,\n classes?.root,\n state !== \"Current\" && clsx(stepClasses.notCurrent, classes?.notCurrent)\n )}\n $notCurrent={state !== \"Current\"}\n >\n <StyledButton\n className={clsx(\n stepClasses.ghost,\n classes?.ghost,\n state === \"Current\" &&\n clsx(stepClasses.ghostDisabled, classes?.ghostDisabled)\n )}\n aria-label={`step-${title}`}\n icon\n variant=\"secondaryGhost\"\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n <StyledAvatar\n className={clsx(\n stepClasses.avatar,\n classes?.avatar,\n stepClasses[size],\n classes?.[size]\n )}\n backgroundColor={backgroundColor}\n status={status}\n size={size}\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 </StyledAvatar>\n </StyledButton>\n </StyledRoot>\n );\n};\n"],"names":["HvStep","className","classes","state","title","onClick","disabled","size","number","iconSize","xs","sm","md","ml","xl","squareL","Pending","Failed","Completed","svgSize","lg","backgroundColor","getColor","theme","color","undefined","semantic","getSemantic","status","IconComponent","HourGlass","Level3Bad","Level0Good","StyledRoot","clsx","stepClasses","root","notCurrent","$notCurrent","children","StyledButton","ghost","ghostDisabled","icon","variant","overrideIconColors","includes","StyledAvatar","avatar","$size","_jsx","width","height"],"mappings":";;;;;;;AA6CO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,OAAO;AAAA,EACPC,SAAS;AACE,MAAM;AACjB,QAAMC,WAAW;AAAA,IACfC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJP,IAAI;AAEN,QAAMQ,UAAU;AAAA,IACdC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,WAAW;AAAA,IACXf,KAAK;AAEP,QAAMgB,UAAU;AAAA,IACdT,IAAIK,UAAU;AAAA,IACdJ,IAAII;AAAAA,IACJH,IAAIG,UAAU;AAAA,IACdK,IAAIL,UAAU;AAAA,IACdD,IAAIC,UAAU;AAAA,IACdR,IAAI;AAEAc,QAAAA,kBAAkBC,SAASnB,OAAOoB,KAAK;AAEvCC,QAAAA,QAAQrB,UAAU,YAAY,UAAUsB;AAC9C,QAAMC,WAAWvB,UAAU,YAAYwB,YAAYxB,KAAK,IAAIsB;AACtDG,QAAAA,SAASzB,UAAU,YAAY,iBAAiBsB;AAEtD,QAAMI,gBAAgB;AAAA,IACpBb,SAASc;AAAAA,IACTb,QAAQc;AAAAA,IACRb,WAAWc;AAAAA,IACX7B,KAAK;AAEP,6BACG8B,YAAU;AAAA,IACThC,WAAWiC,KACTjC,WACAkC,YAAYC,MACZlC,mCAASkC,MACTjC,UAAU,aAAa+B,KAAKC,YAAYE,YAAYnC,mCAASmC,UAAU,CACzE;AAAA,IACAC,aAAanC,UAAU;AAAA,IAAUoC,8BAEhCC,cAAY;AAAA,MACXvC,WAAWiC,KACTC,YAAYM,OACZvC,mCAASuC,OACTtC,UAAU,aACR+B,KAAKC,YAAYO,eAAexC,mCAASwC,aAAa,CAC1D;AAAA,MACA,cAAa,QAAOtC;AAAAA,MACpBuC,MAAI;AAAA,MACJC,SAAQ;AAAA,MACRC,oBAAoB;AAAA,MACpBvC,UAAUA,YAAY,CAAC,WAAW,UAAU,EAAEwC,SAAS3C,KAAK;AAAA,MAC5DE;AAAAA,MAAiBkC,8BAEhBQ,cAAY;AAAA,QACX9C,WAAWiC,KACTC,YAAYa,QACZ9C,mCAAS8C,QACTb,YAAY5B,IAAI,GAChBL,mCAAUK,KACZ;AAAA,QACAc;AAAAA,QACAO;AAAAA,QACArB;AAAAA,QACA0C,OAAO1C;AAAAA,QAAKgC,UAEXV,gBACCqB,oBAACrB,eAAa;AAAA,UACZL;AAAAA,UACAE;AAAAA,UACAyB,OAAOhC;AAAAA,UACPiC,QAAQjC;AAAAA,UACRV;AAAAA,QACD,CAAA,IAEDD;AAAAA,MAAAA,CAEU;AAAA,IAAA,CACF;AAAA,EAAA,CACJ;AAEhB;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Step.styles.js","sources":["../../../../../../src/components/StepNavigation/DefaultNavigation/Step/Step.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { HvAvatar, HvButton } from \"@hitachivantara/uikit-react-core\";\n\nexport const StyledRoot = styled(\"div\")(\n ({ $notCurrent }: { $notCurrent: boolean }) => ({\n ...($notCurrent && {\n margin: \"-8px\",\n }),\n })\n);\n\nexport const StyledButton = styled(HvButton)({\n \"&:hover\": {\n backgroundColor: \"transparent\",\n },\n \"&$ghostDisabled\": {\n cursor: \"default\",\n },\n \"&$ghostDisabled&:hover\": {\n cursor: \"default\",\n },\n});\n\nexport const StyledAvatar = styled(HvAvatar)(\n ({ $size }: { $size: string }) => ({\n ...($size === \"xs\" && {\n fontSize: \"0.625rem\",\n }),\n ...($size === \"sm\" && {\n fontSize: \"1rem\",\n }),\n ...($size === \"md\" && {\n fontSize: \"1.5rem\",\n }),\n ...($size === \"lg\" && {\n fontSize: \"2rem\",\n }),\n ...($size === \"xl\" && {\n fontSize: \"2.5rem\",\n }),\n })\n);\n"],"names":["StyledRoot","process","env","NODE_ENV","target","label","$notCurrent","margin","StyledButton","HvButton","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledAvatar","HvAvatar","$size","fontSize"],"mappings":";;;;;AAGO,MAAMA,aAAoB,wBAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACpC,CAAC;AAAA,EAAEC;AAAsC,OAAO;AAAA,EAC9C,GAAIA,eAAe;AAAA,IACjBC,QAAQ;AAAA,EACV;AACF,IAAEN,QAAAC,IAAAC,aACH,eAAA,KAAA,iyDAAA;AAEM,MAAMK,eAAsBC,wBAAAA,UAAQR,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAO,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAU1C;AAEK,MAAMC,eAAsBC,wBAAAA,UAAQf,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACzC,CAAC;AAAA,EAAEY;AAAyB,OAAO;AAAA,EACjC,GAAIA,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AACF,IAAEjB,QAAAC,IAAAC,aACH,eAAA,KAAA,iyDAAA;"}
1
+ {"version":3,"file":"Step.styles.js","sources":["../../../../../../src/components/StepNavigation/DefaultNavigation/Step/Step.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { HvAvatar, HvButton } from \"@hitachivantara/uikit-react-core\";\n\nexport const StyledRoot = styled(\"div\")(\n ({ $notCurrent }: { $notCurrent: boolean }) => ({\n ...($notCurrent && {\n margin: \"-8px\",\n }),\n })\n);\n\nexport const StyledButton = styled(HvButton)({\n \"&:hover\": {\n backgroundColor: \"transparent\",\n },\n \"&$ghostDisabled\": {\n cursor: \"default\",\n },\n \"&$ghostDisabled&:hover\": {\n cursor: \"default\",\n },\n});\n\nexport const StyledAvatar = styled(HvAvatar)(\n ({ $size }: { $size: string }) => ({\n ...($size === \"xs\" && {\n fontSize: \"0.625rem\",\n }),\n ...($size === \"sm\" && {\n fontSize: \"1rem\",\n }),\n ...($size === \"md\" && {\n fontSize: \"1.5rem\",\n }),\n ...($size === \"lg\" && {\n fontSize: \"2rem\",\n }),\n ...($size === \"xl\" && {\n fontSize: \"2.5rem\",\n }),\n })\n);\n"],"names":["StyledRoot","process","env","NODE_ENV","target","label","$notCurrent","margin","StyledButton","HvButton","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledAvatar","HvAvatar","$size","fontSize"],"mappings":";;;;;AAGO,MAAMA,aAAoB,wBAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACpC,CAAC;AAAA,EAAEC;AAAsC,OAAO;AAAA,EAC9C,GAAIA,eAAe;AAAA,IACjBC,QAAQ;AAAA,EACV;AACF,IAAEN,QAAAC,IAAAC,k0DACJ;AAEO,MAAMK,eAAsBC,wBAAAA,UAAQR,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAO,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAU3C;AAEM,MAAMC,eAAsBC,wBAAAA,UAAQf,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACzC,CAAC;AAAA,EAAEY;AAAyB,OAAO;AAAA,EACjC,GAAIA,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AAAA,EACA,GAAID,UAAU,QAAQ;AAAA,IACpBC,UAAU;AAAA,EACZ;AACF,IAAEjB,QAAAC,IAAAC,k0DACJ;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Dot.js","sources":["../../../../../../src/components/StepNavigation/SimpleNavigation/Dot/Dot.tsx"],"sourcesContent":["import { HvBaseProps } from \"@hitachivantara/uikit-react-core\";\nimport { ClassNames } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvStepProps } from \"../../DefaultNavigation\";\nimport { StyledButton } from \"./Dot.styles\";\nimport dotClasses, { HvDotClasses } from \"./dotClasses\";\nimport { getColor, dotSizes } from \"../utils\";\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,\n className,\n state,\n title,\n size = \"sm\",\n onClick,\n disabled,\n}: HvDotProps) => {\n const dotSize = dotSizes[size] * (state === \"Current\" ? 1.5 : 1);\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <StyledButton\n className={cx(\n dotClasses.root,\n state === \"Current\" && dotClasses.active,\n (disabled ?? [\"Current\", \"Disabled\"].includes(state)) &&\n dotClasses.ghostDisabled,\n css({\n backgroundColor: getColor(state, theme),\n width: dotSize,\n height: dotSize,\n \"&:hover\": {\n backgroundColor: getColor(state, theme),\n },\n }),\n className,\n classes?.root,\n state === \"Current\" && classes?.active,\n (disabled ?? [\"Current\", \"Disabled\"].includes(state)) &&\n classes?.ghostDisabled\n )}\n aria-label={`step-${title}`}\n icon\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n {[]}\n </StyledButton>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvDot","classes","className","state","title","size","onClick","disabled","dotSize","dotSizes","ClassNames","children","css","cx","StyledButton","dotClasses","root","active","includes","ghostDisabled","backgroundColor","getColor","theme","width","height","icon","overrideIconColors"],"mappings":";;;;;;AAkBO,MAAMA,QAAQA,CAAC;AAAA,EACpBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,OAAO;AAAA,EACPC;AAAAA,EACAC;AACU,MAAM;AAChB,QAAMC,UAAUC,SAASJ,IAAI,KAAKF,UAAU,YAAY,MAAM;AAE9D,6BACGO,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA,0BACNC,cAAY;AAAA,MACXZ,WAAWW,GACTE,WAAWC,MACXb,UAAU,aAAaY,WAAWE,SACjCV,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK,MACjDY,WAAWI,eACbP,IAAI;AAAA,QACFQ,iBAAiBC,SAASlB,OAAOmB,KAAK;AAAA,QACtCC,OAAOf;AAAAA,QACPgB,QAAQhB;AAAAA,QACR,WAAW;AAAA,UACTY,iBAAiBC,SAASlB,OAAOmB,KAAK;AAAA,QACxC;AAAA,MAAA,CACD,GACDpB,WACAD,mCAASe,MACTb,UAAU,cAAaF,mCAASgB,UAC/BV,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK,OACjDF,mCAASkB,cAAa;AAAA,MAE1B,cAAa,QAAOf;AAAAA,MACpBqB,MAAI;AAAA,MACJC,oBAAoB;AAAA,MACpBnB,UAAUA,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK;AAAA,MAC5DG;AAAAA,MAAiBK,UAEhB,CAAA;AAAA,IAAA,CAAE;AAAA,EAAA,CAGI;AAEjB;"}
1
+ {"version":3,"file":"Dot.js","sources":["../../../../../../src/components/StepNavigation/SimpleNavigation/Dot/Dot.tsx"],"sourcesContent":["import { HvBaseProps } from \"@hitachivantara/uikit-react-core\";\nimport { ClassNames } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvStepProps } from \"../../DefaultNavigation\";\nimport { StyledButton } from \"./Dot.styles\";\nimport dotClasses, { HvDotClasses } from \"./dotClasses\";\nimport { getColor, dotSizes } from \"../utils\";\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,\n className,\n state,\n title,\n size = \"sm\",\n onClick,\n disabled,\n}: HvDotProps) => {\n const dotSize = dotSizes[size] * (state === \"Current\" ? 1.5 : 1);\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <StyledButton\n className={cx(\n dotClasses.root,\n state === \"Current\" && dotClasses.active,\n (disabled ?? [\"Current\", \"Disabled\"].includes(state)) &&\n dotClasses.ghostDisabled,\n css({\n backgroundColor: getColor(state, theme),\n width: dotSize,\n height: dotSize,\n \"&:hover\": {\n backgroundColor: getColor(state, theme),\n },\n }),\n className,\n classes?.root,\n state === \"Current\" && classes?.active,\n (disabled ?? [\"Current\", \"Disabled\"].includes(state)) &&\n classes?.ghostDisabled\n )}\n aria-label={`step-${title}`}\n icon\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n {[]}\n </StyledButton>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvDot","classes","className","state","title","size","onClick","disabled","dotSize","dotSizes","ClassNames","children","css","cx","StyledButton","dotClasses","root","active","includes","ghostDisabled","backgroundColor","getColor","theme","width","height","icon","overrideIconColors"],"mappings":";;;;;;AAkBO,MAAMA,QAAQA,CAAC;AAAA,EACpBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,OAAO;AAAA,EACPC;AAAAA,EACAC;AACU,MAAM;AAChB,QAAMC,UAAUC,SAASJ,IAAI,KAAKF,UAAU,YAAY,MAAM;AAE9D,6BACGO,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA,0BACNC,cAAY;AAAA,MACXZ,WAAWW,GACTE,WAAWC,MACXb,UAAU,aAAaY,WAAWE,SACjCV,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK,MACjDY,WAAWI,eACbP,IAAI;AAAA,QACFQ,iBAAiBC,SAASlB,OAAOmB,KAAK;AAAA,QACtCC,OAAOf;AAAAA,QACPgB,QAAQhB;AAAAA,QACR,WAAW;AAAA,UACTY,iBAAiBC,SAASlB,OAAOmB,KAAK;AAAA,QACxC;AAAA,MAAA,CACD,GACDpB,WACAD,mCAASe,MACTb,UAAU,cAAaF,mCAASgB,UAC/BV,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK,OACjDF,mCAASkB,cACb;AAAA,MACA,cAAa,QAAOf;AAAAA,MACpBqB,MAAI;AAAA,MACJC,oBAAoB;AAAA,MACpBnB,UAAUA,YAAY,CAAC,WAAW,UAAU,EAAEW,SAASf,KAAK;AAAA,MAC5DG;AAAAA,MAAiBK,UAEhB,CAAA;AAAA,IAAA,CACW;AAAA,EAAA,CAEN;AAEhB;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Dot.styles.js","sources":["../../../../../../src/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { HvButton } from \"@hitachivantara/uikit-react-core\";\n\nexport const StyledButton = styled(HvButton)({\n borderRadius: \"50%\",\n zIndex: 1,\n});\n"],"names":["StyledButton","HvButton","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__"],"mappings":";;;;;AAGO,MAAMA,eAAsBC,wBAAAA,UAAQC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAG1C;"}
1
+ {"version":3,"file":"Dot.styles.js","sources":["../../../../../../src/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { HvButton } from \"@hitachivantara/uikit-react-core\";\n\nexport const StyledButton = styled(HvButton)({\n borderRadius: \"50%\",\n zIndex: 1,\n});\n"],"names":["StyledButton","HvButton","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__"],"mappings":";;;;;AAGO,MAAMA,eAAsBC,wBAAAA,UAAQC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAG3C;"}
@@ -1 +1 @@
1
- {"version":3,"file":"SimpleNavigation.js","sources":["../../../../../src/components/StepNavigation/SimpleNavigation/SimpleNavigation.tsx"],"sourcesContent":["import {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvStepNavigationProps } from \"../StepNavigation\";\nimport { HvDot, HvDotProps } from \"./Dot\";\nimport { HvSimpleNavigationClasses } from \"./simpleNavigationClasses\";\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\n extends Pick<HvStepNavigationProps, \"stepSize\">,\n Omit<HvBaseProps, \"children\"> {\n /** Number of steps to show on the component. */\n numSteps: number;\n /** Returns a JSX.element 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 ) => JSX.Element | null;\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 /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvSimpleNavigationClasses;\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":["HvSimpleNavigation","numSteps","stepSize","getTitles","getDynamicValues","children","others","activeTheme","useTheme","dotSize","dotSizes","StepComponent","HvDot","stepsWidth","width","titleWidth","separatorWidth","maxWidth","Math","max","minWidth","Steps","titles","rawTitle","number","variant","title","_jsx","navWidth","separatorValues","getColor","height","stepNavigation","simpleSeparatorHeight","stepValues","minSize","maxSize"],"mappings":";;;;AAmDO,MAAMA,qBAAqBA,CAAC;AAAA,EACjCC;AAAAA,EACAC,WAAW;AAAA,EACXC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACoB,MAAM;AACvB,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,SAAU;AAG5BC,QAAAA,UAAUC,SAASR,QAAQ;AACjC,QAAMS,gBAAgBC;AAGhBC,QAAAA,cAAcZ,WAAW,OAAOQ;AAChC,QAAA;AAAA,IAAEK;AAAAA,IAAOC;AAAAA,IAAYC;AAAAA,EAAAA,IAAmBZ,iBAAiBS,UAAU;AAGzE,QAAMI,WAAWC,KAAKC,IAAIJ,aAAaN,SAASO,cAAc;AAC9D,QAAMI,WAAWF,KAAKC,IAAIJ,aAAaN,UAAU,MAAMO,cAAc;AAGrE,QAAMK,QAAQhB;AAERiB,QAAAA,SAASnB,UAAU,CAAC;AAAA,IAAEoB;AAAAA,IAAUC;AAAAA,EAAAA,OAAc;AAAA,IAClDC,SAAS;AAAA,IACTC,OAAQ,GAAEF,WAAWD;AAAAA,IACrBR;AAAAA,EACA,EAAA;AAEF,8BACE,OAAA;AAAA,IAAA,GAAST;AAAAA,IAAMD,UACZiB,CAAAA,QACDK,oBAACN,OAAK;AAAA,MAEFR;AAAAA,MACAe,UAAUd;AAAAA,MACVe,iBAAiB;AAAA,QACfT;AAAAA,QACAH;AAAAA,QACAa;AAAAA,QACAC,SAAQxB,2CAAayB,eAAeC,0BAAyB;AAAA,MAC/D;AAAA,MACAC,YAAY;AAAA,QACVC,SAAS1B;AAAAA,QACT2B,SAAS,MAAM3B;AAAAA,QACfE;AAAAA,MACF;AAAA,IAAA,CAEF,CAAA;AAAA,EAAA,CACE;AAEV;"}
1
+ {"version":3,"file":"SimpleNavigation.js","sources":["../../../../../src/components/StepNavigation/SimpleNavigation/SimpleNavigation.tsx"],"sourcesContent":["import {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvStepNavigationProps } from \"../StepNavigation\";\nimport { HvDot, HvDotProps } from \"./Dot\";\nimport { HvSimpleNavigationClasses } from \"./simpleNavigationClasses\";\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\n extends Pick<HvStepNavigationProps, \"stepSize\">,\n Omit<HvBaseProps, \"children\"> {\n /** Number of steps to show on the component. */\n numSteps: number;\n /** Returns a JSX.element 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 ) => JSX.Element | null;\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 /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvSimpleNavigationClasses;\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":["HvSimpleNavigation","numSteps","stepSize","getTitles","getDynamicValues","children","others","activeTheme","useTheme","dotSize","dotSizes","StepComponent","HvDot","stepsWidth","width","titleWidth","separatorWidth","maxWidth","Math","max","minWidth","Steps","titles","rawTitle","number","variant","title","_jsx","navWidth","separatorValues","getColor","height","stepNavigation","simpleSeparatorHeight","stepValues","minSize","maxSize"],"mappings":";;;;AAmDO,MAAMA,qBAAqBA,CAAC;AAAA,EACjCC;AAAAA,EACAC,WAAW;AAAA,EACXC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACoB,MAAM;AACvB,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,SAAS;AAG3BC,QAAAA,UAAUC,SAASR,QAAQ;AACjC,QAAMS,gBAAgBC;AAGhBC,QAAAA,cAAcZ,WAAW,OAAOQ;AAChC,QAAA;AAAA,IAAEK;AAAAA,IAAOC;AAAAA,IAAYC;AAAAA,EAAAA,IAAmBZ,iBAAiBS,UAAU;AAGzE,QAAMI,WAAWC,KAAKC,IAAIJ,aAAaN,SAASO,cAAc;AAC9D,QAAMI,WAAWF,KAAKC,IAAIJ,aAAaN,UAAU,MAAMO,cAAc;AAGrE,QAAMK,QAAQhB;AAERiB,QAAAA,SAASnB,UAAU,CAAC;AAAA,IAAEoB;AAAAA,IAAUC;AAAAA,EAAAA,OAAc;AAAA,IAClDC,SAAS;AAAA,IACTC,OAAQ,GAAEF,WAAWD;AAAAA,IACrBR;AAAAA,EACA,EAAA;AAEF,8BACE,OAAA;AAAA,IAAA,GAAST;AAAAA,IAAMD,UACZiB,CAAAA,QACDK,oBAACN,OAAK;AAAA,MAEFR;AAAAA,MACAe,UAAUd;AAAAA,MACVe,iBAAiB;AAAA,QACfT;AAAAA,QACAH;AAAAA,QACAa;AAAAA,QACAC,SAAQxB,2CAAayB,eAAeC,0BAAyB;AAAA,MAC/D;AAAA,MACAC,YAAY;AAAA,QACVC,SAAS1B;AAAAA,QACT2B,SAAS,MAAM3B;AAAAA,QACfE;AAAAA,MACF;AAAA,IAAA,CAEH,CAAC;AAAA,EAAA,CACC;AAET;"}
@@ -1 +1 @@
1
- {"version":3,"file":"StepNavigation.js","sources":["../../../../src/components/StepNavigation/StepNavigation.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport {\n HvBaseProps,\n HvBreakpoints,\n useTheme,\n useWidth,\n HvBox,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvDefaultNavigation, HvStepProps } from \"./DefaultNavigation\";\nimport { HvSimpleNavigation } from \"./SimpleNavigation\";\nimport { styles } from \"./StepNavigation.styles\";\nimport stepNavigationClasses, {\n HvStepNavigationClasses,\n} from \"./stepNavigationClasses\";\nimport { SEPARATOR_WIDTH, TITLE_MARGIN, TITLE_WIDTH } from \"./utils\";\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,\n width,\n steps,\n stepSize,\n showTitles,\n type = \"Default\",\n ...others\n}: HvStepNavigationProps) => {\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 StyledLi = styled(\"li\")({\n height: separatorHeight,\n width:\n separatorWidth -\n 2 *\n Number(\n (activeTheme?.stepNavigation.separatorMargin || \"0px\").replace(\n \"px\",\n \"\"\n )\n ),\n backgroundColor,\n margin: `0 ${theme.stepNavigation.separatorMargin}`,\n });\n\n return (\n <ClassNames key={`separator-${title}`}>\n {({ css, cx }) => (\n <StyledLi\n aria-hidden\n className={cx(\n stepNavigationClasses.separator,\n css(styles.separator),\n classes?.separator\n )}\n >\n <div\n aria-label={`separator-${title}`}\n className={separatorClassName}\n />\n </StyledLi>\n )}\n </ClassNames>\n );\n };\n\n const drawItems = ({\n separatorValues: { minWidth, maxWidth, getColor, height },\n stepValues: { minSize, maxSize, StepComponent },\n }: any) => {\n const items = steps.reduce(\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 <ClassNames key={`step-${title}`}>\n {({ css, cx }) => (\n <StepContainer\n className={cx(\n stepNavigationClasses.li,\n css(styles.li),\n classes?.li\n )}\n >\n {hasTitles ? (\n <StepComponent\n key={`step-${title}`}\n aria-label={`step-${title}`}\n {...stepProps}\n />\n ) : (\n <HvTooltip\n placement=\"bottom\"\n title={\n <HvTypography>{`${index + 1}. ${title}`}</HvTypography>\n }\n >\n <div aria-label={`step-container-${title}`}>\n <Step\n className={cx(\n stepNavigationClasses.li,\n css(styles.li),\n classes?.li\n )}\n >\n <StepComponent\n aria-label={`step-${title}`}\n {...stepProps}\n />\n </Step>\n </div>\n </HvTooltip>\n )}\n </StepContainer>\n )}\n </ClassNames>\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 (\n <ClassNames>\n {({ css, cx }) => (\n <ol\n className={cx(\n stepNavigationClasses.ol,\n css(styles.ol),\n classes?.ol\n )}\n >\n {items}\n </ol>\n )}\n </ClassNames>\n );\n };\n\n const getDynamicValues = (stepsWidth) => {\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 styledTitle = (\n titleClassName,\n variant,\n title,\n titleWidth,\n titleDisabled\n ) => {\n const StyledTitle = styled(HvTypography)({\n textAlign: \"center\",\n width: titleWidth - TITLE_MARGIN,\n marginRight: TITLE_MARGIN,\n });\n\n return (\n <StyledTitle\n variant={variant}\n className={titleClassName}\n disabled={titleDisabled}\n key={`title-${title}`}\n >\n {title}\n </StyledTitle>\n );\n };\n\n const getTitles = (getTitleProps) =>\n hasTitles ? (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n stepNavigationClasses.titles,\n css(styles.titles),\n classes?.titles\n )}\n >\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 const Title = styledTitle(\n titleClassName,\n variant,\n title,\n titleWidth,\n titleDisabled\n );\n return Title;\n })}\n </div>\n )}\n </ClassNames>\n ) : null;\n\n const StepNavigation = {\n Default: HvDefaultNavigation,\n Simple: HvSimpleNavigation,\n }[type];\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <StepNavigation\n {...{\n numSteps: steps.length,\n stepSize: stepSizeKey,\n getTitles,\n getDynamicValues,\n className: cx(\n stepNavigationClasses.root,\n css(styles.root),\n className,\n classes?.root\n ),\n ...others,\n }}\n >\n {({ stepsWidth, navWidth, ...itemsProps }) => (\n <HvBox\n component=\"nav\"\n style={{\n width: `${navWidth}px`,\n margin: 0,\n }}\n >\n {drawItems(itemsProps)}\n </HvBox>\n )}\n </StepNavigation>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvStepNavigation","className","classes","width","steps","stepSize","showTitles","type","others","activeTheme","useTheme","breakpoint","useWidth","stepSizeKey","includes","hasTitles","styledLi","containerSize","_styled","process","env","NODE_ENV","target","label","height","styledDiv","styledSeparatorElement","title","separatorClassName","separatorHeight","separatorWidth","backgroundColor","StyledLi","Number","stepNavigation","separatorMargin","replace","margin","theme","ClassNames","children","css","cx","stepNavigationClasses","separator","styles","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","styledTitle","titleClassName","variant","titleDisabled","StyledTitle","textAlign","marginRight","disabled","getTitles","getTitleProps","titles","map","rawTitle","Title","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 { ClassNames } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport {\n HvBaseProps,\n HvBreakpoints,\n useTheme,\n useWidth,\n HvBox,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { HvDefaultNavigation, HvStepProps } from \"./DefaultNavigation\";\nimport { HvSimpleNavigation } from \"./SimpleNavigation\";\nimport { styles } from \"./StepNavigation.styles\";\nimport stepNavigationClasses, {\n HvStepNavigationClasses,\n} from \"./stepNavigationClasses\";\nimport { SEPARATOR_WIDTH, TITLE_MARGIN, TITLE_WIDTH } from \"./utils\";\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,\n width,\n steps,\n stepSize,\n showTitles,\n type = \"Default\",\n ...others\n}: HvStepNavigationProps) => {\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 StyledLi = styled(\"li\")({\n height: separatorHeight,\n width:\n separatorWidth -\n 2 *\n Number(\n (activeTheme?.stepNavigation.separatorMargin || \"0px\").replace(\n \"px\",\n \"\"\n )\n ),\n backgroundColor,\n margin: `0 ${theme.stepNavigation.separatorMargin}`,\n });\n\n return (\n <ClassNames key={`separator-${title}`}>\n {({ css, cx }) => (\n <StyledLi\n aria-hidden\n className={cx(\n stepNavigationClasses.separator,\n css(styles.separator),\n classes?.separator\n )}\n >\n <div\n aria-label={`separator-${title}`}\n className={separatorClassName}\n />\n </StyledLi>\n )}\n </ClassNames>\n );\n };\n\n const drawItems = ({\n separatorValues: { minWidth, maxWidth, getColor, height },\n stepValues: { minSize, maxSize, StepComponent },\n }: any) => {\n const items = steps.reduce(\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 <ClassNames key={`step-${title}`}>\n {({ css, cx }) => (\n <StepContainer\n className={cx(\n stepNavigationClasses.li,\n css(styles.li),\n classes?.li\n )}\n >\n {hasTitles ? (\n <StepComponent\n key={`step-${title}`}\n aria-label={`step-${title}`}\n {...stepProps}\n />\n ) : (\n <HvTooltip\n placement=\"bottom\"\n title={\n <HvTypography>{`${index + 1}. ${title}`}</HvTypography>\n }\n >\n <div aria-label={`step-container-${title}`}>\n <Step\n className={cx(\n stepNavigationClasses.li,\n css(styles.li),\n classes?.li\n )}\n >\n <StepComponent\n aria-label={`step-${title}`}\n {...stepProps}\n />\n </Step>\n </div>\n </HvTooltip>\n )}\n </StepContainer>\n )}\n </ClassNames>\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 (\n <ClassNames>\n {({ css, cx }) => (\n <ol\n className={cx(\n stepNavigationClasses.ol,\n css(styles.ol),\n classes?.ol\n )}\n >\n {items}\n </ol>\n )}\n </ClassNames>\n );\n };\n\n const getDynamicValues = (stepsWidth) => {\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 styledTitle = (\n titleClassName,\n variant,\n title,\n titleWidth,\n titleDisabled\n ) => {\n const StyledTitle = styled(HvTypography)({\n textAlign: \"center\",\n width: titleWidth - TITLE_MARGIN,\n marginRight: TITLE_MARGIN,\n });\n\n return (\n <StyledTitle\n variant={variant}\n className={titleClassName}\n disabled={titleDisabled}\n key={`title-${title}`}\n >\n {title}\n </StyledTitle>\n );\n };\n\n const getTitles = (getTitleProps) =>\n hasTitles ? (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n stepNavigationClasses.titles,\n css(styles.titles),\n classes?.titles\n )}\n >\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 const Title = styledTitle(\n titleClassName,\n variant,\n title,\n titleWidth,\n titleDisabled\n );\n return Title;\n })}\n </div>\n )}\n </ClassNames>\n ) : null;\n\n const StepNavigation = {\n Default: HvDefaultNavigation,\n Simple: HvSimpleNavigation,\n }[type];\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <StepNavigation\n {...{\n numSteps: steps.length,\n stepSize: stepSizeKey,\n getTitles,\n getDynamicValues,\n className: cx(\n stepNavigationClasses.root,\n css(styles.root),\n className,\n classes?.root\n ),\n ...others,\n }}\n >\n {({ stepsWidth, navWidth, ...itemsProps }) => (\n <HvBox\n component=\"nav\"\n style={{\n width: `${navWidth}px`,\n margin: 0,\n }}\n >\n {drawItems(itemsProps)}\n </HvBox>\n )}\n </StepNavigation>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvStepNavigation","className","classes","width","steps","stepSize","showTitles","type","others","activeTheme","useTheme","breakpoint","useWidth","stepSizeKey","includes","hasTitles","styledLi","containerSize","_styled","process","env","NODE_ENV","target","label","height","styledDiv","styledSeparatorElement","title","separatorClassName","separatorHeight","separatorWidth","backgroundColor","StyledLi","Number","stepNavigation","separatorMargin","replace","margin","theme","ClassNames","children","css","cx","stepNavigationClasses","separator","styles","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","styledTitle","titleClassName","variant","titleDisabled","StyledTitle","textAlign","marginRight","disabled","getTitles","getTitleProps","titles","map","rawTitle","Title","StepNavigation","Default","HvDefaultNavigation","Simple","HvSimpleNavigation","numSteps","root","itemsProps","HvBox","component","style"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Wizard.js","sources":["../../../../src/components/Wizard/Wizard.tsx"],"sourcesContent":["import { HvBaseProps, HvDialogProps } from \"@hitachivantara/uikit-react-core\";\nimport { ModalProps } from \"@mui/material\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { HvWizardClasses } from \"./wizardClasses\";\nimport {\n HvWizardContainer,\n HvWizardContent,\n HvWizardContext,\n HvWizardTitle,\n HvWizardTitleProps,\n HvWizardTabs,\n HvWizardActions,\n HvWizardActionsProps,\n} from \".\";\nimport { HvStepNavigationProps } from \"..\";\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 ...others\n}: HvWizardProps) => {\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 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","others","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","HvWizardTitle","HvWizardContent","HvWizardActions"],"mappings":";;;;;;;AA6CO,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,EACA,GAAGC;AACU,MAAM;AACnB,QAAM,CAACC,SAASC,UAAU,IAAIC,SAAuB,CAAE,CAAA;AACvD,QAAM,CAACN,SAASO,UAAU,IAAID,SAAS,KAAK;AAC5C,QAAM,CAACE,KAAKC,MAAM,IAAIH,SAAS,CAAC;AAEhC,QAAMI,cAAcC,YAClB,CAACC,KAAKC,WAAW;AACf,QAAIA,WAAW,iBAAiB;AAC9B3B,yCAAU0B,KAAKC;AAAAA,IACjB;AAAA,EAAA,GAEF,CAAC3B,OAAO,CAAC;AAIX4B,YAAU,MAAM;AACd,WAAO,MAAM;AACX,UAAI,CAACzB,MAAM;AACG0B,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,GACD;AAEHb,eAAO,CAAC;AAAA,MACV;AAAA,IAAA;AAAA,EACF,GACC,CAACpB,IAAI,CAAC;AAEHkC,QAAAA,QAAQC,QACZ,OAAO;AAAA,IAAEpB;AAAAA,IAASC;AAAAA,IAAYL;AAAAA,IAASO;AAAAA,IAAYC;AAAAA,IAAKC;AAAAA,EAAAA,IACxD,CAACL,SAASC,YAAYL,SAASO,YAAYC,KAAKC,MAAM,CAAC;AAIvDgB,SAAAA,oBAACC,gBAAgBC,UAAQ;AAAA,IAACJ;AAAAA,IAAatC,+BACpC2C,mBAAiB;AAAA,MAChB5C;AAAAA,MACA0B;AAAAA,MACArB;AAAAA,MAAW,GACPc;AAAAA,MAAMlB,UAAA,CAEVwC,oBAACI,eAAa;AAAA,QACZzC;AAAAA,QACAI;AAAAA,QACAE;AAAAA,QACAQ;AAAAA,MAAAA,CACA,GACFuB,oBAACK,iBAAe;AAAA,QACdvC;AAAAA,QACAU;AAAAA,QACAR;AAAAA,QAA+BR;AAAAA,MAAAA,CAGf,GAClBwC,oBAACM,iBAAe;AAAA,QACdxC;AAAAA,QACAD;AAAAA,QACAI;AAAAA,QACAgB;AAAAA,QACAvB;AAAAA,MAAAA,CACA,CAAA;AAAA,IAAA,CAAA;AAAA,EAAA,CAEqB;AAE/B;"}
1
+ {"version":3,"file":"Wizard.js","sources":["../../../../src/components/Wizard/Wizard.tsx"],"sourcesContent":["import { HvBaseProps, HvDialogProps } from \"@hitachivantara/uikit-react-core\";\nimport { ModalProps } from \"@mui/material\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { HvWizardClasses } from \"./wizardClasses\";\nimport {\n HvWizardContainer,\n HvWizardContent,\n HvWizardContext,\n HvWizardTitle,\n HvWizardTitleProps,\n HvWizardTabs,\n HvWizardActions,\n HvWizardActionsProps,\n} from \".\";\nimport { HvStepNavigationProps } from \"..\";\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 ...others\n}: HvWizardProps) => {\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 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","others","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","HvWizardTitle","HvWizardContent","HvWizardActions"],"mappings":";;;;;;;AA6CO,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,EACA,GAAGC;AACU,MAAM;AACnB,QAAM,CAACC,SAASC,UAAU,IAAIC,SAAuB,CAAE,CAAA;AACvD,QAAM,CAACN,SAASO,UAAU,IAAID,SAAS,KAAK;AAC5C,QAAM,CAACE,KAAKC,MAAM,IAAIH,SAAS,CAAC;AAEhC,QAAMI,cAAcC,YAClB,CAACC,KAAKC,WAAW;AACf,QAAIA,WAAW,iBAAiB;AAC9B3B,yCAAU0B,KAAKC;AAAAA,IACjB;AAAA,EAAA,GAEF,CAAC3B,OAAO,CACV;AAGA4B,YAAU,MAAM;AACd,WAAO,MAAM;AACX,UAAI,CAACzB,MAAM;AACG0B,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,CAACpB,IAAI,CAAC;AAEHkC,QAAAA,QAAQC,QACZ,OAAO;AAAA,IAAEpB;AAAAA,IAASC;AAAAA,IAAYL;AAAAA,IAASO;AAAAA,IAAYC;AAAAA,IAAKC;AAAAA,EAAAA,IACxD,CAACL,SAASC,YAAYL,SAASO,YAAYC,KAAKC,MAAM,CACxD;AAGEgB,SAAAA,oBAACC,gBAAgBC,UAAQ;AAAA,IAACJ;AAAAA,IAAatC,+BACpC2C,mBAAiB;AAAA,MAChB5C;AAAAA,MACA0B;AAAAA,MACArB;AAAAA,MAAW,GACPc;AAAAA,MAAMlB,UAAA,CAEVwC,oBAACI,eAAa;AAAA,QACZzC;AAAAA,QACAI;AAAAA,QACAE;AAAAA,QACAQ;AAAAA,MAAAA,CACD,GACDuB,oBAACK,iBAAe;AAAA,QACdvC;AAAAA,QACAU;AAAAA,QACAR;AAAAA,QAA+BR;AAAAA,MAAAA,CAGhB,GACjBwC,oBAACM,iBAAe;AAAA,QACdxC;AAAAA,QACAD;AAAAA,QACAI;AAAAA,QACAgB;AAAAA,QACAvB;AAAAA,MAAAA,CACD,CAAC;AAAA,IAAA,CACe;AAAA,EAAA,CACK;AAE9B;"}
@@ -1 +1 @@
1
- {"version":3,"file":"WizardActions.js","sources":["../../../../../src/components/Wizard/WizardActions/WizardActions.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useState } from \"react\";\nimport { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvButton,\n HvDialogActions,\n HvGrid,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Backwards, Forwards } from \"@hitachivantara/uikit-react-icons\";\nimport { styles } from \"./WizardActions.styles\";\nimport {\n HvWizardContext,\n HvWizardTabs,\n wizardActionsClasses,\n HvWizardActionsClasses,\n} from \"..\";\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,\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 { 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]);\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 <ClassNames>\n {({ css, cx }) => (\n <HvDialogActions\n className={cx(\n wizardActionsClasses.actionsContainer,\n css(styles.actionsContainer),\n classes?.actionsContainer\n )}\n >\n <HvGrid>\n <HvButton\n variant=\"secondaryGhost\"\n onClick={handleClose}\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n >\n {`${labels.cancel ?? \"Cancel\"}`}\n </HvButton>\n {skippable && (\n <HvButton\n variant=\"secondaryGhost\"\n disabled={isLastPage}\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n onClick={handleSkip}\n >\n {`${labels.skip ?? \"Skip\"}`}\n </HvButton>\n )}\n </HvGrid>\n <HvGrid\n className={cx(\n wizardActionsClasses.buttonsContainer,\n css(styles.buttonsContainer),\n classes?.buttonsContainer\n )}\n >\n <HvButton\n variant=\"secondaryGhost\"\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\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={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n disabled={loading || !canSubmit}\n onClick={handleSubmitInternal}\n >\n {`${labels.submit ?? \"Submit\"}`}\n </HvButton>\n ) : (\n <HvButton\n variant=\"secondaryGhost\"\n className={cx(\n wizardActionsClasses.buttonWidth,\n wizardActionsClasses.buttonSpacing,\n css(styles.buttonWidth),\n css(styles.buttonSpacing),\n classes?.buttonWidth,\n classes?.buttonSpacing\n )}\n onClick={() => setTab((t) => t + 1)}\n disabled={!skippable && !context?.[tab]?.valid}\n endIcon={<Forwards />}\n >\n {`${labels.next ?? \"Next\"}`}\n </HvButton>\n )}\n </HvGrid>\n </HvDialogActions>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvWizardActions","classes","handleClose","handleSubmit","loading","skippable","labels","cancel","next","previous","skip","submit","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","ClassNames","children","css","cx","HvDialogActions","className","wizardActionsClasses","actionsContainer","styles","_jsxs","HvGrid","_jsx","HvButton","variant","onClick","buttonWidth","disabled","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\";\nimport { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvButton,\n HvDialogActions,\n HvGrid,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Backwards, Forwards } from \"@hitachivantara/uikit-react-icons\";\nimport { styles } from \"./WizardActions.styles\";\nimport {\n HvWizardContext,\n HvWizardTabs,\n wizardActionsClasses,\n HvWizardActionsClasses,\n} from \"..\";\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,\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 { 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]);\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 <ClassNames>\n {({ css, cx }) => (\n <HvDialogActions\n className={cx(\n wizardActionsClasses.actionsContainer,\n css(styles.actionsContainer),\n classes?.actionsContainer\n )}\n >\n <HvGrid>\n <HvButton\n variant=\"secondaryGhost\"\n onClick={handleClose}\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n >\n {`${labels.cancel ?? \"Cancel\"}`}\n </HvButton>\n {skippable && (\n <HvButton\n variant=\"secondaryGhost\"\n disabled={isLastPage}\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n onClick={handleSkip}\n >\n {`${labels.skip ?? \"Skip\"}`}\n </HvButton>\n )}\n </HvGrid>\n <HvGrid\n className={cx(\n wizardActionsClasses.buttonsContainer,\n css(styles.buttonsContainer),\n classes?.buttonsContainer\n )}\n >\n <HvButton\n variant=\"secondaryGhost\"\n className={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\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={cx(\n wizardActionsClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n disabled={loading || !canSubmit}\n onClick={handleSubmitInternal}\n >\n {`${labels.submit ?? \"Submit\"}`}\n </HvButton>\n ) : (\n <HvButton\n variant=\"secondaryGhost\"\n className={cx(\n wizardActionsClasses.buttonWidth,\n wizardActionsClasses.buttonSpacing,\n css(styles.buttonWidth),\n css(styles.buttonSpacing),\n classes?.buttonWidth,\n classes?.buttonSpacing\n )}\n onClick={() => setTab((t) => t + 1)}\n disabled={!skippable && !context?.[tab]?.valid}\n endIcon={<Forwards />}\n >\n {`${labels.next ?? \"Next\"}`}\n </HvButton>\n )}\n </HvGrid>\n </HvDialogActions>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvWizardActions","classes","handleClose","handleSubmit","loading","skippable","labels","cancel","next","previous","skip","submit","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","ClassNames","children","css","cx","HvDialogActions","className","wizardActionsClasses","actionsContainer","styles","_jsxs","HvGrid","_jsx","HvButton","variant","onClick","buttonWidth","disabled","buttonsContainer","t","startIcon","Backwards","buttonSpacing","endIcon","Forwards"],"mappings":";;;;;;;;AA8CO,MAAMA,kBAAkBA,CAAC;AAAA,EAC9BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,UAAU;AAAA,EACVC,YAAY;AAAA,EACZC,SAAS;AAAA,IACPC,QAAQ;AAAA,IACRC,MAAM;AAAA,IACNC,UAAU;AAAA,IACVC,MAAM;AAAA,IACNC,QAAQ;AAAA,EACV;AACoB,MAAM;AACpB,QAAA;AAAA,IAAEC;AAAAA,IAASC;AAAAA,IAAYC;AAAAA,IAAKC;AAAAA,EAAAA,IAAWC,WAAWC,eAAe;AACvE,QAAM,CAACC,OAAOC,QAAQ,IAAIC,SAAS,CAAC;AACpC,QAAM,CAACC,WAAWC,YAAY,IAAIF,SAAS,KAAK;AAEhDG,YAAU,MAAM;AACRC,UAAAA,iBAAiBC,OAAOC,QAAQd,OAAO;AAC7C,QAAIY,eAAeG,QAAQ;AACzBR,eAASK,eAAeG,MAAM;AAE9B,YAAMC,cAAcH,OAAOC,QAAQd,OAAO,EAAEiB,MAC1C,CAAC,GAAGC,KAAK,MAAMA,+BAAOC,KACxB;AACA,UAAIH,gBAAgBP,WAAW;AAC7BC,qBAAaM,WAAW;AAAA,MAC1B;AAAA,IACF;AAAA,EAAA,GACC,CAAChB,OAAO,CAAC;AAEZ,QAAMoB,WAAWd,QAAQ;AACzB,QAAMe,aAAanB,OAAOkB;AAEpBE,QAAAA,aAAaC,YAAY,MAAM;AACvBC,eAAAA,CAAAA,MACVX,OAAOC,QAAQU,CAAC,EAAEC,OAChB,CAACC,KAAK,CAACC,KAAKC,KAAK,OAAO;AAAA,MACtB,GAAGF;AAAAA,MACH,CAAC,CAACC,GAAG,GAAG;AAAA,QACN,GAAGC;AAAAA,QACHT,QAAOS,+BAAOT,WAAU;AAAA,MAC1B;AAAA,IAAA,IAEF,CACF,CAAA,CACF;AACAhB,WAAOiB,QAAQ;AAAA,EACd,GAAA,CAACjB,QAAQiB,UAAUnB,UAAU,CAAC;AAE3B4B,QAAAA,uBAAuBN,YAC3B,MAAMhC,aAAaS,OAAO,GAC1B,CAACT,cAAcS,OAAO,CACxB;AAEA,6BACG8B,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA;;kCACNC,iBAAe;AAAA,QACdC,WAAWF,GACTG,qBAAqBC,kBACrBL,IAAIM,OAAOD,gBAAgB,GAC3BhD,mCAASgD,gBACX;AAAA,QAAEN,UAAA,CAEFQ,qBAACC,QAAM;AAAA,UAAAT,UAAA,CACLU,oBAACC,UAAQ;AAAA,YACPC,SAAQ;AAAA,YACRC,SAAStD;AAAAA,YACT6C,WAAWF,GACTG,qBAAqBS,aACrBb,IAAIM,OAAOO,WAAW,GACtBxD,mCAASwD,WACX;AAAA,YAAEd,UAEA,GAAErC,OAAOC,UAAU;AAAA,UAAA,CACb,GACTF,aACCgD,oBAACC,UAAQ;AAAA,YACPC,SAAQ;AAAA,YACRG,UAAUzB;AAAAA,YACVc,WAAWF,GACTG,qBAAqBS,aACrBb,IAAIM,OAAOO,WAAW,GACtBxD,mCAASwD,WACX;AAAA,YACAD,SAAStB;AAAAA,YAAWS,UAElB,GAAErC,OAAOI,QAAQ;AAAA,UAAA,CACX,CACX;AAAA,QAAA,CACK,GACRyC,qBAACC,QAAM;AAAA,UACLL,WAAWF,GACTG,qBAAqBW,kBACrBf,IAAIM,OAAOS,gBAAgB,GAC3B1D,mCAAS0D,gBACX;AAAA,UAAEhB,UAAA,CAEFU,oBAACC,UAAQ;AAAA,YACPC,SAAQ;AAAA,YACRR,WAAWF,GACTG,qBAAqBS,aACrBb,IAAIM,OAAOO,WAAW,GACtBxD,mCAASwD,WACX;AAAA,YACAC,UAAU5C,OAAO;AAAA,YACjB0C,SAASA,MAAMzC,OAAQ6C,CAAAA,MAAMA,IAAI,CAAC;AAAA,YAClCC,WAAWR,oBAACS,aAAW;AAAA,YAAEnB,UAEvB,GAAErC,OAAOG,YAAY;AAAA,UAAA,CACf,GACTwB,aACCoB,oBAACC,UAAQ;AAAA,YACPC,SAAQ;AAAA,YACRR,WAAWF,GACTG,qBAAqBS,aACrBb,IAAIM,OAAOO,WAAW,GACtBxD,mCAASwD,WACX;AAAA,YACAC,UAAUtD,WAAW,CAACiB;AAAAA,YACtBmC,SAASf;AAAAA,YAAqBE,UAE5B,GAAErC,OAAOK,UAAU;AAAA,UAAA,CACb,IAEV0C,oBAACC,UAAQ;AAAA,YACPC,SAAQ;AAAA,YACRR,WAAWF,GACTG,qBAAqBS,aACrBT,qBAAqBe,eACrBnB,IAAIM,OAAOO,WAAW,GACtBb,IAAIM,OAAOa,aAAa,GACxB9D,mCAASwD,aACTxD,mCAAS8D,aACX;AAAA,YACAP,SAASA,MAAMzC,OAAQ6C,CAAAA,MAAMA,IAAI,CAAC;AAAA,YAClCF,UAAU,CAACrD,aAAa,GAACO,wCAAUE,SAAVF,mBAAgBmB;AAAAA,YACzCiC,SAASX,oBAACY,YAAU;AAAA,YAAEtB,UAEpB,GAAErC,OAAOE,QAAQ;AAAA,UAAA,CACX,CACX;AAAA,QAAA,CACK,CAAC;AAAA,MAAA,CACM;AAAA;AAAA,EAAA,CAET;AAEhB;"}
@@ -1 +1 @@
1
- {"version":3,"file":"WizardContainer.js","sources":["../../../../../src/components/Wizard/WizardContainer/WizardContainer.tsx"],"sourcesContent":["import React from \"react\";\nimport { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvDialog,\n HvDialogProps,\n} from \"@hitachivantara/uikit-react-core\";\nimport wizardContainerClasses, {\n HvWizardContainerClasses,\n} from \"./wizardContainerClasses\";\nimport { styles } from \"./WizardContainer.styles\";\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,\n className,\n children,\n handleClose,\n open,\n ...others\n}: HvWizardContainerProps) => {\n return (\n <ClassNames>\n {({ css, cx }) => (\n <HvDialog\n classes={{\n closeButton: cx(\n wizardContainerClasses.closeButton,\n css(styles.closeButton),\n classes?.closeButton\n ),\n paper: cx(\n wizardContainerClasses.paper,\n css(styles.paper),\n classes?.paper\n ),\n }}\n className={cx(wizardContainerClasses.root, className, classes?.root)}\n open={open}\n onClose={handleClose}\n maxWidth=\"lg\"\n {...others}\n >\n {children}\n </HvDialog>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvWizardContainer","classes","className","children","handleClose","open","others","ClassNames","css","cx","HvDialog","closeButton","wizardContainerClasses","styles","paper","root","onClose","maxWidth"],"mappings":";;;;;AA0BO,MAAMA,oBAAoBA,CAAC;AAAA,EAChCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACmB,MAAM;AAC5B,6BACGC,YAAU;AAAA,IAAAJ,UACRA,CAAC;AAAA,MAAEK;AAAAA,MAAKC;AAAAA,IAAAA,0BACNC,UAAQ;AAAA,MACPT,SAAS;AAAA,QACPU,aAAaF,GACXG,uBAAuBD,aACvBH,IAAIK,OAAOF,WAAW,GACtBV,mCAASU,WAAW;AAAA,QAEtBG,OAAOL,GACLG,uBAAuBE,OACvBN,IAAIK,OAAOC,KAAK,GAChBb,mCAASa,KAAK;AAAA,MAElB;AAAA,MACAZ,WAAWO,GAAGG,uBAAuBG,MAAMb,WAAWD,mCAASc,IAAI;AAAA,MACnEV;AAAAA,MACAW,SAASZ;AAAAA,MACTa,UAAS;AAAA,MAAI,GACTX;AAAAA,MAAMH;AAAAA,IAAAA,CAED;AAAA,EAAA,CAGF;AAEjB;"}
1
+ {"version":3,"file":"WizardContainer.js","sources":["../../../../../src/components/Wizard/WizardContainer/WizardContainer.tsx"],"sourcesContent":["import React from \"react\";\nimport { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvDialog,\n HvDialogProps,\n} from \"@hitachivantara/uikit-react-core\";\nimport wizardContainerClasses, {\n HvWizardContainerClasses,\n} from \"./wizardContainerClasses\";\nimport { styles } from \"./WizardContainer.styles\";\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,\n className,\n children,\n handleClose,\n open,\n ...others\n}: HvWizardContainerProps) => {\n return (\n <ClassNames>\n {({ css, cx }) => (\n <HvDialog\n classes={{\n closeButton: cx(\n wizardContainerClasses.closeButton,\n css(styles.closeButton),\n classes?.closeButton\n ),\n paper: cx(\n wizardContainerClasses.paper,\n css(styles.paper),\n classes?.paper\n ),\n }}\n className={cx(wizardContainerClasses.root, className, classes?.root)}\n open={open}\n onClose={handleClose}\n maxWidth=\"lg\"\n {...others}\n >\n {children}\n </HvDialog>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvWizardContainer","classes","className","children","handleClose","open","others","ClassNames","css","cx","HvDialog","closeButton","wizardContainerClasses","styles","paper","root","onClose","maxWidth"],"mappings":";;;;;AA0BO,MAAMA,oBAAoBA,CAAC;AAAA,EAChCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACmB,MAAM;AAC5B,6BACGC,YAAU;AAAA,IAAAJ,UACRA,CAAC;AAAA,MAAEK;AAAAA,MAAKC;AAAAA,IAAAA,0BACNC,UAAQ;AAAA,MACPT,SAAS;AAAA,QACPU,aAAaF,GACXG,uBAAuBD,aACvBH,IAAIK,OAAOF,WAAW,GACtBV,mCAASU,WACX;AAAA,QACAG,OAAOL,GACLG,uBAAuBE,OACvBN,IAAIK,OAAOC,KAAK,GAChBb,mCAASa,KACX;AAAA,MACF;AAAA,MACAZ,WAAWO,GAAGG,uBAAuBG,MAAMb,WAAWD,mCAASc,IAAI;AAAA,MACnEV;AAAAA,MACAW,SAASZ;AAAAA,MACTa,UAAS;AAAA,MAAI,GACTX;AAAAA,MAAMH;AAAAA,IAAAA,CAGF;AAAA,EAAA,CAEF;AAEhB;"}
@@ -1 +1 @@
1
- {"version":3,"file":"LoadingContainer.js","sources":["../../../../../src/components/Wizard/WizardContent/LoadingContainer.tsx"],"sourcesContent":["import { HvLoading, HvLoadingProps } from \"@hitachivantara/uikit-react-core\";\nimport { ClassNames } from \"@emotion/react\";\nimport { styles } from \"./LoadingContainer.styles\";\nimport wizardLoadingContainerClasses, {\n HvWizardLoadingContainerClasses,\n} from \"./loadingContainerClasses\";\n\ninterface LoadingContainerProps extends Omit<HvLoadingProps, \"classes\"> {\n classes?: HvWizardLoadingContainerClasses;\n}\n\nexport const LoadingContainer = ({\n children,\n hidden,\n classes,\n ...others\n}: LoadingContainerProps) => {\n return (\n <ClassNames>\n {({ css, cx }) => (\n <>\n <div\n style={{\n top: 0,\n left: 0,\n height: \"100%\",\n width: \"100%\",\n }}\n className={cx(\n wizardLoadingContainerClasses.overlay,\n !hidden && wizardLoadingContainerClasses.blur,\n css(styles.overlay),\n !hidden && css(styles.blur),\n classes?.overlay,\n !hidden && classes?.blur\n )}\n >\n <HvLoading\n classes={{\n root: cx(\n wizardLoadingContainerClasses.loading,\n css(styles.loading),\n classes?.loading\n ),\n }}\n hidden={hidden}\n {...others}\n />\n </div>\n <div style={{ display: \"flow-root\" }}>{children}</div>\n </>\n )}\n </ClassNames>\n );\n};\n"],"names":["LoadingContainer","children","hidden","classes","others","ClassNames","css","cx","_Fragment","_jsx","style","top","left","height","width","className","wizardLoadingContainerClasses","overlay","blur","styles","HvLoading","root","loading","display"],"mappings":";;;;;AAWO,MAAMA,mBAAmBA,CAAC;AAAA,EAC/BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACkB,MAAM;AAC3B,6BACGC,YAAU;AAAA,IAAAJ,UACRA,CAAC;AAAA,MAAEK;AAAAA,MAAKC;AAAAA,IAAAA,2BACPC,UAAA;AAAA,MAAAP,WACEQ,oBAAA,OAAA;AAAA,QACEC,OAAO;AAAA,UACLC,KAAK;AAAA,UACLC,MAAM;AAAA,UACNC,QAAQ;AAAA,UACRC,OAAO;AAAA,QACT;AAAA,QACAC,WAAWR,GACTS,8BAA8BC,SAC9B,CAACf,UAAUc,8BAA8BE,MACzCZ,IAAIa,OAAOF,OAAO,GAClB,CAACf,UAAUI,IAAIa,OAAOD,IAAI,GAC1Bf,mCAASc,SACT,CAACf,WAAUC,mCAASe,KAAI;AAAA,QACxBjB,8BAEDmB,WAAS;AAAA,UACRjB,SAAS;AAAA,YACPkB,MAAMd,GACJS,8BAA8BM,SAC9BhB,IAAIa,OAAOG,OAAO,GAClBnB,mCAASmB,OAAO;AAAA,UAEpB;AAAA,UACApB;AAAAA,UAAe,GACXE;AAAAA,QAAAA,CAAM;AAAA,MAAA,CACV,GAEJK,oBAAA,OAAA;AAAA,QAAKC,OAAO;AAAA,UAAEa,SAAS;AAAA,QAAY;AAAA,QAAEtB;AAAAA,MAAAA,CAAiB,CAAA;AAAA,IAAA,CAAA;AAAA,EAAA,CAG/C;AAEjB;"}
1
+ {"version":3,"file":"LoadingContainer.js","sources":["../../../../../src/components/Wizard/WizardContent/LoadingContainer.tsx"],"sourcesContent":["import { HvLoading, HvLoadingProps } from \"@hitachivantara/uikit-react-core\";\nimport { ClassNames } from \"@emotion/react\";\nimport { styles } from \"./LoadingContainer.styles\";\nimport wizardLoadingContainerClasses, {\n HvWizardLoadingContainerClasses,\n} from \"./loadingContainerClasses\";\n\ninterface LoadingContainerProps extends Omit<HvLoadingProps, \"classes\"> {\n classes?: HvWizardLoadingContainerClasses;\n}\n\nexport const LoadingContainer = ({\n children,\n hidden,\n classes,\n ...others\n}: LoadingContainerProps) => {\n return (\n <ClassNames>\n {({ css, cx }) => (\n <>\n <div\n style={{\n top: 0,\n left: 0,\n height: \"100%\",\n width: \"100%\",\n }}\n className={cx(\n wizardLoadingContainerClasses.overlay,\n !hidden && wizardLoadingContainerClasses.blur,\n css(styles.overlay),\n !hidden && css(styles.blur),\n classes?.overlay,\n !hidden && classes?.blur\n )}\n >\n <HvLoading\n classes={{\n root: cx(\n wizardLoadingContainerClasses.loading,\n css(styles.loading),\n classes?.loading\n ),\n }}\n hidden={hidden}\n {...others}\n />\n </div>\n <div style={{ display: \"flow-root\" }}>{children}</div>\n </>\n )}\n </ClassNames>\n );\n};\n"],"names":["LoadingContainer","children","hidden","classes","others","ClassNames","css","cx","_Fragment","_jsx","style","top","left","height","width","className","wizardLoadingContainerClasses","overlay","blur","styles","HvLoading","root","loading","display"],"mappings":";;;;;AAWO,MAAMA,mBAAmBA,CAAC;AAAA,EAC/BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACkB,MAAM;AAC3B,6BACGC,YAAU;AAAA,IAAAJ,UACRA,CAAC;AAAA,MAAEK;AAAAA,MAAKC;AAAAA,IAAAA,2BACPC,UAAA;AAAA,MAAAP,WACEQ,oBAAA,OAAA;AAAA,QACEC,OAAO;AAAA,UACLC,KAAK;AAAA,UACLC,MAAM;AAAA,UACNC,QAAQ;AAAA,UACRC,OAAO;AAAA,QACT;AAAA,QACAC,WAAWR,GACTS,8BAA8BC,SAC9B,CAACf,UAAUc,8BAA8BE,MACzCZ,IAAIa,OAAOF,OAAO,GAClB,CAACf,UAAUI,IAAIa,OAAOD,IAAI,GAC1Bf,mCAASc,SACT,CAACf,WAAUC,mCAASe,KACtB;AAAA,QAAEjB,8BAEDmB,WAAS;AAAA,UACRjB,SAAS;AAAA,YACPkB,MAAMd,GACJS,8BAA8BM,SAC9BhB,IAAIa,OAAOG,OAAO,GAClBnB,mCAASmB,OACX;AAAA,UACF;AAAA,UACApB;AAAAA,UAAe,GACXE;AAAAA,QAAAA,CACL;AAAA,MAAA,CACE,GACLK,oBAAA,OAAA;AAAA,QAAKC,OAAO;AAAA,UAAEa,SAAS;AAAA,QAAY;AAAA,QAAEtB;AAAAA,MAAAA,CAAgB,CAAC;AAAA,IAAA,CACtD;AAAA,EAAA,CAEM;AAEhB;"}
@@ -1 +1 @@
1
- {"version":3,"file":"WizardContent.js","sources":["../../../../../src/components/Wizard/WizardContent/WizardContent.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport { HvBaseProps, HvDialogContent } from \"@hitachivantara/uikit-react-core\";\nimport { useElementSize } from \"usehooks-ts\";\nimport React, {\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n HvWizardContext,\n HvWizardTabs,\n wizardContentClasses,\n HvWizardContentClasses,\n} from \"..\";\nimport { styles } from \"./WizardContent.styles\";\nimport { LoadingContainer } from \"./LoadingContainer\";\n\nexport interface HvWizardContentProps extends HvBaseProps {\n /** Forces minimum height to the component. */\n fixedHeight?: boolean;\n /** Whether the loading animation is shown. */\n loading?: boolean;\n /** The content of the summary. */\n summaryContent?: React.ReactNode;\n /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n classes?: HvWizardContentClasses;\n}\n\ntype ChildElement = React.ReactElement<HvWizardTabs>;\n\nconst DRAWER_PERCENTAGE = 0.3;\nconst DRAWER_MIN_WIDTH = 280;\n\nexport const HvWizardContent = ({\n classes,\n fixedHeight = false,\n loading = false,\n children,\n summaryContent,\n}: HvWizardContentProps) => {\n const { context, setContext, summary, tab } = useContext(HvWizardContext);\n\n const arrayChildren = React.Children.toArray(children) as ChildElement[];\n\n const initialContext = arrayChildren.reduce(\n (acc, child: ChildElement, index) => {\n const invalid =\n \"mustValidate\" in child.props && child.props.mustValidate === true\n ? false\n : null;\n const valid = invalid ?? (index === 0 || null);\n return {\n ...acc,\n [index]: { ...child.props, form: {}, valid, touched: index === 0 },\n };\n },\n {}\n );\n\n const summaryRef = useRef<HTMLElement>();\n const resizedRef = useRef({ height: 0, width: 0 });\n const [containerRef, sizes] = useElementSize();\n\n const [summaryHeight, setSummaryHeight] = useState(0);\n const [summaryWidth, setSummaryWidth] = useState(0);\n const [summaryLeft, setSummaryLeft] = useState(0);\n\n const updateSummaryMeasures = useCallback((newSizes) => {\n const modalWidth = newSizes.width;\n const drawerWidth = modalWidth * DRAWER_PERCENTAGE;\n setSummaryHeight(newSizes.height);\n setSummaryWidth(Math.max(drawerWidth, DRAWER_MIN_WIDTH));\n setSummaryLeft(modalWidth - Math.max(drawerWidth, DRAWER_MIN_WIDTH));\n\n resizedRef.current = {\n height: newSizes.height,\n width: newSizes.width,\n };\n }, []);\n\n useEffect(() => {\n const pageHeight = summaryRef.current?.getBoundingClientRect?.()?.height;\n if (\n (summary && sizes.height !== resizedRef.current.height) ||\n sizes.width !== resizedRef.current.width\n ) {\n updateSummaryMeasures(sizes);\n }\n\n if (pageHeight && sizes.height !== pageHeight) {\n updateSummaryMeasures({\n width: sizes.width,\n height: pageHeight,\n });\n }\n }, [tab, sizes, summary, updateSummaryMeasures]);\n\n useEffect(() => {\n setContext(initialContext);\n }, []);\n\n useEffect(() => {\n if (tab && !context[tab]?.touched) {\n const updatedContext = Object.entries(context).reduce(\n (acc, [key, childState]) => ({\n ...acc,\n ...(+key <= tab\n ? {\n [key]: {\n ...childState,\n touched: true,\n valid: childState?.valid ?? true,\n },\n }\n : { [key]: childState }),\n }),\n {}\n );\n\n setContext(updatedContext);\n }\n }, [tab]);\n\n const translateX = summaryWidth ? summaryWidth + 10 : 450;\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n wizardContentClasses.summaryRef,\n css(styles.summaryRef),\n classes?.summaryRef\n )}\n ref={(el) => {\n containerRef(el);\n if (el) {\n summaryRef.current = el;\n }\n }}\n >\n {summary !== null && (\n <div\n className={cx(\n wizardContentClasses.summarySticky,\n css(styles.summarySticky),\n classes?.summarySticky\n )}\n >\n <div\n className={cx(\n wizardContentClasses.summaryContainer,\n css(styles.summaryContainer),\n classes?.summaryContainer\n )}\n style={{\n left: summaryLeft,\n width: summaryWidth,\n height: summaryHeight,\n transform: `translate(${summary ? 0 : translateX}px, 0)`,\n }}\n >\n {summaryContent}\n </div>\n </div>\n )}\n <HvDialogContent\n className={cx(\n wizardContentClasses.contentContainer,\n fixedHeight && wizardContentClasses.fixedHeight,\n css(styles.contentContainer),\n fixedHeight && css(styles.fixedHeight),\n classes?.contentContainer,\n fixedHeight && classes?.fixedHeight\n )}\n indentContent\n >\n <LoadingContainer hidden={!loading}>\n {React.Children.map(arrayChildren, (child, index) => {\n if (index === tab) {\n return React.cloneElement(child as React.ReactElement, {\n tab,\n });\n }\n return null;\n })}\n </LoadingContainer>\n </HvDialogContent>\n </div>\n )}\n </ClassNames>\n );\n};\n"],"names":["DRAWER_PERCENTAGE","DRAWER_MIN_WIDTH","HvWizardContent","classes","fixedHeight","loading","children","summaryContent","context","setContext","summary","tab","useContext","HvWizardContext","arrayChildren","React","Children","toArray","initialContext","reduce","acc","child","index","invalid","props","mustValidate","valid","form","touched","summaryRef","useRef","resizedRef","height","width","containerRef","sizes","useElementSize","summaryHeight","setSummaryHeight","useState","summaryWidth","setSummaryWidth","summaryLeft","setSummaryLeft","updateSummaryMeasures","useCallback","newSizes","modalWidth","drawerWidth","Math","max","current","useEffect","pageHeight","getBoundingClientRect","updatedContext","Object","entries","key","childState","translateX","ClassNames","css","cx","className","wizardContentClasses","styles","ref","el","summarySticky","summaryContainer","style","left","transform","_jsx","HvDialogContent","contentContainer","indentContent","LoadingContainer","hidden","map","cloneElement"],"mappings":"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"}
1
+ {"version":3,"file":"WizardContent.js","sources":["../../../../../src/components/Wizard/WizardContent/WizardContent.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport { HvBaseProps, HvDialogContent } from \"@hitachivantara/uikit-react-core\";\nimport { useElementSize } from \"usehooks-ts\";\nimport React, {\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n HvWizardContext,\n HvWizardTabs,\n wizardContentClasses,\n HvWizardContentClasses,\n} from \"..\";\nimport { styles } from \"./WizardContent.styles\";\nimport { LoadingContainer } from \"./LoadingContainer\";\n\nexport interface HvWizardContentProps extends HvBaseProps {\n /** Forces minimum height to the component. */\n fixedHeight?: boolean;\n /** Whether the loading animation is shown. */\n loading?: boolean;\n /** The content of the summary. */\n summaryContent?: React.ReactNode;\n /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n classes?: HvWizardContentClasses;\n}\n\ntype ChildElement = React.ReactElement<HvWizardTabs>;\n\nconst DRAWER_PERCENTAGE = 0.3;\nconst DRAWER_MIN_WIDTH = 280;\n\nexport const HvWizardContent = ({\n classes,\n fixedHeight = false,\n loading = false,\n children,\n summaryContent,\n}: HvWizardContentProps) => {\n const { context, setContext, summary, tab } = useContext(HvWizardContext);\n\n const arrayChildren = React.Children.toArray(children) as ChildElement[];\n\n const initialContext = arrayChildren.reduce(\n (acc, child: ChildElement, index) => {\n const invalid =\n \"mustValidate\" in child.props && child.props.mustValidate === true\n ? false\n : null;\n const valid = invalid ?? (index === 0 || null);\n return {\n ...acc,\n [index]: { ...child.props, form: {}, valid, touched: index === 0 },\n };\n },\n {}\n );\n\n const summaryRef = useRef<HTMLElement>();\n const resizedRef = useRef({ height: 0, width: 0 });\n const [containerRef, sizes] = useElementSize();\n\n const [summaryHeight, setSummaryHeight] = useState(0);\n const [summaryWidth, setSummaryWidth] = useState(0);\n const [summaryLeft, setSummaryLeft] = useState(0);\n\n const updateSummaryMeasures = useCallback((newSizes) => {\n const modalWidth = newSizes.width;\n const drawerWidth = modalWidth * DRAWER_PERCENTAGE;\n setSummaryHeight(newSizes.height);\n setSummaryWidth(Math.max(drawerWidth, DRAWER_MIN_WIDTH));\n setSummaryLeft(modalWidth - Math.max(drawerWidth, DRAWER_MIN_WIDTH));\n\n resizedRef.current = {\n height: newSizes.height,\n width: newSizes.width,\n };\n }, []);\n\n useEffect(() => {\n const pageHeight = summaryRef.current?.getBoundingClientRect?.()?.height;\n if (\n (summary && sizes.height !== resizedRef.current.height) ||\n sizes.width !== resizedRef.current.width\n ) {\n updateSummaryMeasures(sizes);\n }\n\n if (pageHeight && sizes.height !== pageHeight) {\n updateSummaryMeasures({\n width: sizes.width,\n height: pageHeight,\n });\n }\n }, [tab, sizes, summary, updateSummaryMeasures]);\n\n useEffect(() => {\n setContext(initialContext);\n }, []);\n\n useEffect(() => {\n if (tab && !context[tab]?.touched) {\n const updatedContext = Object.entries(context).reduce(\n (acc, [key, childState]) => ({\n ...acc,\n ...(+key <= tab\n ? {\n [key]: {\n ...childState,\n touched: true,\n valid: childState?.valid ?? true,\n },\n }\n : { [key]: childState }),\n }),\n {}\n );\n\n setContext(updatedContext);\n }\n }, [tab]);\n\n const translateX = summaryWidth ? summaryWidth + 10 : 450;\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <div\n className={cx(\n wizardContentClasses.summaryRef,\n css(styles.summaryRef),\n classes?.summaryRef\n )}\n ref={(el) => {\n containerRef(el);\n if (el) {\n summaryRef.current = el;\n }\n }}\n >\n {summary !== null && (\n <div\n className={cx(\n wizardContentClasses.summarySticky,\n css(styles.summarySticky),\n classes?.summarySticky\n )}\n >\n <div\n className={cx(\n wizardContentClasses.summaryContainer,\n css(styles.summaryContainer),\n classes?.summaryContainer\n )}\n style={{\n left: summaryLeft,\n width: summaryWidth,\n height: summaryHeight,\n transform: `translate(${summary ? 0 : translateX}px, 0)`,\n }}\n >\n {summaryContent}\n </div>\n </div>\n )}\n <HvDialogContent\n className={cx(\n wizardContentClasses.contentContainer,\n fixedHeight && wizardContentClasses.fixedHeight,\n css(styles.contentContainer),\n fixedHeight && css(styles.fixedHeight),\n classes?.contentContainer,\n fixedHeight && classes?.fixedHeight\n )}\n indentContent\n >\n <LoadingContainer hidden={!loading}>\n {React.Children.map(arrayChildren, (child, index) => {\n if (index === tab) {\n return React.cloneElement(child as React.ReactElement, {\n tab,\n });\n }\n return null;\n })}\n </LoadingContainer>\n </HvDialogContent>\n </div>\n )}\n </ClassNames>\n );\n};\n"],"names":["DRAWER_PERCENTAGE","DRAWER_MIN_WIDTH","HvWizardContent","classes","fixedHeight","loading","children","summaryContent","context","setContext","summary","tab","useContext","HvWizardContext","arrayChildren","React","Children","toArray","initialContext","reduce","acc","child","index","invalid","props","mustValidate","valid","form","touched","summaryRef","useRef","resizedRef","height","width","containerRef","sizes","useElementSize","summaryHeight","setSummaryHeight","useState","summaryWidth","setSummaryWidth","summaryLeft","setSummaryLeft","updateSummaryMeasures","useCallback","newSizes","modalWidth","drawerWidth","Math","max","current","useEffect","pageHeight","getBoundingClientRect","updatedContext","Object","entries","key","childState","translateX","ClassNames","css","cx","className","wizardContentClasses","styles","ref","el","summarySticky","summaryContainer","style","left","transform","_jsx","HvDialogContent","contentContainer","indentContent","LoadingContainer","hidden","map","cloneElement"],"mappings":";;;;;;;;;AAgCA,MAAMA,oBAAoB;AAC1B,MAAMC,mBAAmB;AAElB,MAAMC,kBAAkBA,CAAC;AAAA,EAC9BC;AAAAA,EACAC,cAAc;AAAA,EACdC,UAAU;AAAA,EACVC;AAAAA,EACAC;AACoB,MAAM;AACpB,QAAA;AAAA,IAAEC;AAAAA,IAASC;AAAAA,IAAYC;AAAAA,IAASC;AAAAA,EAAAA,IAAQC,WAAWC,eAAe;AAExE,QAAMC,gBAAgBC,MAAMC,SAASC,QAAQX,QAAQ;AAErD,QAAMY,iBAAiBJ,cAAcK,OACnC,CAACC,KAAKC,OAAqBC,UAAU;AAC7BC,UAAAA,UACJ,kBAAkBF,MAAMG,SAASH,MAAMG,MAAMC,iBAAiB,OAC1D,QACA;AACAC,UAAAA,QAAQH,YAAYD,UAAU,KAAK;AAClC,WAAA;AAAA,MACL,GAAGF;AAAAA,MACH,CAACE,KAAK,GAAG;AAAA,QAAE,GAAGD,MAAMG;AAAAA,QAAOG,MAAM,CAAC;AAAA,QAAGD;AAAAA,QAAOE,SAASN,UAAU;AAAA,MAAE;AAAA,IAAA;AAAA,EAErE,GACA,CACF,CAAA;AAEA,QAAMO,aAAaC;AACnB,QAAMC,aAAaD,OAAO;AAAA,IAAEE,QAAQ;AAAA,IAAGC,OAAO;AAAA,EAAA,CAAG;AACjD,QAAM,CAACC,cAAcC,KAAK,IAAIC,eAAe;AAE7C,QAAM,CAACC,eAAeC,gBAAgB,IAAIC,SAAS,CAAC;AACpD,QAAM,CAACC,cAAcC,eAAe,IAAIF,SAAS,CAAC;AAClD,QAAM,CAACG,aAAaC,cAAc,IAAIJ,SAAS,CAAC;AAE1CK,QAAAA,wBAAwBC,YAAaC,CAAa,aAAA;AACtD,UAAMC,aAAaD,SAASb;AAC5B,UAAMe,cAAcD,aAAa/C;AACjCsC,qBAAiBQ,SAASd,MAAM;AAChCS,oBAAgBQ,KAAKC,IAAIF,aAAa/C,gBAAgB,CAAC;AACvD0C,mBAAeI,aAAaE,KAAKC,IAAIF,aAAa/C,gBAAgB,CAAC;AAEnE8B,eAAWoB,UAAU;AAAA,MACnBnB,QAAQc,SAASd;AAAAA,MACjBC,OAAOa,SAASb;AAAAA,IAAAA;AAAAA,EAEpB,GAAG,CAAE,CAAA;AAELmB,YAAU,MAAM;;AACd,UAAMC,cAAaxB,4BAAWsB,YAAXtB,mBAAoByB,0BAApBzB,mDAA+CG;AAE/DtB,QAAAA,WAAWyB,MAAMH,WAAWD,WAAWoB,QAAQnB,UAChDG,MAAMF,UAAUF,WAAWoB,QAAQlB,OACnC;AACAW,4BAAsBT,KAAK;AAAA,IAC7B;AAEIkB,QAAAA,cAAclB,MAAMH,WAAWqB,YAAY;AACvB,4BAAA;AAAA,QACpBpB,OAAOE,MAAMF;AAAAA,QACbD,QAAQqB;AAAAA,MAAAA,CACT;AAAA,IACH;AAAA,KACC,CAAC1C,KAAKwB,OAAOzB,SAASkC,qBAAqB,CAAC;AAE/CQ,YAAU,MAAM;AACd3C,eAAWS,cAAc;AAAA,EAC3B,GAAG,CAAE,CAAA;AAELkC,YAAU,MAAM;;AACd,QAAIzC,OAAO,GAACH,aAAQG,GAAG,MAAXH,mBAAcoB,UAAS;AAC3B2B,YAAAA,iBAAiBC,OAAOC,QAAQjD,OAAO,EAAEW,OAC7C,CAACC,KAAK,CAACsC,KAAKC,UAAU,OAAO;AAAA,QAC3B,GAAGvC;AAAAA,QACH,GAAI,CAACsC,OAAO/C,MACR;AAAA,UACE,CAAC+C,GAAG,GAAG;AAAA,YACL,GAAGC;AAAAA,YACH/B,SAAS;AAAA,YACTF,QAAOiC,yCAAYjC,UAAS;AAAA,UAC9B;AAAA,QAAA,IAEF;AAAA,UAAE,CAACgC,GAAG,GAAGC;AAAAA,QAAW;AAAA,MAAA,IAE1B,CACF,CAAA;AAEAlD,iBAAW8C,cAAc;AAAA,IAC3B;AAAA,EAAA,GACC,CAAC5C,GAAG,CAAC;AAEFiD,QAAAA,aAAapB,eAAeA,eAAe,KAAK;AAEtD,6BACGqB,YAAU;AAAA,IAAAvD,UACRA,CAAC;AAAA,MAAEwD;AAAAA,MAAKC;AAAAA,IAAAA,2BACP,OAAA;AAAA,MACEC,WAAWD,GACTE,qBAAqBpC,YACrBiC,IAAII,OAAOrC,UAAU,GACrB1B,mCAAS0B,UACX;AAAA,MACAsC,KAAMC,CAAO,OAAA;AACXlC,qBAAakC,EAAE;AACf,YAAIA,IAAI;AACNvC,qBAAWsB,UAAUiB;AAAAA,QACvB;AAAA,MACF;AAAA,MAAE9D,UAEDI,CAAAA,YAAY,4BACX,OAAA;AAAA,QACEsD,WAAWD,GACTE,qBAAqBI,eACrBP,IAAII,OAAOG,aAAa,GACxBlE,mCAASkE,aACX;AAAA,QAAE/D,8BAEF,OAAA;AAAA,UACE0D,WAAWD,GACTE,qBAAqBK,kBACrBR,IAAII,OAAOI,gBAAgB,GAC3BnE,mCAASmE,gBACX;AAAA,UACAC,OAAO;AAAA,YACLC,MAAM9B;AAAAA,YACNT,OAAOO;AAAAA,YACPR,QAAQK;AAAAA,YACRoC,WAAY,aAAY/D,UAAU,IAAIkD;AAAAA,UACxC;AAAA,UAAEtD,UAEDC;AAAAA,QAAAA,CACE;AAAA,MAAA,CACF,GAEPmE,oBAACC,iBAAe;AAAA,QACdX,WAAWD,GACTE,qBAAqBW,kBACrBxE,eAAe6D,qBAAqB7D,aACpC0D,IAAII,OAAOU,gBAAgB,GAC3BxE,eAAe0D,IAAII,OAAO9D,WAAW,GACrCD,mCAASyE,kBACTxE,gBAAeD,mCAASC,YAC1B;AAAA,QACAyE,eAAa;AAAA,QAAAvE,8BAEZwE,kBAAgB;AAAA,UAACC,QAAQ,CAAC1E;AAAAA,UAAQC,UAChCS,MAAMC,SAASgE,IAAIlE,eAAe,CAACO,OAAOC,UAAU;AACnD,gBAAIA,UAAUX,KAAK;AACVI,qBAAAA,MAAMkE,aAAa5D,OAA6B;AAAA,gBACrDV;AAAAA,cAAAA,CACD;AAAA,YACH;AACO,mBAAA;AAAA,UAAA,CACR;AAAA,QAAA,CACe;AAAA,MAAA,CACH,CAAC;AAAA,IAAA,CACf;AAAA,EAAA,CAEG;AAEhB;"}
@@ -1 +1 @@
1
- {"version":3,"file":"loadingContainerClasses.js","sources":["../../../../../src/components/Wizard/WizardContent/loadingContainerClasses.ts"],"sourcesContent":["import { getClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport type HvWizardLoadingContainerClasses = {\n loading?: string;\n overlay?: string;\n blur?: string;\n};\n\nconst classKeys: (keyof HvWizardLoadingContainerClasses)[] = [\n \"blur\",\n \"loading\",\n \"overlay\",\n];\n\nconst wizardLoadingContainerClasses = getClasses(\n classKeys,\n \"HvWizard-LoadingContainer\"\n);\n\nexport default wizardLoadingContainerClasses;\n"],"names":["classKeys","wizardLoadingContainerClasses","getClasses"],"mappings":";AAQA,MAAMA,YAAuD,CAC3D,QACA,WACA,SAAS;AAGX,MAAMC,gCAAgCC,WACpCF,WACA,2BAA2B;AAG7B,MAAA,kCAAeC;"}
1
+ {"version":3,"file":"loadingContainerClasses.js","sources":["../../../../../src/components/Wizard/WizardContent/loadingContainerClasses.ts"],"sourcesContent":["import { getClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport type HvWizardLoadingContainerClasses = {\n loading?: string;\n overlay?: string;\n blur?: string;\n};\n\nconst classKeys: (keyof HvWizardLoadingContainerClasses)[] = [\n \"blur\",\n \"loading\",\n \"overlay\",\n];\n\nconst wizardLoadingContainerClasses = getClasses(\n classKeys,\n \"HvWizard-LoadingContainer\"\n);\n\nexport default wizardLoadingContainerClasses;\n"],"names":["classKeys","wizardLoadingContainerClasses","getClasses"],"mappings":";AAQA,MAAMA,YAAuD,CAC3D,QACA,WACA,SAAS;AAGX,MAAMC,gCAAgCC,WACpCF,WACA,2BACF;AAEA,MAAA,kCAAeC;"}
@@ -1 +1 @@
1
- {"version":3,"file":"WizardTitle.js","sources":["../../../../../src/components/Wizard/WizardTitle/WizardTitle.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvButton,\n HvDialogTitle,\n HvGrid,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Report } from \"@hitachivantara/uikit-react-icons\";\nimport { useContext, useEffect, useState } from \"react\";\nimport { HvStepNavigation, HvStepNavigationProps } from \"../../StepNavigation\";\nimport { HvStepProps } from \"../../StepNavigation/DefaultNavigation\";\nimport { HvWizardContext, wizardTitleClasses, HvWizardTitleClasses } from \"..\";\nimport { styles } from \"./WizardTitle.styles\";\n\nexport interface HvWizardTitleProps extends HvBaseProps {\n /** Title for the wizard. */\n title?: string;\n /** Shows the summary button. */\n hasSummary?: boolean;\n /** An object containing all the labels for the wizard header. */\n labels?: {\n /** Summary button label. */\n summary?: string;\n };\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?: HvWizardTitleClasses;\n}\n\nconst switchTabState = (state, currentTab, index) => {\n if (index === currentTab) return \"Current\";\n if (state.valid) return \"Completed\";\n if (state.valid === null) return \"Enabled\";\n if (state.touched && state.valid === false) return \"Failed\";\n // \"Disabled\"\n // \"Pending\"\n return \"Enabled\";\n};\n\nexport const HvWizardTitle = ({\n title,\n hasSummary = false,\n labels = {},\n classes,\n customStep = {},\n}: HvWizardTitleProps) => {\n const { context, summary, setSummary, tab, setTab } =\n useContext(HvWizardContext);\n\n const [steps, setSteps] = useState<HvStepProps[]>([]);\n\n useEffect(() => {\n if (summary === null && hasSummary) {\n setSummary(false);\n }\n\n return () => {\n setSummary(false);\n };\n }, []);\n\n useEffect(() => {\n const contextArray = Object.entries(context);\n\n if (contextArray.length) {\n const updatedSteps: HvStepProps[] = contextArray.map(\n ([, childState], index) => {\n return {\n title: childState?.name ?? `${index + 1}`,\n state: switchTabState(childState, tab, index),\n onClick: () => setTab(index),\n };\n }\n );\n\n setSteps(updatedSteps);\n }\n }, [context, tab, setTab]);\n\n const toggleSummary = () => {\n setSummary((oldSummary) => !oldSummary);\n };\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <HvDialogTitle\n className={cx(\n wizardTitleClasses.headerContainer,\n css(styles.headerContainer),\n classes?.headerContainer\n )}\n classes={{\n messageContainer: cx(\n wizardTitleClasses.messageContainer,\n css(styles.messageContainer),\n classes?.messageContainer\n ),\n }}\n >\n <HvGrid\n container\n justifyContent=\"space-between\"\n alignItems=\"center\"\n className={cx(\n wizardTitleClasses.titleContainer,\n css(styles.titleContainer),\n classes?.titleContainer\n )}\n >\n {title && (\n <HvTypography variant=\"title3\" component=\"h3\">\n {title}\n </HvTypography>\n )}\n {!!steps.length && (\n <HvStepNavigation\n className={cx(\n wizardTitleClasses.stepContainer,\n css(styles.stepContainer),\n classes?.stepContainer\n )}\n steps={steps}\n type=\"Default\"\n stepSize=\"xs\"\n width={{\n xs: 200,\n sm: 350,\n md: 600,\n lg: 800,\n xl: 1000,\n }}\n {...customStep}\n />\n )}\n {hasSummary && (\n <HvButton\n variant=\"secondarySubtle\"\n className={cx(\n wizardTitleClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n classes={{\n root: cx(\n wizardTitleClasses.rootSummaryButton,\n css(styles.rootSummaryButton),\n classes?.rootSummaryButton\n ),\n }}\n onClick={toggleSummary}\n startIcon={<Report />}\n >\n {`${labels.summary ?? \"Summary\"}`}\n </HvButton>\n )}\n </HvGrid>\n </HvDialogTitle>\n )}\n </ClassNames>\n );\n};\n"],"names":["switchTabState","state","currentTab","index","valid","touched","HvWizardTitle","title","hasSummary","labels","classes","customStep","context","summary","setSummary","tab","setTab","useContext","HvWizardContext","steps","setSteps","useState","useEffect","contextArray","Object","entries","length","updatedSteps","map","childState","name","onClick","toggleSummary","oldSummary","ClassNames","children","css","cx","HvDialogTitle","className","wizardTitleClasses","headerContainer","styles","messageContainer","HvGrid","container","justifyContent","alignItems","titleContainer","_jsx","HvTypography","variant","component","HvStepNavigation","stepContainer","type","stepSize","width","xs","sm","md","lg","xl","HvButton","buttonWidth","root","rootSummaryButton","startIcon","Report"],"mappings":"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"}
1
+ {"version":3,"file":"WizardTitle.js","sources":["../../../../../src/components/Wizard/WizardTitle/WizardTitle.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport {\n HvBaseProps,\n HvButton,\n HvDialogTitle,\n HvGrid,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Report } from \"@hitachivantara/uikit-react-icons\";\nimport { useContext, useEffect, useState } from \"react\";\nimport { HvStepNavigation, HvStepNavigationProps } from \"../../StepNavigation\";\nimport { HvStepProps } from \"../../StepNavigation/DefaultNavigation\";\nimport { HvWizardContext, wizardTitleClasses, HvWizardTitleClasses } from \"..\";\nimport { styles } from \"./WizardTitle.styles\";\n\nexport interface HvWizardTitleProps extends HvBaseProps {\n /** Title for the wizard. */\n title?: string;\n /** Shows the summary button. */\n hasSummary?: boolean;\n /** An object containing all the labels for the wizard header. */\n labels?: {\n /** Summary button label. */\n summary?: string;\n };\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?: HvWizardTitleClasses;\n}\n\nconst switchTabState = (state, currentTab, index) => {\n if (index === currentTab) return \"Current\";\n if (state.valid) return \"Completed\";\n if (state.valid === null) return \"Enabled\";\n if (state.touched && state.valid === false) return \"Failed\";\n // \"Disabled\"\n // \"Pending\"\n return \"Enabled\";\n};\n\nexport const HvWizardTitle = ({\n title,\n hasSummary = false,\n labels = {},\n classes,\n customStep = {},\n}: HvWizardTitleProps) => {\n const { context, summary, setSummary, tab, setTab } =\n useContext(HvWizardContext);\n\n const [steps, setSteps] = useState<HvStepProps[]>([]);\n\n useEffect(() => {\n if (summary === null && hasSummary) {\n setSummary(false);\n }\n\n return () => {\n setSummary(false);\n };\n }, []);\n\n useEffect(() => {\n const contextArray = Object.entries(context);\n\n if (contextArray.length) {\n const updatedSteps: HvStepProps[] = contextArray.map(\n ([, childState], index) => {\n return {\n title: childState?.name ?? `${index + 1}`,\n state: switchTabState(childState, tab, index),\n onClick: () => setTab(index),\n };\n }\n );\n\n setSteps(updatedSteps);\n }\n }, [context, tab, setTab]);\n\n const toggleSummary = () => {\n setSummary((oldSummary) => !oldSummary);\n };\n\n return (\n <ClassNames>\n {({ css, cx }) => (\n <HvDialogTitle\n className={cx(\n wizardTitleClasses.headerContainer,\n css(styles.headerContainer),\n classes?.headerContainer\n )}\n classes={{\n messageContainer: cx(\n wizardTitleClasses.messageContainer,\n css(styles.messageContainer),\n classes?.messageContainer\n ),\n }}\n >\n <HvGrid\n container\n justifyContent=\"space-between\"\n alignItems=\"center\"\n className={cx(\n wizardTitleClasses.titleContainer,\n css(styles.titleContainer),\n classes?.titleContainer\n )}\n >\n {title && (\n <HvTypography variant=\"title3\" component=\"h3\">\n {title}\n </HvTypography>\n )}\n {!!steps.length && (\n <HvStepNavigation\n className={cx(\n wizardTitleClasses.stepContainer,\n css(styles.stepContainer),\n classes?.stepContainer\n )}\n steps={steps}\n type=\"Default\"\n stepSize=\"xs\"\n width={{\n xs: 200,\n sm: 350,\n md: 600,\n lg: 800,\n xl: 1000,\n }}\n {...customStep}\n />\n )}\n {hasSummary && (\n <HvButton\n variant=\"secondarySubtle\"\n className={cx(\n wizardTitleClasses.buttonWidth,\n css(styles.buttonWidth),\n classes?.buttonWidth\n )}\n classes={{\n root: cx(\n wizardTitleClasses.rootSummaryButton,\n css(styles.rootSummaryButton),\n classes?.rootSummaryButton\n ),\n }}\n onClick={toggleSummary}\n startIcon={<Report />}\n >\n {`${labels.summary ?? \"Summary\"}`}\n </HvButton>\n )}\n </HvGrid>\n </HvDialogTitle>\n )}\n </ClassNames>\n );\n};\n"],"names":["switchTabState","state","currentTab","index","valid","touched","HvWizardTitle","title","hasSummary","labels","classes","customStep","context","summary","setSummary","tab","setTab","useContext","HvWizardContext","steps","setSteps","useState","useEffect","contextArray","Object","entries","length","updatedSteps","map","childState","name","onClick","toggleSummary","oldSummary","ClassNames","children","css","cx","HvDialogTitle","className","wizardTitleClasses","headerContainer","styles","messageContainer","HvGrid","container","justifyContent","alignItems","titleContainer","_jsx","HvTypography","variant","component","HvStepNavigation","stepContainer","type","stepSize","width","xs","sm","md","lg","xl","HvButton","buttonWidth","root","rootSummaryButton","startIcon","Report"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hitachivantara/uikit-react-lab",
3
- "version": "5.4.7",
3
+ "version": "5.4.8",
4
4
  "private": false,
5
5
  "author": "Hitachi Vantara UI Kit Team",
6
6
  "description": "Contributed React components for the NEXT UI Kit.",
@@ -29,8 +29,11 @@
29
29
  "react-dom": "^17.0.0 || ^18.0.0"
30
30
  },
31
31
  "dependencies": {
32
- "@emotion/cache": "^11.10.5",
33
- "@hitachivantara/uikit-react-core": "^5.14.1",
32
+ "@emotion/css": "^11.11.0",
33
+ "@emotion/serialize": "^1.1.2",
34
+ "@hitachivantara/uikit-react-core": "^5.15.0",
35
+ "@hitachivantara/uikit-react-icons": "^5.2.0",
36
+ "@hitachivantara/uikit-styles": "^5.8.2",
34
37
  "clsx": "^1.2.1",
35
38
  "usehooks-ts": "^2.9.1"
36
39
  },
@@ -41,7 +44,7 @@
41
44
  "access": "public",
42
45
  "directory": "package"
43
46
  },
44
- "gitHead": "59d9debb61b67392ab73f1945716609dd2d77133",
47
+ "gitHead": "10acd676130dcf2a1b89481de2de9ba072b0b746",
45
48
  "main": "dist/cjs/index.cjs",
46
49
  "exports": {
47
50
  ".": {