@hitachivantara/uikit-react-core 5.61.0 → 5.62.1

package/dist/cjs/BaseRadio/BaseRadio.styles.cjs

@@ -1,25 +1,33 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const focusUtils = require("../utils/focusUtils.cjs");
 const classes = require("../utils/classes.cjs");
+const focusUtils = require("../utils/focusUtils.cjs");
 const { staticClasses, useClasses } = classes.createClasses("HvBaseRadio", {
   root: {
     padding: 0,
+    width: 32,
+    minWidth: 32,
+    height: 32,
     cursor: "pointer",
     "&:hover": {
       backgroundColor: uikitStyles.theme.colors.containerBackgroundHover,
       borderRadius: uikitStyles.theme.radii.base
     },
+    "& svg": {
+      width: 16,
+      height: 16,
+      borderRadius: uikitStyles.theme.radii.circle,
+      border: `1px solid ${uikitStyles.theme.colors.secondary}`
+    },
     borderRadius: 0
   },
   disabled: {
     cursor: "not-allowed",
     pointerEvents: "initial",
     "& svg": {
-      "& path:nth-of-type(2)": {
-        fill: uikitStyles.theme.colors.secondary_60
-      }
+      border: `1px solid ${uikitStyles.theme.colors.secondary_60}`,
+      backgroundColor: uikitStyles.theme.colors.atmo3
     }
   },
   focusVisible: {
@@ -28,7 +36,34 @@ const { staticClasses, useClasses } = classes.createClasses("HvBaseRadio", {
       ...focusUtils.outlineStyles
     }
   },
-  icon: {}
+  icon: {},
+  checked: {
+    "& svg": {
+      border: `1px solid ${uikitStyles.theme.colors.secondary}`,
+      backgroundColor: uikitStyles.theme.colors.secondary,
+      color: uikitStyles.theme.colors.atmo2
+    },
+    "&$semantic": {
+      "& svg": {
+        border: `1px solid ${uikitStyles.theme.colors.base_dark}`,
+        backgroundColor: uikitStyles.theme.colors.base_light,
+        color: uikitStyles.theme.colors.base_dark
+      }
+    },
+    "&$disabled": {
+      "& svg": {
+        border: `1px solid ${uikitStyles.theme.colors.secondary_60}`,
+        backgroundColor: uikitStyles.theme.colors.secondary_60,
+        color: uikitStyles.theme.colors.atmo3
+      }
+    }
+  },
+  semantic: {
+    "& svg": {
+      border: `1px solid ${uikitStyles.theme.colors.base_dark}`,
+      backgroundColor: uikitStyles.theme.colors.base_light
+    }
+  }
 });
 exports.staticClasses = staticClasses;
 exports.useClasses = useClasses;

package/dist/cjs/BaseRadio/BaseRadio.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BaseRadio.styles.cjs","sources":["../../../src/BaseRadio/BaseRadio.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseRadio\", {\n  root: {\n    padding: 0,\n    cursor: \"pointer\",\n    \"&:hover\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n      borderRadius: theme.radii.base,\n    },\n    borderRadius: 0,\n  },\n  disabled: {\n    cursor: \"not-allowed\",\n    pointerEvents: \"initial\",\n    \"& svg\": {\n      \"& path:nth-of-type(2)\": {\n        fill: theme.colors.secondary_60,\n      },\n    },\n  },\n  focusVisible: {\n    \"& svg\": {\n      borderRadius: \"8px\",\n      ...outlineStyles,\n    },\n  },\n  icon: {},\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;;;AAKO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,eAAe;AAAA,EACxE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,WAAW;AAAA,MACT,iBAAiBC,YAAAA,MAAM,OAAO;AAAA,MAC9B,cAAcA,YAAAA,MAAM,MAAM;AAAA,IAC5B;AAAA,IACA,cAAc;AAAA,EAChB;AAAA,EACA,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,eAAe;AAAA,IACf,SAAS;AAAA,MACP,yBAAyB;AAAA,QACvB,MAAMA,YAAAA,MAAM,OAAO;AAAA,MACrB;AAAA,IACF;AAAA,EACF;AAAA,EACA,cAAc;AAAA,IACZ,SAAS;AAAA,MACP,cAAc;AAAA,MACd,GAAGC,WAAA;AAAA,IACL;AAAA,EACF;AAAA,EACA,MAAM,CAAC;AACT,CAAC;;;"}
+{"version":3,"file":"BaseRadio.styles.cjs","sources":["../../../src/BaseRadio/BaseRadio.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\nimport { outlineStyles } from \"../utils/focusUtils\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseRadio\", {\n  root: {\n    padding: 0,\n    width: 32,\n    minWidth: 32,\n    height: 32,\n    cursor: \"pointer\",\n    \"&:hover\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n      borderRadius: theme.radii.base,\n    },\n    \"& svg\": {\n      width: 16,\n      height: 16,\n      borderRadius: theme.radii.circle,\n      border: `1px solid ${theme.colors.secondary}`,\n    },\n    borderRadius: 0,\n  },\n  disabled: {\n    cursor: \"not-allowed\",\n    pointerEvents: \"initial\",\n    \"& svg\": {\n      border: `1px solid ${theme.colors.secondary_60}`,\n      backgroundColor: theme.colors.atmo3,\n    },\n  },\n  focusVisible: {\n    \"& svg\": {\n      borderRadius: \"8px\",\n      ...outlineStyles,\n    },\n  },\n  icon: {},\n  checked: {\n    \"& svg\": {\n      border: `1px solid ${theme.colors.secondary}`,\n      backgroundColor: theme.colors.secondary,\n      color: theme.colors.atmo2,\n    },\n    \"&$semantic\": {\n      \"& svg\": {\n        border: `1px solid ${theme.colors.base_dark}`,\n        backgroundColor: theme.colors.base_light,\n        color: theme.colors.base_dark,\n      },\n    },\n    \"&$disabled\": {\n      \"& svg\": {\n        border: `1px solid ${theme.colors.secondary_60}`,\n        backgroundColor: theme.colors.secondary_60,\n        color: theme.colors.atmo3,\n      },\n    },\n  },\n  semantic: {\n    \"& svg\": {\n      border: `1px solid ${theme.colors.base_dark}`,\n      backgroundColor: theme.colors.base_light,\n    },\n  },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;;;AAKO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,eAAe;AAAA,EACxE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,WAAW;AAAA,MACT,iBAAiBC,YAAAA,MAAM,OAAO;AAAA,MAC9B,cAAcA,YAAAA,MAAM,MAAM;AAAA,IAC5B;AAAA,IACA,SAAS;AAAA,MACP,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,cAAcA,YAAAA,MAAM,MAAM;AAAA,MAC1B,QAAQ,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,IAC7C;AAAA,IACA,cAAc;AAAA,EAChB;AAAA,EACA,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,eAAe;AAAA,IACf,SAAS;AAAA,MACP,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,MAC9C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,EACF;AAAA,EACA,cAAc;AAAA,IACZ,SAAS;AAAA,MACP,cAAc;AAAA,MACd,GAAGC,WAAA;AAAA,IACL;AAAA,EACF;AAAA,EACA,MAAM,CAAC;AAAA,EACP,SAAS;AAAA,IACP,SAAS;AAAA,MACP,QAAQ,aAAaD,YAAM,MAAA,OAAO,SAAS;AAAA,MAC3C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAC9B,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,cAAc;AAAA,MACZ,SAAS;AAAA,QACP,QAAQ,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,QAC3C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,QAC9B,OAAOA,YAAAA,MAAM,OAAO;AAAA,MACtB;AAAA,IACF;AAAA,IACA,cAAc;AAAA,MACZ,SAAS;AAAA,QACP,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,QAC9C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,QAC9B,OAAOA,YAAAA,MAAM,OAAO;AAAA,MACtB;AAAA,IACF;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,QAAQ,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,MAC3C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,EACF;AACF,CAAC;;;"}

package/dist/cjs/BaseRadio/icons.cjs

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const Selected = () => {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      d: "m7,11a4,4 0 0 1 -4,-4a4,4 0 0 1 4,-4a4,4 0 0 1 4,4a4,4 0 0 1 -4,4",
+      fill: "currentcolor"
+    }
+  ) });
+};
+const Unselected = () => {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", xmlns: "http://www.w3.org/2000/svg" });
+};
+exports.Selected = Selected;
+exports.Unselected = Unselected;

package/dist/cjs/BaseRadio/icons.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"icons.cjs","sources":["../../../src/BaseRadio/icons.tsx"],"sourcesContent":["export const Selected = () => {\n  return (\n    <svg width=\"14\" height=\"14\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        d=\"m7,11a4,4 0 0 1 -4,-4a4,4 0 0 1 4,-4a4,4 0 0 1 4,4a4,4 0 0 1 -4,4\"\n        fill=\"currentcolor\"\n      />\n    </svg>\n  );\n};\n\nexport const Unselected = () => {\n  return <svg width=\"14\" height=\"14\" xmlns=\"http://www.w3.org/2000/svg\" />;\n};\n"],"names":["jsx"],"mappings":";;;AAAO,MAAM,WAAW,MAAM;AAC5B,wCACG,OAAI,EAAA,OAAM,MAAK,QAAO,MAAK,OAAM,8BAChC,UAAAA,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA,IAAA;AAAA,EAET,EAAA,CAAA;AAEJ;AAEO,MAAM,aAAa,MAAM;AAC9B,wCAAQ,OAAI,EAAA,OAAM,MAAK,QAAO,MAAK,OAAM,6BAA6B,CAAA;AACxE;;;"}

package/dist/cjs/BaseSwitch/BaseSwitch.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BaseSwitch.cjs","sources":["../../../src/BaseSwitch/BaseSwitch.tsx"],"sourcesContent":["import { useState, useCallback, forwardRef } from \"react\";\n\nimport MuiSwitch, { SwitchProps as MuiSwitchProps } from \"@mui/material/Switch\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { useClasses, staticClasses } from \"./BaseSwitch.styles\";\n\nexport { staticClasses as baseSwitchClasses };\n\nexport type HvBaseSwitchClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBaseSwitchProps\n  extends Omit<MuiSwitchProps, \"onChange\" | \"classes\"> {\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 switch.\n   */\n  classes?: HvBaseSwitchClasses;\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * The input name.\n   */\n  name?: string;\n  /**\n   * The value of the input.\n   *\n   * Is up to the application's logic when to consider the submission of this value.\n   * Generally it should be used only when the switch is neither unchecked nor indeterminate.\n   *\n   * The default value is \"on\".\n   */\n  value?: any;\n  /**\n   * Indicates that user input is required.\n   */\n  required?: boolean;\n  /**\n   * Indicates that the input is not editable.\n   */\n  readOnly?: boolean;\n  /**\n   * Indicates that the input is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If `true` the switch is selected, if set to `false` the switch is not selected.\n   *\n   * When defined the switch state becomes controlled.\n   */\n  checked?: boolean;\n  /**\n   * When uncontrolled, defines the initial checked state.\n   */\n  defaultChecked?: boolean;\n  /**\n   * The callback fired when the switch is pressed.\n   */\n  onChange?: (event: React.ChangeEvent, checked: boolean, value: any) => void;\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 Switch is <b>binary</b> and work as a digital on/off button.\n *\n * The Base Switch is a building block of the Switch form element. Don't use unless\n * implementing a custom use case not covered by the Switch form element.\n */\nexport const HvBaseSwitch = forwardRef<HTMLButtonElement, HvBaseSwitchProps>(\n  (props, ref) => {\n    const {\n      classes: classesProp,\n      className,\n\n      id,\n      name,\n      value = \"on\",\n\n      required = false,\n      readOnly = false,\n      disabled = false,\n\n      checked,\n      defaultChecked,\n\n      onChange,\n\n      inputProps,\n\n      onFocusVisible,\n      onBlur,\n\n      ...others\n    } = useDefaultProps(\"HvBaseSwitch\", props);\n\n    const { classes, cx } = useClasses(classesProp);\n\n    const [focusVisible, setFocusVisible] = useState(false);\n\n    const onFocusVisibleCallback = useCallback(\n      (evt: React.FocusEvent<any, Element>) => {\n        setFocusVisible(true);\n        onFocusVisible?.(evt);\n      },\n      [onFocusVisible]\n    );\n\n    const onBlurCallback = useCallback(\n      (evt: React.FocusEvent<any, Element>) => {\n        setFocusVisible(false);\n        onBlur?.(evt);\n      },\n      [onBlur]\n    );\n\n    const onLocalChange = useCallback(\n      (evt: React.ChangeEvent<HTMLInputElement>) => {\n        if (readOnly) {\n          return;\n        }\n\n        onChange?.(evt, evt.target.checked, value);\n      },\n      [onChange, readOnly, value]\n    );\n\n    return (\n      <MuiSwitch\n        ref={ref}\n        id={id}\n        name={name}\n        className={cx(\n          classes.root,\n          {\n            [classes.disabled]: disabled,\n            [classes.readOnly]: readOnly,\n            [classes.focusVisible]: focusVisible,\n          },\n          className\n        )}\n        color=\"default\"\n        disabled={disabled}\n        required={required}\n        readOnly={readOnly}\n        disableRipple\n        onChange={onLocalChange}\n        value={value}\n        checked={checked}\n        defaultChecked={defaultChecked}\n        classes={{\n          root: classes.switch,\n          switchBase: classes.switchBase,\n          checked: classes.checked,\n          track: classes.track,\n          thumb: classes.thumb,\n          disabled: classes.disabled,\n        }}\n        inputProps={inputProps}\n        onFocusVisible={onFocusVisibleCallback}\n        onBlur={onBlurCallback}\n        {...others}\n      />\n    );\n  }\n);\n"],"names":["forwardRef","useDefaultProps","useClasses","useState","useCallback","jsx","MuiSwitch"],"mappings":";;;;;;;;;AAuFO,MAAM,eAAeA,MAAA;AAAA,EAC1B,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ,SAAS;AAAA,MACT;AAAA,MAEA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,MAER,WAAW;AAAA,MACX,WAAW;AAAA,MACX,WAAW;AAAA,MAEX;AAAA,MACA;AAAA,MAEA;AAAA,MAEA;AAAA,MAEA;AAAA,MACA;AAAA,MAEA,GAAG;AAAA,IAAA,IACDC,gBAAgB,gBAAA,gBAAgB,KAAK;AAEzC,UAAM,EAAE,SAAS,GAAG,IAAIC,6BAAW,WAAW;AAE9C,UAAM,CAAC,cAAc,eAAe,IAAIC,eAAS,KAAK;AAEtD,UAAM,yBAAyBC,MAAA;AAAA,MAC7B,CAAC,QAAwC;AACvC,wBAAgB,IAAI;AACpB,yBAAiB,GAAG;AAAA,MACtB;AAAA,MACA,CAAC,cAAc;AAAA,IAAA;AAGjB,UAAM,iBAAiBA,MAAA;AAAA,MACrB,CAAC,QAAwC;AACvC,wBAAgB,KAAK;AACrB,iBAAS,GAAG;AAAA,MACd;AAAA,MACA,CAAC,MAAM;AAAA,IAAA;AAGT,UAAM,gBAAgBA,MAAA;AAAA,MACpB,CAAC,QAA6C;AAC5C,YAAI,UAAU;AACZ;AAAA,QACF;AAEA,mBAAW,KAAK,IAAI,OAAO,SAAS,KAAK;AAAA,MAC3C;AAAA,MACA,CAAC,UAAU,UAAU,KAAK;AAAA,IAAA;AAI1B,WAAAC,2BAAA;AAAA,MAACC,mBAAA;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,UACR;AAAA,YACE,CAAC,QAAQ,QAAQ,GAAG;AAAA,YACpB,CAAC,QAAQ,QAAQ,GAAG;AAAA,YACpB,CAAC,QAAQ,YAAY,GAAG;AAAA,UAC1B;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAa;AAAA,QACb,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAS;AAAA,UACP,MAAM,QAAQ;AAAA,UACd,YAAY,QAAQ;AAAA,UACpB,SAAS,QAAQ;AAAA,UACjB,OAAO,QAAQ;AAAA,UACf,OAAO,QAAQ;AAAA,UACf,UAAU,QAAQ;AAAA,QACpB;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAChB,QAAQ;AAAA,QACP,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;;;"}
+{"version":3,"file":"BaseSwitch.cjs","sources":["../../../src/BaseSwitch/BaseSwitch.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\nimport MuiSwitch, { SwitchProps as MuiSwitchProps } from \"@mui/material/Switch\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./BaseSwitch.styles\";\n\nexport { staticClasses as baseSwitchClasses };\n\nexport type HvBaseSwitchClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBaseSwitchProps\n  extends Omit<MuiSwitchProps, \"onChange\" | \"classes\"> {\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 switch.\n   */\n  classes?: HvBaseSwitchClasses;\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * The input name.\n   */\n  name?: string;\n  /**\n   * The value of the input.\n   *\n   * Is up to the application's logic when to consider the submission of this value.\n   * Generally it should be used only when the switch is neither unchecked nor indeterminate.\n   *\n   * The default value is \"on\".\n   */\n  value?: any;\n  /**\n   * Indicates that user input is required.\n   */\n  required?: boolean;\n  /**\n   * Indicates that the input is not editable.\n   */\n  readOnly?: boolean;\n  /**\n   * Indicates that the input is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If `true` the switch is selected, if set to `false` the switch is not selected.\n   *\n   * When defined the switch state becomes controlled.\n   */\n  checked?: boolean;\n  /**\n   * When uncontrolled, defines the initial checked state.\n   */\n  defaultChecked?: boolean;\n  /**\n   * The callback fired when the switch is pressed.\n   */\n  onChange?: (event: React.ChangeEvent, checked: boolean, value: any) => void;\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 Switch is <b>binary</b> and work as a digital on/off button.\n *\n * The Base Switch is a building block of the Switch form element. Don't use unless\n * implementing a custom use case not covered by the Switch form element.\n */\nexport const HvBaseSwitch = forwardRef<HTMLButtonElement, HvBaseSwitchProps>(\n  (props, ref) => {\n    const {\n      classes: classesProp,\n      className,\n\n      id,\n      name,\n      value = \"on\",\n\n      required = false,\n      readOnly = false,\n      disabled = false,\n\n      checked,\n      defaultChecked,\n\n      onChange,\n\n      inputProps,\n\n      onFocusVisible,\n      onBlur,\n\n      ...others\n    } = useDefaultProps(\"HvBaseSwitch\", props);\n\n    const { classes, cx } = useClasses(classesProp);\n\n    const [focusVisible, setFocusVisible] = useState(false);\n\n    const onFocusVisibleCallback = useCallback(\n      (evt: React.FocusEvent<any, Element>) => {\n        setFocusVisible(true);\n        onFocusVisible?.(evt);\n      },\n      [onFocusVisible],\n    );\n\n    const onBlurCallback = useCallback(\n      (evt: React.FocusEvent<any, Element>) => {\n        setFocusVisible(false);\n        onBlur?.(evt);\n      },\n      [onBlur],\n    );\n\n    const onLocalChange = useCallback(\n      (evt: React.ChangeEvent<HTMLInputElement>) => {\n        if (readOnly) {\n          return;\n        }\n\n        onChange?.(evt, evt.target.checked, value);\n      },\n      [onChange, readOnly, value],\n    );\n\n    return (\n      <MuiSwitch\n        ref={ref}\n        id={id}\n        name={name}\n        className={cx(\n          classes.root,\n          {\n            [classes.disabled]: disabled,\n            [classes.readOnly]: readOnly,\n            [classes.focusVisible]: focusVisible,\n          },\n          className,\n        )}\n        color=\"default\"\n        disabled={disabled}\n        required={required}\n        readOnly={readOnly}\n        disableRipple\n        onChange={onLocalChange}\n        value={value}\n        checked={checked}\n        defaultChecked={defaultChecked}\n        classes={{\n          root: classes.switch,\n          switchBase: classes.switchBase,\n          checked: classes.checked,\n          track: classes.track,\n          thumb: classes.thumb,\n          disabled: classes.disabled,\n        }}\n        inputProps={inputProps}\n        onFocusVisible={onFocusVisibleCallback}\n        onBlur={onBlurCallback}\n        {...others}\n      />\n    );\n  },\n);\n"],"names":["forwardRef","useDefaultProps","useClasses","useState","useCallback","jsx","MuiSwitch"],"mappings":";;;;;;;;;AAqFO,MAAM,eAAeA,MAAA;AAAA,EAC1B,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ,SAAS;AAAA,MACT;AAAA,MAEA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,MAER,WAAW;AAAA,MACX,WAAW;AAAA,MACX,WAAW;AAAA,MAEX;AAAA,MACA;AAAA,MAEA;AAAA,MAEA;AAAA,MAEA;AAAA,MACA;AAAA,MAEA,GAAG;AAAA,IAAA,IACDC,gBAAgB,gBAAA,gBAAgB,KAAK;AAEzC,UAAM,EAAE,SAAS,GAAG,IAAIC,6BAAW,WAAW;AAE9C,UAAM,CAAC,cAAc,eAAe,IAAIC,eAAS,KAAK;AAEtD,UAAM,yBAAyBC,MAAA;AAAA,MAC7B,CAAC,QAAwC;AACvC,wBAAgB,IAAI;AACpB,yBAAiB,GAAG;AAAA,MACtB;AAAA,MACA,CAAC,cAAc;AAAA,IAAA;AAGjB,UAAM,iBAAiBA,MAAA;AAAA,MACrB,CAAC,QAAwC;AACvC,wBAAgB,KAAK;AACrB,iBAAS,GAAG;AAAA,MACd;AAAA,MACA,CAAC,MAAM;AAAA,IAAA;AAGT,UAAM,gBAAgBA,MAAA;AAAA,MACpB,CAAC,QAA6C;AAC5C,YAAI,UAAU;AACZ;AAAA,QACF;AAEA,mBAAW,KAAK,IAAI,OAAO,SAAS,KAAK;AAAA,MAC3C;AAAA,MACA,CAAC,UAAU,UAAU,KAAK;AAAA,IAAA;AAI1B,WAAAC,2BAAA;AAAA,MAACC,mBAAA;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,UACR;AAAA,YACE,CAAC,QAAQ,QAAQ,GAAG;AAAA,YACpB,CAAC,QAAQ,QAAQ,GAAG;AAAA,YACpB,CAAC,QAAQ,YAAY,GAAG;AAAA,UAC1B;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAa;AAAA,QACb,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAS;AAAA,UACP,MAAM,QAAQ;AAAA,UACd,YAAY,QAAQ;AAAA,UACpB,SAAS,QAAQ;AAAA,UACjB,OAAO,QAAQ;AAAA,UACf,OAAO,QAAQ;AAAA,UACf,UAAU,QAAQ;AAAA,QACpB;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAChB,QAAQ;AAAA,QACP,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;;;"}

package/dist/cjs/BaseSwitch/BaseSwitch.styles.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const focusUtils = require("../utils/focusUtils.cjs");
 const classes = require("../utils/classes.cjs");
+const focusUtils = require("../utils/focusUtils.cjs");
 const { staticClasses, useClasses } = classes.createClasses("HvBaseSwitch", {
   root: {
     padding: 0,

package/dist/cjs/BaseSwitch/BaseSwitch.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BaseSwitch.styles.cjs","sources":["../../../src/BaseSwitch/BaseSwitch.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseSwitch\", {\n  root: {\n    padding: 0,\n    cursor: \"pointer\",\n    width: \"40px\",\n    height: \"32px\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    borderRadius: theme.radii.base,\n\n    \"&:hover\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n    },\n\n    // Higher CSS specificity here\n    \"& $switchBase\": {\n      \"&:hover\": {\n        backgroundColor: \"transparent\",\n      },\n\n      \"&$checked\": {\n        transform: \"translateX(16px)\",\n        \"& + $track\": {\n          opacity: 1,\n          backgroundColor: theme.colors.secondary,\n        },\n        \"&:hover\": {\n          backgroundColor: \"transparent\",\n        },\n      },\n    },\n\n    // Higher CSS specificity here\n    \"&$disabled\": {\n      \"& $switchBase\": {\n        \"& + $track\": {\n          opacity: 1,\n          backgroundColor: theme.colors.atmo3,\n          border: `solid 1px ${theme.colors.secondary_60}`,\n        },\n      },\n    },\n  },\n  switch: {\n    width: \"40px\",\n    height: \"32px\",\n    padding: 0,\n\n    \"&$readOnly $switchBase\": {\n      cursor: \"default\",\n    },\n  },\n  switchBase: {\n    width: \"40px\",\n    height: \"32px\",\n    padding: 0,\n  },\n  track: {\n    opacity: 1,\n    borderRadius: \"15px\",\n    height: \"16px\",\n    width: \"32px\",\n    border: `solid 1px ${theme.colors.secondary}`,\n    backgroundColor: theme.colors.atmo1,\n  },\n  thumb: {\n    position: \"relative\",\n    left: \"-9px\",\n    width: \"12px\",\n    height: \"12px\",\n    border: `solid 1px ${theme.colors.secondary}`,\n    backgroundColor: theme.colors.atmo1,\n    marginLeft: \"2px\",\n    marginTop: 0,\n    boxShadow: \"none\",\n  },\n  checked: {},\n  disabled: {\n    cursor: \"not-allowed\",\n\n    \"& $switch\": {\n      cursor: \"not-allowed\",\n    },\n\n    \"& $thumb\": {\n      backgroundColor: theme.colors.atmo3,\n      border: `solid 1px ${theme.colors.secondary_60}`,\n    },\n  },\n  readOnly: {},\n  focusVisible: {\n    borderRadius: \"8px\",\n    ...outlineStyles,\n  },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;;;AAKO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,cAAcC,YAAAA,MAAM,MAAM;AAAA,IAE1B,WAAW;AAAA,MACT,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA;AAAA,IAGA,iBAAiB;AAAA,MACf,WAAW;AAAA,QACT,iBAAiB;AAAA,MACnB;AAAA,MAEA,aAAa;AAAA,QACX,WAAW;AAAA,QACX,cAAc;AAAA,UACZ,SAAS;AAAA,UACT,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,QAChC;AAAA,QACA,WAAW;AAAA,UACT,iBAAiB;AAAA,QACnB;AAAA,MACF;AAAA,IACF;AAAA;AAAA,IAGA,cAAc;AAAA,MACZ,iBAAiB;AAAA,QACf,cAAc;AAAA,UACZ,SAAS;AAAA,UACT,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,UAC9B,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,QAChD;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EACA,QAAQ;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,IAET,0BAA0B;AAAA,MACxB,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,OAAO;AAAA,IACL,SAAS;AAAA,IACT,cAAc;AAAA,IACd,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,QAAQ,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,IAC3C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,OAAO;AAAA,IACL,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,QAAQ,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,IAC3C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAC9B,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,EACb;AAAA,EACA,SAAS,CAAC;AAAA,EACV,UAAU;AAAA,IACR,QAAQ;AAAA,IAER,aAAa;AAAA,MACX,QAAQ;AAAA,IACV;AAAA,IAEA,YAAY;AAAA,MACV,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAC9B,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,IAChD;AAAA,EACF;AAAA,EACA,UAAU,CAAC;AAAA,EACX,cAAc;AAAA,IACZ,cAAc;AAAA,IACd,GAAGC,WAAA;AAAA,EACL;AACF,CAAC;;;"}
+{"version":3,"file":"BaseSwitch.styles.cjs","sources":["../../../src/BaseSwitch/BaseSwitch.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\nimport { outlineStyles } from \"../utils/focusUtils\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseSwitch\", {\n  root: {\n    padding: 0,\n    cursor: \"pointer\",\n    width: \"40px\",\n    height: \"32px\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    borderRadius: theme.radii.base,\n\n    \"&:hover\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n    },\n\n    // Higher CSS specificity here\n    \"& $switchBase\": {\n      \"&:hover\": {\n        backgroundColor: \"transparent\",\n      },\n\n      \"&$checked\": {\n        transform: \"translateX(16px)\",\n        \"& + $track\": {\n          opacity: 1,\n          backgroundColor: theme.colors.secondary,\n        },\n        \"&:hover\": {\n          backgroundColor: \"transparent\",\n        },\n      },\n    },\n\n    // Higher CSS specificity here\n    \"&$disabled\": {\n      \"& $switchBase\": {\n        \"& + $track\": {\n          opacity: 1,\n          backgroundColor: theme.colors.atmo3,\n          border: `solid 1px ${theme.colors.secondary_60}`,\n        },\n      },\n    },\n  },\n  switch: {\n    width: \"40px\",\n    height: \"32px\",\n    padding: 0,\n\n    \"&$readOnly $switchBase\": {\n      cursor: \"default\",\n    },\n  },\n  switchBase: {\n    width: \"40px\",\n    height: \"32px\",\n    padding: 0,\n  },\n  track: {\n    opacity: 1,\n    borderRadius: \"15px\",\n    height: \"16px\",\n    width: \"32px\",\n    border: `solid 1px ${theme.colors.secondary}`,\n    backgroundColor: theme.colors.atmo1,\n  },\n  thumb: {\n    position: \"relative\",\n    left: \"-9px\",\n    width: \"12px\",\n    height: \"12px\",\n    border: `solid 1px ${theme.colors.secondary}`,\n    backgroundColor: theme.colors.atmo1,\n    marginLeft: \"2px\",\n    marginTop: 0,\n    boxShadow: \"none\",\n  },\n  checked: {},\n  disabled: {\n    cursor: \"not-allowed\",\n\n    \"& $switch\": {\n      cursor: \"not-allowed\",\n    },\n\n    \"& $thumb\": {\n      backgroundColor: theme.colors.atmo3,\n      border: `solid 1px ${theme.colors.secondary_60}`,\n    },\n  },\n  readOnly: {},\n  focusVisible: {\n    borderRadius: \"8px\",\n    ...outlineStyles,\n  },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;;;AAKO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,cAAcC,YAAAA,MAAM,MAAM;AAAA,IAE1B,WAAW;AAAA,MACT,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA;AAAA,IAGA,iBAAiB;AAAA,MACf,WAAW;AAAA,QACT,iBAAiB;AAAA,MACnB;AAAA,MAEA,aAAa;AAAA,QACX,WAAW;AAAA,QACX,cAAc;AAAA,UACZ,SAAS;AAAA,UACT,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,QAChC;AAAA,QACA,WAAW;AAAA,UACT,iBAAiB;AAAA,QACnB;AAAA,MACF;AAAA,IACF;AAAA;AAAA,IAGA,cAAc;AAAA,MACZ,iBAAiB;AAAA,QACf,cAAc;AAAA,UACZ,SAAS;AAAA,UACT,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,UAC9B,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,QAChD;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EACA,QAAQ;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,IAET,0BAA0B;AAAA,MACxB,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,OAAO;AAAA,IACL,SAAS;AAAA,IACT,cAAc;AAAA,IACd,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,QAAQ,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,IAC3C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,OAAO;AAAA,IACL,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,QAAQ,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,IAC3C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAC9B,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,EACb;AAAA,EACA,SAAS,CAAC;AAAA,EACV,UAAU;AAAA,IACR,QAAQ;AAAA,IAER,aAAa;AAAA,MACX,QAAQ;AAAA,IACV;AAAA,IAEA,YAAY;AAAA,MACV,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAC9B,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,IAChD;AAAA,EACF;AAAA,EACA,UAAU,CAAC;AAAA,EACX,cAAc;AAAA,IACZ,cAAc;AAAA,IACd,GAAGC,WAAA;AAAA,EACL;AACF,CAAC;;;"}

package/dist/cjs/Box/Box.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Box.cjs","sources":["../../../src/Box/Box.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { HvTheme, theme } from \"@hitachivantara/uikit-styles\";\n\nimport { PolymorphicComponentRef, PolymorphicRef } from \"../types/generic\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\ntype SxProps = React.CSSProperties | ((theme: HvTheme) => React.CSSProperties);\n\ntype HvBoxBaseProps<C extends React.ElementType> = PolymorphicComponentRef<\n  C,\n  { style?: React.CSSProperties; sx?: SxProps }\n>;\n\n// v6 - This shouldn't be named HvBoxProps\nexport type HvBoxProps = <C extends React.ElementType = \"div\">(\n  props: HvBoxBaseProps<C>\n) => React.ReactElement | null;\n\nconst sxFn = (sx: SxProps) => {\n  return typeof sx === \"function\" ? sx(theme) : sx;\n};\n\n/**\n * Customizable layout component that can be used to wrap other components.\n * It can be used to add styles to the wrapped components.\n * It can also be used to create a layout using the flexbox properties.\n */\nexport const HvBox: HvBoxProps = forwardRef(\n  <C extends React.ElementType = \"div\">(\n    props: HvBoxBaseProps<C>,\n    ref?: PolymorphicRef<C>\n  ) => {\n    const {\n      style,\n      component: Component = \"div\",\n      sx,\n      children,\n      classes,\n      ...restProps\n    } = useDefaultProps(\"HvBox\", props);\n\n    return (\n      <Component style={sx ? sxFn(sx) : style} ref={ref} {...restProps}>\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["theme","forwardRef","useDefaultProps","jsx"],"mappings":";;;;;;AAkBA,MAAM,OAAO,CAAC,OAAgB;AAC5B,SAAO,OAAO,OAAO,aAAa,GAAGA,YAAK,KAAA,IAAI;AAChD;AAOO,MAAM,QAAoBC,MAAA;AAAA,EAC/B,CACE,OACA,QACG;AACG,UAAA;AAAA,MACJ;AAAA,MACA,WAAW,YAAY;AAAA,MACvB;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IAAA,IACDC,gBAAgB,gBAAA,SAAS,KAAK;AAGhC,WAAAC,2BAAA,IAAC,WAAU,EAAA,OAAO,KAAK,KAAK,EAAE,IAAI,OAAO,KAAW,GAAG,WACpD,SACH,CAAA;AAAA,EAEJ;AACF;;"}
+{"version":3,"file":"Box.cjs","sources":["../../../src/Box/Box.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { HvTheme, theme } from \"@hitachivantara/uikit-styles\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { PolymorphicComponentRef, PolymorphicRef } from \"../types/generic\";\n\ntype SxProps = React.CSSProperties | ((theme: HvTheme) => React.CSSProperties);\n\ntype HvBoxBaseProps<C extends React.ElementType> = PolymorphicComponentRef<\n  C,\n  { style?: React.CSSProperties; sx?: SxProps }\n>;\n\n// v6 - This shouldn't be named HvBoxProps\nexport type HvBoxProps = <C extends React.ElementType = \"div\">(\n  props: HvBoxBaseProps<C>,\n) => React.ReactElement | null;\n\nconst sxFn = (sx: SxProps) => {\n  return typeof sx === \"function\" ? sx(theme) : sx;\n};\n\n/**\n * Customizable layout component that can be used to wrap other components.\n * It can be used to add styles to the wrapped components.\n * It can also be used to create a layout using the flexbox properties.\n */\nexport const HvBox: HvBoxProps = forwardRef(\n  <C extends React.ElementType = \"div\">(\n    props: HvBoxBaseProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const {\n      style,\n      component: Component = \"div\",\n      sx,\n      children,\n      classes,\n      ...restProps\n    } = useDefaultProps(\"HvBox\", props);\n\n    return (\n      <Component style={sx ? sxFn(sx) : style} ref={ref} {...restProps}>\n        {children}\n      </Component>\n    );\n  },\n);\n"],"names":["theme","forwardRef","useDefaultProps","jsx"],"mappings":";;;;;;AAkBA,MAAM,OAAO,CAAC,OAAgB;AAC5B,SAAO,OAAO,OAAO,aAAa,GAAGA,YAAK,KAAA,IAAI;AAChD;AAOO,MAAM,QAAoBC,MAAA;AAAA,EAC/B,CACE,OACA,QACG;AACG,UAAA;AAAA,MACJ;AAAA,MACA,WAAW,YAAY;AAAA,MACvB;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IAAA,IACDC,gBAAgB,gBAAA,SAAS,KAAK;AAGhC,WAAAC,2BAAA,IAAC,WAAU,EAAA,OAAO,KAAK,KAAK,EAAE,IAAI,OAAO,KAAW,GAAG,WACpD,SACH,CAAA;AAAA,EAEJ;AACF;;"}

package/dist/cjs/BreadCrumb/BreadCrumb.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BreadCrumb.cjs","sources":["../../../src/BreadCrumb/BreadCrumb.tsx"],"sourcesContent":["import { isValidElement } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvDropDownMenuProps } from \"../DropDownMenu\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { HvTypography } from \"../Typography\";\n\nimport { HvPathElement } from \"./PathElement\";\nimport { HvBreadCrumbPage } from \"./Page\";\nimport { staticClasses, useClasses } from \"./BreadCrumb.styles\";\nimport { pathWithSubMenu, removeExtension } from \"./utils\";\nimport { HvBreadCrumbPathElement } from \"./types\";\n\nexport { staticClasses as breadCrumbClasses };\n\nexport type HvBreadCrumbClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBreadCrumbProps\n  extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n  /** List of breadcrumb. */\n  listRoute?: HvBreadCrumbPathElement[];\n  /** URL to build the breadcrumb. */\n  url?: string;\n  /** Number of pages visible. */\n  maxVisible?: number;\n  /** The component used for the link node. Either a string to use a DOM element or a component. */\n  component?: React.ElementType;\n  /** Function passed to the component. If defined the component prop is used as the link node. */\n  onClick?: (event: React.MouseEvent<HTMLElement>, data: any) => void;\n  /** Props passed down to the DropDownMenu sub-menu component. */\n  dropDownMenuProps?: Partial<HvDropDownMenuProps>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvBreadCrumbClasses;\n}\n\n/**\n * A breadcrumb is a graphical control element frequently used as a navigational aid.\n */\nexport const HvBreadCrumb = (props: HvBreadCrumbProps) => {\n  const {\n    classes: classesProp,\n    className,\n    id,\n    listRoute = [],\n    maxVisible,\n    url,\n    onClick,\n    component,\n    dropDownMenuProps,\n    ...others\n  } = useDefaultProps(\"HvBreadCrumb\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const maxVisibleElem = maxVisible && maxVisible < 2 ? 2 : maxVisible;\n  let listPath = listRoute.slice();\n\n  // build the listPath object list\n  if (url != null) {\n    listPath = [];\n\n    // get the domain\n    const baseUrl = url.match(/^.*\\/\\/[^/]+/);\n\n    // get url without domain\n    const urlWithoutDomain = url.replace(/^.*\\/\\/[^/]+/, \"\");\n\n    const pathNames = urlWithoutDomain.split(\"/\").filter((x) => x);\n\n    pathNames.map((elem, index) =>\n      listPath.push({\n        label: decodeURI(elem),\n        path: `${baseUrl}/${pathNames.slice(0, index + 1).join(\"/\")}`,\n      })\n    );\n  }\n\n  const breadcrumbPath =\n    maxVisibleElem && listPath.length > maxVisibleElem\n      ? pathWithSubMenu(\n          id,\n          listPath,\n          maxVisibleElem,\n          onClick,\n          dropDownMenuProps\n        )\n      : listPath;\n\n  return (\n    <nav id={id} className={cx(classes.root, className)} {...others}>\n      <ol className={classes.orderedList}>\n        {listPath.map((elem, index) => {\n          const key = `key_${index}`;\n          const isLast = index === breadcrumbPath.length - 1;\n\n          return (\n            <HvPathElement\n              classes={{\n                centerContainer: classes.centerContainer,\n                separatorContainer: classes.separatorContainer,\n              }}\n              key={key}\n              last={isLast}\n            >\n              {(isValidElement(elem) && elem) ||\n                (isLast && (\n                  <HvTypography className={classes.currentPage} variant=\"body\">\n                    {removeExtension(elem.label)}\n                  </HvTypography>\n                )) || (\n                  <HvBreadCrumbPage\n                    elem={elem}\n                    classes={{\n                      a: classes.a,\n                      link: classes.link,\n                    }}\n                    component={component}\n                    onClick={onClick}\n                  />\n                )}\n            </HvPathElement>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n};\n"],"names":["useDefaultProps","useClasses","pathWithSubMenu","jsx","HvPathElement","HvTypography","removeExtension","HvBreadCrumbPage"],"mappings":";;;;;;;;;;AAuCa,MAAA,eAAe,CAAC,UAA6B;AAClD,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,YAAY,CAAC;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,gBAAgB,KAAK;AAEzC,QAAM,EAAE,SAAS,GAAG,IAAIC,6BAAW,WAAW;AAE9C,QAAM,iBAAiB,cAAc,aAAa,IAAI,IAAI;AACtD,MAAA,WAAW,UAAU;AAGzB,MAAI,OAAO,MAAM;AACf,eAAW,CAAA;AAGL,UAAA,UAAU,IAAI,MAAM,cAAc;AAGxC,UAAM,mBAAmB,IAAI,QAAQ,gBAAgB,EAAE;AAEjD,UAAA,YAAY,iBAAiB,MAAM,GAAG,EAAE,OAAO,CAAC,MAAM,CAAC;AAEnD,cAAA;AAAA,MAAI,CAAC,MAAM,UACnB,SAAS,KAAK;AAAA,QACZ,OAAO,UAAU,IAAI;AAAA,QACrB,MAAM,GAAG,OAAO,IAAI,UAAU,MAAM,GAAG,QAAQ,CAAC,EAAE,KAAK,GAAG,CAAC;AAAA,MAAA,CAC5D;AAAA,IAAA;AAAA,EAEL;AAEA,QAAM,iBACJ,kBAAkB,SAAS,SAAS,iBAChCC,MAAA;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAEF,IAAA;AAGJ,SAAAC,+BAAC,SAAI,IAAQ,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QACvD,UAACA,2BAAAA,IAAA,MAAA,EAAG,WAAW,QAAQ,aACpB,mBAAS,IAAI,CAAC,MAAM,UAAU;AACvB,UAAA,MAAM,OAAO,KAAK;AAClB,UAAA,SAAS,UAAU,eAAe,SAAS;AAG/C,WAAAA,2BAAA;AAAA,MAACC,YAAA;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,UACP,iBAAiB,QAAQ;AAAA,UACzB,oBAAoB,QAAQ;AAAA,QAC9B;AAAA,QAEA,MAAM;AAAA,QAEJ,+BAAe,IAAI,KAAK,QACvB,yCACEC,WAAa,cAAA,EAAA,WAAW,QAAQ,aAAa,SAAQ,QACnD,UAAAC,MAAA,gBAAgB,KAAK,KAAK,EAC7B,CAAA,KAEAH,2BAAA;AAAA,UAACI,KAAA;AAAA,UAAA;AAAA,YACC;AAAA,YACA,SAAS;AAAA,cACP,GAAG,QAAQ;AAAA,cACX,MAAM,QAAQ;AAAA,YAChB;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,MAjBC;AAAA,IAAA;AAAA,EAmBP,CAEH,GACH,EACF,CAAA;AAEJ;;;"}
+{"version":3,"file":"BreadCrumb.cjs","sources":["../../../src/BreadCrumb/BreadCrumb.tsx"],"sourcesContent":["import { isValidElement } from \"react\";\n\nimport { HvDropDownMenuProps } from \"../DropDownMenu\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./BreadCrumb.styles\";\nimport { HvBreadCrumbPage } from \"./Page\";\nimport { HvPathElement } from \"./PathElement\";\nimport { HvBreadCrumbPathElement } from \"./types\";\nimport { pathWithSubMenu, removeExtension } from \"./utils\";\n\nexport { staticClasses as breadCrumbClasses };\n\nexport type HvBreadCrumbClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBreadCrumbProps\n  extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n  /** List of breadcrumb. */\n  listRoute?: HvBreadCrumbPathElement[];\n  /** URL to build the breadcrumb. */\n  url?: string;\n  /** Number of pages visible. */\n  maxVisible?: number;\n  /** The component used for the link node. Either a string to use a DOM element or a component. */\n  component?: React.ElementType;\n  /** Function passed to the component. If defined the component prop is used as the link node. */\n  onClick?: (event: React.MouseEvent<HTMLElement>, data: any) => void;\n  /** Props passed down to the DropDownMenu sub-menu component. */\n  dropDownMenuProps?: Partial<HvDropDownMenuProps>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvBreadCrumbClasses;\n}\n\n/**\n * A breadcrumb is a graphical control element frequently used as a navigational aid.\n */\nexport const HvBreadCrumb = (props: HvBreadCrumbProps) => {\n  const {\n    classes: classesProp,\n    className,\n    id,\n    listRoute = [],\n    maxVisible,\n    url,\n    onClick,\n    component,\n    dropDownMenuProps,\n    ...others\n  } = useDefaultProps(\"HvBreadCrumb\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const maxVisibleElem = maxVisible && maxVisible < 2 ? 2 : maxVisible;\n  let listPath = listRoute.slice();\n\n  // build the listPath object list\n  if (url != null) {\n    listPath = [];\n\n    // get the domain\n    const baseUrl = url.match(/^.*\\/\\/[^/]+/);\n\n    // get url without domain\n    const urlWithoutDomain = url.replace(/^.*\\/\\/[^/]+/, \"\");\n\n    const pathNames = urlWithoutDomain.split(\"/\").filter((x) => x);\n\n    pathNames.map((elem, index) =>\n      listPath.push({\n        label: decodeURI(elem),\n        path: `${baseUrl}/${pathNames.slice(0, index + 1).join(\"/\")}`,\n      }),\n    );\n  }\n\n  const breadcrumbPath =\n    maxVisibleElem && listPath.length > maxVisibleElem\n      ? pathWithSubMenu(\n          id,\n          listPath,\n          maxVisibleElem,\n          onClick,\n          dropDownMenuProps,\n        )\n      : listPath;\n\n  return (\n    <nav id={id} className={cx(classes.root, className)} {...others}>\n      <ol className={classes.orderedList}>\n        {listPath.map((elem, index) => {\n          const key = `key_${index}`;\n          const isLast = index === breadcrumbPath.length - 1;\n\n          return (\n            <HvPathElement\n              classes={{\n                centerContainer: classes.centerContainer,\n                separatorContainer: classes.separatorContainer,\n              }}\n              key={key}\n              last={isLast}\n            >\n              {(isValidElement(elem) && elem) ||\n                (isLast && (\n                  <HvTypography className={classes.currentPage} variant=\"body\">\n                    {removeExtension(elem.label)}\n                  </HvTypography>\n                )) || (\n                  <HvBreadCrumbPage\n                    elem={elem}\n                    classes={{\n                      a: classes.a,\n                      link: classes.link,\n                    }}\n                    component={component}\n                    onClick={onClick}\n                  />\n                )}\n            </HvPathElement>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n};\n"],"names":["useDefaultProps","useClasses","pathWithSubMenu","jsx","HvPathElement","HvTypography","removeExtension","HvBreadCrumbPage"],"mappings":";;;;;;;;;;AAsCa,MAAA,eAAe,CAAC,UAA6B;AAClD,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,YAAY,CAAC;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,gBAAgB,KAAK;AAEzC,QAAM,EAAE,SAAS,GAAG,IAAIC,6BAAW,WAAW;AAE9C,QAAM,iBAAiB,cAAc,aAAa,IAAI,IAAI;AACtD,MAAA,WAAW,UAAU;AAGzB,MAAI,OAAO,MAAM;AACf,eAAW,CAAA;AAGL,UAAA,UAAU,IAAI,MAAM,cAAc;AAGxC,UAAM,mBAAmB,IAAI,QAAQ,gBAAgB,EAAE;AAEjD,UAAA,YAAY,iBAAiB,MAAM,GAAG,EAAE,OAAO,CAAC,MAAM,CAAC;AAEnD,cAAA;AAAA,MAAI,CAAC,MAAM,UACnB,SAAS,KAAK;AAAA,QACZ,OAAO,UAAU,IAAI;AAAA,QACrB,MAAM,GAAG,OAAO,IAAI,UAAU,MAAM,GAAG,QAAQ,CAAC,EAAE,KAAK,GAAG,CAAC;AAAA,MAAA,CAC5D;AAAA,IAAA;AAAA,EAEL;AAEA,QAAM,iBACJ,kBAAkB,SAAS,SAAS,iBAChCC,MAAA;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAEF,IAAA;AAGJ,SAAAC,+BAAC,SAAI,IAAQ,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QACvD,UAACA,2BAAAA,IAAA,MAAA,EAAG,WAAW,QAAQ,aACpB,mBAAS,IAAI,CAAC,MAAM,UAAU;AACvB,UAAA,MAAM,OAAO,KAAK;AAClB,UAAA,SAAS,UAAU,eAAe,SAAS;AAG/C,WAAAA,2BAAA;AAAA,MAACC,YAAA;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,UACP,iBAAiB,QAAQ;AAAA,UACzB,oBAAoB,QAAQ;AAAA,QAC9B;AAAA,QAEA,MAAM;AAAA,QAEJ,+BAAe,IAAI,KAAK,QACvB,yCACEC,WAAa,cAAA,EAAA,WAAW,QAAQ,aAAa,SAAQ,QACnD,UAAAC,MAAA,gBAAgB,KAAK,KAAK,EAC7B,CAAA,KAEAH,2BAAA;AAAA,UAACI,KAAA;AAAA,UAAA;AAAA,YACC;AAAA,YACA,SAAS;AAAA,cACP,GAAG,QAAQ;AAAA,cACX,MAAM,QAAQ;AAAA,YAChB;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,MAjBC;AAAA,IAAA;AAAA,EAmBP,CAEH,GACH,EACF,CAAA;AAEJ;;;"}

package/dist/cjs/BreadCrumb/Page/Page.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Page.cjs","sources":["../../../../src/BreadCrumb/Page/Page.tsx"],"sourcesContent":["import { HvTypography } from \"../../Typography\";\nimport { HvOverflowTooltip } from \"../../OverflowTooltip\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { HvBreadCrumbPathElement } from \"../types\";\nimport { staticClasses, useClasses } from \"./Page.styles\";\n\nexport { staticClasses as breadCrumbPageClasses };\n\nexport type HvBreadCrumbPageClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBreadCrumbPageProps {\n  component?: React.ElementType;\n  onClick?: (event: React.MouseEvent<HTMLElement>, data: any) => void;\n  elem: HvBreadCrumbPathElement;\n  classes?: HvBreadCrumbPageClasses;\n}\n\nexport const HvBreadCrumbPage = (props: HvBreadCrumbPageProps) => {\n  const {\n    component,\n    onClick,\n    elem,\n    classes: classesProp,\n  } = useDefaultProps(\"HvBreadCrumbPage\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const { label, path, ...others } = elem;\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    event.preventDefault();\n    onClick?.(event, elem);\n  };\n\n  return (\n    <HvTypography\n      noWrap\n      variant=\"label\"\n      component={component || \"a\"}\n      href={elem.path}\n      onClick={onClick && handleClick}\n      className={cx(classes.link, classes.label, classes.a)}\n      {...others}\n    >\n      <HvOverflowTooltip data={elem.label} />\n    </HvTypography>\n  );\n};\n"],"names":["useDefaultProps","useClasses","jsx","HvTypography","HvOverflowTooltip"],"mappings":";;;;;;;AAmBa,MAAA,mBAAmB,CAAC,UAAiC;AAC1D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EAAA,IACPA,gBAAgB,gBAAA,oBAAoB,KAAK;AAE7C,QAAM,EAAE,SAAS,GAAG,IAAIC,uBAAW,WAAW;AAE9C,QAAM,EAAE,OAAO,MAAM,GAAG,WAAW;AAE7B,QAAA,cAAc,CAAC,UAAyC;AAC5D,UAAM,eAAe;AACrB,cAAU,OAAO,IAAI;AAAA,EAAA;AAIrB,SAAAC,2BAAA;AAAA,IAACC,WAAA;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,SAAQ;AAAA,MACR,WAAW,aAAa;AAAA,MACxB,MAAM,KAAK;AAAA,MACX,SAAS,WAAW;AAAA,MACpB,WAAW,GAAG,QAAQ,MAAM,QAAQ,OAAO,QAAQ,CAAC;AAAA,MACnD,GAAG;AAAA,MAEJ,UAACD,2BAAA,IAAAE,gBAAA,mBAAA,EAAkB,MAAM,KAAK,OAAO;AAAA,IAAA;AAAA,EAAA;AAG3C;;;"}
+{"version":3,"file":"Page.cjs","sources":["../../../../src/BreadCrumb/Page/Page.tsx"],"sourcesContent":["import { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvOverflowTooltip } from \"../../OverflowTooltip\";\nimport { HvTypography } from \"../../Typography\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { HvBreadCrumbPathElement } from \"../types\";\nimport { staticClasses, useClasses } from \"./Page.styles\";\n\nexport { staticClasses as breadCrumbPageClasses };\n\nexport type HvBreadCrumbPageClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBreadCrumbPageProps {\n  component?: React.ElementType;\n  onClick?: (event: React.MouseEvent<HTMLElement>, data: any) => void;\n  elem: HvBreadCrumbPathElement;\n  classes?: HvBreadCrumbPageClasses;\n}\n\nexport const HvBreadCrumbPage = (props: HvBreadCrumbPageProps) => {\n  const {\n    component,\n    onClick,\n    elem,\n    classes: classesProp,\n  } = useDefaultProps(\"HvBreadCrumbPage\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const { label, path, ...others } = elem;\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    event.preventDefault();\n    onClick?.(event, elem);\n  };\n\n  return (\n    <HvTypography\n      noWrap\n      variant=\"label\"\n      component={component || \"a\"}\n      href={elem.path}\n      onClick={onClick && handleClick}\n      className={cx(classes.link, classes.label, classes.a)}\n      {...others}\n    >\n      <HvOverflowTooltip data={elem.label} />\n    </HvTypography>\n  );\n};\n"],"names":["useDefaultProps","useClasses","jsx","HvTypography","HvOverflowTooltip"],"mappings":";;;;;;;AAkBa,MAAA,mBAAmB,CAAC,UAAiC;AAC1D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EAAA,IACPA,gBAAgB,gBAAA,oBAAoB,KAAK;AAE7C,QAAM,EAAE,SAAS,GAAG,IAAIC,uBAAW,WAAW;AAE9C,QAAM,EAAE,OAAO,MAAM,GAAG,WAAW;AAE7B,QAAA,cAAc,CAAC,UAAyC;AAC5D,UAAM,eAAe;AACrB,cAAU,OAAO,IAAI;AAAA,EAAA;AAIrB,SAAAC,2BAAA;AAAA,IAACC,WAAA;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,SAAQ;AAAA,MACR,WAAW,aAAa;AAAA,MACxB,MAAM,KAAK;AAAA,MACX,SAAS,WAAW;AAAA,MACpB,WAAW,GAAG,QAAQ,MAAM,QAAQ,OAAO,QAAQ,CAAC;AAAA,MACnD,GAAG;AAAA,MAEJ,UAACD,2BAAA,IAAAE,gBAAA,mBAAA,EAAkB,MAAM,KAAK,OAAO;AAAA,IAAA;AAAA,EAAA;AAG3C;;;"}

package/dist/cjs/BreadCrumb/PathElement/PathElement.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PathElement.cjs","sources":["../../../../src/BreadCrumb/PathElement/PathElement.tsx"],"sourcesContent":["import { DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { ExtractNames } from \"../../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./PathElement.styles\";\n\nexport { staticClasses as pathElementClasses };\n\nexport type HvPathElementClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvPathElementProps {\n  last?: boolean;\n  classes?: HvPathElementClasses;\n  children: React.ReactElement;\n}\n\nexport const HvPathElement = ({\n  classes: classesProp,\n  last = false,\n  children,\n}: HvPathElementProps) => {\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <li className={classes.centerContainer}>\n      {children}\n      {!last && (\n        <DropRightXS\n          className={classes.separatorContainer}\n          color=\"secondary_60\"\n        />\n      )}\n    </li>\n  );\n};\n"],"names":["useClasses","jsxs","jsx","DropRightXS"],"mappings":";;;;;AAgBO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,SAAS;AAAA,EACT,OAAO;AAAA,EACP;AACF,MAA0B;AACxB,QAAM,EAAE,QAAA,IAAYA,mBAAA,WAAW,WAAW;AAE1C,SACGC,2BAAAA,KAAA,MAAA,EAAG,WAAW,QAAQ,iBACpB,UAAA;AAAA,IAAA;AAAA,IACA,CAAC,QACAC,2BAAA;AAAA,MAACC,gBAAA;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,OAAM;AAAA,MAAA;AAAA,IACR;AAAA,EAEJ,EAAA,CAAA;AAEJ;;;"}
+{"version":3,"file":"PathElement.cjs","sources":["../../../../src/BreadCrumb/PathElement/PathElement.tsx"],"sourcesContent":["import { DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { ExtractNames } from \"../../utils/classes\";\nimport { staticClasses, useClasses } from \"./PathElement.styles\";\n\nexport { staticClasses as pathElementClasses };\n\nexport type HvPathElementClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvPathElementProps {\n  last?: boolean;\n  classes?: HvPathElementClasses;\n  children: React.ReactElement;\n}\n\nexport const HvPathElement = ({\n  classes: classesProp,\n  last = false,\n  children,\n}: HvPathElementProps) => {\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <li className={classes.centerContainer}>\n      {children}\n      {!last && (\n        <DropRightXS\n          className={classes.separatorContainer}\n          color=\"secondary_60\"\n        />\n      )}\n    </li>\n  );\n};\n"],"names":["useClasses","jsxs","jsx","DropRightXS"],"mappings":";;;;;AAeO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,SAAS;AAAA,EACT,OAAO;AAAA,EACP;AACF,MAA0B;AACxB,QAAM,EAAE,QAAA,IAAYA,mBAAA,WAAW,WAAW;AAE1C,SACGC,2BAAAA,KAAA,MAAA,EAAG,WAAW,QAAQ,iBACpB,UAAA;AAAA,IAAA;AAAA,IACA,CAAC,QACAC,2BAAA;AAAA,MAACC,gBAAA;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,OAAM;AAAA,MAAA;AAAA,IACR;AAAA,EAEJ,EAAA,CAAA;AAEJ;;;"}

package/dist/cjs/BreadCrumb/utils.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.cjs","sources":["../../../src/BreadCrumb/utils.tsx"],"sourcesContent":["import { MoreOptionsHorizontal } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvDropDownMenu, HvDropDownMenuProps } from \"../DropDownMenu\";\nimport { setId } from \"../utils/setId\";\n\nexport const removeExtension = (label: string) =>\n  label.includes(\".\") ? label.substring(0, label.lastIndexOf(\".\")) : label;\n\nexport const pathWithSubMenu = (\n  id: string | undefined,\n  listRoute: any,\n  maxVisible: number,\n  onClick?: (event: React.MouseEvent<HTMLElement>, data: any) => void,\n  dropDownMenuProps?: Partial<HvDropDownMenuProps>\n) => {\n  const nbrElemToSubMenu = listRoute.length - maxVisible;\n  const subMenuList = listRoute.slice(1, nbrElemToSubMenu + 1);\n\n  const handleClick = (event: any, data: any) => {\n    event.preventDefault();\n\n    onClick?.(event, data);\n  };\n\n  listRoute.splice(\n    1,\n    nbrElemToSubMenu,\n    <HvDropDownMenu\n      id={setId(id, \"submenu\")}\n      icon={<MoreOptionsHorizontal iconSize=\"S\" color=\"secondary\" />}\n      dataList={subMenuList}\n      {...dropDownMenuProps}\n      onClick={onClick != null ? handleClick : undefined}\n    />\n  );\n\n  return listRoute;\n};\n"],"names":["jsx","HvDropDownMenu","setId","MoreOptionsHorizontal"],"mappings":";;;;;;AAKO,MAAM,kBAAkB,CAAC,UAC9B,MAAM,SAAS,GAAG,IAAI,MAAM,UAAU,GAAG,MAAM,YAAY,GAAG,CAAC,IAAI;AAE9D,MAAM,kBAAkB,CAC7B,IACA,WACA,YACA,SACA,sBACG;AACG,QAAA,mBAAmB,UAAU,SAAS;AAC5C,QAAM,cAAc,UAAU,MAAM,GAAG,mBAAmB,CAAC;AAErD,QAAA,cAAc,CAAC,OAAY,SAAc;AAC7C,UAAM,eAAe;AAErB,cAAU,OAAO,IAAI;AAAA,EAAA;AAGb,YAAA;AAAA,IACR;AAAA,IACA;AAAA,IACAA,2BAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAIC,MAAAA,MAAM,IAAI,SAAS;AAAA,QACvB,MAAOF,2BAAA,IAAAG,uCAAA,EAAsB,UAAS,KAAI,OAAM,aAAY;AAAA,QAC5D,UAAU;AAAA,QACT,GAAG;AAAA,QACJ,SAAS,WAAW,OAAO,cAAc;AAAA,MAAA;AAAA,IAC3C;AAAA,EAAA;AAGK,SAAA;AACT;;;"}
+{"version":3,"file":"utils.cjs","sources":["../../../src/BreadCrumb/utils.tsx"],"sourcesContent":["import { MoreOptionsHorizontal } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvDropDownMenu, HvDropDownMenuProps } from \"../DropDownMenu\";\nimport { setId } from \"../utils/setId\";\n\nexport const removeExtension = (label: string) =>\n  label.includes(\".\") ? label.substring(0, label.lastIndexOf(\".\")) : label;\n\nexport const pathWithSubMenu = (\n  id: string | undefined,\n  listRoute: any,\n  maxVisible: number,\n  onClick?: (event: React.MouseEvent<HTMLElement>, data: any) => void,\n  dropDownMenuProps?: Partial<HvDropDownMenuProps>,\n) => {\n  const nbrElemToSubMenu = listRoute.length - maxVisible;\n  const subMenuList = listRoute.slice(1, nbrElemToSubMenu + 1);\n\n  const handleClick = (event: any, data: any) => {\n    event.preventDefault();\n\n    onClick?.(event, data);\n  };\n\n  listRoute.splice(\n    1,\n    nbrElemToSubMenu,\n    <HvDropDownMenu\n      id={setId(id, \"submenu\")}\n      icon={<MoreOptionsHorizontal iconSize=\"S\" color=\"secondary\" />}\n      dataList={subMenuList}\n      {...dropDownMenuProps}\n      onClick={onClick != null ? handleClick : undefined}\n    />,\n  );\n\n  return listRoute;\n};\n"],"names":["jsx","HvDropDownMenu","setId","MoreOptionsHorizontal"],"mappings":";;;;;;AAKO,MAAM,kBAAkB,CAAC,UAC9B,MAAM,SAAS,GAAG,IAAI,MAAM,UAAU,GAAG,MAAM,YAAY,GAAG,CAAC,IAAI;AAE9D,MAAM,kBAAkB,CAC7B,IACA,WACA,YACA,SACA,sBACG;AACG,QAAA,mBAAmB,UAAU,SAAS;AAC5C,QAAM,cAAc,UAAU,MAAM,GAAG,mBAAmB,CAAC;AAErD,QAAA,cAAc,CAAC,OAAY,SAAc;AAC7C,UAAM,eAAe;AAErB,cAAU,OAAO,IAAI;AAAA,EAAA;AAGb,YAAA;AAAA,IACR;AAAA,IACA;AAAA,IACAA,2BAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAIC,MAAAA,MAAM,IAAI,SAAS;AAAA,QACvB,MAAOF,2BAAA,IAAAG,uCAAA,EAAsB,UAAS,KAAI,OAAM,aAAY;AAAA,QAC5D,UAAU;AAAA,QACT,GAAG;AAAA,QACJ,SAAS,WAAW,OAAO,cAAc;AAAA,MAAA;AAAA,IAC3C;AAAA,EAAA;AAGK,SAAA;AACT;;;"}

package/dist/cjs/BulkActions/BulkActions.cjs

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const useDefaultProps = require("../hooks/useDefaultProps.cjs");
-const setId = require("../utils/setId.cjs");
 const useTheme = require("../hooks/useTheme.cjs");
+const setId = require("../utils/setId.cjs");
 const BulkActions_styles = require("./BulkActions.styles.cjs");
 const Button = require("../Button/Button.cjs");
 const Typography = require("../Typography/Typography.cjs");

package/dist/cjs/BulkActions/BulkActions.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BulkActions.cjs","sources":["../../../src/BulkActions/BulkActions.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { setId } from \"../utils/setId\";\nimport { useTheme } from \"../hooks/useTheme\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvButton, HvButtonProps, HvButtonVariant } from \"../Button\";\nimport { HvCheckBox, HvCheckBoxProps } from \"../CheckBox\";\nimport { HvActionsGeneric, HvActionsGenericProps } from \"../ActionsGeneric\";\nimport { HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./BulkActions.styles\";\n\nexport { staticClasses as bulkActionsClasses };\n\nexport type HvBulkActionsClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBulkActionsProps extends HvBaseProps {\n  /** Custom label for select all checkbox */\n  selectAllLabel?: React.ReactNode;\n  /** Custom label for select all checkbox conjunction */\n  selectAllConjunctionLabel?: string;\n  /** Custom label for select all pages button */\n  selectAllPagesLabel?: React.ReactNode;\n  /** Whether select all pages element should be visible */\n  showSelectAllPages?: boolean;\n  /** The total number of elements */\n  numTotal?: number;\n  /** The number of elements currently selected */\n  numSelected?: number;\n  /** Function called when the \"select all\" Checkbox is toggled. */\n  onSelectAll?: HvCheckBoxProps[\"onChange\"];\n  /** Function called when the \"select all pages\" button is clicked toggled. */\n  onSelectAllPages?: HvButtonProps[\"onClick\"];\n  /** Whether the bulk actions should use the semantic styles when there are selected elements. */\n  semantic?: boolean;\n  /** The renderable content inside the right actions slot, or an array of actions `{ id, label, icon, disabled, ... }` */\n  actions?: HvActionsGenericProps[\"actions\"];\n  /** Whether actions should be all disabled */\n  actionsDisabled?: boolean;\n  /**\n   * The callback function called when an action is triggered, receiving `action` as parameter.\n   *\n   * @deprecated Use `onAction` instead.\n   * */\n  actionsCallback?: HvActionsGenericProps[\"actionsCallback\"];\n  /** The callback function called when an action is triggered, receiving `action` as parameter. */\n  onAction?: HvActionsGenericProps[\"onAction\"];\n  /** The number of maximum visible actions before they're collapsed into a `DropDownMenu`. */\n  maxVisibleActions?: number;\n  /** Properties to be passed onto the checkbox component, the values of the object are equivalent to the HvCheckbox API. */\n  checkboxProps?: HvCheckBoxProps;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvBulkActionsClasses;\n}\n\n/**\n * Bulk Actions allow users to perform an action on a single or multiple items.\n * Also known as \"batch production\" of multiple items at once, one stage at a time.\n */\nexport const HvBulkActions = (props: HvBulkActionsProps) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    selectAllPagesLabel,\n    actionsDisabled,\n    maxVisibleActions,\n    checkboxProps,\n    actions,\n    numTotal = 0,\n    numSelected = 0,\n    selectAllLabel = \"All\",\n    selectAllConjunctionLabel = \"/\",\n    showSelectAllPages = false,\n    semantic = true,\n    actionsCallback, // TODO - remove in v6\n    onAction,\n    onSelectAll,\n    onSelectAllPages,\n    ...others\n  } = useDefaultProps(\"HvBulkActions\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const { activeTheme } = useTheme();\n\n  const anySelected = numSelected > 0;\n  const isSemantic = semantic && anySelected;\n\n  const selectAllLabelComponent = (\n    <HvTypography\n      component=\"span\"\n      disabled={checkboxProps?.disabled}\n      variant=\"body\"\n    >\n      {!anySelected ? (\n        <>\n          <HvTypography variant=\"label\">{selectAllLabel}</HvTypography>\n          {` (${numTotal})`}\n        </>\n      ) : (\n        <>\n          <HvTypography variant=\"label\">{numSelected}</HvTypography>\n          {` ${selectAllConjunctionLabel} ${numTotal}`}\n        </>\n      )}\n    </HvTypography>\n  );\n\n  return (\n    <div\n      id={id}\n      className={cx(\n        classes.root,\n        { [classes.semantic]: isSemantic },\n        className\n      )}\n      {...others}\n    >\n      <div className={classes.selectAllContainer}>\n        <HvCheckBox\n          id={setId(id, \"select\")}\n          className={classes.selectAll}\n          checked={numSelected > 0}\n          semantic={isSemantic}\n          onChange={onSelectAll}\n          indeterminate={numSelected > 0 && numSelected < numTotal}\n          label={selectAllLabelComponent}\n          {...checkboxProps}\n        />\n        {showSelectAllPages && anySelected && numSelected < numTotal && (\n          <>\n            <div className={classes.divider} />\n            <HvButton\n              id={setId(id, \"pages\")}\n              className={classes.selectAllPages}\n              variant={\n                isSemantic\n                  ? (activeTheme?.bulkActions\n                      .actionButtonVariant as HvButtonVariant)\n                  : \"secondaryGhost\"\n              }\n              onClick={onSelectAllPages}\n            >\n              {selectAllPagesLabel ?? `Select all ${numTotal} items`}\n            </HvButton>\n          </>\n        )}\n      </div>\n      <HvActionsGeneric\n        id={setId(id, \"actions\")}\n        classes={{ root: classes.actions }}\n        variant={\n          isSemantic\n            ? (activeTheme?.bulkActions.actionButtonVariant as HvButtonVariant)\n            : \"secondaryGhost\"\n        }\n        actions={actions}\n        disabled={actionsDisabled ?? numSelected === 0}\n        actionsCallback={actionsCallback}\n        onAction={onAction}\n        maxVisibleActions={maxVisibleActions}\n      />\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","useTheme","jsx","HvTypography","jsxs","Fragment","HvCheckBox","setId","HvButton","HvActionsGeneric"],"mappings":";;;;;;;;;;;AA0Da,MAAA,gBAAgB,CAAC,UAA8B;AACpD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,4BAA4B;AAAA,IAC5B,qBAAqB;AAAA,IACrB,WAAW;AAAA,IACX;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,iBAAiB,KAAK;AAE1C,QAAM,EAAE,SAAS,GAAG,IAAIC,8BAAW,WAAW;AAExC,QAAA,EAAE,gBAAgBC,SAAAA;AAExB,QAAM,cAAc,cAAc;AAClC,QAAM,aAAa,YAAY;AAE/B,QAAM,0BACJC,2BAAA;AAAA,IAACC,WAAA;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,UAAU,eAAe;AAAA,MACzB,SAAQ;AAAA,MAEP,UAAA,CAAC,cAEEC,2BAAA,KAAAC,WAAA,UAAA,EAAA,UAAA;AAAA,QAACH,2BAAA,IAAAC,WAAA,cAAA,EAAa,SAAQ,SAAS,UAAe,gBAAA;AAAA,QAC7C,KAAK,QAAQ;AAAA,MAAA,EAAA,CAChB,IAGEC,2BAAAA,KAAAC,WAAA,UAAA,EAAA,UAAA;AAAA,QAACH,2BAAA,IAAAC,WAAA,cAAA,EAAa,SAAQ,SAAS,UAAY,aAAA;AAAA,QAC1C,IAAI,yBAAyB,IAAI,QAAQ;AAAA,MAAA,GAC5C;AAAA,IAAA;AAAA,EAAA;AAMJ,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,WAAW;AAAA,QACjC;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAACA,2BAAA,KAAA,OAAA,EAAI,WAAW,QAAQ,oBACtB,UAAA;AAAA,UAAAF,2BAAA;AAAA,YAACI,SAAA;AAAA,YAAA;AAAA,cACC,IAAIC,MAAAA,MAAM,IAAI,QAAQ;AAAA,cACtB,WAAW,QAAQ;AAAA,cACnB,SAAS,cAAc;AAAA,cACvB,UAAU;AAAA,cACV,UAAU;AAAA,cACV,eAAe,cAAc,KAAK,cAAc;AAAA,cAChD,OAAO;AAAA,cACN,GAAG;AAAA,YAAA;AAAA,UACN;AAAA,UACC,sBAAsB,eAAe,cAAc,YAEhDH,2BAAAA,KAAAC,WAAAA,UAAA,EAAA,UAAA;AAAA,YAACH,2BAAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,QAAS,CAAA;AAAA,YACjCA,2BAAA;AAAA,cAACM,OAAA;AAAA,cAAA;AAAA,gBACC,IAAID,MAAAA,MAAM,IAAI,OAAO;AAAA,gBACrB,WAAW,QAAQ;AAAA,gBACnB,SACE,aACK,aAAa,YACX,sBACH;AAAA,gBAEN,SAAS;AAAA,gBAER,UAAA,uBAAuB,cAAc,QAAQ;AAAA,cAAA;AAAA,YAChD;AAAA,UAAA,GACF;AAAA,QAAA,GAEJ;AAAA,QACAL,2BAAA;AAAA,UAACO,eAAA;AAAA,UAAA;AAAA,YACC,IAAIF,MAAAA,MAAM,IAAI,SAAS;AAAA,YACvB,SAAS,EAAE,MAAM,QAAQ,QAAQ;AAAA,YACjC,SACE,aACK,aAAa,YAAY,sBAC1B;AAAA,YAEN;AAAA,YACA,UAAU,mBAAmB,gBAAgB;AAAA,YAC7C;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;;;"}
+{"version":3,"file":"BulkActions.cjs","sources":["../../../src/BulkActions/BulkActions.tsx"],"sourcesContent":["import { HvActionsGeneric, HvActionsGenericProps } from \"../ActionsGeneric\";\nimport { HvButton, HvButtonProps, HvButtonVariant } from \"../Button\";\nimport { HvCheckBox, HvCheckBoxProps } from \"../CheckBox\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useTheme } from \"../hooks/useTheme\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./BulkActions.styles\";\n\nexport { staticClasses as bulkActionsClasses };\n\nexport type HvBulkActionsClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBulkActionsProps extends HvBaseProps {\n  /** Custom label for select all checkbox */\n  selectAllLabel?: React.ReactNode;\n  /** Custom label for select all checkbox conjunction */\n  selectAllConjunctionLabel?: string;\n  /** Custom label for select all pages button */\n  selectAllPagesLabel?: React.ReactNode;\n  /** Whether select all pages element should be visible */\n  showSelectAllPages?: boolean;\n  /** The total number of elements */\n  numTotal?: number;\n  /** The number of elements currently selected */\n  numSelected?: number;\n  /** Function called when the \"select all\" Checkbox is toggled. */\n  onSelectAll?: HvCheckBoxProps[\"onChange\"];\n  /** Function called when the \"select all pages\" button is clicked toggled. */\n  onSelectAllPages?: HvButtonProps[\"onClick\"];\n  /** Whether the bulk actions should use the semantic styles when there are selected elements. */\n  semantic?: boolean;\n  /** The renderable content inside the right actions slot, or an array of actions `{ id, label, icon, disabled, ... }` */\n  actions?: HvActionsGenericProps[\"actions\"];\n  /** Whether actions should be all disabled */\n  actionsDisabled?: boolean;\n  /**\n   * The callback function called when an action is triggered, receiving `action` as parameter.\n   *\n   * @deprecated Use `onAction` instead.\n   * */\n  actionsCallback?: HvActionsGenericProps[\"actionsCallback\"];\n  /** The callback function called when an action is triggered, receiving `action` as parameter. */\n  onAction?: HvActionsGenericProps[\"onAction\"];\n  /** The number of maximum visible actions before they're collapsed into a `DropDownMenu`. */\n  maxVisibleActions?: number;\n  /** Properties to be passed onto the checkbox component, the values of the object are equivalent to the HvCheckbox API. */\n  checkboxProps?: HvCheckBoxProps;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvBulkActionsClasses;\n}\n\n/**\n * Bulk Actions allow users to perform an action on a single or multiple items.\n * Also known as \"batch production\" of multiple items at once, one stage at a time.\n */\nexport const HvBulkActions = (props: HvBulkActionsProps) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    selectAllPagesLabel,\n    actionsDisabled,\n    maxVisibleActions,\n    checkboxProps,\n    actions,\n    numTotal = 0,\n    numSelected = 0,\n    selectAllLabel = \"All\",\n    selectAllConjunctionLabel = \"/\",\n    showSelectAllPages = false,\n    semantic = true,\n    actionsCallback, // TODO - remove in v6\n    onAction,\n    onSelectAll,\n    onSelectAllPages,\n    ...others\n  } = useDefaultProps(\"HvBulkActions\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const { activeTheme } = useTheme();\n\n  const anySelected = numSelected > 0;\n  const isSemantic = semantic && anySelected;\n\n  const selectAllLabelComponent = (\n    <HvTypography\n      component=\"span\"\n      disabled={checkboxProps?.disabled}\n      variant=\"body\"\n    >\n      {!anySelected ? (\n        <>\n          <HvTypography variant=\"label\">{selectAllLabel}</HvTypography>\n          {` (${numTotal})`}\n        </>\n      ) : (\n        <>\n          <HvTypography variant=\"label\">{numSelected}</HvTypography>\n          {` ${selectAllConjunctionLabel} ${numTotal}`}\n        </>\n      )}\n    </HvTypography>\n  );\n\n  return (\n    <div\n      id={id}\n      className={cx(\n        classes.root,\n        { [classes.semantic]: isSemantic },\n        className,\n      )}\n      {...others}\n    >\n      <div className={classes.selectAllContainer}>\n        <HvCheckBox\n          id={setId(id, \"select\")}\n          className={classes.selectAll}\n          checked={numSelected > 0}\n          semantic={isSemantic}\n          onChange={onSelectAll}\n          indeterminate={numSelected > 0 && numSelected < numTotal}\n          label={selectAllLabelComponent}\n          {...checkboxProps}\n        />\n        {showSelectAllPages && anySelected && numSelected < numTotal && (\n          <>\n            <div className={classes.divider} />\n            <HvButton\n              id={setId(id, \"pages\")}\n              className={classes.selectAllPages}\n              variant={\n                isSemantic\n                  ? (activeTheme?.bulkActions\n                      .actionButtonVariant as HvButtonVariant)\n                  : \"secondaryGhost\"\n              }\n              onClick={onSelectAllPages}\n            >\n              {selectAllPagesLabel ?? `Select all ${numTotal} items`}\n            </HvButton>\n          </>\n        )}\n      </div>\n      <HvActionsGeneric\n        id={setId(id, \"actions\")}\n        classes={{ root: classes.actions }}\n        variant={\n          isSemantic\n            ? (activeTheme?.bulkActions.actionButtonVariant as HvButtonVariant)\n            : \"secondaryGhost\"\n        }\n        actions={actions}\n        disabled={actionsDisabled ?? numSelected === 0}\n        actionsCallback={actionsCallback}\n        onAction={onAction}\n        maxVisibleActions={maxVisibleActions}\n      />\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","useTheme","jsx","HvTypography","jsxs","Fragment","HvCheckBox","setId","HvButton","HvActionsGeneric"],"mappings":";;;;;;;;;;;AA0Da,MAAA,gBAAgB,CAAC,UAA8B;AACpD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,4BAA4B;AAAA,IAC5B,qBAAqB;AAAA,IACrB,WAAW;AAAA,IACX;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,iBAAiB,KAAK;AAE1C,QAAM,EAAE,SAAS,GAAG,IAAIC,8BAAW,WAAW;AAExC,QAAA,EAAE,gBAAgBC,SAAAA;AAExB,QAAM,cAAc,cAAc;AAClC,QAAM,aAAa,YAAY;AAE/B,QAAM,0BACJC,2BAAA;AAAA,IAACC,WAAA;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,UAAU,eAAe;AAAA,MACzB,SAAQ;AAAA,MAEP,UAAA,CAAC,cAEEC,2BAAA,KAAAC,WAAA,UAAA,EAAA,UAAA;AAAA,QAACH,2BAAA,IAAAC,WAAA,cAAA,EAAa,SAAQ,SAAS,UAAe,gBAAA;AAAA,QAC7C,KAAK,QAAQ;AAAA,MAAA,EAAA,CAChB,IAGEC,2BAAAA,KAAAC,WAAA,UAAA,EAAA,UAAA;AAAA,QAACH,2BAAA,IAAAC,WAAA,cAAA,EAAa,SAAQ,SAAS,UAAY,aAAA;AAAA,QAC1C,IAAI,yBAAyB,IAAI,QAAQ;AAAA,MAAA,GAC5C;AAAA,IAAA;AAAA,EAAA;AAMJ,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,WAAW;AAAA,QACjC;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAACA,2BAAA,KAAA,OAAA,EAAI,WAAW,QAAQ,oBACtB,UAAA;AAAA,UAAAF,2BAAA;AAAA,YAACI,SAAA;AAAA,YAAA;AAAA,cACC,IAAIC,MAAAA,MAAM,IAAI,QAAQ;AAAA,cACtB,WAAW,QAAQ;AAAA,cACnB,SAAS,cAAc;AAAA,cACvB,UAAU;AAAA,cACV,UAAU;AAAA,cACV,eAAe,cAAc,KAAK,cAAc;AAAA,cAChD,OAAO;AAAA,cACN,GAAG;AAAA,YAAA;AAAA,UACN;AAAA,UACC,sBAAsB,eAAe,cAAc,YAEhDH,2BAAAA,KAAAC,WAAAA,UAAA,EAAA,UAAA;AAAA,YAACH,2BAAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,QAAS,CAAA;AAAA,YACjCA,2BAAA;AAAA,cAACM,OAAA;AAAA,cAAA;AAAA,gBACC,IAAID,MAAAA,MAAM,IAAI,OAAO;AAAA,gBACrB,WAAW,QAAQ;AAAA,gBACnB,SACE,aACK,aAAa,YACX,sBACH;AAAA,gBAEN,SAAS;AAAA,gBAER,UAAA,uBAAuB,cAAc,QAAQ;AAAA,cAAA;AAAA,YAChD;AAAA,UAAA,GACF;AAAA,QAAA,GAEJ;AAAA,QACAL,2BAAA;AAAA,UAACO,eAAA;AAAA,UAAA;AAAA,YACC,IAAIF,MAAAA,MAAM,IAAI,SAAS;AAAA,YACvB,SAAS,EAAE,MAAM,QAAQ,QAAQ;AAAA,YACjC,SACE,aACK,aAAa,YAAY,sBAC1B;AAAA,YAEN;AAAA,YACA,UAAU,mBAAmB,gBAAgB;AAAA,YAC7C;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;;;"}

package/dist/cjs/BulkActions/BulkActions.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BulkActions.styles.cjs","sources":["../../../src/BulkActions/BulkActions.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\nimport { actionsGenericClasses } from \"../ActionsGeneric\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBulkActions\", {\n  root: {\n    display: \"flex\",\n    alignItems: \"center\",\n    border: `1px solid ${theme.colors.atmo4}`,\n    backgroundColor: theme.colors.atmo2,\n    padding: theme.spacing(\"xs\", \"md\"),\n    marginBottom: theme.space.xs,\n  },\n  semantic: {\n    backgroundColor: theme.colors.containerBackgroundHover,\n    \"& $selectAll div\": {\n      color: \"inherit\",\n\n      \"&:hover:not(:disabled)\": {\n        backgroundColor: theme.alpha(\"base_light\", 0.3),\n      },\n\n      \"& *\": {\n        color: \"inherit\",\n        backgroundColor: \"transparent\",\n      },\n    },\n\n    \"& $selectAll:focus-within div\": {\n      backgroundColor: theme.alpha(\"base_light\", 0.3),\n    },\n  },\n  actions: {\n    display: \"inline-flex\",\n    marginLeft: \"auto\",\n    [`& .${actionsGenericClasses.dropDownMenuButton}:disabled`]: {\n      backgroundColor: \"transparent\",\n      borderColor: \"transparent\",\n      \"&:hover\": { backgroundColor: \"transparent\", borderColor: \"transparent\" },\n    },\n  },\n  selectAllContainer: { display: \"flex\", alignItems: \"center\" },\n  selectAll: {},\n  selectAllPages: {},\n  divider: {\n    display: \"flex\",\n    backgroundColor: theme.colors.atmo4,\n    width: \"1px\",\n    height: \"32px\",\n    marginLeft: theme.space.sm,\n  },\n});\n"],"names":["createClasses","theme","actionsGenericClasses"],"mappings":";;;;;;;;AAKO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,iBAAiB;AAAA,EAC1E,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,QAAQ,aAAaC,YAAM,MAAA,OAAO,KAAK;AAAA,IACvC,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAC9B,SAASA,YAAA,MAAM,QAAQ,MAAM,IAAI;AAAA,IACjC,cAAcA,YAAAA,MAAM,MAAM;AAAA,EAC5B;AAAA,EACA,UAAU;AAAA,IACR,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAC9B,oBAAoB;AAAA,MAClB,OAAO;AAAA,MAEP,0BAA0B;AAAA,QACxB,iBAAiBA,YAAA,MAAM,MAAM,cAAc,GAAG;AAAA,MAChD;AAAA,MAEA,OAAO;AAAA,QACL,OAAO;AAAA,QACP,iBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IAEA,iCAAiC;AAAA,MAC/B,iBAAiBA,YAAA,MAAM,MAAM,cAAc,GAAG;AAAA,IAChD;AAAA,EACF;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,CAAC,MAAMC,sBAAAA,cAAsB,kBAAkB,WAAW,GAAG;AAAA,MAC3D,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,WAAW,EAAE,iBAAiB,eAAe,aAAa,cAAc;AAAA,IAC1E;AAAA,EACF;AAAA,EACA,oBAAoB,EAAE,SAAS,QAAQ,YAAY,SAAS;AAAA,EAC5D,WAAW,CAAC;AAAA,EACZ,gBAAgB,CAAC;AAAA,EACjB,SAAS;AAAA,IACP,SAAS;AAAA,IACT,iBAAiBD,YAAAA,MAAM,OAAO;AAAA,IAC9B,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,YAAYA,YAAAA,MAAM,MAAM;AAAA,EAC1B;AACF,CAAC;;;"}
+{"version":3,"file":"BulkActions.styles.cjs","sources":["../../../src/BulkActions/BulkActions.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { actionsGenericClasses } from \"../ActionsGeneric\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBulkActions\", {\n  root: {\n    display: \"flex\",\n    alignItems: \"center\",\n    border: `1px solid ${theme.colors.atmo4}`,\n    backgroundColor: theme.colors.atmo2,\n    padding: theme.spacing(\"xs\", \"md\"),\n    marginBottom: theme.space.xs,\n  },\n  semantic: {\n    backgroundColor: theme.colors.containerBackgroundHover,\n    \"& $selectAll div\": {\n      color: \"inherit\",\n\n      \"&:hover:not(:disabled)\": {\n        backgroundColor: theme.alpha(\"base_light\", 0.3),\n      },\n\n      \"& *\": {\n        color: \"inherit\",\n        backgroundColor: \"transparent\",\n      },\n    },\n\n    \"& $selectAll:focus-within div\": {\n      backgroundColor: theme.alpha(\"base_light\", 0.3),\n    },\n  },\n  actions: {\n    display: \"inline-flex\",\n    marginLeft: \"auto\",\n    [`& .${actionsGenericClasses.dropDownMenuButton}:disabled`]: {\n      backgroundColor: \"transparent\",\n      borderColor: \"transparent\",\n      \"&:hover\": { backgroundColor: \"transparent\", borderColor: \"transparent\" },\n    },\n  },\n  selectAllContainer: { display: \"flex\", alignItems: \"center\" },\n  selectAll: {},\n  selectAllPages: {},\n  divider: {\n    display: \"flex\",\n    backgroundColor: theme.colors.atmo4,\n    width: \"1px\",\n    height: \"32px\",\n    marginLeft: theme.space.sm,\n  },\n});\n"],"names":["createClasses","theme","actionsGenericClasses"],"mappings":";;;;;;;;AAKO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,iBAAiB;AAAA,EAC1E,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,QAAQ,aAAaC,YAAM,MAAA,OAAO,KAAK;AAAA,IACvC,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAC9B,SAASA,YAAA,MAAM,QAAQ,MAAM,IAAI;AAAA,IACjC,cAAcA,YAAAA,MAAM,MAAM;AAAA,EAC5B;AAAA,EACA,UAAU;AAAA,IACR,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAC9B,oBAAoB;AAAA,MAClB,OAAO;AAAA,MAEP,0BAA0B;AAAA,QACxB,iBAAiBA,YAAA,MAAM,MAAM,cAAc,GAAG;AAAA,MAChD;AAAA,MAEA,OAAO;AAAA,QACL,OAAO;AAAA,QACP,iBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IAEA,iCAAiC;AAAA,MAC/B,iBAAiBA,YAAA,MAAM,MAAM,cAAc,GAAG;AAAA,IAChD;AAAA,EACF;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,CAAC,MAAMC,sBAAAA,cAAsB,kBAAkB,WAAW,GAAG;AAAA,MAC3D,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,WAAW,EAAE,iBAAiB,eAAe,aAAa,cAAc;AAAA,IAC1E;AAAA,EACF;AAAA,EACA,oBAAoB,EAAE,SAAS,QAAQ,YAAY,SAAS;AAAA,EAC5D,WAAW,CAAC;AAAA,EACZ,gBAAgB,CAAC;AAAA,EACjB,SAAS;AAAA,IACP,SAAS;AAAA,IACT,iBAAiBD,YAAAA,MAAM,OAAO;AAAA,IAC9B,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,YAAYA,YAAAA,MAAM,MAAM;AAAA,EAC1B;AACF,CAAC;;;"}

package/dist/cjs/Button/Button.cjs

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
-const useTheme = require("../hooks/useTheme.cjs");
 const useDefaultProps = require("../hooks/useDefaultProps.cjs");
+const useTheme = require("../hooks/useTheme.cjs");
 const generic = require("../types/generic.cjs");
 const Button_styles = require("./Button.styles.cjs");
 const mapVariant = (variant, theme) => {

package/dist/cjs/Button/Button.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Button.cjs","sources":["../../../src/Button/Button.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { useTheme } from \"../hooks/useTheme\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport {\n  fixedForwardRef,\n  PolymorphicComponentRef,\n  PolymorphicRef,\n} from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport {\n  staticClasses as buttonClasses,\n  getOverrideColors,\n  getRadiusStyles,\n  getSizeStyles,\n  getIconSizeStyles,\n  useClasses,\n  getColoringStyle,\n} from \"./Button.styles\";\nimport { HvButtonRadius, HvButtonSize, HvButtonVariant } from \"./types\";\n\nexport { buttonClasses };\n\nexport type HvButtonClasses = ExtractNames<typeof useClasses>;\n\nexport type HvButtonProps<C extends React.ElementType = \"button\"> =\n  PolymorphicComponentRef<\n    C,\n    {\n      /** Use the variant prop to change the visual style of the button. */\n      variant?: HvButtonVariant;\n      /** Whether the button is an icon-only button. */\n      icon?: boolean;\n      /** Whether the button is disabled or not. */\n      disabled?: boolean;\n      /** Class names to be applied. */\n      className?: string;\n      /** Element placed before the children. */\n      startIcon?: React.ReactNode;\n      /** Element placed after the children. */\n      endIcon?: React.ReactNode;\n      /** Button size. */\n      size?: HvButtonSize;\n      /** Button border radius. */\n      radius?: HvButtonRadius;\n      /** Defines the default colors of the button are forced into the icon. */\n      overrideIconColors?: boolean;\n      /** A Jss Object used to override or extend the styles applied. */\n      classes?: HvButtonClasses;\n      /** Whether the button is selected or not. */\n      selected?: boolean;\n      /**\n       * Whether the button is focusable when disabled.\n       * Without this property, the accessibility of the button decreases when disabled since it's not read by screen readers.\n       * Set this property to `true` when you need the button to still be focusable when disabled for accessibility purposes.\n       */\n      focusableWhenDisabled?: boolean;\n    }\n  >;\n\n/**\n * Normalize the button variant. It's meant to give us some retro-compatibility with\n * the DS 3.6 API.\n * @returns the normalized variant in DS 5 API\n */\nconst mapVariant = (\n  variant: HvButtonVariant,\n  theme?: string\n): HvButtonVariant => {\n  if (theme === \"ds3\") return variant;\n\n  const deprecatedVariantMap: Record<string, HvButtonVariant> = {\n    secondary: \"secondarySubtle\",\n    ghost: \"primaryGhost\",\n  };\n\n  const mappedVariant = deprecatedVariantMap[variant];\n\n  if (import.meta.env.DEV && mappedVariant) {\n    // eslint-disable-next-line no-console\n    console.warn(\n      `Button variant '${variant}' is deprecated. Please use '${mappedVariant}'.`\n    );\n  }\n\n  return mappedVariant || variant;\n};\n\n/**\n * Button component is used to trigger an action or event.\n */\nexport const HvButton = fixedForwardRef(function HvButton<\n  C extends React.ElementType = \"button\"\n>(props: HvButtonProps<C>, ref: PolymorphicRef<C>) {\n  const {\n    classes: classesProp,\n    children,\n    variant: variantProp, // TODO - should we split into two props (color and type) in v6?\n    disabled = false,\n    className,\n    startIcon,\n    endIcon,\n    icon = false,\n    size,\n    radius,\n    overrideIconColors = true,\n    component: Component = \"button\",\n    focusableWhenDisabled,\n    onClick: onClickProp,\n    onMouseDown: onMouseDownProp,\n    selected,\n    ...others\n  } = useDefaultProps(\"HvButton\", props);\n  const { classes, css, cx } = useClasses(classesProp);\n  const { activeTheme } = useTheme();\n  const variant = mapVariant(\n    variantProp ?? (icon ? \"secondaryGhost\" : \"primary\"),\n    activeTheme?.name\n  );\n\n  const handleClick: HvButtonProps[\"onClick\"] = (e) => {\n    if (disabled) return;\n    onClickProp?.(e);\n  };\n\n  const handleMouseDown: HvButtonProps[\"onMouseDown\"] = (e) => {\n    if (disabled) return;\n    onMouseDownProp?.(e);\n  };\n\n  const [color, type] = useMemo(() => {\n    const result = variant.split(/(?=[A-Z])/);\n    if (\n      result[0] === \"ghost\" ||\n      result[0] === \"semantic\" ||\n      (result[0] === \"secondary\" && !result[1])\n    )\n      return [];\n    return result.map((x) => x.toLowerCase());\n  }, [variant]);\n\n  return (\n    <Component\n      ref={ref}\n      className={cx(\n        classes.root,\n        type && classes[type],\n        color && css(getColoringStyle(color, type)),\n        classes[variant], // Placed after type and color CSS for DS3 override\n        size && !icon && css(getSizeStyles(size)),\n        radius && css(getRadiusStyles(radius)),\n        overrideIconColors && css(getOverrideColors()),\n        {\n          [classes.icon]: icon,\n          [classes.disabled]: disabled,\n        },\n        size && icon && css(getIconSizeStyles(size)),\n        className\n      )}\n      onClick={handleClick}\n      onMouseDown={handleMouseDown}\n      {...(Component === \"button\" && { type: \"button\" })}\n      {...(disabled && {\n        disabled: !focusableWhenDisabled,\n        tabIndex: focusableWhenDisabled ? 0 : -1,\n        \"aria-disabled\": true,\n      })}\n      {...(selected && { \"aria-pressed\": selected })}\n      {...others}\n    >\n      {startIcon && <span className={classes.startIcon}>{startIcon}</span>}\n      {children}\n      {endIcon && <span className={classes.endIcon}>{endIcon}</span>}\n    </Component>\n  );\n});\n"],"names":["fixedForwardRef","HvButton","useDefaultProps","useClasses","useTheme","useMemo","jsxs","getColoringStyle","getSizeStyles","getRadiusStyles","getOverrideColors","getIconSizeStyles"],"mappings":";;;;;;;;AAiEA,MAAM,aAAa,CACjB,SACA,UACoB;AACpB,MAAI,UAAU;AAAc,WAAA;AAE5B,QAAM,uBAAwD;AAAA,IAC5D,WAAW;AAAA,IACX,OAAO;AAAA,EAAA;AAGH,QAAA,gBAAgB,qBAAqB,OAAO;AASlD,SAAO,iBAAiB;AAC1B;AAKO,MAAM,WAAWA,QAAAA,gBAAgB,SAASC,UAE/C,OAAyB,KAAwB;AAC3C,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA,SAAS;AAAA;AAAA,IACT,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB,WAAW,YAAY;AAAA,IACvB;AAAA,IACA,SAAS;AAAA,IACT,aAAa;AAAA,IACb;AAAA,IACA,GAAG;AAAA,EAAA,IACDC,gBAAgB,gBAAA,YAAY,KAAK;AACrC,QAAM,EAAE,SAAS,KAAK,GAAG,IAAIC,cAAAA,WAAW,WAAW;AAC7C,QAAA,EAAE,gBAAgBC,SAAAA;AACxB,QAAM,UAAU;AAAA,IACd,gBAAgB,OAAO,mBAAmB;AAAA,IAC1C,aAAa;AAAA,EAAA;AAGT,QAAA,cAAwC,CAAC,MAAM;AAC/C,QAAA;AAAU;AACd,kBAAc,CAAC;AAAA,EAAA;AAGX,QAAA,kBAAgD,CAAC,MAAM;AACvD,QAAA;AAAU;AACd,sBAAkB,CAAC;AAAA,EAAA;AAGrB,QAAM,CAAC,OAAO,IAAI,IAAIC,cAAQ,MAAM;AAC5B,UAAA,SAAS,QAAQ,MAAM,WAAW;AACxC,QACE,OAAO,CAAC,MAAM,WACd,OAAO,CAAC,MAAM,cACb,OAAO,CAAC,MAAM,eAAe,CAAC,OAAO,CAAC;AAEvC,aAAO;AACT,WAAO,OAAO,IAAI,CAAC,MAAM,EAAE,aAAa;AAAA,EAAA,GACvC,CAAC,OAAO,CAAC;AAGV,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,QAAQ,QAAQ,IAAI;AAAA,QACpB,SAAS,IAAIC,cAAAA,iBAAiB,OAAO,IAAI,CAAC;AAAA,QAC1C,QAAQ,OAAO;AAAA;AAAA,QACf,QAAQ,CAAC,QAAQ,IAAIC,cAAA,cAAc,IAAI,CAAC;AAAA,QACxC,UAAU,IAAIC,8BAAgB,MAAM,CAAC;AAAA,QACrC,sBAAsB,IAAIC,cAAAA,mBAAmB;AAAA,QAC7C;AAAA,UACE,CAAC,QAAQ,IAAI,GAAG;AAAA,UAChB,CAAC,QAAQ,QAAQ,GAAG;AAAA,QACtB;AAAA,QACA,QAAQ,QAAQ,IAAIC,cAAA,kBAAkB,IAAI,CAAC;AAAA,QAC3C;AAAA,MACF;AAAA,MACA,SAAS;AAAA,MACT,aAAa;AAAA,MACZ,GAAI,cAAc,YAAY,EAAE,MAAM,SAAS;AAAA,MAC/C,GAAI,YAAY;AAAA,QACf,UAAU,CAAC;AAAA,QACX,UAAU,wBAAwB,IAAI;AAAA,QACtC,iBAAiB;AAAA,MACnB;AAAA,MACC,GAAI,YAAY,EAAE,gBAAgB,SAAS;AAAA,MAC3C,GAAG;AAAA,MAEH,UAAA;AAAA,QAAA,4CAAc,QAAA,EAAK,WAAW,QAAQ,WAAY,UAAU,WAAA;AAAA,QAC5D;AAAA,QACA,0CAAY,QAAA,EAAK,WAAW,QAAQ,SAAU,UAAQ,SAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG7D,CAAC;;;"}
+{"version":3,"file":"Button.cjs","sources":["../../../src/Button/Button.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useTheme } from \"../hooks/useTheme\";\nimport {\n  fixedForwardRef,\n  PolymorphicComponentRef,\n  PolymorphicRef,\n} from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport {\n  staticClasses as buttonClasses,\n  getColoringStyle,\n  getIconSizeStyles,\n  getOverrideColors,\n  getRadiusStyles,\n  getSizeStyles,\n  useClasses,\n} from \"./Button.styles\";\nimport { HvButtonRadius, HvButtonSize, HvButtonVariant } from \"./types\";\n\nexport { buttonClasses };\n\nexport type HvButtonClasses = ExtractNames<typeof useClasses>;\n\nexport type HvButtonProps<C extends React.ElementType = \"button\"> =\n  PolymorphicComponentRef<\n    C,\n    {\n      /** Use the variant prop to change the visual style of the button. */\n      variant?: HvButtonVariant;\n      /** Whether the button is an icon-only button. */\n      icon?: boolean;\n      /** Whether the button is disabled or not. */\n      disabled?: boolean;\n      /** Class names to be applied. */\n      className?: string;\n      /** Element placed before the children. */\n      startIcon?: React.ReactNode;\n      /** Element placed after the children. */\n      endIcon?: React.ReactNode;\n      /** Button size. */\n      size?: HvButtonSize;\n      /** Button border radius. */\n      radius?: HvButtonRadius;\n      /** Defines the default colors of the button are forced into the icon. */\n      overrideIconColors?: boolean;\n      /** A Jss Object used to override or extend the styles applied. */\n      classes?: HvButtonClasses;\n      /** Whether the button is selected or not. */\n      selected?: boolean;\n      /**\n       * Whether the button is focusable when disabled.\n       * Without this property, the accessibility of the button decreases when disabled since it's not read by screen readers.\n       * Set this property to `true` when you need the button to still be focusable when disabled for accessibility purposes.\n       */\n      focusableWhenDisabled?: boolean;\n    }\n  >;\n\n/**\n * Normalize the button variant. It's meant to give us some retro-compatibility with\n * the DS 3.6 API.\n * @returns the normalized variant in DS 5 API\n */\nconst mapVariant = (\n  variant: HvButtonVariant,\n  theme?: string,\n): HvButtonVariant => {\n  if (theme === \"ds3\") return variant;\n\n  const deprecatedVariantMap: Record<string, HvButtonVariant> = {\n    secondary: \"secondarySubtle\",\n    ghost: \"primaryGhost\",\n  };\n\n  const mappedVariant = deprecatedVariantMap[variant];\n\n  if (import.meta.env.DEV && mappedVariant) {\n    // eslint-disable-next-line no-console\n    console.warn(\n      `Button variant '${variant}' is deprecated. Please use '${mappedVariant}'.`,\n    );\n  }\n\n  return mappedVariant || variant;\n};\n\n/**\n * Button component is used to trigger an action or event.\n */\nexport const HvButton = fixedForwardRef(function HvButton<\n  C extends React.ElementType = \"button\",\n>(props: HvButtonProps<C>, ref: PolymorphicRef<C>) {\n  const {\n    classes: classesProp,\n    children,\n    variant: variantProp, // TODO - should we split into two props (color and type) in v6?\n    disabled = false,\n    className,\n    startIcon,\n    endIcon,\n    icon = false,\n    size,\n    radius,\n    overrideIconColors = true,\n    component: Component = \"button\",\n    focusableWhenDisabled,\n    onClick: onClickProp,\n    onMouseDown: onMouseDownProp,\n    selected,\n    ...others\n  } = useDefaultProps(\"HvButton\", props);\n  const { classes, css, cx } = useClasses(classesProp);\n  const { activeTheme } = useTheme();\n  const variant = mapVariant(\n    variantProp ?? (icon ? \"secondaryGhost\" : \"primary\"),\n    activeTheme?.name,\n  );\n\n  const handleClick: HvButtonProps[\"onClick\"] = (e) => {\n    if (disabled) return;\n    onClickProp?.(e);\n  };\n\n  const handleMouseDown: HvButtonProps[\"onMouseDown\"] = (e) => {\n    if (disabled) return;\n    onMouseDownProp?.(e);\n  };\n\n  const [color, type] = useMemo(() => {\n    const result = variant.split(/(?=[A-Z])/);\n    if (\n      result[0] === \"ghost\" ||\n      result[0] === \"semantic\" ||\n      (result[0] === \"secondary\" && !result[1])\n    )\n      return [];\n    return result.map((x) => x.toLowerCase());\n  }, [variant]);\n\n  return (\n    <Component\n      ref={ref}\n      className={cx(\n        classes.root,\n        type && classes[type],\n        color && css(getColoringStyle(color, type)),\n        classes[variant], // Placed after type and color CSS for DS3 override\n        size && !icon && css(getSizeStyles(size)),\n        radius && css(getRadiusStyles(radius)),\n        overrideIconColors && css(getOverrideColors()),\n        {\n          [classes.icon]: icon,\n          [classes.disabled]: disabled,\n        },\n        size && icon && css(getIconSizeStyles(size)),\n        className,\n      )}\n      onClick={handleClick}\n      onMouseDown={handleMouseDown}\n      {...(Component === \"button\" && { type: \"button\" })}\n      {...(disabled && {\n        disabled: !focusableWhenDisabled,\n        tabIndex: focusableWhenDisabled ? 0 : -1,\n        \"aria-disabled\": true,\n      })}\n      {...(selected && { \"aria-pressed\": selected })}\n      {...others}\n    >\n      {startIcon && <span className={classes.startIcon}>{startIcon}</span>}\n      {children}\n      {endIcon && <span className={classes.endIcon}>{endIcon}</span>}\n    </Component>\n  );\n});\n"],"names":["fixedForwardRef","HvButton","useDefaultProps","useClasses","useTheme","useMemo","jsxs","getColoringStyle","getSizeStyles","getRadiusStyles","getOverrideColors","getIconSizeStyles"],"mappings":";;;;;;;;AAiEA,MAAM,aAAa,CACjB,SACA,UACoB;AACpB,MAAI,UAAU;AAAc,WAAA;AAE5B,QAAM,uBAAwD;AAAA,IAC5D,WAAW;AAAA,IACX,OAAO;AAAA,EAAA;AAGH,QAAA,gBAAgB,qBAAqB,OAAO;AASlD,SAAO,iBAAiB;AAC1B;AAKO,MAAM,WAAWA,QAAAA,gBAAgB,SAASC,UAE/C,OAAyB,KAAwB;AAC3C,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA,SAAS;AAAA;AAAA,IACT,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB,WAAW,YAAY;AAAA,IACvB;AAAA,IACA,SAAS;AAAA,IACT,aAAa;AAAA,IACb;AAAA,IACA,GAAG;AAAA,EAAA,IACDC,gBAAgB,gBAAA,YAAY,KAAK;AACrC,QAAM,EAAE,SAAS,KAAK,GAAG,IAAIC,cAAAA,WAAW,WAAW;AAC7C,QAAA,EAAE,gBAAgBC,SAAAA;AACxB,QAAM,UAAU;AAAA,IACd,gBAAgB,OAAO,mBAAmB;AAAA,IAC1C,aAAa;AAAA,EAAA;AAGT,QAAA,cAAwC,CAAC,MAAM;AAC/C,QAAA;AAAU;AACd,kBAAc,CAAC;AAAA,EAAA;AAGX,QAAA,kBAAgD,CAAC,MAAM;AACvD,QAAA;AAAU;AACd,sBAAkB,CAAC;AAAA,EAAA;AAGrB,QAAM,CAAC,OAAO,IAAI,IAAIC,cAAQ,MAAM;AAC5B,UAAA,SAAS,QAAQ,MAAM,WAAW;AACxC,QACE,OAAO,CAAC,MAAM,WACd,OAAO,CAAC,MAAM,cACb,OAAO,CAAC,MAAM,eAAe,CAAC,OAAO,CAAC;AAEvC,aAAO;AACT,WAAO,OAAO,IAAI,CAAC,MAAM,EAAE,aAAa;AAAA,EAAA,GACvC,CAAC,OAAO,CAAC;AAGV,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,QAAQ,QAAQ,IAAI;AAAA,QACpB,SAAS,IAAIC,cAAAA,iBAAiB,OAAO,IAAI,CAAC;AAAA,QAC1C,QAAQ,OAAO;AAAA;AAAA,QACf,QAAQ,CAAC,QAAQ,IAAIC,cAAA,cAAc,IAAI,CAAC;AAAA,QACxC,UAAU,IAAIC,8BAAgB,MAAM,CAAC;AAAA,QACrC,sBAAsB,IAAIC,cAAAA,mBAAmB;AAAA,QAC7C;AAAA,UACE,CAAC,QAAQ,IAAI,GAAG;AAAA,UAChB,CAAC,QAAQ,QAAQ,GAAG;AAAA,QACtB;AAAA,QACA,QAAQ,QAAQ,IAAIC,cAAA,kBAAkB,IAAI,CAAC;AAAA,QAC3C;AAAA,MACF;AAAA,MACA,SAAS;AAAA,MACT,aAAa;AAAA,MACZ,GAAI,cAAc,YAAY,EAAE,MAAM,SAAS;AAAA,MAC/C,GAAI,YAAY;AAAA,QACf,UAAU,CAAC;AAAA,QACX,UAAU,wBAAwB,IAAI;AAAA,QACtC,iBAAiB;AAAA,MACnB;AAAA,MACC,GAAI,YAAY,EAAE,gBAAgB,SAAS;AAAA,MAC3C,GAAG;AAAA,MAEH,UAAA;AAAA,QAAA,4CAAc,QAAA,EAAK,WAAW,QAAQ,WAAY,UAAU,WAAA;AAAA,QAC5D;AAAA,QACA,0CAAY,QAAA,EAAK,WAAW,QAAQ,SAAU,UAAQ,SAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG7D,CAAC;;;"}

package/dist/cjs/Button/Button.styles.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const focusUtils = require("../utils/focusUtils.cjs");
 const classes = require("../utils/classes.cjs");
+const focusUtils = require("../utils/focusUtils.cjs");
 const { staticClasses, useClasses } = classes.createClasses("HvButton", {
   root: {
     display: "inline-flex",

package/dist/cjs/Button/Button.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Button.styles.cjs","sources":["../../../src/Button/Button.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { createClasses } from \"../utils/classes\";\nimport { HvButtonRadius, HvButtonSize } from \"./types\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvButton\", {\n  root: {\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    textTransform: \"none\",\n    cursor: \"pointer\",\n    whiteSpace: \"nowrap\",\n\n    // Background color common for almost all variants\n    \"&:hover\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n    },\n    \"&:focus-visible\": {\n      ...outlineStyles,\n      backgroundColor: theme.colors.containerBackgroundHover,\n    },\n\n    // Default button - no size specified\n    fontFamily: theme.fontFamily.body,\n    ...theme.typography.label,\n    height: \"32px\",\n    border: \"1px solid currentcolor\",\n    borderRadius: theme.radii.base,\n    padding: theme.spacing(0, \"sm\"),\n  },\n  startIcon: {\n    marginLeft: `calc(-1 * ${theme.space.xs})`,\n  },\n  endIcon: {\n    marginRight: `calc(-1 * ${theme.space.xs})`,\n  },\n  focusVisible: {},\n  disabled: {\n    cursor: \"not-allowed\",\n    color: theme.colors.secondary_60,\n    borderColor: theme.colors.atmo3,\n    backgroundColor: theme.colors.atmo3,\n    \"&:hover, &:focus-visible\": {\n      backgroundColor: theme.colors.atmo3,\n      borderColor: theme.colors.atmo3,\n    },\n  },\n  icon: {\n    margin: 0,\n    padding: 0,\n    height: \"fit-content\",\n    \"& > *\": {\n      margin: -1,\n    },\n  },\n  subtle: {\n    backgroundColor: \"transparent\",\n    \"&$disabled\": {\n      backgroundColor: \"transparent\",\n      \"&:hover, &:focus-visible\": {\n        backgroundColor: \"transparent\",\n      },\n    },\n  },\n  ghost: {\n    borderColor: \"transparent\",\n    backgroundColor: \"transparent\",\n    \"&$disabled\": {\n      borderColor: \"transparent\",\n      backgroundColor: \"transparent\",\n      \"&:hover, &:focus-visible\": {\n        borderColor: \"transparent\",\n        backgroundColor: \"transparent\",\n      },\n    },\n  },\n  semantic: {\n    color: theme.colors.base_dark,\n    backgroundColor: \"transparent\",\n    borderColor: \"transparent\",\n    \"&:hover, &:focus-visible\": {\n      backgroundColor: \"rgba(251, 252, 252, 0.3)\",\n    },\n    \"&$disabled\": {\n      backgroundColor: \"rgba(251, 252, 252, 0.1)\",\n    },\n  },\n\n  // TODO - remove in v6\n  primary: {},\n  primarySubtle: {},\n  primaryGhost: {},\n  secondarySubtle: {},\n  secondaryGhost: {},\n\n  // Deprecated (DS3)\n  secondary: {},\n});\n\nexport const getColoringStyle = (color: string, type?: string) => {\n  if (type)\n    return {\n      color: theme.colors[color !== \"warning\" ? color : `${color}_140`],\n    };\n\n  const bg = theme.colors[color !== \"warning\" ? color : `${color}_120`];\n  const hoverBg =\n    theme.colors[color !== \"warning\" ? `${color}_80` : `${color}_140`];\n  return {\n    color: theme.colors.atmo1,\n    backgroundColor: bg,\n    borderColor: bg,\n    \"&:hover, &:focus-visible\": {\n      backgroundColor: hoverBg,\n      borderColor: hoverBg,\n    },\n  };\n};\n\nexport const getRadiusStyles = (radius: HvButtonRadius) => ({\n  borderRadius: theme.radii[radius],\n});\n\n// TODO - remove xs and xl in v6 since they are not DS spec\nconst sizes = {\n  xs: { height: \"24px\", space: \"sm\", typography: \"captionLabel\" },\n  sm: { height: \"24px\", space: \"sm\", typography: \"captionLabel\" },\n  md: { height: \"32px\", space: \"sm\", typography: \"label\" },\n  lg: { height: \"48px\", space: \"md\", typography: \"label\" },\n  xl: { height: \"48px\", space: \"md\", typography: \"label\" },\n};\n\nexport const getSizeStyles = (size: HvButtonSize) => {\n  const { height, space, typography } = sizes[size];\n  const { color, ...typoProps } = theme.typography[typography];\n  return {\n    height,\n    padding: theme.spacing(0, space),\n    ...typoProps,\n  };\n};\n\nexport const getIconSizeStyles = (size: HvButtonSize) => {\n  const { height } = sizes[size];\n  return {\n    height,\n    width: height,\n  };\n};\n\nexport const getOverrideColors = () => ({\n  \"& svg .color0\": {\n    fill: \"currentcolor\",\n  },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;;;AAMO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,YAAY;AAAA,EACrE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,QAAQ;AAAA,IACR,YAAY;AAAA;AAAA,IAGZ,WAAW;AAAA,MACT,iBAAiBC,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAGC,WAAA;AAAA,MACH,iBAAiBD,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA;AAAA,IAGA,YAAYA,YAAAA,MAAM,WAAW;AAAA,IAC7B,GAAGA,YAAAA,MAAM,WAAW;AAAA,IACpB,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,cAAcA,YAAAA,MAAM,MAAM;AAAA,IAC1B,SAASA,YAAA,MAAM,QAAQ,GAAG,IAAI;AAAA,EAChC;AAAA,EACA,WAAW;AAAA,IACT,YAAY,aAAaA,YAAAA,MAAM,MAAM,EAAE;AAAA,EACzC;AAAA,EACA,SAAS;AAAA,IACP,aAAa,aAAaA,YAAAA,MAAM,MAAM,EAAE;AAAA,EAC1C;AAAA,EACA,cAAc,CAAC;AAAA,EACf,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,aAAaA,YAAAA,MAAM,OAAO;AAAA,IAC1B,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAC9B,4BAA4B;AAAA,MAC1B,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAC9B,aAAaA,YAAAA,MAAM,OAAO;AAAA,IAC5B;AAAA,EACF;AAAA,EACA,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,SAAS;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,QAAQ;AAAA,IACN,iBAAiB;AAAA,IACjB,cAAc;AAAA,MACZ,iBAAiB;AAAA,MACjB,4BAA4B;AAAA,QAC1B,iBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,aAAa;AAAA,IACb,iBAAiB;AAAA,IACjB,cAAc;AAAA,MACZ,aAAa;AAAA,MACb,iBAAiB;AAAA,MACjB,4BAA4B;AAAA,QAC1B,aAAa;AAAA,QACb,iBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,4BAA4B;AAAA,MAC1B,iBAAiB;AAAA,IACnB;AAAA,IACA,cAAc;AAAA,MACZ,iBAAiB;AAAA,IACnB;AAAA,EACF;AAAA;AAAA,EAGA,SAAS,CAAC;AAAA,EACV,eAAe,CAAC;AAAA,EAChB,cAAc,CAAC;AAAA,EACf,iBAAiB,CAAC;AAAA,EAClB,gBAAgB,CAAC;AAAA;AAAA,EAGjB,WAAW,CAAC;AACd,CAAC;AAEY,MAAA,mBAAmB,CAAC,OAAe,SAAkB;AAC5D,MAAA;AACK,WAAA;AAAA,MACL,OAAOA,YAAAA,MAAM,OAAO,UAAU,YAAY,QAAQ,GAAG,KAAK,MAAM;AAAA,IAAA;AAG9D,QAAA,KAAKA,YAAAA,MAAM,OAAO,UAAU,YAAY,QAAQ,GAAG,KAAK,MAAM;AAC9D,QAAA,UACJA,YAAM,MAAA,OAAO,UAAU,YAAY,GAAG,KAAK,QAAQ,GAAG,KAAK,MAAM;AAC5D,SAAA;AAAA,IACL,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,4BAA4B;AAAA,MAC1B,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EAAA;AAEJ;AAEa,MAAA,kBAAkB,CAAC,YAA4B;AAAA,EAC1D,cAAcA,YAAAA,MAAM,MAAM,MAAM;AAClC;AAGA,MAAM,QAAQ;AAAA,EACZ,IAAI,EAAE,QAAQ,QAAQ,OAAO,MAAM,YAAY,eAAe;AAAA,EAC9D,IAAI,EAAE,QAAQ,QAAQ,OAAO,MAAM,YAAY,eAAe;AAAA,EAC9D,IAAI,EAAE,QAAQ,QAAQ,OAAO,MAAM,YAAY,QAAQ;AAAA,EACvD,IAAI,EAAE,QAAQ,QAAQ,OAAO,MAAM,YAAY,QAAQ;AAAA,EACvD,IAAI,EAAE,QAAQ,QAAQ,OAAO,MAAM,YAAY,QAAQ;AACzD;AAEa,MAAA,gBAAgB,CAAC,SAAuB;AACnD,QAAM,EAAE,QAAQ,OAAO,WAAW,IAAI,MAAM,IAAI;AAChD,QAAM,EAAE,OAAO,GAAG,cAAcA,YAAAA,MAAM,WAAW,UAAU;AACpD,SAAA;AAAA,IACL;AAAA,IACA,SAASA,YAAA,MAAM,QAAQ,GAAG,KAAK;AAAA,IAC/B,GAAG;AAAA,EAAA;AAEP;AAEa,MAAA,oBAAoB,CAAC,SAAuB;AACvD,QAAM,EAAE,OAAA,IAAW,MAAM,IAAI;AACtB,SAAA;AAAA,IACL;AAAA,IACA,OAAO;AAAA,EAAA;AAEX;AAEO,MAAM,oBAAoB,OAAO;AAAA,EACtC,iBAAiB;AAAA,IACf,MAAM;AAAA,EACR;AACF;;;;;;;;"}
+{"version":3,"file":"Button.styles.cjs","sources":["../../../src/Button/Button.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { HvButtonRadius, HvButtonSize } from \"./types\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvButton\", {\n  root: {\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    textTransform: \"none\",\n    cursor: \"pointer\",\n    whiteSpace: \"nowrap\",\n\n    // Background color common for almost all variants\n    \"&:hover\": {\n      backgroundColor: theme.colors.containerBackgroundHover,\n    },\n    \"&:focus-visible\": {\n      ...outlineStyles,\n      backgroundColor: theme.colors.containerBackgroundHover,\n    },\n\n    // Default button - no size specified\n    fontFamily: theme.fontFamily.body,\n    ...theme.typography.label,\n    height: \"32px\",\n    border: \"1px solid currentcolor\",\n    borderRadius: theme.radii.base,\n    padding: theme.spacing(0, \"sm\"),\n  },\n  startIcon: {\n    marginLeft: `calc(-1 * ${theme.space.xs})`,\n  },\n  endIcon: {\n    marginRight: `calc(-1 * ${theme.space.xs})`,\n  },\n  focusVisible: {},\n  disabled: {\n    cursor: \"not-allowed\",\n    color: theme.colors.secondary_60,\n    borderColor: theme.colors.atmo3,\n    backgroundColor: theme.colors.atmo3,\n    \"&:hover, &:focus-visible\": {\n      backgroundColor: theme.colors.atmo3,\n      borderColor: theme.colors.atmo3,\n    },\n  },\n  icon: {\n    margin: 0,\n    padding: 0,\n    height: \"fit-content\",\n    \"& > *\": {\n      margin: -1,\n    },\n  },\n  subtle: {\n    backgroundColor: \"transparent\",\n    \"&$disabled\": {\n      backgroundColor: \"transparent\",\n      \"&:hover, &:focus-visible\": {\n        backgroundColor: \"transparent\",\n      },\n    },\n  },\n  ghost: {\n    borderColor: \"transparent\",\n    backgroundColor: \"transparent\",\n    \"&$disabled\": {\n      borderColor: \"transparent\",\n      backgroundColor: \"transparent\",\n      \"&:hover, &:focus-visible\": {\n        borderColor: \"transparent\",\n        backgroundColor: \"transparent\",\n      },\n    },\n  },\n  semantic: {\n    color: theme.colors.base_dark,\n    backgroundColor: \"transparent\",\n    borderColor: \"transparent\",\n    \"&:hover, &:focus-visible\": {\n      backgroundColor: \"rgba(251, 252, 252, 0.3)\",\n    },\n    \"&$disabled\": {\n      backgroundColor: \"rgba(251, 252, 252, 0.1)\",\n    },\n  },\n\n  // TODO - remove in v6\n  primary: {},\n  primarySubtle: {},\n  primaryGhost: {},\n  secondarySubtle: {},\n  secondaryGhost: {},\n\n  // Deprecated (DS3)\n  secondary: {},\n});\n\nexport const getColoringStyle = (color: string, type?: string) => {\n  if (type)\n    return {\n      color: theme.colors[color !== \"warning\" ? color : `${color}_140`],\n    };\n\n  const bg = theme.colors[color !== \"warning\" ? color : `${color}_120`];\n  const hoverBg =\n    theme.colors[color !== \"warning\" ? `${color}_80` : `${color}_140`];\n  return {\n    color: theme.colors.atmo1,\n    backgroundColor: bg,\n    borderColor: bg,\n    \"&:hover, &:focus-visible\": {\n      backgroundColor: hoverBg,\n      borderColor: hoverBg,\n    },\n  };\n};\n\nexport const getRadiusStyles = (radius: HvButtonRadius) => ({\n  borderRadius: theme.radii[radius],\n});\n\n// TODO - remove xs and xl in v6 since they are not DS spec\nconst sizes = {\n  xs: { height: \"24px\", space: \"sm\", typography: \"captionLabel\" },\n  sm: { height: \"24px\", space: \"sm\", typography: \"captionLabel\" },\n  md: { height: \"32px\", space: \"sm\", typography: \"label\" },\n  lg: { height: \"48px\", space: \"md\", typography: \"label\" },\n  xl: { height: \"48px\", space: \"md\", typography: \"label\" },\n};\n\nexport const getSizeStyles = (size: HvButtonSize) => {\n  const { height, space, typography } = sizes[size];\n  const { color, ...typoProps } = theme.typography[typography];\n  return {\n    height,\n    padding: theme.spacing(0, space),\n    ...typoProps,\n  };\n};\n\nexport const getIconSizeStyles = (size: HvButtonSize) => {\n  const { height } = sizes[size];\n  return {\n    height,\n    width: height,\n  };\n};\n\nexport const getOverrideColors = () => ({\n  \"& svg .color0\": {\n    fill: \"currentcolor\",\n  },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":"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"}

package/dist/cjs/Calendar/Calendar.cjs

@@ -4,8 +4,8 @@ const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useDefaultProps = require("../hooks/useDefaultProps.cjs");
 const setId = require("../utils/setId.cjs");
-const utils = require("./utils.cjs");
 const Calendar_styles = require("./Calendar.styles.cjs");
+const utils = require("./utils.cjs");
 const SingleCalendar = require("./SingleCalendar/SingleCalendar.cjs");
 const FormElementContext = require("../Forms/FormElement/context/FormElementContext.cjs");
 const FormElementValueContext = require("../Forms/FormElement/context/FormElementValueContext.cjs");

package/dist/cjs/Calendar/Calendar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.cjs","sources":["../../../src/Calendar/Calendar.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { setId } from \"../utils/setId\";\nimport { HvFormElementContext, HvFormElementValueContext } from \"../Forms\";\n\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { isRange } from \"./utils\";\nimport { HvSingleCalendar } from \"./SingleCalendar\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"./types\";\n\nimport { staticClasses, useClasses } from \"./Calendar.styles\";\n\nexport { staticClasses as calendarClasses };\n\nexport type HvCalendarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCalendarProps {\n  /**\n   * Styles applied from the theme.\n   */\n  classes?: HvCalendarClasses;\n  /**\n   * Identifier.\n   */\n  id?: string;\n  /**\n   * The calendar locale. If undefined, it defaults to en-US\n   *\n   */\n  locale?: string;\n  /**\n   * Date that the calendar would show.\n   * if using the object format the calendar enter in range mode showing two calendars\n   */\n  value?: DateRangeProp | Date;\n  /**\n   * Controls the visible month of the Calendar\n   */\n  visibleMonth?: number;\n  /**\n   * Controls the visible year of the Calendar\n   */\n  visibleYear?: number;\n  /**\n   * Controls the visible month of the Calendar on the right side of the datepicker\n   */\n  rightVisibleMonth?: number;\n  /**\n   * Controls the visible year of the Calendar on the right side of the datepicker\n   */\n  rightVisibleYear?: number;\n  /**\n   * Callback function to be triggered when the selected date has changed.\n   */\n  onChange?: (\n    event:\n      | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n      | undefined,\n    value: Date | DateRangeProp\n  ) => void;\n  /**\n   * Callback function to be triggered when the selected date input has changed.\n   */\n  onInputChange?: (\n    event:\n      | React.ChangeEvent<\n          HTMLTextAreaElement | HTMLInputElement | HTMLButtonElement\n        >\n      | undefined,\n    value: Date | DateRangeProp,\n    position: \"left\" | \"right\"\n  ) => void;\n  /**\n   * Callback function to be triggered when the user clicks on the month or year selector.\n   * it receives the action that was pressed:\n   * previous_month, next_month, previous_year, next_year,month\n   */\n  onVisibleDateChange?: (\n    event:\n      | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n      | undefined,\n    action: VisibilitySelectorActions,\n    value?: Date | DateRangeProp | number,\n    position?: \"left\" | \"right\"\n  ) => void;\n  /**\n   * The maximum selectable date after this all values are disabled.\n   */\n  maximumDate?: Date;\n  /**\n   * The minimum selectable date before this all values are disabled.\n   */\n  minimumDate?: Date;\n  /**\n   * An element placed before the Calendar\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * Indicates if header should display the day of week.\n   */\n  showDayOfWeek?: boolean;\n  /**\n   * Label shown when date is invalid.\n   */\n  invalidDateLabel?: string;\n}\n\nexport const HvCalendar = (props: HvCalendarProps) => {\n  const {\n    classes: classesProp,\n    id,\n    locale = \"en-US\",\n    value,\n    visibleMonth,\n    visibleYear,\n    rightVisibleMonth,\n    rightVisibleYear,\n    minimumDate,\n    maximumDate,\n    startAdornment,\n    onChange,\n    onInputChange,\n    onVisibleDateChange,\n    invalidDateLabel,\n    ...others\n  } = useDefaultProps(\"HvCalendar\", props);\n  const { classes } = useClasses(classesProp);\n\n  const { elementId } = useContext(HvFormElementContext);\n  const elementValue = useContext(HvFormElementValueContext);\n  const localValue = value ?? elementValue;\n  const localId = id ?? setId(elementId, \"single-calendar\");\n  const rangeMode = isRange(localValue);\n  const rightCalendarId = setId(localId, \"single-calendar-right\");\n  const clampedMonth =\n    visibleMonth && visibleMonth % 13 > 0 ? visibleMonth % 13 : 1;\n\n  const singleCalendar = (\n    <HvSingleCalendar\n      id={localId}\n      locale={locale}\n      value={localValue}\n      visibleMonth={clampedMonth}\n      visibleYear={visibleYear}\n      minimumDate={minimumDate}\n      maximumDate={maximumDate}\n      onChange={onChange}\n      onInputChange={(evt, date) =>\n        onInputChange && onInputChange(evt, date, \"left\")\n      }\n      onVisibleDateChange={onVisibleDateChange}\n      invalidDateLabel={invalidDateLabel}\n      {...others}\n    />\n  );\n\n  const rangeCalendar = (\n    <div className={classes.rangeCalendarContainer}>\n      <HvSingleCalendar\n        className={classes.singleCalendar}\n        id={localId}\n        locale={locale}\n        value={localValue}\n        visibleMonth={clampedMonth}\n        visibleYear={visibleYear}\n        minimumDate={minimumDate}\n        maximumDate={maximumDate}\n        onChange={onChange}\n        onInputChange={(evt, date) =>\n          onInputChange && onInputChange(evt, date, \"left\")\n        }\n        onVisibleDateChange={(event, action, index) =>\n          onVisibleDateChange?.(event, action, index, \"left\")\n        }\n        invalidDateLabel={invalidDateLabel}\n        {...others}\n      />\n\n      <HvSingleCalendar\n        className={classes.singleCalendar}\n        id={rightCalendarId}\n        locale={locale}\n        value={localValue}\n        visibleMonth={rightVisibleMonth}\n        visibleYear={rightVisibleYear}\n        minimumDate={minimumDate}\n        maximumDate={maximumDate}\n        onChange={onChange}\n        onInputChange={(evt, date) =>\n          onInputChange && onInputChange(evt, date, \"right\")\n        }\n        onVisibleDateChange={(event, action, index) => {\n          onVisibleDateChange?.(event, action, index, \"right\");\n        }}\n        showEndDate\n        invalidDateLabel={invalidDateLabel}\n        {...others}\n      />\n    </div>\n  );\n\n  return (\n    <div className={classes.root}>\n      {startAdornment}\n      {rangeMode ? rangeCalendar : singleCalendar}\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","useContext","HvFormElementContext","HvFormElementValueContext","setId","isRange","jsx","HvSingleCalendar","jsxs"],"mappings":";;;;;;;;;;;AA8Ga,MAAA,aAAa,CAAC,UAA2B;AAC9C,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,cAAc,KAAK;AACvC,QAAM,EAAE,QAAA,IAAYC,gBAAA,WAAW,WAAW;AAE1C,QAAM,EAAE,UAAA,IAAcC,MAAA,WAAWC,mBAAoB,oBAAA;AAC/C,QAAA,eAAeD,iBAAWE,wBAAAA,yBAAyB;AACzD,QAAM,aAAa,SAAS;AAC5B,QAAM,UAAU,MAAMC,MAAM,MAAA,WAAW,iBAAiB;AAClD,QAAA,YAAYC,cAAQ,UAAU;AAC9B,QAAA,kBAAkBD,MAAAA,MAAM,SAAS,uBAAuB;AAC9D,QAAM,eACJ,gBAAgB,eAAe,KAAK,IAAI,eAAe,KAAK;AAE9D,QAAM,iBACJE,2BAAA;AAAA,IAACC,eAAA;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,MACP,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe,CAAC,KAAK,SACnB,iBAAiB,cAAc,KAAK,MAAM,MAAM;AAAA,MAElD;AAAA,MACA;AAAA,MACC,GAAG;AAAA,IAAA;AAAA,EAAA;AAIR,QAAM,gBACJC,2BAAAA,KAAC,OAAI,EAAA,WAAW,QAAQ,wBACtB,UAAA;AAAA,IAAAF,2BAAA;AAAA,MAACC,eAAA;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,IAAI;AAAA,QACJ;AAAA,QACA,OAAO;AAAA,QACP,cAAc;AAAA,QACd;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe,CAAC,KAAK,SACnB,iBAAiB,cAAc,KAAK,MAAM,MAAM;AAAA,QAElD,qBAAqB,CAAC,OAAO,QAAQ,UACnC,sBAAsB,OAAO,QAAQ,OAAO,MAAM;AAAA,QAEpD;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,IACN;AAAA,IAEAD,2BAAA;AAAA,MAACC,eAAA;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,IAAI;AAAA,QACJ;AAAA,QACA,OAAO;AAAA,QACP,cAAc;AAAA,QACd,aAAa;AAAA,QACb;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe,CAAC,KAAK,SACnB,iBAAiB,cAAc,KAAK,MAAM,OAAO;AAAA,QAEnD,qBAAqB,CAAC,OAAO,QAAQ,UAAU;AACvB,gCAAA,OAAO,QAAQ,OAAO,OAAO;AAAA,QACrD;AAAA,QACA,aAAW;AAAA,QACX;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,IACN;AAAA,EACF,EAAA,CAAA;AAGF,SACGC,2BAAAA,KAAA,OAAA,EAAI,WAAW,QAAQ,MACrB,UAAA;AAAA,IAAA;AAAA,IACA,YAAY,gBAAgB;AAAA,EAC/B,EAAA,CAAA;AAEJ;;;"}
+{"version":3,"file":"Calendar.cjs","sources":["../../../src/Calendar/Calendar.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { HvFormElementContext, HvFormElementValueContext } from \"../Forms\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./Calendar.styles\";\nimport { HvSingleCalendar } from \"./SingleCalendar\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"./types\";\nimport { isRange } from \"./utils\";\n\nexport { staticClasses as calendarClasses };\n\nexport type HvCalendarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCalendarProps {\n  /**\n   * Styles applied from the theme.\n   */\n  classes?: HvCalendarClasses;\n  /**\n   * Identifier.\n   */\n  id?: string;\n  /**\n   * The calendar locale. If undefined, it defaults to en-US\n   *\n   */\n  locale?: string;\n  /**\n   * Date that the calendar would show.\n   * if using the object format the calendar enter in range mode showing two calendars\n   */\n  value?: DateRangeProp | Date;\n  /**\n   * Controls the visible month of the Calendar\n   */\n  visibleMonth?: number;\n  /**\n   * Controls the visible year of the Calendar\n   */\n  visibleYear?: number;\n  /**\n   * Controls the visible month of the Calendar on the right side of the datepicker\n   */\n  rightVisibleMonth?: number;\n  /**\n   * Controls the visible year of the Calendar on the right side of the datepicker\n   */\n  rightVisibleYear?: number;\n  /**\n   * Callback function to be triggered when the selected date has changed.\n   */\n  onChange?: (\n    event:\n      | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n      | undefined,\n    value: Date | DateRangeProp,\n  ) => void;\n  /**\n   * Callback function to be triggered when the selected date input has changed.\n   */\n  onInputChange?: (\n    event:\n      | React.ChangeEvent<\n          HTMLTextAreaElement | HTMLInputElement | HTMLButtonElement\n        >\n      | undefined,\n    value: Date | DateRangeProp,\n    position: \"left\" | \"right\",\n  ) => void;\n  /**\n   * Callback function to be triggered when the user clicks on the month or year selector.\n   * it receives the action that was pressed:\n   * previous_month, next_month, previous_year, next_year,month\n   */\n  onVisibleDateChange?: (\n    event:\n      | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n      | undefined,\n    action: VisibilitySelectorActions,\n    value?: Date | DateRangeProp | number,\n    position?: \"left\" | \"right\",\n  ) => void;\n  /**\n   * The maximum selectable date after this all values are disabled.\n   */\n  maximumDate?: Date;\n  /**\n   * The minimum selectable date before this all values are disabled.\n   */\n  minimumDate?: Date;\n  /**\n   * An element placed before the Calendar\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * Indicates if header should display the day of week.\n   */\n  showDayOfWeek?: boolean;\n  /**\n   * Label shown when date is invalid.\n   */\n  invalidDateLabel?: string;\n}\n\nexport const HvCalendar = (props: HvCalendarProps) => {\n  const {\n    classes: classesProp,\n    id,\n    locale = \"en-US\",\n    value,\n    visibleMonth,\n    visibleYear,\n    rightVisibleMonth,\n    rightVisibleYear,\n    minimumDate,\n    maximumDate,\n    startAdornment,\n    onChange,\n    onInputChange,\n    onVisibleDateChange,\n    invalidDateLabel,\n    ...others\n  } = useDefaultProps(\"HvCalendar\", props);\n  const { classes } = useClasses(classesProp);\n\n  const { elementId } = useContext(HvFormElementContext);\n  const elementValue = useContext(HvFormElementValueContext);\n  const localValue = value ?? elementValue;\n  const localId = id ?? setId(elementId, \"single-calendar\");\n  const rangeMode = isRange(localValue);\n  const rightCalendarId = setId(localId, \"single-calendar-right\");\n  const clampedMonth =\n    visibleMonth && visibleMonth % 13 > 0 ? visibleMonth % 13 : 1;\n\n  const singleCalendar = (\n    <HvSingleCalendar\n      id={localId}\n      locale={locale}\n      value={localValue}\n      visibleMonth={clampedMonth}\n      visibleYear={visibleYear}\n      minimumDate={minimumDate}\n      maximumDate={maximumDate}\n      onChange={onChange}\n      onInputChange={(evt, date) =>\n        onInputChange && onInputChange(evt, date, \"left\")\n      }\n      onVisibleDateChange={onVisibleDateChange}\n      invalidDateLabel={invalidDateLabel}\n      {...others}\n    />\n  );\n\n  const rangeCalendar = (\n    <div className={classes.rangeCalendarContainer}>\n      <HvSingleCalendar\n        className={classes.singleCalendar}\n        id={localId}\n        locale={locale}\n        value={localValue}\n        visibleMonth={clampedMonth}\n        visibleYear={visibleYear}\n        minimumDate={minimumDate}\n        maximumDate={maximumDate}\n        onChange={onChange}\n        onInputChange={(evt, date) =>\n          onInputChange && onInputChange(evt, date, \"left\")\n        }\n        onVisibleDateChange={(event, action, index) =>\n          onVisibleDateChange?.(event, action, index, \"left\")\n        }\n        invalidDateLabel={invalidDateLabel}\n        {...others}\n      />\n\n      <HvSingleCalendar\n        className={classes.singleCalendar}\n        id={rightCalendarId}\n        locale={locale}\n        value={localValue}\n        visibleMonth={rightVisibleMonth}\n        visibleYear={rightVisibleYear}\n        minimumDate={minimumDate}\n        maximumDate={maximumDate}\n        onChange={onChange}\n        onInputChange={(evt, date) =>\n          onInputChange && onInputChange(evt, date, \"right\")\n        }\n        onVisibleDateChange={(event, action, index) => {\n          onVisibleDateChange?.(event, action, index, \"right\");\n        }}\n        showEndDate\n        invalidDateLabel={invalidDateLabel}\n        {...others}\n      />\n    </div>\n  );\n\n  return (\n    <div className={classes.root}>\n      {startAdornment}\n      {rangeMode ? rangeCalendar : singleCalendar}\n    </div>\n  );\n};\n"],"names":["useDefaultProps","useClasses","useContext","HvFormElementContext","HvFormElementValueContext","setId","isRange","jsx","HvSingleCalendar","jsxs"],"mappings":";;;;;;;;;;;AA0Ga,MAAA,aAAa,CAAC,UAA2B;AAC9C,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,cAAc,KAAK;AACvC,QAAM,EAAE,QAAA,IAAYC,gBAAA,WAAW,WAAW;AAE1C,QAAM,EAAE,UAAA,IAAcC,MAAA,WAAWC,mBAAoB,oBAAA;AAC/C,QAAA,eAAeD,iBAAWE,wBAAAA,yBAAyB;AACzD,QAAM,aAAa,SAAS;AAC5B,QAAM,UAAU,MAAMC,MAAM,MAAA,WAAW,iBAAiB;AAClD,QAAA,YAAYC,cAAQ,UAAU;AAC9B,QAAA,kBAAkBD,MAAAA,MAAM,SAAS,uBAAuB;AAC9D,QAAM,eACJ,gBAAgB,eAAe,KAAK,IAAI,eAAe,KAAK;AAE9D,QAAM,iBACJE,2BAAA;AAAA,IAACC,eAAA;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,MACP,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe,CAAC,KAAK,SACnB,iBAAiB,cAAc,KAAK,MAAM,MAAM;AAAA,MAElD;AAAA,MACA;AAAA,MACC,GAAG;AAAA,IAAA;AAAA,EAAA;AAIR,QAAM,gBACJC,2BAAAA,KAAC,OAAI,EAAA,WAAW,QAAQ,wBACtB,UAAA;AAAA,IAAAF,2BAAA;AAAA,MAACC,eAAA;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,IAAI;AAAA,QACJ;AAAA,QACA,OAAO;AAAA,QACP,cAAc;AAAA,QACd;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe,CAAC,KAAK,SACnB,iBAAiB,cAAc,KAAK,MAAM,MAAM;AAAA,QAElD,qBAAqB,CAAC,OAAO,QAAQ,UACnC,sBAAsB,OAAO,QAAQ,OAAO,MAAM;AAAA,QAEpD;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,IACN;AAAA,IAEAD,2BAAA;AAAA,MAACC,eAAA;AAAA,MAAA;AAAA,QACC,WAAW,QAAQ;AAAA,QACnB,IAAI;AAAA,QACJ;AAAA,QACA,OAAO;AAAA,QACP,cAAc;AAAA,QACd,aAAa;AAAA,QACb;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe,CAAC,KAAK,SACnB,iBAAiB,cAAc,KAAK,MAAM,OAAO;AAAA,QAEnD,qBAAqB,CAAC,OAAO,QAAQ,UAAU;AACvB,gCAAA,OAAO,QAAQ,OAAO,OAAO;AAAA,QACrD;AAAA,QACA,aAAW;AAAA,QACX;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,IACN;AAAA,EACF,EAAA,CAAA;AAGF,SACGC,2BAAAA,KAAA,OAAA,EAAI,WAAW,QAAQ,MACrB,UAAA;AAAA,IAAA;AAAA,IACA,YAAY,gBAAgB;AAAA,EAC/B,EAAA,CAAA;AAEJ;;;"}

package/dist/cjs/Calendar/CalendarHeader/CalendarHeader.cjs

@@ -3,12 +3,12 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const dayjs = require("dayjs");
+const customParseFormat = require("dayjs/plugin/customParseFormat");
 const localeData = require("dayjs/plugin/localeData");
 const localizedFormat = require("dayjs/plugin/localizedFormat");
-const customParseFormat = require("dayjs/plugin/customParseFormat");
+const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const keyboardUtils = require("../../utils/keyboardUtils.cjs");
 const setId = require("../../utils/setId.cjs");
-const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const utils = require("../utils.cjs");
 const CalendarHeader_styles = require("./CalendarHeader.styles.cjs");
 const FormElementValueContext = require("../../Forms/FormElement/context/FormElementValueContext.cjs");
@@ -18,9 +18,9 @@ const FormElementDescriptorsContext = require("../../Forms/FormElement/context/F
 const Typography = require("../../Typography/Typography.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const dayjs__default = /* @__PURE__ */ _interopDefault(dayjs);
+const customParseFormat__default = /* @__PURE__ */ _interopDefault(customParseFormat);
 const localeData__default = /* @__PURE__ */ _interopDefault(localeData);
 const localizedFormat__default = /* @__PURE__ */ _interopDefault(localizedFormat);
-const customParseFormat__default = /* @__PURE__ */ _interopDefault(customParseFormat);
 dayjs__default.default.extend(localeData__default.default);
 dayjs__default.default.extend(localizedFormat__default.default);
 dayjs__default.default.extend(customParseFormat__default.default);