@hitachivantara/uikit-react-lab 3.54.0 → 3.56.0

package/dist/Controls/Controls.d.ts

@@ -1,22 +1,14 @@
 import { StandardProps } from "@material-ui/core";
+import { HvTableInstance } from "../Table";
 
 export type HvControlsClassKey = "root" | "rightSection" | "leftSection";
 
-export interface HvControlsSortValue {
-  id: string;
-  desc: string;
-}
 export interface HvControlsViewConfiguration extends Record<string, unknown> {
   id: string;
   label: string;
   icon: React.ReactNode;
 }
 
-export interface HvControlsCallbacks extends Record<string, unknown> {
-  setSortBy?: (v: HvControlsSortValue[]) => void;
-  setGlobalFilter?: (v: string) => void;
-}
-
 export interface HvControlsProps
   extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvControlsClassKey> {
   /** Children to be rendered. */
@@ -29,7 +21,7 @@ export interface HvControlsProps
    * An instance of useHvTable or useTable used to manage the data
    * if this is not provided data sorting and search must be handled externally
    */
-  callbacks?: HvControlsCallbacks;
+  callbacks?: Pick<HvTableInstance, "setSortBy" | "setGlobalFilter">;
   /**
    * Views configuration required for the view buttons
    */

package/dist/Controls/RightControl/RightControl.d.ts

@@ -10,7 +10,7 @@ export interface HvControlsViewConfiguration extends Record<string, unknown> {
 }
 
 export interface RightListControls extends ListValueProp {
-  accesor: string;
+  accessor: string;
   desc: boolean;
 }
 

package/dist/StepNavigation/DefaultNavigation/DefaultNavigation.d.ts

@@ -1,6 +1,8 @@
 import * as React from "react";
 import { StandardProps } from "@material-ui/core";
 
+import { HvTheme } from "@hitachivantara/uikit-react-core";
+
 import { HvStepNavigationProps } from "../StepNavigation";
 import { HvStepProps } from "./Step";
 
@@ -12,7 +14,7 @@ export type ComponentChildProps = {
   separatorValues: {
     minWidth: number;
     maxWidth: number;
-    getColor: (state: HvStepProps["state"]) => any;
+    getColor: (state: HvStepProps["state"], theme: HvTheme) => any;
     height: number;
   };
   stepValues: {

package/dist/StepNavigation/DefaultNavigation/DefaultNavigation.js

@@ -33,8 +33,7 @@ var HvDefaultNavigation = function HvDefaultNavigation(_ref) {
       getDynamicValues = _ref.getDynamicValues,
       children = _ref.children,
       other = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var theme = (0, _core.useTheme)(); // step values
-
+  // step values
   var _stepSizes$stepSize = _utils.stepSizes[stepSize],
       maxSize = _stepSizes$stepSize.container,
       minSize = _stepSizes$stepSize.avatar;
@@ -48,10 +47,6 @@ var HvDefaultNavigation = function HvDefaultNavigation(_ref) {
       separatorWidth = _getDynamicValues.separatorWidth; // separator values
 
 
-  var getColor = function getColor(state) {
-    return (0, _utils.getColor)(state === "Current" ? "Disabled" : state, theme);
-  };
-
   var maxWidth = Math.max(titleWidth - minSize, separatorWidth);
   var minWidth = Math.max(titleWidth - (maxSize + minSize) * 0.5, separatorWidth); //
 
@@ -69,7 +64,7 @@ var HvDefaultNavigation = function HvDefaultNavigation(_ref) {
     separatorValues: {
       minWidth: minWidth,
       maxWidth: maxWidth,
-      getColor: getColor,
+      getColor: _utils.getColor,
       height: 3
     },
     stepValues: {

package/dist/StepNavigation/DefaultNavigation/DefaultNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultNavigation.js","names":["HvDefaultNavigation","numSteps","stepSize","getTitles","getDynamicValues","children","other","theme","useTheme","stepSizes","maxSize","container","minSize","avatar","StepComponent","HvStep","stepsWidth","width","titleWidth","separatorWidth","getColor","state","getStateColor","maxWidth","Math","max","minWidth","Steps","titles","variant","navWidth","separatorValues","height","stepValues","propTypes","className","PropTypes","string","classes","shape","root","isRequired","number","oneOf","func","elementType","withStyles","styles","name"],"sources":["../../../src/StepNavigation/DefaultNavigation/DefaultNavigation.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport { useTheme, withStyles } from \"@material-ui/core\";\n\nimport HvStep from \"./Step\";\nimport { getColor as getStateColor, stepSizes } from \"./utils\";\nimport styles from \"./styles\";\n\n/**\n * Default Navigation\n */\nconst HvDefaultNavigation = ({\n  numSteps,\n  stepSize,\n  getTitles,\n  getDynamicValues,\n  children,\n  ...other\n}) => {\n  const theme = useTheme();\n\n  // step values\n  const { container: maxSize, avatar: minSize } = stepSizes[stepSize];\n  const StepComponent = HvStep;\n  //\n\n  const stepsWidth = maxSize + minSize * (numSteps - 1);\n  const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);\n\n  // separator values\n  const getColor = (state) => getStateColor(state === \"Current\" ? \"Disabled\" : state, theme);\n  const maxWidth = Math.max(titleWidth - minSize, separatorWidth);\n  const minWidth = Math.max(titleWidth - (maxSize + minSize) * 0.5, separatorWidth);\n  //\n\n  const Steps = children;\n\n  const titles = getTitles(({ state }) => ({\n    variant: state === \"Disabled\" ? \"disabledText\" : \"highlightText\",\n    titleWidth,\n  }));\n\n  return (\n    <div {...other}>\n      <Steps\n        {...{\n          stepsWidth,\n          navWidth: width,\n          separatorValues: {\n            minWidth,\n            maxWidth,\n            getColor,\n            height: 3,\n          },\n          stepValues: {\n            minSize,\n            maxSize,\n            StepComponent,\n          },\n        }}\n      />\n      {titles}\n    </div>\n  );\n};\n\nHvDefaultNavigation.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n  }).isRequired,\n  /**\n   * Number of steps to show on the component.\n   */\n  numSteps: PropTypes.number.isRequired,\n  /**\n   * Sets one of the standard sizes of the steps\n   */\n  stepSize: PropTypes.oneOf([\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]).isRequired,\n  /**\n   * Returns dynamic width values of the component (width, titleWidth, separatorWidth).\n   */\n  getDynamicValues: PropTypes.func.isRequired,\n  /**\n   * Returns a JSX.element of the titles container.\n   */\n  getTitles: PropTypes.func.isRequired,\n  /**\n   * Component to render Step Navigation with props = {separatorValues, stepValues, stepsWidth}\n   */\n  children: PropTypes.elementType.isRequired,\n};\n\nexport default withStyles(styles, { name: \"HvDefaultNavigation\" })(HvDefaultNavigation);\n"],"mappings":"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"}
+{"version":3,"file":"DefaultNavigation.js","names":["HvDefaultNavigation","numSteps","stepSize","getTitles","getDynamicValues","children","other","stepSizes","maxSize","container","minSize","avatar","StepComponent","HvStep","stepsWidth","width","titleWidth","separatorWidth","maxWidth","Math","max","minWidth","Steps","titles","state","variant","navWidth","separatorValues","getColor","height","stepValues","propTypes","className","PropTypes","string","classes","shape","root","isRequired","number","oneOf","func","elementType","withStyles","styles","name"],"sources":["../../../src/StepNavigation/DefaultNavigation/DefaultNavigation.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport { withStyles } from \"@material-ui/core\";\n\nimport HvStep from \"./Step\";\nimport { getColor, stepSizes } from \"./utils\";\nimport styles from \"./styles\";\n\n/**\n * Default Navigation\n */\nconst HvDefaultNavigation = ({\n  numSteps,\n  stepSize,\n  getTitles,\n  getDynamicValues,\n  children,\n  ...other\n}) => {\n  // step values\n  const { container: maxSize, avatar: minSize } = stepSizes[stepSize];\n  const StepComponent = HvStep;\n  //\n\n  const stepsWidth = maxSize + minSize * (numSteps - 1);\n  const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);\n\n  // separator values\n  const maxWidth = Math.max(titleWidth - minSize, separatorWidth);\n  const minWidth = Math.max(titleWidth - (maxSize + minSize) * 0.5, separatorWidth);\n  //\n\n  const Steps = children;\n\n  const titles = getTitles(({ state }) => ({\n    variant: state === \"Disabled\" ? \"disabledText\" : \"highlightText\",\n    titleWidth,\n  }));\n\n  return (\n    <div {...other}>\n      <Steps\n        {...{\n          stepsWidth,\n          navWidth: width,\n          separatorValues: {\n            minWidth,\n            maxWidth,\n            getColor,\n            height: 3,\n          },\n          stepValues: {\n            minSize,\n            maxSize,\n            StepComponent,\n          },\n        }}\n      />\n      {titles}\n    </div>\n  );\n};\n\nHvDefaultNavigation.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n  }).isRequired,\n  /**\n   * Number of steps to show on the component.\n   */\n  numSteps: PropTypes.number.isRequired,\n  /**\n   * Sets one of the standard sizes of the steps\n   */\n  stepSize: PropTypes.oneOf([\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]).isRequired,\n  /**\n   * Returns dynamic width values of the component (width, titleWidth, separatorWidth).\n   */\n  getDynamicValues: PropTypes.func.isRequired,\n  /**\n   * Returns a JSX.element of the titles container.\n   */\n  getTitles: PropTypes.func.isRequired,\n  /**\n   * Component to render Step Navigation with props = {separatorValues, stepValues, stepsWidth}\n   */\n  children: PropTypes.elementType.isRequired,\n};\n\nexport default withStyles(styles, { name: \"HvDefaultNavigation\" })(HvDefaultNavigation);\n"],"mappings":"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"}

package/dist/StepNavigation/DefaultNavigation/Step/Step.d.ts

@@ -7,9 +7,9 @@ export type HvStepClassKey = "root";
 export type HvStepProps = StandardProps<React.HTMLAttributes<HTMLDivElement>, HvStepClassKey> &
   Pick<HvButtonProps, "onClick"> & {
     /**
-     * State of the step. Values = {"Pending", "Failed", "Completed", "Current", "Disabled"}
+     * State of the step. Values = {"Pending", "Failed", "Completed", "Current", "Disabled", "Enabled"}
      */
-    state: "Pending" | "Failed" | "Completed" | "Current" | "Disabled";
+    state: "Pending" | "Failed" | "Completed" | "Current" | "Disabled" | "Enabled";
     /**
      * Title of the step.
      */
@@ -22,6 +22,11 @@ export type HvStepProps = StandardProps<React.HTMLAttributes<HTMLDivElement>, Hv
      * Number of the step.
      */
     number?: number;
+    /**
+     * Define if a step is disabled/enabled.
+     * If this property is not defined and the step is on state "Disabled", the step component will be disabled
+     */
+    disabled?: boolean;
   };
 
 export default function HvStep(props: HvStepProps): JSX.Element | null;

package/dist/StepNavigation/DefaultNavigation/Step/Step.js

@@ -34,6 +34,7 @@ var HvStep = function HvStep(_ref) {
       state = _ref.state,
       title = _ref.title,
       onClick = _ref.onClick,
+      disabled = _ref.disabled,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? "SM" : _ref$size,
       _ref$number = _ref.number,
@@ -73,7 +74,7 @@ var HvStep = function HvStep(_ref) {
     "aria-label": "step-".concat(title),
     icon: true,
     overrideIconColors: false,
-    disabled: ["Current", "Disabled"].includes(state),
+    disabled: disabled !== null && disabled !== void 0 ? disabled : ["Current", "Disabled"].includes(state),
     onClick: onClick
   }, /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvAvatar, {
     className: (0, _clsx.default)(classes.avatar, classes[size]),
@@ -161,9 +162,9 @@ process.env.NODE_ENV !== "production" ? HvStep.propTypes = {
   size: _propTypes.default.oneOf(["XS", "SM", "MD", "LG", "XL"]),
 
   /**
-   * State of the step. Values = {"Pending", "Failed", "Completed", "Current", "Disabled"}
+   * State of the step. Values = {"Pending", "Failed", "Completed", "Current", "Disabled", "Enabled"}
    */
-  state: _propTypes.default.oneOf(["Pending", "Failed", "Completed", "Current", "Disabled"]).isRequired,
+  state: _propTypes.default.oneOf(["Pending", "Failed", "Completed", "Current", "Disabled", "Enabled"]).isRequired,
 
   /**
    * Title of the step.
@@ -178,7 +179,13 @@ process.env.NODE_ENV !== "production" ? HvStep.propTypes = {
   /**
    * Event onClick of the step.
    */
-  onClick: _propTypes.default.func
+  onClick: _propTypes.default.func,
+
+  /**
+   * Define if a step is disabled/enabled.
+   * If this property is not defined and the step is on state "Disabled", the step component will be disabled
+   */
+  disabled: _propTypes.default.bool
 } : void 0;
 
 var _default = (0, _core.withStyles)(_styles.default, {

package/dist/StepNavigation/DefaultNavigation/Step/Step.js.map

@@ -1 +1 @@
-{"version":3,"file":"Step.js","names":["HvStep","className","classes","state","title","onClick","size","number","iconSize","XS","SM","MD","LG","XL","squareL","Pending","Failed","Completed","svgSize","backgroundColor","getColor","color","undefined","semantic","status","IconComponent","HourGlass","Level3Bad","Level0Good","clsx","root","ghost","ghostDisabled","includes","avatar","propTypes","PropTypes","string","shape","stepTitle","isRequired","oneOf","func","withStyles","styles","name"],"sources":["../../../../src/StepNavigation/DefaultNavigation/Step/Step.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { withStyles } from \"@material-ui/core\";\n\nimport { Level0Good, Level3Bad, HourGlass } from \"@hitachivantara/uikit-react-icons\";\nimport { HvAvatar, HvButton } from \"@hitachivantara/uikit-react-core\";\n\nimport { getColor } from \"../utils\";\nimport styles from \"./styles\";\n\n/**\n * Step element of \"Default\" Step Navigation root component\n */\nconst HvStep = ({ className, classes, state, title, onClick, size = \"SM\", number = 1 }) => {\n  const iconSize = {\n    XS: \"XS\",\n    SM: \"XS\",\n    MD: \"S\",\n    LG: \"M\",\n    XL: \"M\",\n  }[size];\n\n  const squareL = {\n    Pending: 16,\n    Failed: 24,\n    Completed: 24,\n  }[state];\n\n  const svgSize = {\n    XS: squareL - 8,\n    SM: squareL,\n    MD: squareL + 8,\n    LG: squareL + 16,\n    XL: squareL + 24,\n  }[size];\n\n  const backgroundColor = getColor(state);\n\n  const color = state === \"Pending\" ? \"atmo2\" : undefined;\n\n  const semantic = state !== \"Pending\" ? backgroundColor : undefined;\n\n  const status = state === \"Current\" ? \"atmo5\" : undefined;\n\n  const IconComponent = {\n    Pending: HourGlass,\n    Failed: Level3Bad,\n    Completed: Level0Good,\n  }[state];\n\n  return (\n    <div\n      className={clsx(className, classes.root, { [classes[\"not-current\"]]: state !== \"Current\" })}\n    >\n      <HvButton\n        className={clsx(classes.ghost, { [classes.ghostDisabled]: state === \"Current\" })}\n        aria-label={`step-${title}`}\n        icon\n        overrideIconColors={false}\n        disabled={[\"Current\", \"Disabled\"].includes(state)}\n        onClick={onClick}\n      >\n        <HvAvatar\n          className={clsx(classes.avatar, classes[size])}\n          backgroundColor={backgroundColor}\n          status={status}\n          size={size}\n        >\n          {IconComponent ? (\n            <IconComponent\n              color={color}\n              semantic={semantic}\n              width={svgSize}\n              height={svgSize}\n              iconSize={iconSize}\n            />\n          ) : (\n            number\n          )}\n        </HvAvatar>\n      </HvButton>\n    </div>\n  );\n};\n\nHvStep.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the ghost class.\n     */\n    ghost: PropTypes.string,\n    /**\n     * Styles applied to the ghostDisabled class.\n     */\n    ghostDisabled: PropTypes.string,\n    /**\n     * Styles applied to the root element when step is not in \"current\" state.\n     */\n    \"not-current\": PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XS.\n     */\n    XS: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is SM.\n     */\n    SM: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is MD.\n     */\n    MD: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is LG.\n     */\n    LG: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XL.\n     */\n    XL: PropTypes.string,\n    /**\n     * Styles applied to the avatar element.\n     */\n    avatar: PropTypes.string,\n    /**\n     * Styles applied to the title of a step element.\n     */\n    stepTitle: PropTypes.string,\n  }).isRequired,\n  /**\n   * Sets one of the standard sizes of the step\n   */\n  size: PropTypes.oneOf([\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]),\n  /**\n   * State of the step. Values = {\"Pending\", \"Failed\", \"Completed\", \"Current\", \"Disabled\"}\n   */\n  state: PropTypes.oneOf([\"Pending\", \"Failed\", \"Completed\", \"Current\", \"Disabled\"]).isRequired,\n  /**\n   * Title of the step.\n   */\n  title: PropTypes.string.isRequired,\n  /**\n   * Number of the step.\n   */\n  number: PropTypes.number,\n  /**\n   * Event onClick of the step.\n   */\n  onClick: PropTypes.func,\n};\n\nexport default withStyles(styles, { name: \"HvStep\" })(HvStep);\n"],"mappings":"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"}
+{"version":3,"file":"Step.js","names":["HvStep","className","classes","state","title","onClick","disabled","size","number","iconSize","XS","SM","MD","LG","XL","squareL","Pending","Failed","Completed","svgSize","backgroundColor","getColor","color","undefined","semantic","status","IconComponent","HourGlass","Level3Bad","Level0Good","clsx","root","ghost","ghostDisabled","includes","avatar","propTypes","PropTypes","string","shape","stepTitle","isRequired","oneOf","func","bool","withStyles","styles","name"],"sources":["../../../../src/StepNavigation/DefaultNavigation/Step/Step.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { withStyles } from \"@material-ui/core\";\n\nimport { Level0Good, Level3Bad, HourGlass } from \"@hitachivantara/uikit-react-icons\";\nimport { HvAvatar, HvButton } from \"@hitachivantara/uikit-react-core\";\n\nimport { getColor } from \"../utils\";\nimport styles from \"./styles\";\n\n/**\n * Step element of \"Default\" Step Navigation root component\n */\nconst HvStep = ({\n  className,\n  classes,\n  state,\n  title,\n  onClick,\n  disabled,\n  size = \"SM\",\n  number = 1,\n}) => {\n  const iconSize = {\n    XS: \"XS\",\n    SM: \"XS\",\n    MD: \"S\",\n    LG: \"M\",\n    XL: \"M\",\n  }[size];\n\n  const squareL = {\n    Pending: 16,\n    Failed: 24,\n    Completed: 24,\n  }[state];\n\n  const svgSize = {\n    XS: squareL - 8,\n    SM: squareL,\n    MD: squareL + 8,\n    LG: squareL + 16,\n    XL: squareL + 24,\n  }[size];\n\n  const backgroundColor = getColor(state);\n\n  const color = state === \"Pending\" ? \"atmo2\" : undefined;\n\n  const semantic = state !== \"Pending\" ? backgroundColor : undefined;\n\n  const status = state === \"Current\" ? \"atmo5\" : undefined;\n\n  const IconComponent = {\n    Pending: HourGlass,\n    Failed: Level3Bad,\n    Completed: Level0Good,\n  }[state];\n\n  return (\n    <div\n      className={clsx(className, classes.root, { [classes[\"not-current\"]]: state !== \"Current\" })}\n    >\n      <HvButton\n        className={clsx(classes.ghost, { [classes.ghostDisabled]: state === \"Current\" })}\n        aria-label={`step-${title}`}\n        icon\n        overrideIconColors={false}\n        disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n        onClick={onClick}\n      >\n        <HvAvatar\n          className={clsx(classes.avatar, classes[size])}\n          backgroundColor={backgroundColor}\n          status={status}\n          size={size}\n        >\n          {IconComponent ? (\n            <IconComponent\n              color={color}\n              semantic={semantic}\n              width={svgSize}\n              height={svgSize}\n              iconSize={iconSize}\n            />\n          ) : (\n            number\n          )}\n        </HvAvatar>\n      </HvButton>\n    </div>\n  );\n};\n\nHvStep.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the ghost class.\n     */\n    ghost: PropTypes.string,\n    /**\n     * Styles applied to the ghostDisabled class.\n     */\n    ghostDisabled: PropTypes.string,\n    /**\n     * Styles applied to the root element when step is not in \"current\" state.\n     */\n    \"not-current\": PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XS.\n     */\n    XS: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is SM.\n     */\n    SM: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is MD.\n     */\n    MD: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is LG.\n     */\n    LG: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XL.\n     */\n    XL: PropTypes.string,\n    /**\n     * Styles applied to the avatar element.\n     */\n    avatar: PropTypes.string,\n    /**\n     * Styles applied to the title of a step element.\n     */\n    stepTitle: PropTypes.string,\n  }).isRequired,\n  /**\n   * Sets one of the standard sizes of the step\n   */\n  size: PropTypes.oneOf([\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]),\n  /**\n   * State of the step. Values = {\"Pending\", \"Failed\", \"Completed\", \"Current\", \"Disabled\", \"Enabled\"}\n   */\n  state: PropTypes.oneOf([\"Pending\", \"Failed\", \"Completed\", \"Current\", \"Disabled\", \"Enabled\"])\n    .isRequired,\n  /**\n   * Title of the step.\n   */\n  title: PropTypes.string.isRequired,\n  /**\n   * Number of the step.\n   */\n  number: PropTypes.number,\n  /**\n   * Event onClick of the step.\n   */\n  onClick: PropTypes.func,\n  /**\n   * Define if a step is disabled/enabled.\n   * If this property is not defined and the step is on state \"Disabled\", the step component will be disabled\n   */\n  disabled: PropTypes.bool,\n};\n\nexport default withStyles(styles, { name: \"HvStep\" })(HvStep);\n"],"mappings":"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"}

package/dist/StepNavigation/DefaultNavigation/utils.js

@@ -6,14 +6,15 @@ Object.defineProperty(exports, "__esModule", {
 exports.stepSizes = exports.getColor = void 0;
 
 var getColor = function getColor(state, theme) {
-  var _theme$hv$palette$sem, _theme$hv, _theme$hv$palette, _theme$hv$palette$sem2, _theme$hv$palette$sem3, _theme$hv2, _theme$hv2$palette, _theme$hv2$palette$se, _theme$hv$palette$sem4, _theme$hv3, _theme$hv3$palette, _theme$hv3$palette$se, _theme$hv$palette$acc, _theme$hv4, _theme$hv4$palette, _theme$hv4$palette$ac, _theme$hv$palette$atm, _theme$hv5, _theme$hv5$palette, _theme$hv5$palette$at;
+  var _theme$hv$palette$sem, _theme$hv, _theme$hv$palette, _theme$hv$palette$sem2, _theme$hv$palette$sem3, _theme$hv2, _theme$hv2$palette, _theme$hv2$palette$se, _theme$hv$palette$sem4, _theme$hv3, _theme$hv3$palette, _theme$hv3$palette$se, _theme$hv$palette$acc, _theme$hv4, _theme$hv4$palette, _theme$hv4$palette$ac, _theme$hv$palette$atm, _theme$hv5, _theme$hv5$palette, _theme$hv5$palette$at, _theme$hv$palette$acc2, _theme$hv6, _theme$hv6$palette, _theme$hv6$palette$ac;
 
   return {
     Pending: (_theme$hv$palette$sem = theme === null || theme === void 0 ? void 0 : (_theme$hv = theme.hv) === null || _theme$hv === void 0 ? void 0 : (_theme$hv$palette = _theme$hv.palette) === null || _theme$hv$palette === void 0 ? void 0 : (_theme$hv$palette$sem2 = _theme$hv$palette.semantic) === null || _theme$hv$palette$sem2 === void 0 ? void 0 : _theme$hv$palette$sem2.sema3) !== null && _theme$hv$palette$sem !== void 0 ? _theme$hv$palette$sem : "sema3",
     Failed: (_theme$hv$palette$sem3 = theme === null || theme === void 0 ? void 0 : (_theme$hv2 = theme.hv) === null || _theme$hv2 === void 0 ? void 0 : (_theme$hv2$palette = _theme$hv2.palette) === null || _theme$hv2$palette === void 0 ? void 0 : (_theme$hv2$palette$se = _theme$hv2$palette.semantic) === null || _theme$hv2$palette$se === void 0 ? void 0 : _theme$hv2$palette$se.sema4) !== null && _theme$hv$palette$sem3 !== void 0 ? _theme$hv$palette$sem3 : "sema4",
     Completed: (_theme$hv$palette$sem4 = theme === null || theme === void 0 ? void 0 : (_theme$hv3 = theme.hv) === null || _theme$hv3 === void 0 ? void 0 : (_theme$hv3$palette = _theme$hv3.palette) === null || _theme$hv3$palette === void 0 ? void 0 : (_theme$hv3$palette$se = _theme$hv3$palette.semantic) === null || _theme$hv3$palette$se === void 0 ? void 0 : _theme$hv3$palette$se.sema1) !== null && _theme$hv$palette$sem4 !== void 0 ? _theme$hv$palette$sem4 : "sema1",
     Current: (_theme$hv$palette$acc = theme === null || theme === void 0 ? void 0 : (_theme$hv4 = theme.hv) === null || _theme$hv4 === void 0 ? void 0 : (_theme$hv4$palette = _theme$hv4.palette) === null || _theme$hv4$palette === void 0 ? void 0 : (_theme$hv4$palette$ac = _theme$hv4$palette.accent) === null || _theme$hv4$palette$ac === void 0 ? void 0 : _theme$hv4$palette$ac.acce1) !== null && _theme$hv$palette$acc !== void 0 ? _theme$hv$palette$acc : "acce1",
-    Disabled: (_theme$hv$palette$atm = theme === null || theme === void 0 ? void 0 : (_theme$hv5 = theme.hv) === null || _theme$hv5 === void 0 ? void 0 : (_theme$hv5$palette = _theme$hv5.palette) === null || _theme$hv5$palette === void 0 ? void 0 : (_theme$hv5$palette$at = _theme$hv5$palette.atmosphere) === null || _theme$hv5$palette$at === void 0 ? void 0 : _theme$hv5$palette$at.atmo5) !== null && _theme$hv$palette$atm !== void 0 ? _theme$hv$palette$atm : "atmo5"
+    Disabled: (_theme$hv$palette$atm = theme === null || theme === void 0 ? void 0 : (_theme$hv5 = theme.hv) === null || _theme$hv5 === void 0 ? void 0 : (_theme$hv5$palette = _theme$hv5.palette) === null || _theme$hv5$palette === void 0 ? void 0 : (_theme$hv5$palette$at = _theme$hv5$palette.atmosphere) === null || _theme$hv5$palette$at === void 0 ? void 0 : _theme$hv5$palette$at.atmo5) !== null && _theme$hv$palette$atm !== void 0 ? _theme$hv$palette$atm : "atmo5",
+    Enabled: (_theme$hv$palette$acc2 = theme === null || theme === void 0 ? void 0 : (_theme$hv6 = theme.hv) === null || _theme$hv6 === void 0 ? void 0 : (_theme$hv6$palette = _theme$hv6.palette) === null || _theme$hv6$palette === void 0 ? void 0 : (_theme$hv6$palette$ac = _theme$hv6$palette.accent) === null || _theme$hv6$palette$ac === void 0 ? void 0 : _theme$hv6$palette$ac.acce1) !== null && _theme$hv$palette$acc2 !== void 0 ? _theme$hv$palette$acc2 : "acce1"
   }[state];
 };
 

package/dist/StepNavigation/DefaultNavigation/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","names":["getColor","state","theme","Pending","hv","palette","semantic","sema3","Failed","sema4","Completed","sema1","Current","accent","acce1","Disabled","atmosphere","atmo5","EXTRA_SMALL","container","avatar","SMALL","MEDIUM","LARGE","EXTRA_LARGE","stepSizes","XS","SM","MD","LG","XL"],"sources":["../../../src/StepNavigation/DefaultNavigation/utils.js"],"sourcesContent":["const getColor = (state, theme) =>\n  ({\n    Pending: theme?.hv?.palette?.semantic?.sema3 ?? \"sema3\",\n    Failed: theme?.hv?.palette?.semantic?.sema4 ?? \"sema4\",\n    Completed: theme?.hv?.palette?.semantic?.sema1 ?? \"sema1\",\n    Current: theme?.hv?.palette?.accent?.acce1 ?? \"acce1\",\n    Disabled: theme?.hv?.palette?.atmosphere?.atmo5 ?? \"atmo5\",\n  }[state]);\n\nconst EXTRA_SMALL = { container: 32, avatar: 24 };\nconst SMALL = { container: 40, avatar: 32 };\nconst MEDIUM = { container: 48, avatar: 40 };\nconst LARGE = { container: 60, avatar: 52 };\nconst EXTRA_LARGE = { container: 96, avatar: 88 };\n\nconst stepSizes = {\n  XS: EXTRA_SMALL,\n  SM: SMALL,\n  MD: MEDIUM,\n  LG: LARGE,\n  XL: EXTRA_LARGE,\n};\n\nexport { getColor, stepSizes };\n"],"mappings":";;;;;;;AAAA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAAQC,KAAR;EAAA;;EAAA,OACd;IACCC,OAAO,2BAAED,KAAF,aAAEA,KAAF,oCAAEA,KAAK,CAAEE,EAAT,mEAAE,UAAWC,OAAb,gFAAE,kBAAoBC,QAAtB,2DAAE,uBAA8BC,KAAhC,yEAAyC,OADjD;IAECC,MAAM,4BAAEN,KAAF,aAAEA,KAAF,qCAAEA,KAAK,CAAEE,EAAT,qEAAE,WAAWC,OAAb,gFAAE,mBAAoBC,QAAtB,0DAAE,sBAA8BG,KAAhC,2EAAyC,OAFhD;IAGCC,SAAS,4BAAER,KAAF,aAAEA,KAAF,qCAAEA,KAAK,CAAEE,EAAT,qEAAE,WAAWC,OAAb,gFAAE,mBAAoBC,QAAtB,0DAAE,sBAA8BK,KAAhC,2EAAyC,OAHnD;IAICC,OAAO,2BAAEV,KAAF,aAAEA,KAAF,qCAAEA,KAAK,CAAEE,EAAT,qEAAE,WAAWC,OAAb,gFAAE,mBAAoBQ,MAAtB,0DAAE,sBAA4BC,KAA9B,yEAAuC,OAJ/C;IAKCC,QAAQ,2BAAEb,KAAF,aAAEA,KAAF,qCAAEA,KAAK,CAAEE,EAAT,qEAAE,WAAWC,OAAb,gFAAE,mBAAoBW,UAAtB,0DAAE,sBAAgCC,KAAlC,yEAA2C;EALpD,EAMChB,KAND,CADc;AAAA,CAAjB;;;AASA,IAAMiB,WAAW,GAAG;EAAEC,SAAS,EAAE,EAAb;EAAiBC,MAAM,EAAE;AAAzB,CAApB;AACA,IAAMC,KAAK,GAAG;EAAEF,SAAS,EAAE,EAAb;EAAiBC,MAAM,EAAE;AAAzB,CAAd;AACA,IAAME,MAAM,GAAG;EAAEH,SAAS,EAAE,EAAb;EAAiBC,MAAM,EAAE;AAAzB,CAAf;AACA,IAAMG,KAAK,GAAG;EAAEJ,SAAS,EAAE,EAAb;EAAiBC,MAAM,EAAE;AAAzB,CAAd;AACA,IAAMI,WAAW,GAAG;EAAEL,SAAS,EAAE,EAAb;EAAiBC,MAAM,EAAE;AAAzB,CAApB;AAEA,IAAMK,SAAS,GAAG;EAChBC,EAAE,EAAER,WADY;EAEhBS,EAAE,EAAEN,KAFY;EAGhBO,EAAE,EAAEN,MAHY;EAIhBO,EAAE,EAAEN,KAJY;EAKhBO,EAAE,EAAEN;AALY,CAAlB"}
+{"version":3,"file":"utils.js","names":["getColor","state","theme","Pending","hv","palette","semantic","sema3","Failed","sema4","Completed","sema1","Current","accent","acce1","Disabled","atmosphere","atmo5","Enabled","EXTRA_SMALL","container","avatar","SMALL","MEDIUM","LARGE","EXTRA_LARGE","stepSizes","XS","SM","MD","LG","XL"],"sources":["../../../src/StepNavigation/DefaultNavigation/utils.js"],"sourcesContent":["const getColor = (state, theme) =>\n  ({\n    Pending: theme?.hv?.palette?.semantic?.sema3 ?? \"sema3\",\n    Failed: theme?.hv?.palette?.semantic?.sema4 ?? \"sema4\",\n    Completed: theme?.hv?.palette?.semantic?.sema1 ?? \"sema1\",\n    Current: theme?.hv?.palette?.accent?.acce1 ?? \"acce1\",\n    Disabled: theme?.hv?.palette?.atmosphere?.atmo5 ?? \"atmo5\",\n    Enabled: theme?.hv?.palette?.accent?.acce1 ?? \"acce1\",\n  }[state]);\n\nconst EXTRA_SMALL = { container: 32, avatar: 24 };\nconst SMALL = { container: 40, avatar: 32 };\nconst MEDIUM = { container: 48, avatar: 40 };\nconst LARGE = { container: 60, avatar: 52 };\nconst EXTRA_LARGE = { container: 96, avatar: 88 };\n\nconst stepSizes = {\n  XS: EXTRA_SMALL,\n  SM: SMALL,\n  MD: MEDIUM,\n  LG: LARGE,\n  XL: EXTRA_LARGE,\n};\n\nexport { getColor, stepSizes };\n"],"mappings":";;;;;;;AAAA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAAQC,KAAR;EAAA;;EAAA,OACd;IACCC,OAAO,2BAAED,KAAF,aAAEA,KAAF,oCAAEA,KAAK,CAAEE,EAAT,mEAAE,UAAWC,OAAb,gFAAE,kBAAoBC,QAAtB,2DAAE,uBAA8BC,KAAhC,yEAAyC,OADjD;IAECC,MAAM,4BAAEN,KAAF,aAAEA,KAAF,qCAAEA,KAAK,CAAEE,EAAT,qEAAE,WAAWC,OAAb,gFAAE,mBAAoBC,QAAtB,0DAAE,sBAA8BG,KAAhC,2EAAyC,OAFhD;IAGCC,SAAS,4BAAER,KAAF,aAAEA,KAAF,qCAAEA,KAAK,CAAEE,EAAT,qEAAE,WAAWC,OAAb,gFAAE,mBAAoBC,QAAtB,0DAAE,sBAA8BK,KAAhC,2EAAyC,OAHnD;IAICC,OAAO,2BAAEV,KAAF,aAAEA,KAAF,qCAAEA,KAAK,CAAEE,EAAT,qEAAE,WAAWC,OAAb,gFAAE,mBAAoBQ,MAAtB,0DAAE,sBAA4BC,KAA9B,yEAAuC,OAJ/C;IAKCC,QAAQ,2BAAEb,KAAF,aAAEA,KAAF,qCAAEA,KAAK,CAAEE,EAAT,qEAAE,WAAWC,OAAb,gFAAE,mBAAoBW,UAAtB,0DAAE,sBAAgCC,KAAlC,yEAA2C,OALpD;IAMCC,OAAO,4BAAEhB,KAAF,aAAEA,KAAF,qCAAEA,KAAK,CAAEE,EAAT,qEAAE,WAAWC,OAAb,gFAAE,mBAAoBQ,MAAtB,0DAAE,sBAA4BC,KAA9B,2EAAuC;EAN/C,EAOCb,KAPD,CADc;AAAA,CAAjB;;;AAUA,IAAMkB,WAAW,GAAG;EAAEC,SAAS,EAAE,EAAb;EAAiBC,MAAM,EAAE;AAAzB,CAApB;AACA,IAAMC,KAAK,GAAG;EAAEF,SAAS,EAAE,EAAb;EAAiBC,MAAM,EAAE;AAAzB,CAAd;AACA,IAAME,MAAM,GAAG;EAAEH,SAAS,EAAE,EAAb;EAAiBC,MAAM,EAAE;AAAzB,CAAf;AACA,IAAMG,KAAK,GAAG;EAAEJ,SAAS,EAAE,EAAb;EAAiBC,MAAM,EAAE;AAAzB,CAAd;AACA,IAAMI,WAAW,GAAG;EAAEL,SAAS,EAAE,EAAb;EAAiBC,MAAM,EAAE;AAAzB,CAApB;AAEA,IAAMK,SAAS,GAAG;EAChBC,EAAE,EAAER,WADY;EAEhBS,EAAE,EAAEN,KAFY;EAGhBO,EAAE,EAAEN,MAHY;EAIhBO,EAAE,EAAEN,KAJY;EAKhBO,EAAE,EAAEN;AALY,CAAlB"}

package/dist/StepNavigation/SimpleNavigation/Dot/Dot.d.ts

@@ -5,6 +5,6 @@ import { HvStepProps } from "../../DefaultNavigation/Step";
 export type HvDotClassKey = "root";
 
 export type HvDotProps = StandardProps<React.HTMLAttributes<HTMLDivElement>, HvDotClassKey> &
-  Pick<HvStepProps, "size" | "title" | "state" | "onClick">;
+  Pick<HvStepProps, "size" | "title" | "state" | "onClick" | "disabled">;
 
 export default function HvDot(props: HvDotProps): JSX.Element | null;

package/dist/StepNavigation/SimpleNavigation/Dot/Dot.js

@@ -68,14 +68,12 @@ var HvDot = function HvDot(_ref) {
       state = _ref.state,
       title = _ref.title,
       size = _ref.size,
-      onClick = _ref.onClick;
+      onClick = _ref.onClick,
+      disabled = _ref.disabled;
   var dotSize = _utils.dotSizes[size] * (state === "Current" ? 1.5 : 1);
-  var getBackgroundColor = (0, _react.useCallback)(function (theme) {
-    return state === "Disabled" ? (0, _utils.disabledColor)(theme) : (0, _utils.defaultColor)(theme);
-  }, [state]);
   var customClasses = (0, _react.useMemo)(function () {
     return (0, _core.makeStyles)(function (theme) {
-      var backgroundColor = getBackgroundColor(theme);
+      var backgroundColor = (0, _utils.getColor)(state, theme);
       return {
         ghostDisabled: {},
         active: {},
@@ -95,13 +93,13 @@ var HvDot = function HvDot(_ref) {
         })
       };
     });
-  }, [dotSize, getBackgroundColor])();
+  }, [dotSize, state])();
   return /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvButton, {
-    className: (0, _clsx.default)(classes.root, customClasses.ghost, className, "Current Disabled".includes(state) && customClasses.ghostDisabled, state === "Current" && customClasses.active),
+    className: (0, _clsx.default)(classes.root, customClasses.ghost, (disabled !== null && disabled !== void 0 ? disabled : "Current Disabled".includes(state)) && customClasses.ghostDisabled, className, state === "Current" && customClasses.active),
     "aria-label": "step-".concat(title),
     icon: true,
     overrideIconColors: false,
-    disabled: ["Current", "Disabled"].includes(state),
+    disabled: disabled !== null && disabled !== void 0 ? disabled : ["Current", "Disabled"].includes(state),
     onClick: onClick
   }, []);
 };
@@ -155,7 +153,13 @@ process.env.NODE_ENV !== "production" ? HvDot.propTypes = {
   /**
    * Event onClick of the step.
    */
-  onClick: _propTypes.default.func
+  onClick: _propTypes.default.func,
+
+  /**
+   * Define if a step is disabled/enabled.
+   * If this property is not defined and the step is on state "Disabled", the step component will be disabled
+   */
+  disabled: _propTypes.default.bool
 } : void 0;
 
 var _default = (0, _core.withStyles)(_styles.default, {

package/dist/StepNavigation/SimpleNavigation/Dot/Dot.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dot.js","names":["HvDot","classes","className","state","title","size","onClick","dotSize","dotSizes","getBackgroundColor","useCallback","theme","disabledColor","defaultColor","customClasses","useMemo","makeStyles","backgroundColor","ghostDisabled","active","ghost","styles","width","height","clsx","root","includes","propTypes","PropTypes","string","shape","isRequired","oneOf","func","withStyles","name"],"sources":["../../../../src/StepNavigation/SimpleNavigation/Dot/Dot.js"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { HvButton } from \"@hitachivantara/uikit-react-core\";\nimport { makeStyles, withStyles } from \"@material-ui/core\";\n\nimport { defaultColor, disabledColor, dotSizes } from \"../utils\";\nimport styles from \"./styles\";\n\n/**\n * Step element of \"Simple\" Step Navigation root component\n */\nconst HvDot = ({ classes, className, state, title, size, onClick }) => {\n  const dotSize = dotSizes[size] * (state === \"Current\" ? 1.5 : 1);\n  const getBackgroundColor = useCallback(\n    (theme) => (state === \"Disabled\" ? disabledColor(theme) : defaultColor(theme)),\n    [state]\n  );\n  const customClasses = useMemo(\n    () =>\n      makeStyles((theme) => {\n        const backgroundColor = getBackgroundColor(theme);\n        return {\n          ghostDisabled: {},\n          active: {},\n          ghost: {\n            ...styles.ghost,\n            width: dotSize,\n            height: dotSize,\n            backgroundColor,\n            \"&:hover\": {\n              backgroundColor,\n            },\n            \"&$ghostDisabled\": {\n              ...styles.ghost[\"&$ghostDisabled\"],\n              backgroundColor,\n            },\n            \"&$ghostDisabled&:hover\": {\n              ...styles.ghost[\"&$ghostDisabled&:hover\"],\n              backgroundColor,\n            },\n          },\n        };\n      }),\n    [dotSize, getBackgroundColor]\n  )();\n  return (\n    <HvButton\n      className={clsx(\n        classes.root,\n        customClasses.ghost,\n        {\n          [customClasses.active]: state === \"Current\",\n          [customClasses.ghostDisabled]: [\"Current\", \"Disabled\"].includes(state),\n        },\n        className\n      )}\n      aria-label={`step-${title}`}\n      icon\n      overrideIconColors={false}\n      disabled={[\"Current\", \"Disabled\"].includes(state)}\n      onClick={onClick}\n    >\n      {[]}\n    </HvButton>\n  );\n};\n\nHvDot.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the active class.\n     */\n    active: PropTypes.string,\n    /**\n     * Styles applied to the ghost class.\n     */\n    ghost: PropTypes.string,\n    /**\n     * Styles applied to the ghostDisabled class.\n     */\n    ghostDisabled: PropTypes.string,\n  }).isRequired,\n  /**\n   * State of the step. Values = {\"Pending\", \"Failed\", \"Completed\", \"Current\", \"Disabled\"}\n   */\n  state: PropTypes.oneOf([\"Pending\", \"Failed\", \"Completed\", \"Current\", \"Disabled\"]).isRequired,\n  /**\n   * Title of the step.\n   */\n  title: PropTypes.string.isRequired,\n  /**\n   * Sets one of the standard sizes of the steps\n   */\n  size: PropTypes.oneOf([\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]).isRequired,\n  /**\n   * Event onClick of the step.\n   */\n  onClick: PropTypes.func,\n};\n\nexport default withStyles(styles, { name: \"HvDot\" })(HvDot);\n"],"mappings":"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"}
+{"version":3,"file":"Dot.js","names":["HvDot","classes","className","state","title","size","onClick","disabled","dotSize","dotSizes","customClasses","useMemo","makeStyles","theme","backgroundColor","getColor","ghostDisabled","active","ghost","styles","width","height","clsx","root","includes","propTypes","PropTypes","string","shape","isRequired","oneOf","func","bool","withStyles","name"],"sources":["../../../../src/StepNavigation/SimpleNavigation/Dot/Dot.js"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { HvButton } from \"@hitachivantara/uikit-react-core\";\nimport { makeStyles, withStyles } from \"@material-ui/core\";\n\nimport { getColor, dotSizes } from \"../utils\";\nimport styles from \"./styles\";\n\n/**\n * Step element of \"Simple\" Step Navigation root component\n */\nconst HvDot = ({ classes, className, state, title, size, onClick, disabled }) => {\n  const dotSize = dotSizes[size] * (state === \"Current\" ? 1.5 : 1);\n  const customClasses = useMemo(\n    () =>\n      makeStyles((theme) => {\n        const backgroundColor = getColor(state, theme);\n        return {\n          ghostDisabled: {},\n          active: {},\n          ghost: {\n            ...styles.ghost,\n            width: dotSize,\n            height: dotSize,\n            backgroundColor,\n            \"&:hover\": {\n              backgroundColor,\n            },\n            \"&$ghostDisabled\": {\n              ...styles.ghost[\"&$ghostDisabled\"],\n              backgroundColor,\n            },\n            \"&$ghostDisabled&:hover\": {\n              ...styles.ghost[\"&$ghostDisabled&:hover\"],\n              backgroundColor,\n            },\n          },\n        };\n      }),\n    [dotSize, state]\n  )();\n  return (\n    <HvButton\n      className={clsx(\n        classes.root,\n        customClasses.ghost,\n        {\n          [customClasses.active]: state === \"Current\",\n          [customClasses.ghostDisabled]: disabled ?? [\"Current\", \"Disabled\"].includes(state),\n        },\n        className\n      )}\n      aria-label={`step-${title}`}\n      icon\n      overrideIconColors={false}\n      disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n      onClick={onClick}\n    >\n      {[]}\n    </HvButton>\n  );\n};\n\nHvDot.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the active class.\n     */\n    active: PropTypes.string,\n    /**\n     * Styles applied to the ghost class.\n     */\n    ghost: PropTypes.string,\n    /**\n     * Styles applied to the ghostDisabled class.\n     */\n    ghostDisabled: PropTypes.string,\n  }).isRequired,\n  /**\n   * State of the step. Values = {\"Pending\", \"Failed\", \"Completed\", \"Current\", \"Disabled\"}\n   */\n  state: PropTypes.oneOf([\"Pending\", \"Failed\", \"Completed\", \"Current\", \"Disabled\"]).isRequired,\n  /**\n   * Title of the step.\n   */\n  title: PropTypes.string.isRequired,\n  /**\n   * Sets one of the standard sizes of the steps\n   */\n  size: PropTypes.oneOf([\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]).isRequired,\n  /**\n   * Event onClick of the step.\n   */\n  onClick: PropTypes.func,\n  /**\n   * Define if a step is disabled/enabled.\n   * If this property is not defined and the step is on state \"Disabled\", the step component will be disabled\n   */\n  disabled: PropTypes.bool,\n};\n\nexport default withStyles(styles, { name: \"HvDot\" })(HvDot);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AAEA;;AACA;;;;;;;;;;AAEA;AACA;AACA;AACA,IAAMA,KAAK,GAAG,SAARA,KAAQ,OAAmE;EAAA,IAAhEC,OAAgE,QAAhEA,OAAgE;EAAA,IAAvDC,SAAuD,QAAvDA,SAAuD;EAAA,IAA5CC,KAA4C,QAA5CA,KAA4C;EAAA,IAArCC,KAAqC,QAArCA,KAAqC;EAAA,IAA9BC,IAA8B,QAA9BA,IAA8B;EAAA,IAAxBC,OAAwB,QAAxBA,OAAwB;EAAA,IAAfC,QAAe,QAAfA,QAAe;EAC/E,IAAMC,OAAO,GAAGC,eAAA,CAASJ,IAAT,KAAkBF,KAAK,KAAK,SAAV,GAAsB,GAAtB,GAA4B,CAA9C,CAAhB;EACA,IAAMO,aAAa,GAAG,IAAAC,cAAA,EACpB;IAAA,OACE,IAAAC,gBAAA,EAAW,UAACC,KAAD,EAAW;MACpB,IAAMC,eAAe,GAAG,IAAAC,eAAA,EAASZ,KAAT,EAAgBU,KAAhB,CAAxB;MACA,OAAO;QACLG,aAAa,EAAE,EADV;QAELC,MAAM,EAAE,EAFH;QAGLC,KAAK,kCACAC,eAAA,CAAOD,KADP;UAEHE,KAAK,EAAEZ,OAFJ;UAGHa,MAAM,EAAEb,OAHL;UAIHM,eAAe,EAAfA,eAJG;UAKH,WAAW;YACTA,eAAe,EAAfA;UADS,CALR;UAQH,mDACKK,eAAA,CAAOD,KAAP,CAAa,iBAAb,CADL;YAEEJ,eAAe,EAAfA;UAFF,EARG;UAYH,0DACKK,eAAA,CAAOD,KAAP,CAAa,wBAAb,CADL;YAEEJ,eAAe,EAAfA;UAFF;QAZG;MAHA,CAAP;IAqBD,CAvBD,CADF;EAAA,CADoB,EA0BpB,CAACN,OAAD,EAAUL,KAAV,CA1BoB,GAAtB;EA4BA,oBACE,6BAAC,wBAAD;IACE,SAAS,EAAE,IAAAmB,aAAA,EACTrB,OAAO,CAACsB,IADC,EAETb,aAAa,CAACQ,KAFL,GAKwBX,QALxB,aAKwBA,QALxB,cAKwBA,QALxB,GAKoC,mBAAwBiB,QAAxB,CAAiCrB,KAAjC,CALpC,KAKNO,aAAa,CAACM,aALR,EAOTd,SAPS,EAIiBC,KAAK,KAAK,SAJ3B,IAINO,aAAa,CAACO,MAJR,CADb;IAUE,6BAAoBb,KAApB,CAVF;IAWE,IAAI,MAXN;IAYE,kBAAkB,EAAE,KAZtB;IAaE,QAAQ,EAAEG,QAAF,aAAEA,QAAF,cAAEA,QAAF,GAAc,CAAC,SAAD,EAAY,UAAZ,EAAwBiB,QAAxB,CAAiCrB,KAAjC,CAbxB;IAcE,OAAO,EAAEG;EAdX,GAgBG,EAhBH,CADF;AAoBD,CAlDD;;AAoDA,wCAAAN,KAAK,CAACyB,SAAN,GAAkB;EAChB;AACF;AACA;EACEvB,SAAS,EAAEwB,kBAAA,CAAUC,MAJL;;EAKhB;AACF;AACA;EACE1B,OAAO,EAAEyB,kBAAA,CAAUE,KAAV,CAAgB;IACvB;AACJ;AACA;IACIL,IAAI,EAAEG,kBAAA,CAAUC,MAJO;;IAKvB;AACJ;AACA;IACIV,MAAM,EAAES,kBAAA,CAAUC,MARK;;IASvB;AACJ;AACA;IACIT,KAAK,EAAEQ,kBAAA,CAAUC,MAZM;;IAavB;AACJ;AACA;IACIX,aAAa,EAAEU,kBAAA,CAAUC;EAhBF,CAAhB,EAiBNE,UAzBa;;EA0BhB;AACF;AACA;EACE1B,KAAK,EAAEuB,kBAAA,CAAUI,KAAV,CAAgB,CAAC,SAAD,EAAY,QAAZ,EAAsB,WAAtB,EAAmC,SAAnC,EAA8C,UAA9C,CAAhB,EAA2ED,UA7BlE;;EA8BhB;AACF;AACA;EACEzB,KAAK,EAAEsB,kBAAA,CAAUC,MAAV,CAAiBE,UAjCR;;EAkChB;AACF;AACA;EACExB,IAAI,EAAEqB,kBAAA,CAAUI,KAAV,CAAgB,CAAC,IAAD,EAAO,IAAP,EAAa,IAAb,EAAmB,IAAnB,EAAyB,IAAzB,CAAhB,EAAgDD,UArCtC;;EAsChB;AACF;AACA;EACEvB,OAAO,EAAEoB,kBAAA,CAAUK,IAzCH;;EA0ChB;AACF;AACA;AACA;EACExB,QAAQ,EAAEmB,kBAAA,CAAUM;AA9CJ,CAAlB;;eAiDe,IAAAC,gBAAA,EAAWd,eAAX,EAAmB;EAAEe,IAAI,EAAE;AAAR,CAAnB,EAAsClC,KAAtC,C"}

package/dist/StepNavigation/SimpleNavigation/SimpleNavigation.d.ts

@@ -1,6 +1,8 @@
 import * as React from "react";
 import { StandardProps } from "@material-ui/core";
 
+import { HvTheme } from "@hitachivantara/uikit-react-core";
+
 import { HvStepNavigationProps } from "../StepNavigation";
 import { HvDotProps } from "./Dot";
 
@@ -12,7 +14,7 @@ export type ComponentChildProps = {
   separatorValues: {
     minWidth: number;
     maxWidth: number;
-    getColor: (state: HvDotProps["state"]) => any;
+    getColor: (state: HvDotProps["state"], theme: HvTheme) => any;
     height: number;
   };
   stepValues: {

package/dist/StepNavigation/SimpleNavigation/SimpleNavigation.js

@@ -7,8 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-require("core-js/modules/es.array.includes.js");
-
 require("core-js/modules/es.array.concat.js");
 
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
@@ -37,8 +35,7 @@ var HvSimpleNavigation = function HvSimpleNavigation(_ref) {
       getDynamicValues = _ref.getDynamicValues,
       children = _ref.children,
       other = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var theme = (0, _core.useTheme)(); // step values
-
+  // step values
   var dotSize = _utils.dotSizes[stepSize];
   var StepComponent = _Dot.default; //
 
@@ -50,10 +47,6 @@ var HvSimpleNavigation = function HvSimpleNavigation(_ref) {
       separatorWidth = _getDynamicValues.separatorWidth; // separator values
 
 
-  var getColor = function getColor(state) {
-    return ["Current", "Disabled"].includes(state) ? (0, _utils.disabledColor)(theme) : (0, _utils.defaultColor)(theme);
-  };
-
   var maxWidth = Math.max(titleWidth - dotSize, separatorWidth);
   var minWidth = Math.max(titleWidth - dotSize * 1.25, separatorWidth); //
 
@@ -72,7 +65,7 @@ var HvSimpleNavigation = function HvSimpleNavigation(_ref) {
     separatorValues: {
       minWidth: minWidth,
       maxWidth: maxWidth,
-      getColor: getColor,
+      getColor: _utils.getColor,
       height: 2
     },
     stepValues: {

package/dist/StepNavigation/SimpleNavigation/SimpleNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"SimpleNavigation.js","names":["HvSimpleNavigation","numSteps","stepSize","getTitles","getDynamicValues","children","other","theme","useTheme","dotSize","dotSizes","StepComponent","HvDot","stepsWidth","width","titleWidth","separatorWidth","getColor","state","includes","disabledColor","defaultColor","maxWidth","Math","max","minWidth","Steps","titles","rawTitle","number","title","navWidth","separatorValues","height","stepValues","minSize","maxSize","propTypes","className","PropTypes","string","classes","shape","root","isRequired","oneOf","func","elementType","withStyles","styles","name"],"sources":["../../../src/StepNavigation/SimpleNavigation/SimpleNavigation.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport { useTheme, withStyles } from \"@material-ui/core\";\n\nimport HvDot from \"./Dot\";\nimport { defaultColor, disabledColor, dotSizes } from \"./utils\";\nimport styles from \"./styles\";\n\n/**\n * Simple Navigation\n */\nconst HvSimpleNavigation = ({\n  numSteps,\n  stepSize,\n  getTitles,\n  getDynamicValues,\n  children,\n  ...other\n}) => {\n  const theme = useTheme();\n\n  // step values\n  const dotSize = dotSizes[stepSize];\n  const StepComponent = HvDot;\n  //\n\n  const stepsWidth = (numSteps + 0.5) * dotSize;\n  const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);\n\n  // separator values\n  const getColor = (state) =>\n    [\"Current\", \"Disabled\"].includes(state) ? disabledColor(theme) : defaultColor(theme);\n  const maxWidth = Math.max(titleWidth - dotSize, separatorWidth);\n  const minWidth = Math.max(titleWidth - dotSize * 1.25, separatorWidth);\n  //\n\n  const Steps = children;\n\n  const titles = getTitles(({ rawTitle, number }) => ({\n    title: `${number}. ${rawTitle}`,\n    titleWidth,\n  }));\n\n  return (\n    <div {...other}>\n      {titles}\n      <Steps\n        {...{\n          stepsWidth,\n          navWidth: width,\n          separatorValues: {\n            minWidth,\n            maxWidth,\n            getColor,\n            height: 2,\n          },\n          stepValues: {\n            minSize: dotSize,\n            maxSize: 1.5 * dotSize,\n            StepComponent,\n          },\n        }}\n      />\n    </div>\n  );\n};\n\nHvSimpleNavigation.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n  }).isRequired,\n  /**\n   * Number of steps to show on the component.\n   */\n  numSteps: PropTypes.number.isRequired,\n  /**\n   * Sets one of the standard sizes of the steps\n   */\n  stepSize: PropTypes.oneOf([\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]).isRequired,\n  /**\n   * Returns dynamic width values of the component (width, titleWidth, separatorWidth).\n   */\n  getDynamicValues: PropTypes.func.isRequired,\n  /**\n   * Returns a JSX.element of the titles container.\n   */\n  getTitles: PropTypes.func.isRequired,\n  /**\n   * Component to render Step Navigation with props = {separatorValues, stepValues, stepsWidth}\n   */\n  children: PropTypes.elementType.isRequired,\n};\n\nexport default withStyles(styles, { name: \"HvSimpleNavigation\" })(HvSimpleNavigation);\n"],"mappings":"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"}
+{"version":3,"file":"SimpleNavigation.js","names":["HvSimpleNavigation","numSteps","stepSize","getTitles","getDynamicValues","children","other","dotSize","dotSizes","StepComponent","HvDot","stepsWidth","width","titleWidth","separatorWidth","maxWidth","Math","max","minWidth","Steps","titles","rawTitle","number","title","navWidth","separatorValues","getColor","height","stepValues","minSize","maxSize","propTypes","className","PropTypes","string","classes","shape","root","isRequired","oneOf","func","elementType","withStyles","styles","name"],"sources":["../../../src/StepNavigation/SimpleNavigation/SimpleNavigation.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport { withStyles } from \"@material-ui/core\";\n\nimport HvDot from \"./Dot\";\nimport { getColor, dotSizes } from \"./utils\";\nimport styles from \"./styles\";\n\n/**\n * Simple Navigation\n */\nconst HvSimpleNavigation = ({\n  numSteps,\n  stepSize,\n  getTitles,\n  getDynamicValues,\n  children,\n  ...other\n}) => {\n  // step values\n  const dotSize = dotSizes[stepSize];\n  const StepComponent = HvDot;\n  //\n\n  const stepsWidth = (numSteps + 0.5) * dotSize;\n  const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);\n\n  // separator values\n  const maxWidth = Math.max(titleWidth - dotSize, separatorWidth);\n  const minWidth = Math.max(titleWidth - dotSize * 1.25, separatorWidth);\n  //\n\n  const Steps = children;\n\n  const titles = getTitles(({ rawTitle, number }) => ({\n    title: `${number}. ${rawTitle}`,\n    titleWidth,\n  }));\n\n  return (\n    <div {...other}>\n      {titles}\n      <Steps\n        {...{\n          stepsWidth,\n          navWidth: width,\n          separatorValues: {\n            minWidth,\n            maxWidth,\n            getColor,\n            height: 2,\n          },\n          stepValues: {\n            minSize: dotSize,\n            maxSize: 1.5 * dotSize,\n            StepComponent,\n          },\n        }}\n      />\n    </div>\n  );\n};\n\nHvSimpleNavigation.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n  }).isRequired,\n  /**\n   * Number of steps to show on the component.\n   */\n  numSteps: PropTypes.number.isRequired,\n  /**\n   * Sets one of the standard sizes of the steps\n   */\n  stepSize: PropTypes.oneOf([\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]).isRequired,\n  /**\n   * Returns dynamic width values of the component (width, titleWidth, separatorWidth).\n   */\n  getDynamicValues: PropTypes.func.isRequired,\n  /**\n   * Returns a JSX.element of the titles container.\n   */\n  getTitles: PropTypes.func.isRequired,\n  /**\n   * Component to render Step Navigation with props = {separatorValues, stepValues, stepsWidth}\n   */\n  children: PropTypes.elementType.isRequired,\n};\n\nexport default withStyles(styles, { name: \"HvSimpleNavigation\" })(HvSimpleNavigation);\n"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AAEA;;AAEA;;AACA;;AACA;;;;AAEA;AACA;AACA;AACA,IAAMA,kBAAkB,GAAG,SAArBA,kBAAqB,OAOrB;EAAA,IANJC,QAMI,QANJA,QAMI;EAAA,IALJC,QAKI,QALJA,QAKI;EAAA,IAJJC,SAII,QAJJA,SAII;EAAA,IAHJC,gBAGI,QAHJA,gBAGI;EAAA,IAFJC,QAEI,QAFJA,QAEI;EAAA,IADDC,KACC;EACJ;EACA,IAAMC,OAAO,GAAGC,eAAA,CAASN,QAAT,CAAhB;EACA,IAAMO,aAAa,GAAGC,YAAtB,CAHI,CAIJ;;EAEA,IAAMC,UAAU,GAAG,CAACV,QAAQ,GAAG,GAAZ,IAAmBM,OAAtC;;EACA,wBAA8CH,gBAAgB,CAACO,UAAD,CAA9D;EAAA,IAAQC,KAAR,qBAAQA,KAAR;EAAA,IAAeC,UAAf,qBAAeA,UAAf;EAAA,IAA2BC,cAA3B,qBAA2BA,cAA3B,CAPI,CASJ;;;EACA,IAAMC,QAAQ,GAAGC,IAAI,CAACC,GAAL,CAASJ,UAAU,GAAGN,OAAtB,EAA+BO,cAA/B,CAAjB;EACA,IAAMI,QAAQ,GAAGF,IAAI,CAACC,GAAL,CAASJ,UAAU,GAAGN,OAAO,GAAG,IAAhC,EAAsCO,cAAtC,CAAjB,CAXI,CAYJ;;EAEA,IAAMK,KAAK,GAAGd,QAAd;EAEA,IAAMe,MAAM,GAAGjB,SAAS,CAAC;IAAA,IAAGkB,QAAH,SAAGA,QAAH;IAAA,IAAaC,MAAb,SAAaA,MAAb;IAAA,OAA2B;MAClDC,KAAK,YAAKD,MAAL,eAAgBD,QAAhB,CAD6C;MAElDR,UAAU,EAAVA;IAFkD,CAA3B;EAAA,CAAD,CAAxB;EAKA,oBACE,oCAASP,KAAT,EACGc,MADH,eAEE,6BAAC,KAAD;IAEIT,UAAU,EAAVA,UAFJ;IAGIa,QAAQ,EAAEZ,KAHd;IAIIa,eAAe,EAAE;MACfP,QAAQ,EAARA,QADe;MAEfH,QAAQ,EAARA,QAFe;MAGfW,QAAQ,EAARA,eAHe;MAIfC,MAAM,EAAE;IAJO,CAJrB;IAUIC,UAAU,EAAE;MACVC,OAAO,EAAEtB,OADC;MAEVuB,OAAO,EAAE,MAAMvB,OAFL;MAGVE,aAAa,EAAbA;IAHU;EAVhB,EAFF,CADF;AAsBD,CAlDD;;AAoDA,wCAAAT,kBAAkB,CAAC+B,SAAnB,GAA+B;EAC7B;AACF;AACA;EACEC,SAAS,EAAEC,kBAAA,CAAUC,MAJQ;;EAK7B;AACF;AACA;EACEC,OAAO,EAAEF,kBAAA,CAAUG,KAAV,CAAgB;IACvB;AACJ;AACA;IACIC,IAAI,EAAEJ,kBAAA,CAAUC;EAJO,CAAhB,EAKNI,UAb0B;;EAc7B;AACF;AACA;EACErC,QAAQ,EAAEgC,kBAAA,CAAUX,MAAV,CAAiBgB,UAjBE;;EAkB7B;AACF;AACA;EACEpC,QAAQ,EAAE+B,kBAAA,CAAUM,KAAV,CAAgB,CAAC,IAAD,EAAO,IAAP,EAAa,IAAb,EAAmB,IAAnB,EAAyB,IAAzB,CAAhB,EAAgDD,UArB7B;;EAsB7B;AACF;AACA;EACElC,gBAAgB,EAAE6B,kBAAA,CAAUO,IAAV,CAAeF,UAzBJ;;EA0B7B;AACF;AACA;EACEnC,SAAS,EAAE8B,kBAAA,CAAUO,IAAV,CAAeF,UA7BG;;EA8B7B;AACF;AACA;EACEjC,QAAQ,EAAE4B,kBAAA,CAAUQ,WAAV,CAAsBH;AAjCH,CAA/B;;eAoCe,IAAAI,gBAAA,EAAWC,eAAX,EAAmB;EAAEC,IAAI,EAAE;AAAR,CAAnB,EAAmD5C,kBAAnD,C"}

package/dist/StepNavigation/SimpleNavigation/utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.dotSizes = exports.disabledColor = exports.defaultColor = void 0;
+exports.getColor = exports.dotSizes = void 0;
 var dotSizes = {
   XS: 8,
   SM: 10,
@@ -14,18 +14,20 @@ var dotSizes = {
 exports.dotSizes = dotSizes;
 
 var defaultColor = function defaultColor(theme) {
-  var _theme$hv, _theme$hv$palette, _theme$hv$palette$acc;
+  var _theme$hv$palette$acc, _theme$hv, _theme$hv$palette, _theme$hv$palette$acc2;
 
-  return theme === null || theme === void 0 ? void 0 : (_theme$hv = theme.hv) === null || _theme$hv === void 0 ? void 0 : (_theme$hv$palette = _theme$hv.palette) === null || _theme$hv$palette === void 0 ? void 0 : (_theme$hv$palette$acc = _theme$hv$palette.accent) === null || _theme$hv$palette$acc === void 0 ? void 0 : _theme$hv$palette$acc.acce1;
+  return (_theme$hv$palette$acc = theme === null || theme === void 0 ? void 0 : (_theme$hv = theme.hv) === null || _theme$hv === void 0 ? void 0 : (_theme$hv$palette = _theme$hv.palette) === null || _theme$hv$palette === void 0 ? void 0 : (_theme$hv$palette$acc2 = _theme$hv$palette.accent) === null || _theme$hv$palette$acc2 === void 0 ? void 0 : _theme$hv$palette$acc2.acce1) !== null && _theme$hv$palette$acc !== void 0 ? _theme$hv$palette$acc : "acce1";
 };
 
-exports.defaultColor = defaultColor;
-
 var disabledColor = function disabledColor(theme) {
-  var _theme$hv2, _theme$hv2$palette, _theme$hv2$palette$at;
+  var _theme$hv$palette$atm, _theme$hv2, _theme$hv2$palette, _theme$hv2$palette$at;
+
+  return (_theme$hv$palette$atm = theme === null || theme === void 0 ? void 0 : (_theme$hv2 = theme.hv) === null || _theme$hv2 === void 0 ? void 0 : (_theme$hv2$palette = _theme$hv2.palette) === null || _theme$hv2$palette === void 0 ? void 0 : (_theme$hv2$palette$at = _theme$hv2$palette.atmosphere) === null || _theme$hv2$palette$at === void 0 ? void 0 : _theme$hv2$palette$at.atmo5) !== null && _theme$hv$palette$atm !== void 0 ? _theme$hv$palette$atm : "atmo5";
+};
 
-  return theme === null || theme === void 0 ? void 0 : (_theme$hv2 = theme.hv) === null || _theme$hv2 === void 0 ? void 0 : (_theme$hv2$palette = _theme$hv2.palette) === null || _theme$hv2$palette === void 0 ? void 0 : (_theme$hv2$palette$at = _theme$hv2$palette.atmosphere) === null || _theme$hv2$palette$at === void 0 ? void 0 : _theme$hv2$palette$at.atmo5;
+var getColor = function getColor(state, theme) {
+  return state === "Disabled" ? disabledColor(theme) : defaultColor(theme);
 };
 
-exports.disabledColor = disabledColor;
+exports.getColor = getColor;
 //# sourceMappingURL=utils.js.map

package/dist/StepNavigation/SimpleNavigation/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","names":["dotSizes","XS","SM","MD","LG","XL","defaultColor","theme","hv","palette","accent","acce1","disabledColor","atmosphere","atmo5"],"sources":["../../../src/StepNavigation/SimpleNavigation/utils.js"],"sourcesContent":["const dotSizes = {\n  XS: 8,\n  SM: 10,\n  MD: 12,\n  LG: 14,\n  XL: 16,\n};\n\nconst defaultColor = (theme) => theme?.hv?.palette?.accent?.acce1;\nconst disabledColor = (theme) => theme?.hv?.palette?.atmosphere?.atmo5;\n\nexport { dotSizes, defaultColor, disabledColor };\n"],"mappings":";;;;;;AAAA,IAAMA,QAAQ,GAAG;EACfC,EAAE,EAAE,CADW;EAEfC,EAAE,EAAE,EAFW;EAGfC,EAAE,EAAE,EAHW;EAIfC,EAAE,EAAE,EAJW;EAKfC,EAAE,EAAE;AALW,CAAjB;;;AAQA,IAAMC,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD;EAAA;;EAAA,OAAWA,KAAX,aAAWA,KAAX,oCAAWA,KAAK,CAAEC,EAAlB,mEAAW,UAAWC,OAAtB,+EAAW,kBAAoBC,MAA/B,0DAAW,sBAA4BC,KAAvC;AAAA,CAArB;;;;AACA,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACL,KAAD;EAAA;;EAAA,OAAWA,KAAX,aAAWA,KAAX,qCAAWA,KAAK,CAAEC,EAAlB,qEAAW,WAAWC,OAAtB,gFAAW,mBAAoBI,UAA/B,0DAAW,sBAAgCC,KAA3C;AAAA,CAAtB"}
+{"version":3,"file":"utils.js","names":["dotSizes","XS","SM","MD","LG","XL","defaultColor","theme","hv","palette","accent","acce1","disabledColor","atmosphere","atmo5","getColor","state"],"sources":["../../../src/StepNavigation/SimpleNavigation/utils.js"],"sourcesContent":["const dotSizes = {\n  XS: 8,\n  SM: 10,\n  MD: 12,\n  LG: 14,\n  XL: 16,\n};\n\nconst defaultColor = (theme) => theme?.hv?.palette?.accent?.acce1 ?? \"acce1\";\nconst disabledColor = (theme) => theme?.hv?.palette?.atmosphere?.atmo5 ?? \"atmo5\";\n\nconst getColor = (state, theme) =>\n  state === \"Disabled\" ? disabledColor(theme) : defaultColor(theme);\n\nexport { dotSizes, getColor };\n"],"mappings":";;;;;;AAAA,IAAMA,QAAQ,GAAG;EACfC,EAAE,EAAE,CADW;EAEfC,EAAE,EAAE,EAFW;EAGfC,EAAE,EAAE,EAHW;EAIfC,EAAE,EAAE,EAJW;EAKfC,EAAE,EAAE;AALW,CAAjB;;;AAQA,IAAMC,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD;EAAA;;EAAA,gCAAWA,KAAX,aAAWA,KAAX,oCAAWA,KAAK,CAAEC,EAAlB,mEAAW,UAAWC,OAAtB,gFAAW,kBAAoBC,MAA/B,2DAAW,uBAA4BC,KAAvC,yEAAgD,OAAhD;AAAA,CAArB;;AACA,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACL,KAAD;EAAA;;EAAA,gCAAWA,KAAX,aAAWA,KAAX,qCAAWA,KAAK,CAAEC,EAAlB,qEAAW,WAAWC,OAAtB,gFAAW,mBAAoBI,UAA/B,0DAAW,sBAAgCC,KAA3C,yEAAoD,OAApD;AAAA,CAAtB;;AAEA,IAAMC,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAAQT,KAAR;EAAA,OACfS,KAAK,KAAK,UAAV,GAAuBJ,aAAa,CAACL,KAAD,CAApC,GAA8CD,YAAY,CAACC,KAAD,CAD3C;AAAA,CAAjB"}

package/dist/StepNavigation/StepNavigation.d.ts

@@ -1,5 +1,6 @@
 import * as React from "react";
 import { StandardProps } from "@material-ui/core";
+import { Breakpoint } from "@material-ui/core/styles/createBreakpoints";
 import { HvStepProps } from "./DefaultNavigation/Step/Step";
 
 export type HvStepNavigationClassKey = "root";
@@ -15,7 +16,7 @@ export type HvStepNavigationProps = StandardProps<
   /**
    * Steps to show on the component.
    */
-  steps: Array<Pick<HvStepProps, "state" | "title" | "onClick" | "className">> & {
+  steps: Array<Pick<HvStepProps, "state" | "title" | "onClick" | "className" | "disabled">> & {
     /**
      * Class names to override styles on the separator component after the step.
      */
@@ -26,15 +27,15 @@ export type HvStepNavigationProps = StandardProps<
     titleClassName: string;
   };
   /**
-   * Sets one of the standard sizes of the steps
+   * Sets one of the standard sizes of the steps.
    */
   stepSize?: "XS" | "SM" | "MD" | "LG" | "XL";
   /**
-   * Width of the component element.
+   * Width of the component element on each breakpoint screen resolution.
    */
-  width?: number;
+  width?: { [breakpoint in Breakpoint]?: number };
   /**
-   * Defines either show a title or only a tooltip on each step component
+   * Defines either show a title or only a tooltip on each step component.
    */
   showTitles?: boolean;
 };