@salutejs/plasma-new-hope 0.69.0-canary.1155.8506197081.0 → 0.70.0-canary.1160.8541256541.0

package/cjs/components/TextField/TextField.js

@@ -1,4 +1,4 @@
-import './TextField_1lzb2r1.css';
+import './TextField_wctd2m.css';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -6,70 +6,190 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var plasmaCore = require('@salutejs/plasma-core');
-var base$2 = require('./_size/base.js');
-var base$1 = require('./_view/base.js');
-var base$3 = require('./_disabled/base.js');
-var base$4 = require('./_label-placement/base.js');
+var index = require('../../utils/index.js');
+var base$2 = require('./variations/_size/base.js');
+var base$1 = require('./variations/_view/base.js');
+var base$3 = require('./variations/_disabled/base.js');
+var base$4 = require('./variations/_read-only/base.js');
+var base$5 = require('./variations/_label-placement/base.js');
 var TextField_styles = require('./TextField.styles.js');
+var TextField_tokens = require('./TextField.tokens.js');
+var TextFieldChip = require('./ui/TextFieldChip/TextFieldChip.js');
+var useKeyNavigation = require('./hooks/useKeyNavigation.js');
 
-var _excluded = ["contentLeft", "contentRight", "children", "label", "labelPlacement", "placeholder", "leftHelper", "view", "size", "disabled", "onChange", "onSearch"];
+var _excluded = ["id", "contentLeft", "contentRight", "label", "labelPlacement", "placeholder", "leftHelper", "enumerationType", "view", "size", "readOnly", "disabled", "values", "onChange", "onChangeChips", "onSearch"];
 var base = "bpunezx";
 var textFieldRoot = function textFieldRoot(Root) {
   return /*#__PURE__*/React.forwardRef(function (props, ref) {
-    var contentLeft = props.contentLeft,
+    var id = props.id,
+      contentLeft = props.contentLeft,
       contentRight = props.contentRight,
       label = props.label,
       labelPlacement = props.labelPlacement,
       placeholder = props.placeholder,
       leftHelper = props.leftHelper,
+      _props$enumerationTyp = props.enumerationType,
+      enumerationType = _props$enumerationTyp === void 0 ? 'plain' : _props$enumerationTyp,
       view = props.view,
       size = props.size,
-      disabled = props.disabled,
+      _props$readOnly = props.readOnly,
+      readOnly = _props$readOnly === void 0 ? false : _props$readOnly,
+      _props$disabled = props.disabled,
+      disabled = _props$disabled === void 0 ? false : _props$disabled,
+      values = props.values,
       onChange = props.onChange,
+      onChangeChips = props.onChangeChips,
       onSearch = props.onSearch,
       rest = _rollupPluginBabelHelpers.objectWithoutProperties(props, _excluded);
+    var contentRef = React.useRef(null);
+    var inputRef = React.useRef(null);
+    var chipsRefs = React.useRef([]);
+    var controlledRefs = {
+      contentRef: contentRef,
+      inputRef: inputRef,
+      chipsRefs: chipsRefs
+    };
+    var _useState = React.useState([]),
+      _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
+      chips = _useState2[0],
+      setChips = _useState2[1];
+    var uniqId = plasmaCore.safeUseId();
+    var innerId = id || uniqId;
+    var labelId = plasmaCore.safeUseId();
+    var helperTextId = plasmaCore.safeUseId();
+    var isChipEnumeration = enumerationType === 'chip';
+    var hideLabel = (size === 'xs' || isChipEnumeration) && labelPlacement === 'inner';
+    var labelInside = size !== 'xs' && labelPlacement === 'inner';
+    var innerLabelPlacementValue = hideLabel ? 'outer' : labelPlacement;
+    var innerPlaceholderValue = hideLabel ? label : placeholder;
+    var innerLabelValue = hideLabel ? undefined : label;
+    var isChipsVisible = isChipEnumeration && (chips === null || chips === void 0 ? void 0 : chips.length);
+    var withHasChips = isChipsVisible ? TextField_tokens.classes.hasChips : undefined;
+    var wrapperWithoutLeftContent = !contentLeft && isChipsVisible ? TextField_tokens.classes.hasEmptyContentLeft : undefined;
+    var wrapperWithoutRightContent = !contentRight && isChipsVisible ? TextField_tokens.classes.hasEmptyContentRight : undefined;
     var handleChange = function handleChange(event) {
+      if (disabled || readOnly) {
+        return;
+      }
       var _event$target = event.target,
         maxLength = _event$target.maxLength,
         value = _event$target.value;
-      if (!onChange || maxLength !== -1 && value.length > maxLength) {
+      if (maxLength !== -1 && value.length > maxLength) {
         return;
       }
-      onChange(event);
+      onChange === null || onChange === void 0 ? void 0 : onChange(event);
     };
-    var handleKeyUp = function handleKeyUp(event) {
-      if (event.key === 'Enter' && onSearch) {
-        onSearch(event.target.value, event);
+    var updateChips = function updateChips(newChips, newValues) {
+      setChips(newChips);
+      onChangeChips === null || onChangeChips === void 0 ? void 0 : onChangeChips(newValues);
+    };
+    var _useKeyNavigation = useKeyNavigation.useKeyNavigation({
+        controlledRefs: controlledRefs,
+        disabled: disabled,
+        readOnly: readOnly,
+        chips: chips,
+        enumerationType: enumerationType,
+        updateChips: updateChips,
+        onSearch: onSearch,
+        onChange: onChange
+      }),
+      handleInputKeydown = _useKeyNavigation.handleInputKeydown,
+      handleChipKeyDown = _useKeyNavigation.handleChipKeyDown,
+      onChipClear = _useKeyNavigation.onChipClear,
+      handleContentKeyDown = _useKeyNavigation.handleContentKeyDown;
+    var onChipClick = function onChipClick(event) {
+      return event.stopPropagation();
+    };
+    var handleInputFocus = function handleInputFocus() {
+      if (readOnly || disabled || !(inputRef !== null && inputRef !== void 0 && inputRef.current)) {
+        return;
       }
+      inputRef.current.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center',
+        inline: 'center'
+      });
+      inputRef.current.focus({
+        preventScroll: true
+      });
     };
-    var labelInside = labelPlacement === 'inner';
-    var lableId = plasmaCore.safeUseId();
-    var helperTextId = plasmaCore.safeUseId();
+    var getRef = function getRef(element, index) {
+      if (element && chipsRefs !== null && chipsRefs !== void 0 && chipsRefs.current) {
+        chipsRefs.current[index] = element;
+      }
+    };
+    React.useEffect(function () {
+      if (!isChipEnumeration && !(values !== null && values !== void 0 && values.length)) {
+        return;
+      }
+      var newChips = (values === null || values === void 0 ? void 0 : values.map(function (value, index) {
+        return {
+          id: "".concat(index, "_").concat(value),
+          text: value
+        };
+      })) || [];
+      setChips(newChips);
+    }, [isChipEnumeration, values]);
     return /*#__PURE__*/React.createElement(Root, {
+      ref: ref,
       view: view,
       size: size,
       disabled: disabled,
-      labelPlacement: labelPlacement
-    }, labelInside || label && /*#__PURE__*/React.createElement(TextField_styles.Label, {
-      id: lableId
-    }, label), /*#__PURE__*/React.createElement(TextField_styles.InputWrapper, null, contentLeft, /*#__PURE__*/React.createElement(TextField_styles.InputLabelWrapper, null, /*#__PURE__*/React.createElement(TextField_styles.Input, _rollupPluginBabelHelpers.extends({}, rest, {
-      ref: ref,
-      "aria-labelledby": lableId,
+      readOnly: !disabled && readOnly,
+      labelPlacement: innerLabelPlacementValue,
+      onClick: handleInputFocus
+    }, labelInside || innerLabelValue && /*#__PURE__*/React.createElement(TextField_styles.Label, {
+      id: labelId,
+      htmlFor: id
+    }, innerLabelValue), /*#__PURE__*/React.createElement(TextField_styles.InputWrapper, {
+      className: index.cx(withHasChips, wrapperWithoutLeftContent, wrapperWithoutRightContent)
+    }, contentLeft && /*#__PURE__*/React.createElement(TextField_styles.StyledContentLeft, null, contentLeft), /*#__PURE__*/React.createElement(TextField_styles.InputLabelWrapper, {
+      tabIndex: -1,
+      ref: contentRef,
+      onKeyDown: handleContentKeyDown,
+      className: withHasChips
+    }, isChipEnumeration && Boolean(chips === null || chips === void 0 ? void 0 : chips.length) && /*#__PURE__*/React.createElement(TextField_styles.StyledChips, null, chips === null || chips === void 0 ? void 0 : chips.map(function (_ref, index) {
+      var chipId = _ref.id,
+        text = _ref.text;
+      return /*#__PURE__*/React.createElement(TextFieldChip.TextFieldChip, {
+        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);
+        },
+        onClear: function onClear() {
+          return onChipClear(chipId);
+        },
+        onClick: onChipClick
+      });
+    })), /*#__PURE__*/React.createElement(TextField_styles.Input, _rollupPluginBabelHelpers.extends({}, rest, {
+      ref: inputRef,
+      id: innerId,
+      "aria-labelledby": labelId,
       "aria-describedby": helperTextId,
-      placeholder: placeholder,
+      placeholder: innerPlaceholderValue,
       disabled: disabled,
+      readOnly: !disabled && readOnly,
       onChange: handleChange,
-      onKeyUp: handleKeyUp
+      onKeyDown: handleInputKeydown
     })), labelInside && /*#__PURE__*/React.createElement(TextField_styles.Label, {
-      id: lableId
-    }, label)), contentRight), leftHelper && /*#__PURE__*/React.createElement(TextField_styles.LeftHelper, {
+      id: labelId,
+      htmlFor: innerId
+    }, innerLabelValue)), contentRight && /*#__PURE__*/React.createElement(TextField_styles.StyledContentRight, null, contentRight)), leftHelper && /*#__PURE__*/React.createElement(TextField_styles.LeftHelper, {
       id: helperTextId
     }, leftHelper));
   });
 };
 var textFieldConfig = {
   name: 'TextField',
-  tag: 'label',
+  tag: 'div',
   layout: textFieldRoot,
   base: base,
   variations: {
@@ -83,15 +203,21 @@ var textFieldConfig = {
       css: base$3.base,
       attrs: true
     },
+    readOnly: {
+      css: base$4.base,
+      attrs: true
+    },
     labelPlacement: {
-      css: base$4.base
+      css: base$5.base
     }
   },
   defaults: {
-    size: 'm'
+    size: 'm',
+    view: 'default'
   }
 };
 
+exports.base = base;
 exports.textFieldConfig = textFieldConfig;
 exports.textFieldRoot = textFieldRoot;
 //# sourceMappingURL=TextField.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","sources":["../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport type { ChangeEventHandler, KeyboardEventHandler, LabelHTMLAttributes } from 'react';\nimport { css } from '@linaria/core';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport type { RootProps } from '../../engines';\n\nimport type { TextFieldProps } from './TextField.types';\nimport { base as size } from './_size/base';\nimport { base as view } from './_view/base';\nimport { base as disabled } from './_disabled/base';\nimport { base as labelPlacement } from './_label-placement/base';\nimport { Input, LeftHelper, Label, InputWrapper, InputLabelWrapper } from './TextField.styles';\n\nconst base = css`\n    /* NOTE: Webkit не применяет opacity к inline тегам */\n    display: block;\n`;\n\nexport const textFieldRoot = (\n    Root: RootProps<HTMLInputElement, TextFieldProps & LabelHTMLAttributes<HTMLLabelElement>>,\n) =>\n    forwardRef<HTMLInputElement, TextFieldProps>((props, ref) => {\n        const {\n            // layout\n            contentLeft,\n            contentRight,\n            children,\n            label,\n            labelPlacement,\n            placeholder,\n            leftHelper,\n\n            // variations\n            view,\n            size,\n            disabled,\n\n            // events\n            onChange,\n            onSearch,\n\n            ...rest\n        } = props;\n\n        const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n            const { maxLength, value } = event.target;\n\n            if (!onChange || (maxLength !== -1 && value.length > maxLength)) {\n                return;\n            }\n\n            onChange(event);\n        };\n\n        const handleKeyUp: KeyboardEventHandler<HTMLInputElement> = (event) => {\n            if (event.key === 'Enter' && onSearch) {\n                onSearch((event.target as HTMLInputElement).value, event);\n            }\n        };\n\n        const labelInside = labelPlacement === 'inner';\n        const lableId = safeUseId();\n        const helperTextId = safeUseId();\n\n        return (\n            <Root view={view} size={size} disabled={disabled} labelPlacement={labelPlacement}>\n                {labelInside || (label && <Label id={lableId}>{label}</Label>)}\n                <InputWrapper>\n                    {contentLeft}\n                    <InputLabelWrapper>\n                        <Input\n                            {...rest}\n                            ref={ref}\n                            aria-labelledby={lableId}\n                            aria-describedby={helperTextId}\n                            placeholder={placeholder}\n                            disabled={disabled}\n                            onChange={handleChange}\n                            onKeyUp={handleKeyUp}\n                        />\n                        {labelInside && <Label id={lableId}>{label}</Label>}\n                    </InputLabelWrapper>\n                    {contentRight}\n                </InputWrapper>\n                {leftHelper && <LeftHelper id={helperTextId}>{leftHelper}</LeftHelper>}\n            </Root>\n        );\n    });\n\nexport const textFieldConfig = {\n    name: 'TextField',\n    tag: 'label',\n    layout: textFieldRoot,\n    base,\n    variations: {\n        view: {\n            css: view,\n        },\n        size: {\n            css: size,\n        },\n        disabled: {\n            css: disabled,\n            attrs: true,\n        },\n        labelPlacement: {\n            css: labelPlacement,\n        },\n    },\n    defaults: {\n        size: 'm',\n    },\n};\n"],"names":["base","textFieldRoot","Root","forwardRef","props","ref","contentLeft","contentRight","label","labelPlacement","placeholder","leftHelper","view","size","disabled","onChange","onSearch","rest","_excluded","handleChange","event","_event$target","target","maxLength","value","length","handleKeyUp","key","labelInside","lableId","safeUseId","helperTextId","React","createElement","Label","id","InputWrapper","InputLabelWrapper","Input","_extends","onKeyUp","LeftHelper","textFieldConfig","name","tag","layout","variations","css","attrs","defaults"],"mappings":"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"}
+{"version":3,"file":"TextField.js","sources":["../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useRef, useState } from 'react';\nimport type { ChangeEventHandler } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\nimport { css } from '@linaria/core';\n\nimport type { RootProps } from '../../engines';\nimport { cx } from '../../utils';\n\nimport type { ChipValues, TextFieldPrimitiveValue, TextFieldProps } from './TextField.types';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base as disabledCSS } from './variations/_disabled/base';\nimport { base as readOnlyCSS } from './variations/_read-only/base';\nimport { base as labelPlacementCSS } from './variations/_label-placement/base';\nimport {\n    Input,\n    LeftHelper,\n    Label,\n    InputWrapper,\n    InputLabelWrapper,\n    StyledContentLeft,\n    StyledContentRight,\n    StyledChips,\n} from './TextField.styles';\nimport { classes } from './TextField.tokens';\nimport { TextFieldChip } from './ui';\nimport { useKeyNavigation } from './hooks/useKeyNavigation';\n\nexport const base = css`\n    /* NOTE: Webkit не применяет opacity к inline тегам */\n    display: block;\n    overflow: hidden;\n`;\n\nexport const textFieldRoot = (Root: RootProps<HTMLDivElement, TextFieldProps>) =>\n    forwardRef<HTMLDivElement, TextFieldProps>((props, ref) => {\n        const {\n            id,\n\n            // layout\n            contentLeft,\n            contentRight,\n            label,\n            labelPlacement,\n            placeholder,\n            leftHelper,\n            enumerationType = 'plain',\n\n            // variations\n            view,\n            size,\n            readOnly = false,\n            disabled = false,\n\n            // controlled\n            values,\n\n            // events\n            onChange,\n            onChangeChips,\n            onSearch,\n\n            ...rest\n        } = props;\n\n        const contentRef = useRef<HTMLDivElement>(null);\n        const inputRef = useRef<HTMLInputElement>(null);\n        const chipsRefs = useRef<Array<HTMLButtonElement>>([]);\n\n        const controlledRefs = { contentRef, inputRef, chipsRefs };\n\n        const [chips, setChips] = useState<Array<ChipValues>>([]);\n\n        const uniqId = safeUseId();\n        const innerId = id || uniqId;\n        const labelId = safeUseId();\n        const helperTextId = safeUseId();\n\n        const isChipEnumeration = enumerationType === 'chip';\n        const hideLabel = (size === 'xs' || isChipEnumeration) && labelPlacement === 'inner';\n        const labelInside = size !== 'xs' && labelPlacement === 'inner';\n        const innerLabelPlacementValue = hideLabel ? 'outer' : labelPlacement;\n        const innerPlaceholderValue = hideLabel ? label : placeholder;\n        const innerLabelValue = hideLabel ? undefined : label;\n\n        const isChipsVisible = isChipEnumeration && chips?.length;\n        const withHasChips = isChipsVisible ? classes.hasChips : undefined;\n        const wrapperWithoutLeftContent = !contentLeft && isChipsVisible ? classes.hasEmptyContentLeft : undefined;\n        const wrapperWithoutRightContent = !contentRight && isChipsVisible ? classes.hasEmptyContentRight : undefined;\n\n        const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n            if (disabled || readOnly) {\n                return;\n            }\n\n            const { maxLength, value } = event.target;\n\n            if (maxLength !== -1 && value.length > maxLength) {\n                return;\n            }\n\n            onChange?.(event);\n        };\n\n        const updateChips = (newChips: Array<ChipValues>, newValues: Array<TextFieldPrimitiveValue>) => {\n            setChips(newChips);\n            onChangeChips?.(newValues);\n        };\n\n        const { handleInputKeydown, handleChipKeyDown, onChipClear, handleContentKeyDown } = useKeyNavigation({\n            controlledRefs,\n            disabled,\n            readOnly,\n            chips,\n            enumerationType,\n            updateChips,\n            onSearch,\n            onChange,\n        });\n\n        const onChipClick = (event: React.MouseEvent<HTMLButtonElement>) => event.stopPropagation();\n\n        const handleInputFocus = () => {\n            if (readOnly || disabled || !inputRef?.current) {\n                return;\n            }\n\n            inputRef.current.scrollIntoView({\n                behavior: 'smooth',\n                block: 'center',\n                inline: 'center',\n            });\n            inputRef.current.focus({ preventScroll: true });\n        };\n\n        const getRef = (element: HTMLButtonElement | null, index: number) => {\n            if (element && chipsRefs?.current) {\n                chipsRefs.current[index] = element;\n            }\n        };\n\n        useEffect(() => {\n            if (!isChipEnumeration && !values?.length) {\n                return;\n            }\n\n            const newChips =\n                values?.map((value, index) => ({\n                    id: `${index}_${value}`,\n                    text: value,\n                })) || [];\n\n            setChips(newChips);\n        }, [isChipEnumeration, values]);\n\n        return (\n            <Root\n                ref={ref}\n                view={view}\n                size={size}\n                disabled={disabled}\n                readOnly={!disabled && readOnly}\n                labelPlacement={innerLabelPlacementValue}\n                onClick={handleInputFocus}\n            >\n                {labelInside ||\n                    (innerLabelValue && (\n                        <Label id={labelId} htmlFor={id}>\n                            {innerLabelValue}\n                        </Label>\n                    ))}\n                <InputWrapper className={cx(withHasChips, wrapperWithoutLeftContent, wrapperWithoutRightContent)}>\n                    {contentLeft && <StyledContentLeft>{contentLeft}</StyledContentLeft>}\n                    <InputLabelWrapper\n                        tabIndex={-1}\n                        ref={contentRef}\n                        onKeyDown={handleContentKeyDown}\n                        className={withHasChips}\n                    >\n                        {isChipEnumeration && Boolean(chips?.length) && (\n                            <StyledChips>\n                                {chips?.map(({ id: chipId, text }, index) => {\n                                    return (\n                                        <TextFieldChip\n                                            ref={(element) => getRef(element, index)}\n                                            chipId={chipId}\n                                            key={`${chipId}_${index}`}\n                                            disabled={disabled}\n                                            readOnly={readOnly}\n                                            value={text}\n                                            text={text}\n                                            onKeyDown={(event) => handleChipKeyDown(event, chipId)}\n                                            onClear={() => onChipClear(chipId)}\n                                            onClick={onChipClick}\n                                        />\n                                    );\n                                })}\n                            </StyledChips>\n                        )}\n                        <Input\n                            {...rest}\n                            ref={inputRef}\n                            id={innerId}\n                            aria-labelledby={labelId}\n                            aria-describedby={helperTextId}\n                            placeholder={innerPlaceholderValue}\n                            disabled={disabled}\n                            readOnly={!disabled && readOnly}\n                            onChange={handleChange}\n                            onKeyDown={handleInputKeydown}\n                        />\n                        {labelInside && (\n                            <Label id={labelId} htmlFor={innerId}>\n                                {innerLabelValue}\n                            </Label>\n                        )}\n                    </InputLabelWrapper>\n                    {contentRight && <StyledContentRight>{contentRight}</StyledContentRight>}\n                </InputWrapper>\n                {leftHelper && <LeftHelper id={helperTextId}>{leftHelper}</LeftHelper>}\n            </Root>\n        );\n    });\n\nexport const textFieldConfig = {\n    name: 'TextField',\n    tag: 'div',\n    layout: textFieldRoot,\n    base,\n    variations: {\n        view: {\n            css: viewCSS,\n        },\n        size: {\n            css: sizeCSS,\n        },\n        disabled: {\n            css: disabledCSS,\n            attrs: true,\n        },\n        readOnly: {\n            css: readOnlyCSS,\n            attrs: true,\n        },\n        labelPlacement: {\n            css: labelPlacementCSS,\n        },\n    },\n    defaults: {\n        size: 'm',\n        view: 'default',\n    },\n};\n"],"names":["base","textFieldRoot","Root","forwardRef","props","ref","id","contentLeft","contentRight","label","labelPlacement","placeholder","leftHelper","_props$enumerationTyp","enumerationType","view","size","_props$readOnly","readOnly","_props$disabled","disabled","values","onChange","onChangeChips","onSearch","rest","_excluded","contentRef","useRef","inputRef","chipsRefs","controlledRefs","_useState","useState","_useState2","_slicedToArray","chips","setChips","uniqId","safeUseId","innerId","labelId","helperTextId","isChipEnumeration","hideLabel","labelInside","innerLabelPlacementValue","innerPlaceholderValue","innerLabelValue","undefined","isChipsVisible","length","withHasChips","classes","hasChips","wrapperWithoutLeftContent","hasEmptyContentLeft","wrapperWithoutRightContent","hasEmptyContentRight","handleChange","event","_event$target","target","maxLength","value","updateChips","newChips","newValues","_useKeyNavigation","useKeyNavigation","handleInputKeydown","handleChipKeyDown","onChipClear","handleContentKeyDown","onChipClick","stopPropagation","handleInputFocus","current","scrollIntoView","behavior","block","inline","focus","preventScroll","getRef","element","index","useEffect","map","concat","text","React","createElement","onClick","Label","htmlFor","InputWrapper","className","cx","StyledContentLeft","InputLabelWrapper","tabIndex","onKeyDown","Boolean","StyledChips","_ref","chipId","TextFieldChip","key","onClear","Input","_extends","StyledContentRight","LeftHelper","textFieldConfig","name","tag","layout","variations","css","viewCSS","sizeCSS","disabledCSS","attrs","readOnlyCSS","labelPlacementCSS","defaults"],"mappings":"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"}

package/cjs/components/TextField/TextField.styles.js

@@ -1,12 +1,12 @@
-import './TextField.styles_2qw1n8.css';
+import './TextField.styles_1b1mddp.css';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var react = require('@linaria/react');
 
-var Input = /*#__PURE__*/react.styled('input')({
-  name: "Input",
+var InputWrapper = /*#__PURE__*/react.styled('div')({
+  name: "InputWrapper",
   "class": "iq39zt5",
   propsAsIs: false
 });
@@ -15,21 +15,34 @@ var InputLabelWrapper = /*#__PURE__*/react.styled('div')({
   "class": "i1j28rg8",
   propsAsIs: false
 });
-
-// NOTE: border-width is used in size border-color is used in view
-var InputWrapper = /*#__PURE__*/react.styled('div')({
-  name: "InputWrapper",
-  "class": "i13zudoe",
+var StyledChips = /*#__PURE__*/react.styled('div')({
+  name: "StyledChips",
+  "class": "s13zudoe",
   propsAsIs: false
 });
-var Label = /*#__PURE__*/react.styled('div')({
+var Input = /*#__PURE__*/react.styled('input')({
+  name: "Input",
+  "class": "io4bpie",
+  propsAsIs: false
+});
+var Label = /*#__PURE__*/react.styled('label')({
   name: "Label",
-  "class": "lo4bpie",
+  "class": "l13qvwoy",
+  propsAsIs: false
+});
+var StyledContentLeft = /*#__PURE__*/react.styled('div')({
+  name: "StyledContentLeft",
+  "class": "s19ry60d",
+  propsAsIs: false
+});
+var StyledContentRight = /*#__PURE__*/react.styled('div')({
+  name: "StyledContentRight",
+  "class": "sbt1ohz",
   propsAsIs: false
 });
 var LeftHelper = /*#__PURE__*/react.styled('div')({
   name: "LeftHelper",
-  "class": "l13qvwoy",
+  "class": "llv9av6",
   propsAsIs: false
 });
 
@@ -38,4 +51,7 @@ exports.InputLabelWrapper = InputLabelWrapper;
 exports.InputWrapper = InputWrapper;
 exports.Label = Label;
 exports.LeftHelper = LeftHelper;
+exports.StyledChips = StyledChips;
+exports.StyledContentLeft = StyledContentLeft;
+exports.StyledContentRight = StyledContentRight;
 //# sourceMappingURL=TextField.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TextField.styles.js","sources":["../../../src/components/TextField/TextField.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nexport const Input = styled.input`\n    box-sizing: border-box;\n    appearance: none;\n    border: 0;\n    padding: 0;\n    background-color: transparent;\n    outline: none;\n`;\n\nexport const InputLabelWrapper = styled.div`\n    ${Input} {\n        width: 100%;\n    }\n`;\n\n// NOTE: border-width is used in size border-color is used in view\nexport const InputWrapper = styled.div`\n    position: relative;\n    display: flex;\n    align-items: center;\n\n    box-shadow: inset 0 0 0 var(--plasma_private-textfield-border-width) var(--plasma_private-textfield-border-color);\n\n    ${InputLabelWrapper} {\n        flex-grow: 1;\n    }\n`;\n\nexport const Label = styled.div``;\n\nexport const LeftHelper = styled.div``;\n"],"names":["Input","styled","name","class","propsAsIs","InputLabelWrapper","InputWrapper","Label","LeftHelper"],"mappings":";;;;;;AAEO,IAAMA,KAAK,gBAAGC,YAAM,CAAA,OAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,OAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAO1B,EAAA;AAEM,IAAMC,iBAAiB,gBAAGJ,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAItC,EAAA;;AAED;AACO,IAAME,YAAY,gBAAGL,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAUjC,EAAA;AAEM,IAAMG,KAAK,gBAAGN,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,OAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAM,EAAA;AAE1B,IAAMI,UAAU,gBAAGP,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAM;;;;;;;;"}
+{"version":3,"file":"TextField.styles.js","sources":["../../../src/components/TextField/TextField.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { classes, tokens } from './TextField.tokens';\n\nexport const InputWrapper = styled.div`\n    position: relative;\n    display: flex;\n    align-items: center;\n    box-sizing: border-box;\n`;\n\nexport const InputLabelWrapper = styled.div`\n    flex: 1;\n    overflow: scroll;\n    position: relative;\n    width: 100%;\n    display: inline-flex;\n    align-items: center;\n\n    ::-webkit-scrollbar {\n        display: none;\n    }\n\n    scrollbar-width: none;\n\n    overscroll-behavior: contain;\n\n    &.${String(classes.hasChips)} {\n        height: var(${tokens.chipHeight});\n        border-radius: var(${tokens.chipBorderRadius});\n    }\n`;\n\nexport const StyledChips = styled.div`\n    display: flex;\n    gap: var(${tokens.chipGap});\n    margin-right: var(${tokens.chipGap});\n    user-select: none;\n`;\n\nexport const Input = styled.input`\n    box-sizing: border-box;\n    appearance: none;\n    border: 0;\n    padding: 0;\n    background-color: transparent;\n    outline: none;\n    flex: 1;\n    min-width: 60%;\n`;\n\nexport const Label = styled.label``;\n\nexport const StyledContentLeft = styled.div`\n    margin: var(${tokens.leftContentMargin});\n`;\n\nexport const StyledContentRight = styled.div`\n    margin: var(${tokens.rightContentMargin});\n`;\n\nexport const LeftHelper = styled.div``;\n"],"names":["InputWrapper","styled","name","class","propsAsIs","InputLabelWrapper","StyledChips","Input","Label","StyledContentLeft","StyledContentRight","LeftHelper"],"mappings":";;;;;;AAIO,IAAMA,YAAY,gBAAGC,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAKjC,EAAA;AAEM,IAAMC,iBAAiB,gBAAGJ,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAoBtC,EAAA;AAEM,IAAME,WAAW,gBAAGL,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAKhC,EAAA;AAEM,IAAMG,KAAK,gBAAGN,YAAM,CAAA,OAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,OAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAS1B,EAAA;AAEM,IAAMI,KAAK,gBAAGP,YAAM,CAAA,OAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,OAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAQ,EAAA;AAE5B,IAAMK,iBAAiB,gBAAGR,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,mBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAEtC,EAAA;AAEM,IAAMM,kBAAkB,gBAAGT,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,oBAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAEvC,EAAA;AAEM,IAAMO,UAAU,gBAAGV,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAAM;;;;;;;;;;;"}

package/cjs/components/TextField/TextField.styles_1b1mddp.css

@@ -0,0 +1,8 @@
+.iq39zt5{position:relative;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;}
+.i1j28rg8{-webkit-flex:1;-ms-flex:1;flex:1;overflow:scroll;position:relative;width:100%;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;-webkit-scrollbar-width:none;-moz-scrollbar-width:none;-ms-scrollbar-width:none;scrollbar-width:none;overscroll-behavior:contain;}.i1j28rg8::-webkit-scrollbar{display:none;}.i1j28rg8.has-chips{height:var(--plasma-textfield__chip-height);border-radius:var(--plasma-textfield__chip-border-radius);}
+.s13zudoe{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-textfield__chip-gap);margin-right:var(--plasma-textfield__chip-gap);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
+.io4bpie{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background-color:transparent;outline:none;-webkit-flex:1;-ms-flex:1;flex:1;min-width:60%;}
+
+.s19ry60d{margin:var(--plasma-textfield__left-content-margin);}
+.sbt1ohz{margin:var(--plasma-textfield__right-content-margin);}
+

package/cjs/components/TextField/TextField.tokens.js

@@ -2,34 +2,45 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var classes = {
+  hasChips: 'has-chips',
+  hasEmptyContentLeft: 'has-empty-content-left',
+  hasEmptyContentRight: 'has-empty-content-right'
+};
 var tokens = {
   color: '--plasma-textfield-color',
   backgroundColor: '--plasma-textfield-bg-color',
   backgroundColorHover: '--plasma-textfield-bg-color-hover',
   backgroundColorFocus: '--plasma-textfield-bg-color-focus',
-  /** Цвет каретки */
-  caretColor: '--plasma-textfield__caret-color',
-  placeholderColor: '--plasma-textfield__placeholder-color',
   borderColor: '--plasma-textfield-border-color',
   borderColorHover: '--plasma-textfield-border-color-hover',
   borderColorFocus: '--plasma-textfield-border-color-focus',
+  /** Цвета для read-only состояния */
+  colorReadOnly: '--plasma-textfield-color-readonly',
+  backgroundColorReadOnly: '--plasma-textfield-bg-color-readonly',
+  borderColorReadOnly: '--plasma-textfield-border-color-readonly',
+  placeholderColorReadOnly: '--plasma-textfield__placeholder-color-readonly',
+  /** Цвет каретки */
+  caretColor: '--plasma-textfield__caret-color',
+  placeholderColor: '--plasma-textfield__placeholder-color',
   height: '--plasma-textfield-height',
   borderWidth: '--plasmas-textfield-border-width',
   borderRadius: '--plasma-textfield-border-radius',
-  /** отступ от границы ТextField */
+  /** Отступ от границы ТextField */
   padding: '--plasma-textfield-padding',
-  paddingWithContent: '--plasma-textfield-padding-with-content',
-  /* Отступ между Иконками и текстом Инпута */
-  /* Отступ при отсутствии Иконок сохраняется */
-  contentOffset: '--plasma-textfield__content-offset',
+  paddingWithChips: '--plasma-textfield-padding-with-chips',
+  /* Токены для инпута */
+  leftContentMargin: '--plasma-textfield__left-content-margin',
+  rightContentMargin: '--plasma-textfield__right-content-margin',
   fontFamily: '--plasma-textfield-font-family',
   fontStyle: '--plasma-textfield-font-style',
   fontSize: '--plasma-textfield-font-size',
   fontWeight: '--plasma-textfield-font-weight',
   letterSpacing: '--plasma-textfield-letter-spacing',
   lineHeight: '--plasma-textfield-line-height',
-  /** Цвет подписи */
+  /** Токены лейбла */
   labelColor: '--plasma-textfield__label-color',
+  labelColorReadOnly: '--plasma-textfield__label-color-readonly',
   labelOffset: '--plasma-textfield__label-offset',
   labelFontFamily: '--plasma-textfield__label-font-family',
   labelFontStyle: '--plasma-textfield__label-font-style',
@@ -44,19 +55,56 @@ var tokens = {
   labelInnerFontWeight: '--plasma-textfield-placement_inner__label-font-weight',
   labelInnerLetterSpacing: '--plasma-textfield-placement_inner__label-letter-spacing',
   labelInnerLineHeight: '--plasma-textfield-placement_inner__label-line-height',
-  leftHelperColor: '--plasma-textfield__leftHelper-color',
-  leftHelperOffset: '--plasma-textfield__leftHelper-offset',
-  leftHelperFontFamily: '--plasma-textfield__leftHelper-font-family',
-  leftHelperFontStyle: '--plasma-textfield__leftHelper-font-style',
-  leftHelperFontSize: '--plasma-textfield__leftHelper-font-size',
-  leftHelperFontWeight: '--plasma-textfield__leftHelper-font-weight',
-  leftHelperLetterSpacing: '--plasma-textfield__leftHelper-letter-spacing',
-  leftHelperLineHeight: '--plasma-textfield__leftHelper-line-height',
-  /* Дополнительный цвет который можно использовать в <Icon color="inheit" /> */
-  contentColor: '--plasma-textfield__content-color',
+  labelInnerPadding: '--plasma-textfield-placement_inner__label-padding',
+  contentLabelInnerPadding: '--plasma-textfield-placement_inner__content-padding',
+  leftHelperColor: '--plasma-textfield__left-helper-color',
+  leftHelperColorReadOnly: '--plasma-textfield__left-helper-color-readonly',
+  leftHelperOffset: '--plasma-textfield__left-helper-offset',
+  leftHelperFontFamily: '--plasma-textfield__left-helper-font-family',
+  leftHelperFontStyle: '--plasma-textfield__left-helper-font-style',
+  leftHelperFontSize: '--plasma-textfield__left-helper-font-size',
+  leftHelperFontWeight: '--plasma-textfield__left-helper-font-weight',
+  leftHelperLetterSpacing: '--plasma-textfield__left-helper-letter-spacing',
+  leftHelperLineHeight: '--plasma-textfield__left-helper-line-height',
   /** Прозрачность для всего компонента в состоянии disabled */
-  disabledOpacity: '--plasma-textfield-disabled-opacity'
+  disabledOpacity: '--plasma-textfield-disabled-opacity',
+  /** Токены чипа */
+  chipHeight: '--plasma-textfield__chip-height',
+  chipBorderRadius: '--plasma-textfield__chip-border-radius',
+  chipGap: '--plasma-textfield__chip-gap',
+  chipBackground: '--plasma-textfield__chip-background',
+  chipColor: '--plasma-textfield__chip-color',
+  chipBackgroundHover: '--plasma-textfield__chip-background-hover',
+  chipColorHover: '--plasma-textfield__chip-color-hover',
+  chipScaleHover: '--plasma-textfield__chip-scale-hover',
+  chipBackgroundReadOnly: '--plasma-textfield__chip-background-readonly',
+  chipColorReadOnly: '--plasma-textfield__chip-color-readonly',
+  chipBackgroundReadOnlyHover: '--plasma-textfield__chip-background-readonly-hover',
+  chipColorReadOnlyHover: '--plasma-textfield__chip-color-readonly-hover',
+  chipBackgroundActive: '--plasma-textfield__chip-background-active',
+  chipColorActive: '--plasma-textfield__chip-color-active',
+  chipScaleActive: '--plasma-textfield__chip-scale-active',
+  chipFocusColor: '--plasma-textfield__chip-focus-color',
+  chipCloseIconColor: '--plasma-textfield__chip-close-icon-color',
+  chipOutlineSize: '--plasma-textfield__chip-outline-size',
+  chipWidth: '--plasma-textfield__chip-width',
+  chipPaddingTop: '--plasma-textfield__chip-padding-top',
+  chipPaddingRight: '--plasma-textfield__chip-padding-right',
+  chipPaddingBottom: '--plasma-textfield__chip-padding-bottom',
+  chipPaddingLeft: '--plasma-textfield__chip-padding-left',
+  chipCloseIconSize: '--plasma-textfield__chip-close-icon-size',
+  chipFontFamily: '--plasma-textfield__chip-font-family',
+  chipFontSize: '--plasma-textfield__chip-font-size',
+  chipFontStyle: '--plasma-textfield__chip-font-style',
+  chipFontWeight: '--plasma-textfield__chip-font-weight',
+  chipLetterSpacing: '--plasma-textfield__chip-letter-spacing',
+  chipLineHeight: '--plasma-textfield__chip-line-height',
+  chipClearContentMarginLeft: '--plasma-textfield__chip-clear-content-margin-left',
+  chipClearContentMarginRight: '--plasma-textfield__chip-clear-content-margin-right',
+  chipOpacityReadonly: '--plasma-textfield__chip-opacity-readonly',
+  focusColor: '--plasma-textfield-focus-color'
 };
 
+exports.classes = classes;
 exports.tokens = tokens;
 //# sourceMappingURL=TextField.tokens.js.map

package/cjs/components/TextField/TextField.tokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.tokens.js","sources":["../../../src/components/TextField/TextField.tokens.ts"],"sourcesContent":["export const tokens = {\n    color: '--plasma-textfield-color',\n    backgroundColor: '--plasma-textfield-bg-color',\n    backgroundColorHover: '--plasma-textfield-bg-color-hover',\n    backgroundColorFocus: '--plasma-textfield-bg-color-focus',\n    /** Цвет каретки */\n    caretColor: '--plasma-textfield__caret-color',\n    placeholderColor: '--plasma-textfield__placeholder-color',\n    borderColor: '--plasma-textfield-border-color',\n    borderColorHover: '--plasma-textfield-border-color-hover',\n    borderColorFocus: '--plasma-textfield-border-color-focus',\n\n    height: '--plasma-textfield-height',\n    borderWidth: '--plasmas-textfield-border-width',\n    borderRadius: '--plasma-textfield-border-radius',\n    /** отступ от границы ТextField */\n    padding: '--plasma-textfield-padding',\n    paddingWithContent: '--plasma-textfield-padding-with-content',\n\n    /* Отступ между Иконками и текстом Инпута */\n    /* Отступ при отсутствии Иконок сохраняется */\n    contentOffset: '--plasma-textfield__content-offset',\n\n    fontFamily: '--plasma-textfield-font-family',\n    fontStyle: '--plasma-textfield-font-style',\n    fontSize: '--plasma-textfield-font-size',\n    fontWeight: '--plasma-textfield-font-weight',\n    letterSpacing: '--plasma-textfield-letter-spacing',\n    lineHeight: '--plasma-textfield-line-height',\n\n    /** Цвет подписи */\n    labelColor: '--plasma-textfield__label-color',\n    labelOffset: '--plasma-textfield__label-offset',\n\n    labelFontFamily: '--plasma-textfield__label-font-family',\n    labelFontStyle: '--plasma-textfield__label-font-style',\n    labelFontSize: '--plasma-textfield__label-font-size',\n    labelFontWeight: '--plasma-textfield__label-font-weight',\n    labelLetterSpacing: '--plasma-textfield__label-letter-spacing',\n    labelLineHeight: '--plasma-textfield__label-line-height',\n\n    /* label-placement-inner */\n    labelInnerFontFamily: '--plasma-textfield-placement_inner__label-font-family',\n    labelInnerFontStyle: '--plasma-textfield-placement_inner__label-font-style',\n    labelInnerFontSize: '--plasma-textfield-placement_inner__label-font-size',\n    labelInnerFontWeight: '--plasma-textfield-placement_inner__label-font-weight',\n    labelInnerLetterSpacing: '--plasma-textfield-placement_inner__label-letter-spacing',\n    labelInnerLineHeight: '--plasma-textfield-placement_inner__label-line-height',\n\n    leftHelperColor: '--plasma-textfield__leftHelper-color',\n    leftHelperOffset: '--plasma-textfield__leftHelper-offset',\n\n    leftHelperFontFamily: '--plasma-textfield__leftHelper-font-family',\n    leftHelperFontStyle: '--plasma-textfield__leftHelper-font-style',\n    leftHelperFontSize: '--plasma-textfield__leftHelper-font-size',\n    leftHelperFontWeight: '--plasma-textfield__leftHelper-font-weight',\n    leftHelperLetterSpacing: '--plasma-textfield__leftHelper-letter-spacing',\n    leftHelperLineHeight: '--plasma-textfield__leftHelper-line-height',\n\n    /* Дополнительный цвет который можно использовать в <Icon color=\"inheit\" /> */\n    contentColor: '--plasma-textfield__content-color',\n\n    /** Прозрачность для всего компонента в состоянии disabled */\n    disabledOpacity: '--plasma-textfield-disabled-opacity',\n};\n"],"names":["tokens","color","backgroundColor","backgroundColorHover","backgroundColorFocus","caretColor","placeholderColor","borderColor","borderColorHover","borderColorFocus","height","borderWidth","borderRadius","padding","paddingWithContent","contentOffset","fontFamily","fontStyle","fontSize","fontWeight","letterSpacing","lineHeight","labelColor","labelOffset","labelFontFamily","labelFontStyle","labelFontSize","labelFontWeight","labelLetterSpacing","labelLineHeight","labelInnerFontFamily","labelInnerFontStyle","labelInnerFontSize","labelInnerFontWeight","labelInnerLetterSpacing","labelInnerLineHeight","leftHelperColor","leftHelperOffset","leftHelperFontFamily","leftHelperFontStyle","leftHelperFontSize","leftHelperFontWeight","leftHelperLetterSpacing","leftHelperLineHeight","contentColor","disabledOpacity"],"mappings":";;;;AAAO,IAAMA,MAAM,GAAG;AAClBC,EAAAA,KAAK,EAAE,0BAA0B;AACjCC,EAAAA,eAAe,EAAE,6BAA6B;AAC9CC,EAAAA,oBAAoB,EAAE,mCAAmC;AACzDC,EAAAA,oBAAoB,EAAE,mCAAmC;AACzD;AACAC,EAAAA,UAAU,EAAE,iCAAiC;AAC7CC,EAAAA,gBAAgB,EAAE,uCAAuC;AACzDC,EAAAA,WAAW,EAAE,iCAAiC;AAC9CC,EAAAA,gBAAgB,EAAE,uCAAuC;AACzDC,EAAAA,gBAAgB,EAAE,uCAAuC;AAEzDC,EAAAA,MAAM,EAAE,2BAA2B;AACnCC,EAAAA,WAAW,EAAE,kCAAkC;AAC/CC,EAAAA,YAAY,EAAE,kCAAkC;AAChD;AACAC,EAAAA,OAAO,EAAE,4BAA4B;AACrCC,EAAAA,kBAAkB,EAAE,yCAAyC;AAE7D;AACA;AACAC,EAAAA,aAAa,EAAE,oCAAoC;AAEnDC,EAAAA,UAAU,EAAE,gCAAgC;AAC5CC,EAAAA,SAAS,EAAE,+BAA+B;AAC1CC,EAAAA,QAAQ,EAAE,8BAA8B;AACxCC,EAAAA,UAAU,EAAE,gCAAgC;AAC5CC,EAAAA,aAAa,EAAE,mCAAmC;AAClDC,EAAAA,UAAU,EAAE,gCAAgC;AAE5C;AACAC,EAAAA,UAAU,EAAE,iCAAiC;AAC7CC,EAAAA,WAAW,EAAE,kCAAkC;AAE/CC,EAAAA,eAAe,EAAE,uCAAuC;AACxDC,EAAAA,cAAc,EAAE,sCAAsC;AACtDC,EAAAA,aAAa,EAAE,qCAAqC;AACpDC,EAAAA,eAAe,EAAE,uCAAuC;AACxDC,EAAAA,kBAAkB,EAAE,0CAA0C;AAC9DC,EAAAA,eAAe,EAAE,uCAAuC;AAExD;AACAC,EAAAA,oBAAoB,EAAE,uDAAuD;AAC7EC,EAAAA,mBAAmB,EAAE,sDAAsD;AAC3EC,EAAAA,kBAAkB,EAAE,qDAAqD;AACzEC,EAAAA,oBAAoB,EAAE,uDAAuD;AAC7EC,EAAAA,uBAAuB,EAAE,0DAA0D;AACnFC,EAAAA,oBAAoB,EAAE,uDAAuD;AAE7EC,EAAAA,eAAe,EAAE,sCAAsC;AACvDC,EAAAA,gBAAgB,EAAE,uCAAuC;AAEzDC,EAAAA,oBAAoB,EAAE,4CAA4C;AAClEC,EAAAA,mBAAmB,EAAE,2CAA2C;AAChEC,EAAAA,kBAAkB,EAAE,0CAA0C;AAC9DC,EAAAA,oBAAoB,EAAE,4CAA4C;AAClEC,EAAAA,uBAAuB,EAAE,+CAA+C;AACxEC,EAAAA,oBAAoB,EAAE,4CAA4C;AAElE;AACAC,EAAAA,YAAY,EAAE,mCAAmC;AAEjD;AACAC,EAAAA,eAAe,EAAE,qCAAA;AACrB;;;;"}
+{"version":3,"file":"TextField.tokens.js","sources":["../../../src/components/TextField/TextField.tokens.ts"],"sourcesContent":["export const classes = {\n    hasChips: 'has-chips',\n    hasEmptyContentLeft: 'has-empty-content-left',\n    hasEmptyContentRight: 'has-empty-content-right',\n};\n\nexport const tokens = {\n    color: '--plasma-textfield-color',\n\n    backgroundColor: '--plasma-textfield-bg-color',\n    backgroundColorHover: '--plasma-textfield-bg-color-hover',\n    backgroundColorFocus: '--plasma-textfield-bg-color-focus',\n\n    borderColor: '--plasma-textfield-border-color',\n    borderColorHover: '--plasma-textfield-border-color-hover',\n    borderColorFocus: '--plasma-textfield-border-color-focus',\n\n    /** Цвета для read-only состояния */\n    colorReadOnly: '--plasma-textfield-color-readonly',\n    backgroundColorReadOnly: '--plasma-textfield-bg-color-readonly',\n    borderColorReadOnly: '--plasma-textfield-border-color-readonly',\n    placeholderColorReadOnly: '--plasma-textfield__placeholder-color-readonly',\n\n    /** Цвет каретки */\n    caretColor: '--plasma-textfield__caret-color',\n    placeholderColor: '--plasma-textfield__placeholder-color',\n\n    height: '--plasma-textfield-height',\n    borderWidth: '--plasmas-textfield-border-width',\n    borderRadius: '--plasma-textfield-border-radius',\n\n    /** Отступ от границы ТextField */\n    padding: '--plasma-textfield-padding',\n    paddingWithChips: '--plasma-textfield-padding-with-chips',\n\n    /* Токены для инпута */\n    leftContentMargin: '--plasma-textfield__left-content-margin',\n    rightContentMargin: '--plasma-textfield__right-content-margin',\n\n    fontFamily: '--plasma-textfield-font-family',\n    fontStyle: '--plasma-textfield-font-style',\n    fontSize: '--plasma-textfield-font-size',\n    fontWeight: '--plasma-textfield-font-weight',\n    letterSpacing: '--plasma-textfield-letter-spacing',\n    lineHeight: '--plasma-textfield-line-height',\n\n    /** Токены лейбла */\n    labelColor: '--plasma-textfield__label-color',\n    labelColorReadOnly: '--plasma-textfield__label-color-readonly',\n    labelOffset: '--plasma-textfield__label-offset',\n\n    labelFontFamily: '--plasma-textfield__label-font-family',\n    labelFontStyle: '--plasma-textfield__label-font-style',\n    labelFontSize: '--plasma-textfield__label-font-size',\n    labelFontWeight: '--plasma-textfield__label-font-weight',\n    labelLetterSpacing: '--plasma-textfield__label-letter-spacing',\n    labelLineHeight: '--plasma-textfield__label-line-height',\n\n    /* label-placement-inner */\n    labelInnerFontFamily: '--plasma-textfield-placement_inner__label-font-family',\n    labelInnerFontStyle: '--plasma-textfield-placement_inner__label-font-style',\n    labelInnerFontSize: '--plasma-textfield-placement_inner__label-font-size',\n    labelInnerFontWeight: '--plasma-textfield-placement_inner__label-font-weight',\n    labelInnerLetterSpacing: '--plasma-textfield-placement_inner__label-letter-spacing',\n    labelInnerLineHeight: '--plasma-textfield-placement_inner__label-line-height',\n\n    labelInnerPadding: '--plasma-textfield-placement_inner__label-padding',\n    contentLabelInnerPadding: '--plasma-textfield-placement_inner__content-padding',\n\n    leftHelperColor: '--plasma-textfield__left-helper-color',\n    leftHelperColorReadOnly: '--plasma-textfield__left-helper-color-readonly',\n    leftHelperOffset: '--plasma-textfield__left-helper-offset',\n\n    leftHelperFontFamily: '--plasma-textfield__left-helper-font-family',\n    leftHelperFontStyle: '--plasma-textfield__left-helper-font-style',\n    leftHelperFontSize: '--plasma-textfield__left-helper-font-size',\n    leftHelperFontWeight: '--plasma-textfield__left-helper-font-weight',\n    leftHelperLetterSpacing: '--plasma-textfield__left-helper-letter-spacing',\n    leftHelperLineHeight: '--plasma-textfield__left-helper-line-height',\n\n    /** Прозрачность для всего компонента в состоянии disabled */\n    disabledOpacity: '--plasma-textfield-disabled-opacity',\n\n    /** Токены чипа */\n    chipHeight: '--plasma-textfield__chip-height',\n    chipBorderRadius: '--plasma-textfield__chip-border-radius',\n    chipGap: '--plasma-textfield__chip-gap',\n    chipBackground: '--plasma-textfield__chip-background',\n    chipColor: '--plasma-textfield__chip-color',\n    chipBackgroundHover: '--plasma-textfield__chip-background-hover',\n    chipColorHover: '--plasma-textfield__chip-color-hover',\n    chipScaleHover: '--plasma-textfield__chip-scale-hover',\n    chipBackgroundReadOnly: '--plasma-textfield__chip-background-readonly',\n    chipColorReadOnly: '--plasma-textfield__chip-color-readonly',\n    chipBackgroundReadOnlyHover: '--plasma-textfield__chip-background-readonly-hover',\n    chipColorReadOnlyHover: '--plasma-textfield__chip-color-readonly-hover',\n    chipBackgroundActive: '--plasma-textfield__chip-background-active',\n    chipColorActive: '--plasma-textfield__chip-color-active',\n    chipScaleActive: '--plasma-textfield__chip-scale-active',\n    chipFocusColor: '--plasma-textfield__chip-focus-color',\n    chipCloseIconColor: '--plasma-textfield__chip-close-icon-color',\n    chipOutlineSize: '--plasma-textfield__chip-outline-size',\n    chipWidth: '--plasma-textfield__chip-width',\n    chipPaddingTop: '--plasma-textfield__chip-padding-top',\n    chipPaddingRight: '--plasma-textfield__chip-padding-right',\n    chipPaddingBottom: '--plasma-textfield__chip-padding-bottom',\n    chipPaddingLeft: '--plasma-textfield__chip-padding-left',\n    chipCloseIconSize: '--plasma-textfield__chip-close-icon-size',\n    chipFontFamily: '--plasma-textfield__chip-font-family',\n    chipFontSize: '--plasma-textfield__chip-font-size',\n    chipFontStyle: '--plasma-textfield__chip-font-style',\n    chipFontWeight: '--plasma-textfield__chip-font-weight',\n    chipLetterSpacing: '--plasma-textfield__chip-letter-spacing',\n    chipLineHeight: '--plasma-textfield__chip-line-height',\n    chipClearContentMarginLeft: '--plasma-textfield__chip-clear-content-margin-left',\n    chipClearContentMarginRight: '--plasma-textfield__chip-clear-content-margin-right',\n    chipOpacityReadonly: '--plasma-textfield__chip-opacity-readonly',\n\n    focusColor: '--plasma-textfield-focus-color',\n};\n"],"names":["classes","hasChips","hasEmptyContentLeft","hasEmptyContentRight","tokens","color","backgroundColor","backgroundColorHover","backgroundColorFocus","borderColor","borderColorHover","borderColorFocus","colorReadOnly","backgroundColorReadOnly","borderColorReadOnly","placeholderColorReadOnly","caretColor","placeholderColor","height","borderWidth","borderRadius","padding","paddingWithChips","leftContentMargin","rightContentMargin","fontFamily","fontStyle","fontSize","fontWeight","letterSpacing","lineHeight","labelColor","labelColorReadOnly","labelOffset","labelFontFamily","labelFontStyle","labelFontSize","labelFontWeight","labelLetterSpacing","labelLineHeight","labelInnerFontFamily","labelInnerFontStyle","labelInnerFontSize","labelInnerFontWeight","labelInnerLetterSpacing","labelInnerLineHeight","labelInnerPadding","contentLabelInnerPadding","leftHelperColor","leftHelperColorReadOnly","leftHelperOffset","leftHelperFontFamily","leftHelperFontStyle","leftHelperFontSize","leftHelperFontWeight","leftHelperLetterSpacing","leftHelperLineHeight","disabledOpacity","chipHeight","chipBorderRadius","chipGap","chipBackground","chipColor","chipBackgroundHover","chipColorHover","chipScaleHover","chipBackgroundReadOnly","chipColorReadOnly","chipBackgroundReadOnlyHover","chipColorReadOnlyHover","chipBackgroundActive","chipColorActive","chipScaleActive","chipFocusColor","chipCloseIconColor","chipOutlineSize","chipWidth","chipPaddingTop","chipPaddingRight","chipPaddingBottom","chipPaddingLeft","chipCloseIconSize","chipFontFamily","chipFontSize","chipFontStyle","chipFontWeight","chipLetterSpacing","chipLineHeight","chipClearContentMarginLeft","chipClearContentMarginRight","chipOpacityReadonly","focusColor"],"mappings":"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"}

package/cjs/components/TextField/TextField_wctd2m.css

@@ -0,0 +1 @@
+.bpunezx{display:block;overflow:hidden;}