data-table.min.js (5855B)
1 /* 2 * data-table 1.0.0 3 * (c) 2021 Asher Morgan (MIT) 4 * https://github.com/ashermorgan/data-table 5 */ 6 let DataTable=function(e,t){"use strict";let o=[];Object.defineProperty(this,"body",{get:function(){return o}});let r=null;Object.defineProperty(this,"bodyClasses",{get:function(){return r}});let l={};Object.defineProperty(this,"bodyEventHandlers",{get:function(){return l}});let i=!1;Object.defineProperty(this,"dataIsHTML",{get:function(){return i},set:function(e){i=e,this.render()}});let n=[];Object.defineProperty(this,"headers",{get:function(){return n}});let s=null;Object.defineProperty(this,"headerClasses",{get:function(){return s}});let d={};Object.defineProperty(this,"headerEventHandlers",{get:function(){return d}});let a={up:'<svg viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="data-table-up"><polyline points="18 16 12 8 6 16 18 16"></polyline></svg>',down:'<svg viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="data-table-down"><polyline points="18 8 12 16 6 8 18 8"></polyline></svg>',updown:'<svg viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="data-table-updown"><polyline points="15 10 12 6 9 10 15 10"></polyline><polyline points="15 14 12 18 9 14 15 14"></polyline></svg>'};Object.defineProperty(this,"downIcon",{get:function(){return a.down},set:function(e){a.down=e,this.render()}}),Object.defineProperty(this,"upIcon",{get:function(){return a.up},set:function(e){a.up=e,this.render()}}),Object.defineProperty(this,"updownIcon",{get:function(){return a.updown},set:function(e){a.updown=e,this.render()}});let u="";Object.defineProperty(this,"searchQuery",{get:function(){return u}});let c=null;Object.defineProperty(this,"selector",{get:function(){return c}});let h=!1;Object.defineProperty(this,"sortable",{get:function(){return h},set:function(e){h=e,this.render()}});let f=null;Object.defineProperty(this,"sortAscending",{get:function(){return f}});let b=null;Object.defineProperty(this,"sortIndex",{get:function(){return b}});let p={headers:[],body:[]},y="basic-light";Object.defineProperty(this,"theme",{get:function(){return y},set:function(e){y=e,this.render()}});let v=!0;Object.defineProperty(this,"unsortable",{get:function(){return v},set:function(e){v=e,this.render()}});var g,w;let j=function(){p.headers=[];for(let e=0;e<n.length;e++)p.headers.push({value:n[e],class:s?s[e]:""});p.body=[];for(let n=0;n<o.length;n++){let t={visible:!0,columns:[],row:n};for(let e=0;e<o[n].length;e++)t.columns.push({value:o[n][e],class:r?r[n][e]:""});p.body.push(t)}C(u);var e=b,t=f;b=null,f=null,O(e,t)};this.render=function(){let e=document.querySelector(this.selector);e.classList.add("data-table");let t=`<table class="${y?y.toLowerCase():""}">`;if(0<p.headers.length){t+="<thead><tr>";for(let e=0;e<p.headers.length;e++)t+=`<th class="${p.headers[e].class}">${i?p.headers[e].value:m(p.headers[e].value)}`,h&&(b!==e?t+=`<button>${a.updown}</button>`:b===e&&!0===f?t+=`<button>${a.up}</button>`:b===e&&!1===f&&(t+=`<button>${a.down}</button>`)),t+="</th>";t+="</thead></tr>"}if(0<p.body.length){t+="<tbody>";for(var n of p.body){t+=`<tr${n.visible?"":' hidden=""'}>`;for(var o of n.columns)t+=`<td class="${o.class}">${i?o.value:m(o.value)}</td>`;t+="</tr>"}t+="</tbody>"}t+="</table>",e.innerHTML=t;let r=document.querySelectorAll(`${this.selector} thead th`),s=document.querySelectorAll(`${this.selector} tbody td`);if(h)for(let e=0;e<r.length;e++)r[e].addEventListener("click",()=>{b!==e?this.sort(e,!0):!0===f?this.sort(e,!1):v?this.sort(e,null):this.sort(e,!0)});for(let o in l){let e=-1;for(let n=0;n<p.body.length;n++)for(let t=0;t<p.body[n].columns.length;t++)e++,s[e].addEventListener(o,e=>{l[o](p.body[n].row,t,e)})}for(let n in d)for(let t=0;t<p.headers.length;t++)r[t].addEventListener(n,e=>{d[n](t,e)})};let m=function(e){return e=(e=(e=(e=(e=e.replace(/&/g,"&")).replace(/</g,"<")).replace(/>/g,">")).replace(/\n/g,"<br>")).replace(/\t/g," ")},C=function(e){for(var t of p.body){t.visible=!1;for(var n of t.columns)if(n.value.toLowerCase().includes(e.toLowerCase())){t.visible=!0;break}}u=e};this.search=function(e){C(e),this.render()},this.setData=function(e){e&&(void 0!==e.body&&(o=e.body),void 0!==e.bodyClasses&&(r=e.bodyClasses),void 0!==e.headers&&(n=e.headers),void 0!==e.headerClasses&&(s=e.headerClasses)),j(),this.render()};let O=function(n,e){b===n&&f===e||(n<0||n>=p.headers.length||null===e?(p.body.sort((e,t)=>e.row<t.row?-1:1),e=n=null):b===n&&f!==e?p.body.reverse():(p.body.sort((e,t)=>e.columns[n].value===t.columns[n].value?0:e.columns[n].value<t.columns[n].value?-1:1),e||p.body.reverse())),b=n,f=e};this.sort=function(e,t){O(e,t),this.render()},g=this,w=t,c=e,w&&(void 0!==w.body&&(o=w.body),void 0!==w.bodyClasses&&(r=w.bodyClasses),void 0!==w.bodyEventHandlers&&(l=w.bodyEventHandlers),void 0!==w.dataIsHTML&&(i=w.dataIsHTML),void 0!==w.downIcon&&(a.down=w.downIcon),void 0!==w.headers&&(n=w.headers),void 0!==w.headerClasses&&(s=w.headerClasses),void 0!==w.headerEventHandlers&&(d=w.headerEventHandlers),void 0!==w.sortable&&(h=w.sortable),void 0!==w.searchQuery&&(u=w.searchQuery),void 0!==w.sortAscending&&(f=w.sortAscending),void 0!==w.sortIndex&&(b=w.sortIndex),void 0!==w.theme&&(y=w.theme),void 0!==w.unsortable&&(v=w.unsortable),void 0!==w.upIcon&&(a.up=w.upIcon),void 0!==w.updownIcon&&(a.updown=w.updownIcon)),j(),g.render()};Object.defineProperty(DataTable,"version",{get:function(){return"1.0.0"}}),"function"==typeof define&&define.amd?define(function(){return root.DataTable=DataTable,root.DataTable}):"object"==typeof exports&&"undefined"!=typeof module?module.exports=DataTable:this.DataTable=DataTable;