diff --git a/components/avatar/Group.tsx b/components/avatar/Group.tsx
index 6777c5324..0efdcbc57 100644
--- a/components/avatar/Group.tsx
+++ b/components/avatar/Group.tsx
@@ -11,10 +11,7 @@ import useProvideSize from '../_util/hooks/useSize';
 export const groupProps = () => ({
   prefixCls: String,
   maxCount: Number,
-  maxStyle: {
-    type: Object as PropType<CSSProperties>,
-    default: undefined as CSSProperties,
-  },
+  maxStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   maxPopoverPlacement: { type: String as PropType<'top' | 'bottom'>, default: 'top' },
   maxPopoverTrigger: String as PropType<'hover' | 'focus' | 'click'>,
   /*
diff --git a/components/badge/Badge.tsx b/components/badge/Badge.tsx
index 082dd84b2..38962db61 100644
--- a/components/badge/Badge.tsx
+++ b/components/badge/Badge.tsx
@@ -27,7 +27,7 @@ export const badgeProps = () => ({
   color: String,
   text: PropTypes.any,
   offset: Array as unknown as PropType<[number | string, number | string]>,
-  numberStyle: Object as PropType<CSSProperties>,
+  numberStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   title: String,
 });
 
diff --git a/components/card/Card.tsx b/components/card/Card.tsx
index 30f95ef9b..3709ecdb1 100644
--- a/components/card/Card.tsx
+++ b/components/card/Card.tsx
@@ -1,4 +1,4 @@
-import type { VNodeTypes, PropType, VNode, ExtractPropTypes } from 'vue';
+import type { VNodeTypes, PropType, VNode, ExtractPropTypes, CSSProperties } from 'vue';
 import { isVNode, defineComponent, renderSlot } from 'vue';
 import Tabs from '../tabs';
 import Row from '../row';
@@ -27,11 +27,11 @@ export const cardProps = () => ({
   prefixCls: String,
   title: PropTypes.any,
   extra: PropTypes.any,
-  bordered: PropTypes.looseBool.def(true),
-  bodyStyle: PropTypes.style,
-  headStyle: PropTypes.style,
-  loading: PropTypes.looseBool.def(false),
-  hoverable: PropTypes.looseBool.def(false),
+  bordered: { type: Boolean, default: true },
+  bodyStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+  headStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+  loading: { type: Boolean, default: false },
+  hoverable: { type: Boolean, default: false },
   type: { type: String as PropType<CardType> },
   size: { type: String as PropType<CardSize> },
   actions: PropTypes.any,
diff --git a/components/card/Grid.tsx b/components/card/Grid.tsx
index ba4156b9d..2d89c0485 100644
--- a/components/card/Grid.tsx
+++ b/components/card/Grid.tsx
@@ -1,13 +1,16 @@
+import type { ExtractPropTypes } from 'vue';
 import { defineComponent, computed } from 'vue';
 import useConfigInject from '../_util/hooks/useConfigInject';
 
+export const cardGridProps = () => ({
+  prefixCls: String,
+  hoverable: { type: Boolean, default: true },
+});
+export type CardGridProps = Partial<ExtractPropTypes<ReturnType<typeof cardGridProps>>>;
 export default defineComponent({
   name: 'ACardGrid',
   __ANT_CARD_GRID: true,
-  props: {
-    prefixCls: String,
-    hoverable: { type: Boolean, default: true },
-  },
+  props: cardGridProps(),
   setup(props, { slots }) {
     const { prefixCls } = useConfigInject('card', props);
     const classNames = computed(() => {
diff --git a/components/card/Meta.tsx b/components/card/Meta.tsx
index 80aa6cf77..5d2aba02b 100644
--- a/components/card/Meta.tsx
+++ b/components/card/Meta.tsx
@@ -1,16 +1,19 @@
+import type { ExtractPropTypes } from 'vue';
 import { defineComponent } from 'vue';
 import PropTypes from '../_util/vue-types';
 import { getPropsSlot } from '../_util/props-util';
 import useConfigInject from '../_util/hooks/useConfigInject';
 
+export const cardMetaProps = () => ({
+  prefixCls: String,
+  title: PropTypes.any,
+  description: PropTypes.any,
+  avatar: PropTypes.any,
+});
+export type CardGridProps = Partial<ExtractPropTypes<ReturnType<typeof cardMetaProps>>>;
 export default defineComponent({
   name: 'ACardMeta',
-  props: {
-    prefixCls: String,
-    title: PropTypes.any,
-    description: PropTypes.any,
-    avatar: PropTypes.any,
-  },
+  props: cardMetaProps(),
   slots: ['title', 'description', 'avatar'],
   setup(props, { slots }) {
     const { prefixCls } = useConfigInject('card', props);
diff --git a/components/checkbox/Checkbox.tsx b/components/checkbox/Checkbox.tsx
index f08ce38f2..35181d0b8 100644
--- a/components/checkbox/Checkbox.tsx
+++ b/components/checkbox/Checkbox.tsx
@@ -3,12 +3,11 @@ import classNames from '../_util/classNames';
 import VcCheckbox from '../vc-checkbox/Checkbox';
 import { flattenChildren } from '../_util/props-util';
 import warning from '../_util/warning';
-import type { RadioChangeEvent } from '../radio/interface';
 import type { EventHandler } from '../_util/EventInterface';
 import { useInjectFormItemContext } from '../form/FormItemContext';
 import useConfigInject from '../_util/hooks/useConfigInject';
 
-import type { CheckboxProps } from './interface';
+import type { CheckboxChangeEvent, CheckboxProps } from './interface';
 import { CheckboxGroupContextKey, checkboxProps } from './interface';
 
 export default defineComponent({
@@ -16,7 +15,7 @@ export default defineComponent({
   inheritAttrs: false,
   __ANT_CHECKBOX: true,
   props: checkboxProps(),
-  emits: ['change', 'update:checked'],
+  // emits: ['change', 'update:checked'],
   setup(props, { emit, attrs, slots, expose }) {
     const formItemContext = useInjectFormItemContext();
     const { prefixCls, direction } = useConfigInject('checkbox', props);
@@ -41,7 +40,7 @@ export default defineComponent({
       );
     });
 
-    const handleChange = (event: RadioChangeEvent) => {
+    const handleChange = (event: CheckboxChangeEvent) => {
       const targetChecked = event.target.checked;
       emit('update:checked', targetChecked);
       emit('change', event);
diff --git a/components/checkbox/Group.tsx b/components/checkbox/Group.tsx
index 1ec861e1e..0886ec971 100644
--- a/components/checkbox/Group.tsx
+++ b/components/checkbox/Group.tsx
@@ -8,7 +8,7 @@ import { CheckboxGroupContextKey, checkboxGroupProps } from './interface';
 export default defineComponent({
   name: 'ACheckboxGroup',
   props: checkboxGroupProps(),
-  emits: ['change', 'update:value'],
+  // emits: ['change', 'update:value'],
   setup(props, { slots, emit, expose }) {
     const formItemContext = useInjectFormItemContext();
     const { prefixCls, direction } = useConfigInject('checkbox', props);
diff --git a/components/checkbox/interface.ts b/components/checkbox/interface.ts
index 30be1b8e4..e1599dd17 100644
--- a/components/checkbox/interface.ts
+++ b/components/checkbox/interface.ts
@@ -1,4 +1,5 @@
 import type { ExtractPropTypes, InjectionKey, PropType, Ref } from 'vue';
+import type { MouseEventHandler } from '../_util/EventInterface';
 import type { VueNode } from '../_util/type';
 import PropTypes from '../_util/vue-types';
 
@@ -8,7 +9,18 @@ export interface CheckboxOptionType {
   value: CheckboxValueType;
   disabled?: boolean;
   indeterminate?: boolean;
-  onChange?: (e: Event) => void;
+  onChange?: (e: CheckboxChangeEvent) => void;
+}
+
+export interface CheckboxChangeEvent {
+  target: CheckboxChangeEventTarget;
+  stopPropagation: () => void;
+  preventDefault: () => void;
+  nativeEvent: MouseEvent;
+}
+
+export interface CheckboxChangeEventTarget extends CheckboxProps {
+  checked: boolean;
 }
 
 export const abstractCheckboxGroupProps = () => {
@@ -51,9 +63,9 @@ export const abstractCheckboxProps = () => {
     indeterminate: { type: Boolean, default: undefined },
     type: { type: String, default: 'checkbox' },
     autofocus: { type: Boolean, default: undefined },
-    onChange: Function,
-    'onUpdate:checked': Function,
-    onClick: Function,
+    onChange: Function as PropType<(e: CheckboxChangeEvent) => void>,
+    'onUpdate:checked': Function as PropType<(checked: boolean) => void>,
+    onClick: Function as PropType<MouseEventHandler>,
     skipGroup: { type: Boolean, default: false },
   };
 };
diff --git a/components/collapse/Collapse.tsx b/components/collapse/Collapse.tsx
index 5f15ac3e8..f2fee5490 100644
--- a/components/collapse/Collapse.tsx
+++ b/components/collapse/Collapse.tsx
@@ -41,7 +41,7 @@ export default defineComponent({
     expandIconPosition: 'left',
   }),
   slots: ['expandIcon'],
-  emits: ['change', 'update:activeKey'],
+  // emits: ['change', 'update:activeKey'],
   setup(props, { attrs, slots, emit }) {
     const stateActiveKey = ref<Key[]>(
       getActiveKeysArray(firstNotUndefined([props.activeKey, props.defaultActiveKey])),
diff --git a/components/collapse/CollapsePanel.tsx b/components/collapse/CollapsePanel.tsx
index 4074790dc..e42c1bc50 100644
--- a/components/collapse/CollapsePanel.tsx
+++ b/components/collapse/CollapsePanel.tsx
@@ -12,6 +12,7 @@ export { collapsePanelProps };
 export type CollapsePanelProps = Partial<ExtractPropTypes<ReturnType<typeof collapsePanelProps>>>;
 export default defineComponent({
   name: 'ACollapsePanel',
+  inheritAttrs: false,
   props: initDefaultProps(collapsePanelProps(), {
     showArrow: true,
     isActive: false,
@@ -20,8 +21,8 @@ export default defineComponent({
     forceRender: false,
   }),
   slots: ['expandIcon', 'extra', 'header'],
-  emits: ['itemClick'],
-  setup(props, { slots, emit }) {
+  // emits: ['itemClick'],
+  setup(props, { slots, emit, attrs }) {
     devWarning(
       props.disabled === undefined,
       'Collapse.Panel',
@@ -61,6 +62,7 @@ export default defineComponent({
         [`${prefixClsValue}-item-active`]: isActive,
         [`${prefixClsValue}-item-disabled`]: disabled,
         [`${prefixClsValue}-no-arrow`]: !showArrow,
+        [`${attrs.class}`]: !!attrs.class,
       });
 
       let icon = <i class="arrow" />;
@@ -85,7 +87,7 @@ export default defineComponent({
       };
 
       return (
-        <div class={itemCls}>
+        <div {...attrs} class={itemCls}>
           <div
             class={headerCls}
             onClick={() => collapsible !== 'header' && handleItemClick()}
diff --git a/components/collapse/commonProps.ts b/components/collapse/commonProps.ts
index 724dd03b3..3eaf42225 100644
--- a/components/collapse/commonProps.ts
+++ b/components/collapse/commonProps.ts
@@ -1,10 +1,23 @@
 import type { PropType } from 'vue';
+import type { Key } from '../_util/type';
 import { tuple } from '../_util/type';
 import PropTypes from '../_util/vue-types';
 
 export type CollapsibleType = 'header' | 'disabled';
 
 export type ActiveKeyType = Array<string | number> | string | number;
+
+interface PanelProps {
+  isActive?: boolean;
+  header?: any;
+  showArrow?: boolean;
+  forceRender?: boolean;
+  /** @deprecated Use `collapsible="disabled"` instead */
+  disabled?: boolean;
+  extra?: any;
+  collapsible?: CollapsibleType;
+}
+
 const collapseProps = () => ({
   prefixCls: String,
   activeKey: { type: [Array, Number, String] as PropType<ActiveKeyType> },
@@ -12,11 +25,13 @@ const collapseProps = () => ({
   accordion: { type: Boolean, default: undefined },
   destroyInactivePanel: { type: Boolean, default: undefined },
   bordered: { type: Boolean, default: undefined },
-  expandIcon: Function,
+  expandIcon: Function as PropType<(panelProps: PanelProps) => any>,
   openAnimation: PropTypes.object,
   expandIconPosition: PropTypes.oneOf(tuple('left', 'right')),
   collapsible: { type: String as PropType<CollapsibleType> },
   ghost: { type: Boolean, default: undefined },
+  onChange: Function as PropType<(key: Key | Key[]) => void>,
+  'onUpdate:activeKey': Function as PropType<(key: Key | Key[]) => void>,
 });
 
 const collapsePanelProps = () => ({
@@ -31,12 +46,12 @@ const collapsePanelProps = () => ({
   disabled: { type: Boolean, default: undefined },
   accordion: { type: Boolean, default: undefined },
   forceRender: { type: Boolean, default: undefined },
-  expandIcon: Function,
+  expandIcon: Function as PropType<(panelProps: PanelProps) => any>,
   extra: PropTypes.any,
   panelKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
   collapsible: { type: String as PropType<CollapsibleType> },
   role: String,
-  onItemClick: { type: Function as PropType<(panelKey: string | number) => void> },
+  onItemClick: { type: Function as PropType<(panelKey: Key) => void> },
 });
 
 export { collapseProps, collapsePanelProps };
diff --git a/components/color-picker/ColorPicker.jsx b/components/color-picker/ColorPicker.jsx
index 4a9467a1a..66b6c3673 100644
--- a/components/color-picker/ColorPicker.jsx
+++ b/components/color-picker/ColorPicker.jsx
@@ -29,10 +29,10 @@ export default {
     colorRounded: Number, //颜色数值保留几位小数
     size: PropTypes.oneOf(['default', 'small', 'large']).def('default'), //尺寸
     getPopupContainer: Function, //指定渲染容器
-    disabled: PropTypes.looseBool.def(false), //是否禁用
+    disabled: { type: Boolean, default: false }, //是否禁用
     format: String, //颜色格式设置
-    alpha: PropTypes.looseBool.def(false), //是否开启透明通道
-    hue: PropTypes.looseBool.def(true), //是否开启色彩预选
+    alpha: { type: Boolean, default: false }, //是否开启透明通道
+    hue: { type: Boolean, default: true }, //是否开启色彩预选
   },
 
   data() {
diff --git a/components/comment/index.tsx b/components/comment/index.tsx
index 1b2bbbee3..b642066be 100644
--- a/components/comment/index.tsx
+++ b/components/comment/index.tsx
@@ -5,8 +5,8 @@ import { flattenChildren } from '../_util/props-util';
 import type { VueNode } from '../_util/type';
 import { withInstall } from '../_util/type';
 import useConfigInject from '../_util/hooks/useConfigInject';
-export const commentProps = {
-  actions: PropTypes.array,
+export const commentProps = () => ({
+  actions: Array,
   /** The element to display as the comment author. */
   author: PropTypes.any,
   /** The element to display as the comment avatar - generally an antd Avatar */
@@ -17,13 +17,13 @@ export const commentProps = {
   prefixCls: String,
   /** A datetime element containing the time to be displayed */
   datetime: PropTypes.any,
-};
+});
 
-export type CommentProps = Partial<ExtractPropTypes<typeof commentProps>>;
+export type CommentProps = Partial<ExtractPropTypes<ReturnType<typeof commentProps>>>;
 
 const Comment = defineComponent({
   name: 'AComment',
-  props: commentProps,
+  props: commentProps(),
   slots: ['actions', 'author', 'avatar', 'content', 'datetime'],
   setup(props, { slots }) {
     const { prefixCls, direction } = useConfigInject('comment', props);
diff --git a/components/config-provider/context.ts b/components/config-provider/context.ts
index 17855b264..2d763e7d9 100644
--- a/components/config-provider/context.ts
+++ b/components/config-provider/context.ts
@@ -4,7 +4,6 @@ import type { ValidateMessages } from '../form/interface';
 import type { RequiredMark } from '../form/Form';
 import type { RenderEmptyHandler } from './renderEmpty';
 import type { TransformCellTextProps } from '../table/interface';
-import PropTypes from '../_util/vue-types';
 import type { Locale } from '../locale-provider';
 
 type GlobalFormCOntextProps = {
diff --git a/components/descriptions/index.tsx b/components/descriptions/index.tsx
index 82f1a6324..a245b5d3c 100644
--- a/components/descriptions/index.tsx
+++ b/components/descriptions/index.tsx
@@ -23,7 +23,6 @@ import type { Breakpoint, ScreenMap } from '../_util/responsiveObserve';
 import ResponsiveObserve, { responsiveArray } from '../_util/responsiveObserve';
 import Row from './Row';
 import PropTypes from '../_util/vue-types';
-import { tuple } from '../_util/type';
 import { cloneElement } from '../_util/vnode';
 import { flattenChildren } from '../_util/props-util';
 import useConfigInject from '../_util/hooks/useConfigInject';
@@ -34,19 +33,21 @@ export const DescriptionsItemProps = {
   span: Number,
 };
 
-const descriptionsItemProp = {
+const descriptionsItemProp = () => ({
   prefixCls: String,
   label: PropTypes.any,
-  labelStyle: PropTypes.style,
-  contentStyle: PropTypes.style,
-  span: PropTypes.number.def(1),
-};
+  labelStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+  contentStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+  span: { type: Number, default: 1 },
+});
 
-export type DescriptionsItemProp = Partial<ExtractPropTypes<typeof descriptionsItemProp>>;
+export type DescriptionsItemProp = Partial<
+  ExtractPropTypes<ReturnType<typeof descriptionsItemProp>>
+>;
 
 export const DescriptionsItem = defineComponent({
   name: 'ADescriptionsItem',
-  props: descriptionsItemProp,
+  props: descriptionsItemProp(),
   slots: ['label'],
   setup(_, { slots }) {
     return () => slots.default?.();
@@ -128,24 +129,24 @@ function getRows(children: VNode[], column: number) {
   return rows;
 }
 
-export const descriptionsProps = {
+export const descriptionsProps = () => ({
   prefixCls: String,
   bordered: { type: Boolean, default: undefined },
-  size: PropTypes.oneOf(tuple('default', 'middle', 'small')).def('default'),
+  size: { type: String as PropType<'default' | 'middle' | 'small'>, default: 'default' },
   title: PropTypes.any,
   extra: PropTypes.any,
   column: {
     type: [Number, Object] as PropType<number | Partial<Record<Breakpoint, number>>>,
     default: (): number | Partial<Record<Breakpoint, number>> => DEFAULT_COLUMN_MAP,
   },
-  layout: PropTypes.oneOf(tuple('horizontal', 'vertical')),
+  layout: String as PropType<'horizontal' | 'vertical'>,
   colon: { type: Boolean, default: undefined },
-  labelStyle: PropTypes.style,
-  contentStyle: PropTypes.style,
-};
+  labelStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+  contentStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+});
 
 export type DescriptionsProps = HTMLAttributes &
-  Partial<ExtractPropTypes<typeof descriptionsProps>>;
+  Partial<ExtractPropTypes<ReturnType<typeof descriptionsProps>>>;
 
 export interface DescriptionsContextProp {
   labelStyle?: Ref<CSSProperties>;
@@ -157,7 +158,7 @@ export const descriptionsContext: InjectionKey<DescriptionsContextProp> =
 
 const Descriptions = defineComponent({
   name: 'ADescriptions',
-  props: descriptionsProps,
+  props: descriptionsProps(),
   slots: ['title', 'extra'],
   Item: DescriptionsItem,
   setup(props, { slots }) {
diff --git a/components/divider/index.tsx b/components/divider/index.tsx
index 78b55d63e..af4311980 100644
--- a/components/divider/index.tsx
+++ b/components/divider/index.tsx
@@ -4,7 +4,7 @@ import { computed, defineComponent } from 'vue';
 import { withInstall } from '../_util/type';
 import useConfigInject from '../_util/hooks/useConfigInject';
 
-export const dividerProps = {
+export const dividerProps = () => ({
   prefixCls: String,
   type: {
     type: String as PropType<'horizontal' | 'vertical' | ''>,
@@ -23,12 +23,12 @@ export const dividerProps = {
     default: false,
   },
   orientationMargin: [String, Number],
-};
-export type DividerProps = Partial<ExtractPropTypes<typeof dividerProps>>;
+});
+export type DividerProps = Partial<ExtractPropTypes<ReturnType<typeof dividerProps>>>;
 
 const Divider = defineComponent({
   name: 'ADivider',
-  props: dividerProps,
+  props: dividerProps(),
   setup(props, { slots }) {
     const { prefixCls: prefixClsRef, direction } = useConfigInject('divider', props);
     const hasCustomMarginLeft = computed(
diff --git a/components/drawer/index.tsx b/components/drawer/index.tsx
index 87cd12394..0c658a4b2 100644
--- a/components/drawer/index.tsx
+++ b/components/drawer/index.tsx
@@ -19,6 +19,7 @@ import useConfigInject from '../_util/hooks/useConfigInject';
 import { tuple, withInstall } from '../_util/type';
 import omit from '../_util/omit';
 import devWarning from '../vc-util/devWarning';
+import type { KeyboardEventHandler, MouseEventHandler } from '../_util/EventInterface';
 
 type ILevelMove = number | [number, number];
 
@@ -43,7 +44,7 @@ export const drawerProps = () => ({
   getContainer: PropTypes.any,
   maskClosable: { type: Boolean, default: undefined },
   mask: { type: Boolean, default: undefined },
-  maskStyle: PropTypes.object,
+  maskStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   /** @deprecated Use `style` instead */
   wrapStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   style: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
@@ -53,10 +54,13 @@ export const drawerProps = () => ({
   size: {
     type: String as PropType<sizeType>,
   },
-  drawerStyle: PropTypes.object,
-  headerStyle: PropTypes.object,
-  bodyStyle: PropTypes.object,
-  contentWrapperStyle: PropTypes.object,
+  drawerStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+  headerStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+  bodyStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+  contentWrapperStyle: {
+    type: Object as PropType<CSSProperties>,
+    default: undefined as CSSProperties,
+  },
   title: PropTypes.any,
   visible: { type: Boolean, default: undefined },
   width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
@@ -68,7 +72,7 @@ export const drawerProps = () => ({
   keyboard: { type: Boolean, default: undefined },
   extra: PropTypes.any,
   footer: PropTypes.any,
-  footerStyle: PropTypes.object,
+  footerStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   level: PropTypes.any,
   levelMove: {
     type: [Number, Array, Function] as PropType<
@@ -77,7 +81,10 @@ export const drawerProps = () => ({
   },
   handle: PropTypes.any,
   /** @deprecated Use `@afterVisibleChange` instead */
-  afterVisibleChange: Function,
+  afterVisibleChange: Function as PropType<(visible: boolean) => void>,
+  onAfterVisibleChange: Function as PropType<(visible: boolean) => void>,
+  'onUpdate:visible': Function as PropType<(visible: boolean) => void>,
+  onClose: Function as PropType<MouseEventHandler | KeyboardEventHandler>,
 });
 
 export type DrawerProps = Partial<ExtractPropTypes<ReturnType<typeof drawerProps>>>;
@@ -95,7 +102,7 @@ const Drawer = defineComponent({
     push: defaultPushState,
   }),
   slots: ['closeIcon', 'title', 'extra', 'footer', 'handle'],
-  emits: ['update:visible', 'close', 'afterVisibleChange'],
+  // emits: ['update:visible', 'close', 'afterVisibleChange'],
   setup(props, { emit, slots, attrs }) {
     const sPush = ref(false);
     const destroyClose = ref(false);
@@ -343,6 +350,9 @@ const Drawer = defineComponent({
           'title',
           'push',
           'wrapStyle',
+          'onAfterVisibleChange',
+          'onClose',
+          'onUpdate:visible',
         ]),
         ...val,
         onClose: close,
diff --git a/components/dropdown/dropdown-button.tsx b/components/dropdown/dropdown-button.tsx
index d4b0c4da6..b20b5a13f 100644
--- a/components/dropdown/dropdown-button.tsx
+++ b/components/dropdown/dropdown-button.tsx
@@ -20,7 +20,7 @@ export default defineComponent({
     placement: 'bottomRight',
     type: 'default',
   }),
-  emits: ['click', 'visibleChange', 'update:visible'],
+  // emits: ['click', 'visibleChange', 'update:visible'],
   slots: ['icon', 'leftButton', 'rightButton', 'overlay'],
   setup(props, { slots, attrs, emit }) {
     const handleVisibleChange = (val: boolean) => {
diff --git a/components/dropdown/dropdown.tsx b/components/dropdown/dropdown.tsx
index 00b319f4a..a6e5ff717 100644
--- a/components/dropdown/dropdown.tsx
+++ b/components/dropdown/dropdown.tsx
@@ -23,7 +23,7 @@ const Dropdown = defineComponent({
     placement: 'bottomLeft',
     trigger: 'hover',
   }),
-  emits: ['visibleChange', 'update:visible'],
+  // emits: ['visibleChange', 'update:visible'],
   slots: ['overlay'],
   setup(props, { slots, attrs, emit }) {
     const { prefixCls, rootPrefixCls, direction, getPopupContainer } = useConfigInject(
diff --git a/components/dropdown/props.ts b/components/dropdown/props.ts
index 9e24eba81..7802881ba 100644
--- a/components/dropdown/props.ts
+++ b/components/dropdown/props.ts
@@ -1,5 +1,4 @@
-import { tuple } from '../_util/type';
-import type { PropType } from 'vue';
+import type { CSSProperties, PropType } from 'vue';
 import PropTypes from '../_util/vue-types';
 
 import buttonTypes from '../button/buttonTypes';
@@ -35,23 +34,21 @@ const dropdownProps = () => ({
   visible: { type: Boolean, default: undefined },
   disabled: { type: Boolean, default: undefined },
   align: { type: Object as PropType<Align> },
-  getPopupContainer: Function,
+  getPopupContainer: Function as PropType<(triggerNode: HTMLElement) => HTMLElement>,
   prefixCls: String,
   transitionName: String,
-  placement: PropTypes.oneOf(
-    tuple(
-      'topLeft',
-      'topCenter',
-      'top',
-      'topRight',
-      'bottomLeft',
-      'bottomCenter',
-      'bottom',
-      'bottomRight',
-    ),
-  ),
+  placement: String as PropType<
+    | 'topLeft'
+    | 'topCenter'
+    | 'top'
+    | 'topRight'
+    | 'bottomLeft'
+    | 'bottomCenter'
+    | 'bottom'
+    | 'bottomRight'
+  >,
   overlayClassName: String,
-  overlayStyle: PropTypes.style,
+  overlayStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   forceRender: { type: Boolean, default: undefined },
   mouseEnterDelay: Number,
   mouseLeaveDelay: Number,
@@ -70,7 +67,7 @@ const buttonTypesProps = buttonTypes();
 const dropdownButtonProps = () => ({
   ...dropdownProps(),
   type: buttonTypesProps.type,
-  size: PropTypes.oneOf(tuple('small', 'large')),
+  size: String as PropType<'small' | 'large'>,
   htmlType: buttonTypesProps.htmlType,
   href: String,
   disabled: { type: Boolean, default: undefined },
diff --git a/components/empty/index.tsx b/components/empty/index.tsx
index 8bba90dbd..89a1e8f65 100644
--- a/components/empty/index.tsx
+++ b/components/empty/index.tsx
@@ -1,4 +1,4 @@
-import type { CSSProperties, FunctionalComponent } from 'vue';
+import type { CSSProperties, FunctionalComponent, PropType } from 'vue';
 import classNames from '../_util/classNames';
 import LocaleReceiver from '../locale-provider/LocaleReceiver';
 import DefaultEmptyImg from './empty';
@@ -88,7 +88,7 @@ Empty.props = {
   prefixCls: String,
   image: PropTypes.any,
   description: PropTypes.any,
-  imageStyle: PropTypes.object,
+  imageStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
 };
 
 export default withInstall(Empty);
diff --git a/components/form/FormItem.tsx b/components/form/FormItem.tsx
index 7a4dc03fa..f19a7cbea 100644
--- a/components/form/FormItem.tsx
+++ b/components/form/FormItem.tsx
@@ -89,13 +89,13 @@ export const formItemProps = {
   extra: PropTypes.any,
   labelCol: { type: Object as PropType<ColProps & HTMLAttributes> },
   wrapperCol: { type: Object as PropType<ColProps & HTMLAttributes> },
-  hasFeedback: PropTypes.looseBool.def(false),
+  hasFeedback: { type: Boolean, default: false },
   colon: { type: Boolean, default: undefined },
   labelAlign: PropTypes.oneOf(tuple('left', 'right')),
   prop: { type: [String, Number, Array] as PropType<string | number | Array<string | number>> },
   name: { type: [String, Number, Array] as PropType<string | number | Array<string | number>> },
   rules: PropTypes.oneOfType([Array, Object]),
-  autoLink: PropTypes.looseBool.def(true),
+  autoLink: { type: Boolean, default: true },
   required: { type: Boolean, default: undefined },
   validateFirst: { type: Boolean, default: undefined },
   validateStatus: PropTypes.oneOf(tuple('', 'success', 'warning', 'error', 'validating')),
diff --git a/components/input/ClearableLabeledInput.tsx b/components/input/ClearableLabeledInput.tsx
index bf949fc00..f880ead58 100644
--- a/components/input/ClearableLabeledInput.tsx
+++ b/components/input/ClearableLabeledInput.tsx
@@ -31,7 +31,7 @@ export default defineComponent({
     addonAfter: PropTypes.any,
     readonly: { type: Boolean, default: undefined },
     focused: { type: Boolean, default: undefined },
-    bordered: PropTypes.looseBool.def(true),
+    bordered: { type: Boolean, default: true },
     triggerFocus: { type: Function as PropType<() => void> },
     hidden: Boolean,
   },
diff --git a/components/input/Group.tsx b/components/input/Group.tsx
index 681fcd4cc..3467bda4f 100644
--- a/components/input/Group.tsx
+++ b/components/input/Group.tsx
@@ -1,6 +1,5 @@
 import type { PropType } from 'vue';
 import { computed, defineComponent } from 'vue';
-import PropTypes from '../_util/vue-types';
 import type { SizeType } from '../config-provider';
 import type { FocusEventHandler, MouseEventHandler } from '../_util/EventInterface';
 import useConfigInject from '../_util/hooks/useConfigInject';
diff --git a/components/input/Input.tsx b/components/input/Input.tsx
index 7fccca4a1..9d92a1bb1 100644
--- a/components/input/Input.tsx
+++ b/components/input/Input.tsx
@@ -268,7 +268,7 @@ export default defineComponent({
         valueModifiers = {},
         htmlSize,
       } = props;
-      const otherProps = omit(props as InputProps & { inputType: any; placeholder: string }, [
+      const otherProps = omit(props as InputProps & { placeholder: string }, [
         'prefixCls',
         'onPressEnter',
         'addonBefore',
@@ -280,7 +280,6 @@ export default defineComponent({
         // specify either the value prop, or the defaultValue prop, but not both.
         'defaultValue',
         'size',
-        'inputType',
         'bordered',
         'htmlSize',
         'lazy',
diff --git a/components/input/Password.tsx b/components/input/Password.tsx
index f2fc07774..08ed3ea0a 100644
--- a/components/input/Password.tsx
+++ b/components/input/Password.tsx
@@ -27,7 +27,7 @@ export default defineComponent({
     prefixCls: String,
     inputPrefixCls: String,
     action: PropTypes.string.def('click'),
-    visibilityToggle: PropTypes.looseBool.def(true),
+    visibilityToggle: { type: Boolean, default: true },
     iconRender: Function,
   },
   setup(props, { slots, attrs, expose }) {
diff --git a/components/input/inputProps.ts b/components/input/inputProps.ts
index ccc817ee3..11d8f5626 100644
--- a/components/input/inputProps.ts
+++ b/components/input/inputProps.ts
@@ -57,7 +57,7 @@ const inputProps = {
   suffix: PropTypes.any,
   autofocus: { type: Boolean, default: undefined },
   allowClear: { type: Boolean, default: undefined },
-  lazy: PropTypes.looseBool.def(true),
+  lazy: { type: Boolean, default: true },
   maxlength: Number,
   loading: { type: Boolean, default: undefined },
   bordered: { type: Boolean, default: undefined },
diff --git a/components/layout/Sider.tsx b/components/layout/Sider.tsx
index f9d12c9b1..00abe3469 100644
--- a/components/layout/Sider.tsx
+++ b/components/layout/Sider.tsx
@@ -29,7 +29,10 @@ export const siderProps = {
   collapsed: { type: Boolean, default: undefined },
   defaultCollapsed: { type: Boolean, default: undefined },
   reverseArrow: { type: Boolean, default: undefined },
-  zeroWidthTriggerStyle: PropTypes.style,
+  zeroWidthTriggerStyle: {
+    type: Object as PropType<CSSProperties>,
+    default: undefined as CSSProperties,
+  },
   trigger: PropTypes.any,
   width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
   collapsedWidth: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
diff --git a/components/layout/layout.tsx b/components/layout/layout.tsx
index dc7b13536..f5e6a98ed 100644
--- a/components/layout/layout.tsx
+++ b/components/layout/layout.tsx
@@ -1,6 +1,5 @@
 import type { ExtractPropTypes, HTMLAttributes } from 'vue';
 import { computed, createVNode, defineComponent, provide, ref } from 'vue';
-import PropTypes from '../_util/vue-types';
 import useConfigInject from '../_util/hooks/useConfigInject';
 import { SiderHookProviderKey } from './injectionKey';
 
diff --git a/components/list/Item.tsx b/components/list/Item.tsx
index 5b4dbfb02..c65510819 100644
--- a/components/list/Item.tsx
+++ b/components/list/Item.tsx
@@ -3,6 +3,7 @@ import classNames from '../_util/classNames';
 import { isStringElement, isEmptyElement, flattenChildren } from '../_util/props-util';
 import { Col } from '../grid';
 import { cloneElement } from '../_util/vnode';
+import type { CSSProperties, PropType } from 'vue';
 import { defineComponent, inject, ref } from 'vue';
 import ItemMeta from './ItemMeta';
 import useConfigInject from '../_util/hooks/useConfigInject';
@@ -13,7 +14,7 @@ export const ListItemProps = {
   extra: PropTypes.any,
   actions: PropTypes.array,
   grid: PropTypes.any,
-  colStyle: PropTypes.style,
+  colStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
 };
 
 export default defineComponent({
diff --git a/components/locale-provider/index.tsx b/components/locale-provider/index.tsx
index e149a6325..ed51a3009 100644
--- a/components/locale-provider/index.tsx
+++ b/components/locale-provider/index.tsx
@@ -1,6 +1,5 @@
 import type { App, VNode, PropType } from 'vue';
 import { provide, defineComponent, reactive, watch } from 'vue';
-import PropTypes from '../_util/vue-types';
 import type { ModalLocale } from '../modal/locale';
 import warning from '../_util/warning';
 import { withInstall } from '../_util/type';
diff --git a/components/modal/Modal.tsx b/components/modal/Modal.tsx
index d03e7e055..011daa78f 100644
--- a/components/modal/Modal.tsx
+++ b/components/modal/Modal.tsx
@@ -68,8 +68,8 @@ export const modalProps = () => ({
     default: undefined,
   },
   zIndex: Number,
-  bodyStyle: Object as PropType<CSSProperties>,
-  maskStyle: Object as PropType<CSSProperties>,
+  bodyStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+  maskStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   mask: { type: Boolean, default: undefined },
   keyboard: { type: Boolean, default: undefined },
   wrapProps: Object,
diff --git a/components/popconfirm/index.tsx b/components/popconfirm/index.tsx
index 2821e46e5..a011a4be7 100644
--- a/components/popconfirm/index.tsx
+++ b/components/popconfirm/index.tsx
@@ -31,7 +31,7 @@ export const popconfirmProps = () => ({
     type: String as PropType<LegacyButtonType>,
     default: 'primary',
   },
-  disabled: PropTypes.looseBool.def(false),
+  disabled: { type: Boolean, default: false },
   okText: PropTypes.any,
   cancelText: PropTypes.any,
   icon: PropTypes.any,
diff --git a/components/progress/Line.tsx b/components/progress/Line.tsx
index a35ed2efb..6c0112f4a 100644
--- a/components/progress/Line.tsx
+++ b/components/progress/Line.tsx
@@ -2,7 +2,6 @@ import type { CSSProperties, ExtractPropTypes, PropType } from 'vue';
 import { presetPrimaryColors } from '@ant-design/colors';
 import { computed, defineComponent } from 'vue';
 import type { Direction } from '../config-provider';
-import PropTypes from '../_util/vue-types';
 import type { StringGradients, ProgressGradient } from './props';
 import { progressProps } from './props';
 import { getSuccessPercent, validProgress } from './utils';
diff --git a/components/progress/Steps.tsx b/components/progress/Steps.tsx
index d1be56310..b4f676168 100644
--- a/components/progress/Steps.tsx
+++ b/components/progress/Steps.tsx
@@ -1,7 +1,6 @@
 import type { ExtractPropTypes, PropType } from 'vue';
 import { computed, defineComponent } from 'vue';
 import type { VueNode } from '../_util/type';
-import PropTypes from '../_util/vue-types';
 import type { ProgressSize } from './props';
 import { progressProps } from './props';
 
diff --git a/components/statistic/Statistic.tsx b/components/statistic/Statistic.tsx
index 36ca58c41..000ee54ca 100644
--- a/components/statistic/Statistic.tsx
+++ b/components/statistic/Statistic.tsx
@@ -1,4 +1,4 @@
-import type { ExtractPropTypes, PropType } from 'vue';
+import type { CSSProperties, ExtractPropTypes, PropType } from 'vue';
 import { defineComponent } from 'vue';
 import PropTypes from '../_util/vue-types';
 import initDefaultProps from '../_util/props-util/initDefaultProps';
@@ -15,7 +15,7 @@ export const statisticProps = {
   value: {
     type: [String, Number, Object] as PropType<countdownValueType>,
   },
-  valueStyle: PropTypes.style,
+  valueStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   valueRender: PropTypes.any,
   formatter: PropTypes.any,
   precision: Number,
diff --git a/components/table/hooks/useFilter/FilterDropdown.tsx b/components/table/hooks/useFilter/FilterDropdown.tsx
index a41dd9d04..dac924de6 100644
--- a/components/table/hooks/useFilter/FilterDropdown.tsx
+++ b/components/table/hooks/useFilter/FilterDropdown.tsx
@@ -22,9 +22,10 @@ import classNames from '../../../_util/classNames';
 import useConfigInject from '../../../_util/hooks/useConfigInject';
 import { useInjectSlots } from '../../context';
 import type { DataNode, EventDataNode } from '../../../tree';
-import type { CheckboxChangeEvent, EventHandler } from '../../../_util/EventInterface';
+import type { EventHandler } from '../../../_util/EventInterface';
 import FilterSearch from './FilterSearch';
 import Tree from '../../../tree';
+import type { CheckboxChangeEvent } from '../../../checkbox/interface';
 
 interface FilterRestProps {
   confirm?: Boolean;
diff --git a/components/tag/CheckableTag.tsx b/components/tag/CheckableTag.tsx
index 79c66370d..a267269d8 100644
--- a/components/tag/CheckableTag.tsx
+++ b/components/tag/CheckableTag.tsx
@@ -1,7 +1,6 @@
 import type { PropType } from 'vue';
 import { defineComponent, computed } from 'vue';
 import classNames from '../_util/classNames';
-import PropTypes from '../_util/vue-types';
 import useConfigInject from '../_util/hooks/useConfigInject';
 
 const CheckableTag = defineComponent({
diff --git a/components/tag/index.tsx b/components/tag/index.tsx
index ff5778436..8f9ca7ba5 100644
--- a/components/tag/index.tsx
+++ b/components/tag/index.tsx
@@ -18,7 +18,7 @@ export const tagProps = {
   color: {
     type: String as PropType<LiteralUnion<PresetColorType | PresetStatusColorType, string>>,
   },
-  closable: PropTypes.looseBool.def(false),
+  closable: { type: Boolean, default: false },
   closeIcon: PropTypes.any,
   visible: { type: Boolean, default: undefined },
   onClose: {
diff --git a/components/tooltip/abstractTooltipProps.ts b/components/tooltip/abstractTooltipProps.ts
index 8497f01f0..9c624c218 100644
--- a/components/tooltip/abstractTooltipProps.ts
+++ b/components/tooltip/abstractTooltipProps.ts
@@ -1,5 +1,6 @@
 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');
 
 export const placementTypes = tuple(
@@ -27,7 +28,7 @@ export default () => ({
   placement: PropTypes.oneOf(placementTypes),
   color: String,
   transitionName: String,
-  overlayStyle: PropTypes.style,
+  overlayStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   overlayClassName: String,
   openClassName: String,
   prefixCls: String,
diff --git a/components/transfer/index.tsx b/components/transfer/index.tsx
index 361b9ac5c..c7d0c8de0 100644
--- a/components/transfer/index.tsx
+++ b/components/transfer/index.tsx
@@ -76,7 +76,7 @@ export const transferProps = {
     type: [Function, Object] as PropType<((style: ListStyle) => CSSProperties) | CSSProperties>,
     default: () => ({}),
   },
-  operationStyle: PropTypes.style,
+  operationStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   titles: { type: Array as PropType<string[]> },
   operations: { type: Array as PropType<string[]> },
   showSearch: { type: Boolean, default: false },
diff --git a/components/transfer/list.tsx b/components/transfer/list.tsx
index dba52338e..79a21dbc0 100644
--- a/components/transfer/list.tsx
+++ b/components/transfer/list.tsx
@@ -35,7 +35,7 @@ export const transferListProps = {
   handleFilter: Function,
   handleClear: Function,
   renderItem: Function,
-  showSearch: PropTypes.looseBool.def(false),
+  showSearch: { type: Boolean, default: false },
   searchPlaceholder: String,
   notFoundContent: PropTypes.any,
   itemUnit: String,
diff --git a/components/transfer/search.tsx b/components/transfer/search.tsx
index 0ef355118..b1e05373c 100644
--- a/components/transfer/search.tsx
+++ b/components/transfer/search.tsx
@@ -1,4 +1,3 @@
-import PropTypes from '../_util/vue-types';
 import initDefaultProps from '../_util/props-util/initDefaultProps';
 import SearchOutlined from '@ant-design/icons-vue/SearchOutlined';
 import Input from '../input';
diff --git a/components/typography/Typography.tsx b/components/typography/Typography.tsx
index cc374a613..0c9e4f956 100644
--- a/components/typography/Typography.tsx
+++ b/components/typography/Typography.tsx
@@ -1,4 +1,3 @@
-import PropTypes from '../_util/vue-types';
 import type { HTMLAttributes } from 'vue';
 import { defineComponent } from 'vue';
 import useConfigInject from '../_util/hooks/useConfigInject';
diff --git a/components/vc-dialog/IDialogPropTypes.ts b/components/vc-dialog/IDialogPropTypes.ts
index f1112bd19..e12daa133 100644
--- a/components/vc-dialog/IDialogPropTypes.ts
+++ b/components/vc-dialog/IDialogPropTypes.ts
@@ -1,4 +1,5 @@
-import type { ExtractPropTypes } from 'vue';
+import type { CSSProperties, ExtractPropTypes, PropType } from 'vue';
+import type { MouseEventHandler } from '../_util/EventInterface';
 import PropTypes from '../_util/vue-types';
 
 function dialogPropTypes() {
@@ -20,19 +21,19 @@ function dialogPropTypes() {
     maskTransitionName: String,
     animation: PropTypes.any,
     maskAnimation: PropTypes.any,
-    wrapStyle: PropTypes.object,
-    bodyStyle: PropTypes.object,
-    maskStyle: PropTypes.object,
+    wrapStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+    bodyStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
+    maskStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
     prefixCls: String,
     wrapClassName: String,
-    width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    width: [String, Number],
+    height: [String, Number],
     zIndex: Number,
     bodyProps: PropTypes.any,
     maskProps: PropTypes.any,
     wrapProps: PropTypes.any,
     getContainer: PropTypes.any,
-    dialogStyle: PropTypes.object,
+    dialogStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
     dialogClass: String,
     closeIcon: PropTypes.any,
     forceRender: { type: Boolean, default: undefined },
@@ -40,7 +41,7 @@ function dialogPropTypes() {
     // https://github.com/ant-design/ant-design/issues/19771
     // https://github.com/react-component/dialog/issues/95
     focusTriggerAfterClose: { type: Boolean, default: undefined },
-    onClose: Function,
+    onClose: Function as PropType<MouseEventHandler>,
     modalRender: Function,
   };
 }
diff --git a/components/vc-drawer/src/IDrawerPropTypes.ts b/components/vc-drawer/src/IDrawerPropTypes.ts
index 0e1b25c57..8836a33de 100644
--- a/components/vc-drawer/src/IDrawerPropTypes.ts
+++ b/components/vc-drawer/src/IDrawerPropTypes.ts
@@ -1,5 +1,5 @@
 import PropTypes from '../../_util/vue-types';
-import type { PropType } from 'vue';
+import type { CSSProperties, PropType } from 'vue';
 
 export type IPlacement = 'left' | 'top' | 'right' | 'bottom';
 type ILevelMove = number | [number, number];
@@ -7,7 +7,7 @@ const props = () => ({
   prefixCls: String,
   width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
   height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  style: PropTypes.style,
+  style: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   class: String,
   placement: {
     type: String as PropType<IPlacement>,
@@ -23,10 +23,13 @@ const props = () => ({
   ease: String,
   showMask: { type: Boolean, default: undefined },
   maskClosable: { type: Boolean, default: undefined },
-  maskStyle: PropTypes.style,
+  maskStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   afterVisibleChange: Function,
   keyboard: { type: Boolean, default: undefined },
-  contentWrapperStyle: PropTypes.style,
+  contentWrapperStyle: {
+    type: Object as PropType<CSSProperties>,
+    default: undefined as CSSProperties,
+  },
   autofocus: { type: Boolean, default: undefined },
   open: { type: Boolean, default: undefined },
 });
diff --git a/components/vc-dropdown/Dropdown.tsx b/components/vc-dropdown/Dropdown.tsx
index 105eeb6be..43082ae59 100644
--- a/components/vc-dropdown/Dropdown.tsx
+++ b/components/vc-dropdown/Dropdown.tsx
@@ -1,3 +1,4 @@
+import type { CSSProperties, PropType } from 'vue';
 import { computed, defineComponent, ref, watch } from 'vue';
 import PropTypes from '../_util/vue-types';
 import Trigger from '../vc-trigger';
@@ -8,14 +9,14 @@ import classNames from '../_util/classNames';
 export default defineComponent({
   props: {
     minOverlayWidthMatchTrigger: { type: Boolean, default: undefined },
-    arrow: PropTypes.looseBool.def(false),
+    arrow: { type: Boolean, default: false },
     prefixCls: PropTypes.string.def('rc-dropdown'),
     transitionName: String,
     overlayClassName: PropTypes.string.def(''),
     openClassName: String,
     animation: PropTypes.any,
     align: PropTypes.object,
-    overlayStyle: PropTypes.style,
+    overlayStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
     placement: PropTypes.string.def('bottomLeft'),
     overlay: PropTypes.any,
     trigger: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]).def(
@@ -26,7 +27,7 @@ export default defineComponent({
     hideAction: PropTypes.array,
     getPopupContainer: Function,
     visible: { type: Boolean, default: undefined },
-    defaultVisible: PropTypes.looseBool.def(false),
+    defaultVisible: { type: Boolean, default: false },
     mouseEnterDelay: PropTypes.number.def(0.15),
     mouseLeaveDelay: PropTypes.number.def(0.1),
   },
diff --git a/components/vc-image/src/Image.tsx b/components/vc-image/src/Image.tsx
index 63cd85427..30af89d1b 100644
--- a/components/vc-image/src/Image.tsx
+++ b/components/vc-image/src/Image.tsx
@@ -31,7 +31,7 @@ export interface ImagePropsType extends Omit<ImgHTMLAttributes, 'placeholder' |
 export const imageProps = {
   src: String,
   wrapperClassName: String,
-  wrapperStyle: PropTypes.style,
+  wrapperStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   prefixCls: String,
   previewPrefixCls: String,
   placeholder: PropTypes.any,
diff --git a/components/vc-image/src/Preview.tsx b/components/vc-image/src/Preview.tsx
index fa8cdf8d1..55e9f4b1d 100644
--- a/components/vc-image/src/Preview.tsx
+++ b/components/vc-image/src/Preview.tsx
@@ -8,7 +8,6 @@ import LeftOutlined from '@ant-design/icons-vue/LeftOutlined';
 import RightOutlined from '@ant-design/icons-vue/RightOutlined';
 
 import classnames from '../../_util/classNames';
-import PropTypes from '../../_util/vue-types';
 import Dialog from '../../vc-dialog';
 import getIDialogPropTypes from '../../vc-dialog/IDialogPropTypes';
 import { getOffset } from '../../vc-util/Dom/css';
diff --git a/components/vc-mentions/src/KeywordTrigger.tsx b/components/vc-mentions/src/KeywordTrigger.tsx
index fa87e0243..bc9e9c53f 100644
--- a/components/vc-mentions/src/KeywordTrigger.tsx
+++ b/components/vc-mentions/src/KeywordTrigger.tsx
@@ -1,4 +1,3 @@
-import PropTypes from '../../_util/vue-types';
 import Trigger from '../../vc-trigger';
 import DropdownMenu from './DropdownMenu';
 import type { PropType } from 'vue';
diff --git a/components/vc-pagination/Pagination.tsx b/components/vc-pagination/Pagination.tsx
index 1d5a0a330..eccd943a1 100644
--- a/components/vc-pagination/Pagination.tsx
+++ b/components/vc-pagination/Pagination.tsx
@@ -38,14 +38,14 @@ export default defineComponent({
     total: PropTypes.number.def(0),
     pageSize: Number,
     defaultPageSize: PropTypes.number.def(10),
-    hideOnSinglePage: PropTypes.looseBool.def(false),
+    hideOnSinglePage: { type: Boolean, default: false },
     showSizeChanger: { type: Boolean, default: undefined },
-    showLessItems: PropTypes.looseBool.def(false),
+    showLessItems: { type: Boolean, default: false },
     // showSizeChange: PropTypes.func.def(noop),
     selectComponentClass: PropTypes.any,
-    showPrevNextJumpers: PropTypes.looseBool.def(true),
+    showPrevNextJumpers: { type: Boolean, default: true },
     showQuickJumper: PropTypes.oneOfType([PropTypes.looseBool, PropTypes.object]).def(false),
-    showTitle: PropTypes.looseBool.def(true),
+    showTitle: { type: Boolean, default: true },
     pageSizeOptions: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])),
     buildOptionText: Function,
     showTotal: Function,
diff --git a/components/vc-progress/src/types.ts b/components/vc-progress/src/types.ts
index e195ddad3..082f3d9b4 100644
--- a/components/vc-progress/src/types.ts
+++ b/components/vc-progress/src/types.ts
@@ -1,5 +1,4 @@
 import type { PropType, ExtractPropTypes } from 'vue';
-import PropTypes from '../../_util/vue-types';
 
 export type StrokeColorType = string | string[] | object;
 
diff --git a/components/vc-slick/default-props.js b/components/vc-slick/default-props.js
index 7cc7add33..8e9a0af61 100644
--- a/components/vc-slick/default-props.js
+++ b/components/vc-slick/default-props.js
@@ -1,54 +1,54 @@
 import PropTypes from '../_util/vue-types';
 
 const defaultProps = {
-  accessibility: PropTypes.looseBool.def(true),
+  accessibility: { type: Boolean, default: true },
   // 自定义高度
-  adaptiveHeight: PropTypes.looseBool.def(false),
+  adaptiveHeight: { type: Boolean, default: false },
   afterChange: PropTypes.any.def(null),
-  arrows: PropTypes.looseBool.def(true),
-  autoplay: PropTypes.looseBool.def(false),
+  arrows: { type: Boolean, default: true },
+  autoplay: { type: Boolean, default: false },
   autoplaySpeed: PropTypes.number.def(3000),
   beforeChange: PropTypes.any.def(null),
-  centerMode: PropTypes.looseBool.def(false),
+  centerMode: { type: Boolean, default: false },
   centerPadding: PropTypes.string.def('50px'),
   cssEase: PropTypes.string.def('ease'),
-  dots: PropTypes.looseBool.def(false),
+  dots: { type: Boolean, default: false },
   dotsClass: PropTypes.string.def('slick-dots'),
-  draggable: PropTypes.looseBool.def(true),
-  unslick: PropTypes.looseBool.def(false),
+  draggable: { type: Boolean, default: true },
+  unslick: { type: Boolean, default: false },
   easing: PropTypes.string.def('linear'),
   edgeFriction: PropTypes.number.def(0.35),
-  fade: PropTypes.looseBool.def(false),
-  focusOnSelect: PropTypes.looseBool.def(false),
-  infinite: PropTypes.looseBool.def(true),
+  fade: { type: Boolean, default: false },
+  focusOnSelect: { type: Boolean, default: false },
+  infinite: { type: Boolean, default: true },
   initialSlide: PropTypes.number.def(0),
   lazyLoad: PropTypes.any.def(null),
-  verticalSwiping: PropTypes.looseBool.def(false),
+  verticalSwiping: { type: Boolean, default: false },
   asNavFor: PropTypes.any.def(null),
   // 圆点hover是否暂停
-  pauseOnDotsHover: PropTypes.looseBool.def(false),
+  pauseOnDotsHover: { type: Boolean, default: false },
   // focus是否暂停
-  pauseOnFocus: PropTypes.looseBool.def(false),
+  pauseOnFocus: { type: Boolean, default: false },
   // hover是否暂停
-  pauseOnHover: PropTypes.looseBool.def(true),
+  pauseOnHover: { type: Boolean, default: true },
   responsive: PropTypes.array,
   rows: PropTypes.number.def(1),
-  rtl: PropTypes.looseBool.def(false),
+  rtl: { type: Boolean, default: false },
   slide: PropTypes.string.def('div'),
   slidesPerRow: PropTypes.number.def(1),
   slidesToScroll: PropTypes.number.def(1),
   slidesToShow: PropTypes.number.def(1),
   speed: PropTypes.number.def(500),
-  swipe: PropTypes.looseBool.def(true),
+  swipe: { type: Boolean, default: true },
   swipeEvent: PropTypes.any.def(null),
-  swipeToSlide: PropTypes.looseBool.def(false),
-  touchMove: PropTypes.looseBool.def(true),
+  swipeToSlide: { type: Boolean, default: false },
+  touchMove: { type: Boolean, default: true },
   touchThreshold: PropTypes.number.def(5),
-  useCSS: PropTypes.looseBool.def(true),
-  useTransform: PropTypes.looseBool.def(true),
-  variableWidth: PropTypes.looseBool.def(false),
-  vertical: PropTypes.looseBool.def(false),
-  waitForAnimate: PropTypes.looseBool.def(true),
+  useCSS: { type: Boolean, default: true },
+  useTransform: { type: Boolean, default: true },
+  variableWidth: { type: Boolean, default: false },
+  vertical: { type: Boolean, default: false },
+  waitForAnimate: { type: Boolean, default: true },
   children: PropTypes.array,
   __propsSymbol__: PropTypes.any,
 };
diff --git a/components/vc-steps/Step.tsx b/components/vc-steps/Step.tsx
index 530512fa7..69bb8a1a3 100644
--- a/components/vc-steps/Step.tsx
+++ b/components/vc-steps/Step.tsx
@@ -1,5 +1,5 @@
 import PropTypes, { withUndefined } from '../_util/vue-types';
-import type { CSSProperties } from 'vue';
+import type { CSSProperties, PropType } from 'vue';
 import { defineComponent } from 'vue';
 import type { EventHandler } from '../_util/EventInterface';
 
@@ -9,7 +9,7 @@ function isString(str: any): str is string {
 function noop() {}
 export const VcStepProps = () => ({
   prefixCls: String,
-  wrapperStyle: PropTypes.style,
+  wrapperStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
   itemWidth: String,
   active: { type: Boolean, default: undefined },
   disabled: { type: Boolean, default: undefined },
diff --git a/components/vc-tooltip/src/Tooltip.tsx b/components/vc-tooltip/src/Tooltip.tsx
index ed9efeb74..698e39ac3 100644
--- a/components/vc-tooltip/src/Tooltip.tsx
+++ b/components/vc-tooltip/src/Tooltip.tsx
@@ -3,6 +3,7 @@ import Trigger from '../../vc-trigger';
 import { placements } from './placements';
 import Content from './Content';
 import { getPropsSlot } from '../../_util/props-util';
+import type { CSSProperties, PropType } from 'vue';
 import { defineComponent, ref, watchEffect } from 'vue';
 function noop() {}
 export default defineComponent({
@@ -16,18 +17,21 @@ export default defineComponent({
     transitionName: String,
     animation: PropTypes.any,
     afterVisibleChange: PropTypes.func.def(() => {}),
-    overlayStyle: PropTypes.style,
+    overlayStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
     overlayClassName: String,
     prefixCls: PropTypes.string.def('rc-tooltip'),
     mouseEnterDelay: PropTypes.number.def(0.1),
     mouseLeaveDelay: PropTypes.number.def(0.1),
     getTooltipContainer: Function,
-    destroyTooltipOnHide: PropTypes.looseBool.def(false),
+    destroyTooltipOnHide: { type: Boolean, default: false },
     align: PropTypes.object.def(() => ({})),
     arrowContent: PropTypes.any.def(null),
     tipId: String,
     builtinPlacements: PropTypes.object,
-    overlayInnerStyle: PropTypes.style,
+    overlayInnerStyle: {
+      type: Object as PropType<CSSProperties>,
+      default: undefined as CSSProperties,
+    },
     popupVisible: { type: Boolean, default: undefined },
     onVisibleChange: Function,
     onPopupAlign: Function,
diff --git a/components/vc-trigger/Trigger.tsx b/components/vc-trigger/Trigger.tsx
index 146a10af7..92de9e49c 100644
--- a/components/vc-trigger/Trigger.tsx
+++ b/components/vc-trigger/Trigger.tsx
@@ -1,4 +1,4 @@
-import type { HTMLAttributes } from 'vue';
+import type { CSSProperties, HTMLAttributes, PropType } from 'vue';
 import { computed, defineComponent, inject, provide, ref } from 'vue';
 import PropTypes from '../_util/vue-types';
 import contains from '../vc-util/Dom/contains';
@@ -56,7 +56,7 @@ export default defineComponent({
     onPopupVisibleChange: PropTypes.func.def(noop),
     afterPopupVisibleChange: PropTypes.func.def(noop),
     popup: PropTypes.any,
-    popupStyle: PropTypes.style,
+    popupStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
     prefixCls: PropTypes.string.def('rc-trigger-popup'),
     popupClassName: PropTypes.string.def(''),
     popupPlacement: String,
@@ -71,20 +71,20 @@ export default defineComponent({
     getPopupContainer: Function,
     getDocument: PropTypes.func.def(returnDocument),
     forceRender: { type: Boolean, default: undefined },
-    destroyPopupOnHide: PropTypes.looseBool.def(false),
-    mask: PropTypes.looseBool.def(false),
-    maskClosable: PropTypes.looseBool.def(true),
+    destroyPopupOnHide: { type: Boolean, default: false },
+    mask: { type: Boolean, default: false },
+    maskClosable: { type: Boolean, default: true },
     // onPopupAlign: PropTypes.func.def(noop),
     popupAlign: PropTypes.object.def(() => ({})),
     popupVisible: { type: Boolean, default: undefined },
-    defaultPopupVisible: PropTypes.looseBool.def(false),
+    defaultPopupVisible: { type: Boolean, default: false },
     maskTransitionName: String,
     maskAnimation: String,
     stretch: String,
     alignPoint: { type: Boolean, default: undefined }, // Maybe we can support user pass position in the future
-    autoDestroy: PropTypes.looseBool.def(false),
+    autoDestroy: { type: Boolean, default: false },
     mobile: Object,
-    getTriggerDOMNode: Function,
+    getTriggerDOMNode: Function as PropType<(d?: HTMLElement) => HTMLElement>,
   },
   setup(props) {
     const align = computed(() => {
diff --git a/components/vc-virtual-list/ScrollBar.tsx b/components/vc-virtual-list/ScrollBar.tsx
index 7de305254..282818cf3 100644
--- a/components/vc-virtual-list/ScrollBar.tsx
+++ b/components/vc-virtual-list/ScrollBar.tsx
@@ -1,10 +1,9 @@
-import type { PropType } from 'vue';
 import { defineComponent, reactive } from 'vue';
+import type { PropType } from 'vue';
 import classNames from '../_util/classNames';
 import createRef from '../_util/createRef';
 import raf from '../_util/raf';
 import supportsPassive from '../_util/supportsPassive';
-import PropTypes from '../_util/vue-types';
 
 const MIN_SIZE = 20;