From f615ec8e711b369e3f16fb062276af6ef0d78195 Mon Sep 17 00:00:00 2001
From: Sergey Vinogradov <mr.vursen@gmail.com>
Date: Wed, 30 Apr 2025 16:20:07 +0400
Subject: [PATCH 1/4] fix: align number field button icon size with other
 components

---
 .../test/visual/lumo/integer-field.test.js        |  6 ++++++
 .../test/visual/material/integer-field.test.js    |  6 ++++++
 .../test/visual/lumo/number-field.test.js         |  6 ++++++
 .../test/visual/material/number-field.test.js     |  6 ++++++
 .../theme/lumo/vaadin-number-field-styles.js      | 15 ---------------
 5 files changed, 24 insertions(+), 15 deletions(-)

diff --git a/packages/integer-field/test/visual/lumo/integer-field.test.js b/packages/integer-field/test/visual/lumo/integer-field.test.js
index 8c80673cbfe..1a24e0e89cc 100644
--- a/packages/integer-field/test/visual/lumo/integer-field.test.js
+++ b/packages/integer-field/test/visual/lumo/integer-field.test.js
@@ -21,6 +21,12 @@ describe('integer-field', () => {
     await visualDiff(div, 'value');
   });
 
+  it('clear button', async () => {
+    element.value = 10;
+    element.clearButtonVisible = true;
+    await visualDiff(div, 'clear-button');
+  });
+
   it('step buttons visible', async () => {
     element.stepButtonsVisible = true;
     element.value = 5;
diff --git a/packages/integer-field/test/visual/material/integer-field.test.js b/packages/integer-field/test/visual/material/integer-field.test.js
index aa5b2fc8b04..8a431231bbd 100644
--- a/packages/integer-field/test/visual/material/integer-field.test.js
+++ b/packages/integer-field/test/visual/material/integer-field.test.js
@@ -21,6 +21,12 @@ describe('integer-field', () => {
     await visualDiff(div, 'value');
   });
 
+  it('clear button', async () => {
+    element.value = 10;
+    element.clearButtonVisible = true;
+    await visualDiff(div, 'clear-button');
+  });
+
   it('step buttons visible', async () => {
     element.stepButtonsVisible = true;
     element.value = 5;
diff --git a/packages/number-field/test/visual/lumo/number-field.test.js b/packages/number-field/test/visual/lumo/number-field.test.js
index 35fb8e3b606..53ffa198687 100644
--- a/packages/number-field/test/visual/lumo/number-field.test.js
+++ b/packages/number-field/test/visual/lumo/number-field.test.js
@@ -90,6 +90,12 @@ describe('number-field', () => {
         await visualDiff(div, `${dir}-helper-text`);
       });
 
+      it('clear button', async () => {
+        element.value = 10;
+        element.clearButtonVisible = true;
+        await visualDiff(div, `${dir}-clear-button`);
+      });
+
       it('prefix slot', async () => {
         const span = document.createElement('span');
         span.setAttribute('slot', 'prefix');
diff --git a/packages/number-field/test/visual/material/number-field.test.js b/packages/number-field/test/visual/material/number-field.test.js
index cbc53bd16f9..87b855016a1 100644
--- a/packages/number-field/test/visual/material/number-field.test.js
+++ b/packages/number-field/test/visual/material/number-field.test.js
@@ -88,6 +88,12 @@ describe('number-field', () => {
         await visualDiff(div, `${dir}-helper-text`);
       });
 
+      it('clear button', async () => {
+        element.value = 10;
+        element.clearButtonVisible = true;
+        await visualDiff(div, `${dir}-clear-button`);
+      });
+
       it('prefix slot', async () => {
         const span = document.createElement('span');
         span.setAttribute('slot', 'prefix');
diff --git a/packages/number-field/theme/lumo/vaadin-number-field-styles.js b/packages/number-field/theme/lumo/vaadin-number-field-styles.js
index b6d1c70a0fd..e23417480b5 100644
--- a/packages/number-field/theme/lumo/vaadin-number-field-styles.js
+++ b/packages/number-field/theme/lumo/vaadin-number-field-styles.js
@@ -17,21 +17,6 @@ const numberField = css`
     opacity: 0.2;
   }
 
-  :host([step-buttons-visible]) [part='input-field'] {
-    padding: 0;
-  }
-
-  [part$='button'] {
-    cursor: pointer;
-    font-size: var(--lumo-icon-size-s);
-    width: 1.6em;
-    height: 1.6em;
-  }
-
-  [part$='button']::before {
-    margin-top: 0.3em;
-  }
-
   [part='decrease-button']::before {
     content: var(--lumo-icons-minus);
   }

From 6bbf248d54aa5b74d0503dc2aae7de4416e010e4 Mon Sep 17 00:00:00 2001
From: Sergey Vinogradov <mr.vursen@gmail.com>
Date: Wed, 30 Apr 2025 16:25:00 +0400
Subject: [PATCH 2/4] update material screenshots

---
 .../integer-field/baseline/clear-button.png       | Bin 0 -> 707 bytes
 .../number-field/baseline/ltr-clear-button.png    | Bin 0 -> 707 bytes
 .../number-field/baseline/rtl-clear-button.png    | Bin 0 -> 707 bytes
 3 files changed, 0 insertions(+), 0 deletions(-)
 create mode 100644 packages/integer-field/test/visual/material/screenshots/integer-field/baseline/clear-button.png
 create mode 100644 packages/number-field/test/visual/material/screenshots/number-field/baseline/ltr-clear-button.png
 create mode 100644 packages/number-field/test/visual/material/screenshots/number-field/baseline/rtl-clear-button.png

diff --git a/packages/integer-field/test/visual/material/screenshots/integer-field/baseline/clear-button.png b/packages/integer-field/test/visual/material/screenshots/integer-field/baseline/clear-button.png
new file mode 100644
index 0000000000000000000000000000000000000000..6dc128625d0bb6f2b79e35d2e14f78bbb8b01049
GIT binary patch
literal 707
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`sg9%8M-Rj{1QjEnx?oJHr&dI!FU|_2Cba4!+
znDh3oV$R|KhW3x!PjjZI3U#_DP4rL^x|zb(ImabwnoVTq8lcFDQ(h{Y^3<p0nqS*(
zTK(i-_WR!}x9MlbU(&aUQ+#>%^5w~lB6Ta&8~%%bbZq;f;9N67(e8wRd`btu(GhmZ
zN6kE>3P1bw<5^+6`0m1wudZBom1<9vSiV$t+12Om(q*1CpKpY@$~?cCXR%jaa(0fj
zTc~x9b2Mx1MAOq2g;)JP|5>{6bdB8ojK`Zk2i?AQ^3&z^y{4(5Y6p+qX7P-idhFfw
z+DBEshu5vktuM2k{VO)sdR^)K<Km*p`>RhZJ`mj}bL`rZz#qSCdV((Zu}^>b!2083
z9p1j!&kOgj-0oY>b4ll0?7ja@sn>r8-0i+8@qc^Z`Qlkz`{eC!PCNZC?v(cS&d1;1
zZn!;n`QqE@kEQm!&)@s0$Iw1}rb6DV`8nRnv)8S(N<QQDbf@f3v$_q(cnWy`sMPYk
z`+AUTPF>193FEo<%C>*5F_8Xz+}I^%{mSjz<~M0@&68jId7a+J*1)`74|B__W!NXX
z$?)Z$y<HhMul`QGMM3BJ?$1UWzB-rB@c+CqKkN1M$TJh)FViWPc>ZmF{L`{r^E+m_
zM&_<EM=NW6qIUPjsJG-l`E##q>%VtDv|0X~%zRZ|J$df^+kSiR&R*m3XT5$YFw*i?
zHerjknf~vdSJ%}12{%5-yKDdc|ED#=EffxK;wCMUXU0EUe}{GIg9?9Os$}qV^>bP0
Hl+XkKBmGft

literal 0
HcmV?d00001

diff --git a/packages/number-field/test/visual/material/screenshots/number-field/baseline/ltr-clear-button.png b/packages/number-field/test/visual/material/screenshots/number-field/baseline/ltr-clear-button.png
new file mode 100644
index 0000000000000000000000000000000000000000..6dc128625d0bb6f2b79e35d2e14f78bbb8b01049
GIT binary patch
literal 707
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`sg9%8M-Rj{1QjEnx?oJHr&dI!FU|_2Cba4!+
znDh3oV$R|KhW3x!PjjZI3U#_DP4rL^x|zb(ImabwnoVTq8lcFDQ(h{Y^3<p0nqS*(
zTK(i-_WR!}x9MlbU(&aUQ+#>%^5w~lB6Ta&8~%%bbZq;f;9N67(e8wRd`btu(GhmZ
zN6kE>3P1bw<5^+6`0m1wudZBom1<9vSiV$t+12Om(q*1CpKpY@$~?cCXR%jaa(0fj
zTc~x9b2Mx1MAOq2g;)JP|5>{6bdB8ojK`Zk2i?AQ^3&z^y{4(5Y6p+qX7P-idhFfw
z+DBEshu5vktuM2k{VO)sdR^)K<Km*p`>RhZJ`mj}bL`rZz#qSCdV((Zu}^>b!2083
z9p1j!&kOgj-0oY>b4ll0?7ja@sn>r8-0i+8@qc^Z`Qlkz`{eC!PCNZC?v(cS&d1;1
zZn!;n`QqE@kEQm!&)@s0$Iw1}rb6DV`8nRnv)8S(N<QQDbf@f3v$_q(cnWy`sMPYk
z`+AUTPF>193FEo<%C>*5F_8Xz+}I^%{mSjz<~M0@&68jId7a+J*1)`74|B__W!NXX
z$?)Z$y<HhMul`QGMM3BJ?$1UWzB-rB@c+CqKkN1M$TJh)FViWPc>ZmF{L`{r^E+m_
zM&_<EM=NW6qIUPjsJG-l`E##q>%VtDv|0X~%zRZ|J$df^+kSiR&R*m3XT5$YFw*i?
zHerjknf~vdSJ%}12{%5-yKDdc|ED#=EffxK;wCMUXU0EUe}{GIg9?9Os$}qV^>bP0
Hl+XkKBmGft

literal 0
HcmV?d00001

diff --git a/packages/number-field/test/visual/material/screenshots/number-field/baseline/rtl-clear-button.png b/packages/number-field/test/visual/material/screenshots/number-field/baseline/rtl-clear-button.png
new file mode 100644
index 0000000000000000000000000000000000000000..6dc128625d0bb6f2b79e35d2e14f78bbb8b01049
GIT binary patch
literal 707
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`sg9%8M-Rj{1QjEnx?oJHr&dI!FU|_2Cba4!+
znDh3oV$R|KhW3x!PjjZI3U#_DP4rL^x|zb(ImabwnoVTq8lcFDQ(h{Y^3<p0nqS*(
zTK(i-_WR!}x9MlbU(&aUQ+#>%^5w~lB6Ta&8~%%bbZq;f;9N67(e8wRd`btu(GhmZ
zN6kE>3P1bw<5^+6`0m1wudZBom1<9vSiV$t+12Om(q*1CpKpY@$~?cCXR%jaa(0fj
zTc~x9b2Mx1MAOq2g;)JP|5>{6bdB8ojK`Zk2i?AQ^3&z^y{4(5Y6p+qX7P-idhFfw
z+DBEshu5vktuM2k{VO)sdR^)K<Km*p`>RhZJ`mj}bL`rZz#qSCdV((Zu}^>b!2083
z9p1j!&kOgj-0oY>b4ll0?7ja@sn>r8-0i+8@qc^Z`Qlkz`{eC!PCNZC?v(cS&d1;1
zZn!;n`QqE@kEQm!&)@s0$Iw1}rb6DV`8nRnv)8S(N<QQDbf@f3v$_q(cnWy`sMPYk
z`+AUTPF>193FEo<%C>*5F_8Xz+}I^%{mSjz<~M0@&68jId7a+J*1)`74|B__W!NXX
z$?)Z$y<HhMul`QGMM3BJ?$1UWzB-rB@c+CqKkN1M$TJh)FViWPc>ZmF{L`{r^E+m_
zM&_<EM=NW6qIUPjsJG-l`E##q>%VtDv|0X~%zRZ|J$df^+kSiR&R*m3XT5$YFw*i?
zHerjknf~vdSJ%}12{%5-yKDdc|ED#=EffxK;wCMUXU0EUe}{GIg9?9Os$}qV^>bP0
Hl+XkKBmGft

literal 0
HcmV?d00001


From 606feb4f46f67321550a116a98eabeead78b1d67 Mon Sep 17 00:00:00 2001
From: Sergey Vinogradov <mr.vursen@gmail.com>
Date: Wed, 30 Apr 2025 16:29:24 +0400
Subject: [PATCH 3/4] update lumo screenshots

---
 .../integer-field/baseline/clear-button.png     | Bin 0 -> 1025 bytes
 .../baseline/step-buttons-visible.png           | Bin 888 -> 891 bytes
 .../number-field/baseline/ltr-clear-button.png  | Bin 0 -> 1025 bytes
 .../ltr-step-buttons-visible-disabled-value.png | Bin 602 -> 591 bytes
 .../ltr-step-buttons-visible-disabled.png       | Bin 515 -> 511 bytes
 .../baseline/ltr-step-buttons-visible.png       | Bin 888 -> 891 bytes
 .../number-field/baseline/rtl-clear-button.png  | Bin 0 -> 1025 bytes
 .../rtl-step-buttons-visible-disabled-value.png | Bin 602 -> 591 bytes
 .../rtl-step-buttons-visible-disabled.png       | Bin 515 -> 511 bytes
 .../baseline/rtl-step-buttons-visible.png       | Bin 888 -> 891 bytes
 10 files changed, 0 insertions(+), 0 deletions(-)
 create mode 100644 packages/integer-field/test/visual/lumo/screenshots/integer-field/baseline/clear-button.png
 create mode 100644 packages/number-field/test/visual/lumo/screenshots/number-field/baseline/ltr-clear-button.png
 create mode 100644 packages/number-field/test/visual/lumo/screenshots/number-field/baseline/rtl-clear-button.png

diff --git a/packages/integer-field/test/visual/lumo/screenshots/integer-field/baseline/clear-button.png b/packages/integer-field/test/visual/lumo/screenshots/integer-field/baseline/clear-button.png
new file mode 100644
index 0000000000000000000000000000000000000000..870f6ef83abdb0ffe6b1ee102c839ad7787f01e3
GIT binary patch
literal 1025
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`og9%8!^*$#Bq!^2X+?^QKos)UVz`(rQ)5S5Q
zV$Rz;uf2l{WsZL=o|7AV{^J?$ZHu&L&$@9!fNNKPpzj8@CP@#0FDgpfFFv_cUArF;
z7}?m$)wWdgBC8e`57(g;XRh_GyS7L7?zx$>ORExAUj6j^Y5BL_Z<V%_iq-bNZ#JLz
zw=Z3|G*+BJLnVNp;Uo7)M#&@WDFX5n9BUldaB|cp{_HyVA;95k+rGNPpY;s{7ip-?
z5?b;^rF&-Jbc?#6g$Fz86;4#!ba0zl9?hC*c#d0Q`rQR$k8FjGaHrYy`~YfuY{h>>
z5XAmq$G@yclD}*>4*UMN9=I;sS7!6(w?s!((j@_Tm#5il^H#0Os=4wzJAH5N*-+oB
zSHJJBTywB)RqM*no8KQ=sy)jrVq<djq^n9Cho=8?_<MBPYx6wz(A>MPL~n1;J9on4
zv7zn}pJ}Tz_HF;^>wPzM;hq~)^TgUtuipLNVouBp%@a>H9^3M$`t!TPoyMm8a(02C
zSA+K?{zy=euqoQKYwzLRrQV$i9Hw7;|1vYPe}CsORaK7Jx#xsm`O4=}hdt_@exLv3
zb?2Ojp0|(oJ_iL2Z_Rf8x2tXMn-qPR`TgqLYt>VKm#>Z78gu<Ci{Zl;D~r#^@6n5S
z^~liR$hjH+vfgt|lw0@I_q%O;U7X+3#x9xVhf}0_e*{(^pL4V9_@T<f=S81AwYrph
z>h$&eN+0fxYSwp`x|%7<yyWDzbd|Q8cD(-Z!dAB3Rlh`3Lnqb6q^u3gE-IR|YGsXh
zlf=v1-KCf9|1AFgZ0-H;@|Tl;<b_XCarHE<5;ZvTf^Tuo_Vj;i3c`UQ()U+VZvLv3
zvzAHj<@#VA71wz?bMoAGLHGU^_MNv;4xFg!d)aN>=B$9PzkgrO;kw^?AYtD%`)}Kl
zfBjB>_qjLKXlBu7S@Bux_x-<MdD|}d`q$;><FXb8<ZWwy@074XXL@>Pj$Xmdv&sFZ
z{K_jUXPeLQt)H*2b^VcRE9=kW{?|*se&Kah0*3GF>+526B<Ou_JrM9|Pio-%-pDts
zd*03b*sp(g*_)d?|K{W#-neSBnd;UxODcjdR(0RBX^e0Eap=dLcgyqYdD<KQ_u5`I
zI~Qpa!GMvZ6OX8OC9P3w{LgDF=T_6H_9wGNGwIl2i@B3ho<fu6|AGhEg^8PX)avRr
u6n>b-cS6BVq4`Gx&m(4|4t_kG8us^YZuW0BmH!3iX$DVMKbLh*2~7YOzwLJb

literal 0
HcmV?d00001

diff --git a/packages/integer-field/test/visual/lumo/screenshots/integer-field/baseline/step-buttons-visible.png b/packages/integer-field/test/visual/lumo/screenshots/integer-field/baseline/step-buttons-visible.png
index 997436c0c645de72aa02f8987ad90d6bf5a1224e..6f74a493913ddff433ce800fece601a29a0a9c98 100644
GIT binary patch
literal 891
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`og9%8!^*$#Bq!^2X+?^QKos)UVz`$(k>Eakt
zG3V`_|K7rdGRHrj-}%<ee7k2|rj?d)GgGsHOhlSSryzH?5=%YDpM!ND&##Q<a+)MC
z>6fB%Q{9W%Q&gK=JaiS`cF)`yb?a_fUioWwMc2&v=YFr*emkyz{v7Lf_dZl^+MOJ~
zq{QkhgN8^TKSL|`M@Gpb>?s2B6C7(C*l===oxAH4?e{n6vF6<a&*LA&drV5%E;@Bb
z_gtgpdYZ*SoVt?HK`#C5tP8KaF0_=DG<z_oY-)wm7momq9UluGdB1GCP`RL?;PJyF
z?XPWanB>{)xXo(R!GA)*PNDfn1J5I72<Ji2J-+YpQhgbVzIXp<@b2_eoxW_JtLuAl
zpu7Gpk4jklPulr9Ti(CQidQMs@$XxcrcW+eai{r*k9Wqc@ACGqv$Ff-@=8t^CF=wP
zrfq&GlQiq=k14G?Zy2RZyGJfC%8wJfl(|g$*uUE9-RDZ5y<B~Fmuc+ITiveD?bhFP
zJ1{G%H$O4u#jA)(yJv3SxOx4~OOG~g>j=@>xnswZ&y_3LPfpvv=H;8a2XAieU%P(g
z)gPyv-zJ)!t$zABr1jGhn`1N9Ex%gv=;MhOANI00z7>6&tNZ+X%in!MuXeWF+_3D_
zmm5AUQ{}SO=tcis-e9`5=GN3^_F2tg<&%O_cCX#Kbmi-uAFpe^JpFOxzyn>^K>cqe
z&(CXC{GD|!JK0z;EcSlQlBgGj1&0%7-G0nhzGdy7+DAV&${t+R?mw^HI_mYeH_PO7
zk3Wz*E42IWw(Rr|m*0qs-ZwYk|2Q*EVs-qJ?$sYV!zY(+HLcs<U$yQ|^W}A!lk@N0
z-B-L{^U4D0UyGM7J|EZf{aXq9YNjj2sr_&69+N0OvFQ8hpRb<Waq{^hSbXm{zr23@
z&VN-#i&kYFKKSeM!@gw!&B0>(OrlS1I`+i(jz8-uZ)2P89}3+@$J?_}V-+05>UN%!
z{#{p@kPk`^n;$dp+7NlC!ot70E7s|GBh#VY_RoCmbz<UYguZRw!Em$L+X^LN;Ng6h
Z&NX^FJIt9o0+^c^JYD@<);T3K0RXu1xO4yj

literal 888
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`ogAGU~X-4`2DaPU;cPEB*=VV?oFfbc=x;TbZ
z%z1m)Hbb~j;`qmSpI_6iY+G^EBXIS#RSy(ISw(fbf~Niob75g$=o~wzq_n8KSVYi;
z^(YUQ634!+S)weZ8e!tBA9>f_GMm2SZ1?Pl4^Q=MJoR3F-)t&#$N6XdPVsk>9Q3B2
z=4|McTq?(~LWPA@LP_I*fFolY2bY0MK!aiv6OW)sLdOCIXA~)sPn!y}l-3riFDy~h
zmJ4!M<z`{xVohIR7qfg;*7un#clPa@=;Qn9cZAJ*#>S$nCdP|y&C&|Lz02-txB8??
zewHc5`q}qO177-=txs$ydY<}rH(yt_nooG#HM{bkXm-J!p>_X+HgCU=NNPAsE0_57
z56#tGwiSy*1iw9dnOQ7yeJ6K#$+tgGHRr#*wbR%AH{a@Y+m^WmKaA%%wS3abDQ^4z
z2HbuWmK(F*E%fTuNlP+5=dd=<iTEMv_%lRLJ#|y$+K7E2?BCx%><CeN)BNj)OZfXe
zSO4oXuD-Iba($TlS@jhhFTX5tb3cCNg2Co1i>FMtU$cLspl8*J8%v+>uZ^1V^|;`v
z<wi5-%y9|&&c;^y_n5BhbF=K*(|oNqtdH*H{kl|+zy9H`-n;$r`^2ln{v7MH-eqgB
zV&~b-UtfL>x2^o;Q~q0iW%_qM*_XCQG#6wS^2YC9F~h1fCw%v(zw2F}o9w*Rr#!{K
zRXMS=Joo3<@88zWops;Hzx<tjQ2F(=t-6sRhhBa#zoVxmyf7euTYSrlyTAF1epoTx
zSJIe&Ds6e)=8!|4FK%`#Zq>~TO-^>^R6o4G;MDVAXZ?8XvbW2wt$iDyHv8h;e~z{_
ze?n^awqG&ok6!%FbxV%(@~SJdzJHx8&hj*P;;#*E$B&o3`XXuBx417<yY$nM!nM)2
z7Y1lVy!v?R^qMkV?Mv%+oMzwg;G3TObu5Wz!s`W0jSh;>8EQ_SzEv(8(y`se(6=)3
z_qy#pSFS!Y<q3GVXHD&Oe=m<eDjLiBoBpe4H2i;jhy!0jgeMMg8ntJ<AbE}9Y$(eF
QU{+%AboFyt=akR{0BW|0SO5S3

diff --git a/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/ltr-clear-button.png b/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/ltr-clear-button.png
new file mode 100644
index 0000000000000000000000000000000000000000..870f6ef83abdb0ffe6b1ee102c839ad7787f01e3
GIT binary patch
literal 1025
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`og9%8!^*$#Bq!^2X+?^QKos)UVz`(rQ)5S5Q
zV$Rz;uf2l{WsZL=o|7AV{^J?$ZHu&L&$@9!fNNKPpzj8@CP@#0FDgpfFFv_cUArF;
z7}?m$)wWdgBC8e`57(g;XRh_GyS7L7?zx$>ORExAUj6j^Y5BL_Z<V%_iq-bNZ#JLz
zw=Z3|G*+BJLnVNp;Uo7)M#&@WDFX5n9BUldaB|cp{_HyVA;95k+rGNPpY;s{7ip-?
z5?b;^rF&-Jbc?#6g$Fz86;4#!ba0zl9?hC*c#d0Q`rQR$k8FjGaHrYy`~YfuY{h>>
z5XAmq$G@yclD}*>4*UMN9=I;sS7!6(w?s!((j@_Tm#5il^H#0Os=4wzJAH5N*-+oB
zSHJJBTywB)RqM*no8KQ=sy)jrVq<djq^n9Cho=8?_<MBPYx6wz(A>MPL~n1;J9on4
zv7zn}pJ}Tz_HF;^>wPzM;hq~)^TgUtuipLNVouBp%@a>H9^3M$`t!TPoyMm8a(02C
zSA+K?{zy=euqoQKYwzLRrQV$i9Hw7;|1vYPe}CsORaK7Jx#xsm`O4=}hdt_@exLv3
zb?2Ojp0|(oJ_iL2Z_Rf8x2tXMn-qPR`TgqLYt>VKm#>Z78gu<Ci{Zl;D~r#^@6n5S
z^~liR$hjH+vfgt|lw0@I_q%O;U7X+3#x9xVhf}0_e*{(^pL4V9_@T<f=S81AwYrph
z>h$&eN+0fxYSwp`x|%7<yyWDzbd|Q8cD(-Z!dAB3Rlh`3Lnqb6q^u3gE-IR|YGsXh
zlf=v1-KCf9|1AFgZ0-H;@|Tl;<b_XCarHE<5;ZvTf^Tuo_Vj;i3c`UQ()U+VZvLv3
zvzAHj<@#VA71wz?bMoAGLHGU^_MNv;4xFg!d)aN>=B$9PzkgrO;kw^?AYtD%`)}Kl
zfBjB>_qjLKXlBu7S@Bux_x-<MdD|}d`q$;><FXb8<ZWwy@074XXL@>Pj$Xmdv&sFZ
z{K_jUXPeLQt)H*2b^VcRE9=kW{?|*se&Kah0*3GF>+526B<Ou_JrM9|Pio-%-pDts
zd*03b*sp(g*_)d?|K{W#-neSBnd;UxODcjdR(0RBX^e0Eap=dLcgyqYdD<KQ_u5`I
zI~Qpa!GMvZ6OX8OC9P3w{LgDF=T_6H_9wGNGwIl2i@B3ho<fu6|AGhEg^8PX)avRr
u6n>b-cS6BVq4`Gx&m(4|4t_kG8us^YZuW0BmH!3iX$DVMKbLh*2~7YOzwLJb

literal 0
HcmV?d00001

diff --git a/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/ltr-step-buttons-visible-disabled-value.png b/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/ltr-step-buttons-visible-disabled-value.png
index 9c61d2a104768235c15fb230c70dcdfc65568f83..2305e6003b70ee1764a52f59fd502fba56511fd8 100644
GIT binary patch
literal 591
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`og9%8!^*$#Bq!^2X+?^QKos)UVz`(@m>Eakt
zG3V`_SpP>35^WDN6QfLYR6>Pg|Nghn=JyfVoIOjYOxyYAhZN!Fcb{gJ?K;o(z0_ra
z=HxST>kc?<x|=7vV8SZ)hR3co6BO-E2*{^&@EaXrmweRB^U<;Ghk`Sbuyb+u*DB#z
zX`2&2a@%S7PQLT|-~o#*s=ud)tPOj8bW^9TnM`Zov-ZOW=kfNKO<x`QM)6_9jE@o@
z3%9vur`g;oa6mH;Y>n=e&AT`C?TdcYypnS&cc^gE`{_RvlGkS)yl<m_=<ng=dFkfi
z;;%N=cpbTZY|pCqY4&yJ>Mft=?F)+YHhdI)E1bFVnev{C^@}6T)YTWC?tb*`-|i}%
zzc*%HzTbcN-J@Oaif>u&%lfu<%l1><pI?7`_@z9|=X}@8&q^wtRT{NFKF_(<&u?wM
z=kD_@#WjyVXNO0-+s&5`sBC|KcTU@;x}tyH4?kaju5>2z`{i}#k6-@7eEZ?&3ghKx
z_pF&eXa13S8FpEXkZ?NuyvCq%y5;klFWS|QnsbXPO<yK%KlZ+Cb=AegvmZtD_`6rf
zJ)MOmXeB-_ed(wdad>~ivE(Dud4F=T=+68oalhch_8l3D=k7mZ`unhr8CQ%TMbu}e
Zqnqka>#f-N0GL7;JYD@<);T3K0RUDeARGVy

literal 602
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`ogAGU~X-4`2DaPU;cPEB*=VV?oFffUDx;TbZ
z%z1k^*86q<!?BO*FTHOWhFpo$c$MIMXW#$!nF^m5J>b5<%{$l3Gk%Y3&Sl}sOIuF<
zFOOt;9y7;Y-Se_q)Y>p@#tj{>=P_JRVPTaJ6iILiXb^N{bi>WLYs9WE=AG)g@aZJ>
zD;H}DWi(%Yz4Ef<y>;M=^XAV!x29Eoe0Y-acGiXWD{sGLk(HhkXE(pT!s&pS_U3QR
z&5um@b3@bK76&sKC}|w%Siqp%#MHyVg~B;I-B#=DHDeLSg%69CKDLhSlfP~hwQ~8{
z!2aox%WnVfoU~;9<i&w^FCUcV$ZB4CIsNV(+ZURDbv>;t)t31l*SycB{mJR@LkIEu
zex@>NrT*-Uf2>2kEqMKL^1c0RZ(e?Q)9toq@_(xv_pcuOw=OPi=AsqvZsv5>ui2lY
z<thAk&#XTmGfiLj%W@ffdLMAoBmTVQb$8!?QT017t&ZPyWntZ%_n~$+*6@I;;csnw
zo&Efc$NkX1Unjc+WHhJvTW3pY{iy%B?EL0c&zW-8oS)C;c)XAoYw!jZ1Qed(FS_8D
zdabS?;IAHk=z_VY*8F{-uBsBp*;Tgk%hUx7_m2B=;s`2~a078(h`!iWZ1K{ewilRK
O7(8A5T-G@yGywqX=Kk{l

diff --git a/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/ltr-step-buttons-visible-disabled.png b/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/ltr-step-buttons-visible-disabled.png
index e71032cc37d46de0ce0e86cced565f48317b30df..b063763a64bea091920e6e62603b75a6d4a373a1 100644
GIT binary patch
literal 511
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`og9%8!^*$#Bq!^2X+?^QKos)S9WbgEJaSW-L
z^Y+f^tV0eGZ4XZ-8U<YvJ2Llsee_+?^2jR!GQwMDJ8fM0Q+4LAh5OEXnH)K==ZS@i
z^;|!`fD>1x8;-lyOi;8tAt0a9!EbbgUGh;g&qv3$9}3P$!b^7^d05a>TW@3ZlXd#3
z&pH+HBFEP0O3x26<!QgW&wp=j1xNR(>8XaB8ZJJolL*Qel53Uh7nFC8_DMT-n3Wxy
z$v2WVSLW|}vRc({#;+T@ZhSNRTGa`)zsGj|`EA?JvpGE#{v){VS&q+syW^ivmVQ2d
zWybmIW!A~8Z=bE*_+L#Y{PnDVc`myQ*UlGH-hb}i=c}u?zFuQHpMOfZb6sy{&aSne
z&wI=7+wX0#>@)vvyDRG-Ha#t{uItJCf3YO`d3+GRiMR~Z=RtR}4$l3&uISv)C+Xid
z=Wk`Gm)?K%P@*{2@aXyR$!7PpX%Ftr_$cu)RQ3FQgNc&;A1ivVKT2vcS$~xEA3xk&
f+#z~|eWw4JoXquSRIMHZW0b+u)z4*}Q$iB}RZi&c

literal 515
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`ogAGU~X-4`2DaPU;cPEB*=VV?2*?T=*978JR
zyuG_SOWIMQ?O}Ynu*_p6%{vyM2f`=(-p}Lg!DXs>$>I>p`o6qi78`B5)6>4#eBEGu
zbkCW0o3we$cHdps(D5+ZpTVzlfr3YXfQkl(kO&JWR}%}XV^foYqvHf5;ojdo_j0yf
zT^qLbZk6NQ%jPnCS!Oe@WL(+zo+rxwe#Cn7uUlf?+FDwKiC^~YJ-&F^#<MSVufN`_
z&T@Rs`CIvXr&8sfuR4G0djJzw(>c2?U$?!o$okAmmZP1~*OLCNe)pW8-Eua}0a^d#
zUVVHYd|Pn${jbIUmdEX5pL1pTZT+v6*UBO?KF$An-F978<m6u!Ki?myd;R{?Vb{wR
z)*>uV%QY&(r)~Z5Z}Gd=%l6goz4u$AOrwGs?6-jR^97q98?Rk`d-kr?f8WplB_Ogq
zzbrPK-D;}09oBHTB6Fp{qT+1jf!$Zr-<q?V%2uyz`g{e*tmhAXs_$s2zy8<s1qV*s
iOld$1I&2|Y#WqVl$>kaQ<n_Q<W$<+Mb6Mw<&;$UiP1fB2

diff --git a/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/ltr-step-buttons-visible.png b/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/ltr-step-buttons-visible.png
index 997436c0c645de72aa02f8987ad90d6bf5a1224e..6f74a493913ddff433ce800fece601a29a0a9c98 100644
GIT binary patch
literal 891
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`og9%8!^*$#Bq!^2X+?^QKos)UVz`$(k>Eakt
zG3V`_|K7rdGRHrj-}%<ee7k2|rj?d)GgGsHOhlSSryzH?5=%YDpM!ND&##Q<a+)MC
z>6fB%Q{9W%Q&gK=JaiS`cF)`yb?a_fUioWwMc2&v=YFr*emkyz{v7Lf_dZl^+MOJ~
zq{QkhgN8^TKSL|`M@Gpb>?s2B6C7(C*l===oxAH4?e{n6vF6<a&*LA&drV5%E;@Bb
z_gtgpdYZ*SoVt?HK`#C5tP8KaF0_=DG<z_oY-)wm7momq9UluGdB1GCP`RL?;PJyF
z?XPWanB>{)xXo(R!GA)*PNDfn1J5I72<Ji2J-+YpQhgbVzIXp<@b2_eoxW_JtLuAl
zpu7Gpk4jklPulr9Ti(CQidQMs@$XxcrcW+eai{r*k9Wqc@ACGqv$Ff-@=8t^CF=wP
zrfq&GlQiq=k14G?Zy2RZyGJfC%8wJfl(|g$*uUE9-RDZ5y<B~Fmuc+ITiveD?bhFP
zJ1{G%H$O4u#jA)(yJv3SxOx4~OOG~g>j=@>xnswZ&y_3LPfpvv=H;8a2XAieU%P(g
z)gPyv-zJ)!t$zABr1jGhn`1N9Ex%gv=;MhOANI00z7>6&tNZ+X%in!MuXeWF+_3D_
zmm5AUQ{}SO=tcis-e9`5=GN3^_F2tg<&%O_cCX#Kbmi-uAFpe^JpFOxzyn>^K>cqe
z&(CXC{GD|!JK0z;EcSlQlBgGj1&0%7-G0nhzGdy7+DAV&${t+R?mw^HI_mYeH_PO7
zk3Wz*E42IWw(Rr|m*0qs-ZwYk|2Q*EVs-qJ?$sYV!zY(+HLcs<U$yQ|^W}A!lk@N0
z-B-L{^U4D0UyGM7J|EZf{aXq9YNjj2sr_&69+N0OvFQ8hpRb<Waq{^hSbXm{zr23@
z&VN-#i&kYFKKSeM!@gw!&B0>(OrlS1I`+i(jz8-uZ)2P89}3+@$J?_}V-+05>UN%!
z{#{p@kPk`^n;$dp+7NlC!ot70E7s|GBh#VY_RoCmbz<UYguZRw!Em$L+X^LN;Ng6h
Z&NX^FJIt9o0+^c^JYD@<);T3K0RXu1xO4yj

literal 888
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`ogAGU~X-4`2DaPU;cPEB*=VV?oFfbc=x;TbZ
z%z1m)Hbb~j;`qmSpI_6iY+G^EBXIS#RSy(ISw(fbf~Niob75g$=o~wzq_n8KSVYi;
z^(YUQ634!+S)weZ8e!tBA9>f_GMm2SZ1?Pl4^Q=MJoR3F-)t&#$N6XdPVsk>9Q3B2
z=4|McTq?(~LWPA@LP_I*fFolY2bY0MK!aiv6OW)sLdOCIXA~)sPn!y}l-3riFDy~h
zmJ4!M<z`{xVohIR7qfg;*7un#clPa@=;Qn9cZAJ*#>S$nCdP|y&C&|Lz02-txB8??
zewHc5`q}qO177-=txs$ydY<}rH(yt_nooG#HM{bkXm-J!p>_X+HgCU=NNPAsE0_57
z56#tGwiSy*1iw9dnOQ7yeJ6K#$+tgGHRr#*wbR%AH{a@Y+m^WmKaA%%wS3abDQ^4z
z2HbuWmK(F*E%fTuNlP+5=dd=<iTEMv_%lRLJ#|y$+K7E2?BCx%><CeN)BNj)OZfXe
zSO4oXuD-Iba($TlS@jhhFTX5tb3cCNg2Co1i>FMtU$cLspl8*J8%v+>uZ^1V^|;`v
z<wi5-%y9|&&c;^y_n5BhbF=K*(|oNqtdH*H{kl|+zy9H`-n;$r`^2ln{v7MH-eqgB
zV&~b-UtfL>x2^o;Q~q0iW%_qM*_XCQG#6wS^2YC9F~h1fCw%v(zw2F}o9w*Rr#!{K
zRXMS=Joo3<@88zWops;Hzx<tjQ2F(=t-6sRhhBa#zoVxmyf7euTYSrlyTAF1epoTx
zSJIe&Ds6e)=8!|4FK%`#Zq>~TO-^>^R6o4G;MDVAXZ?8XvbW2wt$iDyHv8h;e~z{_
ze?n^awqG&ok6!%FbxV%(@~SJdzJHx8&hj*P;;#*E$B&o3`XXuBx417<yY$nM!nM)2
z7Y1lVy!v?R^qMkV?Mv%+oMzwg;G3TObu5Wz!s`W0jSh;>8EQ_SzEv(8(y`se(6=)3
z_qy#pSFS!Y<q3GVXHD&Oe=m<eDjLiBoBpe4H2i;jhy!0jgeMMg8ntJ<AbE}9Y$(eF
QU{+%AboFyt=akR{0BW|0SO5S3

diff --git a/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/rtl-clear-button.png b/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/rtl-clear-button.png
new file mode 100644
index 0000000000000000000000000000000000000000..870f6ef83abdb0ffe6b1ee102c839ad7787f01e3
GIT binary patch
literal 1025
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`og9%8!^*$#Bq!^2X+?^QKos)UVz`(rQ)5S5Q
zV$Rz;uf2l{WsZL=o|7AV{^J?$ZHu&L&$@9!fNNKPpzj8@CP@#0FDgpfFFv_cUArF;
z7}?m$)wWdgBC8e`57(g;XRh_GyS7L7?zx$>ORExAUj6j^Y5BL_Z<V%_iq-bNZ#JLz
zw=Z3|G*+BJLnVNp;Uo7)M#&@WDFX5n9BUldaB|cp{_HyVA;95k+rGNPpY;s{7ip-?
z5?b;^rF&-Jbc?#6g$Fz86;4#!ba0zl9?hC*c#d0Q`rQR$k8FjGaHrYy`~YfuY{h>>
z5XAmq$G@yclD}*>4*UMN9=I;sS7!6(w?s!((j@_Tm#5il^H#0Os=4wzJAH5N*-+oB
zSHJJBTywB)RqM*no8KQ=sy)jrVq<djq^n9Cho=8?_<MBPYx6wz(A>MPL~n1;J9on4
zv7zn}pJ}Tz_HF;^>wPzM;hq~)^TgUtuipLNVouBp%@a>H9^3M$`t!TPoyMm8a(02C
zSA+K?{zy=euqoQKYwzLRrQV$i9Hw7;|1vYPe}CsORaK7Jx#xsm`O4=}hdt_@exLv3
zb?2Ojp0|(oJ_iL2Z_Rf8x2tXMn-qPR`TgqLYt>VKm#>Z78gu<Ci{Zl;D~r#^@6n5S
z^~liR$hjH+vfgt|lw0@I_q%O;U7X+3#x9xVhf}0_e*{(^pL4V9_@T<f=S81AwYrph
z>h$&eN+0fxYSwp`x|%7<yyWDzbd|Q8cD(-Z!dAB3Rlh`3Lnqb6q^u3gE-IR|YGsXh
zlf=v1-KCf9|1AFgZ0-H;@|Tl;<b_XCarHE<5;ZvTf^Tuo_Vj;i3c`UQ()U+VZvLv3
zvzAHj<@#VA71wz?bMoAGLHGU^_MNv;4xFg!d)aN>=B$9PzkgrO;kw^?AYtD%`)}Kl
zfBjB>_qjLKXlBu7S@Bux_x-<MdD|}d`q$;><FXb8<ZWwy@074XXL@>Pj$Xmdv&sFZ
z{K_jUXPeLQt)H*2b^VcRE9=kW{?|*se&Kah0*3GF>+526B<Ou_JrM9|Pio-%-pDts
zd*03b*sp(g*_)d?|K{W#-neSBnd;UxODcjdR(0RBX^e0Eap=dLcgyqYdD<KQ_u5`I
zI~Qpa!GMvZ6OX8OC9P3w{LgDF=T_6H_9wGNGwIl2i@B3ho<fu6|AGhEg^8PX)avRr
u6n>b-cS6BVq4`Gx&m(4|4t_kG8us^YZuW0BmH!3iX$DVMKbLh*2~7YOzwLJb

literal 0
HcmV?d00001

diff --git a/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/rtl-step-buttons-visible-disabled-value.png b/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/rtl-step-buttons-visible-disabled-value.png
index 9c61d2a104768235c15fb230c70dcdfc65568f83..2305e6003b70ee1764a52f59fd502fba56511fd8 100644
GIT binary patch
literal 591
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`og9%8!^*$#Bq!^2X+?^QKos)UVz`(@m>Eakt
zG3V`_SpP>35^WDN6QfLYR6>Pg|Nghn=JyfVoIOjYOxyYAhZN!Fcb{gJ?K;o(z0_ra
z=HxST>kc?<x|=7vV8SZ)hR3co6BO-E2*{^&@EaXrmweRB^U<;Ghk`Sbuyb+u*DB#z
zX`2&2a@%S7PQLT|-~o#*s=ud)tPOj8bW^9TnM`Zov-ZOW=kfNKO<x`QM)6_9jE@o@
z3%9vur`g;oa6mH;Y>n=e&AT`C?TdcYypnS&cc^gE`{_RvlGkS)yl<m_=<ng=dFkfi
z;;%N=cpbTZY|pCqY4&yJ>Mft=?F)+YHhdI)E1bFVnev{C^@}6T)YTWC?tb*`-|i}%
zzc*%HzTbcN-J@Oaif>u&%lfu<%l1><pI?7`_@z9|=X}@8&q^wtRT{NFKF_(<&u?wM
z=kD_@#WjyVXNO0-+s&5`sBC|KcTU@;x}tyH4?kaju5>2z`{i}#k6-@7eEZ?&3ghKx
z_pF&eXa13S8FpEXkZ?NuyvCq%y5;klFWS|QnsbXPO<yK%KlZ+Cb=AegvmZtD_`6rf
zJ)MOmXeB-_ed(wdad>~ivE(Dud4F=T=+68oalhch_8l3D=k7mZ`unhr8CQ%TMbu}e
Zqnqka>#f-N0GL7;JYD@<);T3K0RUDeARGVy

literal 602
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`ogAGU~X-4`2DaPU;cPEB*=VV?oFffUDx;TbZ
z%z1k^*86q<!?BO*FTHOWhFpo$c$MIMXW#$!nF^m5J>b5<%{$l3Gk%Y3&Sl}sOIuF<
zFOOt;9y7;Y-Se_q)Y>p@#tj{>=P_JRVPTaJ6iILiXb^N{bi>WLYs9WE=AG)g@aZJ>
zD;H}DWi(%Yz4Ef<y>;M=^XAV!x29Eoe0Y-acGiXWD{sGLk(HhkXE(pT!s&pS_U3QR
z&5um@b3@bK76&sKC}|w%Siqp%#MHyVg~B;I-B#=DHDeLSg%69CKDLhSlfP~hwQ~8{
z!2aox%WnVfoU~;9<i&w^FCUcV$ZB4CIsNV(+ZURDbv>;t)t31l*SycB{mJR@LkIEu
zex@>NrT*-Uf2>2kEqMKL^1c0RZ(e?Q)9toq@_(xv_pcuOw=OPi=AsqvZsv5>ui2lY
z<thAk&#XTmGfiLj%W@ffdLMAoBmTVQb$8!?QT017t&ZPyWntZ%_n~$+*6@I;;csnw
zo&Efc$NkX1Unjc+WHhJvTW3pY{iy%B?EL0c&zW-8oS)C;c)XAoYw!jZ1Qed(FS_8D
zdabS?;IAHk=z_VY*8F{-uBsBp*;Tgk%hUx7_m2B=;s`2~a078(h`!iWZ1K{ewilRK
O7(8A5T-G@yGywqX=Kk{l

diff --git a/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/rtl-step-buttons-visible-disabled.png b/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/rtl-step-buttons-visible-disabled.png
index e71032cc37d46de0ce0e86cced565f48317b30df..b063763a64bea091920e6e62603b75a6d4a373a1 100644
GIT binary patch
literal 511
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`og9%8!^*$#Bq!^2X+?^QKos)S9WbgEJaSW-L
z^Y+f^tV0eGZ4XZ-8U<YvJ2Llsee_+?^2jR!GQwMDJ8fM0Q+4LAh5OEXnH)K==ZS@i
z^;|!`fD>1x8;-lyOi;8tAt0a9!EbbgUGh;g&qv3$9}3P$!b^7^d05a>TW@3ZlXd#3
z&pH+HBFEP0O3x26<!QgW&wp=j1xNR(>8XaB8ZJJolL*Qel53Uh7nFC8_DMT-n3Wxy
z$v2WVSLW|}vRc({#;+T@ZhSNRTGa`)zsGj|`EA?JvpGE#{v){VS&q+syW^ivmVQ2d
zWybmIW!A~8Z=bE*_+L#Y{PnDVc`myQ*UlGH-hb}i=c}u?zFuQHpMOfZb6sy{&aSne
z&wI=7+wX0#>@)vvyDRG-Ha#t{uItJCf3YO`d3+GRiMR~Z=RtR}4$l3&uISv)C+Xid
z=Wk`Gm)?K%P@*{2@aXyR$!7PpX%Ftr_$cu)RQ3FQgNc&;A1ivVKT2vcS$~xEA3xk&
f+#z~|eWw4JoXquSRIMHZW0b+u)z4*}Q$iB}RZi&c

literal 515
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`ogAGU~X-4`2DaPU;cPEB*=VV?2*?T=*978JR
zyuG_SOWIMQ?O}Ynu*_p6%{vyM2f`=(-p}Lg!DXs>$>I>p`o6qi78`B5)6>4#eBEGu
zbkCW0o3we$cHdps(D5+ZpTVzlfr3YXfQkl(kO&JWR}%}XV^foYqvHf5;ojdo_j0yf
zT^qLbZk6NQ%jPnCS!Oe@WL(+zo+rxwe#Cn7uUlf?+FDwKiC^~YJ-&F^#<MSVufN`_
z&T@Rs`CIvXr&8sfuR4G0djJzw(>c2?U$?!o$okAmmZP1~*OLCNe)pW8-Eua}0a^d#
zUVVHYd|Pn${jbIUmdEX5pL1pTZT+v6*UBO?KF$An-F978<m6u!Ki?myd;R{?Vb{wR
z)*>uV%QY&(r)~Z5Z}Gd=%l6goz4u$AOrwGs?6-jR^97q98?Rk`d-kr?f8WplB_Ogq
zzbrPK-D;}09oBHTB6Fp{qT+1jf!$Zr-<q?V%2uyz`g{e*tmhAXs_$s2zy8<s1qV*s
iOld$1I&2|Y#WqVl$>kaQ<n_Q<W$<+Mb6Mw<&;$UiP1fB2

diff --git a/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/rtl-step-buttons-visible.png b/packages/number-field/test/visual/lumo/screenshots/number-field/baseline/rtl-step-buttons-visible.png
index 997436c0c645de72aa02f8987ad90d6bf5a1224e..6f74a493913ddff433ce800fece601a29a0a9c98 100644
GIT binary patch
literal 891
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`og9%8!^*$#Bq!^2X+?^QKos)UVz`$(k>Eakt
zG3V`_|K7rdGRHrj-}%<ee7k2|rj?d)GgGsHOhlSSryzH?5=%YDpM!ND&##Q<a+)MC
z>6fB%Q{9W%Q&gK=JaiS`cF)`yb?a_fUioWwMc2&v=YFr*emkyz{v7Lf_dZl^+MOJ~
zq{QkhgN8^TKSL|`M@Gpb>?s2B6C7(C*l===oxAH4?e{n6vF6<a&*LA&drV5%E;@Bb
z_gtgpdYZ*SoVt?HK`#C5tP8KaF0_=DG<z_oY-)wm7momq9UluGdB1GCP`RL?;PJyF
z?XPWanB>{)xXo(R!GA)*PNDfn1J5I72<Ji2J-+YpQhgbVzIXp<@b2_eoxW_JtLuAl
zpu7Gpk4jklPulr9Ti(CQidQMs@$XxcrcW+eai{r*k9Wqc@ACGqv$Ff-@=8t^CF=wP
zrfq&GlQiq=k14G?Zy2RZyGJfC%8wJfl(|g$*uUE9-RDZ5y<B~Fmuc+ITiveD?bhFP
zJ1{G%H$O4u#jA)(yJv3SxOx4~OOG~g>j=@>xnswZ&y_3LPfpvv=H;8a2XAieU%P(g
z)gPyv-zJ)!t$zABr1jGhn`1N9Ex%gv=;MhOANI00z7>6&tNZ+X%in!MuXeWF+_3D_
zmm5AUQ{}SO=tcis-e9`5=GN3^_F2tg<&%O_cCX#Kbmi-uAFpe^JpFOxzyn>^K>cqe
z&(CXC{GD|!JK0z;EcSlQlBgGj1&0%7-G0nhzGdy7+DAV&${t+R?mw^HI_mYeH_PO7
zk3Wz*E42IWw(Rr|m*0qs-ZwYk|2Q*EVs-qJ?$sYV!zY(+HLcs<U$yQ|^W}A!lk@N0
z-B-L{^U4D0UyGM7J|EZf{aXq9YNjj2sr_&69+N0OvFQ8hpRb<Waq{^hSbXm{zr23@
z&VN-#i&kYFKKSeM!@gw!&B0>(OrlS1I`+i(jz8-uZ)2P89}3+@$J?_}V-+05>UN%!
z{#{p@kPk`^n;$dp+7NlC!ot70E7s|GBh#VY_RoCmbz<UYguZRw!Em$L+X^LN;Ng6h
Z&NX^FJIt9o0+^c^JYD@<);T3K0RXu1xO4yj

literal 888
zcmeAS@N?(olHy`uVBq!ia0vp^SAf`ogAGU~X-4`2DaPU;cPEB*=VV?oFfbc=x;TbZ
z%z1m)Hbb~j;`qmSpI_6iY+G^EBXIS#RSy(ISw(fbf~Niob75g$=o~wzq_n8KSVYi;
z^(YUQ634!+S)weZ8e!tBA9>f_GMm2SZ1?Pl4^Q=MJoR3F-)t&#$N6XdPVsk>9Q3B2
z=4|McTq?(~LWPA@LP_I*fFolY2bY0MK!aiv6OW)sLdOCIXA~)sPn!y}l-3riFDy~h
zmJ4!M<z`{xVohIR7qfg;*7un#clPa@=;Qn9cZAJ*#>S$nCdP|y&C&|Lz02-txB8??
zewHc5`q}qO177-=txs$ydY<}rH(yt_nooG#HM{bkXm-J!p>_X+HgCU=NNPAsE0_57
z56#tGwiSy*1iw9dnOQ7yeJ6K#$+tgGHRr#*wbR%AH{a@Y+m^WmKaA%%wS3abDQ^4z
z2HbuWmK(F*E%fTuNlP+5=dd=<iTEMv_%lRLJ#|y$+K7E2?BCx%><CeN)BNj)OZfXe
zSO4oXuD-Iba($TlS@jhhFTX5tb3cCNg2Co1i>FMtU$cLspl8*J8%v+>uZ^1V^|;`v
z<wi5-%y9|&&c;^y_n5BhbF=K*(|oNqtdH*H{kl|+zy9H`-n;$r`^2ln{v7MH-eqgB
zV&~b-UtfL>x2^o;Q~q0iW%_qM*_XCQG#6wS^2YC9F~h1fCw%v(zw2F}o9w*Rr#!{K
zRXMS=Joo3<@88zWops;Hzx<tjQ2F(=t-6sRhhBa#zoVxmyf7euTYSrlyTAF1epoTx
zSJIe&Ds6e)=8!|4FK%`#Zq>~TO-^>^R6o4G;MDVAXZ?8XvbW2wt$iDyHv8h;e~z{_
ze?n^awqG&ok6!%FbxV%(@~SJdzJHx8&hj*P;;#*E$B&o3`XXuBx417<yY$nM!nM)2
z7Y1lVy!v?R^qMkV?Mv%+oMzwg;G3TObu5Wz!s`W0jSh;>8EQ_SzEv(8(y`se(6=)3
z_qy#pSFS!Y<q3GVXHD&Oe=m<eDjLiBoBpe4H2i;jhy!0jgeMMg8ntJ<AbE}9Y$(eF
QU{+%AboFyt=akR{0BW|0SO5S3


From a608f112c9995edb772d4d9ab6c02c017534efde Mon Sep 17 00:00:00 2001
From: Sergey Vinogradov <mr.vursen@gmail.com>
Date: Wed, 30 Apr 2025 17:39:32 +0400
Subject: [PATCH 4/4] restore extended touch area

---
 .../theme/lumo/vaadin-number-field-styles.js      | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/packages/number-field/theme/lumo/vaadin-number-field-styles.js b/packages/number-field/theme/lumo/vaadin-number-field-styles.js
index e23417480b5..94eabf56d4b 100644
--- a/packages/number-field/theme/lumo/vaadin-number-field-styles.js
+++ b/packages/number-field/theme/lumo/vaadin-number-field-styles.js
@@ -17,6 +17,21 @@ const numberField = css`
     opacity: 0.2;
   }
 
+  :host([step-buttons-visible]) [part='input-field'] {
+    padding: 0;
+  }
+
+  [part='decrease-button'],
+  [part='increase-button'] {
+    width: 1.5em;
+    height: 1.5em;
+  }
+
+  [part='decrease-button']::before,
+  [part='increase-button']::before {
+    margin-top: 0.25em;
+  }
+
   [part='decrease-button']::before {
     content: var(--lumo-icons-minus);
   }