@hitachivantara/uikit-react-core 5.42.0 → 5.43.0

package/dist/cjs/Tag/Tag.cjs

@@ -57,13 +57,6 @@ const HvTag = (props) => {
       boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}`
     }
   });
-  const onClickHandler = (event) => {
-    if (disabled)
-      return;
-    if (selectable)
-      setIsSelected(!isSelected);
-    onClick?.(event, !isSelected);
-  };
   const colorOverride = disabled && ["atmo3", "secondary_60"] || void 0;
   const avatarIcon = isSelected ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.CheckboxCheck, { color: colorOverride, iconSize: "XS" }) : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Checkbox, { color: colorOverride, iconSize: "XS" });
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -91,7 +84,13 @@ const HvTag = (props) => {
       },
       deleteIcon: deleteIcon || defaultDeleteIcon,
       onDelete: disabled ? void 0 : onDelete,
-      onClick: onClickHandler,
+      onClick: (event) => {
+        if (disabled)
+          return;
+        if (selectable)
+          setIsSelected(!isSelected);
+        onClick?.(event, !isSelected);
+      },
       "aria-pressed": isSelected,
       ...selectable && type === "semantic" && {
         avatar: avatarIcon

package/dist/cjs/Tag/Tag.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.cjs","sources":["../../../src/Tag/Tag.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\";\nimport { HvColorAny, getColor } from \"@hitachivantara/uikit-styles\";\nimport Chip, { ChipProps as MuiChipProps } from \"@mui/material/Chip\";\n\nimport {\n  Checkbox,\n  CheckboxCheck,\n  CloseXS,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { useTheme } from \"../hooks/useTheme\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { useControlled } from \"../hooks/useControlled\";\n\nimport { staticClasses, useClasses } from \"./Tag.styles\";\n\nexport { staticClasses as tagClasses };\n\nexport type HvTagClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTagProps\n  extends Omit<MuiChipProps, \"color\" | \"classes\" | \"onSelect\"> {\n  /** The label of the tag element. */\n  label?: React.ReactNode;\n  /** Indicates that the form element is disabled. */\n  disabled?: boolean;\n  /** The type of the tag element. A tag can be of semantic or categoric type. */\n  type?: \"semantic\" | \"categorical\";\n  /** Background color to be applied to the tag */\n  color?: HvColorAny;\n  /** Icon used to customize the delete icon in the Chip element */\n  deleteIcon?: React.ReactElement;\n  /**\n   * The callback fired when the delete icon is pressed.\n   * This function has to be provided to the component, in order to render the delete icon\n   * */\n  onDelete?: (event: React.MouseEvent<HTMLElement>) => void;\n  /** Callback triggered when any item is clicked. */\n  onClick?: (event: React.MouseEvent<HTMLElement>, selected?: boolean) => void;\n  /** Aria properties to apply to delete button in tag\n   * @deprecated no longer used\n   */\n  deleteButtonArialLabel?: string;\n  /** Props to apply to delete icon */\n  deleteButtonProps?: HTMLAttributes<HTMLDivElement>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTagClasses;\n  /** @ignore */\n  ref?: MuiChipProps[\"ref\"];\n  /** @ignore */\n  component?: MuiChipProps[\"component\"];\n  /** Determines whether or not the tag is selectable. */\n  selectable?: boolean;\n  /** Defines if the tag is selected. When defined the tag state becomes controlled. */\n  selected?: boolean;\n  /** When uncontrolled, defines the initial selected state. */\n  defaultSelected?: boolean;\n}\n\nconst getCategoricalColor = (customColor, colors) => {\n  return (customColor && colors?.[customColor]) || customColor || colors?.cat1;\n};\n\n/**\n * A Tag is one word that describes a specific aspect of an asset. A single asset can have\n * multiple tags.\n * Use tags to highlight an item's status for quick recognition and navigation\n * Use color to indicate meanings that users can learn and recognize across products\n *\n * It leverages the Chip component from Material UI\n */\nexport const HvTag = (props: HvTagProps) => {\n  const {\n    classes: classesProp,\n    className,\n    style,\n    label,\n    disabled,\n    type = \"semantic\",\n    selectable,\n    selected,\n    defaultSelected = false,\n    color,\n    deleteIcon,\n    onDelete,\n    onClick,\n    // TODO: remove from API\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    deleteButtonArialLabel = \"Delete tag\",\n    deleteButtonProps = {},\n    ...others\n  } = useDefaultProps(\"HvTag\", props);\n  const { colors } = useTheme();\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const [isSelected, setIsSelected] = useControlled(\n    selected,\n    Boolean(defaultSelected)\n  );\n\n  const defaultDeleteIcon = (\n    <CloseXS\n      role=\"none\"\n      className={cx(classes.button, classes.tagButton)}\n      iconSize=\"XS\"\n      {...deleteButtonProps}\n    />\n  );\n\n  const categoricalBackgroundColor =\n    type === \"categorical\" ? getCategoricalColor(color, colors) : undefined;\n\n  const backgroundColor =\n    (type === \"semantic\" && getColor(color, \"neutral_20\")) ||\n    (type === \"categorical\" && `${categoricalBackgroundColor}30`) ||\n    undefined;\n\n  const isClickable = !!(onClick || onDelete) && !disabled;\n\n  const clickableClass = css({\n    \"&:hover\": {\n      boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}`,\n    },\n  });\n\n  const onClickHandler = (event) => {\n    if (disabled) return;\n    if (selectable) setIsSelected(!isSelected);\n    onClick?.(event, !isSelected);\n  };\n\n  const colorOverride = (disabled && [\"atmo3\", \"secondary_60\"]) || undefined;\n\n  const avatarIcon = isSelected ? (\n    <CheckboxCheck color={colorOverride} iconSize=\"XS\" />\n  ) : (\n    <Checkbox color={colorOverride} iconSize=\"XS\" />\n  );\n\n  return (\n    <Chip\n      label={label}\n      disabled={disabled}\n      className={cx({ [clickableClass]: isClickable }, className)}\n      style={{\n        ...(disabled ? null : { backgroundColor }),\n        ...style,\n      }}\n      classes={{\n        root: cx(classes.root, classes.chipRoot, {\n          [classes.disabled]: disabled,\n          [classes.clickable]: isClickable,\n          [classes.categorical]: type === \"categorical\",\n          [classes.categoricalFocus]: type === \"categorical\" && !disabled,\n          [classes.categoricalDisabled]: type === \"categorical\" && disabled,\n        }),\n        label: classes.label,\n        deleteIcon: cx(classes.deleteIcon, {\n          [classes.disabledDeleteIcon]: disabled,\n        }),\n      }}\n      deleteIcon={deleteIcon || defaultDeleteIcon}\n      onDelete={disabled ? undefined : onDelete}\n      onClick={onClickHandler}\n      aria-pressed={isSelected}\n      {...(selectable &&\n        type === \"semantic\" && {\n          avatar: avatarIcon,\n        })}\n      {...others}\n    />\n  );\n};\n"],"names":["useDefaultProps","useTheme","useClasses","useControlled","jsx","CloseXS","getColor","CheckboxCheck","Checkbox","Chip"],"mappings":"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"}
+{"version":3,"file":"Tag.cjs","sources":["../../../src/Tag/Tag.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\";\nimport { HvColorAny, getColor } from \"@hitachivantara/uikit-styles\";\nimport Chip, { ChipProps as MuiChipProps } from \"@mui/material/Chip\";\n\nimport {\n  Checkbox,\n  CheckboxCheck,\n  CloseXS,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { useTheme } from \"../hooks/useTheme\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { useControlled } from \"../hooks/useControlled\";\n\nimport { staticClasses, useClasses } from \"./Tag.styles\";\n\nexport { staticClasses as tagClasses };\n\nexport type HvTagClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTagProps\n  extends Omit<MuiChipProps, \"color\" | \"classes\" | \"onSelect\"> {\n  /** The label of the tag element. */\n  label?: React.ReactNode;\n  /** Indicates that the form element is disabled. */\n  disabled?: boolean;\n  /** The type of the tag element. A tag can be of semantic or categoric type. */\n  type?: \"semantic\" | \"categorical\";\n  /** Background color to be applied to the tag */\n  color?: HvColorAny;\n  /** Icon used to customize the delete icon in the Chip element */\n  deleteIcon?: React.ReactElement;\n  /**\n   * The callback fired when the delete icon is pressed.\n   * This function has to be provided to the component, in order to render the delete icon\n   * */\n  onDelete?: (event: React.MouseEvent<HTMLElement>) => void;\n  /** Callback triggered when any item is clicked. */\n  onClick?: (event: React.MouseEvent<HTMLElement>, selected?: boolean) => void;\n  /** Aria properties to apply to delete button in tag\n   * @deprecated no longer used\n   */\n  deleteButtonArialLabel?: string;\n  /** Props to apply to delete icon */\n  deleteButtonProps?: HTMLAttributes<HTMLDivElement>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTagClasses;\n  /** @ignore */\n  ref?: MuiChipProps[\"ref\"];\n  /** @ignore */\n  component?: MuiChipProps[\"component\"];\n  /** Determines whether or not the tag is selectable. */\n  selectable?: boolean;\n  /** Defines if the tag is selected. When defined the tag state becomes controlled. */\n  selected?: boolean;\n  /** When uncontrolled, defines the initial selected state. */\n  defaultSelected?: boolean;\n}\n\nconst getCategoricalColor = (customColor?: HvColorAny, colors?: any) => {\n  return (customColor && colors?.[customColor]) || customColor || colors?.cat1;\n};\n\n/**\n * A Tag is one word that describes a specific aspect of an asset. A single asset can have\n * multiple tags.\n * Use tags to highlight an item's status for quick recognition and navigation\n * Use color to indicate meanings that users can learn and recognize across products\n *\n * It leverages the Chip component from Material UI\n */\nexport const HvTag = (props: HvTagProps) => {\n  const {\n    classes: classesProp,\n    className,\n    style,\n    label,\n    disabled,\n    type = \"semantic\",\n    selectable,\n    selected,\n    defaultSelected = false,\n    color,\n    deleteIcon,\n    onDelete,\n    onClick,\n    // TODO: remove from API\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    deleteButtonArialLabel = \"Delete tag\",\n    deleteButtonProps = {},\n    ...others\n  } = useDefaultProps(\"HvTag\", props);\n  const { colors } = useTheme();\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const [isSelected, setIsSelected] = useControlled(\n    selected,\n    Boolean(defaultSelected)\n  );\n\n  const defaultDeleteIcon = (\n    <CloseXS\n      role=\"none\"\n      className={cx(classes.button, classes.tagButton)}\n      iconSize=\"XS\"\n      {...deleteButtonProps}\n    />\n  );\n\n  const categoricalBackgroundColor =\n    type === \"categorical\" ? getCategoricalColor(color, colors) : undefined;\n\n  const backgroundColor =\n    (type === \"semantic\" && getColor(color, \"neutral_20\")) ||\n    (type === \"categorical\" && `${categoricalBackgroundColor}30`) ||\n    undefined;\n\n  const isClickable = !!(onClick || onDelete) && !disabled;\n\n  const clickableClass = css({\n    \"&:hover\": {\n      boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}`,\n    },\n  });\n\n  const colorOverride = (disabled && [\"atmo3\", \"secondary_60\"]) || undefined;\n\n  const avatarIcon = isSelected ? (\n    <CheckboxCheck color={colorOverride} iconSize=\"XS\" />\n  ) : (\n    <Checkbox color={colorOverride} iconSize=\"XS\" />\n  );\n\n  return (\n    <Chip\n      label={label}\n      disabled={disabled}\n      className={cx({ [clickableClass]: isClickable }, className)}\n      style={{\n        ...(disabled ? null : { backgroundColor }),\n        ...style,\n      }}\n      classes={{\n        root: cx(classes.root, classes.chipRoot, {\n          [classes.disabled]: disabled,\n          [classes.clickable]: isClickable,\n          [classes.categorical]: type === \"categorical\",\n          [classes.categoricalFocus]: type === \"categorical\" && !disabled,\n          [classes.categoricalDisabled]: type === \"categorical\" && disabled,\n        }),\n        label: classes.label,\n        deleteIcon: cx(classes.deleteIcon, {\n          [classes.disabledDeleteIcon]: disabled,\n        }),\n      }}\n      deleteIcon={deleteIcon || defaultDeleteIcon}\n      onDelete={disabled ? undefined : onDelete}\n      onClick={(event) => {\n        if (disabled) return;\n        if (selectable) setIsSelected(!isSelected);\n        onClick?.(event, !isSelected);\n      }}\n      aria-pressed={isSelected}\n      {...(selectable &&\n        type === \"semantic\" && {\n          avatar: avatarIcon,\n        })}\n      {...others}\n    />\n  );\n};\n"],"names":["useDefaultProps","useTheme","useClasses","useControlled","jsx","CloseXS","getColor","CheckboxCheck","Checkbox","Chip"],"mappings":";;;;;;;;;;;;AA6DA,MAAM,sBAAsB,CAAC,aAA0B,WAAiB;AACtE,SAAQ,eAAe,SAAS,WAAW,KAAM,eAAe,QAAQ;AAC1E;AAUa,MAAA,QAAQ,CAAC,UAAsB;AACpC,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;AAAA,IAGA,yBAAyB;AAAA,IACzB,oBAAoB,CAAC;AAAA,IACrB,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,SAAS,KAAK;AAC5B,QAAA,EAAE,WAAWC,SAAAA;AACnB,QAAM,EAAE,SAAS,IAAI,IAAI,IAAIC,WAAAA,WAAW,WAAW;AAE7C,QAAA,CAAC,YAAY,aAAa,IAAIC,cAAA;AAAA,IAClC;AAAA,IACA,QAAQ,eAAe;AAAA,EAAA;AAGzB,QAAM,oBACJC,2BAAA;AAAA,IAACC,gBAAA;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW,GAAG,QAAQ,QAAQ,QAAQ,SAAS;AAAA,MAC/C,UAAS;AAAA,MACR,GAAG;AAAA,IAAA;AAAA,EAAA;AAIR,QAAM,6BACJ,SAAS,gBAAgB,oBAAoB,OAAO,MAAM,IAAI;AAE1D,QAAA,kBACH,SAAS,cAAcC,YAAS,SAAA,OAAO,YAAY,KACnD,SAAS,iBAAiB,GAAG,0BAA0B,QACxD;AAEF,QAAM,cAAc,CAAC,EAAE,WAAW,aAAa,CAAC;AAEhD,QAAM,iBAAiB,IAAI;AAAA,IACzB,WAAW;AAAA,MACT,WAAW,aAAa,0BAA0B;AAAA,IACpD;AAAA,EAAA,CACD;AAED,QAAM,gBAAiB,YAAY,CAAC,SAAS,cAAc,KAAM;AAEjE,QAAM,aAAa,aAChBF,2BAAA,IAAAG,gBAAA,eAAA,EAAc,OAAO,eAAe,UAAS,KAAK,CAAA,IAElDH,2BAAAA,IAAAI,gBAAAA,UAAA,EAAS,OAAO,eAAe,UAAS,KAAK,CAAA;AAI9C,SAAAJ,2BAAA;AAAA,IAACK,cAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,WAAW,GAAG,EAAE,CAAC,cAAc,GAAG,YAAA,GAAe,SAAS;AAAA,MAC1D,OAAO;AAAA,QACL,GAAI,WAAW,OAAO,EAAE,gBAAgB;AAAA,QACxC,GAAG;AAAA,MACL;AAAA,MACA,SAAS;AAAA,QACP,MAAM,GAAG,QAAQ,MAAM,QAAQ,UAAU;AAAA,UACvC,CAAC,QAAQ,QAAQ,GAAG;AAAA,UACpB,CAAC,QAAQ,SAAS,GAAG;AAAA,UACrB,CAAC,QAAQ,WAAW,GAAG,SAAS;AAAA,UAChC,CAAC,QAAQ,gBAAgB,GAAG,SAAS,iBAAiB,CAAC;AAAA,UACvD,CAAC,QAAQ,mBAAmB,GAAG,SAAS,iBAAiB;AAAA,QAAA,CAC1D;AAAA,QACD,OAAO,QAAQ;AAAA,QACf,YAAY,GAAG,QAAQ,YAAY;AAAA,UACjC,CAAC,QAAQ,kBAAkB,GAAG;AAAA,QAAA,CAC/B;AAAA,MACH;AAAA,MACA,YAAY,cAAc;AAAA,MAC1B,UAAU,WAAW,SAAY;AAAA,MACjC,SAAS,CAAC,UAAU;AACd,YAAA;AAAU;AACV,YAAA;AAAY,wBAAc,CAAC,UAAU;AAC/B,kBAAA,OAAO,CAAC,UAAU;AAAA,MAC9B;AAAA,MACA,gBAAc;AAAA,MACb,GAAI,cACH,SAAS,cAAc;AAAA,QACrB,QAAQ;AAAA,MACV;AAAA,MACD,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;;;"}

package/dist/cjs/TextArea/TextArea.cjs

@@ -107,11 +107,11 @@ const HvTextArea = React.forwardRef((props, ref) => {
     validation,
     value
   ]);
-  const isOverflow = (currentValue) => maxCharQuantity == null ? false : currentValue.length > maxCharQuantity;
   const limitValue = (currentValue) => {
     if (currentValue === void 0 || !blockMax)
       return currentValue;
-    return !isOverflow(currentValue) ? currentValue : currentValue.substring(0, maxCharQuantity);
+    const isOverflow = maxCharQuantity == null ? false : currentValue.length > maxCharQuantity;
+    return !isOverflow ? currentValue : currentValue.substring(0, maxCharQuantity);
   };
   const onContainerBlurHandler = (event) => {
     setFocused(false);

package/dist/cjs/TextArea/TextArea.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.cjs","sources":["../../../src/TextArea/TextArea.tsx"],"sourcesContent":["import {\n  useCallback,\n  useRef,\n  useState,\n  useMemo,\n  useEffect,\n  forwardRef,\n} from \"react\";\n\nimport { useForkRef } from \"@mui/material/utils\";\n\nimport { setId } from \"../utils/setId\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport validationStates, {\n  isInvalid,\n} from \"../Forms/FormElement/validationStates\";\nimport { HvValidationMessages } from \"../types/forms\";\nimport {\n  computeValidationMessage,\n  computeValidationState,\n  DEFAULT_ERROR_MESSAGES,\n  hasBuiltInValidations,\n  HvInputValidity,\n  validateInput,\n  validationTypes,\n} from \"../BaseInput/validations\";\nimport { HvBaseInput, HvBaseInputProps } from \"../BaseInput\";\nimport {\n  HvCharCounter,\n  HvCharCounterProps,\n  HvFormElement,\n  HvFormStatus,\n  HvInfoMessage,\n  HvLabel,\n  HvWarningText,\n} from \"../Forms\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./TextArea.styles\";\n\nexport { staticClasses as textAreaClasses };\n\nexport type HvTextAreaClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTextAreaProps\n  extends Omit<\n    HvBaseInputProps,\n    \"onChange\" | \"onBlur\" | \"rows\" | \"classes\" | \"onFocus\" | \"placeholder\"\n  > {\n  /** The placeholder value of the text area. */\n  placeholder?: string;\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be provided instead.\n   */\n  label?: React.ReactNode;\n  /**\n   * Provide additional descriptive text for the form element.\n   */\n  description?: React.ReactNode;\n  /**\n   * The status of the form element.\n   *\n   * Valid is correct, invalid is incorrect and standBy means no validations have run.\n   *\n   * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n   * or \"invalid\" after any change to the state.\n   */\n  status?: HvFormStatus;\n  /**\n   * The error message to show when `status` is \"invalid\".\n   */\n  statusMessage?: React.ReactNode;\n  /**\n   * Text between the current char counter and max value.\n   */\n  middleCountLabel?: string;\n  /**\n   * An Object containing the various texts associated with the input.\n   */\n  validationMessages?: HvValidationMessages;\n  /**\n   * The custom validation function, it receives the value and must return\n   * either `true` for valid or `false` for invalid, default validations would only\n   * occur if this function is null or undefined\n   */\n  validation?: (value: string) => boolean;\n  /**\n   * The maximum allowed length of the characters, if this value is null no check\n   * will be performed.\n   */\n  maxCharQuantity?: number;\n  /**\n   * The minimum allowed length of the characters, if this value is null no check\n   * will be perform.\n   */\n  minCharQuantity?: number;\n  /**\n   * If `true` it should autofocus.\n   */\n  autoFocus?: boolean;\n  /**\n   * The number of rows of the text area\n   */\n  rows?: number;\n  /**\n   * If `true` the component is resizable.\n   */\n  resizable?: boolean;\n  /**\n   * Auto-scroll: automatically scroll to the end on value changes.\n   * Will stop if the user scrolls up and resume if scrolled to the bottom.\n   */\n  autoScroll?: boolean;\n  /**\n   * If true it isn't possible to pass the `maxCharQuantity`\n   */\n  blockMax?: boolean;\n  /**\n   * If `true` the character counter isn't shown even if maxCharQuantity is set.\n   */\n  hideCounter?: boolean;\n  /**\n   * Props passed to the char count.\n   */\n  countCharProps?: Partial<HvCharCounterProps>;\n  /**\n   * Called back when the value is changed.\n   */\n  onChange?: (\n    event: React.ChangeEvent<HTMLTextAreaElement>,\n    value: string\n  ) => void;\n  /**\n   * Called back when the value is changed.\n   */\n  onBlur?: (\n    event: React.FocusEvent<HTMLTextAreaElement>,\n    value: string,\n    validationState: HvInputValidity\n  ) => void;\n  /**\n   * The function that will be executed onBlur, allows checking the value state,\n   * it receives the value.\n   */\n  onFocus?: (\n    event: React.FocusEvent<HTMLTextAreaElement>,\n    value: string\n  ) => void;\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvTextAreaClasses;\n}\n\n/**\n * A text area is a multiline text input box, with an optional character counter when there is a length limit.\n */\nexport const HvTextArea = forwardRef<any, HvTextAreaProps>((props, ref) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    name,\n    label,\n    description,\n    placeholder,\n    status,\n    statusMessage,\n    validationMessages,\n    maxCharQuantity,\n    minCharQuantity,\n    value: valueProp,\n    inputRef: inputRefProp,\n    rows = 1,\n    defaultValue = \"\",\n    middleCountLabel = \"/\",\n    countCharProps = {},\n    inputProps = {},\n    required = false,\n    readOnly = false,\n    disabled = false,\n    autoFocus = false,\n    resizable = false,\n    autoScroll = false,\n    hideCounter = false,\n    blockMax = false,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    \"aria-errormessage\": ariaErrorMessage,\n    validation,\n    onChange,\n    onBlur,\n    onFocus,\n    ...others\n  } = useDefaultProps(\"HvTextArea\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const elementId = useUniqueId(id, \"hvtextarea\");\n\n  // Signals that the user has manually edited the input value\n  const isDirty = useRef<boolean>(false);\n\n  const inputRef = useRef<HTMLTextAreaElement>(null);\n  const forkedRef = useForkRef(ref, inputRefProp, inputRef);\n\n  const [focused, setFocused] = useState<boolean>(false);\n\n  const [autoScrolling, setAutoScrolling] = useState(autoScroll);\n\n  const [validationState, setValidationState] = useControlled(\n    status,\n    validationStates.standBy\n  );\n\n  const [validationMessage, setValidationMessage] = useControlled(\n    statusMessage,\n    \"\"\n  );\n\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n\n  const isStateInvalid = isInvalid(validationState);\n\n  const isEmptyValue = value == null || value === \"\";\n\n  const hasLabel = label != null;\n\n  const hasDescription = description != null;\n\n  const hasCounter = maxCharQuantity != null && !hideCounter;\n\n  // ValidationMessages reference tends to change, as users will not memorize/useState for it;\n  // Dependencies must be more explicit so we set\n  const errorMessages = useMemo(\n    () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n    [validationMessages]\n  );\n\n  // Validates the input, sets the status and the statusMessage accordingly (if uncontrolled)\n  // and returns the validity state of the input.\n  const performValidation = useCallback(() => {\n    const inputValidity = validateInput(\n      inputRef.current,\n      value,\n      required,\n      minCharQuantity,\n      maxCharQuantity,\n      validationTypes.none,\n      validation\n    );\n\n    // This will only run if status is uncontrolled\n    setValidationState(computeValidationState(inputValidity, isEmptyValue));\n\n    // This will only run if statusMessage is uncontrolled\n    setValidationMessage(\n      computeValidationMessage(inputValidity, errorMessages)\n    );\n\n    return inputValidity;\n  }, [\n    errorMessages,\n    inputRef,\n    isEmptyValue,\n    maxCharQuantity,\n    minCharQuantity,\n    required,\n    setValidationMessage,\n    setValidationState,\n    validation,\n    value,\n  ]);\n\n  const isOverflow = (currentValue) =>\n    maxCharQuantity == null ? false : currentValue.length > maxCharQuantity;\n\n  /**\n   * Limit the string to the maxCharQuantity length.\n   *\n   * @param value - string to evaluate\n   * @returns {string|*} - string according the limit\n   */\n  const limitValue = (currentValue) => {\n    if (currentValue === undefined || !blockMax) return currentValue;\n    return !isOverflow(currentValue)\n      ? currentValue\n      : currentValue.substring(0, maxCharQuantity);\n  };\n\n  /**\n   * Validates the text area updating the state and modifying the warning text, also executes\n   * the user provided onBlur passing the current validation status and value.\n   *\n   * @returns {undefined}\n   */\n  const onContainerBlurHandler = (event) => {\n    setFocused(false);\n\n    const inputValidity = performValidation();\n\n    onBlur?.(event, value, inputValidity);\n  };\n\n  /**\n   * Updates the length of the string while is being inputted, also executes the user onChange\n   * allowing the customization of the input if required.\n   *\n   * @param {String} value - The value provided by the HvInput\n   */\n  const onChangeHandler = (event, currentValue) => {\n    isDirty.current = true;\n\n    const limitedValue = blockMax ? limitValue(currentValue) : currentValue;\n\n    // Set the input value (only when value is uncontrolled)\n    setValue(limitedValue);\n\n    onChange?.(event, limitedValue);\n  };\n\n  /**\n   * Updates the state putting again the value from the state because the input value is\n   * not automatically manage, it also executes the onFocus function from the user passing the value\n   */\n  const onFocusHandler = (event) => {\n    setFocused(true);\n\n    // Reset validation status to standBy (only when status is uncontrolled)\n    setValidationState(validationStates.standBy);\n\n    onFocus?.(event, value);\n  };\n\n  const isScrolledDown = useCallback(() => {\n    const el = inputRef.current;\n    return el == null || el.offsetHeight + el.scrollTop >= el.scrollHeight;\n  }, [inputRef]);\n\n  const scrollDown = useCallback(() => {\n    const el = inputRef.current;\n    if (el != null) {\n      el.scrollTop = el.scrollHeight - el.clientHeight;\n    }\n  }, [inputRef]);\n\n  const addScrollListener = useCallback(() => {\n    const scrollHandler = {\n      handleEvent: () => {\n        setAutoScrolling(isScrolledDown());\n      },\n    };\n    inputRef.current?.addEventListener(\"scroll\", scrollHandler);\n  }, [inputRef, isScrolledDown]);\n\n  useEffect(() => {\n    if (autoScroll) {\n      addScrollListener();\n    }\n  }, [autoScroll, addScrollListener]);\n\n  useEffect(() => {\n    if (autoScrolling) {\n      scrollDown();\n    }\n  }, [valueProp, autoScrolling, scrollDown]);\n\n  // Run initial validation after first render\n  // and also when any validation condition changes\n  useEffect(() => {\n    if (focused || (!isDirty.current && isEmptyValue)) {\n      // Skip validation if currently focused or if empty and\n      // the user never manually edited the input value\n      return;\n    }\n\n    performValidation();\n  }, [focused, isEmptyValue, performValidation]);\n\n  // The error message area will only be created if:\n  //   - an external element that provides an error message isn't identified via aria-errormessage AND\n  //   - both status and statusMessage properties are being controlled OR\n  //   - status is uncontrolled and any of the built-in validations are active\n  const canShowError =\n    ariaErrorMessage == null &&\n    ((status !== undefined && statusMessage !== undefined) ||\n      (status === undefined &&\n        hasBuiltInValidations(\n          required,\n          validationTypes.none,\n          minCharQuantity,\n          // If blockMax is true maxCharQuantity will never produce an error\n          // unless the value is controlled, so we can't prevent it to overflow maxCharQuantity\n          maxCharQuantity != null && (blockMax !== true || value != null)\n            ? maxCharQuantity\n            : null,\n          validation,\n          inputProps\n        )));\n\n  let errorMessageId;\n  if (isStateInvalid) {\n    errorMessageId = canShowError\n      ? setId(elementId, \"error\")\n      : ariaErrorMessage;\n  }\n\n  return (\n    <HvFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={cx(\n        classes.root,\n        {\n          [classes.resizable]: resizable,\n          [classes.disabled]: disabled,\n          [classes.invalid]: isStateInvalid,\n        },\n        className\n      )}\n      onBlur={onContainerBlurHandler}\n    >\n      {(hasLabel || hasDescription) && (\n        <div className={classes.labelContainer}>\n          {hasLabel && (\n            <HvLabel\n              className={classes.label}\n              id={setId(id, \"label\")}\n              htmlFor={setId(elementId, \"input\")}\n              label={label}\n            />\n          )}\n\n          {hasDescription && (\n            <HvInfoMessage\n              className={classes.description}\n              id={setId(elementId, \"description\")}\n            >\n              {description}\n            </HvInfoMessage>\n          )}\n        </div>\n      )}\n\n      {hasCounter && (\n        <HvCharCounter\n          id={setId(elementId, \"charCounter\")}\n          className={classes.characterCounter}\n          separator={middleCountLabel}\n          currentCharQuantity={value.length}\n          maxCharQuantity={maxCharQuantity}\n          {...countCharProps}\n        />\n      )}\n\n      <HvBaseInput\n        classes={{\n          root: classes.baseInput,\n          input: classes.input,\n          inputResizable: classes.inputResizable,\n        }}\n        id={hasLabel ? setId(elementId, \"input\") : setId(id, \"input\")}\n        name={name}\n        value={value}\n        required={required}\n        readOnly={readOnly}\n        disabled={disabled}\n        onChange={onChangeHandler}\n        autoFocus={autoFocus}\n        onFocus={onFocusHandler}\n        placeholder={placeholder}\n        invalid={isStateInvalid}\n        resizable={resizable}\n        multiline\n        rows={rows}\n        inputProps={{\n          \"aria-label\": ariaLabel,\n          \"aria-labelledby\": ariaLabelledBy,\n          \"aria-invalid\": isStateInvalid ? true : undefined,\n          \"aria-errormessage\": errorMessageId,\n          \"aria-describedby\":\n            ariaDescribedBy != null\n              ? ariaDescribedBy\n              : (description && setId(elementId, \"description\")) || undefined,\n          \"aria-controls\": maxCharQuantity\n            ? setId(elementId, \"charCounter\")\n            : undefined,\n          ...inputProps,\n        }}\n        inputRef={forkedRef}\n        {...others}\n      />\n\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          className={classes.error}\n          disableBorder\n        >\n          {validationMessage}\n        </HvWarningText>\n      )}\n    </HvFormElement>\n  );\n});\n"],"names":["forwardRef","useDefaultProps","useClasses","useUniqueId","useRef","useForkRef","useState","useControlled","validationStates","isInvalid","useMemo","DEFAULT_ERROR_MESSAGES","useCallback","validateInput","validationTypes","computeValidationState","computeValidationMessage","useEffect","hasBuiltInValidations","setId","jsxs","HvFormElement","jsx","HvLabel","HvInfoMessage","HvCharCounter","HvBaseInput","HvWarningText"],"mappings":"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"}
+{"version":3,"file":"TextArea.cjs","sources":["../../../src/TextArea/TextArea.tsx"],"sourcesContent":["import {\n  useCallback,\n  useRef,\n  useState,\n  useMemo,\n  useEffect,\n  forwardRef,\n} from \"react\";\n\nimport { useForkRef } from \"@mui/material/utils\";\n\nimport { setId } from \"../utils/setId\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport validationStates, {\n  isInvalid,\n} from \"../Forms/FormElement/validationStates\";\nimport { HvValidationMessages } from \"../types/forms\";\nimport {\n  computeValidationMessage,\n  computeValidationState,\n  DEFAULT_ERROR_MESSAGES,\n  hasBuiltInValidations,\n  HvInputValidity,\n  validateInput,\n  validationTypes,\n} from \"../BaseInput/validations\";\nimport { HvBaseInput, HvBaseInputProps } from \"../BaseInput\";\nimport {\n  HvCharCounter,\n  HvCharCounterProps,\n  HvFormElement,\n  HvFormElementProps,\n  HvFormStatus,\n  HvInfoMessage,\n  HvLabel,\n  HvWarningText,\n} from \"../Forms\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./TextArea.styles\";\n\nexport { staticClasses as textAreaClasses };\n\nexport type HvTextAreaClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTextAreaProps\n  extends Omit<\n    HvBaseInputProps,\n    \"onChange\" | \"onBlur\" | \"rows\" | \"classes\" | \"onFocus\" | \"placeholder\"\n  > {\n  /** The placeholder value of the text area. */\n  placeholder?: string;\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be provided instead.\n   */\n  label?: React.ReactNode;\n  /**\n   * Provide additional descriptive text for the form element.\n   */\n  description?: React.ReactNode;\n  /**\n   * The status of the form element.\n   *\n   * Valid is correct, invalid is incorrect and standBy means no validations have run.\n   *\n   * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n   * or \"invalid\" after any change to the state.\n   */\n  status?: HvFormStatus;\n  /**\n   * The error message to show when `status` is \"invalid\".\n   */\n  statusMessage?: React.ReactNode;\n  /**\n   * Text between the current char counter and max value.\n   */\n  middleCountLabel?: string;\n  /**\n   * An Object containing the various texts associated with the input.\n   */\n  validationMessages?: HvValidationMessages;\n  /**\n   * The custom validation function, it receives the value and must return\n   * either `true` for valid or `false` for invalid, default validations would only\n   * occur if this function is null or undefined\n   */\n  validation?: (value: string) => boolean;\n  /**\n   * The maximum allowed length of the characters, if this value is null no check\n   * will be performed.\n   */\n  maxCharQuantity?: number;\n  /**\n   * The minimum allowed length of the characters, if this value is null no check\n   * will be perform.\n   */\n  minCharQuantity?: number;\n  /**\n   * If `true` it should autofocus.\n   */\n  autoFocus?: boolean;\n  /**\n   * The number of rows of the text area\n   */\n  rows?: number;\n  /**\n   * If `true` the component is resizable.\n   */\n  resizable?: boolean;\n  /**\n   * Auto-scroll: automatically scroll to the end on value changes.\n   * Will stop if the user scrolls up and resume if scrolled to the bottom.\n   */\n  autoScroll?: boolean;\n  /**\n   * If true it isn't possible to pass the `maxCharQuantity`\n   */\n  blockMax?: boolean;\n  /**\n   * If `true` the character counter isn't shown even if maxCharQuantity is set.\n   */\n  hideCounter?: boolean;\n  /**\n   * Props passed to the char count.\n   */\n  countCharProps?: Partial<HvCharCounterProps>;\n  /**\n   * Called back when the value is changed.\n   */\n  onChange?: (\n    event: React.ChangeEvent<HTMLTextAreaElement>,\n    value: string\n  ) => void;\n  /**\n   * Called back when the value is changed.\n   */\n  onBlur?: (\n    event: React.FocusEvent<HTMLTextAreaElement>,\n    value: string,\n    validationState: HvInputValidity\n  ) => void;\n  /**\n   * The function that will be executed onBlur, allows checking the value state,\n   * it receives the value.\n   */\n  onFocus?: (\n    event: React.FocusEvent<HTMLTextAreaElement>,\n    value: string\n  ) => void;\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvTextAreaClasses;\n}\n\n/**\n * A text area is a multiline text input box, with an optional character counter when there is a length limit.\n */\nexport const HvTextArea = forwardRef<any, HvTextAreaProps>((props, ref) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    name,\n    label,\n    description,\n    placeholder,\n    status,\n    statusMessage,\n    validationMessages,\n    maxCharQuantity,\n    minCharQuantity,\n    value: valueProp,\n    inputRef: inputRefProp,\n    rows = 1,\n    defaultValue = \"\",\n    middleCountLabel = \"/\",\n    countCharProps = {},\n    inputProps = {},\n    required = false,\n    readOnly = false,\n    disabled = false,\n    autoFocus = false,\n    resizable = false,\n    autoScroll = false,\n    hideCounter = false,\n    blockMax = false,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    \"aria-errormessage\": ariaErrorMessage,\n    validation,\n    onChange,\n    onBlur,\n    onFocus,\n    ...others\n  } = useDefaultProps(\"HvTextArea\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const elementId = useUniqueId(id, \"hvtextarea\");\n\n  // Signals that the user has manually edited the input value\n  const isDirty = useRef<boolean>(false);\n\n  const inputRef = useRef<HTMLTextAreaElement>(null);\n  const forkedRef = useForkRef(ref, inputRefProp, inputRef);\n\n  const [focused, setFocused] = useState<boolean>(false);\n\n  const [autoScrolling, setAutoScrolling] = useState(autoScroll);\n\n  const [validationState, setValidationState] = useControlled(\n    status,\n    validationStates.standBy\n  );\n\n  const [validationMessage, setValidationMessage] = useControlled(\n    statusMessage,\n    \"\"\n  );\n\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n\n  const isStateInvalid = isInvalid(validationState);\n\n  const isEmptyValue = value == null || value === \"\";\n\n  const hasLabel = label != null;\n\n  const hasDescription = description != null;\n\n  const hasCounter = maxCharQuantity != null && !hideCounter;\n\n  // ValidationMessages reference tends to change, as users will not memorize/useState for it;\n  // Dependencies must be more explicit so we set\n  const errorMessages = useMemo(\n    () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n    [validationMessages]\n  );\n\n  // Validates the input, sets the status and the statusMessage accordingly (if uncontrolled)\n  // and returns the validity state of the input.\n  const performValidation = useCallback(() => {\n    const inputValidity = validateInput(\n      inputRef.current,\n      value,\n      required,\n      minCharQuantity,\n      maxCharQuantity,\n      validationTypes.none,\n      validation\n    );\n\n    // This will only run if status is uncontrolled\n    setValidationState(computeValidationState(inputValidity, isEmptyValue));\n\n    // This will only run if statusMessage is uncontrolled\n    setValidationMessage(\n      computeValidationMessage(inputValidity, errorMessages)\n    );\n\n    return inputValidity;\n  }, [\n    errorMessages,\n    inputRef,\n    isEmptyValue,\n    maxCharQuantity,\n    minCharQuantity,\n    required,\n    setValidationMessage,\n    setValidationState,\n    validation,\n    value,\n  ]);\n\n  /**\n   * Limit the string to the maxCharQuantity length.\n   */\n  const limitValue = (currentValue: string) => {\n    if (currentValue === undefined || !blockMax) return currentValue;\n    const isOverflow =\n      maxCharQuantity == null ? false : currentValue.length > maxCharQuantity;\n\n    return !isOverflow\n      ? currentValue\n      : currentValue.substring(0, maxCharQuantity);\n  };\n\n  /**\n   * Validates the text area updating the state and modifying the warning text, also executes\n   * the user provided onBlur passing the current validation status and value.\n   */\n  const onContainerBlurHandler: HvFormElementProps[\"onBlur\"] = (event) => {\n    setFocused(false);\n\n    const inputValidity = performValidation();\n\n    onBlur?.(event as any, value, inputValidity);\n  };\n\n  /**\n   * Updates the length of the string while is being inputted, also executes the user onChange\n   * allowing the customization of the input if required.\n   */\n  const onChangeHandler: HvBaseInputProps[\"onChange\"] = (\n    event,\n    currentValue\n  ) => {\n    isDirty.current = true;\n\n    const limitedValue = blockMax ? limitValue(currentValue) : currentValue;\n\n    // Set the input value (only when value is uncontrolled)\n    setValue(limitedValue);\n\n    onChange?.(event as any, limitedValue);\n  };\n\n  /**\n   * Updates the state putting again the value from the state because the input value is\n   * not automatically manage, it also executes the onFocus function from the user passing the value\n   */\n  const onFocusHandler: HvBaseInputProps[\"onFocus\"] = (event) => {\n    setFocused(true);\n\n    // Reset validation status to standBy (only when status is uncontrolled)\n    setValidationState(validationStates.standBy);\n\n    onFocus?.(event as any, value);\n  };\n\n  const isScrolledDown = useCallback(() => {\n    const el = inputRef.current;\n    return el == null || el.offsetHeight + el.scrollTop >= el.scrollHeight;\n  }, [inputRef]);\n\n  const scrollDown = useCallback(() => {\n    const el = inputRef.current;\n    if (el != null) {\n      el.scrollTop = el.scrollHeight - el.clientHeight;\n    }\n  }, [inputRef]);\n\n  const addScrollListener = useCallback(() => {\n    const scrollHandler = {\n      handleEvent: () => {\n        setAutoScrolling(isScrolledDown());\n      },\n    };\n    inputRef.current?.addEventListener(\"scroll\", scrollHandler);\n  }, [inputRef, isScrolledDown]);\n\n  useEffect(() => {\n    if (autoScroll) {\n      addScrollListener();\n    }\n  }, [autoScroll, addScrollListener]);\n\n  useEffect(() => {\n    if (autoScrolling) {\n      scrollDown();\n    }\n  }, [valueProp, autoScrolling, scrollDown]);\n\n  // Run initial validation after first render\n  // and also when any validation condition changes\n  useEffect(() => {\n    if (focused || (!isDirty.current && isEmptyValue)) {\n      // Skip validation if currently focused or if empty and\n      // the user never manually edited the input value\n      return;\n    }\n\n    performValidation();\n  }, [focused, isEmptyValue, performValidation]);\n\n  // The error message area will only be created if:\n  //   - an external element that provides an error message isn't identified via aria-errormessage AND\n  //   - both status and statusMessage properties are being controlled OR\n  //   - status is uncontrolled and any of the built-in validations are active\n  const canShowError =\n    ariaErrorMessage == null &&\n    ((status !== undefined && statusMessage !== undefined) ||\n      (status === undefined &&\n        hasBuiltInValidations(\n          required,\n          validationTypes.none,\n          minCharQuantity,\n          // If blockMax is true maxCharQuantity will never produce an error\n          // unless the value is controlled, so we can't prevent it to overflow maxCharQuantity\n          maxCharQuantity != null && (blockMax !== true || value != null)\n            ? maxCharQuantity\n            : null,\n          validation,\n          inputProps\n        )));\n\n  let errorMessageId;\n  if (isStateInvalid) {\n    errorMessageId = canShowError\n      ? setId(elementId, \"error\")\n      : ariaErrorMessage;\n  }\n\n  return (\n    <HvFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={cx(\n        classes.root,\n        {\n          [classes.resizable]: resizable,\n          [classes.disabled]: disabled,\n          [classes.invalid]: isStateInvalid,\n        },\n        className\n      )}\n      onBlur={onContainerBlurHandler}\n    >\n      {(hasLabel || hasDescription) && (\n        <div className={classes.labelContainer}>\n          {hasLabel && (\n            <HvLabel\n              className={classes.label}\n              id={setId(id, \"label\")}\n              htmlFor={setId(elementId, \"input\")}\n              label={label}\n            />\n          )}\n\n          {hasDescription && (\n            <HvInfoMessage\n              className={classes.description}\n              id={setId(elementId, \"description\")}\n            >\n              {description}\n            </HvInfoMessage>\n          )}\n        </div>\n      )}\n\n      {hasCounter && (\n        <HvCharCounter\n          id={setId(elementId, \"charCounter\")}\n          className={classes.characterCounter}\n          separator={middleCountLabel}\n          currentCharQuantity={value.length}\n          maxCharQuantity={maxCharQuantity}\n          {...countCharProps}\n        />\n      )}\n\n      <HvBaseInput\n        classes={{\n          root: classes.baseInput,\n          input: classes.input,\n          inputResizable: classes.inputResizable,\n        }}\n        id={hasLabel ? setId(elementId, \"input\") : setId(id, \"input\")}\n        name={name}\n        value={value}\n        required={required}\n        readOnly={readOnly}\n        disabled={disabled}\n        onChange={onChangeHandler}\n        autoFocus={autoFocus}\n        onFocus={onFocusHandler}\n        placeholder={placeholder}\n        invalid={isStateInvalid}\n        resizable={resizable}\n        multiline\n        rows={rows}\n        inputProps={{\n          \"aria-label\": ariaLabel,\n          \"aria-labelledby\": ariaLabelledBy,\n          \"aria-invalid\": isStateInvalid ? true : undefined,\n          \"aria-errormessage\": errorMessageId,\n          \"aria-describedby\":\n            ariaDescribedBy != null\n              ? ariaDescribedBy\n              : (description && setId(elementId, \"description\")) || undefined,\n          \"aria-controls\": maxCharQuantity\n            ? setId(elementId, \"charCounter\")\n            : undefined,\n          ...inputProps,\n        }}\n        inputRef={forkedRef}\n        {...others}\n      />\n\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          className={classes.error}\n          disableBorder\n        >\n          {validationMessage}\n        </HvWarningText>\n      )}\n    </HvFormElement>\n  );\n});\n"],"names":["forwardRef","useDefaultProps","useClasses","useUniqueId","useRef","useForkRef","useState","useControlled","validationStates","isInvalid","useMemo","DEFAULT_ERROR_MESSAGES","useCallback","validateInput","validationTypes","computeValidationState","computeValidationMessage","useEffect","hasBuiltInValidations","setId","jsxs","HvFormElement","jsx","HvLabel","HvInfoMessage","HvCharCounter","HvBaseInput","HvWarningText"],"mappings":"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"}

package/dist/cjs/TimeAgo/formatUtils.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"formatUtils.cjs","sources":["../../../src/TimeAgo/formatUtils.ts"],"sourcesContent":["import dayjs from \"dayjs\";\nimport calendar from \"dayjs/plugin/calendar\";\nimport duration from \"dayjs/plugin/duration\";\nimport localeData from \"dayjs/plugin/localeData\";\nimport localizedFormat from \"dayjs/plugin/localizedFormat\";\nimport relativeTime from \"dayjs/plugin/relativeTime\";\nimport updateLocale from \"dayjs/plugin/updateLocale\";\n\n/**\n * Relative time thresholds defined by\n * {@link https://xd.adobe.com/view/1b7df235-5cf8-4b51-a2f0-0be1bb591c55-4e2e/ Design System}\n *\n * Implementation using day.js {@link https://day.js.org/docs/en/customization/relative-time relativeTime}\n */\nconst thresholds = [\n  { l: \"s\", r: 119, d: \"second\" },\n  { l: \"m\", r: 1 },\n  { l: \"mm\", r: 59, d: \"minute\" },\n  { l: \"h\", r: 1 },\n  { l: \"hh\", r: 23, d: \"hour\" },\n  { l: \"d\", r: 1 },\n  { l: \"dd\", r: 29, d: \"day\" },\n  { l: \"M\", r: 1 },\n  { l: \"MM\", r: 11, d: \"month\" },\n  { l: \"y\", r: 17 },\n  { l: \"yy\", d: \"year\" },\n];\n\ndayjs.extend(localeData);\ndayjs.extend(duration);\ndayjs.extend(calendar);\ndayjs.extend(localizedFormat);\ndayjs.extend(relativeTime, { thresholds });\ndayjs.extend(updateLocale);\n\nexport const secondsUntilNextDay = (date = new Date()) => {\n  const midnight = new Date(date.getTime());\n\n  midnight.setDate(midnight.getDate() + 1);\n  midnight.setHours(0);\n  midnight.setMinutes(0);\n  midnight.setSeconds(0);\n  midnight.setMilliseconds(0);\n\n  return (midnight.getTime() - date.getTime()) / 1000;\n};\n\nconst secondsUntilNextWeek = (date = new Date()) => {\n  const firstMonthDayOfWeek = date.getDate() - date.getDay();\n  const firstMonthDayOfNextWeek = firstMonthDayOfWeek + 7; // auto roll over to next month if needed\n\n  const firstDayNextWeek = new Date(date.getTime());\n\n  firstDayNextWeek.setDate(firstMonthDayOfNextWeek);\n  firstDayNextWeek.setHours(0);\n  firstDayNextWeek.setMinutes(0);\n  firstDayNextWeek.setSeconds(0);\n  firstDayNextWeek.setMilliseconds(0);\n\n  return (firstDayNextWeek.getTime() - date.getTime()) / 1000;\n};\n\n/**\n * @typedef {Object} TimeAgo\n * @property {string} timeAgo - the formatted date using the \"time ago format\"\n * @property {number} delay - the time until the date needs to be updated\n */\n\n/**\n * Formats a date to the a relative time format using dayjs.\n *\n * @param {Date} date - date to format.\n * @param {String} locale - locale to use.\n * @param {Boolean} [showSeconds=false] - if seconds should be part of the result.\n * @param {Date} referenceDate - reference date to use when formatting (defaults to current date).\n *\n * @return {TimeAgo} the formatted date using the \"time ago format\" and the time until it needs to be updated\n */\nexport const formatTimeAgo = (\n  date,\n  locale,\n  showSeconds = false,\n  referenceDate = new Date()\n) => {\n  const dayReferenceDate = dayjs(referenceDate);\n  const dayDate = dayjs(date).locale(locale);\n\n  const dayDiffSeconds = dayReferenceDate.diff(dayDate, \"second\");\n\n  const formatUseSeconds = showSeconds ? \"LTS\" : \"LT\";\n\n  // check if the date is after the reference date\n  if (date.getTime() > referenceDate.getTime()) {\n    return {\n      timeAgo: dayDate.format(`L ${formatUseSeconds}`),\n      delay: (date.getTime() - referenceDate.getTime()) / 1000,\n    };\n  }\n\n  // just now, until the 2 minutes\n  if (dayDiffSeconds < 120) {\n    return {\n      timeAgo: dayjs\n        .duration(dayDiffSeconds, \"second\")\n        .locale(locale)\n        .humanize(),\n      delay: 120 - dayDiffSeconds,\n    };\n  }\n\n  // ago in minutes, until the 1 hour mark\n  const dayDiffMinutes = dayReferenceDate.diff(dayDate, \"minute\");\n\n  if (dayDiffMinutes < 60) {\n    return {\n      timeAgo: dayjs\n        .duration(-dayDiffMinutes, \"minute\")\n        .locale(locale)\n        .humanize(true),\n      delay: 60 * (dayDiffMinutes + 1) - dayDiffSeconds,\n    };\n  }\n\n  // formatted date with text description for today\n  if (dayReferenceDate.isSame(dayDate, \"day\")) {\n    return {\n      timeAgo: `${dayDate.calendar(dayReferenceDate)}`,\n      delay: secondsUntilNextDay(referenceDate),\n    };\n  }\n\n  // formatted date with text description for yesterday\n  if (dayReferenceDate.subtract(1, \"day\").isSame(dayDate, \"day\")) {\n    return {\n      timeAgo: `${dayDate.calendar(dayReferenceDate)}`,\n      delay: secondsUntilNextDay(referenceDate),\n    };\n  }\n\n  // formatted date with week during the current week\n  if (dayDate.isSame(dayReferenceDate, \"week\")) {\n    return {\n      timeAgo: dayDate.format(`ddd, ${formatUseSeconds}`),\n      delay: secondsUntilNextWeek(date),\n    };\n  }\n\n  // formatted without special gimmicks\n  return {\n    timeAgo: dayDate.format(`L ${formatUseSeconds}`),\n    delay: 0,\n  };\n};\n"],"names":["dayjs","localeData","duration","calendar","localizedFormat","relativeTime","updateLocale"],"mappings":"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"}
+{"version":3,"file":"formatUtils.cjs","sources":["../../../src/TimeAgo/formatUtils.ts"],"sourcesContent":["import dayjs from \"dayjs\";\nimport calendar from \"dayjs/plugin/calendar\";\nimport duration from \"dayjs/plugin/duration\";\nimport localeData from \"dayjs/plugin/localeData\";\nimport localizedFormat from \"dayjs/plugin/localizedFormat\";\nimport relativeTime from \"dayjs/plugin/relativeTime\";\nimport updateLocale from \"dayjs/plugin/updateLocale\";\n\n/**\n * Relative time thresholds defined by\n * {@link https://xd.adobe.com/view/1b7df235-5cf8-4b51-a2f0-0be1bb591c55-4e2e/ Design System}\n *\n * Implementation using day.js {@link https://day.js.org/docs/en/customization/relative-time relativeTime}\n */\nconst thresholds = [\n  { l: \"s\", r: 119, d: \"second\" },\n  { l: \"m\", r: 1 },\n  { l: \"mm\", r: 59, d: \"minute\" },\n  { l: \"h\", r: 1 },\n  { l: \"hh\", r: 23, d: \"hour\" },\n  { l: \"d\", r: 1 },\n  { l: \"dd\", r: 29, d: \"day\" },\n  { l: \"M\", r: 1 },\n  { l: \"MM\", r: 11, d: \"month\" },\n  { l: \"y\", r: 17 },\n  { l: \"yy\", d: \"year\" },\n];\n\ndayjs.extend(localeData);\ndayjs.extend(duration);\ndayjs.extend(calendar);\ndayjs.extend(localizedFormat);\ndayjs.extend(relativeTime, { thresholds });\ndayjs.extend(updateLocale);\n\nexport const secondsUntilNextDay = (date = new Date()) => {\n  const midnight = new Date(date.getTime());\n\n  midnight.setDate(midnight.getDate() + 1);\n  midnight.setHours(0);\n  midnight.setMinutes(0);\n  midnight.setSeconds(0);\n  midnight.setMilliseconds(0);\n\n  return (midnight.getTime() - date.getTime()) / 1000;\n};\n\nconst secondsUntilNextWeek = (date = new Date()) => {\n  const firstMonthDayOfWeek = date.getDate() - date.getDay();\n  const firstMonthDayOfNextWeek = firstMonthDayOfWeek + 7; // auto roll over to next month if needed\n\n  const firstDayNextWeek = new Date(date.getTime());\n\n  firstDayNextWeek.setDate(firstMonthDayOfNextWeek);\n  firstDayNextWeek.setHours(0);\n  firstDayNextWeek.setMinutes(0);\n  firstDayNextWeek.setSeconds(0);\n  firstDayNextWeek.setMilliseconds(0);\n\n  return (firstDayNextWeek.getTime() - date.getTime()) / 1000;\n};\n\n/**\n * @typedef {Object} TimeAgo\n * @property {string} timeAgo - the formatted date using the \"time ago format\"\n * @property {number} delay - the time until the date needs to be updated\n */\n\n/**\n * Formats a date to the a relative time format using dayjs.\n *\n * @param {Date} date - date to format.\n * @param {String} locale - locale to use.\n * @param {Boolean} [showSeconds=false] - if seconds should be part of the result.\n * @param {Date} referenceDate - reference date to use when formatting (defaults to current date).\n *\n * @return {TimeAgo} the formatted date using the \"time ago format\" and the time until it needs to be updated\n */\nexport const formatTimeAgo = (\n  date: Date,\n  locale: string,\n  showSeconds = false,\n  referenceDate = new Date()\n) => {\n  const dayReferenceDate = dayjs(referenceDate);\n  const dayDate = dayjs(date).locale(locale);\n\n  const dayDiffSeconds = dayReferenceDate.diff(dayDate, \"second\");\n\n  const formatUseSeconds = showSeconds ? \"LTS\" : \"LT\";\n\n  // check if the date is after the reference date\n  if (date.getTime() > referenceDate.getTime()) {\n    return {\n      timeAgo: dayDate.format(`L ${formatUseSeconds}`),\n      delay: (date.getTime() - referenceDate.getTime()) / 1000,\n    };\n  }\n\n  // just now, until the 2 minutes\n  if (dayDiffSeconds < 120) {\n    return {\n      timeAgo: dayjs\n        .duration(dayDiffSeconds, \"second\")\n        .locale(locale)\n        .humanize(),\n      delay: 120 - dayDiffSeconds,\n    };\n  }\n\n  // ago in minutes, until the 1 hour mark\n  const dayDiffMinutes = dayReferenceDate.diff(dayDate, \"minute\");\n\n  if (dayDiffMinutes < 60) {\n    return {\n      timeAgo: dayjs\n        .duration(-dayDiffMinutes, \"minute\")\n        .locale(locale)\n        .humanize(true),\n      delay: 60 * (dayDiffMinutes + 1) - dayDiffSeconds,\n    };\n  }\n\n  // formatted date with text description for today\n  if (dayReferenceDate.isSame(dayDate, \"day\")) {\n    return {\n      timeAgo: `${dayDate.calendar(dayReferenceDate)}`,\n      delay: secondsUntilNextDay(referenceDate),\n    };\n  }\n\n  // formatted date with text description for yesterday\n  if (dayReferenceDate.subtract(1, \"day\").isSame(dayDate, \"day\")) {\n    return {\n      timeAgo: `${dayDate.calendar(dayReferenceDate)}`,\n      delay: secondsUntilNextDay(referenceDate),\n    };\n  }\n\n  // formatted date with week during the current week\n  if (dayDate.isSame(dayReferenceDate, \"week\")) {\n    return {\n      timeAgo: dayDate.format(`ddd, ${formatUseSeconds}`),\n      delay: secondsUntilNextWeek(date),\n    };\n  }\n\n  // formatted without special gimmicks\n  return {\n    timeAgo: dayDate.format(`L ${formatUseSeconds}`),\n    delay: 0,\n  };\n};\n"],"names":["dayjs","localeData","duration","calendar","localizedFormat","relativeTime","updateLocale"],"mappings":";;;;;;;;;;;;;;;;;AAcA,MAAM,aAAa;AAAA,EACjB,EAAE,GAAG,KAAK,GAAG,KAAK,GAAG,SAAS;AAAA,EAC9B,EAAE,GAAG,KAAK,GAAG,EAAE;AAAA,EACf,EAAE,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS;AAAA,EAC9B,EAAE,GAAG,KAAK,GAAG,EAAE;AAAA,EACf,EAAE,GAAG,MAAM,GAAG,IAAI,GAAG,OAAO;AAAA,EAC5B,EAAE,GAAG,KAAK,GAAG,EAAE;AAAA,EACf,EAAE,GAAG,MAAM,GAAG,IAAI,GAAG,MAAM;AAAA,EAC3B,EAAE,GAAG,KAAK,GAAG,EAAE;AAAA,EACf,EAAE,GAAG,MAAM,GAAG,IAAI,GAAG,QAAQ;AAAA,EAC7B,EAAE,GAAG,KAAK,GAAG,GAAG;AAAA,EAChB,EAAE,GAAG,MAAM,GAAG,OAAO;AACvB;AAEAA,eAAAA,QAAM,OAAOC,oBAAAA,OAAU;AACvBD,eAAAA,QAAM,OAAOE,kBAAAA,OAAQ;AACrBF,eAAAA,QAAM,OAAOG,kBAAAA,OAAQ;AACrBH,eAAAA,QAAM,OAAOI,yBAAAA,OAAe;AAC5BJ,eAAA,QAAM,OAAOK,sBAAAA,SAAc,EAAE,WAAY,CAAA;AACzCL,eAAAA,QAAM,OAAOM,sBAAAA,OAAY;AAElB,MAAM,sBAAsB,CAAC,OAAO,oBAAI,WAAW;AACxD,QAAM,WAAW,IAAI,KAAK,KAAK,QAAS,CAAA;AAExC,WAAS,QAAQ,SAAS,QAAQ,IAAI,CAAC;AACvC,WAAS,SAAS,CAAC;AACnB,WAAS,WAAW,CAAC;AACrB,WAAS,WAAW,CAAC;AACrB,WAAS,gBAAgB,CAAC;AAE1B,UAAQ,SAAS,QAAA,IAAY,KAAK,QAAa,KAAA;AACjD;AAEA,MAAM,uBAAuB,CAAC,OAAO,oBAAI,WAAW;AAClD,QAAM,sBAAsB,KAAK,QAAQ,IAAI,KAAK,OAAO;AACzD,QAAM,0BAA0B,sBAAsB;AAEtD,QAAM,mBAAmB,IAAI,KAAK,KAAK,QAAS,CAAA;AAEhD,mBAAiB,QAAQ,uBAAuB;AAChD,mBAAiB,SAAS,CAAC;AAC3B,mBAAiB,WAAW,CAAC;AAC7B,mBAAiB,WAAW,CAAC;AAC7B,mBAAiB,gBAAgB,CAAC;AAElC,UAAQ,iBAAiB,QAAA,IAAY,KAAK,QAAa,KAAA;AACzD;AAkBa,MAAA,gBAAgB,CAC3B,MACA,QACA,cAAc,OACd,gBAAoB,oBAAA,WACjB;AACG,QAAA,mBAAmBN,uBAAM,aAAa;AAC5C,QAAM,UAAUA,eAAAA,QAAM,IAAI,EAAE,OAAO,MAAM;AAEzC,QAAM,iBAAiB,iBAAiB,KAAK,SAAS,QAAQ;AAExD,QAAA,mBAAmB,cAAc,QAAQ;AAG/C,MAAI,KAAK,QAAA,IAAY,cAAc,WAAW;AACrC,WAAA;AAAA,MACL,SAAS,QAAQ,OAAO,KAAK,gBAAgB,EAAE;AAAA,MAC/C,QAAQ,KAAK,QAAY,IAAA,cAAc,aAAa;AAAA,IAAA;AAAA,EAExD;AAGA,MAAI,iBAAiB,KAAK;AACjB,WAAA;AAAA,MACL,SAASA,eAAAA,QACN,SAAS,gBAAgB,QAAQ,EACjC,OAAO,MAAM,EACb,SAAS;AAAA,MACZ,OAAO,MAAM;AAAA,IAAA;AAAA,EAEjB;AAGA,QAAM,iBAAiB,iBAAiB,KAAK,SAAS,QAAQ;AAE9D,MAAI,iBAAiB,IAAI;AAChB,WAAA;AAAA,MACL,SAASA,eACN,QAAA,SAAS,CAAC,gBAAgB,QAAQ,EAClC,OAAO,MAAM,EACb,SAAS,IAAI;AAAA,MAChB,OAAO,MAAM,iBAAiB,KAAK;AAAA,IAAA;AAAA,EAEvC;AAGA,MAAI,iBAAiB,OAAO,SAAS,KAAK,GAAG;AACpC,WAAA;AAAA,MACL,SAAS,GAAG,QAAQ,SAAS,gBAAgB,CAAC;AAAA,MAC9C,OAAO,oBAAoB,aAAa;AAAA,IAAA;AAAA,EAE5C;AAGI,MAAA,iBAAiB,SAAS,GAAG,KAAK,EAAE,OAAO,SAAS,KAAK,GAAG;AACvD,WAAA;AAAA,MACL,SAAS,GAAG,QAAQ,SAAS,gBAAgB,CAAC;AAAA,MAC9C,OAAO,oBAAoB,aAAa;AAAA,IAAA;AAAA,EAE5C;AAGA,MAAI,QAAQ,OAAO,kBAAkB,MAAM,GAAG;AACrC,WAAA;AAAA,MACL,SAAS,QAAQ,OAAO,QAAQ,gBAAgB,EAAE;AAAA,MAClD,OAAO,qBAAqB,IAAI;AAAA,IAAA;AAAA,EAEpC;AAGO,SAAA;AAAA,IACL,SAAS,QAAQ,OAAO,KAAK,gBAAgB,EAAE;AAAA,IAC/C,OAAO;AAAA,EAAA;AAEX;;;"}

package/dist/cjs/TimeAgo/useTimeAgo.cjs

@@ -8,7 +8,7 @@ const fmt = (timestamp, locale, showSeconds) => {
   return formatUtils.formatTimeAgo(new Date(timestampMs), locale, showSeconds);
 };
 function useTimeAgo(timestamp, options) {
-  const { locale, disableRefresh = false, showSeconds = false } = options;
+  const { locale, disableRefresh = false, showSeconds = false } = options || {};
   const [timeAgo, setTimeAgo] = React.useState(fmt(timestamp, locale, showSeconds));
   const refreshTime = disableRefresh ? 0 : timeAgo.delay * 1e3;
   React.useEffect(() => {

package/dist/cjs/TimeAgo/useTimeAgo.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useTimeAgo.cjs","sources":["../../../src/TimeAgo/useTimeAgo.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\nimport { useTimeout } from \"./useTimeout\";\nimport { formatTimeAgo } from \"./formatUtils\";\n\n/**\n * Calls `formatTimeAgo` with timestamp conversion\n */\nconst fmt = (timestamp, locale, showSeconds) => {\n  const timestampMs =\n    String(timestamp).length > 11 ? timestamp : timestamp * 1000;\n  return formatTimeAgo(new Date(timestampMs), locale, showSeconds);\n};\n\nexport default function useTimeAgo(timestamp, options) {\n  const { locale, disableRefresh = false, showSeconds = false } = options;\n  const [timeAgo, setTimeAgo] = useState(fmt(timestamp, locale, showSeconds));\n  const refreshTime = disableRefresh ? 0 : timeAgo.delay * 1000;\n\n  useEffect(() => {\n    const newTimeAgo = fmt(timestamp, locale, showSeconds);\n    setTimeAgo(newTimeAgo);\n  }, [timestamp, locale, showSeconds]);\n\n  useTimeout(() => {\n    const newTimeAgo = fmt(timestamp, locale, showSeconds);\n    setTimeAgo(newTimeAgo);\n  }, refreshTime);\n\n  return timeAgo.timeAgo;\n}\n"],"names":["formatTimeAgo","useState","useEffect","useTimeout"],"mappings":";;;;;AAQA,MAAM,MAAM,CAAC,WAAW,QAAQ,gBAAgB;AAC9C,QAAM,cACJ,OAAO,SAAS,EAAE,SAAS,KAAK,YAAY,YAAY;AAC1D,SAAOA,YAAAA,cAAc,IAAI,KAAK,WAAW,GAAG,QAAQ,WAAW;AACjE;AAEwB,SAAA,WAAW,WAAW,SAAS;AACrD,QAAM,EAAE,QAAQ,iBAAiB,OAAO,cAAc,MAAU,IAAA;AAC1D,QAAA,CAAC,SAAS,UAAU,IAAIC,eAAS,IAAI,WAAW,QAAQ,WAAW,CAAC;AAC1E,QAAM,cAAc,iBAAiB,IAAI,QAAQ,QAAQ;AAEzDC,QAAAA,UAAU,MAAM;AACd,UAAM,aAAa,IAAI,WAAW,QAAQ,WAAW;AACrD,eAAW,UAAU;AAAA,EACpB,GAAA,CAAC,WAAW,QAAQ,WAAW,CAAC;AAEnCC,aAAAA,WAAW,MAAM;AACf,UAAM,aAAa,IAAI,WAAW,QAAQ,WAAW;AACrD,eAAW,UAAU;AAAA,KACpB,WAAW;AAEd,SAAO,QAAQ;AACjB;;"}
+{"version":3,"file":"useTimeAgo.cjs","sources":["../../../src/TimeAgo/useTimeAgo.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\nimport type { HvTimeAgoProps } from \"./TimeAgo\";\nimport { useTimeout } from \"./useTimeout\";\nimport { formatTimeAgo } from \"./formatUtils\";\n\n/**\n * Calls `formatTimeAgo` with timestamp conversion\n */\nconst fmt = (timestamp: any, locale: any, showSeconds?: boolean) => {\n  const timestampMs =\n    String(timestamp).length > 11 ? timestamp : timestamp * 1000;\n  return formatTimeAgo(new Date(timestampMs), locale, showSeconds);\n};\n\nexport default function useTimeAgo(\n  timestamp: number | undefined,\n  options?: Pick<HvTimeAgoProps, \"locale\" | \"disableRefresh\" | \"showSeconds\">\n) {\n  const { locale, disableRefresh = false, showSeconds = false } = options || {};\n  const [timeAgo, setTimeAgo] = useState(fmt(timestamp, locale, showSeconds));\n  const refreshTime = disableRefresh ? 0 : timeAgo.delay * 1000;\n\n  useEffect(() => {\n    const newTimeAgo = fmt(timestamp, locale, showSeconds);\n    setTimeAgo(newTimeAgo);\n  }, [timestamp, locale, showSeconds]);\n\n  useTimeout(() => {\n    const newTimeAgo = fmt(timestamp, locale, showSeconds);\n    setTimeAgo(newTimeAgo);\n  }, refreshTime);\n\n  return timeAgo.timeAgo;\n}\n"],"names":["formatTimeAgo","useState","useEffect","useTimeout"],"mappings":";;;;;AASA,MAAM,MAAM,CAAC,WAAgB,QAAa,gBAA0B;AAClE,QAAM,cACJ,OAAO,SAAS,EAAE,SAAS,KAAK,YAAY,YAAY;AAC1D,SAAOA,YAAAA,cAAc,IAAI,KAAK,WAAW,GAAG,QAAQ,WAAW;AACjE;AAEwB,SAAA,WACtB,WACA,SACA;AACM,QAAA,EAAE,QAAQ,iBAAiB,OAAO,cAAc,MAAM,IAAI,WAAW;AACrE,QAAA,CAAC,SAAS,UAAU,IAAIC,eAAS,IAAI,WAAW,QAAQ,WAAW,CAAC;AAC1E,QAAM,cAAc,iBAAiB,IAAI,QAAQ,QAAQ;AAEzDC,QAAAA,UAAU,MAAM;AACd,UAAM,aAAa,IAAI,WAAW,QAAQ,WAAW;AACrD,eAAW,UAAU;AAAA,EACpB,GAAA,CAAC,WAAW,QAAQ,WAAW,CAAC;AAEnCC,aAAAA,WAAW,MAAM;AACf,UAAM,aAAa,IAAI,WAAW,QAAQ,WAAW;AACrD,eAAW,UAAU;AAAA,KACpB,WAAW;AAEd,SAAO,QAAQ;AACjB;;"}

package/dist/cjs/TimeAgo/useTimeout.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useTimeout.cjs","sources":["../../../src/TimeAgo/useTimeout.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\nexport const useTimeout = (callback, delay) => {\n  const savedCallback = useRef(callback);\n\n  useEffect(() => {\n    savedCallback.current = callback;\n  }, [callback]);\n\n  useEffect(() => {\n    if (!delay) return undefined;\n\n    const id = setTimeout(() => savedCallback.current(), delay);\n    return () => clearTimeout(id);\n  }, [delay]);\n};\n"],"names":["useRef","useEffect"],"mappings":";;;AAEa,MAAA,aAAa,CAAC,UAAU,UAAU;AACvC,QAAA,gBAAgBA,aAAO,QAAQ;AAErCC,QAAAA,UAAU,MAAM;AACd,kBAAc,UAAU;AAAA,EAAA,GACvB,CAAC,QAAQ,CAAC;AAEbA,QAAAA,UAAU,MAAM;AACd,QAAI,CAAC;AAAc,aAAA;AAEnB,UAAM,KAAK,WAAW,MAAM,cAAc,QAAA,GAAW,KAAK;AACnD,WAAA,MAAM,aAAa,EAAE;AAAA,EAAA,GAC3B,CAAC,KAAK,CAAC;AACZ;;"}
+{"version":3,"file":"useTimeout.cjs","sources":["../../../src/TimeAgo/useTimeout.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\nexport const useTimeout = (callback: () => any, delay: number) => {\n  const savedCallback = useRef(callback);\n\n  useEffect(() => {\n    savedCallback.current = callback;\n  }, [callback]);\n\n  useEffect(() => {\n    if (!delay) return undefined;\n\n    const id = setTimeout(() => savedCallback.current(), delay);\n    return () => clearTimeout(id);\n  }, [delay]);\n};\n"],"names":["useRef","useEffect"],"mappings":";;;AAEa,MAAA,aAAa,CAAC,UAAqB,UAAkB;AAC1D,QAAA,gBAAgBA,aAAO,QAAQ;AAErCC,QAAAA,UAAU,MAAM;AACd,kBAAc,UAAU;AAAA,EAAA,GACvB,CAAC,QAAQ,CAAC;AAEbA,QAAAA,UAAU,MAAM;AACd,QAAI,CAAC;AAAc,aAAA;AAEnB,UAAM,KAAK,WAAW,MAAM,cAAc,QAAA,GAAW,KAAK;AACnD,WAAA,MAAM,aAAa,EAAE;AAAA,EAAA,GAC3B,CAAC,KAAK,CAAC;AACZ;;"}

package/dist/cjs/TimePicker/Placeholder.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Placeholder.cjs","sources":["../../../src/TimePicker/Placeholder.tsx"],"sourcesContent":["import { forwardRef, useRef } from \"react\";\n\nimport { DateFieldState, DateSegment } from \"@react-stately/datepicker\";\nimport { useDateSegment } from \"@react-aria/datepicker\";\n\nimport { HvBaseProps } from \"../types/generic\";\n\n/** Convert `Date` into `hh:mm:ss` format */\nconst getDateValue = (date) => {\n  if (!date) return \"\";\n  const { hour, minute, second } = date;\n\n  return [hour, minute, second]\n    .map((el) => String(el).padStart(2, \"0\"))\n    .join(\":\");\n};\n\nconst PlaceholderSegment = ({\n  segment,\n  state,\n  placeholder,\n}: {\n  segment: DateSegment;\n  state: DateFieldState;\n  placeholder: string;\n}) => {\n  const ref = useRef(null);\n  const { segmentProps } = useDateSegment(segment, state, ref);\n\n  return (\n    <div ref={ref} {...segmentProps}>\n      {(() => {\n        if (segment.type === \"literal\") return segment.text;\n        if (segment.isPlaceholder) return placeholder ?? segment.text;\n        return segment.text.padStart(2, \"0\");\n      })()}\n    </div>\n  );\n};\n\ninterface PlaceholderProps extends HvBaseProps<HTMLDivElement> {\n  name?: string;\n  state: DateFieldState;\n  placeholders: { hour?: string; minute?: string; second?: string };\n}\n\nexport const Placeholder = forwardRef<HTMLDivElement, PlaceholderProps>(\n  (props, ref) => {\n    const { name, state, placeholders, onKeyDown, ...others } = props;\n    const { value, segments } = state;\n\n    return (\n      <>\n        {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n        <div\n          ref={ref}\n          onKeyDown={(event) => {\n            // stop ArrowDown from opening dropdown\n            event.stopPropagation();\n            onKeyDown?.(event);\n          }}\n          {...others}\n        >\n          {name && (\n            <input type=\"hidden\" name={name} value={getDateValue(value)} />\n          )}\n          {segments.map((segment, i) => (\n            <PlaceholderSegment\n              key={i}\n              segment={segment}\n              state={state}\n              placeholder={placeholders[segment.type]}\n            />\n          ))}\n        </div>\n      </>\n    );\n  }\n);\n"],"names":["useRef","useDateSegment","jsx","forwardRef","Fragment","jsxs"],"mappings":";;;;;AAQA,MAAM,eAAe,CAAC,SAAS;AAC7B,MAAI,CAAC;AAAa,WAAA;AAClB,QAAM,EAAE,MAAM,QAAQ,OAAA,IAAW;AAEjC,SAAO,CAAC,MAAM,QAAQ,MAAM,EACzB,IAAI,CAAC,OAAO,OAAO,EAAE,EAAE,SAAS,GAAG,GAAG,CAAC,EACvC,KAAK,GAAG;AACb;AAEA,MAAM,qBAAqB,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AACF,MAIM;AACE,QAAA,MAAMA,aAAO,IAAI;AACvB,QAAM,EAAE,aAAa,IAAIC,WAAAA,eAAe,SAAS,OAAO,GAAG;AAE3D,SACGC,2BAAAA,IAAA,OAAA,EAAI,KAAW,GAAG,cACf,WAAM,MAAA;AACN,QAAI,QAAQ,SAAS;AAAW,aAAO,QAAQ;AAC/C,QAAI,QAAQ;AAAe,aAAO,eAAe,QAAQ;AACzD,WAAO,QAAQ,KAAK,SAAS,GAAG,GAAG;AAAA,OAEvC,CAAA;AAEJ;AAQO,MAAM,cAAcC,MAAA;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,EAAE,MAAM,OAAO,cAAc,WAAW,GAAG,OAAW,IAAA;AACtD,UAAA,EAAE,OAAO,SAAa,IAAA;AAE5B,WAGID,+BAAAE,WAAAA,UAAA,EAAA,UAAAC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW,CAAC,UAAU;AAEpB,gBAAM,gBAAgB;AACtB,sBAAY,KAAK;AAAA,QACnB;AAAA,QACC,GAAG;AAAA,QAEH,UAAA;AAAA,UACC,QAAAH,2BAAA,IAAC,WAAM,MAAK,UAAS,MAAY,OAAO,aAAa,KAAK,GAAG;AAAA,UAE9D,SAAS,IAAI,CAAC,SAAS,MACtBA,2BAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cAEC;AAAA,cACA;AAAA,cACA,aAAa,aAAa,QAAQ,IAAI;AAAA,YAAA;AAAA,YAHjC;AAAA,UAAA,CAKR;AAAA,QAAA;AAAA,MAAA;AAAA,IAEL,EAAA,CAAA;AAAA,EAEJ;AACF;;"}
+{"version":3,"file":"Placeholder.cjs","sources":["../../../src/TimePicker/Placeholder.tsx"],"sourcesContent":["import { forwardRef, useRef } from \"react\";\n\nimport { DateFieldState, DateSegment } from \"@react-stately/datepicker\";\nimport { useDateSegment } from \"@react-aria/datepicker\";\n\nimport { HvBaseProps } from \"../types/generic\";\n\n/** Convert `Date` into `hh:mm:ss` format */\nconst getDateValue = (date: any) => {\n  if (!date) return \"\";\n  const { hour, minute, second } = date;\n\n  return [hour, minute, second]\n    .map((el) => String(el).padStart(2, \"0\"))\n    .join(\":\");\n};\n\nconst PlaceholderSegment = ({\n  segment,\n  state,\n  placeholder,\n}: {\n  segment: DateSegment;\n  state: DateFieldState;\n  placeholder: string;\n}) => {\n  const ref = useRef(null);\n  const { segmentProps } = useDateSegment(segment, state, ref);\n\n  return (\n    <div ref={ref} {...segmentProps}>\n      {(() => {\n        if (segment.type === \"literal\") return segment.text;\n        if (segment.isPlaceholder) return placeholder ?? segment.text;\n        return segment.text.padStart(2, \"0\");\n      })()}\n    </div>\n  );\n};\n\ninterface PlaceholderProps extends HvBaseProps<HTMLDivElement> {\n  name?: string;\n  state: DateFieldState;\n  placeholders: { hour?: string; minute?: string; second?: string };\n}\n\nexport const Placeholder = forwardRef<HTMLDivElement, PlaceholderProps>(\n  (props, ref) => {\n    const { name, state, placeholders, onKeyDown, ...others } = props;\n    const { value, segments } = state;\n\n    return (\n      <>\n        {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n        <div\n          ref={ref}\n          onKeyDown={(event) => {\n            // stop ArrowDown from opening dropdown\n            event.stopPropagation();\n            onKeyDown?.(event);\n          }}\n          {...others}\n        >\n          {name && (\n            <input type=\"hidden\" name={name} value={getDateValue(value)} />\n          )}\n          {segments.map((segment, i) => (\n            <PlaceholderSegment\n              key={i}\n              segment={segment}\n              state={state}\n              placeholder={placeholders[segment.type]}\n            />\n          ))}\n        </div>\n      </>\n    );\n  }\n);\n"],"names":["useRef","useDateSegment","jsx","forwardRef","Fragment","jsxs"],"mappings":";;;;;AAQA,MAAM,eAAe,CAAC,SAAc;AAClC,MAAI,CAAC;AAAa,WAAA;AAClB,QAAM,EAAE,MAAM,QAAQ,OAAA,IAAW;AAEjC,SAAO,CAAC,MAAM,QAAQ,MAAM,EACzB,IAAI,CAAC,OAAO,OAAO,EAAE,EAAE,SAAS,GAAG,GAAG,CAAC,EACvC,KAAK,GAAG;AACb;AAEA,MAAM,qBAAqB,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AACF,MAIM;AACE,QAAA,MAAMA,aAAO,IAAI;AACvB,QAAM,EAAE,aAAa,IAAIC,WAAAA,eAAe,SAAS,OAAO,GAAG;AAE3D,SACGC,2BAAAA,IAAA,OAAA,EAAI,KAAW,GAAG,cACf,WAAM,MAAA;AACN,QAAI,QAAQ,SAAS;AAAW,aAAO,QAAQ;AAC/C,QAAI,QAAQ;AAAe,aAAO,eAAe,QAAQ;AACzD,WAAO,QAAQ,KAAK,SAAS,GAAG,GAAG;AAAA,OAEvC,CAAA;AAEJ;AAQO,MAAM,cAAcC,MAAA;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,EAAE,MAAM,OAAO,cAAc,WAAW,GAAG,OAAW,IAAA;AACtD,UAAA,EAAE,OAAO,SAAa,IAAA;AAE5B,WAGID,+BAAAE,WAAAA,UAAA,EAAA,UAAAC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW,CAAC,UAAU;AAEpB,gBAAM,gBAAgB;AACtB,sBAAY,KAAK;AAAA,QACnB;AAAA,QACC,GAAG;AAAA,QAEH,UAAA;AAAA,UACC,QAAAH,2BAAA,IAAC,WAAM,MAAK,UAAS,MAAY,OAAO,aAAa,KAAK,GAAG;AAAA,UAE9D,SAAS,IAAI,CAAC,SAAS,MACtBA,2BAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cAEC;AAAA,cACA;AAAA,cACA,aAAa,aAAa,QAAQ,IAAI;AAAA,YAAA;AAAA,YAHjC;AAAA,UAAA,CAKR;AAAA,QAAA;AAAA,MAAA;AAAA,IAEL,EAAA,CAAA;AAAA,EAEJ;AACF;;"}

package/dist/cjs/Typography/Typography.styles.cjs

@@ -31,6 +31,7 @@ const { useClasses, staticClasses } = classes.createClasses("HvTypography", {
   // legacy variants
   "5xlTitle": { ...uikitStyles.theme.typography["5xlTitle"] },
   "4xlTitle": { ...uikitStyles.theme.typography["4xlTitle"] },
+  // @ts-ignore non-existent variant
   "3xlTitle": { ...uikitStyles.theme.typography["3xlTitle"] },
   xxlTitle: { ...uikitStyles.theme.typography.xxlTitle },
   xlTitle: {},

package/dist/cjs/Typography/Typography.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Typography.styles.cjs","sources":["../../../src/Typography/Typography.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nexport const { useClasses, staticClasses } = createClasses(\"HvTypography\", {\n  root: {\n    fontFamily: theme.fontFamily.body,\n  },\n  disabled: {\n    color: theme.colors.secondary_60,\n  },\n  isLink: {\n    color: theme.colors.primary,\n    textDecoration: \"underline\",\n  },\n  noWrap: {\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n  },\n  // variants\n  display: { ...theme.typography.display },\n  title1: { ...theme.typography.title1 },\n  title2: { ...theme.typography.title2 },\n  title3: { ...theme.typography.title3 },\n  title4: { ...theme.typography.title4 },\n  body: { ...theme.typography.body },\n  label: { ...theme.typography.label },\n  caption1: { ...theme.typography.caption1 },\n  caption2: { ...theme.typography.caption2 },\n  // legacy variants\n  \"5xlTitle\": { ...theme.typography[\"5xlTitle\"] },\n  \"4xlTitle\": { ...theme.typography[\"4xlTitle\"] },\n  \"3xlTitle\": { ...theme.typography[\"3xlTitle\"] },\n  xxlTitle: { ...theme.typography.xxlTitle },\n  xlTitle: {},\n  lTitle: { ...theme.typography.lTitle },\n  mTitle: {},\n  sTitle: { ...theme.typography.sTitle },\n  xsTitle: {},\n  xxsTitle: { ...theme.typography.xxsTitle },\n  sectionTitle: {\n    ...theme.typography.sectionTitle,\n    textTransform: \"uppercase\",\n  },\n  highlightText: {},\n  normalText: {},\n  placeholderText: { ...theme.typography.placeholderText },\n  link: {\n    ...theme.typography.link,\n    cursor: \"pointer\",\n    textDecoration: \"underline\",\n  },\n  disabledText: { ...theme.typography.disabledText },\n  selectedNavText: { ...theme.typography.selectedNavText },\n  vizText: {},\n  vizTextDisabled: { ...theme.typography.vizTextDisabled },\n  xsInlineLink: { ...theme.typography.xsInlineLink },\n});\n"],"names":["createClasses","theme"],"mappings":";;;;AAIO,MAAM,EAAE,YAAY,kBAAkBA,QAAAA,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,YAAYC,YAAAA,MAAM,WAAW;AAAA,EAC/B;AAAA,EACA,UAAU;AAAA,IACR,OAAOA,YAAAA,MAAM,OAAO;AAAA,EACtB;AAAA,EACA,QAAQ;AAAA,IACN,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,gBAAgB;AAAA,EAClB;AAAA,EACA,QAAQ;AAAA,IACN,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA;AAAA,EAEA,SAAS,EAAE,GAAGA,kBAAM,WAAW,QAAQ;AAAA,EACvC,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,MAAM,EAAE,GAAGA,kBAAM,WAAW,KAAK;AAAA,EACjC,OAAO,EAAE,GAAGA,kBAAM,WAAW,MAAM;AAAA,EACnC,UAAU,EAAE,GAAGA,kBAAM,WAAW,SAAS;AAAA,EACzC,UAAU,EAAE,GAAGA,kBAAM,WAAW,SAAS;AAAA;AAAA,EAEzC,YAAY,EAAE,GAAGA,YAAAA,MAAM,WAAW,UAAU,EAAE;AAAA,EAC9C,YAAY,EAAE,GAAGA,YAAAA,MAAM,WAAW,UAAU,EAAE;AAAA,EAC9C,YAAY,EAAE,GAAGA,YAAAA,MAAM,WAAW,UAAU,EAAE;AAAA,EAC9C,UAAU,EAAE,GAAGA,kBAAM,WAAW,SAAS;AAAA,EACzC,SAAS,CAAC;AAAA,EACV,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,CAAC;AAAA,EACT,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,SAAS,CAAC;AAAA,EACV,UAAU,EAAE,GAAGA,kBAAM,WAAW,SAAS;AAAA,EACzC,cAAc;AAAA,IACZ,GAAGA,YAAAA,MAAM,WAAW;AAAA,IACpB,eAAe;AAAA,EACjB;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,YAAY,CAAC;AAAA,EACb,iBAAiB,EAAE,GAAGA,kBAAM,WAAW,gBAAgB;AAAA,EACvD,MAAM;AAAA,IACJ,GAAGA,YAAAA,MAAM,WAAW;AAAA,IACpB,QAAQ;AAAA,IACR,gBAAgB;AAAA,EAClB;AAAA,EACA,cAAc,EAAE,GAAGA,kBAAM,WAAW,aAAa;AAAA,EACjD,iBAAiB,EAAE,GAAGA,kBAAM,WAAW,gBAAgB;AAAA,EACvD,SAAS,CAAC;AAAA,EACV,iBAAiB,EAAE,GAAGA,kBAAM,WAAW,gBAAgB;AAAA,EACvD,cAAc,EAAE,GAAGA,kBAAM,WAAW,aAAa;AACnD,CAAC;;;"}
+{"version":3,"file":"Typography.styles.cjs","sources":["../../../src/Typography/Typography.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\n\nexport const { useClasses, staticClasses } = createClasses(\"HvTypography\", {\n  root: {\n    fontFamily: theme.fontFamily.body,\n  },\n  disabled: {\n    color: theme.colors.secondary_60,\n  },\n  isLink: {\n    color: theme.colors.primary,\n    textDecoration: \"underline\",\n  },\n  noWrap: {\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n  },\n  // variants\n  display: { ...theme.typography.display },\n  title1: { ...theme.typography.title1 },\n  title2: { ...theme.typography.title2 },\n  title3: { ...theme.typography.title3 },\n  title4: { ...theme.typography.title4 },\n  body: { ...theme.typography.body },\n  label: { ...theme.typography.label },\n  caption1: { ...theme.typography.caption1 },\n  caption2: { ...theme.typography.caption2 },\n  // legacy variants\n  \"5xlTitle\": { ...theme.typography[\"5xlTitle\"] },\n  \"4xlTitle\": { ...theme.typography[\"4xlTitle\"] },\n  // @ts-ignore non-existent variant\n  \"3xlTitle\": { ...theme.typography[\"3xlTitle\"] },\n  xxlTitle: { ...theme.typography.xxlTitle },\n  xlTitle: {},\n  lTitle: { ...theme.typography.lTitle },\n  mTitle: {},\n  sTitle: { ...theme.typography.sTitle },\n  xsTitle: {},\n  xxsTitle: { ...theme.typography.xxsTitle },\n  sectionTitle: {\n    ...theme.typography.sectionTitle,\n    textTransform: \"uppercase\",\n  },\n  highlightText: {},\n  normalText: {},\n  placeholderText: { ...theme.typography.placeholderText },\n  link: {\n    ...theme.typography.link,\n    cursor: \"pointer\",\n    textDecoration: \"underline\",\n  },\n  disabledText: { ...theme.typography.disabledText },\n  selectedNavText: { ...theme.typography.selectedNavText },\n  vizText: {},\n  vizTextDisabled: { ...theme.typography.vizTextDisabled },\n  xsInlineLink: { ...theme.typography.xsInlineLink },\n});\n"],"names":["createClasses","theme"],"mappings":";;;;AAIO,MAAM,EAAE,YAAY,kBAAkBA,QAAAA,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,YAAYC,YAAAA,MAAM,WAAW;AAAA,EAC/B;AAAA,EACA,UAAU;AAAA,IACR,OAAOA,YAAAA,MAAM,OAAO;AAAA,EACtB;AAAA,EACA,QAAQ;AAAA,IACN,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,gBAAgB;AAAA,EAClB;AAAA,EACA,QAAQ;AAAA,IACN,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA;AAAA,EAEA,SAAS,EAAE,GAAGA,kBAAM,WAAW,QAAQ;AAAA,EACvC,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,MAAM,EAAE,GAAGA,kBAAM,WAAW,KAAK;AAAA,EACjC,OAAO,EAAE,GAAGA,kBAAM,WAAW,MAAM;AAAA,EACnC,UAAU,EAAE,GAAGA,kBAAM,WAAW,SAAS;AAAA,EACzC,UAAU,EAAE,GAAGA,kBAAM,WAAW,SAAS;AAAA;AAAA,EAEzC,YAAY,EAAE,GAAGA,YAAAA,MAAM,WAAW,UAAU,EAAE;AAAA,EAC9C,YAAY,EAAE,GAAGA,YAAAA,MAAM,WAAW,UAAU,EAAE;AAAA;AAAA,EAE9C,YAAY,EAAE,GAAGA,YAAAA,MAAM,WAAW,UAAU,EAAE;AAAA,EAC9C,UAAU,EAAE,GAAGA,kBAAM,WAAW,SAAS;AAAA,EACzC,SAAS,CAAC;AAAA,EACV,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,QAAQ,CAAC;AAAA,EACT,QAAQ,EAAE,GAAGA,kBAAM,WAAW,OAAO;AAAA,EACrC,SAAS,CAAC;AAAA,EACV,UAAU,EAAE,GAAGA,kBAAM,WAAW,SAAS;AAAA,EACzC,cAAc;AAAA,IACZ,GAAGA,YAAAA,MAAM,WAAW;AAAA,IACpB,eAAe;AAAA,EACjB;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,YAAY,CAAC;AAAA,EACb,iBAAiB,EAAE,GAAGA,kBAAM,WAAW,gBAAgB;AAAA,EACvD,MAAM;AAAA,IACJ,GAAGA,YAAAA,MAAM,WAAW;AAAA,IACpB,QAAQ;AAAA,IACR,gBAAgB;AAAA,EAClB;AAAA,EACA,cAAc,EAAE,GAAGA,kBAAM,WAAW,aAAa;AAAA,EACjD,iBAAiB,EAAE,GAAGA,kBAAM,WAAW,gBAAgB;AAAA,EACvD,SAAS,CAAC;AAAA,EACV,iBAAiB,EAAE,GAAGA,kBAAM,WAAW,gBAAgB;AAAA,EACvD,cAAc,EAAE,GAAGA,kBAAM,WAAW,aAAa;AACnD,CAAC;;;"}

package/dist/cjs/hooks/useUniqueId.cjs

@@ -1,9 +1,34 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-const uniqueId = require("lodash/uniqueId");
-const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const uniqueId__default = /* @__PURE__ */ _interopDefault(uniqueId);
-const useUniqueId = (id, idPrefix) => React.useMemo(() => id || uniqueId__default.default(idPrefix), [id, idPrefix]);
+function _interopNamespace(e) {
+  if (e && e.__esModule)
+    return e;
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespace(React);
+const useReactId = React__namespace["useId".toString()] || (() => void 0);
+let count = 0;
+const useUniqueId = (deterministicId, idPrefix) => {
+  const [id, setId] = React__namespace.useState(useReactId());
+  React__namespace.useLayoutEffect(() => {
+    if (!deterministicId)
+      setId((reactId) => reactId ?? String(count++));
+  }, [deterministicId, idPrefix]);
+  return deterministicId || (idPrefix ? idPrefix + id : id ?? "");
+};
 exports.useUniqueId = useUniqueId;
 //# sourceMappingURL=useUniqueId.cjs.map

package/dist/cjs/hooks/useUniqueId.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useUniqueId.cjs","sources":["../../../src/hooks/useUniqueId.ts"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport uniqueId from \"lodash/uniqueId\";\n\nexport const useUniqueId = (id?: string, idPrefix?: string) =>\n  useMemo(() => id || uniqueId(idPrefix), [id, idPrefix]);\n"],"names":["useMemo","uniqueId"],"mappings":";;;;;;AAIO,MAAM,cAAc,CAAC,IAAa,aACvCA,cAAQ,MAAM,MAAMC,kBAAAA,QAAS,QAAQ,GAAG,CAAC,IAAI,QAAQ,CAAC;;"}
+{"version":3,"file":"useUniqueId.cjs","sources":["../../../src/hooks/useUniqueId.ts"],"sourcesContent":["import * as React from \"react\"; // this can be optimized when react 17 support is dropped\n\n/** Credit: https://github.com/radix-ui/primitives/blob/main/packages/react/id/src/id.tsx\n *  Modified slightly to suit our purposes.\n */\n// We `toString()` to prevent bundlers from trying to `import { useId } from 'react';`\nconst useReactId = (React as any)[\"useId\".toString()] || (() => undefined);\nlet count = 0;\n\nexport const useUniqueId = (\n  deterministicId?: string,\n  idPrefix?: string\n): string => {\n  const [id, setId] = React.useState<string | undefined>(useReactId());\n\n  React.useLayoutEffect(() => {\n    // eslint-disable-next-line no-plusplus\n    if (!deterministicId) setId((reactId) => reactId ?? String(count++));\n  }, [deterministicId, idPrefix]);\n\n  return deterministicId || (idPrefix ? idPrefix + id : id ?? \"\");\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAMA,MAAM,aAAcA,iBAAc,QAAQ,SAAU,CAAA,MAAM,MAAM;AAChE,IAAI,QAAQ;AAEC,MAAA,cAAc,CACzB,iBACA,aACW;AACX,QAAM,CAAC,IAAI,KAAK,IAAIA,iBAAM,SAA6B,YAAY;AAEnEA,mBAAM,gBAAgB,MAAM;AAE1B,QAAI,CAAC;AAAiB,YAAM,CAAC,YAAY,WAAW,OAAO,OAAO,CAAC;AAAA,EAAA,GAClE,CAAC,iBAAiB,QAAQ,CAAC;AAE9B,SAAO,oBAAoB,WAAW,WAAW,KAAK,MAAM;AAC9D;;"}

package/dist/cjs/index.cjs

@@ -618,10 +618,6 @@ exports.CellWithExpandButton = useRowExpand.CellWithExpandButton;
 exports.useHvRowExpand = useRowExpand.default;
 exports.useHvHeaderGroups = useHeaderGroups.default;
 exports.useHvResizeColumns = useResizeColumns.default;
-Object.defineProperty(exports, "HvTablePluginHook", {
-  enumerable: true,
-  get: () => reactTable.PluginHook
-});
 Object.defineProperty(exports, "useHvFilters", {
   enumerable: true,
   get: () => reactTable.useFilters

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/utils/ConditionalWrapper.cjs

@@ -1,5 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
+const ConditionalWrapper = ({
+  condition,
+  wrapper,
+  children
+}) => condition ? wrapper(children) : children;
 exports.ConditionalWrapper = ConditionalWrapper;
 //# sourceMappingURL=ConditionalWrapper.cjs.map

package/dist/cjs/utils/ConditionalWrapper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ConditionalWrapper.cjs","sources":["../../../src/utils/ConditionalWrapper.tsx"],"sourcesContent":["export const ConditionalWrapper = ({ condition, wrapper, children }) =>\n  condition ? wrapper(children) : children;\n"],"names":[],"mappings":";;AAAa,MAAA,qBAAqB,CAAC,EAAE,WAAW,SAAS,eACvD,YAAY,QAAQ,QAAQ,IAAI;;"}
+{"version":3,"file":"ConditionalWrapper.cjs","sources":["../../../src/utils/ConditionalWrapper.tsx"],"sourcesContent":["export const ConditionalWrapper = ({\n  condition,\n  wrapper,\n  children,\n}: {\n  condition?: boolean;\n  wrapper: any;\n  children: React.ReactNode;\n}) => (condition ? wrapper(children) : children);\n"],"names":[],"mappings":";;AAAO,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AACF,MAIO,YAAY,QAAQ,QAAQ,IAAI;;"}

package/dist/cjs/utils/browser.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"browser.cjs","sources":["../../../src/utils/browser.ts"],"sourcesContent":["import { detect } from \"detect-browser\";\n\nexport const isBrowser = (browsers) => {\n  const browser = detect();\n  return (\n    browser &&\n    (Array.isArray(browsers)\n      ? browsers.indexOf(browser.name) > 0\n      : browsers === browser.name)\n  );\n};\n"],"names":["detect"],"mappings":";;;AAEa,MAAA,YAAY,CAAC,aAAa;AACrC,QAAM,UAAUA,cAAAA;AAChB,SACE,YACC,MAAM,QAAQ,QAAQ,IACnB,SAAS,QAAQ,QAAQ,IAAI,IAAI,IACjC,aAAa,QAAQ;AAE7B;;"}
+{"version":3,"file":"browser.cjs","sources":["../../../src/utils/browser.ts"],"sourcesContent":["import { detect } from \"detect-browser\";\n\nexport const isBrowser = (browsers: string | string[]) => {\n  const browser = detect();\n  return (\n    browser &&\n    (Array.isArray(browsers)\n      ? browsers.indexOf(browser.name) > 0\n      : browsers === browser.name)\n  );\n};\n"],"names":["detect"],"mappings":";;;AAEa,MAAA,YAAY,CAAC,aAAgC;AACxD,QAAM,UAAUA,cAAAA;AAChB,SACE,YACC,MAAM,QAAQ,QAAQ,IACnB,SAAS,QAAQ,QAAQ,IAAI,IAAI,IACjC,aAAa,QAAQ;AAE7B;;"}

package/dist/cjs/utils/focusableElementFinder.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"focusableElementFinder.cjs","sources":["../../../src/utils/focusableElementFinder.ts"],"sourcesContent":["const SELECTORS =\n  'input, button, select, textarea, a[href], [tabindex]:not([tabindex=\"-1\"])';\n\n/**\n * Gets the list of focusable elements.\n * @param node\n * @returns {*|NodeListOf<HTMLElementTagNameMap[string]>|NodeListOf<*>|NodeListOf<SVGElementTagNameMap[string]>|*[]}\n */\nconst getFocusableList = (node) =>\n  (node && node.querySelectorAll(SELECTORS)) || [];\n\n/**\n * Auxiliary function to find adjacent nodes to focus.\n *\n * @param nodeId\n * @returns {{prevFocus: *, nextFocus: *}}\n */\nconst getPrevNextFocus = (nodeId) => {\n  const nodes = getFocusableList(document);\n\n  const nbNodes = nodes.length;\n  let index = 0;\n  for (; index < nbNodes; index += 1) {\n    if (nodes[index].id === nodeId) {\n      break;\n    }\n  }\n  return {\n    nextFocus: nodes[index + 1 > nbNodes - 1 ? 0 : index + 1],\n    prevFocus: nodes[index - 1 < 0 ? nbNodes - 1 : index - 1],\n  };\n};\n\n/**\n * Get the first and last focusable element from a node.\n *\n * @param nodeId\n * @returns {{last: *, first: *}}\n */\nconst getFirstAndLastFocus = (node) => {\n  const focusableList = getFocusableList(node);\n\n  return {\n    first: focusableList[0] || null,\n    last: focusableList[focusableList.length - 1] || null,\n  };\n};\n\nexport { getFocusableList, getFirstAndLastFocus, getPrevNextFocus };\nexport default getPrevNextFocus;\n"],"names":[],"mappings":";;AAAA,MAAM,YACJ;AAOI,MAAA,mBAAmB,CAAC,SACvB,QAAQ,KAAK,iBAAiB,SAAS,KAAM,CAAC;AAQ3C,MAAA,mBAAmB,CAAC,WAAW;AAC7B,QAAA,QAAQ,iBAAiB,QAAQ;AAEvC,QAAM,UAAU,MAAM;AACtB,MAAI,QAAQ;AACL,SAAA,QAAQ,SAAS,SAAS,GAAG;AAClC,QAAI,MAAM,KAAK,EAAE,OAAO,QAAQ;AAC9B;AAAA,IACF;AAAA,EACF;AACO,SAAA;AAAA,IACL,WAAW,MAAM,QAAQ,IAAI,UAAU,IAAI,IAAI,QAAQ,CAAC;AAAA,IACxD,WAAW,MAAM,QAAQ,IAAI,IAAI,UAAU,IAAI,QAAQ,CAAC;AAAA,EAAA;AAE5D;AAQM,MAAA,uBAAuB,CAAC,SAAS;AAC/B,QAAA,gBAAgB,iBAAiB,IAAI;AAEpC,SAAA;AAAA,IACL,OAAO,cAAc,CAAC,KAAK;AAAA,IAC3B,MAAM,cAAc,cAAc,SAAS,CAAC,KAAK;AAAA,EAAA;AAErD;;;;;"}
+{"version":3,"file":"focusableElementFinder.cjs","sources":["../../../src/utils/focusableElementFinder.ts"],"sourcesContent":["const SELECTORS =\n  'input, button, select, textarea, a[href], [tabindex]:not([tabindex=\"-1\"])';\n\n/** Gets the list of focusable elements. */\nexport const getFocusableList = (node: any) =>\n  (node && node.querySelectorAll(SELECTORS)) || [];\n\n/** Auxiliary function to find adjacent nodes to focus. */\nexport const getPrevNextFocus = (nodeId?: string) => {\n  const nodes = getFocusableList(document);\n\n  const nbNodes = nodes.length;\n  let index = 0;\n  for (; index < nbNodes; index += 1) {\n    if (nodes[index].id === nodeId) {\n      break;\n    }\n  }\n  return {\n    nextFocus: nodes[index + 1 > nbNodes - 1 ? 0 : index + 1],\n    prevFocus: nodes[index - 1 < 0 ? nbNodes - 1 : index - 1],\n  };\n};\n\n/** Get the first and last focusable element from a node. */\nexport const getFirstAndLastFocus = (node: any) => {\n  const focusableList = getFocusableList(node);\n\n  return {\n    first: focusableList[0] || null,\n    last: focusableList[focusableList.length - 1] || null,\n  };\n};\n\nexport default getPrevNextFocus;\n"],"names":[],"mappings":";;AAAA,MAAM,YACJ;AAGW,MAAA,mBAAmB,CAAC,SAC9B,QAAQ,KAAK,iBAAiB,SAAS,KAAM,CAAC;AAGpC,MAAA,mBAAmB,CAAC,WAAoB;AAC7C,QAAA,QAAQ,iBAAiB,QAAQ;AAEvC,QAAM,UAAU,MAAM;AACtB,MAAI,QAAQ;AACL,SAAA,QAAQ,SAAS,SAAS,GAAG;AAClC,QAAI,MAAM,KAAK,EAAE,OAAO,QAAQ;AAC9B;AAAA,IACF;AAAA,EACF;AACO,SAAA;AAAA,IACL,WAAW,MAAM,QAAQ,IAAI,UAAU,IAAI,IAAI,QAAQ,CAAC;AAAA,IACxD,WAAW,MAAM,QAAQ,IAAI,IAAI,UAAU,IAAI,QAAQ,CAAC;AAAA,EAAA;AAE5D;AAGa,MAAA,uBAAuB,CAAC,SAAc;AAC3C,QAAA,gBAAgB,iBAAiB,IAAI;AAEpC,SAAA;AAAA,IACL,OAAO,cAAc,CAAC,KAAK;AAAA,IAC3B,MAAM,cAAc,cAAc,SAAS,CAAC,KAAK;AAAA,EAAA;AAErD;;;;;"}

package/dist/cjs/utils/getComponentName.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"getComponentName.cjs","sources":["../../../src/utils/getComponentName.ts"],"sourcesContent":["export const getComponentName = (Component) =>\n  Component.displayName || Component.name || \"\";\n"],"names":[],"mappings":";;AAAO,MAAM,mBAAmB,CAAC,cAC/B,UAAU,eAAe,UAAU,QAAQ;;"}
+{"version":3,"file":"getComponentName.cjs","sources":["../../../src/utils/getComponentName.ts"],"sourcesContent":["export const getComponentName = (Component: React.FC) =>\n  Component.displayName || Component.name || \"\";\n"],"names":[],"mappings":";;AAAO,MAAM,mBAAmB,CAAC,cAC/B,UAAU,eAAe,UAAU,QAAQ;;"}

package/dist/cjs/utils/hexToRgbA.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"hexToRgbA.cjs","sources":["../../../src/utils/hexToRgbA.ts"],"sourcesContent":["import { hexToRgb, alpha } from \"@mui/material/styles\";\n\n// TODO - remove in v6 in favor of theme.alpha()\nexport const hexToRgbA = (hex, factor = 0.8) => alpha(hexToRgb(hex), factor);\n"],"names":["alpha","hexToRgb"],"mappings":";;;AAGa,MAAA,YAAY,CAAC,KAAK,SAAS,QAAQA,OAAAA,MAAMC,OAAA,SAAS,GAAG,GAAG,MAAM;;"}
+{"version":3,"file":"hexToRgbA.cjs","sources":["../../../src/utils/hexToRgbA.ts"],"sourcesContent":["import { hexToRgb, alpha } from \"@mui/material/styles\";\n\n// TODO - remove in v6 in favor of theme.alpha()\nexport const hexToRgbA = (hex: string, factor = 0.8) =>\n  alpha(hexToRgb(hex), factor);\n"],"names":["alpha","hexToRgb"],"mappings":";;;AAGa,MAAA,YAAY,CAAC,KAAa,SAAS,QAC9CA,OAAAA,MAAMC,OAAA,SAAS,GAAG,GAAG,MAAM;;"}

package/dist/cjs/utils/multiSelectionEventHandler.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"multiSelectionEventHandler.cjs","sources":["../../../src/utils/multiSelectionEventHandler.ts"],"sourcesContent":["const cycleThroughSelection = (\n  selectedState,\n  index,\n  allValues,\n  selectionCheck\n) => {\n  const newValue: any[] = [];\n  selectedState.forEach((isSelected, i) => {\n    if (i === index) {\n      if (selectionCheck || !isSelected) {\n        newValue.push(allValues[i]);\n      }\n    } else if (isSelected) {\n      newValue.push(allValues[i]);\n    }\n  });\n\n  return newValue;\n};\n\nexport const multiSelectionEventHandler = (\n  evt,\n  index,\n  selectionAnchor,\n  allValues,\n  selectedState,\n  selectionCheck\n) => {\n  let newValue: any[] = [];\n\n  if (evt.nativeEvent.shiftKey) {\n    if (selectionAnchor.current === undefined) {\n      selectionAnchor.current = index;\n      newValue.push(allValues[index]);\n    } else {\n      let selectionStart;\n      let selectionEnd;\n      if (selectionAnchor.current > index) {\n        selectionStart = index;\n        selectionEnd = selectionAnchor.current + 1;\n      } else {\n        selectionStart = selectionAnchor.current;\n        selectionEnd = index + 1;\n      }\n\n      const selectedValues = allValues.slice(selectionStart, selectionEnd);\n\n      newValue.push(...selectedValues);\n    }\n  } else if (evt.nativeEvent.metaKey) {\n    selectionAnchor.current = index;\n\n    newValue = cycleThroughSelection(\n      selectedState,\n      index,\n      allValues,\n      selectionCheck\n    );\n  } else {\n    selectionAnchor.current = index;\n\n    newValue = cycleThroughSelection(\n      selectedState,\n      index,\n      allValues,\n      selectionCheck\n    );\n  }\n\n  return newValue;\n};\n"],"names":[],"mappings":";;AAAA,MAAM,wBAAwB,CAC5B,eACA,OACA,WACA,mBACG;AACH,QAAM,WAAkB,CAAA;AACV,gBAAA,QAAQ,CAAC,YAAY,MAAM;AACvC,QAAI,MAAM,OAAO;AACX,UAAA,kBAAkB,CAAC,YAAY;AACxB,iBAAA,KAAK,UAAU,CAAC,CAAC;AAAA,MAC5B;AAAA,eACS,YAAY;AACZ,eAAA,KAAK,UAAU,CAAC,CAAC;AAAA,IAC5B;AAAA,EAAA,CACD;AAEM,SAAA;AACT;AAEO,MAAM,6BAA6B,CACxC,KACA,OACA,iBACA,WACA,eACA,mBACG;AACH,MAAI,WAAkB,CAAA;AAElB,MAAA,IAAI,YAAY,UAAU;AACxB,QAAA,gBAAgB,YAAY,QAAW;AACzC,sBAAgB,UAAU;AACjB,eAAA,KAAK,UAAU,KAAK,CAAC;AAAA,IAAA,OACzB;AACD,UAAA;AACA,UAAA;AACA,UAAA,gBAAgB,UAAU,OAAO;AAClB,yBAAA;AACjB,uBAAe,gBAAgB,UAAU;AAAA,MAAA,OACpC;AACL,yBAAiB,gBAAgB;AACjC,uBAAe,QAAQ;AAAA,MACzB;AAEA,YAAM,iBAAiB,UAAU,MAAM,gBAAgB,YAAY;AAE1D,eAAA,KAAK,GAAG,cAAc;AAAA,IACjC;AAAA,EAAA,WACS,IAAI,YAAY,SAAS;AAClC,oBAAgB,UAAU;AAEf,eAAA;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF,OACK;AACL,oBAAgB,UAAU;AAEf,eAAA;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EAEJ;AAEO,SAAA;AACT;;"}
+{"version":3,"file":"multiSelectionEventHandler.cjs","sources":["../../../src/utils/multiSelectionEventHandler.ts"],"sourcesContent":["const cycleThroughSelection = (\n  selectedState: boolean[],\n  index: number,\n  allValues: any[],\n  selectionCheck: any\n) => {\n  const newValue: any[] = [];\n  selectedState.forEach((isSelected, i) => {\n    if (i === index) {\n      if (selectionCheck || !isSelected) {\n        newValue.push(allValues[i]);\n      }\n    } else if (isSelected) {\n      newValue.push(allValues[i]);\n    }\n  });\n\n  return newValue;\n};\n\nexport const multiSelectionEventHandler = (\n  evt: any,\n  index: number,\n  selectionAnchor: any,\n  allValues: any[],\n  selectedState: boolean[],\n  selectionCheck: any\n) => {\n  let newValue: any[] = [];\n\n  if (evt.nativeEvent.shiftKey) {\n    if (selectionAnchor.current === undefined) {\n      selectionAnchor.current = index;\n      newValue.push(allValues[index]);\n    } else {\n      let selectionStart;\n      let selectionEnd;\n      if (selectionAnchor.current > index) {\n        selectionStart = index;\n        selectionEnd = selectionAnchor.current + 1;\n      } else {\n        selectionStart = selectionAnchor.current;\n        selectionEnd = index + 1;\n      }\n\n      const selectedValues = allValues.slice(selectionStart, selectionEnd);\n\n      newValue.push(...selectedValues);\n    }\n  } else if (evt.nativeEvent.metaKey) {\n    selectionAnchor.current = index;\n\n    newValue = cycleThroughSelection(\n      selectedState,\n      index,\n      allValues,\n      selectionCheck\n    );\n  } else {\n    selectionAnchor.current = index;\n\n    newValue = cycleThroughSelection(\n      selectedState,\n      index,\n      allValues,\n      selectionCheck\n    );\n  }\n\n  return newValue;\n};\n"],"names":[],"mappings":";;AAAA,MAAM,wBAAwB,CAC5B,eACA,OACA,WACA,mBACG;AACH,QAAM,WAAkB,CAAA;AACV,gBAAA,QAAQ,CAAC,YAAY,MAAM;AACvC,QAAI,MAAM,OAAO;AACX,UAAA,kBAAkB,CAAC,YAAY;AACxB,iBAAA,KAAK,UAAU,CAAC,CAAC;AAAA,MAC5B;AAAA,eACS,YAAY;AACZ,eAAA,KAAK,UAAU,CAAC,CAAC;AAAA,IAC5B;AAAA,EAAA,CACD;AAEM,SAAA;AACT;AAEO,MAAM,6BAA6B,CACxC,KACA,OACA,iBACA,WACA,eACA,mBACG;AACH,MAAI,WAAkB,CAAA;AAElB,MAAA,IAAI,YAAY,UAAU;AACxB,QAAA,gBAAgB,YAAY,QAAW;AACzC,sBAAgB,UAAU;AACjB,eAAA,KAAK,UAAU,KAAK,CAAC;AAAA,IAAA,OACzB;AACD,UAAA;AACA,UAAA;AACA,UAAA,gBAAgB,UAAU,OAAO;AAClB,yBAAA;AACjB,uBAAe,gBAAgB,UAAU;AAAA,MAAA,OACpC;AACL,yBAAiB,gBAAgB;AACjC,uBAAe,QAAQ;AAAA,MACzB;AAEA,YAAM,iBAAiB,UAAU,MAAM,gBAAgB,YAAY;AAE1D,eAAA,KAAK,GAAG,cAAc;AAAA,IACjC;AAAA,EAAA,WACS,IAAI,YAAY,SAAS;AAClC,oBAAgB,UAAU;AAEf,eAAA;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF,OACK;AACL,oBAAgB,UAAU;AAEf,eAAA;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EAEJ;AAEO,SAAA;AACT;;"}

package/dist/cjs/utils/setId.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"setId.cjs","sources":["../../../src/utils/setId.ts"],"sourcesContent":["import uniqueId from \"lodash/uniqueId\";\n\nexport const setId = (...args) =>\n  args.some((arg) => arg == null) ? undefined : args.join(\"-\");\n\nexport const setUid = (id, suffix) => {\n  const uid = setId(id, suffix);\n  return uid ? uniqueId(uid) : undefined;\n};\n"],"names":["uniqueId"],"mappings":";;;;;AAEO,MAAM,QAAQ,IAAI,SACvB,KAAK,KAAK,CAAC,QAAQ,OAAO,IAAI,IAAI,SAAY,KAAK,KAAK,GAAG;AAEhD,MAAA,SAAS,CAAC,IAAI,WAAW;AAC9B,QAAA,MAAM,MAAM,IAAI,MAAM;AACrB,SAAA,MAAMA,kBAAS,QAAA,GAAG,IAAI;AAC/B;;;"}
+{"version":3,"file":"setId.cjs","sources":["../../../src/utils/setId.ts"],"sourcesContent":["import uniqueId from \"lodash/uniqueId\";\n\nexport const setId = (...args: any[]) =>\n  args.some((arg) => arg == null) ? undefined : args.join(\"-\");\n\nexport const setUid = (id: string, suffix: string) => {\n  const uid = setId(id, suffix);\n  return uid ? uniqueId(uid) : undefined;\n};\n"],"names":["uniqueId"],"mappings":";;;;;AAEO,MAAM,QAAQ,IAAI,SACvB,KAAK,KAAK,CAAC,QAAQ,OAAO,IAAI,IAAI,SAAY,KAAK,KAAK,GAAG;AAEhD,MAAA,SAAS,CAAC,IAAY,WAAmB;AAC9C,QAAA,MAAM,MAAM,IAAI,MAAM;AACrB,SAAA,MAAMA,kBAAS,QAAA,GAAG,IAAI;AAC/B;;;"}

package/dist/cjs/utils/theme.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"theme.cjs","sources":["../../../src/utils/theme.ts"],"sourcesContent":["import { CSSProperties } from \"react\";\n\nimport {\n  themes,\n  HvThemeColorModeStructure,\n  HvThemeStructure,\n  theme,\n} from \"@hitachivantara/uikit-styles\";\n\nimport { HvTheme, HvCreateThemeProps } from \"../types/theme\";\n\nimport { getElementById } from \"./document\";\n\n/**\n * Sets the element style properties.\n */\nconst setElementStyle = (element: HTMLElement, style: CSSProperties) => {\n  Object.entries(style).forEach(([property, value]) => {\n    element.style[property] = value;\n  });\n};\n\n/**\n * Sets the element attributes and style for a theme and color mode.\n */\nexport const setElementAttrs = (\n  themeName: string,\n  modeName: string,\n  colorScheme: string,\n  themeRootId?: string\n) => {\n  const element = themeRootId\n    ? document.getElementById(themeRootId)\n    : document.body;\n\n  if (element) {\n    element.setAttribute(`data-theme`, themeName);\n    element.setAttribute(`data-color-mode`, modeName);\n\n    // Set default properties for all components to inherit\n    setElementStyle(element, {\n      colorScheme,\n      backgroundColor: theme.colors.backgroundColor,\n      accentColor: theme.colors.secondary,\n      color: theme.colors.secondary,\n      fontSize: theme.typography.body.fontSize,\n      fontWeight: theme.typography.body.fontWeight,\n      lineHeight: theme.typography.body.lineHeight,\n      letterSpacing: theme.typography.body.letterSpacing,\n      fontFamily: theme.fontFamily.body,\n    });\n  }\n};\n\n/**\n * Applies customizations to a theme.\n */\nconst applyThemeCustomizations = (obj: object, customizations: object) => {\n  const isObject = (val: any) =>\n    val && typeof val === \"object\" && !Array.isArray(val);\n\n  // Customized theme\n  const customizedTheme = { ...obj };\n\n  // Add new values to the theme or replace values\n  Object.keys(customizations).forEach((key) => {\n    if (customizedTheme[key]) {\n      if (isObject(customizedTheme[key]) && isObject(customizations[key])) {\n        customizedTheme[key] = applyThemeCustomizations(\n          customizedTheme[key],\n          customizations[key]\n        );\n      } else if (typeof customizedTheme[key] === typeof customizations[key]) {\n        customizedTheme[key] = customizations[key];\n      }\n    } else {\n      customizedTheme[key] = customizations[key];\n    }\n  });\n\n  return customizedTheme;\n};\n\n/**\n * Creates a customized theme based on the base theme and customizations given.\n * For the color modes, the colors that are not defined will be replaced by the values from the dawn mode of the base theme.\n */\nexport const createTheme = (\n  props: HvCreateThemeProps\n): HvTheme | HvThemeStructure => {\n  const {\n    name,\n    base = \"ds5\",\n    inheritColorModes = true,\n    ...customizations\n  } = props;\n\n  // Apply customizations to the base theme\n  const customizedTheme: HvTheme | HvThemeStructure = customizations\n    ? (applyThemeCustomizations(themes[base], customizations) as HvTheme)\n    : { ...themes[base] };\n\n  // Set theme name\n  customizedTheme.name = name.trim();\n  // Set theme base\n  customizedTheme.base = base;\n\n  // Fill new color modes with missing colors\n  if (customizations) {\n    Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n      if (!themes[base].colors.modes[mode]) {\n        customizedTheme.colors.modes[mode] = {\n          ...themes[base].colors.modes.dawn,\n          ...(customizedTheme.colors.modes[mode] as Partial<\n            HvThemeColorModeStructure & { [key: string]: string }\n          >),\n        };\n      }\n    });\n  }\n\n  // If the flag `inheritColorModes` is false and customizations were given for the color modes,\n  // we're removing any color modes that might have been inherited\n  if (!inheritColorModes && customizations.colors?.modes) {\n    Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n      if (!Object.keys(customizations.colors?.modes || {}).includes(mode)) {\n        delete customizedTheme.colors.modes[mode];\n      }\n    });\n  }\n\n  // Created theme\n  return customizedTheme;\n};\n\n/**\n * Process the themes provided to the HvProvider:\n *  - Cleans themes with the same name\n *  - Returns the default if the list is empty (ds5)\n */\nexport const processThemes = (\n  themesList?: (HvTheme | HvThemeStructure)[]\n): (HvTheme | HvThemeStructure)[] => {\n  if (themesList && Array.isArray(themesList) && themesList.length > 0) {\n    const list: (HvTheme | HvThemeStructure)[] = [];\n\n    themesList.forEach((thm) => {\n      const i: number = list.findIndex(\n        (t) => t.name.trim() === thm.name.trim()\n      );\n\n      if (i !== -1) {\n        list.splice(i, 1);\n        list.push(thm);\n      } else {\n        list.push(thm);\n      }\n    });\n\n    // Cleaned themes\n    return list;\n  }\n  // DS5\n  return [themes.ds5];\n};\n\nexport const getVarValue = (cssVar: string, rootElementId?: string) => {\n  const root = getElementById(rootElementId || \"hv-root\");\n  if (!root) return undefined;\n\n  return getComputedStyle(root)\n    .getPropertyValue(cssVar.replace(\"var(\", \"\").replace(\")\", \"\"))\n    .trim();\n};\n"],"names":["theme","themes","getElementById"],"mappings":"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"}
+{"version":3,"file":"theme.cjs","sources":["../../../src/utils/theme.ts"],"sourcesContent":["import { CSSProperties } from \"react\";\n\nimport {\n  themes,\n  HvThemeColorModeStructure,\n  HvThemeStructure,\n  theme,\n} from \"@hitachivantara/uikit-styles\";\n\nimport { HvTheme, HvCreateThemeProps } from \"../types/theme\";\n\nimport { getElementById } from \"./document\";\n\n/**\n * Sets the element style properties.\n */\nconst setElementStyle = (element: HTMLElement, style: CSSProperties) => {\n  Object.entries(style).forEach(([property, value]) => {\n    element.style[property] = value;\n  });\n};\n\n/**\n * Sets the element attributes and style for a theme and color mode.\n */\nexport const setElementAttrs = (\n  themeName: string,\n  modeName: string,\n  colorScheme: string,\n  themeRootId?: string\n) => {\n  const element = themeRootId\n    ? document.getElementById(themeRootId)\n    : document.body;\n\n  if (element) {\n    element.setAttribute(`data-theme`, themeName);\n    element.setAttribute(`data-color-mode`, modeName);\n\n    // Set default properties for all components to inherit\n    setElementStyle(element, {\n      colorScheme,\n      backgroundColor: theme.colors.backgroundColor,\n      accentColor: theme.colors.secondary,\n      color: theme.colors.secondary,\n      fontSize: theme.typography.body.fontSize,\n      fontWeight: theme.typography.body.fontWeight,\n      lineHeight: theme.typography.body.lineHeight,\n      letterSpacing: theme.typography.body.letterSpacing,\n      fontFamily: theme.fontFamily.body,\n    });\n  }\n};\n\n/**\n * Applies customizations to a theme.\n */\nconst applyThemeCustomizations = (obj: any, customizations: any) => {\n  const isObject = (val: any) =>\n    val && typeof val === \"object\" && !Array.isArray(val);\n\n  // Customized theme\n  const customizedTheme = { ...obj };\n\n  // Add new values to the theme or replace values\n  Object.keys(customizations).forEach((key) => {\n    if (customizedTheme[key]) {\n      if (isObject(customizedTheme[key]) && isObject(customizations[key])) {\n        customizedTheme[key] = applyThemeCustomizations(\n          customizedTheme[key],\n          customizations[key]\n        );\n      } else if (typeof customizedTheme[key] === typeof customizations[key]) {\n        customizedTheme[key] = customizations[key];\n      }\n    } else {\n      customizedTheme[key] = customizations[key];\n    }\n  });\n\n  return customizedTheme;\n};\n\n/**\n * Creates a customized theme based on the base theme and customizations given.\n * For the color modes, the colors that are not defined will be replaced by the values from the dawn mode of the base theme.\n */\nexport const createTheme = (\n  props: HvCreateThemeProps\n): HvTheme | HvThemeStructure => {\n  const {\n    name,\n    base = \"ds5\",\n    inheritColorModes = true,\n    ...customizations\n  } = props;\n\n  // Apply customizations to the base theme\n  const customizedTheme: HvTheme | HvThemeStructure = customizations\n    ? (applyThemeCustomizations(themes[base], customizations) as HvTheme)\n    : { ...themes[base] };\n\n  // Set theme name\n  customizedTheme.name = name.trim();\n  // Set theme base\n  customizedTheme.base = base;\n\n  // Fill new color modes with missing colors\n  if (customizations) {\n    Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n      if (!themes[base].colors.modes[mode]) {\n        customizedTheme.colors.modes[mode] = {\n          ...themes[base].colors.modes.dawn,\n          ...(customizedTheme.colors.modes[mode] as Partial<\n            HvThemeColorModeStructure & { [key: string]: string }\n          >),\n        };\n      }\n    });\n  }\n\n  // If the flag `inheritColorModes` is false and customizations were given for the color modes,\n  // we're removing any color modes that might have been inherited\n  if (!inheritColorModes && customizations.colors?.modes) {\n    Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n      if (!Object.keys(customizations.colors?.modes || {}).includes(mode)) {\n        delete customizedTheme.colors.modes[mode];\n      }\n    });\n  }\n\n  // Created theme\n  return customizedTheme;\n};\n\n/**\n * Process the themes provided to the HvProvider:\n *  - Cleans themes with the same name\n *  - Returns the default if the list is empty (ds5)\n */\nexport const processThemes = (\n  themesList?: (HvTheme | HvThemeStructure)[]\n): (HvTheme | HvThemeStructure)[] => {\n  if (themesList && Array.isArray(themesList) && themesList.length > 0) {\n    const list: (HvTheme | HvThemeStructure)[] = [];\n\n    themesList.forEach((thm) => {\n      const i: number = list.findIndex(\n        (t) => t.name.trim() === thm.name.trim()\n      );\n\n      if (i !== -1) {\n        list.splice(i, 1);\n        list.push(thm);\n      } else {\n        list.push(thm);\n      }\n    });\n\n    // Cleaned themes\n    return list;\n  }\n  // DS5\n  return [themes.ds5];\n};\n\nexport const getVarValue = (cssVar: string, rootElementId?: string) => {\n  const root = getElementById(rootElementId || \"hv-root\");\n  if (!root) return undefined;\n\n  return getComputedStyle(root)\n    .getPropertyValue(cssVar.replace(\"var(\", \"\").replace(\")\", \"\"))\n    .trim();\n};\n"],"names":["theme","themes","getElementById"],"mappings":"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"}

package/dist/cjs/utils/wrapperTooltip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"wrapperTooltip.cjs","sources":["../../../src/utils/wrapperTooltip.tsx"],"sourcesContent":["import { withTooltip } from \"../hocs/withTooltip\";\n\nconst hideTooltip = (evt) => {\n  const isOverFlow =\n    evt.target.children.length > 1\n      ? Array.of(...evt.target.children).some(\n          (child) => child.scrollWidth > child.clientWidth\n        )\n      : evt.target.scrollWidth > evt.target.clientWidth;\n\n  return !isOverFlow;\n};\n\nexport const wrapperTooltip = (hasTooltips, Component, label) => {\n  const ComponentFunction = () => Component;\n  return hasTooltips\n    ? withTooltip(ComponentFunction, label, \"top\", hideTooltip)\n    : ComponentFunction;\n};\n"],"names":["withTooltip"],"mappings":";;;AAEA,MAAM,cAAc,CAAC,QAAQ;AAC3B,QAAM,aACJ,IAAI,OAAO,SAAS,SAAS,IACzB,MAAM,GAAG,GAAG,IAAI,OAAO,QAAQ,EAAE;AAAA,IAC/B,CAAC,UAAU,MAAM,cAAc,MAAM;AAAA,EAAA,IAEvC,IAAI,OAAO,cAAc,IAAI,OAAO;AAE1C,SAAO,CAAC;AACV;AAEO,MAAM,iBAAiB,CAAC,aAAa,WAAW,UAAU;AAC/D,QAAM,oBAAoB,MAAM;AAChC,SAAO,cACHA,YAAAA,YAAY,mBAAmB,OAAO,OAAO,WAAW,IACxD;AACN;;"}
+{"version":3,"file":"wrapperTooltip.cjs","sources":["../../../src/utils/wrapperTooltip.tsx"],"sourcesContent":["import { withTooltip } from \"../hocs/withTooltip\";\n\nconst hideTooltip = (evt: any) => {\n  const isOverFlow =\n    evt.target.children.length > 1\n      ? Array.of(...evt.target.children).some(\n          (child) => child.scrollWidth > child.clientWidth\n        )\n      : evt.target.scrollWidth > evt.target.clientWidth;\n\n  return !isOverFlow;\n};\n\nexport const wrapperTooltip = (\n  hasTooltips: boolean,\n  Component: any,\n  label: any\n) => {\n  const ComponentFunction = () => Component;\n  return hasTooltips\n    ? withTooltip(ComponentFunction, label, \"top\", hideTooltip)\n    : ComponentFunction;\n};\n"],"names":["withTooltip"],"mappings":";;;AAEA,MAAM,cAAc,CAAC,QAAa;AAChC,QAAM,aACJ,IAAI,OAAO,SAAS,SAAS,IACzB,MAAM,GAAG,GAAG,IAAI,OAAO,QAAQ,EAAE;AAAA,IAC/B,CAAC,UAAU,MAAM,cAAc,MAAM;AAAA,EAAA,IAEvC,IAAI,OAAO,cAAc,IAAI,OAAO;AAE1C,SAAO,CAAC;AACV;AAEO,MAAM,iBAAiB,CAC5B,aACA,WACA,UACG;AACH,QAAM,oBAAoB,MAAM;AAChC,SAAO,cACHA,YAAAA,YAAY,mBAAmB,OAAO,OAAO,WAAW,IACxD;AACN;;"}

package/dist/esm/Accordion/Accordion.mjs

@@ -3,13 +3,14 @@ import { useCallback, useMemo } from "react";
 import { DropUpXS, DropDownXS } from "@hitachivantara/uikit-react-icons";
 import { useDefaultProps } from "../hooks/useDefaultProps.mjs";
 import { useControlled } from "../hooks/useControlled.mjs";
+import { useUniqueId } from "../hooks/useUniqueId.mjs";
 import { setId } from "../utils/setId.mjs";
 import { useClasses } from "./Accordion.styles.mjs";
 import { staticClasses } from "./Accordion.styles.mjs";
 import { HvTypography } from "../Typography/Typography.mjs";
 const HvAccordion = (props) => {
   const {
-    id,
+    id: idProp,
     className,
     classes: classesProp,
     disabled = false,
@@ -23,6 +24,7 @@ const HvAccordion = (props) => {
     labelVariant = "label",
     ...others
   } = useDefaultProps("HvAccordion", props);
+  const id = useUniqueId(idProp, "hvaccordion");
   const { classes, cx } = useClasses(classesProp);
   const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));
   const handleAction = useCallback(

package/dist/esm/Accordion/Accordion.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.mjs","sources":["../../../src/Accordion/Accordion.tsx"],"sourcesContent":["import React, {\n  SyntheticEvent,\n  useCallback,\n  useMemo,\n  HTMLAttributes,\n} from \"react\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { useControlled } from \"../hooks/useControlled\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { setId } from \"../utils/setId\";\nimport { HvTypographyVariants, HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Accordion.styles\";\n\nexport { staticClasses as accordionClasses };\n\nexport type HvAccordionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvAccordionProps\n  extends HvBaseProps<HTMLDivElement, \"onChange\" | \"children\"> {\n  /**\n   * Content to be rendered\n   */\n  children: React.ReactNode;\n  /**\n   * The accordion label button.\n   */\n  label?: string;\n  /**\n   * The function that will be executed whenever the accordion toggles it will receive the state of the accordion\n   */\n  onChange?: (event: React.SyntheticEvent, value: boolean) => void;\n  /**\n   * Whether the accordion is open or not, if this property is defined the accordion must be fully controlled.\n   */\n  expanded?: boolean;\n  /**\n   * When uncontrolled, defines the initial expanded state.\n   */\n  defaultExpanded?: boolean;\n  /**\n   * An object containing props to be passed onto container holding the accordion children.\n   */\n  containerProps?: HTMLAttributes<HTMLDivElement>;\n  /**\n   * Heading Level to apply to accordion button if ´undefined´ the button won't have a header wrapper.\n   */\n  headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;\n  /**\n   * Is the accordion disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Typography variant for the label.\n   */\n  labelVariant?: HvTypographyVariants;\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes?: HvAccordionClasses;\n}\n\n/**\n * A accordion is a design element that expands in place to expose hidden information.\n */\nexport const HvAccordion = (props: HvAccordionProps) => {\n  const {\n    id,\n    className,\n    classes: classesProp,\n    disabled = false,\n    label,\n    onChange,\n    children,\n    expanded,\n    headingLevel,\n    defaultExpanded = false,\n    containerProps,\n    labelVariant = \"label\",\n    ...others\n  } = useDefaultProps(\"HvAccordion\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n  const handleAction = useCallback(\n    (event: SyntheticEvent) => {\n      if (!disabled) {\n        onChange?.(event, isOpen);\n        setIsOpen(!isOpen);\n        return true;\n      }\n      return false;\n    },\n    [disabled, onChange, isOpen, setIsOpen]\n  );\n\n  const handleClick = useCallback(\n    (event: SyntheticEvent) => {\n      handleAction(event);\n      event.preventDefault();\n      event.stopPropagation();\n    },\n    [handleAction]\n  );\n\n  const handleKeyDown = useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      let isEventHandled = false;\n      const { key } = event;\n\n      if (\n        event.altKey ||\n        event.ctrlKey ||\n        event.metaKey ||\n        event.currentTarget !== event.target\n      ) {\n        return;\n      }\n      switch (key) {\n        case \"Enter\":\n        case \" \":\n          isEventHandled = handleAction(event);\n          break;\n        default:\n          return;\n      }\n\n      if (isEventHandled) {\n        event.preventDefault();\n        event.stopPropagation();\n      }\n    },\n    [handleAction]\n  );\n\n  const accordionHeaderId = setId(id, \"button\");\n  const accordionContainer = setId(id, \"container\");\n  const accordionHeader = useMemo(() => {\n    const color = disabled ? \"secondary_60\" : undefined;\n\n    const accordionButton = (\n      <HvTypography\n        id={accordionHeaderId}\n        component=\"div\"\n        role=\"button\"\n        className={cx(classes.label, { [classes.disabled]: disabled })}\n        disabled={disabled}\n        tabIndex={0}\n        onKeyDown={handleKeyDown}\n        onClick={handleClick}\n        variant={labelVariant}\n        aria-expanded={isOpen}\n        aria-disabled={disabled}\n      >\n        {isOpen ? <DropUpXS color={color} /> : <DropDownXS color={color} />}\n        {label}\n      </HvTypography>\n    );\n\n    return headingLevel === undefined ? (\n      accordionButton\n    ) : (\n      <HvTypography component={`h${headingLevel}`} variant={labelVariant}>\n        {accordionButton}\n      </HvTypography>\n    );\n  }, [\n    cx,\n    classes,\n    handleClick,\n    handleKeyDown,\n    label,\n    accordionHeaderId,\n    disabled,\n    headingLevel,\n    isOpen,\n    labelVariant,\n  ]);\n\n  return (\n    <div id={id} className={cx(classes.root, className)} {...others}>\n      {accordionHeader}\n      <div\n        id={accordionContainer}\n        role=\"region\"\n        aria-labelledby={accordionHeaderId}\n        className={cx(classes.container, { [classes.hidden]: !isOpen })}\n        hidden={!isOpen}\n        {...containerProps}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Accordion.mjs","sources":["../../../src/Accordion/Accordion.tsx"],"sourcesContent":["import React, {\n  SyntheticEvent,\n  useCallback,\n  useMemo,\n  HTMLAttributes,\n} from \"react\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\n\nimport { HvBaseProps } from \"../types/generic\";\nimport { setId } from \"../utils/setId\";\nimport { HvTypographyVariants, HvTypography } from \"../Typography\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Accordion.styles\";\n\nexport { staticClasses as accordionClasses };\n\nexport type HvAccordionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvAccordionProps\n  extends HvBaseProps<HTMLDivElement, \"onChange\" | \"children\"> {\n  /**\n   * Content to be rendered\n   */\n  children: React.ReactNode;\n  /**\n   * The accordion label button.\n   */\n  label?: string;\n  /**\n   * The function that will be executed whenever the accordion toggles it will receive the state of the accordion\n   */\n  onChange?: (event: React.SyntheticEvent, value: boolean) => void;\n  /**\n   * Whether the accordion is open or not, if this property is defined the accordion must be fully controlled.\n   */\n  expanded?: boolean;\n  /**\n   * When uncontrolled, defines the initial expanded state.\n   */\n  defaultExpanded?: boolean;\n  /**\n   * An object containing props to be passed onto container holding the accordion children.\n   */\n  containerProps?: HTMLAttributes<HTMLDivElement>;\n  /**\n   * Heading Level to apply to accordion button if ´undefined´ the button won't have a header wrapper.\n   */\n  headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;\n  /**\n   * Is the accordion disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Typography variant for the label.\n   */\n  labelVariant?: HvTypographyVariants;\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes?: HvAccordionClasses;\n}\n\n/**\n * A accordion is a design element that expands in place to expose hidden information.\n */\nexport const HvAccordion = (props: HvAccordionProps) => {\n  const {\n    id: idProp,\n    className,\n    classes: classesProp,\n    disabled = false,\n    label,\n    onChange,\n    children,\n    expanded,\n    headingLevel,\n    defaultExpanded = false,\n    containerProps,\n    labelVariant = \"label\",\n    ...others\n  } = useDefaultProps(\"HvAccordion\", props);\n\n  const id = useUniqueId(idProp, \"hvaccordion\");\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n  const handleAction = useCallback(\n    (event: SyntheticEvent) => {\n      if (!disabled) {\n        onChange?.(event, isOpen);\n        setIsOpen(!isOpen);\n        return true;\n      }\n      return false;\n    },\n    [disabled, onChange, isOpen, setIsOpen]\n  );\n\n  const handleClick = useCallback(\n    (event: SyntheticEvent) => {\n      handleAction(event);\n      event.preventDefault();\n      event.stopPropagation();\n    },\n    [handleAction]\n  );\n\n  const handleKeyDown = useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      let isEventHandled = false;\n      const { key } = event;\n\n      if (\n        event.altKey ||\n        event.ctrlKey ||\n        event.metaKey ||\n        event.currentTarget !== event.target\n      ) {\n        return;\n      }\n      switch (key) {\n        case \"Enter\":\n        case \" \":\n          isEventHandled = handleAction(event);\n          break;\n        default:\n          return;\n      }\n\n      if (isEventHandled) {\n        event.preventDefault();\n        event.stopPropagation();\n      }\n    },\n    [handleAction]\n  );\n\n  const accordionHeaderId = setId(id, \"button\");\n  const accordionContainer = setId(id, \"container\");\n  const accordionHeader = useMemo(() => {\n    const color = disabled ? \"secondary_60\" : undefined;\n\n    const accordionButton = (\n      <HvTypography\n        id={accordionHeaderId}\n        component=\"div\"\n        role=\"button\"\n        className={cx(classes.label, { [classes.disabled]: disabled })}\n        disabled={disabled}\n        tabIndex={0}\n        onKeyDown={handleKeyDown}\n        onClick={handleClick}\n        variant={labelVariant}\n        aria-expanded={isOpen}\n        aria-disabled={disabled}\n      >\n        {isOpen ? <DropUpXS color={color} /> : <DropDownXS color={color} />}\n        {label}\n      </HvTypography>\n    );\n\n    return headingLevel === undefined ? (\n      accordionButton\n    ) : (\n      <HvTypography component={`h${headingLevel}`} variant={labelVariant}>\n        {accordionButton}\n      </HvTypography>\n    );\n  }, [\n    cx,\n    classes,\n    handleClick,\n    handleKeyDown,\n    label,\n    accordionHeaderId,\n    disabled,\n    headingLevel,\n    isOpen,\n    labelVariant,\n  ]);\n\n  return (\n    <div id={id} className={cx(classes.root, className)} {...others}>\n      {accordionHeader}\n      <div\n        id={accordionContainer}\n        role=\"region\"\n        aria-labelledby={accordionHeaderId}\n        className={cx(classes.container, { [classes.hidden]: !isOpen })}\n        hidden={!isOpen}\n        {...containerProps}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}