homeflowjs 1.0.52 → 1.0.54

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "homeflowjs",
-  "version": "1.0.52",
+  "version": "1.0.54",
   "sideEffects": [
     "modal/**/*",
     "user/default-profile/**/*",
@@ -10,7 +10,8 @@
     "properties/property-streetview/**/*",
     "properties/stamp-duty-calculator/**/*",
     "search/range-controller/**/*",
-    "properties/property-results-pagination/**/*"
+    "properties/property-results-pagination/**/*",
+    "shared/loading-icon/**/*"
   ],
   "description": "JavaScript toolkit for Homeflow themes",
   "main": "index.js",

package/search/address-lookup-input/address-lookup-input.component.jsx

@@ -18,6 +18,8 @@ const AddressLookupInput = ({
   required,
   setSelectedAddress,
   iconStokeInherit,
+  errorMessage,
+  onClear,
 }) => {
   const [locationQuery, setLocationQuery] = useState('');
   const [suggestions, setSuggestions] = useState([]);
@@ -35,7 +37,7 @@ const AddressLookupInput = ({
         if (json.suggestions.length === 0) {
           setAddress({
             value: address.value,
-            error: 'Sorry we couldn\'t find that address',
+            error: errorMessage,
           });
         }
         if (json.suggestions.length !== 0) {
@@ -82,6 +84,9 @@ const AddressLookupInput = ({
       value: {},
       error: null,
     });
+    if (onClear) {
+      onClear();
+    }
   };
 
   // If there is an error remove suggestions
@@ -194,6 +199,8 @@ AddressLookupInput.propTypes = {
   className: PropTypes.string,
   setSelectedAddress: PropTypes.func,
   iconStokeInherit: PropTypes.bool,
+  errorMessage: PropTypes.node,
+  onClear: PropTypes.func,
 };
 
 AddressLookupInput.defaultProps = {
@@ -204,6 +211,8 @@ AddressLookupInput.defaultProps = {
   className: '',
   setSelectedAddress: null,
   iconStokeInherit: true,
+  errorMessage: <span className="input__error">Sorry we couldn't find that address</span>,
+  onClear: null,
 };
 
 export default AddressLookupInput;

package/search/address-lookup-input/clear-button.component.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import SearchIcon from '../../shared/search-icon.component';
 import CloseIcon from '../../shared/close-icon.component';
-import LoadingIcon from '../../shared/loading-icon.component';
+import LoadingIcon from '../../shared/loading-icon/loading-icon.component';
 
 const ClearButton = ({ address, loading, onClear, iconStokeInherit }) => (
   <button

package/search/address-lookup-input/input.jsx

@@ -44,9 +44,7 @@ const Input = ({
       />
       <ClearButton address={address} loading={loading} onClear={onClear} iconStokeInherit={iconStokeInherit} />
     </div>
-    {address?.error && typeof (address.error) === 'string' && (
-      <span className="input__error">{address.error}</span>
-    )}
+    {address?.error && address.error}
   </div>
 );
 

package/shared/{loading-icon.component.jsx → loading-icon/loading-icon.component.jsx}

@@ -1,5 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import './loading-icon.styles.scss';
 
 const LoadingIcon = ({inherit}) => (
   <svg role="img" className="loading-icon" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">

package/shared/loading-icon/loading-icon.styles.scss

@@ -0,0 +1,13 @@
+@keyframes spin-loading-icon {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.loading-icon {
+  transform-origin: center;
+  animation: spin-loading-icon 1s linear infinite;
+}