Skip to content

Commit af1cc73

Browse files
joshblackjoshblack
authored
fix(Spinner): update container to use span instead of div (#4692)
* fix(Spinner): update container to use span instead of div * test: update snapshots --------- Co-authored-by: Josh Black <[email protected]>
1 parent 48b43d8 commit af1cc73

File tree

4 files changed

+83
-83
lines changed

4 files changed

+83
-83
lines changed

‎packages/react/src/Spinner/Spinner.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ function Spinner({size: sizeKey = 'medium', srText = 'Loading', 'aria-label': ar
2929

3030
return (
3131
/* inline-flex removes the extra line height */
32-
<Box sx={{display: 'inline-flex'}}>
32+
<Box as="span" sx={{display: 'inline-flex'}}>
3333
<svg
3434
height={size}
3535
width={size}

‎packages/react/src/__tests__/__snapshots__/Autocomplete.test.tsx.snap

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -373,7 +373,7 @@ exports[`snapshots renders a loading state 1`] = `
373373
className="c1"
374374
display="flex"
375375
>
376-
<div
376+
<span
377377
className="c2"
378378
>
379379
<svg
@@ -408,7 +408,7 @@ exports[`snapshots renders a loading state 1`] = `
408408
>
409409
Loading
410410
</span>
411-
</div>
411+
</span>
412412
</div>
413413
</span>,
414414
]

‎packages/react/src/__tests__/__snapshots__/TextInput.test.tsx.snap

Lines changed: 40 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -4094,7 +4094,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
40944094
className="c3"
40954095
display="flex"
40964096
>
4097-
<div
4097+
<span
40984098
className="c4"
40994099
>
41004100
<svg
@@ -4134,7 +4134,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
41344134
>
41354135
Loading
41364136
</span>
4137-
</div>
4137+
</span>
41384138
</div>
41394139
</span>
41404140
</span>,
@@ -4308,7 +4308,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
43084308
className="c2"
43094309
display="flex"
43104310
>
4311-
<div
4311+
<span
43124312
className="c3"
43134313
>
43144314
<svg
@@ -4348,7 +4348,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
43484348
>
43494349
Loading
43504350
</span>
4351-
</div>
4351+
</span>
43524352
</div>
43534353
</span>
43544354
<input
@@ -4365,7 +4365,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
43654365
className="c2"
43664366
display="flex"
43674367
>
4368-
<div
4368+
<span
43694369
className="c3"
43704370
>
43714371
<svg
@@ -4405,7 +4405,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
44054405
>
44064406
Loading
44074407
</span>
4408-
</div>
4408+
</span>
44094409
</div>
44104410
</span>
44114411
</span>,
@@ -4580,7 +4580,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
45804580
className="c3"
45814581
display="flex"
45824582
>
4583-
<div
4583+
<span
45844584
className="c4"
45854585
>
45864586
<svg
@@ -4620,7 +4620,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
46204620
>
46214621
Loading
46224622
</span>
4623-
</div>
4623+
</span>
46244624
</div>
46254625
</span>
46264626
</span>,
@@ -4828,7 +4828,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
48284828
/>
48294829
</svg>
48304830
</div>
4831-
<div
4831+
<span
48324832
className="c4"
48334833
>
48344834
<svg
@@ -4873,7 +4873,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
48734873
>
48744874
Loading
48754875
</span>
4876-
</div>
4876+
</span>
48774877
</div>
48784878
</span>
48794879
<input
@@ -4890,7 +4890,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
48904890
className="c2"
48914891
display="flex"
48924892
>
4893-
<div
4893+
<span
48944894
className="c4"
48954895
>
48964896
<svg
@@ -4930,7 +4930,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
49304930
>
49314931
Loading
49324932
</span>
4933-
</div>
4933+
</span>
49344934
</div>
49354935
</span>
49364936
</span>,
@@ -5138,7 +5138,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
51385138
/>
51395139
</svg>
51405140
</div>
5141-
<div
5141+
<span
51425142
className="c4"
51435143
>
51445144
<svg
@@ -5183,7 +5183,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
51835183
>
51845184
Loading
51855185
</span>
5186-
</div>
5186+
</span>
51875187
</div>
51885188
</span>
51895189
<input
@@ -5200,7 +5200,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
52005200
className="c2"
52015201
display="flex"
52025202
>
5203-
<div
5203+
<span
52045204
className="c4"
52055205
>
52065206
<svg
@@ -5240,7 +5240,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
52405240
>
52415241
Loading
52425242
</span>
5243-
</div>
5243+
</span>
52445244
</div>
52455245
</span>
52465246
</span>,
@@ -5448,7 +5448,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
54485448
/>
54495449
</svg>
54505450
</div>
5451-
<div
5451+
<span
54525452
className="c4"
54535453
>
54545454
<svg
@@ -5493,7 +5493,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
54935493
>
54945494
Loading
54955495
</span>
5496-
</div>
5496+
</span>
54975497
</div>
54985498
</span>
54995499
<input
@@ -5510,7 +5510,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
55105510
className="c2"
55115511
display="flex"
55125512
>
5513-
<div
5513+
<span
55145514
className="c4"
55155515
>
55165516
<svg
@@ -5550,7 +5550,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
55505550
>
55515551
Loading
55525552
</span>
5553-
</div>
5553+
</span>
55545554
</div>
55555555
</span>
55565556
</span>,
@@ -5759,7 +5759,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
57595759
/>
57605760
</svg>
57615761
</div>
5762-
<div
5762+
<span
57635763
className="c5"
57645764
>
57655765
<svg
@@ -5804,7 +5804,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
58045804
>
58055805
Loading
58065806
</span>
5807-
</div>
5807+
</span>
58085808
</div>
58095809
</span>
58105810
</span>,
@@ -5987,7 +5987,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
59875987
className="c2"
59885988
display="flex"
59895989
>
5990-
<div
5990+
<span
59915991
className="c3"
59925992
>
59935993
<svg
@@ -6027,7 +6027,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
60276027
>
60286028
Loading
60296029
</span>
6030-
</div>
6030+
</span>
60316031
</div>
60326032
</span>
60336033
<input
@@ -6069,7 +6069,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
60696069
/>
60706070
</svg>
60716071
</div>
6072-
<div
6072+
<span
60736073
className="c3"
60746074
>
60756075
<svg
@@ -6114,7 +6114,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
61146114
>
61156115
Loading
61166116
</span>
6117-
</div>
6117+
</span>
61186118
</div>
61196119
</span>
61206120
</span>,
@@ -6323,7 +6323,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
63236323
/>
63246324
</svg>
63256325
</div>
6326-
<div
6326+
<span
63276327
className="c5"
63286328
>
63296329
<svg
@@ -6368,7 +6368,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
63686368
>
63696369
Loading
63706370
</span>
6371-
</div>
6371+
</span>
63726372
</div>
63736373
</span>
63746374
</span>,
@@ -6594,7 +6594,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
65946594
/>
65956595
</svg>
65966596
</div>
6597-
<div
6597+
<span
65986598
className="c4"
65996599
>
66006600
<svg
@@ -6639,7 +6639,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
66396639
>
66406640
Loading
66416641
</span>
6642-
</div>
6642+
</span>
66436643
</div>
66446644
</span>
66456645
<input
@@ -6681,7 +6681,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
66816681
/>
66826682
</svg>
66836683
</div>
6684-
<div
6684+
<span
66856685
className="c4"
66866686
>
66876687
<svg
@@ -6726,7 +6726,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
67266726
>
67276727
Loading
67286728
</span>
6729-
</div>
6729+
</span>
67306730
</div>
67316731
</span>
67326732
</span>,
@@ -6943,7 +6943,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
69436943
/>
69446944
</svg>
69456945
</div>
6946-
<div
6946+
<span
69476947
className="c4"
69486948
>
69496949
<svg
@@ -6988,7 +6988,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
69886988
>
69896989
Loading
69906990
</span>
6991-
</div>
6991+
</span>
69926992
</div>
69936993
</span>
69946994
<input
@@ -7030,7 +7030,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
70307030
/>
70317031
</svg>
70327032
</div>
7033-
<div
7033+
<span
70347034
className="c4"
70357035
>
70367036
<svg
@@ -7075,7 +7075,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
70757075
>
70767076
Loading
70777077
</span>
7078-
</div>
7078+
</span>
70797079
</div>
70807080
</span>
70817081
</span>,
@@ -7299,7 +7299,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
72997299
/>
73007300
</svg>
73017301
</div>
7302-
<div
7302+
<span
73037303
className="c4"
73047304
>
73057305
<svg
@@ -7344,7 +7344,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
73447344
>
73457345
Loading
73467346
</span>
7347-
</div>
7347+
</span>
73487348
</div>
73497349
</span>
73507350
<input
@@ -7386,7 +7386,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
73867386
/>
73877387
</svg>
73887388
</div>
7389-
<div
7389+
<span
73907390
className="c4"
73917391
>
73927392
<svg
@@ -7431,7 +7431,7 @@ exports[`TextInput renders with a loading indicator 1`] = `
74317431
>
74327432
Loading
74337433
</span>
7434-
</div>
7434+
</span>
74357435
</div>
74367436
</span>
74377437
</span>,

0 commit comments

Comments
 (0)