@salutejs/sdds-cs 0.238.0-canary.1719.13031725630.0 → 0.238.0-canary.1720.13031638569.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (10) hide show
  1. package/api/sdds-cs.api.md +2 -0
  2. package/components/DatePicker/DatePicker.d.ts +2 -0
  3. package/components/Toast/Toast.config.d.ts +0 -8
  4. package/components/Toast/Toast.config.js +2 -10
  5. package/emotion/cjs/components/Toast/Toast.config.js +2 -10
  6. package/emotion/cjs/components/Toast/Toast.stories.tsx +8 -13
  7. package/emotion/es/components/Toast/Toast.config.js +2 -10
  8. package/emotion/es/components/Toast/Toast.stories.tsx +8 -13
  9. package/es/components/Toast/Toast.config.js +2 -10
  10. package/package.json +3 -3
package/api/sdds-cs.api.md CHANGED
@@ -1320,6 +1320,7 @@ true: PolymorphicClassName;
1320
1320
  }> & DatePickerVariationProps & {
1321
1321
  requiredPlacement?: "right" | "left" | undefined;
1322
1322
  required?: boolean | undefined;
1323
+ value?: Date | null | undefined;
1323
1324
  defaultDate?: Date | undefined;
1324
1325
  placeholder?: string | undefined;
1325
1326
  name?: string | undefined;
@@ -1365,6 +1366,7 @@ true: PolymorphicClassName;
1365
1366
  }> & DatePickerVariationProps & {
1366
1367
  requiredPlacement?: "right" | "left" | undefined;
1367
1368
  required?: boolean | undefined;
1369
+ value?: [Date | null | undefined, Date | null | undefined] | undefined;
1368
1370
  defaultFirstDate?: Date | undefined;
1369
1371
  defaultSecondDate?: Date | undefined;
1370
1372
  name?: string | undefined;
package/components/DatePicker/DatePicker.d.ts CHANGED
@@ -15,6 +15,7 @@ export declare const DatePicker: import("react").FunctionComponent<import("@salu
15
15
  }> & import("@salutejs/plasma-new-hope/types/components/DatePicker/DatePickerBase.types").DatePickerVariationProps & {
16
16
  requiredPlacement?: "right" | "left" | undefined;
17
17
  required?: boolean | undefined;
18
+ value?: Date | null | undefined;
18
19
  defaultDate?: Date | undefined;
19
20
  placeholder?: string | undefined;
20
21
  name?: string | undefined;
@@ -50,6 +51,7 @@ export declare const DatePickerRange: import("react").FunctionComponent<import("
50
51
  }> & import("@salutejs/plasma-new-hope/types/components/DatePicker/DatePickerBase.types").DatePickerVariationProps & {
51
52
  requiredPlacement?: "right" | "left" | undefined;
52
53
  required?: boolean | undefined;
54
+ value?: [Date | null | undefined, Date | null | undefined] | undefined;
53
55
  defaultFirstDate?: Date | undefined;
54
56
  defaultSecondDate?: Date | undefined;
55
57
  name?: string | undefined;
package/components/Toast/Toast.config.d.ts CHANGED
@@ -7,15 +7,7 @@ export declare const config: {
7
7
  variations: {
8
8
  view: {
9
9
  default: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
10
- /**
11
- * @deprecated
12
- * светлый и темный фон регулировать через `view` компонента `ViewContainer`
13
- */
14
10
  dark: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
15
- /**
16
- * @deprecated
17
- * светлый и темный фон регулировать через `view` компонента `ViewContainer`
18
- */
19
11
  light: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
20
12
  };
21
13
  size: {
package/components/Toast/Toast.config.js CHANGED
@@ -16,25 +16,17 @@ var config = exports.config = {
16
16
  variations: {
17
17
  view: {
18
18
  "default": /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card-brightness);\n\n ", ": var(--text-accent);\n ", ": #1A9E32;\n "])), _styledComponents.toastTokens.color, _styledComponents.toastTokens.background, _styledComponents.toastTokens.closeIconColor, _styledComponents.toastTokens.closeIconColorOnHover),
19
- /**
20
- * @deprecated
21
- * светлый и темный фон регулировать через `view` компонента `ViewContainer`
22
- */
23
19
  dark: /*#__PURE__*/(0, _styledComponents.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--on-dark-text-primary);\n ", ": var(--on-dark-surface-solid-primary-brightness);\n\n ", ": var(--on-dark-text-accent);\n ", ": var(--on-dark-text-accent-hover);\n "])), _styledComponents.toastTokens.color, _styledComponents.toastTokens.background, _styledComponents.toastTokens.closeIconColor, _styledComponents.toastTokens.closeIconColorOnHover),
24
- /**
25
- * @deprecated
26
- * светлый и темный фон регулировать через `view` компонента `ViewContainer`
27
- */
28
20
  light: /*#__PURE__*/(0, _styledComponents.css)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--on-light-text-primary);\n ", ": var(--on-light-surface-solid-primary-brightness);\n\n ", ": var(--on-light-text-accent);\n ", ": var(--on-light-text-accent-hover);\n "])), _styledComponents.toastTokens.color, _styledComponents.toastTokens.background, _styledComponents.toastTokens.closeIconColor, _styledComponents.toastTokens.closeIconColorOnHover)
29
21
  },
30
22
  size: {
31
- s: /*#__PURE__*/(0, _styledComponents.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.75rem;\n ", ": calc(100vw - 5rem);\n ", ": 0.5rem 0.75rem;\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 ", ": -0.0625rem 0.5rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.125rem -0.0625rem 0.75rem;\n "])), _styledComponents.toastTokens.borderRadius, _styledComponents.toastTokens.maxWidth, _styledComponents.toastTokens.padding, _styledComponents.toastTokens.fontFamily, _styledComponents.toastTokens.fontSize, _styledComponents.toastTokens.fontStyle, _styledComponents.toastTokens.fontWeight, _styledComponents.toastTokens.letterSpacing, _styledComponents.toastTokens.lineHeight, _styledComponents.toastTokens.contentLeftMargin, _styledComponents.toastTokens.closeIconMargin)
23
+ s: /*#__PURE__*/(0, _styledComponents.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.75rem;\n ", ": calc(100vw - 5rem);\n ", ": 0.5rem 0.75rem;\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 ", ": -0.0625rem 0.5rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.125rem -0.0625rem 0.75rem;\n "])), _styledComponents.toastTokens.borderRadius, _styledComponents.toastTokens.maxWidth, _styledComponents.toastTokens.padding, _styledComponents.toastTokens.fontFamily, _styledComponents.toastTokens.fontSize, _styledComponents.toastTokens.fontStyle, _styledComponents.toastTokens.fontWeight, _styledComponents.toastTokens.letterSpacing, _styledComponents.toastTokens.lineHeight, _styledComponents.toastTokens.leftContentMargin, _styledComponents.toastTokens.closeIconMargin)
32
24
  },
33
25
  closeIconType: {
34
26
  thin: /*#__PURE__*/(0, _styledComponents.css)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n ", ": 1.5rem;\n "])), _styledComponents.toastTokens.closeIconButtonSize, _styledComponents.toastTokens.closeIconSize)
35
27
  },
36
28
  pilled: {
37
- "true": /*#__PURE__*/(0, _styledComponents.css)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n\n ", ": -0.0625rem 0.375rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.25rem -0.0625rem 0.375rem;\n "])), _styledComponents.toastTokens.pilledBorderRadius, _styledComponents.toastTokens.contentLeftMargin, _styledComponents.toastTokens.closeIconMargin)
29
+ "true": /*#__PURE__*/(0, _styledComponents.css)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n\n ", ": -0.0625rem 0.375rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.25rem -0.0625rem 0.375rem;\n "])), _styledComponents.toastTokens.pilledBorderRadius, _styledComponents.toastTokens.leftContentMargin, _styledComponents.toastTokens.closeIconMargin)
38
30
  }
39
31
  }
40
32
  };
package/emotion/cjs/components/Toast/Toast.config.js CHANGED
@@ -16,25 +16,17 @@ var config = exports.config = {
16
16
  variations: {
17
17
  view: {
18
18
  "default": /*#__PURE__*/(0, _emotion.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card-brightness);\n\n ", ": var(--text-accent);\n ", ": #1A9E32;\n "])), _emotion.toastTokens.color, _emotion.toastTokens.background, _emotion.toastTokens.closeIconColor, _emotion.toastTokens.closeIconColorOnHover),
19
- /**
20
- * @deprecated
21
- * светлый и темный фон регулировать через `view` компонента `ViewContainer`
22
- */
23
19
  dark: /*#__PURE__*/(0, _emotion.css)(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--on-dark-text-primary);\n ", ": var(--on-dark-surface-solid-primary-brightness);\n\n ", ": var(--on-dark-text-accent);\n ", ": var(--on-dark-text-accent-hover);\n "])), _emotion.toastTokens.color, _emotion.toastTokens.background, _emotion.toastTokens.closeIconColor, _emotion.toastTokens.closeIconColorOnHover),
24
- /**
25
- * @deprecated
26
- * светлый и темный фон регулировать через `view` компонента `ViewContainer`
27
- */
28
20
  light: /*#__PURE__*/(0, _emotion.css)(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--on-light-text-primary);\n ", ": var(--on-light-surface-solid-primary-brightness);\n\n ", ": var(--on-light-text-accent);\n ", ": var(--on-light-text-accent-hover);\n "])), _emotion.toastTokens.color, _emotion.toastTokens.background, _emotion.toastTokens.closeIconColor, _emotion.toastTokens.closeIconColorOnHover)
29
21
  },
30
22
  size: {
31
- s: /*#__PURE__*/(0, _emotion.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.75rem;\n ", ": calc(100vw - 5rem);\n ", ": 0.5rem 0.75rem;\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 ", ": -0.0625rem 0.5rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.125rem -0.0625rem 0.75rem;\n "])), _emotion.toastTokens.borderRadius, _emotion.toastTokens.maxWidth, _emotion.toastTokens.padding, _emotion.toastTokens.fontFamily, _emotion.toastTokens.fontSize, _emotion.toastTokens.fontStyle, _emotion.toastTokens.fontWeight, _emotion.toastTokens.letterSpacing, _emotion.toastTokens.lineHeight, _emotion.toastTokens.contentLeftMargin, _emotion.toastTokens.closeIconMargin)
23
+ s: /*#__PURE__*/(0, _emotion.css)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.75rem;\n ", ": calc(100vw - 5rem);\n ", ": 0.5rem 0.75rem;\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 ", ": -0.0625rem 0.5rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.125rem -0.0625rem 0.75rem;\n "])), _emotion.toastTokens.borderRadius, _emotion.toastTokens.maxWidth, _emotion.toastTokens.padding, _emotion.toastTokens.fontFamily, _emotion.toastTokens.fontSize, _emotion.toastTokens.fontStyle, _emotion.toastTokens.fontWeight, _emotion.toastTokens.letterSpacing, _emotion.toastTokens.lineHeight, _emotion.toastTokens.leftContentMargin, _emotion.toastTokens.closeIconMargin)
32
24
  },
33
25
  closeIconType: {
34
26
  thin: /*#__PURE__*/(0, _emotion.css)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n ", ": 1.5rem;\n "])), _emotion.toastTokens.closeIconButtonSize, _emotion.toastTokens.closeIconSize)
35
27
  },
36
28
  pilled: {
37
- "true": /*#__PURE__*/(0, _emotion.css)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n\n ", ": -0.0625rem 0.375rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.25rem -0.0625rem 0.375rem;\n "])), _emotion.toastTokens.pilledBorderRadius, _emotion.toastTokens.contentLeftMargin, _emotion.toastTokens.closeIconMargin)
29
+ "true": /*#__PURE__*/(0, _emotion.css)(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n\n ", ": -0.0625rem 0.375rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.25rem -0.0625rem 0.375rem;\n "])), _emotion.toastTokens.pilledBorderRadius, _emotion.toastTokens.leftContentMargin, _emotion.toastTokens.closeIconMargin)
38
30
  }
39
31
  }
40
32
  };
package/emotion/cjs/components/Toast/Toast.stories.tsx CHANGED
@@ -10,23 +10,23 @@ import { ToastController, ToastProvider } from './Toast';
10
10
 
11
11
  import { Toast, useToast } from '.';
12
12
 
13
- const views = ['default'];
14
-
15
13
  const meta: Meta<typeof ToastController> = {
16
14
  title: 'Overlay/Toast',
17
15
  decorators: [InSpacingDecorator],
18
16
  argTypes: {
19
17
  view: {
20
- options: views,
18
+ options: ['default', 'dark', 'light'],
21
19
  control: {
22
20
  type: 'select',
23
21
  },
24
22
  },
25
- textColor: {
26
- control: 'color',
23
+ size: {
24
+ options: ['s'],
25
+ control: {
26
+ type: 'inline-radio',
27
+ },
27
28
  },
28
- // NOTE: контролы 'textColor' и 'view' скрыты для сторибуков sdds-cs и sdds-insol
29
- ...disableProps(['textColor', 'view', 'closeIconType', 'size', 'role', 'onShow', 'onHide', 'contentLeft']),
29
+ ...disableProps(['role', 'onShow', 'onHide', 'contentLeft', 'size']),
30
30
  },
31
31
  };
32
32
 
@@ -54,6 +54,7 @@ const BellIcon = (props) => (
54
54
  );
55
55
 
56
56
  const ToastContainer = styled.div`
57
+ position: fixed;
57
58
  transform: translateX(50%);
58
59
  `;
59
60
 
@@ -65,9 +66,7 @@ const Container = styled.div`
65
66
  export const ToastComponent: StoryComponent = {
66
67
  args: {
67
68
  text: 'Текст всплывающего уведомления',
68
- textColor: undefined,
69
69
  view: 'default',
70
- closeIconType: 'thin',
71
70
  size: 's',
72
71
  hasClose: true,
73
72
  enableContentLeft: true,
@@ -91,8 +90,6 @@ const StoryLiveDemo = ({
91
90
  size,
92
91
  hasClose,
93
92
  enableContentLeft,
94
- closeIconType,
95
- textColor,
96
93
  }: StoryProps) => {
97
94
  const { showToast, hideToast } = useToast();
98
95
  const contentLeft = enableContentLeft && <BellIcon width="1.5rem" height="1.5rem" />;
@@ -113,8 +110,6 @@ const StoryLiveDemo = ({
113
110
  view,
114
111
  size,
115
112
  hasClose,
116
- closeIconType,
117
- textColor,
118
113
  onHide: action('onHide'),
119
114
  onShow: action('onShow'),
120
115
  });
package/emotion/es/components/Toast/Toast.config.js CHANGED
@@ -10,25 +10,17 @@ export var config = {
10
10
  variations: {
11
11
  view: {
12
12
  "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card-brightness);\n\n ", ": var(--text-accent);\n ", ": #1A9E32;\n "])), toastTokens.color, toastTokens.background, toastTokens.closeIconColor, toastTokens.closeIconColorOnHover),
13
- /**
14
- * @deprecated
15
- * светлый и темный фон регулировать через `view` компонента `ViewContainer`
16
- */
17
13
  dark: /*#__PURE__*/css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--on-dark-text-primary);\n ", ": var(--on-dark-surface-solid-primary-brightness);\n\n ", ": var(--on-dark-text-accent);\n ", ": var(--on-dark-text-accent-hover);\n "])), toastTokens.color, toastTokens.background, toastTokens.closeIconColor, toastTokens.closeIconColorOnHover),
18
- /**
19
- * @deprecated
20
- * светлый и темный фон регулировать через `view` компонента `ViewContainer`
21
- */
22
14
  light: /*#__PURE__*/css(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--on-light-text-primary);\n ", ": var(--on-light-surface-solid-primary-brightness);\n\n ", ": var(--on-light-text-accent);\n ", ": var(--on-light-text-accent-hover);\n "])), toastTokens.color, toastTokens.background, toastTokens.closeIconColor, toastTokens.closeIconColorOnHover)
23
15
  },
24
16
  size: {
25
- s: /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.75rem;\n ", ": calc(100vw - 5rem);\n ", ": 0.5rem 0.75rem;\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 ", ": -0.0625rem 0.5rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.125rem -0.0625rem 0.75rem;\n "])), toastTokens.borderRadius, toastTokens.maxWidth, toastTokens.padding, toastTokens.fontFamily, toastTokens.fontSize, toastTokens.fontStyle, toastTokens.fontWeight, toastTokens.letterSpacing, toastTokens.lineHeight, toastTokens.contentLeftMargin, toastTokens.closeIconMargin)
17
+ s: /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.75rem;\n ", ": calc(100vw - 5rem);\n ", ": 0.5rem 0.75rem;\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 ", ": -0.0625rem 0.5rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.125rem -0.0625rem 0.75rem;\n "])), toastTokens.borderRadius, toastTokens.maxWidth, toastTokens.padding, toastTokens.fontFamily, toastTokens.fontSize, toastTokens.fontStyle, toastTokens.fontWeight, toastTokens.letterSpacing, toastTokens.lineHeight, toastTokens.leftContentMargin, toastTokens.closeIconMargin)
26
18
  },
27
19
  closeIconType: {
28
20
  thin: /*#__PURE__*/css(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n ", ": 1.5rem;\n "])), toastTokens.closeIconButtonSize, toastTokens.closeIconSize)
29
21
  },
30
22
  pilled: {
31
- "true": /*#__PURE__*/css(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n\n ", ": -0.0625rem 0.375rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.25rem -0.0625rem 0.375rem;\n "])), toastTokens.pilledBorderRadius, toastTokens.contentLeftMargin, toastTokens.closeIconMargin)
23
+ "true": /*#__PURE__*/css(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n\n ", ": -0.0625rem 0.375rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.25rem -0.0625rem 0.375rem;\n "])), toastTokens.pilledBorderRadius, toastTokens.leftContentMargin, toastTokens.closeIconMargin)
32
24
  }
33
25
  }
34
26
  };
package/emotion/es/components/Toast/Toast.stories.tsx CHANGED
@@ -10,23 +10,23 @@ import { ToastController, ToastProvider } from './Toast';
10
10
 
11
11
  import { Toast, useToast } from '.';
12
12
 
13
- const views = ['default'];
14
-
15
13
  const meta: Meta<typeof ToastController> = {
16
14
  title: 'Overlay/Toast',
17
15
  decorators: [InSpacingDecorator],
18
16
  argTypes: {
19
17
  view: {
20
- options: views,
18
+ options: ['default', 'dark', 'light'],
21
19
  control: {
22
20
  type: 'select',
23
21
  },
24
22
  },
25
- textColor: {
26
- control: 'color',
23
+ size: {
24
+ options: ['s'],
25
+ control: {
26
+ type: 'inline-radio',
27
+ },
27
28
  },
28
- // NOTE: контролы 'textColor' и 'view' скрыты для сторибуков sdds-cs и sdds-insol
29
- ...disableProps(['textColor', 'view', 'closeIconType', 'size', 'role', 'onShow', 'onHide', 'contentLeft']),
29
+ ...disableProps(['role', 'onShow', 'onHide', 'contentLeft', 'size']),
30
30
  },
31
31
  };
32
32
 
@@ -54,6 +54,7 @@ const BellIcon = (props) => (
54
54
  );
55
55
 
56
56
  const ToastContainer = styled.div`
57
+ position: fixed;
57
58
  transform: translateX(50%);
58
59
  `;
59
60
 
@@ -65,9 +66,7 @@ const Container = styled.div`
65
66
  export const ToastComponent: StoryComponent = {
66
67
  args: {
67
68
  text: 'Текст всплывающего уведомления',
68
- textColor: undefined,
69
69
  view: 'default',
70
- closeIconType: 'thin',
71
70
  size: 's',
72
71
  hasClose: true,
73
72
  enableContentLeft: true,
@@ -91,8 +90,6 @@ const StoryLiveDemo = ({
91
90
  size,
92
91
  hasClose,
93
92
  enableContentLeft,
94
- closeIconType,
95
- textColor,
96
93
  }: StoryProps) => {
97
94
  const { showToast, hideToast } = useToast();
98
95
  const contentLeft = enableContentLeft && <BellIcon width="1.5rem" height="1.5rem" />;
@@ -113,8 +110,6 @@ const StoryLiveDemo = ({
113
110
  view,
114
111
  size,
115
112
  hasClose,
116
- closeIconType,
117
- textColor,
118
113
  onHide: action('onHide'),
119
114
  onShow: action('onShow'),
120
115
  });
package/es/components/Toast/Toast.config.js CHANGED
@@ -10,25 +10,17 @@ export var config = {
10
10
  variations: {
11
11
  view: {
12
12
  "default": /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--text-primary);\n ", ": var(--surface-solid-card-brightness);\n\n ", ": var(--text-accent);\n ", ": #1A9E32;\n "])), toastTokens.color, toastTokens.background, toastTokens.closeIconColor, toastTokens.closeIconColorOnHover),
13
- /**
14
- * @deprecated
15
- * светлый и темный фон регулировать через `view` компонента `ViewContainer`
16
- */
17
13
  dark: /*#__PURE__*/css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--on-dark-text-primary);\n ", ": var(--on-dark-surface-solid-primary-brightness);\n\n ", ": var(--on-dark-text-accent);\n ", ": var(--on-dark-text-accent-hover);\n "])), toastTokens.color, toastTokens.background, toastTokens.closeIconColor, toastTokens.closeIconColorOnHover),
18
- /**
19
- * @deprecated
20
- * светлый и темный фон регулировать через `view` компонента `ViewContainer`
21
- */
22
14
  light: /*#__PURE__*/css(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": var(--on-light-text-primary);\n ", ": var(--on-light-surface-solid-primary-brightness);\n\n ", ": var(--on-light-text-accent);\n ", ": var(--on-light-text-accent-hover);\n "])), toastTokens.color, toastTokens.background, toastTokens.closeIconColor, toastTokens.closeIconColorOnHover)
23
15
  },
24
16
  size: {
25
- s: /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.75rem;\n ", ": calc(100vw - 5rem);\n ", ": 0.5rem 0.75rem;\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 ", ": -0.0625rem 0.5rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.125rem -0.0625rem 0.75rem;\n "])), toastTokens.borderRadius, toastTokens.maxWidth, toastTokens.padding, toastTokens.fontFamily, toastTokens.fontSize, toastTokens.fontStyle, toastTokens.fontWeight, toastTokens.letterSpacing, toastTokens.lineHeight, toastTokens.contentLeftMargin, toastTokens.closeIconMargin)
17
+ s: /*#__PURE__*/css(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 0.75rem;\n ", ": calc(100vw - 5rem);\n ", ": 0.5rem 0.75rem;\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 ", ": -0.0625rem 0.5rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.125rem -0.0625rem 0.75rem;\n "])), toastTokens.borderRadius, toastTokens.maxWidth, toastTokens.padding, toastTokens.fontFamily, toastTokens.fontSize, toastTokens.fontStyle, toastTokens.fontWeight, toastTokens.letterSpacing, toastTokens.lineHeight, toastTokens.leftContentMargin, toastTokens.closeIconMargin)
26
18
  },
27
19
  closeIconType: {
28
20
  thin: /*#__PURE__*/css(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n ", ": 1.5rem;\n "])), toastTokens.closeIconButtonSize, toastTokens.closeIconSize)
29
21
  },
30
22
  pilled: {
31
- "true": /*#__PURE__*/css(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n\n ", ": -0.0625rem 0.375rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.25rem -0.0625rem 0.375rem;\n "])), toastTokens.pilledBorderRadius, toastTokens.contentLeftMargin, toastTokens.closeIconMargin)
23
+ "true": /*#__PURE__*/css(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteral(["\n ", ": 1.5rem;\n\n ", ": -0.0625rem 0.375rem -0.0625rem 0rem;\n ", ": -0.0625rem 0.25rem -0.0625rem 0.375rem;\n "])), toastTokens.pilledBorderRadius, toastTokens.leftContentMargin, toastTokens.closeIconMargin)
32
24
  }
33
25
  }
34
26
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salutejs/sdds-cs",
3
- "version": "0.238.0-canary.1719.13031725630.0",
3
+ "version": "0.238.0-canary.1720.13031638569.0",
4
4
  "description": "Salute Design System / React UI kit for SDDS CS web applications",
5
5
  "author": "Salute Frontend Team <salute.developers@gmail.com>",
6
6
  "license": "MIT",
@@ -30,7 +30,7 @@
30
30
  "directory": "packages/sdds-cs"
31
31
  },
32
32
  "dependencies": {
33
- "@salutejs/plasma-new-hope": "0.249.0-canary.1719.13031725630.0",
33
+ "@salutejs/plasma-new-hope": "0.249.0-canary.1720.13031638569.0",
34
34
  "@salutejs/sdds-themes": "0.31.0"
35
35
  },
36
36
  "peerDependencies": {
@@ -123,5 +123,5 @@
123
123
  "Anton Vinogradov"
124
124
  ],
125
125
  "sideEffects": false,
126
- "gitHead": "eea2bffa25cdce9eca16bfcaa6a6aef02330fa48"
126
+ "gitHead": "6708aaa71651c4db309892c0ecc19cb334c2bf96"
127
127
  }