@rescui/collapse 0.8.4-RUI-297-Add-react-compiler-to-the-packages-build-dbbefd7b8.10 → 0.8.4-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.
Files changed (13) hide show
  1. package/lib/_virtual/index.css.js +12 -12
  2. package/lib/_virtual/plus.js +294 -63
  3. package/lib/_virtual/right.js +294 -63
  4. package/lib/collapse.js +130 -171
  5. package/lib/collapse.p.module.css.js +32 -32
  6. package/lib/index.css +104 -82
  7. package/lib/public-api.p.css +5 -0
  8. package/lib/public-api.pcss +5 -0
  9. package/lib/use-collapse-state.d.ts +4 -9
  10. package/lib/use-collapse-state.js +83 -137
  11. package/lib/use-safe-id.d.ts +2 -1
  12. package/lib/use-safe-id.js +1 -1
  13. package/package.json +5 -6
package/lib/index.css CHANGED
@@ -1,4 +1,9 @@
1
- ._icon_19upof9_4{
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
- ._icon_19upof9_4{
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
- ._icon_19upof9_4{
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
- ._icon_19upof9_4{
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
- ._sizeXS_19upof9_14{
40
+ ._sizeXS_wwfcil_14{
36
41
  --_rs-icons-height:16px;
37
42
  }
38
- ._sizeS_19upof9_18{
43
+ ._sizeS_wwfcil_18{
39
44
  --_rs-icons-height:20px;
40
45
  }
41
- ._sizeM_19upof9_22{
46
+ ._sizeM_wwfcil_22{
42
47
  --_rs-icons-height:24px;
43
48
  }
44
- ._sizeL_19upof9_26{
49
+ ._sizeL_wwfcil_26{
45
50
  --_rs-icons-height:28px;
46
51
  }
47
- ._light_19upof9_30{
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
- ._dark_19upof9_34{
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
- ._allVariants_19upof9_48{
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
- ._variant16_19upof9_53,
68
- ._variant20_19upof9_54,
69
- ._variant24_19upof9_55{
72
+ ._variant16_wwfcil_53,
73
+ ._variant20_wwfcil_54,
74
+ ._variant24_wwfcil_55{
70
75
  display:none;
71
76
  }
72
- ._variant28_19upof9_58{
77
+ ._variant28_wwfcil_58{
73
78
  display:block;
74
79
  }
75
80
  @container rs-icon (max-height: 24px){
76
- ._variant24_19upof9_55{
81
+ ._variant24_wwfcil_55{
77
82
  display:block;
78
83
  }
79
- ._variant28_19upof9_58{
84
+ ._variant28_wwfcil_58{
80
85
  display:none;
81
86
  }
82
87
  }
83
88
  @container rs-icon (max-height: 20px){
84
- ._variant20_19upof9_54{
89
+ ._variant20_wwfcil_54{
85
90
  display:block;
86
91
  }
87
- ._variant24_19upof9_55{
92
+ ._variant24_wwfcil_55{
88
93
  display:none;
89
94
  }
90
95
  }
91
96
  @container rs-icon (max-height: 16px){
92
- ._variant16_19upof9_53{
97
+ ._variant16_wwfcil_53{
93
98
  display:block;
94
99
  }
95
- ._variant20_19upof9_54{
100
+ ._variant20_wwfcil_54{
96
101
  display:none;
97
102
  }
98
103
  }
99
- ._themeLight_1t0qfuj_6{
104
+ @property --_rs-theme-dark-coefficient{
105
+ syntax:'<number>';
106
+ inherits:true;
107
+ initial-value:0;
108
+ }
109
+ ._themeLight_diwgr6_6{
100
110
  --rs-theme-dark:0;
101
111
  }
102
- ._themeDark_1t0qfuj_9{
112
+ ._themeDark_diwgr6_9{
103
113
  --rs-theme-dark:1;
104
114
  }
105
- ._sizeS_1t0qfuj_13{
115
+ ._sizeS_diwgr6_13{
106
116
  --_rs-collapse-vertical-padding:6px;
107
117
  --_rs-collapse-horizontal-padding:8px;
108
118
  --_rs-collapse-icon-size:20px;
109
119
  }
110
- ._sizeS_1t0qfuj_13 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
120
+ ._sizeS_diwgr6_13 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
111
121
  --_rs-typography-letter-spacing:var(--rs-h5-letter-spacing, normal);
112
122
  --_rs-typography-text-transform:initial;
113
123
  --_rs-typography-font-variant-numeric:initial;
@@ -139,7 +149,7 @@
139
149
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
140
150
  --_rs-typography-link-border-bottom-width-from-text:2px;
141
151
  }
142
- ._sizeS_1t0qfuj_13 > [data-rs-internal='collapse__content']{
152
+ ._sizeS_diwgr6_13 > [data-rs-internal='collapse__content']{
143
153
  --_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
144
154
  --_rs-typography-text-transform:initial;
145
155
  --_rs-typography-font-variant-numeric:initial;
@@ -174,12 +184,12 @@
174
184
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
175
185
  --_rs-typography-link-border-bottom-width-from-text:1px;
176
186
  }
177
- ._sizeM_1t0qfuj_16{
187
+ ._sizeM_diwgr6_16{
178
188
  --_rs-collapse-vertical-padding:8px;
179
189
  --_rs-collapse-horizontal-padding:8px;
180
190
  --_rs-collapse-icon-size:24px;
181
191
  }
182
- ._sizeM_1t0qfuj_16 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
192
+ ._sizeM_diwgr6_16 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
183
193
  --_rs-typography-letter-spacing:var(--rs-h4-letter-spacing, normal);
184
194
  --_rs-typography-text-transform:initial;
185
195
  --_rs-typography-font-variant-numeric:initial;
@@ -211,7 +221,7 @@
211
221
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
212
222
  --_rs-typography-link-border-bottom-width-from-text:2px;
213
223
  }
214
- ._sizeM_1t0qfuj_16 > [data-rs-internal='collapse__content']{
224
+ ._sizeM_diwgr6_16 > [data-rs-internal='collapse__content']{
215
225
  --_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
216
226
  --_rs-typography-text-transform:initial;
217
227
  --_rs-typography-font-variant-numeric:initial;
@@ -250,16 +260,16 @@
250
260
  --_rs-typography-link-border-bottom-width-from-text:1px;
251
261
  }
252
262
  @media screen and (max-width: 640px){
253
- ._sizeM_1t0qfuj_16 > [data-rs-internal='collapse__content']{
263
+ ._sizeM_diwgr6_16 > [data-rs-internal='collapse__content']{
254
264
  --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
255
265
  }
256
266
  }
257
- ._sizeL_1t0qfuj_19{
267
+ ._sizeL_diwgr6_19{
258
268
  --_rs-collapse-vertical-padding:12px;
259
269
  --_rs-collapse-horizontal-padding:16px;
260
270
  --_rs-collapse-icon-size:28px;
261
271
  }
262
- ._sizeL_1t0qfuj_19 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
272
+ ._sizeL_diwgr6_19 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
263
273
  --_rs-typography-letter-spacing:var(--rs-h3-letter-spacing, normal);
264
274
  --_rs-typography-text-transform:initial;
265
275
  --_rs-typography-font-variant-numeric:initial;
@@ -291,7 +301,7 @@
291
301
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
292
302
  --_rs-typography-link-border-bottom-width-from-text:2px;
293
303
  }
294
- ._sizeL_1t0qfuj_19 > [data-rs-internal='collapse__content']{
304
+ ._sizeL_diwgr6_19 > [data-rs-internal='collapse__content']{
295
305
  --_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
296
306
  --_rs-typography-text-transform:initial;
297
307
  --_rs-typography-font-variant-numeric:initial;
@@ -330,11 +340,11 @@
330
340
  --_rs-typography-link-border-bottom-width-from-text:1px;
331
341
  }
332
342
  @media screen and (max-width: 640px){
333
- ._sizeL_1t0qfuj_19 > [data-rs-internal='collapse__content']{
343
+ ._sizeL_diwgr6_19 > [data-rs-internal='collapse__content']{
334
344
  --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
335
345
  }
336
346
  }
337
- ._classic_1t0qfuj_23{
347
+ ._classic_diwgr6_23{
338
348
  --_rs-collapse-active-theme-flip:0;
339
349
  --_rs-collapse-active-background:rgba(
340
350
  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),
@@ -348,7 +358,7 @@
348
358
  );
349
359
  --_rs-collapse-button-hover-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), 1);
350
360
  }
351
- ._rock_1t0qfuj_26{
361
+ ._rock_diwgr6_26{
352
362
  --_rs-collapse-active-theme-flip:1;
353
363
  --_rs-collapse-active-background: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));
354
364
  --_rs-collapse-active-border-bottom-to-padding-multiplier:1;
@@ -359,7 +369,7 @@
359
369
  );
360
370
  --_rs-collapse-button-hover-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), 1);
361
371
  }
362
- ._clear_1t0qfuj_29{
372
+ ._clear_diwgr6_29{
363
373
  --_rs-collapse-active-theme-flip:0;
364
374
  --_rs-collapse-active-background:transparent;
365
375
  --_rs-collapse-active-border-bottom-to-padding-multiplier:0;
@@ -370,27 +380,27 @@
370
380
  0.7
371
381
  );
372
382
  }
373
- ._hasBorderBottom_1t0qfuj_33{
383
+ ._hasBorderBottom_diwgr6_33{
374
384
  --_rs-collapse-border-bottom-width-or-initial:1px;
375
385
  }
376
- ._leftIcon_1t0qfuj_37{
386
+ ._leftIcon_diwgr6_37{
377
387
  --_rs-collapse-button-flex-direction:row;
378
388
  --_rs-collapse-icon-margin:0 var(--_rs-collapse-horizontal-padding) 0 0;
379
389
  --_rs-collapse-inner-wrapper-padding-left-base:calc(var(--_rs-collapse-horizontal-padding)*2 + var(--_rs-collapse-icon-size));
380
390
  }
381
- ._rightIcon_1t0qfuj_40{
391
+ ._rightIcon_diwgr6_40{
382
392
  --_rs-collapse-button-flex-direction:row-reverse;
383
393
  --_rs-collapse-icon-margin:0 0 0 var(--_rs-collapse-horizontal-padding);
384
394
  --_rs-collapse-inner-wrapper-padding-left-base:var(
385
395
  --_rs-collapse-horizontal-padding
386
396
  );
387
397
  }
388
- ._disableLeftPadding_1t0qfuj_44{
398
+ ._disableLeftPadding_diwgr6_44{
389
399
  --_rs-collapse-inner-wrapper-padding-left-from-disable-left-padding-or-initial:var(
390
400
  --_rs-collapse-horizontal-padding
391
401
  );
392
402
  }
393
- ._main_1t0qfuj_48{
403
+ ._main_diwgr6_48{
394
404
  --_rs-theme-dark:var(
395
405
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
396
406
  var(--rs-theme-dark, 0)
@@ -400,7 +410,7 @@
400
410
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
401
411
  }
402
412
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
403
- ._main_1t0qfuj_48{
413
+ ._main_diwgr6_48{
404
414
  --_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)));
405
415
  --_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)));
406
416
  --_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)));
@@ -409,7 +419,7 @@
409
419
  }
410
420
  }
411
421
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
412
- ._main_1t0qfuj_48{
422
+ ._main_diwgr6_48{
413
423
  --_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);
414
424
  --_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));
415
425
  --_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));
@@ -417,7 +427,7 @@
417
427
  --_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));
418
428
  }
419
429
  }
420
- ._main_1t0qfuj_48 {
430
+ ._main_diwgr6_48 {
421
431
  --_rs-collapse-border-bottom-width:var(
422
432
  --_rs-collapse-border-bottom-width-or-initial,
423
433
  0px
@@ -432,9 +442,9 @@
432
442
  border-bottom:var(--_rs-collapse-border-bottom-width) solid 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);
433
443
  border-radius:var(--rs-collapse-border-radius, 0px);
434
444
  }
435
- ._main_1t0qfuj_48._opening_1t0qfuj_59,
436
- ._main_1t0qfuj_48._opened_1t0qfuj_60,
437
- ._main_1t0qfuj_48._closing_1t0qfuj_61{
445
+ ._main_diwgr6_48._opening_diwgr6_59,
446
+ ._main_diwgr6_48._opened_diwgr6_60,
447
+ ._main_diwgr6_48._closing_diwgr6_61{
438
448
  --rs-theme-flip:var(--_rs-collapse-active-theme-flip);
439
449
 
440
450
  padding-bottom:calc(var(--_rs-collapse-border-bottom-width)*var(--_rs-collapse-active-border-bottom-to-padding-multiplier));
@@ -444,7 +454,7 @@
444
454
  background:var(--_rs-collapse-active-background);
445
455
  }
446
456
  @media (hover: hover){
447
- ._main_1t0qfuj_48:hover{
457
+ ._main_diwgr6_48:hover{
448
458
  --rs-theme-flip:var(--_rs-collapse-active-theme-flip);
449
459
 
450
460
  padding-bottom:calc(var(--_rs-collapse-border-bottom-width)*var(--_rs-collapse-active-border-bottom-to-padding-multiplier));
@@ -454,7 +464,7 @@
454
464
  background:var(--_rs-collapse-active-background);
455
465
  }
456
466
  }
457
- ._title_1t0qfuj_95{
467
+ ._title_diwgr6_95{
458
468
  letter-spacing:var(
459
469
  --rs-text-base-letter-spacing,
460
470
  var(--_rs-typography-letter-spacing)
@@ -471,7 +481,7 @@
471
481
 
472
482
  color:inherit;
473
483
  }
474
- ._content_1t0qfuj_103{
484
+ ._content_diwgr6_103{
475
485
  letter-spacing:var(
476
486
  --rs-text-base-letter-spacing,
477
487
  var(--_rs-typography-letter-spacing)
@@ -488,26 +498,32 @@
488
498
  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))
489
499
  );
490
500
 
491
- will-change:height;
501
+ display:grid;
502
+
503
+ overflow:hidden;
492
504
 
493
- height:0;
505
+ grid-template-rows:minmax(0, 0fr);
506
+
507
+ will-change:grid-template-rows;
494
508
  }
495
- ._closed_1t0qfuj_111 > ._content_1t0qfuj_103{
496
- display:none;
509
+ ._animationEnabled_diwgr6_115 ._content_diwgr6_103{
510
+ transition:grid-template-rows 300ms var(--rs-transition-function, ease);
497
511
  }
498
- ._opened_1t0qfuj_60 > ._content_1t0qfuj_103{
499
- height:initial;
512
+ ._opening_diwgr6_59 > ._content_diwgr6_103,
513
+ ._opened_diwgr6_60 > ._content_diwgr6_103{
514
+ grid-template-rows:minmax(0, 1fr);
500
515
  }
501
- ._opening_1t0qfuj_59 > ._content_1t0qfuj_103,
502
- ._closingTransition_1t0qfuj_120 > ._content_1t0qfuj_103{
503
- overflow:hidden;
504
-
505
- transition:height 300ms var(--rs-transition-function, ease);
516
+ ._opened_diwgr6_60 > ._content_diwgr6_103{
517
+ overflow:visible;
518
+ }
519
+ ._closed_diwgr6_128 > ._content_diwgr6_103{
520
+ visibility:hidden;
506
521
  }
507
- ._innerWrapper_1t0qfuj_127{
522
+ ._innerWrapper_diwgr6_133{
523
+ min-height:0;
508
524
  padding:0 var(--_rs-collapse-horizontal-padding) var(--_rs-collapse-horizontal-padding) var(--_rs-collapse-inner-wrapper-padding-left);
509
525
  }
510
- ._button_1t0qfuj_133{
526
+ ._button_diwgr6_140{
511
527
  color:var(
512
528
  --rs-color-hard,
513
529
  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))
@@ -535,29 +551,31 @@
535
551
 
536
552
  font:inherit;
537
553
  line-height:normal;
538
- transition:var(--_rs-collapse-button-transition);
539
554
  -webkit-font-smoothing:inherit;
540
555
  -moz-osx-font-smoothing:inherit;
541
556
  -webkit-appearance:none;
542
557
  }
543
- ._button_1t0qfuj_133::-moz-focus-inner{
558
+ ._button_diwgr6_140::-moz-focus-inner{
544
559
  padding:0;
545
560
 
546
561
  border:0;
547
562
  }
548
- ._button_1t0qfuj_133:focus{
563
+ ._animationEnabled_diwgr6_115 ._button_diwgr6_140{
564
+ transition:var(--_rs-collapse-button-transition);
565
+ }
566
+ ._button_diwgr6_140:focus{
549
567
  outline:none;
550
568
  }
551
- ._button_1t0qfuj_133:focus[data-focus-method='key']{
569
+ ._button_diwgr6_140:focus[data-focus-method='key']{
552
570
  box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
553
571
  }
554
572
  @media (hover: hover){
555
- ._button_1t0qfuj_133:hover{
573
+ ._button_diwgr6_140:hover{
556
574
  color:var(--_rs-collapse-button-hover-color);
557
575
  background:var(--_rs-collapse-button-hover-background);
558
576
  }
559
577
  }
560
- ._icon_1t0qfuj_186{
578
+ ._icon_diwgr6_196{
561
579
  position:relative;
562
580
  top:0;
563
581
  left:0;
@@ -568,39 +586,43 @@
568
586
  height:var(--_rs-collapse-icon-size);
569
587
  margin:var(--_rs-collapse-icon-margin);
570
588
 
571
- transition:transform 300ms var(--rs-transition-function, ease);
589
+ transform:rotate(0);
590
+
572
591
  transform-origin:center center;
573
592
 
574
593
  will-change:transform;
575
594
  }
576
- ._opening_1t0qfuj_59._iconPlus_1t0qfuj_202 > ._button_1t0qfuj_133 > ._icon_1t0qfuj_186,
577
- ._opened_1t0qfuj_60._iconPlus_1t0qfuj_202 > ._button_1t0qfuj_133 > ._icon_1t0qfuj_186{
595
+ ._animationEnabled_diwgr6_115 ._icon_diwgr6_196{
596
+ transition:transform 300ms var(--rs-transition-function, ease);
597
+ }
598
+ ._opening_diwgr6_59._iconPlus_diwgr6_217 > ._button_diwgr6_140 > ._icon_diwgr6_196,
599
+ ._opened_diwgr6_60._iconPlus_diwgr6_217 > ._button_diwgr6_140 > ._icon_diwgr6_196{
578
600
  transform:rotate(45deg);
579
601
  }
580
- ._opening_1t0qfuj_59._iconArrow_1t0qfuj_207 > ._button_1t0qfuj_133 > ._icon_1t0qfuj_186,
581
- ._opened_1t0qfuj_60._iconArrow_1t0qfuj_207 > ._button_1t0qfuj_133 > ._icon_1t0qfuj_186{
602
+ ._opening_diwgr6_59._iconArrow_diwgr6_222 > ._button_diwgr6_140 > ._icon_diwgr6_196,
603
+ ._opened_diwgr6_60._iconArrow_diwgr6_222 > ._button_diwgr6_140 > ._icon_diwgr6_196{
582
604
  transform:rotate(90deg);
583
605
  }
584
- ._accordion_1t0qfuj_213{
606
+ ._accordion_diwgr6_228{
585
607
  display:flex;
586
608
  flex-direction:column;
587
609
  row-gap:var(--_rs-collapse-accordion-gap);
588
610
  }
589
- ._accordionGap0_1t0qfuj_218{
611
+ ._accordionGap0_diwgr6_233{
590
612
  --_rs-collapse-accordion-gap:0px;
591
613
  }
592
- ._accordionGap8_1t0qfuj_221{
614
+ ._accordionGap8_diwgr6_236{
593
615
  --_rs-collapse-accordion-gap:8px;
594
616
  }
595
- ._accordionGap12_1t0qfuj_224{
617
+ ._accordionGap12_diwgr6_239{
596
618
  --_rs-collapse-accordion-gap:12px;
597
619
  }
598
- ._accordionGap16_1t0qfuj_227{
620
+ ._accordionGap16_diwgr6_242{
599
621
  --_rs-collapse-accordion-gap:16px;
600
622
  }
601
- ._accordionGap24_1t0qfuj_230{
623
+ ._accordionGap24_diwgr6_245{
602
624
  --_rs-collapse-accordion-gap:24px;
603
625
  }
604
- ._accordionGap32_1t0qfuj_233{
626
+ ._accordionGap32_diwgr6_248{
605
627
  --_rs-collapse-accordion-gap:32px;
606
628
  }
package/lib/public-api.p.css CHANGED
@@ -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-collapse-size-s{
2
7
  &[class]{
3
8
  --_rs-collapse-vertical-padding:6px;
package/lib/public-api.pcss CHANGED
@@ -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-collapse-size-s{
2
7
  &[class]{
3
8
  --_rs-collapse-vertical-padding:6px;
package/lib/use-collapse-state.d.ts CHANGED
@@ -1,18 +1,13 @@
1
+ import type { RefObject } from 'react';
1
2
  export declare enum COLLAPSE_STATES {
2
3
  OPENING = "OPENING",
3
4
  OPEN = "OPEN",
4
- CLOSING_PREPARE = "CLOSING_PREPARE",
5
5
  CLOSING = "CLOSING",
6
6
  CLOSE = "CLOSE"
7
7
  }
8
- type InitialState = {
8
+ type UseCollapseStateOptions = {
9
9
  shouldBeOpened: boolean;
10
- cancelAnimation?: boolean;
11
- };
12
- export declare function useCollapseState({ shouldBeOpened, cancelAnimation }: InitialState): {
13
- contentRef: import("react").RefObject<HTMLDivElement>;
14
- isStartedClosing: boolean;
15
- onAnimationEnd: () => void;
16
- state: COLLAPSE_STATES;
10
+ contentRef: RefObject<HTMLDivElement | null>;
17
11
  };
12
+ export declare function useCollapseState({ shouldBeOpened, contentRef }: UseCollapseStateOptions): COLLAPSE_STATES;
18
13
  export {};