@toniel/laravel-tanstack-datatable 0.1.4 → 0.1.6

package/dist/components/DataTable.vue.d.ts

@@ -10,7 +10,7 @@ interface Props {
     currentPerPage?: number;
     perPageOptions?: number[];
     sortBy?: string | null;
-    sortDirection?: 'asc' | 'desc';
+    sortDirection?: "asc" | "desc";
     rowSelection?: RowSelectionState;
     enableRowSelection?: boolean;
     getRowId?: (row: any) => string;

package/dist/components/DataTable.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.vue.d.ts","sourceRoot":"","sources":["../../src/components/DataTable.vue"],"names":[],"mappings":"AA4WA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,qCAAqC,CAAA;AACpF,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,iBAAiB,EACvB,MAAM,qBAAqB,CAAA;AAK5B,UAAU,KAAK;IACb,IAAI,CAAC,EAAE,GAAG,EAAE,CAAA;IACZ,OAAO,EAAE,SAAS,CAAC,GAAG,CAAC,EAAE,CAAA;IACzB,UAAU,CAAC,EAAE,yBAAyB,GAAG,IAAI,CAAA;IAC7C,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,CAAA;IACpB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,aAAa,CAAC,EAAE,KAAK,GAAG,MAAM,CAAA;IAG9B,YAAY,CAAC,EAAE,iBAAiB,CAAA;IAChC,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,MAAM,CAAA;IAG/B,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAG7B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AA8ID,iBAAS,cAAc;WA8TT,OAAO,IAA6B;;yBAZrB,GAAG;wBACJ,GAAG;;;;;;;;YACK,GAAG;;;;EAetC;AAsBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;gBAjgBN,yBAAyB,GAAG,IAAI;oBAK5B,MAAM,EAAE;oBADR,MAAM;yBAaD,OAAO;YAdpB,MAAM;UALR,GAAG,EAAE;WAsBJ,MAAM;eAnBF,OAAO;WACX,KAAK,GAAG,IAAI;YAIX,MAAM,GAAG,IAAI;mBACN,KAAK,GAAG,MAAM;kBAGf,iBAAiB;wBACX,OAAO;cACjB,CAAC,GAAG,EAAE,GAAG,KAAK,MAAM;gBAGlB,OAAO;iBACN,OAAO;cAKV,MAAM;iBACH,MAAM;gBACP,MAAM;oBACF,MAAM;wFAmfvB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"DataTable.vue.d.ts","sourceRoot":"","sources":["../../src/components/DataTable.vue"],"names":[],"mappings":"AA4YA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,qCAAqC,CAAC;AACrF,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,iBAAiB,EACvB,MAAM,qBAAqB,CAAC;AAK7B,UAAU,KAAK;IACb,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,OAAO,EAAE,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC;IAC1B,UAAU,CAAC,EAAE,yBAAyB,GAAG,IAAI,CAAC;IAC9C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,aAAa,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IAG/B,YAAY,CAAC,EAAE,iBAAiB,CAAC;IACjC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,MAAM,CAAC;IAGhC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAG9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAmJD,iBAAS,cAAc;WA4VT,OAAO,IAA6B;;yBAZrB,GAAG;wBACJ,GAAG;;;;;;;;YACK,GAAG;;;;EAetC;AAuBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;gBAriBN,yBAAyB,GAAG,IAAI;oBAK5B,MAAM,EAAE;oBADR,MAAM;yBAaD,OAAO;YAdpB,MAAM;UALR,GAAG,EAAE;WAsBJ,MAAM;eAnBF,OAAO;WACX,KAAK,GAAG,IAAI;YAIX,MAAM,GAAG,IAAI;mBACN,KAAK,GAAG,MAAM;kBAGf,iBAAiB;wBACX,OAAO;cACjB,CAAC,GAAG,EAAE,GAAG,KAAK,MAAM;gBAGlB,OAAO;iBACN,OAAO;cAKV,MAAM;iBACH,MAAM;gBACP,MAAM;oBACF,MAAM;wFAuhBvB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/DataTablePagination.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataTablePagination.vue.d.ts","sourceRoot":"","sources":["../../src/components/DataTablePagination.vue"],"names":[],"mappings":"AAwOA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,qCAAqC,CAAA;AAIpF,UAAU,KAAK;IACb,UAAU,CAAC,EAAE,yBAAyB,GAAG,IAAI,CAAA;IAC7C,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B;;;;;;;;gBAJc,yBAAyB,GAAG,IAAI;oBAC5B,MAAM,EAAE;oBACR,MAAM;yBACD,OAAO;;AAuT/B,wBASG"}
+{"version":3,"file":"DataTablePagination.vue.d.ts","sourceRoot":"","sources":["../../src/components/DataTablePagination.vue"],"names":[],"mappings":"AAyOA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,qCAAqC,CAAA;AAIpF,UAAU,KAAK;IACb,UAAU,CAAC,EAAE,yBAAyB,GAAG,IAAI,CAAA;IAC7C,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B;;;;;;;;gBAJc,yBAAyB,GAAG,IAAI;oBAC5B,MAAM,EAAE;oBACR,MAAM;yBACD,OAAO;;AAmT/B,wBASG"}

package/dist/composables/useDarkMode.d.ts

@@ -0,0 +1,5 @@
+export declare function useDarkMode(): {
+    isDarkMode: import('vue').Ref<boolean, boolean>;
+    toggleDarkMode: () => void;
+};
+//# sourceMappingURL=useDarkMode.d.ts.map

package/dist/composables/useDarkMode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDarkMode.d.ts","sourceRoot":"","sources":["../../src/composables/useDarkMode.ts"],"names":[],"mappings":"AAEA,wBAAgB,WAAW;;;EA8B1B"}

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+export { useDarkMode } from './composables/useDarkMode';
 export { default as DataTable } from './components/DataTable.vue';
 export { default as DataTablePagination } from './components/DataTablePagination.vue';
 export { cn } from './lib/utils';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,4BAA4B,CAAA;AACjE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,sCAAsC,CAAA;AAGrF,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAGvD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,4BAA4B,CAAA;AACjE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,sCAAsC,CAAA;AAGrF,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAA"}

package/dist/index.js

@@ -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"),S=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"},I={key:0,class:"flex items-center gap-2"},z=["value"],M=["value"],O={key:1},B=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",I,[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,z)])):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"},A={class:"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between"},G={class:"flex flex-col gap-2 sm:flex-row sm:items-center"},_={key:0,class:"relative w-full max-w-sm"},H=["value"],U={class:"flex items-center gap-2"},W={class:"flex items-center"},J={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"},K={class:"flex items-center gap-4"},Q={class:"text-sm font-medium text-blue-700 dark:text-blue-300"},X={class:"text-xs text-blue-600 dark:text-blue-400"},Y={class:"flex items-center gap-2"},Z={key:1,class:"flex items-center justify-center p-8"},ee={class:"text-lg text-gray-700 dark:text-gray-200"},te={key:2,class:"flex flex-col items-center p-8"},oe={class:"mb-2 text-lg text-red-600 dark:text-red-400"},ne={class:"mb-4 text-sm text-gray-600 dark:text-gray-300"},ae={key:3,class:"rounded-lg border bg-white dark:bg-gray-900"},le={key:0,class:"relative"},re={class:"relative w-full overflow-auto"},se={class:"w-full caption-bottom text-sm"},ie={key:0,class:"mt-4 text-sm text-muted-foreground"},ce={key:0,class:"ml-2 text-blue-600 dark:text-blue-400"},de={class:"[&_tr]:border-b"},ge=["colspan"],ue=["onClick"],me={key:0,class:"flex flex-col"},pe={class:"[&_tr:last-child]:border-0"},fe={key:1},ye=["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]})),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",A,[e.createElementVNode("div",G,[t.showSearch?(e.openBlock(),e.createElementBlock("div",_,[e.createElementVNode("input",{value:t.search,type:"search",placeholder:"Search...",class:"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 ps-14 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.createCommentVNode("",!0),e.createElementVNode("div",U,[e.renderSlot(o.$slots,"filters")])]),e.createElementVNode("div",W,[e.renderSlot(o.$slots,"header")])]),t.enableRowSelection&&d.value>0?(e.openBlock(),e.createElementBlock("div",J,[e.createElementVNode("div",K,[e.createElementVNode("span",Q,e.toDisplayString(d.value)+" "+e.toDisplayString(t.itemName)+" selected ",1),e.createElementVNode("div",X," IDs: "+e.toDisplayString(f.value.slice(0,5).join(", "))+e.toDisplayString(f.value.length>5?"...":""),1)]),e.createElementVNode("div",Y,[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",Z,[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",ee,e.toDisplayString(t.loadingText),1)])):t.error?(e.openBlock(),e.createElementBlock("div",te,[e.createElementVNode("div",oe,"❌ "+e.toDisplayString(t.errorTitle),1),e.createElementVNode("div",ne,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",ae,[t.isLoading?(e.openBlock(),e.createElementBlock("div",le,[...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",re,[e.createElementVNode("table",se,[t.showCaption?(e.openBlock(),e.createElementBlock("caption",ie,[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",ce," ("+e.toDisplayString(d.value)+" selected) ",1)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),e.createElementVNode("thead",de,[(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:xe=>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",me,[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,ue))],8,ge))),128))]))),128))]),e.createElementVNode("tbody",pe,[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",fe,[e.createElementVNode("td",{colspan:t.columns.length,class:"h-24 text-center"},e.toDisplayString(t.emptyStateText),9,ye)]))])])]),e.createVNode(B,{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 be(...t){return C.twMerge(S.clsx(t))}exports.DataTable=ke;exports.DataTablePagination=B;exports.cn=be;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),x=require("@tanstack/vue-table"),k=require("lucide-vue-next"),E=require("clsx"),C=require("tailwind-merge");function S(){const t=e.ref(!1);if(typeof window<"u"){const r=window.matchMedia("(prefers-color-scheme: dark)");t.value=r.matches,r.addEventListener("change",s=>{t.value=s.matches})}e.watchEffect(()=>{typeof document<"u"&&(t.value?document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark"))});function b(){t.value=!t.value}return{isDarkMode:t,toggleDarkMode:b}}const N={class:"flex flex-col items-center justify-between gap-4 px-2 py-2 sm:flex-row text-foreground bg-background"},V={class:"text-sm text-muted-foreground"},P={class:"flex flex-col items-center gap-4 sm:flex-row"},D={key:0,class:"flex items-center gap-2"},R=["value"],$=["value"],T={key:1,class:"flex items-center justify-center"},L={class:"flex items-center gap-1",role:"navigation","aria-label":"pagination"},j=["disabled"],M=["disabled"],F={class:"hidden items-center gap-1 sm:flex"},z=["onClick"],I={key:1,class:"inline-flex items-center justify-center h-10 min-w-10 px-3 text-muted-foreground"},O=["disabled"],q=["disabled"],B=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:b}){const r=t,s=b,l=e.computed(()=>r.pagination?r.pagination.meta.current_page>1:!1),d=e.computed(()=>r.pagination?r.pagination.meta.current_page<r.pagination.meta.last_page:!1),p=e.computed(()=>{if(!r.pagination)return[];const u=r.pagination.meta.current_page,c=r.pagination.meta.last_page,o=2,n=[],m=[];let f;for(let a=1;a<=c;a++)(a===1||a===c||a>=u-o&&a<=u+o)&&n.push(a);for(const a of n)f&&(a-f===2?m.push(f+1):a-f!==1&&m.push("...")),m.push(a),f=a;return m}),h=u=>{typeof u=="number"&&s("pageChange",u)},g=()=>{l.value&&s("pageChange",1)},v=()=>{d.value&&r.pagination&&s("pageChange",r.pagination.meta.last_page)},w=()=>{l.value&&r.pagination&&s("pageChange",r.pagination.meta.current_page-1)},y=()=>{d.value&&r.pagination&&s("pageChange",r.pagination.meta.current_page+1)};return(u,c)=>(e.openBlock(),e.createElementBlock("div",N,[e.createElementVNode("div",V,[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 to show ")],64))]),e.createElementVNode("div",P,[t.showPerPageSelector?(e.openBlock(),e.createElementBlock("div",D,[c[1]||(c[1]=e.createElementVNode("span",{class:"text-sm"},"Rows per page:",-1)),e.createElementVNode("select",{value:t.currentPerPage||t.perPageOptions[0],class:"h-10 rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",onChange:c[0]||(c[0]=o=>s("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,$))),128))],40,R)])):e.createCommentVNode("",!0),t.pagination&&t.pagination.meta.last_page>1?(e.openBlock(),e.createElementBlock("div",T,[e.createElementVNode("nav",L,[e.createElementVNode("button",{disabled:!l.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 w-10 text-sm font-medium transition-colors rounded-md p-2",l.value?"hover:bg-accent hover:text-accent-foreground":"opacity-50 cursor-not-allowed"]),onClick:g},[e.createVNode(e.unref(k.ChevronsLeft),{class:"h-5 w-5"}),c[2]||(c[2]=e.createElementVNode("span",{class:"sr-only"},"First",-1))],10,j),e.createElementVNode("button",{disabled:!l.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 w-10 text-sm font-medium transition-colors rounded-md p-2",l.value?"hover:bg-accent hover:text-accent-foreground":"opacity-50 cursor-not-allowed"]),onClick:w},[e.createVNode(e.unref(k.ChevronLeft),{class:"h-5 w-5"}),c[3]||(c[3]=e.createElementVNode("span",{class:"sr-only"},"Previous",-1))],10,M),e.createElementVNode("div",F,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.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-accent hover:text-accent-foreground"]),onClick:m=>h(o)},e.toDisplayString(o),11,z)):(e.openBlock(),e.createElementBlock("span",I," ... "))],64))),128))]),e.createElementVNode("button",{disabled:!d.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 w-10 text-sm font-medium transition-colors rounded-md p-2",d.value?"hover:bg-accent hover:text-accent-foreground":"opacity-50 cursor-not-allowed"]),onClick:y},[e.createVNode(e.unref(k.ChevronRight),{class:"h-5 w-5"}),c[4]||(c[4]=e.createElementVNode("span",{class:"sr-only"},"Next",-1))],10,O),e.createElementVNode("button",{disabled:!d.value,class:e.normalizeClass(["inline-flex items-center justify-center gap-1 h-10 w-10 text-sm font-medium transition-colors rounded-md p-2",d.value?"hover:bg-accent hover:text-accent-foreground":"opacity-50 cursor-not-allowed"]),onClick:v},[e.createVNode(e.unref(k.ChevronsRight),{class:"h-5 w-5"}),c[5]||(c[5]=e.createElementVNode("span",{class:"sr-only"},"Last",-1))],10,q)])])):e.createCommentVNode("",!0)])]))}}),_={class:"flex flex-col gap-4 bg-background text-foreground"},A={class:"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between"},G={class:"flex flex-col gap-2 sm:flex-row sm:items-center"},U={key:0,class:"relative w-full max-w-sm"},H=["value"],Q={class:"flex items-center gap-2"},W={class:"flex items-center"},J={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"},K={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-background dark:border-gray-700"},re={key:0,class:"relative"},se={class:"relative w-full overflow-auto"},ce={class:"w-full caption-bottom text-sm"},ie={key:0,class:"mt-4 text-sm text-muted-foreground dark:text-gray-400"},de={key:0,class:"ml-2 text-blue-600 dark:text-blue-400"},ue={class:"[&_tr]:border-b bg-muted"},ge=["colspan"],me=["onClick"],fe={key:0},pe={class:"[&_tr:last-child]:border-0 dark:[&_tr:last-child]:border-0"},ke={key:1},be=["colspan"],he={key:1,class:"border-t"},ye=["colspan"],xe=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:b,emit:r}){const s=r,l=t,d=e.computed(()=>Object.keys(l.rowSelection||{}).filter(o=>{var n;return(n=l.rowSelection)==null?void 0:n[o]}).length),p=e.computed(()=>Object.keys(l.rowSelection||{}).filter(o=>{var n;return(n=l.rowSelection)==null?void 0:n[o]})),h=e.computed(()=>!l.data||!l.rowSelection?[]:l.data.filter(o=>l.rowSelection[l.getRowId(o)])),g=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;s("update:rowSelection",n)},enableMultiRowSelection:!0,enableSubRowSelection:!1}),v=()=>p.value,w=()=>h.value,y=()=>s("update:rowSelection",{}),u=()=>{const o={...l.rowSelection};g.getRowModel().rows.forEach(n=>{o[n.id]=!0}),s("update:rowSelection",o)},c=()=>{const o={...l.rowSelection};g.getRowModel().rows.forEach(n=>{delete o[n.id]}),s("update:rowSelection",o)};return b({getSelectedRowIds:v,getSelectedRowData:w,clearSelection:y,selectAllCurrentPage:u,deselectAllCurrentPage:c,selectedRowCount:d,selectedRowIds:p,selectedRowData:h,table:g}),(o,n)=>{var m,f;return e.openBlock(),e.createElementBlock("div",_,[e.createElementVNode("div",A,[e.createElementVNode("div",G,[t.showSearch?(e.openBlock(),e.createElementBlock("div",U,[e.createElementVNode("input",{value:t.search,type:"search",placeholder:"Search...",class:"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 ps-14 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 dark:bg-gray-800 dark:text-gray-200 dark:placeholder:text-gray-400",onInput:n[0]||(n[0]=a=>s("searchChange",a.target.value))},null,40,H)])):e.createCommentVNode("",!0),e.createElementVNode("div",Q,[e.renderSlot(o.$slots,"filters")])]),e.createElementVNode("div",W,[e.renderSlot(o.$slots,"header")])]),t.enableRowSelection&&d.value>0?(e.openBlock(),e.createElementBlock("div",J,[e.createElementVNode("div",K,[e.createElementVNode("span",X,e.toDisplayString(d.value)+" "+e.toDisplayString(t.itemName)+" selected ",1),e.createElementVNode("div",Y," IDs: "+e.toDisplayString(p.value.slice(0,5).join(", "))+e.toDisplayString(p.value.length>5?"...":""),1)]),e.createElementVNode("div",Z,[e.renderSlot(o.$slots,"bulk-actions",{selectedIds:p.value,selectedData:h.value,selectedCount:d.value,clearSelection:y,selectAllCurrentPage:u,deselectAllCurrentPage:c}),o.$slots["bulk-actions"]?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("button",{key:0,onClick:y,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=>s("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",ce,[t.showCaption?(e.openBlock(),e.createElementBlock("caption",ie,[e.createTextVNode(e.toDisplayString(t.title)+" - Total: "+e.toDisplayString(((f=(m=t.pagination)==null?void 0:m.meta)==null?void 0:f.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",ue,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(g).getHeaderGroups(),a=>(e.openBlock(),e.createElementBlock("tr",{key:a.id,class:"border-b transition-colors"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.headers,i=>(e.openBlock(),e.createElementBlock("th",{key:i.id,colspan:i.colSpan,class:"h-12 px-4 text-left align-middle font-bold text-muted-foreground [&:has([role=checkbox])]:pr-0"},[i.isPlaceholder?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["flex items-center gap-2",i.column.getCanSort()?"cursor-pointer select-none hover:bg-accent p-2 rounded transition-colors":""]),onClick:we=>i.column.getCanSort()?s("sortChange",i.column.id):void 0},[e.createVNode(e.unref(x.FlexRender),{render:i.column.columnDef.header,props:i.getContext()},null,8,["render","props"]),i.column.getCanSort()?(e.openBlock(),e.createElementBlock("div",fe,[t.sortBy!==i.column.id?(e.openBlock(),e.createBlock(e.unref(k.ChevronsUpDown),{key:0,size:10,class:"text-gray-400"})):t.sortBy===i.column.id&&t.sortDirection==="asc"?(e.openBlock(),e.createBlock(e.unref(k.ChevronUp),{key:1,size:10,class:"text-gray-900 dark:text-gray-100"})):t.sortBy===i.column.id&&t.sortDirection==="desc"?(e.openBlock(),e.createBlock(e.unref(k.ChevronDown),{key:2,size:10,class:"text-gray-900 dark:text-gray-100"})):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],10,me))],8,ge))),128))]))),128))]),e.createElementVNode("tbody",pe,[e.unref(g).getRowModel().rows.length>0?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(e.unref(g).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 dark:border-gray-700 dark:hover:bg-gray-800",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(),i=>(e.openBlock(),e.createElementBlock("td",{key:i.id,class:"p-4 align-middle [&:has([role=checkbox])]:pr-0"},[e.createVNode(e.unref(x.FlexRender),{render:i.column.columnDef.cell,props:i.getContext()},null,8,["render","props"])]))),128))],2))),128)):(e.openBlock(),e.createElementBlock("tr",ke,[e.createElementVNode("td",{colspan:t.columns.length,class:"h-24 text-center dark:text-gray-400"},e.toDisplayString(t.emptyStateText),9,be)]))]),t.pagination&&t.pagination.meta.last_page>1?(e.openBlock(),e.createElementBlock("tfoot",he,[e.createElementVNode("tr",null,[e.createElementVNode("td",{colspan:t.columns.length,class:"p-0"},[e.createVNode(B,{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=>s("pageChange",a)),onPerPageChange:n[3]||(n[3]=a=>s("perPageChange",a))},null,8,["pagination","current-per-page","per-page-options","show-per-page-selector"])],8,ye)])])):e.createCommentVNode("",!0)])])]))])}}});function ve(...t){return C.twMerge(E.clsx(t))}exports.DataTable=xe;exports.DataTablePagination=B;exports.cn=ve;exports.useDarkMode=S;

package/dist/index.mjs

@@ -1,22 +1,41 @@
-import { defineComponent as L, computed as P, createElementBlock as a, openBlock as n, createCommentVNode as f, createElementVNode as t, normalizeClass as x, createVNode as h, unref as b, Fragment as p, renderList as S, toDisplayString as i, createTextVNode as B, renderSlot as N } from "vue";
-import { useVueTable as M, getCoreRowModel as O, FlexRender as I } from "@tanstack/vue-table";
-import { ChevronsLeft as V, ChevronLeft as E, ChevronRight as F, ChevronsRight as z, ChevronUp as A, ChevronDown as G } from "lucide-vue-next";
-import { clsx as _ } from "clsx";
-import { twMerge as H } from "tailwind-merge";
-const U = { class: "flex flex-col gap-4 px-2 py-4" }, W = {
+import { ref as E, watchEffect as O, defineComponent as I, computed as P, createElementBlock as a, openBlock as o, createElementVNode as t, Fragment as p, createTextVNode as L, toDisplayString as u, createCommentVNode as f, renderList as S, normalizeClass as k, createVNode as C, unref as b, renderSlot as B, createBlock as N } from "vue";
+import { useVueTable as V, getCoreRowModel as z, FlexRender as M } from "@tanstack/vue-table";
+import { ChevronsLeft as F, ChevronLeft as _, ChevronRight as A, ChevronsRight as G, ChevronsUpDown as U, ChevronUp as H, ChevronDown as Q } from "lucide-vue-next";
+import { clsx as W } from "clsx";
+import { twMerge as q } from "tailwind-merge";
+function Je() {
+  const e = E(!1);
+  if (typeof window < "u") {
+    const i = window.matchMedia("(prefers-color-scheme: dark)");
+    e.value = i.matches, i.addEventListener("change", (c) => {
+      e.value = c.matches;
+    });
+  }
+  O(() => {
+    typeof document < "u" && (e.value ? document.documentElement.classList.add("dark") : document.documentElement.classList.remove("dark"));
+  });
+  function R() {
+    e.value = !e.value;
+  }
+  return {
+    isDarkMode: e,
+    toggleDarkMode: R
+  };
+}
+const J = { class: "flex flex-col items-center justify-between gap-4 px-2 py-2 sm:flex-row text-foreground bg-background" }, K = { class: "text-sm text-muted-foreground" }, X = { class: "flex flex-col items-center gap-4 sm:flex-row" }, Y = {
   key: 0,
-  class: "flex justify-center"
-}, q = {
+  class: "flex items-center gap-2"
+}, Z = ["value"], ee = ["value"], te = {
+  key: 1,
+  class: "flex items-center justify-center"
+}, oe = {
   class: "flex items-center gap-1",
   role: "navigation",
   "aria-label": "pagination"
-}, J = ["disabled"], K = ["disabled"], Q = { class: "flex items-center gap-1" }, X = ["onClick"], Y = {
+}, ne = ["disabled"], ae = ["disabled"], se = { class: "hidden items-center gap-1 sm:flex" }, re = ["onClick"], le = {
   key: 1,
-  class: "inline-flex items-center justify-center h-10 min-w-10 px-3 text-gray-500"
-}, Z = ["disabled"], ee = ["disabled"], te = { class: "flex items-center justify-between text-sm text-gray-600 dark:text-gray-300" }, oe = {
-  key: 0,
-  class: "flex items-center gap-2"
-}, ae = ["value"], ne = ["value"], re = { key: 1 }, se = /* @__PURE__ */ L({
+  class: "inline-flex items-center justify-center h-10 min-w-10 px-3 text-muted-foreground"
+}, ie = ["disabled"], ce = ["disabled"], de = /* @__PURE__ */ I({
   __name: "DataTablePagination",
   props: {
     pagination: { default: null },
@@ -25,145 +44,144 @@ const U = { class: "flex flex-col gap-4 px-2 py-4" }, W = {
     showPerPageSelector: { type: Boolean, default: !0 }
   },
   emits: ["pageChange", "perPageChange"],
-  setup(e, { emit: T }) {
-    const c = e, g = T, l = P(
-      () => c.pagination ? c.pagination.meta.current_page > 1 : !1
+  setup(e, { emit: R }) {
+    const i = e, c = R, l = P(
+      () => i.pagination ? i.pagination.meta.current_page > 1 : !1
     ), m = P(
-      () => c.pagination ? c.pagination.meta.current_page < c.pagination.meta.last_page : !1
-    ), C = P(() => {
-      if (!c.pagination) return [];
-      const y = c.pagination.meta.current_page, d = c.pagination.meta.last_page, o = 2, r = [], w = [];
-      let k;
-      for (let s = 1; s <= d; s++)
-        (s === 1 || s === d || s >= y - o && s <= y + o) && r.push(s);
-      for (const s of r)
-        k && (s - k === 2 ? w.push(k + 1) : s - k !== 1 && w.push("...")), w.push(s), k = s;
-      return w;
-    }), R = (y) => {
-      typeof y == "number" && g("pageChange", y);
-    }, v = () => {
-      l.value && g("pageChange", 1);
-    }, D = () => {
-      m.value && c.pagination && g("pageChange", c.pagination.meta.last_page);
+      () => i.pagination ? i.pagination.meta.current_page < i.pagination.meta.last_page : !1
+    ), w = P(() => {
+      if (!i.pagination) return [];
+      const h = i.pagination.meta.current_page, d = i.pagination.meta.last_page, n = 2, s = [], v = [];
+      let y;
+      for (let r = 1; r <= d; r++)
+        (r === 1 || r === d || r >= h - n && r <= h + n) && s.push(r);
+      for (const r of s)
+        y && (r - y === 2 ? v.push(y + 1) : r - y !== 1 && v.push("...")), v.push(r), y = r;
+      return v;
+    }), $ = (h) => {
+      typeof h == "number" && c("pageChange", h);
+    }, x = () => {
+      l.value && c("pageChange", 1);
+    }, T = () => {
+      m.value && i.pagination && c("pageChange", i.pagination.meta.last_page);
     }, j = () => {
-      l.value && c.pagination && g("pageChange", c.pagination.meta.current_page - 1);
-    }, $ = () => {
-      m.value && c.pagination && g("pageChange", c.pagination.meta.current_page + 1);
+      l.value && i.pagination && c("pageChange", i.pagination.meta.current_page - 1);
+    }, D = () => {
+      m.value && i.pagination && c("pageChange", i.pagination.meta.current_page + 1);
     };
-    return (y, d) => (n(), a("div", U, [
-      e.pagination && e.pagination.meta.last_page > 1 ? (n(), a("div", W, [
-        t("nav", q, [
-          t("button", {
-            disabled: !l.value,
-            class: x([
-              "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: v
-          }, [
-            h(b(V), { class: "h-4 w-4" }),
-            d[1] || (d[1] = t("span", { class: "hidden sm:inline" }, "First", -1))
-          ], 10, J),
-          t("button", {
-            disabled: !l.value,
-            class: x([
-              "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: j
-          }, [
-            h(b(E), { class: "h-4 w-4" }),
-            d[2] || (d[2] = t("span", { class: "hidden sm:inline" }, "Previous", -1))
-          ], 10, K),
-          t("div", Q, [
-            (n(!0), a(p, null, S(C.value, (o, r) => (n(), a(p, { key: r }, [
-              o !== "..." ? (n(), a("button", {
-                key: 0,
-                class: x([
-                  "inline-flex items-center justify-center h-10 min-w-10 px-3 text-sm font-medium transition-colors rounded-md",
-                  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"
-                ]),
-                onClick: (w) => R(o)
-              }, i(o), 11, X)) : (n(), a("span", Y, " ... "))
-            ], 64))), 128))
-          ]),
-          t("button", {
-            disabled: !m.value,
-            class: x([
-              "inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",
-              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"
-            ]),
-            onClick: $
-          }, [
-            d[3] || (d[3] = t("span", { class: "hidden sm:inline" }, "Next", -1)),
-            h(b(F), { class: "h-4 w-4" })
-          ], 10, Z),
-          t("button", {
-            disabled: !m.value,
-            class: x([
-              "inline-flex items-center justify-center gap-1 h-10 px-4 py-2 text-sm font-medium transition-colors rounded-md",
-              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"
-            ]),
-            onClick: D
-          }, [
-            d[4] || (d[4] = t("span", { class: "hidden sm:inline" }, "Last", -1)),
-            h(b(z), { class: "h-4 w-4" })
-          ], 10, ee)
-        ])
-      ])) : f("", !0),
-      t("div", te, [
-        t("div", null, [
-          e.pagination && e.pagination.meta.total > 0 ? (n(), a(p, { key: 0 }, [
-            B(" Showing " + i(e.pagination.meta.from) + " to " + i(e.pagination.meta.to) + " of " + i(e.pagination.meta.total) + " entries ", 1)
-          ], 64)) : (n(), a(p, { key: 1 }, [
-            B(" No entries found ")
-          ], 64))
-        ]),
-        e.showPerPageSelector ? (n(), a("div", oe, [
-          d[5] || (d[5] = t("span", null, "Rows per page:", -1)),
+    return (h, d) => (o(), a("div", J, [
+      t("div", K, [
+        e.pagination && e.pagination.meta.total > 0 ? (o(), a(p, { key: 0 }, [
+          L(" Showing " + u(e.pagination.meta.from) + " to " + u(e.pagination.meta.to) + " of " + u(e.pagination.meta.total) + " entries ", 1)
+        ], 64)) : (o(), a(p, { key: 1 }, [
+          L(" No entries to show ")
+        ], 64))
+      ]),
+      t("div", X, [
+        e.showPerPageSelector ? (o(), a("div", Y, [
+          d[1] || (d[1] = t("span", { class: "text-sm" }, "Rows per page:", -1)),
           t("select", {
             value: e.currentPerPage || e.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: d[0] || (d[0] = (o) => g("perPageChange", Number(o.target.value) || e.perPageOptions[0]))
+            class: "h-10 rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+            onChange: d[0] || (d[0] = (n) => c("perPageChange", Number(n.target.value) || e.perPageOptions[0]))
           }, [
-            (n(!0), a(p, null, S(e.perPageOptions, (o) => (n(), a("option", {
-              key: o,
-              value: o
-            }, i(o), 9, ne))), 128))
-          ], 40, ae)
+            (o(!0), a(p, null, S(e.perPageOptions, (n) => (o(), a("option", {
+              key: n,
+              value: n
+            }, u(n), 9, ee))), 128))
+          ], 40, Z)
         ])) : f("", !0),
-        e.pagination ? (n(), a("div", re, " Page " + i(e.pagination.meta.current_page) + " of " + i(e.pagination.meta.last_page), 1)) : f("", !0)
+        e.pagination && e.pagination.meta.last_page > 1 ? (o(), a("div", te, [
+          t("nav", oe, [
+            t("button", {
+              disabled: !l.value,
+              class: k([
+                "inline-flex items-center justify-center gap-1 h-10 w-10 text-sm font-medium transition-colors rounded-md p-2",
+                l.value ? "hover:bg-accent hover:text-accent-foreground" : "opacity-50 cursor-not-allowed"
+              ]),
+              onClick: x
+            }, [
+              C(b(F), { class: "h-5 w-5" }),
+              d[2] || (d[2] = t("span", { class: "sr-only" }, "First", -1))
+            ], 10, ne),
+            t("button", {
+              disabled: !l.value,
+              class: k([
+                "inline-flex items-center justify-center gap-1 h-10 w-10 text-sm font-medium transition-colors rounded-md p-2",
+                l.value ? "hover:bg-accent hover:text-accent-foreground" : "opacity-50 cursor-not-allowed"
+              ]),
+              onClick: j
+            }, [
+              C(b(_), { class: "h-5 w-5" }),
+              d[3] || (d[3] = t("span", { class: "sr-only" }, "Previous", -1))
+            ], 10, ae),
+            t("div", se, [
+              (o(!0), a(p, null, S(w.value, (n, s) => (o(), a(p, { key: s }, [
+                n !== "..." ? (o(), a("button", {
+                  key: 0,
+                  class: k([
+                    "inline-flex items-center justify-center h-10 min-w-10 px-3 text-sm font-medium transition-colors rounded-md",
+                    n === e.pagination.meta.current_page ? "bg-primary text-primary-foreground hover:bg-primary/90" : "hover:bg-accent hover:text-accent-foreground"
+                  ]),
+                  onClick: (v) => $(n)
+                }, u(n), 11, re)) : (o(), a("span", le, " ... "))
+              ], 64))), 128))
+            ]),
+            t("button", {
+              disabled: !m.value,
+              class: k([
+                "inline-flex items-center justify-center gap-1 h-10 w-10 text-sm font-medium transition-colors rounded-md p-2",
+                m.value ? "hover:bg-accent hover:text-accent-foreground" : "opacity-50 cursor-not-allowed"
+              ]),
+              onClick: D
+            }, [
+              C(b(A), { class: "h-5 w-5" }),
+              d[4] || (d[4] = t("span", { class: "sr-only" }, "Next", -1))
+            ], 10, ie),
+            t("button", {
+              disabled: !m.value,
+              class: k([
+                "inline-flex items-center justify-center gap-1 h-10 w-10 text-sm font-medium transition-colors rounded-md p-2",
+                m.value ? "hover:bg-accent hover:text-accent-foreground" : "opacity-50 cursor-not-allowed"
+              ]),
+              onClick: T
+            }, [
+              C(b(G), { class: "h-5 w-5" }),
+              d[5] || (d[5] = t("span", { class: "sr-only" }, "Last", -1))
+            ], 10, ce)
+          ])
+        ])) : f("", !0)
       ])
     ]));
   }
-}), le = { class: "flex flex-col gap-4" }, ie = { class: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between" }, de = { class: "flex flex-col gap-2 sm:flex-row sm:items-center" }, ce = {
+}), ue = { class: "flex flex-col gap-4 bg-background text-foreground" }, ge = { class: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between" }, me = { class: "flex flex-col gap-2 sm:flex-row sm:items-center" }, fe = {
   key: 0,
   class: "relative w-full max-w-sm"
-}, ge = ["value"], ue = { class: "flex items-center gap-2" }, me = { class: "flex items-center" }, fe = {
+}, be = ["value"], he = { class: "flex items-center gap-2" }, pe = { class: "flex items-center" }, xe = {
   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"
-}, be = { class: "flex items-center gap-4" }, ye = { class: "text-sm font-medium text-blue-700 dark:text-blue-300" }, xe = { class: "text-xs text-blue-600 dark:text-blue-400" }, he = { class: "flex items-center gap-2" }, pe = {
+}, ve = { class: "flex items-center gap-4" }, ye = { class: "text-sm font-medium text-blue-700 dark:text-blue-300" }, we = { class: "text-xs text-blue-600 dark:text-blue-400" }, ke = { class: "flex items-center gap-2" }, Ce = {
   key: 1,
   class: "flex items-center justify-center p-8"
-}, ve = { class: "text-lg text-gray-700 dark:text-gray-200" }, we = {
+}, Se = { class: "text-lg text-gray-700 dark:text-gray-200" }, Pe = {
   key: 2,
   class: "flex flex-col items-center p-8"
-}, ke = { class: "mb-2 text-lg text-red-600 dark:text-red-400" }, Ce = { class: "mb-4 text-sm text-gray-600 dark:text-gray-300" }, Se = {
+}, Re = { class: "mb-2 text-lg text-red-600 dark:text-red-400" }, $e = { class: "mb-4 text-sm text-gray-600 dark:text-gray-300" }, De = {
   key: 3,
-  class: "rounded-lg border bg-white dark:bg-gray-900"
-}, Pe = {
+  class: "rounded-lg border bg-background dark:border-gray-700"
+}, Te = {
   key: 0,
   class: "relative"
-}, Re = { class: "relative w-full overflow-auto" }, $e = { class: "w-full caption-bottom text-sm" }, Te = {
+}, je = { class: "relative w-full overflow-auto" }, Be = { class: "w-full caption-bottom text-sm" }, Ne = {
   key: 0,
-  class: "mt-4 text-sm text-muted-foreground"
-}, De = {
+  class: "mt-4 text-sm text-muted-foreground dark:text-gray-400"
+}, Le = {
   key: 0,
   class: "ml-2 text-blue-600 dark:text-blue-400"
-}, je = { class: "[&_tr]:border-b" }, Ne = ["colspan"], Be = ["onClick"], Ie = {
-  key: 0,
-  class: "flex flex-col"
-}, Le = { class: "[&_tr:last-child]:border-0" }, Me = { key: 1 }, Oe = ["colspan"], _e = /* @__PURE__ */ L({
+}, Me = { class: "[&_tr]:border-b bg-muted" }, Ie = ["colspan"], Ee = ["onClick"], Oe = { key: 0 }, Ve = { class: "[&_tr:last-child]:border-0 dark:[&_tr:last-child]:border-0" }, ze = { key: 1 }, Fe = ["colspan"], _e = {
+  key: 1,
+  class: "border-t"
+}, Ae = ["colspan"], Ke = /* @__PURE__ */ I({
   __name: "DataTable",
   props: {
     data: { default: () => [] },
@@ -189,19 +207,23 @@ const U = { class: "flex flex-col gap-4 px-2 py-4" }, W = {
     emptyStateText: { default: "📭 No items found" }
   },
   emits: ["pageChange", "perPageChange", "searchChange", "sortChange", "retry", "update:rowSelection"],
-  setup(e, { expose: T, emit: c }) {
-    const g = c, l = e, m = P(() => Object.keys(l.rowSelection || {}).filter((o) => {
-      var r;
-      return (r = l.rowSelection) == null ? void 0 : r[o];
-    }).length), C = P(() => Object.keys(l.rowSelection || {}).filter((o) => {
-      var r;
-      return (r = l.rowSelection) == null ? void 0 : r[o];
-    })), R = P(() => !l.data || !l.rowSelection ? [] : l.data.filter((o) => l.rowSelection[l.getRowId(o)])), v = M({
+  setup(e, { expose: R, emit: i }) {
+    const c = i, l = e, m = P(() => Object.keys(l.rowSelection || {}).filter(
+      (n) => {
+        var s;
+        return (s = l.rowSelection) == null ? void 0 : s[n];
+      }
+    ).length), w = P(() => Object.keys(l.rowSelection || {}).filter(
+      (n) => {
+        var s;
+        return (s = l.rowSelection) == null ? void 0 : s[n];
+      }
+    )), $ = P(() => !l.data || !l.rowSelection ? [] : l.data.filter((n) => l.rowSelection[l.getRowId(n)])), x = V({
       get data() {
         return l.data || [];
       },
       columns: l.columns,
-      getCoreRowModel: O(),
+      getCoreRowModel: z(),
       enableSorting: !0,
       manualSorting: !0,
       enableRowSelection: l.enableRowSelection,
@@ -209,182 +231,193 @@ const U = { class: "flex flex-col gap-4 px-2 py-4" }, W = {
       state: {
         rowSelection: l.rowSelection || {}
       },
-      onRowSelectionChange: (o) => {
-        const r = typeof o == "function" ? o(l.rowSelection || {}) : o;
-        g("update:rowSelection", r);
+      onRowSelectionChange: (n) => {
+        const s = typeof n == "function" ? n(l.rowSelection || {}) : n;
+        c("update:rowSelection", s);
       },
       enableMultiRowSelection: !0,
       enableSubRowSelection: !1
-    }), D = () => C.value, j = () => R.value, $ = () => g("update:rowSelection", {}), y = () => {
-      const o = { ...l.rowSelection };
-      v.getRowModel().rows.forEach((r) => {
-        o[r.id] = !0;
-      }), g("update:rowSelection", o);
+    }), T = () => w.value, j = () => $.value, D = () => c("update:rowSelection", {}), h = () => {
+      const n = { ...l.rowSelection };
+      x.getRowModel().rows.forEach((s) => {
+        n[s.id] = !0;
+      }), c("update:rowSelection", n);
     }, d = () => {
-      const o = { ...l.rowSelection };
-      v.getRowModel().rows.forEach((r) => {
-        delete o[r.id];
-      }), g("update:rowSelection", o);
+      const n = { ...l.rowSelection };
+      x.getRowModel().rows.forEach((s) => {
+        delete n[s.id];
+      }), c("update:rowSelection", n);
     };
-    return T({
-      getSelectedRowIds: D,
+    return R({
+      getSelectedRowIds: T,
       getSelectedRowData: j,
-      clearSelection: $,
-      selectAllCurrentPage: y,
+      clearSelection: D,
+      selectAllCurrentPage: h,
       deselectAllCurrentPage: d,
       selectedRowCount: m,
-      selectedRowIds: C,
-      selectedRowData: R,
-      table: v
-    }), (o, r) => {
-      var w, k;
-      return n(), a("div", le, [
-        t("div", ie, [
-          t("div", de, [
-            e.showSearch ? (n(), a("div", ce, [
+      selectedRowIds: w,
+      selectedRowData: $,
+      table: x
+    }), (n, s) => {
+      var v, y;
+      return o(), a("div", ue, [
+        t("div", ge, [
+          t("div", me, [
+            e.showSearch ? (o(), a("div", fe, [
               t("input", {
                 value: e.search,
                 type: "search",
                 placeholder: "Search...",
-                class: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 ps-14 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: r[0] || (r[0] = (s) => g("searchChange", s.target.value))
-              }, null, 40, ge)
+                class: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 ps-14 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 dark:bg-gray-800 dark:text-gray-200 dark:placeholder:text-gray-400",
+                onInput: s[0] || (s[0] = (r) => c("searchChange", r.target.value))
+              }, null, 40, be)
             ])) : f("", !0),
-            t("div", ue, [
-              N(o.$slots, "filters")
+            t("div", he, [
+              B(n.$slots, "filters")
             ])
           ]),
-          t("div", me, [
-            N(o.$slots, "header")
+          t("div", pe, [
+            B(n.$slots, "header")
           ])
         ]),
-        e.enableRowSelection && m.value > 0 ? (n(), a("div", fe, [
-          t("div", be, [
-            t("span", ye, i(m.value) + " " + i(e.itemName) + " selected ", 1),
-            t("div", xe, " IDs: " + i(C.value.slice(0, 5).join(", ")) + i(C.value.length > 5 ? "..." : ""), 1)
+        e.enableRowSelection && m.value > 0 ? (o(), a("div", xe, [
+          t("div", ve, [
+            t("span", ye, u(m.value) + " " + u(e.itemName) + " selected ", 1),
+            t("div", we, " IDs: " + u(w.value.slice(0, 5).join(", ")) + u(w.value.length > 5 ? "..." : ""), 1)
           ]),
-          t("div", he, [
-            N(o.$slots, "bulk-actions", {
-              selectedIds: C.value,
-              selectedData: R.value,
+          t("div", ke, [
+            B(n.$slots, "bulk-actions", {
+              selectedIds: w.value,
+              selectedData: $.value,
               selectedCount: m.value,
-              clearSelection: $,
-              selectAllCurrentPage: y,
+              clearSelection: D,
+              selectAllCurrentPage: h,
               deselectAllCurrentPage: d
             }),
-            o.$slots["bulk-actions"] ? f("", !0) : (n(), a("button", {
+            n.$slots["bulk-actions"] ? f("", !0) : (o(), a("button", {
               key: 0,
-              onClick: $,
+              onClick: D,
               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 "))
           ])
         ])) : f("", !0),
-        e.isLoading && !e.data ? (n(), a("div", pe, [
-          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)),
-          t("div", ve, i(e.loadingText), 1)
-        ])) : e.error ? (n(), a("div", we, [
-          t("div", ke, "❌ " + i(e.errorTitle), 1),
-          t("div", Ce, i(e.error.message), 1),
+        e.isLoading && !e.data ? (o(), a("div", Ce, [
+          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)),
+          t("div", Se, u(e.loadingText), 1)
+        ])) : e.error ? (o(), a("div", Pe, [
+          t("div", Re, " ❌ " + u(e.errorTitle), 1),
+          t("div", $e, u(e.error.message), 1),
           t("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: r[1] || (r[1] = (s) => g("retry"))
+            onClick: s[1] || (s[1] = (r) => c("retry"))
           }, " 🔄 Retry ")
-        ])) : (n(), a("div", Se, [
-          e.isLoading ? (n(), a("div", Pe, [...r[5] || (r[5] = [
+        ])) : (o(), a("div", De, [
+          e.isLoading ? (o(), a("div", Te, [...s[5] || (s[5] = [
             t("div", { class: "absolute inset-0 z-10 flex items-center justify-center bg-white/70 dark:bg-gray-900/70 rounded-lg" }, [
               t("div", { class: "w-6 h-6 border-b-2 border-gray-900 dark:border-gray-100 rounded-full animate-spin" })
             ], -1)
           ])])) : f("", !0),
-          t("div", Re, [
-            t("table", $e, [
-              e.showCaption ? (n(), a("caption", Te, [
-                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),
-                e.enableRowSelection && m.value > 0 ? (n(), a("span", De, " (" + i(m.value) + " selected) ", 1)) : f("", !0)
+          t("div", je, [
+            t("table", Be, [
+              e.showCaption ? (o(), a("caption", Ne, [
+                L(u(e.title) + " - Total: " + u(((y = (v = e.pagination) == null ? void 0 : v.meta) == null ? void 0 : y.total) || 0) + " " + u(e.itemName) + " ", 1),
+                e.enableRowSelection && m.value > 0 ? (o(), a("span", Le, " (" + u(m.value) + " selected) ", 1)) : f("", !0)
               ])) : f("", !0),
-              t("thead", je, [
-                (n(!0), a(p, null, S(b(v).getHeaderGroups(), (s) => (n(), a("tr", {
-                  key: s.id,
-                  class: "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted"
+              t("thead", Me, [
+                (o(!0), a(p, null, S(b(x).getHeaderGroups(), (r) => (o(), a("tr", {
+                  key: r.id,
+                  class: "border-b transition-colors"
                 }, [
-                  (n(!0), a(p, null, S(s.headers, (u) => (n(), a("th", {
-                    key: u.id,
-                    colspan: u.colSpan,
-                    class: "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0"
+                  (o(!0), a(p, null, S(r.headers, (g) => (o(), a("th", {
+                    key: g.id,
+                    colspan: g.colSpan,
+                    class: "h-12 px-4 text-left align-middle font-bold text-muted-foreground [&:has([role=checkbox])]:pr-0"
                   }, [
-                    u.isPlaceholder ? f("", !0) : (n(), a("div", {
+                    g.isPlaceholder ? f("", !0) : (o(), a("div", {
                       key: 0,
-                      class: x([
+                      class: k([
                         "flex items-center gap-2",
-                        u.column.getCanSort() ? "cursor-pointer select-none hover:bg-gray-50 dark:hover:bg-gray-800 p-2 rounded transition-colors" : ""
+                        g.column.getCanSort() ? "cursor-pointer select-none hover:bg-accent p-2 rounded transition-colors" : ""
                       ]),
-                      onClick: (Ve) => u.column.getCanSort() ? g("sortChange", u.column.id) : void 0
+                      onClick: (Ge) => g.column.getCanSort() ? c("sortChange", g.column.id) : void 0
                     }, [
-                      h(b(I), {
-                        render: u.column.columnDef.header,
-                        props: u.getContext()
+                      C(b(M), {
+                        render: g.column.columnDef.header,
+                        props: g.getContext()
                       }, null, 8, ["render", "props"]),
-                      u.column.getCanSort() ? (n(), a("div", Ie, [
-                        h(b(A), {
-                          class: x([
-                            "w-3 h-3 transition-colors",
-                            e.sortBy === u.column.id && e.sortDirection === "asc" ? "text-gray-900 dark:text-gray-100" : "text-gray-400"
-                          ])
-                        }, null, 8, ["class"]),
-                        h(b(G), {
-                          class: x([
-                            "w-3 h-3 -mt-1 transition-colors",
-                            e.sortBy === u.column.id && e.sortDirection === "desc" ? "text-gray-900 dark:text-gray-100" : "text-gray-400"
-                          ])
-                        }, null, 8, ["class"])
+                      g.column.getCanSort() ? (o(), a("div", Oe, [
+                        e.sortBy !== g.column.id ? (o(), N(b(U), {
+                          key: 0,
+                          size: 10,
+                          class: "text-gray-400"
+                        })) : e.sortBy === g.column.id && e.sortDirection === "asc" ? (o(), N(b(H), {
+                          key: 1,
+                          size: 10,
+                          class: "text-gray-900 dark:text-gray-100"
+                        })) : e.sortBy === g.column.id && e.sortDirection === "desc" ? (o(), N(b(Q), {
+                          key: 2,
+                          size: 10,
+                          class: "text-gray-900 dark:text-gray-100"
+                        })) : f("", !0)
                       ])) : f("", !0)
-                    ], 10, Be))
-                  ], 8, Ne))), 128))
+                    ], 10, Ee))
+                  ], 8, Ie))), 128))
                 ]))), 128))
               ]),
-              t("tbody", Le, [
-                b(v).getRowModel().rows.length > 0 ? (n(!0), a(p, { key: 0 }, S(b(v).getRowModel().rows, (s) => (n(), a("tr", {
-                  key: s.id,
-                  class: x([
-                    "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
-                    e.enableRowSelection && s.getIsSelected() ? "bg-blue-50 dark:bg-blue-900/20 border-l-4 border-l-blue-500" : ""
+              t("tbody", Ve, [
+                b(x).getRowModel().rows.length > 0 ? (o(!0), a(p, { key: 0 }, S(b(x).getRowModel().rows, (r) => (o(), a("tr", {
+                  key: r.id,
+                  class: k([
+                    "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted dark:border-gray-700 dark:hover:bg-gray-800",
+                    e.enableRowSelection && r.getIsSelected() ? "bg-blue-50 dark:bg-blue-900/20 border-l-4 border-l-blue-500" : ""
                   ])
                 }, [
-                  (n(!0), a(p, null, S(s.getVisibleCells(), (u) => (n(), a("td", {
-                    key: u.id,
+                  (o(!0), a(p, null, S(r.getVisibleCells(), (g) => (o(), a("td", {
+                    key: g.id,
                     class: "p-4 align-middle [&:has([role=checkbox])]:pr-0"
                   }, [
-                    h(b(I), {
-                      render: u.column.columnDef.cell,
-                      props: u.getContext()
+                    C(b(M), {
+                      render: g.column.columnDef.cell,
+                      props: g.getContext()
                     }, null, 8, ["render", "props"])
                   ]))), 128))
-                ], 2))), 128)) : (n(), a("tr", Me, [
+                ], 2))), 128)) : (o(), a("tr", ze, [
                   t("td", {
                     colspan: e.columns.length,
-                    class: "h-24 text-center"
-                  }, i(e.emptyStateText), 9, Oe)
+                    class: "h-24 text-center dark:text-gray-400"
+                  }, u(e.emptyStateText), 9, Fe)
                 ]))
-              ])
+              ]),
+              e.pagination && e.pagination.meta.last_page > 1 ? (o(), a("tfoot", _e, [
+                t("tr", null, [
+                  t("td", {
+                    colspan: e.columns.length,
+                    class: "p-0"
+                  }, [
+                    C(de, {
+                      pagination: e.pagination,
+                      "current-per-page": e.currentPerPage,
+                      "per-page-options": e.perPageOptions,
+                      "show-per-page-selector": e.showPerPageSelector,
+                      onPageChange: s[2] || (s[2] = (r) => c("pageChange", r)),
+                      onPerPageChange: s[3] || (s[3] = (r) => c("perPageChange", r))
+                    }, null, 8, ["pagination", "current-per-page", "per-page-options", "show-per-page-selector"])
+                  ], 8, Ae)
+                ])
+              ])) : f("", !0)
             ])
-          ]),
-          h(se, {
-            pagination: e.pagination,
-            "current-per-page": e.currentPerPage,
-            "per-page-options": e.perPageOptions,
-            "show-per-page-selector": e.showPerPageSelector,
-            onPageChange: r[2] || (r[2] = (s) => g("pageChange", s)),
-            onPerPageChange: r[3] || (r[3] = (s) => g("perPageChange", s))
-          }, null, 8, ["pagination", "current-per-page", "per-page-options", "show-per-page-selector"])
+          ])
         ]))
       ]);
     };
   }
 });
-function He(...e) {
-  return H(_(e));
+function Xe(...e) {
+  return q(W(e));
 }
 export {
-  _e as DataTable,
-  se as DataTablePagination,
-  He as cn
+  Ke as DataTable,
+  de as DataTablePagination,
+  Xe as cn,
+  Je as useDarkMode
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toniel/laravel-tanstack-datatable",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "Vue 3 DataTable components for Laravel pagination with TanStack Query and shadcn-vue",
   "type": "module",
   "main": "./dist/index.js",