Skip to content

Commit 0ea1ef5

Browse files
ZeeshanTamboliZeeshanTamboli
authored
[Accordion] Fix invalid HTML inside heading (#44408)
1 parent 065fcda commit 0ea1ef5

23 files changed

+84
-60
lines changed

Diff for: ‎docs/data/material/components/accordion/AccordionExpandDefault.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export default function AccordionExpandDefault() {
1414
aria-controls="panel1-content"
1515
id="panel1-header"
1616
>
17-
<Typography>Expanded by default</Typography>
17+
<Typography component="span">Expanded by default</Typography>
1818
</AccordionSummary>
1919
<AccordionDetails>
2020
<Typography>
@@ -29,7 +29,7 @@ export default function AccordionExpandDefault() {
2929
aria-controls="panel2-content"
3030
id="panel2-header"
3131
>
32-
<Typography>Header</Typography>
32+
<Typography component="span">Header</Typography>
3333
</AccordionSummary>
3434
<AccordionDetails>
3535
<Typography>

Diff for: ‎docs/data/material/components/accordion/AccordionExpandDefault.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export default function AccordionExpandDefault() {
1414
aria-controls="panel1-content"
1515
id="panel1-header"
1616
>
17-
<Typography>Expanded by default</Typography>
17+
<Typography component="span">Expanded by default</Typography>
1818
</AccordionSummary>
1919
<AccordionDetails>
2020
<Typography>
@@ -29,7 +29,7 @@ export default function AccordionExpandDefault() {
2929
aria-controls="panel2-content"
3030
id="panel2-header"
3131
>
32-
<Typography>Header</Typography>
32+
<Typography component="span">Header</Typography>
3333
</AccordionSummary>
3434
<AccordionDetails>
3535
<Typography>

Diff for: ‎docs/data/material/components/accordion/AccordionExpandIcon.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ export default function AccordionExpandIcon() {
1515
aria-controls="panel1-content"
1616
id="panel1-header"
1717
>
18-
<Typography>Accordion 1</Typography>
18+
<Typography component="span">Accordion 1</Typography>
1919
</AccordionSummary>
2020
<AccordionDetails>
2121
<Typography>
@@ -30,7 +30,7 @@ export default function AccordionExpandIcon() {
3030
aria-controls="panel2-content"
3131
id="panel2-header"
3232
>
33-
<Typography>Accordion 2</Typography>
33+
<Typography component="span">Accordion 2</Typography>
3434
</AccordionSummary>
3535
<AccordionDetails>
3636
<Typography>

Diff for: ‎docs/data/material/components/accordion/AccordionExpandIcon.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ export default function AccordionExpandIcon() {
1515
aria-controls="panel1-content"
1616
id="panel1-header"
1717
>
18-
<Typography>Accordion 1</Typography>
18+
<Typography component="span">Accordion 1</Typography>
1919
</AccordionSummary>
2020
<AccordionDetails>
2121
<Typography>
@@ -30,7 +30,7 @@ export default function AccordionExpandIcon() {
3030
aria-controls="panel2-content"
3131
id="panel2-header"
3232
>
33-
<Typography>Accordion 2</Typography>
33+
<Typography component="span">Accordion 2</Typography>
3434
</AccordionSummary>
3535
<AccordionDetails>
3636
<Typography>

Diff for: ‎docs/data/material/components/accordion/AccordionTransition.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ export default function AccordionTransition() {
4747
aria-controls="panel1-content"
4848
id="panel1-header"
4949
>
50-
<Typography>Custom transition using Fade</Typography>
50+
<Typography component="span">Custom transition using Fade</Typography>
5151
</AccordionSummary>
5252
<AccordionDetails>
5353
<Typography>
@@ -62,7 +62,7 @@ export default function AccordionTransition() {
6262
aria-controls="panel2-content"
6363
id="panel2-header"
6464
>
65-
<Typography>Default transition using Collapse</Typography>
65+
<Typography component="span">Default transition using Collapse</Typography>
6666
</AccordionSummary>
6767
<AccordionDetails>
6868
<Typography>

Diff for: ‎docs/data/material/components/accordion/AccordionTransition.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ export default function AccordionTransition() {
5050
aria-controls="panel1-content"
5151
id="panel1-header"
5252
>
53-
<Typography>Custom transition using Fade</Typography>
53+
<Typography component="span">Custom transition using Fade</Typography>
5454
</AccordionSummary>
5555
<AccordionDetails>
5656
<Typography>
@@ -65,7 +65,7 @@ export default function AccordionTransition() {
6565
aria-controls="panel2-content"
6666
id="panel2-header"
6767
>
68-
<Typography>Default transition using Collapse</Typography>
68+
<Typography component="span">Default transition using Collapse</Typography>
6969
</AccordionSummary>
7070
<AccordionDetails>
7171
<Typography>

Diff for: ‎docs/data/material/components/accordion/AccordionUsage.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import Accordion from '@mui/material/Accordion';
33
import AccordionActions from '@mui/material/AccordionActions';
44
import AccordionSummary from '@mui/material/AccordionSummary';
55
import AccordionDetails from '@mui/material/AccordionDetails';
6+
import Typography from '@mui/material/Typography';
67
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
78
import Button from '@mui/material/Button';
89

@@ -15,7 +16,7 @@ export default function AccordionUsage() {
1516
aria-controls="panel1-content"
1617
id="panel1-header"
1718
>
18-
Accordion 1
19+
<Typography component="span">Accordion 1</Typography>
1920
</AccordionSummary>
2021
<AccordionDetails>
2122
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
@@ -28,7 +29,7 @@ export default function AccordionUsage() {
2829
aria-controls="panel2-content"
2930
id="panel2-header"
3031
>
31-
Accordion 2
32+
<Typography component="span">Accordion 2</Typography>
3233
</AccordionSummary>
3334
<AccordionDetails>
3435
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
@@ -41,7 +42,7 @@ export default function AccordionUsage() {
4142
aria-controls="panel3-content"
4243
id="panel3-header"
4344
>
44-
Accordion Actions
45+
<Typography component="span">Accordion Actions</Typography>
4546
</AccordionSummary>
4647
<AccordionDetails>
4748
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse

Diff for: ‎docs/data/material/components/accordion/AccordionUsage.tsx

+4-3
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import Accordion from '@mui/material/Accordion';
33
import AccordionActions from '@mui/material/AccordionActions';
44
import AccordionSummary from '@mui/material/AccordionSummary';
55
import AccordionDetails from '@mui/material/AccordionDetails';
6+
import Typography from '@mui/material/Typography';
67
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
78
import Button from '@mui/material/Button';
89

@@ -15,7 +16,7 @@ export default function AccordionUsage() {
1516
aria-controls="panel1-content"
1617
id="panel1-header"
1718
>
18-
Accordion 1
19+
<Typography component="span">Accordion 1</Typography>
1920
</AccordionSummary>
2021
<AccordionDetails>
2122
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
@@ -28,7 +29,7 @@ export default function AccordionUsage() {
2829
aria-controls="panel2-content"
2930
id="panel2-header"
3031
>
31-
Accordion 2
32+
<Typography component="span">Accordion 2</Typography>
3233
</AccordionSummary>
3334
<AccordionDetails>
3435
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
@@ -41,7 +42,7 @@ export default function AccordionUsage() {
4142
aria-controls="panel3-content"
4243
id="panel3-header"
4344
>
44-
Accordion Actions
45+
<Typography component="span">Accordion Actions</Typography>
4546
</AccordionSummary>
4647
<AccordionDetails>
4748
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse

Diff for: ‎docs/data/material/components/accordion/ControlledAccordions.js

+13-7
Original file line numberDiff line numberDiff line change
@@ -20,10 +20,12 @@ export default function ControlledAccordions() {
2020
aria-controls="panel1bh-content"
2121
id="panel1bh-header"
2222
>
23-
<Typography sx={{ width: '33%', flexShrink: 0 }}>
23+
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
2424
General settings
2525
</Typography>
26-
<Typography sx={{ color: 'text.secondary' }}>I am an accordion</Typography>
26+
<Typography component="span" sx={{ color: 'text.secondary' }}>
27+
I am an accordion
28+
</Typography>
2729
</AccordionSummary>
2830
<AccordionDetails>
2931
<Typography>
@@ -38,8 +40,10 @@ export default function ControlledAccordions() {
3840
aria-controls="panel2bh-content"
3941
id="panel2bh-header"
4042
>
41-
<Typography sx={{ width: '33%', flexShrink: 0 }}>Users</Typography>
42-
<Typography sx={{ color: 'text.secondary' }}>
43+
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
44+
Users
45+
</Typography>
46+
<Typography component="span" sx={{ color: 'text.secondary' }}>
4347
You are currently not an owner
4448
</Typography>
4549
</AccordionSummary>
@@ -57,10 +61,10 @@ export default function ControlledAccordions() {
5761
aria-controls="panel3bh-content"
5862
id="panel3bh-header"
5963
>
60-
<Typography sx={{ width: '33%', flexShrink: 0 }}>
64+
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
6165
Advanced settings
6266
</Typography>
63-
<Typography sx={{ color: 'text.secondary' }}>
67+
<Typography component="span" sx={{ color: 'text.secondary' }}>
6468
Filtering has been entirely disabled for whole web server
6569
</Typography>
6670
</AccordionSummary>
@@ -77,7 +81,9 @@ export default function ControlledAccordions() {
7781
aria-controls="panel4bh-content"
7882
id="panel4bh-header"
7983
>
80-
<Typography sx={{ width: '33%', flexShrink: 0 }}>Personal data</Typography>
84+
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
85+
Personal data
86+
</Typography>
8187
</AccordionSummary>
8288
<AccordionDetails>
8389
<Typography>

Diff for: ‎docs/data/material/components/accordion/ControlledAccordions.tsx

+13-7
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,12 @@ export default function ControlledAccordions() {
2121
aria-controls="panel1bh-content"
2222
id="panel1bh-header"
2323
>
24-
<Typography sx={{ width: '33%', flexShrink: 0 }}>
24+
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
2525
General settings
2626
</Typography>
27-
<Typography sx={{ color: 'text.secondary' }}>I am an accordion</Typography>
27+
<Typography component="span" sx={{ color: 'text.secondary' }}>
28+
I am an accordion
29+
</Typography>
2830
</AccordionSummary>
2931
<AccordionDetails>
3032
<Typography>
@@ -39,8 +41,10 @@ export default function ControlledAccordions() {
3941
aria-controls="panel2bh-content"
4042
id="panel2bh-header"
4143
>
42-
<Typography sx={{ width: '33%', flexShrink: 0 }}>Users</Typography>
43-
<Typography sx={{ color: 'text.secondary' }}>
44+
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
45+
Users
46+
</Typography>
47+
<Typography component="span" sx={{ color: 'text.secondary' }}>
4448
You are currently not an owner
4549
</Typography>
4650
</AccordionSummary>
@@ -58,10 +62,10 @@ export default function ControlledAccordions() {
5862
aria-controls="panel3bh-content"
5963
id="panel3bh-header"
6064
>
61-
<Typography sx={{ width: '33%', flexShrink: 0 }}>
65+
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
6266
Advanced settings
6367
</Typography>
64-
<Typography sx={{ color: 'text.secondary' }}>
68+
<Typography component="span" sx={{ color: 'text.secondary' }}>
6569
Filtering has been entirely disabled for whole web server
6670
</Typography>
6771
</AccordionSummary>
@@ -78,7 +82,9 @@ export default function ControlledAccordions() {
7882
aria-controls="panel4bh-content"
7983
id="panel4bh-header"
8084
>
81-
<Typography sx={{ width: '33%', flexShrink: 0 }}>Personal data</Typography>
85+
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
86+
Personal data
87+
</Typography>
8288
</AccordionSummary>
8389
<AccordionDetails>
8490
<Typography>

Diff for: ‎docs/data/material/components/accordion/CustomizedAccordions.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export default function CustomizedAccordions() {
5656
<div>
5757
<Accordion expanded={expanded === 'panel1'} onChange={handleChange('panel1')}>
5858
<AccordionSummary aria-controls="panel1d-content" id="panel1d-header">
59-
<Typography>Collapsible Group Item #1</Typography>
59+
<Typography component="span">Collapsible Group Item #1</Typography>
6060
</AccordionSummary>
6161
<AccordionDetails>
6262
<Typography>
@@ -69,7 +69,7 @@ export default function CustomizedAccordions() {
6969
</Accordion>
7070
<Accordion expanded={expanded === 'panel2'} onChange={handleChange('panel2')}>
7171
<AccordionSummary aria-controls="panel2d-content" id="panel2d-header">
72-
<Typography>Collapsible Group Item #2</Typography>
72+
<Typography component="span">Collapsible Group Item #2</Typography>
7373
</AccordionSummary>
7474
<AccordionDetails>
7575
<Typography>
@@ -82,7 +82,7 @@ export default function CustomizedAccordions() {
8282
</Accordion>
8383
<Accordion expanded={expanded === 'panel3'} onChange={handleChange('panel3')}>
8484
<AccordionSummary aria-controls="panel3d-content" id="panel3d-header">
85-
<Typography>Collapsible Group Item #3</Typography>
85+
<Typography component="span">Collapsible Group Item #3</Typography>
8686
</AccordionSummary>
8787
<AccordionDetails>
8888
<Typography>

Diff for: ‎docs/data/material/components/accordion/CustomizedAccordions.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ export default function CustomizedAccordions() {
5858
<div>
5959
<Accordion expanded={expanded === 'panel1'} onChange={handleChange('panel1')}>
6060
<AccordionSummary aria-controls="panel1d-content" id="panel1d-header">
61-
<Typography>Collapsible Group Item #1</Typography>
61+
<Typography component="span">Collapsible Group Item #1</Typography>
6262
</AccordionSummary>
6363
<AccordionDetails>
6464
<Typography>
@@ -71,7 +71,7 @@ export default function CustomizedAccordions() {
7171
</Accordion>
7272
<Accordion expanded={expanded === 'panel2'} onChange={handleChange('panel2')}>
7373
<AccordionSummary aria-controls="panel2d-content" id="panel2d-header">
74-
<Typography>Collapsible Group Item #2</Typography>
74+
<Typography component="span">Collapsible Group Item #2</Typography>
7575
</AccordionSummary>
7676
<AccordionDetails>
7777
<Typography>
@@ -84,7 +84,7 @@ export default function CustomizedAccordions() {
8484
</Accordion>
8585
<Accordion expanded={expanded === 'panel3'} onChange={handleChange('panel3')}>
8686
<AccordionSummary aria-controls="panel3d-content" id="panel3d-header">
87-
<Typography>Collapsible Group Item #3</Typography>
87+
<Typography component="span">Collapsible Group Item #3</Typography>
8888
</AccordionSummary>
8989
<AccordionDetails>
9090
<Typography>

Diff for: ‎docs/data/material/components/accordion/DisabledAccordion.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export default function DisabledAccordion() {
1414
aria-controls="panel1-content"
1515
id="panel1-header"
1616
>
17-
<Typography>Accordion 1</Typography>
17+
<Typography component="span">Accordion 1</Typography>
1818
</AccordionSummary>
1919
<AccordionDetails>
2020
<Typography>
@@ -29,7 +29,7 @@ export default function DisabledAccordion() {
2929
aria-controls="panel2-content"
3030
id="panel2-header"
3131
>
32-
<Typography>Accordion 2</Typography>
32+
<Typography component="span">Accordion 2</Typography>
3333
</AccordionSummary>
3434
<AccordionDetails>
3535
<Typography>
@@ -44,7 +44,7 @@ export default function DisabledAccordion() {
4444
aria-controls="panel3-content"
4545
id="panel3-header"
4646
>
47-
<Typography>Disabled Accordion</Typography>
47+
<Typography component="span">Disabled Accordion</Typography>
4848
</AccordionSummary>
4949
</Accordion>
5050
</div>

Diff for: ‎docs/data/material/components/accordion/DisabledAccordion.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export default function DisabledAccordion() {
1414
aria-controls="panel1-content"
1515
id="panel1-header"
1616
>
17-
<Typography>Accordion 1</Typography>
17+
<Typography component="span">Accordion 1</Typography>
1818
</AccordionSummary>
1919
<AccordionDetails>
2020
<Typography>
@@ -29,7 +29,7 @@ export default function DisabledAccordion() {
2929
aria-controls="panel2-content"
3030
id="panel2-header"
3131
>
32-
<Typography>Accordion 2</Typography>
32+
<Typography component="span">Accordion 2</Typography>
3333
</AccordionSummary>
3434
<AccordionDetails>
3535
<Typography>
@@ -44,7 +44,7 @@ export default function DisabledAccordion() {
4444
aria-controls="panel3-content"
4545
id="panel3-header"
4646
>
47-
<Typography>Disabled Accordion</Typography>
47+
<Typography component="span">Disabled Accordion</Typography>
4848
</AccordionSummary>
4949
</Accordion>
5050
</div>

Diff for: ‎docs/data/material/components/masonry/MasonryWithVariableHeightItems.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export default function MasonryWithVariableHeightItems() {
2727
<Paper key={index}>
2828
<StyledAccordion sx={{ minHeight: height }}>
2929
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
30-
<Typography>Accordion {index + 1}</Typography>
30+
<Typography component="span">Accordion {index + 1}</Typography>
3131
</AccordionSummary>
3232
<AccordionDetails>Contents</AccordionDetails>
3333
</StyledAccordion>

0 commit comments

Comments
 (0)