@hitachivantara/uikit-react-core 5.24.0 → 5.24.2

package/dist/esm/components/ProgressBar/ProgressBar.js

@@ -1,50 +1,57 @@
-import { clsx } from "clsx";
 import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import clamp from "lodash/clamp";
-import { StyledRoot, StyledProgressContainer, StyledValue, StyledProgressBarContainer, StyledProgressBar } from "./ProgressBar.styles.js";
-import progressBarClasses from "./progressBarClasses.js";
+import { useClasses } from "./ProgressBar.styles.js";
+import { staticClasses } from "./ProgressBar.styles.js";
 import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+import { HvTypography } from "../Typography/Typography.js";
 const HvProgressBar = (props) => {
   const {
     className,
-    classes,
+    classes: classesProp,
     value = 0,
     status = "inProgress",
     labelProps,
     ...others
   } = useDefaultProps("HvProgressBar", props);
+  const {
+    classes,
+    cx
+  } = useClasses(classesProp);
   const clampedValue = clamp(value, 0, 100);
-  return /* @__PURE__ */ jsx(StyledRoot, {
-    className: clsx(className, progressBarClasses.root, classes == null ? void 0 : classes.root, progressBarClasses.progress, classes == null ? void 0 : classes.progress),
+  return /* @__PURE__ */ jsx("div", {
+    className: cx(classes.root, classes.progress, className),
     role: "progressbar",
     "aria-valuemin": 0,
     "aria-valuemax": 100,
     "aria-valuenow": clampedValue,
     ...others,
-    children: /* @__PURE__ */ jsxs(StyledProgressContainer, {
-      className: clsx(classes == null ? void 0 : classes.progressContainer, progressBarClasses.progressContainer),
-      children: [/* @__PURE__ */ jsx(StyledValue, {
-        className: clsx(progressBarClasses.progressBarLabel, classes == null ? void 0 : classes.progressBarLabel, status === "completed" && clsx(progressBarClasses.progressDone, classes == null ? void 0 : classes.progressDone)),
+    children: /* @__PURE__ */ jsxs("div", {
+      className: classes.progressContainer,
+      children: [/* @__PURE__ */ jsx(HvTypography, {
+        className: classes.progressBarLabel,
         variant: "caption2",
         style: {
           width: `${clampedValue}%`
         },
         ...labelProps,
         children: `${clampedValue}%`
-      }), /* @__PURE__ */ jsx(StyledProgressBarContainer, {
-        className: clsx(classes == null ? void 0 : classes.progressBarContainer, progressBarClasses.progressBarContainer),
-        children: /* @__PURE__ */ jsx(StyledProgressBar, {
+      }), /* @__PURE__ */ jsx("div", {
+        className: classes.progressBarContainer,
+        children: /* @__PURE__ */ jsx("div", {
           style: {
             width: `${clampedValue}%`
           },
-          className: clsx(progressBarClasses.progressBar, classes == null ? void 0 : classes.progressBar, status === "completed" && clsx(classes == null ? void 0 : classes.progressDone, progressBarClasses.progressDone), status === "error" && clsx(classes == null ? void 0 : classes.progressError, progressBarClasses.progressError)),
-          $status: status
+          className: cx(classes.progressBar, {
+            [classes.progressDone]: status === "completed",
+            [classes.progressError]: status === "error"
+          })
         })
       })]
     })
   });
 };
 export {
-  HvProgressBar
+  HvProgressBar,
+  staticClasses as progressBarClasses
 };
 //# sourceMappingURL=ProgressBar.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.js","sources":["../../../../src/components/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport clamp from \"lodash/clamp\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypographyProps } from \"@core/components/Typography\";\n\nimport {\n  StyledProgressBar,\n  StyledProgressBarContainer,\n  StyledProgressContainer,\n  StyledRoot,\n  StyledValue,\n} from \"./ProgressBar.styles\";\nimport progressBarClasses, { HvProgressBarClasses } from \"./progressBarClasses\";\n\nexport type HvProgressBarStatus = \"inProgress\" | \"completed\" | \"error\";\n\n/**\n * ProgressBar provides feedback about a process that is taking place in the application.\n */\nexport interface HvProgressBarProps extends HvBaseProps {\n  /** The value of the progress bar. */\n  value: number;\n  /**\n   * The status of the progress bar.\n   *\n   * inProgress is black, error is red and completed is green.\n   *\n   * When uncontrolled and unspecified it will default to \"inProgress\".\n   */\n  status?: HvProgressBarStatus;\n  /** Aria Properties passed on to the progress bar. */\n  labelProps?: HvTypographyProps;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvProgressBarClasses;\n}\n\nexport const HvProgressBar = (props: HvProgressBarProps) => {\n  const {\n    className,\n    classes,\n    value = 0,\n    status = \"inProgress\",\n    labelProps,\n    ...others\n  } = useDefaultProps(\"HvProgressBar\", props);\n\n  const clampedValue = clamp(value, 0, 100);\n\n  return (\n    <StyledRoot\n      className={clsx(\n        className,\n        progressBarClasses.root,\n        classes?.root,\n        progressBarClasses.progress,\n        classes?.progress\n      )}\n      role=\"progressbar\"\n      aria-valuemin={0}\n      aria-valuemax={100}\n      aria-valuenow={clampedValue}\n      {...others}\n    >\n      <StyledProgressContainer\n        className={clsx(\n          classes?.progressContainer,\n          progressBarClasses.progressContainer\n        )}\n      >\n        <StyledValue\n          className={clsx(\n            progressBarClasses.progressBarLabel,\n            classes?.progressBarLabel,\n            status === \"completed\" &&\n              clsx(progressBarClasses.progressDone, classes?.progressDone)\n          )}\n          variant=\"caption2\"\n          style={{ width: `${clampedValue}%` }}\n          {...labelProps}\n        >\n          {`${clampedValue}%`}\n        </StyledValue>\n        <StyledProgressBarContainer\n          className={clsx(\n            classes?.progressBarContainer,\n            progressBarClasses.progressBarContainer\n          )}\n        >\n          <StyledProgressBar\n            style={{ width: `${clampedValue}%` }}\n            className={clsx(\n              progressBarClasses.progressBar,\n              classes?.progressBar,\n              status === \"completed\" &&\n                clsx(classes?.progressDone, progressBarClasses.progressDone),\n              status === \"error\" &&\n                clsx(classes?.progressError, progressBarClasses.progressError)\n            )}\n            $status={status}\n          />\n        </StyledProgressBarContainer>\n      </StyledProgressContainer>\n    </StyledRoot>\n  );\n};\n"],"names":["HvProgressBar","props","className","classes","value","status","labelProps","others","useDefaultProps","clampedValue","clamp","StyledRoot","clsx","progressBarClasses","root","progress","role","children","StyledProgressContainer","progressContainer","_jsx","StyledValue","progressBarLabel","progressDone","variant","style","width","StyledProgressBarContainer","progressBarContainer","StyledProgressBar","progressBar","progressError","$status"],"mappings":";;;;;;AAuCaA,MAAAA,gBAAgBA,CAACC,UAA8B;AACpD,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,QAAQ;AAAA,IACRC,SAAS;AAAA,IACTC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,iBAAiBP,KAAK;AAE1C,QAAMQ,eAAeC,MAAMN,OAAO,GAAG,GAAG;AAExC,6BACGO,YAAU;AAAA,IACTT,WAAWU,KACTV,WACAW,mBAAmBC,MACnBX,mCAASW,MACTD,mBAAmBE,UACnBZ,mCAASY,QACX;AAAA,IACAC,MAAK;AAAA,IACL,iBAAe;AAAA,IACf,iBAAe;AAAA,IACf,iBAAeP;AAAAA,IAAa,GACxBF;AAAAA,IAAMU,+BAETC,yBAAuB;AAAA,MACtBhB,WAAWU,KACTT,mCAASgB,mBACTN,mBAAmBM,iBACrB;AAAA,MAAEF,UAAA,CAEFG,oBAACC,aAAW;AAAA,QACVnB,WAAWU,KACTC,mBAAmBS,kBACnBnB,mCAASmB,kBACTjB,WAAW,eACTO,KAAKC,mBAAmBU,cAAcpB,mCAASoB,YAAY,CAC/D;AAAA,QACAC,SAAQ;AAAA,QACRC,OAAO;AAAA,UAAEC,OAAQ,GAAEjB;AAAAA,QAAgB;AAAA,QAAE,GACjCH;AAAAA,QAAUW,UAEZ,GAAER;AAAAA,MAAAA,CACO,GACbW,oBAACO,4BAA0B;AAAA,QACzBzB,WAAWU,KACTT,mCAASyB,sBACTf,mBAAmBe,oBACrB;AAAA,QAAEX,8BAEDY,mBAAiB;AAAA,UAChBJ,OAAO;AAAA,YAAEC,OAAQ,GAAEjB;AAAAA,UAAgB;AAAA,UACnCP,WAAWU,KACTC,mBAAmBiB,aACnB3B,mCAAS2B,aACTzB,WAAW,eACTO,KAAKT,mCAASoB,cAAcV,mBAAmBU,YAAY,GAC7DlB,WAAW,WACTO,KAAKT,mCAAS4B,eAAelB,mBAAmBkB,aAAa,CACjE;AAAA,UACAC,SAAS3B;AAAAA,QAAAA,CACV;AAAA,MAAA,CACyB,CAAC;AAAA,IAAA,CACN;AAAA,EAAA,CACf;AAEhB;"}
+{"version":3,"file":"ProgressBar.js","sources":["../../../../src/components/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport clamp from \"lodash/clamp\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypography, HvTypographyProps } from \"@core/components/Typography\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { staticClasses, useClasses } from \"./ProgressBar.styles\";\n\nexport { staticClasses as progressBarClasses };\n\nexport type HvProgressBarClasses = ExtractNames<typeof useClasses>;\n\nexport type HvProgressBarStatus = \"inProgress\" | \"completed\" | \"error\";\n\n/**\n * ProgressBar provides feedback about a process that is taking place in the application.\n */\nexport interface HvProgressBarProps extends HvBaseProps {\n  /** The value of the progress bar. */\n  value: number;\n  /**\n   * The status of the progress bar.\n   *\n   * inProgress is black, error is red and completed is green.\n   *\n   * When uncontrolled and unspecified it will default to \"inProgress\".\n   */\n  status?: HvProgressBarStatus;\n  /** Aria Properties passed on to the progress bar. */\n  labelProps?: HvTypographyProps;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvProgressBarClasses;\n}\n\nexport const HvProgressBar = (props: HvProgressBarProps) => {\n  const {\n    className,\n    classes: classesProp,\n    value = 0,\n    status = \"inProgress\",\n    labelProps,\n    ...others\n  } = useDefaultProps(\"HvProgressBar\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const clampedValue = clamp(value, 0, 100);\n\n  return (\n    <div\n      className={cx(classes.root, classes.progress, className)}\n      role=\"progressbar\"\n      aria-valuemin={0}\n      aria-valuemax={100}\n      aria-valuenow={clampedValue}\n      {...others}\n    >\n      <div className={classes.progressContainer}>\n        <HvTypography\n          className={classes.progressBarLabel}\n          variant=\"caption2\"\n          style={{ width: `${clampedValue}%` }}\n          {...labelProps}\n        >\n          {`${clampedValue}%`}\n        </HvTypography>\n        <div className={classes.progressBarContainer}>\n          <div\n            style={{ width: `${clampedValue}%` }}\n            className={cx(classes.progressBar, {\n              [classes.progressDone]: status === \"completed\",\n              [classes.progressError]: status === \"error\",\n            })}\n          />\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["HvProgressBar","props","className","classes","classesProp","value","status","labelProps","others","useDefaultProps","cx","useClasses","clampedValue","clamp","root","progress","role","children","progressContainer","_jsx","HvTypography","progressBarLabel","variant","style","width","progressBarContainer","progressBar","progressDone","progressError"],"mappings":";;;;;;AAoCaA,MAAAA,gBAAgBA,CAACC,UAA8B;AACpD,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC,QAAQ;AAAA,IACRC,SAAS;AAAA,IACTC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,iBAAiBR,KAAK;AAEpC,QAAA;AAAA,IAAEE;AAAAA,IAASO;AAAAA,EAAAA,IAAOC,WAAWP,WAAW;AAE9C,QAAMQ,eAAeC,MAAMR,OAAO,GAAG,GAAG;AAExC,6BACE,OAAA;AAAA,IACEH,WAAWQ,GAAGP,QAAQW,MAAMX,QAAQY,UAAUb,SAAS;AAAA,IACvDc,MAAK;AAAA,IACL,iBAAe;AAAA,IACf,iBAAe;AAAA,IACf,iBAAeJ;AAAAA,IAAa,GACxBJ;AAAAA,IAAMS,+BAEV,OAAA;AAAA,MAAKf,WAAWC,QAAQe;AAAAA,MAAkBD,UAAA,CACxCE,oBAACC,cAAY;AAAA,QACXlB,WAAWC,QAAQkB;AAAAA,QACnBC,SAAQ;AAAA,QACRC,OAAO;AAAA,UAAEC,OAAQ,GAAEZ;AAAAA,QAAgB;AAAA,QAAE,GACjCL;AAAAA,QAAUU,UAEZ,GAAEL;AAAAA,MAAAA,CACQ,GACdO,oBAAA,OAAA;AAAA,QAAKjB,WAAWC,QAAQsB;AAAAA,QAAqBR,8BAC3C,OAAA;AAAA,UACEM,OAAO;AAAA,YAAEC,OAAQ,GAAEZ;AAAAA,UAAgB;AAAA,UACnCV,WAAWQ,GAAGP,QAAQuB,aAAa;AAAA,YACjC,CAACvB,QAAQwB,YAAY,GAAGrB,WAAW;AAAA,YACnC,CAACH,QAAQyB,aAAa,GAAGtB,WAAW;AAAA,UAAA,CACrC;AAAA,QAAA,CACF;AAAA,MAAA,CACE,CAAC;AAAA,IAAA,CACH;AAAA,EAAA,CACF;AAET;"}

package/dist/esm/components/ProgressBar/ProgressBar.styles.js

@@ -1,99 +1,47 @@
-import _styled from "@emotion/styled/base";
 import { theme } from "@hitachivantara/uikit-styles";
-import { transientOptions } from "../../utils/transientOptions.js";
-import { HvTypography } from "../Typography/Typography.js";
-function _EMOTION_STRINGIFIED_CSS_ERROR__() {
-  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
-}
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function(target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
-const StyledRoot = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  target: "e1eucrrc4"
-} : {
-  target: "e1eucrrc4",
-  label: "StyledRoot"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1mob3m4",
-  styles: "display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%"
-} : {
-  name: "1mob3m4",
-  styles: "display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvUHJvZ3Jlc3NCYXIvUHJvZ3Jlc3NCYXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPMEIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9Qcm9ncmVzc0Jhci9Qcm9ncmVzc0Jhci5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5cbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcblxuaW1wb3J0IHsgSHZUeXBvZ3JhcGh5IH0gZnJvbSBcIkBjb3JlL2NvbXBvbmVudHMvVHlwb2dyYXBoeVwiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJAY29yZS91dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRSb290ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGZsZXhEaXJlY3Rpb246IFwiY29sdW1uXCIsXG4gIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gIGp1c3RpZnlDb250ZW50OiBcImNlbnRlclwiLFxuXG4gIC8vIHByb2dyZXNzXG4gIHdpZHRoOiBcIjEwMCVcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUHJvZ3Jlc3NDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICB3aWR0aDogXCIxMDAlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFZhbHVlID0gc3R5bGVkKEh2VHlwb2dyYXBoeSkoe1xuICBiYWNrZ3JvdW5kQ29sb3I6IFwidHJhbnNwYXJlbnRcIixcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGp1c3RpZnlDb250ZW50OiBcImVuZFwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQcm9ncmVzc0JhckNvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIGhlaWdodDogNCxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzQsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFByb2dyZXNzQmFyID0gc3R5bGVkKFxuICBcImRpdlwiLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKCh7ICRzdGF0dXMgfTogeyAkc3RhdHVzPzogXCJpblByb2dyZXNzXCIgfCBcImNvbXBsZXRlZFwiIHwgXCJlcnJvclwiIH0pID0+ICh7XG4gIGJhY2tncm91bmRDb2xvcjogXCIjMDAwXCIsXG4gIGhlaWdodDogNCxcbiAgLi4uKCRzdGF0dXMgPT09IFwiY29tcGxldGVkXCIgJiYge1xuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLnBvc2l0aXZlLFxuICB9KSxcbiAgLi4uKCRzdGF0dXMgPT09IFwiZXJyb3JcIiAmJiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMubmVnYXRpdmUsXG4gIH0pLFxufSkpO1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const StyledProgressContainer = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  target: "e1eucrrc3"
-} : {
-  target: "e1eucrrc3",
-  label: "StyledProgressContainer"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1d3w5wq",
-  styles: "width:100%"
-} : {
-  name: "1d3w5wq",
-  styles: "width:100%",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvUHJvZ3Jlc3NCYXIvUHJvZ3Jlc3NCYXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQnVDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvUHJvZ3Jlc3NCYXIvUHJvZ3Jlc3NCYXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IHRyYW5zaWVudE9wdGlvbnMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvdHJhbnNpZW50T3B0aW9uc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcblxuICAvLyBwcm9ncmVzc1xuICB3aWR0aDogXCIxMDAlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFByb2dyZXNzQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgd2lkdGg6IFwiMTAwJVwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRWYWx1ZSA9IHN0eWxlZChIdlR5cG9ncmFwaHkpKHtcbiAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJlbmRcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUHJvZ3Jlc3NCYXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBoZWlnaHQ6IDQsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW80LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQcm9ncmVzc0JhciA9IHN0eWxlZChcbiAgXCJkaXZcIixcbiAgdHJhbnNpZW50T3B0aW9uc1xuKSgoeyAkc3RhdHVzIH06IHsgJHN0YXR1cz86IFwiaW5Qcm9ncmVzc1wiIHwgXCJjb21wbGV0ZWRcIiB8IFwiZXJyb3JcIiB9KSA9PiAoe1xuICBiYWNrZ3JvdW5kQ29sb3I6IFwiIzAwMFwiLFxuICBoZWlnaHQ6IDQsXG4gIC4uLigkc3RhdHVzID09PSBcImNvbXBsZXRlZFwiICYmIHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5wb3NpdGl2ZSxcbiAgfSksXG4gIC4uLigkc3RhdHVzID09PSBcImVycm9yXCIgJiYge1xuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICB9KSxcbn0pKTtcbiJdfQ== */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const StyledValue = /* @__PURE__ */ _styled(HvTypography, process.env.NODE_ENV === "production" ? {
-  target: "e1eucrrc2"
-} : {
-  target: "e1eucrrc2",
-  label: "StyledValue"
-})(process.env.NODE_ENV === "production" ? {
-  name: "hdch65",
-  styles: "background-color:transparent;display:flex;justify-content:end"
-} : {
-  name: "hdch65",
-  styles: "background-color:transparent;display:flex;justify-content:end",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvUHJvZ3Jlc3NCYXIvUHJvZ3Jlc3NCYXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQjJCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvUHJvZ3Jlc3NCYXIvUHJvZ3Jlc3NCYXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IHRyYW5zaWVudE9wdGlvbnMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvdHJhbnNpZW50T3B0aW9uc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcblxuICAvLyBwcm9ncmVzc1xuICB3aWR0aDogXCIxMDAlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFByb2dyZXNzQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgd2lkdGg6IFwiMTAwJVwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRWYWx1ZSA9IHN0eWxlZChIdlR5cG9ncmFwaHkpKHtcbiAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJlbmRcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUHJvZ3Jlc3NCYXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBoZWlnaHQ6IDQsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW80LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQcm9ncmVzc0JhciA9IHN0eWxlZChcbiAgXCJkaXZcIixcbiAgdHJhbnNpZW50T3B0aW9uc1xuKSgoeyAkc3RhdHVzIH06IHsgJHN0YXR1cz86IFwiaW5Qcm9ncmVzc1wiIHwgXCJjb21wbGV0ZWRcIiB8IFwiZXJyb3JcIiB9KSA9PiAoe1xuICBiYWNrZ3JvdW5kQ29sb3I6IFwiIzAwMFwiLFxuICBoZWlnaHQ6IDQsXG4gIC4uLigkc3RhdHVzID09PSBcImNvbXBsZXRlZFwiICYmIHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5wb3NpdGl2ZSxcbiAgfSksXG4gIC4uLigkc3RhdHVzID09PSBcImVycm9yXCIgJiYge1xuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICB9KSxcbn0pKTtcbiJdfQ== */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const StyledProgressBarContainer = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  target: "e1eucrrc1"
-} : {
-  target: "e1eucrrc1",
-  label: "StyledProgressBarContainer"
-})({
-  display: "flex",
-  width: "100%",
-  height: 4,
-  backgroundColor: theme.colors.atmo4
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvUHJvZ3Jlc3NCYXIvUHJvZ3Jlc3NCYXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQjBDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvUHJvZ3Jlc3NCYXIvUHJvZ3Jlc3NCYXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IHRyYW5zaWVudE9wdGlvbnMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvdHJhbnNpZW50T3B0aW9uc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcblxuICAvLyBwcm9ncmVzc1xuICB3aWR0aDogXCIxMDAlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFByb2dyZXNzQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgd2lkdGg6IFwiMTAwJVwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRWYWx1ZSA9IHN0eWxlZChIdlR5cG9ncmFwaHkpKHtcbiAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJlbmRcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUHJvZ3Jlc3NCYXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBoZWlnaHQ6IDQsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW80LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQcm9ncmVzc0JhciA9IHN0eWxlZChcbiAgXCJkaXZcIixcbiAgdHJhbnNpZW50T3B0aW9uc1xuKSgoeyAkc3RhdHVzIH06IHsgJHN0YXR1cz86IFwiaW5Qcm9ncmVzc1wiIHwgXCJjb21wbGV0ZWRcIiB8IFwiZXJyb3JcIiB9KSA9PiAoe1xuICBiYWNrZ3JvdW5kQ29sb3I6IFwiIzAwMFwiLFxuICBoZWlnaHQ6IDQsXG4gIC4uLigkc3RhdHVzID09PSBcImNvbXBsZXRlZFwiICYmIHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5wb3NpdGl2ZSxcbiAgfSksXG4gIC4uLigkc3RhdHVzID09PSBcImVycm9yXCIgJiYge1xuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICB9KSxcbn0pKTtcbiJdfQ== */");
-const StyledProgressBar = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? _extends({}, {
-  target: "e1eucrrc0"
-}, transientOptions) : _extends({}, {
-  target: "e1eucrrc0",
-  label: "StyledProgressBar"
-}, transientOptions))(({
-  $status
-}) => ({
-  backgroundColor: "#000",
-  height: 4,
-  ...$status === "completed" && {
+import { createClasses } from "../../utils/classes.js";
+const {
+  useClasses,
+  staticClasses
+} = createClasses("HvProgressBar", {
+  root: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    justifyContent: "center",
+    // progress
+    width: "100%"
+  },
+  progress: {
+    width: "100%"
+  },
+  progressBar: {
+    backgroundColor: "#000",
+    height: 4
+  },
+  progressBarLabel: {
+    backgroundColor: "transparent",
+    display: "flex",
+    justifyContent: "end"
+  },
+  progressContainer: {
+    width: "100%"
+  },
+  progressDone: {
     backgroundColor: theme.colors.positive
   },
-  ...$status === "error" && {
+  progressBarContainer: {
+    display: "flex",
+    width: "100%",
+    height: 4,
+    backgroundColor: theme.colors.atmo4
+  },
+  progressError: {
     backgroundColor: theme.colors.negative
   }
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvUHJvZ3Jlc3NCYXIvUHJvZ3Jlc3NCYXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQ2lDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvUHJvZ3Jlc3NCYXIvUHJvZ3Jlc3NCYXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IHRyYW5zaWVudE9wdGlvbnMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvdHJhbnNpZW50T3B0aW9uc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcblxuICAvLyBwcm9ncmVzc1xuICB3aWR0aDogXCIxMDAlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFByb2dyZXNzQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgd2lkdGg6IFwiMTAwJVwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRWYWx1ZSA9IHN0eWxlZChIdlR5cG9ncmFwaHkpKHtcbiAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJlbmRcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUHJvZ3Jlc3NCYXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBoZWlnaHQ6IDQsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW80LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQcm9ncmVzc0JhciA9IHN0eWxlZChcbiAgXCJkaXZcIixcbiAgdHJhbnNpZW50T3B0aW9uc1xuKSgoeyAkc3RhdHVzIH06IHsgJHN0YXR1cz86IFwiaW5Qcm9ncmVzc1wiIHwgXCJjb21wbGV0ZWRcIiB8IFwiZXJyb3JcIiB9KSA9PiAoe1xuICBiYWNrZ3JvdW5kQ29sb3I6IFwiIzAwMFwiLFxuICBoZWlnaHQ6IDQsXG4gIC4uLigkc3RhdHVzID09PSBcImNvbXBsZXRlZFwiICYmIHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5wb3NpdGl2ZSxcbiAgfSksXG4gIC4uLigkc3RhdHVzID09PSBcImVycm9yXCIgJiYge1xuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICB9KSxcbn0pKTtcbiJdfQ== */");
+});
 export {
-  StyledProgressBar,
-  StyledProgressBarContainer,
-  StyledProgressContainer,
-  StyledRoot,
-  StyledValue
+  staticClasses,
+  useClasses
 };
 //# sourceMappingURL=ProgressBar.styles.js.map

package/dist/esm/components/ProgressBar/ProgressBar.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.styles.js","sources":["../../../../src/components/ProgressBar/ProgressBar.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { transientOptions } from \"@core/utils/transientOptions\";\n\nexport const StyledRoot = styled(\"div\")({\n  display: \"flex\",\n  flexDirection: \"column\",\n  alignItems: \"center\",\n  justifyContent: \"center\",\n\n  // progress\n  width: \"100%\",\n});\n\nexport const StyledProgressContainer = styled(\"div\")({\n  width: \"100%\",\n});\n\nexport const StyledValue = styled(HvTypography)({\n  backgroundColor: \"transparent\",\n  display: \"flex\",\n  justifyContent: \"end\",\n});\n\nexport const StyledProgressBarContainer = styled(\"div\")({\n  display: \"flex\",\n  width: \"100%\",\n  height: 4,\n  backgroundColor: theme.colors.atmo4,\n});\n\nexport const StyledProgressBar = styled(\n  \"div\",\n  transientOptions\n)(({ $status }: { $status?: \"inProgress\" | \"completed\" | \"error\" }) => ({\n  backgroundColor: \"#000\",\n  height: 4,\n  ...($status === \"completed\" && {\n    backgroundColor: theme.colors.positive,\n  }),\n  ...($status === \"error\" && {\n    backgroundColor: theme.colors.negative,\n  }),\n}));\n"],"names":["StyledRoot","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledProgressContainer","StyledValue","HvTypography","StyledProgressBarContainer","display","width","height","backgroundColor","theme","colors","atmo4","StyledProgressBar","_extends","transientOptions","$status","positive","negative"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAOO,MAAMA,aAAoB,wBAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAQtC;AAEM,MAAMC,0BAAiC,wBAAA,OAAKV,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAEnD;AAEM,MAAME,cAAqBC,wBAAAA,cAAYZ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAI9C;AAEM,MAAMI,6BAAoC,wBAAA,OAAKb,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACtDU,SAAS;AAAA,EACTC,OAAO;AAAA,EACPC,QAAQ;AAAA,EACRC,iBAAiBC,MAAMC,OAAOC;AAChC,GAACpB,QAAAC,IAAAC,aAAC,eAAA,KAAA,qjEAAA;AAEWmB,MAAAA,4CACX,OAAKrB,QAAAC,IAAAC,4BAAAoB,SAAA,IAAA;AAAA,EAAAnB,QAAA;AAAA,GACLoB,gBAAgB,IAAAD,SAAA,IAAA;AAAA,EAAAnB,QAAA;AAAA,EAAAC,OAAA;AAAA,GAAhBmB,gBAAgB,CAClB,EAAE,CAAC;AAAA,EAAEC;AAA4D,OAAO;AAAA,EACtEP,iBAAiB;AAAA,EACjBD,QAAQ;AAAA,EACR,GAAIQ,YAAY,eAAe;AAAA,IAC7BP,iBAAiBC,MAAMC,OAAOM;AAAAA,EAChC;AAAA,EACA,GAAID,YAAY,WAAW;AAAA,IACzBP,iBAAiBC,MAAMC,OAAOO;AAAAA,EAChC;AACF,IAAE1B,QAAAC,IAAAC,aAAC,eAAA,KAAA,qjEAAA;"}
+{"version":3,"file":"ProgressBar.styles.js","sources":["../../../../src/components/ProgressBar/ProgressBar.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { useClasses, staticClasses } = createClasses(\"HvProgressBar\", {\n  root: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n\n    // progress\n    width: \"100%\",\n  },\n  progress: {\n    width: \"100%\",\n  },\n  progressBar: {\n    backgroundColor: \"#000\",\n    height: 4,\n  },\n  progressBarLabel: {\n    backgroundColor: \"transparent\",\n    display: \"flex\",\n    justifyContent: \"end\",\n  },\n  progressContainer: {\n    width: \"100%\",\n  },\n  progressDone: {\n    backgroundColor: theme.colors.positive,\n  },\n  progressBarContainer: {\n    display: \"flex\",\n    width: \"100%\",\n    height: 4,\n    backgroundColor: theme.colors.atmo4,\n  },\n  progressError: {\n    backgroundColor: theme.colors.negative,\n  },\n});\n"],"names":["useClasses","staticClasses","createClasses","root","display","flexDirection","alignItems","justifyContent","width","progress","progressBar","backgroundColor","height","progressBarLabel","progressContainer","progressDone","theme","colors","positive","progressBarContainer","atmo4","progressError","negative"],"mappings":";;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAYC;AAAc,IAAIC,cAAc,iBAAiB;AAAA,EAC1EC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,YAAY;AAAA,IACZC,gBAAgB;AAAA;AAAA,IAGhBC,OAAO;AAAA,EACT;AAAA,EACAC,UAAU;AAAA,IACRD,OAAO;AAAA,EACT;AAAA,EACAE,aAAa;AAAA,IACXC,iBAAiB;AAAA,IACjBC,QAAQ;AAAA,EACV;AAAA,EACAC,kBAAkB;AAAA,IAChBF,iBAAiB;AAAA,IACjBP,SAAS;AAAA,IACTG,gBAAgB;AAAA,EAClB;AAAA,EACAO,mBAAmB;AAAA,IACjBN,OAAO;AAAA,EACT;AAAA,EACAO,cAAc;AAAA,IACZJ,iBAAiBK,MAAMC,OAAOC;AAAAA,EAChC;AAAA,EACAC,sBAAsB;AAAA,IACpBf,SAAS;AAAA,IACTI,OAAO;AAAA,IACPI,QAAQ;AAAA,IACRD,iBAAiBK,MAAMC,OAAOG;AAAAA,EAChC;AAAA,EACAC,eAAe;AAAA,IACbV,iBAAiBK,MAAMC,OAAOK;AAAAA,EAChC;AACF,CAAC;"}

package/dist/esm/components/RadioGroup/RadioGroup.styles.js

@@ -25,10 +25,6 @@ const {
     },
     "&>*:focus-within": {
       zIndex: 1
-    },
-    // IE fallback code (using focus-within-polyfill)
-    "&>*.focus-within": {
-      zIndex: 1
     }
   },
   horizontal: {

package/dist/esm/components/RadioGroup/RadioGroup.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.styles.js","sources":["../../../../src/components/RadioGroup/RadioGroup.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvRadioGroup\", {\n  root: {\n    display: \"inline-block\",\n    padding: 0,\n    margin: 0,\n    overflow: \"hidden\",\n    verticalAlign: \"top\",\n  },\n  label: { marginBottom: theme.space.xs },\n  group: { display: \"flex\" },\n  vertical: {\n    flexDirection: \"column\",\n\n    // Prevent the focus ring to be hidden by sibling hover background\n    \"&>*\": {\n      zIndex: 0,\n    },\n    \"&>*:focus-within\": {\n      zIndex: 1,\n    },\n    // IE fallback code (using focus-within-polyfill)\n    \"&>*.focus-within\": {\n      zIndex: 1,\n    },\n  },\n  horizontal: {\n    flexDirection: \"row\",\n    flexWrap: \"wrap\",\n    \"&>*:not(:first-of-type)\": {\n      marginLeft: theme.space.sm,\n    },\n    width: `calc(100% + ${theme.space.sm})`, // Compensate the negative margin left which increases the width\n  },\n  invalid: {\n    paddingBottom: theme.space.xs,\n    borderBottom: `1px solid ${theme.colors.negative}`,\n  },\n  error: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","padding","margin","overflow","verticalAlign","label","marginBottom","theme","space","xs","group","vertical","flexDirection","zIndex","horizontal","flexWrap","marginLeft","sm","width","invalid","paddingBottom","borderBottom","colors","negative","error"],"mappings":";;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,gBAAgB;AAAA,EACzEC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,UAAU;AAAA,IACVC,eAAe;AAAA,EACjB;AAAA,EACAC,OAAO;AAAA,IAAEC,cAAcC,MAAMC,MAAMC;AAAAA,EAAG;AAAA,EACtCC,OAAO;AAAA,IAAEV,SAAS;AAAA,EAAO;AAAA,EACzBW,UAAU;AAAA,IACRC,eAAe;AAAA;AAAA,IAGf,OAAO;AAAA,MACLC,QAAQ;AAAA,IACV;AAAA,IACA,oBAAoB;AAAA,MAClBA,QAAQ;AAAA,IACV;AAAA;AAAA,IAEA,oBAAoB;AAAA,MAClBA,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACAC,YAAY;AAAA,IACVF,eAAe;AAAA,IACfG,UAAU;AAAA,IACV,2BAA2B;AAAA,MACzBC,YAAYT,MAAMC,MAAMS;AAAAA,IAC1B;AAAA,IACAC,OAAQ,eAAcX,MAAMC,MAAMS;AAAAA;AAAAA,EACpC;AAAA,EACAE,SAAS;AAAA,IACPC,eAAeb,MAAMC,MAAMC;AAAAA,IAC3BY,cAAe,aAAYd,MAAMe,OAAOC;AAAAA,EAC1C;AAAA,EACAC,OAAO,CAAC;AACV,CAAC;"}
+{"version":3,"file":"RadioGroup.styles.js","sources":["../../../../src/components/RadioGroup/RadioGroup.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvRadioGroup\", {\n  root: {\n    display: \"inline-block\",\n    padding: 0,\n    margin: 0,\n    overflow: \"hidden\",\n    verticalAlign: \"top\",\n  },\n  label: { marginBottom: theme.space.xs },\n  group: { display: \"flex\" },\n  vertical: {\n    flexDirection: \"column\",\n\n    // Prevent the focus ring to be hidden by sibling hover background\n    \"&>*\": {\n      zIndex: 0,\n    },\n    \"&>*:focus-within\": {\n      zIndex: 1,\n    },\n  },\n  horizontal: {\n    flexDirection: \"row\",\n    flexWrap: \"wrap\",\n    \"&>*:not(:first-of-type)\": {\n      marginLeft: theme.space.sm,\n    },\n    width: `calc(100% + ${theme.space.sm})`, // Compensate the negative margin left which increases the width\n  },\n  invalid: {\n    paddingBottom: theme.space.xs,\n    borderBottom: `1px solid ${theme.colors.negative}`,\n  },\n  error: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","padding","margin","overflow","verticalAlign","label","marginBottom","theme","space","xs","group","vertical","flexDirection","zIndex","horizontal","flexWrap","marginLeft","sm","width","invalid","paddingBottom","borderBottom","colors","negative","error"],"mappings":";;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,gBAAgB;AAAA,EACzEC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,UAAU;AAAA,IACVC,eAAe;AAAA,EACjB;AAAA,EACAC,OAAO;AAAA,IAAEC,cAAcC,MAAMC,MAAMC;AAAAA,EAAG;AAAA,EACtCC,OAAO;AAAA,IAAEV,SAAS;AAAA,EAAO;AAAA,EACzBW,UAAU;AAAA,IACRC,eAAe;AAAA;AAAA,IAGf,OAAO;AAAA,MACLC,QAAQ;AAAA,IACV;AAAA,IACA,oBAAoB;AAAA,MAClBA,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACAC,YAAY;AAAA,IACVF,eAAe;AAAA,IACfG,UAAU;AAAA,IACV,2BAA2B;AAAA,MACzBC,YAAYT,MAAMC,MAAMS;AAAAA,IAC1B;AAAA,IACAC,OAAQ,eAAcX,MAAMC,MAAMS;AAAAA;AAAAA,EACpC;AAAA,EACAE,SAAS;AAAA,IACPC,eAAeb,MAAMC,MAAMC;AAAAA,IAC3BY,cAAe,aAAYd,MAAMe,OAAOC;AAAAA,EAC1C;AAAA,EACAC,OAAO,CAAC;AACV,CAAC;"}

package/dist/esm/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.js

@@ -23,7 +23,7 @@ const HvHorizontalScrollListItem = ({
   const Tooltip = tooltipWrapper;
   return /* @__PURE__ */ jsx("li", {
     id,
-    className: cx(className, classes.root),
+    className: cx(classes.root, className),
     "aria-current": selected,
     children: /* @__PURE__ */ jsx("div", {
       id: buttonId,

package/dist/esm/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalScrollListItem.js","sources":["../../../../../../src/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.tsx"],"sourcesContent":["import { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { HvTypographyProps } from \"@core/components/Typography\";\n\nimport { staticClasses, useClasses } from \"./HorizontalScrollListItem.styles\";\n\nexport { staticClasses as horizontalScrollListItemClasses };\n\nexport type HvHorizontalScrollListItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalScrollListItemProps extends HvBaseProps {\n  /** The text to render.  */\n  children: React.ReactNode;\n  /** A function component that renders a typography wrapped with a tooltip. */\n  tooltipWrapper: React.FunctionComponent<{\n    id?: string;\n    className?: string;\n    variant?: HvTypographyProps[\"variant\"];\n    children?: React.ReactNode;\n  }>;\n  /** Whether the element is selected. */\n  selected?: boolean;\n  /** The function to be executed when the element is clicked. */\n  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /** The function to be executed when the element is clicked. */\n  onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvHorizontalScrollListItemClasses;\n}\n\n/**\n * HvHorizontalScrollListItem a focusable item to be used as part of the horizontal scroll\n */\nexport const HvHorizontalScrollListItem = ({\n  id,\n  className,\n  classes: classesProp,\n  selected,\n  children,\n  onClick,\n  onKeyDown,\n  tooltipWrapper,\n  ...others\n}: HvVerticalScrollListItemProps) => {\n  const { classes, cx } = useClasses(classesProp);\n  const variant = selected ? \"label\" : \"body\";\n  const labelId = setId(id, \"label\");\n  const buttonId = setId(id, \"button\");\n  const Tooltip = tooltipWrapper;\n\n  return (\n    <li id={id} className={cx(className, classes.root)} aria-current={selected}>\n      <div\n        id={buttonId}\n        role=\"button\"\n        tabIndex={0}\n        onClick={onClick}\n        onKeyDown={onKeyDown}\n        className={classes.button}\n        aria-labelledby={labelId}\n        {...others}\n      >\n        <Tooltip\n          id={labelId}\n          className={cx(classes.text, { [classes.selected]: selected })}\n          variant={variant}\n        >\n          {children}\n        </Tooltip>\n      </div>\n    </li>\n  );\n};\n"],"names":["HvHorizontalScrollListItem","id","className","classes","classesProp","selected","children","onClick","onKeyDown","tooltipWrapper","others","cx","useClasses","variant","labelId","setId","buttonId","Tooltip","root","role","tabIndex","button","text"],"mappings":";;;;AAkCO,MAAMA,6BAA6BA,CAAC;AAAA,EACzCC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC0B,MAAM;AAC7B,QAAA;AAAA,IAAEP;AAAAA,IAASQ;AAAAA,EAAAA,IAAOC,WAAWR,WAAW;AACxCS,QAAAA,UAAUR,WAAW,UAAU;AAC/BS,QAAAA,UAAUC,MAAMd,IAAI,OAAO;AAC3Be,QAAAA,WAAWD,MAAMd,IAAI,QAAQ;AACnC,QAAMgB,UAAUR;AAEhB,6BACE,MAAA;AAAA,IAAIR;AAAAA,IAAQC,WAAWS,GAAGT,WAAWC,QAAQe,IAAI;AAAA,IAAG,gBAAcb;AAAAA,IAASC,8BACzE,OAAA;AAAA,MACEL,IAAIe;AAAAA,MACJG,MAAK;AAAA,MACLC,UAAU;AAAA,MACVb;AAAAA,MACAC;AAAAA,MACAN,WAAWC,QAAQkB;AAAAA,MACnB,mBAAiBP;AAAAA,MAAQ,GACrBJ;AAAAA,MAAMJ,8BAETW,SAAO;AAAA,QACNhB,IAAIa;AAAAA,QACJZ,WAAWS,GAAGR,QAAQmB,MAAM;AAAA,UAAE,CAACnB,QAAQE,QAAQ,GAAGA;AAAAA,QAAAA,CAAU;AAAA,QAC5DQ;AAAAA,QAAiBP;AAAAA,MAAAA,CAGV;AAAA,IAAA,CACN;AAAA,EAAA,CACH;AAER;"}
+{"version":3,"file":"HorizontalScrollListItem.js","sources":["../../../../../../src/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.tsx"],"sourcesContent":["import { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { HvTypographyProps } from \"@core/components/Typography\";\n\nimport { staticClasses, useClasses } from \"./HorizontalScrollListItem.styles\";\n\nexport { staticClasses as horizontalScrollListItemClasses };\n\nexport type HvHorizontalScrollListItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalScrollListItemProps extends HvBaseProps {\n  /** The text to render.  */\n  children: React.ReactNode;\n  /** A function component that renders a typography wrapped with a tooltip. */\n  tooltipWrapper: React.FunctionComponent<{\n    id?: string;\n    className?: string;\n    variant?: HvTypographyProps[\"variant\"];\n    children?: React.ReactNode;\n  }>;\n  /** Whether the element is selected. */\n  selected?: boolean;\n  /** The function to be executed when the element is clicked. */\n  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /** The function to be executed when the element is clicked. */\n  onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvHorizontalScrollListItemClasses;\n}\n\n/**\n * HvHorizontalScrollListItem a focusable item to be used as part of the horizontal scroll\n */\nexport const HvHorizontalScrollListItem = ({\n  id,\n  className,\n  classes: classesProp,\n  selected,\n  children,\n  onClick,\n  onKeyDown,\n  tooltipWrapper,\n  ...others\n}: HvVerticalScrollListItemProps) => {\n  const { classes, cx } = useClasses(classesProp);\n  const variant = selected ? \"label\" : \"body\";\n  const labelId = setId(id, \"label\");\n  const buttonId = setId(id, \"button\");\n  const Tooltip = tooltipWrapper;\n\n  return (\n    <li id={id} className={cx(classes.root, className)} aria-current={selected}>\n      <div\n        id={buttonId}\n        role=\"button\"\n        tabIndex={0}\n        onClick={onClick}\n        onKeyDown={onKeyDown}\n        className={classes.button}\n        aria-labelledby={labelId}\n        {...others}\n      >\n        <Tooltip\n          id={labelId}\n          className={cx(classes.text, { [classes.selected]: selected })}\n          variant={variant}\n        >\n          {children}\n        </Tooltip>\n      </div>\n    </li>\n  );\n};\n"],"names":["HvHorizontalScrollListItem","id","className","classes","classesProp","selected","children","onClick","onKeyDown","tooltipWrapper","others","cx","useClasses","variant","labelId","setId","buttonId","Tooltip","root","role","tabIndex","button","text"],"mappings":";;;;AAkCO,MAAMA,6BAA6BA,CAAC;AAAA,EACzCC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC0B,MAAM;AAC7B,QAAA;AAAA,IAAEP;AAAAA,IAASQ;AAAAA,EAAAA,IAAOC,WAAWR,WAAW;AACxCS,QAAAA,UAAUR,WAAW,UAAU;AAC/BS,QAAAA,UAAUC,MAAMd,IAAI,OAAO;AAC3Be,QAAAA,WAAWD,MAAMd,IAAI,QAAQ;AACnC,QAAMgB,UAAUR;AAEhB,6BACE,MAAA;AAAA,IAAIR;AAAAA,IAAQC,WAAWS,GAAGR,QAAQe,MAAMhB,SAAS;AAAA,IAAG,gBAAcG;AAAAA,IAASC,8BACzE,OAAA;AAAA,MACEL,IAAIe;AAAAA,MACJG,MAAK;AAAA,MACLC,UAAU;AAAA,MACVb;AAAAA,MACAC;AAAAA,MACAN,WAAWC,QAAQkB;AAAAA,MACnB,mBAAiBP;AAAAA,MAAQ,GACrBJ;AAAAA,MAAMJ,8BAETW,SAAO;AAAA,QACNhB,IAAIa;AAAAA,QACJZ,WAAWS,GAAGR,QAAQmB,MAAM;AAAA,UAAE,CAACnB,QAAQE,QAAQ,GAAGA;AAAAA,QAAAA,CAAU;AAAA,QAC5DQ;AAAAA,QAAiBP;AAAAA,MAAAA,CAGV;AAAA,IAAA,CACN;AAAA,EAAA,CACH;AAER;"}

package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.js

@@ -34,7 +34,7 @@ const HvVerticalScrollListItem = ({
   });
   return /* @__PURE__ */ jsx("li", {
     id,
-    className: cx(className, classes.root),
+    className: cx(classes.root, className),
     "aria-current": selected,
     children: /* @__PURE__ */ jsx("div", {
       id: buttonId,

package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalScrollListItem.js","sources":["../../../../../../src/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.tsx"],"sourcesContent":["import { CurrentStep } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypographyProps } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\n\nimport { staticClasses, useClasses } from \"./VerticalScrollListItem.styles\";\n\nexport { staticClasses as verticalScrollListItemClasses };\n\nexport type HvVerticalScrollListItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalScrollListItemProps extends HvBaseProps {\n  /** A function component that renders a typography wrapped with a tooltip. */\n  tooltipWrapper: React.FunctionComponent<{\n    id?: string;\n    className?: string;\n    variant?: HvTypographyProps[\"variant\"];\n    children?: React.ReactNode;\n  }>;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvVerticalScrollListItemClasses;\n  /** Whether the element is selected. */\n  selected?: boolean;\n  /** The function to be executed when the element is clicked. */\n  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /** The function to be executed when the element is clicked. */\n  onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;\n}\n\n/**\n * HvVerticalScrollListItem a focusable item to be used as part of the vertical scroll\n */\nexport const HvVerticalScrollListItem = ({\n  id,\n  className,\n  classes: classesProp,\n  selected,\n  \"aria-label\": ariaLabel,\n  onClick,\n  onKeyDown,\n  tooltipWrapper,\n  ...others\n}: HvVerticalScrollListItemProps) => {\n  const { classes, cx } = useClasses(classesProp);\n  const { activeTheme } = useTheme();\n\n  const variant: HvTypographyProps[\"variant\"] = selected ? \"label\" : \"body\";\n\n  const labelId = setId(id, \"label\");\n\n  const buttonId = setId(id, \"button\");\n\n  const Tooltip = tooltipWrapper;\n\n  const icon = selected ? (\n    <CurrentStep\n      height={activeTheme?.scrollTo.dotSelectedSize}\n      width={activeTheme?.scrollTo.dotSelectedSize}\n    />\n  ) : (\n    <div className={cx(classes.notSelected)} />\n  );\n\n  return (\n    <li id={id} className={cx(className, classes.root)} aria-current={selected}>\n      <div\n        id={buttonId}\n        role=\"button\"\n        tabIndex={0}\n        onClick={onClick}\n        onKeyDown={onKeyDown}\n        className={classes.button}\n        aria-label={ariaLabel}\n        aria-labelledby={labelId}\n        {...others}\n      >\n        <Tooltip id={labelId} className={classes.text} variant={variant}>\n          {icon}\n        </Tooltip>\n      </div>\n    </li>\n  );\n};\n"],"names":["HvVerticalScrollListItem","id","className","classes","classesProp","selected","ariaLabel","onClick","onKeyDown","tooltipWrapper","others","cx","useClasses","activeTheme","useTheme","variant","labelId","setId","buttonId","Tooltip","icon","_jsx","CurrentStep","height","scrollTo","dotSelectedSize","width","notSelected","root","children","role","tabIndex","button","text"],"mappings":";;;;;;AAmCO,MAAMA,2BAA2BA,CAAC;AAAA,EACvCC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACA,cAAcC;AAAAA,EACdC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC0B,MAAM;AAC7B,QAAA;AAAA,IAAEP;AAAAA,IAASQ;AAAAA,EAAAA,IAAOC,WAAWR,WAAW;AACxC,QAAA;AAAA,IAAES;AAAAA,MAAgBC,SAAS;AAE3BC,QAAAA,UAAwCV,WAAW,UAAU;AAE7DW,QAAAA,UAAUC,MAAMhB,IAAI,OAAO;AAE3BiB,QAAAA,WAAWD,MAAMhB,IAAI,QAAQ;AAEnC,QAAMkB,UAAUV;AAEVW,QAAAA,OAAOf,WACXgB,oBAACC,aAAW;AAAA,IACVC,QAAQV,2CAAaW,SAASC;AAAAA,IAC9BC,OAAOb,2CAAaW,SAASC;AAAAA,EAAAA,CAC9B,IAEDJ,oBAAA,OAAA;AAAA,IAAKnB,WAAWS,GAAGR,QAAQwB,WAAW;AAAA,EAAA,CAAI;AAG5C,6BACE,MAAA;AAAA,IAAI1B;AAAAA,IAAQC,WAAWS,GAAGT,WAAWC,QAAQyB,IAAI;AAAA,IAAG,gBAAcvB;AAAAA,IAASwB,8BACzE,OAAA;AAAA,MACE5B,IAAIiB;AAAAA,MACJY,MAAK;AAAA,MACLC,UAAU;AAAA,MACVxB;AAAAA,MACAC;AAAAA,MACAN,WAAWC,QAAQ6B;AAAAA,MACnB,cAAY1B;AAAAA,MACZ,mBAAiBU;AAAAA,MAAQ,GACrBN;AAAAA,MAAMmB,8BAETV,SAAO;AAAA,QAAClB,IAAIe;AAAAA,QAASd,WAAWC,QAAQ8B;AAAAA,QAAMlB;AAAAA,QAAiBc,UAC7DT;AAAAA,MAAAA,CACM;AAAA,IAAA,CACN;AAAA,EAAA,CACH;AAER;"}
+{"version":3,"file":"VerticalScrollListItem.js","sources":["../../../../../../src/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.tsx"],"sourcesContent":["import { CurrentStep } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypographyProps } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\n\nimport { staticClasses, useClasses } from \"./VerticalScrollListItem.styles\";\n\nexport { staticClasses as verticalScrollListItemClasses };\n\nexport type HvVerticalScrollListItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvVerticalScrollListItemProps extends HvBaseProps {\n  /** A function component that renders a typography wrapped with a tooltip. */\n  tooltipWrapper: React.FunctionComponent<{\n    id?: string;\n    className?: string;\n    variant?: HvTypographyProps[\"variant\"];\n    children?: React.ReactNode;\n  }>;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvVerticalScrollListItemClasses;\n  /** Whether the element is selected. */\n  selected?: boolean;\n  /** The function to be executed when the element is clicked. */\n  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /** The function to be executed when the element is clicked. */\n  onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;\n}\n\n/**\n * HvVerticalScrollListItem a focusable item to be used as part of the vertical scroll\n */\nexport const HvVerticalScrollListItem = ({\n  id,\n  className,\n  classes: classesProp,\n  selected,\n  \"aria-label\": ariaLabel,\n  onClick,\n  onKeyDown,\n  tooltipWrapper,\n  ...others\n}: HvVerticalScrollListItemProps) => {\n  const { classes, cx } = useClasses(classesProp);\n  const { activeTheme } = useTheme();\n\n  const variant: HvTypographyProps[\"variant\"] = selected ? \"label\" : \"body\";\n\n  const labelId = setId(id, \"label\");\n\n  const buttonId = setId(id, \"button\");\n\n  const Tooltip = tooltipWrapper;\n\n  const icon = selected ? (\n    <CurrentStep\n      height={activeTheme?.scrollTo.dotSelectedSize}\n      width={activeTheme?.scrollTo.dotSelectedSize}\n    />\n  ) : (\n    <div className={cx(classes.notSelected)} />\n  );\n\n  return (\n    <li id={id} className={cx(classes.root, className)} aria-current={selected}>\n      <div\n        id={buttonId}\n        role=\"button\"\n        tabIndex={0}\n        onClick={onClick}\n        onKeyDown={onKeyDown}\n        className={classes.button}\n        aria-label={ariaLabel}\n        aria-labelledby={labelId}\n        {...others}\n      >\n        <Tooltip id={labelId} className={classes.text} variant={variant}>\n          {icon}\n        </Tooltip>\n      </div>\n    </li>\n  );\n};\n"],"names":["HvVerticalScrollListItem","id","className","classes","classesProp","selected","ariaLabel","onClick","onKeyDown","tooltipWrapper","others","cx","useClasses","activeTheme","useTheme","variant","labelId","setId","buttonId","Tooltip","icon","_jsx","CurrentStep","height","scrollTo","dotSelectedSize","width","notSelected","root","children","role","tabIndex","button","text"],"mappings":";;;;;;AAmCO,MAAMA,2BAA2BA,CAAC;AAAA,EACvCC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACA,cAAcC;AAAAA,EACdC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC0B,MAAM;AAC7B,QAAA;AAAA,IAAEP;AAAAA,IAASQ;AAAAA,EAAAA,IAAOC,WAAWR,WAAW;AACxC,QAAA;AAAA,IAAES;AAAAA,MAAgBC,SAAS;AAE3BC,QAAAA,UAAwCV,WAAW,UAAU;AAE7DW,QAAAA,UAAUC,MAAMhB,IAAI,OAAO;AAE3BiB,QAAAA,WAAWD,MAAMhB,IAAI,QAAQ;AAEnC,QAAMkB,UAAUV;AAEVW,QAAAA,OAAOf,WACXgB,oBAACC,aAAW;AAAA,IACVC,QAAQV,2CAAaW,SAASC;AAAAA,IAC9BC,OAAOb,2CAAaW,SAASC;AAAAA,EAAAA,CAC9B,IAEDJ,oBAAA,OAAA;AAAA,IAAKnB,WAAWS,GAAGR,QAAQwB,WAAW;AAAA,EAAA,CAAI;AAG5C,6BACE,MAAA;AAAA,IAAI1B;AAAAA,IAAQC,WAAWS,GAAGR,QAAQyB,MAAM1B,SAAS;AAAA,IAAG,gBAAcG;AAAAA,IAASwB,8BACzE,OAAA;AAAA,MACE5B,IAAIiB;AAAAA,MACJY,MAAK;AAAA,MACLC,UAAU;AAAA,MACVxB;AAAAA,MACAC;AAAAA,MACAN,WAAWC,QAAQ6B;AAAAA,MACnB,cAAY1B;AAAAA,MACZ,mBAAiBU;AAAAA,MAAQ,GACrBN;AAAAA,MAAMmB,8BAETV,SAAO;AAAA,QAAClB,IAAIe;AAAAA,QAASd,WAAWC,QAAQ8B;AAAAA,QAAMlB;AAAAA,QAAiBc,UAC7DT;AAAAA,MAAAA,CACM;AAAA,IAAA,CACN;AAAA,EAAA,CACH;AAER;"}

package/dist/esm/components/SelectionList/SelectionList.js

@@ -1,14 +1,18 @@
 import React__default, { useMemo, useRef, useEffect, useCallback } from "react";
 import { useDefaultProps } from "../../hooks/useDefaultProps.js";
-import { clsx } from "clsx";
 import { useUniqueId } from "../../hooks/useUniqueId.js";
 import { useControlled } from "../../hooks/useControlled.js";
 import { multiSelectionEventHandler } from "../../utils/multiSelectionEventHandler.js";
 import { isKey } from "../../utils/keyboardUtils.js";
 import { setId } from "../../utils/setId.js";
-import { StyledFormElement, StyledLabel, StyledInfoMessage, StyledListContainer, StyledError } from "./SelectionList.styles.js";
-import selectionListClasses from "./selectionListClasses.js";
+import { useClasses } from "./SelectionList.styles.js";
+import { staticClasses } from "./SelectionList.styles.js";
 import { jsxs, jsx } from "@emotion/react/jsx-runtime";
+import { HvFormElement } from "../Forms/FormElement/FormElement.js";
+import { HvLabel } from "../Forms/Label/Label.js";
+import { HvInfoMessage } from "../Forms/InfoMessage/InfoMessage.js";
+import { HvListContainer } from "../ListContainer/ListContainer.js";
+import { HvWarningText } from "../Forms/WarningText/WarningText.js";
 const getValueFromSelectedChildren = (children, multiple) => {
   const selectedValues = React__default.Children.toArray(children).map((child) => {
     var _a, _b, _c;
@@ -21,7 +25,7 @@ const getValueFromSelectedChildren = (children, multiple) => {
 const HvSelectionList = (props) => {
   const {
     id,
-    classes,
+    classes: classesProp,
     className,
     children,
     name,
@@ -44,6 +48,10 @@ const HvSelectionList = (props) => {
     singleSelectionToggle = false,
     ...others
   } = useDefaultProps("HvSelectionList", props);
+  const {
+    classes,
+    cx
+  } = useClasses(classesProp);
   const elementId = useUniqueId(id, "hvselectionlist");
   const [value, setValue] = useControlled(valueProp, defaultValue !== void 0 ? defaultValue : (
     // when uncontrolled and no default value is given,
@@ -125,23 +133,23 @@ const HvSelectionList = (props) => {
   const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && required);
   const errorMessageId = canShowError ? setId(elementId, "error") : ariaErrorMessage;
   const listId = label && setId(elementId, "listbox") || "";
-  return /* @__PURE__ */ jsxs(StyledFormElement, {
+  return /* @__PURE__ */ jsxs(HvFormElement, {
     id,
     name,
     status: validationState,
     disabled,
     required,
     readOnly,
-    className: clsx(className, selectionListClasses.root, classes == null ? void 0 : classes.root),
-    children: [label && /* @__PURE__ */ jsx(StyledLabel, {
+    className: cx(classes.root, className),
+    children: [label && /* @__PURE__ */ jsx(HvLabel, {
       id: setId(elementId, "label"),
       label,
-      className: clsx(selectionListClasses.label, classes == null ? void 0 : classes.label)
-    }), description && /* @__PURE__ */ jsx(StyledInfoMessage, {
+      className: classes.label
+    }), description && /* @__PURE__ */ jsx(HvInfoMessage, {
       id: setId(elementId, "description"),
-      className: clsx(selectionListClasses.description, classes == null ? void 0 : classes.description),
+      className: classes.description,
       children: description
-    }), /* @__PURE__ */ jsx(StyledListContainer, {
+    }), /* @__PURE__ */ jsx(HvListContainer, {
       id: listId,
       interactive: true,
       condensed: true,
@@ -152,21 +160,24 @@ const HvSelectionList = (props) => {
       "aria-invalid": validationState === "invalid" ? true : void 0,
       "aria-errormessage": validationState === "invalid" ? errorMessageId : void 0,
       "aria-describedby": [description && setId(elementId, "description"), ariaDescribedBy].join(" ").trim() || void 0,
-      className: clsx(classes == null ? void 0 : classes.listbox, selectionListClasses.listbox, orientation === "vertical" && clsx(selectionListClasses.vertical, classes == null ? void 0 : classes.vertical), orientation === "horizontal" && clsx(selectionListClasses.horizontal, classes == null ? void 0 : classes.horizontal), validationState === "invalid" && clsx(selectionListClasses.invalid, classes == null ? void 0 : classes.invalid)),
+      className: cx(classes.listbox, {
+        [classes.vertical]: orientation === "vertical",
+        [classes.horizontal]: orientation === "horizontal",
+        [classes.invalid]: validationState === "invalid"
+      }),
       ref: listContainer,
-      $orientation: orientation,
-      $validationState: validationState,
       ...others,
       children: modifiedChildren
-    }), canShowError && /* @__PURE__ */ jsx(StyledError, {
+    }), canShowError && /* @__PURE__ */ jsx(HvWarningText, {
       id: setId(elementId, "error"),
       disableBorder: true,
-      className: clsx(selectionListClasses.error, classes == null ? void 0 : classes.error),
+      className: classes.error,
       children: validationMessage
     })]
   });
 };
 export {
-  HvSelectionList
+  HvSelectionList,
+  staticClasses as selectionListClasses
 };
 //# sourceMappingURL=SelectionList.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"SelectionList.js","sources":["../../../../src/components/SelectionList/SelectionList.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useMemo,\n  useRef,\n  useEffect,\n  ReactNode,\n} from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { clsx } from \"clsx\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { multiSelectionEventHandler } from \"@core/utils/multiSelectionEventHandler\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { HvFormStatus } from \"@core/components/Forms/FormElement\";\n\nimport {\n  StyledListContainer,\n  StyledFormElement,\n  StyledLabel,\n  StyledInfoMessage,\n  StyledError,\n} from \"./SelectionList.styles\";\nimport selectionListClasses, {\n  HvSelectionListClasses,\n} from \"./selectionListClasses\";\n\nexport interface HvSelectionListProps\n  extends HvBaseProps<HTMLUListElement, \"onChange\"> {\n  /** The form element name. */\n  name?: string;\n  /**\n   * The value of the form element. It must be represented in the child list items.\n   *\n   * Can either be a single value (when multiple = false) or an\n   * array of values (when multiple = true).\n   *\n   * When defined the selection list state becomes controlled.\n   */\n  value?: any | any[];\n  /** When uncontrolled, defines the initial value. */\n  defaultValue?: any | any[];\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be provided instead.\n   */\n  label?: React.ReactNode;\n  /** Provide additional descriptive text for the form element. */\n  description?: React.ReactNode;\n  /** Indicates that the form element is disabled. If `true` the state is propagated to the children list items. */\n  disabled?: boolean;\n  /** Indicates that the form element is not editable. */\n  readOnly?: boolean;\n  /** Indicates that user input is required on the form element. */\n  required?: boolean;\n  /**\n   * The status of the form element.\n   *\n   * Valid is correct, invalid is incorrect and standBy means no validations have run.\n   *\n   * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n   * or \"invalid\" after any change to the state.\n   */\n  status?: HvFormStatus;\n  /**\n   * The error message to show when the validation status is \"invalid\".\n   *\n   * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n   */\n  statusMessage?: string;\n  /** Indicates that the user may select more than one item from the current selectable list items. */\n  multiple?: boolean;\n  /** If `true`, selection can be toggled when single selection. */\n  singleSelectionToggle?: boolean;\n  /** Indicates whether the list orientation is horizontal or vertical. Defaults to vertical. */\n  orientation?: \"vertical\" | \"horizontal\";\n  /** The callback fired when the value changes. */\n  onChange?: (event: React.MouseEvent, value: any) => void;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvSelectionListClasses;\n}\n\nconst getValueFromSelectedChildren = (\n  children: ReactNode,\n  multiple: boolean\n) => {\n  const selectedValues = React.Children.toArray(children)\n    .map((child: any) => {\n      const childIsControlled = child?.props?.selected !== undefined;\n      const childIsSelected =\n        child && childIsControlled\n          ? child.props?.selected\n          : child.props?.defaultSelected;\n\n      return childIsSelected ? child?.props.value : undefined;\n    })\n    .filter((v) => v !== undefined);\n\n  return multiple ? selectedValues : selectedValues?.[0];\n};\n\n/**\n * Allows the user to select one or more items from a list of choices.\n *\n * Although it supports multi-selection, DS recommends the use of a selection list\n * when it’s clear that the user can only select just one option from the range provided.\n */\nexport const HvSelectionList = (props: HvSelectionListProps) => {\n  const {\n    id,\n    classes,\n    className,\n    children,\n    name,\n    value: valueProp,\n    defaultValue,\n    required = false,\n    readOnly = false,\n    disabled = false,\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    description,\n    \"aria-describedby\": ariaDescribedBy,\n    onChange,\n    status,\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n    orientation = \"vertical\",\n    multiple = false,\n    singleSelectionToggle = false,\n    ...others\n  } = useDefaultProps(\"HvSelectionList\", props);\n\n  const elementId = useUniqueId(id, \"hvselectionlist\");\n\n  const [value, setValue] = useControlled(\n    valueProp,\n    defaultValue !== undefined\n      ? defaultValue\n      : // when uncontrolled and no default value is given,\n        // extract the initial selected values from the children own state\n        () => getValueFromSelectedChildren(children, multiple)\n  );\n\n  const [validationState, setValidationState] = useControlled(\n    status,\n    \"standBy\"\n  );\n\n  const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n  const [allValues, selectedState] = useMemo(() => {\n    const childValues: any[] = [];\n    const childSelectedState: boolean[] = [];\n\n    React.Children.toArray(children).forEach((child: any, i: number) => {\n      const childValue = child?.props?.value;\n      const childIsSelected = multiple\n        ? value.indexOf(childValue) !== -1\n        : value === childValue;\n\n      childValues[i] = childValue;\n      childSelectedState[i] = childIsSelected;\n    });\n\n    return [childValues, childSelectedState];\n  }, [children, multiple, value]);\n\n  const selectionAnchor = useRef(undefined);\n\n  const listContainer = useRef<any>(null);\n\n  useEffect(() => {\n    const handleMeta = (event: KeyboardEvent) => {\n      const tempArray: any[] = [];\n      if (\n        (isKey(event, \"ArrowUp\") &&\n          event.shiftKey &&\n          listContainer.current.contains(event.target)) ||\n        (isKey(event, \"ArrowDown\") &&\n          event.shiftKey &&\n          listContainer.current.contains(event.target))\n      ) {\n        selectedState.forEach((isSelected, i) => {\n          if (i === (event.target as any).value - 1) {\n            if (!isSelected) {\n              tempArray.push(allValues[i]);\n            }\n          } else if (isSelected) {\n            tempArray.push(allValues[i]);\n          }\n        });\n        setValue(tempArray);\n      }\n    };\n    window.addEventListener(\"keyup\", handleMeta);\n\n    return () => {\n      window.removeEventListener(\"keyup\", handleMeta);\n    };\n  }, [allValues, selectedState, setValue]);\n\n  const onChildChangeInterceptor = useCallback(\n    (\n      index: number,\n      childOnClick: (e: React.MouseEvent) => void,\n      evt: React.MouseEvent\n    ) => {\n      childOnClick?.(evt);\n\n      if (!readOnly && !disabled) {\n        let newValue: any;\n        if (multiple) {\n          newValue = multiSelectionEventHandler(\n            evt,\n            index,\n            selectionAnchor,\n            allValues,\n            selectedState,\n            undefined\n          );\n        } else {\n          newValue =\n            singleSelectionToggle && selectedState[index]\n              ? null\n              : allValues[index];\n        }\n\n        onChange?.(evt, newValue);\n\n        setValue(() => {\n          // This will only run if uncontrolled\n\n          if (required && newValue.length === 0) {\n            setValidationState(\"invalid\");\n          } else {\n            setValidationState(\"valid\");\n          }\n\n          return newValue;\n        });\n      }\n    },\n    [\n      allValues,\n      disabled,\n      multiple,\n      onChange,\n      readOnly,\n      required,\n      selectedState,\n      setValidationState,\n      setValue,\n      singleSelectionToggle,\n      selectionAnchor,\n    ]\n  );\n\n  const modifiedChildren = useMemo(() => {\n    return React.Children.map(children, (child: any, i: number) => {\n      const childIsSelected = selectedState[i];\n\n      return React.cloneElement(child, {\n        role: \"option\",\n        selected: childIsSelected,\n        onClick: (evt) =>\n          onChildChangeInterceptor(i, child?.props?.onClick, evt),\n        disabled: disabled || child?.props?.disabled,\n      });\n    });\n  }, [children, disabled, onChildChangeInterceptor, selectedState]);\n\n  // The error message area will only be created if:\n  // - an external element that provides an error message isn't identified via aria-errormessage AND\n  //   - both status and statusMessage properties are being controlled OR\n  //   - status is uncontrolled and required is true\n  const canShowError =\n    ariaErrorMessage == null &&\n    ((status !== undefined && statusMessage !== undefined) ||\n      (status === undefined && required));\n\n  const errorMessageId = canShowError\n    ? setId(elementId, \"error\")\n    : ariaErrorMessage;\n\n  const listId = (label && setId(elementId, \"listbox\")) || \"\";\n\n  return (\n    <StyledFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={clsx(className, selectionListClasses.root, classes?.root)}\n    >\n      {label && (\n        <StyledLabel\n          id={setId(elementId, \"label\")}\n          label={label}\n          className={clsx(selectionListClasses.label, classes?.label)}\n        />\n      )}\n      {description && (\n        <StyledInfoMessage\n          id={setId(elementId, \"description\")}\n          className={clsx(\n            selectionListClasses.description,\n            classes?.description\n          )}\n        >\n          {description}\n        </StyledInfoMessage>\n      )}\n\n      <StyledListContainer\n        id={listId}\n        interactive\n        condensed\n        role=\"listbox\"\n        aria-multiselectable={multiple || undefined}\n        aria-label={ariaLabel}\n        aria-labelledby={\n          [label && setId(elementId, \"label\"), ariaLabelledBy]\n            .join(\" \")\n            .trim() || undefined\n        }\n        aria-invalid={validationState === \"invalid\" ? true : undefined}\n        aria-errormessage={\n          validationState === \"invalid\" ? errorMessageId : undefined\n        }\n        aria-describedby={\n          [description && setId(elementId, \"description\"), ariaDescribedBy]\n            .join(\" \")\n            .trim() || undefined\n        }\n        className={clsx(\n          classes?.listbox,\n          selectionListClasses.listbox,\n          orientation === \"vertical\" &&\n            clsx(selectionListClasses.vertical, classes?.vertical),\n          orientation === \"horizontal\" &&\n            clsx(selectionListClasses.horizontal, classes?.horizontal),\n          validationState === \"invalid\" &&\n            clsx(selectionListClasses.invalid, classes?.invalid)\n        )}\n        ref={listContainer}\n        $orientation={orientation}\n        $validationState={validationState}\n        {...others}\n      >\n        {modifiedChildren}\n      </StyledListContainer>\n\n      {canShowError && (\n        <StyledError\n          id={setId(elementId, \"error\")}\n          disableBorder\n          className={clsx(selectionListClasses.error, classes?.error)}\n        >\n          {validationMessage}\n        </StyledError>\n      )}\n    </StyledFormElement>\n  );\n};\n"],"names":["getValueFromSelectedChildren","children","multiple","selectedValues","React","Children","toArray","map","child","childIsControlled","props","selected","undefined","childIsSelected","defaultSelected","value","filter","v","HvSelectionList","id","classes","className","name","valueProp","defaultValue","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","status","statusMessage","ariaErrorMessage","orientation","singleSelectionToggle","others","useDefaultProps","elementId","useUniqueId","setValue","useControlled","validationState","setValidationState","validationMessage","allValues","selectedState","useMemo","childValues","childSelectedState","forEach","i","childValue","indexOf","selectionAnchor","useRef","listContainer","useEffect","handleMeta","event","tempArray","isKey","shiftKey","current","contains","target","isSelected","push","addEventListener","removeEventListener","onChildChangeInterceptor","useCallback","index","childOnClick","evt","newValue","multiSelectionEventHandler","length","modifiedChildren","cloneElement","role","onClick","canShowError","errorMessageId","setId","listId","StyledFormElement","clsx","selectionListClasses","root","_jsx","StyledLabel","StyledInfoMessage","StyledListContainer","interactive","condensed","join","trim","listbox","vertical","horizontal","invalid","ref","$orientation","$validationState","StyledError","disableBorder","error"],"mappings":"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"}
+{"version":3,"file":"SelectionList.js","sources":["../../../../src/components/SelectionList/SelectionList.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useMemo,\n  useRef,\n  useEffect,\n  ReactNode,\n} from \"react\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { multiSelectionEventHandler } from \"@core/utils/multiSelectionEventHandler\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvFormElement,\n  HvFormStatus,\n} from \"@core/components/Forms/FormElement\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvLabel } from \"@core/components/Forms/Label\";\nimport { HvInfoMessage } from \"@core/components/Forms/InfoMessage\";\nimport { HvWarningText } from \"@core/components/Forms/WarningText\";\nimport { HvListContainer } from \"@core/components/ListContainer\";\n\nimport { staticClasses, useClasses } from \"./SelectionList.styles\";\n\nexport { staticClasses as selectionListClasses };\n\nexport type HvSelectionListClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSelectionListProps\n  extends HvBaseProps<HTMLUListElement, \"onChange\"> {\n  /** The form element name. */\n  name?: string;\n  /**\n   * The value of the form element. It must be represented in the child list items.\n   *\n   * Can either be a single value (when multiple = false) or an\n   * array of values (when multiple = true).\n   *\n   * When defined the selection list state becomes controlled.\n   */\n  value?: any | any[];\n  /** When uncontrolled, defines the initial value. */\n  defaultValue?: any | any[];\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be provided instead.\n   */\n  label?: React.ReactNode;\n  /** Provide additional descriptive text for the form element. */\n  description?: React.ReactNode;\n  /** Indicates that the form element is disabled. If `true` the state is propagated to the children list items. */\n  disabled?: boolean;\n  /** Indicates that the form element is not editable. */\n  readOnly?: boolean;\n  /** Indicates that user input is required on the form element. */\n  required?: boolean;\n  /**\n   * The status of the form element.\n   *\n   * Valid is correct, invalid is incorrect and standBy means no validations have run.\n   *\n   * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n   * or \"invalid\" after any change to the state.\n   */\n  status?: HvFormStatus;\n  /**\n   * The error message to show when the validation status is \"invalid\".\n   *\n   * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n   */\n  statusMessage?: string;\n  /** Indicates that the user may select more than one item from the current selectable list items. */\n  multiple?: boolean;\n  /** If `true`, selection can be toggled when single selection. */\n  singleSelectionToggle?: boolean;\n  /** Indicates whether the list orientation is horizontal or vertical. Defaults to vertical. */\n  orientation?: \"vertical\" | \"horizontal\";\n  /** The callback fired when the value changes. */\n  onChange?: (event: React.MouseEvent, value: any) => void;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvSelectionListClasses;\n}\n\nconst getValueFromSelectedChildren = (\n  children: ReactNode,\n  multiple: boolean\n) => {\n  const selectedValues = React.Children.toArray(children)\n    .map((child: any) => {\n      const childIsControlled = child?.props?.selected !== undefined;\n      const childIsSelected =\n        child && childIsControlled\n          ? child.props?.selected\n          : child.props?.defaultSelected;\n\n      return childIsSelected ? child?.props.value : undefined;\n    })\n    .filter((v) => v !== undefined);\n\n  return multiple ? selectedValues : selectedValues?.[0];\n};\n\n/**\n * Allows the user to select one or more items from a list of choices.\n *\n * Although it supports multi-selection, DS recommends the use of a selection list\n * when it’s clear that the user can only select just one option from the range provided.\n */\nexport const HvSelectionList = (props: HvSelectionListProps) => {\n  const {\n    id,\n    classes: classesProp,\n    className,\n    children,\n    name,\n    value: valueProp,\n    defaultValue,\n    required = false,\n    readOnly = false,\n    disabled = false,\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    description,\n    \"aria-describedby\": ariaDescribedBy,\n    onChange,\n    status,\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n    orientation = \"vertical\",\n    multiple = false,\n    singleSelectionToggle = false,\n    ...others\n  } = useDefaultProps(\"HvSelectionList\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const elementId = useUniqueId(id, \"hvselectionlist\");\n\n  const [value, setValue] = useControlled(\n    valueProp,\n    defaultValue !== undefined\n      ? defaultValue\n      : // when uncontrolled and no default value is given,\n        // extract the initial selected values from the children own state\n        () => getValueFromSelectedChildren(children, multiple)\n  );\n\n  const [validationState, setValidationState] = useControlled(\n    status,\n    \"standBy\"\n  );\n\n  const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n  const [allValues, selectedState] = useMemo(() => {\n    const childValues: any[] = [];\n    const childSelectedState: boolean[] = [];\n\n    React.Children.toArray(children).forEach((child: any, i: number) => {\n      const childValue = child?.props?.value;\n      const childIsSelected = multiple\n        ? value.indexOf(childValue) !== -1\n        : value === childValue;\n\n      childValues[i] = childValue;\n      childSelectedState[i] = childIsSelected;\n    });\n\n    return [childValues, childSelectedState];\n  }, [children, multiple, value]);\n\n  const selectionAnchor = useRef(undefined);\n\n  const listContainer = useRef<any>(null);\n\n  useEffect(() => {\n    const handleMeta = (event: KeyboardEvent) => {\n      const tempArray: any[] = [];\n      if (\n        (isKey(event, \"ArrowUp\") &&\n          event.shiftKey &&\n          listContainer.current.contains(event.target)) ||\n        (isKey(event, \"ArrowDown\") &&\n          event.shiftKey &&\n          listContainer.current.contains(event.target))\n      ) {\n        selectedState.forEach((isSelected, i) => {\n          if (i === (event.target as any).value - 1) {\n            if (!isSelected) {\n              tempArray.push(allValues[i]);\n            }\n          } else if (isSelected) {\n            tempArray.push(allValues[i]);\n          }\n        });\n        setValue(tempArray);\n      }\n    };\n    window.addEventListener(\"keyup\", handleMeta);\n\n    return () => {\n      window.removeEventListener(\"keyup\", handleMeta);\n    };\n  }, [allValues, selectedState, setValue]);\n\n  const onChildChangeInterceptor = useCallback(\n    (\n      index: number,\n      childOnClick: (e: React.MouseEvent) => void,\n      evt: React.MouseEvent\n    ) => {\n      childOnClick?.(evt);\n\n      if (!readOnly && !disabled) {\n        let newValue: any;\n        if (multiple) {\n          newValue = multiSelectionEventHandler(\n            evt,\n            index,\n            selectionAnchor,\n            allValues,\n            selectedState,\n            undefined\n          );\n        } else {\n          newValue =\n            singleSelectionToggle && selectedState[index]\n              ? null\n              : allValues[index];\n        }\n\n        onChange?.(evt, newValue);\n\n        setValue(() => {\n          // This will only run if uncontrolled\n\n          if (required && newValue.length === 0) {\n            setValidationState(\"invalid\");\n          } else {\n            setValidationState(\"valid\");\n          }\n\n          return newValue;\n        });\n      }\n    },\n    [\n      allValues,\n      disabled,\n      multiple,\n      onChange,\n      readOnly,\n      required,\n      selectedState,\n      setValidationState,\n      setValue,\n      singleSelectionToggle,\n      selectionAnchor,\n    ]\n  );\n\n  const modifiedChildren = useMemo(() => {\n    return React.Children.map(children, (child: any, i: number) => {\n      const childIsSelected = selectedState[i];\n\n      return React.cloneElement(child, {\n        role: \"option\",\n        selected: childIsSelected,\n        onClick: (evt) =>\n          onChildChangeInterceptor(i, child?.props?.onClick, evt),\n        disabled: disabled || child?.props?.disabled,\n      });\n    });\n  }, [children, disabled, onChildChangeInterceptor, selectedState]);\n\n  // The error message area will only be created if:\n  // - an external element that provides an error message isn't identified via aria-errormessage AND\n  //   - both status and statusMessage properties are being controlled OR\n  //   - status is uncontrolled and required is true\n  const canShowError =\n    ariaErrorMessage == null &&\n    ((status !== undefined && statusMessage !== undefined) ||\n      (status === undefined && required));\n\n  const errorMessageId = canShowError\n    ? setId(elementId, \"error\")\n    : ariaErrorMessage;\n\n  const listId = (label && setId(elementId, \"listbox\")) || \"\";\n\n  return (\n    <HvFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={cx(classes.root, className)}\n    >\n      {label && (\n        <HvLabel\n          id={setId(elementId, \"label\")}\n          label={label}\n          className={classes.label}\n        />\n      )}\n      {description && (\n        <HvInfoMessage\n          id={setId(elementId, \"description\")}\n          className={classes.description}\n        >\n          {description}\n        </HvInfoMessage>\n      )}\n\n      <HvListContainer\n        id={listId}\n        interactive\n        condensed\n        role=\"listbox\"\n        aria-multiselectable={multiple || undefined}\n        aria-label={ariaLabel}\n        aria-labelledby={\n          [label && setId(elementId, \"label\"), ariaLabelledBy]\n            .join(\" \")\n            .trim() || undefined\n        }\n        aria-invalid={validationState === \"invalid\" ? true : undefined}\n        aria-errormessage={\n          validationState === \"invalid\" ? errorMessageId : undefined\n        }\n        aria-describedby={\n          [description && setId(elementId, \"description\"), ariaDescribedBy]\n            .join(\" \")\n            .trim() || undefined\n        }\n        className={cx(classes.listbox, {\n          [classes.vertical]: orientation === \"vertical\",\n          [classes.horizontal]: orientation === \"horizontal\",\n          [classes.invalid]: validationState === \"invalid\",\n        })}\n        ref={listContainer}\n        {...others}\n      >\n        {modifiedChildren}\n      </HvListContainer>\n\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          disableBorder\n          className={classes.error}\n        >\n          {validationMessage}\n        </HvWarningText>\n      )}\n    </HvFormElement>\n  );\n};\n"],"names":["getValueFromSelectedChildren","children","multiple","selectedValues","React","Children","toArray","map","child","childIsControlled","props","selected","undefined","childIsSelected","defaultSelected","value","filter","v","HvSelectionList","id","classes","classesProp","className","name","valueProp","defaultValue","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","status","statusMessage","ariaErrorMessage","orientation","singleSelectionToggle","others","useDefaultProps","cx","useClasses","elementId","useUniqueId","setValue","useControlled","validationState","setValidationState","validationMessage","allValues","selectedState","useMemo","childValues","childSelectedState","forEach","i","childValue","indexOf","selectionAnchor","useRef","listContainer","useEffect","handleMeta","event","tempArray","isKey","shiftKey","current","contains","target","isSelected","push","addEventListener","removeEventListener","onChildChangeInterceptor","useCallback","index","childOnClick","evt","newValue","multiSelectionEventHandler","length","modifiedChildren","cloneElement","role","onClick","canShowError","errorMessageId","setId","listId","HvFormElement","root","_jsx","HvLabel","HvInfoMessage","HvListContainer","interactive","condensed","join","trim","listbox","vertical","horizontal","invalid","ref","HvWarningText","disableBorder","error"],"mappings":"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"}