@alfalab/core-components-intl-phone-input 9.2.1 → 9.2.2

package/{component-d11f26be.js → component-7910cc84.js}

@@ -7,6 +7,13 @@ var hooks = require('@alfalab/hooks');
 var WorldMagnifierMIcon = require('@alfalab/icons-glyph/WorldMagnifierMIcon');
 var components_flagIcon_component = require('./components/flag-icon/component.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var WorldMagnifierMIcon__default = /*#__PURE__*/_interopDefaultCompat(WorldMagnifierMIcon);
+
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
 
@@ -46,7 +53,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"component":"intl-phone-input__component_10mti","flagIconContainer":"intl-phone-input__flagIconContainer_10mti","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_10mti","disabled":"intl-phone-input__disabled_10mti","inner":"intl-phone-input__inner_10mti","l":"intl-phone-input__l_10mti","xl":"intl-phone-input__xl_10mti","focusVisible":"intl-phone-input__focusVisible_10mti"};
+var styles = {"component":"intl-phone-input__component_t4tca","flagIconContainer":"intl-phone-input__flagIconContainer_t4tca","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_t4tca","disabled":"intl-phone-input__disabled_t4tca","inner":"intl-phone-input__inner_t4tca","l":"intl-phone-input__l_t4tca","xl":"intl-phone-input__xl_t4tca","focusVisible":"intl-phone-input__focusVisible_t4tca"};
 require('./components/select-field/index.css')
 
 var EMPTY_COUNTRY_SELECT_FIELD = {
@@ -58,13 +65,13 @@ var SelectField = function (_a) {
     var selected = _a.selected, Arrow = _a.Arrow, size = _a.size, disabled = _a.disabled, _c = _a.innerProps, innerProps = _c === void 0 ? {} : _c;
     var wrapperRef = React.useRef(null);
     var focusVisible = hooks.useFocus(wrapperRef, 'keyboard')[0];
-    var ref = innerProps.ref ? mergeRefs([innerProps.ref, wrapperRef]) : wrapperRef;
-    return (React.createElement("div", { ref: ref, className: cn(styles.component, size && styles[size], (_b = {},
+    var ref = innerProps.ref ? mergeRefs__default.default([innerProps.ref, wrapperRef]) : wrapperRef;
+    return (React__default.default.createElement("div", { ref: ref, className: cn__default.default(styles.component, size && styles[size], (_b = {},
             _b[styles.focusVisible] = focusVisible,
             _b[styles.disabled] = disabled,
             _b)) },
-        React.createElement("div", exports.__assign({}, innerProps, { className: styles.inner }),
-            React.createElement("span", { className: styles.flagIconContainer }, !selected || selected === EMPTY_COUNTRY_SELECT_FIELD ? (React.createElement(WorldMagnifierMIcon, { className: styles.emptyCountryIcon })) : (React.createElement(components_flagIcon_component.FlagIcon, { country: selected.value }))),
+        React__default.default.createElement("div", exports.__assign({}, innerProps, { className: styles.inner }),
+            React__default.default.createElement("span", { className: styles.flagIconContainer }, !selected || selected === EMPTY_COUNTRY_SELECT_FIELD ? (React__default.default.createElement(WorldMagnifierMIcon__default.default, { className: styles.emptyCountryIcon })) : (React__default.default.createElement(components_flagIcon_component.FlagIcon, { country: selected.value }))),
             Arrow)));
 };
 

package/component.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_selectField_component = require('./component-d11f26be.js');
+var components_selectField_component = require('./component-7910cc84.js');
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsInputAutocomplete = require('@alfalab/core-components-input-autocomplete');
@@ -17,7 +17,13 @@ var useCaretAvoidCountryCode = require('./useCaretAvoidCountryCode.js');
 require('./components/flag-icon/flagSprite.js');
 require('@alfalab/core-components-select');
 
-var styles = {"addons":"intl-phone-input__addons_1947q","l":"intl-phone-input__l_1947q","xl":"intl-phone-input__xl_1947q","flagIconWrapper":"intl-phone-input__flagIconWrapper_1947q","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_1947q"};
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var WorldMagnifierMIcon__default = /*#__PURE__*/_interopDefaultCompat(WorldMagnifierMIcon);
+
+var styles = {"addons":"intl-phone-input__addons_oa44m","l":"intl-phone-input__l_oa44m","xl":"intl-phone-input__xl_oa44m","flagIconWrapper":"intl-phone-input__flagIconWrapper_oa44m","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_oa44m"};
 require('./index.css')
 
 var countriesHash = utils.getCountriesHash();
@@ -269,7 +275,7 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
         if (phoneLibUtils.current)
             return;
         Promise.resolve().then(function () { return require(
-        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-ebcb18c3.js'); })
+        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-7545e519.js'); })
             .then(function (utils) {
             phoneLibUtils.current = utils.AsYouType;
             if (canBeEmptyCountry) {
@@ -300,7 +306,7 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
         /* eslint-disable-next-line react-hooks/exhaustive-deps */
     }, [value, canBeEmptyCountry, countryIso2, defaultCountryIso2]);
     useCaretAvoidCountryCode.useCaretAvoidCountryCode({ inputRef: inputRef, countryCodeLength: countryCodeLength, clearableCountryCode: clearableCountryCode });
-    return (React.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(className, styles[size]), addonsClassName: styles.addons, onKeyDown: handleKeyDown, onPaste: handlePaste, leftAddons: hideCountrySelect ? (React.createElement("span", { className: styles.flagIconWrapper }, countryIso2 ? (React.createElement(components_flagIcon_component.FlagIcon, { country: countryIso2 })) : (React.createElement(WorldMagnifierMIcon, { className: styles.emptyCountryIcon })))) : (countries.length > 1 && (React.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 })));
+    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 })));
 });
 
 exports.IntlPhoneInput = IntlPhoneInput;

package/components/flag-icon/component.js

@@ -4,7 +4,12 @@ var React = require('react');
 var cn = require('classnames');
 var components_flagIcon_flagSprite = require('./flagSprite.js');
 
-var styles = {"flagIcon":"intl-phone-input__flagIcon_1yrjc","flagPlaceholder":"intl-phone-input__flagPlaceholder_1yrjc"};
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+
+var styles = {"flagIcon":"intl-phone-input__flagIcon_1wuf7","flagPlaceholder":"intl-phone-input__flagPlaceholder_1wuf7"};
 require('./index.css')
 
 /**
@@ -12,7 +17,7 @@ require('./index.css')
  */
 var FlagIcon = function (_a) {
     var _b = _a.country, country = _b === void 0 ? '' : _b, className = _a.className;
-    return components_flagIcon_flagSprite.flagSprite[country] ? (React.createElement("span", { className: cn(styles.flagIcon, className), dangerouslySetInnerHTML: { __html: components_flagIcon_flagSprite.flagSprite[country] } })) : (React.createElement("div", { className: cn(styles.flagPlaceholder, className) }));
+    return components_flagIcon_flagSprite.flagSprite[country] ? (React__default.default.createElement("span", { className: cn__default.default(styles.flagIcon, className), dangerouslySetInnerHTML: { __html: components_flagIcon_flagSprite.flagSprite[country] } })) : (React__default.default.createElement("div", { className: cn__default.default(styles.flagPlaceholder, className) }));
 };
 
 exports.FlagIcon = FlagIcon;

package/components/flag-icon/index.css

@@ -1,4 +1,4 @@
-/* hash: jhuve */
+/* hash: 25mjn */
 :root {
     --color-light-specialbg-tertiary-transparent: rgba(11, 31, 53, 0.1);
 }
@@ -16,11 +16,11 @@
 :root {
     --border-radius-xs: 2px;
 }
-.intl-phone-input__flagIcon_1yrjc {
+.intl-phone-input__flagIcon_1wuf7 {
     max-width: 24px;
     max-height: 24px;
 }
-.intl-phone-input__flagPlaceholder_1yrjc {
+.intl-phone-input__flagPlaceholder_1wuf7 {
     width: 24px;
     height: 16px;
     max-height: 16px;

package/components/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_selectField_component = require('../component-d11f26be.js');
+var components_selectField_component = require('../component-7910cc84.js');
 var components_flagIcon_component = require('./flag-icon/component.js');
 var components_select_component = require('./select/component.js');
 require('react');

package/components/select/component.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_selectField_component = require('../../component-d11f26be.js');
+var components_selectField_component = require('../../component-7910cc84.js');
 var React = require('react');
 var coreComponentsSelect = require('@alfalab/core-components-select');
 var components_flagIcon_component = require('../flag-icon/component.js');
@@ -10,7 +10,11 @@ require('@alfalab/hooks');
 require('@alfalab/icons-glyph/WorldMagnifierMIcon');
 require('../flag-icon/flagSprite.js');
 
-var styles = {"component":"intl-phone-input__component_fjoop","option":"intl-phone-input__option_fjoop","flag":"intl-phone-input__flag_fjoop","countryName":"intl-phone-input__countryName_fjoop","dialCode":"intl-phone-input__dialCode_fjoop"};
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var styles = {"component":"intl-phone-input__component_1ef99","option":"intl-phone-input__option_1ef99","flag":"intl-phone-input__flag_1ef99","countryName":"intl-phone-input__countryName_1ef99","dialCode":"intl-phone-input__dialCode_1ef99"};
 require('./index.css')
 
 var CountriesSelect = function (_a) {
@@ -21,20 +25,20 @@ var CountriesSelect = function (_a) {
             return ({
                 key: iso2,
                 value: iso2,
-                content: (React.createElement("span", { className: styles.option },
-                    React.createElement(components_flagIcon_component.FlagIcon, { country: iso2, className: styles.flag }),
-                    React.createElement("span", { className: styles.optionTextWrap },
-                        React.createElement("span", { className: styles.countryName }, name),
-                        React.createElement("span", { className: styles.dialCode },
+                content: (React__default.default.createElement("span", { className: styles.option },
+                    React__default.default.createElement(components_flagIcon_component.FlagIcon, { country: iso2, className: styles.flag }),
+                    React__default.default.createElement("span", { className: styles.optionTextWrap },
+                        React__default.default.createElement("span", { className: styles.countryName }, name),
+                        React__default.default.createElement("span", { className: styles.dialCode },
                             "+",
                             dialCode)))),
             });
         });
     }, [countries]);
-    var renderOptionsList = React.useCallback(function (props) { return (React.createElement("div", { style: { width: fieldWidth || 0 } },
-        React.createElement(coreComponentsSelect.VirtualOptionsList, components_selectField_component.__assign({}, props)))); }, [fieldWidth]);
-    return (React.createElement("div", { className: styles.component, onClick: function (event) { return event.stopPropagation(); } },
-        React.createElement(coreComponentsSelect.Select, { dataTestId: dataTestId, disabled: disabled, size: size, options: options, selected: selected || components_selectField_component.EMPTY_COUNTRY_SELECT_FIELD, onChange: onChange, Field: components_selectField_component.SelectField, OptionsList: renderOptionsList, preventFlip: preventFlip })));
+    var renderOptionsList = React.useCallback(function (props) { return (React__default.default.createElement("div", { style: { width: fieldWidth || 0 } },
+        React__default.default.createElement(coreComponentsSelect.VirtualOptionsList, components_selectField_component.__assign({}, props)))); }, [fieldWidth]);
+    return (React__default.default.createElement("div", { className: styles.component, onClick: function (event) { return event.stopPropagation(); } },
+        React__default.default.createElement(coreComponentsSelect.Select, { dataTestId: dataTestId, disabled: disabled, size: size, options: options, selected: selected || components_selectField_component.EMPTY_COUNTRY_SELECT_FIELD, onChange: onChange, Field: components_selectField_component.SelectField, OptionsList: renderOptionsList, preventFlip: preventFlip })));
 };
 
 exports.CountriesSelect = CountriesSelect;

package/components/select/index.css

@@ -1,4 +1,4 @@
-/* hash: y6xme */
+/* hash: 1tuv8 */
 :root {
     --color-light-text-secondary: rgba(11, 31, 53, 0.7);
 }
@@ -16,23 +16,23 @@
 :root {
     --text-secondary-color: var(--color-light-text-secondary);
 }
-.intl-phone-input__component_fjoop {
+.intl-phone-input__component_1ef99 {
     position: static;
     display: flex;
     min-width: initial;
     height: 100%;
 }
-.intl-phone-input__option_fjoop {
+.intl-phone-input__option_1ef99 {
     display: flex;
     align-items: flex-start;
 }
-.intl-phone-input__flag_fjoop {
+.intl-phone-input__flag_1ef99 {
     flex-shrink: 0;
     margin-right: var(--gap-xs);
 }
-.intl-phone-input__countryName_fjoop {
+.intl-phone-input__countryName_1ef99 {
     margin-right: var(--gap-xs);
 }
-.intl-phone-input__dialCode_fjoop {
+.intl-phone-input__dialCode_1ef99 {
     color: var(--text-secondary-color);
 }

package/components/select/index.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var components_select_component = require('./component.js');
-require('../../component-d11f26be.js');
+require('../../component-7910cc84.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/components/select-field/component.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_selectField_component = require('../../component-d11f26be.js');
+var components_selectField_component = require('../../component-7910cc84.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/components/select-field/index.css

@@ -1,4 +1,4 @@
-/* hash: xob7f */
+/* hash: jiroi */
 :root {
     --color-light-border-link: #007aff;
     --color-light-graphic-secondary: #6d7986;
@@ -20,13 +20,13 @@
     --focus-color: var(--color-light-border-link);
     --disabled-cursor: not-allowed;
 }
-.intl-phone-input__component_10mti {
+.intl-phone-input__component_t4tca {
     height: 100%;
     cursor: pointer;
     outline: none;
     position: relative;
 }
-.intl-phone-input__flagIconContainer_10mti {
+.intl-phone-input__flagIconContainer_t4tca {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -34,13 +34,13 @@
     height: 24px;
     margin-right: var(--gap-2xs);
 }
-.intl-phone-input__emptyCountryIcon_10mti {
+.intl-phone-input__emptyCountryIcon_t4tca {
     color: var(--color-light-graphic-secondary);
 }
-.intl-phone-input__disabled_10mti {
+.intl-phone-input__disabled_t4tca {
     cursor: var(--disabled-cursor);
 }
-.intl-phone-input__inner_10mti {
+.intl-phone-input__inner_t4tca {
     position: relative;
     display: flex;
     align-items: center;
@@ -48,11 +48,11 @@
     padding-left: var(--gap-s);
     outline: none;
 }
-.intl-phone-input__l_10mti .intl-phone-input__inner_10mti,
-.intl-phone-input__xl_10mti .intl-phone-input__inner_10mti {
+.intl-phone-input__l_t4tca .intl-phone-input__inner_t4tca,
+.intl-phone-input__xl_t4tca .intl-phone-input__inner_t4tca {
     padding-left: var(--gap-m);
 }
-.intl-phone-input__focusVisible_10mti {
+.intl-phone-input__focusVisible_t4tca {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }

package/components/select-field/index.d.ts

@@ -1 +1 @@
-export * from "../../component-d11f26be";
+export * from "../../component-7910cc84";

package/components/select-field/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_selectField_component = require('../../component-d11f26be.js');
+var components_selectField_component = require('../../component-7910cc84.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/cssm/{component-555bdbef.js → component-01884de0.js}

@@ -8,6 +8,14 @@ var WorldMagnifierMIcon = require('@alfalab/icons-glyph/WorldMagnifierMIcon');
 var components_flagIcon_component = require('./components/flag-icon/component.js');
 var styles = require('./components/select-field/index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var WorldMagnifierMIcon__default = /*#__PURE__*/_interopDefaultCompat(WorldMagnifierMIcon);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
 
@@ -56,13 +64,13 @@ var SelectField = function (_a) {
     var selected = _a.selected, Arrow = _a.Arrow, size = _a.size, disabled = _a.disabled, _c = _a.innerProps, innerProps = _c === void 0 ? {} : _c;
     var wrapperRef = React.useRef(null);
     var focusVisible = hooks.useFocus(wrapperRef, 'keyboard')[0];
-    var ref = innerProps.ref ? mergeRefs([innerProps.ref, wrapperRef]) : wrapperRef;
-    return (React.createElement("div", { ref: ref, className: cn(styles.component, size && styles[size], (_b = {},
-            _b[styles.focusVisible] = focusVisible,
-            _b[styles.disabled] = disabled,
+    var ref = innerProps.ref ? mergeRefs__default.default([innerProps.ref, wrapperRef]) : wrapperRef;
+    return (React__default.default.createElement("div", { ref: ref, className: cn__default.default(styles__default.default.component, size && styles__default.default[size], (_b = {},
+            _b[styles__default.default.focusVisible] = focusVisible,
+            _b[styles__default.default.disabled] = disabled,
             _b)) },
-        React.createElement("div", exports.__assign({}, innerProps, { className: styles.inner }),
-            React.createElement("span", { className: styles.flagIconContainer }, !selected || selected === EMPTY_COUNTRY_SELECT_FIELD ? (React.createElement(WorldMagnifierMIcon, { className: styles.emptyCountryIcon })) : (React.createElement(components_flagIcon_component.FlagIcon, { country: selected.value }))),
+        React__default.default.createElement("div", exports.__assign({}, innerProps, { className: styles__default.default.inner }),
+            React__default.default.createElement("span", { className: styles__default.default.flagIconContainer }, !selected || selected === EMPTY_COUNTRY_SELECT_FIELD ? (React__default.default.createElement(WorldMagnifierMIcon__default.default, { className: styles__default.default.emptyCountryIcon })) : (React__default.default.createElement(components_flagIcon_component.FlagIcon, { country: selected.value }))),
             Arrow)));
 };
 

package/cssm/component.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_selectField_component = require('./component-555bdbef.js');
+var components_selectField_component = require('./component-01884de0.js');
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsInputAutocomplete = require('@alfalab/core-components-input-autocomplete/cssm');
@@ -21,6 +21,13 @@ require('./components/flag-icon/index.module.css');
 require('@alfalab/core-components-select/cssm');
 require('./components/select/index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var WorldMagnifierMIcon__default = /*#__PURE__*/_interopDefaultCompat(WorldMagnifierMIcon);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var countriesHash = utils.getCountriesHash();
 var MAX_DIAL_CODE_LENGTH = 4;
 var MASK_SYMBOLS = [' ', '-', '(', ')'];
@@ -301,7 +308,7 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
         /* eslint-disable-next-line react-hooks/exhaustive-deps */
     }, [value, canBeEmptyCountry, countryIso2, defaultCountryIso2]);
     useCaretAvoidCountryCode.useCaretAvoidCountryCode({ inputRef: inputRef, countryCodeLength: countryCodeLength, clearableCountryCode: clearableCountryCode });
-    return (React.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(className, styles[size]), addonsClassName: styles.addons, onKeyDown: handleKeyDown, onPaste: handlePaste, leftAddons: hideCountrySelect ? (React.createElement("span", { className: styles.flagIconWrapper }, countryIso2 ? (React.createElement(components_flagIcon_component.FlagIcon, { country: countryIso2 })) : (React.createElement(WorldMagnifierMIcon, { className: styles.emptyCountryIcon })))) : (countries.length > 1 && (React.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 })));
+    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 })));
 });
 
 exports.IntlPhoneInput = IntlPhoneInput;

package/cssm/components/flag-icon/component.js

@@ -5,12 +5,18 @@ var cn = require('classnames');
 var components_flagIcon_flagSprite = require('./flagSprite.js');
 var styles = require('./index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 /**
  * Компонент флага в виде иконки.
  */
 var FlagIcon = function (_a) {
     var _b = _a.country, country = _b === void 0 ? '' : _b, className = _a.className;
-    return components_flagIcon_flagSprite.flagSprite[country] ? (React.createElement("span", { className: cn(styles.flagIcon, className), dangerouslySetInnerHTML: { __html: components_flagIcon_flagSprite.flagSprite[country] } })) : (React.createElement("div", { className: cn(styles.flagPlaceholder, className) }));
+    return components_flagIcon_flagSprite.flagSprite[country] ? (React__default.default.createElement("span", { className: cn__default.default(styles__default.default.flagIcon, className), dangerouslySetInnerHTML: { __html: components_flagIcon_flagSprite.flagSprite[country] } })) : (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.flagPlaceholder, className) }));
 };
 
 exports.FlagIcon = FlagIcon;

package/cssm/components/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_selectField_component = require('../component-555bdbef.js');
+var components_selectField_component = require('../component-01884de0.js');
 var components_flagIcon_component = require('./flag-icon/component.js');
 var components_select_component = require('./select/component.js');
 require('react');

package/cssm/components/select/component.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_selectField_component = require('../../component-555bdbef.js');
+var components_selectField_component = require('../../component-01884de0.js');
 var React = require('react');
 var coreComponentsSelect = require('@alfalab/core-components-select/cssm');
 var components_flagIcon_component = require('../flag-icon/component.js');
@@ -13,6 +13,11 @@ require('../select-field/index.module.css');
 require('../flag-icon/flagSprite.js');
 require('../flag-icon/index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var CountriesSelect = function (_a) {
     var disabled = _a.disabled, size = _a.size, selected = _a.selected, countries = _a.countries, fieldWidth = _a.fieldWidth, preventFlip = _a.preventFlip, onChange = _a.onChange, dataTestId = _a.dataTestId;
     var options = React.useMemo(function () {
@@ -21,20 +26,20 @@ var CountriesSelect = function (_a) {
             return ({
                 key: iso2,
                 value: iso2,
-                content: (React.createElement("span", { className: styles.option },
-                    React.createElement(components_flagIcon_component.FlagIcon, { country: iso2, className: styles.flag }),
-                    React.createElement("span", { className: styles.optionTextWrap },
-                        React.createElement("span", { className: styles.countryName }, name),
-                        React.createElement("span", { className: styles.dialCode },
+                content: (React__default.default.createElement("span", { className: styles__default.default.option },
+                    React__default.default.createElement(components_flagIcon_component.FlagIcon, { country: iso2, className: styles__default.default.flag }),
+                    React__default.default.createElement("span", { className: styles__default.default.optionTextWrap },
+                        React__default.default.createElement("span", { className: styles__default.default.countryName }, name),
+                        React__default.default.createElement("span", { className: styles__default.default.dialCode },
                             "+",
                             dialCode)))),
             });
         });
     }, [countries]);
-    var renderOptionsList = React.useCallback(function (props) { return (React.createElement("div", { style: { width: fieldWidth || 0 } },
-        React.createElement(coreComponentsSelect.VirtualOptionsList, components_selectField_component.__assign({}, props)))); }, [fieldWidth]);
-    return (React.createElement("div", { className: styles.component, onClick: function (event) { return event.stopPropagation(); } },
-        React.createElement(coreComponentsSelect.Select, { dataTestId: dataTestId, disabled: disabled, size: size, options: options, selected: selected || components_selectField_component.EMPTY_COUNTRY_SELECT_FIELD, onChange: onChange, Field: components_selectField_component.SelectField, OptionsList: renderOptionsList, preventFlip: preventFlip })));
+    var renderOptionsList = React.useCallback(function (props) { return (React__default.default.createElement("div", { style: { width: fieldWidth || 0 } },
+        React__default.default.createElement(coreComponentsSelect.VirtualOptionsList, components_selectField_component.__assign({}, props)))); }, [fieldWidth]);
+    return (React__default.default.createElement("div", { className: styles__default.default.component, onClick: function (event) { return event.stopPropagation(); } },
+        React__default.default.createElement(coreComponentsSelect.Select, { dataTestId: dataTestId, disabled: disabled, size: size, options: options, selected: selected || components_selectField_component.EMPTY_COUNTRY_SELECT_FIELD, onChange: onChange, Field: components_selectField_component.SelectField, OptionsList: renderOptionsList, preventFlip: preventFlip })));
 };
 
 exports.CountriesSelect = CountriesSelect;

package/cssm/components/select/index.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var components_select_component = require('./component.js');
-require('../../component-555bdbef.js');
+require('../../component-01884de0.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/cssm/components/select-field/component.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_selectField_component = require('../../component-555bdbef.js');
+var components_selectField_component = require('../../component-01884de0.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/cssm/components/select-field/index.d.ts

@@ -1 +1 @@
-export * from "../../component-555bdbef";
+export * from "../../component-01884de0";

package/cssm/components/select-field/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_selectField_component = require('../../component-555bdbef.js');
+var components_selectField_component = require('../../component-01884de0.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/cssm/index.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var component = require('./component.js');
-require('./component-555bdbef.js');
+require('./component-01884de0.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/esm/{component-f7046474.js → component-432b3fc0.js}

@@ -44,7 +44,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"component":"intl-phone-input__component_10mti","flagIconContainer":"intl-phone-input__flagIconContainer_10mti","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_10mti","disabled":"intl-phone-input__disabled_10mti","inner":"intl-phone-input__inner_10mti","l":"intl-phone-input__l_10mti","xl":"intl-phone-input__xl_10mti","focusVisible":"intl-phone-input__focusVisible_10mti"};
+var styles = {"component":"intl-phone-input__component_t4tca","flagIconContainer":"intl-phone-input__flagIconContainer_t4tca","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_t4tca","disabled":"intl-phone-input__disabled_t4tca","inner":"intl-phone-input__inner_t4tca","l":"intl-phone-input__l_t4tca","xl":"intl-phone-input__xl_t4tca","focusVisible":"intl-phone-input__focusVisible_t4tca"};
 require('./components/select-field/index.css')
 
 var EMPTY_COUNTRY_SELECT_FIELD = {

package/esm/component.js

@@ -1,4 +1,4 @@
-import { _ as __rest, a as __assign } from './component-f7046474.js';
+import { _ as __rest, a as __assign } from './component-432b3fc0.js';
 import React, { forwardRef, useState, useRef, useEffect } from 'react';
 import cn from 'classnames';
 import { InputAutocomplete } from '@alfalab/core-components-input-autocomplete/esm';
@@ -15,7 +15,7 @@ import { useCaretAvoidCountryCode } from './useCaretAvoidCountryCode.js';
 import './components/flag-icon/flagSprite.js';
 import '@alfalab/core-components-select/esm';
 
-var styles = {"addons":"intl-phone-input__addons_1947q","l":"intl-phone-input__l_1947q","xl":"intl-phone-input__xl_1947q","flagIconWrapper":"intl-phone-input__flagIconWrapper_1947q","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_1947q"};
+var styles = {"addons":"intl-phone-input__addons_oa44m","l":"intl-phone-input__l_oa44m","xl":"intl-phone-input__xl_oa44m","flagIconWrapper":"intl-phone-input__flagIconWrapper_oa44m","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_oa44m"};
 require('./index.css')
 
 var countriesHash = getCountriesHash();
@@ -267,7 +267,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
         if (phoneLibUtils.current)
             return;
         import(
-        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-2001ae08.js')
+        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-90652dfc.js')
             .then(function (utils) {
             phoneLibUtils.current = utils.AsYouType;
             if (canBeEmptyCountry) {

package/esm/components/flag-icon/component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { flagSprite } from './flagSprite.js';
 
-var styles = {"flagIcon":"intl-phone-input__flagIcon_1yrjc","flagPlaceholder":"intl-phone-input__flagPlaceholder_1yrjc"};
+var styles = {"flagIcon":"intl-phone-input__flagIcon_1wuf7","flagPlaceholder":"intl-phone-input__flagPlaceholder_1wuf7"};
 require('./index.css')
 
 /**

package/esm/components/flag-icon/index.css

@@ -1,4 +1,4 @@
-/* hash: jhuve */
+/* hash: 25mjn */
 :root {
     --color-light-specialbg-tertiary-transparent: rgba(11, 31, 53, 0.1);
 }
@@ -16,11 +16,11 @@
 :root {
     --border-radius-xs: 2px;
 }
-.intl-phone-input__flagIcon_1yrjc {
+.intl-phone-input__flagIcon_1wuf7 {
     max-width: 24px;
     max-height: 24px;
 }
-.intl-phone-input__flagPlaceholder_1yrjc {
+.intl-phone-input__flagPlaceholder_1wuf7 {
     width: 24px;
     height: 16px;
     max-height: 16px;

package/esm/components/index.js

@@ -1,4 +1,4 @@
-export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../component-f7046474.js';
+export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../component-432b3fc0.js';
 export { FlagIcon } from './flag-icon/component.js';
 export { CountriesSelect } from './select/component.js';
 import 'react';

package/esm/components/select/component.js

@@ -1,4 +1,4 @@
-import { a as __assign, E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-f7046474.js';
+import { a as __assign, E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-432b3fc0.js';
 import React, { useMemo, useCallback } from 'react';
 import { VirtualOptionsList, Select } from '@alfalab/core-components-select/esm';
 import { FlagIcon } from '../flag-icon/component.js';
@@ -8,7 +8,7 @@ import '@alfalab/hooks';
 import '@alfalab/icons-glyph/WorldMagnifierMIcon';
 import '../flag-icon/flagSprite.js';
 
-var styles = {"component":"intl-phone-input__component_fjoop","option":"intl-phone-input__option_fjoop","flag":"intl-phone-input__flag_fjoop","countryName":"intl-phone-input__countryName_fjoop","dialCode":"intl-phone-input__dialCode_fjoop"};
+var styles = {"component":"intl-phone-input__component_1ef99","option":"intl-phone-input__option_1ef99","flag":"intl-phone-input__flag_1ef99","countryName":"intl-phone-input__countryName_1ef99","dialCode":"intl-phone-input__dialCode_1ef99"};
 require('./index.css')
 
 var CountriesSelect = function (_a) {

package/esm/components/select/index.css

@@ -1,4 +1,4 @@
-/* hash: y6xme */
+/* hash: 1tuv8 */
 :root {
     --color-light-text-secondary: rgba(11, 31, 53, 0.7);
 }
@@ -16,23 +16,23 @@
 :root {
     --text-secondary-color: var(--color-light-text-secondary);
 }
-.intl-phone-input__component_fjoop {
+.intl-phone-input__component_1ef99 {
     position: static;
     display: flex;
     min-width: initial;
     height: 100%;
 }
-.intl-phone-input__option_fjoop {
+.intl-phone-input__option_1ef99 {
     display: flex;
     align-items: flex-start;
 }
-.intl-phone-input__flag_fjoop {
+.intl-phone-input__flag_1ef99 {
     flex-shrink: 0;
     margin-right: var(--gap-xs);
 }
-.intl-phone-input__countryName_fjoop {
+.intl-phone-input__countryName_1ef99 {
     margin-right: var(--gap-xs);
 }
-.intl-phone-input__dialCode_fjoop {
+.intl-phone-input__dialCode_1ef99 {
     color: var(--text-secondary-color);
 }

package/esm/components/select/index.js

@@ -1,5 +1,5 @@
 export { CountriesSelect } from './component.js';
-import '../../component-f7046474.js';
+import '../../component-432b3fc0.js';
 import 'react';
 import 'react-merge-refs';
 import 'classnames';

package/esm/components/select-field/component.js

@@ -1,4 +1,4 @@
-export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-f7046474.js';
+export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-432b3fc0.js';
 import 'react';
 import 'react-merge-refs';
 import 'classnames';

package/esm/components/select-field/index.css

@@ -1,4 +1,4 @@
-/* hash: xob7f */
+/* hash: jiroi */
 :root {
     --color-light-border-link: #007aff;
     --color-light-graphic-secondary: #6d7986;
@@ -20,13 +20,13 @@
     --focus-color: var(--color-light-border-link);
     --disabled-cursor: not-allowed;
 }
-.intl-phone-input__component_10mti {
+.intl-phone-input__component_t4tca {
     height: 100%;
     cursor: pointer;
     outline: none;
     position: relative;
 }
-.intl-phone-input__flagIconContainer_10mti {
+.intl-phone-input__flagIconContainer_t4tca {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -34,13 +34,13 @@
     height: 24px;
     margin-right: var(--gap-2xs);
 }
-.intl-phone-input__emptyCountryIcon_10mti {
+.intl-phone-input__emptyCountryIcon_t4tca {
     color: var(--color-light-graphic-secondary);
 }
-.intl-phone-input__disabled_10mti {
+.intl-phone-input__disabled_t4tca {
     cursor: var(--disabled-cursor);
 }
-.intl-phone-input__inner_10mti {
+.intl-phone-input__inner_t4tca {
     position: relative;
     display: flex;
     align-items: center;
@@ -48,11 +48,11 @@
     padding-left: var(--gap-s);
     outline: none;
 }
-.intl-phone-input__l_10mti .intl-phone-input__inner_10mti,
-.intl-phone-input__xl_10mti .intl-phone-input__inner_10mti {
+.intl-phone-input__l_t4tca .intl-phone-input__inner_t4tca,
+.intl-phone-input__xl_t4tca .intl-phone-input__inner_t4tca {
     padding-left: var(--gap-m);
 }
-.intl-phone-input__focusVisible_10mti {
+.intl-phone-input__focusVisible_t4tca {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }

package/esm/components/select-field/index.d.ts

@@ -1 +1 @@
-export * from "../../component-f7046474";
+export * from "../../component-432b3fc0";

package/esm/components/select-field/index.js

@@ -1,4 +1,4 @@
-export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-f7046474.js';
+export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-432b3fc0.js';
 import 'react';
 import 'react-merge-refs';
 import 'classnames';

package/esm/index.css

@@ -1,4 +1,4 @@
-/* hash: zzvdr */
+/* hash: inn20 */
 :root {
     --color-light-graphic-secondary: #6d7986;
 }
@@ -13,13 +13,13 @@
 :root {
     --gap-s: 12px;
 }
-.intl-phone-input__addons_1947q {
+.intl-phone-input__addons_oa44m {
     padding-left: 0;
 }
-.intl-phone-input__l_1947q .intl-phone-input__addons_1947q, .intl-phone-input__xl_1947q .intl-phone-input__addons_1947q {
+.intl-phone-input__l_oa44m .intl-phone-input__addons_oa44m, .intl-phone-input__xl_oa44m .intl-phone-input__addons_oa44m {
         padding-left: 0;
     }
-.intl-phone-input__flagIconWrapper_1947q {
+.intl-phone-input__flagIconWrapper_oa44m {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -27,6 +27,6 @@
     height: 24px;
     margin-left: var(--gap-s);
 }
-.intl-phone-input__emptyCountryIcon_1947q {
+.intl-phone-input__emptyCountryIcon_oa44m {
     color: var(--color-light-graphic-secondary);
 }

package/esm/index.js

@@ -1,5 +1,5 @@
 export { IntlPhoneInput } from './component.js';
-import './component-f7046474.js';
+import './component-432b3fc0.js';
 import 'react';
 import 'react-merge-refs';
 import 'classnames';

package/index.css

@@ -1,4 +1,4 @@
-/* hash: zzvdr */
+/* hash: inn20 */
 :root {
     --color-light-graphic-secondary: #6d7986;
 }
@@ -13,13 +13,13 @@
 :root {
     --gap-s: 12px;
 }
-.intl-phone-input__addons_1947q {
+.intl-phone-input__addons_oa44m {
     padding-left: 0;
 }
-.intl-phone-input__l_1947q .intl-phone-input__addons_1947q, .intl-phone-input__xl_1947q .intl-phone-input__addons_1947q {
+.intl-phone-input__l_oa44m .intl-phone-input__addons_oa44m, .intl-phone-input__xl_oa44m .intl-phone-input__addons_oa44m {
         padding-left: 0;
     }
-.intl-phone-input__flagIconWrapper_1947q {
+.intl-phone-input__flagIconWrapper_oa44m {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -27,6 +27,6 @@
     height: 24px;
     margin-left: var(--gap-s);
 }
-.intl-phone-input__emptyCountryIcon_1947q {
+.intl-phone-input__emptyCountryIcon_oa44m {
     color: var(--color-light-graphic-secondary);
 }

package/index.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var component = require('./component.js');
-require('./component-d11f26be.js');
+require('./component-7910cc84.js');
 require('react');
 require('react-merge-refs');
 require('classnames');

package/modern/component.js

@@ -15,7 +15,7 @@ import './components/flag-icon/flagSprite.js';
 import '@alfalab/core-components-select/modern';
 import './components/select-field/component.js';
 
-const styles = {"addons":"intl-phone-input__addons_1947q","l":"intl-phone-input__l_1947q","xl":"intl-phone-input__xl_1947q","flagIconWrapper":"intl-phone-input__flagIconWrapper_1947q","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_1947q"};
+const styles = {"addons":"intl-phone-input__addons_oa44m","l":"intl-phone-input__l_oa44m","xl":"intl-phone-input__xl_oa44m","flagIconWrapper":"intl-phone-input__flagIconWrapper_oa44m","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_oa44m"};
 require('./index.css')
 
 const countriesHash = getCountriesHash();
@@ -263,7 +263,7 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, hideCou
         if (phoneLibUtils.current)
             return;
         import(
-        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-2001ae08.js')
+        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-90652dfc.js')
             .then((utils) => {
             phoneLibUtils.current = utils.AsYouType;
             if (canBeEmptyCountry) {

package/modern/components/flag-icon/component.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { flagSprite } from './flagSprite.js';
 
-const styles = {"flagIcon":"intl-phone-input__flagIcon_1yrjc","flagPlaceholder":"intl-phone-input__flagPlaceholder_1yrjc"};
+const styles = {"flagIcon":"intl-phone-input__flagIcon_1wuf7","flagPlaceholder":"intl-phone-input__flagPlaceholder_1wuf7"};
 require('./index.css')
 
 /**

package/modern/components/flag-icon/index.css

@@ -1,4 +1,4 @@
-/* hash: jhuve */
+/* hash: 25mjn */
 :root {
     --color-light-specialbg-tertiary-transparent: rgba(11, 31, 53, 0.1);
 }
@@ -16,11 +16,11 @@
 :root {
     --border-radius-xs: 2px;
 }
-.intl-phone-input__flagIcon_1yrjc {
+.intl-phone-input__flagIcon_1wuf7 {
     max-width: 24px;
     max-height: 24px;
 }
-.intl-phone-input__flagPlaceholder_1yrjc {
+.intl-phone-input__flagPlaceholder_1wuf7 {
     width: 24px;
     height: 16px;
     max-height: 16px;

package/modern/components/select/component.js

@@ -8,7 +8,7 @@ import 'react-merge-refs';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/WorldMagnifierMIcon';
 
-const styles = {"component":"intl-phone-input__component_fjoop","option":"intl-phone-input__option_fjoop","flag":"intl-phone-input__flag_fjoop","countryName":"intl-phone-input__countryName_fjoop","dialCode":"intl-phone-input__dialCode_fjoop"};
+const styles = {"component":"intl-phone-input__component_1ef99","option":"intl-phone-input__option_1ef99","flag":"intl-phone-input__flag_1ef99","countryName":"intl-phone-input__countryName_1ef99","dialCode":"intl-phone-input__dialCode_1ef99"};
 require('./index.css')
 
 /* eslint-disable jsx-a11y/no-static-element-interactions */

package/modern/components/select/index.css

@@ -1,4 +1,4 @@
-/* hash: y6xme */
+/* hash: 1tuv8 */
 :root {
     --color-light-text-secondary: rgba(11, 31, 53, 0.7);
 }
@@ -16,23 +16,23 @@
 :root {
     --text-secondary-color: var(--color-light-text-secondary);
 }
-.intl-phone-input__component_fjoop {
+.intl-phone-input__component_1ef99 {
     position: static;
     display: flex;
     min-width: initial;
     height: 100%;
 }
-.intl-phone-input__option_fjoop {
+.intl-phone-input__option_1ef99 {
     display: flex;
     align-items: flex-start;
 }
-.intl-phone-input__flag_fjoop {
+.intl-phone-input__flag_1ef99 {
     flex-shrink: 0;
     margin-right: var(--gap-xs);
 }
-.intl-phone-input__countryName_fjoop {
+.intl-phone-input__countryName_1ef99 {
     margin-right: var(--gap-xs);
 }
-.intl-phone-input__dialCode_fjoop {
+.intl-phone-input__dialCode_1ef99 {
     color: var(--text-secondary-color);
 }

package/modern/components/select-field/component.js

@@ -6,7 +6,7 @@ import WorldMagnifierMIcon from '@alfalab/icons-glyph/WorldMagnifierMIcon';
 import { FlagIcon } from '../flag-icon/component.js';
 import '../flag-icon/flagSprite.js';
 
-const styles = {"component":"intl-phone-input__component_10mti","flagIconContainer":"intl-phone-input__flagIconContainer_10mti","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_10mti","disabled":"intl-phone-input__disabled_10mti","inner":"intl-phone-input__inner_10mti","l":"intl-phone-input__l_10mti","xl":"intl-phone-input__xl_10mti","focusVisible":"intl-phone-input__focusVisible_10mti"};
+const styles = {"component":"intl-phone-input__component_t4tca","flagIconContainer":"intl-phone-input__flagIconContainer_t4tca","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_t4tca","disabled":"intl-phone-input__disabled_t4tca","inner":"intl-phone-input__inner_t4tca","l":"intl-phone-input__l_t4tca","xl":"intl-phone-input__xl_t4tca","focusVisible":"intl-phone-input__focusVisible_t4tca"};
 require('./index.css')
 
 const EMPTY_COUNTRY_SELECT_FIELD = {

package/modern/components/select-field/index.css

@@ -1,4 +1,4 @@
-/* hash: xob7f */
+/* hash: jiroi */
 :root {
     --color-light-border-link: #007aff;
     --color-light-graphic-secondary: #6d7986;
@@ -20,13 +20,13 @@
     --focus-color: var(--color-light-border-link);
     --disabled-cursor: not-allowed;
 }
-.intl-phone-input__component_10mti {
+.intl-phone-input__component_t4tca {
     height: 100%;
     cursor: pointer;
     outline: none;
     position: relative;
 }
-.intl-phone-input__flagIconContainer_10mti {
+.intl-phone-input__flagIconContainer_t4tca {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -34,13 +34,13 @@
     height: 24px;
     margin-right: var(--gap-2xs);
 }
-.intl-phone-input__emptyCountryIcon_10mti {
+.intl-phone-input__emptyCountryIcon_t4tca {
     color: var(--color-light-graphic-secondary);
 }
-.intl-phone-input__disabled_10mti {
+.intl-phone-input__disabled_t4tca {
     cursor: var(--disabled-cursor);
 }
-.intl-phone-input__inner_10mti {
+.intl-phone-input__inner_t4tca {
     position: relative;
     display: flex;
     align-items: center;
@@ -48,11 +48,11 @@
     padding-left: var(--gap-s);
     outline: none;
 }
-.intl-phone-input__l_10mti .intl-phone-input__inner_10mti,
-.intl-phone-input__xl_10mti .intl-phone-input__inner_10mti {
+.intl-phone-input__l_t4tca .intl-phone-input__inner_t4tca,
+.intl-phone-input__xl_t4tca .intl-phone-input__inner_t4tca {
     padding-left: var(--gap-m);
 }
-.intl-phone-input__focusVisible_10mti {
+.intl-phone-input__focusVisible_t4tca {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }

package/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: zzvdr */
+/* hash: inn20 */
 :root {
     --color-light-graphic-secondary: #6d7986;
 }
@@ -13,13 +13,13 @@
 :root {
     --gap-s: 12px;
 }
-.intl-phone-input__addons_1947q {
+.intl-phone-input__addons_oa44m {
     padding-left: 0;
 }
-.intl-phone-input__l_1947q .intl-phone-input__addons_1947q, .intl-phone-input__xl_1947q .intl-phone-input__addons_1947q {
+.intl-phone-input__l_oa44m .intl-phone-input__addons_oa44m, .intl-phone-input__xl_oa44m .intl-phone-input__addons_oa44m {
         padding-left: 0;
     }
-.intl-phone-input__flagIconWrapper_1947q {
+.intl-phone-input__flagIconWrapper_oa44m {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -27,6 +27,6 @@
     height: 24px;
     margin-left: var(--gap-s);
 }
-.intl-phone-input__emptyCountryIcon_1947q {
+.intl-phone-input__emptyCountryIcon_oa44m {
     color: var(--color-light-graphic-secondary);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-intl-phone-input",
-    "version": "9.2.1",
+    "version": "9.2.2",
     "description": "Phone input for international phones",
     "keywords": [],
     "license": "MIT",
@@ -17,9 +17,9 @@
         "react": "^16.9.0 || ^17.0.1 || ^18.0.0"
     },
     "dependencies": {
-        "@alfalab/core-components-input": "^11.1.0",
-        "@alfalab/core-components-input-autocomplete": "9.2.0",
-        "@alfalab/core-components-select": "^13.2.2",
+        "@alfalab/core-components-input": "^11.1.1",
+        "@alfalab/core-components-input-autocomplete": "9.3.0",
+        "@alfalab/core-components-select": "^13.2.3",
         "@alfalab/hooks": "^1.4.1",
         "@alfalab/utils": "^1.13.3",
         "classnames": "^2.3.1",