@transferwise/components 0.0.0-experimental-cf10171 → 0.0.0-experimental-ae2a4e7

package/build/index.js

@@ -9650,11 +9650,11 @@ const explodeNumberModel = number => {
   return country ? {
     prefix: country.phone,
     suffix: number.slice(country.phone.length),
-    format: country.phoneFormat ?? ''
+    format: country.phoneFormat
   } : {
-    prefix: '',
+    prefix: null,
     suffix: number.slice(1),
-    format: ''
+    format: undefined
   };
 };
 
@@ -9715,7 +9715,7 @@ const PhoneNumberInput = ({
       return {
         prefix: setDefaultPrefix(locale, countryCode),
         suffix: '',
-        format: ''
+        format: undefined
       };
     }
     return explodeNumberModel(cleanValue);
@@ -9736,29 +9736,22 @@ const PhoneNumberInput = ({
       return;
     }
     const pastedValue = (event.nativeEvent.clipboardData.getData('text/plain') || '').replace(/(\s|-)+/g, '');
-    const {
-      prefix: pastedPrefix,
-      suffix: pastedSuffix
-    } = explodeNumberModel(pastedValue);
-    if (countriesByPrefix.has(pastedPrefix) && ALLOWED_PHONE_CHARS.test(pastedSuffix)) {
-      setInternalValue(prev => ({
-        ...prev,
-        prefix: pastedPrefix,
-        suffix: pastedSuffix
-      }));
+    const pastedNumber = explodeNumberModel(pastedValue);
+    if (pastedNumber.prefix != null && countriesByPrefix.has(pastedNumber.prefix) && ALLOWED_PHONE_CHARS.test(pastedNumber.suffix)) {
+      setInternalValue(pastedNumber);
     }
   };
   React.useEffect(() => {
     if (broadcastedValue === null) {
       return setBroadcastedValue(internalValue);
     }
-    const internalPhoneNumber = internalValue.prefix + internalValue.suffix;
-    const broadcastedPhoneNumber = broadcastedValue.prefix + broadcastedValue.suffix;
+    const internalPhoneNumber = `${internalValue.prefix ?? ''}${internalValue.suffix}`;
+    const broadcastedPhoneNumber = `${broadcastedValue.prefix ?? ''}${broadcastedValue.suffix}`;
     if (internalPhoneNumber === broadcastedPhoneNumber) {
       return;
     }
     const newValue = isValidPhoneNumber(internalPhoneNumber) ? cleanNumber(internalPhoneNumber) : null;
-    onChange(newValue, internalValue.prefix);
+    onChange(newValue, internalValue.prefix ?? '');
     setBroadcastedValue(internalValue);
   }, [onChange, broadcastedValue, internalValue]);
   return /*#__PURE__*/jsxRuntime.jsxs("div", {