@hitachivantara/uikit-react-core 5.0.0-next.8 → 5.0.0-next.9

package/dist/cjs/components/ProgressBar/ProgressBar.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const clsx = require("clsx");
 const clamp = require("lodash/clamp");
 const ProgressBar_styles = require("./ProgressBar.styles.cjs");
 const progressBarClasses = require("./progressBarClasses.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const clsx__default = /* @__PURE__ */ _interopDefault(clsx);
 const clamp__default = /* @__PURE__ */ _interopDefault(clamp);
@@ -18,35 +18,14 @@ const HvProgressBar = (props) => {
     ...others
   } = props;
   const clampedValue = clamp__default.default(value, 0, 100);
-  return /* @__PURE__ */ jsxRuntime.jsx(ProgressBar_styles.StyledRoot, {
-    className: clsx__default.default(className, progressBarClasses.default.root, classes == null ? void 0 : classes.root, progressBarClasses.default.progress, classes == null ? void 0 : classes.progress),
-    role: "progressbar",
-    "aria-valuemin": 0,
-    "aria-valuemax": 100,
-    "aria-valuenow": clampedValue,
-    ...others,
-    children: /* @__PURE__ */ jsxRuntime.jsxs(ProgressBar_styles.StyledProgressContainer, {
-      className: clsx__default.default(classes == null ? void 0 : classes.progressContainer, progressBarClasses.default.progressContainer),
-      children: [/* @__PURE__ */ jsxRuntime.jsx(ProgressBar_styles.StyledValue, {
-        className: clsx__default.default(progressBarClasses.default.progressBarLabel, classes == null ? void 0 : classes.progressBarLabel, status === "completed" && clsx__default.default(progressBarClasses.default.progressDone, classes == null ? void 0 : classes.progressDone)),
-        variant: "caption2",
-        style: {
-          width: `${clampedValue}%`
-        },
-        ...labelProps,
-        children: `${clampedValue}%`
-      }), /* @__PURE__ */ jsxRuntime.jsx(ProgressBar_styles.StyledProgressBarContainer, {
-        className: clsx__default.default(classes == null ? void 0 : classes.progressBarContainer, progressBarClasses.default.progressBarContainer),
-        children: /* @__PURE__ */ jsxRuntime.jsx(ProgressBar_styles.StyledProgressBar, {
-          style: {
-            width: `${clampedValue}%`
-          },
-          className: clsx__default.default(progressBarClasses.default.progressBar, classes == null ? void 0 : classes.progressBar, status === "completed" && clsx__default.default(classes == null ? void 0 : classes.progressDone, progressBarClasses.default.progressDone), status === "error" && clsx__default.default(classes == null ? void 0 : classes.progressError, progressBarClasses.default.progressError)),
-          $status: status
-        })
-      })]
-    })
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx(ProgressBar_styles.StyledRoot, { className: clsx__default.default(className, progressBarClasses.default.root, classes == null ? void 0 : classes.root, progressBarClasses.default.progress, classes == null ? void 0 : classes.progress), role: "progressbar", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": clampedValue, ...others, children: /* @__PURE__ */ jsxRuntime.jsxs(ProgressBar_styles.StyledProgressContainer, { className: clsx__default.default(classes == null ? void 0 : classes.progressContainer, progressBarClasses.default.progressContainer), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ProgressBar_styles.StyledValue, { className: clsx__default.default(progressBarClasses.default.progressBarLabel, classes == null ? void 0 : classes.progressBarLabel, status === "completed" && clsx__default.default(progressBarClasses.default.progressDone, classes == null ? void 0 : classes.progressDone)), variant: "caption2", style: {
+      width: `${clampedValue}%`
+    }, ...labelProps, children: `${clampedValue}%` }),
+    /* @__PURE__ */ jsxRuntime.jsx(ProgressBar_styles.StyledProgressBarContainer, { className: clsx__default.default(classes == null ? void 0 : classes.progressBarContainer, progressBarClasses.default.progressBarContainer), children: /* @__PURE__ */ jsxRuntime.jsx(ProgressBar_styles.StyledProgressBar, { style: {
+      width: `${clampedValue}%`
+    }, className: clsx__default.default(progressBarClasses.default.progressBar, classes == null ? void 0 : classes.progressBar, status === "completed" && clsx__default.default(classes == null ? void 0 : classes.progressDone, progressBarClasses.default.progressDone), status === "error" && clsx__default.default(classes == null ? void 0 : classes.progressError, progressBarClasses.default.progressError)), $status: status }) })
+  ] }) });
 };
 exports.HvProgressBar = HvProgressBar;
 //# sourceMappingURL=ProgressBar.cjs.map

package/dist/cjs/components/ProgressBar/ProgressBar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.cjs","sources":["../../../../src/components/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { HvTypographyProps } from \"../Typography\";\nimport clamp from \"lodash/clamp\";\nimport { HvBaseProps } from \"../../types\";\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 type HvProgressBarProps = 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  } = 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","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":";;;;;;;;;;AAmCaA,MAAAA,gBAAgBA,CAACC,UAA8B;AACpD,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,QAAQ;AAAA,IACRC,SAAS;AAAA,IACTC;AAAAA,OACGC;AAAAA,EACDN,IAAAA;AAEJ,QAAMO,eAAeC,eAAAA,QAAML,OAAO,GAAG,GAAG;AAExC,wCACGM,mBAAAA,YAAU;AAAA,IACTR,WAAWS,cACTT,QAAAA,WACAU,mBAAAA,QAAmBC,MACnBV,mCAASU,MACTD,mBAAAA,QAAmBE,UACnBX,mCAASW,QAAQ;AAAA,IAEnBC,MAAK;AAAA,IACL,iBAAe;AAAA,IACf,iBAAe;AAAA,IACf,iBAAeP;AAAAA,IAAa,GACxBD;AAAAA,IAAMS,0CAETC,4CAAuB;AAAA,MACtBf,WAAWS,cAAAA,QACTR,mCAASe,mBACTN,mBAAAA,QAAmBM,iBAAiB;AAAA,MACpCF,UAAA,CAEFG,2BAAAA,IAACC,gCAAW;AAAA,QACVlB,WAAWS,cAAAA,QACTC,mBAAAA,QAAmBS,kBACnBlB,mCAASkB,kBACThB,WAAW,eACTM,cAAKC,QAAAA,mBAAAA,QAAmBU,cAAcnB,mCAASmB,YAAY,CAAC;AAAA,QAEhEC,SAAQ;AAAA,QACRC,OAAO;AAAA,UAAEC,OAAQ,GAAEjB;AAAAA,QAAgB;AAAA,QAAE,GACjCF;AAAAA,QAAUU,UAEZ,GAAER;AAAAA,MAAAA,CACQ,GACdW,2BAAAA,IAACO,+CAA0B;AAAA,QACzBxB,WAAWS,cAAAA,QACTR,mCAASwB,sBACTf,mBAAAA,QAAmBe,oBAAoB;AAAA,QACvCX,yCAEDY,sCAAiB;AAAA,UAChBJ,OAAO;AAAA,YAAEC,OAAQ,GAAEjB;AAAAA,UAAgB;AAAA,UACnCN,WAAWS,cAAAA,QACTC,mBAAmBiB,QAAAA,aACnB1B,mCAAS0B,aACTxB,WAAW,eACTM,cAAAA,QAAKR,mCAASmB,cAAcV,2BAAmBU,YAAY,GAC7DjB,WAAW,WACTM,sBAAKR,mCAAS2B,eAAelB,2BAAmBkB,aAAa,CAAC;AAAA,UAElEC,SAAS1B;AAAAA,QAAAA,CAAO;AAAA,MAAA,CAES,CAAA;AAAA,IAAA,CAAA;AAAA,EAAA,CAEpB;AAEjB;;"}
+{"version":3,"file":"ProgressBar.cjs","sources":["../../../../src/components/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { HvTypographyProps } from \"../Typography\";\nimport clamp from \"lodash/clamp\";\nimport { HvBaseProps } from \"../../types\";\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 type HvProgressBarProps = 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  } = 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","clampedValue","clamp","jsx","StyledRoot","clsx","progressBarClasses","root","progress","jsxs","StyledProgressContainer","progressContainer","StyledValue","progressBarLabel","progressDone","width","StyledProgressBarContainer","progressBarContainer","StyledProgressBar","progressBar","progressError"],"mappings":";;;;;;;;;;AAmCaA,MAAAA,gBAAgBA,CAACC,UAA8B;AACpD,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,QAAQ;AAAA,IACRC,SAAS;AAAA,IACTC;AAAAA,OACGC;AAAAA,EACDN,IAAAA;AAEJ,QAAMO,eAAeC,eAAAA,QAAML,OAAO,GAAG,GAAG;AAExC,SACGM,2BAAAA,IAAAC,mBAAAA,YAAA,EACC,WAAWC,cAAAA,QACTV,WACAW,mBAAAA,QAAmBC,MACnBX,mCAASW,MACTD,mBAAmBE,QAAAA,UACnBZ,mCAASY,QAAQ,GAEnB,MAAK,eACL,iBAAe,GACf,iBAAe,KACf,iBAAeP,cACXD,GAAAA,QAEJ,UAAAS,2BAAA,KAACC,mBACC,yBAAA,EAAA,WAAWL,cAAAA,QACTT,mCAASe,mBACTL,2BAAmBK,iBAAiB,GAGtC,UAAA;AAAA,IAAAR,+BAACS,mBAAAA,eACC,WAAWP,cAAAA,QACTC,mBAAAA,QAAmBO,kBACnBjB,mCAASiB,kBACTf,WAAW,eACTO,sBAAKC,mBAAAA,QAAmBQ,cAAclB,mCAASkB,YAAY,CAAC,GAEhE,SAAQ,YACR,OAAO;AAAA,MAAEC,OAAQ,GAAEd;AAAAA,IAAAA,GACfF,GAAAA,YAEF,UAAA,GAAEE,iBACN;AAAA,IACAE,2BAAAA,IAACa,mBAAAA,4BACC,EAAA,WAAWX,cACTT,QAAAA,mCAASqB,sBACTX,2BAAmBW,oBAAoB,GAGzC,UAACd,2BAAA,IAAAe,mBAAA,mBAAA,EACC,OAAO;AAAA,MAAEH,OAAQ,GAAEd;AAAAA,IAAgB,GACnC,WAAWI,cAAAA,QACTC,mBAAmBa,QAAAA,aACnBvB,mCAASuB,aACTrB,WAAW,eACTO,cAAAA,QAAKT,mCAASkB,cAAcR,mBAAAA,QAAmBQ,YAAY,GAC7DhB,WAAW,WACTO,cAAAA,QAAKT,mCAASwB,eAAed,2BAAmBc,aAAa,CAAC,GAElE,SAAStB,OAAAA,CAAO,EAEpB,CAAA;AAAA,EAAA,EACF,CAAA,EACF,CAAA;AAEJ;;"}

package/dist/cjs/components/Radio/Radio.cjs

@@ -1,11 +1,11 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const clsx = require("clsx");
 const validationStates = require("../Forms/FormElement/validationStates.cjs");
 const Radio_styles = require("./Radio.styles.cjs");
 const radioClasses = require("./radioClasses.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const useUniqueId = require("../../hooks/useUniqueId.cjs");
 const useControlled = require("../../hooks/useControlled.cjs");
 const setId = require("../../utils/setId.cjs");
@@ -61,56 +61,21 @@ const HvRadio = (props) => {
   if (isStateInvalid) {
     errorMessageId = canShowError ? setId.setId(elementId, "error") : ariaErrorMessage;
   }
-  const radio = /* @__PURE__ */ jsxRuntime.jsx(Radio_styles.StyledHvBaseRadio, {
-    id: label ? setId.setId(elementId, "input") : setId.setId(id, "input"),
-    name,
-    className: clsx__default.default(radioClasses.default.radio, classes == null ? void 0 : classes.radio, isStateInvalid && clsx__default.default(radioClasses.default.invalidRadio, classes == null ? void 0 : classes.invalidRadio)),
-    $invalid: isStateInvalid,
-    disabled,
-    readOnly,
-    onChange: onLocalChange,
-    value,
-    checked: isChecked,
-    semantic,
-    inputProps: {
-      "aria-invalid": isStateInvalid ? true : void 0,
-      "aria-errormessage": errorMessageId,
-      "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabelledBy,
-      "aria-describedby": ariaDescribedBy,
-      ...inputProps
-    },
-    onFocusVisible: onFocusVisibleCallback,
-    onBlur: onBlurCallback,
-    ...others
-  });
-  return /* @__PURE__ */ jsxRuntime.jsxs(Radio_styles.StyledHvFormElement, {
-    id,
-    name,
-    status: status || "standBy",
-    disabled,
-    required,
-    readOnly,
-    className: clsx__default.default(className, radioClasses.default.root, classes == null ? void 0 : classes.root),
-    children: [hasLabel ? /* @__PURE__ */ jsxRuntime.jsxs(Radio_styles.StyledDivContainer, {
-      className: clsx__default.default(radioClasses.default.container, classes == null ? void 0 : classes.container, disabled && clsx__default.default(radioClasses.default.disabled, classes == null ? void 0 : classes.disabled), focusVisible && label && clsx__default.default(radioClasses.default.focusVisible, classes == null ? void 0 : classes.focusVisible), isStateInvalid && clsx__default.default(radioClasses.default.invalidContainer, classes == null ? void 0 : classes.invalidContainer)),
-      $invalid: isStateInvalid,
-      $focusVisible: !!(focusVisible && label),
-      $disabled: disabled,
-      children: [radio, /* @__PURE__ */ jsxRuntime.jsx(Radio_styles.StyledHvLabel, {
-        id: setId.setId(elementId, "label"),
-        htmlFor: setId.setId(elementId, "input"),
-        label,
-        className: clsx__default.default(radioClasses.default.label, classes == null ? void 0 : classes.label),
-        $disabled: disabled,
-        ...labelProps
-      })]
-    }) : radio, canShowError && /* @__PURE__ */ jsxRuntime.jsx(WarningText.HvWarningText, {
-      id: setId.setId(elementId, "error"),
-      disableBorder: true,
-      children: statusMessage
-    })]
-  });
+  const radio = /* @__PURE__ */ jsxRuntime.jsx(Radio_styles.StyledHvBaseRadio, { id: label ? setId.setId(elementId, "input") : setId.setId(id, "input"), name, className: clsx__default.default(radioClasses.default.radio, classes == null ? void 0 : classes.radio, isStateInvalid && clsx__default.default(radioClasses.default.invalidRadio, classes == null ? void 0 : classes.invalidRadio)), $invalid: isStateInvalid, disabled, readOnly, onChange: onLocalChange, value, checked: isChecked, semantic, inputProps: {
+    "aria-invalid": isStateInvalid ? true : void 0,
+    "aria-errormessage": errorMessageId,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    ...inputProps
+  }, onFocusVisible: onFocusVisibleCallback, onBlur: onBlurCallback, ...others });
+  return /* @__PURE__ */ jsxRuntime.jsxs(Radio_styles.StyledHvFormElement, { id, name, status: status || "standBy", disabled, required, readOnly, className: clsx__default.default(className, radioClasses.default.root, classes == null ? void 0 : classes.root), children: [
+    hasLabel ? /* @__PURE__ */ jsxRuntime.jsxs(Radio_styles.StyledDivContainer, { className: clsx__default.default(radioClasses.default.container, classes == null ? void 0 : classes.container, disabled && clsx__default.default(radioClasses.default.disabled, classes == null ? void 0 : classes.disabled), focusVisible && label && clsx__default.default(radioClasses.default.focusVisible, classes == null ? void 0 : classes.focusVisible), isStateInvalid && clsx__default.default(radioClasses.default.invalidContainer, classes == null ? void 0 : classes.invalidContainer)), $invalid: isStateInvalid, $focusVisible: !!(focusVisible && label), $disabled: disabled, children: [
+      radio,
+      /* @__PURE__ */ jsxRuntime.jsx(Radio_styles.StyledHvLabel, { id: setId.setId(elementId, "label"), htmlFor: setId.setId(elementId, "input"), label, className: clsx__default.default(radioClasses.default.label, classes == null ? void 0 : classes.label), $disabled: disabled, ...labelProps })
+    ] }) : radio,
+    canShowError && /* @__PURE__ */ jsxRuntime.jsx(WarningText.HvWarningText, { id: setId.setId(elementId, "error"), disableBorder: true, children: statusMessage })
+  ] });
 };
 exports.HvRadio = HvRadio;
 //# sourceMappingURL=Radio.cjs.map

package/dist/cjs/components/Radio/Radio.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.cjs","sources":["../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport clsx from \"clsx\";\nimport { RadioProps as MuiRadioProps } from \"@mui/material\";\nimport { HvBaseProps } from \"../../types\";\nimport { HvWarningText } from \"components\";\nimport { isInvalid } from \"../Forms/FormElement/validationStates\";\nimport { useControlled, useUniqueId } from \"hooks\";\nimport { setId } from \"utils\";\nimport {\n  StyledDivContainer,\n  StyledHvBaseRadio,\n  StyledHvFormElement,\n  StyledHvLabel,\n} from \"./Radio.styles\";\nimport radioClasses, { HvRadioClasses } from \"./radioClasses\";\n\nexport type HvRadioStatus = \"standBy\" | \"valid\" | \"invalid\";\n\nexport type HvRadioProps = Omit<MuiRadioProps, \"onChange\" | \"classes\"> &\n  HvBaseProps<HTMLInputElement, { onChange }> & {\n    /**\n     * Class names to be applied.\n     */\n    className?: string;\n    /**\n     * A Jss Object used to override or extend the styles applied to the radio button.\n     */\n    classes?: HvRadioClasses;\n    /**\n     * Id to be applied to the form element root node.\n     */\n    id?: string;\n    /**\n     * The form element name.\n     */\n    name?: string;\n    /**\n     * The value of the form element.\n     *\n     * The default value is \"on\".\n     */\n    value?: 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.\n     */\n    label?: React.ReactNode;\n    /**\n     * @ignore\n     */\n    \"aria-label\"?: string;\n    /**\n     * @ignore\n     */\n    \"aria-labelledby\"?: string;\n    /**\n     * @ignore\n     */\n    \"aria-describedby\"?: string;\n    /**\n     * Properties passed on to the label element.\n     */\n    labelProps?: any;\n    /**\n     * Indicates that user input is required on the form element.\n     *\n     * If a single radio button in a group has the required attribute, a radio button in\n     * that group must be check, though it doesn't have to be the one with the attribute is applied.\n     *\n     * For that reason, the component doesn't make any uncontrolled changes to its validation status.\n     * That should ideally be managed in the context of a radio button group.\n     */\n    required?: boolean;\n    /**\n     * Indicates that the form element is not editable.\n     */\n    readOnly?: boolean;\n    /**\n     * Indicates that the form element is disabled.\n     */\n    disabled?: boolean;\n    /**\n     * If `true` the radio button is selected, if set to `false` the radio button is not selected.\n     *\n     * When defined the radio button state becomes controlled.\n     */\n    checked?: boolean;\n    /**\n     * When uncontrolled, defines the initial checked state.\n     */\n    defaultChecked?: 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    status?: HvRadioStatus;\n    /**\n     * The error message to show when `status` is \"invalid\".\n     */\n    statusMessage?: string;\n    /**\n     * Identifies the element that provides an error message for the radio button.\n     *\n     * Will only be used when the validation status is invalid.\n     */\n    \"aria-errormessage\"?: string;\n    /**\n     * The callback fired when the radio button is pressed.\n     */\n    onChange?: (\n      event: React.ChangeEvent<HTMLInputElement>,\n      checked: boolean,\n      value: any\n    ) => void;\n    /**\n     * Whether the selector should use semantic colors.\n     */\n    semantic?: boolean;\n    /**\n     * Properties passed on to the input element.\n     */\n    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n    /**\n     * Callback fired when the component is focused with a keyboard.\n     * We trigger a `onFocus` callback too.\n     */\n    onFocusVisible?: (event: React.FocusEvent<any>) => void;\n    /**\n     * @ignore\n     */\n    onBlur?: (event: React.FocusEvent<any>) => void;\n  };\n\n/**\n * A Radio Button is a mechanism that allows user to select just an option from a group of options.\n *\n * It should used in a Radio Button Group to present the user with a range of options from\n * which the user <b>may select just one option</b> to complete their task.\n *\n * Individual use of radio buttons, at least uncontrolled, is unadvised as React state management doesn't\n * respond to the browser's native management of radio inputs checked state.\n */\nexport const HvRadio = (props: HvRadioProps) => {\n  const {\n    classes,\n    className,\n    id,\n    name,\n    value = \"on\",\n    required = false,\n    readOnly = false,\n    disabled = false,\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    labelProps,\n    checked,\n    defaultChecked = false,\n    onChange,\n    status = \"standBy\",\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n    semantic = false,\n    inputProps,\n    onFocusVisible,\n    onBlur,\n    ...others\n  } = props;\n\n  const elementId = useUniqueId(id, \"hvradio\");\n\n  const [focusVisible, setFocusVisible] = useState(false);\n\n  const onFocusVisibleCallback = useCallback(\n    (evt: React.FocusEvent<any>) => {\n      setFocusVisible(true);\n      onFocusVisible?.(evt);\n    },\n    [onFocusVisible]\n  );\n\n  const onBlurCallback = useCallback(\n    (evt: React.FocusEvent<any>) => {\n      setFocusVisible(false);\n      onBlur?.(evt);\n    },\n    [onBlur]\n  );\n\n  const [isChecked, setIsChecked] = useControlled(\n    checked,\n    Boolean(defaultChecked)\n  );\n\n  const onLocalChange = useCallback(\n    (evt: React.ChangeEvent<HTMLInputElement>, newChecked: boolean) => {\n      setIsChecked(newChecked);\n\n      onChange?.(evt, newChecked, value);\n    },\n    [onChange, setIsChecked, value]\n  );\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\n  const canShowError =\n    ariaErrorMessage == null &&\n    status !== undefined &&\n    statusMessage !== undefined;\n\n  const hasLabel = label != null;\n\n  const isStateInvalid = isInvalid(status);\n\n  let errorMessageId: string | undefined;\n  if (isStateInvalid) {\n    errorMessageId = canShowError\n      ? setId(elementId, \"error\")\n      : ariaErrorMessage;\n  }\n\n  const radio = (\n    <StyledHvBaseRadio\n      id={label ? setId(elementId, \"input\") : setId(id, \"input\")}\n      name={name}\n      className={clsx(\n        radioClasses.radio,\n        classes?.radio,\n        isStateInvalid && clsx(radioClasses.invalidRadio, classes?.invalidRadio)\n      )}\n      $invalid={isStateInvalid}\n      disabled={disabled}\n      readOnly={readOnly}\n      onChange={onLocalChange}\n      value={value}\n      checked={isChecked}\n      semantic={semantic}\n      inputProps={{\n        \"aria-invalid\": isStateInvalid ? true : undefined,\n        \"aria-errormessage\": errorMessageId,\n        \"aria-label\": ariaLabel,\n        \"aria-labelledby\": ariaLabelledBy,\n        \"aria-describedby\": ariaDescribedBy,\n        ...inputProps,\n      }}\n      onFocusVisible={onFocusVisibleCallback}\n      onBlur={onBlurCallback}\n      {...others}\n    />\n  );\n\n  return (\n    <StyledHvFormElement\n      id={id}\n      name={name}\n      status={status || \"standBy\"}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={clsx(className, radioClasses.root, classes?.root)}\n    >\n      {hasLabel ? (\n        <StyledDivContainer\n          className={clsx(\n            radioClasses.container,\n            classes?.container,\n            disabled && clsx(radioClasses.disabled, classes?.disabled),\n            focusVisible &&\n              label &&\n              clsx(radioClasses.focusVisible, classes?.focusVisible),\n            isStateInvalid &&\n              clsx(radioClasses.invalidContainer, classes?.invalidContainer)\n          )}\n          $invalid={isStateInvalid}\n          $focusVisible={!!(focusVisible && label)}\n          $disabled={disabled}\n        >\n          {radio}\n          <StyledHvLabel\n            id={setId(elementId, \"label\")}\n            htmlFor={setId(elementId, \"input\")}\n            label={label}\n            className={clsx(radioClasses.label, classes?.label)}\n            $disabled={disabled}\n            {...labelProps}\n          />\n        </StyledDivContainer>\n      ) : (\n        radio\n      )}\n      {canShowError && (\n        <HvWarningText id={setId(elementId, \"error\")} disableBorder>\n          {statusMessage}\n        </HvWarningText>\n      )}\n    </StyledHvFormElement>\n  );\n};\n"],"names":["HvRadio","props","classes","className","id","name","value","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelProps","checked","defaultChecked","onChange","status","statusMessage","ariaErrorMessage","semantic","inputProps","onFocusVisible","onBlur","others","elementId","useUniqueId","focusVisible","setFocusVisible","useState","onFocusVisibleCallback","useCallback","evt","onBlurCallback","isChecked","setIsChecked","useControlled","Boolean","onLocalChange","newChecked","canShowError","undefined","hasLabel","isStateInvalid","isInvalid","errorMessageId","setId","radio","StyledHvBaseRadio","clsx","radioClasses","invalidRadio","$invalid","StyledHvFormElement","root","children","_jsxs","StyledDivContainer","container","invalidContainer","$focusVisible","$disabled","_jsx","StyledHvLabel","htmlFor","HvWarningText","disableBorder"],"mappings":"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"}
+{"version":3,"file":"Radio.cjs","sources":["../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport clsx from \"clsx\";\nimport { RadioProps as MuiRadioProps } from \"@mui/material\";\nimport { HvBaseProps } from \"../../types\";\nimport { HvWarningText } from \"components\";\nimport { isInvalid } from \"../Forms/FormElement/validationStates\";\nimport { useControlled, useUniqueId } from \"hooks\";\nimport { setId } from \"utils\";\nimport {\n  StyledDivContainer,\n  StyledHvBaseRadio,\n  StyledHvFormElement,\n  StyledHvLabel,\n} from \"./Radio.styles\";\nimport radioClasses, { HvRadioClasses } from \"./radioClasses\";\n\nexport type HvRadioStatus = \"standBy\" | \"valid\" | \"invalid\";\n\nexport type HvRadioProps = Omit<MuiRadioProps, \"onChange\" | \"classes\"> &\n  HvBaseProps<HTMLInputElement, { onChange }> & {\n    /**\n     * Class names to be applied.\n     */\n    className?: string;\n    /**\n     * A Jss Object used to override or extend the styles applied to the radio button.\n     */\n    classes?: HvRadioClasses;\n    /**\n     * Id to be applied to the form element root node.\n     */\n    id?: string;\n    /**\n     * The form element name.\n     */\n    name?: string;\n    /**\n     * The value of the form element.\n     *\n     * The default value is \"on\".\n     */\n    value?: 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.\n     */\n    label?: React.ReactNode;\n    /**\n     * @ignore\n     */\n    \"aria-label\"?: string;\n    /**\n     * @ignore\n     */\n    \"aria-labelledby\"?: string;\n    /**\n     * @ignore\n     */\n    \"aria-describedby\"?: string;\n    /**\n     * Properties passed on to the label element.\n     */\n    labelProps?: any;\n    /**\n     * Indicates that user input is required on the form element.\n     *\n     * If a single radio button in a group has the required attribute, a radio button in\n     * that group must be check, though it doesn't have to be the one with the attribute is applied.\n     *\n     * For that reason, the component doesn't make any uncontrolled changes to its validation status.\n     * That should ideally be managed in the context of a radio button group.\n     */\n    required?: boolean;\n    /**\n     * Indicates that the form element is not editable.\n     */\n    readOnly?: boolean;\n    /**\n     * Indicates that the form element is disabled.\n     */\n    disabled?: boolean;\n    /**\n     * If `true` the radio button is selected, if set to `false` the radio button is not selected.\n     *\n     * When defined the radio button state becomes controlled.\n     */\n    checked?: boolean;\n    /**\n     * When uncontrolled, defines the initial checked state.\n     */\n    defaultChecked?: 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    status?: HvRadioStatus;\n    /**\n     * The error message to show when `status` is \"invalid\".\n     */\n    statusMessage?: string;\n    /**\n     * Identifies the element that provides an error message for the radio button.\n     *\n     * Will only be used when the validation status is invalid.\n     */\n    \"aria-errormessage\"?: string;\n    /**\n     * The callback fired when the radio button is pressed.\n     */\n    onChange?: (\n      event: React.ChangeEvent<HTMLInputElement>,\n      checked: boolean,\n      value: any\n    ) => void;\n    /**\n     * Whether the selector should use semantic colors.\n     */\n    semantic?: boolean;\n    /**\n     * Properties passed on to the input element.\n     */\n    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n    /**\n     * Callback fired when the component is focused with a keyboard.\n     * We trigger a `onFocus` callback too.\n     */\n    onFocusVisible?: (event: React.FocusEvent<any>) => void;\n    /**\n     * @ignore\n     */\n    onBlur?: (event: React.FocusEvent<any>) => void;\n  };\n\n/**\n * A Radio Button is a mechanism that allows user to select just an option from a group of options.\n *\n * It should used in a Radio Button Group to present the user with a range of options from\n * which the user <b>may select just one option</b> to complete their task.\n *\n * Individual use of radio buttons, at least uncontrolled, is unadvised as React state management doesn't\n * respond to the browser's native management of radio inputs checked state.\n */\nexport const HvRadio = (props: HvRadioProps) => {\n  const {\n    classes,\n    className,\n    id,\n    name,\n    value = \"on\",\n    required = false,\n    readOnly = false,\n    disabled = false,\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    labelProps,\n    checked,\n    defaultChecked = false,\n    onChange,\n    status = \"standBy\",\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n    semantic = false,\n    inputProps,\n    onFocusVisible,\n    onBlur,\n    ...others\n  } = props;\n\n  const elementId = useUniqueId(id, \"hvradio\");\n\n  const [focusVisible, setFocusVisible] = useState(false);\n\n  const onFocusVisibleCallback = useCallback(\n    (evt: React.FocusEvent<any>) => {\n      setFocusVisible(true);\n      onFocusVisible?.(evt);\n    },\n    [onFocusVisible]\n  );\n\n  const onBlurCallback = useCallback(\n    (evt: React.FocusEvent<any>) => {\n      setFocusVisible(false);\n      onBlur?.(evt);\n    },\n    [onBlur]\n  );\n\n  const [isChecked, setIsChecked] = useControlled(\n    checked,\n    Boolean(defaultChecked)\n  );\n\n  const onLocalChange = useCallback(\n    (evt: React.ChangeEvent<HTMLInputElement>, newChecked: boolean) => {\n      setIsChecked(newChecked);\n\n      onChange?.(evt, newChecked, value);\n    },\n    [onChange, setIsChecked, value]\n  );\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\n  const canShowError =\n    ariaErrorMessage == null &&\n    status !== undefined &&\n    statusMessage !== undefined;\n\n  const hasLabel = label != null;\n\n  const isStateInvalid = isInvalid(status);\n\n  let errorMessageId: string | undefined;\n  if (isStateInvalid) {\n    errorMessageId = canShowError\n      ? setId(elementId, \"error\")\n      : ariaErrorMessage;\n  }\n\n  const radio = (\n    <StyledHvBaseRadio\n      id={label ? setId(elementId, \"input\") : setId(id, \"input\")}\n      name={name}\n      className={clsx(\n        radioClasses.radio,\n        classes?.radio,\n        isStateInvalid && clsx(radioClasses.invalidRadio, classes?.invalidRadio)\n      )}\n      $invalid={isStateInvalid}\n      disabled={disabled}\n      readOnly={readOnly}\n      onChange={onLocalChange}\n      value={value}\n      checked={isChecked}\n      semantic={semantic}\n      inputProps={{\n        \"aria-invalid\": isStateInvalid ? true : undefined,\n        \"aria-errormessage\": errorMessageId,\n        \"aria-label\": ariaLabel,\n        \"aria-labelledby\": ariaLabelledBy,\n        \"aria-describedby\": ariaDescribedBy,\n        ...inputProps,\n      }}\n      onFocusVisible={onFocusVisibleCallback}\n      onBlur={onBlurCallback}\n      {...others}\n    />\n  );\n\n  return (\n    <StyledHvFormElement\n      id={id}\n      name={name}\n      status={status || \"standBy\"}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={clsx(className, radioClasses.root, classes?.root)}\n    >\n      {hasLabel ? (\n        <StyledDivContainer\n          className={clsx(\n            radioClasses.container,\n            classes?.container,\n            disabled && clsx(radioClasses.disabled, classes?.disabled),\n            focusVisible &&\n              label &&\n              clsx(radioClasses.focusVisible, classes?.focusVisible),\n            isStateInvalid &&\n              clsx(radioClasses.invalidContainer, classes?.invalidContainer)\n          )}\n          $invalid={isStateInvalid}\n          $focusVisible={!!(focusVisible && label)}\n          $disabled={disabled}\n        >\n          {radio}\n          <StyledHvLabel\n            id={setId(elementId, \"label\")}\n            htmlFor={setId(elementId, \"input\")}\n            label={label}\n            className={clsx(radioClasses.label, classes?.label)}\n            $disabled={disabled}\n            {...labelProps}\n          />\n        </StyledDivContainer>\n      ) : (\n        radio\n      )}\n      {canShowError && (\n        <HvWarningText id={setId(elementId, \"error\")} disableBorder>\n          {statusMessage}\n        </HvWarningText>\n      )}\n    </StyledHvFormElement>\n  );\n};\n"],"names":["HvRadio","props","classes","className","id","name","value","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelProps","checked","defaultChecked","onChange","status","statusMessage","ariaErrorMessage","semantic","inputProps","onFocusVisible","onBlur","others","elementId","useUniqueId","focusVisible","setFocusVisible","useState","onFocusVisibleCallback","useCallback","evt","onBlurCallback","isChecked","setIsChecked","useControlled","Boolean","onLocalChange","newChecked","canShowError","undefined","hasLabel","isStateInvalid","isInvalid","errorMessageId","setId","radio","jsx","StyledHvBaseRadio","clsx","radioClasses","invalidRadio","StyledHvFormElement","root","StyledDivContainer","container","invalidContainer","StyledHvLabel","HvWarningText"],"mappings":"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"}

package/dist/cjs/components/RadioGroup/RadioGroup.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const RadioGroup_styles = require("./RadioGroup.styles.cjs");
 const clsx = require("clsx");
 const radioGroupClasses = require("./radioGroupClasses.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const useUniqueId = require("../../hooks/useUniqueId.cjs");
 const useControlled = require("../../hooks/useControlled.cjs");
 const setId = require("../../utils/setId.cjs");
@@ -79,41 +79,12 @@ const HvRadioGroup = ({
   }, [children, disabled, elementId, name, onChildChangeInterceptor, readOnly, required, value]);
   const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && required);
   const errorMessageId = canShowError ? setId.setId(elementId, "error") : ariaErrorMessage;
-  return /* @__PURE__ */ jsxRuntime.jsxs(RadioGroup_styles.StyledFormElement, {
-    id,
-    name,
-    status: status || "standBy",
-    disabled,
-    required,
-    readOnly,
-    className: clsx__default.default(className, classes == null ? void 0 : classes.root, radioGroupClasses.default.root),
-    children: [label && /* @__PURE__ */ jsxRuntime.jsx(RadioGroup_styles.StyledLabel, {
-      id: setId.setId(elementId, "label"),
-      label,
-      className: clsx__default.default(classes == null ? void 0 : classes.label, radioGroupClasses.default.label)
-    }), description && /* @__PURE__ */ jsxRuntime.jsx(InfoMessage.HvInfoMessage, {
-      id: setId.setId(elementId, "description"),
-      children: description
-    }), /* @__PURE__ */ jsxRuntime.jsx(RadioGroup_styles.StyledGroup, {
-      role: "radiogroup",
-      "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabelledBy || label && setId.setId(elementId, "label") || void 0,
-      "aria-invalid": status === "invalid" ? true : void 0,
-      "aria-errormessage": status === "invalid" ? errorMessageId : void 0,
-      "aria-describedby": [description && setId.setId(elementId, "description"), ariaDescribedBy].join(" ").trim() || void 0,
-      className: clsx__default.default(classes == null ? void 0 : classes.group, radioGroupClasses.default.group, orientation === "vertical" && clsx__default.default(classes == null ? void 0 : classes.vertical, radioGroupClasses.default.vertical), orientation === "horizontal" && clsx__default.default(classes == null ? void 0 : classes.horizontal, radioGroupClasses.default.horizontal), status === "invalid" && clsx__default.default(classes == null ? void 0 : classes.invalid, radioGroupClasses.default.invalid)),
-      $vertical: orientation === "vertical",
-      $horizontal: orientation === "horizontal",
-      $invalid: status === "invalid",
-      ...others,
-      children: modifiedChildren
-    }), canShowError && /* @__PURE__ */ jsxRuntime.jsx(WarningText.HvWarningText, {
-      id: setId.setId(elementId, "error"),
-      disableBorder: true,
-      className: clsx__default.default(classes == null ? void 0 : classes.error, radioGroupClasses.default.error),
-      children: statusMessage
-    })]
-  });
+  return /* @__PURE__ */ jsxRuntime.jsxs(RadioGroup_styles.StyledFormElement, { id, name, status: status || "standBy", disabled, required, readOnly, className: clsx__default.default(className, classes == null ? void 0 : classes.root, radioGroupClasses.default.root), children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx(RadioGroup_styles.StyledLabel, { id: setId.setId(elementId, "label"), label, className: clsx__default.default(classes == null ? void 0 : classes.label, radioGroupClasses.default.label) }),
+    description && /* @__PURE__ */ jsxRuntime.jsx(InfoMessage.HvInfoMessage, { id: setId.setId(elementId, "description"), children: description }),
+    /* @__PURE__ */ jsxRuntime.jsx(RadioGroup_styles.StyledGroup, { role: "radiogroup", "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy || label && setId.setId(elementId, "label") || void 0, "aria-invalid": status === "invalid" ? true : void 0, "aria-errormessage": status === "invalid" ? errorMessageId : void 0, "aria-describedby": [description && setId.setId(elementId, "description"), ariaDescribedBy].join(" ").trim() || void 0, className: clsx__default.default(classes == null ? void 0 : classes.group, radioGroupClasses.default.group, orientation === "vertical" && clsx__default.default(classes == null ? void 0 : classes.vertical, radioGroupClasses.default.vertical), orientation === "horizontal" && clsx__default.default(classes == null ? void 0 : classes.horizontal, radioGroupClasses.default.horizontal), status === "invalid" && clsx__default.default(classes == null ? void 0 : classes.invalid, radioGroupClasses.default.invalid)), $vertical: orientation === "vertical", $horizontal: orientation === "horizontal", $invalid: status === "invalid", ...others, children: modifiedChildren }),
+    canShowError && /* @__PURE__ */ jsxRuntime.jsx(WarningText.HvWarningText, { id: setId.setId(elementId, "error"), disableBorder: true, className: clsx__default.default(classes == null ? void 0 : classes.error, radioGroupClasses.default.error), children: statusMessage })
+  ] });
 };
 exports.HvRadioGroup = HvRadioGroup;
 //# sourceMappingURL=RadioGroup.cjs.map

package/dist/cjs/components/RadioGroup/RadioGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.cjs","sources":["../../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { Children, useMemo, useCallback, cloneElement } from \"react\";\nimport { HvFormStatus, HvInfoMessage, HvWarningText } from \"../Forms\";\nimport { HvBaseProps } from \"../../types\";\nimport {\n  StyledFormElement,\n  StyledGroup,\n  StyledLabel,\n} from \"./RadioGroup.styles\";\nimport clsx from \"clsx\";\nimport { useControlled, useUniqueId } from \"hooks\";\nimport { setId } from \"utils\";\nimport radioGroupClasses, { HvRadioGroupClasses } from \"./radioGroupClasses\";\n\nexport type HvRadioGroupProps = HvBaseProps<HTMLDivElement, { onChange }> & {\n  /**\n   * The form element name.\n   *\n   * It is propagated to the children radio buttons, unless they already have one (which they shouldn't).\n   */\n  name?: string;\n  /**\n   * The value of the form element, represented in one of the child radio buttons values.\n   *\n   * When defined the radio button group state becomes controlled.\n   */\n  value?: any;\n  /**\n   * When uncontrolled, defines the initial value.\n   */\n  defaultValue?: 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  /**\n   * Provide additional descriptive text for the form element.\n   */\n  description?: React.ReactNode;\n  /**\n   * Indicates that the form element is disabled.\n   * If `true` the state is propagated to the children radio buttons.\n   */\n  disabled?: boolean;\n  /**\n   * Indicates that the form element is not editable.\n   * If `true` the state is propagated to the children radio buttons.\n   */\n  readOnly?: boolean;\n  /**\n   * Indicates that user input is required on the form element.\n   * If `true` the state is propagated to the children radio buttons' input element.\n   */\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 `status` is \"invalid\".\n   */\n  statusMessage?: React.ReactNode;\n  /**\n   * The callback fired when the value changes.\n   */\n  onChange?: (event: React.ChangeEvent<HTMLInputElement>, value: any) => void;\n  /**\n   * Indicates whether the radio buttons group's orientation is horizontal or vertical.\n   *\n   * Defaults to vertical.\n   */\n  orientation?: \"vertical\" | \"horizontal\";\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvRadioGroupClasses;\n};\n\nconst getValueFromSelectedChildren = (children: React.ReactNode) => {\n  const childrenArray = Children.toArray(children);\n  const childrenCount = childrenArray.length;\n  for (let i = 0; i !== childrenCount; i += 1) {\n    const child: any = childrenArray[i];\n\n    const childIsControlled = child?.props?.checked !== undefined;\n    const childIsSelected = childIsControlled\n      ? child?.props?.checked\n      : child?.props?.defaultChecked;\n\n    if (childIsSelected) {\n      return child?.props?.value;\n    }\n  }\n\n  return null;\n};\n\n/**\n * A group of radio buttons.\n *\n * A radio group is a type of selection list that can only have a single entry checked at any one time.\n */\nexport const HvRadioGroup = ({\n  id,\n  classes,\n  className,\n  children,\n  name,\n  value: valueProp,\n  defaultValue,\n  label,\n  description,\n  status,\n  statusMessage,\n  required = false,\n  readOnly = false,\n  disabled = false,\n  orientation = \"vertical\",\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledBy,\n  \"aria-describedby\": ariaDescribedBy,\n  \"aria-errormessage\": ariaErrorMessage,\n  onChange,\n  ...others\n}: HvRadioGroupProps) => {\n  const elementId = useUniqueId(id, \"hvradiogroup\");\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)\n  );\n\n  const onChildChangeInterceptor = useCallback(\n    (\n      childOnChange: (\n        event: React.ChangeEvent<HTMLInputElement>,\n        checked: boolean,\n        value: any\n      ) => void,\n      event: React.ChangeEvent<HTMLInputElement>,\n      isChecked: boolean,\n      newValue: any\n    ) => {\n      childOnChange?.(event, isChecked, newValue);\n\n      onChange?.(event, newValue);\n\n      setValue(newValue);\n    },\n    [onChange, setValue]\n  );\n\n  const modifiedChildren = useMemo(() => {\n    return Children.map(children, (child: any) => {\n      const childValue = child?.props?.value ?? \"on\";\n\n      const childIsSelected = childValue === value;\n\n      return cloneElement(child, {\n        checked: childIsSelected,\n        name: child?.props?.name || name || elementId,\n        onChange: (\n          event: React.ChangeEvent<HTMLInputElement>,\n          isChecked: boolean,\n          newValue: any\n        ) =>\n          onChildChangeInterceptor(\n            child?.props?.onChange,\n            event,\n            isChecked,\n            newValue\n          ),\n        inputProps: {\n          ...child?.props?.inputProps,\n          // Set the required attribute directly in the input\n          // the radio form element context shouldn't be aware so the\n          // label doesn't show redundant asterisk\n          required,\n        },\n        disabled: disabled || child?.props?.disabled,\n        readOnly: readOnly || child?.props?.readOnly,\n      });\n    });\n  }, [\n    children,\n    disabled,\n    elementId,\n    name,\n    onChildChangeInterceptor,\n    readOnly,\n    required,\n    value,\n  ]);\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  return (\n    <StyledFormElement\n      id={id}\n      name={name}\n      status={status || \"standBy\"}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={clsx(className, classes?.root, radioGroupClasses.root)}\n    >\n      {label && (\n        <StyledLabel\n          id={setId(elementId, \"label\")}\n          label={label}\n          className={clsx(classes?.label, radioGroupClasses.label)}\n        />\n      )}\n\n      {description && (\n        <HvInfoMessage id={setId(elementId, \"description\")}>\n          {description}\n        </HvInfoMessage>\n      )}\n\n      <StyledGroup\n        role=\"radiogroup\"\n        aria-label={ariaLabel}\n        aria-labelledby={\n          ariaLabelledBy || (label && setId(elementId, \"label\")) || undefined\n        }\n        aria-invalid={status === \"invalid\" ? true : undefined}\n        aria-errormessage={status === \"invalid\" ? errorMessageId : undefined}\n        aria-describedby={\n          [description && setId(elementId, \"description\"), ariaDescribedBy]\n            .join(\" \")\n            .trim() || undefined\n        }\n        className={clsx(\n          classes?.group,\n          radioGroupClasses.group,\n          orientation === \"vertical\" &&\n            clsx(classes?.vertical, radioGroupClasses.vertical),\n          orientation === \"horizontal\" &&\n            clsx(classes?.horizontal, radioGroupClasses.horizontal),\n          status === \"invalid\" &&\n            clsx(classes?.invalid, radioGroupClasses.invalid)\n        )}\n        $vertical={orientation === \"vertical\"}\n        $horizontal={orientation === \"horizontal\"}\n        $invalid={status === \"invalid\"}\n        {...others}\n      >\n        {modifiedChildren}\n      </StyledGroup>\n\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          disableBorder\n          className={clsx(classes?.error, radioGroupClasses.error)}\n        >\n          {statusMessage}\n        </HvWarningText>\n      )}\n    </StyledFormElement>\n  );\n};\n"],"names":["getValueFromSelectedChildren","children","childrenArray","Children","toArray","childrenCount","length","i","child","childIsControlled","props","checked","undefined","childIsSelected","defaultChecked","value","HvRadioGroup","id","classes","className","name","valueProp","defaultValue","label","description","status","statusMessage","required","readOnly","disabled","orientation","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaErrorMessage","onChange","others","elementId","useUniqueId","setValue","useControlled","onChildChangeInterceptor","useCallback","childOnChange","event","isChecked","newValue","modifiedChildren","useMemo","map","childValue","cloneElement","inputProps","canShowError","errorMessageId","setId","StyledFormElement","clsx","root","radioGroupClasses","_jsx","StyledLabel","HvInfoMessage","StyledGroup","role","join","trim","group","vertical","horizontal","invalid","$vertical","$horizontal","$invalid","HvWarningText","disableBorder","error"],"mappings":";;;;;;;;;;;;;;AAqFA,MAAMA,+BAA+BA,CAACC,aAA8B;;AAC5DC,QAAAA,gBAAgBC,MAAAA,SAASC,QAAQH,QAAQ;AAC/C,QAAMI,gBAAgBH,cAAcI;AACpC,WAASC,IAAI,GAAGA,MAAMF,eAAeE,KAAK,GAAG;AAC3C,UAAMC,QAAaN,cAAcK;AAE3BE,UAAAA,sBAAoBD,oCAAOE,UAAPF,mBAAcG,aAAYC;AACpD,UAAMC,kBAAkBJ,qBACpBD,oCAAOE,UAAPF,mBAAcG,WACdH,oCAAOE,UAAPF,mBAAcM;AAElB,QAAID,iBAAiB;AACnB,cAAOL,oCAAOE,UAAPF,mBAAcO;AAAAA,IACvB;AAAA,EACF;AAEO,SAAA;AACT;AAOO,MAAMC,eAAeA,CAAC;AAAA,EAC3BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAlB;AAAAA,EACAmB;AAAAA,EACAL,OAAOM;AAAAA,EACPC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,WAAW;AAAA,EACXC,WAAW;AAAA,EACXC,WAAW;AAAA,EACXC,cAAc;AAAA,EACd,cAAcC;AAAAA,EACd,mBAAmBC;AAAAA,EACnB,oBAAoBC;AAAAA,EACpB,qBAAqBC;AAAAA,EACrBC;AAAAA,KACGC;AACc,MAAM;AACjBC,QAAAA,YAAYC,YAAAA,QAAYrB,IAAI,cAAc;AAEhD,QAAM,CAACF,OAAOwB,QAAQ,IAAIC,cAAAA,cACxBnB,WACAC,iBAAiBV,SACbU,eAGA,MAAMtB,6BAA6BC,QAAQ,CAAC;AAGlD,QAAMwC,2BAA2BC,MAAAA,YAC/B,CACEC,eAKAC,OACAC,WACAC,aACG;AACaF,mDAAAA,OAAOC,WAAWC;AAElCX,yCAAWS,OAAOE;AAElBP,aAASO,QAAQ;AAAA,EAAA,GAEnB,CAACX,UAAUI,QAAQ,CAAC;AAGhBQ,QAAAA,mBAAmBC,MAAAA,QAAQ,MAAM;AACrC,WAAO7C,eAAS8C,IAAIhD,UAAU,CAACO,UAAe;;AACtC0C,YAAAA,cAAa1C,0CAAOE,UAAPF,mBAAcO,UAAdP,YAAuB;AAE1C,YAAMK,kBAAkBqC,eAAenC;AAEvC,aAAOoC,MAAAA,aAAa3C,OAAO;AAAA,QACzBG,SAASE;AAAAA,QACTO,QAAMZ,oCAAOE,UAAPF,mBAAcY,SAAQA,QAAQiB;AAAAA,QACpCF,UAAUA,CACRS,OACAC,WACAC,aAAAA;;AAEAL,2CACEjC,MAAAA,+BAAOE,UAAPF,gBAAAA,IAAc2B,UACdS,OACAC,WACAC,QAAQ;AAAA;AAAA,QAEZM,YAAY;AAAA,UACV,IAAG5C,oCAAOE,UAAPF,mBAAc4C;AAAAA,UAIjBzB;AAAAA,QACF;AAAA,QACAE,UAAUA,cAAYrB,oCAAOE,UAAPF,mBAAcqB;AAAAA,QACpCD,UAAUA,cAAYpB,oCAAOE,UAAPF,mBAAcoB;AAAAA,MAAAA,CACrC;AAAA,IAAA,CACF;AAAA,EAAA,GACA,CACD3B,UACA4B,UACAQ,WACAjB,MACAqB,0BACAb,UACAD,UACAZ,KAAK,CACN;AAMKsC,QAAAA,eACJnB,oBAAoB,SAClBT,WAAWb,UAAac,kBAAkBd,UACzCa,WAAWb,UAAae;AAE7B,QAAM2B,iBAAiBD,eACnBE,MAAAA,MAAMlB,WAAW,OAAO,IACxBH;AAEJ,yCACGsB,kBAAAA,mBAAiB;AAAA,IAChBvC;AAAAA,IACAG;AAAAA,IACAK,QAAQA,UAAU;AAAA,IAClBI;AAAAA,IACAF;AAAAA,IACAC;AAAAA,IACAT,WAAWsC,cAAKtC,QAAAA,WAAWD,mCAASwC,MAAMC,0BAAkBD,IAAI;AAAA,IAAEzD,UAEjEsB,CAAAA,SACCqC,2BAAAA,IAACC,+BAAW;AAAA,MACV5C,IAAIsC,MAAAA,MAAMlB,WAAW,OAAO;AAAA,MAC5Bd;AAAAA,MACAJ,WAAWsC,cAAAA,QAAKvC,mCAASK,OAAOoC,kBAAAA,QAAkBpC,KAAK;AAAA,IAAA,CAAE,GAI5DC,eACCoC,2BAAAA,IAACE,2BAAa;AAAA,MAAC7C,IAAIsC,MAAAA,MAAMlB,WAAW,aAAa;AAAA,MAAEpC,UAChDuB;AAAAA,IAAAA,CAEJ,GAEDoC,2BAAAA,IAACG,+BAAW;AAAA,MACVC,MAAK;AAAA,MACL,cAAYjC;AAAAA,MACZ,mBACEC,kBAAmBT,SAASgC,MAAAA,MAAMlB,WAAW,OAAO,KAAMzB;AAAAA,MAE5D,gBAAca,WAAW,YAAY,OAAOb;AAAAA,MAC5C,qBAAmBa,WAAW,YAAY6B,iBAAiB1C;AAAAA,MAC3D,oBACE,CAACY,eAAe+B,YAAMlB,WAAW,aAAa,GAAGJ,eAAe,EAC7DgC,KAAK,GAAG,EACRC,UAAUtD;AAAAA,MAEfO,WAAWsC,cAAAA,QACTvC,mCAASiD,OACTR,kBAAAA,QAAkBQ,OAClBrC,gBAAgB,cACd2B,cAAKvC,QAAAA,mCAASkD,UAAUT,kBAAAA,QAAkBS,QAAQ,GACpDtC,gBAAgB,gBACd2B,cAAKvC,QAAAA,mCAASmD,YAAYV,kBAAAA,QAAkBU,UAAU,GACxD5C,WAAW,aACTgC,cAAKvC,QAAAA,mCAASoD,SAASX,kBAAAA,QAAkBW,OAAO,CAAC;AAAA,MAErDC,WAAWzC,gBAAgB;AAAA,MAC3B0C,aAAa1C,gBAAgB;AAAA,MAC7B2C,UAAUhD,WAAW;AAAA,MAAU,GAC3BW;AAAAA,MAAMnC,UAET8C;AAAAA,IAAAA,CAAgB,GAGlBM,gBACCO,2BAAAA,IAACc,2BAAa;AAAA,MACZzD,IAAIsC,MAAAA,MAAMlB,WAAW,OAAO;AAAA,MAC5BsC,eAAa;AAAA,MACbxD,WAAWsC,cAAAA,QAAKvC,mCAAS0D,OAAOjB,kBAAAA,QAAkBiB,KAAK;AAAA,MAAE3E,UAExDyB;AAAAA,IAAAA,CAEJ,CAAA;AAAA,EAAA,CACiB;AAExB;;"}
+{"version":3,"file":"RadioGroup.cjs","sources":["../../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { Children, useMemo, useCallback, cloneElement } from \"react\";\nimport { HvFormStatus, HvInfoMessage, HvWarningText } from \"../Forms\";\nimport { HvBaseProps } from \"../../types\";\nimport {\n  StyledFormElement,\n  StyledGroup,\n  StyledLabel,\n} from \"./RadioGroup.styles\";\nimport clsx from \"clsx\";\nimport { useControlled, useUniqueId } from \"hooks\";\nimport { setId } from \"utils\";\nimport radioGroupClasses, { HvRadioGroupClasses } from \"./radioGroupClasses\";\n\nexport type HvRadioGroupProps = HvBaseProps<HTMLDivElement, { onChange }> & {\n  /**\n   * The form element name.\n   *\n   * It is propagated to the children radio buttons, unless they already have one (which they shouldn't).\n   */\n  name?: string;\n  /**\n   * The value of the form element, represented in one of the child radio buttons values.\n   *\n   * When defined the radio button group state becomes controlled.\n   */\n  value?: any;\n  /**\n   * When uncontrolled, defines the initial value.\n   */\n  defaultValue?: 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  /**\n   * Provide additional descriptive text for the form element.\n   */\n  description?: React.ReactNode;\n  /**\n   * Indicates that the form element is disabled.\n   * If `true` the state is propagated to the children radio buttons.\n   */\n  disabled?: boolean;\n  /**\n   * Indicates that the form element is not editable.\n   * If `true` the state is propagated to the children radio buttons.\n   */\n  readOnly?: boolean;\n  /**\n   * Indicates that user input is required on the form element.\n   * If `true` the state is propagated to the children radio buttons' input element.\n   */\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 `status` is \"invalid\".\n   */\n  statusMessage?: React.ReactNode;\n  /**\n   * The callback fired when the value changes.\n   */\n  onChange?: (event: React.ChangeEvent<HTMLInputElement>, value: any) => void;\n  /**\n   * Indicates whether the radio buttons group's orientation is horizontal or vertical.\n   *\n   * Defaults to vertical.\n   */\n  orientation?: \"vertical\" | \"horizontal\";\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvRadioGroupClasses;\n};\n\nconst getValueFromSelectedChildren = (children: React.ReactNode) => {\n  const childrenArray = Children.toArray(children);\n  const childrenCount = childrenArray.length;\n  for (let i = 0; i !== childrenCount; i += 1) {\n    const child: any = childrenArray[i];\n\n    const childIsControlled = child?.props?.checked !== undefined;\n    const childIsSelected = childIsControlled\n      ? child?.props?.checked\n      : child?.props?.defaultChecked;\n\n    if (childIsSelected) {\n      return child?.props?.value;\n    }\n  }\n\n  return null;\n};\n\n/**\n * A group of radio buttons.\n *\n * A radio group is a type of selection list that can only have a single entry checked at any one time.\n */\nexport const HvRadioGroup = ({\n  id,\n  classes,\n  className,\n  children,\n  name,\n  value: valueProp,\n  defaultValue,\n  label,\n  description,\n  status,\n  statusMessage,\n  required = false,\n  readOnly = false,\n  disabled = false,\n  orientation = \"vertical\",\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledBy,\n  \"aria-describedby\": ariaDescribedBy,\n  \"aria-errormessage\": ariaErrorMessage,\n  onChange,\n  ...others\n}: HvRadioGroupProps) => {\n  const elementId = useUniqueId(id, \"hvradiogroup\");\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)\n  );\n\n  const onChildChangeInterceptor = useCallback(\n    (\n      childOnChange: (\n        event: React.ChangeEvent<HTMLInputElement>,\n        checked: boolean,\n        value: any\n      ) => void,\n      event: React.ChangeEvent<HTMLInputElement>,\n      isChecked: boolean,\n      newValue: any\n    ) => {\n      childOnChange?.(event, isChecked, newValue);\n\n      onChange?.(event, newValue);\n\n      setValue(newValue);\n    },\n    [onChange, setValue]\n  );\n\n  const modifiedChildren = useMemo(() => {\n    return Children.map(children, (child: any) => {\n      const childValue = child?.props?.value ?? \"on\";\n\n      const childIsSelected = childValue === value;\n\n      return cloneElement(child, {\n        checked: childIsSelected,\n        name: child?.props?.name || name || elementId,\n        onChange: (\n          event: React.ChangeEvent<HTMLInputElement>,\n          isChecked: boolean,\n          newValue: any\n        ) =>\n          onChildChangeInterceptor(\n            child?.props?.onChange,\n            event,\n            isChecked,\n            newValue\n          ),\n        inputProps: {\n          ...child?.props?.inputProps,\n          // Set the required attribute directly in the input\n          // the radio form element context shouldn't be aware so the\n          // label doesn't show redundant asterisk\n          required,\n        },\n        disabled: disabled || child?.props?.disabled,\n        readOnly: readOnly || child?.props?.readOnly,\n      });\n    });\n  }, [\n    children,\n    disabled,\n    elementId,\n    name,\n    onChildChangeInterceptor,\n    readOnly,\n    required,\n    value,\n  ]);\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  return (\n    <StyledFormElement\n      id={id}\n      name={name}\n      status={status || \"standBy\"}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={clsx(className, classes?.root, radioGroupClasses.root)}\n    >\n      {label && (\n        <StyledLabel\n          id={setId(elementId, \"label\")}\n          label={label}\n          className={clsx(classes?.label, radioGroupClasses.label)}\n        />\n      )}\n\n      {description && (\n        <HvInfoMessage id={setId(elementId, \"description\")}>\n          {description}\n        </HvInfoMessage>\n      )}\n\n      <StyledGroup\n        role=\"radiogroup\"\n        aria-label={ariaLabel}\n        aria-labelledby={\n          ariaLabelledBy || (label && setId(elementId, \"label\")) || undefined\n        }\n        aria-invalid={status === \"invalid\" ? true : undefined}\n        aria-errormessage={status === \"invalid\" ? errorMessageId : undefined}\n        aria-describedby={\n          [description && setId(elementId, \"description\"), ariaDescribedBy]\n            .join(\" \")\n            .trim() || undefined\n        }\n        className={clsx(\n          classes?.group,\n          radioGroupClasses.group,\n          orientation === \"vertical\" &&\n            clsx(classes?.vertical, radioGroupClasses.vertical),\n          orientation === \"horizontal\" &&\n            clsx(classes?.horizontal, radioGroupClasses.horizontal),\n          status === \"invalid\" &&\n            clsx(classes?.invalid, radioGroupClasses.invalid)\n        )}\n        $vertical={orientation === \"vertical\"}\n        $horizontal={orientation === \"horizontal\"}\n        $invalid={status === \"invalid\"}\n        {...others}\n      >\n        {modifiedChildren}\n      </StyledGroup>\n\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          disableBorder\n          className={clsx(classes?.error, radioGroupClasses.error)}\n        >\n          {statusMessage}\n        </HvWarningText>\n      )}\n    </StyledFormElement>\n  );\n};\n"],"names":["getValueFromSelectedChildren","children","childrenArray","Children","toArray","childrenCount","length","i","child","childIsControlled","props","checked","undefined","childIsSelected","defaultChecked","value","HvRadioGroup","id","classes","className","name","valueProp","defaultValue","label","description","status","statusMessage","required","readOnly","disabled","orientation","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaErrorMessage","onChange","others","elementId","useUniqueId","setValue","useControlled","onChildChangeInterceptor","useCallback","childOnChange","event","isChecked","newValue","modifiedChildren","useMemo","map","childValue","cloneElement","inputProps","canShowError","errorMessageId","setId","StyledFormElement","clsx","root","radioGroupClasses","jsx","StyledLabel","HvInfoMessage","StyledGroup","join","trim","group","vertical","horizontal","invalid","HvWarningText","error"],"mappings":"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"}

package/dist/cjs/components/SelectionList/SelectionList.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const clsx = require("clsx");
 const SelectionList_styles = require("./SelectionList.styles.cjs");
 const selectionListClasses = require("./selectionListClasses.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const useUniqueId = require("../../hooks/useUniqueId.cjs");
 const useControlled = require("../../hooks/useControlled.cjs");
 const multiSelectionEventHandler = require("../../utils/multiSelectionEventHandler.cjs");
@@ -129,46 +129,12 @@ const HvSelectionList = ({
   const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && required);
   const errorMessageId = canShowError ? setId.setId(elementId, "error") : ariaErrorMessage;
   const listId = label && setId.setId(elementId, "listbox") || "";
-  return /* @__PURE__ */ jsxRuntime.jsxs(SelectionList_styles.StyledFormElement, {
-    id,
-    name,
-    status: validationState,
-    disabled,
-    required,
-    readOnly,
-    className: clsx__default.default(className, selectionListClasses.default.root, classes == null ? void 0 : classes.root),
-    children: [label && /* @__PURE__ */ jsxRuntime.jsx(SelectionList_styles.StyledLabel, {
-      id: setId.setId(elementId, "label"),
-      label,
-      className: clsx__default.default(selectionListClasses.default.label, classes == null ? void 0 : classes.label)
-    }), description && /* @__PURE__ */ jsxRuntime.jsx(SelectionList_styles.StyledInfoMessage, {
-      id: setId.setId(elementId, "description"),
-      className: clsx__default.default(selectionListClasses.default.description, classes == null ? void 0 : classes.description),
-      children: description
-    }), /* @__PURE__ */ jsxRuntime.jsx(SelectionList_styles.StyledListContainer, {
-      id: listId,
-      interactive: true,
-      condensed: true,
-      role: "listbox",
-      "aria-multiselectable": multiple || void 0,
-      "aria-label": ariaLabel,
-      "aria-labelledby": [label && setId.setId(elementId, "label"), ariaLabelledBy].join(" ").trim() || void 0,
-      "aria-invalid": validationState === "invalid" ? true : void 0,
-      "aria-errormessage": validationState === "invalid" ? errorMessageId : void 0,
-      "aria-describedby": [description && setId.setId(elementId, "description"), ariaDescribedBy].join(" ").trim() || void 0,
-      className: clsx__default.default(classes == null ? void 0 : classes.listbox, selectionListClasses.default.listbox, orientation === "vertical" && clsx__default.default(selectionListClasses.default.vertical, classes == null ? void 0 : classes.vertical), orientation === "horizontal" && clsx__default.default(selectionListClasses.default.horizontal, classes == null ? void 0 : classes.horizontal), validationState === "invalid" && clsx__default.default(selectionListClasses.default.invalid, classes == null ? void 0 : classes.invalid)),
-      ref: listContainer,
-      $orientation: orientation,
-      $validationState: validationState,
-      ...others,
-      children: modifiedChildren
-    }), canShowError && /* @__PURE__ */ jsxRuntime.jsx(SelectionList_styles.StyledError, {
-      id: setId.setId(elementId, "error"),
-      disableBorder: true,
-      className: clsx__default.default(selectionListClasses.default.error, classes == null ? void 0 : classes.error),
-      children: validationMessage
-    })]
-  });
+  return /* @__PURE__ */ jsxRuntime.jsxs(SelectionList_styles.StyledFormElement, { id, name, status: validationState, disabled, required, readOnly, className: clsx__default.default(className, selectionListClasses.default.root, classes == null ? void 0 : classes.root), children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx(SelectionList_styles.StyledLabel, { id: setId.setId(elementId, "label"), label, className: clsx__default.default(selectionListClasses.default.label, classes == null ? void 0 : classes.label) }),
+    description && /* @__PURE__ */ jsxRuntime.jsx(SelectionList_styles.StyledInfoMessage, { id: setId.setId(elementId, "description"), className: clsx__default.default(selectionListClasses.default.description, classes == null ? void 0 : classes.description), children: description }),
+    /* @__PURE__ */ jsxRuntime.jsx(SelectionList_styles.StyledListContainer, { id: listId, interactive: true, condensed: true, role: "listbox", "aria-multiselectable": multiple || void 0, "aria-label": ariaLabel, "aria-labelledby": [label && setId.setId(elementId, "label"), ariaLabelledBy].join(" ").trim() || void 0, "aria-invalid": validationState === "invalid" ? true : void 0, "aria-errormessage": validationState === "invalid" ? errorMessageId : void 0, "aria-describedby": [description && setId.setId(elementId, "description"), ariaDescribedBy].join(" ").trim() || void 0, className: clsx__default.default(classes == null ? void 0 : classes.listbox, selectionListClasses.default.listbox, orientation === "vertical" && clsx__default.default(selectionListClasses.default.vertical, classes == null ? void 0 : classes.vertical), orientation === "horizontal" && clsx__default.default(selectionListClasses.default.horizontal, classes == null ? void 0 : classes.horizontal), validationState === "invalid" && clsx__default.default(selectionListClasses.default.invalid, classes == null ? void 0 : classes.invalid)), ref: listContainer, $orientation: orientation, $validationState: validationState, ...others, children: modifiedChildren }),
+    canShowError && /* @__PURE__ */ jsxRuntime.jsx(SelectionList_styles.StyledError, { id: setId.setId(elementId, "error"), disableBorder: true, className: clsx__default.default(selectionListClasses.default.error, classes == null ? void 0 : classes.error), children: validationMessage })
+  ] });
 };
 exports.HvSelectionList = HvSelectionList;
 //# sourceMappingURL=SelectionList.cjs.map

package/dist/cjs/components/SelectionList/SelectionList.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionList.cjs","sources":["../../../../src/components/SelectionList/SelectionList.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useEffect } from \"react\";\nimport clsx from \"clsx\";\nimport { HvBaseProps } from \"../../types/index\";\nimport {\n  StyledListContainer,\n  StyledFormElement,\n  StyledLabel,\n  StyledInfoMessage,\n  StyledError,\n} from \"./SelectionList.styles\";\nimport {\n  isKeypress,\n  keyboardCodes,\n  setId,\n  multiSelectionEventHandler,\n} from \"utils\";\nimport { useControlled, useUniqueId } from \"hooks\";\nimport { HvFormStatus } from \"components\";\nimport selectionListClasses, {\n  HvSelectionListClasses,\n} from \"./selectionListClasses\";\n\nexport type HvSelectionListProps = HvBaseProps<\n  HTMLUListElement,\n  { onChange }\n> & {\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?: Function;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvSelectionListClasses;\n};\n\nconst getValueFromSelectedChildren = (children, multiple) => {\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 = ({\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}: HvSelectionListProps) => {\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  const { ArrowUp, ArrowDown } = keyboardCodes;\n\n  useEffect(() => {\n    const handleMeta = (event) => {\n      const tempArray: any[] = [];\n      if (\n        (isKeypress(event, ArrowUp) &&\n          event.shiftKey &&\n          listContainer.current.contains(event.target)) ||\n        (isKeypress(event, ArrowDown) &&\n          event.shiftKey &&\n          listContainer.current.contains(event.target))\n      ) {\n        selectedState.forEach((isSelected, i) => {\n          if (i === event.target.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, ArrowUp, ArrowDown]);\n\n  const onChildChangeInterceptor = useCallback(\n    (index, childOnClick, evt) => {\n      childOnClick?.(evt);\n      if (!readOnly && !disabled) {\n        let newValue;\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) => {\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","elementId","useUniqueId","setValue","useControlled","validationState","setValidationState","validationMessage","allValues","selectedState","useMemo","childValues","childSelectedState","forEach","i","childValue","indexOf","selectionAnchor","useRef","listContainer","ArrowUp","ArrowDown","keyboardCodes","useEffect","handleMeta","event","tempArray","isKeypress","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.cjs","sources":["../../../../src/components/SelectionList/SelectionList.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useEffect } from \"react\";\nimport clsx from \"clsx\";\nimport { HvBaseProps } from \"../../types/index\";\nimport {\n  StyledListContainer,\n  StyledFormElement,\n  StyledLabel,\n  StyledInfoMessage,\n  StyledError,\n} from \"./SelectionList.styles\";\nimport {\n  isKeypress,\n  keyboardCodes,\n  setId,\n  multiSelectionEventHandler,\n} from \"utils\";\nimport { useControlled, useUniqueId } from \"hooks\";\nimport { HvFormStatus } from \"components\";\nimport selectionListClasses, {\n  HvSelectionListClasses,\n} from \"./selectionListClasses\";\n\nexport type HvSelectionListProps = HvBaseProps<\n  HTMLUListElement,\n  { onChange }\n> & {\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?: Function;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvSelectionListClasses;\n};\n\nconst getValueFromSelectedChildren = (children, multiple) => {\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 = ({\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}: HvSelectionListProps) => {\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  const { ArrowUp, ArrowDown } = keyboardCodes;\n\n  useEffect(() => {\n    const handleMeta = (event) => {\n      const tempArray: any[] = [];\n      if (\n        (isKeypress(event, ArrowUp) &&\n          event.shiftKey &&\n          listContainer.current.contains(event.target)) ||\n        (isKeypress(event, ArrowDown) &&\n          event.shiftKey &&\n          listContainer.current.contains(event.target))\n      ) {\n        selectedState.forEach((isSelected, i) => {\n          if (i === event.target.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, ArrowUp, ArrowDown]);\n\n  const onChildChangeInterceptor = useCallback(\n    (index, childOnClick, evt) => {\n      childOnClick?.(evt);\n      if (!readOnly && !disabled) {\n        let newValue;\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) => {\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","elementId","useUniqueId","setValue","useControlled","validationState","setValidationState","validationMessage","allValues","selectedState","useMemo","childValues","childSelectedState","forEach","i","childValue","indexOf","selectionAnchor","useRef","listContainer","ArrowUp","ArrowDown","keyboardCodes","useEffect","handleMeta","event","tempArray","isKeypress","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","join","trim","listbox","vertical","horizontal","invalid","StyledError","error"],"mappings":";;;;;;;;;;;;;;;;AAiFA,MAAMA,+BAA+BA,CAACC,UAAUC,aAAa;AACrDC,QAAAA,iBAAiBC,uBAAMC,SAASC,QAAQL,QAAQ,EACnDM,IAAI,CAACC,UAAe;;AACbC,UAAAA,sBAAoBD,oCAAOE,UAAPF,mBAAcG,cAAaC;AACrD,UAAMC,kBACJL,SAASC,qBACLD,WAAME,UAANF,mBAAaG,YACbH,WAAME,UAANF,mBAAaM;AAEZD,WAAAA,kBAAkBL,+BAAOE,MAAMK,QAAQH;AAAAA,EAAAA,CAC/C,EACAI,OAAQC,CAAAA,MAAMA,MAAML,MAAS;AAEzBV,SAAAA,WAAWC,iBAAiBA,iDAAiB;AACtD;AAQO,MAAMe,kBAAkBA,CAAC;AAAA,EAC9BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACApB;AAAAA,EACAqB;AAAAA,EACAP,OAAOQ;AAAAA,EACPC;AAAAA,EACAC,WAAW;AAAA,EACXC,WAAW;AAAA,EACXC,WAAW;AAAA,EACXC;AAAAA,EACA,cAAcC;AAAAA,EACd,mBAAmBC;AAAAA,EACnBC;AAAAA,EACA,oBAAoBC;AAAAA,EACpBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,qBAAqBC;AAAAA,EACrBC,cAAc;AAAA,EACdnC,WAAW;AAAA,EACXoC,wBAAwB;AAAA,KACrBC;AACiB,MAAM;AACpBC,QAAAA,YAAYC,YAAAA,QAAYtB,IAAI,iBAAiB;AAEnD,QAAM,CAACJ,OAAO2B,QAAQ,IAAIC,cACxBpB,cAAAA,WACAC,iBAAiBZ,SACbY,eAGA,MAAMxB,6BAA6BC,UAAUC,QAAQ,CAAC;AAG5D,QAAM,CAAC0C,iBAAiBC,kBAAkB,IAAIF,cAAAA,cAC5CT,QACA,SAAS;AAGX,QAAM,CAACY,iBAAiB,IAAIH,cAAAA,cAAcR,eAAe,UAAU;AAEnE,QAAM,CAACY,WAAWC,aAAa,IAAIC,cAAQ,MAAM;AAC/C,UAAMC,cAAqB,CAAA;AAC3B,UAAMC,qBAAgC,CAAA;AAEtC/C,mBAAAA,QAAMC,SAASC,QAAQL,QAAQ,EAAEmD,QAAQ,CAAC5C,OAAY6C,MAAc;;AAC5DC,YAAAA,cAAa9C,oCAAOE,UAAPF,mBAAcO;AACjC,YAAMF,kBAAkBX,WACpBa,MAAMwC,QAAQD,UAAU,MAAM,KAC9BvC,UAAUuC;AAEdJ,kBAAYG,KAAKC;AACjBH,yBAAmBE,KAAKxC;AAAAA,IAAAA,CACzB;AAEM,WAAA,CAACqC,aAAaC,kBAAkB;AAAA,EACtC,GAAA,CAAClD,UAAUC,UAAUa,KAAK,CAAC;AAExByC,QAAAA,kBAAkBC,MAAAA,OAAO7C,MAAS;AAElC8C,QAAAA,gBAAgBD,aAAY,IAAI;AAEhC,QAAA;AAAA,IAAEE;AAAAA,IAASC;AAAAA,EAAcC,IAAAA;AAE/BC,QAAAA,UAAU,MAAM;AACd,UAAMC,aAAcC,CAAU,UAAA;AAC5B,YAAMC,YAAmB,CAAA;AAEtBC,UAAAA,oBAAWF,OAAOL,OAAO,KACxBK,MAAMG,YACNT,cAAcU,QAAQC,SAASL,MAAMM,MAAM,KAC5CJ,SAAWF,WAAAA,OAAOJ,SAAS,KAC1BI,MAAMG,YACNT,cAAcU,QAAQC,SAASL,MAAMM,MAAM,GAC7C;AACclB,sBAAAA,QAAQ,CAACmB,YAAYlB,MAAM;AACvC,cAAIA,MAAMW,MAAMM,OAAOvD,QAAQ,GAAG;AAChC,gBAAI,CAACwD,YAAY;AACLC,wBAAAA,KAAKzB,UAAUM,EAAE;AAAA,YAC7B;AAAA,qBACSkB,YAAY;AACXC,sBAAAA,KAAKzB,UAAUM,EAAE;AAAA,UAC7B;AAAA,QAAA,CACD;AACDX,iBAASuB,SAAS;AAAA,MACpB;AAAA,IAAA;AAEKQ,WAAAA,iBAAiB,SAASV,UAAU;AAE3C,WAAO,MAAM;AACJW,aAAAA,oBAAoB,SAASX,UAAU;AAAA,IAAA;AAAA,EAChD,GACC,CAAChB,WAAWC,eAAeN,UAAUiB,SAASC,SAAS,CAAC;AAE3D,QAAMe,2BAA2BC,MAAAA,YAC/B,CAACC,OAAOC,cAAcC,QAAQ;AAC5BD,iDAAeC;AACX,QAAA,CAACrD,YAAY,CAACC,UAAU;AACtBqD,UAAAA;AACJ,UAAI9E,UAAU;AACZ8E,mBAAWC,2BAAAA,QACTF,KACAF,OACArB,iBACAT,WACAC,eACApC,MAAS;AAAA,MAAA,OAEN;AACLoE,mBACE1C,yBAAyBU,cAAc6B,SACnC,OACA9B,UAAU8B;AAAAA,MAClB;AAEA5C,2CAAW8C,KAAKC;AAEhBtC,eAAS,MAAM;AAGTjB,YAAAA,YAAYuD,SAASE,WAAW,GAAG;AACrCrC,6BAAmB,SAAS;AAAA,QAAA,OACvB;AACLA,6BAAmB,OAAO;AAAA,QAC5B;AAEOmC,eAAAA;AAAAA,MAAAA,CACR;AAAA,IACH;AAAA,EAEF,GAAA,CACEjC,WACApB,UACAzB,UACA+B,UACAP,UACAD,UACAuB,eACAH,oBACAH,UACAJ,uBACAkB,eAAe,CAChB;AAGG2B,QAAAA,mBAAmBlC,MAAAA,QAAQ,MAAM;AACrC,WAAO7C,eAAAA,QAAMC,SAASE,IAAIN,UAAU,CAACO,OAAY6C,MAAM;;AACrD,YAAMxC,kBAAkBmC,cAAcK;AAE/BjD,aAAAA,eAAAA,QAAMgF,aAAa5E,OAAO;AAAA,QAC/B6E,MAAM;AAAA,QACN1E,UAAUE;AAAAA,QACVyE,SAAUP,CACRJ,QAAAA;;AAAAA,0CAAyBtB,IAAG7C,MAAAA,+BAAOE,UAAPF,gBAAAA,IAAc8E,SAASP,GAAG;AAAA;AAAA,QACxDpD,UAAUA,cAAYnB,oCAAOE,UAAPF,mBAAcmB;AAAAA,MAAAA,CACrC;AAAA,IAAA,CACF;AAAA,KACA,CAAC1B,UAAU0B,UAAUgD,0BAA0B3B,aAAa,CAAC;AAM1DuC,QAAAA,eACJnD,oBAAoB,SAClBF,WAAWtB,UAAauB,kBAAkBvB,UACzCsB,WAAWtB,UAAaa;AAE7B,QAAM+D,iBAAiBD,eACnBE,MAAAA,MAAMjD,WAAW,OAAO,IACxBJ;AAEJ,QAAMsD,SAAU9D,SAAS6D,MAAAA,MAAMjD,WAAW,SAAS,KAAM;AAEzD,yCACGmD,qBACC,mBAAA,EAAA,IACA,MACA,QAAQ/C,iBACR,UACA,UACA,UACA,WAAWgD,cAAAA,QAAKvE,WAAWwE,qBAAAA,QAAqBC,MAAM1E,mCAAS0E,IAAI,GAElElE,UAAAA;AAAAA,IAAAA,SACEmE,2BAAA,IAAAC,qBAAA,aAAA,EACC,IAAIP,MAAAA,MAAMjD,WAAW,OAAO,GAC5B,OACA,WAAWoD,cAAAA,QAAKC,qBAAAA,QAAqBjE,OAAOR,mCAASQ,KAAK,GAE7D;AAAA,IACAG,eACCgE,2BAAA,IAACE,wCACC,EAAA,IAAIR,YAAMjD,WAAW,aAAa,GAClC,WAAWoD,sBACTC,qBAAqB9D,QAAAA,aACrBX,mCAASW,WAAW,GAGrBA,UACH,aAAA;AAAA,IAGFgE,+BAACG,qBAAAA,uBACC,IAAIR,QACJ,aAAW,MACX,WAAS,MACT,MAAK,WACL,wBAAsBxF,YAAYU,QAClC,cAAYiB,WACZ,mBACE,CAACD,SAAS6D,MAAAA,MAAMjD,WAAW,OAAO,GAAGV,cAAc,EAChDqE,KAAK,GAAG,EACRC,UAAUxF,QAEf,gBAAcgC,oBAAoB,YAAY,OAAOhC,QACrD,qBACEgC,oBAAoB,YAAY4C,iBAAiB5E,QAEnD,oBACE,CAACmB,eAAe0D,YAAMjD,WAAW,aAAa,GAAGR,eAAe,EAC7DmE,KAAK,GAAG,EACRC,KAAAA,KAAUxF,QAEf,WAAWgF,sBACTxE,mCAASiF,SACTR,6BAAqBQ,SACrBhE,gBAAgB,cACduD,cAAAA,QAAKC,qBAAAA,QAAqBS,UAAUlF,mCAASkF,QAAQ,GACvDjE,gBAAgB,gBACduD,cAAAA,QAAKC,qBAAAA,QAAqBU,YAAYnF,mCAASmF,UAAU,GAC3D3D,oBAAoB,aAClBgD,sBAAKC,qBAAAA,QAAqBW,SAASpF,mCAASoF,OAAO,CAAC,GAExD,KAAK9C,eACL,cAAcrB,aACd,kBAAkBO,iBACdL,GAAAA,QAEH4C,UACH,kBAAA;AAAA,IAECI,gBACEQ,2BAAAA,IAAAU,qBAAAA,aAAA,EACC,IAAIhB,MAAAA,MAAMjD,WAAW,OAAO,GAC5B,eAAa,MACb,WAAWoD,cAAAA,QAAKC,qBAAAA,QAAqBa,OAAOtF,mCAASsF,KAAK,GAEzD5D,UACH,mBAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;;"}