@hitachivantara/uikit-react-core 5.39.1 → 5.39.3

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

@@ -1 +1 @@
-{"version":3,"file":"TextArea.cjs","sources":["../../../../src/components/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\";\n\nimport { setId } from \"@core/utils/setId\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport validationStates, {\n  isInvalid,\n} from \"@core/components/Forms/FormElement/validationStates\";\nimport { HvValidationMessages } from \"@core/types/forms\";\nimport {\n  computeValidationMessage,\n  computeValidationState,\n  DEFAULT_ERROR_MESSAGES,\n  hasBuiltInValidations,\n  HvInputValidity,\n  validateInput,\n  validationTypes,\n} from \"@core/components/BaseInput/validations\";\nimport { HvBaseInput, HvBaseInputProps } from \"@core/components/BaseInput\";\nimport {\n  HvCharCounter,\n  HvCharCounterProps,\n  HvFormElement,\n  HvFormStatus,\n  HvInfoMessage,\n  HvLabel,\n  HvWarningText,\n} from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/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":["HvTextArea","forwardRef","props","ref","id","className","classes","classesProp","name","label","description","placeholder","status","statusMessage","validationMessages","maxCharQuantity","minCharQuantity","value","valueProp","inputRef","inputRefProp","rows","defaultValue","middleCountLabel","countCharProps","inputProps","required","readOnly","disabled","autoFocus","resizable","autoScroll","hideCounter","blockMax","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaErrorMessage","validation","onChange","onBlur","onFocus","others","useDefaultProps","cx","useClasses","elementId","useUniqueId","isDirty","useRef","forkedRef","useForkRef","focused","setFocused","useState","autoScrolling","setAutoScrolling","validationState","setValidationState","useControlled","validationStates","standBy","validationMessage","setValidationMessage","setValue","isStateInvalid","isInvalid","isEmptyValue","hasLabel","hasDescription","hasCounter","errorMessages","useMemo","DEFAULT_ERROR_MESSAGES","performValidation","useCallback","inputValidity","validateInput","current","validationTypes","none","computeValidationState","computeValidationMessage","isOverflow","currentValue","length","limitValue","undefined","substring","onContainerBlurHandler","event","onChangeHandler","limitedValue","onFocusHandler","isScrolledDown","el","offsetHeight","scrollTop","scrollHeight","scrollDown","clientHeight","addScrollListener","scrollHandler","handleEvent","addEventListener","useEffect","canShowError","hasBuiltInValidations","errorMessageId","setId","jsxs","HvFormElement","root","invalid","labelContainer","jsx","HvLabel","HvInfoMessage","HvCharCounter","characterCounter","HvBaseInput","baseInput","input","inputResizable","HvWarningText","error"],"mappings":"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"}
+{"version":3,"file":"TextArea.cjs","sources":["../../../../src/components/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\";\n\nimport { setId } from \"@core/utils/setId\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport validationStates, {\n  isInvalid,\n} from \"@core/components/Forms/FormElement/validationStates\";\nimport { HvValidationMessages } from \"@core/types/forms\";\nimport {\n  computeValidationMessage,\n  computeValidationState,\n  DEFAULT_ERROR_MESSAGES,\n  hasBuiltInValidations,\n  HvInputValidity,\n  validateInput,\n  validationTypes,\n} from \"@core/components/BaseInput/validations\";\nimport { HvBaseInput, HvBaseInputProps } from \"@core/components/BaseInput\";\nimport {\n  HvCharCounter,\n  HvCharCounterProps,\n  HvFormElement,\n  HvFormStatus,\n  HvInfoMessage,\n  HvLabel,\n  HvWarningText,\n} from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/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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"}

package/dist/cjs/components/TextArea/TextArea.styles.cjs

@@ -1,51 +1,24 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const classes = require("../../utils/classes.cjs");
-const {
-  staticClasses,
-  useClasses
-} = classes.createClasses("HvTextArea", {
-  root: {
-    display: "inline-block",
-    width: "100%"
-  },
+const { staticClasses, useClasses } = classes.createClasses("HvTextArea", {
+  root: { display: "inline-block", width: "100%" },
   disabled: {},
-  resizable: {
-    width: "100%"
-  },
+  resizable: { width: "100%" },
   invalid: {},
-  baseInput: {
-    clear: "both",
-    float: "left"
-  },
+  baseInput: { clear: "both", float: "left" },
   input: {},
-  inputResizable: {
-    width: "100%",
-    resize: "both"
-  },
-  labelContainer: {
-    float: "left",
-    display: "flex",
-    alignItems: "flex-start"
-  },
-  label: {
-    display: "block",
-    float: "left",
-    paddingBottom: "6px"
-  },
-  description: {
-    display: "block",
-    float: "left"
-  },
+  inputResizable: { width: "100%", resize: "both" },
+  labelContainer: { float: "left", display: "flex", alignItems: "flex-start" },
+  label: { display: "block", float: "left", paddingBottom: "6px" },
+  description: { display: "block", float: "left" },
   characterCounter: {
     display: "block",
     float: "right",
     textAlign: "right",
     marginBottom: "6px"
   },
-  error: {
-    float: "left"
-  }
+  error: { float: "left" }
 });
 exports.staticClasses = staticClasses;
 exports.useClasses = useClasses;

package/dist/cjs/components/TextArea/TextArea.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.styles.cjs","sources":["../../../../src/components/TextArea/TextArea.styles.tsx"],"sourcesContent":["import { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTextArea\", {\n  root: { display: \"inline-block\", width: \"100%\" },\n  disabled: {},\n  resizable: { width: \"100%\" },\n  invalid: {},\n  baseInput: { clear: \"both\", float: \"left\" },\n  input: {},\n  inputResizable: { width: \"100%\", resize: \"both\" },\n  labelContainer: { float: \"left\", display: \"flex\", alignItems: \"flex-start\" },\n  label: { display: \"block\", float: \"left\", paddingBottom: \"6px\" },\n  description: { display: \"block\", float: \"left\" },\n  characterCounter: {\n    display: \"block\",\n    float: \"right\",\n    textAlign: \"right\",\n    marginBottom: \"6px\",\n  },\n  error: { float: \"left\" },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","width","disabled","resizable","invalid","baseInput","clear","float","input","inputResizable","resize","labelContainer","alignItems","label","paddingBottom","description","characterCounter","textAlign","marginBottom","error"],"mappings":";;;AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,cAAc;AAAA,EACvEC,MAAM;AAAA,IAAEC,SAAS;AAAA,IAAgBC,OAAO;AAAA,EAAO;AAAA,EAC/CC,UAAU,CAAC;AAAA,EACXC,WAAW;AAAA,IAAEF,OAAO;AAAA,EAAO;AAAA,EAC3BG,SAAS,CAAC;AAAA,EACVC,WAAW;AAAA,IAAEC,OAAO;AAAA,IAAQC,OAAO;AAAA,EAAO;AAAA,EAC1CC,OAAO,CAAC;AAAA,EACRC,gBAAgB;AAAA,IAAER,OAAO;AAAA,IAAQS,QAAQ;AAAA,EAAO;AAAA,EAChDC,gBAAgB;AAAA,IAAEJ,OAAO;AAAA,IAAQP,SAAS;AAAA,IAAQY,YAAY;AAAA,EAAa;AAAA,EAC3EC,OAAO;AAAA,IAAEb,SAAS;AAAA,IAASO,OAAO;AAAA,IAAQO,eAAe;AAAA,EAAM;AAAA,EAC/DC,aAAa;AAAA,IAAEf,SAAS;AAAA,IAASO,OAAO;AAAA,EAAO;AAAA,EAC/CS,kBAAkB;AAAA,IAChBhB,SAAS;AAAA,IACTO,OAAO;AAAA,IACPU,WAAW;AAAA,IACXC,cAAc;AAAA,EAChB;AAAA,EACAC,OAAO;AAAA,IAAEZ,OAAO;AAAA,EAAO;AACzB,CAAC;;;"}
+{"version":3,"file":"TextArea.styles.cjs","sources":["../../../../src/components/TextArea/TextArea.styles.tsx"],"sourcesContent":["import { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTextArea\", {\n  root: { display: \"inline-block\", width: \"100%\" },\n  disabled: {},\n  resizable: { width: \"100%\" },\n  invalid: {},\n  baseInput: { clear: \"both\", float: \"left\" },\n  input: {},\n  inputResizable: { width: \"100%\", resize: \"both\" },\n  labelContainer: { float: \"left\", display: \"flex\", alignItems: \"flex-start\" },\n  label: { display: \"block\", float: \"left\", paddingBottom: \"6px\" },\n  description: { display: \"block\", float: \"left\" },\n  characterCounter: {\n    display: \"block\",\n    float: \"right\",\n    textAlign: \"right\",\n    marginBottom: \"6px\",\n  },\n  error: { float: \"left\" },\n});\n"],"names":["createClasses"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,cAAc;AAAA,EACvE,MAAM,EAAE,SAAS,gBAAgB,OAAO,OAAO;AAAA,EAC/C,UAAU,CAAC;AAAA,EACX,WAAW,EAAE,OAAO,OAAO;AAAA,EAC3B,SAAS,CAAC;AAAA,EACV,WAAW,EAAE,OAAO,QAAQ,OAAO,OAAO;AAAA,EAC1C,OAAO,CAAC;AAAA,EACR,gBAAgB,EAAE,OAAO,QAAQ,QAAQ,OAAO;AAAA,EAChD,gBAAgB,EAAE,OAAO,QAAQ,SAAS,QAAQ,YAAY,aAAa;AAAA,EAC3E,OAAO,EAAE,SAAS,SAAS,OAAO,QAAQ,eAAe,MAAM;AAAA,EAC/D,aAAa,EAAE,SAAS,SAAS,OAAO,OAAO;AAAA,EAC/C,kBAAkB;AAAA,IAChB,SAAS;AAAA,IACT,OAAO;AAAA,IACP,WAAW;AAAA,IACX,cAAc;AAAA,EAChB;AAAA,EACA,OAAO,EAAE,OAAO,OAAO;AACzB,CAAC;;;"}

package/dist/cjs/components/TimeAgo/TimeAgo.cjs

@@ -9,33 +9,32 @@ const useTimeAgo = require("./useTimeAgo.cjs");
 const Typography = require("../Typography/Typography.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const isEmpty__default = /* @__PURE__ */ _interopDefault(isEmpty);
-const HvTimeAgo = React.forwardRef((props, ref) => {
-  const {
-    classes: classesProp,
-    className,
-    timestamp,
-    locale: localeProp = "en",
-    component: Component = Typography.HvTypography,
-    emptyElement = "—",
-    disableRefresh = false,
-    showSeconds = false,
-    justText = false,
-    ...others
-  } = useDefaultProps.useDefaultProps("HvTimeAgo", props);
-  const {
-    classes,
-    cx
-  } = TimeAgo_styles.useClasses(classesProp);
-  const locale = isEmpty__default.default(localeProp) ? "en" : localeProp;
-  const timeAgo = useTimeAgo.default(timestamp, {
-    locale,
-    disableRefresh,
-    showSeconds
-  });
-  if (justText && timestamp)
-    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: timeAgo });
-  return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: cx(classes.root, className), ...others, children: !timestamp ? emptyElement : timeAgo });
-});
+const HvTimeAgo = React.forwardRef(
+  (props, ref) => {
+    const {
+      classes: classesProp,
+      className,
+      timestamp,
+      locale: localeProp = "en",
+      component: Component = Typography.HvTypography,
+      emptyElement = "—",
+      disableRefresh = false,
+      showSeconds = false,
+      justText = false,
+      ...others
+    } = useDefaultProps.useDefaultProps("HvTimeAgo", props);
+    const { classes, cx } = TimeAgo_styles.useClasses(classesProp);
+    const locale = isEmpty__default.default(localeProp) ? "en" : localeProp;
+    const timeAgo = useTimeAgo.default(timestamp, {
+      locale,
+      disableRefresh,
+      showSeconds
+    });
+    if (justText && timestamp)
+      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: timeAgo });
+    return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: cx(classes.root, className), ...others, children: !timestamp ? emptyElement : timeAgo });
+  }
+);
 exports.timeAgoClasses = TimeAgo_styles.staticClasses;
 exports.HvTimeAgo = HvTimeAgo;
 //# sourceMappingURL=TimeAgo.cjs.map

package/dist/cjs/components/TimeAgo/TimeAgo.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TimeAgo.cjs","sources":["../../../../src/components/TimeAgo/TimeAgo.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport isEmpty from \"lodash/isEmpty\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types/generic\";\n\nimport { staticClasses, useClasses } from \"./TimeAgo.styles\";\nimport useTimeAgo from \"./useTimeAgo\";\n\nexport { staticClasses as timeAgoClasses };\n\nexport type HvTimeAgoClasses = ExtractNames<typeof useClasses>;\n\nexport type HvTimeAgoProps<C extends React.ElementType = \"p\"> =\n  PolymorphicComponentRef<\n    C,\n    {\n      /**\n       * The timestamp to format, in seconds or milliseconds.\n       * Defaults to `emptyElement` if value is null or 0\n       */\n      timestamp?: number;\n      /**\n       * The locale to be used. Should be on of the dayjs supported locales and explicitly imported\n       * @see https://day.js.org/docs/en/i18n/i18n\n       */\n      locale?: string;\n      /**\n       * The element to render when the timestamp is null or 0\n       * Defaults to `—` (Em Dash)\n       */\n      emptyElement?: React.ReactNode;\n      /** Disables periodic date refreshes */\n      disableRefresh?: boolean;\n      /** Whether to show seconds in the rendered time */\n      showSeconds?: boolean;\n      /**\n       * Whether the component should render just the string\n       * Consider using `useTimeAgo` instead\n       */\n      justText?: boolean;\n      /** A Jss Object used to override or extend the styles applied to the component. */\n      classes?: HvTimeAgoClasses;\n    }\n  >;\n\n/**\n * The HvTimeAgo component implements the Design System relative time format guidelines.\n */\nexport const HvTimeAgo: <C extends React.ElementType = \"p\">(\n  props: HvTimeAgoProps<C>\n) => React.ReactElement | null = forwardRef(\n  <C extends React.ElementType = \"p\">(\n    props: HvTimeAgoProps<C>,\n    ref: PolymorphicRef<C>\n  ) => {\n    const {\n      classes: classesProp,\n      className,\n      timestamp,\n      locale: localeProp = \"en\",\n      component: Component = HvTypography,\n      emptyElement = \"—\",\n      disableRefresh = false,\n      showSeconds = false,\n      justText = false,\n      ...others\n    } = useDefaultProps(\"HvTimeAgo\", props);\n\n    const { classes, cx } = useClasses(classesProp);\n    const locale = isEmpty(localeProp) ? \"en\" : localeProp;\n    const timeAgo = useTimeAgo(timestamp, {\n      locale,\n      disableRefresh,\n      showSeconds,\n    });\n\n    // eslint-disable-next-line react/jsx-no-useless-fragment\n    if (justText && timestamp) return <>{timeAgo}</>;\n\n    return (\n      <Component ref={ref} className={cx(classes.root, className)} {...others}>\n        {!timestamp ? emptyElement : timeAgo}\n      </Component>\n    );\n  }\n);\n"],"names":["HvTimeAgo","forwardRef","props","ref","classes","classesProp","className","timestamp","locale","localeProp","component","Component","HvTypography","emptyElement","disableRefresh","showSeconds","justText","others","useDefaultProps","cx","useClasses","isEmpty","timeAgo","useTimeAgo","jsx","root"],"mappings":";;;;;;;;;;;AAoDO,MAAMA,YAEoBC,MAAAA,WAC/B,CACEC,OACAC,QACG;AACG,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC,QAAQC,aAAa;AAAA,IACrBC,WAAWC,YAAYC,WAAAA;AAAAA,IACvBC,eAAe;AAAA,IACfC,iBAAiB;AAAA,IACjBC,cAAc;AAAA,IACdC,WAAW;AAAA,IACX,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,aAAahB,KAAK;AAEhC,QAAA;AAAA,IAAEE;AAAAA,IAASe;AAAAA,EAAAA,IAAOC,eAAAA,WAAWf,WAAW;AAC9C,QAAMG,SAASa,iBAAAA,QAAQZ,UAAU,IAAI,OAAOA;AACtCa,QAAAA,UAAUC,mBAAWhB,WAAW;AAAA,IACpCC;AAAAA,IACAM;AAAAA,IACAC;AAAAA,EAAAA,CACD;AAGD,MAAIC,YAAYT;AAAW,iEAAUe,UAAQ,QAAA,CAAA;AAE7C,SACGE,2BAAAA,IAAA,WAAA,EAAU,KAAU,WAAWL,GAAGf,QAAQqB,MAAMnB,SAAS,GAAOW,GAAAA,QAC9D,UAACV,CAAAA,YAAYM,eAAeS,QAC/B,CAAA;AAEJ,CACF;;;"}
+{"version":3,"file":"TimeAgo.cjs","sources":["../../../../src/components/TimeAgo/TimeAgo.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport isEmpty from \"lodash/isEmpty\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types/generic\";\n\nimport { staticClasses, useClasses } from \"./TimeAgo.styles\";\nimport useTimeAgo from \"./useTimeAgo\";\n\nexport { staticClasses as timeAgoClasses };\n\nexport type HvTimeAgoClasses = ExtractNames<typeof useClasses>;\n\nexport type HvTimeAgoProps<C extends React.ElementType = \"p\"> =\n  PolymorphicComponentRef<\n    C,\n    {\n      /**\n       * The timestamp to format, in seconds or milliseconds.\n       * Defaults to `emptyElement` if value is null or 0\n       */\n      timestamp?: number;\n      /**\n       * The locale to be used. Should be on of the dayjs supported locales and explicitly imported\n       * @see https://day.js.org/docs/en/i18n/i18n\n       */\n      locale?: string;\n      /**\n       * The element to render when the timestamp is null or 0\n       * Defaults to `—` (Em Dash)\n       */\n      emptyElement?: React.ReactNode;\n      /** Disables periodic date refreshes */\n      disableRefresh?: boolean;\n      /** Whether to show seconds in the rendered time */\n      showSeconds?: boolean;\n      /**\n       * Whether the component should render just the string\n       * Consider using `useTimeAgo` instead\n       */\n      justText?: boolean;\n      /** A Jss Object used to override or extend the styles applied to the component. */\n      classes?: HvTimeAgoClasses;\n    }\n  >;\n\n/**\n * The HvTimeAgo component implements the Design System relative time format guidelines.\n */\nexport const HvTimeAgo: <C extends React.ElementType = \"p\">(\n  props: HvTimeAgoProps<C>\n) => React.ReactElement | null = forwardRef(\n  <C extends React.ElementType = \"p\">(\n    props: HvTimeAgoProps<C>,\n    ref: PolymorphicRef<C>\n  ) => {\n    const {\n      classes: classesProp,\n      className,\n      timestamp,\n      locale: localeProp = \"en\",\n      component: Component = HvTypography,\n      emptyElement = \"—\",\n      disableRefresh = false,\n      showSeconds = false,\n      justText = false,\n      ...others\n    } = useDefaultProps(\"HvTimeAgo\", props);\n\n    const { classes, cx } = useClasses(classesProp);\n    const locale = isEmpty(localeProp) ? \"en\" : localeProp;\n    const timeAgo = useTimeAgo(timestamp, {\n      locale,\n      disableRefresh,\n      showSeconds,\n    });\n\n    // eslint-disable-next-line react/jsx-no-useless-fragment\n    if (justText && timestamp) return <>{timeAgo}</>;\n\n    return (\n      <Component ref={ref} className={cx(classes.root, className)} {...others}>\n        {!timestamp ? emptyElement : timeAgo}\n      </Component>\n    );\n  }\n);\n"],"names":["forwardRef","HvTypography","useDefaultProps","useClasses","isEmpty","useTimeAgo","jsx"],"mappings":";;;;;;;;;;;AAoDO,MAAM,YAEoBA,MAAA;AAAA,EAC/B,CACE,OACA,QACG;AACG,UAAA;AAAA,MACJ,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA,QAAQ,aAAa;AAAA,MACrB,WAAW,YAAYC,WAAA;AAAA,MACvB,eAAe;AAAA,MACf,iBAAiB;AAAA,MACjB,cAAc;AAAA,MACd,WAAW;AAAA,MACX,GAAG;AAAA,IAAA,IACDC,gBAAgB,gBAAA,aAAa,KAAK;AAEtC,UAAM,EAAE,SAAS,GAAG,IAAIC,0BAAW,WAAW;AAC9C,UAAM,SAASC,iBAAA,QAAQ,UAAU,IAAI,OAAO;AACtC,UAAA,UAAUC,mBAAW,WAAW;AAAA,MACpC;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAGD,QAAI,YAAY;AAAW,mEAAU,UAAQ,QAAA,CAAA;AAE7C,WACGC,2BAAAA,IAAA,WAAA,EAAU,KAAU,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC9D,UAAC,CAAA,YAAY,eAAe,QAC/B,CAAA;AAAA,EAEJ;AACF;;;"}

package/dist/cjs/components/TimeAgo/TimeAgo.styles.cjs

@@ -1,10 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const classes = require("../../utils/classes.cjs");
-const {
-  staticClasses,
-  useClasses
-} = classes.createClasses("HvTimeAgo", {
+const { staticClasses, useClasses } = classes.createClasses("HvTimeAgo", {
   root: {}
 });
 exports.staticClasses = staticClasses;

package/dist/cjs/components/TimeAgo/TimeAgo.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TimeAgo.styles.cjs","sources":["../../../../src/components/TimeAgo/TimeAgo.styles.ts"],"sourcesContent":["import { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTimeAgo\", {\n  root: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","root"],"mappings":";;;AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,aAAa;AAAA,EACtEC,MAAM,CAAC;AACT,CAAC;;;"}
+{"version":3,"file":"TimeAgo.styles.cjs","sources":["../../../../src/components/TimeAgo/TimeAgo.styles.ts"],"sourcesContent":["import { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvTimeAgo\", {\n  root: {},\n});\n"],"names":["createClasses"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,aAAa;AAAA,EACtE,MAAM,CAAC;AACT,CAAC;;;"}

package/dist/cjs/components/TimeAgo/formatUtils.cjs

@@ -15,52 +15,24 @@ const localeData__default = /* @__PURE__ */ _interopDefault(localeData);
 const localizedFormat__default = /* @__PURE__ */ _interopDefault(localizedFormat);
 const relativeTime__default = /* @__PURE__ */ _interopDefault(relativeTime);
 const updateLocale__default = /* @__PURE__ */ _interopDefault(updateLocale);
-const thresholds = [{
-  l: "s",
-  r: 119,
-  d: "second"
-}, {
-  l: "m",
-  r: 1
-}, {
-  l: "mm",
-  r: 59,
-  d: "minute"
-}, {
-  l: "h",
-  r: 1
-}, {
-  l: "hh",
-  r: 23,
-  d: "hour"
-}, {
-  l: "d",
-  r: 1
-}, {
-  l: "dd",
-  r: 29,
-  d: "day"
-}, {
-  l: "M",
-  r: 1
-}, {
-  l: "MM",
-  r: 11,
-  d: "month"
-}, {
-  l: "y",
-  r: 17
-}, {
-  l: "yy",
-  d: "year"
-}];
+const thresholds = [
+  { l: "s", r: 119, d: "second" },
+  { l: "m", r: 1 },
+  { l: "mm", r: 59, d: "minute" },
+  { l: "h", r: 1 },
+  { l: "hh", r: 23, d: "hour" },
+  { l: "d", r: 1 },
+  { l: "dd", r: 29, d: "day" },
+  { l: "M", r: 1 },
+  { l: "MM", r: 11, d: "month" },
+  { l: "y", r: 17 },
+  { l: "yy", d: "year" }
+];
 dayjs__default.default.extend(localeData__default.default);
 dayjs__default.default.extend(duration__default.default);
 dayjs__default.default.extend(calendar__default.default);
 dayjs__default.default.extend(localizedFormat__default.default);
-dayjs__default.default.extend(relativeTime__default.default, {
-  thresholds
-});
+dayjs__default.default.extend(relativeTime__default.default, { thresholds });
 dayjs__default.default.extend(updateLocale__default.default);
 const secondsUntilNextDay = (date = /* @__PURE__ */ new Date()) => {
   const midnight = new Date(date.getTime());

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

@@ -1 +1 @@
-{"version":3,"file":"formatUtils.cjs","sources":["../../../../src/components/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":["thresholds","l","r","d","dayjs","extend","localeData","duration","calendar","localizedFormat","relativeTime","updateLocale","secondsUntilNextDay","date","Date","midnight","getTime","setDate","getDate","setHours","setMinutes","setSeconds","setMilliseconds","secondsUntilNextWeek","firstMonthDayOfWeek","getDay","firstMonthDayOfNextWeek","firstDayNextWeek","formatTimeAgo","locale","showSeconds","referenceDate","dayReferenceDate","dayDate","dayDiffSeconds","diff","formatUseSeconds","timeAgo","format","delay","humanize","dayDiffMinutes","isSame","subtract"],"mappings":"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"}
+{"version":3,"file":"formatUtils.cjs","sources":["../../../../src/components/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":";;;;;;;;;;;;;;;;;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/components/TimeAgo/useTimeAgo.cjs

@@ -8,11 +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/components/TimeAgo/useTimeAgo.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useTimeAgo.cjs","sources":["../../../../src/components/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":["fmt","timestamp","locale","showSeconds","timestampMs","String","length","formatTimeAgo","Date","useTimeAgo","options","disableRefresh","timeAgo","setTimeAgo","useState","refreshTime","delay","useEffect","newTimeAgo","useTimeout"],"mappings":";;;;;AAQA,MAAMA,MAAMA,CAACC,WAAWC,QAAQC,gBAAgB;AAC9C,QAAMC,cACJC,OAAOJ,SAAS,EAAEK,SAAS,KAAKL,YAAYA,YAAY;AAC1D,SAAOM,YAAAA,cAAc,IAAIC,KAAKJ,WAAW,GAAGF,QAAQC,WAAW;AACjE;AAEwBM,SAAAA,WAAWR,WAAWS,SAAS;AAC/C,QAAA;AAAA,IAAER;AAAAA,IAAQS,iBAAiB;AAAA,IAAOR,cAAc;AAAA,EAAUO,IAAAA;AAC1D,QAAA,CAACE,SAASC,UAAU,IAAIC,eAASd,IAAIC,WAAWC,QAAQC,WAAW,CAAC;AAC1E,QAAMY,cAAcJ,iBAAiB,IAAIC,QAAQI,QAAQ;AAEzDC,QAAAA,UAAU,MAAM;AACd,UAAMC,aAAalB,IAAIC,WAAWC,QAAQC,WAAW;AACrDU,eAAWK,UAAU;AAAA,EACpB,GAAA,CAACjB,WAAWC,QAAQC,WAAW,CAAC;AAEnCgB,aAAAA,WAAW,MAAM;AACf,UAAMD,aAAalB,IAAIC,WAAWC,QAAQC,WAAW;AACrDU,eAAWK,UAAU;AAAA,KACpBH,WAAW;AAEd,SAAOH,QAAQA;AACjB;;"}
+{"version":3,"file":"useTimeAgo.cjs","sources":["../../../../src/components/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;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"useTimeout.cjs","sources":["../../../../src/components/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":["useTimeout","callback","delay","savedCallback","useRef","useEffect","current","undefined","id","setTimeout","clearTimeout"],"mappings":";;;AAEaA,MAAAA,aAAaA,CAACC,UAAUC,UAAU;AACvCC,QAAAA,gBAAgBC,aAAOH,QAAQ;AAErCI,QAAAA,UAAU,MAAM;AACdF,kBAAcG,UAAUL;AAAAA,EAAAA,GACvB,CAACA,QAAQ,CAAC;AAEbI,QAAAA,UAAU,MAAM;AACd,QAAI,CAACH;AAAcK,aAAAA;AAEnB,UAAMC,KAAKC,WAAW,MAAMN,cAAcG,QAAAA,GAAWJ,KAAK;AACnD,WAAA,MAAMQ,aAAaF,EAAE;AAAA,EAAA,GAC3B,CAACN,KAAK,CAAC;AACZ;;"}
+{"version":3,"file":"useTimeout.cjs","sources":["../../../../src/components/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;;"}

package/dist/cjs/components/TimePicker/Placeholder.cjs

@@ -6,11 +6,7 @@ const datepicker = require("@react-aria/datepicker");
 const getDateValue = (date) => {
   if (!date)
     return "";
-  const {
-    hour,
-    minute,
-    second
-  } = date;
+  const { hour, minute, second } = date;
   return [hour, minute, second].map((el) => String(el).padStart(2, "0")).join(":");
 };
 const PlaceholderSegment = ({
@@ -19,9 +15,7 @@ const PlaceholderSegment = ({
   placeholder
 }) => {
   const ref = React.useRef(null);
-  const {
-    segmentProps
-  } = datepicker.useDateSegment(segment, state, ref);
+  const { segmentProps } = datepicker.useDateSegment(segment, state, ref);
   return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, ...segmentProps, children: (() => {
     if (segment.type === "literal")
       return segment.text;
@@ -30,25 +24,34 @@ const PlaceholderSegment = ({
     return segment.text.padStart(2, "0");
   })() });
 };
-const Placeholder = React.forwardRef((props, ref) => {
-  const {
-    name,
-    state,
-    placeholders,
-    onKeyDown,
-    ...others
-  } = props;
-  const {
-    value,
-    segments
-  } = state;
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, onKeyDown: (event) => {
-    event.stopPropagation();
-    onKeyDown?.(event);
-  }, ...others, children: [
-    name && /* @__PURE__ */ jsxRuntime.jsx("input", { type: "hidden", name, value: getDateValue(value) }),
-    segments.map((segment, i) => /* @__PURE__ */ jsxRuntime.jsx(PlaceholderSegment, { segment, state, placeholder: placeholders[segment.type] }, i))
-  ] }) });
-});
+const Placeholder = React.forwardRef(
+  (props, ref) => {
+    const { name, state, placeholders, onKeyDown, ...others } = props;
+    const { value, segments } = state;
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        onKeyDown: (event) => {
+          event.stopPropagation();
+          onKeyDown?.(event);
+        },
+        ...others,
+        children: [
+          name && /* @__PURE__ */ jsxRuntime.jsx("input", { type: "hidden", name, value: getDateValue(value) }),
+          segments.map((segment, i) => /* @__PURE__ */ jsxRuntime.jsx(
+            PlaceholderSegment,
+            {
+              segment,
+              state,
+              placeholder: placeholders[segment.type]
+            },
+            i
+          ))
+        ]
+      }
+    ) });
+  }
+);
 exports.Placeholder = Placeholder;
 //# sourceMappingURL=Placeholder.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Placeholder.cjs","sources":["../../../../src/components/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 \"@core/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":["getDateValue","date","hour","minute","second","map","el","String","padStart","join","PlaceholderSegment","segment","state","placeholder","ref","useRef","segmentProps","useDateSegment","jsx","type","text","isPlaceholder","Placeholder","forwardRef","props","name","placeholders","onKeyDown","others","value","segments","Fragment","jsxs","event","stopPropagation","i"],"mappings":";;;;;AAQA,MAAMA,eAAgBC,CAAS,SAAA;AAC7B,MAAI,CAACA;AAAa,WAAA;AACZ,QAAA;AAAA,IAAEC;AAAAA,IAAMC;AAAAA,IAAQC;AAAAA,EAAWH,IAAAA;AAEjC,SAAO,CAACC,MAAMC,QAAQC,MAAM,EACzBC,IAAKC,CAAOC,OAAAA,OAAOD,EAAE,EAAEE,SAAS,GAAG,GAAG,CAAC,EACvCC,KAAK,GAAG;AACb;AAEA,MAAMC,qBAAqBA,CAAC;AAAA,EAC1BC;AAAAA,EACAC;AAAAA,EACAC;AAKF,MAAM;AACEC,QAAAA,MAAMC,aAAO,IAAI;AACjB,QAAA;AAAA,IAAEC;AAAAA,EAAiBC,IAAAA,0BAAeN,SAASC,OAAOE,GAAG;AAE3D,SACGI,2BAAAA,IAAA,OAAA,EAAI,KAAcF,GAAAA,cACf,WAAM,MAAA;AACN,QAAIL,QAAQQ,SAAS;AAAW,aAAOR,QAAQS;AAC/C,QAAIT,QAAQU;AAAe,aAAOR,eAAeF,QAAQS;AACzD,WAAOT,QAAQS,KAAKZ,SAAS,GAAG,GAAG;AAAA,OAEvC,CAAA;AAEJ;AAQO,MAAMc,cAAcC,MAAAA,WACzB,CAACC,OAAOV,QAAQ;AACR,QAAA;AAAA,IAAEW;AAAAA,IAAMb;AAAAA,IAAOc;AAAAA,IAAcC;AAAAA,IAAW,GAAGC;AAAAA,EAAWJ,IAAAA;AACtD,QAAA;AAAA,IAAEK;AAAAA,IAAOC;AAAAA,EAAalB,IAAAA;AAE5B,SAGIM,2BAAA,IAAAa,qBAAA,EAAA,UAAAC,2BAAAA,KAAC,OACC,EAAA,KACA,WAAYC,CAAU,UAAA;AAEpBA,UAAMC,gBAAgB;AACtBP,gBAAYM,KAAK;AAAA,EAAA,GAEfL,GAAAA,QAEHH,UAAAA;AAAAA,IACC,QAAAP,2BAAA,IAAC,WAAM,MAAK,UAAS,MAAY,OAAOlB,aAAa6B,KAAK,GAC3D;AAAA,IACAC,SAASzB,IAAI,CAACM,SAASwB,MACrBjB,2BAAAA,IAAA,oBAAA,EAEC,SACA,OACA,aAAaQ,aAAaf,QAAQQ,IAAI,EAAA,GAHjCgB,EAKR;AAAA,EAAA,EACH,CAAA,EACF,CAAA;AAEJ,CACF;;"}
+{"version":3,"file":"Placeholder.cjs","sources":["../../../../src/components/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 \"@core/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;;"}