fix(modal): add dragging and resizing into slot params

vexip-ui · Oct 10, 2023 · a81c4f7 · a81c4f7
1 parent e486c10
commit a81c4f7
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 11 deletions.
diff --git a/components/modal/modal.vue b/components/modal/modal.vue
@@ -3,7 +3,7 @@ import { Button } from '@/components/button'
 import { Icon } from '@/components/icon'
 import { Masker } from '@/components/masker'
 
-import { computed, nextTick, reactive, ref, toRef, watch } from 'vue'
+import { computed, nextTick, reactive, ref, shallowReadonly, toRef, watch } from 'vue'
 
 import {
   createSizeProp,
@@ -282,12 +282,16 @@ defineExpose({
   handleClose
 })
 
-const slotParams = {
-  handleResize,
-  handleConfirm,
-  handleCancel,
-  handleClose
-}
+const slotParams = shallowReadonly(
+  reactive({
+    dragging,
+    resizing,
+    handleResize,
+    handleConfirm,
+    handleCancel,
+    handleClose
+  })
+)
 
 function setActive(active: boolean) {
   if (currentActive.value === active) return
@@ -380,7 +384,7 @@ function handleCancel() {
   emitEvent(props.onCancel)
 }
 
-async function handleClose(isConfirm: boolean) {
+async function handleClose(isConfirm = false) {
   let result: unknown = true
 
   if (typeof props.onBeforeClose === 'function') {

diff --git a/components/modal/symbol.ts b/components/modal/symbol.ts
@@ -9,10 +9,12 @@ export interface SizePayload {
 }
 
 export interface ModalSlotParams {
+  dragging: boolean,
+  resizing: boolean,
   handleResize: () => void,
   handleConfirm: () => void,
   handleCancel: () => void,
-  handleClose: (isConfirm: boolean) => Promise<void>
+  handleClose: (isConfirm?: boolean) => Promise<void>
 }
 
 export type ModalCommonSLot = (params: ModalSlotParams) => any

diff --git a/docs/en-US/component/modal.md b/docs/en-US/component/modal.md
@@ -118,10 +118,12 @@ Or you can directly import `useModal` and use it as in the example.
 
 ```ts
 interface ModalSlotParams {
+  dragging: boolean,
+  resizing: boolean,
   handleResize: () => void,
   handleConfirm: () => void,
   handleCancel: () => void,
-  handleClose: (isConfirm: boolean) => Promise<void>
+  handleClose: (isConfirm?: boolean) => Promise<void>
 }
 ```
 

diff --git a/docs/zh-CN/component/modal.md b/docs/zh-CN/component/modal.md
@@ -118,10 +118,12 @@ Modal 组件提供了一个静态的 `open` 方法，可以直接创建一个一
 
 ```ts
 interface ModalSlotParams {
+  dragging: boolean,
+  resizing: boolean,
   handleResize: () => void,
   handleConfirm: () => void,
   handleCancel: () => void,
-  handleClose: (isConfirm: boolean) => Promise<void>
+  handleClose: (isConfirm?: boolean) => Promise<void>
 }
 ```