Accordions

keep-open / keepOpen = false

boolean

Whether multiple accordion items can be open at the same time.

theme = ""

"" | "borderless"

Accordion theme. Borderless accordions are meant to be used for more spacious layouts or inside a Card component. See examples.

close(index: number): Promise<void>

index Index of the accordion item to be closed.

Closes a specific accordion item.

closeAll(): Promise<void>

Closes all accordion items.

open(index: number): Promise<void>

index Index of the accordion item to be opened.

Opens a specific accordion item.

openAll(): Promise<void>

Opens all accordion items.

toggle(index: number): Promise<void>

index Index of the accordion item to be toggled.

Toggles a specific accordion item.

open = false

boolean

Opens/closes the accordion item. Is not updated by user interaction.

closeItem(): Promise<void>

Closes this accordion item.

openItem(): Promise<void>

Opens this accordion item.

sdxdisplaychange

{ detail: { { display: "open" | "opening" | "closed" | "closing"; } } }

Emitted when the component’s visibility updates.