fix: ts error

Author: RylanBot

packages/components/date-picker/panel/PanelContent.tsx

@@ -132,7 +132,7 @@ export default function PanelContent(props: PanelContentProps) {
             position={partial}
             format={timeFormat}
             value={time || defaultTime}
-            onChange={onTimePickerChange}
+            onChange={(value) => onTimePickerChange?.(value)}
             isShowPanel={props.popupVisible}
             {...timePickerProps}
           />

packages/components/form/FormItem.tsx

@@ -122,6 +122,7 @@ const FormItem = forwardRef<FormItemInstance, FormItemProps>((originalProps, ref
 
   const { defaultInitialData } = useFormItemInitialData(name, fullPath, initialData, children);
 
+  // eslint-disable-next-line @eslint-react/use-state
   const [, forceUpdate] = useState({}); // custom render state
   const [freeShowErrorMessage, setFreeShowErrorMessage] = useState(undefined);
   const [errorList, setErrorList] = useState([]);
@@ -214,7 +215,7 @@ const FormItem = forwardRef<FormItemInstance, FormItemProps>((originalProps, ref
       return null;
     };
 
-    if (React.isValidElement(statusIcon)) {
+    if (React.isValidElement<Record<string, any>>(statusIcon)) {
       // @ts-ignore
       return resultIcon(
         React.cloneElement(statusIcon, {
@@ -495,7 +496,7 @@ const FormItem = forwardRef<FormItemInstance, FormItemProps>((originalProps, ref
             if (!child) return null;
 
             // Fragment can only have `key` and `children` props, skip props injection
-            if (!React.isValidElement(child) || child.type === React.Fragment) return child;
+            if (!React.isValidElement<Record<string, any>>(child) || child.type === React.Fragment) return child;
 
             const childType = child.type;
             const isCustomComp = typeof childType === 'object' || typeof childType === 'function';
@@ -512,7 +513,7 @@ const FormItem = forwardRef<FormItemInstance, FormItemProps>((originalProps, ref
               });
             }
 
-            const childProps = child.props as any;
+            const childProps = child.props;
             const commonProps = {
               disabled: disabledFromContext,
               readOnly: readOnlyFromContext,

packages/components/time-picker/TimePicker.tsx

@@ -111,7 +111,7 @@ const TimePicker = forwardRefWithStatics(
 
     const handlePanelChange: TimePickerPanelProps['onChange'] = (v, ctx) => {
       setCurrentValue(v);
-      onPick?.(v, ctx);
+      onPick?.(v, { e: ctx as unknown as React.MouseEvent<HTMLDivElement> });
     };
 
     return (

packages/components/time-picker/TimeRangePicker.tsx

@@ -19,6 +19,7 @@ import TimePickerPanel from './panel/TimePickerPanel';
 import type { FC } from 'react';
 import type { StyledProps } from '../common';
 import type { RangeInputPopupProps, RangeInputPosition } from '../range-input';
+import type { TimePickerPanelProps } from './panel/TimePickerPanel';
 import type { TdTimeRangePickerProps, TimeRangePickerPartial, TimeRangeValue } from './type';
 
 export interface TimeRangePickerProps extends TdTimeRangePickerProps, StyledProps {}
@@ -57,7 +58,7 @@ const TimeRangePicker: FC<TimeRangePickerProps> = (originalProps) => {
   const { TimeIcon } = useGlobalIcon({
     TimeIcon: TdTimeIcon,
   });
-  const [isPanelShowed, setPanelShow] = useState(false);
+  const [isPanelShowed, setIsPanelShowed] = useState(false);
   const [currentPanelIdx, setCurrentPanelIdx] = useState(undefined);
   const [currentValue, setCurrentValue] = useState(['', '']);
 
@@ -69,10 +70,10 @@ const TimeRangePicker: FC<TimeRangePickerProps> = (originalProps) => {
 
   const handleShowPopup: RangeInputPopupProps['onPopupVisibleChange'] = (visible, { trigger }) => {
     if (trigger === 'trigger-element-click') {
-      setPanelShow(true);
+      setIsPanelShowed(true);
       return;
     }
-    setPanelShow(visible);
+    setIsPanelShowed(visible);
   };
 
   function handlePickerValue(pickValue: string | string[], currentValue: string[]) {
@@ -105,10 +106,10 @@ const TimeRangePicker: FC<TimeRangePickerProps> = (originalProps) => {
     setCurrentPanelIdx(position === 'first' ? 0 : 1);
   };
 
-  const handleTimeChange = (newValue: string | string[], context: { e: React.MouseEvent }) => {
+  const handleTimeChange = (newValue: string | string[], e?: MouseEvent | UIEvent) => {
     const nextCurrentValue = handlePickerValue(newValue, currentValue);
     setCurrentValue(nextCurrentValue);
-    handleOnPick(nextCurrentValue, context);
+    handleOnPick(nextCurrentValue, { e: e as unknown as React.MouseEvent });
   };
 
   const autoSwapTime = (valueBeforeConfirm: Array<string>) => {
@@ -145,7 +146,7 @@ const TimeRangePicker: FC<TimeRangePickerProps> = (originalProps) => {
   const handleClickConfirm = () => {
     const isValidTime = !currentValue.find((v) => !validateInputValue(v, format));
     if (isValidTime) onChange(props.autoSwap ? autoSwapTime(currentValue) : currentValue);
-    setPanelShow(false);
+    setIsPanelShowed(false);
   };
 
   const handleFocus = (
@@ -206,7 +207,7 @@ const TimeRangePicker: FC<TimeRangePickerProps> = (originalProps) => {
             hideDisabledTime={hideDisabledTime}
             isFooterDisplay={true}
             value={currentValue[currentPanelIdx || 0]}
-            onChange={handleTimeChange}
+            onChange={handleTimeChange as TimePickerPanelProps['onChange']}
             handleConfirmClick={handleClickConfirm}
             position={currentPanelIdx === 0 ? 'start' : 'end'}
             activeIndex={currentPanelIdx}

packages/components/time-picker/panel/TimePickerPanel.tsx

@@ -13,12 +13,13 @@ import type { TimePickerProps } from '../TimePicker';
 import type { TimeRangePickerProps } from '../TimeRangePicker';
 import type { SinglePanelProps } from './SinglePanel';
 
-export interface TimePickerPanelProps extends SinglePanelProps {
+export interface TimePickerPanelProps extends Omit<SinglePanelProps, 'onChange'> {
   isShowPanel?: boolean;
   isFooterDisplay?: boolean; // 是否展示footer
   handleConfirmClick?: (defaultValue: dayjs.Dayjs | string) => void;
   presets?: TimePickerProps['presets'] | TimeRangePickerProps['presets'];
   activeIndex?: number;
+  onChange?: (value: string, e?: MouseEvent | UIEvent) => void;
 }
 
 type PresetValue = TimePickerPanelProps['presets'][keyof TimePickerPanelProps['presets']];
@@ -34,7 +35,7 @@ const TimePickerPanel: FC<TimePickerPanelProps> = (props) => {
     isShowPanel = true,
     presets = null,
   } = props;
-  const [triggerScroll, toggleTriggerScroll] = useState(false); // 触发滚动
+  const [triggerScroll, setTriggerScroll] = useState(false); // 触发滚动
   const { classPrefix } = useConfig();
 
   const TEXT_CONFIG = useTimePickerTextConfig();
@@ -52,23 +53,23 @@ const TimePickerPanel: FC<TimePickerPanelProps> = (props) => {
   }, [value, format]);
 
   useEffect(() => {
-    if (isShowPanel) toggleTriggerScroll(true);
+    if (isShowPanel) setTriggerScroll(true);
   }, [isShowPanel]);
 
   const resetTriggerScroll = useCallback(() => {
-    toggleTriggerScroll(false);
-  }, [toggleTriggerScroll]);
+    setTriggerScroll(false);
+  }, [setTriggerScroll]);
 
-  const handlePresetClick = (presetValue: PresetValue) => {
+  const handlePresetClick = (presetValue: PresetValue, e: React.MouseEvent) => {
     const presetVal = typeof presetValue === 'function' ? presetValue() : presetValue;
     if (typeof props.activeIndex === 'number') {
       if (Array.isArray(presetVal)) {
-        props.onChange?.(presetVal[props.activeIndex]);
+        props.onChange?.(presetVal[props.activeIndex], e.nativeEvent);
       } else {
         log.error('TimePicker', `preset: ${presets} 预设值必须是数组!`);
       }
     } else {
-      props.onChange?.(presetVal);
+      props.onChange?.(presetVal as string, e.nativeEvent);
     }
   };
 
@@ -80,8 +81,8 @@ const TimePickerPanel: FC<TimePickerPanelProps> = (props) => {
           theme="primary"
           size="small"
           variant="text"
-          onClick={() => {
-            handlePresetClick(presets[preset]);
+          onClick={(e) => {
+            handlePresetClick(presets[preset], e);
           }}
         >
           {preset}
@@ -94,8 +95,8 @@ const TimePickerPanel: FC<TimePickerPanelProps> = (props) => {
         theme="primary"
         variant="text"
         size="small"
-        onClick={() => {
-          onChange?.(dayjs().format(format));
+        onClick={(e) => {
+          onChange?.(dayjs().format(format), e.nativeEvent);
         }}
       >
         {TEXT_CONFIG.nowTime}
@@ -108,7 +109,7 @@ const TimePickerPanel: FC<TimePickerPanelProps> = (props) => {
       <div className={`${panelClassName}-section-body`}>
         <SinglePanel
           {...props}
-          onChange={onChange}
+          onChange={onChange as unknown as SinglePanelProps['onChange']}
           format={format}
           steps={steps}
           value={dayjs(value, format).isValid() ? value : defaultValue}