Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Accordion] Fix invalid HTML inside heading #44408

Merged
merged 48 commits into from
Dec 21, 2024
Merged

[Accordion] Fix invalid HTML inside heading #44408

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
48 commits
Select commit Hold shift + click to select a range
ee90b72
trial
ZeeshanTamboli Nov 14, 2024
9df6779
changes
ZeeshanTamboli Nov 14, 2024
97d3b37
docs tyepscript formatted
ZeeshanTamboli Nov 14, 2024
bff63ee
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Nov 14, 2024
f6387f4
customize
ZeeshanTamboli Nov 14, 2024
4a7c7fa
fix controlled accordion demo
ZeeshanTamboli Nov 14, 2024
b4b165c
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Nov 14, 2024
a68568a
bring back Accordion Summary
ZeeshanTamboli Nov 15, 2024
5a7e56e
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Nov 15, 2024
66cf6ca
style changes
ZeeshanTamboli Nov 15, 2024
8c76abc
reset font styles on button
ZeeshanTamboli Nov 15, 2024
fb00780
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Nov 15, 2024
e1e207f
fix demo
ZeeshanTamboli Nov 15, 2024
e576865
fix argos
ZeeshanTamboli Nov 15, 2024
9049a8d
fix test
ZeeshanTamboli Nov 15, 2024
cc03c92
pnpm docs:api
ZeeshanTamboli Nov 15, 2024
685c2ce
remove justify-content
ZeeshanTamboli Nov 15, 2024
ea6bfcb
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Nov 15, 2024
46e1449
pnpm docs:typescript:formatted
ZeeshanTamboli Nov 15, 2024
bd6f8a9
revert demo
ZeeshanTamboli Nov 15, 2024
fb9aa57
pnpm docs:typescript:formatted
ZeeshanTamboli Nov 15, 2024
4194b94
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Nov 15, 2024
037e702
try out body1 variant of typography
ZeeshanTamboli Nov 15, 2024
7de70cc
remove styling in controlled accordion demo
ZeeshanTamboli Nov 15, 2024
6f736ce
docs
ZeeshanTamboli Nov 15, 2024
dedd690
remove typography
ZeeshanTamboli Nov 16, 2024
4b25e56
pnpm dedupe
ZeeshanTamboli Nov 16, 2024
609acea
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Nov 16, 2024
07dbe5b
Merge branch 'issue-44153-accordion' of /~https://github.com/ZeeshanTam…
ZeeshanTamboli Nov 16, 2024
6c74c9b
pnpm dedupe
ZeeshanTamboli Nov 16, 2024
f27597d
pnpm docs:typescript:formatted
ZeeshanTamboli Nov 18, 2024
eeefc32
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Nov 18, 2024
e137dcb
remove typography from masonry demo
ZeeshanTamboli Nov 18, 2024
6157d71
resolve conflicts
ZeeshanTamboli Nov 19, 2024
6996b27
updated pnpm
ZeeshanTamboli Nov 19, 2024
0fd2515
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Dec 4, 2024
f95eecc
rename component to SummaryText
ZeeshanTamboli Dec 4, 2024
034f2e7
Add text-align start to accordion summary content
ZeeshanTamboli Dec 5, 2024
845afda
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Dec 5, 2024
f32ee2d
Simplify controlled accordion demo
ZeeshanTamboli Dec 5, 2024
b19cecf
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Dec 19, 2024
9744f91
update demos
ZeeshanTamboli Dec 19, 2024
db65312
Fix invalid HTML in marketing page template
ZeeshanTamboli Dec 19, 2024
9bb3da5
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Dec 20, 2024
499730f
add Typography to AccordionUsage demo
ZeeshanTamboli Dec 20, 2024
c531614
explain the changes in the migration guide
ZeeshanTamboli Dec 20, 2024
f52ccaf
update migration doc
ZeeshanTamboli Dec 20, 2024
4962eb8
Merge branch 'master' into issue-44153-accordion
ZeeshanTamboli Dec 20, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions docs/data/material/components/accordion/AccordionExpandDefault.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export default function AccordionExpandDefault() {
aria-controls="panel1-content"
id="panel1-header"
>
<Typography>Expanded by default</Typography>
<Typography component="span">Expanded by default</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -29,7 +29,7 @@ export default function AccordionExpandDefault() {
aria-controls="panel2-content"
id="panel2-header"
>
<Typography>Header</Typography>
<Typography component="span">Header</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand Down
4 changes: 2 additions & 2 deletions docs/data/material/components/accordion/AccordionExpandDefault.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export default function AccordionExpandDefault() {
aria-controls="panel1-content"
id="panel1-header"
>
<Typography>Expanded by default</Typography>
<Typography component="span">Expanded by default</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -29,7 +29,7 @@ export default function AccordionExpandDefault() {
aria-controls="panel2-content"
id="panel2-header"
>
<Typography>Header</Typography>
<Typography component="span">Header</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand Down
4 changes: 2 additions & 2 deletions docs/data/material/components/accordion/AccordionExpandIcon.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export default function AccordionExpandIcon() {
aria-controls="panel1-content"
id="panel1-header"
>
<Typography>Accordion 1</Typography>
<Typography component="span">Accordion 1</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -30,7 +30,7 @@ export default function AccordionExpandIcon() {
aria-controls="panel2-content"
id="panel2-header"
>
<Typography>Accordion 2</Typography>
<Typography component="span">Accordion 2</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand Down
4 changes: 2 additions & 2 deletions docs/data/material/components/accordion/AccordionExpandIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export default function AccordionExpandIcon() {
aria-controls="panel1-content"
id="panel1-header"
>
<Typography>Accordion 1</Typography>
<Typography component="span">Accordion 1</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -30,7 +30,7 @@ export default function AccordionExpandIcon() {
aria-controls="panel2-content"
id="panel2-header"
>
<Typography>Accordion 2</Typography>
<Typography component="span">Accordion 2</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand Down
4 changes: 2 additions & 2 deletions docs/data/material/components/accordion/AccordionTransition.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ export default function AccordionTransition() {
aria-controls="panel1-content"
id="panel1-header"
>
<Typography>Custom transition using Fade</Typography>
<Typography component="span">Custom transition using Fade</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -62,7 +62,7 @@ export default function AccordionTransition() {
aria-controls="panel2-content"
id="panel2-header"
>
<Typography>Default transition using Collapse</Typography>
<Typography component="span">Default transition using Collapse</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand Down
4 changes: 2 additions & 2 deletions docs/data/material/components/accordion/AccordionTransition.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ export default function AccordionTransition() {
aria-controls="panel1-content"
id="panel1-header"
>
<Typography>Custom transition using Fade</Typography>
<Typography component="span">Custom transition using Fade</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -65,7 +65,7 @@ export default function AccordionTransition() {
aria-controls="panel2-content"
id="panel2-header"
>
<Typography>Default transition using Collapse</Typography>
<Typography component="span">Default transition using Collapse</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand Down
7 changes: 4 additions & 3 deletions docs/data/material/components/accordion/AccordionUsage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import Accordion from '@mui/material/Accordion';
import AccordionActions from '@mui/material/AccordionActions';
import AccordionSummary from '@mui/material/AccordionSummary';
import AccordionDetails from '@mui/material/AccordionDetails';
import Typography from '@mui/material/Typography';
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
import Button from '@mui/material/Button';

Expand All @@ -15,7 +16,7 @@ export default function AccordionUsage() {
aria-controls="panel1-content"
id="panel1-header"
>
Accordion 1
<Typography component="span">Accordion 1</Typography>
</AccordionSummary>
<AccordionDetails>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
Expand All @@ -28,7 +29,7 @@ export default function AccordionUsage() {
aria-controls="panel2-content"
id="panel2-header"
>
Accordion 2
<Typography component="span">Accordion 2</Typography>
</AccordionSummary>
<AccordionDetails>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
Expand All @@ -41,7 +42,7 @@ export default function AccordionUsage() {
aria-controls="panel3-content"
id="panel3-header"
>
Accordion Actions
<Typography component="span">Accordion Actions</Typography>
</AccordionSummary>
<AccordionDetails>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
Expand Down
7 changes: 4 additions & 3 deletions docs/data/material/components/accordion/AccordionUsage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import Accordion from '@mui/material/Accordion';
import AccordionActions from '@mui/material/AccordionActions';
import AccordionSummary from '@mui/material/AccordionSummary';
import AccordionDetails from '@mui/material/AccordionDetails';
import Typography from '@mui/material/Typography';
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
import Button from '@mui/material/Button';

Expand All @@ -15,7 +16,7 @@ export default function AccordionUsage() {
aria-controls="panel1-content"
id="panel1-header"
>
Accordion 1
<Typography component="span">Accordion 1</Typography>
</AccordionSummary>
<AccordionDetails>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
Expand All @@ -28,7 +29,7 @@ export default function AccordionUsage() {
aria-controls="panel2-content"
id="panel2-header"
>
Accordion 2
<Typography component="span">Accordion 2</Typography>
</AccordionSummary>
<AccordionDetails>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
Expand All @@ -41,7 +42,7 @@ export default function AccordionUsage() {
aria-controls="panel3-content"
id="panel3-header"
>
Accordion Actions
<Typography component="span">Accordion Actions</Typography>
</AccordionSummary>
<AccordionDetails>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
Expand Down
20 changes: 13 additions & 7 deletions docs/data/material/components/accordion/ControlledAccordions.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,10 +20,12 @@ export default function ControlledAccordions() {
aria-controls="panel1bh-content"
id="panel1bh-header"
>
<Typography sx={{ width: '33%', flexShrink: 0 }}>
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
General settings
</Typography>
<Typography sx={{ color: 'text.secondary' }}>I am an accordion</Typography>
<Typography component="span" sx={{ color: 'text.secondary' }}>
I am an accordion
</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -38,8 +40,10 @@ export default function ControlledAccordions() {
aria-controls="panel2bh-content"
id="panel2bh-header"
>
<Typography sx={{ width: '33%', flexShrink: 0 }}>Users</Typography>
<Typography sx={{ color: 'text.secondary' }}>
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
Users
</Typography>
<Typography component="span" sx={{ color: 'text.secondary' }}>
You are currently not an owner
</Typography>
</AccordionSummary>
Expand All @@ -57,10 +61,10 @@ export default function ControlledAccordions() {
aria-controls="panel3bh-content"
id="panel3bh-header"
>
<Typography sx={{ width: '33%', flexShrink: 0 }}>
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
Advanced settings
</Typography>
<Typography sx={{ color: 'text.secondary' }}>
<Typography component="span" sx={{ color: 'text.secondary' }}>
Filtering has been entirely disabled for whole web server
</Typography>
</AccordionSummary>
Expand All @@ -77,7 +81,9 @@ export default function ControlledAccordions() {
aria-controls="panel4bh-content"
id="panel4bh-header"
>
<Typography sx={{ width: '33%', flexShrink: 0 }}>Personal data</Typography>
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
Personal data
</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand Down
20 changes: 13 additions & 7 deletions docs/data/material/components/accordion/ControlledAccordions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,10 +21,12 @@ export default function ControlledAccordions() {
aria-controls="panel1bh-content"
id="panel1bh-header"
>
<Typography sx={{ width: '33%', flexShrink: 0 }}>
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
General settings
</Typography>
<Typography sx={{ color: 'text.secondary' }}>I am an accordion</Typography>
<Typography component="span" sx={{ color: 'text.secondary' }}>
I am an accordion
</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -39,8 +41,10 @@ export default function ControlledAccordions() {
aria-controls="panel2bh-content"
id="panel2bh-header"
>
<Typography sx={{ width: '33%', flexShrink: 0 }}>Users</Typography>
<Typography sx={{ color: 'text.secondary' }}>
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
Users
</Typography>
<Typography component="span" sx={{ color: 'text.secondary' }}>
You are currently not an owner
</Typography>
</AccordionSummary>
Expand All @@ -58,10 +62,10 @@ export default function ControlledAccordions() {
aria-controls="panel3bh-content"
id="panel3bh-header"
>
<Typography sx={{ width: '33%', flexShrink: 0 }}>
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
Advanced settings
</Typography>
<Typography sx={{ color: 'text.secondary' }}>
<Typography component="span" sx={{ color: 'text.secondary' }}>
Filtering has been entirely disabled for whole web server
</Typography>
</AccordionSummary>
Expand All @@ -78,7 +82,9 @@ export default function ControlledAccordions() {
aria-controls="panel4bh-content"
id="panel4bh-header"
>
<Typography sx={{ width: '33%', flexShrink: 0 }}>Personal data</Typography>
<Typography component="span" sx={{ width: '33%', flexShrink: 0 }}>
Personal data
</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand Down
6 changes: 3 additions & 3 deletions docs/data/material/components/accordion/CustomizedAccordions.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ export default function CustomizedAccordions() {
<div>
<Accordion expanded={expanded === 'panel1'} onChange={handleChange('panel1')}>
<AccordionSummary aria-controls="panel1d-content" id="panel1d-header">
<Typography>Collapsible Group Item #1</Typography>
<Typography component="span">Collapsible Group Item #1</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -69,7 +69,7 @@ export default function CustomizedAccordions() {
</Accordion>
<Accordion expanded={expanded === 'panel2'} onChange={handleChange('panel2')}>
<AccordionSummary aria-controls="panel2d-content" id="panel2d-header">
<Typography>Collapsible Group Item #2</Typography>
<Typography component="span">Collapsible Group Item #2</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -82,7 +82,7 @@ export default function CustomizedAccordions() {
</Accordion>
<Accordion expanded={expanded === 'panel3'} onChange={handleChange('panel3')}>
<AccordionSummary aria-controls="panel3d-content" id="panel3d-header">
<Typography>Collapsible Group Item #3</Typography>
<Typography component="span">Collapsible Group Item #3</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand Down
6 changes: 3 additions & 3 deletions docs/data/material/components/accordion/CustomizedAccordions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ export default function CustomizedAccordions() {
<div>
<Accordion expanded={expanded === 'panel1'} onChange={handleChange('panel1')}>
<AccordionSummary aria-controls="panel1d-content" id="panel1d-header">
<Typography>Collapsible Group Item #1</Typography>
<Typography component="span">Collapsible Group Item #1</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -71,7 +71,7 @@ export default function CustomizedAccordions() {
</Accordion>
<Accordion expanded={expanded === 'panel2'} onChange={handleChange('panel2')}>
<AccordionSummary aria-controls="panel2d-content" id="panel2d-header">
<Typography>Collapsible Group Item #2</Typography>
<Typography component="span">Collapsible Group Item #2</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -84,7 +84,7 @@ export default function CustomizedAccordions() {
</Accordion>
<Accordion expanded={expanded === 'panel3'} onChange={handleChange('panel3')}>
<AccordionSummary aria-controls="panel3d-content" id="panel3d-header">
<Typography>Collapsible Group Item #3</Typography>
<Typography component="span">Collapsible Group Item #3</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand Down
6 changes: 3 additions & 3 deletions docs/data/material/components/accordion/DisabledAccordion.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export default function DisabledAccordion() {
aria-controls="panel1-content"
id="panel1-header"
>
<Typography>Accordion 1</Typography>
<Typography component="span">Accordion 1</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -29,7 +29,7 @@ export default function DisabledAccordion() {
aria-controls="panel2-content"
id="panel2-header"
>
<Typography>Accordion 2</Typography>
<Typography component="span">Accordion 2</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -44,7 +44,7 @@ export default function DisabledAccordion() {
aria-controls="panel3-content"
id="panel3-header"
>
<Typography>Disabled Accordion</Typography>
<Typography component="span">Disabled Accordion</Typography>
</AccordionSummary>
</Accordion>
</div>
Expand Down
6 changes: 3 additions & 3 deletions docs/data/material/components/accordion/DisabledAccordion.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export default function DisabledAccordion() {
aria-controls="panel1-content"
id="panel1-header"
>
<Typography>Accordion 1</Typography>
<Typography component="span">Accordion 1</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -29,7 +29,7 @@ export default function DisabledAccordion() {
aria-controls="panel2-content"
id="panel2-header"
>
<Typography>Accordion 2</Typography>
<Typography component="span">Accordion 2</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
Expand All @@ -44,7 +44,7 @@ export default function DisabledAccordion() {
aria-controls="panel3-content"
id="panel3-header"
>
<Typography>Disabled Accordion</Typography>
<Typography component="span">Disabled Accordion</Typography>
</AccordionSummary>
</Accordion>
</div>
Expand Down
2 changes: 1 addition & 1 deletion docs/data/material/components/masonry/MasonryWithVariableHeightItems.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ export default function MasonryWithVariableHeightItems() {
<Paper key={index}>
<StyledAccordion sx={{ minHeight: height }}>
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
<Typography>Accordion {index + 1}</Typography>
<Typography component="span">Accordion {index + 1}</Typography>
</AccordionSummary>
<AccordionDetails>Contents</AccordionDetails>
</StyledAccordion>
Expand Down
Loading
Loading