accordion-item
One item in an accordion.
Example
How often does it sync?
Every 15 minutes.
Can I pause a sync?
Yes, from the segment page.
Laravel
<x-admin::accordion name="g-faq">
<x-admin::accordion-item title="How often does it sync?" open>Every 15 minutes.</x-admin::accordion-item>
<x-admin::accordion-item title="Can I pause a sync?">Yes, from the segment page.</x-admin::accordion-item>
</x-admin::accordion>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 { AccordionItem } from "@admiral/ui-kit/react" (or /vue). See the React and Vue guide.
HTML, for any stack
<div class="adm-accordion"><details class="adm-collapsible" name="g-faq" open >
<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>How often does it sync?</summary>
<div class="adm-collapsible__content">Every 15 minutes.</div>
</details>
<details class="adm-collapsible" name="g-faq" >
<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>Can I pause a sync?</summary>
<div class="adm-collapsible__content">Yes, from the segment page.</div>
</details></div>