data-table-kit/bundles/data-table-kit.umd.min.js

A simple datatable/datagrid for Angular projects

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common")):"function"==typeof define&&define.amd?define("data-table-kit",["exports","@angular/core","@angular/common"],e):e((t=t||self)["data-table-kit"]={},t.ng.core,t.ng.common)}(this,function(t,e,a){"use strict";var n=function(){function t(t,e){this._columnTemplate=t,this._viewContainerRef=e,this.align="left",this.verticalAlign="top",this.groupColumns=0}return Object.defineProperty(t.prototype,"header",{get:function(){return this._header},set:function(t){Array.isArray(t)?this._header=t:this._header=[t]},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"sort",{get:function(){return this._sortfields},set:function(t){Array.isArray(t)?this._sortfields=t:this._sortfields=[t]},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"dtcStyle",{get:function(){var t={"text-align":this.align,"vertical-align":this.verticalAlign};return null!=this.columnWidth&&this.columnWidth.length>0&&(t.width=this.columnWidth),t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"ColumnTemplate",{get:function(){return this._columnTemplate},enumerable:!0,configurable:!0}),t.decorators=[{type:e.Directive,args:[{selector:"[data-table-column]"}]}],t.ctorParameters=function(){return[{type:e.TemplateRef},{type:e.ViewContainerRef}]},t.propDecorators={align:[{type:e.Input,args:["data-table-columnAlign"]}],verticalAlign:[{type:e.Input,args:["data-table-columnVerticalAlign"]}],header:[{type:e.Input,args:["data-table-columnHeader"]}],sort:[{type:e.Input,args:["data-table-columnSort"]}],groupColumns:[{type:e.Input,args:["data-table-columnGroupColumns"]}],groupHeader:[{type:e.Input,args:["data-table-columnGroupHeader"]}],sortFieldName:[{type:e.Input,args:["data-table-columnSortFieldName"]}],columnWidth:[{type:e.Input,args:["data-table-columnWidth"]}]},t}(),i=function(){function t(t,e){this._childTemplate=t,this._viewContainerRef=e}return Object.defineProperty(t.prototype,"ChildTemplate",{get:function(){return this._childTemplate},enumerable:!0,configurable:!0}),t.decorators=[{type:e.Directive,args:[{selector:"[data-table-child]"}]}],t.ctorParameters=function(){return[{type:e.TemplateRef},{type:e.ViewContainerRef}]},t}(),l=function(){function t(t){this.doc=t,this.datacount=0,this.allowResize=!0,this.pagesize=0,this.collapseChildren=null,this.multiSelect=!1,this.bufferedPageNoChanged=new e.EventEmitter,this.sortOrderChanged=new e.EventEmitter,this.selectionChanged=new e.EventEmitter,this.editStarted=new e.EventEmitter,this.editCompleted=new e.EventEmitter,this.editCancelled=new e.EventEmitter,this.pageno=0,this.columnCount=0,this.resizeInfo=null,this.haschildren=!1,this.sortInfo=[],this.gridid="g"+this.uuidv4(),this.selectedRows=[],this.editingRow=-1,this.gridStyle={thSep:{padding:"0px","border-top":"1px solid lightgray","border-bottom":"1px solid lightgray","border-right":"1px solid lightgray",width:"4px"},thSepGroup:{padding:"0px","border-top":"1px solid lightgray","border-bottom":"0px solid lightgray","border-right":"1px solid lightgray",width:"4px"},tdSep:{width:"1px",padding:"0px"},th:{"vertical-align":"bottom","border-top":"1px solid lightgray","border-bottom":"1px solid lightgray"},thGroup:{"text-align":"center","vertical-align":"bottom","border-top":"1px solid lightgray","border-bottom":"0px solid lightgray"},thGroupLabel:{"text-align":"center","vertical-align":"bottom","border-top":"1px solid lightgray","border-bottom":"1px solid lightgray"},td:{}},this.gridClass={thSep:"",tdSep:"",th:"data-table-col-header",td:"data-table-col-data"}}return t.prototype.ngAfterContentInit=function(){this.haschildren=null!=this.Children&&this.Children.length>0,this.columnCount=null==this.Columns?0:2*this.Columns.length-1,this.setupColumns()},t.prototype.ngAfterViewInit=function(){if(null!=this.TableHeader&&null!=this.TableHeader.nativeElement&&null!=this.TableHeader.nativeElement.children)for(var t=this.TableHeader.nativeElement.children,e=0;e<t.length-1;e++)null!=t[e]&&(t[e].style.width=t[e].clientWidth+"px")},t.prototype.ngOnChanges=function(t){t.allowResize&&(this.allowResize?this.gridStyle.thSep.cursor="col-resize":delete this.gridStyle.thSep.cursor),(t.tabledata||t.pagesize||t.datacount)&&(this.analyzeTableData(),this.updatePageData()),t.tabledata&&null!=this._viewContainerRef&&this._viewContainerRef.createEmbeddedView(this._columnTemplate)},t.prototype.headers=function(t){return t.headers},t.prototype.setupColumns=function(){var t=[],e=!1;if(null!=this.Columns){var a=this.Columns.toArray(),n=a.filter(function(t){return null==t.columnWidth||""==t.columnWidth});if(n.length>1){Math.round(100/n.length);n.splice(n.length-1,1)}for(var i=0;i<a.length;){var l={};l.colStyle=this.gridStyle.thGroup,null!=a[i]&&(null!=a[i].groupHeader&&(e=!0,l.headers=a[i].groupHeader,Array.isArray(l.headers)||(l.headers=[l.headers])),null!=a[i].groupColumns&&a[i].groupColumns>1&&(e=!0,l.colspan=2*a[i].groupColumns-1,i=i+a[i].groupColumns-1),e&&(l.colStyle=this.gridStyle.thGroupLabel)),t.push(l),i+=1}}e?(this.groups=t,this.gridStyle.th["border-top"]="0px solid lightgray",this.gridStyle.thSep["border-top"]="0px solid lightgray"):this.groups=null},t.prototype.analyzeTableData=function(){var t=0;if(0!=this.datacount?t=this.datacount:null!=this.tabledata&&(t=this.tabledata.length),this.fadein=null,this.totalpages=[],0!=this.pagesize&&t>this.pagesize){var e=Math.ceil(t/this.pagesize);this.totalpages=[];for(var a=0;a<e;a++)this.totalpages.push(a+1)}},t.prototype.updatePageData=function(){if(0==this.pagesize||null==this.tabledata||this.tabledata.length<=this.pagesize)this.pagedata=this.tabledata,this.fadein=null;else{var t=this.pageno*this.pagesize,e=t+1*this.pagesize;if(null!=this.bufferedpageno&&null!=this.bufferedpagecount){var a=this.bufferedpageno*this.bufferedpagecount*this.pagesize,n=a+this.tabledata.length-1;if(t<a||t>n){var i=Math.floor(t/(this.bufferedpagecount*this.pagesize));return void this.bufferedPageNoChanged.emit({newPageNo:i,currentPageNo:this.bufferedpageno})}t-=a,e-=a}this.pagedata=this.tabledata.slice(t,e),this.pageno>0&&(this.fadein="data-table-fade-in")}},t.prototype.setFirstPage=function(){if(this.pageno>0){this.setPage(0)}},t.prototype.setPrevPage=function(){if(this.pageno>0){var t=this.pageno-1;this.setPage(t)}},t.prototype.setNextPage=function(){if(this.pageno<this.totalpages.length-1){var t=this.pageno+1;this.setPage(t)}},t.prototype.setLastPage=function(){if(this.pageno<this.totalpages.length-1){var t=this.totalpages.length-1;this.setPage(t)}},t.prototype.gotoPage=function(t){if(""!==t){var e=parseInt(t);e>0&&e<=this.totalpages.length&&(e--,this.setPage(e))}},t.prototype.setPage=function(t){this.pageno!=t&&(this.pageno=t,this.updatePageData())},t.prototype.resizeColumn=function(t){if(this.allowResize&&null!=this.resizeInfo&&null!=t)if(0==t.buttons)this.resizeInfo=null;else{var e=this.resizeInfo.startX-t.pageX,a=this.resizeInfo.element.clientWidth-(e+2);if(a>0){if(this.resizeInfo.fixColumns>0){for(var n=0;n<this.resizeInfo.fixColumns;n++)n%2==0&&this.resizeInfo.children.length>n&&(this.resizeInfo.children[n].style.width=this.resizeInfo.children[n].clientWidth+"px");this.resizeInfo.fixColumns=0}this.resizeInfo.startX=t.pageX,this.resizeInfo.element.style.width=a+"px"}}},t.prototype.resizeColumnEnd=function(t){this.allowResize&&(this.resizeInfo=null)},t.prototype.resizeColumnStart=function(t){if(this.allowResize&&null!=t&&null!=t.target){var e=t.target,a=e.parentElement;if(null!=a){var n=a.children;if(null!=n&&n.length>0){for(var i=-1,l=0;l<n.length;l++)if(n[l]==e){i=l;break}i>0&&(this.resizeInfo={children:n,startX:t.pageX,element:n[i-1],fixColumns:i-2})}}}},t.prototype.toggleChildren=function(t,e){if(null!=this.doc){var a=this.gridid+"_"+e+"_inner",n=t.target,i=this.doc.querySelector("#"+a);if(null!=i){var l="-"==n.getAttribute("data-toggle");this.dataTableCollapseChild(n,i,l)}}},t.prototype.dataTableCollapseChild=function(t,e,a){a?(null!=e&&e.classList.add("data-table-collapse"),null!=t&&(t.setAttribute("data-toggle","+"),t.classList.remove("data-table-minus"),t.classList.add("data-table-plus"))):(null!=e&&e.classList.remove("data-table-collapse"),null!=t&&(t.classList.remove("data-table-plus"),t.classList.add("data-table-minus"),t.setAttribute("data-toggle","-")))},t.prototype.dataTableCollapseChildren=function(t,e){if(null!=this.doc){for(var a=this.doc.querySelectorAll(".data-table-toggler-"+this.gridid),n=this.doc.querySelectorAll(".data-table-children-"+this.gridid),i=Math.min(a.length,n.length),l=0;l<i;l++)this.dataTableCollapseChild(a[l],n[l],e);this.collapseChildren=e}},t.prototype.uuidv4=function(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,function(t){var e=16*Math.random()|0;return("x"==t?e:3&e|8).toString(16)})},t.prototype.clearSort=function(){for(var t=0;t<this.sortInfo.length;t++){var e=this.sortInfo[t];null!=e&&e.sortButton.classList.remove("sorted")}this.sortInfo=[]},t.prototype.sortColumn=function(t,e,a){if(null!=e&&0!=e.length){t.target;t.ctrlKey||this.clearSort();for(var n=0;n<e.length;n++){for(var i=-1,l=!1,r=0;r<this.sortInfo.length;r++){var o=this.sortInfo[r];if(null!=o&&o.field==e[n]){o.sortButton.classList.remove("sorted"),i=r,o.aord==a&&(l=!0);break}}-1!=i&&this.sortInfo.splice(i,1),l||(this.sortInfo.push({field:e[n],sortButton:t.target,aord:a}),t.target.classList.add("sorted"))}if(null==this.sortOrderChanged.observers||0==this.sortOrderChanged.observers.length){var s=[];this.sortInfo.forEach(function(t){null!=t&&s.push(t.field+":"+t.aord)});var d=s.join(",");this.tabledata=this.quickSort(this.tabledata,d),this.analyzeTableData(),this.updatePageData()}else{var p=this.sortInfo.map(function(t){return{field:t.field,mode:t.aord}});this.sortOrderChanged.emit(p)}}},t.prototype.quickSort=function(t,e){var a=this;if(null==t||null==e||0==e.length)return t;var n=e.split(",").map(function(t){return t.trim().split(":")}).map(function(t){if(null==t||0==t.length)return null;var e=t[0],a=t.length>1?t[1]:"a";return"a"!=a&&"A"!=a&&"d"!=a&&"D"!=a&&(a="a"),{field:e,mode:a.toLowerCase()}}).filter(function(t){return null!=t});return t.sort(function(t,e){var i,l;if(null==e||null==t)return 1;try{for(var r=function(t){var e="function"==typeof Symbol&&t[Symbol.iterator],a=0;return e?e.call(t):{next:function(){return t&&a>=t.length&&(t=void 0),{value:t&&t[a++],done:!t}}}}(n),o=r.next();!o.done;o=r.next()){var s=o.value,d="d"==s.mode?-1:1,p=a.propertyValue(t,s.field),g=a.propertyValue(e,s.field);if(p<g)return-1*d;if(p>g)return 1*d}}catch(u){i={error:u}}finally{try{o&&!o.done&&(l=r["return"])&&l.call(r)}finally{if(i)throw i.error}}return 0})},t.prototype.propertyValue=function(t,e){for(;Array.isArray(t);)t=t.length>0?t[0]:null;if(null==t)return null;var a=e=e.split(".").map(function(t){return t.trim()}).filter(function(t){return t.length>0}).join("."),n=null,i=e.indexOf(".");0==i?a=e.substr(1):i>0&&(a=e.substr(0,i),n=e.substr(i+1));var l=t[a];return null!=n?this.propertyValue(l,n):l},t.prototype.clearSelections=function(){this.selectedRows=[];var t="#grid_"+this.gridid+">tbody>tr";this.doc.querySelectorAll(t).forEach(function(t){null!=t&&null!=t.classList&&t.classList.remove("data-table-selected")})},t.prototype.clickRow=function(t,e){var a=e+this.pageno*this.pagesize;this.editingRow!=a&&this.clearEdits();var n=!0;this.multiSelect&&null!=t&&t.ctrlKey&&(n=!1),n&&this.clearSelections();var i=this.selectedRows.indexOf(a);-1!=i?this.selectedRows.splice(i,1):this.selectedRows.push(a);var l={event:t,rowIdx:a,selectedRows:this.selectedRows.map(function(t){return t}),bufferOffset:this.bufferedpageno*this.bufferedpagecount*this.pagesize},r=t.currentTarget;null!=r&&r.classList.toggle("data-table-selected"),this.selectionChanged.emit(l)},t.prototype.clearEdits=function(){this.editingRow=-1},t.prototype.dblclickRow=function(t,e){this.editingRow=e},t.decorators=[{type:e.Component,args:[{selector:"data-table",template:'<ng-template #columnTemplate>\r\n    <tr>\r\n        <ng-container #rowColumns></ng-container>\r\n    </tr>\r\n</ng-template>\r\n<table [ngClass]="\'data-table \'+datatableClass" style="width: 100%;" [id]="\'grid_\'+gridid">\r\n    <thead>\r\n        <tr *ngIf="groups!=null&&groups.length>0" class="header">\r\n            <th *ngIf="haschildren&&collapseChildren!=null" [className]="gridClass.th" [ngStyle]="gridStyle.thGroup">\r\n            </th>\r\n            <ng-template ngFor let-colIndex="index" let-group [ngForOf]="groups">\r\n                <th *ngIf="colIndex>0" [className]="gridClass.thSep" [ngStyle]="gridStyle.thSepGroup"></th>\r\n                <th [className]="gridClass.th" [ngStyle]="group.colStyle" [attr.colspan]="group.colspan">\r\n                    <ng-template ngFor let-line [ngForOf]="group.headers">\r\n                        <div>{{line}}</div>\r\n                    </ng-template>\r\n                </th>\r\n            </ng-template>\r\n        </tr>\r\n        <tr #tableHeader class="header" (mousemove)="allowResize?resizeColumn($event):null">\r\n            <th *ngIf="haschildren&&collapseChildren!=null" [className]="gridClass.th" [ngStyle]="gridStyle.th">\r\n                <div class="data-table-plus" style="font-size: smaller;" (click)="dataTableCollapseChildren($event, false)">&nbsp;</div>\r\n                <div class="data-table-minus" style="font-size: smaller;" (click)="dataTableCollapseChildren($event, true)">&nbsp;</div>\r\n            </th>\r\n            <ng-template ngFor let-colIndex="index" let-col [ngForOf]="Columns">\r\n                <th *ngIf="colIndex>0" [className]="gridClass.thSep" [ngStyle]="gridStyle.thSep" (mousedown)="(allowResize)?resizeColumnStart($event):null"\r\n                    (mouseup)="(allowResize)?resizeColumnEnd($event):null"></th>\r\n                <th [className]="gridClass.th" [ngStyle]="gridStyle.th">\r\n                    <div class="data-table-col-header-text">\r\n                        <div class="data-table-col-header-middle">\r\n                            <ng-template ngFor let-line [ngForOf]="col.header">\r\n                                <div>{{line}}</div>\r\n                            </ng-template>\r\n                        </div>\r\n                        <div *ngIf="col.sort!=null && col.sort.length>0" class="data-table-col-header-middle" style="margin-left:5px;">\r\n                            <div class="data-table-up" (click)="sortColumn($event, col.sort,\'a\')">&nbsp;</div>\r\n                            <div class="data-table-down" (click)="sortColumn($event, col.sort,\'d\')">&nbsp;</div>\r\n                        </div>\r\n                    </div>\r\n                </th>\r\n            </ng-template>\r\n        </tr>\r\n    </thead>\r\n    <tbody>\r\n        <ng-container #gridBody></ng-container>\r\n        <ng-container *ngFor="let row of pagedata; let rowidx=index;">\r\n            <tr class="data" (click)="clickRow($event, rowidx)" (dblclick)="dblclickRow($event, rowidx)">\r\n                <td *ngIf="haschildren&&collapseChildren!=null">\r\n                    <div [attr.data-toggle]="collapseChildren?\'+\':\'-\'" (click)="toggleChildren($event, rowidx)" [ngClass]="\'data-table-toggler-\'+gridid+\' data-table-\'+(collapseChildren?\'plus\':\'minus\')">&nbsp;</div>\r\n                </td>\r\n                <ng-template ngFor let-colIndex="index" let-col [ngForOf]="Columns">\r\n                    <td *ngIf="colIndex>0" [className]="gridClass.tdSep" [ngStyle]="gridStyle.tdSep"></td>\r\n                    <td [className]="gridClass.td" [ngStyle]="col.dtcStyle">\r\n                        <data-table-cell [data]="row" [column]="col" [fadein]="fadein" [editing]="rowidx==editingRow" [rowIndex]="rowidx + (pageno * pagesize)"></data-table-cell>\r\n                    </td>\r\n                </ng-template>\r\n            </tr>\r\n            <tr *ngIf="haschildren">\r\n                <td *ngIf="collapseChildren!=null" style="border: 0px;padding:0px;"></td>\r\n                <td [attr.colspan]="columnCount" style="border: 0px; padding: 0px;">\r\n                    <div [id]="gridid+\'_\'+rowidx+\'_inner\'" [ngClass]="\'data-table-children-\'+gridid+(collapseChildren==\'true\'||collapseChildren==true?\' data-table-collapse\':\' \')">\r\n                        <div *ngFor="let child of Children">\r\n                            <data-table-cell [data]="row" [child]="child" [rowIndex]="rowidx + (pageno * pagesize)"></data-table-cell>\r\n                        </div>\r\n                    </div>\r\n                </td>\r\n            </tr>\r\n        </ng-container>\r\n    </tbody>\r\n</table>\r\n<div *ngIf="totalpages!=null&&totalpages.length>0">\r\n    <div>\r\n        <ul class="data-table-pages">\r\n            <li [ngClass]="(pageno==0?\'disabled\':\'\')+\' data-table-hand\'"><a (click)="setFirstPage()">First</a></li>\r\n            <li [ngClass]="(pageno==0?\'disabled\':\'\')+\' data-table-hand\'"><a (click)="setPrevPage()"><span aria-hidden="true">&laquo;</span> Previous</a></li>\r\n            <li><a><input type="number" class="data-table-input-pageno" min="1" [max]="totalpages.length" [value]="pageno+1"\r\n                (keyup.enter)="gotoPage(pagegoto.value)" #pagegoto> / {{totalpages.length}}</a></li>\r\n            <li [ngClass]="(pageno < totalpages.length - 1?\'\':\'disabled\')+\' data-table-hand\'"><a (click)="setNextPage()">Next <span aria-hidden="true">&raquo;</span></a></li>\r\n            <li [ngClass]="(pageno < totalpages.length - 1?\'\':\'disabled\')+\' data-table-hand\'"><a (click)="setLastPage()">Last</a></li>\r\n        </ul>\r\n    </div>\r\n</div>\r\n',changeDetection:e.ChangeDetectionStrategy.OnPush,styles:['.data-table{border:0;border-spacing:0}.data-table th{padding-top:10px;padding-bottom:10px}.data-table>tbody>tr:hover{background-color:#f5f5f5}.data-table-collapse{display:none}.data-table-collapse.in{display:block}.data-table .header{color:#000;font-size:smaller;font-weight:700}.data-table .data{color:#000;font-size:smaller;font-weight:400}.data-table .disabled{color:#777;opacity:.8}.data-table-hand{cursor:pointer}.data-table-col-header{display:table-cell;padding:"3px";text-align:center;font-size:14px;line-height:normal}.data-table-col-header-text:before{content:"";display:inline-block;vertical-align:middle}.data-table-col-header-middle{display:inline-block;vertical-align:middle}.data-table-col-data{display:table-cell;padding:"3px"}.data-table-input-pageno{background-color:transparent;border:0!important;border-top:0!important;border-bottom:0!important;border-left:0!important;border-right:0!important;width:auto!important;height:auto!important;text-align:right;font-family:inherit;font-size:inherit;font-weight:inherit;padding:0}.data-table-input-pageno:focus{outline:0!important;border-bottom:0!important}.data-table-input-pageno::-webkit-inner-spin-button,.data-table-input-pageno::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.data-table-minus{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAIAAADZrBkAAAAABnRSTlMA/wD/AP83WBt9AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAH0lEQVQokWP8//8/A+mAiQw9o9qoqI2+gHE0lQxJbQDl0gYZ+lGHlgAAAABJRU5ErkJggg==);background-origin:content-box;background-position:center;background-repeat:no-repeat;background-size:contain;cursor:pointer;margin-right:5px;padding:2px;width:10px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.data-table-plus{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAIAAADZrBkAAAAABnRSTlMA/wD/AP83WBt9AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAKUlEQVQokWP8//8/AzbAyMjIwMCAS5YJqyhBMKqNWtroCxhHU8mQ1AYA6OYMGQghg24AAAAASUVORK5CYII=);background-origin:content-box;background-position:center;background-repeat:no-repeat;background-size:contain;cursor:pointer;margin-right:5px;padding:2px;width:10px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.data-table-up{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAOCAIAAACtuNvgAAAABnRSTlMA/wD/AP83WBt9AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAWUlEQVQokZ2SUQ7AIAhDV+L9r9z9LQTbxsmX0D40CEg+/2PJKoDvLPtWZvZUY9K0FyvLTionZLIOmWlzH0AySPqSDughZcaRM3cPm5PsvrBow4a7nRTLdRIvsT4qGLm5+W8AAAAASUVORK5CYII=);background-origin:content-box;background-position:center;background-repeat:no-repeat;background-size:contain;cursor:pointer;font-size:6px;margin:0;padding:0;width:10px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.data-table-down{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAOCAIAAACtuNvgAAAABnRSTlMA/wD/AP83WBt9AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAYklEQVQokZ2S2w7AMAhCwez/f5k9dFkWvDRr3xSPkhRKwv8XBwyACwDJVcyXv2M0rSNf5inzRCaNqTEjMzO5kjRIXFq9sjcS883OWuTWloF990Ca5CkpydwswmVD5SKeRfkGMzBE5GopGhMAAAAASUVORK5CYII=);background-origin:content-box;background-position:center;background-repeat:no-repeat;background-size:contain;cursor:pointer;font-size:6px;margin:0;padding:0;width:10px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.data-table-up.sorted{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAOCAIAAACtuNvgAAAABnRSTlMA/wD/AP83WBt9AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAZ0lEQVQokZ2SUQ6AMAhDB/EKetVdYV6VS9QPE2PWQqZ8QduXsAUD0L7XJtXTjqfvCA54zfCoMRli0Ws7szwzatIXmSnmGdMR8g/vsI22S0buNi+ZMTxqTIZY9LckGbY6wv7dpHjbSl0wcCvzYSLAvwAAAABJRU5ErkJggg==)!important}.data-table-down.sorted{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAOCAIAAACtuNvgAAAABnRSTlMA/wD/AP83WBt9AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAb0lEQVQokZ2S0Q2AMAhED+IKumpX0FW7BH6QNASPquUP7h6FUDEz/A9dYABsAC45PGnWJ9ZokxN71CpyMHzIJFdFslsy0UZKpxpWyjTr4gegMg1/RmPykUHc7ZWMBq2ECZOxinwWyQGSiTaSta98A6LMNe+ezG6VAAAAAElFTkSuQmCC)!important}.data-table-pages{display:inline-block;height:40px;margin:20px 0;padding:0;-webkit-padding-start:0;padding-inline-start:0;-webkit-padding-before:0;padding-block-start:0}.data-table-pages ul{display:inline-block;margin-left:0;margin-bottom:0;border-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.1)}.data-table-pages li{display:inline}.data-table-pages a{float:left;padding:0 14px;line-height:34px;text-decoration:none;border:1px solid #ddd;border-left-width:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.data-table-pages a:hover{background-color:#f5f5f5}.data-table-pages .active a{background-color:#f5f5f5;color:#999;cursor:default}.data-table-pages .disabled a,.data-table-pages .disabled a:hover,.data-table-pages .disabled span{color:#999;background-color:transparent;cursor:default}.data-table-pages li:first-child a{border-left-width:1px;border-radius:3px 0 0 3px}.data-table-pages li:last-child a{border-radius:0 3px 3px 0}.data-table-fade-in{-webkit-animation:1s linear forwards fadein;animation:1s linear forwards fadein}@-webkit-keyframes fadein{from{opacity:0}to{opacity:1}}@keyframes fadein{from{opacity:0}to{opacity:1}}.data-table-selected{background-color:#add8e6!important}']}]}],t.ctorParameters=function(){return[{type:Document,decorators:[{type:e.Inject,args:[a.DOCUMENT]}]}]},t.propDecorators={_viewContainerRef:[{type:e.ViewChild,args:["gridBody",{read:e.ViewContainerRef,"static":!1}]}],_columnTemplate:[{type:e.ViewChild,args:["columnTemplate",{"static":!1}]}],TableHeader:[{type:e.ViewChild,args:["tableHeader",{"static":!1}]}],Columns:[{type:e.ContentChildren,args:[n]}],Children:[{type:e.ContentChildren,args:[i]}],datatableClass:[{type:e.Input,args:["data-table-class"]}],tabledata:[{type:e.Input}],datacount:[{type:e.Input}],bufferedpageno:[{type:e.Input,args:["buffered-page-no"]}],bufferedpagecount:[{type:e.Input,args:["buffered-page-count"]}],allowResize:[{type:e.Input}],pagesize:[{type:e.Input}],collapseChildren:[{type:e.Input,args:["collapse-children"]}],multiSelect:[{type:e.Input,args:["allow-multiselect"]}],bufferedPageNoChanged:[{type:e.Output}],sortOrderChanged:[{type:e.Output}],selectionChanged:[{type:e.Output}],editStarted:[{type:e.Output}],editCompleted:[{type:e.Output}],editCancelled:[{type:e.Output}]},t}(),r=function(){function t(t,e,a){this.data=t,this.editing=e,this.rowIndex=a}return t.prototype.update=function(t){this.editing=t},t}(),o=function(){function t(){this.editing=!1,this.rowIndex=-1,this.viewColumn=null}return t.prototype.ngOnChanges=function(t){if(t.data||t.column||t.child){if(null!=this.data&&(null!=this.column&&(this.viewColumn=this._cellContainerRef.createEmbeddedView(this.column.ColumnTemplate,new r(this.data,this.editing,this.rowIndex))),null!=this.child))this._cellContainerRef.createEmbeddedView(this.child.ChildTemplate,new r(this.data,!1,this.rowIndex))}else t.editing&&null!=this.viewColumn&&this.viewColumn.context.update(this.editing)},t.decorators=[{type:e.Component,args:[{selector:"data-table-cell",template:'<div [ngClass]="fadein">\n  <ng-container #gridCell></ng-container>\n</div>\n',styles:[""]}]}],t.propDecorators={data:[{type:e.Input}],fadein:[{type:e.Input}],editing:[{type:e.Input}],rowIndex:[{type:e.Input}],column:[{type:e.Input}],child:[{type:e.Input}],_cellContainerRef:[{type:e.ViewChild,args:["gridCell",{read:e.ViewContainerRef,"static":!0}]}]},t}(),s=function(){function t(){this.floatWidth=0}return t.prototype.ngOnChanges=function(t){t.floatWidth&&(this.styleOuter={"margin-right":"-"+Math.abs(this.floatWidth)+"px","text-align":"left"},this.styleInner={width:Math.abs(this.floatWidth)+"px"})},t.decorators=[{type:e.Component,args:[{selector:"data-table-float",template:'<div *ngIf="floatWidth!=0" [ngStyle]="styleOuter">\n  <div [ngStyle]="styleInner">\n    <ng-content></ng-content>\n  </div>\n</div>\n',styles:[""]}]}],t.propDecorators={floatWidth:[{type:e.Input,args:["width"]}]},t}(),d=function(){function t(){}return t.decorators=[{type:e.NgModule,args:[{declarations:[l,o,s,i,n],imports:[a.CommonModule],exports:[l,s,i,n]}]}],t}();t.DataTableKitModule=d,t.ɵa=l,t.ɵb=n,t.ɵc=r,t.ɵd=i,t.ɵe=o,t.ɵf=s,Object.defineProperty(t,"__esModule",{value:!0})});
//# sourceMappingURL=data-table-kit.umd.min.js.map