@hitachivantara/uikit-react-core 5.32.0 → 5.33.0

package/dist/esm/components/Input/Input.js

@@ -35,16 +35,14 @@ function eventTargetIsInsideContainer(container, event) {
   return container != null && container.contains(getFocusedElement(event));
 }
 const changeInputValue = (input, value = "") => {
-  var _a;
   const event = new Event("input", {
     bubbles: true
   });
-  const setInputValue = (_a = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")) == null ? void 0 : _a.set;
-  setInputValue == null ? void 0 : setInputValue.call(input, value);
-  input == null ? void 0 : input.dispatchEvent(event);
+  const setInputValue = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set;
+  setInputValue?.call(input, value);
+  input?.dispatchEvent(event);
 };
 const HvInput = forwardRef((props, ref) => {
-  var _a;
   const {
     classes: classesProp,
     className,
@@ -107,7 +105,7 @@ const HvInput = forwardRef((props, ref) => {
       ...validationMessages
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [validationMessages == null ? void 0 : validationMessages.error, validationMessages == null ? void 0 : validationMessages.requiredError, validationMessages == null ? void 0 : validationMessages.minCharError, validationMessages == null ? void 0 : validationMessages.maxCharError, validationMessages == null ? void 0 : validationMessages.typeMismatchError]
+    [validationMessages?.error, validationMessages?.requiredError, validationMessages?.minCharError, validationMessages?.maxCharError, validationMessages?.typeMismatchError]
   );
   const validationType = useMemo(() => computeValidationType(type), [type]);
   const performValidation = useCallback(() => {
@@ -134,8 +132,7 @@ const HvInput = forwardRef((props, ref) => {
   const hasLabel = label != null;
   const hasDescription = description != null;
   const focusInput = () => {
-    var _a2;
-    (_a2 = inputRef.current) == null ? void 0 : _a2.focus();
+    inputRef.current?.focus();
   };
   const isMounted = useIsMounted();
   const suggestionClearHandler = () => {
@@ -144,9 +141,8 @@ const HvInput = forwardRef((props, ref) => {
     }
   };
   const suggestionHandler = (val) => {
-    var _a2;
-    const suggestionsArray = suggestionListCallback == null ? void 0 : suggestionListCallback(val);
-    if ((_a2 = suggestionsArray == null ? void 0 : suggestionsArray[0]) == null ? void 0 : _a2.label) {
+    const suggestionsArray = suggestionListCallback?.(val);
+    if (suggestionsArray?.[0]?.label) {
       setSuggestionValues(suggestionsArray);
     } else {
       suggestionClearHandler();
@@ -158,13 +154,13 @@ const HvInput = forwardRef((props, ref) => {
     focusInput();
     suggestionClearHandler();
     if (type === "search") {
-      onEnter == null ? void 0 : onEnter(event, newValue);
+      onEnter?.(event, newValue);
     }
   };
   const onChangeHandler = (event, newValue) => {
     isDirty.current = true;
     setValue(newValue);
-    onChange == null ? void 0 : onChange(event, newValue);
+    onChange?.(event, newValue);
     if (canShowSuggestions) {
       suggestionHandler(newValue);
     }
@@ -174,17 +170,16 @@ const HvInput = forwardRef((props, ref) => {
       return;
     setFocused(false);
     const inputValidity = performValidation();
-    onBlur == null ? void 0 : onBlur(event, value, inputValidity);
+    onBlur?.(event, value, inputValidity);
   };
   const onFocusHandler = (event) => {
     setFocused(true);
     setValidationState(validationState.standBy);
-    onFocus == null ? void 0 : onFocus(event, value);
+    onFocus?.(event, value);
   };
   const getSuggestions = (li) => {
-    var _a2;
     const listEl = document.getElementById(setId(elementId, "suggestions-list") || "");
-    return li != null ? (_a2 = listEl == null ? void 0 : listEl.getElementsByTagName("li")) == null ? void 0 : _a2[li] : listEl;
+    return li != null ? listEl?.getElementsByTagName("li")?.[li] : listEl;
   };
   const onSuggestionKeyDown = (event) => {
     if (isKey(event, "Esc")) {
@@ -197,17 +192,17 @@ const HvInput = forwardRef((props, ref) => {
   const onKeyDownHandler = (event) => {
     if (isKey(event, "ArrowDown") && hasSuggestions) {
       const li = getSuggestions(0);
-      li == null ? void 0 : li.focus();
+      li?.focus();
     } else if (isKey(event, "Enter")) {
-      onEnter == null ? void 0 : onEnter(event, value);
+      onEnter?.(event, value);
     }
-    onKeyDown == null ? void 0 : onKeyDown(event, value);
+    onKeyDown?.(event, value);
   };
   const onContainerBlurHandler = (event) => {
     if (event.relatedTarget) {
       setTimeout(() => {
         const list = getSuggestions(null);
-        if (!(list == null ? void 0 : list.contains(document.activeElement)))
+        if (!list?.contains(document.activeElement))
           suggestionClearHandler();
       }, 10);
     }
@@ -232,22 +227,22 @@ const HvInput = forwardRef((props, ref) => {
           [classes.iconClear]: !showSearchIcon
         }),
         onClick: handleClear,
-        "aria-label": labels == null ? void 0 : labels.clearButtonLabel,
+        "aria-label": labels?.clearButtonLabel,
         "aria-controls": setId(elementId, "input"),
         icon: /* @__PURE__ */ jsx(CloseXS, {})
       }
     );
-  }, [showClear, classes.adornmentButton, classes.iconClear, showSearchIcon, handleClear, labels == null ? void 0 : labels.clearButtonLabel, elementId, cx]);
+  }, [showClear, classes.adornmentButton, classes.iconClear, showSearchIcon, handleClear, labels?.clearButtonLabel, elementId, cx]);
   const handleSearch = useCallback((event) => {
-    onEnter == null ? void 0 : onEnter(event, value);
+    onEnter?.(event, value);
   }, [onEnter, value]);
   const searchButton = useMemo(() => {
     const reallyShowIt = showSearchIcon && (isEmptyValue || hasOnEnter && validationState$1 === validationState.standBy);
     if (!reallyShowIt) {
       return null;
     }
-    return /* @__PURE__ */ jsx(HvAdornment, { className: classes.adornmentButton, onClick: hasOnEnter ? handleSearch : void 0, "aria-label": labels == null ? void 0 : labels.searchButtonLabel, icon: /* @__PURE__ */ jsx(Search, {}) });
-  }, [showSearchIcon, isEmptyValue, hasOnEnter, validationState$1, classes.adornmentButton, handleSearch, labels == null ? void 0 : labels.searchButtonLabel]);
+    return /* @__PURE__ */ jsx(HvAdornment, { className: classes.adornmentButton, onClick: hasOnEnter ? handleSearch : void 0, "aria-label": labels?.searchButtonLabel, icon: /* @__PURE__ */ jsx(Search, {}) });
+  }, [showSearchIcon, isEmptyValue, hasOnEnter, validationState$1, classes.adornmentButton, handleSearch, labels?.searchButtonLabel]);
   const handleRevealPassword = useCallback(() => {
     setRevealPassword(!revealPassword);
   }, [revealPassword]);
@@ -255,8 +250,8 @@ const HvInput = forwardRef((props, ref) => {
     if (!showRevealPasswordButton) {
       return null;
     }
-    return /* @__PURE__ */ jsx(HvTooltip, { disableFocusListener: true, disableTouchListener: true, title: /* @__PURE__ */ jsx(HvTypography, { children: revealPassword ? labels == null ? void 0 : labels.revealPasswordButtonClickToHideTooltip : labels == null ? void 0 : labels.revealPasswordButtonClickToShowTooltip }), children: /* @__PURE__ */ jsx(HvAdornment, { className: classes.adornmentButton, onClick: handleRevealPassword, "aria-label": labels == null ? void 0 : labels.revealPasswordButtonLabel, "aria-controls": setId(elementId, "input"), icon: revealPassword ? /* @__PURE__ */ jsx(PreviewOff, {}) : /* @__PURE__ */ jsx(Preview, {}) }) });
-  }, [showRevealPasswordButton, revealPassword, labels == null ? void 0 : labels.revealPasswordButtonClickToHideTooltip, labels == null ? void 0 : labels.revealPasswordButtonClickToShowTooltip, labels == null ? void 0 : labels.revealPasswordButtonLabel, classes.adornmentButton, handleRevealPassword, elementId]);
+    return /* @__PURE__ */ jsx(HvTooltip, { disableFocusListener: true, disableTouchListener: true, title: /* @__PURE__ */ jsx(HvTypography, { children: revealPassword ? labels?.revealPasswordButtonClickToHideTooltip : labels?.revealPasswordButtonClickToShowTooltip }), children: /* @__PURE__ */ jsx(HvAdornment, { className: classes.adornmentButton, onClick: handleRevealPassword, "aria-label": labels?.revealPasswordButtonLabel, "aria-controls": setId(elementId, "input"), icon: revealPassword ? /* @__PURE__ */ jsx(PreviewOff, {}) : /* @__PURE__ */ jsx(Preview, {}) }) });
+  }, [showRevealPasswordButton, revealPassword, labels?.revealPasswordButtonClickToHideTooltip, labels?.revealPasswordButtonClickToShowTooltip, labels?.revealPasswordButtonLabel, classes.adornmentButton, handleRevealPassword, elementId]);
   const validationIcon = useMemo(() => {
     if (!showValidationIcon) {
       return null;
@@ -317,7 +312,7 @@ const HvInput = forwardRef((props, ref) => {
       /* @__PURE__ */ jsx(HvSuggestions, { ref: suggestionsRef, id: setId(elementId, "suggestions"), classes: {
         root: classes.suggestionsContainer,
         list: classes.suggestionList
-      }, expanded: hasSuggestions, anchorEl: (_a = inputRef.current) == null ? void 0 : _a.parentElement, onClose: suggestionClearHandler, onKeyDown: onSuggestionKeyDown, onSuggestionSelected: suggestionSelectedHandler, suggestionValues })
+      }, expanded: hasSuggestions, anchorEl: inputRef.current?.parentElement, onClose: suggestionClearHandler, onKeyDown: onSuggestionKeyDown, onSuggestionSelected: suggestionSelectedHandler, suggestionValues })
     ] }),
     canShowError && /* @__PURE__ */ jsx(HvWarningText, { id: setId(elementId, "error"), disableBorder: true, className: classes.error, children: validationMessage })
   ] });

package/dist/esm/components/Input/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import React, {\n  HTMLInputTypeAttribute,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport {\n  InputBaseComponentProps as MuiInputBaseComponentProps,\n  useForkRef,\n} from \"@mui/material\";\n\nimport {\n  CloseXS,\n  PreviewOff,\n  Preview,\n  Search,\n  Success,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { isBrowser } from \"@core/utils/browser\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvInputLabels,\n  HvInputSuggestion,\n  HvValidationMessages,\n} from \"@core/types/forms\";\nimport { HvBaseProps, HvExtraProps } from \"@core/types/generic\";\nimport {\n  HvAdornment,\n  HvAdornmentProps,\n  HvFormElement,\n  HvFormElementProps,\n  HvFormStatus,\n  HvInfoMessage,\n  HvLabel,\n  HvSuggestion,\n  HvSuggestions,\n  HvSuggestionsProps,\n  HvWarningText,\n  isValid,\n  isInvalid,\n} from \"@core/components/Forms\";\nimport validationStates from \"@core/components/Forms/FormElement/validationStates\";\nimport { HvBaseInput, HvBaseInputProps } from \"@core/components/BaseInput\";\nimport {\n  DEFAULT_ERROR_MESSAGES,\n  computeValidationType,\n  hasBuiltInValidations,\n  validateInput,\n  computeValidationState,\n  computeValidationMessage,\n  HvInputValidity,\n} from \"@core/components/BaseInput/validations\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvTooltip } from \"@core/components/Tooltip\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useIsMounted } from \"@core/hooks/useIsMounted\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useLabels } from \"@core/hooks/useLabels\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { staticClasses, useClasses } from \"./Input.styles\";\n\nexport { staticClasses as inputClasses };\n\nexport type HvInputClasses = ExtractNames<typeof useClasses>;\n\ntype InputElement = HTMLInputElement | HTMLTextAreaElement;\n\nexport interface HvInputProps\n  extends HvBaseProps<\n    HTMLElement,\n    \"onChange\" | \"onBlur\" | \"onFocus\" | \"onKeyDown\" | \"color\"\n  > {\n  /** The form element name. */\n  name?: string;\n  /** The value of the form element. */\n  value?: string;\n  /** When uncontrolled, defines the initial input value. */\n  defaultValue?: string;\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be 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 user input is required on the form element. */\n  required?: boolean;\n  /**\n   * The status of the form element.\n   *\n   * Valid is correct, invalid is incorrect and standBy means no validations have run.\n   *\n   * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n   * or \"invalid\" after any change to `checked`, depending of the values of both `required` and `checked`.\n   */\n  status?: HvFormStatus;\n  /** The error message to show when `status` is \"invalid\". */\n  statusMessage?: string;\n  /**\n   * The function that will be executed onChange, allows modification of the input,\n   * it receives the value. If a new value should be presented it must returned it.\n   */\n  onChange?: HvBaseInputProps[\"onChange\"];\n  /**\n   * Callback called when the user submits the value by pressing Enter/Return.\n   *\n   * Also called when the search button is clicked (when type is \"search\").\n   */\n  onEnter?: (\n    event: React.KeyboardEvent<InputElement> | React.MouseEvent,\n    value: string\n  ) => void;\n  /**\n   * The function that will be executed onBlur, allows checking the validation state,\n   * it receives the value and the validation state.\n   */\n  onBlur?: (\n    event: React.FocusEvent<InputElement>,\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?: (event: React.FocusEvent<InputElement>, value: string) => void;\n  /**\n   * The function that will be executed onKeyDown, allows checking the value state,\n   * it receives the event and value.\n   */\n  onKeyDown?: (\n    event: React.KeyboardEvent<InputElement> | React.MouseEvent,\n    value: string\n  ) => void;\n  /** The input type. */\n  type?: HTMLInputTypeAttribute;\n  /** The placeholder value of the input. */\n  placeholder?: string;\n  /** Internal labels?. */\n  labels?: HvInputLabels & HvExtraProps;\n  /** An Object containing the various texts associated with the input. */\n  validationMessages?: HvValidationMessages;\n  /** Attributes applied to the input element. */\n  inputProps?: MuiInputBaseComponentProps;\n  /**\n   * Allows passing a ref to the underlying input\n   * @deprecated Use `ref` directly instead\n   * */\n  inputRef?: HvBaseInputProps[\"inputRef\"];\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) => HvInputSuggestion[] | null;\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  /** If `true` it should autofocus. */\n  autoFocus?: boolean;\n  /** If `true` the clear button is disabled. */\n  disableClear?: boolean;\n  /** If `true` the reveal password button is disabled. Valid only when type is \"password\". */\n  disableRevealPassword?: boolean;\n  /** If `true` the search button is disabled. Valid only when type is \"search\". */\n  disableSearchButton?: boolean;\n  /**\n   * If `true` the validation icon adornment is visible. Defaults to `false`.\n   *\n   * Currently, DS specifications define only a positive feedback icon;\n   * errors are signaled through the border style and by displaying the error message.\n   */\n  showValidationIcon?: boolean;\n  /** A custom icon to be added into the input. */\n  endAdornment?: React.ReactNode;\n  /** The maximum allowed length of the characters, if this value is null no check will be performed. */\n  maxCharQuantity?: number;\n  /** The minimum allowed length of the characters, if this value is null no check will be perform. */\n  minCharQuantity?: number;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvInputClasses;\n}\n\nconst DEFAULT_LABELS = {\n  clearButtonLabel: \"Clear the text\",\n  revealPasswordButtonLabel: \"Reveal password\",\n  revealPasswordButtonClickToShowTooltip: \"Click to show password.\",\n  revealPasswordButtonClickToHideTooltip: \"Click to hide password.\",\n  searchButtonLabel: \"Search\",\n};\n\n/**\n * Find the focused element onBlur.\n */\nconst getFocusedElement = (event) =>\n  isBrowser(\"ie\") ? document.activeElement : event.relatedTarget;\n\nfunction eventTargetIsInsideContainer(container, event) {\n  return container != null && container.contains(getFocusedElement(event));\n}\n\n/** Changes a given `input`'s `value`, triggering its `onChange` */\nconst changeInputValue = (input: HTMLInputElement | null, value = \"\") => {\n  const event = new Event(\"input\", { bubbles: true });\n\n  /** Original `input.value` setter (React overrides it). */\n  const setInputValue = Object.getOwnPropertyDescriptor(\n    window.HTMLInputElement.prototype,\n    \"value\"\n  )?.set;\n\n  setInputValue?.call(input, value);\n  input?.dispatchEvent(event);\n};\n\n/**\n * A text input box is a graphical control element intended to enable the user to input text information to be used by the software.\n */\nexport const HvInput = forwardRef<InputElement, HvInputProps>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    id,\n    name,\n    value: valueProp,\n    defaultValue = \"\",\n    required = false,\n    readOnly = false,\n    disabled = false,\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    description,\n    \"aria-describedby\": ariaDescribedBy,\n    onChange,\n    onEnter,\n    status,\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n    type = \"text\",\n    placeholder,\n    autoFocus = false,\n    labels: labelsProp,\n    validationMessages,\n    disableClear = false,\n    disableRevealPassword = false,\n    disableSearchButton = false,\n    endAdornment,\n    maxCharQuantity,\n    minCharQuantity,\n    validation,\n    showValidationIcon = false,\n    suggestionListCallback,\n    inputRef: inputRefProp,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    inputProps = {},\n    ...others\n  } = useDefaultProps(\"HvInput\", props);\n  const { classes, cx } = useClasses(classesProp);\n  const labels = useLabels(DEFAULT_LABELS, labelsProp);\n  const elementId = useUniqueId(id, \"hvinput\");\n\n  const inputRef = useRef<HTMLInputElement>(null);\n  const forkedRef = useForkRef(ref, inputRef, inputRefProp);\n  const suggestionsRef = useRef<HTMLElement>(null);\n\n  const [focused, setFocused] = useState(false);\n\n  // Signals that the user has manually edited the input value\n  const isDirty = useRef(false);\n\n  // Value related state\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n\n  const isEmptyValue = value == null || value === \"\";\n\n  // Validation related state\n  const [validationState, setValidationState] = useControlled(\n    status,\n    validationStates.standBy\n  );\n\n  const [validationMessage, setValidationMessage] = useControlled(\n    statusMessage,\n    \"\"\n  );\n\n  // validationMessages reference tends to change, as users will not memoize/useState for it;\n  // dependencies must be more explicit so we set\n  const errorMessages = useMemo(\n    () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [\n      validationMessages?.error,\n      validationMessages?.requiredError,\n      validationMessages?.minCharError,\n      validationMessages?.maxCharError,\n      validationMessages?.typeMismatchError,\n    ]\n  );\n\n  const validationType = useMemo(() => computeValidationType(type), [type]);\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      validationType,\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    isEmptyValue,\n    maxCharQuantity,\n    minCharQuantity,\n    required,\n    setValidationMessage,\n    setValidationState,\n    validation,\n    validationType,\n    value,\n  ]);\n\n  // The error message area will only be created if:\n  // - an external element that provides an error message isn't identified via aria-errormessage AND\n  //   - both status and statusMessage properties are being controlled OR\n  //   - status is uncontrolled and 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          validationType,\n          minCharQuantity,\n          maxCharQuantity,\n          validation,\n          inputProps\n        )));\n\n  const isStateInvalid = isInvalid(validationState);\n\n  // Input type related state\n  const [revealPassword, setRevealPassword] = useState(false);\n\n  const realType = useMemo(() => {\n    if (type === \"password\") {\n      return revealPassword ? \"text\" : \"password\";\n    }\n\n    if (type === \"search\") {\n      return \"search\";\n    }\n\n    return \"text\";\n  }, [revealPassword, type]);\n\n  // Suggestions related state\n  const [suggestionValues, setSuggestionValues] = useState<\n    HvSuggestion[] | null\n  >(null);\n\n  const canShowSuggestions = suggestionListCallback != null;\n  const hasSuggestions = !!suggestionValues;\n\n  // Miscellaneous state\n  const hasLabel = label != null;\n  const hasDescription = description != null;\n\n  /**\n   * Looks for the node that represent the input inside the material tree and focus it.\n   */\n  const focusInput = () => {\n    inputRef.current?.focus();\n  };\n\n  const isMounted = useIsMounted();\n\n  /**\n   * Clears the suggestion array.\n   */\n  const suggestionClearHandler = () => {\n    if (isMounted.current) {\n      setSuggestionValues(null);\n    }\n  };\n\n  /**\n   * Fills of the suggestion array.\n   */\n  const suggestionHandler = (val: string) => {\n    const suggestionsArray = suggestionListCallback?.(val);\n    if (suggestionsArray?.[0]?.label) {\n      setSuggestionValues(suggestionsArray);\n    } else {\n      suggestionClearHandler();\n    }\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    const newValue = item.value || item.label;\n\n    changeInputValue(inputRef.current, newValue);\n\n    focusInput();\n    suggestionClearHandler();\n\n    if (type === \"search\") {\n      // trigger the onEnter callback when the user selects an option in a search box\n      onEnter?.(event, newValue);\n    }\n  };\n\n  const onChangeHandler: HvBaseInputProps[\"onChange\"] = (event, newValue) => {\n    isDirty.current = true;\n\n    // set the input value (only when value is uncontrolled)\n    setValue(newValue);\n\n    onChange?.(event, newValue);\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(newValue);\n    }\n  };\n\n  /**\n   * Validates the input updating the state and modifying the info text, also executes\n   * the user provided onBlur passing the current validation status and value.\n   */\n  const onInputBlurHandler: HvBaseInputProps[\"onBlur\"] = (event) => {\n    // If the blur is executed when choosing an suggestion it should be ignored.\n    if (eventTargetIsInsideContainer(suggestionsRef.current, event)) return;\n\n    setFocused(false);\n\n    const inputValidity = performValidation();\n\n    onBlur?.(event, value, inputValidity);\n  };\n\n  /**\n   * Updates the state putting again the value from the state because the input value is\n   * not automatically manage, it also executes the onFocus function from the user passing the value\n   */\n  const onFocusHandler: HvBaseInputProps[\"onFocus\"] = (event) => {\n    setFocused(true);\n\n    // reset validation status to standBy (only when status is uncontrolled)\n    setValidationState(validationStates.standBy);\n\n    onFocus?.(event, value);\n  };\n\n  const getSuggestions = (li: number | null) => {\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\n  const onSuggestionKeyDown: HvSuggestionsProps[\"onKeyDown\"] = (event) => {\n    if (isKey(event, \"Esc\")) {\n      suggestionClearHandler();\n      focusInput();\n    } else if (isKey(event, \"Tab\")) {\n      suggestionClearHandler();\n    }\n  };\n\n  /** Focus the suggestion list when the arrow down is pressed. */\n  const onKeyDownHandler: HvBaseInputProps[\"onKeyDown\"] = (event) => {\n    if (isKey(event, \"ArrowDown\") && hasSuggestions) {\n      const li = getSuggestions(0);\n      li?.focus();\n    } else if (isKey(event, \"Enter\")) {\n      onEnter?.(event, value);\n    }\n\n    onKeyDown?.(event, value);\n  };\n\n  /** Clears the suggestion list on blur. */\n  const onContainerBlurHandler: HvFormElementProps[\"onBlur\"] = (event) => {\n    if (event.relatedTarget) {\n      setTimeout(() => {\n        const list = getSuggestions(null);\n        if (!list?.contains(document.activeElement)) suggestionClearHandler();\n      }, 10);\n    }\n  };\n\n  const hasOnEnter = onEnter != null;\n\n  // show the clear button only if the input is enabled, not read-only, disableClear is false and the input is not empty\n  // also, don't show it when the input type is \"search\" and the input is active (standBy)\n  const showClear =\n    !disabled &&\n    !readOnly &&\n    !disableClear &&\n    !isEmptyValue &&\n    (!hasOnEnter ||\n      type !== \"search\" ||\n      disableSearchButton ||\n      validationState !== validationStates.standBy);\n\n  const showSearchIcon = type === \"search\" && !disableSearchButton;\n\n  const showRevealPasswordButton =\n    type === \"password\" && !disableRevealPassword;\n\n  /**\n   * Clears the input value from the state and refocus the input.\n   */\n  const handleClear = useCallback(() => {\n    // reset validation status to standBy (only when status is uncontrolled)\n    setValidationState(validationStates.standBy);\n\n    changeInputValue(inputRef.current, \"\");\n\n    // we want to focus the input when clicked and not active\n    setTimeout(focusInput);\n  }, [setValidationState]);\n\n  const clearButton = useMemo(() => {\n    if (!showClear) {\n      return null;\n    }\n\n    return (\n      <HvAdornment\n        // Don't control visibility when the search icon is enabled\n        className={cx(classes.adornmentButton, {\n          [classes.iconClear]: !showSearchIcon,\n        })}\n        onClick={handleClear}\n        aria-label={labels?.clearButtonLabel}\n        aria-controls={setId(elementId, \"input\")}\n        icon={<CloseXS />}\n      />\n    );\n  }, [\n    showClear,\n    classes.adornmentButton,\n    classes.iconClear,\n    showSearchIcon,\n    handleClear,\n    labels?.clearButtonLabel,\n    elementId,\n    cx,\n  ]);\n\n  /**\n   * Calls the onEnter callback and refocus the input.\n   */\n  const handleSearch = useCallback<NonNullable<HvAdornmentProps[\"onClick\"]>>(\n    (event) => {\n      onEnter?.(event, value);\n    },\n    [onEnter, value]\n  );\n\n  const searchButton = useMemo(() => {\n    // If the search icon is not actionable, only show it when the input is empty or active\n    const reallyShowIt =\n      showSearchIcon &&\n      (isEmptyValue ||\n        (hasOnEnter && validationState === validationStates.standBy));\n\n    if (!reallyShowIt) {\n      return null;\n    }\n\n    return (\n      <HvAdornment\n        className={classes.adornmentButton}\n        onClick={hasOnEnter ? handleSearch : undefined}\n        aria-label={labels?.searchButtonLabel}\n        icon={<Search />}\n      />\n    );\n  }, [\n    showSearchIcon,\n    isEmptyValue,\n    hasOnEnter,\n    validationState,\n    classes.adornmentButton,\n    handleSearch,\n    labels?.searchButtonLabel,\n  ]);\n\n  /**\n   * Changes input type and refocus the input.\n   */\n  const handleRevealPassword = useCallback(() => {\n    setRevealPassword(!revealPassword);\n  }, [revealPassword]);\n\n  const revealPasswordButton = useMemo(() => {\n    if (!showRevealPasswordButton) {\n      return null;\n    }\n\n    return (\n      <HvTooltip\n        disableFocusListener\n        disableTouchListener\n        title={\n          <HvTypography>\n            {revealPassword\n              ? labels?.revealPasswordButtonClickToHideTooltip\n              : labels?.revealPasswordButtonClickToShowTooltip}\n          </HvTypography>\n        }\n      >\n        <HvAdornment\n          className={classes.adornmentButton}\n          onClick={handleRevealPassword}\n          aria-label={labels?.revealPasswordButtonLabel}\n          aria-controls={setId(elementId, \"input\")}\n          icon={revealPassword ? <PreviewOff /> : <Preview />}\n        />\n      </HvTooltip>\n    );\n  }, [\n    showRevealPasswordButton,\n    revealPassword,\n    labels?.revealPasswordButtonClickToHideTooltip,\n    labels?.revealPasswordButtonClickToShowTooltip,\n    labels?.revealPasswordButtonLabel,\n    classes.adornmentButton,\n    handleRevealPassword,\n    elementId,\n  ]);\n\n  const validationIcon = useMemo(() => {\n    if (!showValidationIcon) {\n      return null;\n    }\n\n    if (!isValid(validationState)) {\n      return null;\n    }\n\n    return <Success color=\"positive\" className={classes.icon} />;\n  }, [showValidationIcon, validationState, classes.icon]);\n\n  // useMemo to avoid repetitive cloning of the custom icon\n  const customIconEl = useMemo(\n    () =>\n      isValidElement(endAdornment) &&\n      React.cloneElement(endAdornment as React.ReactElement, {\n        className: cx(endAdornment.props.className, classes.icon),\n      }),\n    [classes.icon, endAdornment, cx]\n  );\n\n  const adornments = useMemo(() => {\n    if (\n      !clearButton &&\n      !revealPasswordButton &&\n      !searchButton &&\n      !validationIcon &&\n      !customIconEl\n    )\n      return null;\n\n    // note: specification implies that the custom icon should be hidden when\n    // a validation feedback icon is being shown.\n    return (\n      <div className={classes.adornmentsBox} aria-hidden=\"true\">\n        {clearButton}\n        {revealPasswordButton}\n        {searchButton}\n        {validationIcon || customIconEl}\n      </div>\n    );\n  }, [\n    classes.adornmentsBox,\n    clearButton,\n    customIconEl,\n    revealPasswordButton,\n    searchButton,\n    validationIcon,\n  ]);\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  const errorMessageId = isStateInvalid\n    ? canShowError\n      ? setId(elementId, \"error\")\n      : ariaErrorMessage\n    : undefined;\n\n  return (\n    <HvFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={cx(\n        classes.root,\n        {\n          [classes.hasSuggestions]: hasSuggestions,\n        },\n        className\n      )}\n      onBlur={onContainerBlurHandler}\n    >\n      {(hasLabel || hasDescription) && (\n        <div className={classes.labelContainer}>\n          {hasLabel && (\n            <HvLabel\n              id={setId(elementId, \"label\")}\n              className={classes.label}\n              htmlFor={setId(elementId, \"input\")}\n              label={label}\n            />\n          )}\n\n          {hasDescription && (\n            <HvInfoMessage\n              id={setId(elementId, \"description\")}\n              className={classes.description}\n            >\n              {description}\n            </HvInfoMessage>\n          )}\n        </div>\n      )}\n      <HvBaseInput\n        id={\n          hasLabel || showClear || showRevealPasswordButton\n            ? setId(elementId, \"input\")\n            : setId(id, \"input\")\n        }\n        name={name}\n        value={value}\n        required={required}\n        readOnly={readOnly}\n        disabled={disabled}\n        onChange={onChangeHandler}\n        autoFocus={autoFocus}\n        onKeyDown={onKeyDownHandler}\n        onBlur={onInputBlurHandler}\n        onFocus={onFocusHandler}\n        placeholder={placeholder}\n        type={realType}\n        classes={{\n          input: classes.input,\n          inputRoot: classes.inputRoot,\n          inputRootFocused: classes.inputRootFocused,\n          inputRootDisabled: classes.inputRootDisabled,\n          inputRootMultiline: classes.inputRootMultiline,\n          inputBorderContainer: classes.inputBorderContainer,\n        }}\n        invalid={isStateInvalid}\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\n              ? setId(elementId, \"description\")\n              : undefined,\n          \"aria-controls\": canShowSuggestions\n            ? setId(elementId, \"suggestions\")\n            : undefined,\n\n          ref: inputRef,\n\n          // prevent browsers auto-fill/suggestions when we have our own\n          autoComplete: canShowSuggestions ? \"off\" : undefined,\n\n          ...inputProps,\n        }}\n        inputRef={forkedRef}\n        endAdornment={adornments}\n        {...others}\n      />\n      {canShowSuggestions && (\n        <>\n          {hasSuggestions && (\n            <div role=\"presentation\" className={classes.inputExtension} />\n          )}\n          <HvSuggestions\n            ref={suggestionsRef}\n            id={setId(elementId, \"suggestions\")}\n            classes={{\n              root: classes.suggestionsContainer,\n              list: classes.suggestionList,\n            }}\n            expanded={hasSuggestions}\n            anchorEl={inputRef.current?.parentElement}\n            onClose={suggestionClearHandler}\n            onKeyDown={onSuggestionKeyDown}\n            onSuggestionSelected={suggestionSelectedHandler}\n            suggestionValues={suggestionValues}\n          />\n        </>\n      )}\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          disableBorder\n          className={classes.error}\n        >\n          {validationMessage}\n        </HvWarningText>\n      )}\n    </HvFormElement>\n  );\n});\n"],"names":["DEFAULT_LABELS","clearButtonLabel","revealPasswordButtonLabel","revealPasswordButtonClickToShowTooltip","revealPasswordButtonClickToHideTooltip","searchButtonLabel","getFocusedElement","event","isBrowser","document","activeElement","relatedTarget","eventTargetIsInsideContainer","container","contains","changeInputValue","input","value","Event","bubbles","setInputValue","Object","getOwnPropertyDescriptor","window","HTMLInputElement","prototype","set","call","dispatchEvent","HvInput","forwardRef","props","ref","classes","classesProp","className","id","name","valueProp","defaultValue","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onEnter","status","statusMessage","ariaErrorMessage","type","placeholder","autoFocus","labels","labelsProp","validationMessages","disableClear","disableRevealPassword","disableSearchButton","endAdornment","maxCharQuantity","minCharQuantity","validation","showValidationIcon","suggestionListCallback","inputRef","inputRefProp","onBlur","onFocus","onKeyDown","inputProps","others","useDefaultProps","cx","useClasses","useLabels","elementId","useUniqueId","useRef","forkedRef","useForkRef","suggestionsRef","focused","setFocused","useState","isDirty","setValue","useControlled","isEmptyValue","validationState","setValidationState","validationStates","standBy","validationMessage","setValidationMessage","errorMessages","useMemo","DEFAULT_ERROR_MESSAGES","error","requiredError","minCharError","maxCharError","typeMismatchError","validationType","computeValidationType","performValidation","useCallback","inputValidity","validateInput","current","computeValidationState","computeValidationMessage","canShowError","undefined","hasBuiltInValidations","isStateInvalid","isInvalid","revealPassword","setRevealPassword","realType","suggestionValues","setSuggestionValues","canShowSuggestions","hasSuggestions","hasLabel","hasDescription","focusInput","focus","isMounted","useIsMounted","suggestionClearHandler","suggestionHandler","val","suggestionsArray","suggestionSelectedHandler","item","newValue","onChangeHandler","onInputBlurHandler","onFocusHandler","getSuggestions","li","listEl","getElementById","setId","getElementsByTagName","onSuggestionKeyDown","isKey","onKeyDownHandler","onContainerBlurHandler","setTimeout","list","hasOnEnter","showClear","showSearchIcon","showRevealPasswordButton","handleClear","clearButton","adornmentButton","iconClear","handleSearch","searchButton","reallyShowIt","handleRevealPassword","revealPasswordButton","validationIcon","isValid","icon","customIconEl","isValidElement","React","cloneElement","adornments","adornmentsBox","useEffect","errorMessageId","root","labelContainer","inputRoot","inputRootFocused","inputRootDisabled","inputRootMultiline","inputBorderContainer","autoComplete","inputExtension","suggestionsContainer","suggestionList","parentElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAqMA,MAAMA,iBAAiB;AAAA,EACrBC,kBAAkB;AAAA,EAClBC,2BAA2B;AAAA,EAC3BC,wCAAwC;AAAA,EACxCC,wCAAwC;AAAA,EACxCC,mBAAmB;AACrB;AAKA,MAAMC,oBAAqBC,CACzBC,UAAAA,UAAU,IAAI,IAAIC,SAASC,gBAAgBH,MAAMI;AAEnD,SAASC,6BAA6BC,WAAWN,OAAO;AACtD,SAAOM,aAAa,QAAQA,UAAUC,SAASR,kBAAkBC,KAAK,CAAC;AACzE;AAGA,MAAMQ,mBAAmBA,CAACC,OAAgCC,QAAQ,OAAO;;AACjEV,QAAAA,QAAQ,IAAIW,MAAM,SAAS;AAAA,IAAEC,SAAS;AAAA,EAAA,CAAM;AAGlD,QAAMC,iBAAgBC,YAAOC,yBAC3BC,OAAOC,iBAAiBC,WACxB,OACF,MAHsBJ,mBAGnBK;AAEYC,iDAAAA,KAAKX,OAAOC;AAC3BD,iCAAOY,cAAcrB;AACvB;AAKO,MAAMsB,UAAUC,WAAuC,CAACC,OAAOC,QAAQ;;AACtE,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACApB,OAAOqB;AAAAA,IACPC,eAAe;AAAA,IACfC,WAAW;AAAA,IACXC,WAAW;AAAA,IACXC,WAAW;AAAA,IACXC;AAAAA,IACA,cAAcC;AAAAA,IACd,mBAAmBC;AAAAA,IACnBC;AAAAA,IACA,oBAAoBC;AAAAA,IACpBC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,qBAAqBC;AAAAA,IACrBC,OAAO;AAAA,IACPC;AAAAA,IACAC,YAAY;AAAA,IACZC,QAAQC;AAAAA,IACRC;AAAAA,IACAC,eAAe;AAAA,IACfC,wBAAwB;AAAA,IACxBC,sBAAsB;AAAA,IACtBC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,qBAAqB;AAAA,IACrBC;AAAAA,IACAC,UAAUC;AAAAA,IACVC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,aAAa,CAAC;AAAA,IACd,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,WAAW5C,KAAK;AAC9B,QAAA;AAAA,IAAEE;AAAAA,IAAS2C;AAAAA,EAAAA,IAAOC,WAAW3C,WAAW;AACxCsB,QAAAA,SAASsB,UAAU9E,gBAAgByD,UAAU;AAC7CsB,QAAAA,YAAYC,YAAY5C,IAAI,SAAS;AAErCgC,QAAAA,WAAWa,OAAyB,IAAI;AAC9C,QAAMC,YAAYC,WAAWnD,KAAKoC,UAAUC,YAAY;AAClDe,QAAAA,iBAAiBH,OAAoB,IAAI;AAE/C,QAAM,CAACI,SAASC,UAAU,IAAIC,SAAS,KAAK;AAGtCC,QAAAA,UAAUP,OAAO,KAAK;AAG5B,QAAM,CAAChE,OAAOwE,QAAQ,IAAIC,cAAcpD,WAAWC,YAAY;AAEzDoD,QAAAA,eAAe1E,SAAS,QAAQA,UAAU;AAGhD,QAAM,CAAC2E,mBAAiBC,kBAAkB,IAAIH,cAC5CxC,QACA4C,gBAAiBC,OACnB;AAEA,QAAM,CAACC,mBAAmBC,oBAAoB,IAAIP,cAChDvC,eACA,EACF;AAIA,QAAM+C,gBAAgBC;AAAAA,IACpB,OAAO;AAAA,MAAE,GAAGC;AAAAA,MAAwB,GAAG1C;AAAAA,IAAAA;AAAAA;AAAAA,IAEvC,CACEA,yDAAoB2C,OACpB3C,yDAAoB4C,eACpB5C,yDAAoB6C,cACpB7C,yDAAoB8C,cACpB9C,yDAAoB+C,iBAAiB;AAAA,EAAA;AAInCC,QAAAA,iBAAiBP,QAAQ,MAAMQ,sBAAsBtD,IAAI,GAAG,CAACA,IAAI,CAAC;AAIlEuD,QAAAA,oBAAoBC,YAAY,MAAM;AACpCC,UAAAA,gBAAgBC,cACpB3C,SAAS4C,SACT/F,OACAuB,UACAwB,iBACAD,iBACA2C,gBACAzC,UACF;AAGmBgD,uBAAAA,uBAAuBH,eAAenB,YAAY,CAAC;AAIpEuB,yBAAAA,yBAAyBJ,eAAeZ,aAAa,CACvD;AAEOY,WAAAA;AAAAA,EACN,GAAA,CACDZ,eACAP,cACA5B,iBACAC,iBACAxB,UACAyD,sBACAJ,oBACA5B,YACAyC,gBACAzF,KAAK,CACN;AAMD,QAAMkG,eACJ/D,oBAAoB,SAClBF,WAAWkE,UAAajE,kBAAkBiE,UACzClE,WAAWkE,UACVC,sBACE7E,UACAkE,gBACA1C,iBACAD,iBACAE,YACAQ,UACF;AAEA6C,QAAAA,iBAAiBC,UAAU3B,iBAAe;AAGhD,QAAM,CAAC4B,gBAAgBC,iBAAiB,IAAIlC,SAAS,KAAK;AAEpDmC,QAAAA,WAAWvB,QAAQ,MAAM;AAC7B,QAAI9C,SAAS,YAAY;AACvB,aAAOmE,iBAAiB,SAAS;AAAA,IACnC;AAEA,QAAInE,SAAS,UAAU;AACd,aAAA;AAAA,IACT;AAEO,WAAA;AAAA,EAAA,GACN,CAACmE,gBAAgBnE,IAAI,CAAC;AAGzB,QAAM,CAACsE,kBAAkBC,mBAAmB,IAAIrC,SAE9C,IAAI;AAEN,QAAMsC,qBAAqB1D,0BAA0B;AAC/C2D,QAAAA,iBAAiB,CAAC,CAACH;AAGzB,QAAMI,WAAWpF,SAAS;AAC1B,QAAMqF,iBAAiBlF,eAAe;AAKtC,QAAMmF,aAAaA,MAAM;;AACvB7D,KAAAA,MAAAA,SAAS4C,YAAT5C,gBAAAA,IAAkB8D;AAAAA,EAAM;AAG1B,QAAMC,YAAYC;AAKlB,QAAMC,yBAAyBA,MAAM;AACnC,QAAIF,UAAUnB,SAAS;AACrBY,0BAAoB,IAAI;AAAA,IAC1B;AAAA,EAAA;AAMIU,QAAAA,oBAAoBA,CAACC,QAAgB;;AACnCC,UAAAA,mBAAmBrE,iEAAyBoE;AAC9CC,SAAAA,MAAAA,qDAAmB,OAAnBA,gBAAAA,IAAuB7F,OAAO;AAChCiF,0BAAoBY,gBAAgB;AAAA,IAAA,OAC/B;AACkB;IACzB;AAAA,EAAA;AAMIC,QAAAA,4BAA4BA,CAAClI,OAAOmI,SAAS;AAC3CC,UAAAA,WAAWD,KAAKzH,SAASyH,KAAK/F;AAEnByB,qBAAAA,SAAS4C,SAAS2B,QAAQ;AAEhC;AACY;AAEvB,QAAItF,SAAS,UAAU;AAErBJ,yCAAU1C,OAAOoI;AAAAA,IACnB;AAAA,EAAA;AAGIC,QAAAA,kBAAgDA,CAACrI,OAAOoI,aAAa;AACzEnD,YAAQwB,UAAU;AAGlBvB,aAASkD,QAAQ;AAEjB3F,yCAAWzC,OAAOoI;AAElB,QAAId,oBAAoB;AAOtBS,wBAAkBK,QAAQ;AAAA,IAC5B;AAAA,EAAA;AAOF,QAAME,qBAAkDtI,CAAU,UAAA;AAE5DK,QAAAA,6BAA6BwE,eAAe4B,SAASzG,KAAK;AAAG;AAEjE+E,eAAW,KAAK;AAEhB,UAAMwB,gBAAgBF;AAEbrG,qCAAAA,OAAOU,OAAO6F;AAAAA,EAAa;AAOtC,QAAMgC,iBAA+CvI,CAAU,UAAA;AAC7D+E,eAAW,IAAI;AAGfO,uBAAmBC,gBAAiBC,OAAO;AAE3CxB,uCAAUhE,OAAOU;AAAAA,EAAK;AAGlB8H,QAAAA,iBAAiBA,CAACC,OAAsB;;AAE5C,UAAMC,SAASxI,SAASyI,eACtBC,MAAMpE,WAAW,kBAAkB,KAAK,EAC1C;AACA,WAAOiE,MAAM,QAAOC,MAAAA,iCAAQG,qBAAqB,UAA7BH,gBAAAA,IAAqCD,MAAMC;AAAAA,EAAAA;AAGjE,QAAMI,sBAAwD9I,CAAU,UAAA;AAClE+I,QAAAA,MAAM/I,OAAO,KAAK,GAAG;AACA;AACZ;IACF+I,WAAAA,MAAM/I,OAAO,KAAK,GAAG;AACP;IACzB;AAAA,EAAA;AAIF,QAAMgJ,mBAAmDhJ,CAAU,UAAA;AACjE,QAAI+I,MAAM/I,OAAO,WAAW,KAAKuH,gBAAgB;AACzCkB,YAAAA,KAAKD,eAAe,CAAC;AAC3BC,+BAAId;AAAAA,IACKoB,WAAAA,MAAM/I,OAAO,OAAO,GAAG;AAChC0C,yCAAU1C,OAAOU;AAAAA,IACnB;AAEAuD,2CAAYjE,OAAOU;AAAAA,EAAK;AAI1B,QAAMuI,yBAAwDjJ,CAAU,UAAA;AACtE,QAAIA,MAAMI,eAAe;AACvB8I,iBAAW,MAAM;AACTC,cAAAA,OAAOX,eAAe,IAAI;AAChC,YAAI,EAACW,6BAAM5I,SAASL,SAASC;AAAuC;SACnE,EAAE;AAAA,IACP;AAAA,EAAA;AAGF,QAAMiJ,aAAa1G,WAAW;AAI9B,QAAM2G,YACJ,CAAClH,YACD,CAACD,YACD,CAACkB,gBACD,CAACgC,iBACA,CAACgE,cACAtG,SAAS,YACTQ,uBACA+B,sBAAoBE,gBAAiBC;AAEnC8D,QAAAA,iBAAiBxG,SAAS,YAAY,CAACQ;AAEvCiG,QAAAA,2BACJzG,SAAS,cAAc,CAACO;AAKpBmG,QAAAA,cAAclD,YAAY,MAAM;AAEpChB,uBAAmBC,gBAAiBC,OAAO;AAE1B3B,qBAAAA,SAAS4C,SAAS,EAAE;AAGrCyC,eAAWxB,UAAU;AAAA,EAAA,GACpB,CAACpC,kBAAkB,CAAC;AAEjBmE,QAAAA,cAAc7D,QAAQ,MAAM;AAChC,QAAI,CAACyD,WAAW;AACP,aAAA;AAAA,IACT;AAGE,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAWhF,GAAG3C,QAAQgI,iBAAiB;AAAA,UACrC,CAAChI,QAAQiI,SAAS,GAAG,CAACL;AAAAA,QAAAA,CACvB;AAAA,QACD,SAASE;AAAAA,QACT,cAAYvG,iCAAQvD;AAAAA,QACpB,iBAAekJ,MAAMpE,WAAW,OAAO;AAAA,QACvC,0BAAO,SAAO,EAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGjB,GAAA,CACD6E,WACA3H,QAAQgI,iBACRhI,QAAQiI,WACRL,gBACAE,aACAvG,iCAAQvD,kBACR8E,WACAH,EAAE,CACH;AAKKuF,QAAAA,eAAetD,YAClBtG,CAAU,UAAA;AACT0C,uCAAU1C,OAAOU;AAAAA,EAAK,GAExB,CAACgC,SAAShC,KAAK,CACjB;AAEMmJ,QAAAA,eAAejE,QAAQ,MAAM;AAEjC,UAAMkE,eACJR,mBACClE,gBACEgE,cAAc/D,sBAAoBE,gBAAiBC;AAExD,QAAI,CAACsE,cAAc;AACV,aAAA;AAAA,IACT;AAEA,WACG,oBAAA,aAAA,EACC,WAAWpI,QAAQgI,iBACnB,SAASN,aAAaQ,eAAe/C,QACrC,cAAY5D,iCAAQnD,mBACpB,MAAM,oBAAC,UAAM,EACb,CAAA;AAAA,EAEN,GAAG,CACDwJ,gBACAlE,cACAgE,YACA/D,mBACA3D,QAAQgI,iBACRE,cACA3G,iCAAQnD,iBAAiB,CAC1B;AAKKiK,QAAAA,uBAAuBzD,YAAY,MAAM;AAC7CY,sBAAkB,CAACD,cAAc;AAAA,EAAA,GAChC,CAACA,cAAc,CAAC;AAEb+C,QAAAA,uBAAuBpE,QAAQ,MAAM;AACzC,QAAI,CAAC2D,0BAA0B;AACtB,aAAA;AAAA,IACT;AAEA,+BACG,WACC,EAAA,sBAAoB,MACpB,sBAAoB,MACpB,OACE,oBAAC,cACEtC,EAAAA,UAAAA,iBACGhE,iCAAQpD,yCACRoD,iCAAQrD,wCACd,GAGF,UAAA,oBAAC,eACC,WAAW8B,QAAQgI,iBACnB,SAASK,sBACT,cAAY9G,iCAAQtD,2BACpB,iBAAeiJ,MAAMpE,WAAW,OAAO,GACvC,MAAMyC,iBAAkB,oBAAA,YAAA,MAAiB,oBAAA,SAAA,CAAO,CAAA,GAAI,EAExD,CAAA;AAAA,EAED,GAAA,CACDsC,0BACAtC,gBACAhE,iCAAQpD,wCACRoD,iCAAQrD,wCACRqD,iCAAQtD,2BACR+B,QAAQgI,iBACRK,sBACAvF,SAAS,CACV;AAEKyF,QAAAA,iBAAiBrE,QAAQ,MAAM;AACnC,QAAI,CAACjC,oBAAoB;AAChB,aAAA;AAAA,IACT;AAEI,QAAA,CAACuG,QAAQ7E,iBAAe,GAAG;AACtB,aAAA;AAAA,IACT;AAEA,+BAAQ,SAAQ,EAAA,OAAM,YAAW,WAAW3D,QAAQyI,KAAQ,CAAA;AAAA,KAC3D,CAACxG,oBAAoB0B,mBAAiB3D,QAAQyI,IAAI,CAAC;AAGhDC,QAAAA,eAAexE,QACnB,MACEyE,eAAe9G,YAAY,KAC3B+G,eAAMC,aAAahH,cAAoC;AAAA,IACrD3B,WAAWyC,GAAGd,aAAa/B,MAAMI,WAAWF,QAAQyI,IAAI;AAAA,EAAA,CACzD,GACH,CAACzI,QAAQyI,MAAM5G,cAAcc,EAAE,CACjC;AAEMmG,QAAAA,aAAa5E,QAAQ,MAAM;AAE7B,QAAA,CAAC6D,eACD,CAACO,wBACD,CAACH,gBACD,CAACI,kBACD,CAACG;AAEM,aAAA;AAIT,gCACG,OAAI,EAAA,WAAW1I,QAAQ+I,eAAe,eAAY,QAChDhB,UAAAA;AAAAA,MAAAA;AAAAA,MACAO;AAAAA,MACAH;AAAAA,MACAI,kBAAkBG;AAAAA,IACrB,EAAA,CAAA;AAAA,EAAA,GAED,CACD1I,QAAQ+I,eACRhB,aACAW,cACAJ,sBACAH,cACAI,cAAc,CACf;AAIDS,YAAU,MAAM;AACd,QAAI5F,WAAY,CAACG,QAAQwB,WAAWrB,cAAe;AAGjD;AAAA,IACF;AAEkB;EACjB,GAAA,CAACN,SAASM,cAAciB,iBAAiB,CAAC;AAE7C,QAAMsE,iBAAiB5D,iBACnBH,eACEgC,MAAMpE,WAAW,OAAO,IACxB3B,mBACFgE;AAEJ,SACG,qBAAA,eAAA,EACC,IACA,MACA,QAAQxB,mBACR,UACA,UACA,UACA,WAAWhB,GACT3C,QAAQkJ,MACR;AAAA,IACE,CAAClJ,QAAQ6F,cAAc,GAAGA;AAAAA,EAE5B3F,GAAAA,SACF,GACA,QAAQqH,wBAENzB,UAAAA;AAAAA,KAAAA,YAAYC,mBACZ,qBAAC,OAAI,EAAA,WAAW/F,QAAQmJ,gBACrBrD,UAAAA;AAAAA,MAAAA,YACE,oBAAA,SAAA,EACC,IAAIoB,MAAMpE,WAAW,OAAO,GAC5B,WAAW9C,QAAQU,OACnB,SAASwG,MAAMpE,WAAW,OAAO,GACjC,OAEH;AAAA,MAEAiD,kBACE,oBAAA,eAAA,EACC,IAAImB,MAAMpE,WAAW,aAAa,GAClC,WAAW9C,QAAQa,aAElBA,UACH,YAAA,CAAA;AAAA,IAAA,GAEJ;AAAA,IAED,oBAAA,aAAA,EACC,IACEiF,YAAY6B,aAAaE,2BACrBX,MAAMpE,WAAW,OAAO,IACxBoE,MAAM/G,IAAI,OAAO,GAEvB,MACA,OACA,UACA,UACA,UACA,UAAUwG,iBACV,WACA,WAAWW,kBACX,QAAQV,oBACR,SAASC,gBACT,aACA,MAAMpB,UACN,SAAS;AAAA,MACP1G,OAAOiB,QAAQjB;AAAAA,MACfqK,WAAWpJ,QAAQoJ;AAAAA,MACnBC,kBAAkBrJ,QAAQqJ;AAAAA,MAC1BC,mBAAmBtJ,QAAQsJ;AAAAA,MAC3BC,oBAAoBvJ,QAAQuJ;AAAAA,MAC5BC,sBAAsBxJ,QAAQwJ;AAAAA,IAAAA,GAEhC,SAASnE,gBACT,YAAY;AAAA,MACV,cAAc1E;AAAAA,MACd,mBAAmBC;AAAAA,MACnB,gBAAgByE,iBAAiB,OAAOF;AAAAA,MACxC,qBAAqB8D;AAAAA,MACrB,oBACEnI,mBAAmB,OACfA,kBACAD,cACAqG,MAAMpE,WAAW,aAAa,IAC9BqC;AAAAA,MACN,iBAAiBS,qBACbsB,MAAMpE,WAAW,aAAa,IAC9BqC;AAAAA,MAEJpF,KAAKoC;AAAAA;AAAAA,MAGLsH,cAAc7D,qBAAqB,QAAQT;AAAAA,MAE3C,GAAG3C;AAAAA,IAAAA,GAEL,UAAUS,WACV,cAAc6F,YACd,GAAIrG,OAAO,CAAA;AAAA,IAEZmD,sBAEIC,qBAAAA,UAAAA,EAAAA,UAAAA;AAAAA,MAAAA,sCACE,OAAI,EAAA,MAAK,gBAAe,WAAW7F,QAAQ0J,gBAC7C;AAAA,MACD,oBAAC,iBACC,KAAKvG,gBACL,IAAI+D,MAAMpE,WAAW,aAAa,GAClC,SAAS;AAAA,QACPoG,MAAMlJ,QAAQ2J;AAAAA,QACdlC,MAAMzH,QAAQ4J;AAAAA,MAEhB,GAAA,UAAU/D,gBACV,WAAU1D,cAAS4C,YAAT5C,mBAAkB0H,eAC5B,SAASzD,wBACT,WAAWgB,qBACX,sBAAsBZ,2BACtB,iBAAmC,CAAA;AAAA,IAAA,GAEvC;AAAA,IAEDtB,gBACC,oBAAC,eACC,EAAA,IAAIgC,MAAMpE,WAAW,OAAO,GAC5B,eAAa,MACb,WAAW9C,QAAQoE,OAElBL,UACH,mBAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ,CAAC;"}
+{"version":3,"file":"Input.js","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import React, {\n  HTMLInputTypeAttribute,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport {\n  InputBaseComponentProps as MuiInputBaseComponentProps,\n  useForkRef,\n} from \"@mui/material\";\n\nimport {\n  CloseXS,\n  PreviewOff,\n  Preview,\n  Search,\n  Success,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { isBrowser } from \"@core/utils/browser\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvInputLabels,\n  HvInputSuggestion,\n  HvValidationMessages,\n} from \"@core/types/forms\";\nimport { HvBaseProps, HvExtraProps } from \"@core/types/generic\";\nimport {\n  HvAdornment,\n  HvAdornmentProps,\n  HvFormElement,\n  HvFormElementProps,\n  HvFormStatus,\n  HvInfoMessage,\n  HvLabel,\n  HvSuggestion,\n  HvSuggestions,\n  HvSuggestionsProps,\n  HvWarningText,\n  isValid,\n  isInvalid,\n} from \"@core/components/Forms\";\nimport validationStates from \"@core/components/Forms/FormElement/validationStates\";\nimport { HvBaseInput, HvBaseInputProps } from \"@core/components/BaseInput\";\nimport {\n  DEFAULT_ERROR_MESSAGES,\n  computeValidationType,\n  hasBuiltInValidations,\n  validateInput,\n  computeValidationState,\n  computeValidationMessage,\n  HvInputValidity,\n} from \"@core/components/BaseInput/validations\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvTooltip } from \"@core/components/Tooltip\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useIsMounted } from \"@core/hooks/useIsMounted\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useLabels } from \"@core/hooks/useLabels\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { staticClasses, useClasses } from \"./Input.styles\";\n\nexport { staticClasses as inputClasses };\n\nexport type HvInputClasses = ExtractNames<typeof useClasses>;\n\ntype InputElement = HTMLInputElement | HTMLTextAreaElement;\n\nexport interface HvInputProps\n  extends HvBaseProps<\n    HTMLElement,\n    \"onChange\" | \"onBlur\" | \"onFocus\" | \"onKeyDown\" | \"color\"\n  > {\n  /** The form element name. */\n  name?: string;\n  /** The value of the form element. */\n  value?: string;\n  /** When uncontrolled, defines the initial input value. */\n  defaultValue?: string;\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be 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 user input is required on the form element. */\n  required?: boolean;\n  /**\n   * The status of the form element.\n   *\n   * Valid is correct, invalid is incorrect and standBy means no validations have run.\n   *\n   * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n   * or \"invalid\" after any change to `checked`, depending of the values of both `required` and `checked`.\n   */\n  status?: HvFormStatus;\n  /** The error message to show when `status` is \"invalid\". */\n  statusMessage?: string;\n  /**\n   * The function that will be executed onChange, allows modification of the input,\n   * it receives the value. If a new value should be presented it must returned it.\n   */\n  onChange?: HvBaseInputProps[\"onChange\"];\n  /**\n   * Callback called when the user submits the value by pressing Enter/Return.\n   *\n   * Also called when the search button is clicked (when type is \"search\").\n   */\n  onEnter?: (\n    event: React.KeyboardEvent<InputElement> | React.MouseEvent,\n    value: string\n  ) => void;\n  /**\n   * The function that will be executed onBlur, allows checking the validation state,\n   * it receives the value and the validation state.\n   */\n  onBlur?: (\n    event: React.FocusEvent<InputElement>,\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?: (event: React.FocusEvent<InputElement>, value: string) => void;\n  /**\n   * The function that will be executed onKeyDown, allows checking the value state,\n   * it receives the event and value.\n   */\n  onKeyDown?: (\n    event: React.KeyboardEvent<InputElement> | React.MouseEvent,\n    value: string\n  ) => void;\n  /** The input type. */\n  type?: HTMLInputTypeAttribute;\n  /** The placeholder value of the input. */\n  placeholder?: string;\n  /** Internal labels?. */\n  labels?: HvInputLabels & HvExtraProps;\n  /** An Object containing the various texts associated with the input. */\n  validationMessages?: HvValidationMessages;\n  /** Attributes applied to the input element. */\n  inputProps?: MuiInputBaseComponentProps;\n  /**\n   * Allows passing a ref to the underlying input\n   * @deprecated Use `ref` directly instead\n   * */\n  inputRef?: HvBaseInputProps[\"inputRef\"];\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) => HvInputSuggestion[] | null;\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  /** If `true` it should autofocus. */\n  autoFocus?: boolean;\n  /** If `true` the clear button is disabled. */\n  disableClear?: boolean;\n  /** If `true` the reveal password button is disabled. Valid only when type is \"password\". */\n  disableRevealPassword?: boolean;\n  /** If `true` the search button is disabled. Valid only when type is \"search\". */\n  disableSearchButton?: boolean;\n  /**\n   * If `true` the validation icon adornment is visible. Defaults to `false`.\n   *\n   * Currently, DS specifications define only a positive feedback icon;\n   * errors are signaled through the border style and by displaying the error message.\n   */\n  showValidationIcon?: boolean;\n  /** A custom icon to be added into the input. */\n  endAdornment?: React.ReactNode;\n  /** The maximum allowed length of the characters, if this value is null no check will be performed. */\n  maxCharQuantity?: number;\n  /** The minimum allowed length of the characters, if this value is null no check will be perform. */\n  minCharQuantity?: number;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvInputClasses;\n}\n\nconst DEFAULT_LABELS = {\n  clearButtonLabel: \"Clear the text\",\n  revealPasswordButtonLabel: \"Reveal password\",\n  revealPasswordButtonClickToShowTooltip: \"Click to show password.\",\n  revealPasswordButtonClickToHideTooltip: \"Click to hide password.\",\n  searchButtonLabel: \"Search\",\n};\n\n/**\n * Find the focused element onBlur.\n */\nconst getFocusedElement = (event) =>\n  isBrowser(\"ie\") ? document.activeElement : event.relatedTarget;\n\nfunction eventTargetIsInsideContainer(container, event) {\n  return container != null && container.contains(getFocusedElement(event));\n}\n\n/** Changes a given `input`'s `value`, triggering its `onChange` */\nconst changeInputValue = (input: HTMLInputElement | null, value = \"\") => {\n  const event = new Event(\"input\", { bubbles: true });\n\n  /** Original `input.value` setter (React overrides it). */\n  const setInputValue = Object.getOwnPropertyDescriptor(\n    window.HTMLInputElement.prototype,\n    \"value\"\n  )?.set;\n\n  setInputValue?.call(input, value);\n  input?.dispatchEvent(event);\n};\n\n/**\n * A text input box is a graphical control element intended to enable the user to input text information to be used by the software.\n */\nexport const HvInput = forwardRef<InputElement, HvInputProps>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    id,\n    name,\n    value: valueProp,\n    defaultValue = \"\",\n    required = false,\n    readOnly = false,\n    disabled = false,\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    description,\n    \"aria-describedby\": ariaDescribedBy,\n    onChange,\n    onEnter,\n    status,\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n    type = \"text\",\n    placeholder,\n    autoFocus = false,\n    labels: labelsProp,\n    validationMessages,\n    disableClear = false,\n    disableRevealPassword = false,\n    disableSearchButton = false,\n    endAdornment,\n    maxCharQuantity,\n    minCharQuantity,\n    validation,\n    showValidationIcon = false,\n    suggestionListCallback,\n    inputRef: inputRefProp,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    inputProps = {},\n    ...others\n  } = useDefaultProps(\"HvInput\", props);\n  const { classes, cx } = useClasses(classesProp);\n  const labels = useLabels(DEFAULT_LABELS, labelsProp);\n  const elementId = useUniqueId(id, \"hvinput\");\n\n  const inputRef = useRef<HTMLInputElement>(null);\n  const forkedRef = useForkRef(ref, inputRef, inputRefProp);\n  const suggestionsRef = useRef<HTMLElement>(null);\n\n  const [focused, setFocused] = useState(false);\n\n  // Signals that the user has manually edited the input value\n  const isDirty = useRef(false);\n\n  // Value related state\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n\n  const isEmptyValue = value == null || value === \"\";\n\n  // Validation related state\n  const [validationState, setValidationState] = useControlled(\n    status,\n    validationStates.standBy\n  );\n\n  const [validationMessage, setValidationMessage] = useControlled(\n    statusMessage,\n    \"\"\n  );\n\n  // validationMessages reference tends to change, as users will not memoize/useState for it;\n  // dependencies must be more explicit so we set\n  const errorMessages = useMemo(\n    () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [\n      validationMessages?.error,\n      validationMessages?.requiredError,\n      validationMessages?.minCharError,\n      validationMessages?.maxCharError,\n      validationMessages?.typeMismatchError,\n    ]\n  );\n\n  const validationType = useMemo(() => computeValidationType(type), [type]);\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      validationType,\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    isEmptyValue,\n    maxCharQuantity,\n    minCharQuantity,\n    required,\n    setValidationMessage,\n    setValidationState,\n    validation,\n    validationType,\n    value,\n  ]);\n\n  // The error message area will only be created if:\n  // - an external element that provides an error message isn't identified via aria-errormessage AND\n  //   - both status and statusMessage properties are being controlled OR\n  //   - status is uncontrolled and 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          validationType,\n          minCharQuantity,\n          maxCharQuantity,\n          validation,\n          inputProps\n        )));\n\n  const isStateInvalid = isInvalid(validationState);\n\n  // Input type related state\n  const [revealPassword, setRevealPassword] = useState(false);\n\n  const realType = useMemo(() => {\n    if (type === \"password\") {\n      return revealPassword ? \"text\" : \"password\";\n    }\n\n    if (type === \"search\") {\n      return \"search\";\n    }\n\n    return \"text\";\n  }, [revealPassword, type]);\n\n  // Suggestions related state\n  const [suggestionValues, setSuggestionValues] = useState<\n    HvSuggestion[] | null\n  >(null);\n\n  const canShowSuggestions = suggestionListCallback != null;\n  const hasSuggestions = !!suggestionValues;\n\n  // Miscellaneous state\n  const hasLabel = label != null;\n  const hasDescription = description != null;\n\n  /**\n   * Looks for the node that represent the input inside the material tree and focus it.\n   */\n  const focusInput = () => {\n    inputRef.current?.focus();\n  };\n\n  const isMounted = useIsMounted();\n\n  /**\n   * Clears the suggestion array.\n   */\n  const suggestionClearHandler = () => {\n    if (isMounted.current) {\n      setSuggestionValues(null);\n    }\n  };\n\n  /**\n   * Fills of the suggestion array.\n   */\n  const suggestionHandler = (val: string) => {\n    const suggestionsArray = suggestionListCallback?.(val);\n    if (suggestionsArray?.[0]?.label) {\n      setSuggestionValues(suggestionsArray);\n    } else {\n      suggestionClearHandler();\n    }\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    const newValue = item.value || item.label;\n\n    changeInputValue(inputRef.current, newValue);\n\n    focusInput();\n    suggestionClearHandler();\n\n    if (type === \"search\") {\n      // trigger the onEnter callback when the user selects an option in a search box\n      onEnter?.(event, newValue);\n    }\n  };\n\n  const onChangeHandler: HvBaseInputProps[\"onChange\"] = (event, newValue) => {\n    isDirty.current = true;\n\n    // set the input value (only when value is uncontrolled)\n    setValue(newValue);\n\n    onChange?.(event, newValue);\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(newValue);\n    }\n  };\n\n  /**\n   * Validates the input updating the state and modifying the info text, also executes\n   * the user provided onBlur passing the current validation status and value.\n   */\n  const onInputBlurHandler: HvBaseInputProps[\"onBlur\"] = (event) => {\n    // If the blur is executed when choosing an suggestion it should be ignored.\n    if (eventTargetIsInsideContainer(suggestionsRef.current, event)) return;\n\n    setFocused(false);\n\n    const inputValidity = performValidation();\n\n    onBlur?.(event, value, inputValidity);\n  };\n\n  /**\n   * Updates the state putting again the value from the state because the input value is\n   * not automatically manage, it also executes the onFocus function from the user passing the value\n   */\n  const onFocusHandler: HvBaseInputProps[\"onFocus\"] = (event) => {\n    setFocused(true);\n\n    // reset validation status to standBy (only when status is uncontrolled)\n    setValidationState(validationStates.standBy);\n\n    onFocus?.(event, value);\n  };\n\n  const getSuggestions = (li: number | null) => {\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\n  const onSuggestionKeyDown: HvSuggestionsProps[\"onKeyDown\"] = (event) => {\n    if (isKey(event, \"Esc\")) {\n      suggestionClearHandler();\n      focusInput();\n    } else if (isKey(event, \"Tab\")) {\n      suggestionClearHandler();\n    }\n  };\n\n  /** Focus the suggestion list when the arrow down is pressed. */\n  const onKeyDownHandler: HvBaseInputProps[\"onKeyDown\"] = (event) => {\n    if (isKey(event, \"ArrowDown\") && hasSuggestions) {\n      const li = getSuggestions(0);\n      li?.focus();\n    } else if (isKey(event, \"Enter\")) {\n      onEnter?.(event, value);\n    }\n\n    onKeyDown?.(event, value);\n  };\n\n  /** Clears the suggestion list on blur. */\n  const onContainerBlurHandler: HvFormElementProps[\"onBlur\"] = (event) => {\n    if (event.relatedTarget) {\n      setTimeout(() => {\n        const list = getSuggestions(null);\n        if (!list?.contains(document.activeElement)) suggestionClearHandler();\n      }, 10);\n    }\n  };\n\n  const hasOnEnter = onEnter != null;\n\n  // show the clear button only if the input is enabled, not read-only, disableClear is false and the input is not empty\n  // also, don't show it when the input type is \"search\" and the input is active (standBy)\n  const showClear =\n    !disabled &&\n    !readOnly &&\n    !disableClear &&\n    !isEmptyValue &&\n    (!hasOnEnter ||\n      type !== \"search\" ||\n      disableSearchButton ||\n      validationState !== validationStates.standBy);\n\n  const showSearchIcon = type === \"search\" && !disableSearchButton;\n\n  const showRevealPasswordButton =\n    type === \"password\" && !disableRevealPassword;\n\n  /**\n   * Clears the input value from the state and refocus the input.\n   */\n  const handleClear = useCallback(() => {\n    // reset validation status to standBy (only when status is uncontrolled)\n    setValidationState(validationStates.standBy);\n\n    changeInputValue(inputRef.current, \"\");\n\n    // we want to focus the input when clicked and not active\n    setTimeout(focusInput);\n  }, [setValidationState]);\n\n  const clearButton = useMemo(() => {\n    if (!showClear) {\n      return null;\n    }\n\n    return (\n      <HvAdornment\n        // Don't control visibility when the search icon is enabled\n        className={cx(classes.adornmentButton, {\n          [classes.iconClear]: !showSearchIcon,\n        })}\n        onClick={handleClear}\n        aria-label={labels?.clearButtonLabel}\n        aria-controls={setId(elementId, \"input\")}\n        icon={<CloseXS />}\n      />\n    );\n  }, [\n    showClear,\n    classes.adornmentButton,\n    classes.iconClear,\n    showSearchIcon,\n    handleClear,\n    labels?.clearButtonLabel,\n    elementId,\n    cx,\n  ]);\n\n  /**\n   * Calls the onEnter callback and refocus the input.\n   */\n  const handleSearch = useCallback<NonNullable<HvAdornmentProps[\"onClick\"]>>(\n    (event) => {\n      onEnter?.(event, value);\n    },\n    [onEnter, value]\n  );\n\n  const searchButton = useMemo(() => {\n    // If the search icon is not actionable, only show it when the input is empty or active\n    const reallyShowIt =\n      showSearchIcon &&\n      (isEmptyValue ||\n        (hasOnEnter && validationState === validationStates.standBy));\n\n    if (!reallyShowIt) {\n      return null;\n    }\n\n    return (\n      <HvAdornment\n        className={classes.adornmentButton}\n        onClick={hasOnEnter ? handleSearch : undefined}\n        aria-label={labels?.searchButtonLabel}\n        icon={<Search />}\n      />\n    );\n  }, [\n    showSearchIcon,\n    isEmptyValue,\n    hasOnEnter,\n    validationState,\n    classes.adornmentButton,\n    handleSearch,\n    labels?.searchButtonLabel,\n  ]);\n\n  /**\n   * Changes input type and refocus the input.\n   */\n  const handleRevealPassword = useCallback(() => {\n    setRevealPassword(!revealPassword);\n  }, [revealPassword]);\n\n  const revealPasswordButton = useMemo(() => {\n    if (!showRevealPasswordButton) {\n      return null;\n    }\n\n    return (\n      <HvTooltip\n        disableFocusListener\n        disableTouchListener\n        title={\n          <HvTypography>\n            {revealPassword\n              ? labels?.revealPasswordButtonClickToHideTooltip\n              : labels?.revealPasswordButtonClickToShowTooltip}\n          </HvTypography>\n        }\n      >\n        <HvAdornment\n          className={classes.adornmentButton}\n          onClick={handleRevealPassword}\n          aria-label={labels?.revealPasswordButtonLabel}\n          aria-controls={setId(elementId, \"input\")}\n          icon={revealPassword ? <PreviewOff /> : <Preview />}\n        />\n      </HvTooltip>\n    );\n  }, [\n    showRevealPasswordButton,\n    revealPassword,\n    labels?.revealPasswordButtonClickToHideTooltip,\n    labels?.revealPasswordButtonClickToShowTooltip,\n    labels?.revealPasswordButtonLabel,\n    classes.adornmentButton,\n    handleRevealPassword,\n    elementId,\n  ]);\n\n  const validationIcon = useMemo(() => {\n    if (!showValidationIcon) {\n      return null;\n    }\n\n    if (!isValid(validationState)) {\n      return null;\n    }\n\n    return <Success color=\"positive\" className={classes.icon} />;\n  }, [showValidationIcon, validationState, classes.icon]);\n\n  // useMemo to avoid repetitive cloning of the custom icon\n  const customIconEl = useMemo(\n    () =>\n      isValidElement(endAdornment) &&\n      React.cloneElement(endAdornment as React.ReactElement, {\n        className: cx(endAdornment.props.className, classes.icon),\n      }),\n    [classes.icon, endAdornment, cx]\n  );\n\n  const adornments = useMemo(() => {\n    if (\n      !clearButton &&\n      !revealPasswordButton &&\n      !searchButton &&\n      !validationIcon &&\n      !customIconEl\n    )\n      return null;\n\n    // note: specification implies that the custom icon should be hidden when\n    // a validation feedback icon is being shown.\n    return (\n      <div className={classes.adornmentsBox} aria-hidden=\"true\">\n        {clearButton}\n        {revealPasswordButton}\n        {searchButton}\n        {validationIcon || customIconEl}\n      </div>\n    );\n  }, [\n    classes.adornmentsBox,\n    clearButton,\n    customIconEl,\n    revealPasswordButton,\n    searchButton,\n    validationIcon,\n  ]);\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  const errorMessageId = isStateInvalid\n    ? canShowError\n      ? setId(elementId, \"error\")\n      : ariaErrorMessage\n    : undefined;\n\n  return (\n    <HvFormElement\n      id={id}\n      name={name}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={cx(\n        classes.root,\n        {\n          [classes.hasSuggestions]: hasSuggestions,\n        },\n        className\n      )}\n      onBlur={onContainerBlurHandler}\n    >\n      {(hasLabel || hasDescription) && (\n        <div className={classes.labelContainer}>\n          {hasLabel && (\n            <HvLabel\n              id={setId(elementId, \"label\")}\n              className={classes.label}\n              htmlFor={setId(elementId, \"input\")}\n              label={label}\n            />\n          )}\n\n          {hasDescription && (\n            <HvInfoMessage\n              id={setId(elementId, \"description\")}\n              className={classes.description}\n            >\n              {description}\n            </HvInfoMessage>\n          )}\n        </div>\n      )}\n      <HvBaseInput\n        id={\n          hasLabel || showClear || showRevealPasswordButton\n            ? setId(elementId, \"input\")\n            : setId(id, \"input\")\n        }\n        name={name}\n        value={value}\n        required={required}\n        readOnly={readOnly}\n        disabled={disabled}\n        onChange={onChangeHandler}\n        autoFocus={autoFocus}\n        onKeyDown={onKeyDownHandler}\n        onBlur={onInputBlurHandler}\n        onFocus={onFocusHandler}\n        placeholder={placeholder}\n        type={realType}\n        classes={{\n          input: classes.input,\n          inputRoot: classes.inputRoot,\n          inputRootFocused: classes.inputRootFocused,\n          inputRootDisabled: classes.inputRootDisabled,\n          inputRootMultiline: classes.inputRootMultiline,\n          inputBorderContainer: classes.inputBorderContainer,\n        }}\n        invalid={isStateInvalid}\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\n              ? setId(elementId, \"description\")\n              : undefined,\n          \"aria-controls\": canShowSuggestions\n            ? setId(elementId, \"suggestions\")\n            : undefined,\n\n          ref: inputRef,\n\n          // prevent browsers auto-fill/suggestions when we have our own\n          autoComplete: canShowSuggestions ? \"off\" : undefined,\n\n          ...inputProps,\n        }}\n        inputRef={forkedRef}\n        endAdornment={adornments}\n        {...others}\n      />\n      {canShowSuggestions && (\n        <>\n          {hasSuggestions && (\n            <div role=\"presentation\" className={classes.inputExtension} />\n          )}\n          <HvSuggestions\n            ref={suggestionsRef}\n            id={setId(elementId, \"suggestions\")}\n            classes={{\n              root: classes.suggestionsContainer,\n              list: classes.suggestionList,\n            }}\n            expanded={hasSuggestions}\n            anchorEl={inputRef.current?.parentElement}\n            onClose={suggestionClearHandler}\n            onKeyDown={onSuggestionKeyDown}\n            onSuggestionSelected={suggestionSelectedHandler}\n            suggestionValues={suggestionValues}\n          />\n        </>\n      )}\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          disableBorder\n          className={classes.error}\n        >\n          {validationMessage}\n        </HvWarningText>\n      )}\n    </HvFormElement>\n  );\n});\n"],"names":["DEFAULT_LABELS","clearButtonLabel","revealPasswordButtonLabel","revealPasswordButtonClickToShowTooltip","revealPasswordButtonClickToHideTooltip","searchButtonLabel","getFocusedElement","event","isBrowser","document","activeElement","relatedTarget","eventTargetIsInsideContainer","container","contains","changeInputValue","input","value","Event","bubbles","setInputValue","Object","getOwnPropertyDescriptor","window","HTMLInputElement","prototype","set","call","dispatchEvent","HvInput","forwardRef","props","ref","classes","classesProp","className","id","name","valueProp","defaultValue","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onEnter","status","statusMessage","ariaErrorMessage","type","placeholder","autoFocus","labels","labelsProp","validationMessages","disableClear","disableRevealPassword","disableSearchButton","endAdornment","maxCharQuantity","minCharQuantity","validation","showValidationIcon","suggestionListCallback","inputRef","inputRefProp","onBlur","onFocus","onKeyDown","inputProps","others","useDefaultProps","cx","useClasses","useLabels","elementId","useUniqueId","useRef","forkedRef","useForkRef","suggestionsRef","focused","setFocused","useState","isDirty","setValue","useControlled","isEmptyValue","validationState","setValidationState","validationStates","standBy","validationMessage","setValidationMessage","errorMessages","useMemo","DEFAULT_ERROR_MESSAGES","error","requiredError","minCharError","maxCharError","typeMismatchError","validationType","computeValidationType","performValidation","useCallback","inputValidity","validateInput","current","computeValidationState","computeValidationMessage","canShowError","undefined","hasBuiltInValidations","isStateInvalid","isInvalid","revealPassword","setRevealPassword","realType","suggestionValues","setSuggestionValues","canShowSuggestions","hasSuggestions","hasLabel","hasDescription","focusInput","focus","isMounted","useIsMounted","suggestionClearHandler","suggestionHandler","val","suggestionsArray","suggestionSelectedHandler","item","newValue","onChangeHandler","onInputBlurHandler","onFocusHandler","getSuggestions","li","listEl","getElementById","setId","getElementsByTagName","onSuggestionKeyDown","isKey","onKeyDownHandler","onContainerBlurHandler","setTimeout","list","hasOnEnter","showClear","showSearchIcon","showRevealPasswordButton","handleClear","clearButton","adornmentButton","iconClear","handleSearch","searchButton","reallyShowIt","handleRevealPassword","revealPasswordButton","validationIcon","isValid","icon","customIconEl","isValidElement","React","cloneElement","adornments","adornmentsBox","useEffect","errorMessageId","root","labelContainer","inputRoot","inputRootFocused","inputRootDisabled","inputRootMultiline","inputBorderContainer","autoComplete","inputExtension","suggestionsContainer","suggestionList","parentElement"],"mappings":"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"}

package/dist/esm/components/Kpi/Kpi.js

@@ -29,17 +29,17 @@ const HvKpi = (props) => {
   const mergedLabels = useLabels(DEFAULT_LABELS, labels);
   const InternalVisualComparison = typeof visualComparison === "string" ? HvTypography : "div";
   return /* @__PURE__ */ jsxs("div", { className: cx(classes.root, className), ...others, children: [
-    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(HvTypography, { variant: "label", children: mergedLabels == null ? void 0 : mergedLabels.title }) }),
+    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(HvTypography, { variant: "label", children: mergedLabels?.title }) }),
     /* @__PURE__ */ jsxs("div", { className: classes.indicatorsContainer, children: [
       visualIndicator && /* @__PURE__ */ jsx("div", { className: cx(classes.visualIndicatorContainer, classes.spacingToTheRight), children: visualIndicator }),
-      (mergedLabels == null ? void 0 : mergedLabels.indicator) && /* @__PURE__ */ jsx(HvTypography, { className: cx(classes.spacingToTheRight, classes.indicatorText), variant: indicatorTextVariant, children: mergedLabels.indicator }),
-      (mergedLabels == null ? void 0 : mergedLabels.unit) && /* @__PURE__ */ jsx(HvTypography, { className: classes.indicatorUnit, variant: indicatorUnitTextVariant, children: mergedLabels.unit })
+      mergedLabels?.indicator && /* @__PURE__ */ jsx(HvTypography, { className: cx(classes.spacingToTheRight, classes.indicatorText), variant: indicatorTextVariant, children: mergedLabels.indicator }),
+      mergedLabels?.unit && /* @__PURE__ */ jsx(HvTypography, { className: classes.indicatorUnit, variant: indicatorUnitTextVariant, children: mergedLabels.unit })
     ] }),
     visualComparison && /* @__PURE__ */ jsxs("div", { className: classes.comparisonComposition, children: [
       trendIndicator && /* @__PURE__ */ jsx("div", { className: cx(classes.trendLine, classes.spacingToTheRight), children: trendIndicator }),
       /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("div", { className: classes.comparisonContainer, children: /* @__PURE__ */ jsx(InternalVisualComparison, { className: cx(classes.comparisons, classes.spacingToTheRight), variant: "label", children: visualComparison }) }),
-        /* @__PURE__ */ jsx("div", { className: classes.comparisonContainer, children: /* @__PURE__ */ jsx(HvTypography, { className: classes.comparisons, variant: "caption2", children: mergedLabels == null ? void 0 : mergedLabels.comparisonIndicatorInfo }) })
+        /* @__PURE__ */ jsx("div", { className: classes.comparisonContainer, children: /* @__PURE__ */ jsx(HvTypography, { className: classes.comparisons, variant: "caption2", children: mergedLabels?.comparisonIndicatorInfo }) })
       ] })
     ] })
   ] });

package/dist/esm/components/Kpi/Kpi.js.map

@@ -1 +1 @@
-{"version":3,"file":"Kpi.js","sources":["../../../../src/components/Kpi/Kpi.tsx"],"sourcesContent":["import { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useLabels } from \"@core/hooks/useLabels\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Kpi.styles\";\n\nexport { staticClasses as kpiClasses };\n\nexport type HvKpiClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvKpiLabelProps {\n  /**\n   * The text at the top of the kpi.\n   */\n  title?: string;\n  /**\n   * The text in the middle of the kpi.\n   */\n  indicator?: string;\n  /**\n   * The text to the right of the indicator.\n   */\n  unit?: string;\n  /**\n   * The text to the right of the visual comparison.\n   */\n  comparisonIndicatorInfo?: string;\n}\n\nexport interface HvKpiProps extends HvBaseProps<HTMLDivElement, \"children\"> {\n  /**\n   * An Element that will be rendered to the left of the kpi indicator text.\n   */\n  trendIndicator?: React.ReactNode;\n  /**\n   * An Element that will be rendered to the left of the kpi indicator text.\n   */\n  visualIndicator?: React.ReactNode;\n  /**\n   * An Element that will be rendered below the kpi indicator text.\n   */\n  visualComparison?: React.ReactNode;\n  /**\n   * The object that contains the different labels inside the kpi.\n   */\n  labels?: HvKpiLabelProps;\n  /**\n   *  The typography variant used in the main text indicator of the KPI\n   */\n  indicatorTextVariant?: \"display\" | \"title1\" | \"title2\";\n  /**\n   *  The typography variant used in the main text indicator of the KPI\n   */\n  indicatorUnitTextVariant?: \"title2\" | \"body\";\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvKpiClasses;\n}\n\nconst DEFAULT_LABELS = {\n  title: \"\",\n  indicator: undefined,\n  unit: undefined,\n  comparisonIndicatorInfo: undefined,\n};\n\n/**\n * Key Performance Indicator is a type of performance measurement. It monitors a business indicator\n * and its success/failure against a given target. KPIs are the first item read on a dashboard.\n * Communicates simple, immediate and vital information for operational decision making.\n */\nexport const HvKpi = (props: HvKpiProps) => {\n  const {\n    trendIndicator = null,\n    visualIndicator = null,\n    visualComparison = null,\n    indicatorUnitTextVariant = \"title2\",\n    indicatorTextVariant = \"title1\",\n    labels,\n    classes: classesProp,\n    className,\n    ...others\n  } = useDefaultProps(\"HvKpi\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const mergedLabels = useLabels(DEFAULT_LABELS, labels);\n\n  const InternalVisualComparison =\n    typeof visualComparison === \"string\" ? HvTypography : \"div\";\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      <div>\n        <HvTypography variant=\"label\">{mergedLabels?.title}</HvTypography>\n      </div>\n      <div className={classes.indicatorsContainer}>\n        {visualIndicator && (\n          <div\n            className={cx(\n              classes.visualIndicatorContainer,\n              classes.spacingToTheRight\n            )}\n          >\n            {visualIndicator}\n          </div>\n        )}\n        {mergedLabels?.indicator && (\n          <HvTypography\n            className={cx(classes.spacingToTheRight, classes.indicatorText)}\n            variant={indicatorTextVariant}\n          >\n            {mergedLabels.indicator}\n          </HvTypography>\n        )}\n        {mergedLabels?.unit && (\n          <HvTypography\n            className={classes.indicatorUnit}\n            variant={indicatorUnitTextVariant}\n          >\n            {mergedLabels.unit}\n          </HvTypography>\n        )}\n      </div>\n      {visualComparison && (\n        <div className={classes.comparisonComposition}>\n          {trendIndicator && (\n            <div className={cx(classes.trendLine, classes.spacingToTheRight)}>\n              {trendIndicator}\n            </div>\n          )}\n          <div>\n            <div className={classes.comparisonContainer}>\n              <InternalVisualComparison\n                className={cx(classes.comparisons, classes.spacingToTheRight)}\n                variant=\"label\"\n              >\n                {visualComparison}\n              </InternalVisualComparison>\n            </div>\n            <div className={classes.comparisonContainer}>\n              <HvTypography className={classes.comparisons} variant=\"caption2\">\n                {mergedLabels?.comparisonIndicatorInfo}\n              </HvTypography>\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["DEFAULT_LABELS","title","indicator","undefined","unit","comparisonIndicatorInfo","HvKpi","props","trendIndicator","visualIndicator","visualComparison","indicatorUnitTextVariant","indicatorTextVariant","labels","classes","classesProp","className","others","useDefaultProps","cx","useClasses","mergedLabels","useLabels","InternalVisualComparison","HvTypography","root","indicatorsContainer","visualIndicatorContainer","spacingToTheRight","indicatorText","indicatorUnit","comparisonComposition","trendLine","comparisonContainer","comparisons"],"mappings":";;;;;;AA8DA,MAAMA,iBAAiB;AAAA,EACrBC,OAAO;AAAA,EACPC,WAAWC;AAAAA,EACXC,MAAMD;AAAAA,EACNE,yBAAyBF;AAC3B;AAOaG,MAAAA,QAAQA,CAACC,UAAsB;AACpC,QAAA;AAAA,IACJC,iBAAiB;AAAA,IACjBC,kBAAkB;AAAA,IAClBC,mBAAmB;AAAA,IACnBC,2BAA2B;AAAA,IAC3BC,uBAAuB;AAAA,IACvBC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,SAASX,KAAK;AAE5B,QAAA;AAAA,IAAEO;AAAAA,IAASK;AAAAA,EAAAA,IAAOC,WAAWL,WAAW;AAExCM,QAAAA,eAAeC,UAAUtB,gBAAgBa,MAAM;AAErD,QAAMU,2BACJ,OAAOb,qBAAqB,WAAWc,eAAe;AAGtD,SAAA,qBAAC,SAAI,WAAWL,GAAGL,QAAQW,MAAMT,SAAS,GAAG,GAAIC,QAC/C,UAAA;AAAA,IAAA,oBAAC,SACC,UAAC,oBAAA,cAAA,EAAa,SAAQ,SAASI,UAAAA,6CAAcpB,OAAM,EACrD,CAAA;AAAA,IACC,qBAAA,OAAA,EAAI,WAAWa,QAAQY,qBACrBjB,UAAAA;AAAAA,MACC,mBAAA,oBAAC,SACC,WAAWU,GACTL,QAAQa,0BACRb,QAAQc,iBACV,GAECnB,UACH,gBAAA,CAAA;AAAA,OAEDY,6CAAcnB,cACZ,oBAAA,cAAA,EACC,WAAWiB,GAAGL,QAAQc,mBAAmBd,QAAQe,aAAa,GAC9D,SAASjB,sBAERS,uBAAanB,WAChB;AAAA,OAEDmB,6CAAcjB,SACb,oBAAC,cACC,EAAA,WAAWU,QAAQgB,eACnB,SAASnB,0BAERU,UAAAA,aAAajB,KAChB,CAAA;AAAA,IAAA,GAEJ;AAAA,IACCM,oBACC,qBAAC,OAAI,EAAA,WAAWI,QAAQiB,uBACrBvB,UAAAA;AAAAA,MACC,kBAAA,oBAAC,SAAI,WAAWW,GAAGL,QAAQkB,WAAWlB,QAAQc,iBAAiB,GAC5DpB,UACH,eAAA,CAAA;AAAA,2BAED,OACC,EAAA,UAAA;AAAA,QAAA,oBAAC,SAAI,WAAWM,QAAQmB,qBACtB,UAAA,oBAAC,4BACC,WAAWd,GAAGL,QAAQoB,aAAapB,QAAQc,iBAAiB,GAC5D,SAAQ,SAEPlB,2BACH,CAAA,GACF;AAAA,QACC,oBAAA,OAAA,EAAI,WAAWI,QAAQmB,qBACtB,UAAC,oBAAA,cAAA,EAAa,WAAWnB,QAAQoB,aAAa,SAAQ,YACnDb,UAAAA,6CAAchB,wBACjB,CAAA,GACF;AAAA,MAAA,GACF;AAAA,IAAA,GACF;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"Kpi.js","sources":["../../../../src/components/Kpi/Kpi.tsx"],"sourcesContent":["import { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useLabels } from \"@core/hooks/useLabels\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Kpi.styles\";\n\nexport { staticClasses as kpiClasses };\n\nexport type HvKpiClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvKpiLabelProps {\n  /**\n   * The text at the top of the kpi.\n   */\n  title?: string;\n  /**\n   * The text in the middle of the kpi.\n   */\n  indicator?: string;\n  /**\n   * The text to the right of the indicator.\n   */\n  unit?: string;\n  /**\n   * The text to the right of the visual comparison.\n   */\n  comparisonIndicatorInfo?: string;\n}\n\nexport interface HvKpiProps extends HvBaseProps<HTMLDivElement, \"children\"> {\n  /**\n   * An Element that will be rendered to the left of the kpi indicator text.\n   */\n  trendIndicator?: React.ReactNode;\n  /**\n   * An Element that will be rendered to the left of the kpi indicator text.\n   */\n  visualIndicator?: React.ReactNode;\n  /**\n   * An Element that will be rendered below the kpi indicator text.\n   */\n  visualComparison?: React.ReactNode;\n  /**\n   * The object that contains the different labels inside the kpi.\n   */\n  labels?: HvKpiLabelProps;\n  /**\n   *  The typography variant used in the main text indicator of the KPI\n   */\n  indicatorTextVariant?: \"display\" | \"title1\" | \"title2\";\n  /**\n   *  The typography variant used in the main text indicator of the KPI\n   */\n  indicatorUnitTextVariant?: \"title2\" | \"body\";\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvKpiClasses;\n}\n\nconst DEFAULT_LABELS = {\n  title: \"\",\n  indicator: undefined,\n  unit: undefined,\n  comparisonIndicatorInfo: undefined,\n};\n\n/**\n * Key Performance Indicator is a type of performance measurement. It monitors a business indicator\n * and its success/failure against a given target. KPIs are the first item read on a dashboard.\n * Communicates simple, immediate and vital information for operational decision making.\n */\nexport const HvKpi = (props: HvKpiProps) => {\n  const {\n    trendIndicator = null,\n    visualIndicator = null,\n    visualComparison = null,\n    indicatorUnitTextVariant = \"title2\",\n    indicatorTextVariant = \"title1\",\n    labels,\n    classes: classesProp,\n    className,\n    ...others\n  } = useDefaultProps(\"HvKpi\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const mergedLabels = useLabels(DEFAULT_LABELS, labels);\n\n  const InternalVisualComparison =\n    typeof visualComparison === \"string\" ? HvTypography : \"div\";\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      <div>\n        <HvTypography variant=\"label\">{mergedLabels?.title}</HvTypography>\n      </div>\n      <div className={classes.indicatorsContainer}>\n        {visualIndicator && (\n          <div\n            className={cx(\n              classes.visualIndicatorContainer,\n              classes.spacingToTheRight\n            )}\n          >\n            {visualIndicator}\n          </div>\n        )}\n        {mergedLabels?.indicator && (\n          <HvTypography\n            className={cx(classes.spacingToTheRight, classes.indicatorText)}\n            variant={indicatorTextVariant}\n          >\n            {mergedLabels.indicator}\n          </HvTypography>\n        )}\n        {mergedLabels?.unit && (\n          <HvTypography\n            className={classes.indicatorUnit}\n            variant={indicatorUnitTextVariant}\n          >\n            {mergedLabels.unit}\n          </HvTypography>\n        )}\n      </div>\n      {visualComparison && (\n        <div className={classes.comparisonComposition}>\n          {trendIndicator && (\n            <div className={cx(classes.trendLine, classes.spacingToTheRight)}>\n              {trendIndicator}\n            </div>\n          )}\n          <div>\n            <div className={classes.comparisonContainer}>\n              <InternalVisualComparison\n                className={cx(classes.comparisons, classes.spacingToTheRight)}\n                variant=\"label\"\n              >\n                {visualComparison}\n              </InternalVisualComparison>\n            </div>\n            <div className={classes.comparisonContainer}>\n              <HvTypography className={classes.comparisons} variant=\"caption2\">\n                {mergedLabels?.comparisonIndicatorInfo}\n              </HvTypography>\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["DEFAULT_LABELS","title","indicator","undefined","unit","comparisonIndicatorInfo","HvKpi","props","trendIndicator","visualIndicator","visualComparison","indicatorUnitTextVariant","indicatorTextVariant","labels","classes","classesProp","className","others","useDefaultProps","cx","useClasses","mergedLabels","useLabels","InternalVisualComparison","HvTypography","root","indicatorsContainer","visualIndicatorContainer","spacingToTheRight","indicatorText","indicatorUnit","comparisonComposition","trendLine","comparisonContainer","comparisons"],"mappings":";;;;;;AA8DA,MAAMA,iBAAiB;AAAA,EACrBC,OAAO;AAAA,EACPC,WAAWC;AAAAA,EACXC,MAAMD;AAAAA,EACNE,yBAAyBF;AAC3B;AAOaG,MAAAA,QAAQA,CAACC,UAAsB;AACpC,QAAA;AAAA,IACJC,iBAAiB;AAAA,IACjBC,kBAAkB;AAAA,IAClBC,mBAAmB;AAAA,IACnBC,2BAA2B;AAAA,IAC3BC,uBAAuB;AAAA,IACvBC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,SAASX,KAAK;AAE5B,QAAA;AAAA,IAAEO;AAAAA,IAASK;AAAAA,EAAAA,IAAOC,WAAWL,WAAW;AAExCM,QAAAA,eAAeC,UAAUtB,gBAAgBa,MAAM;AAErD,QAAMU,2BACJ,OAAOb,qBAAqB,WAAWc,eAAe;AAGtD,SAAA,qBAAC,SAAI,WAAWL,GAAGL,QAAQW,MAAMT,SAAS,GAAG,GAAIC,QAC/C,UAAA;AAAA,IAAA,oBAAC,SACC,UAAC,oBAAA,cAAA,EAAa,SAAQ,SAASI,UAAAA,cAAcpB,OAAM,EACrD,CAAA;AAAA,IACC,qBAAA,OAAA,EAAI,WAAWa,QAAQY,qBACrBjB,UAAAA;AAAAA,MACC,mBAAA,oBAAC,SACC,WAAWU,GACTL,QAAQa,0BACRb,QAAQc,iBACV,GAECnB,UACH,gBAAA,CAAA;AAAA,MAEDY,cAAcnB,aACZ,oBAAA,cAAA,EACC,WAAWiB,GAAGL,QAAQc,mBAAmBd,QAAQe,aAAa,GAC9D,SAASjB,sBAERS,uBAAanB,WAChB;AAAA,MAEDmB,cAAcjB,QACb,oBAAC,cACC,EAAA,WAAWU,QAAQgB,eACnB,SAASnB,0BAERU,UAAAA,aAAajB,KAChB,CAAA;AAAA,IAAA,GAEJ;AAAA,IACCM,oBACC,qBAAC,OAAI,EAAA,WAAWI,QAAQiB,uBACrBvB,UAAAA;AAAAA,MACC,kBAAA,oBAAC,SAAI,WAAWW,GAAGL,QAAQkB,WAAWlB,QAAQc,iBAAiB,GAC5DpB,UACH,eAAA,CAAA;AAAA,2BAED,OACC,EAAA,UAAA;AAAA,QAAA,oBAAC,SAAI,WAAWM,QAAQmB,qBACtB,UAAA,oBAAC,4BACC,WAAWd,GAAGL,QAAQoB,aAAapB,QAAQc,iBAAiB,GAC5D,SAAQ,SAEPlB,2BACH,CAAA,GACF;AAAA,QACC,oBAAA,OAAA,EAAI,WAAWI,QAAQmB,qBACtB,UAAC,oBAAA,cAAA,EAAa,WAAWnB,QAAQoB,aAAa,SAAQ,YACnDb,UAAAA,cAAchB,wBACjB,CAAA,GACF;AAAA,MAAA,GACF;AAAA,IAAA,GACF;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}

package/dist/esm/components/Link/Link.js

@@ -18,7 +18,7 @@ const HvLink = (props) => {
   } = useClasses(classesProp);
   const handleClick = (event) => {
     event.preventDefault();
-    onClick == null ? void 0 : onClick(event, data);
+    onClick?.(event, data);
   };
   return /* @__PURE__ */ jsx("a", { href: route, onClick: onClick != null ? handleClick : void 0, className: cx(classes.a, className), ...others, children });
 };

package/dist/esm/components/Link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { MouseEventHandler } from \"react\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Link.styles\";\n\nexport { staticClasses as linkClasses };\n\nexport type HvLinkClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLinkProps extends HvBaseProps<HTMLAnchorElement, \"onClick\"> {\n  onClick?: (\n    event: MouseEventHandler<HTMLAnchorElement>,\n    data: any\n  ) => void | undefined;\n  route?: string;\n  data?: any;\n  children: any;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvLinkClasses;\n}\n\nexport const HvLink = (props: HvLinkProps) => {\n  const {\n    onClick,\n    classes: classesProp,\n    className,\n    route,\n    data,\n    children,\n    ...others\n  } = useDefaultProps(\"HvLink\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const handleClick = (event) => {\n    event.preventDefault();\n\n    onClick?.(event, data);\n  };\n\n  return (\n    <a\n      href={route}\n      onClick={onClick != null ? handleClick : undefined}\n      className={cx(classes.a, className)}\n      {...others}\n    >\n      {children}\n    </a>\n  );\n};\n"],"names":["HvLink","props","onClick","classes","classesProp","className","route","data","children","others","useDefaultProps","cx","useClasses","handleClick","event","preventDefault","undefined","a"],"mappings":";;;;AAwBaA,MAAAA,SAASA,CAACC,UAAuB;AACtC,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,UAAUT,KAAK;AAE7B,QAAA;AAAA,IAAEE;AAAAA,IAASQ;AAAAA,EAAAA,IAAOC,WAAWR,WAAW;AAE9C,QAAMS,cAAeC,CAAU,UAAA;AAC7BA,UAAMC,eAAe;AAErBb,uCAAUY,OAAOP;AAAAA,EAAI;AAGvB,6BACG,KACC,EAAA,MAAMD,OACN,SAASJ,WAAW,OAAOW,cAAcG,QACzC,WAAWL,GAAGR,QAAQc,GAAGZ,SAAS,GAClC,GAAII,QAEHD,SACH,CAAA;AAEJ;"}
+{"version":3,"file":"Link.js","sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { MouseEventHandler } from \"react\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Link.styles\";\n\nexport { staticClasses as linkClasses };\n\nexport type HvLinkClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLinkProps extends HvBaseProps<HTMLAnchorElement, \"onClick\"> {\n  onClick?: (\n    event: MouseEventHandler<HTMLAnchorElement>,\n    data: any\n  ) => void | undefined;\n  route?: string;\n  data?: any;\n  children: any;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvLinkClasses;\n}\n\nexport const HvLink = (props: HvLinkProps) => {\n  const {\n    onClick,\n    classes: classesProp,\n    className,\n    route,\n    data,\n    children,\n    ...others\n  } = useDefaultProps(\"HvLink\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const handleClick = (event) => {\n    event.preventDefault();\n\n    onClick?.(event, data);\n  };\n\n  return (\n    <a\n      href={route}\n      onClick={onClick != null ? handleClick : undefined}\n      className={cx(classes.a, className)}\n      {...others}\n    >\n      {children}\n    </a>\n  );\n};\n"],"names":["HvLink","props","onClick","classes","classesProp","className","route","data","children","others","useDefaultProps","cx","useClasses","handleClick","event","preventDefault","undefined","a"],"mappings":";;;;AAwBaA,MAAAA,SAASA,CAACC,UAAuB;AACtC,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,UAAUT,KAAK;AAE7B,QAAA;AAAA,IAAEE;AAAAA,IAASQ;AAAAA,EAAAA,IAAOC,WAAWR,WAAW;AAE9C,QAAMS,cAAeC,CAAU,UAAA;AAC7BA,UAAMC,eAAe;AAErBb,cAAUY,OAAOP,IAAI;AAAA,EAAA;AAGvB,6BACG,KACC,EAAA,MAAMD,OACN,SAASJ,WAAW,OAAOW,cAAcG,QACzC,WAAWL,GAAGR,QAAQc,GAAGZ,SAAS,GAClC,GAAII,QAEHD,SACH,CAAA;AAEJ;"}

package/dist/esm/components/List/List.js

@@ -73,8 +73,8 @@ const HvList = (props) => {
     };
     const parsedList = parseList(item, passedProps, void 0, list);
     setList(parsedList);
-    onClick == null ? void 0 : onClick(evt, item);
-    onChange == null ? void 0 : onChange(parsedList);
+    onClick?.(evt, item);
+    onChange?.(parsedList);
   };
   const handleSelectAll = () => {
     const passedProps = {
@@ -85,11 +85,10 @@ const HvList = (props) => {
     const anySelectableSelected = list.some((elem) => elem.selected || elem.disabled);
     const parsedList = parseList(void 0, passedProps, !anySelectableSelected, list);
     setList(parsedList);
-    onChange == null ? void 0 : onChange(parsedList);
+    onChange?.(parsedList);
   };
   const renderLeftIcon = (item) => {
-    var _a;
-    return isValidElement(item.icon) ? item.icon : (_a = item.icon) == null ? void 0 : _a.call(item, {
+    return isValidElement(item.icon) ? item.icon : item.icon?.({
       isSelected: item.selected,
       isDisabled: item.disabled
     });
@@ -99,7 +98,7 @@ const HvList = (props) => {
       selectAll,
       selectionConjunction
     } = labels;
-    const anySelected2 = !!(selection == null ? void 0 : selection.length);
+    const anySelected2 = !!selection?.length;
     const allSelected = selection.length === list.length;
     const selectionLabel = /* @__PURE__ */ jsx(HvTypography, { component: "span", children: !anySelected2 ? /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx("b", { children: selectAll }),

package/dist/esm/components/List/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../../../../src/components/List/List.tsx"],"sourcesContent":["import {\n  AriaRole,\n  forwardRef,\n  isValidElement,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\n\nimport { FixedSizeList } from \"react-window\";\n\nimport { DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport {\n  HvListContainer,\n  HvListContainerProps,\n  HvListItem,\n} from \"@core/components/ListContainer\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { setId } from \"@core/utils/setId\";\nimport { wrapperTooltip } from \"@core/utils/wrapperTooltip\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvCheckBox } from \"@core/components/CheckBox\";\nimport { HvLink } from \"@core/components/Link\";\nimport { HvRadio } from \"@core/components/Radio\";\n\nimport { staticClasses, useClasses } from \"./List.styles\";\nimport { useSelectableList } from \"./useSelectableList\";\nimport { parseList } from \"./utils\";\nimport { HvListLabels, HvListValue } from \"./types\";\n\nexport { staticClasses as listClasses };\n\nexport type HvListClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListProps\n  extends HvBaseProps<HTMLUListElement, \"onChange\" | \"onClick\"> {\n  /**\n   * A list containing the elements to be rendered.\n   *\n   * - id: The id of the item.\n   * - label: The label of the element to be rendered.\n   * - selected: The selection state of the element.\n   * - disabled: The disabled state of the element.\n   * - isHidden: Is item visible.\n   * - icon: The icon.\n   * - showNavIcon: If true renders the navigation icon on the right.\n   * - path: The path to navigate to.\n   */\n  values: HvListValue[];\n  /** If true renders a multi select list. */\n  multiSelect?: boolean;\n  /**\n   * If true renders select all option for multi selection lists with selectors.\n   * note: It will only be rendered if multiSelect and useSelector props are set to true.\n   */\n  showSelectAll?: boolean;\n  /** An object containing all the labels for the dropdown. */\n  labels?: HvListLabels;\n  /** If true renders list items with radio or checkbox selectors. */\n  useSelector?: boolean;\n  /** Call back fired when list item is selected. Returns selection state. */\n  onChange?: (value: HvListValue[]) => void;\n  /** Call back fired when list item is selected. Returns selected item. */\n  onClick?: (\n    event: React.ChangeEvent<HTMLLIElement>,\n    value: HvListValue\n  ) => void;\n  /** If `true` the list items will show the selection state. */\n  selectable?: boolean;\n  /** If `true`, selection can be toggled when single selection. */\n  singleSelectionToggle?: boolean;\n  /** If `true` the list will be rendered without vertical spacing. */\n  condensed?: boolean;\n  /** If `true` the dropdown will show tooltips when user mouseenter text in list */\n  hasTooltips?: boolean;\n  /** Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used */\n  height?: number;\n  /** Experimental. Uses dropdown in a virtualized form, where not all options are rendered initially. Good for use cases with a lot of options. */\n  virtualized?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvListClasses;\n}\n\nconst DEFAULT_LABELS = {\n  selectAll: \"Select All\",\n  selectionConjunction: \"/\",\n};\n\n/**\n * Component used to show a set of related data to the user.\n */\nexport const HvList = (props: HvListProps) => {\n  const {\n    id,\n    classes: classesProp,\n    className,\n    multiSelect = false,\n    hasTooltips = false,\n    showSelectAll = false,\n    labels = DEFAULT_LABELS,\n    useSelector = false,\n    selectable = true,\n    singleSelectionToggle = true,\n    condensed = false,\n    onChange,\n    onClick,\n    values: valuesProp = [],\n    height,\n    virtualized = false,\n    ...others\n  } = useDefaultProps(\"HvList\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const [list, setList, selection] = useSelectableList(valuesProp);\n  const listRef = useRef<any>(null);\n\n  useEffect(() => {\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const parsedList: HvListValue[] = parseList(\n      undefined,\n      passedProps,\n      undefined,\n      valuesProp\n    );\n\n    setList(parsedList);\n  }, [valuesProp, multiSelect, selectable, singleSelectionToggle, setList]);\n\n  const [role, itemRole] = useMemo<[AriaRole, AriaRole]>(() => {\n    // selectors are responsible for the role & selection state\n    if (selectable && useSelector) return [\"list\", \"listitem\"];\n\n    if (selectable) return [\"listbox\", \"option\"];\n    return [\"menu\", \"menuitem\"];\n  }, [selectable, useSelector]);\n\n  const handleSelect = (evt, item) => {\n    if (!item.path) evt.preventDefault();\n    if (item.disabled) return;\n\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const parsedList = parseList(item, passedProps, undefined, list);\n    setList(parsedList);\n\n    onClick?.(evt, item);\n    onChange?.(parsedList);\n  };\n\n  const handleSelectAll = () => {\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const anySelectableSelected = list.some(\n      (elem) => elem.selected || elem.disabled\n    );\n    const parsedList = parseList(\n      undefined,\n      passedProps,\n      !anySelectableSelected,\n      list\n    );\n    setList(parsedList);\n\n    onChange?.(parsedList);\n  };\n\n  const renderLeftIcon = (item) => {\n    return isValidElement(item.icon)\n      ? item.icon\n      : item.icon?.({\n          isSelected: item.selected,\n          isDisabled: item.disabled,\n        });\n  };\n\n  const renderSelectAll = () => {\n    const { selectAll, selectionConjunction } = labels;\n\n    const anySelected = !!selection?.length;\n    const allSelected = selection.length === list.length;\n\n    const selectionLabel = (\n      <HvTypography component=\"span\">\n        {!anySelected ? (\n          <>\n            <b>{selectAll}</b>\n            {` (${list.length})`}\n          </>\n        ) : (\n          <>\n            <b>{selection.length}</b>\n            {`\\xa0${selectionConjunction}\\xa0`}\n            {list.length}\n          </>\n        )}\n      </HvTypography>\n    );\n\n    return (\n      <HvCheckBox\n        id={setId(id, \"select-all\")}\n        label={selectionLabel}\n        onChange={handleSelectAll}\n        className={classes.selectAllSelector}\n        indeterminate={anySelected && !allSelected}\n        checked={allSelected}\n      />\n    );\n  };\n\n  const renderItemText = (item) => {\n    const ItemText = wrapperTooltip(hasTooltips, item.label, item.label);\n\n    return !multiSelect && item.path ? (\n      <HvLink key={item.label} route={item.path} classes={{ a: classes.link }}>\n        <ItemText />\n      </HvLink>\n    ) : (\n      <ItemText />\n    );\n  };\n\n  const renderMultiSelectItem = (item, itemId) => {\n    if (useSelector) {\n      const Selection = wrapperTooltip(\n        hasTooltips,\n        <HvCheckBox\n          id={setId(itemId, \"selector\")}\n          label={item.label}\n          checked={item.selected}\n          disabled={item.disabled}\n          onChange={(evt) => handleSelect(evt, item)}\n          classes={{\n            root: classes.selectorRoot,\n            container: classes.selectorContainer,\n            label: classes.truncate,\n          }}\n        />,\n        item.label\n      );\n      return <Selection />;\n    }\n\n    return renderItemText(item);\n  };\n\n  const renderSingleSelectItem = (item, itemId) => {\n    if (useSelector) {\n      const Selection = wrapperTooltip(\n        hasTooltips,\n        <HvRadio\n          id={setId(itemId, \"selector\")}\n          label={item.label}\n          checked={item.selected}\n          disabled={item.disabled}\n          classes={{\n            root: classes.selectorRoot,\n            container: classes.selectorContainer,\n            label: classes.truncate,\n          }}\n        />,\n        item.label\n      );\n      return <Selection />;\n    }\n    return renderItemText(item);\n  };\n\n  const renderListItem = (item, i, otherProps = {}) => {\n    const itemId = setId(id, \"item\", i);\n    const selected = item.selected || false;\n\n    let startAdornment = null;\n    if (!useSelector && item.icon) {\n      startAdornment = renderLeftIcon(item);\n    }\n\n    return (\n      <HvListItem\n        key={i}\n        id={itemId}\n        role={itemRole}\n        disabled={item.disabled || undefined}\n        className={classes.item}\n        classes={{\n          selected: cx({\n            [classes.itemSelector]: useSelector || multiSelect,\n          }),\n        }}\n        selected={multiSelect || selected ? selected : undefined}\n        onClick={(evt) => handleSelect(evt, item)}\n        startAdornment={startAdornment}\n        endAdornment={\n          item.showNavIcon && (\n            <DropRightXS className={classes.box} iconSize=\"XS\" />\n          )\n        }\n        {...otherProps}\n      >\n        {multiSelect\n          ? renderMultiSelectItem(item, itemId)\n          : renderSingleSelectItem(item, itemId)}\n      </HvListItem>\n    );\n  };\n\n  const filteredList = list.filter((it) => !it.isHidden);\n  const anySelected = list\n    .map((item) => item.selected && !item.disabled)\n    .reduce((result, selected) => result || selected, false);\n\n  const selectedItemIndex = list.findIndex((item) => item.selected);\n  useEffect(() => {\n    if (selectedItemIndex >= 0 && listRef.current !== null) {\n      listRef.current.scrollToItem(selectedItemIndex);\n    }\n  }, [listRef, selectedItemIndex]);\n\n  const renderVirtualizedListItem = ({ index, style }) => {\n    const item = filteredList[index];\n    const tabIndex =\n      item.tabIndex ||\n      (!anySelected && index === 0) ||\n      (item.selected && !item.disabled)\n        ? 0\n        : -1;\n\n    return renderListItem(item, index, {\n      style: {\n        ...style,\n        top: `${parseFloat(style.top) + 5}px`,\n        left: `${parseFloat(style.left) + 5}px`,\n        width: `calc(${parseFloat(style.width)}% - 10px)`,\n      },\n      tabIndex,\n      interactive: true,\n      condensed,\n      disableGutters: useSelector,\n    });\n  };\n\n  const ariaMultiSelectable = (role === \"listbox\" && multiSelect) || undefined;\n\n  const ListContainer = useMemo(() => {\n    return forwardRef<HTMLUListElement, HvListContainerProps>(\n      ({ ...rest }, ref) => (\n        <HvListContainer\n          id={id}\n          className={cx(classes.root, className)}\n          role={role}\n          interactive\n          condensed={condensed}\n          disableGutters={useSelector}\n          aria-multiselectable={ariaMultiSelectable}\n          ref={ref}\n          {...rest}\n        />\n      )\n    );\n  }, [\n    cx,\n    id,\n    useSelector,\n    className,\n    classes.root,\n    role,\n    condensed,\n    ariaMultiSelectable,\n  ]);\n\n  // Render nothing if there are no items\n  if (filteredList.length === 0) return null;\n\n  return (\n    <>\n      {multiSelect && useSelector && showSelectAll && renderSelectAll()}\n\n      {!virtualized ? (\n        <HvListContainer\n          id={id}\n          className={cx(classes.root, className)}\n          role={role}\n          interactive\n          condensed={condensed}\n          disableGutters={useSelector}\n          aria-multiselectable={ariaMultiSelectable}\n          {...others}\n        >\n          {filteredList.map((item, i) => renderListItem(item, i))}\n        </HvListContainer>\n      ) : (\n        <FixedSizeList\n          ref={listRef}\n          className={classes.virtualizedRoot}\n          height={(height || 0) + 5}\n          width=\"100%\"\n          itemCount={filteredList.length}\n          itemSize={condensed ? 32 : 40}\n          innerElementType={ListContainer}\n          {...others}\n        >\n          {renderVirtualizedListItem}\n        </FixedSizeList>\n      )}\n    </>\n  );\n};\n"],"names":["DEFAULT_LABELS","selectAll","selectionConjunction","HvList","props","id","classes","classesProp","className","multiSelect","hasTooltips","showSelectAll","labels","useSelector","selectable","singleSelectionToggle","condensed","onChange","onClick","values","valuesProp","height","virtualized","others","useDefaultProps","cx","useClasses","list","setList","selection","useSelectableList","listRef","useRef","useEffect","passedProps","parsedList","parseList","undefined","role","itemRole","useMemo","handleSelect","evt","item","path","preventDefault","disabled","handleSelectAll","anySelectableSelected","some","elem","selected","renderLeftIcon","isValidElement","icon","isSelected","isDisabled","renderSelectAll","anySelected","length","allSelected","selectionLabel","setId","selectAllSelector","renderItemText","ItemText","wrapperTooltip","label","a","link","renderMultiSelectItem","itemId","Selection","root","selectorRoot","container","selectorContainer","truncate","renderSingleSelectItem","renderListItem","i","otherProps","startAdornment","itemSelector","showNavIcon","box","filteredList","filter","it","isHidden","map","reduce","result","selectedItemIndex","findIndex","current","scrollToItem","renderVirtualizedListItem","index","style","tabIndex","top","parseFloat","left","width","interactive","disableGutters","ariaMultiSelectable","ListContainer","forwardRef","rest","ref","virtualizedRoot"],"mappings":"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"}
+{"version":3,"file":"List.js","sources":["../../../../src/components/List/List.tsx"],"sourcesContent":["import {\n  AriaRole,\n  forwardRef,\n  isValidElement,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\n\nimport { FixedSizeList } from \"react-window\";\n\nimport { DropRightXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport {\n  HvListContainer,\n  HvListContainerProps,\n  HvListItem,\n} from \"@core/components/ListContainer\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { setId } from \"@core/utils/setId\";\nimport { wrapperTooltip } from \"@core/utils/wrapperTooltip\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvCheckBox } from \"@core/components/CheckBox\";\nimport { HvLink } from \"@core/components/Link\";\nimport { HvRadio } from \"@core/components/Radio\";\n\nimport { staticClasses, useClasses } from \"./List.styles\";\nimport { useSelectableList } from \"./useSelectableList\";\nimport { parseList } from \"./utils\";\nimport { HvListLabels, HvListValue } from \"./types\";\n\nexport { staticClasses as listClasses };\n\nexport type HvListClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListProps\n  extends HvBaseProps<HTMLUListElement, \"onChange\" | \"onClick\"> {\n  /**\n   * A list containing the elements to be rendered.\n   *\n   * - id: The id of the item.\n   * - label: The label of the element to be rendered.\n   * - selected: The selection state of the element.\n   * - disabled: The disabled state of the element.\n   * - isHidden: Is item visible.\n   * - icon: The icon.\n   * - showNavIcon: If true renders the navigation icon on the right.\n   * - path: The path to navigate to.\n   */\n  values: HvListValue[];\n  /** If true renders a multi select list. */\n  multiSelect?: boolean;\n  /**\n   * If true renders select all option for multi selection lists with selectors.\n   * note: It will only be rendered if multiSelect and useSelector props are set to true.\n   */\n  showSelectAll?: boolean;\n  /** An object containing all the labels for the dropdown. */\n  labels?: HvListLabels;\n  /** If true renders list items with radio or checkbox selectors. */\n  useSelector?: boolean;\n  /** Call back fired when list item is selected. Returns selection state. */\n  onChange?: (value: HvListValue[]) => void;\n  /** Call back fired when list item is selected. Returns selected item. */\n  onClick?: (\n    event: React.ChangeEvent<HTMLLIElement>,\n    value: HvListValue\n  ) => void;\n  /** If `true` the list items will show the selection state. */\n  selectable?: boolean;\n  /** If `true`, selection can be toggled when single selection. */\n  singleSelectionToggle?: boolean;\n  /** If `true` the list will be rendered without vertical spacing. */\n  condensed?: boolean;\n  /** If `true` the dropdown will show tooltips when user mouseenter text in list */\n  hasTooltips?: boolean;\n  /** Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used */\n  height?: number;\n  /** Experimental. Uses dropdown in a virtualized form, where not all options are rendered initially. Good for use cases with a lot of options. */\n  virtualized?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvListClasses;\n}\n\nconst DEFAULT_LABELS = {\n  selectAll: \"Select All\",\n  selectionConjunction: \"/\",\n};\n\n/**\n * Component used to show a set of related data to the user.\n */\nexport const HvList = (props: HvListProps) => {\n  const {\n    id,\n    classes: classesProp,\n    className,\n    multiSelect = false,\n    hasTooltips = false,\n    showSelectAll = false,\n    labels = DEFAULT_LABELS,\n    useSelector = false,\n    selectable = true,\n    singleSelectionToggle = true,\n    condensed = false,\n    onChange,\n    onClick,\n    values: valuesProp = [],\n    height,\n    virtualized = false,\n    ...others\n  } = useDefaultProps(\"HvList\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const [list, setList, selection] = useSelectableList(valuesProp);\n  const listRef = useRef<any>(null);\n\n  useEffect(() => {\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const parsedList: HvListValue[] = parseList(\n      undefined,\n      passedProps,\n      undefined,\n      valuesProp\n    );\n\n    setList(parsedList);\n  }, [valuesProp, multiSelect, selectable, singleSelectionToggle, setList]);\n\n  const [role, itemRole] = useMemo<[AriaRole, AriaRole]>(() => {\n    // selectors are responsible for the role & selection state\n    if (selectable && useSelector) return [\"list\", \"listitem\"];\n\n    if (selectable) return [\"listbox\", \"option\"];\n    return [\"menu\", \"menuitem\"];\n  }, [selectable, useSelector]);\n\n  const handleSelect = (evt, item) => {\n    if (!item.path) evt.preventDefault();\n    if (item.disabled) return;\n\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const parsedList = parseList(item, passedProps, undefined, list);\n    setList(parsedList);\n\n    onClick?.(evt, item);\n    onChange?.(parsedList);\n  };\n\n  const handleSelectAll = () => {\n    const passedProps = { multiSelect, selectable, singleSelectionToggle };\n    const anySelectableSelected = list.some(\n      (elem) => elem.selected || elem.disabled\n    );\n    const parsedList = parseList(\n      undefined,\n      passedProps,\n      !anySelectableSelected,\n      list\n    );\n    setList(parsedList);\n\n    onChange?.(parsedList);\n  };\n\n  const renderLeftIcon = (item) => {\n    return isValidElement(item.icon)\n      ? item.icon\n      : item.icon?.({\n          isSelected: item.selected,\n          isDisabled: item.disabled,\n        });\n  };\n\n  const renderSelectAll = () => {\n    const { selectAll, selectionConjunction } = labels;\n\n    const anySelected = !!selection?.length;\n    const allSelected = selection.length === list.length;\n\n    const selectionLabel = (\n      <HvTypography component=\"span\">\n        {!anySelected ? (\n          <>\n            <b>{selectAll}</b>\n            {` (${list.length})`}\n          </>\n        ) : (\n          <>\n            <b>{selection.length}</b>\n            {`\\xa0${selectionConjunction}\\xa0`}\n            {list.length}\n          </>\n        )}\n      </HvTypography>\n    );\n\n    return (\n      <HvCheckBox\n        id={setId(id, \"select-all\")}\n        label={selectionLabel}\n        onChange={handleSelectAll}\n        className={classes.selectAllSelector}\n        indeterminate={anySelected && !allSelected}\n        checked={allSelected}\n      />\n    );\n  };\n\n  const renderItemText = (item) => {\n    const ItemText = wrapperTooltip(hasTooltips, item.label, item.label);\n\n    return !multiSelect && item.path ? (\n      <HvLink key={item.label} route={item.path} classes={{ a: classes.link }}>\n        <ItemText />\n      </HvLink>\n    ) : (\n      <ItemText />\n    );\n  };\n\n  const renderMultiSelectItem = (item, itemId) => {\n    if (useSelector) {\n      const Selection = wrapperTooltip(\n        hasTooltips,\n        <HvCheckBox\n          id={setId(itemId, \"selector\")}\n          label={item.label}\n          checked={item.selected}\n          disabled={item.disabled}\n          onChange={(evt) => handleSelect(evt, item)}\n          classes={{\n            root: classes.selectorRoot,\n            container: classes.selectorContainer,\n            label: classes.truncate,\n          }}\n        />,\n        item.label\n      );\n      return <Selection />;\n    }\n\n    return renderItemText(item);\n  };\n\n  const renderSingleSelectItem = (item, itemId) => {\n    if (useSelector) {\n      const Selection = wrapperTooltip(\n        hasTooltips,\n        <HvRadio\n          id={setId(itemId, \"selector\")}\n          label={item.label}\n          checked={item.selected}\n          disabled={item.disabled}\n          classes={{\n            root: classes.selectorRoot,\n            container: classes.selectorContainer,\n            label: classes.truncate,\n          }}\n        />,\n        item.label\n      );\n      return <Selection />;\n    }\n    return renderItemText(item);\n  };\n\n  const renderListItem = (item, i, otherProps = {}) => {\n    const itemId = setId(id, \"item\", i);\n    const selected = item.selected || false;\n\n    let startAdornment = null;\n    if (!useSelector && item.icon) {\n      startAdornment = renderLeftIcon(item);\n    }\n\n    return (\n      <HvListItem\n        key={i}\n        id={itemId}\n        role={itemRole}\n        disabled={item.disabled || undefined}\n        className={classes.item}\n        classes={{\n          selected: cx({\n            [classes.itemSelector]: useSelector || multiSelect,\n          }),\n        }}\n        selected={multiSelect || selected ? selected : undefined}\n        onClick={(evt) => handleSelect(evt, item)}\n        startAdornment={startAdornment}\n        endAdornment={\n          item.showNavIcon && (\n            <DropRightXS className={classes.box} iconSize=\"XS\" />\n          )\n        }\n        {...otherProps}\n      >\n        {multiSelect\n          ? renderMultiSelectItem(item, itemId)\n          : renderSingleSelectItem(item, itemId)}\n      </HvListItem>\n    );\n  };\n\n  const filteredList = list.filter((it) => !it.isHidden);\n  const anySelected = list\n    .map((item) => item.selected && !item.disabled)\n    .reduce((result, selected) => result || selected, false);\n\n  const selectedItemIndex = list.findIndex((item) => item.selected);\n  useEffect(() => {\n    if (selectedItemIndex >= 0 && listRef.current !== null) {\n      listRef.current.scrollToItem(selectedItemIndex);\n    }\n  }, [listRef, selectedItemIndex]);\n\n  const renderVirtualizedListItem = ({ index, style }) => {\n    const item = filteredList[index];\n    const tabIndex =\n      item.tabIndex ||\n      (!anySelected && index === 0) ||\n      (item.selected && !item.disabled)\n        ? 0\n        : -1;\n\n    return renderListItem(item, index, {\n      style: {\n        ...style,\n        top: `${parseFloat(style.top) + 5}px`,\n        left: `${parseFloat(style.left) + 5}px`,\n        width: `calc(${parseFloat(style.width)}% - 10px)`,\n      },\n      tabIndex,\n      interactive: true,\n      condensed,\n      disableGutters: useSelector,\n    });\n  };\n\n  const ariaMultiSelectable = (role === \"listbox\" && multiSelect) || undefined;\n\n  const ListContainer = useMemo(() => {\n    return forwardRef<HTMLUListElement, HvListContainerProps>(\n      ({ ...rest }, ref) => (\n        <HvListContainer\n          id={id}\n          className={cx(classes.root, className)}\n          role={role}\n          interactive\n          condensed={condensed}\n          disableGutters={useSelector}\n          aria-multiselectable={ariaMultiSelectable}\n          ref={ref}\n          {...rest}\n        />\n      )\n    );\n  }, [\n    cx,\n    id,\n    useSelector,\n    className,\n    classes.root,\n    role,\n    condensed,\n    ariaMultiSelectable,\n  ]);\n\n  // Render nothing if there are no items\n  if (filteredList.length === 0) return null;\n\n  return (\n    <>\n      {multiSelect && useSelector && showSelectAll && renderSelectAll()}\n\n      {!virtualized ? (\n        <HvListContainer\n          id={id}\n          className={cx(classes.root, className)}\n          role={role}\n          interactive\n          condensed={condensed}\n          disableGutters={useSelector}\n          aria-multiselectable={ariaMultiSelectable}\n          {...others}\n        >\n          {filteredList.map((item, i) => renderListItem(item, i))}\n        </HvListContainer>\n      ) : (\n        <FixedSizeList\n          ref={listRef}\n          className={classes.virtualizedRoot}\n          height={(height || 0) + 5}\n          width=\"100%\"\n          itemCount={filteredList.length}\n          itemSize={condensed ? 32 : 40}\n          innerElementType={ListContainer}\n          {...others}\n        >\n          {renderVirtualizedListItem}\n        </FixedSizeList>\n      )}\n    </>\n  );\n};\n"],"names":["DEFAULT_LABELS","selectAll","selectionConjunction","HvList","props","id","classes","classesProp","className","multiSelect","hasTooltips","showSelectAll","labels","useSelector","selectable","singleSelectionToggle","condensed","onChange","onClick","values","valuesProp","height","virtualized","others","useDefaultProps","cx","useClasses","list","setList","selection","useSelectableList","listRef","useRef","useEffect","passedProps","parsedList","parseList","undefined","role","itemRole","useMemo","handleSelect","evt","item","path","preventDefault","disabled","handleSelectAll","anySelectableSelected","some","elem","selected","renderLeftIcon","isValidElement","icon","isSelected","isDisabled","renderSelectAll","anySelected","length","allSelected","selectionLabel","setId","selectAllSelector","renderItemText","ItemText","wrapperTooltip","label","a","link","renderMultiSelectItem","itemId","Selection","root","selectorRoot","container","selectorContainer","truncate","renderSingleSelectItem","renderListItem","i","otherProps","startAdornment","itemSelector","showNavIcon","box","filteredList","filter","it","isHidden","map","reduce","result","selectedItemIndex","findIndex","current","scrollToItem","renderVirtualizedListItem","index","style","tabIndex","top","parseFloat","left","width","interactive","disableGutters","ariaMultiSelectable","ListContainer","forwardRef","rest","ref","virtualizedRoot"],"mappings":"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"}