@kayord/ui 1.0.8 → 1.0.10

package/dist/components/custom/data-table/index.d.ts

@@ -1,4 +1,4 @@
 export { default as DataTable } from "./DataTable.svelte";
 export { createShadTable } from "./shad-table.svelte";
 export { max, min, sum, uniqueCount } from "./data-table-utils";
-export { decodeColumnFilters, decodeGlobalFilter, decodePageIndex, decodeSorting, encodeColumnFilters, encodeGlobalFilter, encodePageIndex, encodeSorting, encodeTableState, } from "./table-search-params";
+export { decodeColumnFilters, decodeGlobalFilter, decodePageIndex, decodeSorting, decodeTableState, encodeColumnFilters, encodeGlobalFilter, encodePageIndex, encodeSorting, encodeTableState, } from "./table-search-params";

package/dist/components/custom/data-table/index.js

@@ -1,4 +1,4 @@
 export { default as DataTable } from "./DataTable.svelte";
 export { createShadTable } from "./shad-table.svelte";
 export { max, min, sum, uniqueCount } from "./data-table-utils";
-export { decodeColumnFilters, decodeGlobalFilter, decodePageIndex, decodeSorting, encodeColumnFilters, encodeGlobalFilter, encodePageIndex, encodeSorting, encodeTableState, } from "./table-search-params";
+export { decodeColumnFilters, decodeGlobalFilter, decodePageIndex, decodeSorting, decodeTableState, encodeColumnFilters, encodeGlobalFilter, encodePageIndex, encodeSorting, encodeTableState, } from "./table-search-params";

package/dist/components/custom/data-table/shad-table.svelte.d.ts

@@ -4,6 +4,7 @@ interface ShadTableOptions<TData extends RowData> extends Omit<TableOptions<TDat
     enablePaging?: boolean;
     enableVisibility?: boolean;
     enableRowSelectionUI?: boolean;
+    defaultState?: Partial<TableState>;
 }
-export declare function createShadTable<TData extends RowData>(shadOptions: ShadTableOptions<TData>, stateUpdate?: (state: Partial<TableState>) => void): Table<TData>;
+export declare function createShadTable<TData extends RowData>(shadOptions: ShadTableOptions<TData>): Table<TData>;
 export {};

package/dist/components/custom/data-table/shad-table.svelte.js

@@ -2,7 +2,7 @@ import { createTable, getCoreRowModel, getFilteredRowModel, getPaginationRowMode
 import DataTableCheckbox from "./DataTableCheckbox.svelte";
 import { renderComponent } from "../../ui";
 import { mergeObjects } from "../../ui/data-table/data-table.svelte";
-export function createShadTable(shadOptions, stateUpdate) {
+export function createShadTable(shadOptions) {
     if (!shadOptions.getCoreRowModel) {
         shadOptions.getCoreRowModel = getCoreRowModel();
     }
@@ -176,6 +176,10 @@ export function createShadTable(shadOptions, stateUpdate) {
     }, options);
     const table = createTable(resolvedOptions);
     let state = $state(table.initialState);
+    // DefaultState
+    if (shadOptions.defaultState) {
+        state = { ...state, ...shadOptions.defaultState };
+    }
     const updateOptions = (table, state) => {
         table.setOptions((prev) => {
             return mergeObjects(prev, options, {
@@ -192,8 +196,8 @@ export function createShadTable(shadOptions, stateUpdate) {
         });
     };
     updateOptions(table, state);
-    // $effect.pre(() => {
-    // 	updateOptions(table, state);
-    // });
+    $effect.pre(() => {
+        updateOptions(table, state);
+    });
     return table;
 }

package/dist/components/custom/data-table/table-search-params.d.ts

@@ -1,14 +1,14 @@
 import type { TableState } from "@tanstack/table-core";
-export declare const encodeSorting: (state: TableState) => string;
+export declare const encodeSorting: (state: Partial<TableState>) => string;
 export declare const decodeSorting: () => {
     id: string;
     desc: boolean;
 }[];
-export declare const encodeGlobalFilter: (state: TableState) => any;
+export declare const encodeGlobalFilter: (state: Partial<TableState>) => any;
 export declare const decodeGlobalFilter: () => string;
-export declare const encodePageIndex: (state: TableState) => string;
+export declare const encodePageIndex: (state: Partial<TableState>) => string;
 export declare const decodePageIndex: () => number;
-export declare const encodeColumnFilters: (state: TableState) => string;
+export declare const encodeColumnFilters: (state: Partial<TableState>) => string;
 export declare const decodeColumnFilters: () => {
     id: string;
     value: any;
@@ -19,5 +19,6 @@ interface Options {
     pagination?: boolean;
     columnFilter?: boolean;
 }
-export declare const encodeTableState: (state: TableState, options?: Options, searchParams?: URLSearchParams) => string;
+export declare const decodeTableState: () => Partial<TableState>;
+export declare const encodeTableState: (state: Partial<TableState>, options?: Options, searchParams?: URLSearchParams) => string;
 export {};

package/dist/components/custom/data-table/table-search-params.js

@@ -21,15 +21,15 @@ export const decodeGlobalFilter = () => {
     return page.url.searchParams.get("globalFilter") ?? "";
 };
 export const encodePageIndex = (state) => {
-    return state.pagination?.pageIndex?.toString() ?? undefined;
+    return state.pagination?.pageIndex?.toString() ?? "";
 };
 export const decodePageIndex = () => {
     return Number(page.url.searchParams.get("page") ?? "0");
 };
 export const encodeColumnFilters = (state) => {
-    return state.columnFilters
+    return (state.columnFilters
         ?.map(({ id, value }) => `${id}.${encodeURIComponent(JSON.stringify(value).replaceAll(".", "%2E"))}`)
-        .join(",");
+        .join(",") ?? "");
 };
 export const decodeColumnFilters = () => {
     return (page.url.searchParams
@@ -48,6 +48,17 @@ export const decodeColumnFilters = () => {
     })
         .filter((x) => x !== null) ?? []);
 };
+export const decodeTableState = () => {
+    return {
+        pagination: {
+            pageIndex: decodePageIndex(),
+            pageSize: 10,
+        },
+        sorting: decodeSorting(),
+        columnFilters: decodeColumnFilters(),
+        globalFilter: decodeGlobalFilter(),
+    };
+};
 export const encodeTableState = (state, options, searchParams) => {
     if (searchParams === undefined) {
         searchParams = new URLSearchParams();
@@ -59,16 +70,16 @@ export const encodeTableState = (state, options, searchParams) => {
     options.globalFilter = options.globalFilter ?? true;
     options.sorting = options.sorting ?? true;
     options.columnFilter = options.columnFilter ?? true;
-    if (options.pagination && state.pagination.pageIndex != 0) {
+    if (options.pagination && state.pagination?.pageIndex != 0) {
         searchParams.set("page", encodePageIndex(state));
     }
     if (options.globalFilter && state.globalFilter?.length > 0) {
         searchParams.set("globalFilter", encodeGlobalFilter(state));
     }
-    if (options.sorting && state.sorting?.length > 0) {
+    if (options.sorting && (state.sorting?.length ?? 0) > 0) {
         searchParams.set("sort", encodeSorting(state));
     }
-    if (options.columnFilter && state.columnFilters?.length > 0) {
+    if (options.columnFilter && (state.columnFilters?.length ?? 0) > 0) {
         searchParams.set("columnFilters", encodeColumnFilters(state));
     }
     return `?${searchParams.toString()}`;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@kayord/ui",
   "private": false,
-  "version": "1.0.8",
+  "version": "1.0.10",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",