@acorex/data-grid 3.0.25 → 3.0.26

package/fesm2015/acorex-data-grid.js

@@ -7,1894 +7,1894 @@ import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
 import { AgGridModule } from 'ag-grid-angular';
 
-let AXDataGridCellTemplateComponent = class AXDataGridCellTemplateComponent {
-    constructor() {
-        this.renderer = AXDataGridCellTemplateRenderer;
-    }
-    ngOnInit() {
-        this.params = {
-            templateRef: this.templateRef
-        };
-    }
-};
-__decorate([
-    ContentChild(TemplateRef, { static: true }),
-    __metadata("design:type", TemplateRef)
-], AXDataGridCellTemplateComponent.prototype, "templateRef", void 0);
-AXDataGridCellTemplateComponent = __decorate([
-    Component({
-        selector: 'ax-cell-template',
-        template: `<ng-content></ng-content>
-   `
-    }),
-    __metadata("design:paramtypes", [])
-], AXDataGridCellTemplateComponent);
-let AXDataGridCellTemplateRenderer = class AXDataGridCellTemplateRenderer {
-    constructor() { }
-    agInit(params) {
-        this.rowData = params.data;
-        this.templateRef = params.templateRef;
-    }
-    refresh(params) {
-        this.rowData = params.data;
-        return true;
-    }
-};
-AXDataGridCellTemplateRenderer = __decorate([
-    Component({
-        template: `
-        <ng-container *ngTemplateOutlet='templateRef; context: { $implicit: rowData }'>
-        </ng-container>
-    `
-    }),
-    __metadata("design:paramtypes", [])
+let AXDataGridCellTemplateComponent = class AXDataGridCellTemplateComponent {
+    constructor() {
+        this.renderer = AXDataGridCellTemplateRenderer;
+    }
+    ngOnInit() {
+        this.params = {
+            templateRef: this.templateRef
+        };
+    }
+};
+__decorate([
+    ContentChild(TemplateRef, { static: true }),
+    __metadata("design:type", TemplateRef)
+], AXDataGridCellTemplateComponent.prototype, "templateRef", void 0);
+AXDataGridCellTemplateComponent = __decorate([
+    Component({
+        selector: 'ax-cell-template',
+        template: `<ng-content></ng-content>
+   `
+    }),
+    __metadata("design:paramtypes", [])
+], AXDataGridCellTemplateComponent);
+let AXDataGridCellTemplateRenderer = class AXDataGridCellTemplateRenderer {
+    constructor() { }
+    agInit(params) {
+        this.rowData = params.data;
+        this.templateRef = params.templateRef;
+    }
+    refresh(params) {
+        this.rowData = params.data;
+        return true;
+    }
+};
+AXDataGridCellTemplateRenderer = __decorate([
+    Component({
+        template: `
+        <ng-container *ngTemplateOutlet='templateRef; context: { $implicit: rowData }'>
+        </ng-container>
+    `
+    }),
+    __metadata("design:paramtypes", [])
 ], AXDataGridCellTemplateRenderer);
 
-class AXGridDataColumn {
-    constructor() {
-        this.width = 100;
-        this.pinned = null;
-        this.allowSorting = true;
-        this.allowFiltering = AXConfig.get('datagrid.allowFiltering') || false;
-        this.sort = null;
-        this.field = '';
-        this.caption = '';
-        this.checkbox = false;
-        this.headerCheckbox = false;
-        this.groupIndex = -1;
-        this.treeIndex = -1;
-        this.enableRowGroup = false;
-        this.hide = false;
-        this.floatingFilter = AXConfig.get('datagrid.floatingFilter') || false;
-        this.disableMenu = false;
-        this.resizable = true;
-        this.menuColumnDisable = false;
-        this.menuItemDisable = false;
-    }
-    ;
-    render() {
-        const col = {
-            field: this.field,
-            width: this.width,
-        };
-        col.resizable = this.resizable;
-        col.suppressMenu = this.disableMenu;
-        col.menuTabs = ['filterMenuTab', 'columnsMenuTab', 'generalMenuTab'];
-        col.floatingFilter = this.floatingFilter;
-        if (!this.allowFiltering) {
-            col.filter = false;
-            col.menuTabs = col.menuTabs.filter(c => c != 'filterMenuTab');
-            col.floatingFilter = false;
-        }
-        if (this.menuColumnDisable == true) {
-            col.menuTabs = col.menuTabs.filter(c => c != 'columnsMenuTab');
-        }
-        if (this.menuItemDisable == true) {
-            col.menuTabs = col.menuTabs.filter(c => c != 'generalMenuTab');
-        }
-        if (this.caption) {
-            col.headerName = this.caption;
-        }
-        if (this.minWidth) {
-            col.minWidth = this.minWidth;
-        }
-        if (this.maxWidth) {
-            col.maxWidth = this.maxWidth;
-        }
-        if (this.pinned) {
-            col.pinned = this.pinned === 'start' ? 'right' : 'left';
-            // TODO: Change based on layout
-        }
-        if (this.allowSorting) {
-            col.sortable = this.allowSorting;
-        }
-        if (this.sort) {
-            col.sort = this.sort;
-        }
-        if (this.groupIndex >= 0) {
-            col.rowGroupIndex = this.groupIndex;
-            col.rowGroup = true;
-            this.enableRowGroup = true;
-        }
-        if (this.treeIndex >= 0) {
-            col.rowGroupIndex = this.treeIndex;
-            col.rowGroup = false;
-        }
-        if (this.hide) {
-            col.hide = true;
-        }
-        if (this.enableRowGroup) {
-            col.enableRowGroup = this.enableRowGroup;
-        }
-        if (this.cellClass) {
-            const THAT = this;
-            if (this.cellClass instanceof Function) {
-                col.cellClass = (p) => {
-                    return THAT.cellClass({
-                        column: THAT,
-                        rowIndex: p.node.rowIndex,
-                        rowLevel: p.node.level,
-                        data: p.data,
-                        value: p.value
-                    });
-                };
-            }
-            else {
-                col.cellClass = this.cellClass;
-            }
-        }
-        //
-        if (this.cellTemplate != null) {
-            col.cellRendererFramework = this.cellTemplate.renderer;
-            col.cellRendererParams = this.cellTemplate.params;
-        }
-        if (this.checkbox) {
-            col.checkboxSelection = (params) => {
-                return true;
-            };
-            //  col.headerCheckboxSelection = this.headerCheckbox;
-        }
-        return col;
-    }
-}
-__decorate([
-    ContentChild(AXDataGridCellTemplateComponent),
-    __metadata("design:type", AXDataGridCellTemplateComponent)
-], AXGridDataColumn.prototype, "cellTemplate", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Number)
-], AXGridDataColumn.prototype, "width", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Number)
-], AXGridDataColumn.prototype, "maxWidth", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Number)
-], AXGridDataColumn.prototype, "minWidth", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXGridDataColumn.prototype, "pinned", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXGridDataColumn.prototype, "allowSorting", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXGridDataColumn.prototype, "allowFiltering", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Function)
-], AXGridDataColumn.prototype, "cellClass", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXGridDataColumn.prototype, "sort", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXGridDataColumn.prototype, "field", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXGridDataColumn.prototype, "caption", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], AXGridDataColumn.prototype, "cellRendererParams", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXGridDataColumn.prototype, "checkbox", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXGridDataColumn.prototype, "headerCheckbox", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Number)
-], AXGridDataColumn.prototype, "groupIndex", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Number)
-], AXGridDataColumn.prototype, "treeIndex", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXGridDataColumn.prototype, "enableRowGroup", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXGridDataColumn.prototype, "hide", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXGridDataColumn.prototype, "floatingFilter", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXGridDataColumn.prototype, "disableMenu", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXGridDataColumn.prototype, "resizable", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXGridDataColumn.prototype, "menuColumnDisable", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
+class AXGridDataColumn {
+    constructor() {
+        this.width = 100;
+        this.pinned = null;
+        this.allowSorting = true;
+        this.allowFiltering = AXConfig.get('datagrid.allowFiltering') || false;
+        this.sort = null;
+        this.field = '';
+        this.caption = '';
+        this.checkbox = false;
+        this.headerCheckbox = false;
+        this.groupIndex = -1;
+        this.treeIndex = -1;
+        this.enableRowGroup = false;
+        this.hide = false;
+        this.floatingFilter = AXConfig.get('datagrid.floatingFilter') || false;
+        this.disableMenu = false;
+        this.resizable = true;
+        this.menuColumnDisable = false;
+        this.menuItemDisable = false;
+    }
+    ;
+    render() {
+        const col = {
+            field: this.field,
+            width: this.width,
+        };
+        col.resizable = this.resizable;
+        col.suppressMenu = this.disableMenu;
+        col.menuTabs = ['filterMenuTab', 'columnsMenuTab', 'generalMenuTab'];
+        col.floatingFilter = this.floatingFilter;
+        if (!this.allowFiltering) {
+            col.filter = false;
+            col.menuTabs = col.menuTabs.filter(c => c != 'filterMenuTab');
+            col.floatingFilter = false;
+        }
+        if (this.menuColumnDisable == true) {
+            col.menuTabs = col.menuTabs.filter(c => c != 'columnsMenuTab');
+        }
+        if (this.menuItemDisable == true) {
+            col.menuTabs = col.menuTabs.filter(c => c != 'generalMenuTab');
+        }
+        if (this.caption) {
+            col.headerName = this.caption;
+        }
+        if (this.minWidth) {
+            col.minWidth = this.minWidth;
+        }
+        if (this.maxWidth) {
+            col.maxWidth = this.maxWidth;
+        }
+        if (this.pinned) {
+            col.pinned = this.pinned === 'start' ? 'right' : 'left';
+            // TODO: Change based on layout
+        }
+        if (this.allowSorting) {
+            col.sortable = this.allowSorting;
+        }
+        if (this.sort) {
+            col.sort = this.sort;
+        }
+        if (this.groupIndex >= 0) {
+            col.rowGroupIndex = this.groupIndex;
+            col.rowGroup = true;
+            this.enableRowGroup = true;
+        }
+        if (this.treeIndex >= 0) {
+            col.rowGroupIndex = this.treeIndex;
+            col.rowGroup = false;
+        }
+        if (this.hide) {
+            col.hide = true;
+        }
+        if (this.enableRowGroup) {
+            col.enableRowGroup = this.enableRowGroup;
+        }
+        if (this.cellClass) {
+            const THAT = this;
+            if (this.cellClass instanceof Function) {
+                col.cellClass = (p) => {
+                    return THAT.cellClass({
+                        column: THAT,
+                        rowIndex: p.node.rowIndex,
+                        rowLevel: p.node.level,
+                        data: p.data,
+                        value: p.value
+                    });
+                };
+            }
+            else {
+                col.cellClass = this.cellClass;
+            }
+        }
+        //
+        if (this.cellTemplate != null) {
+            col.cellRendererFramework = this.cellTemplate.renderer;
+            col.cellRendererParams = this.cellTemplate.params;
+        }
+        if (this.checkbox) {
+            col.checkboxSelection = (params) => {
+                return true;
+            };
+            //  col.headerCheckboxSelection = this.headerCheckbox;
+        }
+        return col;
+    }
+}
+__decorate([
+    ContentChild(AXDataGridCellTemplateComponent),
+    __metadata("design:type", AXDataGridCellTemplateComponent)
+], AXGridDataColumn.prototype, "cellTemplate", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Number)
+], AXGridDataColumn.prototype, "width", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Number)
+], AXGridDataColumn.prototype, "maxWidth", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Number)
+], AXGridDataColumn.prototype, "minWidth", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXGridDataColumn.prototype, "pinned", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXGridDataColumn.prototype, "allowSorting", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXGridDataColumn.prototype, "allowFiltering", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Function)
+], AXGridDataColumn.prototype, "cellClass", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXGridDataColumn.prototype, "sort", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXGridDataColumn.prototype, "field", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXGridDataColumn.prototype, "caption", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], AXGridDataColumn.prototype, "cellRendererParams", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXGridDataColumn.prototype, "checkbox", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXGridDataColumn.prototype, "headerCheckbox", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Number)
+], AXGridDataColumn.prototype, "groupIndex", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Number)
+], AXGridDataColumn.prototype, "treeIndex", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXGridDataColumn.prototype, "enableRowGroup", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXGridDataColumn.prototype, "hide", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXGridDataColumn.prototype, "floatingFilter", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXGridDataColumn.prototype, "disableMenu", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXGridDataColumn.prototype, "resizable", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXGridDataColumn.prototype, "menuColumnDisable", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
 ], AXGridDataColumn.prototype, "menuItemDisable", void 0);
 
-var AXGridCheckColumn_1;
-let AXGridCheckColumn = AXGridCheckColumn_1 = class AXGridCheckColumn extends AXGridDataColumn {
-    constructor() {
-        super();
-    }
-    render() {
-        const col = super.render();
-        if (!col.cellRendererFramework) {
-            col.cellRendererFramework = BooleanRenderer;
-        }
-        if (this.allowFiltering) {
-            col.filterFramework = BooleanFilterRenderer;
-        }
-        return col;
-    }
-};
-AXGridCheckColumn = AXGridCheckColumn_1 = __decorate([
-    Component({
-        selector: 'ax-check-column',
-        template: '',
-        providers: [{ provide: AXGridDataColumn, useExisting: AXGridCheckColumn_1 }],
-        changeDetection: ChangeDetectionStrategy.OnPush
-    }),
-    __metadata("design:paramtypes", [])
-], AXGridCheckColumn);
-let BooleanRenderer = class BooleanRenderer {
-    constructor() { }
-    agInit(params) {
-        this.value = params.value;
-    }
-    refresh(params) {
-        this.value = params.value;
-        return true;
-    }
-};
-BooleanRenderer = __decorate([
-    Component({
-        template: `
-    <ax-check-box [value]='value' readonly='true'></ax-check-box>
-  `,
-        changeDetection: ChangeDetectionStrategy.OnPush
-    }),
-    __metadata("design:paramtypes", [])
-], BooleanRenderer);
-let BooleanFilterRenderer = class BooleanFilterRenderer {
-    constructor() {
-        this.value = null;
-        this.selectItem = [
-            { value: 0, label: 'True' },
-            { value: 1, label: 'False' },
-        ];
-    }
-    agInit(params) {
-        this.params = params;
-        this.valueGetter = params.valueGetter;
-    }
-    isFilterActive() {
-        return this.value !== null && this.value !== undefined;
-    }
-    doesFilterPass(params) {
-        return this.value === this.valueGetter(params.node);
-    }
-    getModel() {
-        return { value: this.value };
-    }
-    setModel(model) {
-        this.value = model ? model.value : null;
-    }
-    ngAfterViewInit(params) {
-        window.setTimeout(() => {
-            this.input.element.nativeElement.focus();
-        });
-    }
-    onChange(newValue) {
-        if (this.value !== newValue) {
-            this.value = newValue;
-            this.params.filterChangedCallback();
-        }
-    }
-};
-__decorate([
-    ViewChild('input', { static: true, read: ViewContainerRef }),
-    __metadata("design:type", Object)
-], BooleanFilterRenderer.prototype, "input", void 0);
-BooleanFilterRenderer = __decorate([
-    Component({
-        template: `
-    <ax-data-grid-filter>
-      <ax-select-box
-        label='Select Box'
-        [items]='selectItem'
-      ></ax-select-box>
-    </ax-data-grid-filter>
-  `,
-        changeDetection: ChangeDetectionStrategy.OnPush
-    })
+var AXGridCheckColumn_1;
+let AXGridCheckColumn = AXGridCheckColumn_1 = class AXGridCheckColumn extends AXGridDataColumn {
+    constructor() {
+        super();
+    }
+    render() {
+        const col = super.render();
+        if (!col.cellRendererFramework) {
+            col.cellRendererFramework = BooleanRenderer;
+        }
+        if (this.allowFiltering) {
+            col.filterFramework = BooleanFilterRenderer;
+        }
+        return col;
+    }
+};
+AXGridCheckColumn = AXGridCheckColumn_1 = __decorate([
+    Component({
+        selector: 'ax-check-column',
+        template: '',
+        providers: [{ provide: AXGridDataColumn, useExisting: AXGridCheckColumn_1 }],
+        changeDetection: ChangeDetectionStrategy.OnPush
+    }),
+    __metadata("design:paramtypes", [])
+], AXGridCheckColumn);
+let BooleanRenderer = class BooleanRenderer {
+    constructor() { }
+    agInit(params) {
+        this.value = params.value;
+    }
+    refresh(params) {
+        this.value = params.value;
+        return true;
+    }
+};
+BooleanRenderer = __decorate([
+    Component({
+        template: `
+    <ax-check-box [value]='value' readonly='true'></ax-check-box>
+  `,
+        changeDetection: ChangeDetectionStrategy.OnPush
+    }),
+    __metadata("design:paramtypes", [])
+], BooleanRenderer);
+let BooleanFilterRenderer = class BooleanFilterRenderer {
+    constructor() {
+        this.value = null;
+        this.selectItem = [
+            { value: 0, label: 'True' },
+            { value: 1, label: 'False' },
+        ];
+    }
+    agInit(params) {
+        this.params = params;
+        this.valueGetter = params.valueGetter;
+    }
+    isFilterActive() {
+        return this.value !== null && this.value !== undefined;
+    }
+    doesFilterPass(params) {
+        return this.value === this.valueGetter(params.node);
+    }
+    getModel() {
+        return { value: this.value };
+    }
+    setModel(model) {
+        this.value = model ? model.value : null;
+    }
+    ngAfterViewInit(params) {
+        window.setTimeout(() => {
+            this.input.element.nativeElement.focus();
+        });
+    }
+    onChange(newValue) {
+        if (this.value !== newValue) {
+            this.value = newValue;
+            this.params.filterChangedCallback();
+        }
+    }
+};
+__decorate([
+    ViewChild('input', { static: true, read: ViewContainerRef }),
+    __metadata("design:type", Object)
+], BooleanFilterRenderer.prototype, "input", void 0);
+BooleanFilterRenderer = __decorate([
+    Component({
+        template: `
+    <ax-data-grid-filter>
+      <ax-select-box
+        label='Select Box'
+        [items]='selectItem'
+      ></ax-select-box>
+    </ax-data-grid-filter>
+  `,
+        changeDetection: ChangeDetectionStrategy.OnPush
+    })
 ], BooleanFilterRenderer);
 
-var AXGridCommandColumn_1;
-let AXGridCommandColumn = AXGridCommandColumn_1 = class AXGridCommandColumn extends AXGridDataColumn {
-    constructor() {
-        super(...arguments);
-        this.items = [];
-        this.onItemClick = new EventEmitter();
-    }
-    render() {
-        const col = super.render();
-        if (!col.cellRendererFramework) {
-            col.cellRendererFramework = CommandRenderer;
-        }
-        col.cellRendererParams = {
-            items: this.items,
-            onClick: (e) => {
-                this.onItemClick.emit({
-                    command: e.name,
-                    data: e.data,
-                    rowIndex: e.rowIndex,
-                    rowLevel: e.rowLevel,
-                    htmlEvent: e.htmlEvent
-                });
-            }
-        };
-        col.sortable = false;
-        col.filter = false;
-        col.valueGetter = (params) => {
-            return this.items;
-        };
-        return col;
-    }
-};
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], AXGridCommandColumn.prototype, "items", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXGridCommandColumn.prototype, "onItemClick", void 0);
-AXGridCommandColumn = AXGridCommandColumn_1 = __decorate([
-    Component({
-        selector: 'ax-command-column',
-        template: '',
-        providers: [{ provide: AXGridDataColumn, useExisting: AXGridCommandColumn_1 }],
-        changeDetection: ChangeDetectionStrategy.OnPush,
-        encapsulation: ViewEncapsulation.None
-    })
-], AXGridCommandColumn);
-let CommandRenderer = class CommandRenderer {
-    constructor() {
-        this.items = [];
-    }
-    agInit(params) {
-        this.mapParams(params);
-    }
-    refresh(params) {
-        this.mapParams(params);
-        return true;
-    }
-    mapParams(params) {
-        this.node = params.node;
-        this.items = typeof params.items == 'function' ? params.items({ data: this.node.data }) : Array.isArray(params.items) ? params.items : [];
-        this.clickCallback = params.onClick;
-    }
-    onClick(item, e) {
-        if (this.clickCallback && !item.disable) {
-            this.clickCallback({
-                name: item.name,
-                rowLevel: this.node.level,
-                rowIndex: this.node.rowIndex,
-                data: this.node.data,
-                htmlEvent: e
-            });
-        }
-    }
-};
-CommandRenderer = __decorate([
-    Component({
-        selector: 'ax-command-cell',
-        template: `
-    <button
-      *ngFor="let item of items"
-      class="ax button md ax-grid-command-button {{ item.style || 'ax primary blank' }}"
-      [class.disabled]="item.disable"
-      type="button"
-      [title]="item.tooltip"
-      (click)="onClick(item,$event)"
-    >
-      <i [ngClass]="item.icon"></i>{{ item.text }}
-    </button>
-  `,
-        encapsulation: ViewEncapsulation.None,
-        changeDetection: ChangeDetectionStrategy.OnPush
-    }),
-    __metadata("design:paramtypes", [])
+var AXGridCommandColumn_1;
+let AXGridCommandColumn = AXGridCommandColumn_1 = class AXGridCommandColumn extends AXGridDataColumn {
+    constructor() {
+        super(...arguments);
+        this.items = [];
+        this.onItemClick = new EventEmitter();
+    }
+    render() {
+        const col = super.render();
+        if (!col.cellRendererFramework) {
+            col.cellRendererFramework = CommandRenderer;
+        }
+        col.cellRendererParams = {
+            items: this.items,
+            onClick: (e) => {
+                this.onItemClick.emit({
+                    command: e.name,
+                    data: e.data,
+                    rowIndex: e.rowIndex,
+                    rowLevel: e.rowLevel,
+                    htmlEvent: e.htmlEvent
+                });
+            }
+        };
+        col.sortable = false;
+        col.filter = false;
+        col.valueGetter = (params) => {
+            return this.items;
+        };
+        return col;
+    }
+};
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], AXGridCommandColumn.prototype, "items", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXGridCommandColumn.prototype, "onItemClick", void 0);
+AXGridCommandColumn = AXGridCommandColumn_1 = __decorate([
+    Component({
+        selector: 'ax-command-column',
+        template: '',
+        providers: [{ provide: AXGridDataColumn, useExisting: AXGridCommandColumn_1 }],
+        changeDetection: ChangeDetectionStrategy.OnPush,
+        encapsulation: ViewEncapsulation.None
+    })
+], AXGridCommandColumn);
+let CommandRenderer = class CommandRenderer {
+    constructor() {
+        this.items = [];
+    }
+    agInit(params) {
+        this.mapParams(params);
+    }
+    refresh(params) {
+        this.mapParams(params);
+        return true;
+    }
+    mapParams(params) {
+        this.node = params.node;
+        this.items = typeof params.items == 'function' ? params.items({ data: this.node.data }) : Array.isArray(params.items) ? params.items : [];
+        this.clickCallback = params.onClick;
+    }
+    onClick(item, e) {
+        if (this.clickCallback && !item.disable) {
+            this.clickCallback({
+                name: item.name,
+                rowLevel: this.node.level,
+                rowIndex: this.node.rowIndex,
+                data: this.node.data,
+                htmlEvent: e
+            });
+        }
+    }
+};
+CommandRenderer = __decorate([
+    Component({
+        selector: 'ax-command-cell',
+        template: `
+    <button
+      *ngFor="let item of items"
+      class="ax button md ax-grid-command-button {{ item.style || 'ax primary blank' }}"
+      [class.disabled]="item.disable"
+      type="button"
+      [title]="item.tooltip"
+      (click)="onClick(item,$event)"
+    >
+      <i [ngClass]="item.icon"></i>{{ item.text }}
+    </button>
+  `,
+        encapsulation: ViewEncapsulation.None,
+        changeDetection: ChangeDetectionStrategy.OnPush
+    }),
+    __metadata("design:paramtypes", [])
 ], CommandRenderer);
 
-var AXGridDateColumn_1;
-let AXGridDateColumn = AXGridDateColumn_1 = class AXGridDateColumn extends AXGridDataColumn {
-    constructor() {
-        super();
-        this.type = AXConfig.get('dateTime.type');
-    }
-    render() {
-        const col = super.render();
-        col.cellRendererParams = {
-            format: this.format,
-        };
-        col.comparator = (valueA, valueB) => {
-            const date1 = AXDateTime.convert(valueA);
-            const date2 = AXDateTime.convert(valueB);
-            //
-            if (date1 === null && date2 === null) {
-                return 0;
-            }
-            if (date1 === null) {
-                return -1;
-            }
-            if (date2 === null) {
-                return 1;
-            }
-            return (date1.date.getTime() - date2.date.getTime());
-        };
-        col.valueFormatter = (params) => {
-            const date = AXDateTime.convert(params.value, this.type);
-            if (date) {
-                return date.format(this.format);
-            }
-            else {
-                return null;
-            }
-        };
-        col.filter = 'agDateColumnFilter';
-        // col.floatingFilter = true;
-        return col;
-    }
-};
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXGridDateColumn.prototype, "format", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXGridDateColumn.prototype, "type", void 0);
-AXGridDateColumn = AXGridDateColumn_1 = __decorate([
-    Component({
-        selector: 'ax-date-column',
-        template: '',
-        providers: [{ provide: AXGridDataColumn, useExisting: AXGridDateColumn_1 }],
-        changeDetection: ChangeDetectionStrategy.OnPush
-    }),
-    __metadata("design:paramtypes", [])
-], AXGridDateColumn);
-let AXDatePickerFilterComponent = class AXDatePickerFilterComponent {
-    constructor() {
-        this.selectableHoliday = false;
-        this.type = 'jalali';
-    }
-    agInit(params) {
-        this.params = params;
-    }
-    ngAfterViewInit() {
-    }
-    ngOnDestroy() {
-        console.log(`Destroying DateComponent`);
-    }
-    onDateChanged(selectedDates) {
-        //this.date = selectedDates[0] || null;
-        this.params.onDateChanged();
-    }
-    getDate() {
-        return this.date;
-    }
-    setDate(date) {
-        this.date = date || null;
-        //this.picker.setDate(date);
-    }
-    setInputPlaceholder(placeholder) {
-        //this.div.nativeElement.setAttribute('placeholder', placeholder);
-    }
-    onValueChanged(e) {
-        this.setDate(e.value);
-        this.onDateChanged(e.value);
-    }
-};
-__decorate([
-    ViewChild(AXDatePickerComponent),
-    __metadata("design:type", AXDatePickerComponent)
-], AXDatePickerFilterComponent.prototype, "datePicker", void 0);
-__decorate([
-    ViewChild('div', { read: ElementRef }),
-    __metadata("design:type", ElementRef)
-], AXDatePickerFilterComponent.prototype, "div", void 0);
-AXDatePickerFilterComponent = __decorate([
-    Component({
-        selector: 'ax-data-picker-filter',
-        template: `<ax-date-picker [selectableHoliday]="selectableHoliday" [allowClear]="true" (onValueChanged)="onValueChanged($event)" size="sm">
-     </ax-date-picker>`,
-        host: {},
-        encapsulation: ViewEncapsulation.None
-    })
+var AXGridDateColumn_1;
+let AXGridDateColumn = AXGridDateColumn_1 = class AXGridDateColumn extends AXGridDataColumn {
+    constructor() {
+        super();
+        this.type = AXConfig.get('dateTime.type');
+    }
+    render() {
+        const col = super.render();
+        col.cellRendererParams = {
+            format: this.format,
+        };
+        col.comparator = (valueA, valueB) => {
+            const date1 = AXDateTime.convert(valueA);
+            const date2 = AXDateTime.convert(valueB);
+            //
+            if (date1 === null && date2 === null) {
+                return 0;
+            }
+            if (date1 === null) {
+                return -1;
+            }
+            if (date2 === null) {
+                return 1;
+            }
+            return (date1.date.getTime() - date2.date.getTime());
+        };
+        col.valueFormatter = (params) => {
+            const date = AXDateTime.convert(params.value, this.type);
+            if (date) {
+                return date.format(this.format);
+            }
+            else {
+                return null;
+            }
+        };
+        col.filter = 'agDateColumnFilter';
+        // col.floatingFilter = true;
+        return col;
+    }
+};
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXGridDateColumn.prototype, "format", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXGridDateColumn.prototype, "type", void 0);
+AXGridDateColumn = AXGridDateColumn_1 = __decorate([
+    Component({
+        selector: 'ax-date-column',
+        template: '',
+        providers: [{ provide: AXGridDataColumn, useExisting: AXGridDateColumn_1 }],
+        changeDetection: ChangeDetectionStrategy.OnPush
+    }),
+    __metadata("design:paramtypes", [])
+], AXGridDateColumn);
+let AXDatePickerFilterComponent = class AXDatePickerFilterComponent {
+    constructor() {
+        this.selectableHoliday = false;
+        this.type = 'jalali';
+    }
+    agInit(params) {
+        this.params = params;
+    }
+    ngAfterViewInit() {
+    }
+    ngOnDestroy() {
+        console.log(`Destroying DateComponent`);
+    }
+    onDateChanged(selectedDates) {
+        //this.date = selectedDates[0] || null;
+        this.params.onDateChanged();
+    }
+    getDate() {
+        return this.date;
+    }
+    setDate(date) {
+        this.date = date || null;
+        //this.picker.setDate(date);
+    }
+    setInputPlaceholder(placeholder) {
+        //this.div.nativeElement.setAttribute('placeholder', placeholder);
+    }
+    onValueChanged(e) {
+        this.setDate(e.value);
+        this.onDateChanged(e.value);
+    }
+};
+__decorate([
+    ViewChild(AXDatePickerComponent),
+    __metadata("design:type", AXDatePickerComponent)
+], AXDatePickerFilterComponent.prototype, "datePicker", void 0);
+__decorate([
+    ViewChild('div', { read: ElementRef }),
+    __metadata("design:type", ElementRef)
+], AXDatePickerFilterComponent.prototype, "div", void 0);
+AXDatePickerFilterComponent = __decorate([
+    Component({
+        selector: 'ax-data-picker-filter',
+        template: `<ax-date-picker [selectableHoliday]="selectableHoliday" [allowClear]="true" (onValueChanged)="onValueChanged($event)" size="sm">
+     </ax-date-picker>`,
+        host: {},
+        encapsulation: ViewEncapsulation.None
+    })
 ], AXDatePickerFilterComponent);
 
-var AXGridSelectionColumn_1;
-let AXGridSelectionColumn = AXGridSelectionColumn_1 = class AXGridSelectionColumn extends AXGridDataColumn {
-    constructor() {
-        super();
-        this.pinned = 'start';
-    }
-    ngOnInit() {
-    }
-    render() {
-        const col = super.render();
-        col.checkboxSelection = this.condition ? this.condition : true;
-        //  col.headerCheckboxSelection = true;
-        col.pinned = this.pinned === 'start' ? 'right' : 'left';
-        col.filter = false;
-        col.resizable = false;
-        col.sortable = false;
-        col.width = 40;
-        return col;
-    }
-};
-__decorate([
-    Input(),
-    __metadata("design:type", Function)
-], AXGridSelectionColumn.prototype, "condition", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXGridSelectionColumn.prototype, "pinned", void 0);
-AXGridSelectionColumn = AXGridSelectionColumn_1 = __decorate([
-    Component({
-        selector: 'ax-selection-column',
-        template: '',
-        providers: [{ provide: AXGridDataColumn, useExisting: AXGridSelectionColumn_1 }],
-        changeDetection: ChangeDetectionStrategy.OnPush
-    }),
-    __metadata("design:paramtypes", [])
+var AXGridSelectionColumn_1;
+let AXGridSelectionColumn = AXGridSelectionColumn_1 = class AXGridSelectionColumn extends AXGridDataColumn {
+    constructor() {
+        super();
+        this.pinned = 'start';
+    }
+    ngOnInit() {
+    }
+    render() {
+        const col = super.render();
+        col.checkboxSelection = this.condition ? this.condition : true;
+        //  col.headerCheckboxSelection = true;
+        col.pinned = this.pinned === 'start' ? 'right' : 'left';
+        col.filter = false;
+        col.resizable = false;
+        col.sortable = false;
+        col.width = 40;
+        return col;
+    }
+};
+__decorate([
+    Input(),
+    __metadata("design:type", Function)
+], AXGridSelectionColumn.prototype, "condition", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXGridSelectionColumn.prototype, "pinned", void 0);
+AXGridSelectionColumn = AXGridSelectionColumn_1 = __decorate([
+    Component({
+        selector: 'ax-selection-column',
+        template: '',
+        providers: [{ provide: AXGridDataColumn, useExisting: AXGridSelectionColumn_1 }],
+        changeDetection: ChangeDetectionStrategy.OnPush
+    }),
+    __metadata("design:paramtypes", [])
 ], AXGridSelectionColumn);
 
-var AXGridTextColumn_1;
-let AXGridTextColumn = AXGridTextColumn_1 = class AXGridTextColumn extends AXGridDataColumn {
-    constructor() {
-        super();
-    }
-    render() {
-        const col = super.render();
-        // if (this.allowFiltering) {
-        //   col.filterFramework = TextFilterRenderer;
-        // }
-        col.filter = 'agTextColumnFilter';
-        return col;
-    }
-};
-AXGridTextColumn = AXGridTextColumn_1 = __decorate([
-    Component({
-        selector: 'ax-text-column',
-        template: '',
-        providers: [{ provide: AXGridDataColumn, useExisting: AXGridTextColumn_1 }],
-        changeDetection: ChangeDetectionStrategy.OnPush
-    }),
-    __metadata("design:paramtypes", [])
-], AXGridTextColumn);
-let TextFilterRenderer = class TextFilterRenderer {
-    constructor() {
-        this.value = null;
-    }
-    agInit(params) {
-        this.params = params;
-        this.valueGetter = params.valueGetter;
-    }
-    isFilterActive() {
-        return this.value !== null && this.value !== undefined;
-    }
-    doesFilterPass(params) {
-        return this.value === this.valueGetter(params.node);
-    }
-    getModel() {
-        return { value: this.value };
-    }
-    setModel(model) {
-        ;
-        this.onChange(model ? model.value : null);
-    }
-    ngAfterViewInit(params) {
-        window.setTimeout(() => {
-            this.input.focus();
-        });
-    }
-    onChange(newValue) {
-        if (this.value !== newValue) {
-            this.value = newValue;
-            if (this.value === '') {
-                this.value = null;
-            }
-            this.params.filterChangedCallback();
-        }
-    }
-};
-__decorate([
-    ViewChild(AXTextBoxComponent, { static: true }),
-    __metadata("design:type", AXTextBoxComponent)
-], TextFilterRenderer.prototype, "input", void 0);
-TextFilterRenderer = __decorate([
-    Component({
-        template: `
-    <ax-data-grid-filter>
-      <ax-text-box label='Filter' allowClear='true' (textChange)='onChange($event)'>
-      </ax-text-box>
-    </ax-data-grid-filter>
-  `,
-        changeDetection: ChangeDetectionStrategy.OnPush
-    })
+var AXGridTextColumn_1;
+let AXGridTextColumn = AXGridTextColumn_1 = class AXGridTextColumn extends AXGridDataColumn {
+    constructor() {
+        super();
+    }
+    render() {
+        const col = super.render();
+        // if (this.allowFiltering) {
+        //   col.filterFramework = TextFilterRenderer;
+        // }
+        col.filter = 'agTextColumnFilter';
+        return col;
+    }
+};
+AXGridTextColumn = AXGridTextColumn_1 = __decorate([
+    Component({
+        selector: 'ax-text-column',
+        template: '',
+        providers: [{ provide: AXGridDataColumn, useExisting: AXGridTextColumn_1 }],
+        changeDetection: ChangeDetectionStrategy.OnPush
+    }),
+    __metadata("design:paramtypes", [])
+], AXGridTextColumn);
+let TextFilterRenderer = class TextFilterRenderer {
+    constructor() {
+        this.value = null;
+    }
+    agInit(params) {
+        this.params = params;
+        this.valueGetter = params.valueGetter;
+    }
+    isFilterActive() {
+        return this.value !== null && this.value !== undefined;
+    }
+    doesFilterPass(params) {
+        return this.value === this.valueGetter(params.node);
+    }
+    getModel() {
+        return { value: this.value };
+    }
+    setModel(model) {
+        ;
+        this.onChange(model ? model.value : null);
+    }
+    ngAfterViewInit(params) {
+        window.setTimeout(() => {
+            this.input.focus();
+        });
+    }
+    onChange(newValue) {
+        if (this.value !== newValue) {
+            this.value = newValue;
+            if (this.value === '') {
+                this.value = null;
+            }
+            this.params.filterChangedCallback();
+        }
+    }
+};
+__decorate([
+    ViewChild(AXTextBoxComponent, { static: true }),
+    __metadata("design:type", AXTextBoxComponent)
+], TextFilterRenderer.prototype, "input", void 0);
+TextFilterRenderer = __decorate([
+    Component({
+        template: `
+    <ax-data-grid-filter>
+      <ax-text-box label='Filter' allowClear='true' (textChange)='onChange($event)'>
+      </ax-text-box>
+    </ax-data-grid-filter>
+  `,
+        changeDetection: ChangeDetectionStrategy.OnPush
+    })
 ], TextFilterRenderer);
 
-var AXGridRowNumberColumn_1;
-let AXGridRowNumberColumn = AXGridRowNumberColumn_1 = class AXGridRowNumberColumn extends AXGridDataColumn {
-    constructor() {
-        super();
-    }
-    ngOnInit() { }
-    render() {
-        const col = super.render();
-        //  col.checkboxSelection = this.condition ? this.condition : true;
-        //  col.headerCheckboxSelection = true;
-        (col.headerName = this.caption ? this.caption : AXConfig.get('layout.rtl') ? 'ردیف' : 'Row'),
-            (col.valueGetter = 'node.rowIndex + 1'),
-            (col.pinned = this.pinned == null ? (AXConfig.get('layout.rtl') ? 'right' : 'left') : this.pinned === 'start' ? 'right' : 'left'),
-            (col.filter = false);
-        col.resizable = true;
-        col.sortable = false;
-        col.width = this.width;
-        return col;
-    }
-};
-__decorate([
-    Input(),
-    __metadata("design:type", Function)
-], AXGridRowNumberColumn.prototype, "condition", void 0);
-AXGridRowNumberColumn = AXGridRowNumberColumn_1 = __decorate([
-    Component({
-        selector: 'ax-row-number-column',
-        template: '',
-        providers: [{ provide: AXGridDataColumn, useExisting: AXGridRowNumberColumn_1 }],
-        changeDetection: ChangeDetectionStrategy.OnPush
-    }),
-    __metadata("design:paramtypes", [])
+var AXGridRowNumberColumn_1;
+let AXGridRowNumberColumn = AXGridRowNumberColumn_1 = class AXGridRowNumberColumn extends AXGridDataColumn {
+    constructor() {
+        super();
+    }
+    ngOnInit() { }
+    render() {
+        const col = super.render();
+        //  col.checkboxSelection = this.condition ? this.condition : true;
+        //  col.headerCheckboxSelection = true;
+        (col.headerName = this.caption ? this.caption : AXConfig.get('layout.rtl') ? 'ردیف' : 'Row'),
+            (col.valueGetter = 'node.rowIndex + 1'),
+            (col.pinned = this.pinned == null ? (AXConfig.get('layout.rtl') ? 'right' : 'left') : this.pinned === 'start' ? 'right' : 'left'),
+            (col.filter = false);
+        col.resizable = true;
+        col.sortable = false;
+        col.width = this.width;
+        return col;
+    }
+};
+__decorate([
+    Input(),
+    __metadata("design:type", Function)
+], AXGridRowNumberColumn.prototype, "condition", void 0);
+AXGridRowNumberColumn = AXGridRowNumberColumn_1 = __decorate([
+    Component({
+        selector: 'ax-row-number-column',
+        template: '',
+        providers: [{ provide: AXGridDataColumn, useExisting: AXGridRowNumberColumn_1 }],
+        changeDetection: ChangeDetectionStrategy.OnPush
+    }),
+    __metadata("design:paramtypes", [])
 ], AXGridRowNumberColumn);
 
-let AXDataGridRowTemplateComponent = class AXDataGridRowTemplateComponent {
-    constructor() {
-        this.renderer = AXDataGridRowTemplateRenderer;
-    }
-    ngOnInit() {
-        this.params = {
-            templateRef: this.templateRef
-        };
-    }
-};
-__decorate([
-    ContentChild(TemplateRef, { static: true }),
-    __metadata("design:type", TemplateRef)
-], AXDataGridRowTemplateComponent.prototype, "templateRef", void 0);
-AXDataGridRowTemplateComponent = __decorate([
-    Component({
-        selector: 'ax-row-template',
-        template: `<ng-content></ng-content>`
-    }),
-    __metadata("design:paramtypes", [])
-], AXDataGridRowTemplateComponent);
-let AXDataGridRowTemplateRenderer = class AXDataGridRowTemplateRenderer {
-    refresh(params) {
-        return false;
-    }
-    agInit(params) {
-        this.data = params.data.callRecords;
-        this.templateRef = params.templateRef;
-    }
-};
-AXDataGridRowTemplateRenderer = __decorate([
-    Component({
-        template: `<ng-container *ngTemplateOutlet='templateRef; context: { $implicit: data }'></ng-container>`
-    })
+let AXDataGridRowTemplateComponent = class AXDataGridRowTemplateComponent {
+    constructor() {
+        this.renderer = AXDataGridRowTemplateRenderer;
+    }
+    ngOnInit() {
+        this.params = {
+            templateRef: this.templateRef
+        };
+    }
+};
+__decorate([
+    ContentChild(TemplateRef, { static: true }),
+    __metadata("design:type", TemplateRef)
+], AXDataGridRowTemplateComponent.prototype, "templateRef", void 0);
+AXDataGridRowTemplateComponent = __decorate([
+    Component({
+        selector: 'ax-row-template',
+        template: `<ng-content></ng-content>`
+    }),
+    __metadata("design:paramtypes", [])
+], AXDataGridRowTemplateComponent);
+let AXDataGridRowTemplateRenderer = class AXDataGridRowTemplateRenderer {
+    refresh(params) {
+        return false;
+    }
+    agInit(params) {
+        this.data = params.data.callRecords;
+        this.templateRef = params.templateRef;
+    }
+};
+AXDataGridRowTemplateRenderer = __decorate([
+    Component({
+        template: `<ng-container *ngTemplateOutlet='templateRef; context: { $implicit: data }'></ng-container>`
+    })
 ], AXDataGridRowTemplateRenderer);
 
-let AXDataGridDetailTemplateComponent = class AXDataGridDetailTemplateComponent {
-    constructor() {
-        this.height = 100;
-        this.renderer = AXDataGridDetailTemplateRenderer;
-    }
-    ngOnInit() {
-        this.params = {
-            templateRef: this.templateRef
-        };
-    }
-};
-__decorate([
-    ContentChild(TemplateRef, { static: true }),
-    __metadata("design:type", TemplateRef)
-], AXDataGridDetailTemplateComponent.prototype, "templateRef", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Number)
-], AXDataGridDetailTemplateComponent.prototype, "height", void 0);
-AXDataGridDetailTemplateComponent = __decorate([
-    Component({
-        selector: 'ax-grid-detail-template',
-        template: `<ng-content></ng-content>`
-    }),
-    __metadata("design:paramtypes", [])
-], AXDataGridDetailTemplateComponent);
-let AXDataGridDetailTemplateRenderer = class AXDataGridDetailTemplateRenderer {
-    refresh(params) {
-        return false;
-    }
-    agInit(params) {
-        this.data = params.data;
-        this.templateRef = params.templateRef;
-    }
-};
-AXDataGridDetailTemplateRenderer = __decorate([
-    Component({
-        template: `<ng-container *ngTemplateOutlet='templateRef; context: { $implicit: data }'></ng-container>`
-    })
+let AXDataGridDetailTemplateComponent = class AXDataGridDetailTemplateComponent {
+    constructor() {
+        this.height = 100;
+        this.renderer = AXDataGridDetailTemplateRenderer;
+    }
+    ngOnInit() {
+        this.params = {
+            templateRef: this.templateRef
+        };
+    }
+};
+__decorate([
+    ContentChild(TemplateRef, { static: true }),
+    __metadata("design:type", TemplateRef)
+], AXDataGridDetailTemplateComponent.prototype, "templateRef", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Number)
+], AXDataGridDetailTemplateComponent.prototype, "height", void 0);
+AXDataGridDetailTemplateComponent = __decorate([
+    Component({
+        selector: 'ax-grid-detail-template',
+        template: `<ng-content></ng-content>`
+    }),
+    __metadata("design:paramtypes", [])
+], AXDataGridDetailTemplateComponent);
+let AXDataGridDetailTemplateRenderer = class AXDataGridDetailTemplateRenderer {
+    refresh(params) {
+        return false;
+    }
+    agInit(params) {
+        this.data = params.data;
+        this.templateRef = params.templateRef;
+    }
+};
+AXDataGridDetailTemplateRenderer = __decorate([
+    Component({
+        template: `<ng-container *ngTemplateOutlet='templateRef; context: { $implicit: data }'></ng-container>`
+    })
 ], AXDataGridDetailTemplateRenderer);
 
-LicenseManager.prototype.validateLicense = function () {
-    //console.info('Cracked by Arash Oshnoudi!');
-};
-// WatermarkComp.prototype.shouldDisplayWatermark = function () {
-//   return false;
-// }
-class AXDataGridColumnsChangeEvent extends AXValueEvent {
-}
-class AXDataGridCellEvent extends AXDataEvent {
-}
-class AXDaagridRowClickEvent extends AXDataEvent {
-}
-class AXDataGridSelectionChangeEvent extends AXDataEvent {
-}
-class AXDataGridRowSelectionChangeEvent extends AXDataEvent {
-}
-let AXDataGridComponent = class AXDataGridComponent {
-    constructor(ref, cdr) {
-        this.ref = ref;
-        this.cdr = cdr;
-        this.columnDefs = [];
-        this.rowModelType = 'clientSide';
-        this.frameworkComponents = {};
-        this.internalHeight = '100%';
-        this.masterDetail = false;
-        this.treeData = false;
-        this.enabelSelect = false;
-        this.gridView = false;
-        this.groupSelectsChildren = false;
-        this.oldSelectionNodes = [];
-        // @Input()
-        // showRowNumber: boolean = true;
-        this.remoteOperation = false;
-        this.rowMultiSelectWithClick = true;
-        this.suppressRowClickSelection = true;
-        this.suppressCellSelection = false;
-        this.sizeColumnsToFit = true;
-        this.showCheckBox = true;
-        this.floatingFilter = false;
-        this.autoGroupColumnDef = {};
-        this.selectionMode = 'single';
-        // @Input()
-        // allowFiltering: boolean = false;
-        this.selectRow = [];
-        this.rowGroupPanelShow = 'never';
-        this.loadOnInit = true;
-        // @Input()
-        // groupDefaultExpanded: number = 0;
-        this.keyField = 'null';
-        this.hasChildField = 'null';
-        this.columnsChange = new EventEmitter();
-        this._columns = [];
-        this.defaultColDef = {
-            filter: true,
-            floatingFilter: true
-        };
-        this.groupHideOpenParents = false;
-        this.cellClick = new EventEmitter();
-        this.cellDbClick = new EventEmitter();
-        this.cellFocuse = new EventEmitter();
-        this.rowClick = new EventEmitter();
-        this.rowDbClick = new EventEmitter();
-        this.selectionChanged = new EventEmitter();
-        this.rowSelectionChange = new EventEmitter();
-        this.onRowSelectionChanged = new EventEmitter();
-        this.rtl = AXConfig.get('layout.rtl');
-        this.isServerSideGroup = (e) => {
-            return e[this.hasChildField];
-        };
-        this.getServerSideGroupKey = (e) => {
-            return e[this.keyField];
-        };
-        this.internalGetRowClass = (p) => {
-            if (this.rowClass) {
-                if (this.rowClass instanceof Function) {
-                    return this.rowClass({
-                        rowIndex: p.node.rowIndex,
-                        rowLevel: p.node.level,
-                        data: p.data
-                    });
-                }
-                else {
-                    return this.rowClass;
-                }
-            }
-        };
-        this.localeText = AXTranslator.get('dataGrid');
-    }
-    get searchText() {
-        return this._searchText;
-    }
-    set searchText(v) {
-        if (v !== this._searchText) {
-            this._searchText = v;
-            if (this.gridApi) {
-                this.refresh();
-                this.gridApi.setQuickFilter(this.searchText);
-            }
-        }
-    }
-    get filter() {
-        return this._filter;
-    }
-    set filter(v) {
-        if (v !== this._filter) {
-            this._filter = v;
-            this._filter.forEach((f) => {
-                const fc = this.gridApi.getFilterInstance(f.field);
-                if (fc) {
-                    const ff = fc.getFrameworkComponentInstance();
-                    ff.setModel(f);
-                }
-            });
-        }
-    }
-    get columns() {
-        return this._inlineColumns ? [...this._columns, ...this._inlineColumns.toArray()] : this._columns;
-    }
-    set columns(val) {
-        if (val && val.length) {
-            let old = this._columns;
-            this._columns = val;
-            this.columnsChange.emit({ component: this, value: val, oldValue: old, htmlElement: this.ref.nativeElement });
-        }
-    }
-    get dataSource() {
-        return this._dataSource ? this._dataSource : this._contentDataSource;
-    }
-    set dataSource(v) {
-        this._dataSource = v;
-    }
-    getRowHeight(param) {
-        if (param.data && param.data.rowHeight && param.node.level == 0) {
-            return param.data.rowHeight;
-        }
-        else if (this.masterDetail == true && param.node.level == 1) {
-            return this.detailRowHeight;
-        }
-        else if (this.masterDetail == false && param.data && param.data.rowHeight) {
-            return param.data.rowHeight;
-        }
-        else {
-            return null;
-        }
-    }
-    calcHeight() {
-        if (this.toolbar) {
-            this.internalHeight = `calc(100% - ${40}px)`;
-        }
-        else {
-            this.internalHeight = '100%';
-        }
-    }
-    get intenalGridDataSource() {
-        const that = this;
-        return {
-            rowCount: null,
-            getRows: (params) => {
-                // that.gridApi.gridOptionsWrapper.setProperty('cacheBlockSize', this.takeCount ? this.takeCount : params.api.paginationGetPageSize());
-                that.dataSourceSuccessCallback = params.successCallback;
-                const loadParams = {};
-                loadParams.searchText = that.searchText;
-                loadParams.skip = params.request.startRow;
-                //  loadParams.take = params.request.endRow - params.request.startRow;
-                loadParams.take = that.takeCount ? that.takeCount : params.api.paginationGetPageSize() * 2;
-                loadParams.sort = params.request.sortModel.map((c) => {
-                    return {
-                        field: c.colId,
-                        dir: c.sort
-                    };
-                });
-                // loadParams.groups = params.request.rowGroupCols.map(r => r.field);
-                // loadParams.groupKeys = params.request.groupKeys;
-                // loadParams.data = params.parentNode.data;
-                loadParams.group = {
-                    fields: params.request.rowGroupCols.map((r) => r.field),
-                    keys: params.request.groupKeys,
-                    parentData: params.parentNode.data
-                };
-                loadParams.filter = params.request.filterModel;
-                that.dataSource.fetch(loadParams);
-            }
-        };
-    }
-    getMainMenuItems(e) {
-        return ['pinSubMenu', 'separator'];
-    }
-    ngOnDestroy() {
-        this.gridApi.destroy();
-    }
-    // todo gridOptions: GridOptions
-    internalGridReady(gridOptions) {
-        gridOptions.api.checkGridSize();
-        this.takeCount = this.takeCount ? this.takeCount : gridOptions.api.paginationGetPageSize() * 2;
-        this.takeCount = this.takeCount < 20 ? 20 : this.takeCount;
-        gridOptions.api.gridOptionsWrapper.setProperty('cacheBlockSize', this.takeCount);
-        this.gridApi = gridOptions.api;
-        this.mapColumns();
-        this.calcHeight();
-        if (!this.loadOnInit) {
-            this.loadOnInit = true;
-            return;
-        }
-        if (this.remoteOperation) {
-            this.gridApi.setServerSideDatasource(this.intenalGridDataSource);
-        }
-        if (!this.remoteOperation) {
-            this.refresh();
-        }
-    }
-    ngAfterContentInit() {
-        const that = this;
-        if (this.rowTemplate) {
-            this.fullWidthCellRendererFramework = this.rowTemplate.renderer;
-            this.fullWidthCellRendererParams = this.rowTemplate.params;
-        }
-        this.frameworkComponents.agDateInput = AXDatePickerFilterComponent;
-        if (this.gridDetailTemplate) {
-            this.masterDetail = true;
-            this.detailCellRendererParams = this.gridDetailTemplate.params;
-            this.detailCellRenderer = 'detailRendererFramework';
-            this.frameworkComponents.detailRendererFramework = this.gridDetailTemplate.renderer;
-            this.detailRowHeight = this.gridDetailTemplate.height;
-        }
-        this.isFullWidthCell = () => {
-            return that.rowTemplate != null;
-        };
-        //this.cdr
-    }
-    ngOnInit() {
-        if (this.selectionMode === 'single') {
-            this.groupSelectsChildren = false;
-        }
-        if (this.keyField !== 'null' && this.hasChildField !== 'null') {
-            this.rowGroupPanelShow = 'never';
-            this.treeData = true;
-        }
-        if (this.remoteOperation) {
-            this.rowModelType = 'serverSide';
-        }
-        //
-        if (this.rtl == null) {
-            this.rtl = window.getComputedStyle(this.ref.nativeElement, null).getPropertyValue('direction') === 'rtl';
-        }
-        //
-    }
-    gridSelectRow() {
-        if (this.gridApi) {
-            if (this.selectRow && this.selectRow.length > 0 && this.gridApi !== undefined && typeof this.selectRow[0] != 'object') {
-                this.gridApi.forEachNode((node) => {
-                    if (node.data !== undefined) {
-                        let select = false;
-                        this.selectRow.forEach((id) => {
-                            if (node.data[this.keyField] === id) {
-                                select = true;
-                                node.setSelected(select);
-                            }
-                        });
-                    }
-                });
-            }
-            else {
-                this.gridApi.forEachNode((node) => {
-                    if (node.data !== undefined) {
-                        let select = false;
-                        this.selectRow.forEach((item) => {
-                            if (item.rowIndex != undefined && item.rowLevel != undefined) {
-                                if (node.data[this.keyField] === item.data[this.keyField]) {
-                                    select = true;
-                                }
-                            }
-                            else {
-                                if (node.data[this.keyField] === item[this.keyField]) {
-                                    select = true;
-                                }
-                            }
-                        });
-                        node.setSelected(select);
-                    }
-                });
-            }
-        }
-    }
-    // ngAfterViewChecked(): void {
-    //   //Called after every check of the component's view. Applies to components only.
-    //   //Add 'implements AfterViewChecked' to the class.
-    //   // this.selectByValues();
-    //   this.enabelSelect = false;
-    // }
-    rebuildGrid() {
-        this.mapColumns();
-        setTimeout(() => {
-            if (this.sizeColumnsToFit) {
-                this.gridApi.sizeColumnsToFit();
-            }
-        }, 10);
-    }
-    ngAfterViewInit() {
-        if (this.treeData === true) {
-            this.columnDefs = this.columns.map((c) => c.render());
-            const groupColumn = this.columnDefs.find((c) => c.rowGroupIndex == '0' && c.field !== '');
-            this.autoGroupColumnDef = {
-                headerName: groupColumn.headerName,
-                width: groupColumn.width,
-                cellRendererParams: { checkbox: this.showCheckBox },
-                field: groupColumn.field
-            };
-            this.columnDefs.forEach((elm) => {
-                if (elm.rowGroupIndex > -1) {
-                    elm.hide = true;
-                }
-            });
-        }
-        //setTimeout(() => {
-        this.gridView = true;
-        //});
-        this.enabelSelect = true;
-        this.dataSource.onDataReceived.subscribe((_data) => {
-            const result = _data.data.result;
-            this.hideLoading();
-            let items;
-            let totalCount;
-            if (Array.isArray(result)) {
-                items = result;
-                totalCount = result.length;
-            }
-            else {
-                items = result.items;
-                totalCount = result.totalCount;
-            }
-            if (this.dataSourceSuccessCallback) {
-                if (!this.loadOnInit) {
-                    this.dataSourceSuccessCallback([], 0);
-                }
-                else {
-                    this.dataSourceSuccessCallback(items, totalCount);
-                }
-            }
-            else {
-                if (!this.loadOnInit && this.gridApi !== undefined) {
-                    this.gridApi.setRowData([]);
-                }
-                else if (this.gridApi !== undefined) {
-                    this.gridApi.setRowData(items);
-                }
-            }
-            this.gridSelectRow();
-        });
-        this.dataSource.onFetchStart.subscribe(() => {
-            this.showLoading();
-        });
-        if (this.searchInput) {
-            this.searchInput.onValueChanged.subscribe((c) => {
-                this.searchText = c.value;
-            });
-        }
-        //
-        this.cdr.detectChanges();
-    }
-    mapColumns() {
-        this.columnDefs = this.columns.map((c) => c.render());
-        // if (this.showRowNumber) {
-        //   this.columnDefs.push({
-        //     headerName: AXConfig.get('layout.rtl') ? 'ردیف' : 'Row',
-        //     valueGetter: 'node.rowIndex + 1',
-        //     pinned: AXConfig.get('layout.rtl') ? 'right' : 'left'
-        //   });
-        // }
-        if (this.gridDetailTemplate) {
-            if (this.columnDefs[0].checkboxSelection === true && this.columnDefs[0].field === '') {
-                this.columnDefs[1].cellRenderer = 'agGroupCellRenderer';
-            }
-            else {
-                this.columnDefs[0].cellRenderer = 'agGroupCellRenderer';
-            }
-        }
-        if (this.hasChildField === 'null') {
-            const groupColumn = this.columnDefs.find((c) => c.rowGroupIndex === undefined && c.field !== '');
-            if (groupColumn && this.groupHideOpenParents == false) {
-                this.autoGroupColumnDef = {
-                    headerName: groupColumn.headerName,
-                    width: groupColumn.width,
-                    cellRendererParams: { checkbox: this.showCheckBox },
-                    field: groupColumn.field
-                };
-                //  groupColumn.hide = true;
-            }
-        }
-        this.columnDefs.forEach((elm) => {
-            if (elm.rowGroupIndex > -1) {
-                elm.hide = true;
-            }
-        });
-    }
-    displayedColumnsChanged(e) {
-        if (this.hasChildField === 'null') {
-            const ee = e.columnApi.getAllDisplayedColumnGroups();
-            const eee = ee.find((c) => c.colId !== 'ag-Grid-AutoColumn' && c.colId !== '0');
-            if (eee && eee.colId) {
-                this.autoGroupColumnDef = {
-                    headerName: eee.colDef.headerName,
-                    width: eee.colDef.width,
-                    cellRendererParams: { checkbox: this.showCheckBox },
-                    field: eee.colDef.field
-                };
-            }
-            // eee.hide = true;
-        }
-    }
-    refresh(route = []) {
-        if (this.remoteOperation && this.gridApi !== undefined) {
-            //  this.gridApi.purgeServerSideCache(route);
-            this.gridApi.setServerSideDatasource(this.intenalGridDataSource);
-        }
-        else {
-            // TODO : check fetch param
-            this.dataSource.fetch(null);
-        }
-    }
-    internalGridCellClicked(e) {
-        this.cellClick.emit({ data: this.mapCellEvent(e), component: this, htmlElement: this.ref.nativeElement });
-    }
-    internalGridCellDoubleClicked(e) {
-        this.cellDbClick.emit({ data: this.mapCellEvent(e), component: this, htmlElement: this.ref.nativeElement });
-    }
-    internalGridCellFocused(e) {
-        this.cellFocuse.emit({ data: this.mapCellEvent(e), htmlElement: this.ref.nativeElement, component: this });
-    }
-    internalGridRowClicked(e) {
-        if (!e.node.group) {
-            this.rowClick.emit({ data: this.mapRowEvent(e), component: this, htmlElement: this.ref.nativeElement });
-        }
-    }
-    internalGridRowDoubleClicked(e) {
-        if (!e.node.group) {
-            this.rowDbClick.emit({ data: this.mapRowEvent(e), htmlElement: this.ref.nativeElement, component: this });
-        }
-    }
-    differenceOf2Arrays(array1, array2) {
-        const temp = [];
-        for (const i in array1) {
-            if (array2.indexOf(array1[i]) === -1) {
-                temp.push(array1[i]);
-            }
-        }
-        for (const i in array2) {
-            if (array1.indexOf(array2[i]) === -1) {
-                temp.push(array2[i]);
-            }
-        }
-        return temp.sort((a, b) => a - b);
-    }
-    rowSelectionChanged(e) {
-        // debugger;
-        // this.gridApi.forEachNode((node) => {
-        //   if (node.data[this.keyField] == e.node.data[this.keyField]) {
-        //     node.setSelected(e.node.selected);
-        //   }
-        // });
-        if (e.node.selected == true) {
-            this.selectRow.push(e.data);
-        }
-        else {
-            this.selectRow = this.selectRow.filter((c) => c[this.keyField] != e.data[this.keyField]);
-        }
-        this.rowSelectionChange.emit({ component: this, data: e, htmlElement: this.ref.nativeElement });
-        // console.log('e', e);
-        // console.log('select', e.node.selected);
-        // console.log('index', e.rowIndex);
-    }
-    internalGridSelectionChanged(e) {
-        const args = { items: [] };
-        const oldNodes = this.oldSelectionNodes;
-        const nodes = this.gridApi.getSelectedNodes();
-        nodes.forEach((i) => {
-            args.items.push({
-                rowLevel: i.level,
-                rowIndex: i.rowIndex,
-                data: i.data
-            });
-        });
-        this.selectionChanged.emit({ data: args, component: this, htmlElement: this.ref.nativeElement });
-        let action = nodes.length > oldNodes.length ? true : false;
-        const node = this.differenceOf2Arrays(nodes, oldNodes);
-        this.onRowSelectionChanged.emit({ component: this, selected: action, data: node, htmlElement: this.ref.nativeElement });
-        this.oldSelectionNodes = nodes;
-    }
-    mapCellEvent(e) {
-        return {
-            rowLevel: 0,
-            column: e.column,
-            data: e.data,
-            rowIndex: e.rowIndex,
-            value: e.value
-        };
-    }
-    mapRowEvent(e) {
-        return {
-            rowLevel: 0,
-            data: e.data,
-            rowIndex: e.rowIndex
-        };
-    }
-    deselectAll() {
-        this.gridApi.deselectAll();
-    }
-    showLoading() {
-        if (this.gridApi) {
-            this.gridApi.showLoadingOverlay();
-        }
-    }
-    hideLoading() {
-        if (this.gridApi) {
-            this.gridApi.hideOverlay();
-        }
-    }
-    internalGridSizeChanged(e) {
-        if (e.clientWidth > 0 && e.clientHeight > 0) {
-            this.performSizeColumnsToFit(e.api);
-        }
-    }
-    internalGridFirstDataRendered(e) {
-        this.performSizeColumnsToFit(e.api);
-    }
-    performSizeColumnsToFit(api) {
-        if (this.sizeColumnsToFit) {
-            api.sizeColumnsToFit();
-        }
-    }
-};
-AXDataGridComponent.ctorParameters = () => [
-    { type: ElementRef },
-    { type: ChangeDetectorRef }
-];
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXDataGridComponent.prototype, "remoteOperation", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXDataGridComponent.prototype, "rowMultiSelectWithClick", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXDataGridComponent.prototype, "suppressRowClickSelection", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXDataGridComponent.prototype, "suppressCellSelection", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXDataGridComponent.prototype, "sizeColumnsToFit", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXDataGridComponent.prototype, "showCheckBox", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXDataGridComponent.prototype, "floatingFilter", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Number)
-], AXDataGridComponent.prototype, "takeCount", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXDataGridComponent.prototype, "selectionMode", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Array)
-], AXDataGridComponent.prototype, "selectRow", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXDataGridComponent.prototype, "rowGroupPanelShow", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXDataGridComponent.prototype, "loadOnInit", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXDataGridComponent.prototype, "keyField", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXDataGridComponent.prototype, "hasChildField", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String),
-    __metadata("design:paramtypes", [String])
-], AXDataGridComponent.prototype, "searchText", null);
-__decorate([
-    Input(),
-    __metadata("design:type", Array),
-    __metadata("design:paramtypes", [Array])
-], AXDataGridComponent.prototype, "filter", null);
-__decorate([
-    ContentChildren(AXGridDataColumn),
-    __metadata("design:type", QueryList)
-], AXDataGridComponent.prototype, "_inlineColumns", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXDataGridComponent.prototype, "columnsChange", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Array),
-    __metadata("design:paramtypes", [Array])
-], AXDataGridComponent.prototype, "columns", null);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], AXDataGridComponent.prototype, "rowHeight", void 0);
-__decorate([
-    ContentChild(AXToolbarSearchComponent, { static: true }),
-    __metadata("design:type", AXToolbarSearchComponent)
-], AXDataGridComponent.prototype, "searchInput", void 0);
-__decorate([
-    ContentChild(AXToolbarComponent, { static: true }),
-    __metadata("design:type", AXToolbarComponent)
-], AXDataGridComponent.prototype, "toolbar", void 0);
-__decorate([
-    ContentChild(AXDataGridRowTemplateComponent, { static: true }),
-    __metadata("design:type", AXDataGridRowTemplateComponent)
-], AXDataGridComponent.prototype, "rowTemplate", void 0);
-__decorate([
-    ContentChild(AXDataGridDetailTemplateComponent, { static: true }),
-    __metadata("design:type", AXDataGridDetailTemplateComponent)
-], AXDataGridComponent.prototype, "gridDetailTemplate", void 0);
-__decorate([
-    ContentChild(AXDataSourceComponent, { static: true }),
-    __metadata("design:type", AXDataSourceComponent)
-], AXDataGridComponent.prototype, "_contentDataSource", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", AXDataSourceComponent),
-    __metadata("design:paramtypes", [AXDataSourceComponent])
-], AXDataGridComponent.prototype, "dataSource", null);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXDataGridComponent.prototype, "groupHideOpenParents", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXDataGridComponent.prototype, "cellClick", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXDataGridComponent.prototype, "cellDbClick", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXDataGridComponent.prototype, "cellFocuse", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXDataGridComponent.prototype, "rowClick", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXDataGridComponent.prototype, "rowDbClick", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXDataGridComponent.prototype, "selectionChanged", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXDataGridComponent.prototype, "rowSelectionChange", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXDataGridComponent.prototype, "onRowSelectionChanged", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Function)
-], AXDataGridComponent.prototype, "rowClass", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXDataGridComponent.prototype, "rtl", void 0);
-AXDataGridComponent = __decorate([
-    Component({
-        selector: 'ax-data-grid',
-        template: "<div class=\"ax-grid-toolbar\" *ngIf=\"toolbar\">\r\n  <ng-content select=\"ax-toolbar\"></ng-content>\r\n</div>\r\n<!-- [enableSorting]=\"true\"  [enableColResize]=\"true\" [enableFilter]=\"allowFiltering\"  -->\r\n<ag-grid-angular *ngIf=\"gridView\" class=\"ag-theme-balham\" [getRowClass]=\"internalGetRowClass\"\r\n  [style.height]=\"internalHeight\" [columnDefs]=\"columnDefs\" [enableRtl]=\"rtl\" [pagination]=\"true\"\r\n  [rowGroupPanelShow]=\"rowGroupPanelShow\" [rowModelType]=\"rowModelType\" [detailRowHeight]=\"detailRowHeight\"\r\n  [getRowHeight]=\"getRowHeight\" [paginationAutoPageSize]=\"true\" [suppressMenuHide]=\"true\"\r\n  [frameworkComponents]=\"frameworkComponents\" [isFullWidthCell]=\"isFullWidthCell\" [rowSelection]=\"selectionMode\"\r\n  [rowMultiSelectWithClick]=\"rowMultiSelectWithClick\" [fullWidthCellRendererFramework]=\"fullWidthCellRendererFramework\"\r\n  [fullWidthCellRendererParams]=\"fullWidthCellRendererParams\" (cellClicked)=\"internalGridCellClicked($event)\"\r\n  (cellDoubleClicked)=\"internalGridCellDoubleClicked($event)\" (cellFocused)=\"internalGridCellFocused($event)\"\r\n  (rowClicked)=\"internalGridRowClicked($event)\" (selectionChanged)=\"internalGridSelectionChanged($event)\"\r\n  (rowSelected)=\"rowSelectionChanged($event)\" (rowDoubleClicked)=\"internalGridRowDoubleClicked($event)\"\r\n  (gridReady)=\"internalGridReady($event)\" [groupSelectsChildren]=\"groupSelectsChildren\"\r\n  [suppressRowClickSelection]=\"suppressRowClickSelection\" [groupSelectsFiltered]=\"true\"\r\n  [suppressCellSelection]=\"suppressCellSelection\" [autoGroupColumnDef]=\"autoGroupColumnDef\"\r\n  [suppressAggFuncInHeader]=\"true\" [treeData]=\"treeData\" [animateRows]=\"true\" [isServerSideGroup]=\"isServerSideGroup\"\r\n  [getServerSideGroupKey]=\"getServerSideGroupKey\" [masterDetail]=\"masterDetail\"\r\n  [detailCellRendererParams]=\"detailCellRendererParams\" [detailCellRenderer]=\"detailCellRenderer\"\r\n  (gridSizeChanged)=\"internalGridSizeChanged($event)\" (firstDataRendered)=\"internalGridFirstDataRendered($event)\"\r\n  [localeText]=\"localeText\" [groupHideOpenParents]=\"groupHideOpenParents\" [enableRangeSelection]=\"true\"\r\n  [enableRangeSelection]=\"false\" [allowContextMenuWithControlKey]=\"false\" [getMainMenuItems]=\"getMainMenuItems\">\r\n</ag-grid-angular>\r\n\r\n<!-- (displayedColumnsChanged)=\"displayedColumnsChanged($event)\"  -->",
-        encapsulation: ViewEncapsulation.None
-        // changeDetection: ChangeDetectionStrategy.OnPush
-    }),
-    __metadata("design:paramtypes", [ElementRef, ChangeDetectorRef])
+LicenseManager.prototype.validateLicense = function () {
+    //console.info('Cracked by Arash Oshnoudi!');
+};
+// WatermarkComp.prototype.shouldDisplayWatermark = function () {
+//   return false;
+// }
+class AXDataGridColumnsChangeEvent extends AXValueEvent {
+}
+class AXDataGridCellEvent extends AXDataEvent {
+}
+class AXDaagridRowClickEvent extends AXDataEvent {
+}
+class AXDataGridSelectionChangeEvent extends AXDataEvent {
+}
+class AXDataGridRowSelectionChangeEvent extends AXDataEvent {
+}
+let AXDataGridComponent = class AXDataGridComponent {
+    constructor(ref, cdr) {
+        this.ref = ref;
+        this.cdr = cdr;
+        this.columnDefs = [];
+        this.rowModelType = 'clientSide';
+        this.frameworkComponents = {};
+        this.internalHeight = '100%';
+        this.masterDetail = false;
+        this.treeData = false;
+        this.enabelSelect = false;
+        this.gridView = false;
+        this.groupSelectsChildren = false;
+        this.oldSelectionNodes = [];
+        // @Input()
+        // showRowNumber: boolean = true;
+        this.remoteOperation = false;
+        this.rowMultiSelectWithClick = true;
+        this.suppressRowClickSelection = true;
+        this.suppressCellSelection = false;
+        this.sizeColumnsToFit = true;
+        this.showCheckBox = true;
+        this.floatingFilter = false;
+        this.autoGroupColumnDef = {};
+        this.selectionMode = 'single';
+        // @Input()
+        // allowFiltering: boolean = false;
+        this.selectRow = [];
+        this.rowGroupPanelShow = 'never';
+        this.loadOnInit = true;
+        // @Input()
+        // groupDefaultExpanded: number = 0;
+        this.keyField = 'null';
+        this.hasChildField = 'null';
+        this.columnsChange = new EventEmitter();
+        this._columns = [];
+        this.defaultColDef = {
+            filter: true,
+            floatingFilter: true
+        };
+        this.groupHideOpenParents = false;
+        this.cellClick = new EventEmitter();
+        this.cellDbClick = new EventEmitter();
+        this.cellFocuse = new EventEmitter();
+        this.rowClick = new EventEmitter();
+        this.rowDbClick = new EventEmitter();
+        this.selectionChanged = new EventEmitter();
+        this.rowSelectionChange = new EventEmitter();
+        this.onRowSelectionChanged = new EventEmitter();
+        this.rtl = AXConfig.get('layout.rtl');
+        this.isServerSideGroup = (e) => {
+            return e[this.hasChildField];
+        };
+        this.getServerSideGroupKey = (e) => {
+            return e[this.keyField];
+        };
+        this.internalGetRowClass = (p) => {
+            if (this.rowClass) {
+                if (this.rowClass instanceof Function) {
+                    return this.rowClass({
+                        rowIndex: p.node.rowIndex,
+                        rowLevel: p.node.level,
+                        data: p.data
+                    });
+                }
+                else {
+                    return this.rowClass;
+                }
+            }
+        };
+        this.localeText = AXTranslator.get('dataGrid');
+    }
+    get searchText() {
+        return this._searchText;
+    }
+    set searchText(v) {
+        if (v !== this._searchText) {
+            this._searchText = v;
+            if (this.gridApi) {
+                this.refresh();
+                this.gridApi.setQuickFilter(this.searchText);
+            }
+        }
+    }
+    get filter() {
+        return this._filter;
+    }
+    set filter(v) {
+        if (v !== this._filter) {
+            this._filter = v;
+            this._filter.forEach((f) => {
+                const fc = this.gridApi.getFilterInstance(f.field);
+                if (fc) {
+                    const ff = fc.getFrameworkComponentInstance();
+                    ff.setModel(f);
+                }
+            });
+        }
+    }
+    get columns() {
+        return this._inlineColumns ? [...this._columns, ...this._inlineColumns.toArray()] : this._columns;
+    }
+    set columns(val) {
+        if (val && val.length) {
+            let old = this._columns;
+            this._columns = val;
+            this.columnsChange.emit({ component: this, value: val, oldValue: old, htmlElement: this.ref.nativeElement });
+        }
+    }
+    get dataSource() {
+        return this._dataSource ? this._dataSource : this._contentDataSource;
+    }
+    set dataSource(v) {
+        this._dataSource = v;
+    }
+    getRowHeight(param) {
+        if (param.data && param.data.rowHeight && param.node.level == 0) {
+            return param.data.rowHeight;
+        }
+        else if (this.masterDetail == true && param.node.level == 1) {
+            return this.detailRowHeight;
+        }
+        else if (this.masterDetail == false && param.data && param.data.rowHeight) {
+            return param.data.rowHeight;
+        }
+        else {
+            return null;
+        }
+    }
+    calcHeight() {
+        if (this.toolbar) {
+            this.internalHeight = `calc(100% - ${40}px)`;
+        }
+        else {
+            this.internalHeight = '100%';
+        }
+    }
+    get intenalGridDataSource() {
+        const that = this;
+        return {
+            rowCount: null,
+            getRows: (params) => {
+                // that.gridApi.gridOptionsWrapper.setProperty('cacheBlockSize', this.takeCount ? this.takeCount : params.api.paginationGetPageSize());
+                that.dataSourceSuccessCallback = params.successCallback;
+                const loadParams = {};
+                loadParams.searchText = that.searchText;
+                loadParams.skip = params.request.startRow;
+                //  loadParams.take = params.request.endRow - params.request.startRow;
+                loadParams.take = that.takeCount ? that.takeCount : params.api.paginationGetPageSize() * 2;
+                loadParams.sort = params.request.sortModel.map((c) => {
+                    return {
+                        field: c.colId,
+                        dir: c.sort
+                    };
+                });
+                // loadParams.groups = params.request.rowGroupCols.map(r => r.field);
+                // loadParams.groupKeys = params.request.groupKeys;
+                // loadParams.data = params.parentNode.data;
+                loadParams.group = {
+                    fields: params.request.rowGroupCols.map((r) => r.field),
+                    keys: params.request.groupKeys,
+                    parentData: params.parentNode.data
+                };
+                loadParams.filter = params.request.filterModel;
+                that.dataSource.fetch(loadParams);
+            }
+        };
+    }
+    getMainMenuItems(e) {
+        return ['pinSubMenu', 'separator'];
+    }
+    ngOnDestroy() {
+        this.gridApi.destroy();
+    }
+    // todo gridOptions: GridOptions
+    internalGridReady(gridOptions) {
+        gridOptions.api.checkGridSize();
+        this.takeCount = this.takeCount ? this.takeCount : gridOptions.api.paginationGetPageSize() * 2;
+        this.takeCount = this.takeCount < 20 ? 20 : this.takeCount;
+        gridOptions.api.gridOptionsWrapper.setProperty('cacheBlockSize', this.takeCount);
+        this.gridApi = gridOptions.api;
+        this.mapColumns();
+        this.calcHeight();
+        if (!this.loadOnInit) {
+            this.loadOnInit = true;
+            return;
+        }
+        if (this.remoteOperation) {
+            this.gridApi.setServerSideDatasource(this.intenalGridDataSource);
+        }
+        if (!this.remoteOperation) {
+            this.refresh();
+        }
+    }
+    ngAfterContentInit() {
+        const that = this;
+        if (this.rowTemplate) {
+            this.fullWidthCellRendererFramework = this.rowTemplate.renderer;
+            this.fullWidthCellRendererParams = this.rowTemplate.params;
+        }
+        this.frameworkComponents.agDateInput = AXDatePickerFilterComponent;
+        if (this.gridDetailTemplate) {
+            this.masterDetail = true;
+            this.detailCellRendererParams = this.gridDetailTemplate.params;
+            this.detailCellRenderer = 'detailRendererFramework';
+            this.frameworkComponents.detailRendererFramework = this.gridDetailTemplate.renderer;
+            this.detailRowHeight = this.gridDetailTemplate.height;
+        }
+        this.isFullWidthCell = () => {
+            return that.rowTemplate != null;
+        };
+        //this.cdr
+    }
+    ngOnInit() {
+        if (this.selectionMode === 'single') {
+            this.groupSelectsChildren = false;
+        }
+        if (this.keyField !== 'null' && this.hasChildField !== 'null') {
+            this.rowGroupPanelShow = 'never';
+            this.treeData = true;
+        }
+        if (this.remoteOperation) {
+            this.rowModelType = 'serverSide';
+        }
+        //
+        if (this.rtl == null) {
+            this.rtl = window.getComputedStyle(this.ref.nativeElement, null).getPropertyValue('direction') === 'rtl';
+        }
+        //
+    }
+    gridSelectRow() {
+        if (this.gridApi) {
+            if (this.selectRow && this.selectRow.length > 0 && this.gridApi !== undefined && typeof this.selectRow[0] != 'object') {
+                this.gridApi.forEachNode((node) => {
+                    if (node.data !== undefined) {
+                        let select = false;
+                        this.selectRow.forEach((id) => {
+                            if (node.data[this.keyField] === id) {
+                                select = true;
+                                node.setSelected(select);
+                            }
+                        });
+                    }
+                });
+            }
+            else {
+                this.gridApi.forEachNode((node) => {
+                    if (node.data !== undefined) {
+                        let select = false;
+                        this.selectRow.forEach((item) => {
+                            if (item.rowIndex != undefined && item.rowLevel != undefined) {
+                                if (node.data[this.keyField] === item.data[this.keyField]) {
+                                    select = true;
+                                }
+                            }
+                            else {
+                                if (node.data[this.keyField] === item[this.keyField]) {
+                                    select = true;
+                                }
+                            }
+                        });
+                        node.setSelected(select);
+                    }
+                });
+            }
+        }
+    }
+    // ngAfterViewChecked(): void {
+    //   //Called after every check of the component's view. Applies to components only.
+    //   //Add 'implements AfterViewChecked' to the class.
+    //   // this.selectByValues();
+    //   this.enabelSelect = false;
+    // }
+    rebuildGrid() {
+        this.mapColumns();
+        setTimeout(() => {
+            if (this.sizeColumnsToFit) {
+                this.gridApi.sizeColumnsToFit();
+            }
+        }, 10);
+    }
+    ngAfterViewInit() {
+        if (this.treeData === true) {
+            this.columnDefs = this.columns.map((c) => c.render());
+            const groupColumn = this.columnDefs.find((c) => c.rowGroupIndex == '0' && c.field !== '');
+            this.autoGroupColumnDef = {
+                headerName: groupColumn.headerName,
+                width: groupColumn.width,
+                cellRendererParams: { checkbox: this.showCheckBox },
+                field: groupColumn.field
+            };
+            this.columnDefs.forEach((elm) => {
+                if (elm.rowGroupIndex > -1) {
+                    elm.hide = true;
+                }
+            });
+        }
+        //setTimeout(() => {
+        this.gridView = true;
+        //});
+        this.enabelSelect = true;
+        this.dataSource.onDataReceived.subscribe((_data) => {
+            const result = _data.data.result;
+            this.hideLoading();
+            let items;
+            let totalCount;
+            if (Array.isArray(result)) {
+                items = result;
+                totalCount = result.length;
+            }
+            else {
+                items = result.items;
+                totalCount = result.totalCount;
+            }
+            if (this.dataSourceSuccessCallback) {
+                if (!this.loadOnInit) {
+                    this.dataSourceSuccessCallback([], 0);
+                }
+                else {
+                    this.dataSourceSuccessCallback(items, totalCount);
+                }
+            }
+            else {
+                if (!this.loadOnInit && this.gridApi !== undefined) {
+                    this.gridApi.setRowData([]);
+                }
+                else if (this.gridApi !== undefined) {
+                    this.gridApi.setRowData(items);
+                }
+            }
+            this.gridSelectRow();
+        });
+        this.dataSource.onFetchStart.subscribe(() => {
+            this.showLoading();
+        });
+        if (this.searchInput) {
+            this.searchInput.onValueChanged.subscribe((c) => {
+                this.searchText = c.value;
+            });
+        }
+        //
+        this.cdr.detectChanges();
+    }
+    mapColumns() {
+        this.columnDefs = this.columns.map((c) => c.render());
+        // if (this.showRowNumber) {
+        //   this.columnDefs.push({
+        //     headerName: AXConfig.get('layout.rtl') ? 'ردیف' : 'Row',
+        //     valueGetter: 'node.rowIndex + 1',
+        //     pinned: AXConfig.get('layout.rtl') ? 'right' : 'left'
+        //   });
+        // }
+        if (this.gridDetailTemplate) {
+            if (this.columnDefs[0].checkboxSelection === true && this.columnDefs[0].field === '') {
+                this.columnDefs[1].cellRenderer = 'agGroupCellRenderer';
+            }
+            else {
+                this.columnDefs[0].cellRenderer = 'agGroupCellRenderer';
+            }
+        }
+        if (this.hasChildField === 'null') {
+            const groupColumn = this.columnDefs.find((c) => c.rowGroupIndex === undefined && c.field !== '');
+            if (groupColumn && this.groupHideOpenParents == false) {
+                this.autoGroupColumnDef = {
+                    headerName: groupColumn.headerName,
+                    width: groupColumn.width,
+                    cellRendererParams: { checkbox: this.showCheckBox },
+                    field: groupColumn.field
+                };
+                //  groupColumn.hide = true;
+            }
+        }
+        this.columnDefs.forEach((elm) => {
+            if (elm.rowGroupIndex > -1) {
+                elm.hide = true;
+            }
+        });
+    }
+    displayedColumnsChanged(e) {
+        if (this.hasChildField === 'null') {
+            const ee = e.columnApi.getAllDisplayedColumnGroups();
+            const eee = ee.find((c) => c.colId !== 'ag-Grid-AutoColumn' && c.colId !== '0');
+            if (eee && eee.colId) {
+                this.autoGroupColumnDef = {
+                    headerName: eee.colDef.headerName,
+                    width: eee.colDef.width,
+                    cellRendererParams: { checkbox: this.showCheckBox },
+                    field: eee.colDef.field
+                };
+            }
+            // eee.hide = true;
+        }
+    }
+    refresh(route = []) {
+        if (this.remoteOperation && this.gridApi !== undefined) {
+            //  this.gridApi.purgeServerSideCache(route);
+            this.gridApi.setServerSideDatasource(this.intenalGridDataSource);
+        }
+        else {
+            // TODO : check fetch param
+            this.dataSource.fetch(null);
+        }
+    }
+    internalGridCellClicked(e) {
+        this.cellClick.emit({ data: this.mapCellEvent(e), component: this, htmlElement: this.ref.nativeElement });
+    }
+    internalGridCellDoubleClicked(e) {
+        this.cellDbClick.emit({ data: this.mapCellEvent(e), component: this, htmlElement: this.ref.nativeElement });
+    }
+    internalGridCellFocused(e) {
+        this.cellFocuse.emit({ data: this.mapCellEvent(e), htmlElement: this.ref.nativeElement, component: this });
+    }
+    internalGridRowClicked(e) {
+        if (!e.node.group) {
+            this.rowClick.emit({ data: this.mapRowEvent(e), component: this, htmlElement: this.ref.nativeElement });
+        }
+    }
+    internalGridRowDoubleClicked(e) {
+        if (!e.node.group) {
+            this.rowDbClick.emit({ data: this.mapRowEvent(e), htmlElement: this.ref.nativeElement, component: this });
+        }
+    }
+    differenceOf2Arrays(array1, array2) {
+        const temp = [];
+        for (const i in array1) {
+            if (array2.indexOf(array1[i]) === -1) {
+                temp.push(array1[i]);
+            }
+        }
+        for (const i in array2) {
+            if (array1.indexOf(array2[i]) === -1) {
+                temp.push(array2[i]);
+            }
+        }
+        return temp.sort((a, b) => a - b);
+    }
+    rowSelectionChanged(e) {
+        // debugger;
+        // this.gridApi.forEachNode((node) => {
+        //   if (node.data[this.keyField] == e.node.data[this.keyField]) {
+        //     node.setSelected(e.node.selected);
+        //   }
+        // });
+        if (e.node.selected == true) {
+            this.selectRow.push(e.data);
+        }
+        else {
+            this.selectRow = this.selectRow.filter((c) => c[this.keyField] != e.data[this.keyField]);
+        }
+        this.rowSelectionChange.emit({ component: this, data: e, htmlElement: this.ref.nativeElement });
+        // console.log('e', e);
+        // console.log('select', e.node.selected);
+        // console.log('index', e.rowIndex);
+    }
+    internalGridSelectionChanged(e) {
+        const args = { items: [] };
+        const oldNodes = this.oldSelectionNodes;
+        const nodes = this.gridApi.getSelectedNodes();
+        nodes.forEach((i) => {
+            args.items.push({
+                rowLevel: i.level,
+                rowIndex: i.rowIndex,
+                data: i.data
+            });
+        });
+        this.selectionChanged.emit({ data: args, component: this, htmlElement: this.ref.nativeElement });
+        let action = nodes.length > oldNodes.length ? true : false;
+        const node = this.differenceOf2Arrays(nodes, oldNodes);
+        this.onRowSelectionChanged.emit({ component: this, selected: action, data: node, htmlElement: this.ref.nativeElement });
+        this.oldSelectionNodes = nodes;
+    }
+    mapCellEvent(e) {
+        return {
+            rowLevel: 0,
+            column: e.column,
+            data: e.data,
+            rowIndex: e.rowIndex,
+            value: e.value
+        };
+    }
+    mapRowEvent(e) {
+        return {
+            rowLevel: 0,
+            data: e.data,
+            rowIndex: e.rowIndex
+        };
+    }
+    deselectAll() {
+        this.gridApi.deselectAll();
+    }
+    showLoading() {
+        if (this.gridApi) {
+            this.gridApi.showLoadingOverlay();
+        }
+    }
+    hideLoading() {
+        if (this.gridApi) {
+            this.gridApi.hideOverlay();
+        }
+    }
+    internalGridSizeChanged(e) {
+        if (e.clientWidth > 0 && e.clientHeight > 0) {
+            this.performSizeColumnsToFit(e.api);
+        }
+    }
+    internalGridFirstDataRendered(e) {
+        this.performSizeColumnsToFit(e.api);
+    }
+    performSizeColumnsToFit(api) {
+        if (this.sizeColumnsToFit) {
+            api.sizeColumnsToFit();
+        }
+    }
+};
+AXDataGridComponent.ctorParameters = () => [
+    { type: ElementRef },
+    { type: ChangeDetectorRef }
+];
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXDataGridComponent.prototype, "remoteOperation", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXDataGridComponent.prototype, "rowMultiSelectWithClick", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXDataGridComponent.prototype, "suppressRowClickSelection", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXDataGridComponent.prototype, "suppressCellSelection", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXDataGridComponent.prototype, "sizeColumnsToFit", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXDataGridComponent.prototype, "showCheckBox", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXDataGridComponent.prototype, "floatingFilter", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Number)
+], AXDataGridComponent.prototype, "takeCount", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXDataGridComponent.prototype, "selectionMode", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Array)
+], AXDataGridComponent.prototype, "selectRow", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXDataGridComponent.prototype, "rowGroupPanelShow", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXDataGridComponent.prototype, "loadOnInit", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXDataGridComponent.prototype, "keyField", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXDataGridComponent.prototype, "hasChildField", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String),
+    __metadata("design:paramtypes", [String])
+], AXDataGridComponent.prototype, "searchText", null);
+__decorate([
+    Input(),
+    __metadata("design:type", Array),
+    __metadata("design:paramtypes", [Array])
+], AXDataGridComponent.prototype, "filter", null);
+__decorate([
+    ContentChildren(AXGridDataColumn),
+    __metadata("design:type", QueryList)
+], AXDataGridComponent.prototype, "_inlineColumns", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXDataGridComponent.prototype, "columnsChange", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Array),
+    __metadata("design:paramtypes", [Array])
+], AXDataGridComponent.prototype, "columns", null);
+__decorate([
+    Input(),
+    __metadata("design:type", Object)
+], AXDataGridComponent.prototype, "rowHeight", void 0);
+__decorate([
+    ContentChild(AXToolbarSearchComponent, { static: true }),
+    __metadata("design:type", AXToolbarSearchComponent)
+], AXDataGridComponent.prototype, "searchInput", void 0);
+__decorate([
+    ContentChild(AXToolbarComponent, { static: true }),
+    __metadata("design:type", AXToolbarComponent)
+], AXDataGridComponent.prototype, "toolbar", void 0);
+__decorate([
+    ContentChild(AXDataGridRowTemplateComponent, { static: true }),
+    __metadata("design:type", AXDataGridRowTemplateComponent)
+], AXDataGridComponent.prototype, "rowTemplate", void 0);
+__decorate([
+    ContentChild(AXDataGridDetailTemplateComponent, { static: true }),
+    __metadata("design:type", AXDataGridDetailTemplateComponent)
+], AXDataGridComponent.prototype, "gridDetailTemplate", void 0);
+__decorate([
+    ContentChild(AXDataSourceComponent, { static: true }),
+    __metadata("design:type", AXDataSourceComponent)
+], AXDataGridComponent.prototype, "_contentDataSource", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", AXDataSourceComponent),
+    __metadata("design:paramtypes", [AXDataSourceComponent])
+], AXDataGridComponent.prototype, "dataSource", null);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXDataGridComponent.prototype, "groupHideOpenParents", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXDataGridComponent.prototype, "cellClick", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXDataGridComponent.prototype, "cellDbClick", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXDataGridComponent.prototype, "cellFocuse", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXDataGridComponent.prototype, "rowClick", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXDataGridComponent.prototype, "rowDbClick", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXDataGridComponent.prototype, "selectionChanged", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXDataGridComponent.prototype, "rowSelectionChange", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXDataGridComponent.prototype, "onRowSelectionChanged", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Function)
+], AXDataGridComponent.prototype, "rowClass", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXDataGridComponent.prototype, "rtl", void 0);
+AXDataGridComponent = __decorate([
+    Component({
+        selector: 'ax-data-grid',
+        template: "<div class=\"ax-grid-toolbar\" *ngIf=\"toolbar\">\n  <ng-content select=\"ax-toolbar\"></ng-content>\n</div>\n<!-- [enableSorting]=\"true\"  [enableColResize]=\"true\" [enableFilter]=\"allowFiltering\"  -->\n<ag-grid-angular *ngIf=\"gridView\" class=\"ag-theme-balham\" [getRowClass]=\"internalGetRowClass\"\n  [style.height]=\"internalHeight\" [columnDefs]=\"columnDefs\" [enableRtl]=\"rtl\" [pagination]=\"true\"\n  [rowGroupPanelShow]=\"rowGroupPanelShow\" [rowModelType]=\"rowModelType\" [detailRowHeight]=\"detailRowHeight\"\n  [getRowHeight]=\"getRowHeight\" [paginationAutoPageSize]=\"true\" [suppressMenuHide]=\"true\"\n  [frameworkComponents]=\"frameworkComponents\" [isFullWidthCell]=\"isFullWidthCell\" [rowSelection]=\"selectionMode\"\n  [rowMultiSelectWithClick]=\"rowMultiSelectWithClick\" [fullWidthCellRendererFramework]=\"fullWidthCellRendererFramework\"\n  [fullWidthCellRendererParams]=\"fullWidthCellRendererParams\" (cellClicked)=\"internalGridCellClicked($event)\"\n  (cellDoubleClicked)=\"internalGridCellDoubleClicked($event)\" (cellFocused)=\"internalGridCellFocused($event)\"\n  (rowClicked)=\"internalGridRowClicked($event)\" (selectionChanged)=\"internalGridSelectionChanged($event)\"\n  (rowSelected)=\"rowSelectionChanged($event)\" (rowDoubleClicked)=\"internalGridRowDoubleClicked($event)\"\n  (gridReady)=\"internalGridReady($event)\" [groupSelectsChildren]=\"groupSelectsChildren\"\n  [suppressRowClickSelection]=\"suppressRowClickSelection\" [groupSelectsFiltered]=\"true\"\n  [suppressCellSelection]=\"suppressCellSelection\" [autoGroupColumnDef]=\"autoGroupColumnDef\"\n  [suppressAggFuncInHeader]=\"true\" [treeData]=\"treeData\" [animateRows]=\"true\" [isServerSideGroup]=\"isServerSideGroup\"\n  [getServerSideGroupKey]=\"getServerSideGroupKey\" [masterDetail]=\"masterDetail\"\n  [detailCellRendererParams]=\"detailCellRendererParams\" [detailCellRenderer]=\"detailCellRenderer\"\n  (gridSizeChanged)=\"internalGridSizeChanged($event)\" (firstDataRendered)=\"internalGridFirstDataRendered($event)\"\n  [localeText]=\"localeText\" [groupHideOpenParents]=\"groupHideOpenParents\" [enableRangeSelection]=\"true\"\n  [enableRangeSelection]=\"false\" [allowContextMenuWithControlKey]=\"false\" [getMainMenuItems]=\"getMainMenuItems\">\n</ag-grid-angular>\n\n<!-- (displayedColumnsChanged)=\"displayedColumnsChanged($event)\"  -->",
+        encapsulation: ViewEncapsulation.None
+        // changeDetection: ChangeDetectionStrategy.OnPush
+    }),
+    __metadata("design:paramtypes", [ElementRef, ChangeDetectorRef])
 ], AXDataGridComponent);
 
-let AXDataGridFilterComponent = class AXDataGridFilterComponent {
-};
-AXDataGridFilterComponent = __decorate([
-    Component({
-        selector: 'ax-data-grid-filter',
-        template: `
-    <div class='ax-grid-filter-container'>
-      <ng-content></ng-content>
-      <div class='btn-group' role='group'>
-        <button type='button' class='btn btn-primary btn-sm'>
-          <i class='fas fa-filter'></i>
-        </button>
-        <button type='button' class='btn btn-danger btn-sm'>
-          <i class='fas fa-trash-alt'></i>
-        </button>
-      </div>
-    </div>
-  `,
-        encapsulation: ViewEncapsulation.None
-    })
+let AXDataGridFilterComponent = class AXDataGridFilterComponent {
+};
+AXDataGridFilterComponent = __decorate([
+    Component({
+        selector: 'ax-data-grid-filter',
+        template: `
+    <div class='ax-grid-filter-container'>
+      <ng-content></ng-content>
+      <div class='btn-group' role='group'>
+        <button type='button' class='btn btn-primary btn-sm'>
+          <i class='fas fa-filter'></i>
+        </button>
+        <button type='button' class='btn btn-danger btn-sm'>
+          <i class='fas fa-trash-alt'></i>
+        </button>
+      </div>
+    </div>
+  `,
+        encapsulation: ViewEncapsulation.None
+    })
 ], AXDataGridFilterComponent);
 
-let AXDataGridModule = class AXDataGridModule {
-};
-AXDataGridModule = __decorate([
-    NgModule({
-        declarations: [
-            AXDataGridComponent,
-            AXGridTextColumn,
-            AXGridCheckColumn,
-            AXGridSelectionColumn,
-            AXGridDateColumn,
-            AXGridRowNumberColumn,
-            AXGridCommandColumn,
-            BooleanRenderer,
-            BooleanFilterRenderer,
-            TextFilterRenderer,
-            AXDataGridFilterComponent,
-            AXDataGridRowTemplateComponent,
-            AXDataGridDetailTemplateComponent,
-            AXDataGridRowTemplateRenderer,
-            AXDataGridDetailTemplateRenderer,
-            AXDataGridCellTemplateComponent,
-            AXDataGridCellTemplateRenderer,
-            AXDatePickerFilterComponent,
-            CommandRenderer
-        ],
-        imports: [
-            CommonModule,
-            AXCoreModule,
-            FormsModule,
-            //AgGridModule,
-            AXTextBoxModule,
-            AXCheckBoxModule,
-            AXSelectBoxModule,
-            AXDataSourceModule,
-            AXButtonModule,
-            AXDatePickerModule,
-            AgGridModule.withComponents([AXDatePickerFilterComponent])
-        ],
-        exports: [
-            AXDataGridComponent,
-            AXDataGridFilterComponent,
-            AXDataGridRowTemplateComponent,
-            AXDataGridDetailTemplateComponent,
-            AXDataGridRowTemplateRenderer,
-            AXDataGridDetailTemplateRenderer,
-            AXDataGridCellTemplateComponent,
-            AXDataGridCellTemplateRenderer,
-            AXGridTextColumn,
-            AXGridRowNumberColumn,
-            AXGridCheckColumn,
-            AXGridDateColumn,
-            AXGridSelectionColumn,
-            AXGridCommandColumn,
-            BooleanRenderer,
-            BooleanFilterRenderer,
-            CommandRenderer
-        ],
-        entryComponents: [
-            BooleanRenderer,
-            BooleanFilterRenderer,
-            CommandRenderer,
-            TextFilterRenderer,
-            AXDataGridRowTemplateComponent,
-            AXDataGridDetailTemplateComponent,
-            AXDataGridRowTemplateRenderer,
-            AXDataGridDetailTemplateRenderer,
-            AXDataGridCellTemplateComponent,
-            AXDataGridCellTemplateRenderer
-        ],
-        providers: []
-    })
+let AXDataGridModule = class AXDataGridModule {
+};
+AXDataGridModule = __decorate([
+    NgModule({
+        declarations: [
+            AXDataGridComponent,
+            AXGridTextColumn,
+            AXGridCheckColumn,
+            AXGridSelectionColumn,
+            AXGridDateColumn,
+            AXGridRowNumberColumn,
+            AXGridCommandColumn,
+            BooleanRenderer,
+            BooleanFilterRenderer,
+            TextFilterRenderer,
+            AXDataGridFilterComponent,
+            AXDataGridRowTemplateComponent,
+            AXDataGridDetailTemplateComponent,
+            AXDataGridRowTemplateRenderer,
+            AXDataGridDetailTemplateRenderer,
+            AXDataGridCellTemplateComponent,
+            AXDataGridCellTemplateRenderer,
+            AXDatePickerFilterComponent,
+            CommandRenderer
+        ],
+        imports: [
+            CommonModule,
+            AXCoreModule,
+            FormsModule,
+            //AgGridModule,
+            AXTextBoxModule,
+            AXCheckBoxModule,
+            AXSelectBoxModule,
+            AXDataSourceModule,
+            AXButtonModule,
+            AXDatePickerModule,
+            AgGridModule.withComponents([AXDatePickerFilterComponent])
+        ],
+        exports: [
+            AXDataGridComponent,
+            AXDataGridFilterComponent,
+            AXDataGridRowTemplateComponent,
+            AXDataGridDetailTemplateComponent,
+            AXDataGridRowTemplateRenderer,
+            AXDataGridDetailTemplateRenderer,
+            AXDataGridCellTemplateComponent,
+            AXDataGridCellTemplateRenderer,
+            AXGridTextColumn,
+            AXGridRowNumberColumn,
+            AXGridCheckColumn,
+            AXGridDateColumn,
+            AXGridSelectionColumn,
+            AXGridCommandColumn,
+            BooleanRenderer,
+            BooleanFilterRenderer,
+            CommandRenderer
+        ],
+        entryComponents: [
+            BooleanRenderer,
+            BooleanFilterRenderer,
+            CommandRenderer,
+            TextFilterRenderer,
+            AXDataGridRowTemplateComponent,
+            AXDataGridDetailTemplateComponent,
+            AXDataGridRowTemplateRenderer,
+            AXDataGridDetailTemplateRenderer,
+            AXDataGridCellTemplateComponent,
+            AXDataGridCellTemplateRenderer
+        ],
+        providers: []
+    })
 ], AXDataGridModule);
 
-let AXDataLovPopupComponent = class AXDataLovPopupComponent extends AXBasePopupPageComponent {
-    constructor(cdr, ref) {
-        super();
-        this.cdr = cdr;
-        this.ref = ref;
-        this.columns = [];
-        this.selectedItems = [];
-        this.keyField = '';
-        this.allowNull = true;
-        this.rtl = AXConfig.get('layout.rtl');
-        this.selectedRows = [];
-    }
-    ngOnInit() {
-        if (this.rtl == null) {
-            this.rtl = window.getComputedStyle(this.ref.nativeElement, null).getPropertyValue('direction') === 'rtl';
-        }
-    }
-    onDoneClick() {
-        if (this.selectedItems) {
-            this.close(this.selectedItems);
-        }
-        else {
-            this.close();
-        }
-    }
-    rowDoubleClicked(e) {
-        console.log('s', e.data.data);
-        if (this.selectionMode == 'single') {
-            this.selectedItems = [];
-        }
-        this.selectedItems = this.selectedItems.filter((c) => c[this.keyField] != e.data.data[this.keyField]);
-        this.selectedItems.push(e.data.data);
-        this.onDoneClick();
-    }
-    onCancelClick() {
-        this.close();
-    }
-    rowSelectionChange(e) {
-        if (e.data.node.selected == true) {
-            this.selectedItems = this.selectedItems.filter((c) => c[this.keyField] != e.data.node.data[this.keyField]);
-            this.selectedItems.push(e.data.node.data);
-        }
-        else {
-            if (this.allowNull == true || (this.allowNull == false && this.selectedItems.length > 1)) {
-                this.selectedItems = this.selectedItems.filter((c) => c[this.keyField] != e.data.node.data[this.keyField]);
-            }
-        }
-        // console.log('ee', e)
-        // // console.log('e', e);
-        // console.log('select', e.data.node.selected);
-        // console.log('index', e.data.rowIndex);
-    }
-    ngAfterViewInit() {
-        this.selectedItems.forEach((ele) => {
-            this.selectedRows.push(ele);
-        });
-        this.searchBox.focus();
-        if (this.dataSource.onDataReceived) {
-            this.dataSource.onDataReceived.subscribe((arg) => {
-                this.cdr.markForCheck();
-                this.cdr.detectChanges();
-            });
-        }
-    }
-    // onValueSearchChanged(e) {
-    //     const params: AXDataSourceReadParams = {}
-    //     params.searchText = e.value;
-    //     // params.take = 100;
-    //     // params.skip = 0
-    //     this.dataSource.fetch(params);
-    // }
-    getFooterButtons() {
-        return [
-            {
-                text: AXTranslator.get('common.confirm'),
-                name: 'confirm',
-                style: 'ax primary',
-                icon: 'far fa-check-circle'
-            },
-            {
-                text: AXTranslator.get('common.cancel'),
-                name: 'cancel',
-                style: 'ax light',
-                icon: 'far fa-times-circle'
-            }
-        ];
-    }
-    onFooterButtonClick(e) {
-        if (e.name === 'confirm') {
-            this.onDoneClick();
-        }
-        if (e.name === 'cancel') {
-            this.onCancelClick();
-        }
-    }
-};
-AXDataLovPopupComponent.ctorParameters = () => [
-    { type: ChangeDetectorRef },
-    { type: ElementRef }
-];
-__decorate([
-    ViewChild('grid', { static: true }),
-    __metadata("design:type", AXDataGridComponent)
-], AXDataLovPopupComponent.prototype, "grid", void 0);
-__decorate([
-    ViewChild('searchBox'),
-    __metadata("design:type", AXToolbarSearchComponent)
-], AXDataLovPopupComponent.prototype, "searchBox", void 0);
-AXDataLovPopupComponent = __decorate([
-    Component({
-        template: "<div style=\"height: 70vh; padding: 0.5em;\">\r\n    <div style=\"height: calc(100%);\">\r\n\r\n        <ax-data-grid [rtl]=\"rtl\" [suppressRowClickSelection]=\"false\" [keyField]=\"keyField\"\r\n            [hasChildField]=\"hasChildField\" [selectRow]=\"selectedItems\" #grid [columns]=\"columns\"\r\n            [remoteOperation]=\"true\" [selectionMode]=\"selectionMode\" (rowDbClick)=\"rowDoubleClicked($event)\"\r\n            (rowSelectionChange)=\"rowSelectionChange($event)\" [dataSource]=\"dataSource\">\r\n            <ax-toolbar>\r\n                <ax-toolbar-search #searchBox style=\"width: 100%;\"></ax-toolbar-search>\r\n            </ax-toolbar>\r\n            <ax-selection-column *ngIf=\"selectionMode== 'single'? false : true\"></ax-selection-column>\r\n            <!-- <ax-data-source [provideData]=\"dataSource.provideData\">\r\n            </ax-data-source> -->\r\n        </ax-data-grid>\r\n    </div>\r\n</div>"
-    }),
-    __metadata("design:paramtypes", [ChangeDetectorRef, ElementRef])
+let AXDataLovPopupComponent = class AXDataLovPopupComponent extends AXBasePopupPageComponent {
+    constructor(cdr, ref) {
+        super();
+        this.cdr = cdr;
+        this.ref = ref;
+        this.columns = [];
+        this.selectedItems = [];
+        this.keyField = '';
+        this.allowNull = true;
+        this.rtl = AXConfig.get('layout.rtl');
+        this.selectedRows = [];
+    }
+    ngOnInit() {
+        if (this.rtl == null) {
+            this.rtl = window.getComputedStyle(this.ref.nativeElement, null).getPropertyValue('direction') === 'rtl';
+        }
+    }
+    onDoneClick() {
+        if (this.selectedItems) {
+            this.close(this.selectedItems);
+        }
+        else {
+            this.close();
+        }
+    }
+    rowDoubleClicked(e) {
+        console.log('s', e.data.data);
+        if (this.selectionMode == 'single') {
+            this.selectedItems = [];
+        }
+        this.selectedItems = this.selectedItems.filter((c) => c[this.keyField] != e.data.data[this.keyField]);
+        this.selectedItems.push(e.data.data);
+        this.onDoneClick();
+    }
+    onCancelClick() {
+        this.close();
+    }
+    rowSelectionChange(e) {
+        if (e.data.node.selected == true) {
+            this.selectedItems = this.selectedItems.filter((c) => c[this.keyField] != e.data.node.data[this.keyField]);
+            this.selectedItems.push(e.data.node.data);
+        }
+        else {
+            if (this.allowNull == true || (this.allowNull == false && this.selectedItems.length > 1)) {
+                this.selectedItems = this.selectedItems.filter((c) => c[this.keyField] != e.data.node.data[this.keyField]);
+            }
+        }
+        // console.log('ee', e)
+        // // console.log('e', e);
+        // console.log('select', e.data.node.selected);
+        // console.log('index', e.data.rowIndex);
+    }
+    ngAfterViewInit() {
+        this.selectedItems.forEach((ele) => {
+            this.selectedRows.push(ele);
+        });
+        this.searchBox.focus();
+        if (this.dataSource.onDataReceived) {
+            this.dataSource.onDataReceived.subscribe((arg) => {
+                this.cdr.markForCheck();
+                this.cdr.detectChanges();
+            });
+        }
+    }
+    // onValueSearchChanged(e) {
+    //     const params: AXDataSourceReadParams = {}
+    //     params.searchText = e.value;
+    //     // params.take = 100;
+    //     // params.skip = 0
+    //     this.dataSource.fetch(params);
+    // }
+    getFooterButtons() {
+        return [
+            {
+                text: AXTranslator.get('common.confirm'),
+                name: 'confirm',
+                style: 'ax primary',
+                icon: 'far fa-check-circle'
+            },
+            {
+                text: AXTranslator.get('common.cancel'),
+                name: 'cancel',
+                style: 'ax light',
+                icon: 'far fa-times-circle'
+            }
+        ];
+    }
+    onFooterButtonClick(e) {
+        if (e.name === 'confirm') {
+            this.onDoneClick();
+        }
+        if (e.name === 'cancel') {
+            this.onCancelClick();
+        }
+    }
+};
+AXDataLovPopupComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef },
+    { type: ElementRef }
+];
+__decorate([
+    ViewChild('grid', { static: true }),
+    __metadata("design:type", AXDataGridComponent)
+], AXDataLovPopupComponent.prototype, "grid", void 0);
+__decorate([
+    ViewChild('searchBox'),
+    __metadata("design:type", AXToolbarSearchComponent)
+], AXDataLovPopupComponent.prototype, "searchBox", void 0);
+AXDataLovPopupComponent = __decorate([
+    Component({
+        template: "<div style=\"height: 70vh; padding: 0.5em;\">\n    <div style=\"height: calc(100%);\">\n\n        <ax-data-grid [rtl]=\"rtl\" [suppressRowClickSelection]=\"false\" [keyField]=\"keyField\"\n            [hasChildField]=\"hasChildField\" [selectRow]=\"selectedItems\" #grid [columns]=\"columns\"\n            [remoteOperation]=\"true\" [selectionMode]=\"selectionMode\" (rowDbClick)=\"rowDoubleClicked($event)\"\n            (rowSelectionChange)=\"rowSelectionChange($event)\" [dataSource]=\"dataSource\">\n            <ax-toolbar>\n                <ax-toolbar-search #searchBox style=\"width: 100%;\"></ax-toolbar-search>\n            </ax-toolbar>\n            <ax-selection-column *ngIf=\"selectionMode== 'single'? false : true\"></ax-selection-column>\n            <!-- <ax-data-source [provideData]=\"dataSource.provideData\">\n            </ax-data-source> -->\n        </ax-data-grid>\n    </div>\n</div>"
+    }),
+    __metadata("design:paramtypes", [ChangeDetectorRef, ElementRef])
 ], AXDataLovPopupComponent);
 
-var AXLOVComponent_1;
-let AXLOVComponent = AXLOVComponent_1 = class AXLOVComponent extends AXValidatableComponent {
-    constructor(popup, ref) {
-        super();
-        this.popup = popup;
-        this.ref = ref;
-        this.textField = '';
-        this.allowSearch = true;
-        this.valueField = '';
-        this.hasChildField = 'null';
-        this.allowNull = true;
-        this.popupSize = 'md';
-        this.selectedItems = [];
-        // @Input()
-        // selectedValues: any[] = [];
-        this.readonly = false;
-        this.disabled = false;
-        this.chipsWidth = '';
-        this.size = 'md';
-        this.mode = 'single';
-        this.onSelectionChange = new EventEmitter();
-        this.rtl = AXConfig.get('layout.rtl');
-    }
-    get validation() {
-        return this._validation ? this._validation : this._contentValidation;
-    }
-    set validation(v) {
-        this._validation = v;
-    }
-    focus() { this.selectBox.focus(); }
-    refresh() {
-        this.selectBox.refresh();
-    }
-    handleButtonClick() {
-        this.open();
-    }
-    ngOnInit() {
-        if (this.rtl == null) {
-            this.rtl = window.getComputedStyle(this.ref.nativeElement, null).getPropertyValue('direction') === 'rtl';
-        }
-        //  this.selectVal = this.selectedValues;
-        this.onSelectionChange.subscribe(c => {
-            this.clearValidationStyle(this.ref.nativeElement);
-        });
-    }
-    ngAfterContentInit() {
-        this.initValidation(this.ref, 'selectedItems', this.validation);
-    }
-    handleSelectChange(e) {
-        //  console.log('se' + JSON.stringify(e));
-        this.onSelectionChange.emit({ data: this.selectedItems, component: this, htmlElement: this.ref.nativeElement });
-    }
-    open() {
-        return new Promise((resolve) => {
-            this.selectBox.dropdown.close();
-            this.popup.open(AXDataLovPopupComponent, {
-                size: this.popupSize,
-                data: {
-                    dataSource: this.dataSource,
-                    selectionMode: this.mode,
-                    columns: this.columns.toArray(),
-                    //  selectedItems: this.selectedValues,
-                    selectedItems: this.selectedItems,
-                    keyField: this.valueField,
-                    allowNull: this.allowNull,
-                    hasChildField: this.hasChildField,
-                    rtl: this.rtl
-                },
-                title: this.caption,
-            }).then(c => {
-                if (c.data) {
-                    // this.selectedValues = [];
-                    this.selectedItems = [];
-                    c.data.forEach(elm => {
-                        this.selectedItems.push(elm);
-                    });
-                    //  this.selectedItems = c.data;
-                    //  this.selectBox.refresh();
-                    //    console.log('se' + JSON.stringify(this.selectedItems));
-                    this.onSelectionChange.emit({ data: this.selectedItems, component: this, htmlElement: this.ref.nativeElement });
-                    if (resolve) {
-                        resolve(c.data);
-                    }
-                }
-                else {
-                    if (resolve) {
-                        resolve();
-                    }
-                }
-                this.selectBox.refresh();
-            });
-        });
-    }
-};
-AXLOVComponent.ctorParameters = () => [
-    { type: AXPopupService },
-    { type: ElementRef }
-];
-__decorate([
-    ContentChild(AXValidation, { static: true }),
-    __metadata("design:type", AXValidation)
-], AXLOVComponent.prototype, "_contentValidation", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", AXValidation),
-    __metadata("design:paramtypes", [AXValidation])
-], AXLOVComponent.prototype, "validation", null);
-__decorate([
-    ViewChild('selectBox', { static: true }),
-    __metadata("design:type", AXSelectBoxComponent)
-], AXLOVComponent.prototype, "selectBox", void 0);
-__decorate([
-    ContentChild(AXDataSourceComponent, { static: true }),
-    __metadata("design:type", AXDataSourceComponent)
-], AXLOVComponent.prototype, "dataSource", void 0);
-__decorate([
-    ContentChildren(AXGridDataColumn),
-    __metadata("design:type", QueryList)
-], AXLOVComponent.prototype, "columns", void 0);
-__decorate([
-    ContentChild('itemTemplate', { static: true }),
-    __metadata("design:type", TemplateRef)
-], AXLOVComponent.prototype, "rowTemplate", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXLOVComponent.prototype, "textField", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXLOVComponent.prototype, "allowSearch", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXLOVComponent.prototype, "valueField", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXLOVComponent.prototype, "hasChildField", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXLOVComponent.prototype, "allowNull", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXLOVComponent.prototype, "popupSize", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Array)
-], AXLOVComponent.prototype, "selectedItems", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXLOVComponent.prototype, "readonly", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXLOVComponent.prototype, "disabled", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXLOVComponent.prototype, "chipsWidth", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXLOVComponent.prototype, "size", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXLOVComponent.prototype, "caption", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXLOVComponent.prototype, "mode", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], AXLOVComponent.prototype, "placeholder", void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", EventEmitter)
-], AXLOVComponent.prototype, "onSelectionChange", void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], AXLOVComponent.prototype, "rtl", void 0);
-AXLOVComponent = AXLOVComponent_1 = __decorate([
-    Component({
-        selector: 'ax-lov',
-        template: "<ax-select-box [rowInputTemplate]=\"rowTemplate\" [rtl]=\"rtl\" [allowSearch]=\"allowSearch\" #selectBox [showDropDownButton]=\"false\" [allowNull]=\"allowNull\"\r\n    [remoteOperation]=\"true\" [placeholder]=\"placeholder\" [size]=\"size\" [textField]=\"textField\" [valueField]=\"valueField\"\r\n    [disabled]=\"disabled\" [mode]=\"mode\" [(selectedItems)]=\"selectedItems\"\r\n    (selectionChanged)=\"handleSelectChange($event)\" [dataSource]=\"dataSource\">\r\n    <ng-container start>\r\n        <ng-content select=\"[start]\">\r\n        </ng-content>\r\n    </ng-container>\r\n    <ng-container end>\r\n        <ax-button icon=\"far fa-bars icon\" [disabled]=\"disabled\" type=\"light blank\" (click)=\"handleButtonClick()\" end\r\n            [tabIndex]=\"-1\">\r\n        </ax-button>\r\n        <ng-content select=\"[end]\">\r\n        </ng-content>\r\n    </ng-container>\r\n</ax-select-box>\r\n\r\n\r\n<!-- <ax-select-box2 [rtl]=\"rtl\" [allowSearch]=\"allowSearch\" #selectBox [showDropDownButton]=\"false\" [allowNull]=\"allowNull\"\r\n    [remoteOperation]=\"true\" [placeholder]=\"placeholder\" [size]=\"size\" [textField]=\"textField\" [valueField]=\"valueField\"\r\n    [disabled]=\"disabled\" [selectionMode]=\"mode\" (onValueChanged)=\"handleSelectChange($event)\" [dataSource]=\"dataSource\"\r\n    [(value)]=\"selectedItems\" selectionDataMode=\"item\">\r\n    <ng-container start>\r\n        <ng-content select=\"[start]\">\r\n        </ng-content>\r\n    </ng-container>\r\n    <ng-container end>\r\n        <ax-button icon=\"far fa-bars icon\" [disabled]=\"disabled\" type=\"primary blank\" (click)=\"handleButtonClick()\" end\r\n            [tabIndex]=\"-1\">\r\n        </ax-button>\r\n        <ng-content select=\"[end]\">\r\n        </ng-content>\r\n    </ng-container>\r\n</ax-select-box2> -->\r\n\r\n\r\n<!-- <div class=\"ax-lov-box\" [style.display]=\"mode=='hidden' ? 'none':'unset'\">\r\n    <div class=\"ax-field-set\">\r\n        <div class=\"ax-field-set-wrapper\" [ngClass]=\"{ 'no-label': !label }\">\r\n            <fieldset [ngClass]=\"{ 'input-focused': isFocused, 'input-error': errorText }\">\r\n                <legend *ngIf=\"label\">\r\n                    {{ label }}\r\n                </legend>\r\n            </fieldset>\r\n            <input type=\"text\" [(ngModel)]=\"text\" [placeholder]=\"placeholder\" (keyup)=\"handleKeyEvent($event)\"\r\n                (blur)=\"handleBlurEvent($event)\" (focus)=\"handleFocusEvent($event)\" class=\"ax-text-box\" disabled />\r\n            <div class=\"ax-field-set-button\">\r\n                <button *ngIf=\"text && allowClear\" type=\"button\" class=\"btn btn-light\" (click)=\"clearText()\">\r\n                    <i class=\"far fa-times\"></i>\r\n                </button>\r\n                <button type=\"button\" class=\" btn btn-primary\" (click)=\"handleButtonClick($event)\">\r\n                    <i class=\"far fa-check-circle\"></i>\r\n                </button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"validation-text\" *ngIf=\"errorText\">\r\n        {{ errorText }}\r\n    </div>\r\n\r\n</div> -->",
-        encapsulation: ViewEncapsulation.None,
-        host: { style: 'width: 100%' },
-        providers: [{ provide: AXValidatableComponent, useExisting: AXLOVComponent_1 }]
-    }),
-    __metadata("design:paramtypes", [AXPopupService, ElementRef])
+var AXLOVComponent_1;
+let AXLOVComponent = AXLOVComponent_1 = class AXLOVComponent extends AXValidatableComponent {
+    constructor(popup, ref) {
+        super();
+        this.popup = popup;
+        this.ref = ref;
+        this.textField = '';
+        this.allowSearch = true;
+        this.valueField = '';
+        this.hasChildField = 'null';
+        this.allowNull = true;
+        this.popupSize = 'md';
+        this.selectedItems = [];
+        // @Input()
+        // selectedValues: any[] = [];
+        this.readonly = false;
+        this.disabled = false;
+        this.chipsWidth = '';
+        this.size = 'md';
+        this.mode = 'single';
+        this.onSelectionChange = new EventEmitter();
+        this.rtl = AXConfig.get('layout.rtl');
+    }
+    get validation() {
+        return this._validation ? this._validation : this._contentValidation;
+    }
+    set validation(v) {
+        this._validation = v;
+    }
+    focus() { this.selectBox.focus(); }
+    refresh() {
+        this.selectBox.refresh();
+    }
+    handleButtonClick() {
+        this.open();
+    }
+    ngOnInit() {
+        if (this.rtl == null) {
+            this.rtl = window.getComputedStyle(this.ref.nativeElement, null).getPropertyValue('direction') === 'rtl';
+        }
+        //  this.selectVal = this.selectedValues;
+        this.onSelectionChange.subscribe(c => {
+            this.clearValidationStyle(this.ref.nativeElement);
+        });
+    }
+    ngAfterContentInit() {
+        this.initValidation(this.ref, 'selectedItems', this.validation);
+    }
+    handleSelectChange(e) {
+        //  console.log('se' + JSON.stringify(e));
+        this.onSelectionChange.emit({ data: this.selectedItems, component: this, htmlElement: this.ref.nativeElement });
+    }
+    open() {
+        return new Promise((resolve) => {
+            this.selectBox.dropdown.close();
+            this.popup.open(AXDataLovPopupComponent, {
+                size: this.popupSize,
+                data: {
+                    dataSource: this.dataSource,
+                    selectionMode: this.mode,
+                    columns: this.columns.toArray(),
+                    //  selectedItems: this.selectedValues,
+                    selectedItems: this.selectedItems,
+                    keyField: this.valueField,
+                    allowNull: this.allowNull,
+                    hasChildField: this.hasChildField,
+                    rtl: this.rtl
+                },
+                title: this.caption,
+            }).then(c => {
+                if (c.data) {
+                    // this.selectedValues = [];
+                    this.selectedItems = [];
+                    c.data.forEach(elm => {
+                        this.selectedItems.push(elm);
+                    });
+                    //  this.selectedItems = c.data;
+                    //  this.selectBox.refresh();
+                    //    console.log('se' + JSON.stringify(this.selectedItems));
+                    this.onSelectionChange.emit({ data: this.selectedItems, component: this, htmlElement: this.ref.nativeElement });
+                    if (resolve) {
+                        resolve(c.data);
+                    }
+                }
+                else {
+                    if (resolve) {
+                        resolve();
+                    }
+                }
+                this.selectBox.refresh();
+            });
+        });
+    }
+};
+AXLOVComponent.ctorParameters = () => [
+    { type: AXPopupService },
+    { type: ElementRef }
+];
+__decorate([
+    ContentChild(AXValidation, { static: true }),
+    __metadata("design:type", AXValidation)
+], AXLOVComponent.prototype, "_contentValidation", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", AXValidation),
+    __metadata("design:paramtypes", [AXValidation])
+], AXLOVComponent.prototype, "validation", null);
+__decorate([
+    ViewChild('selectBox', { static: true }),
+    __metadata("design:type", AXSelectBoxComponent)
+], AXLOVComponent.prototype, "selectBox", void 0);
+__decorate([
+    ContentChild(AXDataSourceComponent, { static: true }),
+    __metadata("design:type", AXDataSourceComponent)
+], AXLOVComponent.prototype, "dataSource", void 0);
+__decorate([
+    ContentChildren(AXGridDataColumn),
+    __metadata("design:type", QueryList)
+], AXLOVComponent.prototype, "columns", void 0);
+__decorate([
+    ContentChild('itemTemplate', { static: true }),
+    __metadata("design:type", TemplateRef)
+], AXLOVComponent.prototype, "rowTemplate", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXLOVComponent.prototype, "textField", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXLOVComponent.prototype, "allowSearch", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXLOVComponent.prototype, "valueField", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXLOVComponent.prototype, "hasChildField", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXLOVComponent.prototype, "allowNull", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXLOVComponent.prototype, "popupSize", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Array)
+], AXLOVComponent.prototype, "selectedItems", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXLOVComponent.prototype, "readonly", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXLOVComponent.prototype, "disabled", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXLOVComponent.prototype, "chipsWidth", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXLOVComponent.prototype, "size", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXLOVComponent.prototype, "caption", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXLOVComponent.prototype, "mode", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], AXLOVComponent.prototype, "placeholder", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", EventEmitter)
+], AXLOVComponent.prototype, "onSelectionChange", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], AXLOVComponent.prototype, "rtl", void 0);
+AXLOVComponent = AXLOVComponent_1 = __decorate([
+    Component({
+        selector: 'ax-lov',
+        template: "<ax-select-box [rowInputTemplate]=\"rowTemplate\" [rtl]=\"rtl\" [allowSearch]=\"allowSearch\" #selectBox [showDropDownButton]=\"false\" [allowNull]=\"allowNull\"\n    [remoteOperation]=\"true\" [placeholder]=\"placeholder\" [size]=\"size\" [textField]=\"textField\" [valueField]=\"valueField\"\n    [disabled]=\"disabled\" [mode]=\"mode\" [(selectedItems)]=\"selectedItems\"\n    (selectionChanged)=\"handleSelectChange($event)\" [dataSource]=\"dataSource\">\n    <ng-container start>\n        <ng-content select=\"[start]\">\n        </ng-content>\n    </ng-container>\n    <ng-container end>\n        <ax-button icon=\"far fa-bars icon\" [disabled]=\"disabled\" type=\"light blank\" (click)=\"handleButtonClick()\" end\n            [tabIndex]=\"-1\">\n        </ax-button>\n        <ng-content select=\"[end]\">\n        </ng-content>\n    </ng-container>\n</ax-select-box>\n\n\n<!-- <ax-select-box2 [rtl]=\"rtl\" [allowSearch]=\"allowSearch\" #selectBox [showDropDownButton]=\"false\" [allowNull]=\"allowNull\"\n    [remoteOperation]=\"true\" [placeholder]=\"placeholder\" [size]=\"size\" [textField]=\"textField\" [valueField]=\"valueField\"\n    [disabled]=\"disabled\" [selectionMode]=\"mode\" (onValueChanged)=\"handleSelectChange($event)\" [dataSource]=\"dataSource\"\n    [(value)]=\"selectedItems\" selectionDataMode=\"item\">\n    <ng-container start>\n        <ng-content select=\"[start]\">\n        </ng-content>\n    </ng-container>\n    <ng-container end>\n        <ax-button icon=\"far fa-bars icon\" [disabled]=\"disabled\" type=\"primary blank\" (click)=\"handleButtonClick()\" end\n            [tabIndex]=\"-1\">\n        </ax-button>\n        <ng-content select=\"[end]\">\n        </ng-content>\n    </ng-container>\n</ax-select-box2> -->\n\n\n<!-- <div class=\"ax-lov-box\" [style.display]=\"mode=='hidden' ? 'none':'unset'\">\n    <div class=\"ax-field-set\">\n        <div class=\"ax-field-set-wrapper\" [ngClass]=\"{ 'no-label': !label }\">\n            <fieldset [ngClass]=\"{ 'input-focused': isFocused, 'input-error': errorText }\">\n                <legend *ngIf=\"label\">\n                    {{ label }}\n                </legend>\n            </fieldset>\n            <input type=\"text\" [(ngModel)]=\"text\" [placeholder]=\"placeholder\" (keyup)=\"handleKeyEvent($event)\"\n                (blur)=\"handleBlurEvent($event)\" (focus)=\"handleFocusEvent($event)\" class=\"ax-text-box\" disabled />\n            <div class=\"ax-field-set-button\">\n                <button *ngIf=\"text && allowClear\" type=\"button\" class=\"btn btn-light\" (click)=\"clearText()\">\n                    <i class=\"far fa-times\"></i>\n                </button>\n                <button type=\"button\" class=\" btn btn-primary\" (click)=\"handleButtonClick($event)\">\n                    <i class=\"far fa-check-circle\"></i>\n                </button>\n            </div>\n        </div>\n    </div>\n    <div class=\"validation-text\" *ngIf=\"errorText\">\n        {{ errorText }}\n    </div>\n\n</div> -->",
+        encapsulation: ViewEncapsulation.None,
+        host: { style: 'width: 100%' },
+        providers: [{ provide: AXValidatableComponent, useExisting: AXLOVComponent_1 }]
+    }),
+    __metadata("design:paramtypes", [AXPopupService, ElementRef])
 ], AXLOVComponent);
 
-let AXLOVModule = class AXLOVModule {
-};
-AXLOVModule = __decorate([
-    NgModule({
-        declarations: [AXLOVComponent, AXDataLovPopupComponent],
-        imports: [CommonModule, FormsModule, AXDataGridModule, AXDataSourceModule, AXButtonModule, AXToolbarModule, AXSelectBoxModule, AXSearchBoxModule],
-        exports: [AXLOVComponent, AXDataLovPopupComponent],
-        providers: [],
-        entryComponents: [AXDataLovPopupComponent]
-    })
+let AXLOVModule = class AXLOVModule {
+};
+AXLOVModule = __decorate([
+    NgModule({
+        declarations: [AXLOVComponent, AXDataLovPopupComponent],
+        imports: [CommonModule, FormsModule, AXDataGridModule, AXDataSourceModule, AXButtonModule, AXToolbarModule, AXSelectBoxModule, AXSearchBoxModule],
+        exports: [AXLOVComponent, AXDataLovPopupComponent],
+        providers: [],
+        entryComponents: [AXDataLovPopupComponent]
+    })
 ], AXLOVModule);
 
-/**
- * Generated bundle index. Do not edit.
+/**
+ * Generated bundle index. Do not edit.
  */
 
 export { AXDaagridRowClickEvent, AXDataGridCellEvent, AXDataGridCellTemplateComponent, AXDataGridCellTemplateRenderer, AXDataGridColumnsChangeEvent, AXDataGridComponent, AXDataGridDetailTemplateComponent, AXDataGridDetailTemplateRenderer, AXDataGridFilterComponent, AXDataGridModule, AXDataGridRowSelectionChangeEvent, AXDataGridRowTemplateComponent, AXDataGridRowTemplateRenderer, AXDataGridSelectionChangeEvent, AXDataLovPopupComponent, AXDatePickerFilterComponent, AXGridCheckColumn, AXGridCommandColumn, AXGridDataColumn, AXGridDateColumn, AXGridRowNumberColumn, AXGridSelectionColumn, AXGridTextColumn, AXLOVComponent, AXLOVModule, BooleanFilterRenderer, BooleanRenderer, CommandRenderer, TextFilterRenderer };