nr-grid/fesm5/nr-grid.js

NR-Grid is basic a datagrid helper that uses Bootstrap and NgbBootstrap and developed for Angular applications.

import { __decorate } from 'tslib';
import { ɵɵdefineInjectable, Injectable, EventEmitter, ChangeDetectorRef, Input, Output, ViewChild, Component, Pipe, NgModule } from '@angular/core';
import { filter, each, clone, map, find } from 'lodash';
import { Subject } from 'rxjs';
import { debounceTime } from 'rxjs/operators';
import { NgbModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
import format from 'date-fns/format';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { NrSelectModule } from 'nr-select';

var NrGridService = /** @class */ (function () {
    function NrGridService() {
    }
    NrGridService.ɵprov = ɵɵdefineInjectable({ factory: function NrGridService_Factory() { return new NrGridService(); }, token: NrGridService, providedIn: "root" });
    NrGridService = __decorate([
        Injectable({
            providedIn: 'root'
        })
    ], NrGridService);
    return NrGridService;
}());

var NRGridColumnType;
(function (NRGridColumnType) {
    NRGridColumnType[NRGridColumnType["none"] = 0] = "none";
    NRGridColumnType[NRGridColumnType["default"] = 1] = "default";
    NRGridColumnType[NRGridColumnType["link"] = 2] = "link";
    NRGridColumnType[NRGridColumnType["inlineEditor"] = 3] = "inlineEditor";
})(NRGridColumnType || (NRGridColumnType = {}));

var FilterType;
(function (FilterType) {
    FilterType[FilterType["default"] = 0] = "default";
    FilterType[FilterType["date"] = 1] = "date";
    FilterType[FilterType["dateRange"] = 2] = "dateRange";
    FilterType[FilterType["yesNoRadio"] = 3] = "yesNoRadio";
    FilterType[FilterType["typeHead"] = 4] = "typeHead";
    FilterType[FilterType["numericRange"] = 5] = "numericRange";
    FilterType[FilterType["dropdown"] = 6] = "dropdown";
})(FilterType || (FilterType = {}));

var NRGridComponent = /** @class */ (function () {
    function NRGridComponent(modalService, cdr) {
        var _this = this;
        this.modalService = modalService;
        this.cdr = cdr;
        this.onPageChanged = new EventEmitter();
        this.onEditClicked = new EventEmitter();
        this.onDeleteClicked = new EventEmitter();
        this.onFilterChanged = new EventEmitter();
        this.onOrderChanged = new EventEmitter();
        this.onRowClicked = new EventEmitter();
        this.onRowValueChanged = new EventEmitter();
        this.onCellLinkClicked = new EventEmitter();
        this.onLimitChanged = new EventEmitter();
        this.onCustomButtonClicked = new EventEmitter();
        this.editingRows = {};
        this.limitChangeOptions = {
            searchable: false,
            valueMember: 'id',
            displayMember: 'text',
            hideLabel: true
        };
        this.pages = [
            { id: 10, text: '10' },
            { id: 25, text: '25' },
            { id: 50, text: '50' },
            { id: 100, text: '100' },
        ];
        this.ranges = {};
        this.filterChanged = new Subject();
        this.rowFilterChange = new EventEmitter();
        this.dataLoaded = new EventEmitter();
        this.order = {};
        this.typeheads = [];
        this._rangeValue = '';
        this.limit = 10;
        this.filterChanged.pipe(debounceTime(500)).subscribe(function (val) {
            if (_this.go.dataSource) {
                _this.go.dataSource.reload();
            }
            else {
                _this.onFilterChanged.emit(_this.rowFilter);
            }
        });
    }
    Object.defineProperty(NRGridComponent.prototype, "rowFilter", {
        get: function () {
            return this._rowFilter;
        },
        set: function (value) {
            this.changePage(1);
            this._rowFilter = value;
            this.rowFilterChange.emit(this._rowFilter);
        },
        enumerable: true,
        configurable: true
    });
    NRGridComponent.prototype.changePage = function (page) {
        if (this.options) {
            this.options.page = page;
        }
    };
    NRGridComponent.prototype.filteredColumns = function () {
        var f = filter(this.go.columns, function (x) {
            return !x.denied;
        });
        return filter(f, function (x) {
            return !x.hide;
        });
    };
    NRGridComponent.prototype.dataLoad = function (go) {
        var _this = this;
        go.loading = true;
        if (go.dataSource.usePromise) {
            go.dataSource.loader(go.dataSource.parent, this.rowFilter)
                .then(function (r) {
                go.data = r.data;
                go.rowCount = r.rowCount;
                go.loading = false;
                _this.dataLoaded.emit(true);
                if (r.summary) {
                    go.summary = r.summary;
                }
            })
                .catch(function (e) {
                go.loading = false;
                console.log('qr-grid-data-load-error', e);
            });
        }
        else {
            go.dataSource.loader(this.go.dataSource.parent, this.rowFilter).subscribe(function (r) {
                go.data = r.data;
                go.rowCount = r.rowCount;
                go.loading = false;
                _this.dataLoaded.emit(true);
                if (r.summary) {
                    go.summary = r.summary;
                }
            }, function (err) {
                go.loading = false;
                console.log('qr-grid-data-load-error', err);
            });
        }
    };
    NRGridComponent.prototype.ngOnInit = function () {
        var _this = this;
        if (!this.rowFilter) {
            this.rowFilter = {};
        }
        if (this.options && !this.options.limit) {
            this.options.limit = 10;
        }
        if (this.options && !this.options.loading) {
            this.options.loading = true;
        }
        if (this.options && this.options.pager === undefined) {
            this.options.pager = true;
        }
        this.go = this.options;
        if (!this.go.data) {
            this.go.data = [];
        }
        if (!this.go.page) {
            this.go.page = 1;
        }
        if (!this.go.limit) {
            this.go.limit = 10;
        }
        if (!this.go.rowCount) {
            this.go.rowCount = 0;
        }
        if (!this.go.bootstrapTableClass) {
            this.go.bootstrapTableClass = 'table-bordered';
        }
        this.columns = this.filteredColumns();
        this.loadDropdownData();
        if (this.go.dataSource) {
            this.go.dataSource.reload = function () {
                _this.editingRows = {};
                return _this.dataLoad(_this.go);
            };
            if (!this.go.dataSource.manualLoading) {
                this.go.dataSource.reload();
            }
            else {
                this.go.loading = false;
            }
        }
    };
    NRGridComponent.prototype.loadDropdownData = function () {
        var my = this;
        each(this.go.columns, function (x) {
            if (x.dropdownDataService) {
                my.loadLookupData(x);
            }
        });
    };
    NRGridComponent.prototype.filterChange = function () {
        this.changePage(1);
        this.filterChanged.next(this.rowFilter);
        this.loadDropdownData();
    };
    NRGridComponent.prototype.pageChange = function (val) {
        if (this.go.dataSource) {
            this.go.page = val;
            this.go.dataSource.reload();
        }
        this.onPageChanged.emit(val);
    };
    NRGridComponent.prototype.editClicked = function (rowData) {
        this.onEditClicked.emit(clone(rowData));
    };
    NRGridComponent.prototype.checkEditButtonOption = function (rowData) {
        if (!this.go.actionButtonsOptions) {
            return true;
        }
        else if (!this.go.actionButtonsOptions.edit) {
            return false;
        }
        if (typeof this.go.actionButtonsOptions.edit == 'boolean') {
            return this.go.actionButtonsOptions.edit;
        }
        else {
            return this.go.actionButtonsOptions.edit(rowData);
        }
    };
    NRGridComponent.prototype.checkDeleteButtonOption = function (rowData) {
        if (!this.go.actionButtonsOptions) {
            return true;
        }
        else if (!this.go.actionButtonsOptions.delete) {
            return false;
        }
        if (typeof this.go.actionButtonsOptions.delete == 'boolean') {
            return this.go.actionButtonsOptions.delete;
        }
        else {
            return this.go.actionButtonsOptions.delete(rowData);
        }
    };
    NRGridComponent.prototype.deleteClicked = function (rowData) {
        this.activeDeleteModal = this.modalService.open(this.deleteModal, { centered: true });
        this.deleteData = rowData;
    };
    NRGridComponent.prototype.submitDelete = function () {
        this.onDeleteClicked.emit(this.deleteData);
        this.activeDeleteModal.close();
    };
    NRGridComponent.prototype.linkClicked = function (data) {
        this.onCellLinkClicked.emit(data);
    };
    NRGridComponent.prototype.isDefaultCell = function (t) {
        return !t || (t == NRGridColumnType.default || t == NRGridColumnType.inlineEditor);
    };
    NRGridComponent.prototype.isLinkCell = function (t) {
        return t === NRGridColumnType.link;
    };
    NRGridComponent.prototype.toggleOrder = function (column) {
        var columnKey = column.orderKey ? column.orderKey : column.name;
        if (this.order.column === columnKey) {
            this.order.desc = !this.order.desc;
        }
        else {
            this.order.desc = false;
        }
        this.order.column = columnKey;
        this.onOrderChanged.emit(this.order);
    };
    NRGridComponent.prototype.rowValueChanged = function (e) {
        this.onRowValueChanged.emit(e);
    };
    NRGridComponent.prototype.rowClicked = function (rowData) {
        if (this.go.rowClickAction && this.go.rowClickAction.enable) {
            this.onRowClicked.emit(rowData);
        }
    };
    NRGridComponent.prototype.isFilterDefault = function (val) {
        return val === FilterType.default;
    };
    NRGridComponent.prototype.isFilterDateRange = function (val) {
        return val === FilterType.dateRange;
    };
    NRGridComponent.prototype.isFilterYesNo = function (val) {
        return val == FilterType.yesNoRadio;
    };
    NRGridComponent.prototype.isFilterTypehead = function (val) {
        return val == FilterType.typeHead;
    };
    NRGridComponent.prototype.isFilterDropdown = function (c) {
        return c.filterType == FilterType.dropdown;
    };
    NRGridComponent.prototype.isFilterNumericRange = function (val) {
        return val == FilterType.numericRange;
    };
    NRGridComponent.prototype.selectTypeheadItem = function ($event, key) {
        this.rowFilter[key] = $event.item;
        this.filterChange();
    };
    NRGridComponent.prototype.onDateSelection = function (date, filterKey) {
        if (!this.fromDate && !this.toDate) {
            this.fromDate = date;
        }
        else if (this.fromDate && !this.toDate && date.after(this.fromDate)) {
            this.toDate = date;
        }
        else {
            this.toDate = null;
            this.fromDate = date;
        }
        if (this.fromDate && this.toDate) {
            var bs = this.fromDate;
            var be = this.toDate;
            var s = new Date(bs.year, bs.month - 1, bs.day);
            var e = new Date(be.year, be.month - 1, be.day);
            this._rangeValue = format(s, 'dd/MM/yyyy') + ' - ' + format(e, 'dd/MM/yyyy');
            this.rangePicker.toggle();
            this.rowFilter[filterKey] = s.toISOString() + ',' + e.toISOString();
            this.filterChange();
        }
    };
    NRGridComponent.prototype.rangeValue = function () {
        return this._rangeValue;
    };
    NRGridComponent.prototype.isHovered = function (date) {
        return this.fromDate && !this.toDate && this.hoveredDate && date.after(this.fromDate) && date.before(this.hoveredDate);
    };
    NRGridComponent.prototype.isInside = function (date) {
        return date.after(this.fromDate) && date.before(this.toDate);
    };
    NRGridComponent.prototype.isRange = function (date) {
        return date.equals(this.fromDate) || date.equals(this.toDate) || this.isInside(date) || this.isHovered(date);
    };
    NRGridComponent.prototype.getFilterKey = function (c) {
        return c.filterKey ? c.filterKey : c.name;
    };
    NRGridComponent.prototype.rangeChanged = function (c) {
        var key = this.getFilterKey(c);
        var startKey = key + '___start';
        var endKey = key + '___end';
        var start = this.ranges[startKey];
        var end = this.ranges[endKey];
        this.rowFilter[key] = (start ? start : '') + '___' + (end ? end : '');
        this.filterChange();
    };
    NRGridComponent.prototype.limitChanged = function (limit) {
        this.limit = Number(limit.value ? limit.value : limit);
        if (this.options.dataSource) {
            this.options.dataSource.reload();
        }
        this.onLimitChanged.emit(this.limit);
    };
    NRGridComponent.prototype.loadLookupData = function (c) {
        if (!c.dropdownData) {
            c.dropdownDataService.subscribe(function (result) {
                c.dropdownData = map(result.data, function (x) {
                    return {
                        id: x.id,
                        text: x.name
                    };
                });
            });
        }
    };
    NRGridComponent.prototype.customButtonClick = function (button, row) {
        this.onCustomButtonClicked.emit({
            button: button,
            data: row
        });
    };
    NRGridComponent.prototype.inlineEditorOn = function (cr, rowIndex, rowValue) {
        if (cr.type == NRGridColumnType.inlineEditor) {
            this.editingRows['row-' + rowIndex + '-col-' + cr.name] = {
                firstValue: rowValue[cr.name]
            };
            this.cdr.detectChanges();
            var e = document.getElementById('row-' + rowIndex + '-col-' + cr.name);
            if (e) {
                e.focus();
            }
        }
    };
    NRGridComponent.prototype.inlineEditorOff = function (cr, rowIndex, rowValue, toggleEvent, revert) {
        if (rowValue === void 0) { rowValue = undefined; }
        if (toggleEvent === void 0) { toggleEvent = false; }
        if (revert === void 0) { revert = false; }
        if (revert) {
            rowValue[cr.name] = this.editingRows['row-' + rowIndex + '-col-' + cr.name].firstValue;
        }
        this.editingRows['row-' + rowIndex + '-col-' + cr.name] = undefined;
        if (!revert && toggleEvent) {
            this.rowValueChanged({
                column: cr,
                row: rowValue
            });
        }
    };
    NRGridComponent.ctorParameters = function () { return [
        { type: NgbModal },
        { type: ChangeDetectorRef }
    ]; };
    __decorate([
        Input()
    ], NRGridComponent.prototype, "options", void 0);
    __decorate([
        Input()
    ], NRGridComponent.prototype, "loading", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "onPageChanged", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "onEditClicked", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "onDeleteClicked", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "onFilterChanged", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "onOrderChanged", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "onRowClicked", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "onRowValueChanged", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "onCellLinkClicked", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "onLimitChanged", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "onCustomButtonClicked", void 0);
    __decorate([
        ViewChild('deleteModal', { static: false })
    ], NRGridComponent.prototype, "deleteModal", void 0);
    __decorate([
        ViewChild('rangePicker', { static: false })
    ], NRGridComponent.prototype, "rangePicker", void 0);
    __decorate([
        Input()
    ], NRGridComponent.prototype, "columnHeaderTemplate", void 0);
    __decorate([
        Input()
    ], NRGridComponent.prototype, "footerTemplate", void 0);
    __decorate([
        Input()
    ], NRGridComponent.prototype, "rowFilter", null);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "rowFilterChange", void 0);
    __decorate([
        Output()
    ], NRGridComponent.prototype, "dataLoaded", void 0);
    NRGridComponent = __decorate([
        Component({
            selector: 'nr-grid',
            template: "<div class=\"nr-grid\">\n  <div class=\"table-responsive\">\n    <table class=\"table {{options.bootstrapTableClass}} mb-0\">\n      <thead>\n      <tr>\n        <th *ngFor=\"let c of columns\" class=\"nr-order-trigger\" (click)=\"toggleOrder(c)\"\n            [ngClass]=\"{'text-right': c.alignment == 'right' }\"\n            [ngStyle]=\"{'width': c.width != undefined ? c.width : 'auto' }\">\n\n          <ng-container *ngTemplateOutlet=\"columnHeaderTemplate; context: {column: c}\">\n\n          </ng-container>\n          <ng-container *ngIf=\"!columnHeaderTemplate\">\n            {{c.title}}\n          </ng-container>\n          <span class=\"nr-grid-orderer\"\n                *ngIf=\"order.column === (c.orderKey != null ? c.orderKey : c.name)\">\n                        <i *ngIf=\"!order.desc\" class=\"fa fa-arrow-up\"></i>\n                        <i *ngIf=\"order.desc\" class=\"fa fa-arrow-down\"></i>\n                    </span>\n        </th>\n        <th *ngIf=\"go.actionButtons\"\n            [ngStyle]=\"{'width': (90 + ((go.buttons ? go.buttons.length : 0) * 25)) + 'px' }\"></th>\n      </tr>\n      <tr class=\"filter-row\" *ngIf=\"go.filterRowEnabled\">\n        <td *ngFor=\"let c of columns\">\n          <ng-container *ngIf=\"!c.filterDisable\">\n            <input *ngIf=\"!c.filterType || isFilterDefault(c.filterType)\" type=\"text\" placeholder=\"Filter\"\n                   class=\"filter-control\" [(ngModel)]=\"rowFilter[getFilterKey(c)]\"\n                   (ngModelChange)=\"filterChange()\">\n            <input *ngIf=\"isFilterDateRange(c.filterType)\" type=\"text\" class=\"btn-light-disable\"\n                   ngbDatepicker\n                   #rangePicker=\"ngbDatepicker\"\n                   (dateSelect)=\"onDateSelection($event, getFilterKey(c))\"\n                   [dayTemplate]=\"dayTemplate\"\n                   [displayMonths]=\"2\" outsideDays=\"visible\" (focus)=\"rangePicker.toggle()\"\n                   [autoClose]=\"false\"\n                   placeholder=\"Filter\"\n                   [value]=\"rangeValue()\"\n                   class=\"filter-control\">\n            <div *ngIf=\"isFilterNumericRange(c.filterType)\" class=\"range-selector\">\n              <input type=\"text\" class=\"filter-control\" placeholder=\"Grather\"\n                     [(ngModel)]=\"ranges[getFilterKey(c) + '___start']\" (ngModelChange)=\"rangeChanged(c)\">\n              <input type=\"text\" class=\"filter-control\" placeholder=\"Lower\"\n                     [(ngModel)]=\"ranges[getFilterKey(c) + '___end']\" (ngModelChange)=\"rangeChanged(c)\">\n            </div>\n\n            <nr-select *ngIf=\"isFilterDropdown(c)\" [(value)]=\"rowFilter[getFilterKey(c)]\" [options]=\"c.selectOptions\"\n                       label=\"Select\" (valueChange)=\"filterChange()\"></nr-select>\n            <div *ngIf=\"isFilterYesNo(c.filterType)\" class=\"btn-group btn-group-toggle\" ngbRadioGroup\n                 name=\"radioBasic\"\n                 [(ngModel)]=\"rowFilter[getFilterKey(c)]\" (ngModelChange)=\"filterChange()\">\n              <label ngbButtonLabel class=\"btn-primary btn-xs\">\n                <input ngbButton type=\"radio\" [value]=\"true\"> Yes\n              </label>\n              <label ngbButtonLabel class=\"btn-primary btn-xs\">\n                <input ngbButton type=\"radio\" [value]=\"false\"> No\n              </label>\n            </div>\n          </ng-container>\n        </td>\n        <td *ngIf=\"go.actionButtons\"></td>\n      </tr>\n      </thead>\n      <tbody>\n      <tr *ngFor=\"let r of go.data; let rowIndex=index;\"\n          class=\"data-row\"\n          [ngClass]=\"{'nr-row-clickable': go.rowClickAction && go.rowClickAction.enable}\"\n          (click)=\"rowClicked(r)\">\n        <td *ngFor=\"let cr of columns\"\n            [ngClass]=\"{'text-right': cr.alignment == 'right', 'padding-none': editingRows['row-' + rowIndex + '-col-' + cr.name]}\">\n\n          <div *ngIf=\"cr.formatter && !isLinkCell(cr.type)\">\n            {{r[cr.name]|valueFormat: cr.formatter}}\n          </div>\n\n          <div class=\"default-view\"\n               *ngIf=\"!cr.formatter && isDefaultCell(cr.type) && !editingRows['row-' + rowIndex + '-col-' + cr.name]\"\n               [innerHTML]=\"cr.format ? cr.format({row: r, value: r[cr.name], parent: go.parent }) : r[cr.name]\"\n               (click)=\"inlineEditorOn(cr, rowIndex, r)\"></div>\n\n          <div *ngIf=\"isLinkCell(cr.type)\">\n            <a href=\"javascript:void(0)\" (click)=\"linkClicked({row: r, column: cr})\"\n               class=\"{{cr.link && cr.link.classes ? cr.link.classes : ''}}\"\n               [ngbTooltip]=\"cr.link && cr.link.tooltip ? cr.link.tooltip : ''\">\n              <i *ngIf=\"cr.link && cr.link.icon\" class=\"{{cr.link.icon}}\"></i>\n\n              <span *ngIf=\"!cr.formatter\"\n                    [innerHTML]=\"cr.format ? cr.format({row: r, value: r[cr.name], parent: go.parent}) : r[cr.name]\"></span>\n              <span *ngIf=\"cr.formatter\">{{r[cr.name]|valueFormat: cr.formatter}}</span>\n            </a>\n          </div>\n          <div *ngIf=\"editingRows['row-' + rowIndex + '-col-' + cr.name]\">\n            <div class=\"nr-inline-editor\">\n              <input [id]=\"'row-' + rowIndex + '-col-' + cr.name\" type=\"text\" [(ngModel)]=\"r[cr.name]\"/>\n              <div class=\"nr-inline-editor-buttons\">\n                <button class=\"btn btn-sm btn-primary\" type=\"button\" (click)=\"inlineEditorOff(cr, rowIndex, r, true)\">\n                  Save\n                </button>\n                <button class=\"btn btn-sm btn-secondary\" type=\"button\"\n                        (click)=\"inlineEditorOff(cr, rowIndex, r, false, true)\">Cancel\n                </button>\n              </div>\n            </div>\n          </div>\n        </td>\n        <td class=\"action-buttons-container\" *ngIf=\"go.actionButtons\">\n          <ng-container *ngFor=\"let b of go.buttons\">\n            <a href=\"javascript:void(0);\" (click)=\"customButtonClick(b, r)\" ngbTooltip=\"{{b.tooltip}}\"\n               *ngIf=\"!b.visible || (b.visible && b.visible(r))\">\n              <i class=\"{{b.icon}}\"></i>\n            </a>\n          </ng-container>\n          <a href=\"javascript:void(0);\" (click)=\"editClicked(r)\" ngbTooltip=\"Edit\"\n             *ngIf=\"!go.actionButtonsOptions || checkEditButtonOption(r)\">\n            <i class=\"fa fa-pencil\"></i>\n          </a>\n          <a href=\"javascript:void(0);\" (click)=\"deleteClicked(r)\" ngbTooltip=\"Delete\"\n             *ngIf=\"!go.actionButtonsOptions || checkDeleteButtonOption(r)\">\n            <i class=\"fa fa-trash\"></i>\n          </a>\n        </td>\n      </tr>\n      <tr *ngIf=\"go.data == undefined || go.data.length == 0\">\n        <td [colSpan]=\"columns.length + (go.actionButtons ? 1 : 0)\">\n          <div style=\"padding: 20px; text-align: center\">\n            No data\n          </div>\n        </td>\n      </tr>\n      </tbody>\n      <tfoot *ngIf=\"go.summary && !go.hideSummary\">\n      <tr>\n        <th *ngFor=\"let cr of columns\" [ngClass]=\"{'text-right': cr.alignment == 'right' }\">\n          <ng-container *ngIf=\"!cr.hideFromSummary\">\n            <div *ngIf=\"cr.formatter\">\n              {{go.summary[cr.name]|valueFormat: cr.formatter}}\n            </div>\n\n            <div *ngIf=\"isDefaultCell(cr.type) && (!cr.formatter)\"\n                 [innerHTML]=\"cr.format ? cr.format({row: go.summary, value: go.summary[cr.name], parent: go.parent}) : go.summary[cr.name]\"></div>\n\n            <div *ngIf=\"isLinkCell(cr.type) && (!cr.formatter)\">\n              <a href=\"javascript:void(0)\" (click)=\"linkClicked({row: go.summary, column: cr})\"\n                 class=\"{{cr.link.classes ? cr.link.classes : ''}}\"\n                 [ngbTooltip]=\"cr.link && cr.link.tooltip ? cr.link.tooltip : ''\">\n                <i *ngIf=\"cr.link.icon\" class=\"{{cr.link.icon}}\"></i>\n                <span\n                  [innerHTML]=\"cr.format ? cr.format({row: go.summary, value: go.summary[cr.name], parent: go.parent}) : go.summary[cr.name]\"></span>\n              </a>\n            </div>\n          </ng-container>\n        </th>\n      </tr>\n      </tfoot>\n    </table>\n\n  </div>\n  <ng-container *ngTemplateOutlet=\"footerTemplate;\">\n\n  </ng-container>\n  <div class=\"nr-grid-footer row\" *ngIf=\"go.pager\">\n    <div class=\"col-md-12\">\n      <ngb-pagination class=\"float-right\" [collectionSize]=\"go.rowCount\" [(page)]=\"go.page\" [maxSize]=\"10\"\n                      [pageSize]=\"go.limit\" (pageChange)=\"pageChange($event)\"></ngb-pagination>\n      <div class=\"float-right limit-selector\" style=\"min-width: 150px; width: 150px\">\n        <nr-select class=\"float-right\" [data]=\"pages\" [(value)]=\"go.limit\" label=\"Limit\" [options]=\"limitChangeOptions\"\n                   (valueChange)=\"limitChanged($event)\"></nr-select>\n      </div>\n    </div>\n  </div>\n  <div class=\"clearfix\"></div>\n</div>\n<ng-template #deleteModal let-modal>\n  <div class=\"modal-header\">\n    <h4 class=\"modal-title\" id=\"modal-basic-title\">Delete</h4>\n    <button type=\"button\" class=\"close\" aria-label=\"Close\" (click)=\"modal.dismiss('Cross click')\">\n      <span aria-hidden=\"true\">&times;</span>\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    Data will be deleted, are you sure?\n  </div>\n  <div class=\"modal-footer\">\n    <button type=\"submit\" class=\"btn btn-success\" (click)=\"submitDelete()\">Delete</button>\n    <button type=\"button\" class=\"btn btn-secondary\" (click)=\"modal.dismiss('Cross click')\">Cancel</button>\n  </div>\n</ng-template>\n<ng-template #dayTemplate let-date let-focused=\"focused\">\n  <span class=\"custom-day\"\n        [class.focused]=\"focused\"\n        [class.range]=\"isRange(date)\"\n        [class.faded]=\"isHovered(date) || isInside(date)\"\n        (mouseenter)=\"hoveredDate = date\"\n        (mouseleave)=\"hoveredDate = null\">\n    {{ date.day }}\n  </span>\n</ng-template>\n"
        })
    ], NRGridComponent);
    return NRGridComponent;
}());

var NRValueFormats;
(function (NRValueFormats) {
    NRValueFormats[NRValueFormats["default"] = 0] = "default";
    NRValueFormats[NRValueFormats["euro"] = 1] = "euro";
    NRValueFormats[NRValueFormats["dolar"] = 2] = "dolar";
    NRValueFormats[NRValueFormats["try"] = 3] = "try";
    NRValueFormats[NRValueFormats["commaInt"] = 4] = "commaInt";
    NRValueFormats[NRValueFormats["percent"] = 5] = "percent";
    NRValueFormats[NRValueFormats["dateTime"] = 6] = "dateTime";
    NRValueFormats[NRValueFormats["date"] = 7] = "date";
    NRValueFormats[NRValueFormats["boolean"] = 8] = "boolean";
    NRValueFormats[NRValueFormats["decimal"] = 9] = "decimal";
    NRValueFormats[NRValueFormats["number"] = 10] = "number";
})(NRValueFormats || (NRValueFormats = {}));

var currencies = [{ "id": "SRD", "symbol": "$" },
    { "id": "ANG", "symbol": "ƒ" },
    { "id": "AOA", "symbol": "Kz" },
    { "id": "ARS", "symbol": "$" },
    { "id": "AUD", "symbol": "$" },
    { "id": "AWG", "symbol": "ƒ" },
    { "id": "BBD", "symbol": "$" },
    { "id": "BDT", "symbol": "৳" },
    { "id": "BGN", "symbol": "лв" },
    { "id": "BHD", "symbol": ".د.ب" },
    { "id": "ALL", "symbol": "L" },
    { "id": "BIF", "symbol": "Fr" },
    { "id": "BMD", "symbol": "$" },
    { "id": "BND", "symbol": "$" },
    { "id": "BOB", "symbol": "Bs." },
    { "id": "BRL", "symbol": "R$" },
    { "id": "BSD", "symbol": "$" },
    { "id": "BTN", "symbol": "Nu." },
    { "id": "BWP", "symbol": "P" },
    { "id": "BZD", "symbol": "$" },
    { "id": "CAD", "symbol": "$" },
    { "id": "CDF", "symbol": "Fr" },
    { "id": "CHF", "symbol": "Fr" },
    { "id": "CLP", "symbol": "$" },
    { "id": "CNY", "symbol": "¥" },
    { "id": "COP", "symbol": "$" },
    { "id": "CRC", "symbol": "₡" },
    { "id": "CUC", "symbol": "$" },
    { "id": "CUP", "symbol": "$" },
    { "id": "CVE", "symbol": "Esc" },
    { "id": "CZK", "symbol": "Kč" },
    { "id": "DJF", "symbol": "Fr" },
    { "id": "DKK", "symbol": "kr" },
    { "id": "DOP", "symbol": "$" },
    { "id": "DZD", "symbol": "د.ج" },
    { "id": "EGP", "symbol": "£" },
    { "id": "ERN", "symbol": "Nfk" },
    { "id": "ETB", "symbol": "Br" },
    { "id": "FJD", "symbol": "$" },
    { "id": "FKP", "symbol": "£" },
    { "id": "GBP", "symbol": "£" },
    { "id": "GEL", "symbol": "ლ" },
    { "id": "GIP", "symbol": "£" },
    { "id": "GMD", "symbol": "D" },
    { "id": "GNF", "symbol": "Fr" },
    { "id": "GTQ", "symbol": "Q" },
    { "id": "GYD", "symbol": "$" },
    { "id": "HKD", "symbol": "$" },
    { "id": "HNL", "symbol": "L" },
    { "id": "HRK", "symbol": "kn" },
    { "id": "HTG", "symbol": "G" },
    { "id": "HUF", "symbol": "Ft" },
    { "id": "IDR", "symbol": "Rp" },
    { "id": "ILS", "symbol": "₪" },
    { "id": "INR", "symbol": "₹" },
    { "id": "IQD", "symbol": "ع.د" },
    { "id": "ISK", "symbol": "kr" },
    { "id": "JMD", "symbol": "$" },
    { "id": "JOD", "symbol": "د.ا" },
    { "id": "JPY", "symbol": "¥" },
    { "id": "KES", "symbol": "Sh" },
    { "id": "KGS", "symbol": "с" },
    { "id": "KHR", "symbol": "៛" },
    { "id": "KMF", "symbol": "Fr" },
    { "id": "KRW", "symbol": "₩" },
    { "id": "KWD", "symbol": "د.ك" },
    { "id": "KYD", "symbol": "$" },
    { "id": "LAK", "symbol": "₭" },
    { "id": "LBP", "symbol": "ل.ل" },
    { "id": "LKR", "symbol": "Rs" },
    { "id": "LRD", "symbol": "$" },
    { "id": "LSL", "symbol": "L" },
    { "id": "LYD", "symbol": "ل.د" },
    { "id": "MAD", "symbol": "د.م." },
    { "id": "MDL", "symbol": "L" },
    { "id": "MGA", "symbol": "Ar" },
    { "id": "MKD", "symbol": "ден" },
    { "id": "MMK", "symbol": "Ks" },
    { "id": "MNT", "symbol": "₮" },
    { "id": "MOP", "symbol": "P" },
    { "id": "MRO", "symbol": "UM" },
    { "id": "MUR", "symbol": "₨" },
    { "id": "MVR", "symbol": ".ރ" },
    { "id": "MWK", "symbol": "MK" },
    { "id": "MXN", "symbol": "$" },
    { "id": "MYR", "symbol": "RM" },
    { "id": "NAD", "symbol": "$" },
    { "id": "NGN", "symbol": "₦" },
    { "id": "NIO", "symbol": "C$" },
    { "id": "NOK", "symbol": "kr" },
    { "id": "NPR", "symbol": "₨" },
    { "id": "NZD", "symbol": "$" },
    { "id": "OMR", "symbol": "ر.ع." },
    { "id": "PAB", "symbol": "B/." },
    { "id": "PEN", "symbol": "S/." },
    { "id": "PGK", "symbol": "K" },
    { "id": "PHP", "symbol": "₱" },
    { "id": "PKR", "symbol": "₨" },
    { "id": "PLN", "symbol": "zł" },
    { "id": "PYG", "symbol": "₲" },
    { "id": "QAR", "symbol": "ر.ق" },
    { "id": "RON", "symbol": "lei" },
    { "id": "RSD", "symbol": "дин." },
    { "id": "RUB", "symbol": "₽" },
    { "id": "RWF", "symbol": "Fr" },
    { "id": "SAR", "symbol": "ر.س" },
    { "id": "SBD", "symbol": "$" },
    { "id": "SCR", "symbol": "₨" },
    { "id": "SDG", "symbol": "ج.س." },
    { "id": "SEK", "symbol": "kr" },
    { "id": "SGD", "symbol": "$" },
    { "id": "SHP", "symbol": "£" },
    { "id": "SLL", "symbol": "Le" },
    { "id": "SOS", "symbol": "Sh" },
    { "id": "STD", "symbol": "Db" },
    { "id": "SYP", "symbol": "£" },
    { "id": "SZL", "symbol": "L" },
    { "id": "UYU", "symbol": "$" },
    { "id": "AFN", "symbol": "؋" },
    { "id": "AED", "symbol": "د.إ" },
    { "id": "EUR", "symbol": "€" },
    { "id": "THB", "symbol": "฿" },
    { "id": "TJS", "symbol": "ЅМ" },
    { "id": "TND", "symbol": "د.ت" },
    { "id": "TOP", "symbol": "T$" },
    { "id": "TRY", "symbol": "₺" },
    { "id": "TTD", "symbol": "$" },
    { "id": "TWD", "symbol": "$" },
    { "id": "TZS", "symbol": "Sh" },
    { "id": "UAH", "symbol": "₴" },
    { "id": "UGX", "symbol": "Sh" },
    { "id": "USD", "symbol": "$" },
    { "id": "VND", "symbol": "₫" },
    { "id": "VUV", "symbol": "Vt" },
    { "id": "WST", "symbol": "T" },
    { "id": "XAF", "symbol": "Fr" },
    { "id": "XCD", "symbol": "$" },
    { "id": "XOF", "symbol": "Fr" },
    { "id": "XPF", "symbol": "Fr" },
    { "id": "YER", "symbol": "﷼" },
    { "id": "ZAR", "symbol": "R" }];

var ValueFormatPipe = /** @class */ (function () {
    function ValueFormatPipe() {
    }
    ValueFormatPipe.prototype.transform = function (value, type, currency) {
        var valueTypeStr = '';
        var baseSymbol;
        if (typeof type == 'string') {
            valueTypeStr = type;
        }
        if (currency) {
            var found = find(currencies, function (x) {
                return x && x.id && x.id == currency ? x : undefined;
            });
            if (found)
                baseSymbol = found.symbol;
            else
                baseSymbol = currency;
        }
        else
            baseSymbol = '';
        var digits = 2;
        if (valueTypeStr) {
            switch (valueTypeStr) {
                default:
                case 'number':
                    type = NRValueFormats.number;
                    break;
                case 'bool':
                    type = NRValueFormats.boolean;
                    break;
                case 'dateTime':
                    type = NRValueFormats.dateTime;
                    break;
                case 'date':
                    type = NRValueFormats.date;
                    break;
                case 'decimal':
                    type = NRValueFormats.decimal;
                    break;
                case 'commaInt':
                    type = NRValueFormats.commaInt;
                    break;
            }
        }
        if (value == undefined && type != NRValueFormats.boolean) {
            return '';
        }
        switch (type) {
            default:
            case NRValueFormats.default:
            case NRValueFormats.percent:
            case NRValueFormats.commaInt:
            case NRValueFormats.decimal:
            case NRValueFormats.number:
                switch (type) {
                    case NRValueFormats.percent:
                        baseSymbol = ' %';
                        break;
                    case NRValueFormats.decimal:
                        digits = 3;
                        break;
                    case NRValueFormats.number:
                        digits = 2;
                        break;
                    default:
                    case NRValueFormats.commaInt:
                        digits = 0;
                        break;
                }
                return value
                    .toFixed(digits)
                    .replace('.', ',')
                    .replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1.') + ' ' + baseSymbol;
            case NRValueFormats.dateTime:
                return format(value, 'dd/MM/yyyy HH:mm:ss');
            case NRValueFormats.date:
                return format(value, 'dd/MM/yyyy');
            case NRValueFormats.boolean:
                return value ? 'Yes' : 'No';
        }
    };
    ValueFormatPipe = __decorate([
        Pipe({ name: 'valueFormat' })
    ], ValueFormatPipe);
    return ValueFormatPipe;
}());

var NrGridModule = /** @class */ (function () {
    function NrGridModule() {
    }
    NrGridModule = __decorate([
        NgModule({
            declarations: [NRGridComponent, ValueFormatPipe],
            imports: [
                NgbModule,
                CommonModule,
                FormsModule,
                NrSelectModule
            ],
            exports: [NRGridComponent, ValueFormatPipe]
        })
    ], NrGridModule);
    return NrGridModule;
}());

var NRGridOptions = /** @class */ (function () {
    function NRGridOptions() {
    }
    return NRGridOptions;
}());

var NRDataSource = /** @class */ (function () {
    function NRDataSource() {
    }
    return NRDataSource;
}());

var NRCellLink = /** @class */ (function () {
    function NRCellLink() {
    }
    return NRCellLink;
}());

var NRGridColumn = /** @class */ (function () {
    function NRGridColumn(init) {
        Object.assign(this, init);
    }
    return NRGridColumn;
}());

var NRRowClickAction = /** @class */ (function () {
    function NRRowClickAction() {
    }
    return NRRowClickAction;
}());

/*
 * Public API Surface of nr-grid
 */

/**
 * Generated bundle index. Do not edit.
 */

export { FilterType, NRCellLink, NRDataSource, NRGridColumn, NRGridColumnType, NRGridComponent, NRGridOptions, NRRowClickAction, NRValueFormats, NrGridModule, NrGridService, ValueFormatPipe, currencies };
//# sourceMappingURL=nr-grid.js.map