@rescui/chip-list 0.14.3 → 0.14.5-RUI-308-Fix-select-issues-405b9fa40.12

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/index.css CHANGED
@@ -1,19 +1,24 @@
1
- ._light_1yhhnbc_8{
1
+ @property --_rs-theme-dark-coefficient{
2
+ syntax:'<number>';
3
+ inherits:true;
4
+ initial-value:0;
5
+ }
6
+ ._light_1cj6yde_8{
2
7
  --rs-theme-dark:0;
3
8
  }
4
- ._dark_1yhhnbc_11{
9
+ ._dark_1cj6yde_11{
5
10
  --rs-theme-dark:1;
6
11
  }
7
- ._alignLeft_1yhhnbc_15{
12
+ ._alignLeft_1cj6yde_15{
8
13
  --_rs-cl-align:left;
9
14
  }
10
- ._alignCenter_1yhhnbc_18{
15
+ ._alignCenter_1cj6yde_18{
11
16
  --_rs-cl-align:center;
12
17
  }
13
- ._alignRight_1yhhnbc_21{
18
+ ._alignRight_1cj6yde_21{
14
19
  --_rs-cl-align:right;
15
20
  }
16
- ._sizeXs_1yhhnbc_25{
21
+ ._sizeXs_1cj6yde_25{
17
22
  --_rs-cl-chip-base-border-radius:4px;
18
23
  --_rs-cl-chip-compact-border-radius:var(--_rs-cl-chip-base-border-radius);
19
24
  --_rs-cl-chip-vertical-padding:2px;
@@ -27,7 +32,7 @@
27
32
  --_rs-cl-compact-horizontal-gap:4px;
28
33
  --_rs-cl-sparse-horizontal-gap:12px;
29
34
  }
30
- ._sizeXs_1yhhnbc_25 [data-rs-internal='chip-list__chip']{
35
+ ._sizeXs_1cj6yde_25 [data-rs-internal='chip-list__chip']{
31
36
  --_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
32
37
  --_rs-typography-text-transform:initial;
33
38
  --_rs-typography-font-variant-numeric:initial;
@@ -62,7 +67,7 @@
62
67
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
63
68
  --_rs-typography-link-border-bottom-width-from-text:1px;
64
69
  }
65
- ._sizeS_1yhhnbc_28{
70
+ ._sizeS_1cj6yde_28{
66
71
  --_rs-cl-chip-base-border-radius:16px;
67
72
  --_rs-cl-chip-compact-border-radius:4px;
68
73
  --_rs-cl-chip-vertical-padding:6px;
@@ -76,7 +81,7 @@
76
81
  --_rs-cl-compact-horizontal-gap:6px;
77
82
  --_rs-cl-sparse-horizontal-gap:12px;
78
83
  }
79
- ._sizeS_1yhhnbc_28 [data-rs-internal='chip-list__chip']{
84
+ ._sizeS_1cj6yde_28 [data-rs-internal='chip-list__chip']{
80
85
  --_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
81
86
  --_rs-typography-text-transform:initial;
82
87
  --_rs-typography-font-variant-numeric:initial;
@@ -111,7 +116,7 @@
111
116
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
112
117
  --_rs-typography-link-border-bottom-width-from-text:1px;
113
118
  }
114
- ._sizeM_1yhhnbc_31{
119
+ ._sizeM_1cj6yde_31{
115
120
  --_rs-cl-chip-base-border-radius:20px;
116
121
  --_rs-cl-chip-compact-border-radius:8px;
117
122
  --_rs-cl-chip-vertical-padding:8px;
@@ -125,7 +130,7 @@
125
130
  --_rs-cl-compact-horizontal-gap:6px;
126
131
  --_rs-cl-sparse-horizontal-gap:16px;
127
132
  }
128
- ._sizeM_1yhhnbc_31 [data-rs-internal='chip-list__chip']{
133
+ ._sizeM_1cj6yde_31 [data-rs-internal='chip-list__chip']{
129
134
  --_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
130
135
  --_rs-typography-text-transform:initial;
131
136
  --_rs-typography-font-variant-numeric:initial;
@@ -164,11 +169,11 @@
164
169
  --_rs-typography-link-border-bottom-width-from-text:1px;
165
170
  }
166
171
  @media screen and (max-width: 640px){
167
- ._sizeM_1yhhnbc_31 [data-rs-internal='chip-list__chip']{
172
+ ._sizeM_1cj6yde_31 [data-rs-internal='chip-list__chip']{
168
173
  --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
169
174
  }
170
175
  }
171
- ._sizeL_1yhhnbc_34{
176
+ ._sizeL_1cj6yde_34{
172
177
  --_rs-cl-chip-base-border-radius:26px;
173
178
  --_rs-cl-chip-compact-border-radius:12px;
174
179
  --_rs-cl-chip-vertical-padding:12px;
@@ -183,11 +188,11 @@
183
188
  --_rs-cl-sparse-horizontal-gap:16px;
184
189
  }
185
190
  @media screen and (max-width: 640px){
186
- ._sizeL_1yhhnbc_34{
191
+ ._sizeL_1cj6yde_34{
187
192
  --_rs-cl-vertical-gap:12px;
188
193
  }
189
194
  }
190
- ._sizeL_1yhhnbc_34 [data-rs-internal='chip-list__chip']{
195
+ ._sizeL_1cj6yde_34 [data-rs-internal='chip-list__chip']{
191
196
  --_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
192
197
  --_rs-typography-text-transform:initial;
193
198
  --_rs-typography-font-variant-numeric:initial;
@@ -226,34 +231,34 @@
226
231
  --_rs-typography-link-border-bottom-width-from-text:1px;
227
232
  }
228
233
  @media screen and (max-width: 640px){
229
- ._sizeL_1yhhnbc_34 [data-rs-internal='chip-list__chip']{
234
+ ._sizeL_1cj6yde_34 [data-rs-internal='chip-list__chip']{
230
235
  --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
231
236
  }
232
237
  }
233
- ._innerOffsetL_1yhhnbc_38{
238
+ ._innerOffsetL_1cj6yde_38{
234
239
  --_rs-cl-horizontal-gap-from-sparse:var(--_rs-cl-sparse-horizontal-gap);
235
240
  }
236
241
  @media screen and (max-width: 640px){
237
- ._innerOffsetL_1yhhnbc_38{
242
+ ._innerOffsetL_1cj6yde_38{
238
243
  --_rs-cl-horizontal-gap-from-sparse:var(--_rs-cl-base-horizontal-gap);
239
244
  }
240
245
  }
241
- ._innerOffsetM_1yhhnbc_41{
246
+ ._innerOffsetM_1cj6yde_41{
242
247
  --_rs-cl-horizontal-gap-from-sparse:initial;
243
248
  }
244
- ._classic_1yhhnbc_45{
249
+ ._classic_1cj6yde_45{
245
250
  --_rs-cl-chip-active-border-color:var(--_rs-color-primary);
246
251
  --_rs-cl-chip-selected-border-color:var(--_rs-color-primary);
247
252
  --_rs-cl-chip-hover-background:var(--_rs-color-primary-t-fog);
248
253
  --_rs-cl-chip-active-background:var(--_rs-color-primary-t-fog);
249
254
  }
250
- ._rock_1yhhnbc_48{
255
+ ._rock_1cj6yde_48{
251
256
  --_rs-cl-chip-active-border-color: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));
252
257
  --_rs-cl-chip-selected-border-color: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));
253
258
  --_rs-cl-chip-hover-background: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.1);
254
259
  --_rs-cl-chip-active-background: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.1);
255
260
  }
256
- ._compact_1yhhnbc_52{
261
+ ._compact_1cj6yde_52{
257
262
  --_rs-cl-chip-border-radius-from-compact:var(
258
263
  --_rs-cl-chip-compact-border-radius
259
264
  );
@@ -262,7 +267,7 @@
262
267
  );
263
268
  --_rs-cl-horizontal-gap-from-compact:var(--_rs-cl-compact-horizontal-gap);
264
269
  }
265
- ._main_1yhhnbc_56{
270
+ ._main_1cj6yde_56{
266
271
  --_rs-theme-dark:var(
267
272
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
268
273
  var(--rs-theme-dark, 0)
@@ -272,7 +277,7 @@
272
277
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
273
278
  }
274
279
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
275
- ._main_1yhhnbc_56{
280
+ ._main_1cj6yde_56{
276
281
  --_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)));
277
282
  --_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)));
278
283
  --_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)));
@@ -281,7 +286,7 @@
281
286
  }
282
287
  }
283
288
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
284
- ._main_1yhhnbc_56{
289
+ ._main_1cj6yde_56{
285
290
  --_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);
286
291
  --_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));
287
292
  --_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));
@@ -289,7 +294,7 @@
289
294
  --_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));
290
295
  }
291
296
  }
292
- ._main_1yhhnbc_56 {
297
+ ._main_1cj6yde_56 {
293
298
  --_rs-cl-chip-border-radius:var(
294
299
  --_rs-cl-chip-border-radius-from-compact,
295
300
  var(--_rs-cl-chip-base-border-radius)
@@ -303,7 +308,7 @@
303
308
  var(--_rs-cl-horizontal-gap-from-sparse, var(--_rs-cl-base-horizontal-gap))
304
309
  );
305
310
  }
306
- ._chipsContainer_1yhhnbc_62{
311
+ ._chipsContainer_1cj6yde_62{
307
312
  position:relative;
308
313
 
309
314
  display:flex;
@@ -312,17 +317,17 @@
312
317
 
313
318
  gap:var(--_rs-cl-vertical-gap) var(--_rs-cl-horizontal-gap);
314
319
  }
315
- ._alignIconLeft_1yhhnbc_72{
320
+ ._alignIconLeft_1cj6yde_72{
316
321
  --_rs-cl-chip-icon-flex-direction:row;
317
322
  --_rs-cl-chip-icon-position-multiplier-left:1;
318
323
  --_rs-cl-chip-icon-position-multiplier-right:0;
319
324
  }
320
- ._alignIconRight_1yhhnbc_75{
325
+ ._alignIconRight_1cj6yde_75{
321
326
  --_rs-cl-chip-icon-flex-direction:row-reverse;
322
327
  --_rs-cl-chip-icon-position-multiplier-left:0;
323
328
  --_rs-cl-chip-icon-position-multiplier-right:1;
324
329
  }
325
- ._chip_1yhhnbc_62{
330
+ ._chip_1cj6yde_62{
326
331
  letter-spacing:var(
327
332
  --rs-text-base-letter-spacing,
328
333
  var(--_rs-typography-letter-spacing)
@@ -374,25 +379,25 @@
374
379
  -moz-osx-font-smoothing:inherit;
375
380
  -webkit-appearance:none;
376
381
  }
377
- ._chip_1yhhnbc_62::-moz-focus-inner{
382
+ ._chip_1cj6yde_62::-moz-focus-inner{
378
383
  padding:0;
379
384
 
380
385
  border:none;
381
386
  }
382
- ._chip_1yhhnbc_62:hover,
383
- ._chip_1yhhnbc_62:focus,
384
- ._chip_1yhhnbc_62:active{
387
+ ._chip_1cj6yde_62:hover,
388
+ ._chip_1cj6yde_62:focus,
389
+ ._chip_1cj6yde_62:active{
385
390
  outline:none;
386
391
 
387
392
  text-decoration:none;
388
393
  }
389
- ._chip_1yhhnbc_62:focus[data-focus-method='key']{
394
+ ._chip_1cj6yde_62:focus[data-focus-method='key']{
390
395
  box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
391
396
  }
392
- ._chip_1yhhnbc_62:has(:focus[data-focus-method='key']){
397
+ ._chip_1cj6yde_62:has(:focus[data-focus-method='key']){
393
398
  box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
394
399
  }
395
- ._chip_1yhhnbc_62:focus{
400
+ ._chip_1cj6yde_62:focus{
396
401
  --_rs-cl-chip-border-color:rgba(
397
402
  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),
398
403
  calc(0.3 + var(--_rs-theme-dark-coefficient)*0.1)
@@ -401,7 +406,7 @@
401
406
  color: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));
402
407
  }
403
408
  @media (hover: hover){
404
- ._chip_1yhhnbc_62:hover{
409
+ ._chip_1cj6yde_62:hover{
405
410
  --_rs-cl-chip-border-color:rgba(
406
411
  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),
407
412
  calc(0.3 + var(--_rs-theme-dark-coefficient)*0.1)
@@ -412,20 +417,20 @@
412
417
  background:var(--_rs-cl-chip-hover-background);
413
418
  }
414
419
  }
415
- ._chip_1yhhnbc_62:active{
420
+ ._chip_1cj6yde_62:active{
416
421
  --_rs-cl-chip-border-color:var(--_rs-cl-chip-active-border-color);
417
422
 
418
423
  color: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));
419
424
 
420
425
  background:var(--_rs-cl-chip-active-background);
421
426
  }
422
- ._chip_1yhhnbc_62._selected_1yhhnbc_176{
427
+ ._chip_1cj6yde_62._selected_1cj6yde_176{
423
428
  --_rs-cl-chip-border-color:var(--_rs-cl-chip-selected-border-color);
424
429
  --_rs-cl-chip-border-width:2px;
425
430
 
426
431
  color: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));
427
432
  }
428
- ._disabled_1yhhnbc_183 ._chip_1yhhnbc_62{
433
+ ._disabled_1cj6yde_183 ._chip_1cj6yde_62{
429
434
  --_rs-cl-chip-border-color: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.2);
430
435
 
431
436
  pointer-events:none;
@@ -434,10 +439,10 @@
434
439
 
435
440
  background:transparent;
436
441
  }
437
- ._disabled_1yhhnbc_183 ._chip_1yhhnbc_62._selected_1yhhnbc_176{
442
+ ._disabled_1cj6yde_183 ._chip_1cj6yde_62._selected_1cj6yde_176{
438
443
  --_rs-cl-chip-border-color: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.4);
439
444
  }
440
- ._chip_1yhhnbc_62::before{
445
+ ._chip_1cj6yde_62::before{
441
446
  position:absolute;
442
447
  top:0;
443
448
  right:0;
@@ -454,7 +459,7 @@
454
459
 
455
460
  transition:border-color 100ms var(--rs-transition-function, ease);
456
461
  }
457
- ._chip_1yhhnbc_62 ._icon_1yhhnbc_216{
462
+ ._chip_1cj6yde_62 ._icon_1cj6yde_216{
458
463
  flex:0 0 auto;
459
464
 
460
465
  width:auto;
@@ -463,7 +468,7 @@
463
468
  margin:0;
464
469
  fill:currentColor;
465
470
  }
466
- ._hiddenInput_1yhhnbc_227{
471
+ ._hiddenInput_1cj6yde_227{
467
472
  position:absolute;
468
473
 
469
474
  overflow:hidden;
@@ -479,7 +484,7 @@
479
484
  white-space:nowrap;
480
485
  clip-path:inset(50%);
481
486
  }
482
- ._withoutText_1yhhnbc_244{
487
+ ._withoutText_1cj6yde_244{
483
488
  --_rs-cl-chip-horizontal-real-padding:var(--_rs-cl-chip-icon-only-padding);
484
489
  --_rs-cl-chip-vertical-real-padding:var(--_rs-cl-chip-icon-only-padding);
485
490
  }
@@ -1,27 +1,27 @@
1
1
  var styles = {
2
- "light": "_light_1yhhnbc_8",
3
- "dark": "_dark_1yhhnbc_11",
4
- "alignLeft": "_alignLeft_1yhhnbc_15",
5
- "alignCenter": "_alignCenter_1yhhnbc_18",
6
- "alignRight": "_alignRight_1yhhnbc_21",
7
- "sizeXs": "_sizeXs_1yhhnbc_25",
8
- "sizeS": "_sizeS_1yhhnbc_28",
9
- "sizeM": "_sizeM_1yhhnbc_31",
10
- "sizeL": "_sizeL_1yhhnbc_34",
11
- "innerOffsetL": "_innerOffsetL_1yhhnbc_38",
12
- "innerOffsetM": "_innerOffsetM_1yhhnbc_41",
13
- "classic": "_classic_1yhhnbc_45",
14
- "rock": "_rock_1yhhnbc_48",
15
- "compact": "_compact_1yhhnbc_52",
16
- "main": "_main_1yhhnbc_56",
17
- "chipsContainer": "_chipsContainer_1yhhnbc_62",
18
- "alignIconLeft": "_alignIconLeft_1yhhnbc_72",
19
- "alignIconRight": "_alignIconRight_1yhhnbc_75",
20
- "chip": "_chip_1yhhnbc_62",
21
- "selected": "_selected_1yhhnbc_176",
22
- "disabled": "_disabled_1yhhnbc_183",
23
- "icon": "_icon_1yhhnbc_216",
24
- "hiddenInput": "_hiddenInput_1yhhnbc_227",
25
- "withoutText": "_withoutText_1yhhnbc_244"
2
+ "light": "_light_1cj6yde_8",
3
+ "dark": "_dark_1cj6yde_11",
4
+ "alignLeft": "_alignLeft_1cj6yde_15",
5
+ "alignCenter": "_alignCenter_1cj6yde_18",
6
+ "alignRight": "_alignRight_1cj6yde_21",
7
+ "sizeXs": "_sizeXs_1cj6yde_25",
8
+ "sizeS": "_sizeS_1cj6yde_28",
9
+ "sizeM": "_sizeM_1cj6yde_31",
10
+ "sizeL": "_sizeL_1cj6yde_34",
11
+ "innerOffsetL": "_innerOffsetL_1cj6yde_38",
12
+ "innerOffsetM": "_innerOffsetM_1cj6yde_41",
13
+ "classic": "_classic_1cj6yde_45",
14
+ "rock": "_rock_1cj6yde_48",
15
+ "compact": "_compact_1cj6yde_52",
16
+ "main": "_main_1cj6yde_56",
17
+ "chipsContainer": "_chipsContainer_1cj6yde_62",
18
+ "alignIconLeft": "_alignIconLeft_1cj6yde_72",
19
+ "alignIconRight": "_alignIconRight_1cj6yde_75",
20
+ "chip": "_chip_1cj6yde_62",
21
+ "selected": "_selected_1cj6yde_176",
22
+ "disabled": "_disabled_1cj6yde_183",
23
+ "icon": "_icon_1cj6yde_216",
24
+ "hiddenInput": "_hiddenInput_1cj6yde_227",
25
+ "withoutText": "_withoutText_1cj6yde_244"
26
26
  };
27
27
  export { styles as default };
@@ -60,9 +60,18 @@ const useItemsIds = _ref2 => {
60
60
  let currentHasHref = false;
61
61
  let currentHasControls = false;
62
62
  let currentAllItemsHaveControls = true;
63
+ /*
64
+ * deepMap invokes its callback synchronously. The callback ref is created
65
+ * during render, but accesses tabRefs.current only when React invokes it
66
+ * during commit.
67
+ */
68
+ // eslint-disable-next-line react-hooks/refs
69
+
63
70
  const items = deepMap(children, child => {
64
71
  if (child.type === Chip) {
65
72
  if (hasElHref(child)) {
73
+ // same explanation as above
74
+ // eslint-disable-next-line react-hooks/immutability
66
75
  currentHasHref = true;
67
76
  }
68
77
 
@@ -38,11 +38,17 @@ const useRovingTabIndex = _ref2 => {
38
38
  tabRefs
39
39
  } = _ref2;
40
40
  const [currentTabStopId, setCurrentTabStopId] = React.useState(selectedId ?? 0);
41
- React.useEffect(() => {
41
+ const [previousSelectedId, setPreviousSelectedId] = React.useState(selectedId);
42
+
43
+ if (!Object.is(selectedId, previousSelectedId)) {
44
+ setPreviousSelectedId(selectedId);
45
+
42
46
  if (typeof selectedId !== 'undefined') {
43
47
  setCurrentTabStopId(selectedId);
44
48
  }
45
- }, [selectedId]);
49
+ }
50
+
51
+ const currentTabsRefs = tabRefs?.current;
46
52
  const onTabKeyDown = React.useCallback((e, itemId) => {
47
53
  var _context;
48
54
 
@@ -54,7 +60,7 @@ const useRovingTabIndex = _ref2 => {
54
60
  return;
55
61
  }
56
62
 
57
- const itemsCount = tabRefs?.current.size ?? 0;
63
+ const itemsCount = currentTabsRefs.size ?? 0;
58
64
  const nextItemId = getNextItemId({
59
65
  currentItemId: itemId,
60
66
  itemsCount,
@@ -62,8 +68,8 @@ const useRovingTabIndex = _ref2 => {
62
68
  });
63
69
  e.preventDefault();
64
70
  setCurrentTabStopId(nextItemId);
65
- tabRefs?.current.get(nextItemId)?.focus();
66
- }, [enabled, tabRefs]);
71
+ currentTabsRefs.get(nextItemId)?.focus();
72
+ }, [enabled, currentTabsRefs]);
67
73
  return {
68
74
  currentTabStopId,
69
75
  onTabKeyDown
@@ -1,2 +1,4 @@
1
1
  import React from 'react';
2
- export declare const useSafeId: typeof React.useId;
2
+ declare function useFallbackId(): number;
3
+ export declare const useSafeId: typeof React.useId | typeof useFallbackId;
4
+ export {};
@@ -1,15 +1,10 @@
1
- import React, { useRef } from 'react';
1
+ import React, { useState } from 'react';
2
+ let nextFallbackId = 0;
2
3
 
3
- const useFallbackId = () => {
4
- const id = useRef(null);
4
+ function useFallbackId() {
5
+ const [id] = useState(() => nextFallbackId++);
6
+ return id;
7
+ }
5
8
 
6
- if (id.current === null) {
7
- id.current = useFallbackId.counter++;
8
- }
9
-
10
- return id.current.toString();
11
- };
12
-
13
- useFallbackId.counter = 0;
14
9
  const useSafeId = React.useId ?? useFallbackId;
15
10
  export { useSafeId };
@@ -1,3 +1,8 @@
1
+ @property --_rs-theme-dark-coefficient{
2
+ syntax:'<number>';
3
+ inherits:true;
4
+ initial-value:0;
5
+ }
1
6
  @define-mixin rs-chip-list-align-left{
2
7
  &:not(html){
3
8
  --_rs-cl-align:left;
@@ -1,3 +1,8 @@
1
+ @property --_rs-theme-dark-coefficient{
2
+ syntax:'<number>';
3
+ inherits:true;
4
+ initial-value:0;
5
+ }
1
6
  @define-mixin rs-chip-list-align-left{
2
7
  &:not(html){
3
8
  --_rs-cl-align:left;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/chip-list",
3
- "version": "0.14.3",
3
+ "version": "0.14.5-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -25,15 +25,15 @@
25
25
  "react": ">=16.8.0 <20"
26
26
  },
27
27
  "devDependencies": {
28
- "@rescui/colors": "^0.3.2",
29
- "@rescui/scripts": "^0.5.2",
30
- "@rescui/typography": "^0.27.3",
31
- "@rescui/visual-regression": "^0.1.4"
28
+ "@rescui/colors": "0.3.4-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40",
29
+ "@rescui/scripts": "0.5.2",
30
+ "@rescui/typography": "0.27.5-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40",
31
+ "@rescui/visual-regression": "0.1.4"
32
32
  },
33
33
  "scripts": {
34
34
  "build": "rescui-scripts build && yarn run build-pcss-api",
35
35
  "build-pcss-api": "rescui-scripts build-pcss-api --file public-api.p.css"
36
36
  },
37
37
  "nx": {},
38
- "gitHead": "7614b4519a4716fbf1151d94c97fda48eab60800"
38
+ "gitHead": "405b9fa40886b0ab6709c9185e8214599d2d792e"
39
39
  }