@kayord/ui 4.0.3 → 4.0.6

package/dist/components/custom/data-table/Pagination.svelte

@@ -12,7 +12,7 @@
 		canChangePageSize?: boolean;
 	}
 
-	let { table, canChangePageSize = true }: Props<T> = $props();
+	let { table, canChangePageSize = false }: Props<T> = $props();
 
 	const pagination = $derived(table.atoms.pagination.get());
 </script>
@@ -24,11 +24,12 @@
 				{table.getFilteredSelectedRowModel().rows.length} of
 				{table.getFilteredRowModel().rows.length} row(s) selected.
 			</p>
+		{:else}
+			<p>
+				{table.getRowModel().rows.length.toLocaleString()}
+				of {table.getRowCount().toLocaleString()} rows
+			</p>
 		{/if}
-		<p>
-			{table.getRowModel().rows.length.toLocaleString()}
-			of {table.getRowCount().toLocaleString()} rows
-		</p>
 	</div>
 	<div class="flex items-center gap-6 lg:gap-8">
 		{#if canChangePageSize}

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

@@ -1,6 +1,6 @@
 export { default as DataTable } from "./DataTable.svelte";
 export { createShadTable, features } from "./shad-table.svelte";
-export type { ShadTableOptions } from "./shad-table.svelte";
+export type { ShadTableOptions, ControlledState } from "./shad-table.svelte";
 export { createColumnHelperFor, type DataTableFeatures } from "./features";
 export { useTableUrlSync } from "./table-url-sync.svelte";
 export type { TableUrlSyncOptions } from "./table-url-sync.svelte";

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

@@ -9,7 +9,7 @@ export declare const decodeSorting: () => {
 export declare const encodeGlobalFilter: (state: State) => any;
 export declare const decodeGlobalFilter: () => string | undefined;
 export declare const encodePageIndex: (state: State) => string;
-export declare const decodePageIndex: () => number;
+export declare const decodePageIndex: () => number | undefined;
 export declare const encodeColumnFilters: (state: State) => string;
 export declare const decodeColumnFilters: () => {
     id: string;

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

@@ -28,8 +28,11 @@ export const encodePageIndex = (state) => {
     return state.pagination?.pageIndex?.toString() ?? "";
 };
 export const decodePageIndex = () => {
-    const pageIndex = Number(page.url.searchParams.get("page") ?? "0");
-    return Number.isFinite(pageIndex) ? pageIndex : 0;
+    const raw = page.url.searchParams.get("page");
+    if (raw == null)
+        return undefined;
+    const pageIndex = Number(raw);
+    return Number.isFinite(pageIndex) ? pageIndex : undefined;
 };
 export const encodeColumnFilters = (state) => {
     return (state.columnFilters
@@ -59,15 +62,16 @@ export const decodeColumnFilters = () => {
     });
 };
 export const decodeTableState = () => {
-    return {
-        pagination: {
-            pageIndex: decodePageIndex(),
-            pageSize: 10,
-        },
+    const pageIndex = decodePageIndex();
+    const state = {
         sorting: decodeSorting(),
         columnFilters: decodeColumnFilters(),
         globalFilter: decodeGlobalFilter(),
     };
+    if (pageIndex !== undefined) {
+        state.pagination = { pageIndex, pageSize: 10 };
+    }
+    return state;
 };
 export const encodeTableState = (state, options, searchParams) => {
     if (searchParams === undefined) {

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

@@ -34,7 +34,9 @@ export interface TableUrlSyncOptions {
  *
  * The table is hydrated from the URL immediately, before the first render, so
  * row-model auto-resets (which are skipped on their first run) can't clobber
- * the URL-backed state.
+ * the URL-backed state. URL params override `initialState`; params missing
+ * from the URL leave `initialState` in place, and the initial state is then
+ * written back to the URL like any other state.
  *
  * By default all four params are synced; pass {@link TableUrlSyncOptions} to
  * enable only a subset, e.g. `useTableUrlSync(table, { pagination: true })`.

package/dist/components/custom/data-table/table-url-sync.svelte.js

@@ -17,7 +17,9 @@ import { decodeColumnFilters, decodeGlobalFilter, decodePageIndex, decodeSorting
  *
  * The table is hydrated from the URL immediately, before the first render, so
  * row-model auto-resets (which are skipped on their first run) can't clobber
- * the URL-backed state.
+ * the URL-backed state. URL params override `initialState`; params missing
+ * from the URL leave `initialState` in place, and the initial state is then
+ * written back to the URL like any other state.
  *
  * By default all four params are synced; pass {@link TableUrlSyncOptions} to
  * enable only a subset, e.g. `useTableUrlSync(table, { pagination: true })`.
@@ -31,18 +33,32 @@ export function useTableUrlSync(table, options) {
         ...options,
     };
     const params = useSearchParams(defaultSearchParamSchema, { pushHistory: false });
-    // Hydrate from the URL before the first render. Sorting/filter/data changes
-    // defer an autoResetPageIndex microtask via the adapter's schedule; row
-    // models skip auto-resets on their first run, so applying the URL state
-    // up-front can't be undone by them (a post-mount hydration would be).
-    if (enabled.globalFilter)
-        table.setGlobalFilter(decodeGlobalFilter() ?? "");
-    if (enabled.sorting)
-        table.setSorting(decodeSorting() ?? []);
-    if (enabled.pagination)
-        table.setPageIndex(decodePageIndex());
-    if (enabled.columnFilters)
-        table.setColumnFilters(decodeColumnFilters() ?? []);
+    // Hydrate from the URL before the first render, but only for params the URL
+    // actually carries — absent params leave the table's `initialState` in place
+    // (the write-back effect below then publishes it to the URL). Sorting/filter/
+    // data changes defer an autoResetPageIndex microtask via the adapter's
+    // schedule; row models skip auto-resets on their first run, so applying the
+    // URL state up-front can't be undone by them (a post-mount hydration would be).
+    if (enabled.globalFilter) {
+        const globalFilter = decodeGlobalFilter();
+        if (globalFilter !== undefined)
+            table.setGlobalFilter(globalFilter);
+    }
+    if (enabled.sorting) {
+        const sorting = decodeSorting();
+        if (sorting !== undefined)
+            table.setSorting(sorting);
+    }
+    if (enabled.pagination) {
+        const pageIndex = decodePageIndex();
+        if (pageIndex !== undefined)
+            table.setPageIndex(pageIndex);
+    }
+    if (enabled.columnFilters) {
+        const columnFilters = decodeColumnFilters();
+        if (columnFilters !== undefined)
+            table.setColumnFilters(columnFilters);
+    }
     // When navigating with new sort/search/filter params, snap back to the first
     // page unless the target URL explicitly points at a later page. Only same-route
     // query changes count: resetting on a cross-route navigation would mutate state

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@kayord/ui",
   "private": false,
-  "version": "4.0.3",
+  "version": "4.0.6",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/kayordDX/ui.git"
@@ -118,7 +118,7 @@
     "@eslint/compat": "^2.1.0",
     "@eslint/js": "^10.0.1",
     "@internationalized/date": "^3.12.3",
-    "@lucide/svelte": "^1.37.0",
+    "@lucide/svelte": "^1.38.0",
     "@sveltejs/adapter-auto": "^7.0.1",
     "@sveltejs/kit": "^2.70.3",
     "@sveltejs/package": "^2.5.8",
@@ -154,7 +154,7 @@
     "tslib": "^2.8.1",
     "tw-animate-css": "1.4.0",
     "typescript": "^6.0.3",
-    "typescript-eslint": "^8.68.0",
+    "typescript-eslint": "^8.69.0",
     "vaul-svelte": "1.0.0-next.7",
     "vite": "^8.2.2",
     "vitest": "^4.1.11",