Accordion

<script setup lang="ts">
const open = ref("shipping");
</script>

<template>
  <UiAccordion v-model="open" class="demo-stack">
    <UiAccordionItem value="shipping" title="How long does shipping take?">
      Orders ship within two business days and arrive in three to five.
    </UiAccordionItem>
    <UiAccordionItem value="returns" title="Can I return an item?">
      Yes — within 30 days, in its original packaging.
    </UiAccordionItem>
    <UiAccordionItem value="warranty" title="Is there a warranty?" disabled>
      Not for this product.
    </UiAccordionItem>
  </UiAccordion>
</template>

<script setup lang="ts">
const open = ref(["notifications"]);
</script>

<template>
  <UiAccordion v-model="open" multiple class="demo-stack">
    <UiAccordionItem value="notifications" title="Notifications">
      Choose which updates reach your inbox.
    </UiAccordionItem>
    <UiAccordionItem value="privacy" title="Privacy">
      Control who can see your profile.
    </UiAccordionItem>
  </UiAccordion>
</template>