ExpansionPanels: Blazor expansion panels component

Examples

Accordion

By default the panels share a group, so opening one closes the others; IsExpanded opens one up front.

Can I change my plan later?

Yes. Upgrades apply at once; downgrades take effect on your next billing date.

Where is my data stored?

In EU data centres, with daily backups kept for 30 days.

Can I get a refund?

Of course. Cancel within 14 days and we refund the full amount.

website/Examples/Layout/ExpansionPanelsAccordionExample.razor Source

Multiple open

MultiExpansion lets several panels stay open; Icon adds a leading symbol.

Plan

Pro, 12 seats at 29 € each. Seats you add mid-month are prorated.

Payment

Card, bank transfer or SEPA direct debit.

Privacy

We keep your data only for as long as your account is open.

website/Examples/Layout/ExpansionPanelsMultiExample.razor Source

Custom title

TitleContent replaces the plain Text title with any markup.

Billing revamp Q4

12 open tasks, assigned across the team.

Mobile app Q1

10 open tasks, assigned across the team.

SSO for Enterprise Q2

11 open tasks, assigned across the team.

website/Examples/Layout/ExpansionPanelsTitleContentExample.razor Source

API

<ExpansionPanels>

DaisyBlazor

Parameters

Dense bool
= false
Makes every child panel dense (tighter title and content padding).
Elevation int
= 1
Shadow depth of each panel, on Paper's scale: 0 none, 1 shadow-sm, 2-3 shadow, up to 6 shadow-md, up to 12 shadow-lg, above that shadow-xl.
MultiExpansion bool
= false
Allows several panels open at once; when false (default) panels form a single-open accordion.
Class string
= null
Extra CSS classes merged onto the root element.
Style string
= null
Inline CSS styles applied to the root element.

Name	Type	Default	Description
Dense	bool	false	Makes every child panel dense (tighter title and content padding).
Elevation	int	1	Shadow depth of each panel, on Paper's scale: 0 none, 1 shadow-sm, 2-3 shadow, up to 6 shadow-md, up to 12 shadow-lg, above that shadow-xl.
MultiExpansion	bool	false	Allows several panels open at once; when false (default) panels form a single-open accordion.
Class	string	null	Extra CSS classes merged onto the root element.
Style	string	null	Inline CSS styles applied to the root element.

Content

ChildContent RenderFragment
The ExpansionPanel children of the group.

Name	Type	Description
ChildContent	RenderFragment	The ExpansionPanel children of the group.

<ExpansionPanel>

DaisyBlazor

Parameters

Dense bool
= false
Tightens the title and content padding; also on when the parent Dense is set.
Expanded bool
= false
Alias of IsExpanded for MudBlazor compatibility; reads and writes the same state.
Icon string
= null
Icon name rendered before the header text in the collapse-title.
IsExpanded bool
= false
Whether the panel is expanded. Both MudBlazor names are supported.
Text string
= null
Plain header text shown in the collapse-title when TitleContent is not set.
Class string
= null
Extra CSS classes merged onto the root collapse element.
Style string
= null
Inline CSS styles applied to the root <details> element.

Name	Type	Default	Description
Dense	bool	false	Tightens the title and content padding; also on when the parent Dense is set.
Expanded	bool	false	Alias of IsExpanded for MudBlazor compatibility; reads and writes the same state.
Icon	string	null	Icon name rendered before the header text in the collapse-title.
IsExpanded	bool	false	Whether the panel is expanded. Both MudBlazor names are supported.
Text	string	null	Plain header text shown in the collapse-title when TitleContent is not set.
Class	string	null	Extra CSS classes merged onto the root collapse element.
Style	string	null	Inline CSS styles applied to the root <details> element.

Events

ExpandedChanged EventCallback<bool>
Alias of IsExpandedChanged for MudBlazor compatibility; enables two-way binding of Expanded.
IsExpandedChanged EventCallback<bool>
Raised with the new state when the user opens or closes the panel; enables two-way binding of IsExpanded.

Name	Type	Description
ExpandedChanged	EventCallback<bool>	Alias of IsExpandedChanged for MudBlazor compatibility; enables two-way binding of Expanded.
IsExpandedChanged	EventCallback<bool>	Raised with the new state when the user opens or closes the panel; enables two-way binding of IsExpanded.

Content

ChildContent RenderFragment
Content shown in the daisyUI collapse-content area when the panel is expanded.
TitleContent RenderFragment
Custom header content for the collapse-title; takes precedence over Text.

Name	Type	Description
ChildContent	RenderFragment	Content shown in the daisyUI collapse-content area when the panel is expanded.
TitleContent	RenderFragment	Custom header content for the collapse-title; takes precedence over Text.

From MudExpansionPanels

ExpansionPanels keeps MudExpansionPanels's parameter names, so most markup moves over by dropping the Mud prefix. See the migration guide for the shared enums, icons and services.