@genexus/genexus-ide-ui 0.0.60 → 0.0.62

package/dist/esm/gx-ide-kb-manager-export.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-0da01575.js';
 import { L as Locale } from './locale-e183487a.js';
-import { c as config } from './config-9b4321f9.js';
+import { c as config } from './config-ee66bdf4.js';
 
 /*
 INDEX:
@@ -44,7 +44,7 @@ const convertObjectTypeToTreeItem = (objectType) => ({
   leftImgSrc: objectType.icon,
   leaf: false,
   checkbox: true,
-  class: "object-type",
+  class: "object-type tree-view-item",
   expanded: true,
   items: []
 });
@@ -54,7 +54,7 @@ const convertObjectToTreeItem = (object, objectTypes) => ({
   id: object.id,
   leftImgSrc: getObjectIcon(object.typeId, objectTypes),
   checkbox: true,
-  class: "object",
+  class: "object tree-view-item",
   leaf: true
 });
 /* 4. getObjectType*/
@@ -104,7 +104,7 @@ const convertPropertyToTreeItem = (property, kbPropertiesTypes) => ({
   id: property.id,
   leftImgSrc: getPropertyIcon(property.typeId, kbPropertiesTypes),
   checkbox: true,
-  class: "property",
+  class: "property tree-view-item",
   leaf: true
 });
 /* 8. convertObjectDataToTreeItemData*/
@@ -166,21 +166,26 @@ const clearKbPropertiesFromTree = (actualTreeState) => {
       updatedTreeData.splice(i, 1);
     }
   }
-  console.log("updatedTreeData", updatedTreeData);
   return updatedTreeData;
 };
 
-const kbManagerExportCss = ".gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--gray-01)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){box-shadow:var(--box-shadow-01) !important;height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--font-weight-regular);font-size:var(--font-size-lg);line-height:1.6em;height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:6px;height:6px}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-main .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:6px;height:6px}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-overflow .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.tree-view-container{display:flex}.header{display:grid;gap:var(--gx-ide-grid-column-gap);grid-template-columns:1fr auto;grid-template-areas:\"select-directory export-cancel-buttons-group options-btn\"}.header .select-directory{grid-area:select-directory}.header .export-cancel-buttons-group{grid-area:export-cancel-buttons-group}.header .options-btn{grid-area:options-btn}.checkboxes-wrapper{padding:var(--gx-ide-grid-column-gap);display:flex;flex-wrap:wrap;gap:var(--gx-ide-grid-column-gap);border-bottom:1px solid var(--gx-ide-container-border-color)}.tree-container{display:flex;min-height:100px;max-height:200px;padding-left:var(--gx-ide-grid-column-gap);width:100%;box-sizing:border-box}.tree-container--empty{padding-left:0;align-items:center;justify-content:center}.footer-right-wrapper{display:grid;gap:var(--gx-ide-grid-column-gap);grid-template-columns:100px 100px}";
+const kbManagerExportCss = ".gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--gray-01)}ch-grid-column{padding-inline-start:--gxg-container--padding;padding-inline-end:--gxg-container--padding}ch-grid-cell{--spacing-comp-02:var(--gxg-container--padding)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){box-shadow:var(--box-shadow-01) !important;height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--font-weight-regular);font-size:var(--font-size-lg);font-family:var(--font-family-primary);line-height:1.6em;height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:6px;height:6px}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-main .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:6px;height:6px}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-overflow .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.tree-container{display:flex;height:100%;width:100%;box-sizing:border-box}.tree-view-container{display:flex}.header__top{border-top:1px solid var(--gx-ide-container-border-color);display:grid;padding:var(--gxg-container--padding) var(--gxg-container--padding) 0 var(--gxg-container--padding);gap:var(--gx-ide-grid-column-gap);grid-template-columns:1fr auto;grid-template-areas:\"select-directory export-cancel-buttons-group options-btn\"}.header__top .select-directory{grid-area:select-directory}.header__top .export-cancel-buttons-group{grid-area:export-cancel-buttons-group}.header__top .options-btn{grid-area:options-btn}.header__bottom .checkboxes-wrapper{padding:var(--gx-ide-grid-column-gap);display:flex;flex-wrap:wrap;gap:var(--gx-ide-grid-column-gap)}.header__bottom .checkboxes-wrapper .add-checkbox{display:flex}.tree-container--empty{align-items:center;justify-content:center}.tree-container .gx-ide-message{padding:100px 0}.footer-right-wrapper{display:grid;gap:var(--gx-ide-grid-column-gap);grid-template-columns:100px 100px}";
 
 const GxIdeKbManagerExport = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.componentDidLoadEvent = createEvent(this, "componentDidLoadEvent", 7);
+    this.componentDidRenderFirstTime = createEvent(this, "componentDidRenderFirstTime", 7);
     this.checkedObjectsIds = [];
     this.checkedPropertiesIds = [];
+    this.renderedFirstTime = false;
     // 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.optionsCallbackHandler = () => {
       if (this.optionsCallback) {
         this.optionsCallback();
@@ -229,7 +234,7 @@ const GxIdeKbManagerExport = class {
     /*
      * Update checked objects 'checkedObjectsArray' array. Used for the 'addReferencesCallback'
      */
-    this.treeObjectsCheckedItemsChangedHandler = (event) => {
+    this.objectsTreeCheckedItemsChangedHandler = (event) => {
       const allItemsWithCheckbox = [...event.detail.values()];
       const checkedItems = allItemsWithCheckbox.filter(node => node.item.checked);
       // objects checked
@@ -270,13 +275,13 @@ const GxIdeKbManagerExport = class {
       }
     };
     this.clearButtonHandler = () => {
-      console.log(this.objectsTreeEl);
+      /* revisar*/
       this.objectsTreeEl.updateAllItemsProperties({ checked: false });
     };
     this.fileName = "";
     this.exportFilePathName = undefined;
-    this.objectsTreeState = [];
     this.noObjects = undefined;
+    this.objectsTreeState = [];
     this.dummyInitialTree = undefined;
     this.kbPropertiesTypes = undefined;
     this.objectTypes = undefined;
@@ -296,20 +301,25 @@ const GxIdeKbManagerExport = class {
   }
   // 6.COMPONENT LIFECYCLE EVENTS //
   async componentWillLoad() {
-    var _a;
     this._componentLocale = await Locale.getComponentStrings(this.el);
     this.componentDidLoadEvent.emit(true);
-    this.noObjects = !!(((_a = this.objectsTreeState) === null || _a === void 0 ? void 0 : _a.length) === 0 || !this.objectsTreeState);
+    this.evaluateObjects();
+  }
+  componentDidRender() {
+    if (!this.renderedFirstTime) {
+      this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
+      this.renderedFirstTime = true;
+    }
   }
   // 10.RENDER() FUNCTION //
   render() {
-    return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { noContentPadding: true }, h("header", { slot: "header", class: "header" }, 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", onClick: this.cancelCallbackHandler }, 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" }, 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("main", { class: { main: true } }, 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: {
+    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: {
         "tree-container": true,
         "tree-container--empty": this.noObjects
       } }, !this.noObjects ? (
     /* objects tree */
-    h("gxg-tree-view", { positionRelative: true, treeModel: this.objectsTreeState, toggleCheckboxes: true, onCheckedItemsChange: this.treeObjectsCheckedItemsChangedHandler, 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, part: "referenced-by-text" }, "There are no Objects to display. ", h("br", null), "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))))));
+    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))))));
   }
   static get assetsDirs() { return ["gx-ide-assets/kb-manager-export"]; }
   get el() { return getElement(this); }

package/dist/esm/gx-ide-kb-manager-import.entry.js

@@ -0,0 +1,348 @@
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-0da01575.js';
+import { L as Locale } from './locale-e183487a.js';
+import { c as config } from './config-ee66bdf4.js';
+import { c as countTreeItems } from './helpers-c29a9591.js';
+
+const convertImportItemToTreeItem = (importCatIcon, importItems) => {
+  const importTreeItems = [];
+  importItems.forEach(importItem => {
+    importTreeItems.push({
+      id: importItem.id,
+      caption: importItem.name,
+      leftImgSrc: importCatIcon,
+      checkbox: true,
+      expanded: true,
+      leaf: true,
+      class: "object tree-view-item"
+    });
+  });
+  return importTreeItems;
+};
+/**
+ * @description This function converts ReferenceData[] data to TreeItemData[]
+ */
+const convertImportCategoryToTreeView = (importCategoryData) => {
+  const treeData = [];
+  if (!importCategoryData) {
+    return treeData;
+  }
+  importCategoryData.forEach(importCat => {
+    const importCategoryTreeItem = {
+      id: importCat.id,
+      caption: `${importCat.name} (${importCat.items.length})`,
+      leftImgSrc: importCat.icon,
+      checkbox: true,
+      expanded: true,
+      leaf: false,
+      class: "category tree-view-item",
+      items: convertImportItemToTreeItem(importCat.icon, importCat.items)
+    };
+    treeData.push(importCategoryTreeItem);
+  });
+  return treeData;
+};
+const createImportResultDataMessages = (importItemId, messagesArray) => {
+  const messages = [];
+  messagesArray.forEach((message, i) => {
+    messages.push({
+      id: `${importItemId}-message-${i}}]`,
+      caption: message,
+      leftImgSrc: "gx-test/test-results",
+      leaf: true
+    });
+  });
+  return messages;
+};
+const updateImportStatusTree = (importItemResultFullData, importTreeActualState) => {
+  var _a;
+  const objectCategoryIndex = importTreeActualState.findIndex(objectCategoryItem => {
+    return objectCategoryItem.id === importItemResultFullData.categoryId;
+  });
+  if (objectCategoryIndex === -1) {
+    // object category node does not exists. We have to create it, and insert the import result tree node inside.
+    const importTreeItem = {
+      id: importItemResultFullData.categoryId,
+      // the count is (1), because this is the first item for this category
+      caption: `${importItemResultFullData.categoryName} (1)`,
+      leftImgSrc: importItemResultFullData.categoryIcon,
+      class: `tree-view-item tree-view-item--${importItemResultFullData.status}`,
+      expanded: true,
+      items: [
+        {
+          id: importItemResultFullData.id,
+          caption: importItemResultFullData.name,
+          items: createImportResultDataMessages(importItemResultFullData.id, importItemResultFullData.messages),
+          class: `tree-view-item tree-view-item--${importItemResultFullData.status}`,
+          expanded: true,
+          leaf: importItemResultFullData.messages.length === 0
+        }
+      ]
+    };
+    importTreeActualState.push(importTreeItem);
+  }
+  else {
+    // Object category node already exists. Just create the import result node, and insert into the parent category node (if it doesn't exists already).
+    // first search for the importItemResult node...
+    const importItemIndex = (_a = importTreeActualState[objectCategoryIndex].items) === null || _a === void 0 ? void 0 : _a.findIndex(importItem => {
+      return importItem.id === importItemResultFullData.id;
+    });
+    if (importItemIndex === -1) {
+      // ImportItem does not exists already
+      const importTreeItem = {
+        id: importItemResultFullData.id,
+        caption: importItemResultFullData.name,
+        expanded: true,
+        items: createImportResultDataMessages(importItemResultFullData.id, importItemResultFullData.messages),
+        class: `tree-view-item tree-view-item--${importItemResultFullData.status}`
+      };
+      // Insert the import node into the category node
+      importTreeActualState[objectCategoryIndex].items.push(importTreeItem);
+      // Then, update the category node caption (the name is the same, but the (count) should be the actual items.length, because we have just added a new child import node. )
+      importTreeActualState[objectCategoryIndex].caption = `${importItemResultFullData.categoryName} (${importTreeActualState[objectCategoryIndex].items.length})`;
+    }
+  }
+  return importTreeActualState;
+};
+/**
+ * This function takes an ImportItemResultData item, and updates it to a ImportCategoryFullData, which has the same information, plus the category parent needed information, that will be used for creating the "virtual" parent category node on the "Import Status" section.
+ */
+const createImportResultFullData = (importItemResultData, importCategoryData) => {
+  const importCategoryFullData = Object.assign({ categoryId: undefined, categoryName: undefined, categoryIcon: undefined }, importItemResultData);
+  importCategoryDataFor: for (let i = 0; i < importCategoryData.length; i++) {
+    const categoryNode = importCategoryData[i];
+    for (let j = 0; j < categoryNode.items.length; j++) {
+      if (categoryNode.items[j].id === importItemResultData.id) {
+        importCategoryFullData.categoryId = categoryNode.id;
+        importCategoryFullData.categoryName = categoryNode.name;
+        importCategoryFullData.categoryIcon = categoryNode.icon;
+        break importCategoryDataFor;
+      }
+    }
+  }
+  return importCategoryFullData;
+};
+/**
+ * @description This function adds an ImportItemResultData item to the "importTreeState", and returns the updated tree with the new item added.
+ */
+const addImportItemResultDataItem = (importItemResultData, importCategoryData, importTreeActualState) => {
+  let updatedImportStatusTree = [...importTreeActualState];
+  // first, update importItemResultData with the category data. It will be needed later.
+  const importItemResultFullData = createImportResultFullData(importItemResultData, importCategoryData);
+  updatedImportStatusTree = updateImportStatusTree(importItemResultFullData, updatedImportStatusTree);
+  return updatedImportStatusTree;
+};
+
+const kbManagerImportCss = ".gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--gray-01)}ch-grid-column{padding-inline-start:--gxg-container--padding;padding-inline-end:--gxg-container--padding}ch-grid-cell{--spacing-comp-02:var(--gxg-container--padding)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){box-shadow:var(--box-shadow-01) !important;height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--font-weight-regular);font-size:var(--font-size-lg);font-family:var(--font-family-primary);line-height:1.6em;height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:6px;height:6px}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-main .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:6px;height:6px}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-overflow .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.tree-container{display:flex;height:100%;width:100%;box-sizing:border-box}:host{display:block}.header{display:flex;flex-direction:row;gap:var(--gx-ide-grid-column-gap)}.header .select-file{flex:1}.main{height:100%;display:flex}.main>*{flex:1}.main .left-grid-item{border-right:1px solid var(--gx-ide-container-border-color)}.main .gx-ide-message{padding:50px 0}.main .tree-container{}.main .tree-container--empty{align-items:center;justify-content:center}.main .tree-container--import-status .tree-view-item--success::part(action){grid-template:\"first-img left-img text right-img\"/max-content max-content 1fr max-content}.main .tree-container--import-status .tree-view-item--success::part(action)::before{grid-area:first-img;content:\"\";width:var(--spacing-comp-02);height:var(--spacing-comp-02);border-radius:50%;background-color:var(--gray-03);background-color:var(--color-success-dark)}.main .tree-container--import-status .tree-view-item--warning::part(action){grid-template:\"first-img left-img text right-img\"/max-content max-content 1fr max-content}.main .tree-container--import-status .tree-view-item--warning::part(action)::before{grid-area:first-img;content:\"\";width:var(--spacing-comp-02);height:var(--spacing-comp-02);border-radius:50%;background-color:var(--gray-03);background-color:var(--color-warning-dark)}.main .tree-container--import-status .tree-view-item--error::part(action){grid-template:\"first-img left-img text right-img\"/max-content max-content 1fr max-content}.main .tree-container--import-status .tree-view-item--error::part(action)::before{grid-area:first-img;content:\"\";width:var(--spacing-comp-02);height:var(--spacing-comp-02);border-radius:50%;background-color:var(--gray-03);background-color:var(--color-error-dark)}.main .tree-container--no-warnings .tree-view-item--warning{display:none}.main .tree-container--no-errors .tree-view-item--error{display:none}.main .tree-container--no-successes .tree-view-item--success{display:none}.ghost-element{display:block;width:0;height:24px;}";
+
+const GxIdeKbManagerImport = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.componentDidRenderFirstTime = createEvent(this, "componentDidRenderFirstTime", 7);
+    this.componentDidLoadEvent = createEvent(this, "componentDidLoadEvent", 7);
+    this.renderedFirstTime = false;
+    /* ImportCategoryBasicData Holds the original name of category data, and its id. Used to create parent nodes on the imported tree*/
+    this.importCategoryData = [];
+    this.objectsInFileTotalNodes = 0;
+    // 9.LOCAL METHODS //
+    this.evaluateObjects = () => {
+      var _a;
+      this.noObjects = !!(((_a = this.objectsTreeState) === null || _a === void 0 ? void 0 : _a.length) === 0 || !this.objectsTreeState);
+    };
+    this.evaluateImport = () => {
+      var _a;
+      this.noImport = !!(((_a = this.importTreeState) === null || _a === void 0 ? void 0 : _a.length) === 0 || !this.importTreeState);
+    };
+    this.selectFileHandler = () => {
+      this.fileInputEl.openFile();
+    };
+    this.loadFileHandler = async () => {
+      if (this.loadCallback && this.selectedFile) {
+        this.importCategoryData = await this.loadCallback(this.selectedFile);
+        const importCategoryTreeData = convertImportCategoryToTreeView(this.importCategoryData);
+        this.objectsTreeState = importCategoryTreeData;
+        if (this.importCategoryData.length > 0) {
+          // clear input
+          this.selectedFile = null;
+        }
+      }
+    };
+    this.fileSelectedHandler = (fileEvent) => {
+      this.selectedFile = fileEvent.detail[0];
+    };
+    this.evaluateHeaderActiveButton = () => {
+      if (!this.selectedFile) {
+        this.headerButtonsGroup.activeButtonId = "select-file-btn";
+        this.fileInputEl.value = undefined;
+      }
+      else {
+        this.headerButtonsGroup.activeButtonId = "load-file-btn";
+      }
+    };
+    this.importObjectsHandler = async () => {
+      if (this.importCallback) {
+        this.importingObjects = true;
+        this.objectsButtonsGroup.activeButtonId = "cancel-import-btn";
+        const result = await this.importCallback(this.checkedObjectsIds);
+        if (result || result === false) {
+          this.importingObjects = false;
+          this.objectsButtonsGroup.activeButtonId = "import-btn";
+        }
+      }
+    };
+    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");
+      const checkedObjectsIds = [];
+      if (checkedObjects.length > 0) {
+        checkedObjects.forEach(objectChecked => {
+          checkedObjectsIds.push(objectChecked.item.id);
+        });
+      }
+      this.checkedObjectsIds = checkedObjectsIds;
+    };
+    this.cancelImportHandler = () => {
+      if (this.cancelCallback) {
+        this.cancelCallback();
+        // returns boolean
+      }
+    };
+    this.optionsHandler = () => {
+      if (this.optionsCallback) {
+        this.optionsCallback();
+        // returns boolean
+      }
+    };
+    this.clearStatusHandler = () => {
+      this.importTreeState = [];
+      this.statusInfo.error.number = 0;
+      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.statusButtonsSelectionChangedHandler = (e) => {
+      const activeStates = e.detail;
+      const newStatusInfo = Object.assign({}, this.statusInfo);
+      newStatusInfo.warning.display = false;
+      newStatusInfo.error.display = false;
+      newStatusInfo.success.display = false;
+      activeStates.forEach(activeState => {
+        const status = activeState.itemId;
+        newStatusInfo[status].display = true;
+        this.statusInfo = newStatusInfo;
+      });
+      this.evaluateHiddenImportsMessage();
+    };
+    this.evaluateCheckAllValue = () => {
+      let checked = true;
+      const allAreChecked = this.objectsInFileTotalNodes === this.checkedObjectsIds.length;
+      const conditionToUncheck = this.objectsTreeState.length === 0 || !allAreChecked;
+      if (conditionToUncheck) {
+        checked = false;
+      }
+      return checked;
+    };
+    this.evaluateHiddenImportsMessage = () => {
+      /* to do*/
+    };
+    this.checkedObjectsIds = [];
+    this.noObjects = undefined;
+    this.showHiddenImportsMessage = false;
+    this.statusInfo = {
+      error: {
+        display: true,
+        number: 0
+      },
+      warning: {
+        display: true,
+        number: 0
+      },
+      success: {
+        display: true,
+        number: 0
+      }
+    };
+    this.objectsTreeState = [];
+    this.noImport = undefined;
+    this.importTreeState = [];
+    this.importingObjects = false;
+    this.selectedFile = undefined;
+    this.optionsCallback = undefined;
+    this.importCallback = undefined;
+    this.loadCallback = undefined;
+    this.cancelCallback = undefined;
+    this.statusMinimal = false;
+  }
+  watchObjectsTreeStateHandler(newState) {
+    this.noObjects = !!(newState.length === 0 || !newState);
+    this.objectsInFileTotalNodes = countTreeItems(newState);
+  }
+  watchImportTreeStateHandler(newState) {
+    this.noImport = !!(newState.length === 0 || !newState);
+  }
+  watchSelectedFileHandler() {
+    this.evaluateHeaderActiveButton();
+  }
+  // 6.COMPONENT LIFECYCLE EVENTS //
+  async componentWillLoad() {
+    this._componentLocale = await Locale.getComponentStrings(this.el);
+    this.componentDidLoadEvent.emit(true);
+    this.evaluateObjects();
+    this.evaluateImport();
+  }
+  componentDidRender() {
+    if (!this.renderedFirstTime) {
+      this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
+      this.renderedFirstTime = true;
+    }
+  }
+  // 7.LISTENERS //
+  // 8.PUBLIC METHODS API //
+  /**
+   * Add the result of importing an item
+   */
+  async addResultItem(item) {
+    this.importTreeState = addImportItemResultDataItem(item, this.importCategoryData, this.importTreeState);
+    this.statusInfo[`${item.status}`].number += item.messages.length;
+  }
+  //  10.RENDER() FUNCTION //
+  render() {
+    return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { noContentPadding: true, noFooterPadding: true, containerTitle: this._componentLocale.componentName }, h("header", { class: "header", slot: "header" }, h("gxg-form-text", { type: "file", class: "select-file", label: this._componentLocale.header.fileNameLabel, placeholder: this._componentLocale.header.fileNamePlaceholder, part: "file-name", acceptFile: ".xpz, .xml", clearButton: true, iconPosition: "start", onFileSelected: this.fileSelectedHandler, ref: (el) => (this.fileInputEl = el) }), h("gxg-button-group", {
+      // default-selected-btn-id="select-file-btn"
+      ref: (el) => (this.headerButtonsGroup = el)
+    }, h("button", { id: "select-file-btn", part: "select-file-button", onClick: this.selectFileHandler }, this._componentLocale.header.selectFileButton), h("button", { id: "load-file-btn", part: "load-file-button", disabled: !this.selectedFile, onClick: this.loadFileHandler }, this._componentLocale.header.loadButton))), h("main", { class: "main" }, h("gx-ide-container", { containerTitle: this._componentLocale.main.objectsInFile.title, noContentPadding: true, noBorderFooter: true, class: "left-grid-item", slimmerFooter: true, inactiveTitle: this.noObjects, footerSubtleShadow: !this.noObjects, titleType: "secondary" }, h("div", { class: {
+        "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.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,
+        "tree-container--empty": this.noImport,
+        "tree-container--no-warnings": !this.statusInfo.warning.display,
+        "tree-container--no-errors": !this.statusInfo.error.display,
+        "tree-container--no-successes": this.statusInfo.success.display === false
+      } }, !this.noImport ? (h("gxg-tree-view", { treeModel: this.importTreeState, toggleCheckboxes: true, 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, part: "objects-in-file-empty-status-message", class: "gx-ide-message" }, "There are no Imported files."))), h("gxg-text", { type: "button-like", slot: "footer-end", part: "select-kb-btn", onClick: this.clearStatusHandler, disabled: this.noImport }, this._componentLocale.main.importStatus.clearButton), h("span", { class: "ghost-element", slot: "footer-start" }))), h("footer", { slot: "footer-start" }, h("gx-ide-status-buttons", { errors: this.statusInfo.error.number, warnings: this.statusInfo.warning.number, successes: this.statusInfo.success.number, compact: true, noBorderTop: true, noBorderBottom: true, noBorderStart: true, minimal: this.statusMinimal, onSelectionChanged: this.statusButtonsSelectionChangedHandler }))), h("gxg-ide-loader", { description: "Importing objects..." }))));
+  }
+  static get assetsDirs() { return ["gx-ide-assets/kb-manager-import"]; }
+  get el() { return getElement(this); }
+  static get watchers() { return {
+    "objectsTreeState": ["watchObjectsTreeStateHandler"],
+    "importTreeState": ["watchImportTreeStateHandler"],
+    "selectedFile": ["watchSelectedFileHandler"]
+  }; }
+};
+GxIdeKbManagerImport.style = kbManagerImportCss;
+
+export { GxIdeKbManagerImport as gx_ide_kb_manager_import };