Disclosure

ComponentLayout Source

A card that opens to show more: a native <details>, so it works without JavaScript. Open, it takes the accent edge that page headers have, and it grows open smoothly where browsers can animate to auto.

Disclosure(props: DisclosureProps): Element

Props

titlerequiredComponentChildren

descriptionoptionalComponentChildren

A line under the title.

iconoptionalComponentChildren

A small icon, shown in a tile that fills with the accent colour when open.

nameoptionalstring

Disclosures with the same name form an accordion: opening one closes the others.

openoptionalboolean

classoptionalstring

childrenrequiredComponentChildren