feat: publish via dialog

components/modal/ModalContainer.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { isPreviewHelpOpen, isSigninDialogOpen, isUserSwitcherOpen } from '~/composables/dialog'
+import { isPreviewHelpOpen, isPublishDialogOpen, isSigninDialogOpen, isUserSwitcherOpen } from '~/composables/dialog'
 </script>
 
 <template>
@@ -12,4 +12,7 @@ import { isPreviewHelpOpen, isSigninDialogOpen, isUserSwitcherOpen } from '~/com
   <ModalDialog v-model="isPreviewHelpOpen">
     <HelpPreview />
   </ModalDialog>
+  <ModalDialog v-model="isPublishDialogOpen">
+    <PublishWidget draft-key="dialog" min-w-180 p6 />
+  </ModalDialog>
 </template>

components/modal/ModalDialog.vue

@@ -2,6 +2,11 @@
 const { modelValue } = defineModel<{
   modelValue: boolean
 }>()
+
+let init = $ref(false)
+watchOnce(modelValue, () => {
+  init = true
+})
 </script>
 
 <template>
@@ -23,7 +28,7 @@ const { modelValue } = defineModel<{
       "
       :class="modelValue ? 'opacity-100' : 'opacity-0'"
     >
-      <slot />
+      <slot v-if="init" />
     </div>
   </div>
 </template>

components/modal/ModalDrawer.vue

@@ -38,6 +38,11 @@ const transform = computed(() => {
       return ''
   }
 })
+
+let init = $ref(false)
+watchOnce(modelValue, () => {
+  init = true
+})
 </script>
 
 <template>
@@ -55,7 +60,7 @@ const transform = computed(() => {
       :class="positionClass"
       :style="modelValue ? {} : { transform }"
     >
-      <slot />
+      <slot v-if="init" />
     </div>
   </div>
 </template>