@hitachivantara/uikit-react-lab 5.19.0 → 5.19.2

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

@@ -19,24 +19,17 @@ const HvWizardActions = ({
     submit: "Submit"
   }
 }) => {
-  const {
-    classes,
-    css,
-    cx
-  } = useClasses(classesProp);
-  const {
-    context,
-    setContext,
-    tab,
-    setTab
-  } = useContext(HvWizardContext);
+  const { classes, css, cx } = useClasses(classesProp);
+  const { context, setContext, tab, setTab } = useContext(HvWizardContext);
   const [pages, setPages] = useState(0);
   const [canSubmit, setCanSubmit] = useState(false);
   useEffect(() => {
     const contextEntries = Object.entries(context);
     if (contextEntries.length) {
       setPages(contextEntries.length);
-      const validWizard = Object.entries(context).every(([, value]) => value?.valid);
+      const validWizard = Object.entries(context).every(
+        ([, value]) => value?.valid
+      );
       if (validWizard !== canSubmit) {
         setCanSubmit(validWizard);
       }
@@ -45,25 +38,77 @@ const HvWizardActions = ({
   const lastPage = pages - 1;
   const isLastPage = tab >= lastPage;
   const handleSkip = useCallback(() => {
-    setContext((c) => Object.entries(c).reduce((acc, [key, child]) => ({
-      ...acc,
-      [+key]: {
-        ...child,
-        valid: child?.valid !== false
-      }
-    }), {}));
+    setContext(
+      (c) => Object.entries(c).reduce(
+        (acc, [key, child]) => ({
+          ...acc,
+          [+key]: {
+            ...child,
+            valid: child?.valid !== false
+          }
+        }),
+        {}
+      )
+    );
     setTab(lastPage);
   }, [setTab, lastPage, setContext]);
-  const handleSubmitInternal = useCallback(() => handleSubmit(context), [handleSubmit, context]);
+  const handleSubmitInternal = useCallback(
+    () => handleSubmit(context),
+    [handleSubmit, context]
+  );
   return /* @__PURE__ */ jsxs(HvDialogActions, { className: classes.actionsContainer, children: [
-    /* @__PURE__ */ jsx(HvButton, { variant: "secondaryGhost", onClick: handleClose, className: classes.buttonWidth, children: `${labels.cancel ?? "Cancel"}` }),
-    skippable && /* @__PURE__ */ jsx(HvButton, { variant: "secondaryGhost", disabled: isLastPage, className: classes.buttonWidth, onClick: handleSkip, children: `${labels.skip ?? "Skip"}` }),
-    /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: css({
-      flex: 1
-    }), children: " " }),
+    /* @__PURE__ */ jsx(
+      HvButton,
+      {
+        variant: "secondaryGhost",
+        onClick: handleClose,
+        className: classes.buttonWidth,
+        children: `${labels.cancel ?? "Cancel"}`
+      }
+    ),
+    skippable && /* @__PURE__ */ jsx(
+      HvButton,
+      {
+        variant: "secondaryGhost",
+        disabled: isLastPage,
+        className: classes.buttonWidth,
+        onClick: handleSkip,
+        children: `${labels.skip ?? "Skip"}`
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: css({ flex: 1 }), children: " " }),
     /* @__PURE__ */ jsxs("div", { className: classes.buttonsContainer, children: [
-      /* @__PURE__ */ jsx(HvButton, { variant: "secondaryGhost", className: classes.buttonWidth, disabled: tab <= 0, onClick: () => setTab((t) => t - 1), startIcon: /* @__PURE__ */ jsx(Backwards, {}), children: `${labels.previous ?? "Previous"}` }),
-      isLastPage ? /* @__PURE__ */ jsx(HvButton, { variant: "primary", className: classes.buttonWidth, disabled: loading || !canSubmit, onClick: handleSubmitInternal, children: `${labels.submit ?? "Submit"}` }) : /* @__PURE__ */ jsx(HvButton, { variant: "secondaryGhost", className: cx(classes.buttonWidth, classes.buttonSpacing), onClick: () => setTab((t) => t + 1), disabled: !skippable && !context?.[tab]?.valid, endIcon: /* @__PURE__ */ jsx(Forwards, {}), children: `${labels.next ?? "Next"}` })
+      /* @__PURE__ */ jsx(
+        HvButton,
+        {
+          variant: "secondaryGhost",
+          className: classes.buttonWidth,
+          disabled: tab <= 0,
+          onClick: () => setTab((t) => t - 1),
+          startIcon: /* @__PURE__ */ jsx(Backwards, {}),
+          children: `${labels.previous ?? "Previous"}`
+        }
+      ),
+      isLastPage ? /* @__PURE__ */ jsx(
+        HvButton,
+        {
+          variant: "primary",
+          className: classes.buttonWidth,
+          disabled: loading || !canSubmit,
+          onClick: handleSubmitInternal,
+          children: `${labels.submit ?? "Submit"}`
+        }
+      ) : /* @__PURE__ */ jsx(
+        HvButton,
+        {
+          variant: "secondaryGhost",
+          className: cx(classes.buttonWidth, classes.buttonSpacing),
+          onClick: () => setTab((t) => t + 1),
+          disabled: !skippable && !context?.[tab]?.valid,
+          endIcon: /* @__PURE__ */ jsx(Forwards, {}),
+          children: `${labels.next ?? "Next"}`
+        }
+      )
     ] })
   ] });
 };

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

@@ -1 +1 @@
-{"version":3,"file":"WizardActions.js","sources":["../../../../../src/components/Wizard/WizardActions/WizardActions.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useState } from \"react\";\n\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvButton,\n  HvDialogActions,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Backwards, Forwards } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvWizardContext, HvWizardTabs } from \"../WizardContext\";\nimport { staticClasses, useClasses } from \"./WizardActions.styles\";\n\nexport { staticClasses as wizardActionsClasses };\n\nexport type HvWizardActionsClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvWizardActionsProps extends HvBaseProps {\n  /** Function to handle the cancel button. */\n  handleClose: (\n    event: React.SyntheticEvent,\n    reason?: \"escapeKeyDown\" | \"backdropClick\"\n  ) => void;\n  /** Function to handle the submit button. Also sends the current context state. */\n  handleSubmit: (context: any) => void;\n  /** An object containing all the labels for the wizard actions component. */\n  labels?: {\n    /** Cancel button label. */\n    cancel?: string;\n    /** Skip button label. */\n    skip?: string;\n    /** Previous button label. */\n    previous?: string;\n    /** Next button label. */\n    next?: string;\n    /** Submit button label. */\n    submit?: string;\n  };\n  /** Whether the submit button is disabled. */\n  loading?: boolean;\n  /** Enables the skip button. */\n  skippable?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n  classes?: HvWizardActionsClasses;\n}\n\nexport const HvWizardActions = ({\n  classes: classesProp,\n  handleClose,\n  handleSubmit,\n  loading = false,\n  skippable = false,\n  labels = {\n    cancel: \"Cancel\",\n    next: \"Next\",\n    previous: \"Previous\",\n    skip: \"Skip\",\n    submit: \"Submit\",\n  },\n}: HvWizardActionsProps) => {\n  const { classes, css, cx } = useClasses(classesProp);\n\n  const { context, setContext, tab, setTab } = useContext(HvWizardContext);\n  const [pages, setPages] = useState(0);\n  const [canSubmit, setCanSubmit] = useState(false);\n\n  useEffect(() => {\n    const contextEntries = Object.entries(context);\n    if (contextEntries.length) {\n      setPages(contextEntries.length);\n\n      const validWizard = Object.entries(context).every(\n        ([, value]) => value?.valid\n      );\n      if (validWizard !== canSubmit) {\n        setCanSubmit(validWizard);\n      }\n    }\n  }, [context, canSubmit, setCanSubmit, setPages]);\n\n  const lastPage = pages - 1;\n  const isLastPage = tab >= lastPage;\n\n  const handleSkip = useCallback(() => {\n    setContext((c) =>\n      Object.entries(c).reduce(\n        (acc, [key, child]) => ({\n          ...acc,\n          [+key]: {\n            ...child,\n            valid: child?.valid !== false,\n          },\n        }),\n        {} as HvWizardTabs\n      )\n    );\n    setTab(lastPage);\n  }, [setTab, lastPage, setContext]);\n\n  const handleSubmitInternal = useCallback(\n    () => handleSubmit(context),\n    [handleSubmit, context]\n  );\n\n  return (\n    <HvDialogActions className={classes.actionsContainer}>\n      <HvButton\n        variant=\"secondaryGhost\"\n        onClick={handleClose}\n        className={classes.buttonWidth}\n      >\n        {`${labels.cancel ?? \"Cancel\"}`}\n      </HvButton>\n      {skippable && (\n        <HvButton\n          variant=\"secondaryGhost\"\n          disabled={isLastPage}\n          className={classes.buttonWidth}\n          onClick={handleSkip}\n        >\n          {`${labels.skip ?? \"Skip\"}`}\n        </HvButton>\n      )}\n      <div aria-hidden className={css({ flex: 1 })}>\n        &nbsp;\n      </div>\n      <div className={classes.buttonsContainer}>\n        <HvButton\n          variant=\"secondaryGhost\"\n          className={classes.buttonWidth}\n          disabled={tab <= 0}\n          onClick={() => setTab((t) => t - 1)}\n          startIcon={<Backwards />}\n        >\n          {`${labels.previous ?? \"Previous\"}`}\n        </HvButton>\n        {isLastPage ? (\n          <HvButton\n            variant=\"primary\"\n            className={classes.buttonWidth}\n            disabled={loading || !canSubmit}\n            onClick={handleSubmitInternal}\n          >\n            {`${labels.submit ?? \"Submit\"}`}\n          </HvButton>\n        ) : (\n          <HvButton\n            variant=\"secondaryGhost\"\n            className={cx(classes.buttonWidth, classes.buttonSpacing)}\n            onClick={() => setTab((t) => t + 1)}\n            disabled={!skippable && !context?.[tab]?.valid}\n            endIcon={<Forwards />}\n          >\n            {`${labels.next ?? \"Next\"}`}\n          </HvButton>\n        )}\n      </div>\n    </HvDialogActions>\n  );\n};\n"],"names":["HvWizardActions","classes","classesProp","handleClose","handleSubmit","loading","skippable","labels","cancel","next","previous","skip","submit","css","cx","useClasses","context","setContext","tab","setTab","useContext","HvWizardContext","pages","setPages","useState","canSubmit","setCanSubmit","useEffect","contextEntries","Object","entries","length","validWizard","every","value","valid","lastPage","isLastPage","handleSkip","useCallback","c","reduce","acc","key","child","handleSubmitInternal","actionsContainer","buttonWidth","flex","buttonsContainer","t","buttonSpacing"],"mappings":"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"}
+{"version":3,"file":"WizardActions.js","sources":["../../../../../src/components/Wizard/WizardActions/WizardActions.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useState } from \"react\";\n\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvButton,\n  HvDialogActions,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Backwards, Forwards } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvWizardContext, HvWizardTabs } from \"../WizardContext\";\nimport { staticClasses, useClasses } from \"./WizardActions.styles\";\n\nexport { staticClasses as wizardActionsClasses };\n\nexport type HvWizardActionsClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvWizardActionsProps extends HvBaseProps {\n  /** Function to handle the cancel button. */\n  handleClose: (\n    event: React.SyntheticEvent,\n    reason?: \"escapeKeyDown\" | \"backdropClick\"\n  ) => void;\n  /** Function to handle the submit button. Also sends the current context state. */\n  handleSubmit: (context: any) => void;\n  /** An object containing all the labels for the wizard actions component. */\n  labels?: {\n    /** Cancel button label. */\n    cancel?: string;\n    /** Skip button label. */\n    skip?: string;\n    /** Previous button label. */\n    previous?: string;\n    /** Next button label. */\n    next?: string;\n    /** Submit button label. */\n    submit?: string;\n  };\n  /** Whether the submit button is disabled. */\n  loading?: boolean;\n  /** Enables the skip button. */\n  skippable?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n  classes?: HvWizardActionsClasses;\n}\n\nexport const HvWizardActions = ({\n  classes: classesProp,\n  handleClose,\n  handleSubmit,\n  loading = false,\n  skippable = false,\n  labels = {\n    cancel: \"Cancel\",\n    next: \"Next\",\n    previous: \"Previous\",\n    skip: \"Skip\",\n    submit: \"Submit\",\n  },\n}: HvWizardActionsProps) => {\n  const { classes, css, cx } = useClasses(classesProp);\n\n  const { context, setContext, tab, setTab } = useContext(HvWizardContext);\n  const [pages, setPages] = useState(0);\n  const [canSubmit, setCanSubmit] = useState(false);\n\n  useEffect(() => {\n    const contextEntries = Object.entries(context);\n    if (contextEntries.length) {\n      setPages(contextEntries.length);\n\n      const validWizard = Object.entries(context).every(\n        ([, value]) => value?.valid\n      );\n      if (validWizard !== canSubmit) {\n        setCanSubmit(validWizard);\n      }\n    }\n  }, [context, canSubmit, setCanSubmit, setPages]);\n\n  const lastPage = pages - 1;\n  const isLastPage = tab >= lastPage;\n\n  const handleSkip = useCallback(() => {\n    setContext((c) =>\n      Object.entries(c).reduce(\n        (acc, [key, child]) => ({\n          ...acc,\n          [+key]: {\n            ...child,\n            valid: child?.valid !== false,\n          },\n        }),\n        {} as HvWizardTabs\n      )\n    );\n    setTab(lastPage);\n  }, [setTab, lastPage, setContext]);\n\n  const handleSubmitInternal = useCallback(\n    () => handleSubmit(context),\n    [handleSubmit, context]\n  );\n\n  return (\n    <HvDialogActions className={classes.actionsContainer}>\n      <HvButton\n        variant=\"secondaryGhost\"\n        onClick={handleClose}\n        className={classes.buttonWidth}\n      >\n        {`${labels.cancel ?? \"Cancel\"}`}\n      </HvButton>\n      {skippable && (\n        <HvButton\n          variant=\"secondaryGhost\"\n          disabled={isLastPage}\n          className={classes.buttonWidth}\n          onClick={handleSkip}\n        >\n          {`${labels.skip ?? \"Skip\"}`}\n        </HvButton>\n      )}\n      <div aria-hidden className={css({ flex: 1 })}>\n        &nbsp;\n      </div>\n      <div className={classes.buttonsContainer}>\n        <HvButton\n          variant=\"secondaryGhost\"\n          className={classes.buttonWidth}\n          disabled={tab <= 0}\n          onClick={() => setTab((t) => t - 1)}\n          startIcon={<Backwards />}\n        >\n          {`${labels.previous ?? \"Previous\"}`}\n        </HvButton>\n        {isLastPage ? (\n          <HvButton\n            variant=\"primary\"\n            className={classes.buttonWidth}\n            disabled={loading || !canSubmit}\n            onClick={handleSubmitInternal}\n          >\n            {`${labels.submit ?? \"Submit\"}`}\n          </HvButton>\n        ) : (\n          <HvButton\n            variant=\"secondaryGhost\"\n            className={cx(classes.buttonWidth, classes.buttonSpacing)}\n            onClick={() => setTab((t) => t + 1)}\n            disabled={!skippable && !context?.[tab]?.valid}\n            endIcon={<Forwards />}\n          >\n            {`${labels.next ?? \"Next\"}`}\n          </HvButton>\n        )}\n      </div>\n    </HvDialogActions>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/components/Wizard/WizardActions/WizardActions.styles.js

@@ -1,9 +1,6 @@
 import { theme } from "@hitachivantara/uikit-styles";
 import { createClasses } from "@hitachivantara/uikit-react-core";
-const {
-  staticClasses,
-  useClasses
-} = createClasses("HvWizardActions", {
+const { staticClasses, useClasses } = createClasses("HvWizardActions", {
   actionsContainer: {},
   buttonWidth: {
     width: 120,

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

@@ -1 +1 @@
-{"version":3,"file":"WizardActions.styles.js","sources":["../../../../../src/components/Wizard/WizardActions/WizardActions.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvWizardActions\", {\n  actionsContainer: {},\n  buttonWidth: {\n    width: 120,\n    \"& span\": {\n      whiteSpace: \"normal\",\n      lineHeight: theme.lineHeights.sm,\n    },\n  },\n  buttonsContainer: {\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: theme.space.xs,\n  },\n  buttonSpacing: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","actionsContainer","buttonWidth","width","whiteSpace","lineHeight","theme","lineHeights","sm","buttonsContainer","display","alignItems","gap","space","xs","buttonSpacing"],"mappings":";;AAGa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,mBAAmB;AAAA,EAC5EC,kBAAkB,CAAC;AAAA,EACnBC,aAAa;AAAA,IACXC,OAAO;AAAA,IACP,UAAU;AAAA,MACRC,YAAY;AAAA,MACZC,YAAYC,MAAMC,YAAYC;AAAAA,IAChC;AAAA,EACF;AAAA,EACAC,kBAAkB;AAAA,IAChBC,SAAS;AAAA,IACTC,YAAY;AAAA,IACZC,KAAKN,MAAMO,MAAMC;AAAAA,EACnB;AAAA,EACAC,eAAe,CAAC;AAClB,CAAC;"}
+{"version":3,"file":"WizardActions.styles.js","sources":["../../../../../src/components/Wizard/WizardActions/WizardActions.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvWizardActions\", {\n  actionsContainer: {},\n  buttonWidth: {\n    width: 120,\n    \"& span\": {\n      whiteSpace: \"normal\",\n      lineHeight: theme.lineHeights.sm,\n    },\n  },\n  buttonsContainer: {\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: theme.space.xs,\n  },\n  buttonSpacing: {},\n});\n"],"names":[],"mappings":";;AAGO,MAAM,EAAE,eAAe,eAAe,cAAc,mBAAmB;AAAA,EAC5E,kBAAkB,CAAC;AAAA,EACnB,aAAa;AAAA,IACX,OAAO;AAAA,IACP,UAAU;AAAA,MACR,YAAY;AAAA,MACZ,YAAY,MAAM,YAAY;AAAA,IAChC;AAAA,EACF;AAAA,EACA,kBAAkB;AAAA,IAChB,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,KAAK,MAAM,MAAM;AAAA,EACnB;AAAA,EACA,eAAe,CAAC;AAClB,CAAC;"}

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

@@ -11,13 +11,22 @@ const HvWizardContainer = (props) => {
     open,
     ...others
   } = useDefaultProps("HvWizardContainer", props);
-  const {
-    classes
-  } = useClasses(classesProp);
-  return /* @__PURE__ */ jsx(HvDialog, { classes: {
-    closeButton: classes.closeButton,
-    paper: classes.paper
-  }, className: classes.root, open, onClose: handleClose, maxWidth: "lg", ...others, children });
+  const { classes } = useClasses(classesProp);
+  return /* @__PURE__ */ jsx(
+    HvDialog,
+    {
+      classes: {
+        closeButton: classes.closeButton,
+        paper: classes.paper
+      },
+      className: classes.root,
+      open,
+      onClose: handleClose,
+      maxWidth: "lg",
+      ...others,
+      children
+    }
+  );
 };
 export {
   HvWizardContainer,

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 React from \"react\";\n\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvDialog,\n  HvDialogProps,\n  useDefaultProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { staticClasses, useClasses } from \"./WizardContainer.styles\";\n\nexport { staticClasses as wizardContainerClasses };\n\nexport type HvWizardContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvWizardContainerProps\n  extends Omit<HvBaseProps, \"onClose\">,\n    Pick<HvDialogProps, \"maxWidth\" | \"fullWidth\"> {\n  /** Current state of the Wizard. */\n  open: boolean;\n  /** Function executed on close. */\n  handleClose: (\n    event: React.SyntheticEvent,\n    reason?: \"escapeKeyDown\" | \"backdropClick\"\n  ) => void;\n  /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n  classes?: HvWizardContainerClasses;\n}\n\nexport const HvWizardContainer = (props: HvWizardContainerProps) => {\n  const {\n    classes: classesProp,\n    className,\n    children,\n    handleClose,\n    open,\n    ...others\n  } = useDefaultProps(\"HvWizardContainer\", props);\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <HvDialog\n      classes={{\n        closeButton: classes.closeButton,\n        paper: classes.paper,\n      }}\n      className={classes.root}\n      open={open}\n      onClose={handleClose}\n      maxWidth=\"lg\"\n      {...others}\n    >\n      {children}\n    </HvDialog>\n  );\n};\n"],"names":["HvWizardContainer","props","classes","classesProp","className","children","handleClose","open","others","useDefaultProps","useClasses","closeButton","paper","root"],"mappings":";;;;AA8BaA,MAAAA,oBAAoBA,CAACC,UAAkC;AAC5D,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,qBAAqBR,KAAK;AACxC,QAAA;AAAA,IAAEC;AAAAA,EAAAA,IAAYQ,WAAWP,WAAW;AAGxC,SAAA,oBAAC,YACC,SAAS;AAAA,IACPQ,aAAaT,QAAQS;AAAAA,IACrBC,OAAOV,QAAQU;AAAAA,EACjB,GACA,WAAWV,QAAQW,MACnB,MACA,SAASP,aACT,UAAS,MACLE,GAAAA,QAEHH,SACH,CAAA;AAEJ;"}
+{"version":3,"file":"WizardContainer.js","sources":["../../../../../src/components/Wizard/WizardContainer/WizardContainer.tsx"],"sourcesContent":["import React from \"react\";\n\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvDialog,\n  HvDialogProps,\n  useDefaultProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { staticClasses, useClasses } from \"./WizardContainer.styles\";\n\nexport { staticClasses as wizardContainerClasses };\n\nexport type HvWizardContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvWizardContainerProps\n  extends Omit<HvBaseProps, \"onClose\">,\n    Pick<HvDialogProps, \"maxWidth\" | \"fullWidth\"> {\n  /** Current state of the Wizard. */\n  open: boolean;\n  /** Function executed on close. */\n  handleClose: (\n    event: React.SyntheticEvent,\n    reason?: \"escapeKeyDown\" | \"backdropClick\"\n  ) => void;\n  /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n  classes?: HvWizardContainerClasses;\n}\n\nexport const HvWizardContainer = (props: HvWizardContainerProps) => {\n  const {\n    classes: classesProp,\n    className,\n    children,\n    handleClose,\n    open,\n    ...others\n  } = useDefaultProps(\"HvWizardContainer\", props);\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <HvDialog\n      classes={{\n        closeButton: classes.closeButton,\n        paper: classes.paper,\n      }}\n      className={classes.root}\n      open={open}\n      onClose={handleClose}\n      maxWidth=\"lg\"\n      {...others}\n    >\n      {children}\n    </HvDialog>\n  );\n};\n"],"names":[],"mappings":";;;;AA8Ba,MAAA,oBAAoB,CAAC,UAAkC;AAC5D,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,qBAAqB,KAAK;AAC9C,QAAM,EAAE,QAAA,IAAY,WAAW,WAAW;AAGxC,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,SAAS;AAAA,QACP,aAAa,QAAQ;AAAA,QACrB,OAAO,QAAQ;AAAA,MACjB;AAAA,MACA,WAAW,QAAQ;AAAA,MACnB;AAAA,MACA,SAAS;AAAA,MACT,UAAS;AAAA,MACR,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}

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

@@ -1,18 +1,18 @@
 import { createClasses } from "@hitachivantara/uikit-react-core";
-const {
-  staticClasses,
-  useClasses
-} = createClasses("HvWizardContainer", {
-  root: {},
-  paper: {
-    width: "80%",
-    maxWidth: "80%",
-    maxHeight: "calc(100% - (2 * 80px))"
-  },
-  closeButton: {
-    display: "none"
+const { staticClasses, useClasses } = createClasses(
+  "HvWizardContainer",
+  {
+    root: {},
+    paper: {
+      width: "80%",
+      maxWidth: "80%",
+      maxHeight: "calc(100% - (2 * 80px))"
+    },
+    closeButton: {
+      display: "none"
+    }
   }
-});
+);
 export {
   staticClasses,
   useClasses

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

@@ -1 +1 @@
-{"version":3,"file":"WizardContainer.styles.js","sources":["../../../../../src/components/Wizard/WizardContainer/WizardContainer.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvWizardContainer\",\n  {\n    root: {},\n    paper: {\n      width: \"80%\",\n      maxWidth: \"80%\",\n      maxHeight: \"calc(100% - (2 * 80px))\",\n    },\n    closeButton: {\n      display: \"none\",\n    },\n  }\n);\n"],"names":["staticClasses","useClasses","createClasses","root","paper","width","maxWidth","maxHeight","closeButton","display"],"mappings":";AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAC3C,qBACA;AAAA,EACEC,MAAM,CAAC;AAAA,EACPC,OAAO;AAAA,IACLC,OAAO;AAAA,IACPC,UAAU;AAAA,IACVC,WAAW;AAAA,EACb;AAAA,EACAC,aAAa;AAAA,IACXC,SAAS;AAAA,EACX;AACF,CACF;"}
+{"version":3,"file":"WizardContainer.styles.js","sources":["../../../../../src/components/Wizard/WizardContainer/WizardContainer.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvWizardContainer\",\n  {\n    root: {},\n    paper: {\n      width: \"80%\",\n      maxWidth: \"80%\",\n      maxHeight: \"calc(100% - (2 * 80px))\",\n    },\n    closeButton: {\n      display: \"none\",\n    },\n  }\n);\n"],"names":[],"mappings":";AAEa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM,CAAC;AAAA,IACP,OAAO;AAAA,MACL,OAAO;AAAA,MACP,UAAU;AAAA,MACV,WAAW;AAAA,IACb;AAAA,IACA,aAAa;AAAA,MACX,SAAS;AAAA,IACX;AAAA,EACF;AACF;"}

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

@@ -7,24 +7,31 @@ const LoadingContainer = ({
   classes: classesProp,
   ...others
 }) => {
-  const {
-    classes,
-    cx
-  } = useClasses(classesProp);
+  const { classes, cx } = useClasses(classesProp);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("div", { style: {
-      top: 0,
-      left: 0,
-      height: "100%",
-      width: "100%"
-    }, className: cx(classes.overlay, {
-      [classes.blur]: !hidden
-    }), children: /* @__PURE__ */ jsx(HvLoading, { classes: {
-      root: classes.loading
-    }, hidden, ...others }) }),
-    /* @__PURE__ */ jsx("div", { style: {
-      display: "flow-root"
-    }, children })
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          top: 0,
+          left: 0,
+          height: "100%",
+          width: "100%"
+        },
+        className: cx(classes.overlay, { [classes.blur]: !hidden }),
+        children: /* @__PURE__ */ jsx(
+          HvLoading,
+          {
+            classes: {
+              root: classes.loading
+            },
+            hidden,
+            ...others
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { style: { display: "flow-root" }, children })
   ] });
 };
 export {

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 {\n  HvLoading,\n  HvLoadingProps,\n  ExtractNames,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./LoadingContainer.styles\";\n\ntype HvWizardLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\ninterface LoadingContainerProps extends Omit<HvLoadingProps, \"classes\"> {\n  classes?: HvWizardLoadingContainerClasses;\n}\n\nexport const LoadingContainer = ({\n  children,\n  hidden,\n  classes: classesProp,\n  ...others\n}: LoadingContainerProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <>\n      <div\n        style={{\n          top: 0,\n          left: 0,\n          height: \"100%\",\n          width: \"100%\",\n        }}\n        className={cx(classes.overlay, { [classes.blur]: !hidden })}\n      >\n        <HvLoading\n          classes={{\n            root: classes.loading,\n          }}\n          hidden={hidden}\n          {...others}\n        />\n      </div>\n      <div style={{ display: \"flow-root\" }}>{children}</div>\n    </>\n  );\n};\n"],"names":["LoadingContainer","children","hidden","classes","classesProp","others","cx","useClasses","top","left","height","width","overlay","blur","root","loading","display"],"mappings":";;;AAcO,MAAMA,mBAAmBA,CAAC;AAAA,EAC/BC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACT,GAAGC;AACkB,MAAM;AACrB,QAAA;AAAA,IAAEF;AAAAA,IAASG;AAAAA,EAAAA,IAAOC,WAAWH,WAAW;AAE9C,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA,oBAAC,SACC,OAAO;AAAA,MACLI,KAAK;AAAA,MACLC,MAAM;AAAA,MACNC,QAAQ;AAAA,MACRC,OAAO;AAAA,IAET,GAAA,WAAWL,GAAGH,QAAQS,SAAS;AAAA,MAAE,CAACT,QAAQU,IAAI,GAAG,CAACX;AAAAA,IAAQ,CAAA,GAE1D,UAAC,oBAAA,WAAA,EACC,SAAS;AAAA,MACPY,MAAMX,QAAQY;AAAAA,IAEhB,GAAA,QACIV,GAAAA,OAAO,CAAA,GAEf;AAAA,IACA,oBAAC,SAAI,OAAO;AAAA,MAAEW,SAAS;AAAA,OAAgBf,SAAS,CAAA;AAAA,EAClD,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"LoadingContainer.js","sources":["../../../../../src/components/Wizard/WizardContent/LoadingContainer.tsx"],"sourcesContent":["import {\n  HvLoading,\n  HvLoadingProps,\n  ExtractNames,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./LoadingContainer.styles\";\n\ntype HvWizardLoadingContainerClasses = ExtractNames<typeof useClasses>;\n\ninterface LoadingContainerProps extends Omit<HvLoadingProps, \"classes\"> {\n  classes?: HvWizardLoadingContainerClasses;\n}\n\nexport const LoadingContainer = ({\n  children,\n  hidden,\n  classes: classesProp,\n  ...others\n}: LoadingContainerProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <>\n      <div\n        style={{\n          top: 0,\n          left: 0,\n          height: \"100%\",\n          width: \"100%\",\n        }}\n        className={cx(classes.overlay, { [classes.blur]: !hidden })}\n      >\n        <HvLoading\n          classes={{\n            root: classes.loading,\n          }}\n          hidden={hidden}\n          {...others}\n        />\n      </div>\n      <div style={{ display: \"flow-root\" }}>{children}</div>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;AAcO,MAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,GAAG;AACL,MAA6B;AAC3B,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,UACL,KAAK;AAAA,UACL,MAAM;AAAA,UACN,QAAQ;AAAA,UACR,OAAO;AAAA,QACT;AAAA,QACA,WAAW,GAAG,QAAQ,SAAS,EAAE,CAAC,QAAQ,IAAI,GAAG,CAAC,QAAQ;AAAA,QAE1D,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,cACP,MAAM,QAAQ;AAAA,YAChB;AAAA,YACA;AAAA,YACC,GAAG;AAAA,UAAA;AAAA,QACN;AAAA,MAAA;AAAA,IACF;AAAA,wBACC,OAAI,EAAA,OAAO,EAAE,SAAS,YAAA,GAAgB,UAAS;AAAA,EAClD,EAAA,CAAA;AAEJ;"}

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

@@ -1,23 +1,22 @@
-import { createClasses, hexToRgbA, theme } from "@hitachivantara/uikit-react-core";
-import { alpha } from "@mui/material";
-const {
-  staticClasses,
-  useClasses
-} = createClasses("HvWizard-LoadingContainer", {
-  loading: {
-    width: "100%",
-    height: "100%"
-  },
-  overlay: {
-    position: "absolute",
-    transition: "background-Color .2s ease",
-    zIndex: -1
-  },
-  blur: {
-    backgroundColor: alpha(hexToRgbA(theme.colors.atmo2), 0.8),
-    zIndex: theme.zIndices.modal
+import { createClasses, theme } from "@hitachivantara/uikit-react-core";
+const { staticClasses, useClasses } = createClasses(
+  "HvWizard-LoadingContainer",
+  {
+    loading: {
+      width: "100%",
+      height: "100%"
+    },
+    overlay: {
+      position: "absolute",
+      transition: "background-Color .2s ease",
+      zIndex: -1
+    },
+    blur: {
+      backgroundColor: theme.alpha("atmo2", 0.8),
+      zIndex: theme.zIndices.modal
+    }
   }
-});
+);
 export {
   staticClasses,
   useClasses

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

@@ -1 +1 @@
-{"version":3,"file":"LoadingContainer.styles.js","sources":["../../../../../src/components/Wizard/WizardContent/LoadingContainer.styles.tsx"],"sourcesContent":["import {\n  createClasses,\n  hexToRgbA,\n  theme,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { alpha } from \"@mui/material\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvWizard-LoadingContainer\",\n  {\n    loading: {\n      width: \"100%\",\n      height: \"100%\",\n    },\n    overlay: {\n      position: \"absolute\",\n      transition: \"background-Color .2s ease\",\n      zIndex: -1,\n    },\n    blur: {\n      backgroundColor: alpha(hexToRgbA(theme.colors.atmo2), 0.8),\n      zIndex: theme.zIndices.modal,\n    },\n  }\n);\n"],"names":["staticClasses","useClasses","createClasses","loading","width","height","overlay","position","transition","zIndex","blur","backgroundColor","alpha","hexToRgbA","theme","colors","atmo2","zIndices","modal"],"mappings":";;AAQa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAC3C,6BACA;AAAA,EACEC,SAAS;AAAA,IACPC,OAAO;AAAA,IACPC,QAAQ;AAAA,EACV;AAAA,EACAC,SAAS;AAAA,IACPC,UAAU;AAAA,IACVC,YAAY;AAAA,IACZC,QAAQ;AAAA,EACV;AAAA,EACAC,MAAM;AAAA,IACJC,iBAAiBC,MAAMC,UAAUC,MAAMC,OAAOC,KAAK,GAAG,GAAG;AAAA,IACzDP,QAAQK,MAAMG,SAASC;AAAAA,EACzB;AACF,CACF;"}
+{"version":3,"file":"LoadingContainer.styles.js","sources":["../../../../../src/components/Wizard/WizardContent/LoadingContainer.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvWizard-LoadingContainer\",\n  {\n    loading: {\n      width: \"100%\",\n      height: \"100%\",\n    },\n    overlay: {\n      position: \"absolute\",\n      transition: \"background-Color .2s ease\",\n      zIndex: -1,\n    },\n    blur: {\n      backgroundColor: theme.alpha(\"atmo2\", 0.8),\n      zIndex: theme.zIndices.modal,\n    },\n  }\n);\n"],"names":[],"mappings":";AAEa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,SAAS;AAAA,MACP,OAAO;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,IACA,SAAS;AAAA,MACP,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,QAAQ;AAAA,IACV;AAAA,IACA,MAAM;AAAA,MACJ,iBAAiB,MAAM,MAAM,SAAS,GAAG;AAAA,MACzC,QAAQ,MAAM,SAAS;AAAA,IACzB;AAAA,EACF;AACF;"}

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

@@ -15,35 +15,22 @@ const HvWizardContent = ({
   children,
   summaryContent
 }) => {
-  const {
-    classes,
-    cx
-  } = useClasses(classesProp);
-  const {
-    context,
-    setContext,
-    summary,
-    tab
-  } = useContext(HvWizardContext);
+  const { classes, cx } = useClasses(classesProp);
+  const { context, setContext, summary, tab } = useContext(HvWizardContext);
   const arrayChildren = React.Children.toArray(children);
-  const initialContext = arrayChildren.reduce((acc, child, index) => {
-    const invalid = "mustValidate" in child.props && child.props.mustValidate === true ? false : null;
-    const valid = invalid ?? (index === 0 || null);
-    return {
-      ...acc,
-      [index]: {
-        ...child.props,
-        form: {},
-        valid,
-        touched: index === 0
-      }
-    };
-  }, {});
+  const initialContext = arrayChildren.reduce(
+    (acc, child, index) => {
+      const invalid = "mustValidate" in child.props && child.props.mustValidate === true ? false : null;
+      const valid = invalid ?? (index === 0 || null);
+      return {
+        ...acc,
+        [index]: { ...child.props, form: {}, valid, touched: index === 0 }
+      };
+    },
+    {}
+  );
   const summaryRef = useRef();
-  const resizedRef = useRef({
-    height: 0,
-    width: 0
-  });
+  const resizedRef = useRef({ height: 0, width: 0 });
   const [containerRef, sizes] = useElementSize();
   const [summaryHeight, setSummaryHeight] = useState(0);
   const [summaryWidth, setSummaryWidth] = useState(0);
@@ -76,45 +63,67 @@ const HvWizardContent = ({
   }, []);
   useEffect(() => {
     if (tab && !context[tab]?.touched) {
-      const updatedContext = Object.entries(context).reduce((acc, [key, childState]) => ({
-        ...acc,
-        ...+key <= tab ? {
-          [key]: {
-            ...childState,
-            touched: true,
-            valid: childState?.valid ?? true
-          }
-        } : {
-          [key]: childState
-        }
-      }), {});
+      const updatedContext = Object.entries(context).reduce(
+        (acc, [key, childState]) => ({
+          ...acc,
+          ...+key <= tab ? {
+            [key]: {
+              ...childState,
+              touched: true,
+              valid: childState?.valid ?? true
+            }
+          } : { [key]: childState }
+        }),
+        {}
+      );
       setContext(updatedContext);
     }
   }, [tab, context, setContext]);
   const translateX = summaryWidth ? summaryWidth + 10 : 450;
-  return /* @__PURE__ */ jsxs("div", { className: classes.summaryRef, ref: (el) => {
-    containerRef(el);
-    if (el) {
-      summaryRef.current = el;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: classes.summaryRef,
+      ref: (el) => {
+        containerRef(el);
+        if (el) {
+          summaryRef.current = el;
+        }
+      },
+      children: [
+        summary !== null && /* @__PURE__ */ jsx("div", { className: classes.summarySticky, children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: classes.summaryContainer,
+            style: {
+              left: summaryLeft,
+              width: summaryWidth,
+              height: summaryHeight,
+              transform: `translate(${summary ? 0 : translateX}px, 0)`
+            },
+            children: summaryContent
+          }
+        ) }),
+        /* @__PURE__ */ jsx(
+          HvDialogContent,
+          {
+            className: cx(classes.contentContainer, {
+              [classes.fixedHeight]: fixedHeight
+            }),
+            indentContent: true,
+            children: /* @__PURE__ */ jsx(LoadingContainer, { hidden: !loading, children: React.Children.map(arrayChildren, (child, index) => {
+              if (index === tab) {
+                return React.cloneElement(child, {
+                  tab
+                });
+              }
+              return null;
+            }) })
+          }
+        )
+      ]
     }
-  }, children: [
-    summary !== null && /* @__PURE__ */ jsx("div", { className: classes.summarySticky, children: /* @__PURE__ */ jsx("div", { className: classes.summaryContainer, style: {
-      left: summaryLeft,
-      width: summaryWidth,
-      height: summaryHeight,
-      transform: `translate(${summary ? 0 : translateX}px, 0)`
-    }, children: summaryContent }) }),
-    /* @__PURE__ */ jsx(HvDialogContent, { className: cx(classes.contentContainer, {
-      [classes.fixedHeight]: fixedHeight
-    }), indentContent: true, children: /* @__PURE__ */ jsx(LoadingContainer, { hidden: !loading, children: React.Children.map(arrayChildren, (child, index) => {
-      if (index === tab) {
-        return React.cloneElement(child, {
-          tab
-        });
-      }
-      return null;
-    }) }) })
-  ] });
+  );
 };
 export {
   HvWizardContent,

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

@@ -1 +1 @@
-{"version":3,"file":"WizardContent.js","sources":["../../../../../src/components/Wizard/WizardContent/WizardContent.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvDialogContent,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useElementSize } from \"usehooks-ts\";\n\nimport { HvWizardContext, HvWizardTabs } from \"../WizardContext\";\nimport { staticClasses, useClasses } from \"./WizardContent.styles\";\nimport { LoadingContainer } from \"./LoadingContainer\";\n\nexport { staticClasses as wizardContentClasses };\n\nexport type HvWizardContentClasses = ExtractNames<typeof useClasses>;\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: classesProp,\n  fixedHeight = false,\n  loading = false,\n  children,\n  summaryContent,\n}: HvWizardContentProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\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, context, setContext]);\n\n  const translateX = summaryWidth ? summaryWidth + 10 : 450;\n\n  return (\n    <div\n      className={classes.summaryRef}\n      ref={(el) => {\n        containerRef(el);\n        if (el) {\n          summaryRef.current = el;\n        }\n      }}\n    >\n      {summary !== null && (\n        <div className={classes.summarySticky}>\n          <div\n            className={classes.summaryContainer}\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(classes.contentContainer, {\n          [classes.fixedHeight]: 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};\n"],"names":["DRAWER_PERCENTAGE","DRAWER_MIN_WIDTH","HvWizardContent","classes","classesProp","fixedHeight","loading","children","summaryContent","cx","useClasses","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","el","summarySticky","summaryContainer","left","transform","contentContainer","map","cloneElement"],"mappings":"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"}
+{"version":3,"file":"WizardContent.js","sources":["../../../../../src/components/Wizard/WizardContent/WizardContent.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\nimport React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvDialogContent,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useElementSize } from \"usehooks-ts\";\n\nimport { HvWizardContext, HvWizardTabs } from \"../WizardContext\";\nimport { staticClasses, useClasses } from \"./WizardContent.styles\";\nimport { LoadingContainer } from \"./LoadingContainer\";\n\nexport { staticClasses as wizardContentClasses };\n\nexport type HvWizardContentClasses = ExtractNames<typeof useClasses>;\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: classesProp,\n  fixedHeight = false,\n  loading = false,\n  children,\n  summaryContent,\n}: HvWizardContentProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\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, context, setContext]);\n\n  const translateX = summaryWidth ? summaryWidth + 10 : 450;\n\n  return (\n    <div\n      className={classes.summaryRef}\n      ref={(el) => {\n        containerRef(el);\n        if (el) {\n          summaryRef.current = el;\n        }\n      }}\n    >\n      {summary !== null && (\n        <div className={classes.summarySticky}>\n          <div\n            className={classes.summaryContainer}\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(classes.contentContainer, {\n          [classes.fixedHeight]: 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};\n"],"names":[],"mappings":"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"}

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

@@ -1,9 +1,6 @@
 import { theme } from "@hitachivantara/uikit-styles";
 import { createClasses } from "@hitachivantara/uikit-react-core";
-const {
-  staticClasses,
-  useClasses
-} = createClasses("HvWizardContent", {
+const { staticClasses, useClasses } = createClasses("HvWizardContent", {
   contentContainer: {
     position: "relative",
     padding: 20,