@starter-solutions/inertia-data-table-vue 0.2.1 → 0.3.1

package/dist/composables/index.d.ts

@@ -1,2 +1,3 @@
 export * from './useInertiaDataTableConfig';
 export * from './useLaravelPagination';
+export * from './useDataTable';

package/dist/composables/useDataTable.d.ts

@@ -0,0 +1,15 @@
+import { InertiaDataTableOptions, PaginatedRequest } from '../types';
+import { MaybeRefOrGetter } from 'vue';
+
+export declare const useDataTable: <T>(tableKey: MaybeRefOrGetter<string>, options?: MaybeRefOrGetter<InertiaDataTableOptions>) => {
+    data: import('vue').ComputedRef<T[]>;
+    pagination: import('vue').ComputedRef<Required<import('../types').NormalizedPagination>>;
+    reloadData: (request?: Partial<PaginatedRequest>) => void;
+    firstPage: () => void;
+    previousPage: () => void;
+    nextPage: () => void;
+    lastPage: () => void;
+    goToPage: (newPage: number) => void;
+    itemsPerPage: (perPage: number) => void;
+    sortBy: (sort_by: string, descending?: boolean) => void;
+};

package/dist/composables/useInertiaDataTableConfig.d.ts

@@ -1,4 +1,4 @@
-import { InertiaDataTableDefaults, InertiaDataTableOptions, InertiaDataTableQueryParams, InertiaDataTableSettings, InertiaDataTableStateRoutes } from '../types/config';
+import { InertiaDataTableDefaults, InertiaDataTableOptions, InertiaDataTableQueryParams, InertiaDataTableSettings, InertiaDataTableStateRoutes } from '../types';
 import { MaybeRefOrGetter } from 'vue';
 
 export declare const useInertiaDataTableConfig: (tableKey: MaybeRefOrGetter<string>, options?: MaybeRefOrGetter<InertiaDataTableOptions>) => {

package/dist/composables/useLaravelPagination.d.ts

@@ -1,5 +1,5 @@
 import { MaybeRefOrGetter } from 'vue';
-import { NormalizedPagination, Paginated, PaginatedRequest, PaginatedResource } from '../types/pagination';
+import { NormalizedPagination, Paginated, PaginatedRequest, PaginatedResource } from '../types';
 
 export declare const useLaravelPagination: <T>(paginated?: MaybeRefOrGetter<Paginated<T> | null | undefined>) => {
     data: import('vue').ComputedRef<T[]>;

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("@inertiajs/vue3"),t=require("vue"),v=(e,n)=>{const l=d.usePage(),r=t.computed(()=>{const s=t.toValue(n);return{tableKey:t.toValue(e),pagePropsKey:t.toValue(s==null?void 0:s.pagePropsKey)??t.toValue(e),useUrlQuery:t.toValue(s==null?void 0:s.useUrlQuery)??!1}}),u=t.computed(()=>l.props.inertiaDataTable.stateRoutes),o=t.computed(()=>l.props.inertiaDataTable.queryParams),a=t.computed(()=>l.props.inertiaDataTable.defaults);return{settings:r,stateRoutes:u,queryParams:o,defaults:a}},k=e=>{const n=t.computed(()=>c(t.toValue(e))),l=t.computed(()=>n.value.data),r=t.computed(()=>n.value.pagination);return{data:l,pagination:r,getPaginatedRequest:(a={})=>({page:a.page??r.value.current_page,per_page:a.per_page??r.value.per_page,sort_by:a.sort_by??r.value.sort_by,descending:a.descending??r.value.descending}),validPage:a=>a>0&&a<=r.value.last_page}},c=e=>({data:(e==null?void 0:e.data)??[],pagination:_(e)}),i=e=>"meta"in e&&typeof e.meta=="object"&&e.meta!==null,_=e=>{if(!e)return{current_page:1,last_page:1,per_page:10,total:0,from:null,to:null,path:"",links:[],first_page_url:null,last_page_url:null,next_page_url:null,prev_page_url:null,sort_by:"id",descending:!1};if(i(e))return{current_page:e.meta.current_page,last_page:e.meta.last_page,per_page:e.meta.per_page,total:e.meta.total,from:e.meta.from,to:e.meta.to,path:e.meta.path,links:e.meta.links,first_page_url:e.links.first,last_page_url:e.links.last,next_page_url:e.links.next,prev_page_url:e.links.prev,sort_by:e.meta.sort_by??"id",descending:e.meta.descending??!1};const{current_page:n,last_page:l,per_page:r,total:u,from:o,to:a,path:s,links:p,first_page_url:g,last_page_url:m,next_page_url:f,prev_page_url:b,sort_by:y,descending:P}=e;return{current_page:n,last_page:l,per_page:r,total:u,from:o,to:a,path:s,links:p,first_page_url:g,last_page_url:m,next_page_url:f,prev_page_url:b,sort_by:y??"id",descending:P??!1}};function T(){return{install(e){}}}exports.createInertiaDataTable=T;exports.getPaginationMeta=_;exports.isResource=i;exports.normalizePagination=c;exports.useInertiaDataTableConfig=v;exports.useLaravelPagination=k;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("@inertiajs/vue3"),r=require("vue"),P=(e,u)=>{const n=y.usePage(),t=r.computed(()=>{const a=r.toValue(u),o=r.toValue(e),g=r.toValue(a==null?void 0:a.pagePropsKey)??o,c=r.toValue(a==null?void 0:a.useUrlQuery)??!1,_=r.toValue(a==null?void 0:a.reloadOnly)?[g,...r.toValue(a==null?void 0:a.reloadOnly)]:[g];return{tableKey:o,pagePropsKey:g,useUrlQuery:c,reloadOnly:_}}),p=r.computed(()=>n.props.inertiaDataTable.stateRoutes),i=r.computed(()=>n.props.inertiaDataTable.queryParams),l=r.computed(()=>n.props.inertiaDataTable.defaults);return{settings:t,stateRoutes:p,queryParams:i,defaults:l}},f=e=>{const u=r.computed(()=>D(r.toValue(e))),n=r.computed(()=>u.value.data),t=r.computed(()=>u.value.pagination);return{data:n,pagination:t,getPaginatedRequest:(l={})=>({page:l.page??t.value.current_page,per_page:l.per_page??t.value.per_page,sort_by:l.sort_by??t.value.sort_by,descending:l.descending??t.value.descending}),validPage:l=>l>0&&l<=t.value.last_page}},D=e=>({data:(e==null?void 0:e.data)??[],pagination:T(e)}),K=e=>"meta"in e&&typeof e.meta=="object"&&e.meta!==null,T=e=>{if(!e)return{current_page:1,last_page:1,per_page:10,total:0,from:null,to:null,path:"",links:[],first_page_url:null,last_page_url:null,next_page_url:null,prev_page_url:null,sort_by:"id",descending:!1};if(K(e))return{current_page:e.meta.current_page,last_page:e.meta.last_page,per_page:e.meta.per_page,total:e.meta.total,from:e.meta.from,to:e.meta.to,path:e.meta.path,links:e.meta.links,first_page_url:e.links.first,last_page_url:e.links.last,next_page_url:e.links.next,prev_page_url:e.links.prev,sort_by:e.meta.sort_by??"id",descending:e.meta.descending??!1};const{current_page:u,last_page:n,per_page:t,total:p,from:i,to:l,path:a,links:o,first_page_url:g,last_page_url:c,next_page_url:_,prev_page_url:v,sort_by:m,descending:b}=e;return{current_page:u,last_page:n,per_page:t,total:p,from:i,to:l,path:a,links:o,first_page_url:g,last_page_url:c,next_page_url:_,prev_page_url:v,sort_by:m??"id",descending:b??!1}},O=(e,u)=>{const{stateRoutes:n,settings:t}=P(e,u);r.onBeforeUnmount(()=>{y.router.delete(n.value.drop,{preserveScroll:!0,preserveState:!0,data:{tableKey:t.value.tableKey}})});const p=y.usePage(),i=r.computed(()=>p.props[t.value.pagePropsKey]??null),{data:l,pagination:a,getPaginatedRequest:o,validPage:g}=f(i),c=s=>{s=o(s),t.value.useUrlQuery?y.router.reload({only:t.value.reloadOnly,data:{tableKey:t.value.tableKey,...s}}):y.router.post(n.value.set,{tableKey:t.value.tableKey,data:s},{preserveState:!0,preserveScroll:!0,only:t.value.reloadOnly})},_=()=>{d(1)},v=()=>{d(a.value.current_page-1)},m=()=>{d(a.value.current_page+1)},b=()=>{d(a.value.last_page)},d=s=>{if(!g(s)){console.error(`Invalid page: ${s}`);return}c(o({page:s}))};return{data:l,pagination:a,reloadData:c,firstPage:_,previousPage:v,nextPage:m,lastPage:b,goToPage:d,itemsPerPage:s=>{c(o({per_page:s,page:1}))},sortBy:(s,k)=>{const R=k??a.value.sort_by===s?!a.value.descending:!1;c(o({sort_by:s,descending:R}))}}};function V(){return{install(e){}}}exports.createInertiaDataTable=V;exports.getPaginationMeta=T;exports.isResource=K;exports.normalizePagination=D;exports.useDataTable=O;exports.useInertiaDataTableConfig=P;exports.useLaravelPagination=f;

package/dist/index.js

@@ -1,45 +1,46 @@
-import { usePage as b } from "@inertiajs/vue3";
-import { computed as l, toValue as u } from "vue";
-const D = (e, n) => {
-  const s = b(), a = l(() => {
-    const r = u(n);
+import { usePage as P, router as b } from "@inertiajs/vue3";
+import { computed as c, toValue as p, onBeforeUnmount as k } from "vue";
+const R = (e, o) => {
+  const s = P(), t = c(() => {
+    const a = p(o), n = p(e), g = p(a == null ? void 0 : a.pagePropsKey) ?? n, u = p(a == null ? void 0 : a.useUrlQuery) ?? !1, y = p(a == null ? void 0 : a.reloadOnly) ? [g, ...p(a == null ? void 0 : a.reloadOnly)] : [g];
     return {
-      tableKey: u(e),
-      pagePropsKey: u(r == null ? void 0 : r.pagePropsKey) ?? u(e),
-      useUrlQuery: u(r == null ? void 0 : r.useUrlQuery) ?? !1
+      tableKey: n,
+      pagePropsKey: g,
+      useUrlQuery: u,
+      reloadOnly: y
     };
-  }), o = l(
+  }), _ = c(
     () => s.props.inertiaDataTable.stateRoutes
-  ), _ = l(
+  ), i = c(
     () => s.props.inertiaDataTable.queryParams
-  ), t = l(
+  ), r = c(
     () => s.props.inertiaDataTable.defaults
   );
   return {
-    settings: a,
-    stateRoutes: o,
-    queryParams: _,
-    defaults: t
+    settings: t,
+    stateRoutes: _,
+    queryParams: i,
+    defaults: r
   };
-}, R = (e) => {
-  const n = l(() => P(u(e))), s = l(() => n.value.data), a = l(
-    () => n.value.pagination
+}, T = (e) => {
+  const o = c(() => x(p(e))), s = c(() => o.value.data), t = c(
+    () => o.value.pagination
   );
   return {
     data: s,
-    pagination: a,
-    getPaginatedRequest: (t = {}) => ({
-      page: t.page ?? a.value.current_page,
-      per_page: t.per_page ?? a.value.per_page,
-      sort_by: t.sort_by ?? a.value.sort_by,
-      descending: t.descending ?? a.value.descending
+    pagination: t,
+    getPaginatedRequest: (r = {}) => ({
+      page: r.page ?? t.value.current_page,
+      per_page: r.per_page ?? t.value.per_page,
+      sort_by: r.sort_by ?? t.value.sort_by,
+      descending: r.descending ?? t.value.descending
     }),
-    validPage: (t) => t > 0 && t <= a.value.last_page
+    validPage: (r) => r > 0 && r <= t.value.last_page
   };
-}, P = (e) => ({
+}, x = (e) => ({
   data: (e == null ? void 0 : e.data) ?? [],
-  pagination: k(e)
-}), v = (e) => "meta" in e && typeof e.meta == "object" && e.meta !== null, k = (e) => {
+  pagination: U(e)
+}), O = (e) => "meta" in e && typeof e.meta == "object" && e.meta !== null, U = (e) => {
   if (!e)
     return {
       current_page: 1,
@@ -59,7 +60,7 @@ const D = (e, n) => {
       sort_by: "id",
       descending: !1
     };
-  if (v(e))
+  if (O(e))
     return {
       current_page: e.meta.current_page,
       last_page: e.meta.last_page,
@@ -79,53 +80,116 @@ const D = (e, n) => {
       descending: e.meta.descending ?? !1
     };
   const {
-    current_page: n,
+    current_page: o,
     last_page: s,
-    per_page: a,
-    total: o,
-    from: _,
-    to: t,
-    path: r,
-    links: p,
+    per_page: t,
+    total: _,
+    from: i,
+    to: r,
+    path: a,
+    links: n,
     //links
     first_page_url: g,
-    last_page_url: c,
-    next_page_url: i,
-    prev_page_url: m,
+    last_page_url: u,
+    next_page_url: y,
+    prev_page_url: d,
     //custom
-    sort_by: f,
-    descending: y
+    sort_by: m,
+    descending: f
   } = e;
   return {
-    current_page: n,
+    current_page: o,
     last_page: s,
-    per_page: a,
-    total: o,
-    from: _,
-    to: t,
-    path: r,
-    links: p,
+    per_page: t,
+    total: _,
+    from: i,
+    to: r,
+    path: a,
+    links: n,
     //links
     first_page_url: g,
-    last_page_url: c,
-    next_page_url: i,
-    prev_page_url: m,
+    last_page_url: u,
+    next_page_url: y,
+    prev_page_url: d,
     //custom
-    sort_by: f ?? "id",
-    descending: y ?? !1
+    sort_by: m ?? "id",
+    descending: f ?? !1
+  };
+}, I = (e, o) => {
+  const { stateRoutes: s, settings: t } = R(
+    e,
+    o
+  );
+  k(() => {
+    b.delete(s.value.drop, {
+      preserveScroll: !0,
+      preserveState: !0,
+      data: { tableKey: t.value.tableKey }
+    });
+  });
+  const _ = P(), i = c(
+    () => _.props[t.value.pagePropsKey] ?? null
+  ), { data: r, pagination: a, getPaginatedRequest: n, validPage: g } = T(i), u = (l) => {
+    l = n(l), t.value.useUrlQuery ? b.reload({
+      only: t.value.reloadOnly,
+      data: { tableKey: t.value.tableKey, ...l }
+    }) : b.post(
+      s.value.set,
+      {
+        tableKey: t.value.tableKey,
+        data: l
+      },
+      {
+        preserveState: !0,
+        preserveScroll: !0,
+        only: t.value.reloadOnly
+      }
+    );
+  }, y = () => {
+    v(1);
+  }, d = () => {
+    v(a.value.current_page - 1);
+  }, m = () => {
+    v(a.value.current_page + 1);
+  }, f = () => {
+    v(a.value.last_page);
+  }, v = (l) => {
+    if (!g(l)) {
+      console.error(`Invalid page: ${l}`);
+      return;
+    }
+    u(n({ page: l }));
+  };
+  return {
+    data: r,
+    pagination: a,
+    reloadData: u,
+    firstPage: y,
+    previousPage: d,
+    nextPage: m,
+    lastPage: f,
+    goToPage: v,
+    itemsPerPage: (l) => {
+      u(n({ per_page: l, page: 1 }));
+    },
+    sortBy: (l, K) => {
+      const D = K ?? a.value.sort_by === l ? !a.value.descending : !1;
+      u(n({ sort_by: l, descending: D }));
+    }
   };
 };
-function T() {
+function q() {
   return {
     install(e) {
     }
   };
 }
 export {
-  T as createInertiaDataTable,
-  k as getPaginationMeta,
-  v as isResource,
-  P as normalizePagination,
-  D as useInertiaDataTableConfig,
-  R as useLaravelPagination
+  q as createInertiaDataTable,
+  U as getPaginationMeta,
+  O as isResource,
+  x as normalizePagination,
+  I as useDataTable,
+  R as useInertiaDataTableConfig,
+  T as useLaravelPagination
 };

package/dist/types/config.d.ts

@@ -33,9 +33,14 @@ export type InertiaDataTableOptions = {
      * The key in which the paginated data is stored in the page props. Defaults to the tableKey if not provided.
      */
     pagePropsKey?: MaybeRefOrGetter<string>;
+    /**
+     * Defines page props that should be reloaded along with the table data.
+     */
+    reloadOnly?: MaybeRefOrGetter<Array<string>>;
 };
 export type InertiaDataTableSettings = {
     tableKey: string;
     pagePropsKey: string;
     useUrlQuery: boolean;
+    reloadOnly: Array<string>;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@starter-solutions/inertia-data-table-vue",
-    "version": "0.2.1",
+    "version": "0.3.1",
     "license": "MIT",
     "description": "Vue 3 + Inertia.js data table utilities with Laravel backend integration.",
     "type": "module",