@alfalab/core-components 33.0.0 → 33.1.0-beta.0

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

@@ -1,18 +1,20 @@
 import React, { forwardRef, useState, useRef, useEffect } from 'react';
 import cn from 'classnames';
+import WorldMagnifierMIcon from '@alfalab/icons-glyph/WorldMagnifierMIcon';
 import 'react-merge-refs';
 import '@alfalab/hooks';
 import { getCountriesHash, getCountries } from '@alfalab/utils';
 import { InputAutocomplete } from '../../input-autocomplete/modern';
-import './components/flag-icon/component.js';
+import { FlagIcon } from './components/flag-icon/component.js';
 import './components/select-field/component.js';
 import '../../select/modern';
 import { CountriesSelect } from './components/select/component.js';
 import { formatPhoneWithUnclearableCountryCode } from './utils/format-phone-with-unclearable-country-code.js';
 import { calculateCaretPos } from './utils/calculateCaretPos.js';
 import { useCaretAvoidCountryCode } from './useCaretAvoidCountryCode.js';
+import { preparePasteData } from './utils/preparePasteData.js';
 
-var styles = {"addons":"intl-phone-input__addons_1p3pa","l":"intl-phone-input__l_1p3pa","xl":"intl-phone-input__xl_1p3pa"};
+var styles = {"addons":"intl-phone-input__addons_41rpn","l":"intl-phone-input__l_41rpn","xl":"intl-phone-input__xl_41rpn","flagIconWrapper":"intl-phone-input__flagIconWrapper_41rpn","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_41rpn"};
 require('./index.css');
 
 const countriesHash = getCountriesHash();
@@ -20,9 +22,8 @@ const MAX_DIAL_CODE_LENGTH = 4;
 const MASK_SYMBOLS = [' ', '-', '(', ')'];
 const MAX_PHONE_LEN = 15;
 const DEFAULT_MAX_PHONE_LEN_BY_COUNTRY = { 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_BY_COUNTRY, ...restProps }, ref) => {
+const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, staticFlag = false, canBeEmptyCountry = false, ruNumberPriority = false, canClear = false, size = 'm', colors = 'default', options = [], countries = getCountries(), clearableCountryCode = true, className, value, onChange, onCountryChange, defaultCountryIso2 = 'ru', preventFlip, inputProps, maxPhoneLen = DEFAULT_MAX_PHONE_LEN_BY_COUNTRY, ...restProps }, ref) => {
     const [countryIso2, setCountryIso2] = useState(defaultCountryIso2.toLowerCase());
-    const [fieldWidth, setFieldWidth] = useState(0);
     const inputRef = useRef(null);
     const [inputWrapperRef, setInputWrapperRef] = useState(null);
     const [caretPos, setCaretPos] = useState();
@@ -31,7 +32,7 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size =
         let newValue = inputValue;
         if (phoneLibUtils.current) {
             const Utils = phoneLibUtils.current;
-            const utils = new Utils(countryIso2.toUpperCase());
+            const utils = new Utils(countryIso2 ? countryIso2.toUpperCase() : undefined);
             newValue = utils.input(inputValue);
         }
         return newValue;
@@ -45,49 +46,64 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size =
     };
     const handleCountryChange = (countryCode) => {
         if (onCountryChange) {
-            onCountryChange(countryCode.toUpperCase());
+            onCountryChange(countryCode ? countryCode.toUpperCase() : undefined);
         }
     };
-    const setCountryByDialCode = (inputValue) => {
-        for (let i = 0; i < countries.length; i++) {
-            const country = countries[i];
+    const getCountryByNumber = (inputValue) => {
+        // dialcode казахстанских номеров совпадает с российскими, поэтому проверяем отдельно
+        if (new RegExp('^\\+7(\\s)?7').test(inputValue)) {
+            const kzCoutry = countries.find(item => item.iso2 === 'kz');
+            if (kzCoutry) {
+                return kzCoutry;
+            }
+        }
+        const targetCountry = countries.find(country => {
             if (new RegExp(`^\\+${country.dialCode}`).test(inputValue)) {
                 // Сначала проверяем, если приоритет не указан
                 if (country.priority === undefined) {
-                    onChange(formatPhone(inputValue));
-                    setCountryIso2(country.iso2);
-                    handleCountryChange(country.iso2);
-                    break;
+                    return true;
                 }
                 // Если страна уже была выставлена через селект, и коды совпадают
-                if (countryIso2 === country.iso2) {
-                    onChange(formatPhone(inputValue));
-                    setCountryIso2(country.iso2);
-                    handleCountryChange(country.iso2);
-                    break;
-                    // Если не совпадают - выбираем по приоритету
+                if (countryIso2 === country.iso2 && countryIso2 !== 'kz') {
+                    return true;
                 }
-                else if (country.priority === 0) {
-                    onChange(formatPhone(inputValue));
-                    setCountryIso2(country.iso2);
-                    handleCountryChange(country.iso2);
-                    break;
+                // Если не совпадают - выбираем по приоритету
+                if (country.priority === 0) {
+                    return true;
                 }
+                return false;
             }
+            return false;
+        });
+        return targetCountry;
+    };
+    const setCountryByDialCode = (inputValue) => {
+        const country = getCountryByNumber(inputValue);
+        onChange(formatPhone(inputValue));
+        if (country) {
+            setCountryIso2(country.iso2);
+            handleCountryChange(country.iso2);
+        }
+        else if (canBeEmptyCountry) {
+            setCountryIso2(undefined);
+            handleCountryChange(undefined);
         }
     };
     const setCountryByDialCodeWithLengthCheck = (inputValue) => {
-        if (value.length < MAX_DIAL_CODE_LENGTH) {
-            setCountryByDialCode(inputValue);
+        if (inputRef.current) {
+            const { selectionStart } = inputRef.current;
+            if ((selectionStart || 0) <= MAX_DIAL_CODE_LENGTH) {
+                setCountryByDialCode(inputValue);
+            }
         }
     };
     const addCountryCode = (inputValue) => {
-        const country = countriesHash[countryIso2];
-        if (clearableCountryCode) {
+        if (clearableCountryCode || !countryIso2) {
             return inputValue.length === 1 && inputValue !== '+'
                 ? `+${inputValue}`
                 : inputValue;
         }
+        const country = countriesHash[countryIso2];
         return formatPhoneWithUnclearableCountryCode(inputValue, country);
     };
     const handleInputChange = (event) => {
@@ -112,12 +128,15 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size =
         setCountryByDialCodeWithLengthCheck(selected.key);
         onChange(formatPhone(selected.key));
     };
-    const country = countriesHash[countryIso2];
-    const countryCodeLength = `+${country.dialCode}`.length;
+    const country = countryIso2 && countriesHash[countryIso2];
+    const countryCodeLength = country ? `+${country.dialCode}`.length : 0;
+    const isEmptyValue = clearableCountryCode
+        ? value === '' || value === '+'
+        : value.length <= countryCodeLength;
     const handleInputNewChar = (event, caretPosition) => {
         const input = event.target;
         const currentValue = input.value;
-        const maxPhoneLength = maxPhoneLen?.[countryIso2.toUpperCase()] || MAX_PHONE_LEN;
+        const maxPhoneLength = (countryIso2 && maxPhoneLen?.[countryIso2.toUpperCase()]) || MAX_PHONE_LEN;
         // Если номер полностью заполнен, то перезатираем цифры, если каретка не в самом конце.
         const shouldReplace = maxPhoneLength === currentValue.replace(/\D/g, '').length;
         let endPhonePart = currentValue.slice(caretPosition);
@@ -129,10 +148,19 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size =
             endPhonePart = endPhonePart.slice(cursor + 1);
         }
         let newValue = currentValue.slice(0, caretPosition) + event.key + endPhonePart;
+        const newValueDecimal = newValue.replace(/\D/g, '');
         // Запрещаем ввод, если номер уже заполнен.
-        if (newValue.replace(/\D/g, '').length > maxPhoneLength) {
+        if (newValueDecimal.length > maxPhoneLength) {
             newValue = newValue.slice(0, -1);
         }
+        if (ruNumberPriority && !value && countryIso2 === 'ru') {
+            if (newValue === '7' || newValue === '8') {
+                newValue = '+7';
+            }
+            else if (newValueDecimal.length === 1) {
+                newValue = `+7${newValueDecimal}`;
+            }
+        }
         newValue = formatPhone(addCountryCode(newValue));
         let phonePartWithoutMask = currentValue.slice(0, caretPosition).replace(/\D/g, '') + event.key;
         if (shouldReplace && phonePartWithoutMask.length > maxPhoneLength) {
@@ -181,6 +209,34 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size =
             handleInputNewChar(event, caretPosition);
         }
     };
+    const handleClear = () => {
+        if (clearableCountryCode) {
+            onChange('+');
+            if (canBeEmptyCountry) {
+                setCountryIso2(undefined);
+                handleCountryChange(undefined);
+            }
+        }
+        else {
+            onChange(value.substring(0, countryCodeLength));
+        }
+    };
+    const handlePaste = event => {
+        event.preventDefault();
+        const text = event.clipboardData?.getData('Text');
+        if (!text || !inputRef.current) {
+            return;
+        }
+        const { selectionStart, selectionEnd } = inputRef.current;
+        const preparedNumber = preparePasteData(value, text, selectionStart || 0, selectionEnd || 0);
+        const targetCountry = getCountryByNumber(preparedNumber);
+        const maxPhoneLength = (targetCountry && maxPhoneLen?.[targetCountry.iso2.toUpperCase()]) || MAX_PHONE_LEN;
+        const resultNumber = preparedNumber.substring(0, maxPhoneLength + 1);
+        if (resultNumber) {
+            setCountryIso2(targetCountry ? targetCountry.iso2 : undefined);
+            onChange(formatPhone(addCountryCode(resultNumber)));
+        }
+    };
     useEffect(() => {
         if (inputRef.current && caretPos !== undefined) {
             inputRef.current.setSelectionRange(caretPos, caretPos);
@@ -191,21 +247,20 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size =
         if (phoneLibUtils.current)
             return;
         import(
-        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-2d6624f5.js')
+        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-de012527.js')
             .then(utils => {
             phoneLibUtils.current = utils.AsYouType;
-            setCountryByDialCode(value);
+            if (!canBeEmptyCountry) {
+                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 });
-    useEffect(() => {
-        if (inputWrapperRef) {
-            setFieldWidth(inputWrapperRef.getBoundingClientRect().width);
-        }
-    }, [inputWrapperRef]);
     return (React.createElement(InputAutocomplete, Object.assign({}, restProps, { ref: ref, inputProps: {
+            clear: canClear && !isEmptyValue,
+            onClear: handleClear,
             ...inputProps,
             ref: inputRef,
             wrapperRef: setInputWrapperRef,
@@ -214,7 +269,8 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, size =
             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: fieldWidth, preventFlip: preventFlip })),
+            onPaste: handlePaste,
+            leftAddons: staticFlag ? (React.createElement("span", { className: styles.flagIconWrapper }, countryIso2 ? (React.createElement(FlagIcon, { country: countryIso2 })) : (React.createElement(WorldMagnifierMIcon, { className: styles.emptyCountryIcon })))) : (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 })));
 });
 IntlPhoneInput.defaultProps = {

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_w0u1r","ac":"intl-phone-input__ac_w0u1r","ad":"intl-phone-input__ad_w0u1r","ae":"intl-phone-input__ae_w0u1r","af":"intl-phone-input__af_w0u1r","ag":"intl-phone-input__ag_w0u1r","ai":"intl-phone-input__ai_w0u1r","al":"intl-phone-input__al_w0u1r","am":"intl-phone-input__am_w0u1r","ao":"intl-phone-input__ao_w0u1r","aq":"intl-phone-input__aq_w0u1r","ar":"intl-phone-input__ar_w0u1r","as":"intl-phone-input__as_w0u1r","at":"intl-phone-input__at_w0u1r","au":"intl-phone-input__au_w0u1r","aw":"intl-phone-input__aw_w0u1r","ax":"intl-phone-input__ax_w0u1r","az":"intl-phone-input__az_w0u1r","ba":"intl-phone-input__ba_w0u1r","bb":"intl-phone-input__bb_w0u1r","bd":"intl-phone-input__bd_w0u1r","be":"intl-phone-input__be_w0u1r","bf":"intl-phone-input__bf_w0u1r","bg":"intl-phone-input__bg_w0u1r","bh":"intl-phone-input__bh_w0u1r","bi":"intl-phone-input__bi_w0u1r","bj":"intl-phone-input__bj_w0u1r","bl":"intl-phone-input__bl_w0u1r","bm":"intl-phone-input__bm_w0u1r","bn":"intl-phone-input__bn_w0u1r","bo":"intl-phone-input__bo_w0u1r","bq":"intl-phone-input__bq_w0u1r","br":"intl-phone-input__br_w0u1r","bs":"intl-phone-input__bs_w0u1r","bt":"intl-phone-input__bt_w0u1r","bv":"intl-phone-input__bv_w0u1r","bw":"intl-phone-input__bw_w0u1r","by":"intl-phone-input__by_w0u1r","bz":"intl-phone-input__bz_w0u1r","ca":"intl-phone-input__ca_w0u1r","cc":"intl-phone-input__cc_w0u1r","cd":"intl-phone-input__cd_w0u1r","cf":"intl-phone-input__cf_w0u1r","cg":"intl-phone-input__cg_w0u1r","ch":"intl-phone-input__ch_w0u1r","ci":"intl-phone-input__ci_w0u1r","ck":"intl-phone-input__ck_w0u1r","cl":"intl-phone-input__cl_w0u1r","cm":"intl-phone-input__cm_w0u1r","cn":"intl-phone-input__cn_w0u1r","co":"intl-phone-input__co_w0u1r","cp":"intl-phone-input__cp_w0u1r","cr":"intl-phone-input__cr_w0u1r","cu":"intl-phone-input__cu_w0u1r","cv":"intl-phone-input__cv_w0u1r","cw":"intl-phone-input__cw_w0u1r","cx":"intl-phone-input__cx_w0u1r","cy":"intl-phone-input__cy_w0u1r","cz":"intl-phone-input__cz_w0u1r","de":"intl-phone-input__de_w0u1r","dg":"intl-phone-input__dg_w0u1r","dj":"intl-phone-input__dj_w0u1r","dk":"intl-phone-input__dk_w0u1r","dm":"intl-phone-input__dm_w0u1r","do":"intl-phone-input__do_w0u1r","dz":"intl-phone-input__dz_w0u1r","ea":"intl-phone-input__ea_w0u1r","ec":"intl-phone-input__ec_w0u1r","ee":"intl-phone-input__ee_w0u1r","eg":"intl-phone-input__eg_w0u1r","eh":"intl-phone-input__eh_w0u1r","er":"intl-phone-input__er_w0u1r","es":"intl-phone-input__es_w0u1r","et":"intl-phone-input__et_w0u1r","eu":"intl-phone-input__eu_w0u1r","fi":"intl-phone-input__fi_w0u1r","fj":"intl-phone-input__fj_w0u1r","fk":"intl-phone-input__fk_w0u1r","fm":"intl-phone-input__fm_w0u1r","fo":"intl-phone-input__fo_w0u1r","fr":"intl-phone-input__fr_w0u1r","ga":"intl-phone-input__ga_w0u1r","gb":"intl-phone-input__gb_w0u1r","gd":"intl-phone-input__gd_w0u1r","ge":"intl-phone-input__ge_w0u1r","gf":"intl-phone-input__gf_w0u1r","gg":"intl-phone-input__gg_w0u1r","gh":"intl-phone-input__gh_w0u1r","gi":"intl-phone-input__gi_w0u1r","gl":"intl-phone-input__gl_w0u1r","gm":"intl-phone-input__gm_w0u1r","gn":"intl-phone-input__gn_w0u1r","gp":"intl-phone-input__gp_w0u1r","gq":"intl-phone-input__gq_w0u1r","gr":"intl-phone-input__gr_w0u1r","gs":"intl-phone-input__gs_w0u1r","gt":"intl-phone-input__gt_w0u1r","gu":"intl-phone-input__gu_w0u1r","gw":"intl-phone-input__gw_w0u1r","gy":"intl-phone-input__gy_w0u1r","hk":"intl-phone-input__hk_w0u1r","hm":"intl-phone-input__hm_w0u1r","hn":"intl-phone-input__hn_w0u1r","hr":"intl-phone-input__hr_w0u1r","ht":"intl-phone-input__ht_w0u1r","hu":"intl-phone-input__hu_w0u1r","ic":"intl-phone-input__ic_w0u1r","id":"intl-phone-input__id_w0u1r","ie":"intl-phone-input__ie_w0u1r","il":"intl-phone-input__il_w0u1r","im":"intl-phone-input__im_w0u1r","in":"intl-phone-input__in_w0u1r","io":"intl-phone-input__io_w0u1r","iq":"intl-phone-input__iq_w0u1r","ir":"intl-phone-input__ir_w0u1r","is":"intl-phone-input__is_w0u1r","it":"intl-phone-input__it_w0u1r","je":"intl-phone-input__je_w0u1r","jm":"intl-phone-input__jm_w0u1r","jo":"intl-phone-input__jo_w0u1r","jp":"intl-phone-input__jp_w0u1r","ke":"intl-phone-input__ke_w0u1r","kg":"intl-phone-input__kg_w0u1r","kh":"intl-phone-input__kh_w0u1r","ki":"intl-phone-input__ki_w0u1r","km":"intl-phone-input__km_w0u1r","kn":"intl-phone-input__kn_w0u1r","kp":"intl-phone-input__kp_w0u1r","kr":"intl-phone-input__kr_w0u1r","kw":"intl-phone-input__kw_w0u1r","ky":"intl-phone-input__ky_w0u1r","kz":"intl-phone-input__kz_w0u1r","la":"intl-phone-input__la_w0u1r","lb":"intl-phone-input__lb_w0u1r","lc":"intl-phone-input__lc_w0u1r","li":"intl-phone-input__li_w0u1r","lk":"intl-phone-input__lk_w0u1r","lr":"intl-phone-input__lr_w0u1r","ls":"intl-phone-input__ls_w0u1r","lt":"intl-phone-input__lt_w0u1r","lu":"intl-phone-input__lu_w0u1r","lv":"intl-phone-input__lv_w0u1r","ly":"intl-phone-input__ly_w0u1r","ma":"intl-phone-input__ma_w0u1r","mc":"intl-phone-input__mc_w0u1r","md":"intl-phone-input__md_w0u1r","me":"intl-phone-input__me_w0u1r","mf":"intl-phone-input__mf_w0u1r","mg":"intl-phone-input__mg_w0u1r","mh":"intl-phone-input__mh_w0u1r","mk":"intl-phone-input__mk_w0u1r","ml":"intl-phone-input__ml_w0u1r","mm":"intl-phone-input__mm_w0u1r","mn":"intl-phone-input__mn_w0u1r","mo":"intl-phone-input__mo_w0u1r","mp":"intl-phone-input__mp_w0u1r","mq":"intl-phone-input__mq_w0u1r","mr":"intl-phone-input__mr_w0u1r","ms":"intl-phone-input__ms_w0u1r","mt":"intl-phone-input__mt_w0u1r","mu":"intl-phone-input__mu_w0u1r","mv":"intl-phone-input__mv_w0u1r","mw":"intl-phone-input__mw_w0u1r","mx":"intl-phone-input__mx_w0u1r","my":"intl-phone-input__my_w0u1r","mz":"intl-phone-input__mz_w0u1r","na":"intl-phone-input__na_w0u1r","nc":"intl-phone-input__nc_w0u1r","ne":"intl-phone-input__ne_w0u1r","nf":"intl-phone-input__nf_w0u1r","ng":"intl-phone-input__ng_w0u1r","ni":"intl-phone-input__ni_w0u1r","nl":"intl-phone-input__nl_w0u1r","no":"intl-phone-input__no_w0u1r","np":"intl-phone-input__np_w0u1r","nr":"intl-phone-input__nr_w0u1r","nu":"intl-phone-input__nu_w0u1r","nz":"intl-phone-input__nz_w0u1r","om":"intl-phone-input__om_w0u1r","pa":"intl-phone-input__pa_w0u1r","pe":"intl-phone-input__pe_w0u1r","pf":"intl-phone-input__pf_w0u1r","pg":"intl-phone-input__pg_w0u1r","ph":"intl-phone-input__ph_w0u1r","pk":"intl-phone-input__pk_w0u1r","pl":"intl-phone-input__pl_w0u1r","pm":"intl-phone-input__pm_w0u1r","pn":"intl-phone-input__pn_w0u1r","pr":"intl-phone-input__pr_w0u1r","ps":"intl-phone-input__ps_w0u1r","pt":"intl-phone-input__pt_w0u1r","pw":"intl-phone-input__pw_w0u1r","py":"intl-phone-input__py_w0u1r","qa":"intl-phone-input__qa_w0u1r","re":"intl-phone-input__re_w0u1r","ro":"intl-phone-input__ro_w0u1r","rs":"intl-phone-input__rs_w0u1r","ru":"intl-phone-input__ru_w0u1r","rw":"intl-phone-input__rw_w0u1r","sa":"intl-phone-input__sa_w0u1r","sb":"intl-phone-input__sb_w0u1r","sc":"intl-phone-input__sc_w0u1r","sd":"intl-phone-input__sd_w0u1r","se":"intl-phone-input__se_w0u1r","sg":"intl-phone-input__sg_w0u1r","sh":"intl-phone-input__sh_w0u1r","si":"intl-phone-input__si_w0u1r","sj":"intl-phone-input__sj_w0u1r","sk":"intl-phone-input__sk_w0u1r","sl":"intl-phone-input__sl_w0u1r","sm":"intl-phone-input__sm_w0u1r","sn":"intl-phone-input__sn_w0u1r","so":"intl-phone-input__so_w0u1r","sr":"intl-phone-input__sr_w0u1r","ss":"intl-phone-input__ss_w0u1r","st":"intl-phone-input__st_w0u1r","sv":"intl-phone-input__sv_w0u1r","sx":"intl-phone-input__sx_w0u1r","sy":"intl-phone-input__sy_w0u1r","sz":"intl-phone-input__sz_w0u1r","ta":"intl-phone-input__ta_w0u1r","tc":"intl-phone-input__tc_w0u1r","td":"intl-phone-input__td_w0u1r","tf":"intl-phone-input__tf_w0u1r","tg":"intl-phone-input__tg_w0u1r","th":"intl-phone-input__th_w0u1r","tj":"intl-phone-input__tj_w0u1r","tk":"intl-phone-input__tk_w0u1r","tl":"intl-phone-input__tl_w0u1r","tm":"intl-phone-input__tm_w0u1r","tn":"intl-phone-input__tn_w0u1r","to":"intl-phone-input__to_w0u1r","tr":"intl-phone-input__tr_w0u1r","tt":"intl-phone-input__tt_w0u1r","tv":"intl-phone-input__tv_w0u1r","tw":"intl-phone-input__tw_w0u1r","tz":"intl-phone-input__tz_w0u1r","ua":"intl-phone-input__ua_w0u1r","ug":"intl-phone-input__ug_w0u1r","um":"intl-phone-input__um_w0u1r","un":"intl-phone-input__un_w0u1r","us":"intl-phone-input__us_w0u1r","uy":"intl-phone-input__uy_w0u1r","uz":"intl-phone-input__uz_w0u1r","va":"intl-phone-input__va_w0u1r","vc":"intl-phone-input__vc_w0u1r","ve":"intl-phone-input__ve_w0u1r","vg":"intl-phone-input__vg_w0u1r","vi":"intl-phone-input__vi_w0u1r","vn":"intl-phone-input__vn_w0u1r","vu":"intl-phone-input__vu_w0u1r","wf":"intl-phone-input__wf_w0u1r","ws":"intl-phone-input__ws_w0u1r","xk":"intl-phone-input__xk_w0u1r","ye":"intl-phone-input__ye_w0u1r","yt":"intl-phone-input__yt_w0u1r","za":"intl-phone-input__za_w0u1r","zm":"intl-phone-input__zm_w0u1r","zw":"intl-phone-input__zw_w0u1r"};
+var styles = {"flagIcon":"intl-phone-input__flagIcon_1akcv","ac":"intl-phone-input__ac_1akcv","ad":"intl-phone-input__ad_1akcv","ae":"intl-phone-input__ae_1akcv","af":"intl-phone-input__af_1akcv","ag":"intl-phone-input__ag_1akcv","ai":"intl-phone-input__ai_1akcv","al":"intl-phone-input__al_1akcv","am":"intl-phone-input__am_1akcv","ao":"intl-phone-input__ao_1akcv","aq":"intl-phone-input__aq_1akcv","ar":"intl-phone-input__ar_1akcv","as":"intl-phone-input__as_1akcv","at":"intl-phone-input__at_1akcv","au":"intl-phone-input__au_1akcv","aw":"intl-phone-input__aw_1akcv","ax":"intl-phone-input__ax_1akcv","az":"intl-phone-input__az_1akcv","ba":"intl-phone-input__ba_1akcv","bb":"intl-phone-input__bb_1akcv","bd":"intl-phone-input__bd_1akcv","be":"intl-phone-input__be_1akcv","bf":"intl-phone-input__bf_1akcv","bg":"intl-phone-input__bg_1akcv","bh":"intl-phone-input__bh_1akcv","bi":"intl-phone-input__bi_1akcv","bj":"intl-phone-input__bj_1akcv","bl":"intl-phone-input__bl_1akcv","bm":"intl-phone-input__bm_1akcv","bn":"intl-phone-input__bn_1akcv","bo":"intl-phone-input__bo_1akcv","bq":"intl-phone-input__bq_1akcv","br":"intl-phone-input__br_1akcv","bs":"intl-phone-input__bs_1akcv","bt":"intl-phone-input__bt_1akcv","bv":"intl-phone-input__bv_1akcv","bw":"intl-phone-input__bw_1akcv","by":"intl-phone-input__by_1akcv","bz":"intl-phone-input__bz_1akcv","ca":"intl-phone-input__ca_1akcv","cc":"intl-phone-input__cc_1akcv","cd":"intl-phone-input__cd_1akcv","cf":"intl-phone-input__cf_1akcv","cg":"intl-phone-input__cg_1akcv","ch":"intl-phone-input__ch_1akcv","ci":"intl-phone-input__ci_1akcv","ck":"intl-phone-input__ck_1akcv","cl":"intl-phone-input__cl_1akcv","cm":"intl-phone-input__cm_1akcv","cn":"intl-phone-input__cn_1akcv","co":"intl-phone-input__co_1akcv","cp":"intl-phone-input__cp_1akcv","cr":"intl-phone-input__cr_1akcv","cu":"intl-phone-input__cu_1akcv","cv":"intl-phone-input__cv_1akcv","cw":"intl-phone-input__cw_1akcv","cx":"intl-phone-input__cx_1akcv","cy":"intl-phone-input__cy_1akcv","cz":"intl-phone-input__cz_1akcv","de":"intl-phone-input__de_1akcv","dg":"intl-phone-input__dg_1akcv","dj":"intl-phone-input__dj_1akcv","dk":"intl-phone-input__dk_1akcv","dm":"intl-phone-input__dm_1akcv","do":"intl-phone-input__do_1akcv","dz":"intl-phone-input__dz_1akcv","ea":"intl-phone-input__ea_1akcv","ec":"intl-phone-input__ec_1akcv","ee":"intl-phone-input__ee_1akcv","eg":"intl-phone-input__eg_1akcv","eh":"intl-phone-input__eh_1akcv","er":"intl-phone-input__er_1akcv","es":"intl-phone-input__es_1akcv","et":"intl-phone-input__et_1akcv","eu":"intl-phone-input__eu_1akcv","fi":"intl-phone-input__fi_1akcv","fj":"intl-phone-input__fj_1akcv","fk":"intl-phone-input__fk_1akcv","fm":"intl-phone-input__fm_1akcv","fo":"intl-phone-input__fo_1akcv","fr":"intl-phone-input__fr_1akcv","ga":"intl-phone-input__ga_1akcv","gb":"intl-phone-input__gb_1akcv","gd":"intl-phone-input__gd_1akcv","ge":"intl-phone-input__ge_1akcv","gf":"intl-phone-input__gf_1akcv","gg":"intl-phone-input__gg_1akcv","gh":"intl-phone-input__gh_1akcv","gi":"intl-phone-input__gi_1akcv","gl":"intl-phone-input__gl_1akcv","gm":"intl-phone-input__gm_1akcv","gn":"intl-phone-input__gn_1akcv","gp":"intl-phone-input__gp_1akcv","gq":"intl-phone-input__gq_1akcv","gr":"intl-phone-input__gr_1akcv","gs":"intl-phone-input__gs_1akcv","gt":"intl-phone-input__gt_1akcv","gu":"intl-phone-input__gu_1akcv","gw":"intl-phone-input__gw_1akcv","gy":"intl-phone-input__gy_1akcv","hk":"intl-phone-input__hk_1akcv","hm":"intl-phone-input__hm_1akcv","hn":"intl-phone-input__hn_1akcv","hr":"intl-phone-input__hr_1akcv","ht":"intl-phone-input__ht_1akcv","hu":"intl-phone-input__hu_1akcv","ic":"intl-phone-input__ic_1akcv","id":"intl-phone-input__id_1akcv","ie":"intl-phone-input__ie_1akcv","il":"intl-phone-input__il_1akcv","im":"intl-phone-input__im_1akcv","in":"intl-phone-input__in_1akcv","io":"intl-phone-input__io_1akcv","iq":"intl-phone-input__iq_1akcv","ir":"intl-phone-input__ir_1akcv","is":"intl-phone-input__is_1akcv","it":"intl-phone-input__it_1akcv","je":"intl-phone-input__je_1akcv","jm":"intl-phone-input__jm_1akcv","jo":"intl-phone-input__jo_1akcv","jp":"intl-phone-input__jp_1akcv","ke":"intl-phone-input__ke_1akcv","kg":"intl-phone-input__kg_1akcv","kh":"intl-phone-input__kh_1akcv","ki":"intl-phone-input__ki_1akcv","km":"intl-phone-input__km_1akcv","kn":"intl-phone-input__kn_1akcv","kp":"intl-phone-input__kp_1akcv","kr":"intl-phone-input__kr_1akcv","kw":"intl-phone-input__kw_1akcv","ky":"intl-phone-input__ky_1akcv","kz":"intl-phone-input__kz_1akcv","la":"intl-phone-input__la_1akcv","lb":"intl-phone-input__lb_1akcv","lc":"intl-phone-input__lc_1akcv","li":"intl-phone-input__li_1akcv","lk":"intl-phone-input__lk_1akcv","lr":"intl-phone-input__lr_1akcv","ls":"intl-phone-input__ls_1akcv","lt":"intl-phone-input__lt_1akcv","lu":"intl-phone-input__lu_1akcv","lv":"intl-phone-input__lv_1akcv","ly":"intl-phone-input__ly_1akcv","ma":"intl-phone-input__ma_1akcv","mc":"intl-phone-input__mc_1akcv","md":"intl-phone-input__md_1akcv","me":"intl-phone-input__me_1akcv","mf":"intl-phone-input__mf_1akcv","mg":"intl-phone-input__mg_1akcv","mh":"intl-phone-input__mh_1akcv","mk":"intl-phone-input__mk_1akcv","ml":"intl-phone-input__ml_1akcv","mm":"intl-phone-input__mm_1akcv","mn":"intl-phone-input__mn_1akcv","mo":"intl-phone-input__mo_1akcv","mp":"intl-phone-input__mp_1akcv","mq":"intl-phone-input__mq_1akcv","mr":"intl-phone-input__mr_1akcv","ms":"intl-phone-input__ms_1akcv","mt":"intl-phone-input__mt_1akcv","mu":"intl-phone-input__mu_1akcv","mv":"intl-phone-input__mv_1akcv","mw":"intl-phone-input__mw_1akcv","mx":"intl-phone-input__mx_1akcv","my":"intl-phone-input__my_1akcv","mz":"intl-phone-input__mz_1akcv","na":"intl-phone-input__na_1akcv","nc":"intl-phone-input__nc_1akcv","ne":"intl-phone-input__ne_1akcv","nf":"intl-phone-input__nf_1akcv","ng":"intl-phone-input__ng_1akcv","ni":"intl-phone-input__ni_1akcv","nl":"intl-phone-input__nl_1akcv","no":"intl-phone-input__no_1akcv","np":"intl-phone-input__np_1akcv","nr":"intl-phone-input__nr_1akcv","nu":"intl-phone-input__nu_1akcv","nz":"intl-phone-input__nz_1akcv","om":"intl-phone-input__om_1akcv","pa":"intl-phone-input__pa_1akcv","pe":"intl-phone-input__pe_1akcv","pf":"intl-phone-input__pf_1akcv","pg":"intl-phone-input__pg_1akcv","ph":"intl-phone-input__ph_1akcv","pk":"intl-phone-input__pk_1akcv","pl":"intl-phone-input__pl_1akcv","pm":"intl-phone-input__pm_1akcv","pn":"intl-phone-input__pn_1akcv","pr":"intl-phone-input__pr_1akcv","ps":"intl-phone-input__ps_1akcv","pt":"intl-phone-input__pt_1akcv","pw":"intl-phone-input__pw_1akcv","py":"intl-phone-input__py_1akcv","qa":"intl-phone-input__qa_1akcv","re":"intl-phone-input__re_1akcv","ro":"intl-phone-input__ro_1akcv","rs":"intl-phone-input__rs_1akcv","ru":"intl-phone-input__ru_1akcv","rw":"intl-phone-input__rw_1akcv","sa":"intl-phone-input__sa_1akcv","sb":"intl-phone-input__sb_1akcv","sc":"intl-phone-input__sc_1akcv","sd":"intl-phone-input__sd_1akcv","se":"intl-phone-input__se_1akcv","sg":"intl-phone-input__sg_1akcv","sh":"intl-phone-input__sh_1akcv","si":"intl-phone-input__si_1akcv","sj":"intl-phone-input__sj_1akcv","sk":"intl-phone-input__sk_1akcv","sl":"intl-phone-input__sl_1akcv","sm":"intl-phone-input__sm_1akcv","sn":"intl-phone-input__sn_1akcv","so":"intl-phone-input__so_1akcv","sr":"intl-phone-input__sr_1akcv","ss":"intl-phone-input__ss_1akcv","st":"intl-phone-input__st_1akcv","sv":"intl-phone-input__sv_1akcv","sx":"intl-phone-input__sx_1akcv","sy":"intl-phone-input__sy_1akcv","sz":"intl-phone-input__sz_1akcv","ta":"intl-phone-input__ta_1akcv","tc":"intl-phone-input__tc_1akcv","td":"intl-phone-input__td_1akcv","tf":"intl-phone-input__tf_1akcv","tg":"intl-phone-input__tg_1akcv","th":"intl-phone-input__th_1akcv","tj":"intl-phone-input__tj_1akcv","tk":"intl-phone-input__tk_1akcv","tl":"intl-phone-input__tl_1akcv","tm":"intl-phone-input__tm_1akcv","tn":"intl-phone-input__tn_1akcv","to":"intl-phone-input__to_1akcv","tr":"intl-phone-input__tr_1akcv","tt":"intl-phone-input__tt_1akcv","tv":"intl-phone-input__tv_1akcv","tw":"intl-phone-input__tw_1akcv","tz":"intl-phone-input__tz_1akcv","ua":"intl-phone-input__ua_1akcv","ug":"intl-phone-input__ug_1akcv","um":"intl-phone-input__um_1akcv","un":"intl-phone-input__un_1akcv","us":"intl-phone-input__us_1akcv","uy":"intl-phone-input__uy_1akcv","uz":"intl-phone-input__uz_1akcv","va":"intl-phone-input__va_1akcv","vc":"intl-phone-input__vc_1akcv","ve":"intl-phone-input__ve_1akcv","vg":"intl-phone-input__vg_1akcv","vi":"intl-phone-input__vi_1akcv","vn":"intl-phone-input__vn_1akcv","vu":"intl-phone-input__vu_1akcv","wf":"intl-phone-input__wf_1akcv","ws":"intl-phone-input__ws_1akcv","xk":"intl-phone-input__xk_1akcv","ye":"intl-phone-input__ye_1akcv","yt":"intl-phone-input__yt_1akcv","za":"intl-phone-input__za_1akcv","zm":"intl-phone-input__zm_1akcv","zw":"intl-phone-input__zw_1akcv"};
 require('./index.css');
 
 /**