@khanacademy/wonder-blocks-form 4.0.8 → 4.1.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.
- package/CHANGELOG.md +21 -0
- package/dist/components/checkbox-core.d.ts +4 -8
- package/dist/components/checkbox-core.js.flow +7 -10
- package/dist/components/checkbox.d.ts +3 -2
- package/dist/components/checkbox.js.flow +3 -2
- package/dist/components/choice-internal.d.ts +2 -4
- package/dist/components/choice-internal.js.flow +2 -4
- package/dist/components/radio-core.d.ts +1 -8
- package/dist/components/radio-core.js.flow +4 -10
- package/dist/es/index.js +123 -97
- package/dist/index.js +122 -96
- package/dist/util/types.d.ts +4 -1
- package/dist/util/types.js.flow +7 -1
- package/package.json +6 -6
- package/src/__tests__/__snapshots__/custom-snapshot.test.tsx.snap +261 -743
- package/src/__tests__/custom-snapshot.test.tsx +29 -44
- package/src/components/__tests__/checkbox.test.js +84 -0
- package/src/components/__tests__/labeled-text-field.test.tsx +4 -1
- package/src/components/checkbox-core.tsx +91 -49
- package/src/components/checkbox-group.tsx +2 -2
- package/src/components/checkbox.tsx +4 -2
- package/src/components/choice-internal.tsx +32 -42
- package/src/components/radio-core.tsx +41 -37
- package/src/components/radio-group.tsx +2 -2
- package/src/components/text-field.tsx +13 -8
- package/src/util/types.ts +6 -1
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -1,14 +1,31 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
|
-
exports[`CheckboxCore type:default
|
|
3
|
+
exports[`CheckboxCore type:default checked:false 1`] = `
|
|
4
4
|
<input
|
|
5
|
+
aria-checked="false"
|
|
5
6
|
aria-invalid={false}
|
|
6
7
|
checked={false}
|
|
7
8
|
className=""
|
|
8
9
|
disabled={false}
|
|
9
10
|
onChange={[Function]}
|
|
11
|
+
onClick={[Function]}
|
|
10
12
|
style={
|
|
11
13
|
{
|
|
14
|
+
":active": {
|
|
15
|
+
"backgroundColor": "#dae6fd",
|
|
16
|
+
"borderColor": "#1865f2",
|
|
17
|
+
"borderWidth": 2,
|
|
18
|
+
},
|
|
19
|
+
":focusVisible": {
|
|
20
|
+
"backgroundColor": "#ffffff",
|
|
21
|
+
"borderColor": "#1865f2",
|
|
22
|
+
"borderWidth": 2,
|
|
23
|
+
},
|
|
24
|
+
":hover": {
|
|
25
|
+
"backgroundColor": "#ffffff",
|
|
26
|
+
"borderColor": "#1865f2",
|
|
27
|
+
"borderWidth": 2,
|
|
28
|
+
},
|
|
12
29
|
"MozAppearance": "none",
|
|
13
30
|
"WebkitAppearance": "none",
|
|
14
31
|
"appearance": "none",
|
|
@@ -30,16 +47,27 @@ exports[`CheckboxCore type:default state:default checked:false 1`] = `
|
|
|
30
47
|
/>
|
|
31
48
|
`;
|
|
32
49
|
|
|
33
|
-
exports[`CheckboxCore type:default
|
|
50
|
+
exports[`CheckboxCore type:default checked:null 1`] = `
|
|
34
51
|
[
|
|
35
52
|
<input
|
|
53
|
+
aria-checked="mixed"
|
|
36
54
|
aria-invalid={false}
|
|
37
|
-
checked={true}
|
|
38
55
|
className=""
|
|
39
56
|
disabled={false}
|
|
40
57
|
onChange={[Function]}
|
|
58
|
+
onClick={[Function]}
|
|
41
59
|
style={
|
|
42
60
|
{
|
|
61
|
+
":active": {
|
|
62
|
+
"background": "#1b50b3",
|
|
63
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1b50b3",
|
|
64
|
+
},
|
|
65
|
+
":focusVisible": {
|
|
66
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1865f2",
|
|
67
|
+
},
|
|
68
|
+
":hover": {
|
|
69
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1865f2",
|
|
70
|
+
},
|
|
43
71
|
"MozAppearance": "none",
|
|
44
72
|
"WebkitAppearance": "none",
|
|
45
73
|
"appearance": "none",
|
|
@@ -75,53 +103,35 @@ exports[`CheckboxCore type:default state:default checked:true 1`] = `
|
|
|
75
103
|
width={16}
|
|
76
104
|
>
|
|
77
105
|
<path
|
|
78
|
-
d="
|
|
106
|
+
d="M3 8C3 7.44772 3.44772 7 4 7H12C12.5523 7 13 7.44772 13 8C13 8.55228 12.5523 9 12 9H4C3.44772 9 3 8.55228 3 8Z"
|
|
79
107
|
fill="#ffffff"
|
|
80
108
|
/>
|
|
81
109
|
</svg>,
|
|
82
110
|
]
|
|
83
111
|
`;
|
|
84
112
|
|
|
85
|
-
exports[`CheckboxCore type:default
|
|
86
|
-
<input
|
|
87
|
-
aria-invalid={false}
|
|
88
|
-
checked={false}
|
|
89
|
-
className=""
|
|
90
|
-
disabled={false}
|
|
91
|
-
onChange={[Function]}
|
|
92
|
-
style={
|
|
93
|
-
{
|
|
94
|
-
"MozAppearance": "none",
|
|
95
|
-
"WebkitAppearance": "none",
|
|
96
|
-
"appearance": "none",
|
|
97
|
-
"backgroundColor": "#ffffff",
|
|
98
|
-
"borderColor": "#1865f2",
|
|
99
|
-
"borderRadius": 3,
|
|
100
|
-
"borderStyle": "solid",
|
|
101
|
-
"borderWidth": 2,
|
|
102
|
-
"boxSizing": "border-box",
|
|
103
|
-
"height": 16,
|
|
104
|
-
"margin": 0,
|
|
105
|
-
"minHeight": 16,
|
|
106
|
-
"minWidth": 16,
|
|
107
|
-
"outline": "none",
|
|
108
|
-
"width": 16,
|
|
109
|
-
}
|
|
110
|
-
}
|
|
111
|
-
type="checkbox"
|
|
112
|
-
/>
|
|
113
|
-
`;
|
|
114
|
-
|
|
115
|
-
exports[`CheckboxCore type:default state:hovered checked:true 1`] = `
|
|
113
|
+
exports[`CheckboxCore type:default checked:true 1`] = `
|
|
116
114
|
[
|
|
117
115
|
<input
|
|
116
|
+
aria-checked="true"
|
|
118
117
|
aria-invalid={false}
|
|
119
118
|
checked={true}
|
|
120
119
|
className=""
|
|
121
120
|
disabled={false}
|
|
122
121
|
onChange={[Function]}
|
|
122
|
+
onClick={[Function]}
|
|
123
123
|
style={
|
|
124
124
|
{
|
|
125
|
+
":active": {
|
|
126
|
+
"background": "#1b50b3",
|
|
127
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1b50b3",
|
|
128
|
+
},
|
|
129
|
+
":focusVisible": {
|
|
130
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1865f2",
|
|
131
|
+
},
|
|
132
|
+
":hover": {
|
|
133
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1865f2",
|
|
134
|
+
},
|
|
125
135
|
"MozAppearance": "none",
|
|
126
136
|
"WebkitAppearance": "none",
|
|
127
137
|
"appearance": "none",
|
|
@@ -129,7 +139,6 @@ exports[`CheckboxCore type:default state:hovered checked:true 1`] = `
|
|
|
129
139
|
"borderRadius": 3,
|
|
130
140
|
"borderStyle": "solid",
|
|
131
141
|
"borderWidth": 0,
|
|
132
|
-
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1865f2",
|
|
133
142
|
"boxSizing": "border-box",
|
|
134
143
|
"height": 16,
|
|
135
144
|
"margin": 0,
|
|
@@ -165,24 +174,27 @@ exports[`CheckboxCore type:default state:hovered checked:true 1`] = `
|
|
|
165
174
|
]
|
|
166
175
|
`;
|
|
167
176
|
|
|
168
|
-
exports[`CheckboxCore type:
|
|
177
|
+
exports[`CheckboxCore type:disabled checked:false 1`] = `
|
|
169
178
|
<input
|
|
179
|
+
aria-checked="false"
|
|
170
180
|
aria-invalid={false}
|
|
171
181
|
checked={false}
|
|
172
182
|
className=""
|
|
173
|
-
disabled={
|
|
183
|
+
disabled={true}
|
|
174
184
|
onChange={[Function]}
|
|
185
|
+
onClick={[Function]}
|
|
175
186
|
style={
|
|
176
187
|
{
|
|
177
188
|
"MozAppearance": "none",
|
|
178
189
|
"WebkitAppearance": "none",
|
|
179
190
|
"appearance": "none",
|
|
180
|
-
"backgroundColor": "#
|
|
181
|
-
"borderColor": "
|
|
191
|
+
"backgroundColor": "#f7f8fa",
|
|
192
|
+
"borderColor": "rgba(33,36,44,0.16)",
|
|
182
193
|
"borderRadius": 3,
|
|
183
194
|
"borderStyle": "solid",
|
|
184
|
-
"borderWidth":
|
|
195
|
+
"borderWidth": 1,
|
|
185
196
|
"boxSizing": "border-box",
|
|
197
|
+
"cursor": "auto",
|
|
186
198
|
"height": 16,
|
|
187
199
|
"margin": 0,
|
|
188
200
|
"minHeight": 16,
|
|
@@ -195,26 +207,27 @@ exports[`CheckboxCore type:default state:pressed checked:false 1`] = `
|
|
|
195
207
|
/>
|
|
196
208
|
`;
|
|
197
209
|
|
|
198
|
-
exports[`CheckboxCore type:
|
|
210
|
+
exports[`CheckboxCore type:disabled checked:null 1`] = `
|
|
199
211
|
[
|
|
200
212
|
<input
|
|
213
|
+
aria-checked="mixed"
|
|
201
214
|
aria-invalid={false}
|
|
202
|
-
checked={true}
|
|
203
215
|
className=""
|
|
204
|
-
disabled={
|
|
216
|
+
disabled={true}
|
|
205
217
|
onChange={[Function]}
|
|
218
|
+
onClick={[Function]}
|
|
206
219
|
style={
|
|
207
220
|
{
|
|
208
221
|
"MozAppearance": "none",
|
|
209
222
|
"WebkitAppearance": "none",
|
|
210
223
|
"appearance": "none",
|
|
211
|
-
"
|
|
212
|
-
"
|
|
224
|
+
"backgroundColor": "#f7f8fa",
|
|
225
|
+
"borderColor": "rgba(33,36,44,0.16)",
|
|
213
226
|
"borderRadius": 3,
|
|
214
227
|
"borderStyle": "solid",
|
|
215
|
-
"borderWidth":
|
|
216
|
-
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1b50b3",
|
|
228
|
+
"borderWidth": 1,
|
|
217
229
|
"boxSizing": "border-box",
|
|
230
|
+
"cursor": "auto",
|
|
218
231
|
"height": 16,
|
|
219
232
|
"margin": 0,
|
|
220
233
|
"minHeight": 16,
|
|
@@ -242,52 +255,23 @@ exports[`CheckboxCore type:default state:pressed checked:true 1`] = `
|
|
|
242
255
|
width={16}
|
|
243
256
|
>
|
|
244
257
|
<path
|
|
245
|
-
d="
|
|
246
|
-
fill="
|
|
258
|
+
d="M3 8C3 7.44772 3.44772 7 4 7H12C12.5523 7 13 7.44772 13 8C13 8.55228 12.5523 9 12 9H4C3.44772 9 3 8.55228 3 8Z"
|
|
259
|
+
fill="rgba(33,36,44,0.32)"
|
|
247
260
|
/>
|
|
248
261
|
</svg>,
|
|
249
262
|
]
|
|
250
263
|
`;
|
|
251
264
|
|
|
252
|
-
exports[`CheckboxCore type:disabled
|
|
253
|
-
<input
|
|
254
|
-
aria-invalid={false}
|
|
255
|
-
checked={false}
|
|
256
|
-
className=""
|
|
257
|
-
disabled={true}
|
|
258
|
-
onChange={[Function]}
|
|
259
|
-
style={
|
|
260
|
-
{
|
|
261
|
-
"MozAppearance": "none",
|
|
262
|
-
"WebkitAppearance": "none",
|
|
263
|
-
"appearance": "none",
|
|
264
|
-
"backgroundColor": "#f7f8fa",
|
|
265
|
-
"borderColor": "rgba(33,36,44,0.16)",
|
|
266
|
-
"borderRadius": 3,
|
|
267
|
-
"borderStyle": "solid",
|
|
268
|
-
"borderWidth": 1,
|
|
269
|
-
"boxSizing": "border-box",
|
|
270
|
-
"cursor": "auto",
|
|
271
|
-
"height": 16,
|
|
272
|
-
"margin": 0,
|
|
273
|
-
"minHeight": 16,
|
|
274
|
-
"minWidth": 16,
|
|
275
|
-
"outline": "none",
|
|
276
|
-
"width": 16,
|
|
277
|
-
}
|
|
278
|
-
}
|
|
279
|
-
type="checkbox"
|
|
280
|
-
/>
|
|
281
|
-
`;
|
|
282
|
-
|
|
283
|
-
exports[`CheckboxCore type:disabled state:default checked:true 1`] = `
|
|
265
|
+
exports[`CheckboxCore type:disabled checked:true 1`] = `
|
|
284
266
|
[
|
|
285
267
|
<input
|
|
268
|
+
aria-checked="true"
|
|
286
269
|
aria-invalid={false}
|
|
287
270
|
checked={true}
|
|
288
271
|
className=""
|
|
289
272
|
disabled={true}
|
|
290
273
|
onChange={[Function]}
|
|
274
|
+
onClick={[Function]}
|
|
291
275
|
style={
|
|
292
276
|
{
|
|
293
277
|
"MozAppearance": "none",
|
|
@@ -334,25 +318,41 @@ exports[`CheckboxCore type:disabled state:default checked:true 1`] = `
|
|
|
334
318
|
]
|
|
335
319
|
`;
|
|
336
320
|
|
|
337
|
-
exports[`CheckboxCore type:
|
|
321
|
+
exports[`CheckboxCore type:error checked:false 1`] = `
|
|
338
322
|
<input
|
|
339
|
-
aria-
|
|
323
|
+
aria-checked="false"
|
|
324
|
+
aria-invalid={true}
|
|
340
325
|
checked={false}
|
|
341
326
|
className=""
|
|
342
|
-
disabled={
|
|
327
|
+
disabled={false}
|
|
343
328
|
onChange={[Function]}
|
|
329
|
+
onClick={[Function]}
|
|
344
330
|
style={
|
|
345
331
|
{
|
|
332
|
+
":active": {
|
|
333
|
+
"backgroundColor": "#fceeec",
|
|
334
|
+
"borderColor": "#9e271d",
|
|
335
|
+
"borderWidth": 2,
|
|
336
|
+
},
|
|
337
|
+
":focusVisible": {
|
|
338
|
+
"backgroundColor": "#fceeec",
|
|
339
|
+
"borderColor": "#d92916",
|
|
340
|
+
"borderWidth": 2,
|
|
341
|
+
},
|
|
342
|
+
":hover": {
|
|
343
|
+
"backgroundColor": "#fceeec",
|
|
344
|
+
"borderColor": "#d92916",
|
|
345
|
+
"borderWidth": 2,
|
|
346
|
+
},
|
|
346
347
|
"MozAppearance": "none",
|
|
347
348
|
"WebkitAppearance": "none",
|
|
348
349
|
"appearance": "none",
|
|
349
|
-
"backgroundColor": "#
|
|
350
|
-
"borderColor": "
|
|
350
|
+
"backgroundColor": "#fceeec",
|
|
351
|
+
"borderColor": "#d92916",
|
|
351
352
|
"borderRadius": 3,
|
|
352
353
|
"borderStyle": "solid",
|
|
353
354
|
"borderWidth": 1,
|
|
354
355
|
"boxSizing": "border-box",
|
|
355
|
-
"cursor": "auto",
|
|
356
356
|
"height": 16,
|
|
357
357
|
"margin": 0,
|
|
358
358
|
"minHeight": 16,
|
|
@@ -365,26 +365,35 @@ exports[`CheckboxCore type:disabled state:hovered checked:false 1`] = `
|
|
|
365
365
|
/>
|
|
366
366
|
`;
|
|
367
367
|
|
|
368
|
-
exports[`CheckboxCore type:
|
|
368
|
+
exports[`CheckboxCore type:error checked:null 1`] = `
|
|
369
369
|
[
|
|
370
370
|
<input
|
|
371
|
-
aria-
|
|
372
|
-
|
|
371
|
+
aria-checked="mixed"
|
|
372
|
+
aria-invalid={true}
|
|
373
373
|
className=""
|
|
374
|
-
disabled={
|
|
374
|
+
disabled={false}
|
|
375
375
|
onChange={[Function]}
|
|
376
|
+
onClick={[Function]}
|
|
376
377
|
style={
|
|
377
378
|
{
|
|
379
|
+
":active": {
|
|
380
|
+
"background": "#9e271d",
|
|
381
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #9e271d",
|
|
382
|
+
},
|
|
383
|
+
":focusVisible": {
|
|
384
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #d92916",
|
|
385
|
+
},
|
|
386
|
+
":hover": {
|
|
387
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #d92916",
|
|
388
|
+
},
|
|
378
389
|
"MozAppearance": "none",
|
|
379
390
|
"WebkitAppearance": "none",
|
|
380
391
|
"appearance": "none",
|
|
381
|
-
"backgroundColor": "#
|
|
382
|
-
"borderColor": "rgba(33,36,44,0.16)",
|
|
392
|
+
"backgroundColor": "#d92916",
|
|
383
393
|
"borderRadius": 3,
|
|
384
394
|
"borderStyle": "solid",
|
|
385
|
-
"borderWidth":
|
|
395
|
+
"borderWidth": 0,
|
|
386
396
|
"boxSizing": "border-box",
|
|
387
|
-
"cursor": "auto",
|
|
388
397
|
"height": 16,
|
|
389
398
|
"margin": 0,
|
|
390
399
|
"minHeight": 16,
|
|
@@ -412,64 +421,43 @@ exports[`CheckboxCore type:disabled state:hovered checked:true 1`] = `
|
|
|
412
421
|
width={16}
|
|
413
422
|
>
|
|
414
423
|
<path
|
|
415
|
-
d="
|
|
416
|
-
fill="
|
|
424
|
+
d="M3 8C3 7.44772 3.44772 7 4 7H12C12.5523 7 13 7.44772 13 8C13 8.55228 12.5523 9 12 9H4C3.44772 9 3 8.55228 3 8Z"
|
|
425
|
+
fill="#ffffff"
|
|
417
426
|
/>
|
|
418
427
|
</svg>,
|
|
419
428
|
]
|
|
420
429
|
`;
|
|
421
430
|
|
|
422
|
-
exports[`CheckboxCore type:
|
|
423
|
-
<input
|
|
424
|
-
aria-invalid={false}
|
|
425
|
-
checked={false}
|
|
426
|
-
className=""
|
|
427
|
-
disabled={true}
|
|
428
|
-
onChange={[Function]}
|
|
429
|
-
style={
|
|
430
|
-
{
|
|
431
|
-
"MozAppearance": "none",
|
|
432
|
-
"WebkitAppearance": "none",
|
|
433
|
-
"appearance": "none",
|
|
434
|
-
"backgroundColor": "#f7f8fa",
|
|
435
|
-
"borderColor": "rgba(33,36,44,0.16)",
|
|
436
|
-
"borderRadius": 3,
|
|
437
|
-
"borderStyle": "solid",
|
|
438
|
-
"borderWidth": 1,
|
|
439
|
-
"boxSizing": "border-box",
|
|
440
|
-
"cursor": "auto",
|
|
441
|
-
"height": 16,
|
|
442
|
-
"margin": 0,
|
|
443
|
-
"minHeight": 16,
|
|
444
|
-
"minWidth": 16,
|
|
445
|
-
"outline": "none",
|
|
446
|
-
"width": 16,
|
|
447
|
-
}
|
|
448
|
-
}
|
|
449
|
-
type="checkbox"
|
|
450
|
-
/>
|
|
451
|
-
`;
|
|
452
|
-
|
|
453
|
-
exports[`CheckboxCore type:disabled state:pressed checked:true 1`] = `
|
|
431
|
+
exports[`CheckboxCore type:error checked:true 1`] = `
|
|
454
432
|
[
|
|
455
433
|
<input
|
|
456
|
-
aria-
|
|
434
|
+
aria-checked="true"
|
|
435
|
+
aria-invalid={true}
|
|
457
436
|
checked={true}
|
|
458
437
|
className=""
|
|
459
|
-
disabled={
|
|
438
|
+
disabled={false}
|
|
460
439
|
onChange={[Function]}
|
|
440
|
+
onClick={[Function]}
|
|
461
441
|
style={
|
|
462
442
|
{
|
|
443
|
+
":active": {
|
|
444
|
+
"background": "#9e271d",
|
|
445
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #9e271d",
|
|
446
|
+
},
|
|
447
|
+
":focusVisible": {
|
|
448
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #d92916",
|
|
449
|
+
},
|
|
450
|
+
":hover": {
|
|
451
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #d92916",
|
|
452
|
+
},
|
|
463
453
|
"MozAppearance": "none",
|
|
464
454
|
"WebkitAppearance": "none",
|
|
465
455
|
"appearance": "none",
|
|
466
|
-
"backgroundColor": "#
|
|
467
|
-
"borderColor": "rgba(33,36,44,0.16)",
|
|
456
|
+
"backgroundColor": "#d92916",
|
|
468
457
|
"borderRadius": 3,
|
|
469
458
|
"borderStyle": "solid",
|
|
470
|
-
"borderWidth":
|
|
459
|
+
"borderWidth": 0,
|
|
471
460
|
"boxSizing": "border-box",
|
|
472
|
-
"cursor": "auto",
|
|
473
461
|
"height": 16,
|
|
474
462
|
"margin": 0,
|
|
475
463
|
"minHeight": 16,
|
|
@@ -498,27 +486,43 @@ exports[`CheckboxCore type:disabled state:pressed checked:true 1`] = `
|
|
|
498
486
|
>
|
|
499
487
|
<path
|
|
500
488
|
d="M11.263 4.324a1 1 0 1 1 1.474 1.352l-5.5 6a1 1 0 0 1-1.505-.036l-2.5-3a1 1 0 1 1 1.536-1.28L6.536 9.48l4.727-5.157z"
|
|
501
|
-
fill="
|
|
489
|
+
fill="#ffffff"
|
|
502
490
|
/>
|
|
503
491
|
</svg>,
|
|
504
492
|
]
|
|
505
493
|
`;
|
|
506
494
|
|
|
507
|
-
exports[`
|
|
495
|
+
exports[`RadioCore type:default checked:false 1`] = `
|
|
508
496
|
<input
|
|
509
|
-
aria-invalid={
|
|
497
|
+
aria-invalid={false}
|
|
510
498
|
checked={false}
|
|
511
499
|
className=""
|
|
512
500
|
disabled={false}
|
|
513
501
|
onChange={[Function]}
|
|
502
|
+
onClick={[Function]}
|
|
514
503
|
style={
|
|
515
504
|
{
|
|
505
|
+
":active": {
|
|
506
|
+
"backgroundColor": "#dae6fd",
|
|
507
|
+
"borderColor": "#1865f2",
|
|
508
|
+
"borderWidth": 2,
|
|
509
|
+
},
|
|
510
|
+
":focusVisible": {
|
|
511
|
+
"backgroundColor": "#ffffff",
|
|
512
|
+
"borderColor": "#1865f2",
|
|
513
|
+
"borderWidth": 2,
|
|
514
|
+
},
|
|
515
|
+
":hover": {
|
|
516
|
+
"backgroundColor": "#ffffff",
|
|
517
|
+
"borderColor": "#1865f2",
|
|
518
|
+
"borderWidth": 2,
|
|
519
|
+
},
|
|
516
520
|
"MozAppearance": "none",
|
|
517
521
|
"WebkitAppearance": "none",
|
|
518
522
|
"appearance": "none",
|
|
519
|
-
"backgroundColor": "#
|
|
520
|
-
"borderColor": "
|
|
521
|
-
"borderRadius":
|
|
523
|
+
"backgroundColor": "#ffffff",
|
|
524
|
+
"borderColor": "rgba(33,36,44,0.50)",
|
|
525
|
+
"borderRadius": "50%",
|
|
522
526
|
"borderStyle": "solid",
|
|
523
527
|
"borderWidth": 1,
|
|
524
528
|
"boxSizing": "border-box",
|
|
@@ -530,79 +534,83 @@ exports[`CheckboxCore type:error state:default checked:false 1`] = `
|
|
|
530
534
|
"width": 16,
|
|
531
535
|
}
|
|
532
536
|
}
|
|
533
|
-
type="
|
|
537
|
+
type="radio"
|
|
534
538
|
/>
|
|
535
539
|
`;
|
|
536
540
|
|
|
537
|
-
exports[`
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
{
|
|
547
|
-
"
|
|
548
|
-
"
|
|
549
|
-
"
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
"
|
|
553
|
-
"
|
|
554
|
-
"
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
"
|
|
558
|
-
"
|
|
559
|
-
"
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
}
|
|
541
|
+
exports[`RadioCore type:default checked:null 1`] = `
|
|
542
|
+
<input
|
|
543
|
+
aria-invalid={false}
|
|
544
|
+
className=""
|
|
545
|
+
disabled={false}
|
|
546
|
+
onChange={[Function]}
|
|
547
|
+
onClick={[Function]}
|
|
548
|
+
style={
|
|
549
|
+
{
|
|
550
|
+
":active": {
|
|
551
|
+
"backgroundColor": "#dae6fd",
|
|
552
|
+
"borderColor": "#1865f2",
|
|
553
|
+
"borderWidth": 2,
|
|
554
|
+
},
|
|
555
|
+
":focusVisible": {
|
|
556
|
+
"backgroundColor": "#ffffff",
|
|
557
|
+
"borderColor": "#1865f2",
|
|
558
|
+
"borderWidth": 2,
|
|
559
|
+
},
|
|
560
|
+
":hover": {
|
|
561
|
+
"backgroundColor": "#ffffff",
|
|
562
|
+
"borderColor": "#1865f2",
|
|
563
|
+
"borderWidth": 2,
|
|
564
|
+
},
|
|
565
|
+
"MozAppearance": "none",
|
|
566
|
+
"WebkitAppearance": "none",
|
|
567
|
+
"appearance": "none",
|
|
568
|
+
"backgroundColor": "#ffffff",
|
|
569
|
+
"borderColor": "rgba(33,36,44,0.50)",
|
|
570
|
+
"borderRadius": "50%",
|
|
571
|
+
"borderStyle": "solid",
|
|
572
|
+
"borderWidth": 1,
|
|
573
|
+
"boxSizing": "border-box",
|
|
574
|
+
"height": 16,
|
|
575
|
+
"margin": 0,
|
|
576
|
+
"minHeight": 16,
|
|
577
|
+
"minWidth": 16,
|
|
578
|
+
"outline": "none",
|
|
579
|
+
"width": 16,
|
|
577
580
|
}
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
<path
|
|
582
|
-
d="M11.263 4.324a1 1 0 1 1 1.474 1.352l-5.5 6a1 1 0 0 1-1.505-.036l-2.5-3a1 1 0 1 1 1.536-1.28L6.536 9.48l4.727-5.157z"
|
|
583
|
-
fill="#ffffff"
|
|
584
|
-
/>
|
|
585
|
-
</svg>,
|
|
586
|
-
]
|
|
581
|
+
}
|
|
582
|
+
type="radio"
|
|
583
|
+
/>
|
|
587
584
|
`;
|
|
588
585
|
|
|
589
|
-
exports[`
|
|
586
|
+
exports[`RadioCore type:default checked:true 1`] = `
|
|
590
587
|
<input
|
|
591
|
-
aria-invalid={
|
|
592
|
-
checked={
|
|
588
|
+
aria-invalid={false}
|
|
589
|
+
checked={true}
|
|
593
590
|
className=""
|
|
594
591
|
disabled={false}
|
|
595
592
|
onChange={[Function]}
|
|
593
|
+
onClick={[Function]}
|
|
596
594
|
style={
|
|
597
595
|
{
|
|
596
|
+
":active": {
|
|
597
|
+
"borderColor": "#1b50b3",
|
|
598
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1b50b3",
|
|
599
|
+
},
|
|
600
|
+
":focusVisible": {
|
|
601
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1865f2",
|
|
602
|
+
},
|
|
603
|
+
":hover": {
|
|
604
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1865f2",
|
|
605
|
+
},
|
|
598
606
|
"MozAppearance": "none",
|
|
599
607
|
"WebkitAppearance": "none",
|
|
600
608
|
"appearance": "none",
|
|
601
|
-
"backgroundColor": "#
|
|
602
|
-
"borderColor": "#
|
|
603
|
-
"borderRadius":
|
|
609
|
+
"backgroundColor": "#ffffff",
|
|
610
|
+
"borderColor": "#1865f2",
|
|
611
|
+
"borderRadius": "50%",
|
|
604
612
|
"borderStyle": "solid",
|
|
605
|
-
"borderWidth":
|
|
613
|
+
"borderWidth": 4,
|
|
606
614
|
"boxSizing": "border-box",
|
|
607
615
|
"height": 16,
|
|
608
616
|
"margin": 0,
|
|
@@ -612,336 +620,18 @@ exports[`CheckboxCore type:error state:hovered checked:false 1`] = `
|
|
|
612
620
|
"width": 16,
|
|
613
621
|
}
|
|
614
622
|
}
|
|
615
|
-
type="
|
|
623
|
+
type="radio"
|
|
616
624
|
/>
|
|
617
625
|
`;
|
|
618
626
|
|
|
619
|
-
exports[`
|
|
620
|
-
[
|
|
621
|
-
<input
|
|
622
|
-
aria-invalid={true}
|
|
623
|
-
checked={true}
|
|
624
|
-
className=""
|
|
625
|
-
disabled={false}
|
|
626
|
-
onChange={[Function]}
|
|
627
|
-
style={
|
|
628
|
-
{
|
|
629
|
-
"MozAppearance": "none",
|
|
630
|
-
"WebkitAppearance": "none",
|
|
631
|
-
"appearance": "none",
|
|
632
|
-
"backgroundColor": "#d92916",
|
|
633
|
-
"borderRadius": 3,
|
|
634
|
-
"borderStyle": "solid",
|
|
635
|
-
"borderWidth": 0,
|
|
636
|
-
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #d92916",
|
|
637
|
-
"boxSizing": "border-box",
|
|
638
|
-
"height": 16,
|
|
639
|
-
"margin": 0,
|
|
640
|
-
"minHeight": 16,
|
|
641
|
-
"minWidth": 16,
|
|
642
|
-
"outline": "none",
|
|
643
|
-
"width": 16,
|
|
644
|
-
}
|
|
645
|
-
}
|
|
646
|
-
type="checkbox"
|
|
647
|
-
/>,
|
|
648
|
-
<svg
|
|
649
|
-
className=""
|
|
650
|
-
height={16}
|
|
651
|
-
style={
|
|
652
|
-
{
|
|
653
|
-
"display": "inline-block",
|
|
654
|
-
"flexGrow": 0,
|
|
655
|
-
"flexShrink": 0,
|
|
656
|
-
"pointerEvents": "none",
|
|
657
|
-
"position": "absolute",
|
|
658
|
-
"verticalAlign": "text-bottom",
|
|
659
|
-
}
|
|
660
|
-
}
|
|
661
|
-
viewBox="0 0 16 16"
|
|
662
|
-
width={16}
|
|
663
|
-
>
|
|
664
|
-
<path
|
|
665
|
-
d="M11.263 4.324a1 1 0 1 1 1.474 1.352l-5.5 6a1 1 0 0 1-1.505-.036l-2.5-3a1 1 0 1 1 1.536-1.28L6.536 9.48l4.727-5.157z"
|
|
666
|
-
fill="#ffffff"
|
|
667
|
-
/>
|
|
668
|
-
</svg>,
|
|
669
|
-
]
|
|
670
|
-
`;
|
|
671
|
-
|
|
672
|
-
exports[`CheckboxCore type:error state:pressed checked:false 1`] = `
|
|
673
|
-
<input
|
|
674
|
-
aria-invalid={true}
|
|
675
|
-
checked={false}
|
|
676
|
-
className=""
|
|
677
|
-
disabled={false}
|
|
678
|
-
onChange={[Function]}
|
|
679
|
-
style={
|
|
680
|
-
{
|
|
681
|
-
"MozAppearance": "none",
|
|
682
|
-
"WebkitAppearance": "none",
|
|
683
|
-
"appearance": "none",
|
|
684
|
-
"backgroundColor": "#fceeec",
|
|
685
|
-
"borderColor": "#9e271d",
|
|
686
|
-
"borderRadius": 3,
|
|
687
|
-
"borderStyle": "solid",
|
|
688
|
-
"borderWidth": 2,
|
|
689
|
-
"boxSizing": "border-box",
|
|
690
|
-
"height": 16,
|
|
691
|
-
"margin": 0,
|
|
692
|
-
"minHeight": 16,
|
|
693
|
-
"minWidth": 16,
|
|
694
|
-
"outline": "none",
|
|
695
|
-
"width": 16,
|
|
696
|
-
}
|
|
697
|
-
}
|
|
698
|
-
type="checkbox"
|
|
699
|
-
/>
|
|
700
|
-
`;
|
|
701
|
-
|
|
702
|
-
exports[`CheckboxCore type:error state:pressed checked:true 1`] = `
|
|
703
|
-
[
|
|
704
|
-
<input
|
|
705
|
-
aria-invalid={true}
|
|
706
|
-
checked={true}
|
|
707
|
-
className=""
|
|
708
|
-
disabled={false}
|
|
709
|
-
onChange={[Function]}
|
|
710
|
-
style={
|
|
711
|
-
{
|
|
712
|
-
"MozAppearance": "none",
|
|
713
|
-
"WebkitAppearance": "none",
|
|
714
|
-
"appearance": "none",
|
|
715
|
-
"background": "#9e271d",
|
|
716
|
-
"backgroundColor": "#d92916",
|
|
717
|
-
"borderRadius": 3,
|
|
718
|
-
"borderStyle": "solid",
|
|
719
|
-
"borderWidth": 0,
|
|
720
|
-
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #9e271d",
|
|
721
|
-
"boxSizing": "border-box",
|
|
722
|
-
"height": 16,
|
|
723
|
-
"margin": 0,
|
|
724
|
-
"minHeight": 16,
|
|
725
|
-
"minWidth": 16,
|
|
726
|
-
"outline": "none",
|
|
727
|
-
"width": 16,
|
|
728
|
-
}
|
|
729
|
-
}
|
|
730
|
-
type="checkbox"
|
|
731
|
-
/>,
|
|
732
|
-
<svg
|
|
733
|
-
className=""
|
|
734
|
-
height={16}
|
|
735
|
-
style={
|
|
736
|
-
{
|
|
737
|
-
"display": "inline-block",
|
|
738
|
-
"flexGrow": 0,
|
|
739
|
-
"flexShrink": 0,
|
|
740
|
-
"pointerEvents": "none",
|
|
741
|
-
"position": "absolute",
|
|
742
|
-
"verticalAlign": "text-bottom",
|
|
743
|
-
}
|
|
744
|
-
}
|
|
745
|
-
viewBox="0 0 16 16"
|
|
746
|
-
width={16}
|
|
747
|
-
>
|
|
748
|
-
<path
|
|
749
|
-
d="M11.263 4.324a1 1 0 1 1 1.474 1.352l-5.5 6a1 1 0 0 1-1.505-.036l-2.5-3a1 1 0 1 1 1.536-1.28L6.536 9.48l4.727-5.157z"
|
|
750
|
-
fill="#ffffff"
|
|
751
|
-
/>
|
|
752
|
-
</svg>,
|
|
753
|
-
]
|
|
754
|
-
`;
|
|
755
|
-
|
|
756
|
-
exports[`RadioCore type:default state:default checked:false 1`] = `
|
|
757
|
-
<input
|
|
758
|
-
aria-invalid={false}
|
|
759
|
-
checked={false}
|
|
760
|
-
className=""
|
|
761
|
-
disabled={false}
|
|
762
|
-
onChange={[Function]}
|
|
763
|
-
style={
|
|
764
|
-
{
|
|
765
|
-
"MozAppearance": "none",
|
|
766
|
-
"WebkitAppearance": "none",
|
|
767
|
-
"appearance": "none",
|
|
768
|
-
"backgroundColor": "#ffffff",
|
|
769
|
-
"borderColor": "rgba(33,36,44,0.50)",
|
|
770
|
-
"borderRadius": "50%",
|
|
771
|
-
"borderStyle": "solid",
|
|
772
|
-
"borderWidth": 1,
|
|
773
|
-
"boxSizing": "border-box",
|
|
774
|
-
"height": 16,
|
|
775
|
-
"margin": 0,
|
|
776
|
-
"minHeight": 16,
|
|
777
|
-
"minWidth": 16,
|
|
778
|
-
"outline": "none",
|
|
779
|
-
"width": 16,
|
|
780
|
-
}
|
|
781
|
-
}
|
|
782
|
-
type="radio"
|
|
783
|
-
/>
|
|
784
|
-
`;
|
|
785
|
-
|
|
786
|
-
exports[`RadioCore type:default state:default checked:true 1`] = `
|
|
787
|
-
<input
|
|
788
|
-
aria-invalid={false}
|
|
789
|
-
checked={true}
|
|
790
|
-
className=""
|
|
791
|
-
disabled={false}
|
|
792
|
-
onChange={[Function]}
|
|
793
|
-
style={
|
|
794
|
-
{
|
|
795
|
-
"MozAppearance": "none",
|
|
796
|
-
"WebkitAppearance": "none",
|
|
797
|
-
"appearance": "none",
|
|
798
|
-
"backgroundColor": "#ffffff",
|
|
799
|
-
"borderColor": "#1865f2",
|
|
800
|
-
"borderRadius": "50%",
|
|
801
|
-
"borderStyle": "solid",
|
|
802
|
-
"borderWidth": 4,
|
|
803
|
-
"boxSizing": "border-box",
|
|
804
|
-
"height": 16,
|
|
805
|
-
"margin": 0,
|
|
806
|
-
"minHeight": 16,
|
|
807
|
-
"minWidth": 16,
|
|
808
|
-
"outline": "none",
|
|
809
|
-
"width": 16,
|
|
810
|
-
}
|
|
811
|
-
}
|
|
812
|
-
type="radio"
|
|
813
|
-
/>
|
|
814
|
-
`;
|
|
815
|
-
|
|
816
|
-
exports[`RadioCore type:default state:hovered checked:false 1`] = `
|
|
817
|
-
<input
|
|
818
|
-
aria-invalid={false}
|
|
819
|
-
checked={false}
|
|
820
|
-
className=""
|
|
821
|
-
disabled={false}
|
|
822
|
-
onChange={[Function]}
|
|
823
|
-
style={
|
|
824
|
-
{
|
|
825
|
-
"MozAppearance": "none",
|
|
826
|
-
"WebkitAppearance": "none",
|
|
827
|
-
"appearance": "none",
|
|
828
|
-
"backgroundColor": "#ffffff",
|
|
829
|
-
"borderColor": "#1865f2",
|
|
830
|
-
"borderRadius": "50%",
|
|
831
|
-
"borderStyle": "solid",
|
|
832
|
-
"borderWidth": 2,
|
|
833
|
-
"boxSizing": "border-box",
|
|
834
|
-
"height": 16,
|
|
835
|
-
"margin": 0,
|
|
836
|
-
"minHeight": 16,
|
|
837
|
-
"minWidth": 16,
|
|
838
|
-
"outline": "none",
|
|
839
|
-
"width": 16,
|
|
840
|
-
}
|
|
841
|
-
}
|
|
842
|
-
type="radio"
|
|
843
|
-
/>
|
|
844
|
-
`;
|
|
845
|
-
|
|
846
|
-
exports[`RadioCore type:default state:hovered checked:true 1`] = `
|
|
847
|
-
<input
|
|
848
|
-
aria-invalid={false}
|
|
849
|
-
checked={true}
|
|
850
|
-
className=""
|
|
851
|
-
disabled={false}
|
|
852
|
-
onChange={[Function]}
|
|
853
|
-
style={
|
|
854
|
-
{
|
|
855
|
-
"MozAppearance": "none",
|
|
856
|
-
"WebkitAppearance": "none",
|
|
857
|
-
"appearance": "none",
|
|
858
|
-
"backgroundColor": "#ffffff",
|
|
859
|
-
"borderColor": "#1865f2",
|
|
860
|
-
"borderRadius": "50%",
|
|
861
|
-
"borderStyle": "solid",
|
|
862
|
-
"borderWidth": 4,
|
|
863
|
-
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1865f2",
|
|
864
|
-
"boxSizing": "border-box",
|
|
865
|
-
"height": 16,
|
|
866
|
-
"margin": 0,
|
|
867
|
-
"minHeight": 16,
|
|
868
|
-
"minWidth": 16,
|
|
869
|
-
"outline": "none",
|
|
870
|
-
"width": 16,
|
|
871
|
-
}
|
|
872
|
-
}
|
|
873
|
-
type="radio"
|
|
874
|
-
/>
|
|
875
|
-
`;
|
|
876
|
-
|
|
877
|
-
exports[`RadioCore type:default state:pressed checked:false 1`] = `
|
|
878
|
-
<input
|
|
879
|
-
aria-invalid={false}
|
|
880
|
-
checked={false}
|
|
881
|
-
className=""
|
|
882
|
-
disabled={false}
|
|
883
|
-
onChange={[Function]}
|
|
884
|
-
style={
|
|
885
|
-
{
|
|
886
|
-
"MozAppearance": "none",
|
|
887
|
-
"WebkitAppearance": "none",
|
|
888
|
-
"appearance": "none",
|
|
889
|
-
"backgroundColor": "#dae6fd",
|
|
890
|
-
"borderColor": "#1865f2",
|
|
891
|
-
"borderRadius": "50%",
|
|
892
|
-
"borderStyle": "solid",
|
|
893
|
-
"borderWidth": 2,
|
|
894
|
-
"boxSizing": "border-box",
|
|
895
|
-
"height": 16,
|
|
896
|
-
"margin": 0,
|
|
897
|
-
"minHeight": 16,
|
|
898
|
-
"minWidth": 16,
|
|
899
|
-
"outline": "none",
|
|
900
|
-
"width": 16,
|
|
901
|
-
}
|
|
902
|
-
}
|
|
903
|
-
type="radio"
|
|
904
|
-
/>
|
|
905
|
-
`;
|
|
906
|
-
|
|
907
|
-
exports[`RadioCore type:default state:pressed checked:true 1`] = `
|
|
908
|
-
<input
|
|
909
|
-
aria-invalid={false}
|
|
910
|
-
checked={true}
|
|
911
|
-
className=""
|
|
912
|
-
disabled={false}
|
|
913
|
-
onChange={[Function]}
|
|
914
|
-
style={
|
|
915
|
-
{
|
|
916
|
-
"MozAppearance": "none",
|
|
917
|
-
"WebkitAppearance": "none",
|
|
918
|
-
"appearance": "none",
|
|
919
|
-
"backgroundColor": "#ffffff",
|
|
920
|
-
"borderColor": "#1b50b3",
|
|
921
|
-
"borderRadius": "50%",
|
|
922
|
-
"borderStyle": "solid",
|
|
923
|
-
"borderWidth": 4,
|
|
924
|
-
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1b50b3",
|
|
925
|
-
"boxSizing": "border-box",
|
|
926
|
-
"height": 16,
|
|
927
|
-
"margin": 0,
|
|
928
|
-
"minHeight": 16,
|
|
929
|
-
"minWidth": 16,
|
|
930
|
-
"outline": "none",
|
|
931
|
-
"width": 16,
|
|
932
|
-
}
|
|
933
|
-
}
|
|
934
|
-
type="radio"
|
|
935
|
-
/>
|
|
936
|
-
`;
|
|
937
|
-
|
|
938
|
-
exports[`RadioCore type:disabled state:default checked:false 1`] = `
|
|
627
|
+
exports[`RadioCore type:disabled checked:false 1`] = `
|
|
939
628
|
<input
|
|
940
629
|
aria-invalid={false}
|
|
941
630
|
checked={false}
|
|
942
631
|
className=""
|
|
943
632
|
disabled={true}
|
|
944
633
|
onChange={[Function]}
|
|
634
|
+
onClick={[Function]}
|
|
945
635
|
style={
|
|
946
636
|
{
|
|
947
637
|
"MozAppearance": "none",
|
|
@@ -966,136 +656,13 @@ exports[`RadioCore type:disabled state:default checked:false 1`] = `
|
|
|
966
656
|
/>
|
|
967
657
|
`;
|
|
968
658
|
|
|
969
|
-
exports[`RadioCore type:disabled
|
|
970
|
-
[
|
|
971
|
-
<input
|
|
972
|
-
aria-invalid={false}
|
|
973
|
-
checked={true}
|
|
974
|
-
className=""
|
|
975
|
-
disabled={true}
|
|
976
|
-
onChange={[Function]}
|
|
977
|
-
style={
|
|
978
|
-
{
|
|
979
|
-
"MozAppearance": "none",
|
|
980
|
-
"WebkitAppearance": "none",
|
|
981
|
-
"appearance": "none",
|
|
982
|
-
"backgroundColor": "#f7f8fa",
|
|
983
|
-
"borderColor": "rgba(33,36,44,0.16)",
|
|
984
|
-
"borderRadius": "50%",
|
|
985
|
-
"borderStyle": "solid",
|
|
986
|
-
"borderWidth": 1,
|
|
987
|
-
"boxSizing": "border-box",
|
|
988
|
-
"cursor": "auto",
|
|
989
|
-
"height": 16,
|
|
990
|
-
"margin": 0,
|
|
991
|
-
"minHeight": 16,
|
|
992
|
-
"minWidth": 16,
|
|
993
|
-
"outline": "none",
|
|
994
|
-
"width": 16,
|
|
995
|
-
}
|
|
996
|
-
}
|
|
997
|
-
type="radio"
|
|
998
|
-
/>,
|
|
999
|
-
<span
|
|
1000
|
-
style={
|
|
1001
|
-
{
|
|
1002
|
-
"backgroundColor": "rgba(33,36,44,0.32)",
|
|
1003
|
-
"borderRadius": "50%",
|
|
1004
|
-
"height": 8,
|
|
1005
|
-
"left": 4,
|
|
1006
|
-
"position": "absolute",
|
|
1007
|
-
"top": 4,
|
|
1008
|
-
"width": 8,
|
|
1009
|
-
}
|
|
1010
|
-
}
|
|
1011
|
-
/>,
|
|
1012
|
-
]
|
|
1013
|
-
`;
|
|
1014
|
-
|
|
1015
|
-
exports[`RadioCore type:disabled state:hovered checked:false 1`] = `
|
|
1016
|
-
<input
|
|
1017
|
-
aria-invalid={false}
|
|
1018
|
-
checked={false}
|
|
1019
|
-
className=""
|
|
1020
|
-
disabled={true}
|
|
1021
|
-
onChange={[Function]}
|
|
1022
|
-
style={
|
|
1023
|
-
{
|
|
1024
|
-
"MozAppearance": "none",
|
|
1025
|
-
"WebkitAppearance": "none",
|
|
1026
|
-
"appearance": "none",
|
|
1027
|
-
"backgroundColor": "#f7f8fa",
|
|
1028
|
-
"borderColor": "rgba(33,36,44,0.16)",
|
|
1029
|
-
"borderRadius": "50%",
|
|
1030
|
-
"borderStyle": "solid",
|
|
1031
|
-
"borderWidth": 1,
|
|
1032
|
-
"boxSizing": "border-box",
|
|
1033
|
-
"cursor": "auto",
|
|
1034
|
-
"height": 16,
|
|
1035
|
-
"margin": 0,
|
|
1036
|
-
"minHeight": 16,
|
|
1037
|
-
"minWidth": 16,
|
|
1038
|
-
"outline": "none",
|
|
1039
|
-
"width": 16,
|
|
1040
|
-
}
|
|
1041
|
-
}
|
|
1042
|
-
type="radio"
|
|
1043
|
-
/>
|
|
1044
|
-
`;
|
|
1045
|
-
|
|
1046
|
-
exports[`RadioCore type:disabled state:hovered checked:true 1`] = `
|
|
1047
|
-
[
|
|
1048
|
-
<input
|
|
1049
|
-
aria-invalid={false}
|
|
1050
|
-
checked={true}
|
|
1051
|
-
className=""
|
|
1052
|
-
disabled={true}
|
|
1053
|
-
onChange={[Function]}
|
|
1054
|
-
style={
|
|
1055
|
-
{
|
|
1056
|
-
"MozAppearance": "none",
|
|
1057
|
-
"WebkitAppearance": "none",
|
|
1058
|
-
"appearance": "none",
|
|
1059
|
-
"backgroundColor": "#f7f8fa",
|
|
1060
|
-
"borderColor": "rgba(33,36,44,0.16)",
|
|
1061
|
-
"borderRadius": "50%",
|
|
1062
|
-
"borderStyle": "solid",
|
|
1063
|
-
"borderWidth": 1,
|
|
1064
|
-
"boxSizing": "border-box",
|
|
1065
|
-
"cursor": "auto",
|
|
1066
|
-
"height": 16,
|
|
1067
|
-
"margin": 0,
|
|
1068
|
-
"minHeight": 16,
|
|
1069
|
-
"minWidth": 16,
|
|
1070
|
-
"outline": "none",
|
|
1071
|
-
"width": 16,
|
|
1072
|
-
}
|
|
1073
|
-
}
|
|
1074
|
-
type="radio"
|
|
1075
|
-
/>,
|
|
1076
|
-
<span
|
|
1077
|
-
style={
|
|
1078
|
-
{
|
|
1079
|
-
"backgroundColor": "rgba(33,36,44,0.32)",
|
|
1080
|
-
"borderRadius": "50%",
|
|
1081
|
-
"height": 8,
|
|
1082
|
-
"left": 4,
|
|
1083
|
-
"position": "absolute",
|
|
1084
|
-
"top": 4,
|
|
1085
|
-
"width": 8,
|
|
1086
|
-
}
|
|
1087
|
-
}
|
|
1088
|
-
/>,
|
|
1089
|
-
]
|
|
1090
|
-
`;
|
|
1091
|
-
|
|
1092
|
-
exports[`RadioCore type:disabled state:pressed checked:false 1`] = `
|
|
659
|
+
exports[`RadioCore type:disabled checked:null 1`] = `
|
|
1093
660
|
<input
|
|
1094
661
|
aria-invalid={false}
|
|
1095
|
-
checked={false}
|
|
1096
662
|
className=""
|
|
1097
663
|
disabled={true}
|
|
1098
664
|
onChange={[Function]}
|
|
665
|
+
onClick={[Function]}
|
|
1099
666
|
style={
|
|
1100
667
|
{
|
|
1101
668
|
"MozAppearance": "none",
|
|
@@ -1120,7 +687,7 @@ exports[`RadioCore type:disabled state:pressed checked:false 1`] = `
|
|
|
1120
687
|
/>
|
|
1121
688
|
`;
|
|
1122
689
|
|
|
1123
|
-
exports[`RadioCore type:disabled
|
|
690
|
+
exports[`RadioCore type:disabled checked:true 1`] = `
|
|
1124
691
|
[
|
|
1125
692
|
<input
|
|
1126
693
|
aria-invalid={false}
|
|
@@ -1128,6 +695,7 @@ exports[`RadioCore type:disabled state:pressed checked:true 1`] = `
|
|
|
1128
695
|
className=""
|
|
1129
696
|
disabled={true}
|
|
1130
697
|
onChange={[Function]}
|
|
698
|
+
onClick={[Function]}
|
|
1131
699
|
style={
|
|
1132
700
|
{
|
|
1133
701
|
"MozAppearance": "none",
|
|
@@ -1166,15 +734,31 @@ exports[`RadioCore type:disabled state:pressed checked:true 1`] = `
|
|
|
1166
734
|
]
|
|
1167
735
|
`;
|
|
1168
736
|
|
|
1169
|
-
exports[`RadioCore type:error
|
|
737
|
+
exports[`RadioCore type:error checked:false 1`] = `
|
|
1170
738
|
<input
|
|
1171
739
|
aria-invalid={true}
|
|
1172
740
|
checked={false}
|
|
1173
741
|
className=""
|
|
1174
742
|
disabled={false}
|
|
1175
743
|
onChange={[Function]}
|
|
744
|
+
onClick={[Function]}
|
|
1176
745
|
style={
|
|
1177
746
|
{
|
|
747
|
+
":active": {
|
|
748
|
+
"backgroundColor": "#fceeec",
|
|
749
|
+
"borderColor": "#9e271d",
|
|
750
|
+
"borderWidth": 2,
|
|
751
|
+
},
|
|
752
|
+
":focusVisible": {
|
|
753
|
+
"backgroundColor": "#fceeec",
|
|
754
|
+
"borderColor": "#d92916",
|
|
755
|
+
"borderWidth": 2,
|
|
756
|
+
},
|
|
757
|
+
":hover": {
|
|
758
|
+
"backgroundColor": "#fceeec",
|
|
759
|
+
"borderColor": "#d92916",
|
|
760
|
+
"borderWidth": 2,
|
|
761
|
+
},
|
|
1178
762
|
"MozAppearance": "none",
|
|
1179
763
|
"WebkitAppearance": "none",
|
|
1180
764
|
"appearance": "none",
|
|
@@ -1196,45 +780,30 @@ exports[`RadioCore type:error state:default checked:false 1`] = `
|
|
|
1196
780
|
/>
|
|
1197
781
|
`;
|
|
1198
782
|
|
|
1199
|
-
exports[`RadioCore type:error
|
|
783
|
+
exports[`RadioCore type:error checked:null 1`] = `
|
|
1200
784
|
<input
|
|
1201
785
|
aria-invalid={true}
|
|
1202
|
-
checked={true}
|
|
1203
|
-
className=""
|
|
1204
|
-
disabled={false}
|
|
1205
|
-
onChange={[Function]}
|
|
1206
|
-
style={
|
|
1207
|
-
{
|
|
1208
|
-
"MozAppearance": "none",
|
|
1209
|
-
"WebkitAppearance": "none",
|
|
1210
|
-
"appearance": "none",
|
|
1211
|
-
"backgroundColor": "#ffffff",
|
|
1212
|
-
"borderColor": "#d92916",
|
|
1213
|
-
"borderRadius": "50%",
|
|
1214
|
-
"borderStyle": "solid",
|
|
1215
|
-
"borderWidth": 4,
|
|
1216
|
-
"boxSizing": "border-box",
|
|
1217
|
-
"height": 16,
|
|
1218
|
-
"margin": 0,
|
|
1219
|
-
"minHeight": 16,
|
|
1220
|
-
"minWidth": 16,
|
|
1221
|
-
"outline": "none",
|
|
1222
|
-
"width": 16,
|
|
1223
|
-
}
|
|
1224
|
-
}
|
|
1225
|
-
type="radio"
|
|
1226
|
-
/>
|
|
1227
|
-
`;
|
|
1228
|
-
|
|
1229
|
-
exports[`RadioCore type:error state:hovered checked:false 1`] = `
|
|
1230
|
-
<input
|
|
1231
|
-
aria-invalid={true}
|
|
1232
|
-
checked={false}
|
|
1233
786
|
className=""
|
|
1234
787
|
disabled={false}
|
|
1235
788
|
onChange={[Function]}
|
|
789
|
+
onClick={[Function]}
|
|
1236
790
|
style={
|
|
1237
791
|
{
|
|
792
|
+
":active": {
|
|
793
|
+
"backgroundColor": "#fceeec",
|
|
794
|
+
"borderColor": "#9e271d",
|
|
795
|
+
"borderWidth": 2,
|
|
796
|
+
},
|
|
797
|
+
":focusVisible": {
|
|
798
|
+
"backgroundColor": "#fceeec",
|
|
799
|
+
"borderColor": "#d92916",
|
|
800
|
+
"borderWidth": 2,
|
|
801
|
+
},
|
|
802
|
+
":hover": {
|
|
803
|
+
"backgroundColor": "#fceeec",
|
|
804
|
+
"borderColor": "#d92916",
|
|
805
|
+
"borderWidth": 2,
|
|
806
|
+
},
|
|
1238
807
|
"MozAppearance": "none",
|
|
1239
808
|
"WebkitAppearance": "none",
|
|
1240
809
|
"appearance": "none",
|
|
@@ -1242,7 +811,7 @@ exports[`RadioCore type:error state:hovered checked:false 1`] = `
|
|
|
1242
811
|
"borderColor": "#d92916",
|
|
1243
812
|
"borderRadius": "50%",
|
|
1244
813
|
"borderStyle": "solid",
|
|
1245
|
-
"borderWidth":
|
|
814
|
+
"borderWidth": 1,
|
|
1246
815
|
"boxSizing": "border-box",
|
|
1247
816
|
"height": 16,
|
|
1248
817
|
"margin": 0,
|
|
@@ -1256,15 +825,26 @@ exports[`RadioCore type:error state:hovered checked:false 1`] = `
|
|
|
1256
825
|
/>
|
|
1257
826
|
`;
|
|
1258
827
|
|
|
1259
|
-
exports[`RadioCore type:error
|
|
828
|
+
exports[`RadioCore type:error checked:true 1`] = `
|
|
1260
829
|
<input
|
|
1261
830
|
aria-invalid={true}
|
|
1262
831
|
checked={true}
|
|
1263
832
|
className=""
|
|
1264
833
|
disabled={false}
|
|
1265
834
|
onChange={[Function]}
|
|
835
|
+
onClick={[Function]}
|
|
1266
836
|
style={
|
|
1267
837
|
{
|
|
838
|
+
":active": {
|
|
839
|
+
"borderColor": "#9e271d",
|
|
840
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #9e271d",
|
|
841
|
+
},
|
|
842
|
+
":focusVisible": {
|
|
843
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #d92916",
|
|
844
|
+
},
|
|
845
|
+
":hover": {
|
|
846
|
+
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #d92916",
|
|
847
|
+
},
|
|
1268
848
|
"MozAppearance": "none",
|
|
1269
849
|
"WebkitAppearance": "none",
|
|
1270
850
|
"appearance": "none",
|
|
@@ -1273,68 +853,6 @@ exports[`RadioCore type:error state:hovered checked:true 1`] = `
|
|
|
1273
853
|
"borderRadius": "50%",
|
|
1274
854
|
"borderStyle": "solid",
|
|
1275
855
|
"borderWidth": 4,
|
|
1276
|
-
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #d92916",
|
|
1277
|
-
"boxSizing": "border-box",
|
|
1278
|
-
"height": 16,
|
|
1279
|
-
"margin": 0,
|
|
1280
|
-
"minHeight": 16,
|
|
1281
|
-
"minWidth": 16,
|
|
1282
|
-
"outline": "none",
|
|
1283
|
-
"width": 16,
|
|
1284
|
-
}
|
|
1285
|
-
}
|
|
1286
|
-
type="radio"
|
|
1287
|
-
/>
|
|
1288
|
-
`;
|
|
1289
|
-
|
|
1290
|
-
exports[`RadioCore type:error state:pressed checked:false 1`] = `
|
|
1291
|
-
<input
|
|
1292
|
-
aria-invalid={true}
|
|
1293
|
-
checked={false}
|
|
1294
|
-
className=""
|
|
1295
|
-
disabled={false}
|
|
1296
|
-
onChange={[Function]}
|
|
1297
|
-
style={
|
|
1298
|
-
{
|
|
1299
|
-
"MozAppearance": "none",
|
|
1300
|
-
"WebkitAppearance": "none",
|
|
1301
|
-
"appearance": "none",
|
|
1302
|
-
"backgroundColor": "#fceeec",
|
|
1303
|
-
"borderColor": "#9e271d",
|
|
1304
|
-
"borderRadius": "50%",
|
|
1305
|
-
"borderStyle": "solid",
|
|
1306
|
-
"borderWidth": 2,
|
|
1307
|
-
"boxSizing": "border-box",
|
|
1308
|
-
"height": 16,
|
|
1309
|
-
"margin": 0,
|
|
1310
|
-
"minHeight": 16,
|
|
1311
|
-
"minWidth": 16,
|
|
1312
|
-
"outline": "none",
|
|
1313
|
-
"width": 16,
|
|
1314
|
-
}
|
|
1315
|
-
}
|
|
1316
|
-
type="radio"
|
|
1317
|
-
/>
|
|
1318
|
-
`;
|
|
1319
|
-
|
|
1320
|
-
exports[`RadioCore type:error state:pressed checked:true 1`] = `
|
|
1321
|
-
<input
|
|
1322
|
-
aria-invalid={true}
|
|
1323
|
-
checked={true}
|
|
1324
|
-
className=""
|
|
1325
|
-
disabled={false}
|
|
1326
|
-
onChange={[Function]}
|
|
1327
|
-
style={
|
|
1328
|
-
{
|
|
1329
|
-
"MozAppearance": "none",
|
|
1330
|
-
"WebkitAppearance": "none",
|
|
1331
|
-
"appearance": "none",
|
|
1332
|
-
"backgroundColor": "#ffffff",
|
|
1333
|
-
"borderColor": "#9e271d",
|
|
1334
|
-
"borderRadius": "50%",
|
|
1335
|
-
"borderStyle": "solid",
|
|
1336
|
-
"borderWidth": 4,
|
|
1337
|
-
"boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #9e271d",
|
|
1338
856
|
"boxSizing": "border-box",
|
|
1339
857
|
"height": 16,
|
|
1340
858
|
"margin": 0,
|