From a273748b6d8162b7f6e819200c5663963558ec2f Mon Sep 17 00:00:00 2001 From: Katie Langerman <18661030+langermank@users.noreply.github.com> Date: Thu, 20 Apr 2023 06:53:24 -0700 Subject: [PATCH] Bug fix: `ButtonGroup` borders (#3198) * fix hover borders * Create wicked-knives-sparkle.md * snaps * why so many snaps? * revert? * test(vrt): update snapshots --------- Co-authored-by: langermank --- .changeset/wicked-knives-sparkle.md | 5 +++++ ...oup-Icon-Buttons-dark-colorblind-linux.png | Bin 5378 -> 5369 bytes ...onGroup-Icon-Buttons-dark-dimmed-linux.png | Bin 5394 -> 5387 bytes ...-Icon-Buttons-dark-high-contrast-linux.png | Bin 5477 -> 5463 bytes .../ButtonGroup-Icon-Buttons-dark-linux.png | Bin 5378 -> 5369 bytes ...oup-Icon-Buttons-dark-tritanopia-linux.png | Bin 5378 -> 5369 bytes ...up-Icon-Buttons-light-colorblind-linux.png | Bin 5478 -> 5475 bytes ...Icon-Buttons-light-high-contrast-linux.png | Bin 5518 -> 5525 bytes .../ButtonGroup-Icon-Buttons-light-linux.png | Bin 5474 -> 5474 bytes ...up-Icon-Buttons-light-tritanopia-linux.png | Bin 5478 -> 5475 bytes src/ButtonGroup/ButtonGroup.tsx | 12 +++--------- .../__snapshots__/Button.test.tsx.snap | 12 +++--------- 12 files changed, 11 insertions(+), 18 deletions(-) create mode 100644 .changeset/wicked-knives-sparkle.md diff --git a/.changeset/wicked-knives-sparkle.md b/.changeset/wicked-knives-sparkle.md new file mode 100644 index 00000000000..760da1a2b88 --- /dev/null +++ b/.changeset/wicked-knives-sparkle.md @@ -0,0 +1,5 @@ +--- +"@primer/react": patch +--- + +Bug fix: `ButtonGroup` borders show incorrectly on hover diff --git a/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-dark-colorblind-linux.png b/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-dark-colorblind-linux.png index 64932a7e6f7d572dcf9daffbf40bbbc4340a8e14..1b03a407f821c30015c90db0d5ce01536272a770 100644 GIT binary patch delta 860 zcmZqD`l&g=Fmbb|i(^Q|oVRy3=0#tZJ@C-E+k}IY?d8FbD#!CLeUr`EA3R}=+dah> zv)1L_UwDZ*B6@Q`Gs_{7vwpHo792uBNp;u0_m*2c-~X@Ry=D2QH$P9`WdMSpc{0@? z`oVYM$%1U5^~>60ayCZvJuR|)_W7rUrKRPQOYU3m<{huvE4TV;R!sc*K3hJZ@}85M zpX-&+eJ+fNt(BN>SG((bEhEs<>oQL!|Ni_rJlR|=xpc48?6dXH9FzVjzAf9m@n+7k zS5>BE$wueS$IDi$0PU39xwp9v=(d}0Uhdet*Yb!>ebx5u=E-K&R$|>xH@bt&6TEHx zV*2T)J1SKS|JR!XC3lK^0qT@Ff6vi={`uo~@7`5RI|*{+=bwLWBm-qWbi9@QqOPtU ze`n^;`3pI`VY{g7a!%TfYKa7AngJwFMvV{FIG7IKfC>Y@BTku^N-5_MHnXa zNqvdmUuPRv^YzgTWuSn=B>#6Hr5+cUft(2o*clia7QA%M{Q}arK7Rkdqo2+5@Am@n z-#0hEzrWvK|Nr&;@B6+#m#NAJYTvT+^!002j+y-Nm&%>LE??ff@n((8_3I!j8y;JpSXvPtE`KcL&9S15GMjI{@$0q@ zwg+08VY>b_)t9PBZ|jVeoYIb6Mw< G&;$Vgf}Gd@ delta 867 zcmeyV*`zhWFkz3Ui(^Q|oVRy3=FPq?+3?W0+k}IY?d8FbLhAb_Z~LC`dtOtDX%WBU z^^)8o{;7Hj@2==vQD`)9-RwQh#4Eblq|>}=-o(Q{?fUdj{xA6S&wg{c$Njqge|E!racdqQG7xzsqPfao0cKdC_`s>MCqk3PzzB+Lk z69dD6ziR&T?C!siY{m0L~J-cJ~Zt2~3?;ZaaZ&&>-=g;fs^X-4m zIhkU#?DESU7W*Y;pZ)#u-Ch63huit**XRMQzVlqce&_!`N5zwS>J7uLuikhwr%&wj z@h!LC9!uLSx%&0h8@(qhKAx^-V_;|qzG3}By!&Z|O|?y4em?(3|3h!zo}F=4uK#FK z<*QJjVHFF$@&9^Sbmz`JnWX7cX5XH@F@~!ODDId1e!=|n&mX^g_fBBIGz%w4KZnp4ASqDtX~F+juk(-1 z|MzEl@On_dX{z)8(vROKbKb7H3~Zjl(>h=3QK&5}q zzFr@aV z;p^k${ym<2{-168JYJx(_OdGr_P>vQAHM#6&+65uKVE;o&-zymP-4X=9!z&%Nq_PF z^V{3o^%gP%gRvjzkMc-apyC=E`!Ggw#`o)OnYG&FlZs`YGkw&Oci){? z1+r6a#op$+y>b07zdR{_Eqk}bO7`{FUstk$G9Mh?%6_@N`YJGnEsp4Eia!?zrj@x+ zO@EvJRhiz)zt{iy^JnKblMCwV49#YLfBY-z0?;u9QtUfL-p_wuCzae2zA;AUc#hd` zXS-ngnLfvI%%o2rE%G^*x99g$TcFYdnm+SvYWG=RN$fsaq%-Zb;r#Q*Z{EDQuQr)o`@_Wd&;bBow{K{5Bh;t&63MYcnHn^+5(#Qw7toY*PIEG`2IX$DVM KKbLh*2~7b0T%xJ~ diff --git a/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-dark-dimmed-linux.png b/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-dark-dimmed-linux.png index 1b05ebd875ed0ec9ecc041f8521eaa41b8a99e56..2b2eeb2a072c1acfd2a5dcc059ab0c8e16e37fd4 100644 GIT binary patch delta 878 zcmbQF)vYzbF!QLVi(^Q|oVRxk^P{gzHav6=G!vCj3fsTZ`hCHZDUcEZ@ot1&1VgBZ+?(gjXJ-KXn^S1Q!=jo3>efm@% zmh{go*KBrSWu@i0^XHE}v9FH<+IB!M*7^ni^X~flGxzVfam?oZo~uWX?kLYU<9ps6 z+s_14AY1l!!F-?%SzoiHH>a!#TYs#kaLa2$pxzya*U5hQp3a`UH!eSUS`W}K@6Pj; z*|Gtp%5Q9KuCtoEuRQ(P|M_RrKF95?KPnG&ncV$_>_AGvksqkYu}Ka{HkC+k!MRRdJ$zs|nyQ;AL8 zr!Vf;_x*kL`s3gG|H~d%??1ckJJ2x=vkS5v|JPsNU-Nyk_yb#@%0D0e+_b3s_s0GD z|KHzz-~27!w$~hJ&z+WN?qA#Qey#iSC!xCM-a5b^Ud|U%(Jjn|#tN z?c@v}HDI8cM^S(+2q<+WA^!fI;a^hX e0h_tli}=LV`!+@VId>f>#o+1c=d#Wzp$P!$Sg(oz delta 884 zcmeCynxr+sFyoA;i(^Q|oVRxk^P{gzHav6=6bs#<6uZUatx4>r6wRJDY&`#`@JN38 z+{81pn~Ak+k#pb|_8XftK_Pc^}+xP9VdG2TT@5#q1 z1|ZO6-z^8Cci2vDWDTu#u!v{w@~duQT+E|NndM zd*hit$4abZ_y4)N{&>yDggw8WJ>9W$XXX3fObiSMZs$Bv|K4x+C&Pzt+2i_0k8T&% z*6!UpN>#r)=V(9IuYOYcv-tSrK5zFwsRpQ$ zf1Z8iuN<4oUvI3>@B8=a^vCb}|9;*3{;%2Wd(sT`3=C$us~!JOxBvf=UHpM9Q01S; zM?Zi3boBFkoB#jrzfXQ&e)G#cpamN;qj`UA-}|-h)0dkSKOg=4@mRiY|JS{Y3=9iS zNrGaQL+A^T6i|5q6jI1oo&Mtfv)AkQm2k=eMekfX*L*Lv6v!&5t}8zVq;YW7LEZ+>ie_u9^1x_>_>Y>ny#IncWH?O7Y3i>=FdoIHB&yx&nhASb8s l{pO7vrPa1 diff --git a/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-dark-high-contrast-linux.png b/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-dark-high-contrast-linux.png index 95fa59bdd8b047063dba2e8c6dac3728638d07c1..3963ab15c0f3824765fec7d9d58b6a6bc324fca9 100644 GIT binary patch delta 965 zcmaE=bzN(MVZETIi(^Q|oVR!F^XH~Z9(bs}bn4v63YI~^)|#s?+p9>JeqapI?yuLsc=Ab|{<Ucc9H-mh!Mk8fT5T3G)1T;q{Hj<@dC8koJm zBPYK;Uh=$-PM`eWAIm?-aWXJ8IOm;rtbca&eP8S1$%T*gucvK1fBjzk`g$9+Y{%-b9^_#UH5`5Ht*YCCi%GmVXU&s!0f`TJI zkmuMW2PB)GNqw2Fzu!8p{;&Gy7+}yaOah9ehlL+s8LSNz*i(e09uoYvwE@j~@pa{M z>LX+S9{TJpuHOU1HSccD&fjZ$ul|4eZ@b@tX|~cp^S&K!Wc^$H{_itx@dvTHDiZ%x z)+Vo6pI`It=l_3uhd2|FA%n?ymhTGodovY>rn#8x!mi_P7)#1lZ zt-QSXhU()lpYKavH(z%KA-Q(8dHu1H=bJx%+WG!$(){&%H$T62Z2!C5{{8oV-QE)p zbngR!*(aA)$k+Zj_~ZP$cM;W3*^?`uUWthKlU5tNf5Q%oY2kjo@8|!2xTC(_>fev{ z`{%1wK{oGHp8VLGKfUzED{lSX&Dqb7pL{;;cuG-D*m1jSCF$uteX|boSfBM1B`BQ*W44$rj JF6*2UngHd9&kFzm delta 975 zcmcbv^;BzuVZFSki(^Q|oVRytdrN#s8P(#Z>;^%R8SPsGEONZsPGr zcfZPgda=0s@lRp>p0~xtk3Utv?~69i>p5@tKS%0!?b`YO-aLP7zW>+Lw(~Q6o*jR5 zZf^4Xf5(r#s{e0%Zr|5qZRc6)85kOV&pf63{rvojM4xBRkI%nvXT2^y_U4uu_kFUn z%a5H>m+$93{ruRSlscLEcj}wtIDtBJbM89Uzc{gRV{KmEp4x9~Gv7=uc=@Px+M~?`}o?~=F2yF zpE^6+{Mfp?)oFX#fU?n7b~V=-&8$(LKl8s;cKN%W)>e0@%#`;Rm>C!xCM*C3LxX}N zKTx%!G5;^)^f*~{zdse%vVj5)r_MD0>uhE}zOS}A9ch~^49Oa9$#O4IQ{m-koo-`BOjuAJPsr>1Vtr&Ic7 zwPrw>kjgeWAl1ZT3nW=MtAHfOtt;vEFWx^rIz8^2kQGp%!o!%qN`E!bx`y`W)2cyA zgdj-;?C6ZUj{CQ5Gkf;z*)m{wrPS4}SyyL;2+Zs2<7Mwh-m&bB4H6SC@5>GkM}+0S zyXDi4f9I2(cT7+7x4gB1-aLDAu+DmLEKS#olZdbR__N~MkK)TW)E|DBnEd$K{`|iB zn4LDzxLo!rXpjA$ciWS5-=6z%ar5!xm)70Ae zv)1L_UwDZ*B6@Q`Gs_{7vwpHo792uBNp;u0_m*2c-~X@Ry=D2QH$P9`WdMSpc{0@? z`oVYM$%1U5^~>60ayCZvJuR|)_W7rUrKRPQOYU3m<{huvE4TV;R!sc*K3hJZ@}85M zpX-&+eJ+fNt(BN>SG((bEhEs<>oQL!|Ni_rJlR|=xpc48?6dXH9FzVjzAf9m@n+7k zS5>BE$wueS$IDi$0PU39xwp9v=(d}0Uhdet*Yb!>ebx5u=E-K&R$|>xH@bt&6TEHx zV*2T)J1SKS|JR!XC3lK^0qT@Ff6vi={`uo~@7`5RI|*{+=bwLWBm-qWbi9@QqOPtU ze`n^;`3pI`VY{g7a!%TfYKa7AngJwFMvV{FIG7IKfC>Y@BTku^N-5_MHnXa zNqvdmUuPRv^YzgTWuSn=B>#6Hr5+cUft(2o*clia7QA%M{Q}arK7Rkdqo2+5@Am@n z-#0hEzrWvK|Nr&;@B6+#m#NAJYTvT+^!002j+y-Nm&%>LE??ff@n((8_3I!j8y;JpSXvPtE`KcL&9S15GMjI{@$0q@ zwg+08VY>b_)t9PBZ|jVeoYIb6Mw< G&;$Vgf}Gd@ delta 867 zcmeyV*`zhWFkz3Ui(^Q|oVRy3=FPq?+3?W0+k}IY?d8FbLhAb_Z~LC`dtOtDX%WBU z^^)8o{;7Hj@2==vQD`)9-RwQh#4Eblq|>}=-o(Q{?fUdj{xA6S&wg{c$Njqge|E!racdqQG7xzsqPfao0cKdC_`s>MCqk3PzzB+Lk z69dD6ziR&T?C!siY{m0L~J-cJ~Zt2~3?;ZaaZ&&>-=g;fs^X-4m zIhkU#?DESU7W*Y;pZ)#u-Ch63huit**XRMQzVlqce&_!`N5zwS>J7uLuikhwr%&wj z@h!LC9!uLSx%&0h8@(qhKAx^-V_;|qzG3}By!&Z|O|?y4em?(3|3h!zo}F=4uK#FK z<*QJjVHFF$@&9^Sbmz`JnWX7cX5XH@F@~!ODDId1e!=|n&mX^g_fBBIGz%w4KZnp4ASqDtX~F+juk(-1 z|MzEl@On_dX{z)8(vROKbKb7H3~Zjl(>h=3QK&5}q zzFr@aV z;p^k${ym<2{-168JYJx(_OdGr_P>vQAHM#6&+65uKVE;o&-zymP-4X=9!z&%Nq_PF z^V{3o^%gP%gRvjzkMc-apyC=E`!Ggw#`o)OnYG&FlZs`YGkw&Oci){? z1+r6a#op$+y>b07zdR{_Eqk}bO7`{FUstk$G9Mh?%6_@N`YJGnEsp4Eia!?zrj@x+ zO@EvJRhiz)zt{iy^JnKblMCwV49#YLfBY-z0?;u9QtUfL-p_wuCzae2zA;AUc#hd` zXS-ngnLfvI%%o2rE%G^*x99g$TcFYdnm+SvYWG=RN$fsaq%-Zb;r#Q*Z{EDQuQr)o`@_Wd&;bBow{K{5Bh;t&63MYcnHn^+5(#Qw7toY*PIEG`2IX$DVM KKbLh*2~7b0T%xJ~ diff --git a/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-dark-tritanopia-linux.png b/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-dark-tritanopia-linux.png index 64932a7e6f7d572dcf9daffbf40bbbc4340a8e14..1b03a407f821c30015c90db0d5ce01536272a770 100644 GIT binary patch delta 860 zcmZqD`l&g=Fmbb|i(^Q|oVRy3=0#tZJ@C-E+k}IY?d8FbD#!CLeUr`EA3R}=+dah> zv)1L_UwDZ*B6@Q`Gs_{7vwpHo792uBNp;u0_m*2c-~X@Ry=D2QH$P9`WdMSpc{0@? z`oVYM$%1U5^~>60ayCZvJuR|)_W7rUrKRPQOYU3m<{huvE4TV;R!sc*K3hJZ@}85M zpX-&+eJ+fNt(BN>SG((bEhEs<>oQL!|Ni_rJlR|=xpc48?6dXH9FzVjzAf9m@n+7k zS5>BE$wueS$IDi$0PU39xwp9v=(d}0Uhdet*Yb!>ebx5u=E-K&R$|>xH@bt&6TEHx zV*2T)J1SKS|JR!XC3lK^0qT@Ff6vi={`uo~@7`5RI|*{+=bwLWBm-qWbi9@QqOPtU ze`n^;`3pI`VY{g7a!%TfYKa7AngJwFMvV{FIG7IKfC>Y@BTku^N-5_MHnXa zNqvdmUuPRv^YzgTWuSn=B>#6Hr5+cUft(2o*clia7QA%M{Q}arK7Rkdqo2+5@Am@n z-#0hEzrWvK|Nr&;@B6+#m#NAJYTvT+^!002j+y-Nm&%>LE??ff@n((8_3I!j8y;JpSXvPtE`KcL&9S15GMjI{@$0q@ zwg+08VY>b_)t9PBZ|jVeoYIb6Mw< G&;$Vgf}Gd@ delta 867 zcmeyV*`zhWFkz3Ui(^Q|oVRy3=FPq?+3?W0+k}IY?d8FbLhAb_Z~LC`dtOtDX%WBU z^^)8o{;7Hj@2==vQD`)9-RwQh#4Eblq|>}=-o(Q{?fUdj{xA6S&wg{c$Njqge|E!racdqQG7xzsqPfao0cKdC_`s>MCqk3PzzB+Lk z69dD6ziR&T?C!siY{m0L~J-cJ~Zt2~3?;ZaaZ&&>-=g;fs^X-4m zIhkU#?DESU7W*Y;pZ)#u-Ch63huit**XRMQzVlqce&_!`N5zwS>J7uLuikhwr%&wj z@h!LC9!uLSx%&0h8@(qhKAx^-V_;|qzG3}By!&Z|O|?y4em?(3|3h!zo}F=4uK#FK z<*QJjVHFF$@&9^Sbmz`JnWX7cX5XH@F@~!ODDId1e!=|n&mX^g_fBBIGz%w4KZnp4ASqDtX~F+juk(-1 z|MzEl@On_dX{z)8(vROKbKb7H3~Zjl(>h=3QK&5}q zzFr@aV z;p^k${ym<2{-168JYJx(_OdGr_P>vQAHM#6&+65uKVE;o&-zymP-4X=9!z&%Nq_PF z^V{3o^%gP%gRvjzkMc-apyC=E`!Ggw#`o)OnYG&FlZs`YGkw&Oci){? z1+r6a#op$+y>b07zdR{_Eqk}bO7`{FUstk$G9Mh?%6_@N`YJGnEsp4Eia!?zrj@x+ zO@EvJRhiz)zt{iy^JnKblMCwV49#YLfBY-z0?;u9QtUfL-p_wuCzae2zA;AUc#hd` zXS-ngnLfvI%%o2rE%G^*x99g$TcFYdnm+SvYWG=RN$fsaq%-Zb;r#Q*Z{EDQuQr)o`@_Wd&;bBow{K{5Bh;t&63MYcnHn^+5(#Qw7toY*PIEG`2IX$DVM KKbLh*2~7b0T%xJ~ diff --git a/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-light-colorblind-linux.png b/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-light-colorblind-linux.png index 9ee657932930b501f1ee4b5593ed4b8e35c0ef80..a2fd494b31818c734ae4fafef81d2bf00b7d6a79 100644 GIT binary patch delta 978 zcmZWndrVq)7`@xHUE?O2MycHe%-ZVGHLjR;sO6!qjcr=nEL(%EuHrN!%&G&E$;5J< ztmzUdG%;OSXp5<-OUir@MA|WEQv_z!>PCzY>P5;NIH7do3Iw^_{mA}VvcJCMobPDk1o7e4evTozM?`9RQ^Qd zdJRN~;PhpupGEvn3dps$*m+uKp?68Ir&l`*ZlL$pM5V(QSa6lGRWVS@FtRd%KyG8s zhL4d;IUE{^#-cV(dt)&%48wBs8oJHCE^G)zqGEfEoF*kA zi!RA#bUUcx{%lVnmeO-as0yza@zQ6*Dj)snd+XmMMUiuItJNypiUd@O$^ZL z9$SF$rHCxOA~lpzKx4mOe9GCYLUzuCcR8`=Y=??ycY~Z!3OO_02R8BhZIg*2m5=-( zB8oS;22z~02*&t)zL$p}JM~R)Af(jm^+=2I6$pBiY5HRBjFXu=wGxk-Y@*UZ0ps>@ zAX?oVtKFAczU}o25(pJNsT=l;@5VyNOHT}^CGXE<10-Ldtss_s^>PPt>F0lu$vsg( zWbO5X`uWG_z|G6&u1_udaS|KWTuRy)!)_D7L!Oz4)#e2@{=4@tZGH0j^$=dHM&AO; z3ztu3#Fgy$CWGDG5lYI0(WkQxNk^zF7)J2p%vsHYLf61 zFN_Z#U}n&@fBFdazY*@5KOl-V(!X`exzyrF$LM^2R96P_Vy#Tke|Ah`0W9s45vW$fk1J0K-6nn93o6h+0+ zTSmtXWNS+t30#CJl&dnCOjlfm|c6k$tE+&#p z{ATGSuyv;}xNJDN)cl}M@h*3`9f<>S$zk$t>Fyl^N>ClnNuQxhsvU?md0!SC+~*#Y8+t)3@d(j%WTHASK8O zkuEssU*FpkOZPm%b{#T3U4z5p@hDGpN0~k_+V^+5&>~vKBd86EXUYZ_FWb6_lyKmWRE4I15c4 z4RK^av!3fS14^r}wXY_qI|bKnVcO+U!A0u0;9>R271O~ z@W*i!Y?n0&C+=#D>BtRAJAwOSjiMv_pEOMxz;L*;v6a!$kt7%_eudZe)9pPb+R{Xh^Z2$qsm8 zASm*~%CWIAIDkSbf_>jT?Y#ou=uFX87w`5c?zd@mSoIl!jrImx7TBtxQXkD9{x99= z(R6V;i^EYHn0nhCgP-udqdT;6lDPq@UY#AyrGnaiDJ8fSTiFiF&Clgg^3DCZp(l!* a_MF5^;Wv2!=`|3-G`@Sje(dem>;D4vqUIC; diff --git a/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-light-high-contrast-linux.png b/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-light-high-contrast-linux.png index 9a6174ae0dfc8a8e63a0f741d0d7d14b72d7b536..95c5fd8b16c9810f3100785d70764df3efa75ce8 100644 GIT binary patch delta 1037 zcmXw2drX>F6#q=I-C`8uA0<_TO}ceW$YgEmw1D`II#+FzWt&r57GGOdZG2R;C|`p$ zX2BwzaoSZxwvfeSf(&7syz1OQR|T|t;6zZqii(Q+1Qb3+b~W2S_ndpq`JHp_@0`mc z^^*9P;iCNPjQ5%cwwJDR1-^3+(9ldauE2Z{!UL z(=Xu0`^`Bb24&&>nUdiSM|Iv>7L8o} z>Dy0dPeTyI|6aWw4&;N7aOeyW=QHp7Bh2J78?VX5bU&31(q`t+51M|)3uLNdWB1lG?E#(}+eLBqNpCd`T z8rF=wk&$hg#&aR`hBW9^peyz?Yftg>f`anO%9c_MwuYLD=;vSzN!Y76NifZ`i$cr# z5t&SO%|<(LS}fMT<^A^07Uc^-#V}^=9Ui{c`jPh?P;RT78ij2p*9O;&hwM>>BGo9M zQYCQ2ec(I$i6H|HO-!QmqAZW)bwr%isSlpP6Ew%n9awnnY>I$4U2&zm?8?QS>3(*% z)`5qh^zM-8KPo|328Rev&e>RRb)kT`6Iu=CNPq##kBG!r`|d}kv{36~5-_BHk?RhF zp!0d=QxF8F^H0Vxbc&U%V}5k+4{2PDrh9Zrxj-qcu(Yx8}a7^G>bgNI^%>=t^V= z4*r75wCoz9s^UB8?Kr6rPSLI>0jR~$6z@$7Eo{itSM>^?uVu?Kqf%<=U-oH_mVkfs z5}00ZZ*N^-=?8;>xx?cU5_u}7yLHDlECg%j7ElpK2Nyw9Ov5VEP9%{?+*=V~&)e=C z{{Uy5`GebSNfNs{wKn9ti%d-BB3!bz-@uTW9)iL0;*VBRS{(kA2G`5xqre(L69bAK zSgjm(*JY(rsdqY^7MqROK-(ME9_~Ize~ut;VFO~ZSf*CfqT*AQjWhr-J^bnPF!RIKXFxN)-Y{hQaN ze`NQ~KQD9tOile}qxt8bGczzSctpm2V*=6#E(?DFQUWS3Ccj|wtMAkKv|;x4_kGbo zeBSPN&7Wke*e4gg%ip}X`0>?h_2WA?ryu*dIepq*KA@)dJEv;w=D+_wVg0^eS${s= zjqg3ad-KMPg^4oubxAVTWhH{Y|Aw#M|F8Mu%jNZz&x)5_etDyEhq2wC55FoNwkkiq z9=^V3dR*1Zndey<7#h?gJucM$|B`Mmf4}(=ya-Fmg~@2~gA@5|Xp?En2XpD#rZ=$b#fYws`o|Kr-+j}_%+dU1OUt2l=ka?`NTm0DLQw{)g&wwwarm z>GjQSk^{O(^=A2n`hNxKd;ZJ~7u)E4>h$_OMt1c(Hoq|i>b6+&P4>&>mnA-GlU?6T zGMedg?2BdfWP6~D?7w!PZiXfnTOi58Sp_6HqN*;;x3A8t`O@A$Z7&;8WQmULi|yOD zADF0ajzI~f-yMNnG%XPVVb&qfU z4qw-^z5dfTN>~!X50NM|=7vgx?7qY+9EB~Jo z)n5qI+^~Ghmj&N9Spij7RMizBxe}uKt@R7_$tQpOdc9s87+NJ(vXf7y+{^~5F7N7s^Tm60B zY3r}R$hot>JU^!H`==kT|Negbiv4{rP-*IVU}`&{xD}KWx-DK@T;hK+ diff --git a/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-light-linux.png b/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-light-linux.png index b3e3f5d2d291c5725de8b507903806840aaf2a9e..593e7070bdeb7c8d5a6bec0ba2b68d4bc463daa7 100644 GIT binary patch delta 968 zcmZuvZA?>V6uxeZE^))TC4f>|-KJfDKyIvnQYdWIp-JgtqB0}2&`e|Phs_wnTDZuT zxF3{GoheY3h7oIG<->KZEKoi~+i0iY7_4%~ZOc_!Qs`~hFWb^~Z?nJqbIy6sbDsA- z&w0;E-b&v0WjyieletrleYo{{K@4@;2?XF zb{$STj?|$q8ZGlQ{>A7*OLKGaqC2=(h24(GD~5_PahG?o^q`!N;(##K&7P;%HC^@l z{XXwA95&IrluFa|^t4q?h&AbTy7_h4=25QKUZ4;x|ZqBB%_;Pb94N{W&i_b%sK zvjDN)bDx+i;%GWyt+c6$zUa<^lLvdXFbKj2OaVG>*kdI2K1p+_BIajjH4(R-CGdutg}70LtiF zCo==o)__hThlo_A=SPhq?7<>S!DOO!$0bC~Cf){hD#zoF#22@)u!osVEF1T=#nfDG z1Ov!ttGP1Z-h4Lz>^mR2wm{G>*JG?7>ESRV)=ym^YcI13khxfGE{NqN|I=|HIiP4p2wpAJ9%{Cm!p!vC0A4Ko5 zn{3DuTL0pdS^hSwYO}EP^T*7eKTqC#Gw1WQ{|9r_gP(o=xnoyE&(q%5$(4`i&OO7z zz|ipCc=oc)U2lB#^z@D`KJI_an~8NFt@wV|`tg?%Q#so@tGZv4zn2+^12x8#y)1tbo}Qj8m3${g?|9m0rDylU zE}I-nGwyv_WO;1Hu~%jE{_4@m2UjF*a&VL+;_m{ri>~Al*|L52B_kO$yzxgc(sPo3Q zxom%r%m4qjl=;Iu`wEM9cmF=E_^g|IVp411ih8?brM-)PL`Lpptw0 z%gg^f{J#J8PmlpCKJnQCDHhHuAju&FcE*;=~Vsc=F!3e4xzNDqAu2<6wU`Fqghu zu)pr@t%$Yfwr%u2l~roCE`IkmL@-C2PfwnucdY(p*4Exyp|I6gXDmCrqxAE!ec`~6 z1)BS-{zZRZ-?6#3w;#W}exH>8eoOh&PkRfCij1Cp-u`;eUZ5+0i3@1@F_T=NDtjq+ zclY0M+`zbEHU*~9TgQ6Ooj-s4=H~jI`ntbgE#m)Y=e*qZzxl3=kNNDg#~wYYi241H z|5&eW`MUn2NgF5c1p4NKRy6l7!(%&k?2tG=-@ZQEfA9SB&mW(fsy*)vDB+Yx^MXP! w!TjDj@w;G0a%?`x*3Gy10NZRP@dfqF-i5C%L_Qo_3{=G6>FVdQ&MBb@0M0hq{{R30 diff --git a/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-light-tritanopia-linux.png b/.playwright/snapshots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-Icon-Buttons-light-tritanopia-linux.png index 9ee657932930b501f1ee4b5593ed4b8e35c0ef80..a2fd494b31818c734ae4fafef81d2bf00b7d6a79 100644 GIT binary patch delta 978 zcmZWndrVq)7`@xHUE?O2MycHe%-ZVGHLjR;sO6!qjcr=nEL(%EuHrN!%&G&E$;5J< ztmzUdG%;OSXp5<-OUir@MA|WEQv_z!>PCzY>P5;NIH7do3Iw^_{mA}VvcJCMobPDk1o7e4evTozM?`9RQ^Qd zdJRN~;PhpupGEvn3dps$*m+uKp?68Ir&l`*ZlL$pM5V(QSa6lGRWVS@FtRd%KyG8s zhL4d;IUE{^#-cV(dt)&%48wBs8oJHCE^G)zqGEfEoF*kA zi!RA#bUUcx{%lVnmeO-as0yza@zQ6*Dj)snd+XmMMUiuItJNypiUd@O$^ZL z9$SF$rHCxOA~lpzKx4mOe9GCYLUzuCcR8`=Y=??ycY~Z!3OO_02R8BhZIg*2m5=-( zB8oS;22z~02*&t)zL$p}JM~R)Af(jm^+=2I6$pBiY5HRBjFXu=wGxk-Y@*UZ0ps>@ zAX?oVtKFAczU}o25(pJNsT=l;@5VyNOHT}^CGXE<10-Ldtss_s^>PPt>F0lu$vsg( zWbO5X`uWG_z|G6&u1_udaS|KWTuRy)!)_D7L!Oz4)#e2@{=4@tZGH0j^$=dHM&AO; z3ztu3#Fgy$CWGDG5lYI0(WkQxNk^zF7)J2p%vsHYLf61 zFN_Z#U}n&@fBFdazY*@5KOl-V(!X`exzyrF$LM^2R96P_Vy#Tke|Ah`0W9s45vW$fk1J0K-6nn93o6h+0+ zTSmtXWNS+t30#CJl&dnCOjlfm|c6k$tE+&#p z{ATGSuyv;}xNJDN)cl}M@h*3`9f<>S$zk$t>Fyl^N>ClnNuQxhsvU?md0!SC+~*#Y8+t)3@d(j%WTHASK8O zkuEssU*FpkOZPm%b{#T3U4z5p@hDGpN0~k_+V^+5&>~vKBd86EXUYZ_FWb6_lyKmWRE4I15c4 z4RK^av!3fS14^r}wXY_qI|bKnVcO+U!A0u0;9>R271O~ z@W*i!Y?n0&C+=#D>BtRAJAwOSjiMv_pEOMxz;L*;v6a!$kt7%_eudZe)9pPb+R{Xh^Z2$qsm8 zASm*~%CWIAIDkSbf_>jT?Y#ou=uFX87w`5c?zd@mSoIl!jrImx7TBtxQXkD9{x99= z(R6V;i^EYHn0nhCgP-udqdT;6lDPq@UY#AyrGnaiDJ8fSTiFiF&Clgg^3DCZp(l!* a_MF5^;Wv2!=`|3-G`@Sje(dem>;D4vqUIC; diff --git a/src/ButtonGroup/ButtonGroup.tsx b/src/ButtonGroup/ButtonGroup.tsx index 93762b8574a..9e49b669aca 100644 --- a/src/ButtonGroup/ButtonGroup.tsx +++ b/src/ButtonGroup/ButtonGroup.tsx @@ -9,29 +9,23 @@ const ButtonGroup = styled.div` isolation: isolate; && > * { + margin-inline-end: -1px; position: relative; - border-right-width: 0; border-radius: 0; :first-child { border-top-left-radius: ${get('radii.2')}; border-bottom-left-radius: ${get('radii.2')}; - margin-right: 0; - } - - :not(:first-child) { - margin-left: 0; - margin-right: 0; } :last-child { - border-right-width: 1px; border-top-right-radius: ${get('radii.2')}; border-bottom-right-radius: ${get('radii.2')}; } :focus, - :active { + :active, + :hover { z-index: 1; } } diff --git a/src/__tests__/deprecated/__snapshots__/Button.test.tsx.snap b/src/__tests__/deprecated/__snapshots__/Button.test.tsx.snap index f7e8cc7944f..9c106f86e5a 100644 --- a/src/__tests__/deprecated/__snapshots__/Button.test.tsx.snap +++ b/src/__tests__/deprecated/__snapshots__/Button.test.tsx.snap @@ -293,30 +293,24 @@ exports[`ButtonGroup renders consistently 1`] = ` } .c0.c0 > * { + margin-inline-end: -1px; position: relative; - border-right-width: 0; border-radius: 0; } .c0.c0 > *:first-child { border-top-left-radius: 6px; border-bottom-left-radius: 6px; - margin-right: 0; -} - -.c0.c0 > *:not(:first-child) { - margin-left: 0; - margin-right: 0; } .c0.c0 > *:last-child { - border-right-width: 1px; border-top-right-radius: 6px; border-bottom-right-radius: 6px; } .c0.c0 > *:focus, -.c0.c0 > *:active { +.c0.c0 > *:active, +.c0.c0 > *:hover { z-index: 1; }