@salutejs/sdds-cs 0.319.0-canary.1741.15776056320.0 → 0.319.0-canary.1973.15679545656.0

package/emotion/cjs/components/Steps/Steps.config.js

@@ -1,110 +1,23 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  value: true
 });
-Object.defineProperty(exports, "config", {
-    enumerable: true,
-    get: function() {
-        return config;
-    }
-});
-var _emotion = require("@salutejs/plasma-new-hope/emotion");
-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(--text-accent);\n                ",
-        ": var(--text-accent);\n                ",
-        ": solid var(--text-accent);\n                ",
-        ": var(--text-positive);\n                ",
-        ": var(--surface-clear);\n\n                ",
-        ": var(--inverse-text-primary);\n                ",
-        ": var(--inverse-text-primary);\n                ",
-        ": var(--surface-accent);\n                ",
-        ": var(--surface-accent-hover);\n\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--text-secondary-hover);\n                ",
-        ": var(--text-primary);\n                ",
-        ": var(--text-primary);\n                ",
-        ": var(--outline-solid-primary);\n                ",
-        ": #e9eef2;\n\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--surface-accent);\n\n                ",
-        ": var(--text-positive);\n\n                ",
-        ": 0.4;\n            "
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": 1.5rem;\n                ",
-        ": 1.5rem;\n                ",
-        ": 0.5rem;\n                ",
-        ": 1rem;\n\n                ",
-        ": 0.5rem;\n                ",
-        ": 0.25rem;\n                ",
-        ": 1.5rem;\n                ",
-        ": 0.5rem;\n                ",
-        ": 1rem;\n\n                ",
-        ": 0.5rem;\n                ",
-        ": 0.5rem;\n                ",
-        ": 1rem;\n                ",
-        ": 0.75rem;\n\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\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\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\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\n                ",
-        ": 0.125rem;\n            "
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-var config = {
-    defaults: {
-        size: 's',
-        view: 'default'
+exports.config = void 0;
+var _emotion = /*#__PURE__*/require("@salutejs/plasma-new-hope/emotion");
+var _templateObject, _templateObject2;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var config = exports.config = {
+  defaults: {
+    size: 's',
+    view: 'default'
+  },
+  variations: {
+    view: {
+      "default": /*#__PURE__*/(0, _emotion.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-accent);\n                ", ": var(--text-accent);\n                ", ": solid var(--text-accent);\n                ", ": var(--text-positive);\n                ", ": var(--surface-clear);\n\n                ", ": var(--inverse-text-primary);\n                ", ": var(--inverse-text-primary);\n                ", ": var(--surface-accent);\n                ", ": var(--surface-accent-hover);\n\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-primary);\n                ", ": var(--text-primary);\n                ", ": var(--outline-solid-primary);\n                ", ": #e9eef2;\n\n                ", ": var(--text-secondary);\n                ", ": var(--surface-accent);\n\n                ", ": var(--text-positive);\n\n                ", ": 0.4;\n            "])), _emotion.stepsTokens.activeTitleColor, _emotion.stepsTokens.activeTitleColorHover, _emotion.stepsTokens.activeIndicatorBorder, _emotion.stepsTokens.activeIndicatorColor, _emotion.stepsTokens.activeIndicatorBackground, _emotion.stepsTokens.completedIndicatorColor, _emotion.stepsTokens.completedIndicatorColorHover, _emotion.stepsTokens.completedIndicatorBackground, _emotion.stepsTokens.completedIndicatorBackgroundHover, _emotion.stepsTokens.inactiveTitleColor, _emotion.stepsTokens.inactiveTitleColorHover, _emotion.stepsTokens.inactiveIndicatorColor, _emotion.stepsTokens.inactiveIndicatorColorHover, _emotion.stepsTokens.inactiveIndicatorBackground, _emotion.stepsTokens.inactiveIndicatorBackgroundHover, _emotion.stepsTokens.contentColor, _emotion.stepsTokens.focusColor, _emotion.stepsTokens.dividerColor, _emotion.stepsTokens.disabledOpacity)
     },
-    variations: {
-        view: {
-            default: (0, _emotion.css)(_templateObject(), _emotion.stepsTokens.activeTitleColor, _emotion.stepsTokens.activeTitleColorHover, _emotion.stepsTokens.activeIndicatorBorder, _emotion.stepsTokens.activeIndicatorColor, _emotion.stepsTokens.activeIndicatorBackground, _emotion.stepsTokens.completedIndicatorColor, _emotion.stepsTokens.completedIndicatorColorHover, _emotion.stepsTokens.completedIndicatorBackground, _emotion.stepsTokens.completedIndicatorBackgroundHover, _emotion.stepsTokens.inactiveTitleColor, _emotion.stepsTokens.inactiveTitleColorHover, _emotion.stepsTokens.inactiveIndicatorColor, _emotion.stepsTokens.inactiveIndicatorColorHover, _emotion.stepsTokens.inactiveIndicatorBackground, _emotion.stepsTokens.inactiveIndicatorBackgroundHover, _emotion.stepsTokens.contentColor, _emotion.stepsTokens.focusColor, _emotion.stepsTokens.dividerColor, _emotion.stepsTokens.disabledOpacity)
-        },
-        size: {
-            s: (0, _emotion.css)(_templateObject1(), _emotion.stepsTokens.indicatorSize, _emotion.stepsTokens.activeIndicatorSize, _emotion.stepsTokens.bulletSize, _emotion.stepsTokens.activeBulletSize, _emotion.stepsTokens.titlePaddingTop, _emotion.stepsTokens.contentPaddingTop, _emotion.stepsTokens.contentSidePadding, _emotion.stepsTokens.contentVerticalPadding, _emotion.stepsTokens.verticalContentPaddingLeft, _emotion.stepsTokens.smallIndicatorIndentHeight, _emotion.stepsTokens.largeIndicatorIndentHeight, _emotion.stepsTokens.smallBulletIndentHeight, _emotion.stepsTokens.largeBulletIndentHeight, _emotion.stepsTokens.indicatorFontFamily, _emotion.stepsTokens.indicatorFontSize, _emotion.stepsTokens.indicatorFontStyle, _emotion.stepsTokens.indicatorFontWeight, _emotion.stepsTokens.indicatorLetterSpacing, _emotion.stepsTokens.indicatorLineHeight, _emotion.stepsTokens.activeIndicatorFontFamily, _emotion.stepsTokens.activeIndicatorFontSize, _emotion.stepsTokens.activeIndicatorFontStyle, _emotion.stepsTokens.activeIndicatorFontWeight, _emotion.stepsTokens.activeIndicatorLetterSpacing, _emotion.stepsTokens.activeIndicatorLineHeight, _emotion.stepsTokens.titleFontFamily, _emotion.stepsTokens.titleFontSize, _emotion.stepsTokens.titleFontStyle, _emotion.stepsTokens.titleFontWeight, _emotion.stepsTokens.titleLetterSpacing, _emotion.stepsTokens.titleLineHeight, _emotion.stepsTokens.contentFontFamily, _emotion.stepsTokens.contentFontSize, _emotion.stepsTokens.contentFontStyle, _emotion.stepsTokens.contentFontWeight, _emotion.stepsTokens.contentLetterSpacing, _emotion.stepsTokens.contentLineHeight, _emotion.stepsTokens.dividerThickness)
-        }
+    size: {
+      s: /*#__PURE__*/(0, _emotion.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 1.5rem;\n                ", ": 1.5rem;\n                ", ": 0.5rem;\n                ", ": 1rem;\n\n                ", ": 0.5rem;\n                ", ": 0.25rem;\n                ", ": 1.5rem;\n                ", ": 0.5rem;\n                ", ": 1rem;\n\n                ", ": 0.5rem;\n                ", ": 0.5rem;\n                ", ": 1rem;\n                ", ": 0.75rem;\n\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\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\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\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\n                ", ": 0.125rem;\n            "])), _emotion.stepsTokens.indicatorSize, _emotion.stepsTokens.activeIndicatorSize, _emotion.stepsTokens.bulletSize, _emotion.stepsTokens.activeBulletSize, _emotion.stepsTokens.titlePaddingTop, _emotion.stepsTokens.contentPaddingTop, _emotion.stepsTokens.contentSidePadding, _emotion.stepsTokens.contentVerticalPadding, _emotion.stepsTokens.verticalContentPaddingLeft, _emotion.stepsTokens.smallIndicatorIndentHeight, _emotion.stepsTokens.largeIndicatorIndentHeight, _emotion.stepsTokens.smallBulletIndentHeight, _emotion.stepsTokens.largeBulletIndentHeight, _emotion.stepsTokens.indicatorFontFamily, _emotion.stepsTokens.indicatorFontSize, _emotion.stepsTokens.indicatorFontStyle, _emotion.stepsTokens.indicatorFontWeight, _emotion.stepsTokens.indicatorLetterSpacing, _emotion.stepsTokens.indicatorLineHeight, _emotion.stepsTokens.activeIndicatorFontFamily, _emotion.stepsTokens.activeIndicatorFontSize, _emotion.stepsTokens.activeIndicatorFontStyle, _emotion.stepsTokens.activeIndicatorFontWeight, _emotion.stepsTokens.activeIndicatorLetterSpacing, _emotion.stepsTokens.activeIndicatorLineHeight, _emotion.stepsTokens.titleFontFamily, _emotion.stepsTokens.titleFontSize, _emotion.stepsTokens.titleFontStyle, _emotion.stepsTokens.titleFontWeight, _emotion.stepsTokens.titleLetterSpacing, _emotion.stepsTokens.titleLineHeight, _emotion.stepsTokens.contentFontFamily, _emotion.stepsTokens.contentFontSize, _emotion.stepsTokens.contentFontStyle, _emotion.stepsTokens.contentFontWeight, _emotion.stepsTokens.contentLetterSpacing, _emotion.stepsTokens.contentLineHeight, _emotion.stepsTokens.dividerThickness)
     }
-};
+  }
+};

package/emotion/cjs/components/Steps/Steps.js

@@ -1,15 +1,11 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  value: true
 });
-Object.defineProperty(exports, "Steps", {
-    enumerable: true,
-    get: function() {
-        return Steps;
-    }
-});
-var _emotion = require("@salutejs/plasma-new-hope/emotion");
-var _Stepsconfig = require("./Steps.config");
-var mergedConfig = (0, _emotion.mergeConfig)(_emotion.stepsConfig, _Stepsconfig.config);
-var StepsComponent = (0, _emotion.component)(mergedConfig);
-var Steps = StepsComponent;
+exports.Steps = void 0;
+var _emotion = /*#__PURE__*/require("@salutejs/plasma-new-hope/emotion");
+var _Steps = /*#__PURE__*/require("./Steps.config");
+var mergedConfig = /*#__PURE__*/(0, _emotion.mergeConfig)(_emotion.stepsConfig, _Steps.config);
+var StepsComponent = /*#__PURE__*/(0, _emotion.component)(mergedConfig);
+var Steps = exports.Steps = StepsComponent;

package/emotion/cjs/components/Steps/Steps.stories.tsx

@@ -0,0 +1,191 @@
+import React, { useState, useEffect } from 'react';
+import type { ComponentProps } from 'react';
+import type { StoryObj, Meta } from '@storybook/react';
+import { InSpacingDecorator, disableProps } from '@salutejs/plasma-sb-utils';
+import { IconMic } from '@salutejs/plasma-icons';
+
+import { Steps } from './Steps';
+
+import type { StepItemProps } from '.';
+
+const meta: Meta<typeof Steps> = {
+    title: 'Navigation/Steps',
+    decorators: [InSpacingDecorator],
+    component: Steps,
+};
+
+export default meta;
+
+type Story = StoryObj<ComponentProps<typeof Steps>>;
+
+const renderIndicator = ({ status, size }) => {
+    let iconSize;
+    if (size === 'xs' || size === 's') {
+        iconSize = 'xs';
+    } else if (status === 'active') {
+        iconSize = 's';
+    } else {
+        iconSize = 'xs';
+    }
+
+    return <IconMic color="inherit" size={iconSize} />;
+};
+
+const DefaultStory = (args) => {
+    const {
+        maxWidth,
+        title,
+        content,
+        size,
+        indicatorType,
+        quantity,
+        hasContent,
+        loading,
+        disabled,
+        simple,
+        ...rest
+    } = args;
+
+    const innerTitle = title || 'Title';
+
+    const [items, setItems] = useState([]);
+
+    useEffect(() => {
+        const newItems = new Array(quantity).fill(null).map((_, index) => {
+            const indicator = index + 1;
+            const status = index === 0 ? 'active' : 'inactive';
+
+            if (simple) {
+                return {
+                    indicator,
+                    status,
+                };
+            }
+
+            return {
+                title: innerTitle,
+                content,
+                indicator,
+                status,
+            };
+        });
+
+        setItems(newItems);
+    }, [loading, quantity, simple]);
+
+    useEffect(() => {
+        setItems((curItems) =>
+            curItems.map((item, index) => {
+                if (indicatorType === 'numbered') {
+                    return simple
+                        ? { ...item, indicator: index + 1 }
+                        : { ...item, title: innerTitle, content, indicator: index + 1 };
+                }
+
+                if (indicatorType === 'bullet') {
+                    return simple
+                        ? { ...item, indicator: undefined }
+                        : { ...item, title: innerTitle, content, indicator: undefined };
+                }
+
+                if (indicatorType === 'icon') {
+                    return simple
+                        ? { ...item, indicator: renderIndicator }
+                        : { ...item, title: innerTitle, content, indicator: renderIndicator };
+                }
+
+                return item;
+            }),
+        );
+    }, [indicatorType, innerTitle, content, simple]);
+
+    useEffect(() => {
+        setItems((curItems) => curItems.map((item) => ({ ...item, disabled })));
+    }, [disabled]);
+
+    const onChange = (item: StepItemProps, index: number, prevIndex: number) => {
+        if (prevIndex !== undefined) {
+            items[prevIndex].status = 'completed';
+        }
+
+        items[index].status = 'active';
+
+        setItems([...items]);
+    };
+
+    return (
+        <div style={{ maxWidth, height: '600px' }}>
+            <Steps
+                size={size}
+                items={items}
+                onChange={onChange}
+                hasLoader={loading}
+                hasContent={hasContent}
+                {...rest}
+            />
+        </div>
+    );
+};
+
+export const Default: Story = {
+    args: {
+        maxWidth: '100%',
+        quantity: 6,
+        size: 's',
+        title: 'Title',
+        content: 'Content',
+        contentAlign: 'left',
+        indicatorType: 'numbered',
+        orientation: 'horizontal',
+        hasLine: true,
+        hasContent: 'all',
+        disabled: false,
+        loading: false,
+        simple: false,
+    },
+    argTypes: {
+        maxWidth: {
+            control: {
+                type: 'text',
+            },
+        },
+        size: {
+            options: ['s'],
+            control: {
+                type: 'inline-radio',
+            },
+        },
+        orientation: {
+            options: ['horizontal', 'vertical'],
+            control: {
+                type: 'inline-radio',
+            },
+        },
+        contentAlign: {
+            options: ['left', 'center'],
+            control: {
+                type: 'inline-radio',
+            },
+            if: { arg: 'orientation', eq: 'horizontal' },
+        },
+        indicatorType: {
+            options: ['numbered', 'bullet', 'icon'],
+            control: {
+                type: 'inline-radio',
+            },
+        },
+        hasContent: {
+            options: ['all', 'active', 'none'],
+            control: {
+                type: 'inline-radio',
+            },
+        },
+        simple: {
+            control: {
+                type: 'boolean',
+            },
+        },
+        ...disableProps(['view', 'size']),
+    },
+    render: (args) => <DefaultStory {...args} />,
+};

package/emotion/cjs/components/Steps/index.js

@@ -1,11 +1,12 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  value: true
 });
 Object.defineProperty(exports, "Steps", {
-    enumerable: true,
-    get: function() {
-        return _Steps.Steps;
-    }
+  enumerable: true,
+  get: function get() {
+    return _Steps.Steps;
+  }
 });
-var _Steps = require("./Steps");
+var _Steps = /*#__PURE__*/require("./Steps");

package/emotion/cjs/components/Switch/Switch.config.js

@@ -1,154 +1,36 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  value: true
 });
-Object.defineProperty(exports, "config", {
-    enumerable: true,
-    get: function() {
-        return config;
-    }
-});
-var _emotion = require("@salutejs/plasma-new-hope/emotion");
-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(--plasma-typo-body-m-font-family);\n                ",
-        ": var(--plasma-typo-body-m-font-style);\n                ",
-        ": var(--plasma-typo-body-m-font-weight);\n                ",
-        ": var(--plasma-typo-body-m-line-height);\n                ",
-        ": var(--plasma-typo-body-m-font-size);\n                ",
-        ": var(--plasma-typo-body-m-letter-spacing);\n                ",
-        ": var(--plasma-typo-body-s-font-family);\n                ",
-        ": var(--plasma-typo-body-s-font-style);\n                ",
-        ": var(--plasma-typo-body-s-font-weight);\n                ",
-        ": var(--plasma-typo-body-s-line-height);\n                ",
-        ": var(--plasma-typo-body-s-font-size);\n                ",
-        ": var(--plasma-typo-body-xs-letter-spacing);\n                ",
-        ": 0.25rem;\n                ",
-        ": 0.75rem;\n            "
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": 3rem;\n                ",
-        ": 1.75rem;\n                ",
-        ": calc(var(",
-        ") / 2);\n                ",
-        ": 1.25rem;\n                ",
-        ": calc(var(",
-        ") / 2);\n                ",
-        ": 0.25rem;\n                ",
-        ": 0.125rem;\n                ",
-        ": 1.25;\n            "
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": 2rem;\n                ",
-        ": 1.25rem;\n                ",
-        ": calc(var(",
-        ") / 2);\n                ",
-        ": 0.75rem;\n                ",
-        ": calc(var(",
-        ") / 2);\n                ",
-        ": 0.25rem;\n                ",
-        ": 0.125rem;\n                ",
-        ": 1.25;\n            "
-    ]);
-    _templateObject2 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject3() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--text-primary);\n                ",
-        ": var(--text-secondary);\n                ",
-        ": 2;\n                ",
-        ": var(--surface-accent);\n                ",
-        ": var(--surface-accent-hover);\n                ",
-        ": var(--surface-solid-card);\n                ",
-        ": var(--surface-solid-card-hover);\n                ",
-        ": 0;\n                ",
-        ": 0.125rem;\n                ",
-        ": var(--outline-accent);\n                ",
-        ": var(--outline-accent-hover);\n                ",
-        ": var(--outline-solid-primary);\n                ",
-        ": var(--outline-solid-primary-hover);\n                ",
-        ": var(--surface-solid-card);\n                ",
-        ": var(--surface-accent);\n                ",
-        ": 0 1px 1px rgba(0, 0, 0, 0.11);\n            "
-    ]);
-    _templateObject3 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject4() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": 0.4;\n            "
-    ]);
-    _templateObject4 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject5() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--surface-accent);\n            "
-    ]);
-    _templateObject5 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-var config = {
-    defaults: {
-        view: 'default',
-        size: 's',
-        toggleSize: 'l',
-        labelPosition: 'before',
-        focused: 'true'
+exports.config = void 0;
+var _emotion = /*#__PURE__*/require("@salutejs/plasma-new-hope/emotion");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var config = exports.config = {
+  defaults: {
+    view: 'default',
+    size: 's',
+    toggleSize: 'l',
+    labelPosition: 'before',
+    focused: 'true'
+  },
+  variations: {
+    size: {
+      s: /*#__PURE__*/(0, _emotion.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--plasma-typo-body-m-font-family);\n                ", ": var(--plasma-typo-body-m-font-style);\n                ", ": var(--plasma-typo-body-m-font-weight);\n                ", ": var(--plasma-typo-body-m-line-height);\n                ", ": var(--plasma-typo-body-m-font-size);\n                ", ": var(--plasma-typo-body-m-letter-spacing);\n                ", ": var(--plasma-typo-body-s-font-family);\n                ", ": var(--plasma-typo-body-s-font-style);\n                ", ": var(--plasma-typo-body-s-font-weight);\n                ", ": var(--plasma-typo-body-s-line-height);\n                ", ": var(--plasma-typo-body-s-font-size);\n                ", ": var(--plasma-typo-body-xs-letter-spacing);\n                ", ": 0.25rem;\n                ", ": 0.75rem;\n            "])), _emotion.switchTokens.fontFamily, _emotion.switchTokens.fontStyle, _emotion.switchTokens.fontWeight, _emotion.switchTokens.lineHeight, _emotion.switchTokens.fontSize, _emotion.switchTokens.letterSpacing, _emotion.switchTokens.descriptionFontFamily, _emotion.switchTokens.descriptionFontStyle, _emotion.switchTokens.descriptionFontWeight, _emotion.switchTokens.descriptionLineHeight, _emotion.switchTokens.descriptionFontSize, _emotion.switchTokens.descriptionLetterSpacing, _emotion.switchTokens.verticalGap, _emotion.switchTokens.labelOffset)
+    },
+    toggleSize: {
+      l: /*#__PURE__*/(0, _emotion.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 3rem;\n                ", ": 1.75rem;\n                ", ": calc(var(", ") / 2);\n                ", ": 1.25rem;\n                ", ": calc(var(", ") / 2);\n                ", ": 0.25rem;\n                ", ": 0.125rem;\n                ", ": 1.25;\n            "])), _emotion.switchTokens.trackWidth, _emotion.switchTokens.trackHeight, _emotion.switchTokens.trackBorderRadius, _emotion.switchTokens.trackHeight, _emotion.switchTokens.thumbSize, _emotion.switchTokens.thumbBorderRadius, _emotion.switchTokens.thumbSize, _emotion.switchTokens.thumbOffsetOn, _emotion.switchTokens.thumbOffsetOff, _emotion.switchTokens.thumbPressScale),
+      s: /*#__PURE__*/(0, _emotion.css)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 2rem;\n                ", ": 1.25rem;\n                ", ": calc(var(", ") / 2);\n                ", ": 0.75rem;\n                ", ": calc(var(", ") / 2);\n                ", ": 0.25rem;\n                ", ": 0.125rem;\n                ", ": 1.25;\n            "])), _emotion.switchTokens.trackWidth, _emotion.switchTokens.trackHeight, _emotion.switchTokens.trackBorderRadius, _emotion.switchTokens.trackHeight, _emotion.switchTokens.thumbSize, _emotion.switchTokens.thumbBorderRadius, _emotion.switchTokens.thumbSize, _emotion.switchTokens.thumbOffsetOn, _emotion.switchTokens.thumbOffsetOff, _emotion.switchTokens.thumbPressScale)
+    },
+    view: {
+      "default": /*#__PURE__*/(0, _emotion.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n                ", ": var(--text-secondary);\n                ", ": 2;\n                ", ": var(--surface-accent);\n                ", ": var(--surface-accent-hover);\n                ", ": var(--surface-solid-card);\n                ", ": var(--surface-solid-card-hover);\n                ", ": 0;\n                ", ": 0.125rem;\n                ", ": var(--outline-accent);\n                ", ": var(--outline-accent-hover);\n                ", ": var(--outline-solid-primary);\n                ", ": var(--outline-solid-primary-hover);\n                ", ": var(--surface-solid-card);\n                ", ": var(--surface-accent);\n                ", ": 0 1px 1px rgba(0, 0, 0, 0.11);\n            "])), _emotion.switchTokens.labelColor, _emotion.switchTokens.descriptionColor, _emotion.switchTokens.descriptionMaxLines, _emotion.switchTokens.trackBackgroundColorOn, _emotion.switchTokens.trackBackgroundColorOnHover, _emotion.switchTokens.trackBackgroundColorOff, _emotion.switchTokens.trackBackgroundColorOffHover, _emotion.switchTokens.trackBorderWidthOn, _emotion.switchTokens.trackBorderWidthOff, _emotion.switchTokens.trackBorderColorOn, _emotion.switchTokens.trackBorderColorOnHover, _emotion.switchTokens.trackBorderColorOff, _emotion.switchTokens.trackBorderColorOffHover, _emotion.switchTokens.thumbBackgroundColorOn, _emotion.switchTokens.thumbBackgroundColorOff, _emotion.switchTokens.thumbBoxShadow)
+    },
+    disabled: {
+      "true": /*#__PURE__*/(0, _emotion.css)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 0.4;\n            "])), _emotion.switchTokens.disabledOpacity)
     },
-    variations: {
-        size: {
-            s: (0, _emotion.css)(_templateObject(), _emotion.switchTokens.fontFamily, _emotion.switchTokens.fontStyle, _emotion.switchTokens.fontWeight, _emotion.switchTokens.lineHeight, _emotion.switchTokens.fontSize, _emotion.switchTokens.letterSpacing, _emotion.switchTokens.descriptionFontFamily, _emotion.switchTokens.descriptionFontStyle, _emotion.switchTokens.descriptionFontWeight, _emotion.switchTokens.descriptionLineHeight, _emotion.switchTokens.descriptionFontSize, _emotion.switchTokens.descriptionLetterSpacing, _emotion.switchTokens.verticalGap, _emotion.switchTokens.labelOffset)
-        },
-        toggleSize: {
-            l: (0, _emotion.css)(_templateObject1(), _emotion.switchTokens.trackWidth, _emotion.switchTokens.trackHeight, _emotion.switchTokens.trackBorderRadius, _emotion.switchTokens.trackHeight, _emotion.switchTokens.thumbSize, _emotion.switchTokens.thumbBorderRadius, _emotion.switchTokens.thumbSize, _emotion.switchTokens.thumbOffsetOn, _emotion.switchTokens.thumbOffsetOff, _emotion.switchTokens.thumbPressScale),
-            s: (0, _emotion.css)(_templateObject2(), _emotion.switchTokens.trackWidth, _emotion.switchTokens.trackHeight, _emotion.switchTokens.trackBorderRadius, _emotion.switchTokens.trackHeight, _emotion.switchTokens.thumbSize, _emotion.switchTokens.thumbBorderRadius, _emotion.switchTokens.thumbSize, _emotion.switchTokens.thumbOffsetOn, _emotion.switchTokens.thumbOffsetOff, _emotion.switchTokens.thumbPressScale)
-        },
-        view: {
-            default: (0, _emotion.css)(_templateObject3(), _emotion.switchTokens.labelColor, _emotion.switchTokens.descriptionColor, _emotion.switchTokens.descriptionMaxLines, _emotion.switchTokens.trackBackgroundColorOn, _emotion.switchTokens.trackBackgroundColorOnHover, _emotion.switchTokens.trackBackgroundColorOff, _emotion.switchTokens.trackBackgroundColorOffHover, _emotion.switchTokens.trackBorderWidthOn, _emotion.switchTokens.trackBorderWidthOff, _emotion.switchTokens.trackBorderColorOn, _emotion.switchTokens.trackBorderColorOnHover, _emotion.switchTokens.trackBorderColorOff, _emotion.switchTokens.trackBorderColorOffHover, _emotion.switchTokens.thumbBackgroundColorOn, _emotion.switchTokens.thumbBackgroundColorOff, _emotion.switchTokens.thumbBoxShadow)
-        },
-        disabled: {
-            true: (0, _emotion.css)(_templateObject4(), _emotion.switchTokens.disabledOpacity)
-        },
-        focused: {
-            true: (0, _emotion.css)(_templateObject5(), _emotion.switchTokens.trackFocusColor)
-        }
+    focused: {
+      "true": /*#__PURE__*/(0, _emotion.css)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--surface-accent);\n            "])), _emotion.switchTokens.trackFocusColor)
     }
-};
+  }
+};

package/emotion/cjs/components/Switch/Switch.js

@@ -1,15 +1,11 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  value: true
 });
-Object.defineProperty(exports, "Switch", {
-    enumerable: true,
-    get: function() {
-        return Switch;
-    }
-});
-var _emotion = require("@salutejs/plasma-new-hope/emotion");
-var _Switchconfig = require("./Switch.config");
-var mergedConfig = (0, _emotion.mergeConfig)(_emotion.switchConfig, _Switchconfig.config);
-var SwitchComponent = (0, _emotion.component)(mergedConfig);
-var Switch = SwitchComponent;
+exports.Switch = void 0;
+var _emotion = /*#__PURE__*/require("@salutejs/plasma-new-hope/emotion");
+var _Switch = /*#__PURE__*/require("./Switch.config");
+var mergedConfig = /*#__PURE__*/(0, _emotion.mergeConfig)(_emotion.switchConfig, _Switch.config);
+var SwitchComponent = /*#__PURE__*/(0, _emotion.component)(mergedConfig);
+var Switch = exports.Switch = SwitchComponent;