From 72958c00d9b80aa807f63a8f109a9b6f52c3b2da Mon Sep 17 00:00:00 2001
From: eternalsky <wsj7552715@hotmail.com>
Date: Wed, 27 Nov 2024 20:38:24 +0800
Subject: [PATCH] fix(Balloon): v2 default offset adjustment

---
 .../balloon/__tests__/balloon-v2-spec.tsx     | 46 +++++++++++++++++++
 components/balloon/balloon.tsx                |  2 +-
 2 files changed, 47 insertions(+), 1 deletion(-)

diff --git a/components/balloon/__tests__/balloon-v2-spec.tsx b/components/balloon/__tests__/balloon-v2-spec.tsx
index 731d769552..12884b7e9f 100644
--- a/components/balloon/__tests__/balloon-v2-spec.tsx
+++ b/components/balloon/__tests__/balloon-v2-spec.tsx
@@ -407,5 +407,51 @@ describe('Balloon v2', () => {
             );
             cy.get('span').should('have.length', 1);
         });
+
+        it('default offset should be 12px', () => {
+            const trigger = (
+                <div className="trigger" style={{ margin: '200px', display: 'inline-block' }}>
+                    trigger
+                </div>
+            );
+            cy.mount(
+                <Balloon v2 visible trigger={trigger}>
+                    trigger
+                </Balloon>
+            ).as('Demo');
+            cy.get('.trigger').then($el => {
+                const triggerRect = $el[0].getBoundingClientRect();
+                expect(Math.round(triggerRect.bottom + 12)).to.equal(
+                    Math.round(document.querySelector('.next-balloon')!.getBoundingClientRect().top)
+                );
+            });
+            cy.rerender('Demo', { align: 't' });
+            cy.get('.trigger').then($el => {
+                const triggerRect = $el[0].getBoundingClientRect();
+                expect(Math.round(triggerRect.top - 12)).to.equal(
+                    Math.round(
+                        document.querySelector('.next-balloon')!.getBoundingClientRect().bottom
+                    )
+                );
+            });
+            cy.rerender('Demo', { align: 'l' });
+            cy.get('.trigger').then($el => {
+                const triggerRect = $el[0].getBoundingClientRect();
+                expect(Math.round(triggerRect.left - 12)).to.equal(
+                    Math.round(
+                        document.querySelector('.next-balloon')!.getBoundingClientRect().right
+                    )
+                );
+            });
+            cy.rerender('Demo', { align: 'r' });
+            cy.get('.trigger').then($el => {
+                const triggerRect = $el[0].getBoundingClientRect();
+                expect(Math.round(triggerRect.right + 12)).to.equal(
+                    Math.round(
+                        document.querySelector('.next-balloon')!.getBoundingClientRect().left
+                    )
+                );
+            });
+        });
     });
 });
diff --git a/components/balloon/balloon.tsx b/components/balloon/balloon.tsx
index 298ebe959f..defb1aa488 100644
--- a/components/balloon/balloon.tsx
+++ b/components/balloon/balloon.tsx
@@ -356,7 +356,7 @@ class Balloon extends React.Component<BalloonProps, BalloonState> {
 
             Object.assign(otherProps, {
                 placement: align,
-                placementOffset: placementOffset + 12,
+                placementOffset: placementOffset,
                 v2: true,
                 beforePosition: this.beforePosition,
                 autoAdjust,