@vitrosoftware/common-ui-ts 1.1.238 → 1.1.240

package/css/std/controls/bim-viewer/comparison-popup.css

@@ -46,6 +46,10 @@
     border-bottom: 2px solid #FE001B;
     margin-left: 4px;
 }
+.comparison-popup-head-item.changed {
+    border-bottom: 2px solid #FFE100;
+    margin-left: 4px;
+}
 
 .comparison-popup-body .uk-switcher {
     height: calc(100% - 53px);
@@ -83,6 +87,10 @@
     border-left: 2px solid #FE001B;
 }
 
+.comparison-popup-body .item-changed {
+    border-left: 2px solid #FFE100;
+}
+
 .ui-dialog.ui-dialog-comparison .ui-dialog-titlebar-buttonpane>a {
     margin-right: 2px !important;
 }
@@ -90,3 +98,77 @@
 .ui-dialog.ui-dialog-comparison .ui-dialog-titlebar-buttonpane>a:last-child {
     margin-right: 0;
 }
+
+
+
+
+.property-comparison-popup-wrap {
+    font-family: Arial, sans-serif;
+    padding: 15px;
+}
+
+.property-groups-container {
+    padding: 5px;
+    overflow-y: auto;
+    max-height: calc(100vh - 100px);
+}
+
+.property-group {
+    margin-bottom: 20px;
+    border: 1px solid #e0e0e0;
+    border-radius: 4px;
+    overflow: hidden;
+}
+
+.group-header {
+    padding: 10px 15px;
+    background: #f5f5f5;
+    font-weight: bold;
+    font-size: 15px;
+}
+
+.properties-list {
+    padding: 10px;
+}
+
+.property-item {
+    margin-bottom: 12px;
+    padding-bottom: 12px;
+    border-bottom: 1px solid #eee;
+}
+
+    .property-item:last-child {
+        border-bottom: none;
+        margin-bottom: 0;
+        padding-bottom: 0;
+    }
+
+.property-name {
+    font-weight: bold;
+    margin-bottom: 5px;
+    font-size: 14px;
+}
+
+.property-value {
+    display: flex;
+    margin: 3px 0;
+    font-size: 13px;
+}
+
+.model-name {
+    font-weight: bold;
+    min-width: 200px;
+    color: #555;
+}
+
+.model-a .model-name {
+    color: #d32f2f;
+}
+
+.model-b .model-name {
+    color: #388e3c;
+}
+
+.value {
+    margin-left: 10px;
+}

package/css/std/controls/bim-viewer/img/collapse-bottom-black.svg

@@ -0,0 +1 @@
+<svg viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M13 6L8 11L3 6' stroke='#222D44' stroke-linecap='round' stroke-linejoin='round'/></svg>

package/css/std/controls/bim-viewer/img/download-grey.svg

@@ -0,0 +1,3 @@
+<svg width="33" height="32" viewBox="0 0 33 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.4997 29.3327V17.3327M16.4997 17.3327L21.1663 21.9993M16.4997 17.3327L11.833 21.9993M27.1663 23.4753C29.1583 22.6953 31.1663 20.918 31.1663 17.3327C31.1663 11.9993 26.7223 10.666 24.4997 10.666C24.4997 7.99935 24.4997 2.66602 16.4997 2.66602C8.49967 2.66602 8.49967 7.99935 8.49967 10.666C6.27701 10.666 1.83301 11.9993 1.83301 17.3327C1.83301 20.918 3.84101 22.6953 5.83301 23.4753" stroke="#66B1FF" stroke-width="1.25635" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/bim-viewer/img/download.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19.2727 16.8958C20.6309 16.364 22 15.1523 22 12.708C22 9.072 18.97 8.16299 17.4545 8.16299C17.4545 6.34499 17.4545 2.70898 12 2.70898C6.54545 2.70898 6.54545 6.34499 6.54545 8.16299C5.03 8.16299 2 9.072 2 12.708C2 15.1523 3.36909 16.364 4.72727 16.8958" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12.0081 22L12.0039 13" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M15.1843 19.3164L12.0023 22.4984L8.82031 19.3164" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/bim-viewer/img/separator.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.99516 13.3337L1.66699 10.0029L5.00033 6.66699" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M15.0052 6.66699L18.3333 9.99778L15 13.3337" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M1.66699 10H18.3337" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/bim-viewer/img/splitter-handle-bar-drag.svg

@@ -0,0 +1,6 @@
+<svg viewBox="0 0 6 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Spliter">
+<path id="Rectangle 4359" d="M0 0H4.5C5.32843 0 6 0.671573 6 1.5V28.5C6 29.3284 5.32843 30 4.5 30H0V0Z" fill="#326AD6"/>
+<path id="Polygon 3" d="M1.5 12.911C1.5 12.6251 1.80945 12.4464 2.05701 12.5894L5.12058 14.3581C5.36814 14.501 5.36814 14.8584 5.12058 15.0013L2.05701 16.7701C1.80945 16.913 1.5 16.7343 1.5 16.4485L1.5 12.911Z" fill="white"/>
+</g>
+</svg>

package/css/std/controls/bim-viewer/img/stretch.svg

@@ -0,0 +1,11 @@
+<svg width="9" height="9" viewBox="0 0 9 9" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2832_1940)">
+<line x1="9.35355" y1="0.353553" x2="0.353553" y2="9.35355" stroke="#8E98A3"/>
+<line x1="9.35355" y1="6.35355" x2="6.35355" y2="9.35355" stroke="#8E98A3"/>
+</g>
+<defs>
+<clipPath id="clip0_2832_1940">
+<rect width="9" height="9" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/css/std/controls/bim-viewer/style.css

@@ -15,6 +15,19 @@ body,
 #xeokitCanvas {
     width: 100%;
     height: 100%;
+    left: 0;
+    top: 0;
+    position: absolute;
+}
+
+#xeokitCompareCanvas {
+    display: none;
+    width: 50%;
+    height: 100%;
+    border-left: 2px solid gray;
+    right : 0;
+    top: 0;
+    position: absolute;
 }
 
 body {

package/dist/index.js

@@ -750,15 +750,27 @@ var Breadcrumbs = function Breadcrumbs(props) {
       windowWidth < exports.MOBILE_VIEW.WIDTH ? setIsMobileView(true) : setIsMobileView(false);
     }
   };
+  var isValidEvent = function isValidEvent(e) {
+    var _e$detail;
+    if ((_e$detail = e.detail) !== null && _e$detail !== void 0 && _e$detail.eventScopeId) {
+      var _e$detail2;
+      return ((_e$detail2 = e.detail) === null || _e$detail2 === void 0 ? void 0 : _e$detail2.eventScopeId) === props.eventScopeId;
+    }
+    return true;
+  };
   var updateItemList = function updateItemList(e) {
-    if (props.getItemList) {
-      props.getItemList(e).then(function (list) {
-        setItemList(getItemList(list));
-      });
+    if (isValidEvent(e)) {
+      if (props.getItemList) {
+        props.getItemList(e).then(function (list) {
+          setItemList(getItemList(list));
+        });
+      }
     }
   };
   var resetItemList = function resetItemList(e) {
-    setItemList([]);
+    if (isValidEvent(e)) {
+      setItemList([]);
+    }
   };
   var initItemListMobileView = function initItemListMobileView(itemList) {
     var list = [].concat(itemList);
@@ -66942,7 +66954,7 @@ var Viewer = function Viewer(props) {
 };
 
 var name = "@vitrosoftware/common-ui-ts";
-var version$1 = "1.1.238";
+var version$1 = "1.1.240";
 var description = "vitro software common ui ts";
 var author = "";
 var license = "MIT";
@@ -83468,7 +83480,12 @@ var RouteItem = function RouteItem(props) {
 
 var w$9 = window;
 var ID_FILE_VERSION_SELECT$1 = 'fileVersionSelect';
+var ID_COMPARE_TREE = 'compareTreeContent';
+var EVENT_COMPARE_TREE_ITEM_SLECT = 'vitro.compare.tree.item.select';
+var CSS_CLASS_TEXT = 'vitro-text';
 var Viewer$1 = function Viewer(props) {
+  var compareModelResultRef = React.useRef([]);
+  var isTreeViewInitRef = React.useRef(false);
   React.useEffect(function () {
     if (props.context) {
       init();
@@ -83479,7 +83496,8 @@ var Viewer$1 = function Viewer(props) {
     var initViewer = function initViewer() {
       if (w$9.initBimViewer) {
         var context = _extends({}, props.context, {
-          initIssueList: initIssueList
+          initIssueList: initIssueList,
+          initCompareTreeView: initCompareTreeView
         });
         w$9.initBimViewer(context);
         initFileVersionSelect();
@@ -83509,6 +83527,86 @@ var Viewer$1 = function Viewer(props) {
       container: props.context.container
     }, component), sidebar);
   };
+  function mapServerNodeToJsTree(n) {
+    var total = (n.childAddCount || 0) + (n.childDelCount || 0) + (n.childChangeCount || 0);
+    var countsHtml = total ? "<span class=\"vitro-count-wrap\">\n                 " + (n.childAddCount ? "<span class=\"vitro-count-add\">" + n.childAddCount + "</span>" : '') + "\n                 " + (n.childDelCount ? "<span class=\"vitro-count-del\">" + n.childDelCount + "</span>" : '') + "\n                 " + (n.childChangeCount ? "<span class=\"vitro-count-change\">" + n.childChangeCount + "</span>" : '') + "\n               </span>" : '';
+    var text = "<span class=\"" + CSS_CLASS_TEXT + "\">" + (n.name || n.type || n.uuid) + "</span>" + countsHtml;
+    return {
+      id: n.uuid,
+      text: text,
+      parent: n.parentUUID || '#',
+      children: total > 0,
+      li_attr: {
+        "class": n.changeType ? 'change-type-' + n.changeType : ''
+      },
+      data: {
+        parentUUID: n.parentUUID,
+        changeType: n.changeType || null
+      }
+    };
+  }
+  var getCurrentCompareFilters = function getCurrentCompareFilters() {
+    var changeTypes = [];
+    if (jquery('#btnCompareFilterAdd').hasClass('selected')) changeTypes.push('add');
+    if (jquery('#btnCompareFilterDel').hasClass('selected')) changeTypes.push('del');
+    if (jquery('#btnCompareFilterChange').hasClass('selected')) changeTypes.push('change');
+    var searchTerm = (jquery('#compareSearch').val() || '').trim();
+    return {
+      ChangeTypeList: changeTypes,
+      SearchTerm: searchTerm || '',
+      IsGeometry: null
+    };
+  };
+  var initCompareTreeView = function initCompareTreeView() {
+    var el = document.getElementById(ID_COMPARE_TREE);
+    if (!el) return;
+    if (!isTreeViewInitRef.current) {
+      var config = {
+        core: {
+          check_callback: true,
+          themes: {
+            dots: false
+          },
+          data: function data(node, cb) {
+            var isRoot = node.id === '#';
+            var parentUUID = isRoot ? '-1' : node.id;
+            var baseFilters = getCurrentCompareFilters();
+            var payload = Object.assign({
+              ParentUUID: parentUUID,
+              Skip: 0,
+              Take: 0
+            }, baseFilters);
+            window.viewer.scene.canvas.spinner.processes++;
+            window.BIMModel.CompareChildList(function (list) {
+              var items = (list || []).map(mapServerNodeToJsTree);
+              cb(items);
+              window.viewer.scene.canvas.spinner.processes--;
+            }, function () {
+              cb([]);
+              window.viewer.scene.canvas.spinner.processes--;
+            }, payload, true);
+          }
+        },
+        plugins: ['wholerow']
+      };
+      jquery(el).jstree(config).on('select_node.jstree', function (_e, data) {
+        var _data$node, _data$node$data;
+        if (data !== null && data !== void 0 && (_data$node = data.node) !== null && _data$node !== void 0 && (_data$node$data = _data$node.data) !== null && _data$node$data !== void 0 && _data$node$data.changeType) {
+          var evt = new CustomEvent(EVENT_COMPARE_TREE_ITEM_SLECT, {
+            detail: {
+              itemId: data.node.id
+            }
+          });
+          window.dispatchEvent(evt);
+        } else {
+          jquery(el).jstree(true).open_node(data.node);
+        }
+      });
+      isTreeViewInitRef.current = true;
+    } else {
+      jquery(el).jstree(true).refresh(true);
+    }
+  };
   var initFileVersionSelect = function initFileVersionSelect() {
     var selectContainer = document.getElementById(ID_FILE_VERSION_SELECT$1);
     var select = React__default.createElement(FileVersionSelect, {