@khanacademy/wonder-blocks-dropdown 2.8.0 → 2.8.2

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 (4) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/index.js +307 -277
  3. package/package.json +6 -6
  4. package/src/__tests__/__snapshots__/generated-snapshot.test.js.snap +248 -248
package/src/__tests__/__snapshots__/generated-snapshot.test.js.snap CHANGED
@@ -4,7 +4,7 @@ exports[`wonder-blocks-dropdown example 1 1`] = `
4
4
  <div
5
5
  className=""
6
6
  style={
7
- Object {
7
+ {
8
8
  "alignItems": "stretch",
9
9
  "borderStyle": "solid",
10
10
  "borderWidth": 0,
@@ -26,7 +26,7 @@ exports[`wonder-blocks-dropdown example 1 1`] = `
26
26
  onKeyDown={[Function]}
27
27
  onKeyUp={[Function]}
28
28
  style={
29
- Object {
29
+ {
30
30
  "alignItems": "stretch",
31
31
  "borderStyle": "solid",
32
32
  "borderWidth": 0,
@@ -50,7 +50,7 @@ exports[`wonder-blocks-dropdown example 1 1`] = `
50
50
  className=""
51
51
  data-test-id="dropdown-live-region"
52
52
  style={
53
- Object {
53
+ {
54
54
  "border": 0,
55
55
  "clip": "rect(0,0,0,0)",
56
56
  "height": 1,
@@ -82,11 +82,11 @@ exports[`wonder-blocks-dropdown example 1 1`] = `
82
82
  onTouchEnd={[Function]}
83
83
  onTouchStart={[Function]}
84
84
  style={
85
- Object {
86
- "::MozFocusInner": Object {
85
+ {
86
+ "::MozFocusInner": {
87
87
  "border": 0,
88
88
  },
89
- ":focus": Object {
89
+ ":focus": {
90
90
  "WebkitTapHighlightColor": "rgba(0,0,0,0)",
91
91
  },
92
92
  "alignItems": "center",
@@ -112,7 +112,7 @@ exports[`wonder-blocks-dropdown example 1 1`] = `
112
112
  <div
113
113
  className=""
114
114
  style={
115
- Object {
115
+ {
116
116
  "alignItems": "stretch",
117
117
  "borderStyle": "solid",
118
118
  "borderWidth": 0,
@@ -131,12 +131,12 @@ exports[`wonder-blocks-dropdown example 1 1`] = `
131
131
  <span
132
132
  className=""
133
133
  style={
134
- Object {
134
+ {
135
135
  "MozOsxFontSmoothing": "grayscale",
136
136
  "WebkitFontSmoothing": "antialiased",
137
137
  "alignItems": "center",
138
138
  "display": "inline-block",
139
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
139
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
140
140
  "fontSize": 16,
141
141
  "fontWeight": "bold",
142
142
  "lineHeight": "20px",
@@ -156,7 +156,7 @@ exports[`wonder-blocks-dropdown example 1 1`] = `
156
156
  aria-hidden="true"
157
157
  className=""
158
158
  style={
159
- Object {
159
+ {
160
160
  "MsFlexBasis": 4,
161
161
  "MsFlexPreferredSize": 4,
162
162
  "WebkitFlexBasis": 4,
@@ -182,7 +182,7 @@ exports[`wonder-blocks-dropdown example 1 1`] = `
182
182
  className=""
183
183
  height={16}
184
184
  style={
185
- Object {
185
+ {
186
186
  "display": "inline-block",
187
187
  "flexGrow": 0,
188
188
  "flexShrink": 0,
@@ -206,7 +206,7 @@ exports[`wonder-blocks-dropdown example 2 1`] = `
206
206
  <div
207
207
  className=""
208
208
  style={
209
- Object {
209
+ {
210
210
  "alignItems": "stretch",
211
211
  "borderStyle": "solid",
212
212
  "borderWidth": 0,
@@ -226,7 +226,7 @@ exports[`wonder-blocks-dropdown example 2 1`] = `
226
226
  aria-hidden="true"
227
227
  className=""
228
228
  style={
229
- Object {
229
+ {
230
230
  "alignItems": "stretch",
231
231
  "borderStyle": "solid",
232
232
  "borderWidth": 0,
@@ -248,7 +248,7 @@ exports[`wonder-blocks-dropdown example 2 1`] = `
248
248
  onKeyDown={[Function]}
249
249
  onKeyUp={[Function]}
250
250
  style={
251
- Object {
251
+ {
252
252
  "alignItems": "stretch",
253
253
  "borderStyle": "solid",
254
254
  "borderWidth": 0,
@@ -272,7 +272,7 @@ exports[`wonder-blocks-dropdown example 2 1`] = `
272
272
  className=""
273
273
  data-test-id="dropdown-live-region"
274
274
  style={
275
- Object {
275
+ {
276
276
  "border": 0,
277
277
  "clip": "rect(0,0,0,0)",
278
278
  "height": 1,
@@ -303,11 +303,11 @@ exports[`wonder-blocks-dropdown example 2 1`] = `
303
303
  onTouchEnd={[Function]}
304
304
  onTouchStart={[Function]}
305
305
  style={
306
- Object {
307
- "::MozFocusInner": Object {
306
+ {
307
+ "::MozFocusInner": {
308
308
  "border": 0,
309
309
  },
310
- ":focus": Object {
310
+ ":focus": {
311
311
  "WebkitTapHighlightColor": "rgba(0,0,0,0)",
312
312
  },
313
313
  "alignItems": "center",
@@ -333,7 +333,7 @@ exports[`wonder-blocks-dropdown example 2 1`] = `
333
333
  <div
334
334
  className=""
335
335
  style={
336
- Object {
336
+ {
337
337
  "alignItems": "stretch",
338
338
  "borderStyle": "solid",
339
339
  "borderWidth": 0,
@@ -352,12 +352,12 @@ exports[`wonder-blocks-dropdown example 2 1`] = `
352
352
  <span
353
353
  className=""
354
354
  style={
355
- Object {
355
+ {
356
356
  "MozOsxFontSmoothing": "grayscale",
357
357
  "WebkitFontSmoothing": "antialiased",
358
358
  "alignItems": "center",
359
359
  "display": "inline-block",
360
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
360
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
361
361
  "fontSize": 16,
362
362
  "fontWeight": "bold",
363
363
  "lineHeight": "20px",
@@ -377,7 +377,7 @@ exports[`wonder-blocks-dropdown example 2 1`] = `
377
377
  aria-hidden="true"
378
378
  className=""
379
379
  style={
380
- Object {
380
+ {
381
381
  "MsFlexBasis": 4,
382
382
  "MsFlexPreferredSize": 4,
383
383
  "WebkitFlexBasis": 4,
@@ -403,7 +403,7 @@ exports[`wonder-blocks-dropdown example 2 1`] = `
403
403
  className=""
404
404
  height={16}
405
405
  style={
406
- Object {
406
+ {
407
407
  "display": "inline-block",
408
408
  "flexGrow": 0,
409
409
  "flexShrink": 0,
@@ -427,7 +427,7 @@ exports[`wonder-blocks-dropdown example 3 1`] = `
427
427
  <div
428
428
  className=""
429
429
  style={
430
- Object {
430
+ {
431
431
  "alignItems": "stretch",
432
432
  "borderStyle": "solid",
433
433
  "borderWidth": 0,
@@ -448,7 +448,7 @@ exports[`wonder-blocks-dropdown example 3 1`] = `
448
448
  onKeyDown={[Function]}
449
449
  onKeyUp={[Function]}
450
450
  style={
451
- Object {
451
+ {
452
452
  "alignItems": "stretch",
453
453
  "borderStyle": "solid",
454
454
  "borderWidth": 0,
@@ -472,7 +472,7 @@ exports[`wonder-blocks-dropdown example 3 1`] = `
472
472
  className=""
473
473
  data-test-id="dropdown-live-region"
474
474
  style={
475
- Object {
475
+ {
476
476
  "border": 0,
477
477
  "clip": "rect(0,0,0,0)",
478
478
  "height": 1,
@@ -503,11 +503,11 @@ exports[`wonder-blocks-dropdown example 3 1`] = `
503
503
  onTouchEnd={[Function]}
504
504
  onTouchStart={[Function]}
505
505
  style={
506
- Object {
507
- "::MozFocusInner": Object {
506
+ {
507
+ "::MozFocusInner": {
508
508
  "border": 0,
509
509
  },
510
- ":focus": Object {
510
+ ":focus": {
511
511
  "WebkitTapHighlightColor": "rgba(0,0,0,0)",
512
512
  },
513
513
  "alignItems": "center",
@@ -533,7 +533,7 @@ exports[`wonder-blocks-dropdown example 3 1`] = `
533
533
  <div
534
534
  className=""
535
535
  style={
536
- Object {
536
+ {
537
537
  "alignItems": "stretch",
538
538
  "borderStyle": "solid",
539
539
  "borderWidth": 0,
@@ -552,12 +552,12 @@ exports[`wonder-blocks-dropdown example 3 1`] = `
552
552
  <span
553
553
  className=""
554
554
  style={
555
- Object {
555
+ {
556
556
  "MozOsxFontSmoothing": "grayscale",
557
557
  "WebkitFontSmoothing": "antialiased",
558
558
  "alignItems": "center",
559
559
  "display": "inline-block",
560
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
560
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
561
561
  "fontSize": 16,
562
562
  "fontWeight": "bold",
563
563
  "lineHeight": "20px",
@@ -577,7 +577,7 @@ exports[`wonder-blocks-dropdown example 3 1`] = `
577
577
  aria-hidden="true"
578
578
  className=""
579
579
  style={
580
- Object {
580
+ {
581
581
  "MsFlexBasis": 4,
582
582
  "MsFlexPreferredSize": 4,
583
583
  "WebkitFlexBasis": 4,
@@ -603,7 +603,7 @@ exports[`wonder-blocks-dropdown example 3 1`] = `
603
603
  className=""
604
604
  height={16}
605
605
  style={
606
- Object {
606
+ {
607
607
  "display": "inline-block",
608
608
  "flexGrow": 0,
609
609
  "flexShrink": 0,
@@ -627,7 +627,7 @@ exports[`wonder-blocks-dropdown example 4 1`] = `
627
627
  <div
628
628
  className=""
629
629
  style={
630
- Object {
630
+ {
631
631
  "alignItems": "stretch",
632
632
  "borderStyle": "solid",
633
633
  "borderWidth": 0,
@@ -648,7 +648,7 @@ exports[`wonder-blocks-dropdown example 4 1`] = `
648
648
  onKeyDown={[Function]}
649
649
  onKeyUp={[Function]}
650
650
  style={
651
- Object {
651
+ {
652
652
  "alignItems": "stretch",
653
653
  "borderStyle": "solid",
654
654
  "borderWidth": 0,
@@ -672,7 +672,7 @@ exports[`wonder-blocks-dropdown example 4 1`] = `
672
672
  className=""
673
673
  data-test-id="dropdown-live-region"
674
674
  style={
675
- Object {
675
+ {
676
676
  "border": 0,
677
677
  "clip": "rect(0,0,0,0)",
678
678
  "height": 1,
@@ -703,11 +703,11 @@ exports[`wonder-blocks-dropdown example 4 1`] = `
703
703
  onTouchEnd={[Function]}
704
704
  onTouchStart={[Function]}
705
705
  style={
706
- Object {
707
- "::MozFocusInner": Object {
706
+ {
707
+ "::MozFocusInner": {
708
708
  "border": 0,
709
709
  },
710
- ":focus": Object {
710
+ ":focus": {
711
711
  "WebkitTapHighlightColor": "rgba(0,0,0,0)",
712
712
  },
713
713
  "alignItems": "center",
@@ -733,7 +733,7 @@ exports[`wonder-blocks-dropdown example 4 1`] = `
733
733
  <div
734
734
  className=""
735
735
  style={
736
- Object {
736
+ {
737
737
  "alignItems": "stretch",
738
738
  "borderStyle": "solid",
739
739
  "borderWidth": 0,
@@ -752,12 +752,12 @@ exports[`wonder-blocks-dropdown example 4 1`] = `
752
752
  <span
753
753
  className=""
754
754
  style={
755
- Object {
755
+ {
756
756
  "MozOsxFontSmoothing": "grayscale",
757
757
  "WebkitFontSmoothing": "antialiased",
758
758
  "alignItems": "center",
759
759
  "display": "inline-block",
760
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
760
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
761
761
  "fontSize": 16,
762
762
  "fontWeight": "bold",
763
763
  "lineHeight": "20px",
@@ -777,7 +777,7 @@ exports[`wonder-blocks-dropdown example 4 1`] = `
777
777
  aria-hidden="true"
778
778
  className=""
779
779
  style={
780
- Object {
780
+ {
781
781
  "MsFlexBasis": 4,
782
782
  "MsFlexPreferredSize": 4,
783
783
  "WebkitFlexBasis": 4,
@@ -803,7 +803,7 @@ exports[`wonder-blocks-dropdown example 4 1`] = `
803
803
  className=""
804
804
  height={16}
805
805
  style={
806
- Object {
806
+ {
807
807
  "display": "inline-block",
808
808
  "flexGrow": 0,
809
809
  "flexShrink": 0,
@@ -827,7 +827,7 @@ exports[`wonder-blocks-dropdown example 5 1`] = `
827
827
  <div
828
828
  className=""
829
829
  style={
830
- Object {
830
+ {
831
831
  "alignItems": "stretch",
832
832
  "borderStyle": "solid",
833
833
  "borderWidth": 0,
@@ -848,7 +848,7 @@ exports[`wonder-blocks-dropdown example 5 1`] = `
848
848
  onKeyDown={[Function]}
849
849
  onKeyUp={[Function]}
850
850
  style={
851
- Object {
851
+ {
852
852
  "alignItems": "stretch",
853
853
  "borderStyle": "solid",
854
854
  "borderWidth": 0,
@@ -872,7 +872,7 @@ exports[`wonder-blocks-dropdown example 5 1`] = `
872
872
  className=""
873
873
  data-test-id="dropdown-live-region"
874
874
  style={
875
- Object {
875
+ {
876
876
  "border": 0,
877
877
  "clip": "rect(0,0,0,0)",
878
878
  "height": 1,
@@ -904,11 +904,11 @@ exports[`wonder-blocks-dropdown example 5 1`] = `
904
904
  onTouchEnd={[Function]}
905
905
  onTouchStart={[Function]}
906
906
  style={
907
- Object {
908
- "::MozFocusInner": Object {
907
+ {
908
+ "::MozFocusInner": {
909
909
  "border": 0,
910
910
  },
911
- ":focus": Object {
911
+ ":focus": {
912
912
  "WebkitTapHighlightColor": "rgba(0,0,0,0)",
913
913
  },
914
914
  "alignItems": "center",
@@ -934,7 +934,7 @@ exports[`wonder-blocks-dropdown example 5 1`] = `
934
934
  <div
935
935
  className=""
936
936
  style={
937
- Object {
937
+ {
938
938
  "alignItems": "stretch",
939
939
  "borderStyle": "solid",
940
940
  "borderWidth": 0,
@@ -953,12 +953,12 @@ exports[`wonder-blocks-dropdown example 5 1`] = `
953
953
  <span
954
954
  className=""
955
955
  style={
956
- Object {
956
+ {
957
957
  "MozOsxFontSmoothing": "grayscale",
958
958
  "WebkitFontSmoothing": "antialiased",
959
959
  "alignItems": "center",
960
960
  "display": "inline-block",
961
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
961
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
962
962
  "fontSize": 16,
963
963
  "fontWeight": "bold",
964
964
  "lineHeight": "20px",
@@ -978,7 +978,7 @@ exports[`wonder-blocks-dropdown example 5 1`] = `
978
978
  aria-hidden="true"
979
979
  className=""
980
980
  style={
981
- Object {
981
+ {
982
982
  "MsFlexBasis": 4,
983
983
  "MsFlexPreferredSize": 4,
984
984
  "WebkitFlexBasis": 4,
@@ -1004,7 +1004,7 @@ exports[`wonder-blocks-dropdown example 5 1`] = `
1004
1004
  className=""
1005
1005
  height={16}
1006
1006
  style={
1007
- Object {
1007
+ {
1008
1008
  "display": "inline-block",
1009
1009
  "flexGrow": 0,
1010
1010
  "flexShrink": 0,
@@ -1028,7 +1028,7 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1028
1028
  <div
1029
1029
  className=""
1030
1030
  style={
1031
- Object {
1031
+ {
1032
1032
  "alignItems": "stretch",
1033
1033
  "borderStyle": "solid",
1034
1034
  "borderWidth": 0,
@@ -1049,7 +1049,7 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1049
1049
  onKeyDown={[Function]}
1050
1050
  onKeyUp={[Function]}
1051
1051
  style={
1052
- Object {
1052
+ {
1053
1053
  "alignItems": "stretch",
1054
1054
  "borderStyle": "solid",
1055
1055
  "borderWidth": 0,
@@ -1073,7 +1073,7 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1073
1073
  className=""
1074
1074
  data-test-id="dropdown-live-region"
1075
1075
  style={
1076
- Object {
1076
+ {
1077
1077
  "border": 0,
1078
1078
  "clip": "rect(0,0,0,0)",
1079
1079
  "height": 1,
@@ -1104,11 +1104,11 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1104
1104
  onTouchEnd={[Function]}
1105
1105
  onTouchStart={[Function]}
1106
1106
  style={
1107
- Object {
1108
- "::MozFocusInner": Object {
1107
+ {
1108
+ "::MozFocusInner": {
1109
1109
  "border": 0,
1110
1110
  },
1111
- ":focus": Object {
1111
+ ":focus": {
1112
1112
  "WebkitTapHighlightColor": "rgba(0,0,0,0)",
1113
1113
  },
1114
1114
  "alignItems": "center",
@@ -1134,7 +1134,7 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1134
1134
  <div
1135
1135
  className=""
1136
1136
  style={
1137
- Object {
1137
+ {
1138
1138
  "alignItems": "stretch",
1139
1139
  "borderStyle": "solid",
1140
1140
  "borderWidth": 0,
@@ -1153,12 +1153,12 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1153
1153
  <span
1154
1154
  className=""
1155
1155
  style={
1156
- Object {
1156
+ {
1157
1157
  "MozOsxFontSmoothing": "grayscale",
1158
1158
  "WebkitFontSmoothing": "antialiased",
1159
1159
  "alignItems": "center",
1160
1160
  "display": "inline-block",
1161
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
1161
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
1162
1162
  "fontSize": 16,
1163
1163
  "fontWeight": "bold",
1164
1164
  "lineHeight": "20px",
@@ -1178,7 +1178,7 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1178
1178
  aria-hidden="true"
1179
1179
  className=""
1180
1180
  style={
1181
- Object {
1181
+ {
1182
1182
  "MsFlexBasis": 4,
1183
1183
  "MsFlexPreferredSize": 4,
1184
1184
  "WebkitFlexBasis": 4,
@@ -1204,7 +1204,7 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1204
1204
  className=""
1205
1205
  height={16}
1206
1206
  style={
1207
- Object {
1207
+ {
1208
1208
  "display": "inline-block",
1209
1209
  "flexGrow": 0,
1210
1210
  "flexShrink": 0,
@@ -1225,7 +1225,7 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1225
1225
  aria-hidden="true"
1226
1226
  className=""
1227
1227
  style={
1228
- Object {
1228
+ {
1229
1229
  "MsFlexBasis": 16,
1230
1230
  "MsFlexPreferredSize": 16,
1231
1231
  "WebkitFlexBasis": 16,
@@ -1265,11 +1265,11 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1265
1265
  onTouchStart={[Function]}
1266
1266
  role="button"
1267
1267
  style={
1268
- Object {
1269
- "::MozFocusInner": Object {
1268
+ {
1269
+ "::MozFocusInner": {
1270
1270
  "border": 0,
1271
1271
  },
1272
- ":focus": Object {
1272
+ ":focus": {
1273
1273
  "WebkitTapHighlightColor": "rgba(0,0,0,0)",
1274
1274
  },
1275
1275
  "alignItems": "center",
@@ -1300,12 +1300,12 @@ exports[`wonder-blocks-dropdown example 6 1`] = `
1300
1300
  <span
1301
1301
  className=""
1302
1302
  style={
1303
- Object {
1303
+ {
1304
1304
  "MozOsxFontSmoothing": "grayscale",
1305
1305
  "WebkitFontSmoothing": "antialiased",
1306
1306
  "alignItems": "center",
1307
1307
  "display": "inline-block",
1308
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
1308
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
1309
1309
  "fontSize": 16,
1310
1310
  "fontWeight": "bold",
1311
1311
  "lineHeight": "20px",
@@ -1328,7 +1328,7 @@ exports[`wonder-blocks-dropdown example 7 1`] = `
1328
1328
  onKeyDown={[Function]}
1329
1329
  onKeyUp={[Function]}
1330
1330
  style={
1331
- Object {
1331
+ {
1332
1332
  "alignItems": "stretch",
1333
1333
  "borderStyle": "solid",
1334
1334
  "borderWidth": 0,
@@ -1352,7 +1352,7 @@ exports[`wonder-blocks-dropdown example 7 1`] = `
1352
1352
  className=""
1353
1353
  data-test-id="dropdown-live-region"
1354
1354
  style={
1355
- Object {
1355
+ {
1356
1356
  "border": 0,
1357
1357
  "clip": "rect(0,0,0,0)",
1358
1358
  "height": 1,
@@ -1382,11 +1382,11 @@ exports[`wonder-blocks-dropdown example 7 1`] = `
1382
1382
  onTouchEnd={[Function]}
1383
1383
  onTouchStart={[Function]}
1384
1384
  style={
1385
- Object {
1385
+ {
1386
1386
  "MozOsxFontSmoothing": "grayscale",
1387
1387
  "WebkitFontSmoothing": "antialiased",
1388
1388
  "display": "block",
1389
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
1389
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
1390
1390
  "fontSize": 16,
1391
1391
  "fontWeight": 700,
1392
1392
  "lineHeight": "20px",
@@ -1403,7 +1403,7 @@ exports[`wonder-blocks-dropdown example 8 1`] = `
1403
1403
  <div
1404
1404
  className=""
1405
1405
  style={
1406
- Object {
1406
+ {
1407
1407
  "alignItems": "stretch",
1408
1408
  "borderStyle": "solid",
1409
1409
  "borderWidth": 0,
@@ -1424,7 +1424,7 @@ exports[`wonder-blocks-dropdown example 8 1`] = `
1424
1424
  onKeyDown={[Function]}
1425
1425
  onKeyUp={[Function]}
1426
1426
  style={
1427
- Object {
1427
+ {
1428
1428
  "alignItems": "stretch",
1429
1429
  "borderStyle": "solid",
1430
1430
  "borderWidth": 0,
@@ -1449,7 +1449,7 @@ exports[`wonder-blocks-dropdown example 8 1`] = `
1449
1449
  className=""
1450
1450
  data-test-id="dropdown-live-region"
1451
1451
  style={
1452
- Object {
1452
+ {
1453
1453
  "border": 0,
1454
1454
  "clip": "rect(0,0,0,0)",
1455
1455
  "height": 1,
@@ -1481,8 +1481,8 @@ exports[`wonder-blocks-dropdown example 8 1`] = `
1481
1481
  onTouchEnd={[Function]}
1482
1482
  onTouchStart={[Function]}
1483
1483
  style={
1484
- Object {
1485
- "::MozFocusInner": Object {
1484
+ {
1485
+ "::MozFocusInner": {
1486
1486
  "border": 0,
1487
1487
  },
1488
1488
  "alignItems": "center",
@@ -1512,11 +1512,11 @@ exports[`wonder-blocks-dropdown example 8 1`] = `
1512
1512
  <span
1513
1513
  className=""
1514
1514
  style={
1515
- Object {
1515
+ {
1516
1516
  "MozOsxFontSmoothing": "grayscale",
1517
1517
  "WebkitFontSmoothing": "antialiased",
1518
1518
  "display": "block",
1519
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
1519
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
1520
1520
  "fontSize": 16,
1521
1521
  "fontWeight": 400,
1522
1522
  "lineHeight": "20px",
@@ -1535,7 +1535,7 @@ exports[`wonder-blocks-dropdown example 8 1`] = `
1535
1535
  className=""
1536
1536
  height={16}
1537
1537
  style={
1538
- Object {
1538
+ {
1539
1539
  "display": "inline-block",
1540
1540
  "flexGrow": 0,
1541
1541
  "flexShrink": 0,
@@ -1560,7 +1560,7 @@ exports[`wonder-blocks-dropdown example 9 1`] = `
1560
1560
  <div
1561
1561
  className=""
1562
1562
  style={
1563
- Object {
1563
+ {
1564
1564
  "alignItems": "stretch",
1565
1565
  "borderStyle": "solid",
1566
1566
  "borderWidth": 0,
@@ -1581,7 +1581,7 @@ exports[`wonder-blocks-dropdown example 9 1`] = `
1581
1581
  onKeyDown={[Function]}
1582
1582
  onKeyUp={[Function]}
1583
1583
  style={
1584
- Object {
1584
+ {
1585
1585
  "alignItems": "stretch",
1586
1586
  "borderStyle": "solid",
1587
1587
  "borderWidth": 0,
@@ -1605,7 +1605,7 @@ exports[`wonder-blocks-dropdown example 9 1`] = `
1605
1605
  className=""
1606
1606
  data-test-id="dropdown-live-region"
1607
1607
  style={
1608
- Object {
1608
+ {
1609
1609
  "border": 0,
1610
1610
  "clip": "rect(0,0,0,0)",
1611
1611
  "height": 1,
@@ -1636,8 +1636,8 @@ exports[`wonder-blocks-dropdown example 9 1`] = `
1636
1636
  onTouchEnd={[Function]}
1637
1637
  onTouchStart={[Function]}
1638
1638
  style={
1639
- Object {
1640
- "::MozFocusInner": Object {
1639
+ {
1640
+ "::MozFocusInner": {
1641
1641
  "border": 0,
1642
1642
  },
1643
1643
  "alignItems": "center",
@@ -1667,11 +1667,11 @@ exports[`wonder-blocks-dropdown example 9 1`] = `
1667
1667
  <span
1668
1668
  className=""
1669
1669
  style={
1670
- Object {
1670
+ {
1671
1671
  "MozOsxFontSmoothing": "grayscale",
1672
1672
  "WebkitFontSmoothing": "antialiased",
1673
1673
  "display": "block",
1674
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
1674
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
1675
1675
  "fontSize": 16,
1676
1676
  "fontWeight": 400,
1677
1677
  "lineHeight": "20px",
@@ -1690,7 +1690,7 @@ exports[`wonder-blocks-dropdown example 9 1`] = `
1690
1690
  className=""
1691
1691
  height={16}
1692
1692
  style={
1693
- Object {
1693
+ {
1694
1694
  "display": "inline-block",
1695
1695
  "flexGrow": 0,
1696
1696
  "flexShrink": 0,
@@ -1715,7 +1715,7 @@ exports[`wonder-blocks-dropdown example 10 1`] = `
1715
1715
  <div
1716
1716
  className=""
1717
1717
  style={
1718
- Object {
1718
+ {
1719
1719
  "alignItems": "stretch",
1720
1720
  "borderStyle": "solid",
1721
1721
  "borderWidth": 0,
@@ -1736,7 +1736,7 @@ exports[`wonder-blocks-dropdown example 10 1`] = `
1736
1736
  onKeyDown={[Function]}
1737
1737
  onKeyUp={[Function]}
1738
1738
  style={
1739
- Object {
1739
+ {
1740
1740
  "alignItems": "stretch",
1741
1741
  "borderStyle": "solid",
1742
1742
  "borderWidth": 0,
@@ -1760,7 +1760,7 @@ exports[`wonder-blocks-dropdown example 10 1`] = `
1760
1760
  className=""
1761
1761
  data-test-id="dropdown-live-region"
1762
1762
  style={
1763
- Object {
1763
+ {
1764
1764
  "border": 0,
1765
1765
  "clip": "rect(0,0,0,0)",
1766
1766
  "height": 1,
@@ -1791,8 +1791,8 @@ exports[`wonder-blocks-dropdown example 10 1`] = `
1791
1791
  onTouchEnd={[Function]}
1792
1792
  onTouchStart={[Function]}
1793
1793
  style={
1794
- Object {
1795
- "::MozFocusInner": Object {
1794
+ {
1795
+ "::MozFocusInner": {
1796
1796
  "border": 0,
1797
1797
  },
1798
1798
  "alignItems": "center",
@@ -1823,11 +1823,11 @@ exports[`wonder-blocks-dropdown example 10 1`] = `
1823
1823
  <span
1824
1824
  className=""
1825
1825
  style={
1826
- Object {
1826
+ {
1827
1827
  "MozOsxFontSmoothing": "grayscale",
1828
1828
  "WebkitFontSmoothing": "antialiased",
1829
1829
  "display": "block",
1830
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
1830
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
1831
1831
  "fontSize": 16,
1832
1832
  "fontWeight": 400,
1833
1833
  "lineHeight": "20px",
@@ -1846,7 +1846,7 @@ exports[`wonder-blocks-dropdown example 10 1`] = `
1846
1846
  className=""
1847
1847
  height={16}
1848
1848
  style={
1849
- Object {
1849
+ {
1850
1850
  "display": "inline-block",
1851
1851
  "flexGrow": 0,
1852
1852
  "flexShrink": 0,
@@ -1871,7 +1871,7 @@ exports[`wonder-blocks-dropdown example 11 1`] = `
1871
1871
  <div
1872
1872
  className=""
1873
1873
  style={
1874
- Object {
1874
+ {
1875
1875
  "alignItems": "stretch",
1876
1876
  "borderStyle": "solid",
1877
1877
  "borderWidth": 0,
@@ -1890,9 +1890,9 @@ exports[`wonder-blocks-dropdown example 11 1`] = `
1890
1890
  <div
1891
1891
  className=""
1892
1892
  style={
1893
- Object {
1893
+ {
1894
1894
  "alignItems": "stretch",
1895
- "backgroundColor": "#0a2a66",
1895
+ "backgroundColor": "#0b2149",
1896
1896
  "borderStyle": "solid",
1897
1897
  "borderWidth": 0,
1898
1898
  "boxSizing": "border-box",
@@ -1917,7 +1917,7 @@ exports[`wonder-blocks-dropdown example 11 1`] = `
1917
1917
  onKeyDown={[Function]}
1918
1918
  onKeyUp={[Function]}
1919
1919
  style={
1920
- Object {
1920
+ {
1921
1921
  "alignItems": "stretch",
1922
1922
  "borderStyle": "solid",
1923
1923
  "borderWidth": 0,
@@ -1941,7 +1941,7 @@ exports[`wonder-blocks-dropdown example 11 1`] = `
1941
1941
  className=""
1942
1942
  data-test-id="dropdown-live-region"
1943
1943
  style={
1944
- Object {
1944
+ {
1945
1945
  "border": 0,
1946
1946
  "clip": "rect(0,0,0,0)",
1947
1947
  "height": 1,
@@ -1972,8 +1972,8 @@ exports[`wonder-blocks-dropdown example 11 1`] = `
1972
1972
  onTouchEnd={[Function]}
1973
1973
  onTouchStart={[Function]}
1974
1974
  style={
1975
- Object {
1976
- "::MozFocusInner": Object {
1975
+ {
1976
+ "::MozFocusInner": {
1977
1977
  "border": 0,
1978
1978
  },
1979
1979
  "alignItems": "center",
@@ -2003,11 +2003,11 @@ exports[`wonder-blocks-dropdown example 11 1`] = `
2003
2003
  <span
2004
2004
  className=""
2005
2005
  style={
2006
- Object {
2006
+ {
2007
2007
  "MozOsxFontSmoothing": "grayscale",
2008
2008
  "WebkitFontSmoothing": "antialiased",
2009
2009
  "display": "block",
2010
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
2010
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
2011
2011
  "fontSize": 16,
2012
2012
  "fontWeight": 400,
2013
2013
  "lineHeight": "20px",
@@ -2026,7 +2026,7 @@ exports[`wonder-blocks-dropdown example 11 1`] = `
2026
2026
  className=""
2027
2027
  height={16}
2028
2028
  style={
2029
- Object {
2029
+ {
2030
2030
  "display": "inline-block",
2031
2031
  "flexGrow": 0,
2032
2032
  "flexShrink": 0,
@@ -2052,7 +2052,7 @@ exports[`wonder-blocks-dropdown example 12 1`] = `
2052
2052
  <div
2053
2053
  className=""
2054
2054
  style={
2055
- Object {
2055
+ {
2056
2056
  "alignItems": "stretch",
2057
2057
  "borderStyle": "solid",
2058
2058
  "borderWidth": 0,
@@ -2073,7 +2073,7 @@ exports[`wonder-blocks-dropdown example 12 1`] = `
2073
2073
  onKeyDown={[Function]}
2074
2074
  onKeyUp={[Function]}
2075
2075
  style={
2076
- Object {
2076
+ {
2077
2077
  "alignItems": "stretch",
2078
2078
  "borderStyle": "solid",
2079
2079
  "borderWidth": 0,
@@ -2097,7 +2097,7 @@ exports[`wonder-blocks-dropdown example 12 1`] = `
2097
2097
  className=""
2098
2098
  data-test-id="dropdown-live-region"
2099
2099
  style={
2100
- Object {
2100
+ {
2101
2101
  "border": 0,
2102
2102
  "clip": "rect(0,0,0,0)",
2103
2103
  "height": 1,
@@ -2128,8 +2128,8 @@ exports[`wonder-blocks-dropdown example 12 1`] = `
2128
2128
  onTouchEnd={[Function]}
2129
2129
  onTouchStart={[Function]}
2130
2130
  style={
2131
- Object {
2132
- "::MozFocusInner": Object {
2131
+ {
2132
+ "::MozFocusInner": {
2133
2133
  "border": 0,
2134
2134
  },
2135
2135
  "alignItems": "center",
@@ -2160,11 +2160,11 @@ exports[`wonder-blocks-dropdown example 12 1`] = `
2160
2160
  <span
2161
2161
  className=""
2162
2162
  style={
2163
- Object {
2163
+ {
2164
2164
  "MozOsxFontSmoothing": "grayscale",
2165
2165
  "WebkitFontSmoothing": "antialiased",
2166
2166
  "display": "block",
2167
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
2167
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
2168
2168
  "fontSize": 16,
2169
2169
  "fontWeight": 400,
2170
2170
  "lineHeight": "20px",
@@ -2183,7 +2183,7 @@ exports[`wonder-blocks-dropdown example 12 1`] = `
2183
2183
  className=""
2184
2184
  height={16}
2185
2185
  style={
2186
- Object {
2186
+ {
2187
2187
  "display": "inline-block",
2188
2188
  "flexGrow": 0,
2189
2189
  "flexShrink": 0,
@@ -2208,7 +2208,7 @@ exports[`wonder-blocks-dropdown example 13 1`] = `
2208
2208
  <div
2209
2209
  className=""
2210
2210
  style={
2211
- Object {
2211
+ {
2212
2212
  "alignItems": "stretch",
2213
2213
  "borderStyle": "solid",
2214
2214
  "borderWidth": 0,
@@ -2229,11 +2229,11 @@ exports[`wonder-blocks-dropdown example 13 1`] = `
2229
2229
  htmlFor="unique-single-select"
2230
2230
  id="label-for-single-select"
2231
2231
  style={
2232
- Object {
2232
+ {
2233
2233
  "MozOsxFontSmoothing": "grayscale",
2234
2234
  "WebkitFontSmoothing": "antialiased",
2235
2235
  "display": "block",
2236
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
2236
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
2237
2237
  "fontSize": 16,
2238
2238
  "fontWeight": 700,
2239
2239
  "lineHeight": "20px",
@@ -2247,7 +2247,7 @@ exports[`wonder-blocks-dropdown example 13 1`] = `
2247
2247
  onKeyDown={[Function]}
2248
2248
  onKeyUp={[Function]}
2249
2249
  style={
2250
- Object {
2250
+ {
2251
2251
  "alignItems": "stretch",
2252
2252
  "borderStyle": "solid",
2253
2253
  "borderWidth": 0,
@@ -2271,7 +2271,7 @@ exports[`wonder-blocks-dropdown example 13 1`] = `
2271
2271
  className=""
2272
2272
  data-test-id="dropdown-live-region"
2273
2273
  style={
2274
- Object {
2274
+ {
2275
2275
  "border": 0,
2276
2276
  "clip": "rect(0,0,0,0)",
2277
2277
  "height": 1,
@@ -2304,8 +2304,8 @@ exports[`wonder-blocks-dropdown example 13 1`] = `
2304
2304
  onTouchEnd={[Function]}
2305
2305
  onTouchStart={[Function]}
2306
2306
  style={
2307
- Object {
2308
- "::MozFocusInner": Object {
2307
+ {
2308
+ "::MozFocusInner": {
2309
2309
  "border": 0,
2310
2310
  },
2311
2311
  "alignItems": "center",
@@ -2335,11 +2335,11 @@ exports[`wonder-blocks-dropdown example 13 1`] = `
2335
2335
  <span
2336
2336
  className=""
2337
2337
  style={
2338
- Object {
2338
+ {
2339
2339
  "MozOsxFontSmoothing": "grayscale",
2340
2340
  "WebkitFontSmoothing": "antialiased",
2341
2341
  "display": "block",
2342
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
2342
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
2343
2343
  "fontSize": 16,
2344
2344
  "fontWeight": 400,
2345
2345
  "lineHeight": "20px",
@@ -2358,7 +2358,7 @@ exports[`wonder-blocks-dropdown example 13 1`] = `
2358
2358
  className=""
2359
2359
  height={16}
2360
2360
  style={
2361
- Object {
2361
+ {
2362
2362
  "display": "inline-block",
2363
2363
  "flexGrow": 0,
2364
2364
  "flexShrink": 0,
@@ -2383,7 +2383,7 @@ exports[`wonder-blocks-dropdown example 14 1`] = `
2383
2383
  <div
2384
2384
  className=""
2385
2385
  style={
2386
- Object {
2386
+ {
2387
2387
  "alignItems": "stretch",
2388
2388
  "borderStyle": "solid",
2389
2389
  "borderWidth": 0,
@@ -2404,7 +2404,7 @@ exports[`wonder-blocks-dropdown example 14 1`] = `
2404
2404
  onKeyDown={[Function]}
2405
2405
  onKeyUp={[Function]}
2406
2406
  style={
2407
- Object {
2407
+ {
2408
2408
  "alignItems": "stretch",
2409
2409
  "borderStyle": "solid",
2410
2410
  "borderWidth": 0,
@@ -2428,7 +2428,7 @@ exports[`wonder-blocks-dropdown example 14 1`] = `
2428
2428
  className=""
2429
2429
  data-test-id="dropdown-live-region"
2430
2430
  style={
2431
- Object {
2431
+ {
2432
2432
  "border": 0,
2433
2433
  "clip": "rect(0,0,0,0)",
2434
2434
  "height": 1,
@@ -2459,8 +2459,8 @@ exports[`wonder-blocks-dropdown example 14 1`] = `
2459
2459
  onTouchEnd={[Function]}
2460
2460
  onTouchStart={[Function]}
2461
2461
  style={
2462
- Object {
2463
- "::MozFocusInner": Object {
2462
+ {
2463
+ "::MozFocusInner": {
2464
2464
  "border": 0,
2465
2465
  },
2466
2466
  "alignItems": "center",
@@ -2490,11 +2490,11 @@ exports[`wonder-blocks-dropdown example 14 1`] = `
2490
2490
  <span
2491
2491
  className=""
2492
2492
  style={
2493
- Object {
2493
+ {
2494
2494
  "MozOsxFontSmoothing": "grayscale",
2495
2495
  "WebkitFontSmoothing": "antialiased",
2496
2496
  "display": "block",
2497
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
2497
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
2498
2498
  "fontSize": 16,
2499
2499
  "fontWeight": 400,
2500
2500
  "lineHeight": "20px",
@@ -2513,7 +2513,7 @@ exports[`wonder-blocks-dropdown example 14 1`] = `
2513
2513
  className=""
2514
2514
  height={16}
2515
2515
  style={
2516
- Object {
2516
+ {
2517
2517
  "display": "inline-block",
2518
2518
  "flexGrow": 0,
2519
2519
  "flexShrink": 0,
@@ -2535,7 +2535,7 @@ exports[`wonder-blocks-dropdown example 14 1`] = `
2535
2535
  aria-hidden="true"
2536
2536
  className=""
2537
2537
  style={
2538
- Object {
2538
+ {
2539
2539
  "MsFlexBasis": 16,
2540
2540
  "MsFlexPreferredSize": 16,
2541
2541
  "WebkitFlexBasis": 16,
@@ -2575,11 +2575,11 @@ exports[`wonder-blocks-dropdown example 14 1`] = `
2575
2575
  onTouchStart={[Function]}
2576
2576
  role="button"
2577
2577
  style={
2578
- Object {
2579
- "::MozFocusInner": Object {
2578
+ {
2579
+ "::MozFocusInner": {
2580
2580
  "border": 0,
2581
2581
  },
2582
- ":focus": Object {
2582
+ ":focus": {
2583
2583
  "WebkitTapHighlightColor": "rgba(0,0,0,0)",
2584
2584
  },
2585
2585
  "alignItems": "center",
@@ -2610,12 +2610,12 @@ exports[`wonder-blocks-dropdown example 14 1`] = `
2610
2610
  <span
2611
2611
  className=""
2612
2612
  style={
2613
- Object {
2613
+ {
2614
2614
  "MozOsxFontSmoothing": "grayscale",
2615
2615
  "WebkitFontSmoothing": "antialiased",
2616
2616
  "alignItems": "center",
2617
2617
  "display": "inline-block",
2618
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
2618
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
2619
2619
  "fontSize": 16,
2620
2620
  "fontWeight": "bold",
2621
2621
  "lineHeight": "20px",
@@ -2638,7 +2638,7 @@ exports[`wonder-blocks-dropdown example 15 1`] = `
2638
2638
  onKeyDown={[Function]}
2639
2639
  onKeyUp={[Function]}
2640
2640
  style={
2641
- Object {
2641
+ {
2642
2642
  "alignItems": "stretch",
2643
2643
  "borderStyle": "solid",
2644
2644
  "borderWidth": 0,
@@ -2662,7 +2662,7 @@ exports[`wonder-blocks-dropdown example 15 1`] = `
2662
2662
  className=""
2663
2663
  data-test-id="dropdown-live-region"
2664
2664
  style={
2665
- Object {
2665
+ {
2666
2666
  "border": 0,
2667
2667
  "clip": "rect(0,0,0,0)",
2668
2668
  "height": 1,
@@ -2692,19 +2692,19 @@ exports[`wonder-blocks-dropdown example 15 1`] = `
2692
2692
  onTouchEnd={[Function]}
2693
2693
  onTouchStart={[Function]}
2694
2694
  style={
2695
- Object {
2696
- "@media (maxWidth: 1023px)": Object {
2695
+ {
2696
+ "@media (maxWidth: 1023px)": {
2697
2697
  "fontSize": 24,
2698
2698
  "lineHeight": "28px",
2699
2699
  },
2700
- "@media (minWidth: 1024px)": Object {
2700
+ "@media (minWidth: 1024px)": {
2701
2701
  "fontSize": 28,
2702
2702
  "lineHeight": "32px",
2703
2703
  },
2704
2704
  "MozOsxFontSmoothing": "grayscale",
2705
2705
  "WebkitFontSmoothing": "antialiased",
2706
2706
  "display": "block",
2707
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
2707
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
2708
2708
  "fontWeight": 700,
2709
2709
  "marginBottom": 0,
2710
2710
  "marginTop": 0,
@@ -2721,7 +2721,7 @@ exports[`wonder-blocks-dropdown example 16 1`] = `
2721
2721
  <div
2722
2722
  className=""
2723
2723
  style={
2724
- Object {
2724
+ {
2725
2725
  "alignItems": "stretch",
2726
2726
  "borderStyle": "solid",
2727
2727
  "borderWidth": 0,
@@ -2742,7 +2742,7 @@ exports[`wonder-blocks-dropdown example 16 1`] = `
2742
2742
  onKeyDown={[Function]}
2743
2743
  onKeyUp={[Function]}
2744
2744
  style={
2745
- Object {
2745
+ {
2746
2746
  "alignItems": "stretch",
2747
2747
  "borderStyle": "solid",
2748
2748
  "borderWidth": 0,
@@ -2766,7 +2766,7 @@ exports[`wonder-blocks-dropdown example 16 1`] = `
2766
2766
  className=""
2767
2767
  data-test-id="dropdown-live-region"
2768
2768
  style={
2769
- Object {
2769
+ {
2770
2770
  "border": 0,
2771
2771
  "clip": "rect(0,0,0,0)",
2772
2772
  "height": 1,
@@ -2797,8 +2797,8 @@ exports[`wonder-blocks-dropdown example 16 1`] = `
2797
2797
  onTouchEnd={[Function]}
2798
2798
  onTouchStart={[Function]}
2799
2799
  style={
2800
- Object {
2801
- "::MozFocusInner": Object {
2800
+ {
2801
+ "::MozFocusInner": {
2802
2802
  "border": 0,
2803
2803
  },
2804
2804
  "alignItems": "center",
@@ -2828,11 +2828,11 @@ exports[`wonder-blocks-dropdown example 16 1`] = `
2828
2828
  <span
2829
2829
  className=""
2830
2830
  style={
2831
- Object {
2831
+ {
2832
2832
  "MozOsxFontSmoothing": "grayscale",
2833
2833
  "WebkitFontSmoothing": "antialiased",
2834
2834
  "display": "block",
2835
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
2835
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
2836
2836
  "fontSize": 16,
2837
2837
  "fontWeight": 400,
2838
2838
  "lineHeight": "20px",
@@ -2851,7 +2851,7 @@ exports[`wonder-blocks-dropdown example 16 1`] = `
2851
2851
  className=""
2852
2852
  height={16}
2853
2853
  style={
2854
- Object {
2854
+ {
2855
2855
  "display": "inline-block",
2856
2856
  "flexGrow": 0,
2857
2857
  "flexShrink": 0,
@@ -2876,7 +2876,7 @@ exports[`wonder-blocks-dropdown example 17 1`] = `
2876
2876
  <div
2877
2877
  className=""
2878
2878
  style={
2879
- Object {
2879
+ {
2880
2880
  "alignItems": "stretch",
2881
2881
  "borderStyle": "solid",
2882
2882
  "borderWidth": 0,
@@ -2897,7 +2897,7 @@ exports[`wonder-blocks-dropdown example 17 1`] = `
2897
2897
  onKeyDown={[Function]}
2898
2898
  onKeyUp={[Function]}
2899
2899
  style={
2900
- Object {
2900
+ {
2901
2901
  "alignItems": "stretch",
2902
2902
  "borderStyle": "solid",
2903
2903
  "borderWidth": 0,
@@ -2921,7 +2921,7 @@ exports[`wonder-blocks-dropdown example 17 1`] = `
2921
2921
  className=""
2922
2922
  data-test-id="dropdown-live-region"
2923
2923
  style={
2924
- Object {
2924
+ {
2925
2925
  "border": 0,
2926
2926
  "clip": "rect(0,0,0,0)",
2927
2927
  "height": 1,
@@ -2953,8 +2953,8 @@ exports[`wonder-blocks-dropdown example 17 1`] = `
2953
2953
  onTouchEnd={[Function]}
2954
2954
  onTouchStart={[Function]}
2955
2955
  style={
2956
- Object {
2957
- "::MozFocusInner": Object {
2956
+ {
2957
+ "::MozFocusInner": {
2958
2958
  "border": 0,
2959
2959
  },
2960
2960
  "alignItems": "center",
@@ -2984,11 +2984,11 @@ exports[`wonder-blocks-dropdown example 17 1`] = `
2984
2984
  <span
2985
2985
  className=""
2986
2986
  style={
2987
- Object {
2987
+ {
2988
2988
  "MozOsxFontSmoothing": "grayscale",
2989
2989
  "WebkitFontSmoothing": "antialiased",
2990
2990
  "display": "block",
2991
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
2991
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
2992
2992
  "fontSize": 16,
2993
2993
  "fontWeight": 400,
2994
2994
  "lineHeight": "20px",
@@ -3007,7 +3007,7 @@ exports[`wonder-blocks-dropdown example 17 1`] = `
3007
3007
  className=""
3008
3008
  height={16}
3009
3009
  style={
3010
- Object {
3010
+ {
3011
3011
  "display": "inline-block",
3012
3012
  "flexGrow": 0,
3013
3013
  "flexShrink": 0,
@@ -3032,7 +3032,7 @@ exports[`wonder-blocks-dropdown example 18 1`] = `
3032
3032
  <div
3033
3033
  className=""
3034
3034
  style={
3035
- Object {
3035
+ {
3036
3036
  "alignItems": "stretch",
3037
3037
  "borderStyle": "solid",
3038
3038
  "borderWidth": 0,
@@ -3053,7 +3053,7 @@ exports[`wonder-blocks-dropdown example 18 1`] = `
3053
3053
  onKeyDown={[Function]}
3054
3054
  onKeyUp={[Function]}
3055
3055
  style={
3056
- Object {
3056
+ {
3057
3057
  "alignItems": "stretch",
3058
3058
  "borderStyle": "solid",
3059
3059
  "borderWidth": 0,
@@ -3077,7 +3077,7 @@ exports[`wonder-blocks-dropdown example 18 1`] = `
3077
3077
  className=""
3078
3078
  data-test-id="dropdown-live-region"
3079
3079
  style={
3080
- Object {
3080
+ {
3081
3081
  "border": 0,
3082
3082
  "clip": "rect(0,0,0,0)",
3083
3083
  "height": 1,
@@ -3108,8 +3108,8 @@ exports[`wonder-blocks-dropdown example 18 1`] = `
3108
3108
  onTouchEnd={[Function]}
3109
3109
  onTouchStart={[Function]}
3110
3110
  style={
3111
- Object {
3112
- "::MozFocusInner": Object {
3111
+ {
3112
+ "::MozFocusInner": {
3113
3113
  "border": 0,
3114
3114
  },
3115
3115
  "alignItems": "center",
@@ -3139,11 +3139,11 @@ exports[`wonder-blocks-dropdown example 18 1`] = `
3139
3139
  <span
3140
3140
  className=""
3141
3141
  style={
3142
- Object {
3142
+ {
3143
3143
  "MozOsxFontSmoothing": "grayscale",
3144
3144
  "WebkitFontSmoothing": "antialiased",
3145
3145
  "display": "block",
3146
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
3146
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
3147
3147
  "fontSize": 16,
3148
3148
  "fontWeight": 400,
3149
3149
  "lineHeight": "20px",
@@ -3162,7 +3162,7 @@ exports[`wonder-blocks-dropdown example 18 1`] = `
3162
3162
  className=""
3163
3163
  height={16}
3164
3164
  style={
3165
- Object {
3165
+ {
3166
3166
  "display": "inline-block",
3167
3167
  "flexGrow": 0,
3168
3168
  "flexShrink": 0,
@@ -3187,7 +3187,7 @@ exports[`wonder-blocks-dropdown example 19 1`] = `
3187
3187
  <div
3188
3188
  className=""
3189
3189
  style={
3190
- Object {
3190
+ {
3191
3191
  "alignItems": "stretch",
3192
3192
  "borderStyle": "solid",
3193
3193
  "borderWidth": 0,
@@ -3208,7 +3208,7 @@ exports[`wonder-blocks-dropdown example 19 1`] = `
3208
3208
  onKeyDown={[Function]}
3209
3209
  onKeyUp={[Function]}
3210
3210
  style={
3211
- Object {
3211
+ {
3212
3212
  "alignItems": "stretch",
3213
3213
  "borderStyle": "solid",
3214
3214
  "borderWidth": 0,
@@ -3232,7 +3232,7 @@ exports[`wonder-blocks-dropdown example 19 1`] = `
3232
3232
  className=""
3233
3233
  data-test-id="dropdown-live-region"
3234
3234
  style={
3235
- Object {
3235
+ {
3236
3236
  "border": 0,
3237
3237
  "clip": "rect(0,0,0,0)",
3238
3238
  "height": 1,
@@ -3263,8 +3263,8 @@ exports[`wonder-blocks-dropdown example 19 1`] = `
3263
3263
  onTouchEnd={[Function]}
3264
3264
  onTouchStart={[Function]}
3265
3265
  style={
3266
- Object {
3267
- "::MozFocusInner": Object {
3266
+ {
3267
+ "::MozFocusInner": {
3268
3268
  "border": 0,
3269
3269
  },
3270
3270
  "alignItems": "center",
@@ -3294,11 +3294,11 @@ exports[`wonder-blocks-dropdown example 19 1`] = `
3294
3294
  <span
3295
3295
  className=""
3296
3296
  style={
3297
- Object {
3297
+ {
3298
3298
  "MozOsxFontSmoothing": "grayscale",
3299
3299
  "WebkitFontSmoothing": "antialiased",
3300
3300
  "display": "block",
3301
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
3301
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
3302
3302
  "fontSize": 16,
3303
3303
  "fontWeight": 400,
3304
3304
  "lineHeight": "20px",
@@ -3317,7 +3317,7 @@ exports[`wonder-blocks-dropdown example 19 1`] = `
3317
3317
  className=""
3318
3318
  height={16}
3319
3319
  style={
3320
- Object {
3320
+ {
3321
3321
  "display": "inline-block",
3322
3322
  "flexGrow": 0,
3323
3323
  "flexShrink": 0,
@@ -3342,7 +3342,7 @@ exports[`wonder-blocks-dropdown example 20 1`] = `
3342
3342
  <div
3343
3343
  className=""
3344
3344
  style={
3345
- Object {
3345
+ {
3346
3346
  "alignItems": "center",
3347
3347
  "borderStyle": "solid",
3348
3348
  "borderWidth": 0,
@@ -3376,11 +3376,11 @@ exports[`wonder-blocks-dropdown example 20 1`] = `
3376
3376
  onTouchStart={[Function]}
3377
3377
  role="button"
3378
3378
  style={
3379
- Object {
3380
- "::MozFocusInner": Object {
3379
+ {
3380
+ "::MozFocusInner": {
3381
3381
  "border": 0,
3382
3382
  },
3383
- ":focus": Object {
3383
+ ":focus": {
3384
3384
  "WebkitTapHighlightColor": "rgba(0,0,0,0)",
3385
3385
  },
3386
3386
  "alignItems": "center",
@@ -3411,12 +3411,12 @@ exports[`wonder-blocks-dropdown example 20 1`] = `
3411
3411
  <span
3412
3412
  className=""
3413
3413
  style={
3414
- Object {
3414
+ {
3415
3415
  "MozOsxFontSmoothing": "grayscale",
3416
3416
  "WebkitFontSmoothing": "antialiased",
3417
3417
  "alignItems": "center",
3418
3418
  "display": "inline-block",
3419
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
3419
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
3420
3420
  "fontSize": 16,
3421
3421
  "fontWeight": "bold",
3422
3422
  "lineHeight": "20px",
@@ -3437,7 +3437,7 @@ exports[`wonder-blocks-dropdown example 21 1`] = `
3437
3437
  <div
3438
3438
  className=""
3439
3439
  style={
3440
- Object {
3440
+ {
3441
3441
  "alignItems": "stretch",
3442
3442
  "borderStyle": "solid",
3443
3443
  "borderWidth": 0,
@@ -3458,7 +3458,7 @@ exports[`wonder-blocks-dropdown example 21 1`] = `
3458
3458
  onKeyDown={[Function]}
3459
3459
  onKeyUp={[Function]}
3460
3460
  style={
3461
- Object {
3461
+ {
3462
3462
  "alignItems": "stretch",
3463
3463
  "borderStyle": "solid",
3464
3464
  "borderWidth": 0,
@@ -3482,7 +3482,7 @@ exports[`wonder-blocks-dropdown example 21 1`] = `
3482
3482
  className=""
3483
3483
  data-test-id="dropdown-live-region"
3484
3484
  style={
3485
- Object {
3485
+ {
3486
3486
  "border": 0,
3487
3487
  "clip": "rect(0,0,0,0)",
3488
3488
  "height": 1,
@@ -3513,8 +3513,8 @@ exports[`wonder-blocks-dropdown example 21 1`] = `
3513
3513
  onTouchEnd={[Function]}
3514
3514
  onTouchStart={[Function]}
3515
3515
  style={
3516
- Object {
3517
- "::MozFocusInner": Object {
3516
+ {
3517
+ "::MozFocusInner": {
3518
3518
  "border": 0,
3519
3519
  },
3520
3520
  "alignItems": "center",
@@ -3545,11 +3545,11 @@ exports[`wonder-blocks-dropdown example 21 1`] = `
3545
3545
  <span
3546
3546
  className=""
3547
3547
  style={
3548
- Object {
3548
+ {
3549
3549
  "MozOsxFontSmoothing": "grayscale",
3550
3550
  "WebkitFontSmoothing": "antialiased",
3551
3551
  "display": "block",
3552
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
3552
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
3553
3553
  "fontSize": 16,
3554
3554
  "fontWeight": 400,
3555
3555
  "lineHeight": "20px",
@@ -3568,7 +3568,7 @@ exports[`wonder-blocks-dropdown example 21 1`] = `
3568
3568
  className=""
3569
3569
  height={16}
3570
3570
  style={
3571
- Object {
3571
+ {
3572
3572
  "display": "inline-block",
3573
3573
  "flexGrow": 0,
3574
3574
  "flexShrink": 0,
@@ -3593,7 +3593,7 @@ exports[`wonder-blocks-dropdown example 22 1`] = `
3593
3593
  <div
3594
3594
  className=""
3595
3595
  style={
3596
- Object {
3596
+ {
3597
3597
  "alignItems": "stretch",
3598
3598
  "borderStyle": "solid",
3599
3599
  "borderWidth": 0,
@@ -3614,11 +3614,11 @@ exports[`wonder-blocks-dropdown example 22 1`] = `
3614
3614
  htmlFor="unique-multi-select"
3615
3615
  id="label-for-multi-select"
3616
3616
  style={
3617
- Object {
3617
+ {
3618
3618
  "MozOsxFontSmoothing": "grayscale",
3619
3619
  "WebkitFontSmoothing": "antialiased",
3620
3620
  "display": "block",
3621
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
3621
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
3622
3622
  "fontSize": 16,
3623
3623
  "fontWeight": 700,
3624
3624
  "lineHeight": "20px",
@@ -3632,7 +3632,7 @@ exports[`wonder-blocks-dropdown example 22 1`] = `
3632
3632
  onKeyDown={[Function]}
3633
3633
  onKeyUp={[Function]}
3634
3634
  style={
3635
- Object {
3635
+ {
3636
3636
  "alignItems": "stretch",
3637
3637
  "borderStyle": "solid",
3638
3638
  "borderWidth": 0,
@@ -3656,7 +3656,7 @@ exports[`wonder-blocks-dropdown example 22 1`] = `
3656
3656
  className=""
3657
3657
  data-test-id="dropdown-live-region"
3658
3658
  style={
3659
- Object {
3659
+ {
3660
3660
  "border": 0,
3661
3661
  "clip": "rect(0,0,0,0)",
3662
3662
  "height": 1,
@@ -3689,8 +3689,8 @@ exports[`wonder-blocks-dropdown example 22 1`] = `
3689
3689
  onTouchEnd={[Function]}
3690
3690
  onTouchStart={[Function]}
3691
3691
  style={
3692
- Object {
3693
- "::MozFocusInner": Object {
3692
+ {
3693
+ "::MozFocusInner": {
3694
3694
  "border": 0,
3695
3695
  },
3696
3696
  "alignItems": "center",
@@ -3720,11 +3720,11 @@ exports[`wonder-blocks-dropdown example 22 1`] = `
3720
3720
  <span
3721
3721
  className=""
3722
3722
  style={
3723
- Object {
3723
+ {
3724
3724
  "MozOsxFontSmoothing": "grayscale",
3725
3725
  "WebkitFontSmoothing": "antialiased",
3726
3726
  "display": "block",
3727
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
3727
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
3728
3728
  "fontSize": 16,
3729
3729
  "fontWeight": 400,
3730
3730
  "lineHeight": "20px",
@@ -3743,7 +3743,7 @@ exports[`wonder-blocks-dropdown example 22 1`] = `
3743
3743
  className=""
3744
3744
  height={16}
3745
3745
  style={
3746
- Object {
3746
+ {
3747
3747
  "display": "inline-block",
3748
3748
  "flexGrow": 0,
3749
3749
  "flexShrink": 0,
@@ -3768,7 +3768,7 @@ exports[`wonder-blocks-dropdown example 23 1`] = `
3768
3768
  <div
3769
3769
  className=""
3770
3770
  style={
3771
- Object {
3771
+ {
3772
3772
  "alignItems": "stretch",
3773
3773
  "borderStyle": "solid",
3774
3774
  "borderWidth": 0,
@@ -3789,7 +3789,7 @@ exports[`wonder-blocks-dropdown example 23 1`] = `
3789
3789
  onKeyDown={[Function]}
3790
3790
  onKeyUp={[Function]}
3791
3791
  style={
3792
- Object {
3792
+ {
3793
3793
  "alignItems": "stretch",
3794
3794
  "borderStyle": "solid",
3795
3795
  "borderWidth": 0,
@@ -3813,7 +3813,7 @@ exports[`wonder-blocks-dropdown example 23 1`] = `
3813
3813
  className=""
3814
3814
  data-test-id="dropdown-live-region"
3815
3815
  style={
3816
- Object {
3816
+ {
3817
3817
  "border": 0,
3818
3818
  "clip": "rect(0,0,0,0)",
3819
3819
  "height": 1,
@@ -3844,8 +3844,8 @@ exports[`wonder-blocks-dropdown example 23 1`] = `
3844
3844
  onTouchEnd={[Function]}
3845
3845
  onTouchStart={[Function]}
3846
3846
  style={
3847
- Object {
3848
- "::MozFocusInner": Object {
3847
+ {
3848
+ "::MozFocusInner": {
3849
3849
  "border": 0,
3850
3850
  },
3851
3851
  "alignItems": "center",
@@ -3875,11 +3875,11 @@ exports[`wonder-blocks-dropdown example 23 1`] = `
3875
3875
  <span
3876
3876
  className=""
3877
3877
  style={
3878
- Object {
3878
+ {
3879
3879
  "MozOsxFontSmoothing": "grayscale",
3880
3880
  "WebkitFontSmoothing": "antialiased",
3881
3881
  "display": "block",
3882
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
3882
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
3883
3883
  "fontSize": 16,
3884
3884
  "fontWeight": 400,
3885
3885
  "lineHeight": "20px",
@@ -3898,7 +3898,7 @@ exports[`wonder-blocks-dropdown example 23 1`] = `
3898
3898
  className=""
3899
3899
  height={16}
3900
3900
  style={
3901
- Object {
3901
+ {
3902
3902
  "display": "inline-block",
3903
3903
  "flexGrow": 0,
3904
3904
  "flexShrink": 0,
@@ -3923,7 +3923,7 @@ exports[`wonder-blocks-dropdown example 24 1`] = `
3923
3923
  <div
3924
3924
  className=""
3925
3925
  style={
3926
- Object {
3926
+ {
3927
3927
  "alignItems": "stretch",
3928
3928
  "borderStyle": "solid",
3929
3929
  "borderWidth": 0,
@@ -3944,7 +3944,7 @@ exports[`wonder-blocks-dropdown example 24 1`] = `
3944
3944
  onKeyDown={[Function]}
3945
3945
  onKeyUp={[Function]}
3946
3946
  style={
3947
- Object {
3947
+ {
3948
3948
  "alignItems": "stretch",
3949
3949
  "borderStyle": "solid",
3950
3950
  "borderWidth": 0,
@@ -3968,7 +3968,7 @@ exports[`wonder-blocks-dropdown example 24 1`] = `
3968
3968
  className=""
3969
3969
  data-test-id="dropdown-live-region"
3970
3970
  style={
3971
- Object {
3971
+ {
3972
3972
  "border": 0,
3973
3973
  "clip": "rect(0,0,0,0)",
3974
3974
  "height": 1,
@@ -3999,8 +3999,8 @@ exports[`wonder-blocks-dropdown example 24 1`] = `
3999
3999
  onTouchEnd={[Function]}
4000
4000
  onTouchStart={[Function]}
4001
4001
  style={
4002
- Object {
4003
- "::MozFocusInner": Object {
4002
+ {
4003
+ "::MozFocusInner": {
4004
4004
  "border": 0,
4005
4005
  },
4006
4006
  "alignItems": "center",
@@ -4030,11 +4030,11 @@ exports[`wonder-blocks-dropdown example 24 1`] = `
4030
4030
  <span
4031
4031
  className=""
4032
4032
  style={
4033
- Object {
4033
+ {
4034
4034
  "MozOsxFontSmoothing": "grayscale",
4035
4035
  "WebkitFontSmoothing": "antialiased",
4036
4036
  "display": "block",
4037
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
4037
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
4038
4038
  "fontSize": 16,
4039
4039
  "fontWeight": 400,
4040
4040
  "lineHeight": "20px",
@@ -4053,7 +4053,7 @@ exports[`wonder-blocks-dropdown example 24 1`] = `
4053
4053
  className=""
4054
4054
  height={16}
4055
4055
  style={
4056
- Object {
4056
+ {
4057
4057
  "display": "inline-block",
4058
4058
  "flexGrow": 0,
4059
4059
  "flexShrink": 0,
@@ -4075,7 +4075,7 @@ exports[`wonder-blocks-dropdown example 24 1`] = `
4075
4075
  aria-hidden="true"
4076
4076
  className=""
4077
4077
  style={
4078
- Object {
4078
+ {
4079
4079
  "MsFlexBasis": 16,
4080
4080
  "MsFlexPreferredSize": 16,
4081
4081
  "WebkitFlexBasis": 16,
@@ -4115,11 +4115,11 @@ exports[`wonder-blocks-dropdown example 24 1`] = `
4115
4115
  onTouchStart={[Function]}
4116
4116
  role="button"
4117
4117
  style={
4118
- Object {
4119
- "::MozFocusInner": Object {
4118
+ {
4119
+ "::MozFocusInner": {
4120
4120
  "border": 0,
4121
4121
  },
4122
- ":focus": Object {
4122
+ ":focus": {
4123
4123
  "WebkitTapHighlightColor": "rgba(0,0,0,0)",
4124
4124
  },
4125
4125
  "alignItems": "center",
@@ -4150,12 +4150,12 @@ exports[`wonder-blocks-dropdown example 24 1`] = `
4150
4150
  <span
4151
4151
  className=""
4152
4152
  style={
4153
- Object {
4153
+ {
4154
4154
  "MozOsxFontSmoothing": "grayscale",
4155
4155
  "WebkitFontSmoothing": "antialiased",
4156
4156
  "alignItems": "center",
4157
4157
  "display": "inline-block",
4158
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
4158
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
4159
4159
  "fontSize": 16,
4160
4160
  "fontWeight": "bold",
4161
4161
  "lineHeight": "20px",
@@ -4176,7 +4176,7 @@ exports[`wonder-blocks-dropdown example 25 1`] = `
4176
4176
  <div
4177
4177
  className=""
4178
4178
  style={
4179
- Object {
4179
+ {
4180
4180
  "alignItems": "stretch",
4181
4181
  "borderStyle": "solid",
4182
4182
  "borderWidth": 0,
@@ -4197,7 +4197,7 @@ exports[`wonder-blocks-dropdown example 25 1`] = `
4197
4197
  onKeyDown={[Function]}
4198
4198
  onKeyUp={[Function]}
4199
4199
  style={
4200
- Object {
4200
+ {
4201
4201
  "alignItems": "stretch",
4202
4202
  "borderStyle": "solid",
4203
4203
  "borderWidth": 0,
@@ -4221,7 +4221,7 @@ exports[`wonder-blocks-dropdown example 25 1`] = `
4221
4221
  className=""
4222
4222
  data-test-id="dropdown-live-region"
4223
4223
  style={
4224
- Object {
4224
+ {
4225
4225
  "border": 0,
4226
4226
  "clip": "rect(0,0,0,0)",
4227
4227
  "height": 1,
@@ -4252,8 +4252,8 @@ exports[`wonder-blocks-dropdown example 25 1`] = `
4252
4252
  onTouchEnd={[Function]}
4253
4253
  onTouchStart={[Function]}
4254
4254
  style={
4255
- Object {
4256
- "::MozFocusInner": Object {
4255
+ {
4256
+ "::MozFocusInner": {
4257
4257
  "border": 0,
4258
4258
  },
4259
4259
  "alignItems": "center",
@@ -4283,11 +4283,11 @@ exports[`wonder-blocks-dropdown example 25 1`] = `
4283
4283
  <span
4284
4284
  className=""
4285
4285
  style={
4286
- Object {
4286
+ {
4287
4287
  "MozOsxFontSmoothing": "grayscale",
4288
4288
  "WebkitFontSmoothing": "antialiased",
4289
4289
  "display": "block",
4290
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
4290
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
4291
4291
  "fontSize": 16,
4292
4292
  "fontWeight": 400,
4293
4293
  "lineHeight": "20px",
@@ -4306,7 +4306,7 @@ exports[`wonder-blocks-dropdown example 25 1`] = `
4306
4306
  className=""
4307
4307
  height={16}
4308
4308
  style={
4309
- Object {
4309
+ {
4310
4310
  "display": "inline-block",
4311
4311
  "flexGrow": 0,
4312
4312
  "flexShrink": 0,
@@ -4333,7 +4333,7 @@ exports[`wonder-blocks-dropdown example 26 1`] = `
4333
4333
  onKeyDown={[Function]}
4334
4334
  onKeyUp={[Function]}
4335
4335
  style={
4336
- Object {
4336
+ {
4337
4337
  "alignItems": "stretch",
4338
4338
  "borderStyle": "solid",
4339
4339
  "borderWidth": 0,
@@ -4357,7 +4357,7 @@ exports[`wonder-blocks-dropdown example 26 1`] = `
4357
4357
  className=""
4358
4358
  data-test-id="dropdown-live-region"
4359
4359
  style={
4360
- Object {
4360
+ {
4361
4361
  "border": 0,
4362
4362
  "clip": "rect(0,0,0,0)",
4363
4363
  "height": 1,
@@ -4387,19 +4387,19 @@ exports[`wonder-blocks-dropdown example 26 1`] = `
4387
4387
  onTouchEnd={[Function]}
4388
4388
  onTouchStart={[Function]}
4389
4389
  style={
4390
- Object {
4391
- "@media (maxWidth: 1023px)": Object {
4390
+ {
4391
+ "@media (maxWidth: 1023px)": {
4392
4392
  "fontSize": 24,
4393
4393
  "lineHeight": "28px",
4394
4394
  },
4395
- "@media (minWidth: 1024px)": Object {
4395
+ "@media (minWidth: 1024px)": {
4396
4396
  "fontSize": 28,
4397
4397
  "lineHeight": "32px",
4398
4398
  },
4399
4399
  "MozOsxFontSmoothing": "grayscale",
4400
4400
  "WebkitFontSmoothing": "antialiased",
4401
4401
  "display": "block",
4402
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
4402
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
4403
4403
  "fontWeight": 700,
4404
4404
  "marginBottom": 0,
4405
4405
  "marginTop": 0,
@@ -4418,7 +4418,7 @@ exports[`wonder-blocks-dropdown example 27 1`] = `
4418
4418
  onKeyDown={[Function]}
4419
4419
  onKeyUp={[Function]}
4420
4420
  style={
4421
- Object {
4421
+ {
4422
4422
  "alignItems": "stretch",
4423
4423
  "borderStyle": "solid",
4424
4424
  "borderWidth": 0,
@@ -4442,7 +4442,7 @@ exports[`wonder-blocks-dropdown example 27 1`] = `
4442
4442
  className=""
4443
4443
  data-test-id="dropdown-live-region"
4444
4444
  style={
4445
- Object {
4445
+ {
4446
4446
  "border": 0,
4447
4447
  "clip": "rect(0,0,0,0)",
4448
4448
  "height": 1,
@@ -4473,8 +4473,8 @@ exports[`wonder-blocks-dropdown example 27 1`] = `
4473
4473
  onTouchEnd={[Function]}
4474
4474
  onTouchStart={[Function]}
4475
4475
  style={
4476
- Object {
4477
- "::MozFocusInner": Object {
4476
+ {
4477
+ "::MozFocusInner": {
4478
4478
  "border": 0,
4479
4479
  },
4480
4480
  "alignItems": "center",
@@ -4504,11 +4504,11 @@ exports[`wonder-blocks-dropdown example 27 1`] = `
4504
4504
  <span
4505
4505
  className=""
4506
4506
  style={
4507
- Object {
4507
+ {
4508
4508
  "MozOsxFontSmoothing": "grayscale",
4509
4509
  "WebkitFontSmoothing": "antialiased",
4510
4510
  "display": "block",
4511
- "fontFamily": "Lato, \\"Noto Sans\\", sans-serif",
4511
+ "fontFamily": "Lato, "Noto Sans", sans-serif",
4512
4512
  "fontSize": 16,
4513
4513
  "fontWeight": 400,
4514
4514
  "lineHeight": "20px",
@@ -4527,7 +4527,7 @@ exports[`wonder-blocks-dropdown example 27 1`] = `
4527
4527
  className=""
4528
4528
  height={16}
4529
4529
  style={
4530
- Object {
4530
+ {
4531
4531
  "display": "inline-block",
4532
4532
  "flexGrow": 0,
4533
4533
  "flexShrink": 0,