@salutejs/sdds-cs 0.318.1-canary.1741.15821189176.0 → 0.318.1-canary.2018.15641070716.0

package/emotion/es/components/Progress/Progress.config.js

@@ -1,90 +1,20 @@
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--surface-solid-primary);\n                ",
-        ": var(--surface-solid-default);\n                ",
-        ": var(--text-tertiary);\n            "
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--surface-solid-primary);\n                ",
-        ": var(--surface-accent);\n                ",
-        ": var(--text-tertiary);\n            "
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--surface-solid-primary);\n                ",
-        ": var(--surface-positive);\n                ",
-        ": var(--text-tertiary);\n            "
-    ]);
-    _templateObject2 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject3() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--surface-solid-primary);\n                ",
-        ": var(--surface-negative);\n                ",
-        ": var(--text-tertiary);\n            "
-    ]);
-    _templateObject3 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject4() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": 0.25rem;\n                ",
-        ": 0.125rem;\n\n                ",
-        ": 0.375rem;\n                ",
-        ": 0.375rem;\n\n                ",
-        ": 0.5rem;\n            "
-    ]);
-    _templateObject4 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { css, progressTokens } from '@salutejs/plasma-new-hope/emotion';
 export var config = {
-    defaults: {
-        view: 'default',
-        size: 'm'
+  defaults: {
+    view: 'default',
+    size: 'm'
+  },
+  variations: {
+    view: {
+      "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--surface-solid-primary);\n                ", ": var(--surface-solid-default);\n                ", ": var(--text-tertiary);\n            "])), progressTokens.trackBackgroundColor, progressTokens.progressFilledBackgroundColor, progressTokens.valueColor),
+      accent: /*#__PURE__*/css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--surface-solid-primary);\n                ", ": var(--surface-accent);\n                ", ": var(--text-tertiary);\n            "])), progressTokens.trackBackgroundColor, progressTokens.progressFilledBackgroundColor, progressTokens.valueColor),
+      positive: /*#__PURE__*/css(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--surface-solid-primary);\n                ", ": var(--surface-positive);\n                ", ": var(--text-tertiary);\n            "])), progressTokens.trackBackgroundColor, progressTokens.progressFilledBackgroundColor, progressTokens.valueColor),
+      negative: /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--surface-solid-primary);\n                ", ": var(--surface-negative);\n                ", ": var(--text-tertiary);\n            "])), progressTokens.trackBackgroundColor, progressTokens.progressFilledBackgroundColor, progressTokens.valueColor)
     },
-    variations: {
-        view: {
-            default: css(_templateObject(), progressTokens.trackBackgroundColor, progressTokens.progressFilledBackgroundColor, progressTokens.valueColor),
-            accent: css(_templateObject1(), progressTokens.trackBackgroundColor, progressTokens.progressFilledBackgroundColor, progressTokens.valueColor),
-            positive: css(_templateObject2(), progressTokens.trackBackgroundColor, progressTokens.progressFilledBackgroundColor, progressTokens.valueColor),
-            negative: css(_templateObject3(), progressTokens.trackBackgroundColor, progressTokens.progressFilledBackgroundColor, progressTokens.valueColor)
-        },
-        size: {
-            m: css(_templateObject4(), progressTokens.trackHeight, progressTokens.trackBorderRadius, progressTokens.progressFilledHeight, progressTokens.progressFilledBorderRadius, progressTokens.valueMarginLeft)
-        }
+    size: {
+      m: /*#__PURE__*/css(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 0.25rem;\n                ", ": 0.125rem;\n\n                ", ": 0.375rem;\n                ", ": 0.375rem;\n\n                ", ": 0.5rem;\n            "])), progressTokens.trackHeight, progressTokens.trackBorderRadius, progressTokens.progressFilledHeight, progressTokens.progressFilledBorderRadius, progressTokens.valueMarginLeft)
     }
-};
+  }
+};

package/emotion/es/components/Progress/Progress.js

@@ -1,5 +1,5 @@
 import { progressConfig, component, mergeConfig } from '@salutejs/plasma-new-hope/emotion';
 import { config } from './Progress.config';
-var mergedConfig = mergeConfig(progressConfig, config);
-var ProgressComponent = component(mergedConfig);
-export var Progress = ProgressComponent;
+var mergedConfig = /*#__PURE__*/mergeConfig(progressConfig, config);
+var ProgressComponent = /*#__PURE__*/component(mergedConfig);
+export var Progress = ProgressComponent;

package/emotion/es/components/Progress/Progress.stories.tsx

@@ -0,0 +1,32 @@
+import type { StoryObj, Meta } from '@storybook/react';
+import { InSpacingDecorator, disableProps } from '@salutejs/plasma-sb-utils';
+
+import { Progress } from '.';
+import type { ProgressProps } from '.';
+
+const views = ['default', 'accent', 'positive', 'negative'];
+
+const meta: Meta<typeof Progress> = {
+    title: 'Overlay/Progress',
+    component: Progress,
+    decorators: [InSpacingDecorator],
+    argTypes: {
+        view: {
+            options: views,
+            control: {
+                type: 'select',
+            },
+        },
+        ...disableProps(['status', 'size']),
+    },
+};
+
+export default meta;
+
+export const Default: StoryObj<ProgressProps> = {
+    args: {
+        value: 25,
+        view: 'default',
+        displayValue: true,
+    },
+};

package/emotion/es/components/Progress/index.js

@@ -1 +1 @@
-export { Progress } from './Progress';
+export { Progress } from './Progress';

package/emotion/es/components/Radiobox/Radiobox.config.js

@@ -1,101 +1,30 @@
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": 0;\n                ",
-        ": 0.125rem;\n                ",
-        ": 1.25rem;\n                ",
-        ": 1.125rem;\n                ",
-        ": 0.125rem;\n                ",
-        ": 0.625rem;\n                ",
-        ": 0;\n                ",
-        ": 0.625rem;\n                ",
-        ": 0.125rem;\n                ",
-        ": var(--plasma-typo-body-m-font-family);\n                ",
-        ": var(--plasma-typo-body-m-font-size);\n                ",
-        ": var(--plasma-typo-body-m-font-style);\n                ",
-        ": var(--plasma-typo-body-m-font-weight);\n                ",
-        ": var(--plasma-typo-body-m-letter-spacing);\n                ",
-        ": var(--plasma-typo-body-m-line-height);\n                ",
-        ": var(--plasma-typo-body-s-font-family);\n                ",
-        ": var(--plasma-typo-body-s-font-size);\n                ",
-        ": var(--plasma-typo-body-s-font-style);\n                ",
-        ": var(--plasma-typo-body-s-font-weight);\n                ",
-        ": var(--plasma-typo-body-s-letter-spacing);\n                ",
-        ": var(--plasma-typo-body-s-line-height);\n            "
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--text-accent);\n                ",
-        ": var(--on-dark-text-primary);\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--surface-solid-card);\n                ",
-        ": var(--outline-accent);\n                ",
-        ": transparent;\n            "
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": 0.4;\n            "
-    ]);
-    _templateObject2 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject3() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--text-accent);\n            "
-    ]);
-    _templateObject3 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { css, radioboxTokens } from '@salutejs/plasma-new-hope/emotion';
 export var config = {
-    defaults: {
-        view: 'accent',
-        size: 's',
-        focused: 'true'
+  defaults: {
+    view: 'accent',
+    size: 's',
+    focused: 'true'
+  },
+  variations: {
+    /**
+     * Размер контрола.
+     */
+    size: {
+      s: /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 0;\n                ", ": 0.125rem;\n                ", ": 1.25rem;\n                ", ": 1.125rem;\n                ", ": 0.125rem;\n                ", ": 0.625rem;\n                ", ": 0;\n                ", ": 0.625rem;\n                ", ": 0.125rem;\n                ", ": var(--plasma-typo-body-m-font-family);\n                ", ": var(--plasma-typo-body-m-font-size);\n                ", ": var(--plasma-typo-body-m-font-style);\n                ", ": var(--plasma-typo-body-m-font-weight);\n                ", ": var(--plasma-typo-body-m-letter-spacing);\n                ", ": var(--plasma-typo-body-m-line-height);\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-font-weight);\n                ", ": var(--plasma-typo-body-s-letter-spacing);\n                ", ": var(--plasma-typo-body-s-line-height);\n            "])), radioboxTokens.margin, radioboxTokens.triggerPadding, radioboxTokens.triggerSize, radioboxTokens.triggerBorderRadius, radioboxTokens.triggerBorderWidth, radioboxTokens.ellipseSize, radioboxTokens.contentTopOffset, radioboxTokens.contentLeftOffset, radioboxTokens.descriptionMarginTop, radioboxTokens.labelFontFamily, radioboxTokens.labelFontSize, radioboxTokens.labelFontStyle, radioboxTokens.labelFontWeight, radioboxTokens.labelLetterSpacing, radioboxTokens.labelLineHeight, radioboxTokens.descriptionFontFamily, radioboxTokens.descriptionFontSize, radioboxTokens.descriptionFontStyle, radioboxTokens.descriptionFontWeight, radioboxTokens.descriptionLetterSpacing, radioboxTokens.descriptionLineHeight)
+    },
+    /**
+     * Вид контрола.
+     */
+    view: {
+      accent: /*#__PURE__*/css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n                ", ": var(--on-dark-text-primary);\n                ", ": var(--text-secondary);\n                ", ": var(--surface-solid-card);\n                ", ": var(--outline-accent);\n                ", ": transparent;\n            "])), radioboxTokens.fillColor, radioboxTokens.ellipseColor, radioboxTokens.descriptionColor, radioboxTokens.triggerBackgroundColor, radioboxTokens.triggerBorderColor, radioboxTokens.triggerBorderCheckedColor)
+    },
+    disabled: {
+      "true": /*#__PURE__*/css(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 0.4;\n            "])), radioboxTokens.disabledOpacity)
     },
-    variations: {
-        /**
-         * Размер контрола.
-         */ size: {
-            s: css(_templateObject(), radioboxTokens.margin, radioboxTokens.triggerPadding, radioboxTokens.triggerSize, radioboxTokens.triggerBorderRadius, radioboxTokens.triggerBorderWidth, radioboxTokens.ellipseSize, radioboxTokens.contentTopOffset, radioboxTokens.contentLeftOffset, radioboxTokens.descriptionMarginTop, radioboxTokens.labelFontFamily, radioboxTokens.labelFontSize, radioboxTokens.labelFontStyle, radioboxTokens.labelFontWeight, radioboxTokens.labelLetterSpacing, radioboxTokens.labelLineHeight, radioboxTokens.descriptionFontFamily, radioboxTokens.descriptionFontSize, radioboxTokens.descriptionFontStyle, radioboxTokens.descriptionFontWeight, radioboxTokens.descriptionLetterSpacing, radioboxTokens.descriptionLineHeight)
-        },
-        /**
-         * Вид контрола.
-         */ view: {
-            accent: css(_templateObject1(), radioboxTokens.fillColor, radioboxTokens.ellipseColor, radioboxTokens.descriptionColor, radioboxTokens.triggerBackgroundColor, radioboxTokens.triggerBorderColor, radioboxTokens.triggerBorderCheckedColor)
-        },
-        disabled: {
-            true: css(_templateObject2(), radioboxTokens.disabledOpacity)
-        },
-        focused: {
-            true: css(_templateObject3(), radioboxTokens.focusColor)
-        }
+    focused: {
+      "true": /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n            "])), radioboxTokens.focusColor)
     }
-};
+  }
+};

package/emotion/es/components/Radiobox/Radiobox.js

@@ -1,8 +1,9 @@
 import { radioboxConfig, component, mergeConfig } from '@salutejs/plasma-new-hope/emotion';
 import { config } from './Radiobox.config';
-var mergedConfig = mergeConfig(radioboxConfig, config);
-var RadioboxComponent = component(mergedConfig);
+var mergedConfig = /*#__PURE__*/mergeConfig(radioboxConfig, config);
+var RadioboxComponent = /*#__PURE__*/component(mergedConfig);
 /**
  * Переключатель, или *радиокнопка*.
- */ export var Radiobox = RadioboxComponent;
-export { RadioGroup } from '@salutejs/plasma-new-hope/emotion';
+ */
+export var Radiobox = RadioboxComponent;
+export { RadioGroup } from '@salutejs/plasma-new-hope/emotion';

package/emotion/es/components/Radiobox/Radiobox.stories.tsx

@@ -0,0 +1,139 @@
+import React, { useState } from 'react';
+import type { StoryObj, Meta } from '@storybook/react';
+import { action } from '@storybook/addon-actions';
+import { disableProps, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+
+import { Radiobox, RadioboxProps } from '.';
+
+const onChange = action('onChange');
+const onFocus = action('onFocus');
+const onBlur = action('onBlur');
+
+const sizes = ['s'];
+const views = ['accent'];
+
+const meta: Meta<RadioboxProps> = {
+    title: 'Data Entry/Radiobox',
+    component: Radiobox,
+    decorators: [InSpacingDecorator],
+    argTypes: {
+        size: {
+            options: sizes,
+            control: {
+                type: 'inline-radio',
+            },
+        },
+        view: {
+            options: views,
+            control: {
+                type: 'select',
+            },
+        },
+        ...disableProps(['view']),
+    },
+};
+
+export default meta;
+
+type Story = StoryObj<RadioboxProps>;
+
+const cDescription = (
+    <div>
+        A general-purpose, procedural computer programming{' '}
+        <a href="https://en.wikipedia.org/wiki/C_(programming_language)">language</a>{' '}
+    </div>
+);
+
+const langName = 'language';
+
+const items = [
+    {
+        langName,
+        value: 'c',
+        label: 'C',
+        disabled: false,
+        description: cDescription,
+    },
+    { langName, value: 'cpp', label: 'C++', disabled: false },
+    { langName, value: 'assembly', label: 'Assembly', disabled: false },
+    { langName, value: 'elixir', label: 'Elixir', disabled: true },
+];
+
+const StoryDefault = ({ name, label, description, disabled, singleLine, size, view }: RadioboxProps) => {
+    const value = 0;
+    const [checked, setChecked] = React.useState(true);
+
+    return (
+        <Radiobox
+            name={name}
+            value={value}
+            label={label}
+            description={description}
+            disabled={disabled}
+            checked={checked}
+            singleLine={singleLine}
+            size={size}
+            view={view}
+            onChange={(event) => {
+                event.persist();
+
+                setChecked(event.target.checked);
+                onChange(event);
+            }}
+            onFocus={onFocus}
+            onBlur={onBlur}
+        />
+    );
+};
+
+export const Default: Story = {
+    args: {
+        name: 'Radiobox',
+        label: 'Label',
+        description: 'Description',
+        disabled: false,
+        singleLine: false,
+        size: 's',
+        view: 'accent',
+    },
+    render: (args) => <StoryDefault {...args} />,
+};
+
+const StoryLive = (props: RadioboxProps) => {
+    const [value, setValue] = useState('c');
+
+    return (
+        <>
+            {items.map((item) => (
+                <Radiobox
+                    key={item.value}
+                    name={item.langName}
+                    value={item.value}
+                    label={item.label}
+                    disabled={item.disabled}
+                    checked={value[item.value]}
+                    description={item.description}
+                    onChange={(event) => {
+                        event.persist();
+
+                        setValue(item.value);
+                        onChange(event);
+                    }}
+                    onFocus={onFocus}
+                    onBlur={onBlur}
+                    {...props}
+                />
+            ))}
+        </>
+    );
+};
+
+export const Live: Story = {
+    args: {
+        size: 's',
+        view: 'accent',
+        singleLine: false,
+        focused: true,
+    },
+    render: (args) => <StoryLive {...args} />,
+};

package/emotion/es/components/Radiobox/index.js

@@ -1 +1 @@
-export { Radiobox, RadioGroup } from './Radiobox';
+export { Radiobox, RadioGroup } from './Radiobox';

package/emotion/es/components/Range/Range.config.js

@@ -1,152 +1,23 @@
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--surface-solid-card);\n                ",
-        ": var(--outline-solid-primary);\n                ",
-        ": var(--outline-negative);\n                ",
-        ": var(--outline-accent);\n\n                ",
-        ": var(--text-primary);\n                ",
-        ": var(--text-primary);\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--text-negative);\n                ",
-        ": var(--text-positive);\n\n                ",
-        ": var(--surface-negative);\n\n                ",
-        ": var(--text-primary);\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--text-tertiary);\n                ",
-        ": var(--text-accent);\n\n                ",
-        ": var(--outline-solid-primary-hover);\n                ",
-        ": var(--outline-accent);\n                ",
-        ": var(--outline-negative);\n                ",
-        ": var(--outline-negative);\n                ",
-        ": var(--outline-accent);\n                ",
-        ": var(--outline-accent);\n\n                ",
-        ": var(--text-accent);\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--text-secondary);\n            "
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": 0.625rem;\n                ",
-        ": 0.125rem;\n\n                ",
-        ": 0 0.375rem;\n                ",
-        ": var(--plasma-typo-body-s-font-family);\n                ",
-        ": var(--plasma-typo-body-s-font-style);\n                ",
-        ": var(--plasma-typo-body-s-font-size);\n                ",
-        ": var(--plasma-typo-body-s-bold-font-weight);\n                ",
-        ": var(--plasma-typo-body-s-letter-spacing);\n                ",
-        ": var(--plasma-typo-body-s-line-height);\n\n                ",
-        ": 0 0.375rem 0 0.75rem;\n                ",
-        ": 0;\n\n                ",
-        ": 0.5rem;\n\n                ",
-        ": var(--plasma-typo-body-s-font-family);\n                ",
-        ": var(--plasma-typo-body-s-font-style);\n                ",
-        ": var(--plasma-typo-body-s-font-size);\n                ",
-        ": var(--plasma-typo-body-s-font-weight);\n                ",
-        ": var(--plasma-typo-body-s-letter-spacing);\n                ",
-        ": var(--plasma-typo-body-s-line-height);\n\n                ",
-        ": 0.375rem;\n                ",
-        ": 0.375rem;\n                ",
-        ": 0 0 0 0;\n                ",
-        ": 0.3125rem auto auto -0.6875rem;\n                ",
-        ": 0 0 auto auto;\n                ",
-        ": 0.25rem -0.625rem auto auto;\n\n                ",
-        ": 2.5rem;\n                ",
-        ": 0.625rem;\n                ",
-        ": 0.125rem;\n                ",
-        ": 0.6875rem 0.75rem 0.6875rem 0.75rem;\n                ",
-        ": var(--plasma-typo-body-m-font-family);\n                ",
-        ": var(--plasma-typo-body-m-font-style);\n                ",
-        ": var(--plasma-typo-body-m-font-size);\n                ",
-        ": var(--plasma-typo-body-m-font-weight);\n                ",
-        ": var(--plasma-typo-body-m-letter-spacing);\n                ",
-        ": var(--plasma-typo-body-m-line-height);\n\n                ",
-        ": 0.25rem 0 0 0;\n                ",
-        ": var(--plasma-typo-body-s-font-family);\n                ",
-        ": var(--plasma-typo-body-s-font-style);\n                ",
-        ": var(--plasma-typo-body-s-font-size);\n                ",
-        ": var(--plasma-typo-body-s-font-weight);\n                ",
-        ": var(--plasma-typo-body-s-letter-spacing);\n                ",
-        ": var(--plasma-typo-body-s-line-height);\n\n                ",
-        ": -0.1875rem 0.25rem -0.1875rem -0.125rem;\n                ",
-        ": -0.1875rem -0.125rem -0.1875rem 0.75rem;\n                ",
-        ": 0 0.25rem 0 0;\n                ",
-        ": 0 0 0 0.25rem;\n            "
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": 1;\n                ",
-        ": var(--surface-solid-primary);\n                ",
-        ": var(--surface-solid-primary);\n                ",
-        ": var(--surface-solid-primary);\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--text-secondary);\n            "
-    ]);
-    _templateObject2 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject3() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--surface-solid-card);\n                ",
-        ": var(--text-primary);\n                ",
-        ": var(--outline-solid-primary);\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--text-secondary);\n                ",
-        ": 1;\n                ",
-        ": 1;\n                ",
-        ": 0.4;\n\n                ",
-        ": var(--text-primary);\n                ",
-        ": transparent;\n                ",
-        ": var(--text-secondary);\n            "
-    ]);
-    _templateObject3 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { css, rangeTokens as tokens } from '@salutejs/plasma-new-hope/emotion';
 export var config = {
-    defaults: {
-        view: 'default',
-        size: 's'
+  defaults: {
+    view: 'default',
+    size: 's'
+  },
+  variations: {
+    view: {
+      "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--surface-solid-card);\n                ", ": var(--outline-solid-primary);\n                ", ": var(--outline-negative);\n                ", ": var(--outline-accent);\n\n                ", ": var(--text-primary);\n                ", ": var(--text-primary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-negative);\n                ", ": var(--text-positive);\n\n                ", ": var(--surface-negative);\n\n                ", ": var(--text-primary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-accent);\n\n                ", ": var(--outline-solid-primary-hover);\n                ", ": var(--outline-accent);\n                ", ": var(--outline-negative);\n                ", ": var(--outline-negative);\n                ", ": var(--outline-accent);\n                ", ": var(--outline-accent);\n\n                ", ": var(--text-accent);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n            "])), tokens.background, tokens.borderColor, tokens.borderColorError, tokens.borderColorSuccess, tokens.dividerColor, tokens.labelColor, tokens.leftHelperColor, tokens.leftHelperColorError, tokens.leftHelperColorSuccess, tokens.indicatorColor, tokens.textFieldColor, tokens.textFieldPlaceholderColor, tokens.textFieldPlaceholderColorFocus, tokens.textFieldCaretColor, tokens.textFieldBorderColorHover, tokens.textFieldBorderColorFocus, tokens.textFieldBorderColorError, tokens.textFieldBorderColorErrorFocus, tokens.textFieldBorderColorSuccess, tokens.textFieldBorderColorSuccessFocus, tokens.focusColor, tokens.textFieldTextAfterColor, tokens.textFieldTextBeforeColor)
+    },
+    size: {
+      s: /*#__PURE__*/css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 0.625rem;\n                ", ": 0.125rem;\n\n                ", ": 0 0.375rem;\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-s-bold-font-weight);\n                ", ": var(--plasma-typo-body-s-letter-spacing);\n                ", ": var(--plasma-typo-body-s-line-height);\n\n                ", ": 0 0.375rem 0 0.75rem;\n                ", ": 0;\n\n                ", ": 0.5rem;\n\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-s-font-weight);\n                ", ": var(--plasma-typo-body-s-letter-spacing);\n                ", ": var(--plasma-typo-body-s-line-height);\n\n                ", ": 0.375rem;\n                ", ": 0.375rem;\n                ", ": 0 0 0 0;\n                ", ": 0.3125rem auto auto -0.6875rem;\n                ", ": 0 0 auto auto;\n                ", ": 0.25rem -0.625rem auto auto;\n\n                ", ": 2.5rem;\n                ", ": 0.625rem;\n                ", ": 0.125rem;\n                ", ": 0.6875rem 0.75rem 0.6875rem 0.75rem;\n                ", ": var(--plasma-typo-body-m-font-family);\n                ", ": var(--plasma-typo-body-m-font-style);\n                ", ": var(--plasma-typo-body-m-font-size);\n                ", ": var(--plasma-typo-body-m-font-weight);\n                ", ": var(--plasma-typo-body-m-letter-spacing);\n                ", ": var(--plasma-typo-body-m-line-height);\n\n                ", ": 0.25rem 0 0 0;\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-s-font-weight);\n                ", ": var(--plasma-typo-body-s-letter-spacing);\n                ", ": var(--plasma-typo-body-s-line-height);\n\n                ", ": -0.1875rem 0.25rem -0.1875rem -0.125rem;\n                ", ": -0.1875rem -0.125rem -0.1875rem 0.75rem;\n                ", ": 0 0.25rem 0 0;\n                ", ": 0 0 0 0.25rem;\n            "])), tokens.borderRadius, tokens.borderWidth, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.indicatorSize, tokens.indicatorSizeOuter, tokens.indicatorPlacement, tokens.indicatorOuterPlacement, tokens.indicatorPlacementRight, tokens.indicatorOuterPlacementRight, tokens.textFieldHeight, tokens.textFieldBorderRadius, tokens.textFieldBorderWidth, tokens.textFieldPadding, tokens.textFieldFontFamily, tokens.textFieldFontStyle, tokens.textFieldFontSize, tokens.textFieldFontWeight, tokens.textFieldLetterSpacing, tokens.textFieldLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontStyle, tokens.leftHelperFontSize, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.textFieldLeftContentMargin, tokens.textFieldRightContentMargin, tokens.textFieldTextBeforeMargin, tokens.textFieldTextAfterMargin)
+    },
+    disabled: {
+      "true": /*#__PURE__*/css(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 1;\n                ", ": var(--surface-solid-primary);\n                ", ": var(--surface-solid-primary);\n                ", ": var(--surface-solid-primary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n            "])), tokens.disabledOpacity, tokens.background, tokens.borderColor, tokens.textFieldBorderColorFocus, tokens.textFieldColor, tokens.textFieldPlaceholderColor)
     },
-    variations: {
-        view: {
-            default: css(_templateObject(), tokens.background, tokens.borderColor, tokens.borderColorError, tokens.borderColorSuccess, tokens.dividerColor, tokens.labelColor, tokens.leftHelperColor, tokens.leftHelperColorError, tokens.leftHelperColorSuccess, tokens.indicatorColor, tokens.textFieldColor, tokens.textFieldPlaceholderColor, tokens.textFieldPlaceholderColorFocus, tokens.textFieldCaretColor, tokens.textFieldBorderColorHover, tokens.textFieldBorderColorFocus, tokens.textFieldBorderColorError, tokens.textFieldBorderColorErrorFocus, tokens.textFieldBorderColorSuccess, tokens.textFieldBorderColorSuccessFocus, tokens.focusColor, tokens.textFieldTextAfterColor, tokens.textFieldTextBeforeColor)
-        },
-        size: {
-            s: css(_templateObject1(), tokens.borderRadius, tokens.borderWidth, tokens.dividerPadding, tokens.dividerFontFamily, tokens.dividerFontStyle, tokens.dividerFontSize, tokens.dividerFontWeight, tokens.dividerLetterSpacing, tokens.dividerLineHeight, tokens.leftContentMargin, tokens.rightContentMargin, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontStyle, tokens.labelFontSize, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.indicatorSize, tokens.indicatorSizeOuter, tokens.indicatorPlacement, tokens.indicatorOuterPlacement, tokens.indicatorPlacementRight, tokens.indicatorOuterPlacementRight, tokens.textFieldHeight, tokens.textFieldBorderRadius, tokens.textFieldBorderWidth, tokens.textFieldPadding, tokens.textFieldFontFamily, tokens.textFieldFontStyle, tokens.textFieldFontSize, tokens.textFieldFontWeight, tokens.textFieldLetterSpacing, tokens.textFieldLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontStyle, tokens.leftHelperFontSize, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.textFieldLeftContentMargin, tokens.textFieldRightContentMargin, tokens.textFieldTextBeforeMargin, tokens.textFieldTextAfterMargin)
-        },
-        disabled: {
-            true: css(_templateObject2(), tokens.disabledOpacity, tokens.background, tokens.borderColor, tokens.textFieldBorderColorFocus, tokens.textFieldColor, tokens.textFieldPlaceholderColor)
-        },
-        readOnly: {
-            true: css(_templateObject3(), tokens.backgroundReadOnly, tokens.labelColorReadOnly, tokens.borderColorReadOnly, tokens.leftHelperColorReadOnly, tokens.dividerColorReadOnly, tokens.readOnlyOpacity, tokens.dividerOpacityReadOnly, tokens.rightContentOpacityReadOnly, tokens.textFieldColorReadOnly, tokens.textFieldBackgroundColorReadOnly, tokens.textFieldPlaceholderColorReadOnly)
-        }
+    readOnly: {
+      "true": /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--surface-solid-card);\n                ", ": var(--text-primary);\n                ", ": var(--outline-solid-primary);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary);\n                ", ": 1;\n                ", ": 1;\n                ", ": 0.4;\n\n                ", ": var(--text-primary);\n                ", ": transparent;\n                ", ": var(--text-secondary);\n            "])), tokens.backgroundReadOnly, tokens.labelColorReadOnly, tokens.borderColorReadOnly, tokens.leftHelperColorReadOnly, tokens.dividerColorReadOnly, tokens.readOnlyOpacity, tokens.dividerOpacityReadOnly, tokens.rightContentOpacityReadOnly, tokens.textFieldColorReadOnly, tokens.textFieldBackgroundColorReadOnly, tokens.textFieldPlaceholderColorReadOnly)
     }
-};
+  }
+};

package/emotion/es/components/Range/Range.js

@@ -1,6 +1,8 @@
 import { rangeConfig, component, mergeConfig } from '@salutejs/plasma-new-hope/emotion';
 import { config } from './Range.config';
-var mergedConfig = mergeConfig(rangeConfig, config);
+var mergedConfig = /*#__PURE__*/mergeConfig(rangeConfig, config);
+
 /**
  * Компонент Range.
- */ export var Range = component(mergedConfig);
+ */
+export var Range = /*#__PURE__*/component(mergedConfig);