From 27342936f0eb31367c1d82cbecc780b6e55b5172 Mon Sep 17 00:00:00 2001
From: thislight <l1589002388@gmail.com>
Date: Wed, 9 Oct 2024 23:27:47 +0800
Subject: [PATCH] BottomSheet: set body overflow:hidden in animation

---
 src/material/BottomSheet.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/material/BottomSheet.tsx b/src/material/BottomSheet.tsx
index 690db27..e753e20 100644
--- a/src/material/BottomSheet.tsx
+++ b/src/material/BottomSheet.tsx
@@ -111,6 +111,8 @@ const BottomSheet: ParentComponent<BottomSheetProps> = (props) => {
     const rect = element.getBoundingClientRect();
     const easing = "cubic-bezier(0.4, 0, 0.2, 1)";
     element.classList.add(styles.animated);
+    const oldOverflow = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
     const distance = Math.abs(rect.left - window.innerWidth);
     const duration = (distance / MOVE_SPEED) * 1000;
 
@@ -127,6 +129,7 @@ const BottomSheet: ParentComponent<BottomSheetProps> = (props) => {
     );
     const onAnimationEnd = () => {
       element.classList.remove(styles.animated);
+      document.body.style.overflow = oldOverflow;
       animation = undefined;
     };
     animation.addEventListener("cancel", onAnimationEnd);
@@ -141,6 +144,8 @@ const BottomSheet: ParentComponent<BottomSheetProps> = (props) => {
     const rect = element.getBoundingClientRect();
     const easing = "cubic-bezier(0.4, 0, 0.2, 1)";
     element.classList.add(styles.animated);
+    const oldOverflow = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
     const distance = Math.abs(rect.top - window.innerHeight);
     const duration = (distance / MOVE_SPEED) * 1000;
 
@@ -157,6 +162,7 @@ const BottomSheet: ParentComponent<BottomSheetProps> = (props) => {
     );
     const onAnimationEnd = () => {
       element.classList.remove(styles.animated);
+      document.body.style.overflow = oldOverflow;
       animation = undefined;
     };
     animation.addEventListener("cancel", onAnimationEnd);