diff --git a/packages/renderless/src/popconfirm/index.ts b/packages/renderless/src/popconfirm/index.ts index f393e51a3..3d46b6b9b 100644 --- a/packages/renderless/src/popconfirm/index.ts +++ b/packages/renderless/src/popconfirm/index.ts @@ -1,5 +1,7 @@ +import type { IPopconfirmRenderlessParams } from '@/types' + export const hide = - ({ state, emit }) => + ({ state, emit }: Pick) => () => { state.isLock = true setTimeout(() => { @@ -11,7 +13,7 @@ export const hide = } export const show = - ({ state, props, emit }) => + ({ state, props, emit }: Pick) => (trigger) => { if ((trigger ? props.trigger !== trigger : !props.reference) || state.isLock || state.showPopover) { return @@ -22,7 +24,7 @@ export const show = } export const confirm = - ({ state, emit }) => + ({ state, emit }: Pick) => () => { state.showPopover = false emit('confirm', state.showPopover) @@ -30,7 +32,7 @@ export const confirm = } export const handleEmit = - ({ state, emit, vm }) => + ({ state, emit, vm }: Pick) => (type) => { let { events = {} } = vm diff --git a/packages/renderless/src/popconfirm/vue.ts b/packages/renderless/src/popconfirm/vue.ts index 5003361dc..2be6779d1 100644 --- a/packages/renderless/src/popconfirm/vue.ts +++ b/packages/renderless/src/popconfirm/vue.ts @@ -1,15 +1,25 @@ +import type { + IPopconfirmApi, + IPopconfirmProps, + IPopconfirmRenderlessParamUtils, + ISharedRenderlessParamHooks +} from '@/types' import { show, hide, confirm, handleEmit } from './index' export const api = ['state', 'show', 'hide', 'confirm', 'handleEmit'] -export const renderless = (props, { computed, reactive }, { emit, constants, designConfig, vm }) => { - const api = {} - const designIcon = designConfig?.icons?.[props.type] +export const renderless = ( + props: IPopconfirmProps, + { computed, reactive }: ISharedRenderlessParamHooks, + { emit, constants, designConfig, vm }: IPopconfirmRenderlessParamUtils +): IPopconfirmApi => { + const api = {} as IPopconfirmApi + const designIcon = designConfig?.icons?.[props.type as string] const state = reactive({ isLock: false, showPopover: false, getIcon: computed(() => - typeof props.type === 'object' ? props.type : designIcon || constants.ICON_MAP[props.type] + typeof props.type === 'object' ? props.type : designIcon || constants.ICON_MAP[props.type as string] ) }) diff --git a/packages/renderless/types/popconfirm.type.ts b/packages/renderless/types/popconfirm.type.ts index e69de29bb..47f4ba292 100644 --- a/packages/renderless/types/popconfirm.type.ts +++ b/packages/renderless/types/popconfirm.type.ts @@ -0,0 +1,30 @@ +import type { ExtractPropTypes } from 'vue' +import type { popconfirmProps, $constants } from '@/popconfirm/src' +import type { ISharedRenderlessFunctionParams, ISharedRenderlessParamUtils } from './shared.type' +import type { show, hide, confirm, handleEmit } from '../src/popconfirm' + +export interface IPopconfirmState { + isLock: boolean + showPopover: boolean + getIcon: string +} + +export type IPopconfirmProps = ExtractPropTypes + +export type IPopconfirmConstants = typeof $constants + +export type IPopconfirmRenderlessParams = ISharedRenderlessFunctionParams & { + api: IPopconfirmApi + state: IPopconfirmState + props: IPopconfirmProps +} + +export interface IPopconfirmApi { + state: IPopconfirmState + show: ReturnType + hide: ReturnType + confirm: ReturnType + handleEmit: ReturnType +} + +export type IPopconfirmRenderlessParamUtils = ISharedRenderlessParamUtils diff --git a/packages/vue/src/popconfirm/src/index.ts b/packages/vue/src/popconfirm/src/index.ts index 921271c32..4c9393828 100644 --- a/packages/vue/src/popconfirm/src/index.ts +++ b/packages/vue/src/popconfirm/src/index.ts @@ -12,7 +12,7 @@ import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' import template from 'virtual-template?pc|mobile-first' -const $constants = { +export const $constants = { PC_PREFIXCLS: 'tiny-popconfim', MOBILE_PREFIXCLS: 'tiny-mobile-popconfim', Mode: 'pc', @@ -27,36 +27,38 @@ const $constants = { } } +export const popconfirmProps = { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + message: String, + customClass: String, + trigger: { + type: String, + default: 'hover', + validator: (value) => ['click', 'hover'].includes(value) + }, + cancelButton: { + type: Boolean, + default: true + }, + title: String, + placement: { + type: String, + default: 'top' + }, + width: { + type: [String, Number], + default: '350' + }, + type: [String, Object] +} + export default defineComponent({ name: $prefix + 'Popconfim', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - message: String, - customClass: String, - trigger: { - type: String, - default: 'hover', - validator: (value: string) => ['click', 'hover'].includes(value) - }, - cancelButton: { - type: Boolean, - default: true - }, - title: String, - placement: { - type: String, - default: 'top' - }, - width: { - type: [String, Number], - default: '350' - }, - type: [String, Object] - }, + props: popconfirmProps, setup(props, context) { return $setup({ props, context, template }) }