@vitrosoftware/common-ui-ts 1.1.158 → 1.1.159

package/css/std/controls/command-menu/command-menu-dropdown-button.css

@@ -31,7 +31,7 @@
     border-radius: 4px;
     border: none !important;
     outline: none;
-    width: 241px;
+    min-width: 241px;
     font-size: 14px;
     padding: 0px;
     font-weight: 400;
@@ -81,7 +81,6 @@
     display: flex;
     align-items: center;
     min-height: 37px;
-    white-space: normal;
     padding: 8px 12px;
     border: none;
     box-shadow: none;
@@ -107,6 +106,8 @@
     font-size: 14px;
     line-height: 21px;
     color: #222D44;
+    overflow: hidden;
+    text-overflow: ellipsis;
 }
 
 .vitro-dropdown-button-container :global(.nav-link) {

package/css/std/controls/criterion/criterion.css

@@ -120,7 +120,7 @@
     position: absolute;
     top: -10px;
     left: 0;
-    z-index: 10000;
+    z-index: 1;
     background: #fff;
 }
 
@@ -153,7 +153,7 @@
 
 .vitro-condition-list-container,
 .vitro-operator-list-container {
-    z-index: 1000000;
+    z-index: 400;
 }
 
 .vitro-condition-list-container {

package/css/std/controls/editable-list/editable-list.css

@@ -16,6 +16,7 @@
 }
 
 .vitro-editable-item {
+    width: 100%;
     min-height: 32px;
     padding: 0px 4px 0 28px;
 }
@@ -25,6 +26,7 @@
     border: none;
     outline: none;
     background: transparent;
+    padding: 0;
 }
 
 .vitro-active {
@@ -41,4 +43,8 @@
 
 .vitro-dropdown-button :global(.dropdown-menu::before) {
     left: 18px;
+}
+
+.vitro-display-none {
+    display: none;
 }

package/css/std/controls/sidebar/sidebar.css

@@ -77,6 +77,7 @@
     height: 66px;
     padding: 0 0 0 12px !important;
     background: #fff;
+    left: 0;
     bottom: 0;
     top: initial;
     box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);

package/dist/index.css

@@ -4665,7 +4665,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     border-radius: 4px;
     border: none !important;
     outline: none;
-    width: 241px;
+    min-width: 241px;
     font-size: 14px;
     padding: 0px;
     font-weight: 400;
@@ -4715,7 +4715,6 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     display: flex;
     align-items: center;
     min-height: 37px;
-    white-space: normal;
     padding: 8px 12px;
     border: none;
     box-shadow: none;
@@ -4741,6 +4740,8 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     font-size: 14px;
     line-height: 21px;
     color: #222D44;
+    overflow: hidden;
+    text-overflow: ellipsis;
 }
 
 ._command-menu-dropdown-button_vitro-dropdown-button-container_29qd-_O .nav-link {
@@ -5222,6 +5223,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     height: 66px;
     padding: 0 0 0 12px !important;
     background: #fff;
+    left: 0;
     bottom: 0;
     top: initial;
     box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
@@ -6429,7 +6431,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     position: absolute;
     top: -10px;
     left: 0;
-    z-index: 10000;
+    z-index: 1;
     background: #fff;
 }
 
@@ -6462,7 +6464,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
 
 ._criterion_vitro-condition-list-container_ERfumwB,
 ._criterion_vitro-operator-list-container_RgT0R_Z {
-    z-index: 1000000;
+    z-index: 400;
 }
 
 ._criterion_vitro-condition-list-container_ERfumwB {
@@ -8173,6 +8175,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
 }
 
 ._editable-list_vitro-editable-item_cWSWi1n {
+    width: 100%;
     min-height: 32px;
     padding: 0px 4px 0 28px;
 }
@@ -8182,6 +8185,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     border: none;
     outline: none;
     background: transparent;
+    padding: 0;
 }
 
 ._editable-list_vitro-active_39PUrSM {
@@ -8198,6 +8202,10 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
 
 ._editable-list_vitro-dropdown-button_vPtNQxA .dropdown-menu::before {
     left: 18px;
+}
+
+._editable-list_vitro-display-none_1nqU_hD {
+    display: none;
 }
 ._reorderable-list_vitro-reorderable-list_3Vinbji {
     display: flex;

package/dist/index.js

@@ -63298,7 +63298,7 @@ var Viewer = function Viewer(props) {
 };
 
 var name = "@vitrosoftware/common-ui-ts";
-var version$1 = "1.1.158";
+var version$1 = "1.1.159";
 var description = "vitro software common ui ts";
 var author = "";
 var license = "MIT";
@@ -66587,6 +66587,7 @@ var Overlay$2 = React.forwardRef(function (props, ref) {
       _setStyle(props.style);
     }
   }, [props.style]);
+  var className = [props.className || CTRL.EMPTY, props.isShowArrow ? styles$1c[CSS_CLASS_DROPDOWN_ARROW] : CTRL.EMPTY].join(CTRL.SPACE);
   return React__default.createElement(Overlay$1, {
     show: props.isShow,
     target: target,
@@ -66594,7 +66595,7 @@ var Overlay$2 = React.forwardRef(function (props, ref) {
     placement: props.placement || exports.PLACEMENT.AUTO,
     flip: props.isFlip ? true : false
   }, React__default.createElement("div", {
-    className: props.className + CTRL.SPACE + styles$1c[CSS_CLASS_DROPDOWN_ARROW],
+    className: className,
     style: style
   }, props.children));
 });
@@ -66741,8 +66742,8 @@ var Criterion = function Criterion(props) {
       props.onChange(val, componentProps.name);
     }
   };
-  var onControlChange = function onControlChange(val, name) {
-    value.valueList = Array.isArray(val) ? val : [val];
+  var onControlChange = function onControlChange(val) {
+    value.valueList = val !== null && val !== undefined ? Array.isArray(val) ? val : [val] : [];
     onChange(value);
   };
   return React__default.createElement(FlexBox, {
@@ -67629,8 +67630,20 @@ var Search = function Search(props) {
       var selectedFieldList = getSelectedFieldList(list);
       setFilterFieldList(selectedFieldList);
       setCheckboxFieldList(getCheckboxFieldList(selectedFieldList));
+    } else {
+      reset();
     }
   }, [props.searchCriterionList]);
+  var reset = function reset() {
+    setSearchCriterionList([]);
+    setSelectedSearchCriterionList([]);
+    var selectedFieldList = getSelectedFieldList([]);
+    setFilterFieldList(selectedFieldList);
+    setCheckboxFieldList(selectedFieldList);
+    setIsShowAddFieldDialog(false);
+    setIsShowDialog(false);
+    setState(CTRL.EMPTY);
+  };
   var onSettingsClick = function onSettingsClick() {
     setIsShowDialog(!isShowDialog);
   };
@@ -83503,7 +83516,7 @@ var Switch = function Switch(props) {
   }));
 };
 
-var styles$1L = {"vitro-editable-list":"_editable-list_vitro-editable-list_2y8aXbO","vitro-header":"_editable-list_vitro-header_3ilVZhe","vitro-create-button":"_editable-list_vitro-create-button_3E1aQDB","vitro-editable-item":"_editable-list_vitro-editable-item_cWSWi1n","vitro-active":"_editable-list_vitro-active_39PUrSM","vitro-button-container":"_editable-list_vitro-button-container_1okfn08","vitro-dropdown-button":"_editable-list_vitro-dropdown-button_vPtNQxA"};
+var styles$1L = {"vitro-editable-list":"_editable-list_vitro-editable-list_2y8aXbO","vitro-header":"_editable-list_vitro-header_3ilVZhe","vitro-create-button":"_editable-list_vitro-create-button_3E1aQDB","vitro-editable-item":"_editable-list_vitro-editable-item_cWSWi1n","vitro-active":"_editable-list_vitro-active_39PUrSM","vitro-button-container":"_editable-list_vitro-button-container_1okfn08","vitro-dropdown-button":"_editable-list_vitro-dropdown-button_vPtNQxA","vitro-display-none":"_editable-list_vitro-display-none_1nqU_hD"};
 
 var EditableItem = function EditableItem(props) {
   var _useState = React.useState(props.text),
@@ -83512,12 +83525,21 @@ var EditableItem = function EditableItem(props) {
   var _useState2 = React.useState(false),
     isHover = _useState2[0],
     setIsHover = _useState2[1];
+  var _useState3 = React.useState(null),
+    dropdownItemList = _useState3[0],
+    setDropdownItemList = _useState3[1];
   React.useEffect(function () {
     setText(props.text);
   }, [props.text]);
   React.useEffect(function () {
-    setIsHover(props.isActive);
-  }, [props.isActive]);
+    if (props.dropdownItemList) {
+      setDropdownItemList(props.dropdownItemList);
+    } else if (props.getDropdownItemList) {
+      props.getDropdownItemList(props.id).then(function (itemList) {
+        setDropdownItemList(itemList);
+      });
+    }
+  }, [props.dropdownItemList]);
   var onChange = function onChange(e) {
     setText(e.target.value);
     props.onChange(e.target.value);
@@ -83536,7 +83558,7 @@ var EditableItem = function EditableItem(props) {
       return setIsHover(true);
     },
     onMouseLeave: function onMouseLeave() {
-      return setIsHover(props.isActive);
+      return setIsHover(false);
     },
     className: styles$1L['vitro-editable-item'] + (props.isActive ? CTRL.SPACE + styles$1L['vitro-active'] : CTRL.EMPTY)
   }, props.isEditMode ? React__default.createElement("input", {
@@ -83545,15 +83567,17 @@ var EditableItem = function EditableItem(props) {
     onBlur: onBlur,
     autoFocus: true
   }) : React__default.createElement(Label, {
-    text: props.text
+    text: props.text || text
   }), React__default.createElement("div", {
     className: styles$1L['vitro-button-container']
-  }, isHover && props.dropdownItemList ? React__default.createElement(DropdownButton, {
-    itemList: props.dropdownItemList,
+  }, dropdownItemList && dropdownItemList.length ? React__default.createElement(DropdownButton, {
+    itemList: dropdownItemList,
     onToggle: onToggleDropdownButton,
     isShow: props.isDropdownActive,
-    className: styles$1L['vitro-dropdown-button']
-  }) : props.button));
+    className: styles$1L['vitro-dropdown-button'] + (props.isActive || isHover ? CTRL.EMPTY : CTRL.SPACE + styles$1L['vitro-display-none'])
+  }) : null, props.button && React__default.createElement(FlexBox, {
+    className: (props.isActive || isHover) && dropdownItemList ? styles$1L['vitro-display-none'] : CTRL.EMPTY
+  }, props.button)));
 };
 
 var EditableList = function EditableList(props) {
@@ -83586,14 +83610,17 @@ var EditableList = function EditableList(props) {
     }
   }, [props.newItem]);
   React.useEffect(function () {
-    changedFieldValueMap.clear();
-    setActiveItem(props.activeItemId);
+    if (props.activeItemId !== activeItem) {
+      changedFieldValueMap.clear();
+      setActiveItem(props.activeItemId);
+    }
   }, [props.activeItemId]);
   React.useEffect(function () {
     changedFieldValueMap.clear();
   }, [props.itemList]);
   var onClick = function onClick(item) {
     setActiveItem(item.id);
+    changedFieldValueMap.clear();
     if (item.id !== editedItem && item.id !== activeItem) {
       setEditedItem(null);
       if (props.onClick) {
@@ -83657,7 +83684,8 @@ var EditableList = function EditableList(props) {
         isActive: activeItem === item.id,
         isEditMode: editedItem === item.id,
         isDropdownActive: activeDropdownItemId === item.id,
-        button: props.getItemButton ? props.getItemButton(item) : null
+        button: props.getItemButton ? props.getItemButton(item) : null,
+        getDropdownItemList: props.getDropdownItemList
       }));
     },
     onClick: onClick
@@ -83668,8 +83696,8 @@ var EditableList = function EditableList(props) {
     onBlur: function onBlur(value) {
       return props.newItem && _onBlur(props.newItem, value);
     },
-    isActive: true,
-    isEditMode: true
+    isActive: props.isActiveNewItem === false ? false : true,
+    isEditMode: props.isActiveNewItem === false ? false : true
   })));
 };