raise-common-lib 0.0.248 → 0.0.249

package/fesm5/raise-common-lib.js

@@ -1,7 +1,8 @@
 import { __assign, __awaiter, __generator, __decorate, __metadata, __spread, __read, __values } from 'tslib';
-import { EventEmitter, Component, ChangeDetectorRef, ViewChild, Input, Output, HostBinding, Injectable, ɵɵdefineInjectable, Inject, ɵɵinject, ContentChild, HostListener, ComponentFactoryResolver, ViewContainerRef, ViewChildren, ElementRef, InjectionToken, Optional, ChangeDetectionStrategy, ViewEncapsulation, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { EventEmitter, Component, ChangeDetectorRef, ViewChild, Input, Output, ElementRef, HostListener, HostBinding, Injectable, ɵɵdefineInjectable, Inject, ɵɵinject, ContentChild, ComponentFactoryResolver, ViewContainerRef, ViewChildren, InjectionToken, Optional, ChangeDetectionStrategy, ViewEncapsulation, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { GridComponent, ExcelExportService, ColumnChooserService, VirtualScrollService, FilterService, ResizeService, GridModule, PagerModule, GridAllModule, PageService, RowDDService, SortService, EditService, ToolbarService as ToolbarService$1, AggregateService, ColumnMenuService, DetailRowService, SelectionService, GroupService } from '@syncfusion/ej2-angular-grids';
 import { times, debounce as debounce$1, forEach, throttle, find, cloneDeep, startsWith, filter as filter$1, meanBy, sumBy, minBy, maxBy, sortBy, uniqBy, differenceWith, mean } from 'lodash';
+import moment from 'moment';
 import { Subject, BehaviorSubject, Observable } from 'rxjs';
 import { MAT_SNACK_BAR_DATA, MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar';
 import { MAT_DIALOG_DATA, MatDialogRef, MatDialog, MatDialogModule } from '@angular/material/dialog';
@@ -14,7 +15,6 @@ import { HttpClient, HttpHeaders, HttpClientModule } from '@angular/common/http'
 import { setCulture, L10n, addClass, enableRipple, Browser, createElement } from '@syncfusion/ej2-base';
 import ResizeObserver from 'resize-observer-polyfill';
 import { Query, DataUtil } from '@syncfusion/ej2-data';
-import moment from 'moment';
 import CircularJSON from 'circular-json';
 import { MAT_DATE_FORMATS } from '@angular/material/core';
 import { DashboardLayoutModule } from '@syncfusion/ej2-angular-layouts';
@@ -77,6 +77,791 @@ function getTranslation() {
     return {};
 }
 
+/**
+ * @fileoverview added by tsickle
+ * Generated from: lib/date-tree-filter/date-tree-filter.helper.ts
+ * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * @record
+ */
+function DateTreeFilterSetupOptions() { }
+if (false) {
+    /** @type {?} */
+    DateTreeFilterSetupOptions.prototype.rows;
+    /** @type {?} */
+    DateTreeFilterSetupOptions.prototype.fields;
+    /** @type {?} */
+    DateTreeFilterSetupOptions.prototype.hints;
+}
+/**
+ * @record
+ */
+function DateTreeFilterHelperOptions() { }
+if (false) {
+    /** @type {?} */
+    DateTreeFilterHelperOptions.prototype.getTranslation;
+    /** @type {?} */
+    DateTreeFilterHelperOptions.prototype.getPopoverElement;
+    /** @type {?} */
+    DateTreeFilterHelperOptions.prototype.getGridElement;
+    /** @type {?} */
+    DateTreeFilterHelperOptions.prototype.applyRows;
+    /** @type {?|undefined} */
+    DateTreeFilterHelperOptions.prototype.parseDateValue;
+    /** @type {?|undefined} */
+    DateTreeFilterHelperOptions.prototype.dateFormats;
+}
+/**
+ * @record
+ */
+function RsCommonGridDateTreeFactoryHost() { }
+if (false) {
+    /** @type {?} */
+    RsCommonGridDateTreeFactoryHost.prototype.translation;
+    /** @type {?} */
+    RsCommonGridDateTreeFactoryHost.prototype.dateTreePopoverRef;
+    /** @type {?} */
+    RsCommonGridDateTreeFactoryHost.prototype.grid;
+}
+/** @type {?} */
+var DATE_TREE_DEFAULT_DATE_FORMATS = [
+    "YYYY-MM-DD",
+    "MM/DD/YYYY",
+    "DD/MM/YYYY",
+    "YYYY/MM/DD",
+    "DD-MMM-YYYY",
+    "MMM DD, YYYY",
+];
+var DateTreeFilterHelper = /** @class */ (function () {
+    function DateTreeFilterHelper(options) {
+        this.popoverVisible = false;
+        this.popoverField = "";
+        this.popoverStyle = {};
+        this.selectedByField = {};
+        this.fieldLabelMap = {};
+        this.dateFields = [];
+        this.sourceRows = [];
+        this.defaultDateFormats = [
+            "YYYY-MM-DD",
+            "MM/DD/YYYY",
+            "DD/MM/YYYY",
+            "YYYY/MM/DD",
+            "DD-MMM-YYYY",
+            "DD-MMM-YYYY hh:mm A",
+            "MMM DD, YYYY",
+            moment.ISO_8601,
+        ];
+        this.options = options;
+    }
+    /**
+     * @param {?} config
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.setup = /**
+     * @param {?} config
+     * @return {?}
+     */
+    function (config) {
+        var _this = this;
+        /** @type {?} */
+        var rows = config && config.rows ? config.rows : [];
+        /** @type {?} */
+        var fields = config && config.fields ? config.fields : [];
+        /** @type {?} */
+        var hints = config && config.hints ? config.hints : [];
+        this.sourceRows = rows;
+        this.dateFields = this.resolveDateTreeFieldsByHints(fields, hints);
+        this.fieldLabelMap = {};
+        (fields || []).forEach((/**
+         * @param {?} item
+         * @return {?}
+         */
+        function (item) {
+            if (!item || !item.columnName) {
+                return;
+            }
+            _this.fieldLabelMap[item.columnName] =
+                item.columnDisplayName || item.columnName;
+        }));
+        this.apply();
+    };
+    /**
+     * @param {?} args
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.handleGridActionBegin = /**
+     * @param {?} args
+     * @return {?}
+     */
+    function (args) {
+        /** @type {?} */
+        var requestType = this.getRequestType(args);
+        if (requestType === "filterchoicerequest" ||
+            requestType === "filtersearchbegin") {
+            args.filterChoiceCount = 15000;
+        }
+        if (requestType !== "filterbeforeopen") {
+            return;
+        }
+        /** @type {?} */
+        var columnName = this.resolveActionColumnName(args);
+        if (!this.isDateTreeField(columnName)) {
+            this.close();
+            return;
+        }
+        args.cancel = true;
+        this.open(columnName);
+    };
+    /**
+     * @param {?} selectionMap
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.updateSelection = /**
+     * @param {?} selectionMap
+     * @return {?}
+     */
+    function (selectionMap) {
+        this.selectedByField = selectionMap || {};
+        this.apply();
+    };
+    /**
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.close = /**
+     * @return {?}
+     */
+    function () {
+        if (!this.popoverVisible) {
+            return;
+        }
+        this.popoverVisible = false;
+        this.popoverField = "";
+        this.popoverStyle = {};
+    };
+    /**
+     * @param {?} event
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.handleDocumentMouseDown = /**
+     * @param {?} event
+     * @return {?}
+     */
+    function (event) {
+        if (!this.popoverVisible) {
+            return;
+        }
+        /** @type {?} */
+        var target = (/** @type {?} */ (event.target));
+        if (!target) {
+            return;
+        }
+        if (this.isInsidePopover(target) || this.isDateFilterMenuItem(target)) {
+            return;
+        }
+        this.close();
+    };
+    /**
+     * @param {?} event
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.handleDocumentMouseOver = /**
+     * @param {?} event
+     * @return {?}
+     */
+    function (event) {
+        if (!this.popoverVisible) {
+            return;
+        }
+        /** @type {?} */
+        var target = (/** @type {?} */ (event.target));
+        if (!target) {
+            return;
+        }
+        if (this.isInsidePopover(target)) {
+            return;
+        }
+        /** @type {?} */
+        var menuItem = (/** @type {?} */ (target.closest(".e-menu-item")));
+        if (menuItem) {
+            if (!this.isDateFilterMenuItem(menuItem)) {
+                this.close();
+            }
+            return;
+        }
+        /** @type {?} */
+        var otherFilterTarget = (/** @type {?} */ (target.closest(".e-filtermenudiv, .e-headercell .e-columnmenu, .e-columnmenu, .e-contextmenu")));
+        if (otherFilterTarget && !this.isDateFilterMenuItem(otherFilterTarget)) {
+            this.close();
+        }
+    };
+    /**
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.updatePosition = /**
+     * @return {?}
+     */
+    function () {
+        if (!this.popoverVisible) {
+            return;
+        }
+        /** @type {?} */
+        var anchor = this.findDateFilterAnchorElement();
+        if (anchor) {
+            /** @type {?} */
+            var rect = anchor.getBoundingClientRect();
+            /** @type {?} */
+            var viewportWidth = window.innerWidth || document.documentElement.clientWidth;
+            /** @type {?} */
+            var viewportHeight = window.innerHeight || document.documentElement.clientHeight;
+            /** @type {?} */
+            var popoverElement = this.options.getPopoverElement
+                ? this.options.getPopoverElement()
+                : null;
+            /** @type {?} */
+            var popoverWidth = popoverElement && popoverElement.offsetWidth
+                ? popoverElement.offsetWidth
+                : 300;
+            /** @type {?} */
+            var popoverHeight = popoverElement && popoverElement.offsetHeight
+                ? popoverElement.offsetHeight
+                : 420;
+            /** @type {?} */
+            var edgeGap = 8;
+            /** @type {?} */
+            var anchorGap = 8;
+            /** @type {?} */
+            var top = rect.top - 6;
+            /** @type {?} */
+            var left = rect.right + anchorGap;
+            if (left + popoverWidth > viewportWidth - edgeGap) {
+                left = rect.left - popoverWidth - anchorGap;
+            }
+            if (left < edgeGap) {
+                left = edgeGap;
+            }
+            if (left + popoverWidth > viewportWidth - edgeGap) {
+                left = Math.max(edgeGap, viewportWidth - popoverWidth - edgeGap);
+            }
+            if (top + popoverHeight > viewportHeight - edgeGap) {
+                top = Math.max(edgeGap, viewportHeight - popoverHeight - edgeGap);
+            }
+            this.popoverStyle = {
+                position: "fixed",
+                left: left + "px",
+                top: top + "px",
+            };
+            return;
+        }
+        /** @type {?} */
+        var gridElement = this.options.getGridElement
+            ? this.options.getGridElement()
+            : null;
+        if (gridElement && gridElement.getBoundingClientRect) {
+            /** @type {?} */
+            var fallbackRect = gridElement.getBoundingClientRect();
+            this.popoverStyle = {
+                position: "fixed",
+                left: Math.max(8, fallbackRect.right - 312) + "px",
+                top: Math.max(8, fallbackRect.top + 8) + "px",
+            };
+        }
+    };
+    /**
+     * @private
+     * @param {?} field
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.open = /**
+     * @private
+     * @param {?} field
+     * @return {?}
+     */
+    function (field) {
+        var _this = this;
+        this.popoverField = field;
+        this.popoverVisible = true;
+        this.updatePosition();
+        setTimeout((/**
+         * @return {?}
+         */
+        function () { return _this.updatePosition(); }), 50);
+        setTimeout((/**
+         * @return {?}
+         */
+        function () { return _this.updatePosition(); }), 150);
+    };
+    /**
+     * @private
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.apply = /**
+     * @private
+     * @return {?}
+     */
+    function () {
+        /** @type {?} */
+        var filteredRows = this.filterRowsBySelectedDateTree(this.sourceRows || []);
+        this.options.applyRows(filteredRows);
+    };
+    /**
+     * @private
+     * @param {?} args
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.getRequestType = /**
+     * @private
+     * @param {?} args
+     * @return {?}
+     */
+    function (args) {
+        if (!args || !args.requestType) {
+            return "";
+        }
+        return String(args.requestType).trim().toLowerCase();
+    };
+    /**
+     * @private
+     * @param {?} args
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.resolveActionColumnName = /**
+     * @private
+     * @param {?} args
+     * @return {?}
+     */
+    function (args) {
+        if (!args) {
+            return "";
+        }
+        return (args.columnName ||
+            args.field ||
+            args.currentFilteringColumn ||
+            (args.column && (args.column.field || args.column.columnName)) ||
+            "");
+    };
+    /**
+     * @private
+     * @param {?} fields
+     * @param {?} hints
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.resolveDateTreeFieldsByHints = /**
+     * @private
+     * @param {?} fields
+     * @param {?} hints
+     * @return {?}
+     */
+    function (fields, hints) {
+        /** @type {?} */
+        var normalizedHints = (hints || [])
+            .filter((/**
+         * @param {?} item
+         * @return {?}
+         */
+        function (item) { return !!item; }))
+            .map((/**
+         * @param {?} item
+         * @return {?}
+         */
+        function (item) { return String(item).trim().toLowerCase(); }));
+        if (!fields || !fields.length || !normalizedHints.length) {
+            return [];
+        }
+        return fields
+            .filter((/**
+         * @param {?} item
+         * @return {?}
+         */
+        function (item) {
+            if (!item || !item.columnName) {
+                return false;
+            }
+            /** @type {?} */
+            var columnName = String(item.columnName || "").toLowerCase();
+            /** @type {?} */
+            var displayName = String(item.columnDisplayName || "").toLowerCase();
+            return normalizedHints.some((/**
+             * @param {?} hint
+             * @return {?}
+             */
+            function (hint) {
+                return (columnName === hint ||
+                    displayName === hint ||
+                    (hint.length >= 3 &&
+                        (columnName.indexOf(hint) > -1 ||
+                            displayName.indexOf(hint) > -1)));
+            }));
+        }))
+            .map((/**
+         * @param {?} item
+         * @return {?}
+         */
+        function (item) { return item.columnName; }));
+    };
+    /**
+     * @private
+     * @param {?} field
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.isDateTreeField = /**
+     * @private
+     * @param {?} field
+     * @return {?}
+     */
+    function (field) {
+        return this.dateFields.indexOf(field) > -1;
+    };
+    /**
+     * @private
+     * @param {?} field
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.getFieldDaySelectionMap = /**
+     * @private
+     * @param {?} field
+     * @return {?}
+     */
+    function (field) {
+        if (!this.selectedByField[field]) {
+            this.selectedByField[field] = {};
+        }
+        return this.selectedByField[field];
+    };
+    /**
+     * @private
+     * @param {?} rows
+     * @param {?=} excludeField
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.filterRowsBySelectedDateTree = /**
+     * @private
+     * @param {?} rows
+     * @param {?=} excludeField
+     * @return {?}
+     */
+    function (rows, excludeField) {
+        var _this = this;
+        /** @type {?} */
+        var filteredRows = rows ? rows.slice() : [];
+        this.dateFields.forEach((/**
+         * @param {?} field
+         * @return {?}
+         */
+        function (field) {
+            if (excludeField && field === excludeField) {
+                return;
+            }
+            /** @type {?} */
+            var selectedMap = _this.getFieldDaySelectionMap(field);
+            /** @type {?} */
+            var selectedKeys = Object.keys(selectedMap);
+            if (!selectedKeys.length) {
+                return;
+            }
+            filteredRows = filteredRows.filter((/**
+             * @param {?} row
+             * @return {?}
+             */
+            function (row) {
+                /** @type {?} */
+                var dayKey = _this.getDayKeyByRowValue(row[field]);
+                return dayKey ? !!selectedMap[dayKey] : false;
+            }));
+        }));
+        return filteredRows;
+    };
+    /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.getDayKeyByRowValue = /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    function (value) {
+        /** @type {?} */
+        var date = this.parseDateValue(value);
+        if (!date) {
+            return "";
+        }
+        return this.toDayKey(date.getFullYear(), date.getMonth() + 1, date.getDate());
+    };
+    /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.parseDateValue = /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    function (value) {
+        if (this.options.parseDateValue) {
+            return this.options.parseDateValue(value);
+        }
+        if (!value) {
+            return null;
+        }
+        if (value instanceof Date) {
+            return value;
+        }
+        /** @type {?} */
+        var formats = this.options && this.options.dateFormats && this.options.dateFormats.length
+            ? this.options.dateFormats
+            : this.defaultDateFormats;
+        /** @type {?} */
+        var parsed = moment(value, formats, true);
+        if (parsed.isValid()) {
+            return parsed.toDate();
+        }
+        /** @type {?} */
+        var fallback = new Date(value);
+        return isNaN(fallback.getTime()) ? null : fallback;
+    };
+    /**
+     * @private
+     * @param {?} year
+     * @param {?} month
+     * @param {?} day
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.toDayKey = /**
+     * @private
+     * @param {?} year
+     * @param {?} month
+     * @param {?} day
+     * @return {?}
+     */
+    function (year, month, day) {
+        return year + "-" + this.pad2(month) + "-" + this.pad2(day);
+    };
+    /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.pad2 = /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    function (value) {
+        return value < 10 ? "0" + value : String(value);
+    };
+    /**
+     * @private
+     * @param {?} target
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.isInsidePopover = /**
+     * @private
+     * @param {?} target
+     * @return {?}
+     */
+    function (target) {
+        /** @type {?} */
+        var popoverElement = this.options.getPopoverElement
+            ? this.options.getPopoverElement()
+            : null;
+        if (!target || !popoverElement) {
+            return false;
+        }
+        return popoverElement.contains(target);
+    };
+    /**
+     * @private
+     * @param {?} element
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.isDateFilterMenuItem = /**
+     * @private
+     * @param {?} element
+     * @return {?}
+     */
+    function (element) {
+        if (!element) {
+            return false;
+        }
+        /** @type {?} */
+        var menuItem = (/** @type {?} */ (element.closest(".e-menu-item")));
+        if (!menuItem) {
+            return false;
+        }
+        /** @type {?} */
+        var text = (menuItem.textContent || "").trim().toLowerCase();
+        /** @type {?} */
+        var translation = this.options.getTranslation
+            ? this.options.getTranslation()
+            : null;
+        /** @type {?} */
+        var filterText = String((translation && translation.FILTER) || "filter")
+            .trim()
+            .toLowerCase();
+        if (!text) {
+            return false;
+        }
+        if (text.indexOf(filterText) > -1 || text.indexOf("filter") > -1) {
+            return true;
+        }
+        /** @type {?} */
+        var cls = (menuItem.className || "").toLowerCase();
+        return cls.indexOf("filter") > -1;
+    };
+    /**
+     * @private
+     * @return {?}
+     */
+    DateTreeFilterHelper.prototype.findDateFilterAnchorElement = /**
+     * @private
+     * @return {?}
+     */
+    function () {
+        var _this = this;
+        /** @type {?} */
+        var menuContainers = (/** @type {?} */ (Array.from(document.querySelectorAll(".e-columnmenu, .e-contextmenu"))));
+        /** @type {?} */
+        var visibleContainers = menuContainers.filter((/**
+         * @param {?} container
+         * @return {?}
+         */
+        function (container) {
+            if (!container || !container.getBoundingClientRect) {
+                return false;
+            }
+            /** @type {?} */
+            var rect = container.getBoundingClientRect();
+            if (rect.width <= 0 || rect.height <= 0) {
+                return false;
+            }
+            /** @type {?} */
+            var style = window.getComputedStyle(container);
+            if (!style || style.display === "none" || style.visibility === "hidden") {
+                return false;
+            }
+            return true;
+        }));
+        if (!visibleContainers.length) {
+            return null;
+        }
+        /** @type {?} */
+        var currentContainer = visibleContainers[visibleContainers.length - 1];
+        /** @type {?} */
+        var menuItems = (/** @type {?} */ (Array.from(currentContainer.querySelectorAll(".e-menu-item"))));
+        /** @type {?} */
+        var visibleFilterItems = menuItems.filter((/**
+         * @param {?} item
+         * @return {?}
+         */
+        function (item) {
+            if (!_this.isDateFilterMenuItem(item)) {
+                return false;
+            }
+            if (!item.getBoundingClientRect) {
+                return false;
+            }
+            /** @type {?} */
+            var rect = item.getBoundingClientRect();
+            return rect.width > 0 && rect.height > 0;
+        }));
+        if (!visibleFilterItems.length) {
+            return null;
+        }
+        /** @type {?} */
+        var focusedItem = visibleFilterItems.find((/**
+         * @param {?} item
+         * @return {?}
+         */
+        function (item) {
+            return (item.classList.contains("e-focused") ||
+                item.classList.contains("e-selected") ||
+                item.classList.contains("e-hover"));
+        }));
+        return focusedItem || visibleFilterItems[visibleFilterItems.length - 1];
+    };
+    return DateTreeFilterHelper;
+}());
+if (false) {
+    /** @type {?} */
+    DateTreeFilterHelper.prototype.popoverVisible;
+    /** @type {?} */
+    DateTreeFilterHelper.prototype.popoverField;
+    /** @type {?} */
+    DateTreeFilterHelper.prototype.popoverStyle;
+    /** @type {?} */
+    DateTreeFilterHelper.prototype.selectedByField;
+    /** @type {?} */
+    DateTreeFilterHelper.prototype.fieldLabelMap;
+    /** @type {?} */
+    DateTreeFilterHelper.prototype.dateFields;
+    /**
+     * @type {?}
+     * @private
+     */
+    DateTreeFilterHelper.prototype.sourceRows;
+    /**
+     * @type {?}
+     * @private
+     */
+    DateTreeFilterHelper.prototype.options;
+    /**
+     * @type {?}
+     * @private
+     */
+    DateTreeFilterHelper.prototype.defaultDateFormats;
+}
+/**
+ * @param {?} host
+ * @return {?}
+ */
+function resolveGridElement(host) {
+    if (!host || !host.grid) {
+        return null;
+    }
+    /** @type {?} */
+    var gridRef = host.grid;
+    if (gridRef.grid && gridRef.grid.element) {
+        return gridRef.grid.element;
+    }
+    if (gridRef.element) {
+        return gridRef.element;
+    }
+    return null;
+}
+/**
+ * @param {?} host
+ * @param {?} applyRows
+ * @param {?=} dateFormats
+ * @return {?}
+ */
+function createRsCommonGridDateTreeHelper(host, applyRows, dateFormats) {
+    return new DateTreeFilterHelper({
+        getTranslation: (/**
+         * @return {?}
+         */
+        function () { return (host ? host.translation : null); }),
+        getPopoverElement: (/**
+         * @return {?}
+         */
+        function () {
+            return host && host.dateTreePopoverRef
+                ? host.dateTreePopoverRef.nativeElement
+                : null;
+        }),
+        getGridElement: (/**
+         * @return {?}
+         */
+        function () { return resolveGridElement(host); }),
+        applyRows: applyRows,
+        dateFormats: dateFormats && dateFormats.length
+            ? dateFormats
+            : DATE_TREE_DEFAULT_DATE_FORMATS,
+    });
+}
+
 /**
  * @fileoverview added by tsickle
  * Generated from: lib/common-grid/index.component.ts
@@ -84,6 +869,7 @@ function getTranslation() {
  */
 var CommonGridComponent = /** @class */ (function () {
     function CommonGridComponent(ref) {
+        var _this = this;
         this.ref = ref;
         this.showCheckBox = true;
         this.loaded = true;
@@ -130,6 +916,23 @@ var CommonGridComponent = /** @class */ (function () {
         this.alwaysShowCheckbox = false;
         this.disableSystemRow = false; // 禁用IsSytem = true的整行
         // 禁用IsSytem = true的整行
+        /**
+         * 开启日期树筛选（默认关闭，不影响现有页面）
+         */
+        this.enableDateTreeFilter = false;
+        /**
+         * 参与日期树筛选的列名或 hint，如 ['CreatedOn', 'ModifiedOn']
+         */
+        this.dateTreeFilterFields = [];
+        /**
+         * 未筛选原始数据（可选）。
+         * 不传时由组件在 dataSource 变更时自动快照；传则由页面自行维护 raw。
+         */
+        this.dateTreeSourceRows = null;
+        /**
+         * 内聚模式下仍向页面同步筛选结果（默认 false，一般无需绑定）
+         */
+        this.dateTreeEmitFilteredRows = false;
         this.recordDoubleClick = new EventEmitter();
         this.actionComplete = new EventEmitter();
         this.rowSelected = new EventEmitter();
@@ -147,6 +950,16 @@ var CommonGridComponent = /** @class */ (function () {
         this.rowDrop = new EventEmitter();
         this.rowDrag = new EventEmitter();
         this.rowDragStart = new EventEmitter();
+        /**
+         * 日期树筛选后的行数据（可选，复杂页面与 dateTreeSourceRows 搭配使用）
+         */
+        this.dateTreeFilteredRows = new EventEmitter();
+        /**
+         * 内聚模式：表格实际绑定的数据
+         */
+        this.dateTreeDisplayRows = [];
+        this.dateTreeRawRows = [];
+        this.dateTreeApplyingFilter = false;
         this.selectId = [];
         this.startPaging = false;
         this.indexList = [];
@@ -174,6 +987,11 @@ var CommonGridComponent = /** @class */ (function () {
             return list;
         });
         this.translation = getTranslation();
+        this.dateTreeHelper = createRsCommonGridDateTreeHelper(this, (/**
+         * @param {?} rows
+         * @return {?}
+         */
+        function (rows) { return _this.onDateTreeRowsApplied(rows); }));
     }
     /**
      * @return {?}
@@ -201,6 +1019,36 @@ var CommonGridComponent = /** @class */ (function () {
     function (index, item) {
         return index; // or a unique identifier in your object
     };
+    Object.defineProperty(CommonGridComponent.prototype, "gridBindDataSource", {
+        /** ejs-grid 绑定数据源：内聚模式用内部展示数据，否则用 dataSource */
+        get: /**
+         * ejs-grid 绑定数据源：内聚模式用内部展示数据，否则用 dataSource
+         * @return {?}
+         */
+        function () {
+            if (this.enableDateTreeFilter && this.dateTreeSourceRows == null) {
+                return this.dateTreeDisplayRows;
+            }
+            return this.dataSource;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(CommonGridComponent.prototype, "dateTreePopoverSourceRows", {
+        /** 日期树 popover 用的全量数据 */
+        get: /**
+         * 日期树 popover 用的全量数据
+         * @return {?}
+         */
+        function () {
+            if (this.dateTreeSourceRows != null) {
+                return this.dateTreeSourceRows;
+            }
+            return this.dateTreeRawRows;
+        },
+        enumerable: true,
+        configurable: true
+    });
     /**
      * @param {?} changes
      * @return {?}
@@ -210,12 +1058,16 @@ var CommonGridComponent = /** @class */ (function () {
      * @return {?}
      */
     function (changes) {
-        if (changes.dataSource && changes.dataSource.currentValue) {
+        /** @type {?} */
+        var bindRows = changes.dataSource && changes.dataSource.currentValue
+            ? changes.dataSource.currentValue
+            : null;
+        if (bindRows) {
             if (this.allowPaging &&
-                changes.dataSource.currentValue.length &&
+                bindRows.length &&
                 !this.pageSettings) {
                 this.pageSettings =
-                    changes.dataSource.currentValue.length > 9
+                    bindRows.length > 9
                         ? {
                             pageSizes: ["All", "25", "50", "100"],
                             pageSize: 50,
@@ -223,11 +1075,123 @@ var CommonGridComponent = /** @class */ (function () {
                         : null;
             }
         }
+        if (this.enableDateTreeFilter &&
+            this.dateTreeSourceRows == null &&
+            changes.dataSource &&
+            !this.dateTreeApplyingFilter) {
+            this.captureDateTreeRawFromDataSource(changes.dataSource.currentValue);
+        }
+        if (changes.enableDateTreeFilter && changes.enableDateTreeFilter.currentValue) {
+            this.captureDateTreeRawFromDataSource(this.dataSource);
+        }
+        if (changes.enableDateTreeFilter && !changes.enableDateTreeFilter.currentValue) {
+            this.dateTreeHelper && this.dateTreeHelper.close();
+            this.dateTreeDisplayRows = [];
+            this.dateTreeRawRows = [];
+        }
+        if (this.enableDateTreeFilter &&
+            (changes.enableDateTreeFilter ||
+                changes.dateTreeFilterFields ||
+                changes.dateTreeSourceRows ||
+                changes.fields ||
+                changes.dataSource)) {
+            this.refreshDateTreeFilter();
+        }
     };
     /**
+     * @private
+     * @param {?} rows
      * @return {?}
      */
-    CommonGridComponent.prototype._load = /**
+    CommonGridComponent.prototype.captureDateTreeRawFromDataSource = /**
+     * @private
+     * @param {?} rows
+     * @return {?}
+     */
+    function (rows) {
+        this.dateTreeRawRows = rows ? rows.slice() : [];
+    };
+    /**
+     * @param {?} event
+     * @return {?}
+     */
+    CommonGridComponent.prototype.onDocumentMouseDown = /**
+     * @param {?} event
+     * @return {?}
+     */
+    function (event) {
+        if (this.enableDateTreeFilter && this.dateTreeHelper) {
+            this.dateTreeHelper.handleDocumentMouseDown(event);
+        }
+    };
+    /**
+     * @param {?} event
+     * @return {?}
+     */
+    CommonGridComponent.prototype.onDocumentMouseOver = /**
+     * @param {?} event
+     * @return {?}
+     */
+    function (event) {
+        if (this.enableDateTreeFilter && this.dateTreeHelper) {
+            this.dateTreeHelper.handleDocumentMouseOver(event);
+        }
+    };
+    /**
+     * @private
+     * @return {?}
+     */
+    CommonGridComponent.prototype.refreshDateTreeFilter = /**
+     * @private
+     * @return {?}
+     */
+    function () {
+        if (!this.enableDateTreeFilter || !this.dateTreeHelper) {
+            return;
+        }
+        /** @type {?} */
+        var rows = this.dateTreeSourceRows != null
+            ? this.dateTreeSourceRows
+            : this.dateTreeRawRows || [];
+        this.dateTreeHelper.setup({
+            rows: rows,
+            fields: this.fields || [],
+            hints: this.dateTreeFilterFields || [],
+        });
+    };
+    /**
+     * @private
+     * @param {?} rows
+     * @return {?}
+     */
+    CommonGridComponent.prototype.onDateTreeRowsApplied = /**
+     * @private
+     * @param {?} rows
+     * @return {?}
+     */
+    function (rows) {
+        var _this = this;
+        /** @type {?} */
+        var result = rows || [];
+        this.dateTreeApplyingFilter = true;
+        if (this.enableDateTreeFilter && this.dateTreeSourceRows == null) {
+            this.dateTreeDisplayRows = result;
+        }
+        if (this.dateTreeSourceRows != null || this.dateTreeEmitFilteredRows) {
+            this.dateTreeFilteredRows.emit(result);
+        }
+        this.ref && this.ref.markForCheck();
+        setTimeout((/**
+         * @return {?}
+         */
+        function () {
+            _this.dateTreeApplyingFilter = false;
+        }), 0);
+    };
+    /**
+     * @return {?}
+     */
+    CommonGridComponent.prototype._load = /**
      * @return {?}
      */
     function () {
@@ -481,7 +1445,10 @@ var CommonGridComponent = /** @class */ (function () {
                 args.requestType === "sorting")) {
             this.startPaging = true;
         }
-        if (args.requestType == "filterchoicerequest" ||
+        if (this.enableDateTreeFilter && this.dateTreeHelper) {
+            this.dateTreeHelper.handleGridActionBegin(args);
+        }
+        else if (args.requestType == "filterchoicerequest" ||
             args.requestType === "filtersearchbegin") {
             args.filterChoiceCount = 15000;
         }
@@ -854,7 +1821,7 @@ var CommonGridComponent = /** @class */ (function () {
     CommonGridComponent.decorators = [
         { type: Component, args: [{
                     selector: "rs-common-grid",
-                    template: "<ejs-grid\r\n  #grid\r\n  [id]=\"gridId\"\r\n  [ngClass]=\"{\r\n    'hide-Check-box': !alwaysShowCheckbox,\r\n    'grid-loading': className === 'grid-loading'\r\n  }\"\r\n  [dataSource]=\"dataSource\"\r\n  [allowPaging]=\"allowPaging && pageSettings\"\r\n  [allowResizing]=\"true\"\r\n  [pageSettings]=\"pageSettings\"\r\n  [showColumnMenu]=\"true\"\r\n  [allowSorting]=\"true\"\r\n  [allowFiltering]=\"true\"\r\n  [allowExcelExport]=\"true\"\r\n  [allowRowDragAndDrop]=\"allowRowDragAndDrop\"\r\n  [filterSettings]=\"filterSettings\"\r\n  [resizeSettings]=\"resizeSettings\"\r\n  [allowSelection]=\"true\"\r\n  [editSettings]=\"editSettings\"\r\n  [childGrid]=\"childGrid\"\r\n  [contextMenuItems]=\"dataSource && dataSource.length ? contextMenuItems : null\"\r\n  [selectionSettings]=\"selectionSettings\"\r\n  (recordClick)=\"_recordClick($event)\"\r\n  (recordDoubleClick)=\"_recordDoubleClick($event)\"\r\n  (actionBegin)=\"_actionBegin($event)\"\r\n  (actionComplete)=\"_actionHandler($event)\"\r\n  (rowSelected)=\"_rowSelected($event)\"\r\n  (rowDeselecting)=\"_rowDeselecting($event)\"\r\n  (rowDeselected)=\"_rowDeselected($event)\"\r\n  style=\"border: none\"\r\n  (contextMenuClick)=\"_onContextMenu($event)\"\r\n  (contextMenuOpen)=\"contextMenuOpen($event)\"\r\n  (queryCellInfo)=\"customiseCell($event)\"\r\n  (dataBound)=\"_dataBound($event)\"\r\n  (rowDataBound)=\"_rowDataBound($event)\"\r\n  (rowSelecting)=\"_rowSelecting($event)\"\r\n  (excelQueryCellInfo)=\"_exportQueryCellInfo($event)\"\r\n  (rowDrop)=\"onRowDrop($event)\"\r\n  (rowDragStart)=\"_rowDragStart($event)\"\r\n  (rowDrag)=\"_rowDrag($event)\"\r\n  (load)=\"_load()\"\r\n  [frozenColumns]=\"frozenColumns\"\r\n  [columnChooserSettings]=\"columnChooserSettings\"\r\n>\r\n  <e-columns>\r\n    <e-column\r\n      *ngIf=\"showCheckBox\"\r\n      type=\"checkbox\"\r\n      [width]=\"checkBoxWidth\"\r\n      [minWidth]=\"checkBoxWidth\"\r\n      [showColumnMenu]=\"false\"\r\n      [allowResizing]=\"false\"\r\n    ></e-column>\r\n    <e-column\r\n      *ngFor=\"let item of fields; trackBy: trackByFn; let last = last\"\r\n      [field]=\"item.columnName\"\r\n      [filter]=\"item.filter ? item.filter : { type: 'CheckBox' }\"\r\n      [customAttributes]=\"\r\n        item.colName === 'entityUserList' || item.colName === 'kycProgress'\r\n          ? { class: 'hideColumnFilterClass' }\r\n          : {}\r\n      \"\r\n      [headerText]=\"item.columnDisplayName\"\r\n      [textAlign]=\"item.textAlign\"\r\n      [showColumnMenu]=\"item.showColumnMenu === undefined ? true : false\"\r\n      [allowFiltering]=\"item.allowFiltering === undefined ? true : false\"\r\n      [allowSorting]=\"item.allowSorting === undefined ? true : false\"\r\n      [showInColumnChooser]=\"\r\n        item.showInColumnChooser === undefined ? true : item.showInColumnChooser\r\n      \"\r\n      [editType]=\"item.editType\"\r\n      [validationRules]=\"item.validationRules\"\r\n      [type]=\"item.dataType || 'string'\"\r\n      [width]=\"item.width\"\r\n      [minWidth]=\"item.minWidth\"\r\n      [format]=\"item.format\"\r\n      [visible]=\"item.visible\"\r\n      [template]=\"item.showTemplate ? columnTemplate : undefined\"\r\n      [clipMode]=\"\r\n        item.clipMode ? item.clipMode : clipMode || 'EllipsisWithTooltip'\r\n      \"\r\n      [sortComparer]=\"item.dateComparer || null\"\r\n      [allowResizing]=\"!last\"\r\n      [headerTemplate]=\"item.showHeaderTemplate ? headerTemplate : undefined\"\r\n      [isPrimaryKey]=\"item?.isPrimaryKey ? true : false\"\r\n    >\r\n    </e-column>\r\n  </e-columns>\r\n</ejs-grid>\r\n",
+                    template: "<rs-date-tree-filter-popover\r\n  *ngIf=\"enableDateTreeFilter && dateTreeHelper && dateTreeHelper.popoverVisible\"\r\n  #dateTreePopoverRef\r\n  [ngStyle]=\"dateTreeHelper.popoverStyle\"\r\n  [field]=\"dateTreeHelper.popoverField\"\r\n  [translation]=\"translation\"\r\n  [sourceRows]=\"dateTreePopoverSourceRows\"\r\n  [dateFields]=\"dateTreeHelper.dateFields\"\r\n  [selectedByField]=\"dateTreeHelper.selectedByField\"\r\n  [fieldLabelMap]=\"dateTreeHelper.fieldLabelMap\"\r\n  (apply)=\"dateTreeHelper.updateSelection($event)\"\r\n  (close)=\"dateTreeHelper.close()\"\r\n></rs-date-tree-filter-popover>\r\n<ejs-grid\r\n  #grid\r\n  [id]=\"gridId\"\r\n  [ngClass]=\"{\r\n    'hide-Check-box': !alwaysShowCheckbox,\r\n    'grid-loading': className === 'grid-loading'\r\n  }\"\r\n  [dataSource]=\"gridBindDataSource\"\r\n  [allowPaging]=\"allowPaging && pageSettings\"\r\n  [allowResizing]=\"true\"\r\n  [pageSettings]=\"pageSettings\"\r\n  [showColumnMenu]=\"true\"\r\n  [allowSorting]=\"true\"\r\n  [allowFiltering]=\"true\"\r\n  [allowExcelExport]=\"true\"\r\n  [allowRowDragAndDrop]=\"allowRowDragAndDrop\"\r\n  [filterSettings]=\"filterSettings\"\r\n  [resizeSettings]=\"resizeSettings\"\r\n  [allowSelection]=\"true\"\r\n  [editSettings]=\"editSettings\"\r\n  [childGrid]=\"childGrid\"\r\n  [contextMenuItems]=\"gridBindDataSource && gridBindDataSource.length ? contextMenuItems : null\"\r\n  [selectionSettings]=\"selectionSettings\"\r\n  (recordClick)=\"_recordClick($event)\"\r\n  (recordDoubleClick)=\"_recordDoubleClick($event)\"\r\n  (actionBegin)=\"_actionBegin($event)\"\r\n  (actionComplete)=\"_actionHandler($event)\"\r\n  (rowSelected)=\"_rowSelected($event)\"\r\n  (rowDeselecting)=\"_rowDeselecting($event)\"\r\n  (rowDeselected)=\"_rowDeselected($event)\"\r\n  style=\"border: none\"\r\n  (contextMenuClick)=\"_onContextMenu($event)\"\r\n  (contextMenuOpen)=\"contextMenuOpen($event)\"\r\n  (queryCellInfo)=\"customiseCell($event)\"\r\n  (dataBound)=\"_dataBound($event)\"\r\n  (rowDataBound)=\"_rowDataBound($event)\"\r\n  (rowSelecting)=\"_rowSelecting($event)\"\r\n  (excelQueryCellInfo)=\"_exportQueryCellInfo($event)\"\r\n  (rowDrop)=\"onRowDrop($event)\"\r\n  (rowDragStart)=\"_rowDragStart($event)\"\r\n  (rowDrag)=\"_rowDrag($event)\"\r\n  (load)=\"_load()\"\r\n  [frozenColumns]=\"frozenColumns\"\r\n  [columnChooserSettings]=\"columnChooserSettings\"\r\n>\r\n  <e-columns>\r\n    <e-column\r\n      *ngIf=\"showCheckBox\"\r\n      type=\"checkbox\"\r\n      [width]=\"checkBoxWidth\"\r\n      [minWidth]=\"checkBoxWidth\"\r\n      [showColumnMenu]=\"false\"\r\n      [allowResizing]=\"false\"\r\n    ></e-column>\r\n    <e-column\r\n      *ngFor=\"let item of fields; trackBy: trackByFn; let last = last\"\r\n      [field]=\"item.columnName\"\r\n      [filter]=\"item.filter ? item.filter : { type: 'CheckBox' }\"\r\n      [customAttributes]=\"\r\n        item.colName === 'entityUserList' || item.colName === 'kycProgress'\r\n          ? { class: 'hideColumnFilterClass' }\r\n          : {}\r\n      \"\r\n      [headerText]=\"item.columnDisplayName\"\r\n      [textAlign]=\"item.textAlign\"\r\n      [showColumnMenu]=\"item.showColumnMenu === undefined ? true : false\"\r\n      [allowFiltering]=\"item.allowFiltering === undefined ? true : false\"\r\n      [allowSorting]=\"item.allowSorting === undefined ? true : false\"\r\n      [showInColumnChooser]=\"\r\n        item.showInColumnChooser === undefined ? true : item.showInColumnChooser\r\n      \"\r\n      [editType]=\"item.editType\"\r\n      [validationRules]=\"item.validationRules\"\r\n      [type]=\"item.dataType || 'string'\"\r\n      [width]=\"item.width\"\r\n      [minWidth]=\"item.minWidth\"\r\n      [format]=\"item.format\"\r\n      [visible]=\"item.visible\"\r\n      [template]=\"item.showTemplate ? columnTemplate : undefined\"\r\n      [clipMode]=\"\r\n        item.clipMode ? item.clipMode : clipMode || 'EllipsisWithTooltip'\r\n      \"\r\n      [sortComparer]=\"item.dateComparer || null\"\r\n      [allowResizing]=\"!last\"\r\n      [headerTemplate]=\"item.showHeaderTemplate ? headerTemplate : undefined\"\r\n      [isPrimaryKey]=\"item?.isPrimaryKey ? true : false\"\r\n    >\r\n    </e-column>\r\n  </e-columns>\r\n</ejs-grid>\r\n",
                     styles: [""]
                 }] }
     ];
@@ -892,6 +1859,10 @@ var CommonGridComponent = /** @class */ (function () {
         alwaysShowCheckbox: [{ type: Input }],
         defaultRecord: [{ type: Input }],
         disableSystemRow: [{ type: Input }],
+        enableDateTreeFilter: [{ type: Input }],
+        dateTreeFilterFields: [{ type: Input }],
+        dateTreeSourceRows: [{ type: Input }],
+        dateTreeEmitFilteredRows: [{ type: Input }],
         recordDoubleClick: [{ type: Output }],
         actionComplete: [{ type: Output }],
         rowSelected: [{ type: Output }],
@@ -908,7 +1879,11 @@ var CommonGridComponent = /** @class */ (function () {
         rowSelecting: [{ type: Output }],
         rowDrop: [{ type: Output }],
         rowDrag: [{ type: Output }],
-        rowDragStart: [{ type: Output }]
+        rowDragStart: [{ type: Output }],
+        dateTreeFilteredRows: [{ type: Output }],
+        dateTreePopoverRef: [{ type: ViewChild, args: ["dateTreePopoverRef", { read: ElementRef, static: false },] }],
+        onDocumentMouseDown: [{ type: HostListener, args: ["document:mousedown", ["$event"],] }],
+        onDocumentMouseOver: [{ type: HostListener, args: ["document:mouseover", ["$event"],] }]
     };
     return CommonGridComponent;
 }());
@@ -988,6 +1963,27 @@ if (false) {
     CommonGridComponent.prototype.defaultRecord;
     /** @type {?} */
     CommonGridComponent.prototype.disableSystemRow;
+    /**
+     * 开启日期树筛选（默认关闭，不影响现有页面）
+     * @type {?}
+     */
+    CommonGridComponent.prototype.enableDateTreeFilter;
+    /**
+     * 参与日期树筛选的列名或 hint，如 ['CreatedOn', 'ModifiedOn']
+     * @type {?}
+     */
+    CommonGridComponent.prototype.dateTreeFilterFields;
+    /**
+     * 未筛选原始数据（可选）。
+     * 不传时由组件在 dataSource 变更时自动快照；传则由页面自行维护 raw。
+     * @type {?}
+     */
+    CommonGridComponent.prototype.dateTreeSourceRows;
+    /**
+     * 内聚模式下仍向页面同步筛选结果（默认 false，一般无需绑定）
+     * @type {?}
+     */
+    CommonGridComponent.prototype.dateTreeEmitFilteredRows;
     /** @type {?} */
     CommonGridComponent.prototype.recordDoubleClick;
     /** @type {?} */
@@ -1022,6 +2018,30 @@ if (false) {
     CommonGridComponent.prototype.rowDrag;
     /** @type {?} */
     CommonGridComponent.prototype.rowDragStart;
+    /**
+     * 日期树筛选后的行数据（可选，复杂页面与 dateTreeSourceRows 搭配使用）
+     * @type {?}
+     */
+    CommonGridComponent.prototype.dateTreeFilteredRows;
+    /** @type {?} */
+    CommonGridComponent.prototype.dateTreePopoverRef;
+    /** @type {?} */
+    CommonGridComponent.prototype.dateTreeHelper;
+    /**
+     * 内聚模式：表格实际绑定的数据
+     * @type {?}
+     */
+    CommonGridComponent.prototype.dateTreeDisplayRows;
+    /**
+     * @type {?}
+     * @private
+     */
+    CommonGridComponent.prototype.dateTreeRawRows;
+    /**
+     * @type {?}
+     * @private
+     */
+    CommonGridComponent.prototype.dateTreeApplyingFilter;
     /** @type {?} */
     CommonGridComponent.prototype.selectId;
     /** @type {?} */
@@ -1161,6 +2181,905 @@ if (false) {
     GridActionItemComponent.prototype.ImageType;
 }
 
+/**
+ * @fileoverview added by tsickle
+ * Generated from: lib/date-tree-filter/date-tree-filter-popover/index.component.ts
+ * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+var DateTreeFilterPopoverComponent = /** @class */ (function () {
+    function DateTreeFilterPopoverComponent() {
+        this.field = "";
+        this.sourceRows = [];
+        this.dateFields = [];
+        this.selectedByField = {};
+        this.fieldLabelMap = {};
+        this.apply = new EventEmitter();
+        this.close = new EventEmitter();
+        this.keyword = "";
+        this.years = [];
+        this.expandStateByField = {};
+        this.workingSelectedByField = {};
+    }
+    /**
+     * @param {?} changes
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.ngOnChanges = /**
+     * @param {?} changes
+     * @return {?}
+     */
+    function (changes) {
+        if (changes.field ||
+            changes.sourceRows ||
+            changes.selectedByField ||
+            changes.dateFields) {
+            this.keyword = "";
+            this.workingSelectedByField = this.cloneSelectionMap(this.selectedByField);
+            this.rebuildTree();
+        }
+    };
+    /**
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.closePopover = /**
+     * @return {?}
+     */
+    function () {
+        this.close.emit();
+    };
+    /**
+     * @param {?} value
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.onKeywordChange = /**
+     * @param {?} value
+     * @return {?}
+     */
+    function (value) {
+        this.keyword = value || "";
+    };
+    /**
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.getVisibleYears = /**
+     * @return {?}
+     */
+    function () {
+        /** @type {?} */
+        var searchText = (this.keyword || "").trim().toLowerCase();
+        if (!searchText) {
+            return this.years;
+        }
+        return this.years
+            .map((/**
+         * @param {?} yearNode
+         * @return {?}
+         */
+        function (yearNode) {
+            /** @type {?} */
+            var yearMatched = String(yearNode.year).toLowerCase().indexOf(searchText) > -1;
+            /** @type {?} */
+            var months = yearNode.months
+                .map((/**
+             * @param {?} monthNode
+             * @return {?}
+             */
+            function (monthNode) {
+                /** @type {?} */
+                var monthMatched = String(monthNode.label)
+                    .toLowerCase()
+                    .indexOf(searchText) > -1;
+                /** @type {?} */
+                var days = monthNode.days.filter((/**
+                 * @param {?} dayNode
+                 * @return {?}
+                 */
+                function (dayNode) {
+                    return (String(dayNode.label)
+                        .toLowerCase()
+                        .indexOf(searchText) > -1);
+                }));
+                if (yearMatched || monthMatched) {
+                    return monthNode;
+                }
+                return Object.assign({}, monthNode, { days: days });
+            }))
+                .filter((/**
+             * @param {?} monthNode
+             * @return {?}
+             */
+            function (monthNode) { return monthNode.days.length > 0; }));
+            if (yearMatched) {
+                return yearNode;
+            }
+            return Object.assign({}, yearNode, { months: months });
+        }))
+            .filter((/**
+         * @param {?} yearNode
+         * @return {?}
+         */
+        function (yearNode) { return yearNode.months.length > 0; }));
+    };
+    /**
+     * @param {?} yearNode
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.toggleYearExpanded = /**
+     * @param {?} yearNode
+     * @return {?}
+     */
+    function (yearNode) {
+        /** @type {?} */
+        var state = this.getOrCreateExpandState(this.field);
+        state.years[yearNode.key] = !state.years[yearNode.key];
+        yearNode.expanded = !!state.years[yearNode.key];
+    };
+    /**
+     * @param {?} monthNode
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.toggleMonthExpanded = /**
+     * @param {?} monthNode
+     * @return {?}
+     */
+    function (monthNode) {
+        /** @type {?} */
+        var state = this.getOrCreateExpandState(this.field);
+        state.months[monthNode.key] = !state.months[monthNode.key];
+        monthNode.expanded = !!state.months[monthNode.key];
+    };
+    /**
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.isAllChecked = /**
+     * @return {?}
+     */
+    function () {
+        /** @type {?} */
+        var selectedMap = this.getFieldDaySelectionMap(this.field);
+        /** @type {?} */
+        var enabledDayKeys = this.getEnabledDayKeysInCurrentField();
+        if (!enabledDayKeys.length) {
+            return false;
+        }
+        return enabledDayKeys.every((/**
+         * @param {?} key
+         * @return {?}
+         */
+        function (key) { return !!selectedMap[key]; }));
+    };
+    /**
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.isAllIndeterminate = /**
+     * @return {?}
+     */
+    function () {
+        /** @type {?} */
+        var selectedMap = this.getFieldDaySelectionMap(this.field);
+        /** @type {?} */
+        var enabledDayKeys = this.getEnabledDayKeysInCurrentField();
+        if (!enabledDayKeys.length) {
+            return false;
+        }
+        /** @type {?} */
+        var selectedCount = enabledDayKeys.filter((/**
+         * @param {?} key
+         * @return {?}
+         */
+        function (key) { return !!selectedMap[key]; }))
+            .length;
+        return selectedCount > 0 && selectedCount < enabledDayKeys.length;
+    };
+    /**
+     * @param {?} checked
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.toggleAllDays = /**
+     * @param {?} checked
+     * @return {?}
+     */
+    function (checked) {
+        /** @type {?} */
+        var selectedMap = this.getFieldDaySelectionMap(this.field);
+        /** @type {?} */
+        var enabledDayKeys = this.getEnabledDayKeysInCurrentField();
+        enabledDayKeys.forEach((/**
+         * @param {?} key
+         * @return {?}
+         */
+        function (key) {
+            if (checked) {
+                selectedMap[key] = true;
+            }
+            else {
+                delete selectedMap[key];
+            }
+        }));
+    };
+    /**
+     * @param {?} dayNode
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.isDayChecked = /**
+     * @param {?} dayNode
+     * @return {?}
+     */
+    function (dayNode) {
+        /** @type {?} */
+        var selectedMap = this.getFieldDaySelectionMap(this.field);
+        return !!selectedMap[dayNode.key];
+    };
+    /**
+     * @param {?} dayNode
+     * @param {?} checked
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.toggleDay = /**
+     * @param {?} dayNode
+     * @param {?} checked
+     * @return {?}
+     */
+    function (dayNode, checked) {
+        if (dayNode.disabled) {
+            return;
+        }
+        /** @type {?} */
+        var selectedMap = this.getFieldDaySelectionMap(this.field);
+        if (checked) {
+            selectedMap[dayNode.key] = true;
+        }
+        else {
+            delete selectedMap[dayNode.key];
+        }
+    };
+    /**
+     * @param {?} monthNode
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.isMonthDisabled = /**
+     * @param {?} monthNode
+     * @return {?}
+     */
+    function (monthNode) {
+        return monthNode.days.every((/**
+         * @param {?} dayNode
+         * @return {?}
+         */
+        function (dayNode) { return dayNode.disabled; }));
+    };
+    /**
+     * @param {?} monthNode
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.isMonthChecked = /**
+     * @param {?} monthNode
+     * @return {?}
+     */
+    function (monthNode) {
+        if (this.isMonthDisabled(monthNode)) {
+            return false;
+        }
+        /** @type {?} */
+        var selectedMap = this.getFieldDaySelectionMap(this.field);
+        /** @type {?} */
+        var enabledDays = monthNode.days.filter((/**
+         * @param {?} dayNode
+         * @return {?}
+         */
+        function (dayNode) { return !dayNode.disabled; }));
+        return enabledDays.every((/**
+         * @param {?} dayNode
+         * @return {?}
+         */
+        function (dayNode) { return !!selectedMap[dayNode.key]; }));
+    };
+    /**
+     * @param {?} monthNode
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.isMonthIndeterminate = /**
+     * @param {?} monthNode
+     * @return {?}
+     */
+    function (monthNode) {
+        if (this.isMonthDisabled(monthNode)) {
+            return false;
+        }
+        /** @type {?} */
+        var selectedMap = this.getFieldDaySelectionMap(this.field);
+        /** @type {?} */
+        var enabledDays = monthNode.days.filter((/**
+         * @param {?} dayNode
+         * @return {?}
+         */
+        function (dayNode) { return !dayNode.disabled; }));
+        /** @type {?} */
+        var selectedCount = enabledDays.filter((/**
+         * @param {?} dayNode
+         * @return {?}
+         */
+        function (dayNode) {
+            return !!selectedMap[dayNode.key];
+        })).length;
+        return selectedCount > 0 && selectedCount < enabledDays.length;
+    };
+    /**
+     * @param {?} monthNode
+     * @param {?} checked
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.toggleMonth = /**
+     * @param {?} monthNode
+     * @param {?} checked
+     * @return {?}
+     */
+    function (monthNode, checked) {
+        if (this.isMonthDisabled(monthNode)) {
+            return;
+        }
+        /** @type {?} */
+        var selectedMap = this.getFieldDaySelectionMap(this.field);
+        monthNode.days.forEach((/**
+         * @param {?} dayNode
+         * @return {?}
+         */
+        function (dayNode) {
+            if (dayNode.disabled) {
+                return;
+            }
+            if (checked) {
+                selectedMap[dayNode.key] = true;
+            }
+            else {
+                delete selectedMap[dayNode.key];
+            }
+        }));
+    };
+    /**
+     * @param {?} yearNode
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.isYearDisabled = /**
+     * @param {?} yearNode
+     * @return {?}
+     */
+    function (yearNode) {
+        var _this = this;
+        return yearNode.months.every((/**
+         * @param {?} monthNode
+         * @return {?}
+         */
+        function (monthNode) {
+            return _this.isMonthDisabled(monthNode);
+        }));
+    };
+    /**
+     * @param {?} yearNode
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.isYearChecked = /**
+     * @param {?} yearNode
+     * @return {?}
+     */
+    function (yearNode) {
+        var _this = this;
+        if (this.isYearDisabled(yearNode)) {
+            return false;
+        }
+        /** @type {?} */
+        var enabledMonths = yearNode.months.filter((/**
+         * @param {?} monthNode
+         * @return {?}
+         */
+        function (monthNode) { return !_this.isMonthDisabled(monthNode); }));
+        return enabledMonths.every((/**
+         * @param {?} monthNode
+         * @return {?}
+         */
+        function (monthNode) { return _this.isMonthChecked(monthNode); }));
+    };
+    /**
+     * @param {?} yearNode
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.isYearIndeterminate = /**
+     * @param {?} yearNode
+     * @return {?}
+     */
+    function (yearNode) {
+        if (this.isYearDisabled(yearNode)) {
+            return false;
+        }
+        /** @type {?} */
+        var selectedMap = this.getFieldDaySelectionMap(this.field);
+        /** @type {?} */
+        var enabledDays = [];
+        yearNode.months.forEach((/**
+         * @param {?} monthNode
+         * @return {?}
+         */
+        function (monthNode) {
+            monthNode.days.forEach((/**
+             * @param {?} dayNode
+             * @return {?}
+             */
+            function (dayNode) {
+                if (!dayNode.disabled) {
+                    enabledDays.push(dayNode.key);
+                }
+            }));
+        }));
+        /** @type {?} */
+        var selectedCount = enabledDays.filter((/**
+         * @param {?} key
+         * @return {?}
+         */
+        function (key) { return !!selectedMap[key]; })).length;
+        return selectedCount > 0 && selectedCount < enabledDays.length;
+    };
+    /**
+     * @param {?} yearNode
+     * @param {?} checked
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.toggleYear = /**
+     * @param {?} yearNode
+     * @param {?} checked
+     * @return {?}
+     */
+    function (yearNode, checked) {
+        var _this = this;
+        if (this.isYearDisabled(yearNode)) {
+            return;
+        }
+        yearNode.months.forEach((/**
+         * @param {?} monthNode
+         * @return {?}
+         */
+        function (monthNode) {
+            _this.toggleMonth(monthNode, checked);
+        }));
+    };
+    /**
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.clearSelection = /**
+     * @return {?}
+     */
+    function () {
+        if (this.field) {
+            this.workingSelectedByField[this.field] = {};
+        }
+        this.apply.emit(this.cloneSelectionMap(this.workingSelectedByField));
+        this.rebuildTree();
+    };
+    /**
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.applySelection = /**
+     * @return {?}
+     */
+    function () {
+        this.apply.emit(this.cloneSelectionMap(this.workingSelectedByField));
+        this.closePopover();
+    };
+    /**
+     * @private
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.rebuildTree = /**
+     * @private
+     * @return {?}
+     */
+    function () {
+        var _this = this;
+        if (!this.field) {
+            this.years = [];
+            return;
+        }
+        /** @type {?} */
+        var sourceRows = this.sourceRows || [];
+        /** @type {?} */
+        var rowsByOtherFilters = this.filterRowsBySelectedDateTree(sourceRows, this.field);
+        /** @type {?} */
+        var availableDayKeyMap = {};
+        rowsByOtherFilters.forEach((/**
+         * @param {?} row
+         * @return {?}
+         */
+        function (row) {
+            /** @type {?} */
+            var dayKey = _this.getDayKeyByRowValue(row[_this.field]);
+            if (dayKey) {
+                availableDayKeyMap[dayKey] = true;
+            }
+        }));
+        /** @type {?} */
+        var groupedMap = {};
+        sourceRows.forEach((/**
+         * @param {?} row
+         * @return {?}
+         */
+        function (row) {
+            /** @type {?} */
+            var date = _this.parseDateValue(row[_this.field]);
+            if (!date) {
+                return;
+            }
+            /** @type {?} */
+            var year = date.getFullYear();
+            /** @type {?} */
+            var month = date.getMonth() + 1;
+            /** @type {?} */
+            var day = date.getDate();
+            if (!groupedMap[year]) {
+                groupedMap[year] = {};
+            }
+            if (!groupedMap[year][month]) {
+                groupedMap[year][month] = {};
+            }
+            if (!groupedMap[year][month][day]) {
+                groupedMap[year][month][day] = 0;
+            }
+            groupedMap[year][month][day] += 1;
+        }));
+        /** @type {?} */
+        var expandState = this.getOrCreateExpandState(this.field);
+        this.years = Object.keys(groupedMap)
+            .map((/**
+         * @param {?} key
+         * @return {?}
+         */
+        function (key) { return Number(key); }))
+            .sort((/**
+         * @param {?} a
+         * @param {?} b
+         * @return {?}
+         */
+        function (a, b) { return b - a; }))
+            .map((/**
+         * @param {?} year
+         * @return {?}
+         */
+        function (year) {
+            /** @type {?} */
+            var months = Object.keys(groupedMap[year])
+                .map((/**
+             * @param {?} key
+             * @return {?}
+             */
+            function (key) { return Number(key); }))
+                .sort((/**
+             * @param {?} a
+             * @param {?} b
+             * @return {?}
+             */
+            function (a, b) { return a - b; }))
+                .map((/**
+             * @param {?} month
+             * @return {?}
+             */
+            function (month) {
+                /** @type {?} */
+                var monthKey = year + "-" + _this.pad2(month);
+                if (expandState.months[monthKey] === undefined) {
+                    expandState.months[monthKey] = true;
+                }
+                /** @type {?} */
+                var days = Object.keys(groupedMap[year][month])
+                    .map((/**
+                 * @param {?} key
+                 * @return {?}
+                 */
+                function (key) { return Number(key); }))
+                    .sort((/**
+                 * @param {?} a
+                 * @param {?} b
+                 * @return {?}
+                 */
+                function (a, b) { return a - b; }))
+                    .map((/**
+                 * @param {?} day
+                 * @return {?}
+                 */
+                function (day) {
+                    /** @type {?} */
+                    var dayKey = _this.toDayKey(year, month, day);
+                    /** @type {?} */
+                    var dayDate = new Date(year, month - 1, day);
+                    return {
+                        key: dayKey,
+                        day: day,
+                        label: moment(dayDate).format("D MMM YYYY"),
+                        count: groupedMap[year][month][day],
+                        disabled: !availableDayKeyMap[dayKey],
+                    };
+                }));
+                return {
+                    key: monthKey,
+                    month: month,
+                    label: moment()
+                        .month(month - 1)
+                        .format("MMM"),
+                    expanded: !!expandState.months[monthKey],
+                    days: days,
+                };
+            }));
+            /** @type {?} */
+            var yearKey = String(year);
+            if (expandState.years[yearKey] === undefined) {
+                expandState.years[yearKey] = true;
+            }
+            return {
+                key: yearKey,
+                year: year,
+                expanded: !!expandState.years[yearKey],
+                months: months,
+            };
+        }));
+    };
+    /**
+     * @private
+     * @param {?} rows
+     * @param {?=} excludeField
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.filterRowsBySelectedDateTree = /**
+     * @private
+     * @param {?} rows
+     * @param {?=} excludeField
+     * @return {?}
+     */
+    function (rows, excludeField) {
+        var _this = this;
+        /** @type {?} */
+        var filteredRows = rows ? rows.slice() : [];
+        (this.dateFields || []).forEach((/**
+         * @param {?} field
+         * @return {?}
+         */
+        function (field) {
+            if (excludeField && field === excludeField) {
+                return;
+            }
+            /** @type {?} */
+            var selectedMap = _this.getFieldDaySelectionMap(field);
+            /** @type {?} */
+            var selectedKeys = Object.keys(selectedMap);
+            if (!selectedKeys.length) {
+                return;
+            }
+            filteredRows = filteredRows.filter((/**
+             * @param {?} row
+             * @return {?}
+             */
+            function (row) {
+                /** @type {?} */
+                var dayKey = _this.getDayKeyByRowValue(row[field]);
+                return dayKey ? !!selectedMap[dayKey] : false;
+            }));
+        }));
+        return filteredRows;
+    };
+    /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.parseDateValue = /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    function (value) {
+        if (!value) {
+            return null;
+        }
+        if (value instanceof Date) {
+            return value;
+        }
+        /** @type {?} */
+        var parsed = moment(value, [
+            "YYYY-MM-DD",
+            "MM/DD/YYYY",
+            "DD/MM/YYYY",
+            "YYYY/MM/DD",
+            "DD-MMM-YYYY",
+            "MMM DD, YYYY",
+            moment.ISO_8601,
+        ], true);
+        if (parsed.isValid()) {
+            return parsed.toDate();
+        }
+        /** @type {?} */
+        var fallback = new Date(value);
+        return isNaN(fallback.getTime()) ? null : fallback;
+    };
+    /**
+     * @private
+     * @param {?} field
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.getOrCreateExpandState = /**
+     * @private
+     * @param {?} field
+     * @return {?}
+     */
+    function (field) {
+        if (!this.expandStateByField[field]) {
+            this.expandStateByField[field] = { years: {}, months: {} };
+        }
+        return this.expandStateByField[field];
+    };
+    /**
+     * @private
+     * @param {?} field
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.getFieldDaySelectionMap = /**
+     * @private
+     * @param {?} field
+     * @return {?}
+     */
+    function (field) {
+        if (!this.workingSelectedByField[field]) {
+            this.workingSelectedByField[field] = {};
+        }
+        return this.workingSelectedByField[field];
+    };
+    /**
+     * @private
+     * @param {?} year
+     * @param {?} month
+     * @param {?} day
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.toDayKey = /**
+     * @private
+     * @param {?} year
+     * @param {?} month
+     * @param {?} day
+     * @return {?}
+     */
+    function (year, month, day) {
+        return year + "-" + this.pad2(month) + "-" + this.pad2(day);
+    };
+    /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.pad2 = /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    function (value) {
+        return value < 10 ? "0" + value : String(value);
+    };
+    /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.getDayKeyByRowValue = /**
+     * @private
+     * @param {?} value
+     * @return {?}
+     */
+    function (value) {
+        /** @type {?} */
+        var date = this.parseDateValue(value);
+        if (!date) {
+            return "";
+        }
+        return this.toDayKey(date.getFullYear(), date.getMonth() + 1, date.getDate());
+    };
+    /**
+     * @private
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.getEnabledDayKeysInCurrentField = /**
+     * @private
+     * @return {?}
+     */
+    function () {
+        /** @type {?} */
+        var keys = [];
+        this.years.forEach((/**
+         * @param {?} yearNode
+         * @return {?}
+         */
+        function (yearNode) {
+            yearNode.months.forEach((/**
+             * @param {?} monthNode
+             * @return {?}
+             */
+            function (monthNode) {
+                monthNode.days.forEach((/**
+                 * @param {?} dayNode
+                 * @return {?}
+                 */
+                function (dayNode) {
+                    if (!dayNode.disabled) {
+                        keys.push(dayNode.key);
+                    }
+                }));
+            }));
+        }));
+        return keys;
+    };
+    /**
+     * @private
+     * @param {?} source
+     * @return {?}
+     */
+    DateTreeFilterPopoverComponent.prototype.cloneSelectionMap = /**
+     * @private
+     * @param {?} source
+     * @return {?}
+     */
+    function (source) {
+        try {
+            return source ? JSON.parse(JSON.stringify(source)) : {};
+        }
+        catch (e) {
+            return {};
+        }
+    };
+    DateTreeFilterPopoverComponent.decorators = [
+        { type: Component, args: [{
+                    selector: "rs-date-tree-filter-popover",
+                    template: "<div class=\"date-tree-filter-popover\">\r\n    <div class=\"popover-search\">\r\n        <span class=\"search-icon\"><img src=\"/assets/img/search.svg\" alt=\"\" /></span>\r\n        <input\r\n            type=\"text\"\r\n            [placeholder]=\"translation.SEARCH || '.SEARCH'\"\r\n            [value]=\"keyword\"\r\n            (input)=\"onKeywordChange($event.target.value)\"\r\n        />\r\n    </div>\r\n\r\n    <div class=\"popover-tree\">\r\n        <label class=\"tree-row all-row\">\r\n            <input\r\n                type=\"checkbox\"\r\n                [checked]=\"isAllChecked()\"\r\n                [indeterminate]=\"isAllIndeterminate()\"\r\n                (change)=\"toggleAllDays($event.target.checked)\"\r\n            />\r\n            <span class=\"row-label\">{{ translation.ALL || '.ALL' }}</span>\r\n        </label>\r\n\r\n        <div class=\"year-block\" *ngFor=\"let yearNode of getVisibleYears()\">\r\n            <div class=\"tree-row\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"tree-toggle-btn\"\r\n                    (click)=\"toggleYearExpanded(yearNode); $event.stopPropagation()\"\r\n                >\r\n                    <span class=\"tree-arrow\" [ngClass]=\"{ expanded: yearNode.expanded }\"></span>\r\n                </button>\r\n                <input\r\n                    type=\"checkbox\"\r\n                    [disabled]=\"isYearDisabled(yearNode)\"\r\n                    [checked]=\"isYearChecked(yearNode)\"\r\n                    [indeterminate]=\"isYearIndeterminate(yearNode)\"\r\n                    (change)=\"toggleYear(yearNode, $event.target.checked)\"\r\n                />\r\n                <span class=\"row-label\">{{ yearNode.year }}</span>\r\n            </div>\r\n\r\n            <div class=\"month-block\" *ngIf=\"yearNode.expanded\">\r\n                <div class=\"month-item\" *ngFor=\"let monthNode of yearNode.months\">\r\n                    <div class=\"tree-row\">\r\n                        <button\r\n                            type=\"button\"\r\n                            class=\"tree-toggle-btn\"\r\n                            (click)=\"toggleMonthExpanded(monthNode); $event.stopPropagation()\"\r\n                        >\r\n                            <span class=\"tree-arrow\" [ngClass]=\"{ expanded: monthNode.expanded }\"></span>\r\n                        </button>\r\n                        <input\r\n                            type=\"checkbox\"\r\n                            [disabled]=\"isMonthDisabled(monthNode)\"\r\n                            [checked]=\"isMonthChecked(monthNode)\"\r\n                            [indeterminate]=\"isMonthIndeterminate(monthNode)\"\r\n                            (change)=\"toggleMonth(monthNode, $event.target.checked)\"\r\n                        />\r\n                        <span class=\"row-label\">{{ monthNode.label }}</span>\r\n                    </div>\r\n\r\n                    <div class=\"day-block\" *ngIf=\"monthNode.expanded\">\r\n                        <label\r\n                            class=\"tree-row day-row\"\r\n                            *ngFor=\"let dayNode of monthNode.days\"\r\n                            [ngClass]=\"{ disabled: dayNode.disabled }\"\r\n                        >\r\n                            <span class=\"tree-toggle-spacer\"></span>\r\n                            <input\r\n                                type=\"checkbox\"\r\n                                [disabled]=\"dayNode.disabled\"\r\n                                [checked]=\"isDayChecked(dayNode)\"\r\n                                (change)=\"toggleDay(dayNode, $event.target.checked)\"\r\n                            />\r\n                            <span class=\"row-label\">{{ dayNode.label }}</span>\r\n                        </label>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"popover-footer\">\r\n        <button type=\"button\" (click)=\"clearSelection()\">\r\n            {{ translation.CLEAR || '.CLEAR' }}\r\n        </button>\r\n        <button type=\"button\" class=\"primary-btn\" (click)=\"applySelection()\">\r\n            {{ translation.APPLY || '.APPLY' }}\r\n        </button>\r\n    </div>\r\n</div>\r\n",
+                    styles: [":host{position:fixed;left:12px;top:12px;z-index:20;width:300px}.date-tree-filter-popover{background:#fff;border:1px solid #eaedf0;border-radius:10px;box-shadow:0 0 4px rgba(0,0,0,.25);padding:4px 8px;display:flex;flex-direction:column;color:#44566c;font-family:Arial}.popover-search{position:relative;padding:4px 0 8px}.popover-search .search-icon{position:absolute;left:10px;top:10px;color:#929dab;font-size:12px;line-height:12px}.popover-search input{width:100%;height:28px;border:1px solid #eaedf0;border-radius:16px;padding:0 10px 0 28px;outline:0;font-size:12px;color:#44566c}.popover-tree{max-height:320px;overflow:auto;padding-right:2px}.tree-row{display:flex;align-items:center;min-height:24px;font-size:11px;line-height:14px;color:#44566c}.tree-row input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;margin:0 6px 0 0;box-sizing:border-box;border:1px solid #d8d8d8;border-radius:3px;background-color:#fff;cursor:pointer;vertical-align:middle;flex-shrink:0}.tree-row input[type=checkbox]:checked{border-color:#1f7bff;background-color:#1f7bff;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 9 9' fill='none'%3E%3Cpath d='M0.5 4.31818L3 7.5L5.75 4L8.5 0.5' stroke='white' stroke-linecap='round'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;background-size:9px 9px}.tree-row input[type=checkbox]:indeterminate{border-color:#1f7bff;background-color:#1f7bff;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 9 9' fill='none'%3E%3Cpath d='M1.5 4.5H7.5' stroke='white' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;background-size:9px 9px}.tree-row input[type=checkbox]:disabled{cursor:not-allowed;opacity:.5}.all-row{padding-left:20px;margin-bottom:2px}.year-block{margin-bottom:2px}.month-block{padding-left:20px}.day-block{padding-left:24px}.tree-toggle-btn{width:16px;height:16px;padding:0;margin-right:4px;border:none;background:0 0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.tree-arrow{display:inline-block;width:6px;height:6px;border-right:1px solid #6c7c90;border-bottom:1px solid #6c7c90;transform:rotate(-45deg);transition:transform .15s}.tree-arrow.expanded{transform:rotate(45deg)}.tree-toggle-spacer{width:20px;display:inline-block}.row-label{color:#44566c}.day-row.disabled .row-label{color:#adb5bd}.popover-footer{margin-top:8px;padding:12px 0 8px;border-top:1px solid #eaedf0;display:flex;justify-content:flex-end;gap:12px}.popover-footer button{min-width:56px;height:26px;padding:0 8px;border-radius:4px;border:1px solid #dbe1e7;background:#fff;font-size:11px;color:#44566c;cursor:pointer}.popover-footer .primary-btn{background:#1364b3;border-color:#1364b3;color:#fff}"]
+                }] }
+    ];
+    DateTreeFilterPopoverComponent.propDecorators = {
+        field: [{ type: Input }],
+        translation: [{ type: Input }],
+        sourceRows: [{ type: Input }],
+        dateFields: [{ type: Input }],
+        selectedByField: [{ type: Input }],
+        fieldLabelMap: [{ type: Input }],
+        apply: [{ type: Output }],
+        close: [{ type: Output }]
+    };
+    return DateTreeFilterPopoverComponent;
+}());
+if (false) {
+    /** @type {?} */
+    DateTreeFilterPopoverComponent.prototype.field;
+    /** @type {?} */
+    DateTreeFilterPopoverComponent.prototype.translation;
+    /** @type {?} */
+    DateTreeFilterPopoverComponent.prototype.sourceRows;
+    /** @type {?} */
+    DateTreeFilterPopoverComponent.prototype.dateFields;
+    /** @type {?} */
+    DateTreeFilterPopoverComponent.prototype.selectedByField;
+    /** @type {?} */
+    DateTreeFilterPopoverComponent.prototype.fieldLabelMap;
+    /** @type {?} */
+    DateTreeFilterPopoverComponent.prototype.apply;
+    /** @type {?} */
+    DateTreeFilterPopoverComponent.prototype.close;
+    /** @type {?} */
+    DateTreeFilterPopoverComponent.prototype.keyword;
+    /** @type {?} */
+    DateTreeFilterPopoverComponent.prototype.years;
+    /**
+     * @type {?}
+     * @private
+     */
+    DateTreeFilterPopoverComponent.prototype.expandStateByField;
+    /**
+     * @type {?}
+     * @private
+     */
+    DateTreeFilterPopoverComponent.prototype.workingSelectedByField;
+}
+
 /**
  * @fileoverview added by tsickle
  * Generated from: lib/float-box/index.component.ts
@@ -53639,6 +55558,7 @@ var RaiseCommonLibModule = /** @class */ (function () {
                         CommonGridComponent,
                         GridActionComponent,
                         GridActionItemComponent,
+                        DateTreeFilterPopoverComponent,
                         FloatBoxComponent,
                         RsPageListComponent,
                         RsPageTabComponent,
@@ -53825,6 +55745,7 @@ var RaiseCommonLibModule = /** @class */ (function () {
                         CommonGridComponent,
                         GridActionComponent,
                         GridActionItemComponent,
+                        DateTreeFilterPopoverComponent,
                         FloatBoxComponent,
                         RsPageListComponent,
                         RsPageTabComponent,
@@ -53891,5 +55812,5 @@ var RaiseCommonLibModule = /** @class */ (function () {
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 
-export { API_SERVICE_TOKEN, CheckboxGroupComponent, CommonDialogComponent, CommonFunctionService, CommonGridComponent, DefaultDrawerConfig, DialogService, DrawerComponent, DrawerFormComponent, DrawerService, EmailPattern, EncryptedInputComponent, FloatBoxComponent, GridActionComponent, GridActionItemComponent, GridBoxComponent, IconLoaderService, KeepAliveService, MainContainerComponent, MessageType, MultiTabComponent, PBF_TOKEN, PaneGroupNewComponent, ROLE_SERVICE_TOKEN, RSAsideComponent, RSFooterComponent, RSHeaderComponent, RSNavCardGroupComponent, RSStepperComponent, RSToolbarComponent, RadioGroupComponent, RaiseCommonLibModule, RsCommentaryComponent, RsPageListComponent, RsPageTabComponent, SearchInputComponent, SmartPopupComponent, StaticResourceService, SwitchInputComponent, TagInputComponent, ToolbarItemComponent, TranslationService, TruncatedTextToggleComponent, filterShowSection, Debounce as ɵa, DashboardService as ɵb, ApiList as ɵc, DashboardPorletsService as ɵd, debounce as ɵe, RichtexteditorComponent as ɵf, ConfirmSelectComponent as ɵg, NewActionNotificationComponent as ɵh, CommonDeleteComponent as ɵi, SidebarIconlistNewComponent as ɵj, EmptyIconPromptComponent as ɵk, GadgetTableComponent as ɵl, GadgetPivotComponent as ɵm, GadgetPivotChartComponent as ɵn, GadgetTransposeComponent as ɵo, PortletTypeNewComponent as ɵp, FieldFilterComponent as ɵq, FieldFormatComponent as ɵr, DataMartNewComponent as ɵs, BarChartsComponent as ɵt, PaneDownloadComponent as ɵu };
+export { API_SERVICE_TOKEN, CheckboxGroupComponent, CommonDialogComponent, CommonFunctionService, CommonGridComponent, DATE_TREE_DEFAULT_DATE_FORMATS, DateTreeFilterHelper, DateTreeFilterPopoverComponent, DefaultDrawerConfig, DialogService, DrawerComponent, DrawerFormComponent, DrawerService, EmailPattern, EncryptedInputComponent, FloatBoxComponent, GridActionComponent, GridActionItemComponent, GridBoxComponent, IconLoaderService, KeepAliveService, MainContainerComponent, MessageType, MultiTabComponent, PBF_TOKEN, PaneGroupNewComponent, ROLE_SERVICE_TOKEN, RSAsideComponent, RSFooterComponent, RSHeaderComponent, RSNavCardGroupComponent, RSStepperComponent, RSToolbarComponent, RadioGroupComponent, RaiseCommonLibModule, RsCommentaryComponent, RsPageListComponent, RsPageTabComponent, SearchInputComponent, SmartPopupComponent, StaticResourceService, SwitchInputComponent, TagInputComponent, ToolbarItemComponent, TranslationService, TruncatedTextToggleComponent, createRsCommonGridDateTreeHelper, filterShowSection, Debounce as ɵa, DashboardService as ɵb, ApiList as ɵc, DashboardPorletsService as ɵd, debounce as ɵe, RichtexteditorComponent as ɵf, ConfirmSelectComponent as ɵg, NewActionNotificationComponent as ɵh, CommonDeleteComponent as ɵi, SidebarIconlistNewComponent as ɵj, EmptyIconPromptComponent as ɵk, GadgetTableComponent as ɵl, GadgetPivotComponent as ɵm, GadgetPivotChartComponent as ɵn, GadgetTransposeComponent as ɵo, PortletTypeNewComponent as ɵp, FieldFilterComponent as ɵq, FieldFormatComponent as ɵr, DataMartNewComponent as ɵs, BarChartsComponent as ɵt, PaneDownloadComponent as ɵu };
 //# sourceMappingURL=raise-common-lib.js.map