@genexus/genexus-ide-ui 0.0.59 → 0.0.61

package/dist/collection/components/file-selector/file-selector.js

@@ -0,0 +1,185 @@
+/* STENCIL IMPORTS */
+import { Host, h } from "@stencil/core";
+/* OTHER LIBRARIES IMPORTS */
+/* CUSTOM IMPORTS */
+export class GxIdeFileSelector {
+  constructor() {
+    this.evaluateLabelPosition = () => {
+      if (this.label && this.labelPosition === "above") {
+        this.centerLabel = false;
+      }
+    };
+    // 7.LISTENERS //
+    // 8.PUBLIC METHODS API //
+    // 9.LOCAL METHODS //
+    this.btnSelectClickHandler = () => { };
+    this.accessibilityLabels = {
+      buttonSelectLabel: "selects a file from the user file system"
+    };
+    this.label = undefined;
+    this.labelPosition = "start";
+    this.centerLabel = true;
+    this.labelWidth = undefined;
+    this.selectDirectoryCallback = undefined;
+    this.value = undefined;
+  }
+  // 2. REFERENCE TO ELEMENTS //
+  // 3.STATE() VARIABLES //
+  // 4.PUBLIC PROPERTY API | WATCH'S //
+  // 5.EVENTS (EMIT) //
+  // 6.METHODS //
+  componentWillLoad() {
+    this.evaluateLabelPosition();
+  }
+  // 10.RENDER() FUNCTION //
+  render() {
+    var _a;
+    return (h(Host, null, this.label ? (h("gxg-label", { labelPosition: this.labelPosition, center: this.centerLabel }, this.label)) : null, h("div", { class: "wrapper" }, h("gxg-form-text", { part: "input", value: this.value }), h("gxg-button", { part: "button-select", onClick: this.btnSelectClickHandler, "aria-label": (_a = this.accessibilityLabels) === null || _a === void 0 ? void 0 : _a.buttonSelectLabel, type: "secondary-icon-only", icon: "gemini-tools/folder", disabled: !this.selectDirectoryCallback }))));
+  }
+  static get is() { return "gx-ide-file-selector"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["file-selector.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["file-selector.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "accessibilityLabels": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "FileSelectorLabels",
+          "resolved": "{ buttonSelectLabel: string; }",
+          "references": {
+            "FileSelectorLabels": {
+              "location": "local"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "This property provides the user a way to define custom aria-label descriptions."
+        },
+        "defaultValue": "{\n    buttonSelectLabel: \"selects a file from the user file system\"\n  }"
+      },
+      "label": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "The label associated with the input (optional)"
+        },
+        "attribute": "label",
+        "reflect": false
+      },
+      "labelPosition": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "LabelPosition",
+          "resolved": "\"above\" | \"start\"",
+          "references": {
+            "LabelPosition": {
+              "location": "local"
+            }
+          }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "The label position"
+        },
+        "attribute": "label-position",
+        "reflect": true,
+        "defaultValue": "\"start\""
+      },
+      "centerLabel": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Centers the label"
+        },
+        "attribute": "center-label",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "labelWidth": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The label width"
+        },
+        "attribute": "label-width",
+        "reflect": false
+      },
+      "selectDirectoryCallback": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "() => Promise<string>",
+          "resolved": "() => Promise<string>",
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Callback that will be called when the user presses the action button. Returns the new value (directory path) assigned to the component."
+        }
+      },
+      "value": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Value currently assigned."
+        },
+        "attribute": "value",
+        "reflect": false
+      }
+    };
+  }
+}

package/dist/collection/components/kb-manager-export/gx-ide-assets/kb-manager-export/langs/kb-manager-export.lang.en.json

@@ -8,6 +8,7 @@
   },
   "main": {
     "addKnowledgeBaseDescription": "Add Knowledge Base / Version / Environment properties to list",
+    "addKnowledgeBaseDescriptionShort": "Add",
     "exportAll": "Export All"
   },
   "footer": {

package/dist/collection/components/kb-manager-export/helpers.js

@@ -162,6 +162,5 @@ export const clearKbPropertiesFromTree = (actualTreeState) => {
       updatedTreeData.splice(i, 1);
     }
   }
-  console.log("updatedTreeData", updatedTreeData);
   return updatedTreeData;
 };

package/dist/collection/components/kb-manager-export/kb-manager-export.css

@@ -176,11 +176,14 @@ gxg-tabs {
   gap: var(--gx-ide-grid-column-gap);
   border-bottom: 1px solid var(--gx-ide-container-border-color);
 }
+.checkboxes-wrapper .add-checkbox {
+  display: flex;
+}
 
 .tree-container {
   display: flex;
-  min-height: 100px;
-  max-height: 200px;
+  min-height: 150px;
+  max-height: 350px;
   padding-left: var(--gx-ide-grid-column-gap);
   width: 100%;
   box-sizing: border-box;

package/dist/collection/components/kb-manager-export/kb-manager-export.js

@@ -11,6 +11,10 @@ export class GxIdeKbManagerExport {
     // 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();
@@ -61,7 +65,7 @@ export class GxIdeKbManagerExport {
     /*
      * 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
@@ -102,13 +106,13 @@ export class GxIdeKbManagerExport {
       }
     };
     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;
@@ -128,20 +132,19 @@ export class GxIdeKbManagerExport {
   }
   // 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();
   }
   // 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 =
+    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" }, 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("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: {
         "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", { positionRelative: true, treeModel: this.objectsTreeState, 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, 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 is() { return "gx-ide-kb-manager-export"; }
   static get encapsulation() { return "shadow"; }
@@ -373,8 +376,8 @@ export class GxIdeKbManagerExport {
     return {
       "fileName": {},
       "exportFilePathName": {},
-      "objectsTreeState": {},
-      "noObjects": {}
+      "noObjects": {},
+      "objectsTreeState": {}
     };
   }
   static get events() {

package/dist/collection/components/kb-manager-import/gx-ide-assets/kb-manager-import/langs/kb-manager-import.lang.en.json

@@ -0,0 +1,31 @@
+{
+  "header": {
+    "fileNameLabel": "Select a file:",
+    "fileNamePlaceholder": "Allowed files extensions: .xpz/.xml",
+    "selectFileButton": "Select File",
+    "loadButton": "Load"
+  },
+  "main": {
+    "objectsInFile": {
+      "title": "Objects in File",
+      "selectAll": "Click to select all",
+      "deselectAll": "Click to deselect all",
+      "importButton": "Import",
+      "cancelButton": "Cancel",
+      "optionsButton": "Options"
+    },
+    "importStatus": {
+      "title": "Import Status",
+      "clearButton": "Clear Status",
+      "noImportedFiles": "There are no imported files yet",
+      "importedButHidden": "There are imported files, but all are hidden. Try by activating errors, warnings or success"
+    }
+  },
+  "footer": {
+    "selectDeselectAll": "Select All | Deselect All",
+    "errorsButton": "Errors",
+    "warningsButton": "Warnings",
+    "successButton": "Success",
+    "clearStatusButton": "Clear Status"
+  }
+}

package/dist/collection/components/kb-manager-import/gx-ide-assets/kb-manager-import/langs/kb-manager-import.lang.ja.json

@@ -0,0 +1,3 @@
+{
+  "presentation": "「こんにちは、私の名前は {0} です。オレゴンに住んでいます。」"
+}

package/dist/collection/components/kb-manager-import/gx-ide-assets/kb-manager-import/langs/kb-manager-import.lang.zh.json

@@ -0,0 +1,3 @@
+{
+  "presentation": "你好，我的名字是 {0}，我住在俄勒冈州。"
+}

package/dist/collection/components/kb-manager-import/helpers.js

@@ -0,0 +1,128 @@
+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"
+    });
+  });
+  return importTreeItems;
+};
+/**
+ * @description This function converts ReferenceData[] data to TreeItemData[]
+ */
+export 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",
+      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.
+ */
+export 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;
+};