wot-design-uni
Version:
一个基于Vue3+TS开发的uni-app组件库,提供70+高质量组件,支持暗黑模式、国际化和自定义主题。
108 lines (92 loc) • 2.38 kB
text/typescript
import type { ComponentPublicInstance, ExtractPropTypes, PropType } from 'vue'
import { baseProps, makeBooleanProp, makeNumberProp, makeStringProp } from '../common/props'
export type PlacementType =
| 'top'
| 'top-start'
| 'top-end'
| 'bottom'
| 'bottom-start'
| 'bottom-end'
| 'left'
| 'left-start'
| 'left-end'
| 'right'
| 'right-start'
| 'right-end'
export const tooltipProps = {
...baseProps,
/**
* 自定义箭头内容
* 类型:string
*/
customArrow: makeStringProp(''),
/**
* 自定义弹出内容
* 类型:string
*/
customPop: makeStringProp(''),
/**
* 是否显示Tooltip箭头
* 类型:boolean
* 默认值:true
*/
visibleArrow: makeBooleanProp(true),
/**
* 显示的内容,也可以通过`slot#content`传入
* 类型:string | Array<Record<string, any>>
* 默认值:无(根据传入值而定)
*/
content: {
type: [String, Array] as PropType<string | Array<Record<string, any>>>
},
/**
* Tooltip的出现位置
* 类型:string
* 可选值:top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end
* 默认值:'bottom'
*/
placement: makeStringProp<PlacementType>('bottom'),
/**
* 出现位置的偏移量
* 类型:number
* 默认值:0
*/
// offset: makeNumberProp(0),
offset: {
// 需要支持数字、数组、对象类型
type: [Number, Array, Object] as PropType<number | Array<number> | Record<'x' | 'y', number>>,
default: 0
},
/**
* 是否使用slot来传入content内容
* 类型:boolean
* 默认值:false
*/
useContentSlot: makeBooleanProp(false),
/**
* Tooltip是否可用
* 类型:boolean
* 默认值:false
*/
disabled: makeBooleanProp(false),
/**
* 是否显示Tooltip内部的关闭按钮
* 类型:boolean
* 默认值:false
*/
showClose: makeBooleanProp(false),
/**
* Tooltip的状态是否可见,通过v-model绑定
* 类型:boolean
* 默认值:false
*/
modelValue: makeBooleanProp(false)
}
export type TooltipProps = ExtractPropTypes<typeof tooltipProps>
export type TooltipExpose = {
// 打开tooltip
open: () => void
// 关闭tooltip
close: () => void
}
export type TooltipInstance = ComponentPublicInstance<TooltipProps, TooltipExpose>