From 262c8f4735d7917e3b53ee1aca87deb4046afe44 Mon Sep 17 00:00:00 2001
From: Hassan Mojab <mh_mojab75@yahoo.com>
Date: Mon, 1 Jan 2024 17:53:04 +0330
Subject: [PATCH 1/2] Improve arrow positioning

---
 src/index.ts | 44 ++++++++++++++++++++++++++++++++++----------
 1 file changed, 34 insertions(+), 10 deletions(-)

diff --git a/src/index.ts b/src/index.ts
index 615cfcc..cf0d0bd 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -44,6 +44,12 @@ type AvailableVariants = {
     he: number;
 };
 
+type AvailableArrowVariants = {
+    s: number;
+    m: number;
+    e: number;
+};
+
 type PositionPairs = [Direction, Direction];
 
 export type PositionMatch = 'ts' | 'tm' | 'te' | 'bs' | 'bm' | 'be' | 'ls' | 'lm' | 'le' | 'rs' | 'rm' | 're';
@@ -190,19 +196,37 @@ export const reposition = (
             if (arrow) {
                 // Calculate refBox's center offset from its variant position for arrow positioning
                 const refBoxCenterOffset = vertical ? refBox.width / 2 : refBox.height / 2;
-
-                // When refBox is larger than popBox, have the arrow's variant position be the center of popBox instead.
-                const arrowVariantVal = refBoxCenterOffset * 2 < variantSize ?
-                    refBox[variantKey] + refBoxCenterOffset : variantVal + variantSize / 2;
-
-                // Arrow position is either on one side of the popBox or the other.
-                if (positionVal < refBox[positionKey]) {
-                    positionVal += positionSize;
-                }
+                const popBoxCenterOffset = variantSize / 2;
+
+                // Check if refBox is larger than popBox
+                const isRefBoxLarger = refBoxCenterOffset > popBoxCenterOffset;
+
+                /**
+                 * Holds corresponding offset variants (start, middle, end) of arrow from the popper variant values.
+                 * When refBox is larger than popBox, have the arrow's variant position be the center of popBox instead.
+                 */
+                const arrowVariantStore: AvailableArrowVariants = {
+                    s: isRefBoxLarger ? popBoxCenterOffset : refBoxCenterOffset,
+                    m: popBoxCenterOffset,
+                    e: isRefBoxLarger ? popBoxCenterOffset : variantSize - refBoxCenterOffset,
+                };
+
+                /**
+                 * Holds offsets of top, left, bottom and right alignment of arrow from the popper position values.
+                 */
+                const arrowPositionStore: AvailablePositions = {
+                    t: positionSize,
+                    b: 0,
+                    r: 0,
+                    l: positionSize
+                };
+
+                const arrowVariantVal = variantVal + arrowVariantStore[v as keyof AvailableArrowVariants];
+                const arrowPositionVal = positionVal + arrowPositionStore[p as keyof AvailablePositions];
 
                 // Apply styles to arrow
                 arrow.style[variantKey] = `${arrowVariantVal}px`;
-                arrow.style[positionKey] = `${positionVal}px`;
+                arrow.style[positionKey] = `${arrowPositionVal}px`;
             }
 
             return (p + v) as PositionMatch;

From 97aacb523620ae4cc3c0ab4b43935fa6db755988 Mon Sep 17 00:00:00 2001
From: Hassan Mojab <mh_mojab75@yahoo.com>
Date: Sun, 7 Jan 2024 16:58:02 +0330
Subject: [PATCH 2/2] Add tests for with arrow in transformed parent

---
 .../_pages/with-arrow-transformed-parent.html |  55 ++++++++++++++++++
 tests/arrow.spec.ts                           |   1 +
 ...row-transformed-parent-html-bottom-end.png | Bin 0 -> 5468 bytes
 ...-transformed-parent-html-bottom-middle.png | Bin 0 -> 5467 bytes
 ...w-transformed-parent-html-bottom-start.png | Bin 0 -> 5470 bytes
 ...arrow-transformed-parent-html-left-end.png | Bin 0 -> 5453 bytes
 ...ow-transformed-parent-html-left-middle.png | Bin 0 -> 5465 bytes
 ...row-transformed-parent-html-left-start.png | Bin 0 -> 5464 bytes
 ...rrow-transformed-parent-html-right-end.png | Bin 0 -> 5457 bytes
 ...w-transformed-parent-html-right-middle.png | Bin 0 -> 5470 bytes
 ...ow-transformed-parent-html-right-start.png | Bin 0 -> 5466 bytes
 ...-arrow-transformed-parent-html-top-end.png | Bin 0 -> 5465 bytes
 ...row-transformed-parent-html-top-middle.png | Bin 0 -> 5463 bytes
 ...rrow-transformed-parent-html-top-start.png | Bin 0 -> 5466 bytes
 14 files changed, 56 insertions(+)
 create mode 100644 tests/_pages/with-arrow-transformed-parent.html
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-bottom-end.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-bottom-middle.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-bottom-start.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-left-end.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-left-middle.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-left-start.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-right-end.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-right-middle.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-right-start.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-top-end.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-top-middle.png
 create mode 100644 tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-top-start.png

diff --git a/tests/_pages/with-arrow-transformed-parent.html b/tests/_pages/with-arrow-transformed-parent.html
new file mode 100644
index 0000000..34f9794
--- /dev/null
+++ b/tests/_pages/with-arrow-transformed-parent.html
@@ -0,0 +1,55 @@
+<div id="container">
+    <div id="transform">
+        <div id="reference"></div>
+        <div id="popper"></div>
+        <div id="arrow"></div>
+    </div>
+</div>
+
+<style>
+    @import '_reset.css';
+
+    #container {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    #transform {
+        transform: translate(10px, 10px);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    #reference {
+        width: 40px;
+        height: 40px;
+    }
+
+    #popper {
+        width: 100px;
+        height: 100px;
+    }
+
+    #arrow{
+        position: fixed;
+        width: 10px;
+        height: 10px;
+        background: black;
+        transform: translate(-50%, -50%) rotate(45deg);
+    }
+</style>
+
+<script type="module">
+    import {reposition} from '/dist/nanopop.mjs';
+
+    const reference = document.querySelector('#reference');
+    const popper = document.querySelector('#popper');
+    const arrow = document.querySelector('#arrow');
+
+    reposition(reference, popper, {
+        position: location.hash.slice(1),
+        arrow: arrow
+    });
+</script>
diff --git a/tests/arrow.spec.ts b/tests/arrow.spec.ts
index 1d590d8..a7a4e78 100644
--- a/tests/arrow.spec.ts
+++ b/tests/arrow.spec.ts
@@ -13,6 +13,7 @@ test.describe('Popper with arrow option', () => {
             test(`Should position ${pos} with proper arrow placement`, async ({ page }) => {
                 await testPage(page, `with-arrow-custom-position.html#${pos}`);
                 await testPage(page, `with-arrow-large-popper.html#${pos}`);
+                await testPage(page, `with-arrow-transformed-parent.html#${pos}`);
             });
         }
     }
diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-bottom-end.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-bottom-end.png
new file mode 100644
index 0000000000000000000000000000000000000000..bfa52494c9ad37ab4104e08bb55fdb9c8e1b480d
GIT binary patch
literal 5468
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_#XMac
zLn`LHy|vLdIZ(v)B7c!$%LN|a0M=<f28^)*%rpEH3>D`ZOcdmiayWGDasK+Lci$X|
z{+_WpYOfE_ECz>5A73zn7zh4wG=OLUH3lXi<uHSR1H?^aQUFmcoDCpqRB|*BMpMFQ
zc2EEn2BT%dXdsN%4x?4%XgguhH<onW_!$@y%-8wrx%vON^66*V7Z!$w<|oVopmO{W
zivx(_5M}^11QmQ3Sb$W60pm!P%rUG22Ey)*HTxuO85tVlPp~U6Fv!QOyMFo8zq&6x
z3=CxlKqBu!B6lA@eqCEzXIH?>z+nFr7^V&3|Bvmz-OfJ0fq}tT9oU>U@V$Ke$97dF
zCWbS!fz9dz^^fmQ<KSR0hzAy*2O58C{mbnHD*dbiR4TLK{jvSJf&vT)b$w>5ubzG(
z$iVQs;M?=eFD&<N#LVrR$G}i9p=Pv+KH3#w0D@uB9|IRoH>RJx`tk)Q1B1aFeg}}(
uMvJ4-Kp3r<Mr-Gh+zJ_OijmhI{mq@F>OOn&#0MFmn#9x9&t;ucLK6TLSU-aR

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-bottom-middle.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-bottom-middle.png
new file mode 100644
index 0000000000000000000000000000000000000000..1e7ea8fb348b0a5c5044173345cf7903e39fc115
GIT binary patch
literal 5467
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_MLk^{
zLn`LHy|vdjIZ?#*B72ddu#>TgqiBQ?BV%j;^9(<Qk1Zuk6W2-#*bBMI=U1<Nlcs)e
zm;3CiuPT{<hA~X)bLR)q40U}B93VQ8NdZK)a5jJ_0W}7YGKU$XlB0nzni58{!)Tc>
zS}=~*4hq0*Fj_^92Eq_&EZs=@0*tF~kAI#2`GQkE%I<E@JO+k>2{of_J6sK1T{mE>
zIKh6JzxiTy28IvZKN(mU9`ts9t%|yLzkePh!vVP;AQ5}<*I!G%|Jbp6{rPij>lhgx
z>;{GDhR;_2?%LV>U}0gHVaX`K(2zOn-m(3<f&vT)_gEYl81D7fM=L2X9H;?RCG77u
z|Jbg|#KdrBGO&$ZaA2R*|7|V~3=KamZ><SCzu29DValAizp}QC^*MU}ZvG4m5~tV|
zfU!AR{EP;|5Gj7}b{@fHQ^TyYPfxz!WMJ6vm{|Z6uZKYSgn@xWn1K;UDfj?08v{dw
z0WdQG!KmbDAdIGj(d;l<CX5!0z>*L>5aJm8^WA3~%sKxPR9Ses`njxgN@xNAu+cyU

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-bottom-start.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-bottom-start.png
new file mode 100644
index 0000000000000000000000000000000000000000..2a920d3468e705cf6b334f4973163a17123d9360
GIT binary patch
literal 5470
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_B|Kdm
zLn`LHy|veOcA`kz!|5lQm#CcH;Iiz%B+Z}=ti}yDS)`Vy2nR{3D%7dS?5)|pezo=8
z;QLnUyU#u=1RBP`;CVldAI$hC&nN(59Aa?*Q5?byj6h1khk*r1H5iOajt0VLN*K)!
zqh-Qq!8lqwH~_Q3Xcajc2t%Z?wBhO-U}H|^*wgRxH>>Z-{99mJ&BSmZ@Dn2kC<+sq
z6hKr9X9I{5P-9>MQVug1MzZ9#S+>Ad@8Jmhn6vX37!HU(VHRL$5I?v5_QrjC=h`we
zG%$Yv2HpXCph#hH{r{5qd2@YZm>CYF{{*&|ADsOBqrA5Kxv&63!b4DV`j~|N<NNbC
zI2bnMfWmtHvHiA!K)Ibjxd!F$aer<LGcqzv^8{+ONRscZuU1lEIPhuC8?)KRZz?k|
z{MaMEzwZ3J1My|z%QvetF!UJKK%!{Yh>oJsbUI8j>sn9`^nn31b$?(5Wg&*q-qvU!
rjP|yG`Cv2<Mgw8A%Sl>qYlFSXPWRbc%2RIx(+-2DtDnm{r-UW|kJBhj

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-left-end.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-left-end.png
new file mode 100644
index 0000000000000000000000000000000000000000..56aacfb1f24136667e686859815fb5ab058efe24
GIT binary patch
literal 5453
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_**#qx
zLn`LHy|vLdCQ!sR&_U$U1(hvL)dk`n&JGNrJJ`HSoJ{!co-BXG@l1KKd3p6(F26mc
zdj0K(%NT)XF{s3@l>^ZXHFAssAo>uC1Bl`fW&p`6_%N^lsRn~l$<aU<O$npfVYEyb
zEf_~@2M1s_7^zj{hSyh_85%y9e*TgDmE~Vi&5vDGObiUnl?*_V!C?ji2PkY3nG`@&
z3ugm}5>OkJ987@_yB^r)JFx%bm#4p9apv#(|2O$73q!;IN$d)s*rG+G9T51gufJNI
zfx%z`Fo75xIe$G|P=KM~F0irL;OOGO!0=57*xqatWMpKx;S6kYN_eoaFgyqWrlJD@
zN<ddF7XV7L2?M1o`auTV*_I13t>75QfP?$)-ix!je|POXMur2Dpz^s*=syF4MJq_<
zgdgk-2UdcVB_6Q{+5<L75GZ}a8)T2uA7+LJ${=Y)khGl>P>_N8O}#gtDlBqVy9148
zV3>cHd9<ZH+M}RFG8^r!jdodq#ouTkj0VC;ZJv&fRMDXMGT7^te+>Wlt(|99+MNeA
OusmJ;T-G@yGywn_h!zw8

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-left-middle.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-left-middle.png
new file mode 100644
index 0000000000000000000000000000000000000000..2d8c6e7aaaf9a7144503ed950c9b14711236f6b8
GIT binary patch
literal 5465
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_g*{yy
zLn`LHy|pngBvHaGF=d;8vquJN^@i@bjRzc7FJMc5(UQUYGR3#IME}vB@78wytob$1
z{uWeKSi~~|4P)@UzM36GGyLyk-~iEyObQ^Xg|h)f38*nJ0V#(WqmrY6Fq#rZv%_ea
zFj_E<)(#55Y%p3y4!1y%4dZ8E`1bnS>He$2KaRfqnD&*0fr0H41CV5BFkln_`S%cu
z1Bl`fW&kyx6nuuF<c7nqfR5kOzh2&c{k#v+$FDEHD$Ky}&s(km<TaYqan3UH=ZE_<
zFeE4dgE67wy}rJZ0t3TrP+8jC0VHx%f$dBlWhN$u4XwbYrojXb4u%6ufnnXS(8Ym)
zK~E7Rtp=3-pbl)G9w>PJxe^pPWuWkvcysyg-K*Pw|GsL>z;MG5WP!#<euf5b4xquz
zo%IY1F<u~LZhx2=61YLq0wC$NAk!6(*fTKPa{@^_0i_@4(kOcQK&|W#c75ypSF1BH
zY;dMwP}3*|2^m`!VG9iX^_L%?eZ|SZa3Fs8Wt(AC0*rcvVOW*uqwzT!pTIh7G!RAu
iVTiU#saAsh=6w3v`b{~v{5N2BVDNPHb6Mw<&;$Tj^fxvD

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-left-start.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-left-start.png
new file mode 100644
index 0000000000000000000000000000000000000000..cbbda04dccdda0eba9f06b3c357fd2f686a16677
GIT binary patch
literal 5464
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_g*;sx
zLn`LHy|p(mI#9$d@WToLC(DJRFB<hslv(-SXsu|Jv{DpWXeGE(Ioki<&i8rOy!<~M
ztv>g*aKHV1pkWLQp7Cz{V8%aLMgb7x5Q_td;t*zF1X2n<3@kvZ!C+K!G!RBp!f19F
zEfYoy#?jir0hkR&tH{wn7$S|O4QF34G90L?{rk<XipkzmZrlDn_4})T`FpS1Y;D^=
zkAdNX=1<zS^JW}*_qFs3u<@X#!obAf^XTbYUltaI1VdnxGC@g6fq}uBvw?wOvLGWP
zLxdC188aqua4;NL3T%fqcy<D1V!(nkK!Wc%Kq{^0pI@xbz_1~SNrB<O5xMv8^XqJE
zdgcMW*abF8=syF)jur+E1_Q;9{0t3H<AH(@<2!z^GaLv4=~X#m&%m%w5#%bTKg<jd
zq=14z&;l}rfk8kGD8azsFau~35G0Z>Ir}0r1H%vNvgOY&3IkoCDBl1wkb35m@3K*y
zgd!FccMV^y<hFs597FvHb_Gz}Q9X%_Mg*aV7!9G(5Tdjo9!*1|X=pSJQK3aMSTj;B
Y!z3l^SLW$uhd{Nor>mdKI;Vst091G|qW}N^

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-right-end.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-right-end.png
new file mode 100644
index 0000000000000000000000000000000000000000..efab630bd129e254c94a8997d0fcaaae768bfee0
GIT binary patch
literal 5457
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_xjkJR
zLn`LHy|pn{I6$KHqWBX>jfE$*(%6@AOwtURpm{?vPPJF_rb>uMNXWO}OV2;|DR}Mw
z{b7;SUVWfZ3<@s~e*w`956V~^Ks1Li10#@9@L^y9QVj--0wB>tqmrY6Fq#rZv%_ea
zFj_E<)(#`OisZY@%)pSacB`HJ|5@`6*z4W5_w{FBSa*bZw0;;W^}`zjTVUJn^^cDq
zUw>)&|LfcD=U-SD8g@Tn<N!7H5}6c0R10SVh!Rj^U;<JOGZ-k5Jg{T==gKN328U@t
zV-BnUa`x`q>wBJo;e-${Gf61_V`R894<yC$k)I)fAK2<_czeX2p`jMk@Z2W!pMl{U
zNZ}2)Kg<j_{1I)_hTOQm<6obCEUaQ<I1nocQsTwJ!f?YIs3gH!P=Fyp9%PoFk^;j4
zIgr1ST^tx1Zd?2C1Dm}2_R92UuiYBgUe3S}QVH~?!Ml8*<_EuM)Y_HPTYmZX7jQ5>
zFtZuag$Rv8c+}X@ZpvsiG*qgg(WW%R=s?TpXw&GB8?b#zc_6&upPp&qDR$UZ8)zJZ
Mr>mdKI;Vst0Nl$P_W%F@

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-right-middle.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-right-middle.png
new file mode 100644
index 0000000000000000000000000000000000000000..b55901c4fa1c4371e3837f01a0324502217e6e20
GIT binary patch
literal 5470
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_B|Kdm
zLn`LHy|pn{I6$KHBKs$WDGN_(rLiybShB>!aoGvJk6M{NGkq60En2kce*eBX#s}Bh
z-}Qgq-X6~lG>gIGmyIomX4oOeC;*}lu{eMz4q*mHAf@2LzyhQi3`QkK17S2JjAn<?
zGGVk}9IYK3fZ1TQiX3i%VC};XZ0c;i_UqS|;wq+kOZ$61{tOIyN0^6Q!-(%PGqA<i
zBOkxd-~Y$*-`}Ud<YZuwpTw>JiqaO&1`s8n#=r!m9A+?ZfVhcF3LuJH$;a>fmV+#b
z1R1j!$ocx~o0%;$gMv4(ftk?rgPozE79^#7#GawS7SsmaCj6g);hP|^8G6I(4>Q9J
zutMpN{0s^9NR82Lm3DI1x8J_~QWEHaE}&BngefU79Eby%b-S~Hf#Ej?kmwO$WMudz
z05nTNnTd%Z=6+%o15o|#&mVVOi+WvJ!Oq|?73BHH|6Ck^G44;BM(-N~U{kx{^p5)a
zne!MJ4%D9*rU@%y?bdVs=9h&T7$(___98~>31C(m4TRA^7#&#vrh(Bw7!3rZ=F4co
e=s=T#v5xs(q{SzVuYEf~#(TQ@xvX<aXaWFb6&`{B

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-right-start.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-right-start.png
new file mode 100644
index 0000000000000000000000000000000000000000..b747affe25af7f6468d43b7245d3e58e0877cba9
GIT binary patch
literal 5466
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_MLb;`
zLn`LHy|pn=BtWF?;_}U{5=l<l+5BOQ#sU%^qF)YdbK2BavS^}a@`m5*J{S5`O}78{
ztj@~b=1&~ZECz>5&tEcv7ze&`G=OLUH3lXi<uHSR1H?^aQUFmcoDCpqRB|*BMpMFQ
zc2EEn2BT%dXdsN%4x?4%XgguhH<o0Vu`@6fNZRkOnLqEty5HNMm%op%|8r|gOMPM8
zo|*F)7-Bm39YAF|hcE-EHK^djzyhQi3>XDKqK8-<Koq%>$L`McyDZGWunA<08<6w*
z>DSUKHU@`jz&7RqiI4mY4}O8AI_eo1szJ@r9QA*U3~!WyEzu2Af3P!bm=02C_DG)L
zKpj$vlk>U6W?laF?U#)i80<uVPHkB0;=s_b7i88pVMa!VZ-PMINGLKfF}zU(nq}a|
z!osj)-{CJnzu0YC{<v`M)@!Ff@G&%K$ph`|`7I69vcrZdUd9Nl4PaaK9{+n=Sp{rg
z|5pTAIohBe8iCLb>LP8p7WMr2?3bJj44!s0$RrpkhB|p~)K~{lJ|nm28r3-(e3Vvy
qqiJX~4UMKDP$^7dJCewZ^oGA{g2jhscAG^YJ3U?fT-G@yGywo}`atmj

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-top-end.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-top-end.png
new file mode 100644
index 0000000000000000000000000000000000000000..f70ca5cd91e43d22045b92d58b61091f2c5c47d6
GIT binary patch
literal 5465
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_g*{yy
zLn`LHy}R4@aDqfzV6zd2s!62kn*$;Wj*g7M8<-<ieKl^fSRHY_qq0ce-g5c2rQ7Si
zoV2?U7iZ@SG>pOF(!&>wAjW}r91S2^K#hS3NIA@4-~e$GnG`@&3ugm}8kHOkgwd2R
znjI8Cg~4c<Fd7JhwRX^T<7Z&FF?I6m_KU(5snw-6RZI*A;))nY>$K5|9hhr}MIdaG
zuw`IK2;UZde6jkU>gTV&mh8Xz=hfWHPm6ZNt}WZb!O*b(8Iu4*LjT=$VV7SP{e1lV
zs69i&PeBGohHrQLl^6VAXE5*wW#Id64j=g$685n;Ffc63{AI(`RnNfi8PpE^@TitW
z<Ua$$v-9x{j0_czOFsyMc>WA53=fze@-r-O2C_PKSXxQjKJ*svFJG+A!0<-(K2VT>
zp}~Mr07x+$0vXG|z#$B@mw`dSXGBXz_s9X8+V^)<?2)!*WN4^A!KwfXoYAUuG!O=B
yRXW<<AI+bmh1BRk2&kSK9Ss@{gh4(oXv_RtLATTT-P0qW1ncSQ=d#Wzp$P!$Qc+(3

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-top-middle.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-top-middle.png
new file mode 100644
index 0000000000000000000000000000000000000000..2150dad38f5fd1f54b634978e2979e45add8fbae
GIT binary patch
literal 5463
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_1wCCH
zLn`LHy}Q@<aDs$eV6zd2s!62kn*$;Wj*g7MDeMugYEyEUWFNUZOz5zyDfY|t_OJbV
z%I-!?oSi?=Fb0Q94_`2X7zf^QG=OLUH3lXi<uHSR1H?^aQUFmcoDCpqRB|*BMpMFQ
zc2EEn2BT%dXdn#M+CkTipMhb8<<2@8+eUM<@Z*cs85nq;G6{gv?I9Ki5XB+P0IK*D
zd>B}ORD%KIsN`rM455^eV^{@jrk#EEs^Uw_+PU}d`<L_c@2`4ZvU5&e_-a{QCWZ&=
zcLJ04jpXgCua@kJ$@{zK2Rnm-Jut@}n0MQZsjHrW;j;>`t@k0BMdUvN!!vK7;)Get
z)+;XnsmllD?DckT4j=g$68`;Rm0)NnzsF_|=7I8$o!~zP1}h+|p=0*q%@>9Dm44hJ
zXUoWtp#PH%sB^S-z!nHMlD+^#=HIcSm#e-23!Q(8;tfFlXsdcO5JuZlz%(!#2%~{8
rSR0h1z24FMsQ{{{MhmII90=c-9%Siuc6Nw+fa1#2)z4*}Q$iB}+CxNT

literal 0
HcmV?d00001

diff --git a/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-top-start.png b/tests/arrow.spec.ts-snapshots/with-arrow-transformed-parent-html-top-start.png
new file mode 100644
index 0000000000000000000000000000000000000000..1fc76c34e888baf3bf6d73b9e420817ade7ded68
GIT binary patch
literal 5466
zcmeAS@N?(olHy`uVBq!ia0y~yU<ERnE^x2`sq?jW!+;cHage(c!@6@aFBup_MLb;`
zLn`LHy}Q>}Igr8a;_*|h0-HLc4Q&HhJp^(XLN73HaY}NsO57}JA9Y~T#pHG8JD+Fn
z`|&FCSw?l`PaB|d3=K=-H?xBn4ENm`SU>^>i~=C;Ar=P^#UaeV2&5EzMkPlBVKgO-
zW{1%-VYFZz{Ix@lX*DpR{{Hy;{Np#Adp7K~nrX|(kkIpxO#vv(u!OS#L<y)dFaart
z84MgCZX%Nch-w*?91VmakrHlXeFLV~Z^_lAn?BF{{QGy|_YWH`&%FG#>Q0WC^?q)K
z2Fp9ZR+~kF`Rub6vFrE$+4F;)VS^1Yl^<yQoy8*ZpMhbTCs4tI%N!d27#Vb?1GB*a
ziO2s11O6~GM3@1aferQd+#EjgGbH@{!z#hh5FW>759WbNz<YxK7#OU8tcH%)k2l{G
zwk!EqVqML|aKP~sFHm~4<%lg1He7uJY(u>{e)RI&H=GO%e;o2gOQ6wW7?fK^>!Q&>
v7;SirHarwSg~4bObTkk~J0oQE$Zo_R-J;v6weh1MC?k2g`njxgN@xNA27yEK

literal 0
HcmV?d00001