RevueUI
primitives

Collapsible

Collapsible — a base RevueUI primitive (Reka UI + a shadcn-compatible API).

Loading preview…

src/ui/collapsible/Collapsible.vue

<script setup lang="ts">
/**
 * Порт базового радикс-слоя (registry/bases/radix/ui/collapsible.tsx, MIT).
 * Radix CollapsiblePrimitive -> reka-ui Collapsible*, один в один.
 */
import { CollapsibleRoot } from "reka-ui"
</script>

<template>
  <CollapsibleRoot data-slot="collapsible">
    <slot />
  </CollapsibleRoot>
</template>

src/ui/collapsible/CollapsibleContent.vue

<script setup lang="ts">
import { CollapsibleContent } from "reka-ui"
</script>

<template>
  <CollapsibleContent data-slot="collapsible-content">
    <slot />
  </CollapsibleContent>
</template>

src/ui/collapsible/CollapsibleTrigger.vue

<script setup lang="ts">
import { CollapsibleTrigger } from "reka-ui"
</script>

<template>
  <CollapsibleTrigger data-slot="collapsible-trigger">
    <slot />
  </CollapsibleTrigger>
</template>

src/ui/collapsible/index.ts

export { default as Collapsible } from "./Collapsible.vue"
export { default as CollapsibleContent } from "./CollapsibleContent.vue"
export { default as CollapsibleTrigger } from "./CollapsibleTrigger.vue"

Install

npx shadcn-vue@latest add https://revueui.rootapi.dev/r/collapsible.json

npm dependencies

  • reka-ui

Source: ported from ReUI (Keenthemes, MIT)