@genexus/genexus-ide-ui 0.0.61 → 0.0.62

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

@@ -3,20 +3,21 @@ import { L as Locale } from './locale.js';
 import { c as config } from './config.js';
 import { f as formSubmitValidation } from './form-validation.js';
 import { r as renderFormItems } from './common.js';
-import { d as defineCustomElement$d } from './icon.js';
-import { d as defineCustomElement$c } from './button.js';
-import { d as defineCustomElement$b } from './combo-box.js';
-import { d as defineCustomElement$a } from './combo-box-item.js';
-import { d as defineCustomElement$9 } from './container2.js';
+import { d as defineCustomElement$e } from './icon.js';
+import { d as defineCustomElement$d } from './container.js';
+import { d as defineCustomElement$c } from './title.js';
+import { d as defineCustomElement$b } from './button.js';
+import { d as defineCustomElement$a } from './combo-box.js';
+import { d as defineCustomElement$9 } from './combo-box-item.js';
 import { d as defineCustomElement$8 } from './form-checkbox.js';
 import { d as defineCustomElement$7 } from './form-radio.js';
 import { d as defineCustomElement$6 } from './form-text.js';
 import { d as defineCustomElement$5 } from './icon2.js';
 import { d as defineCustomElement$4 } from './gxg-label2.js';
-import { d as defineCustomElement$3 } from './title.js';
+import { d as defineCustomElement$3 } from './title2.js';
 import { d as defineCustomElement$2 } from './tooltip.js';
 
-const shareKbCss = ".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}.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(--gray-01)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){box-shadow:var(--box-shadow-01) !important;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(--font-weight-regular);font-size:var(--font-size-lg);line-height:1.6em;height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:6px;height:6px}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-main .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:6px;height:6px}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-overflow .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}:host{display:block}.main{grid-template-columns:auto 1fr;grid-template-areas:\"kb-label kb-input \" \"server-label server-input\" \"auth-type-input auth-type-input\" \"user-name-label user-name-input\" \"password-label password-input\"}.main .kb-input{grid-area:kb-input}.main .kb-name-label{grid-area:kb-label}.main .server-url-input{grid-area:server-input}.main .server-url-label{grid-area:server-label}.main .auth-type-input{grid-area:auth-type-input}.main .user-name-input{grid-area:user-name-input}.main .user-name-label{grid-area:user-name-label}.main .password-input{grid-area:password-input}.main .password-label{grid-area:password-label}";
+const shareKbCss = ".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}.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(--gray-01)}ch-grid-column{padding-inline-start:--gxg-container--padding;padding-inline-end:--gxg-container--padding}ch-grid-cell{--spacing-comp-02:var(--gxg-container--padding)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){box-shadow:var(--box-shadow-01) !important;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(--font-weight-regular);font-size:var(--font-size-lg);font-family:var(--font-family-primary);line-height:1.6em;height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:6px;height:6px}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-main .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:6px;height:6px}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-overflow .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.tree-container{display:flex;height:100%;width:100%;box-sizing:border-box}:host{display:block}.main{display:grid;column-gap:var(--gx-ide-grid-column-gap);row-gap:var(--gx-ide-grid-row-gap);grid-template-columns:auto 1fr;grid-template-areas:\"kb-label kb-input \" \"server-label server-input\" \"auth-type-label auth-type-input\" \"user-name-label user-name-input\" \"password-label password-input\"}.main .kb-name-label{grid-area:kb-label}.main .kb-input{grid-area:kb-input}.main .server-url-label{grid-area:server-label}.main .server-url-input{grid-area:server-input}.main .auth-type-label{grid-area:auth-type-label}.main .auth-type-input{grid-area:auth-type-input}.main .user-name-label{grid-area:user-name-label}.main .user-name-input{grid-area:user-name-input}.main .password-label{grid-area:password-label}.main .password-input{grid-area:password-input}";
 
 // Define your constants
 const AUTHENTICATION_TYPE = ["GeneXus Account", "Local"];
@@ -25,7 +26,8 @@ const GxIdeShareKb$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     super();
     this.__registerHost();
     this.__attachShadow();
-    this.componentDidRenderEvent = createEvent(this, "componentDidRenderEvent", 7);
+    this.componentDidRenderFirstTime = createEvent(this, "componentDidRenderFirstTime", 7);
+    this.renderedFirstTime = false;
     // 7.LISTENERS //
     // 8.PUBLIC METHODS API //
     this.createKBCallbackHandler = async () => {
@@ -51,18 +53,21 @@ const GxIdeShareKb$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     this._componentLocale = await Locale.getComponentStrings(this.el);
   }
   componentDidRender() {
-    this.componentDidRenderEvent.emit(this._componentLocale.componentName);
+    if (!this.renderedFirstTime) {
+      this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
+      this.renderedFirstTime = true;
+    }
   }
   // 9.LOCAL METHODS //
   // 10.RENDER() FUNCTION //
   render() {
-    return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper gx-ide-overflow" }, h("gxg-container", { footerJustify: "end" }, h("main", { class: "main grid" }, h("gxg-label", { labelPosition: "start", class: "kb-label", noMargin: true }, this._componentLocale.main.kbName), h("gxg-form-text", { labelPosition: "start", placeholder: "SalesInventory", "max-width": "100%", value: this.kbName, toolTip: config.tooltip, ref: (el) => (this.kbNameEl = el), part: "kb-name", class: "kb-input" }), h("gxg-label", { labelPosition: "start", class: "server-url-label", noMargin: true }, this._componentLocale.main.serverUrl), h("gxg-combo-box", { disableFilter: !this.enableCustomServer, labelPosition: "start", placeholder: "https://myexampleserver.com", strict: true, toolTip: config.tooltip, "max-width": "100%", value: this.serverUrls[0], ref: (el) => (this.serverUrlEl = el), part: "server-url", class: "server-url-input" }, renderFormItems("gxg-combo-box-item", this.serverUrls.map((item) => ({
+    return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { containerTitle: this._componentLocale.componentName, slimmerFooter: config.gxIdeContainer.slimmerFooter }, h("main", { class: "main" }, h("gxg-label", { labelPosition: "start", class: "kb-label", noMargin: true }, this._componentLocale.main.kbName), h("gxg-form-text", { labelPosition: "start", placeholder: "SalesInventory", "max-width": "100%", value: this.kbName, toolTip: config.tooltip, ref: (el) => (this.kbNameEl = el), part: "kb-name", class: "kb-input" }), h("gxg-label", { labelPosition: "start", class: "server-url-label", noMargin: true }, this._componentLocale.main.serverUrl), h("gxg-combo-box", { disableFilter: !this.enableCustomServer, labelPosition: "start", placeholder: "https://myexampleserver.com", strict: true, toolTip: config.tooltip, value: this.serverUrls[0], ref: (el) => (this.serverUrlEl = el), part: "server-url", class: "server-url-input" }, renderFormItems("gxg-combo-box-item", this.serverUrls.map((item) => ({
       id: item,
       label: item
-    })), "server-url")), h("gxg-combo-box", { labelPosition: "start", placeholder: "https://myexampleserver.com", "max-width": "100%", value: AUTHENTICATION_TYPE[0], ref: (el) => (this.authTypeEl = el), part: "auth-type", class: "auth-type-input" }, renderFormItems("gxg-combo-box-item", AUTHENTICATION_TYPE.map((item) => ({
+    })), "server-url")), h("gxg-label", { labelPosition: "start", class: "auth-type-label", noMargin: true }, this._componentLocale.main.authentication), h("gxg-combo-box", { labelPosition: "start", placeholder: "https://myexampleserver.com", "max-width": "100%", value: AUTHENTICATION_TYPE[0], ref: (el) => (this.authTypeEl = el), part: "auth-type", class: "auth-type-input" }, renderFormItems("gxg-combo-box-item", AUTHENTICATION_TYPE.map((item) => ({
       id: item,
       label: item
-    })), "auth-type")), h("gxg-label", { labelPosition: "start", class: "user-name-label", noMargin: true }, this._componentLocale.main.userName), h("gxg-form-text", { labelPosition: "start", placeholder: "My User", "max-width": "100%", toolTip: config.tooltip, ref: (el) => (this.userNameEl = el), part: "user-name", class: "user-name-input" }), h("gxg-label", { labelPosition: "start", class: "password-label", noMargin: true }, this._componentLocale.main.password), h("gxg-form-text", { labelPosition: "start", password: true, toolTip: config.tooltip, "max-width": "100%", ref: (el) => (this.passwordEl = el), part: "password", class: "password-input" })), h("gxg-button", { slot: "footer", type: "primary-text-only", onClick: this.createKBCallbackHandler }, this._componentLocale.footer.shareBtn)))));
+    })), "auth-type")), h("gxg-label", { labelPosition: "start", class: "user-name-label", noMargin: true }, this._componentLocale.main.userName), h("gxg-form-text", { labelPosition: "start", placeholder: "My User", "max-width": "100%", toolTip: config.tooltip, ref: (el) => (this.userNameEl = el), part: "user-name", class: "user-name-input" }), h("gxg-label", { labelPosition: "start", class: "password-label", noMargin: true }, this._componentLocale.main.password), h("gxg-form-text", { labelPosition: "start", password: true, toolTip: config.tooltip, "max-width": "100%", ref: (el) => (this.passwordEl = el), part: "password", class: "password-input" })), h("gxg-button", { slot: "footer-end", type: "primary-text-icon", icon: "gemini-tools/share", onClick: this.createKBCallbackHandler }, this._componentLocale.footer.shareBtn)))));
   }
   static get assetsDirs() { return ["gx-ide-assets/share-kb"]; }
   get el() { return this; }
@@ -77,7 +82,7 @@ function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["gx-ide-share-kb", "ch-icon", "gxg-button", "gxg-combo-box", "gxg-combo-box-item", "gxg-container", "gxg-form-checkbox", "gxg-form-radio", "gxg-form-text", "gxg-icon", "gxg-label", "gxg-title", "gxg-tooltip"];
+  const components = ["gx-ide-share-kb", "ch-icon", "gx-ide-container", "gx-ide-title", "gxg-button", "gxg-combo-box", "gxg-combo-box-item", "gxg-form-checkbox", "gxg-form-radio", "gxg-form-text", "gxg-icon", "gxg-label", "gxg-title", "gxg-tooltip"];
   components.forEach(tagName => { switch (tagName) {
     case "gx-ide-share-kb":
       if (!customElements.get(tagName)) {
@@ -85,26 +90,31 @@ function defineCustomElement$1() {
       }
       break;
     case "ch-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$e();
+      }
+      break;
+    case "gx-ide-container":
       if (!customElements.get(tagName)) {
         defineCustomElement$d();
       }
       break;
-    case "gxg-button":
+    case "gx-ide-title":
       if (!customElements.get(tagName)) {
         defineCustomElement$c();
       }
       break;
-    case "gxg-combo-box":
+    case "gxg-button":
       if (!customElements.get(tagName)) {
         defineCustomElement$b();
       }
       break;
-    case "gxg-combo-box-item":
+    case "gxg-combo-box":
       if (!customElements.get(tagName)) {
         defineCustomElement$a();
       }
       break;
-    case "gxg-container":
+    case "gxg-combo-box-item":
       if (!customElements.get(tagName)) {
         defineCustomElement$9();
       }

package/dist/components/gx-ide-status-buttons2.js

@@ -3,7 +3,7 @@ import { d as defineCustomElement$5 } from './icon.js';
 import { d as defineCustomElement$4 } from './list-selector.js';
 import { d as defineCustomElement$3 } from './list-selector-item.js';
 import { d as defineCustomElement$2 } from './icon2.js';
-import { d as defineCustomElement$1 } from './title.js';
+import { d as defineCustomElement$1 } from './title2.js';
 
 const gxIdeStatusButtonsCss = ":host{display:block;border:1px solid var(--gx-ide-container-border-color);--status-buttons-label-color:var(--gray-06)}gx-ide-list-selector::part(list){display:flex;flex-direction:row}gx-ide-list-selector-item{border-block-start:none !important;flex:1;text-align:center;}gx-ide-list-selector-item.not-zero{font-weight:var(--font-weight-semibold)}gx-ide-list-selector-item:not(:last-child){border-inline-end:1px solid var(--gx-ide-container-border-color)}gx-ide-list-selector-item .label__wrapper{display:inline-flex;width:auto;min-height:0}gx-ide-list-selector-item .label__description{color:var(--status-buttons-label-color)}gx-ide-list-selector-item .active-indicator{display:inline-block;width:var(--spacing-comp-02);height:var(--spacing-comp-02);border:1px solid var(--gray-07);border-radius:calc(var(--spacing-comp-02) / 2)}gx-ide-list-selector-item input:checked+.label{--status-buttons-label-color:var(--color-on-background);background-color:inherit}gx-ide-list-selector-item input:checked+.label .active-indicator{background-color:var(--color-primary-enabled);border-color:var(--color-primary-active)}gx-ide-list-selector-item:hover input:checked+.label{background-color:var(--gxg-background-color--hover) !important}:host([compact]) gx-ide-list-selector-item{font-size:var(--font-size-md)}:host([compact]) .label__wrapper{gap:var(--spacing-comp-01);padding:var(--spacing-comp-00) var(--spacing-comp-02) var(--spacing-comp-00) var(--spacing-comp-01)}:host([compact]) .label__universal-slot{margin-inline-end:var(--spacing-comp-00)}:host([no-border]){border:none}:host([no-border-top]){border-top:none}:host([no-border-end]){border-inline-end:none}:host([no-border-bottom]){border-bottom:none}:host([no-border-start]){border-inline-start:none}:host([no-inner-borders]) gx-ide-list-selector-item{border-inline-end:none}";
 

package/dist/components/gx-ide-switch-panel.d.ts

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

package/dist/components/gx-ide-switch-panel.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const switchPanelCss = ":host{display:block}";
+
+const GxIdeSwitchPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+  }
+  render() {
+    return (h(Host, null, h("slot", null)));
+  }
+  static get style() { return switchPanelCss; }
+}, [1, "gx-ide-switch-panel"]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["gx-ide-switch-panel"];
+  components.forEach(tagName => { switch (tagName) {
+    case "gx-ide-switch-panel":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, GxIdeSwitchPanel$1);
+      }
+      break;
+  } });
+}
+
+const GxIdeSwitchPanel = GxIdeSwitchPanel$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { GxIdeSwitchPanel, defineCustomElement };

package/dist/components/gx-ide-switcher.d.ts

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

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

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const switcherCss = ":host{display:block}";
+
+const GxIdeSwitcher$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+  }
+  render() {
+    return (h(Host, null, h("slot", null)));
+  }
+  static get style() { return switcherCss; }
+}, [1, "gx-ide-switcher"]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["gx-ide-switcher"];
+  components.forEach(tagName => { switch (tagName) {
+    case "gx-ide-switcher":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, GxIdeSwitcher$1);
+      }
+      break;
+  } });
+}
+
+const GxIdeSwitcher = GxIdeSwitcher$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { GxIdeSwitcher, defineCustomElement };

package/dist/components/gx-ide-team-dev-commit.js

@@ -1,19 +1,21 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { L as Locale } from './locale.js';
+import { c as config } from './config.js';
 import { g as gridCommon } from './grid.js';
 import { r as renderComboItems } from './render-combo-items.js';
 import { f as formatDate } from './helpers2.js';
-import { d as defineCustomElement$q } from './ch-grid2.js';
-import { d as defineCustomElement$p } from './ch-grid-column2.js';
-import { d as defineCustomElement$o } from './ch-grid-column-resize2.js';
-import { d as defineCustomElement$n } from './ch-grid-column-settings2.js';
-import { d as defineCustomElement$m } from './ch-grid-columnset2.js';
-import { d as defineCustomElement$l } from './ch-grid-settings2.js';
-import { d as defineCustomElement$k } from './ch-grid-settings-columns2.js';
-import { d as defineCustomElement$j } from './icon.js';
-import { d as defineCustomElement$i } from './ch-window2.js';
-import { d as defineCustomElement$h } from './ch-window-close2.js';
-import { d as defineCustomElement$g } from './container.js';
+import { d as defineCustomElement$r } from './ch-grid2.js';
+import { d as defineCustomElement$q } from './ch-grid-column2.js';
+import { d as defineCustomElement$p } from './ch-grid-column-resize2.js';
+import { d as defineCustomElement$o } from './ch-grid-column-settings2.js';
+import { d as defineCustomElement$n } from './ch-grid-columnset2.js';
+import { d as defineCustomElement$m } from './ch-grid-settings2.js';
+import { d as defineCustomElement$l } from './ch-grid-settings-columns2.js';
+import { d as defineCustomElement$k } from './icon.js';
+import { d as defineCustomElement$j } from './ch-window2.js';
+import { d as defineCustomElement$i } from './ch-window-close2.js';
+import { d as defineCustomElement$h } from './container.js';
+import { d as defineCustomElement$g } from './title.js';
 import { d as defineCustomElement$f } from './button.js';
 import { d as defineCustomElement$e } from './combo-box.js';
 import { d as defineCustomElement$d } from './combo-box-item.js';
@@ -26,19 +28,20 @@ import { d as defineCustomElement$7 } from './tab.js';
 import { d as defineCustomElement$6 } from './tab-bar.js';
 import { d as defineCustomElement$5 } from './tab-button.js';
 import { d as defineCustomElement$4 } from './tabs.js';
-import { d as defineCustomElement$3 } from './title.js';
+import { d as defineCustomElement$3 } from './title2.js';
 import { d as defineCustomElement$2 } from './tooltip.js';
 
-const teamDevCommitCss = ".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}.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(--gray-01)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){box-shadow:var(--box-shadow-01) !important;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(--font-weight-regular);font-size:var(--font-size-lg);line-height:1.6em;height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:6px;height:6px}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-main .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:6px;height:6px}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-overflow .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}:host{display:block}.header{grid-template-columns:4fr auto}.header .header-button{height:fit-content}.main{display:flex;flex-direction:column}ch-grid{height:auto}.second-grid{grid-template-rows:1fr auto}.second-grid .actions-row{grid-template-columns:1fr auto}.action-buttons{justify-self:flex-end}.hidden{display:none}.filters-grid{grid-template-rows:repeat(2, 1fr)}.filters-grid .first-row{grid-template-columns:repeat(2, 1fr)}.filters-grid .second-row{grid-template-columns:repeat(2, 1fr)}";
+const teamDevCommitCss = ".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}.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(--gray-01)}ch-grid-column{padding-inline-start:--gxg-container--padding;padding-inline-end:--gxg-container--padding}ch-grid-cell{--spacing-comp-02:var(--gxg-container--padding)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){box-shadow:var(--box-shadow-01) !important;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(--font-weight-regular);font-size:var(--font-size-lg);font-family:var(--font-family-primary);line-height:1.6em;height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:6px;height:6px}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-main .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:6px;height:6px}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-overflow .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.tree-container{display:flex;height:100%;width:100%;box-sizing:border-box}:host{display:block}.header{border-top:1px solid var(--gx-ide-container-border-color);display:flex;flex-direction:column}.header>*{padding:var(--gxg-container--padding)}.header__first-row{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:-3px}.header__first-row .commit-label{flex:none}.header__first-row .commit-textarea{flex:none}.header__first-row__right-col{display:flex;align-items:center;gap:var(--gx-ide-grid-column-gap)}.header__second-row{padding:0 var(--gxg-container--padding) var(--gxg-container--padding) var(--gxg-container--padding)}.header .filters-outer-wrapper{display:grid;padding:0;grid-template-rows:1fr;transition:grid-template-rows 200ms;border-bottom:1px solid var(--gx-ide-container-border-color)}.header .filters-outer-wrapper--hidden{grid-template-rows:0fr}.header .filters-inner-wrapper{overflow:hidden}.header__third-row{padding:0 var(--gxg-container--padding) var(--gxg-container--padding) var(--gxg-container--padding);display:grid;column-gap:var(--gx-ide-grid-column-gap);row-gap:var(--gx-ide-grid-row-gap);grid-template-columns:auto 1fr auto 1fr;grid-template-areas:\"pattern-label pattern-form-text pattern-form-text pattern-form-text\" \"changeset-label changeset-combo type-label type-combo\" \"folder-label folder-combo category-label category-combo\"}.header__third-row .pattern-label{grid-area:pattern-label}.header__third-row .pattern-form-text{grid-area:pattern-form-text}.header__third-row .changeset-label{grid-area:changeset-label}.header__third-row .changeset-combo{grid-area:changeset-combo}.header__third-row .type-label{grid-area:type-label}.header__third-row .type-combo{grid-area:type-combo}.header__third-row .folder-label{grid-area:folder-label}.header__third-row .folder-combo{grid-area:folder-combo}.header__third-row .category-label{grid-area:category-label}.header__third-row .category-combo{grid-area:category-combo}.main{height:100%}.grid-container{padding:0}ch-grid{height:auto}";
 
 const GxIdeTeamDevCommit$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
     super();
     this.__registerHost();
     this.__attachShadow();
-    this.componentDidRenderEvent = createEvent(this, "componentDidRenderEvent", 7);
+    this.componentDidRenderFirstTime = createEvent(this, "componentDidRenderFirstTime", 7);
     this.componentDidLoadEvent = createEvent(this, "componentDidLoadEvent", 7);
     this.loadDataCalledFirstTime = false; // pending commits grid checkboxes, should be checked, after loadData has loaded commits for the first time.
+    this.renderedFirstTime = false;
     // 9.LOCAL METHODS //
     this.conditionToCommit = async () => {
       const commitComment = !!this.commitCommentEl.value.length;
@@ -146,11 +149,11 @@ const GxIdeTeamDevCommit$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     };
     /* pending commits grid render*/
     this.renderPendingCommitsGrid = () => {
-      return (h("gxg-grid", { "ellipsis-cell-wrapper": true, noBorder: true }, h("ch-grid", { rowSelectionMode: "multiple", ref: (el) => (this.chGridPendingCommitsEl = el), part: "ch-grid-pending-commits", onRowContextMenu: this.objectsOnContextMenuCallbackHandler("commit"), onSelectionChanged: this.gridOnSelectionChangedCallbackHandler("commit") }, h("ch-grid-columnset", null, h("ch-grid-column", { columnType: "rich", richRowSelector: true, richRowSelectorMode: "mark", settingable: false, sortable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "State", settingable: false, sortable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { settingable: false, sortable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { sortable: true, columnName: "Name", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { sortable: true, columnName: "Type", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "Description", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { sortable: true, columnName: "Modified On", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "Module", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "Local State", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "Last Synchronized", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { sortable: true, columnName: "User", settingable: false, size: gridCommon.colSize.auto })), this.pendingCommits.map((obj) => (h("ch-grid-row", { rowid: obj.id }, h("ch-grid-cell", { "cell-type": "rich", "row-selector": true }), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, this.renderIconState(obj.state))), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, h("gxg-icon", { color: "auto", type: obj.iconType }))), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.name)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.type)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.description)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, `${formatDate(obj.modifiedOn)}`)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.module)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.localState)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, `${formatDate(obj.lastSynchronized)}`)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.user))))))));
+      return (h("gxg-grid", { "ellipsis-cell-wrapper": true, noBorder: true, fullHeight: true }, h("ch-grid", { rowSelectionMode: "multiple", ref: (el) => (this.chGridPendingCommitsEl = el), part: "ch-grid-pending-commits", onRowContextMenu: this.objectsOnContextMenuCallbackHandler("commit"), onSelectionChanged: this.gridOnSelectionChangedCallbackHandler("commit") }, h("ch-grid-columnset", null, h("ch-grid-column", { columnType: "rich", richRowSelector: true, richRowSelectorMode: "mark", settingable: false, sortable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "State", settingable: false, sortable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { settingable: false, sortable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { sortable: true, columnName: "Name", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { sortable: true, columnName: "Type", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "Description", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { sortable: true, columnName: "Modified On", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "Module", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "Local State", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "Last Synchronized", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { sortable: true, columnName: "User", settingable: false, size: gridCommon.colSize.auto })), this.pendingCommits.map((obj) => (h("ch-grid-row", { rowid: obj.id }, h("ch-grid-cell", { "cell-type": "rich", "row-selector": true }), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, this.renderIconState(obj.state))), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, h("gxg-icon", { color: "auto", type: obj.iconType }))), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.name)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.type)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.description)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, `${formatDate(obj.modifiedOn)}`)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.module)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.localState)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, `${formatDate(obj.lastSynchronized)}`)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.user))))))));
     };
     /* ignored objects grid render*/
     this.renderIgnoredObjectsGrid = () => {
-      return (h("gxg-grid", { "ellipsis-cell-wrapper": true, noBorder: true }, h("ch-grid", { rowSelectionMode: "multiple", ref: (el) => (this.chGridIgnoredObjectsEl = el), part: "ch-grid-pending-commits", onRowContextMenu: this.objectsOnContextMenuCallbackHandler("ignored"), onSelectionChanged: this.gridOnSelectionChangedCallbackHandler("ignored") }, h("ch-grid-columnset", null, h("ch-grid-column", { columnName: "", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "TypeIcon", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "Name", settingable: false, sortable: true, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Type", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Description", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Modified On", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Module", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Local State", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Last Synchronized", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "User", settingable: false, size: gridCommon.colSize.common })), this.ignoredObjects.map((obj) => (h("ch-grid-row", { rowid: obj.id, selected: true }, h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, this.renderIconState(obj.state))), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, h("gxg-icon", { color: "auto", type: obj.iconType }))), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.name)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.type)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.description)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, `${formatDate(obj.modifiedOn)}`)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.module)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.localState)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, `${formatDate(obj.lastSynchronized)}`)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.user))))))));
+      return (h("gxg-grid", { "ellipsis-cell-wrapper": true, noBorder: true, fullHeight: true }, h("ch-grid", { rowSelectionMode: "multiple", ref: (el) => (this.chGridIgnoredObjectsEl = el), part: "ch-grid-pending-commits", onRowContextMenu: this.objectsOnContextMenuCallbackHandler("ignored"), onSelectionChanged: this.gridOnSelectionChangedCallbackHandler("ignored") }, h("ch-grid-columnset", null, h("ch-grid-column", { columnName: "", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "TypeIcon", settingable: false, size: gridCommon.colSize.auto }), h("ch-grid-column", { columnName: "Name", settingable: false, sortable: true, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Type", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Description", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Modified On", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Module", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Local State", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "Last Synchronized", settingable: false, size: gridCommon.colSize.common }), h("ch-grid-column", { columnName: "User", settingable: false, size: gridCommon.colSize.common })), this.ignoredObjects.map((obj) => (h("ch-grid-row", { rowid: obj.id, selected: true }, h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, this.renderIconState(obj.state))), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, h("gxg-icon", { color: "auto", type: obj.iconType }))), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.name)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.type)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.description)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, `${formatDate(obj.modifiedOn)}`)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.module)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.localState)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, `${formatDate(obj.lastSynchronized)}`)), h("ch-grid-cell", null, h("span", { class: "cell-wrapper" }, obj.user))))))));
     };
     this.getRecentCommentHandler = async () => {
       if (this.getRecentCommentCallback) {
@@ -177,6 +180,7 @@ const GxIdeTeamDevCommit$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
         category: this.categoriesEl.value,
         type: this.typesEl.value
       };
+      this.evaluateFilterConditions();
       // this.pendingCommits = null;
       // this.ignoredObjects = null;
       return await this.loadCallback(filtersData).then(async ({ pending, ignored }) => {
@@ -187,11 +191,24 @@ const GxIdeTeamDevCommit$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     this.toggleFiltersHandler = () => {
       this.filtersHidden = !this.filtersHidden;
     };
+    this.evaluateFilterConditions = () => {
+      if (this.patternEl.value ||
+        this.changeSetEl.value ||
+        this.typesEl.value ||
+        this.foldersEl.value ||
+        this.categoriesEl.value) {
+        this.filterHasConditions = true;
+      }
+      else {
+        this.filterHasConditions = false;
+      }
+    };
     this.filtersHidden = true;
     this.comment = "";
     this.pendingCommits = [];
     this.ignoredObjects = [];
     this.commitButtonEnabled = false;
+    this.filterHasConditions = false;
     this.changeSet = undefined;
     this.types = undefined;
     this.folders = undefined;
@@ -214,7 +231,10 @@ const GxIdeTeamDevCommit$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     this.conditionToCommit();
   }
   async componentDidRender() {
-    this.componentDidRenderEvent.emit(this._componentLocale.componentName);
+    if (!this.renderedFirstTime) {
+      this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
+      this.renderedFirstTime = true;
+    }
     if (this.loadDataCalledFirstTime) {
       // call this method only once
       await this.markAllPendingCommitsRows();
@@ -233,8 +253,16 @@ const GxIdeTeamDevCommit$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
   }
   // 10.RENDER() FUNCTION //
   render() {
-    return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", null, h("header", { class: "header grid" }, h("gxg-form-textarea", { id: "gxg-textarea", height: "100px", label: this._componentLocale.topMenu.commentLabel, value: this.comment, ref: (el) => (this.commitCommentEl = el), onInput: this.conditionToCommit, placeholder: this._componentLocale.topMenu.commentPlaceholder, part: "comment" }), h("gxg-button", { class: "header-button", type: "outlined", part: "location", onClick: this.getRecentCommentHandler }, this._componentLocale.topMenu.recentCommentsButton))), h("main", { class: "main gxi-full-height gx-ide-overflow" }, h("gx-ide-container", { noContentPadding: !!this.filtersHidden }, h("div", { class: "grid second-grid" }, h("div", { class: "actions-row grid" }, h("gxg-form-text", { class: this.filtersHidden ? "hidden" : null, "disable-filter": true, label: this._componentLocale.filtersMenu.patternLabel, labelPosition: "start", value: "", ref: (el) => (this.patternEl = el), "display-validation-styles": true, "display-validation-message": true, part: "pattern", onInput: this.loadData }), h("div", { class: "action-buttons", slot: "tab-bar" }, h("gxg-button", { onClick: this.toggleFiltersHandler, type: "secondary-icon-only", icon: "patterns/filters", part: "gxg-button gxg-button--show-filter" }), h("gxg-button", { type: "secondary-icon-only", icon: "gemini-tools/reset", onClick: this.loadData, part: "gxg-button gxg-button--reload" }))), h("div", { class: "filters-grid grid " +
-        (this.filtersHidden ? "hidden" : null) }, h("div", { class: "first-row grid" }, h("gxg-combo-box", { labelPosition: "start", label: this._componentLocale.filtersMenu.changesetLabel, value: this.changeSet[0]["id"], ref: (el) => (this.changeSetEl = el), part: "change-set", "display-validation-styles": true, "display-validation-message": true, onValueChanged: this.loadData }, renderComboItems(this.changeSet)), h("gxg-combo-box", { labelPosition: "start", label: this._componentLocale.filtersMenu.typeLabel, value: this.types[0]["id"], ref: (el) => (this.typesEl = el), part: "type", onValueChanged: this.loadData }, renderComboItems(this.types))), h("div", { class: "second-row grid" }, h("gxg-combo-box", { labelPosition: "start", label: this._componentLocale.filtersMenu.folderLabel, value: this.folders[0]["id"], ref: (el) => (this.foldersEl = el), part: "folder", "display-validation-styles": true, "display-validation-message": true, onValueChanged: this.loadData }, renderComboItems(this.folders)), h("gxg-combo-box", { labelPosition: "start", label: this._componentLocale.filtersMenu.categoryLabel, value: this.categories[0]["id"], ref: (el) => (this.categoriesEl = el), part: "categories", onValueChanged: this.loadData }, renderComboItems(this.categories)))))), h("gx-ide-container", { noContentPadding: true, class: "gxi-overflow-auto" }, h("gxg-tabs", { class: "gxg-tabs" }, h("gxg-tab-bar", { slot: "tab-bar-container", displayBorder: true }, h("gxg-tab-button", { slot: "tab-bar", "tab-label": `${this._componentLocale.tabs.pendingCommits} (${this.pendingCommits.length})`, tab: "pending-commits", "is-selected": true }), h("gxg-tab-button", { slot: "tab-bar", "tab-label": `${this._componentLocale.tabs.ignoredObjects} (${this.ignoredObjects.length})`, tab: "ignored-objects" })), h("gxg-tab", { tab: "pending-commits", "no-padding": true, flex: true }, this.renderPendingCommitsGrid()), h("gxg-tab", { tab: "ignored-objects", "no-padding": true, flex: true }, this.renderIgnoredObjectsGrid())))), h("gx-ide-container", { displayBorderTop: true }, h("gxg-button", { slot: "footer-end", type: "primary-text-only", onClick: this.commitCallbackHandler, part: "commit-button", disabled: !this.commitButtonEnabled }, this._componentLocale.footer.commitButton)))));
+    return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { noContentPadding: true, noHeadingPadding: true, headingPaddingTop: true, containerTitle: this._componentLocale.componentName, slimmerFooter: config.gxIdeContainer.slimmerFooter, noHeadingBorder: true }, h("div", { class: "header", slot: "header" }, h("div", { class: "header__first-row" }, h("div", { class: "header__first-row__left-col" }, h("gxg-label", { part: "commit-label", labelPosition: "start", class: "commit-label", noMargin: true }, this._componentLocale.header.commentLabel)), h("div", { class: "header__first-row__right-col" }, h("gxg-button", { onClick: this.toggleFiltersHandler, type: "secondary-icon-only", icon: this.filterHasConditions
+        ? "window-tools/filter-conditions"
+        : "window-tools/filter", part: "gxg-button gxg-button--show-filter", class: "filter-btn" }), h("gxg-button", { type: "secondary-icon-only", icon: "gemini-tools/reset", onClick: this.loadData, part: "gxg-button gxg-button--reload", class: "reset-btn" }), h("gxg-button", { class: "header-button", type: "outlined", part: "location", onClick: this.getRecentCommentHandler }, this._componentLocale.header.recentCommentsButton))), h("div", { class: "header__second-row" }, h("gxg-form-textarea", { height: "64px", value: this.comment, ref: (el) => (this.commitCommentEl = el), singleLine: true, onInput: this.conditionToCommit, placeholder: this._componentLocale.header.commentPlaceholder, part: "comment", class: "commit-textarea" })), h("div", { class: {
+        "filters-outer-wrapper": true,
+        "filters-outer-wrapper--hidden": this.filtersHidden
+      } }, h("div", { class: {
+        "filters-inner-wrapper": true
+      } }, h("div", { class: {
+        "header__third-row": true
+      } }, h("gxg-label", { part: "pattern-label", labelPosition: "start", class: "pattern-label", noMargin: true }, this._componentLocale.filtersMenu.patternLabel), h("gxg-form-text", { "disable-filter": true, value: "", ref: (el) => (this.patternEl = el), "display-validation-styles": true, "display-validation-message": true, part: "pattern-form-text", class: "pattern-form-text", onInput: this.loadData }), h("gxg-label", { part: "changeset-label", labelPosition: "start", class: "changeset-label", noMargin: true }, this._componentLocale.filtersMenu.changesetLabel), h("gxg-combo-box", { value: this.changeSet[0]["id"], ref: (el) => (this.changeSetEl = el), part: "changeset-combo", class: "changeset-combo", "display-validation-styles": true, "display-validation-message": true, onValueChanged: this.loadData }, renderComboItems(this.changeSet)), h("gxg-label", { part: "type-label", labelPosition: "start", class: "type-label", noMargin: true }, this._componentLocale.filtersMenu.typeLabel), h("gxg-combo-box", { labelPosition: "start", value: this.types[0]["id"], ref: (el) => (this.typesEl = el), part: "type-combo", class: "type-combo", onValueChanged: this.loadData }, renderComboItems(this.types)), h("gxg-label", { part: "folder-label", labelPosition: "start", class: "folder-label", noMargin: true }, this._componentLocale.filtersMenu.folderLabel), h("gxg-combo-box", { value: this.folders[0]["id"], ref: (el) => (this.foldersEl = el), part: "folder-combo", "display-validation-styles": true, "display-validation-message": true, onValueChanged: this.loadData }, renderComboItems(this.folders)), h("gxg-label", { part: "category-label", labelPosition: "start", class: "category-label", noMargin: true }, this._componentLocale.filtersMenu.categoryLabel), h("gxg-combo-box", { value: this.categories[0]["id"], ref: (el) => (this.categoriesEl = el), part: "category-combo", class: "category-combo", onValueChanged: this.loadData }, renderComboItems(this.categories)))))), h("main", { class: "main" }, h("gx-ide-container", { noContentPadding: true, class: "grid-container" }, h("div", { class: "tabs-container gxi-full-height" }, h("gxg-tabs", { class: "gxg-tabs" }, h("gxg-tab-bar", { slot: "tab-bar-container", displayBorder: true }, h("gxg-tab-button", { slot: "tab-bar", "tab-label": `${this._componentLocale.tabs.pendingCommits} (${this.pendingCommits.length})`, tab: "pending-commits", "is-selected": true }), h("gxg-tab-button", { slot: "tab-bar", "tab-label": `${this._componentLocale.tabs.ignoredObjects} (${this.ignoredObjects.length})`, tab: "ignored-objects" })), h("gxg-tab", { tab: "pending-commits", "no-padding": true, flex: true }, this.renderPendingCommitsGrid()), h("gxg-tab", { tab: "ignored-objects", "no-padding": true, flex: true }, this.renderIgnoredObjectsGrid()))))), h("gxg-button", { slot: "footer-end", type: "primary-text-only", onClick: this.commitCallbackHandler, part: "commit-button", disabled: !this.commitButtonEnabled }, this._componentLocale.footer.commitButton)))));
   }
   static get assetsDirs() { return ["gx-ide-assets/team-dev-commit"]; }
   get el() { return this; }
@@ -255,13 +283,14 @@ const GxIdeTeamDevCommit$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     "pendingCommits": [32],
     "ignoredObjects": [32],
     "commitButtonEnabled": [32],
+    "filterHasConditions": [32],
     "reload": [64]
   }]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["gx-ide-team-dev-commit", "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", "gxg-button", "gxg-combo-box", "gxg-combo-box-item", "gxg-form-text", "gxg-form-textarea", "gxg-grid", "gxg-icon", "gxg-label", "gxg-tab", "gxg-tab-bar", "gxg-tab-button", "gxg-tabs", "gxg-title", "gxg-tooltip"];
+  const components = ["gx-ide-team-dev-commit", "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-title", "gxg-button", "gxg-combo-box", "gxg-combo-box-item", "gxg-form-text", "gxg-form-textarea", "gxg-grid", "gxg-icon", "gxg-label", "gxg-tab", "gxg-tab-bar", "gxg-tab-button", "gxg-tabs", "gxg-title", "gxg-tooltip"];
   components.forEach(tagName => { switch (tagName) {
     case "gx-ide-team-dev-commit":
       if (!customElements.get(tagName)) {
@@ -270,55 +299,60 @@ function defineCustomElement$1() {
       break;
     case "ch-grid":
       if (!customElements.get(tagName)) {
-        defineCustomElement$q();
+        defineCustomElement$r();
       }
       break;
     case "ch-grid-column":
       if (!customElements.get(tagName)) {
-        defineCustomElement$p();
+        defineCustomElement$q();
       }
       break;
     case "ch-grid-column-resize":
       if (!customElements.get(tagName)) {
-        defineCustomElement$o();
+        defineCustomElement$p();
       }
       break;
     case "ch-grid-column-settings":
       if (!customElements.get(tagName)) {
-        defineCustomElement$n();
+        defineCustomElement$o();
       }
       break;
     case "ch-grid-columnset":
       if (!customElements.get(tagName)) {
-        defineCustomElement$m();
+        defineCustomElement$n();
       }
       break;
     case "ch-grid-settings":
       if (!customElements.get(tagName)) {
-        defineCustomElement$l();
+        defineCustomElement$m();
       }
       break;
     case "ch-grid-settings-columns":
       if (!customElements.get(tagName)) {
-        defineCustomElement$k();
+        defineCustomElement$l();
       }
       break;
     case "ch-icon":
       if (!customElements.get(tagName)) {
-        defineCustomElement$j();
+        defineCustomElement$k();
       }
       break;
     case "ch-window":
       if (!customElements.get(tagName)) {
-        defineCustomElement$i();
+        defineCustomElement$j();
       }
       break;
     case "ch-window-close":
       if (!customElements.get(tagName)) {
-        defineCustomElement$h();
+        defineCustomElement$i();
       }
       break;
     case "gx-ide-container":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$h();
+      }
+      break;
+    case "gx-ide-title":
       if (!customElements.get(tagName)) {
         defineCustomElement$g();
       }