Merged in fix/BOOK-323-enter-details-scroll-error (pull request #2986)

Fix/BOOK-323 enter details scroll error

* fix(BOOK-323): scroll to invalid element on submit on enter details

* fix(BOOK-323): update error message design

* fix(BOOK-323): clean up

* fix(BOOK-323): scroll to fields in room in right order

* fix(BOOK-323): add id to translations

* fix(BOOK-323): remove undefined

* fix(BOOK-323): fix submitting state

* fix(BOOK-323): use ref in multiroom for scrolling to right element, add membershipNo

* fix(BOOK-323): fix invalid border country

* fix(BOOK-323): use error message component

* fix(BOOK-323): fix invalid focused styling on mobile

* fix(BOOK-323): remove redundant dependency in callback


Approved-by: Erik Tiekstra
This commit is contained in:
Bianca Widstam
2025-10-24 11:30:56 +00:00
parent 6543ca5dc3
commit c473bbc8b0
27 changed files with 692 additions and 288 deletions

View File

@@ -36,8 +36,8 @@ export const DinersClubIcon = (props: PaymentIconProps) => (
y2="21.6"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#3479C0" />
<stop offset="1" stop-color="#133362" />
<stop stopColor="#3479C0" />
<stop offset="1" stopColor="#133362" />
</linearGradient>
<clipPath id="clip0_5382_46858">
<rect width="48" height="32" fill="white" />

View File

@@ -89,10 +89,10 @@ export const DiscoverIcon = (props: PaymentIconProps) => (
gradientUnits="userSpaceOnUse"
gradientTransform="translate(28.6 17.5998) rotate(-142.431) scale(6.56048 6.47264)"
>
<stop stop-color="#F59900" />
<stop offset="0.210082" stop-color="#F39501" />
<stop offset="0.908163" stop-color="#CE3C0B" />
<stop offset="1" stop-color="#A4420A" />
<stop stopColor="#F59900" />
<stop offset="0.210082" stopColor="#F39501" />
<stop offset="0.908163" stopColor="#CE3C0B" />
<stop offset="1" stopColor="#A4420A" />
</radialGradient>
<clipPath id="clip0_5382_46865">
<rect width="48" height="32" rx="3" fill="white" />

View File

@@ -49,10 +49,10 @@ export const JcbIcon = (props: PaymentIconProps) => (
y2="16.0328"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#007940" />
<stop offset="0.2285" stop-color="#00873F" />
<stop offset="0.7433" stop-color="#40A737" />
<stop offset="1" stop-color="#5CB531" />
<stop stopColor="#007940" />
<stop offset="0.2285" stopColor="#00873F" />
<stop offset="0.7433" stopColor="#40A737" />
<stop offset="1" stopColor="#5CB531" />
</linearGradient>
<linearGradient
id="paint1_linear_5382_46863"
@@ -62,10 +62,10 @@ export const JcbIcon = (props: PaymentIconProps) => (
y2="16.001"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#007940" />
<stop offset="0.2285" stop-color="#00873F" />
<stop offset="0.7433" stop-color="#40A737" />
<stop offset="1" stop-color="#5CB531" />
<stop stopColor="#007940" />
<stop offset="0.2285" stopColor="#00873F" />
<stop offset="0.7433" stopColor="#40A737" />
<stop offset="1" stopColor="#5CB531" />
</linearGradient>
<linearGradient
id="paint2_linear_5382_46863"
@@ -75,10 +75,10 @@ export const JcbIcon = (props: PaymentIconProps) => (
y2="14.4771"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#007940" />
<stop offset="0.2285" stop-color="#00873F" />
<stop offset="0.7433" stop-color="#40A737" />
<stop offset="1" stop-color="#5CB531" />
<stop stopColor="#007940" />
<stop offset="0.2285" stopColor="#00873F" />
<stop offset="0.7433" stopColor="#40A737" />
<stop offset="1" stopColor="#5CB531" />
</linearGradient>
<linearGradient
id="paint3_linear_5382_46863"
@@ -88,11 +88,11 @@ export const JcbIcon = (props: PaymentIconProps) => (
y2="16.001"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#6C2C2F" />
<stop offset="0.1735" stop-color="#882730" />
<stop offset="0.5731" stop-color="#BE1833" />
<stop offset="0.8585" stop-color="#DC0436" />
<stop offset="1" stop-color="#E60039" />
<stop stopColor="#6C2C2F" />
<stop offset="0.1735" stopColor="#882730" />
<stop offset="0.5731" stopColor="#BE1833" />
<stop offset="0.8585" stopColor="#DC0436" />
<stop offset="1" stopColor="#E60039" />
</linearGradient>
<linearGradient
id="paint4_linear_5382_46863"
@@ -102,10 +102,10 @@ export const JcbIcon = (props: PaymentIconProps) => (
y2="16.001"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#1F286F" />
<stop offset="0.4751" stop-color="#004E94" />
<stop offset="0.8261" stop-color="#0066B1" />
<stop offset="1" stop-color="#006FBC" />
<stop stopColor="#1F286F" />
<stop offset="0.4751" stopColor="#004E94" />
<stop offset="0.8261" stopColor="#0066B1" />
<stop offset="1" stopColor="#006FBC" />
</linearGradient>
<clipPath id="clip0_5382_46863">
<rect width="48" height="32" rx="3" fill="white" />

View File

@@ -61,8 +61,8 @@ export const SwishIcon = (props: PaymentIconProps) => {
y2="13.9987"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#EF3220" />
<stop offset="1" stop-color="#FCD205" />
<stop stopColor="#EF3220" />
<stop offset="1" stopColor="#FCD205" />
</linearGradient>
<linearGradient
id="paint1_linear_5382_46851"
@@ -72,10 +72,10 @@ export const SwishIcon = (props: PaymentIconProps) => {
y2="21.8844"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#FCD205" />
<stop offset="0.263921" stop-color="#F47216" />
<stop offset="0.560797" stop-color="#B31A93" />
<stop offset="1" stop-color="#2743A0" />
<stop stopColor="#FCD205" />
<stop offset="0.263921" stopColor="#F47216" />
<stop offset="0.560797" stopColor="#B31A93" />
<stop offset="1" stopColor="#2743A0" />
</linearGradient>
<linearGradient
id="paint2_linear_5382_46851"
@@ -85,10 +85,10 @@ export const SwishIcon = (props: PaymentIconProps) => {
y2="18.0191"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#7FD3B9" />
<stop offset="0.265705" stop-color="#66CDE1" />
<stop offset="0.554471" stop-color="#6D8ED1" />
<stop offset="1" stop-color="#2743A0" />
<stop stopColor="#7FD3B9" />
<stop offset="0.265705" stopColor="#66CDE1" />
<stop offset="0.554471" stopColor="#6D8ED1" />
<stop offset="1" stopColor="#2743A0" />
</linearGradient>
<linearGradient
id="paint3_linear_5382_46851"
@@ -98,10 +98,10 @@ export const SwishIcon = (props: PaymentIconProps) => {
y2="10.1074"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#1E5CB2" />
<stop offset="0.246658" stop-color="#4DC4CE" />
<stop offset="0.564821" stop-color="#66C657" />
<stop offset="1" stop-color="#FCD205" />
<stop stopColor="#1E5CB2" />
<stop offset="0.246658" stopColor="#4DC4CE" />
<stop offset="0.564821" stopColor="#66C657" />
<stop offset="1" stopColor="#FCD205" />
</linearGradient>
<clipPath id="clip0_5382_46851">
<rect width="48" height="32" fill="white" />