修复 FaDrawer and FaModal 组件在头部不显示时的警告

This commit is contained in:
Hooray
2025-07-30 22:16:31 +08:00
parent e4ef6449e0
commit cd8eff5f97
2 changed files with 20 additions and 1 deletions
+16 -1
View File
@@ -1,5 +1,6 @@
<script setup lang="ts">
import type { DrawerEmits, DrawerProps } from '.'
import { VisuallyHidden } from 'reka-ui'
import { cn } from '@/utils'
import {
Sheet,
@@ -42,6 +43,12 @@ const props = withDefaults(
const emits = defineEmits<DrawerEmits>()
const slots = defineSlots<{
header?: () => VNode
default?: () => VNode
footer?: () => VNode
}>()
const drawerId = shallowRef(props.id ?? useId())
const isOpen = ref(props.modelValue)
@@ -185,6 +192,10 @@ function handleAnimationEnd() {
'border-b': props.bordered,
})"
>
<VisuallyHidden v-if="!!slots.header">
<SheetTitle />
<SheetDescription />
</VisuallyHidden>
<slot name="header">
<SheetTitle :class="{ 'text-center': props.centered }">
{{ title }}
@@ -194,8 +205,12 @@ function handleAnimationEnd() {
</SheetDescription>
</slot>
</SheetHeader>
<VisuallyHidden v-else>
<SheetTitle />
<SheetDescription />
</VisuallyHidden>
<div class="m-0 flex-1 of-y-hidden">
<FaScrollArea class="h-full">
<FaScrollArea v-if="!!slots.default" class="h-full">
<div class="p-4">
<slot />
</div>
+4
View File
@@ -269,6 +269,10 @@ function handleAnimationEnd() {
</DialogDescription>
</slot>
</DialogHeader>
<VisuallyHidden v-else>
<DialogTitle />
<DialogDescription />
</VisuallyHidden>
<FaScrollArea v-if="!!slots.default" ref="dialogAreaRef" class="flex-1">
<div :class="cn('min-h-40 p-4', props.contentClass)">
<slot />