@genexus/genexus-ide-ui 0.0.85 → 0.0.86

package/dist/cjs/ch-tree-view-render_2.cjs.entry.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-f9bb1815.js');
+const genexusImplementation = require('./genexus-implementation-664b13f0.js');
 
 const filterWithCase = (stringToFilter, filter, matchCase) => matchCase
   ? stringToFilter.includes(filter)
@@ -23,7 +24,7 @@ const filterDictionary = {
       !item.indeterminate &&
       ((_b = item.checked) !== null && _b !== void 0 ? _b : filterInfo.defaultChecked);
   },
-  "id-list": (item, filterInfo) => filterInfo.filterList.includes(item.id),
+  list: (item, filterInfo) => filterInfo.filterSet.has(item.id),
   metadata: (item, filterInfo) => {
     var _a;
     return filterInfo.filter
@@ -38,78 +39,11 @@ const filterDictionary = {
       !((_b = item.checked) !== null && _b !== void 0 ? _b : filterInfo.defaultChecked);
   }
 };
-
-const URL_REGEX = /url\((["']?)([^\)]*)\)(?:\s+([\d.]+)x)?/i;
-let computedStyle;
-function normalizeUri(uri) {
-  if (uri.startsWith("data:image/svg+xml;utf8,")) {
-    uri = `data:image/svg+xml;base64,${btoa(uri.slice(24).replace(/\\"/g, '"'))}`;
-  }
-  uri = uri.replace(/\\/g, "");
-  uri = uri.replace(/\s/g, "%20");
-  return uri;
-}
-function getImage(name, gxImageConstructor) {
-  if (!computedStyle) {
-    computedStyle = getComputedStyle(document.documentElement);
-  }
-  let value = computedStyle.getPropertyValue(`--gx-image_${name}`);
-  if (value) {
-    let matches;
-    const gximage = gxImageConstructor(name);
-    while ((matches = value.match(URL_REGEX))) {
-      gximage.densitySet.push({
-        uri: normalizeUri(matches[1] ? matches[2].slice(0, -1) : matches[2]),
-        density: matches[3] ? parseFloat(matches[3]) : 1
-      });
-      value = value.slice(matches[0].length);
-    }
-    if (gximage.densitySet.length > 0) {
-      gximage.uri = gximage.densitySet.reduce((previousValue, currentValue) => {
-        return previousValue.density === 1 ||
-          previousValue.density < currentValue.density
-          ? previousValue
-          : currentValue;
-      }).uri;
-    }
-    return gximage;
-  }
-}
-const fromGxImageToURL = (gxImage, Settings, gxImageConstructor) => {
-  if (!gxImage) {
-    return;
-  }
-  let url = "";
-  if (gxImage.id) {
-    url = getImage(gxImage.id, gxImageConstructor).uri;
-  }
-  else {
-    url = gxImage.uri;
-  }
-  if (!url) {
-    return "";
-  }
-  const baseUrl = Settings.WEBAPP_BASE;
-  const urlLower = url.toLowerCase();
-  if (urlLower.startsWith("assets/")) {
-    // Relative URL to local assets
-    return url;
-  }
-  else if (urlLower.startsWith("http://") ||
-    urlLower.startsWith("https://") ||
-    urlLower.startsWith("blob:") ||
-    urlLower.startsWith("file:") ||
-    urlLower.startsWith("data:")) {
-    // Absolute URL
-    return url;
-  }
-  else if (urlLower.startsWith(Settings.BASE_PATH.toLowerCase())) {
-    // Host relative URL
-    return baseUrl + url.substring(Settings.BASE_PATH.length);
-  }
-  else {
-    return baseUrl + url;
-  }
+const computeFilter = (filterType, item, filterInfo) => {
+  var _a;
+  return ((_a = filterInfo.filterOptions) === null || _a === void 0 ? void 0 : _a.hideMatchesAndShowNonMatches) === true
+    ? !filterDictionary[filterType](item, filterInfo)
+    : filterDictionary[filterType](item, filterInfo);
 };
 
 const treeViewRenderCss = "ch-tree-view-render{display:contents}";
@@ -123,6 +57,11 @@ const DEFAULT_INDETERMINATE_VALUE = false;
 const DEFAULT_LAZY_VALUE = false;
 const DEFAULT_ORDER_VALUE = 0;
 const DEFAULT_SELECTED_VALUE = false;
+// There are a filter applied and, if the type is "caption" or
+// "metadata", the filter property must be set
+const treeViewHasFilters = (filterType, filter) => filterType !== "none" &&
+  ((filterType !== "caption" && filterType !== "metadata") ||
+    (filter != null && filter.trim() !== ""));
 const defaultRenderItem$1 = (itemModel, treeState, treeHasFilter, lastItem, level) => {
   var _a, _b, _c, _d, _e, _f;
   return (treeState.filterType === "none" || itemModel.render !== false) && (index.h("ch-tree-view-item", { id: itemModel.id, caption: itemModel.caption, checkbox: (_a = itemModel.checkbox) !== null && _a !== void 0 ? _a : treeState.checkbox, checked: (_b = itemModel.checked) !== null && _b !== void 0 ? _b : treeState.checked, class: itemModel.class, disabled: itemModel.disabled, downloading: itemModel.downloading, dragDisabled: (_c = itemModel.dragDisabled) !== null && _c !== void 0 ? _c : treeState.dragDisabled, dropDisabled: (_d = itemModel.dropDisabled) !== null && _d !== void 0 ? _d : treeState.dropDisabled, editable: (_e = itemModel.editable) !== null && _e !== void 0 ? _e : treeState.editableItems, expanded: itemModel.expanded, indeterminate: itemModel.indeterminate, lastItem: lastItem, lazyLoad: itemModel.lazy, leaf: itemModel.leaf, leftImgSrc: itemModel.leftImgSrc, level: level, metadata: itemModel.metadata, rightImgSrc: itemModel.rightImgSrc, selected: itemModel.selected, showExpandableButton: itemModel.showExpandableButton, showLines: treeState.showLines, toggleCheckboxes: (_f = itemModel.toggleCheckboxes) !== null && _f !== void 0 ? _f : treeState.toggleCheckboxes }, !itemModel.leaf &&
@@ -130,22 +69,22 @@ const defaultRenderItem$1 = (itemModel, treeState, treeHasFilter, lastItem, leve
     itemModel.items.map((subModel, index) => defaultRenderItem$1(subModel, treeState, treeHasFilter, treeState.showLines !== "none" &&
       // If there is a filter applied in the current list, use the
       // lastItemId value to calculate the last item
-      (treeHasFilter && itemModel.lastItemId !== ""
+      (treeHasFilter && itemModel.lastItemId !== undefined
         ? subModel.id === itemModel.lastItemId
         : index === itemModel.items.length - 1), level + 1))));
 };
 const GXRenderItem = (itemModel, treeState, treeHasFilter, lastItem, level) => {
   var _a, _b, _c, _d;
-  return (treeState.filterType === "none" || itemModel.render !== false) && (index.h("ch-tree-view-item", { id: itemModel.id, caption: itemModel.caption, checkbox: (_a = itemModel.checkbox) !== null && _a !== void 0 ? _a : treeState.checkbox, checked: (_b = itemModel.checked) !== null && _b !== void 0 ? _b : treeState.checked, class: itemModel.class, downloading: itemModel.downloading, dragDisabled: itemModel.dragEnabled != null
+  return (treeState.filterType === "none" || itemModel.render !== false) && (index.h("ch-tree-view-item", { key: itemModel.id, id: itemModel.id, caption: itemModel.caption, checkbox: (_a = itemModel.checkbox) !== null && _a !== void 0 ? _a : treeState.checkbox, checked: (_b = itemModel.checked) !== null && _b !== void 0 ? _b : treeState.checked, class: itemModel.class, downloading: itemModel.downloading, dragDisabled: itemModel.dragEnabled != null
       ? !itemModel.dragEnabled
       : treeState.dragDisabled, dropDisabled: itemModel.dropEnabled != null
       ? !itemModel.dropEnabled
-      : treeState.dropDisabled, editable: (_c = itemModel.editable) !== null && _c !== void 0 ? _c : treeState.editableItems, expanded: itemModel.expanded, indeterminate: itemModel.indeterminate, lastItem: lastItem, lazyLoad: itemModel.lazy, leaf: itemModel.leaf, leftImgSrc: fromGxImageToURL(itemModel.leftImage, treeState.gxSettings, treeState.gxImageConstructor), level: level, metadata: itemModel.metadata, selected: itemModel.selected, showLines: treeState.showLines, toggleCheckboxes: (_d = itemModel.toggleCheckboxes) !== null && _d !== void 0 ? _d : treeState.toggleCheckboxes }, !itemModel.leaf &&
+      : treeState.dropDisabled, editable: (_c = itemModel.editable) !== null && _c !== void 0 ? _c : treeState.editableItems, expanded: itemModel.expanded, indeterminate: itemModel.indeterminate, lastItem: lastItem, lazyLoad: itemModel.lazy, leaf: itemModel.leaf, leftImgSrc: genexusImplementation.fromGxImageToURL(itemModel.leftImage, treeState.gxSettings, treeState.gxImageConstructor), level: level, metadata: itemModel.metadata, selected: itemModel.selected, showLines: treeState.showLines, toggleCheckboxes: (_d = itemModel.toggleCheckboxes) !== null && _d !== void 0 ? _d : treeState.toggleCheckboxes }, !itemModel.leaf &&
     itemModel.items != null &&
     itemModel.items.map((subModel, index) => GXRenderItem(subModel, treeState, treeHasFilter, treeState.showLines !== "none" &&
       // If there is a filter applied in the current list, use the
       // lastItemId value to calculate the last item
-      (treeHasFilter && itemModel.lastItemId !== ""
+      (treeHasFilter && itemModel.lastItemId !== undefined
         ? subModel.id === itemModel.lastItemId
         : index === itemModel.items.length - 1), level + 1))));
 };
@@ -217,13 +156,12 @@ const ChTreeViewRender = class {
     this.filterDebounce = 250;
     /**
      * This property lets you determine the list of items that will be filtered.
-     * Only works if `filterType = "id-list"`.
+     * Only works if `filterType = "list"`.
      */
     this.filterList = [];
     /**
      * This property lets you determine the options that will be applied to the
      * filter.
-     * Only works if `filterType = "caption" | "metadata"`.
      */
     this.filterOptions = {};
     /**
@@ -236,7 +174,7 @@ const ChTreeViewRender = class {
      * | `unchecked` | Show only the items that have a checkbox and are not checked.                                  |
      * | `caption`   | Show only the items whose `caption` satisfies the regex determinate by the `filter` property.  |
      * | `metadata`  | Show only the items whose `metadata` satisfies the regex determinate by the `filter` property. |
-     * | `id-list`   | Show only the items that are contained in the array determinate by the `filterList` property.  |
+     * | `list`   | Show only the items that are contained in the array determinate by the `filterList` property.     |
      * | `none`      | Show all items.                                                                                |
      */
     this.filterType = "none";
@@ -310,7 +248,8 @@ const ChTreeViewRender = class {
         newSelectedItem.expanded = newSelectedItemInfo.expanded;
         this.selectedItems.add(itemId);
       });
-      this.selectedItemsChange.emit(event.detail);
+      const selectedItemsInfo = this._getItemsInfo([...event.detail.keys()]);
+      this.selectedItemsChange.emit(selectedItemsInfo);
     };
     this.handleExpandedItemChange = (event) => {
       const detail = event.detail;
@@ -391,14 +330,14 @@ const ChTreeViewRender = class {
     }
   }
   handleFilterListChange() {
-    if (this.filterType === "id-list") {
+    // Use a Set to efficiently check for ids
+    this.filterListAsSet = new Set(this.filterList);
+    if (this.filterType === "list") {
       this.processFilters();
     }
   }
   handleFilterOptionsChange() {
-    if (this.filterType === "caption" || this.filterType === "metadata") {
-      this.processFilters();
-    }
+    this.processFilters();
   }
   handleFilterTypeChange() {
     this.processFilters();
@@ -447,6 +386,23 @@ const ChTreeViewRender = class {
     // Force re-render
     index.forceUpdate(this);
   }
+  /**
+   * Given a list of ids, it returns an array of the items that exists in the
+   * given list.
+   */
+  async getItemsInfo(itemsId) {
+    return this._getItemsInfo(itemsId);
+  }
+  _getItemsInfo(itemsId) {
+    const treeViewItemsInfo = [];
+    itemsId.forEach(itemId => {
+      const itemUIModel = this.flattenedTreeModel.get(itemId);
+      if (itemUIModel) {
+        treeViewItemsInfo.push(itemUIModel);
+      }
+    });
+    return treeViewItemsInfo;
+  }
   /**
    * Given an item id, an array of items to add, the download status and the
    * lazy state, updates the item's UI Model.
@@ -568,7 +524,9 @@ const ChTreeViewRender = class {
     }
     const itemInfo = itemUIModel.item;
     Object.keys(properties).forEach(propertyName => {
-      itemInfo[propertyName] = properties[propertyName];
+      if (properties[propertyName] !== undefined) {
+        itemInfo[propertyName] = properties[propertyName];
+      }
     });
   }
   updateCheckboxValue(event) {
@@ -675,7 +633,7 @@ const ChTreeViewRender = class {
     let aSubItemIsRendered = false;
     // Check if a subitem is rendered
     if (item.leaf !== true && item.items != null) {
-      let lastItemId = "";
+      let lastItemId = undefined;
       item.items.forEach(subItem => {
         const itemSatisfiesFilter = this.filterSubModel(subItem, filterInfo);
         aSubItemIsRendered || (aSubItemIsRendered = itemSatisfiesFilter);
@@ -687,7 +645,7 @@ const ChTreeViewRender = class {
     }
     // The current item is rendered if it satisfies the filter condition or a
     // subitem exists that needs to be rendered
-    const satisfiesFilter = filterDictionary[this.filterType](item, filterInfo) || aSubItemIsRendered;
+    const satisfiesFilter = aSubItemIsRendered || computeFilter(this.filterType, item, filterInfo);
     item.render = satisfiesFilter; // Update item render
     return satisfiesFilter;
   }
@@ -724,8 +682,8 @@ const ChTreeViewRender = class {
       defaultCheckbox: this.checkbox,
       defaultChecked: this.checked,
       filter: this.filter,
-      filterList: this.filterList,
-      filterOptions: this.filterOptions
+      filterOptions: this.filterOptions,
+      filterSet: this.filterListAsSet
     });
     // Check if should filter with debounce
     if (processWithDebounce) {
@@ -757,8 +715,7 @@ const ChTreeViewRender = class {
     }
   }
   render() {
-    return (index.h("ch-tree-view", { class: this.cssClass || null, multiSelection: this.multiSelection, waitDropProcessing: this.waitDropProcessing, onDroppableZoneEnter: this.handleDroppableZoneEnter, onExpandedItemChange: this.handleExpandedItemChange, onItemContextmenu: this.handleItemContextmenu, onItemsDropped: this.handleItemsDropped, onSelectedItemsChange: this.handleSelectedItemsChange, ref: el => (this.treeRef = el) }, this.treeModel.map((itemModel, index) => this.renderItem(itemModel, this, (this.filterType === "caption" || this.filterType === "metadata") &&
-      this.filter != null, this.showLines !== "none" && index === this.treeModel.length - 1, 0))));
+    return (index.h("ch-tree-view", { class: this.cssClass || null, multiSelection: this.multiSelection, waitDropProcessing: this.waitDropProcessing, onDroppableZoneEnter: this.handleDroppableZoneEnter, onExpandedItemChange: this.handleExpandedItemChange, onItemContextmenu: this.handleItemContextmenu, onItemsDropped: this.handleItemsDropped, onSelectedItemsChange: this.handleSelectedItemsChange, ref: el => (this.treeRef = el) }, this.treeModel.map((itemModel, index) => this.renderItem(itemModel, this, treeViewHasFilters(this.filterType, this.filter), this.showLines !== "none" && index === this.treeModel.length - 1, 0))));
   }
   static get watchers() { return {
     "filter": ["handleFilterChange"],