@toniel/laravel-tanstack-datatable 0.1.3 → 0.1.5

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;WA0UT,OAAO,IAA6B;;yBAZrB,GAAG;wBACJ,GAAG;;;;;;;;YACK,GAAG;;;;EAetC;AAuBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;gBA9gBN,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;wFAggBvB,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":"AAuYA,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;WA+UT,OAAO,IAA6B;;yBAZrB,GAAG;wBACJ,GAAG;;;;;;;;YACK,GAAG;;;;EAetC;AAuBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;gBAxhBN,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;wFA0gBvB,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/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"),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-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,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;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),h=require("@tanstack/vue-table"),p=require("lucide-vue-next"),E=require("clsx"),S=require("tailwind-merge");function C(){const t=e.ref(!1);if(typeof window<"u"){const l=window.matchMedia("(prefers-color-scheme: dark)");t.value=l.matches,l.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 y(){t.value=!t.value}return{isDarkMode:t,toggleDarkMode:y}}const N={class:"flex flex-col gap-4 px-2 py-4 bg-background text-foreground"},V={key:0,class:"flex justify-center"},P={class:"flex items-center gap-1",role:"navigation","aria-label":"pagination"},D=["disabled"],R=["disabled"],$={class:"flex items-center gap-1"},T=["onClick"],L={key:1,class:"inline-flex items-center justify-center h-10 min-w-10 px-3 text-gray-500"},j=["disabled"],M=["disabled"],F={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"],O=["value"],q={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:y}){const l=t,s=y,r=e.computed(()=>l.pagination?l.pagination.meta.current_page>1:!1),d=e.computed(()=>l.pagination?l.pagination.meta.current_page<l.pagination.meta.last_page:!1),f=e.computed(()=>{if(!l.pagination)return[];const g=l.pagination.meta.current_page,i=l.pagination.meta.last_page,o=2,n=[],m=[];let k;for(let a=1;a<=i;a++)(a===1||a===i||a>=g-o&&a<=g+o)&&n.push(a);for(const a of n)k&&(a-k===2?m.push(k+1):a-k!==1&&m.push("...")),m.push(a),k=a;return m}),b=g=>{typeof g=="number"&&s("pageChange",g)},u=()=>{r.value&&s("pageChange",1)},v=()=>{d.value&&l.pagination&&s("pageChange",l.pagination.meta.last_page)},w=()=>{r.value&&l.pagination&&s("pageChange",l.pagination.meta.current_page-1)},x=()=>{d.value&&l.pagination&&s("pageChange",l.pagination.meta.current_page+1)};return(g,i)=>(e.openBlock(),e.createElementBlock("div",N,[t.pagination&&t.pagination.meta.last_page>1?(e.openBlock(),e.createElementBlock("div",V,[e.createElementVNode("nav",P,[e.createElementVNode("button",{disabled:!r.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",r.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(p.ChevronsLeft),{class:"h-4 w-4"}),i[1]||(i[1]=e.createElementVNode("span",{class:"hidden sm:inline"},"First",-1))],10,D),e.createElementVNode("button",{disabled:!r.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",r.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(p.ChevronLeft),{class:"h-4 w-4"}),i[2]||(i[2]=e.createElementVNode("span",{class:"hidden sm:inline"},"Previous",-1))],10,R),e.createElementVNode("div",$,[(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 dark:bg-primary dark:text-primary-foreground":"hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-700 dark:text-gray-200"]),onClick:m=>b(o)},e.toDisplayString(o),11,T)):(e.openBlock(),e.createElementBlock("span",L," ... "))],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:x},[i[3]||(i[3]=e.createElementVNode("span",{class:"hidden sm:inline"},"Next",-1)),e.createVNode(e.unref(p.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},[i[4]||(i[4]=e.createElementVNode("span",{class:"hidden sm:inline"},"Last",-1)),e.createVNode(e.unref(p.ChevronsRight),{class:"h-4 w-4"})],10,M)])])):e.createCommentVNode("",!0),e.createElementVNode("div",F,[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,[i[5]||(i[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 dark:bg-gray-800 dark:text-gray-200 dark:border-gray-700",onChange:i[0]||(i[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,O))),128))],40,I)])):e.createCommentVNode("",!0),t.pagination?(e.openBlock(),e.createElementBlock("div",q," Page "+e.toDisplayString(t.pagination.meta.current_page)+" of "+e.toDisplayString(t.pagination.meta.last_page),1)):e.createCommentVNode("",!0)])]))}}),A={class:"flex flex-col gap-4 bg-background text-foreground"},G={class:"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between"},U={class:"flex flex-col gap-2 sm:flex-row sm:items-center"},_={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"},re={key:3,class:"rounded-lg border bg-background dark:border-gray-700"},le={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 dark:text-gray-400"},de={key:0,class:"ml-2 text-blue-600 dark:text-blue-400"},ge={class:"[&_tr]:border-b dark:[&_tr]:border-gray-700"},ue=["colspan"],me=["onClick"],ke={key:0},fe={class:"[&_tr:last-child]:border-0 dark:[&_tr:last-child]:border-0"},pe={key:1},ye=["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:y,emit:l}){const s=l,r=t,d=e.computed(()=>Object.keys(r.rowSelection||{}).filter(o=>{var n;return(n=r.rowSelection)==null?void 0:n[o]}).length),f=e.computed(()=>Object.keys(r.rowSelection||{}).filter(o=>{var n;return(n=r.rowSelection)==null?void 0:n[o]})),b=e.computed(()=>!r.data||!r.rowSelection?[]:r.data.filter(o=>r.rowSelection[r.getRowId(o)])),u=h.useVueTable({get data(){return r.data||[]},columns:r.columns,getCoreRowModel:h.getCoreRowModel(),enableSorting:!0,manualSorting:!0,enableRowSelection:r.enableRowSelection,getRowId:r.getRowId,state:{rowSelection:r.rowSelection||{}},onRowSelectionChange:o=>{const n=typeof o=="function"?o(r.rowSelection||{}):o;s("update:rowSelection",n)},enableMultiRowSelection:!0,enableSubRowSelection:!1}),v=()=>f.value,w=()=>b.value,x=()=>s("update:rowSelection",{}),g=()=>{const o={...r.rowSelection};u.getRowModel().rows.forEach(n=>{o[n.id]=!0}),s("update:rowSelection",o)},i=()=>{const o={...r.rowSelection};u.getRowModel().rows.forEach(n=>{delete o[n.id]}),s("update:rowSelection",o)};return y({getSelectedRowIds:v,getSelectedRowData:w,clearSelection:x,selectAllCurrentPage:g,deselectAllCurrentPage:i,selectedRowCount:d,selectedRowIds:f,selectedRowData:b,table:u}),(o,n)=>{var m,k;return e.openBlock(),e.createElementBlock("div",A,[e.createElementVNode("div",G,[e.createElementVNode("div",U,[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 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(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:x,selectAllCurrentPage:g,deselectAllCurrentPage:i}),o.$slots["bulk-actions"]?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("button",{key:0,onClick:x,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",re,[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",se,[e.createElementVNode("table",ie,[t.showCaption?(e.openBlock(),e.createElementBlock("caption",ce,[e.createTextVNode(e.toDisplayString(t.title)+" - Total: "+e.toDisplayString(((k=(m=t.pagination)==null?void 0:m.meta)==null?void 0:k.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 dark:hover:bg-gray-800"},[(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 dark:text-gray-400"},[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()?s("sortChange",c.column.id):void 0},[e.createVNode(e.unref(h.FlexRender),{render:c.column.columnDef.header,props:c.getContext()},null,8,["render","props"]),c.column.getCanSort()?(e.openBlock(),e.createElementBlock("div",ke,[t.sortBy!==c.column.id?(e.openBlock(),e.createBlock(e.unref(p.ChevronsUpDown),{key:0,size:10,class:"text-gray-400"})):t.sortBy===c.column.id&&t.sortDirection==="asc"?(e.openBlock(),e.createBlock(e.unref(p.ChevronUp),{key:1,size:10,class:"text-gray-900 dark:text-gray-100"})):t.sortBy===c.column.id&&t.sortDirection==="desc"?(e.openBlock(),e.createBlock(e.unref(p.ChevronDown),{key:2,size:10,class:"text-gray-900 dark:text-gray-100"})):e.createCommentVNode("",!0)])):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 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(),c=>(e.openBlock(),e.createElementBlock("td",{key:c.id,class:"p-4 align-middle [&:has([role=checkbox])]:pr-0"},[e.createVNode(e.unref(h.FlexRender),{render:c.column.columnDef.cell,props:c.getContext()},null,8,["render","props"])]))),128))],2))),128)):(e.openBlock(),e.createElementBlock("tr",pe,[e.createElementVNode("td",{colspan:t.columns.length,class:"h-24 text-center dark:text-gray-400"},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=>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"])]))])}}});function xe(...t){return S.twMerge(E.clsx(t))}exports.DataTable=be;exports.DataTablePagination=B;exports.cn=xe;exports.useDarkMode=C;

package/dist/index.mjs

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

package/package.json

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