Details

Expandable/collapsable component where a user may choose to hide or show more information.

Expanded 1

Inside the first block of expanded content is a paragraph.

Expanded two

Inside the second block of expanded content is another paragraph.

Expanded three
  • Inside the third block
  • of expanded content
  • is an unordered list
PropTypeDescription
 
<script lang="ts">
import Details from '../components/details.svelte';
</script>

<Details>
  <div slot="summary">Expanded 1</div>
  <p>Inside the first block of expanded content is a paragraph.</p>
</Details>

<Details>
  <div slot="summary">Expanded two</div>
  <p>Inside the second block of expanded content is another paragraph.</p>
</Details>

<Details>
  <div slot="summary">Expanded three</div>
  <ul>
    <li>Inside the third block</li>
    <li>of expanded content</li>
    <li>is an unordered list</li>
  </ul>
</Details>

Autocomplete