@rescui/radio-button 0.10.6 → 0.10.8-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.
Files changed (12) hide show
  1. package/lib/index.css +65 -55
  2. package/lib/parts/radio-button-list.js +2 -2
  3. package/lib/parts/radio-button-list.p.module.css.js +13 -13
  4. package/lib/parts/radio-button-manager.js +3 -14
  5. package/lib/parts/radio-button.p.module.css.js +13 -13
  6. package/lib/parts/use-safe-id.d.ts +4 -0
  7. package/lib/parts/use-safe-id.js +10 -0
  8. package/lib/public-api.p.css +5 -0
  9. package/lib/public-api.pcss +5 -0
  10. package/package.json +7 -7
  11. package/lib/parts/use-backward-compatible-id.d.ts +0 -4
  12. package/lib/parts/use-backward-compatible-id.js +0 -14
package/lib/index.css CHANGED
@@ -1,35 +1,40 @@
1
- ._themeLight_lv0j0q_8{
1
+ @property --_rs-theme-dark-coefficient{
2
+ syntax:'<number>';
3
+ inherits:true;
4
+ initial-value:0;
5
+ }
6
+ ._themeLight_144qg00_8{
2
7
  --rs-theme-dark:0;
3
8
  }
4
- ._themeDark_lv0j0q_11{
9
+ ._themeDark_144qg00_11{
5
10
  --rs-theme-dark:1;
6
11
  }
7
- ._sizeS_lv0j0q_15{
12
+ ._sizeS_144qg00_15{
8
13
  --_rs-radio-button-size:20px;
9
14
  --_rs-radio-button-box-shadow-size:3px;
10
15
  --_rs-radio-button-active-icon-border-width:5px;
11
16
  }
12
- ._sizeM_lv0j0q_18{
17
+ ._sizeM_144qg00_18{
13
18
  --_rs-radio-button-size:24px;
14
19
  --_rs-radio-button-box-shadow-size:3px;
15
20
  --_rs-radio-button-active-icon-border-width:6px;
16
21
  }
17
- ._sizeL_lv0j0q_21{
22
+ ._sizeL_144qg00_21{
18
23
  --_rs-radio-button-size:28px;
19
24
  --_rs-radio-button-box-shadow-size:4px;
20
25
  --_rs-radio-button-active-icon-border-width:6px;
21
26
  }
22
- ._classic_lv0j0q_25{
27
+ ._classic_144qg00_25{
23
28
  --_rs-radio-button-active-icon-border-color:var(--_rs-color-primary);
24
29
  --_rs-radio-button-active-icon-background-color:#FFFFFF;
25
30
  --_rs-radio-button-active-icon-hover-box-shadow-color:var(--_rs-color-primary-t-fog);
26
31
  }
27
- ._rock_lv0j0q_28{
32
+ ._rock_144qg00_28{
28
33
  --_rs-radio-button-active-icon-border-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
29
34
  --_rs-radio-button-active-icon-background-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));
30
35
  --_rs-radio-button-active-icon-hover-box-shadow-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.1);
31
36
  }
32
- ._main_lv0j0q_32{
37
+ ._main_144qg00_32{
33
38
  --_rs-theme-dark:var(
34
39
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
35
40
  var(--rs-theme-dark, 0)
@@ -39,7 +44,7 @@
39
44
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
40
45
  }
41
46
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
42
- ._main_lv0j0q_32{
47
+ ._main_144qg00_32{
43
48
  --_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)));
44
49
  --_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)));
45
50
  --_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)));
@@ -48,7 +53,7 @@
48
53
  }
49
54
  }
50
55
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
51
- ._main_lv0j0q_32{
56
+ ._main_144qg00_32{
52
57
  --_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);
53
58
  --_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));
54
59
  --_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));
@@ -57,18 +62,18 @@
57
62
  }
58
63
  }
59
64
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
60
- ._main_lv0j0q_32{
65
+ ._main_144qg00_32{
61
66
  --_rs-color-danger:color-mix(in srgb, #CC1400 calc(100%*var(--_rs-theme-light-coefficient, 1)), #FF6553 calc(100%*var(--_rs-theme-dark-coefficient, 0)));
62
67
  --_rs-color-danger-bg:color-mix(in srgb, rgba(204,20,0, 0.2) calc(100%*var(--_rs-theme-light-coefficient, 1)), rgba(255,101,83, 0.2) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
63
68
  }
64
69
  }
65
70
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
66
- ._main_lv0j0q_32{
71
+ ._main_144qg00_32{
67
72
  --_rs-color-danger:rgb(calc(var(--_rs-theme-light-coefficient, 1)*204 + var(--_rs-theme-dark-coefficient, 0)*255), calc(var(--_rs-theme-light-coefficient, 1)*20 + var(--_rs-theme-dark-coefficient, 0)*101), calc(var(--_rs-theme-light-coefficient, 1)*0 + var(--_rs-theme-dark-coefficient, 0)*83));
68
73
  --_rs-color-danger-bg:rgba(calc(var(--_rs-theme-light-coefficient, 1)*204 + var(--_rs-theme-dark-coefficient, 0)*255), calc(var(--_rs-theme-light-coefficient, 1)*20 + var(--_rs-theme-dark-coefficient, 0)*101), calc(var(--_rs-theme-light-coefficient, 1)*0 + var(--_rs-theme-dark-coefficient, 0)*83), 0.2);
69
74
  }
70
75
  }
71
- ._main_lv0j0q_32 {
76
+ ._main_144qg00_32 {
72
77
 
73
78
  display:inline-block;
74
79
 
@@ -77,7 +82,7 @@
77
82
 
78
83
  vertical-align:middle;
79
84
  }
80
- ._input_lv0j0q_45{
85
+ ._input_144qg00_45{
81
86
  position:absolute;
82
87
  -webkit-appearance:none;
83
88
  -moz-appearance:none;
@@ -91,7 +96,7 @@
91
96
 
92
97
  border:0;
93
98
  }
94
- ._icon_lv0j0q_58{
99
+ ._icon_144qg00_58{
95
100
  position:relative;
96
101
 
97
102
  display:inline-block;
@@ -108,16 +113,16 @@
108
113
 
109
114
  background-color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*207), calc(255 - var(--_rs-theme-dark-coefficient, 0)*207), calc(255 - var(--_rs-theme-dark-coefficient, 0)*204));
110
115
  }
111
- ._enabled_lv0j0q_79 ._icon_lv0j0q_58{
116
+ ._enabled_144qg00_79 ._icon_144qg00_58{
112
117
  cursor:pointer;
113
118
  }
114
- ._enabled_lv0j0q_79:hover > ._icon_lv0j0q_58,
115
- label:hover ._enabled_lv0j0q_79 > ._icon_lv0j0q_58{
119
+ ._enabled_144qg00_79:hover > ._icon_144qg00_58,
120
+ label:hover ._enabled_144qg00_79 > ._icon_144qg00_58{
116
121
  background-color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*184), calc(255 - var(--_rs-theme-dark-coefficient, 0)*184), calc(255 - var(--_rs-theme-dark-coefficient, 0)*182));
117
122
  }
118
- ._disabled_lv0j0q_88 ._icon_lv0j0q_58._icon_lv0j0q_58,
119
- ._input_lv0j0q_45:disabled + ._icon_lv0j0q_58._icon_lv0j0q_58,
120
- ._input_lv0j0q_45:checked:disabled + ._icon_lv0j0q_58{
123
+ ._disabled_144qg00_88 ._icon_144qg00_58._icon_144qg00_58,
124
+ ._input_144qg00_45:disabled + ._icon_144qg00_58._icon_144qg00_58,
125
+ ._input_144qg00_45:checked:disabled + ._icon_144qg00_58{
121
126
  border-color:rgb(calc(186 - var(--_rs-theme-dark-coefficient, 0)*92), calc(186 - var(--_rs-theme-dark-coefficient, 0)*92), calc(187 - var(--_rs-theme-dark-coefficient, 0)*91));
122
127
 
123
128
  cursor:not-allowed;
@@ -125,36 +130,41 @@
125
130
 
126
131
  background-color:rgb(calc(244 - var(--_rs-theme-dark-coefficient, 0)*196), calc(244 - var(--_rs-theme-dark-coefficient, 0)*196), calc(244 - var(--_rs-theme-dark-coefficient, 0)*193));
127
132
  }
128
- ._enabled_lv0j0q_79 ._input_lv0j0q_45:active + ._icon_lv0j0q_58,
129
- ._enabled_lv0j0q_79 ._input_lv0j0q_45:checked + ._icon_lv0j0q_58{
133
+ ._enabled_144qg00_79 ._input_144qg00_45:active + ._icon_144qg00_58,
134
+ ._enabled_144qg00_79 ._input_144qg00_45:checked + ._icon_144qg00_58{
130
135
  border-color:var(--_rs-radio-button-active-icon-border-color);
131
136
 
132
137
  background-color:var(--_rs-radio-button-active-icon-background-color);
133
138
  }
134
- ._enabled_lv0j0q_79 ._input_lv0j0q_45:active + ._icon_lv0j0q_58,
135
- ._enabled_lv0j0q_79 ._input_lv0j0q_45:checked + ._icon_lv0j0q_58,
136
- ._main_lv0j0q_32 ._input_lv0j0q_45:checked:disabled + ._icon_lv0j0q_58{
139
+ ._enabled_144qg00_79 ._input_144qg00_45:active + ._icon_144qg00_58,
140
+ ._enabled_144qg00_79 ._input_144qg00_45:checked + ._icon_144qg00_58,
141
+ ._main_144qg00_32 ._input_144qg00_45:checked:disabled + ._icon_144qg00_58{
137
142
  border-width:var(--_rs-radio-button-active-icon-border-width);
138
143
  }
139
- ._error_lv0j0q_112 ._icon_lv0j0q_58._icon_lv0j0q_58._icon_lv0j0q_58{
144
+ ._error_144qg00_112 ._icon_144qg00_58._icon_144qg00_58._icon_144qg00_58{
140
145
  border-color:var(--_rs-color-danger);
141
146
  }
142
- ._enabled_lv0j0q_79:hover > ._icon_lv0j0q_58._icon_lv0j0q_58,
143
- label:hover ._enabled_lv0j0q_79 > ._icon_lv0j0q_58._icon_lv0j0q_58,
144
- ._enabled_lv0j0q_79 ._input_lv0j0q_45:active:not(:checked) + ._icon_lv0j0q_58{
147
+ ._enabled_144qg00_79:hover > ._icon_144qg00_58._icon_144qg00_58,
148
+ label:hover ._enabled_144qg00_79 > ._icon_144qg00_58._icon_144qg00_58,
149
+ ._enabled_144qg00_79 ._input_144qg00_45:active:not(:checked) + ._icon_144qg00_58{
145
150
  box-shadow:0 0 0 var(--_rs-radio-button-box-shadow-size) var(--_rs-radio-button-active-icon-hover-box-shadow-color);
146
151
  }
147
- ._enabled_lv0j0q_79 ._input_lv0j0q_45:focus[data-focus-method='key'] + ._icon_lv0j0q_58{
152
+ ._enabled_144qg00_79 ._input_144qg00_45:focus[data-focus-method='key'] + ._icon_144qg00_58{
148
153
  box-shadow:0 0 0 1px rgb(calc(232 - var(--_rs-theme-dark-coefficient, 0)*184), calc(232 - var(--_rs-theme-dark-coefficient, 0)*184), calc(232 - var(--_rs-theme-dark-coefficient, 0)*181)), 0 0 0 var(--_rs-radio-button-box-shadow-size) var(--_rs-color-primary-t-dim);
149
154
  }
150
155
 
151
- ._themeLight_16bquv1_6{
156
+ @property --_rs-theme-dark-coefficient{
157
+ syntax:'<number>';
158
+ inherits:true;
159
+ initial-value:0;
160
+ }
161
+ ._themeLight_85o81j_6{
152
162
  --rs-theme-dark:0;
153
163
  }
154
- ._themeDark_16bquv1_9{
164
+ ._themeDark_85o81j_9{
155
165
  --rs-theme-dark:1;
156
166
  }
157
- ._container_16bquv1_13{
167
+ ._container_85o81j_13{
158
168
  --_rs-theme-dark:var(
159
169
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
160
170
  var(--rs-theme-dark, 0)
@@ -164,7 +174,7 @@
164
174
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
165
175
  }
166
176
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
167
- ._container_16bquv1_13{
177
+ ._container_85o81j_13{
168
178
  --_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)));
169
179
  --_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)));
170
180
  --_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)));
@@ -173,7 +183,7 @@
173
183
  }
174
184
  }
175
185
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
176
- ._container_16bquv1_13{
186
+ ._container_85o81j_13{
177
187
  --_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);
178
188
  --_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));
179
189
  --_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));
@@ -181,11 +191,11 @@
181
191
  --_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));
182
192
  }
183
193
  }
184
- ._sizeS_16bquv1_18{
194
+ ._sizeS_85o81j_18{
185
195
  --_rs-radio-button-list-label-offset:4px;
186
196
  --_rs-radio-button-list-left-offset:28px;
187
197
  }
188
- ._sizeS_16bquv1_18 [data-rs-internal='radio-button-list__label']{
198
+ ._sizeS_85o81j_18 [data-rs-internal='radio-button-list__label']{
189
199
  --_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
190
200
  --_rs-typography-text-transform:initial;
191
201
  --_rs-typography-font-variant-numeric:initial;
@@ -220,7 +230,7 @@
220
230
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
221
231
  --_rs-typography-link-border-bottom-width-from-text:1px;
222
232
  }
223
- ._sizeS_16bquv1_18 [data-rs-internal='radio-button-list__bold-label']{
233
+ ._sizeS_85o81j_18 [data-rs-internal='radio-button-list__bold-label']{
224
234
  --_rs-typography-letter-spacing:var(--rs-h5-letter-spacing, normal);
225
235
  --_rs-typography-text-transform:initial;
226
236
  --_rs-typography-font-variant-numeric:initial;
@@ -252,11 +262,11 @@
252
262
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
253
263
  --_rs-typography-link-border-bottom-width-from-text:2px;
254
264
  }
255
- ._sizeM_16bquv1_21{
265
+ ._sizeM_85o81j_21{
256
266
  --_rs-radio-button-list-label-offset:8px;
257
267
  --_rs-radio-button-list-left-offset:32px;
258
268
  }
259
- ._sizeM_16bquv1_21 [data-rs-internal='radio-button-list__label']{
269
+ ._sizeM_85o81j_21 [data-rs-internal='radio-button-list__label']{
260
270
  --_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
261
271
  --_rs-typography-text-transform:initial;
262
272
  --_rs-typography-font-variant-numeric:initial;
@@ -295,11 +305,11 @@
295
305
  --_rs-typography-link-border-bottom-width-from-text:1px;
296
306
  }
297
307
  @media screen and (max-width: 640px){
298
- ._sizeM_16bquv1_21 [data-rs-internal='radio-button-list__label']{
308
+ ._sizeM_85o81j_21 [data-rs-internal='radio-button-list__label']{
299
309
  --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
300
310
  }
301
311
  }
302
- ._sizeM_16bquv1_21 [data-rs-internal='radio-button-list__bold-label']{
312
+ ._sizeM_85o81j_21 [data-rs-internal='radio-button-list__bold-label']{
303
313
  --_rs-typography-letter-spacing:var(--rs-h4-letter-spacing, normal);
304
314
  --_rs-typography-text-transform:initial;
305
315
  --_rs-typography-font-variant-numeric:initial;
@@ -331,11 +341,11 @@
331
341
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
332
342
  --_rs-typography-link-border-bottom-width-from-text:2px;
333
343
  }
334
- ._sizeL_16bquv1_24{
344
+ ._sizeL_85o81j_24{
335
345
  --_rs-radio-button-list-label-offset:12px;
336
346
  --_rs-radio-button-list-left-offset:44px;
337
347
  }
338
- ._sizeL_16bquv1_24 [data-rs-internal='radio-button-list__label']{
348
+ ._sizeL_85o81j_24 [data-rs-internal='radio-button-list__label']{
339
349
  --_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
340
350
  --_rs-typography-text-transform:initial;
341
351
  --_rs-typography-font-variant-numeric:initial;
@@ -374,11 +384,11 @@
374
384
  --_rs-typography-link-border-bottom-width-from-text:1px;
375
385
  }
376
386
  @media screen and (max-width: 640px){
377
- ._sizeL_16bquv1_24 [data-rs-internal='radio-button-list__label']{
387
+ ._sizeL_85o81j_24 [data-rs-internal='radio-button-list__label']{
378
388
  --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
379
389
  }
380
390
  }
381
- ._sizeL_16bquv1_24 [data-rs-internal='radio-button-list__bold-label']{
391
+ ._sizeL_85o81j_24 [data-rs-internal='radio-button-list__bold-label']{
382
392
  --_rs-typography-letter-spacing:var(--rs-h3-letter-spacing, normal);
383
393
  --_rs-typography-text-transform:initial;
384
394
  --_rs-typography-font-variant-numeric:initial;
@@ -410,10 +420,10 @@
410
420
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
411
421
  --_rs-typography-link-border-bottom-width-from-text:2px;
412
422
  }
413
- ._inner_16bquv1_28{
423
+ ._inner_85o81j_28{
414
424
  --rs-out-radio-button-list-left-offset:var(--_rs-radio-button-list-left-offset);
415
425
  }
416
- ._label_16bquv1_32{
426
+ ._label_85o81j_32{
417
427
  letter-spacing:var(
418
428
  --rs-text-base-letter-spacing,
419
429
  var(--_rs-typography-letter-spacing)
@@ -433,23 +443,23 @@
433
443
  margin:0 0 var(--_rs-radio-button-list-label-offset) 0;
434
444
  padding:0;
435
445
  }
436
- ._disabled_16bquv1_39 ._label_16bquv1_32{
446
+ ._disabled_85o81j_39 ._label_85o81j_32{
437
447
  color:var(
438
448
  --rs-color-pale,
439
449
  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.5)
440
450
  );
441
451
  }
442
- ._footer_16bquv1_44{
452
+ ._footer_85o81j_44{
443
453
  display:flex;
444
454
  flex-direction:column;
445
455
  }
446
- ._errorMessage_16bquv1_49{
456
+ ._errorMessage_85o81j_49{
447
457
  order:99;
448
458
  }
449
- ._error_16bquv1_49 ._errorMessage_16bquv1_49{
459
+ ._error_85o81j_49 ._errorMessage_85o81j_49{
450
460
  order:0;
451
461
  }
452
- ._note_16bquv1_58{
462
+ ._note_85o81j_58{
453
463
  --_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
454
464
  --_rs-typography-text-transform:initial;
455
465
  --_rs-typography-font-variant-numeric:initial;
@@ -509,7 +519,7 @@
509
519
 
510
520
  order:1;
511
521
  }
512
- ._disabled_16bquv1_39 ._note_16bquv1_58{
522
+ ._disabled_85o81j_39 ._note_85o81j_58{
513
523
  --_rs-typography-hardness-color:var(
514
524
  --rs-color-pale,
515
525
  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.5)
package/lib/parts/radio-button-list.js CHANGED
@@ -6,7 +6,7 @@ import { Menu } from '@rescui/menu';
6
6
  import { useThemeWithUndefined } from '@rescui/ui-contexts';
7
7
  import { ErrorMessage, shouldRenderErrorMessage } from '@rescui/form-field';
8
8
  import { RadioButtonManager } from './radio-button-manager.js';
9
- import { useBackwardCompatibleId } from './use-backward-compatible-id.js';
9
+ import { useSafeId } from './use-safe-id.js';
10
10
  import styles from './radio-button-list.p.module.css.js';
11
11
  const THEME_STYLES = {
12
12
  light: styles.themeLight,
@@ -36,7 +36,7 @@ const RadioButtonList = _ref => {
36
36
  ...restProps
37
37
  } = _ref;
38
38
  const theme = useThemeWithUndefined(themeFromProps);
39
- const uniqueId = `radio-button-list-${useBackwardCompatibleId()}`;
39
+ const uniqueId = `radio-button-list-${useSafeId()}`;
40
40
  const errorId = `${id ? id : uniqueId}-error`;
41
41
  const hasFooter = Boolean(note) || shouldRenderErrorMessage(error, reserveErrorLine);
42
42
  return /*#__PURE__*/React.createElement(RadioButtonManager, {
package/lib/parts/radio-button-list.p.module.css.js CHANGED
@@ -1,16 +1,16 @@
1
1
  var styles = {
2
- "themeLight": "_themeLight_16bquv1_6",
3
- "themeDark": "_themeDark_16bquv1_9",
4
- "container": "_container_16bquv1_13",
5
- "sizeS": "_sizeS_16bquv1_18",
6
- "sizeM": "_sizeM_16bquv1_21",
7
- "sizeL": "_sizeL_16bquv1_24",
8
- "inner": "_inner_16bquv1_28",
9
- "label": "_label_16bquv1_32",
10
- "disabled": "_disabled_16bquv1_39",
11
- "footer": "_footer_16bquv1_44",
12
- "errorMessage": "_errorMessage_16bquv1_49",
13
- "error": "_error_16bquv1_49",
14
- "note": "_note_16bquv1_58"
2
+ "themeLight": "_themeLight_85o81j_6",
3
+ "themeDark": "_themeDark_85o81j_9",
4
+ "container": "_container_85o81j_13",
5
+ "sizeS": "_sizeS_85o81j_18",
6
+ "sizeM": "_sizeM_85o81j_21",
7
+ "sizeL": "_sizeL_85o81j_24",
8
+ "inner": "_inner_85o81j_28",
9
+ "label": "_label_85o81j_32",
10
+ "disabled": "_disabled_85o81j_39",
11
+ "footer": "_footer_85o81j_44",
12
+ "errorMessage": "_errorMessage_85o81j_49",
13
+ "error": "_error_85o81j_49",
14
+ "note": "_note_85o81j_58"
15
15
  };
16
16
  export { styles as default };
package/lib/parts/radio-button-manager.js CHANGED
@@ -1,20 +1,9 @@
1
1
  "use client";
2
- import React, { useState, useCallback, useRef } from 'react';
2
+ import React, { useState, useCallback } from 'react';
3
3
  import PropTypes from 'prop-types';
4
4
  import { useThemeWithUndefined } from '@rescui/ui-contexts';
5
5
  import RadioContext from './radio-group-context.js';
6
-
7
- const useBackwardCompatibleId = () => {
8
- const id = useRef(null);
9
-
10
- if (id.current === null) {
11
- id.current = useBackwardCompatibleId.counter++;
12
- }
13
-
14
- return (React.useId ? React.useId : () => id.current)();
15
- };
16
-
17
- useBackwardCompatibleId.counter = 0;
6
+ import { useSafeId } from './use-safe-id.js';
18
7
 
19
8
  const RadioButtonManager = _ref => {
20
9
  let {
@@ -32,7 +21,7 @@ const RadioButtonManager = _ref => {
32
21
  const theme = useThemeWithUndefined(themeFromProps);
33
22
  const isControlled = typeof valueFromProps !== 'undefined';
34
23
  const [value, setValue] = useState(isControlled ? valueFromProps : defaultValue);
35
- const currentId = useBackwardCompatibleId();
24
+ const currentId = useSafeId();
36
25
  const name = nameFromProps ?? `_placeholder-radio-name-${currentId}`;
37
26
  const handleSetValue = useCallback(val => {
38
27
  setValue(val);
package/lib/parts/radio-button.p.module.css.js CHANGED
@@ -1,16 +1,16 @@
1
1
  var styles = {
2
- "themeLight": "_themeLight_lv0j0q_8",
3
- "themeDark": "_themeDark_lv0j0q_11",
4
- "sizeS": "_sizeS_lv0j0q_15",
5
- "sizeM": "_sizeM_lv0j0q_18",
6
- "sizeL": "_sizeL_lv0j0q_21",
7
- "classic": "_classic_lv0j0q_25",
8
- "rock": "_rock_lv0j0q_28",
9
- "main": "_main_lv0j0q_32",
10
- "input": "_input_lv0j0q_45",
11
- "icon": "_icon_lv0j0q_58",
12
- "enabled": "_enabled_lv0j0q_79",
13
- "disabled": "_disabled_lv0j0q_88",
14
- "error": "_error_lv0j0q_112"
2
+ "themeLight": "_themeLight_144qg00_8",
3
+ "themeDark": "_themeDark_144qg00_11",
4
+ "sizeS": "_sizeS_144qg00_15",
5
+ "sizeM": "_sizeM_144qg00_18",
6
+ "sizeL": "_sizeL_144qg00_21",
7
+ "classic": "_classic_144qg00_25",
8
+ "rock": "_rock_144qg00_28",
9
+ "main": "_main_144qg00_32",
10
+ "input": "_input_144qg00_45",
11
+ "icon": "_icon_144qg00_58",
12
+ "enabled": "_enabled_144qg00_79",
13
+ "disabled": "_disabled_144qg00_88",
14
+ "error": "_error_144qg00_112"
15
15
  };
16
16
  export { styles as default };
package/lib/parts/use-safe-id.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ declare function useFallbackId(): number;
3
+ export declare const useSafeId: typeof React.useId | typeof useFallbackId;
4
+ export {};
package/lib/parts/use-safe-id.js ADDED
@@ -0,0 +1,10 @@
1
+ import React, { useState } from 'react';
2
+ let nextFallbackId = 0;
3
+
4
+ function useFallbackId() {
5
+ const [id] = useState(() => nextFallbackId++);
6
+ return id;
7
+ }
8
+
9
+ const useSafeId = React.useId ?? useFallbackId;
10
+ export { useSafeId };
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-radio-button-list-size-s{
2
7
  &[class]{
3
8
  --_rs-radio-button-list-label-offset:4px;
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-radio-button-list-size-s{
2
7
  &[class]{
3
8
  --_rs-radio-button-list-label-offset:4px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/radio-button",
3
- "version": "0.10.6",
3
+ "version": "0.10.8-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -17,8 +17,8 @@
17
17
  },
18
18
  "dependencies": {
19
19
  "@babel/runtime-corejs3": "^7.26.0",
20
- "@rescui/form-field": "^0.1.6",
21
- "@rescui/menu": "^0.14.0",
20
+ "@rescui/form-field": "0.1.8-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40",
21
+ "@rescui/menu": "0.14.2-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40",
22
22
  "classnames": "^2.2.6"
23
23
  },
24
24
  "peerDependencies": {
@@ -27,14 +27,14 @@
27
27
  "react": ">=16.8.0 <20"
28
28
  },
29
29
  "devDependencies": {
30
- "@rescui/colors": "^0.3.2",
31
- "@rescui/scripts": "^0.5.2",
32
- "@rescui/typography": "^0.27.3"
30
+ "@rescui/colors": "0.3.4-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40",
31
+ "@rescui/scripts": "0.5.2",
32
+ "@rescui/typography": "0.27.5-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40"
33
33
  },
34
34
  "scripts": {
35
35
  "build": "rescui-scripts build && yarn run build-pcss-api",
36
36
  "build-pcss-api": "rescui-scripts build-pcss-api --file public-api.p.css"
37
37
  },
38
38
  "nx": {},
39
- "gitHead": "7614b4519a4716fbf1151d94c97fda48eab60800"
39
+ "gitHead": "405b9fa40886b0ab6709c9185e8214599d2d792e"
40
40
  }
package/lib/parts/use-backward-compatible-id.d.ts DELETED
@@ -1,4 +0,0 @@
1
- export declare const useBackwardCompatibleId: {
2
- (): string | number;
3
- counter: number;
4
- };
package/lib/parts/use-backward-compatible-id.js DELETED
@@ -1,14 +0,0 @@
1
- import React, { useRef } from 'react';
2
-
3
- const useBackwardCompatibleId = () => {
4
- const id = useRef(null);
5
-
6
- if (id.current === null) {
7
- id.current = useBackwardCompatibleId.counter++;
8
- }
9
-
10
- return (React.useId ? React.useId : () => id.current)();
11
- };
12
-
13
- useBackwardCompatibleId.counter = 0;
14
- export { useBackwardCompatibleId };