intelicoreact 1.1.12 → 1.1.14

package/dist/Molecular/InputAddress/InputAddress.js

@@ -21,10 +21,6 @@ var _Input = _interopRequireDefault(require("../../Atomic/FormElements/Input/Inp
 
 require("./InputAddress.scss");
 
-var _utils = require("../../Functions/utils");
-
-var _Spinner = _interopRequireDefault(require("../../Atomic/Layout/Spinner/Spinner"));
-
 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; }
@@ -44,26 +40,29 @@ var InputAddress = function InputAddress(_ref) {
       throttle = _ref$throttle === void 0 ? 300 : _ref$throttle,
       _ref$loader = _ref.loader,
       loader = _ref$loader === void 0 ? '' : _ref$loader,
+      error = _ref.error,
+      _ref$value = _ref.value,
+      value = _ref$value === void 0 ? '' : _ref$value,
       _ref$onChange = _ref.onChange,
       onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
       _ref$getListItems = _ref.getListItems,
       getListItems = _ref$getListItems === void 0 ? function () {} : _ref$getListItems;
   var inputRef = (0, _react.useRef)(null);
 
-  var _useState = (0, _react.useState)(''),
+  var _useState = (0, _react.useState)(false),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      query = _useState2[0],
-      setQuery = _useState2[1];
+      isValueInited = _useState2[0],
+      setIsValueInited = _useState2[1];
 
-  var _useState3 = (0, _react.useState)([]),
+  var _useState3 = (0, _react.useState)(''),
       _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      listItems = _useState4[0],
-      setListItems = _useState4[1];
+      query = _useState4[0],
+      setQuery = _useState4[1];
 
-  var _useState5 = (0, _react.useState)(false),
+  var _useState5 = (0, _react.useState)([]),
       _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      isThrottled = _useState6[0],
-      setIsThrottled = _useState6[1];
+      listItems = _useState6[0],
+      setListItems = _useState6[1];
 
   var _useState7 = (0, _react.useState)(null),
       _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
@@ -91,7 +90,9 @@ var InputAddress = function InputAddress(_ref) {
     if (!(query !== null && query !== void 0 && query.length)) return null;
     clearTimeout(throttleTimeout);
     throttleTimeout = setTimeout(function () {
-      return setListItems(getListItems);
+      var _getListItems;
+
+      return (_getListItems = getListItems(query)) === null || _getListItems === void 0 ? void 0 : _getListItems.then(setListItems);
     }, throttle);
   };
 
@@ -145,7 +146,6 @@ var InputAddress = function InputAddress(_ref) {
       setQueryAsItem(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();
-      return;
     } //up 38
     //down 40
 
@@ -168,6 +168,12 @@ var InputAddress = function InputAddress(_ref) {
   (0, _react.useEffect)(function () {
     if (!isListVisible) setListItems([]);
   }, [isListVisible]);
+  (0, _react.useEffect)(function () {
+    if (value !== query && !isValueInited) {
+      setQuery(value);
+      setIsValueInited(true);
+    }
+  }, [value]);
 
   var renderInput = function renderInput() {
     return /*#__PURE__*/_react.default.createElement("div", {
@@ -188,7 +194,9 @@ var InputAddress = function InputAddress(_ref) {
       },
       onKeyDown: onKeyDown
     }), isClearable && /*#__PURE__*/_react.default.createElement("div", {
-      className: "input-address__clear-query"
+      className: (0, _classnames.default)('input-address__clear-query', {
+        'input-address__clear-query--input-focused': isFocused
+      })
     }, /*#__PURE__*/_react.default.createElement(_reactFeather.X, {
       onClick: onClearClick
     })));
@@ -203,8 +211,8 @@ var InputAddress = function InputAddress(_ref) {
   var renderList = function renderList() {
     var renderListItem = function renderListItem(item, i) {
       return /*#__PURE__*/_react.default.createElement("div", {
-        className: (0, _classnames.default)("input-address__list--item", {
-          "input-address__list--item-hightlighted": i === hightlightedIndex
+        className: (0, _classnames.default)('input-address__list--item', {
+          'input-address__list--item-hightlighted': i === hightlightedIndex
         }),
         onClick: function onClick(e) {
           return setQueryAsItem(e, item);
@@ -218,7 +226,9 @@ var InputAddress = function InputAddress(_ref) {
   };
 
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "input-address"
+    className: (0, _classnames.default)('input-address', {
+      'input-address--error': error
+    })
   }, renderInput(), isListVisible && renderList());
 };
 

package/dist/Molecular/InputAddress/InputAddress.scss

@@ -2,6 +2,10 @@
   position: relative;
   width: 100%;
 
+  &--error .input__wrap {
+    border-color: #FA564C!important;
+  }
+
   &__clear-query {
     visibility: hidden;
     position: absolute;
@@ -12,7 +16,8 @@
     cursor: pointer;
   }
 
-  &__input-wrapper:hover &__clear-query {
+  &__input-wrapper:hover &__clear-query,
+  &__clear-query--input-focused {
     visibility: visible;
   }
 
@@ -21,7 +26,7 @@
     position: absolute;
     margin-top: 8px;
     width: 100%;
-    max-height: 100px;
+    max-height: 40px;
     overflow-y: auto;
     z-index: 999;
 

package/package.json

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