@salutejs/plasma-new-hope 0.268.2-canary.1780.13373736245.0 → 0.269.0-canary.1770.13380403901.0

package/styled-components/es/examples/plasma_web/components/Range/Range.stories.tsx

@@ -1,7 +1,7 @@
 import React, { ChangeEvent, ComponentProps, Dispatch, SetStateAction, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { IconPlaceholder } from '@salutejs/plasma-sb-utils';
+import { disableProps, IconPlaceholder } from '@salutejs/plasma-sb-utils';
 
 import { WithTheme } from '../../../_helpers';
 import { IconChevronLeft } from '../../../../components/_Icon';
@@ -45,7 +45,10 @@ const meta: Meta<typeof Range> = {
             control: {
                 type: 'select',
             },
-            if: { arg: 'required', truthy: true },
+            if: {
+                arg: 'required',
+                truthy: true,
+            },
         },
         ...disableProps(['view']),
     },
@@ -76,10 +79,14 @@ const getSizeForIcon = (size) => {
     return size;
 };
 
-const ActionButton = ({ size }) => {
+const ActionButton = ({ size, readOnly }) => {
     return (
-        <IconButton view="clear" size={size}>
-            <IconChevronLeft size={getSizeForIcon(size)} />
+        <IconButton view="clear" size={size} disabled={readOnly}>
+            <IconChevronLeft
+                color={readOnly ? 'var(--text-secondary)' : 'inherit'}
+                size={getSizeForIcon(size)}
+                style={{ transform: 'rotate(180deg)' }}
+            />
         </IconButton>
     );
 };
@@ -115,7 +122,7 @@ const StoryDefault = ({
             firstValue={firstValue}
             secondValue={secondValue}
             contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
-            contentRight={enableContentRight ? <ActionButton size={size} /> : undefined}
+            contentRight={enableContentRight ? <ActionButton size={size} readOnly={rest.readOnly} /> : undefined}
             firstTextfieldContentLeft={
                 enableFirstTextfieldContentLeft ? <IconPlaceholder size={iconSize} /> : undefined
             }
@@ -266,7 +273,7 @@ const StoryDemo = ({ enableContentLeft, enableContentRight, size, ...rest }: Sto
             firstValueSuccess={firstValueSuccess}
             secondValueSuccess={secondValueSuccess}
             contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
-            contentRight={enableContentRight ? <ActionButton size={size} /> : undefined}
+            contentRight={enableContentRight ? <ActionButton size={size} readOnly={rest.readOnly} /> : undefined}
             onChangeFirstValue={(e) => {
                 handleChangeValue(
                     e,

package/styled-components/es/examples/plasma_web/components/TextArea/TextArea.stories.tsx

@@ -8,6 +8,7 @@ import { textAreaConfig } from '../../../../components/TextArea';
 import { mergeConfig } from '../../../../engines';
 import { WithTheme, argTypesFromConfig } from '../../../_helpers';
 import type { PopoverPlacement } from '../Popover/Popover';
+import { IconLock } from '../../../../components/_Icon';
 
 import { config } from './TextArea.config';
 import { TextArea } from './TextArea';
@@ -38,6 +39,16 @@ const placements: Array<PopoverPlacement> = [
     'auto',
 ];
 
+const getIcon = (IconComponent: React.ReactElement, size: string, readOnly = false) => {
+    const iconSize = size === 'xs' ? 'xs' : 's';
+
+    if (readOnly) {
+        return <IconLock size={iconSize} color="var(--text-secondary)" style={{ opacity: 0.4 }} />;
+    }
+
+    return <IconComponent size={iconSize} color="inherit" />;
+};
+
 type StoryTextAreaPropsCustom = {
     hasHint?: boolean;
     enableContentRight?: boolean;
@@ -61,19 +72,25 @@ const meta: Meta<StoryTextAreaProps> = {
             control: {
                 type: 'boolean',
             },
-            if: { arg: 'optional', truthy: false },
+            if: {
+                arg: 'optional',
+                truthy: false,
+            },
         },
         optional: {
             control: {
                 type: 'boolean',
             },
-            if: { arg: 'required', truthy: false },
+            if: {
+                arg: 'required',
+                truthy: false,
+            },
         },
         size: {
             options: sizes,
             defaultValue: 'm',
             control: {
-                type: 'select',
+                type: 'inline-radio',
             },
         },
         view: {
@@ -92,19 +109,28 @@ const meta: Meta<StoryTextAreaProps> = {
             control: {
                 type: 'boolean',
             },
-            if: { arg: 'clear', truthy: true },
+            if: {
+                arg: 'clear',
+                truthy: true,
+            },
         },
         cols: {
             control: {
                 type: 'number',
             },
-            if: { arg: 'clear', truthy: false },
+            if: {
+                arg: 'clear',
+                truthy: false,
+            },
         },
         rows: {
             control: {
                 type: 'number',
             },
-            if: { arg: 'clear', truthy: false },
+            if: {
+                arg: 'clear',
+                truthy: false,
+            },
         },
         hasHint: {
             control: {
@@ -113,47 +139,65 @@ const meta: Meta<StoryTextAreaProps> = {
         },
         hintText: {
             control: { type: 'text' },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintView: {
             options: hintViews,
             control: {
                 type: 'select',
             },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintSize: {
             options: hintSizes,
             control: {
                 type: 'select',
             },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintTrigger: {
             options: hintTriggers,
             control: {
                 type: 'inline-radio',
             },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintPlacement: {
             options: placements,
             control: {
                 type: 'select',
             },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
             mappers: placements,
         },
         hintHasArrow: {
             control: { type: 'boolean' },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintWidth: {
             control: { type: 'text' },
-            if: { arg: 'hasHint', truthy: true },
-        },
-        helperText: {
-            control: { type: 'text' },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         width: {
             control: { type: 'text' },
@@ -172,6 +216,7 @@ const meta: Meta<StoryTextAreaProps> = {
         },
         ...disableProps([
             'helperBlock',
+            'helperText',
             '$isFocused',
             'contentRight',
             'autoComplete',
@@ -195,6 +240,7 @@ const meta: Meta<StoryTextAreaProps> = {
             'hintOffset',
             'hintContentLeft',
             'hintView',
+            'hintOpened',
         ]),
     },
     args: {
@@ -238,19 +284,24 @@ const onBlur = action('onBlur');
 const StoryDefault = (props: StoryTextAreaProps) => {
     const [value, setValue] = useState('Значение поля');
 
-    const iconSize = props.size === 'xs' ? 'xs' : 's';
-
     return (
         <TextArea
             value={value}
-            contentRight={props.enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
+            contentRight={
+                props.enableContentRight || props.readOnly
+                    ? getIcon(IconPlaceholder, props.size, props.readOnly)
+                    : undefined
+            }
             onChange={(e) => {
                 setValue(e.target.value);
                 onChange(e);
             }}
             onFocus={onFocus}
             onBlur={onBlur}
-            style={{ width: '70%', margin: '0 auto' }}
+            style={{
+                width: '70%',
+                margin: '0 auto',
+            }}
             {...props}
         />
     );

package/styled-components/es/examples/plasma_web/components/TextField/TextField.config.js

@@ -27,12 +27,12 @@ export var config = {
       "true": /*#__PURE__*/css([""])
     },
     chipView: {
-      "default": /*#__PURE__*/css(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-hover);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-active);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":0.72;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly),
-      secondary: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--surface-transparent-secondary-active);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--text-secondary);", ":0.72;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly),
-      accent: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-accent);", ":var(--on-dark-text-primary);", ":var(--surface-accent-hover);", ":var(--on-dark-text-primary);", ":var(--surface-accent-active);", ":var(--surface-accent);", ":var(--on-dark-text-primary);", ":var(--surface-accent);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":0.72;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly),
-      positive: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--surface-positive-hover);", ":var(--on-dark-text-primary);", ":var(--surface-positive-active);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":0.72;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly),
-      warning: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-warning);", ":var(--on-dark-text-primary);", ":var(--surface-warning-hover);", ":var(--on-dark-text-primary);", ":var(--surface-warning-active);", ":var(--surface-warning);", ":var(--on-dark-text-primary);", ":var(--surface-warning);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":0.72;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly),
-      negative: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--surface-negative-hover);", ":var(--on-dark-text-primary);", ":var(--surface-negative-active);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":0.72;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly)
+      "default": /*#__PURE__*/css(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-hover);", ":var(--inverse-text-primary);", ":var(--surface-solid-default-active);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--inverse-text-secondary);", ":1;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly),
+      secondary: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--surface-transparent-secondary-active);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--text-secondary);", ":1;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly),
+      accent: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-accent);", ":var(--on-dark-text-primary);", ":var(--surface-accent-hover);", ":var(--on-dark-text-primary);", ":var(--surface-accent-active);", ":var(--surface-accent);", ":var(--on-dark-text-primary);", ":var(--surface-accent);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":1;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly),
+      positive: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--surface-positive-hover);", ":var(--on-dark-text-primary);", ":var(--surface-positive-active);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":1;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly),
+      warning: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-warning);", ":var(--on-dark-text-primary);", ":var(--surface-warning-hover);", ":var(--on-dark-text-primary);", ":var(--surface-warning-active);", ":var(--surface-warning);", ":var(--on-dark-text-primary);", ":var(--surface-warning);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":1;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly),
+      negative: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--surface-negative-hover);", ":var(--on-dark-text-primary);", ":var(--surface-negative-active);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":1;"], tokens.chipColor, tokens.chipBackground, tokens.chipColorHover, tokens.chipBackgroundHover, tokens.chipColorActive, tokens.chipBackgroundActive, tokens.chipBackgroundReadOnly, tokens.chipColorReadOnly, tokens.chipBackgroundReadOnlyHover, tokens.chipColorReadOnlyHover, tokens.chipCloseIconColor, tokens.chipOpacityReadonly)
     },
     hintView: {
       "default": /*#__PURE__*/css(["", ":var(--surface-solid-card-brightness);", ":var(--shadow-down-hard-m,0px 4px 12px 0px rgba(0,0,0,0.16),0px 1px 4px 0px rgba(0,0,0,0.08));", ":var(--text-primary);", ":var(--surface-solid-card);"], tokens.tooltipBackgroundColor, tokens.tooltipBoxShadow, tokens.tooltipColor, tokens.tooltipArrowBackground)
@@ -45,7 +45,7 @@ export var config = {
       "true": /*#__PURE__*/css(["", ":0.4;"], tokens.disabledOpacity)
     },
     readOnly: {
-      "true": /*#__PURE__*/css(["", ":var(--text-secondary);", ":var(--surface-clear);", ":var(--surface-transparent-tertiary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);"], tokens.colorReadOnly, tokens.backgroundColorReadOnly, tokens.borderColorReadOnly, tokens.placeholderColorReadOnly, tokens.leftHelperColorReadOnly, tokens.titleCaptionColorReadOnly, tokens.labelColorReadOnly)
+      "true": /*#__PURE__*/css(["", ":0.4;", ":var(--text-primary);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-tertiary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-transparent-primary);"], tokens.readOnlyOpacity, tokens.colorReadOnly, tokens.backgroundColorReadOnly, tokens.borderColorReadOnly, tokens.placeholderColorReadOnly, tokens.leftHelperColorReadOnly, tokens.titleCaptionColorReadOnly, tokens.labelColorReadOnly, tokens.dividerColorReadOnly)
     }
   }
 };

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

@@ -4,7 +4,7 @@ import { action } from '@storybook/addon-actions';
 import { IconPlaceholder } from '@salutejs/plasma-sb-utils';
 
 import { WithTheme } from '../../../_helpers';
-import { IconCross } from '../../../../components/_Icon';
+import { IconCross, IconLock } from '../../../../components/_Icon';
 import type { PopoverPlacement } from '../Popover/Popover';
 
 import { TextField } from './TextField';
@@ -43,6 +43,16 @@ const placements: Array<PopoverPlacement> = [
     'auto',
 ];
 
+const getIcon = (IconComponent: React.ReactElement, size: string, readOnly = false) => {
+    const iconSize = size === 'xs' ? 'xs' : 's';
+
+    if (readOnly) {
+        return <IconLock size={iconSize} color="var(--text-secondary)" style={{ opacity: 0.4 }} />;
+    }
+
+    return <IconComponent size={iconSize} color="inherit" />;
+};
+
 const meta: Meta<typeof TextField> = {
     title: 'web/Data Entry/TextField',
     component: TextField,
@@ -58,19 +68,28 @@ const meta: Meta<typeof TextField> = {
             control: {
                 type: 'boolean',
             },
-            if: { arg: 'optional', truthy: false },
+            if: {
+                arg: 'optional',
+                truthy: false,
+            },
         },
         optional: {
             control: {
                 type: 'boolean',
             },
-            if: { arg: 'required', truthy: false },
+            if: {
+                arg: 'required',
+                truthy: false,
+            },
         },
         hasDivider: {
             control: {
                 type: 'boolean',
             },
-            if: { arg: 'clear', truthy: true },
+            if: {
+                arg: 'clear',
+                truthy: true,
+            },
         },
         view: {
             options: views,
@@ -93,7 +112,10 @@ const meta: Meta<typeof TextField> = {
             control: {
                 type: 'boolean',
             },
-            if: { arg: 'labelPlacement', eq: 'inner' },
+            if: {
+                arg: 'labelPlacement',
+                eq: 'inner',
+            },
         },
         size: {
             options: sizes,
@@ -103,51 +125,75 @@ const meta: Meta<typeof TextField> = {
         },
         hintText: {
             control: { type: 'text' },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintView: {
             options: hintViews,
             control: {
                 type: 'select',
             },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintSize: {
             options: hintSizes,
             control: {
                 type: 'select',
             },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintTargetPlacement: {
             options: hintTargetPlacements,
             control: {
                 type: 'inline-radio',
             },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintTrigger: {
             options: hintTriggers,
             control: {
                 type: 'inline-radio',
             },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintPlacement: {
             options: placements,
             control: {
                 type: 'select',
             },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
             mappers: placements,
         },
         hintHasArrow: {
             control: { type: 'boolean' },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         hintWidth: {
             control: { type: 'text' },
-            if: { arg: 'hasHint', truthy: true },
+            if: {
+                arg: 'hasHint',
+                truthy: true,
+            },
         },
         chipType: {
             control: 'select',
@@ -183,19 +229,28 @@ type StoryPropsDefault = Omit<
     enableContentRight: boolean;
 };
 
-const StoryDemo = ({ enableContentLeft, enableContentRight, view, ...rest }: StoryPropsDefault) => {
+const StoryDemo = ({ enableContentLeft, enableContentRight, view, readOnly, ...rest }: StoryPropsDefault) => {
     const [text, setText] = useState('Значение поля');
 
-    const iconSize = rest.size === 'xs' ? 'xs' : 's';
+    const contentRight = enableContentRight || readOnly ? getIcon(IconCross, rest.size, readOnly) : undefined;
 
     return (
-        <div style={{ display: 'flex', flexDirection: 'column', gap: '2rem', width: '70%', margin: '0 auto' }}>
+        <div
+            style={{
+                display: 'flex',
+                flexDirection: 'column',
+                gap: '2rem',
+                width: '70%',
+                margin: '0 auto',
+            }}
+        >
             <TextField
                 {...rest}
                 enumerationType="plain"
                 value={text}
-                contentLeft={enableContentLeft ? <IconCross color="inherit" size={iconSize} /> : undefined}
-                contentRight={enableContentRight ? <IconCross color="inherit" size={iconSize} /> : undefined}
+                readOnly={readOnly}
+                contentLeft={enableContentLeft ? getIcon(IconPlaceholder, rest.size) : undefined}
+                contentRight={contentRight}
                 view={view}
                 onChange={(e) => {
                     setText(e.target.value);
@@ -211,9 +266,10 @@ const StoryDemo = ({ enableContentLeft, enableContentRight, view, ...rest }: Sto
                 label="Uncontrolled TextField"
                 defaultValue="Дефолтное значение"
                 enumerationType="plain"
-                contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
-                contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
+                contentLeft={enableContentLeft ? getIcon(IconPlaceholder, rest.size) : undefined}
+                contentRight={contentRight}
                 view={view}
+                readOnly={readOnly}
                 onFocus={onFocus}
                 onBlur={onBlur}
                 onSearch={onSearch}
@@ -285,10 +341,10 @@ type StoryPropsChips = Omit<
     enableContentRight: boolean;
 };
 
-const StoryChips = ({ enableContentLeft, enableContentRight, view, ...rest }: StoryPropsChips) => {
+const StoryChips = ({ enableContentLeft, enableContentRight, view, readOnly, ...rest }: StoryPropsChips) => {
     const [text, setText] = useState('Значение поля');
 
-    const iconSize = rest.size === 'xs' ? 'xs' : 's';
+    const contentRight = enableContentRight || readOnly ? getIcon(IconCross, rest.size, readOnly) : undefined;
 
     const validateChip = (value) => (value === '1 value' ? { view: 'negative' } : {});
 
@@ -297,9 +353,10 @@ const StoryChips = ({ enableContentLeft, enableContentRight, view, ...rest }: St
             {...rest}
             enumerationType="chip"
             value={text}
-            contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
-            contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
+            contentLeft={enableContentLeft ? getIcon(IconPlaceholder, rest.size) : undefined}
+            contentRight={contentRight}
             view={view}
+            readOnly={readOnly}
             onChange={(e) => {
                 setText(e.target.value);
                 onChange(e.target.value);
@@ -308,7 +365,10 @@ const StoryChips = ({ enableContentLeft, enableContentRight, view, ...rest }: St
             onBlur={onBlur}
             onChangeChips={onChipsChange}
             chipValidator={validateChip}
-            style={{ width: '70%', margin: '0 auto' }}
+            style={{
+                width: '70%',
+                margin: '0 auto',
+            }}
         />
     );
 };

package/types/components/Range/Range.tokens.d.ts

@@ -20,6 +20,7 @@ export declare const tokens: {
     /** Токены разделителя */
     dividerColor: string;
     dividerColorReadOnly: string;
+    dividerOpacityReadOnly: string;
     dividerPadding: string;
     dividerFontFamily: string;
     dividerFontStyle: string;
@@ -30,6 +31,7 @@ export declare const tokens: {
     /** Токены слотов для контента */
     leftContentMargin: string;
     rightContentMargin: string;
+    rightContentOpacityReadOnly: string;
     /** Токены лейбла */
     labelColor: string;
     labelColorReadOnly: string;

package/types/components/Range/Range.tokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Range.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Range/Range.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;CAOnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;IAYf,yBAAyB;;;;;;;;;;IAWzB,iCAAiC;;;IAIjC,oBAAoB;;;;;;;;;;IAYpB,wBAAwB;;;;;;;;IAUxB,qCAAqC;;;;;;;;;;;;IAcrC,6DAA6D;;IAG7D,yCAAyC;;IAGzC,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiD5B,CAAC"}
+{"version":3,"file":"Range.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Range/Range.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;CAOnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;IAYf,yBAAyB;;;;;;;;;;;IAYzB,iCAAiC;;;;IAKjC,oBAAoB;;;;;;;;;;IAYpB,wBAAwB;;;;;;;;IAUxB,qCAAqC;;;;;;;;;;;;IAcrC,6DAA6D;;IAG7D,yCAAyC;;IAGzC,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiD5B,CAAC"}

package/types/components/Range/variations/_readonly/base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/Range/variations/_readonly/base.ts"],"names":[],"mappings":"AAYA,eAAO,MAAM,IAAI,0CAyBhB,CAAC"}
+{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/Range/variations/_readonly/base.ts"],"names":[],"mappings":"AAYA,eAAO,MAAM,IAAI,0CA8BhB,CAAC"}

package/types/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalTabItem.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkF,MAAM,OAAO,CAAC;AAGvG,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAInD,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAQhE,eAAO,MAAM,qBAAqB,SAAU,UAAU,cAAc,EAAE,sBAAsB,CAAC,kGA6HvF,CAAC;AAEP,eAAO,MAAM,uBAAuB;;;mBA/HQ,UAAU,cAAc,EAAE,sBAAsB,CAAC;;;;;;;;;;;;;;;;;;;;CAsJ5F,CAAC"}
+{"version":3,"file":"HorizontalTabItem.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/horizontal/HorizontalTabItem/HorizontalTabItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAGtF,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAInD,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAQhE,eAAO,MAAM,qBAAqB,SAAU,UAAU,cAAc,EAAE,sBAAsB,CAAC,kGAuHvF,CAAC;AAEP,eAAO,MAAM,uBAAuB;;;mBAzHQ,UAAU,cAAc,EAAE,sBAAsB,CAAC;;;;;;;;;;;;;;;;;;;;CAgJ5F,CAAC"}

package/types/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalTabs.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6F,MAAM,OAAO,CAAC;AAIlH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAK9D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAsB/D,eAAO,MAAM,kBAAkB,SAAU,UAAU,cAAc,EAAE,mBAAmB,CAAC,+FAuMjF,CAAC;AAEP,eAAO,MAAM,oBAAoB;;;mBAzMQ,UAAU,cAAc,EAAE,mBAAmB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;CAqOtF,CAAC"}
+{"version":3,"file":"HorizontalTabs.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuF,MAAM,OAAO,CAAC;AAI5G,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAK9D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAqB/D,eAAO,MAAM,kBAAkB,SAAU,UAAU,cAAc,EAAE,mBAAmB,CAAC,+FAuNjF,CAAC;AAEP,eAAO,MAAM,oBAAoB;;;mBAzNQ,UAAU,cAAc,EAAE,mBAAmB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;CAqPtF,CAAC"}

package/types/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalTabItem.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkF,MAAM,OAAO,CAAC;AAGvG,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAInD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAO9D,eAAO,MAAM,mBAAmB,SAAU,UAAU,iBAAiB,EAAE,oBAAoB,CAAC,mGAoHtF,CAAC;AAEP,eAAO,MAAM,qBAAqB;;;mBAtHQ,UAAU,iBAAiB,EAAE,oBAAoB,CAAC;;;;;;;;;;;;;;;;;CA0I3F,CAAC"}
+{"version":3,"file":"VerticalTabItem.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAGtF,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAInD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAO9D,eAAO,MAAM,mBAAmB,SAAU,UAAU,iBAAiB,EAAE,oBAAoB,CAAC,mGA8GtF,CAAC;AAEP,eAAO,MAAM,qBAAqB;;;mBAhHQ,UAAU,iBAAiB,EAAE,oBAAoB,CAAC;;;;;;;;;;;;;;;;;CAoI3F,CAAC"}

package/types/components/Tabs/ui/vertical/VerticalTabs/VerticalTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalTabs.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/vertical/VerticalTabs/VerticalTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6F,MAAM,OAAO,CAAC;AAIlH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAI9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAiB7D,eAAO,MAAM,gBAAgB,SAAU,UAAU,cAAc,EAAE,iBAAiB,CAAC,+KAiL7E,CAAC;AAEP,eAAO,MAAM,kBAAkB;;;mBAnLQ,UAAU,cAAc,EAAE,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;CAwMlF,CAAC"}
+{"version":3,"file":"VerticalTabs.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/ui/vertical/VerticalTabs/VerticalTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuF,MAAM,OAAO,CAAC;AAI5G,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAI9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAgB7D,eAAO,MAAM,gBAAgB,SAAU,UAAU,cAAc,EAAE,iBAAiB,CAAC,+KAiM7E,CAAC;AAEP,eAAO,MAAM,kBAAkB;;;mBAnMQ,UAAU,cAAc,EAAE,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;CAwNlF,CAAC"}

package/types/components/TextArea/TextArea.d.ts

@@ -19,11 +19,12 @@ export declare const textAreaConfig: {
             css: import("@linaria/core").LinariaClassName;
             attrs: boolean;
         };
-        disabled: {
+        readOnly: {
             css: import("@linaria/core").LinariaClassName;
             attrs: boolean;
         };
-        readOnly: {
+        disabled: {
+            css: import("@linaria/core").LinariaClassName;
             attrs: boolean;
         };
         hintView: {

package/types/components/TextArea/TextArea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmG,MAAM,OAAO,CAAC;AAKxH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AA+BrD,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAkCzE,eAAO,MAAM,sBAAsB,UAAW,aAAa,WAAW,OAAO,2BA2B5E,CAAC;AAEF,eAAO,MAAM,YAAY,SAAU,UAAU,mBAAmB,EAAE,iBAAiB,CAAC,8FAwT9E,CAAC;AAEP,eAAO,MAAM,cAAc;;;mBA1TQ,UAAU,mBAAmB,EAAE,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4VnF,CAAC"}
+{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmG,MAAM,OAAO,CAAC;AAKxH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAgCrD,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAkCzE,eAAO,MAAM,sBAAsB,UAAW,aAAa,WAAW,OAAO,2BA2B5E,CAAC;AAEF,eAAO,MAAM,YAAY,SAAU,UAAU,mBAAmB,EAAE,iBAAiB,CAAC,8FA2T9E,CAAC;AAEP,eAAO,MAAM,cAAc;;;mBA7TQ,UAAU,mBAAmB,EAAE,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgWnF,CAAC"}

package/types/components/TextArea/TextArea.tokens.d.ts

@@ -60,6 +60,9 @@ export declare const tokens: {
     /** Цвет текста для элемента textarea */
     inputColor: string;
     clearInputColor: string;
+    inputColorReadOnly: string;
+    backgroundColorReadOnly: string;
+    readOnlyOpacity: string;
     /** Цвет текста для элемента textarea в состоянии focus */
     inputColorFocus: string;
     /** Цвет каретки для элемента textarea */

package/types/components/TextArea/TextArea.tokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;IAChB,6DAA6D;;IAE7D,kEAAkE;;IAElE,+CAA+C;;IAE/C,6CAA6C;;IAE7C,4CAA4C;;IAE5C,mDAAmD;;IAEnD,+CAA+C;;IAE/C,2CAA2C;;;;IAI3C,6BAA6B;;;;;;CAMhC,CAAC;AAEF,eAAO,MAAM,MAAM;IACf,qCAAqC;;IAErC,uDAAuD;;IAEvD,wDAAwD;;IAExD,uDAAuD;;IAEvD,sCAAsC;;IAEtC,wDAAwD;;IAExD,yDAAyD;;IAEzD,wDAAwD;;IAExD,0CAA0C;;IAE1C,4DAA4D;;IAE5D,6DAA6D;;IAE7D,4DAA4D;;IAE5D,yCAAyC;;IAEzC,2DAA2D;;IAE3D,4DAA4D;;IAE5D,2DAA2D;;IAE3D,wCAAwC;;;IAGxC,0DAA0D;;IAE1D,yCAAyC;;IAEzC,gCAAgC;;;IAGhC,kDAAkD;;;IAGlD,6BAA6B;;IAE7B,0CAA0C;;IAE1C,2CAA2C;;IAE3C,yCAAyC;;IAEzC,2DAA2D;;IAE3D,2DAA2D;;IAG3D,+BAA+B;;IAE/B,+BAA+B;;IAE/B,2CAA2C;;IAE3C,qCAAqC;;IAErC,+CAA+C;;IAE/C,4FAA4F;;IAE5F,0CAA0C;;IAE1C,0CAA0C;;IAE1C,qEAAqE;;;IAGrE,yCAAyC;;IAEzC,mEAAmE;;IAEnE,yCAAyC;;IAEzC,uCAAuC;;;IAGvC,uCAAuC;;IAEvC,sCAAsC;;IAEtC,sCAAsC;;IAEtC,+FAA+F;;IAE/F,wCAAwC;;IAExC,wCAAwC;;IAExC,6BAA6B;;IAE7B,2DAA2D;;IAE3D,2DAA2D;;IAE3D,mEAAmE;;IAEnE,kEAAkE;;IAElE,uEAAuE;;IAEvE,8EAA8E;;IAE9E,mEAAmE;;IAEnE,mEAAmE;;;IAGnE,2DAA2D;;IAE3D,mEAAmE;;IAEnE,kEAAkE;;IAElE,uEAAuE;;IAEvE,8EAA8E;;IAE9E,mEAAmE;;IAEnE,qDAAqD;;IAErD,8FAA8F;;IAE9F,oCAAoC;;IAEpC,kCAAkC;;IAElC,0CAA0C;;IAE1C,yCAAyC;;IAEzC,8CAA8C;;IAE9C,4DAA4D;;IAE5D,iDAAiD;;IAEjD,8CAA8C;;IAE9C,sDAAsD;;IAEtD,qDAAqD;;IAErD,0DAA0D;;IAE1D,iEAAiE;;IAEjE,sDAAsD;;IAGtD,WAAW;;;IAKX,6DAA6D;;IAE7D,6DAA6D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAwC7D,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+B5B,CAAC"}
+{"version":3,"file":"TextArea.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;IAChB,6DAA6D;;IAE7D,kEAAkE;;IAElE,+CAA+C;;IAE/C,6CAA6C;;IAE7C,4CAA4C;;IAE5C,mDAAmD;;IAEnD,+CAA+C;;IAE/C,2CAA2C;;;;IAI3C,6BAA6B;;;;;;CAMhC,CAAC;AAEF,eAAO,MAAM,MAAM;IACf,qCAAqC;;IAErC,uDAAuD;;IAEvD,wDAAwD;;IAExD,uDAAuD;;IAEvD,sCAAsC;;IAEtC,wDAAwD;;IAExD,yDAAyD;;IAEzD,wDAAwD;;IAExD,0CAA0C;;IAE1C,4DAA4D;;IAE5D,6DAA6D;;IAE7D,4DAA4D;;IAE5D,yCAAyC;;IAEzC,2DAA2D;;IAE3D,4DAA4D;;IAE5D,2DAA2D;;IAE3D,wCAAwC;;;;;;IAOxC,0DAA0D;;IAE1D,yCAAyC;;IAEzC,gCAAgC;;;IAGhC,kDAAkD;;;IAGlD,6BAA6B;;IAE7B,0CAA0C;;IAE1C,2CAA2C;;IAE3C,yCAAyC;;IAEzC,2DAA2D;;IAE3D,2DAA2D;;IAG3D,+BAA+B;;IAE/B,+BAA+B;;IAE/B,2CAA2C;;IAE3C,qCAAqC;;IAErC,+CAA+C;;IAE/C,4FAA4F;;IAE5F,0CAA0C;;IAE1C,0CAA0C;;IAE1C,qEAAqE;;;IAGrE,yCAAyC;;IAEzC,mEAAmE;;IAEnE,yCAAyC;;IAEzC,uCAAuC;;;IAGvC,uCAAuC;;IAEvC,sCAAsC;;IAEtC,sCAAsC;;IAEtC,+FAA+F;;IAE/F,wCAAwC;;IAExC,wCAAwC;;IAExC,6BAA6B;;IAE7B,2DAA2D;;IAE3D,2DAA2D;;IAE3D,mEAAmE;;IAEnE,kEAAkE;;IAElE,uEAAuE;;IAEvE,8EAA8E;;IAE9E,mEAAmE;;IAEnE,mEAAmE;;;IAGnE,2DAA2D;;IAE3D,mEAAmE;;IAEnE,kEAAkE;;IAElE,uEAAuE;;IAEvE,8EAA8E;;IAE9E,mEAAmE;;IAEnE,qDAAqD;;IAErD,8FAA8F;;IAE9F,oCAAoC;;IAEpC,kCAAkC;;IAElC,0CAA0C;;IAE1C,yCAAyC;;IAEzC,8CAA8C;;IAE9C,4DAA4D;;IAE5D,iDAAiD;;IAEjD,8CAA8C;;IAE9C,sDAAsD;;IAEtD,qDAAqD;;IAErD,0DAA0D;;IAE1D,iEAAiE;;IAEjE,sDAAsD;;IAGtD,WAAW;;;IAKX,6DAA6D;;IAE7D,6DAA6D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAwC7D,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+B5B,CAAC"}

package/types/components/TextArea/variations/_clear/base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/TextArea/variations/_clear/base.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,IAAI,0CAoIhB,CAAC"}
+{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/TextArea/variations/_clear/base.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,IAAI,0CAuIhB,CAAC"}

package/types/components/TextArea/variations/_read-only/base.d.ts

@@ -0,0 +1,2 @@
+export declare const base: import("@linaria/core").LinariaClassName;
+//# sourceMappingURL=base.d.ts.map