@vitrosoftware/common-ui-ts 1.1.164 → 1.1.165

package/css/std/controls/search/search.css

@@ -6,7 +6,7 @@
 }
 
 .vitro-search.vitro-active {
-    width: 376px;
+    width: 100%;
 }
 
 .vitro-settings-dialog {

package/css/std/controls/sidebar/sidebar-item.css

@@ -284,9 +284,9 @@
 }
 
 .vitro-sidebar-group-slideup-panel .vitro-scrollbar > div:first-child {
-    padding: 0 12px 12px 12px !important;
+    padding: 0 16px 12px 16px !important;
     max-height: none !important;
-    height: 100% !important;
+    height: calc(100% - 32px);
 }
 
 .vitro-sidebar-group-slideup-panel .vitro-scrollbar > div:first-child > ul {

package/css/std/controls/tree-view/tree-view.css

@@ -129,10 +129,25 @@
     float: right;
 }
 
+.vitro-tree-view.vitro-arrow-right :global(.vitro-root-node.jstree-closed) > :global(.jstree-ocl),
+.vitro-tree-view.vitro-arrow-right :global(.vitro-root-node.jstree-open) > :global(.jstree-ocl) {
+    display: inline-block;
+}
+
+.vitro-tree-view.vitro-arrow-right :global(.jstree-open) > :global(.jstree-ocl) {
+    transform: rotate(180deg);
+}
+
+.vitro-tree-view.vitro-arrow-right :global(.jstree-closed) > :global(.jstree-ocl) {
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/tree-view/img/collapse-bottom-grey.svg');
+}
+
 .vitro-tree-view.vitro-arrow-right :global(.jstree-container-ul) {
     max-width: 100%;
 }
 
 .vitro-tree-view.vitro-arrow-right :global(.jstree-anchor) {
     width: calc(100% - 24px);
-}
+    overflow: hidden;
+    text-overflow: ellipsis;
+}

package/dist/index.css

@@ -547,13 +547,29 @@ html, body {
     float: right;
 }
 
+._tree-view_vitro-tree-view_3oii-CW._tree-view_vitro-arrow-right_dVxSsID .vitro-root-node.jstree-closed > .jstree-ocl,
+._tree-view_vitro-tree-view_3oii-CW._tree-view_vitro-arrow-right_dVxSsID .vitro-root-node.jstree-open > .jstree-ocl {
+    display: inline-block;
+}
+
+._tree-view_vitro-tree-view_3oii-CW._tree-view_vitro-arrow-right_dVxSsID .jstree-open > .jstree-ocl {
+    transform: rotate(180deg);
+}
+
+._tree-view_vitro-tree-view_3oii-CW._tree-view_vitro-arrow-right_dVxSsID .jstree-closed > .jstree-ocl {
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/tree-view/img/collapse-bottom-grey.svg');
+}
+
 ._tree-view_vitro-tree-view_3oii-CW._tree-view_vitro-arrow-right_dVxSsID .jstree-container-ul {
     max-width: 100%;
 }
 
 ._tree-view_vitro-tree-view_3oii-CW._tree-view_vitro-arrow-right_dVxSsID .jstree-anchor {
     width: calc(100% - 24px);
-}
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
 ._progress_vitro-progress-container_3Dbhbpo {
     width: 100%;
     height: 100%;
@@ -5133,9 +5149,9 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
 }
 
 ._sidebar-item_vitro-sidebar-group-slideup-panel_15tkxuO ._sidebar-item_vitro-scrollbar___xylIx > div:first-child {
-    padding: 0 12px 12px 12px !important;
+    padding: 0 16px 12px 16px !important;
     max-height: none !important;
-    height: 100% !important;
+    height: calc(100% - 32px);
 }
 
 ._sidebar-item_vitro-sidebar-group-slideup-panel_15tkxuO ._sidebar-item_vitro-scrollbar___xylIx > div:first-child > ul {
@@ -6960,7 +6976,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
 }
 
 ._search_vitro-search_QkJksC_._search_vitro-active_1HhQOCR {
-    width: 376px;
+    width: 100%;
 }
 
 ._search_vitro-settings-dialog_1_c5bIg {

package/dist/index.js

@@ -20516,6 +20516,8 @@ var METHOD;
   METHOD["GET_BOTTOM_CHECKED"] = "get_bottom_checked";
   METHOD["IS_CHECKED"] = "is_checked";
   METHOD["IS_UNDETERMINED"] = "is_undetermined";
+  METHOD["CLEAR_STATE"] = "clear_state";
+  METHOD["SET_ICON"] = "set_icon";
 })(METHOD || (METHOD = {}));
 var EVENT;
 (function (EVENT) {
@@ -20525,6 +20527,8 @@ var EVENT;
   EVENT["MODEL"] = "model.jstree";
   EVENT["DBLCLICK"] = "dblclick.jstree";
   EVENT["DROP"] = "drop.vakata.jstree";
+  EVENT["HOVER_NODE"] = "hover_node.jstree";
+  EVENT["DEHOVER_NODE"] = "dehover_node.jstree";
 })(EVENT || (EVENT = {}));
 var NODE_TYPE;
 (function (NODE_TYPE) {
@@ -20734,7 +20738,10 @@ var JsTreeViewContextImpl = /*#__PURE__*/function () {
     return this.jsTree.jstree(METHOD.IS_UNDETERMINED, node);
   };
   _proto.clearState = function clearState() {
-    return this.jsTree.jstree('clear_state');
+    return this.jsTree.jstree(METHOD.CLEAR_STATE);
+  };
+  _proto.setIcon = function setIcon(obj, icon) {
+    this.jsTree.jstree(METHOD.SET_ICON, obj, icon);
   };
   return JsTreeViewContextImpl;
 }();
@@ -20789,7 +20796,29 @@ var TreeView = function TreeView(props) {
         onDrop(e);
       });
     }
+    if (jsTreeTreeView) {
+      jsTreeTreeView.setEventHandler({
+        id: EVENT.HOVER_NODE,
+        process: onHoverNode
+      });
+      jsTreeTreeView.setEventHandler({
+        id: EVENT.DEHOVER_NODE,
+        process: onDehoverNode
+      });
+    }
   }, [jsTreeTreeView]);
+  var onHoverNode = function onHoverNode(treeView, e, obj) {
+    var _obj$node$original;
+    if ((_obj$node$original = obj.node.original) !== null && _obj$node$original !== void 0 && _obj$node$original.imageHoverUrl) {
+      treeView.setIcon(obj.node, obj.node.original.imageHoverUrl);
+    }
+  };
+  var onDehoverNode = function onDehoverNode(treeView, e, obj) {
+    var _obj$node$original2, _obj$node$original3;
+    if (obj.node.icon && (_obj$node$original2 = obj.node.original) !== null && _obj$node$original2 !== void 0 && _obj$node$original2.imageHoverUrl && (_obj$node$original3 = obj.node.original) !== null && _obj$node$original3 !== void 0 && _obj$node$original3.imageUrl) {
+      treeView.setIcon(obj.node, obj.node.original.imageUrl);
+    }
+  };
   var init = function init() {
     config.core.data = getData;
     jquery(jsTreeRef.current).jstree(config);
@@ -22212,8 +22241,8 @@ var renderMicrofrontend = function renderMicrofrontend(rendererName, microFronte
   }
 };
 
-var MicroFrontend = function MicroFrontend(props) {
-  var rootRef = React.useRef(null);
+var MicroFrontend = React.forwardRef(function (props, ref) {
+  var rootRef = ref || React.useRef(null);
   var containerId = props.data && props.data.containerId ? props.data.containerId : props.name;
   var microFrontendState = React.useMemo(function () {
     return new MicroFrontendState();
@@ -22276,7 +22305,7 @@ var MicroFrontend = function MicroFrontend(props) {
     id: containerId,
     ref: rootRef
   });
-};
+});
 
 var EVENT$2;
 (function (EVENT) {
@@ -63488,7 +63517,7 @@ var Viewer = function Viewer(props) {
 };
 
 var name = "@vitrosoftware/common-ui-ts";
-var version$1 = "1.1.164";
+var version$1 = "1.1.165";
 var description = "vitro software common ui ts";
 var author = "";
 var license = "MIT";
@@ -65461,6 +65490,12 @@ var SlideUpPanel = function SlideUpPanel(props) {
     setSwipePosition = _useState3[1];
   var contentRef = React.useRef(null);
   var buttonRef = React.useRef(null);
+  React.useEffect(function () {
+    window.addEventListener(exports.EVENT.CLICK, onClickOutsideSlideUp);
+    return function () {
+      window.removeEventListener(exports.EVENT.CLICK, onClickOutsideSlideUp);
+    };
+  }, []);
   React.useEffect(function () {
     setIsShow(props.isShow);
     if (props.isShow) {
@@ -65476,6 +65511,12 @@ var SlideUpPanel = function SlideUpPanel(props) {
       contentRef.current.style.height = contentRef.current.offsetHeight + UNIT.PX;
     }
   }, [isExpanded]);
+  var onClickOutsideSlideUp = function onClickOutsideSlideUp(e) {
+    var slideUpContent = contentRef.current;
+    if (slideUpContent && slideUpContent.parentNode && e.target === slideUpContent.parentNode) {
+      close();
+    }
+  };
   var onTouchStart = function onTouchStart(e) {
     setSwipePosition(_extends({}, swipePosition, {
       start: e.changedTouches[0].clientY
@@ -67520,6 +67561,7 @@ var SearchInput = function SearchInput(props) {
   };
   var onCancel = function onCancel() {
     resetValue();
+    onBlur();
     props.onCancel();
   };
   var onChange = function onChange(e) {