intelicoreact 1.1.39 → 1.1.41

package/dist/Atomic/UI/Hint/Hint.js

@@ -43,7 +43,8 @@ var Hint = function Hint(_ref) {
       onClickCallback = _ref.onClickCallback,
       key = _ref.key,
       id = _ref.id,
-      children = _ref.children;
+      children = _ref.children,
+      icon = _ref.icon;
   var hintId = (_ref2 = key !== null && key !== void 0 ? key : id) !== null && _ref2 !== void 0 ? _ref2 : time;
 
   var _useState = (0, _react.useState)(false),
@@ -140,7 +141,7 @@ var Hint = function Hint(_ref) {
     className: (0, _classnames.default)('hint__button', {
       hint__button_active: isOpen
     })
-  }, variant === 'outlined' && /*#__PURE__*/_react.default.createElement(_reactFeather.HelpCircle, {
+  }, icon || /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, variant === 'outlined' && /*#__PURE__*/_react.default.createElement(_reactFeather.HelpCircle, {
     width: 16,
     height: 16,
     className: "hint__icon outlined"
@@ -171,7 +172,7 @@ var Hint = function Hint(_ref) {
     color: '#F06D8D',
     width: 16,
     height: 16
-  }), label && /*#__PURE__*/_react.default.createElement("span", {
+  })), label && /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _classnames.default)('hint__label', {
       'color--primary': isOpen
     })

package/dist/Molecular/InputAddress/InputAddress.js

@@ -19,6 +19,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _Input = _interopRequireDefault(require("../../Atomic/FormElements/Input/Input"));
 
+var _Hint = _interopRequireDefault(require("../../Atomic/UI/Hint/Hint"));
+
 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); }
@@ -99,6 +101,16 @@ var InputAddress = function InputAddress(_ref) {
       isListVisible = _useState18[0],
       setIsListVisible = _useState18[1];
 
+  var isWrongAddress = (0, _react.useMemo)(function () {
+    var _query$street;
+
+    if (query === '') return false;
+    if (!isSelectedFromList) return true;
+    if (!(query !== null && query !== void 0 && query.hasOwnProperty('streetNumber')) || !(query !== null && query !== void 0 && query.streetNumber)) return true;
+    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;
+    return false;
+  }, [query]);
+
   var setQueryAsItem = function setQueryAsItem(e, item) {
     if (e) e === null || e === void 0 ? void 0 : e.stopPropagation();
     setIsSelectedFromList(true);
@@ -211,7 +223,6 @@ var InputAddress = function InputAddress(_ref) {
 
   var onBlur = function onBlur() {
     if (typeof query === 'string' && !isSelectedFromList) {
-      setQuery('');
       onChange('');
       setInternalError(true);
     }
@@ -246,9 +257,9 @@ var InputAddress = function InputAddress(_ref) {
   }, [value]);
 
   var renderInput = function renderInput() {
-    var _query$street;
+    var _query$street2;
 
-    var value = typeof query === "string" ? query : "".concat((query === null || query === void 0 ? void 0 : query.streetNumber) || '', " ").concat((query === null || query === void 0 ? void 0 : (_query$street = query.street) === null || _query$street === void 0 ? void 0 : _query$street.fullName) || '');
+    var value = typeof query === "string" ? query : "".concat((query === null || query === void 0 ? void 0 : query.streetNumber) || '', " ").concat((query === null || query === void 0 ? void 0 : (_query$street2 = query.street) === null || _query$street2 === void 0 ? void 0 : _query$street2.fullName) || '');
     return /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _classnames.default)('input-address__input-wrapper')
     }, /*#__PURE__*/_react.default.createElement(_Input.default, {
@@ -260,13 +271,22 @@ var InputAddress = function InputAddress(_ref) {
       onFocus: onFocus,
       onBlur: onBlur,
       onKeyDown: onKeyDown
-    }), isClearable && /*#__PURE__*/_react.default.createElement("div", {
+    }), isWrongAddress && /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _classnames.default)('input-address__alert', {
+        'input-address__alert--visible': !isFocused
+      })
+    }, /*#__PURE__*/_react.default.createElement(_Hint.default, {
+      side: "left",
+      hint: "Select the correct address from the list of suggestions (must contains house number and street name)",
+      icon: /*#__PURE__*/_react.default.createElement(_reactFeather.AlertTriangle, null),
+      handleOpenType: "hover"
+    })), isClearable && (isWrongAddress && !isFocused ? null : /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _classnames.default)('input-address__clear-query', {
         'input-address__clear-query--input-focused': isFocused
       })
     }, /*#__PURE__*/_react.default.createElement(_reactFeather.X, {
       onClick: onClearClick
-    })));
+    }))));
   };
 
   var renderLoader = function renderLoader() {
@@ -279,6 +299,7 @@ var InputAddress = function InputAddress(_ref) {
     var renderListItem = function renderListItem(item, i) {
       var fullPrediction = item.fullPrediction;
       return /*#__PURE__*/_react.default.createElement("div", {
+        key: "input-address__list-item".concat(i),
         className: (0, _classnames.default)('input-address__list--item', {
           'input-address__list--item-hightlighted': i === hightlightedIndex
         }),
@@ -302,7 +323,7 @@ var InputAddress = function InputAddress(_ref) {
 
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)('input-address', {
-      'input-address--error': error || internalError
+      'input-address--error': error || internalError || isWrongAddress && !isFocused
     })
   }, renderInput(), isListVisible && renderList());
 };

package/dist/Molecular/InputAddress/InputAddress.scss

@@ -16,6 +16,26 @@
     cursor: pointer;
   }
 
+  &__alert {
+    visibility: hidden;
+    position: absolute;
+    display: flex;
+    top: 50%;
+    right: 8px;
+    transform: translateY(-50%);
+    cursor: pointer;
+
+    &--visible {
+      visibility: visible;
+    }
+
+    svg {
+      height: 16px;
+      width: 16px;
+      color: #FA564C;
+    }
+  }
+
   &__input-wrapper:hover &__clear-query,
   &__clear-query--input-focused {
     visibility: visible;

package/package.json

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