Separator

<!-- Radix `Separator` → Reka UI `Separator`, тот же примитив. -->
<script setup lang="ts">
import type { HTMLAttributes } from "vue"
import { Separator as SeparatorPrimitive, type SeparatorProps } from "reka-ui"
import { cn } from "@/lib/utils"

const props = withDefaults(
  defineProps<
    SeparatorProps & {
      /** Доп. классы. Имя `class` — соглашение shadcn-vue (не `className`). */
      class?: HTMLAttributes["class"]
    }
  >(),
  {
    orientation: "horizontal",
    decorative: true,
  }
)
</script>

<template>
  <SeparatorPrimitive
    data-slot="separator"
    :decorative="props.decorative"
    :orientation="props.orientation"
    :class="
      cn(
        'shrink-0 bg-border data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch',
        props.class
      )
    "
  />
</template>

export { default as Separator } from "./Separator.vue"