intelicoreact 1.3.5 → 1.3.7

package/dist/Atomic/FormElements/InputDateRange/InputDateRange.js

@@ -98,6 +98,11 @@ var InputDateRange = function InputDateRange(props) {
   var ref = !isUseAbs ? (0, _dependencies.useClickOutside)(toggleOff, dropdownContainers) : (0, _react.useRef)(null);
   var internalContainerRef = (0, _react.useRef)(null);
 
+  var _useState5 = (0, _react.useState)(Math.random().toString(16).slice(2)),
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      dateRangeContainerId = _useState6[0],
+      setDateRangeContainerId = _useState6[1];
+
   var handleChange = function handleChange(input) {
     var newValue = (0, _dependencies.getActualDateRange)(input);
 
@@ -185,6 +190,34 @@ var InputDateRange = function InputDateRange(props) {
     toggleOff();
   };
 
+  var getParentNode = function getParentNode() {
+    var _document$querySelect;
+
+    return (_document$querySelect = document.querySelector('div#root')) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector('div#app');
+  };
+
+  var initDateRangeContainer = function initDateRangeContainer() {
+    var _document$getElementB;
+
+    (_document$getElementB = document.getElementById(dateRangeContainerId)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.remove();
+    var dateRangeContainer = document.createElement('div');
+    dateRangeContainer.setAttribute('id', dateRangeContainerId);
+    dateRangeContainer.classList.add('input-date-range__mobile-container');
+    getParentNode().append(dateRangeContainer);
+  };
+
+  var getDateRangeContainer = function getDateRangeContainer() {
+    return document.getElementById(dateRangeContainerId);
+  };
+
+  (0, _react.useLayoutEffect)(function () {
+    initDateRangeContainer();
+    return function () {
+      var _getDateRangeContaine;
+
+      (_getDateRangeContaine = getDateRangeContainer()) === null || _getDateRangeContaine === void 0 ? void 0 : _getDateRangeContaine.remove();
+    };
+  }, []);
   return /*#__PURE__*/_react.default.createElement("div", {
     ref: internalContainerRef,
     className: (0, _classnames.default)('date-range-input', className, {
@@ -244,6 +277,7 @@ var InputDateRange = function InputDateRange(props) {
     disabled: disabled || (actualValues === null || actualValues === void 0 ? void 0 : actualValues.intervalKey) === _dependencies.ALL_TIME_KEY || !isDontLimitFuture && (formatedMaxDate ? (0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).endOf('day').subtract((0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).diff(actualValues === null || actualValues === void 0 ? void 0 : actualValues.start, 'hours'), 'hours').isAfter(momentMaxDate.startOf('day')) : (0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).add((0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).diff(actualValues === null || actualValues === void 0 ? void 0 : actualValues.start, 'hours'), 'hours').isAfter((0, _momentTimezone.default)().add(1, 'day').startOf('day'))),
     isAlt: isAltArrows
   }))), isToggled && !isUseAbs && /*#__PURE__*/_react.default.createElement(_OpenedPart.default, (0, _extends2.default)({}, props, {
+    dateRangeContainerId: dateRangeContainerId,
     mainId: id,
     testId: testId,
     ref: internalContainerRef,

package/dist/Atomic/FormElements/InputDateRange/components/OpenedPart.js

@@ -17,6 +17,8 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _reactDom = require("react-dom");
+
 var _momentTimezone = _interopRequireDefault(require("moment-timezone"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
@@ -48,7 +50,8 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 var classNames = require('classnames');
 
 var OpenedPart = function OpenedPart(props, ref) {
-  var txt = props.txt,
+  var dateRangeContainerId = props.dateRangeContainerId,
+      txt = props.txt,
       buttonsTypes = props.buttonsTypes,
       actualValues = props.actualValues,
       _props$onChange = props.onChange,
@@ -253,7 +256,17 @@ var OpenedPart = function OpenedPart(props, ref) {
     }), renderDatepicker());
   };
 
-  return withMobileLogic && isMobile ? renderMobileOpenedPart() : renderOpenedPart();
+  var getDateRangeContainer = function getDateRangeContainer() {
+    return document.getElementById(dateRangeContainerId);
+  };
+
+  var renderDateRangeMobileContainer = function renderDateRangeMobileContainer() {
+    var dateRangeContainer = getDateRangeContainer();
+    if (!dateRangeContainer) return null;
+    return /*#__PURE__*/(0, _reactDom.createPortal)(renderMobileOpenedPart(), dateRangeContainer);
+  };
+
+  return withMobileLogic && isMobile ? renderDateRangeMobileContainer() : renderOpenedPart();
 };
 
 var _default = /*#__PURE__*/_react.default.forwardRef(OpenedPart);

package/dist/Molecular/InputAddress/InputAddress.js

@@ -2,7 +2,7 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
-var _typeof = require("@babel/runtime/helpers/typeof");
+var _typeof3 = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -13,27 +13,55 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _reactFeather = require("react-feather");
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
+var _utils = require("../../Functions/utils");
+
 var _useIsMobile2 = _interopRequireDefault(require("../../Functions/useIsMobile"));
 
 var _Input = _interopRequireDefault(require("../../Atomic/FormElements/Input/Input"));
 
 var _Hint = _interopRequireDefault(require("../../Atomic/UI/Hint/Hint"));
 
+var _Spinner = _interopRequireDefault(require("../../Atomic/Layout/Spinner/Spinner"));
+
 require("./InputAddress.scss");
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-var throttleTimeout = null;
 var DEFAULT_HINT_MESSAGE = 'Select the correct address from the list of suggestions (must contains house number and street name)';
-var RC = "input-address";
+var RC = "input-address"; // ? Если равны - true
+
+var compareValues = function compareValues(val1, val2) {
+  return (0, _typeof2.default)(val1) === (0, _typeof2.default)(val2) && ((0, _utils.getIsOnlyAnObject)(val1) ? (0, _utils.compare)(val1, val2) : val1 === val2);
+};
+
+var throttle = function throttle(fn, ms) {
+  var id = null;
+  return function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    if (id) clearTimeout(id);
+    id = setTimeout(function () {
+      fn.apply(void 0, args);
+    }, ms);
+  };
+}; // Отдает true если value валидное НЕ нулевое число
+
+
+var getIsValidNumber = function getIsValidNumber(value) {
+  return !!value && typeof value === 'number' && !Number.isNaN(value);
+};
 
 var InputAddress = function InputAddress(_ref) {
   var label = _ref.label,
@@ -48,7 +76,9 @@ var InputAddress = function InputAddress(_ref) {
       _ref$testId = _ref.testId,
       testId = _ref$testId === void 0 ? '' : _ref$testId,
       _ref$throttle = _ref.throttle,
-      throttle = _ref$throttle === void 0 ? 300 : _ref$throttle,
+      throttleTime = _ref$throttle === void 0 ? 500 : _ref$throttle,
+      _ref$additionalThrott = _ref.additionalThrottleTimeForListingRequest,
+      additionalThrottleTimeForListingRequest = _ref$additionalThrott === void 0 ? 0 : _ref$additionalThrott,
       _ref$loader = _ref.loader,
       loader = _ref$loader === void 0 ? '' : _ref$loader,
       _ref$noItemsMessage = _ref.noItemsMessage,
@@ -59,8 +89,10 @@ var InputAddress = function InputAddress(_ref) {
       _ref$onChange = _ref.onChange,
       onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
       onChangeValueTransformer = _ref.onChangeValueTransformer,
+      disabled = _ref.disabled,
       _ref$getListItems = _ref.getListItems,
       getListItems = _ref$getListItems === void 0 ? function () {} : _ref$getListItems,
+      clarifyAddressInfo = _ref.clarifyAddressInfo,
       _ref$noValidate = _ref.noValidate,
       noValidate = _ref$noValidate === void 0 ? false : _ref$noValidate,
       renderSelectedItem = _ref.renderSelectedItem,
@@ -76,6 +108,7 @@ var InputAddress = function InputAddress(_ref) {
   var listOverlayRef = (0, _react.useRef)(null);
   var listWrapperRef = (0, _react.useRef)(null);
   var listHeaderRef = (0, _react.useRef)(null);
+  var previousValueRef = (0, _react.useRef)(value);
 
   var _useState = (0, _react.useState)(false),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -97,15 +130,15 @@ var InputAddress = function InputAddress(_ref) {
       scrollHeight = _useState8[0],
       setScrollHeight = _useState8[1];
 
-  var _useState9 = (0, _react.useState)(null),
+  var _useState9 = (0, _react.useState)(value),
       _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-      query = _useState10[0],
-      setQuery = _useState10[1];
+      innerValue = _useState10[0],
+      setInnerValue = _useState10[1];
 
   var _useState11 = (0, _react.useState)(null),
       _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
-      tempQuery = _useState12[0],
-      setTempQuery = _useState12[1];
+      tempInnerValue = _useState12[0],
+      setTempInnerValue = _useState12[1];
 
   var _useState13 = (0, _react.useState)(null),
       _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
@@ -122,55 +155,78 @@ var InputAddress = function InputAddress(_ref) {
       isLoading = _useState18[0],
       setIsLoading = _useState18[1];
 
-  var _useState19 = (0, _react.useState)(null),
+  var _useState19 = (0, _react.useState)(false),
       _useState20 = (0, _slicedToArray2.default)(_useState19, 2),
-      hightlightedIndex = _useState20[0],
-      setHightlightedIndex = _useState20[1];
+      isListLoading = _useState20[0],
+      setIsListLoading = _useState20[1];
 
-  var _useState21 = (0, _react.useState)(false),
+  var _useState21 = (0, _react.useState)(null),
       _useState22 = (0, _slicedToArray2.default)(_useState21, 2),
-      isFocused = _useState22[0],
-      setIsFocused = _useState22[1];
+      hightlightedIndex = _useState22[0],
+      setHightlightedIndex = _useState22[1];
 
   var _useState23 = (0, _react.useState)(false),
       _useState24 = (0, _slicedToArray2.default)(_useState23, 2),
-      isListVisible = _useState24[0],
-      setIsListVisible = _useState24[1];
+      isFocused = _useState24[0],
+      setIsFocused = _useState24[1];
+
+  var _useState25 = (0, _react.useState)(false),
+      _useState26 = (0, _slicedToArray2.default)(_useState25, 2),
+      isListVisible = _useState26[0],
+      setIsListVisible = _useState26[1];
 
   var isWrongAddress = (0, _react.useMemo)(function () {
-    var _query$street;
+    var _innerValue$street;
 
     if (noValidate) return false;
-    if (query === '') return false; // eslint-disable-next-line no-prototype-builtins
+    if (innerValue === '') return false; // eslint-disable-next-line no-prototype-builtins
 
-    if (!(query !== null && query !== void 0 && query.hasOwnProperty('streetNumber')) || !(query !== null && query !== void 0 && query.streetNumber)) return true; // eslint-disable-next-line no-prototype-builtins
+    if (!(innerValue !== null && innerValue !== void 0 && innerValue.hasOwnProperty('streetNumber')) || !(innerValue !== null && innerValue !== void 0 && innerValue.streetNumber)) return true; // eslint-disable-next-line no-prototype-builtins
 
-    if (!(query !== null && query !== void 0 && query.hasOwnProperty('street')) || !(query !== null && query !== void 0 && (_query$street = query.street) !== null && _query$street !== void 0 && _query$street.fullName)) return true;
+    if (!(innerValue !== null && innerValue !== void 0 && innerValue.hasOwnProperty('street')) || !(innerValue !== null && innerValue !== void 0 && (_innerValue$street = innerValue.street) !== null && _innerValue$street !== void 0 && _innerValue$street.fullName)) return true;
     return false;
-  }, [query]);
+  }, [innerValue]);
+
+  var setItemAsInnerValue = function setItemAsInnerValue(e, item) {
+    if (e instanceof Event) {
+      e.preventDefault();
+      e.stopPropagation();
+    }
 
-  var setQueryAsItem = function setQueryAsItem(e, item) {
-    if (e) e === null || e === void 0 ? void 0 : e.stopPropagation();
     setTimeout(function () {
-      setQuery(item);
+      setInnerValue(item);
 
       if (isMobile) {
         setIsListVisible(false);
       }
-    }, 1);
-  };
+    }, 0);
+  }; // ? Базовый метод получения списка вариантов адреса
+
 
-  var getData = function getData() {
-    if (!(query !== null && query !== void 0 && query.length)) return null;
-    clearTimeout(throttleTimeout);
-    throttleTimeout = setTimeout(function () {
+  var getAddressVariants = (0, _react.useMemo)(function () {
+    return function (innerValue) {
       var _getListItems;
 
-      setIsLoading(true);
-      (_getListItems = getListItems(query)) === null || _getListItems === void 0 ? void 0 : _getListItems.then(setListItems).finally(function () {
-        return setIsLoading(false);
+      return (_getListItems = getListItems(innerValue)) === null || _getListItems === void 0 ? void 0 : _getListItems.then(setListItems).finally(function () {
+        return setIsListLoading(false);
       });
-    }, throttle);
+    };
+  }, [getListItems]); // ? Метод получения списка вариантов адреса с тротлингом (основным и, если нужно, дополнительным)
+  // ? Без useMemo работать НЕ будет (т.к. на каждом перерендере будет создаваться новая ф-я и будет теряться замкнутая переменная id из throttle)
+
+  var getAddressVariantsWithThrottling = (0, _react.useMemo)(function () {
+    var execute = getIsValidNumber(additionalThrottleTimeForListingRequest) ? throttle(getAddressVariants, additionalThrottleTimeForListingRequest) : getAddressVariants;
+    return getIsValidNumber(throttleTime) ? throttle(execute, throttleTime) : execute;
+  }, [getAddressVariants, additionalThrottleTimeForListingRequest, throttleTime]); // ? Итоговый "получатель" списка вариантов адресов
+
+  var getAddressVariantsList = function getAddressVariantsList() {
+    if (!(innerValue !== null && innerValue !== void 0 && innerValue.length)) return null; // ? Вообще с учетом надпись "Loading" в списке вариантов включается в этом месте (т.е. сразу при начале набора),
+    // ? то, наверное, можно было НЕ мутить с дополнительным тротлингом )).
+    // ? Наверное, можно было увеличить время первичного тротлинга и, наверное, работало бы так же ))
+    // ? НО, раз уже сделал )) оставлю, может будет в будущем полезно )
+
+    setIsListLoading(true);
+    getAddressVariantsWithThrottling(innerValue);
   };
 
   var onClearClick = function onClearClick(e) {
@@ -183,11 +239,11 @@ var InputAddress = function InputAddress(_ref) {
       setIsListVisible(false);
     }
 
-    setQuery('');
+    setInnerValue('');
     inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
     setTimeout(function () {
       return setIsFocused(true);
-    }, 50);
+    }, 0);
   };
 
   var onOverlayClick = function onOverlayClick(e) {
@@ -195,8 +251,8 @@ var InputAddress = function InputAddress(_ref) {
       e.stopPropagation();
       e.preventDefault();
       setIsListVisible(false);
-      setQuery(tempQuery);
-      onChange(typeof query === 'string' || !onChangeValueTransformer || typeof onChangeValueTransformer !== 'function' ? query : onChangeValueTransformer(query));
+      setInnerValue(tempInnerValue);
+      onChange(typeof innerValue === 'string' || !onChangeValueTransformer || typeof onChangeValueTransformer !== 'function' ? innerValue : onChangeValueTransformer(innerValue));
     }
   };
 
@@ -207,7 +263,7 @@ var InputAddress = function InputAddress(_ref) {
       var _inputRef$current2;
 
       // Enter Controller
-      setQueryAsItem(null, listItems[hightlightedIndex]);
+      setItemAsInnerValue(null, listItems[hightlightedIndex]);
       setHightlightedIndex(null);
       inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.blur();
     } else {
@@ -267,23 +323,20 @@ var InputAddress = function InputAddress(_ref) {
     }
   };
 
-  var onChangeInternal = function onChangeInternal(value) {
-    setQuery(value);
-  };
-
   var getHintMessage = function getHintMessage() {
     if (!renderHintMessage || typeof renderHintMessage !== 'function') return DEFAULT_HINT_MESSAGE;
-    return renderHintMessage(query);
+    return renderHintMessage(innerValue);
   };
 
   var getSelectedItemLabel = function getSelectedItemLabel() {
     var _value$street;
 
-    var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : query;
-    if (value === null) return '';
+    var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : innerValue;
+    if (!value) return '';
     if (typeof value === 'string') return value;
-    if (!renderSelectedItem || typeof renderSelectedItem !== 'function') return "".concat((value === null || value === void 0 ? void 0 : value.streetNumber) || '', " ").concat((value === null || value === void 0 ? void 0 : (_value$street = value.street) === null || _value$street === void 0 ? void 0 : _value$street.fullName) || '');
-    return renderSelectedItem(value);
+    if (typeof renderSelectedItem === 'function') renderSelectedItem(value);
+    var label = "".concat((value === null || value === void 0 ? void 0 : value.streetNumber) || '', " ").concat((value === null || value === void 0 ? void 0 : (_value$street = value.street) === null || _value$street === void 0 ? void 0 : _value$street.fullName) || '').trim();
+    return !label && isLoading ? previousValueRef.current : label;
   };
 
   var getListItemLabel = function getListItemLabel(item) {
@@ -308,23 +361,63 @@ var InputAddress = function InputAddress(_ref) {
     if (listRef.current) {
       listRef.current.style.maxHeight = "initial";
     }
-  };
+  }; // ? Основной блок работы со значениями адреса
+  // ? Не меняйте вызовы setInnerValue и onChange не разобравшись в логике вызовов
 
-  var preparedValue = (0, _react.useMemo)(function () {
-    if (!value) return '';
-    if (typeof value === 'string') return value === null || value === void 0 ? void 0 : value.trim();
-    return value;
-  }, [value]);
-  (0, _react.useEffect)(function () {
-    if (isFocused && query !== '') {
-      setIsListVisible(true);
-      getData();
-    }
 
-    if (JSON.stringify(preparedValue) !== JSON.stringify(query) && query !== null) {
-      onChange(typeof query === 'string' || !onChangeValueTransformer || typeof onChangeValueTransformer !== 'function' ? query : onChangeValueTransformer(query));
+  (0, _react.useEffect)(function () {
+    // ? Исключение инициализации - равны только при первом рендере компонента,
+    // ? т.к. рефка и стейт инициализируются верхним value
+    if (!compareValues(innerValue, previousValueRef.current)) {
+      var isObject = (0, _utils.getIsOnlyAnObject)(innerValue); // ? innerValue меняется либо от ручного ввода, либо от выбора из списка
+      // ? Полная информация или нет - напрямую зависит от ответа getListItems
+
+      var isFullInfo = isObject && 'streetNumber' in innerValue && 'street' in innerValue && 'city' in innerValue && 'state' in innerValue && 'country' in innerValue && 'zipCode' in innerValue; // ? Для старого эндпоинта возвращается список с полной информацией, поэтому на проектах ничего не поменяется,
+      // ? если не менять запросник (getListItems), все будет проходить по этой if-ке или по 3-й (для строчных значений)
+
+      if (isFullInfo) {
+        onChange(innerValue);
+        setIsLoading(false);
+      } // ? Неполная информация может быть только в том случае, когда метод getListItems использует уже новый эндпоинт гугл-апи.
+      // ? Предполагается, что при этом в компонент будет прокинута ф-я "уточнятель" (clarifyAddressInfo)
+
+
+      if (isObject && !isFullInfo) {
+        if (typeof clarifyAddressInfo === 'function') {
+          var _clarifyAddressInfo, _clarifyAddressInfo$t;
+
+          setIsLoading(true); // ? Предполагается, что clarifyAddressInfo - асинхронная ф-я, запросник уточнения опции
+          // ? Никаких await-ов НЕ нужно (тем более что в useEffect и нельзя для нового React),
+          // ? промис "выплюнется в пустоту", но НЕ будет отчищен до резолва, а useEffect (и итерация рендера в целом) при этом будет закончен(а)
+
+          (_clarifyAddressInfo = clarifyAddressInfo(innerValue)) === null || _clarifyAddressInfo === void 0 ? void 0 : (_clarifyAddressInfo$t = _clarifyAddressInfo.then) === null || _clarifyAddressInfo$t === void 0 ? void 0 : _clarifyAddressInfo$t.call(_clarifyAddressInfo, function (res) {
+            if (res) setInnerValue(res);else {
+              setInnerValue(previousValueRef.current);
+              setTimeout(function () {
+                inputRef.current.focus();
+                inputRef.current.setSelectionRange(previousValueRef.current.length, previousValueRef.current.length);
+              }, 0);
+            }
+            setIsLoading(false);
+            return res;
+          });
+        } // ! Если сверху поменяли эндпоинт и он выдает "облегченный листинг" (айтемы с неполной инфой),
+        // ! и НЕ пробросили clarifyAddressInfo, то на этом кейсе велью инпута будет просто зануляться
+        // ! (getSelectedItemLabel вернет пустую строку если вкинуть innerValue без всей инфы)
+        else setInnerValue(getSelectedItemLabel(innerValue));
+      } // ? Кейс для строчных значений
+
+
+      if (!isObject) {
+        // ? Вызываем верхний onChange если innerValue есть или если нету, но это не после логики уточнения
+        if (innerValue || !isLoading) onChange(innerValue); // ? Если innerValue есть и еще не открыт листинг - открываем
+
+        if (innerValue && !isListVisible) setIsListVisible(true); // ? Если инпут сфокусирован и значение есть - запрашиваем список вариантов
+
+        if (isFocused && !!innerValue) getAddressVariantsList();
+      }
     }
-  }, [query]);
+  }, [innerValue]);
   (0, _react.useEffect)(function () {
     if (!isFocused && !isMobile) {
       setIsListVisible(false);
@@ -338,29 +431,27 @@ var InputAddress = function InputAddress(_ref) {
     }
 
     if (isMobile && isListVisible) {
-      setTempQuery(query);
+      setTempInnerValue(innerValue);
       setListHeight();
     }
   }, [isListVisible]);
   (0, _react.useEffect)(function () {
-    if (JSON.stringify(preparedValue) !== JSON.stringify(query) || !isValueInited) {
-      setTimeout(function () {
-        setQuery(preparedValue);
-        setIsValueInited(true);
-      }, 1);
-    }
-  }, [preparedValue]);
+    // ? учет изменения value сверху (верхние переназначения велью)
+    if (!compareValues(value, innerValue)) setInnerValue(value); // ? useEffect должен быть последним, т.к. рефка меняется в рамках текущей итерации
+
+    previousValueRef.current = value;
+  }, [value]);
 
   var renderSearchableInput = function renderSearchableInput() {
-    var value = getSelectedItemLabel();
+    var inputValue = getSelectedItemLabel();
     return /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _classnames.default)('input-address__input-wrapper')
     }, /*#__PURE__*/_react.default.createElement(_Input.default, {
       ref: inputRef,
       testId: "inputAddress--input--key-".concat(testId || fieldKey),
       className: (0, _classnames.default)('input-address__input', className),
-      value: value,
-      onChange: onChangeInternal,
+      value: inputValue,
+      onChange: setInnerValue,
       onFocus: function onFocus(e) {
         setIsFocused(true);
       },
@@ -388,14 +479,14 @@ var InputAddress = function InputAddress(_ref) {
   };
 
   var renderInput = function renderInput() {
-    var value = getSelectedItemLabel(isListVisible ? tempQuery : query);
+    var inputValue = getSelectedItemLabel(isListVisible ? tempInnerValue : innerValue);
     return /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _classnames.default)('input-address__input-wrapper')
     }, /*#__PURE__*/_react.default.createElement(_Input.default, {
       testId: "inputAddress--input--key-".concat(testId || fieldKey),
       className: (0, _classnames.default)('input-address__input', className),
-      value: value,
-      onChange: onChangeInternal,
+      value: inputValue,
+      onChange: setInnerValue,
       onFocus: function onFocus(e) {
         var _e$target;
 
@@ -424,7 +515,7 @@ var InputAddress = function InputAddress(_ref) {
           'input-address__list--item-hightlighted': i === hightlightedIndex
         }),
         onMouseDown: function onMouseDown(e) {
-          return setQueryAsItem(e, item);
+          return setItemAsInnerValue(e, item);
         }
       }, getListItemLabel(item));
     };
@@ -434,7 +525,7 @@ var InputAddress = function InputAddress(_ref) {
         key: "input-address__list-item--custom",
         className: (0, _classnames.default)('input-address__list--item', 'input-address__list--item-custom'),
         onMouseDown: function onMouseDown(e) {
-          return setQueryAsItem(e, getSelectedItemLabel());
+          return setItemAsInnerValue(e, getSelectedItemLabel());
         }
       }, getSelectedItemLabel(), /*#__PURE__*/_react.default.createElement(_reactFeather.AlertTriangle, null), /*#__PURE__*/_react.default.createElement("span", null, "Choose this only if your address is not listed below"));
     };
@@ -442,7 +533,7 @@ var InputAddress = function InputAddress(_ref) {
     var renderNoItems = function renderNoItems() {
       return /*#__PURE__*/_react.default.createElement("div", {
         className: "input-address__list--no-items"
-      }, isMobile && !(query !== null && query !== void 0 && query.length) ? 'Please begin entering your address' : noItemsMessage || 'No Items');
+      }, isMobile && !(innerValue !== null && innerValue !== void 0 && innerValue.length) ? 'Please begin entering your address' : noItemsMessage || 'No Items');
     };
 
     var renderListDesktop = function renderListDesktop() {
@@ -452,7 +543,7 @@ var InputAddress = function InputAddress(_ref) {
       }, /*#__PURE__*/_react.default.createElement("div", {
         className: "input-address__list",
         ref: listRef
-      }, isLoading ? renderLoader() : listItems !== null && listItems !== void 0 && listItems.length ? listItems === null || listItems === void 0 ? void 0 : listItems.map(renderListItem) : renderNoItems()));
+      }, isListLoading ? renderLoader() : listItems !== null && listItems !== void 0 && listItems.length ? listItems === null || listItems === void 0 ? void 0 : listItems.map(renderListItem) : renderNoItems()));
     };
 
     var renderListMobile = function renderListMobile() {
@@ -486,7 +577,7 @@ var InputAddress = function InputAddress(_ref) {
       }, renderSearchableInput())), /*#__PURE__*/_react.default.createElement("div", {
         className: "input-address__list",
         ref: listRef
-      }, isLoading ? renderLoader() : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, getSelectedItemLabel() && renderListItemCustom(), listItems === null || listItems === void 0 ? void 0 : listItems.map(renderListItem), !(listItems !== null && listItems !== void 0 && listItems.length) && !getSelectedItemLabel() && renderNoItems()))));
+      }, isListLoading ? renderLoader() : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, getSelectedItemLabel() && renderListItemCustom(), listItems === null || listItems === void 0 ? void 0 : listItems.map(renderListItem), !(listItems !== null && listItems !== void 0 && listItems.length) && !getSelectedItemLabel() && renderNoItems()))));
     };
 
     return isMobile ? renderListMobile() : renderListDesktop();
@@ -496,7 +587,9 @@ var InputAddress = function InputAddress(_ref) {
     className: (0, _classnames.default)('input-address', {
       'input-address--error': error || isWrongAddress && !isFocused
     })
-  }, isMobile ? renderInput() : renderSearchableInput(), isListVisible && renderList());
+  }, isLoading && /*#__PURE__*/_react.default.createElement(_Spinner.default, {
+    size: "small"
+  }), isMobile ? renderInput() : renderSearchableInput(), isListVisible && renderList());
 };
 
 var _default = InputAddress;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intelicoreact",
-  "version": "1.3.5",
+  "version": "1.3.7",
   "description": "",
   "main": "dist/index.js",
   "files": [