fix: datepicker motionEnd

packages/semi-foundation/datePicker/foundation.ts

@@ -175,7 +175,6 @@ export interface DatePickerFoundationState {
     value: Date[];
     cachedSelectedValue: Date[];
     prevTimeZone: string | number;
-    motionEnd: boolean;
     rangeInputFocus: RangeType;
     autofocus: boolean;
     insetInputValue: InsetInputValue;
@@ -202,7 +201,6 @@ export interface DatePickerAdapter extends DefaultAdapter<DatePickerFoundationPr
     updateInputValue: (inputValue: string) => void;
     needConfirm: () => boolean;
     typeIsYearOrMonth: () => boolean;
-    setMotionEnd: (motionEnd: boolean) => void;
     setRangeInputFocus: (rangeInputFocus: DatePickerFoundationState['rangeInputFocus']) => void;
     couldPanelClosed: () => boolean;
     isEventTarget: (e: any) => boolean;

packages/semi-ui/datePicker/datePicker.tsx

@@ -188,7 +188,6 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
             value: [], // The currently selected date, each date is a Date object
             cachedSelectedValue: null, // Save last selected date, maybe include null
             prevTimeZone: null,
-            motionEnd: false, // Monitor if popover animation ends
             rangeInputFocus: undefined, // Optional'rangeStart ',' rangeEnd ', false
             autofocus: props.autoFocus || (this.isRangeType(props.type, props.triggerRender) && (props.open || props.defaultOpen)),
             insetInputValue: null,
@@ -272,7 +271,6 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
             needConfirm: () =>
                 ['dateTime', 'dateTimeRange'].includes(this.props.type) && this.props.needConfirm === true,
             typeIsYearOrMonth: () => ['month', 'year'].includes(this.props.type),
-            setMotionEnd: motionEnd => this.setState({ motionEnd }),
             setRangeInputFocus: rangeInputFocus => {
                 const { preventScroll } = this.props;
                 if (rangeInputFocus !== this.state.rangeInputFocus) {
@@ -420,7 +418,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
             insetInput,
             presetPosition
         } = this.props;
-        const { cachedSelectedValue, motionEnd, rangeInputFocus } = this.state;
+        const { cachedSelectedValue, rangeInputFocus } = this.state;
 
         const defaultValue = cachedSelectedValue;
         return (
@@ -448,7 +446,6 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
                 startDateOffset={startDateOffset}
                 endDateOffset={endDateOffset}
                 autoSwitchDate={autoSwitchDate}
-                motionEnd={motionEnd}
                 density={density}
                 rangeInputFocus={rangeInputFocus}
                 setRangeInputFocus={this.handleSetRangeFocus}
@@ -768,7 +765,6 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
                 stopPropagation={stopPropagation}
                 spacing={spacing}
                 onVisibleChange={this.handlePanelVisibleChange}
-                afterClose={()=>this.setState({ motionEnd: true }, ()=>this.setState({ motionEnd: false }))}
             >
                 {children}
             </Popover>

packages/semi-ui/datePicker/monthsGrid.tsx

@@ -66,7 +66,6 @@ export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGri
         startDateOffset: PropTypes.func,
         endDateOffset: PropTypes.func,
         autoSwitchDate: PropTypes.bool,
-        motionEnd: PropTypes.bool,
         density: PropTypes.string,
         dateFnsLocale: PropTypes.object.isRequired,
         timeZone: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
@@ -169,7 +168,7 @@ export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGri
     }
 
     componentDidUpdate(prevProps: MonthsGridProps, prevState: MonthsGridState) {
-        const { defaultValue, defaultPickerValue, motionEnd } = this.props;
+        const { defaultValue, defaultPickerValue } = this.props;
         if (prevProps.defaultValue !== defaultValue) {
             // we should always update panel state when value changes
             this.foundation.updateSelectedFromProps(defaultValue);
@@ -179,12 +178,6 @@ export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGri
             this.foundation.initDefaultPickerValue();
         }
 
-        if (prevProps.motionEnd !== motionEnd && motionEnd === true) {
-            if (this.foundation.isRangeType()) {
-                const currentPanelHeight = this.calcScrollListHeight();
-                this.setState({ currentPanelHeight });
-            }
-        }
 
         const isRange = this.foundation.isRangeType();
         if (isRange) {
@@ -240,14 +233,10 @@ export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGri
      * Calculate the height of the scrolling list, if the animation is not over, return 0
      */
     calcScrollListHeight = () => {
-        const { motionEnd } = this.props;
-        let wrapLeft, wrapRight, switchLeft, switchRight;
-        if (motionEnd) {
-            wrapLeft = this.adapter.getCache(`wrap-${strings.PANEL_TYPE_LEFT}`);
-            wrapRight = this.adapter.getCache(`wrap-${strings.PANEL_TYPE_RIGHT}`);
-            switchLeft = this.adapter.getCache(`switch-${strings.PANEL_TYPE_LEFT}`);
-            switchRight = this.adapter.getCache(`switch-${strings.PANEL_TYPE_RIGHT}`);
-        }
+        const wrapLeft = this.adapter.getCache(`wrap-${strings.PANEL_TYPE_LEFT}`);
+        const wrapRight = this.adapter.getCache(`wrap-${strings.PANEL_TYPE_RIGHT}`);
+        const switchLeft = this.adapter.getCache(`switch-${strings.PANEL_TYPE_LEFT}`);
+        const switchRight = this.adapter.getCache(`switch-${strings.PANEL_TYPE_RIGHT}`);
 
         const leftRect = wrapLeft && wrapLeft.getBoundingClientRect();
         const rightRect = wrapRight && wrapRight.getBoundingClientRect();