From a0582856fcf4ea76bd90e200f7a486239d67b51a Mon Sep 17 00:00:00 2001
From: zernonia <zernonia@gmail.com>
Date: Wed, 28 Feb 2024 02:07:45 +0800
Subject: [PATCH] fix: not open immediately, linting

---
 packages/vaul-vue/src/DrawerContent.vue | 18 ++++++++++++------
 packages/vaul-vue/src/DrawerRoot.vue    |  7 +++++--
 2 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/packages/vaul-vue/src/DrawerContent.vue b/packages/vaul-vue/src/DrawerContent.vue
index fe67604..0da046d 100644
--- a/packages/vaul-vue/src/DrawerContent.vue
+++ b/packages/vaul-vue/src/DrawerContent.vue
@@ -43,22 +43,28 @@ function handlePointerDownOutside(event: Event) {
 }
 
 watch(
-  () => isOpen.value,
-  (isOpen) => {
-    if (isOpen) {
+  isOpen,
+  (open) => {
+    if (open) {
       setTimeout(() => {
         isVisible.value = true
       }, 1)
     }
   },
+  { immediate: true },
 )
 </script>
 
 <template>
   <DialogContent
-    ref="drawerRef" vaul-drawer="" :vaul-drawer-visible="isVisible ? 'true' : 'false'"
-    :style="[attrs.style, { '--snap-point-height': snapPointHeight }]" @pointerdown="onPress" @pointermove="onDrag"
-    @pointerup="onRelease" @pointer-down-outside="handlePointerDownOutside"
+    ref="drawerRef"
+    vaul-drawer=""
+    :vaul-drawer-visible="isVisible ? 'true' : 'false'"
+    :style="[attrs.style, { '--snap-point-height': snapPointHeight }]"
+    @pointerdown="onPress"
+    @pointermove="onDrag"
+    @pointerup="onRelease"
+    @pointer-down-outside="handlePointerDownOutside"
   >
     <slot />
   </DialogContent>
diff --git a/packages/vaul-vue/src/DrawerRoot.vue b/packages/vaul-vue/src/DrawerRoot.vue
index ecbedad..0247a7f 100644
--- a/packages/vaul-vue/src/DrawerRoot.vue
+++ b/packages/vaul-vue/src/DrawerRoot.vue
@@ -69,7 +69,11 @@ function handleOpenChange(o: boolean) {
 </script>
 
 <template>
-  <DialogRoot :open="open" :modal="modal" @update:open="handleOpenChange">
+  <DialogRoot
+    :open="open"
+    :modal="modal"
+    @update:open="handleOpenChange"
+  >
     <slot />
   </DialogRoot>
 </template>
@@ -120,7 +124,6 @@ function handleOpenChange(o: boolean) {
 /* This will allow us to not animate via animation, but still benefit from delaying unmount via Radix. */
 @keyframes fake-animation {
   from {}
-
   to {}
 }