chore: type optimization (#38460)

components/_util/getRenderPropValue.ts

@@ -9,9 +9,8 @@ export const getRenderPropValue = (
     return null;
   }
 
-  const isRenderFunction = typeof propValue === 'function';
+  if (typeof propValue === 'function') {
-  if (isRenderFunction) {
+    return propValue();
-    return (propValue as RenderFunction)();
   }
 
   return propValue;

components/_util/hooks/useSyncState.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import useForceUpdate from './useForceUpdate';
 
-type UseSyncStateProps<T> = [() => T, (newValue: T) => void];
+type UseSyncStateProps<T> = readonly [() => T, (newValue: T) => void];
 
 export default function useSyncState<T>(initialValue: T): UseSyncStateProps<T> {
   const ref = React.useRef<T>(initialValue);
@@ -14,5 +14,5 @@ export default function useSyncState<T>(initialValue: T): UseSyncStateProps<T> {
       // re-render
       forceUpdate();
     },
-  ];
+  ] as const;
 }

components/badge/ScrollNumber.tsx

@@ -75,7 +75,7 @@ const ScrollNumber: React.FC<ScrollNumberProps> = ({
       className: classNames(`${prefixCls}-custom-component`, oriProps?.className, motionClassName),
     }));
   }
-  return React.createElement(component as any, newProps, numberNodes);
+  return React.createElement(component, newProps, numberNodes);
 };
 
 export default ScrollNumber;

components/dropdown/dropdown.tsx

@@ -213,7 +213,7 @@ const Dropdown: DropdownInterface = props => {
     if (menu?.items) {
       overlayNode = <Menu {...menu} />;
     } else if (typeof overlay === 'function') {
-      overlayNode = (overlay as OverlayFunc)();
+      overlayNode = overlay();
     } else {
       overlayNode = overlay;
     }

components/input/hooks/useRemovePasswordTimeout.ts

@@ -5,10 +5,10 @@ export default function useRemovePasswordTimeout(
   inputRef: React.RefObject<InputRef>,
   triggerOnMount?: boolean,
 ) {
-  const removePasswordTimeoutRef = useRef<number[]>([]);
+  const removePasswordTimeoutRef = useRef<NodeJS.Timer[]>([]);
   const removePasswordTimeout = () => {
     removePasswordTimeoutRef.current.push(
-      window.setTimeout(() => {
+      setTimeout(() => {
         if (
           inputRef.current?.input &&
           inputRef.current?.input.getAttribute('type') === 'password' &&
@@ -25,7 +25,12 @@ export default function useRemovePasswordTimeout(
       removePasswordTimeout();
     }
 
-    return () => removePasswordTimeoutRef.current.forEach(item => window.clearTimeout(item));
+    return () =>
+      removePasswordTimeoutRef.current.forEach(timer => {
+        if (timer) {
+          clearTimeout(timer);
+        }
+      });
   }, []);
 
   return removePasswordTimeout;

components/modal/useModal/index.tsx

@@ -28,7 +28,7 @@ const ElementsHolder = React.memo(
 );
 
 export default function useModal(): [Omit<ModalStaticFunctions, 'warn'>, React.ReactElement] {
-  const holderRef = React.useRef<ElementsHolderRef>(null as any);
+  const holderRef = React.useRef<ElementsHolderRef>(null);
 
   // ========================== Effect ==========================
   const [actionQueue, setActionQueue] = React.useState<(() => void)[]>([]);
@@ -52,14 +52,14 @@ export default function useModal(): [Omit<ModalStaticFunctions, 'warn'>, React.R
 
         const modalRef = React.createRef<HookModalRef>();
 
-        let closeFunc: Function;
+        let closeFunc: Function | undefined;
         const modal = (
           <HookModal
             key={`modal-${uuid}`}
             config={withFunc(config)}
             ref={modalRef}
             afterClose={() => {
-              closeFunc();
+              closeFunc?.();
             }}
           />
         );

components/timeline/Timeline.tsx

@@ -45,7 +45,7 @@ const Timeline: TimelineType = props => {
   ) : null;
 
   const timeLineItems = React.Children.toArray(children);
-  timeLineItems.push(pendingItem as any);
+  timeLineItems.push(pendingItem!);
   if (reverse) {
     timeLineItems.reverse();
   }

components/typography/hooks/useMergedConfig.ts

@@ -3,8 +3,8 @@ import * as React from 'react';
 export default function useMergedConfig<Target>(
   propConfig: any,
   templateConfig?: Target,
-): [boolean, Target] {
+): readonly [boolean, Target] {
-  return React.useMemo(() => {
+  return React.useMemo<readonly [boolean, Target]>(() => {
     const support = !!propConfig;
 
     return [
@@ -13,6 +13,6 @@ export default function useMergedConfig<Target>(
         ...templateConfig,
         ...(support && typeof propConfig === 'object' ? propConfig : null),
       },
-    ];
+    ] as const;
   }, [propConfig]);
 }

components/typography/hooks/useUpdatedEffect.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 /** Similar with `useEffect` but only trigger after mounted */
-export default (callback: () => void, conditions: any[]) => {
+const useUpdatedEffect = (callback: () => void, conditions?: React.DependencyList) => {
   const mountRef = React.useRef(false);
 
   React.useEffect(() => {
@@ -12,3 +12,5 @@ export default (callback: () => void, conditions: any[]) => {
     }
   }, conditions);
 };
+
+export default useUpdatedEffect;