@hitachivantara/uikit-react-lab 5.3.4 → 5.3.6

package/dist/esm/components/StepNavigation/StepNavigation.js.map

@@ -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          parseInt(\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\n    const navWidth =\n      (next && Math.min(maxWidth, themeBreakpoints[next] ?? maxWidth)) ||\n      themeBreakpoints[breakpoint];\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              let 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              as=\"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","parseInt","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","Number","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","as","style"],"mappings":"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"}
+{"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              as=\"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","as","style"],"mappings":"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"}

package/dist/esm/components/Wizard/Wizard.js.map

@@ -1 +1 @@
-{"version":3,"file":"Wizard.js","sources":["../../../../src/components/Wizard/Wizard.tsx"],"sourcesContent":["import { HvBaseProps } from \"@hitachivantara/uikit-react-core\";\nimport { HvWizardClasses } from \"./wizardClasses\";\nimport { ModalProps } from \"@mui/material\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\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 extends HvBaseProps {\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":";;;;;;;AA2CO,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;"}
+{"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;"}

package/dist/esm/components/Wizard/WizardContainer/WizardContainer.js

@@ -23,6 +23,7 @@ const HvWizardContainer = ({
       className: cx(wizardContainerClasses.root, className, classes == null ? void 0 : classes.root),
       open,
       onClose: handleClose,
+      maxWidth: "lg",
       ...others,
       children
     })

package/dist/esm/components/Wizard/WizardContainer/WizardContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"WizardContainer.js","sources":["../../../../../src/components/Wizard/WizardContainer/WizardContainer.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport { HvBaseProps, HvDialog } from \"@hitachivantara/uikit-react-core\";\nimport wizardContainerClasses, {\n  HvWizardContainerClasses,\n} from \"./wizardContainerClasses\";\nimport { styles } from \"./WizardContainer.styles\";\nimport React from \"react\";\n\nexport interface HvWizardContainerProps extends Omit<HvBaseProps, \"onClose\"> {\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          {...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"],"mappings":";;;;;AAoBO,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,MAAY,GACjBE;AAAAA,MAAMH;AAAAA,IAAAA,CAED;AAAA,EAAA,CAGF;AAEjB;"}
+{"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;"}

package/dist/esm/components/Wizard/WizardContent/LoadingContainer.js

@@ -1,7 +1,7 @@
 import { HvLoading } from "@hitachivantara/uikit-react-core";
+import { ClassNames } from "@emotion/react";
 import { styles } from "./LoadingContainer.styles.js";
 import wizardLoadingContainerClasses from "./loadingContainerClasses.js";
-import { ClassNames } from "@emotion/react";
 import { jsx, jsxs, Fragment } from "@emotion/react/jsx-runtime";
 const LoadingContainer = ({
   children,

package/dist/esm/components/Wizard/WizardContent/LoadingContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingContainer.js","sources":["../../../../../src/components/Wizard/WizardContent/LoadingContainer.tsx"],"sourcesContent":["import { HvLoading, HvLoadingProps } from \"@hitachivantara/uikit-react-core\";\nimport { styles } from \"./LoadingContainer.styles\";\nimport wizardLoadingContainerClasses, {\n  HvWizardLoadingContainerClasses,\n} from \"./loadingContainerClasses\";\nimport { ClassNames } from \"@emotion/react\";\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;"}
+{"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;"}

package/dist/esm/components/Wizard/WizardTitle/WizardTitle.js

@@ -78,14 +78,16 @@ const HvWizardTitle = ({
         }), !!steps.length && /* @__PURE__ */ jsx(HvStepNavigation, {
           className: cx(wizardTitleClasses.stepContainer, css(styles.stepContainer), classes == null ? void 0 : classes.stepContainer),
           steps,
-          type: (customStep == null ? void 0 : customStep.type) ?? "Default",
-          stepSize: (customStep == null ? void 0 : customStep.stepSize) ?? "xs",
-          width: (customStep == null ? void 0 : customStep.width) ?? {
+          type: "Default",
+          stepSize: "xs",
+          width: {
             xs: 200,
             sm: 350,
             md: 600,
-            lg: 800
-          }
+            lg: 800,
+            xl: 1e3
+          },
+          ...customStep
         }), hasSummary && /* @__PURE__ */ jsx(HvButton, {
           variant: "secondarySubtle",
           className: cx(wizardTitleClasses.buttonWidth, css(styles.buttonWidth), classes == null ? void 0 : classes.buttonWidth),

package/dist/esm/components/Wizard/WizardTitle/WizardTitle.js.map

@@ -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 \"components\";\nimport { HvStepProps } from \"components/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={customStep?.type ?? \"Default\"}\n                stepSize={customStep?.stepSize ?? \"xs\"}\n                width={\n                  customStep?.width ?? { xs: 200, sm: 350, md: 600, lg: 800 }\n                }\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","HvButton","buttonWidth","root","rootSummaryButton","startIcon","Report"],"mappings":"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"}
+{"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 \"components\";\nimport { HvStepProps } from \"components/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/dist/types/index.d.ts

@@ -3,6 +3,7 @@ import { HvAvatarSize } from '@hitachivantara/uikit-react-core';
 import { HvBaseProps } from '@hitachivantara/uikit-react-core';
 import { HvBreakpoints } from '@hitachivantara/uikit-react-core';
 import { HvButtonProps } from '@hitachivantara/uikit-react-core';
+import { HvDialogProps } from '@hitachivantara/uikit-react-core';
 import { HvStepNavigationProps as HvStepNavigationProps_2 } from 'components';
 import type { JSX as JSX_2 } from '@emotion/react/jsx-runtime';
 import { ModalProps } from '@mui/material';
@@ -167,7 +168,7 @@ export declare type HvWizardContainerClasses = {
     closeButton?: string;
 };
 
-export declare interface HvWizardContainerProps extends Omit<HvBaseProps, "onClose"> {
+export declare interface HvWizardContainerProps extends Omit<HvBaseProps, "onClose">, Pick<HvDialogProps, "maxWidth" | "fullWidth"> {
     /** Current state of the Wizard. */
     open: boolean;
     /** Function executed on close. */
@@ -213,7 +214,7 @@ declare type HvWizardContextProp = {
     setTab: Dispatch<SetStateAction<number>>;
 };
 
-export declare interface HvWizardProps extends HvBaseProps {
+export declare interface HvWizardProps extends HvBaseProps, Pick<HvDialogProps, "maxWidth" | "fullWidth"> {
     /** Current state of the Wizard. */
     open: boolean;
     /** Function executed on close. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-lab",
-  "version": "5.3.4",
+  "version": "5.3.6",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
   "description": "Contributed React components for the NEXT UI Kit.",
@@ -30,7 +30,7 @@
   },
   "dependencies": {
     "@emotion/cache": "^11.10.5",
-    "@hitachivantara/uikit-react-core": "^5.7.4",
+    "@hitachivantara/uikit-react-core": "^5.8.0",
     "clsx": "^1.2.1",
     "usehooks-ts": "^2.9.1"
   },
@@ -41,7 +41,7 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "d49875aecf47b89048990eb0bbb174f0a2b75007",
+  "gitHead": "59704d0ac7e825744e1c46819bb24ba755c99be3",
   "main": "dist/cjs/index.cjs",
   "exports": {
     ".": {