@genexus/genexus-ide-ui 0.0.124 → 0.0.126

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

@@ -1 +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  versions?: ModuleVersionData[];\n  currentVersion?: string | undefined;\n};\n\nexport type ModuleActionType =\n  | \"install\"\n  | \"restore\"\n  | \"update\"\n  | \"not-installable\"\n  | \"incompatible\";\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  name: string;\n  description?: string;\n  action: ModuleActionType;\n  properties?: ModulePropertyData[];\n  alertMessage?: string;\n};\n\nexport type EditServerModuleResult = {\n  success: boolean;\n  message: string;\n};\n"]}
+{"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  versions?: ModuleVersionData[];\n  currentVersion?: string | undefined;\n};\n\nexport type ModuleActionType =\n  | \"install\"\n  | \"restore\"\n  | \"update\"\n  | \"not-installable\"\n  | \"incompatible\";\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  name: string;\n  description?: string;\n  action: ModuleActionType;\n  properties?: ModulePropertyData[];\n  warningMessage?: string;\n};\n\nexport type ExtendedModuleData = ModuleData & {\n  selectedVersion: ModuleVersionData;\n};\n\nexport type EditServerModuleResult = {\n  success: boolean;\n  message: string;\n};\n"]}

package/dist/components/gx-ide-manage-module-references-v2.d.ts

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

package/dist/components/gx-ide-manage-module-references-v2.js

@@ -0,0 +1,510 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { a as renderModuleDataProperties } from './common.js';
+import { L as Locale } from './locale.js';
+import { d as defineCustomElement$t } from './ch-grid2.js';
+import { d as defineCustomElement$s } from './ch-grid-column2.js';
+import { d as defineCustomElement$r } from './ch-grid-column-resize2.js';
+import { d as defineCustomElement$q } from './ch-grid-column-settings2.js';
+import { d as defineCustomElement$p } from './ch-grid-columnset2.js';
+import { d as defineCustomElement$o } from './ch-grid-settings2.js';
+import { d as defineCustomElement$n } from './ch-grid-settings-columns2.js';
+import { d as defineCustomElement$m } from './icon.js';
+import { d as defineCustomElement$l } from './ch-window2.js';
+import { d as defineCustomElement$k } from './ch-window-close2.js';
+import { d as defineCustomElement$j } from './container.js';
+import { d as defineCustomElement$i } from './gx-ide-empty-state2.js';
+import { d as defineCustomElement$h } from './title2.js';
+import { d as defineCustomElement$g } from './button.js';
+import { d as defineCustomElement$f } from './buttons-container.js';
+import { d as defineCustomElement$e } from './combo-box.js';
+import { d as defineCustomElement$d } from './combo-box-item.js';
+import { d as defineCustomElement$c } from './form-checkbox.js';
+import { d as defineCustomElement$b } from './form-radio.js';
+import { d as defineCustomElement$a } from './form-text.js';
+import { d as defineCustomElement$9 } from './gxg-grid2.js';
+import { d as defineCustomElement$8 } from './icon2.js';
+import { d as defineCustomElement$7 } from './ide-loader.js';
+import { d as defineCustomElement$6 } from './gxg-label2.js';
+import { d as defineCustomElement$5 } from './text.js';
+import { d as defineCustomElement$4 } from './title.js';
+import { d as defineCustomElement$3 } from './tooltip.js';
+import { d as defineCustomElement$2 } from './gxg-top-state-bar2.js';
+
+const manageModuleReferencesCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}.justify-start{display:flex;justify-content:start}.justify-center{display:flex;justify-content:center}.justify-end{display:flex;justify-content:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--mer-color__neutral-gray--800)}ch-grid-column:first-child{padding-inline-start:var(--gx-ide-container__padding) !important}ch-grid-column:last-child{padding-inline-end:var(--gx-ide-container__padding) !important}ch-grid-cell{--mer-spacing--xs:var(--gx-ide-container__padding)}.layout{display:grid;gap:var(--mer-spacing--lg);box-sizing:border-box}.layout--two-cols{grid-template-columns:1fr 1fr}.layout--space-above{padding-block-start:var(--mer-spacing--lg)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--mer-font__weight--regular);font-size:var(--mer-font__size--xs);font-family:var(--mer-font-family--primary);height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-main::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-main::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-main::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-overflow::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.tree-container{display:flex;height:100%;width:100%;box-sizing:border-box}p{margin:0}p,ul{font-size:var(--font-size-lg);margin:0}p{line-height:1.6em}.header{align-items:center;grid-template-columns:1fr auto;grid-template-rows:1fr}.main{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr;height:100%;overflow:auto}ch-grid-columnset{display:none}ch-grid-row[selected] gxg-icon[data-action=install]{filter:brightness(2)}.grid-cell-module__info{display:flex;flex-direction:column;align-items:flex-start;gap:var(--mer-spacing--xxxs)}.grid-cell-module__name{font-weight:var(--mer-font__weight--bold);display:flex;align-items:center;gap:var(--mer-spacing--xs)}.grid-cell-module__name,.grid-cell-module__description{line-height:1.55em}.grid-cell-module__description{padding-inline-start:36px}.grid-container{height:100%;overflow:auto}.grid-container gx-ide-empty-state{height:100%}.servers-container{display:none;height:100%}.servers-container__header{display:flex;align-items:center;justify-content:space-between;padding:var(--gxg-list-box-main__padding) var(--gxg-list-box-main__padding) 0 var(--gxg-list-box-main__padding)}.servers-container__header gxg-button{width:100%}.modules__header{padding:var(--gxg-list-box-main__padding);display:flex;flex-direction:column;gap:var(--mer-spacing--xs)}.modules__combo-container{display:flex;flex-direction:column;gap:var(--mer-spacing--xs)}.modules__server-commands{display:flex;gap:var(--mer-spacing--xs)}.modules__combo{display:flex;flex-direction:row;gap:var(--mer-spacing--xs)}.modules__combo gxg-combo-box{flex:1}.modules__container{border-inline-end:var(--mer-border__width--sm) solid var(--gx-ide-container-border-color);display:grid;grid-template-rows:auto 1fr;height:100%;overflow:auto}.modules__main{display:grid;grid-template-rows:auto 1fr;height:100%;overflow:auto}.modules__main-header{display:flex;padding:var(--mer-spacing--xs);flex-direction:column;gap:var(--mer-spacing--xs)}.module-info{display:grid;grid-template-rows:auto 1fr;height:100%;overflow:auto}.module-info__title{display:flex;align-items:center;gap:var(--mer-spacing--xs)}.module-info__name{display:flex;align-items:center;gap:var(--mer-spacing--sm);--ds-icon-size-box--regular:24px;--ds-icon-size--regular:24px;font-weight:var(--mer-font__weight--bold)}.module-info__header{padding:var(--gx-ide-container__padding);display:flex;flex-direction:column;gap:var(--mer-spacing--xs);border-block-end:var(--mer-border__width--sm) solid var(--gx-ide-container-border-color)}.module-info__action-container{display:flex;flex-direction:row;align-items:center;gap:var(--mer-spacing--xs)}.module-info__action-container:before{content:\"\";width:var(--mer-spacing--xs);height:var(--mer-spacing--xs);border-radius:50%;display:block;background-color:var(--mer-icon__primary--disabled)}.module-info__action-container--installed:before{background-color:var(--mer-icon__primary)}.module-info__action-container--uninstallable:before{background-color:var(--mer-icon__warning)}.module-info__warning-message{margin-block-start:var(--mer-spacing--xxs);background-color:var(--mer-color__tinted-yellow--5);color:var(--mer-text__on-elevation);border:var(--mer-border__width--sm) solid var(--mer-border-color__warning);border-radius:var(--mer-border__radius--sm);padding:var(--mer-spacing--xs) var(--mer-spacing--md)}.module-info__divider{width:calc(100% - var(--gx-ide-container__padding) * 4);padding:0 var(--gx-ide-container__padding);margin:0 auto;border:0;border-block-end:var(--mer-border__width--sm) solid var(--gx-ide-container-border-color)}.module-info__properties{display:flex;flex-direction:column;padding:var(--gx-ide-container__padding);gap:var(--mer-spacing--xs);overflow:auto}.md-property{display:grid;gap:var(--mer-spacing--xs)}.md-property--inline{grid-template-columns:auto 1fr}.md-property__key{font-weight:var(--font-weight-bold);max-width:150px}.md-property__value{font-size:var(--mer-font__size--xxs)}.md-property__key>*,.md-property__value>*{display:inline-block}.md-property__list{display:flex;flex-direction:column;gap:var(--mer-spacing--xs)}.md-property__list>ul{margin:0;padding:0;list-style-type:none;display:flex;flex-direction:column;gap:var(--mer-spacing--xxs);margin-inline-start:var(--mer-spacing--xs)}.md-property__list>ul li{position:relative;padding-inline-start:12px;line-height:var(--ds-base-font-line-height--comfortable)}.md-property__list>ul li::before{content:\"\";position:absolute;left:0;top:7px;display:inline-block;width:var(--mer-spacing--xxs);height:var(--mer-spacing--xxs);background-color:var(--mer-text__on-surface)}.md-property,.md-property__list{border-block-end:var(--mer-border__width--sm) solid var(--gx-ide-container-border-color);padding-block-end:var(--mer-spacing--xs)}.md-property:last-child,.md-property__list:last-child{border-block-end:0;padding-block-end:0}gxg-ide-loader{border-radius:var(--mer-border__radius--md)}";
+
+const GxManageModuleReferencesV2 = /*@__PURE__*/ proxyCustomElement(class GxManageModuleReferencesV2 extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.componentDidRenderFirstTime = createEvent(this, "componentDidRenderFirstTime", 7);
+        this.renderedFirstTime = false;
+        // 7.LISTENERS //
+        // 8.PUBLIC METHODS API //
+        // 9.LOCAL METHODS //
+        /**
+         * 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;
+        };
+        /**
+         * Used for changing the selected module
+         */
+        this.handleModuleChange = (event) => {
+            const selectedModuleId = event.detail.rowsId[0];
+            this.selectedModule = this.modulesMap.get(selectedModuleId);
+        };
+        this.moduleActionHandler = (module) => () => {
+            this.actionCompleted = false;
+            this.closeProgressBar = false;
+            this.executeActionCallbackHandler(module);
+        };
+        /**
+         * Perform an action relative to a module using callbackExecuteAction callback and receive the state of that action with onProgress callback
+         */
+        this.executeActionCallbackHandler = async (module) => {
+            if (this.executeActionCallback) {
+                this.actionCompleted = false;
+                const moduleSelectedVersionId = this.modulesMap.get(module.id)
+                    .selectedVersion.id;
+                const moduleSelectedVersionAction = this.modulesMap.get(module.id)
+                    .selectedVersion.action;
+                const actionCompleted = await this.executeActionCallback(this.selectedServerId, module.id, moduleSelectedVersionId, moduleSelectedVersionAction, this.onProgress);
+                if (actionCompleted) {
+                    this.serverSelectedCallbackHandler(this.selectedServerId, false);
+                }
+                this.actionCompleted = true;
+            }
+        };
+        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.searchModulesFilterHandler = (e) => {
+            this.searchModulesFilterValue = e.detail.trim().toLowerCase();
+        };
+        this.getFilteredServerModules = () => {
+            return this.serverModulesExtended.filter(module => {
+                // Filter conditions
+                const nameMatch = module.selectedVersion.name
+                    .toLowerCase()
+                    .includes(this.searchModulesFilterValue);
+                const descriptionMatch = module.selectedVersion.description
+                    .toLowerCase()
+                    .includes(this.searchModulesFilterValue);
+                let actionMatch;
+                if (this.selectedButtonFilter === "browse") {
+                    // If browse is selected, display all
+                    actionMatch = true;
+                }
+                else if (this.selectedButtonFilter === "installed") {
+                    actionMatch = !!(module.selectedVersion.action === "update" ||
+                        module.selectedVersion.action === "restore");
+                }
+                else if (this.selectedButtonFilter === "updates") {
+                    actionMatch = !!(module.selectedVersion.action === "update");
+                }
+                const filtered = (nameMatch || descriptionMatch) && actionMatch;
+                return filtered;
+            });
+        };
+        // 9.LOCAL METHODS > RENDERS //
+        this.renderGridOrEmptyState = () => {
+            this.filteredServerModules = this.getFilteredServerModules();
+            if (this.filteredServerModules.length > 0) {
+                return this.renderModulesVersionsGrid();
+            }
+            else {
+                return this.renderEmptyStateModules();
+            }
+        };
+        this.renderModulesVersionsGrid = () => {
+            return (h("gxg-grid", { noBorder: true, fullHeight: true }, h("ch-grid", { rowSelectionMode: "single", part: "ch-grid-pending-commits", class: "servers-detail no-border", onSelectionChanged: this.handleModuleChange }, h("ch-grid-columnset", null, h("ch-grid-column", { settingable: false }), h("ch-grid-column", { settingable: false, size: "min-content" })), this.filteredServerModules.map((module) => (h("ch-grid-row", { rowid: module.id, key: module.id, selected: this.selectedModule && this.selectedModule.id === module.id }, h("ch-grid-cell", { class: "grid-cell-module__info" }, h("span", { class: "grid-cell-module__name" }, h("gxg-icon", { type: "objects/module", "data-action": module.selectedVersion.action, color: this.moduleVersionIconColor(module.id), size: "small" }), module.selectedVersion.name), h("span", { class: "grid-cell-module__description" }, module.selectedVersion.description)), h("ch-grid-cell", null, this.selectedModule && this.selectedModule.id === module.id ? (h("gxg-button", { disabled: !this.actionCompleted ||
+                    module.selectedVersion.action === "incompatible" ||
+                    module.selectedVersion.action === "not-installable", fit: true, part: "module-action", onClick: this.moduleActionHandler(module) }, module.selectedVersion.action)) : null)))))));
+        };
+        this.renderEmptyStateModules = () => {
+            return (h("gx-ide-empty-state", { stateIcon: "mercury/filters", stateTitle: this._componentLocale.modules.noModulesFilter }));
+        };
+        this.moduleVersionIconColor = (moduleId) => {
+            const foundModule = this.serverModulesExtended.find(module => {
+                return module.id === moduleId;
+            });
+            if (foundModule) {
+                const moduleAction = foundModule.selectedVersion.action;
+                const moduleCurrentVersion = foundModule.currentVersion;
+                if (moduleAction === "not-installable" ||
+                    moduleAction === "incompatible") {
+                    return "warning";
+                }
+                else if (!moduleCurrentVersion) {
+                    return "mercury-primary-disabled";
+                }
+                else {
+                    return "mercury-primary";
+                }
+            }
+            return "mercury-primary";
+        };
+        this.renderVersionIcon = () => {
+            return (h("gxg-icon", { type: "objects/module", color: this.moduleVersionIconColor(this.selectedModule.id) }));
+        };
+        /* module details/information renders*/
+        this.renderVersionName = () => {
+            return (h("gxg-title", { part: "module-info__name", type: "title-05" }, h("div", { class: "module-info__name" }, this.selectedModule.selectedVersion.name)));
+        };
+        this.renderVersionWarningMessage = () => {
+            const warningMessage = this.selectedModule.selectedVersion.warningMessage;
+            if (warningMessage) {
+                return h("p", { class: "module-info__warning-message" }, warningMessage);
+            }
+        };
+        this.renderInstalledVersion = () => {
+            const currentVersion = this.selectedModule.currentVersion;
+            let caption;
+            let cssClass = "module-info__action-container";
+            if (currentVersion) {
+                caption = `${this._componentLocale.modulesInformation.moduleProperties.installed}: ${currentVersion}`;
+                cssClass += ` module-info__action-container--installed`;
+            }
+            else {
+                caption =
+                    this._componentLocale.modulesInformation.moduleProperties.notInstalled;
+            }
+            return (h("div", { class: cssClass }, h("gxg-text", { part: "module-info__action" }, caption)));
+        };
+        // Update selected version
+        this.moduleVersionsValueChangedHandler = (e) => {
+            const selectedVersionId = e.detail.value;
+            this.updateSelectedModuleVersion(selectedVersionId);
+        };
+        this.moduleVersionsItemChangedHandler = (e) => {
+            const selectedVersionId = e.detail.value;
+            this.updateSelectedModuleVersion(selectedVersionId);
+        };
+        this.updateSelectedModuleVersion = (selectedVersionId) => {
+            const moduleSelectedVersion = this.selectedModule.versions.find(version => {
+                return version.id === selectedVersionId;
+            });
+            if (moduleSelectedVersion) {
+                const updatedSelectedModule = Object.assign(Object.assign({}, this.selectedModule), { selectedVersion: moduleSelectedVersion });
+                this.selectedModule = updatedSelectedModule;
+                // update module selected in modules array as well
+                const updatedModuleIndex = this.serverModulesExtended.findIndex(module => module.id === updatedSelectedModule.id);
+                if (updatedModuleIndex !== -1) {
+                    // Update the object with new information
+                    this.serverModulesExtended[updatedModuleIndex] = Object.assign(Object.assign({}, this.serverModulesExtended[updatedModuleIndex]), updatedSelectedModule);
+                }
+            }
+        };
+        this.renderModuleVersions = () => {
+            return (h("div", { part: "available-versions" }, h("gxg-combo-box", { id: "versions-combo-box", "disable-filter": true, value: "", part: "module-versions", "display-validation-styles": true, "display-validation-message": true, label: this._componentLocale.modulesInformation.moduleProperties
+                    .availableVersions, labelPosition: "start", centerLabel: true, onValueChanged: this.moduleVersionsValueChangedHandler, disabled: this.loadingServer || !this.actionCompleted }, this.selectedModule.versions.map(item => (h("gxg-combo-box-item", { value: item.id, onItemSelected: this.moduleVersionsItemChangedHandler }, item.id))))));
+        };
+        this.selectedButtonChangedHandler = (e) => {
+            this.selectedButtonFilter = e.detail;
+        };
+        // Update server selected
+        this.serverItemSelectedHandler = (e) => {
+            const serverId = e.detail.value;
+            this.serverSelectedCallbackHandler(serverId, false);
+        };
+        this.serverValueChangedHandler = (e) => {
+            const serverId = e.detail;
+            this.serverSelectedCallbackHandler(serverId, false);
+        };
+        this.reloadServer = () => {
+            this.serverSelectedCallbackHandler(this.selectedServerId, true);
+        };
+        /**
+         * Change the server selected value in response to callbackServerSelected callback
+         */
+        this.serverSelectedCallbackHandler = async (serverId, reload) => {
+            if (this.serverSelectedCallback) {
+                this.loadingServer = true;
+                // clear
+                this.serverModules = [];
+                this.serverModulesExtended = [];
+                this.filteredServerModules = [];
+                this.modulesMap.clear();
+                this.modulesSelectedVersionMap.clear();
+                this.serverModules = await this.serverSelectedCallback(serverId, reload);
+                // Save modules on Map as well to get information about modules faster
+                this.serverModules.forEach(module => {
+                    const extendedModuleData = Object.assign(Object.assign({}, module), { selectedVersion: module.versions[0] });
+                    // When the server retrieves the modules, the selected module is by default the first one.
+                    this.serverModulesExtended.push(extendedModuleData);
+                    // Save modules on a map as well, for faster retrieval.
+                    this.modulesMap.set(module.id, extendedModuleData);
+                });
+                this.selectedServerId = serverId;
+                this.loadingServer = false;
+            }
+        };
+        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.searchModulesFilterValue = "";
+        this.selectedButtonFilter = "browse";
+        this.serverModules = [];
+        this.serverModulesExtended = [];
+        this.filteredServerModules = [];
+        this.modulesMap = new Map();
+        this.selectedModule = undefined;
+        this.selectedServerId = undefined;
+        this.selectedModuleAction = {
+            message: "",
+            progress: 0,
+            state: "in-progress"
+        };
+        this.modulesSelectedVersionMap = new Map();
+        this.actionCompleted = true;
+        this.closeProgressBar = true;
+        this.progressValue = 0;
+        this.progressState = "in-progress";
+        this.loadingServer = false;
+        this.displayTitle = false;
+        this.servers = [];
+        this.serverSelectedCallback = undefined;
+        this.executeActionCallback = undefined;
+        this.serverContextMenuCallback = undefined;
+        this.showServerCommands = false;
+    }
+    loadingServerHandler(loading) {
+        if (loading) {
+            this.loaderEl.show = true;
+        }
+        else {
+            this.loaderEl.show = false;
+        }
+    }
+    // 6.COMPONENT LIFECYCLE EVENTS //
+    componentDidRender() {
+        if (!this.renderedFirstTime) {
+            this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
+            this.renderedFirstTime = true;
+        }
+    }
+    async componentWillLoad() {
+        this._componentLocale = await Locale.getComponentStrings(this.el);
+    }
+    async componentDidLoad() {
+        await this.serverSelectedCallbackHandler(this.servers[0].id, false);
+    }
+    // 11.RENDER() FUNCTION //
+    render() {
+        return (h(Host, { class: {
+                "gx-ide-component": true
+            } }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { noContentPadding: true, noAboveFooterPadding: true, noBorderAboveFooter: this.closeProgressBar, part: "servers", containerTitle: this.displayTitle ? this._componentLocale.componentName : null }, 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", { disabled: this.loadingServer || !this.actionCompleted, disableFilter: true, onValueChanged: this.serverValueChangedHandler }, this.servers.map(item => (h("gxg-combo-box-item", { value: item.id, onItemSelected: this.serverItemSelectedHandler }, item.name)))), this.showServerCommands ? (h("span", { class: "modules__server-commands" }, h("gxg-button", { type: "secondary-icon-only", icon: "gemini-tools/show-more-horizontal", onClick: this.showModuleMenu }))) : null, h("gxg-button", { type: "secondary-icon-only", icon: "gemini-tools/reset", onClick: this.reloadServer })))), h("div", { class: "modules__main" }, h("div", { class: "modules__main-header" }, h("gxg-form-text", { label: this._componentLocale.modules.searchModules, labelPosition: "above", centerLabel: false, onValueChanged: this.searchModulesFilterHandler, disabled: this.loadingServer || !this.actionCompleted }), h("gxg-buttons-container", { reduced: true, fullWidth: true, class: "modules__browser", onSelectedButtonChanged: this.selectedButtonChangedHandler }, h("gxg-button", { id: "browse", selected: true, disabled: this.loadingServer || !this.actionCompleted }, this._componentLocale.modules.buttonsContainer.browse), h("gxg-button", { id: "installed", disabled: this.loadingServer || !this.actionCompleted }, this._componentLocale.modules.buttonsContainer
+            .installed), h("gxg-button", { id: "updates", disabled: this.loadingServer || !this.actionCompleted }, this._componentLocale.modules.buttonsContainer.updates))), h("div", { class: "grid-container", ref: el => (this.serversDetail = el) }, this.renderGridOrEmptyState()))), this.selectedModule ? (h("div", { class: "module-info" }, h("header", { class: "module-info__header" }, h("div", { class: "module-info__title" }, this.renderVersionIcon(), this.renderVersionName()), this.renderInstalledVersion(), this.renderModuleVersions(), this.renderVersionWarningMessage()), h("div", { class: "module-info__properties gxg-scrollbar" }, renderModuleDataProperties(this.selectedModule.selectedVersion.properties)))) : (h("gx-ide-empty-state", { class: "recent-objects__empty-state", stateIcon: "objects/module", stateTitle: this._componentLocale.modulesInformation.emptyState.title, stateDescription: this._componentLocale.modulesInformation.emptyState
+                .description }))), h("gxg-top-state-bar", { slot: "footer-above", part: "progress-bar", stateType: this.progressState, noBorder: true, caption: this.selectedModuleAction.message ||
+                this._componentLocale.progressBar.defaultCaption, progress: this.progressValue, active: !this.actionCompleted || !this.closeProgressBar, closeType: "not-progress", closedCallback: this.progressBarCloseHandler }))), h("gxg-ide-loader", { loaderTitle: this._componentLocale.servers.loading, ref: el => (this.loaderEl = el), container: this.serversDetail, borderRadius: "0 0 0 8px", abortTime: 60000 })));
+    }
+    static get assetsDirs() { return ["gx-ide-assets/manage-module-references-v2"]; }
+    get el() { return this; }
+    static get watchers() { return {
+        "loadingServer": ["loadingServerHandler"]
+    }; }
+    static get style() { return manageModuleReferencesCss; }
+}, [1, "gx-ide-manage-module-references-v2", {
+        "displayTitle": [4, "display-title"],
+        "servers": [16],
+        "serverSelectedCallback": [16],
+        "executeActionCallback": [16],
+        "serverContextMenuCallback": [16],
+        "showServerCommands": [4, "show-server-commands"],
+        "searchModulesFilterValue": [32],
+        "selectedButtonFilter": [32],
+        "serverModules": [32],
+        "serverModulesExtended": [32],
+        "filteredServerModules": [32],
+        "modulesMap": [32],
+        "selectedModule": [32],
+        "selectedServerId": [32],
+        "selectedModuleAction": [32],
+        "modulesSelectedVersionMap": [32],
+        "actionCompleted": [32],
+        "closeProgressBar": [32],
+        "progressValue": [32],
+        "progressState": [32],
+        "loadingServer": [32]
+    }, undefined, {
+        "loadingServer": ["loadingServerHandler"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["gx-ide-manage-module-references-v2", "ch-grid", "ch-grid-column", "ch-grid-column-resize", "ch-grid-column-settings", "ch-grid-columnset", "ch-grid-settings", "ch-grid-settings-columns", "ch-icon", "ch-window", "ch-window-close", "gx-ide-container", "gx-ide-empty-state", "gx-ide-title", "gxg-button", "gxg-buttons-container", "gxg-combo-box", "gxg-combo-box-item", "gxg-form-checkbox", "gxg-form-radio", "gxg-form-text", "gxg-grid", "gxg-icon", "gxg-ide-loader", "gxg-label", "gxg-text", "gxg-title", "gxg-tooltip", "gxg-top-state-bar"];
+    components.forEach(tagName => { switch (tagName) {
+        case "gx-ide-manage-module-references-v2":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, GxManageModuleReferencesV2);
+            }
+            break;
+        case "ch-grid":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$t();
+            }
+            break;
+        case "ch-grid-column":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$s();
+            }
+            break;
+        case "ch-grid-column-resize":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$r();
+            }
+            break;
+        case "ch-grid-column-settings":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$q();
+            }
+            break;
+        case "ch-grid-columnset":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$p();
+            }
+            break;
+        case "ch-grid-settings":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$o();
+            }
+            break;
+        case "ch-grid-settings-columns":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$n();
+            }
+            break;
+        case "ch-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$m();
+            }
+            break;
+        case "ch-window":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$l();
+            }
+            break;
+        case "ch-window-close":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$k();
+            }
+            break;
+        case "gx-ide-container":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$j();
+            }
+            break;
+        case "gx-ide-empty-state":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$i();
+            }
+            break;
+        case "gx-ide-title":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$h();
+            }
+            break;
+        case "gxg-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$g();
+            }
+            break;
+        case "gxg-buttons-container":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$f();
+            }
+            break;
+        case "gxg-combo-box":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$e();
+            }
+            break;
+        case "gxg-combo-box-item":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$d();
+            }
+            break;
+        case "gxg-form-checkbox":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$c();
+            }
+            break;
+        case "gxg-form-radio":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$b();
+            }
+            break;
+        case "gxg-form-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$a();
+            }
+            break;
+        case "gxg-grid":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "gxg-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "gxg-ide-loader":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "gxg-label":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "gxg-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "gxg-title":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "gxg-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "gxg-top-state-bar":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const GxIdeManageModuleReferencesV2 = GxManageModuleReferencesV2;
+const defineCustomElement = defineCustomElement$1;
+
+export { GxIdeManageModuleReferencesV2, defineCustomElement };
+
+//# sourceMappingURL=gx-ide-manage-module-references-v2.js.map