refactor: tooltip to ts
parent
7642bbafe4
commit
7a7b9f25cc
|
@ -1,4 +1,4 @@
|
||||||
import { inject } from 'vue';
|
import { defineComponent, inject } from 'vue';
|
||||||
import VcTooltip from '../vc-tooltip';
|
import VcTooltip from '../vc-tooltip';
|
||||||
import classNames from '../_util/classNames';
|
import classNames from '../_util/classNames';
|
||||||
import getPlacements from './placements';
|
import getPlacements from './placements';
|
||||||
|
@ -15,7 +15,7 @@ import { cloneElement } from '../_util/vnode';
|
||||||
import { defaultConfigProvider } from '../config-provider';
|
import { defaultConfigProvider } from '../config-provider';
|
||||||
import abstractTooltipProps from './abstractTooltipProps';
|
import abstractTooltipProps from './abstractTooltipProps';
|
||||||
|
|
||||||
const splitObject = (obj, keys) => {
|
const splitObject = (obj: any, keys: string[]) => {
|
||||||
const picked = {};
|
const picked = {};
|
||||||
const omitted = { ...obj };
|
const omitted = { ...obj };
|
||||||
keys.forEach(key => {
|
keys.forEach(key => {
|
||||||
|
@ -27,13 +27,14 @@ const splitObject = (obj, keys) => {
|
||||||
return { picked, omitted };
|
return { picked, omitted };
|
||||||
};
|
};
|
||||||
const props = abstractTooltipProps();
|
const props = abstractTooltipProps();
|
||||||
export default {
|
export default defineComponent({
|
||||||
name: 'ATooltip',
|
name: 'ATooltip',
|
||||||
inheritAttrs: false,
|
inheritAttrs: false,
|
||||||
props: {
|
props: {
|
||||||
...props,
|
...props,
|
||||||
title: PropTypes.any,
|
title: PropTypes.VNodeChild,
|
||||||
},
|
},
|
||||||
|
emits: ['update:visible', 'visibleChange'],
|
||||||
setup() {
|
setup() {
|
||||||
return {
|
return {
|
||||||
configProvider: inject('configProvider', defaultConfigProvider),
|
configProvider: inject('configProvider', defaultConfigProvider),
|
||||||
|
@ -61,7 +62,7 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
getPopupDomNode() {
|
getPopupDomNode() {
|
||||||
return this.$refs.tooltip.getPopupDomNode();
|
return (this.$refs.tooltip as any).getPopupDomNode();
|
||||||
},
|
},
|
||||||
|
|
||||||
getPlacements() {
|
getPlacements() {
|
||||||
|
@ -209,4 +210,4 @@ export default {
|
||||||
</VcTooltip>
|
</VcTooltip>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
};
|
});
|
|
@ -1,27 +1,31 @@
|
||||||
import PropTypes from '../_util/vue-types';
|
import PropTypes from '../_util/vue-types';
|
||||||
const triggerType = PropTypes.oneOf(['hover', 'focus', 'click', 'contextmenu']);
|
import { tuple } from '../_util/type';
|
||||||
|
const triggerType = PropTypes.oneOf(tuple('hover', 'focus', 'click', 'contextmenu'));
|
||||||
|
|
||||||
export default () => ({
|
export default () => ({
|
||||||
trigger: PropTypes.oneOfType([triggerType, PropTypes.arrayOf(triggerType)]).def('hover'),
|
trigger: PropTypes.oneOfType([triggerType, PropTypes.arrayOf(triggerType)]).def('hover'),
|
||||||
visible: PropTypes.looseBool,
|
visible: PropTypes.looseBool,
|
||||||
defaultVisible: PropTypes.looseBool,
|
defaultVisible: PropTypes.looseBool,
|
||||||
placement: PropTypes.oneOf([
|
placement: PropTypes.oneOf(
|
||||||
'top',
|
tuple(
|
||||||
'left',
|
'top',
|
||||||
'right',
|
'left',
|
||||||
'bottom',
|
'right',
|
||||||
'topLeft',
|
'bottom',
|
||||||
'topRight',
|
'topLeft',
|
||||||
'bottomLeft',
|
'topRight',
|
||||||
'bottomRight',
|
'bottomLeft',
|
||||||
'leftTop',
|
'bottomRight',
|
||||||
'leftBottom',
|
'leftTop',
|
||||||
'rightTop',
|
'leftBottom',
|
||||||
'rightBottom',
|
'rightTop',
|
||||||
]).def('top'),
|
'rightBottom',
|
||||||
|
),
|
||||||
|
).def('top'),
|
||||||
transitionName: PropTypes.string.def('zoom-big-fast'),
|
transitionName: PropTypes.string.def('zoom-big-fast'),
|
||||||
|
|
||||||
overlayStyle: PropTypes.object.def(() => ({})),
|
overlayStyle: PropTypes.object.def(() => ({})),
|
||||||
overlayClassName: PropTypes.string,
|
overlayClassName: PropTypes.string,
|
||||||
|
openClassName: PropTypes.string,
|
||||||
prefixCls: PropTypes.string,
|
prefixCls: PropTypes.string,
|
||||||
mouseEnterDelay: PropTypes.number.def(0.1),
|
mouseEnterDelay: PropTypes.number.def(0.1),
|
||||||
mouseLeaveDelay: PropTypes.number.def(0.1),
|
mouseLeaveDelay: PropTypes.number.def(0.1),
|
||||||
|
@ -31,7 +35,6 @@ export default () => ({
|
||||||
destroyTooltipOnHide: PropTypes.looseBool.def(false),
|
destroyTooltipOnHide: PropTypes.looseBool.def(false),
|
||||||
align: PropTypes.object.def(() => ({})),
|
align: PropTypes.object.def(() => ({})),
|
||||||
builtinPlacements: PropTypes.object,
|
builtinPlacements: PropTypes.object,
|
||||||
children: PropTypes.any,
|
children: PropTypes.VNodeChild,
|
||||||
onVisibleChange: PropTypes.func,
|
onVisibleChange: PropTypes.func,
|
||||||
'onUpdate:visible': PropTypes.func,
|
|
||||||
});
|
});
|
|
@ -1,7 +1,8 @@
|
||||||
|
import { App } from 'vue';
|
||||||
import ToolTip from './Tooltip';
|
import ToolTip from './Tooltip';
|
||||||
|
|
||||||
/* istanbul ignore next */
|
/* istanbul ignore next */
|
||||||
ToolTip.install = function(app) {
|
ToolTip.install = function(app: App) {
|
||||||
app.component(ToolTip.name, ToolTip);
|
app.component(ToolTip.name, ToolTip);
|
||||||
return app;
|
return app;
|
||||||
};
|
};
|
Loading…
Reference in New Issue