@rescui/switcher 0.6.5 → 0.7.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 (6) hide show
  1. package/lib/index.css +288 -167
  2. package/lib/index.p.module.css.js +13 -14
  3. package/lib/public-api.p.css +185 -0
  4. package/lib/public-api.pcss +185 -0
  5. package/lib/switcher.js +4 -2
  6. package/package.json +8 -7
package/lib/index.css CHANGED
@@ -1,4 +1,211 @@
1
- ._switcher_1vb9327_4{
1
+ ._themeLight_xar5ar_6{
2
+ --rs-theme-dark:0;
3
+ }
4
+ ._themeDark_xar5ar_9{
5
+ --rs-theme-dark:1;
6
+ }
7
+ ._sizeXS_xar5ar_13{
8
+ --_rs-switcher-border-radius:4px;
9
+ --_rs-switcher-option-padding:2px 12px;
10
+ }
11
+ ._sizeXS_xar5ar_13 [data-rs-internal='switcher__option']{
12
+ --_rs-typography-letter-spacing:0.0045em;
13
+ --_rs-typography-text-transform:initial;
14
+ --_rs-typography-font-variant-numeric:initial;
15
+ --_rs-typography-font-family:var(
16
+ --rs-font-family-ui,
17
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
18
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
19
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
20
+ );
21
+ --_rs-typography-font-size:var(--rs-text-3-font-size, 13px);
22
+ --_rs-typography-font-weight:var(
23
+ --rs-font-weight-regular,
24
+ 400
25
+ );
26
+ --_rs-typography-line-height:var(
27
+ --rs-text-3-line-height,
28
+ 20px
29
+ );
30
+ --_rs-typography-base-color:var(
31
+ --_rs-typography-hardness-color,
32
+ var(
33
+ --rs-color-average,
34
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
35
+ )
36
+ );
37
+ --_rs-typography-text-auto-offset:8px;
38
+ --_rs-typography-ul-list-li-padding-left:28px;
39
+ --_rs-typography-ol-list-li-padding-left:21px;
40
+ --_rs-typography-list-li-margin-top-from-text:8px;
41
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
42
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
43
+ --_rs-typography-link-border-bottom-width-from-text:1px;
44
+ }
45
+ ._sizeS_xar5ar_16{
46
+ --_rs-switcher-border-radius:24px;
47
+ --_rs-switcher-option-padding:6px 16px;
48
+ }
49
+ ._sizeS_xar5ar_16 [data-rs-internal='switcher__option']{
50
+ --_rs-typography-letter-spacing:0.0045em;
51
+ --_rs-typography-text-transform:initial;
52
+ --_rs-typography-font-variant-numeric:initial;
53
+ --_rs-typography-font-family:var(
54
+ --rs-font-family-ui,
55
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
56
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
57
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
58
+ );
59
+ --_rs-typography-font-size:var(--rs-text-3-font-size, 13px);
60
+ --_rs-typography-font-weight:var(
61
+ --rs-font-weight-regular,
62
+ 400
63
+ );
64
+ --_rs-typography-line-height:var(
65
+ --rs-text-3-line-height,
66
+ 20px
67
+ );
68
+ --_rs-typography-base-color:var(
69
+ --_rs-typography-hardness-color,
70
+ var(
71
+ --rs-color-average,
72
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
73
+ )
74
+ );
75
+ --_rs-typography-text-auto-offset:8px;
76
+ --_rs-typography-ul-list-li-padding-left:28px;
77
+ --_rs-typography-ol-list-li-padding-left:21px;
78
+ --_rs-typography-list-li-margin-top-from-text:8px;
79
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
80
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
81
+ --_rs-typography-link-border-bottom-width-from-text:1px;
82
+ }
83
+ ._sizeM_xar5ar_19{
84
+ --_rs-switcher-border-radius:24px;
85
+ --_rs-switcher-option-padding:8px 24px;
86
+ }
87
+ ._sizeM_xar5ar_19 [data-rs-internal='switcher__option']{
88
+ --_rs-typography-letter-spacing:0.0015em;
89
+ --_rs-typography-text-transform:initial;
90
+ --_rs-typography-font-variant-numeric:initial;
91
+ --_rs-typography-font-family:var(
92
+ --rs-font-family-ui,
93
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
94
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
95
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
96
+ );
97
+ --_rs-typography-font-size:var(--rs-text-2-font-size, 16px);
98
+ --_rs-typography-font-weight:var(
99
+ --rs-font-weight-regular,
100
+ 400
101
+ );
102
+ --_rs-typography-line-height:var(
103
+ --rs-text-2-line-height,
104
+ 24px
105
+ );
106
+ --_rs-typography-base-color:var(
107
+ --_rs-typography-hardness-color,
108
+ var(
109
+ --rs-color-average,
110
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
111
+ )
112
+ );
113
+ --_rs-typography-text-auto-offset:16px;
114
+ --_rs-typography-ul-list-li-padding-left:22px;
115
+ --_rs-typography-ol-list-li-padding-left:26px;
116
+ --_rs-typography-list-li-margin-top-from-text:16px;
117
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
118
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
119
+ --_rs-typography-link-border-bottom-width-from-text:1px;
120
+ }
121
+ @media screen and (max-width: 640px){
122
+ ._sizeM_xar5ar_19 [data-rs-internal='switcher__option']{
123
+ --_rs-typography-list-li-margin-top-from-text:12px;
124
+ }
125
+ }
126
+ ._sizeL_xar5ar_22{
127
+ --_rs-switcher-border-radius:36px;
128
+ --_rs-switcher-option-padding:12px 32px;
129
+ }
130
+ ._sizeL_xar5ar_22 [data-rs-internal='switcher__option']{
131
+ --_rs-typography-letter-spacing:normal;
132
+ --_rs-typography-text-transform:initial;
133
+ --_rs-typography-font-variant-numeric:initial;
134
+ --_rs-typography-font-family:var(
135
+ --rs-font-family-ui,
136
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
137
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
138
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
139
+ );
140
+ --_rs-typography-font-size:var(--rs-text-1-font-size, 20px);
141
+ --_rs-typography-font-weight:var(
142
+ --rs-font-weight-regular,
143
+ 400
144
+ );
145
+ --_rs-typography-line-height:var(
146
+ --rs-text-1-line-height,
147
+ 28px
148
+ );
149
+ --_rs-typography-base-color:var(
150
+ --_rs-typography-hardness-color,
151
+ var(
152
+ --rs-color-average,
153
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
154
+ )
155
+ );
156
+ --_rs-typography-text-auto-offset:32px;
157
+ --_rs-typography-ul-list-li-padding-left:26px;
158
+ --_rs-typography-ol-list-li-padding-left:32px;
159
+ --_rs-typography-list-li-margin-top-from-text:24px;
160
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
161
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
162
+ --_rs-typography-link-border-bottom-width-from-text:1px;
163
+ }
164
+ @media screen and (max-width: 640px){
165
+ ._sizeL_xar5ar_22 [data-rs-internal='switcher__option']{
166
+ --_rs-typography-list-li-margin-top-from-text:16px;
167
+ }
168
+ }
169
+ ._modeClassic_xar5ar_26{
170
+ --_rs-switcher-option-hover-background:var(--_rs-color-primary-t-fog);
171
+ --_rs-switcher-mark-border-color:var(--_rs-color-primary);
172
+ }
173
+ ._modeRock_xar5ar_29{
174
+ --_rs-switcher-option-hover-background:rgba(
175
+ calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
176
+ 0.1
177
+ );
178
+ --_rs-switcher-mark-border-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
179
+ }
180
+ ._switcher_xar5ar_33{
181
+ --_rs-theme-dark:var(
182
+ --_rs-internal-force-theme-dark-consult-rescui-before-using,
183
+ var(--rs-theme-dark, 0)
184
+ );
185
+ --_rs-theme-flip:var(--rs-theme-flip, 0);
186
+ --_rs-theme-dark-coefficient:calc(var(--_rs-theme-dark)*(1 - var(--_rs-theme-flip)) + var(--_rs-theme-flip)*(1 - var(--_rs-theme-dark)));
187
+ --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
188
+ }
189
+ @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
190
+ ._switcher_xar5ar_33{
191
+ --_rs-color-primary:color-mix(in srgb, var(--rs-color-primary-light-theme, #6B57FF) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dark-theme, #8473FF) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
192
+ --_rs-color-primary-dim:color-mix(in srgb, var(--rs-color-primary-dim-light-theme, #8979ff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dim-dark-theme, #6f61d2) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
193
+ --_rs-color-primary-fog:color-mix(in srgb, var(--rs-color-primary-fog-light-theme, #e1ddff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-fog-dark-theme, #2e2b49) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
194
+ --_rs-color-primary-t-dim:color-mix(in srgb, var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-t-dim-dark-theme, rgba(132, 115, 255,0.8)) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
195
+ --_rs-color-primary-t-fog:color-mix(in srgb, var(--rs-color-primary-t-fog-light-theme, rgba(107, 87, 255,0.2)) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-t-fog-dark-theme, rgba(132, 115, 255,0.3)) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
196
+ }
197
+ }
198
+ @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
199
+ ._switcher_xar5ar_33{
200
+ --_rs-color-primary:rgb(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255);
201
+ --_rs-color-primary-dim:rgb(calc(var(--_rs-theme-light-coefficient, 1)*137 + var(--_rs-theme-dark-coefficient, 0)*111), calc(var(--_rs-theme-light-coefficient, 1)*121 + var(--_rs-theme-dark-coefficient, 0)*97), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*210));
202
+ --_rs-color-primary-fog:rgb(calc(var(--_rs-theme-light-coefficient, 1)*225 + var(--_rs-theme-dark-coefficient, 0)*46), calc(var(--_rs-theme-light-coefficient, 1)*221 + var(--_rs-theme-dark-coefficient, 0)*43), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*73));
203
+ --_rs-color-primary-t-dim:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, 0.8);
204
+ --_rs-color-primary-t-fog:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, calc(var(--_rs-theme-light-coefficient, 1)*0.2 + var(--_rs-theme-dark-coefficient, 0)*0.3));
205
+ }
206
+ }
207
+ ._switcher_xar5ar_33 {
208
+
2
209
  position:relative;
3
210
 
4
211
  display:-webkit-inline-box;
@@ -11,204 +218,118 @@
11
218
 
12
219
  box-sizing:border-box;
13
220
 
14
- border-radius:24px;
221
+ border-radius:var(--_rs-switcher-border-radius);
15
222
 
16
223
  background:transparent;
224
+ -webkit-box-shadow:inset rgba(
225
+ calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
226
+ calc(0.4 + var(--_rs-theme-dark-coefficient)*0.1)
227
+ ) 0 0 0 1px;
228
+ box-shadow:inset rgba(
229
+ calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
230
+ calc(0.4 + var(--_rs-theme-dark-coefficient)*0.1)
231
+ ) 0 0 0 1px;
17
232
  }
18
- ._themeLight_1vb9327_16{
19
- -webkit-box-shadow:inset rgba(25,25,28,0.4) 0 0 0 1px;
20
- box-shadow:inset rgba(25,25,28,0.4) 0 0 0 1px;
21
- }
22
- ._themeDark_1vb9327_20{
23
- -webkit-box-shadow:inset rgba(255,255,255,0.5) 0 0 0 1px;
24
- box-shadow:inset rgba(255,255,255,0.5) 0 0 0 1px;
25
- }
26
- ._sizeL_1vb9327_24{
27
- border-radius:36px;
233
+ ._option_xar5ar_54{
234
+ letter-spacing:var(
235
+ --rs-text-base-letter-spacing,
236
+ var(--_rs-typography-letter-spacing)
237
+ );
238
+ text-transform:var(--_rs-typography-text-transform);
239
+ font-family:var(--_rs-typography-font-family);
240
+ font-size:var(--_rs-typography-font-size);
241
+ font-weight:var(--_rs-typography-font-weight);
242
+ line-height:var(--_rs-typography-line-height);
243
+ font-variant-numeric:var(--_rs-typography-font-variant-numeric);
244
+ -webkit-font-feature-settings:'kern', 'liga', 'calt';
245
+ font-feature-settings:'kern', 'liga', 'calt';
28
246
  }
29
- ._sizeXS_1vb9327_28{
30
- border-radius:4px;
31
- }
32
- ._option_1vb9327_32{
247
+ ._option_xar5ar_54 > p:not(:nth-child(1)),
248
+ ._option_xar5ar_54 > pre:not(:nth-child(1)){
249
+ padding-top:var(--_rs-typography-auto-offset-or-initial);
250
+ }
251
+ ._option_xar5ar_54 {
252
+ --_rs-typography-hardness-color:var(
253
+ --rs-color-hard,
254
+ rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227))
255
+ );
256
+
33
257
  position:relative;
258
+ z-index:1;
34
259
 
260
+ display:inline-block;
35
261
  -webkit-box-flex:1;
262
+ -ms-flex:1 1 auto;
263
+ flex:1 1 auto;
36
264
 
37
- -ms-flex:1 0 auto;
38
-
39
- flex:1 0 auto;
40
- -webkit-appearance:none;
41
- -moz-appearance:none;
42
- appearance:none;
43
- border:none;
44
-
45
- z-index:1;
46
- display:inline-block;
47
265
  -webkit-box-sizing:border-box;
266
+
48
267
  box-sizing:border-box;
49
- cursor:pointer;
50
268
  margin:0;
269
+ padding:var(--_rs-switcher-option-padding);
51
270
 
52
- border-radius:24px;
53
-
271
+ border:none;
272
+ border-radius:var(--_rs-switcher-border-radius);
54
273
  outline:none;
55
274
 
275
+ cursor:pointer;
276
+
277
+ color:var(--_rs-typography-hardness-color);
56
278
  background:transparent;
279
+ -webkit-appearance:none;
280
+ -moz-appearance:none;
281
+ appearance:none;
57
282
  }
58
- ._sizeL_1vb9327_24 ._option_1vb9327_32{
59
- padding:12px 32px;
60
- letter-spacing:normal;
61
- font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
62
- font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
63
- -webkit-font-feature-settings:"kern", "liga", "calt";
64
- font-feature-settings:"kern", "liga", "calt";
65
- font-size:20px;
66
- font-size:var(--rs-text-1-font-size, 20px);
67
- font-weight:normal;
68
- line-height:28px;
69
- line-height:var(--rs-text-1-line-height, 28px);
70
- border-radius:36px;
71
- }
72
- ._sizeM_1vb9327_57 ._option_1vb9327_32{
73
- padding:8px 24px;
74
- letter-spacing:0.0015em;
75
- font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
76
- font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
77
- -webkit-font-feature-settings:"kern", "liga", "calt";
78
- font-feature-settings:"kern", "liga", "calt";
79
- font-size:16px;
80
- font-size:var(--rs-text-2-font-size, 16px);
81
- font-weight:400;
82
- line-height:24px;
83
- line-height:var(--rs-text-2-line-height, 24px);
84
- }
85
- ._rs-reset-letter-spacing_1vb9327_1 ._sizeM_1vb9327_57 ._option_1vb9327_32{
86
- letter-spacing:normal;
87
- }
88
- ._sizeS_1vb9327_62 ._option_1vb9327_32{
89
- padding:6px 16px;
90
- letter-spacing:0.0045em;
91
- font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
92
- font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
93
- -webkit-font-feature-settings:"kern", "liga", "calt";
94
- font-feature-settings:"kern", "liga", "calt";
95
- font-size:13px;
96
- font-size:var(--rs-text-3-font-size, 13px);
97
- line-height:20px;
98
- line-height:var(--rs-text-3-line-height, 20px);
99
- }
100
- ._rs-reset-letter-spacing_1vb9327_1 ._sizeS_1vb9327_62 ._option_1vb9327_32{
101
- letter-spacing:normal;
102
- }
103
- ._sizeXS_1vb9327_28 ._option_1vb9327_32{
104
- padding:2px 12px;
105
- letter-spacing:0.0045em;
106
- font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
107
- font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
108
- -webkit-font-feature-settings:"kern", "liga", "calt";
109
- font-feature-settings:"kern", "liga", "calt";
110
- font-size:13px;
111
- font-size:var(--rs-text-3-font-size, 13px);
112
- line-height:20px;
113
- line-height:var(--rs-text-3-line-height, 20px);
114
- }
115
- ._rs-reset-letter-spacing_1vb9327_1 ._sizeXS_1vb9327_28 ._option_1vb9327_32{
116
- letter-spacing:normal;
117
- }
118
- ._sizeXS_1vb9327_28 ._option_1vb9327_32 {
119
- border-radius:4px;
120
- }
121
- ._disabled_1vb9327_73 ._option_1vb9327_32{
283
+ ._disabled_xar5ar_78 ._option_xar5ar_54{
122
284
  cursor:not-allowed;
123
285
  pointer-events:none;
124
286
  }
125
- ._themeLight_1vb9327_16 ._option_1vb9327_32{
126
- color:#19191C;
127
- }
128
- ._themeLight_1vb9327_16 ._option_1vb9327_32:focus[data-focus-method='key']{
129
- -webkit-box-shadow:rgba(107, 87, 255, 0.8) 0 0 0 4px;
130
- -webkit-box-shadow:var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) 0 0 0 4px;
131
- box-shadow:rgba(107, 87, 255, 0.8) 0 0 0 4px;
132
- box-shadow:var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) 0 0 0 4px;
133
- }
134
- ._themeLight_1vb9327_16 ._option_1vb9327_32._selected_1vb9327_86:hover,
135
- ._themeLight_1vb9327_16 ._option_1vb9327_32._selected_1vb9327_86:active{
136
- background:transparent;
137
- cursor:default;
138
- }
139
- ._themeLight_1vb9327_16._modeClassic_1vb9327_95 ._option_1vb9327_32:hover{
140
- background:rgba(107, 87, 255,0.2);
141
- background:var(--rs-color-primary-t-fog-light-theme, rgba(107, 87, 255,0.2));
142
- }
143
- ._themeLight_1vb9327_16._modeRock_1vb9327_101 ._option_1vb9327_32:hover{
144
- background:rgba(25,25,28,0.1);
145
- }
146
- ._disabled_1vb9327_73._themeLight_1vb9327_16 ._option_1vb9327_32,
147
- ._disabled_1vb9327_73._themeLight_1vb9327_16 ._option_1vb9327_32._selected_1vb9327_86{
148
- color:rgba(25,25,28,0.4);
149
- }
150
- ._themeDark_1vb9327_20 ._option_1vb9327_32{
151
- color:#FFFFFF;
152
- }
153
- ._themeDark_1vb9327_20 ._option_1vb9327_32:hover{
154
- background:rgba(255,255,255,0.1);
287
+ ._option_xar5ar_54:focus[data-focus-method='key']{
288
+ -webkit-box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
289
+ box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
155
290
  }
156
- ._themeDark_1vb9327_20 ._option_1vb9327_32:focus[data-focus-method='key']{
157
- -webkit-box-shadow:rgba(132, 115, 255,0.8) 0 0 0 4px;
158
- -webkit-box-shadow:var(--rs-color-primary-t-dim-dark-theme, rgba(132, 115, 255,0.8)) 0 0 0 4px;
159
- box-shadow:rgba(132, 115, 255,0.8) 0 0 0 4px;
160
- box-shadow:var(--rs-color-primary-t-dim-dark-theme, rgba(132, 115, 255,0.8)) 0 0 0 4px;
291
+ ._option_xar5ar_54:hover{
292
+ background:var(--_rs-switcher-option-hover-background);
161
293
  }
162
- ._themeDark_1vb9327_20 ._option_1vb9327_32._selected_1vb9327_86:hover,
163
- ._themeDark_1vb9327_20 ._option_1vb9327_32._selected_1vb9327_86:active{
294
+ ._option_xar5ar_54._selected_xar5ar_91:active{
164
295
  background:transparent;
296
+ }
297
+ ._option_xar5ar_54._selected_xar5ar_91:hover,
298
+ ._option_xar5ar_54._selected_xar5ar_91:active{
165
299
  cursor:default;
166
300
  }
167
- ._themeDark_1vb9327_20._modeClassic_1vb9327_95 ._option_1vb9327_32:hover{
168
- background:rgba(132, 115, 255,0.3);
169
- background:var(--rs-color-primary-t-fog-dark-theme, rgba(132, 115, 255,0.3));
170
- }
171
- ._themeDark_1vb9327_20._modeRock_1vb9327_101 ._option_1vb9327_32:hover{
172
- background:rgba(255,255,255,0.1);
301
+ ._disabled_xar5ar_78 ._option_xar5ar_54,
302
+ ._disabled_xar5ar_78 ._option_xar5ar_54._selected_xar5ar_91{
303
+ cursor:default;
304
+
305
+ color:rgba(
306
+ calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
307
+ calc(0.4 - var(--_rs-theme-dark-coefficient)*0.2)
308
+ );
309
+ background:transparent;
173
310
  }
174
- ._disabled_1vb9327_73._themeDark_1vb9327_20 ._option_1vb9327_32,
175
- ._disabled_1vb9327_73._themeDark_1vb9327_20 ._option_1vb9327_32._selected_1vb9327_86{
176
- color:rgba(255,255,255,0.2);
177
- }
178
- ._mark_1vb9327_149{
311
+ ._mark_xar5ar_113{
179
312
  position:absolute;
180
313
  top:0;
181
314
  bottom:0;
315
+
182
316
  display:inline-block;
317
+
183
318
  -webkit-box-sizing:border-box;
319
+
184
320
  box-sizing:border-box;
185
- border-radius:24px;
321
+
322
+ border:solid 2px var(--_rs-switcher-mark-border-color);
323
+
324
+ border-radius:var(--_rs-switcher-border-radius);
325
+
186
326
  -webkit-transition:all 0.2s;
327
+
187
328
  transition:all 0.2s;
188
329
  }
189
- ._themeLight_1vb9327_16._modeClassic_1vb9327_95 ._mark_1vb9327_149{
190
- border:solid 2px #6B57FF;
191
- border:solid 2px var(--rs-color-primary-light-theme, #6B57FF);
192
- }
193
- ._themeDark_1vb9327_20._modeClassic_1vb9327_95 ._mark_1vb9327_149{
194
- border:solid 2px #8473FF;
195
- border:solid 2px var(--rs-color-primary-dark-theme, #8473FF);
196
- }
197
- ._themeLight_1vb9327_16._modeRock_1vb9327_101 ._mark_1vb9327_149{
198
- border:solid 2px #19191C;
199
- }
200
- ._themeDark_1vb9327_20._modeRock_1vb9327_101 ._mark_1vb9327_149{
201
- border:solid 2px #FFFFFF;
202
- }
203
- ._sizeL_1vb9327_24 ._mark_1vb9327_149{
204
- border-radius:36px;
205
- }
206
- ._sizeXS_1vb9327_28 ._mark_1vb9327_149{
207
- border-radius:4px;
208
- }
209
- ._themeLight_1vb9327_16._disabled_1vb9327_73 ._mark_1vb9327_149{
210
- border:solid 2px rgba(25,25,28,0.4);
211
- }
212
- ._themeDark_1vb9327_20._disabled_1vb9327_73 ._mark_1vb9327_149{
213
- border:solid 2px rgba(255,255,255,0.2);
330
+ ._disabled_xar5ar_78 ._mark_xar5ar_113{
331
+ border:solid 2px rgba(
332
+ calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
333
+ calc(0.4 - var(--_rs-theme-dark-coefficient)*0.2)
334
+ );
214
335
  }
package/lib/index.p.module.css.js CHANGED
@@ -1,17 +1,16 @@
1
1
  var styles = {
2
- "switcher": "_switcher_1vb9327_4",
3
- "themeLight": "_themeLight_1vb9327_16",
4
- "themeDark": "_themeDark_1vb9327_20",
5
- "sizeL": "_sizeL_1vb9327_24",
6
- "sizeXS": "_sizeXS_1vb9327_28",
7
- "option": "_option_1vb9327_32",
8
- "sizeM": "_sizeM_1vb9327_57",
9
- "rs-reset-letter-spacing": "_rs-reset-letter-spacing_1vb9327_1",
10
- "sizeS": "_sizeS_1vb9327_62",
11
- "disabled": "_disabled_1vb9327_73",
12
- "selected": "_selected_1vb9327_86",
13
- "modeClassic": "_modeClassic_1vb9327_95",
14
- "modeRock": "_modeRock_1vb9327_101",
15
- "mark": "_mark_1vb9327_149"
2
+ "themeLight": "_themeLight_xar5ar_6",
3
+ "themeDark": "_themeDark_xar5ar_9",
4
+ "sizeXS": "_sizeXS_xar5ar_13",
5
+ "sizeS": "_sizeS_xar5ar_16",
6
+ "sizeM": "_sizeM_xar5ar_19",
7
+ "sizeL": "_sizeL_xar5ar_22",
8
+ "modeClassic": "_modeClassic_xar5ar_26",
9
+ "modeRock": "_modeRock_xar5ar_29",
10
+ "switcher": "_switcher_xar5ar_33",
11
+ "option": "_option_xar5ar_54",
12
+ "disabled": "_disabled_xar5ar_78",
13
+ "selected": "_selected_xar5ar_91",
14
+ "mark": "_mark_xar5ar_113"
16
15
  };
17
16
  export { styles as default };
package/lib/public-api.p.css ADDED
@@ -0,0 +1,185 @@
1
+ @define-mixin rs-switcher-size-xs{
2
+ &:not(html){
3
+ --_rs-switcher-border-radius:4px;
4
+ --_rs-switcher-option-padding:2px 12px;
5
+ }
6
+ &:not(html) [data-rs-internal='switcher__option']{
7
+ --_rs-typography-letter-spacing:0.0045em;
8
+ --_rs-typography-text-transform:initial;
9
+ --_rs-typography-font-variant-numeric:initial;
10
+ --_rs-typography-font-family:var(
11
+ --rs-font-family-ui,
12
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
13
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
14
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
15
+ );
16
+ --_rs-typography-font-size:var(--rs-text-3-font-size, 13px);
17
+ --_rs-typography-font-weight:var(
18
+ --rs-font-weight-regular,
19
+ 400
20
+ );
21
+ --_rs-typography-line-height:var(
22
+ --rs-text-3-line-height,
23
+ 20px
24
+ );
25
+ --_rs-typography-base-color:var(
26
+ --_rs-typography-hardness-color,
27
+ var(
28
+ --rs-color-average,
29
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
30
+ )
31
+ );
32
+ --_rs-typography-text-auto-offset:8px;
33
+ --_rs-typography-ul-list-li-padding-left:28px;
34
+ --_rs-typography-ol-list-li-padding-left:21px;
35
+ --_rs-typography-list-li-margin-top-from-text:8px;
36
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
37
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
38
+ --_rs-typography-link-border-bottom-width-from-text:1px;
39
+ }
40
+ }
41
+ @define-mixin rs-switcher-size-s{
42
+ &:not(html){
43
+ --_rs-switcher-border-radius:24px;
44
+ --_rs-switcher-option-padding:6px 16px;
45
+ }
46
+ &:not(html) [data-rs-internal='switcher__option']{
47
+ --_rs-typography-letter-spacing:0.0045em;
48
+ --_rs-typography-text-transform:initial;
49
+ --_rs-typography-font-variant-numeric:initial;
50
+ --_rs-typography-font-family:var(
51
+ --rs-font-family-ui,
52
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
53
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
54
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
55
+ );
56
+ --_rs-typography-font-size:var(--rs-text-3-font-size, 13px);
57
+ --_rs-typography-font-weight:var(
58
+ --rs-font-weight-regular,
59
+ 400
60
+ );
61
+ --_rs-typography-line-height:var(
62
+ --rs-text-3-line-height,
63
+ 20px
64
+ );
65
+ --_rs-typography-base-color:var(
66
+ --_rs-typography-hardness-color,
67
+ var(
68
+ --rs-color-average,
69
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
70
+ )
71
+ );
72
+ --_rs-typography-text-auto-offset:8px;
73
+ --_rs-typography-ul-list-li-padding-left:28px;
74
+ --_rs-typography-ol-list-li-padding-left:21px;
75
+ --_rs-typography-list-li-margin-top-from-text:8px;
76
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
77
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
78
+ --_rs-typography-link-border-bottom-width-from-text:1px;
79
+ }
80
+ }
81
+ @define-mixin rs-switcher-size-m{
82
+ &:not(html){
83
+ --_rs-switcher-border-radius:24px;
84
+ --_rs-switcher-option-padding:8px 24px;
85
+ }
86
+ &:not(html) [data-rs-internal='switcher__option']{
87
+ --_rs-typography-letter-spacing:0.0015em;
88
+ --_rs-typography-text-transform:initial;
89
+ --_rs-typography-font-variant-numeric:initial;
90
+ --_rs-typography-font-family:var(
91
+ --rs-font-family-ui,
92
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
93
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
94
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
95
+ );
96
+ --_rs-typography-font-size:var(--rs-text-2-font-size, 16px);
97
+ --_rs-typography-font-weight:var(
98
+ --rs-font-weight-regular,
99
+ 400
100
+ );
101
+ --_rs-typography-line-height:var(
102
+ --rs-text-2-line-height,
103
+ 24px
104
+ );
105
+ --_rs-typography-base-color:var(
106
+ --_rs-typography-hardness-color,
107
+ var(
108
+ --rs-color-average,
109
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
110
+ )
111
+ );
112
+ --_rs-typography-text-auto-offset:16px;
113
+ --_rs-typography-ul-list-li-padding-left:22px;
114
+ --_rs-typography-ol-list-li-padding-left:26px;
115
+ --_rs-typography-list-li-margin-top-from-text:16px;
116
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
117
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
118
+ --_rs-typography-link-border-bottom-width-from-text:1px;
119
+ }
120
+ @media screen and (max-width: 640px){
121
+ &:not(html) [data-rs-internal='switcher__option']{
122
+ --_rs-typography-list-li-margin-top-from-text:12px;
123
+ }
124
+ }
125
+ }
126
+ @define-mixin rs-switcher-size-l{
127
+ &:not(html){
128
+ --_rs-switcher-border-radius:36px;
129
+ --_rs-switcher-option-padding:12px 32px;
130
+ }
131
+ &:not(html) [data-rs-internal='switcher__option']{
132
+ --_rs-typography-letter-spacing:normal;
133
+ --_rs-typography-text-transform:initial;
134
+ --_rs-typography-font-variant-numeric:initial;
135
+ --_rs-typography-font-family:var(
136
+ --rs-font-family-ui,
137
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
138
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
139
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
140
+ );
141
+ --_rs-typography-font-size:var(--rs-text-1-font-size, 20px);
142
+ --_rs-typography-font-weight:var(
143
+ --rs-font-weight-regular,
144
+ 400
145
+ );
146
+ --_rs-typography-line-height:var(
147
+ --rs-text-1-line-height,
148
+ 28px
149
+ );
150
+ --_rs-typography-base-color:var(
151
+ --_rs-typography-hardness-color,
152
+ var(
153
+ --rs-color-average,
154
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
155
+ )
156
+ );
157
+ --_rs-typography-text-auto-offset:32px;
158
+ --_rs-typography-ul-list-li-padding-left:26px;
159
+ --_rs-typography-ol-list-li-padding-left:32px;
160
+ --_rs-typography-list-li-margin-top-from-text:24px;
161
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
162
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
163
+ --_rs-typography-link-border-bottom-width-from-text:1px;
164
+ }
165
+ @media screen and (max-width: 640px){
166
+ &:not(html) [data-rs-internal='switcher__option']{
167
+ --_rs-typography-list-li-margin-top-from-text:16px;
168
+ }
169
+ }
170
+ }
171
+ @define-mixin rs-switcher-mode-classic{
172
+ &:not(html){
173
+ --_rs-switcher-option-hover-background:var(--_rs-color-primary-t-fog);
174
+ --_rs-switcher-mark-border-color:var(--_rs-color-primary);
175
+ }
176
+ }
177
+ @define-mixin rs-switcher-mode-rock{
178
+ &:not(html){
179
+ --_rs-switcher-option-hover-background:rgba(
180
+ calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
181
+ 0.1
182
+ );
183
+ --_rs-switcher-mark-border-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
184
+ }
185
+ }
package/lib/public-api.pcss ADDED
@@ -0,0 +1,185 @@
1
+ @define-mixin rs-switcher-size-xs{
2
+ &:not(html){
3
+ --_rs-switcher-border-radius:4px;
4
+ --_rs-switcher-option-padding:2px 12px;
5
+ }
6
+ &:not(html) [data-rs-internal='switcher__option']{
7
+ --_rs-typography-letter-spacing:0.0045em;
8
+ --_rs-typography-text-transform:initial;
9
+ --_rs-typography-font-variant-numeric:initial;
10
+ --_rs-typography-font-family:var(
11
+ --rs-font-family-ui,
12
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
13
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
14
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
15
+ );
16
+ --_rs-typography-font-size:var(--rs-text-3-font-size, 13px);
17
+ --_rs-typography-font-weight:var(
18
+ --rs-font-weight-regular,
19
+ 400
20
+ );
21
+ --_rs-typography-line-height:var(
22
+ --rs-text-3-line-height,
23
+ 20px
24
+ );
25
+ --_rs-typography-base-color:var(
26
+ --_rs-typography-hardness-color,
27
+ var(
28
+ --rs-color-average,
29
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
30
+ )
31
+ );
32
+ --_rs-typography-text-auto-offset:8px;
33
+ --_rs-typography-ul-list-li-padding-left:28px;
34
+ --_rs-typography-ol-list-li-padding-left:21px;
35
+ --_rs-typography-list-li-margin-top-from-text:8px;
36
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
37
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
38
+ --_rs-typography-link-border-bottom-width-from-text:1px;
39
+ }
40
+ }
41
+ @define-mixin rs-switcher-size-s{
42
+ &:not(html){
43
+ --_rs-switcher-border-radius:24px;
44
+ --_rs-switcher-option-padding:6px 16px;
45
+ }
46
+ &:not(html) [data-rs-internal='switcher__option']{
47
+ --_rs-typography-letter-spacing:0.0045em;
48
+ --_rs-typography-text-transform:initial;
49
+ --_rs-typography-font-variant-numeric:initial;
50
+ --_rs-typography-font-family:var(
51
+ --rs-font-family-ui,
52
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
53
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
54
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
55
+ );
56
+ --_rs-typography-font-size:var(--rs-text-3-font-size, 13px);
57
+ --_rs-typography-font-weight:var(
58
+ --rs-font-weight-regular,
59
+ 400
60
+ );
61
+ --_rs-typography-line-height:var(
62
+ --rs-text-3-line-height,
63
+ 20px
64
+ );
65
+ --_rs-typography-base-color:var(
66
+ --_rs-typography-hardness-color,
67
+ var(
68
+ --rs-color-average,
69
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
70
+ )
71
+ );
72
+ --_rs-typography-text-auto-offset:8px;
73
+ --_rs-typography-ul-list-li-padding-left:28px;
74
+ --_rs-typography-ol-list-li-padding-left:21px;
75
+ --_rs-typography-list-li-margin-top-from-text:8px;
76
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
77
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
78
+ --_rs-typography-link-border-bottom-width-from-text:1px;
79
+ }
80
+ }
81
+ @define-mixin rs-switcher-size-m{
82
+ &:not(html){
83
+ --_rs-switcher-border-radius:24px;
84
+ --_rs-switcher-option-padding:8px 24px;
85
+ }
86
+ &:not(html) [data-rs-internal='switcher__option']{
87
+ --_rs-typography-letter-spacing:0.0015em;
88
+ --_rs-typography-text-transform:initial;
89
+ --_rs-typography-font-variant-numeric:initial;
90
+ --_rs-typography-font-family:var(
91
+ --rs-font-family-ui,
92
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
93
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
94
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
95
+ );
96
+ --_rs-typography-font-size:var(--rs-text-2-font-size, 16px);
97
+ --_rs-typography-font-weight:var(
98
+ --rs-font-weight-regular,
99
+ 400
100
+ );
101
+ --_rs-typography-line-height:var(
102
+ --rs-text-2-line-height,
103
+ 24px
104
+ );
105
+ --_rs-typography-base-color:var(
106
+ --_rs-typography-hardness-color,
107
+ var(
108
+ --rs-color-average,
109
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
110
+ )
111
+ );
112
+ --_rs-typography-text-auto-offset:16px;
113
+ --_rs-typography-ul-list-li-padding-left:22px;
114
+ --_rs-typography-ol-list-li-padding-left:26px;
115
+ --_rs-typography-list-li-margin-top-from-text:16px;
116
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
117
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
118
+ --_rs-typography-link-border-bottom-width-from-text:1px;
119
+ }
120
+ @media screen and (max-width: 640px){
121
+ &:not(html) [data-rs-internal='switcher__option']{
122
+ --_rs-typography-list-li-margin-top-from-text:12px;
123
+ }
124
+ }
125
+ }
126
+ @define-mixin rs-switcher-size-l{
127
+ &:not(html){
128
+ --_rs-switcher-border-radius:36px;
129
+ --_rs-switcher-option-padding:12px 32px;
130
+ }
131
+ &:not(html) [data-rs-internal='switcher__option']{
132
+ --_rs-typography-letter-spacing:normal;
133
+ --_rs-typography-text-transform:initial;
134
+ --_rs-typography-font-variant-numeric:initial;
135
+ --_rs-typography-font-family:var(
136
+ --rs-font-family-ui,
137
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
138
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
139
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
140
+ );
141
+ --_rs-typography-font-size:var(--rs-text-1-font-size, 20px);
142
+ --_rs-typography-font-weight:var(
143
+ --rs-font-weight-regular,
144
+ 400
145
+ );
146
+ --_rs-typography-line-height:var(
147
+ --rs-text-1-line-height,
148
+ 28px
149
+ );
150
+ --_rs-typography-base-color:var(
151
+ --_rs-typography-hardness-color,
152
+ var(
153
+ --rs-color-average,
154
+ rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7)
155
+ )
156
+ );
157
+ --_rs-typography-text-auto-offset:32px;
158
+ --_rs-typography-ul-list-li-padding-left:26px;
159
+ --_rs-typography-ol-list-li-padding-left:32px;
160
+ --_rs-typography-list-li-margin-top-from-text:24px;
161
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
162
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
163
+ --_rs-typography-link-border-bottom-width-from-text:1px;
164
+ }
165
+ @media screen and (max-width: 640px){
166
+ &:not(html) [data-rs-internal='switcher__option']{
167
+ --_rs-typography-list-li-margin-top-from-text:16px;
168
+ }
169
+ }
170
+ }
171
+ @define-mixin rs-switcher-mode-classic{
172
+ &:not(html){
173
+ --_rs-switcher-option-hover-background:var(--_rs-color-primary-t-fog);
174
+ --_rs-switcher-mark-border-color:var(--_rs-color-primary);
175
+ }
176
+ }
177
+ @define-mixin rs-switcher-mode-rock{
178
+ &:not(html){
179
+ --_rs-switcher-option-hover-background:rgba(
180
+ calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
181
+ 0.1
182
+ );
183
+ --_rs-switcher-mark-border-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
184
+ }
185
+ }
package/lib/switcher.js CHANGED
@@ -6,7 +6,7 @@ import "core-js/modules/es.object.to-string.js";
6
6
  import React, { useRef, useMemo, useCallback, useState, useEffect } from 'react';
7
7
  import PropTypes from 'prop-types';
8
8
  import cn from 'classnames';
9
- import { useTheme } from '@rescui/ui-contexts';
9
+ import { useThemeWithUndefined } from '@rescui/ui-contexts';
10
10
  import { useResizeObserver } from '@rescui/use-resize-observer';
11
11
  import styles from './index.p.module.css.js';
12
12
  var sizeToClass = {
@@ -51,6 +51,7 @@ var optionRenderer = function optionRenderer(_ref, ref) {
51
51
  ref: ref,
52
52
  onClick: onClick,
53
53
  type: "button",
54
+ "data-rs-internal": 'switcher__option',
54
55
  disabled: disabled,
55
56
  className: cn(styles.option, selected && styles.selected)
56
57
  }, label);
@@ -72,7 +73,7 @@ function Switcher(_ref2) {
72
73
  onChange = _ref2.onChange;
73
74
  var refsArray = useRef([]);
74
75
  var containerRef = useRef(null);
75
- var theme = useTheme(themeFromProps);
76
+ var theme = useThemeWithUndefined(themeFromProps);
76
77
  var optionsHash = hashOptions(options); // eslint-disable-next-line react-hooks/exhaustive-deps
77
78
 
78
79
  var memoizedOptions = useMemo(function () {
@@ -124,6 +125,7 @@ function Switcher(_ref2) {
124
125
  className: cn(className, styles.switcher, sizeToClass[size], themeToClass[theme], modeToClass[mode], disabled && styles.disabled),
125
126
  "data-e2e": e2eId,
126
127
  ref: containerRef,
128
+ "data-rs-internal": 'switcher',
127
129
  "data-test": "switcher".concat(disabled ? '-disabled' : '')
128
130
  }, _mapInstanceProperty(memoizedOptions).call(memoizedOptions, function (_ref3, index) {
129
131
  var value = _ref3.value,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/switcher",
3
- "version": "0.6.5",
3
+ "version": "0.7.0",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -16,7 +16,7 @@
16
16
  },
17
17
  "dependencies": {
18
18
  "@babel/runtime-corejs3": "^7.14.0",
19
- "@rescui/use-resize-observer": "^0.1.7",
19
+ "@rescui/use-resize-observer": "^0.2.0",
20
20
  "classnames": "^2.2.6",
21
21
  "core-js": "^3.9.1"
22
22
  },
@@ -26,12 +26,13 @@
26
26
  "react": ">=16.8.0 <19"
27
27
  },
28
28
  "devDependencies": {
29
- "@rescui/colors": "^0.1.11",
30
- "@rescui/scripts": "^0.2.3",
31
- "@rescui/typography": "^0.15.0"
29
+ "@rescui/colors": "^0.2.0",
30
+ "@rescui/scripts": "^0.3.0",
31
+ "@rescui/typography": "^0.16.0"
32
32
  },
33
33
  "scripts": {
34
- "build": "rescui-scripts build"
34
+ "build": "rescui-scripts build && yarn run build-pcss-api",
35
+ "build-pcss-api": "rescui-scripts build-pcss-api --file public-api.p.css"
35
36
  },
36
- "gitHead": "e21b6f80037993b094ceaff022db6d4cd176a88d"
37
+ "gitHead": "51da8a7188f4c558c563065a4ff4ef5c8e74994c"
37
38
  }