@rescui/checkbox 0.7.3 → 0.8.0

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 (9) hide show
  1. package/lib/_virtual/index.css.js +10 -0
  2. package/lib/_virtual/warning.js +37 -0
  3. package/lib/checkbox.js +34 -8
  4. package/lib/index.css +352 -81
  5. package/lib/parts/checkbox-list.js +23 -5
  6. package/lib/parts/checkbox.p.module.css.js +28 -21
  7. package/lib/public-api.p.css +284 -5
  8. package/lib/public-api.pcss +284 -5
  9. package/package.json +6 -6
package/lib/index.css CHANGED
@@ -1,10 +1,297 @@
1
- ._themeLight_1nf82u1_8{
1
+ ._icon_1jmu341_4{
2
+ --_rs-theme-dark:var(
3
+ --_rs-internal-force-theme-dark-consult-rescui-before-using,
4
+ var(--rs-theme-dark, 0)
5
+ );
6
+ --_rs-theme-flip:var(--rs-theme-flip, 0);
7
+ --_rs-theme-dark-coefficient:calc(var(--_rs-theme-dark)*(1 - var(--_rs-theme-flip)) + var(--_rs-theme-flip)*(1 - var(--_rs-theme-dark)));
8
+ --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
9
+ }
10
+ @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
11
+ ._icon_1jmu341_4{
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
+ --_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
+ --_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)));
15
+ --_rs-color-primary-t-dim:color-mix(in srgb, var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-t-dim-dark-theme, rgba(132, 115, 255,0.8)) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
16
+ --_rs-color-primary-t-fog:color-mix(in srgb, var(--rs-color-primary-t-fog-light-theme, rgba(107, 87, 255,0.2)) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-t-fog-dark-theme, rgba(132, 115, 255,0.3)) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
17
+ }
18
+ }
19
+ @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
20
+ ._icon_1jmu341_4{
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
+ --_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
+ --_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));
24
+ --_rs-color-primary-t-dim: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, 0.8);
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
+ }
27
+ }
28
+ ._icon_1jmu341_4{
29
+
30
+ fill:var(--_rs-icons-themed-fill-or-initial, currentcolor);
31
+
32
+ width:auto;
33
+ height:var(--_rs-icons-height);
34
+ }
35
+ ._sizeXS_1jmu341_14{
36
+ --_rs-icons-height:16px;
37
+ }
38
+ ._sizeS_1jmu341_18{
39
+ --_rs-icons-height:20px;
40
+ }
41
+ ._sizeM_1jmu341_22{
42
+ --_rs-icons-height:24px;
43
+ }
44
+ ._sizeL_1jmu341_26{
45
+ --_rs-icons-height:28px;
46
+ }
47
+ ._light_1jmu341_30{
2
48
  --rs-theme-dark:0;
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));
3
50
  }
4
- ._themeDark_1nf82u1_11{
51
+ ._dark_1jmu341_34{
5
52
  --rs-theme-dark:1;
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));
6
54
  }
7
- ._sizeS_1nf82u1_15{
55
+ @-webkit-keyframes rs-icon-rotate{
56
+ from{
57
+ -webkit-transform:rotate(0deg);
58
+ transform:rotate(0deg);
59
+ }
60
+ to{
61
+ -webkit-transform:rotate(360deg);
62
+ transform:rotate(360deg);
63
+ }
64
+ }
65
+ @keyframes rs-icon-rotate{
66
+ from{
67
+ -webkit-transform:rotate(0deg);
68
+ transform:rotate(0deg);
69
+ }
70
+ to{
71
+ -webkit-transform:rotate(360deg);
72
+ transform:rotate(360deg);
73
+ }
74
+ }
75
+ ._themeLight_1heg86p_8{
76
+ --rs-theme-dark:0;
77
+ }
78
+ ._themeDark_1heg86p_11{
79
+ --rs-theme-dark:1;
80
+ }
81
+ ._container_1heg86p_15{
82
+ --_rs-theme-dark:var(
83
+ --_rs-internal-force-theme-dark-consult-rescui-before-using,
84
+ var(--rs-theme-dark, 0)
85
+ );
86
+ --_rs-theme-flip:var(--rs-theme-flip, 0);
87
+ --_rs-theme-dark-coefficient:calc(var(--_rs-theme-dark)*(1 - var(--_rs-theme-flip)) + var(--_rs-theme-flip)*(1 - var(--_rs-theme-dark)));
88
+ --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
89
+ }
90
+ @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
91
+ ._container_1heg86p_15{
92
+ --_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)));
93
+ --_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)));
94
+ --_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)));
95
+ --_rs-color-primary-t-dim:color-mix(in srgb, var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-t-dim-dark-theme, rgba(132, 115, 255,0.8)) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
96
+ --_rs-color-primary-t-fog:color-mix(in srgb, var(--rs-color-primary-t-fog-light-theme, rgba(107, 87, 255,0.2)) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-t-fog-dark-theme, rgba(132, 115, 255,0.3)) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
97
+ }
98
+ }
99
+ @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
100
+ ._container_1heg86p_15{
101
+ --_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);
102
+ --_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));
103
+ --_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));
104
+ --_rs-color-primary-t-dim: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, 0.8);
105
+ --_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));
106
+ }
107
+ }
108
+ ._listSizeS_1heg86p_20 [data-rs-internal='checkbox-list__error-message']{
109
+ --_rs-typography-letter-spacing:normal;
110
+ --_rs-typography-text-transform:initial;
111
+ --_rs-typography-font-variant-numeric:initial;
112
+ --_rs-typography-font-family:var(
113
+ --rs-font-family-ui,
114
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
115
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
116
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
117
+ );
118
+ --_rs-typography-font-size:var(--rs-h5-font-size, 13px);
119
+ --_rs-typography-font-weight:var(
120
+ --rs-font-weight-semi-bold,
121
+ 600
122
+ );
123
+ --_rs-typography-line-height:var(--rs-h5-line-height, 20px);
124
+ --_rs-typography-base-color:var(
125
+ --rs-color-hard,
126
+ 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))
127
+ );
128
+ --_rs-typography-text-auto-offset:0;
129
+ --_rs-typography-ul-list-li-padding-left:initial;
130
+ --_rs-typography-ol-list-li-padding-left:initial;
131
+ --_rs-typography-list-li-margin-top-from-text:initial;
132
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
133
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
134
+ --_rs-typography-link-border-bottom-width-from-text:2px;
135
+ }
136
+ ._listSizeS_1heg86p_20 [data-rs-internal='checkbox-list__error-icon']:not(html){
137
+ --_rs-icons-height:20px;
138
+ }
139
+ ._listSizeM_1heg86p_23 [data-rs-internal='checkbox-list__error-message']{
140
+ --_rs-typography-letter-spacing:normal;
141
+ --_rs-typography-text-transform:initial;
142
+ --_rs-typography-font-variant-numeric:initial;
143
+ --_rs-typography-font-family:var(
144
+ --rs-font-family-ui,
145
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
146
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
147
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
148
+ );
149
+ --_rs-typography-font-size:var(--rs-h5-font-size, 13px);
150
+ --_rs-typography-font-weight:var(
151
+ --rs-font-weight-semi-bold,
152
+ 600
153
+ );
154
+ --_rs-typography-line-height:var(--rs-h5-line-height, 20px);
155
+ --_rs-typography-base-color:var(
156
+ --rs-color-hard,
157
+ 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))
158
+ );
159
+ --_rs-typography-text-auto-offset:0;
160
+ --_rs-typography-ul-list-li-padding-left:initial;
161
+ --_rs-typography-ol-list-li-padding-left:initial;
162
+ --_rs-typography-list-li-margin-top-from-text:initial;
163
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
164
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
165
+ --_rs-typography-link-border-bottom-width-from-text:2px;
166
+ }
167
+ ._listSizeM_1heg86p_23 [data-rs-internal='checkbox-list__error-icon']:not(html){
168
+ --_rs-icons-height:20px;
169
+ }
170
+ ._listSizeL_1heg86p_26 [data-rs-internal='checkbox-list__error-message']{
171
+ --_rs-typography-letter-spacing:normal;
172
+ --_rs-typography-text-transform:initial;
173
+ --_rs-typography-font-variant-numeric:initial;
174
+ --_rs-typography-font-family:var(
175
+ --rs-font-family-ui,
176
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
177
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
178
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
179
+ );
180
+ --_rs-typography-font-size:var(--rs-h4-font-size, 16px);
181
+ --_rs-typography-font-weight:var(
182
+ --rs-font-weight-semi-bold,
183
+ 600
184
+ );
185
+ --_rs-typography-line-height:var(--rs-h4-line-height, 24px);
186
+ --_rs-typography-base-color:var(
187
+ --rs-color-hard,
188
+ 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))
189
+ );
190
+ --_rs-typography-text-auto-offset:0;
191
+ --_rs-typography-ul-list-li-padding-left:initial;
192
+ --_rs-typography-ol-list-li-padding-left:initial;
193
+ --_rs-typography-list-li-margin-top-from-text:initial;
194
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
195
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
196
+ --_rs-typography-link-border-bottom-width-from-text:2px;
197
+ }
198
+ ._listSizeL_1heg86p_26 [data-rs-internal='checkbox-list__error-icon']:not(html){
199
+ --_rs-icons-height:24px;
200
+ }
201
+ ._checkboxSizeS_1heg86p_30 [data-rs-internal='checkbox__error-message']{
202
+ --_rs-typography-letter-spacing:normal;
203
+ --_rs-typography-text-transform:initial;
204
+ --_rs-typography-font-variant-numeric:initial;
205
+ --_rs-typography-font-family:var(
206
+ --rs-font-family-ui,
207
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
208
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
209
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
210
+ );
211
+ --_rs-typography-font-size:var(--rs-h5-font-size, 13px);
212
+ --_rs-typography-font-weight:var(
213
+ --rs-font-weight-semi-bold,
214
+ 600
215
+ );
216
+ --_rs-typography-line-height:var(--rs-h5-line-height, 20px);
217
+ --_rs-typography-base-color:var(
218
+ --rs-color-hard,
219
+ 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))
220
+ );
221
+ --_rs-typography-text-auto-offset:0;
222
+ --_rs-typography-ul-list-li-padding-left:initial;
223
+ --_rs-typography-ol-list-li-padding-left:initial;
224
+ --_rs-typography-list-li-margin-top-from-text:initial;
225
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
226
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
227
+ --_rs-typography-link-border-bottom-width-from-text:2px;
228
+ }
229
+ ._checkboxSizeS_1heg86p_30 [data-rs-internal='checkbox__error-icon']:not(html){
230
+ --_rs-icons-height:20px;
231
+ }
232
+ ._checkboxSizeM_1heg86p_33 [data-rs-internal='checkbox__error-message']{
233
+ --_rs-typography-letter-spacing:normal;
234
+ --_rs-typography-text-transform:initial;
235
+ --_rs-typography-font-variant-numeric:initial;
236
+ --_rs-typography-font-family:var(
237
+ --rs-font-family-ui,
238
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
239
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
240
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
241
+ );
242
+ --_rs-typography-font-size:var(--rs-h5-font-size, 13px);
243
+ --_rs-typography-font-weight:var(
244
+ --rs-font-weight-semi-bold,
245
+ 600
246
+ );
247
+ --_rs-typography-line-height:var(--rs-h5-line-height, 20px);
248
+ --_rs-typography-base-color:var(
249
+ --rs-color-hard,
250
+ 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))
251
+ );
252
+ --_rs-typography-text-auto-offset:0;
253
+ --_rs-typography-ul-list-li-padding-left:initial;
254
+ --_rs-typography-ol-list-li-padding-left:initial;
255
+ --_rs-typography-list-li-margin-top-from-text:initial;
256
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
257
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
258
+ --_rs-typography-link-border-bottom-width-from-text:2px;
259
+ }
260
+ ._checkboxSizeM_1heg86p_33 [data-rs-internal='checkbox__error-icon']:not(html){
261
+ --_rs-icons-height:20px;
262
+ }
263
+ ._checkboxSizeL_1heg86p_36 [data-rs-internal='checkbox__error-message']{
264
+ --_rs-typography-letter-spacing:normal;
265
+ --_rs-typography-text-transform:initial;
266
+ --_rs-typography-font-variant-numeric:initial;
267
+ --_rs-typography-font-family:var(
268
+ --rs-font-family-ui,
269
+ var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
270
+ BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
271
+ 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
272
+ );
273
+ --_rs-typography-font-size:var(--rs-h4-font-size, 16px);
274
+ --_rs-typography-font-weight:var(
275
+ --rs-font-weight-semi-bold,
276
+ 600
277
+ );
278
+ --_rs-typography-line-height:var(--rs-h4-line-height, 24px);
279
+ --_rs-typography-base-color:var(
280
+ --rs-color-hard,
281
+ 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))
282
+ );
283
+ --_rs-typography-text-auto-offset:0;
284
+ --_rs-typography-ul-list-li-padding-left:initial;
285
+ --_rs-typography-ol-list-li-padding-left:initial;
286
+ --_rs-typography-list-li-margin-top-from-text:initial;
287
+ --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
288
+ --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
289
+ --_rs-typography-link-border-bottom-width-from-text:2px;
290
+ }
291
+ ._checkboxSizeL_1heg86p_36 [data-rs-internal='checkbox__error-icon']:not(html){
292
+ --_rs-icons-height:24px;
293
+ }
294
+ ._sizeS_1heg86p_40{
8
295
  --_rs-checkbox-ci-mark-s-display:initial;
9
296
  --_rs-checkbox-ci-mark-m-display:none;
10
297
  --_rs-checkbox-ci-mark-l-display:none;
@@ -12,7 +299,7 @@
12
299
  --_rs-checkbox-ci-shadow-size:3px;
13
300
  --_rs-checkbox-ci-indeterminate-icon-border-width:6px 3px;
14
301
  }
15
- ._sizeM_1nf82u1_18{
302
+ ._sizeM_1heg86p_43{
16
303
  --_rs-checkbox-ci-mark-s-display:none;
17
304
  --_rs-checkbox-ci-mark-m-display:initial;
18
305
  --_rs-checkbox-ci-mark-l-display:none;
@@ -20,7 +307,7 @@
20
307
  --_rs-checkbox-ci-shadow-size:3px;
21
308
  --_rs-checkbox-ci-indeterminate-icon-border-width:8px 3px;
22
309
  }
23
- ._sizeL_1nf82u1_21{
310
+ ._sizeL_1heg86p_46{
24
311
  --_rs-checkbox-ci-mark-s-display:none;
25
312
  --_rs-checkbox-ci-mark-m-display:none;
26
313
  --_rs-checkbox-ci-mark-l-display:initial;
@@ -28,14 +315,14 @@
28
315
  --_rs-checkbox-ci-shadow-size:4px;
29
316
  --_rs-checkbox-ci-indeterminate-icon-border-width:9px 3px;
30
317
  }
31
- ._classic_1nf82u1_25{
318
+ ._classic_1heg86p_50{
32
319
  --_rs-checkbox-ci-mark-color:#FFFFFF;
33
320
  --_rs-checkbox-ci-indeterminate-icon-border-color:var(--_rs-color-primary);
34
321
  --_rs-checkbox-ci-indeterminate-icon-background-color:#FFFFFF;
35
322
  --_rs-checkbox-ci-checked-icon-border-color:var(--_rs-color-primary);
36
323
  --_rs-checkbox-ci-hover-icon-box-shadow:var(--_rs-color-primary-t-fog);
37
324
  }
38
- ._rock_1nf82u1_28{
325
+ ._rock_1heg86p_53{
39
326
  --_rs-checkbox-ci-mark-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));
40
327
  --_rs-checkbox-ci-indeterminate-icon-border-color:rgb(
41
328
  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)
@@ -51,7 +338,7 @@
51
338
  0.1
52
339
  );
53
340
  }
54
- ._checkbox_1nf82u1_32{
341
+ ._checkbox_1heg86p_30{
55
342
  --_rs-theme-dark:var(
56
343
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
57
344
  var(--rs-theme-dark, 0)
@@ -61,7 +348,7 @@
61
348
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
62
349
  }
63
350
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
64
- ._checkbox_1nf82u1_32{
351
+ ._checkbox_1heg86p_30{
65
352
  --_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)));
66
353
  --_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)));
67
354
  --_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)));
@@ -70,7 +357,7 @@
70
357
  }
71
358
  }
72
359
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
73
- ._checkbox_1nf82u1_32{
360
+ ._checkbox_1heg86p_30{
74
361
  --_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);
75
362
  --_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));
76
363
  --_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));
@@ -78,7 +365,7 @@
78
365
  --_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));
79
366
  }
80
367
  }
81
- ._checkbox_1nf82u1_32 {
368
+ ._checkbox_1heg86p_30 {
82
369
 
83
370
  position:relative;
84
371
 
@@ -95,7 +382,7 @@
95
382
 
96
383
  text-align:left;
97
384
  }
98
- ._errorMessage_1nf82u1_54{
385
+ ._errorMessage_1heg86p_79{
99
386
  letter-spacing:var(
100
387
  --rs-text-base-letter-spacing,
101
388
  var(--_rs-typography-letter-spacing)
@@ -109,52 +396,36 @@
109
396
  -webkit-font-feature-settings:'kern', 'liga', 'calt';
110
397
  font-feature-settings:'kern', 'liga', 'calt';
111
398
  }
112
- ._errorMessage_1nf82u1_54 > p:not(:nth-child(1)),
113
- ._errorMessage_1nf82u1_54 > pre:not(:nth-child(1)){
399
+ ._errorMessage_1heg86p_79 > p:not(:nth-child(1)),
400
+ ._errorMessage_1heg86p_79 > pre:not(:nth-child(1)){
114
401
  padding-top:var(--_rs-typography-auto-offset-or-initial);
115
402
  }
116
- ._errorMessage_1nf82u1_54 {
117
- --_rs-typography-letter-spacing:0.0045em;
118
- --_rs-typography-text-transform:initial;
119
- --_rs-typography-font-variant-numeric:initial;
120
- --_rs-typography-font-family:var(
121
- --rs-font-family-ui,
122
- var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system,
123
- BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
124
- 'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
125
- );
126
- --_rs-typography-font-size:var(--rs-text-3-font-size, 13px);
127
- --_rs-typography-font-weight:var(
128
- --rs-font-weight-regular,
129
- 400
130
- );
131
- --_rs-typography-line-height:var(
132
- --rs-text-3-line-height,
133
- 20px
134
- );
135
- --_rs-typography-base-color:var(
136
- --_rs-typography-hardness-color,
137
- var(
138
- --rs-color-average,
139
- 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.7)
140
- )
141
- );
142
- --_rs-typography-text-auto-offset:8px;
143
- --_rs-typography-ul-list-li-padding-left:28px;
144
- --_rs-typography-ol-list-li-padding-left:21px;
145
- --_rs-typography-list-li-margin-top-from-text:8px;
146
- --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
147
- --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
148
- --_rs-typography-link-border-bottom-width-from-text:1px;
149
- color:#F45C4A;
403
+ ._errorMessage_1heg86p_79 {
404
+
405
+ display:-webkit-box;
406
+
407
+ display:-ms-flexbox;
408
+
409
+ display:flex;
410
+ -ms-flex-wrap:nowrap;
411
+ flex-wrap:nowrap;
412
+
413
+ 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));
414
+ -webkit-column-gap:8px;
415
+ -moz-column-gap:8px;
416
+ column-gap:8px;
150
417
  }
151
- ._errorMessage_1nf82u1_54._list_1nf82u1_59{
152
- margin-bottom:12px;
418
+ ._errorMessage_1heg86p_79._list_1heg86p_20{
419
+ margin-bottom:8px;
153
420
  }
154
- ._errorMessage_1nf82u1_54._single_1nf82u1_63{
155
- margin-top:8px;
156
- }
157
- ._input_1nf82u1_68{
421
+ ._errorIcon_1heg86p_93{
422
+ -webkit-box-flex:0;
423
+ -ms-flex:0 0 auto;
424
+ flex:0 0 auto;
425
+
426
+ color:#F45C4A;
427
+ }
428
+ ._input_1heg86p_99{
158
429
  position:absolute;
159
430
  z-index:-1;
160
431
 
@@ -164,7 +435,7 @@
164
435
 
165
436
  border:0;
166
437
  }
167
- ._icon_1nf82u1_79{
438
+ ._icon_1heg86p_110{
168
439
  display:inline-block;
169
440
  float:left;
170
441
 
@@ -184,17 +455,17 @@
184
455
 
185
456
  transition:border-width ease-out 100ms, border-color ease-out 100ms;
186
457
  }
187
- ._enabled_1nf82u1_95 ._icon_1nf82u1_79{
458
+ ._enabled_1heg86p_126 ._icon_1heg86p_110{
188
459
  cursor:pointer;
189
460
  }
190
- ._indeterminate_1nf82u1_99 ._icon_1nf82u1_79{
461
+ ._indeterminate_1heg86p_130 ._icon_1heg86p_110{
191
462
  border-width:var(--_rs-checkbox-ci-indeterminate-icon-border-width);
192
463
  }
193
- ._input_1nf82u1_68:checked + ._icon_1nf82u1_79{
464
+ ._input_1heg86p_99:checked + ._icon_1heg86p_110{
194
465
  border-width:calc(var(--_rs-checkbox-ci-size)/2);
195
466
  }
196
- ._disabled_1nf82u1_107 ._icon_1nf82u1_79._icon_1nf82u1_79,
197
- ._input_1nf82u1_68:disabled + ._icon_1nf82u1_79{
467
+ ._disabled_1heg86p_138 ._icon_1heg86p_110._icon_1heg86p_110,
468
+ ._input_1heg86p_99:disabled + ._icon_1heg86p_110{
198
469
  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));
199
470
 
200
471
  cursor:not-allowed;
@@ -202,27 +473,27 @@
202
473
 
203
474
  background: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));
204
475
  }
205
- ._input_1nf82u1_68:hover + ._icon_1nf82u1_79,
206
- ._enabled_1nf82u1_95:hover ._icon_1nf82u1_79{
476
+ ._input_1heg86p_99:hover + ._icon_1heg86p_110,
477
+ ._enabled_1heg86p_126:hover ._icon_1heg86p_110{
207
478
  background: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));
208
479
  }
209
- ._enabled_1nf82u1_95._indeterminate_1nf82u1_99 ._icon_1nf82u1_79,
210
- ._enabled_1nf82u1_95._indeterminate_1nf82u1_99:hover ._icon_1nf82u1_79,
211
- ._enabled_1nf82u1_95._indeterminate_1nf82u1_99 ._input_1nf82u1_68:hover + ._icon_1nf82u1_79{
480
+ ._enabled_1heg86p_126._indeterminate_1heg86p_130 ._icon_1heg86p_110,
481
+ ._enabled_1heg86p_126._indeterminate_1heg86p_130:hover ._icon_1heg86p_110,
482
+ ._enabled_1heg86p_126._indeterminate_1heg86p_130 ._input_1heg86p_99:hover + ._icon_1heg86p_110{
212
483
  border-color:var(--_rs-checkbox-ci-indeterminate-icon-border-color);
213
484
 
214
485
  background-color:var(
215
486
  --_rs-checkbox-ci-indeterminate-icon-background-color
216
487
  );
217
488
  }
218
- ._enabled_1nf82u1_95 ._input_1nf82u1_68:checked + ._icon_1nf82u1_79._icon_1nf82u1_79{
489
+ ._enabled_1heg86p_126 ._input_1heg86p_99:checked + ._icon_1heg86p_110._icon_1heg86p_110{
219
490
  border-color:var(--_rs-checkbox-ci-checked-icon-border-color);
220
491
  }
221
- ._error_1nf82u1_54 ._icon_1nf82u1_79._icon_1nf82u1_79._icon_1nf82u1_79._icon_1nf82u1_79,
222
- ._input_1nf82u1_68:invalid + ._icon_1nf82u1_79._icon_1nf82u1_79._icon_1nf82u1_79{
492
+ ._error_1heg86p_79 ._icon_1heg86p_110._icon_1heg86p_110._icon_1heg86p_110._icon_1heg86p_110,
493
+ ._input_1heg86p_99:invalid + ._icon_1heg86p_110._icon_1heg86p_110._icon_1heg86p_110{
223
494
  border-color:#F45C4A;
224
495
  }
225
- ._icon_1nf82u1_79::after{
496
+ ._icon_1heg86p_110::after{
226
497
  position:absolute;
227
498
  top:var(--_rs-checkbox-ci-shadow-size);
228
499
  right:var(--_rs-checkbox-ci-shadow-size);
@@ -231,17 +502,17 @@
231
502
 
232
503
  content:'';
233
504
  }
234
- ._enabled_1nf82u1_95:hover > ._icon_1nf82u1_79::after,
235
- label:hover ._enabled_1nf82u1_95 > ._icon_1nf82u1_79::after,
236
- ._enabled_1nf82u1_95 ._input_1nf82u1_68:active + ._icon_1nf82u1_79::after{
505
+ ._enabled_1heg86p_126:hover > ._icon_1heg86p_110::after,
506
+ label:hover ._enabled_1heg86p_126 > ._icon_1heg86p_110::after,
507
+ ._enabled_1heg86p_126 ._input_1heg86p_99:active + ._icon_1heg86p_110::after{
237
508
  -webkit-box-shadow:0 0 0 var(--_rs-checkbox-ci-shadow-size) var(--_rs-checkbox-ci-hover-icon-box-shadow);
238
509
  box-shadow:0 0 0 var(--_rs-checkbox-ci-shadow-size) var(--_rs-checkbox-ci-hover-icon-box-shadow);
239
510
  }
240
- ._enabled_1nf82u1_95 ._input_1nf82u1_68:focus[data-focus-method='key'] + ._icon_1nf82u1_79::after{
511
+ ._enabled_1heg86p_126 ._input_1heg86p_99:focus[data-focus-method='key'] + ._icon_1heg86p_110::after{
241
512
  -webkit-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-checkbox-ci-shadow-size) var(--_rs-color-primary-t-dim);
242
513
  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-checkbox-ci-shadow-size) var(--_rs-color-primary-t-dim);
243
514
  }
244
- ._checkmark_1nf82u1_163{
515
+ ._checkmark_1heg86p_194{
245
516
  position:absolute;
246
517
  top:var(--_rs-checkbox-ci-shadow-size);
247
518
  left:var(--_rs-checkbox-ci-shadow-size);
@@ -252,22 +523,22 @@
252
523
  height:var(--_rs-checkbox-ci-size);
253
524
  fill:currentColor;
254
525
  }
255
- ._enabled_1nf82u1_95 ._checkmark_1nf82u1_163{
526
+ ._enabled_1heg86p_126 ._checkmark_1heg86p_194{
256
527
  color:var(--_rs-checkbox-ci-mark-color);
257
528
  }
258
- ._disabled_1nf82u1_107 ._checkmark_1nf82u1_163,
259
- ._input_1nf82u1_68:disabled + ._icon_1nf82u1_79 > ._checkmark_1nf82u1_163{
529
+ ._disabled_1heg86p_138 ._checkmark_1heg86p_194,
530
+ ._input_1heg86p_99:disabled + ._icon_1heg86p_110 > ._checkmark_1heg86p_194{
260
531
  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));
261
532
  }
262
- ._input_1nf82u1_68:checked + ._icon_1nf82u1_79 > ._checkmark_1nf82u1_163{
533
+ ._input_1heg86p_99:checked + ._icon_1heg86p_110 > ._checkmark_1heg86p_194{
263
534
  display:block;
264
535
  }
265
- ._markS_1nf82u1_188{
536
+ ._markS_1heg86p_219{
266
537
  display:var(--_rs-checkbox-ci-mark-s-display);
267
538
  }
268
- ._markM_1nf82u1_191{
539
+ ._markM_1heg86p_222{
269
540
  display:var(--_rs-checkbox-ci-mark-m-display);
270
541
  }
271
- ._markL_1nf82u1_194{
542
+ ._markL_1heg86p_225{
272
543
  display:var(--_rs-checkbox-ci-mark-l-display);
273
544
  }
package/lib/parts/checkbox-list.js CHANGED
@@ -17,13 +17,25 @@ import React from 'react';
17
17
  import PropTypes from 'prop-types';
18
18
  import { Menu } from '@rescui/menu';
19
19
  import cn from 'classnames';
20
+ import { useThemeWithUndefined } from '@rescui/ui-contexts';
21
+ import WarningIcon from '../_virtual/warning.js';
20
22
  import styles from './checkbox.p.module.css.js';
21
23
  import CheckboxManager from './checkbox-manager.js';
24
+ var THEME_STYLES = {
25
+ light: styles.themeLight,
26
+ dark: styles.themeDark
27
+ };
28
+ var SIZE_STYLES = {
29
+ s: styles.listSizeS,
30
+ m: styles.listSizeM,
31
+ l: styles.listSizeL
32
+ };
22
33
 
23
34
  var CheckboxList = function CheckboxList(_ref) {
24
35
  var mode = _ref.mode,
25
- size = _ref.size,
26
- theme = _ref.theme,
36
+ _ref$size = _ref.size,
37
+ size = _ref$size === void 0 ? 'm' : _ref$size,
38
+ themeFromProps = _ref.theme,
27
39
  disabled = _ref.disabled,
28
40
  children = _ref.children,
29
41
  onChange = _ref.onChange,
@@ -34,6 +46,7 @@ var CheckboxList = function CheckboxList(_ref) {
34
46
  style = _ref.style,
35
47
  restProps = _objectWithoutProperties(_ref, _excluded);
36
48
 
49
+ var theme = useThemeWithUndefined(themeFromProps);
37
50
  return /*#__PURE__*/React.createElement(CheckboxManager, {
38
51
  theme: theme,
39
52
  defaultValue: defaultValue,
@@ -46,11 +59,16 @@ var CheckboxList = function CheckboxList(_ref) {
46
59
  size: size,
47
60
  mode: mode
48
61
  }, /*#__PURE__*/React.createElement("div", {
49
- className: className,
62
+ className: cn(className, styles.container, THEME_STYLES[theme], SIZE_STYLES[size] || styles.listSizeM),
50
63
  style: style
51
64
  }, error && typeof error !== 'boolean' && /*#__PURE__*/React.createElement("div", {
52
- className: cn(styles.errorMessage, styles.list)
53
- }, error), /*#__PURE__*/React.createElement(Menu, _objectSpread({
65
+ className: cn(styles.errorMessage, styles.list),
66
+ "data-test": "checkbox-error-message",
67
+ "data-rs-internal": "checkbox-list__error-message"
68
+ }, /*#__PURE__*/React.createElement(WarningIcon, {
69
+ "data-rs-internal": "checkbox-list__error-icon",
70
+ className: styles.errorIcon
71
+ }), /*#__PURE__*/React.createElement("span", null, error)), /*#__PURE__*/React.createElement(Menu, _objectSpread({
54
72
  tag: 'div',
55
73
  itemTag: null,
56
74
  size: size,