@genexus/genexus-ide-ui 1.1.23 → 1.1.25

package/dist/components/gx-ide-ww-files.js

@@ -1,7 +1,11 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { h, proxyCustomElement, HTMLElement, Host } from '@stencil/core/internal/client';
+import { g as getIconPath } from './MERCURY_ASSETS.js';
 import { L as Locale } from './locale.js';
 import { c as config } from './config.js';
-import { d as defineCustomElement$2 } from './entity-selector.js';
+import { f as formatDate } from './helpers.js';
+import { d as defineCustomElement$4 } from './gx-ide-empty-state2.js';
+import { d as defineCustomElement$3 } from './entity-selector.js';
+import { d as defineCustomElement$2 } from './ide-loader.js';
 
 const mapOptionsToComboBoxItemModel = (options) => {
     return options.map(option => {
@@ -13,16 +17,20 @@ const mapOptionsToComboBoxItemModel = (options) => {
         };
     });
 };
+const escapeRegExp = (string) => {
+    return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+};
+const hiChar = (text, search) => {
+    if (!search) {
+        return text;
+    }
+    const escapedSearch = escapeRegExp(search);
+    const parts = text.split(new RegExp(`(${escapedSearch})`, "gi"));
+    return parts.map((part, i) => part.toLowerCase() === search.toLowerCase() ? (h("span", { key: i, class: "hiChar" }, part)) : (part));
+};
 
-const wwFilesCss = "/*Gx Ide*/\n/*@container queries*/\n/* hiChar styles\nFound on /common/helpers.tsx hiChar function is used to add a span/class to every character that matches a search value. It is used to help the user see why the filter results are filtered. The span/class on the characters are useless without proper styling.\n*/\n:host {\n  container-type: inline-size;\n  display: grid;\n  block-size: 100%;\n  overflow: auto;\n  grid-template-rows: max-content 1fr max-content;\n}\n\n.hide {\n  display: none !important;\n}\n\n.section {\n  display: contents;\n}\n\n.header {\n  grid-template-areas: \"name module-folder\" \"advanced-filter-accordion advanced-filter-accordion\";\n  grid-template-columns: 1fr 1fr;\n  grid-auto-rows: max-content max-content;\n}\n\n.name {\n  grid-area: name;\n}\n\n.module-folder {\n  grid-area: module-folder;\n}\n\n.advanced-filter-accordion {\n  grid-area: advanced-filter-accordion;\n}\n\n.main {\n  display: grid;\n  grid-template-columns: 1fr auto;\n  gap: var(--mer-spacing--md);\n  overflow: auto;\n  padding-block-start: var(--mer-spacing--md);\n}\n\n.main__grid {\n  display: grid;\n  grid-template-rows: max-content 1fr;\n  gap: var(--mer-spacing--md);\n  overflow: auto;\n}\n\n.main__filter {\n  display: grid;\n  grid-auto-rows: max-content;\n  gap: var(--mer-spacing--sm);\n  overflow: auto;\n}\n\n.search-content {\n  inline-size: 100%;\n}\n\n.filter-row {\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  gap: var(--mer-spacing--md);\n}\n\n.category-column {\n  grid-column: 1;\n}\n\n.checkboxes-column {\n  grid-column: 2;\n  display: flex;\n  flex-direction: row;\n  gap: var(--mer-spacing--md);\n  align-items: center;\n  min-block-size: 100%;\n  justify-content: flex-start;\n  padding-block-start: 1.75rem;\n}\n\n.modified-inputs {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: var(--mer-spacing--md);\n  margin-block-start: var(--mer-spacing--sm);\n}\n.modified-inputs .field {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mer-spacing--sm);\n}\n.modified-inputs .field.hide {\n  display: none;\n}\n.modified-inputs .field .input,\n.modified-inputs .field .combo-box {\n  width: 100%;\n}\n\n.tabular-grid-ww-files {\n  overflow: auto;\n  inline-size: 100%;\n  border-inline-end: var(--section-common-border);\n}\n\n.main__files-container {\n  display: grid;\n  grid-template-columns: repeat(4, 1fr);\n  gap: var(--mer-spacing--xs);\n  position: relative;\n  z-index: 1;\n}\n\n.hiChar {\n  color: var(--mer-color__primary--200);\n  filter: brightness(1.3);\n}\n\n.tabular-grid-ww-files ch-tabular-grid-cell:is(:nth-child(4)) {\n  padding-block: var(--grid-cell__padding-block);\n  padding-inline: var(--grid-cell__padding-inline);\n  align-items: start;\n  justify-content: start;\n  display: inline-block;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  min-inline-size: 0;\n}\n@container (max-width: 992px) {\n  .main__files-container {\n    grid-template-columns: repeat(3, 1fr);\n  }\n}";
+const wwFilesCss = ":host{container-type:inline-size;display:grid;block-size:100%;overflow:auto;grid-template-rows:max-content 1fr max-content}.section{display:contents}.header{grid-template-areas:\"name module-folder\" \"advanced-filter advanced-filter\";grid-template-columns:1fr 1fr;grid-auto-rows:max-content max-content}.name{grid-area:name}.module-folder{grid-area:module-folder}.advanced-filter{grid-area:advanced-filter}.advanced-filter__container{display:grid;grid-auto-rows:max-content}.advanced-filter__first-row{grid-template-columns:1fr 1fr}.advanced-filter__second-row{grid-template-columns:1fr 1fr 1fr}.advanced-filter .all-descendants__modified{display:flex;flex-direction:row;align-items:center;block-size:32px;gap:16px;align-self:self-end}.field-date{grid-template-areas:\"label-date-time label-date-time\" \"input-date-time icon-clear-date-time\";grid-template-columns:1fr max-content;column-gap:var(--mer-spacing--2xs)}.label-date-time{display:flex;align-items:center;gap:6px;grid-area:label-date-time}.label-date-time .icon-md{--mer-icon__box--md:16.8px}.input-date-time{block-size:31.98px;grid-area:input-date-time}.icon-clear-date-time{grid-area:icon-clear-date-time}.tabular-grid{overflow:auto;inline-size:100%;border-inline-end:var(--section-common-border)}.tabular-grid.empty::part(main),.tabular-grid.loading::part(main){overflow:hidden}ch-tabular-grid-rowset-empty{position:relative}.main__files-container{display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--mer-spacing--xs);position:relative;z-index:1}.hiChar{color:var(--mer-color__primary--200);filter:brightness(1.3)}.tabular-grid ch-tabular-grid-cell:is(:nth-child(4)){padding-block:var(--grid-cell__padding-block);padding-inline:var(--grid-cell__padding-inline);align-items:start;justify-content:start;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-inline-size:0}.tabular-grid-cell-description{min-inline-size:max-content !important}.hiChar{color:var(--mer-color__primary--200);filter:brightness(1.3)}";
 
-var __classPrivateFieldGet = (undefined && undefined.__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 = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
     if (kind === "m")
         throw new TypeError("Private method is not writable");
@@ -32,7 +40,14 @@ var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) ||
         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 _GxIdeWWFiles_componentLocale, _GxIdeWWFiles_ACCORDION_FILTER_ID, _GxIdeWWFiles_ACCORDION_MODEL, _GxIdeWWFiles_chGridEl, _GxIdeWWFiles_filterAfterTypeEl, _GxIdeWWFiles_filterAllDescendantsEl, _GxIdeWWFiles_filterCategoryEl, _GxIdeWWFiles_filterModifiedDateEl, _GxIdeWWFiles_filterModuleEl, _GxIdeWWFiles_filterModifiedEl, _GxIdeWWFiles_filterNameEl, _GxIdeWWFiles_filterSearchContentsEl, _GxIdeWWFiles_filterUserEl, _GxIdeWWFiles_renderHeader, _GxIdeWWFiles_renderObjects, _GxIdeWWFiles_hiChar, _GxIdeWWFiles_formatDate, _GxIdeWWFiles_getObjects, _GxIdeWWFiles_filterFiles, _GxIdeWWFiles_handleFilterInput, _GxIdeWWFiles_handleSearchContentsInput, _GxIdeWWFiles_deleteSelectionCallbackHandle, _GxIdeWWFiles_deselectAll, _GxIdeWWFiles_expandedHandler, _GxIdeWWFiles_filterModifiedCallbackHandle, _GxIdeWWFiles_filterAfterTypeCallbackHandle, _GxIdeWWFiles_listenChanges, _GxIdeWWFiles_newFileCallbackHandle, _GxIdeWWFiles_openSelectionCallbackHandle, _GxIdeWWFiles_selectAll;
+var __classPrivateFieldGet = (undefined && undefined.__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 _GxIdeWWFiles_componentLocale, _GxIdeWWFiles_ACCORDION_MODEL, _GxIdeWWFiles_nameValue, _GxIdeWWFiles_moduleValue, _GxIdeWWFiles_searchContentsValue, _GxIdeWWFiles_categoryValue, _GxIdeWWFiles_allDescendants, _GxIdeWWFiles_userValue, _GxIdeWWFiles_selectedObjectsIds, _GxIdeWWFiles_chGridEl, _GxIdeWWFiles_filterModuleEl, _GxIdeWWFiles_setFilterDefaultValues, _GxIdeWWFiles_allDescendantsCheckboxHandler, _GxIdeWWFiles_attachGridListeners, _GxIdeWWFiles_categoryInputHandler, _GxIdeWWFiles_clearDateTimeValue, _GxIdeWWFiles_dateTimeInputHandler, _GxIdeWWFiles_deleteSelectionCallbackHandler, _GxIdeWWFiles_deselectAll, _GxIdeWWFiles_evaluateModifiedDates, _GxIdeWWFiles_filterAfterTypeCallbackHandler, _GxIdeWWFiles_formatDate, _GxIdeWWFiles_getObjects, _GxIdeWWFiles_renderHeader, _GxIdeWWFiles_renderObjects, _GxIdeWWFiles_moduleValueChangedHandler, _GxIdeWWFiles_nameInputHandler, _GxIdeWWFiles_newFileCallbackHandler, _GxIdeWWFiles_openSelectionCallbackHandler, _GxIdeWWFiles_searchContentsInputHandler, _GxIdeWWFiles_setLoadingState, _GxIdeWWFiles_userInputHandler, _GxIdeWWFiles_showModifiedCheckboxHandler, _GxIdeWWFiles_selectAll;
 const CSS_BUNDLES = [
     "resets/box-sizing",
     "components/button",
@@ -40,239 +55,268 @@ const CSS_BUNDLES = [
     "components/combo-box",
     "components/accordion",
     "components/edit",
+    "components/icon",
+    "components/tooltip",
     "components/tabular-grid",
     "utils/form",
     "utils/layout",
     "utils/typography",
     "utils/spacing"
 ];
+const CLEAR_ICON = getIconPath({
+    category: "system",
+    name: "close",
+    colorType: "neutral"
+});
+const FILTER_ICON = getIconPath({
+    category: "window-tools",
+    name: "filter",
+    colorType: "on-elevation"
+});
+const INFO_ICON = getIconPath({
+    category: "system",
+    name: "information",
+    colorType: "on-elevation"
+});
+const ACCORDION_FILTER_ID = "advanced-filter";
 const FILTER_AFTER_DATE_TIME = "afterDateTime";
 const FILTER_AFTER_LAST_BUILD = "afterLastBuild";
 const FILTER_AFTER_IMPORT = "afterImport";
+const CHECKBOX_CHECKED_VALUE = "checked";
+const CHECKBOX_UNCHECKED_VALUE = "unchecked";
 const GxIdeWWFiles = /*@__PURE__*/ proxyCustomElement(class GxIdeWWFiles extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
-        this.componentDidLoadEvent = createEvent(this, "componentDidLoadEvent", 7);
         _GxIdeWWFiles_componentLocale.set(this, void 0);
-        _GxIdeWWFiles_ACCORDION_FILTER_ID.set(this, "advanced-filter");
         _GxIdeWWFiles_ACCORDION_MODEL.set(this, []);
+        // Filter Values
+        _GxIdeWWFiles_nameValue.set(this, void 0);
+        _GxIdeWWFiles_moduleValue.set(this, void 0);
+        // Advanced Filter Values
+        _GxIdeWWFiles_searchContentsValue.set(this, void 0);
+        _GxIdeWWFiles_categoryValue.set(this, void 0);
+        _GxIdeWWFiles_allDescendants.set(this, void 0);
+        _GxIdeWWFiles_userValue.set(this, void 0);
+        // Other
+        _GxIdeWWFiles_selectedObjectsIds.set(this, []);
         _GxIdeWWFiles_chGridEl.set(this, void 0);
-        _GxIdeWWFiles_filterAfterTypeEl.set(this, void 0);
-        _GxIdeWWFiles_filterAllDescendantsEl.set(this, void 0);
-        _GxIdeWWFiles_filterCategoryEl.set(this, void 0);
-        _GxIdeWWFiles_filterModifiedDateEl.set(this, void 0);
         _GxIdeWWFiles_filterModuleEl.set(this, void 0);
-        _GxIdeWWFiles_filterModifiedEl.set(this, void 0);
-        _GxIdeWWFiles_filterNameEl.set(this, void 0);
-        _GxIdeWWFiles_filterSearchContentsEl.set(this, void 0);
-        _GxIdeWWFiles_filterUserEl.set(this, void 0);
-        _GxIdeWWFiles_renderHeader.set(this, () => {
-            return [
-                h("div", { class: "field field-block name" }, h("label", { class: "label", htmlFor: "filter-files" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.name), h("ch-edit", { id: "filter-files", class: "input", ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_filterNameEl, el, "f")), value: this.filterFilesInputValue, onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_handleFilterInput, "f"), part: "filter-files" })),
-                h("div", { class: "field field-block module-folder" }, h("label", { class: "label", htmlFor: "module-folder" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.moduleFolder), h("gx-ide-entity-selector", { part: "filter-module-folder", id: "module/folder", labelPosition: "none", value: this.defaultModule, defaultValue: this.defaultModule, selectEntityCallback: this.selectModuleCallback, ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_filterModuleEl, el, "f")) })),
-                h("ch-accordion-render", { class: "accordion-outlined advanced-filter-accordion", model: __classPrivateFieldGet(this, _GxIdeWWFiles_ACCORDION_MODEL, "f"), onExpandedChange: __classPrivateFieldGet(this, _GxIdeWWFiles_expandedHandler, "f") }, h("div", { slot: __classPrivateFieldGet(this, _GxIdeWWFiles_ACCORDION_FILTER_ID, "f"), class: "spacing-body" }, h("div", { class: "main__filter" }, this.showSearchContents && (h("div", { class: "search-content" }, h("div", { class: "field field-block" }, h("label", { class: "label", htmlFor: "filter-content" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.content), h("ch-edit", { id: "filter-content", class: "input", ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_filterSearchContentsEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_handleSearchContentsInput, "f"), part: "filter-content" })))), h("div", { class: "filter-row" }, h("div", { class: "category-column" }, h("div", { class: "field field-block" }, h("label", { class: "label", htmlFor: "filter-category" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.category), h("ch-combo-box-render", { id: "filter-category", class: "combo-box", value: this.defaultCategory, disabled: !this.categories, ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_filterCategoryEl, el, "f")), model: this.categoriesComboBoxModel, part: "filter-category", onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f") }))), h("div", { class: "checkboxes-column" }, h("ch-checkbox", { class: "checkbox", caption: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.allDescendants, checkedValue: "filterAllDescendants", ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_filterAllDescendantsEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f"), part: "filter-all-descendants" }), h("ch-checkbox", { class: "checkbox align-center", caption: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.modified, checkedValue: "filterModified", ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_filterModifiedEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_filterModifiedCallbackHandle, "f"), part: "filter-modified" })), h("div", { class: "empty-column" })), h("div", { class: { "modified-inputs": true, "hide": !this.filterModified } }, h("div", { class: "field field-block" }, h("label", { class: "label", htmlFor: "filter-after-type" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.after), h("ch-combo-box-render", { id: "filter-after-type", class: "combo-box", value: this.afterCurrentValue, ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_filterAfterTypeEl, el, "f")), model: this.filterAfterOptions, onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_filterAfterTypeCallbackHandle, "f"), part: "filter-after-type" })), h("div", { class: "field field-block" }, h("label", { class: "label", htmlFor: "filter-user" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.user), h("ch-edit", { id: "filter-user", class: "input", ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_filterUserEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f"), part: "filter-user" })), h("div", { class: {
-                        "field field-block": true,
-                        "hide": this.afterCurrentValue !== FILTER_AFTER_DATE_TIME
-                    } }, h("label", { class: "label", htmlFor: "filter-modified-date" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.dateTime), h("ch-edit", { id: "filter-modified-date", type: "date", class: "input", ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_filterModifiedDateEl, el, "f")), onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f"), part: "filter-modified-date" }))))))
-            ];
+        _GxIdeWWFiles_setFilterDefaultValues.set(this, () => {
+            __classPrivateFieldSet(this, _GxIdeWWFiles_nameValue, "", "f");
+            __classPrivateFieldSet(this, _GxIdeWWFiles_moduleValue, Object.assign({}, this.defaultModule), "f");
+            __classPrivateFieldSet(this, _GxIdeWWFiles_searchContentsValue, "", "f");
+            __classPrivateFieldSet(this, _GxIdeWWFiles_categoryValue, this.defaultCategory || this.categoriesComboBoxModel[0].value, "f");
+            __classPrivateFieldSet(this, _GxIdeWWFiles_allDescendants, CHECKBOX_UNCHECKED_VALUE, "f");
+            this.afterValue = this.filterAfterComboBoxModel[0].value;
+            __classPrivateFieldSet(this, _GxIdeWWFiles_userValue, "", "f");
+            this.dateTimeValue = undefined;
         });
-        _GxIdeWWFiles_renderObjects.set(this, () => {
-            return (h("div", { class: "field-group main__grid" }, h("ch-tabular-grid", { ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_chGridEl, el, "f")), class: "tabular-grid tabular-grid-ww-files", rowSelectionMode: "multiple", part: "ch-grid-files" }, h("ch-tabular-grid-columnset", { class: "tabular-grid-column-set" }, h("ch-tabular-grid-column", { columnName: "", columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" }), h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.name, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.common, class: "tabular-grid-column" }), this.showType && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.type, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.common, class: "tabular-grid-column" })), h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.module, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.common, class: "tabular-grid-column" }), this.showDescription && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.description, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.commonDouble, class: "tabular-grid-column" })), this.showModifiedDate && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.modifiedDate, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" })), this.showLastUser && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.lastUser, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" })), this.showImportDate && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.importDate, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" })), this.showLastBuildDate && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.lastBuildDate, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" }))), this.filteredFiles.length ? (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, this.filteredFiles.map((obj) => {
-                var _a;
-                return (h("ch-tabular-grid-row", { rowid: obj.id, class: "tabular-grid-row" }, h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, h("ch-image", { src: obj.icon })), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, __classPrivateFieldGet(this, _GxIdeWWFiles_hiChar, "f").call(this, obj.name.toLowerCase(), this.filterFilesInputValue)), this.showType && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, __classPrivateFieldGet(this, _GxIdeWWFiles_hiChar, "f").call(this, obj.type.toLowerCase(), this.filterFilesInputValue))), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, __classPrivateFieldGet(this, _GxIdeWWFiles_hiChar, "f").call(this, obj.module.toLowerCase(), this.filterFilesInputValue)), this.showDescription && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, __classPrivateFieldGet(this, _GxIdeWWFiles_hiChar, "f").call(this, obj.description.toLowerCase(), this.filterFilesInputValue))), this.showModifiedDate && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, __classPrivateFieldGet(this, _GxIdeWWFiles_hiChar, "f").call(this, obj.modifiedDate
-                    ? __classPrivateFieldGet(this, _GxIdeWWFiles_formatDate, "f").call(this, obj.modifiedDate)
-                    : "", this.filterFilesInputValue))), this.showLastUser && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, __classPrivateFieldGet(this, _GxIdeWWFiles_hiChar, "f").call(this, ((_a = obj.lastUser) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || "", this.filterFilesInputValue))), this.showImportDate && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, __classPrivateFieldGet(this, _GxIdeWWFiles_hiChar, "f").call(this, obj.importDate ? __classPrivateFieldGet(this, _GxIdeWWFiles_formatDate, "f").call(this, obj.importDate) : "", this.filterFilesInputValue))), this.showLastBuildDate && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, __classPrivateFieldGet(this, _GxIdeWWFiles_hiChar, "f").call(this, obj.lastBuildDate
-                    ? __classPrivateFieldGet(this, _GxIdeWWFiles_formatDate, "f").call(this, obj.lastBuildDate)
-                    : "", this.filterFilesInputValue)))));
-            }))) : null)));
-        });
-        _GxIdeWWFiles_hiChar.set(this, (text, search) => {
-            if (!search)
-                return text;
-            const parts = text.split(new RegExp(`(${search})`, "gi"));
-            return parts.map((part, i) => part.toLowerCase() === search.toLowerCase() ? (h("span", { key: i, class: "highlight" }, part)) : (part));
-        });
-        _GxIdeWWFiles_formatDate.set(this, (date) => {
-            return date.toISOString().slice(0, 10);
+        _GxIdeWWFiles_allDescendantsCheckboxHandler.set(this, (event) => {
+            __classPrivateFieldSet(this, _GxIdeWWFiles_allDescendants, event.detail === CHECKBOX_CHECKED_VALUE
+                ? CHECKBOX_CHECKED_VALUE
+                : CHECKBOX_UNCHECKED_VALUE, "f");
+            __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
         });
-        _GxIdeWWFiles_getObjects.set(this, () => {
-            var _a;
-            const filters = {
-                name: __classPrivateFieldGet(this, _GxIdeWWFiles_filterNameEl, "f").value,
-                searchContents: this.showSearchContents
-                    ? (_a = __classPrivateFieldGet(this, _GxIdeWWFiles_filterSearchContentsEl, "f")) === null || _a === void 0 ? void 0 : _a.value
-                    : null,
-                category: __classPrivateFieldGet(this, _GxIdeWWFiles_filterCategoryEl, "f").value,
-                parent: __classPrivateFieldGet(this, _GxIdeWWFiles_filterModuleEl, "f").value ? __classPrivateFieldGet(this, _GxIdeWWFiles_filterModuleEl, "f").value.id : null,
-                allDescendants: !!__classPrivateFieldGet(this, _GxIdeWWFiles_filterAllDescendantsEl, "f").value,
-                modifiedAfter: this.filterModified ? this.afterCurrentValue : null,
-                modifiedBy: this.filterModified ? __classPrivateFieldGet(this, _GxIdeWWFiles_filterUserEl, "f").value : null,
-                modifiedDate: this.filterModified && this.afterCurrentValue === FILTER_AFTER_DATE_TIME
-                    ? new Date(__classPrivateFieldGet(this, _GxIdeWWFiles_filterModifiedDateEl, "f").value)
-                    : null
-            };
-            this.loadCallback(filters).then((items) => {
-                this.objects = items;
-                __classPrivateFieldGet(this, _GxIdeWWFiles_filterFiles, "f").call(this);
-                this.selectedObjectsIds = [];
-                __classPrivateFieldGet(this, _GxIdeWWFiles_deselectAll, "f").call(this);
+        _GxIdeWWFiles_attachGridListeners.set(this, () => {
+            __classPrivateFieldGet(this, _GxIdeWWFiles_chGridEl, "f").addEventListener("selectionChanged", (ev) => {
+                __classPrivateFieldSet(this, _GxIdeWWFiles_selectedObjectsIds, ev.detail.rowsId, "f");
+                this.selectionChangeCallback(__classPrivateFieldGet(this, _GxIdeWWFiles_selectedObjectsIds, "f"));
             });
-        });
-        _GxIdeWWFiles_filterFiles.set(this, () => {
-            var _a, _b;
-            const filterValue = this.filterFilesInputValue.toLowerCase();
-            const searchContents = this.showSearchContents
-                ? ((_b = (_a = __classPrivateFieldGet(this, _GxIdeWWFiles_filterSearchContentsEl, "f")) === null || _a === void 0 ? void 0 : _a.value) === null || _b === void 0 ? void 0 : _b.toLowerCase()) || ""
-                : "";
-            this.filteredFiles = this.objects.filter(file => {
-                var _a, _b, _c, _d, _e;
-                const nameMatch = file.name.toLowerCase().includes(filterValue);
-                const typeMatch = file.type.toLowerCase().includes(filterValue);
-                const moduleMatch = file.module.toLowerCase().includes(filterValue);
-                const descriptionMatch = (_a = file.description) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(filterValue);
-                const modifiedDateMatch = (_b = file.modifiedDate) === null || _b === void 0 ? void 0 : _b.toString().includes(filterValue);
-                const lastUserMatch = (_c = file.lastUser) === null || _c === void 0 ? void 0 : _c.toLowerCase().includes(filterValue);
-                const importDateMatch = (_d = file.importDate) === null || _d === void 0 ? void 0 : _d.toString().includes(filterValue);
-                const contentsMatch = searchContents
-                    ? (_e = file.description) === null || _e === void 0 ? void 0 : _e.toLowerCase().includes(searchContents)
-                    : true;
-                return ((nameMatch ||
-                    typeMatch ||
-                    moduleMatch ||
-                    descriptionMatch ||
-                    modifiedDateMatch ||
-                    lastUserMatch ||
-                    importDateMatch) &&
-                    contentsMatch);
+            __classPrivateFieldGet(this, _GxIdeWWFiles_chGridEl, "f").addEventListener("rowDoubleClicked", () => {
+                __classPrivateFieldGet(this, _GxIdeWWFiles_openSelectionCallbackHandler, "f").call(this);
+            });
+            __classPrivateFieldGet(this, _GxIdeWWFiles_chGridEl, "f").addEventListener("rowContextMenu", (ev) => {
+                ev.preventDefault();
+                ev.stopPropagation();
+                this.contextMenuCallback({
+                    selection: ev.detail.selectedRowsId,
+                    clientX: ev.detail.clientX,
+                    clientY: ev.detail.clientY
+                });
             });
         });
-        _GxIdeWWFiles_handleFilterInput.set(this, (event) => {
-            this.filterFilesInputValue = event.detail.toLowerCase();
-            __classPrivateFieldGet(this, _GxIdeWWFiles_filterFiles, "f").call(this);
+        _GxIdeWWFiles_categoryInputHandler.set(this, async (event) => {
+            __classPrivateFieldSet(this, _GxIdeWWFiles_categoryValue, event.detail, "f");
+            __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
         });
-        _GxIdeWWFiles_handleSearchContentsInput.set(this, () => {
-            __classPrivateFieldGet(this, _GxIdeWWFiles_filterFiles, "f").call(this);
+        _GxIdeWWFiles_clearDateTimeValue.set(this, () => {
+            this.dateTimeValue = undefined;
         });
-        _GxIdeWWFiles_deleteSelectionCallbackHandle.set(this, () => {
-            this.deleteSelectionCallback(this.selectedObjectsIds);
+        _GxIdeWWFiles_dateTimeInputHandler.set(this, (event) => {
+            this.dateTimeValue = event.detail;
+            __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
+        });
+        _GxIdeWWFiles_deleteSelectionCallbackHandler.set(this, () => {
+            this.deleteSelectionCallback(__classPrivateFieldGet(this, _GxIdeWWFiles_selectedObjectsIds, "f"));
         });
         _GxIdeWWFiles_deselectAll.set(this, () => {
             __classPrivateFieldGet(this, _GxIdeWWFiles_chGridEl, "f").selectAllRows(false);
         });
-        _GxIdeWWFiles_expandedHandler.set(this, (e) => {
-            if (e.detail.id === __classPrivateFieldGet(this, _GxIdeWWFiles_ACCORDION_FILTER_ID, "f")) {
-                this.advancedFilterAccordionExpanded = e.detail.expanded;
-                this.filterMore = e.detail.expanded;
-            }
-        });
-        _GxIdeWWFiles_filterModifiedCallbackHandle.set(this, () => {
-            this.filterModified = !!__classPrivateFieldGet(this, _GxIdeWWFiles_filterModifiedEl, "f").value;
-            this.enabledModifiedControls = this.filterModified;
-            if (!this.filterModified) {
-                // Reset related fields when unchecking Modified
-                __classPrivateFieldGet(this, _GxIdeWWFiles_filterUserEl, "f").value = null;
-                __classPrivateFieldGet(this, _GxIdeWWFiles_filterAfterTypeEl, "f").value = null;
-                this.afterCurrentValue = null;
-                __classPrivateFieldGet(this, _GxIdeWWFiles_filterModifiedDateEl, "f").value = null;
+        _GxIdeWWFiles_evaluateModifiedDates.set(this, (objectModifiedDate, filterSelectedModifiedDate) => {
+            const filterSelectedModifiedDateAsDate = new Date(filterSelectedModifiedDate);
+            if (filterSelectedModifiedDateAsDate >= objectModifiedDate) {
+                // Object modifed date matches with filter date, or was modified after that date.
+                // Highlight to show that it matches.
+                return h("span", { class: "hiChar" }, __classPrivateFieldGet(this, _GxIdeWWFiles_formatDate, "f").call(this, objectModifiedDate));
             }
             else {
-                // Restore default values when checking Modified
-                this.afterCurrentValue = FILTER_AFTER_DATE_TIME;
-                __classPrivateFieldGet(this, _GxIdeWWFiles_filterAfterTypeEl, "f").value = FILTER_AFTER_DATE_TIME;
+                return __classPrivateFieldGet(this, _GxIdeWWFiles_formatDate, "f").call(this, objectModifiedDate);
             }
-            __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
         });
-        _GxIdeWWFiles_filterAfterTypeCallbackHandle.set(this, () => {
-            const newValue = __classPrivateFieldGet(this, _GxIdeWWFiles_filterAfterTypeEl, "f").value;
-            // Validar que el valor sea uno de los permitidos
-            if ([
-                FILTER_AFTER_DATE_TIME,
-                FILTER_AFTER_LAST_BUILD,
-                FILTER_AFTER_IMPORT
-            ].includes(newValue)) {
-                this.afterCurrentValue = newValue;
-            }
-            else {
-                // Si no es un valor válido, establecer el valor por defecto
-                this.afterCurrentValue = FILTER_AFTER_DATE_TIME;
-                __classPrivateFieldGet(this, _GxIdeWWFiles_filterAfterTypeEl, "f").value = FILTER_AFTER_DATE_TIME;
-            }
+        _GxIdeWWFiles_filterAfterTypeCallbackHandler.set(this, (event) => {
+            this.afterValue = event.detail;
             __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
         });
-        _GxIdeWWFiles_listenChanges.set(this, () => {
-            /* module/folder */
-            __classPrivateFieldGet(this, _GxIdeWWFiles_filterModuleEl, "f").addEventListener("valueChanged", () => {
-                __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
-            });
-            // for grid selection
-            __classPrivateFieldGet(this, _GxIdeWWFiles_chGridEl, "f").addEventListener("selectionChanged", (ev) => {
-                this.selectedObjectsIds = ev.detail.rowsId;
-                this.selectionChangeCallback(this.selectedObjectsIds);
-            });
-            __classPrivateFieldGet(this, _GxIdeWWFiles_chGridEl, "f").addEventListener("rowDoubleClicked", () => {
-                __classPrivateFieldGet(this, _GxIdeWWFiles_openSelectionCallbackHandle, "f").call(this);
-            });
-            __classPrivateFieldGet(this, _GxIdeWWFiles_chGridEl, "f").addEventListener("rowContextMenu", (ev) => {
-                ev.preventDefault();
-                ev.stopPropagation();
-                this.contextMenuCallback({
-                    selection: ev.detail.selectedRowsId,
-                    clientX: ev.detail.clientX,
-                    clientY: ev.detail.clientY
-                });
+        _GxIdeWWFiles_formatDate.set(this, (date) => {
+            return formatDate(date, "date-time-short");
+        });
+        _GxIdeWWFiles_getObjects.set(this, () => {
+            __classPrivateFieldGet(this, _GxIdeWWFiles_setLoadingState, "f").call(this);
+            const filtersValues = {
+                name: __classPrivateFieldGet(this, _GxIdeWWFiles_nameValue, "f"),
+                searchContents: __classPrivateFieldGet(this, _GxIdeWWFiles_searchContentsValue, "f"),
+                category: __classPrivateFieldGet(this, _GxIdeWWFiles_categoryValue, "f"),
+                parent: __classPrivateFieldGet(this, _GxIdeWWFiles_filterModuleEl, "f").value.id,
+                allDescendants: __classPrivateFieldGet(this, _GxIdeWWFiles_allDescendants, "f") === CHECKBOX_CHECKED_VALUE,
+                modifiedAfter: this.showModified ? this.afterValue : undefined,
+                modifiedBy: this.showModified ? __classPrivateFieldGet(this, _GxIdeWWFiles_userValue, "f") : undefined,
+                modifiedDate: this.showModified ? new Date(this.dateTimeValue) : undefined
+            };
+            this.loadCallback(filtersValues).then((items) => {
+                this.objects = items;
+                __classPrivateFieldSet(this, _GxIdeWWFiles_selectedObjectsIds, [], "f");
+                __classPrivateFieldGet(this, _GxIdeWWFiles_deselectAll, "f").call(this);
+                this.isLoading = false;
             });
         });
-        _GxIdeWWFiles_newFileCallbackHandle.set(this, () => {
+        _GxIdeWWFiles_renderHeader.set(this, () => {
+            return [
+                h("div", {
+                    // Name
+                    class: "field field-block field-name"
+                }, h("label", { class: "label", htmlFor: "name" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.name), h("ch-edit", { id: "name", class: "input", value: __classPrivateFieldGet(this, _GxIdeWWFiles_nameValue, "f"), onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_nameInputHandler, "f"), part: "filter-files", debounce: config.inputDebounce, disabled: this.isLoading })),
+                h("div", {
+                    // Module
+                    class: "field field-block field-module-folder"
+                }, h("label", { class: "label", htmlFor: "module-folder" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.moduleFolder), h("gx-ide-entity-selector", { part: "filter-module-folder", id: "module/folder", labelPosition: "none", value: __classPrivateFieldGet(this, _GxIdeWWFiles_moduleValue, "f"), defaultValue: this.defaultModule, selectEntityCallback: this.selectModuleCallback, ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_filterModuleEl, el, "f")), onValueChanged: __classPrivateFieldGet(this, _GxIdeWWFiles_moduleValueChangedHandler, "f"), disabled: this.isLoading })),
+                h("ch-accordion-render", { class: "accordion-outlined advanced-filter", model: __classPrivateFieldGet(this, _GxIdeWWFiles_ACCORDION_MODEL, "f") }, h("div", { slot: ACCORDION_FILTER_ID, class: "spacing-body field-group advanced-filter__container" }, this.showSearchContents && (h("div", {
+                    // Search contents
+                    class: "field field-block field-search-contents"
+                }, h("label", { class: "label", htmlFor: "filter-content" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.content), h("ch-edit", { id: "filter-content", class: "input", onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_searchContentsInputHandler, "f"), part: "filter-content" }))), h("div", { class: "field-group advanced-filter__first-row" }, h("div", {
+                    // Category
+                    class: "field field-block field-category"
+                }, h("label", { class: "label", htmlFor: "filter-category" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.category), h("ch-combo-box-render", { id: "filter-category", class: "combo-box disabled", value: __classPrivateFieldGet(this, _GxIdeWWFiles_categoryValue, "f"), disabled: !this.categories || this.isLoading, model: this.categoriesComboBoxModel, part: "filter-category", onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_categoryInputHandler, "f") })), h("div", {
+                    // All descendants / Modified
+                    class: "all-descendants__modified field field-inline"
+                }, h("ch-checkbox", {
+                    // All descendants
+                    class: "checkbox", caption: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.allDescendants, checkedValue: CHECKBOX_CHECKED_VALUE, unCheckedValue: CHECKBOX_UNCHECKED_VALUE, value: __classPrivateFieldGet(this, _GxIdeWWFiles_allDescendants, "f"), onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_allDescendantsCheckboxHandler, "f"), part: "filter-all-descendants", disabled: this.isLoading
+                }), h("ch-checkbox", {
+                    // Modified
+                    class: "checkbox align-center", caption: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.modified, checkedValue: CHECKBOX_CHECKED_VALUE, unCheckedValue: CHECKBOX_UNCHECKED_VALUE, value: this.showModified, onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_showModifiedCheckboxHandler, "f"), part: "filter-modified"
+                }))), this.showModified === CHECKBOX_CHECKED_VALUE && (h("div", { class: "field-group advanced-filter__second-row" }, h("div", {
+                    // After
+                    class: "field field-block field-after"
+                }, h("label", { class: "label", htmlFor: "filter-after-type" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.after), h("ch-combo-box-render", { id: "filter-after-type", class: "combo-box", value: this.afterValue, model: this.filterAfterComboBoxModel, onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_filterAfterTypeCallbackHandler, "f"), part: "filter-after-type", disabled: this.isLoading })), h("div", {
+                    // User
+                    class: "field field-block field-user"
+                }, h("label", { class: "label", htmlFor: "filter-user" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.user), h("ch-edit", { id: "filter-user", class: "input", value: __classPrivateFieldGet(this, _GxIdeWWFiles_userValue, "f"), onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_userInputHandler, "f"), part: "filter-user", debounce: config.inputDebounce, disabled: this.isLoading })), this.afterValue === FILTER_AFTER_DATE_TIME && (h("div", {
+                    // Date/Time
+                    class: {
+                        "field field-block field-date": true,
+                        "hide": this.afterValue !== FILTER_AFTER_DATE_TIME
+                    }
+                }, h("label", { class: "label label-date-time", htmlFor: "filter-date-time" }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.dateTime, h("ch-image", { class: "icon-md icon-clear-date-time", src: INFO_ICON }), h("ch-tooltip", { class: "tooltip", actionElement: null, blockAlign: "outside-start", inlineAlign: "inside-start", delay: config.tooltipSettings.delay }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.dateTimeTooltip)), h("ch-edit", { id: "filter-date-time", type: "datetime-local", class: "input input-date-time", value: this.dateTimeValue, onInput: __classPrivateFieldGet(this, _GxIdeWWFiles_dateTimeInputHandler, "f"), part: "filter-date-time", disabled: this.isLoading }), h("button", { class: "button-tertiary button-icon-only", onClick: __classPrivateFieldGet(this, _GxIdeWWFiles_clearDateTimeValue, "f"), disabled: this.isLoading }, h("ch-image", { class: "icon-md", src: CLEAR_ICON, type: "mask" }))))))))
+            ];
+        });
+        _GxIdeWWFiles_renderObjects.set(this, () => {
+            var _a;
+            const gridIsEmpty = !this.objects.length;
+            return (h("ch-tabular-grid", { ref: (el) => (__classPrivateFieldSet(this, _GxIdeWWFiles_chGridEl, el, "f")), class: {
+                    "tabular-grid": true,
+                    "loading": this.isLoading,
+                    "empty": this.objects.length === 0
+                }, rowSelectionMode: "multiple", part: "ch-grid-files" }, h("ch-tabular-grid-columnset", { class: "tabular-grid-column-set" }, h("ch-tabular-grid-column", { columnName: "", columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" }), h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.name, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" }), h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.module, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" }), this.gridColumnsVisibility.description && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.description, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.auto, class: "tabular-grid-column" })), this.gridColumnsVisibility.modifiedDate && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.modifiedDate, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" })), this.gridColumnsVisibility.lastUser && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.lastUser, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" })), this.gridColumnsVisibility.importDate && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.importDate, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" })), this.gridColumnsVisibility.lastBuildDate && (h("ch-tabular-grid-column", { columnName: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").tableHead.lastBuildDate, columnNameHidden: false, settingable: false, size: config.tabularGrid.colSize.maxContent, class: "tabular-grid-column" }))), !gridIsEmpty ? (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, (_a = this.objects) === null || _a === void 0 ? void 0 : _a.map((object) => {
+                var _a;
+                return (h("ch-tabular-grid-row", { rowid: object.id, class: "tabular-grid-row" }, h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, h("ch-image", { src: object.icon })), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, hiChar(object.name.toLowerCase(), __classPrivateFieldGet(this, _GxIdeWWFiles_nameValue, "f").toLowerCase())), h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, hiChar(object.parent, __classPrivateFieldGet(this, _GxIdeWWFiles_moduleValue, "f").name)), this.gridColumnsVisibility.description && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell tabular-grid-cell-description" }, object.description)), this.gridColumnsVisibility.modifiedDate && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, __classPrivateFieldGet(this, _GxIdeWWFiles_evaluateModifiedDates, "f").call(this, object.modifiedDate, this.dateTimeValue))), this.gridColumnsVisibility.lastUser && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, hiChar((_a = object.lastUser) === null || _a === void 0 ? void 0 : _a.toLowerCase(), __classPrivateFieldGet(this, _GxIdeWWFiles_userValue, "f")))), this.gridColumnsVisibility.importDate && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, hiChar(object.importDate
+                    ? __classPrivateFieldGet(this, _GxIdeWWFiles_formatDate, "f").call(this, object.importDate)
+                    : "", __classPrivateFieldGet(this, _GxIdeWWFiles_nameValue, "f")))), this.gridColumnsVisibility.lastBuildDate && (h("ch-tabular-grid-cell", { class: "tabular-grid-cell" }, hiChar(object.lastBuildDate
+                    ? __classPrivateFieldGet(this, _GxIdeWWFiles_formatDate, "f").call(this, object.lastBuildDate)
+                    : "", __classPrivateFieldGet(this, _GxIdeWWFiles_nameValue, "f"))))));
+            }))) : (h("ch-tabular-grid-rowset", { class: "tabular-grid-rowset" }, h("ch-tabular-grid-rowset-empty", null, this.isLoading ? (h("gx-ide-loader", { loaderTitle: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").loader.title, description: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").loader.description, show: true })) : (h("gx-ide-empty-state", { isAnimated: true, stateIconSrc: FILTER_ICON, stateTitle: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").emptyState.title })))))));
+        });
+        _GxIdeWWFiles_moduleValueChangedHandler.set(this, (event) => {
+            __classPrivateFieldSet(this, _GxIdeWWFiles_moduleValue, event.detail, "f");
+            __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
+        });
+        _GxIdeWWFiles_nameInputHandler.set(this, (event) => {
+            __classPrivateFieldSet(this, _GxIdeWWFiles_nameValue, event.detail, "f");
+            __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
+        });
+        _GxIdeWWFiles_newFileCallbackHandler.set(this, () => {
             this.newFileCallback();
         });
-        _GxIdeWWFiles_openSelectionCallbackHandle.set(this, () => {
-            this.openSelectionCallback(this.selectedObjectsIds);
+        _GxIdeWWFiles_openSelectionCallbackHandler.set(this, () => {
+            this.openSelectionCallback(__classPrivateFieldGet(this, _GxIdeWWFiles_selectedObjectsIds, "f"));
+        });
+        _GxIdeWWFiles_searchContentsInputHandler.set(this, (event) => {
+            __classPrivateFieldSet(this, _GxIdeWWFiles_searchContentsValue, event.detail, "f");
+            __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
+        });
+        _GxIdeWWFiles_setLoadingState.set(this, () => {
+            this.objects = [];
+            this.isLoading = true;
+        });
+        _GxIdeWWFiles_userInputHandler.set(this, (event) => {
+            __classPrivateFieldSet(this, _GxIdeWWFiles_userValue, event.detail, "f");
+            __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
+        });
+        _GxIdeWWFiles_showModifiedCheckboxHandler.set(this, (event) => {
+            this.showModified = event.detail;
         });
         _GxIdeWWFiles_selectAll.set(this, () => {
             __classPrivateFieldGet(this, _GxIdeWWFiles_chGridEl, "f").selectAllRows();
         });
+        this.afterValue = undefined;
         this.categoriesComboBoxModel = [];
-        this.afterCurrentValue = FILTER_AFTER_DATE_TIME;
-        this.filterAfterOptions = undefined;
-        this.enabledModifiedControls = false;
-        this.filterModified = false;
-        this.filterMore = false;
+        this.dateTimeValue = undefined;
+        this.isLoading = true;
+        this.filterAfterComboBoxModel = undefined;
+        this.showModified = CHECKBOX_CHECKED_VALUE;
         this.objects = [];
-        this.filterFilesInputValue = "";
-        this.filteredFiles = [];
-        this.selectedObjectsIds = [];
-        this.advancedFilterAccordionExpanded = false;
         this.categories = undefined;
+        this.contextMenuCallback = undefined;
         this.defaultCategory = undefined;
         this.defaultModule = undefined;
-        this.filterModules = undefined;
-        this.types = undefined;
-        this.contextMenuCallback = undefined;
         this.deleteSelectionCallback = undefined;
+        this.gridColumnsVisibility = {
+            description: true,
+            importDate: true,
+            lastBuildDate: true,
+            lastUser: true,
+            modifiedDate: true
+        };
         this.loadCallback = undefined;
         this.newFileCallback = undefined;
         this.openSelectionCallback = undefined;
         this.selectModuleCallback = undefined;
         this.selectionChangeCallback = undefined;
         this.showSearchContents = false;
-        this.showDescription = false;
-        this.showModifiedDate = false;
-        this.showLastUser = false;
-        this.showImportDate = false;
-        this.showType = false;
-        this.showLastBuildDate = false;
+    }
+    dateTimeValueChanged() {
+        __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
     }
     categoriesChanged(newCategories) {
         this.categoriesComboBoxModel = mapOptionsToComboBoxItemModel(newCategories);
     }
     async componentWillLoad() {
         __classPrivateFieldSet(this, _GxIdeWWFiles_componentLocale, await Locale.getComponentStrings(this.el), "f");
-        // initialize combo-box models
+        // initialize combo-box models∂
         this.categoriesChanged(this.categories);
         // initialize "After" combo-box options
-        this.filterAfterOptions = [
+        this.filterAfterComboBoxModel = [
             {
                 caption: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter[FILTER_AFTER_DATE_TIME],
                 value: FILTER_AFTER_DATE_TIME
@@ -286,21 +330,18 @@ const GxIdeWWFiles = /*@__PURE__*/ proxyCustomElement(class GxIdeWWFiles extends
                 value: FILTER_AFTER_IMPORT
             }
         ];
-        this.afterCurrentValue = FILTER_AFTER_DATE_TIME;
         // initialize accordion model with proper configuration
         __classPrivateFieldSet(this, _GxIdeWWFiles_ACCORDION_MODEL, [
             {
-                id: __classPrivateFieldGet(this, _GxIdeWWFiles_ACCORDION_FILTER_ID, "f"),
+                id: ACCORDION_FILTER_ID,
                 caption: __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").filter.accordionCaption,
-                expanded: this.advancedFilterAccordionExpanded
+                expanded: false
             }
         ], "f");
-        // initialize filtered files
-        this.filteredFiles = this.objects;
-        this.componentDidLoadEvent.emit(true);
+        __classPrivateFieldGet(this, _GxIdeWWFiles_setFilterDefaultValues, "f").call(this);
     }
     componentDidLoad() {
-        __classPrivateFieldGet(this, _GxIdeWWFiles_listenChanges, "f").call(this);
+        __classPrivateFieldGet(this, _GxIdeWWFiles_attachGridListeners, "f").call(this);
         __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
     }
     keyDownHandler(eventInfo) {
@@ -308,11 +349,11 @@ const GxIdeWWFiles = /*@__PURE__*/ proxyCustomElement(class GxIdeWWFiles extends
             switch (eventInfo.key) {
                 case "Enter":
                     eventInfo.preventDefault();
-                    __classPrivateFieldGet(this, _GxIdeWWFiles_openSelectionCallbackHandle, "f").call(this);
+                    __classPrivateFieldGet(this, _GxIdeWWFiles_openSelectionCallbackHandler, "f").call(this);
                     break;
                 case "Delete":
                     eventInfo.preventDefault();
-                    __classPrivateFieldGet(this, _GxIdeWWFiles_deleteSelectionCallbackHandle, "f").call(this);
+                    __classPrivateFieldGet(this, _GxIdeWWFiles_deleteSelectionCallbackHandler, "f").call(this);
                     break;
                 case "Escape":
                     eventInfo.preventDefault();
@@ -321,97 +362,81 @@ const GxIdeWWFiles = /*@__PURE__*/ proxyCustomElement(class GxIdeWWFiles extends
             }
         }
     }
-    /**
-     * Validate necessary data input
-     */
-    async validate() {
-        const isValid = true;
-        return isValid;
-    }
     /**
      * This method reload the view, refreshing the filters and the table of files.
      */
     async reload() {
-        this.filterFilesInputValue = "";
-        __classPrivateFieldGet(this, _GxIdeWWFiles_filterUserEl, "f").value = null;
-        __classPrivateFieldGet(this, _GxIdeWWFiles_filterAfterTypeEl, "f").value = null;
-        this.afterCurrentValue = null;
-        __classPrivateFieldGet(this, _GxIdeWWFiles_filterModifiedEl, "f").value = undefined;
-        __classPrivateFieldGet(this, _GxIdeWWFiles_filterAllDescendantsEl, "f").value = undefined;
-        __classPrivateFieldGet(this, _GxIdeWWFiles_filterModuleEl, "f").value = this.defaultModule;
-        __classPrivateFieldGet(this, _GxIdeWWFiles_filterCategoryEl, "f").value = null;
-        __classPrivateFieldGet(this, _GxIdeWWFiles_filterSearchContentsEl, "f").value = null;
-        __classPrivateFieldGet(this, _GxIdeWWFiles_filterNameEl, "f").value = null;
-        this.filterMore = false;
+        __classPrivateFieldGet(this, _GxIdeWWFiles_setFilterDefaultValues, "f").call(this);
         __classPrivateFieldGet(this, _GxIdeWWFiles_getObjects, "f").call(this);
     }
     render() {
-        return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "section" }, h("header", { class: "header control-header-with-border spacing-body-inline spacing-body-block-start field-group" }, __classPrivateFieldGet(this, _GxIdeWWFiles_renderHeader, "f").call(this)), h("div", { class: "main" }, __classPrivateFieldGet(this, _GxIdeWWFiles_renderObjects, "f").call(this)), h("footer", { class: "control-footer-with-border control-footer-space-between spacing-body" }, h("p", {
+        var _a;
+        return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "section" }, h("header", { class: "header control-header-with-border spacing-body-inline spacing-body-block-start field-group" }, __classPrivateFieldGet(this, _GxIdeWWFiles_renderHeader, "f").call(this)), __classPrivateFieldGet(this, _GxIdeWWFiles_renderObjects, "f").call(this), h("footer", { class: "control-footer-with-border control-footer-space-between spacing-body" }, h("p", {
             // matching objects
             class: "text-body", part: "objects-matching"
-        }, `${this.filteredFiles.length} ${__classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").objCount.matching}`), h("div", { class: "buttons-spacer" }, h("button", {
+        }, `${(_a = this.objects) === null || _a === void 0 ? void 0 : _a.length} ${__classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").objCount.matching}`), h("div", { class: "buttons-spacer" }, h("button", {
             // select all button
-            id: "button-select-all", class: "button-secondary", onClick: __classPrivateFieldGet(this, _GxIdeWWFiles_selectAll, "f"), part: "button button--select-all"
+            id: "button-select-all", class: "button-secondary", onClick: __classPrivateFieldGet(this, _GxIdeWWFiles_selectAll, "f"), part: "button button--select-all", disabled: this.isLoading
         }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").footer.btnSelectAll), h("button", {
             // new file button
-            id: "button-new-file", class: "button-primary button-icon-and-text", onClick: __classPrivateFieldGet(this, _GxIdeWWFiles_newFileCallbackHandle, "f"), part: "button button--new-file"
+            id: "button-new-file", class: "button-primary button-icon-and-text", onClick: __classPrivateFieldGet(this, _GxIdeWWFiles_newFileCallbackHandler, "f"), part: "button button--new-file", disabled: this.isLoading
         }, __classPrivateFieldGet(this, _GxIdeWWFiles_componentLocale, "f").footer.btnNew))))));
     }
     static get assetsDirs() { return ["gx-ide-assets/ww-files"]; }
     get el() { return this; }
     static get watchers() { return {
+        "dateTimeValue": ["dateTimeValueChanged"],
         "categories": ["categoriesChanged"]
     }; }
     static get style() { return wwFilesCss; }
 }, [1, "gx-ide-ww-files", {
         "categories": [16],
+        "contextMenuCallback": [16],
         "defaultCategory": [1, "default-category"],
         "defaultModule": [16],
-        "filterModules": [16],
-        "types": [16],
-        "contextMenuCallback": [16],
         "deleteSelectionCallback": [16],
+        "gridColumnsVisibility": [16],
         "loadCallback": [16],
         "newFileCallback": [16],
         "openSelectionCallback": [16],
         "selectModuleCallback": [16],
         "selectionChangeCallback": [16],
         "showSearchContents": [4, "show-search-contents"],
-        "showDescription": [4, "show-description"],
-        "showModifiedDate": [4, "show-modified-date"],
-        "showLastUser": [4, "show-last-user"],
-        "showImportDate": [4, "show-import-date"],
-        "showType": [4, "show-type"],
-        "showLastBuildDate": [4, "show-last-build-date"],
+        "afterValue": [32],
         "categoriesComboBoxModel": [32],
-        "afterCurrentValue": [32],
-        "filterAfterOptions": [32],
-        "enabledModifiedControls": [32],
-        "filterModified": [32],
-        "filterMore": [32],
+        "dateTimeValue": [32],
+        "isLoading": [32],
+        "filterAfterComboBoxModel": [32],
+        "showModified": [32],
         "objects": [32],
-        "filterFilesInputValue": [32],
-        "filteredFiles": [32],
-        "selectedObjectsIds": [32],
-        "advancedFilterAccordionExpanded": [32],
-        "validate": [64],
         "reload": [64]
     }, [[1, "keydown", "keyDownHandler"]], {
+        "dateTimeValue": ["dateTimeValueChanged"],
         "categories": ["categoriesChanged"]
     }]);
-_GxIdeWWFiles_componentLocale = new WeakMap(), _GxIdeWWFiles_ACCORDION_FILTER_ID = new WeakMap(), _GxIdeWWFiles_ACCORDION_MODEL = new WeakMap(), _GxIdeWWFiles_chGridEl = new WeakMap(), _GxIdeWWFiles_filterAfterTypeEl = new WeakMap(), _GxIdeWWFiles_filterAllDescendantsEl = new WeakMap(), _GxIdeWWFiles_filterCategoryEl = new WeakMap(), _GxIdeWWFiles_filterModifiedDateEl = new WeakMap(), _GxIdeWWFiles_filterModuleEl = new WeakMap(), _GxIdeWWFiles_filterModifiedEl = new WeakMap(), _GxIdeWWFiles_filterNameEl = new WeakMap(), _GxIdeWWFiles_filterSearchContentsEl = new WeakMap(), _GxIdeWWFiles_filterUserEl = new WeakMap(), _GxIdeWWFiles_renderHeader = new WeakMap(), _GxIdeWWFiles_renderObjects = new WeakMap(), _GxIdeWWFiles_hiChar = new WeakMap(), _GxIdeWWFiles_formatDate = new WeakMap(), _GxIdeWWFiles_getObjects = new WeakMap(), _GxIdeWWFiles_filterFiles = new WeakMap(), _GxIdeWWFiles_handleFilterInput = new WeakMap(), _GxIdeWWFiles_handleSearchContentsInput = new WeakMap(), _GxIdeWWFiles_deleteSelectionCallbackHandle = new WeakMap(), _GxIdeWWFiles_deselectAll = new WeakMap(), _GxIdeWWFiles_expandedHandler = new WeakMap(), _GxIdeWWFiles_filterModifiedCallbackHandle = new WeakMap(), _GxIdeWWFiles_filterAfterTypeCallbackHandle = new WeakMap(), _GxIdeWWFiles_listenChanges = new WeakMap(), _GxIdeWWFiles_newFileCallbackHandle = new WeakMap(), _GxIdeWWFiles_openSelectionCallbackHandle = new WeakMap(), _GxIdeWWFiles_selectAll = new WeakMap();
+_GxIdeWWFiles_componentLocale = new WeakMap(), _GxIdeWWFiles_ACCORDION_MODEL = new WeakMap(), _GxIdeWWFiles_nameValue = new WeakMap(), _GxIdeWWFiles_moduleValue = new WeakMap(), _GxIdeWWFiles_searchContentsValue = new WeakMap(), _GxIdeWWFiles_categoryValue = new WeakMap(), _GxIdeWWFiles_allDescendants = new WeakMap(), _GxIdeWWFiles_userValue = new WeakMap(), _GxIdeWWFiles_selectedObjectsIds = new WeakMap(), _GxIdeWWFiles_chGridEl = new WeakMap(), _GxIdeWWFiles_filterModuleEl = new WeakMap(), _GxIdeWWFiles_setFilterDefaultValues = new WeakMap(), _GxIdeWWFiles_allDescendantsCheckboxHandler = new WeakMap(), _GxIdeWWFiles_attachGridListeners = new WeakMap(), _GxIdeWWFiles_categoryInputHandler = new WeakMap(), _GxIdeWWFiles_clearDateTimeValue = new WeakMap(), _GxIdeWWFiles_dateTimeInputHandler = new WeakMap(), _GxIdeWWFiles_deleteSelectionCallbackHandler = new WeakMap(), _GxIdeWWFiles_deselectAll = new WeakMap(), _GxIdeWWFiles_evaluateModifiedDates = new WeakMap(), _GxIdeWWFiles_filterAfterTypeCallbackHandler = new WeakMap(), _GxIdeWWFiles_formatDate = new WeakMap(), _GxIdeWWFiles_getObjects = new WeakMap(), _GxIdeWWFiles_renderHeader = new WeakMap(), _GxIdeWWFiles_renderObjects = new WeakMap(), _GxIdeWWFiles_moduleValueChangedHandler = new WeakMap(), _GxIdeWWFiles_nameInputHandler = new WeakMap(), _GxIdeWWFiles_newFileCallbackHandler = new WeakMap(), _GxIdeWWFiles_openSelectionCallbackHandler = new WeakMap(), _GxIdeWWFiles_searchContentsInputHandler = new WeakMap(), _GxIdeWWFiles_setLoadingState = new WeakMap(), _GxIdeWWFiles_userInputHandler = new WeakMap(), _GxIdeWWFiles_showModifiedCheckboxHandler = new WeakMap(), _GxIdeWWFiles_selectAll = new WeakMap();
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["gx-ide-ww-files", "gx-ide-entity-selector"];
+    const components = ["gx-ide-ww-files", "gx-ide-empty-state", "gx-ide-entity-selector", "gx-ide-loader"];
     components.forEach(tagName => { switch (tagName) {
         case "gx-ide-ww-files":
             if (!customElements.get(tagName)) {
                 customElements.define(tagName, GxIdeWWFiles);
             }
             break;
+        case "gx-ide-empty-state":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
         case "gx-ide-entity-selector":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "gx-ide-loader":
             if (!customElements.get(tagName)) {
                 defineCustomElement$2();
             }