@genexus/genexus-ide-ui 0.0.16 → 0.0.17

package/dist/components/gx-ide-new-kb.js

@@ -1,9 +1,8 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { L as Locale } from './locale.js';
 import { f as formSubmitValidation, r as renderFormItems, g as getSelectedGxOption } from './form-validation.js';
-import { d as defineCustomElement$j } from './icon.js';
-import { d as defineCustomElement$i } from './container.js';
-import { d as defineCustomElement$h } from './top-bar.js';
+import { d as defineCustomElement$i } from './icon.js';
+import { d as defineCustomElement$h } from './container.js';
 import { d as defineCustomElement$g } from './button.js';
 import { d as defineCustomElement$f } from './combo-box.js';
 import { d as defineCustomElement$e } from './combo-box-item.js';
@@ -124,24 +123,24 @@ const GxIdeNewKb$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
       return gxOptions;
     };
     this.createKbHandler = () => {
-      var _a, _b, _c;
+      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
       if (this.createCallback) {
         const createCallbackPromise = this.createCallback({
-          kbName: this.kbNameEl.value,
-          kbLocation: this.locationEl.value,
-          prototypingTarget: this.prototypingTargetEl.value,
-          userInterfaceLanguage: this.userInterfaceLanguageEl.value,
-          prototypingEnvironment: this.prototypingEnvironmentEl.value,
-          dataSource: this.dataSourceEl.value,
+          kbName: (_a = this.kbNameEl) === null || _a === void 0 ? void 0 : _a.value,
+          kbLocation: (_b = this.locationEl) === null || _b === void 0 ? void 0 : _b.value,
+          prototypingTarget: (_c = this.prototypingTargetEl) === null || _c === void 0 ? void 0 : _c.value,
+          userInterfaceLanguage: (_d = this.userInterfaceLanguageEl) === null || _d === void 0 ? void 0 : _d.value,
+          prototypingEnvironment: (_e = this.prototypingEnvironmentEl) === null || _e === void 0 ? void 0 : _e.value,
+          dataSource: (_f = this.dataSourceEl) === null || _f === void 0 ? void 0 : _f.value,
           frontEnds: this.getFrontEndOptionsValues(),
-          serverName: this.serverNameEl.value,
-          databaseName: this.databaseNameEl.value,
-          collation: this.collationEl.value,
-          createDataFilesInKBFolder: this.createDataFilesInKBFolderEl.checked,
-          authenticationType: this.authenticationTypeEl.value,
-          userName: (_a = this.userNameEl) === null || _a === void 0 ? void 0 : _a.value,
-          password: (_b = this.passwordEl) === null || _b === void 0 ? void 0 : _b.value,
-          savePassword: (_c = this.savePasswordEl) === null || _c === void 0 ? void 0 : _c.checked
+          serverName: (_g = this.serverNameEl) === null || _g === void 0 ? void 0 : _g.value,
+          databaseName: (_h = this.databaseNameEl) === null || _h === void 0 ? void 0 : _h.value,
+          collation: (_j = this.collationEl) === null || _j === void 0 ? void 0 : _j.value,
+          createDataFilesInKBFolder: (_k = this.createDataFilesInKBFolderEl) === null || _k === void 0 ? void 0 : _k.checked,
+          authenticationType: (_l = this.authenticationTypeEl) === null || _l === void 0 ? void 0 : _l.value,
+          userName: (_m = this.userNameEl) === null || _m === void 0 ? void 0 : _m.value,
+          password: (_o = this.passwordEl) === null || _o === void 0 ? void 0 : _o.value,
+          savePassword: (_p = this.savePasswordEl) === null || _p === void 0 ? void 0 : _p.checked
         });
         createCallbackPromise.then(formSubmitResult => {
           formSubmitValidation(formSubmitResult, this);
@@ -171,7 +170,6 @@ const GxIdeNewKb$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     this.userNameVisible = true;
     this.passwordVisible = true;
     this.savePasswordVisible = true;
-    this.hideTopBar = false;
     this.dataSources = undefined;
     this.frontEnds = undefined;
     this.isAdvanced = false;
@@ -207,7 +205,7 @@ const GxIdeNewKb$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
    *  11.RENDER() FUNCTION
    ********************************/
   render() {
-    return (h(Host, { class: "gx-ide-component" }, !this.hideTopBar ? (h("gx-ide-top-bar", { topBarTitle: this._componentLocale.componentName })) : null, h("div", { class: "gx-ide-main-wrapper gx-ide-overflow" }, h("gx-ide-container", null, h("header", { class: {
+    return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper gx-ide-overflow" }, h("gx-ide-container", null, h("header", { class: {
         "header": true,
         "grid": true,
         "header--is-advanced": this.isAdvanced
@@ -223,7 +221,6 @@ const GxIdeNewKb$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   get el() { return this; }
   static get style() { return newKbCss; }
 }, [1, "gx-ide-new-kb", {
-    "hideTopBar": [4, "hide-top-bar"],
     "dataSources": [16],
     "frontEnds": [16],
     "isAdvanced": [4, "is-advanced"],
@@ -253,7 +250,7 @@ function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["gx-ide-new-kb", "ch-icon", "gx-ide-container", "gx-ide-top-bar", "gxg-button", "gxg-combo-box", "gxg-combo-box-item", "gxg-form-checkbox", "gxg-form-checkbox-group", "gxg-form-radio", "gxg-form-text", "gxg-icon", "gxg-label", "gxg-tab", "gxg-tab-bar", "gxg-tab-button", "gxg-tabs", "gxg-title", "gxg-tooltip"];
+  const components = ["gx-ide-new-kb", "ch-icon", "gx-ide-container", "gxg-button", "gxg-combo-box", "gxg-combo-box-item", "gxg-form-checkbox", "gxg-form-checkbox-group", "gxg-form-radio", "gxg-form-text", "gxg-icon", "gxg-label", "gxg-tab", "gxg-tab-bar", "gxg-tab-button", "gxg-tabs", "gxg-title", "gxg-tooltip"];
   components.forEach(tagName => { switch (tagName) {
     case "gx-ide-new-kb":
       if (!customElements.get(tagName)) {
@@ -261,16 +258,11 @@ function defineCustomElement$1() {
       }
       break;
     case "ch-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$j();
-      }
-      break;
-    case "gx-ide-container":
       if (!customElements.get(tagName)) {
         defineCustomElement$i();
       }
       break;
-    case "gx-ide-top-bar":
+    case "gx-ide-container":
       if (!customElements.get(tagName)) {
         defineCustomElement$h();
       }

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

@@ -1,8 +1,7 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { L as Locale } from './locale.js';
-import { d as defineCustomElement$a } from './icon.js';
-import { d as defineCustomElement$9 } from './container.js';
-import { d as defineCustomElement$8 } from './top-bar.js';
+import { d as defineCustomElement$9 } from './icon.js';
+import { d as defineCustomElement$8 } from './container.js';
 import { d as defineCustomElement$7 } from './button.js';
 import { d as defineCustomElement$6 } from './form-text.js';
 import { d as defineCustomElement$5 } from './icon2.js';
@@ -18,7 +17,7 @@ const GxIdeTemplate$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     this.__registerHost();
     this.__attachShadow();
     this.componentDidRenderEvent = createEvent(this, "componentDidRenderEvent", 7);
-    this.hideTopBar = false;
+    this.mainTile = undefined;
   }
   // 6.COMPONENT LIFECYCLE METHODS //
   async componentWillLoad() {
@@ -32,19 +31,19 @@ const GxIdeTemplate$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
   // 9.LOCAL METHODS //
   // 10.RENDER() FUNCTION //
   render() {
-    return (h(Host, { class: "gx-ide-component" }, !this.hideTopBar ? (h("gx-ide-top-bar", { topBarTitle: this._componentLocale.componentName })) : null, h("div", { class: "gx-ide-main-wrapper gx-ide-overflow" }, h("gx-ide-container", { fullHeight: true, "container-title": "Header Title" }, h("p", null, "Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis natus nam, veritatis aspernatur consequatur omnis blanditiis! Praesentium, ex labore? Odit, officiis eius rerum pariatur ea dicta possimus perferendis molestiae sunt!q"), h("gxg-form-text", { label: "Name", placeholder: "Elon Musk", labelPosition: "start", centerLabel: true }), h("gxg-button", { slot: "footer" }, "Create")))));
+    return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper gx-ide-overflow" }, h("gx-ide-container", { fullHeight: true, "container-title": "Header Title" }, h("p", null, "Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis natus nam, veritatis aspernatur consequatur omnis blanditiis! Praesentium, ex labore? Odit, officiis eius rerum pariatur ea dicta possimus perferendis molestiae sunt!q"), h("gxg-form-text", { label: "Name", placeholder: "Elon Musk", labelPosition: "start", centerLabel: true }), h("gxg-button", { slot: "footer" }, "Create")))));
   }
   static get assetsDirs() { return ["gx-ide-assets/template"]; }
   get el() { return this; }
   static get style() { return templateCss; }
 }, [1, "gx-ide-template", {
-    "hideTopBar": [4, "hide-top-bar"]
+    "mainTile": [1, "main-tile"]
   }]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["gx-ide-template", "ch-icon", "gx-ide-container", "gx-ide-top-bar", "gxg-button", "gxg-form-text", "gxg-icon", "gxg-label", "gxg-title", "gxg-tooltip"];
+  const components = ["gx-ide-template", "ch-icon", "gx-ide-container", "gxg-button", "gxg-form-text", "gxg-icon", "gxg-label", "gxg-title", "gxg-tooltip"];
   components.forEach(tagName => { switch (tagName) {
     case "gx-ide-template":
       if (!customElements.get(tagName)) {
@@ -52,16 +51,11 @@ function defineCustomElement$1() {
       }
       break;
     case "ch-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$a();
-      }
-      break;
-    case "gx-ide-container":
       if (!customElements.get(tagName)) {
         defineCustomElement$9();
       }
       break;
-    case "gx-ide-top-bar":
+    case "gx-ide-container":
       if (!customElements.get(tagName)) {
         defineCustomElement$8();
       }

package/dist/components/gxg-menu.js

@@ -107,7 +107,7 @@ const GxgMenu$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.removeMouseEnter = () => {
       this.el.removeEventListener("mouseenter", this.detectMouseEnter);
     };
-    this.detectMouseEnter = (e) => {
+    this.detectMouseEnter = () => {
       //Mouse enter
       this.clearMouseOutTimeout();
     };
@@ -185,7 +185,7 @@ const GxgMenu$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   keyboardNavigationHandler(triggeredItem) {
     const triggeringItem = triggeredItem.detail.ref;
-    const triggeringItemIndex = this._enabledItems.findIndex((item, i) => {
+    const triggeringItemIndex = this._enabledItems.findIndex((item) => {
       return item === triggeringItem;
     });
     let newFocusedItem;

package/dist/components/gxg-test.js

@@ -35,7 +35,7 @@ const renderTreeItem = (item) => {
     const childrenLength = item.items ? item.items.length : 0;
     const isLeaf = childrenLength === 0 || item.leaf ? true : false;
     const lazy = !item.lazy ? false : true;
-    return (h("gxg-tree-item", { checkbox: item.checkbox, checked: item.checked, description: item.description, disabled: item.disabled, icon: item.icon, indeterminate: item.indeterminate, id: item.id, key: `tree-item-${item.id}`, label: item.label, leaf: isLeaf && !lazy, numberOfChildren: childrenLength, opened: item.opened, selected: item.selected }, [item.label, ((_a = item.items) === null || _a === void 0 ? void 0 : _a.length) && renderTreeItems(item.items, false)]));
+    return (h("gxg-tree-item", { checkbox: item.checkbox, checked: item.checked, description: item.description, disabled: item.disabled, icon: item.icon, indeterminate: item.indeterminate, id: item.id, label: item.label, leaf: isLeaf && !lazy, numberOfChildren: childrenLength, opened: item.opened, selected: item.selected }, [item.label, ((_a = item.items) === null || _a === void 0 ? void 0 : _a.length) && renderTreeItems(item.items, false)]));
 };
 
 const testCss = ".tree-buttons{margin-top:16px;display:flex;gap:8px;flex-wrap:wrap}";
@@ -75,27 +75,8 @@ const GxgTest$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.deleteNodeHandler = () => {
       this.treeItemsModel = [];
     };
-    this.getIconState = (state) => {
-      let icon = h("gxg-icon", { type: "gx-server/private" });
-      switch (state) {
-        case "inserted":
-          icon = h("gxg-icon", { type: "gx-server/new", color: "success" });
-          break;
-        case "modified":
-          icon = (h("gxg-icon", { type: "gx-server/changes-commit-pending", color: "primary-active" }));
-          break;
-        case "deleted":
-          icon = h("gxg-icon", { type: "gx-server/delete", color: "error" });
-          break;
-        case "conflicted":
-          icon = h("gxg-icon", { type: "gx-server/conflict", color: "warning" });
-          break;
-      }
-      return icon;
-    };
   }
   toggleIconClickedHandler(e) {
-    console.log("hola");
     const treeItemId = e.detail.id;
     const isLazy = e.detail.lazy;
     if (this.lazyLoadTreeItemsCallback && isLazy) {
@@ -118,9 +99,9 @@ const GxgTest$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       ];
     }
     else if (this.showGrid) {
-      return (h("gxg-grid", null, h("ch-grid", { "row-selection-mode": "none", part: "ch-grid-pending-for-updates", class: "no-border" }, h("ch-grid-columnset", null, h("ch-grid-column", { settingable: false, sortable: false, "column-type": "rich", "rich-row-selector": true, "rich-row-selector-mode": "mark" }), h("ch-grid-column", { "column-name": "name", "column-name-position": "text", settingable: false }), h("ch-grid-column", { "column-name": "productos", "column-name-position": "text", settingable: false })), this.showGridData && [
-        h("ch-grid-row", { rowid: "123" }, h("ch-grid-cell", { ref: (el) => (el.type = "rich") }), h("ch-grid-cell", null, "Nombre"), h("ch-grid-cell", null, "Productos")),
-        h("ch-grid-rowset", null, h("ch-grid-rowset-legend", null, "Identidad"), h("ch-grid-row", { rowSelector: true }, h("ch-grid-cell", { rowSelector: true }), h("ch-grid-cell", null, "Nombre"), h("ch-grid-cell", null, "Productos")), h("ch-grid-row", null, h("ch-grid-cell", null), h("ch-grid-cell", null, "English"), h("ch-grid-cell", null, "Products")), h("ch-grid-row", null, h("ch-grid-cell", null), h("ch-grid-cell", null, "Portugu\u00EAs"), h("ch-grid-cell", null, "Produtos"))),
+      return (h("gxg-grid", null, h("ch-grid", { "row-selection-mode": "multiple", part: "ch-grid-pending-for-updates", class: "no-border" }, h("ch-grid-columnset", null, h("ch-grid-column", { settingable: false, sortable: false, "column-type": "rich", "rich-row-selector": true, "rich-row-selector-mode": "mark" }), h("ch-grid-column", { "column-name": "name", "column-name-position": "text", settingable: false }), h("ch-grid-column", { "column-name": "productos", "column-name-position": "text", settingable: false })), this.showGridData && [
+        h("ch-grid-row", { rowid: "123" }, h("ch-grid-cell", { "cell-type": "rich", "row-selector": true }), h("ch-grid-cell", null, "Nombre"), h("ch-grid-cell", null, "Productos")),
+        h("ch-grid-rowset", null, h("ch-grid-rowset-legend", null, "Identidad"), h("ch-grid-row", null, h("ch-grid-cell", { "cell-type": "rich", "row-selector": true }), h("ch-grid-cell", null, "Nombre"), h("ch-grid-cell", null, "Productos")), h("ch-grid-row", null, h("ch-grid-cell", { "cell-type": "rich", "row-selector": true }), h("ch-grid-cell", null, "English"), h("ch-grid-cell", null, "Products")), h("ch-grid-row", null, h("ch-grid-cell", { "cell-type": "rich", "row-selector": true }), h("ch-grid-cell", null, "Portugu\u00EAs"), h("ch-grid-cell", null, "Produtos"))),
       ])));
     }
     else {