Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

vue3-easy-data-table

Package Overview
Dependencies
Maintainers
1
Versions
167
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

vue3-easy-data-table - npm Package Compare versions

Comparing version 1.0.5 to 1.0.6

65

dist/vue3-easy-data-table.es.js

@@ -20,3 +20,3 @@ var __defProp = Object.defineProperty;

var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
import { defineComponent, useCssVars, unref, computed, inject, openBlock, createElementBlock, withModifiers, createElementVNode, normalizeClass, pushScopeId, popScopeId, ref, onMounted, onBeforeUnmount, toDisplayString, Fragment, renderList, useSlots, renderSlot, createCommentVNode, toRefs, provide, watch, createBlock, createTextVNode, createVNode, normalizeProps, mergeProps, createSlots, withCtx } from "vue";
import { defineComponent, useCssVars, unref, computed, inject, openBlock, createElementBlock, withModifiers, createElementVNode, normalizeClass, pushScopeId, popScopeId, ref, onMounted, onBeforeUnmount, toDisplayString, Fragment, renderList, useSlots, renderSlot, createCommentVNode, toRefs, provide, watch, createBlock, createVNode, normalizeProps, mergeProps, createTextVNode, createSlots, withCtx } from "vue";
var MutipleSelectCheckBox_vue_vue_type_style_index_0_scoped_true_lang = "";

@@ -386,19 +386,20 @@ var _export_sfc = (sfc, props) => {

key: 1,
class: "header-text"
class: "header-text__wrapper"
};
const _hoisted_5 = ["colspan"];
const _hoisted_6 = { key: 0 };
const _hoisted_7 = ["onClick"];
const _hoisted_8 = {
const _hoisted_5 = { class: "header-text" };
const _hoisted_6 = ["colspan"];
const _hoisted_7 = { key: 0 };
const _hoisted_8 = ["onClick"];
const _hoisted_9 = {
key: 0,
class: "data-table__message"
};
const _hoisted_9 = {
const _hoisted_10 = {
key: 1,
class: "data-table__message"
};
const _hoisted_10 = { class: "data-table__footer" };
const _hoisted_11 = { class: "footer__rows-per-page" };
const _hoisted_12 = /* @__PURE__ */ createTextVNode(" rows per page: ");
const _hoisted_13 = { class: "footer__items-index" };
const _hoisted_11 = { class: "data-table__footer" };
const _hoisted_12 = { class: "footer__rows-per-page" };
const _hoisted_13 = /* @__PURE__ */ createTextVNode(" rows per page: ");
const _hoisted_14 = { class: "footer__items-index" };
const _sfc_main = /* @__PURE__ */ defineComponent({

@@ -517,9 +518,9 @@ props: {

useCssVars((_ctx) => ({
"3ea4f4b2": unref(borderColor),
"0bd95bba": unref(maxHeightPx),
"16ebe3f0": unref(fontSizePx),
"ab6adece": unref(rowHeightPx),
"87c96152": unref(headerFontColor),
"e005a8d0": __props.headerBackgroundColor,
"0deca3e2": unref(bodyFontColor)
"42330806": unref(borderColor),
"0f676f0e": unref(maxHeightPx),
"3ecdf4f2": unref(fontSizePx),
"aef8f222": unref(rowHeightPx),
"6da52aad": unref(headerFontColor),
"1e62a324": __props.headerBackgroundColor,
"61c15cb8": unref(bodyFontColor)
}));

@@ -779,9 +780,7 @@ const {

}, null, 8, ["status"])) : (openBlock(), createElementBlock("span", _hoisted_4, [
createTextVNode(toDisplayString(header.text) + " ", 1),
header.sortable ? (openBlock(), createElementBlock("span", {
createElementVNode("span", _hoisted_5, toDisplayString(header.text), 1),
header.sortable ? (openBlock(), createBlock(unref(ArrowIcon), {
key: header.sortType ? header.sortType : "none",
class: normalizeClass(["sortType-icon", { "desc": header.sortType === "desc" }])
}, [
createVNode(unref(ArrowIcon), { class: "sortType-icon__svg" })
], 2)) : createCommentVNode("", true)
}, null, 8, ["class"])) : createCommentVNode("", true)
]))

@@ -798,5 +797,5 @@ ], 10, _hoisted_3);

createVNode(LoadingLine)
], 8, _hoisted_5)) : createCommentVNode("", true),
], 8, _hoisted_6)) : createCommentVNode("", true),
unref(ifHasBodySlot) ? renderSlot(_ctx.$slots, "body", { key: 2 }, void 0, true) : (openBlock(), createElementBlock(Fragment, { key: 3 }, [
__props.items.length && unref(headerColumns).length ? (openBlock(), createElementBlock("tbody", _hoisted_6, [
__props.items.length && unref(headerColumns).length ? (openBlock(), createElementBlock("tbody", _hoisted_7, [
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(itemsForRender), (item) => {

@@ -818,3 +817,3 @@ return openBlock(), createElementBlock("tr", {

}), 128))
], 8, _hoisted_7);
], 8, _hoisted_8);
}), 128))

@@ -824,8 +823,8 @@ ])) : createCommentVNode("", true)

]),
!__props.items.length && !unref(loading) ? (openBlock(), createElementBlock("div", _hoisted_8, toDisplayString(__props.emptyMessage), 1)) : createCommentVNode("", true),
!__props.items.length && unref(loading) ? (openBlock(), createElementBlock("div", _hoisted_9, toDisplayString(__props.loadingMessage), 1)) : createCommentVNode("", true)
!__props.items.length && !unref(loading) ? (openBlock(), createElementBlock("div", _hoisted_9, toDisplayString(__props.emptyMessage), 1)) : createCommentVNode("", true),
!__props.items.length && unref(loading) ? (openBlock(), createElementBlock("div", _hoisted_10, toDisplayString(__props.loadingMessage), 1)) : createCommentVNode("", true)
], 2),
createElementVNode("div", _hoisted_10, [
createElementVNode("div", _hoisted_11, [
_hoisted_12,
createElementVNode("div", _hoisted_11, [
createElementVNode("div", _hoisted_12, [
_hoisted_13,
createVNode(RowsSelector, {

@@ -837,3 +836,3 @@ modelValue: rowsPerPageReactive.value,

]),
createElementVNode("div", _hoisted_13, toDisplayString(`${unref(firstIndexOfItemsInCurrentPage)}-${unref(lastIndexOfItemsInCurrentPage)}`) + " of " + toDisplayString(unref(totalItemsLength)), 1),
createElementVNode("div", _hoisted_14, toDisplayString(`${unref(firstIndexOfItemsInCurrentPage)}-${unref(lastIndexOfItemsInCurrentPage)}`) + " of " + toDisplayString(unref(totalItemsLength)), 1),
createVNode(PaginationArrows, {

@@ -861,3 +860,3 @@ "is-first-page": unref(isFirstPage),

});
var DataTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1f332667"]]);
var DataTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-dc30825c"]]);
export { DataTable as default };

@@ -1,1 +0,1 @@

(function(e,m){typeof exports=="object"&&typeof module!="undefined"?module.exports=m(require("vue")):typeof define=="function"&&define.amd?define(["vue"],m):(e=typeof globalThis!="undefined"?globalThis:e||self,e["vue3-easy-data-table"]=m(e.Vue))})(this,function(e){"use strict";var Je=Object.defineProperty,Ue=Object.defineProperties;var We=Object.getOwnPropertyDescriptors;var J=Object.getOwnPropertySymbols;var Ge=Object.prototype.hasOwnProperty,Ke=Object.prototype.propertyIsEnumerable;var U=(e,m,u)=>m in e?Je(e,m,{enumerable:!0,configurable:!0,writable:!0,value:u}):e[m]=u,P=(e,m)=>{for(var u in m||(m={}))Ge.call(m,u)&&U(e,u,m[u]);if(J)for(var u of J(m))Ke.call(m,u)&&U(e,u,m[u]);return e},L=(e,m)=>Ue(e,We(m));var m="",u=(r,d)=>{const t=r.__vccOpts||r;for(const[c,p]of d)t[c]=p;return t};const W=r=>(e.pushScopeId("data-v-566775ba"),r=r(),e.popScopeId(),r),G=["onClick"],K=["checked"],Q=W(()=>e.createElementVNode("label",{for:"checbox"},null,-1));var X=u(e.defineComponent({props:{status:{type:String,required:!0}},emits:["change"],setup(r,{emit:d}){const t=r;e.useCssVars(x=>({"7f84b28f":e.unref(h)}));const c=e.computed(()=>t.status==="allSelected"),p=()=>{d("change",!c.value)},h=e.inject("themeColor");return(x,k)=>(e.openBlock(),e.createElementBlock("div",{class:"multi-select__checkbox",onClick:e.withModifiers(p,["stop","prevent"])},[e.createElementVNode("input",{type:"checkbox",checked:e.unref(c),class:e.normalizeClass(r.status)},null,10,K),Q],8,G))}}),[["__scopeId","data-v-566775ba"]]),Xe="";const Y=r=>(e.pushScopeId("data-v-39f156fd"),r=r(),e.popScopeId(),r),Z=["checked"],v=Y(()=>e.createElementVNode("label",{for:"checbox"},null,-1));var ee=u(e.defineComponent({props:{checked:{type:Boolean,required:!0}},emits:["change"],setup(r,{emit:d}){e.useCssVars(c=>({"20cfc5a0":e.unref(t)}));const t=e.inject("themeColor");return(c,p)=>(e.openBlock(),e.createElementBlock("div",{class:"single-select__checkbox",onClick:p[0]||(p[0]=e.withModifiers(h=>d("change"),["stop","prevent"]))},[e.createElementVNode("input",{type:"checkbox",checked:r.checked},null,8,Z),v]))}}),[["__scopeId","data-v-39f156fd"]]),Ze="";const te=r=>(e.pushScopeId("data-v-490fbe16"),r=r(),e.popScopeId(),r),oe={class:"easy-data-table__rows-selector"},ne={class:"rows-input"},ae=te(()=>e.createElementVNode("div",{class:"triangle"},null,-1)),re=["onClick"];var se=u(e.defineComponent({props:{modelValue:{type:Number,required:!0},rowsItems:{type:Array,required:!0}},emits:["update:modelValue"],setup(r,{emit:d}){const t=r;e.useCssVars(f=>({"10352173":e.unref(B)}));const c=e.ref(!1),p=e.computed({get:()=>t.modelValue,set:f=>{d("update:modelValue",f)}}),h=f=>{p.value=f,c.value=!1},x=(f,l)=>{let n=f.parentNode;for(;n!=null;){if(n.classList&&n.classList.contains(l))return!0;n=n.parentNode}return!1},k=f=>{x(f.target,"easy-data-table__rows-selector")||(c.value=!1)};e.onMounted(()=>{document.addEventListener("click",k)}),e.onBeforeUnmount(()=>{document.removeEventListener("click",k)});const B=e.inject("themeColor");return(f,l)=>(e.openBlock(),e.createElementBlock("div",oe,[e.createElementVNode("div",{class:"rows-input__wrapper",onClick:l[0]||(l[0]=n=>c.value=!c.value)},[e.createElementVNode("div",ne,e.toDisplayString(e.unref(p)),1),ae]),e.createElementVNode("ul",{class:e.normalizeClass(["select-items",{show:c.value}])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.rowsItems,n=>(e.openBlock(),e.createElementBlock("li",{key:n,class:e.normalizeClass({selected:n===e.unref(p)}),onClick:i=>h(n)},e.toDisplayString(n),11,re))),128))],2)]))}}),[["__scopeId","data-v-490fbe16"]]),et="";const le={class:"loader-line"};var ce=u(e.defineComponent({setup(r){e.useCssVars(t=>({"38295e65":e.unref(d)}));const d=e.inject("themeColor");return(t,c)=>(e.openBlock(),e.createElementBlock("div",le))}}),[["__scopeId","data-v-1ec0ad4e"]]),ot="";const ie={class:"buttons-pagination"},de=["onClick"];var pe=u(e.defineComponent({props:{maxPaginationNumber:{type:Number,required:!0},currentPaginationNumber:{type:Number,required:!0}},emits:["updatePage"],setup(r,{emit:d}){const t=r;e.useCssVars(l=>({"772a88e6":e.unref(B),"6d5684f6":e.unref(k),"9ef55938":e.unref(f)}));const c=7,p=l=>{l.type==="button"&&!l.active&&d("updatePage",l.page)},h=e.computed(()=>{const l=[];if(t.maxPaginationNumber<=c)for(let n=1;n<=t.maxPaginationNumber;n+=1)l.push({type:"button",page:n,active:n===t.currentPaginationNumber});else if([1,2,t.maxPaginationNumber,t.maxPaginationNumber-1].includes(t.currentPaginationNumber))for(let n=1;n<=c;n+=1)if(n<=3)l.push({type:"button",page:n,active:n===t.currentPaginationNumber});else if(n===4)l.push({type:"omission"});else{const i=t.maxPaginationNumber-(c-n);l.push({type:"button",page:i,active:i===t.currentPaginationNumber})}else if([3,4].includes(t.currentPaginationNumber))for(let n=1;n<=c;n+=1)n<=5?l.push({type:"button",page:n,active:n===t.currentPaginationNumber}):n===6?l.push({type:"omission"}):l.push({type:"button",page:t.maxPaginationNumber,active:t.maxPaginationNumber===t.currentPaginationNumber});else if([t.maxPaginationNumber-2,t.maxPaginationNumber-3].includes(t.currentPaginationNumber))for(let n=1;n<=c;n+=1)if(n===1)l.push({type:"button",page:1,active:t.currentPaginationNumber===1});else if(n===2)l.push({type:"omission"});else{const i=t.maxPaginationNumber-(c-n);l.push({type:"button",page:i,active:i===t.currentPaginationNumber})}else for(let n=1;n<=c;n+=1)if(n===1)l.push({type:"button",page:1,active:t.currentPaginationNumber===1});else if(n===2||n===6)l.push({type:"omission"});else if(n===7)l.push({type:"button",page:t.maxPaginationNumber,active:t.maxPaginationNumber===t.currentPaginationNumber});else{const i=4-n,C=t.currentPaginationNumber-i;l.push({type:"button",page:C,active:C===t.currentPaginationNumber})}return l}),x=e.inject("rowHeight"),k=e.computed(()=>`${x*.6}px`),B=e.inject("borderColor"),f=e.inject("themeColor");return(l,n)=>(e.openBlock(),e.createElementBlock("div",ie,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(h),(i,C)=>(e.openBlock(),e.createElementBlock("div",{key:C,class:e.normalizeClass(["item",{button:i.type==="button",active:i.type==="button"&&i.active,omission:i.type==="omission"}]),onClick:y=>p(i)},e.toDisplayString(i.type==="button"?i.page:"..."),11,de))),128))]))}}),[["__scopeId","data-v-ed57d8dc"]]),at="";const z=r=>(e.pushScopeId("data-v-c9da5286"),r=r(),e.popScopeId(),r),ue=[z(()=>e.createElementVNode("span",{class:"arrow arrow-right"},null,-1))],me=[z(()=>e.createElementVNode("span",{class:"arrow arrow-left"},null,-1))];var ge=u(e.defineComponent({props:{isFirstPage:{type:Boolean,required:!1},isLastPage:{type:Boolean,required:!1}},emits:["clickPrevPage","clickNextPage"],setup(r,{emit:d}){const t=e.useSlots();return(c,p)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",{class:e.normalizeClass(["previous-page__click-button",{"first-page":r.isFirstPage}]),onClick:p[0]||(p[0]=h=>d("clickPrevPage"))},ue,2),e.unref(t).buttonsPagination?e.renderSlot(c.$slots,"buttonsPagination",{key:0},void 0,!0):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["next-page__click-button",{"last-page":r.isLastPage}]),onClick:p[1]||(p[1]=h=>d("clickNextPage"))},me,2)],64))}}),[["__scopeId","data-v-c9da5286"]]);const fe={class:"icon",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",width:"48",height:"48"},_e=[e.createElementVNode("path",{d:"M576 234.688V1024H448V234.688L213.312 469.312 128 384 512 0l384 384-85.312 85.312L576 234.688z",fill:"#373D41"},null,-1)];function he(r,d){return e.openBlock(),e.createElementBlock("svg",fe,_e)}var ye={render:he},it="";const ke={class:"data-table"},be={key:0},Se=["onClick"],xe={key:1,class:"header-text"},Ce=["colspan"],Pe={key:0},Be=["onClick"],Ne={key:0,class:"data-table__message"},we={key:1,class:"data-table__message"},$e={class:"data-table__footer"},Ve={class:"footer__rows-per-page"},Ee=e.createTextVNode(" rows per page: "),Ie={class:"footer__items-index"};var Te=u(e.defineComponent({props:{buttonsPagination:{type:Boolean,default:!1},borderColor:{type:String,default:"#e0e0e0"},bodyFontColor:{type:String,default:"#212121"},emptyMessage:{type:String,default:"No Available Data"},fixedHeader:{type:Boolean,default:!0},headerFontColor:{type:String,default:"#373737"},headerBackgroundColor:{type:String,default:"#fff"},bodyFontSize:{type:Number,default:12},headers:{type:Array,required:!0},items:{type:Array,required:!0},maxHeight:{type:Number,default:()=>400},wrapLines:{type:Boolean,default:!1},itemsSelected:{type:Array,default:null},searchField:{type:String,default:""},searchValue:{type:String,default:""},rowsPerPage:{type:Number,default:25},rowsItems:{type:Array,default:()=>[25,50,100]},loading:{type:Boolean,deault:!1},loadingMessage:{type:String,default:"Loading, please wait."},serverOptions:{type:Object,default:()=>{}},serverItemsLength:{type:Number,default:0},sortBy:{type:String,default:""},sortType:{type:String,default:"asc"},themeColor:{type:String,default:"#42b883"},dense:{type:Boolean,default:!1}},emits:["clickItem","update:itemsSelected","update:isAllSelected","update:serverOptions"],setup(r,{emit:d}){const t=r;e.useCssVars(o=>({"3ea4f4b2":e.unref(c),"0bd95bba":e.unref(f),"16ebe3f0":e.unref(x),ab6adece:e.unref(B),"87c96152":e.unref(p),e005a8d0:r.headerBackgroundColor,"0deca3e2":e.unref(h)}));const{borderColor:c,headerFontColor:p,bodyFontColor:h}=e.toRefs(t),x=e.computed(()=>`${t.bodyFontSize}px`),k=e.computed(()=>t.bodyFontSize*(t.dense?2:3)),B=e.computed(()=>`${k.value}px`),f=e.computed(()=>`${t.maxHeight}px`);e.provide("themeColor",t.themeColor),e.provide("rowHeight",k.value),e.provide("borderColor",c.value);const l=e.useSlots(),n=e.computed(()=>l.body),i=e.computed({get:()=>{var o,s,a;return{page:1,rowsPerPage:(o=t.serverOptions.rowsPerPage)!=null?o:t.rowsPerPage,sortBy:(s=t.serverOptions.sortBy)!=null?s:null,sortType:(a=t.serverOptions.sortType)!=null?a:null}},set:o=>{d("update:serverOptions",o)}}),C=e.computed(()=>t.itemsSelected!==null),y=e.computed(()=>t.serverItemsLength>0),Fe=()=>{const o=structuredClone(t.headers);return o.map(s=>{const a=s;return s.sortable&&(a.sortType=null),y.value&&s.value===t.serverOptions.sortBy&&(a.sortType=t.serverOptions.sortType),!y.value&&s.value===t.sortBy&&(a.sortType=t.sortType),a}),C.value?[{text:"checkbox",value:"checkbox"},...o]:o},V=e.ref(Fe()),O=e.computed(()=>V.value.map(o=>o.value)),b=e.computed({get:()=>t.itemsSelected,set:o=>{d("update:itemsSelected",o)}}),E=e.computed(()=>b.value.length===t.items.length?"allSelected":b.value.length===0?"noneSelected":"partSelected"),N=e.computed(()=>{if(!y.value&&t.searchValue!==""){const o=new RegExp(t.searchValue,"i");return t.items.filter(s=>o.test(t.searchField!==""?s[t.searchField]:Object.values(s).join("")))}return t.items}),_=e.ref(1),S=e.ref(t.rowsPerPage);e.watch(S,o=>{y.value&&(i.value=L(P({},i.value),{page:1,rowsPerPage:o})),_.value=1});const Le=()=>t.sortBy!==""?{sortBy:t.sortBy,sortDesc:t.sortType==="desc"}:null,I=e.ref(Le()),Oe=o=>{let s=null;V.value.map(a=>{const g=a;return a.sortable&&(a.value===o?(a.sortType===null?s="asc":a.sortType==="asc"?s="desc":s=null,g.sortType=s):g.sortType=null),g}),y.value?i.value={page:1,rowsPerPage:S.value,sortBy:s!==null?o:null,sortType:s}:s===null?I.value=null:I.value={sortBy:o,sortDesc:s==="desc"}},De=e.computed(()=>{if(y.value)return t.items;if(I.value===null)return N.value;const{sortBy:o,sortDesc:s}=I.value;return structuredClone(N.value).sort((g,$)=>g[o]<$[o]?s?1:-1:g[o]>$[o]?s?-1:1:0)}),A=e.computed(()=>y.value?t.serverItemsLength:N.value.length),M=e.computed(()=>Math.min(N.value.length,_.value*S.value)),H=e.computed(()=>(_.value-1)*S.value+1),j=e.computed(()=>Math.ceil(A.value/S.value)),R=e.computed(()=>_.value===j.value),q=e.computed(()=>_.value===1),T=e.ref(!1),D=e.ref(1),{loading:w}=e.toRefs(t),ze=()=>{if(!R.value&&!w.value)if(y.value&&t.items.length<_.value*S.value+1){const o=_.value+1;i.value=L(P({},i.value),{page:o}),T.value=!0,D.value=o}else _.value+=1},Ae=o=>{y.value?(i.value=L(P({},i.value),{page:o}),T.value=!0,D.value=o):_.value=o};e.watch(w,(o,s)=>{T.value&&o===!1&&s===!0&&(_.value=D.value,T.value=!1)});const Me=()=>{q.value||(_.value-=1)},F=e.computed(()=>{const o=[];for(let s=H.value-1;s<M.value;s+=1)o.push(De.value[s]);return o}),He=e.computed(()=>C.value?E.value==="allSelected"?F.value.map(o=>P({checkbox:!0},o)):E.value==="noneSelected"?F.value.map(o=>P({checkbox:!1},o)):F.value.map(o=>{const s=b.value.findIndex(a=>JSON.stringify(a)===JSON.stringify(o))!==-1;return P({checkbox:s},o)}):F.value),je=o=>{b.value=o?N.value:[]},Re=o=>{const s=o.checkbox;if(delete o.checkbox,s)b.value=b.value.filter(a=>JSON.stringify(a)!==JSON.stringify(o));else{const a=b.value;a.unshift(o),b.value=a}},qe=o=>{d("clickItem",o)};return(o,s)=>(e.openBlock(),e.createElementBlock("div",ke,[e.createElementVNode("div",{class:e.normalizeClass(["data-table__body",{"fixed-header":r.fixedHeader,"wrap-lines":r.wrapLines}])},[e.createElementVNode("table",null,[V.value.length?(e.openBlock(),e.createElementBlock("thead",be,[e.createElementVNode("tr",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(V.value,(a,g)=>(e.openBlock(),e.createElementBlock("th",{key:g,class:e.normalizeClass({sortable:a.sortable,none:a.sortable&&a.sortType===null,desc:a.sortable&&a.sortType==="desc",asc:a.sortable&&a.sortType==="asc"}),onClick:$=>a.sortable?Oe(a.value):null},[a.text==="checkbox"?(e.openBlock(),e.createBlock(X,{key:e.unref(E),status:e.unref(E),onChange:je},null,8,["status"])):(e.openBlock(),e.createElementBlock("span",xe,[e.createTextVNode(e.toDisplayString(a.text)+" ",1),a.sortable?(e.openBlock(),e.createElementBlock("span",{key:a.sortType?a.sortType:"none",class:e.normalizeClass(["sortType-icon",{desc:a.sortType==="desc"}])},[e.createVNode(e.unref(ye),{class:"sortType-icon__svg"})],2)):e.createCommentVNode("",!0)]))],10,Se))),128))])])):e.createCommentVNode("",!0),e.unref(w)?(e.openBlock(),e.createElementBlock("th",{key:1,class:"loading-th",colspan:e.unref(O).length},[e.createVNode(ce)],8,Ce)):e.createCommentVNode("",!0),e.unref(n)?e.renderSlot(o.$slots,"body",{key:2},void 0,!0):(e.openBlock(),e.createElementBlock(e.Fragment,{key:3},[r.items.length&&e.unref(O).length?(e.openBlock(),e.createElementBlock("tbody",Pe,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(He),a=>(e.openBlock(),e.createElementBlock("tr",{key:JSON.stringify(a),onClick:g=>qe(a)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(O),(g,$)=>(e.openBlock(),e.createElementBlock("td",{key:$},[e.unref(l)[g]?e.renderSlot(o.$slots,g,e.normalizeProps(e.mergeProps({key:0},a)),void 0,!0):g==="checkbox"?(e.openBlock(),e.createBlock(ee,{key:1,checked:a[g],onChange:pt=>Re(a)},null,8,["checked","onChange"])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:2},[e.createTextVNode(e.toDisplayString(Array.isArray(a[g])?a[g].join(","):a[g]),1)],64))]))),128))],8,Be))),128))])):e.createCommentVNode("",!0)],64))]),!r.items.length&&!e.unref(w)?(e.openBlock(),e.createElementBlock("div",Ne,e.toDisplayString(r.emptyMessage),1)):e.createCommentVNode("",!0),!r.items.length&&e.unref(w)?(e.openBlock(),e.createElementBlock("div",we,e.toDisplayString(r.loadingMessage),1)):e.createCommentVNode("",!0)],2),e.createElementVNode("div",$e,[e.createElementVNode("div",Ve,[Ee,e.createVNode(se,{modelValue:S.value,"onUpdate:modelValue":s[0]||(s[0]=a=>S.value=a),"rows-items":r.rowsItems},null,8,["modelValue","rows-items"])]),e.createElementVNode("div",Ie,e.toDisplayString(`${e.unref(H)}-${e.unref(M)}`)+" of "+e.toDisplayString(e.unref(A)),1),e.createVNode(ge,{"is-first-page":e.unref(q),"is-last-page":e.unref(R),onClickNextPage:ze,onClickPrevPage:Me},e.createSlots({_:2},[r.buttonsPagination?{name:"buttonsPagination",fn:e.withCtx(()=>[e.createVNode(pe,{"current-pagination-number":_.value,"max-pagination-number":e.unref(j),onUpdatePage:Ae},null,8,["current-pagination-number","max-pagination-number"])])}:void 0]),1032,["is-first-page","is-last-page"])])]))}}),[["__scopeId","data-v-1f332667"]]);return Te});
(function(e,m){typeof exports=="object"&&typeof module!="undefined"?module.exports=m(require("vue")):typeof define=="function"&&define.amd?define(["vue"],m):(e=typeof globalThis!="undefined"?globalThis:e||self,e["vue3-easy-data-table"]=m(e.Vue))})(this,function(e){"use strict";var Ue=Object.defineProperty,We=Object.defineProperties;var Ge=Object.getOwnPropertyDescriptors;var J=Object.getOwnPropertySymbols;var Ke=Object.prototype.hasOwnProperty,Qe=Object.prototype.propertyIsEnumerable;var U=(e,m,u)=>m in e?Ue(e,m,{enumerable:!0,configurable:!0,writable:!0,value:u}):e[m]=u,P=(e,m)=>{for(var u in m||(m={}))Ke.call(m,u)&&U(e,u,m[u]);if(J)for(var u of J(m))Qe.call(m,u)&&U(e,u,m[u]);return e},L=(e,m)=>We(e,Ge(m));var m="",u=(r,d)=>{const t=r.__vccOpts||r;for(const[c,p]of d)t[c]=p;return t};const W=r=>(e.pushScopeId("data-v-566775ba"),r=r(),e.popScopeId(),r),G=["onClick"],K=["checked"],Q=W(()=>e.createElementVNode("label",{for:"checbox"},null,-1));var X=u(e.defineComponent({props:{status:{type:String,required:!0}},emits:["change"],setup(r,{emit:d}){const t=r;e.useCssVars(x=>({"7f84b28f":e.unref(h)}));const c=e.computed(()=>t.status==="allSelected"),p=()=>{d("change",!c.value)},h=e.inject("themeColor");return(x,k)=>(e.openBlock(),e.createElementBlock("div",{class:"multi-select__checkbox",onClick:e.withModifiers(p,["stop","prevent"])},[e.createElementVNode("input",{type:"checkbox",checked:e.unref(c),class:e.normalizeClass(r.status)},null,10,K),Q],8,G))}}),[["__scopeId","data-v-566775ba"]]),Ye="";const Y=r=>(e.pushScopeId("data-v-39f156fd"),r=r(),e.popScopeId(),r),Z=["checked"],v=Y(()=>e.createElementVNode("label",{for:"checbox"},null,-1));var ee=u(e.defineComponent({props:{checked:{type:Boolean,required:!0}},emits:["change"],setup(r,{emit:d}){e.useCssVars(c=>({"20cfc5a0":e.unref(t)}));const t=e.inject("themeColor");return(c,p)=>(e.openBlock(),e.createElementBlock("div",{class:"single-select__checkbox",onClick:p[0]||(p[0]=e.withModifiers(h=>d("change"),["stop","prevent"]))},[e.createElementVNode("input",{type:"checkbox",checked:r.checked},null,8,Z),v]))}}),[["__scopeId","data-v-39f156fd"]]),ve="";const te=r=>(e.pushScopeId("data-v-490fbe16"),r=r(),e.popScopeId(),r),oe={class:"easy-data-table__rows-selector"},ne={class:"rows-input"},ae=te(()=>e.createElementVNode("div",{class:"triangle"},null,-1)),re=["onClick"];var se=u(e.defineComponent({props:{modelValue:{type:Number,required:!0},rowsItems:{type:Array,required:!0}},emits:["update:modelValue"],setup(r,{emit:d}){const t=r;e.useCssVars(f=>({"10352173":e.unref(B)}));const c=e.ref(!1),p=e.computed({get:()=>t.modelValue,set:f=>{d("update:modelValue",f)}}),h=f=>{p.value=f,c.value=!1},x=(f,l)=>{let n=f.parentNode;for(;n!=null;){if(n.classList&&n.classList.contains(l))return!0;n=n.parentNode}return!1},k=f=>{x(f.target,"easy-data-table__rows-selector")||(c.value=!1)};e.onMounted(()=>{document.addEventListener("click",k)}),e.onBeforeUnmount(()=>{document.removeEventListener("click",k)});const B=e.inject("themeColor");return(f,l)=>(e.openBlock(),e.createElementBlock("div",oe,[e.createElementVNode("div",{class:"rows-input__wrapper",onClick:l[0]||(l[0]=n=>c.value=!c.value)},[e.createElementVNode("div",ne,e.toDisplayString(e.unref(p)),1),ae]),e.createElementVNode("ul",{class:e.normalizeClass(["select-items",{show:c.value}])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.rowsItems,n=>(e.openBlock(),e.createElementBlock("li",{key:n,class:e.normalizeClass({selected:n===e.unref(p)}),onClick:i=>h(n)},e.toDisplayString(n),11,re))),128))],2)]))}}),[["__scopeId","data-v-490fbe16"]]),tt="";const le={class:"loader-line"};var ce=u(e.defineComponent({setup(r){e.useCssVars(t=>({"38295e65":e.unref(d)}));const d=e.inject("themeColor");return(t,c)=>(e.openBlock(),e.createElementBlock("div",le))}}),[["__scopeId","data-v-1ec0ad4e"]]),nt="";const ie={class:"buttons-pagination"},de=["onClick"];var pe=u(e.defineComponent({props:{maxPaginationNumber:{type:Number,required:!0},currentPaginationNumber:{type:Number,required:!0}},emits:["updatePage"],setup(r,{emit:d}){const t=r;e.useCssVars(l=>({"772a88e6":e.unref(B),"6d5684f6":e.unref(k),"9ef55938":e.unref(f)}));const c=7,p=l=>{l.type==="button"&&!l.active&&d("updatePage",l.page)},h=e.computed(()=>{const l=[];if(t.maxPaginationNumber<=c)for(let n=1;n<=t.maxPaginationNumber;n+=1)l.push({type:"button",page:n,active:n===t.currentPaginationNumber});else if([1,2,t.maxPaginationNumber,t.maxPaginationNumber-1].includes(t.currentPaginationNumber))for(let n=1;n<=c;n+=1)if(n<=3)l.push({type:"button",page:n,active:n===t.currentPaginationNumber});else if(n===4)l.push({type:"omission"});else{const i=t.maxPaginationNumber-(c-n);l.push({type:"button",page:i,active:i===t.currentPaginationNumber})}else if([3,4].includes(t.currentPaginationNumber))for(let n=1;n<=c;n+=1)n<=5?l.push({type:"button",page:n,active:n===t.currentPaginationNumber}):n===6?l.push({type:"omission"}):l.push({type:"button",page:t.maxPaginationNumber,active:t.maxPaginationNumber===t.currentPaginationNumber});else if([t.maxPaginationNumber-2,t.maxPaginationNumber-3].includes(t.currentPaginationNumber))for(let n=1;n<=c;n+=1)if(n===1)l.push({type:"button",page:1,active:t.currentPaginationNumber===1});else if(n===2)l.push({type:"omission"});else{const i=t.maxPaginationNumber-(c-n);l.push({type:"button",page:i,active:i===t.currentPaginationNumber})}else for(let n=1;n<=c;n+=1)if(n===1)l.push({type:"button",page:1,active:t.currentPaginationNumber===1});else if(n===2||n===6)l.push({type:"omission"});else if(n===7)l.push({type:"button",page:t.maxPaginationNumber,active:t.maxPaginationNumber===t.currentPaginationNumber});else{const i=4-n,C=t.currentPaginationNumber-i;l.push({type:"button",page:C,active:C===t.currentPaginationNumber})}return l}),x=e.inject("rowHeight"),k=e.computed(()=>`${x*.6}px`),B=e.inject("borderColor"),f=e.inject("themeColor");return(l,n)=>(e.openBlock(),e.createElementBlock("div",ie,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(h),(i,C)=>(e.openBlock(),e.createElementBlock("div",{key:C,class:e.normalizeClass(["item",{button:i.type==="button",active:i.type==="button"&&i.active,omission:i.type==="omission"}]),onClick:y=>p(i)},e.toDisplayString(i.type==="button"?i.page:"..."),11,de))),128))]))}}),[["__scopeId","data-v-ed57d8dc"]]),rt="";const z=r=>(e.pushScopeId("data-v-c9da5286"),r=r(),e.popScopeId(),r),ue=[z(()=>e.createElementVNode("span",{class:"arrow arrow-right"},null,-1))],me=[z(()=>e.createElementVNode("span",{class:"arrow arrow-left"},null,-1))];var ge=u(e.defineComponent({props:{isFirstPage:{type:Boolean,required:!1},isLastPage:{type:Boolean,required:!1}},emits:["clickPrevPage","clickNextPage"],setup(r,{emit:d}){const t=e.useSlots();return(c,p)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",{class:e.normalizeClass(["previous-page__click-button",{"first-page":r.isFirstPage}]),onClick:p[0]||(p[0]=h=>d("clickPrevPage"))},ue,2),e.unref(t).buttonsPagination?e.renderSlot(c.$slots,"buttonsPagination",{key:0},void 0,!0):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["next-page__click-button",{"last-page":r.isLastPage}]),onClick:p[1]||(p[1]=h=>d("clickNextPage"))},me,2)],64))}}),[["__scopeId","data-v-c9da5286"]]);const fe={class:"icon",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",width:"48",height:"48"},_e=[e.createElementVNode("path",{d:"M576 234.688V1024H448V234.688L213.312 469.312 128 384 512 0l384 384-85.312 85.312L576 234.688z",fill:"#373D41"},null,-1)];function he(r,d){return e.openBlock(),e.createElementBlock("svg",fe,_e)}var ye={render:he},dt="";const ke={class:"data-table"},be={key:0},Se=["onClick"],xe={key:1,class:"header-text__wrapper"},Ce={class:"header-text"},Pe=["colspan"],Be={key:0},Ne=["onClick"],we={key:0,class:"data-table__message"},$e={key:1,class:"data-table__message"},Ve={class:"data-table__footer"},Ee={class:"footer__rows-per-page"},Ie=e.createTextVNode(" rows per page: "),Te={class:"footer__items-index"};var Fe=u(e.defineComponent({props:{buttonsPagination:{type:Boolean,default:!1},borderColor:{type:String,default:"#e0e0e0"},bodyFontColor:{type:String,default:"#212121"},emptyMessage:{type:String,default:"No Available Data"},fixedHeader:{type:Boolean,default:!0},headerFontColor:{type:String,default:"#373737"},headerBackgroundColor:{type:String,default:"#fff"},bodyFontSize:{type:Number,default:12},headers:{type:Array,required:!0},items:{type:Array,required:!0},maxHeight:{type:Number,default:()=>400},wrapLines:{type:Boolean,default:!1},itemsSelected:{type:Array,default:null},searchField:{type:String,default:""},searchValue:{type:String,default:""},rowsPerPage:{type:Number,default:25},rowsItems:{type:Array,default:()=>[25,50,100]},loading:{type:Boolean,deault:!1},loadingMessage:{type:String,default:"Loading, please wait."},serverOptions:{type:Object,default:()=>{}},serverItemsLength:{type:Number,default:0},sortBy:{type:String,default:""},sortType:{type:String,default:"asc"},themeColor:{type:String,default:"#42b883"},dense:{type:Boolean,default:!1}},emits:["clickItem","update:itemsSelected","update:isAllSelected","update:serverOptions"],setup(r,{emit:d}){const t=r;e.useCssVars(o=>({"42330806":e.unref(c),"0f676f0e":e.unref(f),"3ecdf4f2":e.unref(x),aef8f222:e.unref(B),"6da52aad":e.unref(p),"1e62a324":r.headerBackgroundColor,"61c15cb8":e.unref(h)}));const{borderColor:c,headerFontColor:p,bodyFontColor:h}=e.toRefs(t),x=e.computed(()=>`${t.bodyFontSize}px`),k=e.computed(()=>t.bodyFontSize*(t.dense?2:3)),B=e.computed(()=>`${k.value}px`),f=e.computed(()=>`${t.maxHeight}px`);e.provide("themeColor",t.themeColor),e.provide("rowHeight",k.value),e.provide("borderColor",c.value);const l=e.useSlots(),n=e.computed(()=>l.body),i=e.computed({get:()=>{var o,s,a;return{page:1,rowsPerPage:(o=t.serverOptions.rowsPerPage)!=null?o:t.rowsPerPage,sortBy:(s=t.serverOptions.sortBy)!=null?s:null,sortType:(a=t.serverOptions.sortType)!=null?a:null}},set:o=>{d("update:serverOptions",o)}}),C=e.computed(()=>t.itemsSelected!==null),y=e.computed(()=>t.serverItemsLength>0),Le=()=>{const o=structuredClone(t.headers);return o.map(s=>{const a=s;return s.sortable&&(a.sortType=null),y.value&&s.value===t.serverOptions.sortBy&&(a.sortType=t.serverOptions.sortType),!y.value&&s.value===t.sortBy&&(a.sortType=t.sortType),a}),C.value?[{text:"checkbox",value:"checkbox"},...o]:o},V=e.ref(Le()),O=e.computed(()=>V.value.map(o=>o.value)),b=e.computed({get:()=>t.itemsSelected,set:o=>{d("update:itemsSelected",o)}}),E=e.computed(()=>b.value.length===t.items.length?"allSelected":b.value.length===0?"noneSelected":"partSelected"),N=e.computed(()=>{if(!y.value&&t.searchValue!==""){const o=new RegExp(t.searchValue,"i");return t.items.filter(s=>o.test(t.searchField!==""?s[t.searchField]:Object.values(s).join("")))}return t.items}),_=e.ref(1),S=e.ref(t.rowsPerPage);e.watch(S,o=>{y.value&&(i.value=L(P({},i.value),{page:1,rowsPerPage:o})),_.value=1});const Oe=()=>t.sortBy!==""?{sortBy:t.sortBy,sortDesc:t.sortType==="desc"}:null,I=e.ref(Oe()),De=o=>{let s=null;V.value.map(a=>{const g=a;return a.sortable&&(a.value===o?(a.sortType===null?s="asc":a.sortType==="asc"?s="desc":s=null,g.sortType=s):g.sortType=null),g}),y.value?i.value={page:1,rowsPerPage:S.value,sortBy:s!==null?o:null,sortType:s}:s===null?I.value=null:I.value={sortBy:o,sortDesc:s==="desc"}},ze=e.computed(()=>{if(y.value)return t.items;if(I.value===null)return N.value;const{sortBy:o,sortDesc:s}=I.value;return structuredClone(N.value).sort((g,$)=>g[o]<$[o]?s?1:-1:g[o]>$[o]?s?-1:1:0)}),A=e.computed(()=>y.value?t.serverItemsLength:N.value.length),M=e.computed(()=>Math.min(N.value.length,_.value*S.value)),H=e.computed(()=>(_.value-1)*S.value+1),j=e.computed(()=>Math.ceil(A.value/S.value)),R=e.computed(()=>_.value===j.value),q=e.computed(()=>_.value===1),T=e.ref(!1),D=e.ref(1),{loading:w}=e.toRefs(t),Ae=()=>{if(!R.value&&!w.value)if(y.value&&t.items.length<_.value*S.value+1){const o=_.value+1;i.value=L(P({},i.value),{page:o}),T.value=!0,D.value=o}else _.value+=1},Me=o=>{y.value?(i.value=L(P({},i.value),{page:o}),T.value=!0,D.value=o):_.value=o};e.watch(w,(o,s)=>{T.value&&o===!1&&s===!0&&(_.value=D.value,T.value=!1)});const He=()=>{q.value||(_.value-=1)},F=e.computed(()=>{const o=[];for(let s=H.value-1;s<M.value;s+=1)o.push(ze.value[s]);return o}),je=e.computed(()=>C.value?E.value==="allSelected"?F.value.map(o=>P({checkbox:!0},o)):E.value==="noneSelected"?F.value.map(o=>P({checkbox:!1},o)):F.value.map(o=>{const s=b.value.findIndex(a=>JSON.stringify(a)===JSON.stringify(o))!==-1;return P({checkbox:s},o)}):F.value),Re=o=>{b.value=o?N.value:[]},qe=o=>{const s=o.checkbox;if(delete o.checkbox,s)b.value=b.value.filter(a=>JSON.stringify(a)!==JSON.stringify(o));else{const a=b.value;a.unshift(o),b.value=a}},Je=o=>{d("clickItem",o)};return(o,s)=>(e.openBlock(),e.createElementBlock("div",ke,[e.createElementVNode("div",{class:e.normalizeClass(["data-table__body",{"fixed-header":r.fixedHeader,"wrap-lines":r.wrapLines}])},[e.createElementVNode("table",null,[V.value.length?(e.openBlock(),e.createElementBlock("thead",be,[e.createElementVNode("tr",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(V.value,(a,g)=>(e.openBlock(),e.createElementBlock("th",{key:g,class:e.normalizeClass({sortable:a.sortable,none:a.sortable&&a.sortType===null,desc:a.sortable&&a.sortType==="desc",asc:a.sortable&&a.sortType==="asc"}),onClick:$=>a.sortable?De(a.value):null},[a.text==="checkbox"?(e.openBlock(),e.createBlock(X,{key:e.unref(E),status:e.unref(E),onChange:Re},null,8,["status"])):(e.openBlock(),e.createElementBlock("span",xe,[e.createElementVNode("span",Ce,e.toDisplayString(a.text),1),a.sortable?(e.openBlock(),e.createBlock(e.unref(ye),{key:a.sortType?a.sortType:"none",class:e.normalizeClass(["sortType-icon",{desc:a.sortType==="desc"}])},null,8,["class"])):e.createCommentVNode("",!0)]))],10,Se))),128))])])):e.createCommentVNode("",!0),e.unref(w)?(e.openBlock(),e.createElementBlock("th",{key:1,class:"loading-th",colspan:e.unref(O).length},[e.createVNode(ce)],8,Pe)):e.createCommentVNode("",!0),e.unref(n)?e.renderSlot(o.$slots,"body",{key:2},void 0,!0):(e.openBlock(),e.createElementBlock(e.Fragment,{key:3},[r.items.length&&e.unref(O).length?(e.openBlock(),e.createElementBlock("tbody",Be,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(je),a=>(e.openBlock(),e.createElementBlock("tr",{key:JSON.stringify(a),onClick:g=>Je(a)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(O),(g,$)=>(e.openBlock(),e.createElementBlock("td",{key:$},[e.unref(l)[g]?e.renderSlot(o.$slots,g,e.normalizeProps(e.mergeProps({key:0},a)),void 0,!0):g==="checkbox"?(e.openBlock(),e.createBlock(ee,{key:1,checked:a[g],onChange:ut=>qe(a)},null,8,["checked","onChange"])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:2},[e.createTextVNode(e.toDisplayString(Array.isArray(a[g])?a[g].join(","):a[g]),1)],64))]))),128))],8,Ne))),128))])):e.createCommentVNode("",!0)],64))]),!r.items.length&&!e.unref(w)?(e.openBlock(),e.createElementBlock("div",we,e.toDisplayString(r.emptyMessage),1)):e.createCommentVNode("",!0),!r.items.length&&e.unref(w)?(e.openBlock(),e.createElementBlock("div",$e,e.toDisplayString(r.loadingMessage),1)):e.createCommentVNode("",!0)],2),e.createElementVNode("div",Ve,[e.createElementVNode("div",Ee,[Ie,e.createVNode(se,{modelValue:S.value,"onUpdate:modelValue":s[0]||(s[0]=a=>S.value=a),"rows-items":r.rowsItems},null,8,["modelValue","rows-items"])]),e.createElementVNode("div",Te,e.toDisplayString(`${e.unref(H)}-${e.unref(M)}`)+" of "+e.toDisplayString(e.unref(A)),1),e.createVNode(ge,{"is-first-page":e.unref(q),"is-last-page":e.unref(R),onClickNextPage:Ae,onClickPrevPage:He},e.createSlots({_:2},[r.buttonsPagination?{name:"buttonsPagination",fn:e.withCtx(()=>[e.createVNode(pe,{"current-pagination-number":_.value,"max-pagination-number":e.unref(j),onUpdatePage:Me},null,8,["current-pagination-number","max-pagination-number"])])}:void 0]),1032,["is-first-page","is-last-page"])])]))}}),[["__scopeId","data-v-dc30825c"]]);return Fe});

@@ -6,3 +6,3 @@ {

"private": false,
"version": "1.0.5",
"version": "1.0.6",
"types": "./types/main.d.ts",

@@ -9,0 +9,0 @@ "files": [

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc