@rescui/tab-list 0.17.0 → 0.17.1-RUI-293-Update-menu-component-7a032357e.20

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 (23) hide show
  1. package/README.md +4 -3
  2. package/lib/_virtual/index.css.js +12 -12
  3. package/lib/index.css +180 -194
  4. package/lib/index.d.ts +6 -6
  5. package/lib/index.js +1 -1
  6. package/lib/parts/deep-map.d.ts +2 -2
  7. package/lib/parts/separator.p.module.css.js +3 -3
  8. package/lib/parts/tab-list-context.d.ts +13 -13
  9. package/lib/parts/tab-list.p.module.css.js +25 -16
  10. package/lib/parts/tab-separator.d.ts +8 -8
  11. package/lib/parts/tab.d.ts +35 -35
  12. package/lib/parts/use-indicator.d.ts +13 -13
  13. package/lib/parts/use-roving-tab-index.d.ts +8 -8
  14. package/lib/parts/use-scrollable-list.d.ts +18 -18
  15. package/lib/parts/use-scrollable-list.js +5 -8
  16. package/lib/tab-list.d.ts +43 -42
  17. package/lib/tab-list.js +78 -23
  18. package/llm/components/tab-list.md +447 -0
  19. package/llm/index.md +2 -0
  20. package/package.json +10 -9
  21. package/lib/parts/with-scroll-arrows.d.ts +0 -28
  22. package/lib/parts/with-scroll-arrows.js +0 -101
  23. package/lib/parts/with-scroll-arrows.p.module.css.js +0 -14
package/README.md CHANGED
@@ -1,4 +1,5 @@
1
- # Tab-list and Chip-list
1
+ # TabList
2
2
 
3
- * [Usage examples of TabList](./docs/demo.md)
4
- * [Usage examples of ChipList](./docs/chip-list/demo.md)
3
+ ## LLM
4
+
5
+ To get the docs for the LLM, check out [this index](./llm/index.md).
package/lib/_virtual/index.css.js CHANGED
@@ -1,15 +1,15 @@
1
1
  var styles = {
2
- "icon": "_icon_uqfcxc_4",
3
- "sizeXS": "_sizeXS_uqfcxc_14",
4
- "sizeS": "_sizeS_uqfcxc_18",
5
- "sizeM": "_sizeM_uqfcxc_22",
6
- "sizeL": "_sizeL_uqfcxc_26",
7
- "light": "_light_uqfcxc_30",
8
- "dark": "_dark_uqfcxc_34",
9
- "allVariants": "_allVariants_uqfcxc_48",
10
- "variant16": "_variant16_uqfcxc_53",
11
- "variant20": "_variant20_uqfcxc_54",
12
- "variant24": "_variant24_uqfcxc_55",
13
- "variant28": "_variant28_uqfcxc_58"
2
+ "icon": "_icon_11g9wvk_4",
3
+ "sizeXS": "_sizeXS_11g9wvk_14",
4
+ "sizeS": "_sizeS_11g9wvk_18",
5
+ "sizeM": "_sizeM_11g9wvk_22",
6
+ "sizeL": "_sizeL_11g9wvk_26",
7
+ "light": "_light_11g9wvk_30",
8
+ "dark": "_dark_11g9wvk_34",
9
+ "allVariants": "_allVariants_11g9wvk_48",
10
+ "variant16": "_variant16_11g9wvk_53",
11
+ "variant20": "_variant20_11g9wvk_54",
12
+ "variant24": "_variant24_11g9wvk_55",
13
+ "variant28": "_variant28_11g9wvk_58"
14
14
  };
15
15
  export { styles as default };
package/lib/index.css CHANGED
@@ -1,4 +1,4 @@
1
- ._icon_uqfcxc_4{
1
+ ._icon_11g9wvk_4{
2
2
  --_rs-theme-dark:var(
3
3
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
4
4
  var(--rs-theme-dark, 0)
@@ -8,7 +8,7 @@
8
8
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
9
9
  }
10
10
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
11
- ._icon_uqfcxc_4{
11
+ ._icon_11g9wvk_4{
12
12
  --_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
13
  --_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
14
  --_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 +17,7 @@
17
17
  }
18
18
  }
19
19
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
20
- ._icon_uqfcxc_4{
20
+ ._icon_11g9wvk_4{
21
21
  --_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
22
  --_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
23
  --_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 +25,30 @@
25
25
  --_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
26
  }
27
27
  }
28
- ._icon_uqfcxc_4{
28
+ ._icon_11g9wvk_4{
29
29
 
30
30
  fill:var(--_rs-icons-themed-fill-or-initial, currentcolor);
31
31
 
32
32
  width:var(--rs-icons-width, auto);
33
33
  height:var(--rs-icons-height, var(--_rs-icons-height));
34
34
  }
35
- ._sizeXS_uqfcxc_14{
35
+ ._sizeXS_11g9wvk_14{
36
36
  --_rs-icons-height:16px;
37
37
  }
38
- ._sizeS_uqfcxc_18{
38
+ ._sizeS_11g9wvk_18{
39
39
  --_rs-icons-height:20px;
40
40
  }
41
- ._sizeM_uqfcxc_22{
41
+ ._sizeM_11g9wvk_22{
42
42
  --_rs-icons-height:24px;
43
43
  }
44
- ._sizeL_uqfcxc_26{
44
+ ._sizeL_11g9wvk_26{
45
45
  --_rs-icons-height:28px;
46
46
  }
47
- ._light_uqfcxc_30{
47
+ ._light_11g9wvk_30{
48
48
  --rs-theme-dark:0;
49
49
  --_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
50
  }
51
- ._dark_uqfcxc_34{
51
+ ._dark_11g9wvk_34{
52
52
  --rs-theme-dark:1;
53
53
  --_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
54
  }
@@ -60,54 +60,54 @@
60
60
  transform:rotate(360deg);
61
61
  }
62
62
  }
63
- ._allVariants_uqfcxc_48{
63
+ ._allVariants_11g9wvk_48{
64
64
  aspect-ratio:var(--rs-icon-ar-width, 1) / var(--rs-icon-ar-height, 1);
65
65
  container:rs-icon / size;
66
66
  }
67
- ._variant16_uqfcxc_53,
68
- ._variant20_uqfcxc_54,
69
- ._variant24_uqfcxc_55{
67
+ ._variant16_11g9wvk_53,
68
+ ._variant20_11g9wvk_54,
69
+ ._variant24_11g9wvk_55{
70
70
  display:none;
71
71
  }
72
- ._variant28_uqfcxc_58{
72
+ ._variant28_11g9wvk_58{
73
73
  display:block;
74
74
  }
75
75
  @container rs-icon (max-height: 24px){
76
- ._variant24_uqfcxc_55{
76
+ ._variant24_11g9wvk_55{
77
77
  display:block;
78
78
  }
79
- ._variant28_uqfcxc_58{
79
+ ._variant28_11g9wvk_58{
80
80
  display:none;
81
81
  }
82
82
  }
83
83
  @container rs-icon (max-height: 20px){
84
- ._variant20_uqfcxc_54{
84
+ ._variant20_11g9wvk_54{
85
85
  display:block;
86
86
  }
87
- ._variant24_uqfcxc_55{
87
+ ._variant24_11g9wvk_55{
88
88
  display:none;
89
89
  }
90
90
  }
91
91
  @container rs-icon (max-height: 16px){
92
- ._variant16_uqfcxc_53{
92
+ ._variant16_11g9wvk_53{
93
93
  display:block;
94
94
  }
95
- ._variant20_uqfcxc_54{
95
+ ._variant20_11g9wvk_54{
96
96
  display:none;
97
97
  }
98
98
  }
99
- ._light_j4p92r_7{
99
+ ._light_4vcbrf_10{
100
100
  --rs-theme-dark:0;
101
101
  }
102
- ._dark_j4p92r_10{
102
+ ._dark_4vcbrf_13{
103
103
  --rs-theme-dark:1;
104
104
  }
105
- ._sizeM_j4p92r_14{
105
+ ._sizeM_4vcbrf_17{
106
106
  --_rs-tab-list-tab-vertical-padding:8px;
107
107
  --_rs-tab-list-icon-size:24px;
108
108
  --_rs-tab-list-icon-offset:4px;
109
109
  }
110
- ._sizeM_j4p92r_14 [data-rs-internal='tab-list__tab']{
110
+ ._sizeM_4vcbrf_17 [data-rs-internal='tab-list__tab']{
111
111
  --_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
112
112
  --_rs-typography-text-transform:initial;
113
113
  --_rs-typography-font-variant-numeric:initial;
@@ -146,16 +146,16 @@
146
146
  --_rs-typography-link-border-bottom-width-from-text:1px;
147
147
  }
148
148
  @media screen and (max-width: 640px){
149
- ._sizeM_j4p92r_14 [data-rs-internal='tab-list__tab']{
149
+ ._sizeM_4vcbrf_17 [data-rs-internal='tab-list__tab']{
150
150
  --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
151
151
  }
152
152
  }
153
- ._sizeL_j4p92r_17{
153
+ ._sizeL_4vcbrf_20{
154
154
  --_rs-tab-list-tab-vertical-padding:12px;
155
155
  --_rs-tab-list-icon-size:28px;
156
156
  --_rs-tab-list-icon-offset:8px;
157
157
  }
158
- ._sizeL_j4p92r_17 [data-rs-internal='tab-list__tab']{
158
+ ._sizeL_4vcbrf_20 [data-rs-internal='tab-list__tab']{
159
159
  --_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
160
160
  --_rs-typography-text-transform:initial;
161
161
  --_rs-typography-font-variant-numeric:initial;
@@ -194,28 +194,28 @@
194
194
  --_rs-typography-link-border-bottom-width-from-text:1px;
195
195
  }
196
196
  @media screen and (max-width: 640px){
197
- ._sizeL_j4p92r_17 [data-rs-internal='tab-list__tab']{
197
+ ._sizeL_4vcbrf_20 [data-rs-internal='tab-list__tab']{
198
198
  --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
199
199
  }
200
200
  }
201
- ._classic_j4p92r_21{
201
+ ._classic_4vcbrf_24{
202
202
  --_rs-tab-list-indicator-background:var(--_rs-color-primary);
203
203
  }
204
- ._rock_j4p92r_24{
204
+ ._rock_4vcbrf_27{
205
205
  --_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
206
  }
207
- ._sparse_j4p92r_28{
207
+ ._sparse_4vcbrf_31{
208
208
  --_rs-tab-list-tab-margin-left-or-initial:32px;
209
209
  }
210
210
  @media screen and (max-width: 640px){
211
- ._sparse_j4p92r_28{
211
+ ._sparse_4vcbrf_31{
212
212
  --_rs-tab-list-tab-margin-left-or-initial:24px;
213
213
  }
214
214
  }
215
- ._short_j4p92r_32{
215
+ ._short_4vcbrf_35{
216
216
  --_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
217
  }
218
- ._tabsContainer_j4p92r_36{
218
+ ._wrapper_4vcbrf_39{
219
219
  --_rs-theme-dark:var(
220
220
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
221
221
  var(--rs-theme-dark, 0)
@@ -225,7 +225,7 @@
225
225
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
226
226
  }
227
227
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
228
- ._tabsContainer_j4p92r_36{
228
+ ._wrapper_4vcbrf_39{
229
229
  --_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
230
  --_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
231
  --_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 +234,7 @@
234
234
  }
235
235
  }
236
236
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
237
- ._tabsContainer_j4p92r_36{
237
+ ._wrapper_4vcbrf_39{
238
238
  --_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
239
  --_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
240
  --_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 +242,15 @@
242
242
  --_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
243
  }
244
244
  }
245
- ._tabsContainer_j4p92r_36 {
245
+ ._wrapper_4vcbrf_39 {
246
246
  --_rs-tab-list-tab-base-margin-left:24px;
247
247
  }
248
248
  @media screen and (max-width: 640px){
249
- ._tabsContainer_j4p92r_36{
249
+ ._wrapper_4vcbrf_39{
250
250
  --_rs-tab-list-tab-base-margin-left:16px;
251
251
  }
252
252
  }
253
- ._tabsContainer_j4p92r_36 {
253
+ ._wrapper_4vcbrf_39 {
254
254
  --_rs-tab-list-tab-margin-left:var(
255
255
  --_rs-tab-list-tab-margin-left-or-initial,
256
256
  var(--_rs-tab-list-tab-base-margin-left)
@@ -260,7 +260,120 @@
260
260
 
261
261
  display:flex;
262
262
  }
263
- ._indicator_j4p92r_46{
263
+ ._scrollable_4vcbrf_49{
264
+ display:flex;
265
+ overflow-x:scroll;
266
+
267
+ margin:-4px;
268
+ padding:4px;
269
+ }
270
+ ._scrollable_4vcbrf_49::after{
271
+ display:block;
272
+
273
+ height:100%;
274
+
275
+ border-left:4px solid transparent;
276
+
277
+ content:'';
278
+ }
279
+ ._scrollable_4vcbrf_49 {
280
+
281
+ -ms-overflow-style:none;
282
+ scrollbar-width:none;
283
+ }
284
+ ._scrollable_4vcbrf_49::-webkit-scrollbar{
285
+ display:none;
286
+ }
287
+ ._arrow_4vcbrf_78{
288
+ position:absolute;
289
+ z-index:2;
290
+ top:50%;
291
+
292
+ display:flex;
293
+
294
+ opacity:0;
295
+ align-items:center;
296
+
297
+ height:100%;
298
+
299
+ pointer-events:none;
300
+
301
+ color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
302
+ background-color:transparent;
303
+
304
+ transition:opacity 0.15s var(--rs-transition-function, ease-out);
305
+ transform:translateY(-50%);
306
+ }
307
+ ._arrow_4vcbrf_78._shown_4vcbrf_98{
308
+ opacity:1;
309
+
310
+ pointer-events:auto;
311
+
312
+ transition:opacity 0.15s var(--rs-transition-function, ease-in);
313
+ }
314
+ ._arrow_4vcbrf_78._arrowLeft_4vcbrf_106{
315
+ left:-5px;
316
+ }
317
+ ._arrow_4vcbrf_78._arrowRight_4vcbrf_111{
318
+ right:-5px;
319
+ }
320
+ ._withLeftArrow_4vcbrf_117{
321
+ -webkit-mask-image:linear-gradient(
322
+ to right,
323
+ rgba(0, 0, 0, 0) 0%,
324
+ rgba(0, 0, 0, 0) 32px,
325
+ black 56px
326
+ );
327
+ mask-image:linear-gradient(
328
+ to right,
329
+ rgba(0, 0, 0, 0) 0%,
330
+ rgba(0, 0, 0, 0) 32px,
331
+ black 56px
332
+ );
333
+ }
334
+ ._withRightArrow_4vcbrf_126{
335
+ -webkit-mask-image:linear-gradient(
336
+ to left,
337
+ rgba(0, 0, 0, 0) 0%,
338
+ rgba(0, 0, 0, 0) 32px,
339
+ black 56px
340
+ );
341
+ mask-image:linear-gradient(
342
+ to left,
343
+ rgba(0, 0, 0, 0) 0%,
344
+ rgba(0, 0, 0, 0) 32px,
345
+ black 56px
346
+ );
347
+ }
348
+ ._withLeftArrow_4vcbrf_117._withRightArrow_4vcbrf_126{
349
+ -webkit-mask-image:linear-gradient(
350
+ to right,
351
+ rgba(0, 0, 0, 0) 0%,
352
+ rgba(0, 0, 0, 0) 32px,
353
+ black 56px,
354
+ black calc(100% - 56px),
355
+ rgba(0, 0, 0, 0) calc(100% - 32px),
356
+ rgba(0, 0, 0, 0) 100%
357
+ );
358
+ mask-image:linear-gradient(
359
+ to right,
360
+ rgba(0, 0, 0, 0) 0%,
361
+ rgba(0, 0, 0, 0) 32px,
362
+ black 56px,
363
+ black calc(100% - 56px),
364
+ rgba(0, 0, 0, 0) calc(100% - 32px),
365
+ rgba(0, 0, 0, 0) 100%
366
+ );
367
+ }
368
+ ._arrowButton_4vcbrf_147{
369
+ cursor:pointer;
370
+ }
371
+ ._tabsContainer_4vcbrf_151{
372
+ position:relative;
373
+
374
+ display:flex;
375
+ }
376
+ ._indicator_4vcbrf_157{
264
377
  position:absolute;
265
378
  z-index:3;
266
379
  bottom:0;
@@ -273,17 +386,17 @@
273
386
  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;
274
387
  will-change:left, width;
275
388
  }
276
- ._isIndicatorHidden_j4p92r_61 ._indicator_j4p92r_46,
277
- [data-calculating-scrollable='true'] ._indicator_j4p92r_46{
389
+ ._isIndicatorHidden_4vcbrf_172 ._indicator_4vcbrf_157,
390
+ [data-calculating-scrollable='true'] ._indicator_4vcbrf_157{
278
391
  display:none;
279
392
  }
280
- ._iconLeft_j4p92r_67{
393
+ ._iconLeft_4vcbrf_178{
281
394
  --_rs-tab-list-tab-flex-direction:row;
282
395
  }
283
- ._iconRight_j4p92r_70{
396
+ ._iconRight_4vcbrf_181{
284
397
  --_rs-tab-list-tab-flex-direction:row-reverse;
285
398
  }
286
- ._tab_j4p92r_36{
399
+ ._tab_4vcbrf_151{
287
400
  --_rs-theme-dark:var(
288
401
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
289
402
  var(--rs-theme-dark, 0)
@@ -293,7 +406,7 @@
293
406
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
294
407
  }
295
408
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
296
- ._tab_j4p92r_36{
409
+ ._tab_4vcbrf_151{
297
410
  --_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)));
298
411
  --_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)));
299
412
  --_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)));
@@ -302,7 +415,7 @@
302
415
  }
303
416
  }
304
417
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
305
- ._tab_j4p92r_36{
418
+ ._tab_4vcbrf_151{
306
419
  --_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);
307
420
  --_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));
308
421
  --_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));
@@ -310,7 +423,7 @@
310
423
  --_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));
311
424
  }
312
425
  }
313
- ._tab_j4p92r_36 {
426
+ ._tab_4vcbrf_151 {
314
427
  letter-spacing:var(
315
428
  --rs-text-base-letter-spacing,
316
429
  var(--_rs-typography-letter-spacing)
@@ -354,23 +467,23 @@
354
467
  -moz-osx-font-smoothing:inherit;
355
468
  -webkit-appearance:none;
356
469
  }
357
- ._tab_j4p92r_36::-moz-focus-inner{
470
+ ._tab_4vcbrf_151::-moz-focus-inner{
358
471
  padding:0;
359
472
 
360
473
  border:none;
361
474
  }
362
- ._tab_j4p92r_36:hover,
363
- ._tab_j4p92r_36:active,
364
- ._tab_j4p92r_36:focus{
475
+ ._tab_4vcbrf_151:hover,
476
+ ._tab_4vcbrf_151:active,
477
+ ._tab_4vcbrf_151:focus{
365
478
  outline:none;
366
479
 
367
480
  text-decoration:none;
368
481
  }
369
- ._tab_j4p92r_36:after{
482
+ ._tab_4vcbrf_151:after{
370
483
  position:absolute;
484
+ right:0;
371
485
  bottom:0;
372
486
  left:0;
373
- right:0;
374
487
 
375
488
  width:100%;
376
489
  height:0;
@@ -379,18 +492,18 @@
379
492
 
380
493
  background-color:transparent;
381
494
  }
382
- ._tab_j4p92r_36:focus[data-focus-method='key']:after{
495
+ ._tab_4vcbrf_151:focus[data-focus-method='key']:after{
383
496
  opacity:0;
384
497
  }
385
- ._tab_j4p92r_36:hover{
498
+ ._tab_4vcbrf_151:hover{
386
499
  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));
387
500
  }
388
- ._tab_j4p92r_36:hover:after{
501
+ ._tab_4vcbrf_151:hover:after{
389
502
  height:1px;
390
503
 
391
504
  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));
392
505
  }
393
- ._tab_j4p92r_36._selected_j4p92r_161{
506
+ ._tab_4vcbrf_151._selected_4vcbrf_272{
394
507
  z-index:1;
395
508
 
396
509
  cursor:default;
@@ -399,20 +512,20 @@
399
512
 
400
513
  transition:color 200ms var(--rs-transition-function, cubic-bezier(0.4, 0, 0.2, 1)) 0ms;
401
514
  }
402
- ._tab_j4p92r_36._selected_j4p92r_161:after{
515
+ ._tab_4vcbrf_151._selected_4vcbrf_272:after{
403
516
  height:2px;
404
517
 
405
518
  background-color:var(--_rs-tab-list-indicator-background);
406
519
 
407
520
  transition:background-color 0ms var(--rs-transition-function, ease) 300ms, height 0ms var(--rs-transition-function, ease) 300ms;
408
521
  }
409
- ._tab_j4p92r_36:focus[data-focus-method='key']{
522
+ ._tab_4vcbrf_151:focus[data-focus-method='key']{
410
523
  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;
411
524
  }
412
- ._tab_j4p92r_36:first-child{
525
+ ._tab_4vcbrf_151:first-child{
413
526
  margin-left:0;
414
527
  }
415
- ._tab_j4p92r_36 ._icon_j4p92r_67{
528
+ ._tab_4vcbrf_151 ._icon_4vcbrf_178{
416
529
  flex:0 0;
417
530
  flex-basis:auto;
418
531
 
@@ -420,140 +533,13 @@
420
533
  height:var(--_rs-tab-list-icon-size);
421
534
  }
422
535
 
423
- ._light_l17k0g_9{
424
- --rs-theme-dark:0;
425
- }
426
- ._dark_l17k0g_12{
427
- --rs-theme-dark:1;
428
- }
429
- ._wrapper_l17k0g_16{
430
- --_rs-theme-dark:var(
431
- --_rs-internal-force-theme-dark-consult-rescui-before-using,
432
- var(--rs-theme-dark, 0)
433
- );
434
- --_rs-theme-flip:var(--rs-theme-flip, 0);
435
- --_rs-theme-dark-coefficient:calc(var(--_rs-theme-dark)*(1 - var(--_rs-theme-flip)) + var(--_rs-theme-flip)*(1 - var(--_rs-theme-dark)));
436
- --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
437
- position:relative;
438
-
439
- display:flex;
440
- }
441
- ._scrollable_l17k0g_23{
442
- display:flex;
443
- overflow-x:scroll;
444
-
445
- margin:-4px;
446
- padding:4px;
447
- }
448
- ._scrollable_l17k0g_23::after{
449
- display:block;
450
-
451
- height:100%;
452
-
453
- border-left:4px solid transparent;
454
-
455
- content:'';
456
- }
457
- ._scrollable_l17k0g_23 {
458
-
459
- -ms-overflow-style:none;
460
- scrollbar-width:none;
461
- }
462
- ._scrollable_l17k0g_23::-webkit-scrollbar{
463
- display:none;
464
- }
465
- ._arrow_l17k0g_52{
466
- position:absolute;
467
- z-index:2;
468
- top:50%;
469
-
470
- display:flex;
471
-
472
- opacity:0;
473
- align-items:center;
474
-
475
- height:100%;
476
-
477
- pointer-events:none;
478
-
479
- color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
480
- background-color:transparent;
481
-
482
- transition:opacity 0.15s var(--rs-transition-function, ease-out);
483
- transform:translateY(-50%);
484
- }
485
- ._arrow_l17k0g_52._shown_l17k0g_72{
486
- opacity:1;
487
-
488
- pointer-events:auto;
489
-
490
- transition:opacity 0.15s var(--rs-transition-function, ease-in);
491
- }
492
- ._arrow_l17k0g_52._arrowLeft_l17k0g_80{
493
- left:-5px;
494
- }
495
- ._arrow_l17k0g_52._arrowRight_l17k0g_85{
496
- right:-5px;
497
- }
498
- ._withLeftArrow_l17k0g_91{
499
- -webkit-mask-image:linear-gradient(
500
- to right,
501
- rgba(0, 0, 0, 0) 0%,
502
- rgba(0, 0, 0, 0) 32px,
503
- black 56px
504
- );
505
- mask-image:linear-gradient(
506
- to right,
507
- rgba(0, 0, 0, 0) 0%,
508
- rgba(0, 0, 0, 0) 32px,
509
- black 56px
510
- );
511
- }
512
- ._withRightArrow_l17k0g_100{
513
- -webkit-mask-image:linear-gradient(
514
- to left,
515
- rgba(0, 0, 0, 0) 0%,
516
- rgba(0, 0, 0, 0) 32px,
517
- black 56px
518
- );
519
- mask-image:linear-gradient(
520
- to left,
521
- rgba(0, 0, 0, 0) 0%,
522
- rgba(0, 0, 0, 0) 32px,
523
- black 56px
524
- );
525
- }
526
- ._withLeftArrow_l17k0g_91._withRightArrow_l17k0g_100{
527
- -webkit-mask-image:linear-gradient(
528
- to right,
529
- rgba(0, 0, 0, 0) 0%,
530
- rgba(0, 0, 0, 0) 32px,
531
- black 56px,
532
- black calc(100% - 56px),
533
- rgba(0, 0, 0, 0) calc(100% - 32px),
534
- rgba(0, 0, 0, 0) 100%
535
- );
536
- mask-image:linear-gradient(
537
- to right,
538
- rgba(0, 0, 0, 0) 0%,
539
- rgba(0, 0, 0, 0) 32px,
540
- black 56px,
541
- black calc(100% - 56px),
542
- rgba(0, 0, 0, 0) calc(100% - 32px),
543
- rgba(0, 0, 0, 0) 100%
544
- );
545
- }
546
- ._arrowButton_l17k0g_121{
547
- cursor:pointer;
548
- }
549
-
550
- ._light_46gg08_4{
536
+ ._light_18ir3ig_4{
551
537
  --rs-theme-dark:0;
552
538
  }
553
- ._dark_46gg08_7{
539
+ ._dark_18ir3ig_7{
554
540
  --rs-theme-dark:1;
555
541
  }
556
- ._separator_46gg08_11{
542
+ ._separator_18ir3ig_11{
557
543
  --_rs-theme-dark:var(
558
544
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
559
545
  var(--rs-theme-dark, 0)
@@ -567,7 +553,7 @@
567
553
 
568
554
  width:100%;
569
555
  }
570
- ._separator_46gg08_11:after{
556
+ ._separator_18ir3ig_11:after{
571
557
  position:absolute;
572
558
  right:0;
573
559
  bottom:0;
package/lib/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- export { default as TabList } from './tab-list';
2
- export type { TabListProps } from './tab-list';
3
- export { default as TabSeparator } from './parts/tab-separator';
4
- export type { TabSeparatorProps } from './parts/tab-separator';
5
- export { default as Tab } from './parts/tab';
6
- export type { TabProps } from './parts/tab';
1
+ export { default as TabList } from './tab-list';
2
+ export type { TabListProps } from './tab-list';
3
+ export { default as TabSeparator } from './parts/tab-separator';
4
+ export type { TabSeparatorProps } from './parts/tab-separator';
5
+ export { default as Tab } from './parts/tab';
6
+ export type { TabProps } from './parts/tab';
package/lib/index.js CHANGED
@@ -1,4 +1,4 @@
1
1
  import './index.css';
2
- export { TabList } from './tab-list.js';
2
+ export { default as TabList } from './tab-list.js';
3
3
  export { default as TabSeparator } from './parts/tab-separator.js';
4
4
  export { default as Tab } from './parts/tab.js';
package/lib/parts/deep-map.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- import React from 'react';
2
- export declare function deepMap(children: React.ReactNode, fn: (child: React.ReactNode) => React.ReactNode): React.ReactNode;
1
+ import React from 'react';
2
+ export declare function deepMap(children: React.ReactNode, fn: (child: React.ReactNode) => React.ReactNode): React.ReactNode;