chore(deps-dev): bump @typescript-eslint/parser from 5.62.0 to 8.33.0

package.json

@@ -100,8 +100,8 @@
     "@types/react-transition-group": "^4.4.4",
     "@types/rimraf": "^4.0.5",
     "@types/tinycolor2": "^1.4.6",
-    "@typescript-eslint/eslint-plugin": "^5.6.0",
-    "@typescript-eslint/parser": "^5.6.0",
+    "@typescript-eslint/eslint-plugin": "^8.33.0",
+    "@typescript-eslint/parser": "^8.33.0",
     "@vitejs/plugin-react": "^4.4.1",
     "@vitest/coverage-istanbul": "^3.2.4",
     "@vitest/coverage-v8": "^3.2.4",

src/_util/forwardRefWithStatics.ts

@@ -1,7 +1,7 @@
 import React, { RefAttributes, forwardRef } from 'react';
 import hoistNonReactStatics from 'hoist-non-react-statics';
 
-export default function forwardRefWithStatics<P, T = any, S = {}>(
+export default function forwardRefWithStatics<P, T = any, S = object>(
   component: React.ForwardRefRenderFunction<T, P>,
   statics?: S,
 ): React.FunctionComponent<P & RefAttributes<T>> & S {

src/_util/parseTNode.ts

@@ -32,7 +32,7 @@ export function parseContentTNode<T>(tnode: TNode<T>, props: T) {
   if (!tnode || ['string', 'number', 'boolean'].includes(typeof tnode)) return tnode as ReactNode;
   try {
     return React.cloneElement(tnode as ReactElement, { ...props });
-  } catch (e) {
+  } catch {
     log.warn('parseContentTNode', `${tnode} is not a valid ReactNode`);
     return null;
   }

src/_util/react-render.ts

@@ -28,7 +28,7 @@ try {
   } else if (mainVersion >= 19) {
     createRoot = createRootClient;
   }
-} catch (e) {
+} catch {
   // Do nothing;
 }
 

src/_util/supportsPassive.ts

@@ -12,7 +12,7 @@ if (canUseDocument) {
       },
     });
     window.addEventListener('test-passive', null as any, opts);
-  } catch (e) {
+  } catch {
     //
   }
 }

src/action-sheet/ActionSheet.tsx

@@ -32,7 +32,9 @@ export const ActionSheet: React.FC<ActionSheetProps> = (props) => {
   const actionSheetClass = usePrefixClass('action-sheet');
 
   const [visible, setVisible] = useControlled(props, 'visible', (visible, context) => {
-    !visible && onClose?.(context);
+    if (!visible) {
+      onClose?.(context);
+    }
   });
 
   const handleCancel = (ev) => {

src/back-top/Backtop.tsx

@@ -46,7 +46,7 @@ const BackTop: React.FC<BackTopProps> = (props) => {
 
   const name = `${classPrefix}-back-top`;
 
-  const getContainer = (container: Function) => {
+  const getContainer = (container: TdBackTopProps['container']) => {
     if (typeof container === 'function') {
       return container();
     }

src/cell/Cell.tsx

@@ -52,7 +52,7 @@ const Cell: React.FC<CellProps> = (originProps) => {
 
   const handleClick = useCallback(
     (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
-      onClick && onClick({ e });
+      onClick?.({ e });
     },
     [onClick],
   );

src/dialog/Dialog.tsx

@@ -139,7 +139,7 @@ export const Dialog: React.FC<DialogProps> = (props) => {
     } else if (isValidElement(btn)) {
       result = btn;
     } else if (isObject(btn)) {
-      result = <Button {...defaultProps} {...(btn as {})} />;
+      result = <Button {...defaultProps} {...(btn as ButtonProps)} />;
     } else if (isFunction(btn)) {
       result = btn();
     }

src/fab/Fab.tsx

@@ -131,7 +131,7 @@ const Fab: React.FC<FabProps> = (originProps) => {
 
   useEffect(() => {
     const fab = fabRef.current;
-    fab && fab.addEventListener('touchmove', onTouchMove, { passive: false });
+    fab?.addEventListener('touchmove', onTouchMove, { passive: false });
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 

src/form/const.ts

@@ -1,12 +1,10 @@
-import { InjectionKey } from 'vue';
 import { FormItemValidateResult } from './FormItem';
 import {
   AllValidateResult,
   Data,
   FormItemValidateMessage,
   FormRule,
   TdFormItemProps,
-  TdFormProps,
   ValidateResultType,
   ValidateTriggerType,
 } from './type';
@@ -56,20 +54,3 @@ export interface FormItemContext {
   onBlur?: (value: any, ...args) => void;
   value?: any;
 }
-
-export const FormInjectionKey: InjectionKey<{
-  showErrorMessage: TdFormProps['showErrorMessage'];
-  labelWidth: TdFormProps['labelWidth'];
-  labelAlign: TdFormProps['labelAlign'];
-  contentAlign: TdFormProps['contentAlign'];
-  colon: TdFormProps['colon'];
-  requiredMark: TdFormProps['requiredMark'];
-  rules: TdFormProps['rules'];
-  errorMessage: TdFormProps['errorMessage'];
-  resetType: TdFormProps['resetType'];
-  children: FormItemContext[];
-}> = Symbol('FormProvide');
-
-export const FormItemInjectionKey: InjectionKey<{
-  handleBlur: () => Promise<void>;
-}> = Symbol('FormItemProvide');

src/guide/Guide.tsx

@@ -193,7 +193,9 @@ const Guide: FC<GuideProps> = (originProps) => {
       setHighlightLayerPosition(popoverWrapperRef.current, true);
       setHighlightLayerPosition(referenceLayerRef.current, true);
       scrollToElm(currentHighlightLayerElm.current);
-      isPopoverCenter && setReferenceFullW([referenceLayerRef.current, popoverWrapperRef.current]);
+      if (isPopoverCenter) {
+        setReferenceFullW([referenceLayerRef.current, popoverWrapperRef.current]);
+      }
       popoverRef.current?.updatePopper?.();
     });
   };
@@ -272,7 +274,9 @@ const Guide: FC<GuideProps> = (originProps) => {
 
   useEffect(() => {
     if (innerCurrent >= 0 && innerCurrent < stepsTotal) {
-      isPopover && setPopoverVisible(false);
+      if (isPopover) {
+        setPopoverVisible(false);
+      }
       initGuide();
     } else {
       setActived(false);

src/hooks/useControlled.ts

@@ -16,6 +16,7 @@ const useControlled: <P extends any[], R extends object, K extends keyof R>(
   onChange: ChangeHandler<R[K], P>,
   defaultOptions?:
     | {
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
         [key in DefaultOptions<ToString<K>>]: R[K];
       }
     | object,

src/image/Image.tsx

@@ -70,7 +70,7 @@ const Image: React.FC<ImageProps> = (props) => {
     const handleUnObserve = (element) => {
       const observer = observe(element, null, handleLoadImage, 0);
       return () => {
-        observer && observer.unobserve(element);
+        observer?.unobserve(element);
       };
     };
 

src/indexes/Indexes.tsx

@@ -159,13 +159,15 @@ const Indexes: React.FC<IndexesProps> = (props) => {
   };
 
   const relation = (ele: HTMLElement, anchor: string | number) => {
-    ele && childNodes.current.push({ ele, anchor });
+    if (ele) {
+      childNodes.current.push({ ele, anchor });
+    }
   };
 
   useEffect(() => {
     const clearSidebarTip = (): void => {
       if (showSidebarTip && activeSidebar !== null) {
-        tipTimer.current && clearTimeout(tipTimer.current);
+        clearTimeout(tipTimer.current);
         tipTimer.current = window.setTimeout(() => {
           setShowSidebarTip(false);
         }, 1000);
@@ -194,11 +196,11 @@ const Indexes: React.FC<IndexesProps> = (props) => {
     // https://github.com/facebook/react/pull/19654
     // react 中 onTouchMove 等事件默认使用 passive： true，导致无法在listener 中使用 preventDefault()
     const sideBar = sidebarRef.current;
-    sideBar && sideBar.addEventListener('touchmove', handleSidebarTouchmove, { passive: false });
+    sideBar?.addEventListener('touchmove', handleSidebarTouchmove, { passive: false });
 
     return () => {
-      tipTimer.current && clearTimeout(tipTimer.current);
-      sideBar && sideBar.removeEventListener('touchmove', handleSidebarTouchmove);
+      clearTimeout(tipTimer.current);
+      sideBar?.removeEventListener('touchmove', handleSidebarTouchmove);
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);

src/list/_example/base.tsx

@@ -38,7 +38,7 @@ export default function ListDemo() {
         stateRef.current = newListData;
         setIsLoading(false);
       }, 0);
-    } catch (err) {
+    } catch {
       stateRef.current = [];
     }
   };

src/locale/LocalReceiver.ts

@@ -5,12 +5,17 @@ export interface Placement {
   [propName: string]: string | number;
 }
 
-export type TransformPattern = string | Function | Array<string>;
+export type TransformPattern = string | ((placement?: Placement) => string | Array<string>) | Array<string>;
 
-export function useLocaleReceiver<T extends keyof Locale>(componentName: T, defaultLocale?: Locale[T] | Function) {
+type TransformLocaleFn = (pattern: TransformPattern, placement?: Placement) => string | Array<string>;
+
+export function useLocaleReceiver<T extends keyof Locale>(
+  componentName: T,
+  defaultLocale?: Locale[T] | (() => Locale[T]),
+) {
   const { globalConfig } = React.useContext(ConfigContext);
 
-  function transformLocale(pattern: TransformPattern, placement?: Placement): string | Array<string> {
+  const transformLocale: TransformLocaleFn = (pattern: TransformPattern, placement?: Placement) => {
     const REGEXP = /\{\s*([\w-]+)\s*\}/g;
     if (typeof pattern === 'string') {
       if (!placement || !REGEXP.test(pattern)) return pattern;
@@ -33,20 +38,20 @@ export function useLocaleReceiver<T extends keyof Locale>(componentName: T, defa
       return pattern(placement);
     }
     return '';
-  }
+  };
 
   /** @TypeA => 确保此参数是属于 globalConfig[componentName] 下的子属性 */
-  const componentLocale = React.useMemo<Locale[T] | Function>(() => {
+  const componentLocale = React.useMemo<Locale[T] | (() => Locale[T])>(() => {
     const locale = defaultLocale || {};
     const connectLocaleByName = globalConfig[componentName];
 
     const localeFromContext = componentName && globalConfig ? connectLocaleByName : {};
 
     return {
-      ...(typeof locale === 'function' ? (locale as Function)() : locale),
+      ...(typeof locale === 'function' ? locale() : locale),
       ...(localeFromContext || {}),
     };
   }, [componentName, defaultLocale, globalConfig]);
 
-  return [componentLocale, transformLocale] as [Locale[T], Function];
+  return [componentLocale, transformLocale] as [Locale[T], TransformLocaleFn];
 }

src/message/Message.tsx

@@ -75,7 +75,7 @@ const Message: React.FC<MessageProps> = (originProps) => {
   /**
    * 获取visibleChange函数引用
    */
-  const scrollingHandler = useRef<Function>(null);
+  const scrollingHandler = useRef<null | (() => void)>(null);
 
   /**
    * duration为0时，取消倒计时

src/message/hooks/useMessageCssTransition.ts

@@ -3,7 +3,7 @@ import { unmount } from '../../_util/react-render';
 
 interface UseMessageCssTransitionParams {
   contentRef: React.MutableRefObject<HTMLDivElement>;
-  classPrefix: String;
+  classPrefix: string;
   container: HTMLElement;
 }
 

src/navbar/Navbar.tsx

@@ -51,8 +51,8 @@ const Navbar: React.FC<NavbarProps> = (originProps) => {
     if (isStringTitle && !isNaN(titleMaxLength)) {
       if (titleMaxLength <= 0) {
         console.warn('titleMaxLength must be greater than 0');
-      } else if ((titleNode as String).length > titleMaxLength) {
-        titleNode = `${(titleNode as String).slice(0, titleMaxLength)}...`;
+      } else if ((titleNode as string).length > titleMaxLength) {
+        titleNode = `${(titleNode as string).slice(0, titleMaxLength)}...`;
       }
     }
 

src/notice-bar/NoticeBar.tsx

@@ -14,7 +14,7 @@ import { noticeBarDefaultProps } from './defaultProps';
 import noop from '../_util/noop';
 
 export interface NoticeBarProps extends TdNoticeBarProps, StyledProps {
-  touchable?: Boolean;
+  touchable?: boolean;
 }
 
 type IconType = ReturnType<typeof InfoCircleFilledIcon>;

src/picker/Picker.tsx

@@ -52,10 +52,13 @@ const Picker: FC<PickerProps> = (props) => {
 
   const [pickerValue = [], setPickerValue] = useDefault(value, defaultValue, onChange);
   const confirmButtonText = useMemo(
-    () => getDefaultText(confirmBtn, t(locale.confirm)),
+    () => getDefaultText(confirmBtn, t(locale.confirm) as string),
     [confirmBtn, t, locale.confirm],
   );
-  const cancelButtonText = useMemo(() => getDefaultText(cancelBtn, t(locale.cancel)), [cancelBtn, t, locale.cancel]);
+  const cancelButtonText = useMemo(
+    () => getDefaultText(cancelBtn, t(locale.cancel) as string),
+    [cancelBtn, t, locale.cancel],
+  );
   const [curValueArray, setCurValueArray] = useState(value?.map((item) => item) ?? []);
   const pickerItemInstanceArray = useRef<PickerItemExposeRef[]>([]);
 

src/picker/picker.class.ts

@@ -317,7 +317,9 @@ class Picker {
       this.list.style.transitionDuration = `${realOptions.duration}ms`;
       this.list.style.transitionTimingFunction = 'ease-out';
     }
-    realOptions.isChange && this.onChange(index);
+    if (realOptions.isChange) {
+      this.onChange(index);
+    }
   }
 
   /**

src/popover/Popover.tsx

@@ -69,7 +69,7 @@ const Popover = forwardRef<PopoverExposeRef, PopoverProps>((props, ref) => {
       x: number;
       y: number;
     };
-    placement: String;
+    placement: string;
   }) => {
     const horizontal = ['top', 'bottom'];
     const vertical = ['left', 'right'];

src/pull-down-refresh/PullDownRefresh.tsx

@@ -145,7 +145,7 @@ const PullDownRefresh: React.FC<PullDownRefreshProps> = (originProps) => {
     }
   };
 
-  const statusText = getStatusText(status, loadingTexts.length ? loadingTexts : t(locale.loadingTexts));
+  const statusText = getStatusText(status, loadingTexts.length ? loadingTexts : (t(locale.loadingTexts) as string[]));
   let statusNode: React.ReactNode = <div className={`${name}__text`}>{statusText}</div>;
   if (status === PullStatusEnum.loading) {
     statusNode = <Loading text={statusText} size="24px" {...loadingProps} />;

src/radio/Radio.tsx

@@ -82,13 +82,17 @@ const Radio = forwardRef((_props: RadioProps, ref: Ref<HTMLDivElement>) => {
       }
       if (icon === 'dot') {
         let dotIconClassName = `${radioClass}__icon-${icon}`;
-        disabled && (dotIconClassName += ` ${radioClass}__icon-${icon}--disabled`);
+        if (disabled) {
+          dotIconClassName += ` ${radioClass}__icon-${icon}--disabled`;
+        }
         return <div className={dotIconClassName} />;
       }
     } else {
       if (icon === 'circle' || icon === 'dot') {
         let circleIconClassName = `${radioClass}__icon-circle`;
-        disabled && (circleIconClassName += ` ${radioClass}__icon-circle--disabled`);
+        if (disabled) {
+          circleIconClassName += ` ${radioClass}__icon-circle--disabled`;
+        }
         return <div className={circleIconClassName} />;
       }
       if (icon === 'line') {

src/side-bar/SideBarContext.tsx

@@ -2,19 +2,19 @@ import React, { createContext, MutableRefObject, useMemo } from 'react';
 import { ChangeHandler } from '../_util/useDefault';
 import { TdSideBarProps } from './type';
 
+interface BaseSidebarContext {
+  defaultIndex: MutableRefObject<number>;
+  activeValue: number | string | (number | string)[];
+  updateChild: ChangeHandler<number | string | (number | string)[], any[]>;
+  relation: (child: any) => void;
+  removeRelation: (child: any) => void;
+  onClickItem: (cur: any, label: any) => void;
+}
+
 /**
  * SideBarContext is a React context that stores the state and actions related to the SideBar component.
  */
-export const SideBarContext = createContext<
-  {
-    defaultIndex: MutableRefObject<number>;
-    activeValue: number | string | (number | string)[];
-    updateChild: ChangeHandler<number | string | (number | string)[], any[]>;
-    relation: (child: any) => void;
-    removeRelation: (child: any) => void;
-    onClickItem: (cur: any, label: any) => void;
-  } & Pick<TdSideBarProps, 'onChange' | 'onClick'>
->(null);
+export const SideBarContext = createContext<BaseSidebarContext & Pick<TdSideBarProps, 'onChange' | 'onClick'>>(null);
 
 export function SideBarProvider({ children, value }) {
   const memoValue = useMemo(() => value, [value]);

src/skeleton/Skeleton.tsx

@@ -31,7 +31,7 @@ const Skeleton: React.FC<SkeletonProps> = (props) => {
     skeletonDefaultProps,
   );
 
-  const renderCols = (_cols: Number | SkeletonRowColObj | Array<SkeletonRowColObj>) => {
+  const renderCols = (_cols: number | SkeletonRowColObj | Array<SkeletonRowColObj>) => {
     let cols: Array<SkeletonRowColObj> = [];
     if (isArray(_cols)) {
       cols = _cols;