@hitachivantara/uikit-react-lab 3.55.0 → 4.0.1-next.2

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

@@ -1 +1 @@
-{"version":3,"file":"Dot.js","names":["React","useCallback","useMemo","PropTypes","clsx","HvButton","makeStyles","withStyles","defaultColor","disabledColor","dotSizes","styles","HvDot","classes","className","state","title","size","onClick","disabled","dotSize","getBackgroundColor","theme","customClasses","backgroundColor","ghostDisabled","active","ghost","width","height","root","includes","propTypes","string","shape","isRequired","oneOf","func","bool","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, disabled }) => {\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]: 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":"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"}
+{"version":3,"file":"Dot.js","names":["React","useCallback","useMemo","PropTypes","clsx","HvButton","withStyles","makeStyles","defaultColor","disabledColor","dotSizes","styles","HvDot","classes","className","state","title","size","onClick","disabled","dotSize","getBackgroundColor","theme","customClasses","backgroundColor","ghostDisabled","active","ghost","width","height","root","includes","propTypes","string","shape","isRequired","oneOf","func","bool","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 { withStyles, makeStyles } from \"@mui/styles\";\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, disabled }) => {\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]: 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":"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"}

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

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { StandardProps } from "@material-ui/core";
+import { StandardProps } from "@mui/material";
 
 import { HvStepNavigationProps } from "../StepNavigation";
 import { HvDotProps } from "./Dot";

package/dist/legacy/StepNavigation/SimpleNavigation/SimpleNavigation.js

@@ -1,10 +1,24 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["numSteps", "stepSize", "getTitles", "getDynamicValues", "children"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 import "core-js/modules/es.array.includes.js";
 import "core-js/modules/es.array.concat.js";
+import "core-js/modules/es.object.keys.js";
+import "core-js/modules/es.symbol.js";
+import "core-js/modules/es.array.filter.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.object.get-own-property-descriptor.js";
+import "core-js/modules/web.dom-collections.for-each.js";
+import "core-js/modules/es.object.get-own-property-descriptors.js";
 import React from "react";
 import PropTypes from "prop-types";
-import { useTheme, withStyles } from "@material-ui/core";
+import { useTheme } from "@mui/material";
+import { withStyles } from "@mui/styles";
 import HvDot from "./Dot";
 import { defaultColor, disabledColor, dotSizes } from "./utils";
 import styles from "./styles";
@@ -12,6 +26,9 @@ import styles from "./styles";
  * Simple Navigation
  */
 
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+
 var HvSimpleNavigation = function HvSimpleNavigation(_ref) {
   var numSteps = _ref.numSteps,
       stepSize = _ref.stepSize,
@@ -49,20 +66,22 @@ var HvSimpleNavigation = function HvSimpleNavigation(_ref) {
       titleWidth: titleWidth
     };
   });
-  return /*#__PURE__*/React.createElement("div", other, titles, /*#__PURE__*/React.createElement(Steps, {
-    stepsWidth: stepsWidth,
-    navWidth: width,
-    separatorValues: {
-      minWidth: minWidth,
-      maxWidth: maxWidth,
-      getColor: getColor,
-      height: 2
-    },
-    stepValues: {
-      minSize: dotSize,
-      maxSize: 1.5 * dotSize,
-      StepComponent: StepComponent
-    }
+  return /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({}, other), {}, {
+    children: [titles, /*#__PURE__*/_jsx(Steps, {
+      stepsWidth: stepsWidth,
+      navWidth: width,
+      separatorValues: {
+        minWidth: minWidth,
+        maxWidth: maxWidth,
+        getColor: getColor,
+        height: 2
+      },
+      stepValues: {
+        minSize: dotSize,
+        maxSize: 1.5 * dotSize,
+        StepComponent: StepComponent
+      }
+    })]
   }));
 };
 

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

@@ -1 +1 @@
-{"version":3,"file":"SimpleNavigation.js","names":["React","PropTypes","useTheme","withStyles","HvDot","defaultColor","disabledColor","dotSizes","styles","HvSimpleNavigation","numSteps","stepSize","getTitles","getDynamicValues","children","other","theme","dotSize","StepComponent","stepsWidth","width","titleWidth","separatorWidth","getColor","state","includes","maxWidth","Math","max","minWidth","Steps","titles","rawTitle","number","title","navWidth","separatorValues","height","stepValues","minSize","maxSize","propTypes","className","string","classes","shape","root","isRequired","oneOf","func","elementType","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":["React","PropTypes","useTheme","withStyles","HvDot","defaultColor","disabledColor","dotSizes","styles","HvSimpleNavigation","numSteps","stepSize","getTitles","getDynamicValues","children","other","theme","dotSize","StepComponent","stepsWidth","width","titleWidth","separatorWidth","getColor","state","includes","maxWidth","Math","max","minWidth","Steps","titles","rawTitle","number","title","navWidth","separatorValues","height","stepValues","minSize","maxSize","propTypes","className","string","classes","shape","root","isRequired","oneOf","func","elementType","name"],"sources":["../../../../src/StepNavigation/SimpleNavigation/SimpleNavigation.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport { useTheme } from \"@mui/material\";\nimport { withStyles } from \"@mui/styles\";\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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"}

package/dist/legacy/StepNavigation/StepNavigation.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
-import { StandardProps } from "@material-ui/core";
-import { Breakpoint } from "@material-ui/core/styles/createBreakpoints";
+import { StandardProps } from "@mui/material";
+import { Breakpoint } from "@mui/material/styles";
 import { HvStepProps } from "./DefaultNavigation/Step/Step";
 
 export type HvStepNavigationClassKey = "root";

package/dist/legacy/StepNavigation/StepNavigation.js

@@ -5,7 +5,6 @@ import "core-js/modules/es.object.get-own-property-descriptor.js";
 import "core-js/modules/web.dom-collections.for-each.js";
 import "core-js/modules/es.object.get-own-property-descriptors.js";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["className", "classes", "width", "steps", "stepSize", "showTitles", "type"],
@@ -28,7 +27,8 @@ import "core-js/modules/es.array.map.js";
 import React from "react";
 import PropTypes from "prop-types";
 import clsx from "clsx";
-import { withStyles, Typography, styled, useTheme } from "@material-ui/core";
+import { Typography, styled, useTheme } from "@mui/material";
+import { withStyles } from "@mui/styles";
 import { HvTooltip, HvTypography, useWidth } from "@hitachivantara/uikit-react-core";
 import HvDefaultNavigation from "./DefaultNavigation";
 import HvSimpleNavigation from "./SimpleNavigation";
@@ -56,6 +56,8 @@ import styles from "./styles";
  * will be 100px. If the step component has titles, each one will have 215px of width by default.
  */
 
+import { jsx as _jsx } from "react/jsx-runtime";
+
 var HvStepNavigation = function HvStepNavigation(_ref) {
   var className = _ref.className,
       classes = _ref.classes,
@@ -97,16 +99,16 @@ var HvStepNavigation = function HvStepNavigation(_ref) {
       }
     })(function (_ref2) {
       var separatorElement = _ref2.classes.separatorElement;
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/_jsx("div", {
         "aria-label": "separator-".concat(title),
         className: clsx(separatorElement, separatorClassName)
       });
     });
-    return /*#__PURE__*/React.createElement("li", {
+    return /*#__PURE__*/_jsx("li", {
       "aria-hidden": true,
-      key: "separator-".concat(title),
-      className: classes.separator
-    }, /*#__PURE__*/React.createElement(Separator, null));
+      className: classes.separator,
+      children: /*#__PURE__*/_jsx(Separator, {})
+    }, "separator-".concat(title));
   };
 
   var drawItems = function drawItems(_ref3) {
@@ -136,21 +138,26 @@ var HvStepNavigation = function HvStepNavigation(_ref) {
         number: index + 1
       }, props));
 
-      var stepElement = /*#__PURE__*/React.createElement(StepContainer, {
-        key: "step-".concat(title),
-        className: classes.li
-      }, hasTitles ? /*#__PURE__*/React.createElement(StepComponent, _extends({
-        "aria-label": "step-".concat(title)
-      }, stepProps)) : /*#__PURE__*/React.createElement(HvTooltip, {
-        placement: "bottom",
-        title: /*#__PURE__*/React.createElement(HvTypography, null, "".concat(index + 1, ". ").concat(title))
-      }, /*#__PURE__*/React.createElement("div", {
-        "aria-label": "step-container-".concat(title)
-      }, /*#__PURE__*/React.createElement(Step, {
-        className: classes.li
-      }, /*#__PURE__*/React.createElement(StepComponent, _extends({
-        "aria-label": "step-".concat(title)
-      }, stepProps))))));
+      var stepElement = /*#__PURE__*/_jsx(StepContainer, {
+        className: classes.li,
+        children: hasTitles ? /*#__PURE__*/_jsx(StepComponent, _objectSpread({
+          "aria-label": "step-".concat(title)
+        }, stepProps)) : /*#__PURE__*/_jsx(HvTooltip, {
+          placement: "bottom",
+          title: /*#__PURE__*/_jsx(HvTypography, {
+            children: "".concat(index + 1, ". ").concat(title)
+          }),
+          children: /*#__PURE__*/_jsx("div", {
+            "aria-label": "step-container-".concat(title),
+            children: /*#__PURE__*/_jsx(Step, {
+              className: classes.li,
+              children: /*#__PURE__*/_jsx(StepComponent, _objectSpread({
+                "aria-label": "step-".concat(title)
+              }, stepProps))
+            })
+          })
+        })
+      }, "step-".concat(title));
 
       if (index < steps.length - 1) {
         var separatorElement = styledSeparatorElement(title, separatorClassName, height, [steps[index + 1].state, state].includes("Current") ? minWidth : maxWidth, getColor(state));
@@ -159,9 +166,10 @@ var HvStepNavigation = function HvStepNavigation(_ref) {
 
       return [].concat(_toConsumableArray(acc), [stepElement]);
     }, []);
-    return /*#__PURE__*/React.createElement("ol", {
-      className: classes.ol
-    }, items);
+    return /*#__PURE__*/_jsx("ol", {
+      className: classes.ol,
+      children: items
+    });
   };
 
   var getDynamicValues = function getDynamicValues(stepsWidth) {
@@ -190,63 +198,66 @@ var HvStepNavigation = function HvStepNavigation(_ref) {
       }
     })(function (_ref5) {
       var stepTitle = _ref5.classes.stepTitle;
-      return title ? /*#__PURE__*/React.createElement(HvTypography, {
+      return title ? /*#__PURE__*/_jsx(HvTypography, {
         variant: variant,
-        className: clsx(stepTitle, titleClassName)
-      }, title) : null;
+        className: clsx(stepTitle, titleClassName),
+        children: title
+      }) : null;
     });
   };
 
   var getTitles = function getTitles(getTitleProps) {
-    return hasTitles ? /*#__PURE__*/React.createElement("div", {
-      className: classes.titles
-    }, steps.map(function (_ref6, index) {
-      var rawTitle = _ref6.title,
-          state = _ref6.state,
-          titleClassName = _ref6.titleClassName;
-
-      var _getTitleProps = getTitleProps({
-        state: state,
-        rawTitle: rawTitle,
-        number: index + 1
-      }),
-          _getTitleProps$varian = _getTitleProps.variant,
-          variant = _getTitleProps$varian === void 0 ? "highlightText" : _getTitleProps$varian,
-          _getTitleProps$title = _getTitleProps.title,
-          title = _getTitleProps$title === void 0 ? rawTitle : _getTitleProps$title,
-          _getTitleProps$titleW = _getTitleProps.titleWidth,
-          titleWidth = _getTitleProps$titleW === void 0 ? 0 : _getTitleProps$titleW;
-
-      var Title = styledTitle(titleClassName, variant, title, titleWidth);
-      return /*#__PURE__*/React.createElement(Title, {
-        key: "step-title-".concat(rawTitle)
-      });
-    })) : null;
+    return hasTitles ? /*#__PURE__*/_jsx("div", {
+      className: classes.titles,
+      children: steps.map(function (_ref6, index) {
+        var rawTitle = _ref6.title,
+            state = _ref6.state,
+            titleClassName = _ref6.titleClassName;
+
+        var _getTitleProps = getTitleProps({
+          state: state,
+          rawTitle: rawTitle,
+          number: index + 1
+        }),
+            _getTitleProps$varian = _getTitleProps.variant,
+            variant = _getTitleProps$varian === void 0 ? "highlightText" : _getTitleProps$varian,
+            _getTitleProps$title = _getTitleProps.title,
+            title = _getTitleProps$title === void 0 ? rawTitle : _getTitleProps$title,
+            _getTitleProps$titleW = _getTitleProps.titleWidth,
+            titleWidth = _getTitleProps$titleW === void 0 ? 0 : _getTitleProps$titleW;
+
+        var Title = styledTitle(titleClassName, variant, title, titleWidth);
+        return /*#__PURE__*/_jsx(Title, {}, "step-title-".concat(rawTitle));
+      })
+    }) : null;
   };
 
   var StepNavigation = {
     Default: HvDefaultNavigation,
     Simple: HvSimpleNavigation
   }[type];
-  return /*#__PURE__*/React.createElement(StepNavigation, _objectSpread({
+  return /*#__PURE__*/_jsx(StepNavigation, _objectSpread(_objectSpread({}, _objectSpread({
     stepSize: stepSizeKey,
     numSteps: steps.length,
     getTitles: getTitles,
     getDynamicValues: getDynamicValues,
     className: clsx(className, classes.root)
-  }, others), function (_ref7) {
-    var stepsWidth = _ref7.stepsWidth,
-        navWidth = _ref7.navWidth,
-        itemsProps = _objectWithoutProperties(_ref7, _excluded3);
-
-    return /*#__PURE__*/React.createElement(Typography, {
-      component: "nav",
-      style: {
-        width: "".concat(navWidth, "px"),
-        margin: 0
-      }
-    }, drawItems(itemsProps));
-  });
+  }, others)), {}, {
+    children: function children(_ref7) {
+      var stepsWidth = _ref7.stepsWidth,
+          navWidth = _ref7.navWidth,
+          itemsProps = _objectWithoutProperties(_ref7, _excluded3);
+
+      return /*#__PURE__*/_jsx(Typography, {
+        component: "nav",
+        style: {
+          width: "".concat(navWidth, "px"),
+          margin: 0
+        },
+        children: drawItems(itemsProps)
+      });
+    }
+  }));
 };
 
 process.env.NODE_ENV !== "production" ? HvStepNavigation.propTypes = {

package/dist/legacy/StepNavigation/StepNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepNavigation.js","names":["React","PropTypes","clsx","withStyles","Typography","styled","useTheme","HvTooltip","HvTypography","useWidth","HvDefaultNavigation","HvSimpleNavigation","SEPARATOR_WIDTH","TITLE_MARGIN","TITLE_WIDTH","styles","HvStepNavigation","className","classes","width","steps","stepSize","showTitles","type","others","theme","breakpoint","stepSizeKey","includes","hasTitles","styledLi","containerSize","height","styledDiv","styledSeparatorElement","title","separatorClassName","separatorHeight","separatorWidth","backgroundColor","Separator","separatorElement","separator","drawItems","separatorValues","minWidth","maxWidth","getColor","stepValues","minSize","maxSize","StepComponent","items","reduce","acc","index","state","props","StepContainer","Step","Math","max","stepProps","size","number","stepElement","li","length","ol","getDynamicValues","stepsWidth","Number","next","breakpoints","keys","find","_","self","navWidth","min","values","titleWidth","ceil","styledTitle","titleClassName","variant","stepTitle","textAlign","marginRight","getTitles","getTitleProps","titles","map","rawTitle","Title","StepNavigation","Default","Simple","numSteps","root","itemsProps","margin","propTypes","string","shape","isRequired","oneOf","arrayOf","disabled","bool","xs","sm","md","lg","xl","name"],"sources":["../../../src/StepNavigation/StepNavigation.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { withStyles, Typography, styled, useTheme } from \"@material-ui/core\";\nimport { HvTooltip, HvTypography, useWidth } from \"@hitachivantara/uikit-react-core\";\n\nimport HvDefaultNavigation from \"./DefaultNavigation\";\nimport HvSimpleNavigation from \"./SimpleNavigation\";\nimport { SEPARATOR_WIDTH, TITLE_MARGIN, TITLE_WIDTH } from \"./utils\";\nimport styles from \"./styles\";\n\n/**\n * Navigation page with steps.\n *\n * You need to define the <b>steps<b/> displayed on the component so that itself can be drawn on the UI.\n * On each step, you need to define a <b>state</b> - 'Pending', 'Failed', 'Completed', 'Current', 'Disabled' -\n * and a <b>title</b> to be shown as a tooltip or a text above of the step. You can also:\n * * Define a <b>className</b> on each step element;\n * * Define a <b>separatorClassName</b> to specify a className for the separator element. The default height\n * values of the separator element are 2px/3px on 'Simple'/'Default' layouts respectively;\n * * Define a <b>titleClassName</b> to specify a className for the title above each step element.\n *\n * For the root element, you can:\n * * Define a <b>className</b>;\n * * Choose a <b>type</b> of layout: 'Simple' or 'Default';\n * * Choose the <b>stepSize</b> of the step component: \"XS\", \"SM\", \"MD\", \"LG\", \"XL\". The default size will be\n * correspondent to the current media breakpoint;\n * * Choose either you want to <b>showTitles</b> near to each step component or a tootlip on hover;\n * * Define a <b>width</b> of the component. If you don't define any value and the step component has no title\n * displayed above, the width of the separator element;\n * will be 100px. If the step component has titles, each one will have 215px of width by default.\n */\nconst HvStepNavigation = ({\n  className,\n  classes,\n  width,\n  steps,\n  stepSize,\n  showTitles,\n  type = \"Default\",\n  ...others\n}) => {\n  const theme = useTheme();\n  // current breakpoint 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n  const breakpoint = useWidth();\n  // step configurations\n  const stepSizeKey = stepSize ?? ([\"xs\", \"sm\"].includes(breakpoint) ? \"SM\" : \"MD\");\n  const hasTitles = showTitles ?? ![\"xs\", \"sm\"].includes(breakpoint);\n\n  const styledLi = (containerSize) =>\n    styled(\"li\")({\n      width: containerSize,\n      height: containerSize,\n    });\n\n  const styledDiv = (containerSize) =>\n    styled(\"div\")({\n      width: containerSize,\n      height: containerSize,\n    });\n\n  const styledSeparatorElement = (\n    title,\n    separatorClassName,\n    separatorHeight,\n    separatorWidth,\n    backgroundColor\n  ) => {\n    const Separator = withStyles({\n      separatorElement: {\n        height: separatorHeight,\n        width: separatorWidth,\n        backgroundColor,\n      },\n    })(({ classes: { separatorElement } }) => (\n      <div\n        aria-label={`separator-${title}`}\n        className={clsx(separatorElement, separatorClassName)}\n      />\n    ));\n    return (\n      <li aria-hidden key={`separator-${title}`} className={classes.separator}>\n        <Separator />\n      </li>\n    );\n  };\n\n  const drawItems = ({\n    separatorValues: { minWidth, maxWidth, getColor, height },\n    stepValues: { minSize, maxSize, StepComponent },\n  }) => {\n    const items = steps.reduce((acc, { state, title, separatorClassName, ...props }, index) => {\n      const containerSize = state === \"Current\" ? maxSize : minSize;\n      const StepContainer = styledLi(containerSize);\n      const Step = styledDiv(Math.max(containerSize, 30), Math.max(containerSize, 30));\n      const stepProps = {\n        ...{\n          size: stepSizeKey,\n          state,\n          title,\n          number: index + 1,\n          ...props,\n        },\n      };\n      const stepElement = (\n        <StepContainer key={`step-${title}`} className={classes.li}>\n          {hasTitles ? (\n            <StepComponent aria-label={`step-${title}`} {...stepProps} />\n          ) : (\n            <HvTooltip\n              placement=\"bottom\"\n              title={<HvTypography>{`${index + 1}. ${title}`}</HvTypography>}\n            >\n              <div aria-label={`step-container-${title}`}>\n                <Step className={classes.li}>\n                  <StepComponent aria-label={`step-${title}`} {...stepProps} />\n                </Step>\n              </div>\n            </HvTooltip>\n          )}\n        </StepContainer>\n      );\n      if (index < steps.length - 1) {\n        const separatorElement = styledSeparatorElement(\n          title,\n          separatorClassName,\n          height,\n          [steps[index + 1].state, state].includes(\"Current\") ? minWidth : maxWidth,\n          getColor(state)\n        );\n        return [...acc, stepElement, separatorElement];\n      }\n      return [...acc, stepElement];\n    }, []);\n\n    return <ol className={classes.ol}>{items}</ol>;\n  };\n\n  const getDynamicValues = (stepsWidth) => {\n    const maxWidth =\n      width?.[breakpoint] ??\n      Math.max(\n        Number(hasTitles) * (TITLE_WIDTH + TITLE_MARGIN) * steps.length - TITLE_MARGIN,\n        SEPARATOR_WIDTH * (steps.length - 1) + stepsWidth\n      );\n    const next = theme.breakpoints.keys.find((_, index, self) =>\n      index - 1 >= 0 ? self[index - 1] === breakpoint : false\n    );\n    const navWidth = Math.min(maxWidth, theme.breakpoints.values?.[next] ?? maxWidth);\n    const titleWidth = Number(hasTitles) * Math.ceil((navWidth + TITLE_MARGIN) / steps.length);\n    const separatorWidth =\n      Number(!hasTitles) * Math.ceil((navWidth - stepsWidth) / (steps.length - 1));\n    return { width: navWidth, titleWidth, separatorWidth };\n  };\n\n  const styledTitle = (titleClassName, variant, title, titleWidth) =>\n    withStyles({\n      stepTitle: {\n        textAlign: \"center\",\n        width: titleWidth - TITLE_MARGIN,\n        marginRight: TITLE_MARGIN,\n      },\n    })(({ classes: { stepTitle } }) =>\n      title ? (\n        <HvTypography variant={variant} className={clsx(stepTitle, titleClassName)}>\n          {title}\n        </HvTypography>\n      ) : null\n    );\n\n  const getTitles = (getTitleProps) =>\n    hasTitles ? (\n      <div className={classes.titles}>\n        {steps.map(({ title: rawTitle, state, titleClassName }, index) => {\n          const {\n            variant = \"highlightText\",\n            title = rawTitle,\n            titleWidth = 0,\n          } = getTitleProps({\n            state,\n            rawTitle,\n            number: index + 1,\n          });\n          const Title = styledTitle(titleClassName, variant, title, titleWidth);\n          return <Title key={`step-title-${rawTitle}`} />;\n        })}\n      </div>\n    ) : null;\n\n  const StepNavigation = {\n    Default: HvDefaultNavigation,\n    Simple: HvSimpleNavigation,\n  }[type];\n\n  return (\n    <StepNavigation\n      {...{\n        stepSize: stepSizeKey,\n        numSteps: steps.length,\n        getTitles,\n        getDynamicValues,\n        className: clsx(className, classes.root),\n        ...others,\n      }}\n    >\n      {({ stepsWidth, navWidth, ...itemsProps }) => (\n        <Typography\n          component=\"nav\"\n          style={{\n            width: `${navWidth}px`,\n            margin: 0,\n          }}\n        >\n          {drawItems(itemsProps)}\n        </Typography>\n      )}\n    </StepNavigation>\n  );\n};\n\nHvStepNavigation.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 li element.\n     */\n    li: PropTypes.string,\n    /**\n     *  Styles applied to the ol element.\n     */\n    ol: PropTypes.string,\n    /**\n     * Styles applied to the separator element.\n     */\n    separator: PropTypes.string,\n    /**\n     * Styles applied to the titles container element.\n     */\n    titles: PropTypes.string,\n  }).isRequired,\n  /**\n   * Type of step navigation. Values = {\"Simple\", \"Default\"}.\n   */\n  type: PropTypes.oneOf([\"Simple\", \"Default\"]),\n  /**\n   * Steps to show on the component.\n   */\n  steps: PropTypes.arrayOf(\n    PropTypes.shape({\n      /**\n       * Class names to override styles on the step component.\n       */\n      className: PropTypes.string,\n      /**\n       * Class names to override styles on the separator component after the step.\n       */\n      separatorClassName: PropTypes.string,\n      /**\n       * Class names to override styles on the title component above the step.\n       */\n      titleClassName: PropTypes.string,\n      /**\n       * Title of the step.\n       */\n      title: PropTypes.string.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       * 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  ).isRequired,\n  /**\n   * Sets one of the standard sizes of the steps. Values = {\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"}\n   */\n  stepSize: PropTypes.oneOf([\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]),\n  /**\n   * Width of the component element on each breakpoint screen resolution.\n   */\n  width: PropTypes.shape({\n    xs: PropTypes.number,\n    sm: PropTypes.number,\n    md: PropTypes.number,\n    lg: PropTypes.number,\n    xl: PropTypes.number,\n  }),\n  /**\n   * Defines either show a title or only a tooltip on each step component\n   */\n  showTitles: PropTypes.bool,\n};\n\nexport default withStyles(styles, { name: \"HvStepNavigation\" })(HvStepNavigation);\n"],"mappings":"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"}
+{"version":3,"file":"StepNavigation.js","names":["React","PropTypes","clsx","Typography","styled","useTheme","withStyles","HvTooltip","HvTypography","useWidth","HvDefaultNavigation","HvSimpleNavigation","SEPARATOR_WIDTH","TITLE_MARGIN","TITLE_WIDTH","styles","HvStepNavigation","className","classes","width","steps","stepSize","showTitles","type","others","theme","breakpoint","stepSizeKey","includes","hasTitles","styledLi","containerSize","height","styledDiv","styledSeparatorElement","title","separatorClassName","separatorHeight","separatorWidth","backgroundColor","Separator","separatorElement","separator","drawItems","separatorValues","minWidth","maxWidth","getColor","stepValues","minSize","maxSize","StepComponent","items","reduce","acc","index","state","props","StepContainer","Step","Math","max","stepProps","size","number","stepElement","li","length","ol","getDynamicValues","stepsWidth","Number","next","breakpoints","keys","find","_","self","navWidth","min","values","titleWidth","ceil","styledTitle","titleClassName","variant","stepTitle","textAlign","marginRight","getTitles","getTitleProps","titles","map","rawTitle","Title","StepNavigation","Default","Simple","numSteps","root","itemsProps","margin","propTypes","string","shape","isRequired","oneOf","arrayOf","disabled","bool","xs","sm","md","lg","xl","name"],"sources":["../../../src/StepNavigation/StepNavigation.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { Typography, styled, useTheme } from \"@mui/material\";\nimport { withStyles } from \"@mui/styles\";\nimport { HvTooltip, HvTypography, useWidth } from \"@hitachivantara/uikit-react-core\";\n\nimport HvDefaultNavigation from \"./DefaultNavigation\";\nimport HvSimpleNavigation from \"./SimpleNavigation\";\nimport { SEPARATOR_WIDTH, TITLE_MARGIN, TITLE_WIDTH } from \"./utils\";\nimport styles from \"./styles\";\n\n/**\n * Navigation page with steps.\n *\n * You need to define the <b>steps<b/> displayed on the component so that itself can be drawn on the UI.\n * On each step, you need to define a <b>state</b> - 'Pending', 'Failed', 'Completed', 'Current', 'Disabled' -\n * and a <b>title</b> to be shown as a tooltip or a text above of the step. You can also:\n * * Define a <b>className</b> on each step element;\n * * Define a <b>separatorClassName</b> to specify a className for the separator element. The default height\n * values of the separator element are 2px/3px on 'Simple'/'Default' layouts respectively;\n * * Define a <b>titleClassName</b> to specify a className for the title above each step element.\n *\n * For the root element, you can:\n * * Define a <b>className</b>;\n * * Choose a <b>type</b> of layout: 'Simple' or 'Default';\n * * Choose the <b>stepSize</b> of the step component: \"XS\", \"SM\", \"MD\", \"LG\", \"XL\". The default size will be\n * correspondent to the current media breakpoint;\n * * Choose either you want to <b>showTitles</b> near to each step component or a tootlip on hover;\n * * Define a <b>width</b> of the component. If you don't define any value and the step component has no title\n * displayed above, the width of the separator element;\n * will be 100px. If the step component has titles, each one will have 215px of width by default.\n */\nconst HvStepNavigation = ({\n  className,\n  classes,\n  width,\n  steps,\n  stepSize,\n  showTitles,\n  type = \"Default\",\n  ...others\n}) => {\n  const theme = useTheme();\n  // current breakpoint 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n  const breakpoint = useWidth();\n  // step configurations\n  const stepSizeKey = stepSize ?? ([\"xs\", \"sm\"].includes(breakpoint) ? \"SM\" : \"MD\");\n  const hasTitles = showTitles ?? ![\"xs\", \"sm\"].includes(breakpoint);\n\n  const styledLi = (containerSize) =>\n    styled(\"li\")({\n      width: containerSize,\n      height: containerSize,\n    });\n\n  const styledDiv = (containerSize) =>\n    styled(\"div\")({\n      width: containerSize,\n      height: containerSize,\n    });\n\n  const styledSeparatorElement = (\n    title,\n    separatorClassName,\n    separatorHeight,\n    separatorWidth,\n    backgroundColor\n  ) => {\n    const Separator = withStyles({\n      separatorElement: {\n        height: separatorHeight,\n        width: separatorWidth,\n        backgroundColor,\n      },\n    })(({ classes: { separatorElement } }) => (\n      <div\n        aria-label={`separator-${title}`}\n        className={clsx(separatorElement, separatorClassName)}\n      />\n    ));\n    return (\n      <li aria-hidden key={`separator-${title}`} className={classes.separator}>\n        <Separator />\n      </li>\n    );\n  };\n\n  const drawItems = ({\n    separatorValues: { minWidth, maxWidth, getColor, height },\n    stepValues: { minSize, maxSize, StepComponent },\n  }) => {\n    const items = steps.reduce((acc, { state, title, separatorClassName, ...props }, index) => {\n      const containerSize = state === \"Current\" ? maxSize : minSize;\n      const StepContainer = styledLi(containerSize);\n      const Step = styledDiv(Math.max(containerSize, 30), Math.max(containerSize, 30));\n      const stepProps = {\n        ...{\n          size: stepSizeKey,\n          state,\n          title,\n          number: index + 1,\n          ...props,\n        },\n      };\n      const stepElement = (\n        <StepContainer key={`step-${title}`} className={classes.li}>\n          {hasTitles ? (\n            <StepComponent aria-label={`step-${title}`} {...stepProps} />\n          ) : (\n            <HvTooltip\n              placement=\"bottom\"\n              title={<HvTypography>{`${index + 1}. ${title}`}</HvTypography>}\n            >\n              <div aria-label={`step-container-${title}`}>\n                <Step className={classes.li}>\n                  <StepComponent aria-label={`step-${title}`} {...stepProps} />\n                </Step>\n              </div>\n            </HvTooltip>\n          )}\n        </StepContainer>\n      );\n      if (index < steps.length - 1) {\n        const separatorElement = styledSeparatorElement(\n          title,\n          separatorClassName,\n          height,\n          [steps[index + 1].state, state].includes(\"Current\") ? minWidth : maxWidth,\n          getColor(state)\n        );\n        return [...acc, stepElement, separatorElement];\n      }\n      return [...acc, stepElement];\n    }, []);\n\n    return <ol className={classes.ol}>{items}</ol>;\n  };\n\n  const getDynamicValues = (stepsWidth) => {\n    const maxWidth =\n      width?.[breakpoint] ??\n      Math.max(\n        Number(hasTitles) * (TITLE_WIDTH + TITLE_MARGIN) * steps.length - TITLE_MARGIN,\n        SEPARATOR_WIDTH * (steps.length - 1) + stepsWidth\n      );\n    const next = theme.breakpoints.keys.find((_, index, self) =>\n      index - 1 >= 0 ? self[index - 1] === breakpoint : false\n    );\n    const navWidth = Math.min(maxWidth, theme.breakpoints.values?.[next] ?? maxWidth);\n    const titleWidth = Number(hasTitles) * Math.ceil((navWidth + TITLE_MARGIN) / steps.length);\n    const separatorWidth =\n      Number(!hasTitles) * Math.ceil((navWidth - stepsWidth) / (steps.length - 1));\n    return { width: navWidth, titleWidth, separatorWidth };\n  };\n\n  const styledTitle = (titleClassName, variant, title, titleWidth) =>\n    withStyles({\n      stepTitle: {\n        textAlign: \"center\",\n        width: titleWidth - TITLE_MARGIN,\n        marginRight: TITLE_MARGIN,\n      },\n    })(({ classes: { stepTitle } }) =>\n      title ? (\n        <HvTypography variant={variant} className={clsx(stepTitle, titleClassName)}>\n          {title}\n        </HvTypography>\n      ) : null\n    );\n\n  const getTitles = (getTitleProps) =>\n    hasTitles ? (\n      <div className={classes.titles}>\n        {steps.map(({ title: rawTitle, state, titleClassName }, index) => {\n          const {\n            variant = \"highlightText\",\n            title = rawTitle,\n            titleWidth = 0,\n          } = getTitleProps({\n            state,\n            rawTitle,\n            number: index + 1,\n          });\n          const Title = styledTitle(titleClassName, variant, title, titleWidth);\n          return <Title key={`step-title-${rawTitle}`} />;\n        })}\n      </div>\n    ) : null;\n\n  const StepNavigation = {\n    Default: HvDefaultNavigation,\n    Simple: HvSimpleNavigation,\n  }[type];\n\n  return (\n    <StepNavigation\n      {...{\n        stepSize: stepSizeKey,\n        numSteps: steps.length,\n        getTitles,\n        getDynamicValues,\n        className: clsx(className, classes.root),\n        ...others,\n      }}\n    >\n      {({ stepsWidth, navWidth, ...itemsProps }) => (\n        <Typography\n          component=\"nav\"\n          style={{\n            width: `${navWidth}px`,\n            margin: 0,\n          }}\n        >\n          {drawItems(itemsProps)}\n        </Typography>\n      )}\n    </StepNavigation>\n  );\n};\n\nHvStepNavigation.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 li element.\n     */\n    li: PropTypes.string,\n    /**\n     *  Styles applied to the ol element.\n     */\n    ol: PropTypes.string,\n    /**\n     * Styles applied to the separator element.\n     */\n    separator: PropTypes.string,\n    /**\n     * Styles applied to the titles container element.\n     */\n    titles: PropTypes.string,\n  }).isRequired,\n  /**\n   * Type of step navigation. Values = {\"Simple\", \"Default\"}.\n   */\n  type: PropTypes.oneOf([\"Simple\", \"Default\"]),\n  /**\n   * Steps to show on the component.\n   */\n  steps: PropTypes.arrayOf(\n    PropTypes.shape({\n      /**\n       * Class names to override styles on the step component.\n       */\n      className: PropTypes.string,\n      /**\n       * Class names to override styles on the separator component after the step.\n       */\n      separatorClassName: PropTypes.string,\n      /**\n       * Class names to override styles on the title component above the step.\n       */\n      titleClassName: PropTypes.string,\n      /**\n       * Title of the step.\n       */\n      title: PropTypes.string.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       * 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  ).isRequired,\n  /**\n   * Sets one of the standard sizes of the steps. Values = {\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"}\n   */\n  stepSize: PropTypes.oneOf([\"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]),\n  /**\n   * Width of the component element on each breakpoint screen resolution.\n   */\n  width: PropTypes.shape({\n    xs: PropTypes.number,\n    sm: PropTypes.number,\n    md: PropTypes.number,\n    lg: PropTypes.number,\n    xl: PropTypes.number,\n  }),\n  /**\n   * Defines either show a title or only a tooltip on each step component\n   */\n  showTitles: PropTypes.bool,\n};\n\nexport default withStyles(styles, { name: \"HvStepNavigation\" })(HvStepNavigation);\n"],"mappings":"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"}

package/dist/legacy/TimeAgo/TimeAgo.d.ts

@@ -1,4 +1,4 @@
-import { StandardProps } from "@material-ui/core";
+import { StandardProps } from "@mui/material";
 
 export type HvTimeAgoClassKey = "root";
 

package/dist/legacy/TimeAgo/TimeAgo.js

@@ -1,9 +1,21 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
+import "core-js/modules/es.object.keys.js";
+import "core-js/modules/es.symbol.js";
+import "core-js/modules/es.array.filter.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.object.get-own-property-descriptor.js";
+import "core-js/modules/web.dom-collections.for-each.js";
+import "core-js/modules/es.object.get-own-property-descriptors.js";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["classes", "timestamp", "locale", "component", "emptyElement", "disableRefresh", "showSeconds", "justText"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 import React from "react";
 import PropTypes from "prop-types";
-import { withStyles } from "@material-ui/core";
+import { withStyles } from "@mui/styles";
 import { HvTypography, useLocale } from "@hitachivantara/uikit-react-core";
 import useTimeAgo from "./useTimeAgo";
 import styles from "./styles";
@@ -11,6 +23,8 @@ import styles from "./styles";
  * The HvTimeAgo component implements the Design System relative time format guidelines.
  */
 
+import { jsx as _jsx } from "react/jsx-runtime";
+
 var HvTimeAgo = function HvTimeAgo(_ref) {
   var classes = _ref.classes,
       timestamp = _ref.timestamp,
@@ -35,9 +49,11 @@ var HvTimeAgo = function HvTimeAgo(_ref) {
     showSeconds: showSeconds
   });
   if (justText && timestamp) return timeAgo;
-  return /*#__PURE__*/React.createElement(Component, _extends({
+  return /*#__PURE__*/_jsx(Component, _objectSpread(_objectSpread({
     className: classes.root
-  }, others), !timestamp ? emptyElement : timeAgo);
+  }, others), {}, {
+    children: !timestamp ? emptyElement : timeAgo
+  }));
 };
 
 process.env.NODE_ENV !== "production" ? HvTimeAgo.propTypes = {

package/dist/legacy/TimeAgo/TimeAgo.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeAgo.js","names":["React","PropTypes","withStyles","HvTypography","useLocale","useTimeAgo","styles","HvTimeAgo","classes","timestamp","localeProp","locale","component","Component","emptyElement","disableRefresh","showSeconds","justText","others","contextLocale","timeAgo","root","propTypes","shape","string","number","elementType","node","bool","name"],"sources":["../../../src/TimeAgo/TimeAgo.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport { withStyles } from \"@material-ui/core\";\nimport { HvTypography, useLocale } from \"@hitachivantara/uikit-react-core\";\nimport useTimeAgo from \"./useTimeAgo\";\nimport styles from \"./styles\";\n\n/**\n * The HvTimeAgo component implements the Design System relative time format guidelines.\n */\nconst HvTimeAgo = ({\n  classes,\n  timestamp,\n  locale: localeProp,\n  component: Component = HvTypography,\n  emptyElement = \"—\",\n  disableRefresh = false,\n  showSeconds = false,\n  justText = false,\n  ...others\n}) => {\n  const contextLocale = useLocale();\n  const locale = localeProp || contextLocale;\n  const timeAgo = useTimeAgo(timestamp, { locale, disableRefresh, showSeconds });\n\n  if (justText && timestamp) return timeAgo;\n\n  return (\n    <Component className={classes.root} {...others}>\n      {!timestamp ? emptyElement : timeAgo}\n    </Component>\n  );\n};\n\nHvTimeAgo.propTypes = {\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  /**\n   * The timestamp to format, in seconds\n   */\n  timestamp: PropTypes.number,\n  /**\n   * The locale to be used. Should be on of the dayjs supported locales\n   * @see https://day.js.org/docs/en/i18n/i18n\n   */\n  locale: PropTypes.string,\n  /**\n   * The component used for the root node. Either a string to use a HTML element or a component.\n   * Defaults to `div`.\n   */\n  component: PropTypes.elementType,\n  /**\n   * The element to render when the timestamp is null or 0\n   * Defaults to `—` (Em Dash)\n   */\n  emptyElement: PropTypes.node,\n  /**\n   * Disables periodic date refreshes\n   */\n  disableRefresh: PropTypes.bool,\n  /**\n   * Whether to show seconds in the rendered time\n   */\n  showSeconds: PropTypes.bool,\n  /**\n   * Whether the component should render just the string\n   * Consider using `useTimeAgo` instead\n   */\n  justText: PropTypes.bool,\n};\n\nexport default withStyles(styles, { name: \"HvTimeAgo\" })(HvTimeAgo);\n"],"mappings":";;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAASC,UAAT,QAA2B,mBAA3B;AACA,SAASC,YAAT,EAAuBC,SAAvB,QAAwC,kCAAxC;AACA,OAAOC,UAAP,MAAuB,cAAvB;AACA,OAAOC,MAAP,MAAmB,UAAnB;AAEA;AACA;AACA;;AACA,IAAMC,SAAS,GAAG,SAAZA,SAAY,OAUZ;EAAA,IATJC,OASI,QATJA,OASI;EAAA,IARJC,SAQI,QARJA,SAQI;EAAA,IAPIC,UAOJ,QAPJC,MAOI;EAAA,0BANJC,SAMI;EAAA,IANOC,SAMP,+BANmBV,YAMnB;EAAA,6BALJW,YAKI;EAAA,IALJA,YAKI,kCALW,GAKX;EAAA,+BAJJC,cAII;EAAA,IAJJA,cAII,oCAJa,KAIb;EAAA,4BAHJC,WAGI;EAAA,IAHJA,WAGI,iCAHU,KAGV;EAAA,yBAFJC,QAEI;EAAA,IAFJA,QAEI,8BAFO,KAEP;EAAA,IADDC,MACC;;EACJ,IAAMC,aAAa,GAAGf,SAAS,EAA/B;EACA,IAAMO,MAAM,GAAGD,UAAU,IAAIS,aAA7B;EACA,IAAMC,OAAO,GAAGf,UAAU,CAACI,SAAD,EAAY;IAAEE,MAAM,EAANA,MAAF;IAAUI,cAAc,EAAdA,cAAV;IAA0BC,WAAW,EAAXA;EAA1B,CAAZ,CAA1B;EAEA,IAAIC,QAAQ,IAAIR,SAAhB,EAA2B,OAAOW,OAAP;EAE3B,oBACE,oBAAC,SAAD;IAAW,SAAS,EAAEZ,OAAO,CAACa;EAA9B,GAAwCH,MAAxC,GACG,CAACT,SAAD,GAAaK,YAAb,GAA4BM,OAD/B,CADF;AAKD,CAtBD;;AAwBA,wCAAAb,SAAS,CAACe,SAAV,GAAsB;EACpB;AACF;AACA;EACEd,OAAO,EAAEP,SAAS,CAACsB,KAAV,CAAgB;IACvB;AACJ;AACA;IACIF,IAAI,EAAEpB,SAAS,CAACuB;EAJO,CAAhB,CAJW;;EAUpB;AACF;AACA;EACEf,SAAS,EAAER,SAAS,CAACwB,MAbD;;EAcpB;AACF;AACA;AACA;EACEd,MAAM,EAAEV,SAAS,CAACuB,MAlBE;;EAmBpB;AACF;AACA;AACA;EACEZ,SAAS,EAAEX,SAAS,CAACyB,WAvBD;;EAwBpB;AACF;AACA;AACA;EACEZ,YAAY,EAAEb,SAAS,CAAC0B,IA5BJ;;EA6BpB;AACF;AACA;EACEZ,cAAc,EAAEd,SAAS,CAAC2B,IAhCN;;EAiCpB;AACF;AACA;EACEZ,WAAW,EAAEf,SAAS,CAAC2B,IApCH;;EAqCpB;AACF;AACA;AACA;EACEX,QAAQ,EAAEhB,SAAS,CAAC2B;AAzCA,CAAtB;AA4CA,eAAe1B,UAAU,CAACI,MAAD,EAAS;EAAEuB,IAAI,EAAE;AAAR,CAAT,CAAV,CAA0CtB,SAA1C,CAAf"}
+{"version":3,"file":"TimeAgo.js","names":["React","PropTypes","withStyles","HvTypography","useLocale","useTimeAgo","styles","HvTimeAgo","classes","timestamp","localeProp","locale","component","Component","emptyElement","disableRefresh","showSeconds","justText","others","contextLocale","timeAgo","root","propTypes","shape","string","number","elementType","node","bool","name"],"sources":["../../../src/TimeAgo/TimeAgo.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport { withStyles } from \"@mui/styles\";\nimport { HvTypography, useLocale } from \"@hitachivantara/uikit-react-core\";\nimport useTimeAgo from \"./useTimeAgo\";\nimport styles from \"./styles\";\n\n/**\n * The HvTimeAgo component implements the Design System relative time format guidelines.\n */\nconst HvTimeAgo = ({\n  classes,\n  timestamp,\n  locale: localeProp,\n  component: Component = HvTypography,\n  emptyElement = \"—\",\n  disableRefresh = false,\n  showSeconds = false,\n  justText = false,\n  ...others\n}) => {\n  const contextLocale = useLocale();\n  const locale = localeProp || contextLocale;\n  const timeAgo = useTimeAgo(timestamp, { locale, disableRefresh, showSeconds });\n\n  if (justText && timestamp) return timeAgo;\n\n  return (\n    <Component className={classes.root} {...others}>\n      {!timestamp ? emptyElement : timeAgo}\n    </Component>\n  );\n};\n\nHvTimeAgo.propTypes = {\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  /**\n   * The timestamp to format, in seconds\n   */\n  timestamp: PropTypes.number,\n  /**\n   * The locale to be used. Should be on of the dayjs supported locales\n   * @see https://day.js.org/docs/en/i18n/i18n\n   */\n  locale: PropTypes.string,\n  /**\n   * The component used for the root node. Either a string to use a HTML element or a component.\n   * Defaults to `div`.\n   */\n  component: PropTypes.elementType,\n  /**\n   * The element to render when the timestamp is null or 0\n   * Defaults to `—` (Em Dash)\n   */\n  emptyElement: PropTypes.node,\n  /**\n   * Disables periodic date refreshes\n   */\n  disableRefresh: PropTypes.bool,\n  /**\n   * Whether to show seconds in the rendered time\n   */\n  showSeconds: PropTypes.bool,\n  /**\n   * Whether the component should render just the string\n   * Consider using `useTimeAgo` instead\n   */\n  justText: PropTypes.bool,\n};\n\nexport default withStyles(styles, { name: \"HvTimeAgo\" })(HvTimeAgo);\n"],"mappings":";;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAASC,UAAT,QAA2B,aAA3B;AACA,SAASC,YAAT,EAAuBC,SAAvB,QAAwC,kCAAxC;AACA,OAAOC,UAAP,MAAuB,cAAvB;AACA,OAAOC,MAAP,MAAmB,UAAnB;AAEA;AACA;AACA;;;;AACA,IAAMC,SAAS,GAAG,SAAZA,SAAY,OAUZ;EAAA,IATJC,OASI,QATJA,OASI;EAAA,IARJC,SAQI,QARJA,SAQI;EAAA,IAPIC,UAOJ,QAPJC,MAOI;EAAA,0BANJC,SAMI;EAAA,IANOC,SAMP,+BANmBV,YAMnB;EAAA,6BALJW,YAKI;EAAA,IALJA,YAKI,kCALW,GAKX;EAAA,+BAJJC,cAII;EAAA,IAJJA,cAII,oCAJa,KAIb;EAAA,4BAHJC,WAGI;EAAA,IAHJA,WAGI,iCAHU,KAGV;EAAA,yBAFJC,QAEI;EAAA,IAFJA,QAEI,8BAFO,KAEP;EAAA,IADDC,MACC;;EACJ,IAAMC,aAAa,GAAGf,SAAS,EAA/B;EACA,IAAMO,MAAM,GAAGD,UAAU,IAAIS,aAA7B;EACA,IAAMC,OAAO,GAAGf,UAAU,CAACI,SAAD,EAAY;IAAEE,MAAM,EAANA,MAAF;IAAUI,cAAc,EAAdA,cAAV;IAA0BC,WAAW,EAAXA;EAA1B,CAAZ,CAA1B;EAEA,IAAIC,QAAQ,IAAIR,SAAhB,EAA2B,OAAOW,OAAP;EAE3B,oBACE,KAAC,SAAD;IAAW,SAAS,EAAEZ,OAAO,CAACa;EAA9B,GAAwCH,MAAxC;IAAA,UACG,CAACT,SAAD,GAAaK,YAAb,GAA4BM;EAD/B,GADF;AAKD,CAtBD;;AAwBA,wCAAAb,SAAS,CAACe,SAAV,GAAsB;EACpB;AACF;AACA;EACEd,OAAO,EAAEP,SAAS,CAACsB,KAAV,CAAgB;IACvB;AACJ;AACA;IACIF,IAAI,EAAEpB,SAAS,CAACuB;EAJO,CAAhB,CAJW;;EAUpB;AACF;AACA;EACEf,SAAS,EAAER,SAAS,CAACwB,MAbD;;EAcpB;AACF;AACA;AACA;EACEd,MAAM,EAAEV,SAAS,CAACuB,MAlBE;;EAmBpB;AACF;AACA;AACA;EACEZ,SAAS,EAAEX,SAAS,CAACyB,WAvBD;;EAwBpB;AACF;AACA;AACA;EACEZ,YAAY,EAAEb,SAAS,CAAC0B,IA5BJ;;EA6BpB;AACF;AACA;EACEZ,cAAc,EAAEd,SAAS,CAAC2B,IAhCN;;EAiCpB;AACF;AACA;EACEZ,WAAW,EAAEf,SAAS,CAAC2B,IApCH;;EAqCpB;AACF;AACA;AACA;EACEX,QAAQ,EAAEhB,SAAS,CAAC2B;AAzCA,CAAtB;AA4CA,eAAe1B,UAAU,CAACI,MAAD,EAAS;EAAEuB,IAAI,EAAE;AAAR,CAAT,CAAV,CAA0CtB,SAA1C,CAAf"}