@genexus/genexus-ide-ui 0.0.98 → 0.0.100

package/dist/genexus-ide-ui/p-75f0ba9d.entry.js

@@ -0,0 +1,273 @@
+import { r as t, c as i, a as e, h as r, H as o, g as a } from "./p-2776d2f9.js";
+
+import { L as s } from "./p-74d59062.js";
+
+import { c as n } from "./p-9c1b4eb9.js";
+
+import { g as l } from "./p-6893ccb8.js";
+
+const d = '.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}.overflow-auto{overflow:auto}.justify-start{display:flex;justify-content:start}.justify-center{display:flex;justify-content:center}.justify-end{display:flex;justify-content: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(--mer-color__neutral-gray--800)}ch-grid-column:first-child{padding-inline-start:var(--gx-ide-container__padding) !important}ch-grid-column:last-child{padding-inline-end:var(--gx-ide-container__padding) !important}ch-grid-cell{--mer-spacing--xs:var(--gx-ide-container__padding)}.layout{display:grid;gap:var(--mer-spacing--lg);box-sizing:border-box}.layout--two-cols{grid-template-columns:1fr 1fr}.layout--space-above{padding-block-start:var(--mer-spacing--lg)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){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(--mer-font__weight--regular);font-size:var(--mer-font__size--xs);font-family:var(--mer-font-family--primary);height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.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;border:1px solid var(--gxg-border-color--regular);background-color:var(--color-background)}.filter-grid{display:grid;padding:var(--spacing-comp-03);row-gap:var(--gx-ide-grid-row-gap);column-gap:var(--gx-ide-grid-column-gap);border-block-start:1px solid var(--gx-ide-container-border-color);border-block-end:1px solid var(--gx-ide-container-border-color);grid-template-areas:"pattern-label pattern-input pattern-input pattern-input" "object-label object-input object-input object-input"}.filter-grid .pattern-label{grid-area:pattern-label}.filter-grid .pattern-input{grid-area:pattern-input}.filter-grid .object-label{grid-area:object-label}.filter-grid .object-input{grid-area:object-input}.filter-grid--no-title{border-top:0}.grid-container{height:100%}ch-grid-cell{--spacing-comp-02:var(--spacing-comp-03)}.objects-count{display:flex;justify-content:space-around}.objects-count>*{flex:1;padding:var(--spacing-comp-01)}.objects-count>:not(:last-child){border-inline-end:1px solid var(--gx-ide-container-border-color)}';
+
+const c = class {
+  constructor(o) {
+    t(this, o);
+    this.componentDidRenderFirstTime = i(this, "componentDidRenderFirstTime", 7);
+    this.componentDidLoadEvent = i(this, "componentDidLoadEvent", 7);
+    this.renderedFirstTime = false;
+    this.shortcutsSrc = e(`./gx-ide-assets/object-selector/shortcuts.json`);
+    // 9.LOCAL METHODS //
+        this.loaderCancelCallbackHandler = async () => {
+      this.cancelCallbackHandler();
+    };
+    this.getObjects = () => {
+      var t, i, e;
+      const r = {
+        pattern: (t = this.filterPatternEl) === null || t === void 0 ? void 0 : t.value,
+        object: (e = (i = this.filterObjectEl) === null || i === void 0 ? void 0 : i.value) === null || e === void 0 ? void 0 : e.id
+      };
+      if (this.loadItemsCallback) {
+        if (this.loader) {
+          this.loaderEl.show = true;
+        }
+        this.loadItemsCallback(r).then((t => {
+          if (t) {
+            this.objects = t;
+          }
+          this.selectedObjectsIds = [];
+          this.deselectAll();
+          if (this.loader) {
+            this.loaderEl.show = false;
+          }
+        }));
+      }
+    };
+    this.editCallbackHandler = t => {
+      t.stopPropagation();
+      if (this.selectedObjectsIds[0]) {
+        this.editCallback(this.selectedObjectsIds[0]);
+        this.getObjects();
+      }
+    };
+    this.confirmCallbackHandler = t => {
+      t.stopPropagation();
+      this.confirmCallback(this.selectedObjectsIds);
+    };
+    this.cancelCallbackHandler = () => {
+      this.cancelCallback();
+    };
+    this.deselectAll = () => {
+      this.chGridEl.selectAllRows(false);
+    };
+    this.newVariableCallbackHandler = () => {
+      this.newVariableCallback();
+      this.getObjects();
+    };
+    this.listenChanges = async () => {
+      /* pattern*/
+      this.filterPatternEl.addEventListener("valueChanged", (() => {
+        this.getObjects();
+      }));
+      /* object*/      this.filterObjectEl.addEventListener("valueChanged", (() => {
+        this.getObjects();
+      }));
+      // for grid selection
+            this.chGridEl.addEventListener("selectionChanged", (t => {
+        this.selectedObjectsIds = t.detail.rowsId;
+      }));
+    };
+    this.chGridKeyDownHandler = t => {
+      if (t.key === "Enter") {
+        this.confirmCallbackHandler(t);
+      }
+    };
+    this.hostKeyPressHandler = t => {
+      // just prevent keypress propagation
+      if (t.key === "Enter") {
+        t.stopPropagation();
+      }
+    };
+    // 9.LOCAL METHODS  -> RENDER//
+        this.renderFilter = () => r("div", {
+      part: "filters-container",
+      class: {
+        "filter-grid": true,
+        "filter-grid--no-title": !this.displayTitle
+      },
+      slot: "header"
+    }, r("gxg-label", {
+      labelPosition: "start",
+      class: "pattern-label",
+      noMargin: true
+    }, this._componentLocale.filter.pattern), r("gxg-form-text", {
+      ref: t => this.filterPatternEl = t,
+      class: "pattern-input",
+      part: "filter-pattern",
+      debounce: true
+    }), r("gxg-label", {
+      labelPosition: "start",
+      class: "object-label",
+      noMargin: true
+    }, this._componentLocale.filter.object), r("gx-ide-entity-selector", {
+      selectEntityCallback: this.selectObjectCallback,
+      ref: t => this.filterObjectEl = t,
+      class: "object-input"
+    }));
+    this.renderObjects = () => r("gxg-grid", {
+      "ellipsis-cell-wrapper": true,
+      noBorder: true
+    }, r("ch-grid", {
+      rowSelectionMode: this.selectionType,
+      ref: t => this.chGridEl = t,
+      onKeyDown: this.chGridKeyDownHandler,
+      part: "ch-grid-objects"
+    }, r("ch-grid-columnset", null, r("ch-grid-column", {
+      "column-name-position": "text",
+      settingable: false,
+      size: l.colSize.minContent
+    }), r("ch-grid-column", {
+      "column-name": this._componentLocale.tableHead.name,
+      "column-name-position": "text",
+      settingable: false,
+      size: l.colSize.auto
+    }), r("ch-grid-column", {
+      "column-name": this._componentLocale.tableHead.dataType,
+      "column-name-position": "text",
+      settingable: false,
+      size: l.colSize.auto
+    }), r("ch-grid-column", {
+      "column-name": this._componentLocale.tableHead.description,
+      "column-name-position": "text",
+      settingable: false,
+      size: l.colSize.auto
+    })), this.objects.sort(((t, i) => {
+      const e = t.name.toLowerCase(), r = i.name.toLowerCase();
+      if (e < r) {
+        return -1;
+      }
+      if (e > r) {
+        return 1;
+      }
+      return 0;
+    })).map((t => r("ch-grid-row", {
+      rowid: t.id,
+      onDblClick: this.confirmCallbackHandler
+    }, r("ch-grid-cell", null, r("span", {
+      class: "cell-wrapper"
+    }, r("gxg-icon", {
+      type: t.type === "attribute" ? "objects/attribute" : "objects-parts/variables",
+      color: "auto",
+      size: "small"
+    }))), r("ch-grid-cell", null, r("span", {
+      class: "cell-wrapper"
+    }, " ", t.name, " ")), r("ch-grid-cell", null, r("span", {
+      class: "cell-wrapper"
+    }, t.dataType)), r("ch-grid-cell", null, r("span", {
+      class: "cell-wrapper"
+    }, t.description)))))));
+    this.objects = [];
+    this.selectedObjectsIds = [];
+    this.displayTitle = false;
+    this.loader = false;
+    this.selectionType = "multiple";
+    this.selectObjectCallback = undefined;
+    this.editCallback = undefined;
+    this.cancelCallback = undefined;
+    this.loadItemsCallback = undefined;
+    this.newVariableCallback = undefined;
+    this.confirmCallback = undefined;
+  }
+  // 6.COMPONENT LIFECYCLE EVENTS //
+  async componentWillLoad() {
+    this._componentLocale = await s.getComponentStrings(this.el);
+    this.componentDidLoadEvent.emit(true);
+  }
+  componentDidLoad() {
+    this.listenChanges();
+    this.loaderEl.container = this.chGridEl;
+    this.getObjects();
+    this.filterPatternEl.focus();
+  }
+  componentDidRender() {
+    if (!this.renderedFirstTime) {
+      this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
+      this.renderedFirstTime = true;
+    }
+  }
+  // 7.LISTENERS //
+  // 8.PUBLIC METHODS API //
+  /**
+     * Suspends or reactivates the shortcuts
+     */
+  async suspendShortcuts(t) {
+    if (t) {
+      this.gxgShortcutsEl.suspend = true;
+    } else {
+      this.gxgShortcutsEl.suspend = false;
+    }
+  }
+  /**
+     * Validate necessary data input
+     */  async validate() {
+    const t = true;
+    return t;
+  }
+  // 10.RENDER() FUNCTION //
+  render() {
+    return r(o, {
+      class: "gx-ide-component",
+      onKeyPress: this.hostKeyPressHandler
+    }, r("div", {
+      class: "gx-ide-main-wrapper"
+    }, r("gx-ide-container", {
+      containerTitle: this.displayTitle ? this._componentLocale.componentName : null,
+      noContentPadding: true,
+      noAboveFooterPadding: true,
+      noHeadingPadding: true,
+      headingPaddingTop: true,
+      noHeadingBorder: true,
+      slimmerFooter: n.gxIdeContainer.slimmerFooter
+    }, this.renderFilter(), this.renderObjects(), r("gxg-button", {
+      type: "outlined",
+      onClick: this.cancelCallbackHandler,
+      part: "gxg-button gxg-button--cancel",
+      slot: "footer-end"
+    }, this._componentLocale.footer.btnCancel), r("gxg-button", {
+      type: "primary-text-only",
+      onClick: this.confirmCallbackHandler,
+      part: "gxg-button gxg-button--ok",
+      slot: "footer-end"
+    }, this._componentLocale.footer.btnConfirm), r("gxg-button", {
+      type: "primary-text-only",
+      onClick: this.newVariableCallbackHandler,
+      part: "gxg-button gxg-button--new",
+      slot: "footer-start"
+    }, this._componentLocale.footer.btnNew), r("gxg-button", {
+      type: "primary-text-only",
+      onClick: this.editCallbackHandler,
+      part: "gxg-button gxg-button--edit",
+      slot: "footer-start"
+    }, this._componentLocale.footer.btnEdit))), r("gxg-shortcuts", {
+      src: this.shortcutsSrc,
+      ref: t => this.gxgShortcutsEl = t
+    }), this.loader ? r("gxg-ide-loader", {
+      cancelLabel: this._componentLocale.loader.cancelLabel,
+      loaderTitle: this._componentLocale.loader.title,
+      ref: t => this.loaderEl = t,
+      cancelCallback: this.loaderCancelCallbackHandler
+    }) : null);
+  }
+  static get delegatesFocus() {
+    return true;
+  }
+  static get assetsDirs() {
+    return [ "gx-ide-assets/data-selector" ];
+  }
+  get el() {
+    return a(this);
+  }
+};
+
+c.style = d;
+
+export { c as gx_ide_data_selector };
+//# sourceMappingURL=p-75f0ba9d.entry.js.map

package/dist/genexus-ide-ui/p-75f0ba9d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dataSelectorCss","GxIdeDataSelector","this","renderedFirstTime","shortcutsSrc","getAssetPath","loaderCancelCallbackHandler","async","cancelCallbackHandler","getObjects","filters","pattern","_a","filterPatternEl","value","object","_c","_b","filterObjectEl","id","loadItemsCallback","loader","loaderEl","show","then","items","objects","selectedObjectsIds","deselectAll","editCallbackHandler","e","stopPropagation","editCallback","confirmCallbackHandler","confirmCallback","cancelCallback","chGridEl","selectAllRows","newVariableCallbackHandler","newVariableCallback","listenChanges","addEventListener","ev","detail","rowsId","chGridKeyDownHandler","key","hostKeyPressHandler","renderFilter","h","part","class","displayTitle","slot","labelPosition","noMargin","_componentLocale","filter","ref","el","debounce","selectEntityCallback","selectObjectCallback","renderObjects","noBorder","rowSelectionMode","selectionType","onKeyDown","settingable","size","gridCommon","colSize","minContent","tableHead","name","auto","dataType","description","sort","a","b","nameA","toLowerCase","nameB","map","obj","rowid","onDblClick","type","color","componentWillLoad","Locale","getComponentStrings","componentDidLoadEvent","emit","componentDidLoad","container","focus","componentDidRender","componentDidRenderFirstTime","componentName","suspendShortcuts","gxgShortcutsEl","suspend","validate","isValid","render","Host","onKeyPress","containerTitle","noContentPadding","noAboveFooterPadding","noHeadingPadding","headingPaddingTop","noHeadingBorder","slimmerFooter","config","gxIdeContainer","onClick","footer","btnCancel","btnConfirm","btnNew","btnEdit","src","cancelLabel","loaderTitle","title"],"sources":["src/components/data-selector/data-selector.scss?tag=gx-ide-data-selector&encapsulation=shadow","src/components/data-selector/data-selector.tsx"],"sourcesContent":["@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  display: block;\n  border: 1px solid var(--gxg-border-color--regular);\n  background-color: var(--color-background);\n}\n\n/* Filters */\n.filter-grid {\n  display: grid;\n  padding: var(--spacing-comp-03);\n  row-gap: var(--gx-ide-grid-row-gap);\n  column-gap: var(--gx-ide-grid-column-gap);\n  border-block-start: 1px solid var(--gx-ide-container-border-color);\n  border-block-end: 1px solid var(--gx-ide-container-border-color);\n\n  grid-template-areas:\n    \"pattern-label pattern-input pattern-input pattern-input\"\n    \"object-label object-input object-input object-input\";\n\n  .pattern-label {\n    grid-area: pattern-label;\n  }\n  .pattern-input {\n    grid-area: pattern-input;\n  }\n  .object-label {\n    grid-area: object-label;\n  }\n  .object-input {\n    grid-area: object-input;\n  }\n\n  &--no-title {\n    border-top: 0;\n  }\n}\n\n/*gxg-grid*/\n.grid-container {\n  height: 100%;\n}\nch-grid-cell {\n  --spacing-comp-02: var(--spacing-comp-03);\n}\n/* Objects Table */\n.objects-count {\n  display: flex;\n  justify-content: space-around;\n  > * {\n    flex: 1;\n    padding: var(--spacing-comp-01);\n  }\n  > :not(:last-child) {\n    border-inline-end: 1px solid var(--gx-ide-container-border-color);\n  }\n}\n","/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  State,\n  Method,\n  getAssetPath\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../common/locale\";\nimport { config } from \"../../common/config\";\n\nimport { EntityData } from \"../../common/types\";\nimport { gridCommon } from \"../../common/grid\";\n\n@Component({\n  tag: \"gx-ide-data-selector\",\n  styleUrl: \"data-selector.scss\",\n  shadow: { delegatesFocus: true },\n  assetsDirs: [\"gx-ide-assets/data-selector\"]\n})\nexport class GxIdeDataSelector {\n  /*\nINDEX:\n1.OWN PROPERTIES\n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE EVENTS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n  // 1.OWN PROPERTIES //\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n  private renderedFirstTime = false;\n  private shortcutsSrc = getAssetPath(\n    `./gx-ide-assets/object-selector/shortcuts.json`\n  );\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeDataSelectorElement;\n\n  /* References needed to collect data */\n  private filterPatternEl!: HTMLGxgFormTextElement;\n  private filterObjectEl!: HTMLGxIdeEntitySelectorElement;\n  private chGridEl!: HTMLChGridElement;\n  private gxgShortcutsEl: HTMLGxgShortcutsElement;\n  private loaderEl!: HTMLGxgIdeLoaderElement;\n\n  // 3.STATE() VARIABLES //\n\n  /**\n   * The objects rendered in the table\n   */\n  @State() objects: ItemData[] = [];\n\n  /**\n   * The selected objects in the table of objects\n   */\n  @State() selectedObjectsIds: string[] = [];\n\n  // 4.PUBLIC PROPERTY API //\n\n  /**\n   * If true it displays the component title on the header\n   */\n  @Prop() readonly displayTitle = false;\n\n  /**\n   * If true, it will display a loader when needed.\n   */\n  @Prop() readonly loader = false;\n\n  /**\n   * Single if multiple object selection is not allowed. Default is multiple\n   */\n  @Prop() readonly selectionType: \"single\" | \"multiple\" = \"multiple\";\n\n  /**\n   * Callback invoked when the action is executed in the Object filter. It returns the information of the selected object (id and name) or 'undefined' if it was canceled.\n   */\n  @Prop() readonly selectObjectCallback: SelectObjectCallback;\n\n  /**\n   * Callback invoked when user press edit button. Receives the first selected element id as parameter\n   */\n  @Prop() readonly editCallback: EditCallback;\n\n  /**\n   * Callback invoked when the user wishes to cancel the selection of objects.\n   */\n  @Prop() readonly cancelCallback!: CancelCallback;\n\n  /**\n   * Callback invoked when the component needs to reload the list of attributes.\n   */\n  @Prop() readonly loadItemsCallback!: LoadItemsCallback;\n\n  /**\n   * Callback invoked when the user presses the 'New' button.\n   */\n  @Prop() readonly newVariableCallback!: NewVariableCallback;\n\n  /**\n   * Callback invoked when the user presses the 'OK' button\n   */\n  @Prop() readonly confirmCallback!: ConfirmCallback;\n\n  // 5.EVENTS (EMIT) //\n\n  /**\n   * This event is emitted once just after the component is fully loaded and the first render() occurs\n   */\n  @Event() componentDidRenderFirstTime: EventEmitter<boolean>;\n\n  /**\n   * This event is emitted once just after the component is fully loaded and the first render() occurs.\n   */\n  @Event() componentDidLoadEvent: EventEmitter<boolean>;\n\n  // 6.COMPONENT LIFECYCLE EVENTS //\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n    this.componentDidLoadEvent.emit(true);\n  }\n\n  componentDidLoad() {\n    this.listenChanges();\n    this.loaderEl.container = this.chGridEl;\n    this.getObjects();\n    this.filterPatternEl.focus();\n  }\n\n  componentDidRender() {\n    if (!this.renderedFirstTime) {\n      this.componentDidRenderFirstTime.emit(\n        this._componentLocale.componentName\n      );\n      this.renderedFirstTime = true;\n    }\n  }\n\n  // 7.LISTENERS //\n\n  // 8.PUBLIC METHODS API //\n  /**\n   * Suspends or reactivates the shortcuts\n   */\n  @Method()\n  async suspendShortcuts(suspendShortcuts: boolean) {\n    if (suspendShortcuts) {\n      this.gxgShortcutsEl.suspend = true;\n    } else {\n      this.gxgShortcutsEl.suspend = false;\n    }\n  }\n\n  /**\n   * Validate necessary data input\n   */\n  @Method()\n  async validate(): Promise<boolean> {\n    const isValid = true;\n    return isValid;\n  }\n\n  // 9.LOCAL METHODS //\n\n  private loaderCancelCallbackHandler = async () => {\n    this.cancelCallbackHandler();\n  };\n\n  private getObjects = (): void => {\n    const filters: FiltersData = {\n      pattern: this.filterPatternEl?.value,\n      object: this.filterObjectEl?.value?.id\n    };\n    if (this.loadItemsCallback) {\n      if (this.loader) {\n        this.loaderEl.show = true;\n      }\n      this.loadItemsCallback(filters).then((items: ItemData[]) => {\n        if (items) {\n          this.objects = items;\n        }\n        this.selectedObjectsIds = [];\n        this.deselectAll();\n        if (this.loader) {\n          this.loaderEl.show = false;\n        }\n      });\n    }\n  };\n\n  private editCallbackHandler = (e: MouseEvent): void => {\n    e.stopPropagation();\n    if (this.selectedObjectsIds[0]) {\n      this.editCallback(this.selectedObjectsIds[0]);\n      this.getObjects();\n    }\n  };\n\n  private confirmCallbackHandler = (e: MouseEvent | KeyboardEvent): void => {\n    e.stopPropagation();\n    this.confirmCallback(this.selectedObjectsIds);\n  };\n\n  private cancelCallbackHandler = (): void => {\n    this.cancelCallback();\n  };\n\n  private deselectAll = (): void => {\n    (this.chGridEl as any).selectAllRows(false);\n  };\n\n  private newVariableCallbackHandler = (): void => {\n    this.newVariableCallback();\n    this.getObjects();\n  };\n\n  private listenChanges = async (): Promise<void> => {\n    /* pattern*/\n    this.filterPatternEl.addEventListener(\"valueChanged\", () => {\n      this.getObjects();\n    });\n\n    /* object*/\n    this.filterObjectEl.addEventListener(\"valueChanged\", () => {\n      this.getObjects();\n    });\n    // for grid selection\n    this.chGridEl.addEventListener(\"selectionChanged\", (ev: any): void => {\n      this.selectedObjectsIds = ev.detail.rowsId;\n    });\n  };\n\n  private chGridKeyDownHandler = (e: KeyboardEvent) => {\n    if (e.key === \"Enter\") {\n      this.confirmCallbackHandler(e);\n    }\n  };\n\n  private hostKeyPressHandler = (e: KeyboardEvent) => {\n    // just prevent keypress propagation\n    if (e.key === \"Enter\") {\n      e.stopPropagation();\n    }\n  };\n\n  // 9.LOCAL METHODS  -> RENDER//\n\n  private renderFilter = (): Element => {\n    return (\n      <div\n        part=\"filters-container\"\n        class={{\n          \"filter-grid\": true,\n          \"filter-grid--no-title\": !this.displayTitle\n        }}\n        slot=\"header\"\n      >\n        <gxg-label labelPosition=\"start\" class=\"pattern-label\" noMargin>\n          {this._componentLocale.filter.pattern}\n        </gxg-label>\n        <gxg-form-text\n          ref={(el: HTMLGxgFormTextElement) =>\n            (this.filterPatternEl = el as HTMLGxgFormTextElement)\n          }\n          class=\"pattern-input\"\n          part=\"filter-pattern\"\n          debounce\n        ></gxg-form-text>\n\n        <gxg-label labelPosition=\"start\" class=\"object-label\" noMargin>\n          {this._componentLocale.filter.object}\n        </gxg-label>\n        <gx-ide-entity-selector\n          selectEntityCallback={this.selectObjectCallback}\n          ref={(el: HTMLGxIdeEntitySelectorElement) =>\n            (this.filterObjectEl = el as HTMLGxIdeEntitySelectorElement)\n          }\n          class=\"object-input\"\n        ></gx-ide-entity-selector>\n      </div>\n    );\n  };\n\n  private renderObjects = (): Element => {\n    return (\n      <gxg-grid ellipsis-cell-wrapper noBorder>\n        <ch-grid\n          rowSelectionMode={this.selectionType}\n          ref={(el: HTMLChGridElement) => (this.chGridEl = el)}\n          onKeyDown={this.chGridKeyDownHandler}\n          part=\"ch-grid-objects\"\n        >\n          <ch-grid-columnset>\n            <ch-grid-column\n              column-name-position=\"text\"\n              settingable={false}\n              size={gridCommon.colSize.minContent}\n            ></ch-grid-column>\n            <ch-grid-column\n              column-name={this._componentLocale.tableHead.name}\n              column-name-position=\"text\"\n              settingable={false}\n              size={gridCommon.colSize.auto}\n            ></ch-grid-column>\n            <ch-grid-column\n              column-name={this._componentLocale.tableHead.dataType}\n              column-name-position=\"text\"\n              settingable={false}\n              size={gridCommon.colSize.auto}\n            ></ch-grid-column>\n\n            <ch-grid-column\n              column-name={this._componentLocale.tableHead.description}\n              column-name-position=\"text\"\n              settingable={false}\n              size={gridCommon.colSize.auto}\n            ></ch-grid-column>\n          </ch-grid-columnset>\n          {this.objects\n            .sort((a, b) => {\n              const nameA = a.name.toLowerCase(),\n                nameB = b.name.toLowerCase();\n              if (nameA < nameB) {\n                return -1;\n              }\n              if (nameA > nameB) {\n                return 1;\n              }\n              return 0;\n            })\n            .map((obj: ItemData) => (\n              <ch-grid-row\n                rowid={obj.id}\n                onDblClick={this.confirmCallbackHandler}\n              >\n                <ch-grid-cell>\n                  <span class=\"cell-wrapper\">\n                    <gxg-icon\n                      type={\n                        obj.type === \"attribute\"\n                          ? \"objects/attribute\"\n                          : \"objects-parts/variables\"\n                      }\n                      color=\"auto\"\n                      size=\"small\"\n                    ></gxg-icon>\n                  </span>\n                </ch-grid-cell>\n                <ch-grid-cell>\n                  <span class=\"cell-wrapper\"> {obj.name} </span>\n                </ch-grid-cell>\n                <ch-grid-cell>\n                  <span class=\"cell-wrapper\">{obj.dataType}</span>\n                </ch-grid-cell>\n\n                <ch-grid-cell>\n                  <span class=\"cell-wrapper\">{obj.description}</span>\n                </ch-grid-cell>\n              </ch-grid-row>\n            ))}\n        </ch-grid>\n      </gxg-grid>\n    );\n  };\n\n  // 10.RENDER() FUNCTION //\n\n  render(): void {\n    return (\n      <Host class=\"gx-ide-component\" onKeyPress={this.hostKeyPressHandler}>\n        <div class=\"gx-ide-main-wrapper\">\n          <gx-ide-container\n            containerTitle={\n              this.displayTitle ? this._componentLocale.componentName : null\n            }\n            noContentPadding\n            noAboveFooterPadding\n            noHeadingPadding\n            headingPaddingTop\n            noHeadingBorder\n            slimmerFooter={config.gxIdeContainer.slimmerFooter}\n          >\n            {this.renderFilter()}\n            {this.renderObjects()}\n\n            {/* footer */}\n            {/* button cancel */}\n            <gxg-button\n              type=\"outlined\"\n              onClick={this.cancelCallbackHandler}\n              part=\"gxg-button gxg-button--cancel\"\n              slot=\"footer-end\"\n            >\n              {this._componentLocale.footer.btnCancel}\n            </gxg-button>\n            {/* button confirm */}\n            <gxg-button\n              type=\"primary-text-only\"\n              onClick={this.confirmCallbackHandler}\n              part=\"gxg-button gxg-button--ok\"\n              slot=\"footer-end\"\n            >\n              {this._componentLocale.footer.btnConfirm}\n            </gxg-button>\n            {/* button new... */}\n            <gxg-button\n              type=\"primary-text-only\"\n              onClick={this.newVariableCallbackHandler}\n              part=\"gxg-button gxg-button--new\"\n              slot=\"footer-start\"\n            >\n              {this._componentLocale.footer.btnNew}\n            </gxg-button>\n            {/* button edit  */}\n            <gxg-button\n              type=\"primary-text-only\"\n              onClick={this.editCallbackHandler}\n              part=\"gxg-button gxg-button--edit\"\n              slot=\"footer-start\"\n            >\n              {this._componentLocale.footer.btnEdit}\n            </gxg-button>\n          </gx-ide-container>\n        </div>\n        <gxg-shortcuts\n          src={this.shortcutsSrc}\n          ref={(el: HTMLGxgShortcutsElement) =>\n            (this.gxgShortcutsEl = el as HTMLGxgShortcutsElement)\n          }\n        ></gxg-shortcuts>\n        {/* loader*/}\n        {this.loader ? (\n          <gxg-ide-loader\n            cancelLabel={this._componentLocale.loader.cancelLabel}\n            loaderTitle={this._componentLocale.loader.title}\n            ref={el => (this.loaderEl = el as HTMLGxgIdeLoaderElement)}\n            cancelCallback={this.loaderCancelCallbackHandler}\n          ></gxg-ide-loader>\n        ) : null}\n      </Host>\n    );\n  }\n}\n\nexport type NewVariableCallback = () => Promise<void>;\n\nexport type CancelCallback = () => Promise<void>;\n\nexport type SelectObjectCallback = () => Promise<EntityData | undefined>;\n\nexport type EditCallback = (id: string) => Promise<boolean>;\n\nexport type ConfirmCallback = (ids: string[]) => Promise<void>;\n\nexport type LoadItemsCallback = (filters: FiltersData) => Promise<ItemData[]>;\n\nexport type FiltersData = {\n  pattern?: string;\n  object?: string;\n};\n\nexport type ItemData = {\n  type: \"variable\" | \"attribute\";\n  id: string;\n  name: string;\n  dataType: string;\n  description: string;\n};\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-545291ad.entry.js → p-7dc3a137.entry.js}

@@ -541,10 +541,11 @@ CONSTANTS
   "primary-hover": "color-primary-hover",
   success: "ds-success-color--dark",
   warning: "ds-warning-color--dark",
-  mercury: "gray-03",
+  mercury: "mer-icon__primary",
   "mercury-primary": "mer-icon__primary",
   "mercury-on-primary": "mer-text__on-primary",
-  "mercury-text-on-message": "mer-text__on-message"
+  "mercury-text-on-message": "mer-text__on-message",
+  "mercury-neutral": "mer-icon__neutral"
 };
 
 const z = class {
@@ -698,4 +699,4 @@ const C = class {
 C.style = _;
 
 export { m as ch_icon, u as gxg_form_text, z as gxg_icon, k as gxg_label, C as gxg_tooltip };
-//# sourceMappingURL=p-545291ad.entry.js.map
+//# sourceMappingURL=p-7dc3a137.entry.js.map