@alfalab/core-components-switch 4.3.2 → 4.4.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.
Files changed (44) hide show
  1. package/Component.d.ts +11 -0
  2. package/Component.js +17 -5
  3. package/cssm/Component.d.ts +11 -0
  4. package/cssm/Component.js +14 -4
  5. package/cssm/default.module.css +73 -0
  6. package/cssm/index.module.css +5 -40
  7. package/cssm/inverted.module.css +73 -0
  8. package/cssm/types/colors.d.ts +2 -0
  9. package/cssm/types/colors.js +2 -0
  10. package/cssm/vars.css +14 -0
  11. package/default.css +74 -0
  12. package/esm/Component.d.ts +11 -0
  13. package/esm/Component.js +17 -5
  14. package/esm/default.css +74 -0
  15. package/esm/index.css +23 -58
  16. package/esm/inverted.css +74 -0
  17. package/esm/types/colors.d.ts +2 -0
  18. package/esm/types/colors.js +1 -0
  19. package/index.css +23 -58
  20. package/inverted.css +74 -0
  21. package/modern/Component.d.ts +11 -0
  22. package/modern/Component.js +17 -5
  23. package/modern/default.css +74 -0
  24. package/modern/index.css +23 -58
  25. package/modern/inverted.css +74 -0
  26. package/modern/types/colors.d.ts +2 -0
  27. package/modern/types/colors.js +1 -0
  28. package/moderncssm/Component.d.ts +11 -0
  29. package/moderncssm/Component.js +12 -4
  30. package/moderncssm/default.module.css +58 -0
  31. package/moderncssm/index.module.css +3 -70
  32. package/moderncssm/inverted.module.css +58 -0
  33. package/moderncssm/types/colors.d.ts +2 -0
  34. package/moderncssm/types/colors.js +1 -0
  35. package/moderncssm/vars.css +14 -0
  36. package/package.json +1 -1
  37. package/src/Component.tsx +31 -3
  38. package/src/default.module.css +46 -0
  39. package/src/index.module.css +1 -61
  40. package/src/inverted.module.css +46 -0
  41. package/src/types/colors.ts +1 -0
  42. package/src/vars.css +37 -0
  43. package/types/colors.d.ts +2 -0
  44. package/types/colors.js +2 -0
@@ -0,0 +1,74 @@
1
+ /* hash: 6qqvm */
2
+ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
+ } /* deprecated */ :root {
4
+ --color-light-neutral-translucent-200-inverted: rgba(225, 225, 248, 0.09);
5
+ --color-light-neutral-translucent-500-inverted: rgba(228, 228, 251, 0.28);
6
+ --color-light-neutral-translucent-700-inverted: rgba(238, 238, 251, 0.55);
7
+ --color-light-neutral-translucent-700-inverted-hover: rgba(239, 240, 252, 0.65);
8
+ --color-light-status-positive-inverted: #17d055;
9
+ --color-light-status-positive-inverted-hover: #22e068;
10
+ --color-light-text-primary-inverted: rgba(255, 255, 255, 0.94);
11
+ --color-light-text-secondary-inverted: rgba(238, 238, 251, 0.55); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
12
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
13
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
14
+ } :root {
15
+
16
+ /* Hard */
17
+
18
+ /* Up */
19
+
20
+ /* Hard up */
21
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
22
+
23
+ /* новые значения, используйте их */
24
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
25
+
26
+ /* новые значения, используйте их */
27
+ } :root {
28
+ } :root {
29
+ } /* сбрасывает синюю подсветку при нажатии */ :root {
30
+
31
+ /* inverted */
32
+ --switch-label-inverted-color: var(--color-light-text-primary-inverted);
33
+ --switch-hint-inverted-color: var(--color-light-text-secondary-inverted);
34
+ --switch-checked-bg-inverted-color: var(--color-light-status-positive-inverted);
35
+ --switch-checked-hover-bg-inverted-color: var(--color-light-status-positive-inverted-hover);
36
+ --switch-bg-inverted-color: var(--color-light-neutral-translucent-700-inverted);
37
+
38
+ /* hover */
39
+ --switch-hover-bg-inverted-color: var(--color-light-neutral-translucent-700-inverted-hover);
40
+
41
+ /* checked */
42
+
43
+ /* disabled */
44
+ --switch-disabled-inverted-color: var(--color-light-text-secondary-inverted);
45
+ --switch-disabled-bg-inverted-color: var(--color-light-neutral-translucent-200-inverted);
46
+
47
+ /* disabled checked */
48
+ --switch-disabled-checked-bg-inverted-color: var(--switch-disabled-bg-inverted-color);
49
+
50
+ /* icon */
51
+ --switch-icon-disabled-inverted-color: var(--color-light-neutral-translucent-500-inverted);
52
+ } .switch__switch_u8wl7 {
53
+ background-color: var(--switch-bg-inverted-color)
54
+ } .switch__switch_u8wl7:hover {
55
+ background-color: var(--switch-hover-bg-inverted-color);
56
+ } .switch__label_u8wl7 {
57
+ color: var(--switch-label-inverted-color);
58
+ } .switch__hint_u8wl7 {
59
+ color: var(--switch-hint-inverted-color);
60
+ } .switch__checked_u8wl7 .switch__switch_u8wl7 {
61
+ background-color: var(--switch-checked-bg-inverted-color)
62
+ } .switch__checked_u8wl7 .switch__switch_u8wl7:hover {
63
+ background-color: var(--switch-checked-hover-bg-inverted-color);
64
+ } .switch__disabled_u8wl7 .switch__label_u8wl7 {
65
+ color: var(--switch-disabled-inverted-color);
66
+ } .switch__disabled_u8wl7 .switch__hint_u8wl7 {
67
+ color: var(--switch-disabled-inverted-color);
68
+ } .switch__disabled_u8wl7 .switch__switch_u8wl7 {
69
+ background-color: var(--switch-disabled-bg-inverted-color)
70
+ } .switch__disabled_u8wl7 .switch__switch_u8wl7:before {
71
+ background-color: var(--switch-icon-disabled-inverted-color);
72
+ } .switch__disabled_u8wl7.switch__checked_u8wl7 .switch__switch_u8wl7 {
73
+ background-color: var(--switch-disabled-checked-bg-inverted-color);
74
+ }
@@ -0,0 +1,2 @@
1
+ type Colors = 'default' | 'inverted';
2
+ export { Colors };
@@ -0,0 +1 @@
1
+
package/index.css CHANGED
@@ -1,16 +1,8 @@
1
- /* hash: 1nwad */
1
+ /* hash: c39sc */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
- --color-light-neutral-translucent-200: rgba(30, 43, 68, 0.08);
5
- --color-light-neutral-translucent-500: rgba(9, 12, 37, 0.28);
6
- --color-light-neutral-translucent-700: rgba(4, 4, 21, 0.47);
7
- --color-light-neutral-translucent-700-hover: rgba(4, 4, 19, 0.55);
8
4
  --color-light-status-info: #2288fa;
9
- --color-light-status-positive: #0cc44d;
10
- --color-light-status-positive-hover: #04b545;
11
5
  --color-light-text-negative: #ec2d20;
12
- --color-light-text-primary: rgba(3, 3, 6, 0.88);
13
- --color-light-text-secondary: rgba(4, 4, 19, 0.55);
14
6
  --color-static-neutral-0: #fff; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
15
7
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
16
8
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -44,30 +36,22 @@
44
36
  --focus-color: var(--color-light-status-info);
45
37
  --disabled-cursor: not-allowed;
46
38
  } /* сбрасывает синюю подсветку при нажатии */ :root {
47
- --switch-label-color: var(--color-light-text-primary);
48
- --switch-hint-color: var(--color-light-text-secondary);
49
- --switch-bg-color: var(--color-light-neutral-translucent-700);
50
39
  --switch-border-color: transparent;
51
40
  --switch-error-color: var(--color-light-text-negative);
52
41
 
42
+ /* inverted */
43
+
53
44
  /* hover */
54
- --switch-hover-bg-color: var(--color-light-neutral-translucent-700-hover);
55
45
 
56
46
  /* checked */
57
- --switch-checked-bg-color: var(--color-light-status-positive);
58
- --switch-checked-hover-bg-color: var(--color-light-status-positive-hover);
59
47
 
60
48
  /* disabled */
61
- --switch-disabled-color: var(--color-light-text-secondary);
62
- --switch-disabled-bg-color: var(--color-light-neutral-translucent-200);
63
49
 
64
50
  /* disabled checked */
65
- --switch-disabled-checked-bg-color: var(--switch-disabled-bg-color);
66
51
 
67
52
  /* icon */
68
53
  --switch-icon-color: var(--color-static-neutral-0);
69
- --switch-icon-disabled-color: var(--color-light-neutral-translucent-500);
70
- } .switch__component_1drxk {
54
+ } .switch__component_110yj {
71
55
  display: inline-flex;
72
56
  align-items: flex-start;
73
57
  margin: var(--gap-0);
@@ -75,33 +59,30 @@
75
59
  border: 0;
76
60
  cursor: pointer;
77
61
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
78
- } .switch__component_1drxk input {
62
+ } .switch__component_110yj input {
79
63
  opacity: 0;
80
64
  position: absolute;
81
- } .switch__start_1drxk {
65
+ } .switch__start_110yj {
82
66
  align-items: flex-start;
83
- } .switch__center_1drxk {
67
+ } .switch__center_110yj {
84
68
  align-items: center;
85
- } .switch__addons_1drxk {
69
+ } .switch__addons_110yj {
86
70
  margin-left: auto;
87
71
  padding-left: var(--gap-16);
88
72
  line-height: 24px;
89
- } .switch__block_1drxk {
73
+ } .switch__block_110yj {
90
74
  width: 100%;
91
- } .switch__switch_1drxk {
75
+ } .switch__switch_110yj {
92
76
  position: relative;
93
77
  border-radius: var(--border-radius-16);
94
78
  width: 36px;
95
79
  height: 20px;
96
80
  margin: var(--gap-2);
97
81
  flex-shrink: 0;
98
- background-color: var(--switch-bg-color);
99
82
  border: 2px solid var(--switch-border-color);
100
83
  transition: background-color 0.2s ease, border-color 0.2s ease;
101
- box-sizing: border-box
102
- } .switch__switch_1drxk:hover {
103
- background-color: var(--switch-hover-bg-color);
104
- } .switch__switch_1drxk:before {
84
+ box-sizing: border-box;
85
+ } .switch__switch_110yj:before {
105
86
  content: '';
106
87
  position: absolute;
107
88
  top: var(--gap-0);
@@ -113,58 +94,42 @@
113
94
  background-color: var(--switch-icon-color);
114
95
  box-sizing: border-box;
115
96
  transition: transform 0.2s ease;
116
- } .switch__content_1drxk {
97
+ } .switch__content_110yj {
117
98
  margin-left: var(--gap-12);
118
99
  flex-grow: 1;
119
- } .switch__label_1drxk {
100
+ } .switch__label_110yj {
120
101
  font-size: 16px;
121
102
  line-height: 24px;
122
103
  font-weight: 400;
123
104
  display: block;
124
- color: var(--switch-label-color);
125
- } .switch__label_1drxk:not(:only-child) {
105
+ } .switch__label_110yj:not(:only-child) {
126
106
  margin-bottom: var(--gap-4);
127
- } .switch__errorMessage_1drxk {
107
+ } .switch__errorMessage_110yj {
128
108
  font-size: 14px;
129
109
  line-height: 18px;
130
110
  font-weight: 400;
131
111
  color: var(--switch-error-color);
132
- } .switch__hint_1drxk {
112
+ } .switch__hint_110yj {
133
113
  font-size: 14px;
134
114
  line-height: 18px;
135
115
  font-weight: 400;
136
116
  display: block;
137
- color: var(--switch-hint-color);
138
- } /* Reversed state */ .switch__component_1drxk.switch__reversed_1drxk {
117
+ } /* Reversed state */ .switch__component_110yj.switch__reversed_110yj {
139
118
  flex-direction: row-reverse;
140
- } .switch__reversed_1drxk .switch__content_1drxk {
119
+ } .switch__reversed_110yj .switch__content_110yj {
141
120
  margin-right: var(--gap-16);
142
121
  margin-left: var(--gap-0);
143
- } .switch__reversed_1drxk .switch__addons_1drxk {
122
+ } .switch__reversed_110yj .switch__addons_110yj {
144
123
  margin-left: var(--gap-0);
145
124
  padding-left: var(--gap-0);
146
125
  margin-right: auto;
147
126
  padding-right: var(--gap-16);
148
- } /* Checked state */ .switch__checked_1drxk .switch__switch_1drxk {
149
- background-color: var(--switch-checked-bg-color)
150
- } .switch__checked_1drxk .switch__switch_1drxk:hover {
151
- background-color: var(--switch-checked-hover-bg-color);
152
- } .switch__checked_1drxk .switch__switch_1drxk:before {
127
+ } /* Checked state */ .switch__checked_110yj .switch__switch_110yj:before {
153
128
  /* ширина компонента(36px + 2*2px) - отступы(2 * 2px) - размер кружка(20px) */
154
129
  transform: translateX(16px);
155
- } /* Disabled state */ .switch__disabled_1drxk {
130
+ } /* Disabled state */ .switch__disabled_110yj {
156
131
  cursor: var(--disabled-cursor);
157
- } .switch__disabled_1drxk .switch__switch_1drxk {
158
- background-color: var(--switch-disabled-bg-color)
159
- } .switch__disabled_1drxk .switch__switch_1drxk:before {
160
- background-color: var(--switch-icon-disabled-color);
161
- } .switch__disabled_1drxk.switch__checked_1drxk .switch__switch_1drxk {
162
- background-color: var(--switch-disabled-checked-bg-color);
163
- } .switch__disabled_1drxk .switch__label_1drxk {
164
- color: var(--switch-disabled-color);
165
- } .switch__disabled_1drxk .switch__hint_1drxk {
166
- color: var(--switch-disabled-color);
167
- } /* Focused state */ .switch__focused_1drxk .switch__switch_1drxk {
132
+ } /* Focused state */ .switch__focused_110yj .switch__switch_110yj {
168
133
  outline: 2px solid var(--focus-color);
169
134
  outline-offset: 2px;
170
135
  }
package/inverted.css ADDED
@@ -0,0 +1,74 @@
1
+ /* hash: 6qqvm */
2
+ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
+ } /* deprecated */ :root {
4
+ --color-light-neutral-translucent-200-inverted: rgba(225, 225, 248, 0.09);
5
+ --color-light-neutral-translucent-500-inverted: rgba(228, 228, 251, 0.28);
6
+ --color-light-neutral-translucent-700-inverted: rgba(238, 238, 251, 0.55);
7
+ --color-light-neutral-translucent-700-inverted-hover: rgba(239, 240, 252, 0.65);
8
+ --color-light-status-positive-inverted: #17d055;
9
+ --color-light-status-positive-inverted-hover: #22e068;
10
+ --color-light-text-primary-inverted: rgba(255, 255, 255, 0.94);
11
+ --color-light-text-secondary-inverted: rgba(238, 238, 251, 0.55); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
12
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
13
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
14
+ } :root {
15
+
16
+ /* Hard */
17
+
18
+ /* Up */
19
+
20
+ /* Hard up */
21
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
22
+
23
+ /* новые значения, используйте их */
24
+ } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
25
+
26
+ /* новые значения, используйте их */
27
+ } :root {
28
+ } :root {
29
+ } /* сбрасывает синюю подсветку при нажатии */ :root {
30
+
31
+ /* inverted */
32
+ --switch-label-inverted-color: var(--color-light-text-primary-inverted);
33
+ --switch-hint-inverted-color: var(--color-light-text-secondary-inverted);
34
+ --switch-checked-bg-inverted-color: var(--color-light-status-positive-inverted);
35
+ --switch-checked-hover-bg-inverted-color: var(--color-light-status-positive-inverted-hover);
36
+ --switch-bg-inverted-color: var(--color-light-neutral-translucent-700-inverted);
37
+
38
+ /* hover */
39
+ --switch-hover-bg-inverted-color: var(--color-light-neutral-translucent-700-inverted-hover);
40
+
41
+ /* checked */
42
+
43
+ /* disabled */
44
+ --switch-disabled-inverted-color: var(--color-light-text-secondary-inverted);
45
+ --switch-disabled-bg-inverted-color: var(--color-light-neutral-translucent-200-inverted);
46
+
47
+ /* disabled checked */
48
+ --switch-disabled-checked-bg-inverted-color: var(--switch-disabled-bg-inverted-color);
49
+
50
+ /* icon */
51
+ --switch-icon-disabled-inverted-color: var(--color-light-neutral-translucent-500-inverted);
52
+ } .switch__switch_u8wl7 {
53
+ background-color: var(--switch-bg-inverted-color)
54
+ } .switch__switch_u8wl7:hover {
55
+ background-color: var(--switch-hover-bg-inverted-color);
56
+ } .switch__label_u8wl7 {
57
+ color: var(--switch-label-inverted-color);
58
+ } .switch__hint_u8wl7 {
59
+ color: var(--switch-hint-inverted-color);
60
+ } .switch__checked_u8wl7 .switch__switch_u8wl7 {
61
+ background-color: var(--switch-checked-bg-inverted-color)
62
+ } .switch__checked_u8wl7 .switch__switch_u8wl7:hover {
63
+ background-color: var(--switch-checked-hover-bg-inverted-color);
64
+ } .switch__disabled_u8wl7 .switch__label_u8wl7 {
65
+ color: var(--switch-disabled-inverted-color);
66
+ } .switch__disabled_u8wl7 .switch__hint_u8wl7 {
67
+ color: var(--switch-disabled-inverted-color);
68
+ } .switch__disabled_u8wl7 .switch__switch_u8wl7 {
69
+ background-color: var(--switch-disabled-bg-inverted-color)
70
+ } .switch__disabled_u8wl7 .switch__switch_u8wl7:before {
71
+ background-color: var(--switch-icon-disabled-inverted-color);
72
+ } .switch__disabled_u8wl7.switch__checked_u8wl7 .switch__switch_u8wl7 {
73
+ background-color: var(--switch-disabled-checked-bg-inverted-color);
74
+ }
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import React from 'react';
3
3
  import { ChangeEvent, InputHTMLAttributes, ReactNode } from "react";
4
+ import { Colors } from "./types/colors";
4
5
  type Align = 'start' | 'center';
5
6
  type SwitchProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'hint' | 'onChange' | 'disabled' | 'enterKeyHint'> & {
6
7
  /**
@@ -56,6 +57,11 @@ type SwitchProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'hint' |
56
57
  * Идентификатор для систем автоматизированного тестирования
57
58
  */
58
59
  dataTestId?: string;
60
+ /**
61
+ * Набор цветов для компонента
62
+ * @default default
63
+ */
64
+ colors?: Colors;
59
65
  };
60
66
  declare const Switch: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "hint" | "onChange" | "disabled" | "enterKeyHint"> & {
61
67
  /**
@@ -111,5 +117,10 @@ declare const Switch: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttrib
111
117
  * Идентификатор для систем автоматизированного тестирования
112
118
  */
113
119
  dataTestId?: string | undefined;
120
+ /**
121
+ * Набор цветов для компонента
122
+ * @default default
123
+ */
124
+ colors?: Colors | undefined;
114
125
  } & React.RefAttributes<HTMLLabelElement>>;
115
126
  export { SwitchProps, Switch };
@@ -4,10 +4,20 @@ import cn from 'classnames';
4
4
  import { dom } from '@alfalab/core-components-shared/modern';
5
5
  import { useFocus } from '@alfalab/hooks';
6
6
 
7
- const styles = {"component":"switch__component_1drxk","start":"switch__start_1drxk","center":"switch__center_1drxk","addons":"switch__addons_1drxk","block":"switch__block_1drxk","switch":"switch__switch_1drxk","content":"switch__content_1drxk","label":"switch__label_1drxk","errorMessage":"switch__errorMessage_1drxk","hint":"switch__hint_1drxk","reversed":"switch__reversed_1drxk","checked":"switch__checked_1drxk","disabled":"switch__disabled_1drxk","focused":"switch__focused_1drxk"};
7
+ const defaultStyles = {"switch":"switch__switch_14m20","label":"switch__label_14m20","hint":"switch__hint_14m20","checked":"switch__checked_14m20","disabled":"switch__disabled_14m20"};
8
+ require('./default.css')
9
+
10
+ const styles = {"component":"switch__component_110yj","start":"switch__start_110yj","center":"switch__center_110yj","addons":"switch__addons_110yj","block":"switch__block_110yj","switch":"switch__switch_110yj","content":"switch__content_110yj","label":"switch__label_110yj","errorMessage":"switch__errorMessage_110yj","hint":"switch__hint_110yj","reversed":"switch__reversed_110yj","checked":"switch__checked_110yj","disabled":"switch__disabled_110yj","focused":"switch__focused_110yj"};
8
11
  require('./index.css')
9
12
 
10
- const Switch = forwardRef(({ reversed = false, checked = false, align = 'start', addons, block, disabled, inactive, error, label, hint, name, value, className, onChange, dataTestId, ...restProps }, ref) => {
13
+ const invertedStyles = {"switch":"switch__switch_u8wl7","label":"switch__label_u8wl7","hint":"switch__hint_u8wl7","checked":"switch__checked_u8wl7","disabled":"switch__disabled_u8wl7"};
14
+ require('./inverted.css')
15
+
16
+ const colorStyles = {
17
+ default: defaultStyles,
18
+ inverted: invertedStyles,
19
+ };
20
+ const Switch = forwardRef(({ reversed = false, checked = false, align = 'start', addons, block, disabled, inactive, error, label, hint, name, value, className, onChange, dataTestId, colors = 'default', ...restProps }, ref) => {
11
21
  const labelRef = useRef(null);
12
22
  const [focused] = useFocus(labelRef, 'keyboard');
13
23
  const handleChange = (e) => {
@@ -18,16 +28,18 @@ const Switch = forwardRef(({ reversed = false, checked = false, align = 'start',
18
28
  const errorMessage = typeof error === 'boolean' ? '' : error;
19
29
  return (React.createElement("label", { className: cn(styles.component, styles[align], className, {
20
30
  [styles.disabled]: disabled || inactive,
31
+ [colorStyles[colors].disabled]: disabled || inactive,
21
32
  [styles.checked]: checked,
33
+ [colorStyles[colors].checked]: checked,
22
34
  [styles.reversed]: reversed,
23
35
  [styles.focused]: focused,
24
36
  [styles.block]: block,
25
37
  }), ref: mergeRefs([labelRef, ref]) },
26
38
  React.createElement("input", { type: 'checkbox', onChange: handleChange, disabled: disabled || inactive, checked: checked, name: name, value: value, "data-test-id": dataTestId, ...restProps }),
27
- React.createElement("span", { className: styles.switch }),
39
+ React.createElement("span", { className: cn(styles.switch, colorStyles[colors].switch) }),
28
40
  (label || hint || errorMessage) && (React.createElement("span", { className: styles.content },
29
- label && React.createElement("span", { className: styles.label }, label),
30
- hint && !errorMessage && React.createElement("span", { className: styles.hint }, hint),
41
+ label && (React.createElement("span", { className: cn(styles.label, colorStyles[colors].label) }, label)),
42
+ hint && !errorMessage && (React.createElement("span", { className: cn(styles.hint, colorStyles[colors].hint) }, hint)),
31
43
  errorMessage && (React.createElement("span", { className: styles.errorMessage, role: 'alert' }, errorMessage)))),
32
44
  addons && (
33
45
  // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions