@genexus/genexus-ide-ui 0.0.108 → 0.0.109

package/dist/collection/components/modules/manage-module-references/manage-module-references.js

@@ -0,0 +1,397 @@
+/* STENCIL IMPORTS */
+import { Host, h } from "@stencil/core";
+import { renderModuleDataProperties } from "../../../common/common";
+import { Locale } from "../../../common/locale";
+export class GxManageModuleReferences {
+    constructor() {
+        this.renderedFirstTime = false;
+        // 9.LOCAL METHODS //
+        this.getActionFromCurrentModuleVersion = () => {
+            const selected = this.selectedModule.versions.find(({ id }) => id === this.selectedModule.currentVersion);
+            return selected.action;
+        };
+        /**
+         * Callback invoked to get the progress when module is performing an action
+         */
+        this.onProgress = (message, progress, state) => {
+            const data = { message, progress, state };
+            this.selectedModuleAction = Object.assign({}, data);
+            this.progressValue = this.selectedModuleAction.progress;
+            this.progressState = this.selectedModuleAction.state;
+        };
+        // 10.LOCAL METHODS //
+        /**
+         * Used for changing the selected module
+         */
+        this.handleModuleChange = (row) => {
+            const foundModule = this.modulesAll.find(item => item.id === row.rowsId[0]);
+            this.selectedModule = foundModule;
+        };
+        /**
+         * Change the server selected value in response to callbackServerSelected callback
+         */
+        this.serverSelectedCallbackHandler = async (id) => {
+            const resolvedObjects = await this.serverSelectedCallback(id);
+            this.selectedServerId = id;
+            this.modulesAll = [...resolvedObjects];
+            this.filterModulesByType("browse");
+            this.selectedModule = this.filteredModules[0];
+        };
+        this.handleFilterChange = (value) => {
+            const trimmedValue = value.trim();
+            if (trimmedValue) {
+                const lowerCaseValue = trimmedValue.toLowerCase();
+                this.filteredModules = this.modulesAll.filter(module => module.name.toLowerCase().includes(lowerCaseValue));
+            }
+            else {
+                this.filteredModules = this.modulesAll;
+            }
+        };
+        /**
+         * Perform an action relative to a module using callbackExecuteAction callback and receive the state of that action with onProgress callback
+         */
+        this.executeActionCallbackHandler = async (module) => {
+            const actionCompleted = await this.executeActionCallback(this.selectedServerId, module.id, this.getActionFromCurrentModuleVersion(), this.onProgress);
+            this.actionCompleted = actionCompleted;
+        };
+        this.filterModulesByType = (type) => {
+            // browse
+            if (type === "browse") {
+                this.filteredModules = this.modulesAll;
+            }
+            // installed
+            else if (type === "installed") {
+                this.filteredModules = this.modulesAll.filter((module) => {
+                    const versionData = module.versions.find(version => {
+                        return version.id === module.currentVersion;
+                    });
+                    return (versionData &&
+                        (versionData.action === "restore" || versionData.action === "update"));
+                });
+            }
+            else if (type === "updates") {
+                this.filteredModules = this.modulesAll.filter((module) => {
+                    const versionData = module.versions.find(version => {
+                        return version.id === module.currentVersion;
+                    });
+                    return versionData && versionData.action === "update";
+                });
+            }
+        };
+        this.moduleMenuSelectionChangedHandler = async (e) => {
+            const itemId = e.detail[0].itemId;
+            if (itemId === "add") {
+                if (this.addServerCallback) {
+                    await this.addServerCallback();
+                }
+            }
+            else if (itemId === "edit") {
+                console.log(this.modulesList.value);
+            }
+            else if (itemId === "upload") {
+                console.log("upload");
+            }
+        };
+        this.renderMenu = () => {
+            return (h("gx-ide-list-selector", { onSelectionChanged: this.moduleMenuSelectionChangedHandler, class: "modules__menu", type: "single-selection", listName: "module-menu", ellipsis: true, style: {
+                    left: this.moduleMenuLeftPosition,
+                    top: this.moduleMenuTopPosition
+                } }, h("gx-ide-list-selector-item", { itemId: "add", itemValue: "Add", icon: "gemini-tools/add" }), h("gx-ide-list-selector-item", { itemId: "edit", itemValue: "Edit", icon: "gemini-tools/edit" }), h("gx-ide-list-selector-item", { itemId: "upload", itemValue: "Upload from file", icon: "gemini-tools/file" })));
+        };
+        this.showModuleMenu = async (e) => {
+            if (this.serverContextMenuCallback) {
+                const buttonBoundingClientRect = e.target.getBoundingClientRect();
+                await this.serverContextMenuCallback({
+                    selection: [this.selectedServerId],
+                    clientX: buttonBoundingClientRect.x,
+                    clientY: buttonBoundingClientRect.y
+                });
+            }
+        };
+        this.renderModulesGrid = () => {
+            return (h("gxg-grid", { noBorder: true, fullHeight: true }, h("ch-grid", { rowSelectionMode: "single", part: "ch-grid-pending-commits", class: "no-border",
+                /* TODO: El error es aqui ya que se esta enviando el valor del row Id correspondiente a la primera carga del grid con el primer server */
+                onSelectionChanged: (row) => this.handleModuleChange(row.detail) }, h("ch-grid-columnset", null, h("ch-grid-column", { settingable: false, size: "min-content" }), h("ch-grid-column", { settingable: false }), h("ch-grid-column", { settingable: false, size: "min-content" })), this.filteredModules.map((item) => (h("ch-grid-row", { rowid: item.id, key: item.id, selected: this.selectedModule && this.selectedModule.id === item.id }, h("ch-grid-cell", null, h("gxg-icon", { type: "objects/module", color: "auto", size: "small" })), h("ch-grid-cell", { class: "grid-cell-module__info" }, h("span", { class: "grid-cell-module__name" }, item.name), h("span", { class: "grid-cell-module__description" }, item.description)), h("ch-grid-cell", null, this.selectedModule && this.selectedModule.id === item.id ? (h("gxg-button", { disabled: !this.actionCompleted, fit: true, part: "module-action", onClick: () => {
+                    this.actionCompleted = false;
+                    this.closeProgressBar = false;
+                    this.executeActionCallbackHandler(item);
+                } }, this.getActionFromCurrentModuleVersion())) : null)))))));
+        };
+        this.moduleIconColor = () => {
+            return this.getActionFromCurrentModuleVersion() === "install"
+                ? "mercury-primary-disabled"
+                : "mercury-primary";
+        };
+        /* module details/information renders*/
+        this.renderModuleName = () => {
+            return (h("gxg-title", { part: "module-info__name", type: "title-05" }, h("div", { class: "module-info__name" }, h("gxg-icon", { type: "objects/module", color: this.moduleIconColor() }), this.selectedModule.name)));
+        };
+        this.renderModuleAction = () => {
+            return this.getActionFromCurrentModuleVersion() === "install" ? (h("div", { class: "module-info__action-container" }, h("gxg-text", { part: "not-installed" }, this._componentLocale.modulesInformation.moduleProperties
+                .notInstalled))) : (h("div", { class: "module-info__action-container module-info__action-container--installed" }, h("gxg-text", { part: "installed" }, ` ${this._componentLocale.modulesInformation.moduleProperties.installedVersion} : ${this.selectedModule.currentVersion}`)));
+        };
+        this.moduleVersionsValueChangedHandler = (e) => {
+            const moduleId = e.detail;
+            this.selectedModule = Object.assign(Object.assign({}, this.selectedModule), { currentVersion: moduleId });
+        };
+        this.renderModuleVersions = () => {
+            return (h("div", { part: "available-versions" }, h("gxg-combo-box", { id: "versions-combo-box", "disable-filter": true, value: this.selectedModule.versions[0]["id"], part: "module-versions", "display-validation-styles": true, "display-validation-message": true, label: this._componentLocale.modulesInformation.moduleProperties
+                    .availableVersions, labelPosition: "start", centerLabel: true, ref: el => (this.modulesList = el), onValueChanged: this.moduleVersionsValueChangedHandler }, this.selectedModule.versions.map(item => (h("gxg-combo-box-item", { value: item.id, onItemSelected: () => (this.selectedModule = Object.assign(Object.assign({}, this.selectedModule), { currentVersion: item.id })) }, item.id))))));
+        };
+        this.selectedButtonChangedHandler = (e) => {
+            const type = e.detail.replace("btn-", "");
+            this.filterModulesByType(type);
+        };
+        this.serverItemSelectedHandler = (e) => {
+            const serverId = e.detail.value;
+            this.serverSelectedCallbackHandler(serverId);
+        };
+        this.serverValueChangedHandler = (e) => {
+            const serverId = e.detail;
+            this.serverSelectedCallbackHandler(serverId);
+        };
+        this.progressBarCloseHandler = () => {
+            setTimeout(() => {
+                this.actionCompleted = true;
+                this.closeProgressBar = true;
+                // reset
+                this.progressValue = 0;
+                this.progressState = "in-progress";
+            }, 400);
+            // delay to force the footer line disappear after the top-state-bar has been closed.
+        };
+        this.modulesAll = [];
+        this.filteredModules = [];
+        this.selectedModule = undefined;
+        this.selectedServerId = undefined;
+        this.selectedModuleAction = {
+            message: "",
+            progress: 0,
+            state: "in-progress"
+        };
+        this.actionCompleted = true;
+        this.closeProgressBar = true;
+        this.progressValue = 0;
+        this.progressState = "in-progress";
+        this.servers = [];
+        this.serverSelectedCallback = undefined;
+        this.executeActionCallback = undefined;
+        this.addServerCallback = undefined;
+        this.serverContextMenuCallback = undefined;
+    }
+    // 6.COMPONENT LIFECYCLE EVENTS //
+    async componentDidLoad() { }
+    componentDidRender() {
+        if (!this.renderedFirstTime) {
+            this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
+            this.renderedFirstTime = true;
+        }
+    }
+    async componentWillLoad() {
+        this._componentLocale = await Locale.getComponentStrings(this.el);
+        await this.serverSelectedCallbackHandler(this.servers[0].id);
+    }
+    // 7.LISTENERS //
+    onPropValueChange(newModulesData) {
+        this.filteredModules = [...newModulesData];
+    }
+    // 8.PUBLIC METHODS API //
+    /**
+     * validate
+     */
+    async validate() {
+        return true;
+    }
+    // 11.RENDER() FUNCTION //
+    render() {
+        return (h(Host, { class: {
+                "gx-ide-component": true
+            } }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { noAboveFooterPadding: true, noBorderAboveFooter: this.closeProgressBar, noContentPadding: true, part: "servers", containerTitle: this._componentLocale.componentName }, h("main", { class: "main" }, h("div", { class: "modules__container" }, h("header", { class: "modules__header" }, h("div", { class: "modules__combo-container" }, h("gxg-label", null, this._componentLocale.modules.selectServer), h("div", { class: "modules__combo" }, h("gxg-combo-box", { disableFilter: true, onValueChanged: this.serverValueChangedHandler }, this.servers.map(item => (h("gxg-combo-box-item", { value: item.id, onItemSelected: this.serverItemSelectedHandler }, item.name)))), h("span", { class: "modules__menu-container" }, h("gxg-button", { type: "secondary-icon-only", icon: "gemini-tools/show-more-horizontal", onClick: this.showModuleMenu }), this.renderMenu()))), h("gxg-form-text", { label: this._componentLocale.modules.searchModules, labelPosition: "above", centerLabel: false, onValueChanged: (event) => {
+                this.handleFilterChange(event.detail);
+            } }), h("gxg-buttons-container", { reduced: true, fullWidth: true, class: "modules__browser", onSelectedButtonChanged: this.selectedButtonChangedHandler }, h("gxg-button", { id: "btn-browse", selected: true }, this._componentLocale.modules.tabs.browse), h("gxg-button", { id: "btn-installed" }, this._componentLocale.modules.tabs.installed), h("gxg-button", { id: "btn-updates" }, this._componentLocale.modules.tabs.updates))), this.renderModulesGrid()), this.selectedModule ? (h("div", { class: "module-info" }, h("header", { class: "module-info__header" }, this.renderModuleName(), this.renderModuleAction(), this.renderModuleVersions()), h("div", { class: "module-info__properties gxg-scrollbar" }, renderModuleDataProperties(this.selectedModule.properties)))) : null), h("gxg-top-state-bar", { slot: "footer-above", part: "progress-bar", stateType: this.progressState, noBorder: true, caption: this.selectedModuleAction.message ||
+                this._componentLocale.progressDefaultCaption, progress: this.progressValue, active: !this.actionCompleted || !this.closeProgressBar, autoClose: false, withClose: true, closedCallback: this.progressBarCloseHandler })))));
+    }
+    static get is() { return "gx-ide-manage-module-references"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["manage-module-references.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["manage-module-references.css"]
+        };
+    }
+    static get assetsDirs() { return ["gx-ide-assets/manage-module-references"]; }
+    static get properties() {
+        return {
+            "servers": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "ModuleServerData[]",
+                    "resolved": "ModuleServerData[]",
+                    "references": {
+                        "ModuleServerData": {
+                            "location": "import",
+                            "path": "../types",
+                            "id": "src/components/modules/types.ts::ModuleServerData"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "List of module servers currently cataloged"
+                },
+                "defaultValue": "[]"
+            },
+            "serverSelectedCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "ServerSelectedCallback",
+                    "resolved": "(id: string) => Promise<ModuleData[]>",
+                    "references": {
+                        "ServerSelectedCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/modules/manage-module-references/manage-module-references.tsx",
+                            "id": "src/components/modules/manage-module-references/manage-module-references.tsx::ServerSelectedCallback"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Callback invoked when a server is selected. Returns the set of modules available on that server."
+                }
+            },
+            "executeActionCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "ExecuteActionCallback",
+                    "resolved": "(serverId: string, moduleId: string, action: ModuleActionType, onProgress: (message: string, progress: number, state: topStateBarType) => void) => Promise<boolean>",
+                    "references": {
+                        "ExecuteActionCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/modules/manage-module-references/manage-module-references.tsx",
+                            "id": "src/components/modules/manage-module-references/manage-module-references.tsx::ExecuteActionCallback"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Callback invoked when the user wants to execute the action corresponding to a selected module. When the action begins to be executed, the component must be able to show the progress of the action. For this, the onProgress parameter is available, which is in turn a callback used by the host to notify the progress by text message and percentage."
+                }
+            },
+            "addServerCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "AddServerCallback",
+                    "resolved": "() => Promise<void>",
+                    "references": {
+                        "AddServerCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/modules/manage-module-references/manage-module-references.tsx",
+                            "id": "src/components/modules/manage-module-references/manage-module-references.tsx::AddServerCallback"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Callback invoked when Add button is clicked"
+                }
+            },
+            "serverContextMenuCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "ServerContextMenuCallback",
+                    "resolved": "(contextMenuInfo: ContextMenuInfo) => Promise<void>",
+                    "references": {
+                        "ServerContextMenuCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/modules/manage-module-references/manage-module-references.tsx",
+                            "id": "src/components/modules/manage-module-references/manage-module-references.tsx::ServerContextMenuCallback"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Callback invoked when an element is right clicked on servers list"
+                }
+            }
+        };
+    }
+    static get states() {
+        return {
+            "modulesAll": {},
+            "filteredModules": {},
+            "selectedModule": {},
+            "selectedServerId": {},
+            "selectedModuleAction": {},
+            "actionCompleted": {},
+            "closeProgressBar": {},
+            "progressValue": {},
+            "progressState": {}
+        };
+    }
+    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": {}
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "validate": {
+                "complexType": {
+                    "signature": "() => Promise<boolean>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<boolean>"
+                },
+                "docs": {
+                    "text": "validate",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "modulesAll",
+                "methodName": "onPropValueChange"
+            }];
+    }
+}
+//# sourceMappingURL=manage-module-references.js.map

package/dist/collection/components/modules/manage-module-references/manage-module-references.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"manage-module-references.js","sourceRoot":"","sources":["../../../../src/components/modules/manage-module-references/manage-module-references.tsx"],"names":[],"mappings":"AAAA,qBAAqB;AACrB,OAAO,EACL,SAAS,EACT,IAAI,EACJ,CAAC,EACD,IAAI,EACJ,KAAK,EACL,OAAO,EAEP,MAAM,EACN,KAAK,EACL,KAAK,EACN,MAAM,eAAe,CAAC;AAYvB,OAAO,EAAE,0BAA0B,EAAE,MAAM,wBAAwB,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAUhD,MAAM,OAAO,wBAAwB;;QAO3B,sBAAiB,GAAG,KAAK,CAAC;QA8FlC,qBAAqB;QAEb,sCAAiC,GAAG,GAAqB,EAAE;YACjE,MAAM,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,IAAI,CAChD,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,cAAc,CAAC,cAAc,CACtD,CAAC;YACF,OAAO,QAAQ,CAAC,MAAM,CAAC;QACzB,CAAC,CAAC;QAEF;;WAEG;QACK,eAAU,GAAG,CACnB,OAAe,EACf,QAAgB,EAChB,KAAsB,EAChB,EAAE;YACR,MAAM,IAAI,GAAG,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;YAC1C,IAAI,CAAC,oBAAoB,qBAAQ,IAAI,CAAE,CAAC;YACxC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,oBAAoB,CAAC,QAAQ,CAAC;YACxD,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC;QACvD,CAAC,CAAC;QAEF,sBAAsB;QAEtB;;WAEG;QACK,uBAAkB,GAAG,CAAC,GAAQ,EAAE,EAAE;YACxC,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;YAC5E,IAAI,CAAC,cAAc,GAAG,WAAW,CAAC;QACpC,CAAC,CAAC;QAEF;;WAEG;QACK,kCAA6B,GAAG,KAAK,EAAE,EAAO,EAAE,EAAE;YACxD,MAAM,eAAe,GAAG,MAAM,IAAI,CAAC,sBAAsB,CAAC,EAAE,CAAC,CAAC;YAE9D,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;YAE3B,IAAI,CAAC,UAAU,GAAG,CAAC,GAAG,eAAe,CAAC,CAAC;YACvC,IAAI,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC;YACnC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;QAChD,CAAC,CAAC;QACM,uBAAkB,GAAG,CAAC,KAAa,EAAE,EAAE;YAC7C,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC;YAElC,IAAI,YAAY,EAAE;gBAChB,MAAM,cAAc,GAAG,YAAY,CAAC,WAAW,EAAE,CAAC;gBAClD,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CACrD,MAAM,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,cAAc,CAAC,CACnD,CAAC;aACH;iBAAM;gBACL,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,UAAU,CAAC;aACxC;QACH,CAAC,CAAC;QAEF;;WAEG;QACK,iCAA4B,GAAG,KAAK,EAAE,MAAkB,EAAE,EAAE;YAClE,MAAM,eAAe,GAAG,MAAM,IAAI,CAAC,qBAAqB,CACtD,IAAI,CAAC,gBAAgB,EACrB,MAAM,CAAC,EAAE,EACT,IAAI,CAAC,iCAAiC,EAAE,EACxC,IAAI,CAAC,UAAU,CAChB,CAAC;YACF,IAAI,CAAC,eAAe,GAAG,eAAe,CAAC;QACzC,CAAC,CAAC;QAEM,wBAAmB,GAAG,CAAC,IAAsB,EAAE,EAAE;YACvD,SAAS;YACT,IAAI,IAAI,KAAK,QAAQ,EAAE;gBACrB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,UAAU,CAAC;aACxC;YACD,YAAY;iBACP,IAAI,IAAI,KAAK,WAAW,EAAE;gBAC7B,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,MAAkB,EAAE,EAAE;oBACnE,MAAM,WAAW,GAAsB,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE;wBACpE,OAAO,OAAO,CAAC,EAAE,KAAK,MAAM,CAAC,cAAc,CAAC;oBAC9C,CAAC,CAAC,CAAC;oBACH,OAAO,CACL,WAAW;wBACX,CAAC,WAAW,CAAC,MAAM,KAAK,SAAS,IAAI,WAAW,CAAC,MAAM,KAAK,QAAQ,CAAC,CACtE,CAAC;gBACJ,CAAC,CAAC,CAAC;aACJ;iBAAM,IAAI,IAAI,KAAK,SAAS,EAAE;gBAC7B,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,MAAkB,EAAE,EAAE;oBACnE,MAAM,WAAW,GAAsB,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE;wBACpE,OAAO,OAAO,CAAC,EAAE,KAAK,MAAM,CAAC,cAAc,CAAC;oBAC9C,CAAC,CAAC,CAAC;oBACH,OAAO,WAAW,IAAI,WAAW,CAAC,MAAM,KAAK,QAAQ,CAAC;gBACxD,CAAC,CAAC,CAAC;aACJ;QACH,CAAC,CAAC;QAEM,sCAAiC,GAAG,KAAK,EAC/C,CAA0B,EAC1B,EAAE;YACF,MAAM,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;YAClC,IAAI,MAAM,KAAK,KAAK,EAAE;gBACpB,IAAI,IAAI,CAAC,iBAAiB,EAAE;oBAC1B,MAAM,IAAI,CAAC,iBAAiB,EAAE,CAAC;iBAChC;aACF;iBAAM,IAAI,MAAM,KAAK,MAAM,EAAE;gBAC5B,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;aACrC;iBAAM,IAAI,MAAM,KAAK,QAAQ,EAAE;gBAC9B,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;aACvB;QACH,CAAC,CAAC;QAEM,eAAU,GAAG,GAAG,EAAE;YACxB,OAAO,CACL,4BACE,kBAAkB,EAAE,IAAI,CAAC,iCAAiC,EAC1D,KAAK,EAAC,eAAe,EACrB,IAAI,EAAC,kBAAkB,EACvB,QAAQ,EAAC,aAAa,EACtB,QAAQ,QACR,KAAK,EAAE;oBACL,IAAI,EAAE,IAAI,CAAC,sBAAsB;oBACjC,GAAG,EAAE,IAAI,CAAC,qBAAqB;iBAChC;gBAED,iCACE,MAAM,EAAC,KAAK,EACZ,SAAS,EAAC,KAAK,EACf,IAAI,EAAC,kBAAkB,GACI;gBAC7B,iCACE,MAAM,EAAC,MAAM,EACb,SAAS,EAAC,MAAM,EAChB,IAAI,EAAC,mBAAmB,GACG;gBAC7B,iCACE,MAAM,EAAC,QAAQ,EACf,SAAS,EAAC,kBAAkB,EAC5B,IAAI,EAAC,mBAAmB,GACG,CACR,CACxB,CAAC;QACJ,CAAC,CAAC;QAEM,mBAAc,GAAG,KAAK,EAAE,CAAa,EAAE,EAAE;YAC/C,IAAI,IAAI,CAAC,yBAAyB,EAAE;gBAClC,MAAM,wBAAwB,GAC5B,CAAC,CAAC,MACH,CAAC,qBAAqB,EAAE,CAAC;gBAC1B,MAAM,IAAI,CAAC,yBAAyB,CAAC;oBACnC,SAAS,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC;oBAClC,OAAO,EAAE,wBAAwB,CAAC,CAAC;oBACnC,OAAO,EAAE,wBAAwB,CAAC,CAAC;iBACpC,CAAC,CAAC;aACJ;QACH,CAAC,CAAC;QAEM,sBAAiB,GAAG,GAAY,EAAE;YACxC,OAAO,CACL,gBAAU,QAAQ,QAAC,UAAU;gBAC3B,eACE,gBAAgB,EAAC,QAAQ,EACzB,IAAI,EAAC,yBAAyB,EAC9B,KAAK,EAAC,WAAW;oBACjB,yIAAyI;oBACzI,kBAAkB,EAAE,CAAC,GAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,GAAG,CAAC,MAAM,CAAC;oBAErE;wBACE,sBACE,WAAW,EAAE,KAAK,EAClB,IAAI,EAAC,aAAa,GACF;wBAElB,sBAAgB,WAAW,EAAE,KAAK,GAAmB;wBACrD,sBACE,WAAW,EAAE,KAAK,EAClB,IAAI,EAAC,aAAa,GACF,CACA;oBAEnB,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,IAAgB,EAAE,EAAE,CAAC,CAC9C,mBACE,KAAK,EAAE,IAAI,CAAC,EAAE,EACd,GAAG,EAAE,IAAI,CAAC,EAAE,EACZ,QAAQ,EACN,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE;wBAG3D;4BACE,gBACE,IAAI,EAAC,gBAAgB,EACrB,KAAK,EAAC,MAAM,EACZ,IAAI,EAAC,OAAO,GACF,CACC;wBACf,oBAAc,KAAK,EAAC,wBAAwB;4BAC1C,YAAM,KAAK,EAAC,wBAAwB,IAAE,IAAI,CAAC,IAAI,CAAQ;4BACvD,YAAM,KAAK,EAAC,+BAA+B,IACxC,IAAI,CAAC,WAAW,CACZ,CACM;wBAEf,wBACG,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAC3D,kBACE,QAAQ,EAAE,CAAC,IAAI,CAAC,eAAe,EAC/B,GAAG,QACH,IAAI,EAAC,eAAe,EACpB,OAAO,EAAE,GAAG,EAAE;gCACZ,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;gCAC7B,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;gCAC9B,IAAI,CAAC,4BAA4B,CAAC,IAAI,CAAC,CAAC;4BAC1C,CAAC,IAEA,IAAI,CAAC,iCAAiC,EAAE,CAC9B,CACd,CAAC,CAAC,CAAC,IAAI,CACK,CACH,CACf,CAAC,CACM,CACD,CACZ,CAAC;QACJ,CAAC,CAAC;QAEM,oBAAe,GAAG,GAAU,EAAE;YACpC,OAAO,IAAI,CAAC,iCAAiC,EAAE,KAAK,SAAS;gBAC3D,CAAC,CAAC,0BAA0B;gBAC5B,CAAC,CAAC,iBAAiB,CAAC;QACxB,CAAC,CAAC;QAEF,uCAAuC;QAC/B,qBAAgB,GAAG,GAAG,EAAE;YAC9B,OAAO,CACL,iBAAW,IAAI,EAAC,mBAAmB,EAAC,IAAI,EAAC,UAAU;gBACjD,WAAK,KAAK,EAAC,mBAAmB;oBAC5B,gBACE,IAAI,EAAC,gBAAgB,EACrB,KAAK,EAAE,IAAI,CAAC,eAAe,EAAE,GACnB;oBACX,IAAI,CAAC,cAAc,CAAC,IAAI,CACrB,CACI,CACb,CAAC;QACJ,CAAC,CAAC;QACM,uBAAkB,GAAG,GAAG,EAAE;YAChC,OAAO,IAAI,CAAC,iCAAiC,EAAE,KAAK,SAAS,CAAC,CAAC,CAAC,CAC9D,WAAK,KAAK,EAAC,+BAA+B;gBACxC,gBAAU,IAAI,EAAC,eAAe,IAE1B,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,gBAAgB;qBACtD,YAAY,CAER,CACP,CACP,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,wEAAwE;gBACjF,gBAAU,IAAI,EAAC,WAAW,IACvB,IAAI,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,gBAAgB,MAAM,IAAI,CAAC,cAAc,CAAC,cAAc,EAAE,CAChH,CACP,CACP,CAAC;QACJ,CAAC,CAAC;QAEM,sCAAiC,GAAG,CAAC,CAAmB,EAAE,EAAE;YAClE,MAAM,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC;YAC1B,IAAI,CAAC,cAAc,mCACd,IAAI,CAAC,cAAc,KACtB,cAAc,EAAE,QAAQ,GACzB,CAAC;QACJ,CAAC,CAAC;QAEM,yBAAoB,GAAG,GAAG,EAAE;YAClC,OAAO,CACL,WAAK,IAAI,EAAC,oBAAoB;gBAC5B,qBACE,EAAE,EAAC,oBAAoB,0BAEvB,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAC5C,IAAI,EAAC,iBAAiB,yEAGtB,KAAK,EACH,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,gBAAgB;yBACtD,iBAAiB,EAEtB,aAAa,EAAC,OAAO,EACrB,WAAW,QACX,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAA4B,CAAC,EAC5D,cAAc,EAAE,IAAI,CAAC,iCAAiC,IAErD,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACxC,0BACE,KAAK,EAAE,IAAI,CAAC,EAAE,EACd,cAAc,EAAE,GAAG,EAAE,CACnB,CAAC,IAAI,CAAC,cAAc,mCACf,IAAI,CAAC,cAAc,KACtB,cAAc,EAAE,IAAI,CAAC,EAAE,GACxB,CAAC,IAGH,IAAI,CAAC,EAAE,CACW,CACtB,CAAC,CACY,CACZ,CACP,CAAC;QACJ,CAAC,CAAC;QAEM,iCAA4B,GAAG,CAAC,CAAsB,EAAE,EAAE;YAChE,MAAM,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAqB,CAAC;YAC9D,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC;QACjC,CAAC,CAAC;QAEM,8BAAyB,GAAG,CAClC,CAKE,EACF,EAAE;YACF,MAAM,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;YAChC,IAAI,CAAC,6BAA6B,CAAC,QAAQ,CAAC,CAAC;QAC/C,CAAC,CAAC;QAEM,8BAAyB,GAAG,CAAC,CAAmB,EAAE,EAAE;YAC1D,MAAM,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC;YAC1B,IAAI,CAAC,6BAA6B,CAAC,QAAQ,CAAC,CAAC;QAC/C,CAAC,CAAC;QAEM,4BAAuB,GAAG,GAAG,EAAE;YACrC,UAAU,CAAC,GAAG,EAAE;gBACd,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;gBAC5B,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;gBAC7B,QAAQ;gBACR,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC;gBACvB,IAAI,CAAC,aAAa,GAAG,aAAa,CAAC;YACrC,CAAC,EAAE,GAAG,CAAC,CAAC;YACR,oFAAoF;QACtF,CAAC,CAAC;0BAvakC,EAAE;+BACG,EAAE;;;oCAGC;YAC1C,OAAO,EAAE,EAAE;YACX,QAAQ,EAAE,CAAC;YACX,KAAK,EAAE,aAAa;SACrB;+BAC0B,IAAI;gCACH,IAAI;6BACC,CAAC;6BACQ,aAAa;uBAOR,EAAE;;;;;;IA6BjD,kCAAkC;IAElC,KAAK,CAAC,gBAAgB,KAAI,CAAC;IAE3B,kBAAkB;QAChB,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE;YAC3B,IAAI,CAAC,2BAA2B,CAAC,IAAI,CACnC,IAAI,CAAC,gBAAgB,CAAC,aAAa,CACpC,CAAC;YACF,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;SAC/B;IACH,CAAC;IAED,KAAK,CAAC,iBAAiB;QACrB,IAAI,CAAC,gBAAgB,GAAG,MAAM,MAAM,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAClE,MAAM,IAAI,CAAC,6BAA6B,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;IAC/D,CAAC;IAED,iBAAiB;IAGjB,iBAAiB,CAAC,cAA4B;QAC5C,IAAI,CAAC,eAAe,GAAG,CAAC,GAAG,cAAc,CAAC,CAAC;IAC7C,CAAC;IAED,0BAA0B;IAE1B;;OAEG;IAEH,KAAK,CAAC,QAAQ;QACZ,OAAO,IAAI,CAAC;IACd,CAAC;IAwVD,0BAA0B;IAE1B,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;gBACL,kBAAkB,EAAE,IAAI;aACzB;YAED,WAAK,KAAK,EAAC,qBAAqB;gBAC9B,wBACE,oBAAoB,QACpB,mBAAmB,EAAE,IAAI,CAAC,gBAAgB,EAC1C,gBAAgB,QAChB,IAAI,EAAC,SAAS,EACd,cAAc,EAAE,IAAI,CAAC,gBAAgB,CAAC,aAAa;oBAGnD,YAAM,KAAK,EAAC,MAAM;wBAChB,WAAK,KAAK,EAAC,oBAAoB;4BAC7B,cAAQ,KAAK,EAAC,iBAAiB;gCAC7B,WAAK,KAAK,EAAC,0BAA0B;oCACnC,qBACG,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,YAAY,CACjC;oCACZ,WAAK,KAAK,EAAC,gBAAgB;wCACzB,qBACE,aAAa,QACb,cAAc,EAAE,IAAI,CAAC,yBAAyB,IAE7C,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACxB,0BACE,KAAK,EAAE,IAAI,CAAC,EAAE,EACd,cAAc,EAAE,IAAI,CAAC,yBAAyB,IAE7C,IAAI,CAAC,IAAI,CACS,CACtB,CAAC,CACY;wCAChB,YAAM,KAAK,EAAC,yBAAyB;4CACnC,kBACE,IAAI,EAAC,qBAAqB,EAC1B,IAAI,EAAC,mCAAmC,EACxC,OAAO,EAAE,IAAI,CAAC,cAAc,GAChB;4CACb,IAAI,CAAC,UAAU,EAAE,CACb,CACH,CACF;gCACN,qBACE,KAAK,EAAE,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,aAAa,EAClD,aAAa,EAAC,OAAO,EACrB,WAAW,EAAE,KAAK,EAClB,cAAc,EAAE,CAAC,KAAU,EAAE,EAAE;wCAC7B,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;oCACxC,CAAC,GACc;gCACjB,6BACE,OAAO,QACP,SAAS,QACT,KAAK,EAAC,kBAAkB,EACxB,uBAAuB,EAAE,IAAI,CAAC,4BAA4B;oCAE1D,kBAAY,EAAE,EAAC,YAAY,EAAC,QAAQ,UACjC,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAC/B;oCACb,kBAAY,EAAE,EAAC,eAAe,IAC3B,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAClC;oCACb,kBAAY,EAAE,EAAC,aAAa,IACzB,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAChC,CACS,CACjB;4BAGR,IAAI,CAAC,iBAAiB,EAAE,CACrB;wBAGL,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CACrB,WAAK,KAAK,EAAC,aAAa;4BACtB,cAAQ,KAAK,EAAC,qBAAqB;gCAChC,IAAI,CAAC,gBAAgB,EAAE;gCACvB,IAAI,CAAC,kBAAkB,EAAE;gCACzB,IAAI,CAAC,oBAAoB,EAAE,CACrB;4BACT,WAAK,KAAK,EAAC,uCAAuC,IAC/C,0BAA0B,CAAC,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC,CACvD,CACF,CACP,CAAC,CAAC,CAAC,IAAI,CACH;oBAGP,yBACE,IAAI,EAAC,cAAc,EACnB,IAAI,EAAC,cAAc,EACnB,SAAS,EAAE,IAAI,CAAC,aAAa,EAC7B,QAAQ,QACR,OAAO,EACL,IAAI,CAAC,oBAAoB,CAAC,OAAO;4BACjC,IAAI,CAAC,gBAAgB,CAAC,sBAAsB,EAE9C,QAAQ,EAAE,IAAI,CAAC,aAAa,EAC5B,MAAM,EAAE,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,CAAC,gBAAgB,EACvD,SAAS,EAAE,KAAK,EAChB,SAAS,QACT,cAAc,EAAE,IAAI,CAAC,uBAAuB,GACzB,CACJ,CACf,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/* STENCIL IMPORTS */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  Element,\n  EventEmitter,\n  Method,\n  State,\n  Watch\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { Color } from \"@genexus/gemini\";\nimport { topStateBarType } from \"@genexus/gemini\";\n/* CUSTOM IMPORTS */\nimport {\n  ModuleServerData,\n  ModuleData,\n  ModuleActionType,\n  ModuleFilterType,\n  ModuleVersionData\n} from \"../types\";\nimport { renderModuleDataProperties } from \"../../../common/common\";\nimport { Locale } from \"../../../common/locale\";\nimport { ItemData } from \"../../../components/_helpers/list-selector/list-selector-item/list-selector-item\";\nimport { ContextMenuInfo } from \"../../../common/types\";\n\n@Component({\n  tag: \"gx-ide-manage-module-references\",\n  styleUrl: \"manage-module-references.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/manage-module-references\"]\n})\nexport class GxManageModuleReferences {\n  // 1.OWN PROPERTIES | WATCH'S //\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n  private renderedFirstTime = false;\n\n  // 2. REFERENCE TO ELEMENTS //\n\n  @Element() el: HTMLGxIdeManageModuleReferencesElement;\n  private modulesList!: HTMLGxgComboBoxElement;\n  private moduleMenuLeftPosition: string;\n  private moduleMenuTopPosition: string;\n\n  // 3.STATE() VARIABLES //\n\n  @State() modulesAll: ModuleData[] = [];\n  @State() filteredModules: ModuleData[] = [];\n  @State() selectedModule: ModuleData;\n  @State() selectedServerId: string;\n  @State() selectedModuleAction: ActionInfo = {\n    message: \"\",\n    progress: 0,\n    state: \"in-progress\"\n  };\n  @State() actionCompleted = true;\n  @State() closeProgressBar = true;\n  @State() progressValue: number = 0;\n  @State() progressState: topStateBarType = \"in-progress\";\n\n  // 4.PUBLIC PROPERTY API //\n\n  /**\n   * List of module servers currently cataloged\n   */\n  @Prop() readonly servers: ModuleServerData[] = [];\n\n  /**\n   * Callback invoked when a server is selected. Returns the set of modules available on that server.\n   */\n  @Prop() readonly serverSelectedCallback: ServerSelectedCallback;\n\n  /**\n   * Callback invoked when the user wants to execute the action corresponding to a selected module. When the action begins to be executed, the component must be able to show the progress of the action. For this, the onProgress parameter is available, which is in turn a callback used by the host to notify the progress by text message and percentage.\n   */\n  @Prop() readonly executeActionCallback: ExecuteActionCallback;\n\n  /**\n   * Callback invoked when Add button is clicked\n   */\n  @Prop() readonly addServerCallback: AddServerCallback;\n\n  /**\n   * Callback invoked when an element is right clicked on servers list\n   */\n  @Prop() readonly serverContextMenuCallback: ServerContextMenuCallback;\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  // 6.COMPONENT LIFECYCLE EVENTS //\n\n  async componentDidLoad() {}\n\n  componentDidRender() {\n    if (!this.renderedFirstTime) {\n      this.componentDidRenderFirstTime.emit(\n        this._componentLocale.componentName\n      );\n      this.renderedFirstTime = true;\n    }\n  }\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n    await this.serverSelectedCallbackHandler(this.servers[0].id);\n  }\n\n  // 7.LISTENERS //\n\n  @Watch(\"modulesAll\")\n  onPropValueChange(newModulesData: ModuleData[]) {\n    this.filteredModules = [...newModulesData];\n  }\n\n  // 8.PUBLIC METHODS API //\n\n  /**\n   * validate\n   */\n  @Method()\n  async validate(): Promise<boolean> {\n    return true;\n  }\n\n  // 9.LOCAL METHODS //\n\n  private getActionFromCurrentModuleVersion = (): ModuleActionType => {\n    const selected = this.selectedModule.versions.find(\n      ({ id }) => id === this.selectedModule.currentVersion\n    );\n    return selected.action;\n  };\n\n  /**\n   * Callback invoked to get the progress when module is performing an action\n   */\n  private onProgress = (\n    message: string,\n    progress: number,\n    state: topStateBarType\n  ): void => {\n    const data = { message, progress, state };\n    this.selectedModuleAction = { ...data };\n    this.progressValue = this.selectedModuleAction.progress;\n    this.progressState = this.selectedModuleAction.state;\n  };\n\n  // 10.LOCAL METHODS //\n\n  /**\n   * Used for changing the selected module\n   */\n  private handleModuleChange = (row: any) => {\n    const foundModule = this.modulesAll.find(item => item.id === row.rowsId[0]);\n    this.selectedModule = foundModule;\n  };\n\n  /**\n   * Change the server selected value in response to callbackServerSelected callback\n   */\n  private serverSelectedCallbackHandler = async (id: any) => {\n    const resolvedObjects = await this.serverSelectedCallback(id);\n\n    this.selectedServerId = id;\n\n    this.modulesAll = [...resolvedObjects];\n    this.filterModulesByType(\"browse\");\n    this.selectedModule = this.filteredModules[0];\n  };\n  private handleFilterChange = (value: string) => {\n    const trimmedValue = value.trim();\n\n    if (trimmedValue) {\n      const lowerCaseValue = trimmedValue.toLowerCase();\n      this.filteredModules = this.modulesAll.filter(module =>\n        module.name.toLowerCase().includes(lowerCaseValue)\n      );\n    } else {\n      this.filteredModules = this.modulesAll;\n    }\n  };\n\n  /**\n   * Perform an action relative to a module using callbackExecuteAction callback and receive the state of that action with onProgress callback\n   */\n  private executeActionCallbackHandler = async (module: ModuleData) => {\n    const actionCompleted = await this.executeActionCallback(\n      this.selectedServerId,\n      module.id,\n      this.getActionFromCurrentModuleVersion(),\n      this.onProgress\n    );\n    this.actionCompleted = actionCompleted;\n  };\n\n  private filterModulesByType = (type: ModuleFilterType) => {\n    // browse\n    if (type === \"browse\") {\n      this.filteredModules = this.modulesAll;\n    }\n    // installed\n    else if (type === \"installed\") {\n      this.filteredModules = this.modulesAll.filter((module: ModuleData) => {\n        const versionData: ModuleVersionData = module.versions.find(version => {\n          return version.id === module.currentVersion;\n        });\n        return (\n          versionData &&\n          (versionData.action === \"restore\" || versionData.action === \"update\")\n        );\n      });\n    } else if (type === \"updates\") {\n      this.filteredModules = this.modulesAll.filter((module: ModuleData) => {\n        const versionData: ModuleVersionData = module.versions.find(version => {\n          return version.id === module.currentVersion;\n        });\n        return versionData && versionData.action === \"update\";\n      });\n    }\n  };\n\n  private moduleMenuSelectionChangedHandler = async (\n    e: CustomEvent<ItemData[]>\n  ) => {\n    const itemId = e.detail[0].itemId;\n    if (itemId === \"add\") {\n      if (this.addServerCallback) {\n        await this.addServerCallback();\n      }\n    } else if (itemId === \"edit\") {\n      console.log(this.modulesList.value);\n    } else if (itemId === \"upload\") {\n      console.log(\"upload\");\n    }\n  };\n\n  private renderMenu = () => {\n    return (\n      <gx-ide-list-selector\n        onSelectionChanged={this.moduleMenuSelectionChangedHandler}\n        class=\"modules__menu\"\n        type=\"single-selection\"\n        listName=\"module-menu\"\n        ellipsis\n        style={{\n          left: this.moduleMenuLeftPosition,\n          top: this.moduleMenuTopPosition\n        }}\n      >\n        <gx-ide-list-selector-item\n          itemId=\"add\"\n          itemValue=\"Add\"\n          icon=\"gemini-tools/add\"\n        ></gx-ide-list-selector-item>\n        <gx-ide-list-selector-item\n          itemId=\"edit\"\n          itemValue=\"Edit\"\n          icon=\"gemini-tools/edit\"\n        ></gx-ide-list-selector-item>\n        <gx-ide-list-selector-item\n          itemId=\"upload\"\n          itemValue=\"Upload from file\"\n          icon=\"gemini-tools/file\"\n        ></gx-ide-list-selector-item>\n      </gx-ide-list-selector>\n    );\n  };\n\n  private showModuleMenu = async (e: MouseEvent) => {\n    if (this.serverContextMenuCallback) {\n      const buttonBoundingClientRect = (\n        e.target as HTMLElement\n      ).getBoundingClientRect();\n      await this.serverContextMenuCallback({\n        selection: [this.selectedServerId],\n        clientX: buttonBoundingClientRect.x,\n        clientY: buttonBoundingClientRect.y\n      });\n    }\n  };\n\n  private renderModulesGrid = (): Element => {\n    return (\n      <gxg-grid noBorder fullHeight>\n        <ch-grid\n          rowSelectionMode=\"single\"\n          part=\"ch-grid-pending-commits\"\n          class=\"no-border\"\n          /* TODO: El error es aqui ya que se esta enviando el valor del row Id correspondiente a la primera carga del grid con el primer server */\n          onSelectionChanged={(row: any) => this.handleModuleChange(row.detail)}\n        >\n          <ch-grid-columnset>\n            <ch-grid-column\n              settingable={false}\n              size=\"min-content\"\n            ></ch-grid-column>\n\n            <ch-grid-column settingable={false}></ch-grid-column>\n            <ch-grid-column\n              settingable={false}\n              size=\"min-content\"\n            ></ch-grid-column>\n          </ch-grid-columnset>\n\n          {this.filteredModules.map((item: ModuleData) => (\n            <ch-grid-row\n              rowid={item.id}\n              key={item.id}\n              selected={\n                this.selectedModule && this.selectedModule.id === item.id\n              }\n            >\n              <ch-grid-cell>\n                <gxg-icon\n                  type=\"objects/module\"\n                  color=\"auto\"\n                  size=\"small\"\n                ></gxg-icon>\n              </ch-grid-cell>\n              <ch-grid-cell class=\"grid-cell-module__info\">\n                <span class=\"grid-cell-module__name\">{item.name}</span>\n                <span class=\"grid-cell-module__description\">\n                  {item.description}\n                </span>\n              </ch-grid-cell>\n\n              <ch-grid-cell>\n                {this.selectedModule && this.selectedModule.id === item.id ? (\n                  <gxg-button\n                    disabled={!this.actionCompleted}\n                    fit\n                    part=\"module-action\"\n                    onClick={() => {\n                      this.actionCompleted = false;\n                      this.closeProgressBar = false;\n                      this.executeActionCallbackHandler(item);\n                    }}\n                  >\n                    {this.getActionFromCurrentModuleVersion()}\n                  </gxg-button>\n                ) : null}\n              </ch-grid-cell>\n            </ch-grid-row>\n          ))}\n        </ch-grid>\n      </gxg-grid>\n    );\n  };\n\n  private moduleIconColor = (): Color => {\n    return this.getActionFromCurrentModuleVersion() === \"install\"\n      ? \"mercury-primary-disabled\"\n      : \"mercury-primary\";\n  };\n\n  /* module details/information renders*/\n  private renderModuleName = () => {\n    return (\n      <gxg-title part=\"module-info__name\" type=\"title-05\">\n        <div class=\"module-info__name\">\n          <gxg-icon\n            type=\"objects/module\"\n            color={this.moduleIconColor()}\n          ></gxg-icon>\n          {this.selectedModule.name}\n        </div>\n      </gxg-title>\n    );\n  };\n  private renderModuleAction = () => {\n    return this.getActionFromCurrentModuleVersion() === \"install\" ? (\n      <div class=\"module-info__action-container\">\n        <gxg-text part=\"not-installed\">\n          {\n            this._componentLocale.modulesInformation.moduleProperties\n              .notInstalled\n          }\n        </gxg-text>\n      </div>\n    ) : (\n      <div class=\"module-info__action-container module-info__action-container--installed\">\n        <gxg-text part=\"installed\">\n          {` ${this._componentLocale.modulesInformation.moduleProperties.installedVersion} : ${this.selectedModule.currentVersion}`}\n        </gxg-text>\n      </div>\n    );\n  };\n\n  private moduleVersionsValueChangedHandler = (e: CustomEvent<any>) => {\n    const moduleId = e.detail;\n    this.selectedModule = {\n      ...this.selectedModule,\n      currentVersion: moduleId\n    };\n  };\n\n  private renderModuleVersions = () => {\n    return (\n      <div part=\"available-versions\">\n        <gxg-combo-box\n          id=\"versions-combo-box\"\n          disable-filter\n          value={this.selectedModule.versions[0][\"id\"]}\n          part=\"module-versions\"\n          display-validation-styles\n          display-validation-message\n          label={\n            this._componentLocale.modulesInformation.moduleProperties\n              .availableVersions\n          }\n          labelPosition=\"start\"\n          centerLabel\n          ref={el => (this.modulesList = el as HTMLGxgComboBoxElement)}\n          onValueChanged={this.moduleVersionsValueChangedHandler}\n        >\n          {this.selectedModule.versions.map(item => (\n            <gxg-combo-box-item\n              value={item.id}\n              onItemSelected={() =>\n                (this.selectedModule = {\n                  ...this.selectedModule,\n                  currentVersion: item.id\n                })\n              }\n            >\n              {item.id}\n            </gxg-combo-box-item>\n          ))}\n        </gxg-combo-box>\n      </div>\n    );\n  };\n\n  private selectedButtonChangedHandler = (e: CustomEvent<string>) => {\n    const type = e.detail.replace(\"btn-\", \"\") as ModuleFilterType;\n    this.filterModulesByType(type);\n  };\n\n  private serverItemSelectedHandler = (\n    e: CustomEvent<{\n      el: HTMLGxgComboBoxItemElement;\n      index: number;\n      value: any;\n      icon?: string;\n    }>\n  ) => {\n    const serverId = e.detail.value;\n    this.serverSelectedCallbackHandler(serverId);\n  };\n\n  private serverValueChangedHandler = (e: CustomEvent<any>) => {\n    const serverId = e.detail;\n    this.serverSelectedCallbackHandler(serverId);\n  };\n\n  private progressBarCloseHandler = () => {\n    setTimeout(() => {\n      this.actionCompleted = true;\n      this.closeProgressBar = true;\n      // reset\n      this.progressValue = 0;\n      this.progressState = \"in-progress\";\n    }, 400);\n    // delay to force the footer line disappear after the top-state-bar has been closed.\n  };\n\n  // 11.RENDER() FUNCTION //\n\n  render(): void {\n    return (\n      <Host\n        class={{\n          \"gx-ide-component\": true\n        }}\n      >\n        <div class=\"gx-ide-main-wrapper\">\n          <gx-ide-container\n            noAboveFooterPadding\n            noBorderAboveFooter={this.closeProgressBar}\n            noContentPadding\n            part=\"servers\"\n            containerTitle={this._componentLocale.componentName}\n          >\n            {/* Servers*/}\n            <main class=\"main\">\n              <div class=\"modules__container\">\n                <header class=\"modules__header\">\n                  <div class=\"modules__combo-container\">\n                    <gxg-label>\n                      {this._componentLocale.modules.selectServer}\n                    </gxg-label>\n                    <div class=\"modules__combo\">\n                      <gxg-combo-box\n                        disableFilter\n                        onValueChanged={this.serverValueChangedHandler}\n                      >\n                        {this.servers.map(item => (\n                          <gxg-combo-box-item\n                            value={item.id}\n                            onItemSelected={this.serverItemSelectedHandler}\n                          >\n                            {item.name}\n                          </gxg-combo-box-item>\n                        ))}\n                      </gxg-combo-box>\n                      <span class=\"modules__menu-container\">\n                        <gxg-button\n                          type=\"secondary-icon-only\"\n                          icon=\"gemini-tools/show-more-horizontal\"\n                          onClick={this.showModuleMenu}\n                        ></gxg-button>\n                        {this.renderMenu()}\n                      </span>\n                    </div>\n                  </div>\n                  <gxg-form-text\n                    label={this._componentLocale.modules.searchModules}\n                    labelPosition=\"above\"\n                    centerLabel={false}\n                    onValueChanged={(event: any) => {\n                      this.handleFilterChange(event.detail);\n                    }}\n                  ></gxg-form-text>\n                  <gxg-buttons-container\n                    reduced\n                    fullWidth\n                    class=\"modules__browser\"\n                    onSelectedButtonChanged={this.selectedButtonChangedHandler}\n                  >\n                    <gxg-button id=\"btn-browse\" selected>\n                      {this._componentLocale.modules.tabs.browse}\n                    </gxg-button>\n                    <gxg-button id=\"btn-installed\">\n                      {this._componentLocale.modules.tabs.installed}\n                    </gxg-button>\n                    <gxg-button id=\"btn-updates\">\n                      {this._componentLocale.modules.tabs.updates}\n                    </gxg-button>\n                  </gxg-buttons-container>\n                </header>\n\n                {/* modules grid*/}\n                {this.renderModulesGrid()}\n              </div>\n\n              {/* Module Information*/}\n              {this.selectedModule ? (\n                <div class=\"module-info\">\n                  <header class=\"module-info__header\">\n                    {this.renderModuleName()}\n                    {this.renderModuleAction()}\n                    {this.renderModuleVersions()}\n                  </header>\n                  <div class=\"module-info__properties gxg-scrollbar\">\n                    {renderModuleDataProperties(this.selectedModule.properties)}\n                  </div>\n                </div>\n              ) : null}\n            </main>\n\n            {/* Top State Bar*/}\n            <gxg-top-state-bar\n              slot=\"footer-above\"\n              part=\"progress-bar\"\n              stateType={this.progressState}\n              noBorder\n              caption={\n                this.selectedModuleAction.message ||\n                this._componentLocale.progressDefaultCaption\n              }\n              progress={this.progressValue}\n              active={!this.actionCompleted || !this.closeProgressBar}\n              autoClose={false}\n              withClose\n              closedCallback={this.progressBarCloseHandler}\n            ></gxg-top-state-bar>\n          </gx-ide-container>\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type ExecuteActionCallback = (\n  serverId: string,\n  moduleId: string,\n  action: ModuleActionType,\n  onProgress: (\n    message: string,\n    progress: number,\n    state: topStateBarType\n  ) => void\n) => Promise<boolean>;\n\nexport type ServerSelectedCallback = (id: string) => Promise<ModuleData[]>;\n\nexport type AddServerCallback = () => Promise<void>;\n\nexport type ServerContextMenuCallback = (\n  contextMenuInfo: ContextMenuInfo\n) => Promise<void>;\nexport interface ActionInfo {\n  message: string;\n  progress: number;\n  state: topStateBarType;\n}\n"]}

package/dist/collection/components/modules/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/collection/components/modules/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/modules/types.ts"],"names":[],"mappings":"","sourcesContent":["export type ModuleServerData = {\n  type: \"remote\" | \"local\";\n  id: string;\n  name: string;\n  source?: string;\n  authenticated?: boolean;\n};\n\nexport type ModuleServerType = {\n  id: string;\n  name: string;\n  type: \"local\" | \"remote\";\n  authenticated: boolean;\n};\n\nexport type ModuleData = {\n  id: string;\n  name: string;\n  description?: string;\n  versions?: ModuleVersionData[];\n  currentVersion?: string;\n  properties?: ModulePropertyData[];\n};\n\nexport type ModuleActionType = \"install\" | \"restore\" | \"update\";\n\nexport type ModuleFilterType = \"browse\" | \"installed\" | \"updates\";\n\nexport type ModulePropertyData = {\n  name: string;\n  value?: string | string[];\n  inline?: boolean;\n};\n\nexport type ModuleServerFullData = ModuleServerData & {\n  user?: string;\n  password?: string;\n};\n\nexport type ModuleVersionData = {\n  id: string;\n  action: ModuleActionType;\n};\n\nexport type EditServerModuleResult = {\n  success: boolean;\n  message: string;\n};\n"]}

package/dist/collection/pages/assets/common.js

@@ -291,3 +291,10 @@ const appendConsoleLog = log => {
 const stringify = data => {
   return JSON.stringify(data, null, 2);
 };
+
+/* --- Ch Styles --- */
+const head = document.head || document.getElementsByTagName("head")[0];
+const chStyle = document.createElement("ch-style");
+chStyle.innerText =
+  "::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width);cursor:initial}::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius);}::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}::-webkit-scrollbar-corner{background:rgba(0,0,0,0)}";
+head.appendChild(chStyle);

package/dist/components/buttons-container.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 
-const buttonsContainerCss = ":host{--ds-background-color-disabled:transparent;--ds-border-color-disabled:transparent;display:block}:host .container{background-color:var(--mer-elevation__background-color--01);border:var(--mer-elevation__border-01);box-shadow:var(--mer-elevation__box-shadow--01);box-shadow:none;display:inline-flex;align-items:center;padding:var(--gxg-buttons-group__padding);box-sizing:border-box;gap:var(--gxg-buttons-group__gap);border-radius:var(--gxg-buttons-group__border-radius);border:1px solid var(--mer-color__elevation__03)}:host .container--reduced{height:calc(var(--gxg-form-text-height) + 2px);--gxg-button-height:100%}:host .container--reduced ::slotted(gxg-button){height:100%}:host ::slotted(.button--unselected){--gxg-button-primary-border-color:transparent;--gxg-button-primary-bg-color:var(\n    --gxg-button-unselected-bg-color--enabled\n  );--gxg-button-primary-color:var(--gxg-button-unselected-color--enabled)}";
+const buttonsContainerCss = ":host{--ds-background-color-disabled:transparent;--ds-border-color-disabled:transparent;display:block}:host .container{background-color:var(--mer-elevation__background-color--01);border:var(--mer-elevation__border-01);box-shadow:var(--mer-elevation__box-shadow--01);box-shadow:none;display:inline-flex;align-items:center;padding:var(--gxg-buttons-group__padding);box-sizing:border-box;gap:var(--gxg-buttons-group__gap);border-radius:var(--gxg-buttons-group__border-radius);border:1px solid var(--mer-color__elevation__03)}:host .container--reduced{height:calc(var(--gxg-form-text-height) + 2px);--gxg-button-height:100%}:host .container--reduced ::slotted(gxg-button){height:100%}:host ::slotted(.button--unselected){--gxg-button-primary-border-color:transparent;--gxg-button-primary-bg-color:var(\n    --gxg-button-unselected-bg-color--enabled\n  );--gxg-button-primary-color:var(--gxg-button-unselected-color--enabled)}:host([full-width]){width:100%}:host([full-width]) .container{width:100%;display:flex}:host([full-width]) ::slotted(gxg-button){flex:1}";
 
 const GxgButtonsContainer = /*@__PURE__*/ proxyCustomElement(class GxgButtonsContainer extends HTMLElement {
     constructor() {
@@ -45,6 +45,7 @@ const GxgButtonsContainer = /*@__PURE__*/ proxyCustomElement(class GxgButtonsCon
         this.selectedButtonChanged = createEvent(this, "selectedButtonChanged", 7);
         this.selectedButtonId = undefined;
         this.reduced = false;
+        this.fullWidth = false;
     }
     get el() { return this; }
     // 6.COMPONENT LIFECYCLE METHODS //
@@ -53,12 +54,16 @@ const GxgButtonsContainer = /*@__PURE__*/ proxyCustomElement(class GxgButtonsCon
     }
     // 10.RENDER() FUNCTION //
     render() {
-        return (h(Host, null, h("div", { class: { container: true, "container--reduced": this.reduced }, ref: el => (this.containerEl = el), onClick: this.setSelectedButton }, h("slot", null))));
+        return (h(Host, null, h("div", { class: {
+                container: true,
+                "container--reduced": this.reduced
+            }, ref: el => (this.containerEl = el), onClick: this.setSelectedButton }, h("slot", null))));
     }
     static get style() { return buttonsContainerCss; }
 }, [1, "gxg-buttons-container", {
         "selectedButtonId": [1, "selected-button-id"],
-        "reduced": [4]
+        "reduced": [4],
+        "fullWidth": [516, "full-width"]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/components/buttons-container.js.map

@@ -1 +1 @@
-{"file":"buttons-container.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,25BAA25B;;MCC16B,mBAAmB;IAC5B;;;;QAkBA,sBAAiB,GAAG,CAAC,KAAK;YACtB,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;YACrC,IAAI,OAAO,KAAK,YAAY,EAAE;;gBAE1B,OAAO;aACV;iBACI;gBACD,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC;gBACnC,IAAI,aAAa,CAAC,QAAQ,IAAI,aAAa,CAAC,QAAQ,EAAE;;oBAElD,OAAO;iBACV;gBACD,MAAM,wBAAwB,GAAG,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC;gBAClD,KAAK,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC,OAAO,CAAC,UAAU,MAAM;oBACzD,IAAI,MAAM,CAAC,QAAQ,EAAE;wBACjB,MAAM,CAAC,QAAQ,GAAG,KAAK,CAAC;qBAC3B;iBACJ,CAAC,CAAC;gBACH,aAAa,CAAC,QAAQ,GAAG,IAAI,CAAC;gBAC9B,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;gBAClD,IAAI,CAAC,sBAAsB,EAAE,CAAC;aACjC;SACJ,CAAC;QACF,2BAAsB,GAAG;YACrB,MAAM,wBAAwB,GAAG,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC;YAClD,MAAM,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM;gBACpE,OAAO,MAAM,CAAC,QAAQ,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC;aAC9C,CAAC,CAAC;YACH,IAAI,cAAc,EAAE;gBAChB,IAAI,CAAC,gBAAgB,GAAG,cAAc,CAAC,EAAE,CAAC;aAC7C;SACJ,CAAC;;;;;QAhDE,IAAI,CAAC,gBAAgB,GAAG,SAAS,CAAC;QAClC,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;KACxB;;;IASD,gBAAgB;QACZ,IAAI,CAAC,sBAAsB,EAAE,CAAC;KACjC;;IAqCD,MAAM;QACF,QAAQ,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,oBAAoB,EAAE,IAAI,CAAC,OAAO,EAAE,EAAE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE;KAC9L;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["node_modules/@genexus/gemini/dist/collection/components/buttons-container/buttons-container.css?tag=gxg-buttons-container&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/buttons-container/buttons-container.js"],"sourcesContent":["/*--- Elevation ---*/\n:host {\n  --ds-background-color-disabled: transparent;\n  --ds-border-color-disabled: transparent;\n  display: block;\n}\n:host .container {\n  background-color: var(--mer-elevation__background-color--01);\n  border: var(--mer-elevation__border-01);\n  box-shadow: var(--mer-elevation__box-shadow--01);\n  box-shadow: none;\n  display: inline-flex;\n  align-items: center;\n  padding: var(--gxg-buttons-group__padding);\n  box-sizing: border-box;\n  gap: var(--gxg-buttons-group__gap);\n  border-radius: var(--gxg-buttons-group__border-radius);\n  border: 1px solid var(--mer-color__elevation__03);\n}\n:host .container--reduced {\n  height: calc(var(--gxg-form-text-height) + 2px);\n  --gxg-button-height: 100%;\n}\n:host .container--reduced ::slotted(gxg-button) {\n  height: 100%;\n}\n:host ::slotted(.button--unselected) {\n  --gxg-button-primary-border-color: transparent;\n  --gxg-button-primary-bg-color: var(\n    --gxg-button-unselected-bg-color--enabled\n  );\n  --gxg-button-primary-color: var(--gxg-button-unselected-color--enabled);\n}","import { Host, h } from \"@stencil/core\";\nexport class GxgButtonsContainer {\n    constructor() {\n        this.selectedButtonId = undefined;\n        this.reduced = false;\n    }\n    el;\n    containerEl;\n    // 2. REFERENCE TO ELEMENTS //\n    // 3.STATE() VARIABLES //\n    // 4.PUBLIC PROPERTY API | WATCH'S //\n    // 5.EVENTS (EMIT) //\n    selectedButtonChanged;\n    // 6.COMPONENT LIFECYCLE METHODS //\n    componentDidLoad() {\n        this.updateSelectedButtonId();\n    }\n    // 7.LISTENERS //\n    // 8.PUBLIC METHODS API //\n    // 9.LOCAL METHODS //\n    setSelectedButton = (event) => {\n        const tagName = event.target.tagName;\n        if (tagName !== \"GXG-BUTTON\") {\n            //clicked button is disabled\n            return;\n        }\n        else {\n            const clickedButton = event.target;\n            if (clickedButton.disabled || clickedButton.selected) {\n                //button is disabled or is the current selected\n                return;\n            }\n            const gxgButtonsHtmlCollection = this.el.children;\n            Array.from(gxgButtonsHtmlCollection).forEach(function (button) {\n                if (button.selected) {\n                    button.selected = false;\n                }\n            });\n            clickedButton.selected = true;\n            this.selectedButtonChanged.emit(clickedButton.id);\n            this.updateSelectedButtonId();\n        }\n    };\n    updateSelectedButtonId = () => {\n        const gxgButtonsHtmlCollection = this.el.children;\n        const selectedButton = Array.from(gxgButtonsHtmlCollection).find((button) => {\n            return button.selected && !button.disabled;\n        });\n        if (selectedButton) {\n            this.selectedButtonId = selectedButton.id;\n        }\n    };\n    // 10.RENDER() FUNCTION //\n    render() {\n        return (h(Host, null, h(\"div\", { class: { container: true, \"container--reduced\": this.reduced }, ref: el => (this.containerEl = el), onClick: this.setSelectedButton }, h(\"slot\", null))));\n    }\n    static get is() { return \"gxg-buttons-container\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"buttons-container.scss\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"buttons-container.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"selectedButtonId\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The id of the currently selected button, or null if all are disabled\"\n                },\n                \"attribute\": \"selected-button-id\",\n                \"reflect\": false\n            },\n            \"reduced\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Used to reduce the height when the button-container is next to a form-text\"\n                },\n                \"attribute\": \"reduced\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            }\n        };\n    }\n    static get events() {\n        return [{\n                \"method\": \"selectedButtonChanged\",\n                \"name\": \"selectedButtonChanged\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                }\n            }];\n    }\n    static get elementRef() { return \"el\"; }\n}\n//# sourceMappingURL=buttons-container.js.map\n"],"version":3}
+{"file":"buttons-container.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,kiCAAkiC;;MCCjjC,mBAAmB;IAC5B;;;;QAmBA,sBAAiB,GAAG,CAAC,KAAK;YACtB,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;YACrC,IAAI,OAAO,KAAK,YAAY,EAAE;;gBAE1B,OAAO;aACV;iBACI;gBACD,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC;gBACnC,IAAI,aAAa,CAAC,QAAQ,IAAI,aAAa,CAAC,QAAQ,EAAE;;oBAElD,OAAO;iBACV;gBACD,MAAM,wBAAwB,GAAG,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC;gBAClD,KAAK,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC,OAAO,CAAC,UAAU,MAAM;oBACzD,IAAI,MAAM,CAAC,QAAQ,EAAE;wBACjB,MAAM,CAAC,QAAQ,GAAG,KAAK,CAAC;qBAC3B;iBACJ,CAAC,CAAC;gBACH,aAAa,CAAC,QAAQ,GAAG,IAAI,CAAC;gBAC9B,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;gBAClD,IAAI,CAAC,sBAAsB,EAAE,CAAC;aACjC;SACJ,CAAC;QACF,2BAAsB,GAAG;YACrB,MAAM,wBAAwB,GAAG,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC;YAClD,MAAM,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM;gBACpE,OAAO,MAAM,CAAC,QAAQ,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC;aAC9C,CAAC,CAAC;YACH,IAAI,cAAc,EAAE;gBAChB,IAAI,CAAC,gBAAgB,GAAG,cAAc,CAAC,EAAE,CAAC;aAC7C;SACJ,CAAC;;;;;QAjDE,IAAI,CAAC,gBAAgB,GAAG,SAAS,CAAC;QAClC,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;KAC1B;;;IASD,gBAAgB;QACZ,IAAI,CAAC,sBAAsB,EAAE,CAAC;KACjC;;IAqCD,MAAM;QACF,QAAQ,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE;gBAChC,SAAS,EAAE,IAAI;gBACf,oBAAoB,EAAE,IAAI,CAAC,OAAO;aACrC,EAAE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE;KACpG;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["node_modules/@genexus/gemini/dist/collection/components/buttons-container/buttons-container.css?tag=gxg-buttons-container&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/buttons-container/buttons-container.js"],"sourcesContent":["/*--- Elevation ---*/\n:host {\n  --ds-background-color-disabled: transparent;\n  --ds-border-color-disabled: transparent;\n  display: block;\n}\n:host .container {\n  background-color: var(--mer-elevation__background-color--01);\n  border: var(--mer-elevation__border-01);\n  box-shadow: var(--mer-elevation__box-shadow--01);\n  box-shadow: none;\n  display: inline-flex;\n  align-items: center;\n  padding: var(--gxg-buttons-group__padding);\n  box-sizing: border-box;\n  gap: var(--gxg-buttons-group__gap);\n  border-radius: var(--gxg-buttons-group__border-radius);\n  border: 1px solid var(--mer-color__elevation__03);\n}\n:host .container--reduced {\n  height: calc(var(--gxg-form-text-height) + 2px);\n  --gxg-button-height: 100%;\n}\n:host .container--reduced ::slotted(gxg-button) {\n  height: 100%;\n}\n:host ::slotted(.button--unselected) {\n  --gxg-button-primary-border-color: transparent;\n  --gxg-button-primary-bg-color: var(\n    --gxg-button-unselected-bg-color--enabled\n  );\n  --gxg-button-primary-color: var(--gxg-button-unselected-color--enabled);\n}\n\n:host([full-width]) {\n  width: 100%;\n}\n:host([full-width]) .container {\n  width: 100%;\n  display: flex;\n}\n:host([full-width]) ::slotted(gxg-button) {\n  flex: 1;\n}","import { Host, h } from \"@stencil/core\";\nexport class GxgButtonsContainer {\n    constructor() {\n        this.selectedButtonId = undefined;\n        this.reduced = false;\n        this.fullWidth = false;\n    }\n    el;\n    containerEl;\n    // 2. REFERENCE TO ELEMENTS //\n    // 3.STATE() VARIABLES //\n    // 4.PUBLIC PROPERTY API | WATCH'S //\n    // 5.EVENTS (EMIT) //\n    selectedButtonChanged;\n    // 6.COMPONENT LIFECYCLE METHODS //\n    componentDidLoad() {\n        this.updateSelectedButtonId();\n    }\n    // 7.LISTENERS //\n    // 8.PUBLIC METHODS API //\n    // 9.LOCAL METHODS //\n    setSelectedButton = (event) => {\n        const tagName = event.target.tagName;\n        if (tagName !== \"GXG-BUTTON\") {\n            //clicked button is disabled\n            return;\n        }\n        else {\n            const clickedButton = event.target;\n            if (clickedButton.disabled || clickedButton.selected) {\n                //button is disabled or is the current selected\n                return;\n            }\n            const gxgButtonsHtmlCollection = this.el.children;\n            Array.from(gxgButtonsHtmlCollection).forEach(function (button) {\n                if (button.selected) {\n                    button.selected = false;\n                }\n            });\n            clickedButton.selected = true;\n            this.selectedButtonChanged.emit(clickedButton.id);\n            this.updateSelectedButtonId();\n        }\n    };\n    updateSelectedButtonId = () => {\n        const gxgButtonsHtmlCollection = this.el.children;\n        const selectedButton = Array.from(gxgButtonsHtmlCollection).find((button) => {\n            return button.selected && !button.disabled;\n        });\n        if (selectedButton) {\n            this.selectedButtonId = selectedButton.id;\n        }\n    };\n    // 10.RENDER() FUNCTION //\n    render() {\n        return (h(Host, null, h(\"div\", { class: {\n                container: true,\n                \"container--reduced\": this.reduced\n            }, ref: el => (this.containerEl = el), onClick: this.setSelectedButton }, h(\"slot\", null))));\n    }\n    static get is() { return \"gxg-buttons-container\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"buttons-container.scss\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"buttons-container.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"selectedButtonId\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The id of the currently selected button, or null if all are disabled\"\n                },\n                \"attribute\": \"selected-button-id\",\n                \"reflect\": false\n            },\n            \"reduced\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Used to reduce the height when the button-container is next to a form-text\"\n                },\n                \"attribute\": \"reduced\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"fullWidth\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Makes the buttons-container full-width\"\n                },\n                \"attribute\": \"full-width\",\n                \"reflect\": true,\n                \"defaultValue\": \"false\"\n            }\n        };\n    }\n    static get events() {\n        return [{\n                \"method\": \"selectedButtonChanged\",\n                \"name\": \"selectedButtonChanged\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                }\n            }];\n    }\n    static get elementRef() { return \"el\"; }\n}\n//# sourceMappingURL=buttons-container.js.map\n"],"version":3}