@iyulab/flex-table 0.32.0 → 0.33.0

package/CHANGELOG.md

@@ -1,5 +1,46 @@
 # Changelog
 
+## [0.33.0] - 2026-09-08
+
+### Fixed
+
+- **A page could outlive the result set that holds it, leaving an empty table next
+  to a non-zero total and a pager pointing at a page that no longer exists.**
+  Three axes change the size of a result set, and only two of them moved the page.
+
+  - **`useODataSource`: changing `fixedFilter` now resets the page to `0`**, the
+    same way `setSearch` and `onSortChange` already did. Narrowing a filter while
+    on page 5 previously kept the old `$skip` and asked for a range the new set
+    does not have. Comparison is by value, so passing a fresh object literal on
+    every render does not reset anything on its own, and the reset does not run on
+    mount, so it never overrides `initialPage`.
+  - **`useODataSource`: a response reporting fewer rows than the current page needs
+    falls back to the last page that exists.** A result set can shrink without
+    being asked. Reaching that state costs one extra request, only in that case;
+    the page only ever moves down, so it cannot loop.
+  - **`useArraySource`: paging is clamped to the array passed in.** Shrinking the
+    array — the in-memory equivalent of narrowing a filter — falls back to the last
+    page that exists instead of rendering nothing.
+
+  Shrinking clamps rather than resets on purpose: an array or a total can change on
+  a routine refresh, and resetting there would move the page out from under the
+  reader. The dividing question is whether the change was asked for.
+
+### Changed
+
+- **`computeArrayView` returns the last page that exists when given a page past the
+  end**, instead of an empty array. It is exported, so a direct caller had the same
+  defect; returning nothing for an out-of-range page was never the intended
+  contract.
+
+### Internal
+
+- First hook tests for this package — everything here was pure functions until now,
+  so contracts the README states had no executed evidence behind them. They cover
+  the reset and clamp on both hooks, request abort on re-request and on unmount,
+  `onUnauthorized` firing on `401`/`403` but not on `500`, initial state being read
+  on first render only, and `refresh` being a no-op on the array source.
+
 ## [0.32.0] - 2026-09-08
 
 ### Added

package/README.md

@@ -587,13 +587,26 @@ const source = useODataSource('/api/orders', {
 | `initialPage` | `0` | Initial page, **zero-based** — the same axis as the returned `page`/`setPage`, and `$skip` is `page * pageSize` |
 | `initialSearch` | `''` | Initial search term |
 | `initialSort` | — | Initial sort as `SortCriteria[]`. Takes precedence over `defaultOrderBy` — it is the shape `onSortChange` hands you, so a stored sort round-trips without re-serializing it |
-| `fixedFilter` | — | Filter always applied in addition to search |
+| `fixedFilter` | — | Filter always applied in addition to search. Changing it resets the page to 0 — see below |
 | `baseUrl` | `window.location.origin` | Override the request origin (proxy/BFF setups) |
 | `fetcher` | global `fetch` | Custom transport — pass a wrapper that injects auth headers |
 | `onUnauthorized` | — | Called on `401`/`403` responses, before the generic error is set |
 
 `fetcher`/`onUnauthorized` should be stable references (e.g. wrap in `useCallback`) — they are intentionally excluded from the hook's internal effect dependencies to avoid refetch loops on every render.
 
+Changing `fixedFilter` resets the page to `0`, the same way `setSearch` and `onSortChange`
+already do. All three change the size of the result set, so keeping the old `$skip` would
+request a range the new set no longer has — a filter applied while on page 5 would come back
+empty. Comparison is by value, not by reference, so passing a fresh object literal on every
+render (`fixedFilter={{ IsActive: true }}`) does not reset anything on its own. The reset
+does not run on mount, so it never overrides `initialPage`.
+
+If a response reports fewer rows than the current page needs, the page falls back to the
+last page that exists — a result set can shrink without you asking (another user deleting
+rows, a `refresh` landing after a change), and holding the old `$skip` would leave an empty
+table next to a non-zero total. Reaching that state costs one extra request, only in that
+case; the page only ever moves down, so it cannot loop.
+
 The three `initial*` options are read **on the first render only** (the same contract
 `defaultOrderBy` has always had); use `setPage`/`setSearch` to move afterwards. Reach for
 them when a list has to come back the way the user left it — going to a detail screen and
@@ -650,6 +663,12 @@ returns the **same shape** as `useODataSource` — `data`/`totalCount`/`loading`
 `page`/`setPage`/`sortCriteria`/`onSortChange`/`search`/`setSearch`/`refresh` — so the
 same `<FlexTableReact dataMode="server" ...>` binding code works with either source.
 
+Paging is clamped to the data you pass: if the array shrinks below the current page — the
+in-memory equivalent of narrowing a filter, usually `rows.filter(...)` upstream — the hook
+falls back to the last page that exists instead of rendering an empty table. It only ever
+moves the page down, so an array that changes identity on every poll without changing length
+leaves the current page alone.
+
 Reach for this when the rows come from a client-side join a server query can't express —
 e.g. a lookup table whose display name lives on a different endpoint than the row itself,
 so search/sort has to run after the join, in memory:

package/dist/array/index.js

@@ -1,13 +1,13 @@
 import { t as e } from "../sorting-CjfjRxwL.js";
-import { r as t } from "../use-odata-source--wXFYeqA.js";
+import { r as t } from "../use-odata-source-6fVz-CLu.js";
 import { useCallback as n, useMemo as r, useState as i } from "react";
 //#region src/array/use-array-source.ts
 function a(t, { search: n, sortCriteria: r, page: i, pageSize: a, columns: o, searchFields: s }) {
 	let c = n.trim().toLowerCase(), l = c ? t.filter((e) => (s ? s(e) : Object.values(e)).some((e) => e != null && String(e).toLowerCase().includes(c))) : t, u = l;
 	r.length > 0 && (u = e(l, r, o ?? []).map((e) => l[e]));
-	let d = u.length, f = i * a;
+	let d = u.length, f = d === 0 ? 0 : Math.ceil(d / a) - 1, p = Math.min(Math.max(i, 0), f) * a;
 	return {
-		data: u.slice(f, f + a),
+		data: u.slice(p, p + a),
 		totalCount: d
 	};
 }
@@ -37,8 +37,8 @@ function o(e, o = {}) {
 		s,
 		f,
 		p
-	]);
-	return {
+	]), E = T === 0 ? 0 : Math.ceil(T / s) - 1;
+	return h > E && g(E), {
 		data: w,
 		totalCount: T,
 		loading: !1,

package/dist/array/use-array-source.hooks.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/odata/index.js

@@ -1,2 +1,2 @@
-import { i as e, n as t, t as n } from "../use-odata-source--wXFYeqA.js";
+import { i as e, n as t, t as n } from "../use-odata-source-6fVz-CLu.js";
 export { n as buildSearchExpression, t as parseOrderBy, e as useODataSource };

package/dist/odata/use-odata-source.hooks.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/{use-odata-source--wXFYeqA.js → use-odata-source-6fVz-CLu.js}

@@ -19,18 +19,20 @@ function s(s, c = {}) {
 		initialPage: d,
 		initialSearch: f,
 		initialSort: p
-	}), [O, k] = r(D.page), [A, j] = r(D.sortCriteria), [M, N] = r(D.search), [P, F] = r(0), I = n(null), L = e(() => {
+	}), [O, k] = r(D.page), [A, j] = r(D.sortCriteria), [M, N] = r(D.search), [P, F] = r(0), [I, L] = r(v);
+	v !== I && (L(v), k(0));
+	let R = n(null), z = e(() => {
 		F((e) => e + 1);
-	}, []), R = e((e) => {
+	}, []), B = e((e) => {
 		N(e), k(0);
-	}, []), z = e((e) => {
+	}, []), V = e((e) => {
 		let t = e.detail?.criteria;
 		t && (j(t), k(0));
 	}, []);
 	return t(() => {
-		I.current?.abort();
+		R.current?.abort();
 		let e = new AbortController();
-		I.current = e, w(!0), E(null);
+		R.current = e, w(!0), E(null);
 		let t = A.length > 0 ? A.map((e) => `${e.key} ${e.direction}`).join(", ") : u, n = {
 			top: l,
 			skip: O * l,
@@ -53,7 +55,11 @@ function s(s, c = {}) {
 			}
 			return e.json();
 		}).then((t) => {
-			e.signal.aborted || (b(t.value ?? t), S(t["@odata.count"] ?? 0), E(null));
+			if (e.signal.aborted) return;
+			let n = t["@odata.count"] ?? 0;
+			b(t.value ?? t), S(n), E(null);
+			let r = n === 0 ? 0 : Math.ceil(n / l) - 1;
+			O > r && k(r);
 		}).catch((t) => {
 			e.signal.aborted || t.name !== "AbortError" && (E(t.message), b([]), S(0));
 		}).finally(() => {
@@ -77,10 +83,10 @@ function s(s, c = {}) {
 		page: O,
 		setPage: k,
 		sortCriteria: A,
-		onSortChange: z,
+		onSortChange: V,
 		search: M,
-		setSearch: R,
-		refresh: L
+		setSearch: B,
+		refresh: z
 	};
 }
 function c(e) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iyulab/flex-table",
-  "version": "0.32.0",
+  "version": "0.33.0",
   "description": "A minimalist, input-centric data grid web component",
   "type": "module",
   "main": "./dist/flex-table.js",
@@ -88,6 +88,7 @@
     "@lit/react": "^1.0.8",
     "@types/node": "^26.1.1",
     "@types/react": "^19.2.17",
+    "@types/react-dom": "^19.2.7",
     "@typescript-eslint/eslint-plugin": "^8.64.0",
     "@typescript-eslint/parser": "^8.64.0",
     "eslint": "^10.1.0",
@@ -95,6 +96,7 @@
     "jsdom": "^29.1.1",
     "loupe": "^3.2.1",
     "react": "^19.2.7",
+    "react-dom": "^19.2.8",
     "strip-literal": "^3.1.0",
     "typescript": "~5.7.0",
     "vite": "^8.1.4",