From efc894793eae5c52b0512e0bd94e5ff03ec6c262 Mon Sep 17 00:00:00 2001
From: thislight <l1589002388@gmail.com>
Date: Fri, 11 Oct 2024 16:40:43 +0800
Subject: [PATCH] BottomSheet: fix animation syntax error

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

diff --git a/src/material/BottomSheet.tsx b/src/material/BottomSheet.tsx
index 270b1c0..747126c 100644
--- a/src/material/BottomSheet.tsx
+++ b/src/material/BottomSheet.tsx
@@ -118,12 +118,12 @@ const BottomSheet: ParentComponent<BottomSheetProps> = (props) => {
 
     animation = element.animate(
       {
-        top: [rect.top, rect.top],
+        top: [`${rect.top}px`, `${rect.top}px`],
         left: reserve
           ? [`${rect.left}px`, `${window.innerWidth}px`]
           : [`${window.innerWidth}px`, `${rect.left}px`],
-        width: [rect.width, rect.width],
-        height: [rect.height, rect.height],
+        width: [`${rect.width}px`, `${rect.width}px`],
+        height: [`${rect.height}px`, `${rect.height}px`],
       },
       { easing, duration },
     );
@@ -151,12 +151,12 @@ const BottomSheet: ParentComponent<BottomSheetProps> = (props) => {
 
     animation = element.animate(
       {
-        left: [rect.left, rect.left],
+        left: [`${rect.left}px`, `${rect.left}px`],
         top: reserve
           ? [`${rect.top}px`, `${window.innerHeight}px`]
           : [`${window.innerHeight}px`, `${rect.top}px`],
-        width: [rect.width, rect.width],
-        height: [rect.height, rect.height],
+        width: [`${rect.width}px`, `${rect.width}px`],
+        height: [`${rect.height}px`, `${rect.height}px`],
       },
       { easing, duration },
     );