1 changed files with 3 additions and 26 deletions
@ -1,34 +1,11 @@ |
|||
<script setup lang="ts"> |
|||
import type { DialogOverlayProps } from 'reka-ui'; |
|||
|
|||
import type { HTMLAttributes } from 'vue'; |
|||
import { inject } from 'vue'; |
|||
|
|||
import { useScrollLock } from '@vben-core/composables'; |
|||
import { cn } from '@vben-core/shared/utils'; |
|||
|
|||
import { reactiveOmit } from '@vueuse/core'; |
|||
import { DialogOverlay } from 'reka-ui'; |
|||
|
|||
const props = defineProps< |
|||
DialogOverlayProps & { class?: HTMLAttributes['class'] } |
|||
>(); |
|||
|
|||
const delegatedProps = reactiveOmit(props, 'class'); |
|||
|
|||
useScrollLock(); |
|||
const id = inject('DISMISSABLE_MODAL_ID'); |
|||
</script> |
|||
|
|||
<template> |
|||
<DialogOverlay |
|||
data-slot="dialog-overlay" |
|||
v-bind="delegatedProps" |
|||
:class=" |
|||
cn( |
|||
'z-popup bg-overlay inset-0 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed', |
|||
props.class, |
|||
) |
|||
" |
|||
> |
|||
<slot></slot> |
|||
</DialogOverlay> |
|||
<div :data-dismissable-modal="id" class="z-popup bg-overlay inset-0 fixed"></div> |
|||
</template> |
|||
|
|||
Loading…
Reference in new issue