@salutejs/plasma-new-hope 0.253.0-canary.1719.13069931199.0 → 0.253.0-canary.1736.13068364841.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/components/Accordion/Accordion.tokens.js +2 -0
- package/cjs/components/Accordion/Accordion.tokens.js.map +1 -1
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.css +11 -11
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js +2 -1
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js.map +1 -1
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +19 -19
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js.map +1 -1
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles_5g1zce.css +11 -0
- package/cjs/components/Toast/Toast.css +7 -7
- package/cjs/components/Toast/Toast.js +2 -5
- package/cjs/components/Toast/Toast.js.map +1 -1
- package/cjs/components/Toast/Toast.styles.js +2 -11
- package/cjs/components/Toast/Toast.styles.js.map +1 -1
- package/cjs/components/Toast/{Toast.styles_1kasmzh.css → Toast.styles_1nei944.css} +2 -2
- package/cjs/components/Toast/Toast.tokens.js +1 -2
- package/cjs/components/Toast/Toast.tokens.js.map +1 -1
- package/cjs/components/Toast/ToastController.css +6 -6
- package/cjs/components/Toast/ToastProvider/ToastProvider.js +1 -6
- package/cjs/components/Toast/ToastProvider/ToastProvider.js.map +1 -1
- package/cjs/components/Toast/utils.js +0 -2
- package/cjs/components/Toast/utils.js.map +1 -1
- package/cjs/components/Toast/variations/_pilled/base.js +1 -1
- package/cjs/components/Toast/variations/_pilled/base.js.map +1 -1
- package/cjs/components/Toast/variations/_pilled/base_199qghc.css +1 -0
- package/cjs/index.css +18 -18
- package/emotion/cjs/components/Accordion/Accordion.tokens.js +2 -0
- package/emotion/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js +2 -1
- package/emotion/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +24 -24
- package/emotion/cjs/components/Toast/Toast.js +2 -5
- package/emotion/cjs/components/Toast/Toast.styles.js +6 -9
- package/emotion/cjs/components/Toast/Toast.template-doc.mdx +5 -22
- package/emotion/cjs/components/Toast/Toast.tokens.js +1 -2
- package/emotion/cjs/components/Toast/ToastProvider/ToastProvider.js +1 -6
- package/emotion/cjs/components/Toast/utils.js +1 -2
- package/emotion/cjs/components/Toast/variations/_pilled/base.js +1 -1
- package/emotion/cjs/examples/plasma_b2c/components/Toast/Toast.config.js +7 -17
- package/emotion/cjs/examples/plasma_b2c/components/Toast/Toast.stories.tsx +14 -31
- package/emotion/cjs/examples/plasma_web/components/Toast/Toast.config.js +7 -17
- package/emotion/cjs/examples/plasma_web/components/Toast/Toast.stories.tsx +14 -31
- package/emotion/es/components/Accordion/Accordion.tokens.js +2 -0
- package/emotion/es/components/Accordion/ui/AccordionItem/AccordionItem.js +2 -1
- package/emotion/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +24 -24
- package/emotion/es/components/Toast/Toast.js +2 -5
- package/emotion/es/components/Toast/Toast.styles.js +6 -9
- package/emotion/es/components/Toast/Toast.template-doc.mdx +5 -22
- package/emotion/es/components/Toast/Toast.tokens.js +1 -2
- package/emotion/es/components/Toast/ToastProvider/ToastProvider.js +2 -7
- package/emotion/es/components/Toast/utils.js +0 -1
- package/emotion/es/components/Toast/variations/_pilled/base.js +1 -1
- package/emotion/es/examples/plasma_b2c/components/Toast/Toast.config.js +7 -17
- package/emotion/es/examples/plasma_b2c/components/Toast/Toast.stories.tsx +14 -31
- package/emotion/es/examples/plasma_web/components/Toast/Toast.config.js +7 -17
- package/emotion/es/examples/plasma_web/components/Toast/Toast.stories.tsx +14 -31
- package/es/components/Accordion/Accordion.tokens.js +2 -0
- package/es/components/Accordion/Accordion.tokens.js.map +1 -1
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.css +11 -11
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.js +2 -1
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.js.map +1 -1
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +19 -19
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js.map +1 -1
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.styles_5g1zce.css +11 -0
- package/es/components/Toast/Toast.css +7 -7
- package/es/components/Toast/Toast.js +2 -5
- package/es/components/Toast/Toast.js.map +1 -1
- package/es/components/Toast/Toast.styles.js +2 -11
- package/es/components/Toast/Toast.styles.js.map +1 -1
- package/es/components/Toast/{Toast.styles_1kasmzh.css → Toast.styles_1nei944.css} +2 -2
- package/es/components/Toast/Toast.tokens.js +1 -2
- package/es/components/Toast/Toast.tokens.js.map +1 -1
- package/es/components/Toast/ToastController.css +6 -6
- package/es/components/Toast/ToastProvider/ToastProvider.js +2 -7
- package/es/components/Toast/ToastProvider/ToastProvider.js.map +1 -1
- package/es/components/Toast/utils.js +1 -2
- package/es/components/Toast/utils.js.map +1 -1
- package/es/components/Toast/variations/_pilled/base.js +1 -1
- package/es/components/Toast/variations/_pilled/base.js.map +1 -1
- package/es/components/Toast/variations/_pilled/base_199qghc.css +1 -0
- package/es/index.css +18 -18
- package/package.json +2 -2
- package/styled-components/cjs/components/Accordion/Accordion.tokens.js +2 -0
- package/styled-components/cjs/components/Accordion/ui/AccordionItem/AccordionItem.js +2 -1
- package/styled-components/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +14 -14
- package/styled-components/cjs/components/Toast/Toast.js +2 -5
- package/styled-components/cjs/components/Toast/Toast.styles.js +2 -5
- package/styled-components/cjs/components/Toast/Toast.template-doc.mdx +5 -22
- package/styled-components/cjs/components/Toast/Toast.tokens.js +1 -2
- package/styled-components/cjs/components/Toast/ToastProvider/ToastProvider.js +1 -6
- package/styled-components/cjs/components/Toast/utils.js +1 -2
- package/styled-components/cjs/components/Toast/variations/_pilled/base.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/Toast/Toast.config.js +2 -12
- package/styled-components/cjs/examples/plasma_b2c/components/Toast/Toast.stories.tsx +14 -31
- package/styled-components/cjs/examples/plasma_web/components/Toast/Toast.config.js +2 -12
- package/styled-components/cjs/examples/plasma_web/components/Toast/Toast.stories.tsx +14 -31
- package/styled-components/es/components/Accordion/Accordion.tokens.js +2 -0
- package/styled-components/es/components/Accordion/ui/AccordionItem/AccordionItem.js +2 -1
- package/styled-components/es/components/Accordion/ui/AccordionItem/AccordionItem.styles.js +14 -14
- package/styled-components/es/components/Toast/Toast.js +2 -5
- package/styled-components/es/components/Toast/Toast.styles.js +2 -5
- package/styled-components/es/components/Toast/Toast.template-doc.mdx +5 -22
- package/styled-components/es/components/Toast/Toast.tokens.js +1 -2
- package/styled-components/es/components/Toast/ToastProvider/ToastProvider.js +2 -7
- package/styled-components/es/components/Toast/utils.js +0 -1
- package/styled-components/es/components/Toast/variations/_pilled/base.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/Toast/Toast.config.js +2 -12
- package/styled-components/es/examples/plasma_b2c/components/Toast/Toast.stories.tsx +14 -31
- package/styled-components/es/examples/plasma_web/components/Toast/Toast.config.js +2 -12
- package/styled-components/es/examples/plasma_web/components/Toast/Toast.stories.tsx +14 -31
- package/types/components/Accordion/Accordion.tokens.d.ts +2 -0
- package/types/components/Accordion/Accordion.tokens.d.ts.map +1 -1
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.d.ts.map +1 -1
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.styles.d.ts +1 -1
- package/types/components/Accordion/ui/AccordionItem/AccordionItem.styles.d.ts.map +1 -1
- package/types/components/Toast/Toast.styles.d.ts +1 -3
- package/types/components/Toast/Toast.styles.d.ts.map +1 -1
- package/types/components/Toast/Toast.tokens.d.ts +1 -2
- package/types/components/Toast/Toast.tokens.d.ts.map +1 -1
- package/types/components/Toast/Toast.types.d.ts +0 -8
- package/types/components/Toast/Toast.types.d.ts.map +1 -1
- package/types/components/Toast/ToastProvider/ToastProvider.d.ts.map +1 -1
- package/types/components/Toast/utils.d.ts +0 -1
- package/types/components/Toast/utils.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Toast/Toast.config.d.ts +0 -10
- package/types/examples/plasma_b2c/components/Toast/Toast.config.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Toast/Toast.d.ts +0 -2
- package/types/examples/plasma_b2c/components/Toast/Toast.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Toast/Toast.config.d.ts +0 -10
- package/types/examples/plasma_web/components/Toast/Toast.config.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Toast/Toast.d.ts +0 -2
- package/types/examples/plasma_web/components/Toast/Toast.d.ts.map +1 -1
- package/cjs/components/Accordion/ui/AccordionItem/AccordionItem.styles_56cr5h.css +0 -11
- package/cjs/components/Toast/variations/_pilled/base_13i59v3.css +0 -1
- package/es/components/Accordion/ui/AccordionItem/AccordionItem.styles_56cr5h.css +0 -11
- package/es/components/Toast/variations/_pilled/base_13i59v3.css +0 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"utils.js","sources":["../../../src/components/Toast/utils.ts"],"sourcesContent":["import { buttonConfig } from '../Button';\nimport { component, mergeConfig } from '../../engines';\n\nexport const DEFAULT_FADE = true;\nexport const DEFAULT_POSITION = 'bottom';\nexport const
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../src/components/Toast/utils.ts"],"sourcesContent":["import { buttonConfig } from '../Button';\nimport { component, mergeConfig } from '../../engines';\n\nexport const DEFAULT_FADE = true;\nexport const DEFAULT_POSITION = 'bottom';\nexport const TIMER_DELAY = 300;\nexport const FADE_Z_INDEX = '9900';\nexport const TOAST_Z_INDEX = '9901';\n\nexport const gradients = {\n top: 'radial-gradient(200% 200% at 50% -100%, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%)',\n bottom: 'radial-gradient(200% 200% at 50% 200%, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%)',\n};\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nexport const Button = component(mergedButtonConfig);\n"],"names":["DEFAULT_FADE","DEFAULT_POSITION","TIMER_DELAY","FADE_Z_INDEX","gradients","top","bottom","mergedButtonConfig","mergeConfig","buttonConfig","Button","component"],"mappings":";;;AAGO,IAAMA,YAAY,GAAG,KAAI;AACzB,IAAMC,gBAAgB,GAAG,SAAQ;AACjC,IAAMC,WAAW,GAAG,IAAG;AACvB,IAAMC,YAAY,GAAG,OAAM;AAG3B,IAAMC,SAAS,GAAG;AACrBC,EAAAA,GAAG,EAAE,uFAAuF;AAC5FC,EAAAA,MAAM,EAAE,sFAAA;AACZ,EAAC;AAED,IAAMC,kBAAkB,gBAAGC,WAAW,CAACC,YAAY,CAAC,CAAA;IACvCC,MAAM,gBAAGC,SAAS,CAACJ,kBAAkB;;;;"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"base.js","sources":["../../../../../src/components/Toast/variations/_pilled/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { classes, tokens } from '../../Toast.tokens';\n\nexport const base = css`\n &.${String(classes.toastPilled)} {\n --plasma_private-content-
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../src/components/Toast/variations/_pilled/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { classes, tokens } from '../../Toast.tokens';\n\nexport const base = css`\n &.${String(classes.toastPilled)} {\n --plasma_private-left-content-margin: var(${tokens.leftContentMargin});\n --plasma_private-close-icon-margin: var(${tokens.closeIconMargin});\n\n border-radius: var(${tokens.pilledBorderRadius});\n }\n`;\n"],"names":["base"],"mappings":"AAIO,IAAMA,IAAI,GAOhB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.bmt2xdv.toast-pilled{--plasma_private-left-content-margin:var(--plasma-toast-left-content-margin);--plasma_private-close-icon-margin:var(--plasma-toast-close-icon-margin);border-radius:var(--plasma-toast-pilled-border-radius);}
|
package/es/index.css
CHANGED
@@ -540,14 +540,14 @@
|
|
540
540
|
|
541
541
|
.base_r51pt4_b1d1vtqu__bfcbbf25{padding:var(--plasma-toast-padding);border-radius:var(--plasma-toast-border-radius);max-width:var(--plasma-toast-max-width);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);font-family:var(--plasma-toast-font-family);font-size:var(--plasma-toast-font-size);font-style:var(--plasma-toast-font-style);font-weight:var(--plasma-toast-font-weight);-webkit-letter-spacing:var(--plasma-toast-letter-spacing);-moz-letter-spacing:var(--plasma-toast-letter-spacing);-ms-letter-spacing:var(--plasma-toast-letter-spacing);letter-spacing:var(--plasma-toast-letter-spacing);line-height:var(--plasma-toast-lineheight);}
|
542
542
|
|
543
|
-
.
|
543
|
+
.base_199qghc_bmt2xdv__2079f9e5.base_199qghc_toastPilled__2079f9e5{--plasma_private-left-content-margin:var(--plasma-toast-left-content-margin);--plasma_private-close-icon-margin:var(--plasma-toast-close-icon-margin);border-radius:var(--plasma-toast-pilled-border-radius);}
|
544
|
+
|
545
|
+
.Toast_styles_1nei944_b1xqk743__24d4ce6e{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);--plasma-button-width:1rem;}
|
546
|
+
.Toast_styles_1nei944_s1ajsqhx__24d4ce6e{position:fixed;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);z-index:9901;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;width:0;top:var(--s1ajsqhx-0);bottom:var(--s1ajsqhx-1);}.Toast_styles_1nei944_s1ajsqhx__24d4ce6e.Toast_styles_1nei944_toastShowed__24d4ce6e{-webkit-animation:0.3s Toast_styles_1nei944_showToastAnimationS1ajsqhx__24d4ce6e ease-out forwards;animation:0.3s Toast_styles_1nei944_showToastAnimationS1ajsqhx__24d4ce6e ease-out forwards;}.Toast_styles_1nei944_s1ajsqhx__24d4ce6e.Toast_styles_1nei944_toastHidden__24d4ce6e{-webkit-animation:0.3s Toast_styles_1nei944_hideToastAnimationS1ajsqhx__24d4ce6e ease-out forwards;animation:0.3s Toast_styles_1nei944_hideToastAnimationS1ajsqhx__24d4ce6e ease-out forwards;}@-webkit-keyframes Toast_styles_1nei944_showToastAnimationS1ajsqhx__24d4ce6e{0%{-webkit-transform:var(--s1ajsqhx-2);-ms-transform:var(--s1ajsqhx-2);transform:var(--s1ajsqhx-2);opacity:0;}80%{-webkit-transform:translate(-50%,0);-ms-transform:translate(-50%,0);transform:translate(-50%,0);opacity:0.7;}100%{opacity:1;}}@keyframes Toast_styles_1nei944_showToastAnimationS1ajsqhx__24d4ce6e{0%{-webkit-transform:var(--s1ajsqhx-2);-ms-transform:var(--s1ajsqhx-2);transform:var(--s1ajsqhx-2);opacity:0;}80%{-webkit-transform:translate(-50%,0);-ms-transform:translate(-50%,0);transform:translate(-50%,0);opacity:0.7;}100%{opacity:1;}}@-webkit-keyframes Toast_styles_1nei944_hideToastAnimationS1ajsqhx__24d4ce6e{0%{opacity:1;}20%{-webkit-transform:translate(-50%,0);-ms-transform:translate(-50%,0);transform:translate(-50%,0);opacity:0.7;}100%{-webkit-transform:var(--s1ajsqhx-2);-ms-transform:var(--s1ajsqhx-2);transform:var(--s1ajsqhx-2);opacity:0;}}@keyframes Toast_styles_1nei944_hideToastAnimationS1ajsqhx__24d4ce6e{0%{opacity:1;}20%{-webkit-transform:translate(-50%,0);-ms-transform:translate(-50%,0);transform:translate(-50%,0);opacity:0.7;}100%{-webkit-transform:var(--s1ajsqhx-2);-ms-transform:var(--s1ajsqhx-2);transform:var(--s1ajsqhx-2);opacity:0;}}
|
547
|
+
.Toast_styles_1nei944_cb0tpdq__24d4ce6e{height:var(--plasma-toast-close-icon-button-size);--plasma_private-close-icon-margin:var(--plasma-toast-close-icon-margin);margin:var(--plasma_private-close-icon-margin);color:var(--plasma-toast-close-icon-color);}.Toast_styles_1nei944_cb0tpdq__24d4ce6e:hover{color:var(--plasma-toast-close-icon-color-on-hover);}
|
548
|
+
.Toast_styles_1nei944_segu2tf__24d4ce6e.Toast_styles_1nei944_segu2tf__24d4ce6e.Toast_styles_1nei944_toastFadeShowed__24d4ce6e{-webkit-animation:0.3s Toast_styles_1nei944_showFadeAnimationSegu2tf__24d4ce6e ease-out forwards;animation:0.3s Toast_styles_1nei944_showFadeAnimationSegu2tf__24d4ce6e ease-out forwards;}.Toast_styles_1nei944_segu2tf__24d4ce6e.Toast_styles_1nei944_segu2tf__24d4ce6e.Toast_styles_1nei944_toastFadeHidden__24d4ce6e{-webkit-animation:0.3s Toast_styles_1nei944_hideFadeAnimationSegu2tf__24d4ce6e ease-out forwards;animation:0.3s Toast_styles_1nei944_hideFadeAnimationSegu2tf__24d4ce6e ease-out forwards;}@-webkit-keyframes Toast_styles_1nei944_showFadeAnimationSegu2tf__24d4ce6e{0%{opacity:0;}100%{opacity:1;}}@keyframes Toast_styles_1nei944_showFadeAnimationSegu2tf__24d4ce6e{0%{opacity:0;}100%{opacity:1;}}@-webkit-keyframes Toast_styles_1nei944_hideFadeAnimationSegu2tf__24d4ce6e{0%{opacity:1;}100%{opacity:0;}}@keyframes Toast_styles_1nei944_hideFadeAnimationSegu2tf__24d4ce6e{0%{opacity:1;}100%{opacity:0;}}
|
549
|
+
.Toast_styles_1nei944_s1bt6ppa__24d4ce6e{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;--plasma_private-left-content-margin:var(--plasma-toast-left-content-margin);margin:var(--plasma_private-left-content-margin);}
|
544
550
|
|
545
|
-
.Toast_styles_1kasmzh_b1xqk743__8ac79e0c{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);--plasma-button-width:1rem;}
|
546
|
-
.Toast_styles_1kasmzh_s1ajsqhx__8ac79e0c{position:fixed;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);z-index:9901;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;width:0;top:var(--s1ajsqhx-0);bottom:var(--s1ajsqhx-1);}.Toast_styles_1kasmzh_s1ajsqhx__8ac79e0c.Toast_styles_1kasmzh_toastShowed__8ac79e0c{-webkit-animation:0.3s Toast_styles_1kasmzh_showToastAnimationS1ajsqhx__8ac79e0c ease-out forwards;animation:0.3s Toast_styles_1kasmzh_showToastAnimationS1ajsqhx__8ac79e0c ease-out forwards;}.Toast_styles_1kasmzh_s1ajsqhx__8ac79e0c.Toast_styles_1kasmzh_toastHidden__8ac79e0c{-webkit-animation:0.3s Toast_styles_1kasmzh_hideToastAnimationS1ajsqhx__8ac79e0c ease-out forwards;animation:0.3s Toast_styles_1kasmzh_hideToastAnimationS1ajsqhx__8ac79e0c ease-out forwards;}@-webkit-keyframes Toast_styles_1kasmzh_showToastAnimationS1ajsqhx__8ac79e0c{0%{-webkit-transform:var(--s1ajsqhx-2);-ms-transform:var(--s1ajsqhx-2);transform:var(--s1ajsqhx-2);opacity:0;}80%{-webkit-transform:translate(-50%,0);-ms-transform:translate(-50%,0);transform:translate(-50%,0);opacity:0.7;}100%{opacity:1;}}@keyframes Toast_styles_1kasmzh_showToastAnimationS1ajsqhx__8ac79e0c{0%{-webkit-transform:var(--s1ajsqhx-2);-ms-transform:var(--s1ajsqhx-2);transform:var(--s1ajsqhx-2);opacity:0;}80%{-webkit-transform:translate(-50%,0);-ms-transform:translate(-50%,0);transform:translate(-50%,0);opacity:0.7;}100%{opacity:1;}}@-webkit-keyframes Toast_styles_1kasmzh_hideToastAnimationS1ajsqhx__8ac79e0c{0%{opacity:1;}20%{-webkit-transform:translate(-50%,0);-ms-transform:translate(-50%,0);transform:translate(-50%,0);opacity:0.7;}100%{-webkit-transform:var(--s1ajsqhx-2);-ms-transform:var(--s1ajsqhx-2);transform:var(--s1ajsqhx-2);opacity:0;}}@keyframes Toast_styles_1kasmzh_hideToastAnimationS1ajsqhx__8ac79e0c{0%{opacity:1;}20%{-webkit-transform:translate(-50%,0);-ms-transform:translate(-50%,0);transform:translate(-50%,0);opacity:0.7;}100%{-webkit-transform:var(--s1ajsqhx-2);-ms-transform:var(--s1ajsqhx-2);transform:var(--s1ajsqhx-2);opacity:0;}}
|
547
|
-
.Toast_styles_1kasmzh_cb0tpdq__8ac79e0c{height:var(--plasma-toast-close-icon-button-size);--plasma_private-close-icon-margin:var(--plasma-toast-close-icon-margin);margin:var(--plasma_private-close-icon-margin);color:var(--plasma-toast-close-icon-color);}.Toast_styles_1kasmzh_cb0tpdq__8ac79e0c:hover{color:var(--plasma-toast-close-icon-color-on-hover);}
|
548
|
-
.Toast_styles_1kasmzh_segu2tf__8ac79e0c.Toast_styles_1kasmzh_segu2tf__8ac79e0c.Toast_styles_1kasmzh_toastFadeShowed__8ac79e0c{-webkit-animation:0.3s Toast_styles_1kasmzh_showFadeAnimationSegu2tf__8ac79e0c ease-out forwards;animation:0.3s Toast_styles_1kasmzh_showFadeAnimationSegu2tf__8ac79e0c ease-out forwards;}.Toast_styles_1kasmzh_segu2tf__8ac79e0c.Toast_styles_1kasmzh_segu2tf__8ac79e0c.Toast_styles_1kasmzh_toastFadeHidden__8ac79e0c{-webkit-animation:0.3s Toast_styles_1kasmzh_hideFadeAnimationSegu2tf__8ac79e0c ease-out forwards;animation:0.3s Toast_styles_1kasmzh_hideFadeAnimationSegu2tf__8ac79e0c ease-out forwards;}@-webkit-keyframes Toast_styles_1kasmzh_showFadeAnimationSegu2tf__8ac79e0c{0%{opacity:0;}100%{opacity:1;}}@keyframes Toast_styles_1kasmzh_showFadeAnimationSegu2tf__8ac79e0c{0%{opacity:0;}100%{opacity:1;}}@-webkit-keyframes Toast_styles_1kasmzh_hideFadeAnimationSegu2tf__8ac79e0c{0%{opacity:1;}100%{opacity:0;}}@keyframes Toast_styles_1kasmzh_hideFadeAnimationSegu2tf__8ac79e0c{0%{opacity:1;}100%{opacity:0;}}
|
549
|
-
.Toast_styles_1kasmzh_s1bt6ppa__8ac79e0c{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;--plasma_private-content-left-margin:var(--plasma-toast-content-left-margin);margin:var(--plasma_private-content-left-margin);color:var(--plasma-toast-content-left-color);}
|
550
|
-
.Toast_styles_1kasmzh_s1h44nk1__8ac79e0c{color:var(--s1h44nk1-0);}
|
551
551
|
|
552
552
|
.Overlay_styles_cxej3y_s1afr8la__70d4dd9a{position:fixed;inset:0;z-index:var(--s1afr8la-0);--plasma_private-overlay-background-color:var(--s1afr8la-1);--plasma_private-overlay-backdrop-filter:var(--s1afr8la-2);background:var(--s1afr8la-3);-webkit-backdrop-filter:var(--s1afr8la-4);backdrop-filter:var(--s1afr8la-4);cursor:var(--s1afr8la-5);}
|
553
553
|
|
@@ -733,17 +733,17 @@
|
|
733
733
|
|
734
734
|
.Accordion_styles_rsiff6_bjv6ypd__465a9c67{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:var(--plasma-accordion-gap);-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;height:auto;background:var(--plasma-accordion-background);}.Accordion_styles_rsiff6_bjv6ypd__465a9c67.Accordion_styles_rsiff6_accordionStretchingFixed__465a9c67{width:var(--plasma-accordion-width);}.Accordion_styles_rsiff6_bjv6ypd__465a9c67.Accordion_styles_rsiff6_accordionStretchingFilled__465a9c67{width:100%;}
|
735
735
|
|
736
|
-
.
|
737
|
-
.
|
738
|
-
.
|
739
|
-
.
|
740
|
-
.
|
741
|
-
.
|
742
|
-
.
|
743
|
-
.
|
744
|
-
.
|
745
|
-
.
|
746
|
-
.
|
736
|
+
.AccordionItem_styles_5g1zce_s1d847tf__6f50c306{width:100%;border:none;padding:var(--plasma-accordion-item-padding);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-accordion-item-gap);-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:none;box-sizing:border-box;cursor:pointer;position:relative;}.AccordionItem_styles_5g1zce_s1d847tf__6f50c306:focus{outline:none;}.AccordionItem_styles_5g1zce_s1d847tf__6f50c306::before{content:'';position:absolute;top:0.125rem;left:0.125rem;right:0.125rem;bottom:0.125rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:0;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.AccordionItem_styles_5g1zce_s1d847tf__6f50c306.AccordionItem_styles_5g1zce_focusVisible__6f50c306:focus::before,.AccordionItem_styles_5g1zce_s1d847tf__6f50c306[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-accordion-item-focus);}
|
737
|
+
.AccordionItem_styles_5g1zce_s18inj31__6f50c306{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-accordion-item-gap);-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
|
738
|
+
.AccordionItem_styles_5g1zce_s1kvo44v__6f50c306{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}.AccordionItem_styles_5g1zce_s1kvo44v__6f50c306.AccordionItem_styles_5g1zce_accordionItemShowBody__6f50c306{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
|
739
|
+
.AccordionItem_styles_5g1zce_s2tqnbp__6f50c306{-webkit-transition:0.2s;transition:0.2s;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.AccordionItem_styles_5g1zce_s2tqnbp__6f50c306.AccordionItem_styles_5g1zce_accordionItemShowBody__6f50c306{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}
|
740
|
+
.AccordionItem_styles_5g1zce_s11daj3x__6f50c306{color:var(--plasma-accordion-item-title-color);font-family:var(--plasma-accordion-item-title-font-family);font-size:var(--plasma-accordion-item-title-font-size);font-weight:var(--plasma-accordion-item-title-font-weight);font-style:var(--plasma-accordion-item-title-font-style);-webkit-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);-moz-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);-ms-letter-spacing:var(--plasma-accordion-item-title-letter-spacing);letter-spacing:var(--plasma-accordion-item-title-letter-spacing);line-height:var(--plasma-accordion-item-title-line-height);text-align:left;}
|
741
|
+
.AccordionItem_styles_5g1zce_sy09zp7__6f50c306{display:grid;grid-template-rows:0fr;-webkit-transition:grid-template-rows 0.2s ease-out;transition:grid-template-rows 0.2s ease-out;overflow:hidden;}.AccordionItem_styles_5g1zce_sy09zp7__6f50c306.AccordionItem_styles_5g1zce_accordionItemShowBody__6f50c306{grid-template-rows:1fr;padding-bottom:var(--plasma-accordion-item-padding-vertical);}.AccordionItem_styles_5g1zce_sy09zp7__6f50c306.AccordionItem_styles_5g1zce_accordionItemShowBody__6f50c306.AccordionItem_styles_5g1zce_accordionPlusAnimationElement__6f50c306{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
|
742
|
+
.AccordionItem_styles_5g1zce_sbzgv9z__6f50c306{color:var(--plasma-accordion-item-text-color);font-family:var(--plasma-accordion-item-text-font-family);font-size:var(--plasma-accordion-item-text-font-size);font-weight:var(--plasma-accordion-item-text-font-weight);font-style:var(--plasma-accordion-item-text-font-style);-webkit-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);-moz-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);-ms-letter-spacing:var(--plasma-accordion-item-text-letter-spacing);letter-spacing:var(--plasma-accordion-item-text-letter-spacing);line-height:var(--plasma-accordion-item-text-line-height);overflow:hidden;padding-right:var(--plasma-accordion-item-padding-horizontal);padding-left:var(--plasma-accordion-item-padding-horizontal-left);text-align:left;}
|
743
|
+
.AccordionItem_styles_5g1zce_s1ewkyyv__6f50c306{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--plasma-accordion-item-color-icon);}
|
744
|
+
.AccordionItem_styles_5g1zce_s15qiue1__6f50c306{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--plasma-accordion-item-color-icon);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:0;left:0;}.AccordionItem_styles_5g1zce_s15qiue1__6f50c306.AccordionItem_styles_5g1zce_accordionPlusAnimationElement__6f50c306{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}.AccordionItem_styles_5g1zce_s15qiue1__6f50c306.AccordionItem_styles_5g1zce_accordionItemShowBody__6f50c306{-webkit-transition:0.2s;transition:0.2s;-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);color:var(--plasma-accordion-item-title-opened-color,var(--plasma-accordion-item-color-icon));}
|
745
|
+
.AccordionItem_styles_5g1zce_syldew1__6f50c306{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:var(--plasma-accordion-item-icon-szie,1rem);height:var(--plasma-accordion-item-icon-szie,1rem);}
|
746
|
+
.AccordionItem_styles_5g1zce_s1he8scv__6f50c306{background:var(--plasma-accordion-item-background);border:var(--plasma-accordion-item-border);border-bottom:var(--plasma-accordion-item-border-bottom);}.AccordionItem_styles_5g1zce_s1he8scv__6f50c306:last-child{border-bottom:var(--plasma-accordion-item-border);}.AccordionItem_styles_5g1zce_s1he8scv__6f50c306.AccordionItem_styles_5g1zce_accordionDisabled__6f50c306{opacity:0.4;cursor:not-allowed;}.AccordionItem_styles_5g1zce_s1he8scv__6f50c306.AccordionItem_styles_5g1zce_accordionItemOpened__6f50c306 .AccordionItem_styles_5g1zce_s1ewkyyv__6f50c306{color:var(--plasma-accordion-item-title-opened-color,var(--plasma-accordion-item-color-icon));}.AccordionItem_styles_5g1zce_s1he8scv__6f50c306.AccordionItem_styles_5g1zce_accordionItemOpened__6f50c306 .AccordionItem_styles_5g1zce_s11daj3x__6f50c306{color:var(--plasma-accordion-item-title-opened-color,var(--plasma-accordion-item-title-color));}
|
747
747
|
|
748
748
|
.DatePickerBase_styles_1vzl5em_s1ywkx25__e2ed1ffa{width:var(--plasma-date-picker-width);padding-top:var(--plasma-date-picker-calendar-padding-top);box-shadow:var(--plasma-date-picker-calendar-shadow);border-radius:var(--plasma-date-picker-calendar-border-radius);margin-top:var(--plasma-date-picker-calendar-margin-top);--plasma-calendar-background:var(--plasma-date-picker-calendar__background-color);--plasma-calendar-selected-item-background:var(--plasma-date-picker-calendar__selected-item-background);--plasma-calendar-selected-item-color:var(--plasma-date-picker-calendar__selected-item-color);--plasma-calendar-selectable-item-bg-hover:var(--plasma-date-picker-calendar__selectable-item-background-hover);--plasma-calendar-current-item-border-color:var(--plasma-date-picker-calendar__current-item-border-color);--plasma-calendar-current-item-border-width:var(--plasma-date-picker-calendar__current-item-border-width);--plasma-calendar-current-item-bg-hover:var(--plasma-date-picker-calendar__current-item-background-hover);--plasma-calendar-current-item-color-hover:var(--plasma-date-picker-calendar__current-item-color-hover);--plasma-calendar-current-item-child-bg-hover:var(--plasma-date-picker-calendar__current-item-child-background-hover);--plasma-calendar-active-item-bg:var(--plasma-date-picker-calendar__active-item-background);--plasma-calendar-active-item-color:var(--plasma-date-picker-calendar__active-item-color);--plasma-calendar-hovered-item-bg:var(--plasma-date-picker-calendar__hovered-item-background);--plasma-calendar-hovered-item-color:var(--plasma-date-picker-calendar__hovered-item-color);--plasma-calendar-range-background:var(--plasma-date-picker-calendar__range-background);--plasma-calendar-outline-focus-color:var(--plasma-date-picker-calendar__outline-focus-color);--plasma-calendar-content-primary-color:var(--plasma-date-picker-calendar__content-primary-color);--plasma-calendar-content-secondary-color:var(--plasma-date-picker-calendar__content-secondary-color);--plasma-calendar-icon-button-color:var(--plasma-date-picker-icon-button__color);--plasma-calendar-icon-button-background:var(--plasma-date-picker-icon-button__background-color);--plasma-calendar-icon-button-color-hover:var(--plasma-date-picker-icon-button__color-hover);--plasma-calendar-icon-button-background-hover:var(--plasma-date-picker-icon-button__background-color-hover);--plasma-calendar-icon-button-color-active:var(--plasma-date-picker-icon-button__color-active);--plasma-calendar-icon-button-background-active:var(--plasma-date-picker-icon-button__background-color-active);--plasma-calendar-width:var(--plasma-date-picker-calendar-width);--plasma-calendar-height:var(--plasma-date-picker-calendar-height);--plasma-calendar-border-width:var(--plasma-date-picker-calendar-border-width);--plasma-calendar-border-color:var(--plasma-date-picker-calendar-border-color);--plasma-calendar-years-padding:var(--plasma-date-picker-calendar__years-padding);--plasma-calendar-year-item-border-radius:var(--plasma-date-picker-calendar__year-item-border-radius);--plasma-calendar-year-item-width:var(--plasma-date-picker-calendar__year-item-width);--plasma-calendar-year-item-height:var(--plasma-date-picker-calendar__year-item-height);--plasma-calendar-year-font-family:var(--plasma-date-picker-calendar__year-font-family);--plasma-calendar-year-font-size:var(--plasma-date-picker-calendar__year-font-size);--plasma-calendar-year-font-style:var(--plasma-date-picker-calendar__year-font-style);--plasma-calendar-year-font-letter-spacing:var(--plasma-date-picker-calendar__year-letter-spacing);--plasma-calendar-year-line-height:var(--plasma-date-picker-calendar__year-line-height);--plasma-calendar-year-font-weight:var(--plasma-date-picker-calendar__year-font-weight);--plasma-calendar-year-selected-font-weight:var(--plasma-date-picker-calendar__year-selected-font-weight);--plasma-calendar-months-padding:var(--plasma-date-picker-calendar__months-padding);--plasma-calendar-month-item-border-radius:var(--plasma-date-picker-calendar__month-item-border-radius);--plasma-calendar-month-item-width:var(--plasma-date-picker-calendar__month-item-width);--plasma-calendar-month-item-height:var(--plasma-date-picker-calendar__month-item-height);--plasma-calendar-month-font-family:var(--plasma-date-picker-calendar__month-font-family);--plasma-calendar-month-font-size:var(--plasma-date-picker-calendar__month-font-size);--plasma-calendar-month-font-style:var(--plasma-date-picker-calendar__month-font-style);--plasma-calendar-month-font-letter-spacing:var(--plasma-date-picker-calendar__month-letter-spacing);--plasma-calendar-month-line-height:var(--plasma-date-picker-calendar__month-line-height);--plasma-calendar-month-font-weight:var(--plasma-date-picker-calendar__month-font-weight);--plasma-calendar-month-selected-font-weight:var(--plasma-date-picker-calendar__month-selected-font-weight);--plasma-calendar-quarters-padding:var(--plasma-date-picker-calendar__quarters-padding);--plasma-calendar-quarter-item-border-radius:var(--plasma-date-picker-calendar__quarter-item-border-radius);--plasma-calendar-quarter-item-width:var(--plasma-date-picker-calendar__quarter-item-width);--plasma-calendar-quarter-item-height:var(--plasma-date-picker-calendar__quarter-item-height);--plasma-calendar-quarter-font-family:var(--plasma-date-picker-calendar__quarter-font-family);--plasma-calendar-quarter-font-size:var(--plasma-date-picker-calendar__quarter-font-size);--plasma-calendar-quarter-font-style:var(--plasma-date-picker-calendar__quarter-font-style);--plasma-calendar-quarter-font-letter-spacing:var(--plasma-date-picker-calendar__quarter-letter-spacing);--plasma-calendar-quarter-line-height:var(--plasma-date-picker-calendar__quarter-line-height);--plasma-calendar-quarter-font-weight:var(--plasma-date-picker-calendar__quarter-font-weight);--plasma-calendar-quarter-selected-font-weight:var(--plasma-date-picker-calendar__quarter-selected-font-weight);--plasma-calendar-days-padding:var(--plasma-date-picker-calendar__days-padding);--plasma-calendar-day-item-border-radius:var(--plasma-date-picker-calendar__day-item-border-radius);--plasma-calendar-day-item-width:var(--plasma-date-picker-calendar__day-item-width);--plasma-calendar-day-item-height:var(--plasma-date-picker-calendar__day-item-height);--plasma-calendar-day-font-family:var(--plasma-date-picker-calendar__day-font-family);--plasma-calendar-day-font-size:var(--plasma-date-picker-calendar__day-font-size);--plasma-calendar-day-font-style:var(--plasma-date-picker-calendar__day-font-style);--plasma-calendar-day-font-letter-spacing:var(--plasma-date-picker-calendar__day-letter-spacing);--plasma-calendar-day-line-height:var(--plasma-date-picker-calendar__day-line-height);--plasma-calendar-day-font-weight:var(--plasma-date-picker-calendar__day-font-weight);--plasma-calendar-day-selected-font-weight:var(--plasma-date-picker-calendar__day-selected-font-weight);--plasma-calendar-day-of-the-week-color:var(--plasma-date-picker-calendar__day-of-week-color);--plasma-calendar-header-wrapper-padding:var(--plasma-date-picker-calendar__header-wrapper-padding);--plasma-calendar-arrow-container-gap:var(--plasma-date-picker-calendar__header-arrow-gap);--plasma-calendar-arrow-container-padding:var(--plasma-date-picker-calendar__header-arrow-padding);--plasma-calendar-header-padding:var(--plasma-date-picker-calendar__header-padding);--plasma-calendar-header-date-gap:var(--plasma-date-picker-calendar__header-date-gap);--plasma-calendar-header-font-family:var(--plasma-date-picker-calendar__header-font-family);--plasma-calendar-header-font-size:var(--plasma-date-picker-calendar__header-font-size);--plasma-calendar-header-font-style:var(--plasma-date-picker-calendar__header-font-style);--plasma-calendar-header-font-letter-spacing:var(--plasma-date-picker-calendar__header-letter-spacing);--plasma-calendar-header-line-height:var(--plasma-date-picker-calendar__header-line-height);--plasma-calendar-header-font-weight:var(--plasma-date-picker-calendar__header-font-weight);--plasma-calendar-header-font-weight-bold:var(--plasma-date-picker-calendar__header-font-weight-bold);--plasma-calendar-header-arrow-color:var(--plasma-date-picker-calendar__header-arrow-color);--plasma-calendar-icon-button-height:var(--plasma-date-picker-icon-button__height);--plasma-calendar-icon-button-width:var(--plasma-date-picker-icon-button__width);--plasma-calendar-icon-button-padding:var(--plasma-date-picker-icon-button__padding);--plasma-calendar-icon-button-radius:var(--plasma-date-picker-icon-button__radius);--plasma-calendar-icon-button-focus-color:var(--plasma-date-picker-icon-button__focus-color);}
|
749
749
|
.DatePickerBase_styles_1vzl5em_i1kteo3u__e2ed1ffa{visibility:hidden;width:0;height:0;opacity:0;margin:0;padding:0;border:none;}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@salutejs/plasma-new-hope",
|
3
|
-
"version": "0.253.0-canary.
|
3
|
+
"version": "0.253.0-canary.1736.13068364841.0",
|
4
4
|
"description": "Salute Design System blueprint",
|
5
5
|
"main": "cjs/index.js",
|
6
6
|
"module": "es/index.js",
|
@@ -131,5 +131,5 @@
|
|
131
131
|
"sideEffects": [
|
132
132
|
"*.css"
|
133
133
|
],
|
134
|
-
"gitHead": "
|
134
|
+
"gitHead": "a98240f91a232120126a7113b1c7991ec1d31257"
|
135
135
|
}
|
@@ -9,6 +9,7 @@ var classes = exports.classes = {
|
|
9
9
|
fixedStretching: 'accordion-stretching-fixed',
|
10
10
|
accordionRoot: 'accordion-root',
|
11
11
|
accordionItem: 'accordion-item',
|
12
|
+
accordionItemOpened: 'accordion-item-opened',
|
12
13
|
clearAccordionItem: 'clear-accordion-item',
|
13
14
|
accordionItemShowBody: 'accordion-item-show-body',
|
14
15
|
accordionPlusAnimationElement: 'accordion-plus-animation-element',
|
@@ -32,6 +33,7 @@ var tokens = exports.tokens = {
|
|
32
33
|
accordionItemIconColor: '--plasma-accordion-item-color-icon',
|
33
34
|
accordionItemIconSize: '--plasma-accordion-item-icon-szie',
|
34
35
|
accordionItemTitleColor: '--plasma-accordion-item-title-color',
|
36
|
+
accordionItemOpenedTitleColor: '--plasma-accordion-item-title-opened-color',
|
35
37
|
accordionItemTitleFontFamily: '--plasma-accordion-item-title-font-family',
|
36
38
|
accordionItemTitleFontSize: '--plasma-accordion-item-title-font-size',
|
37
39
|
accordionItemTitleFontStyle: '--plasma-accordion-item-title-font-style',
|
@@ -82,6 +82,7 @@ var AccordionItem = exports.AccordionItem = /*#__PURE__*/(0, _react.forwardRef)(
|
|
82
82
|
}));
|
83
83
|
};
|
84
84
|
var accordionBorderRadius = (0, _roundness.convertRoundnessMatrix)(pin, "var(".concat(_Accordion.tokens.accordionItemBorderRadius, ")"), '1.5rem');
|
85
|
+
var openedClass = (opened !== null && opened !== void 0 ? opened : value) ? _Accordion.classes.accordionItemOpened : '';
|
85
86
|
var disabledClass = disabled ? _Accordion.classes.accordionDisabled : '';
|
86
87
|
var leftContent = contentLeft !== null && contentLeft !== void 0 ? contentLeft : type === 'arrow' ? /*#__PURE__*/_react["default"].createElement(_AccordionItem.StyledArrow, {
|
87
88
|
size: "xs",
|
@@ -92,7 +93,7 @@ var AccordionItem = exports.AccordionItem = /*#__PURE__*/(0, _react.forwardRef)(
|
|
92
93
|
var rightContent = contentRight !== null && contentRight !== void 0 ? contentRight : type === 'sign' ? /*#__PURE__*/_react["default"].createElement(StyledAnimationPlus, null) : undefined;
|
93
94
|
var rightContentRotate = type === 'sign' && (opened !== null && opened !== void 0 ? opened : value) ? _Accordion.classes.accordionItemShowBody : undefined;
|
94
95
|
return /*#__PURE__*/_react["default"].createElement(_AccordionItem.StyledAccordionItem, {
|
95
|
-
className: (0, _utils.cx)(_Accordion.classes.accordionItem, className, disabledClass),
|
96
|
+
className: (0, _utils.cx)(_Accordion.classes.accordionItem, className, openedClass, disabledClass),
|
96
97
|
key: key,
|
97
98
|
ref: outerRef,
|
98
99
|
style: _objectSpread({
|
@@ -9,11 +9,8 @@ var _Icon = /*#__PURE__*/require("../../../_Icon");
|
|
9
9
|
var _Accordion = /*#__PURE__*/require("../../Accordion.tokens");
|
10
10
|
var _mixins = /*#__PURE__*/require("../../../../mixins");
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
12
|
-
var StyledAccordionItem = exports.StyledAccordionItem = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
13
|
-
componentId: "plasma-new-hope__sc-20ij9z-0"
|
14
|
-
})(["background:var(", ");border:var(", ");border-bottom:var(", ");&:last-child{border-bottom:var(", ");}&.", "{opacity:0.4;cursor:not-allowed;}"], _Accordion.tokens.accordionItemBackground, _Accordion.tokens.accordionItemBorder, _Accordion.tokens.accordionItemBorderBottom, _Accordion.tokens.accordionItemBorder, _Accordion.classes.accordionDisabled);
|
15
12
|
var StyledAccordionHeader = exports.StyledAccordionHeader = /*#__PURE__*/_styledComponents["default"].button.withConfig({
|
16
|
-
componentId: "plasma-new-hope__sc-20ij9z-
|
13
|
+
componentId: "plasma-new-hope__sc-20ij9z-0"
|
17
14
|
})(["width:100%;border:none;padding:var(", ");display:flex;gap:var(", ");justify-content:space-between;align-items:center;background:none;box-sizing:border-box;cursor:pointer;&:focus{outline:none;}", ""], _Accordion.tokens.accordionItemPadding, _Accordion.tokens.accordionItemGap, /*#__PURE__*/(0, _mixins.addFocus)({
|
18
15
|
outlineOffset: '0.125rem',
|
19
16
|
outlineSize: '0.125rem',
|
@@ -21,29 +18,32 @@ var StyledAccordionHeader = exports.StyledAccordionHeader = /*#__PURE__*/_styled
|
|
21
18
|
outlineColor: /*#__PURE__*/"var(".concat(_Accordion.tokens.accordionItemFocus, ")")
|
22
19
|
}));
|
23
20
|
var StyledAccordionHeaderLeft = exports.StyledAccordionHeaderLeft = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
24
|
-
componentId: "plasma-new-hope__sc-20ij9z-
|
21
|
+
componentId: "plasma-new-hope__sc-20ij9z-1"
|
25
22
|
})(["display:flex;gap:var(", ");justify-content:space-between;align-items:center;"], _Accordion.tokens.accordionItemGap);
|
26
23
|
var StyledAccordionContentRight = exports.StyledAccordionContentRight = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
27
|
-
componentId: "plasma-new-hope__sc-20ij9z-
|
24
|
+
componentId: "plasma-new-hope__sc-20ij9z-2"
|
28
25
|
})(["transition:0.2s;transform:rotate(90deg);&.", "{transition:0.2s;transform:rotate(0deg);}"], _Accordion.classes.accordionItemShowBody);
|
29
26
|
var StyledAccordionContentLeft = exports.StyledAccordionContentLeft = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
30
|
-
componentId: "plasma-new-hope__sc-20ij9z-
|
27
|
+
componentId: "plasma-new-hope__sc-20ij9z-3"
|
31
28
|
})(["transition:0.2s;display:flex;align-items:center;&.", "{transition:0.2s;transform:rotate(180deg);}"], _Accordion.classes.accordionItemShowBody);
|
32
29
|
var StyledAccordionTitle = exports.StyledAccordionTitle = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
33
|
-
componentId: "plasma-new-hope__sc-20ij9z-
|
30
|
+
componentId: "plasma-new-hope__sc-20ij9z-4"
|
34
31
|
})(["color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");text-align:left;"], _Accordion.tokens.accordionItemTitleColor, _Accordion.tokens.accordionItemTitleFontFamily, _Accordion.tokens.accordionItemTitleFontSize, _Accordion.tokens.accordionItemTitleFontWeight, _Accordion.tokens.accordionItemTitleFontStyle, _Accordion.tokens.accordionItemTitleLetterSpacing, _Accordion.tokens.accordionItemTitleLineHeight);
|
35
32
|
var StyledAccordionBodyAnimate = exports.StyledAccordionBodyAnimate = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
36
|
-
componentId: "plasma-new-hope__sc-20ij9z-
|
33
|
+
componentId: "plasma-new-hope__sc-20ij9z-5"
|
37
34
|
})(["display:grid;grid-template-rows:0fr;transition:grid-template-rows 0.2s ease-out;overflow:hidden;&.", "{grid-template-rows:1fr;padding-bottom:var(", ");&.", "{transition:0.2s;transform:rotate(0deg);}}"], _Accordion.classes.accordionItemShowBody, _Accordion.tokens.accordionItemPaddingVertical, _Accordion.classes.accordionPlusAnimationElement);
|
38
35
|
var StyledAccordionBody = exports.StyledAccordionBody = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
39
|
-
componentId: "plasma-new-hope__sc-20ij9z-
|
36
|
+
componentId: "plasma-new-hope__sc-20ij9z-6"
|
40
37
|
})(["color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");overflow:hidden;padding-right:var(", ");padding-left:var(", ");text-align:left;"], _Accordion.tokens.accordionItemTextColor, _Accordion.tokens.accordionItemTextFontFamily, _Accordion.tokens.accordionItemTextFontSize, _Accordion.tokens.accordionItemTextFontWeight, _Accordion.tokens.accordionItemTextFontStyle, _Accordion.tokens.accordionItemTextLetterSpacing, _Accordion.tokens.accordionItemTextLineHeight, _Accordion.tokens.accordionItemPaddingHorizontal, _Accordion.tokens.accordionItemPaddingHorizontalLeft);
|
41
38
|
var StyledArrow = exports.StyledArrow = /*#__PURE__*/(0, _styledComponents["default"])(_Icon.IconChevronDownFill).withConfig({
|
42
|
-
componentId: "plasma-new-hope__sc-20ij9z-
|
39
|
+
componentId: "plasma-new-hope__sc-20ij9z-7"
|
43
40
|
})(["pointer-events:none;user-select:none;color:var(", ");"], _Accordion.tokens.accordionItemIconColor);
|
44
41
|
var StyledMinus = exports.StyledMinus = /*#__PURE__*/(0, _styledComponents["default"])(_Icon.IconMinus).withConfig({
|
45
|
-
componentId: "plasma-new-hope__sc-20ij9z-
|
46
|
-
})(["pointer-events:none;user-select:none;color:var(", ");display:flex;align-items:center;position:absolute;top:0;left:0;&.", "{transition:0.2s;transform:rotate(90deg);}&.", "{transition:0.2s;transform:rotate(0deg);}"], _Accordion.tokens.accordionItemIconColor, _Accordion.classes.accordionPlusAnimationElement, _Accordion.classes.accordionItemShowBody);
|
42
|
+
componentId: "plasma-new-hope__sc-20ij9z-8"
|
43
|
+
})(["pointer-events:none;user-select:none;color:var(", ");display:flex;align-items:center;position:absolute;top:0;left:0;&.", "{transition:0.2s;transform:rotate(90deg);}&.", "{transition:0.2s;transform:rotate(0deg);color:var(", ",var(", "));}"], _Accordion.tokens.accordionItemIconColor, _Accordion.classes.accordionPlusAnimationElement, _Accordion.classes.accordionItemShowBody, _Accordion.tokens.accordionItemOpenedTitleColor, _Accordion.tokens.accordionItemIconColor);
|
47
44
|
var StyledPlus = exports.StyledPlus = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
45
|
+
componentId: "plasma-new-hope__sc-20ij9z-9"
|
46
|
+
})(["position:relative;display:flex;align-items:center;justify-content:center;width:var(", ",1rem);height:var(", ",1rem);"], _Accordion.tokens.accordionItemIconSize, _Accordion.tokens.accordionItemIconSize);
|
47
|
+
var StyledAccordionItem = exports.StyledAccordionItem = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
48
48
|
componentId: "plasma-new-hope__sc-20ij9z-10"
|
49
|
-
})(["
|
49
|
+
})(["background:var(", ");border:var(", ");border-bottom:var(", ");&:last-child{border-bottom:var(", ");}&.", "{opacity:0.4;cursor:not-allowed;}&.", "{", "{color:var(", ",var(", "));}", "{color:var(", ",var(", "));}}"], _Accordion.tokens.accordionItemBackground, _Accordion.tokens.accordionItemBorder, _Accordion.tokens.accordionItemBorderBottom, _Accordion.tokens.accordionItemBorder, _Accordion.classes.accordionDisabled, _Accordion.classes.accordionItemOpened, StyledArrow, _Accordion.tokens.accordionItemOpenedTitleColor, _Accordion.tokens.accordionItemIconColor, StyledAccordionTitle, _Accordion.tokens.accordionItemOpenedTitleColor, _Accordion.tokens.accordionItemTitleColor);
|
@@ -15,7 +15,7 @@ var _base2 = /*#__PURE__*/require("./variations/_size/base");
|
|
15
15
|
var _base3 = /*#__PURE__*/require("./variations/_pilled/base");
|
16
16
|
var _base4 = /*#__PURE__*/require("./variations/_closeIconType/base");
|
17
17
|
var _Toast2 = /*#__PURE__*/require("./Toast.styles");
|
18
|
-
var _excluded = ["role", "width", "text", "hasClose", "contentLeft", "view", "size", "pilled", "className", "style", "closeIconType", "onCloseButtonClick"
|
18
|
+
var _excluded = ["role", "width", "text", "hasClose", "contentLeft", "view", "size", "pilled", "className", "style", "closeIconType", "onCloseButtonClick"];
|
19
19
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
20
20
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
21
21
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
@@ -42,7 +42,6 @@ var toastRoot = exports.toastRoot = function toastRoot(Root) {
|
|
42
42
|
style = props.style,
|
43
43
|
closeIconType = props.closeIconType,
|
44
44
|
onCloseButtonClick = props.onCloseButtonClick,
|
45
|
-
textColor = props.textColor,
|
46
45
|
rest = _objectWithoutProperties(props, _excluded);
|
47
46
|
var pilledClass = pilled ? _Toast.classes.toastPilled : undefined;
|
48
47
|
var fixedWidth = !Number.isNaN(Number(width)) ? "".concat(width, "%") : width;
|
@@ -66,9 +65,7 @@ var toastRoot = exports.toastRoot = function toastRoot(Root) {
|
|
66
65
|
role: role,
|
67
66
|
"aria-live": ariaLive,
|
68
67
|
"aria-atomic": ariaAtomic
|
69
|
-
}, rest), contentLeft && /*#__PURE__*/_react["default"].createElement(_Toast2.StyledContentLeft, null, contentLeft), /*#__PURE__*/_react["default"].createElement(_Toast2.StyledContent, {
|
70
|
-
textColor: textColor
|
71
|
-
}, text), hasClose && /*#__PURE__*/_react["default"].createElement(_Toast2.CloseIconWrapper, {
|
68
|
+
}, rest), contentLeft && /*#__PURE__*/_react["default"].createElement(_Toast2.StyledContentLeft, null, contentLeft), /*#__PURE__*/_react["default"].createElement(_Toast2.StyledContent, null, text), hasClose && /*#__PURE__*/_react["default"].createElement(_Toast2.CloseIconWrapper, {
|
72
69
|
view: "clear",
|
73
70
|
size: "s",
|
74
71
|
onClick: onCloseButtonClick,
|
@@ -42,10 +42,7 @@ var StyledOverlay = exports.StyledOverlay = /*#__PURE__*/(0, _styledComponents["
|
|
42
42
|
})(["&&.", "{animation:0.3s showFadeAnimation ease-out forwards;}&&.", "{animation:0.3s hideFadeAnimation ease-out forwards;}@keyframes showFadeAnimation{0%{opacity:0;}100%{opacity:1;}}@keyframes hideFadeAnimation{0%{opacity:1;}100%{opacity:0;}}"], /*#__PURE__*/String(_Toast.classes.toastFadeShowed), /*#__PURE__*/String(_Toast.classes.toastFadeHidden));
|
43
43
|
var StyledContentLeft = exports.StyledContentLeft = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
44
44
|
componentId: "plasma-new-hope__sc-19l9ekl-3"
|
45
|
-
})(["display:flex;--plasma_private-content-
|
45
|
+
})(["display:flex;--plasma_private-left-content-margin:var(", ");margin:var(--plasma_private-left-content-margin);"], _Toast.tokens.leftContentMargin);
|
46
46
|
var StyledContent = exports.StyledContent = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
47
47
|
componentId: "plasma-new-hope__sc-19l9ekl-4"
|
48
|
-
})(["
|
49
|
-
var textColor = _ref5.textColor;
|
50
|
-
return textColor || 'currentColor';
|
51
|
-
});
|
48
|
+
})([""]);
|
@@ -104,10 +104,6 @@ export interface ShowToastArgs {
|
|
104
104
|
* Время отображения подсказки. Если не передать значение, подсказка будет отображаться пока ее не закроют.
|
105
105
|
*/
|
106
106
|
timeout?: number;
|
107
|
-
/**
|
108
|
-
* Цвет текста (по умолчанию берётся цвет из view)
|
109
|
-
*/
|
110
|
-
textColor?: string;
|
111
107
|
/**
|
112
108
|
* callback срабатывающий в момент события hideToast
|
113
109
|
*/
|
@@ -121,11 +117,9 @@ export interface ShowToastArgs {
|
|
121
117
|
|
122
118
|
## Пример использования
|
123
119
|
|
124
|
-
Для изменения цветовой темы компонента `Toast` используйте свойство `view` компонента `ViewContainer`.
|
125
|
-
|
126
120
|
```jsx live
|
127
121
|
import React from 'react'
|
128
|
-
import { useToast, ToastProvider, Button
|
122
|
+
import { useToast, ToastProvider, Button } from '@salutejs/{{ package }}'
|
129
123
|
|
130
124
|
export function App() {
|
131
125
|
|
@@ -136,13 +130,12 @@ export function App() {
|
|
136
130
|
const onHide = () => {}
|
137
131
|
const toastData = {
|
138
132
|
text: 'Подсказка вызванная showToast',
|
139
|
-
textColor: 'cyan',
|
140
133
|
position: 'bottom',
|
141
134
|
role: 'status',
|
142
135
|
hasClose: true,
|
143
136
|
fade: false,
|
144
137
|
size: 'm',
|
145
|
-
view: '
|
138
|
+
view: 'dark',
|
146
139
|
timeout: 3000,
|
147
140
|
onShow,
|
148
141
|
onHide
|
@@ -152,19 +145,9 @@ export function App() {
|
|
152
145
|
}
|
153
146
|
|
154
147
|
return (
|
155
|
-
<
|
156
|
-
<
|
157
|
-
|
158
|
-
<ToastExample />
|
159
|
-
</ToastProvider>
|
160
|
-
</ViewContainer>
|
161
|
-
|
162
|
-
<ViewContainer view="onDark">
|
163
|
-
<ToastProvider>
|
164
|
-
<ToastExample />
|
165
|
-
</ToastProvider>
|
166
|
-
</ViewContainer>
|
167
|
-
</div>
|
148
|
+
<ToastProvider>
|
149
|
+
<ToastExample />
|
150
|
+
</ToastProvider>
|
168
151
|
)
|
169
152
|
}
|
170
153
|
```
|
@@ -25,8 +25,7 @@ var tokens = exports.tokens = {
|
|
25
25
|
letterSpacing: '--plasma-toast-letter-spacing',
|
26
26
|
lineHeight: '--plasma-toast-lineheight',
|
27
27
|
pilledBorderRadius: '--plasma-toast-pilled-border-radius',
|
28
|
-
|
29
|
-
contentLeftColor: '--plasma-toast-content-left-color',
|
28
|
+
leftContentMargin: '--plasma-toast-left-content-margin',
|
30
29
|
closeIconMargin: '--plasma-toast-close-icon-margin',
|
31
30
|
closeIconColor: '--plasma-toast-close-icon-color',
|
32
31
|
closeIconColorOnHover: '--plasma-toast-close-icon-color-on-hover',
|
@@ -126,9 +126,6 @@ var ToastProviderHoc = exports.ToastProviderHoc = function ToastProviderHoc(Toas
|
|
126
126
|
size = _getShowToastCallSign.size,
|
127
127
|
view = _getShowToastCallSign.view,
|
128
128
|
width = _getShowToastCallSign.width,
|
129
|
-
_getShowToastCallSign4 = _getShowToastCallSign.closeIconType,
|
130
|
-
closeIconType = _getShowToastCallSign4 === void 0 ? _utils.DEFAULT_CLOSE_ICON_TYPE : _getShowToastCallSign4,
|
131
|
-
textColor = _getShowToastCallSign.textColor,
|
132
129
|
onHide = _getShowToastCallSign.onHide,
|
133
130
|
onShow = _getShowToastCallSign.onShow;
|
134
131
|
setToastProps({
|
@@ -142,9 +139,7 @@ var ToastProviderHoc = exports.ToastProviderHoc = function ToastProviderHoc(Toas
|
|
142
139
|
pilled: pilled,
|
143
140
|
hasClose: hasClose,
|
144
141
|
size: size,
|
145
|
-
view: view
|
146
|
-
closeIconType: closeIconType,
|
147
|
-
textColor: textColor
|
142
|
+
view: view
|
148
143
|
});
|
149
144
|
setToastInfo({
|
150
145
|
timeout: timeout,
|
@@ -3,12 +3,11 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.gradients = exports.TOAST_Z_INDEX = exports.TIMER_DELAY = exports.FADE_Z_INDEX = exports.DEFAULT_POSITION = exports.DEFAULT_FADE = exports.
|
6
|
+
exports.gradients = exports.TOAST_Z_INDEX = exports.TIMER_DELAY = exports.FADE_Z_INDEX = exports.DEFAULT_POSITION = exports.DEFAULT_FADE = exports.Button = void 0;
|
7
7
|
var _Button = /*#__PURE__*/require("../Button");
|
8
8
|
var _engines = /*#__PURE__*/require("../../engines");
|
9
9
|
var DEFAULT_FADE = exports.DEFAULT_FADE = true;
|
10
10
|
var DEFAULT_POSITION = exports.DEFAULT_POSITION = 'bottom';
|
11
|
-
var DEFAULT_CLOSE_ICON_TYPE = exports.DEFAULT_CLOSE_ICON_TYPE = 'default';
|
12
11
|
var TIMER_DELAY = exports.TIMER_DELAY = 300;
|
13
12
|
var FADE_Z_INDEX = exports.FADE_Z_INDEX = '9900';
|
14
13
|
var TOAST_Z_INDEX = exports.TOAST_Z_INDEX = '9901';
|
@@ -6,4 +6,4 @@ Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
exports.base = void 0;
|
7
7
|
var _styledComponents = /*#__PURE__*/require("styled-components");
|
8
8
|
var _Toast = /*#__PURE__*/require("../../Toast.tokens");
|
9
|
-
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{--plasma_private-content-
|
9
|
+
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{--plasma_private-left-content-margin:var(", ");--plasma_private-close-icon-margin:var(", ");border-radius:var(", ");}"], /*#__PURE__*/String(_Toast.classes.toastPilled), _Toast.tokens.leftContentMargin, _Toast.tokens.closeIconMargin, _Toast.tokens.pilledBorderRadius);
|
@@ -15,24 +15,14 @@ var config = exports.config = {
|
|
15
15
|
variations: {
|
16
16
|
view: {
|
17
17
|
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--surface-solid-card-brightness);", ":var(--text-secondary);", ":var(--text-secondary);"], _Toast.toastTokens.color, _Toast.toastTokens.background, _Toast.toastTokens.closeIconColor, _Toast.toastTokens.closeIconColorOnHover),
|
18
|
-
positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--surface-solid-card-brightness);", ":var(--text-positive);", ":var(--text-secondary);", ":var(--text-secondary);"], _Toast.toastTokens.color, _Toast.toastTokens.background, _Toast.toastTokens.contentLeftColor, _Toast.toastTokens.closeIconColor, _Toast.toastTokens.closeIconColorOnHover),
|
19
|
-
negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--surface-solid-card-brightness);", ":var(--text-negative);", ":var(--text-secondary);", ":var(--text-secondary);"], _Toast.toastTokens.color, _Toast.toastTokens.background, _Toast.toastTokens.contentLeftColor, _Toast.toastTokens.closeIconColor, _Toast.toastTokens.closeIconColorOnHover),
|
20
|
-
/**
|
21
|
-
* @deprecated
|
22
|
-
* светлый и темный фон регулировать через `view` компонента `ViewContainer`
|
23
|
-
*/
|
24
18
|
dark: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--on-dark-surface-solid-primary-brightness);", ":var(--on-dark-text-secondary);", ":var(--on-dark-text-secondary);"], _Toast.toastTokens.color, _Toast.toastTokens.background, _Toast.toastTokens.closeIconColor, _Toast.toastTokens.closeIconColorOnHover),
|
25
|
-
/**
|
26
|
-
* @deprecated
|
27
|
-
* светлый и темный фон регулировать через `view` компонента `ViewContainer`
|
28
|
-
*/
|
29
19
|
light: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-light-text-primary);", ":var(--on-light-surface-solid-primary-brightness);", ":var(--on-light-text-secondary);", ":var(--on-light-text-secondary);"], _Toast.toastTokens.color, _Toast.toastTokens.background, _Toast.toastTokens.closeIconColor, _Toast.toastTokens.closeIconColorOnHover)
|
30
20
|
},
|
31
21
|
size: {
|
32
|
-
m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.75rem;", ":calc(100vw - 5rem);", ":0.5625rem 0.75rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-0.0625rem 0.375rem -0.0625rem -0.125rem;", ":-0.0625rem -0.25rem -0.0625rem 0.5rem;"], _Toast.toastTokens.borderRadius, _Toast.toastTokens.maxWidth, _Toast.toastTokens.padding, _Toast.toastTokens.fontFamily, _Toast.toastTokens.fontSize, _Toast.toastTokens.fontStyle, _Toast.toastTokens.fontWeight, _Toast.toastTokens.letterSpacing, _Toast.toastTokens.lineHeight, _Toast.toastTokens.
|
22
|
+
m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.75rem;", ":calc(100vw - 5rem);", ":0.5625rem 0.75rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":-0.0625rem 0.375rem -0.0625rem -0.125rem;", ":-0.0625rem -0.25rem -0.0625rem 0.5rem;"], _Toast.toastTokens.borderRadius, _Toast.toastTokens.maxWidth, _Toast.toastTokens.padding, _Toast.toastTokens.fontFamily, _Toast.toastTokens.fontSize, _Toast.toastTokens.fontStyle, _Toast.toastTokens.fontWeight, _Toast.toastTokens.letterSpacing, _Toast.toastTokens.lineHeight, _Toast.toastTokens.leftContentMargin, _Toast.toastTokens.closeIconMargin)
|
33
23
|
},
|
34
24
|
pilled: {
|
35
|
-
"true": /*#__PURE__*/(0, _styledComponents.css)(["", ":1.5rem;", ":-0.0625rem 0.375rem -0.0625rem -0.25rem;", ":-0.0625rem -0.25rem -0.0625rem 0.375rem;"], _Toast.toastTokens.pilledBorderRadius, _Toast.toastTokens.
|
25
|
+
"true": /*#__PURE__*/(0, _styledComponents.css)(["", ":1.5rem;", ":-0.0625rem 0.375rem -0.0625rem -0.25rem;", ":-0.0625rem -0.25rem -0.0625rem 0.375rem;"], _Toast.toastTokens.pilledBorderRadius, _Toast.toastTokens.leftContentMargin, _Toast.toastTokens.closeIconMargin)
|
36
26
|
},
|
37
27
|
closeIconType: {
|
38
28
|
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":1rem;", ":1.5rem;"], _Toast.toastTokens.closeIconButtonSize, _Toast.toastTokens.closeIconSize),
|
@@ -4,39 +4,21 @@ import { action } from '@storybook/addon-actions';
|
|
4
4
|
import styled from 'styled-components';
|
5
5
|
import { disableProps } from '@salutejs/plasma-sb-utils';
|
6
6
|
|
7
|
-
import {
|
7
|
+
import { toastConfig } from '../../../../components/Toast';
|
8
|
+
import { mergeConfig } from '../../../../engines';
|
9
|
+
import { WithTheme, argTypesFromConfig } from '../../../_helpers';
|
8
10
|
import { Button } from '../Button/Button';
|
9
11
|
import { PopupProvider } from '../Popup/Popup';
|
10
12
|
import { addNotification } from '../../../../../src/components/Notification';
|
11
13
|
import { NotificationsProvider } from '../Notification/Notification';
|
12
14
|
import { Modal } from '../Modal/Modal';
|
13
15
|
|
16
|
+
import { config } from './Toast.config';
|
14
17
|
import { Toast, ToastController, ToastProvider, useToast } from './Toast';
|
15
18
|
|
16
|
-
const views = ['default', 'positive', 'negative'];
|
17
|
-
const closeIconTypes = ['default', 'thin'];
|
18
|
-
|
19
19
|
const meta: Meta<typeof ToastController> = {
|
20
20
|
title: 'b2c/Overlay/Toast',
|
21
21
|
decorators: [WithTheme],
|
22
|
-
argTypes: {
|
23
|
-
view: {
|
24
|
-
options: views,
|
25
|
-
control: {
|
26
|
-
type: 'select',
|
27
|
-
},
|
28
|
-
},
|
29
|
-
closeIconType: {
|
30
|
-
options: closeIconTypes,
|
31
|
-
control: {
|
32
|
-
type: 'select',
|
33
|
-
},
|
34
|
-
},
|
35
|
-
textColor: {
|
36
|
-
control: 'color',
|
37
|
-
},
|
38
|
-
...disableProps(['size']),
|
39
|
-
},
|
40
22
|
};
|
41
23
|
|
42
24
|
export default meta;
|
@@ -67,6 +49,7 @@ const StyledWrapper = styled.div`
|
|
67
49
|
`;
|
68
50
|
|
69
51
|
const ToastContainer = styled.div`
|
52
|
+
position: fixed;
|
70
53
|
transform: translateX(50%);
|
71
54
|
`;
|
72
55
|
|
@@ -78,7 +61,6 @@ const Container = styled.div`
|
|
78
61
|
export const ToastComponent: StoryComponent = {
|
79
62
|
args: {
|
80
63
|
text: 'Текст всплывающего уведомления',
|
81
|
-
textColor: undefined,
|
82
64
|
view: 'default',
|
83
65
|
closeIconType: 'default',
|
84
66
|
size: 'm',
|
@@ -86,6 +68,14 @@ export const ToastComponent: StoryComponent = {
|
|
86
68
|
enableContentLeft: true,
|
87
69
|
pilled: false,
|
88
70
|
},
|
71
|
+
argTypes: {
|
72
|
+
closeIconType: {
|
73
|
+
options: ['default', 'thin'],
|
74
|
+
control: {
|
75
|
+
type: 'select',
|
76
|
+
},
|
77
|
+
},
|
78
|
+
},
|
89
79
|
render: ({ enableContentLeft, ...args }) => (
|
90
80
|
<ToastContainer>
|
91
81
|
<Toast contentLeft={enableContentLeft && <BellIcon width="1rem" height="1rem" />} {...args} />
|
@@ -104,8 +94,6 @@ const StoryLiveDemo = ({
|
|
104
94
|
size,
|
105
95
|
hasClose,
|
106
96
|
enableContentLeft,
|
107
|
-
closeIconType,
|
108
|
-
textColor,
|
109
97
|
}: StoryProps) => {
|
110
98
|
const { showToast, hideToast } = useToast();
|
111
99
|
const contentLeft = enableContentLeft && <BellIcon width="1rem" height="1rem" />;
|
@@ -126,8 +114,6 @@ const StoryLiveDemo = ({
|
|
126
114
|
view,
|
127
115
|
size,
|
128
116
|
hasClose,
|
129
|
-
closeIconType,
|
130
|
-
textColor,
|
131
117
|
onHide: action('onHide'),
|
132
118
|
onShow: action('onShow'),
|
133
119
|
});
|
@@ -155,6 +141,7 @@ export const LiveDemo: Story = {
|
|
155
141
|
type: 'inline-radio',
|
156
142
|
},
|
157
143
|
},
|
144
|
+
...argTypesFromConfig(mergeConfig(toastConfig, config)),
|
158
145
|
...disableProps(['role', 'onShow', 'onHide', 'contentLeft']),
|
159
146
|
},
|
160
147
|
parameters: {
|
@@ -180,8 +167,6 @@ const StoryComplex = ({
|
|
180
167
|
size,
|
181
168
|
hasClose,
|
182
169
|
enableContentLeft,
|
183
|
-
closeIconType,
|
184
|
-
textColor,
|
185
170
|
}: StoryProps) => {
|
186
171
|
const [isModalOpen, setIsModalOpen] = useState(false);
|
187
172
|
|
@@ -200,8 +185,6 @@ const StoryComplex = ({
|
|
200
185
|
view,
|
201
186
|
size,
|
202
187
|
hasClose,
|
203
|
-
closeIconType,
|
204
|
-
textColor,
|
205
188
|
onHide: action('onHide'),
|
206
189
|
onShow: action('onShow'),
|
207
190
|
});
|