github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: update ts type

feat-update-ts
tangjinzhou 2022-03-26 17:36:25 +08:00
parent 16464213c1
commit b8591bd1c2
59 changed files with 467 additions and 349 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
components/_util/transButton.tsx
View File

@ -5,7 +5,6 @@ import { defineComponent, ref, onMounted } from 'vue';
* This helps accessibility reader to tread as a interactive button to operation.
*/
import KeyCode from './KeyCode';
import PropTypes from './vue-types';
const inlineStyle = {
border: 0,

9
components/components.ts
View File

@ -105,7 +105,14 @@ export { default as List, ListItem, ListItemMeta } from './list';
export type { MessageArgsProps } from './message';
export { default as message } from './message';
export type { MenuProps, MenuTheme, SubMenuProps, MenuItemProps, MenuMode } from './menu';
export type {
MenuProps,
MenuTheme,
SubMenuProps,
MenuItemProps,
MenuMode,
MenuDividerProps,
} from './menu';
export { default as Menu, MenuDivider, MenuItem, MenuItemGroup, SubMenu } from './menu';
export type { MentionsProps } from './mentions';

2
components/input/ClearableLabeledInput.tsx
View File

@ -21,7 +21,7 @@ export default defineComponent({
defaultValue: PropTypes.any,
allowClear: { type: Boolean, default: undefined },
element: PropTypes.any,
handleReset: Function,
handleReset: Function as PropType<MouseEventHandler>,
disabled: { type: Boolean, default: undefined },
direction: { type: String as PropType<Direction> },
size: { type: String as PropType<SizeType> },

11
components/menu/index.tsx
View File

@ -7,6 +7,7 @@ import SubMenu from './src/SubMenu';
import type { MenuItemGroupProps } from './src/ItemGroup';
import ItemGroup from './src/ItemGroup';
import Divider from './src/Divider';
import type { MenuDividerProps } from './src/Divider';
import type { App, Plugin } from 'vue';
import type { MenuTheme, MenuMode } from './src/interface';
/* istanbul ignore next */
@ -23,7 +24,15 @@ Menu.Item = MenuItem;
Menu.Divider = Divider;
Menu.SubMenu = SubMenu;
Menu.ItemGroup = ItemGroup;
export type { MenuProps, SubMenuProps, MenuItemProps, MenuItemGroupProps, MenuTheme, MenuMode };
export type {
MenuProps,
SubMenuProps,
MenuItemProps,
MenuItemGroupProps,
MenuTheme,
MenuMode,
MenuDividerProps,
};
export {
SubMenu,
MenuItem as Item,

13
components/menu/src/Divider.tsx
View File

@ -1,12 +1,17 @@
import useConfigInject from '../../_util/hooks/useConfigInject';
import type { ExtractPropTypes } from 'vue';
import { computed, defineComponent } from 'vue';
export const menuDividerProps = () => ({
prefixCls: String,
dashed: Boolean,
});
export type MenuDividerProps = Partial<ExtractPropTypes<ReturnType<typeof menuDividerProps>>>;
export default defineComponent({
name: 'AMenuDivider',
props: {
prefixCls: String,
dashed: Boolean,
},
props: menuDividerProps(),
setup(props) {
const { prefixCls } = useConfigInject('menu', props);
const cls = computed(() => {

8
components/menu/src/ItemGroup.tsx
View File

@ -5,16 +5,16 @@ import PropTypes from '../../_util/vue-types';
import { useInjectMenu } from './hooks/useMenuContext';
import { useMeasure } from './hooks/useKeyPath';
export const menuItemGroupProps = {
export const menuItemGroupProps = () => ({
title: PropTypes.any,
};
});
export type MenuItemGroupProps = Partial<ExtractPropTypes<typeof menuItemGroupProps>>;
export type MenuItemGroupProps = Partial<ExtractPropTypes<ReturnType<typeof menuItemGroupProps>>>;
export default defineComponent({
name: 'AMenuItemGroup',
inheritAttrs: false,
props: menuItemGroupProps,
props: menuItemGroupProps(),
slots: ['title'],
setup(props, { slots, attrs }) {
const { prefixCls } = useInjectMenu();

12
components/menu/src/Menu.tsx
View File

@ -29,15 +29,15 @@ import { OVERFLOW_KEY, PathContext } from './hooks/useKeyPath';
import type { FocusEventHandler, MouseEventHandler } from '../../_util/EventInterface';
import collapseMotion from '../../_util/collapseMotion';
export const menuProps = {
export const menuProps = () => ({
id: String,
prefixCls: String,
disabled: Boolean,
inlineCollapsed: Boolean,
disabledOverflow: Boolean,
forceSubMenuRender: Boolean,
openKeys: Array,
selectedKeys: Array,
openKeys: Array as PropType<Key[]>,
selectedKeys: Array as PropType<Key[]>,
activeKey: String, // 内部组件使用
selectable: { type: Boolean, default: true },
multiple: { type: Boolean, default: false },
@ -68,15 +68,15 @@ export const menuProps = {
'onUpdate:openKeys': Function as PropType<(keys: Key[]) => void>,
'onUpdate:selectedKeys': Function as PropType<(keys: Key[]) => void>,
'onUpdate:activeKey': Function as PropType<(key: Key) => void>,
};
});
export type MenuProps = Partial<ExtractPropTypes<typeof menuProps>>;
export type MenuProps = Partial<ExtractPropTypes<ReturnType<typeof menuProps>>>;
const EMPTY_LIST: string[] = [];
export default defineComponent({
name: 'AMenu',
inheritAttrs: false,
props: menuProps,
props: menuProps(),
slots: ['expandIcon', 'overflowedIndicator'],
setup(props, { slots, emit, attrs }) {
const { prefixCls, direction, getPrefixCls } = useConfigInject('menu', props);

18
components/menu/src/MenuItem.tsx
View File

@ -1,6 +1,6 @@
import { flattenChildren, getPropsSlot, isValidElement } from '../../_util/props-util';
import PropTypes from '../../_util/vue-types';
import type { ExtractPropTypes } from 'vue';
import type { ExtractPropTypes, PropType } from 'vue';
import { computed, defineComponent, getCurrentInstance, onBeforeUnmount, ref, watch } from 'vue';
import { useInjectKeyPath, useMeasure } from './hooks/useKeyPath';
import { useInjectFirstLevel, useInjectMenu } from './hooks/useMenuContext';
@ -11,24 +11,30 @@ import KeyCode from '../../_util/KeyCode';
import useDirectionStyle from './hooks/useDirectionStyle';
import Overflow from '../../vc-overflow';
import devWarning from '../../vc-util/devWarning';
import type { MouseEventHandler } from '../../_util/EventInterface';
let indexGuid = 0;
export const menuItemProps = {
export const menuItemProps = () => ({
id: String,
role: String,
disabled: Boolean,
danger: Boolean,
title: { type: [String, Boolean], default: undefined },
icon: PropTypes.any,
};
onMouseenter: Function as PropType<MouseEventHandler>,
onMouseleave: Function as PropType<MouseEventHandler>,
onClick: Function as PropType<MouseEventHandler>,
onKeydown: Function as PropType<MouseEventHandler>,
onFocus: Function as PropType<MouseEventHandler>,
});
export type MenuItemProps = Partial<ExtractPropTypes<typeof menuItemProps>>;
export type MenuItemProps = Partial<ExtractPropTypes<ReturnType<typeof menuItemProps>>>;
export default defineComponent({
name: 'AMenuItem',
inheritAttrs: false,
props: menuItemProps,
emits: ['mouseenter', 'mouseleave', 'click', 'keydown', 'focus'],
props: menuItemProps(),
// emits: ['mouseenter', 'mouseleave', 'click', 'keydown', 'focus'],
slots: ['icon', 'title'],
setup(props, { slots, emit, attrs }) {
const instance = getCurrentInstance();

15
components/menu/src/SubMenu.tsx
View File

@ -19,10 +19,12 @@ import { cloneElement } from '../../_util/vnode';
import Overflow from '../../vc-overflow';
import devWarning from '../../vc-util/devWarning';
import isValid from '../../_util/isValid';
import type { MouseEventHandler } from '../../_util/EventInterface';
import type { Key } from 'ant-design-vue/es/_util/type';
let indexGuid = 0;
export const subMenuProps = {
export const subMenuProps = () => ({
icon: PropTypes.any,
title: PropTypes.any,
disabled: Boolean,
@ -32,16 +34,19 @@ export const subMenuProps = {
internalPopupClose: Boolean,
eventKey: String,
expandIcon: Function as PropType<(p?: { isOpen: boolean; [key: string]: any }) => any>,
};
onMouseenter: Function as PropType<MouseEventHandler>,
onMouseleave: Function as PropType<MouseEventHandler>,
onTitleClick: Function as PropType<(e: MouseEvent, key: Key) => void>,
});
export type SubMenuProps = Partial<ExtractPropTypes<typeof subMenuProps>>;
export type SubMenuProps = Partial<ExtractPropTypes<ReturnType<typeof subMenuProps>>>;
export default defineComponent({
name: 'ASubMenu',
inheritAttrs: false,
props: subMenuProps,
props: subMenuProps(),
slots: ['icon', 'title', 'expandIcon'],
emits: ['titleClick', 'mouseenter', 'mouseleave'],
// emits: ['titleClick', 'mouseenter', 'mouseleave'],
setup(props, { slots, attrs, emit }) {
useProvideFirstLevel(false);
const isMeasure = useMeasure();

15
components/page-header/index.tsx
View File

@ -1,4 +1,4 @@
import type { ExtractPropTypes } from 'vue';
import type { ExtractPropTypes, PropType } from 'vue';
import { defineComponent, ref, computed } from 'vue';
import PropTypes from '../_util/vue-types';
import { filterEmpty, flattenChildren, isEmptyContent } from '../_util/props-util';
@ -13,8 +13,9 @@ import useConfigInject from '../_util/hooks/useConfigInject';
import classNames from '../_util/classNames';
import ResizeObserver from '../vc-resize-observer';
import useDestroyed from '../_util/hooks/useDestroyed';
import type { MouseEventHandler } from '../_util/EventInterface';
export const pageHeaderProps = {
export const pageHeaderProps = () => ({
backIcon: PropTypes.any,
prefixCls: String,
title: PropTypes.any,
@ -25,15 +26,15 @@ export const pageHeaderProps = {
extra: PropTypes.any,
avatar: PropTypes.object,
ghost: { type: Boolean, default: undefined },
onBack: Function,
};
onBack: Function as PropType<MouseEventHandler>,
});
export type PageHeaderProps = Partial<ExtractPropTypes<typeof pageHeaderProps>>;
export type PageHeaderProps = Partial<ExtractPropTypes<ReturnType<typeof pageHeaderProps>>>;
const PageHeader = defineComponent({
name: 'APageHeader',
props: pageHeaderProps,
emits: ['back'],
props: pageHeaderProps(),
// emits: ['back'],
slots: ['backIcon', 'avatar', 'breadcrumb', 'title', 'subTitle', 'tags', 'extra', 'footer'],
setup(props, { emit, slots }) {
const { prefixCls, direction, pageHeader } = useConfigInject('page-header', props);

2
components/pagination/Pagination.tsx
View File

@ -78,7 +78,7 @@ export default defineComponent({
name: 'APagination',
inheritAttrs: false,
props: paginationProps(),
emits: ['change', 'showSizeChange', 'update:current', 'update:pageSize'],
// emits: ['change', 'showSizeChange', 'update:current', 'update:pageSize'],
setup(props, { slots, attrs }) {
const { prefixCls, configProvider, direction } = useConfigInject('pagination', props);
const selectPrefixCls = computed(() =>

15
components/popconfirm/index.tsx
View File

@ -1,4 +1,4 @@
import type { ExtractPropTypes, PropType } from 'vue';
import type { ExtractPropTypes, HTMLAttributes, PropType } from 'vue';
import { computed, onMounted, ref, toRef, defineComponent } from 'vue';
import Tooltip from '../tooltip';
import abstractTooltipProps from '../tooltip/abstractTooltipProps';
@ -35,8 +35,14 @@ export const popconfirmProps = () => ({
okText: PropTypes.any,
cancelText: PropTypes.any,
icon: PropTypes.any,
okButtonProps: PropTypes.object,
cancelButtonProps: PropTypes.object,
okButtonProps: {
type: Object as PropType<ButtonProps & HTMLAttributes>,
default: undefined as ButtonProps & HTMLAttributes,
},
cancelButtonProps: {
type: Object as PropType<ButtonProps & HTMLAttributes>,
default: undefined as ButtonProps & HTMLAttributes,
},
showCancel: { type: Boolean, default: true },
onConfirm: Function as PropType<(e: MouseEvent) => void>,
onCancel: Function as PropType<(e: MouseEvent) => void>,
@ -52,10 +58,9 @@ export interface PopconfirmLocale {
const Popconfirm = defineComponent({
name: 'APopconfirm',
props: initDefaultProps(popconfirmProps(), {
...tooltipDefaultProps,
...tooltipDefaultProps(),
trigger: 'click',
transitionName: 'zoom-big',
align: () => ({}),
placement: 'top',
mouseEnterDelay: 0.1,
mouseLeaveDelay: 0.1,

2
components/popover/index.tsx
View File

@ -21,7 +21,7 @@ export type PopoverProps = Partial<ExtractPropTypes<ReturnType<typeof popoverPro
const Popover = defineComponent({
name: 'APopover',
props: initDefaultProps(popoverProps(), {
...tooltipDefaultProps,
...tooltipDefaultProps(),
trigger: 'hover',
transitionName: 'zoom-big',
placement: 'top',

1
components/progress/Circle.tsx
View File

@ -22,6 +22,7 @@ function getStrokeColor({
}
export default defineComponent({
name: 'Circle',
inheritAttrs: false,
props: progressProps(),
setup(props, { slots }) {

8
components/progress/Line.tsx
View File

@ -6,15 +6,15 @@ import type { StringGradients, ProgressGradient } from './props';
import { progressProps } from './props';
import { getSuccessPercent, validProgress } from './utils';
export const lineProps = {
export const lineProps = () => ({
...progressProps(),
prefixCls: String,
direction: {
type: String as PropType<Direction>,
},
};
});
export type LineProps = Partial<ExtractPropTypes<typeof lineProps>>;
export type LineProps = Partial<ExtractPropTypes<ReturnType<typeof lineProps>>>;
/**
* {
@ -69,7 +69,7 @@ export const handleGradient = (strokeColor: ProgressGradient, directionConfig: D
export default defineComponent({
name: 'Line',
props: lineProps,
props: lineProps(),
setup(props, { slots }) {
const backgroundProps = computed(() => {
const { strokeColor, direction } = props;

7
components/progress/Steps.tsx
View File

@ -4,7 +4,7 @@ import type { VueNode } from '../_util/type';
import type { ProgressSize } from './props';
import { progressProps } from './props';
export const stepsProps = {
export const stepsProps = () => ({
...progressProps(),
steps: Number,
size: {
@ -12,12 +12,13 @@ export const stepsProps = {
},
strokeColor: String,
trailColor: String,
};
});
export type StepsProps = Partial<ExtractPropTypes<typeof stepsProps>>;
export default defineComponent({
props: stepsProps,
name: 'Steps',
props: stepsProps(),
setup(props, { slots }) {
const current = computed(() => Math.round(props.steps * ((props.percent || 0) / 100)));
const stepWidth = computed(() => (props.size === 'small' ? 2 : 14));

5
components/progress/props.ts
View File

@ -26,9 +26,10 @@ export const progressProps = () => ({
status: PropTypes.oneOf(progressStatuses),
showInfo: { type: Boolean, default: undefined },
strokeWidth: Number,
strokeLinecap: PropTypes.oneOf(tuple('butt', 'round', 'square')),
strokeLinecap: String as PropType<'butt' | 'square' | 'round'>,
strokeColor: {
type: [String, Object] as PropType<string | ProgressGradient>,
default: undefined as string | ProgressGradient,
},
trailColor: String,
width: Number,
@ -37,7 +38,7 @@ export const progressProps = () => ({
default: (): SuccessProps => ({}),
},
gapDegree: Number,
gapPosition: PropTypes.oneOf(tuple('top', 'bottom', 'left', 'right')),
gapPosition: String as PropType<'top' | 'bottom' | 'left' | 'right'>,
size: PropTypes.oneOf(ProgressSize),
steps: Number,
/** @deprecated Use `success` instead */

22
components/radio/Group.tsx
View File

@ -5,16 +5,14 @@ import PropTypes from '../_util/vue-types';
import Radio from './Radio';
import useConfigInject from '../_util/hooks/useConfigInject';
import { tuple } from '../_util/type';
import type { RadioChangeEvent } from './interface';
import type { RadioChangeEvent, RadioGroupButtonStyle, RadioGroupOptionType } from './interface';
import { useInjectFormItemContext } from '../form/FormItemContext';
const RadioGroupSizeTypes = tuple('large', 'default', 'small');
export type RadioGroupSize = typeof RadioGroupSizeTypes[number];
const RadioGroupOptionTypes = tuple('default', 'button');
export type RadioGroupOption = typeof RadioGroupOptionTypes[number];
export type RadioGroupOption = RadioGroupOptionType;
export type RadioGroupChildOption = {
label?: any;
@ -22,7 +20,7 @@ export type RadioGroupChildOption = {
disabled?: boolean;
};
export const radioGroupProps = {
export const radioGroupProps = () => ({
prefixCls: String,
value: PropTypes.any,
size: PropTypes.oneOf(RadioGroupSizeTypes).def('default'),
@ -31,17 +29,19 @@ export const radioGroupProps = {
},
disabled: { type: Boolean, default: undefined },
name: String,
buttonStyle: PropTypes.string.def('outline'),
buttonStyle: { type: String as PropType<RadioGroupButtonStyle>, default: 'outline' },
id: String,
optionType: PropTypes.oneOf(RadioGroupOptionTypes).def('default'),
};
optionType: { type: String as PropType<RadioGroupOptionType>, default: 'default' },
onChange: Function as PropType<(e: RadioChangeEvent) => void>,
'onUpdate:value': Function as PropType<(val: any) => void>,
});
export type RadioGroupProps = Partial<ExtractPropTypes<typeof radioGroupProps>>;
export type RadioGroupProps = Partial<ExtractPropTypes<ReturnType<typeof radioGroupProps>>>;
export default defineComponent({
name: 'ARadioGroup',
props: radioGroupProps,
emits: ['update:value', 'change'],
props: radioGroupProps(),
// emits: ['update:value', 'change'],
setup(props, { slots, emit }) {
const formItemContext = useInjectFormItemContext();
const { prefixCls, direction, size } = useConfigInject('radio', props);

26
components/radio/Radio.tsx
View File

@ -1,4 +1,4 @@
import type { ExtractPropTypes } from 'vue';
import type { ExtractPropTypes, PropType } from 'vue';
import { defineComponent, inject, ref } from 'vue';
import PropTypes from '../_util/vue-types';
import VcCheckbox from '../vc-checkbox/Checkbox';
@ -6,8 +6,10 @@ import classNames from '../_util/classNames';
import useConfigInject from '../_util/hooks/useConfigInject';
import type { RadioChangeEvent, RadioGroupContext } from './interface';
import { useInjectFormItemContext } from '../form/FormItemContext';
import omit from '../_util/omit';
import type { FocusEventHandler, MouseEventHandler } from '../_util/EventInterface';
export const radioProps = {
export const radioProps = () => ({
prefixCls: String,
checked: { type: Boolean, default: undefined },
disabled: { type: Boolean, default: undefined },
@ -16,18 +18,20 @@ export const radioProps = {
name: String,
id: String,
autofocus: { type: Boolean, default: undefined },
onChange: Function,
onFocus: Function,
onBlur: Function,
onClick: Function,
};
onChange: Function as PropType<(event: RadioChangeEvent) => void>,
onFocus: Function as PropType<FocusEventHandler>,
onBlur: Function as PropType<FocusEventHandler>,
onClick: Function as PropType<MouseEventHandler>,
'onUpdate:checked': Function as PropType<(checked: boolean) => void>,
'onUpdate:value': Function as PropType<(checked: boolean) => void>,
});
export type RadioProps = Partial<ExtractPropTypes<typeof radioProps>>;
export type RadioProps = Partial<ExtractPropTypes<ReturnType<typeof radioProps>>>;
export default defineComponent({
name: 'ARadio',
props: radioProps,
emits: ['update:checked', 'update:value', 'change', 'blur', 'focus'],
props: radioProps(),
// emits: ['update:checked', 'update:value', 'change', 'blur', 'focus'],
setup(props, { emit, expose, slots }) {
const formItemContext = useInjectFormItemContext();
const vcCheckbox = ref<HTMLElement>();
@ -66,7 +70,7 @@ export default defineComponent({
const rProps: RadioProps = {
prefixCls: prefixCls.value,
id,
...restProps,
...omit(restProps, ['onUpdate:checked', 'onUpdate:value']),
};
if (radioGroup) {

4
components/radio/RadioButton.tsx
View File

@ -6,8 +6,8 @@ import type { RadioGroupContext } from './interface';
export default defineComponent({
name: 'ARadioButton',
props: radioProps,
setup(props: RadioProps, { slots }) {
props: radioProps(),
setup(props, { slots }) {
const { prefixCls } = useConfigInject('radio-button', props);
const radioGroupContext = inject<RadioGroupContext>('radioGroupContext', undefined);

10
components/radio/demo/radioGroup-options.vue
View File

@ -16,20 +16,14 @@ Render radios by configuring `options`.
</docs>
<template>
<div>
<a-space direction="vertical">
<a-radio-group v-model:value="value1" :options="plainOptions" />
<br />
<a-radio-group v-model:value="value2" :options="optionsWithDisabled" />
<br />
<a-radio-group v-model:value="value3" :options="plainOptions" disabled />
<br />
<a-radio-group v-model:value="value1" option-type="button" :options="plainOptions" />
<br />
<a-radio-group v-model:value="value2" option-type="button" :options="optionsWithDisabled" />
<br />
<a-radio-group v-model:value="value3" option-type="button" :options="plainOptions" disabled />
<br />
</div>
</a-space>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';

3
components/radio/interface.ts
View File

@ -4,6 +4,9 @@ export interface RadioChangeEventTarget extends RadioProps {
checked: boolean;
}
export type RadioGroupButtonStyle = 'outline' | 'solid';
export type RadioGroupOptionType = 'default' | 'button';
export interface RadioChangeEvent {
target: RadioChangeEventTarget;
stopPropagation: () => void;

24
components/rate/index.tsx
View File

@ -1,4 +1,4 @@
import type { ExtractPropTypes, VNode } from 'vue';
import type { ExtractPropTypes, PropType, VNode } from 'vue';
import { watch, defineComponent, ref, reactive, onMounted } from 'vue';
import { initDefaultProps, getPropsSlot, findDOMNode } from '../_util/props-util';
import { withInstall } from '../_util/type';
@ -13,28 +13,36 @@ import useConfigInject from '../_util/hooks/useConfigInject';
import Star from './Star';
import useRefs from '../_util/hooks/useRefs';
import { useInjectFormItemContext } from '../form/FormItemContext';
import type { Direction } from '../config-provider';
import type { FocusEventHandler, KeyboardEventHandler } from '../_util/EventInterface';
export const rateProps = {
export const rateProps = () => ({
prefixCls: String,
count: Number,
value: Number,
allowHalf: { type: Boolean, default: undefined },
allowClear: { type: Boolean, default: undefined },
tooltips: PropTypes.arrayOf(PropTypes.string),
tooltips: Array as PropType<string[]>,
disabled: { type: Boolean, default: undefined },
character: PropTypes.any,
autofocus: { type: Boolean, default: undefined },
tabindex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
direction: String,
direction: String as PropType<Direction>,
id: String,
};
onChange: Function as PropType<(value: number) => void>,
onHoverChange: Function as PropType<(value: number) => void>,
'onUpdate:value': Function as PropType<(value: number) => void>,
onFocus: Function as PropType<FocusEventHandler>,
onBlur: Function as PropType<FocusEventHandler>,
onKeydown: Function as PropType<KeyboardEventHandler>,
});
export type RateProps = Partial<ExtractPropTypes<typeof rateProps>>;
export type RateProps = Partial<ExtractPropTypes<ReturnType<typeof rateProps>>>;
const Rate = defineComponent({
name: 'ARate',
inheritAttrs: false,
props: initDefaultProps(rateProps, {
props: initDefaultProps(rateProps(), {
value: 0,
count: 5,
allowHalf: false,
@ -42,7 +50,7 @@ const Rate = defineComponent({
tabindex: 0,
direction: 'ltr',
}),
emits: ['hoverChange', 'update:value', 'change', 'focus', 'blur', 'keydown'],
// emits: ['hoverChange', 'update:value', 'change', 'focus', 'blur', 'keydown'],
setup(props, { slots, attrs, emit, expose }) {
const { prefixCls, direction } = useConfigInject('rate', props);
const formItemContext = useInjectFormItemContext();

18
components/result/index.tsx
View File

@ -1,7 +1,6 @@
import type { App, VNodeTypes, Plugin, ExtractPropTypes } from 'vue';
import type { App, VNodeTypes, Plugin, ExtractPropTypes, PropType } from 'vue';
import { defineComponent, computed } from 'vue';
import PropTypes from '../_util/vue-types';
import { tuple } from '../_util/type';
import CheckCircleFilled from '@ant-design/icons-vue/CheckCircleFilled';
import CloseCircleFilled from '@ant-design/icons-vue/CloseCircleFilled';
import ExclamationCircleFilled from '@ant-design/icons-vue/ExclamationCircleFilled';
@ -25,21 +24,22 @@ export const ExceptionMap = {
'403': unauthorized,
};
export type ExceptionStatusType = 403 | 404 | 500 | '403' | '404' | '500';
export type ResultStatusType = ExceptionStatusType | keyof typeof IconMap;
// ExceptionImageMap keys
const ExceptionStatus = Object.keys(ExceptionMap);
export const resultProps = {
export const resultProps = () => ({
prefixCls: String,
icon: PropTypes.any,
status: PropTypes.oneOf(tuple('success', 'error', 'info', 'warning', '404', '403', '500')).def(
'info',
),
status: { type: [Number, String] as PropType<ResultStatusType>, default: 'info' },
title: PropTypes.any,
subTitle: PropTypes.any,
extra: PropTypes.any,
};
});
export type ResultProps = Partial<ExtractPropTypes<typeof resultProps>>;
export type ResultProps = Partial<ExtractPropTypes<ReturnType<typeof resultProps>>>;
const renderIcon = (prefixCls: string, { status, icon }) => {
if (ExceptionStatus.includes(`${status}`)) {
@ -60,7 +60,7 @@ const renderExtra = (prefixCls: string, extra: VNodeTypes) =>
const Result = defineComponent({
name: 'AResult',
props: resultProps,
props: resultProps(),
slots: ['title', 'subTitle', 'icon', 'extra'],
setup(props, { slots }) {
const { prefixCls, direction } = useConfigInject('result', props);

15
components/slider/index.tsx
View File

@ -10,6 +10,7 @@ import useConfigInject from '../_util/hooks/useConfigInject';
import SliderTooltip from './SliderTooltip';
import classNames from '../_util/classNames';
import { useInjectFormItemContext } from '../form/FormItemContext';
import type { FocusEventHandler } from '../_util/EventInterface';
export type SliderValue = number | [number, number];
@ -64,10 +65,13 @@ export const sliderProps = () => ({
type: Function as PropType<(triggerNode: HTMLElement) => HTMLElement>,
},
autofocus: { type: Boolean, default: undefined },
onChange: { type: Function as PropType<(value: Value) => void> },
onAfterChange: { type: Function as PropType<(value: Value) => void> },
handleStyle: { type: [Object, Array] as PropType<CSSProperties[] | CSSProperties> },
trackStyle: { type: [Object, Array] as PropType<CSSProperties[] | CSSProperties> },
onChange: { type: Function as PropType<(value: Value) => void> },
onAfterChange: { type: Function as PropType<(value: Value) => void> },
onFocus: { type: Function as PropType<FocusEventHandler> },
onBlur: { type: Function as PropType<FocusEventHandler> },
'onUpdate:value': { type: Function as PropType<(value: Value) => void> },
});
export type SliderProps = Partial<ExtractPropTypes<ReturnType<typeof sliderProps>>>;
@ -77,7 +81,7 @@ const Slider = defineComponent({
name: 'ASlider',
inheritAttrs: false,
props: sliderProps(),
emits: ['update:value', 'change', 'afterChange', 'blur'],
// emits: ['update:value', 'change', 'afterChange', 'blur'],
slots: ['mark'],
setup(props, { attrs, slots, emit, expose }) {
const { prefixCls, rootPrefixCls, direction, getPopupContainer, configProvider } =
@ -173,7 +177,7 @@ const Slider = defineComponent({
step={restProps.step!}
draggableTrack={draggableTrack}
class={cls}
ref={ref}
ref={sliderRef}
handle={(info: HandleGeneratorInfo) =>
handleWithTooltip({
tooltipPrefixCls,
@ -183,6 +187,7 @@ const Slider = defineComponent({
}
prefixCls={prefixCls.value}
onChange={handleChange}
onBlur={handleBlur}
v-slots={{ mark: slots.mark }}
/>
);
@ -193,7 +198,7 @@ const Slider = defineComponent({
id={id}
step={restProps.step!}
class={cls}
ref={ref}
ref={sliderRef}
handle={(info: HandleGeneratorInfo) =>
handleWithTooltip({
tooltipPrefixCls,

8
components/space/index.tsx
View File

@ -14,7 +14,7 @@ const spaceSize = {
middle: 16,
large: 24,
};
export const spaceProps = {
export const spaceProps = () => ({
prefixCls: String,
size: {
type: [String, Number, Array] as PropType<SpaceSize | [SpaceSize, SpaceSize]>,
@ -22,9 +22,9 @@ export const spaceProps = {
direction: PropTypes.oneOf(tuple('horizontal', 'vertical')).def('horizontal'),
align: PropTypes.oneOf(tuple('start', 'end', 'center', 'baseline')),
wrap: { type: Boolean, default: undefined },
};
});
export type SpaceProps = Partial<ExtractPropTypes<typeof spaceProps>>;
export type SpaceProps = Partial<ExtractPropTypes<ReturnType<typeof spaceProps>>>;
function getNumberSize(size: SpaceSize) {
return typeof size === 'string' ? spaceSize[size] : size || 0;
@ -32,7 +32,7 @@ function getNumberSize(size: SpaceSize) {
const Space = defineComponent({
name: 'ASpace',
props: spaceProps,
props: spaceProps(),
slots: ['split'],
setup(props, { slots }) {
const { prefixCls, space, direction: directionConfig } = useConfigInject('space', props);

12
components/spin/Spin.tsx
View File

@ -1,19 +1,16 @@
import type { VNode, ExtractPropTypes } from 'vue';
import type { VNode, ExtractPropTypes, PropType } from 'vue';
import { inject, cloneVNode, isVNode, defineComponent, nextTick } from 'vue';
import debounce from 'lodash-es/debounce';
import { tuple } from '../_util/type';
import PropTypes from '../_util/vue-types';
import BaseMixin from '../_util/BaseMixin';
import { getComponent, getSlot } from '../_util/props-util';
import initDefaultProps from '../_util/props-util/initDefaultProps';
import { defaultConfigProvider } from '../config-provider';
export const SpinSize = PropTypes.oneOf(tuple('small', 'default', 'large'));
export type SpinSize = 'small' | 'default' | 'large';
export const spinProps = () => ({
prefixCls: String,
spinning: { type: Boolean, default: undefined },
size: SpinSize,
size: String as PropType<SpinSize>,
wrapperClassName: String,
tip: PropTypes.any,
delay: Number,
@ -36,7 +33,6 @@ export function setDefaultIndicator(Content: any) {
export default defineComponent({
name: 'ASpin',
mixins: [BaseMixin],
inheritAttrs: false,
props: initDefaultProps(spinProps(), {
size: 'default',
@ -83,7 +79,7 @@ export default defineComponent({
updateSpinning() {
const { spinning, sSpinning } = this;
if (sSpinning !== spinning) {
this.setState({ sSpinning: spinning });
this.sSpinning = spinning;
}
},
cancelExistingSpin() {

18
components/statistic/Countdown.tsx
View File

@ -1,4 +1,6 @@
import type { ExtractPropTypes, PropType } from 'vue';
import { defineComponent, onBeforeUnmount, onMounted, onUpdated, ref } from 'vue';
import omit from '../_util/omit';
import initDefaultProps from '../_util/props-util/initDefaultProps';
import Statistic, { statisticProps } from './Statistic';
import type { countdownValueType, FormatConfig } from './utils';
@ -9,13 +11,23 @@ const REFRESH_INTERVAL = 1000 / 30;
function getTime(value?: countdownValueType) {
return new Date(value as any).getTime();
}
export const countdownProps = () => {
return {
...statisticProps(),
value: [Number, String],
format: String,
onFinish: Function as PropType<() => void>,
onChange: Function as PropType<(value?: countdownValueType) => void>,
};
};
export type CountdownProps = Partial<ExtractPropTypes<ReturnType<typeof countdownProps>>>;
export default defineComponent({
name: 'AStatisticCountdown',
props: initDefaultProps(statisticProps, {
props: initDefaultProps(countdownProps(), {
format: 'HH:mm:ss',
}),
emits: ['finish', 'change'],
// emits: ['finish', 'change'],
setup(props, { emit, slots }) {
const countdownId = ref<any>();
const statistic = ref();
@ -80,7 +92,7 @@ export default defineComponent({
<Statistic
ref={statistic}
{...{
...props,
...omit(props, ['onFinish', 'onChange']),
valueRender: valueRenderHtml,
formatter: formatCountdown,
}}

9
components/statistic/Statistic.tsx
View File

@ -7,7 +7,7 @@ import type { countdownValueType } from './utils';
import Skeleton from '../skeleton/Skeleton';
import useConfigInject from '../_util/hooks/useConfigInject';
export const statisticProps = {
export const statisticProps = () => ({
prefixCls: String,
decimalSeparator: String,
groupSeparator: String,
@ -22,15 +22,14 @@ export const statisticProps = {
prefix: PropTypes.any,
suffix: PropTypes.any,
title: PropTypes.any,
onFinish: Function,
loading: { type: Boolean, default: undefined },
};
});
export type StatisticProps = Partial<ExtractPropTypes<typeof statisticProps>>;
export type StatisticProps = Partial<ExtractPropTypes<ReturnType<typeof statisticProps>>>;
export default defineComponent({
name: 'AStatistic',
props: initDefaultProps(statisticProps, {
props: initDefaultProps(statisticProps(), {
decimalSeparator: '.',
groupSeparator: ',',
loading: false,

2
components/steps/index.tsx
View File

@ -57,7 +57,7 @@ const Steps = defineComponent({
labelPlacement: 'horizontal',
}),
slots: ['progressDot'],
emits: ['update:current', 'change'],
// emits: ['update:current', 'change'],
setup(props, { attrs, slots, emit }) {
const { prefixCls, direction: rtlDirection, configProvider } = useConfigInject('steps', props);
const screens = useBreakpoint();

15
components/switch/index.tsx
View File

@ -10,10 +10,11 @@ import { getPropsSlot } from '../_util/props-util';
import useConfigInject from '../_util/hooks/useConfigInject';
import { useInjectFormItemContext } from '../form/FormItemContext';
import omit from '../_util/omit';
import type { FocusEventHandler } from '../_util/EventInterface';
export const SwitchSizes = tuple('small', 'default');
type CheckedType = boolean | string | number;
export const switchProps = {
export const switchProps = () => ({
id: String,
prefixCls: String,
size: PropTypes.oneOf(SwitchSizes),
@ -47,17 +48,19 @@ export const switchProps = {
'onUpdate:checked': {
type: Function as PropType<(checked: CheckedType) => void>,
},
};
onBlur: Function as PropType<FocusEventHandler>,
onFocus: Function as PropType<FocusEventHandler>,
});
export type SwitchProps = Partial<ExtractPropTypes<typeof switchProps>>;
export type SwitchProps = Partial<ExtractPropTypes<ReturnType<typeof switchProps>>>;
const Switch = defineComponent({
name: 'ASwitch',
__ANT_SWITCH: true,
inheritAttrs: false,
props: switchProps,
props: switchProps(),
slots: ['checkedChildren', 'unCheckedChildren'],
emits: ['update:checked', 'mouseup', 'change', 'click', 'keydown', 'blur'],
// emits: ['update:checked', 'mouseup', 'change', 'click', 'keydown', 'blur'],
setup(props, { attrs, slots, expose, emit }) {
const formItemContext = useInjectFormItemContext();
onBeforeMount(() => {
@ -158,6 +161,8 @@ const Switch = defineComponent({
'checkedValue',
'unCheckedValue',
'id',
'onChange',
'onUpdate:checked',
])}
{...attrs}
id={props.id ?? formItemContext.id.value}

2
components/tabs/src/TabNavList/OperationNode.tsx
View File

@ -14,7 +14,7 @@ import { EllipsisOutlined } from '@ant-design/icons-vue';
export const operationNodeProps = {
prefixCls: { type: String },
id: { type: String },
tabs: { type: Object as PropType<Tab[]> },
tabs: { type: Object as PropType<(Tab & { closeIcon?: () => any })[]> },
rtl: { type: Boolean },
tabBarGutter: { type: Number },
activeKey: { type: [String, Number] },

2
components/tabs/src/TabNavList/TabNode.tsx
View File

@ -25,7 +25,7 @@ export default defineComponent({
props: {
id: { type: String as PropType<string> },
prefixCls: { type: String as PropType<string> },
tab: { type: Object as PropType<Tab> },
tab: { type: Object as PropType<Tab & { closeIcon?: () => any }> },
active: { type: Boolean },
closable: { type: Boolean },
editable: { type: Object as PropType<EditableConfig> },

46
components/tabs/src/TabPanelList/TabPane.tsx
View File

@ -1,42 +1,30 @@
import { defineComponent, ref, watch, computed } from 'vue';
import type { CSSProperties } from 'vue';
import type { VueNode, Key } from '../../../_util/type';
import type { CSSProperties, ExtractPropTypes } from 'vue';
import PropTypes from '../../../_util/vue-types';
export interface TabPaneProps {
tab?: VueNode | (() => VueNode);
disabled?: boolean;
forceRender?: boolean;
closable?: boolean;
closeIcon?: () => VueNode;
const tabPaneProps = () => ({
tab: PropTypes.any,
disabled: { type: Boolean },
forceRender: { type: Boolean },
closable: { type: Boolean },
animated: { type: Boolean },
active: { type: Boolean },
destroyInactiveTabPane: { type: Boolean },
// Pass by TabPaneList
prefixCls?: string;
tabKey?: Key;
id?: string;
animated?: boolean;
active?: boolean;
destroyInactiveTabPane?: boolean;
}
prefixCls: { type: String },
tabKey: { type: [String, Number] },
id: { type: String },
// closeIcon: PropTypes.any,
});
export type TabPaneProps = Partial<ExtractPropTypes<ReturnType<typeof tabPaneProps>>>;
export default defineComponent({
name: 'ATabPane',
inheritAttrs: false,
__ANT_TAB_PANE: true,
props: {
tab: PropTypes.any,
disabled: { type: Boolean },
forceRender: { type: Boolean },
closable: { type: Boolean },
animated: { type: Boolean },
active: { type: Boolean },
destroyInactiveTabPane: { type: Boolean },
// Pass by TabPaneList
prefixCls: { type: String },
tabKey: { type: [String, Number] },
id: { type: String },
},
props: tabPaneProps(),
slots: ['closeIcon', 'tab'],
setup(props, { attrs, slots }) {
const visited = ref(props.forceRender);

20
components/tabs/src/Tabs.tsx
View File

@ -25,6 +25,8 @@ import { useProvideTabs } from './TabContext';
import type { Key } from '../../_util/type';
import pick from 'lodash-es/pick';
import PropTypes from '../../_util/vue-types';
import type { MouseEventHandler } from '../../_util/EventInterface';
import omit from '../../_util/omit';
export type TabsType = 'line' | 'card' | 'editable-card';
export type TabsPosition = 'top' | 'right' | 'bottom' | 'left';
@ -61,11 +63,11 @@ export const tabsProps = () => {
type: Function as PropType<(activeKey: Key, e: KeyboardEvent | MouseEvent) => void>,
},
onTabScroll: { type: Function as PropType<OnTabScroll> },
'onUpdate:activeKey': { type: Function as PropType<(activeKey: Key) => void> },
// Accessibility
locale: { type: Object as PropType<TabsLocale>, default: undefined as TabsLocale },
onPrevClick: Function,
onNextClick: Function,
onPrevClick: Function as PropType<MouseEventHandler>,
onNextClick: Function as PropType<MouseEventHandler>,
tabBarExtraContent: PropTypes.any,
};
};
@ -133,7 +135,7 @@ const InternalTabs = defineComponent({
'removeIcon',
'renderTabBar',
],
emits: ['tabClick', 'tabScroll', 'change', 'update:activeKey'],
// emits: ['tabClick', 'tabScroll', 'change', 'update:activeKey'],
setup(props, { attrs, slots }) {
devWarning(
!(props.onPrevClick !== undefined) && !(props.onNextClick !== undefined),
@ -343,7 +345,7 @@ export default defineComponent({
'removeIcon',
'renderTabBar',
],
emits: ['tabClick', 'tabScroll', 'change', 'update:activeKey'],
// emits: ['tabClick', 'tabScroll', 'change', 'update:activeKey'],
setup(props, { attrs, slots, emit }) {
const handleChange = (key: string) => {
emit('update:activeKey', key);
@ -352,7 +354,13 @@ export default defineComponent({
return () => {
const tabs = parseTabList(flattenChildren(slots.default?.()));
return (
<InternalTabs {...props} {...attrs} onChange={handleChange} tabs={tabs} v-slots={slots} />
<InternalTabs
{...omit(props, ['onUpdate:activeKey'])}
{...attrs}
onChange={handleChange}
tabs={tabs}
v-slots={slots}
/>
);
};
},

28
components/tag/CheckableTag.tsx
View File

@ -1,21 +1,25 @@
import type { PropType } from 'vue';
import type { ExtractPropTypes, PropType } from 'vue';
import { defineComponent, computed } from 'vue';
import classNames from '../_util/classNames';
import useConfigInject from '../_util/hooks/useConfigInject';
const checkableTagProps = () => ({
prefixCls: String,
checked: { type: Boolean, default: undefined },
onChange: {
type: Function as PropType<(checked: boolean) => void>,
},
onClick: {
type: Function as PropType<(e: MouseEvent) => void>,
},
'onUpdate:checked': Function as PropType<(checked: boolean) => void>,
});
export type CheckableTagProps = Partial<ExtractPropTypes<ReturnType<typeof checkableTagProps>>>;
const CheckableTag = defineComponent({
name: 'ACheckableTag',
props: {
prefixCls: String,
checked: { type: Boolean, default: undefined },
onChange: {
type: Function as PropType<(checked: boolean) => void>,
},
onClick: {
type: Function as PropType<(e: MouseEvent) => void>,
},
},
emits: ['update:checked', 'change', 'click'],
props: checkableTagProps(),
// emits: ['update:checked', 'change', 'click'],
setup(props, { slots, emit }) {
const { prefixCls } = useConfigInject('tag', props);
const handleClick = (e: MouseEvent) => {

11
components/tag/index.tsx
View File

@ -13,7 +13,7 @@ import useConfigInject from '../_util/hooks/useConfigInject';
const PresetColorRegex = new RegExp(`^(${PresetColorTypes.join('|')})(-inverse)?$`);
const PresetStatusColorRegex = new RegExp(`^(${PresetStatusColorTypes.join('|')})$`);
export const tagProps = {
export const tagProps = () => ({
prefixCls: String,
color: {
type: String as PropType<LiteralUnion<PresetColorType | PresetStatusColorType, string>>,
@ -24,15 +24,16 @@ export const tagProps = {
onClose: {
type: Function as PropType<(e: MouseEvent) => void>,
},
'onUpdate:visible': Function as PropType<(vis: boolean) => void>,
icon: PropTypes.any,
};
});
export type TagProps = HTMLAttributes & Partial<ExtractPropTypes<typeof tagProps>>;
export type TagProps = HTMLAttributes & Partial<ExtractPropTypes<ReturnType<typeof tagProps>>>;
const Tag = defineComponent({
name: 'ATag',
props: tagProps,
emits: ['update:visible', 'close'],
props: tagProps(),
// emits: ['update:visible', 'close'],
slots: ['closeIcon', 'icon'],
setup(props: TagProps, { slots, emit, attrs }) {
const { prefixCls, direction } = useConfigInject('tag', props);

10
components/time-picker/time-picker.tsx
View File

@ -19,7 +19,7 @@ export interface TimePickerLocale {
rangePlaceholder?: [string, string];
}
export const timePickerProps = {
export const timePickerProps = () => ({
format: String,
showNow: { type: Boolean, default: undefined },
showHour: { type: Boolean, default: undefined },
@ -31,7 +31,7 @@ export const timePickerProps = {
secondStep: Number,
hideDisabledOptions: { type: Boolean, default: undefined },
popupClassName: String,
};
});
export interface CommonTimePickerProps {
format?: string;
@ -64,7 +64,7 @@ function createTimePicker<
DTimeRangePickerProps extends TimeRangePickerProps<DateType> = TimeRangePickerProps<DateType>,
>(generateConfig: GenerateConfig<DateType>) {
const DatePicker = generatePicker<DateType>(generateConfig, {
...timePickerProps,
...timePickerProps(),
order: { type: Boolean, default: true },
});
@ -75,7 +75,7 @@ function createTimePicker<
props: {
...commonProps<DateType>(),
...datePickerProps<DateType>(),
...timePickerProps,
...timePickerProps(),
addon: { type: Function },
} as any,
slot: ['addon', 'renderExtraFooter', 'suffixIcon', 'clearIcon'],
@ -145,7 +145,7 @@ function createTimePicker<
props: {
...commonProps<DateType>(),
...rangePickerProps<DateType>(),
...timePickerProps,
...timePickerProps(),
order: { type: Boolean, default: true },
} as any,
slot: ['renderExtraFooter', 'suffixIcon', 'clearIcon'],

18
components/tooltip/Tooltip.tsx
View File

@ -7,7 +7,7 @@ import { PresetColorTypes } from '../_util/colors';
import warning from '../_util/warning';
import { getStyle, filterEmpty, isValidElement, initDefaultProps } from '../_util/props-util';
import { cloneElement } from '../_util/vnode';
import type { triggerTypes, placementTypes } from './abstractTooltipProps';
export type { TriggerType, TooltipPlacement } from './abstractTooltipProps';
import abstractTooltipProps from './abstractTooltipProps';
import useConfigInject from '../_util/hooks/useConfigInject';
import getPlacements from './placements';
@ -15,8 +15,6 @@ import firstNotUndefined from '../_util/firstNotUndefined';
import raf from '../_util/raf';
export type { AdjustOverflow, PlacementsConfig } from './placements';
export type TooltipPlacement = typeof placementTypes[number];
// https://github.com/react-component/tooltip
// https://github.com/yiminghe/dom-align
export interface TooltipAlignConfig {
@ -48,20 +46,16 @@ export const tooltipProps = () => ({
title: PropTypes.any,
});
export const tooltipDefaultProps = {
export const tooltipDefaultProps = () => ({
trigger: 'hover',
transitionName: 'zoom-big-fast',
align: () => ({}),
align: {},
placement: 'top',
mouseEnterDelay: 0.1,
mouseLeaveDelay: 0.1,
arrowPointAtCenter: false,
autoAdjustOverflow: true,
};
export type TriggerTypes = typeof triggerTypes[number];
export type PlacementTypes = typeof placementTypes[number];
});
export type TooltipProps = Partial<ExtractPropTypes<ReturnType<typeof tooltipProps>>>;
@ -71,7 +65,7 @@ export default defineComponent({
props: initDefaultProps(tooltipProps(), {
trigger: 'hover',
transitionName: 'zoom-big-fast',
align: () => ({}),
align: {},
placement: 'top',
mouseEnterDelay: 0.1,
mouseLeaveDelay: 0.1,
@ -79,7 +73,7 @@ export default defineComponent({
autoAdjustOverflow: true,
}),
slots: ['title'],
emits: ['update:visible', 'visibleChange'],
// emits: ['update:visible', 'visibleChange'],
setup(props, { slots, emit, attrs, expose }) {
const { prefixCls, getTargetContainer } = useConfigInject('tooltip', props);

63
components/tooltip/abstractTooltipProps.ts
View File

@ -1,31 +1,27 @@
import PropTypes from '../_util/vue-types';
import { tuple } from '../_util/type';
import type { CSSProperties, PropType } from 'vue';
export const triggerTypes = tuple('hover', 'focus', 'click', 'contextmenu');
import type { AlignType, BuildInPlacements } from '../vc-trigger/interface';
import type { AdjustOverflow } from './placements';
export type TriggerType = 'hover' | 'focus' | 'click' | 'contextmenu';
export const placementTypes = tuple(
'top',
'left',
'right',
'bottom',
'topLeft',
'topRight',
'bottomLeft',
'bottomRight',
'leftTop',
'leftBottom',
'rightTop',
'rightBottom',
);
export type TooltipPlacement =
| 'top'
| 'left'
| 'right'
| 'bottom'
| 'topLeft'
| 'topRight'
| 'bottomLeft'
| 'bottomRight'
| 'leftTop'
| 'leftBottom'
| 'rightTop'
| 'rightBottom';
export default () => ({
trigger: PropTypes.oneOfType([
PropTypes.oneOf(triggerTypes),
PropTypes.arrayOf(PropTypes.oneOf(triggerTypes)),
]),
trigger: [String, Array] as PropType<TriggerType | TriggerType[]>,
visible: { type: Boolean, default: undefined },
defaultVisible: { type: Boolean, default: undefined },
placement: PropTypes.oneOf(placementTypes),
placement: String as PropType<TooltipPlacement>,
color: String,
transitionName: String,
overlayStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
@ -34,13 +30,22 @@ export default () => ({
prefixCls: String,
mouseEnterDelay: Number,
mouseLeaveDelay: Number,
getPopupContainer: Function,
getPopupContainer: Function as PropType<(triggerNode: HTMLElement) => HTMLElement>,
arrowPointAtCenter: { type: Boolean, default: undefined },
autoAdjustOverflow: PropTypes.oneOfType([PropTypes.looseBool, PropTypes.object]),
autoAdjustOverflow: {
type: [Boolean, Object] as PropType<boolean | AdjustOverflow>,
default: undefined as boolean | AdjustOverflow,
},
destroyTooltipOnHide: { type: Boolean, default: undefined },
align: PropTypes.object,
builtinPlacements: PropTypes.object,
children: PropTypes.array,
onVisibleChange: Function,
'onUpdate:visible': Function,
align: {
type: Object as PropType<AlignType>,
default: undefined as AlignType,
},
builtinPlacements: {
type: Object as PropType<BuildInPlacements>,
default: undefined as BuildInPlacements,
},
children: Array,
onVisibleChange: Function as PropType<(vis: boolean) => void>,
'onUpdate:visible': Function as PropType<(vis: boolean) => void>,
});

2
components/tooltip/index.ts
View File

@ -6,7 +6,7 @@ export type {
AdjustOverflow,
PlacementsConfig,
TooltipAlignConfig,
PlacementTypes,
TooltipPlacement,
} from './Tooltip';
export { tooltipProps };

26
components/transfer/index.tsx
View File

@ -64,7 +64,7 @@ export interface TransferLocale {
removeCurrent: string;
}
export const transferProps = {
export const transferProps = () => ({
id: String,
prefixCls: String,
dataSource: { type: Array as PropType<TransferItem[]>, default: [] },
@ -90,14 +90,24 @@ export const transferProps = {
children: { type: Function as PropType<(props: TransferListBodyProps) => VueNode> },
oneWay: { type: Boolean, default: undefined },
pagination: { type: [Object, Boolean] as PropType<PaginationType>, default: undefined },
};
onChange: Function as PropType<
(targetKeys: string[], direction: TransferDirection, moveKeys: string[]) => void
>,
onSelectChange: Function as PropType<
(sourceSelectedKeys: string[], targetSelectedKeys: string[]) => void
>,
onSearch: Function as PropType<(direction: TransferDirection, value: string) => void>,
onScroll: Function as PropType<(direction: TransferDirection, e: UIEvent) => void>,
'onUpdate:targetKeys': Function as PropType<(keys: string[]) => void>,
'onUpdate:selectedKeys': Function as PropType<(keys: string[]) => void>,
});
export type TransferProps = Partial<ExtractPropTypes<typeof transferProps>>;
export type TransferProps = Partial<ExtractPropTypes<ReturnType<typeof transferProps>>>;
const Transfer = defineComponent({
name: 'ATransfer',
inheritAttrs: false,
props: transferProps,
props: transferProps(),
slots: [
'leftTitle',
'rightTitle',
@ -108,7 +118,7 @@ const Transfer = defineComponent({
'rightSelectAllLabel',
'footer',
],
emits: ['update:targetKeys', 'update:selectedKeys', 'change', 'search', 'scroll', 'selectChange'],
// emits: ['update:targetKeys', 'update:selectedKeys', 'change', 'search', 'scroll', 'selectChange'],
setup(props, { emit, attrs, slots, expose }) {
const { configProvider, prefixCls, direction } = useConfigInject('transfer', props);
const sourceSelectedKeys = ref([]);
@ -249,14 +259,14 @@ const Transfer = defineComponent({
emit('change', newTargetKeys, 'left', [...targetedKeys]);
};
const handleScroll = (direction: TransferDirection, e: Event) => {
const handleScroll = (direction: TransferDirection, e: UIEvent) => {
emit('scroll', direction, e);
};
const handleLeftScroll = (e: Event) => {
const handleLeftScroll = (e: UIEvent) => {
handleScroll('left', e);
};
const handleRightScroll = (e: Event) => {
const handleRightScroll = (e: UIEvent) => {
handleScroll('right', e);
};
const handleListStyle = (

2
components/transfer/list.tsx
View File

@ -65,7 +65,7 @@ export default defineComponent({
name: 'TransferList',
inheritAttrs: false,
props: transferListProps,
emits: ['scroll', 'itemSelectAll', 'itemRemove', 'itemSelect'],
// emits: ['scroll', 'itemSelectAll', 'itemRemove', 'itemSelect'],
slots: ['footer', 'titleText'],
setup(props, { attrs, slots }) {
const filterValue = ref('');

30
components/tree/DirectoryTree.tsx
View File

@ -21,12 +21,12 @@ import { filterEmpty } from '../_util/props-util';
export type ExpandAction = false | 'click' | 'doubleclick' | 'dblclick';
export const directoryTreeProps = {
export const directoryTreeProps = () => ({
...treeProps(),
expandAction: { type: [Boolean, String] as PropType<ExpandAction> },
};
});
export type DirectoryTreeProps = Partial<ExtractPropTypes<typeof directoryTreeProps>>;
export type DirectoryTreeProps = Partial<ExtractPropTypes<ReturnType<typeof directoryTreeProps>>>;
function getIcon(props: AntdTreeNodeAttribute) {
const { isLeaf, expanded } = props;
@ -39,22 +39,22 @@ function getIcon(props: AntdTreeNodeAttribute) {
export default defineComponent({
name: 'ADirectoryTree',
inheritAttrs: false,
props: initDefaultProps(directoryTreeProps, {
props: initDefaultProps(directoryTreeProps(), {
showIcon: true,
expandAction: 'click',
}),
slots: ['icon', 'title', 'switcherIcon', 'titleRender'],
emits: [
'update:selectedKeys',
'update:checkedKeys',
'update:expandedKeys',
'expand',
'select',
'check',
'doubleclick',
'dblclick',
'click',
],
// emits: [
// 'update:selectedKeys',
// 'update:checkedKeys',
// 'update:expandedKeys',
// 'expand',
// 'select',
// 'check',
// 'doubleclick',
// 'dblclick',
// 'click',
// ],
setup(props, { attrs, slots, emit, expose }) {
// convertTreeToData 兼容 a-tree-node 历史写法，未来a-tree-node移除后，删除相关代码，不要再render中调用 treeData，否则死循环
const treeData = ref<DataNode[]>(

38
components/tree/Tree.tsx
View File

@ -13,6 +13,7 @@ import renderSwitcherIcon from './utils/iconUtil';
import dropIndicatorRender from './utils/dropIndicator';
import devWarning from '../vc-util/devWarning';
import { warning } from '../vc-util/warning';
import omit from '../_util/omit';
export interface AntdTreeNodeAttribute {
eventKey: string;
@ -79,8 +80,9 @@ export interface AntTreeNodeDropEvent {
}
export const treeProps = () => {
const baseTreeProps = vcTreeProps();
return {
...vcTreeProps(),
...baseTreeProps,
showLine: {
type: [Boolean, Object] as PropType<boolean | { showLeafIcon: boolean }>,
default: undefined,
@ -129,6 +131,10 @@ export const treeProps = () => {
replaceFields: { type: Object as PropType<FieldNames> },
blockNode: { type: Boolean, default: undefined },
openAnimation: PropTypes.any,
onDoubleclick: baseTreeProps.onDblclick,
'onUpdate:selectedKeys': Function as PropType<(keys: Key[]) => void>,
'onUpdate:checkedKeys': Function as PropType<(keys: Key[]) => void>,
'onUpdate:expandedKeys': Function as PropType<(keys: Key[]) => void>,
};
};
@ -144,16 +150,16 @@ export default defineComponent({
blockNode: false,
}),
slots: ['icon', 'title', 'switcherIcon', 'titleRender'],
emits: [
'update:selectedKeys',
'update:checkedKeys',
'update:expandedKeys',
'expand',
'select',
'check',
'doubleclick',
'dblclick',
],
// emits: [
// 'update:selectedKeys',
// 'update:checkedKeys',
// 'update:expandedKeys',
// 'expand',
// 'select',
// 'check',
// 'doubleclick',
// 'dblclick',
// ],
setup(props, { attrs, expose, emit, slots }) {
warning(
!(props.treeData === undefined && slots.default),
@ -206,10 +212,17 @@ export default defineComponent({
fieldNames = props.replaceFields,
motion = props.openAnimation,
itemHeight = 28,
onDoubleclick,
onDblclick,
} = props as TreeProps;
const newProps = {
...attrs,
...props,
...omit(props, [
'onUpdate:checkedKeys',
'onUpdate:expandedKeys',
'onUpdate:selectedKeys',
'onDoubleclick',
]),
showLine: Boolean(showLine),
dropIndicatorRender,
fieldNames,
@ -242,6 +255,7 @@ export default defineComponent({
onCheck={handleCheck}
onExpand={handleExpand}
onSelect={handleSelect}
onDblclick={onDblclick || onDoubleclick}
v-slots={{
...slots,
checkable: () => <span class={`${prefixCls.value}-checkbox-inner`} />,

56
components/typography/Base.tsx
View File

@ -5,7 +5,6 @@ import raf from '../_util/raf';
import { isStyleSupport } from '../_util/styleChecker';
import Editable from './Editable';
import measure from './util';
import PropTypes from '../_util/vue-types';
import type { TypographyProps } from './Typography';
import Typography from './Typography';
import ResizeObserver from '../vc-resize-observer';
@ -14,7 +13,7 @@ import copy from '../_util/copy-to-clipboard';
import CheckOutlined from '@ant-design/icons-vue/CheckOutlined';
import CopyOutlined from '@ant-design/icons-vue/CopyOutlined';
import EditOutlined from '@ant-design/icons-vue/EditOutlined';
import type { VNodeTypes, CSSProperties } from 'vue';
import type { VNodeTypes, CSSProperties, PropType, HTMLAttributes } from 'vue';
import {
defineComponent,
reactive,
@ -95,10 +94,38 @@ interface InternalBlockProps extends BlockProps {
const ELLIPSIS_STR = '...';
const Base = defineComponent<InternalBlockProps>({
export const baseProps = () => ({
editable: {
type: [Boolean, Object] as PropType<InternalBlockProps['editable']>,
default: undefined as InternalBlockProps['editable'],
},
copyable: {
type: [Boolean, Object] as PropType<InternalBlockProps['copyable']>,
default: undefined as InternalBlockProps['copyable'],
},
prefixCls: String,
component: String,
type: String as PropType<BaseType>,
disabled: { type: Boolean, default: undefined },
ellipsis: {
type: [Boolean, Object] as PropType<InternalBlockProps['ellipsis']>,
default: undefined as InternalBlockProps['ellipsis'],
},
code: { type: Boolean, default: undefined },
mark: { type: Boolean, default: undefined },
underline: { type: Boolean, default: undefined },
delete: { type: Boolean, default: undefined },
strong: { type: Boolean, default: undefined },
keyboard: { type: Boolean, default: undefined },
content: String,
'onUpdate:content': Function as PropType<(content: string) => void>,
});
const Base = defineComponent({
name: 'Base',
inheritAttrs: false,
emits: ['update:content'],
props: baseProps(),
// emits: ['update:content'],
setup(props, { slots, attrs, emit }) {
const { prefixCls, direction } = useConfigInject('typography', props);
@ -466,7 +493,7 @@ const Base = defineComponent<InternalBlockProps>({
...restProps
} = {
...props,
...attrs,
...(attrs as HTMLAttributes),
};
const { rows, suffix, tooltip } = ellipsis.value;
@ -488,6 +515,7 @@ const Base = defineComponent<InternalBlockProps>({
'underline',
'strong',
'keyboard',
'onUpdate:content',
]);
const cssEllipsis = canUseCSSEllipsis.value;
@ -574,22 +602,4 @@ const Base = defineComponent<InternalBlockProps>({
},
});
export const baseProps = () => ({
editable: PropTypes.oneOfType([PropTypes.looseBool, PropTypes.object]),
copyable: PropTypes.oneOfType([PropTypes.looseBool, PropTypes.object]),
prefixCls: String,
component: String,
type: PropTypes.oneOf(['secondary', 'success', 'danger', 'warning']),
disabled: { type: Boolean, default: undefined },
ellipsis: PropTypes.oneOfType([PropTypes.looseBool, PropTypes.object]),
code: { type: Boolean, default: undefined },
mark: { type: Boolean, default: undefined },
underline: { type: Boolean, default: undefined },
delete: { type: Boolean, default: undefined },
strong: { type: Boolean, default: undefined },
keyboard: { type: Boolean, default: undefined },
content: String,
});
Base.props = baseProps();
export default Base;

35
components/typography/Editable.tsx
View File

@ -1,26 +1,29 @@
import KeyCode from '../_util/KeyCode';
import PropTypes from '../_util/vue-types';
import TextArea from '../input/TextArea';
import EnterOutlined from '@ant-design/icons-vue/EnterOutlined';
import type { PropType } from 'vue';
import type { ExtractPropTypes, PropType } from 'vue';
import { defineComponent, ref, reactive, watch, onMounted, computed } from 'vue';
import type { Direction } from '../config-provider';
import type { ChangeEventHandler } from '../_util/EventInterface';
import type { AutoSizeType } from '../input/inputProps';
const editableProps = () => ({
prefixCls: String,
value: String,
maxlength: Number,
autoSize: { type: [Boolean, Object] as PropType<boolean | AutoSizeType> },
onSave: Function as PropType<(val: string) => void>,
onCancel: Function as PropType<() => void>,
onEnd: Function as PropType<() => void>,
onChange: Function as PropType<(val: string) => void>,
originContent: String,
direction: String as PropType<Direction>,
});
export type EditableProps = Partial<ExtractPropTypes<ReturnType<typeof editableProps>>>;
const Editable = defineComponent({
name: 'Editable',
props: {
prefixCls: String,
value: String,
maxlength: Number,
autoSize: PropTypes.oneOfType([PropTypes.looseBool, PropTypes.object]),
onSave: Function,
onCancel: Function,
onEnd: Function,
onChange: Function,
originContent: String,
direction: String as PropType<Direction>,
},
emits: ['save', 'cancel', 'end', 'change'],
props: editableProps(),
// emits: ['save', 'cancel', 'end', 'change'],
setup(props, { emit, slots }) {
const state = reactive({
current: props.value || '',
@ -116,7 +119,7 @@ const Editable = defineComponent({
ref={saveTextAreaRef}
maxlength={props.maxlength}
value={state.current}
onChange={onChange}
onChange={onChange as ChangeEventHandler}
onKeydown={onKeyDown}
onKeyup={onKeyUp}
onCompositionstart={onCompositionStart}

14
components/typography/Link.tsx
View File

@ -1,13 +1,13 @@
import type { AnchorHTMLAttributes, FunctionalComponent } from 'vue';
import type { AnchorHTMLAttributes, ExtractPropTypes, FunctionalComponent } from 'vue';
import warning from '../_util/warning';
import type { BlockProps } from './Base';
import Base, { baseProps } from './Base';
import PropTypes from '../_util/vue-types';
import omit from '../_util/omit';
export interface LinkProps extends BlockProps, Omit<AnchorHTMLAttributes, 'type'> {
ellipsis?: boolean;
}
export const linkProps = () =>
omit({ ...baseProps(), ellipsis: { type: Boolean, default: undefined } }, ['component']);
export type LinkProps = Partial<ExtractPropTypes<ReturnType<typeof linkProps>>> &
AnchorHTMLAttributes;
const Link: FunctionalComponent<LinkProps> = (props, { slots, attrs }) => {
const { ellipsis, rel, ...restProps } = { ...props, ...attrs };
@ -31,6 +31,6 @@ const Link: FunctionalComponent<LinkProps> = (props, { slots, attrs }) => {
Link.displayName = 'ATypographyLink';
Link.inheritAttrs = false;
Link.props = omit({ ...baseProps(), ellipsis: PropTypes.looseBool }, ['component']) as any;
Link.props = linkProps();
export default Link;

11
components/typography/Paragraph.tsx
View File

@ -1,9 +1,12 @@
import type { FunctionalComponent } from 'vue';
import type { ExtractPropTypes, FunctionalComponent } from 'vue';
import omit from '../_util/omit';
import type { BlockProps } from './Base';
import Base, { baseProps } from './Base';
const Paragraph: FunctionalComponent<BlockProps> = (props, { slots, attrs }) => {
export const paragraphProps = () => omit(baseProps(), ['component']);
export type ParagraphProps = Partial<ExtractPropTypes<ReturnType<typeof paragraphProps>>>;
const Paragraph: FunctionalComponent<ParagraphProps> = (props, { slots, attrs }) => {
const paragraphProps = {
...props,
component: 'div',
@ -15,6 +18,6 @@ const Paragraph: FunctionalComponent<BlockProps> = (props, { slots, attrs }) =>
Paragraph.displayName = 'ATypographyParagraph';
Paragraph.inheritAttrs = false;
Paragraph.props = omit(baseProps(), ['component']) as any;
Paragraph.props = paragraphProps();
export default Paragraph;

20
components/typography/Text.tsx
View File

@ -1,12 +1,20 @@
import type { FunctionalComponent } from 'vue';
import type { ExtractPropTypes, FunctionalComponent, PropType } from 'vue';
import omit from '../_util/omit';
import warning from '../_util/warning';
import type { BlockProps, EllipsisConfig } from './Base';
import type { EllipsisConfig } from './Base';
import Base, { baseProps } from './Base';
export interface TextProps extends BlockProps {
ellipsis?: boolean | Omit<EllipsisConfig, 'expandable' | 'rows' | 'onExpand'>;
}
export const textProps = () => ({
...omit(baseProps(), ['component']),
ellipsis: {
type: [Boolean, Object] as PropType<
boolean | Omit<EllipsisConfig, 'expandable' | 'rows' | 'onExpand'>
>,
default: undefined as boolean | Omit<EllipsisConfig, 'expandable' | 'rows' | 'onExpand'>,
},
});
export type TextProps = Partial<ExtractPropTypes<ReturnType<typeof textProps>>>;
const Text: FunctionalComponent<TextProps> = (props, { slots, attrs }) => {
const { ellipsis } = props;
@ -31,6 +39,6 @@ const Text: FunctionalComponent<TextProps> = (props, { slots, attrs }) => {
Text.displayName = 'ATypographyText';
Text.inheritAttrs = false;
Text.props = omit(baseProps(), ['component']) as any;
Text.props = textProps();
export default Text;

13
components/typography/Title.tsx
View File

@ -1,14 +1,17 @@
import type { FunctionalComponent } from 'vue';
import type { ExtractPropTypes, FunctionalComponent, PropType } from 'vue';
import omit from '../_util/omit';
import { tupleNum } from '../_util/type';
import PropTypes from '../_util/vue-types';
import warning from '../_util/warning';
import type { BlockProps } from './Base';
import Base, { baseProps } from './Base';
const TITLE_ELE_LIST = tupleNum(1, 2, 3, 4, 5);
export type TitleProps = Omit<BlockProps & { level?: typeof TITLE_ELE_LIST[number] }, 'strong'>;
export const titleProps = () => ({
...omit(baseProps(), ['component', 'strong']),
level: Number as PropType<typeof TITLE_ELE_LIST[number]>,
});
export type TitleProps = Partial<ExtractPropTypes<ReturnType<typeof titleProps>>>;
const Title: FunctionalComponent<TitleProps> = (props, { slots, attrs }) => {
const { level = 1, ...restProps } = props;
@ -31,6 +34,6 @@ const Title: FunctionalComponent<TitleProps> = (props, { slots, attrs }) => {
Title.displayName = 'ATypographyTitle';
Title.inheritAttrs = false;
Title.props = omit({ ...baseProps(), level: PropTypes.number }, ['component', 'strong']) as any;
Title.props = titleProps();
export default Title;

15
components/typography/Typography.tsx
View File

@ -1,4 +1,4 @@
import type { HTMLAttributes } from 'vue';
import type { HTMLAttributes, PropType } from 'vue';
import { defineComponent } from 'vue';
import useConfigInject from '../_util/hooks/useConfigInject';
import classNames from '../_util/classNames';
@ -12,10 +12,16 @@ export interface TypographyProps extends HTMLAttributes {
export interface InternalTypographyProps extends TypographyProps {
component?: string;
}
export const typographyProps = () => ({
prefixCls: String,
direction: String as PropType<Direction>,
// Form Internal use
component: String,
});
const Typography = defineComponent<InternalTypographyProps>({
name: 'ATypography',
inheritAttrs: false,
props: typographyProps() as any,
setup(props, { slots, attrs }) {
const { prefixCls, direction } = useConfigInject('typography', props);
return () => {
@ -42,9 +48,4 @@ const Typography = defineComponent<InternalTypographyProps>({
},
});
Typography.props = {
prefixCls: String,
component: String,
};
export default Typography;

2
components/vc-dialog/Dialog.tsx
View File

@ -70,7 +70,7 @@ export default defineComponent({
}
};
const onInternalClose = (e: Event) => {
const onInternalClose = (e: MouseEvent | KeyboardEvent) => {
props.onClose?.(e);
};

5
components/vc-dialog/IDialogPropTypes.ts
View File

@ -1,5 +1,4 @@
import type { CSSProperties, ExtractPropTypes, PropType } from 'vue';
import type { MouseEventHandler } from '../_util/EventInterface';
import PropTypes from '../_util/vue-types';
function dialogPropTypes() {
@ -37,11 +36,11 @@ function dialogPropTypes() {
dialogClass: String,
closeIcon: PropTypes.any,
forceRender: { type: Boolean, default: undefined },
getOpenCount: Function,
getOpenCount: Function as PropType<() => number>,
// https://github.com/ant-design/ant-design/issues/19771
// https://github.com/react-component/dialog/issues/95
focusTriggerAfterClose: { type: Boolean, default: undefined },
onClose: Function as PropType<MouseEventHandler>,
onClose: Function as PropType<(e: MouseEvent | KeyboardEvent) => void>,
modalRender: Function,
};
}

2
components/vc-drawer/src/IDrawerPropTypes.ts
View File

@ -48,7 +48,7 @@ const drawerProps = () => ({
const drawerChildProps = () => ({
...props(),
getContainer: Function,
getOpenCount: Function,
getOpenCount: Function as PropType<() => number>,
scrollLocker: PropTypes.any,
switchScrollingEffect: Function,
});

4
components/vc-select/SelectTrigger.tsx
View File

@ -1,7 +1,7 @@
import Trigger from '../vc-trigger';
import PropTypes from '../_util/vue-types';
import classNames from '../_util/classNames';
import type { CSSProperties } from 'vue';
import type { CSSProperties, PropType } from 'vue';
import { computed, ref, defineComponent } from 'vue';
import type { VueNode } from '../_util/type';
import type { DropdownRender, Placement, RenderDOMFunc } from './BaseSelect';
@ -102,7 +102,7 @@ const SelectTrigger = defineComponent<SelectTriggerProps, { popupRef: any }>({
popupElement: PropTypes.any,
direction: String,
getTriggerDOMNode: Function,
onPopupVisibleChange: Function,
onPopupVisibleChange: Function as PropType<(open: boolean) => void>,
onPopupMouseEnter: Function,
} as any,
setup(props, { slots, attrs, expose }) {

7
components/vc-select/TransBtn.tsx
View File

@ -1,4 +1,5 @@
import type { FunctionalComponent } from 'vue';
import type { FunctionalComponent, PropType } from 'vue';
import type { MouseEventHandler } from '../_util/EventInterface';
import type { VueNode } from '../_util/type';
import PropTypes from '../_util/vue-types';
import type { RenderNode } from './BaseSelect';
@ -59,8 +60,8 @@ TransBtn.props = {
class: String,
customizeIcon: PropTypes.any,
customizeIconProps: PropTypes.any,
onMousedown: Function,
onClick: Function,
onMousedown: Function as PropType<MouseEventHandler>,
onClick: Function as PropType<MouseEventHandler>,
};
export default TransBtn;

2
components/vc-tooltip/src/Tooltip.tsx
View File

@ -121,7 +121,7 @@ export default defineComponent({
mouseEnterDelay,
...extraProps,
...attrs,
onPopupVisibleChange: props.onVisibleChange || noop,
onPopupVisibleChange: props.onVisibleChange || (noop as any),
onPopupAlign: props.onPopupAlign || noop,
ref: triggerDOM,
popup: getPopupElement(),

2
components/vc-trigger/Trigger.tsx
View File

@ -53,7 +53,7 @@ export default defineComponent({
showAction: PropTypes.any.def([]),
hideAction: PropTypes.any.def([]),
getPopupClassNameFromAlign: PropTypes.any.def(returnEmptyString),
onPopupVisibleChange: PropTypes.func.def(noop),
onPopupVisibleChange: Function as PropType<(open: boolean) => void>,
afterPopupVisibleChange: PropTypes.func.def(noop),
popup: PropTypes.any,
popupStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },