@hh.ru/magritte-ui-chips-input 5.0.11 → 6.0.1

package/ChipsInput.d.ts

@@ -1,6 +1,7 @@
 import { ForwardedRef, ReactElement } from 'react';
+import { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';
 import { ChipsInputProps } from '@hh.ru/magritte-ui-chips-input/types';
-declare const ChipsInput: (<DataType>(props: ChipsInputProps<DataType> & {
+declare const ChipsInput: (<DataType extends StaticDataFetcherItem>(props: ChipsInputProps<DataType> & {
     ref?: ForwardedRef<HTMLInputElement>;
 }) => ReactElement | null) & {
     displayName: string;

package/ChipsInput.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useRef, useState } from 'react';
+import { forwardRef, useRef, useState, useEffect } from 'react';
 import { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';
 import { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';
 import { ChipsTrigger } from '@hh.ru/magritte-ui-chips-trigger';
@@ -7,6 +7,18 @@ import { Input } from '@hh.ru/magritte-ui-input';
 import { Select } from '@hh.ru/magritte-ui-select';
 import { Suggest } from '@hh.ru/magritte-ui-suggest';
 
+function areValuesEqual(chips, selectValues) {
+    const filteredChipsSet = new Set();
+    chips.forEach((item) => {
+        if (!item.userInput) {
+            filteredChipsSet.add(item.value);
+        }
+    });
+    if (filteredChipsSet.size !== selectValues.length) {
+        return false;
+    }
+    return selectValues.every(({ value }) => filteredChipsSet.has(value));
+}
 const getUniqueChips = (selectState, chipsFromState) => {
     const chipsFromUserInput = chipsFromState.filter(({ userInput }) => !!userInput);
     // добавить значения селекта (преобразовать в чипсы их сперва)
@@ -28,6 +40,17 @@ const ChipsInputComponent = ({ type, state, onChange: onChangeExternal, triggerP
     const optionsCountRef = useRef(0);
     const onChangeSuggestRef = useRef();
     const { isMobile } = useBreakpoint();
+    useEffect(() => {
+        if (type === 'suggest') {
+            return;
+        }
+        if (areValuesEqual(state.chips, selectStateRef.current)) {
+            return;
+        }
+        const newSelectState = getInitialSelectValue(type, state.chips);
+        selectStateRef.current = newSelectState;
+        setSelectState(newSelectState);
+    }, [type, state.chips]);
     if (type === 'suggest') {
         return (jsx(Suggest, { ...suggestProps, onChange: (value, isValueFromList) => {
                 if (!isValueFromList) {
@@ -104,6 +127,7 @@ const ChipsInputComponent = ({ type, state, onChange: onChangeExternal, triggerP
                 chips: [],
             });
             setSelectState([]);
+            selectStateRef.current = [];
         }, onSearchSubmit: (event, _, optionsCount, onCloseBottomSheetWithUpdateValues) => {
             const uniqueChips = getUniqueChips(selectStateRef.current, state.chips);
             // добавляем пользовательский ввод из bs, если нужно

package/ChipsInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChipsInput.js","sources":["../src/ChipsInput.tsx"],"sourcesContent":["import { forwardRef, useRef, ForwardedRef, ReactElement, useState } from 'react';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { ChipsInputProps } from '@hh.ru/magritte-ui-chips-input/types';\nimport { ChipsTrigger } from '@hh.ru/magritte-ui-chips-trigger';\nimport { Input } from '@hh.ru/magritte-ui-input';\nimport { Select } from '@hh.ru/magritte-ui-select';\nimport { Suggest } from '@hh.ru/magritte-ui-suggest';\n\ntype ChipsList<DataType extends StaticDataFetcherItem> = ChipsInputProps<DataType>['state']['chips'];\ntype OnChangeSuggest = ((value: string) => void) | undefined;\n\nconst getUniqueChips = <DataType extends StaticDataFetcherItem>(\n    selectState: DataType[],\n    chipsFromState: ChipsList<DataType>\n): ChipsList<DataType> => {\n    const chipsFromUserInput = chipsFromState.filter(({ userInput }) => !!userInput);\n    // добавить значения селекта (преобразовать в чипсы их сперва)\n    const chipsFromSelect: ChipsList<DataType> =\n        selectState.length > 0 ? selectState.map(({ value, text }) => ({ value, label: text, userInput: false })) : [];\n    return [...chipsFromSelect, ...chipsFromUserInput];\n};\n\nconst getInitialSelectValue = <DataType extends StaticDataFetcherItem>(\n    type: ChipsInputProps<DataType>['type'],\n    chips: ChipsInputProps<DataType>['state']['chips']\n): DataType[] => {\n    if (type === 'suggest') {\n        return [];\n    }\n    return chips.map((chip) => ({ value: chip.value, text: chip.label }) as DataType);\n};\n\nconst ChipsInputComponent = <DataType extends StaticDataFetcherItem>(\n    { type, state, onChange: onChangeExternal, triggerProps, suggestProps, selectProps }: ChipsInputProps<DataType>,\n    ref: ForwardedRef<HTMLInputElement>\n) => {\n    const chipsTriggerRef = useRef<HTMLInputElement>(null);\n    const chipsTriggerRefCallback = useMultipleRefs(ref, chipsTriggerRef);\n    const { allowArbitraryValues } = triggerProps;\n    const [selectState, setSelectState] = useState(() => getInitialSelectValue<DataType>(type, state.chips));\n    const selectStateRef = useRef<DataType[]>(selectState);\n    const optionsCountRef = useRef<number>(0);\n    const onChangeSuggestRef = useRef<OnChangeSuggest>();\n    const { isMobile } = useBreakpoint();\n\n    if (type === 'suggest') {\n        return (\n            <Suggest\n                {...suggestProps}\n                onChange={(value, isValueFromList) => {\n                    if (!isValueFromList) {\n                        return;\n                    }\n                    if (!state.chips.some((chip) => chip.value === value)) {\n                        onChangeExternal({ value: '', chips: [...state.chips, { value }] });\n                        if (isMobile) {\n                            onChangeSuggestRef.current?.('');\n                        }\n                    }\n                }}\n                onBottomSheetOpen={() => chipsTriggerRef.current?.blur()}\n                input={{\n                    component: Input,\n                    props: {\n                        value: state.value,\n                        'data-qa': 'chips-input-suggest-search',\n                    },\n                }}\n                onSearchSubmit={(event, onCloseBottomSheet, optionsCount) => {\n                    if (!allowArbitraryValues || optionsCount > 0) {\n                        return;\n                    }\n                    const value = (event.target as HTMLInputElement).value;\n                    if (value) {\n                        onChangeExternal({ value: '', chips: [...state.chips, { value }] });\n                        onCloseBottomSheet();\n                        onChangeSuggestRef.current?.('');\n                    }\n                }}\n                renderTrigger={({ props, optionsCount }) => {\n                    const { onChange, wrapperRef, onFocus, onKeyDown } = props;\n                    onChangeSuggestRef.current = onChange;\n                    return (\n                        <ChipsTrigger\n                            {...triggerProps}\n                            // разрешаем добавлять результаты только если в suggest ничего не нашли\n                            allowArbitraryValues={optionsCount === 0 && allowArbitraryValues}\n                            state={state}\n                            ref={chipsTriggerRefCallback}\n                            wrapperRef={wrapperRef}\n                            onKeyDown={onKeyDown}\n                            onFocus={onFocus}\n                            data-qa={triggerProps['data-qa'] || 'chips-input-suggest-trigger'}\n                            onChange={(newState) => {\n                                onChangeExternal(newState);\n                                onChange?.(newState.value);\n                            }}\n                        />\n                    );\n                }}\n            />\n        );\n    }\n\n    const { applyChangesButton, clearButton } = selectProps;\n    const haveApplyChangesButton = Boolean(applyChangesButton);\n    const haveClearButton = Boolean(clearButton);\n    return (\n        <Select\n            {...selectProps}\n            searchable\n            multiple\n            value={selectState}\n            onSelectOption={(values) => {\n                selectStateRef.current = values;\n            }}\n            onChange={(newValues) => {\n                setSelectState(newValues);\n                if (haveApplyChangesButton || (haveClearButton && newValues.length === 0)) {\n                    // обработаем эти кейсы в onApply/onClear\n                    return;\n                }\n                const uniqueChips = getUniqueChips(newValues, state.chips);\n                onChangeExternal({\n                    value: '',\n                    chips: uniqueChips,\n                });\n            }}\n            onOptionsChange={(options) => {\n                optionsCountRef.current = options.length;\n            }}\n            onApply={({ isMobile, searchValue }) => {\n                const uniqueChips = getUniqueChips(selectStateRef.current, state.chips);\n                // добавляем пользовательский ввод, если нужно\n                // в случае bs - из navbar, в случае drop - из chis-trigger\n                const userValue = isMobile ? searchValue : state.value;\n                if (allowArbitraryValues && userValue.length > 0 && optionsCountRef.current === 0) {\n                    uniqueChips.push({ value: userValue });\n                }\n                onChangeExternal({\n                    value: '',\n                    chips: uniqueChips,\n                });\n                // актуализируем состояние селекта\n                setSelectState(selectStateRef.current);\n            }}\n            onClear={() => {\n                onChangeExternal({\n                    value: '',\n                    chips: [],\n                });\n                setSelectState([]);\n            }}\n            onSearchSubmit={(event, _, optionsCount, onCloseBottomSheetWithUpdateValues) => {\n                const uniqueChips = getUniqueChips(selectStateRef.current, state.chips);\n                // добавляем пользовательский ввод из bs, если нужно\n                const userValue = (event.target as HTMLInputElement).value;\n                if (allowArbitraryValues && userValue.length > 0 && optionsCount === 0) {\n                    uniqueChips.push({ value: userValue, userInput: true });\n                }\n                onChangeExternal({\n                    value: '',\n                    chips: uniqueChips,\n                });\n                setSelectState(selectStateRef.current);\n                onCloseBottomSheetWithUpdateValues();\n            }}\n            triggerProps={{ size: 'large' }}\n            renderTrigger={({ ref, setSearchValue, onKeyDown, onBlur, onFocus, optionsCount }) => {\n                optionsCountRef.current = optionsCount;\n                return (\n                    <ChipsTrigger\n                        {...triggerProps}\n                        allowArbitraryValues={optionsCount === 0 && allowArbitraryValues}\n                        state={state}\n                        ref={chipsTriggerRefCallback}\n                        wrapperRef={ref}\n                        onKeyDown={onKeyDown}\n                        onBlur={onBlur}\n                        onFocus={onFocus}\n                        data-qa={triggerProps['data-qa'] || 'chips-input-select-trigger'}\n                        onChange={(newState) => {\n                            const { event } = newState;\n                            setSearchValue(newState.value);\n\n                            // если нажали `enter` в инпуте на desktop\n                            if (event?.type === 'add' && event.modifier === 'enter') {\n                                const uniqueChips = getUniqueChips(selectStateRef.current, newState.chips);\n                                onChangeExternal({\n                                    value: '',\n                                    chips: uniqueChips,\n                                });\n                                setSelectState(selectStateRef.current);\n                                return;\n                            }\n\n                            onChangeExternal(newState);\n                            // если обновился только input, то ререндрить select не нужно\n                            if (event?.type === 'change' && event.modifier === 'keyboard') {\n                                return;\n                            }\n\n                            // осталось обработать только remove\n                            const deletedChip = event?.element?.value as string;\n                            const newSelectState = selectStateRef.current.filter((item) => item.value !== deletedChip);\n                            setSelectState(newSelectState);\n                            selectStateRef.current = newSelectState;\n                        }}\n                    />\n                );\n            }}\n        />\n    );\n};\n\nconst ChipsInput = forwardRef(ChipsInputComponent) as (<DataType>(\n    props: ChipsInputProps<DataType> & { ref?: ForwardedRef<HTMLInputElement> }\n) => ReactElement | null) & { displayName: string };\n\nChipsInput.displayName = 'ChipsInput';\n\nexport { ChipsInput };\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"ChipsInput.js","sources":["../src/ChipsInput.tsx"],"sourcesContent":["import { forwardRef, useRef, ForwardedRef, ReactElement, useState, useEffect } from 'react';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { ChipsInputProps } from '@hh.ru/magritte-ui-chips-input/types';\nimport { ChipsTrigger } from '@hh.ru/magritte-ui-chips-trigger';\nimport { Input } from '@hh.ru/magritte-ui-input';\nimport { Select } from '@hh.ru/magritte-ui-select';\nimport { Suggest } from '@hh.ru/magritte-ui-suggest';\n\ntype ChipsList<DataType extends StaticDataFetcherItem> = ChipsInputProps<DataType>['state']['chips'];\ntype OnChangeSuggest = ((value: string) => void) | undefined;\n\nfunction areValuesEqual<DataType extends StaticDataFetcherItem>(\n    chips: ChipsInputProps<DataType>['state']['chips'],\n    selectValues: DataType[]\n): boolean {\n    const filteredChipsSet = new Set<string>();\n    chips.forEach((item) => {\n        if (!item.userInput) {\n            filteredChipsSet.add(item.value);\n        }\n    });\n    if (filteredChipsSet.size !== selectValues.length) {\n        return false;\n    }\n    return selectValues.every(({ value }) => filteredChipsSet.has(value));\n}\n\nconst getUniqueChips = <DataType extends StaticDataFetcherItem>(\n    selectState: DataType[],\n    chipsFromState: ChipsList<DataType>\n): ChipsList<DataType> => {\n    const chipsFromUserInput = chipsFromState.filter(({ userInput }) => !!userInput);\n    // добавить значения селекта (преобразовать в чипсы их сперва)\n    const chipsFromSelect: ChipsList<DataType> =\n        selectState.length > 0 ? selectState.map(({ value, text }) => ({ value, label: text, userInput: false })) : [];\n    return [...chipsFromSelect, ...chipsFromUserInput];\n};\n\nconst getInitialSelectValue = <DataType extends StaticDataFetcherItem>(\n    type: ChipsInputProps<DataType>['type'],\n    chips: ChipsInputProps<DataType>['state']['chips']\n): DataType[] => {\n    if (type === 'suggest') {\n        return [];\n    }\n    return chips.map((chip) => ({ value: chip.value, text: chip.label }) as DataType);\n};\n\nconst ChipsInputComponent = <DataType extends StaticDataFetcherItem>(\n    { type, state, onChange: onChangeExternal, triggerProps, suggestProps, selectProps }: ChipsInputProps<DataType>,\n    ref: ForwardedRef<HTMLInputElement>\n) => {\n    const chipsTriggerRef = useRef<HTMLInputElement>(null);\n    const chipsTriggerRefCallback = useMultipleRefs(ref, chipsTriggerRef);\n    const { allowArbitraryValues } = triggerProps;\n    const [selectState, setSelectState] = useState(() => getInitialSelectValue<DataType>(type, state.chips));\n    const selectStateRef = useRef<DataType[]>(selectState);\n    const optionsCountRef = useRef<number>(0);\n    const onChangeSuggestRef = useRef<OnChangeSuggest>();\n    const { isMobile } = useBreakpoint();\n\n    useEffect(() => {\n        if (type === 'suggest') {\n            return;\n        }\n        if (areValuesEqual(state.chips, selectStateRef.current)) {\n            return;\n        }\n        const newSelectState = getInitialSelectValue<DataType>(type, state.chips);\n        selectStateRef.current = newSelectState;\n        setSelectState(newSelectState);\n    }, [type, state.chips]);\n\n    if (type === 'suggest') {\n        return (\n            <Suggest\n                {...suggestProps}\n                onChange={(value, isValueFromList) => {\n                    if (!isValueFromList) {\n                        return;\n                    }\n                    if (!state.chips.some((chip) => chip.value === value)) {\n                        onChangeExternal({ value: '', chips: [...state.chips, { value }] });\n                        if (isMobile) {\n                            onChangeSuggestRef.current?.('');\n                        }\n                    }\n                }}\n                onBottomSheetOpen={() => chipsTriggerRef.current?.blur()}\n                input={{\n                    component: Input,\n                    props: {\n                        value: state.value,\n                        'data-qa': 'chips-input-suggest-search',\n                    },\n                }}\n                onSearchSubmit={(event, onCloseBottomSheet, optionsCount) => {\n                    if (!allowArbitraryValues || optionsCount > 0) {\n                        return;\n                    }\n                    const value = (event.target as HTMLInputElement).value;\n                    if (value) {\n                        onChangeExternal({ value: '', chips: [...state.chips, { value }] });\n                        onCloseBottomSheet();\n                        onChangeSuggestRef.current?.('');\n                    }\n                }}\n                renderTrigger={({ props, optionsCount }) => {\n                    const { onChange, wrapperRef, onFocus, onKeyDown } = props;\n                    onChangeSuggestRef.current = onChange;\n                    return (\n                        <ChipsTrigger\n                            {...triggerProps}\n                            // разрешаем добавлять результаты только если в suggest ничего не нашли\n                            allowArbitraryValues={optionsCount === 0 && allowArbitraryValues}\n                            state={state}\n                            ref={chipsTriggerRefCallback}\n                            wrapperRef={wrapperRef}\n                            onKeyDown={onKeyDown}\n                            onFocus={onFocus}\n                            data-qa={triggerProps['data-qa'] || 'chips-input-suggest-trigger'}\n                            onChange={(newState) => {\n                                onChangeExternal(newState);\n                                onChange?.(newState.value);\n                            }}\n                        />\n                    );\n                }}\n            />\n        );\n    }\n\n    const { applyChangesButton, clearButton } = selectProps;\n    const haveApplyChangesButton = Boolean(applyChangesButton);\n    const haveClearButton = Boolean(clearButton);\n    return (\n        <Select\n            {...selectProps}\n            searchable\n            multiple\n            value={selectState}\n            onSelectOption={(values) => {\n                selectStateRef.current = values;\n            }}\n            onChange={(newValues) => {\n                setSelectState(newValues);\n                if (haveApplyChangesButton || (haveClearButton && newValues.length === 0)) {\n                    // обработаем эти кейсы в onApply/onClear\n                    return;\n                }\n                const uniqueChips = getUniqueChips(newValues, state.chips);\n                onChangeExternal({\n                    value: '',\n                    chips: uniqueChips,\n                });\n            }}\n            onOptionsChange={(options) => {\n                optionsCountRef.current = options.length;\n            }}\n            onApply={({ isMobile, searchValue }) => {\n                const uniqueChips = getUniqueChips(selectStateRef.current, state.chips);\n                // добавляем пользовательский ввод, если нужно\n                // в случае bs - из navbar, в случае drop - из chis-trigger\n                const userValue = isMobile ? searchValue : state.value;\n                if (allowArbitraryValues && userValue.length > 0 && optionsCountRef.current === 0) {\n                    uniqueChips.push({ value: userValue });\n                }\n                onChangeExternal({\n                    value: '',\n                    chips: uniqueChips,\n                });\n                // актуализируем состояние селекта\n                setSelectState(selectStateRef.current);\n            }}\n            onClear={() => {\n                onChangeExternal({\n                    value: '',\n                    chips: [],\n                });\n                setSelectState([]);\n                selectStateRef.current = [];\n            }}\n            onSearchSubmit={(event, _, optionsCount, onCloseBottomSheetWithUpdateValues) => {\n                const uniqueChips = getUniqueChips(selectStateRef.current, state.chips);\n                // добавляем пользовательский ввод из bs, если нужно\n                const userValue = (event.target as HTMLInputElement).value;\n                if (allowArbitraryValues && userValue.length > 0 && optionsCount === 0) {\n                    uniqueChips.push({ value: userValue, userInput: true });\n                }\n                onChangeExternal({\n                    value: '',\n                    chips: uniqueChips,\n                });\n                setSelectState(selectStateRef.current);\n                onCloseBottomSheetWithUpdateValues();\n            }}\n            triggerProps={{ size: 'large' }}\n            renderTrigger={({ ref, setSearchValue, onKeyDown, onBlur, onFocus, optionsCount }) => {\n                optionsCountRef.current = optionsCount;\n                return (\n                    <ChipsTrigger\n                        {...triggerProps}\n                        allowArbitraryValues={optionsCount === 0 && allowArbitraryValues}\n                        state={state}\n                        ref={chipsTriggerRefCallback}\n                        wrapperRef={ref}\n                        onKeyDown={onKeyDown}\n                        onBlur={onBlur}\n                        onFocus={onFocus}\n                        data-qa={triggerProps['data-qa'] || 'chips-input-select-trigger'}\n                        onChange={(newState) => {\n                            const { event } = newState;\n                            setSearchValue(newState.value);\n\n                            // если нажали `enter` в инпуте на desktop\n                            if (event?.type === 'add' && event.modifier === 'enter') {\n                                const uniqueChips = getUniqueChips(selectStateRef.current, newState.chips);\n                                onChangeExternal({\n                                    value: '',\n                                    chips: uniqueChips,\n                                });\n                                setSelectState(selectStateRef.current);\n                                return;\n                            }\n\n                            onChangeExternal(newState);\n                            // если обновился только input, то ререндрить select не нужно\n                            if (event?.type === 'change' && event.modifier === 'keyboard') {\n                                return;\n                            }\n\n                            // осталось обработать только remove\n                            const deletedChip = event?.element?.value as string;\n                            const newSelectState = selectStateRef.current.filter((item) => item.value !== deletedChip);\n                            setSelectState(newSelectState);\n                            selectStateRef.current = newSelectState;\n                        }}\n                    />\n                );\n            }}\n        />\n    );\n};\n\nconst ChipsInput = forwardRef(ChipsInputComponent) as (<DataType extends StaticDataFetcherItem>(\n    props: ChipsInputProps<DataType> & { ref?: ForwardedRef<HTMLInputElement> }\n) => ReactElement | null) & { displayName: string };\n\nChipsInput.displayName = 'ChipsInput';\n\nexport { ChipsInput };\n"],"names":["_jsx"],"mappings":";;;;;;;;;AAcA,SAAS,cAAc,CACnB,KAAkD,EAClD,YAAwB,EAAA;AAExB,IAAA,MAAM,gBAAgB,GAAG,IAAI,GAAG,EAAU,CAAC;AAC3C,IAAA,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AACnB,QAAA,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;AACjB,YAAA,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SACpC;AACL,KAAC,CAAC,CAAC;IACH,IAAI,gBAAgB,CAAC,IAAI,KAAK,YAAY,CAAC,MAAM,EAAE;AAC/C,QAAA,OAAO,KAAK,CAAC;KAChB;AACD,IAAA,OAAO,YAAY,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,gBAAgB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC;AAC1E,CAAC;AAED,MAAM,cAAc,GAAG,CACnB,WAAuB,EACvB,cAAmC,KACd;AACrB,IAAA,MAAM,kBAAkB,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC;;AAEjF,IAAA,MAAM,eAAe,GACjB,WAAW,CAAC,MAAM,GAAG,CAAC,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC;AACnH,IAAA,OAAO,CAAC,GAAG,eAAe,EAAE,GAAG,kBAAkB,CAAC,CAAC;AACvD,CAAC,CAAC;AAEF,MAAM,qBAAqB,GAAG,CAC1B,IAAuC,EACvC,KAAkD,KACtC;AACZ,IAAA,IAAI,IAAI,KAAK,SAAS,EAAE;AACpB,QAAA,OAAO,EAAE,CAAC;KACb;IACD,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,CAAa,CAAC,CAAC;AACtF,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CACxB,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAA6B,EAC/G,GAAmC,KACnC;AACA,IAAA,MAAM,eAAe,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACvD,MAAM,uBAAuB,GAAG,eAAe,CAAC,GAAG,EAAE,eAAe,CAAC,CAAC;AACtE,IAAA,MAAM,EAAE,oBAAoB,EAAE,GAAG,YAAY,CAAC;IAC9C,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,MAAM,qBAAqB,CAAW,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;AACzG,IAAA,MAAM,cAAc,GAAG,MAAM,CAAa,WAAW,CAAC,CAAC;AACvD,IAAA,MAAM,eAAe,GAAG,MAAM,CAAS,CAAC,CAAC,CAAC;AAC1C,IAAA,MAAM,kBAAkB,GAAG,MAAM,EAAmB,CAAC;AACrD,IAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,aAAa,EAAE,CAAC;IAErC,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,IAAI,KAAK,SAAS,EAAE;YACpB,OAAO;SACV;QACD,IAAI,cAAc,CAAC,KAAK,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,EAAE;YACrD,OAAO;SACV;QACD,MAAM,cAAc,GAAG,qBAAqB,CAAW,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;AAC1E,QAAA,cAAc,CAAC,OAAO,GAAG,cAAc,CAAC;QACxC,cAAc,CAAC,cAAc,CAAC,CAAC;KAClC,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;AAExB,IAAA,IAAI,IAAI,KAAK,SAAS,EAAE;AACpB,QAAA,QACIA,GAAA,CAAC,OAAO,EAAA,EAAA,GACA,YAAY,EAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,KAAI;gBACjC,IAAI,CAAC,eAAe,EAAE;oBAClB,OAAO;iBACV;AACD,gBAAA,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,EAAE;oBACnD,gBAAgB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;oBACpE,IAAI,QAAQ,EAAE;AACV,wBAAA,kBAAkB,CAAC,OAAO,GAAG,EAAE,CAAC,CAAC;qBACpC;iBACJ;AACL,aAAC,EACD,iBAAiB,EAAE,MAAM,eAAe,CAAC,OAAO,EAAE,IAAI,EAAE,EACxD,KAAK,EAAE;AACH,gBAAA,SAAS,EAAE,KAAK;AAChB,gBAAA,KAAK,EAAE;oBACH,KAAK,EAAE,KAAK,CAAC,KAAK;AAClB,oBAAA,SAAS,EAAE,4BAA4B;AAC1C,iBAAA;aACJ,EACD,cAAc,EAAE,CAAC,KAAK,EAAE,kBAAkB,EAAE,YAAY,KAAI;AACxD,gBAAA,IAAI,CAAC,oBAAoB,IAAI,YAAY,GAAG,CAAC,EAAE;oBAC3C,OAAO;iBACV;AACD,gBAAA,MAAM,KAAK,GAAI,KAAK,CAAC,MAA2B,CAAC,KAAK,CAAC;gBACvD,IAAI,KAAK,EAAE;oBACP,gBAAgB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;AACpE,oBAAA,kBAAkB,EAAE,CAAC;AACrB,oBAAA,kBAAkB,CAAC,OAAO,GAAG,EAAE,CAAC,CAAC;iBACpC;aACJ,EACD,aAAa,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,KAAI;gBACvC,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;AAC3D,gBAAA,kBAAkB,CAAC,OAAO,GAAG,QAAQ,CAAC;AACtC,gBAAA,QACIA,GAAA,CAAC,YAAY,EAAA,EAAA,GACL,YAAY;;AAEhB,oBAAA,oBAAoB,EAAE,YAAY,KAAK,CAAC,IAAI,oBAAoB,EAChE,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,uBAAuB,EAC5B,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAAA,SAAA,EACP,YAAY,CAAC,SAAS,CAAC,IAAI,6BAA6B,EACjE,QAAQ,EAAE,CAAC,QAAQ,KAAI;wBACnB,gBAAgB,CAAC,QAAQ,CAAC,CAAC;AAC3B,wBAAA,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;qBAC9B,EAAA,CACH,EACJ;aACL,EAAA,CACH,EACJ;KACL;AAED,IAAA,MAAM,EAAE,kBAAkB,EAAE,WAAW,EAAE,GAAG,WAAW,CAAC;AACxD,IAAA,MAAM,sBAAsB,GAAG,OAAO,CAAC,kBAAkB,CAAC,CAAC;AAC3D,IAAA,MAAM,eAAe,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;AAC7C,IAAA,QACIA,GAAC,CAAA,MAAM,OACC,WAAW,EACf,UAAU,EACV,IAAA,EAAA,QAAQ,QACR,KAAK,EAAE,WAAW,EAClB,cAAc,EAAE,CAAC,MAAM,KAAI;AACvB,YAAA,cAAc,CAAC,OAAO,GAAG,MAAM,CAAC;AACpC,SAAC,EACD,QAAQ,EAAE,CAAC,SAAS,KAAI;YACpB,cAAc,CAAC,SAAS,CAAC,CAAC;AAC1B,YAAA,IAAI,sBAAsB,KAAK,eAAe,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC,CAAC,EAAE;;gBAEvE,OAAO;aACV;YACD,MAAM,WAAW,GAAG,cAAc,CAAC,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;AAC3D,YAAA,gBAAgB,CAAC;AACb,gBAAA,KAAK,EAAE,EAAE;AACT,gBAAA,KAAK,EAAE,WAAW;AACrB,aAAA,CAAC,CAAC;AACP,SAAC,EACD,eAAe,EAAE,CAAC,OAAO,KAAI;AACzB,YAAA,eAAe,CAAC,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC;SAC5C,EACD,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAI;AACnC,YAAA,MAAM,WAAW,GAAG,cAAc,CAAC,cAAc,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;;;AAGxE,YAAA,MAAM,SAAS,GAAG,QAAQ,GAAG,WAAW,GAAG,KAAK,CAAC,KAAK,CAAC;AACvD,YAAA,IAAI,oBAAoB,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,IAAI,eAAe,CAAC,OAAO,KAAK,CAAC,EAAE;gBAC/E,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;aAC1C;AACD,YAAA,gBAAgB,CAAC;AACb,gBAAA,KAAK,EAAE,EAAE;AACT,gBAAA,KAAK,EAAE,WAAW;AACrB,aAAA,CAAC,CAAC;;AAEH,YAAA,cAAc,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;AAC3C,SAAC,EACD,OAAO,EAAE,MAAK;AACV,YAAA,gBAAgB,CAAC;AACb,gBAAA,KAAK,EAAE,EAAE;AACT,gBAAA,KAAK,EAAE,EAAE;AACZ,aAAA,CAAC,CAAC;YACH,cAAc,CAAC,EAAE,CAAC,CAAC;AACnB,YAAA,cAAc,CAAC,OAAO,GAAG,EAAE,CAAC;AAChC,SAAC,EACD,cAAc,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,YAAY,EAAE,kCAAkC,KAAI;AAC3E,YAAA,MAAM,WAAW,GAAG,cAAc,CAAC,cAAc,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;;AAExE,YAAA,MAAM,SAAS,GAAI,KAAK,CAAC,MAA2B,CAAC,KAAK,CAAC;AAC3D,YAAA,IAAI,oBAAoB,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,IAAI,YAAY,KAAK,CAAC,EAAE;AACpE,gBAAA,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;aAC3D;AACD,YAAA,gBAAgB,CAAC;AACb,gBAAA,KAAK,EAAE,EAAE;AACT,gBAAA,KAAK,EAAE,WAAW;AACrB,aAAA,CAAC,CAAC;AACH,YAAA,cAAc,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;AACvC,YAAA,kCAAkC,EAAE,CAAC;SACxC,EACD,YAAY,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,EAC/B,aAAa,EAAE,CAAC,EAAE,GAAG,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,KAAI;AACjF,YAAA,eAAe,CAAC,OAAO,GAAG,YAAY,CAAC;YACvC,QACIA,IAAC,YAAY,EAAA,EAAA,GACL,YAAY,EAChB,oBAAoB,EAAE,YAAY,KAAK,CAAC,IAAI,oBAAoB,EAChE,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,uBAAuB,EAC5B,UAAU,EAAE,GAAG,EACf,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAAA,SAAA,EACP,YAAY,CAAC,SAAS,CAAC,IAAI,4BAA4B,EAChE,QAAQ,EAAE,CAAC,QAAQ,KAAI;AACnB,oBAAA,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC;AAC3B,oBAAA,cAAc,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;;AAG/B,oBAAA,IAAI,KAAK,EAAE,IAAI,KAAK,KAAK,IAAI,KAAK,CAAC,QAAQ,KAAK,OAAO,EAAE;AACrD,wBAAA,MAAM,WAAW,GAAG,cAAc,CAAC,cAAc,CAAC,OAAO,EAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;AAC3E,wBAAA,gBAAgB,CAAC;AACb,4BAAA,KAAK,EAAE,EAAE;AACT,4BAAA,KAAK,EAAE,WAAW;AACrB,yBAAA,CAAC,CAAC;AACH,wBAAA,cAAc,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;wBACvC,OAAO;qBACV;oBAED,gBAAgB,CAAC,QAAQ,CAAC,CAAC;;AAE3B,oBAAA,IAAI,KAAK,EAAE,IAAI,KAAK,QAAQ,IAAI,KAAK,CAAC,QAAQ,KAAK,UAAU,EAAE;wBAC3D,OAAO;qBACV;;AAGD,oBAAA,MAAM,WAAW,GAAG,KAAK,EAAE,OAAO,EAAE,KAAe,CAAC;AACpD,oBAAA,MAAM,cAAc,GAAG,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK,KAAK,WAAW,CAAC,CAAC;oBAC3F,cAAc,CAAC,cAAc,CAAC,CAAC;AAC/B,oBAAA,cAAc,CAAC,OAAO,GAAG,cAAc,CAAC;iBAC3C,EAAA,CACH,EACJ;SACL,EAAA,CACH,EACJ;AACN,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,UAAU,CAAC,mBAAmB,EAEG;AAEpD,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}

package/UncontrolledChipsInput.d.ts

@@ -1,6 +1,7 @@
 import { ForwardedRef, ReactElement } from 'react';
+import { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';
 import { UncontrolledChipsInputProps } from '@hh.ru/magritte-ui-chips-input/types';
-declare const UncontrolledChipsInput: (<DataType>(props: UncontrolledChipsInputProps<DataType> & {
+declare const UncontrolledChipsInput: (<DataType extends StaticDataFetcherItem>(props: UncontrolledChipsInputProps<DataType> & {
     ref?: ForwardedRef<HTMLInputElement>;
 }) => ReactElement | null) & {
     displayName: string;

package/UncontrolledChipsInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"UncontrolledChipsInput.js","sources":["../src/UncontrolledChipsInput.tsx"],"sourcesContent":["import { forwardRef, useState, ForwardedRef, ReactElement } from 'react';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { ChipsInput } from '@hh.ru/magritte-ui-chips-input/ChipsInput';\nimport { UncontrolledChipsInputProps } from '@hh.ru/magritte-ui-chips-input/types';\nimport { ChipsTriggerState } from '@hh.ru/magritte-ui-chips-trigger/types';\n\nconst DEFAULT_STATE = {\n    value: '',\n    chips: [],\n};\n\nconst UncontrolledChipsInputComponent = <DataType extends StaticDataFetcherItem>(\n    { state: defaultState = DEFAULT_STATE, onChange, name, ...restProps }: UncontrolledChipsInputProps<DataType>,\n    ref: ForwardedRef<HTMLInputElement>\n) => {\n    const [state, setState] = useState<ChipsTriggerState>({ ...defaultState });\n    return (\n        <>\n            <ChipsInput\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 UncontrolledChipsInput = forwardRef(UncontrolledChipsInputComponent) as (<DataType>(\n    props: UncontrolledChipsInputProps<DataType> & { ref?: ForwardedRef<HTMLInputElement> }\n) => ReactElement | null) & { displayName: string };\n\nUncontrolledChipsInput.displayName = 'UncontrolledChipsInput';\n\nexport { UncontrolledChipsInput };\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":";;;;;;;;;;AAOA,MAAM,aAAa,GAAG;AAClB,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;CACZ,CAAC;AAEF,MAAM,+BAA+B,GAAG,CACpC,EAAE,KAAK,EAAE,YAAY,GAAG,aAAa,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,SAAS,EAAyC,EAC5G,GAAmC,KACnC;AACA,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAoB,EAAE,GAAG,YAAY,EAAE,CAAC,CAAC;AAC3E,IAAA,QACIA,IACI,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CAAAC,GAAA,CAAC,UAAU,EAAA,EAAA,GACH,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,sBAAsB,GAAG,UAAU,CAAC,+BAA+B,EAErB;AAEpD,sBAAsB,CAAC,WAAW,GAAG,wBAAwB;;;;"}
+{"version":3,"file":"UncontrolledChipsInput.js","sources":["../src/UncontrolledChipsInput.tsx"],"sourcesContent":["import { forwardRef, useState, ForwardedRef, ReactElement } from 'react';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { ChipsInput } from '@hh.ru/magritte-ui-chips-input/ChipsInput';\nimport { UncontrolledChipsInputProps } from '@hh.ru/magritte-ui-chips-input/types';\nimport { ChipsTriggerState } from '@hh.ru/magritte-ui-chips-trigger/types';\n\nconst DEFAULT_STATE = {\n    value: '',\n    chips: [],\n};\n\nconst UncontrolledChipsInputComponent = <DataType extends StaticDataFetcherItem>(\n    { state: defaultState = DEFAULT_STATE, onChange, name, ...restProps }: UncontrolledChipsInputProps<DataType>,\n    ref: ForwardedRef<HTMLInputElement>\n) => {\n    const [state, setState] = useState<ChipsTriggerState>({ ...defaultState });\n    return (\n        <>\n            <ChipsInput\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 UncontrolledChipsInput = forwardRef(UncontrolledChipsInputComponent) as (<DataType extends StaticDataFetcherItem>(\n    props: UncontrolledChipsInputProps<DataType> & { ref?: ForwardedRef<HTMLInputElement> }\n) => ReactElement | null) & { displayName: string };\n\nUncontrolledChipsInput.displayName = 'UncontrolledChipsInput';\n\nexport { UncontrolledChipsInput };\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":";;;;;;;;;;AAOA,MAAM,aAAa,GAAG;AAClB,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;CACZ,CAAC;AAEF,MAAM,+BAA+B,GAAG,CACpC,EAAE,KAAK,EAAE,YAAY,GAAG,aAAa,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,SAAS,EAAyC,EAC5G,GAAmC,KACnC;AACA,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAoB,EAAE,GAAG,YAAY,EAAE,CAAC,CAAC;AAC3E,IAAA,QACIA,IACI,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CAAAC,GAAA,CAAC,UAAU,EAAA,EAAA,GACH,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,sBAAsB,GAAG,UAAU,CAAC,+BAA+B,EAErB;AAEpD,sBAAsB,CAAC,WAAW,GAAG,wBAAwB;;;;"}

package/index.mock.d.ts

@@ -2,4 +2,5 @@ import { ForwardRefExoticComponent } from 'react';
 export type * from '@hh.ru/magritte-ui-chips-input/types';
 declare const ThemeProvider: any;
 export { ThemeProvider };
-export declare const Input: ForwardRefExoticComponent<Record<string, unknown>>;
+export declare const ChipsInput: ForwardRefExoticComponent<Record<string, unknown>>;
+export declare const UncontrolledChipsInput: ForwardRefExoticComponent<Record<string, unknown>>;

package/index.mock.js

@@ -2,9 +2,12 @@ import { mockComponent } from '@hh.ru/magritte-ui-mock-component';
 
 // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
 const { ThemeProvider } = jest.requireActual('@hh.ru/magritte-ui-theme-provider/index');
-const Input = mockComponent('ChipsInput', undefined, {
-    withChildren: false,
+const ChipsInput = mockComponent('ChipsInput', undefined, {
+    withChildren: true,
+});
+const UncontrolledChipsInput = mockComponent('UncontrolledChipsInput', undefined, {
+    withChildren: true,
 });
 
-export { Input, ThemeProvider };
+export { ChipsInput, ThemeProvider, UncontrolledChipsInput };
 //# 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-input/types';\n\n// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\nconst { ThemeProvider } = jest.requireActual('@hh.ru/magritte-ui-theme-provider/index');\n\nexport { ThemeProvider };\n\nexport const Input: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent('ChipsInput', undefined, {\n    withChildren: false,\n});\n"],"names":[],"mappings":";;AAMA;AACM,MAAA,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC,yCAAyC,EAAE;MAI3E,KAAK,GAAuD,aAAa,CAAC,YAAY,EAAE,SAAS,EAAE;AAC5G,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-input/types';\n\n// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\nconst { ThemeProvider } = jest.requireActual('@hh.ru/magritte-ui-theme-provider/index');\n\nexport { ThemeProvider };\n\nexport const ChipsInput: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent('ChipsInput', undefined, {\n    withChildren: true,\n});\n\nexport const UncontrolledChipsInput: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n    'UncontrolledChipsInput',\n    undefined,\n    {\n        withChildren: true,\n    }\n);\n"],"names":[],"mappings":";;AAMA;AACM,MAAA,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC,yCAAyC,EAAE;MAI3E,UAAU,GAAuD,aAAa,CAAC,YAAY,EAAE,SAAS,EAAE;AACjH,IAAA,YAAY,EAAE,IAAI;AACrB,CAAA,EAAE;MAEU,sBAAsB,GAAuD,aAAa,CACnG,wBAAwB,EACxB,SAAS,EACT;AACI,IAAA,YAAY,EAAE,IAAI;AACrB,CAAA;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hh.ru/magritte-ui-chips-input",
-  "version": "5.0.11",
+  "version": "6.0.1",
   "main": "index.js",
   "types": "index.d.ts",
   "sideEffects": [
@@ -26,15 +26,15 @@
     "react": ">=18.2.0"
   },
   "dependencies": {
-    "@hh.ru/magritte-common-data-provider": "1.1.0",
+    "@hh.ru/magritte-common-data-provider": "1.2.0",
     "@hh.ru/magritte-common-use-multiple-refs": "1.1.5",
     "@hh.ru/magritte-ui-breakpoint": "5.0.0",
-    "@hh.ru/magritte-ui-chips-trigger": "3.3.13",
+    "@hh.ru/magritte-ui-chips-trigger": "3.3.14",
     "@hh.ru/magritte-ui-input": "7.1.16",
     "@hh.ru/magritte-ui-mock-component": "1.0.12",
-    "@hh.ru/magritte-ui-select": "10.0.11",
-    "@hh.ru/magritte-ui-suggest": "7.0.9",
+    "@hh.ru/magritte-ui-select": "10.0.13",
+    "@hh.ru/magritte-ui-suggest": "8.0.1",
     "@hh.ru/magritte-ui-theme-provider": "1.1.41"
   },
-  "gitHead": "d77d66dde37efbf4f169985c1ed243ba9bbdc67e"
+  "gitHead": "45423cebe8915eca05c73df986715979d386f7be"
 }