@linzjs/lui 17.5.1 → 17.5.4

package/CHANGELOG.md

@@ -1,3 +1,25 @@
+## [17.5.4](https://github.com/linz/lui/compare/v17.5.3...v17.5.4) (2022-06-17)
+
+
+### Bug Fixes
+
+* adding ic_double_arrow_left ic_double_arrow_right ([#697](https://github.com/linz/lui/issues/697)) ([6bc3ff2](https://github.com/linz/lui/commit/6bc3ff259f007a84b3b308635b73c87332a3e9eb))
+
+## [17.5.3](https://github.com/linz/lui/compare/v17.5.2...v17.5.3) (2022-06-13)
+
+
+### Bug Fixes
+
+* **LuiSearchInput:** trigger dataload when focused. ([#695](https://github.com/linz/lui/issues/695)) ([e87b3a9](https://github.com/linz/lui/commit/e87b3a9298a10d1b0bc2441c8e94f520e481167f))
+* Adding balance parcel and vector sequence ([#693](https://github.com/linz/lui/issues/693)) ([c88f18b](https://github.com/linz/lui/commit/c88f18b9d74a806198287f9a3f418880ad7a0df3))
+
+## [17.5.2](https://github.com/linz/lui/compare/v17.5.1...v17.5.2) (2022-06-02)
+
+
+### Bug Fixes
+
+* clear search input after search type changed. ([#692](https://github.com/linz/lui/issues/692)) ([9c4138c](https://github.com/linz/lui/commit/9c4138c335b92788cb8e3420fdcc45a6d3f80658))
+
 ## [17.5.1](https://github.com/linz/lui/compare/v17.5.0...v17.5.1) (2022-06-01)
 
 

package/dist/assets/icons/balance_parcel.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M23 15h-2v2h2v-2Zm0-4h-2v2h2v-2Zm0 8h-2v2c1 0 2-1 2-2ZM15 3h-2v2h2V3Zm8 4h-2v2h2V7Zm-2-4v2h2c0-1-1-2-2-2ZM3 21h8v-6H1v4c0 1.1.9 2 2 2ZM3 7H1v2h2V7Zm12 12h-2v2h2v-2Zm4-16h-2v2h2V3Zm0 16h-2v2h2v-2ZM3 3C2 3 1 4 1 5h2V3Zm0 8H1v2h2v-2Zm8-8H9v2h2V3ZM7 3H5v2h2V3Z" fill="#000"/></svg>

package/dist/assets/icons/double_arrow_left.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M18.29 17.29a.996.996 0 0 0 0-1.41L14.42 12l3.88-3.88a.996.996 0 1 0-1.41-1.41L12.3 11.3a.996.996 0 0 0 0 1.41l4.59 4.59c.38.38 1.01.38 1.4-.01Z M11.7 17.29a.996.996 0 0 0 0-1.41L7.83 12l3.88-3.88a.996.996 0 1 0-1.41-1.41L5.71 11.3a.996.996 0 0 0 0 1.41l4.59 4.59c.38.38 1.01.38 1.4-.01Z"/></svg>

package/dist/assets/icons/double_arrow_right.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M5.7 6.71a.996.996 0 0 0 0 1.41L9.58 12 5.7 15.88a.996.996 0 1 0 1.41 1.41l4.59-4.59a.996.996 0 0 0 0-1.41L7.12 6.71c-.39-.39-1.03-.39-1.42 0Z M12.29 6.71a.996.996 0 0 0 0 1.41L16.17 12l-3.88 3.88a.996.996 0 1 0 1.41 1.41l4.59-4.59a.996.996 0 0 0 0-1.41L13.7 6.7c-.38-.38-1.02-.38-1.41.01Z" fill="#000"/></svg>

package/dist/assets/icons/vector_sequence.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15 21h2v-2h-2v2Zm4 0h2v-2h-2v2ZM7 21h2v-2H7v2Zm4 0h2v-2h-2v2Zm8-4h2v-2h-2v2Zm0-4h2v-2h-2v2ZM3 5v15c0 .55.45 1 1 1s1-.45 1-1V6c0-.55.45-1 1-1h14c.55 0 1-.45 1-1s-.45-1-1-1H5c-1.1 0-2 .9-2 2Zm16 4h2V7h-2v2Z" fill="#000"/></svg>

package/dist/assets/svg-content.tsx

@@ -117,6 +117,12 @@ iconMap['ic_attachment'] = (
   </svg>
 );
 
+iconMap['ic_balance_parcel'] = (
+  <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <path d="M23 15h-2v2h2v-2Zm0-4h-2v2h2v-2Zm0 8h-2v2c1 0 2-1 2-2ZM15 3h-2v2h2V3Zm8 4h-2v2h2V7Zm-2-4v2h2c0-1-1-2-2-2ZM3 21h8v-6H1v4c0 1.1.9 2 2 2ZM3 7H1v2h2V7Zm12 12h-2v2h2v-2Zm4-16h-2v2h2V3Zm0 16h-2v2h2v-2ZM3 3C2 3 1 4 1 5h2V3Zm0 8H1v2h2v-2Zm8-8H9v2h2V3ZM7 3H5v2h2V3Z" />
+  </svg>
+);
+
 iconMap['ic_blocked'] = (
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
     <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2ZM4 12c0-4.42 3.58-8 8-8 1.85 0 3.55.63 4.9 1.69L5.69 16.9A7.902 7.902 0 0 1 4 12Zm8 8c-1.85 0-3.55-.63-4.9-1.69L18.31 7.1A7.902 7.902 0 0 1 20 12c0 4.42-3.58 8-8 8Z" />
@@ -215,6 +221,18 @@ iconMap['ic_delete_solid'] = (
   </svg>
 );
 
+iconMap['ic_double_arrow_left'] = (
+  <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <path d="M18.29 17.29a.996.996 0 0 0 0-1.41L14.42 12l3.88-3.88a.996.996 0 1 0-1.41-1.41L12.3 11.3a.996.996 0 0 0 0 1.41l4.59 4.59c.38.38 1.01.38 1.4-.01Z M11.7 17.29a.996.996 0 0 0 0-1.41L7.83 12l3.88-3.88a.996.996 0 1 0-1.41-1.41L5.71 11.3a.996.996 0 0 0 0 1.41l4.59 4.59c.38.38 1.01.38 1.4-.01Z" />
+  </svg>
+);
+
+iconMap['ic_double_arrow_right'] = (
+  <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <path d="M5.7 6.71a.996.996 0 0 0 0 1.41L9.58 12 5.7 15.88a.996.996 0 1 0 1.41 1.41l4.59-4.59a.996.996 0 0 0 0-1.41L7.12 6.71c-.39-.39-1.03-.39-1.42 0Z M12.29 6.71a.996.996 0 0 0 0 1.41L16.17 12l-3.88 3.88a.996.996 0 1 0 1.41 1.41l4.59-4.59a.996.996 0 0 0 0-1.41L13.7 6.7c-.38-.38-1.02-.38-1.41.01Z" />
+  </svg>
+);
+
 iconMap['ic_drag_handle'] = (
   <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
     <path d="M20 9H4v2h16V9ZM4 15h16v-2H4v2Z" />
@@ -703,6 +721,12 @@ iconMap['ic_upload'] = (
   </svg>
 );
 
+iconMap['ic_vector_sequence'] = (
+  <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <path d="M15 21h2v-2h-2v2Zm4 0h2v-2h-2v2ZM7 21h2v-2H7v2Zm4 0h2v-2h-2v2Zm8-4h2v-2h-2v2Zm0-4h2v-2h-2v2ZM3 5v15c0 .55.45 1 1 1s1-.45 1-1V6c0-.55.45-1 1-1h14c.55 0 1-.45 1-1s-.45-1-1-1H5c-1.1 0-2 .9-2 2Zm16 4h2V7h-2v2Z" />
+  </svg>
+);
+
 iconMap['ic_view'] = (
   <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
     <path d="M12 4C7 4 2.73 7.11 1 11.5 2.73 15.89 7 19 12 19s9.27-3.11 11-7.5C21.27 7.11 17 4 12 4Zm0 12.5c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5Zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3Z" />

package/dist/index.js

@@ -197,6 +197,8 @@ iconMap['ic_attach_file'] = (React__default["default"].createElement("svg", { vi
     React__default["default"].createElement("path", { d: "m19.571 10.586-8.132 8.132a3.999 3.999 0 0 1-5.657 0 3.999 3.999 0 0 1 0-5.657l8.84-8.84a2.501 2.501 0 0 1 3.535 3.536l-7.425 7.425a1.003 1.003 0 0 1-1.414 0 1.003 1.003 0 0 1 0-1.414l6.717-6.718-1.06-1.06-6.718 6.717a2.501 2.501 0 0 0 3.536 3.536l7.425-7.425a3.999 3.999 0 0 0 0-5.657 3.999 3.999 0 0 0-5.657 0L4.72 12a5.497 5.497 0 0 0 0 7.778 5.497 5.497 0 0 0 7.779 0l8.132-8.131-1.06-1.061Z" })));
 iconMap['ic_attachment'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
     React__default["default"].createElement("path", { d: "M2.016 12.023c0-1.531.531-2.836 1.594-3.914C4.673 7.03 5.97 6.492 7.501 6.492h10.5c1.094 0 2.032.398 2.813 1.195.781.797 1.172 1.742 1.172 2.836 0 1.094-.39 2.032-1.172 2.813-.781.781-1.719 1.172-2.813 1.172H9.517a2.472 2.472 0 0 1-1.781-.727c-.5-.485-.75-1.07-.75-1.758 0-.687.25-1.281.75-1.781s1.094-.75 1.781-.75h7.5v2.016H9.423c-.281 0-.422.164-.422.492 0 .328.14.492.422.492h8.578c.531 0 1-.195 1.406-.586.406-.39.609-.852.609-1.383s-.203-1-.609-1.406c-.406-.406-.875-.61-1.406-.61h-10.5c-.969 0-1.797.345-2.484 1.032a3.386 3.386 0 0 0-1.031 2.484c0 .969.344 1.789 1.031 2.46a3.425 3.425 0 0 0 2.484 1.009h9.516v2.016H7.501c-1.531 0-2.828-.531-3.891-1.594-1.063-1.063-1.594-2.36-1.594-3.891Z" })));
+iconMap['ic_balance_parcel'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
+    React__default["default"].createElement("path", { d: "M23 15h-2v2h2v-2Zm0-4h-2v2h2v-2Zm0 8h-2v2c1 0 2-1 2-2ZM15 3h-2v2h2V3Zm8 4h-2v2h2V7Zm-2-4v2h2c0-1-1-2-2-2ZM3 21h8v-6H1v4c0 1.1.9 2 2 2ZM3 7H1v2h2V7Zm12 12h-2v2h2v-2Zm4-16h-2v2h2V3Zm0 16h-2v2h2v-2ZM3 3C2 3 1 4 1 5h2V3Zm0 8H1v2h2v-2Zm8-8H9v2h2V3ZM7 3H5v2h2V3Z" })));
 iconMap['ic_blocked'] = (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
     React__default["default"].createElement("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2ZM4 12c0-4.42 3.58-8 8-8 1.85 0 3.55.63 4.9 1.69L5.69 16.9A7.902 7.902 0 0 1 4 12Zm8 8c-1.85 0-3.55-.63-4.9-1.69L18.31 7.1A7.902 7.902 0 0 1 20 12c0 4.42-3.58 8-8 8Z" })));
 iconMap['ic_border_color'] = (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
@@ -231,6 +233,10 @@ iconMap['ic_delete_outline'] = (React__default["default"].createElement("svg", {
     React__default["default"].createElement("path", { d: "M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V9c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2v10ZM9 9h6c.55 0 1 .45 1 1v8c0 .55-.45 1-1 1H9c-.55 0-1-.45-1-1v-8c0-.55.45-1 1-1Zm6.5-5-.71-.71c-.18-.18-.44-.29-.7-.29H9.91c-.26 0-.52.11-.7.29L8.5 4H6c-.55 0-1 .45-1 1s.45 1 1 1h12c.55 0 1-.45 1-1s-.45-1-1-1h-2.5Z" })));
 iconMap['ic_delete_solid'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
     React__default["default"].createElement("path", { d: "M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12ZM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4Z" })));
+iconMap['ic_double_arrow_left'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
+    React__default["default"].createElement("path", { d: "M18.29 17.29a.996.996 0 0 0 0-1.41L14.42 12l3.88-3.88a.996.996 0 1 0-1.41-1.41L12.3 11.3a.996.996 0 0 0 0 1.41l4.59 4.59c.38.38 1.01.38 1.4-.01Z M11.7 17.29a.996.996 0 0 0 0-1.41L7.83 12l3.88-3.88a.996.996 0 1 0-1.41-1.41L5.71 11.3a.996.996 0 0 0 0 1.41l4.59 4.59c.38.38 1.01.38 1.4-.01Z" })));
+iconMap['ic_double_arrow_right'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
+    React__default["default"].createElement("path", { d: "M5.7 6.71a.996.996 0 0 0 0 1.41L9.58 12 5.7 15.88a.996.996 0 1 0 1.41 1.41l4.59-4.59a.996.996 0 0 0 0-1.41L7.12 6.71c-.39-.39-1.03-.39-1.42 0Z M12.29 6.71a.996.996 0 0 0 0 1.41L16.17 12l-3.88 3.88a.996.996 0 1 0 1.41 1.41l4.59-4.59a.996.996 0 0 0 0-1.41L13.7 6.7c-.38-.38-1.02-.38-1.41.01Z" })));
 iconMap['ic_drag_handle'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
     React__default["default"].createElement("path", { d: "M20 9H4v2h16V9ZM4 15h16v-2H4v2Z" })));
 iconMap['ic_drag_indicator'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
@@ -399,6 +405,8 @@ iconMap['ic_unlink'] = (React__default["default"].createElement("svg", { xmlns:
     React__default["default"].createElement("path", { d: "m14.39 11.065 1.61 1.61v-1.61h-1.61zm2.61-4h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1 0 1.27-.77 2.37-1.87 2.84l1.4 1.4a4.986 4.986 0 0 0 2.37-4.24c0-2.76-2.24-5-5-5zM2 4.335l3.11 3.11A4.991 4.991 0 0 0 2 12.065c0 2.76 2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1 0-1.59 1.21-2.9 2.76-3.07l2.07 2.07H8v2h2.73l2.27 2.27v1.73h1.73l4.01 4.01 1.41-1.41L3.41 2.925 2 4.335z" })));
 iconMap['ic_upload'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
     React__default["default"].createElement("path", { d: "M5 4h14v2H5V4Zm0 10h4v6h6v-6h4l-7-7-7 7Zm8-2v6h-2v-6H9.83L12 9.83 14.17 12H13Z" })));
+iconMap['ic_vector_sequence'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
+    React__default["default"].createElement("path", { d: "M15 21h2v-2h-2v2Zm4 0h2v-2h-2v2ZM7 21h2v-2H7v2Zm4 0h2v-2h-2v2Zm8-4h2v-2h-2v2Zm0-4h2v-2h-2v2ZM3 5v15c0 .55.45 1 1 1s1-.45 1-1V6c0-.55.45-1 1-1h14c.55 0 1-.45 1-1s-.45-1-1-1H5c-1.1 0-2 .9-2 2Zm16 4h2V7h-2v2Z" })));
 iconMap['ic_view'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
     React__default["default"].createElement("path", { d: "M12 4C7 4 2.73 7.11 1 11.5 2.73 15.89 7 19 12 19s9.27-3.11 11-7.5C21.27 7.11 17 4 12 4Zm0 12.5c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5Zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3Z" })));
 iconMap['ic_view_list'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
@@ -55910,6 +55918,10 @@ var LuiSearchInput = function (props) {
     var _e = React.useState(false), isLoading = _e[0], setIsLoading = _e[1];
     var inputRef = React.useRef(null);
     var selectedRef = React.useRef(null);
+    //clear result after search types changed
+    React.useEffect(function () {
+        setResults([]);
+    }, [props.getOptions]);
     function setInputValue(value) {
         setTypedValue(props.inputTransformer ? props.inputTransformer(value) : value);
     }
@@ -56036,8 +56048,9 @@ var LuiSearchInput = function (props) {
     return (React__default["default"].createElement("div", { className: "LuiSearchInput" },
         React__default["default"].createElement("span", { className: "LuiSearchInput-inputWrapper" },
             searchIcon,
-            React__default["default"].createElement("input", { type: "text", className: clsx('LuiSearchInput-input'), ref: inputRef, value: typedValue, placeholder: props.placeholderText, autoFocus: true, "aria-label": "Search", onChange: function (e) { return setInputValue(e.target.value); }, onKeyDown: handleKeyDown, onFocus: function (e) {
+            React__default["default"].createElement("input", { type: "text", className: clsx('LuiSearchInput-input'), ref: inputRef, value: typedValue, placeholder: props.placeholderText, "aria-label": "Search", onChange: function (e) { return setInputValue(e.target.value); }, onKeyDown: handleKeyDown, onFocus: function (e) {
                     e.target.select();
+                    retrieveResults(typedValue);
                     setHaveFocus(true);
                 }, 
                 // This timeout could be a little brittle but allows the menu to stay open long enough to click it
@@ -56048,6 +56061,7 @@ var LuiSearchInput = function (props) {
         props.name &&
             haveFocus &&
             results.length === 0 &&
+            !isLoading &&
             noOptionsMessage(typedValue) && (React__default["default"].createElement(React__default["default"].Fragment, null,
             React__default["default"].createElement("hr", { className: "LuiSearchInput-resultSeparator" }),
             React__default["default"].createElement("div", { "data-testid": "no-result-msg", className: "LuiSearchInput-disclaimer" }, noOptionsMessage(typedValue)))),