From 769f67f28a8c59620f2d2b769f0af2ebb2a17e06 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?=
 <smith3816@gmail.com>
Date: Mon, 14 Aug 2023 19:10:25 +0800
Subject: [PATCH] fix: align not scrollable

---
 src/hooks/useAlign.ts | 24 ++++++++++++++++++++----
 1 file changed, 20 insertions(+), 4 deletions(-)

diff --git a/src/hooks/useAlign.ts b/src/hooks/useAlign.ts
index f8a2f95a..340a1358 100644
--- a/src/hooks/useAlign.ts
+++ b/src/hooks/useAlign.ts
@@ -164,20 +164,35 @@ export default function useAlign(
     if (popupEle && target && open) {
       const popupElement = popupEle;
 
+      const doc = popupElement.ownerDocument;
+      const win = getWin(popupElement);
+
+      const {
+        width,
+        height,
+        position: popupPosition,
+      } = win.getComputedStyle(popupElement);
+
       const originLeft = popupElement.style.left;
       const originTop = popupElement.style.top;
       const originRight = popupElement.style.right;
       const originBottom = popupElement.style.bottom;
 
-      const doc = popupElement.ownerDocument;
-      const win = getWin(popupElement);
-
       // Placement
       const placementInfo: AlignType = {
         ...builtinPlacements[placement],
         ...popupAlign,
       };
 
+      // placeholder element
+      const placeholderElement = doc.createElement('div');
+      popupElement.parentElement?.appendChild(placeholderElement);
+      placeholderElement.style.left = `${popupElement.offsetLeft}px`;
+      placeholderElement.style.top = `${popupElement.offsetTop}px`;
+      placeholderElement.style.position = popupPosition;
+      placeholderElement.style.height = `${popupElement.offsetHeight}px`;
+      placeholderElement.style.width = `${popupElement.offsetWidth}px`;
+
       // Reset first
       popupElement.style.left = '0';
       popupElement.style.top = '0';
@@ -203,7 +218,6 @@ export default function useAlign(
         };
       }
       const popupRect = popupElement.getBoundingClientRect();
-      const { width, height } = win.getComputedStyle(popupElement);
       const {
         clientWidth,
         clientHeight,
@@ -268,6 +282,8 @@ export default function useAlign(
       popupElement.style.right = originRight;
       popupElement.style.bottom = originBottom;
 
+      popupElement.parentElement?.removeChild(placeholderElement);
+
       // Calculate scale
       const scaleX = toNum(
         Math.round((popupWidth / parseFloat(width)) * 1000) / 1000,