basesite-shared-grid-lib 0.0.0-watch

package/fesm2015/basesite-shared-grid-lib.mjs

@@ -0,0 +1,1580 @@
+import * as i0 from '@angular/core';
+import { Injectable, Component, EventEmitter, Input, Output, ViewChild, NgModule } from '@angular/core';
+import * as i1 from '@angular/common/http';
+import { HttpClientModule } from '@angular/common/http';
+import { __awaiter } from 'tslib';
+import * as i1$1 from '@angular/common';
+import { CommonModule, DatePipe } from '@angular/common';
+import { takeUntil } from 'rxjs/operators';
+import { Subject } from 'rxjs';
+import * as i3 from 'ag-grid-angular';
+import { AgGridModule } from 'ag-grid-angular';
+import { LicenseManager } from 'ag-grid-enterprise';
+
+class GridLibraryService {
+    constructor(httpClient) {
+        this.httpClient = httpClient;
+        this.baseUrl = 'https://localhost:8075/api';
+    }
+    setBaseUrl(environment) {
+        if (environment === 'test') {
+            this.baseUrl = 'https://fcesharedgridtest.intel.com/api';
+        }
+        else if (environment == 'uat') {
+            this.baseUrl = 'https://fcesharedgriduat.intel.com/api';
+        }
+        else if (environment == 'production') {
+            this.baseUrl = 'https://fcesharedgrid.intel.com/api';
+        }
+        else {
+            this.baseUrl = 'https://localhost:8075/api';
+        }
+    }
+    getColDef(gridId) {
+        return this.httpClient.get(`${this.baseUrl}/GridConfiguration/${gridId}`);
+    }
+    saveColumnConfig(columnConfig) {
+        return this.httpClient.post(`${this.baseUrl}/GridConfiguration/saveUIUserGridConfiguration`, columnConfig);
+    }
+    getGridState(gridId, loggedInUserId) {
+        return this.httpClient.get(`${this.baseUrl}/GridConfiguration?gridId=${gridId}&userId=${loggedInUserId}`);
+    }
+    getDataForExport(serverUrl) {
+        return this.httpClient.get(`${serverUrl}`);
+    }
+}
+GridLibraryService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: GridLibraryService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+GridLibraryService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: GridLibraryService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: GridLibraryService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return [{ type: i1.HttpClient }]; } });
+
+var types$1 = /*#__PURE__*/Object.freeze({
+    __proto__: null
+});
+
+function escapeRegExp(string) {
+    return string.replace(/[.*+\-?^${}()|[\]\\]/g, "\\$&"); // $& means the whole matched string
+}
+function replaceAll(str, search, replacement) {
+    return str.replace(new RegExp(escapeRegExp(search), "g"), replacement);
+}
+
+class OdataProvider {
+    constructor(options) {
+        /**
+         * Name of field contain count of record results in grouping odata query
+         * @default childCount
+         */
+        this.groupCountFieldName = 'childCount';
+        /**
+         * Use in odata build query
+         * @default false
+         */
+        this.isCaseSensitiveStringFilter = false;
+        /**Creator a cancelable Promise */
+        this.createCancelablePromise = () => {
+            let cancel;
+            const pr = new Promise((_, reject) => {
+                cancel = reject;
+            }).catch(() => { });
+            return {
+                promise: pr,
+                cancel,
+            };
+        };
+        /**Odata query operations */
+        this.odataOperator = {
+            // Logical
+            equals: (col, value1) => `${col} eq ${value1}`,
+            blank: (col, value1) => `${col} eq ${value1}`,
+            notBlank: (col, value1) => `${col} ne ${value1}`,
+            notEqual: (col, value1) => `${col} ne ${value1}`,
+            lessThan: (col, value1) => `${col} lt ${value1}`,
+            lessThanOrEqual: (col, value1) => `${col} le ${value1}`,
+            greaterThan: (col, value1) => `${col} gt ${value1}`,
+            greaterThanOrEqual: (col, value1) => `${col} ge ${value1}`,
+            inRange: (col, value1, value2) => `(${col} ge ${value1} and ${col} le ${value2})`,
+            // String
+            equalsStr: (col, value1, isCaseSensitiveStringFilter) => `${this.ifTolowerCol(col, isCaseSensitiveStringFilter)} eq ${this.ifTolower(value1, isCaseSensitiveStringFilter)}`,
+            notEqualStr: (col, value1, isCaseSensitiveStringFilter) => `${this.ifTolowerCol(col, isCaseSensitiveStringFilter)} ne ${this.ifTolower(value1, isCaseSensitiveStringFilter)}`,
+            contains: (col, value1, isCaseSensitiveStringFilter) => `contains(${this.ifTolowerCol(col, isCaseSensitiveStringFilter)},${this.ifTolower(value1, isCaseSensitiveStringFilter)})`,
+            notContains: (col, value1, isCaseSensitiveStringFilter) => `contains(${this.ifTolowerCol(col, isCaseSensitiveStringFilter)},${this.ifTolower(value1, isCaseSensitiveStringFilter)}) eq false`,
+            startsWith: (col, value1, isCaseSensitiveStringFilter) => `startswith(${this.ifTolowerCol(col, isCaseSensitiveStringFilter)},${this.ifTolower(value1, isCaseSensitiveStringFilter)})  eq true`,
+            endsWith: (col, value1, isCaseSensitiveStringFilter) => `endswith(${this.ifTolowerCol(col, isCaseSensitiveStringFilter)},${this.ifTolower(value1, isCaseSensitiveStringFilter)})  eq true`,
+            inStr: (col, values, isCaseSensitiveStringFilter) => `${this.ifTolowerCol(col, isCaseSensitiveStringFilter)} in (${values
+                .map((x) => `'${this.ifTolower(this.encode(x), isCaseSensitiveStringFilter)}'`)
+                .join()})`,
+            in: (col, values) => `${col} in (${values.map((x) => `${this.encode(x)}`).join()})`,
+            notIn: (col, values) => `not (${col} in (${values.map((x) => `${x}`).join()}))`,
+            // Date
+            trunc: (col) => `date(${col})`,
+        };
+        /**
+         * Apply tolower for column in odata syntax
+         * @param col column name
+         * @param isCaseSensitiveStringFilter need apply tolower
+         */
+        this.ifTolowerCol = (col, isCaseSensitiveStringFilter) => isCaseSensitiveStringFilter ? col : `tolower(${col})`;
+        /**
+         *
+         * @param value string value
+         * @param isCaseSensitiveStringFilter  need apply tolower
+         */
+        this.ifTolower = (value, isCaseSensitiveStringFilter) => isCaseSensitiveStringFilter ? value : value ? value.toLowerCase() : value;
+        /**
+         * Odata aggregation operations
+         */
+        this.odataAggregation = {
+            // Logical
+            sum: (col, asField) => `${col} with sum as ${col || asField}`,
+            min: (col, asField) => `${col} with min as ${col || asField}`,
+            max: (col, asField) => `${col} with max as ${col || asField}`,
+            avg: (col, asField) => `${col} with average as ${col || asField}`,
+            count: (col, asField) => `$count as ${col || asField}`,
+        };
+        /**
+         * Odata query builder
+         * @param options parameter for odata query
+         */
+        this.toQuery = (options) => {
+            let path = [];
+            if (options) {
+                path.push('$count=true');
+            }
+            if (options.skip) {
+                path.push(`$skip=${options.skip}`);
+            }
+            if (options.top) {
+                path.push(`$top=${options.top}`);
+            }
+            if (options.sort && options.sort.length > 0) {
+                path.push('$orderby=' + options.sort.join(','));
+            }
+            if (options.filter && options.filter.length > 0) {
+                path.push('$filter=' + options.filter.join(' and '));
+            }
+            if (options.apply && options.apply.length > 0) {
+                path.push('$apply=' + options.apply.join('/'));
+            }
+            if (options.expand && options.expand.length > 0) {
+                path.push('$expand=' + options.expand.join(','));
+            }
+            if (options.select && options.select.length > 0) {
+                path.push('$select=' + options.select.join(','));
+            }
+            let query = '';
+            if (path.length > 0) {
+                var defaultFilters = path.filter((x) => {
+                    if (x.indexOf('$count') >= 0 ||
+                        x.indexOf('$top') >= 0 ||
+                        x.indexOf('$orderby') >= 0 ||
+                        x.indexOf('$apply') >= 0 ||
+                        x.indexOf('$expand') >= 0 ||
+                        x.indexOf('$select') >= 0) {
+                        return x;
+                    }
+                });
+                if (defaultFilters && defaultFilters.length > 0) {
+                    query = '?' + defaultFilters.join('&');
+                }
+                var customFilters = path.filter(function (obj) {
+                    return defaultFilters.indexOf(obj) == -1;
+                });
+                if (customFilters && customFilters.length > 0) {
+                    if (customFilters.length == 1)
+                        query = query + '&' + customFilters;
+                    else
+                        query = query + customFilters.join('and');
+                }
+            }
+            query = query.replace('and$filter=', '&filter=');
+            return query;
+        };
+        /**
+         * Add quotes for string value
+         * @param value string value
+         */
+        this.encode = (value) => this.isStrVal(value) ? replaceAll(value, "'", "''") : value;
+        /**
+         * Conctat to date a time for create datetime format for odata query
+         * @param value date string
+         */
+        this.toDateTime = (value) => {
+            const dt = new Date(value);
+            if (isNaN(dt.getTime()))
+                return null;
+            const dt1 = new Date(Date.UTC(dt.getFullYear(), dt.getMonth(), dt.getDate()));
+            return dt1.toISOString();
+        };
+        /**
+         *
+         * @param colName columnName
+         * @returns is CaseSensitive for column
+         */
+        this.getIsNeedCaseSensitive = (colName) => {
+            if (!this.isCaseSensitiveStringFilter &&
+                this.caseSensitiveColumns &&
+                this.caseSensitiveColumns.length > 0) {
+                return this.caseSensitiveColumns.indexOf(colName) >= 0;
+            }
+            return this.isCaseSensitiveStringFilter;
+        };
+        /**
+         * Convert ag-grid column filter to odata query
+         * @param colName columnName
+         * @param col ag-grid column
+         */
+        this.getFilterOdata = (colName, col) => {
+            const me = this;
+            const isCaseSensitiveStringFilter = me.getIsNeedCaseSensitive(colName);
+            const customFilter = me.customFilters && me.customFilters[colName];
+            colName = replaceAll(colName, '.', '/');
+            colName = me.getWrapColumnName(colName);
+            if (customFilter) {
+                return customFilter(colName, col, isCaseSensitiveStringFilter, me);
+            }
+            else {
+                switch (col.filterType) {
+                    case 'number':
+                        return me.odataOperator[col.type](colName, col.filter, col.filterTo);
+                    case 'text': {
+                        let operatorName = col.type;
+                        const filter = me.encode(col.filter) || '';
+                        // let filterTo = me.encode(col.filterTo);
+                        if ((operatorName === 'equals' || operatorName === 'notEqual') &&
+                            !isCaseSensitiveStringFilter) {
+                            operatorName += 'Str';
+                        }
+                        return me.odataOperator[operatorName](colName, `'${filter}'`, isCaseSensitiveStringFilter);
+                    }
+                    case 'date':
+                        if (col.dateFrom != null &&
+                            me.toDateTime(col.dateFrom) != null &&
+                            (col.dateTo == null ||
+                                (col.dateTo != null && me.toDateTime(col.dateTo) != null))) {
+                            return me.odataOperator[col.type](colName, `${me.toDateTime(col.dateFrom)}`, `${me.toDateTime(col.dateTo)}`);
+                        }
+                        break;
+                    case 'set':
+                        return col.values.length > 0
+                            ? me.odataOperator.inStr(colName, col.values, isCaseSensitiveStringFilter)
+                            : '';
+                    default:
+                        break;
+                }
+            }
+            return '';
+        };
+        /**
+         * Caclulate pivot data for ag-grid from odata
+         * @param pivotCols pivot columns
+         * @param rowGroupCols row group columns
+         * @param valueCols value columns
+         * @param data odata result
+         * @param countField count field name
+         */
+        this.getPivot = (pivotCols, rowGroupCols, valueCols, data, countField) => {
+            // assume 1 pivot col and 1 value col for this example
+            const me = this;
+            const pivotData = [];
+            const aggColsList = [];
+            const colKeyExistsMap = {};
+            const secondaryColDefs = [];
+            const secondaryColDefsMap = {};
+            data.forEach(function (item) {
+                var pivotValues = [];
+                pivotCols.forEach(function (pivotCol) {
+                    var pivotField = pivotCol.id;
+                    var pivotValue = me.getValue(pivotField, item);
+                    if (pivotValue !== null &&
+                        pivotValue !== undefined &&
+                        pivotValue.toString) {
+                        pivotValues.push(pivotValue.toString());
+                    }
+                    else {
+                        pivotValues.push('-');
+                    }
+                });
+                // var pivotValue = item[pivotField].toString();
+                var pivotItem = {};
+                valueCols.forEach(function (valueCol) {
+                    var valField = valueCol.id;
+                    var colKey = createColKey(pivotValues, valField);
+                    var value = me.getValue(valField, item);
+                    pivotItem[colKey] = value;
+                    if (!colKeyExistsMap[colKey]) {
+                        addNewAggCol(colKey, valueCol);
+                        addNewSecondaryColDef(colKey, pivotValues, valueCol);
+                        colKeyExistsMap[colKey] = true;
+                    }
+                });
+                if (countField) {
+                    pivotItem[countField] = me.getValue(countField, item);
+                }
+                rowGroupCols.forEach(function (rowGroupCol) {
+                    var rowGroupField = rowGroupCol.id.split('.')[0];
+                    pivotItem[rowGroupField] = item[rowGroupField];
+                });
+                pivotData.push(pivotItem);
+            });
+            function addNewAggCol(colKey, valueCol) {
+                var newCol = {
+                    id: colKey,
+                    field: colKey,
+                    aggFunc: valueCol.aggFunc,
+                };
+                aggColsList.push(newCol);
+            }
+            function addNewSecondaryColDef(colKey, pivotValues, valueCol) {
+                var parentGroup = null;
+                var keyParts = [];
+                pivotValues.forEach(function (pivotValue) {
+                    keyParts.push(pivotValue);
+                    var colKey = createColKey(keyParts);
+                    var groupColDef = secondaryColDefsMap[colKey];
+                    if (!groupColDef) {
+                        groupColDef = {
+                            groupId: colKey,
+                            headerName: pivotValue,
+                            children: [],
+                        };
+                        secondaryColDefsMap[colKey] = groupColDef;
+                        if (parentGroup) {
+                            parentGroup.children.push(groupColDef);
+                        }
+                        else {
+                            secondaryColDefs.push(groupColDef);
+                        }
+                    }
+                    parentGroup = groupColDef;
+                });
+                parentGroup.children.push({
+                    colId: colKey,
+                    headerName: valueCol.aggFunc + '(' + valueCol.displayName + ')',
+                    field: colKey,
+                    suppressMenu: true,
+                    sortable: false,
+                });
+            }
+            function createColKey(pivotValues, valueField) {
+                var result = pivotValues.join('|');
+                if (valueField !== undefined) {
+                    result += '|' + valueField;
+                }
+                result = replaceAll(result, '.', '*');
+                return result;
+            }
+            return {
+                data: pivotData,
+                aggCols: aggColsList,
+                secondaryColDefs: secondaryColDefs,
+            };
+        };
+        /**
+         *
+         * @param rowData array odata result
+         * @param rowGroupCols row group columns
+         * @param groupKeys what groups the user is viewing
+         * @param countField count field name
+         */
+        this.buildGroupsFromData = (rowData, rowGroupCols, groupKeys, countField) => {
+            const me = this;
+            let rowGroupCol = rowGroupCols[groupKeys.length];
+            let field = rowGroupCol.id;
+            let mappedRowData = me.groupBy(rowData, field);
+            let groups = [];
+            me.iterateObject(mappedRowData, function (key, rowData) {
+                var groupItem = me.aggregateList(rowData, countField);
+                groupItem[field] = key;
+                groups.push(groupItem);
+            });
+            return groups;
+        };
+        /**
+         * Internal function for execute callback function for each property of object
+         * @param object object contained odata grouped result
+         * @param callback function do somthing
+         */
+        this.iterateObject = (object, callback) => {
+            if (!object) {
+                return;
+            }
+            const keys = Object.keys(object);
+            for (let i = 0; i < keys.length; i++) {
+                const key = keys[i];
+                const value = object[key];
+                callback(key, value);
+            }
+        };
+        /**
+         * Prepeare grouped data
+         * @param rowData array odata result
+         * @param field grouping field
+         */
+        this.groupBy = (rowData, field) => {
+            var result = {};
+            const me = this;
+            rowData.forEach(function (item) {
+                var key = me.getValue(field, item);
+                var listForThisKey = result[key];
+                if (!listForThisKey) {
+                    listForThisKey = [];
+                    result[key] = listForThisKey;
+                }
+                listForThisKey.push(item);
+            });
+            return result;
+        };
+        /**
+         * Calculate total count records in group
+         * @param rowData array odata result data
+         * @param countField field contained count of all records
+         */
+        this.aggregateList = (rowData, countField) => {
+            var result = {};
+            rowData.forEach((row) => {
+                if (countField && row[countField] != null) {
+                    const totalCount = (result[countField] || 0) + (row[countField] || 0);
+                    delete row[countField];
+                    result[countField] = totalCount;
+                }
+                result = Object.assign(result, row);
+            });
+            return result;
+        };
+        /**
+             * Calculate distinct values for input field from Odata api
+             * @param field The field of the row to get the cells data from
+             * @param callback The function for return distinct values for input field
+             * @param beforeRequest The function for customize request
+             * @example
+             * <pre><code>
+             *  const setFilterValuesFuncParams = params => {
+             *    const me = this
+             *    const col = params.colDef.field
+             *    const storeName = me.getStoreName(col)
+             *    const callback = data => {
+             *      if (data) {
+             *        me.setState({ [storeName]: data })
+             *        params.success(data)
+             *      }
+             *    }
+             *    odataProviderInstance.getFilterValuesParams(params.colDef.field, callback)
+             *  }
+             *
+             * ///....
+             *      <AgGridColumn
+                          field="product"
+                          headerName={'PRODUCT'}
+                          filter="agSetColumnFilter"
+                          // rowGroup
+                          // enablePivot
+                          enableRowGroup
+                          filterParams={{
+                            values: setFilterValuesFuncParams,
+                            newRowsAction: 'keep'
+                          }}
+                          // filterParams={{caseSensitive: true}}
+                        />
+             * </code></pre>
+             */
+        this.getFilterValuesParams = (field, callback, beforeRequest) => {
+            const me = this;
+            const options = {
+                apply: [`groupby((${me.getWrapColumnName(field)}))`],
+            };
+            if (beforeRequest) {
+                beforeRequest(options);
+            }
+            me.callApi(me.toQuery(options)).then((x) => {
+                if (x) {
+                    let values = me.getOdataResult(x);
+                    callback(values.map((y) => y[field]));
+                }
+            });
+        };
+        /**
+         * Detect is string value
+         * @param value
+         */
+        this.isStrVal = (value) => typeof value === 'string';
+        /**
+         * Extartc values from odata response
+         * @param response
+         */
+        this.getOdataResult = (response) => Array.isArray(response) ? response : response.value;
+        /**
+         * Endocing column name to odata notation
+         * @param colName column name
+         */
+        this.getWrapColumnName = (colName) => colName ? replaceAll(colName, '.', '/') : '';
+        /**
+         * Set result
+         * @param params ag-grid details for the request
+         * @param isServerMode detect type of params
+         * @param rowsThisBlock data of the request
+         * @param rowCount count of total result
+         */
+        this.setResult = (params, isServerMode, rowsThisBlock, rowCount) => {
+            if (isServerMode) {
+                params.success({
+                    rowData: rowsThisBlock,
+                    rowCount: rowCount,
+                });
+            }
+            else {
+                params.successCallback(rowsThisBlock, rowCount);
+            }
+        };
+        /**
+         * Generate odata options for build query from ag-grid request
+         * @param params ag-grid details for the request
+         */
+        this.getOdataOptions = (params) => {
+            const me = this;
+            const options = {};
+            const isServerMode = 'request' in params;
+            const request = isServerMode
+                ? params.request
+                : params;
+            const childCount = me.groupCountFieldName;
+            if (this.beforeRequest) {
+                this.beforeRequest(options, this, request);
+            }
+            if (request.sortModel.length > 0) {
+                const sort = options.sort || [];
+                for (let i = 0; i < request.sortModel.length; i++) {
+                    const col = request.sortModel[i];
+                    let colName = me.getWrapColumnName(col.colId);
+                    if (col.sort !== 'asc') {
+                        colName += ' desc';
+                    }
+                    sort.push(colName);
+                }
+                options.sort = sort;
+            }
+            const filter = options.filter || [];
+            for (const colName in request.filterModel) {
+                if (request.filterModel.hasOwnProperty(colName)) {
+                    const col = request.filterModel[colName];
+                    let colFilter = '';
+                    if (!col.operator) {
+                        colFilter = me.getFilterOdata(colName, col);
+                        if (colFilter) {
+                            filter.push(colFilter);
+                        }
+                    }
+                    else {
+                        const condition1 = me.getFilterOdata(colName, col.condition1);
+                        const condition2 = me.getFilterOdata(colName, col.condition2);
+                        if (condition1 && condition2) {
+                            colFilter = `(${condition1} ${col.operator.toLowerCase()} ${condition2})`;
+                            filter.push(colFilter);
+                        }
+                    }
+                }
+            }
+            let pivotActive = false;
+            const apply = options.apply || [];
+            if (isServerMode) {
+                const requestSrv = request;
+                pivotActive =
+                    requestSrv.pivotMode &&
+                        requestSrv.pivotCols.length > 0 &&
+                        requestSrv.valueCols.length > 0;
+                if (requestSrv.rowGroupCols.length > 0) {
+                    const filterGroupBy = [];
+                    if (requestSrv.groupKeys.length < requestSrv.rowGroupCols.length) {
+                        // If request only groups
+                        for (let idx = 0; idx < requestSrv.groupKeys.length; idx++) {
+                            const colValue = requestSrv.groupKeys[idx];
+                            const condition = `${me.getWrapColumnName(requestSrv.rowGroupCols[idx].field)} eq ${(me.isStrVal(colValue) ? "'" : '') +
+                                me.encode(colValue) +
+                                (me.isStrVal(colValue) ? "'" : '')}`;
+                            filterGroupBy.push(condition);
+                        }
+                        if (filterGroupBy.length > 0 || filter.length > 0) {
+                            // Filters must by first
+                            apply.push(`filter(${filterGroupBy.concat(filter).join(' and ')})`);
+                        }
+                        const aggregate = [];
+                        if (childCount) {
+                            aggregate.push(me.odataAggregation.count(childCount));
+                        }
+                        if (requestSrv.valueCols.length > 0) {
+                            for (let idx = 0; idx < requestSrv.valueCols.length; idx++) {
+                                const colValue = requestSrv.valueCols[idx];
+                                colValue.aggFunc &&
+                                    aggregate.push(me.odataAggregation[colValue.aggFunc](me.getWrapColumnName(colValue.field)));
+                            }
+                        }
+                        let groups = [
+                            me.getWrapColumnName(requestSrv.rowGroupCols[requestSrv.groupKeys.length].field),
+                        ];
+                        const sort = options.sort || [];
+                        const sortColOnly = sort.map((x) => x.split(' ')[0]);
+                        if (pivotActive) {
+                            groups = groups.concat(requestSrv.pivotCols.map((x) => me.getWrapColumnName(x.field)));
+                            groups.forEach((x) => {
+                                if (sortColOnly.indexOf(x) < 0) {
+                                    sort.push(x);
+                                }
+                            });
+                        }
+                        options.sort = sort;
+                        apply.push(`groupby((${groups.join(',')})${aggregate.length > 0 ? `,aggregate(${aggregate.join(',')})` : ''})`);
+                        options.apply = apply;
+                        if (options.sort && options.sort.length > 0) {
+                            options.sort = options.sort.filter((x) => groups.indexOf(x.split(' ')[0]) >= 0);
+                        }
+                        // delete options.sort;
+                    }
+                    else {
+                        // If request rowData by group filter
+                        for (let idx = 0; idx < requestSrv.groupKeys.length; idx++) {
+                            const colValue = requestSrv.groupKeys[idx];
+                            const condition = `${me.getWrapColumnName(requestSrv.rowGroupCols[idx].field)} eq ${(me.isStrVal(colValue) ? "'" : '') +
+                                me.encode(colValue) +
+                                (me.isStrVal(colValue) ? "'" : '')}`;
+                            filter.push(condition);
+                        }
+                    }
+                }
+            }
+            if (filter.length > 0) {
+                options.filter = filter;
+            }
+            if (apply.length > 0) {
+                options.apply = apply;
+                delete options.filter;
+                delete options.expand;
+                delete options.select;
+                // options.sort = null;
+            }
+            options.skip = request.startRow;
+            options.top = (request.endRow || 0) - (request.startRow || 0);
+            if (!options.apply && options.skip === 0) {
+                options.count = true;
+            }
+            return options;
+        };
+        /**
+         * Generate odata query from ag-grid request
+         * @param params ag-grid details for the request
+         */
+        this.getOdataQuery = (params) => this.toQuery(this.getOdataOptions(params));
+        Object.assign(this, options);
+        if (this.callApi == null) {
+            throw new Error('callApi must be specified');
+        }
+        if (typeof this.callApi !== 'function') {
+            throw new Error('callApi must be a function');
+        }
+        if (this.beforeRequest != null &&
+            typeof this.beforeRequest !== 'function') {
+            throw new Error('beforeRequest must be a function');
+        }
+        if (this.afterLoadData != null &&
+            typeof this.afterLoadData !== 'function') {
+            throw new Error('afterLoadData must be a function');
+        }
+        if (this.setError != null && typeof this.setError !== 'function') {
+            throw new Error('setError must be a function');
+        }
+        this.cancelPromice = this.createCancelablePromise();
+    }
+    /**
+     * Extract value from record by path to field
+     * @param field path to column value
+     * @param obj  record
+     */
+    getValue(field, obj) {
+        const paths = field.split('.');
+        if (paths.length === 1) {
+            return obj[field];
+        }
+        else {
+            return paths.reduce((object, path) => {
+                return (object || {})[path]; // Oliver Steele's pattern
+            }, obj);
+        }
+    }
+    /**
+     * grid calls this to get rows for IServerSideDatasource
+     * @param params ag-grid details for the request
+     */
+    /**
+     * grid calls this to get rows implement
+     * @param params ag-grid details for the request
+     */
+    getRows(params) {
+        const me = this;
+        const childCount = me.groupCountFieldName;
+        const isServerMode = 'request' in params;
+        const request = isServerMode
+            ? params.request
+            : params;
+        const requestSrv = request;
+        const pivotActive = !isServerMode
+            ? false
+            : requestSrv.pivotMode &&
+                requestSrv.pivotCols.length > 0 &&
+                requestSrv.valueCols.length > 0;
+        if (!pivotActive) {
+            let fn = params.columnApi.setPivotResultColumns;
+            if (fn != null) {
+                // if ((params as any).columnApi.isPivotMode()) {
+                params.columnApi.setPivotResultColumns([]);
+                // }
+            }
+            else {
+                params.columnApi.setSecondaryColumns([]);
+            }
+        }
+        const options = me.getOdataOptions(params);
+        const query = me.toQuery(options);
+        if (options.skip === 0 &&
+            (!isServerMode ||
+                (isServerMode &&
+                    params.parentNode.level === -1))) {
+            me.cancelPromice.cancel();
+            me.cancelPromice = me.createCancelablePromise();
+        }
+        Promise.race([me.cancelPromice.promise, me.callApi(query)]).then((x) => __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            if (!x) {
+                params.failCallback();
+            }
+            else {
+                const values = me.getOdataResult(x);
+                if (!pivotActive) {
+                    if (!options.apply) {
+                        me.setResult(params, isServerMode, values, x['@odata.count'] || ((_a = x[0]) === null || _a === void 0 ? void 0 : _a.totalCount));
+                        if (this.afterLoadData) {
+                            this.afterLoadData(options, values, x['@odata.count'] || ((_b = x[0]) === null || _b === void 0 ? void 0 : _b.totalCount));
+                        }
+                    }
+                    else {
+                        let count = values.length;
+                        if (count === options.top && options.skip === 0) {
+                            // If received grouped count of value large than requested then request total count of values
+                            me.callApi(query + '/aggregate($count as count)').then((y) => {
+                                count = me.getOdataResult(y)[0].count;
+                                me.setResult(params, isServerMode, values, count);
+                            });
+                        }
+                        else {
+                            if (options.skip != null && options.skip > 0) {
+                                count = null;
+                            }
+                            me.setResult(params, isServerMode, values, count);
+                            if (this.afterLoadData) {
+                                this.afterLoadData(options, values, count);
+                            }
+                        }
+                    }
+                }
+                else {
+                    let rowData = me.getOdataResult(x);
+                    // Check count
+                    if (rowData.length === options.top &&
+                        options.skip === 0 &&
+                        requestSrv.groupKeys.length === 0) {
+                        let eof = false;
+                        while (!eof) {
+                            options.skip += options.top || 0;
+                            const subQuery = me.toQuery(options);
+                            const newRowData = yield me.callApi(subQuery);
+                            if (!newRowData) {
+                                params.failCallback();
+                                return;
+                            }
+                            eof = newRowData.length !== options.top;
+                            rowData = rowData.concat(newRowData);
+                        }
+                    }
+                    const pivotResult = me.getPivot(requestSrv.pivotCols, requestSrv.rowGroupCols, requestSrv.valueCols, rowData, childCount);
+                    rowData = pivotResult.data;
+                    const secondaryColDefs = pivotResult.secondaryColDefs;
+                    rowData = me.buildGroupsFromData(rowData, requestSrv.rowGroupCols, requestSrv.groupKeys, childCount);
+                    const totalCount = requestSrv.groupKeys.length === 0
+                        ? rowData.length
+                        : rowData.length === options.top
+                            ? null
+                            : rowData.length;
+                    // if (totalCount > (options.top || 0)) {
+                    //   const serverSideBlock = (params as any).parentNode.rowModel
+                    //     .rowNodeBlockLoader.blocks[0];
+                    //   serverSideBlock.rowNodeCacheParams.blockSize = totalCount;
+                    //   serverSideBlock.endRow = serverSideBlock.startRow + totalCount;
+                    //   serverSideBlock.createRowNodes();
+                    // }
+                    me.setResult(params, isServerMode, rowData, totalCount);
+                    if (this.afterLoadData) {
+                        this.afterLoadData(options, rowData, totalCount);
+                    }
+                    if (requestSrv.groupKeys.length === 0) {
+                        if (this.beforeSetSecondaryColumns) {
+                            this.beforeSetSecondaryColumns(secondaryColDefs);
+                        }
+                        let fn = params.columnApi.setPivotResultColumns;
+                        if (fn) {
+                            params.columnApi.setPivotResultColumns(secondaryColDefs);
+                        }
+                        else {
+                            params.columnApi.setSecondaryColumns(secondaryColDefs);
+                        }
+                    }
+                }
+            }
+        }), (err) => {
+            me.setResult(params, isServerMode, [], 0);
+            if (this.setError) {
+                this.setError(err, params);
+            }
+        });
+    }
+}
+class OdataProviderClient extends OdataProvider {
+    getRows(params) {
+        super.getRows(params);
+    }
+}
+class OdataServerSideProvider extends OdataProvider {
+    getRows(params) {
+        super.getRows(params);
+    }
+}
+
+class ButtonRendererComponent {
+    agInit(params) {
+        this.params = params;
+        this.label = this.params.label || null;
+        this.icon = this.params.icon;
+    }
+    refresh(params) {
+        return false;
+    }
+    onClick($event) {
+        if (this.params.onClick instanceof Function) {
+            // put anything into params u want pass into parents component
+            const params = {
+                event: $event,
+                rowData: Object.assign({}, this.params.node.data, {
+                    buttonName: this.params.buttonName,
+                    buttonText: this.params.label,
+                    buttonIcon: this.params.icon,
+                }),
+            };
+            this.params.onClick(params);
+        }
+    }
+}
+ButtonRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: ButtonRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ButtonRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.6", type: ButtonRendererComponent, selector: "lib-button-renderer", ngImport: i0, template: `
+    <button class="btn-actions" type="button" (click)="onClick($event)" [attr.data-title]="params.tooltip">
+      <span *ngIf="icon && !label"> <i class="{{ icon }}"></i> </span>
+      <span *ngIf="!icon && label">{{ label }}</span>
+      <span *ngIf="icon && label"><i class="{{ icon }}"></i> {{ label }}</span>
+    </button>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: ButtonRendererComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'lib-button-renderer',
+                    template: `
+    <button class="btn-actions" type="button" (click)="onClick($event)" [attr.data-title]="params.tooltip">
+      <span *ngIf="icon && !label"> <i class="{{ icon }}"></i> </span>
+      <span *ngIf="!icon && label">{{ label }}</span>
+      <span *ngIf="icon && label"><i class="{{ icon }}"></i> {{ label }}</span>
+    </button>
+  `,
+                }]
+        }] });
+
+class CustomTooltip {
+    constructor(datePipe) {
+        this.datePipe = datePipe;
+    }
+    agInit(params) {
+        this.params = params;
+        params.value = params.valueFormatted;
+    }
+}
+CustomTooltip.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: CustomTooltip, deps: [{ token: i1$1.DatePipe }], target: i0.ɵɵFactoryTarget.Component });
+CustomTooltip.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.6", type: CustomTooltip, selector: "tooltip-component", ngImport: i0, template: ` <div class="custom-tooltip">
+    <p>
+      <span>{{ params.value }}</span>
+    </p>
+  </div>`, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: CustomTooltip, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'tooltip-component',
+                    template: ` <div class="custom-tooltip">
+    <p>
+      <span>{{ params.value }}</span>
+    </p>
+  </div>`,
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.DatePipe }]; } });
+
+class DropdownRenderer {
+    agInit(params) {
+        this.params = params;
+        this.dropDownData = this.params.dropDownData ? this.params.dropDownData.split(',') : [];
+    }
+    refresh(params) {
+        return false;
+    }
+    onClick($event) {
+        if (this.params.onClick instanceof Function) {
+            const params = {
+                event: $event,
+                rowData: Object.assign({}, this.params.node.data, {
+                    buttonName: $event.target.innerText,
+                }),
+            };
+            console.log('Hit', params);
+            this.params.onClick(params);
+        }
+    }
+}
+DropdownRenderer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: DropdownRenderer, deps: [], target: i0.ɵɵFactoryTarget.Component });
+DropdownRenderer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.6", type: DropdownRenderer, selector: "lib-dropdown-renderer", ngImport: i0, template: `
+  <div class="dropdown">
+  <button type="button" class="btn btn-white" data-toggle="dropdown">
+  <i class="fa fa-ellipsis-v"></i>
+  </button>
+  <div class="dropdown-menu">
+    <span *ngFor='let data of dropDownData' class="dropdown-item" (click)="onClick($event)">{{data}}</span>
+  </div>
+</div>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: DropdownRenderer, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'lib-dropdown-renderer',
+                    template: `
+  <div class="dropdown">
+  <button type="button" class="btn btn-white" data-toggle="dropdown">
+  <i class="fa fa-ellipsis-v"></i>
+  </button>
+  <div class="dropdown-menu">
+    <span *ngFor='let data of dropDownData' class="dropdown-item" (click)="onClick($event)">{{data}}</span>
+  </div>
+</div>
+  `,
+                }]
+        }] });
+
+class ColumnValueFormatter {
+    constructor(datePipe) {
+        this.datePipe = datePipe;
+    }
+    colValueFormatter(params, colType) {
+        if (isNaN(+params.value)) {
+            var dateWrapper = new Date(params.value);
+            let isValidDate = !isNaN(dateWrapper.getDate());
+            if (isValidDate && colType == 'date') {
+                return this.datePipe.transform(params.value, 'MM-dd-yyyy');
+            }
+            else {
+                return params.value;
+            }
+        }
+        return params.value;
+    }
+}
+ColumnValueFormatter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: ColumnValueFormatter, deps: [{ token: i1$1.DatePipe }], target: i0.ɵɵFactoryTarget.Injectable });
+ColumnValueFormatter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: ColumnValueFormatter });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: ColumnValueFormatter, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1$1.DatePipe }]; } });
+
+class GridLibraryComponent {
+    constructor(gridService, formatterService) {
+        this.gridService = gridService;
+        this.formatterService = formatterService;
+        this.pageSize = 20;
+        this.rowSelection = 'multiple';
+        this.enableServerSidePaging = false;
+        this.cacheBlockSize = 0;
+        this.rowMultiSelectWithClick = false;
+        this.floatingFilter = false;
+        this.paginationAutoPageSize = false;
+        //event emitters
+        this.btnClickHandler = new EventEmitter();
+        this.firstDataRendered = new EventEmitter();
+        this.filterChanged = new EventEmitter();
+        this.selectionChanged = new EventEmitter();
+        //paramters
+        this.rowDataHidden = [];
+        this.exportColumnsList = [];
+        this.tooltipShowDelay = 0;
+        this.tooltipHideDelay = 2000;
+        this.rowModelType = 'clientSide';
+        this.gridPageSize = 0;
+        //unsubscribe subject
+        this.unsubscribe$ = new Subject();
+        this.defaultColDef = {
+            sortable: true,
+            filter: true,
+            tooltipComponent: CustomTooltip,
+        };
+        this.paginationNumberFormatter = (params) => {
+            return '[' + params.value.toLocaleString() + ']';
+        };
+        this.getRowById = (params) => {
+            var _a;
+            var data = params.data;
+            return (_a = data.id) !== null && _a !== void 0 ? _a : 0;
+        };
+        // Custom right click Context Menu to support custom excel exports
+        this.getContextMenuItems = (params) => {
+            let res = [
+                'cut',
+                'copy',
+                'copyWithHeaders',
+                'copyWithGroupHeaders',
+                'paste',
+                {
+                    name: 'Export',
+                    subMenu: [
+                        {
+                            name: 'CSV Export',
+                            action: () => {
+                                this.exportFile('csv');
+                            },
+                        },
+                        {
+                            name: 'Excel Export',
+                            action: () => {
+                                this.exportFile('xlsx');
+                            },
+                        },
+                    ],
+                },
+            ];
+            return res;
+        };
+    }
+    onSortChangedEvent() {
+        this.gridColumnState = this.agGrid.columnApi.getColumnState();
+    }
+    ngOnInit() {
+        this.gridPageSize = this.pageSize;
+        this.cacheBlockSize = this.cacheBlockSize = 0
+            ? this.pageSize
+            : this.cacheBlockSize;
+        this.gridService.setBaseUrl(this.environment);
+        this.getGridState();
+        this.getColDef();
+        if (this.enableServerSidePaging == true) {
+            this.rowModelType = 'serverSide';
+            this.rowData = '';
+        }
+        else {
+            this.rowModelType = 'clientSide';
+        }
+    }
+    onModelUpdated() {
+        this.setGridState();
+    }
+    getColDef() {
+        if (this.gridId && this.loggedInUser) {
+            this.gridService.getColDef(this.gridId).pipe(takeUntil(this.unsubscribe$)).subscribe((response) => {
+                var _a, _b;
+                if (response.status == 1) {
+                    let coldef = response.list.map((res) => {
+                        if (res.isButton === false) {
+                            if (res.columnType === 'checkbox') {
+                                return {
+                                    field: res.field,
+                                    headerName: res.title,
+                                    sortable: false,
+                                    tooltipField: res.field,
+                                    resizable: true,
+                                    headerCheckboxSelection: false,
+                                    filterable: false,
+                                    checkboxSelection: true,
+                                    showDisabledCheckboxes: true,
+                                    suppressFilter: true,
+                                    suppressSorting: true,
+                                    suppressMenu: true,
+                                    width: 55,
+                                };
+                            }
+                            else if (res.columnType === 'dropdown') {
+                                return {
+                                    field: res.field,
+                                    headerName: res.title,
+                                    resizable: true,
+                                    sortable: false,
+                                    suppressFilter: true,
+                                    suppressSorting: true,
+                                    suppressMenu: true,
+                                    tooltipField: res.field,
+                                    cellRenderer: DropdownRenderer,
+                                    cellRendererParams: {
+                                        onClick: this.onBtnClick.bind(this),
+                                        tooltip: res.tooltip,
+                                        dropDownData: res.dropDownData,
+                                    },
+                                    onCellClicked: (e) => {
+                                        e.node.setSelected(false);
+                                    },
+                                    width: 40,
+                                    pinned: res.pinPosition,
+                                    lockPinned: true,
+                                };
+                            }
+                            else {
+                                return {
+                                    field: res.field,
+                                    headerName: res.title,
+                                    resizable: true,
+                                    hide: !res.visible,
+                                    sortable: true,
+                                    tooltipField: res.field,
+                                    floatingFilter: this.floatingFilter,
+                                    valueFormatter: (params) => this.formatterService.colValueFormatter(params, res.columnType),
+                                    filterable: res.filterable,
+                                    filter: res.columnType == 'string'
+                                        ? 'agTextColumnFilter'
+                                        : res.columnType == 'number'
+                                            ? 'agNumberColumnFilter'
+                                            : 'agDateColumnFilter',
+                                    filterParams: {
+                                        comparator: (filterLocalDateAtMidnight, cellValue) => {
+                                            const dateAsString = cellValue;
+                                            if (dateAsString == null) {
+                                                return 0;
+                                            }
+                                            if (res.columnType == 'date') {
+                                                const cellDate = new Date(dateAsString);
+                                                if (cellDate < filterLocalDateAtMidnight) {
+                                                    return -1;
+                                                }
+                                                else if (cellDate > filterLocalDateAtMidnight) {
+                                                    return 1;
+                                                }
+                                            }
+                                            return 0;
+                                        },
+                                        buttons: ['reset']
+                                    },
+                                };
+                            }
+                        }
+                        else {
+                            return {
+                                field: res.field,
+                                headerName: res.title,
+                                resizable: true,
+                                sortable: false,
+                                hide: !res.visible,
+                                suppressFilter: true,
+                                suppressSorting: true,
+                                suppressMenu: true,
+                                tooltipField: res.field,
+                                cellRenderer: ButtonRendererComponent,
+                                cellRendererParams: {
+                                    onClick: this.onBtnClick.bind(this),
+                                    label: res.label,
+                                    icon: res.icon,
+                                    buttonName: res.buttonName,
+                                    tooltip: res.tooltip,
+                                },
+                                valueGetter: (params) => {
+                                    return res.tooltip || res.title;
+                                },
+                                minWidth: 20,
+                                cellClass: 'action-button',
+                                pinned: res.pinPosition,
+                                lockPinned: true,
+                                width: res.label ? 100 : 40,
+                            };
+                        }
+                    });
+                    this.exportColumnsList = response.list;
+                    this.columnDefs = coldef;
+                    (_b = (_a = this.agGrid.gridOptions) === null || _a === void 0 ? void 0 : _a.api) === null || _b === void 0 ? void 0 : _b.setColumnDefs(coldef);
+                    this.getGridState();
+                }
+                else {
+                    console.log('ColDef Read Error=>', response.message);
+                }
+            });
+        }
+        else {
+            console.log('Please pass valid GridId and loggedIn user Id');
+        }
+    }
+    setExternalFilters(options) {
+        var serverUrl = '';
+        if (this.serverDataUrl.indexOf('filter') >= 0 &&
+            options.indexOf('filter') >= 0) {
+            let slug = this.serverDataUrl.split('?$filter=');
+            if (slug && slug.length > 0) {
+                options = options + ' and ' + slug[1];
+                serverUrl = slug[0];
+            }
+        }
+        else if (this.serverDataUrl.indexOf('?') >= 0) {
+            serverUrl = this.serverDataUrl;
+            options = options.replace('?', '&');
+        }
+        return `${serverUrl}${options}`;
+    }
+    onGridReady(params) {
+        this.gridPageSize = this.pageSize;
+        if (this.enableServerSidePaging == true) {
+            params.api.setServerSideDatasource(new OdataServerSideProvider({
+                isCaseSensitiveStringFilter: false,
+                callApi: (options) => fetch(`${this.setExternalFilters(options)}`, {
+                    headers: {
+                        'Content-type': 'application/json',
+                        Accept: 'application/json',
+                    },
+                }).then((response) => response.json()),
+                afterLoadData: (options, rowData, totalCount) => {
+                    if (!rowData || rowData.length <= 0) {
+                        this.agGrid.api.showNoRowsOverlay();
+                    }
+                    else {
+                        this.agGrid.api.hideOverlay();
+                    }
+                },
+            }));
+        }
+    }
+    setGridState() {
+        if (this.gridColumnState) {
+            this.agGrid.columnApi.applyColumnState({
+                state: this.gridColumnState,
+                applyOrder: true,
+            });
+        }
+        else {
+            var columns = this.agGrid.columnApi.getColumns();
+            if (columns && columns.length > 0) {
+                if (columns.length > 15) {
+                    const allColumnIds = [];
+                    this.agGrid.columnApi.getColumns().forEach((column) => {
+                        allColumnIds.push(column.getId());
+                    });
+                    this.agGrid.columnApi.autoSizeColumns(allColumnIds, false);
+                }
+                else {
+                    this.agGrid.api.sizeColumnsToFit();
+                }
+            }
+        }
+    }
+    getGridState() {
+        if (this.gridId && this.loggedInUser) {
+            this.gridService
+                .getGridState(this.gridId, this.loggedInUser)
+                .pipe(takeUntil(this.unsubscribe$))
+                .subscribe((response) => {
+                if (response.status == 1 &&
+                    response.object &&
+                    response.object.gridConfig) {
+                    this.gridColumnState = JSON.parse(response.object.gridConfig);
+                    this.setGridState();
+                }
+                else {
+                    console.log('Error while loading grid state');
+                }
+            });
+        }
+    }
+    onBtnClick(e) {
+        console.log('btn click=>', e);
+        this.btnClickHandler.emit(e.rowData);
+    }
+    onSaveGridColumnState(event) {
+        var _a;
+        let columnState = (_a = this.agGrid.columnApi) === null || _a === void 0 ? void 0 : _a.getColumnState();
+        let columnData = {
+            gridConfig: JSON.stringify(columnState),
+            uiGridId: this.gridId,
+            userId: this.loggedInUser,
+        };
+        if (event.finished == true || event.type === 'columnPinned') {
+            this.gridColumnState = columnState;
+            this.gridService.saveColumnConfig(columnData)
+                .pipe(takeUntil(this.unsubscribe$))
+                .subscribe((res) => {
+                this.setGridState();
+                if (res.status == 0) {
+                    console.log('Error while saving column configuration:', res.message);
+                }
+            });
+        }
+    }
+    //custom export method
+    exportFile(type) {
+        this.getDataForExcelExport(type);
+    }
+    //Generate only those columns for export which are visible and are not of other types that are not required for export
+    generateColumnsForExcel() {
+        let columnsToBeDisplayedForExcel = [];
+        this.exportColumnsList.forEach((column) => {
+            if (column.visible == true &&
+                column.columnType != 'checkbox' &&
+                column.columnType != 'dropdown' &&
+                column.columnType != '') {
+                columnsToBeDisplayedForExcel.push(column.field);
+            }
+        });
+        return columnsToBeDisplayedForExcel;
+    }
+    //Get data from server without paging so that whole data can be exported to excel
+    // and also check for server side and client side rendering of data for export.
+    getDataForExcelExport(type) {
+        this.agGrid.api.showLoadingOverlay();
+        if (this.enableServerSidePaging) {
+            this.gridService
+                .getDataForExport(this.serverDataUrl)
+                .pipe(takeUntil(this.unsubscribe$))
+                .subscribe((response) => {
+                this.agGrid.api.hideOverlay();
+                if (response && response.value.length > 0) {
+                    this.excelAPI.setRowData(response.value);
+                    this.excelAPI.sizeColumnsToFit();
+                    if (type == 'csv') {
+                        this.excelAPI.exportDataAsCsv({
+                            columnKeys: this.generateColumnsForExcel(),
+                        });
+                    }
+                    else {
+                        this.excelAPI.exportDataAsExcel({
+                            columnKeys: this.generateColumnsForExcel(),
+                        });
+                    }
+                }
+                else {
+                    console.log('Error while fetching data for excel/csv export');
+                }
+            });
+        }
+        else {
+            this.agGrid.api.hideOverlay();
+            if (type == 'csv') {
+                this.agGrid.api.exportDataAsCsv({
+                    columnKeys: this.generateColumnsForExcel(),
+                });
+            }
+            else {
+                this.agGrid.api.exportDataAsExcel({
+                    columnKeys: this.generateColumnsForExcel(),
+                });
+            }
+        }
+    }
+    onSelectionChanged(e) {
+        this.selectionChanged.emit(e);
+    }
+    onFilterChanged(e) {
+        this.filterChanged.emit(e);
+    }
+    onFirstDataRendered(e) {
+        this.firstDataRendered.emit(e);
+    }
+    onGridReadyExcel(params) {
+        this.excelAPI = params.api;
+    }
+    //destroy all associated subscriptions on component destroy
+    ngOnDestroy() {
+        this.unsubscribe$.next();
+        this.unsubscribe$.complete();
+    }
+}
+GridLibraryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: GridLibraryComponent, deps: [{ token: GridLibraryService }, { token: ColumnValueFormatter }], target: i0.ɵɵFactoryTarget.Component });
+GridLibraryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.6", type: GridLibraryComponent, selector: "lib-basesite-shared-grid-lib", inputs: { columnDefs: "columnDefs", rowData: "rowData", pageSize: "pageSize", rowSelection: "rowSelection", gridId: "gridId", loggedInUser: "loggedInUser", enableServerSidePaging: "enableServerSidePaging", serverDataUrl: "serverDataUrl", environment: "environment", cacheBlockSize: "cacheBlockSize", rowMultiSelectWithClick: "rowMultiSelectWithClick", floatingFilter: "floatingFilter", paginationAutoPageSize: "paginationAutoPageSize" }, outputs: { btnClickHandler: "btnClickHandler", firstDataRendered: "firstDataRendered", filterChanged: "filterChanged", selectionChanged: "selectionChanged" }, viewQueries: [{ propertyName: "agGrid", first: true, predicate: ["agGrid"], descendants: true }], ngImport: i0, template: `
+    <ag-grid-angular #agGrid
+      style="width: 100%;height:98.2vh"
+      class="ag-theme-balham shared-grid-lib"
+      [columnDefs]="columnDefs"
+      [defaultColDef]="defaultColDef"
+      [rowData]="rowData"
+      [rowSelection]="rowSelection"
+      [animateRows]="true"
+      (gridReady)="onGridReady($event)"
+      [pagination]="true"
+      [paginationPageSize]="gridPageSize"
+      [paginationNumberFormatter]="paginationNumberFormatter"
+      (modelUpdated)="onModelUpdated()"
+      [tooltipShowDelay]="tooltipShowDelay"
+      [tooltipHideDelay]="tooltipHideDelay"
+      [rowModelType]="rowModelType"
+      [cacheBlockSize]="cacheBlockSize"
+      [maxConcurrentDatasourceRequests]="1"
+      [blockLoadDebounceMillis]="100"
+      [paginationAutoPageSize]="paginationAutoPageSize"
+      (columnVisible)="onSaveGridColumnState($event)"
+      (columnPinned)="onSaveGridColumnState($event)"
+      (columnResized)="onSaveGridColumnState($event)"
+      (columnMoved)="onSaveGridColumnState($event)"
+      (sortChanged)="onSortChangedEvent()"
+      [rowMultiSelectWithClick]="rowMultiSelectWithClick"
+      [getContextMenuItems]="getContextMenuItems"
+      (selectionChanged)="onSelectionChanged($event)"
+      (filterChanged)="onFilterChanged($event)"
+      (firstDataRendered)="onFirstDataRendered($event)"
+    >
+    </ag-grid-angular>
+    <ag-grid-angular
+      #agGridHidden
+      style="height:100vh; width:100%;display:none"
+      class="ag-theme-balham"
+      [rowData]="rowDataHidden"
+      [columnDefs]="columnDefs"
+      [defaultColDef]="defaultColDef"
+      [animateRows]="false"
+      [rowSelection]="'multiple'"
+      (gridReady)="onGridReadyExcel($event)"
+      [suppressScrollOnNewData]="true"
+      [cacheQuickFilter]="false"
+    >
+    </ag-grid-angular>
+  `, isInline: true, dependencies: [{ kind: "component", type: i3.AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "suppressMenuHide", "enableBrowserTooltips", "tooltipShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "maintainColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressDragLeaveHidesColumns", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "components", "frameworkComponents", "editType", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterMovesDown", "enterMovesDownAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "quickFilterText", "cacheQuickFilter", "excludeHiddenColumnsFromQuickFilter", "excludeChildrenWhenTreeDataFiltering", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "enableChartToolPanelsButton", "suppressChartToolPanelsButton", "chartToolPanelsDef", "loadingCellRenderer", "loadingCellRendererFramework", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererFramework", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressParentsInRowNodes", "suppressTouch", "suppressFocusAfterRefresh", "suppressAsyncEvents", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentFramework", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentFramework", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "pagination", "paginationPageSize", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "suppressAggFuncInHeader", "suppressAggAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "enableCellChangeFlash", "cellFlashDelay", "cellFadeDelay", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "fullWidthCellRenderer", "fullWidthCellRendererFramework", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupAggFiltering", "groupIncludeFooter", "groupIncludeTotalFooter", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererFramework", "groupRowRendererParams", "suppressMakeColumnVisibleAfterUnGroup", "treeData", "rowGroupPanelSuppressSort", "groupRowsSticky", "rememberGroupStateWhenNewData", "pinnedTopRowData", "pinnedBottomRowData", "rowModelType", "rowData", "immutableData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "serverSideStoreType", "suppressServerSideInfiniteScroll", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideFilterAllLevels", "serverSideSortOnServer", "serverSideFilterOnServer", "serverSideSortingAlwaysResets", "serverSideFilteringAlwaysResets", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellSelection", "suppressCellFocus", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "deltaSort", "treeDataDisplayType", "functionsPassive", "enableGroupEdit", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "localeTextFunc", "getLocaleText", "getDocument", "paginationNumberFormatter", "groupRowAggNodes", "getGroupRowAgg", "isGroupOpenByDefault", "initialGroupOrderComparator", "defaultGroupOrderComparator", "processSecondaryColDef", "processSecondaryColGroupDef", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "getServerSideStoreParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowNodeId", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSort", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthCell", "isFullWidthRow"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "filterOpened", "filterChanged", "filterModified", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "cellKeyPress", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pinnedRowDataChanged", "rowDataChanged", "rowDataUpdated", "asyncTransactionsFlushed", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "sortChanged", "columnRowGroupChangeRequest", "columnPivotChangeRequest", "columnValueChangeRequest", "columnAggFuncChangeRequest"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: GridLibraryComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-basesite-shared-grid-lib', template: `
+    <ag-grid-angular #agGrid
+      style="width: 100%;height:98.2vh"
+      class="ag-theme-balham shared-grid-lib"
+      [columnDefs]="columnDefs"
+      [defaultColDef]="defaultColDef"
+      [rowData]="rowData"
+      [rowSelection]="rowSelection"
+      [animateRows]="true"
+      (gridReady)="onGridReady($event)"
+      [pagination]="true"
+      [paginationPageSize]="gridPageSize"
+      [paginationNumberFormatter]="paginationNumberFormatter"
+      (modelUpdated)="onModelUpdated()"
+      [tooltipShowDelay]="tooltipShowDelay"
+      [tooltipHideDelay]="tooltipHideDelay"
+      [rowModelType]="rowModelType"
+      [cacheBlockSize]="cacheBlockSize"
+      [maxConcurrentDatasourceRequests]="1"
+      [blockLoadDebounceMillis]="100"
+      [paginationAutoPageSize]="paginationAutoPageSize"
+      (columnVisible)="onSaveGridColumnState($event)"
+      (columnPinned)="onSaveGridColumnState($event)"
+      (columnResized)="onSaveGridColumnState($event)"
+      (columnMoved)="onSaveGridColumnState($event)"
+      (sortChanged)="onSortChangedEvent()"
+      [rowMultiSelectWithClick]="rowMultiSelectWithClick"
+      [getContextMenuItems]="getContextMenuItems"
+      (selectionChanged)="onSelectionChanged($event)"
+      (filterChanged)="onFilterChanged($event)"
+      (firstDataRendered)="onFirstDataRendered($event)"
+    >
+    </ag-grid-angular>
+    <ag-grid-angular
+      #agGridHidden
+      style="height:100vh; width:100%;display:none"
+      class="ag-theme-balham"
+      [rowData]="rowDataHidden"
+      [columnDefs]="columnDefs"
+      [defaultColDef]="defaultColDef"
+      [animateRows]="false"
+      [rowSelection]="'multiple'"
+      (gridReady)="onGridReadyExcel($event)"
+      [suppressScrollOnNewData]="true"
+      [cacheQuickFilter]="false"
+    >
+    </ag-grid-angular>
+  ` }]
+        }], ctorParameters: function () { return [{ type: GridLibraryService }, { type: ColumnValueFormatter }]; }, propDecorators: { columnDefs: [{
+                type: Input
+            }], rowData: [{
+                type: Input
+            }], pageSize: [{
+                type: Input
+            }], rowSelection: [{
+                type: Input
+            }], gridId: [{
+                type: Input
+            }], loggedInUser: [{
+                type: Input
+            }], enableServerSidePaging: [{
+                type: Input
+            }], serverDataUrl: [{
+                type: Input
+            }], environment: [{
+                type: Input
+            }], cacheBlockSize: [{
+                type: Input
+            }], rowMultiSelectWithClick: [{
+                type: Input
+            }], floatingFilter: [{
+                type: Input
+            }], paginationAutoPageSize: [{
+                type: Input
+            }], btnClickHandler: [{
+                type: Output
+            }], firstDataRendered: [{
+                type: Output
+            }], filterChanged: [{
+                type: Output
+            }], selectionChanged: [{
+                type: Output
+            }], agGrid: [{
+                type: ViewChild,
+                args: ['agGrid']
+            }] } });
+
+LicenseManager.setLicenseKey("CompanyName=Basesite,LicensedGroup=Basesite,LicenseType=MultipleApplications,LicensedConcurrentDeveloperCount=2,LicensedProductionInstancesCount=2,AssetReference=AG-028469,ExpiryDate=19_May_2023_[v2]_MTY4NDQ1MDgwMDAwMA==ed6f437ea331cf602f669128db7b5387");
+class GridLibraryModule {
+}
+GridLibraryModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: GridLibraryModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+GridLibraryModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.6", ngImport: i0, type: GridLibraryModule, declarations: [GridLibraryComponent,
+        ButtonRendererComponent,
+        CustomTooltip,
+        DropdownRenderer], imports: [AgGridModule,
+        HttpClientModule,
+        CommonModule], exports: [GridLibraryComponent] });
+GridLibraryModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: GridLibraryModule, providers: [DatePipe, GridLibraryService, ColumnValueFormatter], imports: [AgGridModule,
+        HttpClientModule,
+        CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.6", ngImport: i0, type: GridLibraryModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        GridLibraryComponent,
+                        ButtonRendererComponent,
+                        CustomTooltip,
+                        DropdownRenderer
+                    ],
+                    imports: [
+                        AgGridModule,
+                        HttpClientModule,
+                        CommonModule,
+                    ],
+                    exports: [
+                        GridLibraryComponent
+                    ],
+                    providers: [DatePipe, GridLibraryService, ColumnValueFormatter]
+                }]
+        }] });
+
+/*
+ * Public API Surface of basesite-shared-grid-lib
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { GridLibraryComponent, GridLibraryModule, GridLibraryService };
+//# sourceMappingURL=basesite-shared-grid-lib.mjs.map