npm - @hitachivantara/uikit-react-core - Versions diffs - 5.32.0 → 5.34.0 - Mend

@hitachivantara/uikit-react-core 5.32.0 → 5.34.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (728) hide show

package/dist/cjs/components/TagsInput/TagsInput.cjs CHANGED Viewed

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
-const isNil = require("lodash/isNil");
 const material = require("@mui/material");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const useControlled = require("../../hooks/useControlled.cjs");
@@ -25,10 +24,7 @@ const ListItem = require("../ListContainer/ListItem/ListItem.cjs");
 const BaseInput_styles = require("../BaseInput/BaseInput.styles.cjs");
 const Suggestions = require("../Forms/Suggestions/Suggestions.cjs");
 const WarningText = require("../Forms/WarningText/WarningText.cjs");
-const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const isNil__default = /* @__PURE__ */ _interopDefault(isNil);
 const HvTagsInput = React.forwardRef((props, ref) => {
-  var _a;
   const {
     classes: classesProp,
     className,
@@ -110,14 +106,13 @@ const HvTagsInput = React.forwardRef((props, ref) => {
     }
   }, [errorMessages.maxCharError, maxTagsQuantity, setValidationMessage, setValidationState]);
   const deleteTag = React.useCallback((tagPos, event, end) => {
-    var _a2;
     const newTagsArr = [...value.slice(0, tagPos), ...value.slice(tagPos + 1)];
     setValue(newTagsArr);
     setTagCursorPos(end ? newTagsArr.length : tagCursorPos > 0 ? tagCursorPos - 1 : 0);
-    (_a2 = inputRef.current) == null ? void 0 : _a2.focus();
+    inputRef.current?.focus();
     performValidation(newTagsArr);
-    onDelete == null ? void 0 : onDelete(event, value[tagPos], tagPos);
-    onChange == null ? void 0 : onChange(event, newTagsArr);
+    onDelete?.(event, value[tagPos], tagPos);
+    onChange?.(event, newTagsArr);
     skipReset.current = true;
   }, [onChange, onDelete, performValidation, setValue, tagCursorPos, value]);
   const addTag = React.useCallback((event, tag) => {
@@ -130,22 +125,21 @@ const HvTagsInput = React.forwardRef((props, ref) => {
       const newTagsArr = [...value, newTag];
       setValue(newTagsArr);
       performValidation(newTagsArr);
-      onAdd == null ? void 0 : onAdd(event, newTag, newTagsArr.length - 1);
-      onChange == null ? void 0 : onChange(event, newTagsArr);
+      onAdd?.(event, newTag, newTagsArr.length - 1);
+      onChange?.(event, newTagsArr);
     }
   }, [onAdd, onChange, performValidation, setValue, value]);
   const canShowError = status !== void 0 && status === "invalid" && statusMessage !== void 0 || !stateValid;
   React.useEffect(() => {
-    var _a2;
     if (!multiline) {
-      const element = (_a2 = containerRef == null ? void 0 : containerRef.current) == null ? void 0 : _a2.children[tagCursorPos];
+      const element = containerRef?.current?.children[tagCursorPos];
       setTimeout(() => {
         const container = containerRef.current;
-        if (isNil__default.default(container))
+        if (container == null)
           return;
         container.scrollLeft = element ? element.offsetLeft - container.getBoundingClientRect().width / 2 + element.getBoundingClientRect().width / 2 : 0;
       }, 50);
-      element == null ? void 0 : element.focus();
+      element?.focus();
     }
   }, [multiline, tagCursorPos]);
   React.useEffect(() => {
@@ -160,9 +154,8 @@ const HvTagsInput = React.forwardRef((props, ref) => {
     materialInputRef.current.focus();
   };
   const getSuggestions = React.useCallback((li) => {
-    var _a2;
     const listEl = document.getElementById(setId.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;
   }, [elementId]);
   const suggestionClearHandler = React.useCallback(() => {
     if (isMounted.current) {
@@ -170,9 +163,8 @@ const HvTagsInput = React.forwardRef((props, ref) => {
     }
   }, [isMounted]);
   const suggestionHandler = React.useCallback((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();
@@ -204,7 +196,6 @@ const HvTagsInput = React.forwardRef((props, ref) => {
     }
   }, [addTag, canShowSuggestions, commitTagOn, tagInput]);
   const onKeyDownHandler = React.useCallback((event) => {
-    var _a2;
     if (tagInput === "") {
       switch (event.code) {
         case "ArrowLeft":
@@ -229,7 +220,7 @@ const HvTagsInput = React.forwardRef((props, ref) => {
     } else {
       switch (event.code) {
         case "ArrowDown":
-          (_a2 = getSuggestions(0)) == null ? void 0 : _a2.focus();
+          getSuggestions(0)?.focus();
           break;
       }
     }
@@ -239,8 +230,7 @@ const HvTagsInput = React.forwardRef((props, ref) => {
     setValidationState(validationStates.default.standBy);
   }, [deleteTag, setValidationState]);
   const onContainerClickHandler = React.useCallback(() => {
-    var _a2;
-    (_a2 = inputRef.current) == null ? void 0 : _a2.focus();
+    inputRef.current?.focus();
     clearTimeout(blurTimeout.current);
     setTagCursorPos(value.length);
   }, [value.length]);
@@ -249,12 +239,12 @@ const HvTagsInput = React.forwardRef((props, ref) => {
       if (commitOnBlur) {
         addTag(evt, tagInput);
       }
-      onBlur == null ? void 0 : onBlur(evt, tagInput);
+      onBlur?.(evt, tagInput);
     }, 250);
   };
   const onFocusHandler = (evt) => {
     clearTimeout(blurTimeout.current);
-    onFocus == null ? void 0 : onFocus(evt, tagInput);
+    onFocus?.(evt, tagInput);
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(FormElement.HvFormElement, { id, name, disabled, readOnly, status: validationState, required, onBlur: onBlurHandler, onFocus: onFocusHandler, className: cx(classes.root, {
     [classes.disabled]: disabled,
@@ -326,7 +316,7 @@ const HvTagsInput = React.forwardRef((props, ref) => {
       /* @__PURE__ */ jsxRuntime.jsx(Suggestions.HvSuggestions, { id: setId.setId(elementId, "suggestions"), classes: {
         root: classes.suggestionsContainer,
         list: classes.suggestionList
-      }, expanded: hasSuggestions, anchorEl: (_a = containerRef == null ? void 0 : containerRef.current) == null ? void 0 : _a.parentElement, onClose: suggestionClearHandler, onKeyDown: onSuggestionKeyDown, onSuggestionSelected: suggestionSelectedHandler, suggestionValues })
+      }, expanded: hasSuggestions, anchorEl: containerRef?.current?.parentElement, onClose: suggestionClearHandler, onKeyDown: onSuggestionKeyDown, onSuggestionSelected: suggestionSelectedHandler, suggestionValues })
     ] }),
     canShowError && /* @__PURE__ */ jsxRuntime.jsx(WarningText.HvWarningText, { id: setId.setId(elementId, "error"), disableBorder: true, className: classes.error, children: validationMessage })
   ] });

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TagsInput.cjs","sources":["../../../../src/components/TagsInput/TagsInput.tsx"],"sourcesContent":["import React, {\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport isNil from \"lodash/isNil\";\n\nimport {\n InputBaseComponentProps as MuiInputBaseComponentProps,\n useForkRef,\n} from \"@mui/material\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvListContainer, HvListItem } from \"@core/components/ListContainer\";\nimport { baseInputClasses } from \"@core/components/BaseInput\";\nimport { HvInput } from \"@core/components/Input\";\nimport { HvTagSuggestion, HvValidationMessages } from \"@core/types/forms\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useIsMounted } from \"@core/hooks/useIsMounted\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport validationStates from \"@core/components/Forms/FormElement/validationStates\";\nimport { DEFAULT_ERROR_MESSAGES } from \"@core/components/BaseInput/validations\";\nimport { HvTag, HvTagProps } from \"@core/components/Tag\";\nimport {\n HvCharCounter,\n HvCharCounterProps,\n HvFormElement,\n HvFormStatus,\n HvInfoMessage,\n HvLabel,\n HvSuggestions,\n HvWarningText,\n} from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./TagsInput.styles\";\n\nexport { staticClasses as tagsInputClasses };\n\nexport type HvTagsInputClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTagsInputProps\n extends HvBaseProps<\n HTMLElement,\n \"onChange\" \| \"onBlur\" \| \"onFocus\" \| \"onKeyDown\" \| \"color\" \| \"defaultValue\"\n > {\n /** The form element name. /\n name?: string;\n /* The value of the form element. /\n value?: string[] \| HvTagProps[];\n /* When uncontrolled, defines the initial input value. /\n defaultValue?: string[] \| HvTagProps[];\n /\n The label of the form element.\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n /\n label?: React.ReactNode;\n /* Provide additional descriptive text for the form element. /\n description?: React.ReactNode;\n /* Indicates that the form element is disabled. /\n disabled?: boolean;\n /* Indicates that the form element is not editable. /\n readOnly?: boolean;\n /* Indicates that the form element is required. /\n required?: boolean;\n /* The function that will be executed onChange. /\n onChange?: (\n event:\n \| React.ChangeEvent<HTMLInputElement>\n \| React.KeyboardEvent<HTMLInputElement>\n \| React.MouseEvent<HTMLButtonElement>\n \| React.MouseEvent<HTMLElement, MouseEvent>\n \| React.KeyboardEventHandler<HTMLElement>,\n value: HvTagProps[]\n ) => void;\n /* The function that will be executed when the element is focused. /\n onFocus?: (event: React.FocusEvent<HTMLInputElement>, value: string) => void;\n /* The function that will be executed when the element is blurred. /\n onBlur?: (event: React.FocusEvent<HTMLInputElement>, value: string) => void;\n /* The function that will be executed when a tag is deleted. /\n onDelete?: (\n event:\n \| React.ChangeEvent<HTMLInputElement>\n \| React.KeyboardEvent<HTMLInputElement>\n \| React.MouseEvent<HTMLButtonElement>\n \| React.MouseEvent<HTMLElement, MouseEvent>\n \| React.KeyboardEventHandler<HTMLElement>,\n value: HvTagProps,\n index: number\n ) => void;\n /* The function that will be executed when a tag is added. /\n onAdd?: (\n event:\n \| React.ChangeEvent<HTMLInputElement>\n \| React.KeyboardEvent<HTMLInputElement>\n \| React.MouseEvent<HTMLButtonElement>\n \| React.MouseEvent<HTMLElement, MouseEvent>\n \| React.KeyboardEventHandler<HTMLElement>,\n value: HvTagProps,\n index: number\n ) => void;\n /* The placeholder value of the input. /\n placeholder?: string;\n /* If `true` the character counter isn't shown even if maxTagsQuantity is set. /\n hideCounter?: boolean;\n /* Text between the current char counter and max value. /\n middleCountLabel?: string;\n /* The maximum allowed length of the characters, if this value is null no check will be performed. /\n maxTagsQuantity?: number;\n /* Attributes applied to the input element. /\n inputProps?: MuiInputBaseComponentProps;\n /* If `true` it should autofocus. /\n autoFocus?: boolean;\n /* If `true` the component is resizable. /\n resizable?: boolean;\n /* Props passed to the HvCharCount component. /\n countCharProps?: Partial<HvCharCounterProps>;\n /* If `true` the component is in multiline mode. /\n multiline?: boolean;\n /* The status of the form element. /\n status?: HvFormStatus;\n /* The error message to show when `status` is \"invalid\". /\n statusMessage?: React.ReactNode;\n /* An Object containing the various texts associated with the input. /\n validationMessages?: HvValidationMessages;\n /* An array of strings that represent the character used to input a tag. This character is the string representation of the event.code from the input event. /\n commitTagOn?: string[];\n /* If `true` the tag will be committed when the blur event occurs. /\n commitOnBlur?: boolean;\n /* The function that will be executed to received an array of objects that has a label and id to create list of suggestion /\n suggestionListCallback?: (value: string) => HvTagSuggestion[] \| null;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvTagsInputClasses;\n}\n\n/\n A tags input is a single or multiline control that allows the input of tags.\n /\nexport const HvTagsInput = forwardRef<HTMLUListElement, HvTagsInputProps>(\n (props, ref) => {\n const {\n classes: classesProp,\n className,\n id,\n name,\n value: valueProp,\n defaultValue = [],\n readOnly = false,\n disabled = false,\n required = false,\n label: textAreaLabel,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n onChange,\n onAdd,\n onDelete,\n onBlur,\n onFocus,\n placeholder,\n hideCounter = false,\n middleCountLabel = \"/\",\n maxTagsQuantity,\n autoFocus = false,\n resizable = true,\n inputProps = {},\n countCharProps = {},\n multiline = false,\n status,\n statusMessage,\n validationMessages,\n commitTagOn = [\"Enter\"],\n commitOnBlur = false,\n suggestionListCallback,\n ...others\n } = useDefaultProps(\"HvTagsInput\", props);\n\n const { classes, cx, css } = useClasses(classesProp);\n\n const elementId = useUniqueId(id, \"hvTagsInput\");\n\n const hasLabel = textAreaLabel != null;\n const hasDescription = description != null;\n\n const [value, setValue] = useControlled(valueProp, defaultValue);\n\n const [validationState, setValidationState] = useControlled(\n status,\n validationStates.standBy\n );\n const [validationMessage, setValidationMessage] = useControlled(\n statusMessage,\n \"\"\n );\n\n const [tagInput, setTagInput] = useState(\"\");\n const [tagCursorPos, setTagCursorPos] = useState(value.length);\n const [stateValid, setStateValid] = useState(true);\n\n const inputRef = useRef<any>();\n const containerRef = useRef<any>();\n const skipReset = useRef(false);\n const blurTimeout = useRef<any>();\n const materialInputRef = useRef<any>(null);\n\n const forkedContainerRef = useForkRef(ref, containerRef);\n\n const isTagSelected = tagCursorPos >= 0 && tagCursorPos < value.length;\n const hasCounter = maxTagsQuantity != null && !hideCounter;\n\n // suggestions related state\n const [suggestionValues, setSuggestionValues] = useState<\n HvTagSuggestion[] \| null\n >(null);\n\n const isStateInvalid = useMemo(() => {\n return hasCounter && value.length > maxTagsQuantity;\n }, [hasCounter, maxTagsQuantity, value.length]);\n\n const canShowSuggestions = suggestionListCallback != null;\n const hasSuggestions = !!suggestionValues;\n\n const errorMessages = useMemo(\n () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n [validationMessages]\n );\n\n const performValidation = useCallback(\n (currValue) => {\n if (\n maxTagsQuantity !== null &&\n maxTagsQuantity !== undefined &&\n currValue.length > maxTagsQuantity\n ) {\n setValidationState(validationStates.invalid);\n setValidationMessage(errorMessages.maxCharError);\n setStateValid(false);\n } else {\n setValidationState(validationStates.valid);\n setValidationMessage(\"\");\n setStateValid(true);\n }\n },\n [\n errorMessages.maxCharError,\n maxTagsQuantity,\n setValidationMessage,\n setValidationState,\n ]\n );\n\n /\n Deletes a Tag from the array of tags and sets the new position for the tag cursor.\n * Also executes the user provided onDelete and onChange events.\n \n @param {number} tagPos - the position at which to remove the tag\n * @param {Event} event - the event associated with the delete\n * @param {boolean} end - whether or not to set the cursor at the end of the array\n /\n const deleteTag = useCallback(\n (tagPos, event, end) => {\n const newTagsArr = [\n ...value.slice(0, tagPos),\n ...value.slice(tagPos + 1),\n ];\n setValue(newTagsArr);\n setTagCursorPos(\n end ? newTagsArr.length : tagCursorPos > 0 ? tagCursorPos - 1 : 0\n );\n inputRef.current?.focus();\n performValidation(newTagsArr);\n onDelete?.(event, value[tagPos], tagPos);\n onChange?.(event, newTagsArr);\n skipReset.current = true;\n },\n [onChange, onDelete, performValidation, setValue, tagCursorPos, value]\n );\n\n /\n Adds a Tag to the array of tags.\n * Also executes the user provided onAdd and onDelete events.\n \n @param {Event} event - whatever event triggered adding a tag\n * @param {string} tag - the string for the tag\n /\n const addTag = useCallback(\n (event, tag) => {\n event.preventDefault();\n if (tag !== \"\") {\n const newTag: HvTagProps = { label: tag, type: \"semantic\" };\n const newTagsArr = [...value, newTag];\n setValue(newTagsArr);\n performValidation(newTagsArr);\n onAdd?.(event, newTag, newTagsArr.length - 1);\n onChange?.(event, newTagsArr);\n }\n },\n [onAdd, onChange, performValidation, setValue, value]\n );\n\n const canShowError =\n (status !== undefined &&\n status === \"invalid\" &&\n statusMessage !== undefined) \|\|\n !stateValid;\n\n useEffect(() => {\n if (!multiline) {\n const element = containerRef?.current?.children[tagCursorPos];\n // this setTimeout is a workaround for Firefox not properly dealing\n // with setting the scrollLeft value.\n setTimeout(() => {\n const container = containerRef.current;\n if (isNil(container)) return;\n container.scrollLeft = element\n ? element.offsetLeft -\n container.getBoundingClientRect().width / 2 +\n element.getBoundingClientRect().width / 2\n : 0;\n }, 50);\n\n element?.focus();\n }\n }, [multiline, tagCursorPos]);\n\n useEffect(() => {\n if (!skipReset.current) {\n setTagInput(\"\");\n setTagCursorPos(value.length);\n }\n skipReset.current = false;\n }, [value]);\n\n const isMounted = useIsMounted();\n\n /\n Looks for the node that represent the input inside the material tree and focus it.\n /\n const focusInput = () => {\n materialInputRef.current.focus();\n };\n\n const getSuggestions = useCallback(\n (li) => {\n // TODO Replace with ref\n const listEl = document.getElementById(\n setId(elementId, \"suggestions-list\") \|\| \"\"\n );\n return li != null ? listEl?.getElementsByTagName(\"li\")?.[li] : listEl;\n },\n [elementId]\n );\n\n /\n Clears the suggestion array.\n /\n const suggestionClearHandler = useCallback(() => {\n if (isMounted.current) {\n setSuggestionValues(null);\n }\n }, [isMounted]);\n\n /\n Fills of the suggestion array.\n /\n const suggestionHandler = useCallback(\n (val) => {\n const suggestionsArray = suggestionListCallback?.(val);\n if (suggestionsArray?.[0]?.label) {\n setSuggestionValues(suggestionsArray);\n } else {\n suggestionClearHandler();\n }\n },\n [suggestionClearHandler, suggestionListCallback]\n );\n\n /\n Executes the user callback adds the selection to the state and clears the suggestions.\n /\n const suggestionSelectedHandler = (event, item) => {\n addTag(event, item.value \|\| item.label);\n\n // set the input value (only when value is uncontrolled)\n setTagInput(item.value \|\| item.label);\n\n focusInput();\n suggestionClearHandler();\n };\n\n /\n Handler for the `onKeyDown` event on the suggestions component\n /\n const onSuggestionKeyDown = (event) => {\n if (isKey(event, \"Esc\")) {\n suggestionClearHandler();\n focusInput();\n } else if (isKey(event, \"Tab\")) {\n suggestionClearHandler();\n }\n };\n\n /\n Handler for the `onChange` event on the tag input\n /\n const onChangeHandler = useCallback(\n (_, input) => {\n setTagInput(input);\n\n if (canShowSuggestions) {\n // an edge case might be a controlled input whose onChange callback\n // doesn't change the value (or sets another): the suggestionListCallback\n // callback will still receive the original rejected value.\n // a refactor is needed so the suggestionListCallback might be called only\n // when the input is uncontrolled, providing a way to externally control\n // the suggestion values.\n suggestionHandler(input);\n }\n },\n [canShowSuggestions, suggestionHandler]\n );\n\n /\n Handler for the `onKeyDown` event on the form element\n /\n const onInputKeyDownHandler = useCallback(\n (event) => {\n if (!canShowSuggestions && commitTagOn.includes(event.code)) {\n addTag(event, tagInput);\n }\n },\n [addTag, canShowSuggestions, commitTagOn, tagInput]\n );\n\n /\n Handler for the `onKeyDown` event on the list container.\n /\n const onKeyDownHandler = useCallback(\n (event) => {\n if (tagInput === \"\") {\n switch (event.code) {\n case \"ArrowLeft\":\n setTagCursorPos(tagCursorPos > 0 ? tagCursorPos - 1 : 0);\n break;\n case \"ArrowRight\":\n setTagCursorPos(\n tagCursorPos < value.length ? tagCursorPos + 1 : value.length\n );\n break;\n case \"Backspace\":\n if (isTagSelected) {\n deleteTag(tagCursorPos, event, false);\n } else {\n setTagCursorPos(value.length - 1);\n }\n break;\n case \"Delete\":\n if (isTagSelected) {\n deleteTag(tagCursorPos, event, false);\n }\n break;\n default:\n break;\n }\n } else {\n switch (event.code) {\n case \"ArrowDown\":\n getSuggestions(0)?.focus();\n break;\n default:\n break;\n }\n }\n },\n [\n deleteTag,\n getSuggestions,\n isTagSelected,\n tagCursorPos,\n tagInput,\n value.length,\n ]\n );\n\n /\n Handler for the `onDelete` event on the tag component\n /\n const onDeleteTagHandler = useCallback(\n (event, i) => {\n deleteTag(i, event, true);\n setValidationState(validationStates.standBy);\n },\n [deleteTag, setValidationState]\n );\n\n /\n Handler for the `onClick` event on the list container\n */\n const onContainerClickHandler = useCallback(() => {\n inputRef.current?.focus();\n clearTimeout(blurTimeout.current);\n setTagCursorPos(value.length);\n }, [value.length]);\n\n const onBlurHandler = (evt) => {\n blurTimeout.current = setTimeout(() => {\n if (commitOnBlur) {\n addTag(evt, tagInput);\n }\n onBlur?.(evt, tagInput);\n }, 250);\n };\n\n const onFocusHandler = (evt) => {\n clearTimeout(blurTimeout.current);\n onFocus?.(evt, tagInput);\n };\n\n return (\n <HvFormElement\n id={id}\n name={name}\n disabled={disabled}\n readOnly={readOnly}\n status={validationState}\n required={required}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n className={cx(\n classes.root,\n { [classes.disabled]: disabled, [classes.readOnly]: readOnly },\n className\n )}\n >\n {(hasLabel \|\| hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n className={classes.label}\n id={setId(id, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={textAreaLabel}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage\n className={classes.description}\n id={setId(elementId, \"description\")}\n >\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n\n {hasCounter && (\n <HvCharCounter\n id={setId(elementId, \"charCounter\")}\n className={classes.characterCounter}\n separator={middleCountLabel}\n currentCharQuantity={value.length}\n maxCharQuantity={maxTagsQuantity}\n {...countCharProps}\n />\n )}\n\n <HvListContainer\n className={cx(classes.tagsList, {\n [classes.error]: canShowError,\n [classes.resizable]: resizable && multiline,\n [classes.invalid]: isStateInvalid,\n [classes.singleLine]: !multiline,\n })}\n onKeyDown={onKeyDownHandler}\n onClick={onContainerClickHandler}\n ref={forkedContainerRef}\n >\n {value &&\n value.map((t, i) => {\n const tag =\n typeof t === \"string\"\n ? {\n label: t,\n type: \"semantic\",\n }\n : t;\n const { label, type, ...otherProps } = tag;\n return (\n <HvListItem\n key={`${tag.label}-${i}`}\n tabIndex={-1}\n className={cx({ [classes.singleLine]: !multiline })}\n classes={{\n gutters: classes.listItemGutters,\n root: classes.listItemRoot,\n }}\n id={setId(elementId, `tag-${i}`)}\n >\n <HvTag\n label={label}\n className={cx({\n [classes.tagSelected]: i === tagCursorPos,\n })}\n classes={{\n chipRoot: classes.chipRoot,\n }}\n type={type}\n {...(!(readOnly \|\| disabled \|\| type === \"categorical\") && {\n onDelete: (event) => onDeleteTagHandler(event, i),\n })}\n deleteButtonProps={{\n tabIndex: -1,\n }}\n {...otherProps}\n />\n </HvListItem>\n );\n })}\n {!(disabled \|\| readOnly) && (\n <HvListItem\n className={cx(\n {\n [classes.singleLine]: !multiline,\n [classes.tagInputRootEmpty]: value.length === 0,\n },\n !!isTagSelected &&\n css({\n [`& .${baseInputClasses.inputRoot}`]: {\n backgroundColor: theme.colors.atmo1,\n },\n })\n )}\n classes={{\n root: classes.tagInputContainerRoot,\n gutters: classes.listItemGutters,\n }}\n id={setId(elementId, `tag-${value.length}`)}\n >\n <HvInput\n value={tagInput}\n disableClear\n onChange={onChangeHandler}\n onKeyDown={onInputKeyDownHandler}\n placeholder={value.length === 0 ? placeholder : \"\"}\n autoFocus={autoFocus}\n className={cx({\n [classes.singleLine]: !multiline,\n })}\n classes={{\n root: classes.tagInputRoot,\n input: classes.input,\n inputBorderContainer: classes.tagInputBorderContainer,\n inputRootFocused: classes.tagInputRootFocused,\n }}\n disabled={disabled}\n readOnly={readOnly \|\| isTagSelected}\n inputProps={{\n ref: materialInputRef,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\":\n ariaDescribedBy != null\n ? ariaDescribedBy\n : (description && setId(elementId, \"description\")) \|\|\n undefined,\n\n ...inputProps,\n }}\n inputRef={inputRef}\n {...others}\n />\n </HvListItem>\n )}\n </HvListContainer>\n {canShowSuggestions && (\n <>\n {hasSuggestions && (\n <div role=\"presentation\" className={classes.inputExtension} />\n )}\n <HvSuggestions\n id={setId(elementId, \"suggestions\")}\n classes={{\n root: classes.suggestionsContainer,\n list: classes.suggestionList,\n }}\n expanded={hasSuggestions}\n anchorEl={containerRef?.current?.parentElement}\n onClose={suggestionClearHandler}\n onKeyDown={onSuggestionKeyDown}\n onSuggestionSelected={suggestionSelectedHandler}\n suggestionValues={suggestionValues}\n />\n </>\n )}\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n }\n);\n"],"names":["HvTagsInput","forwardRef","props","ref","classes","classesProp","className","id","name","value","valueProp","defaultValue","readOnly","disabled","required","label","textAreaLabel","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onAdd","onDelete","onBlur","onFocus","placeholder","hideCounter","middleCountLabel","maxTagsQuantity","autoFocus","resizable","inputProps","countCharProps","multiline","status","statusMessage","validationMessages","commitTagOn","commitOnBlur","suggestionListCallback","others","useDefaultProps","cx","css","useClasses","elementId","useUniqueId","hasLabel","hasDescription","setValue","useControlled","validationState","setValidationState","validationStates","standBy","validationMessage","setValidationMessage","tagInput","setTagInput","useState","tagCursorPos","setTagCursorPos","length","stateValid","setStateValid","inputRef","useRef","containerRef","skipReset","blurTimeout","materialInputRef","forkedContainerRef","useForkRef","isTagSelected","hasCounter","suggestionValues","setSuggestionValues","isStateInvalid","useMemo","canShowSuggestions","hasSuggestions","errorMessages","DEFAULT_ERROR_MESSAGES","performValidation","useCallback","currValue","undefined","invalid","maxCharError","valid","deleteTag","tagPos","event","end","newTagsArr","slice","current","focus","addTag","tag","preventDefault","newTag","type","canShowError","useEffect","element","children","setTimeout","container","isNil","scrollLeft","offsetLeft","getBoundingClientRect","width","isMounted","useIsMounted","focusInput","getSuggestions","li","listEl","document","getElementById","setId","getElementsByTagName","suggestionClearHandler","suggestionHandler","val","suggestionsArray","suggestionSelectedHandler","item","onSuggestionKeyDown","isKey","onChangeHandler","_","input","onInputKeyDownHandler","includes","code","onKeyDownHandler","_a","onDeleteTagHandler","i","onContainerClickHandler","clearTimeout","onBlurHandler","evt","onFocusHandler","HvFormElement","root","jsxs","labelContainer","HvLabel","jsx","HvInfoMessage","HvCharCounter","characterCounter","HvListContainer","tagsList","error","singleLine","map","t","otherProps","HvListItem","gutters","listItemGutters","listItemRoot","HvTag","tagSelected","chipRoot","tabIndex","tagInputRootEmpty","baseInputClasses","inputRoot","backgroundColor","theme","colors","atmo1","tagInputContainerRoot","HvInput","tagInputRoot","inputBorderContainer","tagInputBorderContainer","inputRootFocused","tagInputRootFocused","inputExtension","HvSuggestions","suggestionsContainer","list","suggestionList","parentElement","HvWarningText"],"mappings":"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"}
1	+ {"version":3,"file":"TagsInput.cjs","sources":["../../../../src/components/TagsInput/TagsInput.tsx"],"sourcesContent":["import React, {\n forwardRef,\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 { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvListContainer, HvListItem } from \"@core/components/ListContainer\";\nimport { baseInputClasses } from \"@core/components/BaseInput\";\nimport { HvInput } from \"@core/components/Input\";\nimport { HvTagSuggestion, HvValidationMessages } from \"@core/types/forms\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useIsMounted } from \"@core/hooks/useIsMounted\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport validationStates from \"@core/components/Forms/FormElement/validationStates\";\nimport { DEFAULT_ERROR_MESSAGES } from \"@core/components/BaseInput/validations\";\nimport { HvTag, HvTagProps } from \"@core/components/Tag\";\nimport {\n HvCharCounter,\n HvCharCounterProps,\n HvFormElement,\n HvFormStatus,\n HvInfoMessage,\n HvLabel,\n HvSuggestions,\n HvWarningText,\n} from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./TagsInput.styles\";\n\nexport { staticClasses as tagsInputClasses };\n\nexport type HvTagsInputClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTagsInputProps\n extends HvBaseProps<\n HTMLElement,\n \"onChange\" \| \"onBlur\" \| \"onFocus\" \| \"onKeyDown\" \| \"color\" \| \"defaultValue\"\n > {\n /** The form element name. /\n name?: string;\n /* The value of the form element. /\n value?: string[] \| HvTagProps[];\n /* When uncontrolled, defines the initial input value. /\n defaultValue?: string[] \| HvTagProps[];\n /\n The label of the form element.\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n /\n label?: React.ReactNode;\n /* Provide additional descriptive text for the form element. /\n description?: React.ReactNode;\n /* Indicates that the form element is disabled. /\n disabled?: boolean;\n /* Indicates that the form element is not editable. /\n readOnly?: boolean;\n /* Indicates that the form element is required. /\n required?: boolean;\n /* The function that will be executed onChange. /\n onChange?: (\n event:\n \| React.ChangeEvent<HTMLInputElement>\n \| React.KeyboardEvent<HTMLInputElement>\n \| React.MouseEvent<HTMLButtonElement>\n \| React.MouseEvent<HTMLElement, MouseEvent>\n \| React.KeyboardEventHandler<HTMLElement>,\n value: HvTagProps[]\n ) => void;\n /* The function that will be executed when the element is focused. /\n onFocus?: (event: React.FocusEvent<HTMLInputElement>, value: string) => void;\n /* The function that will be executed when the element is blurred. /\n onBlur?: (event: React.FocusEvent<HTMLInputElement>, value: string) => void;\n /* The function that will be executed when a tag is deleted. /\n onDelete?: (\n event:\n \| React.ChangeEvent<HTMLInputElement>\n \| React.KeyboardEvent<HTMLInputElement>\n \| React.MouseEvent<HTMLButtonElement>\n \| React.MouseEvent<HTMLElement, MouseEvent>\n \| React.KeyboardEventHandler<HTMLElement>,\n value: HvTagProps,\n index: number\n ) => void;\n /* The function that will be executed when a tag is added. /\n onAdd?: (\n event:\n \| React.ChangeEvent<HTMLInputElement>\n \| React.KeyboardEvent<HTMLInputElement>\n \| React.MouseEvent<HTMLButtonElement>\n \| React.MouseEvent<HTMLElement, MouseEvent>\n \| React.KeyboardEventHandler<HTMLElement>,\n value: HvTagProps,\n index: number\n ) => void;\n /* The placeholder value of the input. /\n placeholder?: string;\n /* If `true` the character counter isn't shown even if maxTagsQuantity is set. /\n hideCounter?: boolean;\n /* Text between the current char counter and max value. /\n middleCountLabel?: string;\n /* The maximum allowed length of the characters, if this value is null no check will be performed. /\n maxTagsQuantity?: number;\n /* Attributes applied to the input element. /\n inputProps?: MuiInputBaseComponentProps;\n /* If `true` it should autofocus. /\n autoFocus?: boolean;\n /* If `true` the component is resizable. /\n resizable?: boolean;\n /* Props passed to the HvCharCount component. /\n countCharProps?: Partial<HvCharCounterProps>;\n /* If `true` the component is in multiline mode. /\n multiline?: boolean;\n /* The status of the form element. /\n status?: HvFormStatus;\n /* The error message to show when `status` is \"invalid\". /\n statusMessage?: React.ReactNode;\n /* An Object containing the various texts associated with the input. /\n validationMessages?: HvValidationMessages;\n /* An array of strings that represent the character used to input a tag. This character is the string representation of the event.code from the input event. /\n commitTagOn?: string[];\n /* If `true` the tag will be committed when the blur event occurs. /\n commitOnBlur?: boolean;\n /* The function that will be executed to received an array of objects that has a label and id to create list of suggestion /\n suggestionListCallback?: (value: string) => HvTagSuggestion[] \| null;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvTagsInputClasses;\n}\n\n/\n A tags input is a single or multiline control that allows the input of tags.\n /\nexport const HvTagsInput = forwardRef<HTMLUListElement, HvTagsInputProps>(\n (props, ref) => {\n const {\n classes: classesProp,\n className,\n id,\n name,\n value: valueProp,\n defaultValue = [],\n readOnly = false,\n disabled = false,\n required = false,\n label: textAreaLabel,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n onChange,\n onAdd,\n onDelete,\n onBlur,\n onFocus,\n placeholder,\n hideCounter = false,\n middleCountLabel = \"/\",\n maxTagsQuantity,\n autoFocus = false,\n resizable = true,\n inputProps = {},\n countCharProps = {},\n multiline = false,\n status,\n statusMessage,\n validationMessages,\n commitTagOn = [\"Enter\"],\n commitOnBlur = false,\n suggestionListCallback,\n ...others\n } = useDefaultProps(\"HvTagsInput\", props);\n\n const { classes, cx, css } = useClasses(classesProp);\n\n const elementId = useUniqueId(id, \"hvTagsInput\");\n\n const hasLabel = textAreaLabel != null;\n const hasDescription = description != null;\n\n const [value, setValue] = useControlled(valueProp, defaultValue);\n\n const [validationState, setValidationState] = useControlled(\n status,\n validationStates.standBy\n );\n const [validationMessage, setValidationMessage] = useControlled(\n statusMessage,\n \"\"\n );\n\n const [tagInput, setTagInput] = useState(\"\");\n const [tagCursorPos, setTagCursorPos] = useState(value.length);\n const [stateValid, setStateValid] = useState(true);\n\n const inputRef = useRef<any>();\n const containerRef = useRef<any>();\n const skipReset = useRef(false);\n const blurTimeout = useRef<any>();\n const materialInputRef = useRef<any>(null);\n\n const forkedContainerRef = useForkRef(ref, containerRef);\n\n const isTagSelected = tagCursorPos >= 0 && tagCursorPos < value.length;\n const hasCounter = maxTagsQuantity != null && !hideCounter;\n\n // suggestions related state\n const [suggestionValues, setSuggestionValues] = useState<\n HvTagSuggestion[] \| null\n >(null);\n\n const isStateInvalid = useMemo(() => {\n return hasCounter && value.length > maxTagsQuantity;\n }, [hasCounter, maxTagsQuantity, value.length]);\n\n const canShowSuggestions = suggestionListCallback != null;\n const hasSuggestions = !!suggestionValues;\n\n const errorMessages = useMemo(\n () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n [validationMessages]\n );\n\n const performValidation = useCallback(\n (currValue) => {\n if (\n maxTagsQuantity !== null &&\n maxTagsQuantity !== undefined &&\n currValue.length > maxTagsQuantity\n ) {\n setValidationState(validationStates.invalid);\n setValidationMessage(errorMessages.maxCharError);\n setStateValid(false);\n } else {\n setValidationState(validationStates.valid);\n setValidationMessage(\"\");\n setStateValid(true);\n }\n },\n [\n errorMessages.maxCharError,\n maxTagsQuantity,\n setValidationMessage,\n setValidationState,\n ]\n );\n\n /\n Deletes a Tag from the array of tags and sets the new position for the tag cursor.\n * Also executes the user provided onDelete and onChange events.\n \n @param {number} tagPos - the position at which to remove the tag\n * @param {Event} event - the event associated with the delete\n * @param {boolean} end - whether or not to set the cursor at the end of the array\n /\n const deleteTag = useCallback(\n (tagPos, event, end) => {\n const newTagsArr = [\n ...value.slice(0, tagPos),\n ...value.slice(tagPos + 1),\n ];\n setValue(newTagsArr);\n setTagCursorPos(\n end ? newTagsArr.length : tagCursorPos > 0 ? tagCursorPos - 1 : 0\n );\n inputRef.current?.focus();\n performValidation(newTagsArr);\n onDelete?.(event, value[tagPos], tagPos);\n onChange?.(event, newTagsArr);\n skipReset.current = true;\n },\n [onChange, onDelete, performValidation, setValue, tagCursorPos, value]\n );\n\n /\n Adds a Tag to the array of tags.\n * Also executes the user provided onAdd and onDelete events.\n \n @param {Event} event - whatever event triggered adding a tag\n * @param {string} tag - the string for the tag\n /\n const addTag = useCallback(\n (event, tag) => {\n event.preventDefault();\n if (tag !== \"\") {\n const newTag: HvTagProps = { label: tag, type: \"semantic\" };\n const newTagsArr = [...value, newTag];\n setValue(newTagsArr);\n performValidation(newTagsArr);\n onAdd?.(event, newTag, newTagsArr.length - 1);\n onChange?.(event, newTagsArr);\n }\n },\n [onAdd, onChange, performValidation, setValue, value]\n );\n\n const canShowError =\n (status !== undefined &&\n status === \"invalid\" &&\n statusMessage !== undefined) \|\|\n !stateValid;\n\n useEffect(() => {\n if (!multiline) {\n const element = containerRef?.current?.children[tagCursorPos];\n // this setTimeout is a workaround for Firefox not properly dealing\n // with setting the scrollLeft value.\n setTimeout(() => {\n const container = containerRef.current;\n if (container == null) return;\n container.scrollLeft = element\n ? element.offsetLeft -\n container.getBoundingClientRect().width / 2 +\n element.getBoundingClientRect().width / 2\n : 0;\n }, 50);\n\n element?.focus();\n }\n }, [multiline, tagCursorPos]);\n\n useEffect(() => {\n if (!skipReset.current) {\n setTagInput(\"\");\n setTagCursorPos(value.length);\n }\n skipReset.current = false;\n }, [value]);\n\n const isMounted = useIsMounted();\n\n /\n Looks for the node that represent the input inside the material tree and focus it.\n /\n const focusInput = () => {\n materialInputRef.current.focus();\n };\n\n const getSuggestions = useCallback(\n (li) => {\n // TODO Replace with ref\n const listEl = document.getElementById(\n setId(elementId, \"suggestions-list\") \|\| \"\"\n );\n return li != null ? listEl?.getElementsByTagName(\"li\")?.[li] : listEl;\n },\n [elementId]\n );\n\n /\n Clears the suggestion array.\n /\n const suggestionClearHandler = useCallback(() => {\n if (isMounted.current) {\n setSuggestionValues(null);\n }\n }, [isMounted]);\n\n /\n Fills of the suggestion array.\n /\n const suggestionHandler = useCallback(\n (val) => {\n const suggestionsArray = suggestionListCallback?.(val);\n if (suggestionsArray?.[0]?.label) {\n setSuggestionValues(suggestionsArray);\n } else {\n suggestionClearHandler();\n }\n },\n [suggestionClearHandler, suggestionListCallback]\n );\n\n /\n Executes the user callback adds the selection to the state and clears the suggestions.\n /\n const suggestionSelectedHandler = (event, item) => {\n addTag(event, item.value \|\| item.label);\n\n // set the input value (only when value is uncontrolled)\n setTagInput(item.value \|\| item.label);\n\n focusInput();\n suggestionClearHandler();\n };\n\n /\n Handler for the `onKeyDown` event on the suggestions component\n /\n const onSuggestionKeyDown = (event) => {\n if (isKey(event, \"Esc\")) {\n suggestionClearHandler();\n focusInput();\n } else if (isKey(event, \"Tab\")) {\n suggestionClearHandler();\n }\n };\n\n /\n Handler for the `onChange` event on the tag input\n /\n const onChangeHandler = useCallback(\n (_, input) => {\n setTagInput(input);\n\n if (canShowSuggestions) {\n // an edge case might be a controlled input whose onChange callback\n // doesn't change the value (or sets another): the suggestionListCallback\n // callback will still receive the original rejected value.\n // a refactor is needed so the suggestionListCallback might be called only\n // when the input is uncontrolled, providing a way to externally control\n // the suggestion values.\n suggestionHandler(input);\n }\n },\n [canShowSuggestions, suggestionHandler]\n );\n\n /\n Handler for the `onKeyDown` event on the form element\n /\n const onInputKeyDownHandler = useCallback(\n (event) => {\n if (!canShowSuggestions && commitTagOn.includes(event.code)) {\n addTag(event, tagInput);\n }\n },\n [addTag, canShowSuggestions, commitTagOn, tagInput]\n );\n\n /\n Handler for the `onKeyDown` event on the list container.\n /\n const onKeyDownHandler = useCallback(\n (event) => {\n if (tagInput === \"\") {\n switch (event.code) {\n case \"ArrowLeft\":\n setTagCursorPos(tagCursorPos > 0 ? tagCursorPos - 1 : 0);\n break;\n case \"ArrowRight\":\n setTagCursorPos(\n tagCursorPos < value.length ? tagCursorPos + 1 : value.length\n );\n break;\n case \"Backspace\":\n if (isTagSelected) {\n deleteTag(tagCursorPos, event, false);\n } else {\n setTagCursorPos(value.length - 1);\n }\n break;\n case \"Delete\":\n if (isTagSelected) {\n deleteTag(tagCursorPos, event, false);\n }\n break;\n default:\n break;\n }\n } else {\n switch (event.code) {\n case \"ArrowDown\":\n getSuggestions(0)?.focus();\n break;\n default:\n break;\n }\n }\n },\n [\n deleteTag,\n getSuggestions,\n isTagSelected,\n tagCursorPos,\n tagInput,\n value.length,\n ]\n );\n\n /\n Handler for the `onDelete` event on the tag component\n /\n const onDeleteTagHandler = useCallback(\n (event, i) => {\n deleteTag(i, event, true);\n setValidationState(validationStates.standBy);\n },\n [deleteTag, setValidationState]\n );\n\n /\n Handler for the `onClick` event on the list container\n */\n const onContainerClickHandler = useCallback(() => {\n inputRef.current?.focus();\n clearTimeout(blurTimeout.current);\n setTagCursorPos(value.length);\n }, [value.length]);\n\n const onBlurHandler = (evt) => {\n blurTimeout.current = setTimeout(() => {\n if (commitOnBlur) {\n addTag(evt, tagInput);\n }\n onBlur?.(evt, tagInput);\n }, 250);\n };\n\n const onFocusHandler = (evt) => {\n clearTimeout(blurTimeout.current);\n onFocus?.(evt, tagInput);\n };\n\n return (\n <HvFormElement\n id={id}\n name={name}\n disabled={disabled}\n readOnly={readOnly}\n status={validationState}\n required={required}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n className={cx(\n classes.root,\n { [classes.disabled]: disabled, [classes.readOnly]: readOnly },\n className\n )}\n >\n {(hasLabel \|\| hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n className={classes.label}\n id={setId(id, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={textAreaLabel}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage\n className={classes.description}\n id={setId(elementId, \"description\")}\n >\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n\n {hasCounter && (\n <HvCharCounter\n id={setId(elementId, \"charCounter\")}\n className={classes.characterCounter}\n separator={middleCountLabel}\n currentCharQuantity={value.length}\n maxCharQuantity={maxTagsQuantity}\n {...countCharProps}\n />\n )}\n\n <HvListContainer\n className={cx(classes.tagsList, {\n [classes.error]: canShowError,\n [classes.resizable]: resizable && multiline,\n [classes.invalid]: isStateInvalid,\n [classes.singleLine]: !multiline,\n })}\n onKeyDown={onKeyDownHandler}\n onClick={onContainerClickHandler}\n ref={forkedContainerRef}\n >\n {value &&\n value.map((t, i) => {\n const tag =\n typeof t === \"string\"\n ? {\n label: t,\n type: \"semantic\",\n }\n : t;\n const { label, type, ...otherProps } = tag;\n return (\n <HvListItem\n key={`${tag.label}-${i}`}\n tabIndex={-1}\n className={cx({ [classes.singleLine]: !multiline })}\n classes={{\n gutters: classes.listItemGutters,\n root: classes.listItemRoot,\n }}\n id={setId(elementId, `tag-${i}`)}\n >\n <HvTag\n label={label}\n className={cx({\n [classes.tagSelected]: i === tagCursorPos,\n })}\n classes={{\n chipRoot: classes.chipRoot,\n }}\n type={type}\n {...(!(readOnly \|\| disabled \|\| type === \"categorical\") && {\n onDelete: (event) => onDeleteTagHandler(event, i),\n })}\n deleteButtonProps={{\n tabIndex: -1,\n }}\n {...otherProps}\n />\n </HvListItem>\n );\n })}\n {!(disabled \|\| readOnly) && (\n <HvListItem\n className={cx(\n {\n [classes.singleLine]: !multiline,\n [classes.tagInputRootEmpty]: value.length === 0,\n },\n !!isTagSelected &&\n css({\n [`& .${baseInputClasses.inputRoot}`]: {\n backgroundColor: theme.colors.atmo1,\n },\n })\n )}\n classes={{\n root: classes.tagInputContainerRoot,\n gutters: classes.listItemGutters,\n }}\n id={setId(elementId, `tag-${value.length}`)}\n >\n <HvInput\n value={tagInput}\n disableClear\n onChange={onChangeHandler}\n onKeyDown={onInputKeyDownHandler}\n placeholder={value.length === 0 ? placeholder : \"\"}\n autoFocus={autoFocus}\n className={cx({\n [classes.singleLine]: !multiline,\n })}\n classes={{\n root: classes.tagInputRoot,\n input: classes.input,\n inputBorderContainer: classes.tagInputBorderContainer,\n inputRootFocused: classes.tagInputRootFocused,\n }}\n disabled={disabled}\n readOnly={readOnly \|\| isTagSelected}\n inputProps={{\n ref: materialInputRef,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\":\n ariaDescribedBy != null\n ? ariaDescribedBy\n : (description && setId(elementId, \"description\")) \|\|\n undefined,\n\n ...inputProps,\n }}\n inputRef={inputRef}\n {...others}\n />\n </HvListItem>\n )}\n </HvListContainer>\n {canShowSuggestions && (\n <>\n {hasSuggestions && (\n <div role=\"presentation\" className={classes.inputExtension} />\n )}\n <HvSuggestions\n id={setId(elementId, \"suggestions\")}\n classes={{\n root: classes.suggestionsContainer,\n list: classes.suggestionList,\n }}\n expanded={hasSuggestions}\n anchorEl={containerRef?.current?.parentElement}\n onClose={suggestionClearHandler}\n onKeyDown={onSuggestionKeyDown}\n onSuggestionSelected={suggestionSelectedHandler}\n suggestionValues={suggestionValues}\n />\n </>\n )}\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n }\n);\n"],"names":["HvTagsInput","forwardRef","props","ref","classes","classesProp","className","id","name","value","valueProp","defaultValue","readOnly","disabled","required","label","textAreaLabel","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onAdd","onDelete","onBlur","onFocus","placeholder","hideCounter","middleCountLabel","maxTagsQuantity","autoFocus","resizable","inputProps","countCharProps","multiline","status","statusMessage","validationMessages","commitTagOn","commitOnBlur","suggestionListCallback","others","useDefaultProps","cx","css","useClasses","elementId","useUniqueId","hasLabel","hasDescription","setValue","useControlled","validationState","setValidationState","validationStates","standBy","validationMessage","setValidationMessage","tagInput","setTagInput","useState","tagCursorPos","setTagCursorPos","length","stateValid","setStateValid","inputRef","useRef","containerRef","skipReset","blurTimeout","materialInputRef","forkedContainerRef","useForkRef","isTagSelected","hasCounter","suggestionValues","setSuggestionValues","isStateInvalid","useMemo","canShowSuggestions","hasSuggestions","errorMessages","DEFAULT_ERROR_MESSAGES","performValidation","useCallback","currValue","undefined","invalid","maxCharError","valid","deleteTag","tagPos","event","end","newTagsArr","slice","current","focus","addTag","tag","preventDefault","newTag","type","canShowError","useEffect","element","children","setTimeout","container","scrollLeft","offsetLeft","getBoundingClientRect","width","isMounted","useIsMounted","focusInput","getSuggestions","li","listEl","document","getElementById","setId","getElementsByTagName","suggestionClearHandler","suggestionHandler","val","suggestionsArray","suggestionSelectedHandler","item","onSuggestionKeyDown","isKey","onChangeHandler","_","input","onInputKeyDownHandler","includes","code","onKeyDownHandler","onDeleteTagHandler","i","onContainerClickHandler","clearTimeout","onBlurHandler","evt","onFocusHandler","HvFormElement","root","jsxs","labelContainer","HvLabel","jsx","HvInfoMessage","HvCharCounter","characterCounter","HvListContainer","tagsList","error","singleLine","map","t","otherProps","HvListItem","gutters","listItemGutters","listItemRoot","HvTag","tagSelected","chipRoot","tabIndex","tagInputRootEmpty","baseInputClasses","inputRoot","backgroundColor","theme","colors","atmo1","tagInputContainerRoot","HvInput","tagInputRoot","inputBorderContainer","tagInputBorderContainer","inputRootFocused","tagInputRootFocused","inputExtension","HvSuggestions","suggestionsContainer","list","suggestionList","parentElement","HvWarningText"],"mappings":"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"}

package/dist/cjs/components/TextArea/TextArea.cjs CHANGED Viewed

@@ -3,7 +3,6 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const material = require("@mui/material");
-const isNil = require("lodash/isNil");
 const setId = require("../../utils/setId.cjs");
 const useUniqueId = require("../../hooks/useUniqueId.cjs");
 const useControlled = require("../../hooks/useControlled.cjs");
@@ -17,8 +16,6 @@ const Label = require("../Forms/Label/Label.cjs");
 const InfoMessage = require("../Forms/InfoMessage/InfoMessage.cjs");
 const BaseInput = require("../BaseInput/BaseInput.cjs");
 const WarningText = require("../Forms/WarningText/WarningText.cjs");
-const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const isNil__default = /* @__PURE__ */ _interopDefault(isNil);
 const HvTextArea = React.forwardRef((props, ref) => {
   const {
     id,
@@ -86,7 +83,7 @@ const HvTextArea = React.forwardRef((props, ref) => {
     setValidationMessage(validations.computeValidationMessage(inputValidity, errorMessages));
     return inputValidity;
   }, [errorMessages, inputRef, isEmptyValue, maxCharQuantity, minCharQuantity, required, setValidationMessage, setValidationState, validation, value]);
-  const isOverflow = (currentValue) => isNil__default.default(maxCharQuantity) ? false : currentValue.length > maxCharQuantity;
+  const isOverflow = (currentValue) => maxCharQuantity == null ? false : currentValue.length > maxCharQuantity;
   const limitValue = (currentValue) => {
     if (currentValue === void 0 || !blockMax)
       return currentValue;
@@ -95,18 +92,18 @@ const HvTextArea = React.forwardRef((props, ref) => {
   const onContainerBlurHandler = (event) => {
     setFocused(false);
     const inputValidity = performValidation();
-    onBlur == null ? void 0 : onBlur(event, value, inputValidity);
+    onBlur?.(event, value, inputValidity);
   };
   const onChangeHandler = (event, currentValue) => {
     isDirty.current = true;
     const limitedValue = blockMax ? limitValue(currentValue) : currentValue;
     setValue(limitedValue);
-    onChange == null ? void 0 : onChange(event, limitedValue);
+    onChange?.(event, limitedValue);
   };
   const onFocusHandler = (event) => {
     setFocused(true);
     setValidationState(validationStates.default.standBy);
-    onFocus == null ? void 0 : onFocus(event, value);
+    onFocus?.(event, value);
   };
   const isScrolledDown = React.useCallback(() => {
     const el = inputRef.current;
@@ -119,13 +116,12 @@ const HvTextArea = React.forwardRef((props, ref) => {
     }
   }, [inputRef]);
   const addScrollListener = React.useCallback(() => {
-    var _a;
     const scrollHandler = {
       handleEvent: () => {
         setAutoScrolling(isScrolledDown());
       }
     };
-    (_a = inputRef.current) == null ? void 0 : _a.addEventListener("scroll", scrollHandler);
+    inputRef.current?.addEventListener("scroll", scrollHandler);
   }, [inputRef, isScrolledDown]);
   React.useEffect(() => {
     if (autoScroll) {

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

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

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

@@ -44,7 +44,7 @@ const Placeholder = React.forwardRef((props, ref) => {
   } = state;
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, onKeyDown: (event) => {
     event.stopPropagation();
-    onKeyDown == null ? void 0 : onKeyDown(event);
+    onKeyDown?.(event);
   }, ...others, children: [
     name && /* @__PURE__ */ jsxRuntime.jsx("input", { type: "hidden", name, value: getDateValue(value) }),
     segments.map((segment, i) => /* @__PURE__ */ jsxRuntime.jsx(PlaceholderSegment, { segment, state, placeholder: placeholders[segment.type] }, i))

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Placeholder.cjs","sources":["../../../../src/components/TimePicker/Placeholder.tsx"],"sourcesContent":["import { forwardRef, useRef } from \"react\";\n\nimport { DateFieldState, DateSegment } from \"@react-stately/datepicker\";\nimport { useDateSegment } from \"@react-aria/datepicker\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\n/** Convert `Date` into `hh:mm:ss` format /\nconst getDateValue = (date) => {\n if (!date) return \"\";\n const { hour, minute, second } = date;\n\n return [hour, minute, second]\n .map((el) => String(el).padStart(2, \"0\"))\n .join(\":\");\n};\n\nconst PlaceholderSegment = ({\n segment,\n state,\n placeholder,\n}: {\n segment: DateSegment;\n state: DateFieldState;\n placeholder: string;\n}) => {\n const ref = useRef(null);\n const { segmentProps } = useDateSegment(segment, state, ref);\n\n return (\n <div ref={ref} {...segmentProps}>\n {(() => {\n if (segment.type === \"literal\") return segment.text;\n if (segment.isPlaceholder) return placeholder ?? segment.text;\n return segment.text.padStart(2, \"0\");\n })()}\n </div>\n );\n};\n\ninterface PlaceholderProps extends HvBaseProps<HTMLDivElement> {\n name?: string;\n state: DateFieldState;\n placeholders: { hour?: string; minute?: string; second?: string };\n}\n\nexport const Placeholder = forwardRef<HTMLDivElement, PlaceholderProps>(\n (props, ref) => {\n const { name, state, placeholders, onKeyDown, ...others } = props;\n const { value, segments } = state;\n\n return (\n <>\n {/ eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div\n ref={ref}\n onKeyDown={(event) => {\n // stop ArrowDown from opening dropdown\n event.stopPropagation();\n onKeyDown?.(event);\n }}\n {...others}\n >\n {name && (\n <input type=\"hidden\" name={name} value={getDateValue(value)} />\n )}\n {segments.map((segment, i) => (\n <PlaceholderSegment\n key={i}\n segment={segment}\n state={state}\n placeholder={placeholders[segment.type]}\n />\n ))}\n </div>\n </>\n );\n }\n);\n"],"names":["getDateValue","date","hour","minute","second","map","el","String","padStart","join","PlaceholderSegment","segment","state","placeholder","ref","useRef","segmentProps","useDateSegment","jsx","type","text","isPlaceholder","Placeholder","forwardRef","props","name","placeholders","onKeyDown","others","value","segments","Fragment","jsxs","event","stopPropagation","i"],"mappings":";;;;;AAQA,MAAMA,eAAgBC,CAAS,SAAA;AAC7B,MAAI,CAACA;AAAa,WAAA;AACZ,QAAA;AAAA,IAAEC;AAAAA,IAAMC;AAAAA,IAAQC;AAAAA,EAAWH,IAAAA;AAEjC,SAAO,CAACC,MAAMC,QAAQC,MAAM,EACzBC,IAAKC,CAAOC,OAAAA,OAAOD,EAAE,EAAEE,SAAS,GAAG,GAAG,CAAC,EACvCC,KAAK,GAAG;AACb;AAEA,MAAMC,qBAAqBA,CAAC;AAAA,EAC1BC;AAAAA,EACAC;AAAAA,EACAC;AAKF,MAAM;AACEC,QAAAA,MAAMC,aAAO,IAAI;AACjB,QAAA;AAAA,IAAEC;AAAAA,EAAiBC,IAAAA,0BAAeN,SAASC,OAAOE,GAAG;AAE3D,SACGI,2BAAAA,IAAA,OAAA,EAAI,KAAcF,GAAAA,cACf,WAAM,MAAA;AACN,QAAIL,QAAQQ,SAAS;AAAW,aAAOR,QAAQS;AAC/C,QAAIT,QAAQU;AAAe,aAAOR,eAAeF,QAAQS;AACzD,WAAOT,QAAQS,KAAKZ,SAAS,GAAG,GAAG;AAAA,OAEvC,CAAA;AAEJ;AAQO,MAAMc,cAAcC,MAAAA,WACzB,CAACC,OAAOV,QAAQ;AACR,QAAA;AAAA,IAAEW;AAAAA,IAAMb;AAAAA,IAAOc;AAAAA,IAAcC;AAAAA,IAAW,GAAGC;AAAAA,EAAWJ,IAAAA;AACtD,QAAA;AAAA,IAAEK;AAAAA,IAAOC;AAAAA,EAAalB,IAAAA;AAE5B,SAGIM,2BAAA,IAAAa,qBAAA,EAAA,UAAAC,2BAAAA,KAAC,OACC,EAAA,KACA,WAAYC,CAAU,UAAA;AAEpBA,UAAMC,gBAAgB;AACtBP,~~2CAAYM~~;~~AAAAA~~,~~EAAK~~,GAEfL,GAAAA,QAEHH,UAAAA;AAAAA,IACC,QAAAP,2BAAA,IAAC,WAAM,MAAK,UAAS,MAAY,OAAOlB,aAAa6B,KAAK,GAC3D;AAAA,IACAC,SAASzB,IAAI,CAACM,SAASwB,MACrBjB,2BAAAA,IAAA,oBAAA,EAEC,SACA,OACA,aAAaQ,aAAaf,QAAQQ,IAAI,EAAA,GAHjCgB,EAKR;AAAA,EAAA,EACH,CAAA,EACF,CAAA;AAEJ,CACF;;"}
1	+ {"version":3,"file":"Placeholder.cjs","sources":["../../../../src/components/TimePicker/Placeholder.tsx"],"sourcesContent":["import { forwardRef, useRef } from \"react\";\n\nimport { DateFieldState, DateSegment } from \"@react-stately/datepicker\";\nimport { useDateSegment } from \"@react-aria/datepicker\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\n/** Convert `Date` into `hh:mm:ss` format /\nconst getDateValue = (date) => {\n if (!date) return \"\";\n const { hour, minute, second } = date;\n\n return [hour, minute, second]\n .map((el) => String(el).padStart(2, \"0\"))\n .join(\":\");\n};\n\nconst PlaceholderSegment = ({\n segment,\n state,\n placeholder,\n}: {\n segment: DateSegment;\n state: DateFieldState;\n placeholder: string;\n}) => {\n const ref = useRef(null);\n const { segmentProps } = useDateSegment(segment, state, ref);\n\n return (\n <div ref={ref} {...segmentProps}>\n {(() => {\n if (segment.type === \"literal\") return segment.text;\n if (segment.isPlaceholder) return placeholder ?? segment.text;\n return segment.text.padStart(2, \"0\");\n })()}\n </div>\n );\n};\n\ninterface PlaceholderProps extends HvBaseProps<HTMLDivElement> {\n name?: string;\n state: DateFieldState;\n placeholders: { hour?: string; minute?: string; second?: string };\n}\n\nexport const Placeholder = forwardRef<HTMLDivElement, PlaceholderProps>(\n (props, ref) => {\n const { name, state, placeholders, onKeyDown, ...others } = props;\n const { value, segments } = state;\n\n return (\n <>\n {/ eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div\n ref={ref}\n onKeyDown={(event) => {\n // stop ArrowDown from opening dropdown\n event.stopPropagation();\n onKeyDown?.(event);\n }}\n {...others}\n >\n {name && (\n <input type=\"hidden\" name={name} value={getDateValue(value)} />\n )}\n {segments.map((segment, i) => (\n <PlaceholderSegment\n key={i}\n segment={segment}\n state={state}\n placeholder={placeholders[segment.type]}\n />\n ))}\n </div>\n </>\n );\n }\n);\n"],"names":["getDateValue","date","hour","minute","second","map","el","String","padStart","join","PlaceholderSegment","segment","state","placeholder","ref","useRef","segmentProps","useDateSegment","jsx","type","text","isPlaceholder","Placeholder","forwardRef","props","name","placeholders","onKeyDown","others","value","segments","Fragment","jsxs","event","stopPropagation","i"],"mappings":";;;;;AAQA,MAAMA,eAAgBC,CAAS,SAAA;AAC7B,MAAI,CAACA;AAAa,WAAA;AACZ,QAAA;AAAA,IAAEC;AAAAA,IAAMC;AAAAA,IAAQC;AAAAA,EAAWH,IAAAA;AAEjC,SAAO,CAACC,MAAMC,QAAQC,MAAM,EACzBC,IAAKC,CAAOC,OAAAA,OAAOD,EAAE,EAAEE,SAAS,GAAG,GAAG,CAAC,EACvCC,KAAK,GAAG;AACb;AAEA,MAAMC,qBAAqBA,CAAC;AAAA,EAC1BC;AAAAA,EACAC;AAAAA,EACAC;AAKF,MAAM;AACEC,QAAAA,MAAMC,aAAO,IAAI;AACjB,QAAA;AAAA,IAAEC;AAAAA,EAAiBC,IAAAA,0BAAeN,SAASC,OAAOE,GAAG;AAE3D,SACGI,2BAAAA,IAAA,OAAA,EAAI,KAAcF,GAAAA,cACf,WAAM,MAAA;AACN,QAAIL,QAAQQ,SAAS;AAAW,aAAOR,QAAQS;AAC/C,QAAIT,QAAQU;AAAe,aAAOR,eAAeF,QAAQS;AACzD,WAAOT,QAAQS,KAAKZ,SAAS,GAAG,GAAG;AAAA,OAEvC,CAAA;AAEJ;AAQO,MAAMc,cAAcC,MAAAA,WACzB,CAACC,OAAOV,QAAQ;AACR,QAAA;AAAA,IAAEW;AAAAA,IAAMb;AAAAA,IAAOc;AAAAA,IAAcC;AAAAA,IAAW,GAAGC;AAAAA,EAAWJ,IAAAA;AACtD,QAAA;AAAA,IAAEK;AAAAA,IAAOC;AAAAA,EAAalB,IAAAA;AAE5B,SAGIM,2BAAA,IAAAa,qBAAA,EAAA,UAAAC,2BAAAA,KAAC,OACC,EAAA,KACA,WAAYC,CAAU,UAAA;AAEpBA,UAAMC,gBAAgB;AACtBP,gBAAYM,KAAK;AAAA,EAAA,GAEfL,GAAAA,QAEHH,UAAAA;AAAAA,IACC,QAAAP,2BAAA,IAAC,WAAM,MAAK,UAAS,MAAY,OAAOlB,aAAa6B,KAAK,GAC3D;AAAA,IACAC,SAASzB,IAAI,CAACM,SAASwB,MACrBjB,2BAAAA,IAAA,oBAAA,EAEC,SACA,OACA,aAAaQ,aAAaf,QAAQQ,IAAI,EAAA,GAHjCgB,EAKR;AAAA,EAAA,EACH,CAAA,EACF,CAAA;AAEJ,CACF;;"}

package/dist/cjs/components/TimePicker/TimePicker.cjs CHANGED Viewed

@@ -96,7 +96,7 @@ const HvTimePicker = React.forwardRef((props, ref) => {
         minute: minutes,
         second: seconds
       } = value;
-      onChange == null ? void 0 : onChange({
+      onChange?.({
         hours,
         minutes,
         seconds
@@ -143,10 +143,9 @@ const HvTimePicker = React.forwardRef((props, ref) => {
       if (disableExpand)
         return;
       setOpen(newOpen);
-      onToggle == null ? void 0 : onToggle(evt, newOpen);
+      onToggle?.(evt, newOpen);
     }, onContainerCreation: (containerRef) => {
-      var _a;
-      (_a = containerRef == null ? void 0 : containerRef.getElementsByTagName("input")[0]) == null ? void 0 : _a.focus();
+      containerRef?.getElementsByTagName("input")[0]?.focus();
     }, "aria-haspopup": "dialog", "aria-label": ariaLabel, "aria-labelledby": fieldProps["aria-labelledby"], "aria-describedby": fieldProps["aria-describedby"], "aria-invalid": isStateInvalid ? true : void 0, "aria-errormessage": errorMessageId, disablePortal, popperProps: {
       modifiers: [{
         name: "preventOverflow",