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

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

@@ -0,0 +1,131 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+
+var Keys = {
+  Enter: 'Enter',
+  Tab: 'Tab',
+  Escape: 'Escape',
+  ArrowLeft: 'ArrowLeft',
+  ArrowRight: 'ArrowRight',
+  Backspace: 'Backspace'
+};
+var useKeyNavigation = function useKeyNavigation(_ref) {
+  var _ref$controlledRefs = _ref.controlledRefs,
+    chipsRefs = _ref$controlledRefs.chipsRefs,
+    contentRef = _ref$controlledRefs.contentRef,
+    inputRef = _ref$controlledRefs.inputRef,
+    disabled = _ref.disabled,
+    readOnly = _ref.readOnly,
+    chips = _ref.chips,
+    enumerationType = _ref.enumerationType,
+    updateChips = _ref.updateChips,
+    onChange = _ref.onChange,
+    onSearch = _ref.onSearch;
+  var _useState = React.useState(-1),
+    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
+    activeChipIndex = _useState2[0],
+    setActiveChipIndex = _useState2[1];
+  var handleInputKeydown = function handleInputKeydown(event) {
+    var _inputRef$current;
+    var _ref2 = event.target,
+      value = _ref2.value;
+    if (disabled || readOnly) {
+      return;
+    }
+    if (event.key === Keys.Enter && enumerationType === 'chip' && value) {
+      var nextIndex = (chips === null || chips === void 0 ? void 0 : chips.length) || 0;
+      var newChips = [].concat(_rollupPluginBabelHelpers.toConsumableArray(chips), [{
+        id: "".concat(nextIndex, "_").concat(value),
+        text: value
+      }]);
+      var newValues = newChips.map(function (_ref3) {
+        var text = _ref3.text;
+        return text;
+      });
+      updateChips(newChips, newValues);
+      event.target.value = '';
+      onChange === null || onChange === void 0 ? void 0 : onChange(event);
+    }
+    if (event.key === Keys.Enter && onSearch) {
+      onSearch(value, event);
+    }
+    if (event.key === Keys.Backspace && chips.length && (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.selectionStart) === 0) {
+      var _newChips = _rollupPluginBabelHelpers.toConsumableArray(chips);
+      _newChips === null || _newChips === void 0 ? void 0 : _newChips.pop();
+      chipsRefs === null || chipsRefs === void 0 ? void 0 : chipsRefs.current.pop();
+      var _newValues = _newChips.map(function (_ref4) {
+        var text = _ref4.text;
+        return text;
+      });
+      updateChips(_newChips, _newValues);
+    }
+  };
+  var onChipClear = function onChipClear(clearId) {
+    if (!chips.length) {
+      return;
+    }
+    var newChips = (chips === null || chips === void 0 ? void 0 : chips.filter(function (_ref5) {
+      var chipId = _ref5.id;
+      return chipId !== clearId;
+    })) || [];
+    var newValues = newChips.map(function (_ref6) {
+      var text = _ref6.text;
+      return text;
+    });
+    updateChips(newChips, newValues);
+  };
+  var handleChipKeyDown = function handleChipKeyDown(event, chipId) {
+    if (event.key === Keys.Tab) {
+      event.preventDefault();
+    }
+    if (event.key === Keys.Backspace) {
+      onChipClear(chipId);
+    }
+  };
+  var handleContentKeyDown = function handleContentKeyDown(event) {
+    var _inputRef$current2, _focusedItem, _focusedItem2;
+    var chipsRefsCount = chips.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;
+    if (event.key === Keys.ArrowLeft && enumerationType === 'chip' && currentCaretPosition <= 0) {
+      var _chipsRefs$current;
+      var index = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;
+      newActiveChipIndex = document.activeElement === (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) ? chipsRefsCount - 1 : index;
+      focusedItem = (_chipsRefs$current = chipsRefs.current) === null || _chipsRefs$current === void 0 ? void 0 : _chipsRefs$current[newActiveChipIndex];
+    }
+    if (event.key === Keys.ArrowRight && enumerationType === 'chip' && document.activeElement !== (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current)) {
+      var _chipsRefs$current2;
+      var _index = activeChipIndex + 1 >= chipsRefsCount ? activeChipIndex : activeChipIndex + 1;
+      newActiveChipIndex = document.activeElement === (contentRef === null || contentRef === void 0 ? void 0 : contentRef.current) ? 0 : _index;
+      focusedItem = _index === activeChipIndex ? inputRef === null || inputRef === void 0 ? void 0 : inputRef.current : (_chipsRefs$current2 = chipsRefs.current) === null || _chipsRefs$current2 === void 0 ? void 0 : _chipsRefs$current2[newActiveChipIndex];
+    }
+    if (event.key === Keys.Backspace && document.activeElement !== (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current)) {
+      var _chipsRefs$current3;
+      var _index2 = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;
+      newActiveChipIndex = chipsRefsCount === 0 ? -1 : _index2;
+      focusedItem = chipsRefsCount === 0 ? inputRef === null || inputRef === void 0 ? void 0 : inputRef.current : chipsRefs === null || chipsRefs === void 0 ? void 0 : (_chipsRefs$current3 = chipsRefs.current) === null || _chipsRefs$current3 === void 0 ? void 0 : _chipsRefs$current3[newActiveChipIndex];
+    }
+    (_focusedItem = focusedItem) === null || _focusedItem === void 0 ? void 0 : _focusedItem.focus();
+    (_focusedItem2 = focusedItem) === null || _focusedItem2 === void 0 ? void 0 : _focusedItem2.scrollIntoView({
+      behavior: 'smooth',
+      block: 'center',
+      inline: 'center'
+    });
+    setActiveChipIndex(newActiveChipIndex);
+  };
+  return {
+    handleInputKeydown: handleInputKeydown,
+    handleChipKeyDown: handleChipKeyDown,
+    onChipClear: onChipClear,
+    handleContentKeyDown: handleContentKeyDown
+  };
+};
+
+exports.Keys = Keys;
+exports.useKeyNavigation = useKeyNavigation;
+//# sourceMappingURL=useKeyNavigation.js.map

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

@@ -0,0 +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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"}

package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.css

@@ -0,0 +1,19 @@
+.IconRoot_7pl7ig_svvlqhf__32c458a1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:var(--svvlqhf-0);height:var(--svvlqhf-0);-webkit-flex:0 0 var(--svvlqhf-0);-ms-flex:0 0 var(--svvlqhf-0);flex:0 0 var(--svvlqhf-0);}
+
+.base_1lwlv7t_b13tc97x__334a4e59{color:var(--plasma-chip-color);background-color:var(--plasma-chip-background);}.base_1lwlv7t_b13tc97x__334a4e59:hover{color:var(--plasma-chip-color-hover);background-color:var(--plasma-chip-background-hover);scale:var(--plasma-chip-scale-hover);}.base_1lwlv7t_b13tc97x__334a4e59:active{color:var(--plasma-chip-color-active);background-color:var(--plasma-chip-background-active);scale:var(--plasma-chip-scale-active);}
+
+.base_fcgkys_b1pde8v1__0b4d127a{font-family:var(--plasma-chip-font-family);font-size:var(--plasma-chip-font-size);font-style:var(--plasma-chip-font-style);font-weight:var(--plasma-chip-font-weight);-webkit-letter-spacing:var(--plasma-chip-letter-spacing);-moz-letter-spacing:var(--plasma-chip-letter-spacing);-ms-letter-spacing:var(--plasma-chip-letter-spacing);letter-spacing:var(--plasma-chip-letter-spacing);line-height:var(--plasma-chip-lineheight);border-radius:var(--plasma-chip-border-radius);width:var(--plasma-chip-width);height:var(--plasma-chip-height);padding-top:var(--plasma-chip-padding-top);padding-right:var(--plasma-chip-padding-right);padding-bottom:var(--plasma-chip-padding-bottom);padding-left:var(--plasma-chip-padding-left);}.base_fcgkys_b1pde8v1__0b4d127a:hover{scale:var(--plasma-chip-scale-hover);}.base_fcgkys_b1pde8v1__0b4d127a:active{scale:var(--plasma-chip-scale-active);}
+
+.base_rmcs0j_b16ulzzx__f8cae226[disabled]{opacity:var(--plasma-chip-disabled-opacity);cursor:not-allowed;}.base_rmcs0j_b16ulzzx__f8cae226[disabled]:hover,.base_rmcs0j_b16ulzzx__f8cae226[disabled]:active{scale:none;color:var(--plasma-chip-color);background-color:var(--plasma-chip-background);}
+
+.base_1nfit77_b10y1phq__6aaec899[readonly]{color:var(--plasma-chip-color-readonly);background-color:var(--plasma-chip-background-readonly);}.base_1nfit77_b10y1phq__6aaec899[readonly]:hover,.base_1nfit77_b10y1phq__6aaec899[readonly]:active{scale:none;cursor:default;color:var(--plasma-chip-color-readonly-hover);background-color:var(--plasma-chip-background-readonly-hover);}
+
+.base_kgtz8x_b16hf96__46a206b1{--plasma_private-chip-outline-size:var(--plasma-chip-outline-size,0.125rem);position:relative;}.base_kgtz8x_b16hf96__46a206b1:focus{outline:none;}.base_kgtz8x_b16hf96__46a206b1::before{content:'';position:absolute;top:calc(-1 * var(--plasma_private-chip-outline-size));left:calc(-1 * var(--plasma_private-chip-outline-size));right:calc(-1 * var(--plasma_private-chip-outline-size));bottom:calc(-1 * var(--plasma_private-chip-outline-size));z-index:1;display:block;box-sizing:content-box;border:var(--plasma_private-chip-outline-size) solid transparent;border-radius:calc(var(--plasma-chip-border-radius) + var(--plasma_private-chip-outline-size));-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.base_kgtz8x_b16hf96__46a206b1.base_kgtz8x_focusVisible__46a206b1:focus::before,.base_kgtz8x_b16hf96__46a206b1[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 var(--plasma_private-chip-outline-size) var(--plasma-chip-focus-color);}
+
+.Chip_styles_1mwwhiw_bol5daj__07da4d18{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);}
+.Chip_styles_1mwwhiw_sj20on5__07da4d18{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-left:var(--plasma-chip-left-content-margin-left);margin-right:var(--plasma-chip-left-content-margin-right);}
+.Chip_styles_1mwwhiw_s1ror4o9__07da4d18{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
+.Chip_styles_1mwwhiw_swddmyi__07da4d18{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-left:var(--plasma-chip-right-content-margin-left);margin-right:var(--plasma-chip-right-content-margin-right);}
+.Chip_styles_1mwwhiw_s1pcflhj__07da4d18{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-left:var(--plasma-chip-clear-content-margin-left);margin-right:var(--plasma-chip-clear-content-margin-right);color:var(--plasma-chip-close-icon-color);}
+
+.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676{--plasma-chip-color:var(--plasma-textfield__chip-color);--plasma-chip-background:var(--plasma-textfield__chip-background);--plasma-chip-color-hover:var(--plasma-textfield__chip-color-hover);--plasma-chip-background-hover:var(--plasma-textfield__chip-background-hover);--plasma-chip-color-active:var(--plasma-textfield__chip-color-active);--plasma-chip-background-active:var(--plasma-textfield__chip-background-active);--plasma-chip-background-readonly:var(--plasma-textfield__chip-background-readonly);--plasma-chip-color-readonly:var(--plasma-textfield__chip-color-readonly);--plasma-chip-background-readonly-hover:var(--plasma-textfield__chip-background-readonly-hover);--plasma-chip-color-readonly-hover:var(--plasma-textfield__chip-color-readonly-hover);--plasma-chip-border-radius:var(--plasma-textfield__chip-border-radius);--plasma-chip-width:var(--plasma-textfield__chip-width);--plasma-chip-height:var(--plasma-textfield__chip-height);--plasma-chip-padding-right:var(--plasma-textfield__chip-padding-right);--plasma-chip-padding-left:var(--plasma-textfield__chip-padding-left);--plasma-chip-font-family:var(--plasma-textfield__chip-font-family);--plasma-chip-font-size:var(--plasma-textfield__chip-font-size);--plasma-chip-font-style:var(--plasma-textfield__chip-font-style);--plasma-chip-font-weight:var(--plasma-textfield__chip-font-weight);--plasma-chip-letter-spacing:var(--plasma-textfield__chip-letter-spacing);--plasma-chip-lineheight:var(--plasma-textfield__chip-line-height);--plasma-chip-clear-content-margin-left:var(--plasma-textfield__chip-clear-content-margin-left);--plasma-chip-clear-content-margin-right:var(--plasma-textfield__chip-clear-content-margin-right);--plasma-chip-scale-hover:var(--plasma-textfield__chip-scale-hover);--plasma-chip-scale-active:var(--plasma-textfield__chip-scale-active);--plasma-chip-close-icon-size:var(--plasma-textfield__chip-close-icon-size);--plasma-chip-close-icon-color:var(--plasma-textfield__chip-close-icon-color);--plasma-chip-focus-color:var(--plasma-textfield-focus-color);-webkit-scroll-snap-align:center;-moz-scroll-snap-align:center;-ms-scroll-snap-align:center;scroll-snap-align:center;-webkit-scroll-snap-stop:normal;-moz-scroll-snap-stop:normal;-ms-scroll-snap-stop:normal;scroll-snap-stop:normal;position:relative;}.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676::before{content:'';position:absolute;top:0.0625rem;left:0.0625rem;right:0.0625rem;bottom:0.0625rem;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:calc(var(--plasma-textfield__chip-border-radius) - 0.1rem);-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676.TextFieldChip_styles_1y8n7la_focusVisible__8f291676:focus::before,.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.0625rem var(--plasma-textfield-focus-color);}.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676[readonly]{opacity:var(--plasma-textfield__chip-opacity-readonly);}

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

@@ -0,0 +1,38 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var TextFieldChip_styles = require('./TextFieldChip.styles.js');
+
+/**
+ * Чип, отображающий выбранный элемент
+ */
+var TextFieldChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var chipId = _ref.chipId,
+    text = _ref.text,
+    disabled = _ref.disabled,
+    readOnly = _ref.readOnly,
+    onClick = _ref.onClick,
+    onClear = _ref.onClear,
+    onKeyDown = _ref.onKeyDown;
+  var onClearHandle = function onClearHandle() {
+    return onClear(chipId);
+  };
+  var onKeyDownHandle = function onKeyDownHandle(event) {
+    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event, chipId);
+  };
+  return /*#__PURE__*/React.createElement(TextFieldChip_styles.StyledChip, {
+    ref: ref,
+    tabIndex: -1,
+    disabled: disabled,
+    readOnly: readOnly,
+    onClick: onClick,
+    onClear: onClearHandle,
+    onKeyDown: onKeyDownHandle,
+    text: "".concat(text)
+  });
+});
+
+exports.TextFieldChip = TextFieldChip;
+//# sourceMappingURL=TextFieldChip.js.map

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

@@ -0,0 +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,gBAAU,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,+BAAU,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/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js

@@ -0,0 +1,26 @@
+import './TextFieldChip.styles_1y8n7la.css';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('@linaria/react');
+var Chip$1 = require('../../../Chip/Chip.js');
+require('@linaria/core');
+var common = require('../../../../engines/common.js');
+
+// issue #823
+var mergedConfig = /*#__PURE__*/common.mergeConfig(Chip$1.chipConfig);
+var Chip = /*#__PURE__*/common.component(mergedConfig);
+
+// NOTE: Необходимое переопределение токенов из компонента Chip т.к. используются его части
+var _exp = function _exp() {
+  return Chip;
+};
+var StyledChip = /*#__PURE__*/react.styled(_exp())({
+  name: "StyledChip",
+  "class": "s32p7ut",
+  propsAsIs: true
+});
+
+exports.StyledChip = StyledChip;
+//# sourceMappingURL=TextFieldChip.styles.js.map

package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextFieldChip.styles.js","sources":["../../../../../src/components/TextField/ui/TextFieldChip/TextFieldChip.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { chipConfig, chipTokens } from '../../../Chip';\nimport { component, mergeConfig } from '../../../../engines';\nimport { tokens } from '../../TextField.tokens';\nimport { addFocus } from '../../../../mixins';\n\n// issue #823\nconst mergedConfig = mergeConfig(chipConfig);\nconst Chip = component(mergedConfig);\n\n// NOTE: Необходимое переопределение токенов из компонента Chip т.к. используются его части\nexport const StyledChip = styled(Chip)`\n    ${chipTokens.color}: var(${tokens.chipColor});\n    ${chipTokens.background}: var(${tokens.chipBackground});\n    ${chipTokens.colorHover}: var(${tokens.chipColorHover});\n    ${chipTokens.backgroundHover}: var(${tokens.chipBackgroundHover});\n    ${chipTokens.colorActive}: var(${tokens.chipColorActive});\n    ${chipTokens.backgroundActive}: var(${tokens.chipBackgroundActive});\n    ${chipTokens.backgroundReadOnly}: var(${tokens.chipBackgroundReadOnly});\n    ${chipTokens.colorReadOnly}: var(${tokens.chipColorReadOnly});\n    ${chipTokens.backgroundReadOnlyHover}: var(${tokens.chipBackgroundReadOnlyHover});\n    ${chipTokens.colorReadOnlyHover}: var(${tokens.chipColorReadOnlyHover});\n    ${chipTokens.borderRadius}: var(${tokens.chipBorderRadius});\n    ${chipTokens.width}: var(${tokens.chipWidth});\n    ${chipTokens.height}: var(${tokens.chipHeight});\n    ${chipTokens.paddingRight}: var(${tokens.chipPaddingRight});\n    ${chipTokens.paddingLeft}: var(${tokens.chipPaddingLeft});\n    ${chipTokens.fontFamily}: var(${tokens.chipFontFamily});\n    ${chipTokens.fontSize}: var(${tokens.chipFontSize});\n    ${chipTokens.fontStyle}: var(${tokens.chipFontStyle});\n    ${chipTokens.fontWeight}: var(${tokens.chipFontWeight});\n    ${chipTokens.letterSpacing}: var(${tokens.chipLetterSpacing});\n    ${chipTokens.lineHeight}: var(${tokens.chipLineHeight});\n    ${chipTokens.clearContentMarginLeft}: var(${tokens.chipClearContentMarginLeft});\n    ${chipTokens.clearContentMarginRight}: var(${tokens.chipClearContentMarginRight});\n    ${chipTokens.scaleHover}: var(${tokens.chipScaleHover});\n    ${chipTokens.scaleActive}: var(${tokens.chipScaleActive});\n    ${chipTokens.closeIconSize}: var(${tokens.chipCloseIconSize});\n    ${chipTokens.closeIconColor}: var(${tokens.chipCloseIconColor});\n    ${chipTokens.focusColor}: var(${tokens.focusColor});\n\n    scroll-snap-align: center;\n    scroll-snap-stop: normal;\n\n    ${addFocus({\n        outlineOffset: '0.0625rem',\n        outlineSize: '0.0625rem',\n        outlineRadius: `calc(var(${tokens.chipBorderRadius}) - 0.1rem)`,\n        outlineColor: `var(${tokens.focusColor})`,\n    })}\n\n    &[readonly] {\n        opacity: var(${tokens.chipOpacityReadonly});\n    }\n`;\n"],"names":["mergedConfig","mergeConfig","chipConfig","Chip","component","_exp","StyledChip","styled","name","class","propsAsIs"],"mappings":";;;;;;;;;AAOA;AACA,IAAMA,YAAY,gBAAGC,kBAAW,CAACC,iBAAU,CAAC,CAAA;AAC5C,IAAMC,IAAI,gBAAGC,gBAAS,CAACJ,YAAY,CAAC,CAAA;;AAEpC;AAAA,IAAAK,IAAA,GAVkBA,SAUlBA,IAAAA,GAAA;AAAA,EAAA,OACiCF,IAAI,CAAA;AAAA,CAAA,CAAA;AAA9B,IAAMG,UAAU,gBAAGC,YAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CA2C/B;;;;"}

package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles_1y8n7la.css

@@ -0,0 +1 @@
+.s32p7ut{--plasma-chip-color:var(--plasma-textfield__chip-color);--plasma-chip-background:var(--plasma-textfield__chip-background);--plasma-chip-color-hover:var(--plasma-textfield__chip-color-hover);--plasma-chip-background-hover:var(--plasma-textfield__chip-background-hover);--plasma-chip-color-active:var(--plasma-textfield__chip-color-active);--plasma-chip-background-active:var(--plasma-textfield__chip-background-active);--plasma-chip-background-readonly:var(--plasma-textfield__chip-background-readonly);--plasma-chip-color-readonly:var(--plasma-textfield__chip-color-readonly);--plasma-chip-background-readonly-hover:var(--plasma-textfield__chip-background-readonly-hover);--plasma-chip-color-readonly-hover:var(--plasma-textfield__chip-color-readonly-hover);--plasma-chip-border-radius:var(--plasma-textfield__chip-border-radius);--plasma-chip-width:var(--plasma-textfield__chip-width);--plasma-chip-height:var(--plasma-textfield__chip-height);--plasma-chip-padding-right:var(--plasma-textfield__chip-padding-right);--plasma-chip-padding-left:var(--plasma-textfield__chip-padding-left);--plasma-chip-font-family:var(--plasma-textfield__chip-font-family);--plasma-chip-font-size:var(--plasma-textfield__chip-font-size);--plasma-chip-font-style:var(--plasma-textfield__chip-font-style);--plasma-chip-font-weight:var(--plasma-textfield__chip-font-weight);--plasma-chip-letter-spacing:var(--plasma-textfield__chip-letter-spacing);--plasma-chip-lineheight:var(--plasma-textfield__chip-line-height);--plasma-chip-clear-content-margin-left:var(--plasma-textfield__chip-clear-content-margin-left);--plasma-chip-clear-content-margin-right:var(--plasma-textfield__chip-clear-content-margin-right);--plasma-chip-scale-hover:var(--plasma-textfield__chip-scale-hover);--plasma-chip-scale-active:var(--plasma-textfield__chip-scale-active);--plasma-chip-close-icon-size:var(--plasma-textfield__chip-close-icon-size);--plasma-chip-close-icon-color:var(--plasma-textfield__chip-close-icon-color);--plasma-chip-focus-color:var(--plasma-textfield-focus-color);-webkit-scroll-snap-align:center;-moz-scroll-snap-align:center;-ms-scroll-snap-align:center;scroll-snap-align:center;-webkit-scroll-snap-stop:normal;-moz-scroll-snap-stop:normal;-ms-scroll-snap-stop:normal;scroll-snap-stop:normal;position:relative;}.s32p7ut::before{content:'';position:absolute;top:0.0625rem;left:0.0625rem;right:0.0625rem;bottom:0.0625rem;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:calc(var(--plasma-textfield__chip-border-radius) - 0.1rem);-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.s32p7ut.focus-visible:focus::before,.s32p7ut[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.0625rem var(--plasma-textfield-focus-color);}.s32p7ut[readonly]{opacity:var(--plasma-textfield__chip-opacity-readonly);}

package/cjs/components/{Select/ui/SelectDivider/variations/_view → TextField/variations/_disabled}/base.js

@@ -1,9 +1,9 @@
-import './base_x642ct.css';
+import './base_1tnjoy9.css';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var base = "b10y928o";
+var base = "b15zsg4z";
 
 exports.base = base;
 //# sourceMappingURL=base.js.map

package/cjs/components/TextField/variations/_disabled/base.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.js","sources":["../../../../../src/components/TextField/variations/_disabled/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../../TextField.tokens';\nimport { Input } from '../../TextField.styles';\n\nexport const base = css`\n    &[disabled] {\n        opacity: var(${tokens.disabledOpacity});\n        cursor: not-allowed;\n\n        ${Input} {\n            cursor: not-allowed;\n            min-width: unset;\n        }\n    }\n`;\n"],"names":["base"],"mappings":";;;;AAKO,IAAMA,IAAI,GAUhB;;;;"}

package/cjs/components/TextField/variations/_disabled/base_1tnjoy9.css

@@ -0,0 +1 @@
+.b15zsg4z[disabled]{opacity:var(--plasma-textfield-disabled-opacity);cursor:not-allowed;}.b15zsg4z[disabled] .io4bpie{cursor:not-allowed;min-width:unset;}

package/cjs/components/TextField/{_label-placement → variations/_label-placement}/base.js

@@ -4,7 +4,7 @@ import './base_x642ct.css';
 Object.defineProperty(exports, '__esModule', { value: true });
 
 // TODO: REMOVE IT
-var base = "brbzvo9";
+var base = "b15d3bnf";
 
 exports.base = base;
 //# sourceMappingURL=base.js.map

package/cjs/components/TextField/variations/_label-placement/base.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.js","sources":["../../../../../src/components/TextField/variations/_label-placement/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\n// TODO: REMOVE IT\nexport const base = css``;\n"],"names":["base"],"mappings":";;;;AAEA;AACO,IAAMA,IAAI,GAAQ;;;;"}

package/cjs/components/TextField/{_label-placement → variations/_label-placement}/inner.js

@@ -1,9 +1,9 @@
-import './inner_1tyuicp.css';
+import './inner_gqlcj2.css';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var labelPlacement_inner = "l1mtiqfm";
+var labelPlacement_inner = "l8oinlg";
 
 exports.labelPlacement_inner = labelPlacement_inner;
 //# sourceMappingURL=inner.js.map

package/cjs/components/TextField/variations/_label-placement/inner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inner.js","sources":["../../../../../src/components/TextField/variations/_label-placement/inner.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { Input, Label } from '../../TextField.styles';\nimport { tokens } from '../../TextField.tokens';\n\nexport const labelPlacement_inner = css`\n    ${Input} {\n        padding: var(${tokens.contentLabelInnerPadding});\n    }\n\n    ${Input}:focus ~ ${Label}, ${Input}:not(:placeholder-shown) ~ ${Label} {\n        height: auto;\n        padding: var(${tokens.labelInnerPadding});\n\n        font-family: var(${tokens.labelInnerFontFamily});\n        font-size: var(${tokens.labelInnerFontSize});\n        font-style: var(${tokens.labelInnerFontStyle});\n        font-weight: var(${tokens.labelInnerFontWeight});\n        letter-spacing: var(${tokens.labelInnerLetterSpacing});\n        line-height: var(${tokens.labelInnerLineHeight});\n    }\n\n    ${Input}:not(:focus)::placeholder {\n        color: transparent;\n    }\n\n    ${Input}:focus::placeholder {\n        color: transparent;\n    }\n\n    ${Label} {\n        color: var(${tokens.placeholderColor});\n\n        pointer-events: none;\n        position: absolute;\n        top: 0;\n\n        display: flex;\n        align-items: center;\n\n        box-sizing: border-box;\n\n        transition: padding 0.1s ease-in-out, height 0s;\n\n        height: var(${tokens.height});\n\n        padding-top: calc(var(${tokens.height}) / 4);\n        padding-bottom: calc(var(${tokens.height}) / 4);\n    }\n`;\n"],"names":["labelPlacement_inner"],"mappings":";;;;AAKO,IAAMA,oBAAoB,GA4ChC;;;;"}

package/cjs/components/TextField/variations/_label-placement/inner_gqlcj2.css

@@ -0,0 +1 @@
+.l8oinlg .io4bpie{padding:var(--plasma-textfield-placement_inner__content-padding);}.l8oinlg .io4bpie:focus ~ .l13qvwoy,.l8oinlg .io4bpie:not(:placeholder-shown) ~ .l13qvwoy{height:auto;padding:var(--plasma-textfield-placement_inner__label-padding);font-family:var(--plasma-textfield-placement_inner__label-font-family);font-size:var(--plasma-textfield-placement_inner__label-font-size);font-style:var(--plasma-textfield-placement_inner__label-font-style);font-weight:var(--plasma-textfield-placement_inner__label-font-weight);-webkit-letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);-moz-letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);-ms-letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);line-height:var(--plasma-textfield-placement_inner__label-line-height);}.l8oinlg .io4bpie:not(:focus)::-webkit-input-placeholder{color:transparent;}.l8oinlg .io4bpie:not(:focus)::-moz-placeholder{color:transparent;}.l8oinlg .io4bpie:not(:focus):-ms-input-placeholder{color:transparent;}.l8oinlg .io4bpie:not(:focus)::placeholder{color:transparent;}.l8oinlg .io4bpie:focus::-webkit-input-placeholder{color:transparent;}.l8oinlg .io4bpie:focus::-moz-placeholder{color:transparent;}.l8oinlg .io4bpie:focus:-ms-input-placeholder{color:transparent;}.l8oinlg .io4bpie:focus::placeholder{color:transparent;}.l8oinlg .l13qvwoy{color:var(--plasma-textfield__placeholder-color);pointer-events:none;position:absolute;top:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;-webkit-transition:padding 0.1s ease-in-out,height 0s;transition:padding 0.1s ease-in-out,height 0s;height:var(--plasma-textfield-height);padding-top:calc(var(--plasma-textfield-height) / 4);padding-bottom:calc(var(--plasma-textfield-height) / 4);}

package/cjs/components/TextField/{_label-placement → variations/_label-placement}/outer.js

@@ -1,9 +1,9 @@
-import './outer_19ekaek.css';
+import './outer_is41nj.css';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var labelPlacement_outer = "l1fhg6i1";
+var labelPlacement_outer = "la46t0i";
 
 exports.labelPlacement_outer = labelPlacement_outer;
 //# sourceMappingURL=outer.js.map

package/cjs/components/TextField/variations/_label-placement/outer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"outer.js","sources":["../../../../../src/components/TextField/variations/_label-placement/outer.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { Label } from '../../TextField.styles';\nimport { tokens } from '../../TextField.tokens';\n\nexport const labelPlacement_outer = css`\n    ${Label} {\n        display: block;\n        margin-bottom: var(${tokens.labelOffset});\n        color: var(${tokens.labelColor});\n    }\n`;\n"],"names":["labelPlacement_outer"],"mappings":";;;;AAKO,IAAMA,oBAAoB,GAMhC;;;;"}

package/cjs/components/TextField/variations/_label-placement/outer_is41nj.css

@@ -0,0 +1 @@
+.la46t0i .l13qvwoy{display:block;margin-bottom:var(--plasma-textfield__label-offset);color:var(--plasma-textfield__label-color);}

package/cjs/components/{Select/ui/SelectFooter/variations/_size → TextField/variations/_read-only}/base.js

@@ -1,9 +1,9 @@
-import './base_x642ct.css';
+import './base_134hshp.css';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var base = "b111zkht";
+var base = "b1w985rt";
 
 exports.base = base;
 //# sourceMappingURL=base.js.map

package/cjs/components/TextField/variations/_read-only/base.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.js","sources":["../../../../../src/components/TextField/variations/_read-only/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../../TextField.tokens';\nimport { Input, InputWrapper, Label, LeftHelper } from '../../TextField.styles';\n\nexport const base = css`\n    &[readonly] {\n        ${InputWrapper} {\n            color: var(${tokens.colorReadOnly});\n            background-color: var(${String(tokens.backgroundColorReadOnly)});\n            box-shadow: inset 0 0 0 var(${String(tokens.borderWidth)}) var(${String(tokens.borderColorReadOnly)});\n        }\n\n        ${InputWrapper}:hover {\n            background-color: var(${tokens.backgroundColorReadOnly});\n        }\n\n        ${Input}::placeholder {\n            color: var(${tokens.placeholderColorReadOnly});\n        }\n\n        ${Input} {\n            color: var(${tokens.colorReadOnly});\n            cursor: default;\n            min-width: unset;\n        }\n\n        ${LeftHelper} {\n            color: var(${tokens.leftHelperColorReadOnly});\n        }\n\n        ${Label} {\n            color: var(${tokens.labelColorReadOnly});\n        }\n    }\n`;\n"],"names":["base"],"mappings":";;;;AAKO,IAAMA,IAAI,GA8BhB;;;;"}

package/cjs/components/TextField/variations/_read-only/base_134hshp.css

@@ -0,0 +1 @@
+.b1w985rt[readonly] .iq39zt5{color:var(--plasma-textfield-color-readonly);background-color:var(--plasma-textfield-bg-color-readonly);box-shadow:inset 0 0 0 var(--plasmas-textfield-border-width) var(--plasma-textfield-border-color-readonly);}.b1w985rt[readonly] .iq39zt5:hover{background-color:var(--plasma-textfield-bg-color-readonly);}.b1w985rt[readonly] .io4bpie::-webkit-input-placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.b1w985rt[readonly] .io4bpie::-moz-placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.b1w985rt[readonly] .io4bpie:-ms-input-placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.b1w985rt[readonly] .io4bpie::placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.b1w985rt[readonly] .io4bpie{color:var(--plasma-textfield-color-readonly);cursor:default;min-width:unset;}.b1w985rt[readonly] .llv9av6{color:var(--plasma-textfield__left-helper-color-readonly);}.b1w985rt[readonly] .l13qvwoy{color:var(--plasma-textfield__label-color-readonly);}

package/cjs/components/{Select/ui/SelectFooter/variations/_view → TextField/variations/_size}/base.js

@@ -1,9 +1,9 @@
-import './base_x642ct.css';
+import './base_1khzr9t.css';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var base = "bv1bcxd";
+var base = "b13ve66i";
 
 exports.base = base;
 //# sourceMappingURL=base.js.map

package/cjs/components/TextField/variations/_size/base.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.js","sources":["../../../../../src/components/TextField/variations/_size/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { classes, tokens } from '../../TextField.tokens';\nimport { Input, InputWrapper, Label, LeftHelper } from '../../TextField.styles';\n\nexport const base = css`\n    ${Input} {\n        font-family: var(${tokens.fontFamily});\n        font-size: var(${tokens.fontSize});\n        font-style: var(${tokens.fontStyle});\n        font-weight: var(${tokens.fontWeight});\n        letter-spacing: var(${tokens.letterSpacing});\n        line-height: var(${tokens.lineHeight});\n    }\n\n    ${InputWrapper} {\n        height: var(${tokens.height});\n        border-radius: var(${tokens.borderRadius});\n        padding: var(${tokens.padding});\n\n        &.${classes.hasChips} {\n            padding-top: var(${tokens.paddingWithChips});\n            padding-bottom: var(${tokens.paddingWithChips});\n        }\n\n        &.${classes.hasEmptyContentLeft} {\n            padding-left: var(${tokens.paddingWithChips});\n        }\n\n        &.${classes.hasEmptyContentRight} {\n            padding-right: var(${tokens.paddingWithChips});\n        }\n    }\n\n    ${Label} {\n        font-family: var(${tokens.labelFontFamily});\n        font-size: var(${tokens.labelFontSize});\n        font-style: var(${tokens.labelFontStyle});\n        font-weight: var(${tokens.labelFontWeight});\n        letter-spacing: var(${tokens.labelLetterSpacing});\n        line-height: var(${tokens.labelLineHeight});\n    }\n\n    ${LeftHelper} {\n        margin-top: var(${tokens.leftHelperOffset});\n\n        font-family: var(${tokens.leftHelperFontFamily});\n        font-size: var(${tokens.leftHelperFontSize});\n        font-style: var(${tokens.leftHelperFontStyle});\n        font-weight: var(${tokens.leftHelperFontWeight});\n        letter-spacing: var(${tokens.leftHelperLetterSpacing});\n        line-height: var(${tokens.leftHelperLineHeight});\n    }\n`;\n"],"names":["base"],"mappings":";;;;AAKO,IAAMA,IAAI,GAgDhB;;;;"}

package/cjs/components/TextField/variations/_size/base_1khzr9t.css

@@ -0,0 +1 @@
+.b13ve66i .io4bpie{font-family:var(--plasma-textfield-font-family);font-size:var(--plasma-textfield-font-size);font-style:var(--plasma-textfield-font-style);font-weight:var(--plasma-textfield-font-weight);-webkit-letter-spacing:var(--plasma-textfield-letter-spacing);-moz-letter-spacing:var(--plasma-textfield-letter-spacing);-ms-letter-spacing:var(--plasma-textfield-letter-spacing);letter-spacing:var(--plasma-textfield-letter-spacing);line-height:var(--plasma-textfield-line-height);}.b13ve66i .iq39zt5{height:var(--plasma-textfield-height);border-radius:var(--plasma-textfield-border-radius);padding:var(--plasma-textfield-padding);}.b13ve66i .iq39zt5.has-chips{padding-top:var(--plasma-textfield-padding-with-chips);padding-bottom:var(--plasma-textfield-padding-with-chips);}.b13ve66i .iq39zt5.has-empty-content-left{padding-left:var(--plasma-textfield-padding-with-chips);}.b13ve66i .iq39zt5.has-empty-content-right{padding-right:var(--plasma-textfield-padding-with-chips);}.b13ve66i .l13qvwoy{font-family:var(--plasma-textfield__label-font-family);font-size:var(--plasma-textfield__label-font-size);font-style:var(--plasma-textfield__label-font-style);font-weight:var(--plasma-textfield__label-font-weight);-webkit-letter-spacing:var(--plasma-textfield__label-letter-spacing);-moz-letter-spacing:var(--plasma-textfield__label-letter-spacing);-ms-letter-spacing:var(--plasma-textfield__label-letter-spacing);letter-spacing:var(--plasma-textfield__label-letter-spacing);line-height:var(--plasma-textfield__label-line-height);}.b13ve66i .llv9av6{margin-top:var(--plasma-textfield__left-helper-offset);font-family:var(--plasma-textfield__left-helper-font-family);font-size:var(--plasma-textfield__left-helper-font-size);font-style:var(--plasma-textfield__left-helper-font-style);font-weight:var(--plasma-textfield__left-helper-font-weight);-webkit-letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);-moz-letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);-ms-letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);line-height:var(--plasma-textfield__left-helper-line-height);}

package/cjs/components/{Select/ui/SelectDivider/variations/_size → TextField/variations/_view}/base.js

@@ -1,9 +1,9 @@
-import './base_x642ct.css';
+import './base_1qd77x6.css';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var base = "b1uzfyeu";
+var base = "bptx5xt";
 
 exports.base = base;
 //# sourceMappingURL=base.js.map

package/cjs/components/TextField/variations/_view/base.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.js","sources":["../../../../../src/components/TextField/variations/_view/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../../TextField.tokens';\nimport { Input, InputWrapper, LeftHelper } from '../../TextField.styles';\n\nexport const base = css`\n    ${InputWrapper} {\n        --plasma_private-textfield-border-color: var(${String(tokens.borderColor)});\n        --plasma_private-textfield-bg-color: var(${String(tokens.backgroundColor)});\n\n        color: var(${tokens.color});\n        background-color: var(--plasma_private-textfield-bg-color);\n        box-shadow: inset 0 0 0 var(${tokens.borderWidth}) var(--plasma_private-textfield-border-color);\n        caret-color: var(${tokens.caretColor});\n\n        transition: background-color 0.1s ease-in, color 0.1s ease-in, box-shadow 0.1s ease-in;\n    }\n    ${InputWrapper}:hover {\n        --plasma_private-textfield-border-color: var(${tokens.borderColorHover}, var(${String(tokens.borderColor)}));\n        --plasma_private-textfield-bg-color: var(\n            ${tokens.backgroundColorHover},\n            var(${String(tokens.backgroundColor)})\n        );\n    }\n    ${InputWrapper}:focus-within {\n        --plasma_private-textfield-border-color: var(${tokens.borderColorFocus}, var(${String(tokens.borderColor)}));\n        --plasma_private-textfield-bg-color: var(\n            ${tokens.backgroundColorFocus},\n            var(${String(tokens.backgroundColor)})\n        );\n    }\n    ${Input}::placeholder {\n        color: var(${tokens.placeholderColor});\n    }\n    ${Input} {\n        color: var(${tokens.color});\n    }\n    ${LeftHelper} {\n        color: var(${tokens.leftHelperColor});\n    }\n`;\n"],"names":["base"],"mappings":";;;;AAKO,IAAMA,IAAI,GAmChB;;;;"}

package/cjs/components/TextField/variations/_view/base_1qd77x6.css

@@ -0,0 +1 @@
+.bptx5xt .iq39zt5{--plasma_private-textfield-border-color:var(--plasma-textfield-border-color);--plasma_private-textfield-bg-color:var(--plasma-textfield-bg-color);color:var(--plasma-textfield-color);background-color:var(--plasma_private-textfield-bg-color);box-shadow:inset 0 0 0 var(--plasmas-textfield-border-width) var(--plasma_private-textfield-border-color);caret-color:var(--plasma-textfield__caret-color);-webkit-transition:background-color 0.1s ease-in,color 0.1s ease-in,box-shadow 0.1s ease-in;transition:background-color 0.1s ease-in,color 0.1s ease-in,box-shadow 0.1s ease-in;}.bptx5xt .iq39zt5:hover{--plasma_private-textfield-border-color:var(--plasma-textfield-border-color-hover,var(--plasma-textfield-border-color));--plasma_private-textfield-bg-color:var( --plasma-textfield-bg-color-hover, var(--plasma-textfield-bg-color) );}.bptx5xt .iq39zt5:focus-within{--plasma_private-textfield-border-color:var(--plasma-textfield-border-color-focus,var(--plasma-textfield-border-color));--plasma_private-textfield-bg-color:var( --plasma-textfield-bg-color-focus, var(--plasma-textfield-bg-color) );}.bptx5xt .io4bpie::-webkit-input-placeholder{color:var(--plasma-textfield__placeholder-color);}.bptx5xt .io4bpie::-moz-placeholder{color:var(--plasma-textfield__placeholder-color);}.bptx5xt .io4bpie:-ms-input-placeholder{color:var(--plasma-textfield__placeholder-color);}.bptx5xt .io4bpie::placeholder{color:var(--plasma-textfield__placeholder-color);}.bptx5xt .io4bpie{color:var(--plasma-textfield-color);}.bptx5xt .llv9av6{color:var(--plasma-textfield__left-helper-color);}