@alfalab/core-components 35.1.0-beta.1 → 35.2.0

package/grid/modern/row/index.js

@@ -1,5 +1,5 @@
 import 'react';
 import 'classnames';
 import '../utils/index.js';
-import '../gutters.module-1f1600b0.js';
+import '../gutters.module-e5878d55.js';
 export { Row } from './Component.js';

package/grid/row/Component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var gutters_module = require('../gutters.module-294e4459.js');
+var gutters_module = require('../gutters.module-e6afccb5.js');
 var React = require('react');
 var cn = require('classnames');
 var utils_index = require('../utils/index.js');

package/grid/row/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../gutters.module-294e4459.js');
+require('../gutters.module-e6afccb5.js');
 require('react');
 require('classnames');
 require('../utils/index.js');

package/icon-view/circle.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./tslib.es6-c39aaa80.js');
+require('./tslib.es6-b27cd098.js');
 require('react');
 require('classnames');
 require('./components/base-shape/utils.js');

package/icon-view/components/circle/component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-c39aaa80.js');
+var tslib_es6 = require('../../tslib.es6-b27cd098.js');
 var React = require('react');
 require('classnames');
 require('../base-shape/utils.js');

package/icon-view/components/circle/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../tslib.es6-c39aaa80.js');
+require('../../tslib.es6-b27cd098.js');
 require('react');
 require('classnames');
 require('../base-shape/utils.js');

package/icon-view/components/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../tslib.es6-c39aaa80.js');
+require('../tslib.es6-b27cd098.js');
 require('react');
 require('classnames');
 require('./base-shape/utils.js');

package/icon-view/components/super-ellipse/component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-c39aaa80.js');
+var tslib_es6 = require('../../tslib.es6-b27cd098.js');
 var React = require('react');
 require('classnames');
 require('../base-shape/utils.js');

package/icon-view/components/super-ellipse/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../tslib.es6-c39aaa80.js');
+require('../../tslib.es6-b27cd098.js');
 require('react');
 require('classnames');
 require('../base-shape/utils.js');

package/icon-view/esm/circle.js

@@ -1,4 +1,4 @@
-import './tslib.es6-fbe5be9e.js';
+import './tslib.es6-81512fe3.js';
 import 'react';
 import 'classnames';
 import './components/base-shape/utils.js';

package/icon-view/esm/components/circle/component.js

@@ -1,4 +1,4 @@
-import { _ as __assign } from '../../tslib.es6-fbe5be9e.js';
+import { _ as __assign } from '../../tslib.es6-81512fe3.js';
 import React, { forwardRef } from 'react';
 import 'classnames';
 import '../base-shape/utils.js';

package/icon-view/esm/components/circle/index.js

@@ -1,4 +1,4 @@
-import '../../tslib.es6-fbe5be9e.js';
+import '../../tslib.es6-81512fe3.js';
 import 'react';
 import 'classnames';
 import '../base-shape/utils.js';

package/icon-view/esm/components/index.js

@@ -1,4 +1,4 @@
-import '../tslib.es6-fbe5be9e.js';
+import '../tslib.es6-81512fe3.js';
 import 'react';
 import 'classnames';
 import './base-shape/utils.js';

package/icon-view/esm/components/super-ellipse/component.js

@@ -1,4 +1,4 @@
-import { _ as __assign } from '../../tslib.es6-fbe5be9e.js';
+import { _ as __assign } from '../../tslib.es6-81512fe3.js';
 import React, { forwardRef } from 'react';
 import 'classnames';
 import '../base-shape/utils.js';

package/icon-view/esm/components/super-ellipse/index.js

@@ -1,4 +1,4 @@
-import '../../tslib.es6-fbe5be9e.js';
+import '../../tslib.es6-81512fe3.js';
 import 'react';
 import 'classnames';
 import '../base-shape/utils.js';

package/icon-view/esm/super-ellipse.js

@@ -1,4 +1,4 @@
-import './tslib.es6-fbe5be9e.js';
+import './tslib.es6-81512fe3.js';
 import 'react';
 import 'classnames';
 import './components/base-shape/utils.js';

package/icon-view/super-ellipse.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./tslib.es6-c39aaa80.js');
+require('./tslib.es6-b27cd098.js');
 require('react');
 require('classnames');
 require('./components/base-shape/utils.js');

package/input-autocomplete/Component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-6d3444e2.js');
+var tslib_es6 = require('./tslib.es6-eeefd70a.js');
 var React = require('react');
 require('react-merge-refs');
 require('classnames');

package/input-autocomplete/Component.mobile.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-6d3444e2.js');
+var tslib_es6 = require('./tslib.es6-eeefd70a.js');
 var React = require('react');
 var mergeRefs = require('react-merge-refs');
 var cn = require('classnames');

package/input-autocomplete/autocomplete-field/Component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-6d3444e2.js');
+var tslib_es6 = require('../tslib.es6-eeefd70a.js');
 var React = require('react');
 var mergeRefs = require('react-merge-refs');
 var cn = require('classnames');

package/input-autocomplete/autocomplete-field/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../tslib.es6-6d3444e2.js');
+require('../tslib.es6-eeefd70a.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/input-autocomplete/autocomplete-mobile-field/Component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-6d3444e2.js');
+var tslib_es6 = require('../tslib.es6-eeefd70a.js');
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsFormControl = require('../../form-control');

package/input-autocomplete/autocomplete-mobile-field/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../tslib.es6-6d3444e2.js');
+require('../tslib.es6-eeefd70a.js');
 require('react');
 require('classnames');
 require('../../form-control');

package/input-autocomplete/cssm/Component.d.ts

@@ -37,7 +37,7 @@ declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<BaseSelect
     /**
      * Компонент ввода значения
      */
-    Input?: React.FC<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type" | "defaultValue" | "onChange" | "onClick" | "onMouseDown" | "value" | "enterKeyHint"> & {
+    Input?: React.FC<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "onClick" | "value" | "onMouseDown" | "defaultValue" | "onChange" | "size" | "enterKeyHint"> & {
         value?: string | undefined;
         defaultValue?: string | undefined;
         block?: boolean | undefined;
@@ -49,7 +49,7 @@ declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<BaseSelect
         hint?: React.ReactNode;
         label?: React.ReactNode;
         labelView?: "inner" | "outer" | undefined;
-        type?: "number" | "text" | "tel" | "email" | "card" | "money" | "password" | undefined;
+        type?: "number" | "text" | "tel" | "email" | "password" | "card" | "money" | undefined;
         wrapperRef?: React.Ref<HTMLDivElement> | undefined;
         leftAddons?: React.ReactNode;
         rightAddons?: React.ReactNode;
@@ -73,7 +73,7 @@ declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<BaseSelect
     /**
      * Пропсы, которые будут прокинуты в инпут
      */
-    inputProps?: (Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type" | "defaultValue" | "onChange" | "onClick" | "onMouseDown" | "value" | "enterKeyHint"> & {
+    inputProps?: (Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "onClick" | "value" | "onMouseDown" | "defaultValue" | "onChange" | "size" | "enterKeyHint"> & {
         value?: string | undefined;
         defaultValue?: string | undefined;
         block?: boolean | undefined;
@@ -85,7 +85,7 @@ declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<BaseSelect
         hint?: React.ReactNode;
         label?: React.ReactNode;
         labelView?: "inner" | "outer" | undefined;
-        type?: "number" | "text" | "tel" | "email" | "card" | "money" | "password" | undefined;
+        type?: "number" | "text" | "tel" | "email" | "password" | "card" | "money" | undefined;
         wrapperRef?: React.Ref<HTMLDivElement> | undefined;
         leftAddons?: React.ReactNode;
         rightAddons?: React.ReactNode;

package/input-autocomplete/esm/Component.js

@@ -1,4 +1,4 @@
-import { _ as __rest, a as __assign } from './tslib.es6-3fd79d53.js';
+import { _ as __rest, a as __assign } from './tslib.es6-745dbd99.js';
 import React, { forwardRef } from 'react';
 import 'react-merge-refs';
 import 'classnames';

package/input-autocomplete/esm/Component.mobile.js

@@ -1,4 +1,4 @@
-import { _ as __rest, a as __assign } from './tslib.es6-3fd79d53.js';
+import { _ as __rest, a as __assign } from './tslib.es6-745dbd99.js';
 import React, { useState, useRef, useMemo } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';

package/input-autocomplete/esm/autocomplete-field/Component.js

@@ -1,4 +1,4 @@
-import { a as __assign } from '../tslib.es6-3fd79d53.js';
+import { a as __assign } from '../tslib.es6-745dbd99.js';
 import React, { useRef, useCallback } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';

package/input-autocomplete/esm/autocomplete-field/index.js

@@ -1,4 +1,4 @@
-import '../tslib.es6-3fd79d53.js';
+import '../tslib.es6-745dbd99.js';
 import 'react';
 import 'react-merge-refs';
 import 'classnames';

package/input-autocomplete/esm/autocomplete-mobile-field/Component.js

@@ -1,4 +1,4 @@
-import { _ as __rest, a as __assign } from '../tslib.es6-3fd79d53.js';
+import { _ as __rest, a as __assign } from '../tslib.es6-745dbd99.js';
 import React, { useState, useRef } from 'react';
 import cn from 'classnames';
 import { FormControl } from '../../../form-control/esm';

package/input-autocomplete/esm/autocomplete-mobile-field/index.js

@@ -1,4 +1,4 @@
-import '../tslib.es6-3fd79d53.js';
+import '../tslib.es6-745dbd99.js';
 import 'react';
 import 'classnames';
 import '../../../form-control/esm';

package/input-autocomplete/esm/index.js

@@ -1,4 +1,4 @@
-import './tslib.es6-3fd79d53.js';
+import './tslib.es6-745dbd99.js';
 import 'react';
 import 'react-merge-refs';
 import 'classnames';

package/input-autocomplete/esm/mobile.js

@@ -1,4 +1,4 @@
-import './tslib.es6-3fd79d53.js';
+import './tslib.es6-745dbd99.js';
 import 'react';
 import 'react-merge-refs';
 import 'classnames';

package/input-autocomplete/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./tslib.es6-6d3444e2.js');
+require('./tslib.es6-eeefd70a.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/input-autocomplete/mobile.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./tslib.es6-6d3444e2.js');
+require('./tslib.es6-eeefd70a.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/intl-phone-input/component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_selectField_component = require('./component-fd3e0155.js');
+var components_selectField_component = require('./component-45364492.js');
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsInputAutocomplete = require('../input-autocomplete');
@@ -37,14 +37,15 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
     var _r = React.useState(null), inputWrapperRef = _r[0], setInputWrapperRef = _r[1];
     var _s = React.useState(), caretPos = _s[0], setCaretPos = _s[1];
     var phoneLibUtils = React.useRef();
-    var formatPhone = function (inputValue) {
+    var formatPhone = function (inputValue, iso2) {
+        if (iso2 === void 0) { iso2 = countryIso2; }
         var newValue = inputValue;
         if (phoneLibUtils.current) {
             var Utils = phoneLibUtils.current;
-            var utils = new Utils(countryIso2 ? countryIso2.toUpperCase() : undefined);
+            var utils = new Utils(iso2 ? iso2.toUpperCase() : undefined);
             newValue = utils.input(inputValue);
         }
-        if (countryIso2 === 'ru') {
+        if (iso2 === 'ru') {
             var parts = newValue.split(' ');
             newValue = parts.reduce(function (acc, part, index) {
                 if (index === 0) {
@@ -273,7 +274,7 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
         if (phoneLibUtils.current)
             return;
         Promise.resolve().then(function () { return require(
-        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-23e22bbb.js'); })
+        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-149ceb21.js'); })
             .then(function (utils) {
             phoneLibUtils.current = utils.AsYouType;
             if (canBeEmptyCountry) {
@@ -286,6 +287,23 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
             .catch(function (error) { return "An error occurred while loading libphonenumber-js:\n" + error; });
         /* eslint-disable-next-line react-hooks/exhaustive-deps */
     }, [value]);
+    React.useEffect(function () {
+        if (value && value.length > 1 && !value.includes(' ')) {
+            var newCountry = getCountryByNumber(value);
+            if (newCountry && countryIso2 !== newCountry.iso2) {
+                setCountryIso2(newCountry.iso2);
+                handleCountryChange(newCountry.iso2);
+            }
+            else if (canBeEmptyCountry &&
+                !newCountry &&
+                countryIso2 !== defaultCountryIso2.toLowerCase()) {
+                setCountryIso2(undefined);
+                handleCountryChange(undefined);
+            }
+            onChange(formatPhone(value, newCountry === null || newCountry === void 0 ? void 0 : newCountry.iso2));
+        }
+        /* eslint-disable-next-line react-hooks/exhaustive-deps */
+    }, [value, canBeEmptyCountry, countryIso2, defaultCountryIso2]);
     useCaretAvoidCountryCode.useCaretAvoidCountryCode({ inputRef: inputRef, countryCodeLength: countryCodeLength, clearableCountryCode: clearableCountryCode });
     return (React__default['default'].createElement(coreComponentsInputAutocomplete.InputAutocomplete, components_selectField_component.__assign({}, restProps, { ref: ref, inputProps: components_selectField_component.__assign(components_selectField_component.__assign({ clear: clear && !isEmptyValue, onClear: handleClear }, inputProps), { ref: inputRef, wrapperRef: setInputWrapperRef, type: 'tel', colors: colors, className: cn__default['default'](className, styles[size]), addonsClassName: styles.addons, onKeyDown: handleKeyDown, onPaste: handlePaste, leftAddons: hideCountrySelect ? (React__default['default'].createElement("span", { className: styles.flagIconWrapper }, countryIso2 ? (React__default['default'].createElement(components_flagIcon_component.FlagIcon, { country: countryIso2 })) : (React__default['default'].createElement(WorldMagnifierMIcon__default['default'], { className: styles.emptyCountryIcon })))) : (countries.length > 1 && (React__default['default'].createElement(components_select_component.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/components/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_selectField_component = require('../component-fd3e0155.js');
+var components_selectField_component = require('../component-45364492.js');
 require('react');
 require('classnames');
 require('@alfalab/icons-glyph/WorldMagnifierMIcon');

package/intl-phone-input/components/select/component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_selectField_component = require('../../component-fd3e0155.js');
+var components_selectField_component = require('../../component-45364492.js');
 var React = require('react');
 require('classnames');
 require('@alfalab/icons-glyph/WorldMagnifierMIcon');

package/intl-phone-input/components/select/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../component-fd3e0155.js');
+require('../../component-45364492.js');
 require('react');
 require('classnames');
 require('@alfalab/icons-glyph/WorldMagnifierMIcon');

package/intl-phone-input/components/select-field/component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_selectField_component = require('../../component-fd3e0155.js');
+var components_selectField_component = require('../../component-45364492.js');
 require('react');
 require('classnames');
 require('@alfalab/icons-glyph/WorldMagnifierMIcon');

package/intl-phone-input/components/select-field/index.d.ts

@@ -1 +1 @@
-export * from "../../component-fd3e0155";
+export * from "../../component-45364492";

package/intl-phone-input/components/select-field/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_selectField_component = require('../../component-fd3e0155.js');
+var components_selectField_component = require('../../component-45364492.js');
 require('react');
 require('classnames');
 require('@alfalab/icons-glyph/WorldMagnifierMIcon');

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

@@ -39,14 +39,15 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
     var _r = React.useState(null), inputWrapperRef = _r[0], setInputWrapperRef = _r[1];
     var _s = React.useState(), caretPos = _s[0], setCaretPos = _s[1];
     var phoneLibUtils = React.useRef();
-    var formatPhone = function (inputValue) {
+    var formatPhone = function (inputValue, iso2) {
+        if (iso2 === void 0) { iso2 = countryIso2; }
         var newValue = inputValue;
         if (phoneLibUtils.current) {
             var Utils = phoneLibUtils.current;
-            var utils = new Utils(countryIso2 ? countryIso2.toUpperCase() : undefined);
+            var utils = new Utils(iso2 ? iso2.toUpperCase() : undefined);
             newValue = utils.input(inputValue);
         }
-        if (countryIso2 === 'ru') {
+        if (iso2 === 'ru') {
             var parts = newValue.split(' ');
             newValue = parts.reduce(function (acc, part, index) {
                 if (index === 0) {
@@ -288,6 +289,23 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
             .catch(function (error) { return "An error occurred while loading libphonenumber-js:\n" + error; });
         /* eslint-disable-next-line react-hooks/exhaustive-deps */
     }, [value]);
+    React.useEffect(function () {
+        if (value && value.length > 1 && !value.includes(' ')) {
+            var newCountry = getCountryByNumber(value);
+            if (newCountry && countryIso2 !== newCountry.iso2) {
+                setCountryIso2(newCountry.iso2);
+                handleCountryChange(newCountry.iso2);
+            }
+            else if (canBeEmptyCountry &&
+                !newCountry &&
+                countryIso2 !== defaultCountryIso2.toLowerCase()) {
+                setCountryIso2(undefined);
+                handleCountryChange(undefined);
+            }
+            onChange(formatPhone(value, newCountry === null || newCountry === void 0 ? void 0 : newCountry.iso2));
+        }
+        /* eslint-disable-next-line react-hooks/exhaustive-deps */
+    }, [value, canBeEmptyCountry, countryIso2, defaultCountryIso2]);
     useCaretAvoidCountryCode.useCaretAvoidCountryCode({ inputRef: inputRef, countryCodeLength: countryCodeLength, clearableCountryCode: clearableCountryCode });
     return (React__default['default'].createElement(coreComponentsInputAutocomplete.InputAutocomplete, components_selectField_component.__assign({}, restProps, { ref: ref, inputProps: components_selectField_component.__assign(components_selectField_component.__assign({ clear: clear && !isEmptyValue, onClear: handleClear }, inputProps), { ref: inputRef, wrapperRef: setInputWrapperRef, type: 'tel', colors: colors, className: cn__default['default'](className, styles__default['default'][size]), addonsClassName: styles__default['default'].addons, onKeyDown: handleKeyDown, onPaste: handlePaste, leftAddons: hideCountrySelect ? (React__default['default'].createElement("span", { className: styles__default['default'].flagIconWrapper }, countryIso2 ? (React__default['default'].createElement(components_flagIcon_component.FlagIcon, { country: countryIso2 })) : (React__default['default'].createElement(WorldMagnifierMIcon__default['default'], { className: styles__default['default'].emptyCountryIcon })))) : (countries.length > 1 && (React__default['default'].createElement(components_select_component.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/esm/component.js

@@ -4,7 +4,7 @@ import WorldMagnifierMIcon from '@alfalab/icons-glyph/WorldMagnifierMIcon';
 import 'react-merge-refs';
 import '@alfalab/hooks';
 import { FlagIcon } from './components/flag-icon/component.js';
-import { _ as __rest, a as __assign } from './component-620df568.js';
+import { _ as __rest, a as __assign } from './component-122e7388.js';
 import { InputAutocomplete } from '../../input-autocomplete/esm';
 import { getCountriesHash, getCountries } from '@alfalab/utils';
 import { calculateCaretPos } from './utils/calculateCaretPos.js';
@@ -29,14 +29,15 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
     var _r = useState(null), inputWrapperRef = _r[0], setInputWrapperRef = _r[1];
     var _s = useState(), caretPos = _s[0], setCaretPos = _s[1];
     var phoneLibUtils = useRef();
-    var formatPhone = function (inputValue) {
+    var formatPhone = function (inputValue, iso2) {
+        if (iso2 === void 0) { iso2 = countryIso2; }
         var newValue = inputValue;
         if (phoneLibUtils.current) {
             var Utils = phoneLibUtils.current;
-            var utils = new Utils(countryIso2 ? countryIso2.toUpperCase() : undefined);
+            var utils = new Utils(iso2 ? iso2.toUpperCase() : undefined);
             newValue = utils.input(inputValue);
         }
-        if (countryIso2 === 'ru') {
+        if (iso2 === 'ru') {
             var parts = newValue.split(' ');
             newValue = parts.reduce(function (acc, part, index) {
                 if (index === 0) {
@@ -265,7 +266,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
         if (phoneLibUtils.current)
             return;
         import(
-        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-a86eab6e.js')
+        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-60e0fae3.js')
             .then(function (utils) {
             phoneLibUtils.current = utils.AsYouType;
             if (canBeEmptyCountry) {
@@ -278,6 +279,23 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
             .catch(function (error) { return "An error occurred while loading libphonenumber-js:\n" + error; });
         /* eslint-disable-next-line react-hooks/exhaustive-deps */
     }, [value]);
+    useEffect(function () {
+        if (value && value.length > 1 && !value.includes(' ')) {
+            var newCountry = getCountryByNumber(value);
+            if (newCountry && countryIso2 !== newCountry.iso2) {
+                setCountryIso2(newCountry.iso2);
+                handleCountryChange(newCountry.iso2);
+            }
+            else if (canBeEmptyCountry &&
+                !newCountry &&
+                countryIso2 !== defaultCountryIso2.toLowerCase()) {
+                setCountryIso2(undefined);
+                handleCountryChange(undefined);
+            }
+            onChange(formatPhone(value, newCountry === null || newCountry === void 0 ? void 0 : newCountry.iso2));
+        }
+        /* eslint-disable-next-line react-hooks/exhaustive-deps */
+    }, [value, canBeEmptyCountry, countryIso2, defaultCountryIso2]);
     useCaretAvoidCountryCode({ inputRef: inputRef, countryCodeLength: countryCodeLength, clearableCountryCode: clearableCountryCode });
     return (React.createElement(InputAutocomplete, __assign({}, restProps, { ref: ref, inputProps: __assign(__assign({ clear: clear && !isEmptyValue, onClear: handleClear }, inputProps), { ref: inputRef, wrapperRef: setInputWrapperRef, type: 'tel', colors: colors, className: cn(className, styles[size]), addonsClassName: styles.addons, onKeyDown: handleKeyDown, onPaste: handlePaste, leftAddons: hideCountrySelect ? (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 })));
 });

package/intl-phone-input/esm/components/index.js

@@ -4,6 +4,6 @@ import '@alfalab/icons-glyph/WorldMagnifierMIcon';
 import 'react-merge-refs';
 import '@alfalab/hooks';
 export { FlagIcon } from './flag-icon/component.js';
-export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../component-620df568.js';
+export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../component-122e7388.js';
 import '../../../select/esm';
 export { CountriesSelect } from './select/component.js';

package/intl-phone-input/esm/components/select/component.js

@@ -4,7 +4,7 @@ import '@alfalab/icons-glyph/WorldMagnifierMIcon';
 import 'react-merge-refs';
 import '@alfalab/hooks';
 import { FlagIcon } from '../flag-icon/component.js';
-import { a as __assign, E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-620df568.js';
+import { a as __assign, E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-122e7388.js';
 import { VirtualOptionsList, Select } from '../../../../select/esm';
 
 var styles = {"component":"intl-phone-input__component_v55xj","option":"intl-phone-input__option_v55xj","flag":"intl-phone-input__flag_v55xj","countryName":"intl-phone-input__countryName_v55xj","dialCode":"intl-phone-input__dialCode_v55xj"};

package/intl-phone-input/esm/components/select/index.js

@@ -4,6 +4,6 @@ import '@alfalab/icons-glyph/WorldMagnifierMIcon';
 import 'react-merge-refs';
 import '@alfalab/hooks';
 import '../flag-icon/component.js';
-import '../../component-620df568.js';
+import '../../component-122e7388.js';
 import '../../../../select/esm';
 export { CountriesSelect } from './component.js';

package/intl-phone-input/esm/components/select-field/component.js

@@ -4,4 +4,4 @@ import '@alfalab/icons-glyph/WorldMagnifierMIcon';
 import 'react-merge-refs';
 import '@alfalab/hooks';
 import '../flag-icon/component.js';
-export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-620df568.js';
+export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-122e7388.js';

package/intl-phone-input/esm/components/select-field/index.d.ts

@@ -1 +1 @@
-export * from "../../component-620df568";
+export * from "../../component-122e7388";

package/intl-phone-input/esm/components/select-field/index.js

@@ -4,4 +4,4 @@ import '@alfalab/icons-glyph/WorldMagnifierMIcon';
 import 'react-merge-refs';
 import '@alfalab/hooks';
 import '../flag-icon/component.js';
-export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-620df568.js';
+export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-122e7388.js';