From 7507a16766870e248c27d1ff40042602e1249fba Mon Sep 17 00:00:00 2001 From: Owen Niblock Date: Mon, 29 Jan 2024 11:33:38 +0000 Subject: [PATCH 1/2] Improve aria-labels for example icon buttons and add guidance --- src/Button/IconButton.docs.json | 6 ++++++ src/Button/IconButton.features.stories.tsx | 14 +++++++------- src/Button/IconButton.stories.tsx | 6 +++--- 3 files changed, 16 insertions(+), 10 deletions(-) diff --git a/src/Button/IconButton.docs.json b/src/Button/IconButton.docs.json index ad1529202a8..9b8306fb460 100644 --- a/src/Button/IconButton.docs.json +++ b/src/Button/IconButton.docs.json @@ -35,6 +35,12 @@ "defaultValue": "", "description": "provide an octicon. It will be placed in the center of the button" }, + { + "name": "aria-label", + "type": "string", + "defaultValue": "", + "description": "Use an aria label to describe the functionality of the button. Please refer to [our guidance on alt text](https://primer.style/guides/accessibility/alternative-text-for-images) for tips on writing good alternative text." + }, { "name": "sx", "type": "SystemStyleObject" diff --git a/src/Button/IconButton.features.stories.tsx b/src/Button/IconButton.features.stories.tsx index 2f8b979aac3..0f27d91c397 100644 --- a/src/Button/IconButton.features.stories.tsx +++ b/src/Button/IconButton.features.stories.tsx @@ -6,16 +6,16 @@ export default { title: 'Components/IconButton/Features', } -export const Primary = () => +export const Primary = () => -export const Danger = () => +export const Danger = () => -export const Invisible = () => +export const Invisible = () => -export const Disabled = () => +export const Disabled = () => -export const Small = () => +export const Small = () => -export const Medium = () => +export const Medium = () => -export const Large = () => +export const Large = () => diff --git a/src/Button/IconButton.stories.tsx b/src/Button/IconButton.stories.tsx index a60e2fc9340..9422c85a01b 100644 --- a/src/Button/IconButton.stories.tsx +++ b/src/Button/IconButton.stories.tsx @@ -41,8 +41,8 @@ Playground.args = { disabled: false, inactive: false, variant: 'default', - 'aria-label': 'Icon button description', - icon: XIcon, + 'aria-label': 'Favorite', + icon: HeartIcon, } -export const Default = () => +export const Default = () => From ae63bdb973174cfb880d0e1efe07557c8b22e318 Mon Sep 17 00:00:00 2001 From: joshblack Date: Mon, 29 Jan 2024 16:42:55 +0000 Subject: [PATCH 2/2] test(vrt): update snapshots --- ...utton-Playground-dark-colorblind-linux.png | Bin 5455 -> 6055 bytes ...conButton-Playground-dark-dimmed-linux.png | Bin 5470 -> 6015 bytes ...on-Playground-dark-high-contrast-linux.png | Bin 5503 -> 6021 bytes .../IconButton-Playground-dark-linux.png | Bin 5455 -> 6055 bytes ...utton-Playground-dark-tritanopia-linux.png | Bin 5455 -> 6055 bytes ...tton-Playground-light-colorblind-linux.png | Bin 5554 -> 6101 bytes ...n-Playground-light-high-contrast-linux.png | Bin 5579 -> 6157 bytes .../IconButton-Playground-light-linux.png | Bin 5554 -> 6105 bytes ...tton-Playground-light-tritanopia-linux.png | Bin 5554 -> 6101 bytes 9 files changed, 0 insertions(+), 0 deletions(-) diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-colorblind-linux.png index 678cdcf2d27be2171531d3edf68f675a2be5a059..8da124c94e26c0ab991c5287275ee095cc975938 100644 GIT binary patch delta 1553 zcmZuxc~BE~6sAf=hbh<*VX7Q!={m}@B~2vWV2BWV?|QtW^{(IN_sfL|j~c4X4YHFN z-e=2<ahI=B04Ga0GIb(xU4Ot zcX%h(A0|-9WDR#5u)n`QEjKrJWnM*OFhcblI+xql))uaIe{r8sTV=Zu@s#DSjJf0^ zWwBn5jELYkJ)IU66-8sS+3t7#%CG7`PR4)*Ag*0M<>gS(d8EX|0Z7|h_2@480U=NO zFg5KQw*`qWmalk%q*r|nWu-3XdPqB+c>ch^UP6I++Mt0i$}R7^qt8Kfq`$vOAZ^~- zQg^#;c{w#TRkg%^&%gG_zbi2{)aoanmqB_y9*vG) ztA(cJWUc_7nuDB$C?a4lmSMs~TzxGW3x!PDK4b8QfHe=0l1tRfP#;1)$dg+2R;MMT zp2LxL%<-*ijWoB^HWk9-a9}H1jN%sTCW)zkO`%9D{5=`tAQN%0v~=(==1aAW6;y5n ze1tbnA4jpqmWUZ`^R~+h#IC7=m=n43CO%*33XG3~mvuyV8-~Yg3bj>*+6NW-I~q%u zG1wP?Zwnm(Yu*u(oGz^Q1sSt!3BACTwmVi-cWYe+oacJEB}qZlSox|J`oi`uy2i=;a`*A*89PNm0SK^=|J%*XGEvVPRnqLSkl5eFJJ6YBL^nX<-K% zXI}7CULB#3v&H7-5xCQ7Twux5AY+@mkgm9BeXTNA^ZI2PLoi)}8rqo8exelZyWS<;D6miSH zRYR{r##d=s?rFG8G@Xe9=S9Y*B5-UR%O4U51W0#x_gO{WNw-sgornM3Qs?T@6yU}L z?{K*A!KEoVvxEw8F+rKJ(^S@5tEz>GxREOc6&@#9w129A!^HY=2&q?#Q-D*=rApgG?JSvl zayn2hF-)wiqjL*sf7{Pr68`!hgA6C)@&9j;H5*8vsK@xaPg{mPGd5R8diDnlxz@En WjE$|hrwt(Hk?`5+WBgApe)k6>5>G$? delta 940 zcmZ3ke_m^XLAofXr;B4q#hkZy59ZBD7j1ZGyfHR%o07kZQ;nGWvI}u6y4nk_ z3!mx@(V3igde#P&+_DnmIEzg})`yk2xVW}#wek6*b$;{TrSIpwT|M*vZ}IE-ccSGk#XWo2b%m0#w}pMU=4%a?1yR$JP| z<$lQls$LNpv%fIA_NMc?*xhFGbw9dq-u|87H*fBln>TN+xjx0_QPn+6bclXr%ELv;~)Vv@`*|Gljx4Dt$ljhl4-#p@H|LVbm0x}s`E5E%-`S#6j22ki)8WRJpz|RU-NIazx~|Xy`eMUeOo({Jwrh{a+rS zDL)dU`G3vazBuj-Gtj?BV>+YXU4LD^7pR9}%bv;cFYec**QMR7S`PF!M6G%9zq9*q zc2|M;FSkj30owI{|FJ)_-(UIv_hYj8U63*TH?l7L|2jMW*@F)W|2|y}&$s>k>0oo^ zrzatrWxNiMT+h0?VF?4ZbQg@{FoKD zr^1dsy60CjBw5MGbAx<)&tH0{$orR<-=`VAj+E0)&(DAV|C8U}q>VH7?%fL#FnnG4 z>&x!m^FXx?T}Qu4Z@)I%>dlJ`%hOMbzJ33m4g|r+&z)I)`a94u=^|UBex`!c(ml6k sP~hI+yT5R=AV)p_W(SVVjAAe1k2jq2>nOed${`MA?epnY%w9w5byrH=% zHsw!PvrV6b$2aNAopic9u}VTStEP{_Gu1cr6^Vc{L_e$%H#e*AHgr^EjgFWMg}cO} zWQa^A>(4ni2m}HuDoTYt)!F@lWkU7*$#_+7Z?QgQ8K7=|@&WIz6w8re8iRHV4LI58>dzrFIJqBRt*^$8jb^h(v5ML#aCcDQ;tCpJRghU)*?!)9h>XVb8Y zubCxV07fpP@6*I+hi_qRJ+hvUq_YL1W{_Gp`{@CkU#AUXLo0*;SdB{N~HZeNGyFWxBmhhFvybaLrRpyaa!33-gxl+vHCaZiU%=>(R;X1^{bf~!$KP$eJRXTu^K+9 zb1SBwdS1kjr)5*v{lvNIcywgsa((_f5ZQSqamva#K zc|4JhS^K&YfPLV;dX~bhg##L1m>kX7mfvx0x z>|*HnPUYFY`e4F!NF*OK9}(jK{2(FP2|d9G9^jOLSAm|Y=}o#TlJ z6{Vo5OfE_XoaP@x(KfTFmW0e@($2Ytr3q{<*C=;3M#fXQKowMCbi|)o)l(RF-xL~5 zH`Q(MzLZT1$h7jJ3u~fMh?rg5=;+Ugu4!pm)hP=Dq)pb-hz8R(Vott8HAuRJ`gB~0 zT)vyaeH-w+lc4eqO#robpfe0SOdmh0mbCbcR3_~O9lclA>f08q=|jcxpc9tom1-Dt zx+-=@Nnf1p#lXOTMFQ;q7P|}j*kO(Uvht`-`9`)tX!gmZyu2XSM=3@ANk{C@UrV}J z++eGYxLbi0;%$q$;J7Tled-PgUL2|;A!kP1R{d4(xL|?nrM4Yc)ePSM{}Xu4f3GO> zX`5SG`!{<-RXUw6*4hm%9A>+~+5%-|kD8QMl@F~D(7aPP-CKJ`uWNngifJz$M|Qsq zB1U5h{8i&ymzYPFG4jwqNzxA7fU;hOVhbo5v delta 944 zcmeybcTa1AL7u3Dr;B4q#hkZy&v)NRmp$+?z07Q8Z(_NaNVev}qut`aow=@7FP!0g z(SGYBXNM2`0Rl;H9lwY;c?64W+THd>#oAgfD@noh?54{n_q}{wTKnL4&ARtL>*lAc z+5f#+y_%7MfniC`-gh9nVYBdLL-x@6ZP$NpxV!h~joI(}Pj8-UIM?s`&lekG^o~D1 z`q9Fs!k~|j|Jtt{p!yY&-WT$7b9>G2?=sVioz;8v(Zz}%?-y^3T6^u|i*&WgCujIA zf81_gmHg)H_v3qammhoi@@3R_kVRcvYl{9qi@ts=B|F=urozO}&+nSt=j0xs)?+8@ zPoAv!@gc+K-*09npyHbNxz;brzdwuLKhxeW?zqkRl)@Stkaa*O9{a`uG_Cu|9moCV z_vO2fE-pP&qz0rmn%}?wV;@j+f#4kL7y9SRjuq{UIj)nw3FwQbH_sjW&I;1@;EtpH zT)+L3jX&Q{+Zwg@uUak0Qy&=ZfuSH?zo3`xZ_Pe?yFV|&|Cj$g++Sx|_ve_unS~%w zkx8z}i}ic|p8N4*a(w^m`Tw4^ZUvHMHGfW)I`RYM*C$j@o?ZL#=i0)zZ_AJEe*ZtI z$MD!$>HX5lHL{=I@B4r7$LsjKUVXd$TTe~|Dp$x{>}Y>X!aTpm?3l#)MRh$VH_xcA z-^B)$+H>bvb6t=4;o_D|OGDy6p8z^r7@89;1?f37?)c?CIA0M&1 z^6}=6SN~Q&Ui~{huSf-`s@~&P#s&Sp{{4o}=2zX60-0|w{$v`+>IXV3AahtatAHej z&=(*nQ1Wg;yx#O=qnT@xry0-mQA^$#lUEZDl-a>?PWDT``0-?`x$8huz$EeUQN`om zz^FaoTJUaxJupS3ZPtE0$RK}hV>gQBOtq{3jHO=Qo_bLXs{RjO{DJNM(0 zlSwkNaydEvAhSKL6=~iBrL0$9N@Dizvfj3RJ1{!GPCl8Elb_$eI=uWiP~y(+>h!lD zcRL*YW+hitRb}<=-cH-H@6VF+_t}@N`;+kY`K#%tpH}R#ko*7Zd2RkPU|#rfPaxX+ xf_-U8g~B!zC4#CL@Y}#V~8P6*|nsvo+w=d9822WQ%mvv4FO#t#u)VTlv diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-high-contrast-linux.png index 4250d1c091ac2aadb49bf9bf5cfd3a555222d11d..a6ce76707cd78e8bd6a75df2dcb6712df4b39892 100644 GIT binary patch delta 1519 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 WjE$|hrwt(Hk?`5+WBgApe)k6>5>G$? delta 940 zcmZ3ke_m^XLAofXr;B4q#hkZy59ZBD7j1ZGyfHR%o07kZQ;nGWvI}u6y4nk_ z3!mx@(V3igde#P&+_DnmIEzg})`yk2xVW}#wek6*b$;{TrSIpwT|M*vZ}IE-ccSGk#XWo2b%m0#w}pMU=4%a?1yR$JP| z<$lQls$LNpv%fIA_NMc?*xhFGbw9dq-u|87H*fBln>TN+xjx0_QPn+6bclXr%ELv;~)Vv@`*|Gljx4Dt$ljhl4-#p@H|LVbm0x}s`E5E%-`S#6j22ki)8WRJpz|RU-NIazx~|Xy`eMUeOo({Jwrh{a+rS zDL)dU`G3vazBuj-Gtj?BV>+YXU4LD^7pR9}%bv;cFYec**QMR7S`PF!M6G%9zq9*q zc2|M;FSkj30owI{|FJ)_-(UIv_hYj8U63*TH?l7L|2jMW*@F)W|2|y}&$s>k>0oo^ zrzatrWxNiMT+h0?VF?4ZbQg@{FoKD zr^1dsy60CjBw5MGbAx<)&tH0{$orR<-=`VAj+E0)&(DAV|C8U}q>VH7?%fL#FnnG4 z>&x!m^FXx?T}Qu4Z@)I%>dlJ`%hOMbzJ33m4g|r+&z)I)`a94u=^|UBex`!c(ml6k sP~hI+yT5R=AV)p_W(SVVjAAe1k2jq2>!={m}@B~2vWV2BWV?|QtW^{(IN_sfL|j~c4X4YHFN z-e=2<ahI=B04Ga0GIb(xU4Ot zcX%h(A0|-9WDR#5u)n`QEjKrJWnM*OFhcblI+xql))uaIe{r8sTV=Zu@s#DSjJf0^ zWwBn5jELYkJ)IU66-8sS+3t7#%CG7`PR4)*Ag*0M<>gS(d8EX|0Z7|h_2@480U=NO zFg5KQw*`qWmalk%q*r|nWu-3XdPqB+c>ch^UP6I++Mt0i$}R7^qt8Kfq`$vOAZ^~- zQg^#;c{w#TRkg%^&%gG_zbi2{)aoanmqB_y9*vG) ztA(cJWUc_7nuDB$C?a4lmSMs~TzxGW3x!PDK4b8QfHe=0l1tRfP#;1)$dg+2R;MMT zp2LxL%<-*ijWoB^HWk9-a9}H1jN%sTCW)zkO`%9D{5=`tAQN%0v~=(==1aAW6;y5n ze1tbnA4jpqmWUZ`^R~+h#IC7=m=n43CO%*33XG3~mvuyV8-~Yg3bj>*+6NW-I~q%u zG1wP?Zwnm(Yu*u(oGz^Q1sSt!3BACTwmVi-cWYe+oacJEB}qZlSox|J`oi`uy2i=;a`*A*89PNm0SK^=|J%*XGEvVPRnqLSkl5eFJJ6YBL^nX<-K% zXI}7CULB#3v&H7-5xCQ7Twux5AY+@mkgm9BeXTNA^ZI2PLoi)}8rqo8exelZyWS<;D6miSH zRYR{r##d=s?rFG8G@Xe9=S9Y*B5-UR%O4U51W0#x_gO{WNw-sgornM3Qs?T@6yU}L z?{K*A!KEoVvxEw8F+rKJ(^S@5tEz>GxREOc6&@#9w129A!^HY=2&q?#Q-D*=rApgG?JSvl zayn2hF-)wiqjL*sf7{Pr68`!hgA6C)@&9j;H5*8vsK@xaPg{mPGd5R8diDnlxz@En WjE$|hrwt(Hk?`5+WBgApe)k6>5>G$? delta 940 zcmZ3ke_m^XLAofXr;B4q#hkZy59ZBD7j1ZGyfHR%o07kZQ;nGWvI}u6y4nk_ z3!mx@(V3igde#P&+_DnmIEzg})`yk2xVW}#wek6*b$;{TrSIpwT|M*vZ}IE-ccSGk#XWo2b%m0#w}pMU=4%a?1yR$JP| z<$lQls$LNpv%fIA_NMc?*xhFGbw9dq-u|87H*fBln>TN+xjx0_QPn+6bclXr%ELv;~)Vv@`*|Gljx4Dt$ljhl4-#p@H|LVbm0x}s`E5E%-`S#6j22ki)8WRJpz|RU-NIazx~|Xy`eMUeOo({Jwrh{a+rS zDL)dU`G3vazBuj-Gtj?BV>+YXU4LD^7pR9}%bv;cFYec**QMR7S`PF!M6G%9zq9*q zc2|M;FSkj30owI{|FJ)_-(UIv_hYj8U63*TH?l7L|2jMW*@F)W|2|y}&$s>k>0oo^ zrzatrWxNiMT+h0?VF?4ZbQg@{FoKD zr^1dsy60CjBw5MGbAx<)&tH0{$orR<-=`VAj+E0)&(DAV|C8U}q>VH7?%fL#FnnG4 z>&x!m^FXx?T}Qu4Z@)I%>dlJ`%hOMbzJ33m4g|r+&z)I)`a94u=^|UBex`!c(ml6k sP~hI+yT5R=AV)p_W(SVVjAAe1k2jq2>&P+~8blz`R%9^?2n7j}Cu_h29*~fom%jL?Kkhwu?)mO_&iU@S_i5O_ z+iq+J14`l!?mLlPIXiNs<{>BX#R4RXW=77^D!$QfI8nGiLHl(6_0PxC@P{{be%`YE z+7Fwv&Taa==s`wYVfnY?s}9}F(q=69pU=zt<@DZbTTbM8KYrCywy`!Q>fFP=ElSZF zLcLFQ{Y!@Za7^DZ+N7s6vYNF z*Ndt}SFt#CcejPAleK>3BwbABr>iRo#E#(L z3cb1`5mA*&M{*PvM>m7g6)2{lhl^ca=s2d#^TIN`g3OeZqV{CJb-T8A1XCI=M0+63 z6RlT~{*NDx?;BD=vIwDJVZ-|VkB=iHK4=gP=&fIGW*Lg8TG(0OG#bbUkUu{w1y(i^Oyi~t&*wGdXnsgvi>o!UX=6TzsS$(TA0x@YW4 zCUQ=m1@VDVv5(#nPsg)!4G9drx+7Z(}khVkO z{ySi*3Vxm$#GSZFC1s|PdCr@JUuW)dm$u1MgO)Y1dNyKN4L}M3pPXgANu|?u#x-b} z-!c2HBE=ybm4~kQJ#x?fSmG)aiMY-PwkQEI$?Y#B$dFR$dds4dV7?VbZ_Ql;Xh5NS zr-Ex@t2*3^_4@cEcUVQ+#!opq*wYkivqs~Kr@7B7HA>^VhLlUWa4y4*@PXb#SUm}r zFLj}J(rlR@^$dH5Mvx^PL>uMugP*|tZWux=>&ULfM=ri~F42Sx>+na8L=#V)5--|I z6t<43)u6QtRMBy0xLYx#Y25nVJ8=|OC(dO=HM2Ha`OeYUDenTm^no)d2l#JVIrXV{?aNGmRJ#F#_Md)3EYg#xmIV0#wH$yp8-e3 zw5mWhZ{&Yae4Dx3J_NFoqB!fCS#rx?P6RT*%X&~$!gtkA~@q+EYDcHg4WWi8ft1P%w3$ z6D)dC|2*|lj!6X!js#b=Cr23!hEK~19nVBVZoScmaCBr%i*2m-jHjP(mH8L7kMaC$ z4#fy%TTX9@xR1nn&$aSC93$_Fr*qpY$(gBh;D?vZ3&JG4!c+_mZSAzfkE6CGP3V3w81DS_x|fh{}&6~i8sf&Of!d2r9}u&^*G2+4=|FXx8j{1oUK zXG#f*s3dMiF-4H97L$m=w)q}f_Dk=;-DnqMw#ICl4k&7`sjE{LhRTVMQ`bevbeL;u zYuT>^$Ij4oF+`5>j!)z}Qm&P@t0il;yt=yDw+hV-vnKFsGt?xL#jsc`sa#GD%r+`N zeRHz(VN`H#nNWx~r=h?v{v7J@sDzQ_2Q*7Jc;|e1doT8>zk~fN@wXgY0aJ*&FmZ>D K9<1Ac_R4>N$yI~^ delta 1041 zcmW-fdraC_6vxpft^h%ovS-J-_v)tdOZAYZHhbFO?uA8;zw{BQ@gPfry|5d=|RTw6{lY>CF!7dVLQ zyk{IG>*|Q=*5}iqB|W4^j|hcASgVEXUaaW?!eBRkjn2-_rlh9o(fVS~ARSY4Es{8J z)geY=;3z*jvzIe14I3qM1Fu7-`dqkD@XM;h@zpRBk_wB1Ynto?fMcq&wgKkI2!q5h1o&FK@`{kzE?3hT-yJSdD zPsbzQCRt1?w>FrnteKga0$J?ewUdL_`EUhWITjRX8Jn+c>e;YnEFLI}G zm+TMsH6ytYFH#%b@{45AwUD>Fyj^t=P&u194ng>DohNMP(`Xc+1=iWZP=P&o_k}!Q?uDJcboq1a? ztDyqK`f=^@VISB`NDgiT^Xj_}(146nhJ6IWM+Q)7WhJPuc{;Pb1~#Mh$_0NFplC^@ zsoTjuN^D%HZR&SOBoenZ`UhqQZJ4MKv^eEj&dLkL{Cd*{=j7b_PL-O&vvc=4OS@!% zIy$m+?CkZOCseOrrkFnoH&Q)|OOqITFMPDJhn2VawtGD2^Lv<){2>I%qtSZ9;jr0a zarwMp!u$LC(aVUG1&irdLe*T`)pWD-W$>;?rZWZ{y^sP%$Jo$}7q~-Bx9E`%8TsC; zL&o|{7qeG)7s@AE1+2_-k5xtwc#*uO;TV+7eLnpI&yDz83*~N~*Si|>d$=yETEi&@ zS<4!8V@2tFW^$FZ1OGe;j!PIP!t#W=xMTwqC&5#?6!`ZxAQ4WNl%5zqe*W73gCZln diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-high-contrast-linux.png index 23381372f26b2faa7cc6fc7aa33197b093305f72..98b75993318ef4a9929458708e72b00ee5c826b1 100644 GIT binary patch delta 1668 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 ZqgPhOUow9QR6-){PEG%y?fvXi{{XE2YSsV% delta 1041 zcmW-fdraF^6vqooV2H6!Gl_MJQQ^&>}B^b^|)M{>T>7 zMdvz27#;MnEoLKBh}4GG?ze&l2=>?CuX7e!+F4*iOMy15(9*ZJ{Bd*cx!=z@_ug}k znKE|hW_Ihr=2ORymUj(qKK)oIX1zYKwf>Q%Vd^#Z=ew^kp`auZ>MfetydbBBs^IUd$AFDEf zKp>nnYvz-IC3KecOeTB^7ijf=&Q*-+15TxyAMTpf*|ViYs;xcZPD2J3<;09N|Z2_Hw4DV`F4);8n=fn5U?Me_3@nz8qmf54DY zV4+DKF*nE5LoX_!AluJF%Tr7YMST)KhFY)tQ_hBrMO(WS_E}Q8ZRIqeZ~pc~ zCKd6#qWksie}!;>)#s~?*l?h96URL=sk+!XRRlb%C}*oTXq3BlUWi3;==?j{9V~=e zJMO20gWa}5Vt`Q_nVa7zEe3wb-SNgY1TReyulpJ9f8aG8bNlD7V;}_xOy0(?yx>49 ze&kU^X^|8M(I+0qJt2Az78Z@^dI6T%pd{-!xA*Zqf4Nte1Q`o+C7u86%-i}Ymm*wW z9Tgzf59^l?`M_pEd|(@xm)~}P24tQz>?069Fn~%ct3Z9t(^;K$3NzZMT<})|ik4iK zww>am#Kwi%p?-@*B5~WJe_(ddhKWkJ%_-AzR-Vh}*IPC?C+607s?{8xox9gr+64pD z)s?Md=dABMrh5HS`TPk*Gu5-WG>NhI!pExmSoxc8x*r97eh)KJFpMDiG+KW+95!1l zE}s`n_~76mdJ&PZ6e9YiP%YPXIm7IH5xnbx>9heyYf{1J7@J!0LU*X;20ijVqriK4 z*w~omV)pB9K?OuB%*s0ZP-XOh7s=|HjzT%yXVc&F+=$P$P~rA@y{jR=hwHMcHJlQV zwY)hmR+R3iCRb@E@XwJHHT%CHDi#x`;!+GyoET5-k>lUlfJ8V|T6TQo*tskJ11MS~ A4gdfE diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-tritanopia-linux.png index 8eb9badcadc8556fa9da54e213cb2f6247b2fa22..df8513d7dc90def31a88539ef21713517025e4a2 100644 GIT binary patch delta 1606 zcmYLJX;4#F6pn+KX(^&P+~8blz`R%9^?2n7j}Cu_h29*~fom%jL?Kkhwu?)mO_&iU@S_i5O_ z+iq+J14`l!?mLlPIXiNs<{>BX#R4RXW=77^D!$QfI8nGiLHl(6_0PxC@P{{be%`YE z+7Fwv&Taa==s`wYVfnY?s}9}F(q=69pU=zt<@DZbTTbM8KYrCywy`!Q>fFP=ElSZF zLcLFQ{Y!@Za7^DZ+N7s6vYNF z*Ndt}SFt#CcejPAleK>3BwbABr>iRo#E#(L z3cb1`5mA*&M{*PvM>m7g6)2{lhl^ca=s2d#^TIN`g3OeZqV{CJb-T8A1XCI=M0+63 z6RlT~{*NDx?;BD=vIwDJVZ-|VkB=iHK4=gP=&fIGW*Lg8TG(0OG#bbUkUu{w1y(i^Oyi~t&*wGdXnsgvi>o!UX=6TzsS$(TA0x@YW4 zCUQ=m1@VDVv5(#nPsg)!4G9drx+7Z(}khVkO z{ySi*3Vxm$#GSZFC1s|PdCr@JUuW)dm$u1MgO)Y1dNyKN4L}M3pPXgANu|?u#x-b} z-!c2HBE=ybm4~kQJ#x?fSmG)aiMY-PwkQEI$?Y#B$dFR$dds4dV7?VbZ_Ql;Xh5NS zr-Ex@t2*3^_4@cEcUVQ+#!opq*wYkivqs~Kr@7B7HA>^VhLlUWa4y4*@PXb#SUm}r zFLj}J(rlR@^$dH5Mvx^PL>uMugP*|tZWux=>&ULfM=ri~F42Sx>+na8L=#V)5--|I z6t<43)u6QtRMBy0xLYx#Y25nVJ8=|OC(dO=HM2Ha`OeYUDenTm^no)d2l#JVIrXV{?aNGmRJ#F#_Md)3EYg#xmIV0#wH$yp8-e3 zw5mWhZ{&Yae4Dx3J_NFoqB!fCS#rx?P6RT*%X&~$!gtkA~@q+EYDcHg4WWi8ft1P%w3$ z6D)dC|2*|lj!6X!js#b=Cr23!hEK~19nVBVZoScmaCBr%i*2m-jHjP(mH8L7kMaC$ z4#fy%TTX9@xR1nn&$aSC93$_Fr*qpY$(gBh;D?vZ3&JG4!c+_mZSAzfkE6CGP3V3w81DS_x|fh{}&6~i8sf&Of!d2r9}u&^*G2+4=|FXx8j{1oUK zXG#f*s3dMiF-4H97L$m=w)q}f_Dk=;-DnqMw#ICl4k&7`sjE{LhRTVMQ`bevbeL;u zYuT>^$Ij4oF+`5>j!)z}Qm&P@t0il;yt=yDw+hV-vnKFsGt?xL#jsc`sa#GD%r+`N zeRHz(VN`H#nNWx~r=h?v{v7J@sDzQ_2Q*7Jc;|e1doT8>zk~fN@wXgY0aJ*&FmZ>D K9<1Ac_R4>N$yI~^ delta 1041 zcmW-fdraC_6vxpft^h%ovS-J-_v)tdOZAYZHhbFO?uA8;zw{BQ@gPfry|5d=|RTw6{lY>CF!7dVLQ zyk{IG>*|Q=*5}iqB|W4^j|hcASgVEXUaaW?!eBRkjn2-_rlh9o(fVS~ARSY4Es{8J z)geY=;3z*jvzIe14I3qM1Fu7-`dqkD@XM;h@zpRBk_wB1Ynto?fMcq&wgKkI2!q5h1o&FK@`{kzE?3hT-yJSdD zPsbzQCRt1?w>FrnteKga0$J?ewUdL_`EUhWITjRX8Jn+c>e;YnEFLI}G zm+TMsH6ytYFH#%b@{45AwUD>Fyj^t=P&u194ng>DohNMP(`Xc+1=iWZP=P&o_k}!Q?uDJcboq1a? ztDyqK`f=^@VISB`NDgiT^Xj_}(146nhJ6IWM+Q)7WhJPuc{;Pb1~#Mh$_0NFplC^@ zsoTjuN^D%HZR&SOBoenZ`UhqQZJ4MKv^eEj&dLkL{Cd*{=j7b_PL-O&vvc=4OS@!% zIy$m+?CkZOCseOrrkFnoH&Q)|OOqITFMPDJhn2VawtGD2^Lv<){2>I%qtSZ9;jr0a zarwMp!u$LC(aVUG1&irdLe*T`)pWD-W$>;?rZWZ{y^sP%$Jo$}7q~-Bx9E`%8TsC; zL&o|{7qeG)7s@AE1+2_-k5xtwc#*uO;TV+7eLnpI&yDz83*~N~*Si|>d$=yETEi&@ zS<4!8V@2tFW^$FZ1OGe;j!PIP!t#W=xMTwqC&5#?6!`ZxAQ4WNl%5zqe*W73gCZln