@hitachivantara/uikit-react-core 5.14.1 → 5.16.0

package/dist/cjs/components/TagsInput/TagsInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TagsInput.cjs","sources":["../../../../src/components/TagsInput/TagsInput.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport isNil from \"lodash/isNil\";\nimport { InputBaseComponentProps as MuiInputBaseComponentProps } from \"@mui/material\";\nimport {\n  HvBaseProps,\n  HvTagSuggestion,\n  HvValidationMessages,\n} from \"@core/types\";\nimport { useControlled, useIsMounted, useUniqueId } from \"@core/hooks\";\nimport { isKeypress, keyboardCodes, setId } from \"@core/utils\";\nimport {\n  StyledCharCounter,\n  StyledDescription,\n  StyledError,\n  StyledFormElement,\n  StyledLabel,\n  StyledLabelContainer,\n  StyledListItem,\n  StyledTag,\n  StyledTagsList,\n  StyledInputListItem,\n  StyledInput,\n  StyledSuggestions,\n} from \"./TagsInput.styles\";\nimport validationStates from \"../Forms/FormElement/validationStates\";\nimport { DEFAULT_ERROR_MESSAGES } from \"../BaseInput/validations\";\nimport { HvTagProps } from \"../Tag\";\nimport tagsInputClasses, { HvTagsInputClasses } from \"./tagsInputClasses\";\nimport { HvCharCounterProps, HvFormStatus } from \"../Forms\";\n\nexport interface HvTagsInputProps\n  extends HvBaseProps<\n    HTMLElement,\n    \"onChange\" | \"onBlur\" | \"onFocus\" | \"onKeyDown\" | \"color\" | \"defaultValue\"\n  > {\n  /** The form element name. */\n  name?: string;\n  /** The value of the form element. */\n  value?: string[] | HvTagProps[];\n  /** When uncontrolled, defines the initial input value. */\n  defaultValue?: string[] | HvTagProps[];\n  /**\n   * The label of the form element.\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n   */\n  label?: React.ReactNode;\n  /** Provide additional descriptive text for the form element. */\n  description?: React.ReactNode;\n  /** Indicates that the form element is disabled. */\n  disabled?: boolean;\n  /** Indicates that the form element is not editable. */\n  readOnly?: boolean;\n  /** Indicates that the form element is required. */\n  required?: boolean;\n  /** The function that will be executed onChange. */\n  onChange?: (\n    event:\n      | React.ChangeEvent<HTMLInputElement>\n      | React.KeyboardEvent<HTMLInputElement>\n      | React.MouseEvent<HTMLButtonElement>\n      | React.MouseEvent<HTMLElement, MouseEvent>\n      | React.KeyboardEventHandler<HTMLElement>,\n    value: HvTagProps[]\n  ) => void;\n  /** The function that will be executed when the element is focused. */\n  onFocus?: (event: React.FocusEvent<HTMLInputElement>, value: string) => void;\n  /** The function that will be executed when the element is blurred. */\n  onBlur?: (event: React.FocusEvent<HTMLInputElement>, value: string) => void;\n  /** The function that will be executed when a tag is deleted. */\n  onDelete?: (\n    event:\n      | React.ChangeEvent<HTMLInputElement>\n      | React.KeyboardEvent<HTMLInputElement>\n      | React.MouseEvent<HTMLButtonElement>\n      | React.MouseEvent<HTMLElement, MouseEvent>\n      | React.KeyboardEventHandler<HTMLElement>,\n    value: HvTagProps,\n    index: number\n  ) => void;\n  /** The function that will be executed when a tag is added. */\n  onAdd?: (\n    event:\n      | React.ChangeEvent<HTMLInputElement>\n      | React.KeyboardEvent<HTMLInputElement>\n      | React.MouseEvent<HTMLButtonElement>\n      | React.MouseEvent<HTMLElement, MouseEvent>\n      | React.KeyboardEventHandler<HTMLElement>,\n    value: HvTagProps,\n    index: number\n  ) => void;\n  /** The placeholder value of the input. */\n  placeholder?: string;\n  /** If `true` the character counter isn't shown even if maxTagsQuantity is set. */\n  hideCounter?: boolean;\n  /** Text between the current char counter and max value. */\n  middleCountLabel?: string;\n  /** The maximum allowed length of the characters, if this value is null no check will be performed. */\n  maxTagsQuantity?: number;\n  /** Attributes applied to the input element. */\n  inputProps?: MuiInputBaseComponentProps;\n  /** If `true` it should autofocus. */\n  autoFocus?: boolean;\n  /** If `true` the component is resizable. */\n  resizable?: boolean;\n  /** Props passed to the HvCharCount component. */\n  countCharProps?: Partial<HvCharCounterProps>;\n  /** If `true` the component is in multiline mode. */\n  multiline?: boolean;\n  /** The status of the form element. */\n  status?: HvFormStatus;\n  /** The error message to show when `status` is \"invalid\". */\n  statusMessage?: React.ReactNode;\n  /** An Object containing the various texts associated with the input. */\n  validationMessages?: HvValidationMessages;\n  /** An array of strings that represent the character used to input a tag. This character is the string representation of the event.code from the input event. */\n  commitTagOn?: string[];\n  /** If `true` the tag will be committed when the blur event occurs. */\n  commitOnBlur?: boolean;\n  /** The function that will be executed to received an array of objects that has a label and id to create list of suggestion */\n  suggestionListCallback?: (value: string) => HvTagSuggestion[] | null;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTagsInputClasses;\n}\n\n/**\n * A tags input is a single or multiline control that allows the input of tags.\n */\nexport const HvTagsInput = ({\n  classes,\n  className,\n  id,\n  name,\n  value: valueProp,\n  defaultValue = [],\n  readOnly = false,\n  disabled = false,\n  required = false,\n  label: textAreaLabel,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledBy,\n  description,\n  \"aria-describedby\": ariaDescribedBy,\n  onChange,\n  onAdd,\n  onDelete,\n  onBlur,\n  onFocus,\n  placeholder,\n  hideCounter = false,\n  middleCountLabel = \"/\",\n  maxTagsQuantity,\n  autoFocus = false,\n  resizable = true,\n  inputProps = {},\n  countCharProps = {},\n  multiline = false,\n  status,\n  statusMessage,\n  validationMessages,\n  commitTagOn = [\"Enter\"],\n  commitOnBlur = false,\n  suggestionListCallback,\n  ...others\n}: HvTagsInputProps) => {\n  const elementId = useUniqueId(id, \"hvTagsInput\");\n\n  const hasLabel = textAreaLabel != null;\n  const hasDescription = description != null;\n\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n\n  const [validationState, setValidationState] = useControlled(\n    status,\n    validationStates.standBy\n  );\n  const [validationMessage, setValidationMessage] = useControlled(\n    statusMessage,\n    \"\"\n  );\n\n  const [tagInput, setTagInput] = useState(\"\");\n  const [tagCursorPos, setTagCursorPos] = useState(value.length);\n  const [stateValid, setStateValid] = useState(true);\n\n  const inputRef = useRef<any>();\n  const containerRef = useRef<any>();\n  const skipReset = useRef(false);\n  const blurTimeout = useRef<any>();\n  const materialInputRef = useRef<any>(null);\n\n  const isTagSelected = tagCursorPos >= 0 && tagCursorPos < value.length;\n  const hasCounter = maxTagsQuantity != null && !hideCounter;\n\n  // suggestions related state\n  const [suggestionValues, setSuggestionValues] = useState<\n    HvTagSuggestion[] | null\n  >(null);\n\n  const isStateInvalid = useMemo(() => {\n    return hasCounter && value.length > maxTagsQuantity;\n  }, [hasCounter, maxTagsQuantity, value.length]);\n\n  const canShowSuggestions = suggestionListCallback != null;\n  const hasSuggestions = !!suggestionValues;\n\n  const errorMessages = useMemo(\n    () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n    [\n      validationMessages?.error,\n      validationMessages?.requiredError,\n      validationMessages?.minCharError,\n      validationMessages?.maxCharError,\n    ]\n  );\n\n  const performValidation = useCallback(\n    (currValue) => {\n      if (\n        maxTagsQuantity !== null &&\n        maxTagsQuantity !== undefined &&\n        currValue.length > maxTagsQuantity\n      ) {\n        setValidationState(validationStates.invalid);\n        setValidationMessage(errorMessages.maxCharError);\n        setStateValid(false);\n      } else {\n        setValidationState(validationStates.valid);\n        setValidationMessage(\"\");\n        setStateValid(true);\n      }\n    },\n    [\n      errorMessages.maxCharError,\n      maxTagsQuantity,\n      setValidationMessage,\n      setValidationState,\n    ]\n  );\n\n  /**\n   * Deletes a Tag from the array of tags and sets the new position for the tag cursor.\n   * Also executes the user provided onDelete and onChange events.\n   *\n   * @param {number}  tagPos - the position at which to remove the tag\n   * @param {Event}   event  - the event associated with the delete\n   * @param {boolean} end    - whether or not to set the cursor at the end of the array\n   */\n  const deleteTag = useCallback(\n    (tagPos, event, end) => {\n      const newTagsArr = [\n        ...value.slice(0, tagPos),\n        ...value.slice(tagPos + 1),\n      ];\n      setValue(newTagsArr);\n      setTagCursorPos(\n        end ? newTagsArr.length : tagCursorPos > 0 ? tagCursorPos - 1 : 0\n      );\n      inputRef.current?.focus();\n      performValidation(newTagsArr);\n      onDelete?.(event, value[tagPos], tagPos);\n      onChange?.(event, newTagsArr);\n      skipReset.current = true;\n    },\n    [onChange, onDelete, performValidation, setValue, tagCursorPos, value]\n  );\n\n  /**\n   * Adds a Tag to the array of tags.\n   * Also executes the user provided onAdd and onDelete events.\n   *\n   * @param {Event}   event  - whatever event triggered adding a tag\n   * @param {string}  tag    - the string for the tag\n   */\n  const addTag = useCallback(\n    (event, tag) => {\n      event.preventDefault();\n      if (tag !== \"\") {\n        const newTag: HvTagProps = { label: tag, type: \"semantic\" };\n        const newTagsArr = [...value, newTag];\n        setValue(newTagsArr);\n        performValidation(newTagsArr);\n        onAdd?.(event, newTag, newTagsArr.length - 1);\n        onChange?.(event, newTagsArr);\n      }\n    },\n    [onAdd, onChange, performValidation, setValue, value]\n  );\n\n  const canShowError =\n    (status !== undefined &&\n      status === \"invalid\" &&\n      statusMessage !== undefined) ||\n    !stateValid;\n\n  useEffect(() => {\n    if (!multiline) {\n      const element = containerRef?.current?.children[tagCursorPos];\n      // this setTimeout is a workaround for Firefox not properly dealing\n      // with setting the scrollLeft value.\n      setTimeout(() => {\n        const container = containerRef.current;\n        if (isNil(container)) return;\n        container.scrollLeft = element\n          ? element.offsetLeft -\n            container.getBoundingClientRect().width / 2 +\n            element.getBoundingClientRect().width / 2\n          : 0;\n      }, 50);\n\n      element?.focus();\n    }\n  }, [multiline, tagCursorPos]);\n\n  useEffect(() => {\n    if (!skipReset.current) {\n      setTagInput(\"\");\n      setTagCursorPos(value.length);\n    }\n    skipReset.current = false;\n  }, [value]);\n\n  const isMounted = useIsMounted();\n\n  /**\n   * Looks for the node that represent the input inside the material tree and focus it.\n   */\n  const focusInput = () => {\n    materialInputRef.current.focus();\n  };\n\n  const getSuggestions = useCallback(\n    (li) => {\n      // TODO Replace with ref\n      const listEl = document.getElementById(\n        setId(elementId, \"suggestions-list\") || \"\"\n      );\n      return li != null ? listEl?.getElementsByTagName(\"li\")?.[li] : listEl;\n    },\n    [elementId]\n  );\n\n  /**\n   * Clears the suggestion array.\n   */\n  const suggestionClearHandler = useCallback(() => {\n    if (isMounted.current) {\n      setSuggestionValues(null);\n    }\n  }, [isMounted]);\n\n  /**\n   * Fills of the suggestion array.\n   */\n  const suggestionHandler = useCallback(\n    (val) => {\n      const suggestionsArray = suggestionListCallback?.(val);\n      if (suggestionsArray?.[0]?.label) {\n        setSuggestionValues(suggestionsArray);\n      } else {\n        suggestionClearHandler();\n      }\n    },\n    [suggestionClearHandler, suggestionListCallback]\n  );\n\n  /**\n   * Executes the user callback adds the selection to the state and clears the suggestions.\n   */\n  const suggestionSelectedHandler = (event, item) => {\n    addTag(event, item.value || item.label);\n\n    // set the input value (only when value is uncontrolled)\n    setTagInput(item.value || item.label);\n\n    focusInput();\n    suggestionClearHandler();\n  };\n\n  /**\n   * Handler for the `onKeyDown` event on the suggestions component\n   */\n  const onSuggestionKeyDown = (event) => {\n    if (isKeypress(event, keyboardCodes.Esc)) {\n      suggestionClearHandler();\n      focusInput();\n    } else if (isKeypress(event, keyboardCodes.Tab)) {\n      suggestionClearHandler();\n    }\n  };\n\n  /**\n   * Handler for the `onChange` event on the tag input\n   */\n  const onChangeHandler = useCallback(\n    (_, input) => {\n      setTagInput(input);\n\n      if (canShowSuggestions) {\n        // an edge case might be a controlled input whose onChange callback\n        // doesn't change the value (or sets another): the suggestionListCallback\n        // callback will still receive the original rejected value.\n        // a refactor is needed so the suggestionListCallback might be called only\n        // when the input is uncontrolled, providing a way to externally control\n        // the suggestion values.\n        suggestionHandler(input);\n      }\n    },\n    [canShowSuggestions, suggestionHandler]\n  );\n\n  /**\n   * Handler for the `onKeyDown` event on the form element\n   */\n  const onInputKeyDownHandler = useCallback(\n    (event) => {\n      if (!canShowSuggestions && commitTagOn.includes(event.code)) {\n        addTag(event, tagInput);\n      }\n    },\n    [addTag, canShowSuggestions, commitTagOn, tagInput]\n  );\n\n  /**\n   * Handler for the `onKeyDown` event on the list container.\n   */\n  const onKeyDownHandler = useCallback(\n    (event) => {\n      if (tagInput === \"\") {\n        switch (event.code) {\n          case \"ArrowLeft\":\n            setTagCursorPos(tagCursorPos > 0 ? tagCursorPos - 1 : 0);\n            break;\n          case \"ArrowRight\":\n            setTagCursorPos(\n              tagCursorPos < value.length ? tagCursorPos + 1 : value.length\n            );\n            break;\n          case \"Backspace\":\n            if (isTagSelected) {\n              deleteTag(tagCursorPos, event, false);\n            } else {\n              setTagCursorPos(value.length - 1);\n            }\n            break;\n          case \"Delete\":\n            if (isTagSelected) {\n              deleteTag(tagCursorPos, event, false);\n            }\n            break;\n          default:\n            break;\n        }\n      } else {\n        switch (event.code) {\n          case \"ArrowDown\":\n            getSuggestions(0)?.focus();\n            break;\n          default:\n            break;\n        }\n      }\n    },\n    [\n      deleteTag,\n      getSuggestions,\n      isTagSelected,\n      tagCursorPos,\n      tagInput,\n      value.length,\n    ]\n  );\n\n  /**\n   * Handler for the `onDelete` event on the tag component\n   */\n  const onDeleteTagHandler = useCallback(\n    (event, i) => {\n      deleteTag(i, event, true);\n      setValidationState(validationStates.standBy);\n    },\n    [deleteTag, setValidationState]\n  );\n\n  /**\n   * Handler for the `onClick` event on the list container\n   */\n  const onContainerClickHandler = useCallback(() => {\n    inputRef.current?.focus();\n    clearTimeout(blurTimeout.current);\n    setTagCursorPos(value.length);\n  }, [value.length]);\n\n  const onBlurHandler = (evt) => {\n    blurTimeout.current = setTimeout(() => {\n      if (commitOnBlur) {\n        addTag(evt, tagInput);\n      }\n      onBlur?.(evt, tagInput);\n    }, 250);\n  };\n\n  const onFocusHandler = (evt) => {\n    clearTimeout(blurTimeout.current);\n    onFocus?.(evt, tagInput);\n  };\n\n  return (\n    <StyledFormElement\n      id={id}\n      name={name}\n      disabled={disabled}\n      readOnly={readOnly}\n      status={validationState}\n      required={required}\n      onBlur={onBlurHandler}\n      onFocus={onFocusHandler}\n      className={clsx(\n        tagsInputClasses.root,\n        classes?.root,\n        className,\n        disabled && clsx(tagsInputClasses.disabled, classes?.disabled)\n      )}\n    >\n      {(hasLabel || hasDescription) && (\n        <StyledLabelContainer\n          className={clsx(\n            tagsInputClasses.labelContainer,\n            classes?.labelContainer\n          )}\n        >\n          {hasLabel && (\n            <StyledLabel\n              className={clsx(tagsInputClasses.label, classes?.label)}\n              id={setId(id, \"label\")}\n              htmlFor={setId(elementId, \"input\")}\n              label={textAreaLabel}\n            />\n          )}\n\n          {hasDescription && (\n            <StyledDescription\n              className={clsx(\n                tagsInputClasses.description,\n                classes?.description\n              )}\n              id={setId(elementId, \"description\")}\n            >\n              {description}\n            </StyledDescription>\n          )}\n        </StyledLabelContainer>\n      )}\n\n      {hasCounter && (\n        <StyledCharCounter\n          id={setId(elementId, \"charCounter\")}\n          className={clsx(\n            tagsInputClasses.characterCounter,\n            classes?.characterCounter\n          )}\n          separator={middleCountLabel}\n          currentCharQuantity={value.length}\n          maxCharQuantity={maxTagsQuantity}\n          {...countCharProps}\n        />\n      )}\n\n      <StyledTagsList\n        className={clsx(\n          tagsInputClasses.tagsList,\n          classes?.tagsList,\n          canShowError && clsx(tagsInputClasses.error, classes?.error),\n          resizable &&\n            multiline &&\n            clsx(tagsInputClasses.resizable, classes?.resizable),\n          isStateInvalid && clsx(tagsInputClasses.invalid, classes?.invalid),\n          !multiline && clsx(tagsInputClasses.singleLine, classes?.singleLine)\n        )}\n        $disabled={disabled}\n        $singleLine={!multiline}\n        $error={canShowError}\n        $resizable={resizable && multiline}\n        $invalid={isStateInvalid}\n        $readOnly={readOnly}\n        onKeyDown={onKeyDownHandler}\n        onClick={onContainerClickHandler}\n        ref={containerRef}\n      >\n        {value &&\n          value.map((t, i) => {\n            const tag =\n              typeof t === \"string\"\n                ? {\n                    label: t,\n                    type: \"semantic\",\n                  }\n                : t;\n            const { label, type, ...otherProps } = tag;\n            return (\n              <StyledListItem\n                key={`${tag.label}-${i}`}\n                tabIndex={-1}\n                className={clsx(\n                  !multiline &&\n                    clsx(tagsInputClasses.singleLine, classes?.singleLine)\n                )}\n                classes={{\n                  gutters: clsx(\n                    tagsInputClasses.listItemGutters,\n                    classes?.listItemGutters\n                  ),\n                  root: clsx(\n                    tagsInputClasses.listItemRoot,\n                    classes?.listItemRoot\n                  ),\n                }}\n                id={`tag-${i}`}\n                $singleLine={!multiline}\n              >\n                <StyledTag\n                  label={label}\n                  className={clsx(\n                    i === tagCursorPos &&\n                      clsx(tagsInputClasses.tagSelected, classes?.tagSelected)\n                  )}\n                  classes={{\n                    chipRoot: clsx(\n                      tagsInputClasses.chipRoot,\n                      classes?.chipRoot\n                    ),\n                  }}\n                  type={type}\n                  {...(!(readOnly || disabled || type === \"categorical\") && {\n                    onDelete: (event) => onDeleteTagHandler(event, i),\n                  })}\n                  deleteButtonProps={{\n                    tabIndex: -1,\n                  }}\n                  $selected={i === tagCursorPos}\n                  {...otherProps}\n                />\n              </StyledListItem>\n            );\n          })}\n        {!(disabled || readOnly) && (\n          <StyledInputListItem\n            className={clsx(\n              !multiline &&\n                clsx(\n                  tagsInputClasses.singleLine,\n                  classes?.singleLine,\n                  value.length === 0 &&\n                    clsx(\n                      tagsInputClasses.tagInputRootEmpty,\n                      classes?.tagInputRootEmpty\n                    )\n                )\n            )}\n            classes={{\n              root: clsx(\n                tagsInputClasses.tagInputContainerRoot,\n                classes?.tagInputContainerRoot\n              ),\n              gutters: clsx(\n                tagsInputClasses.listItemGutters,\n                classes?.listItemGutters\n              ),\n            }}\n            id={`tag-${value.length}`}\n            $singleLine={!multiline}\n            $isTagSelected={!!isTagSelected}\n          >\n            <StyledInput\n              value={tagInput}\n              disableClear\n              onChange={onChangeHandler}\n              onKeyDown={onInputKeyDownHandler}\n              placeholder={value.length === 0 ? placeholder : \"\"}\n              autoFocus={autoFocus}\n              className={clsx(\n                !multiline &&\n                  clsx(tagsInputClasses.singleLine, classes?.singleLine)\n              )}\n              classes={{\n                root: clsx(\n                  tagsInputClasses.tagInputRoot,\n                  classes?.tagInputRoot\n                ),\n                input: clsx(tagsInputClasses.input, classes?.input),\n                inputBorderContainer: clsx(\n                  tagsInputClasses.tagInputBorderContainer,\n                  classes?.tagInputBorderContainer\n                ),\n                inputRootFocused: clsx(\n                  tagsInputClasses.tagInputRootFocused,\n                  classes?.tagInputRootFocused\n                ),\n              }}\n              disabled={disabled}\n              readOnly={readOnly || isTagSelected}\n              inputProps={{\n                ref: materialInputRef,\n                \"aria-label\": ariaLabel,\n                \"aria-labelledby\": ariaLabelledBy,\n                \"aria-describedby\":\n                  ariaDescribedBy != null\n                    ? ariaDescribedBy\n                    : (description && setId(elementId, \"description\")) ||\n                      undefined,\n\n                ...inputProps,\n              }}\n              inputRef={inputRef}\n              $singleLine={!multiline}\n              {...others}\n            />\n          </StyledInputListItem>\n        )}\n      </StyledTagsList>\n      {canShowSuggestions && (\n        <>\n          {hasSuggestions && (\n            <div\n              role=\"presentation\"\n              className={clsx(\n                tagsInputClasses.inputExtension,\n                classes?.inputExtension\n              )}\n            />\n          )}\n          <StyledSuggestions\n            id={setId(elementId, \"suggestions\")}\n            classes={{\n              root: clsx(\n                tagsInputClasses.suggestionsContainer,\n                classes?.suggestionsContainer\n              ),\n              list: clsx(\n                tagsInputClasses.suggestionList,\n                classes?.suggestionList\n              ),\n            }}\n            expanded={hasSuggestions}\n            anchorEl={containerRef?.current?.parentElement}\n            onClose={suggestionClearHandler}\n            onKeyDown={onSuggestionKeyDown}\n            onSuggestionSelected={suggestionSelectedHandler}\n            suggestionValues={suggestionValues}\n          />\n        </>\n      )}\n      {canShowError && (\n        <StyledError\n          id={setId(elementId, \"error\")}\n          disableBorder\n          className={clsx(tagsInputClasses.error, classes?.error)}\n        >\n          {validationMessage}\n        </StyledError>\n      )}\n    </StyledFormElement>\n  );\n};\n"],"names":["HvTagsInput","classes","className","id","name","value","valueProp","defaultValue","readOnly","disabled","required","label","textAreaLabel","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onAdd","onDelete","onBlur","onFocus","placeholder","hideCounter","middleCountLabel","maxTagsQuantity","autoFocus","resizable","inputProps","countCharProps","multiline","status","statusMessage","validationMessages","commitTagOn","commitOnBlur","suggestionListCallback","others","elementId","useUniqueId","hasLabel","hasDescription","setValue","useControlled","validationState","setValidationState","validationStates","standBy","validationMessage","setValidationMessage","tagInput","setTagInput","useState","tagCursorPos","setTagCursorPos","length","stateValid","setStateValid","inputRef","useRef","containerRef","skipReset","blurTimeout","materialInputRef","isTagSelected","hasCounter","suggestionValues","setSuggestionValues","isStateInvalid","useMemo","canShowSuggestions","hasSuggestions","errorMessages","DEFAULT_ERROR_MESSAGES","error","requiredError","minCharError","maxCharError","performValidation","useCallback","currValue","undefined","invalid","valid","deleteTag","tagPos","event","end","newTagsArr","slice","current","focus","addTag","tag","preventDefault","newTag","type","canShowError","useEffect","element","children","setTimeout","container","isNil","scrollLeft","offsetLeft","getBoundingClientRect","width","isMounted","useIsMounted","focusInput","getSuggestions","li","listEl","document","getElementById","setId","getElementsByTagName","suggestionClearHandler","suggestionHandler","val","suggestionsArray","suggestionSelectedHandler","item","onSuggestionKeyDown","isKeypress","keyboardCodes","Esc","Tab","onChangeHandler","_","input","onInputKeyDownHandler","includes","code","onKeyDownHandler","_a","onDeleteTagHandler","i","onContainerClickHandler","clearTimeout","onBlurHandler","evt","onFocusHandler","StyledFormElement","clsx","tagsInputClasses","root","StyledLabelContainer","labelContainer","_jsx","StyledLabel","htmlFor","StyledDescription","StyledCharCounter","characterCounter","separator","currentCharQuantity","maxCharQuantity","_jsxs","StyledTagsList","tagsList","singleLine","$disabled","$singleLine","$error","$resizable","$invalid","$readOnly","onKeyDown","onClick","ref","map","t","otherProps","StyledListItem","tabIndex","gutters","listItemGutters","listItemRoot","StyledTag","tagSelected","chipRoot","deleteButtonProps","$selected","StyledInputListItem","tagInputRootEmpty","tagInputContainerRoot","$isTagSelected","StyledInput","disableClear","tagInputRoot","inputBorderContainer","tagInputBorderContainer","inputRootFocused","tagInputRootFocused","_Fragment","role","inputExtension","StyledSuggestions","suggestionsContainer","list","suggestionList","expanded","anchorEl","parentElement","onClose","onSuggestionSelected","StyledError","disableBorder"],"mappings":";;;;;;;;;;;;;;;;;;AAuIO,MAAMA,cAAcA,CAAC;AAAA,EAC1BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,OAAOC;AAAAA,EACPC,eAAe,CAAE;AAAA,EACjBC,WAAW;AAAA,EACXC,WAAW;AAAA,EACXC,WAAW;AAAA,EACXC,OAAOC;AAAAA,EACP,cAAcC;AAAAA,EACd,mBAAmBC;AAAAA,EACnBC;AAAAA,EACA,oBAAoBC;AAAAA,EACpBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,cAAc;AAAA,EACdC,mBAAmB;AAAA,EACnBC;AAAAA,EACAC,YAAY;AAAA,EACZC,YAAY;AAAA,EACZC,aAAa,CAAC;AAAA,EACdC,iBAAiB,CAAC;AAAA,EAClBC,YAAY;AAAA,EACZC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,cAAc,CAAC,OAAO;AAAA,EACtBC,eAAe;AAAA,EACfC;AAAAA,EACA,GAAGC;AACa,MAAM;;AAChBC,QAAAA,YAAYC,YAAAA,QAAYpC,IAAI,aAAa;AAE/C,QAAMqC,WAAW5B,iBAAiB;AAClC,QAAM6B,iBAAiB1B,eAAe;AAEtC,QAAM,CAACV,OAAOqC,QAAQ,IAAIC,cAAAA,cAAcrC,WAAWC,YAAY;AAE/D,QAAM,CAACqC,iBAAiBC,kBAAkB,IAAIF,cAC5CZ,cAAAA,QACAe,iBAAAA,QAAiBC,OAAO;AAE1B,QAAM,CAACC,mBAAmBC,oBAAoB,IAAIN,cAAAA,cAChDX,eACA,EAAE;AAGJ,QAAM,CAACkB,UAAUC,WAAW,IAAIC,eAAS,EAAE;AAC3C,QAAM,CAACC,cAAcC,eAAe,IAAIF,MAAAA,SAAS/C,MAAMkD,MAAM;AAC7D,QAAM,CAACC,YAAYC,aAAa,IAAIL,eAAS,IAAI;AAEjD,QAAMM,WAAWC,MAAAA;AACjB,QAAMC,eAAeD,MAAAA;AACfE,QAAAA,YAAYF,aAAO,KAAK;AAC9B,QAAMG,cAAcH,MAAAA;AACdI,QAAAA,mBAAmBJ,aAAY,IAAI;AAEzC,QAAMK,gBAAgBX,gBAAgB,KAAKA,eAAehD,MAAMkD;AAC1DU,QAAAA,aAAaxC,mBAAmB,QAAQ,CAACF;AAG/C,QAAM,CAAC2C,kBAAkBC,mBAAmB,IAAIf,eAE9C,IAAI;AAEAgB,QAAAA,iBAAiBC,MAAAA,QAAQ,MAAM;AAC5BJ,WAAAA,cAAc5D,MAAMkD,SAAS9B;AAAAA,KACnC,CAACwC,YAAYxC,iBAAiBpB,MAAMkD,MAAM,CAAC;AAE9C,QAAMe,qBAAqBlC,0BAA0B;AAC/CmC,QAAAA,iBAAiB,CAAC,CAACL;AAEnBM,QAAAA,gBAAgBH,MAAAA,QACpB,OAAO;AAAA,IAAE,GAAGI,YAAAA;AAAAA,IAAwB,GAAGxC;AAAAA,EAAmB,IAC1D,CACEA,yDAAoByC,OACpBzC,yDAAoB0C,eACpB1C,yDAAoB2C,cACpB3C,yDAAoB4C,YAAY,CACjC;AAGGC,QAAAA,oBAAoBC,kBACvBC,CAAc,cAAA;AACb,QACEvD,oBAAoB,QACpBA,oBAAoBwD,UACpBD,UAAUzB,SAAS9B,iBACnB;AACAoB,yBAAmBC,iBAAAA,QAAiBoC,OAAO;AAC3CjC,2BAAqBuB,cAAcK,YAAY;AAC/CpB,oBAAc,KAAK;AAAA,IAAA,OACd;AACLZ,yBAAmBC,iBAAAA,QAAiBqC,KAAK;AACzClC,2BAAqB,EAAE;AACvBQ,oBAAc,IAAI;AAAA,IACpB;AAAA,EAAA,GAEF,CACEe,cAAcK,cACdpD,iBACAwB,sBACAJ,kBAAkB,CACnB;AAWH,QAAMuC,YAAYL,MAAAA,YAChB,CAACM,QAAQC,OAAOC,QAAQ;;AACtB,UAAMC,aAAa,CACjB,GAAGnF,MAAMoF,MAAM,GAAGJ,MAAM,GACxB,GAAGhF,MAAMoF,MAAMJ,SAAS,CAAC,CAAC;AAE5B3C,aAAS8C,UAAU;AACnBlC,oBACEiC,MAAMC,WAAWjC,SAASF,eAAe,IAAIA,eAAe,IAAI,CAAC;AAEnEK,KAAAA,MAAAA,SAASgC,YAAThC,gBAAAA,IAAkBiC;AAClBb,sBAAkBU,UAAU;AAC5BrE,yCAAWmE,OAAOjF,MAAMgF,MAAM,GAAGA;AACjCpE,yCAAWqE,OAAOE;AAClB3B,cAAU6B,UAAU;AAAA,EAAA,GAEtB,CAACzE,UAAUE,UAAU2D,mBAAmBpC,UAAUW,cAAchD,KAAK,CAAC;AAUxE,QAAMuF,SAASb,MAAAA,YACb,CAACO,OAAOO,QAAQ;AACdP,UAAMQ,eAAgB;AACtB,QAAID,QAAQ,IAAI;AACd,YAAME,SAAqB;AAAA,QAAEpF,OAAOkF;AAAAA,QAAKG,MAAM;AAAA,MAAA;AAC/C,YAAMR,aAAa,CAAC,GAAGnF,OAAO0F,MAAM;AACpCrD,eAAS8C,UAAU;AACnBV,wBAAkBU,UAAU;AAC5BtE,qCAAQoE,OAAOS,QAAQP,WAAWjC,SAAS;AAC3CtC,2CAAWqE,OAAOE;AAAAA,IACpB;AAAA,EAAA,GAEF,CAACtE,OAAOD,UAAU6D,mBAAmBpC,UAAUrC,KAAK,CAAC;AAGvD,QAAM4F,eACHlE,WAAWkD,UACVlD,WAAW,aACXC,kBAAkBiD,UACpB,CAACzB;AAEH0C,QAAAA,UAAU,MAAM;;AACd,QAAI,CAACpE,WAAW;AACd,YAAMqE,WAAUvC,MAAAA,6CAAc8B,YAAd9B,gBAAAA,IAAuBwC,SAAS/C;AAGhDgD,iBAAW,MAAM;AACf,cAAMC,YAAY1C,aAAa8B;AAC/B,YAAIa,eAAAA,QAAMD,SAAS;AAAG;AACtBA,kBAAUE,aAAaL,UACnBA,QAAQM,aACRH,UAAUI,sBAAAA,EAAwBC,QAAQ,IAC1CR,QAAQO,sBAAuB,EAACC,QAAQ,IACxC;AAAA,SACH,EAAE;AAELR,yCAASR;AAAAA,IACX;AAAA,EAAA,GACC,CAAC7D,WAAWuB,YAAY,CAAC;AAE5B6C,QAAAA,UAAU,MAAM;AACV,QAAA,CAACrC,UAAU6B,SAAS;AACtBvC,kBAAY,EAAE;AACdG,sBAAgBjD,MAAMkD,MAAM;AAAA,IAC9B;AACAM,cAAU6B,UAAU;AAAA,EAAA,GACnB,CAACrF,KAAK,CAAC;AAEV,QAAMuG,YAAYC,aAAAA;AAKlB,QAAMC,aAAaA,MAAM;AACvB/C,qBAAiB2B,QAAQC;EAAO;AAG5BoB,QAAAA,iBAAiBhC,kBACpBiC,CAAO,OAAA;;AAEN,UAAMC,SAASC,SAASC,eACtBC,MAAAA,MAAM9E,WAAW,kBAAkB,KAAK,EAAE;AAE5C,WAAO0E,MAAM,QAAOC,MAAAA,iCAAQI,qBAAqB,UAA7BJ,gBAAAA,IAAqCD,MAAMC;AAAAA,EAAAA,GAEjE,CAAC3E,SAAS,CAAC;AAMPgF,QAAAA,yBAAyBvC,MAAAA,YAAY,MAAM;AAC/C,QAAI6B,UAAUlB,SAAS;AACrBvB,0BAAoB,IAAI;AAAA,IAC1B;AAAA,EAAA,GACC,CAACyC,SAAS,CAAC;AAKRW,QAAAA,oBAAoBxC,kBACvByC,CAAQ,QAAA;;AACDC,UAAAA,mBAAmBrF,iEAAyBoF;AAC9CC,SAAAA,MAAAA,qDAAmB,OAAnBA,gBAAAA,IAAuB9G,OAAO;AAChCwD,0BAAoBsD,gBAAgB;AAAA,IAAA,OAC/B;AACmB;IAC1B;AAAA,EAAA,GAEF,CAACH,wBAAwBlF,sBAAsB,CAAC;AAM5CsF,QAAAA,4BAA4BA,CAACpC,OAAOqC,SAAS;AACjD/B,WAAON,OAAOqC,KAAKtH,SAASsH,KAAKhH,KAAK;AAG1BgH,gBAAAA,KAAKtH,SAASsH,KAAKhH,KAAK;AAExB;AACY;EAAA;AAM1B,QAAMiH,sBAAuBtC,CAAU,UAAA;AACrC,QAAIuC,oBAAWvC,OAAOwC,cAAcC,cAAAA,GAAG,GAAG;AAChB;AACZ;IACHF,WAAAA,SAAAA,WAAWvC,OAAOwC,cAAAA,cAAcE,GAAG,GAAG;AACvB;IAC1B;AAAA,EAAA;AAMF,QAAMC,kBAAkBlD,MAAAA,YACtB,CAACmD,GAAGC,UAAU;AACZhF,gBAAYgF,KAAK;AAEjB,QAAI7D,oBAAoB;AAOtBiD,wBAAkBY,KAAK;AAAA,IACzB;AAAA,EAAA,GAEF,CAAC7D,oBAAoBiD,iBAAiB,CAAC;AAMnCa,QAAAA,wBAAwBrD,kBAC3BO,CAAU,UAAA;AACT,QAAI,CAAChB,sBAAsBpC,YAAYmG,SAAS/C,MAAMgD,IAAI,GAAG;AAC3D1C,aAAON,OAAOpC,QAAQ;AAAA,IACxB;AAAA,KAEF,CAAC0C,QAAQtB,oBAAoBpC,aAAagB,QAAQ,CAAC;AAM/CqF,QAAAA,mBAAmBxD,kBACtBO,CAAU,UAAA;;AACT,QAAIpC,aAAa,IAAI;AACnB,cAAQoC,MAAMgD,MAAI;AAAA,QAChB,KAAK;AACHhF,0BAAgBD,eAAe,IAAIA,eAAe,IAAI,CAAC;AACvD;AAAA,QACF,KAAK;AACHC,0BACED,eAAehD,MAAMkD,SAASF,eAAe,IAAIhD,MAAMkD,MAAM;AAE/D;AAAA,QACF,KAAK;AACH,cAAIS,eAAe;AACPX,sBAAAA,cAAciC,OAAO,KAAK;AAAA,UAAA,OAC/B;AACWjF,4BAAAA,MAAMkD,SAAS,CAAC;AAAA,UAClC;AACA;AAAA,QACF,KAAK;AACH,cAAIS,eAAe;AACPX,sBAAAA,cAAciC,OAAO,KAAK;AAAA,UACtC;AACA;AAAA,MAEM;AAAA,IAAA,OAEL;AACL,cAAQA,MAAMgD,MAAI;AAAA,QAChB,KAAK;AACY,WAAAE,MAAA,eAAA,CAAC,MAAD,gBAAAA,IAAI7C;AACnB;AAAA,MAEM;AAAA,IAEZ;AAAA,EAAA,GAEF,CACEP,WACA2B,gBACA/C,eACAX,cACAH,UACA7C,MAAMkD,MAAM,CACb;AAMH,QAAMkF,qBAAqB1D,MAAAA,YACzB,CAACO,OAAOoD,MAAM;AACFA,cAAAA,GAAGpD,OAAO,IAAI;AACxBzC,uBAAmBC,iBAAAA,QAAiBC,OAAO;AAAA,EAAA,GAE7C,CAACqC,WAAWvC,kBAAkB,CAAC;AAM3B8F,QAAAA,0BAA0B5D,MAAAA,YAAY,MAAM;;AAChDrB,KAAAA,MAAAA,SAASgC,YAAThC,gBAAAA,IAAkBiC;AAClBiD,iBAAa9E,YAAY4B,OAAO;AAChCpC,oBAAgBjD,MAAMkD,MAAM;AAAA,EAAA,GAC3B,CAAClD,MAAMkD,MAAM,CAAC;AAEjB,QAAMsF,gBAAiBC,CAAQ,QAAA;AACjBpD,gBAAAA,UAAUW,WAAW,MAAM;AACrC,UAAIlE,cAAc;AAChByD,eAAOkD,KAAK5F,QAAQ;AAAA,MACtB;AACA9B,uCAAS0H,KAAK5F;AAAAA,OACb,GAAG;AAAA,EAAA;AAGR,QAAM6F,iBAAkBD,CAAQ,QAAA;AAC9BF,iBAAa9E,YAAY4B,OAAO;AAChCrE,uCAAUyH,KAAK5F;AAAAA,EAAQ;AAGzB,yCACG8F,iBAAAA,mBAAiB;AAAA,IAChB7I;AAAAA,IACAC;AAAAA,IACAK;AAAAA,IACAD;AAAAA,IACAuB,QAAQa;AAAAA,IACRlC;AAAAA,IACAU,QAAQyH;AAAAA,IACRxH,SAAS0H;AAAAA,IACT7I,WAAW+I,KAAAA,KACTC,iBAAAA,QAAiBC,MACjBlJ,mCAASkJ,MACTjJ,WACAO,YAAYwI,KAAKC,KAAAA,iBAAAA,QAAiBzI,UAAUR,mCAASQ,QAAQ,CAAC;AAAA,IAC9D2F,UAAA,EAEA5D,YAAYC,mDACX2G,iBAAAA,sBAAoB;AAAA,MACnBlJ,WAAW+I,KAAAA,KACTC,iBAAAA,QAAiBG,gBACjBpJ,mCAASoJ,cAAc;AAAA,MACvBjD,UAED5D,CAAAA,YACC8G,2BAAAA,IAACC,8BAAW;AAAA,QACVrJ,WAAW+I,KAAAA,KAAKC,iBAAAA,QAAiBvI,OAAOV,mCAASU,KAAK;AAAA,QACtDR,IAAIiH,MAAAA,MAAMjH,IAAI,OAAO;AAAA,QACrBqJ,SAASpC,MAAAA,MAAM9E,WAAW,OAAO;AAAA,QACjC3B,OAAOC;AAAAA,MAAAA,CAAc,GAIxB6B,kBACC6G,2BAAAA,IAACG,oCAAiB;AAAA,QAChBvJ,WAAW+I,KAAAA,KACTC,iBAAAA,QAAiBnI,aACjBd,mCAASc,WAAW;AAAA,QAEtBZ,IAAIiH,MAAAA,MAAM9E,WAAW,aAAa;AAAA,QAAE8D,UAEnCrF;AAAAA,MAAAA,CAEJ,CAAA;AAAA,IAAA,CAAA,GAIJkD,cACCqF,2BAAAA,IAACI,oCAAiB;AAAA,MAChBvJ,IAAIiH,MAAAA,MAAM9E,WAAW,aAAa;AAAA,MAClCpC,WAAW+I,KAAAA,KACTC,iBAAAA,QAAiBS,kBACjB1J,mCAAS0J,gBAAgB;AAAA,MAE3BC,WAAWpI;AAAAA,MACXqI,qBAAqBxJ,MAAMkD;AAAAA,MAC3BuG,iBAAiBrI;AAAAA,MAAgB,GAC7BI;AAAAA,IAAAA,CAEP,GAEDkI,2BAAAA,KAACC,iCAAc;AAAA,MACb9J,WAAW+I,KAAAA,KACTC,iBAAiBe,QAAAA,UACjBhK,mCAASgK,UACThE,gBAAgBgD,KAAAA,KAAKC,iBAAAA,QAAiBxE,OAAOzE,mCAASyE,KAAK,GAC3D/C,aACEG,aACAmH,KAAAA,KAAKC,iBAAAA,QAAiBvH,WAAW1B,mCAAS0B,SAAS,GACrDyC,kBAAkB6E,KAAAA,KAAKC,iBAAAA,QAAiBhE,SAASjF,mCAASiF,OAAO,GACjE,CAACpD,aAAamH,UAAKC,iBAAAA,QAAiBgB,YAAYjK,mCAASiK,UAAU,CAAC;AAAA,MAEtEC,WAAW1J;AAAAA,MACX2J,aAAa,CAACtI;AAAAA,MACduI,QAAQpE;AAAAA,MACRqE,YAAY3I,aAAaG;AAAAA,MACzByI,UAAUnG;AAAAA,MACVoG,WAAWhK;AAAAA,MACXiK,WAAWlC;AAAAA,MACXmC,SAAS/B;AAAAA,MACTgC,KAAK/G;AAAAA,MAAawC,UAAA,CAEjB/F,SACCA,MAAMuK,IAAI,CAACC,GAAGnC,MAAM;AACZ7C,cAAAA,MACJ,OAAOgF,MAAM,WACT;AAAA,UACElK,OAAOkK;AAAAA,UACP7E,MAAM;AAAA,QAER6E,IAAAA;AACA,cAAA;AAAA,UAAElK;AAAAA,UAAOqF;AAAAA,UAAM,GAAG8E;AAAAA,QAAejF,IAAAA;AACvC,8CACGkF,iBAAAA,gBAAc;AAAA,UAEbC,UAAU;AAAA,UACV9K,WAAW+I,KAAAA,KACT,CAACnH,aACCmH,KAAAA,KAAKC,iBAAAA,QAAiBgB,YAAYjK,mCAASiK,UAAU,CAAC;AAAA,UAE1DjK,SAAS;AAAA,YACPgL,SAAShC,KAAAA,KACPC,iBAAAA,QAAiBgC,iBACjBjL,mCAASiL,eAAe;AAAA,YAE1B/B,MAAMF,KAAAA,KACJC,iBAAAA,QAAiBiC,cACjBlL,mCAASkL,YAAY;AAAA,UAEzB;AAAA,UACAhL,IAAK,OAAMuI;AAAAA,UACX0B,aAAa,CAACtI;AAAAA,UAAUsE,yCAEvBgF,4BAAS;AAAA,YACRzK;AAAAA,YACAT,WAAW+I,KAAAA,KACTP,MAAMrF,gBACJ4F,KAAAA,KAAKC,iBAAAA,QAAiBmC,aAAapL,mCAASoL,WAAW,CAAC;AAAA,YAE5DpL,SAAS;AAAA,cACPqL,UAAUrC,KAAAA,KACRC,iBAAAA,QAAiBoC,UACjBrL,mCAASqL,QAAQ;AAAA,YAErB;AAAA,YACAtF;AAAAA,YAAW,GACN,EAAExF,YAAYC,YAAYuF,SAAS,kBAAkB;AAAA,cACxD7E,UAAWmE,CAAAA,UAAUmD,mBAAmBnD,OAAOoD,CAAC;AAAA,YAClD;AAAA,YACA6C,mBAAmB;AAAA,cACjBP,UAAU;AAAA,YACZ;AAAA,YACAQ,WAAW9C,MAAMrF;AAAAA,YAAa,GAC1ByH;AAAAA,UAAAA,CAAU;AAAA,QAAA,GAvCV,GAAEjF,IAAIlF,SAAS+H,GAAG;AAAA,MA2C7B,CAAA,GACF,EAAEjI,YAAYD,4CACZiL,iBAAAA,qBAAmB;AAAA,QAClBvL,WAAW+I,KACT,KAAA,CAACnH,aACCmH,KACEC,KAAAA,yBAAiBgB,YACjBjK,mCAASiK,YACT7J,MAAMkD,WAAW,KACf0F,UACEC,iBAAAA,QAAiBwC,mBACjBzL,mCAASyL,iBAAiB,CAC3B,CACJ;AAAA,QAELzL,SAAS;AAAA,UACPkJ,MAAMF,KAAAA,KACJC,iBAAAA,QAAiByC,uBACjB1L,mCAAS0L,qBAAqB;AAAA,UAEhCV,SAAShC,KAAAA,KACPC,iBAAAA,QAAiBgC,iBACjBjL,mCAASiL,eAAe;AAAA,QAE5B;AAAA,QACA/K,IAAK,OAAME,MAAMkD;AAAAA,QACjB6G,aAAa,CAACtI;AAAAA,QACd8J,gBAAgB,CAAC,CAAC5H;AAAAA,QAAcoC,yCAE/ByF,8BAAW;AAAA,UACVxL,OAAO6C;AAAAA,UACP4I,cAAY;AAAA,UACZ7K,UAAUgH;AAAAA,UACVwC,WAAWrC;AAAAA,UACX9G,aAAajB,MAAMkD,WAAW,IAAIjC,cAAc;AAAA,UAChDI;AAAAA,UACAxB,WAAW+I,KAAAA,KACT,CAACnH,aACCmH,KAAAA,KAAKC,iBAAAA,QAAiBgB,YAAYjK,mCAASiK,UAAU,CAAC;AAAA,UAE1DjK,SAAS;AAAA,YACPkJ,MAAMF,KAAAA,KACJC,iBAAAA,QAAiB6C,cACjB9L,mCAAS8L,YAAY;AAAA,YAEvB5D,OAAOc,KAAAA,KAAKC,iBAAAA,QAAiBf,OAAOlI,mCAASkI,KAAK;AAAA,YAClD6D,sBAAsB/C,KAAAA,KACpBC,iBAAAA,QAAiB+C,yBACjBhM,mCAASgM,uBAAuB;AAAA,YAElCC,kBAAkBjD,KAAAA,KAChBC,iBAAAA,QAAiBiD,qBACjBlM,mCAASkM,mBAAmB;AAAA,UAEhC;AAAA,UACA1L;AAAAA,UACAD,UAAUA,YAAYwD;AAAAA,UACtBpC,YAAY;AAAA,YACV+I,KAAK5G;AAAAA,YACL,cAAclD;AAAAA,YACd,mBAAmBC;AAAAA,YACnB,oBACEE,mBAAmB,OACfA,kBACCD,eAAeqG,MAAAA,MAAM9E,WAAW,aAAa,KAC9C2C;AAAAA,YAEN,GAAGrD;AAAAA,UACL;AAAA,UACA8B;AAAAA,UACA0G,aAAa,CAACtI;AAAAA,UAAU,GACpBO;AAAAA,QAAAA,CAAM;AAAA,MAAA,CAGf,CAAA;AAAA,IAAA,CAAA,GAEFiC,sBACCyF,2BAAAA,KAAAqC,qBAAA;AAAA,MAAAhG,UAAA,CACG7B,kBACC+E,2BAAAA,IAAA,OAAA;AAAA,QACE+C,MAAK;AAAA,QACLnM,WAAW+I,KAAAA,KACTC,iBAAAA,QAAiBoD,gBACjBrM,mCAASqM,cAAc;AAAA,MAAA,CAG5B,GACDhD,2BAAAA,IAACiD,oCAAiB;AAAA,QAChBpM,IAAIiH,MAAAA,MAAM9E,WAAW,aAAa;AAAA,QAClCrC,SAAS;AAAA,UACPkJ,MAAMF,KAAAA,KACJC,iBAAAA,QAAiBsD,sBACjBvM,mCAASuM,oBAAoB;AAAA,UAE/BC,MAAMxD,KAAAA,KACJC,iBAAAA,QAAiBwD,gBACjBzM,mCAASyM,cAAc;AAAA,QAE3B;AAAA,QACAC,UAAUpI;AAAAA,QACVqI,WAAUhJ,kDAAc8B,YAAd9B,mBAAuBiJ;AAAAA,QACjCC,SAASxF;AAAAA,QACTmD,WAAW7C;AAAAA,QACXmF,sBAAsBrF;AAAAA,QACtBxD;AAAAA,MAAAA,CACA,CAAA;AAAA,IAAA,CAAA,GAGL+B,gBACCqD,2BAAAA,IAAC0D,8BAAW;AAAA,MACV7M,IAAIiH,MAAAA,MAAM9E,WAAW,OAAO;AAAA,MAC5B2K,eAAa;AAAA,MACb/M,WAAW+I,KAAAA,KAAKC,iBAAAA,QAAiBxE,OAAOzE,mCAASyE,KAAK;AAAA,MAAE0B,UAEvDpD;AAAAA,IAAAA,CAEJ,CAAA;AAAA,EAAA,CACiB;AAExB;;"}
+{"version":3,"file":"TagsInput.cjs","sources":["../../../../src/components/TagsInput/TagsInput.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport isNil from \"lodash/isNil\";\nimport { InputBaseComponentProps as MuiInputBaseComponentProps } from \"@mui/material\";\nimport {\n  HvBaseProps,\n  HvTagSuggestion,\n  HvValidationMessages,\n} from \"@core/types\";\nimport { useControlled, useIsMounted, useUniqueId } from \"@core/hooks\";\nimport { isKeypress, keyboardCodes, setId } from \"@core/utils\";\nimport {\n  StyledCharCounter,\n  StyledDescription,\n  StyledError,\n  StyledFormElement,\n  StyledLabel,\n  StyledLabelContainer,\n  StyledListItem,\n  StyledTag,\n  StyledTagsList,\n  StyledInputListItem,\n  StyledInput,\n  StyledSuggestions,\n} from \"./TagsInput.styles\";\nimport validationStates from \"../Forms/FormElement/validationStates\";\nimport { DEFAULT_ERROR_MESSAGES } from \"../BaseInput/validations\";\nimport { HvTagProps } from \"../Tag\";\nimport tagsInputClasses, { HvTagsInputClasses } from \"./tagsInputClasses\";\nimport { HvCharCounterProps, HvFormStatus } from \"../Forms\";\n\nexport interface HvTagsInputProps\n  extends HvBaseProps<\n    HTMLElement,\n    \"onChange\" | \"onBlur\" | \"onFocus\" | \"onKeyDown\" | \"color\" | \"defaultValue\"\n  > {\n  /** The form element name. */\n  name?: string;\n  /** The value of the form element. */\n  value?: string[] | HvTagProps[];\n  /** When uncontrolled, defines the initial input value. */\n  defaultValue?: string[] | HvTagProps[];\n  /**\n   * The label of the form element.\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n   */\n  label?: React.ReactNode;\n  /** Provide additional descriptive text for the form element. */\n  description?: React.ReactNode;\n  /** Indicates that the form element is disabled. */\n  disabled?: boolean;\n  /** Indicates that the form element is not editable. */\n  readOnly?: boolean;\n  /** Indicates that the form element is required. */\n  required?: boolean;\n  /** The function that will be executed onChange. */\n  onChange?: (\n    event:\n      | React.ChangeEvent<HTMLInputElement>\n      | React.KeyboardEvent<HTMLInputElement>\n      | React.MouseEvent<HTMLButtonElement>\n      | React.MouseEvent<HTMLElement, MouseEvent>\n      | React.KeyboardEventHandler<HTMLElement>,\n    value: HvTagProps[]\n  ) => void;\n  /** The function that will be executed when the element is focused. */\n  onFocus?: (event: React.FocusEvent<HTMLInputElement>, value: string) => void;\n  /** The function that will be executed when the element is blurred. */\n  onBlur?: (event: React.FocusEvent<HTMLInputElement>, value: string) => void;\n  /** The function that will be executed when a tag is deleted. */\n  onDelete?: (\n    event:\n      | React.ChangeEvent<HTMLInputElement>\n      | React.KeyboardEvent<HTMLInputElement>\n      | React.MouseEvent<HTMLButtonElement>\n      | React.MouseEvent<HTMLElement, MouseEvent>\n      | React.KeyboardEventHandler<HTMLElement>,\n    value: HvTagProps,\n    index: number\n  ) => void;\n  /** The function that will be executed when a tag is added. */\n  onAdd?: (\n    event:\n      | React.ChangeEvent<HTMLInputElement>\n      | React.KeyboardEvent<HTMLInputElement>\n      | React.MouseEvent<HTMLButtonElement>\n      | React.MouseEvent<HTMLElement, MouseEvent>\n      | React.KeyboardEventHandler<HTMLElement>,\n    value: HvTagProps,\n    index: number\n  ) => void;\n  /** The placeholder value of the input. */\n  placeholder?: string;\n  /** If `true` the character counter isn't shown even if maxTagsQuantity is set. */\n  hideCounter?: boolean;\n  /** Text between the current char counter and max value. */\n  middleCountLabel?: string;\n  /** The maximum allowed length of the characters, if this value is null no check will be performed. */\n  maxTagsQuantity?: number;\n  /** Attributes applied to the input element. */\n  inputProps?: MuiInputBaseComponentProps;\n  /** If `true` it should autofocus. */\n  autoFocus?: boolean;\n  /** If `true` the component is resizable. */\n  resizable?: boolean;\n  /** Props passed to the HvCharCount component. */\n  countCharProps?: Partial<HvCharCounterProps>;\n  /** If `true` the component is in multiline mode. */\n  multiline?: boolean;\n  /** The status of the form element. */\n  status?: HvFormStatus;\n  /** The error message to show when `status` is \"invalid\". */\n  statusMessage?: React.ReactNode;\n  /** An Object containing the various texts associated with the input. */\n  validationMessages?: HvValidationMessages;\n  /** An array of strings that represent the character used to input a tag. This character is the string representation of the event.code from the input event. */\n  commitTagOn?: string[];\n  /** If `true` the tag will be committed when the blur event occurs. */\n  commitOnBlur?: boolean;\n  /** The function that will be executed to received an array of objects that has a label and id to create list of suggestion */\n  suggestionListCallback?: (value: string) => HvTagSuggestion[] | null;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvTagsInputClasses;\n}\n\n/**\n * A tags input is a single or multiline control that allows the input of tags.\n */\nexport const HvTagsInput = ({\n  classes,\n  className,\n  id,\n  name,\n  value: valueProp,\n  defaultValue = [],\n  readOnly = false,\n  disabled = false,\n  required = false,\n  label: textAreaLabel,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledBy,\n  description,\n  \"aria-describedby\": ariaDescribedBy,\n  onChange,\n  onAdd,\n  onDelete,\n  onBlur,\n  onFocus,\n  placeholder,\n  hideCounter = false,\n  middleCountLabel = \"/\",\n  maxTagsQuantity,\n  autoFocus = false,\n  resizable = true,\n  inputProps = {},\n  countCharProps = {},\n  multiline = false,\n  status,\n  statusMessage,\n  validationMessages,\n  commitTagOn = [\"Enter\"],\n  commitOnBlur = false,\n  suggestionListCallback,\n  ...others\n}: HvTagsInputProps) => {\n  const elementId = useUniqueId(id, \"hvTagsInput\");\n\n  const hasLabel = textAreaLabel != null;\n  const hasDescription = description != null;\n\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n\n  const [validationState, setValidationState] = useControlled(\n    status,\n    validationStates.standBy\n  );\n  const [validationMessage, setValidationMessage] = useControlled(\n    statusMessage,\n    \"\"\n  );\n\n  const [tagInput, setTagInput] = useState(\"\");\n  const [tagCursorPos, setTagCursorPos] = useState(value.length);\n  const [stateValid, setStateValid] = useState(true);\n\n  const inputRef = useRef<any>();\n  const containerRef = useRef<any>();\n  const skipReset = useRef(false);\n  const blurTimeout = useRef<any>();\n  const materialInputRef = useRef<any>(null);\n\n  const isTagSelected = tagCursorPos >= 0 && tagCursorPos < value.length;\n  const hasCounter = maxTagsQuantity != null && !hideCounter;\n\n  // suggestions related state\n  const [suggestionValues, setSuggestionValues] = useState<\n    HvTagSuggestion[] | null\n  >(null);\n\n  const isStateInvalid = useMemo(() => {\n    return hasCounter && value.length > maxTagsQuantity;\n  }, [hasCounter, maxTagsQuantity, value.length]);\n\n  const canShowSuggestions = suggestionListCallback != null;\n  const hasSuggestions = !!suggestionValues;\n\n  const errorMessages = useMemo(\n    () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n    [\n      validationMessages?.error,\n      validationMessages?.requiredError,\n      validationMessages?.minCharError,\n      validationMessages?.maxCharError,\n    ]\n  );\n\n  const performValidation = useCallback(\n    (currValue) => {\n      if (\n        maxTagsQuantity !== null &&\n        maxTagsQuantity !== undefined &&\n        currValue.length > maxTagsQuantity\n      ) {\n        setValidationState(validationStates.invalid);\n        setValidationMessage(errorMessages.maxCharError);\n        setStateValid(false);\n      } else {\n        setValidationState(validationStates.valid);\n        setValidationMessage(\"\");\n        setStateValid(true);\n      }\n    },\n    [\n      errorMessages.maxCharError,\n      maxTagsQuantity,\n      setValidationMessage,\n      setValidationState,\n    ]\n  );\n\n  /**\n   * Deletes a Tag from the array of tags and sets the new position for the tag cursor.\n   * Also executes the user provided onDelete and onChange events.\n   *\n   * @param {number}  tagPos - the position at which to remove the tag\n   * @param {Event}   event  - the event associated with the delete\n   * @param {boolean} end    - whether or not to set the cursor at the end of the array\n   */\n  const deleteTag = useCallback(\n    (tagPos, event, end) => {\n      const newTagsArr = [\n        ...value.slice(0, tagPos),\n        ...value.slice(tagPos + 1),\n      ];\n      setValue(newTagsArr);\n      setTagCursorPos(\n        end ? newTagsArr.length : tagCursorPos > 0 ? tagCursorPos - 1 : 0\n      );\n      inputRef.current?.focus();\n      performValidation(newTagsArr);\n      onDelete?.(event, value[tagPos], tagPos);\n      onChange?.(event, newTagsArr);\n      skipReset.current = true;\n    },\n    [onChange, onDelete, performValidation, setValue, tagCursorPos, value]\n  );\n\n  /**\n   * Adds a Tag to the array of tags.\n   * Also executes the user provided onAdd and onDelete events.\n   *\n   * @param {Event}   event  - whatever event triggered adding a tag\n   * @param {string}  tag    - the string for the tag\n   */\n  const addTag = useCallback(\n    (event, tag) => {\n      event.preventDefault();\n      if (tag !== \"\") {\n        const newTag: HvTagProps = { label: tag, type: \"semantic\" };\n        const newTagsArr = [...value, newTag];\n        setValue(newTagsArr);\n        performValidation(newTagsArr);\n        onAdd?.(event, newTag, newTagsArr.length - 1);\n        onChange?.(event, newTagsArr);\n      }\n    },\n    [onAdd, onChange, performValidation, setValue, value]\n  );\n\n  const canShowError =\n    (status !== undefined &&\n      status === \"invalid\" &&\n      statusMessage !== undefined) ||\n    !stateValid;\n\n  useEffect(() => {\n    if (!multiline) {\n      const element = containerRef?.current?.children[tagCursorPos];\n      // this setTimeout is a workaround for Firefox not properly dealing\n      // with setting the scrollLeft value.\n      setTimeout(() => {\n        const container = containerRef.current;\n        if (isNil(container)) return;\n        container.scrollLeft = element\n          ? element.offsetLeft -\n            container.getBoundingClientRect().width / 2 +\n            element.getBoundingClientRect().width / 2\n          : 0;\n      }, 50);\n\n      element?.focus();\n    }\n  }, [multiline, tagCursorPos]);\n\n  useEffect(() => {\n    if (!skipReset.current) {\n      setTagInput(\"\");\n      setTagCursorPos(value.length);\n    }\n    skipReset.current = false;\n  }, [value]);\n\n  const isMounted = useIsMounted();\n\n  /**\n   * Looks for the node that represent the input inside the material tree and focus it.\n   */\n  const focusInput = () => {\n    materialInputRef.current.focus();\n  };\n\n  const getSuggestions = useCallback(\n    (li) => {\n      // TODO Replace with ref\n      const listEl = document.getElementById(\n        setId(elementId, \"suggestions-list\") || \"\"\n      );\n      return li != null ? listEl?.getElementsByTagName(\"li\")?.[li] : listEl;\n    },\n    [elementId]\n  );\n\n  /**\n   * Clears the suggestion array.\n   */\n  const suggestionClearHandler = useCallback(() => {\n    if (isMounted.current) {\n      setSuggestionValues(null);\n    }\n  }, [isMounted]);\n\n  /**\n   * Fills of the suggestion array.\n   */\n  const suggestionHandler = useCallback(\n    (val) => {\n      const suggestionsArray = suggestionListCallback?.(val);\n      if (suggestionsArray?.[0]?.label) {\n        setSuggestionValues(suggestionsArray);\n      } else {\n        suggestionClearHandler();\n      }\n    },\n    [suggestionClearHandler, suggestionListCallback]\n  );\n\n  /**\n   * Executes the user callback adds the selection to the state and clears the suggestions.\n   */\n  const suggestionSelectedHandler = (event, item) => {\n    addTag(event, item.value || item.label);\n\n    // set the input value (only when value is uncontrolled)\n    setTagInput(item.value || item.label);\n\n    focusInput();\n    suggestionClearHandler();\n  };\n\n  /**\n   * Handler for the `onKeyDown` event on the suggestions component\n   */\n  const onSuggestionKeyDown = (event) => {\n    if (isKeypress(event, keyboardCodes.Esc)) {\n      suggestionClearHandler();\n      focusInput();\n    } else if (isKeypress(event, keyboardCodes.Tab)) {\n      suggestionClearHandler();\n    }\n  };\n\n  /**\n   * Handler for the `onChange` event on the tag input\n   */\n  const onChangeHandler = useCallback(\n    (_, input) => {\n      setTagInput(input);\n\n      if (canShowSuggestions) {\n        // an edge case might be a controlled input whose onChange callback\n        // doesn't change the value (or sets another): the suggestionListCallback\n        // callback will still receive the original rejected value.\n        // a refactor is needed so the suggestionListCallback might be called only\n        // when the input is uncontrolled, providing a way to externally control\n        // the suggestion values.\n        suggestionHandler(input);\n      }\n    },\n    [canShowSuggestions, suggestionHandler]\n  );\n\n  /**\n   * Handler for the `onKeyDown` event on the form element\n   */\n  const onInputKeyDownHandler = useCallback(\n    (event) => {\n      if (!canShowSuggestions && commitTagOn.includes(event.code)) {\n        addTag(event, tagInput);\n      }\n    },\n    [addTag, canShowSuggestions, commitTagOn, tagInput]\n  );\n\n  /**\n   * Handler for the `onKeyDown` event on the list container.\n   */\n  const onKeyDownHandler = useCallback(\n    (event) => {\n      if (tagInput === \"\") {\n        switch (event.code) {\n          case \"ArrowLeft\":\n            setTagCursorPos(tagCursorPos > 0 ? tagCursorPos - 1 : 0);\n            break;\n          case \"ArrowRight\":\n            setTagCursorPos(\n              tagCursorPos < value.length ? tagCursorPos + 1 : value.length\n            );\n            break;\n          case \"Backspace\":\n            if (isTagSelected) {\n              deleteTag(tagCursorPos, event, false);\n            } else {\n              setTagCursorPos(value.length - 1);\n            }\n            break;\n          case \"Delete\":\n            if (isTagSelected) {\n              deleteTag(tagCursorPos, event, false);\n            }\n            break;\n          default:\n            break;\n        }\n      } else {\n        switch (event.code) {\n          case \"ArrowDown\":\n            getSuggestions(0)?.focus();\n            break;\n          default:\n            break;\n        }\n      }\n    },\n    [\n      deleteTag,\n      getSuggestions,\n      isTagSelected,\n      tagCursorPos,\n      tagInput,\n      value.length,\n    ]\n  );\n\n  /**\n   * Handler for the `onDelete` event on the tag component\n   */\n  const onDeleteTagHandler = useCallback(\n    (event, i) => {\n      deleteTag(i, event, true);\n      setValidationState(validationStates.standBy);\n    },\n    [deleteTag, setValidationState]\n  );\n\n  /**\n   * Handler for the `onClick` event on the list container\n   */\n  const onContainerClickHandler = useCallback(() => {\n    inputRef.current?.focus();\n    clearTimeout(blurTimeout.current);\n    setTagCursorPos(value.length);\n  }, [value.length]);\n\n  const onBlurHandler = (evt) => {\n    blurTimeout.current = setTimeout(() => {\n      if (commitOnBlur) {\n        addTag(evt, tagInput);\n      }\n      onBlur?.(evt, tagInput);\n    }, 250);\n  };\n\n  const onFocusHandler = (evt) => {\n    clearTimeout(blurTimeout.current);\n    onFocus?.(evt, tagInput);\n  };\n\n  return (\n    <StyledFormElement\n      id={id}\n      name={name}\n      disabled={disabled}\n      readOnly={readOnly}\n      status={validationState}\n      required={required}\n      onBlur={onBlurHandler}\n      onFocus={onFocusHandler}\n      className={clsx(\n        tagsInputClasses.root,\n        classes?.root,\n        className,\n        disabled && clsx(tagsInputClasses.disabled, classes?.disabled)\n      )}\n    >\n      {(hasLabel || hasDescription) && (\n        <StyledLabelContainer\n          className={clsx(\n            tagsInputClasses.labelContainer,\n            classes?.labelContainer\n          )}\n        >\n          {hasLabel && (\n            <StyledLabel\n              className={clsx(tagsInputClasses.label, classes?.label)}\n              id={setId(id, \"label\")}\n              htmlFor={setId(elementId, \"input\")}\n              label={textAreaLabel}\n            />\n          )}\n\n          {hasDescription && (\n            <StyledDescription\n              className={clsx(\n                tagsInputClasses.description,\n                classes?.description\n              )}\n              id={setId(elementId, \"description\")}\n            >\n              {description}\n            </StyledDescription>\n          )}\n        </StyledLabelContainer>\n      )}\n\n      {hasCounter && (\n        <StyledCharCounter\n          id={setId(elementId, \"charCounter\")}\n          className={clsx(\n            tagsInputClasses.characterCounter,\n            classes?.characterCounter\n          )}\n          separator={middleCountLabel}\n          currentCharQuantity={value.length}\n          maxCharQuantity={maxTagsQuantity}\n          {...countCharProps}\n        />\n      )}\n\n      <StyledTagsList\n        className={clsx(\n          tagsInputClasses.tagsList,\n          classes?.tagsList,\n          canShowError && clsx(tagsInputClasses.error, classes?.error),\n          resizable &&\n            multiline &&\n            clsx(tagsInputClasses.resizable, classes?.resizable),\n          isStateInvalid && clsx(tagsInputClasses.invalid, classes?.invalid),\n          !multiline && clsx(tagsInputClasses.singleLine, classes?.singleLine)\n        )}\n        $disabled={disabled}\n        $singleLine={!multiline}\n        $error={canShowError}\n        $resizable={resizable && multiline}\n        $invalid={isStateInvalid}\n        $readOnly={readOnly}\n        onKeyDown={onKeyDownHandler}\n        onClick={onContainerClickHandler}\n        ref={containerRef}\n      >\n        {value &&\n          value.map((t, i) => {\n            const tag =\n              typeof t === \"string\"\n                ? {\n                    label: t,\n                    type: \"semantic\",\n                  }\n                : t;\n            const { label, type, ...otherProps } = tag;\n            return (\n              <StyledListItem\n                key={`${tag.label}-${i}`}\n                tabIndex={-1}\n                className={clsx(\n                  !multiline &&\n                    clsx(tagsInputClasses.singleLine, classes?.singleLine)\n                )}\n                classes={{\n                  gutters: clsx(\n                    tagsInputClasses.listItemGutters,\n                    classes?.listItemGutters\n                  ),\n                  root: clsx(\n                    tagsInputClasses.listItemRoot,\n                    classes?.listItemRoot\n                  ),\n                }}\n                id={`tag-${i}`}\n                $singleLine={!multiline}\n              >\n                <StyledTag\n                  label={label}\n                  className={clsx(\n                    i === tagCursorPos &&\n                      clsx(tagsInputClasses.tagSelected, classes?.tagSelected)\n                  )}\n                  classes={{\n                    chipRoot: clsx(\n                      tagsInputClasses.chipRoot,\n                      classes?.chipRoot\n                    ),\n                  }}\n                  type={type}\n                  {...(!(readOnly || disabled || type === \"categorical\") && {\n                    onDelete: (event) => onDeleteTagHandler(event, i),\n                  })}\n                  deleteButtonProps={{\n                    tabIndex: -1,\n                  }}\n                  $selected={i === tagCursorPos}\n                  {...otherProps}\n                />\n              </StyledListItem>\n            );\n          })}\n        {!(disabled || readOnly) && (\n          <StyledInputListItem\n            className={clsx(\n              !multiline &&\n                clsx(\n                  tagsInputClasses.singleLine,\n                  classes?.singleLine,\n                  value.length === 0 &&\n                    clsx(\n                      tagsInputClasses.tagInputRootEmpty,\n                      classes?.tagInputRootEmpty\n                    )\n                )\n            )}\n            classes={{\n              root: clsx(\n                tagsInputClasses.tagInputContainerRoot,\n                classes?.tagInputContainerRoot\n              ),\n              gutters: clsx(\n                tagsInputClasses.listItemGutters,\n                classes?.listItemGutters\n              ),\n            }}\n            id={`tag-${value.length}`}\n            $singleLine={!multiline}\n            $isTagSelected={!!isTagSelected}\n          >\n            <StyledInput\n              value={tagInput}\n              disableClear\n              onChange={onChangeHandler}\n              onKeyDown={onInputKeyDownHandler}\n              placeholder={value.length === 0 ? placeholder : \"\"}\n              autoFocus={autoFocus}\n              className={clsx(\n                !multiline &&\n                  clsx(tagsInputClasses.singleLine, classes?.singleLine)\n              )}\n              classes={{\n                root: clsx(\n                  tagsInputClasses.tagInputRoot,\n                  classes?.tagInputRoot\n                ),\n                input: clsx(tagsInputClasses.input, classes?.input),\n                inputBorderContainer: clsx(\n                  tagsInputClasses.tagInputBorderContainer,\n                  classes?.tagInputBorderContainer\n                ),\n                inputRootFocused: clsx(\n                  tagsInputClasses.tagInputRootFocused,\n                  classes?.tagInputRootFocused\n                ),\n              }}\n              disabled={disabled}\n              readOnly={readOnly || isTagSelected}\n              inputProps={{\n                ref: materialInputRef,\n                \"aria-label\": ariaLabel,\n                \"aria-labelledby\": ariaLabelledBy,\n                \"aria-describedby\":\n                  ariaDescribedBy != null\n                    ? ariaDescribedBy\n                    : (description && setId(elementId, \"description\")) ||\n                      undefined,\n\n                ...inputProps,\n              }}\n              inputRef={inputRef}\n              $singleLine={!multiline}\n              {...others}\n            />\n          </StyledInputListItem>\n        )}\n      </StyledTagsList>\n      {canShowSuggestions && (\n        <>\n          {hasSuggestions && (\n            <div\n              role=\"presentation\"\n              className={clsx(\n                tagsInputClasses.inputExtension,\n                classes?.inputExtension\n              )}\n            />\n          )}\n          <StyledSuggestions\n            id={setId(elementId, \"suggestions\")}\n            classes={{\n              root: clsx(\n                tagsInputClasses.suggestionsContainer,\n                classes?.suggestionsContainer\n              ),\n              list: clsx(\n                tagsInputClasses.suggestionList,\n                classes?.suggestionList\n              ),\n            }}\n            expanded={hasSuggestions}\n            anchorEl={containerRef?.current?.parentElement}\n            onClose={suggestionClearHandler}\n            onKeyDown={onSuggestionKeyDown}\n            onSuggestionSelected={suggestionSelectedHandler}\n            suggestionValues={suggestionValues}\n          />\n        </>\n      )}\n      {canShowError && (\n        <StyledError\n          id={setId(elementId, \"error\")}\n          disableBorder\n          className={clsx(tagsInputClasses.error, classes?.error)}\n        >\n          {validationMessage}\n        </StyledError>\n      )}\n    </StyledFormElement>\n  );\n};\n"],"names":["HvTagsInput","classes","className","id","name","value","valueProp","defaultValue","readOnly","disabled","required","label","textAreaLabel","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onAdd","onDelete","onBlur","onFocus","placeholder","hideCounter","middleCountLabel","maxTagsQuantity","autoFocus","resizable","inputProps","countCharProps","multiline","status","statusMessage","validationMessages","commitTagOn","commitOnBlur","suggestionListCallback","others","elementId","useUniqueId","hasLabel","hasDescription","setValue","useControlled","validationState","setValidationState","validationStates","standBy","validationMessage","setValidationMessage","tagInput","setTagInput","useState","tagCursorPos","setTagCursorPos","length","stateValid","setStateValid","inputRef","useRef","containerRef","skipReset","blurTimeout","materialInputRef","isTagSelected","hasCounter","suggestionValues","setSuggestionValues","isStateInvalid","useMemo","canShowSuggestions","hasSuggestions","errorMessages","DEFAULT_ERROR_MESSAGES","error","requiredError","minCharError","maxCharError","performValidation","useCallback","currValue","undefined","invalid","valid","deleteTag","tagPos","event","end","newTagsArr","slice","current","focus","addTag","tag","preventDefault","newTag","type","canShowError","useEffect","element","children","setTimeout","container","isNil","scrollLeft","offsetLeft","getBoundingClientRect","width","isMounted","useIsMounted","focusInput","getSuggestions","li","listEl","document","getElementById","setId","getElementsByTagName","suggestionClearHandler","suggestionHandler","val","suggestionsArray","suggestionSelectedHandler","item","onSuggestionKeyDown","isKeypress","keyboardCodes","Esc","Tab","onChangeHandler","_","input","onInputKeyDownHandler","includes","code","onKeyDownHandler","_a","onDeleteTagHandler","i","onContainerClickHandler","clearTimeout","onBlurHandler","evt","onFocusHandler","StyledFormElement","clsx","tagsInputClasses","root","StyledLabelContainer","labelContainer","_jsx","StyledLabel","htmlFor","StyledDescription","StyledCharCounter","characterCounter","separator","currentCharQuantity","maxCharQuantity","_jsxs","StyledTagsList","tagsList","singleLine","$disabled","$singleLine","$error","$resizable","$invalid","$readOnly","onKeyDown","onClick","ref","map","t","otherProps","StyledListItem","tabIndex","gutters","listItemGutters","listItemRoot","StyledTag","tagSelected","chipRoot","deleteButtonProps","$selected","StyledInputListItem","tagInputRootEmpty","tagInputContainerRoot","$isTagSelected","StyledInput","disableClear","tagInputRoot","inputBorderContainer","tagInputBorderContainer","inputRootFocused","tagInputRootFocused","_Fragment","role","inputExtension","StyledSuggestions","suggestionsContainer","list","suggestionList","expanded","anchorEl","parentElement","onClose","onSuggestionSelected","StyledError","disableBorder"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"TagsInput.styles.cjs","sources":["../../../../src/components/TagsInput/TagsInput.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport {\n  HvTag,\n  HvCharCounter,\n  HvFormElement,\n  HvInfoMessage,\n  HvInput,\n  HvLabel,\n  HvListContainer,\n  HvListItem,\n  HvSuggestions,\n  HvWarningText,\n  HvFormElementProps,\n  HvLabelProps,\n  HvInfoMessageProps,\n  HvCharCounterProps,\n  HvWarningTextProps,\n  HvListItemProps,\n  HvTagProps,\n  HvInputProps,\n  HvSuggestionsProps,\n} from \"@core/components\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { transientOptions } from \"@core/utils/transientOptions\";\nimport tagsInputClasses from \"./tagsInputClasses\";\nimport baseInputClasses from \"../BaseInput/baseInputClasses\";\nimport suggestionsClasses from \"../Forms/Suggestions/suggestionsClasses\";\nimport listItemClasses from \"../ListContainer/ListItem/listItemClasses\";\n\nexport const StyledFormElement = styled((props: HvFormElementProps) => (\n  <HvFormElement {...props} />\n))({\n  display: \"inline-block\",\n  width: \"100%\",\n});\n\nexport const StyledLabelContainer = styled(\"div\")({\n  float: \"left\",\n  display: \"flex\",\n  alignItems: \"flex-start\",\n});\n\nexport const StyledLabel = styled((props: HvLabelProps) => (\n  <HvLabel {...props} />\n))({\n  display: \"block\",\n  float: \"left\",\n  paddingBottom: \"6px\",\n});\n\nexport const StyledDescription = styled((props: HvInfoMessageProps) => (\n  <HvInfoMessage {...props} />\n))({\n  display: \"block\",\n  float: \"left\",\n});\n\nexport const StyledCharCounter = styled((props: HvCharCounterProps) => (\n  <HvCharCounter {...props} />\n))(() => ({\n  display: \"block\",\n  float: \"right\",\n  textAlign: \"right\",\n  marginBottom: \"6px\",\n}));\n\nexport const StyledTagsList = styled(\n  HvListContainer,\n  transientOptions\n)(\n  ({\n    $disabled,\n    $singleLine,\n    $error,\n    $resizable,\n    $invalid,\n    $readOnly,\n  }: {\n    $disabled: boolean;\n    $singleLine: boolean;\n    $error: boolean;\n    $resizable: boolean;\n    $invalid: boolean;\n    $readOnly: boolean;\n  }) => ({\n    display: \"flex\",\n    alignContent: \"flex-start\",\n    float: \"left\",\n    clear: \"both\",\n    width: \"100%\",\n    maxWidth: \"100%\",\n    height: \"32px\",\n    padding: 5,\n    overflow: \"auto\",\n    position: \"relative\",\n\n    flexDirection: \"row\",\n    flexWrap: \"wrap\",\n\n    backgroundColor: theme.colors.atmo1,\n    border: `1px solid ${theme.tagsInput.borderColor}`,\n    borderRadius: theme.radii.base,\n\n    \"&:hover\": {\n      cursor: \"text\",\n      border: `1px solid ${theme.tagsInput.hoverColor}`,\n    },\n\n    [`& .${baseInputClasses.inputRoot}`]: {\n      border: \"none\",\n    },\n\n    \"&:focus, &:focus-within, &:focus-visible\": {\n      outlineColor: \"#52A8EC\",\n      outlineStyle: \"solid\",\n      outlineWidth: \"0px\",\n      outlineOffset: \"-1px\",\n      boxShadow: \"0 0 0 1px #52A8EC, 0 0 0 4px rgba(29,155,209,.3)\",\n    },\n\n    ...($disabled && {\n      backgroundColor: theme.tagsInput.disabledBackgroundColor,\n      border: `1px solid ${theme.colors.atmo4}`,\n\n      \"&:focus-within, &:hover\": {\n        border: `1px solid ${theme.colors.atmo4}`,\n      },\n    }),\n\n    ...($readOnly && {\n      backgroundColor: theme.tagsInput.readOnlyBackgroundColor,\n      border: `1px solid ${theme.tagsInput.readOnlyBorderColor}`,\n      \"&:hover\": {\n        border: `1px solid ${theme.tagsInput.readOnlyBorderColor}`,\n      },\n    }),\n\n    ...($singleLine && {\n      overflowX: \"hidden\",\n      overflowY: \"hidden\",\n      height: 32,\n      display: \"table-row\",\n      paddingTop: 0,\n    }),\n\n    ...($error && {\n      border: `1px solid ${theme.colors.negative}`,\n    }),\n\n    ...($resizable && {\n      width: \"auto\",\n      resize: \"both\",\n      overflow: \"auto\",\n    }),\n\n    ...($invalid && {\n      border: `1px solid ${theme.colors.negative}!important`,\n    }),\n  })\n);\n\nexport const StyledError = styled((props: HvWarningTextProps) => (\n  <HvWarningText {...props} />\n))({\n  float: \"left\",\n});\n\nexport const StyledListItem = styled(\n  (props: HvListItemProps) => <HvListItem {...props} />,\n  transientOptions\n)(({ $singleLine }: { $singleLine: boolean }) => ({\n  marginBottom: 2,\n  height: 24,\n  lineHeight: \"24px\",\n  \"&:not(:last-child)\": {\n    marginBottom: 2,\n  },\n  [`&.${listItemClasses.gutters}`]: {\n    padding: \"0 5px\",\n  },\n  ...($singleLine && {\n    display: \"table-cell\",\n    paddingTop: \"2px!important\",\n  }),\n}));\n\nexport const StyledTag = styled(\n  (props: HvTagProps) => <HvTag {...props} />,\n  transientOptions\n)(({ $selected }: { $selected: boolean }) => ({\n  [`& .${tagsInputClasses.chipRoot}`]: {\n    maxWidth: \"none\",\n  },\n  ...($selected && {\n    outlineColor: \"#52A8EC\",\n    outlineStyle: \"solid\",\n    outlineWidth: \"0px\",\n    outlineOffset: \"-1px\",\n    boxShadow: \"0 0 0 1px #52A8EC, 0 0 0 4px rgba(29,155,209,.3)\",\n  }),\n}));\n\nexport const StyledInputListItem = styled(\n  (props: HvListItemProps) => <HvListItem {...props} />,\n  transientOptions\n)(\n  ({\n    $singleLine,\n    $isTagSelected,\n  }: {\n    $singleLine: boolean;\n    $isTagSelected: boolean;\n  }) => ({\n    display: \"flex\",\n    flexGrow: 1,\n    height: 24,\n    lineHeight: \"24px\",\n    [`&.${listItemClasses.gutters}`]: {\n      padding: \"0 5px\",\n    },\n    ...($singleLine && {\n      display: \"table-cell\",\n      minWidth: 100,\n      width: \"100%\",\n      paddingTop: \"3px!important\",\n      verticalAlign: \"middle\",\n    }),\n    ...($isTagSelected && {\n      [`& .${baseInputClasses.inputRoot}`]: {\n        backgroundColor: theme.colors.atmo1,\n      },\n    }),\n  })\n);\n\nexport const StyledInput = styled(\n  (props: HvInputProps) => <HvInput {...props} />,\n  transientOptions\n)(({ $singleLine }: { $singleLine: boolean }) => ({\n  [`& .${baseInputClasses.root}`]: {\n    width: \"100%\",\n    border: \"none\",\n    [`&:hover .${tagsInputClasses.tagInputBorderContainer}`]: {\n      background: \"none\",\n    },\n    [`&:hover .${tagsInputClasses.tagInputBorderContainer}`]: {\n      background: \"none\",\n    },\n  },\n  [`&& .${baseInputClasses.inputRoot}`]: {\n    marginLeft: 0,\n    marginRight: 0,\n    flex: \"1 1 auto\",\n    minWidth: 48,\n    height: 24,\n    lineHeight: \"24px\",\n    padding: 0,\n    border: \"none\",\n  },\n  [`& .${baseInputClasses.inputBorderContainer}`]: {\n    border: \"none\",\n    background: \"none\",\n  },\n  [`& .${baseInputClasses.inputRootFocused}`]: {\n    outline: \"none!important\",\n    boxShadow: \"none!important\",\n  },\n  [`& .${baseInputClasses.root} .${baseInputClasses.inputRootReadOnly}`]: {\n    backgroundColor: \"transparent \",\n    border: \"none\",\n    \"&:hover\": {\n      border: \"none\",\n    },\n  },\n  [`&& .${baseInputClasses.input}`]: {\n    marginLeft: 0,\n  },\n  ...($singleLine && {}),\n}));\n\nexport const StyledSuggestions = styled((props: HvSuggestionsProps) => (\n  <HvSuggestions {...props} />\n))({\n  width: \"100%\",\n  position: \"relative\",\n  top: 59,\n  [`& .${suggestionsClasses.root} .${suggestionsClasses.list} &`]: {\n    width: \"100%\",\n  },\n});\n"],"names":["StyledFormElement","_styled","props","HvFormElement","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledLabelContainer","StyledLabel","HvLabel","StyledDescription","HvInfoMessage","StyledCharCounter","HvCharCounter","display","float","textAlign","marginBottom","StyledTagsList","HvListContainer","_extends","transientOptions","$disabled","$singleLine","$error","$resizable","$invalid","$readOnly","alignContent","clear","width","maxWidth","height","padding","overflow","position","flexDirection","flexWrap","backgroundColor","theme","colors","atmo1","border","tagsInput","borderColor","borderRadius","radii","base","cursor","hoverColor","baseInputClasses","inputRoot","outlineColor","outlineStyle","outlineWidth","outlineOffset","boxShadow","disabledBackgroundColor","atmo4","readOnlyBackgroundColor","readOnlyBorderColor","overflowX","overflowY","paddingTop","negative","resize","StyledError","HvWarningText","StyledListItem","HvListItem","lineHeight","listItemClasses","gutters","StyledTag","HvTag","$selected","tagsInputClasses","chipRoot","StyledInputListItem","$isTagSelected","flexGrow","minWidth","verticalAlign","StyledInput","HvInput","root","tagInputBorderContainer","background","marginLeft","marginRight","flex","inputBorderContainer","inputRootFocused","outline","inputRootReadOnly","input","StyledSuggestions","HvSuggestions","top","suggestionsClasses","list"],"mappings":"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"}
+{"version":3,"file":"TagsInput.styles.cjs","sources":["../../../../src/components/TagsInput/TagsInput.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport {\n  HvTag,\n  HvCharCounter,\n  HvFormElement,\n  HvInfoMessage,\n  HvInput,\n  HvLabel,\n  HvListContainer,\n  HvListItem,\n  HvSuggestions,\n  HvWarningText,\n  HvFormElementProps,\n  HvLabelProps,\n  HvInfoMessageProps,\n  HvCharCounterProps,\n  HvWarningTextProps,\n  HvListItemProps,\n  HvTagProps,\n  HvInputProps,\n  HvSuggestionsProps,\n} from \"@core/components\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { transientOptions } from \"@core/utils/transientOptions\";\nimport tagsInputClasses from \"./tagsInputClasses\";\nimport baseInputClasses from \"../BaseInput/baseInputClasses\";\nimport suggestionsClasses from \"../Forms/Suggestions/suggestionsClasses\";\nimport listItemClasses from \"../ListContainer/ListItem/listItemClasses\";\n\nexport const StyledFormElement = styled((props: HvFormElementProps) => (\n  <HvFormElement {...props} />\n))({\n  display: \"inline-block\",\n  width: \"100%\",\n});\n\nexport const StyledLabelContainer = styled(\"div\")({\n  float: \"left\",\n  display: \"flex\",\n  alignItems: \"flex-start\",\n});\n\nexport const StyledLabel = styled((props: HvLabelProps) => (\n  <HvLabel {...props} />\n))({\n  display: \"block\",\n  float: \"left\",\n  paddingBottom: \"6px\",\n});\n\nexport const StyledDescription = styled((props: HvInfoMessageProps) => (\n  <HvInfoMessage {...props} />\n))({\n  display: \"block\",\n  float: \"left\",\n});\n\nexport const StyledCharCounter = styled((props: HvCharCounterProps) => (\n  <HvCharCounter {...props} />\n))(() => ({\n  display: \"block\",\n  float: \"right\",\n  textAlign: \"right\",\n  marginBottom: \"6px\",\n}));\n\nexport const StyledTagsList = styled(\n  HvListContainer,\n  transientOptions\n)(\n  ({\n    $disabled,\n    $singleLine,\n    $error,\n    $resizable,\n    $invalid,\n    $readOnly,\n  }: {\n    $disabled: boolean;\n    $singleLine: boolean;\n    $error: boolean;\n    $resizable: boolean;\n    $invalid: boolean;\n    $readOnly: boolean;\n  }) => ({\n    display: \"flex\",\n    alignContent: \"flex-start\",\n    float: \"left\",\n    clear: \"both\",\n    width: \"100%\",\n    maxWidth: \"100%\",\n    height: \"32px\",\n    padding: 5,\n    overflow: \"auto\",\n    position: \"relative\",\n\n    flexDirection: \"row\",\n    flexWrap: \"wrap\",\n\n    backgroundColor: theme.colors.atmo1,\n    border: `1px solid ${theme.tagsInput.borderColor}`,\n    borderRadius: theme.radii.base,\n\n    \"&:hover\": {\n      cursor: \"text\",\n      border: `1px solid ${theme.tagsInput.hoverColor}`,\n    },\n\n    [`& .${baseInputClasses.inputRoot}`]: {\n      border: \"none\",\n    },\n\n    \"&:focus, &:focus-within, &:focus-visible\": {\n      outlineColor: \"#52A8EC\",\n      outlineStyle: \"solid\",\n      outlineWidth: \"0px\",\n      outlineOffset: \"-1px\",\n      boxShadow: \"0 0 0 1px #52A8EC, 0 0 0 4px rgba(29,155,209,.3)\",\n    },\n\n    ...($disabled && {\n      backgroundColor: theme.tagsInput.disabledBackgroundColor,\n      border: `1px solid ${theme.colors.atmo4}`,\n\n      \"&:focus-within, &:hover\": {\n        border: `1px solid ${theme.colors.atmo4}`,\n      },\n    }),\n\n    ...($readOnly && {\n      backgroundColor: theme.tagsInput.readOnlyBackgroundColor,\n      border: `1px solid ${theme.tagsInput.readOnlyBorderColor}`,\n      \"&:hover\": {\n        border: `1px solid ${theme.tagsInput.readOnlyBorderColor}`,\n      },\n    }),\n\n    ...($singleLine && {\n      overflowX: \"hidden\",\n      overflowY: \"hidden\",\n      height: 32,\n      display: \"table-row\",\n      paddingTop: 0,\n    }),\n\n    ...($error && {\n      border: `1px solid ${theme.colors.negative}`,\n    }),\n\n    ...($resizable && {\n      width: \"auto\",\n      resize: \"both\",\n      overflow: \"auto\",\n    }),\n\n    ...($invalid && {\n      border: `1px solid ${theme.colors.negative}!important`,\n    }),\n  })\n);\n\nexport const StyledError = styled((props: HvWarningTextProps) => (\n  <HvWarningText {...props} />\n))({\n  float: \"left\",\n});\n\nexport const StyledListItem = styled(\n  (props: HvListItemProps) => <HvListItem {...props} />,\n  transientOptions\n)(({ $singleLine }: { $singleLine: boolean }) => ({\n  marginBottom: 2,\n  height: 24,\n  lineHeight: \"24px\",\n  \"&:not(:last-child)\": {\n    marginBottom: 2,\n  },\n  [`&.${listItemClasses.gutters}`]: {\n    padding: \"0 5px\",\n  },\n  ...($singleLine && {\n    display: \"table-cell\",\n    paddingTop: \"2px!important\",\n  }),\n}));\n\nexport const StyledTag = styled(\n  (props: HvTagProps) => <HvTag {...props} />,\n  transientOptions\n)(({ $selected }: { $selected: boolean }) => ({\n  [`& .${tagsInputClasses.chipRoot}`]: {\n    maxWidth: \"none\",\n  },\n  ...($selected && {\n    outlineColor: \"#52A8EC\",\n    outlineStyle: \"solid\",\n    outlineWidth: \"0px\",\n    outlineOffset: \"-1px\",\n    boxShadow: \"0 0 0 1px #52A8EC, 0 0 0 4px rgba(29,155,209,.3)\",\n  }),\n}));\n\nexport const StyledInputListItem = styled(\n  (props: HvListItemProps) => <HvListItem {...props} />,\n  transientOptions\n)(\n  ({\n    $singleLine,\n    $isTagSelected,\n  }: {\n    $singleLine: boolean;\n    $isTagSelected: boolean;\n  }) => ({\n    display: \"flex\",\n    flexGrow: 1,\n    height: 24,\n    lineHeight: \"24px\",\n    [`&.${listItemClasses.gutters}`]: {\n      padding: \"0 5px\",\n    },\n    ...($singleLine && {\n      display: \"table-cell\",\n      minWidth: 100,\n      width: \"100%\",\n      paddingTop: \"3px!important\",\n      verticalAlign: \"middle\",\n    }),\n    ...($isTagSelected && {\n      [`& .${baseInputClasses.inputRoot}`]: {\n        backgroundColor: theme.colors.atmo1,\n      },\n    }),\n  })\n);\n\nexport const StyledInput = styled(\n  (props: HvInputProps) => <HvInput {...props} />,\n  transientOptions\n)(({ $singleLine }: { $singleLine: boolean }) => ({\n  [`& .${baseInputClasses.root}`]: {\n    width: \"100%\",\n    border: \"none\",\n    [`&:hover .${tagsInputClasses.tagInputBorderContainer}`]: {\n      background: \"none\",\n    },\n    [`&:hover .${tagsInputClasses.tagInputBorderContainer}`]: {\n      background: \"none\",\n    },\n  },\n  [`&& .${baseInputClasses.inputRoot}`]: {\n    marginLeft: 0,\n    marginRight: 0,\n    flex: \"1 1 auto\",\n    minWidth: 48,\n    height: 24,\n    lineHeight: \"24px\",\n    padding: 0,\n    border: \"none\",\n  },\n  [`& .${baseInputClasses.inputBorderContainer}`]: {\n    border: \"none\",\n    background: \"none\",\n  },\n  [`& .${baseInputClasses.inputRootFocused}`]: {\n    outline: \"none!important\",\n    boxShadow: \"none!important\",\n  },\n  [`& .${baseInputClasses.root} .${baseInputClasses.inputRootReadOnly}`]: {\n    backgroundColor: \"transparent \",\n    border: \"none\",\n    \"&:hover\": {\n      border: \"none\",\n    },\n  },\n  [`&& .${baseInputClasses.input}`]: {\n    marginLeft: 0,\n  },\n  ...($singleLine && {}),\n}));\n\nexport const StyledSuggestions = styled((props: HvSuggestionsProps) => (\n  <HvSuggestions {...props} />\n))({\n  width: \"100%\",\n  position: \"relative\",\n  top: 59,\n  [`& .${suggestionsClasses.root} .${suggestionsClasses.list} &`]: {\n    width: \"100%\",\n  },\n});\n"],"names":["StyledFormElement","_styled","props","HvFormElement","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledLabelContainer","StyledLabel","HvLabel","StyledDescription","HvInfoMessage","StyledCharCounter","HvCharCounter","display","float","textAlign","marginBottom","StyledTagsList","HvListContainer","_extends","transientOptions","$disabled","$singleLine","$error","$resizable","$invalid","$readOnly","alignContent","clear","width","maxWidth","height","padding","overflow","position","flexDirection","flexWrap","backgroundColor","theme","colors","atmo1","border","tagsInput","borderColor","borderRadius","radii","base","cursor","hoverColor","baseInputClasses","inputRoot","outlineColor","outlineStyle","outlineWidth","outlineOffset","boxShadow","disabledBackgroundColor","atmo4","readOnlyBackgroundColor","readOnlyBorderColor","overflowX","overflowY","paddingTop","negative","resize","StyledError","HvWarningText","StyledListItem","HvListItem","lineHeight","listItemClasses","gutters","StyledTag","HvTag","$selected","tagsInputClasses","chipRoot","StyledInputListItem","$isTagSelected","flexGrow","minWidth","verticalAlign","StyledInput","HvInput","root","tagInputBorderContainer","background","marginLeft","marginRight","flex","inputBorderContainer","inputRootFocused","outline","inputRootReadOnly","input","StyledSuggestions","HvSuggestions","top","suggestionsClasses","list"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"TextArea.cjs","sources":["../../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["import { useControlled, useUniqueId } from \"@core/hooks\";\nimport validationStates, {\n  isInvalid,\n} from \"@core/components/Forms/FormElement/validationStates\";\nimport { clsx } from \"clsx\";\nimport { useCallback, useRef, useState, useMemo, useEffect } from \"react\";\nimport { setId } from \"@core/utils\";\nimport isNil from \"lodash/isNil\";\nimport { HvValidationMessages } from \"@core/types\";\nimport {\n  computeValidationMessage,\n  computeValidationState,\n  DEFAULT_ERROR_MESSAGES,\n  hasBuiltInValidations,\n  HvInputValidity,\n  validateInput,\n  validationTypes,\n} from \"../BaseInput/validations\";\nimport {\n  StyledBaseInput,\n  StyledCharCounter,\n  StyledFormElement,\n  StyledInfoMessage,\n  StyledLabel,\n  StyledLabelContainer,\n  StyledWarningText,\n} from \"./TextArea.styles\";\nimport { HvBaseInputProps } from \"../BaseInput\";\nimport { HvCharCounterProps, HvFormStatus } from \"../Forms\";\nimport textAreaClasses, { HvTextAreaClasses } from \"./textAreaClasses\";\n\nexport interface HvTextAreaProps\n  extends Omit<\n    HvBaseInputProps,\n    \"onChange\" | \"onBlur\" | \"rows\" | \"classes\" | \"onFocus\"\n  > {\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 = ({\n  id,\n  className,\n  classes,\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}: HvTextAreaProps) => {\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 inputRefOwn = useRef(null);\n\n  const inputRef = inputRefProp || inputRefOwn;\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    [\n      validationMessages?.error,\n      validationMessages?.requiredError,\n      validationMessages?.minCharError,\n      validationMessages?.maxCharError,\n    ]\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    isNil(maxCharQuantity) ? 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    <StyledFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={clsx(\n        textAreaClasses.root,\n        classes?.root,\n        className,\n        resizable && clsx(textAreaClasses.resizable, classes?.resizable),\n        disabled && clsx(textAreaClasses.disabled, classes?.disabled),\n        isStateInvalid && clsx(textAreaClasses.invalid, classes?.invalid)\n      )}\n      $resizable={resizable}\n      onBlur={onContainerBlurHandler}\n    >\n      {(hasLabel || hasDescription) && (\n        <StyledLabelContainer\n          className={clsx(\n            textAreaClasses.labelContainer,\n            classes?.labelContainer\n          )}\n        >\n          {hasLabel && (\n            <StyledLabel\n              className={clsx(textAreaClasses.label, classes?.label)}\n              id={setId(id, \"label\")}\n              htmlFor={setId(elementId, \"input\")}\n              label={label}\n            />\n          )}\n\n          {hasDescription && (\n            <StyledInfoMessage\n              className={clsx(\n                textAreaClasses.description,\n                classes?.description\n              )}\n              id={setId(elementId, \"description\")}\n            >\n              {description}\n            </StyledInfoMessage>\n          )}\n        </StyledLabelContainer>\n      )}\n\n      {hasCounter && (\n        <StyledCharCounter\n          id={setId(elementId, \"charCounter\")}\n          className={clsx(\n            textAreaClasses.characterCounter,\n            classes?.characterCounter\n          )}\n          separator={middleCountLabel}\n          currentCharQuantity={value.length}\n          maxCharQuantity={maxCharQuantity}\n          {...countCharProps}\n        />\n      )}\n\n      <StyledBaseInput\n        classes={{\n          root: clsx(textAreaClasses.baseInput, classes?.baseInput),\n          input: clsx(textAreaClasses.input, classes?.input),\n          inputResizable: clsx(\n            textAreaClasses.inputResizable,\n            classes?.inputResizable\n          ),\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={inputRef}\n        $resizable={resizable}\n        {...others}\n      />\n\n      {canShowError && (\n        <StyledWarningText\n          id={setId(elementId, \"error\")}\n          className={clsx(textAreaClasses.error, classes?.error)}\n          disableBorder\n        >\n          {validationMessage}\n        </StyledWarningText>\n      )}\n    </StyledFormElement>\n  );\n};\n"],"names":["HvTextArea","id","className","classes","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","elementId","useUniqueId","isDirty","useRef","inputRefOwn","focused","setFocused","useState","autoScrolling","setAutoScrolling","validationState","setValidationState","useControlled","validationStates","standBy","validationMessage","setValidationMessage","setValue","isStateInvalid","isInvalid","isEmptyValue","hasLabel","hasDescription","hasCounter","errorMessages","useMemo","DEFAULT_ERROR_MESSAGES","error","requiredError","minCharError","maxCharError","performValidation","useCallback","inputValidity","validateInput","current","validationTypes","none","computeValidationState","computeValidationMessage","isOverflow","currentValue","isNil","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","StyledFormElement","clsx","textAreaClasses","root","invalid","$resizable","children","StyledLabelContainer","labelContainer","_jsx","StyledLabel","htmlFor","StyledInfoMessage","StyledCharCounter","characterCounter","separator","currentCharQuantity","StyledBaseInput","baseInput","input","inputResizable","multiline","StyledWarningText","disableBorder"],"mappings":"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"}
+{"version":3,"file":"TextArea.cjs","sources":["../../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["import { useControlled, useUniqueId } from \"@core/hooks\";\nimport validationStates, {\n  isInvalid,\n} from \"@core/components/Forms/FormElement/validationStates\";\nimport { clsx } from \"clsx\";\nimport { useCallback, useRef, useState, useMemo, useEffect } from \"react\";\nimport { setId } from \"@core/utils\";\nimport isNil from \"lodash/isNil\";\nimport { HvValidationMessages } from \"@core/types\";\nimport {\n  computeValidationMessage,\n  computeValidationState,\n  DEFAULT_ERROR_MESSAGES,\n  hasBuiltInValidations,\n  HvInputValidity,\n  validateInput,\n  validationTypes,\n} from \"../BaseInput/validations\";\nimport {\n  StyledBaseInput,\n  StyledCharCounter,\n  StyledFormElement,\n  StyledInfoMessage,\n  StyledLabel,\n  StyledLabelContainer,\n  StyledWarningText,\n} from \"./TextArea.styles\";\nimport { HvBaseInputProps } from \"../BaseInput\";\nimport { HvCharCounterProps, HvFormStatus } from \"../Forms\";\nimport textAreaClasses, { HvTextAreaClasses } from \"./textAreaClasses\";\n\nexport interface HvTextAreaProps\n  extends Omit<\n    HvBaseInputProps,\n    \"onChange\" | \"onBlur\" | \"rows\" | \"classes\" | \"onFocus\"\n  > {\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 = ({\n  id,\n  className,\n  classes,\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}: HvTextAreaProps) => {\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 inputRefOwn = useRef(null);\n\n  const inputRef = inputRefProp || inputRefOwn;\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    [\n      validationMessages?.error,\n      validationMessages?.requiredError,\n      validationMessages?.minCharError,\n      validationMessages?.maxCharError,\n    ]\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    isNil(maxCharQuantity) ? 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    <StyledFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={clsx(\n        textAreaClasses.root,\n        classes?.root,\n        className,\n        resizable && clsx(textAreaClasses.resizable, classes?.resizable),\n        disabled && clsx(textAreaClasses.disabled, classes?.disabled),\n        isStateInvalid && clsx(textAreaClasses.invalid, classes?.invalid)\n      )}\n      $resizable={resizable}\n      onBlur={onContainerBlurHandler}\n    >\n      {(hasLabel || hasDescription) && (\n        <StyledLabelContainer\n          className={clsx(\n            textAreaClasses.labelContainer,\n            classes?.labelContainer\n          )}\n        >\n          {hasLabel && (\n            <StyledLabel\n              className={clsx(textAreaClasses.label, classes?.label)}\n              id={setId(id, \"label\")}\n              htmlFor={setId(elementId, \"input\")}\n              label={label}\n            />\n          )}\n\n          {hasDescription && (\n            <StyledInfoMessage\n              className={clsx(\n                textAreaClasses.description,\n                classes?.description\n              )}\n              id={setId(elementId, \"description\")}\n            >\n              {description}\n            </StyledInfoMessage>\n          )}\n        </StyledLabelContainer>\n      )}\n\n      {hasCounter && (\n        <StyledCharCounter\n          id={setId(elementId, \"charCounter\")}\n          className={clsx(\n            textAreaClasses.characterCounter,\n            classes?.characterCounter\n          )}\n          separator={middleCountLabel}\n          currentCharQuantity={value.length}\n          maxCharQuantity={maxCharQuantity}\n          {...countCharProps}\n        />\n      )}\n\n      <StyledBaseInput\n        classes={{\n          root: clsx(textAreaClasses.baseInput, classes?.baseInput),\n          input: clsx(textAreaClasses.input, classes?.input),\n          inputResizable: clsx(\n            textAreaClasses.inputResizable,\n            classes?.inputResizable\n          ),\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={inputRef}\n        $resizable={resizable}\n        {...others}\n      />\n\n      {canShowError && (\n        <StyledWarningText\n          id={setId(elementId, \"error\")}\n          className={clsx(textAreaClasses.error, classes?.error)}\n          disableBorder\n        >\n          {validationMessage}\n        </StyledWarningText>\n      )}\n    </StyledFormElement>\n  );\n};\n"],"names":["HvTextArea","id","className","classes","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","elementId","useUniqueId","isDirty","useRef","inputRefOwn","focused","setFocused","useState","autoScrolling","setAutoScrolling","validationState","setValidationState","useControlled","validationStates","standBy","validationMessage","setValidationMessage","setValue","isStateInvalid","isInvalid","isEmptyValue","hasLabel","hasDescription","hasCounter","errorMessages","useMemo","DEFAULT_ERROR_MESSAGES","error","requiredError","minCharError","maxCharError","performValidation","useCallback","inputValidity","validateInput","current","validationTypes","none","computeValidationState","computeValidationMessage","isOverflow","currentValue","isNil","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","StyledFormElement","clsx","textAreaClasses","root","invalid","$resizable","children","StyledLabelContainer","labelContainer","_jsx","StyledLabel","htmlFor","StyledInfoMessage","StyledCharCounter","characterCounter","separator","currentCharQuantity","StyledBaseInput","baseInput","input","inputResizable","multiline","StyledWarningText","disableBorder"],"mappings":"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"}

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 styled from \"@emotion/styled\";\nimport {\n  HvBaseInput,\n  HvBaseInputProps,\n  HvCharCounter,\n  HvCharCounterProps,\n  HvFormElement,\n  HvFormElementProps,\n  HvInfoMessage,\n  HvInfoMessageProps,\n  HvLabel,\n  HvLabelProps,\n  HvWarningText,\n  HvWarningTextProps,\n} from \"@core/components\";\nimport { transientOptions } from \"@core/utils/transientOptions\";\n\nexport const StyledFormElement = styled(\n  (props: HvFormElementProps) => <HvFormElement {...props} />,\n  transientOptions\n)(({ $resizable }: { $resizable: boolean }) => ({\n  display: \"inline-block\",\n  width: \"100%\",\n\n  ...($resizable && { width: \"100%\" }),\n}));\n\nexport const StyledLabelContainer = styled(\"div\")({\n  float: \"left\",\n  display: \"flex\",\n  alignItems: \"flex-start\",\n});\n\nexport const StyledLabel = styled((props: HvLabelProps) => (\n  <HvLabel {...props} />\n))({\n  display: \"block\",\n  float: \"left\",\n  paddingBottom: \"6px\",\n});\n\nexport const StyledInfoMessage = styled((props: HvInfoMessageProps) => (\n  <HvInfoMessage {...props} />\n))({\n  display: \"block\",\n  float: \"left\",\n});\n\nexport const StyledCharCounter = styled((props: HvCharCounterProps) => (\n  <HvCharCounter {...props} />\n))({\n  display: \"block\",\n  float: \"right\",\n  textAlign: \"right\",\n  marginBottom: \"6px\",\n});\n\nexport const StyledWarningText = styled((props: HvWarningTextProps) => (\n  <HvWarningText {...props} />\n))({ float: \"left\" });\n\nexport const StyledBaseInput = styled(\n  (props: HvBaseInputProps) => <HvBaseInput {...props} />,\n  transientOptions\n)(({ $resizable }: { $resizable: boolean }) => ({\n  clear: \"both\",\n  float: \"left\",\n\n  ...($resizable && {\n    width: \"100%\",\n    resize: \"both\",\n  }),\n}));\n"],"names":["StyledFormElement","_styled","props","HvFormElement","process","env","NODE_ENV","_extends","target","transientOptions","label","$resizable","display","width","StyledLabelContainer","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledLabel","HvLabel","StyledInfoMessage","HvInfoMessage","StyledCharCounter","HvCharCounter","StyledWarningText","HvWarningText","StyledBaseInput","HvBaseInput","clear","float","resize"],"mappings":"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"}
+{"version":3,"file":"TextArea.styles.cjs","sources":["../../../../src/components/TextArea/TextArea.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport {\n  HvBaseInput,\n  HvBaseInputProps,\n  HvCharCounter,\n  HvCharCounterProps,\n  HvFormElement,\n  HvFormElementProps,\n  HvInfoMessage,\n  HvInfoMessageProps,\n  HvLabel,\n  HvLabelProps,\n  HvWarningText,\n  HvWarningTextProps,\n} from \"@core/components\";\nimport { transientOptions } from \"@core/utils/transientOptions\";\n\nexport const StyledFormElement = styled(\n  (props: HvFormElementProps) => <HvFormElement {...props} />,\n  transientOptions\n)(({ $resizable }: { $resizable: boolean }) => ({\n  display: \"inline-block\",\n  width: \"100%\",\n\n  ...($resizable && { width: \"100%\" }),\n}));\n\nexport const StyledLabelContainer = styled(\"div\")({\n  float: \"left\",\n  display: \"flex\",\n  alignItems: \"flex-start\",\n});\n\nexport const StyledLabel = styled((props: HvLabelProps) => (\n  <HvLabel {...props} />\n))({\n  display: \"block\",\n  float: \"left\",\n  paddingBottom: \"6px\",\n});\n\nexport const StyledInfoMessage = styled((props: HvInfoMessageProps) => (\n  <HvInfoMessage {...props} />\n))({\n  display: \"block\",\n  float: \"left\",\n});\n\nexport const StyledCharCounter = styled((props: HvCharCounterProps) => (\n  <HvCharCounter {...props} />\n))({\n  display: \"block\",\n  float: \"right\",\n  textAlign: \"right\",\n  marginBottom: \"6px\",\n});\n\nexport const StyledWarningText = styled((props: HvWarningTextProps) => (\n  <HvWarningText {...props} />\n))({ float: \"left\" });\n\nexport const StyledBaseInput = styled(\n  (props: HvBaseInputProps) => <HvBaseInput {...props} />,\n  transientOptions\n)(({ $resizable }: { $resizable: boolean }) => ({\n  clear: \"both\",\n  float: \"left\",\n\n  ...($resizable && {\n    width: \"100%\",\n    resize: \"both\",\n  }),\n}));\n"],"names":["StyledFormElement","_styled","props","HvFormElement","process","env","NODE_ENV","_extends","target","transientOptions","label","$resizable","display","width","StyledLabelContainer","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledLabel","HvLabel","StyledInfoMessage","HvInfoMessage","StyledCharCounter","HvCharCounter","StyledWarningText","HvWarningText","StyledBaseInput","HvBaseInput","clear","float","resize"],"mappings":"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"}

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

@@ -25,11 +25,9 @@ const HvTimeAgo = ({
     disableRefresh,
     showSeconds
   });
-  if (justText && timestamp)
-    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
-      children: timeAgo
-    });
-  return /* @__PURE__ */ jsxRuntime.jsx(Component, {
+  return justText && timestamp ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: "timeAgo"
+  }) : /* @__PURE__ */ jsxRuntime.jsx(Component, {
     className: clsx.clsx(classes == null ? void 0 : classes.root, timeAgoClasses.default.root),
     ...others,
     children: !timestamp ? emptyElement : timeAgo

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

@@ -1 +1 @@
-{"version":3,"file":"TimeAgo.cjs","sources":["../../../../src/components/TimeAgo/TimeAgo.tsx"],"sourcesContent":["import { HvTypography } from \"@core/components\";\nimport { HvBaseProps } from \"@core/types\";\nimport { clsx } from \"clsx\";\nimport isEmpty from \"lodash/isEmpty\";\nimport timeAgoClasses, { HvTimeAgoClasses } from \"./timeAgoClasses\";\nimport useTimeAgo from \"./useTimeAgo\";\n\nexport interface HvTimeAgoProps extends HvBaseProps<HTMLElement, \"children\"> {\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 component used for the root node. Either a string to use a HTML element or a component.\n   * Defaults to `HvTypography`.\n   */\n  component?: React.ElementType<React.HTMLAttributes<HTMLElement>>;\n  /**\n   * The element to render when the timestamp is null or 0\n   * Defaults to `—` (Em Dash)\n   */\n  emptyElement?: React.ReactNode;\n  /**\n   * Disables periodic date refreshes\n   */\n  disableRefresh?: boolean;\n  /**\n   * Whether to show seconds in the rendered time\n   */\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 * The HvTimeAgo component implements the Design System relative time format guidelines.\n */\nexport const HvTimeAgo = ({\n  classes,\n  timestamp,\n  locale: localeProp = \"en\",\n  component: Component = HvTypography,\n  emptyElement = \"—\",\n  disableRefresh = false,\n  showSeconds = false,\n  justText = false,\n  ...others\n}: HvTimeAgoProps) => {\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 className={clsx(classes?.root, timeAgoClasses.root)} {...others}>\n      {!timestamp ? emptyElement : timeAgo}\n    </Component>\n  );\n};\n"],"names":["HvTimeAgo","classes","timestamp","locale","localeProp","component","Component","HvTypography","emptyElement","disableRefresh","showSeconds","justText","others","isEmpty","timeAgo","useTimeAgo","_Fragment","children","className","clsx","root","timeAgoClasses"],"mappings":";;;;;;;;;;AAgDO,MAAMA,YAAYA,CAAC;AAAA,EACxBC;AAAAA,EACAC;AAAAA,EACAC,QAAQC,aAAa;AAAA,EACrBC,WAAWC,YAAYC,WAAAA;AAAAA,EACvBC,eAAe;AAAA,EACfC,iBAAiB;AAAA,EACjBC,cAAc;AAAA,EACdC,WAAW;AAAA,EACX,GAAGC;AACW,MAAM;AACpB,QAAMT,SAASU,iBAAAA,QAAQT,UAAU,IAAI,OAAOA;AACtCU,QAAAA,UAAUC,mBAAWb,WAAW;AAAA,IACpCC;AAAAA,IACAM;AAAAA,IACAC;AAAAA,EAAAA,CACD;AAGD,MAAIC,YAAYT;AAAW,0CAAOc,WAAAA,UAAA;AAAA,MAAAC,UAAGH;AAAAA,IAAAA,CAAW;AAEhD,wCACGR,WAAS;AAAA,IAACY,WAAWC,KAAAA,KAAKlB,mCAASmB,MAAMC,eAAAA,QAAeD,IAAI;AAAA,IAAE,GAAKR;AAAAA,IAAMK,UACvE,CAACf,YAAYM,eAAeM;AAAAA,EAAAA,CACnB;AAEhB;;"}
+{"version":3,"file":"TimeAgo.cjs","sources":["../../../../src/components/TimeAgo/TimeAgo.tsx"],"sourcesContent":["import { HvTypography } from \"@core/components\";\nimport { HvBaseProps } from \"@core/types\";\nimport { clsx } from \"clsx\";\nimport isEmpty from \"lodash/isEmpty\";\nimport timeAgoClasses, { HvTimeAgoClasses } from \"./timeAgoClasses\";\nimport useTimeAgo from \"./useTimeAgo\";\n\nexport interface HvTimeAgoProps extends HvBaseProps<HTMLElement, \"children\"> {\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 component used for the root node. Either a string to use a HTML element or a component.\n   * Defaults to `HvTypography`.\n   */\n  component?: React.ElementType<React.HTMLAttributes<HTMLElement>>;\n  /**\n   * The element to render when the timestamp is null or 0\n   * Defaults to `—` (Em Dash)\n   */\n  emptyElement?: React.ReactNode;\n  /**\n   * Disables periodic date refreshes\n   */\n  disableRefresh?: boolean;\n  /**\n   * Whether to show seconds in the rendered time\n   */\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 * The HvTimeAgo component implements the Design System relative time format guidelines.\n */\nexport const HvTimeAgo = ({\n  classes,\n  timestamp,\n  locale: localeProp = \"en\",\n  component: Component = HvTypography,\n  emptyElement = \"—\",\n  disableRefresh = false,\n  showSeconds = false,\n  justText = false,\n  ...others\n}: HvTimeAgoProps) => {\n  const locale = isEmpty(localeProp) ? \"en\" : localeProp;\n  const timeAgo = useTimeAgo(timestamp, {\n    locale,\n    disableRefresh,\n    showSeconds,\n  });\n\n  return justText && timestamp ? (\n    <>timeAgo</>\n  ) : (\n    <Component className={clsx(classes?.root, timeAgoClasses.root)} {...others}>\n      {!timestamp ? emptyElement : timeAgo}\n    </Component>\n  );\n};\n"],"names":["HvTimeAgo","classes","timestamp","locale","localeProp","component","Component","HvTypography","emptyElement","disableRefresh","showSeconds","justText","others","isEmpty","timeAgo","useTimeAgo","_jsx","_Fragment","children","className","clsx","root","timeAgoClasses"],"mappings":";;;;;;;;;;AAgDO,MAAMA,YAAYA,CAAC;AAAA,EACxBC;AAAAA,EACAC;AAAAA,EACAC,QAAQC,aAAa;AAAA,EACrBC,WAAWC,YAAYC,WAAAA;AAAAA,EACvBC,eAAe;AAAA,EACfC,iBAAiB;AAAA,EACjBC,cAAc;AAAA,EACdC,WAAW;AAAA,EACX,GAAGC;AACW,MAAM;AACpB,QAAMT,SAASU,iBAAAA,QAAQT,UAAU,IAAI,OAAOA;AACtCU,QAAAA,UAAUC,mBAAWb,WAAW;AAAA,IACpCC;AAAAA,IACAM;AAAAA,IACAC;AAAAA,EAAAA,CACD;AAEMC,SAAAA,YAAYT,YACjBc,2BAAAA,IAAAC,qBAAA;AAAA,IAAAC,UAAE;AAAA,EAAA,CAAS,IAEXF,2BAAAA,IAACV,WAAS;AAAA,IAACa,WAAWC,KAAAA,KAAKnB,mCAASoB,MAAMC,eAAAA,QAAeD,IAAI;AAAA,IAAE,GAAKT;AAAAA,IAAMM,UACvE,CAAChB,YAAYM,eAAeM;AAAAA,EAAAA,CACpB;AAEf;;"}

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":["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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"}

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

@@ -0,0 +1,70 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const datepicker = require("@react-aria/datepicker");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const getDateValue = (date) => {
+  if (!date)
+    return "";
+  const {
+    hour,
+    minute,
+    second
+  } = date;
+  return [hour, minute, second].map((el) => String(el).padStart(2, "0")).join(":");
+};
+const PlaceholderSegment = ({
+  segment,
+  state,
+  placeholder
+}) => {
+  const ref = React.useRef(null);
+  const {
+    segmentProps
+  } = datepicker.useDateSegment(segment, state, ref);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", {
+    ref,
+    ...segmentProps,
+    children: (() => {
+      if (segment.type === "literal")
+        return segment.text;
+      if (segment.isPlaceholder)
+        return placeholder ?? segment.text;
+      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 == null ? void 0 : 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