fix(toast): resolve an issue that the height was not measured correctly

chakra-ui · Apr 18, 2024 · ccb1fa5 · ccb1fa5
1 parent 2ac0f00
commit ccb1fa5
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/.changeset/real-bobcats-marry.md b/.changeset/real-bobcats-marry.md
@@ -0,0 +1,5 @@
+---
+"@zag-js/toast": patch
+---
+
+Fix an issue that the height was not exactly measured
diff --git a/packages/machines/toast/src/toast.machine.ts b/packages/machines/toast/src/toast.machine.ts
@@ -129,7 +129,7 @@ export function createToastMachine<T>(options: Options<T>) {
             const syncHeight = () => {
               const originalHeight = rootEl.style.height
               rootEl.style.height = "auto"
-              const newHeight = rootEl.offsetHeight
+              const newHeight = rootEl.getBoundingClientRect().height
               rootEl.style.height = originalHeight
 
               ctx.height = newHeight
@@ -173,7 +173,7 @@ export function createToastMachine<T>(options: Options<T>) {
             const originalHeight = rootEl.style.height
             rootEl.style.height = "auto"
 
-            const newHeight = rootEl.offsetHeight
+            const newHeight = rootEl.getBoundingClientRect().height
             rootEl.style.height = originalHeight
             ctx.height = newHeight