@salutejs/sdds-cs 0.319.0-canary.2020.15831403447.0 → 0.319.0-canary.2021.15776478579.0

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

@@ -1,209 +1,28 @@
-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-text-m-font-family);\n                ",
-        ": var(--text-primary);\n                ",
-        ": var(--text-primary-hover);\n                ",
-        ": var(--text-primary-active);\n                ",
-        ": var(--text-primary);\n                ",
-        ": var(--text-primary-hover);\n                ",
-        ": var(--text-primary-active);\n                ",
-        ": 0;\n            "
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--plasma-typo-text-m-font-family);\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--text-secondary-hover);\n                ",
-        ": var(--text-secondary-active);\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--text-secondary-hover);\n                ",
-        ": var(--text-secondary-active);\n                ",
-        ": 0;\n            "
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--plasma-typo-text-m-font-family);\n                ",
-        ": var(--text-tertiary);\n                ",
-        ": var(--text-tertiary-hover);\n                ",
-        ": var(--text-tertiary-active);\n                ",
-        ": var(--text-tertiary);\n                ",
-        ": var(--text-tertiary-hover);\n                ",
-        ": var(--text-tertiary-active);\n                ",
-        ": 0;\n            "
-    ]);
-    _templateObject2 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject3() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--plasma-typo-text-m-font-family);\n                ",
-        ": var(--text-paragraph);\n                ",
-        ": var(--text-paragraph-hover);\n                ",
-        ": var(--text-paragraph-active);\n                ",
-        ": var(--text-paragraph);\n                ",
-        ": var(--text-paragraph-hover);\n                ",
-        ": var(--text-paragraph-active);\n                ",
-        ": 0;\n            "
-    ]);
-    _templateObject3 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject4() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--plasma-typo-text-m-font-family);\n                ",
-        ": var(--text-accent);\n                ",
-        ": #1a9e32;\n                ",
-        ": var(--text-accent-active);\n                ",
-        ": var(--text-accent);\n                ",
-        ": #1a9e32;\n                ",
-        ": var(--text-accent-active);\n                ",
-        ": 0;\n            "
-    ]);
-    _templateObject4 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject5() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--plasma-typo-text-m-font-family);\n                ",
-        ": var(--text-positive);\n                ",
-        ": var(--text-positive-hover);\n                ",
-        ": var(--text-positive-active);\n                ",
-        ": var(--text-positive);\n                ",
-        ": var(--text-positive-hover);\n                ",
-        ": var(--text-positive-active);\n                ",
-        ": 0;\n            "
-    ]);
-    _templateObject5 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject6() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--plasma-typo-text-m-font-family);\n                ",
-        ": var(--text-warning);\n                ",
-        ": var(--text-warning-hover);\n                ",
-        ": var(--text-warning-active);\n                ",
-        ": var(--text-warning);\n                ",
-        ": var(--text-warning-hover);\n                ",
-        ": var(--text-warning-active);\n                ",
-        ": 0;\n            "
-    ]);
-    _templateObject6 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject7() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--plasma-typo-text-m-font-family);\n                ",
-        ": var(--text-negative);\n                ",
-        ": var(--text-negative-hover);\n                ",
-        ": var(--text-negative-active);\n                ",
-        ": var(--text-negative);\n                ",
-        ": var(--text-negative-hover);\n                ",
-        ": var(--text-negative-active);\n                ",
-        ": 0;\n            "
-    ]);
-    _templateObject7 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject8() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--plasma-typo-text-m-font-family);\n                ",
-        ":inherit;\n                ",
-        ": inherit;\n                ",
-        ": inherit;\n                ",
-        ": inherit;\n                ",
-        ": inherit;\n                ",
-        ": inherit;\n                ",
-        ": 0.063rem;\n            "
-    ]);
-    _templateObject8 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject9() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": 0.4;\n            "
-    ]);
-    _templateObject9 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject10() {
-    var data = _tagged_template_literal([
-        "\n                ",
-        ": var(--text-primary);\n            "
-    ]);
-    _templateObject10 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { css, linkTokens as tokens } from '@salutejs/plasma-new-hope/emotion';
 export var config = {
-    defaults: {
-        view: 'default',
-        focused: 'true'
+  defaults: {
+    view: 'default',
+    focused: 'true'
+  },
+  variations: {
+    view: {
+      "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--plasma-typo-text-m-font-family);\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-hover);\n                ", ": var(--text-primary-active);\n                ", ": var(--text-primary);\n                ", ": var(--text-primary-hover);\n                ", ": var(--text-primary-active);\n                ", ": 0;\n            "])), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
+      secondary: /*#__PURE__*/css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--plasma-typo-text-m-font-family);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n                ", ": 0;\n            "])), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
+      tertiary: /*#__PURE__*/css(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--plasma-typo-text-m-font-family);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary-hover);\n                ", ": var(--text-tertiary-active);\n                ", ": var(--text-tertiary);\n                ", ": var(--text-tertiary-hover);\n                ", ": var(--text-tertiary-active);\n                ", ": 0;\n            "])), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
+      paragraph: /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--plasma-typo-text-m-font-family);\n                ", ": var(--text-paragraph);\n                ", ": var(--text-paragraph-hover);\n                ", ": var(--text-paragraph-active);\n                ", ": var(--text-paragraph);\n                ", ": var(--text-paragraph-hover);\n                ", ": var(--text-paragraph-active);\n                ", ": 0;\n            "])), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
+      accent: /*#__PURE__*/css(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--plasma-typo-text-m-font-family);\n                ", ": var(--text-accent);\n                ", ": #1a9e32;\n                ", ": var(--text-accent-active);\n                ", ": var(--text-accent);\n                ", ": #1a9e32;\n                ", ": var(--text-accent-active);\n                ", ": 0;\n            "])), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
+      positive: /*#__PURE__*/css(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--plasma-typo-text-m-font-family);\n                ", ": var(--text-positive);\n                ", ": var(--text-positive-hover);\n                ", ": var(--text-positive-active);\n                ", ": var(--text-positive);\n                ", ": var(--text-positive-hover);\n                ", ": var(--text-positive-active);\n                ", ": 0;\n            "])), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
+      warning: /*#__PURE__*/css(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--plasma-typo-text-m-font-family);\n                ", ": var(--text-warning);\n                ", ": var(--text-warning-hover);\n                ", ": var(--text-warning-active);\n                ", ": var(--text-warning);\n                ", ": var(--text-warning-hover);\n                ", ": var(--text-warning-active);\n                ", ": 0;\n            "])), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
+      negative: /*#__PURE__*/css(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--plasma-typo-text-m-font-family);\n                ", ": var(--text-negative);\n                ", ": var(--text-negative-hover);\n                ", ": var(--text-negative-active);\n                ", ": var(--text-negative);\n                ", ": var(--text-negative-hover);\n                ", ": var(--text-negative-active);\n                ", ": 0;\n            "])), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
+      clear: /*#__PURE__*/css(_templateObject9 || (_templateObject9 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--plasma-typo-text-m-font-family);\n                ", ":inherit;\n                ", ": inherit;\n                ", ": inherit;\n                ", ": inherit;\n                ", ": inherit;\n                ", ": inherit;\n                ", ": 0.063rem;\n            "])), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder)
+    },
+    disabled: {
+      "true": /*#__PURE__*/css(_templateObject10 || (_templateObject10 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": 0.4;\n            "])), tokens.linkDisabledOpacity)
     },
-    variations: {
-        view: {
-            default: css(_templateObject(), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
-            secondary: css(_templateObject1(), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
-            tertiary: css(_templateObject2(), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
-            paragraph: css(_templateObject3(), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
-            accent: css(_templateObject4(), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
-            positive: css(_templateObject5(), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
-            warning: css(_templateObject6(), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
-            negative: css(_templateObject7(), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder),
-            clear: css(_templateObject8(), tokens.linkFontFamily, tokens.linkColor, tokens.linkColorHover, tokens.linkColorActive, tokens.linkColorVisited, tokens.linkColorVisitedHover, tokens.linkColorVisitedActive, tokens.linkUnderlineBorder)
-        },
-        disabled: {
-            true: css(_templateObject9(), tokens.linkDisabledOpacity)
-        },
-        focused: {
-            true: css(_templateObject10(), tokens.linkColorFocus)
-        }
+    focused: {
+      "true": /*#__PURE__*/css(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": var(--text-primary);\n            "])), tokens.linkColorFocus)
     }
-};
+  }
+};

package/emotion/es/components/Link/Link.js

@@ -1,7 +1,8 @@
 import { linkConfig, component, mergeConfig } from '@salutejs/plasma-new-hope/emotion';
 import { config } from './Link.config';
-var mergedConfig = mergeConfig(linkConfig, config);
-var LinkComponent = component(mergedConfig);
+var mergedConfig = /*#__PURE__*/mergeConfig(linkConfig, config);
+var LinkComponent = /*#__PURE__*/component(mergedConfig);
 /**
  * Ссылка.
- */ export var Link = LinkComponent;
+ */
+export var Link = LinkComponent;

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

@@ -0,0 +1,57 @@
+import React, { ComponentProps } from 'react';
+import type { StoryObj, Meta } from '@storybook/react';
+import { InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+
+import { TextM } from '../Typography';
+
+import { Link } from '.';
+
+const meta: Meta<typeof Link> = {
+    title: 'Navigation/Link',
+    decorators: [InSpacingDecorator],
+    component: Link,
+    argTypes: {
+        view: {
+            options: [
+                'default',
+                'secondary',
+                'tertiary',
+                'paragraph',
+                'accent',
+                'positive',
+                'warning',
+                'negative',
+                'clear',
+            ],
+            control: {
+                type: 'select',
+            },
+        },
+    },
+};
+
+export default meta;
+
+type StoryLinkProps = {
+    text: string;
+    href: string;
+} & ComponentProps<typeof Link>;
+
+export const Default: StoryObj<StoryLinkProps> = {
+    args: {
+        text: 'приложение',
+        href: 'https://google.com',
+        view: 'default',
+        disabled: false,
+        focused: true,
+    },
+    render: ({ text, ...props }) => (
+        <TextM>
+            Скачайте{' '}
+            <Link target="_blank" {...props}>
+                {text}
+            </Link>
+            .
+        </TextM>
+    ),
+};

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

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

package/emotion/es/components/Mask/Mask.js

@@ -1,3 +1,3 @@
 import { composeMask } from '@salutejs/plasma-new-hope/emotion';
 import { TextField } from '../TextField';
-export var Mask = composeMask(TextField);
+export var Mask = /*#__PURE__*/composeMask(TextField);

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

@@ -0,0 +1,176 @@
+import React from 'react';
+import type { ComponentProps } from 'react';
+import type { StoryObj, Meta } from '@storybook/react';
+import { action } from '@storybook/addon-actions';
+import { InSpacingDecorator, disableProps } from '@salutejs/plasma-sb-utils';
+
+import { Mask } from './Mask';
+
+const onChange = action('onChange');
+
+const sizes = ['s'];
+const views = ['default', 'positive', 'warning', 'negative'];
+
+const propsToDisable = [
+    'helperBlock',
+    'contentLeft',
+    'htmlSize',
+    'contentRight',
+    'onChangeChips',
+    'onSearch',
+    'type',
+    'name',
+    'onFocus',
+    'onBlur',
+    'onChange',
+    'value',
+    'checked',
+    'minLength',
+    'caption',
+    'values',
+    'enumerationType',
+    'chips',
+    'label',
+];
+
+const meta: Meta<typeof Mask> = {
+    title: 'Data Display/Mask',
+    component: Mask,
+    decorators: [InSpacingDecorator],
+    argTypes: {
+        requiredPlacement: {
+            options: ['left', 'right'],
+            control: {
+                type: 'select',
+            },
+        },
+        required: {
+            control: {
+                type: 'boolean',
+            },
+            if: { arg: 'optional', truthy: false },
+        },
+        hasRequiredIndicator: {
+            control: {
+                type: 'boolean',
+            },
+            if: {
+                arg: 'required',
+                truthy: true,
+            },
+        },
+        optional: {
+            control: {
+                type: 'boolean',
+            },
+            if: { arg: 'required', truthy: false },
+        },
+        view: {
+            options: views,
+            control: {
+                type: 'select',
+            },
+        },
+        size: {
+            options: sizes,
+            control: {
+                type: 'inline-radio',
+            },
+        },
+        ...disableProps(propsToDisable),
+    },
+};
+
+export default meta;
+
+type StoryPropsDefault = Omit<
+    ComponentProps<typeof Mask>,
+    | 'helperBlock'
+    | 'contentLeft'
+    | 'htmlSize'
+    | 'contentRight'
+    | 'type'
+    | 'name'
+    | 'onFocus'
+    | 'onBlur'
+    | 'onChange'
+    | 'value'
+    | 'checked'
+    | 'maxLength'
+    | 'minLength'
+    | 'enumerationType'
+    | 'chips'
+    | 'onChangeChips'
+>;
+
+const StoryDemo = ({ view, ...rest }: StoryPropsDefault) => {
+    return (
+        <div style={{ display: 'flex', flexDirection: 'column', gap: '2rem', width: '50%' }}>
+            <Mask
+                label="Маска телефона"
+                mask="+7 (000) 000 - 00 - 00"
+                maskChar="_"
+                showStartChars={false}
+                view={view}
+                onChange={onChange}
+                {...rest}
+            />
+
+            <Mask
+                label="Маска телефона: отображается всегда"
+                mask="+7 (000) 000 - 00 - 00"
+                maskChar="_"
+                view={view}
+                alwaysShowMask
+                onChange={onChange}
+                {...rest}
+            />
+
+            <Mask
+                label="Маска даты"
+                mask="00/00/0000"
+                maskString="DD/MM/YYYY"
+                alwaysShowMask
+                view={view}
+                onChange={onChange}
+                {...rest}
+            />
+
+            <Mask
+                label="Маска даты: значения по умолчанию"
+                // eslint-disable-next-line no-octal-escape
+                mask="12.\04.0000"
+                maskChar="_"
+                alwaysShowMask
+                view={view}
+                onChange={onChange}
+                {...rest}
+            />
+
+            <Mask
+                label="Маска времени"
+                mask="00:00"
+                maskChar="_"
+                alwaysShowMask
+                view={view}
+                onChange={onChange}
+                {...rest}
+            />
+        </div>
+    );
+};
+
+export const Default: StoryObj<StoryPropsDefault> = {
+    args: {
+        size: 's',
+        view: 'default',
+        placeholder: 'Заполните поле',
+        disabled: false,
+        readOnly: false,
+        required: false,
+        requiredPlacement: 'right',
+        hasRequiredIndicator: true,
+        optional: false,
+    },
+    render: (args) => <StoryDemo {...args} />,
+};

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

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

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

@@ -1,41 +1,13 @@
-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                ",
-        ": rgba(35, 35, 35, 0.2);\n                ",
-        ": var(--overlay-soft);\n                ",
-        ": var(--surface-solid-card);\n                ",
-        ": 1.25rem;\n                ",
-        ": 2rem;\n                ",
-        ": 0.625rem;\n                ",
-        ": 0.375rem;\n                ",
-        ": var(--text-secondary);\n                ",
-        ": var(--text-secondary-hover);\n                ",
-        ": var(--text-secondary-active);\n                ",
-        ": var(--surface-accent);\n            "
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
+var _templateObject;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { css, modalTokens } from '@salutejs/plasma-new-hope/emotion';
 export var config = {
-    defaults: {
-        view: 'default'
-    },
-    variations: {
-        view: {
-            default: css(_templateObject(), modalTokens.modalOverlayWithBlurColor, modalTokens.modalOverlayColor, modalTokens.modalBodyBackground, modalTokens.modalBodyBorderRadius, modalTokens.modalBodyPadding, modalTokens.modalContentPadding, modalTokens.modalCloseButtonRadius, modalTokens.modalCloseButtonColor, modalTokens.modalCloseButtonHoverColor, modalTokens.modalCloseButtonActiveColor, modalTokens.modalOutlineFocusColor)
-        }
+  defaults: {
+    view: 'default'
+  },
+  variations: {
+    view: {
+      "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n                ", ": rgba(35, 35, 35, 0.2);\n                ", ": var(--overlay-soft);\n                ", ": var(--surface-solid-card);\n                ", ": 1.25rem;\n                ", ": 2rem;\n                ", ": 0.625rem;\n                ", ": 0.375rem;\n                ", ": var(--text-secondary);\n                ", ": var(--text-secondary-hover);\n                ", ": var(--text-secondary-active);\n                ", ": var(--surface-accent);\n            "])), modalTokens.modalOverlayWithBlurColor, modalTokens.modalOverlayColor, modalTokens.modalBodyBackground, modalTokens.modalBodyBorderRadius, modalTokens.modalBodyPadding, modalTokens.modalContentPadding, modalTokens.modalCloseButtonRadius, modalTokens.modalCloseButtonColor, modalTokens.modalCloseButtonHoverColor, modalTokens.modalCloseButtonActiveColor, modalTokens.modalOutlineFocusColor)
     }
-};
+  }
+};

package/emotion/es/components/Modal/Modal.js

@@ -1,7 +1,9 @@
 import { modalConfig, component, mergeConfig } from '@salutejs/plasma-new-hope/emotion';
 import { config } from './Modal.config';
-var mergedConfig = mergeConfig(modalConfig, config);
-var ModalComponent = component(mergedConfig);
+var mergedConfig = /*#__PURE__*/mergeConfig(modalConfig, config);
+var ModalComponent = /*#__PURE__*/component(mergedConfig);
+
 /**
  * Модальное окно.
- */ export var Modal = ModalComponent;
+ */
+export var Modal = ModalComponent;