@toniel/laravel-tanstack-datatable 0.1.0 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +1 -1
  2. package/dist/index.mjs +53 -53
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),x=require("@tanstack/vue-table"),y=require("lucide-vue-next"),B=require("clsx"),C=require("tailwind-merge"),E={class:"flex flex-col gap-4 px-2 py-4"},N={key:0,class:"flex justify-center"},V={class:"flex items-center gap-1",role:"navigation","aria-label":"pagination"},P=["disabled"],D=["disabled"],R={class:"flex items-center gap-1"},$=["onClick"],T={key:1,class:"inline-flex items-center justify-center h-10 w-10 text-gray-500"},j=["disabled"],F=["disabled"],L={class:"flex items-center justify-between text-sm text-gray-600 dark:text-gray-300"},z={key:0,class:"flex items-center gap-2"},I=["value"],M=["value"],O={key:1},S=e.defineComponent({__name:"DataTablePagination",props:{pagination:{default:null},perPageOptions:{default:()=>[10,15,25,50,100]},currentPerPage:{default:10},showPerPageSelector:{type:Boolean,default:!0}},emits:["pageChange","perPageChange"],setup(t,{emit:h}){const s=t,i=h,l=e.computed(()=>s.pagination?s.pagination.meta.current_page>1:!1),d=e.computed(()=>s.pagination?s.pagination.meta.current_page<s.pagination.meta.last_page:!1),f=e.computed(()=>{if(!s.pagination)return[];const g=s.pagination.meta.current_page,r=s.pagination.meta.last_page,o=2,n=[],m=[];let p;for(let a=1;a<=r;a++)(a===1||a===r||a>=g-o&&a<=g+o)&&n.push(a);for(const a of n)p&&(a-p===2?m.push(p+1):a-p!==1&&m.push("...")),m.push(a),p=a;return m}),b=g=>{typeof g=="number"&&i("pageChange",g)},u=()=>{l.value&&i("pageChange",1)},v=()=>{d.value&&s.pagination&&i("pageChange",s.pagination.meta.last_page)},w=()=>{l.value&&s.pagination&&i("pageChange",s.pagination.meta.current_page-1)},k=()=>{d.value&&s.pagination&&i("pageChange",s.pagination.meta.current_page+1)};return(g,r)=>(e.openBlock(),e.createElementBlock("div",E,[t.pagination&&t.pagination.meta.last_page>1?(e.openBlock(),e.createElementBlock("div",N,[e.createElementVNode("nav",V,[e.createElementVNode("button",{disabled:!l.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",l.value?"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200":"opacity-50 cursor-not-allowed text-gray-400 dark:text-gray-600"]),onClick:u},[e.createVNode(e.unref(y.ChevronsLeft),{class:"h-4 w-4"}),r[1]||(r[1]=e.createElementVNode("span",{class:"hidden sm:inline"},"First",-1))],10,P),e.createElementVNode("button",{disabled:!l.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",l.value?"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200":"opacity-50 cursor-not-allowed text-gray-400 dark:text-gray-600"]),onClick:w},[e.createVNode(e.unref(y.ChevronLeft),{class:"h-4 w-4"}),r[2]||(r[2]=e.createElementVNode("span",{class:"hidden sm:inline"},"Previous",-1))],10,D),e.createElementVNode("div",R,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,(o,n)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:n},[o!=="..."?(e.openBlock(),e.createElementBlock("button",{key:0,class:e.normalizeClass(["inline-flex items-center justify-center h-10 w-10 text-sm font-medium transition-colors rounded-md",o===t.pagination.meta.current_page?"bg-blue-500 text-white hover:bg-blue-600":"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200"]),onClick:m=>b(o)},e.toDisplayString(o),11,$)):(e.openBlock(),e.createElementBlock("span",T," ... "))],64))),128))]),e.createElementVNode("button",{disabled:!d.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",d.value?"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200":"opacity-50 cursor-not-allowed text-gray-400 dark:text-gray-600"]),onClick:k},[r[3]||(r[3]=e.createElementVNode("span",{class:"hidden sm:inline"},"Next",-1)),e.createVNode(e.unref(y.ChevronRight),{class:"h-4 w-4"})],10,j),e.createElementVNode("button",{disabled:!d.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",d.value?"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200":"opacity-50 cursor-not-allowed text-gray-400 dark:text-gray-600"]),onClick:v},[r[4]||(r[4]=e.createElementVNode("span",{class:"hidden sm:inline"},"Last",-1)),e.createVNode(e.unref(y.ChevronsRight),{class:"h-4 w-4"})],10,F)])])):e.createCommentVNode("",!0),e.createElementVNode("div",L,[e.createElementVNode("div",null,[t.pagination&&t.pagination.meta.total>0?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(" Showing "+e.toDisplayString(t.pagination.meta.from)+" to "+e.toDisplayString(t.pagination.meta.to)+" of "+e.toDisplayString(t.pagination.meta.total)+" entries ",1)],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(" No entries found ")],64))]),t.showPerPageSelector?(e.openBlock(),e.createElementBlock("div",z,[r[5]||(r[5]=e.createElementVNode("span",null,"Rows per page:",-1)),e.createElementVNode("select",{value:t.currentPerPage||t.perPageOptions[0],class:"h-10 rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",onChange:r[0]||(r[0]=o=>i("perPageChange",Number(o.target.value)||t.perPageOptions[0]))},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.perPageOptions,o=>(e.openBlock(),e.createElementBlock("option",{key:o,value:o},e.toDisplayString(o),9,M))),128))],40,I)])):e.createCommentVNode("",!0),t.pagination?(e.openBlock(),e.createElementBlock("div",O," Page "+e.toDisplayString(t.pagination.meta.current_page)+" of "+e.toDisplayString(t.pagination.meta.last_page),1)):e.createCommentVNode("",!0)])]))}}),q={class:"flex flex-col gap-4"},_={class:"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between"},A={class:"flex flex-col gap-2 sm:flex-row sm:items-center"},G={key:0,class:"relative items-center w-full max-w-sm"},H=["value"],U={class:"absolute inset-y-0 flex items-center justify-center px-2 start-0"},W={class:"flex items-center gap-2"},J={class:"flex items-center"},K={key:0,class:"flex items-center justify-between p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg"},Q={class:"flex items-center gap-4"},X={class:"text-sm font-medium text-blue-700 dark:text-blue-300"},Y={class:"text-xs text-blue-600 dark:text-blue-400"},Z={class:"flex items-center gap-2"},ee={key:1,class:"flex items-center justify-center p-8"},te={class:"text-lg text-gray-700 dark:text-gray-200"},oe={key:2,class:"flex flex-col items-center p-8"},ne={class:"mb-2 text-lg text-red-600 dark:text-red-400"},ae={class:"mb-4 text-sm text-gray-600 dark:text-gray-300"},le={key:3,class:"rounded-lg border bg-white dark:bg-gray-900"},re={key:0,class:"relative"},se={class:"relative w-full overflow-auto"},ie={class:"w-full caption-bottom text-sm"},ce={key:0,class:"mt-4 text-sm text-muted-foreground"},de={key:0,class:"ml-2 text-blue-600 dark:text-blue-400"},ge={class:"[&_tr]:border-b"},ue=["colspan"],me=["onClick"],pe={key:0,class:"flex flex-col"},fe={class:"[&_tr:last-child]:border-0"},ye={key:1},be=["colspan"],ke=e.defineComponent({__name:"DataTable",props:{data:{default:()=>[]},columns:{},pagination:{default:null},isLoading:{type:Boolean,default:!1},error:{default:null},search:{default:""},currentPerPage:{default:10},perPageOptions:{default:()=>[10,15,25,50,100]},sortBy:{default:null},sortDirection:{default:"asc"},rowSelection:{default:()=>({})},enableRowSelection:{type:Boolean,default:!1},getRowId:{type:Function,default:t=>t.id},showSearch:{type:Boolean,default:!0},showCaption:{type:Boolean,default:!0},showPerPageSelector:{type:Boolean,default:!0},title:{default:"Items"},itemName:{default:"items"},loadingText:{default:"Loading..."},errorTitle:{default:"Error loading data"},emptyStateText:{default:"📭 No items found"}},emits:["pageChange","perPageChange","searchChange","sortChange","retry","update:rowSelection"],setup(t,{expose:h,emit:s}){const i=s,l=t,d=e.computed(()=>Object.keys(l.rowSelection||{}).filter(o=>{var n;return(n=l.rowSelection)==null?void 0:n[o]}).length),f=e.computed(()=>Object.keys(l.rowSelection||{}).filter(o=>{var n;return(n=l.rowSelection)==null?void 0:n[o]})),b=e.computed(()=>!l.data||!l.rowSelection?[]:l.data.filter(o=>l.rowSelection[l.getRowId(o)])),u=x.useVueTable({get data(){return l.data||[]},columns:l.columns,getCoreRowModel:x.getCoreRowModel(),enableSorting:!0,manualSorting:!0,enableRowSelection:l.enableRowSelection,getRowId:l.getRowId,state:{rowSelection:l.rowSelection||{}},onRowSelectionChange:o=>{const n=typeof o=="function"?o(l.rowSelection||{}):o;i("update:rowSelection",n)},enableMultiRowSelection:!0,enableSubRowSelection:!1}),v=()=>f.value,w=()=>b.value,k=()=>i("update:rowSelection",{}),g=()=>{const o={...l.rowSelection};u.getRowModel().rows.forEach(n=>{o[n.id]=!0}),i("update:rowSelection",o)},r=()=>{const o={...l.rowSelection};u.getRowModel().rows.forEach(n=>{delete o[n.id]}),i("update:rowSelection",o)};return h({getSelectedRowIds:v,getSelectedRowData:w,clearSelection:k,selectAllCurrentPage:g,deselectAllCurrentPage:r,selectedRowCount:d,selectedRowIds:f,selectedRowData:b,table:u}),(o,n)=>{var m,p;return e.openBlock(),e.createElementBlock("div",q,[e.createElementVNode("div",_,[e.createElementVNode("div",A,[t.showSearch?(e.openBlock(),e.createElementBlock("div",G,[e.createElementVNode("input",{value:t.search,type:"text",placeholder:"Search...",class:"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 pl-10 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",onInput:n[0]||(n[0]=a=>i("searchChange",a.target.value))},null,40,H),e.createElementVNode("span",U,[e.createVNode(e.unref(y.Search),{class:"size-6 text-gray-400"})])])):e.createCommentVNode("",!0),e.createElementVNode("div",W,[e.renderSlot(o.$slots,"filters")])]),e.createElementVNode("div",J,[e.renderSlot(o.$slots,"header")])]),t.enableRowSelection&&d.value>0?(e.openBlock(),e.createElementBlock("div",K,[e.createElementVNode("div",Q,[e.createElementVNode("span",X,e.toDisplayString(d.value)+" "+e.toDisplayString(t.itemName)+" selected ",1),e.createElementVNode("div",Y," IDs: "+e.toDisplayString(f.value.slice(0,5).join(", "))+e.toDisplayString(f.value.length>5?"...":""),1)]),e.createElementVNode("div",Z,[e.renderSlot(o.$slots,"bulk-actions",{selectedIds:f.value,selectedData:b.value,selectedCount:d.value,clearSelection:k,selectAllCurrentPage:g,deselectAllCurrentPage:r}),o.$slots["bulk-actions"]?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("button",{key:0,onClick:k,class:"px-3 py-1 text-sm text-blue-700 dark:text-blue-300 hover:bg-blue-100 dark:hover:bg-blue-800 rounded transition-colors"}," Clear Selection "))])])):e.createCommentVNode("",!0),t.isLoading&&!t.data?(e.openBlock(),e.createElementBlock("div",ee,[n[4]||(n[4]=e.createElementVNode("div",{class:"w-8 h-8 mr-3 border-b-2 border-gray-900 dark:border-gray-100 rounded-full animate-spin"},null,-1)),e.createElementVNode("div",te,e.toDisplayString(t.loadingText),1)])):t.error?(e.openBlock(),e.createElementBlock("div",oe,[e.createElementVNode("div",ne,"❌ "+e.toDisplayString(t.errorTitle),1),e.createElementVNode("div",ae,e.toDisplayString(t.error.message),1),e.createElementVNode("button",{class:"px-4 py-2 text-white transition-colors bg-gray-900 rounded-md hover:bg-gray-800 dark:bg-gray-100 dark:text-gray-900 dark:hover:bg-gray-200",onClick:n[1]||(n[1]=a=>i("retry"))}," 🔄 Retry ")])):(e.openBlock(),e.createElementBlock("div",le,[t.isLoading?(e.openBlock(),e.createElementBlock("div",re,[...n[5]||(n[5]=[e.createElementVNode("div",{class:"absolute inset-0 z-10 flex items-center justify-center bg-white/70 dark:bg-gray-900/70 rounded-lg"},[e.createElementVNode("div",{class:"w-6 h-6 border-b-2 border-gray-900 dark:border-gray-100 rounded-full animate-spin"})],-1)])])):e.createCommentVNode("",!0),e.createElementVNode("div",se,[e.createElementVNode("table",ie,[t.showCaption?(e.openBlock(),e.createElementBlock("caption",ce,[e.createTextVNode(e.toDisplayString(t.title)+" - Total: "+e.toDisplayString(((p=(m=t.pagination)==null?void 0:m.meta)==null?void 0:p.total)||0)+" "+e.toDisplayString(t.itemName)+" ",1),t.enableRowSelection&&d.value>0?(e.openBlock(),e.createElementBlock("span",de," ("+e.toDisplayString(d.value)+" selected) ",1)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),e.createElementVNode("thead",ge,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(u).getHeaderGroups(),a=>(e.openBlock(),e.createElementBlock("tr",{key:a.id,class:"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.headers,c=>(e.openBlock(),e.createElementBlock("th",{key:c.id,colspan:c.colSpan,class:"h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0"},[c.isPlaceholder?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["flex items-center gap-2",c.column.getCanSort()?"cursor-pointer select-none hover:bg-gray-50 dark:hover:bg-gray-800 p-2 rounded transition-colors":""]),onClick:he=>c.column.getCanSort()?i("sortChange",c.column.id):void 0},[e.createVNode(e.unref(x.FlexRender),{render:c.column.columnDef.header,props:c.getContext()},null,8,["render","props"]),c.column.getCanSort()?(e.openBlock(),e.createElementBlock("div",pe,[e.createVNode(e.unref(y.ChevronUp),{class:e.normalizeClass(["w-3 h-3 transition-colors",t.sortBy===c.column.id&&t.sortDirection==="asc"?"text-gray-900 dark:text-gray-100":"text-gray-400"])},null,8,["class"]),e.createVNode(e.unref(y.ChevronDown),{class:e.normalizeClass(["w-3 h-3 -mt-1 transition-colors",t.sortBy===c.column.id&&t.sortDirection==="desc"?"text-gray-900 dark:text-gray-100":"text-gray-400"])},null,8,["class"])])):e.createCommentVNode("",!0)],10,me))],8,ue))),128))]))),128))]),e.createElementVNode("tbody",fe,[e.unref(u).getRowModel().rows.length>0?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(e.unref(u).getRowModel().rows,a=>(e.openBlock(),e.createElementBlock("tr",{key:a.id,class:e.normalizeClass(["border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",t.enableRowSelection&&a.getIsSelected()?"bg-blue-50 dark:bg-blue-900/20 border-l-4 border-l-blue-500":""])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.getVisibleCells(),c=>(e.openBlock(),e.createElementBlock("td",{key:c.id,class:"p-4 align-middle [&:has([role=checkbox])]:pr-0"},[e.createVNode(e.unref(x.FlexRender),{render:c.column.columnDef.cell,props:c.getContext()},null,8,["render","props"])]))),128))],2))),128)):(e.openBlock(),e.createElementBlock("tr",ye,[e.createElementVNode("td",{colspan:t.columns.length,class:"h-24 text-center"},e.toDisplayString(t.emptyStateText),9,be)]))])])]),e.createVNode(S,{pagination:t.pagination,"current-per-page":t.currentPerPage,"per-page-options":t.perPageOptions,"show-per-page-selector":t.showPerPageSelector,onPageChange:n[2]||(n[2]=a=>i("pageChange",a)),onPerPageChange:n[3]||(n[3]=a=>i("perPageChange",a))},null,8,["pagination","current-per-page","per-page-options","show-per-page-selector"])]))])}}});function xe(...t){return C.twMerge(B.clsx(t))}exports.DataTable=ke;exports.DataTablePagination=S;exports.cn=xe;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),x=require("@tanstack/vue-table"),y=require("lucide-vue-next"),B=require("clsx"),C=require("tailwind-merge"),E={class:"flex flex-col gap-4 px-2 py-4"},N={key:0,class:"flex justify-center"},V={class:"flex items-center gap-1",role:"navigation","aria-label":"pagination"},P=["disabled"],D=["disabled"],R={class:"flex items-center gap-1"},$=["onClick"],T={key:1,class:"inline-flex items-center justify-center h-10 min-w-10 px-3 text-gray-500"},j=["disabled"],F=["disabled"],L={class:"flex items-center justify-between text-sm text-gray-600 dark:text-gray-300"},z={key:0,class:"flex items-center gap-2"},I=["value"],M=["value"],O={key:1},S=e.defineComponent({__name:"DataTablePagination",props:{pagination:{default:null},perPageOptions:{default:()=>[10,15,25,50,100]},currentPerPage:{default:10},showPerPageSelector:{type:Boolean,default:!0}},emits:["pageChange","perPageChange"],setup(t,{emit:h}){const s=t,i=h,l=e.computed(()=>s.pagination?s.pagination.meta.current_page>1:!1),d=e.computed(()=>s.pagination?s.pagination.meta.current_page<s.pagination.meta.last_page:!1),f=e.computed(()=>{if(!s.pagination)return[];const g=s.pagination.meta.current_page,r=s.pagination.meta.last_page,o=2,n=[],m=[];let p;for(let a=1;a<=r;a++)(a===1||a===r||a>=g-o&&a<=g+o)&&n.push(a);for(const a of n)p&&(a-p===2?m.push(p+1):a-p!==1&&m.push("...")),m.push(a),p=a;return m}),k=g=>{typeof g=="number"&&i("pageChange",g)},u=()=>{l.value&&i("pageChange",1)},v=()=>{d.value&&s.pagination&&i("pageChange",s.pagination.meta.last_page)},w=()=>{l.value&&s.pagination&&i("pageChange",s.pagination.meta.current_page-1)},b=()=>{d.value&&s.pagination&&i("pageChange",s.pagination.meta.current_page+1)};return(g,r)=>(e.openBlock(),e.createElementBlock("div",E,[t.pagination&&t.pagination.meta.last_page>1?(e.openBlock(),e.createElementBlock("div",N,[e.createElementVNode("nav",V,[e.createElementVNode("button",{disabled:!l.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",l.value?"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200":"opacity-50 cursor-not-allowed text-gray-400 dark:text-gray-600"]),onClick:u},[e.createVNode(e.unref(y.ChevronsLeft),{class:"h-4 w-4"}),r[1]||(r[1]=e.createElementVNode("span",{class:"hidden sm:inline"},"First",-1))],10,P),e.createElementVNode("button",{disabled:!l.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",l.value?"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200":"opacity-50 cursor-not-allowed text-gray-400 dark:text-gray-600"]),onClick:w},[e.createVNode(e.unref(y.ChevronLeft),{class:"h-4 w-4"}),r[2]||(r[2]=e.createElementVNode("span",{class:"hidden sm:inline"},"Previous",-1))],10,D),e.createElementVNode("div",R,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,(o,n)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:n},[o!=="..."?(e.openBlock(),e.createElementBlock("button",{key:0,class:e.normalizeClass(["inline-flex items-center justify-center h-10 min-w-10 px-3 text-sm font-medium transition-colors rounded-md",o===t.pagination.meta.current_page?"bg-primary text-primary-foreground hover:bg-primary/90":"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200"]),onClick:m=>k(o)},e.toDisplayString(o),11,$)):(e.openBlock(),e.createElementBlock("span",T," ... "))],64))),128))]),e.createElementVNode("button",{disabled:!d.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",d.value?"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200":"opacity-50 cursor-not-allowed text-gray-400 dark:text-gray-600"]),onClick:b},[r[3]||(r[3]=e.createElementVNode("span",{class:"hidden sm:inline"},"Next",-1)),e.createVNode(e.unref(y.ChevronRight),{class:"h-4 w-4"})],10,j),e.createElementVNode("button",{disabled:!d.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",d.value?"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200":"opacity-50 cursor-not-allowed text-gray-400 dark:text-gray-600"]),onClick:v},[r[4]||(r[4]=e.createElementVNode("span",{class:"hidden sm:inline"},"Last",-1)),e.createVNode(e.unref(y.ChevronsRight),{class:"h-4 w-4"})],10,F)])])):e.createCommentVNode("",!0),e.createElementVNode("div",L,[e.createElementVNode("div",null,[t.pagination&&t.pagination.meta.total>0?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(" Showing "+e.toDisplayString(t.pagination.meta.from)+" to "+e.toDisplayString(t.pagination.meta.to)+" of "+e.toDisplayString(t.pagination.meta.total)+" entries ",1)],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(" No entries found ")],64))]),t.showPerPageSelector?(e.openBlock(),e.createElementBlock("div",z,[r[5]||(r[5]=e.createElementVNode("span",null,"Rows per page:",-1)),e.createElementVNode("select",{value:t.currentPerPage||t.perPageOptions[0],class:"h-10 rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",onChange:r[0]||(r[0]=o=>i("perPageChange",Number(o.target.value)||t.perPageOptions[0]))},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.perPageOptions,o=>(e.openBlock(),e.createElementBlock("option",{key:o,value:o},e.toDisplayString(o),9,M))),128))],40,I)])):e.createCommentVNode("",!0),t.pagination?(e.openBlock(),e.createElementBlock("div",O," Page "+e.toDisplayString(t.pagination.meta.current_page)+" of "+e.toDisplayString(t.pagination.meta.last_page),1)):e.createCommentVNode("",!0)])]))}}),q={class:"flex flex-col gap-4"},_={class:"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between"},A={class:"flex flex-col gap-2 sm:flex-row sm:items-center"},G={key:0,class:"relative w-full max-w-sm"},H={class:"pointer-events-none absolute inset-y-0 start-0 flex items-center ps-3"},U=["value"],W={class:"flex items-center gap-2"},J={class:"flex items-center"},K={key:0,class:"flex items-center justify-between p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg"},Q={class:"flex items-center gap-4"},X={class:"text-sm font-medium text-blue-700 dark:text-blue-300"},Y={class:"text-xs text-blue-600 dark:text-blue-400"},Z={class:"flex items-center gap-2"},ee={key:1,class:"flex items-center justify-center p-8"},te={class:"text-lg text-gray-700 dark:text-gray-200"},oe={key:2,class:"flex flex-col items-center p-8"},ne={class:"mb-2 text-lg text-red-600 dark:text-red-400"},ae={class:"mb-4 text-sm text-gray-600 dark:text-gray-300"},le={key:3,class:"rounded-lg border bg-white dark:bg-gray-900"},re={key:0,class:"relative"},se={class:"relative w-full overflow-auto"},ie={class:"w-full caption-bottom text-sm"},ce={key:0,class:"mt-4 text-sm text-muted-foreground"},de={key:0,class:"ml-2 text-blue-600 dark:text-blue-400"},ge={class:"[&_tr]:border-b"},ue=["colspan"],me=["onClick"],pe={key:0,class:"flex flex-col"},fe={class:"[&_tr:last-child]:border-0"},ye={key:1},ke=["colspan"],be=e.defineComponent({__name:"DataTable",props:{data:{default:()=>[]},columns:{},pagination:{default:null},isLoading:{type:Boolean,default:!1},error:{default:null},search:{default:""},currentPerPage:{default:10},perPageOptions:{default:()=>[10,15,25,50,100]},sortBy:{default:null},sortDirection:{default:"asc"},rowSelection:{default:()=>({})},enableRowSelection:{type:Boolean,default:!1},getRowId:{type:Function,default:t=>t.id},showSearch:{type:Boolean,default:!0},showCaption:{type:Boolean,default:!0},showPerPageSelector:{type:Boolean,default:!0},title:{default:"Items"},itemName:{default:"items"},loadingText:{default:"Loading..."},errorTitle:{default:"Error loading data"},emptyStateText:{default:"📭 No items found"}},emits:["pageChange","perPageChange","searchChange","sortChange","retry","update:rowSelection"],setup(t,{expose:h,emit:s}){const i=s,l=t,d=e.computed(()=>Object.keys(l.rowSelection||{}).filter(o=>{var n;return(n=l.rowSelection)==null?void 0:n[o]}).length),f=e.computed(()=>Object.keys(l.rowSelection||{}).filter(o=>{var n;return(n=l.rowSelection)==null?void 0:n[o]})),k=e.computed(()=>!l.data||!l.rowSelection?[]:l.data.filter(o=>l.rowSelection[l.getRowId(o)])),u=x.useVueTable({get data(){return l.data||[]},columns:l.columns,getCoreRowModel:x.getCoreRowModel(),enableSorting:!0,manualSorting:!0,enableRowSelection:l.enableRowSelection,getRowId:l.getRowId,state:{rowSelection:l.rowSelection||{}},onRowSelectionChange:o=>{const n=typeof o=="function"?o(l.rowSelection||{}):o;i("update:rowSelection",n)},enableMultiRowSelection:!0,enableSubRowSelection:!1}),v=()=>f.value,w=()=>k.value,b=()=>i("update:rowSelection",{}),g=()=>{const o={...l.rowSelection};u.getRowModel().rows.forEach(n=>{o[n.id]=!0}),i("update:rowSelection",o)},r=()=>{const o={...l.rowSelection};u.getRowModel().rows.forEach(n=>{delete o[n.id]}),i("update:rowSelection",o)};return h({getSelectedRowIds:v,getSelectedRowData:w,clearSelection:b,selectAllCurrentPage:g,deselectAllCurrentPage:r,selectedRowCount:d,selectedRowIds:f,selectedRowData:k,table:u}),(o,n)=>{var m,p;return e.openBlock(),e.createElementBlock("div",q,[e.createElementVNode("div",_,[e.createElementVNode("div",A,[t.showSearch?(e.openBlock(),e.createElementBlock("div",G,[e.createElementVNode("div",H,[e.createVNode(e.unref(y.Search),{class:"size-5 text-muted-foreground"})]),e.createElementVNode("input",{value:t.search,type:"text",placeholder:"Search...",class:"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 ps-10 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",onInput:n[0]||(n[0]=a=>i("searchChange",a.target.value))},null,40,U)])):e.createCommentVNode("",!0),e.createElementVNode("div",W,[e.renderSlot(o.$slots,"filters")])]),e.createElementVNode("div",J,[e.renderSlot(o.$slots,"header")])]),t.enableRowSelection&&d.value>0?(e.openBlock(),e.createElementBlock("div",K,[e.createElementVNode("div",Q,[e.createElementVNode("span",X,e.toDisplayString(d.value)+" "+e.toDisplayString(t.itemName)+" selected ",1),e.createElementVNode("div",Y," IDs: "+e.toDisplayString(f.value.slice(0,5).join(", "))+e.toDisplayString(f.value.length>5?"...":""),1)]),e.createElementVNode("div",Z,[e.renderSlot(o.$slots,"bulk-actions",{selectedIds:f.value,selectedData:k.value,selectedCount:d.value,clearSelection:b,selectAllCurrentPage:g,deselectAllCurrentPage:r}),o.$slots["bulk-actions"]?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("button",{key:0,onClick:b,class:"px-3 py-1 text-sm text-blue-700 dark:text-blue-300 hover:bg-blue-100 dark:hover:bg-blue-800 rounded transition-colors"}," Clear Selection "))])])):e.createCommentVNode("",!0),t.isLoading&&!t.data?(e.openBlock(),e.createElementBlock("div",ee,[n[4]||(n[4]=e.createElementVNode("div",{class:"w-8 h-8 mr-3 border-b-2 border-gray-900 dark:border-gray-100 rounded-full animate-spin"},null,-1)),e.createElementVNode("div",te,e.toDisplayString(t.loadingText),1)])):t.error?(e.openBlock(),e.createElementBlock("div",oe,[e.createElementVNode("div",ne,"❌ "+e.toDisplayString(t.errorTitle),1),e.createElementVNode("div",ae,e.toDisplayString(t.error.message),1),e.createElementVNode("button",{class:"px-4 py-2 text-white transition-colors bg-gray-900 rounded-md hover:bg-gray-800 dark:bg-gray-100 dark:text-gray-900 dark:hover:bg-gray-200",onClick:n[1]||(n[1]=a=>i("retry"))}," 🔄 Retry ")])):(e.openBlock(),e.createElementBlock("div",le,[t.isLoading?(e.openBlock(),e.createElementBlock("div",re,[...n[5]||(n[5]=[e.createElementVNode("div",{class:"absolute inset-0 z-10 flex items-center justify-center bg-white/70 dark:bg-gray-900/70 rounded-lg"},[e.createElementVNode("div",{class:"w-6 h-6 border-b-2 border-gray-900 dark:border-gray-100 rounded-full animate-spin"})],-1)])])):e.createCommentVNode("",!0),e.createElementVNode("div",se,[e.createElementVNode("table",ie,[t.showCaption?(e.openBlock(),e.createElementBlock("caption",ce,[e.createTextVNode(e.toDisplayString(t.title)+" - Total: "+e.toDisplayString(((p=(m=t.pagination)==null?void 0:m.meta)==null?void 0:p.total)||0)+" "+e.toDisplayString(t.itemName)+" ",1),t.enableRowSelection&&d.value>0?(e.openBlock(),e.createElementBlock("span",de," ("+e.toDisplayString(d.value)+" selected) ",1)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),e.createElementVNode("thead",ge,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(u).getHeaderGroups(),a=>(e.openBlock(),e.createElementBlock("tr",{key:a.id,class:"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.headers,c=>(e.openBlock(),e.createElementBlock("th",{key:c.id,colspan:c.colSpan,class:"h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0"},[c.isPlaceholder?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["flex items-center gap-2",c.column.getCanSort()?"cursor-pointer select-none hover:bg-gray-50 dark:hover:bg-gray-800 p-2 rounded transition-colors":""]),onClick:he=>c.column.getCanSort()?i("sortChange",c.column.id):void 0},[e.createVNode(e.unref(x.FlexRender),{render:c.column.columnDef.header,props:c.getContext()},null,8,["render","props"]),c.column.getCanSort()?(e.openBlock(),e.createElementBlock("div",pe,[e.createVNode(e.unref(y.ChevronUp),{class:e.normalizeClass(["w-3 h-3 transition-colors",t.sortBy===c.column.id&&t.sortDirection==="asc"?"text-gray-900 dark:text-gray-100":"text-gray-400"])},null,8,["class"]),e.createVNode(e.unref(y.ChevronDown),{class:e.normalizeClass(["w-3 h-3 -mt-1 transition-colors",t.sortBy===c.column.id&&t.sortDirection==="desc"?"text-gray-900 dark:text-gray-100":"text-gray-400"])},null,8,["class"])])):e.createCommentVNode("",!0)],10,me))],8,ue))),128))]))),128))]),e.createElementVNode("tbody",fe,[e.unref(u).getRowModel().rows.length>0?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(e.unref(u).getRowModel().rows,a=>(e.openBlock(),e.createElementBlock("tr",{key:a.id,class:e.normalizeClass(["border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",t.enableRowSelection&&a.getIsSelected()?"bg-blue-50 dark:bg-blue-900/20 border-l-4 border-l-blue-500":""])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.getVisibleCells(),c=>(e.openBlock(),e.createElementBlock("td",{key:c.id,class:"p-4 align-middle [&:has([role=checkbox])]:pr-0"},[e.createVNode(e.unref(x.FlexRender),{render:c.column.columnDef.cell,props:c.getContext()},null,8,["render","props"])]))),128))],2))),128)):(e.openBlock(),e.createElementBlock("tr",ye,[e.createElementVNode("td",{colspan:t.columns.length,class:"h-24 text-center"},e.toDisplayString(t.emptyStateText),9,ke)]))])])]),e.createVNode(S,{pagination:t.pagination,"current-per-page":t.currentPerPage,"per-page-options":t.perPageOptions,"show-per-page-selector":t.showPerPageSelector,onPageChange:n[2]||(n[2]=a=>i("pageChange",a)),onPerPageChange:n[3]||(n[3]=a=>i("perPageChange",a))},null,8,["pagination","current-per-page","per-page-options","show-per-page-selector"])]))])}}});function xe(...t){return C.twMerge(B.clsx(t))}exports.DataTable=be;exports.DataTablePagination=S;exports.cn=xe;
package/dist/index.mjs CHANGED
@@ -12,11 +12,11 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
12
12
  "aria-label": "pagination"
13
13
  }, K = ["disabled"], Q = ["disabled"], X = { class: "flex items-center gap-1" }, Y = ["onClick"], Z = {
14
14
  key: 1,
15
- class: "inline-flex items-center justify-center h-10 w-10 text-gray-500"
15
+ class: "inline-flex items-center justify-center h-10 min-w-10 px-3 text-gray-500"
16
16
  }, ee = ["disabled"], te = ["disabled"], oe = { class: "flex items-center justify-between text-sm text-gray-600 dark:text-gray-300" }, ae = {
17
17
  key: 0,
18
18
  class: "flex items-center gap-2"
19
- }, ne = ["value"], se = ["value"], re = { key: 1 }, le = /* @__PURE__ */ L({
19
+ }, ne = ["value"], re = ["value"], se = { key: 1 }, le = /* @__PURE__ */ L({
20
20
  __name: "DataTablePagination",
21
21
  props: {
22
22
  pagination: { default: null },
@@ -32,20 +32,20 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
32
32
  () => c.pagination ? c.pagination.meta.current_page < c.pagination.meta.last_page : !1
33
33
  ), C = P(() => {
34
34
  if (!c.pagination) return [];
35
- const x = c.pagination.meta.current_page, d = c.pagination.meta.last_page, o = 2, s = [], w = [];
35
+ const x = c.pagination.meta.current_page, d = c.pagination.meta.last_page, o = 2, r = [], w = [];
36
36
  let k;
37
- for (let r = 1; r <= d; r++)
38
- (r === 1 || r === d || r >= x - o && r <= x + o) && s.push(r);
39
- for (const r of s)
40
- k && (r - k === 2 ? w.push(k + 1) : r - k !== 1 && w.push("...")), w.push(r), k = r;
37
+ for (let s = 1; s <= d; s++)
38
+ (s === 1 || s === d || s >= x - o && s <= x + o) && r.push(s);
39
+ for (const s of r)
40
+ k && (s - k === 2 ? w.push(k + 1) : s - k !== 1 && w.push("...")), w.push(s), k = s;
41
41
  return w;
42
42
  }), R = (x) => {
43
43
  typeof x == "number" && g("pageChange", x);
44
44
  }, v = () => {
45
45
  l.value && g("pageChange", 1);
46
- }, j = () => {
47
- m.value && c.pagination && g("pageChange", c.pagination.meta.last_page);
48
46
  }, D = () => {
47
+ m.value && c.pagination && g("pageChange", c.pagination.meta.last_page);
48
+ }, j = () => {
49
49
  l.value && c.pagination && g("pageChange", c.pagination.meta.current_page - 1);
50
50
  }, $ = () => {
51
51
  m.value && c.pagination && g("pageChange", c.pagination.meta.current_page + 1);
@@ -70,18 +70,18 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
70
70
  "inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",
71
71
  l.value ? "hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200" : "opacity-50 cursor-not-allowed text-gray-400 dark:text-gray-600"
72
72
  ]),
73
- onClick: D
73
+ onClick: j
74
74
  }, [
75
75
  y(f(E), { class: "h-4 w-4" }),
76
76
  d[2] || (d[2] = t("span", { class: "hidden sm:inline" }, "Previous", -1))
77
77
  ], 10, Q),
78
78
  t("div", X, [
79
- (n(!0), a(p, null, S(C.value, (o, s) => (n(), a(p, { key: s }, [
79
+ (n(!0), a(p, null, S(C.value, (o, r) => (n(), a(p, { key: r }, [
80
80
  o !== "..." ? (n(), a("button", {
81
81
  key: 0,
82
82
  class: h([
83
- "inline-flex items-center justify-center h-10 w-10 text-sm font-medium transition-colors rounded-md",
84
- o === e.pagination.meta.current_page ? "bg-blue-500 text-white hover:bg-blue-600" : "hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200"
83
+ "inline-flex items-center justify-center h-10 min-w-10 px-3 text-sm font-medium transition-colors rounded-md",
84
+ o === e.pagination.meta.current_page ? "bg-primary text-primary-foreground hover:bg-primary/90" : "hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200"
85
85
  ]),
86
86
  onClick: (w) => R(o)
87
87
  }, i(o), 11, Y)) : (n(), a("span", Z, " ... "))
@@ -104,7 +104,7 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
104
104
  "inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",
105
105
  m.value ? "hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200" : "opacity-50 cursor-not-allowed text-gray-400 dark:text-gray-600"
106
106
  ]),
107
- onClick: j
107
+ onClick: D
108
108
  }, [
109
109
  d[4] || (d[4] = t("span", { class: "hidden sm:inline" }, "Last", -1)),
110
110
  y(f(_), { class: "h-4 w-4" })
@@ -129,17 +129,17 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
129
129
  (n(!0), a(p, null, S(e.perPageOptions, (o) => (n(), a("option", {
130
130
  key: o,
131
131
  value: o
132
- }, i(o), 9, se))), 128))
132
+ }, i(o), 9, re))), 128))
133
133
  ], 40, ne)
134
134
  ])) : b("", !0),
135
- e.pagination ? (n(), a("div", re, " Page " + i(e.pagination.meta.current_page) + " of " + i(e.pagination.meta.last_page), 1)) : b("", !0)
135
+ e.pagination ? (n(), a("div", se, " Page " + i(e.pagination.meta.current_page) + " of " + i(e.pagination.meta.last_page), 1)) : b("", !0)
136
136
  ])
137
137
  ]));
138
138
  }
139
139
  }), ie = { class: "flex flex-col gap-4" }, de = { class: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between" }, ce = { class: "flex flex-col gap-2 sm:flex-row sm:items-center" }, ge = {
140
140
  key: 0,
141
- class: "relative items-center w-full max-w-sm"
142
- }, ue = ["value"], me = { class: "absolute inset-y-0 flex items-center justify-center px-2 start-0" }, fe = { class: "flex items-center gap-2" }, be = { class: "flex items-center" }, ye = {
141
+ class: "relative w-full max-w-sm"
142
+ }, ue = { class: "pointer-events-none absolute inset-y-0 start-0 flex items-center ps-3" }, me = ["value"], fe = { class: "flex items-center gap-2" }, be = { class: "flex items-center" }, ye = {
143
143
  key: 0,
144
144
  class: "flex items-center justify-between p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg"
145
145
  }, xe = { class: "flex items-center gap-4" }, he = { class: "text-sm font-medium text-blue-700 dark:text-blue-300" }, pe = { class: "text-xs text-blue-600 dark:text-blue-400" }, ve = { class: "flex items-center gap-2" }, we = {
@@ -154,7 +154,7 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
154
154
  }, $e = {
155
155
  key: 0,
156
156
  class: "relative"
157
- }, Te = { class: "relative w-full overflow-auto" }, je = { class: "w-full caption-bottom text-sm" }, De = {
157
+ }, Te = { class: "relative w-full overflow-auto" }, De = { class: "w-full caption-bottom text-sm" }, je = {
158
158
  key: 0,
159
159
  class: "mt-4 text-sm text-muted-foreground"
160
160
  }, Ne = {
@@ -191,11 +191,11 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
191
191
  emits: ["pageChange", "perPageChange", "searchChange", "sortChange", "retry", "update:rowSelection"],
192
192
  setup(e, { expose: T, emit: c }) {
193
193
  const g = c, l = e, m = P(() => Object.keys(l.rowSelection || {}).filter((o) => {
194
- var s;
195
- return (s = l.rowSelection) == null ? void 0 : s[o];
194
+ var r;
195
+ return (r = l.rowSelection) == null ? void 0 : r[o];
196
196
  }).length), C = P(() => Object.keys(l.rowSelection || {}).filter((o) => {
197
- var s;
198
- return (s = l.rowSelection) == null ? void 0 : s[o];
197
+ var r;
198
+ return (r = l.rowSelection) == null ? void 0 : r[o];
199
199
  })), R = P(() => !l.data || !l.rowSelection ? [] : l.data.filter((o) => l.rowSelection[l.getRowId(o)])), v = M({
200
200
  get data() {
201
201
  return l.data || [];
@@ -210,25 +210,25 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
210
210
  rowSelection: l.rowSelection || {}
211
211
  },
212
212
  onRowSelectionChange: (o) => {
213
- const s = typeof o == "function" ? o(l.rowSelection || {}) : o;
214
- g("update:rowSelection", s);
213
+ const r = typeof o == "function" ? o(l.rowSelection || {}) : o;
214
+ g("update:rowSelection", r);
215
215
  },
216
216
  enableMultiRowSelection: !0,
217
217
  enableSubRowSelection: !1
218
- }), j = () => C.value, D = () => R.value, $ = () => g("update:rowSelection", {}), x = () => {
218
+ }), D = () => C.value, j = () => R.value, $ = () => g("update:rowSelection", {}), x = () => {
219
219
  const o = { ...l.rowSelection };
220
- v.getRowModel().rows.forEach((s) => {
221
- o[s.id] = !0;
220
+ v.getRowModel().rows.forEach((r) => {
221
+ o[r.id] = !0;
222
222
  }), g("update:rowSelection", o);
223
223
  }, d = () => {
224
224
  const o = { ...l.rowSelection };
225
- v.getRowModel().rows.forEach((s) => {
226
- delete o[s.id];
225
+ v.getRowModel().rows.forEach((r) => {
226
+ delete o[r.id];
227
227
  }), g("update:rowSelection", o);
228
228
  };
229
229
  return T({
230
- getSelectedRowIds: j,
231
- getSelectedRowData: D,
230
+ getSelectedRowIds: D,
231
+ getSelectedRowData: j,
232
232
  clearSelection: $,
233
233
  selectAllCurrentPage: x,
234
234
  deselectAllCurrentPage: d,
@@ -236,22 +236,22 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
236
236
  selectedRowIds: C,
237
237
  selectedRowData: R,
238
238
  table: v
239
- }), (o, s) => {
239
+ }), (o, r) => {
240
240
  var w, k;
241
241
  return n(), a("div", ie, [
242
242
  t("div", de, [
243
243
  t("div", ce, [
244
244
  e.showSearch ? (n(), a("div", ge, [
245
+ t("div", ue, [
246
+ y(f(z), { class: "size-5 text-muted-foreground" })
247
+ ]),
245
248
  t("input", {
246
249
  value: e.search,
247
250
  type: "text",
248
251
  placeholder: "Search...",
249
- class: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 pl-10 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
250
- onInput: s[0] || (s[0] = (r) => g("searchChange", r.target.value))
251
- }, null, 40, ue),
252
- t("span", me, [
253
- y(f(z), { class: "size-6 text-gray-400" })
254
- ])
252
+ class: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 ps-10 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
253
+ onInput: r[0] || (r[0] = (s) => g("searchChange", s.target.value))
254
+ }, null, 40, me)
255
255
  ])) : b("", !0),
256
256
  t("div", fe, [
257
257
  N(o.$slots, "filters")
@@ -283,33 +283,33 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
283
283
  ])
284
284
  ])) : b("", !0),
285
285
  e.isLoading && !e.data ? (n(), a("div", we, [
286
- s[4] || (s[4] = t("div", { class: "w-8 h-8 mr-3 border-b-2 border-gray-900 dark:border-gray-100 rounded-full animate-spin" }, null, -1)),
286
+ r[4] || (r[4] = t("div", { class: "w-8 h-8 mr-3 border-b-2 border-gray-900 dark:border-gray-100 rounded-full animate-spin" }, null, -1)),
287
287
  t("div", ke, i(e.loadingText), 1)
288
288
  ])) : e.error ? (n(), a("div", Ce, [
289
289
  t("div", Se, "❌ " + i(e.errorTitle), 1),
290
290
  t("div", Pe, i(e.error.message), 1),
291
291
  t("button", {
292
292
  class: "px-4 py-2 text-white transition-colors bg-gray-900 rounded-md hover:bg-gray-800 dark:bg-gray-100 dark:text-gray-900 dark:hover:bg-gray-200",
293
- onClick: s[1] || (s[1] = (r) => g("retry"))
293
+ onClick: r[1] || (r[1] = (s) => g("retry"))
294
294
  }, " 🔄 Retry ")
295
295
  ])) : (n(), a("div", Re, [
296
- e.isLoading ? (n(), a("div", $e, [...s[5] || (s[5] = [
296
+ e.isLoading ? (n(), a("div", $e, [...r[5] || (r[5] = [
297
297
  t("div", { class: "absolute inset-0 z-10 flex items-center justify-center bg-white/70 dark:bg-gray-900/70 rounded-lg" }, [
298
298
  t("div", { class: "w-6 h-6 border-b-2 border-gray-900 dark:border-gray-100 rounded-full animate-spin" })
299
299
  ], -1)
300
300
  ])])) : b("", !0),
301
301
  t("div", Te, [
302
- t("table", je, [
303
- e.showCaption ? (n(), a("caption", De, [
302
+ t("table", De, [
303
+ e.showCaption ? (n(), a("caption", je, [
304
304
  B(i(e.title) + " - Total: " + i(((k = (w = e.pagination) == null ? void 0 : w.meta) == null ? void 0 : k.total) || 0) + " " + i(e.itemName) + " ", 1),
305
305
  e.enableRowSelection && m.value > 0 ? (n(), a("span", Ne, " (" + i(m.value) + " selected) ", 1)) : b("", !0)
306
306
  ])) : b("", !0),
307
307
  t("thead", Be, [
308
- (n(!0), a(p, null, S(f(v).getHeaderGroups(), (r) => (n(), a("tr", {
309
- key: r.id,
308
+ (n(!0), a(p, null, S(f(v).getHeaderGroups(), (s) => (n(), a("tr", {
309
+ key: s.id,
310
310
  class: "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted"
311
311
  }, [
312
- (n(!0), a(p, null, S(r.headers, (u) => (n(), a("th", {
312
+ (n(!0), a(p, null, S(s.headers, (u) => (n(), a("th", {
313
313
  key: u.id,
314
314
  colspan: u.colSpan,
315
315
  class: "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0"
@@ -345,14 +345,14 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
345
345
  ]))), 128))
346
346
  ]),
347
347
  t("tbody", Oe, [
348
- f(v).getRowModel().rows.length > 0 ? (n(!0), a(p, { key: 0 }, S(f(v).getRowModel().rows, (r) => (n(), a("tr", {
349
- key: r.id,
348
+ f(v).getRowModel().rows.length > 0 ? (n(!0), a(p, { key: 0 }, S(f(v).getRowModel().rows, (s) => (n(), a("tr", {
349
+ key: s.id,
350
350
  class: h([
351
351
  "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
352
- e.enableRowSelection && r.getIsSelected() ? "bg-blue-50 dark:bg-blue-900/20 border-l-4 border-l-blue-500" : ""
352
+ e.enableRowSelection && s.getIsSelected() ? "bg-blue-50 dark:bg-blue-900/20 border-l-4 border-l-blue-500" : ""
353
353
  ])
354
354
  }, [
355
- (n(!0), a(p, null, S(r.getVisibleCells(), (u) => (n(), a("td", {
355
+ (n(!0), a(p, null, S(s.getVisibleCells(), (u) => (n(), a("td", {
356
356
  key: u.id,
357
357
  class: "p-4 align-middle [&:has([role=checkbox])]:pr-0"
358
358
  }, [
@@ -375,8 +375,8 @@ const W = { class: "flex flex-col gap-4 px-2 py-4" }, q = {
375
375
  "current-per-page": e.currentPerPage,
376
376
  "per-page-options": e.perPageOptions,
377
377
  "show-per-page-selector": e.showPerPageSelector,
378
- onPageChange: s[2] || (s[2] = (r) => g("pageChange", r)),
379
- onPerPageChange: s[3] || (s[3] = (r) => g("perPageChange", r))
378
+ onPageChange: r[2] || (r[2] = (s) => g("pageChange", s)),
379
+ onPerPageChange: r[3] || (r[3] = (s) => g("perPageChange", s))
380
380
  }, null, 8, ["pagination", "current-per-page", "per-page-options", "show-per-page-selector"])
381
381
  ]))
382
382
  ]);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@toniel/laravel-tanstack-datatable",
3
- "version": "0.1.0",
3
+ "version": "0.1.2",
4
4
  "description": "Vue 3 DataTable components for Laravel pagination with TanStack Query and shadcn-vue",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",