ordering-ui-admin-external 1.43.34 → 1.43.35

package/_modules/components/Delivery/UserAddForm/index.js

@@ -55,7 +55,8 @@ var UserAddFormUI = function UserAddFormUI(props) {
     isTourOpen = props.isTourOpen,
     driversGroupsState = props.driversGroupsState,
     selectedDriverGroupIds = props.selectedDriverGroupIds,
-    handleDriverGroupClick = props.handleDriverGroupClick;
+    handleDriverGroupClick = props.handleDriverGroupClick,
+    setCellphoneStartZero = props.setCellphoneStartZero;
   var formMethods = (0, _reactHookForm.useForm)();
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
@@ -188,7 +189,7 @@ var UserAddFormUI = function UserAddFormUI(props) {
       open: false
     });
   };
-  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid) {
+  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid, rawNumber) {
     setUserPhoneNumber(number);
     var phoneNumberParser = null;
     var phoneNumber = {
@@ -216,6 +217,7 @@ var UserAddFormUI = function UserAddFormUI(props) {
         }
       };
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber !== null && rawNumber !== void 0 && rawNumber.number && rawNumber !== null && rawNumber !== void 0 && rawNumber.countryCallingCode ? rawNumber === null || rawNumber === void 0 ? void 0 : rawNumber.number : null);
     handleChangeInput(phoneNumber, true);
   };
   var handleChangeInputEmail = function handleChangeInputEmail(e) {

package/_modules/components/Delivery/UserFormDetails/index.js

@@ -41,7 +41,8 @@ var UserFormDetailsUI = exports.UserFormDetailsUI = function UserFormDetailsUI(p
     userData = props.userData,
     isCustomerMode = props.isCustomerMode,
     isDriversPage = props.isDriversPage,
-    handleChangeSwtich = props.handleChangeSwtich;
+    handleChangeSwtich = props.handleChangeSwtich,
+    setCellphoneStartZero = props.setCellphoneStartZero;
   var formMethods = (0, _reactHookForm.useForm)();
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
@@ -159,7 +160,7 @@ var UserFormDetailsUI = exports.UserFormDetailsUI = function UserFormDetailsUI(p
       handleButtonUpdateClick(changes);
     }
   };
-  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid) {
+  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid, rawNumber) {
     setUserPhoneNumber(number);
     var phoneNumberParser = null;
     var phoneNumber = {
@@ -187,6 +188,7 @@ var UserFormDetailsUI = exports.UserFormDetailsUI = function UserFormDetailsUI(p
         }
       };
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber !== null && rawNumber !== void 0 && rawNumber.number && rawNumber !== null && rawNumber !== void 0 && rawNumber.countryCallingCode ? rawNumber === null || rawNumber === void 0 ? void 0 : rawNumber.number : null);
     handleChangeInput(phoneNumber, true);
   };
   var handleChangeInputEmail = function handleChangeInputEmail(e) {

package/_modules/components/Login/LoginForm/index.js

@@ -64,7 +64,8 @@ var LoginFormUI = function LoginFormUI(props) {
     setOtpState = props.setOtpState,
     useLoginByEmail = props.useLoginByEmail,
     handleChangeCredentials = props.handleChangeCredentials,
-    credentials = props.credentials;
+    credentials = props.credentials,
+    setCellphoneStartZero = props.setCellphoneStartZero;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -160,7 +161,7 @@ var LoginFormUI = function LoginFormUI(props) {
       }
     }
   };
-  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid) {
+  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid, rawNumber) {
     var phoneNumberParser = null;
     var values = {
       country_phone_code: '',
@@ -175,6 +176,7 @@ var LoginFormUI = function LoginFormUI(props) {
         cellphone: phoneNumberParser.nationalNumber
       };
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber !== null && rawNumber !== void 0 && rawNumber.number && rawNumber !== null && rawNumber !== void 0 && rawNumber.countryCallingCode ? rawNumber === null || rawNumber === void 0 ? void 0 : rawNumber.number : null);
     handleChangeCredentials(values);
   };
   (0, _react.useEffect)(function () {

package/_modules/components/Shared/ConfirmAdmin/index.js

@@ -50,7 +50,8 @@ var ConfirmAdminUI = function ConfirmAdminUI(props) {
     generateOtpCode = props.generateOtpCode,
     checkCodeState = props.checkCodeState,
     handleChangeInput = props.handleChangeInput,
-    handleChangeCredentials = props.handleChangeCredentials;
+    handleChangeCredentials = props.handleChangeCredentials,
+    setCellphoneStartZero = props.setCellphoneStartZero;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -100,7 +101,7 @@ var ConfirmAdminUI = function ConfirmAdminUI(props) {
     });
     setOtpState('');
   };
-  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid) {
+  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid, rawNumber) {
     setUserPhoneNumber(number);
     var phoneNumberParser = null;
     var values = {
@@ -116,6 +117,7 @@ var ConfirmAdminUI = function ConfirmAdminUI(props) {
         cellphone: phoneNumberParser.nationalNumber
       };
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber !== null && rawNumber !== void 0 && rawNumber.number && rawNumber !== null && rawNumber !== void 0 && rawNumber.countryCallingCode ? rawNumber === null || rawNumber === void 0 ? void 0 : rawNumber.number : null);
     handleChangeCredentials(values);
   };
   var handleSendOtp = function handleSendOtp() {

package/_modules/components/Shared/InputPhoneNumber/index.js

@@ -38,14 +38,51 @@ var InputPhoneNumber = exports.InputPhoneNumber = function InputPhoneNumber(prop
   var _useConfig = (0, _orderingComponentsAdminExternal.useConfig)(),
     _useConfig2 = _slicedToArray(_useConfig, 1),
     configs = _useConfig2[0].configs;
+  var phoneRef = (0, _react.useRef)(null);
+  var codesStartsWithZero = ['44'];
   var isValidPhoneNumber = function isValidPhoneNumber(number) {
-    var _configs$validation_p, _configs$validation_p2;
+    var _configs$validation_p, _configs$validation_p2, _numberParser$isPossi, _numberParser$isValid;
     if (!number) return;
     if (!parseInt((_configs$validation_p = configs === null || configs === void 0 || (_configs$validation_p2 = configs.validation_phone_number_lib) === null || _configs$validation_p2 === void 0 ? void 0 : _configs$validation_p2.value) !== null && _configs$validation_p !== void 0 ? _configs$validation_p : 1, 10)) {
       return true;
     }
     var numberParser = (0, _libphonenumberJs.default)(number);
-    return numberParser === null || numberParser === void 0 ? void 0 : numberParser.isValid();
+    var enableIspossibly = false;
+    if (codesStartsWithZero.includes(numberParser === null || numberParser === void 0 ? void 0 : numberParser.countryCallingCode)) {
+      var inputNumber = returnRawNumber(number);
+      var validationsForUK = ['01', '02', '07', '0800', '0808', '0845', '0870', '0871'];
+      var result = validationsForUK.some(function (areaCode) {
+        var _inputNumber$number;
+        return inputNumber === null || inputNumber === void 0 || (_inputNumber$number = inputNumber.number) === null || _inputNumber$number === void 0 ? void 0 : _inputNumber$number.startsWith(areaCode);
+      });
+      enableIspossibly = result;
+    }
+    return enableIspossibly ? numberParser === null || numberParser === void 0 || (_numberParser$isPossi = numberParser.isPossible) === null || _numberParser$isPossi === void 0 ? void 0 : _numberParser$isPossi.call(numberParser) : numberParser === null || numberParser === void 0 || (_numberParser$isValid = numberParser.isValid) === null || _numberParser$isValid === void 0 ? void 0 : _numberParser$isValid.call(numberParser);
+  };
+  var returnRawNumber = function returnRawNumber(number) {
+    var _configs$validation_p3, _configs$validation_p4, _phoneRef$current;
+    if (!number) return null;
+    if (!parseInt((_configs$validation_p3 = configs === null || configs === void 0 || (_configs$validation_p4 = configs.validation_phone_number_lib) === null || _configs$validation_p4 === void 0 ? void 0 : _configs$validation_p4.value) !== null && _configs$validation_p3 !== void 0 ? _configs$validation_p3 : 1, 10)) {
+      return null;
+    }
+    var numberParser = (0, _libphonenumberJs.default)(number);
+    var validations = ['0', '+'];
+    if (validations.includes(phoneRef === null || phoneRef === void 0 || (_phoneRef$current = phoneRef.current) === null || _phoneRef$current === void 0 ? void 0 : _phoneRef$current.value[0]) && codesStartsWithZero.includes(numberParser === null || numberParser === void 0 ? void 0 : numberParser.countryCallingCode)) {
+      var _phoneRef$current2, _numberInput$split;
+      var numberInput = phoneRef === null || phoneRef === void 0 || (_phoneRef$current2 = phoneRef.current) === null || _phoneRef$current2 === void 0 ? void 0 : _phoneRef$current2.value.replace('-', '');
+      var numberRaw = '';
+      numberInput === null || numberInput === void 0 || (_numberInput$split = numberInput.split(' ')) === null || _numberInput$split === void 0 || (_numberInput$split = _numberInput$split.filter(function (_splited, i) {
+        return i > 0 || i === 0 && _splited[0] === '0';
+      })) === null || _numberInput$split === void 0 || _numberInput$split.map(function (splited) {
+        numberRaw = "".concat(numberRaw).concat(splited);
+        return numberRaw;
+      });
+      return {
+        number: numberRaw,
+        countryCallingCode: numberParser !== null && numberParser !== void 0 && numberParser.countryCallingCode ? "+".concat(numberParser === null || numberParser === void 0 ? void 0 : numberParser.countryCallingCode) : null
+      };
+    }
+    return number;
   };
   (0, _react.useEffect)(function () {
     if (value) {
@@ -65,13 +102,15 @@ var InputPhoneNumber = exports.InputPhoneNumber = function InputPhoneNumber(prop
       key: i
     }, props));
   }), /*#__PURE__*/_react.default.createElement(_reactPhoneNumberInput.default, {
+    ref: phoneRef,
     disabled: disabled,
     placeholder: t('PHONE_NUMBER', 'Phone number'),
     defaultCountry: (0, _utils.findExitingCode)(configs === null || configs === void 0 || (_configs$default_coun = configs.default_country_code) === null || _configs$default_coun === void 0 || (_configs$default_coun = _configs$default_coun.value) === null || _configs$default_coun === void 0 ? void 0 : _configs$default_coun.toUpperCase()),
     value: value,
-    displayInitialValueAsLocalNumber: true,
+    displayInitialValueAsLocalNumber: !isUser,
+    international: isUser,
     onChange: function onChange(val) {
-      return setValue && setValue(val, isValidPhoneNumber(val));
+      return setValue && setValue(val, isValidPhoneNumber(val), returnRawNumber(val));
     }
   }), value && !isValidPhoneNumber(value) && !disabled && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (auth && (user === null || user === void 0 ? void 0 : user.country_phone_code) || !auth || value.includes('+')) && /*#__PURE__*/_react.default.createElement(_styles.ErrorMsg, null, t('INVALID_ERROR_PHONE_NUMBER', 'The Phone Number field is invalid')), auth && !(user !== null && user !== void 0 && user.country_phone_code) && !value.includes('+') && /*#__PURE__*/_react.default.createElement(_styles.ErrorMsg, null, t('INVALID_ERROR_COUNTRY_CODE_PHONE_NUMBER', 'The country code of the phone number is invalid'))), (_props$afterComponent = props.afterComponents) === null || _props$afterComponent === void 0 ? void 0 : _props$afterComponent.map(function (AfterComponent, i) {
     return /*#__PURE__*/_react.default.createElement(AfterComponent, _extends({

package/_modules/components/Users/ProfessionalAddForm/index.js

@@ -50,7 +50,8 @@ var ProfessionalAddFormUI = function ProfessionalAddFormUI(props) {
     handleChangeSwtich = props.handleChangeSwtich,
     onClose = props.onClose,
     isService = props.isService,
-    occupations = props.occupations;
+    occupations = props.occupations,
+    setCellphoneStartZero = props.setCellphoneStartZero;
   var formMethods = (0, _reactHookForm.useForm)();
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
@@ -121,7 +122,7 @@ var ProfessionalAddFormUI = function ProfessionalAddFormUI(props) {
       handlechangeImage(files[0]);
     }
   };
-  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid) {
+  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid, rawNumber) {
     setUserPhoneNumber(number);
     var phoneNumberParser = null;
     var phoneNumber = {
@@ -149,6 +150,7 @@ var ProfessionalAddFormUI = function ProfessionalAddFormUI(props) {
         }
       };
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber !== null && rawNumber !== void 0 && rawNumber.number && rawNumber !== null && rawNumber !== void 0 && rawNumber.countryCallingCode ? rawNumber === null || rawNumber === void 0 ? void 0 : rawNumber.number : null);
     handleChangeInput(phoneNumber, true);
   };
   var handleChangeInputEmail = function handleChangeInputEmail(e) {

package/_modules/components/Users/UserAddForm/index.js

@@ -51,7 +51,8 @@ var UserAddFormUI = function UserAddFormUI(props) {
     handleChangeSwtich = props.handleChangeSwtich,
     defaultPhoneNumber = props.defaultPhoneNumber,
     isFromCustomOrder = props.isFromCustomOrder,
-    hideUserTypeSelector = props.hideUserTypeSelector;
+    hideUserTypeSelector = props.hideUserTypeSelector,
+    setCellphoneStartZero = props.setCellphoneStartZero;
   var formMethods = (0, _reactHookForm.useForm)();
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
@@ -153,7 +154,7 @@ var UserAddFormUI = function UserAddFormUI(props) {
       open: false
     });
   };
-  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid) {
+  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid, rawNumber) {
     setUserPhoneNumber(number);
     var phoneNumberParser = null;
     var phoneNumber = {
@@ -187,6 +188,7 @@ var UserAddFormUI = function UserAddFormUI(props) {
         }
       };
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber !== null && rawNumber !== void 0 && rawNumber.number && rawNumber !== null && rawNumber !== void 0 && rawNumber.countryCallingCode ? rawNumber === null || rawNumber === void 0 ? void 0 : rawNumber.number : null);
     handleChangeInput(phoneNumber, true);
   };
   var handleChangeInputEmail = function handleChangeInputEmail(e) {

package/_modules/components/Users/UserFormDetails/index.js

@@ -49,7 +49,8 @@ var UserFormDetailsUI = exports.UserFormDetailsUI = function UserFormDetailsUI(p
     handleChangeUserType = props.handleChangeUserType,
     isProfessional = props.isProfessional,
     occupations = props.occupations,
-    handleChangeOccupation = props.handleChangeOccupation;
+    handleChangeOccupation = props.handleChangeOccupation,
+    setCellphoneStartZero = props.setCellphoneStartZero;
   var formMethods = (0, _reactHookForm.useForm)();
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
@@ -166,7 +167,7 @@ var UserFormDetailsUI = exports.UserFormDetailsUI = function UserFormDetailsUI(p
       handleButtonUpdateClick(changes);
     }
   };
-  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid) {
+  var handleChangePhoneNumber = function handleChangePhoneNumber(number, isValid, rawNumber) {
     setUserPhoneNumber(number);
     var phoneNumberParser = null;
     var phoneNumber = {
@@ -200,6 +201,7 @@ var UserFormDetailsUI = exports.UserFormDetailsUI = function UserFormDetailsUI(p
         }
       };
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber !== null && rawNumber !== void 0 && rawNumber.number && rawNumber !== null && rawNumber !== void 0 && rawNumber.countryCallingCode ? rawNumber === null || rawNumber === void 0 ? void 0 : rawNumber.number : null);
     handleChangeInput(phoneNumber, true);
   };
   var handleChangeInputEmail = function handleChangeInputEmail(e) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-admin-external",
-  "version": "1.43.34",
+  "version": "1.43.35",
   "description": "Ordering UI Admin Components",
   "main": "./_modules/index.js",
   "exports": {
@@ -83,7 +83,7 @@
     "lodash": "^4.17.20",
     "moment": "^2.29.1",
     "moment-range": "^4.0.2",
-    "ordering-components-admin-external": "1.43.22",
+    "ordering-components-admin-external": "1.43.23",
     "polished": "^3.6.7",
     "prop-types": "^15.7.2",
     "react-big-calendar": "^1.4.2",

package/src/components/Delivery/UserAddForm/index.js

@@ -53,7 +53,8 @@ const UserAddFormUI = (props) => {
     isTourOpen,
     driversGroupsState,
     selectedDriverGroupIds,
-    handleDriverGroupClick
+    handleDriverGroupClick,
+    setCellphoneStartZero
   } = props
   const formMethods = useForm()
   const [, t] = useLanguage()
@@ -150,7 +151,7 @@ const UserAddFormUI = (props) => {
     setCropState({ name: null, data: null, open: false })
   }
 
-  const handleChangePhoneNumber = (number, isValid) => {
+  const handleChangePhoneNumber = (number, isValid, rawNumber) => {
     setUserPhoneNumber(number)
 
     let phoneNumberParser = null
@@ -179,6 +180,7 @@ const UserAddFormUI = (props) => {
         }
       }
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber?.number && rawNumber?.countryCallingCode ? rawNumber?.number : null)
     handleChangeInput(phoneNumber, true)
   }
 

package/src/components/Delivery/UserFormDetails/index.js

@@ -31,7 +31,8 @@ export const UserFormDetailsUI = (props) => {
     userData,
     isCustomerMode,
     isDriversPage,
-    handleChangeSwtich
+    handleChangeSwtich,
+    setCellphoneStartZero
   } = props
 
   const formMethods = useForm()
@@ -126,7 +127,7 @@ export const UserFormDetailsUI = (props) => {
     }
   }
 
-  const handleChangePhoneNumber = (number, isValid) => {
+  const handleChangePhoneNumber = (number, isValid, rawNumber) => {
     setUserPhoneNumber(number)
 
     let phoneNumberParser = null
@@ -155,6 +156,7 @@ export const UserFormDetailsUI = (props) => {
         }
       }
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber?.number && rawNumber?.countryCallingCode ? rawNumber?.number : null)
     handleChangeInput(phoneNumber, true)
   }
 

package/src/components/Login/LoginForm/index.js

@@ -65,7 +65,8 @@ const LoginFormUI = (props) => {
     setOtpState,
     useLoginByEmail,
     handleChangeCredentials,
-    credentials
+    credentials,
+    setCellphoneStartZero
   } = props
   const [, t] = useLanguage()
   const [ordering] = useApi()
@@ -126,7 +127,7 @@ const LoginFormUI = (props) => {
     }
   }
 
-  const handleChangePhoneNumber = (number, isValid) => {
+  const handleChangePhoneNumber = (number, isValid, rawNumber) => {
     let phoneNumberParser = null
     let values = { country_phone_code: '', cellphone: '' }
 
@@ -139,6 +140,7 @@ const LoginFormUI = (props) => {
         cellphone: phoneNumberParser.nationalNumber
       }
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber?.number && rawNumber?.countryCallingCode ? rawNumber?.number : null)
     handleChangeCredentials(values)
   }
 

package/src/components/Shared/ConfirmAdmin/index.js

@@ -42,7 +42,8 @@ const ConfirmAdminUI = (props) => {
 
     checkCodeState,
     handleChangeInput,
-    handleChangeCredentials
+    handleChangeCredentials,
+    setCellphoneStartZero
   } = props
 
   const [, t] = useLanguage()
@@ -73,7 +74,7 @@ const ConfirmAdminUI = (props) => {
     setOtpState('')
   }
 
-  const handleChangePhoneNumber = (number, isValid) => {
+  const handleChangePhoneNumber = (number, isValid, rawNumber) => {
     setUserPhoneNumber(number)
     let phoneNumberParser = null
     let values = { country_phone_code: '', cellphone: '' }
@@ -87,6 +88,7 @@ const ConfirmAdminUI = (props) => {
         cellphone: phoneNumberParser.nationalNumber
       }
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber?.number && rawNumber?.countryCallingCode ? rawNumber?.number : null)
     handleChangeCredentials(values)
   }
 

package/src/components/Shared/InputPhoneNumber/index.js

@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react'
+import React, { useEffect, useRef } from 'react'
 import parsePhoneNumber from 'libphonenumber-js'
 import PhoneInput from 'react-phone-number-input'
 import { useLanguage, useConfig, useSession } from 'ordering-components-admin-external'
@@ -19,13 +19,48 @@ export const InputPhoneNumber = (props) => {
   const [{ auth }] = useSession()
   const [{ configs }] = useConfig()
 
+  const phoneRef = useRef(null)
+  const codesStartsWithZero = ['44']
+
   const isValidPhoneNumber = (number) => {
     if (!number) return
     if (!parseInt(configs?.validation_phone_number_lib?.value ?? 1, 10)) {
       return true
     }
     const numberParser = parsePhoneNumber(number)
-    return numberParser?.isValid()
+    let enableIspossibly = false
+    if (codesStartsWithZero.includes(numberParser?.countryCallingCode)) {
+      const inputNumber = returnRawNumber(number)
+      const validationsForUK = ['01', '02', '07', '0800', '0808', '0845', '0870', '0871']
+      const result = validationsForUK.some(areaCode => inputNumber?.number?.startsWith(areaCode))
+      enableIspossibly = result
+    }
+
+    return enableIspossibly ? numberParser?.isPossible?.() : numberParser?.isValid?.()
+  }
+
+  const returnRawNumber = (number) => {
+    if (!number) return null
+    if (!parseInt(configs?.validation_phone_number_lib?.value ?? 1, 10)) {
+      return null
+    }
+    const numberParser = parsePhoneNumber(number)
+    const validations = ['0', '+']
+    if (validations.includes(phoneRef?.current?.value[0]) && codesStartsWithZero.includes(numberParser?.countryCallingCode)) {
+      const numberInput = phoneRef?.current?.value.replace('-', '')
+      let numberRaw = ''
+      numberInput?.split(' ')?.filter((_splited, i) => i > 0 || (i === 0 && _splited[0] === '0'))?.map(splited => {
+        numberRaw = `${numberRaw}${splited}`
+        return numberRaw
+      })
+
+      return {
+        number: numberRaw,
+        countryCallingCode: numberParser?.countryCallingCode ? `+${numberParser?.countryCallingCode}` : null
+      }
+    }
+
+    return number
   }
 
   useEffect(() => {
@@ -44,12 +79,14 @@ export const InputPhoneNumber = (props) => {
         {props.beforeComponents?.map((BeforeComponent, i) => (
           <BeforeComponent key={i} {...props} />))}
         <PhoneInput
+          ref={phoneRef}
           disabled={disabled}
           placeholder={t('PHONE_NUMBER', 'Phone number')}
           defaultCountry={findExitingCode(configs?.default_country_code?.value?.toUpperCase())}
           value={value}
-          displayInitialValueAsLocalNumber
-          onChange={(val) => setValue && setValue(val, isValidPhoneNumber(val))}
+          displayInitialValueAsLocalNumber={!isUser}
+          international={isUser}
+          onChange={(val) => setValue && setValue(val, isValidPhoneNumber(val), returnRawNumber(val))}
         />
         {value && !isValidPhoneNumber(value) && !disabled && (
           <>

package/src/components/Users/ProfessionalAddForm/index.js

@@ -44,7 +44,8 @@ const ProfessionalAddFormUI = (props) => {
     handleChangeSwtich,
     onClose,
     isService,
-    occupations
+    occupations,
+    setCellphoneStartZero
   } = props
   const formMethods = useForm()
   const [, t] = useLanguage()
@@ -105,7 +106,7 @@ const ProfessionalAddFormUI = (props) => {
     }
   }
 
-  const handleChangePhoneNumber = (number, isValid) => {
+  const handleChangePhoneNumber = (number, isValid, rawNumber) => {
     setUserPhoneNumber(number)
 
     let phoneNumberParser = null
@@ -134,6 +135,7 @@ const ProfessionalAddFormUI = (props) => {
         }
       }
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber?.number && rawNumber?.countryCallingCode ? rawNumber?.number : null)
     handleChangeInput(phoneNumber, true)
   }
 

package/src/components/Users/UserAddForm/index.js

@@ -44,7 +44,8 @@ const UserAddFormUI = (props) => {
     handleChangeSwtich,
     defaultPhoneNumber,
     isFromCustomOrder,
-    hideUserTypeSelector
+    hideUserTypeSelector,
+    setCellphoneStartZero
   } = props
   const formMethods = useForm()
   const [, t] = useLanguage()
@@ -120,7 +121,7 @@ const UserAddFormUI = (props) => {
     setCropState({ name: null, data: null, open: false })
   }
 
-  const handleChangePhoneNumber = (number, isValid) => {
+  const handleChangePhoneNumber = (number, isValid, rawNumber) => {
     setUserPhoneNumber(number)
 
     let phoneNumberParser = null
@@ -152,6 +153,7 @@ const UserAddFormUI = (props) => {
         }
       }
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber?.number && rawNumber?.countryCallingCode ? rawNumber?.number : null)
     handleChangeInput(phoneNumber, true)
   }
 

package/src/components/Users/UserFormDetails/index.js

@@ -41,7 +41,8 @@ export const UserFormDetailsUI = (props) => {
     handleChangeUserType,
     isProfessional,
     occupations,
-    handleChangeOccupation
+    handleChangeOccupation,
+    setCellphoneStartZero
   } = props
 
   const formMethods = useForm()
@@ -133,7 +134,7 @@ export const UserFormDetailsUI = (props) => {
     }
   }
 
-  const handleChangePhoneNumber = (number, isValid) => {
+  const handleChangePhoneNumber = (number, isValid, rawNumber) => {
     setUserPhoneNumber(number)
 
     let phoneNumberParser = null
@@ -166,6 +167,7 @@ export const UserFormDetailsUI = (props) => {
         }
       }
     }
+    setCellphoneStartZero && setCellphoneStartZero(rawNumber?.number && rawNumber?.countryCallingCode ? rawNumber?.number : null)
     handleChangeInput(phoneNumber, true)
   }