@alfalab/core-components 27.11.0 → 27.13.1

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

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_selectField_component = require('../component-2792ba97.js');
+var components_selectField_component = require('../component-fbf58e08.js');
 require('react');
 require('classnames');
 require('react-merge-refs');

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

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_selectField_component = require('../../component-2792ba97.js');
+var components_selectField_component = require('../../component-fbf58e08.js');
 var React = require('react');
 require('classnames');
 require('react-merge-refs');
@@ -12,7 +12,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var styles = {"component":"intl-phone-input__component_er9ym","option":"intl-phone-input__option_er9ym","flag":"intl-phone-input__flag_er9ym","countryName":"intl-phone-input__countryName_er9ym","dialCode":"intl-phone-input__dialCode_er9ym"};
+var styles = {"component":"intl-phone-input__component_1c2vg","option":"intl-phone-input__option_1c2vg","flag":"intl-phone-input__flag_1c2vg","countryName":"intl-phone-input__countryName_1c2vg","dialCode":"intl-phone-input__dialCode_1c2vg"};
 require('./index.css');
 
 var CountriesSelect = function (_a) {

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

@@ -1,4 +1,4 @@
-/* hash: 13pcv */
+/* hash: yz6kc */
 :root {
     --color-dark-indigo: #0b1f35;
     --color-dark-indigo-60: rgba(11, 31, 53, 0.6);
@@ -722,24 +722,24 @@
     --size-l-height: 64px;
     --size-xl-height: 72px;
 }
-.intl-phone-input__component_er9ym {
+.intl-phone-input__component_1c2vg {
     position: static;
     display: flex;
     min-width: initial;
     height: 100%;
 }
-.intl-phone-input__option_er9ym {
+.intl-phone-input__option_1c2vg {
     display: flex;
     align-items: flex-start;
 }
-.intl-phone-input__flag_er9ym {
+.intl-phone-input__flag_1c2vg {
     flex-shrink: 0;
     margin-top: var(--gap-2xs);
     margin-right: var(--gap-xs);
 }
-.intl-phone-input__countryName_er9ym {
+.intl-phone-input__countryName_1c2vg {
     margin-right: var(--gap-xs);
 }
-.intl-phone-input__dialCode_er9ym {
+.intl-phone-input__dialCode_1c2vg {
     color: var(--text-secondary-color);
 }

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

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../component-2792ba97.js');
+require('../../component-fbf58e08.js');
 require('react');
 require('classnames');
 require('react-merge-refs');

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-2792ba97.js');
+var components_selectField_component = require('../../component-fbf58e08.js');
 require('react');
 require('classnames');
 require('react-merge-refs');

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

@@ -1,4 +1,4 @@
-/* hash: s5vys */
+/* hash: 1eegc */
 :root {
     --color-dark-indigo: #0b1f35;
     --color-dark-indigo-60: rgba(11, 31, 53, 0.6);
@@ -722,13 +722,13 @@
     --size-l-height: 64px;
     --size-xl-height: 72px;
 }
-.intl-phone-input__component_krvra {
+.intl-phone-input__component_14z08 {
     height: 100%;
     cursor: pointer;
     outline: none;
     position: relative;
 }
-.intl-phone-input__flagIconContainer_krvra {
+.intl-phone-input__flagIconContainer_14z08 {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -736,10 +736,10 @@
     height: 24px;
     margin-right: var(--gap-2xs);
 }
-.intl-phone-input__disabled_krvra {
+.intl-phone-input__disabled_14z08 {
     cursor: var(--disabled-cursor);
 }
-.intl-phone-input__inner_krvra {
+.intl-phone-input__inner_14z08 {
     position: relative;
     display: flex;
     align-items: center;
@@ -747,11 +747,11 @@
     padding-left: var(--gap-s);
     outline: none;
 }
-.intl-phone-input__l_krvra .intl-phone-input__inner_krvra,
-.intl-phone-input__xl_krvra .intl-phone-input__inner_krvra {
+.intl-phone-input__l_14z08 .intl-phone-input__inner_14z08,
+.intl-phone-input__xl_14z08 .intl-phone-input__inner_14z08 {
     padding-left: var(--gap-m);
 }
-.intl-phone-input__focusVisible_krvra {
+.intl-phone-input__focusVisible_14z08 {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }

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

@@ -1 +1 @@
-export * from "../../component-2792ba97";
+export * from "../../component-fbf58e08";

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-2792ba97.js');
+var components_selectField_component = require('../../component-fbf58e08.js');
 require('react');
 require('classnames');
 require('react-merge-refs');

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

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

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

@@ -14,6 +14,7 @@ require('../../select/cssm');
 require('./components/select/index.module.css');
 var components_select_component = require('./components/select/component.js');
 var utils_formatPhoneWithUnclearableCountryCode = require('./utils/format-phone-with-unclearable-country-code.js');
+var utils_calculateCaretPos = require('./utils/calculateCaretPos.js');
 var useCaretAvoidCountryCode = require('./useCaretAvoidCountryCode.js');
 var styles = require('./index.module.css');
 
@@ -26,9 +27,10 @@ var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 var countriesHash = utils.getCountriesHash();
 var MAX_DIAL_CODE_LENGTH = 4;
 var MASK_SYMBOLS = [' ', '-', '(', ')'];
-var DEFAULT_MAX_PHONE_LEN = { RU: 11 };
+var MAX_PHONE_LEN = 15;
+var DEFAULT_MAX_PHONE_LEN_BY_COUNTRY = { RU: 11 };
 var IntlPhoneInput = React.forwardRef(function (_a, ref) {
-    var _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.readOnly, readOnly = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? 'm' : _d, _e = _a.colors, colors = _e === void 0 ? 'default' : _e, _f = _a.options, options = _f === void 0 ? [] : _f, _g = _a.countries, countries = _g === void 0 ? utils.getCountries() : _g, _h = _a.clearableCountryCode, clearableCountryCode = _h === void 0 ? true : _h, className = _a.className, value = _a.value, onChange = _a.onChange, onCountryChange = _a.onCountryChange, _j = _a.defaultCountryIso2, defaultCountryIso2 = _j === void 0 ? 'ru' : _j, preventFlip = _a.preventFlip, inputProps = _a.inputProps, _k = _a.maxPhoneLen, maxPhoneLen = _k === void 0 ? DEFAULT_MAX_PHONE_LEN : _k, restProps = components_selectField_component.__rest(_a, ["disabled", "readOnly", "size", "colors", "options", "countries", "clearableCountryCode", "className", "value", "onChange", "onCountryChange", "defaultCountryIso2", "preventFlip", "inputProps", "maxPhoneLen"]);
+    var _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.readOnly, readOnly = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? 'm' : _d, _e = _a.colors, colors = _e === void 0 ? 'default' : _e, _f = _a.options, options = _f === void 0 ? [] : _f, _g = _a.countries, countries = _g === void 0 ? utils.getCountries() : _g, _h = _a.clearableCountryCode, clearableCountryCode = _h === void 0 ? true : _h, className = _a.className, value = _a.value, onChange = _a.onChange, onCountryChange = _a.onCountryChange, _j = _a.defaultCountryIso2, defaultCountryIso2 = _j === void 0 ? 'ru' : _j, preventFlip = _a.preventFlip, inputProps = _a.inputProps, _k = _a.maxPhoneLen, maxPhoneLen = _k === void 0 ? DEFAULT_MAX_PHONE_LEN_BY_COUNTRY : _k, restProps = components_selectField_component.__rest(_a, ["disabled", "readOnly", "size", "colors", "options", "countries", "clearableCountryCode", "className", "value", "onChange", "onCountryChange", "defaultCountryIso2", "preventFlip", "inputProps", "maxPhoneLen"]);
     var _l = React.useState(defaultCountryIso2.toLowerCase()), countryIso2 = _l[0], setCountryIso2 = _l[1];
     var inputRef = React.useRef(null);
     var _m = React.useState(null), inputWrapperRef = _m[0], setInputWrapperRef = _m[1];
@@ -125,9 +127,9 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
     var handleInputNewChar = function (event, caretPosition) {
         var input = event.target;
         var currentValue = input.value;
-        var maxLen = maxPhoneLen === null || maxPhoneLen === void 0 ? void 0 : maxPhoneLen[countryIso2.toUpperCase()];
-        // Если задана длина номера и номер полностью заполнен, то перезатираем цифры, если каретка не в самом конце.
-        var shouldReplace = !!maxLen && maxLen === currentValue.replace(/\D/g, '').length;
+        var maxPhoneLength = (maxPhoneLen === null || maxPhoneLen === void 0 ? void 0 : maxPhoneLen[countryIso2.toUpperCase()]) || MAX_PHONE_LEN;
+        // Если номер полностью заполнен, то перезатираем цифры, если каретка не в самом конце.
+        var shouldReplace = maxPhoneLength === currentValue.replace(/\D/g, '').length;
         var endPhonePart = currentValue.slice(caretPosition);
         if (shouldReplace) {
             var cursor = 0;
@@ -137,45 +139,16 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
             endPhonePart = endPhonePart.slice(cursor + 1);
         }
         var newValue = currentValue.slice(0, caretPosition) + event.key + endPhonePart;
-        // Запрещаем ввод, если указана длина номера и номер уже заполнен.
-        if (maxLen && newValue.replace(/\D/g, '').length > maxLen) {
+        // Запрещаем ввод, если номер уже заполнен.
+        if (newValue.replace(/\D/g, '').length > maxPhoneLength) {
             newValue = newValue.slice(0, -1);
         }
         newValue = formatPhone(addCountryCode(newValue));
-        var newCaretPosition;
-        var isFormatJumps = !shouldReplace && newValue.length - currentValue.length <= 0;
-        // Ситуация, когда происходят скачки номера из-за форматирования, например +7 999 999 99 99 -> +799999999999
-        if (isFormatJumps) {
-            var phonePart = currentValue.slice(0, caretPosition) + event.key;
-            var cursor = 0;
-            while (cursor < phonePart.length && cursor <= newValue.length) {
-                var currChar = phonePart.charAt(cursor);
-                var newValChar = newValue.charAt(cursor);
-                if (currChar !== newValChar) {
-                    if (MASK_SYMBOLS.includes(currChar)) {
-                        phonePart = phonePart.slice(0, cursor) + phonePart.slice(cursor + 1);
-                        // eslint-disable-next-line no-continue
-                        continue;
-                    }
-                    else {
-                        phonePart =
-                            phonePart.slice(0, cursor) + newValChar + phonePart.slice(cursor);
-                    }
-                }
-                cursor += 1;
-            }
-            newCaretPosition = cursor;
-        }
-        else {
-            var cursor = 0;
-            while (newValue.charAt(caretPosition + cursor) &&
-                newValue.charAt(caretPosition + cursor) !== event.key) {
-                cursor += 1;
-            }
-            cursor += 1;
-            newCaretPosition = caretPosition + cursor;
+        var phonePartWithoutMask = currentValue.slice(0, caretPosition).replace(/\D/g, '') + event.key;
+        if (shouldReplace && phonePartWithoutMask.length > maxPhoneLength) {
+            phonePartWithoutMask = phonePartWithoutMask.slice(0, -1);
         }
-        setCaretPos(newCaretPosition);
+        setCaretPos(utils_calculateCaretPos.calculateCaretPos(phonePartWithoutMask, newValue));
         setCountryByDialCodeWithLengthCheck(newValue);
         onChange(newValue);
     };
@@ -184,39 +157,32 @@ var IntlPhoneInput = React.forwardRef(function (_a, ref) {
         if (!clearableCountryCode && caretPosition <= countryCodeLength)
             return;
         var currentValue = input.value;
+        var isMaskSymbol = function (count) {
+            var isMask = MASK_SYMBOLS.includes(currentValue.charAt(caretPosition - count));
+            var isPossibleToRemove = clearableCountryCode
+                ? caretPosition - count > 0
+                : caretPosition - count > countryCodeLength;
+            return isMask && isPossibleToRemove;
+        };
         var deletedCharsCount = 1;
-        // Высчитываем новое положение каретки с учетом символов маски.
-        while (caretPosition - deletedCharsCount > 0 &&
-            MASK_SYMBOLS.includes(currentValue.charAt(caretPosition - deletedCharsCount))) {
+        // Высчитываем кол-во символов, которые нужно удалить.
+        while (isMaskSymbol(deletedCharsCount)) {
             deletedCharsCount += 1;
         }
-        var newCaretPosition = caretPosition - deletedCharsCount;
-        var newValue = formatPhone(addCountryCode(currentValue.slice(0, newCaretPosition) + currentValue.slice(caretPosition)));
-        var isFormatJumps = newValue.length - currentValue.length >= 0;
-        // Обрабатываем ситуацию, когда происходят скачки номера из-за форматирования, например +799999999999 => +7 999 999 99 99
-        if (isFormatJumps) {
-            var phonePart = currentValue.slice(0, newCaretPosition);
-            var cursor = 0;
-            while (cursor < phonePart.length) {
-                var currChar = newValue.charAt(cursor);
-                if (currChar !== phonePart.charAt(cursor)) {
-                    phonePart = phonePart.slice(0, cursor) + currChar + phonePart.slice(cursor);
-                }
-                cursor += 1;
-            }
-            newCaretPosition = cursor;
-        }
-        setCaretPos(newCaretPosition);
+        var phonePart = currentValue.slice(0, caretPosition - deletedCharsCount);
+        var newValue = formatPhone(addCountryCode(phonePart + currentValue.slice(caretPosition)));
+        var phonePartWithoutMask = phonePart.replace(/[^0-9+]+/g, '');
+        setCaretPos(utils_calculateCaretPos.calculateCaretPos(phonePartWithoutMask, newValue));
         setCountryByDialCodeWithLengthCheck(newValue);
         onChange(newValue);
     };
     var handleKeyDown = function (event) {
         var input = event.target;
-        var caretPosition = input.selectionStart;
-        if (!caretPosition) {
-            return;
-        }
-        if (event.key === 'Backspace') {
+        var caretPosition = input.selectionStart || 0;
+        // Нажат только Backspace, не сочетание клавиш с ним.
+        if (!event.shiftKey && !event.ctrlKey && !event.metaKey && event.key === 'Backspace') {
+            if (!caretPosition)
+                return;
             event.preventDefault();
             handleDeleteChar(event, caretPosition);
         }

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

@@ -14,6 +14,7 @@ require('../../select/cssm');
 require('./components/select/index.module.css');
 require('./components/select/component.js');
 require('./utils/format-phone-with-unclearable-country-code.js');
+require('./utils/calculateCaretPos.js');
 require('./useCaretAvoidCountryCode.js');
 require('./index.module.css');
 var component = require('./component.js');

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

@@ -4,28 +4,32 @@ var React = require('react');
 
 function useCaretAvoidCountryCode(_a) {
     var inputRef = _a.inputRef, countryCodeLength = _a.countryCodeLength, clearableCountryCode = _a.clearableCountryCode;
-    var input = inputRef.current;
-    var moveCaretFromCountryCode = React.useCallback(function () {
-        if (!input)
-            return;
-        var selectionStart = input.selectionStart || 0;
-        if (selectionStart < countryCodeLength) {
-            input.focus();
-            input.setSelectionRange(countryCodeLength, countryCodeLength);
-        }
-    }, [input, countryCodeLength]);
-    var preventCaretMovingOnCountryCode = React.useCallback(function (event) {
-        if (!input)
-            return;
-        var selectionStart = input.selectionStart || 0;
-        var toLeftKey = event.keyCode === 37;
-        if (toLeftKey && selectionStart <= countryCodeLength) {
-            event.preventDefault();
-        }
-    }, [input, countryCodeLength]);
     React.useEffect(function () {
+        var input = inputRef.current;
         if (!input || clearableCountryCode)
             return;
+        var moveCaretFromCountryCode = function () {
+            var selectionStart = input.selectionStart || 0;
+            if (selectionStart < countryCodeLength) {
+                input.focus();
+                input.setSelectionRange(countryCodeLength, countryCodeLength);
+            }
+        };
+        var preventCaretMovingOnCountryCode = function (event) {
+            var selectionStart = input.selectionStart || 0;
+            var toLeftKey = event.keyCode === 37;
+            if (toLeftKey) {
+                if (selectionStart <= countryCodeLength) {
+                    event.preventDefault();
+                }
+                // Если нажали ctrl + arrowLeft, то восстанавливаем положение каретки.
+                if (event.metaKey || event.ctrlKey) {
+                    requestAnimationFrame(function () {
+                        moveCaretFromCountryCode();
+                    });
+                }
+            }
+        };
         input.addEventListener('click', moveCaretFromCountryCode);
         input.addEventListener('keydown', preventCaretMovingOnCountryCode);
         // eslint-disable-next-line consistent-return
@@ -33,7 +37,7 @@ function useCaretAvoidCountryCode(_a) {
             input.removeEventListener('click', moveCaretFromCountryCode);
             input.removeEventListener('keydown', preventCaretMovingOnCountryCode);
         };
-    }, [clearableCountryCode, input, preventCaretMovingOnCountryCode, moveCaretFromCountryCode]);
+    }, [clearableCountryCode, countryCodeLength, inputRef]);
 }
 
 exports.useCaretAvoidCountryCode = useCaretAvoidCountryCode;

package/intl-phone-input/cssm/utils/calculateCaretPos.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Расчет нового положения каретки.
+ * @param phonePart Шаблон с которым сравнивается новое значение. (Часть телефона без маски с учетом удаленных и добавленных цифр).
+ * @param newVal Новый отформатированный телефон.
+ */
+declare function calculateCaretPos(phonePart: string, newVal: string): number;
+export { calculateCaretPos };

package/intl-phone-input/cssm/utils/calculateCaretPos.js

@@ -0,0 +1,25 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+/**
+ * Расчет нового положения каретки.
+ * @param phonePart Шаблон с которым сравнивается новое значение. (Часть телефона без маски с учетом удаленных и добавленных цифр).
+ * @param newVal Новый отформатированный телефон.
+ */
+function calculateCaretPos(phonePart, newVal) {
+    var newCaretPosition = 0;
+    for (var idx = 0; idx < phonePart.length; idx++) {
+        var digit = phonePart.charAt(idx);
+        if (digit !== newVal.charAt(newCaretPosition)) {
+            idx -= 1;
+        }
+        newCaretPosition += 1;
+        // Если произошла непредвиденная ситуация, то прерываем цикл и ставим каретку в самый конец номера.
+        if (newCaretPosition > newVal.length) {
+            newCaretPosition = newVal.length;
+            break;
+        }
+    }
+    return newCaretPosition;
+}
+
+exports.calculateCaretPos = calculateCaretPos;

package/intl-phone-input/esm/{component-982261f5.js → component-25b3eb47.js}

@@ -43,7 +43,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"component":"intl-phone-input__component_krvra","flagIconContainer":"intl-phone-input__flagIconContainer_krvra","disabled":"intl-phone-input__disabled_krvra","inner":"intl-phone-input__inner_krvra","l":"intl-phone-input__l_krvra","xl":"intl-phone-input__xl_krvra","focusVisible":"intl-phone-input__focusVisible_krvra"};
+var styles = {"component":"intl-phone-input__component_14z08","flagIconContainer":"intl-phone-input__flagIconContainer_14z08","disabled":"intl-phone-input__disabled_14z08","inner":"intl-phone-input__inner_14z08","l":"intl-phone-input__l_14z08","xl":"intl-phone-input__xl_14z08","focusVisible":"intl-phone-input__focusVisible_14z08"};
 require('./components/select-field/index.css');
 
 var SelectField = function (_a) {

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

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

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

@@ -3,23 +3,25 @@ import cn from 'classnames';
 import 'react-merge-refs';
 import '@alfalab/hooks';
 import './components/flag-icon/component.js';
-import { _ as __rest, a as __assign } from './component-982261f5.js';
+import { _ as __rest, a as __assign } from './component-25b3eb47.js';
 import { getCountriesHash, getCountries } from '@alfalab/utils';
 import { InputAutocomplete } from '../../input-autocomplete/esm';
 import '../../select/esm';
 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';
 
-var styles = {"addons":"intl-phone-input__addons_arabf","l":"intl-phone-input__l_arabf","xl":"intl-phone-input__xl_arabf"};
+var styles = {"addons":"intl-phone-input__addons_rhr68","l":"intl-phone-input__l_rhr68","xl":"intl-phone-input__xl_rhr68"};
 require('./index.css');
 
 var countriesHash = getCountriesHash();
 var MAX_DIAL_CODE_LENGTH = 4;
 var MASK_SYMBOLS = [' ', '-', '(', ')'];
-var DEFAULT_MAX_PHONE_LEN = { RU: 11 };
+var MAX_PHONE_LEN = 15;
+var DEFAULT_MAX_PHONE_LEN_BY_COUNTRY = { RU: 11 };
 var IntlPhoneInput = forwardRef(function (_a, ref) {
-    var _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.readOnly, readOnly = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? 'm' : _d, _e = _a.colors, colors = _e === void 0 ? 'default' : _e, _f = _a.options, options = _f === void 0 ? [] : _f, _g = _a.countries, countries = _g === void 0 ? getCountries() : _g, _h = _a.clearableCountryCode, clearableCountryCode = _h === void 0 ? true : _h, className = _a.className, value = _a.value, onChange = _a.onChange, onCountryChange = _a.onCountryChange, _j = _a.defaultCountryIso2, defaultCountryIso2 = _j === void 0 ? 'ru' : _j, preventFlip = _a.preventFlip, inputProps = _a.inputProps, _k = _a.maxPhoneLen, maxPhoneLen = _k === void 0 ? DEFAULT_MAX_PHONE_LEN : _k, restProps = __rest(_a, ["disabled", "readOnly", "size", "colors", "options", "countries", "clearableCountryCode", "className", "value", "onChange", "onCountryChange", "defaultCountryIso2", "preventFlip", "inputProps", "maxPhoneLen"]);
+    var _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.readOnly, readOnly = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? 'm' : _d, _e = _a.colors, colors = _e === void 0 ? 'default' : _e, _f = _a.options, options = _f === void 0 ? [] : _f, _g = _a.countries, countries = _g === void 0 ? getCountries() : _g, _h = _a.clearableCountryCode, clearableCountryCode = _h === void 0 ? true : _h, className = _a.className, value = _a.value, onChange = _a.onChange, onCountryChange = _a.onCountryChange, _j = _a.defaultCountryIso2, defaultCountryIso2 = _j === void 0 ? 'ru' : _j, preventFlip = _a.preventFlip, inputProps = _a.inputProps, _k = _a.maxPhoneLen, maxPhoneLen = _k === void 0 ? DEFAULT_MAX_PHONE_LEN_BY_COUNTRY : _k, restProps = __rest(_a, ["disabled", "readOnly", "size", "colors", "options", "countries", "clearableCountryCode", "className", "value", "onChange", "onCountryChange", "defaultCountryIso2", "preventFlip", "inputProps", "maxPhoneLen"]);
     var _l = useState(defaultCountryIso2.toLowerCase()), countryIso2 = _l[0], setCountryIso2 = _l[1];
     var inputRef = useRef(null);
     var _m = useState(null), inputWrapperRef = _m[0], setInputWrapperRef = _m[1];
@@ -116,9 +118,9 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
     var handleInputNewChar = function (event, caretPosition) {
         var input = event.target;
         var currentValue = input.value;
-        var maxLen = maxPhoneLen === null || maxPhoneLen === void 0 ? void 0 : maxPhoneLen[countryIso2.toUpperCase()];
-        // Если задана длина номера и номер полностью заполнен, то перезатираем цифры, если каретка не в самом конце.
-        var shouldReplace = !!maxLen && maxLen === currentValue.replace(/\D/g, '').length;
+        var maxPhoneLength = (maxPhoneLen === null || maxPhoneLen === void 0 ? void 0 : maxPhoneLen[countryIso2.toUpperCase()]) || MAX_PHONE_LEN;
+        // Если номер полностью заполнен, то перезатираем цифры, если каретка не в самом конце.
+        var shouldReplace = maxPhoneLength === currentValue.replace(/\D/g, '').length;
         var endPhonePart = currentValue.slice(caretPosition);
         if (shouldReplace) {
             var cursor = 0;
@@ -128,45 +130,16 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
             endPhonePart = endPhonePart.slice(cursor + 1);
         }
         var newValue = currentValue.slice(0, caretPosition) + event.key + endPhonePart;
-        // Запрещаем ввод, если указана длина номера и номер уже заполнен.
-        if (maxLen && newValue.replace(/\D/g, '').length > maxLen) {
+        // Запрещаем ввод, если номер уже заполнен.
+        if (newValue.replace(/\D/g, '').length > maxPhoneLength) {
             newValue = newValue.slice(0, -1);
         }
         newValue = formatPhone(addCountryCode(newValue));
-        var newCaretPosition;
-        var isFormatJumps = !shouldReplace && newValue.length - currentValue.length <= 0;
-        // Ситуация, когда происходят скачки номера из-за форматирования, например +7 999 999 99 99 -> +799999999999
-        if (isFormatJumps) {
-            var phonePart = currentValue.slice(0, caretPosition) + event.key;
-            var cursor = 0;
-            while (cursor < phonePart.length && cursor <= newValue.length) {
-                var currChar = phonePart.charAt(cursor);
-                var newValChar = newValue.charAt(cursor);
-                if (currChar !== newValChar) {
-                    if (MASK_SYMBOLS.includes(currChar)) {
-                        phonePart = phonePart.slice(0, cursor) + phonePart.slice(cursor + 1);
-                        // eslint-disable-next-line no-continue
-                        continue;
-                    }
-                    else {
-                        phonePart =
-                            phonePart.slice(0, cursor) + newValChar + phonePart.slice(cursor);
-                    }
-                }
-                cursor += 1;
-            }
-            newCaretPosition = cursor;
-        }
-        else {
-            var cursor = 0;
-            while (newValue.charAt(caretPosition + cursor) &&
-                newValue.charAt(caretPosition + cursor) !== event.key) {
-                cursor += 1;
-            }
-            cursor += 1;
-            newCaretPosition = caretPosition + cursor;
+        var phonePartWithoutMask = currentValue.slice(0, caretPosition).replace(/\D/g, '') + event.key;
+        if (shouldReplace && phonePartWithoutMask.length > maxPhoneLength) {
+            phonePartWithoutMask = phonePartWithoutMask.slice(0, -1);
         }
-        setCaretPos(newCaretPosition);
+        setCaretPos(calculateCaretPos(phonePartWithoutMask, newValue));
         setCountryByDialCodeWithLengthCheck(newValue);
         onChange(newValue);
     };
@@ -175,39 +148,32 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
         if (!clearableCountryCode && caretPosition <= countryCodeLength)
             return;
         var currentValue = input.value;
+        var isMaskSymbol = function (count) {
+            var isMask = MASK_SYMBOLS.includes(currentValue.charAt(caretPosition - count));
+            var isPossibleToRemove = clearableCountryCode
+                ? caretPosition - count > 0
+                : caretPosition - count > countryCodeLength;
+            return isMask && isPossibleToRemove;
+        };
         var deletedCharsCount = 1;
-        // Высчитываем новое положение каретки с учетом символов маски.
-        while (caretPosition - deletedCharsCount > 0 &&
-            MASK_SYMBOLS.includes(currentValue.charAt(caretPosition - deletedCharsCount))) {
+        // Высчитываем кол-во символов, которые нужно удалить.
+        while (isMaskSymbol(deletedCharsCount)) {
             deletedCharsCount += 1;
         }
-        var newCaretPosition = caretPosition - deletedCharsCount;
-        var newValue = formatPhone(addCountryCode(currentValue.slice(0, newCaretPosition) + currentValue.slice(caretPosition)));
-        var isFormatJumps = newValue.length - currentValue.length >= 0;
-        // Обрабатываем ситуацию, когда происходят скачки номера из-за форматирования, например +799999999999 => +7 999 999 99 99
-        if (isFormatJumps) {
-            var phonePart = currentValue.slice(0, newCaretPosition);
-            var cursor = 0;
-            while (cursor < phonePart.length) {
-                var currChar = newValue.charAt(cursor);
-                if (currChar !== phonePart.charAt(cursor)) {
-                    phonePart = phonePart.slice(0, cursor) + currChar + phonePart.slice(cursor);
-                }
-                cursor += 1;
-            }
-            newCaretPosition = cursor;
-        }
-        setCaretPos(newCaretPosition);
+        var phonePart = currentValue.slice(0, caretPosition - deletedCharsCount);
+        var newValue = formatPhone(addCountryCode(phonePart + currentValue.slice(caretPosition)));
+        var phonePartWithoutMask = phonePart.replace(/[^0-9+]+/g, '');
+        setCaretPos(calculateCaretPos(phonePartWithoutMask, newValue));
         setCountryByDialCodeWithLengthCheck(newValue);
         onChange(newValue);
     };
     var handleKeyDown = function (event) {
         var input = event.target;
-        var caretPosition = input.selectionStart;
-        if (!caretPosition) {
-            return;
-        }
-        if (event.key === 'Backspace') {
+        var caretPosition = input.selectionStart || 0;
+        // Нажат только Backspace, не сочетание клавиш с ним.
+        if (!event.shiftKey && !event.ctrlKey && !event.metaKey && event.key === 'Backspace') {
+            if (!caretPosition)
+                return;
             event.preventDefault();
             handleDeleteChar(event, caretPosition);
         }
@@ -226,7 +192,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
         if (phoneLibUtils.current)
             return;
         import(
-        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-265908f3.js')
+        /* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-24f2609b.js')
             .then(function (utils) {
             phoneLibUtils.current = utils.AsYouType;
             setCountryByDialCode(value);