@genexus/genexus-ide-ui 0.0.62 → 0.0.64

package/dist/components/gx-ide-kb-manager-export.js

@@ -1,10 +1,11 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { L as Locale } from './locale.js';
 import { c as config } from './config.js';
-import { d as defineCustomElement$i } from './checkbox.js';
-import { d as defineCustomElement$h } from './icon.js';
-import { d as defineCustomElement$g } from './tree-x.js';
-import { d as defineCustomElement$f } from './tree-x-list-item.js';
+import { d as defineCustomElement$j } from './checkbox.js';
+import { d as defineCustomElement$i } from './icon.js';
+import { d as defineCustomElement$h } from './tree-view.js';
+import { d as defineCustomElement$g } from './tree-view-item.js';
+import { d as defineCustomElement$f } from './tree-view-render.js';
 import { d as defineCustomElement$e } from './container.js';
 import { d as defineCustomElement$d } from './directory-selector.js';
 import { d as defineCustomElement$c } from './title.js';
@@ -17,8 +18,10 @@ import { d as defineCustomElement$6 } from './gxg-label2.js';
 import { d as defineCustomElement$5 } from './text.js';
 import { d as defineCustomElement$4 } from './title2.js';
 import { d as defineCustomElement$3 } from './tooltip.js';
-import { d as defineCustomElement$2 } from './tree-view.js';
+import { d as defineCustomElement$2 } from './tree-view2.js';
 
+const KB_PROPERTY = "property";
+const KB_OBJECT = "object";
 /*
 INDEX:
 1. getObjectIcon
@@ -28,21 +31,10 @@ INDEX:
 5. findObjectInTree
 6. findPropertyInTree
 7. convertPropertyToTreeItem
-8. convertObjectDataToTreeItemData
+8. updateTreeModelWithObjects
 9. convertKbPropertiesDataToTreeItemData
 10. clearKbPropertiesFromTree
 */
-/* 1.1 getIcon (for objects)*/
-const getObjectIcon = (typeId, objectTypes) => {
-  // The object icon has to be retrieved from the ObjetTypes array, by matching the ObjectData typeId with the ObjectType id.
-  const objectType = objectTypes.find(objectType => objectType.id === typeId);
-  if (objectType) {
-    return objectType.icon;
-  }
-  else {
-    return undefined;
-  }
-};
 /* 1.2 getIcon (for properties)*/
 const getPropertyIcon = (typeId, kbPropertiesTypes) => {
   // The object icon has to be retrieved from the ObjetTypes array, by matching the ObjectData typeId with the ObjectType id.
@@ -60,7 +52,6 @@ const convertObjectTypeToTreeItem = (objectType) => ({
   id: objectType.id,
   leftImgSrc: objectType.icon,
   leaf: false,
-  checkbox: true,
   class: "object-type tree-view-item",
   expanded: true,
   items: []
@@ -69,17 +60,11 @@ const convertObjectTypeToTreeItem = (objectType) => ({
 const convertObjectToTreeItem = (object, objectTypes) => ({
   caption: object.name,
   id: object.id,
-  leftImgSrc: getObjectIcon(object.typeId, objectTypes),
-  checkbox: true,
+  leftImgSrc: objectTypes.get(object.typeId).icon,
   class: "object tree-view-item",
+  metadata: KB_OBJECT,
   leaf: true
 });
-/* 4. getObjectType*/
-const getObjectType = (object, objectTypes) => {
-  return objectTypes.find(objectType => {
-    return objectType.id === object.typeId;
-  });
-};
 /* 5. findObjectInTree*/
 const findObjectInTree = (object, actualTreeState) => {
   var _a;
@@ -120,12 +105,12 @@ const convertPropertyToTreeItem = (property, kbPropertiesTypes) => ({
   caption: property.name,
   id: property.id,
   leftImgSrc: getPropertyIcon(property.typeId, kbPropertiesTypes),
-  checkbox: true,
   class: "property tree-view-item",
+  metadata: KB_PROPERTY,
   leaf: true
 });
-/* 8. convertObjectDataToTreeItemData*/
-const convertObjectDataToTreeItemData = (objects, objectTypes, actualTreeState) => {
+/* 8. updateTreeModelWithObjects*/
+const updateTreeModelWithObjects = (objects, objectTypes, actualTreeState) => {
   const updatedTreeData = [...actualTreeState];
   if (!objects) {
     // nothing to do
@@ -140,7 +125,7 @@ const convertObjectDataToTreeItemData = (objects, objectTypes, actualTreeState)
       // if the objectType tree node exists, insert inside.
       // if the objectType tree node does not exists, create object type node first.
       if (objectTreeItemInfo.objectTypeIndex === -1) {
-        const objectType = getObjectType(object, objectTypes);
+        const objectType = objectTypes.get(object.typeId);
         if (objectType !== undefined) {
           const objectTypeTreeItem = convertObjectTypeToTreeItem(objectType);
           objectTreeItemInfo.objectTypeIndex =
@@ -192,18 +177,18 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
   constructor() {
     super();
     this.__registerHost();
-    this.__attachShadow();
     this.componentDidLoadEvent = createEvent(this, "componentDidLoadEvent", 7);
     this.componentDidRenderFirstTime = createEvent(this, "componentDidRenderFirstTime", 7);
     this.checkedObjectsIds = [];
     this.checkedPropertiesIds = [];
     this.renderedFirstTime = false;
+    this.flattenedObjectTypes = new Map();
     // 7.LISTENERS //
     // 8.PUBLIC METHODS API //
     // 9.LOCAL METHODS //
     this.evaluateObjects = () => {
       var _a;
-      this.noObjects = !!(((_a = this.objectsTreeState) === null || _a === void 0 ? void 0 : _a.length) === 0 || !this.objectsTreeState);
+      this.noObjects = !!(((_a = this.treeModel) === null || _a === void 0 ? void 0 : _a.length) === 0 || !this.treeModel);
     };
     this.optionsCallbackHandler = () => {
       if (this.optionsCallback) {
@@ -213,19 +198,20 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
     };
     this.addKBPropertiesCallbackHandler = async (e) => {
       const checked = e.detail.value;
+      this.addKbPropertiesIsChecked = checked;
       if (checked && this.addKBPropertiesCallback) {
         const kBPropertiesData = await this.addKBPropertiesCallback();
         if (kBPropertiesData.length === 0) ;
         else {
           // 'convertObjectDataToTreeItemData' can be used for converting KBPropertiesData as well, because the two types share the same properties
-          const objectsNewTreeState = convertKbPropertiesDataToTreeItemData(kBPropertiesData, this.kbPropertiesTypes, this.objectsTreeState);
-          this.objectsTreeState = objectsNewTreeState;
+          const newTreeModel = convertKbPropertiesDataToTreeItemData(kBPropertiesData, this.kbPropertiesTypes, this.treeModel);
+          this.treeModel = newTreeModel;
         }
       }
       else if (!checked) {
         // previous properties (if any) should be removed
-        const objectsWithoutProperties = clearKbPropertiesFromTree(this.objectsTreeState);
-        this.objectsTreeState = objectsWithoutProperties;
+        const objectsWithoutProperties = clearKbPropertiesFromTree(this.treeModel);
+        this.treeModel = objectsWithoutProperties;
       }
     };
     this.addObjectsCallbackHandler = async () => {
@@ -245,41 +231,36 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
      */
     this.updateObjects = (objects) => {
       if (objects.length) {
-        const objectsNewTreeState = convertObjectDataToTreeItemData(objects, this.objectTypes, this.objectsTreeState);
-        // console.log("objectsNewTreeState", objectsNewTreeState);
-        this.objectsTreeState = objectsNewTreeState;
+        const newTreeModel = updateTreeModelWithObjects(objects, this.flattenedObjectTypes, this.treeModel);
+        this.treeModel = newTreeModel;
       }
     };
     /*
      * Update checked objects 'checkedObjectsArray' array. Used for the 'addReferencesCallback'
      */
     this.objectsTreeCheckedItemsChangedHandler = (event) => {
-      const allItemsWithCheckbox = [...event.detail.values()];
-      const checkedItems = allItemsWithCheckbox.filter(node => node.item.checked);
-      // objects checked
-      const checkedObjects = checkedItems.filter(node => node.item.class === "object");
+      // filter 'checked objects' and 'checked properties' ids
       const checkedObjectsIds = [];
-      if (checkedObjects.length > 0) {
-        checkedObjects.forEach(objectChecked => {
-          checkedObjectsIds.push(objectChecked.item.id);
-        });
-      }
-      this.checkedObjectsIds = checkedObjectsIds;
-      // properties checked
-      const checkedProperties = checkedItems.filter(node => node.item.class === "property");
       const checkedPropertiesIds = [];
-      if (checkedProperties.length > 0) {
-        checkedProperties.forEach(propertyChecked => {
-          checkedPropertiesIds.push(propertyChecked.item.id);
-        });
-      }
+      const allItemsWithCheckbox = [...event.detail.values()];
+      allItemsWithCheckbox.forEach(node => {
+        if (node.item.checked && node.item.metadata === KB_OBJECT) {
+          checkedObjectsIds.push(node.item.id);
+        }
+        else if (node.item.checked && node.item.metadata === KB_PROPERTY) {
+          checkedPropertiesIds.push(node.item.id);
+        }
+      });
+      this.checkedObjectsIds = checkedObjectsIds;
       this.checkedPropertiesIds = checkedPropertiesIds;
     };
     this.exportCallbackHandler = async () => {
       if (this.exportCallback) {
         const exportAllChecked = this.exportAllCheckboxEl.checked;
         const fileName = this.fileNameEl.value;
-        const checkedKbPropertiesIds = this.checkedPropertiesIds;
+        const checkedKbPropertiesIds = this.addKbPropertiesIsChecked
+          ? this.checkedPropertiesIds
+          : [];
         const checkedObjectIds = exportAllChecked
           ? undefined
           : this.checkedObjectsIds;
@@ -297,10 +278,47 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
       /* revisar*/
       this.objectsTreeEl.updateAllItemsProperties({ checked: false });
     };
+    this.exportAllChangedHandler = (event) => {
+      this.exportAllIsChecked = event.detail.value;
+    };
+    this.evaluateTreeViewFilters = () => {
+      if (this.addKbPropertiesIsChecked && this.exportAllIsChecked) {
+        // only show properties
+        return KB_PROPERTY;
+      }
+      else if (!this.addKbPropertiesIsChecked && !this.exportAllIsChecked) {
+        // only show objects
+        return KB_OBJECT;
+      }
+      return "none"; // Applies if !this.addKbPropertiesIsChecked && this.exportAllIsChecked
+    };
+    this.evaluateContentToDisplay = () => {
+      // Nothing to display on the tree-view
+      if (this.noObjects) {
+        return this.renderMessage(true);
+      }
+      // The tree should be empty, because all filters are being applied.
+      // Display a message to prevent a white screen.
+      if (!this.addKbPropertiesIsChecked && this.exportAllIsChecked) {
+        return this.renderMessage(false);
+      }
+      return (h("gxg-tree-view", { treeModel: this.treeModel, dragDisabled: true, dropDisabled: true, toggleCheckboxes: true, checked: true, checkbox: true, filter: this.evaluateTreeViewFilters(), filterType: this.addKbPropertiesIsChecked && !this.exportAllIsChecked
+          ? "none"
+          : "metadata", onCheckedItemsChange: this.objectsTreeCheckedItemsChangedHandler, ref: el => (this.objectsTreeEl = el) }));
+    };
+    this.renderMessage = (nothingToDisplay) => {
+      return (h("gxg-text", { textAlign: config.gxgMessage.common.textAlign, padding: config.gxgMessage.common.textAlign, type: config.gxgMessage.common.type, maxWidth: config.gxgMessage.common.maxWidth, class: "gx-ide-message gx-ide-message--short", part: "referenced-by-empty-status-message" }, nothingToDisplay ? ([
+        h("span", null, this._componentLocale.main.noObjectsToDisplay),
+        h("gxg-text", { type: "text-link-no-line", textAlign: "center", onClick: this.addObjectsCallbackHandler }, this._componentLocale.main.beginByADdingSomeObjects)
+      ]) : (h("span", null, this._componentLocale.main.exportAllMessage))));
+    };
+    this.exportAllIsChecked = false;
+    this.exportingIsInProcess = false;
+    this.addKbPropertiesIsChecked = false;
     this.fileName = "";
     this.exportFilePathName = undefined;
     this.noObjects = undefined;
-    this.objectsTreeState = [];
+    this.treeModel = [];
     this.dummyInitialTree = undefined;
     this.kbPropertiesTypes = undefined;
     this.objectTypes = undefined;
@@ -312,17 +330,21 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
     this.exportCallback = undefined;
     this.cancelCallback = undefined;
   }
-  watchObjectsTreeStateHandler(newState) {
+  watchTreeModelHandler(newState) {
     this.noObjects = !!(newState.length === 0 || !newState);
   }
   watchDummyInitialTreeHandler(newTree) {
-    this.objectsTreeState = newTree;
+    this.treeModel = newTree;
+  }
+  watchObjectTypeslHandler(newState) {
+    this.flattenObjectTypes(newState);
   }
   // 6.COMPONENT LIFECYCLE EVENTS //
   async componentWillLoad() {
     this._componentLocale = await Locale.getComponentStrings(this.el);
     this.componentDidLoadEvent.emit(true);
     this.evaluateObjects();
+    this.flattenObjectTypes(this.objectTypes);
   }
   componentDidRender() {
     if (!this.renderedFirstTime) {
@@ -330,24 +352,34 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
       this.renderedFirstTime = true;
     }
   }
+  flattenObjectTypes(newState) {
+    newState.forEach(objectType => {
+      this.flattenedObjectTypes.set(objectType.id, objectType);
+    });
+  }
   // 10.RENDER() FUNCTION //
   render() {
-    return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { noContentPadding: true, noHeadingPadding: true, headingPaddingTop: true, containerTitle: this._componentLocale.componentName, slimmerFooter: config.gxIdeContainer.slimmerFooter }, h("header", { slot: "header", class: "header" }, h("div", { class: "header__top" }, h("gx-ide-directory-selector", { class: { "select-file-input": true }, value: this.exportFilePathName, part: "xpz-file", label: this._componentLocale.header.exportFileName, ref: el => (this.fileNameEl = el), selectDirectoryCallback: this.exportFileDirectoryCallback }), h("gxg-button-group", { class: "export-cancel-buttons-group", "default-selected-btn-id": "responsive-tablet-btn" }, h("button", { id: "export-kb-btn", part: "export-btn", onClick: this.exportCallbackHandler }, this._componentLocale.header.exportButton), h("button", { id: "cancel-kb-export-btn", part: "cancel-button", onClick: this.cancelCallbackHandler }, this._componentLocale.header.cancelButton)), h("gxg-button", { type: "secondary-icon-only", icon: "gemini-tools/settings", part: "select-kb-btn", class: { "options-btn": true }, onClick: this.optionsCallbackHandler }, this._componentLocale.header.optionsButton)), h("div", { class: "header__bottom" }, h("div", { class: { "checkboxes-wrapper": true } }, h("gxg-form-checkbox", { label: this._componentLocale.main.addKnowledgeBaseDescription, onChange: this.addKBPropertiesCallbackHandler, part: "add-kb-checkbox" }), h("gxg-form-checkbox", { label: this._componentLocale.main.exportAll, part: "export-all-checkbox", ref: el => (this.exportAllCheckboxEl =
-        el) })))), h("div", { class: {
+    // console.log("checkedObjectsIds", this.checkedObjectsIds);
+    // console.log("checkedPropertiesIds", this.checkedPropertiesIds);
+    return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { noContentPadding: true, noHeadingPadding: true, headingPaddingTop: true, containerTitle: this._componentLocale.componentName, slimmerFooter: config.gxIdeContainer.slimmerFooter }, h("header", { slot: "header", class: "header" }, h("div", { class: "header__top" }, h("gx-ide-directory-selector", { class: { "select-file-input": true }, value: this.exportFilePathName, part: "xpz-file", label: this._componentLocale.header.exportFileName, ref: el => (this.fileNameEl = el), selectDirectoryCallback: this.exportFileDirectoryCallback }), h("gxg-button-group", { class: "export-cancel-buttons-group", "default-selected-btn-id": "responsive-tablet-btn" }, h("button", { id: "export-kb-btn", part: "export-btn", onClick: this.exportCallbackHandler, disabled: this.noObjects }, this._componentLocale.header.exportButton), h("button", { id: "cancel-kb-export-btn", part: "cancel-button", onClick: this.cancelCallbackHandler, disabled: this.noObjects || this.exportingIsInProcess }, this._componentLocale.header.cancelButton)), h("gxg-button", { type: "secondary-icon-only", icon: "gemini-tools/settings", part: "select-kb-btn", class: { "options-btn": true }, onClick: this.optionsCallbackHandler }, this._componentLocale.header.optionsButton)), h("div", { class: "header__bottom" }, h("div", { class: { "checkboxes-wrapper": true } }, h("gxg-form-checkbox", { label: this._componentLocale.main.addKnowledgeBaseDescription, onChange: this.addKBPropertiesCallbackHandler, part: "add-kb-checkbox" }), h("gxg-form-checkbox", { label: this._componentLocale.main.exportAll, part: "export-all-checkbox", ref: el => (this.exportAllCheckboxEl =
+        el), disabled: this.noObjects, onChange: this.exportAllChangedHandler })))), h("div", { class: {
         "tree-container": true,
-        "tree-container--empty": this.noObjects
-      } }, !this.noObjects ? (
-    /* objects tree */
-    h("gxg-tree-view", { treeModel: this.objectsTreeState, dragDisabled: true, dropDisabled: true, toggleCheckboxes: true, onCheckedItemsChange: this.objectsTreeCheckedItemsChangedHandler, ref: el => (this.objectsTreeEl = el) })) : (h("gxg-text", { textAlign: config.gxgMessage.common.textAlign, padding: config.gxgMessage.common.textAlign, type: config.gxgMessage.common.type, maxWidth: config.gxgMessage.common.maxWidth, class: "gx-ide-message gx-ide-message--short", part: "referenced-by-empty-status-message" }, "There are no Objects to display. ", h("br", null), h("gxg-text", { type: "text-link-no-line", textAlign: "center", onClick: this.addObjectsCallbackHandler }, "Begin by adding some.")))), h("gxg-button", { type: "secondary-text-only", part: "export-button", class: { "cancel-btn": true }, slot: "footer-start", onClick: this.clearButtonHandler }, this._componentLocale.footer.clearButton), h("div", { class: { "footer-right-wrapper": true }, slot: "footer-end" }, h("gxg-button", { onClick: this.addReferencesCallbackHandler, type: "outlined-text-icon", icon: "general/references", part: "export-button", class: { "cancel-btn": true } }, this._componentLocale.footer.referencesButton), h("gxg-button", { type: "primary-text-icon", icon: "menus/new-object", part: "export-button", class: { "cancel-btn": true }, onClick: this.addObjectsCallbackHandler, grabAttention: this.noObjects }, this._componentLocale.footer.addButton))))));
+        "tree-container--empty": this.noObjects ||
+          (!this.noObjects &&
+            this.exportAllIsChecked &&
+            !this.addKbPropertiesIsChecked)
+        // "tree-container--export-all": this.exportAllIsChecked
+      } }, this.evaluateContentToDisplay()), h("gxg-text", { type: "button-like", part: "export-button", slot: "footer-start", onClick: this.clearButtonHandler }, this._componentLocale.footer.clearButton), h("div", { class: { "footer-right-wrapper": true }, slot: "footer-end" }, h("gxg-button", { onClick: this.addReferencesCallbackHandler, type: "outlined-text-icon", icon: "general/references", part: "export-button", class: { "cancel-btn": true }, disabled: this.exportAllIsChecked }, this._componentLocale.footer.referencesButton), h("gxg-button", { type: "primary-text-icon", icon: "menus/new-object", part: "export-button", class: { "cancel-btn": true }, onClick: this.addObjectsCallbackHandler, disabled: this.exportAllIsChecked }, this._componentLocale.footer.addButton))))));
   }
   static get assetsDirs() { return ["gx-ide-assets/kb-manager-export"]; }
   get el() { return this; }
   static get watchers() { return {
-    "objectsTreeState": ["watchObjectsTreeStateHandler"],
-    "dummyInitialTree": ["watchDummyInitialTreeHandler"]
+    "treeModel": ["watchTreeModelHandler"],
+    "dummyInitialTree": ["watchDummyInitialTreeHandler"],
+    "objectTypes": ["watchObjectTypeslHandler"]
   }; }
   static get style() { return kbManagerExportCss; }
-}, [1, "gx-ide-kb-manager-export", {
+}, [0, "gx-ide-kb-manager-export", {
     "dummyInitialTree": [16],
     "kbPropertiesTypes": [16],
     "objectTypes": [16],
@@ -358,16 +390,19 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
     "addObjectsCallback": [16],
     "exportCallback": [16],
     "cancelCallback": [16],
+    "exportAllIsChecked": [32],
+    "exportingIsInProcess": [32],
+    "addKbPropertiesIsChecked": [32],
     "fileName": [32],
     "exportFilePathName": [32],
     "noObjects": [32],
-    "objectsTreeState": [32]
+    "treeModel": [32]
   }]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["gx-ide-kb-manager-export", "ch-checkbox", "ch-icon", "ch-tree-x", "ch-tree-x-list-item", "gx-ide-container", "gx-ide-directory-selector", "gx-ide-title", "gxg-button", "gxg-button-group", "gxg-form-checkbox", "gxg-form-text", "gxg-icon", "gxg-label", "gxg-text", "gxg-title", "gxg-tooltip", "gxg-tree-view"];
+  const components = ["gx-ide-kb-manager-export", "ch-checkbox", "ch-icon", "ch-tree-view", "ch-tree-view-item", "ch-tree-view-render", "gx-ide-container", "gx-ide-directory-selector", "gx-ide-title", "gxg-button", "gxg-button-group", "gxg-form-checkbox", "gxg-form-text", "gxg-icon", "gxg-label", "gxg-text", "gxg-title", "gxg-tooltip", "gxg-tree-view"];
   components.forEach(tagName => { switch (tagName) {
     case "gx-ide-kb-manager-export":
       if (!customElements.get(tagName)) {
@@ -376,20 +411,25 @@ function defineCustomElement$1() {
       break;
     case "ch-checkbox":
       if (!customElements.get(tagName)) {
-        defineCustomElement$i();
+        defineCustomElement$j();
       }
       break;
     case "ch-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$i();
+      }
+      break;
+    case "ch-tree-view":
       if (!customElements.get(tagName)) {
         defineCustomElement$h();
       }
       break;
-    case "ch-tree-x":
+    case "ch-tree-view-item":
       if (!customElements.get(tagName)) {
         defineCustomElement$g();
       }
       break;
-    case "ch-tree-x-list-item":
+    case "ch-tree-view-render":
       if (!customElements.get(tagName)) {
         defineCustomElement$f();
       }

package/dist/components/gx-ide-kb-manager-import.js

@@ -2,10 +2,11 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
 import { L as Locale } from './locale.js';
 import { c as config } from './config.js';
 import { c as countTreeItems } from './helpers2.js';
-import { d as defineCustomElement$n } from './checkbox.js';
-import { d as defineCustomElement$m } from './icon.js';
-import { d as defineCustomElement$l } from './tree-x.js';
-import { d as defineCustomElement$k } from './tree-x-list-item.js';
+import { d as defineCustomElement$o } from './checkbox.js';
+import { d as defineCustomElement$n } from './icon.js';
+import { d as defineCustomElement$m } from './tree-view.js';
+import { d as defineCustomElement$l } from './tree-view-item.js';
+import { d as defineCustomElement$k } from './tree-view-render.js';
 import { d as defineCustomElement$j } from './ch-window2.js';
 import { d as defineCustomElement$i } from './ch-window-close2.js';
 import { d as defineCustomElement$h } from './container.js';
@@ -23,8 +24,9 @@ import { d as defineCustomElement$6 } from './gxg-label2.js';
 import { d as defineCustomElement$5 } from './text.js';
 import { d as defineCustomElement$4 } from './title2.js';
 import { d as defineCustomElement$3 } from './tooltip.js';
-import { d as defineCustomElement$2 } from './tree-view.js';
+import { d as defineCustomElement$2 } from './tree-view2.js';
 
+const KB_OBJECT = "object";
 const convertImportItemToTreeItem = (importCatIcon, importItems) => {
   const importTreeItems = [];
   importItems.forEach(importItem => {
@@ -35,7 +37,8 @@ const convertImportItemToTreeItem = (importCatIcon, importItems) => {
       checkbox: true,
       expanded: true,
       leaf: true,
-      class: "object tree-view-item"
+      class: "object tree-view-item",
+      metadata: KB_OBJECT
     });
   });
   return importTreeItems;
@@ -214,10 +217,28 @@ const GxIdeKbManagerImport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
       }
     };
     this.objectsTreeCheckedItemsChangedHandler = (event) => {
+      /* Begin of evaluate 'select/unselect checkbox' state*/
+      if (event.detail == null) {
+        this.toggleObjectsCheckboxEl.checked = false;
+        this.toggleObjectsCheckboxEl.indeterminate = false;
+        return;
+      }
       const allItemsWithCheckbox = [...event.detail.values()];
+      if (allItemsWithCheckbox.length === 0) {
+        this.toggleObjectsCheckboxEl.checked = false;
+        this.toggleObjectsCheckboxEl.indeterminate = false;
+        return;
+      }
+      const firstItemCheckedValue = allItemsWithCheckbox[0].item.checked;
+      const allItemsHaveTheSameCheckedValue = allItemsWithCheckbox.every(treeItem => treeItem.item.checked === firstItemCheckedValue);
+      this.toggleObjectsCheckboxEl.checked = firstItemCheckedValue;
+      this.toggleObjectsCheckboxEl.indeterminate =
+        !allItemsHaveTheSameCheckedValue;
+      /* End of evaluate 'select/unselect checkbox' state*/
       const checkedItems = allItemsWithCheckbox.filter(node => node.item.checked);
       // objects checked
-      const checkedObjects = checkedItems.filter(node => node.item.class === "object");
+      const checkedObjects = checkedItems.filter(node => node.item.metadata === KB_OBJECT);
+      console.log("checkedObjects", checkedObjects);
       const checkedObjectsIds = [];
       if (checkedObjects.length > 0) {
         checkedObjects.forEach(objectChecked => {
@@ -244,12 +265,10 @@ const GxIdeKbManagerImport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
       this.statusInfo.warning.number = 0;
       this.statusInfo.success.number = 0;
     };
-    this.selectAllClickedHandler = (e) => {
-      const checked = e.target.checked;
-      if (checked && this.objectsTreeEl) {
-        console.log("select all");
-        this.objectsTreeEl.updateAllItemsProperties({ checked: true });
-      }
+    this.toggleSelectionHandler = (e) => {
+      const checked = e.detail.value;
+      this.toggleObjectsCheckboxEl.indeterminate = false;
+      this.objectsTreeEl.updateAllItemsProperties({ checked: checked });
     };
     this.statusButtonsSelectionChangedHandler = (e) => {
       const activeStates = e.detail;
@@ -345,11 +364,8 @@ const GxIdeKbManagerImport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
         "tree-container": true,
         "tree-container--objects-in-file": true,
         "tree-container--empty": this.noObjects
-      } }, !this.noObjects ? (h("gxg-tree-view", { treeModel: this.objectsTreeState, dragDisabled: true, dropDisabled: true, toggleCheckboxes: true, onCheckedItemsChange: this.objectsTreeCheckedItemsChangedHandler, ref: el => (this.objectsTreeEl = el) })) : (h("div", { class: "gx-ide-message" }, h("gxg-text", { textAlign: config.gxgMessage.common.textAlign, padding: config.gxgMessage.common.textAlign, type: config.gxgMessage.common.type, maxWidth: config.gxgMessage.common.maxWidth, part: "objects-in-file-empty-status-message" }, "There are no Objects. ", h("br", null), h("gxg-text", { type: "text-link-no-line", onClick: this.selectFileHandler }, "Begin by selecting a file."))))), h("gxg-form-checkbox", { label: this.objectsTreeState.length > 0 &&
-        this.objectsInFileTotalNodes ===
-          this.checkedObjectsIds.length
-        ? this._componentLocale.main.objectsInFile.deselectAll
-        : this._componentLocale.main.objectsInFile.selectAll, part: "select-all-checkbox", slot: "footer-start", disabled: this.importingObjects || this.objectsTreeState.length === 0, checked: this.evaluateCheckAllValue(), onClick: this.selectAllClickedHandler }), h("gxg-button-group", { slot: "footer-end", ref: (el) => (this.objectsButtonsGroup = el) }, h("button", { id: "import-btn", part: "import-button", disabled: this.importingObjects ||
+      } }, !this.noObjects ? (h("gxg-tree-view", { treeModel: this.objectsTreeState, dragDisabled: true, dropDisabled: true, toggleCheckboxes: true, onCheckedItemsChange: this.objectsTreeCheckedItemsChangedHandler, ref: el => (this.objectsTreeEl = el) })) : (h("div", { class: "gx-ide-message" }, h("gxg-text", { textAlign: config.gxgMessage.common.textAlign, padding: config.gxgMessage.common.textAlign, type: config.gxgMessage.common.type, maxWidth: config.gxgMessage.common.maxWidth, part: "objects-in-file-empty-status-message" }, "There are no Objects. ", h("br", null), h("gxg-text", { type: "text-link-no-line", onClick: this.selectFileHandler }, "Begin by selecting a file."))))), h("gxg-form-checkbox", { label: this._componentLocale.main.objectsInFile.selectUnselect, part: "select-all-checkbox", slot: "footer-start", disabled: this.importingObjects || this.objectsTreeState.length === 0, checked: this.evaluateCheckAllValue(), onChange: this.toggleSelectionHandler, ref: (el) => (this.toggleObjectsCheckboxEl =
+        el) }), h("gxg-button-group", { slot: "footer-end", ref: (el) => (this.objectsButtonsGroup = el) }, h("button", { id: "import-btn", part: "import-button", disabled: this.importingObjects ||
         this.checkedObjectsIds.length === 0, onClick: this.importObjectsHandler }, this._componentLocale.main.objectsInFile.importButton), h("button", { id: "cancel-import-btn", part: "cancel-import-button", disabled: !this.importingObjects, onClick: this.cancelImportHandler }, this._componentLocale.main.objectsInFile.cancelButton)), h("gxg-button", { type: "secondary-icon-only", icon: "gemini-tools/settings", slot: "footer-end", part: "select-kb-btn", onClick: this.optionsHandler }, this._componentLocale.header.optionsButton)), h("gx-ide-container", { containerTitle: this._componentLocale.main.importStatus.title, noContentPadding: true, noBorderFooter: true, slimmerFooter: true, inactiveTitle: this.noImport, footerSubtleShadow: !this.noImport, titleType: "secondary" }, h("div", { class: {
         "tree-container": true,
         "tree-container--import-status": true,
@@ -388,7 +404,7 @@ function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["gx-ide-kb-manager-import", "ch-checkbox", "ch-icon", "ch-tree-x", "ch-tree-x-list-item", "ch-window", "ch-window-close", "gx-ide-container", "gx-ide-list-selector", "gx-ide-list-selector-item", "gx-ide-status-buttons", "gx-ide-title", "gxg-button", "gxg-button-group", "gxg-form-checkbox", "gxg-form-text", "gxg-icon", "gxg-ide-loader", "gxg-label", "gxg-text", "gxg-title", "gxg-tooltip", "gxg-tree-view"];
+  const components = ["gx-ide-kb-manager-import", "ch-checkbox", "ch-icon", "ch-tree-view", "ch-tree-view-item", "ch-tree-view-render", "ch-window", "ch-window-close", "gx-ide-container", "gx-ide-list-selector", "gx-ide-list-selector-item", "gx-ide-status-buttons", "gx-ide-title", "gxg-button", "gxg-button-group", "gxg-form-checkbox", "gxg-form-text", "gxg-icon", "gxg-ide-loader", "gxg-label", "gxg-text", "gxg-title", "gxg-tooltip", "gxg-tree-view"];
   components.forEach(tagName => { switch (tagName) {
     case "gx-ide-kb-manager-import":
       if (!customElements.get(tagName)) {
@@ -397,20 +413,25 @@ function defineCustomElement$1() {
       break;
     case "ch-checkbox":
       if (!customElements.get(tagName)) {
-        defineCustomElement$n();
+        defineCustomElement$o();
       }
       break;
     case "ch-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$n();
+      }
+      break;
+    case "ch-tree-view":
       if (!customElements.get(tagName)) {
         defineCustomElement$m();
       }
       break;
-    case "ch-tree-x":
+    case "ch-tree-view-item":
       if (!customElements.get(tagName)) {
         defineCustomElement$l();
       }
       break;
-    case "ch-tree-x-list-item":
+    case "ch-tree-view-render":
       if (!customElements.get(tagName)) {
         defineCustomElement$k();
       }

package/dist/components/gx-ide-references.js

@@ -2,13 +2,14 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
 import { L as Locale } from './locale.js';
 import { c as config } from './config.js';
 import { r as renderSuggestLists } from './render-suggest.js';
-import { d as defineCustomElement$l } from './checkbox.js';
-import { d as defineCustomElement$k } from './icon.js';
-import { d as defineCustomElement$j } from './ch-suggest2.js';
-import { d as defineCustomElement$i } from './ch-suggest-list2.js';
-import { d as defineCustomElement$h } from './ch-suggest-list-item2.js';
-import { d as defineCustomElement$g } from './tree-x.js';
-import { d as defineCustomElement$f } from './tree-x-list-item.js';
+import { d as defineCustomElement$m } from './checkbox.js';
+import { d as defineCustomElement$l } from './icon.js';
+import { d as defineCustomElement$k } from './ch-suggest2.js';
+import { d as defineCustomElement$j } from './ch-suggest-list2.js';
+import { d as defineCustomElement$i } from './ch-suggest-list-item2.js';
+import { d as defineCustomElement$h } from './tree-view.js';
+import { d as defineCustomElement$g } from './tree-view-item.js';
+import { d as defineCustomElement$f } from './tree-view-render.js';
 import { d as defineCustomElement$e } from './ch-window2.js';
 import { d as defineCustomElement$d } from './ch-window-close2.js';
 import { d as defineCustomElement$c } from './container.js';
@@ -21,7 +22,7 @@ import { d as defineCustomElement$6 } from './suggest.js';
 import { d as defineCustomElement$5 } from './text.js';
 import { d as defineCustomElement$4 } from './title2.js';
 import { d as defineCustomElement$3 } from './tooltip.js';
-import { d as defineCustomElement$2 } from './tree-view.js';
+import { d as defineCustomElement$2 } from './tree-view2.js';
 
 /**
  * @description This function converts SelectorCategoryData[] SuggestData
@@ -266,7 +267,7 @@ function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["gx-ide-references", "ch-checkbox", "ch-icon", "ch-suggest", "ch-suggest-list", "ch-suggest-list-item", "ch-tree-x", "ch-tree-x-list-item", "ch-window", "ch-window-close", "gx-ide-container", "gx-ide-title", "gxg-button", "gxg-form-checkbox", "gxg-icon", "gxg-label", "gxg-suggest", "gxg-text", "gxg-title", "gxg-tooltip", "gxg-tree-view"];
+  const components = ["gx-ide-references", "ch-checkbox", "ch-icon", "ch-suggest", "ch-suggest-list", "ch-suggest-list-item", "ch-tree-view", "ch-tree-view-item", "ch-tree-view-render", "ch-window", "ch-window-close", "gx-ide-container", "gx-ide-title", "gxg-button", "gxg-form-checkbox", "gxg-icon", "gxg-label", "gxg-suggest", "gxg-text", "gxg-title", "gxg-tooltip", "gxg-tree-view"];
   components.forEach(tagName => { switch (tagName) {
     case "gx-ide-references":
       if (!customElements.get(tagName)) {
@@ -275,35 +276,40 @@ function defineCustomElement$1() {
       break;
     case "ch-checkbox":
       if (!customElements.get(tagName)) {
-        defineCustomElement$l();
+        defineCustomElement$m();
       }
       break;
     case "ch-icon":
       if (!customElements.get(tagName)) {
-        defineCustomElement$k();
+        defineCustomElement$l();
       }
       break;
     case "ch-suggest":
       if (!customElements.get(tagName)) {
-        defineCustomElement$j();
+        defineCustomElement$k();
       }
       break;
     case "ch-suggest-list":
       if (!customElements.get(tagName)) {
-        defineCustomElement$i();
+        defineCustomElement$j();
       }
       break;
     case "ch-suggest-list-item":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$i();
+      }
+      break;
+    case "ch-tree-view":
       if (!customElements.get(tagName)) {
         defineCustomElement$h();
       }
       break;
-    case "ch-tree-x":
+    case "ch-tree-view-item":
       if (!customElements.get(tagName)) {
         defineCustomElement$g();
       }
       break;
-    case "ch-tree-x-list-item":
+    case "ch-tree-view-render":
       if (!customElements.get(tagName)) {
         defineCustomElement$f();
       }