From 0fe28156ec6f1bca23d5d3a3b04a7cc2be291493 Mon Sep 17 00:00:00 2001
From: hanyuxinting <hanyuxinting@sina.cn>
Date: Tue, 20 May 2025 21:09:08 +0800
Subject: [PATCH 1/3] =?UTF-8?q?refactor(Overlay):=20=E6=9B=BF=E6=8D=A2csst?=
 =?UTF-8?q?ransition?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/packages/overlay/overlay.tsx | 34 ++++++++++++++++++--------------
 1 file changed, 19 insertions(+), 15 deletions(-)

diff --git a/src/packages/overlay/overlay.tsx b/src/packages/overlay/overlay.tsx
index 98667d689b..e260b6737d 100644
--- a/src/packages/overlay/overlay.tsx
+++ b/src/packages/overlay/overlay.tsx
@@ -5,7 +5,7 @@ import React, {
   useRef,
   useState,
 } from 'react'
-import { CSSTransition } from 'react-transition-group'
+import { useSpring, animated } from '@react-spring/web'
 import classNames from 'classnames'
 import { ComponentDefaults } from '@/utils/typings'
 import { useLockScroll } from '@/hooks/use-lock-scroll'
@@ -50,7 +50,7 @@ export const Overlay: FunctionComponent<
 
   const shouldLockScroll = !innerVisible ? false : lockScroll
   useLockScroll(nodeRef, shouldLockScroll)
-  const classes = classNames(classPrefix, className)
+  const classes = classNames(classPrefix, `${classPrefix}-slide`, className)
   const styles = {
     ...style,
     zIndex,
@@ -62,26 +62,30 @@ export const Overlay: FunctionComponent<
     }
   }
 
+  const springProps = useSpring({
+    opacity: innerVisible ? 1 : 0,
+    config: { duration },
+    onRest: () => {
+      if (innerVisible) {
+        afterShow()
+      } else {
+        afterClose()
+      }
+    },
+  })
+
   return (
-    <CSSTransition
-      nodeRef={nodeRef}
-      classNames={`${classPrefix}-slide`}
-      unmountOnExit
-      timeout={duration}
-      in={innerVisible}
-      onEntered={afterShow}
-      onExited={afterClose}
-    >
-      <div
+    innerVisible && (
+      <animated.div
         ref={nodeRef}
         className={classes}
-        style={styles}
+        style={{ ...styles, ...springProps }}
         {...rest}
         onClick={handleClick}
       >
         {children}
-      </div>
-    </CSSTransition>
+      </animated.div>
+    )
   )
 }
 

From d4b98de4983388124c80f208aec7d954f8fda8ef Mon Sep 17 00:00:00 2001
From: hanyuxinting <hanyuxinting@sina.cn>
Date: Tue, 20 May 2025 21:40:12 +0800
Subject: [PATCH 2/3] =?UTF-8?q?refactor:=20taro=20=E5=A4=9A=E7=AB=AF?=
 =?UTF-8?q?=E7=89=88=E6=9C=AC=E6=9B=B4=E6=96=B0,=E4=B8=8D=E8=BF=87?=
 =?UTF-8?q?=E9=B8=BF=E8=92=99=E6=9C=89=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/packages/overlay/overlay.taro.tsx | 49 ++++++++++++++++++++-------
 1 file changed, 36 insertions(+), 13 deletions(-)

diff --git a/src/packages/overlay/overlay.taro.tsx b/src/packages/overlay/overlay.taro.tsx
index 328835b230..36dfb6e1b0 100644
--- a/src/packages/overlay/overlay.taro.tsx
+++ b/src/packages/overlay/overlay.taro.tsx
@@ -1,5 +1,6 @@
 import React, { FunctionComponent, useEffect, useState } from 'react'
 import { CSSTransition } from 'react-transition-group'
+import { useSpring, animated } from '@react-spring/web'
 import classNames from 'classnames'
 import { ITouchEvent, View } from '@tarojs/components'
 import { ComponentDefaults } from '@/utils/typings'
@@ -44,7 +45,7 @@ export const Overlay: FunctionComponent<
     setInnerVisible(visible)
   }, [visible])
 
-  const classes = classNames(classPrefix, className)
+  const classes = classNames(classPrefix, `${classPrefix}-slide`, className)
   const styles = {
     zIndex,
     ...style,
@@ -56,17 +57,30 @@ export const Overlay: FunctionComponent<
     }
   }
 
-  const renderOverlay = () => (
-    <View
-      ref={nodeRef}
-      className={classes}
-      style={styles}
-      {...(rest as any)}
-      catchMove={lockScroll}
-      onClick={handleClick}
-    >
-      {children}
-    </View>
+  const springProps = useSpring({
+    opacity: innerVisible ? 1 : 0,
+    config: { duration },
+    onRest: () => {
+      if (innerVisible) {
+        afterShow()
+      } else {
+        afterClose()
+      }
+    },
+  })
+
+  return (
+    innerVisible && (
+      <animated.div
+        ref={nodeRef}
+        className={classes}
+        style={{ ...styles, ...springProps }}
+        {...rest}
+        onClick={handleClick}
+      >
+        {children}
+      </animated.div>
+    )
   )
 
   return (
@@ -79,7 +93,16 @@ export const Overlay: FunctionComponent<
       onEntered={afterShow}
       onExited={afterClose}
     >
-      {renderOverlay()}
+      <View
+        ref={nodeRef}
+        className={classes}
+        style={styles}
+        {...(rest as any)}
+        catchMove={lockScroll}
+        onClick={handleClick}
+      >
+        {children}
+      </View>
     </CSSTransition>
   )
 }

From 5129abb6d40cb7f28fa6ec27af290c349d96d811 Mon Sep 17 00:00:00 2001
From: hanyuxinting <hanyuxinting@sina.cn>
Date: Wed, 11 Jun 2025 15:56:32 +0800
Subject: [PATCH 3/3] =?UTF-8?q?fix:=20=E5=8E=BB=E6=8E=89taro=E7=AB=AF,?=
 =?UTF-8?q?=E5=B0=8F=E7=A8=8B=E5=BA=8F=E9=83=BD=E4=B8=8D=E6=94=AF=E6=8C=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/packages/overlay/overlay.taro.tsx | 49 +++++++--------------------
 1 file changed, 13 insertions(+), 36 deletions(-)

diff --git a/src/packages/overlay/overlay.taro.tsx b/src/packages/overlay/overlay.taro.tsx
index 36dfb6e1b0..328835b230 100644
--- a/src/packages/overlay/overlay.taro.tsx
+++ b/src/packages/overlay/overlay.taro.tsx
@@ -1,6 +1,5 @@
 import React, { FunctionComponent, useEffect, useState } from 'react'
 import { CSSTransition } from 'react-transition-group'
-import { useSpring, animated } from '@react-spring/web'
 import classNames from 'classnames'
 import { ITouchEvent, View } from '@tarojs/components'
 import { ComponentDefaults } from '@/utils/typings'
@@ -45,7 +44,7 @@ export const Overlay: FunctionComponent<
     setInnerVisible(visible)
   }, [visible])
 
-  const classes = classNames(classPrefix, `${classPrefix}-slide`, className)
+  const classes = classNames(classPrefix, className)
   const styles = {
     zIndex,
     ...style,
@@ -57,30 +56,17 @@ export const Overlay: FunctionComponent<
     }
   }
 
-  const springProps = useSpring({
-    opacity: innerVisible ? 1 : 0,
-    config: { duration },
-    onRest: () => {
-      if (innerVisible) {
-        afterShow()
-      } else {
-        afterClose()
-      }
-    },
-  })
-
-  return (
-    innerVisible && (
-      <animated.div
-        ref={nodeRef}
-        className={classes}
-        style={{ ...styles, ...springProps }}
-        {...rest}
-        onClick={handleClick}
-      >
-        {children}
-      </animated.div>
-    )
+  const renderOverlay = () => (
+    <View
+      ref={nodeRef}
+      className={classes}
+      style={styles}
+      {...(rest as any)}
+      catchMove={lockScroll}
+      onClick={handleClick}
+    >
+      {children}
+    </View>
   )
 
   return (
@@ -93,16 +79,7 @@ export const Overlay: FunctionComponent<
       onEntered={afterShow}
       onExited={afterClose}
     >
-      <View
-        ref={nodeRef}
-        className={classes}
-        style={styles}
-        {...(rest as any)}
-        catchMove={lockScroll}
-        onClick={handleClick}
-      >
-        {children}
-      </View>
+      {renderOverlay()}
     </CSSTransition>
   )
 }