From 8fbeb6a9c3469639120b65bfc6858a4fd1b04d6f Mon Sep 17 00:00:00 2001 From: neverland Date: Fri, 24 Sep 2021 10:17:07 +0800 Subject: [PATCH] =?UTF-8?q?types:=20fix=20$toast=E3=80=81$dialog=E3=80=81$?= =?UTF-8?q?notify=20typing=20(#9556)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * types: fix $toast、$dialog、$notify typing * types: organize --- packages/vant/src/dialog/Dialog.tsx | 13 ++++--- packages/vant/src/dialog/function-call.tsx | 43 ++-------------------- packages/vant/src/dialog/index.ts | 10 +++-- packages/vant/src/dialog/types.ts | 39 ++++++++++++++++++++ packages/vant/src/notify/Notify.tsx | 3 +- packages/vant/src/notify/function-call.tsx | 18 +-------- packages/vant/src/notify/index.ts | 5 +-- packages/vant/src/notify/types.ts | 24 ++++++++++++ packages/vant/src/toast/Toast.tsx | 6 +-- packages/vant/src/toast/function-call.tsx | 29 ++------------- packages/vant/src/toast/index.ts | 5 +-- packages/vant/src/toast/types.ts | 35 ++++++++++++++++++ 12 files changed, 130 insertions(+), 100 deletions(-) create mode 100644 packages/vant/src/dialog/types.ts create mode 100644 packages/vant/src/notify/types.ts create mode 100644 packages/vant/src/toast/types.ts diff --git a/packages/vant/src/dialog/Dialog.tsx b/packages/vant/src/dialog/Dialog.tsx index 0ad1f156b..d34f5a989 100644 --- a/packages/vant/src/dialog/Dialog.tsx +++ b/packages/vant/src/dialog/Dialog.tsx @@ -21,12 +21,15 @@ import { Button } from '../button'; import { ActionBar } from '../action-bar'; import { ActionBarButton } from '../action-bar-button'; -const [name, bem, t] = createNamespace('dialog'); +// Types +import type { + DialogTheme, + DialogAction, + DialogMessage, + DialogMessageAlign, +} from './types'; -export type DialogTheme = 'default' | 'round-button'; -export type DialogAction = 'confirm' | 'cancel'; -export type DialogMessage = string | (() => JSX.Element); -export type DialogMessageAlign = 'left' | 'center' | 'right'; +const [name, bem, t] = createNamespace('dialog'); const popupKeys = [ ...popupSharedPropKeys, diff --git a/packages/vant/src/dialog/function-call.tsx b/packages/vant/src/dialog/function-call.tsx index 5804b1c63..3cadcc158 100644 --- a/packages/vant/src/dialog/function-call.tsx +++ b/packages/vant/src/dialog/function-call.tsx @@ -1,43 +1,8 @@ -import { App, CSSProperties, TeleportProps } from 'vue'; -import { - extend, - inBrowser, - withInstall, - Interceptor, - ComponentInstance, -} from '../utils'; +import { App } from 'vue'; +import { extend, inBrowser, withInstall, ComponentInstance } from '../utils'; import { mountComponent, usePopupState } from '../utils/mount-component'; -import VanDialog, { - DialogTheme, - DialogAction, - DialogMessage, - DialogMessageAlign, -} from './Dialog'; - -export type DialogOptions = { - title?: string; - width?: string | number; - theme?: DialogTheme; - message?: DialogMessage; - overlay?: boolean; - teleport?: TeleportProps['to']; - className?: unknown; - allowHtml?: boolean; - lockScroll?: boolean; - transition?: string; - beforeClose?: Interceptor; - messageAlign?: DialogMessageAlign; - overlayClass?: string; - overlayStyle?: CSSProperties; - closeOnPopstate?: boolean; - cancelButtonText?: string; - showCancelButton?: boolean; - showConfirmButton?: boolean; - cancelButtonColor?: string; - confirmButtonText?: string; - confirmButtonColor?: string; - closeOnClickOverlay?: boolean; -}; +import VanDialog from './Dialog'; +import type { DialogAction, DialogOptions } from './types'; let instance: ComponentInstance; diff --git a/packages/vant/src/dialog/index.ts b/packages/vant/src/dialog/index.ts index cc6ad11d5..903485b50 100644 --- a/packages/vant/src/dialog/index.ts +++ b/packages/vant/src/dialog/index.ts @@ -1,6 +1,10 @@ -import { Dialog, DialogOptions } from './function-call'; -import type { DialogTheme, DialogMessage, DialogMessageAlign } from './Dialog'; +import { Dialog } from './function-call'; export default Dialog; export { Dialog }; -export type { DialogTheme, DialogMessage, DialogOptions, DialogMessageAlign }; +export type { + DialogTheme, + DialogMessage, + DialogOptions, + DialogMessageAlign, +} from './types'; diff --git a/packages/vant/src/dialog/types.ts b/packages/vant/src/dialog/types.ts new file mode 100644 index 000000000..19c2c591a --- /dev/null +++ b/packages/vant/src/dialog/types.ts @@ -0,0 +1,39 @@ +import { Dialog } from './function-call'; +import type { CSSProperties, TeleportProps } from 'vue'; +import type { Interceptor } from '../utils'; + +export type DialogTheme = 'default' | 'round-button'; +export type DialogAction = 'confirm' | 'cancel'; +export type DialogMessage = string | (() => JSX.Element); +export type DialogMessageAlign = 'left' | 'center' | 'right'; + +export type DialogOptions = { + title?: string; + width?: string | number; + theme?: DialogTheme; + message?: DialogMessage; + overlay?: boolean; + teleport?: TeleportProps['to']; + className?: unknown; + allowHtml?: boolean; + lockScroll?: boolean; + transition?: string; + beforeClose?: Interceptor; + messageAlign?: DialogMessageAlign; + overlayClass?: string; + overlayStyle?: CSSProperties; + closeOnPopstate?: boolean; + cancelButtonText?: string; + showCancelButton?: boolean; + showConfirmButton?: boolean; + cancelButtonColor?: string; + confirmButtonText?: string; + confirmButtonColor?: string; + closeOnClickOverlay?: boolean; +}; + +declare module '@vue/runtime-core' { + interface ComponentCustomProperties { + $dialog: typeof Dialog; + } +} diff --git a/packages/vant/src/notify/Notify.tsx b/packages/vant/src/notify/Notify.tsx index b9d0e67b2..8acf72c3a 100644 --- a/packages/vant/src/notify/Notify.tsx +++ b/packages/vant/src/notify/Notify.tsx @@ -2,11 +2,10 @@ import { PropType, defineComponent } from 'vue'; import { createNamespace, extend, unknownProp } from '../utils'; import { Popup } from '../popup'; import { popupSharedProps } from '../popup/shared'; +import type { NotifyType } from './types'; const [name, bem] = createNamespace('notify'); -export type NotifyType = 'primary' | 'success' | 'danger' | 'warning'; - export default defineComponent({ name, diff --git a/packages/vant/src/notify/function-call.tsx b/packages/vant/src/notify/function-call.tsx index a30bd0465..6da0e3f3b 100644 --- a/packages/vant/src/notify/function-call.tsx +++ b/packages/vant/src/notify/function-call.tsx @@ -7,26 +7,12 @@ import { ComponentInstance, } from '../utils'; import { mountComponent, usePopupState } from '../utils/mount-component'; -import VanNotify, { NotifyType } from './Notify'; +import VanNotify from './Notify'; +import type { NotifyMessage, NotifyOptions } from './types'; let timer: number; let instance: ComponentInstance; -export type NotifyMessage = string | number; - -export type NotifyOptions = { - type?: NotifyType; - color?: string; - message?: NotifyMessage; - duration?: number; - className?: unknown; - background?: string; - lockScroll?: boolean; - onClick?: (event: MouseEvent) => void; - onClose?: () => void; - onOpened?: () => void; -}; - function parseOptions(message: NotifyMessage | NotifyOptions) { return isObject(message) ? message : { message }; } diff --git a/packages/vant/src/notify/index.ts b/packages/vant/src/notify/index.ts index 8a6aa185c..7b4d62d88 100644 --- a/packages/vant/src/notify/index.ts +++ b/packages/vant/src/notify/index.ts @@ -1,6 +1,5 @@ -import { Notify, NotifyOptions } from './function-call'; -import type { NotifyType } from './Notify'; +import { Notify } from './function-call'; export default Notify; export { Notify }; -export type { NotifyType, NotifyOptions }; +export type { NotifyType, NotifyOptions } from './types'; diff --git a/packages/vant/src/notify/types.ts b/packages/vant/src/notify/types.ts new file mode 100644 index 000000000..661c2ddd1 --- /dev/null +++ b/packages/vant/src/notify/types.ts @@ -0,0 +1,24 @@ +import { Notify } from './function-call'; + +export type NotifyMessage = string | number; + +export type NotifyType = 'primary' | 'success' | 'danger' | 'warning'; + +export type NotifyOptions = { + type?: NotifyType; + color?: string; + message?: NotifyMessage; + duration?: number; + className?: unknown; + background?: string; + lockScroll?: boolean; + onClick?: (event: MouseEvent) => void; + onClose?: () => void; + onOpened?: () => void; +}; + +declare module '@vue/runtime-core' { + interface ComponentCustomProperties { + $notify: typeof Notify; + } +} diff --git a/packages/vant/src/toast/Toast.tsx b/packages/vant/src/toast/Toast.tsx index 466106ecd..dec8d8fda 100644 --- a/packages/vant/src/toast/Toast.tsx +++ b/packages/vant/src/toast/Toast.tsx @@ -16,10 +16,10 @@ import { Icon } from '../icon'; import { Popup } from '../popup'; import { Loading, LoadingType } from '../loading'; -const [name, bem] = createNamespace('toast'); +// Types +import type { ToastType, ToastPosition } from './types'; -export type ToastType = 'text' | 'loading' | 'success' | 'fail' | 'html'; -export type ToastPosition = 'top' | 'middle' | 'bottom'; +const [name, bem] = createNamespace('toast'); export default defineComponent({ name, diff --git a/packages/vant/src/toast/function-call.tsx b/packages/vant/src/toast/function-call.tsx index 9e1b31a55..5566c39d2 100644 --- a/packages/vant/src/toast/function-call.tsx +++ b/packages/vant/src/toast/function-call.tsx @@ -1,4 +1,4 @@ -import { ref, App, TeleportProps, getCurrentInstance, watch } from 'vue'; +import { ref, App, getCurrentInstance, watch } from 'vue'; import { extend, isObject, @@ -7,31 +7,8 @@ import { ComponentInstance, } from '../utils'; import { mountComponent, usePopupState } from '../utils/mount-component'; -import VanToast, { ToastType, ToastPosition } from './Toast'; -import type { LoadingType } from '../loading'; - -export type ToastOptions = { - icon?: string; - type?: ToastType; - mask?: boolean; - message?: string | number; - onClose?: () => void; - onOpened?: () => void; - overlay?: boolean; - duration?: number; - teleport?: TeleportProps['to']; - iconSize?: number | string; - position?: ToastPosition; - className?: unknown; - transition?: string; - iconPrefix?: string; - loadingType?: LoadingType; - forbidClick?: boolean; - closeOnClick?: boolean; - overlayClass?: unknown; - overlayStyle?: Record; - closeOnClickOverlay?: boolean; -}; +import VanToast from './Toast'; +import type { ToastType, ToastOptions } from './types'; const defaultOptions: ToastOptions = { icon: '', diff --git a/packages/vant/src/toast/index.ts b/packages/vant/src/toast/index.ts index 6e99616d4..abd4f5ef3 100644 --- a/packages/vant/src/toast/index.ts +++ b/packages/vant/src/toast/index.ts @@ -1,6 +1,5 @@ -import { Toast, ToastOptions } from './function-call'; -import type { ToastType, ToastPosition } from './Toast'; +import { Toast } from './function-call'; export default Toast; export { Toast }; -export type { ToastType, ToastOptions, ToastPosition }; +export type { ToastType, ToastOptions, ToastPosition } from './types'; diff --git a/packages/vant/src/toast/types.ts b/packages/vant/src/toast/types.ts new file mode 100644 index 000000000..239776703 --- /dev/null +++ b/packages/vant/src/toast/types.ts @@ -0,0 +1,35 @@ +import { Toast } from './function-call'; +import type { TeleportProps } from 'vue'; +import type { LoadingType } from '../loading'; + +export type ToastType = 'text' | 'loading' | 'success' | 'fail' | 'html'; +export type ToastPosition = 'top' | 'middle' | 'bottom'; + +export type ToastOptions = { + icon?: string; + type?: ToastType; + mask?: boolean; + message?: string | number; + onClose?: () => void; + onOpened?: () => void; + overlay?: boolean; + duration?: number; + teleport?: TeleportProps['to']; + iconSize?: number | string; + position?: ToastPosition; + className?: unknown; + transition?: string; + iconPrefix?: string; + loadingType?: LoadingType; + forbidClick?: boolean; + closeOnClick?: boolean; + overlayClass?: unknown; + overlayStyle?: Record; + closeOnClickOverlay?: boolean; +}; + +declare module '@vue/runtime-core' { + interface ComponentCustomProperties { + $toast: typeof Toast; + } +}