@alfalab/core-components 27.9.0 → 27.12.0

package/intl-phone-input/modern/component.d.ts

@@ -4,6 +4,7 @@ import { CountryCode } from 'libphonenumber-js';
 import { SelectProps } from "../../select";
 import { Country } from '@alfalab/utils';
 import { InputAutocompleteProps } from "../../input-autocomplete";
+type MaxPhoneLen = Record<string, number>;
 type IntlPhoneInputProps = Partial<Omit<InputAutocompleteProps, 'onChange'>> & Pick<SelectProps, 'preventFlip'> & {
     /**
      * Значение
@@ -33,6 +34,10 @@ type IntlPhoneInputProps = Partial<Omit<InputAutocompleteProps, 'onChange'>> & P
      * Возможность стереть код страны
      */
     clearableCountryCode?: boolean;
+    /**
+     * Ограничение длин вводимых номеров по странам.
+     */
+    maxPhoneLen?: MaxPhoneLen;
 };
 declare const IntlPhoneInput: React.ForwardRefExoticComponent<Partial<Pick<InputAutocompleteProps, "selected" | "valueRenderer" | "Optgroup" | "size" | "value" | "disabled" | "multiple" | "name" | "placeholder" | "readOnly" | "className" | "id" | "onFocus" | "onBlur" | "onInput" | "onScroll" | "optionsListWidth" | "options" | "visibleOptions" | "open" | "label" | "error" | "hint" | "Arrow" | "dataTestId" | "fieldClassName" | "success" | "block" | "optionGroupClassName" | "Option" | "inputProps" | "optionsListClassName" | "optionClassName" | "popperClassName" | "autocomplete" | "allowUnselect" | "closeOnSelect" | "circularNavigation" | "defaultOpen" | "popoverPosition" | "preventFlip" | "optionsSize" | "fieldProps" | "optionsListProps" | "optionProps" | "onOpen" | "OptionsList" | "updatePopover" | "zIndexPopover" | "showEmptyOptionsList" | "Input">> & Pick<SelectProps, "preventFlip"> & {
     /**
@@ -63,5 +68,9 @@ declare const IntlPhoneInput: React.ForwardRefExoticComponent<Partial<Pick<Input
      * Возможность стереть код страны
      */
     clearableCountryCode?: boolean | undefined;
+    /**
+     * Ограничение длин вводимых номеров по странам.
+     */
+    maxPhoneLen?: Record<string, number> | undefined;
 } & React.RefAttributes<HTMLInputElement>>;
 export { IntlPhoneInputProps, IntlPhoneInput };

package/intl-phone-input/modern/component.js

@@ -1,4 +1,4 @@
-import React, { forwardRef, useState, useRef, useCallback, useEffect } from 'react';
+import React, { forwardRef, useState, useRef, useEffect } from 'react';
 import cn from 'classnames';
 import 'react-merge-refs';
 import '@alfalab/hooks';
@@ -10,96 +10,88 @@ import '../../select/modern';
 import { CountriesSelect } from './components/select/component.js';
 import { formatPhoneWithUnclearableCountryCode } from './utils/format-phone-with-unclearable-country-code.js';
 import { useCaretAvoidCountryCode } from './useCaretAvoidCountryCode.js';
-import { usePreventCaretReset } from './usePreventCaretReset.js';
 
-var styles = {"addons":"intl-phone-input__addons_jc47s","l":"intl-phone-input__l_jc47s","xl":"intl-phone-input__xl_jc47s"};
+var styles = {"addons":"intl-phone-input__addons_8cfhe","l":"intl-phone-input__l_8cfhe","xl":"intl-phone-input__xl_8cfhe"};
 require('./index.css');
 
 const countriesHash = getCountriesHash();
 const MAX_DIAL_CODE_LENGTH = 4;
-const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size = 'm', colors = 'default', options = [], countries = getCountries(), clearableCountryCode = true, className, value, onChange, onCountryChange, defaultCountryIso2 = 'ru', preventFlip, inputProps, ...restProps }, ref) => {
+const MASK_SYMBOLS = [' ', '-', '(', ')'];
+const DEFAULT_MAX_PHONE_LEN = { RU: 11 };
+const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size = 'm', colors = 'default', options = [], countries = getCountries(), clearableCountryCode = true, className, value, onChange, onCountryChange, defaultCountryIso2 = 'ru', preventFlip, inputProps, maxPhoneLen = DEFAULT_MAX_PHONE_LEN, ...restProps }, ref) => {
     const [countryIso2, setCountryIso2] = useState(defaultCountryIso2.toLowerCase());
     const inputRef = useRef(null);
     const [inputWrapperRef, setInputWrapperRef] = useState(null);
+    const [caretPos, setCaretPos] = useState();
     const phoneLibUtils = useRef();
-    const setCountryByIso2 = useCallback((iso2) => {
-        const country = countriesHash[iso2];
-        const inputValue = `+${country.dialCode}`;
-        onChange(inputValue);
-        setCountryIso2(country.iso2);
-        return country;
-    }, [onChange]);
-    const setValue = useCallback(inputValue => {
+    const formatPhone = (inputValue) => {
         let newValue = inputValue;
         if (phoneLibUtils.current) {
             const Utils = phoneLibUtils.current;
             const utils = new Utils(countryIso2.toUpperCase());
             newValue = utils.input(inputValue);
         }
-        onChange(newValue);
-    }, [countryIso2, onChange]);
-    const handleCountryChange = useCallback((countryCode) => {
+        return newValue;
+    };
+    const setCountryByIso2 = (iso2) => {
+        const country = countriesHash[iso2];
+        const inputValue = `+${country.dialCode}`;
+        onChange(inputValue);
+        setCountryIso2(country.iso2);
+        return country;
+    };
+    const handleCountryChange = (countryCode) => {
         if (onCountryChange) {
             onCountryChange(countryCode.toUpperCase());
         }
-    }, [onCountryChange]);
-    const setCountryByDialCode = useCallback(inputValue => {
+    };
+    const setCountryByDialCode = (inputValue) => {
         for (let i = 0; i < countries.length; i++) {
             const country = countries[i];
             if (new RegExp(`^\\+${country.dialCode}`).test(inputValue)) {
                 // Сначала проверяем, если приоритет не указан
                 if (country.priority === undefined) {
-                    setValue(inputValue);
+                    onChange(formatPhone(inputValue));
                     setCountryIso2(country.iso2);
                     handleCountryChange(country.iso2);
                     break;
                 }
                 // Если страна уже была выставлена через селект, и коды совпадают
                 if (countryIso2 === country.iso2) {
-                    setValue(inputValue);
+                    onChange(formatPhone(inputValue));
                     setCountryIso2(country.iso2);
                     handleCountryChange(country.iso2);
                     break;
                     // Если не совпадают - выбираем по приоритету
                 }
                 else if (country.priority === 0) {
-                    setValue(inputValue);
+                    onChange(formatPhone(inputValue));
                     setCountryIso2(country.iso2);
                     handleCountryChange(country.iso2);
                     break;
                 }
             }
         }
-    }, [countries, countryIso2, setValue, handleCountryChange]);
-    const loadPhoneUtils = useCallback(() => {
-        // prettier-ignore
-        return import(/* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-c49027d7.js')
-            .then(utils => {
-            phoneLibUtils.current = utils.AsYouType;
-        })
-            .catch(error => `An error occurred while loading libphonenumber-js:\n${error}`);
-    }, []);
-    const handleInputChange = useCallback((event) => {
-        const { target: { value: targetValue }, } = event;
+    };
+    const setCountryByDialCodeWithLengthCheck = (inputValue) => {
+        if (value.length < MAX_DIAL_CODE_LENGTH) {
+            setCountryByDialCode(inputValue);
+        }
+    };
+    const addCountryCode = (inputValue) => {
         const country = countriesHash[countryIso2];
         if (clearableCountryCode) {
-            const newValue = targetValue.length === 1 && targetValue !== '+'
-                ? `+${targetValue}`
-                : targetValue;
-            setValue(newValue);
-            if (value.length < MAX_DIAL_CODE_LENGTH) {
-                setCountryByDialCode(newValue);
-            }
-            return;
+            return inputValue.length === 1 && inputValue !== '+'
+                ? `+${inputValue}`
+                : inputValue;
         }
-        if (!clearableCountryCode) {
-            const newValue = formatPhoneWithUnclearableCountryCode(targetValue, country);
-            setValue(newValue);
-            return;
-        }
-        setValue(targetValue);
-    }, [clearableCountryCode, countryIso2, setCountryByDialCode, setValue, value.length]);
-    const handleSelectChange = useCallback(({ selected }) => {
+        return formatPhoneWithUnclearableCountryCode(inputValue, country);
+    };
+    const handleInputChange = (event) => {
+        setCountryByDialCodeWithLengthCheck(event.target.value);
+        onChange(formatPhone(addCountryCode(event.target.value)));
+    };
+    const handleSelectChange = ({ selected }) => {
         if (selected) {
             const country = setCountryByIso2(selected.value);
             const inputValue = `+${country.dialCode}`;
@@ -109,27 +101,138 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size =
             }
             handleCountryChange(country.iso2);
         }
-    }, [setCountryByIso2, handleCountryChange]);
-    const handleChange = useCallback((payload) => {
+    };
+    const handleChange = (payload) => {
         const { selected } = payload;
         if (!selected)
             return;
-        if (selected.key.length < MAX_DIAL_CODE_LENGTH) {
-            setCountryByDialCode(selected.key);
+        setCountryByDialCodeWithLengthCheck(selected.key);
+        onChange(formatPhone(selected.key));
+    };
+    const country = countriesHash[countryIso2];
+    const countryCodeLength = `+${country.dialCode}`.length;
+    const handleInputNewChar = (event, caretPosition) => {
+        const input = event.target;
+        const currentValue = input.value;
+        const maxLen = maxPhoneLen?.[countryIso2.toUpperCase()];
+        // Если задана длина номера и номер полностью заполнен, то перезатираем цифры, если каретка не в самом конце.
+        const shouldReplace = !!maxLen && maxLen === currentValue.replace(/\D/g, '').length;
+        let endPhonePart = currentValue.slice(caretPosition);
+        if (shouldReplace) {
+            let cursor = 0;
+            while (MASK_SYMBOLS.includes(endPhonePart.charAt(cursor))) {
+                cursor += 1;
+            }
+            endPhonePart = endPhonePart.slice(cursor + 1);
+        }
+        let newValue = currentValue.slice(0, caretPosition) + event.key + endPhonePart;
+        // Запрещаем ввод, если указана длина номера и номер уже заполнен.
+        if (maxLen && newValue.replace(/\D/g, '').length > maxLen) {
+            newValue = newValue.slice(0, -1);
+        }
+        newValue = formatPhone(addCountryCode(newValue));
+        let newCaretPosition;
+        const isFormatJumps = !shouldReplace && newValue.length - currentValue.length <= 0;
+        // Ситуация, когда происходят скачки номера из-за форматирования, например +7 999 999 99 99 -> +799999999999
+        if (isFormatJumps) {
+            let phonePart = currentValue.slice(0, caretPosition) + event.key;
+            let cursor = 0;
+            while (cursor < phonePart.length && cursor <= newValue.length) {
+                const currChar = phonePart.charAt(cursor);
+                const newValChar = newValue.charAt(cursor);
+                if (currChar !== newValChar) {
+                    if (MASK_SYMBOLS.includes(currChar)) {
+                        phonePart = phonePart.slice(0, cursor) + phonePart.slice(cursor + 1);
+                        // eslint-disable-next-line no-continue
+                        continue;
+                    }
+                    else {
+                        phonePart =
+                            phonePart.slice(0, cursor) + newValChar + phonePart.slice(cursor);
+                    }
+                }
+                cursor += 1;
+            }
+            newCaretPosition = cursor;
+        }
+        else {
+            let cursor = 0;
+            while (newValue.charAt(caretPosition + cursor) &&
+                newValue.charAt(caretPosition + cursor) !== event.key) {
+                cursor += 1;
+            }
+            cursor += 1;
+            newCaretPosition = caretPosition + cursor;
+        }
+        setCaretPos(newCaretPosition);
+        setCountryByDialCodeWithLengthCheck(newValue);
+        onChange(newValue);
+    };
+    const handleDeleteChar = (event, caretPosition) => {
+        const input = event.target;
+        if (!clearableCountryCode && caretPosition <= countryCodeLength)
+            return;
+        const currentValue = input.value;
+        let deletedCharsCount = 1;
+        // Высчитываем новое положение каретки с учетом символов маски.
+        while (caretPosition - deletedCharsCount > 0 &&
+            MASK_SYMBOLS.includes(currentValue.charAt(caretPosition - deletedCharsCount))) {
+            deletedCharsCount += 1;
+        }
+        let newCaretPosition = caretPosition - deletedCharsCount;
+        const newValue = formatPhone(addCountryCode(currentValue.slice(0, newCaretPosition) + currentValue.slice(caretPosition)));
+        const isFormatJumps = newValue.length - currentValue.length >= 0;
+        // Обрабатываем ситуацию, когда происходят скачки номера из-за форматирования, например +799999999999 => +7 999 999 99 99
+        if (isFormatJumps) {
+            let phonePart = currentValue.slice(0, newCaretPosition);
+            let cursor = 0;
+            while (cursor < phonePart.length) {
+                const currChar = newValue.charAt(cursor);
+                if (currChar !== phonePart.charAt(cursor)) {
+                    phonePart = phonePart.slice(0, cursor) + currChar + phonePart.slice(cursor);
+                }
+                cursor += 1;
+            }
+            newCaretPosition = cursor;
+        }
+        setCaretPos(newCaretPosition);
+        setCountryByDialCodeWithLengthCheck(newValue);
+        onChange(newValue);
+    };
+    const handleKeyDown = (event) => {
+        const input = event.target;
+        const caretPosition = input.selectionStart;
+        if (!caretPosition) {
+            return;
+        }
+        if (event.key === 'Backspace') {
+            event.preventDefault();
+            handleDeleteChar(event, caretPosition);
         }
-        setValue(selected.key);
-    }, [setValue, setCountryByDialCode]);
+        if (event.key.length === 1 && /[0-9+]/.test(event.key)) {
+            event.preventDefault();
+            handleInputNewChar(event, caretPosition);
+        }
+    };
     useEffect(() => {
-        if (!phoneLibUtils.current) {
-            loadPhoneUtils().then(() => {
-                setCountryByDialCode(value);
-            });
+        if (inputRef.current && caretPos !== undefined) {
+            inputRef.current.setSelectionRange(caretPos, caretPos);
+            setCaretPos(undefined);
         }
-    }, [countryIso2, loadPhoneUtils, setCountryByDialCode, value]);
-    const country = countriesHash[countryIso2];
-    const countryCodeLength = `+${country.dialCode}`.length;
+    }, [caretPos]);
+    useEffect(() => {
+        if (phoneLibUtils.current)
+            return;
+        import(
+        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-821010ff.js')
+            .then(utils => {
+            phoneLibUtils.current = utils.AsYouType;
+            setCountryByDialCode(value);
+        })
+            .catch(error => `An error occurred while loading libphonenumber-js:\n${error}`);
+        /* eslint-disable-next-line react-hooks/exhaustive-deps */
+    }, [value]);
     useCaretAvoidCountryCode({ inputRef, countryCodeLength, clearableCountryCode });
-    usePreventCaretReset({ inputRef, countryCodeLength, clearableCountryCode });
     return (React.createElement(InputAutocomplete, Object.assign({}, restProps, { ref: ref, inputProps: {
             ...inputProps,
             ref: inputRef,
@@ -138,6 +241,7 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size =
             colors,
             className: cn(className, styles[size]),
             addonsClassName: styles.addons,
+            onKeyDown: handleKeyDown,
             leftAddons: countries.length > 1 && (React.createElement(CountriesSelect, { dataTestId: 'countries-select', disabled: disabled || readOnly, size: size, selected: countryIso2, countries: countries, onChange: handleSelectChange, fieldWidth: inputWrapperRef && inputWrapperRef.getBoundingClientRect().width, preventFlip: preventFlip })),
         }, optionsListWidth: 'field', closeOnSelect: true, onInput: handleInputChange, onChange: handleChange, options: options, disabled: disabled, readOnly: readOnly, size: size, className: className, value: value })));
 });

package/intl-phone-input/modern/components/flag-icon/component.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import cn from 'classnames';
 
-var styles = {"flagIcon":"intl-phone-input__flagIcon_8ilbx","ac":"intl-phone-input__ac_8ilbx","ad":"intl-phone-input__ad_8ilbx","ae":"intl-phone-input__ae_8ilbx","af":"intl-phone-input__af_8ilbx","ag":"intl-phone-input__ag_8ilbx","ai":"intl-phone-input__ai_8ilbx","al":"intl-phone-input__al_8ilbx","am":"intl-phone-input__am_8ilbx","ao":"intl-phone-input__ao_8ilbx","aq":"intl-phone-input__aq_8ilbx","ar":"intl-phone-input__ar_8ilbx","as":"intl-phone-input__as_8ilbx","at":"intl-phone-input__at_8ilbx","au":"intl-phone-input__au_8ilbx","aw":"intl-phone-input__aw_8ilbx","ax":"intl-phone-input__ax_8ilbx","az":"intl-phone-input__az_8ilbx","ba":"intl-phone-input__ba_8ilbx","bb":"intl-phone-input__bb_8ilbx","bd":"intl-phone-input__bd_8ilbx","be":"intl-phone-input__be_8ilbx","bf":"intl-phone-input__bf_8ilbx","bg":"intl-phone-input__bg_8ilbx","bh":"intl-phone-input__bh_8ilbx","bi":"intl-phone-input__bi_8ilbx","bj":"intl-phone-input__bj_8ilbx","bl":"intl-phone-input__bl_8ilbx","bm":"intl-phone-input__bm_8ilbx","bn":"intl-phone-input__bn_8ilbx","bo":"intl-phone-input__bo_8ilbx","bq":"intl-phone-input__bq_8ilbx","br":"intl-phone-input__br_8ilbx","bs":"intl-phone-input__bs_8ilbx","bt":"intl-phone-input__bt_8ilbx","bv":"intl-phone-input__bv_8ilbx","bw":"intl-phone-input__bw_8ilbx","by":"intl-phone-input__by_8ilbx","bz":"intl-phone-input__bz_8ilbx","ca":"intl-phone-input__ca_8ilbx","cc":"intl-phone-input__cc_8ilbx","cd":"intl-phone-input__cd_8ilbx","cf":"intl-phone-input__cf_8ilbx","cg":"intl-phone-input__cg_8ilbx","ch":"intl-phone-input__ch_8ilbx","ci":"intl-phone-input__ci_8ilbx","ck":"intl-phone-input__ck_8ilbx","cl":"intl-phone-input__cl_8ilbx","cm":"intl-phone-input__cm_8ilbx","cn":"intl-phone-input__cn_8ilbx","co":"intl-phone-input__co_8ilbx","cp":"intl-phone-input__cp_8ilbx","cr":"intl-phone-input__cr_8ilbx","cu":"intl-phone-input__cu_8ilbx","cv":"intl-phone-input__cv_8ilbx","cw":"intl-phone-input__cw_8ilbx","cx":"intl-phone-input__cx_8ilbx","cy":"intl-phone-input__cy_8ilbx","cz":"intl-phone-input__cz_8ilbx","de":"intl-phone-input__de_8ilbx","dg":"intl-phone-input__dg_8ilbx","dj":"intl-phone-input__dj_8ilbx","dk":"intl-phone-input__dk_8ilbx","dm":"intl-phone-input__dm_8ilbx","do":"intl-phone-input__do_8ilbx","dz":"intl-phone-input__dz_8ilbx","ea":"intl-phone-input__ea_8ilbx","ec":"intl-phone-input__ec_8ilbx","ee":"intl-phone-input__ee_8ilbx","eg":"intl-phone-input__eg_8ilbx","eh":"intl-phone-input__eh_8ilbx","er":"intl-phone-input__er_8ilbx","es":"intl-phone-input__es_8ilbx","et":"intl-phone-input__et_8ilbx","eu":"intl-phone-input__eu_8ilbx","fi":"intl-phone-input__fi_8ilbx","fj":"intl-phone-input__fj_8ilbx","fk":"intl-phone-input__fk_8ilbx","fm":"intl-phone-input__fm_8ilbx","fo":"intl-phone-input__fo_8ilbx","fr":"intl-phone-input__fr_8ilbx","ga":"intl-phone-input__ga_8ilbx","gb":"intl-phone-input__gb_8ilbx","gd":"intl-phone-input__gd_8ilbx","ge":"intl-phone-input__ge_8ilbx","gf":"intl-phone-input__gf_8ilbx","gg":"intl-phone-input__gg_8ilbx","gh":"intl-phone-input__gh_8ilbx","gi":"intl-phone-input__gi_8ilbx","gl":"intl-phone-input__gl_8ilbx","gm":"intl-phone-input__gm_8ilbx","gn":"intl-phone-input__gn_8ilbx","gp":"intl-phone-input__gp_8ilbx","gq":"intl-phone-input__gq_8ilbx","gr":"intl-phone-input__gr_8ilbx","gs":"intl-phone-input__gs_8ilbx","gt":"intl-phone-input__gt_8ilbx","gu":"intl-phone-input__gu_8ilbx","gw":"intl-phone-input__gw_8ilbx","gy":"intl-phone-input__gy_8ilbx","hk":"intl-phone-input__hk_8ilbx","hm":"intl-phone-input__hm_8ilbx","hn":"intl-phone-input__hn_8ilbx","hr":"intl-phone-input__hr_8ilbx","ht":"intl-phone-input__ht_8ilbx","hu":"intl-phone-input__hu_8ilbx","ic":"intl-phone-input__ic_8ilbx","id":"intl-phone-input__id_8ilbx","ie":"intl-phone-input__ie_8ilbx","il":"intl-phone-input__il_8ilbx","im":"intl-phone-input__im_8ilbx","in":"intl-phone-input__in_8ilbx","io":"intl-phone-input__io_8ilbx","iq":"intl-phone-input__iq_8ilbx","ir":"intl-phone-input__ir_8ilbx","is":"intl-phone-input__is_8ilbx","it":"intl-phone-input__it_8ilbx","je":"intl-phone-input__je_8ilbx","jm":"intl-phone-input__jm_8ilbx","jo":"intl-phone-input__jo_8ilbx","jp":"intl-phone-input__jp_8ilbx","ke":"intl-phone-input__ke_8ilbx","kg":"intl-phone-input__kg_8ilbx","kh":"intl-phone-input__kh_8ilbx","ki":"intl-phone-input__ki_8ilbx","km":"intl-phone-input__km_8ilbx","kn":"intl-phone-input__kn_8ilbx","kp":"intl-phone-input__kp_8ilbx","kr":"intl-phone-input__kr_8ilbx","kw":"intl-phone-input__kw_8ilbx","ky":"intl-phone-input__ky_8ilbx","kz":"intl-phone-input__kz_8ilbx","la":"intl-phone-input__la_8ilbx","lb":"intl-phone-input__lb_8ilbx","lc":"intl-phone-input__lc_8ilbx","li":"intl-phone-input__li_8ilbx","lk":"intl-phone-input__lk_8ilbx","lr":"intl-phone-input__lr_8ilbx","ls":"intl-phone-input__ls_8ilbx","lt":"intl-phone-input__lt_8ilbx","lu":"intl-phone-input__lu_8ilbx","lv":"intl-phone-input__lv_8ilbx","ly":"intl-phone-input__ly_8ilbx","ma":"intl-phone-input__ma_8ilbx","mc":"intl-phone-input__mc_8ilbx","md":"intl-phone-input__md_8ilbx","me":"intl-phone-input__me_8ilbx","mf":"intl-phone-input__mf_8ilbx","mg":"intl-phone-input__mg_8ilbx","mh":"intl-phone-input__mh_8ilbx","mk":"intl-phone-input__mk_8ilbx","ml":"intl-phone-input__ml_8ilbx","mm":"intl-phone-input__mm_8ilbx","mn":"intl-phone-input__mn_8ilbx","mo":"intl-phone-input__mo_8ilbx","mp":"intl-phone-input__mp_8ilbx","mq":"intl-phone-input__mq_8ilbx","mr":"intl-phone-input__mr_8ilbx","ms":"intl-phone-input__ms_8ilbx","mt":"intl-phone-input__mt_8ilbx","mu":"intl-phone-input__mu_8ilbx","mv":"intl-phone-input__mv_8ilbx","mw":"intl-phone-input__mw_8ilbx","mx":"intl-phone-input__mx_8ilbx","my":"intl-phone-input__my_8ilbx","mz":"intl-phone-input__mz_8ilbx","na":"intl-phone-input__na_8ilbx","nc":"intl-phone-input__nc_8ilbx","ne":"intl-phone-input__ne_8ilbx","nf":"intl-phone-input__nf_8ilbx","ng":"intl-phone-input__ng_8ilbx","ni":"intl-phone-input__ni_8ilbx","nl":"intl-phone-input__nl_8ilbx","no":"intl-phone-input__no_8ilbx","np":"intl-phone-input__np_8ilbx","nr":"intl-phone-input__nr_8ilbx","nu":"intl-phone-input__nu_8ilbx","nz":"intl-phone-input__nz_8ilbx","om":"intl-phone-input__om_8ilbx","pa":"intl-phone-input__pa_8ilbx","pe":"intl-phone-input__pe_8ilbx","pf":"intl-phone-input__pf_8ilbx","pg":"intl-phone-input__pg_8ilbx","ph":"intl-phone-input__ph_8ilbx","pk":"intl-phone-input__pk_8ilbx","pl":"intl-phone-input__pl_8ilbx","pm":"intl-phone-input__pm_8ilbx","pn":"intl-phone-input__pn_8ilbx","pr":"intl-phone-input__pr_8ilbx","ps":"intl-phone-input__ps_8ilbx","pt":"intl-phone-input__pt_8ilbx","pw":"intl-phone-input__pw_8ilbx","py":"intl-phone-input__py_8ilbx","qa":"intl-phone-input__qa_8ilbx","re":"intl-phone-input__re_8ilbx","ro":"intl-phone-input__ro_8ilbx","rs":"intl-phone-input__rs_8ilbx","ru":"intl-phone-input__ru_8ilbx","rw":"intl-phone-input__rw_8ilbx","sa":"intl-phone-input__sa_8ilbx","sb":"intl-phone-input__sb_8ilbx","sc":"intl-phone-input__sc_8ilbx","sd":"intl-phone-input__sd_8ilbx","se":"intl-phone-input__se_8ilbx","sg":"intl-phone-input__sg_8ilbx","sh":"intl-phone-input__sh_8ilbx","si":"intl-phone-input__si_8ilbx","sj":"intl-phone-input__sj_8ilbx","sk":"intl-phone-input__sk_8ilbx","sl":"intl-phone-input__sl_8ilbx","sm":"intl-phone-input__sm_8ilbx","sn":"intl-phone-input__sn_8ilbx","so":"intl-phone-input__so_8ilbx","sr":"intl-phone-input__sr_8ilbx","ss":"intl-phone-input__ss_8ilbx","st":"intl-phone-input__st_8ilbx","sv":"intl-phone-input__sv_8ilbx","sx":"intl-phone-input__sx_8ilbx","sy":"intl-phone-input__sy_8ilbx","sz":"intl-phone-input__sz_8ilbx","ta":"intl-phone-input__ta_8ilbx","tc":"intl-phone-input__tc_8ilbx","td":"intl-phone-input__td_8ilbx","tf":"intl-phone-input__tf_8ilbx","tg":"intl-phone-input__tg_8ilbx","th":"intl-phone-input__th_8ilbx","tj":"intl-phone-input__tj_8ilbx","tk":"intl-phone-input__tk_8ilbx","tl":"intl-phone-input__tl_8ilbx","tm":"intl-phone-input__tm_8ilbx","tn":"intl-phone-input__tn_8ilbx","to":"intl-phone-input__to_8ilbx","tr":"intl-phone-input__tr_8ilbx","tt":"intl-phone-input__tt_8ilbx","tv":"intl-phone-input__tv_8ilbx","tw":"intl-phone-input__tw_8ilbx","tz":"intl-phone-input__tz_8ilbx","ua":"intl-phone-input__ua_8ilbx","ug":"intl-phone-input__ug_8ilbx","um":"intl-phone-input__um_8ilbx","un":"intl-phone-input__un_8ilbx","us":"intl-phone-input__us_8ilbx","uy":"intl-phone-input__uy_8ilbx","uz":"intl-phone-input__uz_8ilbx","va":"intl-phone-input__va_8ilbx","vc":"intl-phone-input__vc_8ilbx","ve":"intl-phone-input__ve_8ilbx","vg":"intl-phone-input__vg_8ilbx","vi":"intl-phone-input__vi_8ilbx","vn":"intl-phone-input__vn_8ilbx","vu":"intl-phone-input__vu_8ilbx","wf":"intl-phone-input__wf_8ilbx","ws":"intl-phone-input__ws_8ilbx","xk":"intl-phone-input__xk_8ilbx","ye":"intl-phone-input__ye_8ilbx","yt":"intl-phone-input__yt_8ilbx","za":"intl-phone-input__za_8ilbx","zm":"intl-phone-input__zm_8ilbx","zw":"intl-phone-input__zw_8ilbx"};
+var styles = {"flagIcon":"intl-phone-input__flagIcon_u2ce7","ac":"intl-phone-input__ac_u2ce7","ad":"intl-phone-input__ad_u2ce7","ae":"intl-phone-input__ae_u2ce7","af":"intl-phone-input__af_u2ce7","ag":"intl-phone-input__ag_u2ce7","ai":"intl-phone-input__ai_u2ce7","al":"intl-phone-input__al_u2ce7","am":"intl-phone-input__am_u2ce7","ao":"intl-phone-input__ao_u2ce7","aq":"intl-phone-input__aq_u2ce7","ar":"intl-phone-input__ar_u2ce7","as":"intl-phone-input__as_u2ce7","at":"intl-phone-input__at_u2ce7","au":"intl-phone-input__au_u2ce7","aw":"intl-phone-input__aw_u2ce7","ax":"intl-phone-input__ax_u2ce7","az":"intl-phone-input__az_u2ce7","ba":"intl-phone-input__ba_u2ce7","bb":"intl-phone-input__bb_u2ce7","bd":"intl-phone-input__bd_u2ce7","be":"intl-phone-input__be_u2ce7","bf":"intl-phone-input__bf_u2ce7","bg":"intl-phone-input__bg_u2ce7","bh":"intl-phone-input__bh_u2ce7","bi":"intl-phone-input__bi_u2ce7","bj":"intl-phone-input__bj_u2ce7","bl":"intl-phone-input__bl_u2ce7","bm":"intl-phone-input__bm_u2ce7","bn":"intl-phone-input__bn_u2ce7","bo":"intl-phone-input__bo_u2ce7","bq":"intl-phone-input__bq_u2ce7","br":"intl-phone-input__br_u2ce7","bs":"intl-phone-input__bs_u2ce7","bt":"intl-phone-input__bt_u2ce7","bv":"intl-phone-input__bv_u2ce7","bw":"intl-phone-input__bw_u2ce7","by":"intl-phone-input__by_u2ce7","bz":"intl-phone-input__bz_u2ce7","ca":"intl-phone-input__ca_u2ce7","cc":"intl-phone-input__cc_u2ce7","cd":"intl-phone-input__cd_u2ce7","cf":"intl-phone-input__cf_u2ce7","cg":"intl-phone-input__cg_u2ce7","ch":"intl-phone-input__ch_u2ce7","ci":"intl-phone-input__ci_u2ce7","ck":"intl-phone-input__ck_u2ce7","cl":"intl-phone-input__cl_u2ce7","cm":"intl-phone-input__cm_u2ce7","cn":"intl-phone-input__cn_u2ce7","co":"intl-phone-input__co_u2ce7","cp":"intl-phone-input__cp_u2ce7","cr":"intl-phone-input__cr_u2ce7","cu":"intl-phone-input__cu_u2ce7","cv":"intl-phone-input__cv_u2ce7","cw":"intl-phone-input__cw_u2ce7","cx":"intl-phone-input__cx_u2ce7","cy":"intl-phone-input__cy_u2ce7","cz":"intl-phone-input__cz_u2ce7","de":"intl-phone-input__de_u2ce7","dg":"intl-phone-input__dg_u2ce7","dj":"intl-phone-input__dj_u2ce7","dk":"intl-phone-input__dk_u2ce7","dm":"intl-phone-input__dm_u2ce7","do":"intl-phone-input__do_u2ce7","dz":"intl-phone-input__dz_u2ce7","ea":"intl-phone-input__ea_u2ce7","ec":"intl-phone-input__ec_u2ce7","ee":"intl-phone-input__ee_u2ce7","eg":"intl-phone-input__eg_u2ce7","eh":"intl-phone-input__eh_u2ce7","er":"intl-phone-input__er_u2ce7","es":"intl-phone-input__es_u2ce7","et":"intl-phone-input__et_u2ce7","eu":"intl-phone-input__eu_u2ce7","fi":"intl-phone-input__fi_u2ce7","fj":"intl-phone-input__fj_u2ce7","fk":"intl-phone-input__fk_u2ce7","fm":"intl-phone-input__fm_u2ce7","fo":"intl-phone-input__fo_u2ce7","fr":"intl-phone-input__fr_u2ce7","ga":"intl-phone-input__ga_u2ce7","gb":"intl-phone-input__gb_u2ce7","gd":"intl-phone-input__gd_u2ce7","ge":"intl-phone-input__ge_u2ce7","gf":"intl-phone-input__gf_u2ce7","gg":"intl-phone-input__gg_u2ce7","gh":"intl-phone-input__gh_u2ce7","gi":"intl-phone-input__gi_u2ce7","gl":"intl-phone-input__gl_u2ce7","gm":"intl-phone-input__gm_u2ce7","gn":"intl-phone-input__gn_u2ce7","gp":"intl-phone-input__gp_u2ce7","gq":"intl-phone-input__gq_u2ce7","gr":"intl-phone-input__gr_u2ce7","gs":"intl-phone-input__gs_u2ce7","gt":"intl-phone-input__gt_u2ce7","gu":"intl-phone-input__gu_u2ce7","gw":"intl-phone-input__gw_u2ce7","gy":"intl-phone-input__gy_u2ce7","hk":"intl-phone-input__hk_u2ce7","hm":"intl-phone-input__hm_u2ce7","hn":"intl-phone-input__hn_u2ce7","hr":"intl-phone-input__hr_u2ce7","ht":"intl-phone-input__ht_u2ce7","hu":"intl-phone-input__hu_u2ce7","ic":"intl-phone-input__ic_u2ce7","id":"intl-phone-input__id_u2ce7","ie":"intl-phone-input__ie_u2ce7","il":"intl-phone-input__il_u2ce7","im":"intl-phone-input__im_u2ce7","in":"intl-phone-input__in_u2ce7","io":"intl-phone-input__io_u2ce7","iq":"intl-phone-input__iq_u2ce7","ir":"intl-phone-input__ir_u2ce7","is":"intl-phone-input__is_u2ce7","it":"intl-phone-input__it_u2ce7","je":"intl-phone-input__je_u2ce7","jm":"intl-phone-input__jm_u2ce7","jo":"intl-phone-input__jo_u2ce7","jp":"intl-phone-input__jp_u2ce7","ke":"intl-phone-input__ke_u2ce7","kg":"intl-phone-input__kg_u2ce7","kh":"intl-phone-input__kh_u2ce7","ki":"intl-phone-input__ki_u2ce7","km":"intl-phone-input__km_u2ce7","kn":"intl-phone-input__kn_u2ce7","kp":"intl-phone-input__kp_u2ce7","kr":"intl-phone-input__kr_u2ce7","kw":"intl-phone-input__kw_u2ce7","ky":"intl-phone-input__ky_u2ce7","kz":"intl-phone-input__kz_u2ce7","la":"intl-phone-input__la_u2ce7","lb":"intl-phone-input__lb_u2ce7","lc":"intl-phone-input__lc_u2ce7","li":"intl-phone-input__li_u2ce7","lk":"intl-phone-input__lk_u2ce7","lr":"intl-phone-input__lr_u2ce7","ls":"intl-phone-input__ls_u2ce7","lt":"intl-phone-input__lt_u2ce7","lu":"intl-phone-input__lu_u2ce7","lv":"intl-phone-input__lv_u2ce7","ly":"intl-phone-input__ly_u2ce7","ma":"intl-phone-input__ma_u2ce7","mc":"intl-phone-input__mc_u2ce7","md":"intl-phone-input__md_u2ce7","me":"intl-phone-input__me_u2ce7","mf":"intl-phone-input__mf_u2ce7","mg":"intl-phone-input__mg_u2ce7","mh":"intl-phone-input__mh_u2ce7","mk":"intl-phone-input__mk_u2ce7","ml":"intl-phone-input__ml_u2ce7","mm":"intl-phone-input__mm_u2ce7","mn":"intl-phone-input__mn_u2ce7","mo":"intl-phone-input__mo_u2ce7","mp":"intl-phone-input__mp_u2ce7","mq":"intl-phone-input__mq_u2ce7","mr":"intl-phone-input__mr_u2ce7","ms":"intl-phone-input__ms_u2ce7","mt":"intl-phone-input__mt_u2ce7","mu":"intl-phone-input__mu_u2ce7","mv":"intl-phone-input__mv_u2ce7","mw":"intl-phone-input__mw_u2ce7","mx":"intl-phone-input__mx_u2ce7","my":"intl-phone-input__my_u2ce7","mz":"intl-phone-input__mz_u2ce7","na":"intl-phone-input__na_u2ce7","nc":"intl-phone-input__nc_u2ce7","ne":"intl-phone-input__ne_u2ce7","nf":"intl-phone-input__nf_u2ce7","ng":"intl-phone-input__ng_u2ce7","ni":"intl-phone-input__ni_u2ce7","nl":"intl-phone-input__nl_u2ce7","no":"intl-phone-input__no_u2ce7","np":"intl-phone-input__np_u2ce7","nr":"intl-phone-input__nr_u2ce7","nu":"intl-phone-input__nu_u2ce7","nz":"intl-phone-input__nz_u2ce7","om":"intl-phone-input__om_u2ce7","pa":"intl-phone-input__pa_u2ce7","pe":"intl-phone-input__pe_u2ce7","pf":"intl-phone-input__pf_u2ce7","pg":"intl-phone-input__pg_u2ce7","ph":"intl-phone-input__ph_u2ce7","pk":"intl-phone-input__pk_u2ce7","pl":"intl-phone-input__pl_u2ce7","pm":"intl-phone-input__pm_u2ce7","pn":"intl-phone-input__pn_u2ce7","pr":"intl-phone-input__pr_u2ce7","ps":"intl-phone-input__ps_u2ce7","pt":"intl-phone-input__pt_u2ce7","pw":"intl-phone-input__pw_u2ce7","py":"intl-phone-input__py_u2ce7","qa":"intl-phone-input__qa_u2ce7","re":"intl-phone-input__re_u2ce7","ro":"intl-phone-input__ro_u2ce7","rs":"intl-phone-input__rs_u2ce7","ru":"intl-phone-input__ru_u2ce7","rw":"intl-phone-input__rw_u2ce7","sa":"intl-phone-input__sa_u2ce7","sb":"intl-phone-input__sb_u2ce7","sc":"intl-phone-input__sc_u2ce7","sd":"intl-phone-input__sd_u2ce7","se":"intl-phone-input__se_u2ce7","sg":"intl-phone-input__sg_u2ce7","sh":"intl-phone-input__sh_u2ce7","si":"intl-phone-input__si_u2ce7","sj":"intl-phone-input__sj_u2ce7","sk":"intl-phone-input__sk_u2ce7","sl":"intl-phone-input__sl_u2ce7","sm":"intl-phone-input__sm_u2ce7","sn":"intl-phone-input__sn_u2ce7","so":"intl-phone-input__so_u2ce7","sr":"intl-phone-input__sr_u2ce7","ss":"intl-phone-input__ss_u2ce7","st":"intl-phone-input__st_u2ce7","sv":"intl-phone-input__sv_u2ce7","sx":"intl-phone-input__sx_u2ce7","sy":"intl-phone-input__sy_u2ce7","sz":"intl-phone-input__sz_u2ce7","ta":"intl-phone-input__ta_u2ce7","tc":"intl-phone-input__tc_u2ce7","td":"intl-phone-input__td_u2ce7","tf":"intl-phone-input__tf_u2ce7","tg":"intl-phone-input__tg_u2ce7","th":"intl-phone-input__th_u2ce7","tj":"intl-phone-input__tj_u2ce7","tk":"intl-phone-input__tk_u2ce7","tl":"intl-phone-input__tl_u2ce7","tm":"intl-phone-input__tm_u2ce7","tn":"intl-phone-input__tn_u2ce7","to":"intl-phone-input__to_u2ce7","tr":"intl-phone-input__tr_u2ce7","tt":"intl-phone-input__tt_u2ce7","tv":"intl-phone-input__tv_u2ce7","tw":"intl-phone-input__tw_u2ce7","tz":"intl-phone-input__tz_u2ce7","ua":"intl-phone-input__ua_u2ce7","ug":"intl-phone-input__ug_u2ce7","um":"intl-phone-input__um_u2ce7","un":"intl-phone-input__un_u2ce7","us":"intl-phone-input__us_u2ce7","uy":"intl-phone-input__uy_u2ce7","uz":"intl-phone-input__uz_u2ce7","va":"intl-phone-input__va_u2ce7","vc":"intl-phone-input__vc_u2ce7","ve":"intl-phone-input__ve_u2ce7","vg":"intl-phone-input__vg_u2ce7","vi":"intl-phone-input__vi_u2ce7","vn":"intl-phone-input__vn_u2ce7","vu":"intl-phone-input__vu_u2ce7","wf":"intl-phone-input__wf_u2ce7","ws":"intl-phone-input__ws_u2ce7","xk":"intl-phone-input__xk_u2ce7","ye":"intl-phone-input__ye_u2ce7","yt":"intl-phone-input__yt_u2ce7","za":"intl-phone-input__za_u2ce7","zm":"intl-phone-input__zm_u2ce7","zw":"intl-phone-input__zw_u2ce7"};
 require('./index.css');
 
 /**