@hh.ru/magritte-ui-chips-trigger 4.5.2 → 4.5.4

package/ChipsTrigger.d.ts

@@ -1,5 +1,5 @@
 import { LegacyRef, InputHTMLAttributes, ReactElement } from 'react';
-import { ChipsTriggerProps } from '@hh.ru/magritte-ui-chips-trigger/types';
+import { ChipsTriggerProps } from './types';
 declare const ChipsTrigger: (<T>(props: ChipsTriggerProps<T> & Omit<InputHTMLAttributes<HTMLInputElement>, keyof ChipsTriggerProps<T>> & {
     ref?: LegacyRef<HTMLInputElement>;
 }) => ReactElement | null) & {

package/ChipsTrigger.js

@@ -12,146 +12,256 @@ import { ChevronDownOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
 import { useFocus } from '@hh.ru/magritte-ui-input/useFocus';
 import { useScrollbar, Scrollbar } from '@hh.ru/magritte-ui-scrollbar';
 
-var styles = {"root":"magritte-root___-zVdz_4-5-2","focused":"magritte-focused___0Uzyu_4-5-2","invalid":"magritte-invalid___tVzQV_4-5-2","disabled":"magritte-disabled___UeqcV_4-5-2","label":"magritte-label___j7Trt_4-5-2","field-input":"magritte-field-input___04Cag_4-5-2","fieldInput":"magritte-field-input___04Cag_4-5-2","scrollable-area":"magritte-scrollable-area___-xMF2_4-5-2","scrollableArea":"magritte-scrollable-area___-xMF2_4-5-2","focus-visible":"magritte-focus-visible___ifvAP_4-5-2","focusVisible":"magritte-focus-visible___ifvAP_4-5-2","large":"magritte-large___JIrIy_4-5-2","field":"magritte-field___rlEmn_4-5-2","icon":"magritte-icon___fDMiz_4-5-2","scrollable-area-wrapper":"magritte-scrollable-area-wrapper___hZNQd_4-5-2","scrollableAreaWrapper":"magritte-scrollable-area-wrapper___hZNQd_4-5-2","scrollable-area-wrapper_with-icon":"magritte-scrollable-area-wrapper_with-icon___2VoX9_4-5-2","scrollableAreaWrapperWithIcon":"magritte-scrollable-area-wrapper_with-icon___2VoX9_4-5-2","medium":"magritte-medium___Xk-XB_4-5-2","chips-and-input":"magritte-chips-and-input___qg-Ba_4-5-2","chipsAndInput":"magritte-chips-and-input___qg-Ba_4-5-2","label-wrapper":"magritte-label-wrapper___De7Bm_4-5-2","labelWrapper":"magritte-label-wrapper___De7Bm_4-5-2","icon_expanded":"magritte-icon_expanded___RaOT-_4-5-2","iconExpanded":"magritte-icon_expanded___RaOT-_4-5-2","custom-chip-wrapper":"magritte-custom-chip-wrapper___a9kJ6_4-5-2","customChipWrapper":"magritte-custom-chip-wrapper___a9kJ6_4-5-2"};
+var styles = {"root":"magritte-root___-zVdz_4-5-4","focused":"magritte-focused___0Uzyu_4-5-4","invalid":"magritte-invalid___tVzQV_4-5-4","disabled":"magritte-disabled___UeqcV_4-5-4","label":"magritte-label___j7Trt_4-5-4","field-input":"magritte-field-input___04Cag_4-5-4","fieldInput":"magritte-field-input___04Cag_4-5-4","scrollable-area":"magritte-scrollable-area___-xMF2_4-5-4","scrollableArea":"magritte-scrollable-area___-xMF2_4-5-4","focus-visible":"magritte-focus-visible___ifvAP_4-5-4","focusVisible":"magritte-focus-visible___ifvAP_4-5-4","large":"magritte-large___JIrIy_4-5-4","field":"magritte-field___rlEmn_4-5-4","icon":"magritte-icon___fDMiz_4-5-4","scrollable-area-wrapper":"magritte-scrollable-area-wrapper___hZNQd_4-5-4","scrollableAreaWrapper":"magritte-scrollable-area-wrapper___hZNQd_4-5-4","scrollable-area-wrapper_with-icon":"magritte-scrollable-area-wrapper_with-icon___2VoX9_4-5-4","scrollableAreaWrapperWithIcon":"magritte-scrollable-area-wrapper_with-icon___2VoX9_4-5-4","medium":"magritte-medium___Xk-XB_4-5-4","chips-and-input":"magritte-chips-and-input___qg-Ba_4-5-4","chipsAndInput":"magritte-chips-and-input___qg-Ba_4-5-4","label-wrapper":"magritte-label-wrapper___De7Bm_4-5-4","labelWrapper":"magritte-label-wrapper___De7Bm_4-5-4","icon_expanded":"magritte-icon_expanded___RaOT-_4-5-4","iconExpanded":"magritte-icon_expanded___RaOT-_4-5-4","custom-chip-wrapper":"magritte-custom-chip-wrapper___a9kJ6_4-5-4","customChipWrapper":"magritte-custom-chip-wrapper___a9kJ6_4-5-4"};
 
 const focusOnLastChip = (event, chipsContainer, input) => {
-    if (!chipsContainer || !input) {
-        return;
-    }
-    const nextFocusableElement = findNextFocusableElement(chipsContainer, input, 'left', 'list');
-    if (nextFocusableElement !== null) {
-        event.preventDefault();
-        nextFocusableElement.focus();
-    }
+  if (!chipsContainer || !input) {
+    return;
+  }
+  const nextFocusableElement = findNextFocusableElement(chipsContainer, input, "left", "list");
+  if (nextFocusableElement !== null) {
+    event.preventDefault();
+    nextFocusableElement.focus();
+  }
 };
-const ChipLayoutComponentDefault = ({ data: _, ...props }) => (jsx(CustomChip, { ...props }));
-const ChipsTriggerComponent = ({ size = 'large', placeholder, disabled, expanded: externalExpanded, toggleExpanded: toggleExternalExpanded, state, chipLayoutComponent, invalid, maxHeight, description, errorMessage, wrapperRef, rightIcon = true, onChange, onFocus, onBlur, onKeyDown, onChangeInput: onChangeInputExternal, allowArbitraryValues = true, 'data-qa': dataQa = 'chips-trigger', deleteButtonAriaLabel: _deleteButtonAriaLabel, 'aria-expanded': ariaExpanded, 'aria-controls': ariaControls, }, ref) => {
-    const { isMobile } = useBreakpoint();
-    const [expanded, setExpanded] = useState(false);
-    const [isFocusVisible, setFocusVisible] = useState(false);
-    const stateRef = useRef({ hadFocusWhenClicked: false, wasExpandedWhenClicked: false });
-    const { hasVerticalScroll, verticalScrollbarProps, ...scrollbar } = useScrollbar({
-        axis: disabled ? 'none' : 'vertical',
-    });
-    const chipsRootRef = useRef(null);
-    const chipsRootRefCallback = useMultipleRefs(wrapperRef, chipsRootRef);
-    const chipsContainerRef = useRef(null);
-    const chipsContainerRefCallback = useMultipleRefs(chipsContainerRef, scrollbar.contentWrapperRef);
-    const inputRef = useRef(null);
-    const inputRefCallback = useMultipleRefs(inputRef, ref);
-    const showLabel = state.value === '' && state.chips.length === 0 && placeholder !== '';
-    const labelId = useId();
-    const ariaLabeledBy = `chips-trigger-label-${labelId}`;
-    const deleteButtonAriaTrl = useTranslation('ChipsTrigger', 'delete');
-    const onChangeInput = useCallback((value) => {
+const ChipLayoutComponentDefault = ({ data: _, ...props }) => /* @__PURE__ */ jsx(CustomChip, { ...props });
+const ChipsTriggerComponent = ({
+  size = "large",
+  placeholder,
+  disabled,
+  expanded: externalExpanded,
+  toggleExpanded: toggleExternalExpanded,
+  state,
+  chipLayoutComponent,
+  invalid,
+  maxHeight,
+  description,
+  errorMessage,
+  wrapperRef,
+  rightIcon = true,
+  onChange,
+  onFocus,
+  onBlur,
+  onKeyDown,
+  onChangeInput: onChangeInputExternal,
+  allowArbitraryValues = true,
+  "data-qa": dataQa = "chips-trigger",
+  deleteButtonAriaLabel: _deleteButtonAriaLabel,
+  "aria-expanded": ariaExpanded,
+  "aria-controls": ariaControls
+}, ref) => {
+  const { isMobile } = useBreakpoint();
+  const [expanded, setExpanded] = useState(false);
+  const [isFocusVisible, setFocusVisible] = useState(false);
+  const stateRef = useRef({ hadFocusWhenClicked: false, wasExpandedWhenClicked: false });
+  const { hasVerticalScroll, verticalScrollbarProps, ...scrollbar } = useScrollbar({
+    axis: disabled ? "none" : "vertical"
+  });
+  const chipsRootRef = useRef(null);
+  const chipsRootRefCallback = useMultipleRefs(wrapperRef, chipsRootRef);
+  const chipsContainerRef = useRef(null);
+  const chipsContainerRefCallback = useMultipleRefs(chipsContainerRef, scrollbar.contentWrapperRef);
+  const inputRef = useRef(null);
+  const inputRefCallback = useMultipleRefs(inputRef, ref);
+  const showLabel = state.value === "" && state.chips.length === 0 && placeholder !== "";
+  const labelId = useId();
+  const ariaLabeledBy = `chips-trigger-label-${labelId}`;
+  const deleteButtonAriaTrl = useTranslation("ChipsTrigger", "delete");
+  const onChangeInput = useCallback(
+    (value) => {
+      onChange({
+        value,
+        chips: state.chips,
+        event: { type: "change", modifier: "keyboard" }
+      });
+      onChangeInputExternal?.(value);
+    },
+    [state.chips, onChange, onChangeInputExternal]
+  );
+  const { changeHandler, focusHandler, blurHandler, isFocused } = useFocus(onChangeInput, onFocus, onBlur);
+  useEffect(() => {
+    if (inputRef.current) {
+      setFocusVisible(isFocused && inputRef.current.classList.contains("focus-visible"));
+    }
+  }, [isFocused]);
+  const deleteHandler = useCallback(
+    (index) => {
+      const chips = [...state.chips];
+      const [deletedChip] = chips.splice(index, 1);
+      onChange({
+        value: state.value,
+        chips,
+        event: { type: "remove", modifier: "cross", element: deletedChip }
+      });
+    },
+    [onChange, state.chips, state.value]
+  );
+  const keyDownHandler = useCallback(
+    (event) => {
+      if (allowArbitraryValues && keyboardMatch(event.nativeEvent, keyboardKeys.Enter)) {
+        if (state.value.length === 0) {
+          return;
+        }
         onChange({
-            value,
-            chips: state.chips,
-            event: { type: 'change', modifier: 'keyboard' },
+          value: "",
+          chips: [...state.chips, { value: state.value, userInput: true }],
+          event: { type: "add", modifier: "enter" }
         });
-        onChangeInputExternal?.(value);
-    }, [state.chips, onChange, onChangeInputExternal]);
-    const { changeHandler, focusHandler, blurHandler, isFocused } = useFocus(onChangeInput, onFocus, onBlur);
-    useEffect(() => {
-        if (inputRef.current) {
-            setFocusVisible(isFocused && inputRef.current.classList.contains('focus-visible'));
+        onChangeInputExternal?.("");
+      }
+      if (state.value === "" && keyboardMatch(event.nativeEvent, keyboardKeys.Backspace)) {
+        if (state.chips.length === 0) {
+          return;
         }
-    }, [isFocused]);
-    const deleteHandler = useCallback((index) => {
         const chips = [...state.chips];
-        const [deletedChip] = chips.splice(index, 1);
+        const deletedChip = chips.pop();
         onChange({
-            value: state.value,
-            chips,
-            event: { type: 'remove', modifier: 'cross', element: deletedChip },
+          value: state.value,
+          chips,
+          event: { type: "remove", modifier: "backspace", element: deletedChip }
         });
-    }, [onChange, state.chips, state.value]);
-    const keyDownHandler = useCallback((event) => {
-        // создаем новый чипс и затираем текстовый инпут
-        if (allowArbitraryValues && keyboardMatch(event.nativeEvent, keyboardKeys.Enter)) {
-            if (state.value.length === 0) {
-                return;
+      }
+      if (state.value === "" && keyboardMatch(event.nativeEvent, keyboardKeys.ArrowLeft)) {
+        focusOnLastChip(event, chipsContainerRef.current, inputRef.current);
+      }
+    },
+    [allowArbitraryValues, onChange, onChangeInputExternal, state]
+  );
+  const scrollableAreaStyle = maxHeight ? { maxHeight: `${maxHeight - (size === "medium" ? 16 : 24)}px` } : void 0;
+  const ChipLayoutComponent = chipLayoutComponent ?? ChipLayoutComponentDefault;
+  const showIcon = rightIcon !== false;
+  const showCustomIcon = isValidElement(rightIcon);
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: chipsRootRefCallback,
+        className: classnames(styles.root, styles[size], scrollbar.hoverContainerCssClass, {
+          [styles.focused]: isFocused,
+          [styles.focusVisible]: isFocusVisible,
+          [styles.disabled]: !!disabled,
+          [styles.invalid]: !!invalid
+        }),
+        onFocus: () => {
+          if (disabled) {
+            return;
+          }
+          if (!inputRef.current) {
+            return;
+          }
+          setExpanded(true);
+          if (document.activeElement === chipsRootRef.current) {
+            inputRef.current.focus();
+          }
+        },
+        onBlur: (event) => {
+          stateRef.current.hadFocusWhenClicked &&= event.relatedTarget === chipsRootRef.current || event.relatedTarget === inputRef.current;
+          setExpanded(false);
+        },
+        onKeyDown,
+        onMouseDown: () => {
+          stateRef.current.hadFocusWhenClicked = document.activeElement === inputRef.current;
+          stateRef.current.wasExpandedWhenClicked = !!externalExpanded;
+        },
+        onClick: () => {
+          if (stateRef.current.hadFocusWhenClicked && stateRef.current.wasExpandedWhenClicked === externalExpanded) {
+            toggleExternalExpanded?.();
+          }
+          stateRef.current.hadFocusWhenClicked = false;
+          stateRef.current.wasExpandedWhenClicked = false;
+        },
+        tabIndex: disabled ? void 0 : 0,
+        "data-qa": dataQa,
+        "aria-disabled": disabled,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: scrollableAreaStyle,
+              className: classnames(styles.scrollableAreaWrapper, {
+                [styles.scrollableAreaWrapperWithIcon]: showIcon
+              }),
+              children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: styles.scrollableArea,
+                  ref: scrollbar.scrollContainerRef,
+                  children: /* @__PURE__ */ jsxs("div", { ref: chipsContainerRefCallback, className: styles.chipsAndInput, children: [
+                    state.chips.map((chip, index) => {
+                      return /* @__PURE__ */ jsx(
+                        "div",
+                        {
+                          className: styles.customChipWrapper,
+                          onMouseDown: (event) => event.preventDefault(),
+                          children: /* @__PURE__ */ jsx(
+                            ChipLayoutComponent,
+                            {
+                              Element: "button",
+                              size: "extra-small",
+                              onDelete: () => {
+                                deleteHandler(index);
+                              },
+                              dataQaWrapper: `chips-trigger-chip-${chip.value}`,
+                              deleteButtonAriaLabel: _deleteButtonAriaLabel ?? deleteButtonAriaTrl,
+                              disabled,
+                              data: chip.data,
+                              deleteOnly: true,
+                              children: chip.label ?? chip.value
+                            }
+                          )
+                        },
+                        `${chip.value}-${index}`
+                      );
+                    }),
+                    /* @__PURE__ */ jsxs("div", { className: styles.field, children: [
+                      /* @__PURE__ */ jsx(
+                        "input",
+                        {
+                          ref: inputRefCallback,
+                          className: styles.fieldInput,
+                          type: "text",
+                          disabled,
+                          value: state.value,
+                          onKeyDown: keyDownHandler,
+                          onFocus: focusHandler,
+                          onBlur: blurHandler,
+                          onChange: changeHandler,
+                          "data-qa": "chips-trigger-input",
+                          readOnly: isMobile,
+                          "aria-labelledby": showLabel ? ariaLabeledBy : void 0,
+                          role: "combobox",
+                          "aria-haspopup": "listbox",
+                          "aria-autocomplete": "list",
+                          "aria-expanded": ariaExpanded,
+                          "aria-controls": ariaControls
+                        }
+                      ),
+                      showLabel && /* @__PURE__ */ jsx("div", { className: styles.labelWrapper, children: /* @__PURE__ */ jsx("label", { className: styles.label, id: ariaLabeledBy, children: placeholder }) })
+                    ] })
+                  ] })
+                }
+              )
             }
-            onChange({
-                value: '',
-                chips: [...state.chips, { value: state.value, userInput: true }],
-                event: { type: 'add', modifier: 'enter' },
-            });
-            onChangeInputExternal?.('');
-        }
-        // удаляем последний созданный чипс
-        if (state.value === '' && keyboardMatch(event.nativeEvent, keyboardKeys.Backspace)) {
-            if (state.chips.length === 0) {
-                return;
+          ),
+          showIcon && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: classnames(styles.icon, {
+                [styles.iconExpanded]: (expanded || externalExpanded) && !showCustomIcon
+              }),
+              "data-qa": "chips-trigger-icon",
+              children: showCustomIcon ? rightIcon : /* @__PURE__ */ jsx(ChevronDownOutlinedSize24, {})
             }
-            const chips = [...state.chips];
-            const deletedChip = chips.pop();
-            onChange({
-                value: state.value,
-                chips,
-                event: { type: 'remove', modifier: 'backspace', element: deletedChip },
-            });
-        }
-        // пытаемся найти ближайший чипс для фокуса
-        if (state.value === '' && keyboardMatch(event.nativeEvent, keyboardKeys.ArrowLeft)) {
-            focusOnLastChip(event, chipsContainerRef.current, inputRef.current);
-        }
-    }, [allowArbitraryValues, onChange, onChangeInputExternal, state]);
-    // при выставлении высоты учитваем падинги
-    // иначе высота будет больше значения свойства
-    const scrollableAreaStyle = maxHeight ? { maxHeight: `${maxHeight - (size === 'medium' ? 16 : 24)}px` } : undefined;
-    const ChipLayoutComponent = chipLayoutComponent ?? ChipLayoutComponentDefault;
-    const showIcon = rightIcon !== false;
-    const showCustomIcon = isValidElement(rightIcon);
-    return (jsxs("div", { children: [jsxs("div", { ref: chipsRootRefCallback, className: classnames(styles.root, styles[size], scrollbar.hoverContainerCssClass, {
-                    [styles.focused]: isFocused,
-                    [styles.focusVisible]: isFocusVisible,
-                    [styles.disabled]: !!disabled,
-                    [styles.invalid]: !!invalid,
-                }), onFocus: () => {
-                    if (disabled) {
-                        return;
-                    }
-                    if (!inputRef.current) {
-                        return;
-                    }
-                    setExpanded(true);
-                    // добавляем .focus() еще и тут
-                    // чтобы не сбрасывать фокус во время клика по chip
-                    // или по клику на враппер
-                    if (document.activeElement === chipsRootRef.current) {
-                        inputRef.current.focus();
-                    }
-                }, onBlur: (event) => {
-                    stateRef.current.hadFocusWhenClicked &&=
-                        event.relatedTarget === chipsRootRef.current || event.relatedTarget === inputRef.current;
-                    setExpanded(false);
-                }, onKeyDown: onKeyDown, onMouseDown: () => {
-                    // при повторном клике по инпуту в фокусе нужно закрыть дроп
-                    // при этом клик может прийтись на обертку, из-за чего инпут поймает blur и повторный фокус
-                    // что усложняет проверку того, что инпут уже был в фокусе в момент клика
-                    // поэтому в цепочке mouseDown -> blur -> focus -> click храним флаг, что фокус не вышел за пределы компонента
-                    stateRef.current.hadFocusWhenClicked = document.activeElement === inputRef.current;
-                    stateRef.current.wasExpandedWhenClicked = !!externalExpanded;
-                }, onClick: () => {
-                    if (stateRef.current.hadFocusWhenClicked &&
-                        stateRef.current.wasExpandedWhenClicked === externalExpanded) {
-                        toggleExternalExpanded?.();
-                    }
-                    stateRef.current.hadFocusWhenClicked = false;
-                    stateRef.current.wasExpandedWhenClicked = false;
-                }, tabIndex: disabled ? undefined : 0, "data-qa": dataQa, "aria-disabled": disabled, children: [jsx("div", { style: scrollableAreaStyle, className: classnames(styles.scrollableAreaWrapper, {
-                            [styles.scrollableAreaWrapperWithIcon]: showIcon,
-                        }), children: jsx("div", { className: styles.scrollableArea, ref: scrollbar.scrollContainerRef, children: jsxs("div", { ref: chipsContainerRefCallback, className: styles.chipsAndInput, children: [state.chips.map((chip, index) => {
-                                        return (jsx("div", { className: styles.customChipWrapper, onMouseDown: (event) => event.preventDefault(), children: jsx(ChipLayoutComponent, { Element: "button", size: "extra-small", onDelete: () => {
-                                                    deleteHandler(index);
-                                                }, dataQaWrapper: `chips-trigger-chip-${chip.value}`, deleteButtonAriaLabel: _deleteButtonAriaLabel ?? deleteButtonAriaTrl, disabled: disabled, data: chip.data, deleteOnly: true, children: chip.label ?? chip.value }) }, `${chip.value}-${index}`));
-                                    }), jsxs("div", { className: styles.field, children: [jsx("input", { ref: inputRefCallback, className: styles.fieldInput, type: "text", disabled: disabled, value: state.value, onKeyDown: keyDownHandler, onFocus: focusHandler, onBlur: blurHandler, onChange: changeHandler, "data-qa": "chips-trigger-input", readOnly: isMobile, "aria-labelledby": showLabel ? ariaLabeledBy : undefined, role: 'combobox', "aria-haspopup": 'listbox', "aria-autocomplete": 'list', "aria-expanded": ariaExpanded, "aria-controls": ariaControls }), showLabel && (jsx("div", { className: styles.labelWrapper, children: jsx("label", { className: styles.label, id: ariaLabeledBy, children: placeholder }) }))] })] }) }) }), showIcon && (jsx("div", { className: classnames(styles.icon, {
-                            [styles.iconExpanded]: (expanded || externalExpanded) && !showCustomIcon,
-                        }), "data-qa": "chips-trigger-icon", children: showCustomIcon ? rightIcon : jsx(ChevronDownOutlinedSize24, {}) })), hasVerticalScroll && jsx(Scrollbar, { ...verticalScrollbarProps })] }), jsx(FormHelper, { description: description, errorMessage: errorMessage, disabled: disabled, invalid: invalid })] }));
+          ),
+          hasVerticalScroll && /* @__PURE__ */ jsx(Scrollbar, { ...verticalScrollbarProps })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(FormHelper, { description, errorMessage, disabled, invalid })
+  ] });
 };
 const ChipsTrigger = forwardRef(ChipsTriggerComponent);
-ChipsTrigger.displayName = 'ChipsTrigger';
+ChipsTrigger.displayName = "ChipsTrigger";
 
 export { ChipsTrigger };
 //# sourceMappingURL=ChipsTrigger.js.map

package/ChipsTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChipsTrigger.js","sources":["src/ChipsTrigger.tsx"],"sourcesContent":["import {\n    ForwardedRef,\n    LegacyRef,\n    InputHTMLAttributes,\n    KeyboardEventHandler,\n    ReactElement,\n    SyntheticEvent,\n    forwardRef,\n    useCallback,\n    useEffect,\n    useId,\n    useRef,\n    useState,\n    isValidElement,\n} from 'react';\nimport classnames from 'classnames';\n\nimport { findNextFocusableElement, keyboardKeys, keyboardMatch } from '@hh.ru/magritte-common-keyboard';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { CustomChip } from '@hh.ru/magritte-ui-chips';\nimport { ChipCustomLayoutProps, ChipsTriggerProps } from '@hh.ru/magritte-ui-chips-trigger/types';\nimport { FormHelper } from '@hh.ru/magritte-ui-form-helper';\nimport { ChevronDownOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { useFocus } from '@hh.ru/magritte-ui-input/useFocus';\nimport { Scrollbar, useScrollbar } from '@hh.ru/magritte-ui-scrollbar';\n\nimport styles from './chips-trigger.less';\n\nconst focusOnLastChip = (event: SyntheticEvent, chipsContainer: HTMLElement | null, input: HTMLElement | null) => {\n    if (!chipsContainer || !input) {\n        return;\n    }\n    const nextFocusableElement = findNextFocusableElement(chipsContainer, input, 'left', 'list');\n    if (nextFocusableElement !== null) {\n        event.preventDefault();\n        nextFocusableElement.focus();\n    }\n};\n\nconst ChipLayoutComponentDefault = ({ data: _, ...props }: ChipCustomLayoutProps): ReactElement => (\n    <CustomChip {...props} />\n);\n\ntype State = {\n    hadFocusWhenClicked: boolean;\n    wasExpandedWhenClicked: boolean;\n};\n\nconst ChipsTriggerComponent = <T,>(\n    {\n        size = 'large',\n        placeholder,\n        disabled,\n        expanded: externalExpanded,\n        toggleExpanded: toggleExternalExpanded,\n        state,\n        chipLayoutComponent,\n        invalid,\n        maxHeight,\n        description,\n        errorMessage,\n        wrapperRef,\n        rightIcon = true,\n        onChange,\n        onFocus,\n        onBlur,\n        onKeyDown,\n        onChangeInput: onChangeInputExternal,\n        allowArbitraryValues = true,\n        'data-qa': dataQa = 'chips-trigger',\n        deleteButtonAriaLabel: _deleteButtonAriaLabel,\n        'aria-expanded': ariaExpanded,\n        'aria-controls': ariaControls,\n    }: ChipsTriggerProps<T> & Omit<InputHTMLAttributes<HTMLInputElement>, keyof ChipsTriggerProps<T>>,\n    ref: ForwardedRef<HTMLInputElement>\n) => {\n    const { isMobile } = useBreakpoint();\n    const [expanded, setExpanded] = useState(false);\n    const [isFocusVisible, setFocusVisible] = useState(false);\n    const stateRef = useRef<State>({ hadFocusWhenClicked: false, wasExpandedWhenClicked: false });\n\n    const { hasVerticalScroll, verticalScrollbarProps, ...scrollbar } = useScrollbar({\n        axis: disabled ? 'none' : 'vertical',\n    });\n\n    const chipsRootRef = useRef<HTMLDivElement>(null);\n    const chipsRootRefCallback = useMultipleRefs(wrapperRef, chipsRootRef);\n    const chipsContainerRef = useRef<HTMLDivElement>(null);\n    const chipsContainerRefCallback = useMultipleRefs(chipsContainerRef, scrollbar.contentWrapperRef);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const inputRefCallback = useMultipleRefs(inputRef, ref);\n    const showLabel = state.value === '' && state.chips.length === 0 && placeholder !== '';\n    const labelId = useId();\n    const ariaLabeledBy = `chips-trigger-label-${labelId}`;\n    const deleteButtonAriaTrl = useTranslation('ChipsTrigger', 'delete');\n\n    const onChangeInput = useCallback(\n        (value: string) => {\n            onChange({\n                value,\n                chips: state.chips,\n                event: { type: 'change', modifier: 'keyboard' },\n            });\n            onChangeInputExternal?.(value);\n        },\n        [state.chips, onChange, onChangeInputExternal]\n    );\n    const { changeHandler, focusHandler, blurHandler, isFocused } = useFocus(onChangeInput, onFocus, onBlur);\n\n    useEffect(() => {\n        if (inputRef.current) {\n            setFocusVisible(isFocused && inputRef.current.classList.contains('focus-visible'));\n        }\n    }, [isFocused]);\n\n    const deleteHandler = useCallback(\n        (index: number) => {\n            const chips = [...state.chips];\n            const [deletedChip] = chips.splice(index, 1);\n            onChange({\n                value: state.value,\n                chips,\n                event: { type: 'remove', modifier: 'cross', element: deletedChip },\n            });\n        },\n        [onChange, state.chips, state.value]\n    );\n\n    const keyDownHandler = useCallback<KeyboardEventHandler>(\n        (event) => {\n            // создаем новый чипс и затираем текстовый инпут\n            if (allowArbitraryValues && keyboardMatch(event.nativeEvent, keyboardKeys.Enter)) {\n                if (state.value.length === 0) {\n                    return;\n                }\n                onChange({\n                    value: '',\n                    chips: [...state.chips, { value: state.value, userInput: true }],\n                    event: { type: 'add', modifier: 'enter' },\n                });\n                onChangeInputExternal?.('');\n            }\n            // удаляем последний созданный чипс\n            if (state.value === '' && keyboardMatch(event.nativeEvent, keyboardKeys.Backspace)) {\n                if (state.chips.length === 0) {\n                    return;\n                }\n                const chips = [...state.chips];\n                const deletedChip = chips.pop();\n                onChange({\n                    value: state.value,\n                    chips,\n                    event: { type: 'remove', modifier: 'backspace', element: deletedChip },\n                });\n            }\n            // пытаемся найти ближайший чипс для фокуса\n            if (state.value === '' && keyboardMatch(event.nativeEvent, keyboardKeys.ArrowLeft)) {\n                focusOnLastChip(event, chipsContainerRef.current, inputRef.current);\n            }\n        },\n        [allowArbitraryValues, onChange, onChangeInputExternal, state]\n    );\n\n    // при выставлении высоты учитваем падинги\n    // иначе высота будет больше значения свойства\n    const scrollableAreaStyle = maxHeight ? { maxHeight: `${maxHeight - (size === 'medium' ? 16 : 24)}px` } : undefined;\n    const ChipLayoutComponent = chipLayoutComponent ?? ChipLayoutComponentDefault;\n\n    const showIcon = rightIcon !== false;\n    const showCustomIcon = isValidElement(rightIcon);\n\n    return (\n        <div>\n            <div\n                ref={chipsRootRefCallback}\n                className={classnames(styles.root, styles[size], scrollbar.hoverContainerCssClass, {\n                    [styles.focused]: isFocused,\n                    [styles.focusVisible]: isFocusVisible,\n                    [styles.disabled]: !!disabled,\n                    [styles.invalid]: !!invalid,\n                })}\n                onFocus={() => {\n                    if (disabled) {\n                        return;\n                    }\n                    if (!inputRef.current) {\n                        return;\n                    }\n                    setExpanded(true);\n                    // добавляем .focus() еще и тут\n                    // чтобы не сбрасывать фокус во время клика по chip\n                    // или по клику на враппер\n                    if (document.activeElement === chipsRootRef.current) {\n                        inputRef.current.focus();\n                    }\n                }}\n                onBlur={(event) => {\n                    stateRef.current.hadFocusWhenClicked &&=\n                        event.relatedTarget === chipsRootRef.current || event.relatedTarget === inputRef.current;\n                    setExpanded(false);\n                }}\n                onKeyDown={onKeyDown}\n                onMouseDown={() => {\n                    // при повторном клике по инпуту в фокусе нужно закрыть дроп\n                    // при этом клик может прийтись на обертку, из-за чего инпут поймает blur и повторный фокус\n                    // что усложняет проверку того, что инпут уже был в фокусе в момент клика\n                    // поэтому в цепочке mouseDown -> blur -> focus -> click храним флаг, что фокус не вышел за пределы компонента\n                    stateRef.current.hadFocusWhenClicked = document.activeElement === inputRef.current;\n                    stateRef.current.wasExpandedWhenClicked = !!externalExpanded;\n                }}\n                onClick={() => {\n                    if (\n                        stateRef.current.hadFocusWhenClicked &&\n                        stateRef.current.wasExpandedWhenClicked === externalExpanded\n                    ) {\n                        toggleExternalExpanded?.();\n                    }\n                    stateRef.current.hadFocusWhenClicked = false;\n                    stateRef.current.wasExpandedWhenClicked = false;\n                }}\n                tabIndex={disabled ? undefined : 0}\n                data-qa={dataQa}\n                aria-disabled={disabled}\n            >\n                <div\n                    style={scrollableAreaStyle}\n                    className={classnames(styles.scrollableAreaWrapper, {\n                        [styles.scrollableAreaWrapperWithIcon]: showIcon,\n                    })}\n                >\n                    <div\n                        className={styles.scrollableArea}\n                        ref={scrollbar.scrollContainerRef as React.Ref<HTMLDivElement>}\n                    >\n                        <div ref={chipsContainerRefCallback} className={styles.chipsAndInput}>\n                            {state.chips.map((chip, index) => {\n                                return (\n                                    <div\n                                        key={`${chip.value}-${index}`}\n                                        className={styles.customChipWrapper}\n                                        onMouseDown={(event) => event.preventDefault()}\n                                    >\n                                        <ChipLayoutComponent\n                                            Element=\"button\"\n                                            size=\"extra-small\"\n                                            onDelete={() => {\n                                                deleteHandler(index);\n                                            }}\n                                            dataQaWrapper={`chips-trigger-chip-${chip.value}`}\n                                            deleteButtonAriaLabel={_deleteButtonAriaLabel ?? deleteButtonAriaTrl}\n                                            disabled={disabled}\n                                            data={chip.data}\n                                            deleteOnly\n                                        >\n                                            {chip.label ?? chip.value}\n                                        </ChipLayoutComponent>\n                                    </div>\n                                );\n                            })}\n                            <div className={styles.field}>\n                                <input\n                                    ref={inputRefCallback}\n                                    className={styles.fieldInput}\n                                    type=\"text\"\n                                    disabled={disabled}\n                                    value={state.value}\n                                    onKeyDown={keyDownHandler}\n                                    onFocus={focusHandler}\n                                    onBlur={blurHandler}\n                                    onChange={changeHandler}\n                                    data-qa=\"chips-trigger-input\"\n                                    readOnly={isMobile}\n                                    aria-labelledby={showLabel ? ariaLabeledBy : undefined}\n                                    role={'combobox'}\n                                    aria-haspopup={'listbox'}\n                                    aria-autocomplete={'list'}\n                                    aria-expanded={ariaExpanded}\n                                    aria-controls={ariaControls}\n                                />\n                                {showLabel && (\n                                    <div className={styles.labelWrapper}>\n                                        <label className={styles.label} id={ariaLabeledBy}>\n                                            {placeholder}\n                                        </label>\n                                    </div>\n                                )}\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                {showIcon && (\n                    <div\n                        className={classnames(styles.icon, {\n                            [styles.iconExpanded]: (expanded || externalExpanded) && !showCustomIcon,\n                        })}\n                        data-qa=\"chips-trigger-icon\"\n                    >\n                        {showCustomIcon ? rightIcon : <ChevronDownOutlinedSize24 />}\n                    </div>\n                )}\n                {hasVerticalScroll && <Scrollbar {...verticalScrollbarProps} />}\n            </div>\n            <FormHelper description={description} errorMessage={errorMessage} disabled={disabled} invalid={invalid} />\n        </div>\n    );\n};\n\nconst ChipsTrigger = forwardRef(ChipsTriggerComponent) as (<T>(\n    props: ChipsTriggerProps<T> &\n        Omit<InputHTMLAttributes<HTMLInputElement>, keyof ChipsTriggerProps<T>> & {\n            ref?: LegacyRef<HTMLInputElement>;\n        }\n) => ReactElement | null) & { displayName: string };\n\nChipsTrigger.displayName = 'ChipsTrigger';\n\nexport { ChipsTrigger };\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;AA8BA,MAAM,eAAe,GAAG,CAAC,KAAqB,EAAE,cAAkC,EAAE,KAAyB,KAAI;AAC7G,IAAA,IAAI,CAAC,cAAc,IAAI,CAAC,KAAK,EAAE;QAC3B,OAAO;KACV;AACD,IAAA,MAAM,oBAAoB,GAAG,wBAAwB,CAAC,cAAc,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;AAC7F,IAAA,IAAI,oBAAoB,KAAK,IAAI,EAAE;QAC/B,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,oBAAoB,CAAC,KAAK,EAAE,CAAC;KAChC;AACL,CAAC,CAAC;AAEF,MAAM,0BAA0B,GAAG,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,KAAK,EAAyB,MAC5EA,GAAA,CAAC,UAAU,EAAK,EAAA,GAAA,KAAK,EAAI,CAAA,CAC5B,CAAC;AAOF,MAAM,qBAAqB,GAAG,CAC1B,EACI,IAAI,GAAG,OAAO,EACd,WAAW,EACX,QAAQ,EACR,QAAQ,EAAE,gBAAgB,EAC1B,cAAc,EAAE,sBAAsB,EACtC,KAAK,EACL,mBAAmB,EACnB,OAAO,EACP,SAAS,EACT,WAAW,EACX,YAAY,EACZ,UAAU,EACV,SAAS,GAAG,IAAI,EAChB,QAAQ,EACR,OAAO,EACP,MAAM,EACN,SAAS,EACT,aAAa,EAAE,qBAAqB,EACpC,oBAAoB,GAAG,IAAI,EAC3B,SAAS,EAAE,MAAM,GAAG,eAAe,EACnC,qBAAqB,EAAE,sBAAsB,EAC7C,eAAe,EAAE,YAAY,EAC7B,eAAe,EAAE,YAAY,GACgE,EACjG,GAAmC,KACnC;AACA,IAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,aAAa,EAAE,CAAC;IACrC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAChD,MAAM,CAAC,cAAc,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAC1D,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAQ,EAAE,mBAAmB,EAAE,KAAK,EAAE,sBAAsB,EAAE,KAAK,EAAE,CAAC,CAAC;IAE9F,MAAM,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,GAAG,SAAS,EAAE,GAAG,YAAY,CAAC;QAC7E,IAAI,EAAE,QAAQ,GAAG,MAAM,GAAG,UAAU;AACvC,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAClD,MAAM,oBAAoB,GAAG,eAAe,CAAC,UAAU,EAAE,YAAY,CAAC,CAAC;AACvE,IAAA,MAAM,iBAAiB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACvD,MAAM,yBAAyB,GAAG,eAAe,CAAC,iBAAiB,EAAE,SAAS,CAAC,iBAAiB,CAAC,CAAC;AAClG,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAChD,MAAM,gBAAgB,GAAG,eAAe,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;AACxD,IAAA,MAAM,SAAS,GAAG,KAAK,CAAC,KAAK,KAAK,EAAE,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,WAAW,KAAK,EAAE,CAAC;AACvF,IAAA,MAAM,OAAO,GAAG,KAAK,EAAE,CAAC;AACxB,IAAA,MAAM,aAAa,GAAG,CAAuB,oBAAA,EAAA,OAAO,EAAE,CAAC;IACvD,MAAM,mBAAmB,GAAG,cAAc,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAC;AAErE,IAAA,MAAM,aAAa,GAAG,WAAW,CAC7B,CAAC,KAAa,KAAI;AACd,QAAA,QAAQ,CAAC;YACL,KAAK;YACL,KAAK,EAAE,KAAK,CAAC,KAAK;YAClB,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE;AAClD,SAAA,CAAC,CAAC;AACH,QAAA,qBAAqB,GAAG,KAAK,CAAC,CAAC;KAClC,EACD,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,qBAAqB,CAAC,CACjD,CAAC;AACF,IAAA,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,QAAQ,CAAC,aAAa,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;IAEzG,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,QAAQ,CAAC,OAAO,EAAE;AAClB,YAAA,eAAe,CAAC,SAAS,IAAI,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,CAAC;SACtF;AACL,KAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;AAEhB,IAAA,MAAM,aAAa,GAAG,WAAW,CAC7B,CAAC,KAAa,KAAI;QACd,MAAM,KAAK,GAAG,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC;AAC/B,QAAA,MAAM,CAAC,WAAW,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;AAC7C,QAAA,QAAQ,CAAC;YACL,KAAK,EAAE,KAAK,CAAC,KAAK;YAClB,KAAK;AACL,YAAA,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE;AACrE,SAAA,CAAC,CAAC;AACP,KAAC,EACD,CAAC,QAAQ,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CACvC,CAAC;AAEF,IAAA,MAAM,cAAc,GAAG,WAAW,CAC9B,CAAC,KAAK,KAAI;;AAEN,QAAA,IAAI,oBAAoB,IAAI,aAAa,CAAC,KAAK,CAAC,WAAW,EAAE,YAAY,CAAC,KAAK,CAAC,EAAE;YAC9E,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;gBAC1B,OAAO;aACV;AACD,YAAA,QAAQ,CAAC;AACL,gBAAA,KAAK,EAAE,EAAE;AACT,gBAAA,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;gBAChE,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE;AAC5C,aAAA,CAAC,CAAC;AACH,YAAA,qBAAqB,GAAG,EAAE,CAAC,CAAC;SAC/B;;AAED,QAAA,IAAI,KAAK,CAAC,KAAK,KAAK,EAAE,IAAI,aAAa,CAAC,KAAK,CAAC,WAAW,EAAE,YAAY,CAAC,SAAS,CAAC,EAAE;YAChF,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;gBAC1B,OAAO;aACV;YACD,MAAM,KAAK,GAAG,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC;AAC/B,YAAA,MAAM,WAAW,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC;AAChC,YAAA,QAAQ,CAAC;gBACL,KAAK,EAAE,KAAK,CAAC,KAAK;gBAClB,KAAK;AACL,gBAAA,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,OAAO,EAAE,WAAW,EAAE;AACzE,aAAA,CAAC,CAAC;SACN;;AAED,QAAA,IAAI,KAAK,CAAC,KAAK,KAAK,EAAE,IAAI,aAAa,CAAC,KAAK,CAAC,WAAW,EAAE,YAAY,CAAC,SAAS,CAAC,EAAE;YAChF,eAAe,CAAC,KAAK,EAAE,iBAAiB,CAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;SACvE;KACJ,EACD,CAAC,oBAAoB,EAAE,QAAQ,EAAE,qBAAqB,EAAE,KAAK,CAAC,CACjE,CAAC;;;AAIF,IAAA,MAAM,mBAAmB,GAAG,SAAS,GAAG,EAAE,SAAS,EAAE,CAAA,EAAG,SAAS,IAAI,IAAI,KAAK,QAAQ,GAAG,EAAE,GAAG,EAAE,CAAC,CAAA,EAAA,CAAI,EAAE,GAAG,SAAS,CAAC;AACpH,IAAA,MAAM,mBAAmB,GAAG,mBAAmB,IAAI,0BAA0B,CAAC;AAE9E,IAAA,MAAM,QAAQ,GAAG,SAAS,KAAK,KAAK,CAAC;AACrC,IAAA,MAAM,cAAc,GAAG,cAAc,CAAC,SAAS,CAAC,CAAC;IAEjD,QACIC,yBACIA,IACI,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,oBAAoB,EACzB,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,sBAAsB,EAAE;AAC/E,oBAAA,CAAC,MAAM,CAAC,OAAO,GAAG,SAAS;AAC3B,oBAAA,CAAC,MAAM,CAAC,YAAY,GAAG,cAAc;AACrC,oBAAA,CAAC,MAAM,CAAC,QAAQ,GAAG,CAAC,CAAC,QAAQ;AAC7B,oBAAA,CAAC,MAAM,CAAC,OAAO,GAAG,CAAC,CAAC,OAAO;AAC9B,iBAAA,CAAC,EACF,OAAO,EAAE,MAAK;oBACV,IAAI,QAAQ,EAAE;wBACV,OAAO;qBACV;AACD,oBAAA,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;wBACnB,OAAO;qBACV;oBACD,WAAW,CAAC,IAAI,CAAC,CAAC;;;;oBAIlB,IAAI,QAAQ,CAAC,aAAa,KAAK,YAAY,CAAC,OAAO,EAAE;AACjD,wBAAA,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;qBAC5B;AACL,iBAAC,EACD,MAAM,EAAE,CAAC,KAAK,KAAI;oBACd,QAAQ,CAAC,OAAO,CAAC,mBAAmB;AAChC,wBAAA,KAAK,CAAC,aAAa,KAAK,YAAY,CAAC,OAAO,IAAI,KAAK,CAAC,aAAa,KAAK,QAAQ,CAAC,OAAO,CAAC;oBAC7F,WAAW,CAAC,KAAK,CAAC,CAAC;iBACtB,EACD,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,MAAK;;;;;AAKd,oBAAA,QAAQ,CAAC,OAAO,CAAC,mBAAmB,GAAG,QAAQ,CAAC,aAAa,KAAK,QAAQ,CAAC,OAAO,CAAC;oBACnF,QAAQ,CAAC,OAAO,CAAC,sBAAsB,GAAG,CAAC,CAAC,gBAAgB,CAAC;AACjE,iBAAC,EACD,OAAO,EAAE,MAAK;AACV,oBAAA,IACI,QAAQ,CAAC,OAAO,CAAC,mBAAmB;AACpC,wBAAA,QAAQ,CAAC,OAAO,CAAC,sBAAsB,KAAK,gBAAgB,EAC9D;wBACE,sBAAsB,IAAI,CAAC;qBAC9B;AACD,oBAAA,QAAQ,CAAC,OAAO,CAAC,mBAAmB,GAAG,KAAK,CAAC;AAC7C,oBAAA,QAAQ,CAAC,OAAO,CAAC,sBAAsB,GAAG,KAAK,CAAC;AACpD,iBAAC,EACD,QAAQ,EAAE,QAAQ,GAAG,SAAS,GAAG,CAAC,EACzB,SAAA,EAAA,MAAM,EACA,eAAA,EAAA,QAAQ,EAEvB,QAAA,EAAA,CAAAD,GAAA,CAAA,KAAA,EAAA,EACI,KAAK,EAAE,mBAAmB,EAC1B,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,qBAAqB,EAAE;AAChD,4BAAA,CAAC,MAAM,CAAC,6BAA6B,GAAG,QAAQ;AACnD,yBAAA,CAAC,YAEFA,GACI,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,cAAc,EAChC,GAAG,EAAE,SAAS,CAAC,kBAA+C,EAE9D,QAAA,EAAAC,IAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,yBAAyB,EAAE,SAAS,EAAE,MAAM,CAAC,aAAa,EAAA,QAAA,EAAA,CAC/D,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;AAC7B,wCAAA,QACID,GAAA,CAAA,KAAA,EAAA,EAEI,SAAS,EAAE,MAAM,CAAC,iBAAiB,EACnC,WAAW,EAAE,CAAC,KAAK,KAAK,KAAK,CAAC,cAAc,EAAE,EAE9C,QAAA,EAAAA,GAAA,CAAC,mBAAmB,EAAA,EAChB,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAC,aAAa,EAClB,QAAQ,EAAE,MAAK;oDACX,aAAa,CAAC,KAAK,CAAC,CAAC;iDACxB,EACD,aAAa,EAAE,CAAA,mBAAA,EAAsB,IAAI,CAAC,KAAK,EAAE,EACjD,qBAAqB,EAAE,sBAAsB,IAAI,mBAAmB,EACpE,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,UAAU,EAET,IAAA,EAAA,QAAA,EAAA,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,GACP,EAjBjB,EAAA,CAAA,EAAG,IAAI,CAAC,KAAK,IAAI,KAAK,CAAA,CAAE,CAkB3B,EACR;qCACL,CAAC,EACFC,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,KAAK,EAAA,QAAA,EAAA,CACxBD,GACI,CAAA,OAAA,EAAA,EAAA,GAAG,EAAE,gBAAgB,EACrB,SAAS,EAAE,MAAM,CAAC,UAAU,EAC5B,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,SAAS,EAAE,cAAc,EACzB,OAAO,EAAE,YAAY,EACrB,MAAM,EAAE,WAAW,EACnB,QAAQ,EAAE,aAAa,EAAA,SAAA,EACf,qBAAqB,EAC7B,QAAQ,EAAE,QAAQ,EAAA,iBAAA,EACD,SAAS,GAAG,aAAa,GAAG,SAAS,EACtD,IAAI,EAAE,UAAU,EACD,eAAA,EAAA,SAAS,EACL,mBAAA,EAAA,MAAM,EACV,eAAA,EAAA,YAAY,EACZ,eAAA,EAAA,YAAY,EAC7B,CAAA,EACD,SAAS,KACNA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,YAAY,EAAA,QAAA,EAC/BA,GAAO,CAAA,OAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,KAAK,EAAE,EAAE,EAAE,aAAa,EAAA,QAAA,EAC5C,WAAW,EAAA,CACR,EACN,CAAA,CACT,CACC,EAAA,CAAA,CAAA,EAAA,CACJ,EACJ,CAAA,EAAA,CACJ,EACL,QAAQ,KACLA,GACI,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,EAAE;AAC/B,4BAAA,CAAC,MAAM,CAAC,YAAY,GAAG,CAAC,QAAQ,IAAI,gBAAgB,KAAK,CAAC,cAAc;yBAC3E,CAAC,EAAA,SAAA,EACM,oBAAoB,EAE3B,QAAA,EAAA,cAAc,GAAG,SAAS,GAAGA,GAAC,CAAA,yBAAyB,KAAG,EACzD,CAAA,CACT,EACA,iBAAiB,IAAIA,GAAC,CAAA,SAAS,EAAK,EAAA,GAAA,sBAAsB,GAAI,CAC7D,EAAA,CAAA,EACNA,IAAC,UAAU,EAAA,EAAC,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAA,CAAI,CACxG,EAAA,CAAA,EACR;AACN,CAAC,CAAC;AAEF,MAAM,YAAY,GAAG,UAAU,CAAC,qBAAqB,EAKD;AAEpD,YAAY,CAAC,WAAW,GAAG,cAAc;;;;"}
+{"version":3,"file":"ChipsTrigger.js","sources":["src/ChipsTrigger.tsx"],"sourcesContent":["import {\n    ForwardedRef,\n    LegacyRef,\n    InputHTMLAttributes,\n    KeyboardEventHandler,\n    ReactElement,\n    SyntheticEvent,\n    forwardRef,\n    useCallback,\n    useEffect,\n    useId,\n    useRef,\n    useState,\n    isValidElement,\n} from 'react';\nimport classnames from 'classnames';\n\nimport { findNextFocusableElement, keyboardKeys, keyboardMatch } from '@hh.ru/magritte-common-keyboard';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { CustomChip } from '@hh.ru/magritte-ui-chips';\nimport { ChipCustomLayoutProps, ChipsTriggerProps } from '@hh.ru/magritte-ui-chips-trigger/types';\nimport { FormHelper } from '@hh.ru/magritte-ui-form-helper';\nimport { ChevronDownOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { useFocus } from '@hh.ru/magritte-ui-input/useFocus';\nimport { Scrollbar, useScrollbar } from '@hh.ru/magritte-ui-scrollbar';\n\nimport styles from './chips-trigger.less';\n\nconst focusOnLastChip = (event: SyntheticEvent, chipsContainer: HTMLElement | null, input: HTMLElement | null) => {\n    if (!chipsContainer || !input) {\n        return;\n    }\n    const nextFocusableElement = findNextFocusableElement(chipsContainer, input, 'left', 'list');\n    if (nextFocusableElement !== null) {\n        event.preventDefault();\n        nextFocusableElement.focus();\n    }\n};\n\nconst ChipLayoutComponentDefault = ({ data: _, ...props }: ChipCustomLayoutProps): ReactElement => (\n    <CustomChip {...props} />\n);\n\ntype State = {\n    hadFocusWhenClicked: boolean;\n    wasExpandedWhenClicked: boolean;\n};\n\nconst ChipsTriggerComponent = <T,>(\n    {\n        size = 'large',\n        placeholder,\n        disabled,\n        expanded: externalExpanded,\n        toggleExpanded: toggleExternalExpanded,\n        state,\n        chipLayoutComponent,\n        invalid,\n        maxHeight,\n        description,\n        errorMessage,\n        wrapperRef,\n        rightIcon = true,\n        onChange,\n        onFocus,\n        onBlur,\n        onKeyDown,\n        onChangeInput: onChangeInputExternal,\n        allowArbitraryValues = true,\n        'data-qa': dataQa = 'chips-trigger',\n        deleteButtonAriaLabel: _deleteButtonAriaLabel,\n        'aria-expanded': ariaExpanded,\n        'aria-controls': ariaControls,\n    }: ChipsTriggerProps<T> & Omit<InputHTMLAttributes<HTMLInputElement>, keyof ChipsTriggerProps<T>>,\n    ref: ForwardedRef<HTMLInputElement>\n) => {\n    const { isMobile } = useBreakpoint();\n    const [expanded, setExpanded] = useState(false);\n    const [isFocusVisible, setFocusVisible] = useState(false);\n    const stateRef = useRef<State>({ hadFocusWhenClicked: false, wasExpandedWhenClicked: false });\n\n    const { hasVerticalScroll, verticalScrollbarProps, ...scrollbar } = useScrollbar({\n        axis: disabled ? 'none' : 'vertical',\n    });\n\n    const chipsRootRef = useRef<HTMLDivElement>(null);\n    const chipsRootRefCallback = useMultipleRefs(wrapperRef, chipsRootRef);\n    const chipsContainerRef = useRef<HTMLDivElement>(null);\n    const chipsContainerRefCallback = useMultipleRefs(chipsContainerRef, scrollbar.contentWrapperRef);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const inputRefCallback = useMultipleRefs(inputRef, ref);\n    const showLabel = state.value === '' && state.chips.length === 0 && placeholder !== '';\n    const labelId = useId();\n    const ariaLabeledBy = `chips-trigger-label-${labelId}`;\n    const deleteButtonAriaTrl = useTranslation('ChipsTrigger', 'delete');\n\n    const onChangeInput = useCallback(\n        (value: string) => {\n            onChange({\n                value,\n                chips: state.chips,\n                event: { type: 'change', modifier: 'keyboard' },\n            });\n            onChangeInputExternal?.(value);\n        },\n        [state.chips, onChange, onChangeInputExternal]\n    );\n    const { changeHandler, focusHandler, blurHandler, isFocused } = useFocus(onChangeInput, onFocus, onBlur);\n\n    useEffect(() => {\n        if (inputRef.current) {\n            setFocusVisible(isFocused && inputRef.current.classList.contains('focus-visible'));\n        }\n    }, [isFocused]);\n\n    const deleteHandler = useCallback(\n        (index: number) => {\n            const chips = [...state.chips];\n            const [deletedChip] = chips.splice(index, 1);\n            onChange({\n                value: state.value,\n                chips,\n                event: { type: 'remove', modifier: 'cross', element: deletedChip },\n            });\n        },\n        [onChange, state.chips, state.value]\n    );\n\n    const keyDownHandler = useCallback<KeyboardEventHandler>(\n        (event) => {\n            // создаем новый чипс и затираем текстовый инпут\n            if (allowArbitraryValues && keyboardMatch(event.nativeEvent, keyboardKeys.Enter)) {\n                if (state.value.length === 0) {\n                    return;\n                }\n                onChange({\n                    value: '',\n                    chips: [...state.chips, { value: state.value, userInput: true }],\n                    event: { type: 'add', modifier: 'enter' },\n                });\n                onChangeInputExternal?.('');\n            }\n            // удаляем последний созданный чипс\n            if (state.value === '' && keyboardMatch(event.nativeEvent, keyboardKeys.Backspace)) {\n                if (state.chips.length === 0) {\n                    return;\n                }\n                const chips = [...state.chips];\n                const deletedChip = chips.pop();\n                onChange({\n                    value: state.value,\n                    chips,\n                    event: { type: 'remove', modifier: 'backspace', element: deletedChip },\n                });\n            }\n            // пытаемся найти ближайший чипс для фокуса\n            if (state.value === '' && keyboardMatch(event.nativeEvent, keyboardKeys.ArrowLeft)) {\n                focusOnLastChip(event, chipsContainerRef.current, inputRef.current);\n            }\n        },\n        [allowArbitraryValues, onChange, onChangeInputExternal, state]\n    );\n\n    // при выставлении высоты учитваем падинги\n    // иначе высота будет больше значения свойства\n    const scrollableAreaStyle = maxHeight ? { maxHeight: `${maxHeight - (size === 'medium' ? 16 : 24)}px` } : undefined;\n    const ChipLayoutComponent = chipLayoutComponent ?? ChipLayoutComponentDefault;\n\n    const showIcon = rightIcon !== false;\n    const showCustomIcon = isValidElement(rightIcon);\n\n    return (\n        <div>\n            <div\n                ref={chipsRootRefCallback}\n                className={classnames(styles.root, styles[size], scrollbar.hoverContainerCssClass, {\n                    [styles.focused]: isFocused,\n                    [styles.focusVisible]: isFocusVisible,\n                    [styles.disabled]: !!disabled,\n                    [styles.invalid]: !!invalid,\n                })}\n                onFocus={() => {\n                    if (disabled) {\n                        return;\n                    }\n                    if (!inputRef.current) {\n                        return;\n                    }\n                    setExpanded(true);\n                    // добавляем .focus() еще и тут\n                    // чтобы не сбрасывать фокус во время клика по chip\n                    // или по клику на враппер\n                    if (document.activeElement === chipsRootRef.current) {\n                        inputRef.current.focus();\n                    }\n                }}\n                onBlur={(event) => {\n                    stateRef.current.hadFocusWhenClicked &&=\n                        event.relatedTarget === chipsRootRef.current || event.relatedTarget === inputRef.current;\n                    setExpanded(false);\n                }}\n                onKeyDown={onKeyDown}\n                onMouseDown={() => {\n                    // при повторном клике по инпуту в фокусе нужно закрыть дроп\n                    // при этом клик может прийтись на обертку, из-за чего инпут поймает blur и повторный фокус\n                    // что усложняет проверку того, что инпут уже был в фокусе в момент клика\n                    // поэтому в цепочке mouseDown -> blur -> focus -> click храним флаг, что фокус не вышел за пределы компонента\n                    stateRef.current.hadFocusWhenClicked = document.activeElement === inputRef.current;\n                    stateRef.current.wasExpandedWhenClicked = !!externalExpanded;\n                }}\n                onClick={() => {\n                    if (\n                        stateRef.current.hadFocusWhenClicked &&\n                        stateRef.current.wasExpandedWhenClicked === externalExpanded\n                    ) {\n                        toggleExternalExpanded?.();\n                    }\n                    stateRef.current.hadFocusWhenClicked = false;\n                    stateRef.current.wasExpandedWhenClicked = false;\n                }}\n                tabIndex={disabled ? undefined : 0}\n                data-qa={dataQa}\n                aria-disabled={disabled}\n            >\n                <div\n                    style={scrollableAreaStyle}\n                    className={classnames(styles.scrollableAreaWrapper, {\n                        [styles.scrollableAreaWrapperWithIcon]: showIcon,\n                    })}\n                >\n                    <div\n                        className={styles.scrollableArea}\n                        ref={scrollbar.scrollContainerRef as React.Ref<HTMLDivElement>}\n                    >\n                        <div ref={chipsContainerRefCallback} className={styles.chipsAndInput}>\n                            {state.chips.map((chip, index) => {\n                                return (\n                                    <div\n                                        key={`${chip.value}-${index}`}\n                                        className={styles.customChipWrapper}\n                                        onMouseDown={(event) => event.preventDefault()}\n                                    >\n                                        <ChipLayoutComponent\n                                            Element=\"button\"\n                                            size=\"extra-small\"\n                                            onDelete={() => {\n                                                deleteHandler(index);\n                                            }}\n                                            dataQaWrapper={`chips-trigger-chip-${chip.value}`}\n                                            deleteButtonAriaLabel={_deleteButtonAriaLabel ?? deleteButtonAriaTrl}\n                                            disabled={disabled}\n                                            data={chip.data}\n                                            deleteOnly\n                                        >\n                                            {chip.label ?? chip.value}\n                                        </ChipLayoutComponent>\n                                    </div>\n                                );\n                            })}\n                            <div className={styles.field}>\n                                <input\n                                    ref={inputRefCallback}\n                                    className={styles.fieldInput}\n                                    type=\"text\"\n                                    disabled={disabled}\n                                    value={state.value}\n                                    onKeyDown={keyDownHandler}\n                                    onFocus={focusHandler}\n                                    onBlur={blurHandler}\n                                    onChange={changeHandler}\n                                    data-qa=\"chips-trigger-input\"\n                                    readOnly={isMobile}\n                                    aria-labelledby={showLabel ? ariaLabeledBy : undefined}\n                                    role={'combobox'}\n                                    aria-haspopup={'listbox'}\n                                    aria-autocomplete={'list'}\n                                    aria-expanded={ariaExpanded}\n                                    aria-controls={ariaControls}\n                                />\n                                {showLabel && (\n                                    <div className={styles.labelWrapper}>\n                                        <label className={styles.label} id={ariaLabeledBy}>\n                                            {placeholder}\n                                        </label>\n                                    </div>\n                                )}\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                {showIcon && (\n                    <div\n                        className={classnames(styles.icon, {\n                            [styles.iconExpanded]: (expanded || externalExpanded) && !showCustomIcon,\n                        })}\n                        data-qa=\"chips-trigger-icon\"\n                    >\n                        {showCustomIcon ? rightIcon : <ChevronDownOutlinedSize24 />}\n                    </div>\n                )}\n                {hasVerticalScroll && <Scrollbar {...verticalScrollbarProps} />}\n            </div>\n            <FormHelper description={description} errorMessage={errorMessage} disabled={disabled} invalid={invalid} />\n        </div>\n    );\n};\n\nconst ChipsTrigger = forwardRef(ChipsTriggerComponent) as (<T>(\n    props: ChipsTriggerProps<T> &\n        Omit<InputHTMLAttributes<HTMLInputElement>, keyof ChipsTriggerProps<T>> & {\n            ref?: LegacyRef<HTMLInputElement>;\n        }\n) => ReactElement | null) & { displayName: string };\n\nChipsTrigger.displayName = 'ChipsTrigger';\n\nexport { ChipsTrigger };\n"],"names":[],"mappings":"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"}

package/UncontrolledChipsTrigger.d.ts

@@ -1,5 +1,5 @@
 import { LegacyRef, ReactElement, InputHTMLAttributes } from 'react';
-import { UncontrolledChipsTriggerProps } from '@hh.ru/magritte-ui-chips-trigger/types';
+import { UncontrolledChipsTriggerProps } from './types';
 declare const UncontrolledChipsTrigger: (<T>(props: UncontrolledChipsTriggerProps<T> & Omit<InputHTMLAttributes<HTMLInputElement>, keyof UncontrolledChipsTriggerProps<T>> & {
     ref?: LegacyRef<HTMLInputElement>;
 }) => ReactElement | null) & {

package/UncontrolledChipsTrigger.js

@@ -14,18 +14,34 @@ import '@hh.ru/magritte-ui-input/useFocus';
 import '@hh.ru/magritte-ui-scrollbar';
 
 const DEFAULT_STATE = {
-    value: '',
-    chips: [],
+  value: "",
+  chips: []
 };
-const UncontrolledChipsTriggerComponent = ({ state: defaultState = DEFAULT_STATE, onChange, name, ...restProps }, ref) => {
-    const [state, setState] = useState({ ...defaultState });
-    return (jsxs(Fragment, { children: [jsx(ChipsTrigger, { ...restProps, state: state, onChange: (newState) => {
-                    setState(newState);
-                    onChange?.(newState);
-                }, ref: ref }), state.chips.map((chip) => (jsx("input", { type: "hidden", name: name, value: chip.value }, chip.value)))] }));
+const UncontrolledChipsTriggerComponent = ({
+  state: defaultState = DEFAULT_STATE,
+  onChange,
+  name,
+  ...restProps
+}, ref) => {
+  const [state, setState] = useState({ ...defaultState });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      ChipsTrigger,
+      {
+        ...restProps,
+        state,
+        onChange: (newState) => {
+          setState(newState);
+          onChange?.(newState);
+        },
+        ref
+      }
+    ),
+    state.chips.map((chip) => /* @__PURE__ */ jsx("input", { type: "hidden", name, value: chip.value }, chip.value))
+  ] });
 };
 const UncontrolledChipsTrigger = forwardRef(UncontrolledChipsTriggerComponent);
-UncontrolledChipsTrigger.displayName = 'UncontrolledChipsTrigger';
+UncontrolledChipsTrigger.displayName = "UncontrolledChipsTrigger";
 
 export { UncontrolledChipsTrigger };
 //# sourceMappingURL=UncontrolledChipsTrigger.js.map

package/UncontrolledChipsTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"UncontrolledChipsTrigger.js","sources":["src/UncontrolledChipsTrigger.tsx"],"sourcesContent":["import { ForwardedRef, LegacyRef, ReactElement, forwardRef, InputHTMLAttributes, useState } from 'react';\n\nimport { ChipsTrigger } from '@hh.ru/magritte-ui-chips-trigger/ChipsTrigger';\nimport { UncontrolledChipsTriggerProps, ChipsTriggerState } from '@hh.ru/magritte-ui-chips-trigger/types';\n\nconst DEFAULT_STATE = {\n    value: '',\n    chips: [],\n};\n\nconst UncontrolledChipsTriggerComponent = <T,>(\n    {\n        state: defaultState = DEFAULT_STATE,\n        onChange,\n        name,\n        ...restProps\n    }: UncontrolledChipsTriggerProps<T> &\n        Omit<InputHTMLAttributes<HTMLInputElement>, keyof UncontrolledChipsTriggerProps<T>>,\n    ref: ForwardedRef<HTMLInputElement>\n) => {\n    const [state, setState] = useState<ChipsTriggerState<T>>({ ...defaultState });\n    return (\n        <>\n            <ChipsTrigger\n                {...restProps}\n                state={state}\n                onChange={(newState) => {\n                    setState(newState);\n                    onChange?.(newState);\n                }}\n                ref={ref}\n            />\n            {state.chips.map((chip) => (\n                <input type=\"hidden\" name={name} value={chip.value} key={chip.value} />\n            ))}\n        </>\n    );\n};\n\nconst UncontrolledChipsTrigger = forwardRef(UncontrolledChipsTriggerComponent) as (<T>(\n    props: UncontrolledChipsTriggerProps<T> &\n        Omit<InputHTMLAttributes<HTMLInputElement>, keyof UncontrolledChipsTriggerProps<T>> & {\n            ref?: LegacyRef<HTMLInputElement>;\n        }\n) => ReactElement | null) & { displayName: string };\n\nUncontrolledChipsTrigger.displayName = 'UncontrolledChipsTrigger';\n\nexport { UncontrolledChipsTrigger };\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":";;;;;;;;;;;;;;AAKA,MAAM,aAAa,GAAG;AAClB,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;CACZ,CAAC;AAEF,MAAM,iCAAiC,GAAG,CACtC,EACI,KAAK,EAAE,YAAY,GAAG,aAAa,EACnC,QAAQ,EACR,IAAI,EACJ,GAAG,SAAS,EAEuE,EACvF,GAAmC,KACnC;AACA,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAuB,EAAE,GAAG,YAAY,EAAE,CAAC,CAAC;AAC9E,IAAA,QACIA,IACI,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CAAAC,GAAA,CAAC,YAAY,EAAA,EAAA,GACL,SAAS,EACb,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,QAAQ,KAAI;oBACnB,QAAQ,CAAC,QAAQ,CAAC,CAAC;AACnB,oBAAA,QAAQ,GAAG,QAAQ,CAAC,CAAC;AACzB,iBAAC,EACD,GAAG,EAAE,GAAG,EACV,CAAA,EACD,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,MAClBA,GAAO,CAAA,OAAA,EAAA,EAAA,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAO,EAAA,IAAI,CAAC,KAAK,CAAI,CAC1E,CAAC,CAAA,EAAA,CACH,EACL;AACN,CAAC,CAAC;AAEF,MAAM,wBAAwB,GAAG,UAAU,CAAC,iCAAiC,EAKzB;AAEpD,wBAAwB,CAAC,WAAW,GAAG,0BAA0B;;;;"}
+{"version":3,"file":"UncontrolledChipsTrigger.js","sources":["src/UncontrolledChipsTrigger.tsx"],"sourcesContent":["import { ForwardedRef, LegacyRef, ReactElement, forwardRef, InputHTMLAttributes, useState } from 'react';\n\nimport { ChipsTrigger } from '@hh.ru/magritte-ui-chips-trigger/ChipsTrigger';\nimport { UncontrolledChipsTriggerProps, ChipsTriggerState } from '@hh.ru/magritte-ui-chips-trigger/types';\n\nconst DEFAULT_STATE = {\n    value: '',\n    chips: [],\n};\n\nconst UncontrolledChipsTriggerComponent = <T,>(\n    {\n        state: defaultState = DEFAULT_STATE,\n        onChange,\n        name,\n        ...restProps\n    }: UncontrolledChipsTriggerProps<T> &\n        Omit<InputHTMLAttributes<HTMLInputElement>, keyof UncontrolledChipsTriggerProps<T>>,\n    ref: ForwardedRef<HTMLInputElement>\n) => {\n    const [state, setState] = useState<ChipsTriggerState<T>>({ ...defaultState });\n    return (\n        <>\n            <ChipsTrigger\n                {...restProps}\n                state={state}\n                onChange={(newState) => {\n                    setState(newState);\n                    onChange?.(newState);\n                }}\n                ref={ref}\n            />\n            {state.chips.map((chip) => (\n                <input type=\"hidden\" name={name} value={chip.value} key={chip.value} />\n            ))}\n        </>\n    );\n};\n\nconst UncontrolledChipsTrigger = forwardRef(UncontrolledChipsTriggerComponent) as (<T>(\n    props: UncontrolledChipsTriggerProps<T> &\n        Omit<InputHTMLAttributes<HTMLInputElement>, keyof UncontrolledChipsTriggerProps<T>> & {\n            ref?: LegacyRef<HTMLInputElement>;\n        }\n) => ReactElement | null) & { displayName: string };\n\nUncontrolledChipsTrigger.displayName = 'UncontrolledChipsTrigger';\n\nexport { UncontrolledChipsTrigger };\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAKA,MAAM,aAAgB,GAAA;AAAA,EAClB,KAAO,EAAA,EAAA;AAAA,EACP,OAAO,EAAC;AACZ,CAAA,CAAA;AAEA,MAAM,oCAAoC,CACtC;AAAA,EACI,OAAO,YAAe,GAAA,aAAA;AAAA,EACtB,QAAA;AAAA,EACA,IAAA;AAAA,EACA,GAAG,SAAA;AACP,CAAA,EAEA,GACC,KAAA;AACD,EAAM,MAAA,CAAC,OAAO,QAAQ,CAAA,GAAI,SAA+B,EAAE,GAAG,cAAc,CAAA,CAAA;AAC5E,EAAA,uBAEQ,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACI,GAAG,SAAA;AAAA,QACJ,KAAA;AAAA,QACA,QAAA,EAAU,CAAC,QAAa,KAAA;AACpB,UAAA,QAAA,CAAS,QAAQ,CAAA,CAAA;AACjB,UAAA,QAAA,GAAW,QAAQ,CAAA,CAAA;AAAA,SACvB;AAAA,QACA,GAAA;AAAA,OAAA;AAAA,KACJ;AAAA,IACC,KAAM,CAAA,KAAA,CAAM,GAAI,CAAA,CAAC,yBACb,GAAA,CAAA,OAAA,EAAA,EAAM,IAAK,EAAA,QAAA,EAAS,MAAY,KAAO,EAAA,IAAA,CAAK,KAAY,EAAA,EAAA,IAAA,CAAK,KAAO,CACxE,CAAA;AAAA,GACL,EAAA,CAAA,CAAA;AAER,CAAA,CAAA;AAEM,MAAA,wBAAA,GAA2B,WAAW,iCAAiC,EAAA;AAO7E,wBAAA,CAAyB,WAAc,GAAA,0BAAA;;;;"}

package/index.css

@@ -1,74 +1,74 @@
 :root{
-  --magritte-color-component-input-stroke-state-field-hovered-v26-0-0:#CCD5DF;
-  --magritte-color-component-input-stroke-state-field-focused-v26-0-0:#0070ff;
-  --magritte-color-component-input-stroke-state-accent-focused-accessible-v26-0-0:#0070ff7a;
-  --magritte-color-component-input-stroke-state-field-invalid-v26-0-0:#ff4d3a;
-  --magritte-color-component-input-stroke-state-negative-focused-accessible-v26-0-0:#ff4d3a7a;
-  --magritte-color-component-input-stroke-state-field-disabled-v26-0-0:#EEF1F7;
-  --magritte-color-component-input-background-field-v26-0-0:#ffffff;
-  --magritte-color-component-input-background-state-field-hovered-v26-0-0:#ffffff;
-  --magritte-color-component-input-background-state-field-focused-v26-0-0:#ffffff;
-  --magritte-color-component-input-background-state-field-invalid-v26-0-0:#ffffff;
-  --magritte-color-component-input-background-state-field-disabled-v26-0-0:#F4F6FB;
-  --magritte-color-component-input-stroke-field-v26-0-0:#DCE3EB;
-  --magritte-color-component-input-text-state-content-disabled-v26-0-0:#AABBCA;
-  --magritte-color-component-input-text-state-placeholder-disabled-v26-0-0:#AABBCA;
-  --magritte-color-component-input-text-state-content-hovered-v26-0-0:#000000;
-  --magritte-color-component-input-text-state-content-focused-v26-0-0:#000000;
-  --magritte-color-component-input-text-state-content-invalid-v26-0-0:#000000;
-  --magritte-color-component-input-text-state-placeholder-hovered-v26-0-0:#768694;
-  --magritte-color-component-input-text-state-placeholder-focused-v26-0-0:#AABBCA;
-  --magritte-color-component-input-text-state-placeholder-invalid-v26-0-0:#AABBCA;
-  --magritte-color-component-input-icon-chevron-v26-0-0:#AABBCA;
-  --magritte-color-component-input-icon-state-chevron-focused-v26-0-0:#000000;
-  --magritte-color-component-input-icon-state-chevron-hovered-v26-0-0:#6a7885;
-  --magritte-color-component-input-icon-state-chevron-disabled-v26-0-0:#AABBCA;
-  --magritte-color-component-input-icon-state-chevron-invalid-v26-0-0:#AABBCA;
-  --magritte-color-component-input-text-content-v26-0-0:#000000;
-  --magritte-color-component-input-text-placeholder-v26-0-0:#AABBCA;
-  --magritte-color-component-input-chips-background-state-neutral-disable-v26-0-0:#DCE3EB;
-  --magritte-color-component-input-chips-text-state-neutral-disable-v26-0-0:#96aabb;
+  --magritte-color-component-input-stroke-state-field-hovered-v26-0-2:#CCD5DF;
+  --magritte-color-component-input-stroke-state-field-focused-v26-0-2:#0070ff;
+  --magritte-color-component-input-stroke-state-accent-focused-accessible-v26-0-2:#0070ff7a;
+  --magritte-color-component-input-stroke-state-field-invalid-v26-0-2:#ff4d3a;
+  --magritte-color-component-input-stroke-state-negative-focused-accessible-v26-0-2:#ff4d3a7a;
+  --magritte-color-component-input-stroke-state-field-disabled-v26-0-2:#EEF1F7;
+  --magritte-color-component-input-background-field-v26-0-2:#ffffff;
+  --magritte-color-component-input-background-state-field-hovered-v26-0-2:#ffffff;
+  --magritte-color-component-input-background-state-field-focused-v26-0-2:#ffffff;
+  --magritte-color-component-input-background-state-field-invalid-v26-0-2:#ffffff;
+  --magritte-color-component-input-background-state-field-disabled-v26-0-2:#F4F6FB;
+  --magritte-color-component-input-stroke-field-v26-0-2:#DCE3EB;
+  --magritte-color-component-input-text-state-content-disabled-v26-0-2:#AABBCA;
+  --magritte-color-component-input-text-state-placeholder-disabled-v26-0-2:#AABBCA;
+  --magritte-color-component-input-text-state-content-hovered-v26-0-2:#000000;
+  --magritte-color-component-input-text-state-content-focused-v26-0-2:#000000;
+  --magritte-color-component-input-text-state-content-invalid-v26-0-2:#000000;
+  --magritte-color-component-input-text-state-placeholder-hovered-v26-0-2:#768694;
+  --magritte-color-component-input-text-state-placeholder-focused-v26-0-2:#AABBCA;
+  --magritte-color-component-input-text-state-placeholder-invalid-v26-0-2:#AABBCA;
+  --magritte-color-component-input-icon-chevron-v26-0-2:#AABBCA;
+  --magritte-color-component-input-icon-state-chevron-focused-v26-0-2:#000000;
+  --magritte-color-component-input-icon-state-chevron-hovered-v26-0-2:#6a7885;
+  --magritte-color-component-input-icon-state-chevron-disabled-v26-0-2:#AABBCA;
+  --magritte-color-component-input-icon-state-chevron-invalid-v26-0-2:#AABBCA;
+  --magritte-color-component-input-text-content-v26-0-2:#000000;
+  --magritte-color-component-input-text-placeholder-v26-0-2:#AABBCA;
+  --magritte-color-component-input-chips-background-state-neutral-disable-v26-0-2:#DCE3EB;
+  --magritte-color-component-input-chips-text-state-neutral-disable-v26-0-2:#96aabb;
 }
 
 :root{
-  --magritte-semantic-animation-ease-in-out-100-timing-function-v26-0-0:cubic-bezier(0.25, 0.1, 0.25, 1);
-  --magritte-semantic-animation-ease-in-out-100-duration-v26-0-0:100ms;
+  --magritte-semantic-animation-ease-in-out-100-timing-function-v26-0-2:cubic-bezier(0.25, 0.1, 0.25, 1);
+  --magritte-semantic-animation-ease-in-out-100-duration-v26-0-2:100ms;
 }
 
 .magritte-night-theme{
-  --magritte-color-component-input-stroke-state-field-hovered-v26-0-0:#3B3B3B;
-  --magritte-color-component-input-stroke-state-field-disabled-v26-0-0:#1B1B1B;
-  --magritte-color-component-input-background-field-v26-0-0:#111;
-  --magritte-color-component-input-background-state-field-hovered-v26-0-0:#111;
-  --magritte-color-component-input-background-state-field-focused-v26-0-0:#111;
-  --magritte-color-component-input-background-state-field-invalid-v26-0-0:#111;
-  --magritte-color-component-input-background-state-field-disabled-v26-0-0:#111;
-  --magritte-color-component-input-stroke-field-v26-0-0:#303030;
-  --magritte-color-component-input-text-content-v26-0-0:#ffffff;
-  --magritte-color-component-input-text-placeholder-v26-0-0:#535353;
-  --magritte-color-component-input-text-state-content-disabled-v26-0-0:#474747;
-  --magritte-color-component-input-text-state-placeholder-disabled-v26-0-0:#474747;
-  --magritte-color-component-input-text-state-content-hovered-v26-0-0:#ffffff;
-  --magritte-color-component-input-text-state-content-focused-v26-0-0:#ffffff;
-  --magritte-color-component-input-text-state-content-invalid-v26-0-0:#ffffff;
-  --magritte-color-component-input-text-state-placeholder-hovered-v26-0-0:#5E5E5E;
-  --magritte-color-component-input-text-state-placeholder-focused-v26-0-0:#535353;
-  --magritte-color-component-input-text-state-placeholder-invalid-v26-0-0:#535353;
-  --magritte-color-component-input-icon-state-chevron-disabled-v26-0-0:#474747;
-  --magritte-color-component-input-icon-state-chevron-hovered-v26-0-0:#848484;
-  --magritte-color-component-input-icon-state-chevron-focused-v26-0-0:#ffffff;
-  --magritte-color-component-input-icon-state-chevron-invalid-v26-0-0:#474747;
-  --magritte-color-component-input-icon-chevron-v26-0-0:#5E5E5E;
-  --magritte-color-component-input-chips-background-state-neutral-disable-v26-0-0:#1B1B1B;
-  --magritte-color-component-input-chips-text-state-neutral-disable-v26-0-0:#474747;
+  --magritte-color-component-input-stroke-state-field-hovered-v26-0-2:#3B3B3B;
+  --magritte-color-component-input-stroke-state-field-disabled-v26-0-2:#1B1B1B;
+  --magritte-color-component-input-background-field-v26-0-2:#111;
+  --magritte-color-component-input-background-state-field-hovered-v26-0-2:#111;
+  --magritte-color-component-input-background-state-field-focused-v26-0-2:#111;
+  --magritte-color-component-input-background-state-field-invalid-v26-0-2:#111;
+  --magritte-color-component-input-background-state-field-disabled-v26-0-2:#111;
+  --magritte-color-component-input-stroke-field-v26-0-2:#303030;
+  --magritte-color-component-input-text-content-v26-0-2:#ffffff;
+  --magritte-color-component-input-text-placeholder-v26-0-2:#535353;
+  --magritte-color-component-input-text-state-content-disabled-v26-0-2:#474747;
+  --magritte-color-component-input-text-state-placeholder-disabled-v26-0-2:#474747;
+  --magritte-color-component-input-text-state-content-hovered-v26-0-2:#ffffff;
+  --magritte-color-component-input-text-state-content-focused-v26-0-2:#ffffff;
+  --magritte-color-component-input-text-state-content-invalid-v26-0-2:#ffffff;
+  --magritte-color-component-input-text-state-placeholder-hovered-v26-0-2:#5E5E5E;
+  --magritte-color-component-input-text-state-placeholder-focused-v26-0-2:#535353;
+  --magritte-color-component-input-text-state-placeholder-invalid-v26-0-2:#535353;
+  --magritte-color-component-input-icon-state-chevron-disabled-v26-0-2:#474747;
+  --magritte-color-component-input-icon-state-chevron-hovered-v26-0-2:#848484;
+  --magritte-color-component-input-icon-state-chevron-focused-v26-0-2:#ffffff;
+  --magritte-color-component-input-icon-state-chevron-invalid-v26-0-2:#474747;
+  --magritte-color-component-input-icon-chevron-v26-0-2:#5E5E5E;
+  --magritte-color-component-input-chips-background-state-neutral-disable-v26-0-2:#1B1B1B;
+  --magritte-color-component-input-chips-text-state-neutral-disable-v26-0-2:#474747;
 }
 
 .magritte-zp-day-theme{
-  --magritte-color-component-input-stroke-state-field-focused-v26-0-0:#7195AF;
-  --magritte-color-component-input-icon-state-chevron-hovered-v26-0-0:#8293a2;
-  --magritte-color-component-input-icon-state-chevron-disabled-v26-0-0:#96aabb;
+  --magritte-color-component-input-stroke-state-field-focused-v26-0-2:#7195AF;
+  --magritte-color-component-input-icon-state-chevron-hovered-v26-0-2:#8293a2;
+  --magritte-color-component-input-icon-state-chevron-disabled-v26-0-2:#96aabb;
 }
-.magritte-root___-zVdz_4-5-2{
+.magritte-root___-zVdz_4-5-4{
   display:inline-flex;
   position:relative;
   width:100%;
@@ -77,146 +77,146 @@
   white-space:nowrap;
   appearance:none;
   overflow-y:auto;
-  background-color:var(--magritte-color-component-input-background-field-v26-0-0);
-  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-field-v26-0-0);
+  background-color:var(--magritte-color-component-input-background-field-v26-0-2);
+  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-field-v26-0-2);
   border-radius:12px;
-  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-chevron-v26-0-0);
+  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-chevron-v26-0-2);
   --magritte-ui-scrollbar-border-radius:12px;
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-root___-zVdz_4-5-2:not(.magritte-focused___0Uzyu_4-5-2):not(.magritte-invalid___tVzQV_4-5-2):not(.magritte-disabled___UeqcV_4-5-2):hover{
-    background-color:var(--magritte-color-component-input-background-state-field-hovered-v26-0-0);
-    box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-hovered-v26-0-0);
-    --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-hovered-v26-0-0);
+  body.magritte-old-layout .magritte-root___-zVdz_4-5-4:not(.magritte-focused___0Uzyu_4-5-4):not(.magritte-invalid___tVzQV_4-5-4):not(.magritte-disabled___UeqcV_4-5-4):hover{
+    background-color:var(--magritte-color-component-input-background-state-field-hovered-v26-0-2);
+    box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-hovered-v26-0-2);
+    --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-hovered-v26-0-2);
   }
-  body.magritte-old-layout .magritte-root___-zVdz_4-5-2:not(.magritte-focused___0Uzyu_4-5-2):not(.magritte-invalid___tVzQV_4-5-2):not(.magritte-disabled___UeqcV_4-5-2):hover .magritte-label___j7Trt_4-5-2{
-    color:var(--magritte-color-component-input-text-state-placeholder-hovered-v26-0-0);
+  body.magritte-old-layout .magritte-root___-zVdz_4-5-4:not(.magritte-focused___0Uzyu_4-5-4):not(.magritte-invalid___tVzQV_4-5-4):not(.magritte-disabled___UeqcV_4-5-4):hover .magritte-label___j7Trt_4-5-4{
+    color:var(--magritte-color-component-input-text-state-placeholder-hovered-v26-0-2);
   }
-  body.magritte-old-layout .magritte-root___-zVdz_4-5-2:not(.magritte-focused___0Uzyu_4-5-2):not(.magritte-invalid___tVzQV_4-5-2):not(.magritte-disabled___UeqcV_4-5-2):hover .magritte-field-input___04Cag_4-5-2{
-    color:var(--magritte-color-component-input-text-state-content-hovered-v26-0-0);
+  body.magritte-old-layout .magritte-root___-zVdz_4-5-4:not(.magritte-focused___0Uzyu_4-5-4):not(.magritte-invalid___tVzQV_4-5-4):not(.magritte-disabled___UeqcV_4-5-4):hover .magritte-field-input___04Cag_4-5-4{
+    color:var(--magritte-color-component-input-text-state-content-hovered-v26-0-2);
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-root___-zVdz_4-5-2:not(.magritte-focused___0Uzyu_4-5-2):not(.magritte-invalid___tVzQV_4-5-2):not(.magritte-disabled___UeqcV_4-5-2):hover{
-    background-color:var(--magritte-color-component-input-background-state-field-hovered-v26-0-0);
-    box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-hovered-v26-0-0);
-    --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-hovered-v26-0-0);
+  body:not(.magritte-old-layout) .magritte-root___-zVdz_4-5-4:not(.magritte-focused___0Uzyu_4-5-4):not(.magritte-invalid___tVzQV_4-5-4):not(.magritte-disabled___UeqcV_4-5-4):hover{
+    background-color:var(--magritte-color-component-input-background-state-field-hovered-v26-0-2);
+    box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-hovered-v26-0-2);
+    --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-hovered-v26-0-2);
   }
-  body:not(.magritte-old-layout) .magritte-root___-zVdz_4-5-2:not(.magritte-focused___0Uzyu_4-5-2):not(.magritte-invalid___tVzQV_4-5-2):not(.magritte-disabled___UeqcV_4-5-2):hover .magritte-label___j7Trt_4-5-2{
-    color:var(--magritte-color-component-input-text-state-placeholder-hovered-v26-0-0);
+  body:not(.magritte-old-layout) .magritte-root___-zVdz_4-5-4:not(.magritte-focused___0Uzyu_4-5-4):not(.magritte-invalid___tVzQV_4-5-4):not(.magritte-disabled___UeqcV_4-5-4):hover .magritte-label___j7Trt_4-5-4{
+    color:var(--magritte-color-component-input-text-state-placeholder-hovered-v26-0-2);
   }
-  body:not(.magritte-old-layout) .magritte-root___-zVdz_4-5-2:not(.magritte-focused___0Uzyu_4-5-2):not(.magritte-invalid___tVzQV_4-5-2):not(.magritte-disabled___UeqcV_4-5-2):hover .magritte-field-input___04Cag_4-5-2{
-    color:var(--magritte-color-component-input-text-state-content-hovered-v26-0-0);
+  body:not(.magritte-old-layout) .magritte-root___-zVdz_4-5-4:not(.magritte-focused___0Uzyu_4-5-4):not(.magritte-invalid___tVzQV_4-5-4):not(.magritte-disabled___UeqcV_4-5-4):hover .magritte-field-input___04Cag_4-5-4{
+    color:var(--magritte-color-component-input-text-state-content-hovered-v26-0-2);
   }
 }
-.magritte-root___-zVdz_4-5-2:not(.magritte-disabled___UeqcV_4-5-2){
+.magritte-root___-zVdz_4-5-4:not(.magritte-disabled___UeqcV_4-5-4){
   cursor:text;
 }
-.magritte-root___-zVdz_4-5-2.magritte-focused___0Uzyu_4-5-2{
-  background-color:var(--magritte-color-component-input-background-state-field-focused-v26-0-0);
-  box-shadow:inset 0 0 0 2px var(--magritte-color-component-input-stroke-state-field-focused-v26-0-0);
-  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-focused-v26-0-0);
+.magritte-root___-zVdz_4-5-4.magritte-focused___0Uzyu_4-5-4{
+  background-color:var(--magritte-color-component-input-background-state-field-focused-v26-0-2);
+  box-shadow:inset 0 0 0 2px var(--magritte-color-component-input-stroke-state-field-focused-v26-0-2);
+  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-focused-v26-0-2);
 }
-.magritte-root___-zVdz_4-5-2.magritte-focused___0Uzyu_4-5-2 .magritte-label___j7Trt_4-5-2{
-  color:var(--magritte-color-component-input-text-state-placeholder-focused-v26-0-0);
+.magritte-root___-zVdz_4-5-4.magritte-focused___0Uzyu_4-5-4 .magritte-label___j7Trt_4-5-4{
+  color:var(--magritte-color-component-input-text-state-placeholder-focused-v26-0-2);
 }
-.magritte-root___-zVdz_4-5-2.magritte-focused___0Uzyu_4-5-2 .magritte-field-input___04Cag_4-5-2{
-  color:var(--magritte-color-component-input-text-state-content-focused-v26-0-0);
+.magritte-root___-zVdz_4-5-4.magritte-focused___0Uzyu_4-5-4 .magritte-field-input___04Cag_4-5-4{
+  color:var(--magritte-color-component-input-text-state-content-focused-v26-0-2);
 }
-.magritte-root___-zVdz_4-5-2.magritte-invalid___tVzQV_4-5-2{
-  background-color:var(--magritte-color-component-input-background-state-field-invalid-v26-0-0);
-  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-invalid-v26-0-0);
-  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-invalid-v26-0-0);
+.magritte-root___-zVdz_4-5-4.magritte-invalid___tVzQV_4-5-4{
+  background-color:var(--magritte-color-component-input-background-state-field-invalid-v26-0-2);
+  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-invalid-v26-0-2);
+  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-invalid-v26-0-2);
 }
-.magritte-root___-zVdz_4-5-2.magritte-invalid___tVzQV_4-5-2 .magritte-label___j7Trt_4-5-2{
-  color:var(--magritte-color-component-input-text-state-placeholder-invalid-v26-0-0);
+.magritte-root___-zVdz_4-5-4.magritte-invalid___tVzQV_4-5-4 .magritte-label___j7Trt_4-5-4{
+  color:var(--magritte-color-component-input-text-state-placeholder-invalid-v26-0-2);
 }
-.magritte-root___-zVdz_4-5-2.magritte-invalid___tVzQV_4-5-2 .magritte-field-input___04Cag_4-5-2{
-  color:var(--magritte-color-component-input-text-state-content-invalid-v26-0-0);
+.magritte-root___-zVdz_4-5-4.magritte-invalid___tVzQV_4-5-4 .magritte-field-input___04Cag_4-5-4{
+  color:var(--magritte-color-component-input-text-state-content-invalid-v26-0-2);
 }
-.magritte-root___-zVdz_4-5-2.magritte-disabled___UeqcV_4-5-2{
-  background-color:var(--magritte-color-component-input-background-state-field-disabled-v26-0-0);
-  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-disabled-v26-0-0);
-  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-disabled-v26-0-0);
-  --magritte-ui-chip-text-color-override:var(--magritte-color-component-input-chips-text-state-neutral-disable-v26-0-0);
-  --magritte-ui-chip-background-color-override:var(--magritte-color-component-input-chips-background-state-neutral-disable-v26-0-0);
+.magritte-root___-zVdz_4-5-4.magritte-disabled___UeqcV_4-5-4{
+  background-color:var(--magritte-color-component-input-background-state-field-disabled-v26-0-2);
+  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-disabled-v26-0-2);
+  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-disabled-v26-0-2);
+  --magritte-ui-chip-text-color-override:var(--magritte-color-component-input-chips-text-state-neutral-disable-v26-0-2);
+  --magritte-ui-chip-background-color-override:var(--magritte-color-component-input-chips-background-state-neutral-disable-v26-0-2);
 }
-.magritte-root___-zVdz_4-5-2.magritte-disabled___UeqcV_4-5-2 .magritte-label___j7Trt_4-5-2{
-  color:var(--magritte-color-component-input-text-state-placeholder-disabled-v26-0-0);
+.magritte-root___-zVdz_4-5-4.magritte-disabled___UeqcV_4-5-4 .magritte-label___j7Trt_4-5-4{
+  color:var(--magritte-color-component-input-text-state-placeholder-disabled-v26-0-2);
 }
-.magritte-root___-zVdz_4-5-2.magritte-disabled___UeqcV_4-5-2 .magritte-field-input___04Cag_4-5-2{
-  color:var(--magritte-color-component-input-text-state-content-disabled-v26-0-0);
+.magritte-root___-zVdz_4-5-4.magritte-disabled___UeqcV_4-5-4 .magritte-field-input___04Cag_4-5-4{
+  color:var(--magritte-color-component-input-text-state-content-disabled-v26-0-2);
 }
-.magritte-root___-zVdz_4-5-2.magritte-disabled___UeqcV_4-5-2 .magritte-scrollable-area___-xMF2_4-5-2{
+.magritte-root___-zVdz_4-5-4.magritte-disabled___UeqcV_4-5-4 .magritte-scrollable-area___-xMF2_4-5-4{
   overflow:hidden;
 }
-.magritte-root___-zVdz_4-5-2.magritte-focus-visible___ifvAP_4-5-2{
-  outline:var(--magritte-color-component-input-stroke-state-accent-focused-accessible-v26-0-0) solid 4px;
+.magritte-root___-zVdz_4-5-4.magritte-focus-visible___ifvAP_4-5-4{
+  outline:var(--magritte-color-component-input-stroke-state-accent-focused-accessible-v26-0-2) solid 4px;
 }
-.magritte-root___-zVdz_4-5-2.magritte-focus-visible___ifvAP_4-5-2.magritte-invalid___tVzQV_4-5-2{
-  outline-color:var(--magritte-color-component-input-stroke-state-negative-focused-accessible-v26-0-0);
+.magritte-root___-zVdz_4-5-4.magritte-focus-visible___ifvAP_4-5-4.magritte-invalid___tVzQV_4-5-4{
+  outline-color:var(--magritte-color-component-input-stroke-state-negative-focused-accessible-v26-0-2);
 }
-.magritte-large___JIrIy_4-5-2{
+.magritte-large___JIrIy_4-5-4{
   padding-left:12px;
   padding-top:12px;
   padding-bottom:12px;
   padding-right:2px;
 }
-.magritte-large___JIrIy_4-5-2 .magritte-field___rlEmn_4-5-2{
+.magritte-large___JIrIy_4-5-4 .magritte-field___rlEmn_4-5-4{
   margin-left:4px;
 }
-.magritte-large___JIrIy_4-5-2 .magritte-icon___fDMiz_4-5-2{
+.magritte-large___JIrIy_4-5-4 .magritte-icon___fDMiz_4-5-4{
   top:12px;
   right:16px;
 }
-.magritte-large___JIrIy_4-5-2 .magritte-scrollable-area-wrapper___hZNQd_4-5-2{
+.magritte-large___JIrIy_4-5-4 .magritte-scrollable-area-wrapper___hZNQd_4-5-4{
   padding-right:10px;
 }
-.magritte-large___JIrIy_4-5-2 .magritte-scrollable-area-wrapper_with-icon___2VoX9_4-5-2{
+.magritte-large___JIrIy_4-5-4 .magritte-scrollable-area-wrapper_with-icon___2VoX9_4-5-4{
   padding-right:calc(24px + 10px + 12px);
 }
-.magritte-medium___Xk-XB_4-5-2{
+.magritte-medium___Xk-XB_4-5-4{
   padding-left:8px;
   padding-top:8px;
   padding-bottom:8px;
   padding-right:2px;
 }
-.magritte-medium___Xk-XB_4-5-2 .magritte-field___rlEmn_4-5-2{
+.magritte-medium___Xk-XB_4-5-4 .magritte-field___rlEmn_4-5-4{
   margin-left:8px;
 }
-.magritte-medium___Xk-XB_4-5-2 .magritte-icon___fDMiz_4-5-2{
+.magritte-medium___Xk-XB_4-5-4 .magritte-icon___fDMiz_4-5-4{
   top:8px;
   right:12px;
 }
-.magritte-medium___Xk-XB_4-5-2 .magritte-scrollable-area-wrapper___hZNQd_4-5-2{
+.magritte-medium___Xk-XB_4-5-4 .magritte-scrollable-area-wrapper___hZNQd_4-5-4{
   padding-right:6px;
 }
-.magritte-medium___Xk-XB_4-5-2 .magritte-scrollable-area-wrapper_with-icon___2VoX9_4-5-2{
+.magritte-medium___Xk-XB_4-5-4 .magritte-scrollable-area-wrapper_with-icon___2VoX9_4-5-4{
   padding-right:calc(24px + 6px + 12px);
 }
-.magritte-scrollable-area-wrapper___hZNQd_4-5-2{
+.magritte-scrollable-area-wrapper___hZNQd_4-5-4{
   width:100%;
   position:relative;
   overflow:hidden;
 }
-.magritte-scrollable-area___-xMF2_4-5-2{
+.magritte-scrollable-area___-xMF2_4-5-4{
   height:100%;
   display:flex;
   align-items:flex-start;
   overflow-y:auto;
   scrollbar-width:none;
 }
-.magritte-scrollable-area___-xMF2_4-5-2::-webkit-scrollbar{
+.magritte-scrollable-area___-xMF2_4-5-4::-webkit-scrollbar{
   display:none;
 }
-.magritte-chips-and-input___qg-Ba_4-5-2{
+.magritte-chips-and-input___qg-Ba_4-5-4{
   display:flex;
   gap:8px;
   flex-wrap:wrap;
   align-items:center;
   width:100%;
 }
-.magritte-field___rlEmn_4-5-2{
+.magritte-field___rlEmn_4-5-4{
   display:flex;
   align-items:center;
   position:relative;
@@ -232,41 +232,41 @@
   text-transform:none;
   text-decoration:none;
 }
-.magritte-field-input___04Cag_4-5-2{
+.magritte-field-input___04Cag_4-5-4{
   border:0;
   padding:0;
   background:none;
   outline:none;
   width:100%;
   z-index:1;
-  color:var(--magritte-color-component-input-text-content-v26-0-0);
+  color:var(--magritte-color-component-input-text-content-v26-0-2);
 }
-.magritte-label-wrapper___De7Bm_4-5-2{
+.magritte-label-wrapper___De7Bm_4-5-4{
   display:flex;
   align-items:center;
   position:absolute;
   height:100%;
   inset:0;
 }
-.magritte-label___j7Trt_4-5-2{
-  color:var(--magritte-color-component-input-text-placeholder-v26-0-0);
+.magritte-label___j7Trt_4-5-4{
+  color:var(--magritte-color-component-input-text-placeholder-v26-0-2);
   overflow:hidden;
   text-overflow:ellipsis;
 }
-.magritte-icon___fDMiz_4-5-2{
+.magritte-icon___fDMiz_4-5-4{
   display:inline-flex;
   margin-left:auto;
   padding:4px 0;
   position:absolute;
   transition-property:transform;
-  transition-duration:var(--magritte-semantic-animation-ease-in-out-100-duration-v26-0-0);
-  transition-timing-function:var(--magritte-semantic-animation-ease-in-out-100-timing-function-v26-0-0);
+  transition-duration:var(--magritte-semantic-animation-ease-in-out-100-duration-v26-0-2);
+  transition-timing-function:var(--magritte-semantic-animation-ease-in-out-100-timing-function-v26-0-2);
 }
-.magritte-icon_expanded___RaOT-_4-5-2{
+.magritte-icon_expanded___RaOT-_4-5-4{
   transform:rotate(-180deg);
-  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-focused-v26-0-0);
+  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-focused-v26-0-2);
 }
-.magritte-custom-chip-wrapper___a9kJ6_4-5-2{
+.magritte-custom-chip-wrapper___a9kJ6_4-5-4{
   display:inline-flex;
   min-width:0;
 }

package/index.d.ts

@@ -1,3 +1,3 @@
-export * from '@hh.ru/magritte-ui-chips-trigger/ChipsTrigger';
-export * from '@hh.ru/magritte-ui-chips-trigger/UncontrolledChipsTrigger';
-export * from '@hh.ru/magritte-ui-chips-trigger/types';
+export * from './ChipsTrigger';
+export * from './UncontrolledChipsTrigger';
+export * from './types';

package/index.mock.d.ts

@@ -1,4 +1,4 @@
 import { ForwardRefExoticComponent } from 'react';
-export type * from '@hh.ru/magritte-ui-chips-trigger/types';
+export type * from './types';
 export declare const ChipsTrigger: ForwardRefExoticComponent<Record<string, unknown>>;
 export declare const UncontrolledChipsTrigger: ForwardRefExoticComponent<Record<string, unknown>>;

package/index.mock.js

@@ -1,12 +1,20 @@
 import './index.css';
 import { mockComponent } from '@hh.ru/magritte-ui-mock-component';
 
-const ChipsTrigger = mockComponent('ChipsTrigger', undefined, {
-    withChildren: false,
-});
-const UncontrolledChipsTrigger = mockComponent('UncontrolledChipsTrigger', undefined, {
-    withChildren: false,
-});
+const ChipsTrigger = mockComponent(
+  "ChipsTrigger",
+  void 0,
+  {
+    withChildren: false
+  }
+);
+const UncontrolledChipsTrigger = mockComponent(
+  "UncontrolledChipsTrigger",
+  void 0,
+  {
+    withChildren: false
+  }
+);
 
 export { ChipsTrigger, UncontrolledChipsTrigger };
 //# sourceMappingURL=index.mock.js.map

package/index.mock.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.mock.js","sources":["src/index.mock.ts"],"sourcesContent":["import { ForwardRefExoticComponent } from 'react';\n\nimport { mockComponent } from '@hh.ru/magritte-ui-mock-component';\n\nexport type * from '@hh.ru/magritte-ui-chips-trigger/types';\n\nexport const ChipsTrigger: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n    'ChipsTrigger',\n    undefined,\n    {\n        withChildren: false,\n    }\n);\n\nexport const UncontrolledChipsTrigger: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n    'UncontrolledChipsTrigger',\n    undefined,\n    {\n        withChildren: false,\n    }\n);\n"],"names":[],"mappings":";;MAMa,YAAY,GAAuD,aAAa,CACzF,cAAc,EACd,SAAS,EACT;AACI,IAAA,YAAY,EAAE,KAAK;AACtB,CAAA,EACH;MAEW,wBAAwB,GAAuD,aAAa,CACrG,0BAA0B,EAC1B,SAAS,EACT;AACI,IAAA,YAAY,EAAE,KAAK;AACtB,CAAA;;;;"}
+{"version":3,"file":"index.mock.js","sources":["src/index.mock.ts"],"sourcesContent":["import { ForwardRefExoticComponent } from 'react';\n\nimport { mockComponent } from '@hh.ru/magritte-ui-mock-component';\n\nexport type * from '@hh.ru/magritte-ui-chips-trigger/types';\n\nexport const ChipsTrigger: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n    'ChipsTrigger',\n    undefined,\n    {\n        withChildren: false,\n    }\n);\n\nexport const UncontrolledChipsTrigger: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n    'UncontrolledChipsTrigger',\n    undefined,\n    {\n        withChildren: false,\n    }\n);\n"],"names":[],"mappings":";;AAMO,MAAM,YAAmE,GAAA,aAAA;AAAA,EAC5E,cAAA;AAAA,EACA,KAAA,CAAA;AAAA,EACA;AAAA,IACI,YAAc,EAAA,KAAA;AAAA,GAClB;AACJ,EAAA;AAEO,MAAM,wBAA+E,GAAA,aAAA;AAAA,EACxF,0BAAA;AAAA,EACA,KAAA,CAAA;AAAA,EACA;AAAA,IACI,YAAc,EAAA,KAAA;AAAA,GAClB;AACJ;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hh.ru/magritte-ui-chips-trigger",
-  "version": "4.5.2",
+  "version": "4.5.4",
   "main": "index.js",
   "types": "index.d.ts",
   "sideEffects": [
@@ -16,6 +16,7 @@
     "ts-config": "yarn root:ts-config $(pwd)",
     "ts-check": "yarn root:ts-check $(pwd)",
     "test": "yarn root:test $(pwd)",
+    "test:types": "yarn root:test:types $(pwd)",
     "watch": "yarn root:watch $(pwd)"
   },
   "peerDependencies": {
@@ -26,17 +27,17 @@
     "access": "public"
   },
   "dependencies": {
-    "@hh.ru/magritte-common-keyboard": "4.3.6",
-    "@hh.ru/magritte-common-use-multiple-refs": "1.1.12",
-    "@hh.ru/magritte-common-use-translation": "3.6.1",
-    "@hh.ru/magritte-design-tokens": "26.0.0",
-    "@hh.ru/magritte-ui-breakpoint": "6.1.2",
-    "@hh.ru/magritte-ui-chips": "7.0.46",
-    "@hh.ru/magritte-ui-form-helper": "2.1.24",
-    "@hh.ru/magritte-ui-icon": "15.1.4",
-    "@hh.ru/magritte-ui-input": "9.4.51",
-    "@hh.ru/magritte-ui-mock-component": "1.1.8",
-    "@hh.ru/magritte-ui-scrollbar": "1.0.38"
+    "@hh.ru/magritte-common-keyboard": "4.3.7",
+    "@hh.ru/magritte-common-use-multiple-refs": "1.1.13",
+    "@hh.ru/magritte-common-use-translation": "3.6.2",
+    "@hh.ru/magritte-design-tokens": "26.0.2",
+    "@hh.ru/magritte-ui-breakpoint": "6.1.3",
+    "@hh.ru/magritte-ui-chips": "7.0.48",
+    "@hh.ru/magritte-ui-form-helper": "2.1.26",
+    "@hh.ru/magritte-ui-icon": "15.1.6",
+    "@hh.ru/magritte-ui-input": "9.4.53",
+    "@hh.ru/magritte-ui-mock-component": "1.1.9",
+    "@hh.ru/magritte-ui-scrollbar": "1.0.40"
   },
-  "gitHead": "b0ff5da48fb29d516c8289082560ee1882d16986"
+  "gitHead": "33dbaa1dc9b9705e925ffc9f6fcc7a0dc153bd36"
 }