perf: ts type, close #5044

Author: tangjinzhou

components/_util/hooks/useConfigInject.ts

@@ -1,8 +1,9 @@
 import type { RequiredMark } from '../../form/Form';
-import type { ComputedRef, UnwrapRef, VNodeChild } from 'vue';
+import type { ComputedRef, UnwrapRef } from 'vue';
 import { computed, inject } from 'vue';
 import type { ConfigProviderProps, Direction, SizeType } from '../../config-provider';
 import { defaultConfigProvider } from '../../config-provider';
+import type { VueNode } from '../type';
 
 export default (
   name: string,
@@ -20,7 +21,7 @@ export default (
     requiredMark?: RequiredMark;
   }>;
   autoInsertSpaceInButton: ComputedRef<boolean>;
-  renderEmpty?: ComputedRef<(componentName?: string) => VNodeChild | JSX.Element>;
+  renderEmpty?: ComputedRef<(componentName?: string) => VueNode>;
   virtual: ComputedRef<boolean>;
   dropdownMatchSelectWidth: ComputedRef<boolean | number>;
   getPopupContainer: ComputedRef<ConfigProviderProps['getPopupContainer']>;

components/_util/type.ts

@@ -1,4 +1,4 @@
-import type { App, PropType, VNodeChild, Plugin, Ref } from 'vue';
+import type { App, PropType, Plugin, Ref, VNode } from 'vue';
 
 // https://stackoverflow.com/questions/46176165/ways-to-get-string-literal-type-of-array-values-without-enum-overhead
 export const tuple = <T extends string[]>(...args: T) => args;
@@ -29,7 +29,8 @@ export interface PropOptions<T = any, D = T> {
   validator?(value: unknown): boolean;
 }
 
-export type VueNode = VNodeChild | JSX.Element;
+declare type VNodeChildAtom = VNode | string | number | boolean | null | undefined | void;
+export type VueNode = VNodeChildAtom | VNodeChildAtom[] | JSX.Element;
 
 export const withInstall = <T>(comp: T) => {
   const c = comp as any;

components/_util/vue-types/index.ts

@@ -26,7 +26,7 @@ PropTypes.extend([
     default: undefined,
   },
   {
-    name: 'VNodeChild',
+    name: 'VueNode',
     getter: true,
     type: null,
   },
@@ -39,5 +39,5 @@ export function withUndefined<T extends { default?: any }>(type: T): T {
 export default PropTypes as VueTypesInterface & {
   readonly looseBool: VueTypeValidableDef<boolean>;
   readonly style: VueTypeValidableDef<CSSProperties>;
-  readonly VNodeChild: VueTypeValidableDef<VueNode>;
+  readonly VueNode: VueTypeValidableDef<VueNode>;
 };

components/alert/index.tsx

@@ -45,19 +45,19 @@ const alertProps = {
   /** Whether Alert can be closed */
   closable: PropTypes.looseBool,
   /** Close text to show */
-  closeText: PropTypes.VNodeChild,
+  closeText: PropTypes.any,
   /** Content of Alert */
-  message: PropTypes.VNodeChild,
+  message: PropTypes.any,
   /** Additional content of Alert */
-  description: PropTypes.VNodeChild,
+  description: PropTypes.any,
   /** Trigger when animation ending of Alert */
   afterClose: PropTypes.func.def(noop),
   /** Whether to show icon */
   showIcon: PropTypes.looseBool,
   prefixCls: PropTypes.string,
   banner: PropTypes.looseBool,
-  icon: PropTypes.VNodeChild,
-  onClose: PropTypes.VNodeChild,
+  icon: PropTypes.any,
+  onClose: PropTypes.any,
 };
 
 export type AlertProps = Partial<ExtractPropTypes<typeof alertProps>>;

components/anchor/AnchorLink.tsx

@@ -9,7 +9,7 @@ import { useInjectAnchor } from './context';
 const anchorLinkProps = {
   prefixCls: PropTypes.string,
   href: PropTypes.string.def('#'),
-  title: PropTypes.VNodeChild,
+  title: PropTypes.any,
   target: PropTypes.string,
 };
 

components/avatar/Avatar.tsx

@@ -23,7 +23,7 @@ export const avatarProps = {
   src: PropTypes.string,
   /** Srcset of image avatar */
   srcset: PropTypes.string,
-  icon: PropTypes.VNodeChild,
+  icon: PropTypes.any,
   alt: PropTypes.string,
   gap: PropTypes.number,
   draggable: PropTypes.bool,

components/badge/Badge.tsx

@@ -26,7 +26,7 @@ export const badgeProps = {
   // sync [email protected]
   size: PropTypes.oneOf(tuple('default', 'small')).def('default'),
   color: PropTypes.string,
-  text: PropTypes.VNodeChild,
+  text: PropTypes.any,
   offset: PropTypes.arrayOf(PropTypes.oneOfType([String, Number])),
   numberStyle: PropTypes.style,
   title: PropTypes.string,

components/button/buttonTypes.ts

@@ -36,7 +36,7 @@ const buttonProps = () => ({
   ghost: PropTypes.looseBool,
   block: PropTypes.looseBool,
   danger: PropTypes.looseBool,
-  icon: PropTypes.VNodeChild,
+  icon: PropTypes.any,
   href: PropTypes.string,
   target: PropTypes.string,
   title: PropTypes.string,

components/carousel/index.tsx

@@ -20,8 +20,8 @@ export const CarouselProps = {
   // style: PropTypes.React.CSSProperties,
   prefixCls: PropTypes.string,
   accessibility: PropTypes.looseBool,
-  nextArrow: PropTypes.VNodeChild,
-  prevArrow: PropTypes.VNodeChild,
+  nextArrow: PropTypes.any,
+  prevArrow: PropTypes.any,
   pauseOnHover: PropTypes.looseBool,
   // className: PropTypes.string,
   adaptiveHeight: PropTypes.looseBool,

components/cascader/index.tsx

@@ -133,7 +133,7 @@ const cascaderProps = {
     type: [Boolean, Object] as PropType<boolean | ShowSearchType | undefined>,
     default: undefined as PropType<boolean | ShowSearchType | undefined>,
   },
-  notFoundContent: PropTypes.VNodeChild,
+  notFoundContent: PropTypes.any,
   loadData: PropTypes.func,
   /** 次级菜单的展开方式，可选 'click' 和 'hover' */
   expandTrigger: PropTypes.oneOf(tuple('click', 'hover')),
@@ -147,7 +147,7 @@ const cascaderProps = {
   popupVisible: PropTypes.looseBool,
   fieldNames: { type: Object as PropType<FieldNamesType> },
   autofocus: PropTypes.looseBool,
-  suffixIcon: PropTypes.VNodeChild,
+  suffixIcon: PropTypes.any,
   showSearchRender: PropTypes.any,
   onChange: PropTypes.func,
   onPopupVisibleChange: PropTypes.func,