@vitrosoftware/common-ui-ts 1.1.250 → 1.1.251

package/css/std/controls/lookup-picker/lookup-picker-value-list.css

@@ -119,4 +119,8 @@
     top: 0;
     opacity: 0.5;
     cursor: initial;
+}
+
+.vitro-progress-container {
+    height: 88px;
 }

package/dist/index.css

@@ -4474,6 +4474,10 @@ div._component-loader_vitro-component-loader_3J3a2or {
     top: 0;
     opacity: 0.5;
     cursor: initial;
+}
+
+._lookup-picker-value-list_vitro-progress-container_1wyhOOF {
+    height: 88px;
 }
 ._error-message_vitro-error-message_2lHJjgO {
     display: inline-block;

package/dist/index.js

@@ -63570,7 +63570,7 @@ var SelectedValueList = function SelectedValueList(props) {
   }));
 };
 
-var valueListStyles = {"vitro-value-list":"_lookup-picker-value-list_vitro-value-list_LSdCMjq","vitro-item":"_lookup-picker-value-list_vitro-item_7yZBz5u","vitro-item-html-value":"_lookup-picker-value-list_vitro-item-html-value_1yl9tXx","vitro-placeholder-empty":"_lookup-picker-value-list_vitro-placeholder-empty_fTVHWwc","vitro-keyword-highlight":"_lookup-picker-value-list_vitro-keyword-highlight_1uESHan","vitro-display-none":"_lookup-picker-value-list_vitro-display-none_2kDzC6K","vitro-flex":"_lookup-picker-value-list_vitro-flex_2ClzE5b","vitro-button":"_lookup-picker-value-list_vitro-button_3MejXb_","vitro-disabled":"_lookup-picker-value-list_vitro-disabled_11rNtMo"};
+var valueListStyles = {"vitro-value-list":"_lookup-picker-value-list_vitro-value-list_LSdCMjq","vitro-item":"_lookup-picker-value-list_vitro-item_7yZBz5u","vitro-item-html-value":"_lookup-picker-value-list_vitro-item-html-value_1yl9tXx","vitro-placeholder-empty":"_lookup-picker-value-list_vitro-placeholder-empty_fTVHWwc","vitro-keyword-highlight":"_lookup-picker-value-list_vitro-keyword-highlight_1uESHan","vitro-display-none":"_lookup-picker-value-list_vitro-display-none_2kDzC6K","vitro-flex":"_lookup-picker-value-list_vitro-flex_2ClzE5b","vitro-button":"_lookup-picker-value-list_vitro-button_3MejXb_","vitro-disabled":"_lookup-picker-value-list_vitro-disabled_11rNtMo","vitro-progress-container":"_lookup-picker-value-list_vitro-progress-container_1wyhOOF"};
 
 var ValueListItem = function ValueListItem(props) {
   var isDisabled = props.item.isEnabled === false;
@@ -63610,7 +63610,23 @@ var ValueList = function ValueList(props) {
   var _useState2 = React.useState(null),
     style = _useState2[0],
     setStyle = _useState2[1];
+  var _useState3 = React.useState(false),
+    isProgressVisible = _useState3[0],
+    setIsProgressVisible = _useState3[1];
   var reg = new RegExp(props.inputValue.replace(PATTERN, REPLACEMENT), FLAG);
+  React.useEffect(function () {
+    var timer;
+    if (props.isPending) {
+      timer = setTimeout(function () {
+        return setIsProgressVisible(true);
+      }, 400);
+    } else {
+      setIsProgressVisible(false);
+    }
+    return function () {
+      return clearTimeout(timer);
+    };
+  }, [props.isPending]);
   React.useEffect(function () {
     if (scrollableElement && scrollableElement.scrollTop === 0) {
       scrollableElement.scrollTop = 1;
@@ -63666,7 +63682,9 @@ var ValueList = function ValueList(props) {
   }, React__default.createElement(ScrollBar, {
     onInit: setScrollableElement,
     isPreventParentScroll: true
-  }, props.isPending && React__default.createElement(Progress, null), !props.isPending && React__default.createElement(React__default.Fragment, null, props.list.length > 0 ? props.list.sort(sortValueList).map(function (x) {
+  }, isProgressVisible && React__default.createElement(FlexBox, {
+    className: valueListStyles['vitro-progress-container']
+  }, React__default.createElement(Progress, null)), !isProgressVisible && React__default.createElement(React__default.Fragment, null, props.list.length > 0 ? props.list.sort(sortValueList).map(function (x) {
     return React__default.createElement(ValueListItem, {
       item: x,
       onSelect: props.onOptionValueSelect,
@@ -63801,16 +63819,9 @@ var LookupPicker = React.forwardRef(function (props, ref) {
   var isShowTooltipRef = React.useRef(true);
   var scrollBarRef = React.useRef(null);
   var rightButtonGroupRef = React.useRef(null);
-  var updatePending = function updatePending(valueList) {
-    return setPending(valueList ? false : true);
-  };
-  React.useEffect(function () {
-    updatePending(props.valueList);
-  }, []);
   React.useEffect(function () {
     updateFilteredValueList(props.valueList || []);
     setSelectedValueList(createDefaultSelectedValueList);
-    updatePending(props.valueList);
   }, [props.valueList]);
   React.useEffect(function () {
     if (props.selectedValueList && checkIsValueChanged(selectedValueList, props.selectedValueList)) {
@@ -63898,6 +63909,8 @@ var LookupPicker = React.forwardRef(function (props, ref) {
     }
   }, [state]);
   var updateFilteredValueList = function updateFilteredValueList(valueList) {
+    var _inputRef$current;
+    var inputValue = ((_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value) || CTRL.EMPTY;
     var availableValueList = inputValue ? filteredValueList : valueList;
     if (inputValue && inputValue.length >= (props.charCount || 0)) {
       availableValueList = valueList.filter(function (x) {
@@ -63937,6 +63950,8 @@ var LookupPicker = React.forwardRef(function (props, ref) {
     }
   };
   var filterByText = function filterByText(value) {
+    var _inputRef$current2;
+    var inputValue = ((_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.value) || CTRL.EMPTY;
     var isValueContainsInputValue = filterValueTemplate(value).toLowerCase().indexOf(inputValue.toLowerCase()) >= 0;
     var isValueIsNotYetSelected = !selectedValueList.map(function (f) {
       return f.id;
@@ -63996,8 +64011,8 @@ var LookupPicker = React.forwardRef(function (props, ref) {
   };
   var onOptionValueDelete = function onOptionValueDelete(id) {
     if (!props.isDisabled) {
-      var _inputRef$current;
-      (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
+      var _inputRef$current3;
+      (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.focus();
       var newSelectedValueList = id ? selectedValueList.filter(function (x) {
         return x.id !== id;
       }) : [];
@@ -64026,7 +64041,7 @@ var LookupPicker = React.forwardRef(function (props, ref) {
     }
   };
   var onFocus = function onFocus(e) {
-    var _inputRef$current2;
+    var _inputRef$current4;
     if (scrollBarRef.current) {
       scrollBarRef.current.scrollTop = scrollBarRef.current.scrollHeight;
     }
@@ -64037,7 +64052,7 @@ var LookupPicker = React.forwardRef(function (props, ref) {
     isShowTooltipRef.current = false;
     setState(styles$O['vitro-focus']);
     expandValueList();
-    (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.focus();
+    (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.focus();
     if (props.onFocus) {
       props.onFocus(e);
     }
@@ -67265,7 +67280,7 @@ var Viewer = function Viewer(props) {
 };
 
 var name = "@vitrosoftware/common-ui-ts";
-var version$1 = "1.1.250";
+var version$1 = "1.1.251";
 var description = "vitro software common ui ts";
 var author = "";
 var license = "MIT";