@rescui/tab-list 0.18.3-RUI-297-Add-react-compiler-to-the-packages-build-dbbefd7b8.10 → 0.18.3-RUI-297-Add-react-compiler-to-the-packages-build-8aaaed4be.39
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/_virtual/index.css.js +12 -12
- package/lib/_virtual/left-outline.js +294 -63
- package/lib/_virtual/right-outline.js +294 -63
- package/lib/index.css +94 -79
- package/lib/parts/separator.p.module.css.js +3 -3
- package/lib/parts/tab-list-context.js +3 -1
- package/lib/parts/tab-list.p.module.css.js +25 -25
- package/lib/parts/tab-separator.js +30 -6
- package/lib/parts/tab.js +191 -47
- package/lib/parts/use-indicator.d.ts +3 -4
- package/lib/parts/use-indicator.js +131 -47
- package/lib/parts/use-roving-tab-index.js +58 -28
- package/lib/parts/use-scrollable-list.d.ts +2 -2
- package/lib/parts/use-scrollable-list.js +277 -129
- package/lib/public-api.p.css +5 -0
- package/lib/public-api.pcss +5 -0
- package/lib/tab-list.d.ts +1 -1
- package/lib/tab-list.js +378 -82
- package/package.json +9 -8
package/lib/index.css
CHANGED
|
@@ -1,4 +1,9 @@
|
|
|
1
|
-
|
|
1
|
+
@property --_rs-theme-dark-coefficient{
|
|
2
|
+
syntax:'<number>';
|
|
3
|
+
inherits:true;
|
|
4
|
+
initial-value:0;
|
|
5
|
+
}
|
|
6
|
+
._icon_wwfcil_4{
|
|
2
7
|
--_rs-theme-dark:var(
|
|
3
8
|
--_rs-internal-force-theme-dark-consult-rescui-before-using,
|
|
4
9
|
var(--rs-theme-dark, 0)
|
|
@@ -8,7 +13,7 @@
|
|
|
8
13
|
--_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
|
|
9
14
|
}
|
|
10
15
|
@supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
|
|
11
|
-
.
|
|
16
|
+
._icon_wwfcil_4{
|
|
12
17
|
--_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)));
|
|
13
18
|
--_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)));
|
|
14
19
|
--_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)));
|
|
@@ -17,7 +22,7 @@
|
|
|
17
22
|
}
|
|
18
23
|
}
|
|
19
24
|
@supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
|
|
20
|
-
.
|
|
25
|
+
._icon_wwfcil_4{
|
|
21
26
|
--_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);
|
|
22
27
|
--_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));
|
|
23
28
|
--_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));
|
|
@@ -25,30 +30,30 @@
|
|
|
25
30
|
--_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));
|
|
26
31
|
}
|
|
27
32
|
}
|
|
28
|
-
.
|
|
33
|
+
._icon_wwfcil_4{
|
|
29
34
|
|
|
30
35
|
fill:var(--_rs-icons-themed-fill-or-initial, currentcolor);
|
|
31
36
|
|
|
32
37
|
width:var(--rs-icons-width, auto);
|
|
33
38
|
height:var(--rs-icons-height, var(--_rs-icons-height));
|
|
34
39
|
}
|
|
35
|
-
.
|
|
40
|
+
._sizeXS_wwfcil_14{
|
|
36
41
|
--_rs-icons-height:16px;
|
|
37
42
|
}
|
|
38
|
-
.
|
|
43
|
+
._sizeS_wwfcil_18{
|
|
39
44
|
--_rs-icons-height:20px;
|
|
40
45
|
}
|
|
41
|
-
.
|
|
46
|
+
._sizeM_wwfcil_22{
|
|
42
47
|
--_rs-icons-height:24px;
|
|
43
48
|
}
|
|
44
|
-
.
|
|
49
|
+
._sizeL_wwfcil_26{
|
|
45
50
|
--_rs-icons-height:28px;
|
|
46
51
|
}
|
|
47
|
-
.
|
|
52
|
+
._light_wwfcil_30{
|
|
48
53
|
--rs-theme-dark:0;
|
|
49
54
|
--_rs-icons-themed-fill-or-initial: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));
|
|
50
55
|
}
|
|
51
|
-
.
|
|
56
|
+
._dark_wwfcil_34{
|
|
52
57
|
--rs-theme-dark:1;
|
|
53
58
|
--_rs-icons-themed-fill-or-initial: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));
|
|
54
59
|
}
|
|
@@ -60,54 +65,59 @@
|
|
|
60
65
|
transform:rotate(360deg);
|
|
61
66
|
}
|
|
62
67
|
}
|
|
63
|
-
.
|
|
68
|
+
._allVariants_wwfcil_48{
|
|
64
69
|
aspect-ratio:var(--rs-icon-ar-width, 1) / var(--rs-icon-ar-height, 1);
|
|
65
70
|
container:rs-icon / size;
|
|
66
71
|
}
|
|
67
|
-
.
|
|
68
|
-
.
|
|
69
|
-
.
|
|
72
|
+
._variant16_wwfcil_53,
|
|
73
|
+
._variant20_wwfcil_54,
|
|
74
|
+
._variant24_wwfcil_55{
|
|
70
75
|
display:none;
|
|
71
76
|
}
|
|
72
|
-
.
|
|
77
|
+
._variant28_wwfcil_58{
|
|
73
78
|
display:block;
|
|
74
79
|
}
|
|
75
80
|
@container rs-icon (max-height: 24px){
|
|
76
|
-
.
|
|
81
|
+
._variant24_wwfcil_55{
|
|
77
82
|
display:block;
|
|
78
83
|
}
|
|
79
|
-
.
|
|
84
|
+
._variant28_wwfcil_58{
|
|
80
85
|
display:none;
|
|
81
86
|
}
|
|
82
87
|
}
|
|
83
88
|
@container rs-icon (max-height: 20px){
|
|
84
|
-
.
|
|
89
|
+
._variant20_wwfcil_54{
|
|
85
90
|
display:block;
|
|
86
91
|
}
|
|
87
|
-
.
|
|
92
|
+
._variant24_wwfcil_55{
|
|
88
93
|
display:none;
|
|
89
94
|
}
|
|
90
95
|
}
|
|
91
96
|
@container rs-icon (max-height: 16px){
|
|
92
|
-
.
|
|
97
|
+
._variant16_wwfcil_53{
|
|
93
98
|
display:block;
|
|
94
99
|
}
|
|
95
|
-
.
|
|
100
|
+
._variant20_wwfcil_54{
|
|
96
101
|
display:none;
|
|
97
102
|
}
|
|
98
103
|
}
|
|
99
|
-
|
|
104
|
+
@property --_rs-theme-dark-coefficient{
|
|
105
|
+
syntax:'<number>';
|
|
106
|
+
inherits:true;
|
|
107
|
+
initial-value:0;
|
|
108
|
+
}
|
|
109
|
+
._light_zmel2e_10{
|
|
100
110
|
--rs-theme-dark:0;
|
|
101
111
|
}
|
|
102
|
-
.
|
|
112
|
+
._dark_zmel2e_13{
|
|
103
113
|
--rs-theme-dark:1;
|
|
104
114
|
}
|
|
105
|
-
.
|
|
115
|
+
._sizeM_zmel2e_17{
|
|
106
116
|
--_rs-tab-list-tab-vertical-padding:8px;
|
|
107
117
|
--_rs-tab-list-icon-size:24px;
|
|
108
118
|
--_rs-tab-list-icon-offset:4px;
|
|
109
119
|
}
|
|
110
|
-
.
|
|
120
|
+
._sizeM_zmel2e_17 [data-rs-internal='tab-list__tab']{
|
|
111
121
|
--_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
|
|
112
122
|
--_rs-typography-text-transform:initial;
|
|
113
123
|
--_rs-typography-font-variant-numeric:initial;
|
|
@@ -146,16 +156,16 @@
|
|
|
146
156
|
--_rs-typography-link-border-bottom-width-from-text:1px;
|
|
147
157
|
}
|
|
148
158
|
@media screen and (max-width: 640px){
|
|
149
|
-
.
|
|
159
|
+
._sizeM_zmel2e_17 [data-rs-internal='tab-list__tab']{
|
|
150
160
|
--_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
|
|
151
161
|
}
|
|
152
162
|
}
|
|
153
|
-
.
|
|
163
|
+
._sizeL_zmel2e_20{
|
|
154
164
|
--_rs-tab-list-tab-vertical-padding:12px;
|
|
155
165
|
--_rs-tab-list-icon-size:28px;
|
|
156
166
|
--_rs-tab-list-icon-offset:8px;
|
|
157
167
|
}
|
|
158
|
-
.
|
|
168
|
+
._sizeL_zmel2e_20 [data-rs-internal='tab-list__tab']{
|
|
159
169
|
--_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
|
|
160
170
|
--_rs-typography-text-transform:initial;
|
|
161
171
|
--_rs-typography-font-variant-numeric:initial;
|
|
@@ -194,28 +204,28 @@
|
|
|
194
204
|
--_rs-typography-link-border-bottom-width-from-text:1px;
|
|
195
205
|
}
|
|
196
206
|
@media screen and (max-width: 640px){
|
|
197
|
-
.
|
|
207
|
+
._sizeL_zmel2e_20 [data-rs-internal='tab-list__tab']{
|
|
198
208
|
--_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
|
|
199
209
|
}
|
|
200
210
|
}
|
|
201
|
-
.
|
|
211
|
+
._classic_zmel2e_24{
|
|
202
212
|
--_rs-tab-list-indicator-background:var(--_rs-color-primary);
|
|
203
213
|
}
|
|
204
|
-
.
|
|
214
|
+
._rock_zmel2e_27{
|
|
205
215
|
--_rs-tab-list-indicator-background: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));
|
|
206
216
|
}
|
|
207
|
-
.
|
|
217
|
+
._sparse_zmel2e_31{
|
|
208
218
|
--_rs-tab-list-tab-margin-left-or-initial:32px;
|
|
209
219
|
}
|
|
210
220
|
@media screen and (max-width: 640px){
|
|
211
|
-
.
|
|
221
|
+
._sparse_zmel2e_31{
|
|
212
222
|
--_rs-tab-list-tab-margin-left-or-initial:24px;
|
|
213
223
|
}
|
|
214
224
|
}
|
|
215
|
-
.
|
|
225
|
+
._short_zmel2e_35{
|
|
216
226
|
--_rs-tab-list-tab-box-shadow:inset 0 -1px 0 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), calc(0.3 + var(--_rs-theme-dark-coefficient)*0.1));
|
|
217
227
|
}
|
|
218
|
-
.
|
|
228
|
+
._wrapper_zmel2e_39{
|
|
219
229
|
--_rs-theme-dark:var(
|
|
220
230
|
--_rs-internal-force-theme-dark-consult-rescui-before-using,
|
|
221
231
|
var(--rs-theme-dark, 0)
|
|
@@ -225,7 +235,7 @@
|
|
|
225
235
|
--_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
|
|
226
236
|
}
|
|
227
237
|
@supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
|
|
228
|
-
.
|
|
238
|
+
._wrapper_zmel2e_39{
|
|
229
239
|
--_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)));
|
|
230
240
|
--_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)));
|
|
231
241
|
--_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)));
|
|
@@ -234,7 +244,7 @@
|
|
|
234
244
|
}
|
|
235
245
|
}
|
|
236
246
|
@supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
|
|
237
|
-
.
|
|
247
|
+
._wrapper_zmel2e_39{
|
|
238
248
|
--_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);
|
|
239
249
|
--_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));
|
|
240
250
|
--_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));
|
|
@@ -242,15 +252,15 @@
|
|
|
242
252
|
--_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));
|
|
243
253
|
}
|
|
244
254
|
}
|
|
245
|
-
.
|
|
255
|
+
._wrapper_zmel2e_39 {
|
|
246
256
|
--_rs-tab-list-tab-base-margin-left:24px;
|
|
247
257
|
}
|
|
248
258
|
@media screen and (max-width: 640px){
|
|
249
|
-
.
|
|
259
|
+
._wrapper_zmel2e_39{
|
|
250
260
|
--_rs-tab-list-tab-base-margin-left:16px;
|
|
251
261
|
}
|
|
252
262
|
}
|
|
253
|
-
.
|
|
263
|
+
._wrapper_zmel2e_39 {
|
|
254
264
|
--_rs-tab-list-tab-margin-left:var(
|
|
255
265
|
--_rs-tab-list-tab-margin-left-or-initial,
|
|
256
266
|
var(--_rs-tab-list-tab-base-margin-left)
|
|
@@ -260,14 +270,14 @@
|
|
|
260
270
|
|
|
261
271
|
display:flex;
|
|
262
272
|
}
|
|
263
|
-
.
|
|
273
|
+
._scrollable_zmel2e_49{
|
|
264
274
|
display:flex;
|
|
265
275
|
overflow-x:scroll;
|
|
266
276
|
|
|
267
277
|
margin:-4px;
|
|
268
278
|
padding:4px;
|
|
269
279
|
}
|
|
270
|
-
.
|
|
280
|
+
._scrollable_zmel2e_49::after{
|
|
271
281
|
display:block;
|
|
272
282
|
|
|
273
283
|
height:100%;
|
|
@@ -276,15 +286,15 @@
|
|
|
276
286
|
|
|
277
287
|
content:'';
|
|
278
288
|
}
|
|
279
|
-
.
|
|
289
|
+
._scrollable_zmel2e_49 {
|
|
280
290
|
|
|
281
291
|
-ms-overflow-style:none;
|
|
282
292
|
scrollbar-width:none;
|
|
283
293
|
}
|
|
284
|
-
.
|
|
294
|
+
._scrollable_zmel2e_49::-webkit-scrollbar{
|
|
285
295
|
display:none;
|
|
286
296
|
}
|
|
287
|
-
.
|
|
297
|
+
._arrow_zmel2e_78{
|
|
288
298
|
position:absolute;
|
|
289
299
|
z-index:2;
|
|
290
300
|
top:50%;
|
|
@@ -304,20 +314,20 @@
|
|
|
304
314
|
transition:opacity 0.15s var(--rs-transition-function, ease-out);
|
|
305
315
|
transform:translateY(-50%);
|
|
306
316
|
}
|
|
307
|
-
.
|
|
317
|
+
._arrow_zmel2e_78._shown_zmel2e_98{
|
|
308
318
|
opacity:1;
|
|
309
319
|
|
|
310
320
|
pointer-events:auto;
|
|
311
321
|
|
|
312
322
|
transition:opacity 0.15s var(--rs-transition-function, ease-in);
|
|
313
323
|
}
|
|
314
|
-
.
|
|
324
|
+
._arrow_zmel2e_78._arrowLeft_zmel2e_106{
|
|
315
325
|
left:-5px;
|
|
316
326
|
}
|
|
317
|
-
.
|
|
327
|
+
._arrow_zmel2e_78._arrowRight_zmel2e_111{
|
|
318
328
|
right:-5px;
|
|
319
329
|
}
|
|
320
|
-
.
|
|
330
|
+
._withLeftArrow_zmel2e_117{
|
|
321
331
|
-webkit-mask-image:linear-gradient(
|
|
322
332
|
to right,
|
|
323
333
|
rgba(0, 0, 0, 0) 0%,
|
|
@@ -331,7 +341,7 @@
|
|
|
331
341
|
black 56px
|
|
332
342
|
);
|
|
333
343
|
}
|
|
334
|
-
.
|
|
344
|
+
._withRightArrow_zmel2e_126{
|
|
335
345
|
-webkit-mask-image:linear-gradient(
|
|
336
346
|
to left,
|
|
337
347
|
rgba(0, 0, 0, 0) 0%,
|
|
@@ -345,7 +355,7 @@
|
|
|
345
355
|
black 56px
|
|
346
356
|
);
|
|
347
357
|
}
|
|
348
|
-
.
|
|
358
|
+
._withLeftArrow_zmel2e_117._withRightArrow_zmel2e_126{
|
|
349
359
|
-webkit-mask-image:linear-gradient(
|
|
350
360
|
to right,
|
|
351
361
|
rgba(0, 0, 0, 0) 0%,
|
|
@@ -365,15 +375,15 @@
|
|
|
365
375
|
rgba(0, 0, 0, 0) 100%
|
|
366
376
|
);
|
|
367
377
|
}
|
|
368
|
-
.
|
|
378
|
+
._arrowButton_zmel2e_147{
|
|
369
379
|
cursor:pointer;
|
|
370
380
|
}
|
|
371
|
-
.
|
|
381
|
+
._tabsContainer_zmel2e_151{
|
|
372
382
|
position:relative;
|
|
373
383
|
|
|
374
384
|
display:flex;
|
|
375
385
|
}
|
|
376
|
-
.
|
|
386
|
+
._indicator_zmel2e_157{
|
|
377
387
|
position:absolute;
|
|
378
388
|
z-index:3;
|
|
379
389
|
bottom:0;
|
|
@@ -386,17 +396,17 @@
|
|
|
386
396
|
transition:left 300ms var(--rs-transition-function, cubic-bezier(0.4, 0, 0.2, 1)) 0ms, width 300ms var(--rs-transition-function, cubic-bezier(0.4, 0, 0.2, 1)) 0ms;
|
|
387
397
|
will-change:left, width;
|
|
388
398
|
}
|
|
389
|
-
.
|
|
390
|
-
[data-calculating-scrollable='true'] .
|
|
399
|
+
._isIndicatorHidden_zmel2e_172 ._indicator_zmel2e_157,
|
|
400
|
+
[data-calculating-scrollable='true'] ._indicator_zmel2e_157{
|
|
391
401
|
display:none;
|
|
392
402
|
}
|
|
393
|
-
.
|
|
403
|
+
._iconLeft_zmel2e_178{
|
|
394
404
|
--_rs-tab-list-tab-flex-direction:row;
|
|
395
405
|
}
|
|
396
|
-
.
|
|
406
|
+
._iconRight_zmel2e_181{
|
|
397
407
|
--_rs-tab-list-tab-flex-direction:row-reverse;
|
|
398
408
|
}
|
|
399
|
-
.
|
|
409
|
+
._tab_zmel2e_151{
|
|
400
410
|
--_rs-theme-dark:var(
|
|
401
411
|
--_rs-internal-force-theme-dark-consult-rescui-before-using,
|
|
402
412
|
var(--rs-theme-dark, 0)
|
|
@@ -406,7 +416,7 @@
|
|
|
406
416
|
--_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
|
|
407
417
|
}
|
|
408
418
|
@supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
|
|
409
|
-
.
|
|
419
|
+
._tab_zmel2e_151{
|
|
410
420
|
--_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)));
|
|
411
421
|
--_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)));
|
|
412
422
|
--_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)));
|
|
@@ -415,7 +425,7 @@
|
|
|
415
425
|
}
|
|
416
426
|
}
|
|
417
427
|
@supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
|
|
418
|
-
.
|
|
428
|
+
._tab_zmel2e_151{
|
|
419
429
|
--_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);
|
|
420
430
|
--_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));
|
|
421
431
|
--_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));
|
|
@@ -423,7 +433,7 @@
|
|
|
423
433
|
--_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));
|
|
424
434
|
}
|
|
425
435
|
}
|
|
426
|
-
.
|
|
436
|
+
._tab_zmel2e_151 {
|
|
427
437
|
letter-spacing:var(
|
|
428
438
|
--rs-text-base-letter-spacing,
|
|
429
439
|
var(--_rs-typography-letter-spacing)
|
|
@@ -467,19 +477,19 @@
|
|
|
467
477
|
-moz-osx-font-smoothing:inherit;
|
|
468
478
|
-webkit-appearance:none;
|
|
469
479
|
}
|
|
470
|
-
.
|
|
480
|
+
._tab_zmel2e_151::-moz-focus-inner{
|
|
471
481
|
padding:0;
|
|
472
482
|
|
|
473
483
|
border:none;
|
|
474
484
|
}
|
|
475
|
-
.
|
|
476
|
-
.
|
|
477
|
-
.
|
|
485
|
+
._tab_zmel2e_151:hover,
|
|
486
|
+
._tab_zmel2e_151:active,
|
|
487
|
+
._tab_zmel2e_151:focus{
|
|
478
488
|
outline:none;
|
|
479
489
|
|
|
480
490
|
text-decoration:none;
|
|
481
491
|
}
|
|
482
|
-
.
|
|
492
|
+
._tab_zmel2e_151:after{
|
|
483
493
|
position:absolute;
|
|
484
494
|
right:0;
|
|
485
495
|
bottom:0;
|
|
@@ -492,18 +502,18 @@
|
|
|
492
502
|
|
|
493
503
|
background-color:transparent;
|
|
494
504
|
}
|
|
495
|
-
.
|
|
505
|
+
._tab_zmel2e_151:focus[data-focus-method='key']:after{
|
|
496
506
|
opacity:0;
|
|
497
507
|
}
|
|
498
|
-
.
|
|
508
|
+
._tab_zmel2e_151:hover{
|
|
499
509
|
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));
|
|
500
510
|
}
|
|
501
|
-
.
|
|
511
|
+
._tab_zmel2e_151:hover:after{
|
|
502
512
|
height:1px;
|
|
503
513
|
|
|
504
514
|
background-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));
|
|
505
515
|
}
|
|
506
|
-
.
|
|
516
|
+
._tab_zmel2e_151._selected_zmel2e_272{
|
|
507
517
|
z-index:1;
|
|
508
518
|
|
|
509
519
|
cursor:default;
|
|
@@ -512,20 +522,20 @@
|
|
|
512
522
|
|
|
513
523
|
transition:color 200ms var(--rs-transition-function, cubic-bezier(0.4, 0, 0.2, 1)) 0ms;
|
|
514
524
|
}
|
|
515
|
-
.
|
|
525
|
+
._tab_zmel2e_151._selected_zmel2e_272:after{
|
|
516
526
|
height:2px;
|
|
517
527
|
|
|
518
528
|
background-color:var(--_rs-tab-list-indicator-background);
|
|
519
529
|
|
|
520
530
|
transition:background-color 0ms var(--rs-transition-function, ease) 300ms, height 0ms var(--rs-transition-function, ease) 300ms;
|
|
521
531
|
}
|
|
522
|
-
.
|
|
532
|
+
._tab_zmel2e_151:focus[data-focus-method='key']{
|
|
523
533
|
box-shadow:inset var(--_rs-color-primary-dim) 0 -4px 0 0, inset var(--_rs-color-primary-dim) 0 4px 0 0, var(--_rs-color-primary-dim) -4px 0 0 0, var(--_rs-color-primary-dim) 4px 0 0 0;
|
|
524
534
|
}
|
|
525
|
-
.
|
|
535
|
+
._tab_zmel2e_151:first-child{
|
|
526
536
|
margin-left:0;
|
|
527
537
|
}
|
|
528
|
-
.
|
|
538
|
+
._tab_zmel2e_151 ._icon_zmel2e_178{
|
|
529
539
|
flex:0 0;
|
|
530
540
|
flex-basis:auto;
|
|
531
541
|
|
|
@@ -533,13 +543,18 @@
|
|
|
533
543
|
height:var(--_rs-tab-list-icon-size);
|
|
534
544
|
}
|
|
535
545
|
|
|
536
|
-
|
|
546
|
+
@property --_rs-theme-dark-coefficient{
|
|
547
|
+
syntax:'<number>';
|
|
548
|
+
inherits:true;
|
|
549
|
+
initial-value:0;
|
|
550
|
+
}
|
|
551
|
+
._light_e5cu6d_4{
|
|
537
552
|
--rs-theme-dark:0;
|
|
538
553
|
}
|
|
539
|
-
.
|
|
554
|
+
._dark_e5cu6d_7{
|
|
540
555
|
--rs-theme-dark:1;
|
|
541
556
|
}
|
|
542
|
-
.
|
|
557
|
+
._separator_e5cu6d_11{
|
|
543
558
|
--_rs-theme-dark:var(
|
|
544
559
|
--_rs-internal-force-theme-dark-consult-rescui-before-using,
|
|
545
560
|
var(--rs-theme-dark, 0)
|
|
@@ -553,7 +568,7 @@
|
|
|
553
568
|
|
|
554
569
|
width:100%;
|
|
555
570
|
}
|
|
556
|
-
.
|
|
571
|
+
._separator_e5cu6d_11:after{
|
|
557
572
|
position:absolute;
|
|
558
573
|
right:0;
|
|
559
574
|
bottom:0;
|
|
@@ -6,6 +6,8 @@ const TabListContext = /*#__PURE__*/createContext({
|
|
|
6
6
|
selectedId: 0
|
|
7
7
|
});
|
|
8
8
|
|
|
9
|
-
const useTabListContext = () =>
|
|
9
|
+
const useTabListContext = () => {
|
|
10
|
+
return useContext(TabListContext);
|
|
11
|
+
};
|
|
10
12
|
|
|
11
13
|
export { TabListContext, useTabListContext };
|
|
@@ -1,28 +1,28 @@
|
|
|
1
1
|
var styles = {
|
|
2
|
-
"light": "
|
|
3
|
-
"dark": "
|
|
4
|
-
"sizeM": "
|
|
5
|
-
"sizeL": "
|
|
6
|
-
"classic": "
|
|
7
|
-
"rock": "
|
|
8
|
-
"sparse": "
|
|
9
|
-
"short": "
|
|
10
|
-
"wrapper": "
|
|
11
|
-
"scrollable": "
|
|
12
|
-
"arrow": "
|
|
13
|
-
"shown": "
|
|
14
|
-
"arrowLeft": "
|
|
15
|
-
"arrowRight": "
|
|
16
|
-
"withLeftArrow": "
|
|
17
|
-
"withRightArrow": "
|
|
18
|
-
"arrowButton": "
|
|
19
|
-
"tabsContainer": "
|
|
20
|
-
"indicator": "
|
|
21
|
-
"isIndicatorHidden": "
|
|
22
|
-
"iconLeft": "
|
|
23
|
-
"iconRight": "
|
|
24
|
-
"tab": "
|
|
25
|
-
"selected": "
|
|
26
|
-
"icon": "
|
|
2
|
+
"light": "_light_zmel2e_10",
|
|
3
|
+
"dark": "_dark_zmel2e_13",
|
|
4
|
+
"sizeM": "_sizeM_zmel2e_17",
|
|
5
|
+
"sizeL": "_sizeL_zmel2e_20",
|
|
6
|
+
"classic": "_classic_zmel2e_24",
|
|
7
|
+
"rock": "_rock_zmel2e_27",
|
|
8
|
+
"sparse": "_sparse_zmel2e_31",
|
|
9
|
+
"short": "_short_zmel2e_35",
|
|
10
|
+
"wrapper": "_wrapper_zmel2e_39",
|
|
11
|
+
"scrollable": "_scrollable_zmel2e_49",
|
|
12
|
+
"arrow": "_arrow_zmel2e_78",
|
|
13
|
+
"shown": "_shown_zmel2e_98",
|
|
14
|
+
"arrowLeft": "_arrowLeft_zmel2e_106",
|
|
15
|
+
"arrowRight": "_arrowRight_zmel2e_111",
|
|
16
|
+
"withLeftArrow": "_withLeftArrow_zmel2e_117",
|
|
17
|
+
"withRightArrow": "_withRightArrow_zmel2e_126",
|
|
18
|
+
"arrowButton": "_arrowButton_zmel2e_147",
|
|
19
|
+
"tabsContainer": "_tabsContainer_zmel2e_151",
|
|
20
|
+
"indicator": "_indicator_zmel2e_157",
|
|
21
|
+
"isIndicatorHidden": "_isIndicatorHidden_zmel2e_172",
|
|
22
|
+
"iconLeft": "_iconLeft_zmel2e_178",
|
|
23
|
+
"iconRight": "_iconRight_zmel2e_181",
|
|
24
|
+
"tab": "_tab_zmel2e_151",
|
|
25
|
+
"selected": "_selected_zmel2e_272",
|
|
26
|
+
"icon": "_icon_zmel2e_178"
|
|
27
27
|
};
|
|
28
28
|
export { styles as default };
|
|
@@ -1,18 +1,42 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
import { c } from 'react-compiler-runtime';
|
|
2
3
|
import React from 'react';
|
|
3
4
|
import cn from 'classnames';
|
|
4
5
|
import { useThemeWithUndefined } from '@rescui/ui-contexts';
|
|
5
6
|
import styles from './separator.p.module.css.js';
|
|
6
7
|
|
|
7
|
-
const TabSeparator =
|
|
8
|
-
|
|
8
|
+
const TabSeparator = t0 => {
|
|
9
|
+
const $ = c(5);
|
|
10
|
+
const {
|
|
9
11
|
className,
|
|
10
12
|
theme: themeFromProps
|
|
11
|
-
} =
|
|
13
|
+
} = t0;
|
|
12
14
|
const theme = useThemeWithUndefined(themeFromProps);
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
15
|
+
const t1 = styles[theme];
|
|
16
|
+
let t2;
|
|
17
|
+
|
|
18
|
+
if ($[0] !== className || $[1] !== t1) {
|
|
19
|
+
t2 = cn(styles.separator, t1, className);
|
|
20
|
+
$[0] = className;
|
|
21
|
+
$[1] = t1;
|
|
22
|
+
$[2] = t2;
|
|
23
|
+
} else {
|
|
24
|
+
t2 = $[2];
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
let t3;
|
|
28
|
+
|
|
29
|
+
if ($[3] !== t2) {
|
|
30
|
+
t3 = /*#__PURE__*/React.createElement("div", {
|
|
31
|
+
className: t2
|
|
32
|
+
});
|
|
33
|
+
$[3] = t2;
|
|
34
|
+
$[4] = t3;
|
|
35
|
+
} else {
|
|
36
|
+
t3 = $[4];
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
return t3;
|
|
16
40
|
};
|
|
17
41
|
|
|
18
42
|
export { TabSeparator as default };
|