@salutejs/plasma-new-hope 0.194.0-canary.1562.11857238836.0 → 0.194.0-canary.1568.11891833298.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/cjs/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
- package/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js.map +1 -1
- package/cjs/components/Combobox/ComboboxOld/Combobox.css +4 -5
- package/cjs/components/Combobox/ComboboxOld/ui/ComboboxDivider/ComboboxDivider.css +4 -5
- package/cjs/components/Combobox/ComboboxOld/ui/ComboboxFooter/ComboboxFooter.css +4 -5
- package/cjs/components/Combobox/ComboboxOld/ui/ComboboxGroup/ComboboxGroup.css +4 -5
- package/cjs/components/Combobox/ComboboxOld/ui/ComboboxHeader/ComboboxHeader.css +4 -5
- package/cjs/components/Dropdown/Dropdown.css +4 -5
- package/cjs/components/Dropdown/Dropdown.js +2 -4
- package/cjs/components/Dropdown/Dropdown.js.map +1 -1
- package/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.css +4 -5
- package/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.js +2 -3
- package/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.js.map +1 -1
- package/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +1 -7
- package/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js.map +1 -1
- package/cjs/components/Dropdown/ui/DropdownItem/{DropdownItem.styles_14yih1y.css → DropdownItem.styles_1b439rx.css} +0 -1
- package/cjs/components/Select/Select.js +1 -0
- package/cjs/components/Select/Select.js.map +1 -1
- package/cjs/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/cjs/components/Select/ui/Inner/ui/Item/Item.js.map +1 -1
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +3 -18
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js.map +1 -1
- package/cjs/components/Switch/Switch.css +2 -2
- package/cjs/components/Switch/Switch.tokens.js +7 -1
- package/cjs/components/Switch/Switch.tokens.js.map +1 -1
- package/cjs/components/Switch/_toggleSize/base.js +1 -1
- package/cjs/components/Switch/_toggleSize/base.js.map +1 -1
- package/cjs/components/Switch/_toggleSize/base_1d0b3t4.css +1 -0
- package/cjs/components/Switch/_view/base.js +1 -1
- package/cjs/components/Switch/_view/base.js.map +1 -1
- package/cjs/components/Switch/_view/base_15atbyp.css +1 -0
- package/cjs/index.css +6 -7
- package/emotion/cjs/components/Card/Card.api.mdx +184 -0
- package/emotion/cjs/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/emotion/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/emotion/cjs/components/Dropdown/Dropdown.js +2 -4
- package/emotion/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.js +2 -3
- package/emotion/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +11 -15
- package/emotion/cjs/components/Select/Select.js +1 -0
- package/emotion/cjs/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/emotion/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +3 -24
- package/emotion/cjs/components/Switch/Switch.tokens.js +7 -1
- package/emotion/cjs/components/Switch/_toggleSize/base.js +1 -1
- package/emotion/cjs/components/Switch/_view/base.js +1 -1
- package/emotion/cjs/examples/plasma_b2c/components/Switch/Switch.config.js +8 -8
- package/emotion/cjs/examples/plasma_b2c/components/Switch/Switch.js +5 -2
- package/emotion/cjs/examples/plasma_b2c/components/Switch/Switch.outline.config.js +37 -0
- package/emotion/cjs/examples/plasma_b2c/components/Switch/Switch.stories.tsx +33 -1
- package/emotion/cjs/examples/plasma_web/components/Switch/Switch.config.js +8 -8
- package/emotion/cjs/examples/plasma_web/components/Switch/Switch.js +5 -2
- package/emotion/cjs/examples/plasma_web/components/Switch/Switch.outline.config.js +37 -0
- package/emotion/cjs/examples/plasma_web/components/Switch/Switch.stories.tsx +33 -1
- package/emotion/es/components/Card/Card.api.mdx +184 -0
- package/emotion/es/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/emotion/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/emotion/es/components/Dropdown/Dropdown.js +2 -4
- package/emotion/es/components/Dropdown/ui/DropdownItem/DropdownItem.js +3 -4
- package/emotion/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +11 -15
- package/emotion/es/components/Select/Select.js +1 -0
- package/emotion/es/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/emotion/es/components/Select/ui/Target/ui/Textfield/Textfield.js +3 -24
- package/emotion/es/components/Switch/Switch.tokens.js +7 -1
- package/emotion/es/components/Switch/_toggleSize/base.js +1 -1
- package/emotion/es/components/Switch/_view/base.js +1 -1
- package/emotion/es/examples/plasma_b2c/components/Switch/Switch.config.js +8 -8
- package/emotion/es/examples/plasma_b2c/components/Switch/Switch.js +4 -1
- package/emotion/es/examples/plasma_b2c/components/Switch/Switch.outline.config.js +31 -0
- package/emotion/es/examples/plasma_b2c/components/Switch/Switch.stories.tsx +33 -1
- package/emotion/es/examples/plasma_web/components/Switch/Switch.config.js +8 -8
- package/emotion/es/examples/plasma_web/components/Switch/Switch.js +4 -1
- package/emotion/es/examples/plasma_web/components/Switch/Switch.outline.config.js +31 -0
- package/emotion/es/examples/plasma_web/components/Switch/Switch.stories.tsx +33 -1
- package/es/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/es/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
- package/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js.map +1 -1
- package/es/components/Combobox/ComboboxOld/Combobox.css +4 -5
- package/es/components/Combobox/ComboboxOld/ui/ComboboxDivider/ComboboxDivider.css +4 -5
- package/es/components/Combobox/ComboboxOld/ui/ComboboxFooter/ComboboxFooter.css +4 -5
- package/es/components/Combobox/ComboboxOld/ui/ComboboxGroup/ComboboxGroup.css +4 -5
- package/es/components/Combobox/ComboboxOld/ui/ComboboxHeader/ComboboxHeader.css +4 -5
- package/es/components/Dropdown/Dropdown.css +4 -5
- package/es/components/Dropdown/Dropdown.js +2 -4
- package/es/components/Dropdown/Dropdown.js.map +1 -1
- package/es/components/Dropdown/ui/DropdownItem/DropdownItem.css +4 -5
- package/es/components/Dropdown/ui/DropdownItem/DropdownItem.js +3 -4
- package/es/components/Dropdown/ui/DropdownItem/DropdownItem.js.map +1 -1
- package/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +2 -7
- package/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js.map +1 -1
- package/es/components/Dropdown/ui/DropdownItem/{DropdownItem.styles_14yih1y.css → DropdownItem.styles_1b439rx.css} +0 -1
- package/es/components/Select/Select.js +1 -0
- package/es/components/Select/Select.js.map +1 -1
- package/es/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/es/components/Select/ui/Inner/ui/Item/Item.js.map +1 -1
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.js +4 -19
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.js.map +1 -1
- package/es/components/Switch/Switch.css +2 -2
- package/es/components/Switch/Switch.tokens.js +7 -1
- package/es/components/Switch/Switch.tokens.js.map +1 -1
- package/es/components/Switch/_toggleSize/base.js +1 -1
- package/es/components/Switch/_toggleSize/base.js.map +1 -1
- package/es/components/Switch/_toggleSize/base_1d0b3t4.css +1 -0
- package/es/components/Switch/_view/base.js +1 -1
- package/es/components/Switch/_view/base.js.map +1 -1
- package/es/components/Switch/_view/base_15atbyp.css +1 -0
- package/es/index.css +6 -7
- package/package.json +2 -3
- package/styled-components/cjs/components/Card/Card.api.mdx +184 -0
- package/styled-components/cjs/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/styled-components/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/styled-components/cjs/components/Dropdown/Dropdown.js +2 -4
- package/styled-components/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.js +2 -3
- package/styled-components/cjs/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +2 -5
- package/styled-components/cjs/components/Select/Select.js +1 -0
- package/styled-components/cjs/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/styled-components/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +3 -24
- package/styled-components/cjs/components/Switch/Switch.tokens.js +7 -1
- package/styled-components/cjs/components/Switch/_toggleSize/base.js +1 -1
- package/styled-components/cjs/components/Switch/_view/base.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.config.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.js +5 -2
- package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.outline.config.js +37 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Switch/Switch.stories.tsx +33 -1
- package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.config.js +1 -1
- package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.js +5 -2
- package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.outline.config.js +37 -0
- package/styled-components/cjs/examples/plasma_web/components/Switch/Switch.stories.tsx +33 -1
- package/styled-components/es/components/Card/Card.api.mdx +184 -0
- package/styled-components/es/components/Combobox/ComboboxNew/Combobox.js +1 -0
- package/styled-components/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -1
- package/styled-components/es/components/Dropdown/Dropdown.js +2 -4
- package/styled-components/es/components/Dropdown/ui/DropdownItem/DropdownItem.js +3 -4
- package/styled-components/es/components/Dropdown/ui/DropdownItem/DropdownItem.styles.js +2 -5
- package/styled-components/es/components/Select/Select.js +1 -0
- package/styled-components/es/components/Select/ui/Inner/ui/Item/Item.js +2 -1
- package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.js +3 -24
- package/styled-components/es/components/Switch/Switch.tokens.js +7 -1
- package/styled-components/es/components/Switch/_toggleSize/base.js +1 -1
- package/styled-components/es/components/Switch/_view/base.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.config.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.js +4 -1
- package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.outline.config.js +31 -0
- package/styled-components/es/examples/plasma_b2c/components/Switch/Switch.stories.tsx +33 -1
- package/styled-components/es/examples/plasma_web/components/Switch/Switch.config.js +1 -1
- package/styled-components/es/examples/plasma_web/components/Switch/Switch.js +4 -1
- package/styled-components/es/examples/plasma_web/components/Switch/Switch.outline.config.js +31 -0
- package/styled-components/es/examples/plasma_web/components/Switch/Switch.stories.tsx +33 -1
- package/types/components/Combobox/ComboboxNew/Combobox.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts +2 -1
- package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.d.ts.map +1 -1
- package/types/components/Dropdown/Dropdown.d.ts +2 -50
- package/types/components/Dropdown/Dropdown.d.ts.map +1 -1
- package/types/components/Dropdown/Dropdown.types.d.ts +6 -11
- package/types/components/Dropdown/Dropdown.types.d.ts.map +1 -1
- package/types/components/Dropdown/index.d.ts +0 -1
- package/types/components/Dropdown/index.d.ts.map +1 -1
- package/types/components/Dropdown/ui/DropdownItem/DropdownItem.d.ts.map +1 -1
- package/types/components/Dropdown/ui/DropdownItem/DropdownItem.styles.d.ts +0 -1
- package/types/components/Dropdown/ui/DropdownItem/DropdownItem.styles.d.ts.map +1 -1
- package/types/components/Select/Select.d.ts.map +1 -1
- package/types/components/Select/Select.types.d.ts +2 -1
- package/types/components/Select/Select.types.d.ts.map +1 -1
- package/types/components/Select/ui/Inner/ui/Item/Item.d.ts.map +1 -1
- package/types/components/Select/ui/Target/ui/Textfield/Textfield.d.ts.map +1 -1
- package/types/components/Switch/Switch.tokens.d.ts +7 -1
- package/types/components/Switch/Switch.tokens.d.ts.map +1 -1
- package/types/components/Switch/_toggleSize/base.d.ts.map +1 -1
- package/types/components/Switch/_view/base.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Dropdown/Dropdown.d.ts +1 -25
- package/types/examples/plasma_b2c/components/Dropdown/Dropdown.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Switch/Switch.config.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Switch/Switch.d.ts +20 -0
- package/types/examples/plasma_b2c/components/Switch/Switch.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Switch/Switch.outline.config.d.ts +30 -0
- package/types/examples/plasma_b2c/components/Switch/Switch.outline.config.d.ts.map +1 -0
- package/types/examples/plasma_web/components/Dropdown/Dropdown.d.ts +1 -25
- package/types/examples/plasma_web/components/Dropdown/Dropdown.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Switch/Switch.config.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Switch/Switch.d.ts +20 -0
- package/types/examples/plasma_web/components/Switch/Switch.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Switch/Switch.outline.config.d.ts +30 -0
- package/types/examples/plasma_web/components/Switch/Switch.outline.config.d.ts.map +1 -0
- package/cjs/components/Switch/_toggleSize/base_6i0904.css +0 -1
- package/cjs/components/Switch/_view/base_yxkf3s.css +0 -1
- package/es/components/Switch/_toggleSize/base_6i0904.css +0 -1
- package/es/components/Switch/_view/base_yxkf3s.css +0 -1
@@ -1,8 +1,8 @@
|
|
1
1
|
.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_s10fscgc__e2c572a3{font-family:var(--plasma-switch-font-family);font-style:var(--plasma-switch-font-style);font-weight:var(--plasma-switch-font-weight);-webkit-letter-spacing:var(--plasma-switch-letter-spacing);-moz-letter-spacing:var(--plasma-switch-letter-spacing);-ms-letter-spacing:var(--plasma-switch-letter-spacing);letter-spacing:var(--plasma-switch-letter-spacing);line-height:var(--plasma-switch-line-height);font-size:var(--plasma-switch-font-size);}.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_sdjnckq__e2c572a3{font-family:var(--plasma-switch-description-font-family);font-style:var(--plasma-switch-description-font-style);font-weight:var(--plasma-switch-description-font-weight);-webkit-letter-spacing:var(--plasma-switch-description-letter-spacing);-moz-letter-spacing:var(--plasma-switch-description-letter-spacing);-ms-letter-spacing:var(--plasma-switch-description-letter-spacing);letter-spacing:var(--plasma-switch-description-letter-spacing);line-height:var(--plasma-switch-description-line-height);font-size:var(--plasma-switch-description-font-size);}.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_s1ilr5eq__e2c572a3{margin:var(--plasma_private-switch__label-offset,0);}
|
2
2
|
|
3
|
-
.
|
3
|
+
.base_1d0b3t4_b1wld3h3__ac2a0bcf .base_1d0b3t4_s2cs3kf__ac2a0bcf{box-sizing:border-box;-webkit-flex:0 0 var(--plasma-switch__track-width);-ms-flex:0 0 var(--plasma-switch__track-width);flex:0 0 var(--plasma-switch__track-width);border-style:solid;border-width:var(--plasma-switch__track-border);border-radius:var(--plasma-switch__track-border-radius);width:var(--plasma-switch__track-width);height:var(--plasma-switch__track-height);}.base_1d0b3t4_b1wld3h3__ac2a0bcf .base_1d0b3t4_s2cs3kf__ac2a0bcf::after{width:var(--plasma-switch__thumb-size);height:var(--plasma-switch__thumb-size);border-radius:var(--plasma-switch__thumb-border-radius);margin:auto var(--plasma-switch__thumb-offset);}.base_1d0b3t4_b1wld3h3__ac2a0bcf:active:not([disabled]) .base_1d0b3t4_s2cs3kf__ac2a0bcf::after{width:calc(var(--plasma-switch__thumb-size) * var(--plasma-switch__thumb-scale,1));}
|
4
4
|
|
5
|
-
.
|
5
|
+
.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s2cs3kf__64acd499{background-color:var(--plasma-switch__track_checked_false-bg-color);border-color:var(--plasma-switch__track-checked_false-border-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:not([disabled]) ~ .base_15atbyp_s2cs3kf__64acd499:hover{background-color:var(--plasma-switch__track_checked_false_hovered_true-bg-color,var(--plasma-switch__track_checked_false-bg-color));border-color:var(--plasma-switch__track-checked_false_hovered_true-border-color,var(--plasma-switch__track-checked_false-border-color));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked ~ .base_15atbyp_s2cs3kf__64acd499{background-color:var(--plasma-switch__track_checked_true-bg-color);border-color:var(--plasma-switch__track-checked_true-border-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked:not([disabled]) ~ .base_15atbyp_s2cs3kf__64acd499:hover{background-color:var(--plasma-switch__track_checked_true_hovered_true-bg-color,var(--plasma-switch__track_checked_true-bg-color));border-color:var(--plasma-switch__track-checked_true_hovered_true-border-color,var(--plasma-switch__track-checked_true-border-color));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s2cs3kf__64acd499::after{background-color:var(--plasma-switch__thumb-checked_false-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked ~ .base_15atbyp_s2cs3kf__64acd499::after{background-color:var(--plasma-switch__thumb_checked_true-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow_checked_true,var(--plasma-switch__thumb-box-shadow));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s1ilr5eq__64acd499{color:var(--plasma-switch__label-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_sdjnckq__64acd499{color:var(--plasma-switch__description-color);}
|
6
6
|
|
7
7
|
.base_sz3n0x_bvwxj2r__a36bed54 .base_sz3n0x_s2cs3kf__a36bed54::before{content:'';position:absolute;inset:-0.125rem;display:block;box-sizing:content-box;border-radius:calc(0.125rem + var(--plasma-switch__track-border-radius));border:0.125rem solid transparent;pointer-events:none;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;}.base_sz3n0x_bvwxj2r__a36bed54 .base_sz3n0x_ssthlx1__a36bed54.base_sz3n0x_focusVisible__a36bed54 ~ .base_sz3n0x_s2cs3kf__a36bed54::before{box-shadow:0 0 0 0.125rem var(--plasma-switch__track-focus-color);}
|
8
8
|
|
@@ -23,6 +23,11 @@ var tokens = {
|
|
23
23
|
verticalGap: '--plasma-switch-vertical-gap',
|
24
24
|
trackWidth: '--plasma-switch__track-width',
|
25
25
|
trackHeight: '--plasma-switch__track-height',
|
26
|
+
trackBorderWidth: '--plasma-switch__track-border',
|
27
|
+
trackBorderColorOn: '--plasma-switch__track-checked_true-border-color',
|
28
|
+
trackBorderColorOnHover: '--plasma-switch__track-checked_true_hovered_true-border-color',
|
29
|
+
trackBorderColorOff: '--plasma-switch__track-checked_false-border-color',
|
30
|
+
trackBorderColorOffHover: '--plasma-switch__track-checked_false_hovered_true-border-color',
|
26
31
|
trackBorderRadius: '--plasma-switch__track-border-radius',
|
27
32
|
// NOTE: could be intersection with checked
|
28
33
|
trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',
|
@@ -34,7 +39,8 @@ var tokens = {
|
|
34
39
|
thumbOffset: '--plasma-switch__thumb-offset',
|
35
40
|
thumbBorderRadius: '--plasma-switch__thumb-border-radius',
|
36
41
|
thumbPressScale: '--plasma-switch__thumb-scale',
|
37
|
-
|
42
|
+
thumbBackgroundColorOn: '--plasma-switch__thumb_checked_true-bg-color',
|
43
|
+
thumbBackgroundColorOff: '--plasma-switch__thumb-checked_false-bg-color',
|
38
44
|
thumbBoxShadow: '--plasma-switch__thumb-box-shadow',
|
39
45
|
thumbBoxShadowOn: '--plasma-switch__thumb-box-shadow_checked_true',
|
40
46
|
labelOffsetPrivate: '--plasma_private-switch__label-offset'
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Switch.tokens.js","sources":["../../../src/components/Switch/Switch.tokens.ts"],"sourcesContent":["export const tokens = {\n fontFamily: '--plasma-switch-font-family',\n fontStyle: '--plasma-switch-font-style',\n fontSize: '--plasma-switch-font-size',\n fontWeight: '--plasma-switch-font-weight',\n letterSpacing: '--plasma-switch-letter-spacing',\n lineHeight: '--plasma-switch-line-height',\n\n /* Токены description */\n descriptionFontFamily: '--plasma-switch-description-font-family',\n descriptionFontStyle: '--plasma-switch-description-font-style',\n descriptionFontSize: '--plasma-switch-description-font-size',\n descriptionFontWeight: '--plasma-switch-description-font-weight',\n descriptionLetterSpacing: '--plasma-switch-description-letter-spacing',\n descriptionLineHeight: '--plasma-switch-description-line-height',\n\n /* Цвет подписи */\n labelColor: '--plasma-switch__label-color',\n labelOffset: '--plasma-switch__label-offset',\n\n /* Цвет описания */\n descriptionColor: '--plasma-switch__description-color',\n descriptionOffset: '--plasma-switch__description-offset',\n\n /** Прозрачность для всего компонента в состоянии disabled */\n disabledOpacity: '--plasma-switch-disabled-opacity',\n\n verticalGap: '--plasma-switch-vertical-gap',\n trackWidth: '--plasma-switch__track-width',\n trackHeight: '--plasma-switch__track-height',\n trackBorderRadius: '--plasma-switch__track-border-radius',\n // NOTE: could be intersection with checked\n trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',\n trackBackgroundColorOnHover: '--plasma-switch__track_checked_true_hovered_true-bg-color',\n trackBackgroundColorOff: '--plasma-switch__track_checked_false-bg-color',\n trackBackgroundColorOffHover: '--plasma-switch__track_checked_false_hovered_true-bg-color',\n\n trackFocusColor: '--plasma-switch__track-focus-color',\n\n thumbSize: '--plasma-switch__thumb-size',\n thumbOffset: '--plasma-switch__thumb-offset',\n thumbBorderRadius: '--plasma-switch__thumb-border-radius',\n\n thumbPressScale: '--plasma-switch__thumb-scale',\n\n
|
1
|
+
{"version":3,"file":"Switch.tokens.js","sources":["../../../src/components/Switch/Switch.tokens.ts"],"sourcesContent":["export const tokens = {\n fontFamily: '--plasma-switch-font-family',\n fontStyle: '--plasma-switch-font-style',\n fontSize: '--plasma-switch-font-size',\n fontWeight: '--plasma-switch-font-weight',\n letterSpacing: '--plasma-switch-letter-spacing',\n lineHeight: '--plasma-switch-line-height',\n\n /* Токены description */\n descriptionFontFamily: '--plasma-switch-description-font-family',\n descriptionFontStyle: '--plasma-switch-description-font-style',\n descriptionFontSize: '--plasma-switch-description-font-size',\n descriptionFontWeight: '--plasma-switch-description-font-weight',\n descriptionLetterSpacing: '--plasma-switch-description-letter-spacing',\n descriptionLineHeight: '--plasma-switch-description-line-height',\n\n /* Цвет подписи */\n labelColor: '--plasma-switch__label-color',\n labelOffset: '--plasma-switch__label-offset',\n\n /* Цвет описания */\n descriptionColor: '--plasma-switch__description-color',\n descriptionOffset: '--plasma-switch__description-offset',\n\n /** Прозрачность для всего компонента в состоянии disabled */\n disabledOpacity: '--plasma-switch-disabled-opacity',\n\n verticalGap: '--plasma-switch-vertical-gap',\n trackWidth: '--plasma-switch__track-width',\n trackHeight: '--plasma-switch__track-height',\n trackBorderWidth: '--plasma-switch__track-border',\n trackBorderColorOn: '--plasma-switch__track-checked_true-border-color',\n trackBorderColorOnHover: '--plasma-switch__track-checked_true_hovered_true-border-color',\n trackBorderColorOff: '--plasma-switch__track-checked_false-border-color',\n trackBorderColorOffHover: '--plasma-switch__track-checked_false_hovered_true-border-color',\n\n trackBorderRadius: '--plasma-switch__track-border-radius',\n // NOTE: could be intersection with checked\n trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',\n trackBackgroundColorOnHover: '--plasma-switch__track_checked_true_hovered_true-bg-color',\n trackBackgroundColorOff: '--plasma-switch__track_checked_false-bg-color',\n trackBackgroundColorOffHover: '--plasma-switch__track_checked_false_hovered_true-bg-color',\n\n trackFocusColor: '--plasma-switch__track-focus-color',\n\n thumbSize: '--plasma-switch__thumb-size',\n thumbOffset: '--plasma-switch__thumb-offset',\n thumbBorderRadius: '--plasma-switch__thumb-border-radius',\n\n thumbPressScale: '--plasma-switch__thumb-scale',\n\n thumbBackgroundColorOn: '--plasma-switch__thumb_checked_true-bg-color',\n thumbBackgroundColorOff: '--plasma-switch__thumb-checked_false-bg-color',\n thumbBoxShadow: '--plasma-switch__thumb-box-shadow',\n thumbBoxShadowOn: '--plasma-switch__thumb-box-shadow_checked_true',\n\n labelOffsetPrivate: '--plasma_private-switch__label-offset',\n};\n\nexport const classes = {\n beforeSwitchLabelPosition: 'switch-label-position-before',\n afterSwitchLabelPosition: 'switch-label-position-after',\n};\n"],"names":["tokens","fontFamily","fontStyle","fontSize","fontWeight","letterSpacing","lineHeight","descriptionFontFamily","descriptionFontStyle","descriptionFontSize","descriptionFontWeight","descriptionLetterSpacing","descriptionLineHeight","labelColor","labelOffset","descriptionColor","descriptionOffset","disabledOpacity","verticalGap","trackWidth","trackHeight","trackBorderWidth","trackBorderColorOn","trackBorderColorOnHover","trackBorderColorOff","trackBorderColorOffHover","trackBorderRadius","trackBackgroundColorOn","trackBackgroundColorOnHover","trackBackgroundColorOff","trackBackgroundColorOffHover","trackFocusColor","thumbSize","thumbOffset","thumbBorderRadius","thumbPressScale","thumbBackgroundColorOn","thumbBackgroundColorOff","thumbBoxShadow","thumbBoxShadowOn","labelOffsetPrivate","classes","beforeSwitchLabelPosition","afterSwitchLabelPosition"],"mappings":"AAAO,IAAMA,MAAM,GAAG;AAClBC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,SAAS,EAAE,4BAA4B;AACvCC,EAAAA,QAAQ,EAAE,2BAA2B;AACrCC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,aAAa,EAAE,gCAAgC;AAC/CC,EAAAA,UAAU,EAAE,6BAA6B;AAEzC;AACAC,EAAAA,qBAAqB,EAAE,yCAAyC;AAChEC,EAAAA,oBAAoB,EAAE,wCAAwC;AAC9DC,EAAAA,mBAAmB,EAAE,uCAAuC;AAC5DC,EAAAA,qBAAqB,EAAE,yCAAyC;AAChEC,EAAAA,wBAAwB,EAAE,4CAA4C;AACtEC,EAAAA,qBAAqB,EAAE,yCAAyC;AAEhE;AACAC,EAAAA,UAAU,EAAE,8BAA8B;AAC1CC,EAAAA,WAAW,EAAE,+BAA+B;AAE5C;AACAC,EAAAA,gBAAgB,EAAE,oCAAoC;AACtDC,EAAAA,iBAAiB,EAAE,qCAAqC;AAExD;AACAC,EAAAA,eAAe,EAAE,kCAAkC;AAEnDC,EAAAA,WAAW,EAAE,8BAA8B;AAC3CC,EAAAA,UAAU,EAAE,8BAA8B;AAC1CC,EAAAA,WAAW,EAAE,+BAA+B;AAC5CC,EAAAA,gBAAgB,EAAE,+BAA+B;AACjDC,EAAAA,kBAAkB,EAAE,kDAAkD;AACtEC,EAAAA,uBAAuB,EAAE,+DAA+D;AACxFC,EAAAA,mBAAmB,EAAE,mDAAmD;AACxEC,EAAAA,wBAAwB,EAAE,gEAAgE;AAE1FC,EAAAA,iBAAiB,EAAE,sCAAsC;AACzD;AACAC,EAAAA,sBAAsB,EAAE,8CAA8C;AACtEC,EAAAA,2BAA2B,EAAE,2DAA2D;AACxFC,EAAAA,uBAAuB,EAAE,+CAA+C;AACxEC,EAAAA,4BAA4B,EAAE,4DAA4D;AAE1FC,EAAAA,eAAe,EAAE,oCAAoC;AAErDC,EAAAA,SAAS,EAAE,6BAA6B;AACxCC,EAAAA,WAAW,EAAE,+BAA+B;AAC5CC,EAAAA,iBAAiB,EAAE,sCAAsC;AAEzDC,EAAAA,eAAe,EAAE,8BAA8B;AAE/CC,EAAAA,sBAAsB,EAAE,8CAA8C;AACtEC,EAAAA,uBAAuB,EAAE,+CAA+C;AACxEC,EAAAA,cAAc,EAAE,mCAAmC;AACnDC,EAAAA,gBAAgB,EAAE,gDAAgD;AAElEC,EAAAA,kBAAkB,EAAE,uCAAA;AACxB,EAAC;AAEM,IAAMC,OAAO,GAAG;AACnBC,EAAAA,yBAAyB,EAAE,8BAA8B;AACzDC,EAAAA,wBAAwB,EAAE,6BAAA;AAC9B;;;;"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"base.js","sources":["../../../../src/components/Switch/_toggleSize/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../Switch.tokens';\nimport { StyledTrigger } from '../Switch.styles';\n\nexport const base = css`\n ${StyledTrigger} {\n flex: 0 0 var(${tokens.trackWidth});\n width: var(${tokens.
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../src/components/Switch/_toggleSize/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../Switch.tokens';\nimport { StyledTrigger } from '../Switch.styles';\n\nexport const base = css`\n ${StyledTrigger} {\n box-sizing: border-box;\n flex: 0 0 var(${tokens.trackWidth});\n\n border-style: solid;\n border-width: var(${tokens.trackBorderWidth});\n border-radius: var(${tokens.trackBorderRadius});\n\n width: var(${tokens.trackWidth});\n height: var(${tokens.trackHeight});\n\n &::after {\n width: var(${tokens.thumbSize});\n height: var(${tokens.thumbSize});\n border-radius: var(${tokens.thumbBorderRadius});\n margin: auto var(${tokens.thumbOffset});\n }\n }\n\n :active:not([disabled]) ${StyledTrigger}::after {\n width: calc(var(${tokens.thumbSize}) * var(${tokens.thumbPressScale}, 1));\n }\n`;\n"],"names":["base"],"mappings":"AAKO,IAAMA,IAAI,GAuBhB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.b1wld3h3 .s2cs3kf{box-sizing:border-box;-webkit-flex:0 0 var(--plasma-switch__track-width);-ms-flex:0 0 var(--plasma-switch__track-width);flex:0 0 var(--plasma-switch__track-width);border-style:solid;border-width:var(--plasma-switch__track-border);border-radius:var(--plasma-switch__track-border-radius);width:var(--plasma-switch__track-width);height:var(--plasma-switch__track-height);}.b1wld3h3 .s2cs3kf::after{width:var(--plasma-switch__thumb-size);height:var(--plasma-switch__thumb-size);border-radius:var(--plasma-switch__thumb-border-radius);margin:auto var(--plasma-switch__thumb-offset);}.b1wld3h3:active:not([disabled]) .s2cs3kf::after{width:calc(var(--plasma-switch__thumb-size) * var(--plasma-switch__thumb-scale,1));}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"base.js","sources":["../../../../src/components/Switch/_view/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../Switch.tokens';\nimport { StyledTrigger, StyledInput, StyledLabel, StyledDescription } from '../Switch.styles';\n\nexport const base = css`\n ${StyledTrigger} {\n background-color: var(${tokens.trackBackgroundColorOff});\n }\n\n ${StyledInput}:not([disabled]) ~ ${StyledTrigger}:hover {\n background-color: var(${tokens.trackBackgroundColorOffHover}, var(${tokens.trackBackgroundColorOff}));\n }\n\n ${StyledInput}:checked ~ ${StyledTrigger} {\n background-color: var(${tokens.trackBackgroundColorOn});\n }\n\n ${StyledInput}:checked:not([disabled]) ~ ${StyledTrigger}:hover {\n background-color: var(${tokens.trackBackgroundColorOnHover}, var(${tokens.trackBackgroundColorOn}));\n }\n\n ${StyledTrigger}::after {\n background-color: var(${tokens.
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../src/components/Switch/_view/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../Switch.tokens';\nimport { StyledTrigger, StyledInput, StyledLabel, StyledDescription } from '../Switch.styles';\n\nexport const base = css`\n ${StyledTrigger} {\n background-color: var(${tokens.trackBackgroundColorOff});\n border-color: var(${tokens.trackBorderColorOff});\n }\n\n ${StyledInput}:not([disabled]) ~ ${StyledTrigger}:hover {\n background-color: var(${tokens.trackBackgroundColorOffHover}, var(${tokens.trackBackgroundColorOff}));\n border-color: var(${tokens.trackBorderColorOffHover}, var(${tokens.trackBorderColorOff}));\n }\n\n ${StyledInput}:checked ~ ${StyledTrigger} {\n background-color: var(${tokens.trackBackgroundColorOn});\n border-color: var(${tokens.trackBorderColorOn});\n }\n\n ${StyledInput}:checked:not([disabled]) ~ ${StyledTrigger}:hover {\n background-color: var(${tokens.trackBackgroundColorOnHover}, var(${tokens.trackBackgroundColorOn}));\n border-color: var(${tokens.trackBorderColorOnHover}, var(${tokens.trackBorderColorOn}));\n }\n\n ${StyledTrigger}::after {\n background-color: var(${tokens.thumbBackgroundColorOff});\n box-shadow: var(${tokens.thumbBoxShadow});\n }\n\n ${StyledInput}:checked ~ ${StyledTrigger}::after {\n background-color: var(${tokens.thumbBackgroundColorOn});\n box-shadow: var(${tokens.thumbBoxShadowOn}, var(${tokens.thumbBoxShadow}));\n }\n\n ${StyledLabel} {\n color: var(${tokens.labelColor});\n }\n\n ${StyledDescription} {\n color: var(${tokens.descriptionColor});\n }\n`;\n"],"names":["base"],"mappings":"AAKO,IAAMA,IAAI,GAsChB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.b1g0jmh3 .s2cs3kf{background-color:var(--plasma-switch__track_checked_false-bg-color);border-color:var(--plasma-switch__track-checked_false-border-color);}.b1g0jmh3 .ssthlx1:not([disabled]) ~ .s2cs3kf:hover{background-color:var(--plasma-switch__track_checked_false_hovered_true-bg-color,var(--plasma-switch__track_checked_false-bg-color));border-color:var(--plasma-switch__track-checked_false_hovered_true-border-color,var(--plasma-switch__track-checked_false-border-color));}.b1g0jmh3 .ssthlx1:checked ~ .s2cs3kf{background-color:var(--plasma-switch__track_checked_true-bg-color);border-color:var(--plasma-switch__track-checked_true-border-color);}.b1g0jmh3 .ssthlx1:checked:not([disabled]) ~ .s2cs3kf:hover{background-color:var(--plasma-switch__track_checked_true_hovered_true-bg-color,var(--plasma-switch__track_checked_true-bg-color));border-color:var(--plasma-switch__track-checked_true_hovered_true-border-color,var(--plasma-switch__track-checked_true-border-color));}.b1g0jmh3 .s2cs3kf::after{background-color:var(--plasma-switch__thumb-checked_false-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow);}.b1g0jmh3 .ssthlx1:checked ~ .s2cs3kf::after{background-color:var(--plasma-switch__thumb_checked_true-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow_checked_true,var(--plasma-switch__thumb-box-shadow));}.b1g0jmh3 .s1ilr5eq{color:var(--plasma-switch__label-color);}.b1g0jmh3 .sdjnckq{color:var(--plasma-switch__description-color);}
|
package/es/index.css
CHANGED
@@ -215,9 +215,9 @@
|
|
215
215
|
|
216
216
|
.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_s10fscgc__e2c572a3{font-family:var(--plasma-switch-font-family);font-style:var(--plasma-switch-font-style);font-weight:var(--plasma-switch-font-weight);-webkit-letter-spacing:var(--plasma-switch-letter-spacing);-moz-letter-spacing:var(--plasma-switch-letter-spacing);-ms-letter-spacing:var(--plasma-switch-letter-spacing);letter-spacing:var(--plasma-switch-letter-spacing);line-height:var(--plasma-switch-line-height);font-size:var(--plasma-switch-font-size);}.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_sdjnckq__e2c572a3{font-family:var(--plasma-switch-description-font-family);font-style:var(--plasma-switch-description-font-style);font-weight:var(--plasma-switch-description-font-weight);-webkit-letter-spacing:var(--plasma-switch-description-letter-spacing);-moz-letter-spacing:var(--plasma-switch-description-letter-spacing);-ms-letter-spacing:var(--plasma-switch-description-letter-spacing);letter-spacing:var(--plasma-switch-description-letter-spacing);line-height:var(--plasma-switch-description-line-height);font-size:var(--plasma-switch-description-font-size);}.base_1tcl212_bm1v11h__e2c572a3 .base_1tcl212_s1ilr5eq__e2c572a3{margin:var(--plasma_private-switch__label-offset,0);}
|
217
217
|
|
218
|
-
.
|
218
|
+
.base_1d0b3t4_b1wld3h3__ac2a0bcf .base_1d0b3t4_s2cs3kf__ac2a0bcf{box-sizing:border-box;-webkit-flex:0 0 var(--plasma-switch__track-width);-ms-flex:0 0 var(--plasma-switch__track-width);flex:0 0 var(--plasma-switch__track-width);border-style:solid;border-width:var(--plasma-switch__track-border);border-radius:var(--plasma-switch__track-border-radius);width:var(--plasma-switch__track-width);height:var(--plasma-switch__track-height);}.base_1d0b3t4_b1wld3h3__ac2a0bcf .base_1d0b3t4_s2cs3kf__ac2a0bcf::after{width:var(--plasma-switch__thumb-size);height:var(--plasma-switch__thumb-size);border-radius:var(--plasma-switch__thumb-border-radius);margin:auto var(--plasma-switch__thumb-offset);}.base_1d0b3t4_b1wld3h3__ac2a0bcf:active:not([disabled]) .base_1d0b3t4_s2cs3kf__ac2a0bcf::after{width:calc(var(--plasma-switch__thumb-size) * var(--plasma-switch__thumb-scale,1));}
|
219
219
|
|
220
|
-
.
|
220
|
+
.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s2cs3kf__64acd499{background-color:var(--plasma-switch__track_checked_false-bg-color);border-color:var(--plasma-switch__track-checked_false-border-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:not([disabled]) ~ .base_15atbyp_s2cs3kf__64acd499:hover{background-color:var(--plasma-switch__track_checked_false_hovered_true-bg-color,var(--plasma-switch__track_checked_false-bg-color));border-color:var(--plasma-switch__track-checked_false_hovered_true-border-color,var(--plasma-switch__track-checked_false-border-color));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked ~ .base_15atbyp_s2cs3kf__64acd499{background-color:var(--plasma-switch__track_checked_true-bg-color);border-color:var(--plasma-switch__track-checked_true-border-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked:not([disabled]) ~ .base_15atbyp_s2cs3kf__64acd499:hover{background-color:var(--plasma-switch__track_checked_true_hovered_true-bg-color,var(--plasma-switch__track_checked_true-bg-color));border-color:var(--plasma-switch__track-checked_true_hovered_true-border-color,var(--plasma-switch__track-checked_true-border-color));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s2cs3kf__64acd499::after{background-color:var(--plasma-switch__thumb-checked_false-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_ssthlx1__64acd499:checked ~ .base_15atbyp_s2cs3kf__64acd499::after{background-color:var(--plasma-switch__thumb_checked_true-bg-color);box-shadow:var(--plasma-switch__thumb-box-shadow_checked_true,var(--plasma-switch__thumb-box-shadow));}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_s1ilr5eq__64acd499{color:var(--plasma-switch__label-color);}.base_15atbyp_b1g0jmh3__64acd499 .base_15atbyp_sdjnckq__64acd499{color:var(--plasma-switch__description-color);}
|
221
221
|
|
222
222
|
.base_sz3n0x_bvwxj2r__a36bed54 .base_sz3n0x_s2cs3kf__a36bed54::before{content:'';position:absolute;inset:-0.125rem;display:block;box-sizing:content-box;border-radius:calc(0.125rem + var(--plasma-switch__track-border-radius));border:0.125rem solid transparent;pointer-events:none;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;}.base_sz3n0x_bvwxj2r__a36bed54 .base_sz3n0x_ssthlx1__a36bed54.base_sz3n0x_focusVisible__a36bed54 ~ .base_sz3n0x_s2cs3kf__a36bed54::before{box-shadow:0 0 0 0.125rem var(--plasma-switch__track-focus-color);}
|
223
223
|
|
@@ -392,12 +392,11 @@
|
|
392
392
|
|
393
393
|
.DropdownHeader_styles_196gwgm_s133b1g2__3510806e{background:var(--plasma-dropdown-header-background);font-family:var(--plasma-dropdown-header-font-family);font-size:var(--plasma-dropdown-header-font-size);font-style:var(--plasma-dropdown-header-font-style);font-weight:var(--plasma-dropdown-header-letter-spacing);-webkit-letter-spacing:var(--plasma-dropdown-header-line-height);-moz-letter-spacing:var(--plasma-dropdown-header-line-height);-ms-letter-spacing:var(--plasma-dropdown-header-line-height);letter-spacing:var(--plasma-dropdown-header-line-height);line-height:var(--plasma-dropdown-header-font-weight);width:var(--plasma-dropdown-header-width);height:var(--plasma-dropdown-header-height);padding:var(--plasma-dropdown-header-padding-top) var(--plasma-dropdown-header-padding-right) var(--plasma-dropdown-header-padding-bottom) var(--plasma-dropdown-header-padding-left);margin:var(--plasma-dropdown-header-margin-top) var(--plasma-dropdown-header-margin-right) var(--plasma-dropdown-header-margin-bottom) var(--plasma-dropdown-header-margin-left);}
|
394
394
|
|
395
|
-
.
|
395
|
+
.DropdownItem_styles_1b439rx_c1gkzlls__ed711128{--plasma-cell-title-color:var(--text-primary);--plasma-cell-background-color:var(--plasma-colors-transparent);--plasma-cell-padding:var(--plasma-dropdown-cell-padding);--plasma-cell-padding-left-content:var(--plasma-dropdown-cell-padding-left-content);--plasma-cell-padding-content:var(--plasma-dropdown-cell-padding-content);--plasma-cell-padding-right-content:var(--plasma-dropdown-cell-padding-right-content);--plasma-cell-textbox-gap:var(--plasma-dropdown-cell-textbox-gap);--plasma-cell-gap:var(--plasma-dropdown-cell-gap);--plasma-cell-title-font-family:var(--plasma-dropdown-cell-title-font-family);--plasma-cell-title-font-size:var(--plasma-dropdown-cell-title-font-size);--plasma-cell-title-font-style:var(--plasma-dropdown-cell-title-font-style);--plasma-cell-title-font-weight:var(--plasma-dropdown-cell-title-font-weight);--plasma-cell-title-letter-spacing:var(--plasma-dropdown-cell-title-letter-spacing);--plasma-cell-title-line-height:var(--plasma-dropdown-cell-title-line-height);width:100%;}
|
396
396
|
|
397
|
-
.
|
398
|
-
.
|
399
|
-
.
|
400
|
-
.DropdownItem_styles_14yih1y_r1jav4ek__bf539568{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-flex:1;-ms-flex:1;flex:1;}
|
397
|
+
.DropdownItem_styles_1b439rx_d1m97l2m__ed711128{line-height:0;color:var(--text-secondary);}
|
398
|
+
.DropdownItem_styles_1b439rx_doib72h__ed711128{height:1px;margin-top:var(--doib72h-0);margin-right:var(--plasma-dropdown-divider-margin-right);margin-bottom:var(--doib72h-1);margin-left:var(--plasma-dropdown-divider-margin-left);background:var(--plasma-dropdown-divider-color);}
|
399
|
+
.DropdownItem_styles_1b439rx_w6l2f0g__ed711128{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;min-height:var(--plasma-dropdown-item-height);margin:0;box-sizing:content-box;padding:var(--w6l2f0g-0);font-family:var(--plasma-dropdown-item-font-family);font-size:var(--plasma-dropdown-item-font-size);font-style:var(--plasma-dropdown-item-font-style);font-weight:var(--plasma-dropdown-item-letter-spacing);-webkit-letter-spacing:var(--plasma-dropdown-item-line-height);-moz-letter-spacing:var(--plasma-dropdown-item-line-height);-ms-letter-spacing:var(--plasma-dropdown-item-line-height);letter-spacing:var(--plasma-dropdown-item-line-height);line-height:var(--plasma-dropdown-item-font-weight);background-color:var(--plasma-colors-transparent);border-radius:var(--plasma-dropdown-border-radius);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-right:0.125rem solid transparent;border-left:0.125rem solid transparent;background-clip:padding-box;position:relative;}.DropdownItem_styles_1b439rx_w6l2f0g__ed711128:hover:not(.DropdownItem_styles_1b439rx_dropdownItemIsDisabled__ed711128){cursor:pointer;background-color:var(--plasma-dropdown-item-background-hover);}.DropdownItem_styles_1b439rx_w6l2f0g__ed711128.DropdownItem_styles_1b439rx_dropdownItemIsActive__ed711128{background-color:var(--plasma-dropdown-item-background-hover);}.DropdownItem_styles_1b439rx_w6l2f0g__ed711128.DropdownItem_styles_1b439rx_dropdownItemIsDisabled__ed711128{opacity:0.4;cursor:not-allowed;}.DropdownItem_styles_1b439rx_w6l2f0g__ed711128:focus{outline:none;}.DropdownItem_styles_1b439rx_w6l2f0g__ed711128::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:var(--plasma-dropdown-item-border-radius);-webkit-transition:none;transition:none;pointer-events:none;}.DropdownItem_styles_1b439rx_w6l2f0g__ed711128.DropdownItem_styles_1b439rx_dropdownItemIsFocused__ed711128:before{outline:none;box-shadow:0 0 0 0.0625rem var(--surface-accent);}
|
401
400
|
|
402
401
|
.DropdownItem_styles_1lyg81y_s1iqs5in__b17ea060{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;min-width:var(--plasma-dropdown-item-content-left-width);color:var(--plasma-dropdown-item-content-left-color);}
|
403
402
|
.DropdownItem_styles_1lyg81y_sfg3dyd__b17ea060{margin-left:auto;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;min-width:var(--plasma-dropdown-item-content-right-width);color:var(--plasma-dropdown-item-content-right-color);}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@salutejs/plasma-new-hope",
|
3
|
-
"version": "0.194.0-canary.
|
3
|
+
"version": "0.194.0-canary.1568.11891833298.0",
|
4
4
|
"description": "Salute Design System blueprint",
|
5
5
|
"main": "cjs/index.js",
|
6
6
|
"module": "es/index.js",
|
@@ -98,7 +98,6 @@
|
|
98
98
|
"babel-loader": "8.2.2",
|
99
99
|
"babel-plugin-annotate-pure-calls": "0.4.0",
|
100
100
|
"babel-plugin-styled-components": "1.13.2",
|
101
|
-
"csstype": "3.1.3",
|
102
101
|
"default-browser-id": "2.0.0",
|
103
102
|
"react": "18.2.0",
|
104
103
|
"react-dom": "18.2.0",
|
@@ -129,5 +128,5 @@
|
|
129
128
|
"sideEffects": [
|
130
129
|
"*.css"
|
131
130
|
],
|
132
|
-
"gitHead": "
|
131
|
+
"gitHead": "cefe6714d8c07097e31273c50d13370ae9b222b9"
|
133
132
|
}
|
@@ -0,0 +1,184 @@
|
|
1
|
+
---
|
2
|
+
id: card
|
3
|
+
title: Card
|
4
|
+
---
|
5
|
+
|
6
|
+
отличия от https://plasma.sberdevices.ru/b2c/components/card/:
|
7
|
+
* избавляемся от CardBody
|
8
|
+
* убираем дублирование disabled
|
9
|
+
|
10
|
+
примеры дизайна https://www.figma.com/design/MXl0ZkXEqEhIFDS2H6b3yk/StarDS-Cards?node-id=2-690&node-type=instance&t=TJN8Nqyiky3Dfw2T-0
|
11
|
+
|
12
|
+
другие либы:
|
13
|
+
https://ant.design/components/card#
|
14
|
+
https://mui.com/material-ui/react-card/
|
15
|
+
|
16
|
+
```tsx live
|
17
|
+
import React, { ReactNode } from "react";
|
18
|
+
|
19
|
+
/**
|
20
|
+
* Набор часто встречающихся скруглений.
|
21
|
+
*/
|
22
|
+
|
23
|
+
export const radiuses = {
|
24
|
+
250: 15.625,
|
25
|
+
32: 2,
|
26
|
+
28: 1.75,
|
27
|
+
24: 1.5,
|
28
|
+
20: 1.25,
|
29
|
+
18: 1.125,
|
30
|
+
16: 1,
|
31
|
+
14: 0.875,
|
32
|
+
12: 0.75,
|
33
|
+
8: 0.5,
|
34
|
+
0: 0,
|
35
|
+
};
|
36
|
+
|
37
|
+
export type Roundness = keyof typeof radiuses;
|
38
|
+
|
39
|
+
export interface RoundnessProps {
|
40
|
+
/** Скругленность */
|
41
|
+
roundness: Roundness;
|
42
|
+
}
|
43
|
+
|
44
|
+
interface Card {
|
45
|
+
/** Компонент в фокусе */
|
46
|
+
focused?: boolean;
|
47
|
+
/** Увеличение по фокусу */
|
48
|
+
scaleOnFocus?: boolean;
|
49
|
+
/** Компонент неактивен */
|
50
|
+
disabled?: boolean;
|
51
|
+
/** Добавить рамку при фокусе */
|
52
|
+
outlined?: boolean;
|
53
|
+
/** Цвет подложки */
|
54
|
+
background?: string;
|
55
|
+
/** Делает карточку квадратной */
|
56
|
+
square?: boolean;
|
57
|
+
/** Заголовок */
|
58
|
+
title?: string | ReactNode;
|
59
|
+
/** Подзаголовок */
|
60
|
+
subtitle?: string | ReactNode;
|
61
|
+
/** Расположение заголовка и подзаголовка, пока нет в дизайне */
|
62
|
+
titlePlacement?: "inner" | "outer";
|
63
|
+
/** Выравнивание заголовка и подзаголовка */
|
64
|
+
titleAlign?: "left" | "center";
|
65
|
+
/** Подвал, или вынести в
|
66
|
+
* <CardContent footer={<CardTimeline />} /> или <CardFooter><CardTimeline /></CardFooter>
|
67
|
+
* */
|
68
|
+
footer?: ReactNode;
|
69
|
+
}
|
70
|
+
|
71
|
+
const ratios = {
|
72
|
+
"1 / 1": "100",
|
73
|
+
"1/1": "100",
|
74
|
+
"3 / 4": "133.3333",
|
75
|
+
"3/4": "133.3333",
|
76
|
+
"4 / 3": "75",
|
77
|
+
"4/3": "75",
|
78
|
+
"9 / 16": "177.7778",
|
79
|
+
"9/16": "177.7778",
|
80
|
+
"16 / 9": "56.25",
|
81
|
+
"16/9": "56.25",
|
82
|
+
"1 / 2": "200",
|
83
|
+
"1/2": "200",
|
84
|
+
"2 / 1": "50",
|
85
|
+
"2/1": "50",
|
86
|
+
};
|
87
|
+
|
88
|
+
export type Ratio = keyof typeof ratios;
|
89
|
+
|
90
|
+
/**
|
91
|
+
* CardMedia из текущей реализации
|
92
|
+
* Стоит ли заменить пропсом `cover?: ReactNode;` в Card как в Ant?
|
93
|
+
* а width и height передавать в style...
|
94
|
+
*
|
95
|
+
* имхо, нет. у Card может быть title и subtitle под карточкой
|
96
|
+
* скорее всего, на них свойство height не должно распространяться
|
97
|
+
* стоит подождать финальный дизайн
|
98
|
+
*/
|
99
|
+
interface CardMedia {
|
100
|
+
base?: "img" | "div";
|
101
|
+
height?: string | number;
|
102
|
+
ratio?: Ratio;
|
103
|
+
customRatio?: string;
|
104
|
+
}
|
105
|
+
|
106
|
+
interface CardContent {
|
107
|
+
topLeft?: string | ReactNode;
|
108
|
+
topRight?: string | ReactNode;
|
109
|
+
bottomLeft?: string | ReactNode;
|
110
|
+
bottomRight?: string | ReactNode;
|
111
|
+
children?: ReactNode;
|
112
|
+
}
|
113
|
+
|
114
|
+
/** или */
|
115
|
+
interface CardContent {
|
116
|
+
placement?: "top-left" | "top-right" | "bottom-left" | "bottom-right";
|
117
|
+
children?: ReactNode;
|
118
|
+
}
|
119
|
+
|
120
|
+
interface CardTimeline {
|
121
|
+
/**
|
122
|
+
* Описание, например время до конца фильма. Возможно,
|
123
|
+
* не нужно и стоит указывать bottomRight контент
|
124
|
+
*/
|
125
|
+
text?: string;
|
126
|
+
progress?: string | number;
|
127
|
+
/**
|
128
|
+
* Не увеличивать высоту карточки
|
129
|
+
* @default true
|
130
|
+
*/
|
131
|
+
inline?: boolean;
|
132
|
+
}
|
133
|
+
```
|
134
|
+
|
135
|
+
```tsx live
|
136
|
+
<Card title="Title" subtitle="Subtitle">
|
137
|
+
<CardContent placement="top-left">
|
138
|
+
<SomeIcon />
|
139
|
+
</CardContent>
|
140
|
+
<CardContent placement="top-right">
|
141
|
+
<SaveButton saved={isSaved} />
|
142
|
+
</CardContent>
|
143
|
+
<CardContent placement="bottom-right">18+</CardContent>
|
144
|
+
</Card>;
|
145
|
+
|
146
|
+
<Card title="Title" subtitle="Subtitle">
|
147
|
+
<CardContent
|
148
|
+
topLeft={<SomeIcon />}
|
149
|
+
topRight={<SaveButton saved={isSaved} />}
|
150
|
+
bottomRight="18+"
|
151
|
+
/>
|
152
|
+
</Card>;
|
153
|
+
|
154
|
+
<Card title="Title" subtitle="Subtitle">
|
155
|
+
<CardMedia src={someSrc} alt="trailer" />
|
156
|
+
<CardContent
|
157
|
+
topLeft={<SomeIcon />}
|
158
|
+
topRight={<SaveButton saved={isSaved} />}
|
159
|
+
bottomRight="18+"
|
160
|
+
/>
|
161
|
+
<CardTimeline text="еще 1ч 23мин" progress={56} />
|
162
|
+
</Card>;
|
163
|
+
|
164
|
+
<Card title="Title" subtitle="Subtitle">
|
165
|
+
<CardContent topLeft={<SomeIcon />} topRight={<SaveButton saved={isSaved} />}>
|
166
|
+
<CardMedia src={someSrc} alt="trailer" />
|
167
|
+
</CardContent>
|
168
|
+
<CardTimeline text="еще 1ч 23мин" progress={56} />
|
169
|
+
</Card>;
|
170
|
+
|
171
|
+
<Card
|
172
|
+
title="Title"
|
173
|
+
subtitle="Subtitle"
|
174
|
+
// как в ant, но кажется, что так менее гибко
|
175
|
+
cover={<CardMedia src={someSrc} alt="trailer" />}
|
176
|
+
square
|
177
|
+
>
|
178
|
+
<CardContent
|
179
|
+
topLeft={<SomeIcon />}
|
180
|
+
topRight={<SaveButton saved={isSaved} />}
|
181
|
+
/>
|
182
|
+
<CardTimeline text="еще 1ч 23мин" progress={56} />
|
183
|
+
</Card>;
|
184
|
+
```
|
@@ -357,6 +357,7 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
357
357
|
handleItemClick: handleItemClick,
|
358
358
|
variant: variant,
|
359
359
|
renderItem: renderItem,
|
360
|
+
valueToItemMap: valueToItemMap,
|
360
361
|
treeId: treeId
|
361
362
|
}
|
362
363
|
}, /*#__PURE__*/_react["default"].createElement(_FloatingPopover.FloatingPopover, {
|
@@ -40,6 +40,7 @@ var Item = exports.Item = function Item(_ref) {
|
|
40
40
|
handleItemClick = _useContext.handleItemClick,
|
41
41
|
variant = _useContext.variant,
|
42
42
|
renderItem = _useContext.renderItem,
|
43
|
+
valueToItemMap = _useContext.valueToItemMap,
|
43
44
|
treeId = _useContext.treeId;
|
44
45
|
var disabledClassName = disabled ? _Combobox.classes.dropdownItemIsDisabled : undefined;
|
45
46
|
var focusedClass = currentLevel === focusedPath.length - 1 && index === (focusedPath === null || focusedPath === void 0 ? void 0 : focusedPath[currentLevel]) ? _Combobox.classes.dropdownItemIsFocused : undefined;
|
@@ -93,7 +94,7 @@ var Item = exports.Item = function Item(_ref) {
|
|
93
94
|
}))), !multiple && checked.get(item.value) === 'done' && /*#__PURE__*/_react["default"].createElement(_Icon.IconDone, {
|
94
95
|
size: (0, _utils.sizeToIconSize)(size, variant),
|
95
96
|
color: "inherit"
|
96
|
-
})), renderItem ? /*#__PURE__*/_react["default"].createElement(_Item.StyledText, null, renderItem(
|
97
|
+
})), renderItem ? /*#__PURE__*/_react["default"].createElement(_Item.StyledText, null, renderItem(valueToItemMap.get(value))) : /*#__PURE__*/_react["default"].createElement(_Item.StyledWrapper, null, /*#__PURE__*/_react["default"].createElement(_Item.StyledCell, {
|
97
98
|
view: "default",
|
98
99
|
size: "l",
|
99
100
|
contentLeft: contentLeft,
|
@@ -20,7 +20,7 @@ var _Dropdown2 = /*#__PURE__*/require("./Dropdown.tokens");
|
|
20
20
|
var _useKeyboardNavigation = /*#__PURE__*/require("./hooks/useKeyboardNavigation");
|
21
21
|
var _useHashMaps3 = /*#__PURE__*/require("./hooks/useHashMaps");
|
22
22
|
var _FloatingPopover = /*#__PURE__*/require("./FloatingPopover");
|
23
|
-
var _excluded = ["items", "children", "placement", "offset", "closeOnOverlayClick", "onToggle", "size", "view", "itemRole", "className", "listWidth", "listHeight", "listOverflow", "closeOnSelect", "onHover", "onItemSelect", "onItemClick", "trigger", "variant", "hasArrow", "alwaysOpened", "portal"
|
23
|
+
var _excluded = ["items", "children", "placement", "offset", "closeOnOverlayClick", "onToggle", "size", "view", "itemRole", "className", "listWidth", "listHeight", "listOverflow", "closeOnSelect", "onHover", "onItemSelect", "onItemClick", "trigger", "variant", "hasArrow", "alwaysOpened", "portal"];
|
24
24
|
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); }
|
25
25
|
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; }
|
26
26
|
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); }
|
@@ -69,7 +69,6 @@ var dropdownRoot = exports.dropdownRoot = function dropdownRoot(Root) {
|
|
69
69
|
_ref$alwaysOpened = _ref.alwaysOpened,
|
70
70
|
alwaysOpened = _ref$alwaysOpened === void 0 ? false : _ref$alwaysOpened,
|
71
71
|
portal = _ref.portal,
|
72
|
-
renderItem = _ref.renderItem,
|
73
72
|
rest = _objectWithoutProperties(_ref, _excluded);
|
74
73
|
var _useReducer = (0, _react.useReducer)(_pathReducer.pathReducer, []),
|
75
74
|
_useReducer2 = _slicedToArray(_useReducer, 2),
|
@@ -145,8 +144,7 @@ var dropdownRoot = exports.dropdownRoot = function dropdownRoot(Root) {
|
|
145
144
|
onItemClick: onItemClick,
|
146
145
|
onItemSelect: onItemSelect,
|
147
146
|
hasArrow: hasArrow,
|
148
|
-
treeId: treeId
|
149
|
-
renderItem: renderItem
|
147
|
+
treeId: treeId
|
150
148
|
}
|
151
149
|
}, /*#__PURE__*/_react["default"].createElement(_FloatingPopover.FloatingPopover, {
|
152
150
|
ref: floatingPopoverRef,
|
@@ -43,8 +43,7 @@ var DropdownItem = exports.DropdownItem = function DropdownItem(_ref) {
|
|
43
43
|
onItemSelect = _useContext.onItemSelect,
|
44
44
|
onItemClick = _useContext.onItemClick,
|
45
45
|
hasArrow = _useContext.hasArrow,
|
46
|
-
treeId = _useContext.treeId
|
47
|
-
renderItem = _useContext.renderItem;
|
46
|
+
treeId = _useContext.treeId;
|
48
47
|
var hasDescendants = Boolean(item.items);
|
49
48
|
var disclosureIconSize = size === 'xs' ? 'xs' : 's';
|
50
49
|
var isDisabledClassName = disabled || isDisabled ? _Dropdown.classes.dropdownItemIsDisabled : undefined;
|
@@ -95,7 +94,7 @@ var DropdownItem = exports.DropdownItem = function DropdownItem(_ref) {
|
|
95
94
|
"aria-expanded": ariaExpanded,
|
96
95
|
"aria-level": ariaLevel,
|
97
96
|
"aria-label": ariaLabel
|
98
|
-
},
|
97
|
+
}, /*#__PURE__*/_react["default"].createElement(_DropdownItem.CellWrapper, null, /*#__PURE__*/_react["default"].createElement(_DropdownItem.StyledCell, {
|
99
98
|
contentLeft: contentLeft,
|
100
99
|
contentRight: contentRight,
|
101
100
|
alignContentLeft: "center",
|
@@ -3,7 +3,7 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.Wrapper = exports.StyledCell = exports.
|
6
|
+
exports.Wrapper = exports.StyledCell = exports.Divider = exports.DisclosureIconWrapper = exports.CellWrapper = void 0;
|
7
7
|
var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
|
8
8
|
var _Dropdown = /*#__PURE__*/require("../../Dropdown.tokens");
|
9
9
|
var _mixins = /*#__PURE__*/require("../../../../mixins");
|
@@ -42,7 +42,4 @@ var Wrapper = exports.Wrapper = /*#__PURE__*/_styledComponents["default"].li.wit
|
|
42
42
|
outlineRadius: /*#__PURE__*/"var(".concat(_Dropdown.tokens.itemBorderRadius, ")"),
|
43
43
|
hasTransition: false,
|
44
44
|
customFocusRules: /*#__PURE__*/"\n &.".concat(_Dropdown.classes.dropdownItemIsFocused, ":before {\n outline: none;\n box-shadow: 0 0 0 0.0625rem var(").concat(_Dropdown.constants.focusColor, ");\n }\n ")
|
45
|
-
}));
|
46
|
-
var RenderItemWrapper = exports.RenderItemWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
47
|
-
componentId: "plasma-new-hope__sc-hs0ek1-5"
|
48
|
-
})(["", ";flex:1;"], /*#__PURE__*/(0, _mixins.applyEllipsis)());
|
45
|
+
}));
|
@@ -281,6 +281,7 @@ var selectRoot = exports.selectRoot = function selectRoot(Root) {
|
|
281
281
|
handleItemClick: handleItemClick,
|
282
282
|
variant: variant,
|
283
283
|
renderItem: renderItem,
|
284
|
+
valueToItemMap: valueToItemMap,
|
284
285
|
treeId: treeId
|
285
286
|
}
|
286
287
|
}, /*#__PURE__*/_react["default"].createElement(_FloatingPopover.FloatingPopover, {
|
@@ -41,6 +41,7 @@ var Item = exports.Item = function Item(_ref) {
|
|
41
41
|
handleItemClick = _useContext.handleItemClick,
|
42
42
|
variant = _useContext.variant,
|
43
43
|
renderItem = _useContext.renderItem,
|
44
|
+
valueToItemMap = _useContext.valueToItemMap,
|
44
45
|
treeId = _useContext.treeId;
|
45
46
|
var itemDisabled = Boolean(disabled || isDisabled);
|
46
47
|
var disabledClassName = itemDisabled ? _Select.classes.dropdownItemIsDisabled : undefined;
|
@@ -95,7 +96,7 @@ var Item = exports.Item = function Item(_ref) {
|
|
95
96
|
}))), !multiselect && checked.get(item.value) === 'done' && /*#__PURE__*/_react["default"].createElement(_Icon.IconDone, {
|
96
97
|
size: (0, _utils.sizeToIconSize)(size, variant),
|
97
98
|
color: "inherit"
|
98
|
-
})), renderItem ? /*#__PURE__*/_react["default"].createElement(_Item.StyledText, null, renderItem(
|
99
|
+
})), renderItem ? /*#__PURE__*/_react["default"].createElement(_Item.StyledText, null, renderItem(valueToItemMap.get(value))) : /*#__PURE__*/_react["default"].createElement(_Item.StyledWrapper, null, /*#__PURE__*/_react["default"].createElement(_Item.StyledCell, {
|
99
100
|
contentLeft: contentLeft,
|
100
101
|
contentRight: contentRight
|
101
102
|
// TODO: #1548
|
@@ -12,12 +12,6 @@ var _Textfield = /*#__PURE__*/require("./Textfield.styles");
|
|
12
12
|
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); }
|
13
13
|
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; }
|
14
14
|
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); }
|
15
|
-
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
16
|
-
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
17
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
18
|
-
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
19
|
-
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
20
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
21
15
|
var Textfield = exports.Textfield = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
22
16
|
var _valueToItemMap$get;
|
23
17
|
var inputWrapperRef = _ref.inputWrapperRef,
|
@@ -62,24 +56,9 @@ var Textfield = exports.Textfield = /*#__PURE__*/(0, _react.forwardRef)(function
|
|
62
56
|
|
63
57
|
// Обработчик чипов
|
64
58
|
var handleChipsChange = function handleChipsChange(chipLabels) {
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
// Из лейблов чипов получаем value у item и далее прокидываем его в onChange.
|
69
|
-
if (renderValue && !isTargetAmount) {
|
70
|
-
var resultValues = _toConsumableArray(value);
|
71
|
-
value.forEach(function (_, index) {
|
72
|
-
var labelAfterRenderValue = renderValue(labelToItemMap.get(valueToItemMap.get(value[index]).label));
|
73
|
-
if (!chipLabels.includes(labelAfterRenderValue)) {
|
74
|
-
resultValues.splice(index, 1);
|
75
|
-
}
|
76
|
-
});
|
77
|
-
onChange(resultValues);
|
78
|
-
} else {
|
79
|
-
onChange(chipLabels.map(function (chipLabel) {
|
80
|
-
return labelToItemMap.get(chipLabel).value;
|
81
|
-
}));
|
82
|
-
}
|
59
|
+
onChange(chipLabels.map(function (chipLabel) {
|
60
|
+
return labelToItemMap.get(chipLabel).value;
|
61
|
+
}));
|
83
62
|
};
|
84
63
|
return /*#__PURE__*/_react["default"].createElement(_Textfield.StyledTextField, _extends({
|
85
64
|
ref: ref,
|
@@ -29,6 +29,11 @@ var tokens = exports.tokens = {
|
|
29
29
|
verticalGap: '--plasma-switch-vertical-gap',
|
30
30
|
trackWidth: '--plasma-switch__track-width',
|
31
31
|
trackHeight: '--plasma-switch__track-height',
|
32
|
+
trackBorderWidth: '--plasma-switch__track-border',
|
33
|
+
trackBorderColorOn: '--plasma-switch__track-checked_true-border-color',
|
34
|
+
trackBorderColorOnHover: '--plasma-switch__track-checked_true_hovered_true-border-color',
|
35
|
+
trackBorderColorOff: '--plasma-switch__track-checked_false-border-color',
|
36
|
+
trackBorderColorOffHover: '--plasma-switch__track-checked_false_hovered_true-border-color',
|
32
37
|
trackBorderRadius: '--plasma-switch__track-border-radius',
|
33
38
|
// NOTE: could be intersection with checked
|
34
39
|
trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',
|
@@ -40,7 +45,8 @@ var tokens = exports.tokens = {
|
|
40
45
|
thumbOffset: '--plasma-switch__thumb-offset',
|
41
46
|
thumbBorderRadius: '--plasma-switch__thumb-border-radius',
|
42
47
|
thumbPressScale: '--plasma-switch__thumb-scale',
|
43
|
-
|
48
|
+
thumbBackgroundColorOn: '--plasma-switch__thumb_checked_true-bg-color',
|
49
|
+
thumbBackgroundColorOff: '--plasma-switch__thumb-checked_false-bg-color',
|
44
50
|
thumbBoxShadow: '--plasma-switch__thumb-box-shadow',
|
45
51
|
thumbBoxShadowOn: '--plasma-switch__thumb-box-shadow_checked_true',
|
46
52
|
labelOffsetPrivate: '--plasma_private-switch__label-offset'
|
@@ -7,4 +7,4 @@ exports.base = void 0;
|
|
7
7
|
var _styledComponents = /*#__PURE__*/require("styled-components");
|
8
8
|
var _Switch = /*#__PURE__*/require("../Switch.tokens");
|
9
9
|
var _Switch2 = /*#__PURE__*/require("../Switch.styles");
|
10
|
-
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{flex:0 0 var(", ");width:var(", ");
|
10
|
+
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{box-sizing:border-box;flex:0 0 var(", ");border-style:solid;border-width:var(", ");border-radius:var(", ");width:var(", ");height:var(", ");&::after{width:var(", ");height:var(", ");border-radius:var(", ");margin:auto var(", ");}}:active:not([disabled]) ", "::after{width:calc(var(", ") * var(", ",1));}"], _Switch2.StyledTrigger, _Switch.tokens.trackWidth, _Switch.tokens.trackBorderWidth, _Switch.tokens.trackBorderRadius, _Switch.tokens.trackWidth, _Switch.tokens.trackHeight, _Switch.tokens.thumbSize, _Switch.tokens.thumbSize, _Switch.tokens.thumbBorderRadius, _Switch.tokens.thumbOffset, _Switch2.StyledTrigger, _Switch.tokens.thumbSize, _Switch.tokens.thumbPressScale);
|
@@ -7,4 +7,4 @@ exports.base = void 0;
|
|
7
7
|
var _styledComponents = /*#__PURE__*/require("styled-components");
|
8
8
|
var _Switch = /*#__PURE__*/require("../Switch.tokens");
|
9
9
|
var _Switch2 = /*#__PURE__*/require("../Switch.styles");
|
10
|
-
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{background-color:var(", ");}", ":not([disabled]) ~ ", ":hover{background-color:var(", ",var(", "));}", ":checked ~ ", "{background-color:var(", ");}", ":checked:not([disabled]) ~ ", ":hover{background-color:var(", ",var(", "));}", "::after{background-color:var(", ");box-shadow:var(", ");}", ":checked ~ ", "::after{box-shadow:var(", ",var(", "));}", "{color:var(", ");}", "{color:var(", ");}"], _Switch2.StyledTrigger, _Switch.tokens.trackBackgroundColorOff, _Switch2.StyledInput, _Switch2.StyledTrigger, _Switch.tokens.trackBackgroundColorOffHover, _Switch.tokens.trackBackgroundColorOff, _Switch2.StyledInput, _Switch2.StyledTrigger, _Switch.tokens.trackBackgroundColorOn, _Switch2.StyledInput, _Switch2.StyledTrigger, _Switch.tokens.trackBackgroundColorOnHover, _Switch.tokens.trackBackgroundColorOn, _Switch2.StyledTrigger, _Switch.tokens.
|
10
|
+
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{background-color:var(", ");border-color:var(", ");}", ":not([disabled]) ~ ", ":hover{background-color:var(", ",var(", "));border-color:var(", ",var(", "));}", ":checked ~ ", "{background-color:var(", ");border-color:var(", ");}", ":checked:not([disabled]) ~ ", ":hover{background-color:var(", ",var(", "));border-color:var(", ",var(", "));}", "::after{background-color:var(", ");box-shadow:var(", ");}", ":checked ~ ", "::after{background-color:var(", ");box-shadow:var(", ",var(", "));}", "{color:var(", ");}", "{color:var(", ");}"], _Switch2.StyledTrigger, _Switch.tokens.trackBackgroundColorOff, _Switch.tokens.trackBorderColorOff, _Switch2.StyledInput, _Switch2.StyledTrigger, _Switch.tokens.trackBackgroundColorOffHover, _Switch.tokens.trackBackgroundColorOff, _Switch.tokens.trackBorderColorOffHover, _Switch.tokens.trackBorderColorOff, _Switch2.StyledInput, _Switch2.StyledTrigger, _Switch.tokens.trackBackgroundColorOn, _Switch.tokens.trackBorderColorOn, _Switch2.StyledInput, _Switch2.StyledTrigger, _Switch.tokens.trackBackgroundColorOnHover, _Switch.tokens.trackBackgroundColorOn, _Switch.tokens.trackBorderColorOnHover, _Switch.tokens.trackBorderColorOn, _Switch2.StyledTrigger, _Switch.tokens.thumbBackgroundColorOff, _Switch.tokens.thumbBoxShadow, _Switch2.StyledInput, _Switch2.StyledTrigger, _Switch.tokens.thumbBackgroundColorOn, _Switch.tokens.thumbBoxShadowOn, _Switch.tokens.thumbBoxShadow, _Switch2.StyledLabel, _Switch.tokens.labelColor, _Switch2.StyledDescription, _Switch.tokens.descriptionColor);
|
@@ -25,7 +25,7 @@ var config = exports.config = {
|
|
25
25
|
s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":1.25rem;", ":calc(var(", ") / 2);", ":1rem;", ":calc(var(", ") / 2);", ":0.125rem;", ":1.25;"], _Switch.switchTokens.trackWidth, _Switch.switchTokens.trackHeight, _Switch.switchTokens.trackBorderRadius, _Switch.switchTokens.trackHeight, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbBorderRadius, _Switch.switchTokens.thumbSize, _Switch.switchTokens.thumbOffset, _Switch.switchTokens.thumbPressScale)
|
26
26
|
},
|
27
27
|
view: {
|
28
|
-
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBackgroundColorOn, _Switch.switchTokens.trackBackgroundColorOnHover, _Switch.switchTokens.trackBackgroundColorOff, _Switch.switchTokens.trackBackgroundColorOffHover, _Switch.switchTokens.
|
28
|
+
"default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--surface-accent-hover);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":0rem;", ":var(--on-dark-surface-solid-default);", ":var(--on-dark-surface-solid-default);", ":0 1px 1px rgba(0,0,0,0.11);"], _Switch.switchTokens.labelColor, _Switch.switchTokens.descriptionColor, _Switch.switchTokens.trackBackgroundColorOn, _Switch.switchTokens.trackBackgroundColorOnHover, _Switch.switchTokens.trackBackgroundColorOff, _Switch.switchTokens.trackBackgroundColorOffHover, _Switch.switchTokens.trackBorderWidth, _Switch.switchTokens.thumbBackgroundColorOff, _Switch.switchTokens.thumbBackgroundColorOn, _Switch.switchTokens.thumbBoxShadow)
|
29
29
|
},
|
30
30
|
disabled: {
|
31
31
|
"true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _Switch.switchTokens.disabledOpacity)
|