@genexus/genexus-ide-ui 0.0.60 → 0.0.62

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

@@ -1,12 +1,13 @@
 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$h } from './checkbox.js';
-import { d as defineCustomElement$g } from './icon.js';
-import { d as defineCustomElement$f } from './tree-x.js';
-import { d as defineCustomElement$e } from './tree-x-list-item.js';
-import { d as defineCustomElement$d } from './container.js';
-import { d as defineCustomElement$c } from './directory-selector.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$e } from './container.js';
+import { d as defineCustomElement$d } from './directory-selector.js';
+import { d as defineCustomElement$c } from './title.js';
 import { d as defineCustomElement$b } from './button.js';
 import { d as defineCustomElement$a } from './button-group.js';
 import { d as defineCustomElement$9 } from './form-checkbox.js';
@@ -14,7 +15,7 @@ import { d as defineCustomElement$8 } from './form-text.js';
 import { d as defineCustomElement$7 } from './icon2.js';
 import { d as defineCustomElement$6 } from './gxg-label2.js';
 import { d as defineCustomElement$5 } from './text.js';
-import { d as defineCustomElement$4 } from './title.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';
 
@@ -60,7 +61,7 @@ const convertObjectTypeToTreeItem = (objectType) => ({
   leftImgSrc: objectType.icon,
   leaf: false,
   checkbox: true,
-  class: "object-type",
+  class: "object-type tree-view-item",
   expanded: true,
   items: []
 });
@@ -70,7 +71,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*/
@@ -120,7 +121,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*/
@@ -182,11 +183,10 @@ 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$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -194,11 +194,17 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
     this.__registerHost();
     this.__attachShadow();
     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();
@@ -247,7 +253,7 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
     /*
      * 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
@@ -288,13 +294,13 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
       }
     };
     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;
@@ -314,20 +320,25 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
   }
   // 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 this; }
@@ -349,14 +360,14 @@ const GxIdeKbManagerExport$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
     "cancelCallback": [16],
     "fileName": [32],
     "exportFilePathName": [32],
-    "objectsTreeState": [32],
-    "noObjects": [32]
+    "noObjects": [32],
+    "objectsTreeState": [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", "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-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"];
   components.forEach(tagName => { switch (tagName) {
     case "gx-ide-kb-manager-export":
       if (!customElements.get(tagName)) {
@@ -365,30 +376,35 @@ function defineCustomElement$1() {
       break;
     case "ch-checkbox":
       if (!customElements.get(tagName)) {
-        defineCustomElement$h();
+        defineCustomElement$i();
       }
       break;
     case "ch-icon":
       if (!customElements.get(tagName)) {
-        defineCustomElement$g();
+        defineCustomElement$h();
       }
       break;
     case "ch-tree-x":
       if (!customElements.get(tagName)) {
-        defineCustomElement$f();
+        defineCustomElement$g();
       }
       break;
     case "ch-tree-x-list-item":
       if (!customElements.get(tagName)) {
-        defineCustomElement$e();
+        defineCustomElement$f();
       }
       break;
     case "gx-ide-container":
       if (!customElements.get(tagName)) {
-        defineCustomElement$d();
+        defineCustomElement$e();
       }
       break;
     case "gx-ide-directory-selector":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$d();
+      }
+      break;
+    case "gx-ide-title":
       if (!customElements.get(tagName)) {
         defineCustomElement$c();
       }

package/dist/components/gx-ide-kb-manager-import.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface GxIdeKbManagerImport extends Components.GxIdeKbManagerImport, HTMLElement {}
+export const GxIdeKbManagerImport: {
+  prototype: GxIdeKbManagerImport;
+  new (): GxIdeKbManagerImport;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;