refactor dialog props

next-ui/src/components/dialog/Confirm.vue

@@ -86,6 +86,7 @@
 
 <script setup lang="ts">
 import { defineMessage } from 'vue-intl'
+import type { DialogConfirmProps } from '@/types/DialogProps'
 
 const showDialog = defineModel<boolean>('dialog', { required: false })
 const emit = defineEmits<{
@@ -103,18 +104,6 @@ async function submitForm(isActive: Ref<boolean, boolean>) {
   }
 }
 
-export type DialogConfirmProps = {
-  title?: string
-  subtitle?: string
-  okText?: string
-  validateText?: string
-  maxWidth?: string | number
-  activator?: Element | string
-  loading?: boolean
-  closeOnSave?: boolean
-  fullscreen?: boolean
-}
-
 const {
   title = undefined,
   subtitle = undefined,

next-ui/src/components/dialog/ConfirmEdit.vue

@@ -70,6 +70,8 @@
 </template>
 
 <script setup lang="ts">
+import type { DialogConfirmEditProps } from '@/types/DialogProps'
+
 const showDialog = defineModel<boolean>('dialog', { required: false })
 const record = defineModel<unknown>('record', { required: true })
 
@@ -80,23 +82,6 @@ async function submitForm(callback: () => void) {
   if (valid) callback()
 }
 
-export type DialogConfirmEditProps = {
-  /**
-   * Dialog title
-   * @type string
-   */
-  title?: string
-  subtitle?: string
-  okText?: string
-  cardTextClass?: string
-  maxWidth?: string | number
-  activator?: Element | string
-  loading?: boolean
-  closeOnSave?: boolean
-  fullscreen?: boolean
-  scrollable?: boolean
-}
-
 const {
   title = undefined,
   subtitle = undefined,

next-ui/src/components/dialog/DialogSimple.vue

@@ -37,24 +37,10 @@
 </template>
 
 <script setup lang="ts">
+import type { DialogSimpleProps } from '@/types/DialogProps'
+
 const showDialog = defineModel<boolean>('dialog', { required: false, default: false })
 
-export type DialogSimpleProps = {
-  /**
-   * Dialog title
-   * @type string
-   */
-  title?: string
-  subtitle?: string
-  maxWidth?: string | number
-  activator?: Element | string
-  loading?: boolean
-  fullscreen?: boolean
-  scrollable?: boolean
-  shown?: boolean
-}
-
-const props = defineProps<DialogSimpleProps>()
 const {
   title = undefined,
   subtitle = undefined,
@@ -63,5 +49,5 @@ const {
   loading = false,
   fullscreen = undefined,
   scrollable = undefined,
-} = toRefs(props)
+} = defineProps<DialogSimpleProps>()
 </script>

next-ui/src/stores/dialogs.ts

@@ -1,8 +1,10 @@
 // Utilities
 import { defineStore } from 'pinia'
-import type { DialogConfirmEditProps } from '@/components/dialog/ConfirmEdit.vue'
-import type { DialogConfirmProps } from '@/components/dialog/Confirm.vue'
-import type { DialogSimpleProps } from '@/components/dialog/DialogSimple.vue'
+import type {
+  DialogConfirmEditProps,
+  DialogConfirmProps,
+  DialogSimpleProps,
+} from '@/types/DialogProps'
 
 /**
  * Reusable dialogs.

next-ui/src/types/DialogProps.ts

@@ -0,0 +1,25 @@
+type DialogBaseProps = {
+  title?: string
+  subtitle?: string
+  maxWidth?: string | number
+  activator?: Element | string
+  loading?: boolean
+  fullscreen?: boolean
+  scrollable?: boolean
+  shown?: boolean
+}
+
+type DialogConfirmBaseProps = DialogBaseProps & {
+  okText?: string
+  closeOnSave?: boolean
+}
+
+export type DialogSimpleProps = DialogBaseProps
+
+export type DialogConfirmProps = DialogConfirmBaseProps & {
+  validateText?: string
+}
+
+export type DialogConfirmEditProps = DialogConfirmBaseProps & {
+  cardTextClass?: string
+}