Files
Aether/frontend/src/components/ui/separator.vue
fawney19 c2eaa9181a refactor(frontend): 优化 UI 基础组件
- 添加默认 class 属性支持
- 改进组件类型定义
- 优化属性配置
2025-12-14 00:16:02 +08:00

34 lines
696 B
Vue

<script setup lang="ts">
import { Separator as SeparatorPrimitive } from 'radix-vue'
import { cn } from '@/lib/utils'
import { computed } from 'vue'
interface Props {
class?: string
orientation?: 'horizontal' | 'vertical'
decorative?: boolean
}
const props = withDefaults(defineProps<Props>(), {
class: undefined,
orientation: 'horizontal',
decorative: true,
})
const separatorClass = computed(() =>
cn(
'shrink-0 bg-border',
props.orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',
props.class
)
)
</script>
<template>
<SeparatorPrimitive
:class="separatorClass"
:orientation="orientation"
:decorative="decorative"
/>
</template>