@genexus/genexus-ide-ui 1.1.21 → 1.1.23

package/dist/collection/components/team-dev/commit/commit.js

@@ -1,102 +1,169 @@
-/* STENCIL IMPORTS */
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m")
+        throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var _GxIdeTeamDevCommit_componentLocale, _GxIdeTeamDevCommit_loadDataCalledFirstTime, _GxIdeTeamDevCommit_renderedFirstTime, _GxIdeTeamDevCommit_commitsTabModel, _GxIdeTeamDevCommit_categoriesEl, _GxIdeTeamDevCommit_changeSetEl, _GxIdeTeamDevCommit_commitCommentEl, _GxIdeTeamDevCommit_foldersEl, _GxIdeTeamDevCommit_patternEl, _GxIdeTeamDevCommit_typesEl, _GxIdeTeamDevCommit_chGridIgnoredObjectsEl, _GxIdeTeamDevCommit_chGridPendingCommitsEl, _GxIdeTeamDevCommit_initializeComboBoxModels, _GxIdeTeamDevCommit_commitCallbackHandler, _GxIdeTeamDevCommit_evaluateFilterConditions, _GxIdeTeamDevCommit_getRecentCommentHandler, _GxIdeTeamDevCommit_gridOnSelectionChangedCallbackHandler, _GxIdeTeamDevCommit_handleColumnSortChanged, _GxIdeTeamDevCommit_loadData, _GxIdeTeamDevCommit_markAllPendingCommitsRows, _GxIdeTeamDevCommit_objectsOnContextMenuCallbackHandler, _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler, _GxIdeTeamDevCommit_renderTabularGridColumnSet, _GxIdeTeamDevCommit_renderTabularGridCommonCells, _GxIdeTeamDevCommit_renderIgnoredObjectsGrid, _GxIdeTeamDevCommit_renderPendingCommitsGrid, _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes, _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes, _GxIdeTeamDevCommit_updateTabModel, _GxIdeTeamDevCommit_commentInputHandler, _GxIdeTeamDevCommit_toggleFiltersHandler, _GxIdeTeamDevCommit_onTabActivated;
+// Stencil
 import { Host, h } from "@stencil/core";
-/* CUSTOM IMPORTS */
+import { getIconPath } from "@genexus/mercury";
+import { renderObjectStateWithIcon, renderObjectTypeWithIcon } from "../common/utilities";
+// Custom Imports
 import { Locale } from "../../../common/locale";
 import { config } from "../../../common/config";
-import { renderComboItems } from "../../../common/render-combo-items";
 import { formatDate } from "../../../common/helpers";
+import { mapGxOptionsToComboBoxItemModel, mapObjectTypeToComboBoxItemModel } from "./helpers";
+const FILTER_ICON = getIconPath({
+    category: "window-tools",
+    name: "filter",
+    colorType: "primary"
+});
+const FILTER_ICON_EMPTY = getIconPath({
+    category: "window-tools",
+    name: "filter",
+    colorType: "on-surface"
+});
+const FILTER_WITH_CONDITIONS_ICON = getIconPath({
+    category: "window-tools",
+    name: "filter-conditions",
+    colorType: "primary"
+});
+const RESET_ICON = getIconPath({
+    category: "gemini-tools",
+    name: "reset",
+    colorType: "primary"
+});
+const ALL_OPTION = "All";
 const CSS_BUNDLES = [
     "resets/box-sizing",
-    "utils/form",
-    "utils/layout",
-    "utils/typography",
     "components/button",
     "components/checkbox",
+    "components/combo-box",
     "components/edit",
-    "components/tabular-grid"
+    "components/tab",
+    "components/icon",
+    "components/tabular-grid",
+    "components/tooltip",
+    "chameleon/scrollbar",
+    "utils/form",
+    "utils/layout",
+    "utils/typography",
+    "utils/spacing"
 ];
 export class GxIdeTeamDevCommit {
     constructor() {
-        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;
-            const pendingChecked = await this.chGridPendingCommitsEl.getMarkedRows();
-            if (commitComment && pendingChecked.length > 0) {
-                this.commitButtonEnabled = true;
+        /**
+         * The component hard-coded strings translations.
+         */
+        // eslint-disable-next-line @stencil-community/own-props-must-be-private
+        _GxIdeTeamDevCommit_componentLocale.set(this, void 0);
+        _GxIdeTeamDevCommit_loadDataCalledFirstTime.set(this, false); // pending commits grid checkboxes, should be checked, after loadData has loaded commits for the first time.
+        _GxIdeTeamDevCommit_renderedFirstTime.set(this, false);
+        _GxIdeTeamDevCommit_commitsTabModel.set(this, [
+            { id: "pending-commits", name: "Pending Commits" },
+            { id: "ignored-objects", name: "Ignored Objects" }
+        ]);
+        // filters
+        _GxIdeTeamDevCommit_categoriesEl.set(this, void 0);
+        _GxIdeTeamDevCommit_changeSetEl.set(this, void 0);
+        _GxIdeTeamDevCommit_commitCommentEl.set(this, void 0);
+        _GxIdeTeamDevCommit_foldersEl.set(this, void 0);
+        _GxIdeTeamDevCommit_patternEl.set(this, void 0);
+        _GxIdeTeamDevCommit_typesEl.set(this, void 0);
+        // other
+        _GxIdeTeamDevCommit_chGridIgnoredObjectsEl.set(this, void 0);
+        _GxIdeTeamDevCommit_chGridPendingCommitsEl.set(this, void 0);
+        _GxIdeTeamDevCommit_initializeComboBoxModels.set(this, () => {
+            this.foldersChangedHandler(this.folders);
+            this.typesChangedHandler(this.types);
+            this.changeSetChangedHandler(this.changeSet);
+            this.categoriesChangedHandler(this.categories);
+        });
+        _GxIdeTeamDevCommit_commitCallbackHandler.set(this, async () => {
+            const comment = __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCommentEl, "f").value;
+            if (!comment.length) {
+                // A comment is required to commit.
+                this.commentInputHasError = true;
+                return;
             }
-            else {
-                this.commitButtonEnabled = false;
+            this.commitingObjects = true;
+            this.commentInputHasError = false;
+            const pendingCommitsCheckedIds = await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").getMarkedRows();
+            await this.commitCallback(pendingCommitsCheckedIds, comment);
+            this.commitingObjects = false;
+        });
+        _GxIdeTeamDevCommit_evaluateFilterConditions.set(this, () => {
+            // TODO: This should update
+            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_patternEl, "f").value !== "" ||
+                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_changeSetEl, "f").value !== ALL_OPTION ||
+                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_typesEl, "f").value !== ALL_OPTION ||
+                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_foldersEl, "f").value !== ALL_OPTION ||
+                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_categoriesEl, "f").value !== ALL_OPTION) {
+                this.filterHasConditions = true;
             }
-        };
-        this.markAllPendingCommitsRows = () => {
-            this.chGridPendingCommitsEl.markAllRows();
-        };
-        this.togglePendingCommitsCheckboxes = async (itemsToToggle) => {
-            if (this.chGridPendingCommitsEl) {
-                const itemsToCheck = itemsToToggle.itemsToCheck;
-                const itemsToUncheck = itemsToToggle.itemsToUncheck;
-                // check
-                for (const rowId of itemsToCheck) {
-                    await this.chGridPendingCommitsEl.markRow(rowId, true);
-                }
-                // uncheck
-                for (const rowId of itemsToUncheck) {
-                    await this.chGridPendingCommitsEl.markRow(rowId, false);
-                }
+            else {
+                this.filterHasConditions = false;
             }
-        };
-        this.revertPendingCommitsCheckboxes = async (addedRowsIds, removedRowsId) => {
-            if (this.chGridPendingCommitsEl) {
-                for (const rowId of addedRowsIds) {
-                    await this.chGridPendingCommitsEl.markRow(rowId, false);
-                }
-                for (const rowId of removedRowsId) {
-                    await this.chGridPendingCommitsEl.markRow(rowId, true);
+        });
+        _GxIdeTeamDevCommit_getRecentCommentHandler.set(this, async () => {
+            if (this.getRecentCommentCallback) {
+                const response = await this.getRecentCommentCallback();
+                if (response) {
+                    __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCommentEl, "f").value = response;
                 }
             }
-        };
-        this.renderIconState = (state) => {
-            let icon;
-            switch (state) {
-                case "inserted":
-                    icon = "gx-server/new";
-                    break;
-                case "modified":
-                    icon = "gx-server/changes-commit-pending";
-                    break;
-                case "deleted":
-                    icon = "gx-server/delete";
-                    break;
-                case "conflicted":
-                    icon = "gx-server/conflict";
-                    break;
+        });
+        _GxIdeTeamDevCommit_gridOnSelectionChangedCallbackHandler.set(this, (grid) => async (ev) => {
+            if (this.selectCallback) {
+                await this.selectCallback(grid, ev.detail.rowsId);
             }
-            return h("ch-image", { src: icon, class: "icon-md" });
-        };
-        this.pendingCommitsRowMarkingChangedHandler = async (e) => {
-            // remove "rowMarkingChanged" until checkboxes have been added/removed on togglePendingCommitsCheckboxes, to prevent loops.
-            this.chGridPendingCommitsEl.removeEventListener("rowMarkingChanged", this.pendingCommitsRowMarkingChangedHandler);
-            if (this.chGridPendingCommitsEl) {
-                const addedRowsIds = e.detail.addedRowsId;
-                const removedRowsId = e.detail.removedRowsId;
-                const pendingItemCheckedResult = await this.pendingItemsCheckedCallback({
-                    itemsChecked: addedRowsIds,
-                    itemsUnchecked: removedRowsId
-                });
-                if (pendingItemCheckedResult === undefined) {
-                    // undo check/uncheck
-                    await this.revertPendingCommitsCheckboxes(addedRowsIds, removedRowsId);
+        });
+        _GxIdeTeamDevCommit_handleColumnSortChanged.set(this, (e) => {
+            const { columnId, sortDirection } = e.detail;
+            const aux = this.pendingCommits;
+            aux.sort((a, b) => {
+                if (a[columnId] < b[columnId]) {
+                    return sortDirection === "asc" ? -1 : 1;
                 }
-                else {
-                    await this.togglePendingCommitsCheckboxes(pendingItemCheckedResult);
+                if (a[columnId] > b[columnId]) {
+                    return sortDirection === "asc" ? 1 : -1;
                 }
-                this.conditionToCommit();
-                this.chGridPendingCommitsEl.addEventListener("rowMarkingChanged", this.pendingCommitsRowMarkingChangedHandler);
-            }
-        };
-        this.objectsOnContextMenuCallbackHandler = (grid) => async (ev) => {
+                return 0;
+            });
+            this.pendingCommits = [...aux];
+        });
+        _GxIdeTeamDevCommit_loadData.set(this, async () => {
+            this.loading = true;
+            const filtersData = {
+                pattern: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_patternEl, "f").value,
+                changeSet: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_changeSetEl, "f").value,
+                folder: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_foldersEl, "f").value,
+                category: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_categoriesEl, "f").value,
+                type: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_typesEl, "f").value
+            };
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_evaluateFilterConditions, "f").call(this);
+            await this.loadCallback(filtersData).then(async ({ pending, ignored }) => {
+                this.pendingCommits = [...pending];
+                this.ignoredObjects = [...ignored];
+            });
+            this.loading = false;
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_updateTabModel, "f").call(this);
+        });
+        _GxIdeTeamDevCommit_markAllPendingCommitsRows.set(this, async () => {
+            await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").markAllRows();
+        });
+        _GxIdeTeamDevCommit_objectsOnContextMenuCallbackHandler.set(this, (grid) => async (ev) => {
             ev.preventDefault();
             ev.stopPropagation();
             let selection = [];
@@ -104,7 +171,7 @@ export class GxIdeTeamDevCommit {
                 selection = ev.detail.selectedRowsId;
             }
             else if (grid === "ignored") {
-                selection = await this.chGridIgnoredObjectsEl.getSelectedRows();
+                selection = await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridIgnoredObjectsEl, "f").getSelectedRows();
             }
             if (this.objectsContextMenuCallback) {
                 await this.objectsContextMenuCallback(grid, {
@@ -113,130 +180,215 @@ export class GxIdeTeamDevCommit {
                     clientY: ev.detail.clientY
                 });
             }
-        };
-        this.gridOnSelectionChangedCallbackHandler = (grid) => async (ev) => {
-            if (this.selectCallback) {
-                await this.selectCallback(grid, ev.detail.rowsId);
+        });
+        _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler.set(this, async (e) => {
+            // remove "rowMarkingChanged" until checkboxes have been added/removed on #togglePendingCommitsCheckboxes, to prevent loops.
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").removeEventListener("rowMarkingChanged", __classPrivateFieldGet(this, _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler, "f"));
+            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f")) {
+                const addedRowsIds = e.detail.addedRowsId;
+                const removedRowsId = e.detail.removedRowsId;
+                const pendingItemCheckedResult = await this.pendingItemsCheckedCallback({
+                    itemsChecked: addedRowsIds,
+                    itemsUnchecked: removedRowsId
+                });
+                if (pendingItemCheckedResult === undefined) {
+                    // undo check/uncheck
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes, "f").call(this, addedRowsIds, removedRowsId);
+                }
+                else {
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes, "f").call(this, pendingItemCheckedResult);
+                }
+                __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").addEventListener("rowMarkingChanged", __classPrivateFieldGet(this, _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler, "f"));
             }
-        };
-        /* pending commits grid render*/
-        this.renderPendingCommitsGrid = () => {
-            return (h("ch-tabular-grid", { class: "tabular-grid tabular-grid-td-commit", rowSelectionMode: "multiple", ref: (el) => (this.chGridPendingCommitsEl = el), part: "ch-grid-pending-commits", onRowContextMenu: this.objectsOnContextMenuCallbackHandler("commit"), onSelectionChanged: this.gridOnSelectionChangedCallbackHandler("commit") }, h("ch-tabular-grid-columnset", { class: "tabular-grid-column-set" }, h("ch-tabular-grid-column", { class: "tabular-grid-column", columnType: "rich", richRowSelector: true, richRowSelectorMode: "mark", settingable: false, sortable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "State", settingable: false, sortable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", settingable: false, sortable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", sortable: true, columnName: "Name", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", sortable: true, columnName: "Type", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Description", settingable: false, size: config.tabularGrid.colSize.commonDouble }), h("ch-tabular-grid-column", { class: "tabular-grid-column", sortable: true, columnName: "Modified On", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Module", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Local State", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Last Synchronized", settingable: false, size: config.tabularGrid.colSize.maxContent })), this.pendingCommits.map((obj) => (h("ch-tabular-grid-row", { rowid: obj.id, class: "tabular-grid-row" }, h("ch-tabular-grid-cell", { "cell-type": "rich", "row-selector": true, class: "tabular-grid-cell" }), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, this.renderIconState(obj.state)), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, h("ch-image", { src: obj.iconType, class: "icon-md" })), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, obj.name), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, obj.type), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, obj.description), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, `${formatDate(obj.modifiedOn)}`), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, obj.module), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, obj.localState), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, `${formatDate(obj.lastSynchronized)}`))))));
-        };
-        /* ignored objects grid render*/
-        this.renderIgnoredObjectsGrid = () => {
-            return (h("ch-tabular-grid", { class: "tabular-grid", rowSelectionMode: "multiple", ref: (el) => (this.chGridIgnoredObjectsEl = el), part: "ch-grid-pending-commits", onRowContextMenu: this.objectsOnContextMenuCallbackHandler("ignored"), onSelectionChanged: this.gridOnSelectionChangedCallbackHandler("ignored") }, h("ch-tabular-grid-columnset", { class: "tabular-grid-column-set" }, h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "TypeIcon", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Name", settingable: false, sortable: true, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Type", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Description", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Modified On", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Module", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Local State", settingable: false, size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { class: "tabular-grid-column", columnName: "Last Synchronized", settingable: false, size: config.tabularGrid.colSize.maxContent })), this.ignoredObjects.map((obj) => (h("ch-tabular-grid-row", { rowid: obj.id, selected: true, class: "tabular-grid-row" }, h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, this.renderIconState(obj.state)), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, h("ch-image", { src: obj.iconType, class: "icon-md" })), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, obj.name), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, obj.type), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, obj.description), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, `${formatDate(obj.modifiedOn)}`), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, obj.module), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, obj.localState), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, `${formatDate(obj.lastSynchronized)}`))))));
-        };
-        this.getRecentCommentHandler = async () => {
-            if (this.getRecentCommentCallback) {
-                const response = await this.getRecentCommentCallback();
-                if (response) {
-                    this.comment = response;
+        });
+        _GxIdeTeamDevCommit_renderTabularGridColumnSet.set(this, (withCheckboxes = false) => {
+            return (h("ch-tabular-grid-columnset", { class: "tabular-grid-column-set" }, withCheckboxes && (h("ch-tabular-grid-column", { class: "tabular-grid-column", columnType: "rich", richRowSelector: true, richRowSelectorMode: "mark", settingable: false, sortable: false, size: config.tabularGrid.colSize.maxContent })), h("ch-tabular-grid-column", { columnId: "name", class: "tabular-grid-column", sortable: true, columnName: "Name", settingable: false, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "type", class: "tabular-grid-column", sortable: true, columnName: "Type", settingable: false, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "description", class: "tabular-grid-column", columnName: "Description", settingable: false, sortable: true, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "modifiedOn", class: "tabular-grid-column", sortable: true, columnName: "Modified On", settingable: false, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "module", class: "tabular-grid-column", columnName: "Module", settingable: false, sortable: true, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "localState", class: "tabular-grid-column", columnName: "Local State", settingable: false, sortable: true, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.maxContent }), h("ch-tabular-grid-column", { columnId: "lastSynchronized", class: "tabular-grid-column", columnName: "Last Synchronized", settingable: false, sortable: true, onColumnSortChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_handleColumnSortChanged, "f"), size: config.tabularGrid.colSize.auto })));
+        });
+        _GxIdeTeamDevCommit_renderTabularGridCommonCells.set(this, (object) => {
+            return [
+                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, object.name),
+                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, renderObjectTypeWithIcon(object.type)),
+                h("ch-tabular-grid-cell", { class: "tabular-grid-cell tabular-grid-cell-description" }, object.description),
+                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, `${formatDate(object.modifiedOn)}`),
+                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, object.module),
+                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, renderObjectStateWithIcon(object.localState)),
+                h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, `${formatDate(object.lastSynchronized)}`)
+            ];
+        });
+        _GxIdeTeamDevCommit_renderIgnoredObjectsGrid.set(this, () => {
+            var _a;
+            const tabularGridEmpty = ((_a = this.ignoredObjects) === null || _a === void 0 ? void 0 : _a.length) === 0 || !this.ignoredObjects;
+            return (h("ch-tabular-grid", {
+                // ignored objects grid render
+                class: {
+                    "tabular-grid": true,
+                    "tabular-grid--empty": tabularGridEmpty
+                }, rowSelectionMode: "multiple", ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_chGridIgnoredObjectsEl, el, "f")), allowColumnReorder: false, part: "ch-grid-pending-commits", onRowContextMenu: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_objectsOnContextMenuCallbackHandler, "f").call(this, "ignored"), onSelectionChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_gridOnSelectionChangedCallbackHandler, "f").call(this, "ignored")
+            }, this.commitingObjects && (h("gx-ide-loader", { loaderTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.title, description: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.description, show: true })), __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderTabularGridColumnSet, "f").call(this), this.ignoredObjects.length > 0 ? (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, this.ignoredObjects.map((obj) => (h("ch-tabular-grid-row", { rowid: obj.id, selected: true, class: "tabular-grid-row" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderTabularGridCommonCells, "f").call(this, obj)))))) : (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, h("ch-tabular-grid-rowset-empty", null, h("gx-ide-empty-state", { stateIconSrc: FILTER_ICON_EMPTY, stateTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").emptyIgnoredObjects, isAnimated: true }))))));
+        });
+        _GxIdeTeamDevCommit_renderPendingCommitsGrid.set(this, () => {
+            var _a;
+            const withCheckboxes = true;
+            const tabularGridEmpty = ((_a = this.pendingCommits) === null || _a === void 0 ? void 0 : _a.length) === 0 || !this.pendingCommits;
+            if (this.loading) {
+                return (h("div", { class: "tabular-grid" }, h("gx-ide-loader", { loaderTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").objectsLoader.title, description: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").objectsLoader.description, show: true })));
+            }
+            return (h("ch-tabular-grid", {
+                // pending commits grid render
+                class: {
+                    "tabular-grid": true,
+                    "tabular-grid--empty": tabularGridEmpty
+                }, rowSelectionMode: "multiple", ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, el, "f")), allowColumnReorder: false, part: "ch-grid-pending-commits", onRowContextMenu: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_objectsOnContextMenuCallbackHandler, "f").call(this, "commit"), onSelectionChanged: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_gridOnSelectionChangedCallbackHandler, "f").call(this, "commit")
+            }, this.commitingObjects && (h("gx-ide-loader", { loaderTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.title, description: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").loader.description, show: true })), __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderTabularGridColumnSet, "f").call(this, withCheckboxes), this.pendingCommits.length > 0 ? (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, this.pendingCommits.map((obj) => (h("ch-tabular-grid-row", { rowid: obj.id, class: "tabular-grid-row" }, h("ch-tabular-grid-cell", { "cell-type": "rich", "row-selector": true, class: "tabular-grid-cell" }), __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderTabularGridCommonCells, "f").call(this, obj)))))) : (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, h("ch-tabular-grid-rowset-empty", null, h("gx-ide-empty-state", { stateIconSrc: FILTER_ICON_EMPTY, stateTitle: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").emptyPendingCommitsObjects, isAnimated: true }))))));
+        });
+        _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes.set(this, async (addedRowsIds, removedRowsId) => {
+            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f")) {
+                for (const rowId of addedRowsIds) {
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").markRow(rowId, false);
+                }
+                for (const rowId of removedRowsId) {
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").markRow(rowId, true);
                 }
             }
-        };
-        this.commitCallbackHandler = async () => {
-            const commitCommentEl = this.commitCommentEl.value;
-            this.chGridPendingCommitsEl
-                .getMarkedRows()
-                .then(async (pendingCommitsCheckedIds) => {
-                await this.commitCallback(pendingCommitsCheckedIds, commitCommentEl);
-                /* returns boolean*/
-            });
-        };
-        this.loadData = async () => {
-            const filtersData = {
-                pattern: this.patternEl.value,
-                changeSet: this.changeSetEl.value,
-                folder: this.foldersEl.value,
-                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 }) => {
-                this.pendingCommits = pending;
-                this.ignoredObjects = ignored;
-            });
-        };
-        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;
+        });
+        _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes.set(this, async (itemsToToggle) => {
+            if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f")) {
+                const itemsToCheck = itemsToToggle.itemsToCheck;
+                const itemsToUncheck = itemsToToggle.itemsToUncheck;
+                // check
+                for (const rowId of itemsToCheck) {
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").markRow(rowId, true);
+                }
+                // uncheck
+                for (const rowId of itemsToUncheck) {
+                    await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").markRow(rowId, false);
+                }
             }
-            else {
-                this.filterHasConditions = false;
+        });
+        _GxIdeTeamDevCommit_updateTabModel.set(this, () => {
+            __classPrivateFieldSet(this, _GxIdeTeamDevCommit_commitsTabModel, [
+                {
+                    id: "pending-commits",
+                    name: `${__classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").tabs.pendingCommits} (${this.pendingCommits.length})`
+                },
+                {
+                    id: "ignored-objects",
+                    name: `${__classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").tabs.ignoredObjects} (${this.ignoredObjects.length})`
+                }
+            ], "f");
+        });
+        _GxIdeTeamDevCommit_commentInputHandler.set(this, async (event) => {
+            const comment = event.detail;
+            if (comment.length && this.commentInputHasError) {
+                // remove error style and tooltip
+                this.commentInputHasError = false;
             }
-        };
-        this.filtersHidden = true;
+        });
+        _GxIdeTeamDevCommit_toggleFiltersHandler.set(this, () => {
+            this.filtersHidden = !this.filtersHidden;
+        });
+        _GxIdeTeamDevCommit_onTabActivated.set(this, (evt) => {
+            evt.stopImmediatePropagation();
+        });
         this.comment = "";
-        this.pendingCommits = [];
-        this.ignoredObjects = [];
-        this.commitButtonEnabled = false;
         this.filterHasConditions = false;
-        this.displayTitle = false;
+        this.ignoredObjects = [];
+        this.pendingCommits = [];
+        this.commentInputHasError = false;
+        this.commitingObjects = false;
+        this.filtersHidden = true;
+        this.folderOptionsModel = undefined;
+        this.typeOptionsModel = undefined;
+        this.changeSetOptionsModel = undefined;
+        this.categoryOptionsModel = undefined;
+        this.loading = true;
+        this.categories = undefined;
         this.changeSet = undefined;
-        this.types = undefined;
+        this.commitCallback = undefined;
         this.folders = undefined;
-        this.categories = undefined;
         this.getRecentCommentCallback = undefined;
         this.loadCallback = undefined;
-        this.commitCallback = undefined;
-        this.selectCallback = undefined;
-        this.pendingItemsCheckedCallback = undefined;
         this.objectsContextMenuCallback = undefined;
+        this.pendingItemsCheckedCallback = undefined;
+        this.selectCallback = undefined;
+        this.types = undefined;
     }
-    // 6.COMPONENT LIFECYCLE METHODS //
-    async componentWillLoad() {
-        this._componentLocale = await Locale.getComponentStrings(this.el);
+    categoriesChangedHandler(newCategoriesOptions) {
+        mapGxOptionsToComboBoxItemModel(newCategoriesOptions);
+    }
+    changeSetChangedHandler(newChangeSetOptions) {
+        this.changeSetOptionsModel =
+            mapGxOptionsToComboBoxItemModel(newChangeSetOptions);
+    }
+    foldersChangedHandler(newFolderOptions) {
+        this.folderOptionsModel = mapGxOptionsToComboBoxItemModel(newFolderOptions);
+    }
+    typesChangedHandler(newTypesOptions) {
+        this.typeOptionsModel = mapObjectTypeToComboBoxItemModel(newTypesOptions);
     }
     async componentDidLoad() {
-        await this.loadData();
-        this.loadDataCalledFirstTime = true;
+        await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f").call(this);
+        __classPrivateFieldSet(this, _GxIdeTeamDevCommit_loadDataCalledFirstTime, true, "f");
         this.componentDidLoadEvent.emit(true);
-        this.conditionToCommit();
-        this.commitCommentEl.focus();
+        __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCommentEl, "f").focus();
     }
     async componentDidRender() {
-        if (!this.renderedFirstTime) {
-            this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
-            this.renderedFirstTime = true;
+        if (!__classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderedFirstTime, "f")) {
+            this.componentDidRenderFirstTime.emit(__classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").componentName);
+            __classPrivateFieldSet(this, _GxIdeTeamDevCommit_renderedFirstTime, true, "f");
         }
-        if (this.loadDataCalledFirstTime) {
+        if (__classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadDataCalledFirstTime, "f")) {
             // call this method only once
-            await this.markAllPendingCommitsRows();
+            await __classPrivateFieldGet(this, _GxIdeTeamDevCommit_markAllPendingCommitsRows, "f").call(this);
             // attach "rowMarkingChanged" after rows have been checked for the first time.
-            this.chGridPendingCommitsEl.addEventListener("rowMarkingChanged", this.pendingCommitsRowMarkingChangedHandler);
-            this.loadDataCalledFirstTime = false;
+            __classPrivateFieldGet(this, _GxIdeTeamDevCommit_chGridPendingCommitsEl, "f").addEventListener("rowMarkingChanged", __classPrivateFieldGet(this, _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler, "f"));
+            __classPrivateFieldSet(this, _GxIdeTeamDevCommit_loadDataCalledFirstTime, false, "f");
         }
     }
-    // 7.LISTENERS //
-    // 8.PUBLIC METHODS API //
+    async componentWillLoad() {
+        __classPrivateFieldSet(this, _GxIdeTeamDevCommit_componentLocale, await Locale.getComponentStrings(this.el), "f");
+        __classPrivateFieldGet(this, _GxIdeTeamDevCommit_initializeComboBoxModels, "f").call(this);
+    }
     /**
-     * The method used by the Host to instruct the component to force a data refresh in the grids.
+     * Method used by the Host to force a data refresh in the grids
      */
     async reload() {
-        this.loadData();
+        __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f").call(this);
     }
-    // 10.RENDER() FUNCTION //
     render() {
-        return (h(Host, { class: "gx-ide-component" }, h("ch-theme", { model: CSS_BUNDLES }), h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { noContentPadding: true, noHeadingPadding: true, headingPaddingTop: true, containerTitle: this.displayTitle ? this._componentLocale.componentName : null, 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: "90px", 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)))));
+        const filterIcon = this.filterHasConditions
+            ? FILTER_WITH_CONDITIONS_ICON
+            : FILTER_ICON;
+        return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "section" }, h("header", { class: "header spacing-body" }, h("div", { class: "header__first-row field-group" }, h("div", { class: "buttons-spacer" }, h("div", {
+            // pattern
+            class: "field field-inline field-comment"
+        }, h("label", { class: "label", htmlFor: "pattern-form-text" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.commentLabel), h("ch-edit", {
+            // commit comment
+            id: "comment", class: {
+                "input": true,
+                "commit-input": true,
+                "scrollable": true,
+                "input-error": this.commentInputHasError
+            }, placeholder: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.commentPlaceholder, onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commentInputHandler, "f"), value: this.comment, ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_commitCommentEl, el, "f")), part: "comment"
+        })), h("button", { id: "filter-toggle-button", class: "button-teritary button-icon-only", "aria-label": __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.filterAriaLabel, "aria-expanded": this.filtersHidden ? "false" : "true", "aria-controls": "filters-container", onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_toggleFiltersHandler, "f"), title: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.filterAriaLabel }, h("ch-image", { class: "icon-md", src: filterIcon })), h("button", { class: "button-teritary button-icon-only", "aria-label": __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.reloadAriaLabel, title: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.reloadAriaLabel, onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.reloadAriaLabel }, h("ch-image", { class: "icon-md", src: RESET_ICON }))), this.commentInputHasError && (h("ch-tooltip", { class: "tooltip", actionElement: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCommentEl, "f"), blockAlign: "outside-end", inlineAlign: config.tooltipSettings.inlineAlign, delay: config.tooltipSettings.delay }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.commentEmptyError)), h("div", { class: "buttons-spacer" }, h("button", { type: "button", class: "button-secondary recent-comments-btn", part: "button button-location", onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_getRecentCommentHandler, "f"), "aria-label": __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.recentCommentsButton, disabled: this.commitingObjects }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").header.recentCommentsButton))), h("div", { id: "filters-container", "aria-labelledby": "filter-toggle-button", class: {
+                "filters-container-visible": !this.filtersHidden,
+                "filters-container": true
+            }, inert: this.filtersHidden, hidden: this.filtersHidden }, h("div", null, h("div", { slot: "filter", class: "filter field-group" }, h("div", {
+            // pattern
+            class: "field field-block field-pattern"
+        }, h("label", { class: "label", htmlFor: "pattern-form-text" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filtersMenu.patternLabel), h("ch-edit", { id: "pattern-form-text", class: "input", value: "", ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_patternEl, el, "f")), debounce: config.inputDebounce, onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: "pattern-form-text" })), h("div", {
+            // folder
+            class: "field field-block field-folder"
+        }, h("label", { class: "label", htmlFor: "folder-combo" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filtersMenu.folderLabel), h("ch-combo-box-render", { id: "folder-combo", class: "combo-box", value: this.folders[0].id, model: this.folderOptionsModel, ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_foldersEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: "folder-combo" })), h("div", {
+            // type
+            class: "field field-block field-type"
+        }, h("label", { class: "label", htmlFor: "type-combo" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filtersMenu.typeLabel), h("ch-combo-box-render", { id: "type-combo", class: "combo-box", value: this.types[0].id, model: this.typeOptionsModel, ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_typesEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: "type-combo" })), h("div", {
+            // changeset
+            class: "field field-block field-changeset"
+        }, h("label", { class: "label", htmlFor: "changeset-combo" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filtersMenu.changesetLabel), h("ch-combo-box-render", { id: "changeset-combo", class: "combo-box", value: this.changeSet[0].id, model: this.changeSetOptionsModel, ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_changeSetEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: "changeset-combo" })), h("div", {
+            // category
+            class: "field field-block field-category"
+        }, h("label", { class: "label", htmlFor: "category-combo" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").filtersMenu.categoryLabel), h("ch-combo-box-render", { id: "category-combo", class: "combo-box", value: this.categories[0].id, model: this.categoryOptionsModel, ref: (el) => (__classPrivateFieldSet(this, _GxIdeTeamDevCommit_categoriesEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_loadData, "f"), part: "category-combo" })))))), h("ch-tab-render", { class: "tab scrollable", tabListPosition: "block-start", model: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitsTabModel, "f"), selectedId: "pending-commits", showTabListEnd: true, overflow: "auto auto", contain: "size", onSelectedItemChange: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_onTabActivated, "f") }, h("div", { class: "ch-tab-slot", slot: "pending-commits", part: "pending-commits" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderPendingCommitsGrid, "f").call(this)), h("div", { class: "ch-tab-slot", slot: "ignored-objects", part: "ignored-objects" }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_renderIgnoredObjectsGrid, "f").call(this))), h("footer", { class: "control-footer control-footer-with-border spacing-body-inline spacing-body-block-end" }, h("button", { class: "button-primary", onClick: __classPrivateFieldGet(this, _GxIdeTeamDevCommit_commitCallbackHandler, "f"), part: "commit-button", disabled: this.commitingObjects }, __classPrivateFieldGet(this, _GxIdeTeamDevCommit_componentLocale, "f").footer.commitButton)))));
     }
     static get is() { return "gx-ide-team-dev-commit"; }
     static get encapsulation() { return "shadow"; }
@@ -253,25 +405,7 @@ export class GxIdeTeamDevCommit {
     static get assetsDirs() { return ["gx-ide-assets/team-dev-commit"]; }
     static get properties() {
         return {
-            "displayTitle": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "false",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "If true it displays the component title on the header"
-                },
-                "attribute": "display-title",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "changeSet": {
+            "categories": {
                 "type": "unknown",
                 "mutable": false,
                 "complexType": {
@@ -289,20 +423,20 @@ export class GxIdeTeamDevCommit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Possible values for ChangeSet filter"
+                    "text": "Possible values for Categories filter"
                 }
             },
-            "types": {
+            "changeSet": {
                 "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "ObjectType[]",
-                    "resolved": "ObjectType[]",
+                    "original": "GxOption[]",
+                    "resolved": "GxOption[]",
                     "references": {
-                        "ObjectType": {
+                        "GxOption": {
                             "location": "import",
                             "path": "../../../common/types",
-                            "id": "src/common/types.ts::ObjectType"
+                            "id": "src/common/types.ts::GxOption"
                         }
                     }
                 },
@@ -310,20 +444,20 @@ export class GxIdeTeamDevCommit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Possible values for Type filter"
+                    "text": "Possible values for ChangeSet filter"
                 }
             },
-            "folders": {
+            "commitCallback": {
                 "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "GxOption[]",
-                    "resolved": "GxOption[]",
+                    "original": "CommitCallback",
+                    "resolved": "(selection: string[], commitCommentEl: string) => Promise<boolean>",
                     "references": {
-                        "GxOption": {
-                            "location": "import",
-                            "path": "../../../common/types",
-                            "id": "src/common/types.ts::GxOption"
+                        "CommitCallback": {
+                            "location": "local",
+                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/team-dev/commit/commit.tsx",
+                            "id": "src/components/team-dev/commit/commit.tsx::CommitCallback"
                         }
                     }
                 },
@@ -331,10 +465,10 @@ export class GxIdeTeamDevCommit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Possible values for Folders filter"
+                    "text": "Callback invoked when user starts the commit process"
                 }
             },
-            "categories": {
+            "folders": {
                 "type": "unknown",
                 "mutable": false,
                 "complexType": {
@@ -352,7 +486,7 @@ export class GxIdeTeamDevCommit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Possible values for Categories filter"
+                    "text": "Possible values for Folders filter"
                 }
             },
             "getRecentCommentCallback": {
@@ -397,17 +531,17 @@ export class GxIdeTeamDevCommit {
                     "text": "Callback invoked when user wants to reload the grid"
                 }
             },
-            "commitCallback": {
+            "objectsContextMenuCallback": {
                 "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "CommitCallback",
-                    "resolved": "(selection: string[], commitCommentEl: string) => Promise<boolean>",
+                    "original": "ObjectsContextMenuCallback",
+                    "resolved": "(grid: CommitSourceType, contextMenuInfo: ContextMenuInfo) => Promise<void>",
                     "references": {
-                        "CommitCallback": {
+                        "ObjectsContextMenuCallback": {
                             "location": "local",
                             "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/team-dev/commit/commit.tsx",
-                            "id": "src/components/team-dev/commit/commit.tsx::CommitCallback"
+                            "id": "src/components/team-dev/commit/commit.tsx::ObjectsContextMenuCallback"
                         }
                     }
                 },
@@ -415,62 +549,62 @@ export class GxIdeTeamDevCommit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Callback invoked when user starts the commit process"
+                    "text": "Callback invoked when the user activates the context menu in any grid"
                 }
             },
-            "selectCallback": {
+            "pendingItemsCheckedCallback": {
                 "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "CommitSelectCallback",
-                    "resolved": "(grid: CommitSourceType, selectionIds: string[]) => Promise<void>",
+                    "original": "PendingItemsCheckedCallback",
+                    "resolved": "(pendingItemsCheckedState: ItemsCheckedState) => Promise<ItemsCheckedResult>",
                     "references": {
-                        "CommitSelectCallback": {
+                        "PendingItemsCheckedCallback": {
                             "location": "local",
                             "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/team-dev/commit/commit.tsx",
-                            "id": "src/components/team-dev/commit/commit.tsx::CommitSelectCallback"
+                            "id": "src/components/team-dev/commit/commit.tsx::PendingItemsCheckedCallback"
                         }
                     }
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Callback that should be invoked when the user selects rows from the grids"
+                    "text": "Callback invoked when user check/uncheck any item from the 'Pending to Commit' grid"
                 }
             },
-            "pendingItemsCheckedCallback": {
+            "selectCallback": {
                 "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "PendingItemsCheckedCallback",
-                    "resolved": "(pendingItemsCheckedState: ItemsCheckedState) => Promise<ItemsCheckedResult>",
+                    "original": "CommitSelectCallback",
+                    "resolved": "(grid: CommitSourceType, selectionIds: string[]) => Promise<void>",
                     "references": {
-                        "PendingItemsCheckedCallback": {
+                        "CommitSelectCallback": {
                             "location": "local",
                             "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/team-dev/commit/commit.tsx",
-                            "id": "src/components/team-dev/commit/commit.tsx::PendingItemsCheckedCallback"
+                            "id": "src/components/team-dev/commit/commit.tsx::CommitSelectCallback"
                         }
                     }
                 },
-                "required": true,
+                "required": false,
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Callback invoked when user check/uncheck any item from the 'Pending to Commit' grid"
+                    "text": "Callback invoked when the user selects rows from the grid"
                 }
             },
-            "objectsContextMenuCallback": {
+            "types": {
                 "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "ObjectsContextMenuCallback",
-                    "resolved": "(grid: CommitSourceType, contextMenuInfo: ContextMenuInfo) => Promise<void>",
+                    "original": "ObjectType[]",
+                    "resolved": "ObjectType[]",
                     "references": {
-                        "ObjectsContextMenuCallback": {
-                            "location": "local",
-                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/team-dev/commit/commit.tsx",
-                            "id": "src/components/team-dev/commit/commit.tsx::ObjectsContextMenuCallback"
+                        "ObjectType": {
+                            "location": "import",
+                            "path": "../../../common/types",
+                            "id": "src/common/types.ts::ObjectType"
                         }
                     }
                 },
@@ -478,31 +612,37 @@ export class GxIdeTeamDevCommit {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Callback that must be invoked when user activate the context menu in any of the grids"
+                    "text": "Possible values for Type filter"
                 }
             }
         };
     }
     static get states() {
         return {
-            "filtersHidden": {},
             "comment": {},
-            "pendingCommits": {},
+            "filterHasConditions": {},
             "ignoredObjects": {},
-            "commitButtonEnabled": {},
-            "filterHasConditions": {}
+            "pendingCommits": {},
+            "commentInputHasError": {},
+            "commitingObjects": {},
+            "filtersHidden": {},
+            "folderOptionsModel": {},
+            "typeOptionsModel": {},
+            "changeSetOptionsModel": {},
+            "categoryOptionsModel": {},
+            "loading": {}
         };
     }
     static get events() {
         return [{
-                "method": "componentDidRenderFirstTime",
-                "name": "componentDidRenderFirstTime",
+                "method": "componentDidLoadEvent",
+                "name": "componentDidLoadEvent",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "This event is emitted once just after the component is fully loaded and the first render() occurs"
+                    "text": "Emitted once after the component fully loads and the first render occurs"
                 },
                 "complexType": {
                     "original": "boolean",
@@ -510,14 +650,14 @@ export class GxIdeTeamDevCommit {
                     "references": {}
                 }
             }, {
-                "method": "componentDidLoadEvent",
-                "name": "componentDidLoadEvent",
+                "method": "componentDidRenderFirstTime",
+                "name": "componentDidRenderFirstTime",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "This event is emitted once just after the component is fully loaded and the first render() occurs."
+                    "text": "This event is emitted once just after the component is fully loaded and the first render() occurs"
                 },
                 "complexType": {
                     "original": "boolean",
@@ -541,12 +681,28 @@ export class GxIdeTeamDevCommit {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "The method used by the Host to instruct the component to force a data refresh in the grids.",
+                    "text": "Method used by the Host to force a data refresh in the grids",
                     "tags": []
                 }
             }
         };
     }
     static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "categories",
+                "methodName": "categoriesChangedHandler"
+            }, {
+                "propName": "changeSet",
+                "methodName": "changeSetChangedHandler"
+            }, {
+                "propName": "folders",
+                "methodName": "foldersChangedHandler"
+            }, {
+                "propName": "types",
+                "methodName": "typesChangedHandler"
+            }];
+    }
 }
+_GxIdeTeamDevCommit_componentLocale = new WeakMap(), _GxIdeTeamDevCommit_loadDataCalledFirstTime = new WeakMap(), _GxIdeTeamDevCommit_renderedFirstTime = new WeakMap(), _GxIdeTeamDevCommit_commitsTabModel = new WeakMap(), _GxIdeTeamDevCommit_categoriesEl = new WeakMap(), _GxIdeTeamDevCommit_changeSetEl = new WeakMap(), _GxIdeTeamDevCommit_commitCommentEl = new WeakMap(), _GxIdeTeamDevCommit_foldersEl = new WeakMap(), _GxIdeTeamDevCommit_patternEl = new WeakMap(), _GxIdeTeamDevCommit_typesEl = new WeakMap(), _GxIdeTeamDevCommit_chGridIgnoredObjectsEl = new WeakMap(), _GxIdeTeamDevCommit_chGridPendingCommitsEl = new WeakMap(), _GxIdeTeamDevCommit_initializeComboBoxModels = new WeakMap(), _GxIdeTeamDevCommit_commitCallbackHandler = new WeakMap(), _GxIdeTeamDevCommit_evaluateFilterConditions = new WeakMap(), _GxIdeTeamDevCommit_getRecentCommentHandler = new WeakMap(), _GxIdeTeamDevCommit_gridOnSelectionChangedCallbackHandler = new WeakMap(), _GxIdeTeamDevCommit_handleColumnSortChanged = new WeakMap(), _GxIdeTeamDevCommit_loadData = new WeakMap(), _GxIdeTeamDevCommit_markAllPendingCommitsRows = new WeakMap(), _GxIdeTeamDevCommit_objectsOnContextMenuCallbackHandler = new WeakMap(), _GxIdeTeamDevCommit_pendingCommitsRowMarkingChangedHandler = new WeakMap(), _GxIdeTeamDevCommit_renderTabularGridColumnSet = new WeakMap(), _GxIdeTeamDevCommit_renderTabularGridCommonCells = new WeakMap(), _GxIdeTeamDevCommit_renderIgnoredObjectsGrid = new WeakMap(), _GxIdeTeamDevCommit_renderPendingCommitsGrid = new WeakMap(), _GxIdeTeamDevCommit_revertPendingCommitsCheckboxes = new WeakMap(), _GxIdeTeamDevCommit_togglePendingCommitsCheckboxes = new WeakMap(), _GxIdeTeamDevCommit_updateTabModel = new WeakMap(), _GxIdeTeamDevCommit_commentInputHandler = new WeakMap(), _GxIdeTeamDevCommit_toggleFiltersHandler = new WeakMap(), _GxIdeTeamDevCommit_onTabActivated = new WeakMap();
 //# sourceMappingURL=commit.js.map