@salutejs/plasma-new-hope 0.72.0-canary.1160.8612911363.0 → 0.72.0-canary.1160.8617165473.0

package/es/components/TextField/hooks/useKeyNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useKeyNavigation.js","sources":["../../../../src/components/TextField/hooks/useKeyNavigation.ts"],"sourcesContent":["import { useState } from 'react';\nimport type { ChangeEvent, KeyboardEvent } from 'react';\n\nimport type { UseKeyNavigationProps } from '../TextField.types';\n\nexport const Keys = {\n    Enter: 'Enter',\n    Tab: 'Tab',\n    Escape: 'Escape',\n    ArrowLeft: 'ArrowLeft',\n    ArrowRight: 'ArrowRight',\n    Backspace: 'Backspace',\n};\n\nexport const useKeyNavigation = ({\n    controlledRefs: { chipsRefs, contentRef, inputRef },\n    disabled,\n    readOnly,\n    chips,\n    enumerationType,\n    updateChips,\n    onChange,\n    onSearch,\n}: UseKeyNavigationProps) => {\n    const [activeChipIndex, setActiveChipIndex] = useState(-1);\n\n    const handleInputKeydown = (event: ChangeEvent<HTMLInputElement> & KeyboardEvent<HTMLInputElement>) => {\n        const { value } = event.target as HTMLInputElement;\n\n        if (disabled || readOnly) {\n            return;\n        }\n\n        if (event.key === Keys.Enter && enumerationType === 'chip' && value) {\n            const nextIndex = chips?.length || 0;\n\n            const newChips = [...chips, { id: `${nextIndex}_${value}`, text: value }];\n            const newValues = newChips.map(({ text }) => text);\n\n            updateChips(newChips, newValues);\n            event.target.value = '';\n            onChange?.(event);\n        }\n\n        if (event.key === Keys.Enter && onSearch) {\n            onSearch(value, event);\n        }\n\n        if (event.key === Keys.Backspace && chips.length && inputRef?.current?.selectionStart === 0) {\n            const newChips = [...chips];\n            newChips?.pop();\n            chipsRefs?.current.pop();\n\n            const newValues = newChips.map(({ text }) => text);\n\n            updateChips(newChips, newValues);\n        }\n    };\n\n    const onChipClear = (clearId: string) => {\n        if (!chips.length) {\n            return;\n        }\n\n        const newChips = chips?.filter(({ id: chipId }) => chipId !== clearId) || [];\n        const newValues = newChips.map(({ text }) => text);\n\n        updateChips(newChips, newValues);\n    };\n\n    const handleChipKeyDown = (event: KeyboardEvent<HTMLButtonElement>, chipId: string) => {\n        if (event.key === Keys.Tab) {\n            event.preventDefault();\n        }\n\n        if (event.key === Keys.Backspace) {\n            onChipClear(chipId);\n        }\n    };\n\n    const handleContentKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n        const chipsRefsCount = chips.length;\n        const currentCaretPosition = inputRef?.current?.selectionStart || 0;\n\n        let newActiveChipIndex = activeChipIndex;\n        let focusedItem: HTMLButtonElement | HTMLInputElement | null = null;\n\n        if (event.key === Keys.ArrowLeft && enumerationType === 'chip' && currentCaretPosition <= 0) {\n            const index = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;\n\n            newActiveChipIndex = document.activeElement === inputRef?.current ? chipsRefsCount - 1 : index;\n\n            focusedItem = chipsRefs.current?.[newActiveChipIndex];\n        }\n\n        if (\n            event.key === Keys.ArrowRight &&\n            enumerationType === 'chip' &&\n            document.activeElement !== inputRef?.current\n        ) {\n            const index = activeChipIndex + 1 >= chipsRefsCount ? activeChipIndex : activeChipIndex + 1;\n\n            newActiveChipIndex = document.activeElement === contentRef?.current ? 0 : index;\n            focusedItem =\n                index === activeChipIndex\n                    ? (inputRef?.current as HTMLInputElement)\n                    : chipsRefs.current?.[newActiveChipIndex];\n        }\n\n        if (event.key === Keys.Backspace && document.activeElement !== inputRef?.current) {\n            const index = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;\n\n            newActiveChipIndex = chipsRefsCount === 0 ? -1 : index;\n            focusedItem =\n                chipsRefsCount === 0\n                    ? (inputRef?.current as HTMLInputElement)\n                    : chipsRefs?.current?.[newActiveChipIndex];\n        }\n\n        focusedItem?.focus();\n        focusedItem?.scrollIntoView({\n            behavior: 'smooth',\n            block: 'center',\n            inline: 'center',\n        });\n\n        setActiveChipIndex(newActiveChipIndex);\n    };\n\n    return { handleInputKeydown, handleChipKeyDown, onChipClear, handleContentKeyDown } as const;\n};\n"],"names":["Keys","Enter","Tab","Escape","ArrowLeft","ArrowRight","Backspace","useKeyNavigation","_ref","_ref$controlledRefs","controlledRefs","chipsRefs","contentRef","inputRef","disabled","readOnly","chips","enumerationType","updateChips","onChange","onSearch","_useState","useState","_useState2","_slicedToArray","activeChipIndex","setActiveChipIndex","handleInputKeydown","event","_inputRef$current","_ref2","target","value","key","nextIndex","length","newChips","concat","_toConsumableArray","id","text","newValues","map","_ref3","current","selectionStart","pop","_ref4","onChipClear","clearId","filter","_ref5","chipId","_ref6","handleChipKeyDown","preventDefault","handleContentKeyDown","_inputRef$current2","_focusedItem","_focusedItem2","chipsRefsCount","currentCaretPosition","newActiveChipIndex","focusedItem","_chipsRefs$current","index","document","activeElement","_chipsRefs$current2","_chipsRefs$current3","focus","scrollIntoView","behavior","block","inline"],"mappings":"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"}
+{"version":3,"file":"useKeyNavigation.js","sources":["../../../../src/components/TextField/hooks/useKeyNavigation.ts"],"sourcesContent":["import { useState } from 'react';\nimport type { ChangeEvent, KeyboardEvent } from 'react';\n\nimport type { UseKeyNavigationProps } from '../TextField.types';\n\nexport const Keys = {\n    Enter: 'Enter',\n    Tab: 'Tab',\n    Escape: 'Escape',\n    ArrowLeft: 'ArrowLeft',\n    ArrowRight: 'ArrowRight',\n    Backspace: 'Backspace',\n};\n\nexport const useKeyNavigation = ({\n    controlledRefs: { chipsRefs, contentRef, inputRef },\n    disabled,\n    readOnly,\n    chips,\n    enumerationType,\n    updateChips,\n    onChange,\n    onSearch,\n}: UseKeyNavigationProps) => {\n    const [activeChipIndex, setActiveChipIndex] = useState(-1);\n\n    const handleInputKeydown = (event: ChangeEvent<HTMLInputElement> & KeyboardEvent<HTMLInputElement>) => {\n        const { value } = event.target as HTMLInputElement;\n\n        if (disabled || readOnly) {\n            return;\n        }\n\n        if (event.key === Keys.Enter && enumerationType === 'chip' && value) {\n            const nextIndex = chips?.length || 0;\n\n            const newChips = [...chips, { id: `${nextIndex}_${value}`, text: value }];\n            const newValues = newChips.map(({ text }) => text);\n\n            updateChips(newChips, newValues);\n            event.target.value = '';\n            onChange?.(event);\n        }\n\n        if (event.key === Keys.Enter && onSearch) {\n            onSearch(value, event);\n        }\n\n        if (event.key === Keys.Backspace && chips.length && inputRef?.current?.selectionStart === 0) {\n            const newChips = [...chips];\n            newChips?.pop();\n            chipsRefs?.current.pop();\n\n            const newValues = newChips.map(({ text }) => text);\n\n            updateChips(newChips, newValues);\n        }\n    };\n\n    const onChipClear = (clearId: string, index: number) => {\n        if (!chips.length) {\n            return;\n        }\n\n        const newChips = chips?.filter(({ id: chipId }) => chipId !== clearId) || [];\n        const newValues = newChips.map(({ text }) => text);\n        chipsRefs?.current.splice(index, 1);\n\n        updateChips(newChips, newValues);\n    };\n\n    const handleChipKeyDown = (event: KeyboardEvent<HTMLButtonElement>, chipId: string, chipIndex: number) => {\n        if (event.key === Keys.Tab) {\n            event.preventDefault();\n        }\n\n        if (event.key === Keys.Backspace) {\n            onChipClear(chipId, chipIndex);\n        }\n    };\n\n    const handleContentKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n        const chipsRefsCount = chipsRefs.current.length;\n        const currentCaretPosition = inputRef?.current?.selectionStart || 0;\n\n        let newActiveChipIndex = activeChipIndex;\n        let focusedItem: HTMLButtonElement | HTMLInputElement | null = null;\n\n        if (event.key === Keys.ArrowLeft && enumerationType === 'chip' && currentCaretPosition <= 0) {\n            const index = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;\n\n            newActiveChipIndex = document.activeElement === inputRef?.current ? chipsRefsCount - 1 : index;\n\n            focusedItem = chipsRefs.current?.[newActiveChipIndex];\n        }\n\n        if (\n            event.key === Keys.ArrowRight &&\n            enumerationType === 'chip' &&\n            document.activeElement !== inputRef?.current\n        ) {\n            const index = activeChipIndex + 1 >= chipsRefsCount ? activeChipIndex : activeChipIndex + 1;\n\n            newActiveChipIndex = document.activeElement === contentRef?.current ? 0 : index;\n            focusedItem =\n                index === activeChipIndex\n                    ? (inputRef?.current as HTMLInputElement)\n                    : chipsRefs.current?.[newActiveChipIndex];\n        }\n\n        if (event.key === Keys.Backspace && document.activeElement !== inputRef?.current) {\n            const index = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;\n\n            newActiveChipIndex = chipsRefsCount === 0 ? -1 : index;\n            focusedItem =\n                chipsRefsCount === 0\n                    ? (inputRef?.current as HTMLInputElement)\n                    : chipsRefs?.current?.[newActiveChipIndex];\n        }\n\n        focusedItem?.focus();\n        focusedItem?.scrollIntoView({\n            behavior: 'smooth',\n            block: 'center',\n            inline: 'center',\n        });\n\n        setActiveChipIndex(newActiveChipIndex);\n    };\n\n    return { handleInputKeydown, handleChipKeyDown, onChipClear, handleContentKeyDown } as const;\n};\n"],"names":["Keys","Enter","Tab","Escape","ArrowLeft","ArrowRight","Backspace","useKeyNavigation","_ref","_ref$controlledRefs","controlledRefs","chipsRefs","contentRef","inputRef","disabled","readOnly","chips","enumerationType","updateChips","onChange","onSearch","_useState","useState","_useState2","_slicedToArray","activeChipIndex","setActiveChipIndex","handleInputKeydown","event","_inputRef$current","_ref2","target","value","key","nextIndex","length","newChips","concat","_toConsumableArray","id","text","newValues","map","_ref3","current","selectionStart","pop","_ref4","onChipClear","clearId","index","filter","_ref5","chipId","_ref6","splice","handleChipKeyDown","chipIndex","preventDefault","handleContentKeyDown","_inputRef$current2","_focusedItem","_focusedItem2","chipsRefsCount","currentCaretPosition","newActiveChipIndex","focusedItem","_chipsRefs$current","document","activeElement","_chipsRefs$current2","_chipsRefs$current3","focus","scrollIntoView","behavior","block","inline"],"mappings":"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"}

package/es/components/TextField/ui/TextFieldChip/TextFieldChip.js

@@ -5,7 +5,7 @@ import { StyledChip } from './TextFieldChip.styles.js';
  * Чип, отображающий выбранный элемент
  */
 var TextFieldChip = /*#__PURE__*/forwardRef(function (_ref, ref) {
-  var chipId = _ref.chipId,
+  var id = _ref.id,
     text = _ref.text,
     disabled = _ref.disabled,
     readOnly = _ref.readOnly,
@@ -13,10 +13,10 @@ var TextFieldChip = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onClear = _ref.onClear,
     onKeyDown = _ref.onKeyDown;
   var onClearHandle = function onClearHandle() {
-    return onClear(chipId);
+    return onClear(id);
   };
   var onKeyDownHandle = function onKeyDownHandle(event) {
-    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event, chipId);
+    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event, id);
   };
   return /*#__PURE__*/React.createElement(StyledChip, {
     ref: ref,

package/es/components/TextField/ui/TextFieldChip/TextFieldChip.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextFieldChip.js","sources":["../../../../../src/components/TextField/ui/TextFieldChip/TextFieldChip.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { StyledChip } from './TextFieldChip.styles';\nimport type { TextFieldChipProps } from './TextFieldChip.types';\n\n/**\n * Чип, отображающий выбранный элемент\n */\nexport const TextFieldChip = forwardRef<HTMLButtonElement, TextFieldChipProps>(\n    ({ chipId, text, disabled, readOnly, onClick, onClear, onKeyDown }, ref) => {\n        const onClearHandle = () => onClear(chipId);\n\n        const onKeyDownHandle = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n            onKeyDown?.(event, chipId);\n        };\n\n        return (\n            <StyledChip\n                ref={ref}\n                tabIndex={-1}\n                disabled={disabled}\n                readOnly={readOnly}\n                onClick={onClick}\n                onClear={onClearHandle}\n                onKeyDown={onKeyDownHandle}\n                text={`${text}`}\n            />\n        );\n    },\n);\n"],"names":["TextFieldChip","forwardRef","_ref","ref","chipId","text","disabled","readOnly","onClick","onClear","onKeyDown","onClearHandle","onKeyDownHandle","event","React","createElement","StyledChip","tabIndex","concat"],"mappings":";;;AAKA;AACA;AACA;AACO,IAAMA,aAAa,gBAAGC,UAAU,CACnC,UAAAC,IAAA,EAAoEC,GAAG,EAAK;AAAA,EAAA,IAAzEC,MAAM,GAAAF,IAAA,CAANE,MAAM;IAAEC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IAAEC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;IAAEC,QAAQ,GAAAL,IAAA,CAARK,QAAQ;IAAEC,OAAO,GAAAN,IAAA,CAAPM,OAAO;IAAEC,OAAO,GAAAP,IAAA,CAAPO,OAAO;IAAEC,SAAS,GAAAR,IAAA,CAATQ,SAAS,CAAA;AAC5D,EAAA,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,GAAA;IAAA,OAASF,OAAO,CAACL,MAAM,CAAC,CAAA;AAAA,GAAA,CAAA;AAE3C,EAAA,IAAMQ,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,KAA6C,EAAK;IACvEH,SAAS,KAAA,IAAA,IAATA,SAAS,KAATA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,SAAS,CAAGG,KAAK,EAAET,MAAM,CAAC,CAAA;GAC7B,CAAA;AAED,EAAA,oBACIU,KAAA,CAAAC,aAAA,CAACC,UAAU,EAAA;AACPb,IAAAA,GAAG,EAAEA,GAAI;IACTc,QAAQ,EAAE,CAAC,CAAE;AACbX,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,OAAO,EAAEE,aAAc;AACvBD,IAAAA,SAAS,EAAEE,eAAgB;IAC3BP,IAAI,EAAA,EAAA,CAAAa,MAAA,CAAKb,IAAI,CAAA;AAAG,GACnB,CAAC,CAAA;AAEV,CACJ;;;;"}
+{"version":3,"file":"TextFieldChip.js","sources":["../../../../../src/components/TextField/ui/TextFieldChip/TextFieldChip.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { StyledChip } from './TextFieldChip.styles';\nimport type { TextFieldChipProps } from './TextFieldChip.types';\n\n/**\n * Чип, отображающий выбранный элемент\n */\nexport const TextFieldChip = forwardRef<HTMLButtonElement, TextFieldChipProps>(\n    ({ id, text, disabled, readOnly, onClick, onClear, onKeyDown }, ref) => {\n        const onClearHandle = () => onClear(id);\n\n        const onKeyDownHandle = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n            onKeyDown?.(event, id);\n        };\n\n        return (\n            <StyledChip\n                ref={ref}\n                tabIndex={-1}\n                disabled={disabled}\n                readOnly={readOnly}\n                onClick={onClick}\n                onClear={onClearHandle}\n                onKeyDown={onKeyDownHandle}\n                text={`${text}`}\n            />\n        );\n    },\n);\n"],"names":["TextFieldChip","forwardRef","_ref","ref","id","text","disabled","readOnly","onClick","onClear","onKeyDown","onClearHandle","onKeyDownHandle","event","React","createElement","StyledChip","tabIndex","concat"],"mappings":";;;AAKA;AACA;AACA;AACO,IAAMA,aAAa,gBAAGC,UAAU,CACnC,UAAAC,IAAA,EAAgEC,GAAG,EAAK;AAAA,EAAA,IAArEC,EAAE,GAAAF,IAAA,CAAFE,EAAE;IAAEC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IAAEC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;IAAEC,QAAQ,GAAAL,IAAA,CAARK,QAAQ;IAAEC,OAAO,GAAAN,IAAA,CAAPM,OAAO;IAAEC,OAAO,GAAAP,IAAA,CAAPO,OAAO;IAAEC,SAAS,GAAAR,IAAA,CAATQ,SAAS,CAAA;AACxD,EAAA,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,GAAA;IAAA,OAASF,OAAO,CAACL,EAAE,CAAC,CAAA;AAAA,GAAA,CAAA;AAEvC,EAAA,IAAMQ,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,KAA6C,EAAK;IACvEH,SAAS,KAAA,IAAA,IAATA,SAAS,KAATA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,SAAS,CAAGG,KAAK,EAAET,EAAE,CAAC,CAAA;GACzB,CAAA;AAED,EAAA,oBACIU,KAAA,CAAAC,aAAA,CAACC,UAAU,EAAA;AACPb,IAAAA,GAAG,EAAEA,GAAI;IACTc,QAAQ,EAAE,CAAC,CAAE;AACbX,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,OAAO,EAAEE,aAAc;AACvBD,IAAAA,SAAS,EAAEE,eAAgB;IAC3BP,IAAI,EAAA,EAAA,CAAAa,MAAA,CAAKb,IAAI,CAAA;AAAG,GACnB,CAAC,CAAA;AAEV,CACJ;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salutejs/plasma-new-hope",
-  "version": "0.72.0-canary.1160.8612911363.0",
+  "version": "0.72.0-canary.1160.8617165473.0",
   "description": "Salute Design System blueprint",
   "main": "cjs/index.js",
   "module": "es/index.js",
@@ -102,5 +102,5 @@
     "react-popper": "2.3.0",
     "storeon": "3.1.5"
   },
-  "gitHead": "2c219b5bc21124b0c826daf43a79feef2c7e90bd"
+  "gitHead": "0f6737ab306b99e594de14d4206547354d7295f6"
 }

package/styled-components/cjs/components/Cell/Cell.js

@@ -33,6 +33,8 @@ var cellRoot = exports.cellRoot = function cellRoot(Root) {
       _ref$stretching = _ref.stretching,
       stretching = _ref$stretching === void 0 ? 'filled' : _ref$stretching;
     var stretchingClass = _Cell2.classes["".concat(stretching, "Stretching")];
+
+    // Импорт  старых свойств
     var titleText = title || description;
     var contentLeftDeprecated = contentLeft || content;
     return /*#__PURE__*/_react["default"].createElement(Root, {

package/styled-components/cjs/components/TextField/TextField.js

@@ -18,7 +18,7 @@ var _TextField = /*#__PURE__*/require("./TextField.styles");
 var _TextField2 = /*#__PURE__*/require("./TextField.tokens");
 var _ui = /*#__PURE__*/require("./ui");
 var _useKeyNavigation2 = /*#__PURE__*/require("./hooks/useKeyNavigation");
-var _excluded = ["id", "contentLeft", "contentRight", "label", "labelPlacement", "placeholder", "leftHelper", "enumerationType", "view", "size", "readOnly", "disabled", "values", "onChange", "onChangeChips", "onSearch"];
+var _excluded = ["id", "contentLeft", "contentRight", "label", "labelPlacement", "placeholder", "leftHelper", "enumerationType", "view", "size", "readOnly", "disabled", "chips", "onChange", "onChangeChips", "onSearch"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -48,7 +48,7 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
       readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      values = _ref.values,
+      values = _ref.chips,
       onChange = _ref.onChange,
       onChangeChips = _ref.onChangeChips,
       onSearch = _ref.onSearch,
@@ -164,20 +164,20 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
       var chipId = _ref2.id,
         text = _ref2.text;
       return /*#__PURE__*/_react["default"].createElement(_ui.TextFieldChip, {
+        id: chipId,
         ref: function ref(element) {
           return getRef(element, index);
         },
-        chipId: chipId,
         key: "".concat(chipId, "_").concat(index),
         disabled: disabled,
         readOnly: readOnly,
         value: text,
         text: text,
         onKeyDown: function onKeyDown(event) {
-          return handleChipKeyDown(event, chipId);
+          return handleChipKeyDown(event, chipId, index);
         },
         onClear: function onClear() {
-          return onChipClear(chipId);
+          return onChipClear(chipId, index);
         },
         onClick: onChipClick
       });

package/styled-components/cjs/components/TextField/hooks/useKeyNavigation.js

@@ -74,7 +74,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
       updateChips(_newChips, _newValues);
     }
   };
-  var onChipClear = function onChipClear(clearId) {
+  var onChipClear = function onChipClear(clearId, index) {
     if (!chips.length) {
       return;
     }
@@ -86,19 +86,20 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
       var text = _ref6.text;
       return text;
     });
+    chipsRefs === null || chipsRefs === void 0 ? void 0 : chipsRefs.current.splice(index, 1);
     updateChips(newChips, newValues);
   };
-  var handleChipKeyDown = function handleChipKeyDown(event, chipId) {
+  var handleChipKeyDown = function handleChipKeyDown(event, chipId, chipIndex) {
     if (event.key === Keys.Tab) {
       event.preventDefault();
     }
     if (event.key === Keys.Backspace) {
-      onChipClear(chipId);
+      onChipClear(chipId, chipIndex);
     }
   };
   var handleContentKeyDown = function handleContentKeyDown(event) {
     var _inputRef$current2, _focusedItem, _focusedItem2;
-    var chipsRefsCount = chips.length;
+    var chipsRefsCount = chipsRefs.current.length;
     var currentCaretPosition = (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.selectionStart) || 0;
     var newActiveChipIndex = activeChipIndex;
     var focusedItem = null;

package/styled-components/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.js

@@ -13,7 +13,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  * Чип, отображающий выбранный элемент
  */
 var TextFieldChip = exports.TextFieldChip = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
-  var chipId = _ref.chipId,
+  var id = _ref.id,
     text = _ref.text,
     disabled = _ref.disabled,
     readOnly = _ref.readOnly,
@@ -21,10 +21,10 @@ var TextFieldChip = exports.TextFieldChip = /*#__PURE__*/(0, _react.forwardRef)(
     onClear = _ref.onClear,
     onKeyDown = _ref.onKeyDown;
   var onClearHandle = function onClearHandle() {
-    return onClear(chipId);
+    return onClear(id);
   };
   var onKeyDownHandle = function onKeyDownHandle(event) {
-    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event, chipId);
+    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event, id);
   };
   return /*#__PURE__*/_react["default"].createElement(_TextFieldChip.StyledChip, {
     ref: ref,

package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx

@@ -11,10 +11,10 @@ const onChange = action('onChange');
 const onFocus = action('onFocus');
 const onBlur = action('onBlur');
 const onSearch = action('onSearch');
+const onChipsChange = action('onChipsChange');
 
 const sizes = ['l', 'm', 's', 'xs'];
 const views = ['default', 'positive', 'warning', 'negative'];
-const enumerationTypes = ['plain', 'chip'];
 const labelPlacements = ['outer', 'inner'];
 
 const meta: Meta<typeof TextField> = {
@@ -39,12 +39,6 @@ const meta: Meta<typeof TextField> = {
                 type: 'inline-radio',
             },
         },
-        enumerationType: {
-            options: enumerationTypes,
-            control: {
-                type: 'select',
-            },
-        },
         size: {
             options: sizes,
             control: {
@@ -72,6 +66,9 @@ type StoryPropsDefault = Omit<
     | 'maxLength'
     | 'minLength'
     | 'required'
+    | 'enumerationType'
+    | 'chips'
+    | 'onChangeChips'
 > & {
     'storybook:contentLeft': boolean;
     'storybook:contentRight': boolean;
@@ -90,6 +87,7 @@ const StoryDemo = ({
     return (
         <TextField
             {...rest}
+            enumerationType="plain"
             value={text}
             contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
             contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
@@ -114,7 +112,6 @@ export const Default: StoryObj<StoryPropsDefault> = {
         labelPlacement: 'outer',
         placeholder: 'Заполните поле',
         leftHelper: 'Подсказка к полю',
-        enumerationType: 'plain',
         disabled: false,
         readOnly: false,
         'storybook:contentLeft': true,
@@ -123,11 +120,62 @@ export const Default: StoryObj<StoryPropsDefault> = {
     render: (args) => <StoryDemo {...args} />,
 };
 
-export const Chips: StoryObj<StoryPropsDefault> = {
+type StoryPropsChips = Omit<
+    ComponentProps<typeof TextField>,
+    | 'helperBlock'
+    | 'contentLeft'
+    | 'htmlSize'
+    | 'contentRight'
+    | 'type'
+    | 'name'
+    | 'onFocus'
+    | 'onBlur'
+    | 'onChange'
+    | 'onSearch'
+    | 'value'
+    | 'checked'
+    | 'maxLength'
+    | 'minLength'
+    | 'required'
+    | 'enumerationType'
+> & {
+    'storybook:contentLeft': boolean;
+    'storybook:contentRight': boolean;
+};
+
+const StoryChips = ({
+    'storybook:contentLeft': enableContentLeft,
+    'storybook:contentRight': enableContentRight,
+    view,
+    ...rest
+}: StoryPropsChips) => {
+    const [text, setText] = useState('Значение поля');
+
+    const iconSize = rest.size === 'xs' ? 'xs' : 's';
+
+    return (
+        <TextField
+            {...rest}
+            enumerationType="chip"
+            value={text}
+            contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
+            contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
+            view={view}
+            onChange={(e) => {
+                setText(e.target.value);
+                onChange(e.target.value);
+            }}
+            onFocus={onFocus}
+            onBlur={onBlur}
+            onChangeChips={onChipsChange}
+        />
+    );
+};
+
+export const Chips: StoryObj<StoryPropsChips> = {
     args: {
         ...Default.args,
-        enumerationType: 'chip',
-        values: ['1 value', '2 value', '3 value', '4 value'],
+        chips: ['1 value', '2 value', '3 value', '4 value'],
     },
-    render: (args) => <StoryDemo {...args} />,
+    render: (args) => <StoryChips {...args} />,
 };

package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx

@@ -11,10 +11,10 @@ const onChange = action('onChange');
 const onFocus = action('onFocus');
 const onBlur = action('onBlur');
 const onSearch = action('onSearch');
+const onChipsChange = action('onChipsChange');
 
 const sizes = ['l', 'm', 's', 'xs'];
 const views = ['default', 'positive', 'warning', 'negative'];
-const enumerationTypes = ['plain', 'chip'];
 const labelPlacements = ['outer', 'inner'];
 
 const meta: Meta<typeof TextField> = {
@@ -39,12 +39,6 @@ const meta: Meta<typeof TextField> = {
                 type: 'inline-radio',
             },
         },
-        enumerationType: {
-            options: enumerationTypes,
-            control: {
-                type: 'select',
-            },
-        },
         size: {
             options: sizes,
             control: {
@@ -72,6 +66,9 @@ type StoryPropsDefault = Omit<
     | 'maxLength'
     | 'minLength'
     | 'required'
+    | 'enumerationType'
+    | 'chips'
+    | 'onChangeChips'
 > & {
     'storybook:contentLeft': boolean;
     'storybook:contentRight': boolean;
@@ -90,6 +87,7 @@ const StoryDemo = ({
     return (
         <TextField
             {...rest}
+            enumerationType="plain"
             value={text}
             contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
             contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
@@ -114,7 +112,6 @@ export const Default: StoryObj<StoryPropsDefault> = {
         labelPlacement: 'outer',
         placeholder: 'Заполните поле',
         leftHelper: 'Подсказка к полю',
-        enumerationType: 'plain',
         disabled: false,
         readOnly: false,
         'storybook:contentLeft': true,
@@ -123,11 +120,62 @@ export const Default: StoryObj<StoryPropsDefault> = {
     render: (args) => <StoryDemo {...args} />,
 };
 
-export const Chips: StoryObj<StoryPropsDefault> = {
+type StoryPropsChips = Omit<
+    ComponentProps<typeof TextField>,
+    | 'helperBlock'
+    | 'contentLeft'
+    | 'htmlSize'
+    | 'contentRight'
+    | 'type'
+    | 'name'
+    | 'onFocus'
+    | 'onBlur'
+    | 'onChange'
+    | 'onSearch'
+    | 'value'
+    | 'checked'
+    | 'maxLength'
+    | 'minLength'
+    | 'required'
+    | 'enumerationType'
+> & {
+    'storybook:contentLeft': boolean;
+    'storybook:contentRight': boolean;
+};
+
+const StoryChips = ({
+    'storybook:contentLeft': enableContentLeft,
+    'storybook:contentRight': enableContentRight,
+    view,
+    ...rest
+}: StoryPropsChips) => {
+    const [text, setText] = useState('Значение поля');
+
+    const iconSize = rest.size === 'xs' ? 'xs' : 's';
+
+    return (
+        <TextField
+            {...rest}
+            enumerationType="chip"
+            value={text}
+            contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
+            contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
+            view={view}
+            onChange={(e) => {
+                setText(e.target.value);
+                onChange(e.target.value);
+            }}
+            onFocus={onFocus}
+            onBlur={onBlur}
+            onChangeChips={onChipsChange}
+        />
+    );
+};
+
+export const Chips: StoryObj<StoryPropsChips> = {
     args: {
         ...Default.args,
-        enumerationType: 'chip',
-        values: ['1 value', '2 value', '3 value', '4 value'],
+        chips: ['1 value', '2 value', '3 value', '4 value'],
     },
-    render: (args) => <StoryDemo {...args} />,
+    render: (args) => <StoryChips {...args} />,
 };

package/styled-components/cjs/examples/sds_engineer/components/TextField/TextField.stories.tsx

@@ -11,10 +11,10 @@ const onChange = action('onChange');
 const onFocus = action('onFocus');
 const onBlur = action('onBlur');
 const onSearch = action('onSearch');
+const onChipsChange = action('onChipsChange');
 
 const sizes = ['l', 'm', 's', 'xs'];
 const views = ['default', 'positive', 'warning', 'negative'];
-const enumerationTypes = ['plain', 'chip'];
 const labelPlacements = ['outer', 'inner'];
 
 const meta: Meta<typeof TextField> = {
@@ -39,12 +39,6 @@ const meta: Meta<typeof TextField> = {
                 type: 'inline-radio',
             },
         },
-        enumerationType: {
-            options: enumerationTypes,
-            control: {
-                type: 'select',
-            },
-        },
         size: {
             options: sizes,
             control: {
@@ -72,6 +66,9 @@ type StoryPropsDefault = Omit<
     | 'maxLength'
     | 'minLength'
     | 'required'
+    | 'enumerationType'
+    | 'chips'
+    | 'onChangeChips'
 > & {
     'storybook:contentLeft': boolean;
     'storybook:contentRight': boolean;
@@ -90,6 +87,7 @@ const StoryDemo = ({
     return (
         <TextField
             {...rest}
+            enumerationType="plain"
             value={text}
             contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
             contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
@@ -114,7 +112,6 @@ export const Default: StoryObj<StoryPropsDefault> = {
         labelPlacement: 'outer',
         placeholder: 'Заполните поле',
         leftHelper: 'Подсказка к полю',
-        enumerationType: 'plain',
         disabled: false,
         readOnly: false,
         'storybook:contentLeft': true,
@@ -123,11 +120,62 @@ export const Default: StoryObj<StoryPropsDefault> = {
     render: (args) => <StoryDemo {...args} />,
 };
 
-export const Chips: StoryObj<StoryPropsDefault> = {
+type StoryPropsChips = Omit<
+    ComponentProps<typeof TextField>,
+    | 'helperBlock'
+    | 'contentLeft'
+    | 'htmlSize'
+    | 'contentRight'
+    | 'type'
+    | 'name'
+    | 'onFocus'
+    | 'onBlur'
+    | 'onChange'
+    | 'onSearch'
+    | 'value'
+    | 'checked'
+    | 'maxLength'
+    | 'minLength'
+    | 'required'
+    | 'enumerationType'
+> & {
+    'storybook:contentLeft': boolean;
+    'storybook:contentRight': boolean;
+};
+
+const StoryChips = ({
+    'storybook:contentLeft': enableContentLeft,
+    'storybook:contentRight': enableContentRight,
+    view,
+    ...rest
+}: StoryPropsChips) => {
+    const [text, setText] = useState('Значение поля');
+
+    const iconSize = rest.size === 'xs' ? 'xs' : 's';
+
+    return (
+        <TextField
+            {...rest}
+            enumerationType="chip"
+            value={text}
+            contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
+            contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
+            view={view}
+            onChange={(e) => {
+                setText(e.target.value);
+                onChange(e.target.value);
+            }}
+            onFocus={onFocus}
+            onBlur={onBlur}
+            onChangeChips={onChipsChange}
+        />
+    );
+};
+
+export const Chips: StoryObj<StoryPropsChips> = {
     args: {
         ...Default.args,
-        enumerationType: 'chip',
-        values: ['1 value', '2 value', '3 value', '4 value'],
+        chips: ['1 value', '2 value', '3 value', '4 value'],
     },
-    render: (args) => <StoryDemo {...args} />,
+    render: (args) => <StoryChips {...args} />,
 };

package/styled-components/es/components/Cell/Cell.js

@@ -24,6 +24,8 @@ export var cellRoot = function cellRoot(Root) {
       _ref$stretching = _ref.stretching,
       stretching = _ref$stretching === void 0 ? 'filled' : _ref$stretching;
     var stretchingClass = classes["".concat(stretching, "Stretching")];
+
+    // Импорт  старых свойств
     var titleText = title || description;
     var contentLeftDeprecated = contentLeft || content;
     return /*#__PURE__*/React.createElement(Root, {

package/styled-components/es/components/TextField/TextField.js

@@ -1,4 +1,4 @@
-var _excluded = ["id", "contentLeft", "contentRight", "label", "labelPlacement", "placeholder", "leftHelper", "enumerationType", "view", "size", "readOnly", "disabled", "values", "onChange", "onChangeChips", "onSearch"];
+var _excluded = ["id", "contentLeft", "contentRight", "label", "labelPlacement", "placeholder", "leftHelper", "enumerationType", "view", "size", "readOnly", "disabled", "chips", "onChange", "onChangeChips", "onSearch"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -39,7 +39,7 @@ export var textFieldRoot = function textFieldRoot(Root) {
       readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      values = _ref.values,
+      values = _ref.chips,
       onChange = _ref.onChange,
       onChangeChips = _ref.onChangeChips,
       onSearch = _ref.onSearch,
@@ -155,20 +155,20 @@ export var textFieldRoot = function textFieldRoot(Root) {
       var chipId = _ref2.id,
         text = _ref2.text;
       return /*#__PURE__*/React.createElement(TextFieldChip, {
+        id: chipId,
         ref: function ref(element) {
           return getRef(element, index);
         },
-        chipId: chipId,
         key: "".concat(chipId, "_").concat(index),
         disabled: disabled,
         readOnly: readOnly,
         value: text,
         text: text,
         onKeyDown: function onKeyDown(event) {
-          return handleChipKeyDown(event, chipId);
+          return handleChipKeyDown(event, chipId, index);
         },
         onClear: function onClear() {
-          return onChipClear(chipId);
+          return onChipClear(chipId, index);
         },
         onClick: onChipClick
       });