@alfalab/core-components-switch 6.1.4-alfasans → 6.1.4

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 (21) hide show
  1. package/cssm/index.module.css +5 -9
  2. package/default.css +11 -11
  3. package/default.module.css.js +1 -1
  4. package/esm/default.css +11 -11
  5. package/esm/default.module.css.js +1 -1
  6. package/esm/index.css +28 -32
  7. package/esm/index.module.css.js +1 -1
  8. package/esm/inverted.css +11 -11
  9. package/esm/inverted.module.css.js +1 -1
  10. package/index.css +28 -32
  11. package/index.module.css.js +1 -1
  12. package/inverted.css +11 -11
  13. package/inverted.module.css.js +1 -1
  14. package/modern/default.css +11 -11
  15. package/modern/default.module.css.js +1 -1
  16. package/modern/index.css +28 -32
  17. package/modern/index.module.css.js +1 -1
  18. package/modern/inverted.css +11 -11
  19. package/modern/inverted.module.css.js +1 -1
  20. package/moderncssm/index.module.css +3 -6
  21. package/package.json +5 -5
package/cssm/index.module.css CHANGED
@@ -23,9 +23,8 @@
23
23
  --gap-16: var(--gap-m);
24
24
  }
25
25
  :root {
26
- --font-family-alfasans:
27
- 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
28
- Helvetica, sans-serif;
26
+ --font-family-system:
27
+ system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
29
28
  }
30
29
  :root {
31
30
  --focus-color: var(--color-light-status-info);
@@ -103,8 +102,7 @@
103
102
  font-size: 16px;
104
103
  line-height: 24px;
105
104
  font-weight: 400;
106
- letter-spacing: -0.24px;
107
- font-family: var(--font-family-alfasans);
105
+ font-family: var(--font-family-system);
108
106
  display: block;
109
107
  }
110
108
  .labelWrap:not(:only-child) {
@@ -121,16 +119,14 @@
121
119
  font-size: 14px;
122
120
  line-height: 18px;
123
121
  font-weight: 400;
124
- letter-spacing: -0.08px;
125
- font-family: var(--font-family-alfasans);
122
+ font-family: var(--font-family-system);
126
123
  color: var(--switch-error-color);
127
124
  }
128
125
  .hint {
129
126
  font-size: 14px;
130
127
  line-height: 18px;
131
128
  font-weight: 400;
132
- letter-spacing: -0.08px;
133
- font-family: var(--font-family-alfasans);
129
+ font-family: var(--font-family-system);
134
130
  display: block;
135
131
  }
136
132
  .hintWrap.loading {
package/default.css CHANGED
@@ -20,36 +20,36 @@
20
20
  --switch-disabled-checked-bg-color: var(--switch-disabled-bg-color);
21
21
  --switch-icon-disabled-color: var(--color-light-neutral-translucent-500);
22
22
  }
23
- .switch__switch_1ehl5 {
23
+ .switch__switch_1iise {
24
24
  background-color: var(--switch-bg-color);
25
25
  }
26
- .switch__switch_1ehl5:hover {
26
+ .switch__switch_1iise:hover {
27
27
  background-color: var(--switch-hover-bg-color);
28
28
  }
29
- .switch__label_1ehl5 {
29
+ .switch__label_1iise {
30
30
  color: var(--switch-label-color);
31
31
  }
32
- .switch__hint_1ehl5 {
32
+ .switch__hint_1iise {
33
33
  color: var(--switch-hint-color);
34
34
  }
35
- .switch__checked_1ehl5 .switch__switch_1ehl5 {
35
+ .switch__checked_1iise .switch__switch_1iise {
36
36
  background-color: var(--switch-checked-bg-color);
37
37
  }
38
- .switch__checked_1ehl5 .switch__switch_1ehl5:hover {
38
+ .switch__checked_1iise .switch__switch_1iise:hover {
39
39
  background-color: var(--switch-checked-hover-bg-color);
40
40
  }
41
- .switch__disabled_1ehl5 .switch__label_1ehl5 {
41
+ .switch__disabled_1iise .switch__label_1iise {
42
42
  color: var(--switch-disabled-color);
43
43
  }
44
- .switch__disabled_1ehl5 .switch__hint_1ehl5 {
44
+ .switch__disabled_1iise .switch__hint_1iise {
45
45
  color: var(--switch-disabled-color);
46
46
  }
47
- .switch__disabled_1ehl5 .switch__switch_1ehl5 {
47
+ .switch__disabled_1iise .switch__switch_1iise {
48
48
  background-color: var(--switch-disabled-bg-color);
49
49
  }
50
- .switch__disabled_1ehl5 .switch__switch_1ehl5:before {
50
+ .switch__disabled_1iise .switch__switch_1iise:before {
51
51
  background-color: var(--switch-icon-disabled-color);
52
52
  }
53
- .switch__disabled_1ehl5.switch__checked_1ehl5 .switch__switch_1ehl5 {
53
+ .switch__disabled_1iise.switch__checked_1iise .switch__switch_1iise {
54
54
  background-color: var(--switch-disabled-checked-bg-color);
55
55
  }
package/default.module.css.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./default.css');
4
4
 
5
- var defaultStyles = {"switch":"switch__switch_1ehl5","label":"switch__label_1ehl5","hint":"switch__hint_1ehl5","checked":"switch__checked_1ehl5","disabled":"switch__disabled_1ehl5"};
5
+ var defaultStyles = {"switch":"switch__switch_1iise","label":"switch__label_1iise","hint":"switch__hint_1iise","checked":"switch__checked_1iise","disabled":"switch__disabled_1iise"};
6
6
 
7
7
  module.exports = defaultStyles;
8
8
  //# sourceMappingURL=default.module.css.js.map
package/esm/default.css CHANGED
@@ -20,36 +20,36 @@
20
20
  --switch-disabled-checked-bg-color: var(--switch-disabled-bg-color);
21
21
  --switch-icon-disabled-color: var(--color-light-neutral-translucent-500);
22
22
  }
23
- .switch__switch_1ehl5 {
23
+ .switch__switch_1iise {
24
24
  background-color: var(--switch-bg-color);
25
25
  }
26
- .switch__switch_1ehl5:hover {
26
+ .switch__switch_1iise:hover {
27
27
  background-color: var(--switch-hover-bg-color);
28
28
  }
29
- .switch__label_1ehl5 {
29
+ .switch__label_1iise {
30
30
  color: var(--switch-label-color);
31
31
  }
32
- .switch__hint_1ehl5 {
32
+ .switch__hint_1iise {
33
33
  color: var(--switch-hint-color);
34
34
  }
35
- .switch__checked_1ehl5 .switch__switch_1ehl5 {
35
+ .switch__checked_1iise .switch__switch_1iise {
36
36
  background-color: var(--switch-checked-bg-color);
37
37
  }
38
- .switch__checked_1ehl5 .switch__switch_1ehl5:hover {
38
+ .switch__checked_1iise .switch__switch_1iise:hover {
39
39
  background-color: var(--switch-checked-hover-bg-color);
40
40
  }
41
- .switch__disabled_1ehl5 .switch__label_1ehl5 {
41
+ .switch__disabled_1iise .switch__label_1iise {
42
42
  color: var(--switch-disabled-color);
43
43
  }
44
- .switch__disabled_1ehl5 .switch__hint_1ehl5 {
44
+ .switch__disabled_1iise .switch__hint_1iise {
45
45
  color: var(--switch-disabled-color);
46
46
  }
47
- .switch__disabled_1ehl5 .switch__switch_1ehl5 {
47
+ .switch__disabled_1iise .switch__switch_1iise {
48
48
  background-color: var(--switch-disabled-bg-color);
49
49
  }
50
- .switch__disabled_1ehl5 .switch__switch_1ehl5:before {
50
+ .switch__disabled_1iise .switch__switch_1iise:before {
51
51
  background-color: var(--switch-icon-disabled-color);
52
52
  }
53
- .switch__disabled_1ehl5.switch__checked_1ehl5 .switch__switch_1ehl5 {
53
+ .switch__disabled_1iise.switch__checked_1iise .switch__switch_1iise {
54
54
  background-color: var(--switch-disabled-checked-bg-color);
55
55
  }
package/esm/default.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './default.css';
2
2
 
3
- var defaultStyles = {"switch":"switch__switch_1ehl5","label":"switch__label_1ehl5","hint":"switch__hint_1ehl5","checked":"switch__checked_1ehl5","disabled":"switch__disabled_1ehl5"};
3
+ var defaultStyles = {"switch":"switch__switch_1iise","label":"switch__label_1iise","hint":"switch__hint_1iise","checked":"switch__checked_1iise","disabled":"switch__disabled_1iise"};
4
4
 
5
5
  export { defaultStyles as default };
6
6
  //# sourceMappingURL=default.module.css.js.map
package/esm/index.css CHANGED
@@ -23,9 +23,8 @@
23
23
  --gap-16: var(--gap-m);
24
24
  }
25
25
  :root {
26
- --font-family-alfasans:
27
- 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
28
- Helvetica, sans-serif;
26
+ --font-family-system:
27
+ system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
29
28
  }
30
29
  :root {
31
30
  --focus-color: var(--color-light-status-info);
@@ -36,7 +35,7 @@
36
35
  --switch-error-color: var(--color-light-text-negative);
37
36
  --switch-icon-color: var(--color-static-neutral-0);
38
37
  }
39
- .switch__component_wlvxc {
38
+ .switch__component_4o6zi {
40
39
  display: inline-flex;
41
40
  align-items: flex-start;
42
41
  margin: var(--gap-0);
@@ -45,25 +44,25 @@
45
44
  cursor: pointer;
46
45
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
47
46
  }
48
- .switch__component_wlvxc input {
47
+ .switch__component_4o6zi input {
49
48
  opacity: 0;
50
49
  position: absolute;
51
50
  }
52
- .switch__start_wlvxc {
51
+ .switch__start_4o6zi {
53
52
  align-items: flex-start;
54
53
  }
55
- .switch__center_wlvxc {
54
+ .switch__center_4o6zi {
56
55
  align-items: center;
57
56
  }
58
- .switch__addons_wlvxc {
57
+ .switch__addons_4o6zi {
59
58
  margin-left: auto;
60
59
  padding-left: var(--gap-16);
61
60
  line-height: 24px;
62
61
  }
63
- .switch__block_wlvxc {
62
+ .switch__block_4o6zi {
64
63
  width: 100%;
65
64
  }
66
- .switch__switch_wlvxc {
65
+ .switch__switch_4o6zi {
67
66
  position: relative;
68
67
  display: block;
69
68
  border-radius: var(--border-radius-16);
@@ -77,12 +76,12 @@
77
76
  border-color 0.2s ease;
78
77
  box-sizing: border-box;
79
78
  }
80
- .switch__switchSkeleton_wlvxc {
79
+ .switch__switchSkeleton_4o6zi {
81
80
  width: 36px;
82
81
  height: 20px;
83
82
  margin: var(--gap-2);
84
83
  }
85
- .switch__switch_wlvxc:before {
84
+ .switch__switch_4o6zi:before {
86
85
  content: '';
87
86
  position: absolute;
88
87
  top: var(--gap-0);
@@ -95,68 +94,65 @@
95
94
  box-sizing: border-box;
96
95
  transition: transform 0.2s ease;
97
96
  }
98
- .switch__content_wlvxc {
97
+ .switch__content_4o6zi {
99
98
  margin-left: var(--gap-12);
100
99
  flex-grow: 1;
101
100
  }
102
- .switch__label_wlvxc {
101
+ .switch__label_4o6zi {
103
102
  font-size: 16px;
104
103
  line-height: 24px;
105
104
  font-weight: 400;
106
- letter-spacing: -0.24px;
107
- font-family: var(--font-family-alfasans);
105
+ font-family: var(--font-family-system);
108
106
  display: block;
109
107
  }
110
- .switch__labelWrap_wlvxc:not(:only-child) {
108
+ .switch__labelWrap_4o6zi:not(:only-child) {
111
109
  margin-bottom: var(--gap-4);
112
110
  }
113
- .switch__labelWrap_wlvxc.switch__loading_wlvxc {
111
+ .switch__labelWrap_4o6zi.switch__loading_4o6zi {
114
112
  height: var(--gap-12);
115
113
  margin: var(--gap-6) 0;
116
114
  }
117
- .switch__labelWrap_wlvxc.switch__loading_wlvxc:not(:only-child) {
115
+ .switch__labelWrap_4o6zi.switch__loading_4o6zi:not(:only-child) {
118
116
  margin-bottom: var(--gap-2s);
119
117
  }
120
- .switch__errorMessage_wlvxc {
118
+ .switch__errorMessage_4o6zi {
121
119
  font-size: 14px;
122
120
  line-height: 18px;
123
121
  font-weight: 400;
124
- letter-spacing: -0.08px;
125
- font-family: var(--font-family-alfasans);
122
+ font-family: var(--font-family-system);
126
123
  color: var(--switch-error-color);
127
124
  }
128
- .switch__hint_wlvxc {
125
+ .switch__hint_4o6zi {
129
126
  font-size: 14px;
130
127
  line-height: 18px;
131
128
  font-weight: 400;
132
- letter-spacing: -0.08px;
133
- font-family: var(--font-family-alfasans);
129
+ font-family: var(--font-family-system);
134
130
  display: block;
135
131
  }
136
- .switch__hintWrap_wlvxc.switch__loading_wlvxc {
132
+ .switch__hintWrap_4o6zi.switch__loading_4o6zi {
137
133
  height: var(--gap-10);
138
134
  margin-bottom: var(--gap-4);
139
135
  }
140
- .switch__component_wlvxc.switch__reversed_wlvxc {
136
+ .switch__component_4o6zi.switch__reversed_4o6zi {
141
137
  flex-direction: row-reverse;
142
138
  }
143
- .switch__reversed_wlvxc .switch__content_wlvxc {
139
+ .switch__reversed_4o6zi .switch__content_4o6zi {
144
140
  margin-right: var(--gap-16);
145
141
  margin-left: var(--gap-0);
146
142
  }
147
- .switch__reversed_wlvxc .switch__addons_wlvxc {
143
+ .switch__reversed_4o6zi .switch__addons_4o6zi {
148
144
  margin-left: var(--gap-0);
149
145
  padding-left: var(--gap-0);
150
146
  margin-right: auto;
151
147
  padding-right: var(--gap-16);
152
148
  }
153
- .switch__checked_wlvxc .switch__switch_wlvxc:before {
149
+ .switch__checked_4o6zi .switch__switch_4o6zi:before {
154
150
  transform: translateX(16px);
155
151
  }
156
- .switch__disabled_wlvxc {
152
+ .switch__disabled_4o6zi {
157
153
  cursor: var(--disabled-cursor);
158
154
  }
159
- .switch__focused_wlvxc .switch__switch_wlvxc {
155
+ .switch__focused_4o6zi .switch__switch_4o6zi {
160
156
  outline: 2px solid var(--focus-color);
161
157
  outline-offset: 2px;
162
158
  }
package/esm/index.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- var styles = {"component":"switch__component_wlvxc","start":"switch__start_wlvxc","center":"switch__center_wlvxc","addons":"switch__addons_wlvxc","block":"switch__block_wlvxc","switch":"switch__switch_wlvxc","switchSkeleton":"switch__switchSkeleton_wlvxc","content":"switch__content_wlvxc","label":"switch__label_wlvxc","labelWrap":"switch__labelWrap_wlvxc","loading":"switch__loading_wlvxc","errorMessage":"switch__errorMessage_wlvxc","hint":"switch__hint_wlvxc","hintWrap":"switch__hintWrap_wlvxc","reversed":"switch__reversed_wlvxc","checked":"switch__checked_wlvxc","disabled":"switch__disabled_wlvxc","focused":"switch__focused_wlvxc"};
3
+ var styles = {"component":"switch__component_4o6zi","start":"switch__start_4o6zi","center":"switch__center_4o6zi","addons":"switch__addons_4o6zi","block":"switch__block_4o6zi","switch":"switch__switch_4o6zi","switchSkeleton":"switch__switchSkeleton_4o6zi","content":"switch__content_4o6zi","label":"switch__label_4o6zi","labelWrap":"switch__labelWrap_4o6zi","loading":"switch__loading_4o6zi","errorMessage":"switch__errorMessage_4o6zi","hint":"switch__hint_4o6zi","hintWrap":"switch__hintWrap_4o6zi","reversed":"switch__reversed_4o6zi","checked":"switch__checked_4o6zi","disabled":"switch__disabled_4o6zi","focused":"switch__focused_4o6zi"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/esm/inverted.css CHANGED
@@ -20,36 +20,36 @@
20
20
  --switch-disabled-checked-bg-inverted-color: var(--switch-disabled-bg-inverted-color);
21
21
  --switch-icon-disabled-inverted-color: var(--color-light-neutral-translucent-500-inverted);
22
22
  }
23
- .switch__switch_1bb0b {
23
+ .switch__switch_173y1 {
24
24
  background-color: var(--switch-bg-inverted-color);
25
25
  }
26
- .switch__switch_1bb0b:hover {
26
+ .switch__switch_173y1:hover {
27
27
  background-color: var(--switch-hover-bg-inverted-color);
28
28
  }
29
- .switch__label_1bb0b {
29
+ .switch__label_173y1 {
30
30
  color: var(--switch-label-inverted-color);
31
31
  }
32
- .switch__hint_1bb0b {
32
+ .switch__hint_173y1 {
33
33
  color: var(--switch-hint-inverted-color);
34
34
  }
35
- .switch__checked_1bb0b .switch__switch_1bb0b {
35
+ .switch__checked_173y1 .switch__switch_173y1 {
36
36
  background-color: var(--switch-checked-bg-inverted-color);
37
37
  }
38
- .switch__checked_1bb0b .switch__switch_1bb0b:hover {
38
+ .switch__checked_173y1 .switch__switch_173y1:hover {
39
39
  background-color: var(--switch-checked-hover-bg-inverted-color);
40
40
  }
41
- .switch__disabled_1bb0b .switch__label_1bb0b {
41
+ .switch__disabled_173y1 .switch__label_173y1 {
42
42
  color: var(--switch-disabled-inverted-color);
43
43
  }
44
- .switch__disabled_1bb0b .switch__hint_1bb0b {
44
+ .switch__disabled_173y1 .switch__hint_173y1 {
45
45
  color: var(--switch-disabled-inverted-color);
46
46
  }
47
- .switch__disabled_1bb0b .switch__switch_1bb0b {
47
+ .switch__disabled_173y1 .switch__switch_173y1 {
48
48
  background-color: var(--switch-disabled-bg-inverted-color);
49
49
  }
50
- .switch__disabled_1bb0b .switch__switch_1bb0b:before {
50
+ .switch__disabled_173y1 .switch__switch_173y1:before {
51
51
  background-color: var(--switch-icon-disabled-inverted-color);
52
52
  }
53
- .switch__disabled_1bb0b.switch__checked_1bb0b .switch__switch_1bb0b {
53
+ .switch__disabled_173y1.switch__checked_173y1 .switch__switch_173y1 {
54
54
  background-color: var(--switch-disabled-checked-bg-inverted-color);
55
55
  }
package/esm/inverted.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './inverted.css';
2
2
 
3
- var invertedStyles = {"switch":"switch__switch_1bb0b","label":"switch__label_1bb0b","hint":"switch__hint_1bb0b","checked":"switch__checked_1bb0b","disabled":"switch__disabled_1bb0b"};
3
+ var invertedStyles = {"switch":"switch__switch_173y1","label":"switch__label_173y1","hint":"switch__hint_173y1","checked":"switch__checked_173y1","disabled":"switch__disabled_173y1"};
4
4
 
5
5
  export { invertedStyles as default };
6
6
  //# sourceMappingURL=inverted.module.css.js.map
package/index.css CHANGED
@@ -23,9 +23,8 @@
23
23
  --gap-16: var(--gap-m);
24
24
  }
25
25
  :root {
26
- --font-family-alfasans:
27
- 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
28
- Helvetica, sans-serif;
26
+ --font-family-system:
27
+ system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
29
28
  }
30
29
  :root {
31
30
  --focus-color: var(--color-light-status-info);
@@ -36,7 +35,7 @@
36
35
  --switch-error-color: var(--color-light-text-negative);
37
36
  --switch-icon-color: var(--color-static-neutral-0);
38
37
  }
39
- .switch__component_wlvxc {
38
+ .switch__component_4o6zi {
40
39
  display: inline-flex;
41
40
  align-items: flex-start;
42
41
  margin: var(--gap-0);
@@ -45,25 +44,25 @@
45
44
  cursor: pointer;
46
45
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
47
46
  }
48
- .switch__component_wlvxc input {
47
+ .switch__component_4o6zi input {
49
48
  opacity: 0;
50
49
  position: absolute;
51
50
  }
52
- .switch__start_wlvxc {
51
+ .switch__start_4o6zi {
53
52
  align-items: flex-start;
54
53
  }
55
- .switch__center_wlvxc {
54
+ .switch__center_4o6zi {
56
55
  align-items: center;
57
56
  }
58
- .switch__addons_wlvxc {
57
+ .switch__addons_4o6zi {
59
58
  margin-left: auto;
60
59
  padding-left: var(--gap-16);
61
60
  line-height: 24px;
62
61
  }
63
- .switch__block_wlvxc {
62
+ .switch__block_4o6zi {
64
63
  width: 100%;
65
64
  }
66
- .switch__switch_wlvxc {
65
+ .switch__switch_4o6zi {
67
66
  position: relative;
68
67
  display: block;
69
68
  border-radius: var(--border-radius-16);
@@ -77,12 +76,12 @@
77
76
  border-color 0.2s ease;
78
77
  box-sizing: border-box;
79
78
  }
80
- .switch__switchSkeleton_wlvxc {
79
+ .switch__switchSkeleton_4o6zi {
81
80
  width: 36px;
82
81
  height: 20px;
83
82
  margin: var(--gap-2);
84
83
  }
85
- .switch__switch_wlvxc:before {
84
+ .switch__switch_4o6zi:before {
86
85
  content: '';
87
86
  position: absolute;
88
87
  top: var(--gap-0);
@@ -95,68 +94,65 @@
95
94
  box-sizing: border-box;
96
95
  transition: transform 0.2s ease;
97
96
  }
98
- .switch__content_wlvxc {
97
+ .switch__content_4o6zi {
99
98
  margin-left: var(--gap-12);
100
99
  flex-grow: 1;
101
100
  }
102
- .switch__label_wlvxc {
101
+ .switch__label_4o6zi {
103
102
  font-size: 16px;
104
103
  line-height: 24px;
105
104
  font-weight: 400;
106
- letter-spacing: -0.24px;
107
- font-family: var(--font-family-alfasans);
105
+ font-family: var(--font-family-system);
108
106
  display: block;
109
107
  }
110
- .switch__labelWrap_wlvxc:not(:only-child) {
108
+ .switch__labelWrap_4o6zi:not(:only-child) {
111
109
  margin-bottom: var(--gap-4);
112
110
  }
113
- .switch__labelWrap_wlvxc.switch__loading_wlvxc {
111
+ .switch__labelWrap_4o6zi.switch__loading_4o6zi {
114
112
  height: var(--gap-12);
115
113
  margin: var(--gap-6) 0;
116
114
  }
117
- .switch__labelWrap_wlvxc.switch__loading_wlvxc:not(:only-child) {
115
+ .switch__labelWrap_4o6zi.switch__loading_4o6zi:not(:only-child) {
118
116
  margin-bottom: var(--gap-2s);
119
117
  }
120
- .switch__errorMessage_wlvxc {
118
+ .switch__errorMessage_4o6zi {
121
119
  font-size: 14px;
122
120
  line-height: 18px;
123
121
  font-weight: 400;
124
- letter-spacing: -0.08px;
125
- font-family: var(--font-family-alfasans);
122
+ font-family: var(--font-family-system);
126
123
  color: var(--switch-error-color);
127
124
  }
128
- .switch__hint_wlvxc {
125
+ .switch__hint_4o6zi {
129
126
  font-size: 14px;
130
127
  line-height: 18px;
131
128
  font-weight: 400;
132
- letter-spacing: -0.08px;
133
- font-family: var(--font-family-alfasans);
129
+ font-family: var(--font-family-system);
134
130
  display: block;
135
131
  }
136
- .switch__hintWrap_wlvxc.switch__loading_wlvxc {
132
+ .switch__hintWrap_4o6zi.switch__loading_4o6zi {
137
133
  height: var(--gap-10);
138
134
  margin-bottom: var(--gap-4);
139
135
  }
140
- .switch__component_wlvxc.switch__reversed_wlvxc {
136
+ .switch__component_4o6zi.switch__reversed_4o6zi {
141
137
  flex-direction: row-reverse;
142
138
  }
143
- .switch__reversed_wlvxc .switch__content_wlvxc {
139
+ .switch__reversed_4o6zi .switch__content_4o6zi {
144
140
  margin-right: var(--gap-16);
145
141
  margin-left: var(--gap-0);
146
142
  }
147
- .switch__reversed_wlvxc .switch__addons_wlvxc {
143
+ .switch__reversed_4o6zi .switch__addons_4o6zi {
148
144
  margin-left: var(--gap-0);
149
145
  padding-left: var(--gap-0);
150
146
  margin-right: auto;
151
147
  padding-right: var(--gap-16);
152
148
  }
153
- .switch__checked_wlvxc .switch__switch_wlvxc:before {
149
+ .switch__checked_4o6zi .switch__switch_4o6zi:before {
154
150
  transform: translateX(16px);
155
151
  }
156
- .switch__disabled_wlvxc {
152
+ .switch__disabled_4o6zi {
157
153
  cursor: var(--disabled-cursor);
158
154
  }
159
- .switch__focused_wlvxc .switch__switch_wlvxc {
155
+ .switch__focused_4o6zi .switch__switch_4o6zi {
160
156
  outline: 2px solid var(--focus-color);
161
157
  outline-offset: 2px;
162
158
  }
package/index.module.css.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./index.css');
4
4
 
5
- var styles = {"component":"switch__component_wlvxc","start":"switch__start_wlvxc","center":"switch__center_wlvxc","addons":"switch__addons_wlvxc","block":"switch__block_wlvxc","switch":"switch__switch_wlvxc","switchSkeleton":"switch__switchSkeleton_wlvxc","content":"switch__content_wlvxc","label":"switch__label_wlvxc","labelWrap":"switch__labelWrap_wlvxc","loading":"switch__loading_wlvxc","errorMessage":"switch__errorMessage_wlvxc","hint":"switch__hint_wlvxc","hintWrap":"switch__hintWrap_wlvxc","reversed":"switch__reversed_wlvxc","checked":"switch__checked_wlvxc","disabled":"switch__disabled_wlvxc","focused":"switch__focused_wlvxc"};
5
+ var styles = {"component":"switch__component_4o6zi","start":"switch__start_4o6zi","center":"switch__center_4o6zi","addons":"switch__addons_4o6zi","block":"switch__block_4o6zi","switch":"switch__switch_4o6zi","switchSkeleton":"switch__switchSkeleton_4o6zi","content":"switch__content_4o6zi","label":"switch__label_4o6zi","labelWrap":"switch__labelWrap_4o6zi","loading":"switch__loading_4o6zi","errorMessage":"switch__errorMessage_4o6zi","hint":"switch__hint_4o6zi","hintWrap":"switch__hintWrap_4o6zi","reversed":"switch__reversed_4o6zi","checked":"switch__checked_4o6zi","disabled":"switch__disabled_4o6zi","focused":"switch__focused_4o6zi"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=index.module.css.js.map
package/inverted.css CHANGED
@@ -20,36 +20,36 @@
20
20
  --switch-disabled-checked-bg-inverted-color: var(--switch-disabled-bg-inverted-color);
21
21
  --switch-icon-disabled-inverted-color: var(--color-light-neutral-translucent-500-inverted);
22
22
  }
23
- .switch__switch_1bb0b {
23
+ .switch__switch_173y1 {
24
24
  background-color: var(--switch-bg-inverted-color);
25
25
  }
26
- .switch__switch_1bb0b:hover {
26
+ .switch__switch_173y1:hover {
27
27
  background-color: var(--switch-hover-bg-inverted-color);
28
28
  }
29
- .switch__label_1bb0b {
29
+ .switch__label_173y1 {
30
30
  color: var(--switch-label-inverted-color);
31
31
  }
32
- .switch__hint_1bb0b {
32
+ .switch__hint_173y1 {
33
33
  color: var(--switch-hint-inverted-color);
34
34
  }
35
- .switch__checked_1bb0b .switch__switch_1bb0b {
35
+ .switch__checked_173y1 .switch__switch_173y1 {
36
36
  background-color: var(--switch-checked-bg-inverted-color);
37
37
  }
38
- .switch__checked_1bb0b .switch__switch_1bb0b:hover {
38
+ .switch__checked_173y1 .switch__switch_173y1:hover {
39
39
  background-color: var(--switch-checked-hover-bg-inverted-color);
40
40
  }
41
- .switch__disabled_1bb0b .switch__label_1bb0b {
41
+ .switch__disabled_173y1 .switch__label_173y1 {
42
42
  color: var(--switch-disabled-inverted-color);
43
43
  }
44
- .switch__disabled_1bb0b .switch__hint_1bb0b {
44
+ .switch__disabled_173y1 .switch__hint_173y1 {
45
45
  color: var(--switch-disabled-inverted-color);
46
46
  }
47
- .switch__disabled_1bb0b .switch__switch_1bb0b {
47
+ .switch__disabled_173y1 .switch__switch_173y1 {
48
48
  background-color: var(--switch-disabled-bg-inverted-color);
49
49
  }
50
- .switch__disabled_1bb0b .switch__switch_1bb0b:before {
50
+ .switch__disabled_173y1 .switch__switch_173y1:before {
51
51
  background-color: var(--switch-icon-disabled-inverted-color);
52
52
  }
53
- .switch__disabled_1bb0b.switch__checked_1bb0b .switch__switch_1bb0b {
53
+ .switch__disabled_173y1.switch__checked_173y1 .switch__switch_173y1 {
54
54
  background-color: var(--switch-disabled-checked-bg-inverted-color);
55
55
  }
package/inverted.module.css.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./inverted.css');
4
4
 
5
- var invertedStyles = {"switch":"switch__switch_1bb0b","label":"switch__label_1bb0b","hint":"switch__hint_1bb0b","checked":"switch__checked_1bb0b","disabled":"switch__disabled_1bb0b"};
5
+ var invertedStyles = {"switch":"switch__switch_173y1","label":"switch__label_173y1","hint":"switch__hint_173y1","checked":"switch__checked_173y1","disabled":"switch__disabled_173y1"};
6
6
 
7
7
  module.exports = invertedStyles;
8
8
  //# sourceMappingURL=inverted.module.css.js.map
package/modern/default.css CHANGED
@@ -20,36 +20,36 @@
20
20
  --switch-disabled-checked-bg-color: var(--switch-disabled-bg-color);
21
21
  --switch-icon-disabled-color: var(--color-light-neutral-translucent-500);
22
22
  }
23
- .switch__switch_1ehl5 {
23
+ .switch__switch_1iise {
24
24
  background-color: var(--switch-bg-color);
25
25
  }
26
- .switch__switch_1ehl5:hover {
26
+ .switch__switch_1iise:hover {
27
27
  background-color: var(--switch-hover-bg-color);
28
28
  }
29
- .switch__label_1ehl5 {
29
+ .switch__label_1iise {
30
30
  color: var(--switch-label-color);
31
31
  }
32
- .switch__hint_1ehl5 {
32
+ .switch__hint_1iise {
33
33
  color: var(--switch-hint-color);
34
34
  }
35
- .switch__checked_1ehl5 .switch__switch_1ehl5 {
35
+ .switch__checked_1iise .switch__switch_1iise {
36
36
  background-color: var(--switch-checked-bg-color);
37
37
  }
38
- .switch__checked_1ehl5 .switch__switch_1ehl5:hover {
38
+ .switch__checked_1iise .switch__switch_1iise:hover {
39
39
  background-color: var(--switch-checked-hover-bg-color);
40
40
  }
41
- .switch__disabled_1ehl5 .switch__label_1ehl5 {
41
+ .switch__disabled_1iise .switch__label_1iise {
42
42
  color: var(--switch-disabled-color);
43
43
  }
44
- .switch__disabled_1ehl5 .switch__hint_1ehl5 {
44
+ .switch__disabled_1iise .switch__hint_1iise {
45
45
  color: var(--switch-disabled-color);
46
46
  }
47
- .switch__disabled_1ehl5 .switch__switch_1ehl5 {
47
+ .switch__disabled_1iise .switch__switch_1iise {
48
48
  background-color: var(--switch-disabled-bg-color);
49
49
  }
50
- .switch__disabled_1ehl5 .switch__switch_1ehl5:before {
50
+ .switch__disabled_1iise .switch__switch_1iise:before {
51
51
  background-color: var(--switch-icon-disabled-color);
52
52
  }
53
- .switch__disabled_1ehl5.switch__checked_1ehl5 .switch__switch_1ehl5 {
53
+ .switch__disabled_1iise.switch__checked_1iise .switch__switch_1iise {
54
54
  background-color: var(--switch-disabled-checked-bg-color);
55
55
  }
package/modern/default.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './default.css';
2
2
 
3
- const defaultStyles = {"switch":"switch__switch_1ehl5","label":"switch__label_1ehl5","hint":"switch__hint_1ehl5","checked":"switch__checked_1ehl5","disabled":"switch__disabled_1ehl5"};
3
+ const defaultStyles = {"switch":"switch__switch_1iise","label":"switch__label_1iise","hint":"switch__hint_1iise","checked":"switch__checked_1iise","disabled":"switch__disabled_1iise"};
4
4
 
5
5
  export { defaultStyles as default };
6
6
  //# sourceMappingURL=default.module.css.js.map
package/modern/index.css CHANGED
@@ -23,9 +23,8 @@
23
23
  --gap-16: var(--gap-m);
24
24
  }
25
25
  :root {
26
- --font-family-alfasans:
27
- 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
28
- Helvetica, sans-serif;
26
+ --font-family-system:
27
+ system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
29
28
  }
30
29
  :root {
31
30
  --focus-color: var(--color-light-status-info);
@@ -36,7 +35,7 @@
36
35
  --switch-error-color: var(--color-light-text-negative);
37
36
  --switch-icon-color: var(--color-static-neutral-0);
38
37
  }
39
- .switch__component_wlvxc {
38
+ .switch__component_4o6zi {
40
39
  display: inline-flex;
41
40
  align-items: flex-start;
42
41
  margin: var(--gap-0);
@@ -45,25 +44,25 @@
45
44
  cursor: pointer;
46
45
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
47
46
  }
48
- .switch__component_wlvxc input {
47
+ .switch__component_4o6zi input {
49
48
  opacity: 0;
50
49
  position: absolute;
51
50
  }
52
- .switch__start_wlvxc {
51
+ .switch__start_4o6zi {
53
52
  align-items: flex-start;
54
53
  }
55
- .switch__center_wlvxc {
54
+ .switch__center_4o6zi {
56
55
  align-items: center;
57
56
  }
58
- .switch__addons_wlvxc {
57
+ .switch__addons_4o6zi {
59
58
  margin-left: auto;
60
59
  padding-left: var(--gap-16);
61
60
  line-height: 24px;
62
61
  }
63
- .switch__block_wlvxc {
62
+ .switch__block_4o6zi {
64
63
  width: 100%;
65
64
  }
66
- .switch__switch_wlvxc {
65
+ .switch__switch_4o6zi {
67
66
  position: relative;
68
67
  display: block;
69
68
  border-radius: var(--border-radius-16);
@@ -77,12 +76,12 @@
77
76
  border-color 0.2s ease;
78
77
  box-sizing: border-box;
79
78
  }
80
- .switch__switchSkeleton_wlvxc {
79
+ .switch__switchSkeleton_4o6zi {
81
80
  width: 36px;
82
81
  height: 20px;
83
82
  margin: var(--gap-2);
84
83
  }
85
- .switch__switch_wlvxc:before {
84
+ .switch__switch_4o6zi:before {
86
85
  content: '';
87
86
  position: absolute;
88
87
  top: var(--gap-0);
@@ -95,68 +94,65 @@
95
94
  box-sizing: border-box;
96
95
  transition: transform 0.2s ease;
97
96
  }
98
- .switch__content_wlvxc {
97
+ .switch__content_4o6zi {
99
98
  margin-left: var(--gap-12);
100
99
  flex-grow: 1;
101
100
  }
102
- .switch__label_wlvxc {
101
+ .switch__label_4o6zi {
103
102
  font-size: 16px;
104
103
  line-height: 24px;
105
104
  font-weight: 400;
106
- letter-spacing: -0.24px;
107
- font-family: var(--font-family-alfasans);
105
+ font-family: var(--font-family-system);
108
106
  display: block;
109
107
  }
110
- .switch__labelWrap_wlvxc:not(:only-child) {
108
+ .switch__labelWrap_4o6zi:not(:only-child) {
111
109
  margin-bottom: var(--gap-4);
112
110
  }
113
- .switch__labelWrap_wlvxc.switch__loading_wlvxc {
111
+ .switch__labelWrap_4o6zi.switch__loading_4o6zi {
114
112
  height: var(--gap-12);
115
113
  margin: var(--gap-6) 0;
116
114
  }
117
- .switch__labelWrap_wlvxc.switch__loading_wlvxc:not(:only-child) {
115
+ .switch__labelWrap_4o6zi.switch__loading_4o6zi:not(:only-child) {
118
116
  margin-bottom: var(--gap-2s);
119
117
  }
120
- .switch__errorMessage_wlvxc {
118
+ .switch__errorMessage_4o6zi {
121
119
  font-size: 14px;
122
120
  line-height: 18px;
123
121
  font-weight: 400;
124
- letter-spacing: -0.08px;
125
- font-family: var(--font-family-alfasans);
122
+ font-family: var(--font-family-system);
126
123
  color: var(--switch-error-color);
127
124
  }
128
- .switch__hint_wlvxc {
125
+ .switch__hint_4o6zi {
129
126
  font-size: 14px;
130
127
  line-height: 18px;
131
128
  font-weight: 400;
132
- letter-spacing: -0.08px;
133
- font-family: var(--font-family-alfasans);
129
+ font-family: var(--font-family-system);
134
130
  display: block;
135
131
  }
136
- .switch__hintWrap_wlvxc.switch__loading_wlvxc {
132
+ .switch__hintWrap_4o6zi.switch__loading_4o6zi {
137
133
  height: var(--gap-10);
138
134
  margin-bottom: var(--gap-4);
139
135
  }
140
- .switch__component_wlvxc.switch__reversed_wlvxc {
136
+ .switch__component_4o6zi.switch__reversed_4o6zi {
141
137
  flex-direction: row-reverse;
142
138
  }
143
- .switch__reversed_wlvxc .switch__content_wlvxc {
139
+ .switch__reversed_4o6zi .switch__content_4o6zi {
144
140
  margin-right: var(--gap-16);
145
141
  margin-left: var(--gap-0);
146
142
  }
147
- .switch__reversed_wlvxc .switch__addons_wlvxc {
143
+ .switch__reversed_4o6zi .switch__addons_4o6zi {
148
144
  margin-left: var(--gap-0);
149
145
  padding-left: var(--gap-0);
150
146
  margin-right: auto;
151
147
  padding-right: var(--gap-16);
152
148
  }
153
- .switch__checked_wlvxc .switch__switch_wlvxc:before {
149
+ .switch__checked_4o6zi .switch__switch_4o6zi:before {
154
150
  transform: translateX(16px);
155
151
  }
156
- .switch__disabled_wlvxc {
152
+ .switch__disabled_4o6zi {
157
153
  cursor: var(--disabled-cursor);
158
154
  }
159
- .switch__focused_wlvxc .switch__switch_wlvxc {
155
+ .switch__focused_4o6zi .switch__switch_4o6zi {
160
156
  outline: 2px solid var(--focus-color);
161
157
  outline-offset: 2px;
162
158
  }
package/modern/index.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"component":"switch__component_wlvxc","start":"switch__start_wlvxc","center":"switch__center_wlvxc","addons":"switch__addons_wlvxc","block":"switch__block_wlvxc","switch":"switch__switch_wlvxc","switchSkeleton":"switch__switchSkeleton_wlvxc","content":"switch__content_wlvxc","label":"switch__label_wlvxc","labelWrap":"switch__labelWrap_wlvxc","loading":"switch__loading_wlvxc","errorMessage":"switch__errorMessage_wlvxc","hint":"switch__hint_wlvxc","hintWrap":"switch__hintWrap_wlvxc","reversed":"switch__reversed_wlvxc","checked":"switch__checked_wlvxc","disabled":"switch__disabled_wlvxc","focused":"switch__focused_wlvxc"};
3
+ const styles = {"component":"switch__component_4o6zi","start":"switch__start_4o6zi","center":"switch__center_4o6zi","addons":"switch__addons_4o6zi","block":"switch__block_4o6zi","switch":"switch__switch_4o6zi","switchSkeleton":"switch__switchSkeleton_4o6zi","content":"switch__content_4o6zi","label":"switch__label_4o6zi","labelWrap":"switch__labelWrap_4o6zi","loading":"switch__loading_4o6zi","errorMessage":"switch__errorMessage_4o6zi","hint":"switch__hint_4o6zi","hintWrap":"switch__hintWrap_4o6zi","reversed":"switch__reversed_4o6zi","checked":"switch__checked_4o6zi","disabled":"switch__disabled_4o6zi","focused":"switch__focused_4o6zi"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/modern/inverted.css CHANGED
@@ -20,36 +20,36 @@
20
20
  --switch-disabled-checked-bg-inverted-color: var(--switch-disabled-bg-inverted-color);
21
21
  --switch-icon-disabled-inverted-color: var(--color-light-neutral-translucent-500-inverted);
22
22
  }
23
- .switch__switch_1bb0b {
23
+ .switch__switch_173y1 {
24
24
  background-color: var(--switch-bg-inverted-color);
25
25
  }
26
- .switch__switch_1bb0b:hover {
26
+ .switch__switch_173y1:hover {
27
27
  background-color: var(--switch-hover-bg-inverted-color);
28
28
  }
29
- .switch__label_1bb0b {
29
+ .switch__label_173y1 {
30
30
  color: var(--switch-label-inverted-color);
31
31
  }
32
- .switch__hint_1bb0b {
32
+ .switch__hint_173y1 {
33
33
  color: var(--switch-hint-inverted-color);
34
34
  }
35
- .switch__checked_1bb0b .switch__switch_1bb0b {
35
+ .switch__checked_173y1 .switch__switch_173y1 {
36
36
  background-color: var(--switch-checked-bg-inverted-color);
37
37
  }
38
- .switch__checked_1bb0b .switch__switch_1bb0b:hover {
38
+ .switch__checked_173y1 .switch__switch_173y1:hover {
39
39
  background-color: var(--switch-checked-hover-bg-inverted-color);
40
40
  }
41
- .switch__disabled_1bb0b .switch__label_1bb0b {
41
+ .switch__disabled_173y1 .switch__label_173y1 {
42
42
  color: var(--switch-disabled-inverted-color);
43
43
  }
44
- .switch__disabled_1bb0b .switch__hint_1bb0b {
44
+ .switch__disabled_173y1 .switch__hint_173y1 {
45
45
  color: var(--switch-disabled-inverted-color);
46
46
  }
47
- .switch__disabled_1bb0b .switch__switch_1bb0b {
47
+ .switch__disabled_173y1 .switch__switch_173y1 {
48
48
  background-color: var(--switch-disabled-bg-inverted-color);
49
49
  }
50
- .switch__disabled_1bb0b .switch__switch_1bb0b:before {
50
+ .switch__disabled_173y1 .switch__switch_173y1:before {
51
51
  background-color: var(--switch-icon-disabled-inverted-color);
52
52
  }
53
- .switch__disabled_1bb0b.switch__checked_1bb0b .switch__switch_1bb0b {
53
+ .switch__disabled_173y1.switch__checked_173y1 .switch__switch_173y1 {
54
54
  background-color: var(--switch-disabled-checked-bg-inverted-color);
55
55
  }
package/modern/inverted.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './inverted.css';
2
2
 
3
- const invertedStyles = {"switch":"switch__switch_1bb0b","label":"switch__label_1bb0b","hint":"switch__hint_1bb0b","checked":"switch__checked_1bb0b","disabled":"switch__disabled_1bb0b"};
3
+ const invertedStyles = {"switch":"switch__switch_173y1","label":"switch__label_173y1","hint":"switch__hint_173y1","checked":"switch__checked_173y1","disabled":"switch__disabled_173y1"};
4
4
 
5
5
  export { invertedStyles as default };
6
6
  //# sourceMappingURL=inverted.module.css.js.map
package/moderncssm/index.module.css CHANGED
@@ -81,8 +81,7 @@
81
81
  font-size: 16px;
82
82
  line-height: 24px;
83
83
  font-weight: 400;
84
- letter-spacing: -0.24px;
85
- font-family: var(--font-family-alfasans);
84
+ font-family: var(--font-family-system);
86
85
  display: block;
87
86
  }
88
87
 
@@ -103,8 +102,7 @@
103
102
  font-size: 14px;
104
103
  line-height: 18px;
105
104
  font-weight: 400;
106
- letter-spacing: -0.08px;
107
- font-family: var(--font-family-alfasans);
105
+ font-family: var(--font-family-system);
108
106
  color: var(--switch-error-color);
109
107
  }
110
108
 
@@ -112,8 +110,7 @@
112
110
  font-size: 14px;
113
111
  line-height: 18px;
114
112
  font-weight: 400;
115
- letter-spacing: -0.08px;
116
- font-family: var(--font-family-alfasans);
113
+ font-family: var(--font-family-system);
117
114
  display: block;
118
115
  }
119
116
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-switch",
3
- "version": "6.1.4-alfasans",
3
+ "version": "6.1.4",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -13,8 +13,8 @@
13
13
  "build": "rollup -c ../../tools/rollup/rollup.config.mjs --silent"
14
14
  },
15
15
  "dependencies": {
16
- "@alfalab/core-components-shared": "2.2.2-alfasans",
17
- "@alfalab/core-components-skeleton": "7.0.4-alfasans",
16
+ "@alfalab/core-components-shared": "^2.2.2",
17
+ "@alfalab/core-components-skeleton": "^7.0.4",
18
18
  "@alfalab/hooks": "^1.17.0",
19
19
  "classnames": "^2.5.1",
20
20
  "react-merge-refs": "^1.1.0",
@@ -29,6 +29,6 @@
29
29
  "directory": "dist"
30
30
  },
31
31
  "gitHead": "f054fef20200664c65e2501ef1f916c555cdf05d",
32
- "themesVersion": "15.2.0-alfasans",
33
- "varsVersion": "11.1.0-alfasans"
32
+ "themesVersion": "15.2.0",
33
+ "varsVersion": "11.1.0"
34
34
  }