@genexus/genexus-ide-ui 0.0.98 → 0.0.100

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

@@ -0,0 +1,441 @@
+/* STENCIL IMPORTS */
+import { Host, h, getAssetPath } from "@stencil/core";
+/* OTHER LIBRARIES IMPORTS */
+/* CUSTOM IMPORTS */
+import { Locale } from "../../common/locale";
+import { config } from "../../common/config";
+import { gridCommon } from "../../common/grid";
+export class GxIdeDataSelector {
+    constructor() {
+        this.renderedFirstTime = false;
+        this.shortcutsSrc = getAssetPath(`./gx-ide-assets/object-selector/shortcuts.json`);
+        // 9.LOCAL METHODS //
+        this.loaderCancelCallbackHandler = async () => {
+            this.cancelCallbackHandler();
+        };
+        this.getObjects = () => {
+            var _a, _b, _c;
+            const filters = {
+                pattern: (_a = this.filterPatternEl) === null || _a === void 0 ? void 0 : _a.value,
+                object: (_c = (_b = this.filterObjectEl) === null || _b === void 0 ? void 0 : _b.value) === null || _c === void 0 ? void 0 : _c.id
+            };
+            if (this.loadItemsCallback) {
+                if (this.loader) {
+                    this.loaderEl.show = true;
+                }
+                this.loadItemsCallback(filters).then((items) => {
+                    if (items) {
+                        this.objects = items;
+                    }
+                    this.selectedObjectsIds = [];
+                    this.deselectAll();
+                    if (this.loader) {
+                        this.loaderEl.show = false;
+                    }
+                });
+            }
+        };
+        this.editCallbackHandler = (e) => {
+            e.stopPropagation();
+            if (this.selectedObjectsIds[0]) {
+                this.editCallback(this.selectedObjectsIds[0]);
+                this.getObjects();
+            }
+        };
+        this.confirmCallbackHandler = (e) => {
+            e.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", (ev) => {
+                this.selectedObjectsIds = ev.detail.rowsId;
+            });
+        };
+        this.chGridKeyDownHandler = (e) => {
+            if (e.key === "Enter") {
+                this.confirmCallbackHandler(e);
+            }
+        };
+        this.hostKeyPressHandler = (e) => {
+            // just prevent keypress propagation
+            if (e.key === "Enter") {
+                e.stopPropagation();
+            }
+        };
+        // 9.LOCAL METHODS  -> RENDER//
+        this.renderFilter = () => {
+            return (h("div", { part: "filters-container", class: {
+                    "filter-grid": true,
+                    "filter-grid--no-title": !this.displayTitle
+                }, slot: "header" }, h("gxg-label", { labelPosition: "start", class: "pattern-label", noMargin: true }, this._componentLocale.filter.pattern), h("gxg-form-text", { ref: (el) => (this.filterPatternEl = el), class: "pattern-input", part: "filter-pattern", debounce: true }), h("gxg-label", { labelPosition: "start", class: "object-label", noMargin: true }, this._componentLocale.filter.object), h("gx-ide-entity-selector", { selectEntityCallback: this.selectObjectCallback, ref: (el) => (this.filterObjectEl = el), class: "object-input" })));
+        };
+        this.renderObjects = () => {
+            return (h("gxg-grid", { "ellipsis-cell-wrapper": true, noBorder: true }, h("ch-grid", { rowSelectionMode: this.selectionType, ref: (el) => (this.chGridEl = el), onKeyDown: this.chGridKeyDownHandler, part: "ch-grid-objects" }, h("ch-grid-columnset", null, h("ch-grid-column", { "column-name-position": "text", settingable: false, size: gridCommon.colSize.minContent }), h("ch-grid-column", { "column-name": this._componentLocale.tableHead.name, "column-name-position": "text", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { "column-name": this._componentLocale.tableHead.dataType, "column-name-position": "text", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { "column-name": this._componentLocale.tableHead.description, "column-name-position": "text", settingable: false, size: gridCommon.colSize.auto })), this.objects
+                .sort((a, b) => {
+                const nameA = a.name.toLowerCase(), nameB = b.name.toLowerCase();
+                if (nameA < nameB) {
+                    return -1;
+                }
+                if (nameA > nameB) {
+                    return 1;
+                }
+                return 0;
+            })
+                .map((obj) => (h("ch-grid-row", { rowid: obj.id, onDblClick: this.confirmCallbackHandler }, h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, h("gxg-icon", { type: obj.type === "attribute"
+                    ? "objects/attribute"
+                    : "objects-parts/variables", color: "auto", size: "small" }))), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, " ", obj.name, " ")), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.dataType)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.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 Locale.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(suspendShortcuts) {
+        if (suspendShortcuts) {
+            this.gxgShortcutsEl.suspend = true;
+        }
+        else {
+            this.gxgShortcutsEl.suspend = false;
+        }
+    }
+    /**
+     * Validate necessary data input
+     */
+    async validate() {
+        const isValid = true;
+        return isValid;
+    }
+    // 10.RENDER() FUNCTION //
+    render() {
+        return (h(Host, { class: "gx-ide-component", onKeyPress: this.hostKeyPressHandler }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { containerTitle: this.displayTitle ? this._componentLocale.componentName : null, noContentPadding: true, noAboveFooterPadding: true, noHeadingPadding: true, headingPaddingTop: true, noHeadingBorder: true, slimmerFooter: config.gxIdeContainer.slimmerFooter }, this.renderFilter(), this.renderObjects(), h("gxg-button", { type: "outlined", onClick: this.cancelCallbackHandler, part: "gxg-button gxg-button--cancel", slot: "footer-end" }, this._componentLocale.footer.btnCancel), h("gxg-button", { type: "primary-text-only", onClick: this.confirmCallbackHandler, part: "gxg-button gxg-button--ok", slot: "footer-end" }, this._componentLocale.footer.btnConfirm), h("gxg-button", { type: "primary-text-only", onClick: this.newVariableCallbackHandler, part: "gxg-button gxg-button--new", slot: "footer-start" }, this._componentLocale.footer.btnNew), h("gxg-button", { type: "primary-text-only", onClick: this.editCallbackHandler, part: "gxg-button gxg-button--edit", slot: "footer-start" }, this._componentLocale.footer.btnEdit))), h("gxg-shortcuts", { src: this.shortcutsSrc, ref: (el) => (this.gxgShortcutsEl = el) }), this.loader ? (h("gxg-ide-loader", { cancelLabel: this._componentLocale.loader.cancelLabel, loaderTitle: this._componentLocale.loader.title, ref: el => (this.loaderEl = el), cancelCallback: this.loaderCancelCallbackHandler })) : null));
+    }
+    static get is() { return "gx-ide-data-selector"; }
+    static get encapsulation() { return "shadow"; }
+    static get delegatesFocus() { return true; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["data-selector.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["data-selector.css"]
+        };
+    }
+    static get assetsDirs() { return ["gx-ide-assets/data-selector"]; }
+    static get properties() {
+        return {
+            "displayTitle": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "false",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If true it displays the component title on the header"
+                },
+                "attribute": "display-title",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "loader": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "false",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If true, it will display a loader when needed."
+                },
+                "attribute": "loader",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "selectionType": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "\"single\" | \"multiple\"",
+                    "resolved": "\"multiple\" | \"single\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Single if multiple object selection is not allowed. Default is multiple"
+                },
+                "attribute": "selection-type",
+                "reflect": false,
+                "defaultValue": "\"multiple\""
+            },
+            "selectObjectCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "SelectObjectCallback",
+                    "resolved": "() => Promise<EntityData>",
+                    "references": {
+                        "SelectObjectCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/data-selector/data-selector.tsx",
+                            "id": "src/components/data-selector/data-selector.tsx::SelectObjectCallback"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "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."
+                }
+            },
+            "editCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "EditCallback",
+                    "resolved": "(id: string) => Promise<boolean>",
+                    "references": {
+                        "EditCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/data-selector/data-selector.tsx",
+                            "id": "src/components/data-selector/data-selector.tsx::EditCallback"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Callback invoked when user press edit button. Receives the first selected element id as parameter"
+                }
+            },
+            "cancelCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "CancelCallback",
+                    "resolved": "() => Promise<void>",
+                    "references": {
+                        "CancelCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/data-selector/data-selector.tsx",
+                            "id": "src/components/data-selector/data-selector.tsx::CancelCallback"
+                        }
+                    }
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Callback invoked when the user wishes to cancel the selection of objects."
+                }
+            },
+            "loadItemsCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "LoadItemsCallback",
+                    "resolved": "(filters: FiltersData) => Promise<ItemData[]>",
+                    "references": {
+                        "LoadItemsCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/data-selector/data-selector.tsx",
+                            "id": "src/components/data-selector/data-selector.tsx::LoadItemsCallback"
+                        }
+                    }
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Callback invoked when the component needs to reload the list of attributes."
+                }
+            },
+            "newVariableCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "NewVariableCallback",
+                    "resolved": "() => Promise<void>",
+                    "references": {
+                        "NewVariableCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/data-selector/data-selector.tsx",
+                            "id": "src/components/data-selector/data-selector.tsx::NewVariableCallback"
+                        }
+                    }
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Callback invoked when the user presses the 'New' button."
+                }
+            },
+            "confirmCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "ConfirmCallback",
+                    "resolved": "(ids: string[]) => Promise<void>",
+                    "references": {
+                        "ConfirmCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/data-selector/data-selector.tsx",
+                            "id": "src/components/data-selector/data-selector.tsx::ConfirmCallback"
+                        }
+                    }
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Callback invoked when the user presses the 'OK' button"
+                }
+            }
+        };
+    }
+    static get states() {
+        return {
+            "objects": {},
+            "selectedObjectsIds": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "componentDidRenderFirstTime",
+                "name": "componentDidRenderFirstTime",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "This event is emitted once just after the component is fully loaded and the first render() occurs"
+                },
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                }
+            }, {
+                "method": "componentDidLoadEvent",
+                "name": "componentDidLoadEvent",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "This event is emitted once just after the component is fully loaded and the first render() occurs."
+                },
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "suspendShortcuts": {
+                "complexType": {
+                    "signature": "(suspendShortcuts: boolean) => Promise<void>",
+                    "parameters": [{
+                            "name": "suspendShortcuts",
+                            "type": "boolean",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Suspends or reactivates the shortcuts",
+                    "tags": []
+                }
+            },
+            "validate": {
+                "complexType": {
+                    "signature": "() => Promise<boolean>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<boolean>"
+                },
+                "docs": {
+                    "text": "Validate necessary data input",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "el"; }
+}
+//# sourceMappingURL=data-selector.js.map

package/dist/collection/components/data-selector/data-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-selector.js","sourceRoot":"","sources":["../../../src/components/data-selector/data-selector.tsx"],"names":[],"mappings":"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","sourcesContent":["/* 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"]}

package/dist/collection/components/data-selector/gx-ide-assets/data-selector/langs/data-selector.lang.en.json

@@ -0,0 +1,23 @@
+{
+  "componentName": "Data Selector",
+  "location": "Location",
+  "filter": {
+    "pattern": "Pattern",
+    "object": "Object"
+  },
+  "tableHead": {
+    "name": "Name",
+    "dataType": "Type",
+    "description": "Description"
+  },
+  "footer": {
+    "btnNew": "New Variable",
+    "btnEdit": "Edit Variable",
+    "btnConfirm": "OK",
+    "btnCancel": "Cancel"
+  },
+  "loader": {
+    "title": "Loading Objects...",
+    "cancelLabel": "Cancel Process"
+  }
+}

package/dist/collection/components/data-selector/gx-ide-assets/data-selector/langs/data-selector.lang.ja.json

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

package/dist/collection/components/data-selector/gx-ide-assets/data-selector/langs/data-selector.lang.zh.json

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

package/dist/collection/components/data-selector/gx-ide-assets/data-selector/shortcuts.json

@@ -0,0 +1,15 @@
+[
+  {
+    "selector": "[part~='gxg-button--ok']",
+    "keyShortcuts": "Enter",
+    "action": "click",
+    "conditions": {
+      "focusExclude": "[part='ch-grid-objects']"
+    }
+  },
+  {
+    "selector": "[part~='gxg-button--cancel']",
+    "keyShortcuts": "Escape",
+    "action": "click"
+  }
+]

package/dist/collection/components/import-from-design/import-from-design.js

@@ -276,11 +276,10 @@ export class GxIdeImportFromDesign {
             return (h("div", { part: "data-panel-composition-preview", class: "data-preview" }, h("img", { src: this.selectedDesignItem ? this.selectedDesignItem : undefined, alt: "Preview" })));
         };
         this.renderDesignTabs = () => {
-            this.counter++;
             return (h("gxg-tabs", { class: {
                     "design-tabs": true,
                     "design-tabs--fit-images": this.fitImages
-                }, part: "data-tabs", "no-border": true, noPadding: true, buttonsBorderAbove: true, ref: (el) => (this.tabsEl = el) }, h("gxg-tab-bar", { slot: "tab-bar-container" }, h("gxg-tab-button", { hidden: !this.selectedDesignType ||
+                }, part: "data-tabs", "no-border": true, noPadding: true, buttonsBorderAbove: true }, h("gxg-tab-bar", { slot: "tab-bar-container" }, h("gxg-tab-button", { hidden: !this.selectedDesignType ||
                     this.selectedDesignType !== DESIGN_DATA_TYPE_DESIGN_SYSTEM, slot: "tab-bar", "tab-label": this._componentLocale.tabs.tokens, tab: "tokens", key: "tokens", "is-selected": true }), h("gxg-tab-button", { hidden: !this.selectedDesignType ||
                     this.selectedDesignType !== DESIGN_DATA_TYPE_DESIGN_SYSTEM, slot: "tab-bar", "tab-label": this._componentLocale.tabs.styles, tab: "styles", key: "styles" }), h("gxg-tab-button", { hidden: !this.selectedDesignType ||
                     this.selectedDesignType === DESIGN_DATA_TYPE_DESIGN_SYSTEM, slot: "tab-bar", "tab-label": this._componentLocale.tabs.composition, tab: "composition", key: "composition", "is-selected": true }), h("gxg-tab-button", { hidden: !this.selectedDesignType ||
@@ -300,7 +299,7 @@ export class GxIdeImportFromDesign {
         this.selectedDesignItem = undefined;
         this.showAccessToken = undefined;
         this.designDataTreeDataModel = [];
-        this.counter = 0;
+        this.updateTabsActiveTab = false;
         this.fitImages = false;
         this.shrinkTree = false;
         this.shrunkenTree = false;
@@ -422,11 +421,6 @@ export class GxIdeImportFromDesign {
             ];
         }
     }
-    watchCounterHandler() {
-        if (this.tabsEl) {
-            this.tabsEl.setFirstActiveTab();
-        }
-    }
     watchShrinkTreeHandler(shrink) {
         if (shrink) {
             this.attachTreeMouseListeners();
@@ -840,7 +834,7 @@ export class GxIdeImportFromDesign {
             "selectedDesignItem": {},
             "showAccessToken": {},
             "designDataTreeDataModel": {},
-            "counter": {},
+            "updateTabsActiveTab": {},
             "fitImages": {},
             "shrinkTree": {},
             "shrunkenTree": {},
@@ -891,9 +885,6 @@ export class GxIdeImportFromDesign {
         return [{
                 "propName": "designData",
                 "methodName": "watchDesignDataHandler"
-            }, {
-                "propName": "counter",
-                "methodName": "watchCounterHandler"
             }, {
                 "propName": "shrinkTree",
                 "methodName": "watchShrinkTreeHandler"