collapsible
Hides rarely used content until opened.
Example
Advanced settings
Rarely used fields go here.
Laravel
<x-admin::collapsible title="Advanced settings">Rarely used fields go here.</x-admin::collapsible>Props
| Prop | Required | Default | Options |
|---|---|---|---|
title | yes | ||
open | false |
Other attributes, such as wire:model or data-*, pass through to the element.
Other stacks
React and Vue: import { Collapsible } from "@admiral/ui-kit/react" (or /vue). See the React and Vue guide.
HTML, for any stack
<details class="adm-collapsible" >
<summary><svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>Advanced settings</summary>
<div class="adm-collapsible__content">Rarely used fields go here.</div>
</details>