From 07ae1869b39c5f31dc5f95b170e4c9de0089697d Mon Sep 17 00:00:00 2001
From: sirineJ <112706079+sirineJ@users.noreply.github.com>
Date: Fri, 3 Jul 2026 15:44:21 +0200
Subject: [PATCH] Make flag size responsive to PhoneNumberInput size.

---
 .changeset/hip-needles-design.md                   |  5 +++++
 .../PhoneNumberInput/PhoneNumberInput.tsx          | 14 +++++++++++---
 2 files changed, 16 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/hip-needles-design.md

diff --git a/.changeset/hip-needles-design.md b/.changeset/hip-needles-design.md
new file mode 100644
index 0000000000..9dee36589b
--- /dev/null
+++ b/.changeset/hip-needles-design.md
@@ -0,0 +1,5 @@
+---
+"@sumup-oss/circuit-ui": minor
+---
+
+Made PhoneNumberInput default flag size responsive to the input size.
diff --git a/packages/circuit-ui/components/PhoneNumberInput/PhoneNumberInput.tsx b/packages/circuit-ui/components/PhoneNumberInput/PhoneNumberInput.tsx
index 950c323086..f1d17d990f 100644
--- a/packages/circuit-ui/components/PhoneNumberInput/PhoneNumberInput.tsx
+++ b/packages/circuit-ui/components/PhoneNumberInput/PhoneNumberInput.tsx
@@ -199,14 +199,21 @@ export interface PhoneNumberInputProps
   };
 }
 
-const DefaultPrefix: ComponentType<{
+type DefaultPrefixProps = {
   value?: string | number;
   className?: string;
-}> = ({ value, ...rest }) =>
+  size?: FieldSize;
+};
+
+const DefaultPrefix = ({ value, ...rest }: DefaultPrefixProps) =>
   value ? (
     <Flag countryCode={value as FlagProps['countryCode']} alt="" {...rest} />
   ) : null;
 
+const getDefaultPrefix = (size: FieldSize) => (args: DefaultPrefixProps) => (
+  <DefaultPrefix size={size} {...args} />
+);
+
 /**
  * Provides a straightforward way for users to type their phone number in an
  * accurate, consistent format including the country code and subscriber number.
@@ -404,6 +411,7 @@ export function PhoneNumberInput({
               (({ value: inputValue, ...rest }) => (
                 <DefaultPrefix
                   value={getCountry(countryCode.options, inputValue as string)}
+                  size={size}
                   {...rest}
                 />
               ))
@@ -434,7 +442,7 @@ export function PhoneNumberInput({
               countryCodeRef as RefObject<HTMLSelectElement | null>,
               countryCode.ref as ForwardedRef<HTMLSelectElement>,
             )}
-            renderPrefix={countryCode.renderPrefix ?? DefaultPrefix}
+            renderPrefix={countryCode.renderPrefix ?? getDefaultPrefix(size)}
           />
         )}
         <Input