@hitachivantara/uikit-react-lab 5.41.20 → 5.42.0

package/dist/cjs/Flow/Node/Node.cjs

@@ -72,7 +72,7 @@ const HvFlowNode = ({
             onClick: () => setShowParams((p) => !p),
             "aria-label": showParams ? labels?.collapseLabel : labels?.expandLabel,
             ...expandParamsButtonProps,
-            children: showParams ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Up, { color: "base_dark" }) : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Down, { color: "base_dark" })
+            children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropDownXS, { rotate: showParams, color: "base_dark" })
           }
         )
       ] }),

package/dist/cjs/Flow/Sidebar/SidebarGroup/SidebarGroup.cjs

@@ -43,7 +43,7 @@ const HvFlowSidebarGroup = ({
           onClick: handleClick,
           "aria-expanded": opened,
           ...expandButtonProps,
-          children: opened ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Up, {}) : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Down, {})
+          children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropDownXS, { rotate: opened })
         }
       )
     ] }),

package/dist/cjs/Wizard/WizardContainer/WizardContainer.cjs

@@ -20,6 +20,7 @@ const HvWizardContainer = (props) => {
         paper: classes.paper
       },
       onClose: handleClose,
+      fullWidth: true,
       maxWidth: "lg",
       ...others,
       children

package/dist/cjs/Wizard/WizardContainer/WizardContainer.styles.cjs

@@ -5,11 +5,7 @@ const { staticClasses, useClasses } = uikitReactCore.createClasses(
   "HvWizardContainer",
   {
     root: {},
-    paper: {
-      width: "80%",
-      maxWidth: "80%",
-      maxHeight: "calc(100% - (2 * 80px))"
-    },
+    paper: {},
     closeButton: {
       display: "none"
     }

package/dist/cjs/Wizard/WizardTitle/WizardTitle.cjs

@@ -24,7 +24,7 @@ const HvWizardTitle = ({
   customStep = {}
 }) => {
   const { context, setSummary, tab, setTab } = react.useContext(WizardContext.default);
-  const { classes } = WizardTitle_styles.useClasses(classesProp);
+  const { classes, cx } = WizardTitle_styles.useClasses(classesProp);
   const [steps, setSteps] = react.useState([]);
   react.useEffect(() => {
     return () => {
@@ -46,15 +46,17 @@ const HvWizardTitle = ({
     );
     setSteps(updatedSteps);
   }, [context, tab, setTab]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs(
     uikitReactCore.HvDialogTitle,
     {
-      className: classes.headerContainer,
-      classes: {
-        messageContainer: classes.messageContainer
-      },
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.titleContainer, children: [
-        title && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { variant: "title3", component: "h3", children: title }),
+      className: cx(
+        classes.root,
+        classes.headerContainer,
+        classes.messageContainer,
+        classes.titleContainer
+      ),
+      children: [
+        title && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { variant: "title3", component: "div", children: title }),
         !!steps.length && /* @__PURE__ */ jsxRuntime.jsx(
           StepNavigation.HvStepNavigation,
           {
@@ -76,16 +78,17 @@ const HvWizardTitle = ({
           uikitReactCore.HvButton,
           {
             variant: "secondarySubtle",
-            className: classes.buttonWidth,
-            classes: {
-              root: classes.rootSummaryButton
-            },
+            className: cx(
+              classes.summaryButton,
+              classes.buttonWidth,
+              classes.rootSummaryButton
+            ),
             onClick: toggleSummary,
             startIcon: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Report, {}),
             children: `${labels.summary ?? "Summary"}`
           }
         )
-      ] })
+      ]
     }
   );
 };

package/dist/cjs/Wizard/WizardTitle/WizardTitle.styles.cjs

@@ -3,32 +3,25 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitReactCore = require("@hitachivantara/uikit-react-core");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const { staticClasses, useClasses } = uikitReactCore.createClasses("HvWizardTitle", {
-  messageContainer: {
-    "& > div": {
-      width: "100%"
-    }
-  },
-  titleContainer: {
-    display: "flex",
-    alignItems: "center",
+  root: {
+    backgroundColor: uikitStyles.theme.colors.atmo2,
     justifyContent: "space-between",
-    gap: uikitStyles.theme.spacing(1),
-    width: "100%"
-  },
-  buttonWidth: {
-    width: 120
+    paddingRight: uikitStyles.theme.space.sm
   },
-  rootSummaryButton: {
+  /** @deprecated use `classes.root` */
+  headerContainer: {},
+  /** @deprecated use `classes.root` */
+  messageContainer: {},
+  /** @deprecated use `classes.root` */
+  titleContainer: {},
+  summaryButton: {
+    width: 120,
     paddingRight: 18
   },
-  headerContainer: {
-    backgroundColor: uikitStyles.theme.colors.atmo2,
-    "& h6": {
-      fontSize: "16px",
-      fontWeight: "bold",
-      letterSpacing: 0
-    }
-  },
+  /** @deprecated use `classes.summaryButton` */
+  buttonWidth: {},
+  /** @deprecated use `classes.summaryButton` */
+  rootSummaryButton: {},
   stepContainer: {
     margin: "auto"
   }

package/dist/esm/Flow/Node/Node.js

@@ -1,7 +1,7 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useState } from "react";
 import { useLabels, theme, HvTooltip, HvButton, HvTypography, HvInlineEditor, HvActionsGeneric } from "@hitachivantara/uikit-react-core";
-import { Info, Up, Down } from "@hitachivantara/uikit-react-icons";
+import { Info, DropDownXS } from "@hitachivantara/uikit-react-icons";
 import { HvFlowBaseNode } from "./BaseNode.js";
 import { useClasses } from "./Node.styles.js";
 import { staticClasses } from "./Node.styles.js";
@@ -71,7 +71,7 @@ const HvFlowNode = ({
             onClick: () => setShowParams((p) => !p),
             "aria-label": showParams ? labels?.collapseLabel : labels?.expandLabel,
             ...expandParamsButtonProps,
-            children: showParams ? /* @__PURE__ */ jsx(Up, { color: "base_dark" }) : /* @__PURE__ */ jsx(Down, { color: "base_dark" })
+            children: /* @__PURE__ */ jsx(DropDownXS, { rotate: showParams, color: "base_dark" })
           }
         )
       ] }),

package/dist/esm/Flow/Node/Node.js.map

@@ -1 +1 @@
-{"version":3,"file":"Node.js","sources":["../../../../src/Flow/Node/Node.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport {\n  ExtractNames,\n  HvActionsGeneric,\n  HvActionsGenericProps,\n  HvButton,\n  HvButtonProps,\n  HvInlineEditor,\n  HvTooltip,\n  HvTypography,\n  theme,\n  useLabels,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useFlowContext, useFlowNode, useFlowNodeUtils } from \"../hooks\";\nimport { HvFlowNodeParam } from \"../types\";\nimport { HvFlowBaseNode, HvFlowBaseNodeProps } from \"./BaseNode\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport { ParamRenderer } from \"./Parameters\";\n\nexport { staticClasses as flowNodeClasses };\n\nexport type HvFlowNodeClasses = ExtractNames<typeof useClasses>;\n\nconst DEFAULT_LABELS = {\n  collapseLabel: \"Collapse\",\n  expandLabel: \"Expand\",\n};\n\nexport interface HvFlowNodeProps<T = any> extends HvFlowBaseNodeProps<T> {\n  /** Node description. */\n  description?: string;\n  /** Node actions. */\n  actions?: HvActionsGenericProps[\"actions\"];\n  /**\n   * Node action callback.\n   *\n   * @deprecated Use `onAction` instead.\n   * */\n  actionCallback?: HvActionsGenericProps[\"actionsCallback\"]; // TODO - remove in v6\n  /** Node action callback. */\n  onAction?: HvActionsGenericProps[\"onAction\"];\n  /** Whether the actions should be all icon buttons when visible. @default true */\n  actionsIconOnly?: HvActionsGenericProps[\"iconOnly\"];\n  /** Node maximum number of actions visible. */\n  maxVisibleActions?: HvActionsGenericProps[\"maxVisibleActions\"];\n  /** Node subtitle - this is typically the node \"name\" */\n  subtitle?: string;\n  /** Node group ID */\n  groupId?: string;\n  /** Node expanded */\n  expanded?: boolean;\n  /** Node parameters */\n  params?: HvFlowNodeParam[];\n  /** Props to be passed to the expand parameters button. */\n  expandParamsButtonProps?: HvButtonProps;\n  /** Labels used on the node. */\n  labels?: HvFlowBaseNodeProps[\"labels\"] & Partial<typeof DEFAULT_LABELS>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowNodeClasses;\n  /** Remove the ability to customize the label of the Node */\n  disableInlineEdit?: boolean;\n}\n\nexport const HvFlowNode = ({\n  id,\n  type,\n  headerItems,\n  actions,\n  actionCallback, // TODO - remove in v6\n  onAction,\n  maxVisibleActions = 1,\n  expanded = false,\n  actionsIconOnly = true,\n  params,\n  classes: classesProp,\n  labels: labelsProps,\n  children,\n  expandParamsButtonProps,\n  disableInlineEdit,\n  title: titleProp,\n  subtitle: subtitleProp,\n  description,\n  groupId,\n  color: colorProp,\n  icon: iconProp,\n  ...props\n}: HvFlowNodeProps<unknown>) => {\n  const { classes } = useClasses(classesProp);\n  const [showParams, setShowParams] = useState(expanded);\n  const { nodeGroups, defaultActions } = useFlowContext();\n  const labels = useLabels(DEFAULT_LABELS, labelsProps);\n  const node = useFlowNode();\n  const { setNodeData } = useFlowNodeUtils();\n\n  const inlineEditorWidth =\n    actions === undefined ||\n    (Array.isArray(actions) && actions.length === 0) ||\n    maxVisibleActions === 0\n      ? \"100%\"\n      : `calc(200px - calc(${maxVisibleActions} * 32px + ${theme.spacing(2)}))`;\n\n  const nodeGroup = (groupId && nodeGroups && nodeGroups[groupId]) || undefined;\n\n  const title = titleProp || nodeGroup?.label;\n  const icon = iconProp || nodeGroup?.icon;\n  const color = colorProp || nodeGroup?.color;\n  const subtitle = subtitleProp || node?.data.nodeLabel;\n\n  const hasParams = !!(params && params.length > 0);\n\n  return (\n    <HvFlowBaseNode\n      id={id}\n      type={type}\n      title={title}\n      icon={icon}\n      color={color}\n      nodeActions={defaultActions}\n      classes={classes}\n      headerItems={\n        <>\n          {headerItems}\n          {description && (\n            <HvTooltip title={description}>\n              <Info color=\"base_dark\" />\n            </HvTooltip>\n          )}\n          {hasParams && (\n            <HvButton\n              icon\n              overrideIconColors={false}\n              onClick={() => setShowParams((p) => !p)}\n              aria-label={\n                showParams ? labels?.collapseLabel : labels?.expandLabel\n              }\n              {...expandParamsButtonProps}\n            >\n              {showParams ? (\n                <Up color=\"base_dark\" />\n              ) : (\n                <Down color=\"base_dark\" />\n              )}\n            </HvButton>\n          )}\n        </>\n      }\n      labels={labels as HvFlowNodeProps[\"labels\"]}\n      {...props}\n    >\n      {(subtitle || actions) && (\n        <div className={classes.subtitleContainer}>\n          {subtitle &&\n            (disableInlineEdit ? (\n              <HvTypography className={classes.subtitle}>\n                {subtitle}\n              </HvTypography>\n            ) : (\n              <HvInlineEditor\n                defaultValue={subtitle}\n                showIcon\n                style={{ width: inlineEditorWidth }}\n                classes={{\n                  root: classes.inlineEditRoot,\n                  button: classes.inlineEditButton,\n                }}\n                onBlur={(evt, value) =>\n                  setNodeData((prev) => ({ ...prev, nodeLabel: value }))\n                }\n              />\n            ))}\n          {actions && (\n            <HvActionsGeneric\n              className={classes.actions}\n              classes={{ button: classes.actionsButton }}\n              actions={actions}\n              actionsCallback={actionCallback}\n              onAction={onAction}\n              maxVisibleActions={maxVisibleActions}\n              iconOnly={actionsIconOnly}\n            />\n          )}\n        </div>\n      )}\n      {children}\n      {showParams && params && (\n        <div className={classes.paramsContainer}>\n          <ParamRenderer params={params} data={node?.data} />\n        </div>\n      )}\n    </HvFlowBaseNode>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Node.js","sources":["../../../../src/Flow/Node/Node.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport {\n  ExtractNames,\n  HvActionsGeneric,\n  HvActionsGenericProps,\n  HvButton,\n  HvButtonProps,\n  HvInlineEditor,\n  HvTooltip,\n  HvTypography,\n  theme,\n  useLabels,\n} from \"@hitachivantara/uikit-react-core\";\nimport { DropDownXS, Info } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useFlowContext, useFlowNode, useFlowNodeUtils } from \"../hooks\";\nimport { HvFlowNodeParam } from \"../types\";\nimport { HvFlowBaseNode, HvFlowBaseNodeProps } from \"./BaseNode\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport { ParamRenderer } from \"./Parameters\";\n\nexport { staticClasses as flowNodeClasses };\n\nexport type HvFlowNodeClasses = ExtractNames<typeof useClasses>;\n\nconst DEFAULT_LABELS = {\n  collapseLabel: \"Collapse\",\n  expandLabel: \"Expand\",\n};\n\nexport interface HvFlowNodeProps<T = any> extends HvFlowBaseNodeProps<T> {\n  /** Node description. */\n  description?: string;\n  /** Node actions. */\n  actions?: HvActionsGenericProps[\"actions\"];\n  /**\n   * Node action callback.\n   *\n   * @deprecated Use `onAction` instead.\n   * */\n  actionCallback?: HvActionsGenericProps[\"actionsCallback\"]; // TODO - remove in v6\n  /** Node action callback. */\n  onAction?: HvActionsGenericProps[\"onAction\"];\n  /** Whether the actions should be all icon buttons when visible. @default true */\n  actionsIconOnly?: HvActionsGenericProps[\"iconOnly\"];\n  /** Node maximum number of actions visible. */\n  maxVisibleActions?: HvActionsGenericProps[\"maxVisibleActions\"];\n  /** Node subtitle - this is typically the node \"name\" */\n  subtitle?: string;\n  /** Node group ID */\n  groupId?: string;\n  /** Node expanded */\n  expanded?: boolean;\n  /** Node parameters */\n  params?: HvFlowNodeParam[];\n  /** Props to be passed to the expand parameters button. */\n  expandParamsButtonProps?: HvButtonProps;\n  /** Labels used on the node. */\n  labels?: HvFlowBaseNodeProps[\"labels\"] & Partial<typeof DEFAULT_LABELS>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowNodeClasses;\n  /** Remove the ability to customize the label of the Node */\n  disableInlineEdit?: boolean;\n}\n\nexport const HvFlowNode = ({\n  id,\n  type,\n  headerItems,\n  actions,\n  actionCallback, // TODO - remove in v6\n  onAction,\n  maxVisibleActions = 1,\n  expanded = false,\n  actionsIconOnly = true,\n  params,\n  classes: classesProp,\n  labels: labelsProps,\n  children,\n  expandParamsButtonProps,\n  disableInlineEdit,\n  title: titleProp,\n  subtitle: subtitleProp,\n  description,\n  groupId,\n  color: colorProp,\n  icon: iconProp,\n  ...props\n}: HvFlowNodeProps<unknown>) => {\n  const { classes } = useClasses(classesProp);\n  const [showParams, setShowParams] = useState(expanded);\n  const { nodeGroups, defaultActions } = useFlowContext();\n  const labels = useLabels(DEFAULT_LABELS, labelsProps);\n  const node = useFlowNode();\n  const { setNodeData } = useFlowNodeUtils();\n\n  const inlineEditorWidth =\n    actions === undefined ||\n    (Array.isArray(actions) && actions.length === 0) ||\n    maxVisibleActions === 0\n      ? \"100%\"\n      : `calc(200px - calc(${maxVisibleActions} * 32px + ${theme.spacing(2)}))`;\n\n  const nodeGroup = (groupId && nodeGroups && nodeGroups[groupId]) || undefined;\n\n  const title = titleProp || nodeGroup?.label;\n  const icon = iconProp || nodeGroup?.icon;\n  const color = colorProp || nodeGroup?.color;\n  const subtitle = subtitleProp || node?.data.nodeLabel;\n\n  const hasParams = !!(params && params.length > 0);\n\n  return (\n    <HvFlowBaseNode\n      id={id}\n      type={type}\n      title={title}\n      icon={icon}\n      color={color}\n      nodeActions={defaultActions}\n      classes={classes}\n      headerItems={\n        <>\n          {headerItems}\n          {description && (\n            <HvTooltip title={description}>\n              <Info color=\"base_dark\" />\n            </HvTooltip>\n          )}\n          {hasParams && (\n            <HvButton\n              icon\n              overrideIconColors={false}\n              onClick={() => setShowParams((p) => !p)}\n              aria-label={\n                showParams ? labels?.collapseLabel : labels?.expandLabel\n              }\n              {...expandParamsButtonProps}\n            >\n              <DropDownXS rotate={showParams} color=\"base_dark\" />\n            </HvButton>\n          )}\n        </>\n      }\n      labels={labels as HvFlowNodeProps[\"labels\"]}\n      {...props}\n    >\n      {(subtitle || actions) && (\n        <div className={classes.subtitleContainer}>\n          {subtitle &&\n            (disableInlineEdit ? (\n              <HvTypography className={classes.subtitle}>\n                {subtitle}\n              </HvTypography>\n            ) : (\n              <HvInlineEditor\n                defaultValue={subtitle}\n                showIcon\n                style={{ width: inlineEditorWidth }}\n                classes={{\n                  root: classes.inlineEditRoot,\n                  button: classes.inlineEditButton,\n                }}\n                onBlur={(evt, value) =>\n                  setNodeData((prev) => ({ ...prev, nodeLabel: value }))\n                }\n              />\n            ))}\n          {actions && (\n            <HvActionsGeneric\n              className={classes.actions}\n              classes={{ button: classes.actionsButton }}\n              actions={actions}\n              actionsCallback={actionCallback}\n              onAction={onAction}\n              maxVisibleActions={maxVisibleActions}\n              iconOnly={actionsIconOnly}\n            />\n          )}\n        </div>\n      )}\n      {children}\n      {showParams && params && (\n        <div className={classes.paramsContainer}>\n          <ParamRenderer params={params} data={node?.data} />\n        </div>\n      )}\n    </HvFlowBaseNode>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAyBA,MAAM,iBAAiB;AAAA,EACrB,eAAe;AAAA,EACf,aAAa;AACf;AAqCO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,kBAAkB;AAAA,EAClB;AAAA,EACA,SAAS;AAAA,EACT,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,MAAM;AAAA,EACN,GAAG;AACL,MAAgC;AAC9B,QAAM,EAAE,QAAA,IAAY,WAAW,WAAW;AAC1C,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,QAAQ;AACrD,QAAM,EAAE,YAAY,eAAe,IAAI,eAAe;AAChD,QAAA,SAAS,UAAU,gBAAgB,WAAW;AACpD,QAAM,OAAO,YAAY;AACnB,QAAA,EAAE,YAAY,IAAI,iBAAiB;AAEzC,QAAM,oBACJ,YAAY,UACX,MAAM,QAAQ,OAAO,KAAK,QAAQ,WAAW,KAC9C,sBAAsB,IAClB,SACA,qBAAqB,iBAAiB,aAAa,MAAM,QAAQ,CAAC,CAAC;AAEzE,QAAM,YAAa,WAAW,cAAc,WAAW,OAAO,KAAM;AAE9D,QAAA,QAAQ,aAAa,WAAW;AAChC,QAAA,OAAO,YAAY,WAAW;AAC9B,QAAA,QAAQ,aAAa,WAAW;AAChC,QAAA,WAAW,gBAAgB,MAAM,KAAK;AAE5C,QAAM,YAAY,CAAC,EAAE,UAAU,OAAO,SAAS;AAG7C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MACA,aAEK,qBAAA,UAAA,EAAA,UAAA;AAAA,QAAA;AAAA,QACA,mCACE,WAAU,EAAA,OAAO,aAChB,UAAC,oBAAA,MAAA,EAAK,OAAM,YAAA,CAAY,EAC1B,CAAA;AAAA,QAED,aACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAI;AAAA,YACJ,oBAAoB;AAAA,YACpB,SAAS,MAAM,cAAc,CAAC,MAAM,CAAC,CAAC;AAAA,YACtC,cACE,aAAa,QAAQ,gBAAgB,QAAQ;AAAA,YAE9C,GAAG;AAAA,YAEJ,UAAC,oBAAA,YAAA,EAAW,QAAQ,YAAY,OAAM,YAAY,CAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACpD,GAEJ;AAAA,MAEF;AAAA,MACC,GAAG;AAAA,MAEF,UAAA;AAAA,SAAA,YAAY,YACZ,qBAAC,OAAI,EAAA,WAAW,QAAQ,mBACrB,UAAA;AAAA,UAAA,aACE,oBACE,oBAAA,cAAA,EAAa,WAAW,QAAQ,UAC9B,oBACH,IAEA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,cAAc;AAAA,cACd,UAAQ;AAAA,cACR,OAAO,EAAE,OAAO,kBAAkB;AAAA,cAClC,SAAS;AAAA,gBACP,MAAM,QAAQ;AAAA,gBACd,QAAQ,QAAQ;AAAA,cAClB;AAAA,cACA,QAAQ,CAAC,KAAK,UACZ,YAAY,CAAC,UAAU,EAAE,GAAG,MAAM,WAAW,QAAQ;AAAA,YAAA;AAAA,UAAA;AAAA,UAI5D,WACC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,QAAQ;AAAA,cACnB,SAAS,EAAE,QAAQ,QAAQ,cAAc;AAAA,cACzC;AAAA,cACA,iBAAiB;AAAA,cACjB;AAAA,cACA;AAAA,cACA,UAAU;AAAA,YAAA;AAAA,UAAA;AAAA,QACZ,GAEJ;AAAA,QAED;AAAA,QACA,cAAc,UACZ,oBAAA,OAAA,EAAI,WAAW,QAAQ,iBACtB,UAAA,oBAAC,eAAc,EAAA,QAAgB,MAAM,MAAM,MAAM,EACnD,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ;AAEJ;"}

package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroup.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useMemo, useCallback } from "react";
 import { HvTypography, HvButton } from "@hitachivantara/uikit-react-core";
-import { Up, Down } from "@hitachivantara/uikit-react-icons";
+import { DropDownXS } from "@hitachivantara/uikit-react-icons";
 import { getColor } from "@hitachivantara/uikit-styles";
 import { useClasses } from "./SidebarGroup.styles.js";
 import { staticClasses } from "./SidebarGroup.styles.js";
@@ -42,7 +42,7 @@ const HvFlowSidebarGroup = ({
           onClick: handleClick,
           "aria-expanded": opened,
           ...expandButtonProps,
-          children: opened ? /* @__PURE__ */ jsx(Up, {}) : /* @__PURE__ */ jsx(Down, {})
+          children: /* @__PURE__ */ jsx(DropDownXS, { rotate: opened })
         }
       )
     ] }),

package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarGroup.js","sources":["../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroup.tsx"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\nimport {\n  ExtractNames,\n  HvButton,\n  HvButtonProps,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\nimport { getColor } from \"@hitachivantara/uikit-styles\";\n\nimport { useFlowContext } from \"../../hooks\";\nimport { HvFlowNodeGroup } from \"../../types\";\nimport { staticClasses, useClasses } from \"./SidebarGroup.styles\";\nimport {\n  HvFlowDraggableSidebarGroupItem,\n  HvFlowDraggableSidebarGroupItemProps,\n} from \"./SidebarGroupItem\";\n\nexport { staticClasses as flowSidebarGroupClasses };\n\nexport type HvFlowSidebarGroupClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowSidebarGroupProps extends HvFlowNodeGroup {\n  /** Group id. */\n  id: string;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowSidebarGroupClasses;\n  /** Expand button props. */\n  expandButtonProps?: HvButtonProps;\n  /** Item group props. */\n  itemProps?: Partial<HvFlowDraggableSidebarGroupItemProps>;\n}\n\nexport const HvFlowSidebarGroup = ({\n  id,\n  label,\n  items = [],\n  color,\n  description,\n  icon,\n  expandButtonProps,\n  classes: classesProp,\n  itemProps,\n}: HvFlowSidebarGroupProps) => {\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const { expandedNodeGroups, setExpandedNodeGroups } = useFlowContext();\n\n  const opened = useMemo(\n    () => !!expandedNodeGroups?.find((group) => group === id),\n    [expandedNodeGroups, id],\n  );\n\n  const handleClick = useCallback(() => {\n    setExpandedNodeGroups?.((prev) =>\n      opened ? prev.filter((group) => id !== group) : [...prev, id],\n    );\n  }, [id, opened, setExpandedNodeGroups]);\n\n  return (\n    <li className={cx(css({ borderColor: getColor(color) }), classes.root)}>\n      <div className={classes.titleContainer}>\n        <div className={classes.labelContainer}>\n          <div className={classes.icon} role=\"presentation\">\n            {icon}\n          </div>\n          <HvTypography component=\"p\" variant=\"title4\">\n            {Object.keys(items).length > 1\n              ? `${label} (${Object.keys(items).length})`\n              : label}\n          </HvTypography>\n        </div>\n        <HvButton\n          icon\n          onClick={handleClick}\n          aria-expanded={opened}\n          {...expandButtonProps}\n        >\n          {opened ? <Up /> : <Down />}\n        </HvButton>\n      </div>\n      {description && (\n        <div className={classes.descriptionContainer}>\n          <HvTypography>{description}</HvTypography>\n        </div>\n      )}\n      {opened && (\n        <div className={classes.itemsContainer}>\n          {Object.entries(items).map(([itemId, item]) => (\n            <HvFlowDraggableSidebarGroupItem\n              key={itemId}\n              {...itemProps}\n              {...item}\n            />\n          ))}\n        </div>\n      )}\n    </li>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAiCO,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA,QAAQ,CAAC;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AACF,MAA+B;AAC7B,QAAM,EAAE,SAAS,IAAI,IAAI,IAAI,WAAW,WAAW;AAEnD,QAAM,EAAE,oBAAoB,sBAAsB,IAAI,eAAe;AAErE,QAAM,SAAS;AAAA,IACb,MAAM,CAAC,CAAC,oBAAoB,KAAK,CAAC,UAAU,UAAU,EAAE;AAAA,IACxD,CAAC,oBAAoB,EAAE;AAAA,EACzB;AAEM,QAAA,cAAc,YAAY,MAAM;AACpC;AAAA,MAAwB,CAAC,SACvB,SAAS,KAAK,OAAO,CAAC,UAAU,OAAO,KAAK,IAAI,CAAC,GAAG,MAAM,EAAE;AAAA,IAC9D;AAAA,EACC,GAAA,CAAC,IAAI,QAAQ,qBAAqB,CAAC;AAEtC,SACG,qBAAA,MAAA,EAAG,WAAW,GAAG,IAAI,EAAE,aAAa,SAAS,KAAK,EAAE,CAAC,GAAG,QAAQ,IAAI,GACnE,UAAA;AAAA,IAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,gBACtB,UAAA;AAAA,MAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,gBACtB,UAAA;AAAA,QAAA,oBAAC,SAAI,WAAW,QAAQ,MAAM,MAAK,gBAChC,UACH,MAAA;AAAA,QACA,oBAAC,gBAAa,WAAU,KAAI,SAAQ,UACjC,UAAA,OAAO,KAAK,KAAK,EAAE,SAAS,IACzB,GAAG,KAAK,KAAK,OAAO,KAAK,KAAK,EAAE,MAAM,MACtC,MACN,CAAA;AAAA,MAAA,GACF;AAAA,MACA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAI;AAAA,UACJ,SAAS;AAAA,UACT,iBAAe;AAAA,UACd,GAAG;AAAA,UAEH,UAAS,SAAA,oBAAC,IAAG,CAAA,CAAA,wBAAM,MAAK,CAAA,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAC3B,GACF;AAAA,IACC,mCACE,OAAI,EAAA,WAAW,QAAQ,sBACtB,UAAA,oBAAC,cAAc,EAAA,UAAA,YAAA,CAAY,EAC7B,CAAA;AAAA,IAED,UACC,oBAAC,OAAI,EAAA,WAAW,QAAQ,gBACrB,UAAA,OAAO,QAAQ,KAAK,EAAE,IAAI,CAAC,CAAC,QAAQ,IAAI,MACvC;AAAA,MAAC;AAAA,MAAA;AAAA,QAEE,GAAG;AAAA,QACH,GAAG;AAAA,MAAA;AAAA,MAFC;AAAA,IAAA,CAIR,EACH,CAAA;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"SidebarGroup.js","sources":["../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroup.tsx"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\nimport {\n  ExtractNames,\n  HvButton,\n  HvButtonProps,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { DropDownXS } from \"@hitachivantara/uikit-react-icons\";\nimport { getColor } from \"@hitachivantara/uikit-styles\";\n\nimport { useFlowContext } from \"../../hooks\";\nimport { HvFlowNodeGroup } from \"../../types\";\nimport { staticClasses, useClasses } from \"./SidebarGroup.styles\";\nimport {\n  HvFlowDraggableSidebarGroupItem,\n  HvFlowDraggableSidebarGroupItemProps,\n} from \"./SidebarGroupItem\";\n\nexport { staticClasses as flowSidebarGroupClasses };\n\nexport type HvFlowSidebarGroupClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowSidebarGroupProps extends HvFlowNodeGroup {\n  /** Group id. */\n  id: string;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowSidebarGroupClasses;\n  /** Expand button props. */\n  expandButtonProps?: HvButtonProps;\n  /** Item group props. */\n  itemProps?: Partial<HvFlowDraggableSidebarGroupItemProps>;\n}\n\nexport const HvFlowSidebarGroup = ({\n  id,\n  label,\n  items = [],\n  color,\n  description,\n  icon,\n  expandButtonProps,\n  classes: classesProp,\n  itemProps,\n}: HvFlowSidebarGroupProps) => {\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const { expandedNodeGroups, setExpandedNodeGroups } = useFlowContext();\n\n  const opened = useMemo(\n    () => !!expandedNodeGroups?.find((group) => group === id),\n    [expandedNodeGroups, id],\n  );\n\n  const handleClick = useCallback(() => {\n    setExpandedNodeGroups?.((prev) =>\n      opened ? prev.filter((group) => id !== group) : [...prev, id],\n    );\n  }, [id, opened, setExpandedNodeGroups]);\n\n  return (\n    <li className={cx(css({ borderColor: getColor(color) }), classes.root)}>\n      <div className={classes.titleContainer}>\n        <div className={classes.labelContainer}>\n          <div className={classes.icon} role=\"presentation\">\n            {icon}\n          </div>\n          <HvTypography component=\"p\" variant=\"title4\">\n            {Object.keys(items).length > 1\n              ? `${label} (${Object.keys(items).length})`\n              : label}\n          </HvTypography>\n        </div>\n        <HvButton\n          icon\n          onClick={handleClick}\n          aria-expanded={opened}\n          {...expandButtonProps}\n        >\n          <DropDownXS rotate={opened} />\n        </HvButton>\n      </div>\n      {description && (\n        <div className={classes.descriptionContainer}>\n          <HvTypography>{description}</HvTypography>\n        </div>\n      )}\n      {opened && (\n        <div className={classes.itemsContainer}>\n          {Object.entries(items).map(([itemId, item]) => (\n            <HvFlowDraggableSidebarGroupItem\n              key={itemId}\n              {...itemProps}\n              {...item}\n            />\n          ))}\n        </div>\n      )}\n    </li>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAiCO,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA,QAAQ,CAAC;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AACF,MAA+B;AAC7B,QAAM,EAAE,SAAS,IAAI,IAAI,IAAI,WAAW,WAAW;AAEnD,QAAM,EAAE,oBAAoB,sBAAsB,IAAI,eAAe;AAErE,QAAM,SAAS;AAAA,IACb,MAAM,CAAC,CAAC,oBAAoB,KAAK,CAAC,UAAU,UAAU,EAAE;AAAA,IACxD,CAAC,oBAAoB,EAAE;AAAA,EACzB;AAEM,QAAA,cAAc,YAAY,MAAM;AACpC;AAAA,MAAwB,CAAC,SACvB,SAAS,KAAK,OAAO,CAAC,UAAU,OAAO,KAAK,IAAI,CAAC,GAAG,MAAM,EAAE;AAAA,IAC9D;AAAA,EACC,GAAA,CAAC,IAAI,QAAQ,qBAAqB,CAAC;AAEtC,SACG,qBAAA,MAAA,EAAG,WAAW,GAAG,IAAI,EAAE,aAAa,SAAS,KAAK,EAAE,CAAC,GAAG,QAAQ,IAAI,GACnE,UAAA;AAAA,IAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,gBACtB,UAAA;AAAA,MAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,gBACtB,UAAA;AAAA,QAAA,oBAAC,SAAI,WAAW,QAAQ,MAAM,MAAK,gBAChC,UACH,MAAA;AAAA,QACA,oBAAC,gBAAa,WAAU,KAAI,SAAQ,UACjC,UAAA,OAAO,KAAK,KAAK,EAAE,SAAS,IACzB,GAAG,KAAK,KAAK,OAAO,KAAK,KAAK,EAAE,MAAM,MACtC,MACN,CAAA;AAAA,MAAA,GACF;AAAA,MACA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAI;AAAA,UACJ,SAAS;AAAA,UACT,iBAAe;AAAA,UACd,GAAG;AAAA,UAEJ,UAAA,oBAAC,YAAW,EAAA,QAAQ,OAAQ,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAC9B,GACF;AAAA,IACC,mCACE,OAAI,EAAA,WAAW,QAAQ,sBACtB,UAAA,oBAAC,cAAc,EAAA,UAAA,YAAA,CAAY,EAC7B,CAAA;AAAA,IAED,UACC,oBAAC,OAAI,EAAA,WAAW,QAAQ,gBACrB,UAAA,OAAO,QAAQ,KAAK,EAAE,IAAI,CAAC,CAAC,QAAQ,IAAI,MACvC;AAAA,MAAC;AAAA,MAAA;AAAA,QAEE,GAAG;AAAA,QACH,GAAG;AAAA,MAAA;AAAA,MAFC;AAAA,IAAA,CAIR,EACH,CAAA;AAAA,EAAA,GAEJ;AAEJ;"}

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

@@ -19,6 +19,7 @@ const HvWizardContainer = (props) => {
         paper: classes.paper
       },
       onClose: handleClose,
+      fullWidth: true,
       maxWidth: "lg",
       ...others,
       children

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

@@ -1 +1 @@
-{"version":3,"file":"WizardContainer.js","sources":["../../../../src/Wizard/WizardContainer/WizardContainer.tsx"],"sourcesContent":["import {\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: HvDialogProps[\"onClose\"];\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    children,\n    handleClose,\n    ...others\n  } = useDefaultProps(\"HvWizardContainer\", props);\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <HvDialog\n      classes={{\n        root: classes.root,\n        closeButton: classes.closeButton,\n        paper: classes.paper,\n      }}\n      onClose={handleClose}\n      maxWidth=\"lg\"\n      {...others}\n    >\n      {children}\n    </HvDialog>\n  );\n};\n"],"names":[],"mappings":";;;;AAyBa,MAAA,oBAAoB,CAAC,UAAkC;AAC5D,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;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,MAAM,QAAQ;AAAA,QACd,aAAa,QAAQ;AAAA,QACrB,OAAO,QAAQ;AAAA,MACjB;AAAA,MACA,SAAS;AAAA,MACT,UAAS;AAAA,MACR,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EACH;AAEJ;"}
+{"version":3,"file":"WizardContainer.js","sources":["../../../../src/Wizard/WizardContainer/WizardContainer.tsx"],"sourcesContent":["import {\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: HvDialogProps[\"onClose\"];\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    children,\n    handleClose,\n    ...others\n  } = useDefaultProps(\"HvWizardContainer\", props);\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <HvDialog\n      classes={{\n        root: classes.root,\n        closeButton: classes.closeButton,\n        paper: classes.paper,\n      }}\n      onClose={handleClose}\n      fullWidth\n      maxWidth=\"lg\"\n      {...others}\n    >\n      {children}\n    </HvDialog>\n  );\n};\n"],"names":[],"mappings":";;;;AAyBa,MAAA,oBAAoB,CAAC,UAAkC;AAC5D,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;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,MAAM,QAAQ;AAAA,QACd,aAAa,QAAQ;AAAA,QACrB,OAAO,QAAQ;AAAA,MACjB;AAAA,MACA,SAAS;AAAA,MACT,WAAS;AAAA,MACT,UAAS;AAAA,MACR,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EACH;AAEJ;"}

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

@@ -3,11 +3,7 @@ const { staticClasses, useClasses } = createClasses(
   "HvWizardContainer",
   {
     root: {},
-    paper: {
-      width: "80%",
-      maxWidth: "80%",
-      maxHeight: "calc(100% - (2 * 80px))"
-    },
+    paper: {},
     closeButton: {
       display: "none"
     }

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

@@ -1 +1 @@
-{"version":3,"file":"WizardContainer.styles.js","sources":["../../../../src/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,IAAA;AAAA,EACX;AAEJ;"}
+{"version":3,"file":"WizardContainer.styles.js","sources":["../../../../src/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    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,CAAC;AAAA,IACR,aAAa;AAAA,MACX,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ;"}

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

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { useContext, useState, useEffect } from "react";
 import { HvDialogTitle, HvTypography, HvButton } from "@hitachivantara/uikit-react-core";
 import { Report } from "@hitachivantara/uikit-react-icons";
@@ -23,7 +23,7 @@ const HvWizardTitle = ({
   customStep = {}
 }) => {
   const { context, setSummary, tab, setTab } = useContext(HvWizardContext);
-  const { classes } = useClasses(classesProp);
+  const { classes, cx } = useClasses(classesProp);
   const [steps, setSteps] = useState([]);
   useEffect(() => {
     return () => {
@@ -45,15 +45,17 @@ const HvWizardTitle = ({
     );
     setSteps(updatedSteps);
   }, [context, tab, setTab]);
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(
     HvDialogTitle,
     {
-      className: classes.headerContainer,
-      classes: {
-        messageContainer: classes.messageContainer
-      },
-      children: /* @__PURE__ */ jsxs("div", { className: classes.titleContainer, children: [
-        title && /* @__PURE__ */ jsx(HvTypography, { variant: "title3", component: "h3", children: title }),
+      className: cx(
+        classes.root,
+        classes.headerContainer,
+        classes.messageContainer,
+        classes.titleContainer
+      ),
+      children: [
+        title && /* @__PURE__ */ jsx(HvTypography, { variant: "title3", component: "div", children: title }),
         !!steps.length && /* @__PURE__ */ jsx(
           HvStepNavigation,
           {
@@ -75,16 +77,17 @@ const HvWizardTitle = ({
           HvButton,
           {
             variant: "secondarySubtle",
-            className: classes.buttonWidth,
-            classes: {
-              root: classes.rootSummaryButton
-            },
+            className: cx(
+              classes.summaryButton,
+              classes.buttonWidth,
+              classes.rootSummaryButton
+            ),
             onClick: toggleSummary,
             startIcon: /* @__PURE__ */ jsx(Report, {}),
             children: `${labels.summary ?? "Summary"}`
           }
         )
-      ] })
+      ]
     }
   );
 };

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

@@ -1 +1 @@
-{"version":3,"file":"WizardTitle.js","sources":["../../../../src/Wizard/WizardTitle/WizardTitle.tsx"],"sourcesContent":["import { useContext, useEffect, useState } from \"react\";\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvButton,\n  HvDialogTitle,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Report } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvStepNavigation, HvStepNavigationProps } from \"../../StepNavigation\";\nimport { HvStepProps } from \"../../StepNavigation/DefaultNavigation\";\nimport { HvWizardContext, HvWizardTab } from \"../WizardContext\";\nimport { staticClasses, useClasses } from \"./WizardTitle.styles\";\n\nexport { staticClasses as wizardTitleClasses };\n\nexport type HvWizardTitleClasses = ExtractNames<typeof useClasses>;\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 = (\n  state: HvWizardTab | undefined,\n  currentTab: number,\n  index: number,\n) => {\n  if (state?.loading) return \"Pending\";\n  if (index === currentTab) return \"Current\";\n  if (state?.valid) return \"Completed\";\n  if (state?.disabled) return \"Disabled\";\n  if (state?.valid === null) return \"Enabled\";\n  if (state?.touched && state?.valid === false) return \"Failed\";\n  return \"Enabled\";\n};\n\nexport const HvWizardTitle = ({\n  title,\n  hasSummary = false,\n  labels = {},\n  classes: classesProp,\n  customStep = {},\n}: HvWizardTitleProps) => {\n  const { context, setSummary, tab, setTab } = useContext(HvWizardContext);\n\n  const { classes } = useClasses(classesProp);\n\n  const [steps, setSteps] = useState<HvStepProps[]>([]);\n\n  useEffect(() => {\n    return () => {\n      setSummary(false);\n    };\n  }, [setSummary]);\n\n  const toggleSummary = () => {\n    setSummary((prevValue) => !prevValue);\n  };\n\n  useEffect(() => {\n    const contextArray = Object.entries(context);\n\n    if (!contextArray.length) return;\n\n    const updatedSteps = contextArray.map<HvStepProps>(\n      ([, childState], index) => ({\n        title: childState?.[\"data-title\"] ?? childState?.name ?? `${index + 1}`,\n        state: switchTabState(childState, tab, index),\n        onClick: () => setTab(index),\n      }),\n    );\n\n    setSteps(updatedSteps);\n  }, [context, tab, setTab]);\n\n  return (\n    <HvDialogTitle\n      className={classes.headerContainer}\n      classes={{\n        messageContainer: classes.messageContainer,\n      }}\n    >\n      <div className={classes.titleContainer}>\n        {title && (\n          <HvTypography variant=\"title3\" component=\"h3\">\n            {title}\n          </HvTypography>\n        )}\n        {!!steps.length && (\n          <HvStepNavigation\n            className={classes.stepContainer}\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={classes.buttonWidth}\n            classes={{\n              root: classes.rootSummaryButton,\n            }}\n            onClick={toggleSummary}\n            startIcon={<Report />}\n          >\n            {`${labels.summary ?? \"Summary\"}`}\n          </HvButton>\n        )}\n      </div>\n    </HvDialogTitle>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAmCA,MAAM,iBAAiB,CACrB,OACA,YACA,UACG;AACC,MAAA,OAAO,QAAgB,QAAA;AACvB,MAAA,UAAU,WAAmB,QAAA;AAC7B,MAAA,OAAO,MAAc,QAAA;AACrB,MAAA,OAAO,SAAiB,QAAA;AACxB,MAAA,OAAO,UAAU,KAAa,QAAA;AAClC,MAAI,OAAO,WAAW,OAAO,UAAU,MAAc,QAAA;AAC9C,SAAA;AACT;AAEO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA,aAAa;AAAA,EACb,SAAS,CAAC;AAAA,EACV,SAAS;AAAA,EACT,aAAa,CAAA;AACf,MAA0B;AACxB,QAAM,EAAE,SAAS,YAAY,KAAK,OAAO,IAAI,WAAW,eAAe;AAEvE,QAAM,EAAE,QAAA,IAAY,WAAW,WAAW;AAE1C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAwB,CAAA,CAAE;AAEpD,YAAU,MAAM;AACd,WAAO,MAAM;AACX,iBAAW,KAAK;AAAA,IAClB;AAAA,EAAA,GACC,CAAC,UAAU,CAAC;AAEf,QAAM,gBAAgB,MAAM;AACf,eAAA,CAAC,cAAc,CAAC,SAAS;AAAA,EACtC;AAEA,YAAU,MAAM;AACR,UAAA,eAAe,OAAO,QAAQ,OAAO;AAEvC,QAAA,CAAC,aAAa,OAAQ;AAE1B,UAAM,eAAe,aAAa;AAAA,MAChC,CAAC,CAAG,EAAA,UAAU,GAAG,WAAW;AAAA,QAC1B,OAAO,aAAa,YAAY,KAAK,YAAY,QAAQ,GAAG,QAAQ,CAAC;AAAA,QACrE,OAAO,eAAe,YAAY,KAAK,KAAK;AAAA,QAC5C,SAAS,MAAM,OAAO,KAAK;AAAA,MAC7B;AAAA,IACF;AAEA,aAAS,YAAY;AAAA,EACpB,GAAA,CAAC,SAAS,KAAK,MAAM,CAAC;AAGvB,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,QAAQ;AAAA,MACnB,SAAS;AAAA,QACP,kBAAkB,QAAQ;AAAA,MAC5B;AAAA,MAEA,UAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,gBACrB,UAAA;AAAA,QAAA,6BACE,cAAa,EAAA,SAAQ,UAAS,WAAU,MACtC,UACH,OAAA;AAAA,QAED,CAAC,CAAC,MAAM,UACP;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,QAAQ;AAAA,YACnB;AAAA,YACA,MAAK;AAAA,YACL,UAAS;AAAA,YACT,OAAO;AAAA,cACL,IAAI;AAAA,cACJ,IAAI;AAAA,cACJ,IAAI;AAAA,cACJ,IAAI;AAAA,cACJ,IAAI;AAAA,YACN;AAAA,YACC,GAAG;AAAA,UAAA;AAAA,QACN;AAAA,QAED,cACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAQ;AAAA,YACR,WAAW,QAAQ;AAAA,YACnB,SAAS;AAAA,cACP,MAAM,QAAQ;AAAA,YAChB;AAAA,YACA,SAAS;AAAA,YACT,+BAAY,QAAO,EAAA;AAAA,YAElB,UAAA,GAAG,OAAO,WAAW,SAAS;AAAA,UAAA;AAAA,QAAA;AAAA,MACjC,EAEJ,CAAA;AAAA,IAAA;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"WizardTitle.js","sources":["../../../../src/Wizard/WizardTitle/WizardTitle.tsx"],"sourcesContent":["import { useContext, useEffect, useState } from \"react\";\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvButton,\n  HvDialogTitle,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Report } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvStepNavigation, HvStepNavigationProps } from \"../../StepNavigation\";\nimport { HvStepProps } from \"../../StepNavigation/DefaultNavigation\";\nimport { HvWizardContext, HvWizardTab } from \"../WizardContext\";\nimport { staticClasses, useClasses } from \"./WizardTitle.styles\";\n\nexport { staticClasses as wizardTitleClasses };\n\nexport type HvWizardTitleClasses = ExtractNames<typeof useClasses>;\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 = (\n  state: HvWizardTab | undefined,\n  currentTab: number,\n  index: number,\n) => {\n  if (state?.loading) return \"Pending\";\n  if (index === currentTab) return \"Current\";\n  if (state?.valid) return \"Completed\";\n  if (state?.disabled) return \"Disabled\";\n  if (state?.valid === null) return \"Enabled\";\n  if (state?.touched && state?.valid === false) return \"Failed\";\n  return \"Enabled\";\n};\n\nexport const HvWizardTitle = ({\n  title,\n  hasSummary = false,\n  labels = {},\n  classes: classesProp,\n  customStep = {},\n}: HvWizardTitleProps) => {\n  const { context, setSummary, tab, setTab } = useContext(HvWizardContext);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const [steps, setSteps] = useState<HvStepProps[]>([]);\n\n  useEffect(() => {\n    return () => {\n      setSummary(false);\n    };\n  }, [setSummary]);\n\n  const toggleSummary = () => {\n    setSummary((prevValue) => !prevValue);\n  };\n\n  useEffect(() => {\n    const contextArray = Object.entries(context);\n\n    if (!contextArray.length) return;\n\n    const updatedSteps = contextArray.map<HvStepProps>(\n      ([, childState], index) => ({\n        title: childState?.[\"data-title\"] ?? childState?.name ?? `${index + 1}`,\n        state: switchTabState(childState, tab, index),\n        onClick: () => setTab(index),\n      }),\n    );\n\n    setSteps(updatedSteps);\n  }, [context, tab, setTab]);\n\n  return (\n    <HvDialogTitle\n      className={cx(\n        classes.root,\n        classes.headerContainer,\n        classes.messageContainer,\n        classes.titleContainer,\n      )}\n    >\n      {title && (\n        <HvTypography variant=\"title3\" component=\"div\">\n          {title}\n        </HvTypography>\n      )}\n      {!!steps.length && (\n        <HvStepNavigation\n          className={classes.stepContainer}\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            classes.summaryButton,\n            classes.buttonWidth,\n            classes.rootSummaryButton,\n          )}\n          onClick={toggleSummary}\n          startIcon={<Report />}\n        >\n          {`${labels.summary ?? \"Summary\"}`}\n        </HvButton>\n      )}\n    </HvDialogTitle>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAmCA,MAAM,iBAAiB,CACrB,OACA,YACA,UACG;AACC,MAAA,OAAO,QAAgB,QAAA;AACvB,MAAA,UAAU,WAAmB,QAAA;AAC7B,MAAA,OAAO,MAAc,QAAA;AACrB,MAAA,OAAO,SAAiB,QAAA;AACxB,MAAA,OAAO,UAAU,KAAa,QAAA;AAClC,MAAI,OAAO,WAAW,OAAO,UAAU,MAAc,QAAA;AAC9C,SAAA;AACT;AAEO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA,aAAa;AAAA,EACb,SAAS,CAAC;AAAA,EACV,SAAS;AAAA,EACT,aAAa,CAAA;AACf,MAA0B;AACxB,QAAM,EAAE,SAAS,YAAY,KAAK,OAAO,IAAI,WAAW,eAAe;AAEvE,QAAM,EAAE,SAAS,OAAO,WAAW,WAAW;AAE9C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAwB,CAAA,CAAE;AAEpD,YAAU,MAAM;AACd,WAAO,MAAM;AACX,iBAAW,KAAK;AAAA,IAClB;AAAA,EAAA,GACC,CAAC,UAAU,CAAC;AAEf,QAAM,gBAAgB,MAAM;AACf,eAAA,CAAC,cAAc,CAAC,SAAS;AAAA,EACtC;AAEA,YAAU,MAAM;AACR,UAAA,eAAe,OAAO,QAAQ,OAAO;AAEvC,QAAA,CAAC,aAAa,OAAQ;AAE1B,UAAM,eAAe,aAAa;AAAA,MAChC,CAAC,CAAG,EAAA,UAAU,GAAG,WAAW;AAAA,QAC1B,OAAO,aAAa,YAAY,KAAK,YAAY,QAAQ,GAAG,QAAQ,CAAC;AAAA,QACrE,OAAO,eAAe,YAAY,KAAK,KAAK;AAAA,QAC5C,SAAS,MAAM,OAAO,KAAK;AAAA,MAC7B;AAAA,IACF;AAEA,aAAS,YAAY;AAAA,EACpB,GAAA,CAAC,SAAS,KAAK,MAAM,CAAC;AAGvB,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,QAAQ;AAAA,MACV;AAAA,MAEC,UAAA;AAAA,QAAA,6BACE,cAAa,EAAA,SAAQ,UAAS,WAAU,OACtC,UACH,OAAA;AAAA,QAED,CAAC,CAAC,MAAM,UACP;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,QAAQ;AAAA,YACnB;AAAA,YACA,MAAK;AAAA,YACL,UAAS;AAAA,YACT,OAAO;AAAA,cACL,IAAI;AAAA,cACJ,IAAI;AAAA,cACJ,IAAI;AAAA,cACJ,IAAI;AAAA,cACJ,IAAI;AAAA,YACN;AAAA,YACC,GAAG;AAAA,UAAA;AAAA,QACN;AAAA,QAED,cACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAQ;AAAA,YACR,WAAW;AAAA,cACT,QAAQ;AAAA,cACR,QAAQ;AAAA,cACR,QAAQ;AAAA,YACV;AAAA,YACA,SAAS;AAAA,YACT,+BAAY,QAAO,EAAA;AAAA,YAElB,UAAA,GAAG,OAAO,WAAW,SAAS;AAAA,UAAA;AAAA,QAAA;AAAA,MACjC;AAAA,IAAA;AAAA,EAEJ;AAEJ;"}

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

@@ -1,32 +1,25 @@
 import { createClasses } from "@hitachivantara/uikit-react-core";
 import { theme } from "@hitachivantara/uikit-styles";
 const { staticClasses, useClasses } = createClasses("HvWizardTitle", {
-  messageContainer: {
-    "& > div": {
-      width: "100%"
-    }
-  },
-  titleContainer: {
-    display: "flex",
-    alignItems: "center",
+  root: {
+    backgroundColor: theme.colors.atmo2,
     justifyContent: "space-between",
-    gap: theme.spacing(1),
-    width: "100%"
-  },
-  buttonWidth: {
-    width: 120
+    paddingRight: theme.space.sm
   },
-  rootSummaryButton: {
+  /** @deprecated use `classes.root` */
+  headerContainer: {},
+  /** @deprecated use `classes.root` */
+  messageContainer: {},
+  /** @deprecated use `classes.root` */
+  titleContainer: {},
+  summaryButton: {
+    width: 120,
     paddingRight: 18
   },
-  headerContainer: {
-    backgroundColor: theme.colors.atmo2,
-    "& h6": {
-      fontSize: "16px",
-      fontWeight: "bold",
-      letterSpacing: 0
-    }
-  },
+  /** @deprecated use `classes.summaryButton` */
+  buttonWidth: {},
+  /** @deprecated use `classes.summaryButton` */
+  rootSummaryButton: {},
   stepContainer: {
     margin: "auto"
   }

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

@@ -1 +1 @@
-{"version":3,"file":"WizardTitle.styles.js","sources":["../../../../src/Wizard/WizardTitle/WizardTitle.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvWizardTitle\", {\n  messageContainer: {\n    \"& > div\": {\n      width: \"100%\",\n    },\n  },\n  titleContainer: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    gap: theme.spacing(1),\n    width: \"100%\",\n  },\n  buttonWidth: {\n    width: 120,\n  },\n  rootSummaryButton: {\n    paddingRight: 18,\n  },\n  headerContainer: {\n    backgroundColor: theme.colors.atmo2,\n    \"& h6\": {\n      fontSize: \"16px\",\n      fontWeight: \"bold\",\n      letterSpacing: 0,\n    },\n  },\n  stepContainer: {\n    margin: \"auto\",\n  },\n});\n"],"names":[],"mappings":";;AAGO,MAAM,EAAE,eAAe,eAAe,cAAc,iBAAiB;AAAA,EAC1E,kBAAkB;AAAA,IAChB,WAAW;AAAA,MACT,OAAO;AAAA,IAAA;AAAA,EAEX;AAAA,EACA,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,KAAK,MAAM,QAAQ,CAAC;AAAA,IACpB,OAAO;AAAA,EACT;AAAA,EACA,aAAa;AAAA,IACX,OAAO;AAAA,EACT;AAAA,EACA,mBAAmB;AAAA,IACjB,cAAc;AAAA,EAChB;AAAA,EACA,iBAAiB;AAAA,IACf,iBAAiB,MAAM,OAAO;AAAA,IAC9B,QAAQ;AAAA,MACN,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,eAAe;AAAA,IAAA;AAAA,EAEnB;AAAA,EACA,eAAe;AAAA,IACb,QAAQ;AAAA,EAAA;AAEZ,CAAC;"}
+{"version":3,"file":"WizardTitle.styles.js","sources":["../../../../src/Wizard/WizardTitle/WizardTitle.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvWizardTitle\", {\n  root: {\n    backgroundColor: theme.colors.atmo2,\n    justifyContent: \"space-between\",\n    paddingRight: theme.space.sm,\n  },\n  /** @deprecated use `classes.root` */\n  headerContainer: {},\n  /** @deprecated use `classes.root` */\n  messageContainer: {},\n  /** @deprecated use `classes.root` */\n  titleContainer: {},\n  summaryButton: {\n    width: 120,\n    paddingRight: 18,\n  },\n  /** @deprecated use `classes.summaryButton` */\n  buttonWidth: {},\n  /** @deprecated use `classes.summaryButton` */\n  rootSummaryButton: {},\n  stepContainer: {\n    margin: \"auto\",\n  },\n});\n"],"names":[],"mappings":";;AAGO,MAAM,EAAE,eAAe,eAAe,cAAc,iBAAiB;AAAA,EAC1E,MAAM;AAAA,IACJ,iBAAiB,MAAM,OAAO;AAAA,IAC9B,gBAAgB;AAAA,IAChB,cAAc,MAAM,MAAM;AAAA,EAC5B;AAAA;AAAA,EAEA,iBAAiB,CAAC;AAAA;AAAA,EAElB,kBAAkB,CAAC;AAAA;AAAA,EAEnB,gBAAgB,CAAC;AAAA,EACjB,eAAe;AAAA,IACb,OAAO;AAAA,IACP,cAAc;AAAA,EAChB;AAAA;AAAA,EAEA,aAAa,CAAC;AAAA;AAAA,EAEd,mBAAmB,CAAC;AAAA,EACpB,eAAe;AAAA,IACb,QAAQ;AAAA,EAAA;AAEZ,CAAC;"}

package/dist/types/index.d.ts

@@ -971,13 +971,15 @@ declare const useClasses_13: (classesProp?: Partial<Record<"actionsContainer" |
     readonly cx: (...args: any) => string;
 };
 
-declare const useClasses_14: (classesProp?: Partial<Record<"titleContainer" | "messageContainer" | "headerContainer" | "buttonWidth" | "rootSummaryButton" | "stepContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_14: (classesProp?: Partial<Record<"root" | "titleContainer" | "messageContainer" | "headerContainer" | "buttonWidth" | "summaryButton" | "rootSummaryButton" | "stepContainer", string>>, addStatic?: boolean) => {
     readonly classes: {
+        root: string;
+        headerContainer: string;
         messageContainer: string;
         titleContainer: string;
+        summaryButton: string;
         buttonWidth: string;
         rootSummaryButton: string;
-        headerContainer: string;
         stepContainer: string;
     };
     readonly css: any;
@@ -1512,11 +1514,13 @@ export declare const wizardContentClasses: {
 };
 
 export declare const wizardTitleClasses: {
+    root: string;
+    headerContainer: string;
     messageContainer: string;
     titleContainer: string;
+    summaryButton: string;
     buttonWidth: string;
     rootSummaryButton: string;
-    headerContainer: string;
     stepContainer: string;
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-lab",
-  "version": "5.41.20",
+  "version": "5.42.0",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
   "description": "Contributed React components for the NEXT UI Kit.",
@@ -33,7 +33,7 @@
     "@dnd-kit/core": "^6.1.0",
     "@dnd-kit/modifiers": "^6.0.1",
     "@emotion/css": "^11.11.0",
-    "@hitachivantara/uikit-react-core": "^5.84.3",
+    "@hitachivantara/uikit-react-core": "^5.85.0",
     "@hitachivantara/uikit-react-icons": "^5.13.4",
     "@hitachivantara/uikit-react-utils": "^0.2.21",
     "@hitachivantara/uikit-styles": "^5.40.6",
@@ -52,7 +52,7 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "ee3c5267100d8abfcc676f7c8aac845f157255c8",
+  "gitHead": "1ca641bd4077a9cc300706f725d55efc24f6244c",
   "exports": {
     ".": {
       "types": "./dist/types/index.d.ts",