Skip to content

Commit 55b9ab5

Browse files
committed
feat: update ts type
1 parent a7f2793 commit 55b9ab5

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

57 files changed

+224
-184
lines changed

components/avatar/Group.tsx

+1-4
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,7 @@ import useProvideSize from '../_util/hooks/useSize';
1111
export const groupProps = () => ({
1212
prefixCls: String,
1313
maxCount: Number,
14-
maxStyle: {
15-
type: Object as PropType<CSSProperties>,
16-
default: undefined as CSSProperties,
17-
},
14+
maxStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
1815
maxPopoverPlacement: { type: String as PropType<'top' | 'bottom'>, default: 'top' },
1916
maxPopoverTrigger: String as PropType<'hover' | 'focus' | 'click'>,
2017
/*

components/badge/Badge.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export const badgeProps = () => ({
2727
color: String,
2828
text: PropTypes.any,
2929
offset: Array as unknown as PropType<[number | string, number | string]>,
30-
numberStyle: Object as PropType<CSSProperties>,
30+
numberStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
3131
title: String,
3232
});
3333

components/card/Card.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { VNodeTypes, PropType, VNode, ExtractPropTypes } from 'vue';
1+
import type { VNodeTypes, PropType, VNode, ExtractPropTypes, CSSProperties } from 'vue';
22
import { isVNode, defineComponent, renderSlot } from 'vue';
33
import Tabs from '../tabs';
44
import Row from '../row';
@@ -27,11 +27,11 @@ export const cardProps = () => ({
2727
prefixCls: String,
2828
title: PropTypes.any,
2929
extra: PropTypes.any,
30-
bordered: PropTypes.looseBool.def(true),
31-
bodyStyle: PropTypes.style,
32-
headStyle: PropTypes.style,
33-
loading: PropTypes.looseBool.def(false),
34-
hoverable: PropTypes.looseBool.def(false),
30+
bordered: { type: Boolean, default: true },
31+
bodyStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
32+
headStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
33+
loading: { type: Boolean, default: false },
34+
hoverable: { type: Boolean, default: false },
3535
type: { type: String as PropType<CardType> },
3636
size: { type: String as PropType<CardSize> },
3737
actions: PropTypes.any,

components/card/Grid.tsx

+7-4
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,16 @@
1+
import type { ExtractPropTypes } from 'vue';
12
import { defineComponent, computed } from 'vue';
23
import useConfigInject from '../_util/hooks/useConfigInject';
34

5+
export const cardGridProps = () => ({
6+
prefixCls: String,
7+
hoverable: { type: Boolean, default: true },
8+
});
9+
export type CardGridProps = Partial<ExtractPropTypes<ReturnType<typeof cardGridProps>>>;
410
export default defineComponent({
511
name: 'ACardGrid',
612
__ANT_CARD_GRID: true,
7-
props: {
8-
prefixCls: String,
9-
hoverable: { type: Boolean, default: true },
10-
},
13+
props: cardGridProps(),
1114
setup(props, { slots }) {
1215
const { prefixCls } = useConfigInject('card', props);
1316
const classNames = computed(() => {

components/card/Meta.tsx

+9-6
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,19 @@
1+
import type { ExtractPropTypes } from 'vue';
12
import { defineComponent } from 'vue';
23
import PropTypes from '../_util/vue-types';
34
import { getPropsSlot } from '../_util/props-util';
45
import useConfigInject from '../_util/hooks/useConfigInject';
56

7+
export const cardMetaProps = () => ({
8+
prefixCls: String,
9+
title: PropTypes.any,
10+
description: PropTypes.any,
11+
avatar: PropTypes.any,
12+
});
13+
export type CardGridProps = Partial<ExtractPropTypes<ReturnType<typeof cardMetaProps>>>;
614
export default defineComponent({
715
name: 'ACardMeta',
8-
props: {
9-
prefixCls: String,
10-
title: PropTypes.any,
11-
description: PropTypes.any,
12-
avatar: PropTypes.any,
13-
},
16+
props: cardMetaProps(),
1417
slots: ['title', 'description', 'avatar'],
1518
setup(props, { slots }) {
1619
const { prefixCls } = useConfigInject('card', props);

components/checkbox/Checkbox.tsx

+3-4
Original file line numberDiff line numberDiff line change
@@ -3,20 +3,19 @@ import classNames from '../_util/classNames';
33
import VcCheckbox from '../vc-checkbox/Checkbox';
44
import { flattenChildren } from '../_util/props-util';
55
import warning from '../_util/warning';
6-
import type { RadioChangeEvent } from '../radio/interface';
76
import type { EventHandler } from '../_util/EventInterface';
87
import { useInjectFormItemContext } from '../form/FormItemContext';
98
import useConfigInject from '../_util/hooks/useConfigInject';
109

11-
import type { CheckboxProps } from './interface';
10+
import type { CheckboxChangeEvent, CheckboxProps } from './interface';
1211
import { CheckboxGroupContextKey, checkboxProps } from './interface';
1312

1413
export default defineComponent({
1514
name: 'ACheckbox',
1615
inheritAttrs: false,
1716
__ANT_CHECKBOX: true,
1817
props: checkboxProps(),
19-
emits: ['change', 'update:checked'],
18+
// emits: ['change', 'update:checked'],
2019
setup(props, { emit, attrs, slots, expose }) {
2120
const formItemContext = useInjectFormItemContext();
2221
const { prefixCls, direction } = useConfigInject('checkbox', props);
@@ -41,7 +40,7 @@ export default defineComponent({
4140
);
4241
});
4342

44-
const handleChange = (event: RadioChangeEvent) => {
43+
const handleChange = (event: CheckboxChangeEvent) => {
4544
const targetChecked = event.target.checked;
4645
emit('update:checked', targetChecked);
4746
emit('change', event);

components/checkbox/Group.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { CheckboxGroupContextKey, checkboxGroupProps } from './interface';
88
export default defineComponent({
99
name: 'ACheckboxGroup',
1010
props: checkboxGroupProps(),
11-
emits: ['change', 'update:value'],
11+
// emits: ['change', 'update:value'],
1212
setup(props, { slots, emit, expose }) {
1313
const formItemContext = useInjectFormItemContext();
1414
const { prefixCls, direction } = useConfigInject('checkbox', props);

components/checkbox/interface.ts

+16-4
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import type { ExtractPropTypes, InjectionKey, PropType, Ref } from 'vue';
2+
import type { MouseEventHandler } from '../_util/EventInterface';
23
import type { VueNode } from '../_util/type';
34
import PropTypes from '../_util/vue-types';
45

@@ -8,7 +9,18 @@ export interface CheckboxOptionType {
89
value: CheckboxValueType;
910
disabled?: boolean;
1011
indeterminate?: boolean;
11-
onChange?: (e: Event) => void;
12+
onChange?: (e: CheckboxChangeEvent) => void;
13+
}
14+
15+
export interface CheckboxChangeEvent {
16+
target: CheckboxChangeEventTarget;
17+
stopPropagation: () => void;
18+
preventDefault: () => void;
19+
nativeEvent: MouseEvent;
20+
}
21+
22+
export interface CheckboxChangeEventTarget extends CheckboxProps {
23+
checked: boolean;
1224
}
1325

1426
export const abstractCheckboxGroupProps = () => {
@@ -51,9 +63,9 @@ export const abstractCheckboxProps = () => {
5163
indeterminate: { type: Boolean, default: undefined },
5264
type: { type: String, default: 'checkbox' },
5365
autofocus: { type: Boolean, default: undefined },
54-
onChange: Function,
55-
'onUpdate:checked': Function,
56-
onClick: Function,
66+
onChange: Function as PropType<(e: CheckboxChangeEvent) => void>,
67+
'onUpdate:checked': Function as PropType<(checked: boolean) => void>,
68+
onClick: Function as PropType<MouseEventHandler>,
5769
skipGroup: { type: Boolean, default: false },
5870
};
5971
};

components/collapse/Collapse.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ export default defineComponent({
4141
expandIconPosition: 'left',
4242
}),
4343
slots: ['expandIcon'],
44-
emits: ['change', 'update:activeKey'],
44+
// emits: ['change', 'update:activeKey'],
4545
setup(props, { attrs, slots, emit }) {
4646
const stateActiveKey = ref<Key[]>(
4747
getActiveKeysArray(firstNotUndefined([props.activeKey, props.defaultActiveKey])),

components/collapse/CollapsePanel.tsx

+5-3
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ export { collapsePanelProps };
1212
export type CollapsePanelProps = Partial<ExtractPropTypes<ReturnType<typeof collapsePanelProps>>>;
1313
export default defineComponent({
1414
name: 'ACollapsePanel',
15+
inheritAttrs: false,
1516
props: initDefaultProps(collapsePanelProps(), {
1617
showArrow: true,
1718
isActive: false,
@@ -20,8 +21,8 @@ export default defineComponent({
2021
forceRender: false,
2122
}),
2223
slots: ['expandIcon', 'extra', 'header'],
23-
emits: ['itemClick'],
24-
setup(props, { slots, emit }) {
24+
// emits: ['itemClick'],
25+
setup(props, { slots, emit, attrs }) {
2526
devWarning(
2627
props.disabled === undefined,
2728
'Collapse.Panel',
@@ -61,6 +62,7 @@ export default defineComponent({
6162
[`${prefixClsValue}-item-active`]: isActive,
6263
[`${prefixClsValue}-item-disabled`]: disabled,
6364
[`${prefixClsValue}-no-arrow`]: !showArrow,
65+
[`${attrs.class}`]: !!attrs.class,
6466
});
6567

6668
let icon = <i class="arrow" />;
@@ -85,7 +87,7 @@ export default defineComponent({
8587
};
8688

8789
return (
88-
<div class={itemCls}>
90+
<div {...attrs} class={itemCls}>
8991
<div
9092
class={headerCls}
9193
onClick={() => collapsible !== 'header' && handleItemClick()}

components/collapse/commonProps.ts

+18-3
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,37 @@
11
import type { PropType } from 'vue';
2+
import type { Key } from '../_util/type';
23
import { tuple } from '../_util/type';
34
import PropTypes from '../_util/vue-types';
45

56
export type CollapsibleType = 'header' | 'disabled';
67

78
export type ActiveKeyType = Array<string | number> | string | number;
9+
10+
interface PanelProps {
11+
isActive?: boolean;
12+
header?: any;
13+
showArrow?: boolean;
14+
forceRender?: boolean;
15+
/** @deprecated Use `collapsible="disabled"` instead */
16+
disabled?: boolean;
17+
extra?: any;
18+
collapsible?: CollapsibleType;
19+
}
20+
821
const collapseProps = () => ({
922
prefixCls: String,
1023
activeKey: { type: [Array, Number, String] as PropType<ActiveKeyType> },
1124
defaultActiveKey: { type: [Array, Number, String] as PropType<ActiveKeyType> },
1225
accordion: { type: Boolean, default: undefined },
1326
destroyInactivePanel: { type: Boolean, default: undefined },
1427
bordered: { type: Boolean, default: undefined },
15-
expandIcon: Function,
28+
expandIcon: Function as PropType<(panelProps: PanelProps) => any>,
1629
openAnimation: PropTypes.object,
1730
expandIconPosition: PropTypes.oneOf(tuple('left', 'right')),
1831
collapsible: { type: String as PropType<CollapsibleType> },
1932
ghost: { type: Boolean, default: undefined },
33+
onChange: Function as PropType<(key: Key | Key[]) => void>,
34+
'onUpdate:activeKey': Function as PropType<(key: Key | Key[]) => void>,
2035
});
2136

2237
const collapsePanelProps = () => ({
@@ -31,12 +46,12 @@ const collapsePanelProps = () => ({
3146
disabled: { type: Boolean, default: undefined },
3247
accordion: { type: Boolean, default: undefined },
3348
forceRender: { type: Boolean, default: undefined },
34-
expandIcon: Function,
49+
expandIcon: Function as PropType<(panelProps: PanelProps) => any>,
3550
extra: PropTypes.any,
3651
panelKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
3752
collapsible: { type: String as PropType<CollapsibleType> },
3853
role: String,
39-
onItemClick: { type: Function as PropType<(panelKey: string | number) => void> },
54+
onItemClick: { type: Function as PropType<(panelKey: Key) => void> },
4055
});
4156

4257
export { collapseProps, collapsePanelProps };

components/color-picker/ColorPicker.jsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -29,10 +29,10 @@ export default {
2929
colorRounded: Number, //颜色数值保留几位小数
3030
size: PropTypes.oneOf(['default', 'small', 'large']).def('default'), //尺寸
3131
getPopupContainer: Function, //指定渲染容器
32-
disabled: PropTypes.looseBool.def(false), //是否禁用
32+
disabled: { type: Boolean, default: false }, //是否禁用
3333
format: String, //颜色格式设置
34-
alpha: PropTypes.looseBool.def(false), //是否开启透明通道
35-
hue: PropTypes.looseBool.def(true), //是否开启色彩预选
34+
alpha: { type: Boolean, default: false }, //是否开启透明通道
35+
hue: { type: Boolean, default: true }, //是否开启色彩预选
3636
},
3737

3838
data() {

components/comment/index.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ import { flattenChildren } from '../_util/props-util';
55
import type { VueNode } from '../_util/type';
66
import { withInstall } from '../_util/type';
77
import useConfigInject from '../_util/hooks/useConfigInject';
8-
export const commentProps = {
9-
actions: PropTypes.array,
8+
export const commentProps = () => ({
9+
actions: Array,
1010
/** The element to display as the comment author. */
1111
author: PropTypes.any,
1212
/** The element to display as the comment avatar - generally an antd Avatar */
@@ -17,13 +17,13 @@ export const commentProps = {
1717
prefixCls: String,
1818
/** A datetime element containing the time to be displayed */
1919
datetime: PropTypes.any,
20-
};
20+
});
2121

22-
export type CommentProps = Partial<ExtractPropTypes<typeof commentProps>>;
22+
export type CommentProps = Partial<ExtractPropTypes<ReturnType<typeof commentProps>>>;
2323

2424
const Comment = defineComponent({
2525
name: 'AComment',
26-
props: commentProps,
26+
props: commentProps(),
2727
slots: ['actions', 'author', 'avatar', 'content', 'datetime'],
2828
setup(props, { slots }) {
2929
const { prefixCls, direction } = useConfigInject('comment', props);

components/config-provider/context.ts

-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import type { ValidateMessages } from '../form/interface';
44
import type { RequiredMark } from '../form/Form';
55
import type { RenderEmptyHandler } from './renderEmpty';
66
import type { TransformCellTextProps } from '../table/interface';
7-
import PropTypes from '../_util/vue-types';
87
import type { Locale } from '../locale-provider';
98

109
type GlobalFormCOntextProps = {

components/descriptions/index.tsx

+17-16
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,6 @@ import type { Breakpoint, ScreenMap } from '../_util/responsiveObserve';
2323
import ResponsiveObserve, { responsiveArray } from '../_util/responsiveObserve';
2424
import Row from './Row';
2525
import PropTypes from '../_util/vue-types';
26-
import { tuple } from '../_util/type';
2726
import { cloneElement } from '../_util/vnode';
2827
import { flattenChildren } from '../_util/props-util';
2928
import useConfigInject from '../_util/hooks/useConfigInject';
@@ -34,19 +33,21 @@ export const DescriptionsItemProps = {
3433
span: Number,
3534
};
3635

37-
const descriptionsItemProp = {
36+
const descriptionsItemProp = () => ({
3837
prefixCls: String,
3938
label: PropTypes.any,
40-
labelStyle: PropTypes.style,
41-
contentStyle: PropTypes.style,
42-
span: PropTypes.number.def(1),
43-
};
39+
labelStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
40+
contentStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
41+
span: { type: Number, default: 1 },
42+
});
4443

45-
export type DescriptionsItemProp = Partial<ExtractPropTypes<typeof descriptionsItemProp>>;
44+
export type DescriptionsItemProp = Partial<
45+
ExtractPropTypes<ReturnType<typeof descriptionsItemProp>>
46+
>;
4647

4748
export const DescriptionsItem = defineComponent({
4849
name: 'ADescriptionsItem',
49-
props: descriptionsItemProp,
50+
props: descriptionsItemProp(),
5051
slots: ['label'],
5152
setup(_, { slots }) {
5253
return () => slots.default?.();
@@ -128,24 +129,24 @@ function getRows(children: VNode[], column: number) {
128129
return rows;
129130
}
130131

131-
export const descriptionsProps = {
132+
export const descriptionsProps = () => ({
132133
prefixCls: String,
133134
bordered: { type: Boolean, default: undefined },
134-
size: PropTypes.oneOf(tuple('default', 'middle', 'small')).def('default'),
135+
size: { type: String as PropType<'default' | 'middle' | 'small'>, default: 'default' },
135136
title: PropTypes.any,
136137
extra: PropTypes.any,
137138
column: {
138139
type: [Number, Object] as PropType<number | Partial<Record<Breakpoint, number>>>,
139140
default: (): number | Partial<Record<Breakpoint, number>> => DEFAULT_COLUMN_MAP,
140141
},
141-
layout: PropTypes.oneOf(tuple('horizontal', 'vertical')),
142+
layout: String as PropType<'horizontal' | 'vertical'>,
142143
colon: { type: Boolean, default: undefined },
143-
labelStyle: PropTypes.style,
144-
contentStyle: PropTypes.style,
145-
};
144+
labelStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
145+
contentStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
146+
});
146147

147148
export type DescriptionsProps = HTMLAttributes &
148-
Partial<ExtractPropTypes<typeof descriptionsProps>>;
149+
Partial<ExtractPropTypes<ReturnType<typeof descriptionsProps>>>;
149150

150151
export interface DescriptionsContextProp {
151152
labelStyle?: Ref<CSSProperties>;
@@ -157,7 +158,7 @@ export const descriptionsContext: InjectionKey<DescriptionsContextProp> =
157158

158159
const Descriptions = defineComponent({
159160
name: 'ADescriptions',
160-
props: descriptionsProps,
161+
props: descriptionsProps(),
161162
slots: ['title', 'extra'],
162163
Item: DescriptionsItem,
163164
setup(props, { slots }) {

0 commit comments

Comments
 (0)