Docs
Collapsible

Collapsible

An interactive component which expands/collapses a panel.

Component Source Primitive API Reference

Installation ​

bash
npx shadcn-vue@latest add collapsible

Usage ​

vue
<script setup lang="ts">
import {
  Collapsible,
  CollapsibleContent,
  CollapsibleTrigger,
} from '@/lib/registry/default/ui/collapsible'

const isOpen = ref(false)
</script>

<template>
  <Collapsible
    v-model:open="isOpen"
  >
    <CollapsibleTrigger>
      Trigger
    </CollapsibleTrigger>
    <CollapsibleContent>
      Content
    </CollapsibleContent>
  </Collapsible>
</template>
Edit this page on GitHub