@igne-agency/react-web-ui 0.0.0-stage → 0.2.1

package/dist/data-table/data-table.js

@@ -0,0 +1,215 @@
+import { Pagination } from "../components/pagination/pagination.js";
+import { DataTableContent } from "./data-table-content.js";
+import { DataTableContext, useDataTable } from "./data-table-context.js";
+import { DataTableSelectionBar } from "./data-table-selection.js";
+import { PAGE_SIZE_OPTIONS } from "./table-features.js";
+import data_table_module_default from "./data-table.module.js";
+import { c } from "react/compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { clsx } from "clsx";
+// src/data-table/data-table.tsx
+var Root = (t0) => {
+	const $ = c(14);
+	const { table, selection, status, isFetching: t1, onRetry, children, className } = t0;
+	const isFetching = t1 === void 0 ? false : t1;
+	let t2;
+	if ($[0] !== isFetching || $[1] !== onRetry || $[2] !== selection || $[3] !== status || $[4] !== table) {
+		t2 = {
+			table,
+			selection,
+			status,
+			isFetching,
+			onRetry
+		};
+		$[0] = isFetching;
+		$[1] = onRetry;
+		$[2] = selection;
+		$[3] = status;
+		$[4] = table;
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== className) {
+		t3 = clsx(data_table_module_default.root, className);
+		$[6] = className;
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	if ($[8] !== children || $[9] !== t3) {
+		t4 = /* @__PURE__ */ jsx("div", {
+			className: t3,
+			children
+		});
+		$[8] = children;
+		$[9] = t3;
+		$[10] = t4;
+	} else t4 = $[10];
+	let t5;
+	if ($[11] !== t2 || $[12] !== t4) {
+		t5 = /* @__PURE__ */ jsx(DataTableContext, {
+			value: t2,
+			children: t4
+		});
+		$[11] = t2;
+		$[12] = t4;
+		$[13] = t5;
+	} else t5 = $[13];
+	return t5;
+};
+/** Layout slot above the table for search, filters and actions. */
+var Toolbar = (t0) => {
+	const $ = c(5);
+	const { children, className } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = clsx(data_table_module_default.toolbar, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== children || $[3] !== t1) {
+		t2 = /* @__PURE__ */ jsx("div", {
+			className: t1,
+			children
+		});
+		$[2] = children;
+		$[3] = t1;
+		$[4] = t2;
+	} else t2 = $[4];
+	return t2;
+};
+/**
+* The kit's `Pagination`, driven by the instance's pagination API (built with
+* `manualPagination` + server `rowCount`). The page sizes come from the
+* table's `meta.pageSizeOptions`, and picking one returns to the first page.
+*/
+var DataTablePagination = (t0) => {
+	const $ = c(27);
+	const { pageSizeLabel, indexLabel, firstLabel, previousLabel, nextLabel, lastLabel, className } = t0;
+	const { table } = useDataTable();
+	const { pageIndex, pageSize } = table.state.pagination;
+	let t1;
+	if ($[0] !== className) {
+		t1 = clsx(data_table_module_default.pagination, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== table) {
+		t2 = table.getPageCount();
+		$[2] = table;
+		$[3] = t2;
+	} else t2 = $[3];
+	const t3 = Math.max(t2, 1);
+	const t4 = table.options.meta?.pageSizeOptions ?? PAGE_SIZE_OPTIONS;
+	let t5;
+	let t6;
+	if ($[4] !== table) {
+		t5 = (next) => {
+			table.setPageIndex(next);
+		};
+		t6 = (next_0) => {
+			table.setPagination({
+				pageIndex: 0,
+				pageSize: next_0
+			});
+		};
+		$[4] = table;
+		$[5] = t5;
+		$[6] = t6;
+	} else {
+		t5 = $[5];
+		t6 = $[6];
+	}
+	let t7;
+	if ($[7] !== pageSizeLabel) {
+		t7 = /* @__PURE__ */ jsx(Pagination.PageSize, { label: pageSizeLabel });
+		$[7] = pageSizeLabel;
+		$[8] = t7;
+	} else t7 = $[8];
+	let t8;
+	if ($[9] !== indexLabel) {
+		t8 = /* @__PURE__ */ jsx(Pagination.Index, { label: indexLabel });
+		$[9] = indexLabel;
+		$[10] = t8;
+	} else t8 = $[10];
+	let t9;
+	if ($[11] !== firstLabel || $[12] !== lastLabel || $[13] !== nextLabel || $[14] !== previousLabel) {
+		t9 = /* @__PURE__ */ jsx(Pagination.Controls, {
+			firstLabel,
+			previousLabel,
+			nextLabel,
+			lastLabel
+		});
+		$[11] = firstLabel;
+		$[12] = lastLabel;
+		$[13] = nextLabel;
+		$[14] = previousLabel;
+		$[15] = t9;
+	} else t9 = $[15];
+	let t10;
+	if ($[16] !== pageIndex || $[17] !== pageSize || $[18] !== t1 || $[19] !== t3 || $[20] !== t4 || $[21] !== t5 || $[22] !== t6 || $[23] !== t7 || $[24] !== t8 || $[25] !== t9) {
+		t10 = /* @__PURE__ */ jsxs(Pagination.Root, {
+			className: t1,
+			pageIndex,
+			pageCount: t3,
+			pageSize,
+			pageSizes: t4,
+			onPageIndexChange: t5,
+			onPageSizeChange: t6,
+			children: [
+				t7,
+				t8,
+				t9
+			]
+		});
+		$[16] = pageIndex;
+		$[17] = pageSize;
+		$[18] = t1;
+		$[19] = t3;
+		$[20] = t4;
+		$[21] = t5;
+		$[22] = t6;
+		$[23] = t7;
+		$[24] = t8;
+		$[25] = t9;
+		$[26] = t10;
+	} else t10 = $[26];
+	return t10;
+};
+/**
+* Composite data table over a TanStack Table instance. `Root` holds the
+* instance and the injected query state in context; the parts lay it out:
+* `Toolbar`, `SelectionBar`, `Content` and `Pagination`. A nested sub-table
+* gets its own `DataTable.Root`, with its own instance and context.
+*
+* @example
+* <DataTable.Root table={table} status={query.status} isFetching={query.isFetching}>
+* 	<DataTable.Toolbar>
+* 		<FilterBar.Root filters={filters}>…</FilterBar.Root>
+* 	</DataTable.Toolbar>
+* 	<DataTable.Content
+* 		emptyState="No declarations yet."
+* 		errorLabel="The declarations could not be loaded."
+* 		loadingLabel="Loading declarations"
+* 		slowLabel="This is taking longer than usual."
+* 		retryLabel="Try again"
+* 	/>
+* 	<DataTable.Pagination
+* 		pageSizeLabel="Rows per page"
+* 		indexLabel={page => `Page ${page.pageIndex + 1} of ${page.pageCount}`}
+* 		firstLabel="First page"
+* 		previousLabel="Previous page"
+* 		nextLabel="Next page"
+* 		lastLabel="Last page"
+* 	/>
+* </DataTable.Root>
+*/
+var DataTable = {
+	Root,
+	Toolbar,
+	Content: DataTableContent,
+	Pagination: DataTablePagination,
+	SelectionBar: DataTableSelectionBar
+};
+export { DataTable };

package/dist/data-table/data-table.module.js

@@ -0,0 +1,68 @@
+import './data-table.css';// src/data-table/data-table.module.scss
+var root = "_root_i4wmq_3";
+var toolbar = "_toolbar_i4wmq_77";
+var scrollFrame = "_scrollFrame_i4wmq_84";
+var stale = "_stale_i4wmq_92";
+var staleOverlay = "_staleOverlay_i4wmq_98";
+var contentWrap = "_contentWrap_i4wmq_101";
+var th = "_th_i4wmq_132";
+var edgeStart = "_edgeStart_i4wmq_1";
+var edgeEnd = "_edgeEnd_i4wmq_1";
+var refreshFailed = "_refreshFailed_i4wmq_165";
+var table = "_table_i4wmq_177";
+var thead = "_thead_i4wmq_185";
+var sortToggle = "_sortToggle_i4wmq_200";
+var sortIconIdle = "_sortIconIdle_i4wmq_251";
+var td = "_td_i4wmq_255";
+var row = "_row_i4wmq_280";
+var subRow = "_subRow_i4wmq_302";
+var skeletonBar = "_skeletonBar_i4wmq_311";
+var busyCaption = "_busyCaption_i4wmq_314";
+var stateCell = "_stateCell_i4wmq_322";
+var errorState = "_errorState_i4wmq_327";
+var pagination = "_pagination_i4wmq_330";
+var selectionContainer = "_selectionContainer_i4wmq_334";
+var selectionBar = "_selectionBar_i4wmq_338";
+var selectionSummary = "_selectionSummary_i4wmq_408";
+var selectionTotal = "_selectionTotal_i4wmq_423";
+var selectionCount = "_selectionCount_i4wmq_424";
+var selectionMeasure = "_selectionMeasure_i4wmq_425";
+var selectionStatus = "_selectionStatus_i4wmq_457";
+var selectionActions = "_selectionActions_i4wmq_465";
+var selectionSelectAll = "_selectionSelectAll_i4wmq_495";
+var selectionBulk = "_selectionBulk_i4wmq_498";
+var data_table_module_default = {
+	root,
+	toolbar,
+	scrollFrame,
+	stale,
+	staleOverlay,
+	contentWrap,
+	th,
+	edgeStart,
+	edgeEnd,
+	refreshFailed,
+	table,
+	thead,
+	sortToggle,
+	sortIconIdle,
+	td,
+	row,
+	subRow,
+	skeletonBar,
+	busyCaption,
+	stateCell,
+	errorState,
+	pagination,
+	selectionContainer,
+	selectionBar,
+	selectionSummary,
+	selectionTotal,
+	selectionCount,
+	selectionMeasure,
+	selectionStatus,
+	selectionActions,
+	selectionSelectAll,
+	selectionBulk
+};
+export { busyCaption, contentWrap, data_table_module_default as default, edgeEnd, edgeStart, errorState, pagination, refreshFailed, root, row, scrollFrame, selectionActions, selectionBar, selectionBulk, selectionContainer, selectionCount, selectionMeasure, selectionSelectAll, selectionStatus, selectionSummary, selectionTotal, skeletonBar, sortIconIdle, sortToggle, stale, staleOverlay, stateCell, subRow, table, td, th, thead, toolbar };

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

@@ -0,0 +1,6 @@
+export * from "./data-table.tsx";
+export type { DataTableContentProps } from "./data-table-content.tsx";
+export { type DataTableState, useDataTable, } from "./data-table-context.tsx";
+export { type DataTableSelectionBarProps, type SelectionColumnOptions, selectionColumn, } from "./data-table-selection.tsx";
+export type { DataTableStatus } from "./resolve-view.ts";
+export * from "./table-features.ts";

package/dist/data-table/index.js

@@ -0,0 +1,5 @@
+import { DataTable } from "./data-table.js";
+import { useDataTable } from "./data-table-context.js";
+import { selectionColumn } from "./data-table-selection.js";
+import { EMPTY_ROWS, PAGE_SIZE_OPTIONS, dataTableFeatures } from "./table-features.js";
+export { DataTable, EMPTY_ROWS, PAGE_SIZE_OPTIONS, dataTableFeatures, selectionColumn, useDataTable };

package/dist/data-table/resolve-view.d.ts

@@ -0,0 +1,31 @@
+/** The lifecycle status of the query a `DataTable` shows, as TanStack Query reports it. */
+export type DataTableStatus = "pending" | "error" | "success";
+/** Which body state `DataTable.Content` should render. */
+export type TableView = "loading" | "error" | "empty" | "ready";
+export type ResolvedView = Readonly<{
+    view: TableView;
+    /**
+     * True when rendered rows are from a previous successful fetch while a
+     * background refetch is in flight. Drives the subtle "stale" affordance.
+     */
+    stale: boolean;
+    /**
+     * True when the fetch failed but earlier rows are still on screen, so the
+     * failure is reported alongside them instead of replacing the body.
+     */
+    refreshFailed: boolean;
+}>;
+/**
+ * Maps an injected query state to the single body view `DataTable.Content`
+ * renders. Rows never unmount once they are on screen: a failure with rows
+ * still present stays on the `"ready"` body and reports `refreshFailed`.
+ *
+ * @example
+ * resolveView({ status: "success", isFetching: true, hasRows: true });
+ * // => { view: "ready", stale: true, refreshFailed: false }
+ */
+export declare const resolveView: ({ status, isFetching, hasRows, }: Readonly<{
+    status: DataTableStatus;
+    isFetching: boolean;
+    hasRows: boolean;
+}>) => ResolvedView;

package/dist/data-table/resolve-view.js

@@ -0,0 +1,37 @@
+// src/data-table/resolve-view.ts
+/**
+* Maps an injected query state to the single body view `DataTable.Content`
+* renders. Rows never unmount once they are on screen: a failure with rows
+* still present stays on the `"ready"` body and reports `refreshFailed`.
+*
+* @example
+* resolveView({ status: "success", isFetching: true, hasRows: true });
+* // => { view: "ready", stale: true, refreshFailed: false }
+*/
+var resolveView = ({ status, isFetching, hasRows }) => {
+	if (status === "error") return hasRows ? {
+		view: "ready",
+		stale: false,
+		refreshFailed: true
+	} : {
+		view: "error",
+		stale: false,
+		refreshFailed: false
+	};
+	if (status === "pending") return {
+		view: "loading",
+		stale: false,
+		refreshFailed: false
+	};
+	if (!hasRows) return {
+		view: "empty",
+		stale: false,
+		refreshFailed: false
+	};
+	return {
+		view: "ready",
+		stale: isFetching,
+		refreshFailed: false
+	};
+};
+export { resolveView };

package/dist/data-table/table-features.d.ts

@@ -0,0 +1,69 @@
+import { rowExpandingFeature, rowPaginationFeature, rowSelectionFeature, rowSortingFeature } from "@tanstack/react-table";
+import type { ReactNode } from "react";
+/** Per-column options a `DataTable` reads from a column definition's `meta`. */
+export type DataTableColumnMeta = Readonly<{
+    /**
+     * Collapse the column to its content width rather than letting it take a
+     * share of the free space. For icon-button and control columns.
+     */
+    fit?: boolean;
+    /**
+     * This column holds quantities — amounts, counts, measures — and is
+     * end-aligned, with its unit named in the header. Not for codes or dates.
+     */
+    numeric?: boolean;
+    /**
+     * Pin this column to an edge of the scroll container, so it stays put while
+     * the rest of the table scrolls sideways. At most two per edge, and each
+     * edge's columns must be adjacent and sit at that edge of the column list.
+     */
+    sticky?: "start" | "end";
+    /**
+     * What this column draws in a placeholder row while the first page loads.
+     * Every other column falls back to a skeleton bar.
+     */
+    placeholderCell?: () => ReactNode;
+}>;
+/** The page sizes a table offers, as a list that is never empty. */
+export type PageSizeOptions = readonly [
+    number,
+    ...number[]
+];
+/**
+ * The page sizes a table offers when it names none of its own.
+ *
+ * @example
+ * pageSizeOptions: PAGE_SIZE_OPTIONS, // 10, 25, 50, 100
+ */
+export declare const PAGE_SIZE_OPTIONS: PageSizeOptions;
+/** Per-table options a `DataTable` reads from a table's `meta`. */
+export type DataTableMeta = Readonly<{
+    /** The page sizes the pagination control offers. */
+    pageSizeOptions?: PageSizeOptions;
+}>;
+/** The TanStack Table features a `DataTable` instance registers. */
+export type DataTableFeatures = Readonly<{
+    rowSortingFeature: typeof rowSortingFeature;
+    rowPaginationFeature: typeof rowPaginationFeature;
+    rowExpandingFeature: typeof rowExpandingFeature;
+    rowSelectionFeature: typeof rowSelectionFeature;
+    tableMeta: DataTableMeta;
+    columnMeta: DataTableColumnMeta;
+}>;
+/**
+ * The feature set a `DataTable` instance registers. No row-model slots:
+ * sorting and pagination are server-owned and expansion drives the table's
+ * own sub-row rendering.
+ *
+ * @example
+ * const table = useTable<DataTableFeatures, Row>({ features: dataTableFeatures, columns, data });
+ */
+export declare const dataTableFeatures: DataTableFeatures;
+/**
+ * A frozen empty rows array. Pass it as the `data` default when building the
+ * table instance, so an undefined query result never mints a new array.
+ *
+ * @example
+ * data: query.data?.items ?? EMPTY_ROWS,
+ */
+export declare const EMPTY_ROWS: never[];

package/dist/data-table/table-features.js

@@ -0,0 +1,41 @@
+import { metaHelper, rowExpandingFeature, rowPaginationFeature, rowSelectionFeature, rowSortingFeature, tableFeatures } from "@tanstack/react-table";
+// src/data-table/table-features.ts
+/**
+* The page sizes a table offers when it names none of its own.
+*
+* @example
+* pageSizeOptions: PAGE_SIZE_OPTIONS, // 10, 25, 50, 100
+*/
+var PAGE_SIZE_OPTIONS = [
+	10,
+	25,
+	50,
+	100
+];
+/**
+* The feature set a `DataTable` instance registers. No row-model slots:
+* sorting and pagination are server-owned and expansion drives the table's
+* own sub-row rendering.
+*
+* @example
+* const table = useTable<DataTableFeatures, Row>({ features: dataTableFeatures, columns, data });
+*/
+var dataTableFeatures = tableFeatures({
+	rowSortingFeature,
+	rowPaginationFeature,
+	rowExpandingFeature,
+	rowSelectionFeature,
+	tableMeta: metaHelper(),
+	columnMeta: metaHelper()
+});
+var emptyRows = [];
+Object.freeze(emptyRows);
+/**
+* A frozen empty rows array. Pass it as the `data` default when building the
+* table instance, so an undefined query result never mints a new array.
+*
+* @example
+* data: query.data?.items ?? EMPTY_ROWS,
+*/
+var EMPTY_ROWS = emptyRows;
+export { EMPTY_ROWS, PAGE_SIZE_OPTIONS, dataTableFeatures };

package/dist/data-table/use-sticky-offsets.d.ts

@@ -0,0 +1,21 @@
+import { type RefObject } from "react";
+/**
+ * Publishes the measured geometry of a table's pinned columns as custom
+ * properties on the element the returned ref is attached to: one
+ * `--table-sticky-inset-{n}` per column pinned to the start and one
+ * `--table-sticky-end-{n}` per column pinned to the end, each holding
+ * everything between it and its edge, plus `--table-sticky-total` and
+ * `--table-sticky-end-total` for each group as a whole, and
+ * `--table-scrollbar-block` / `--table-scrollbar-inline` for the space the
+ * scroller's own scrollbars take. Widths are measured off the header cells of
+ * the frame's own table and re-measured on resize.
+ *
+ * @param pinnedColumnKey - The pinned column ids joined into one string; a
+ * changed pinned set re-runs the measurement.
+ * @returns Ref for the non-scrolling frame around the table.
+ *
+ * @example
+ * const frameRef = useStickyOffsets(pinnedIds.join(","));
+ * // <div ref={frameRef}> … <td style={{ insetInlineStart: "var(--table-sticky-inset-0)" }} />
+ */
+export declare const useStickyOffsets: (pinnedColumnKey: string) => RefObject<HTMLDivElement | null>;

package/dist/data-table/use-sticky-offsets.js

@@ -0,0 +1,86 @@
+import { c } from "react/compiler-runtime";
+import { useLayoutEffect, useRef } from "react";
+// src/data-table/use-sticky-offsets.ts
+var START_PROPERTY = "--table-sticky-inset";
+var END_PROPERTY = "--table-sticky-end";
+var TOTAL_PROPERTY = "--table-sticky-total";
+var END_TOTAL_PROPERTY = "--table-sticky-end-total";
+var SCROLLBAR_BLOCK_PROPERTY = "--table-scrollbar-block";
+var SCROLLBAR_INLINE_PROPERTY = "--table-scrollbar-inline";
+/**
+* Publishes the measured geometry of a table's pinned columns as custom
+* properties on the element the returned ref is attached to: one
+* `--table-sticky-inset-{n}` per column pinned to the start and one
+* `--table-sticky-end-{n}` per column pinned to the end, each holding
+* everything between it and its edge, plus `--table-sticky-total` and
+* `--table-sticky-end-total` for each group as a whole, and
+* `--table-scrollbar-block` / `--table-scrollbar-inline` for the space the
+* scroller's own scrollbars take. Widths are measured off the header cells of
+* the frame's own table and re-measured on resize.
+*
+* @param pinnedColumnKey - The pinned column ids joined into one string; a
+* changed pinned set re-runs the measurement.
+* @returns Ref for the non-scrolling frame around the table.
+*
+* @example
+* const frameRef = useStickyOffsets(pinnedIds.join(","));
+* // <div ref={frameRef}> … <td style={{ insetInlineStart: "var(--table-sticky-inset-0)" }} />
+*/
+var useStickyOffsets = (pinnedColumnKey) => {
+	const $ = c(3);
+	const frameRef = useRef(null);
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = () => {
+			const frame = frameRef.current;
+			if (!frame) return;
+			const scroller = frame.querySelector("[data-scroller]");
+			const table = frame.querySelector("table");
+			const headerCells = (side) => Array.from(table?.querySelectorAll(`:scope > thead [data-sticky="${side}"]`) ?? []);
+			const startCells = headerCells("start");
+			const endCells = headerCells("end");
+			const publish = () => {
+				const total = startCells.reduce((offset, cell, index) => {
+					frame.style.setProperty(`${START_PROPERTY}-${index}`, `${offset}px`);
+					return offset + cell.getBoundingClientRect().width;
+				}, 0);
+				frame.style.setProperty(TOTAL_PROPERTY, `${total}px`);
+				const endTotal = endCells.reduceRight((offset_0, cell_0, index_0) => {
+					frame.style.setProperty(`${END_PROPERTY}-${index_0}`, `${offset_0}px`);
+					return offset_0 + cell_0.getBoundingClientRect().width;
+				}, 0);
+				frame.style.setProperty(END_TOTAL_PROPERTY, `${endTotal}px`);
+				if (scroller) {
+					frame.style.setProperty(SCROLLBAR_BLOCK_PROPERTY, `${scroller.offsetHeight - scroller.clientHeight}px`);
+					frame.style.setProperty(SCROLLBAR_INLINE_PROPERTY, `${scroller.offsetWidth - scroller.clientWidth}px`);
+				}
+			};
+			publish();
+			const observer = new ResizeObserver(publish);
+			for (const cell_1 of [
+				...startCells,
+				...endCells,
+				...scroller ? [scroller] : []
+			]) observer.observe(cell_1);
+			return () => {
+				observer.disconnect();
+				for (const index_1 of startCells.keys()) frame.style.removeProperty(`${START_PROPERTY}-${index_1}`);
+				for (const index_2 of endCells.keys()) frame.style.removeProperty(`${END_PROPERTY}-${index_2}`);
+				frame.style.removeProperty(TOTAL_PROPERTY);
+				frame.style.removeProperty(END_TOTAL_PROPERTY);
+				frame.style.removeProperty(SCROLLBAR_BLOCK_PROPERTY);
+				frame.style.removeProperty(SCROLLBAR_INLINE_PROPERTY);
+			};
+		};
+		$[0] = t0;
+	} else t0 = $[0];
+	let t1;
+	if ($[1] !== pinnedColumnKey) {
+		t1 = [pinnedColumnKey];
+		$[1] = pinnedColumnKey;
+		$[2] = t1;
+	} else t1 = $[2];
+	useLayoutEffect(t0, t1);
+	return frameRef;
+};
+export { useStickyOffsets };

package/dist/data-view/index.d.ts

@@ -0,0 +1 @@
+export * from "./use-data-view.ts";

package/dist/data-view/index.js

@@ -0,0 +1 @@
+export { useDataView } from "./use-data-view.js";

package/dist/data-view/use-data-view.d.ts

@@ -0,0 +1,83 @@
+import { type DefaultError, type QueryKey, type UseQueryOptions, type UseQueryResult } from "@tanstack/react-query";
+import { type ColumnDef, type PaginationState, type ReactTable, type Row, type RowData, type SortingState } from "@tanstack/react-table";
+import { type FilterView } from "../components/filter-bar/use-filter-view.ts";
+import { type RowSelectionView } from "../lib/hooks/use-row-selection.ts";
+import type { StorageAdapter } from "../lib/storage.ts";
+import { type StoredValue } from "../lib/table-storage.ts";
+import { type DataTableFeatures, type PageSizeOptions } from "../data-table/table-features.ts";
+/**
+ * The current view parameters handed to the caller's `queryOptions` factory:
+ * committed filters, the debounced search, and table pagination + sorting.
+ */
+export type DataViewQueryParams<TFilters> = Readonly<{
+    filters: TFilters;
+    search: string;
+    pagination: PaginationState;
+    sorting: SortingState;
+}>;
+export type UseDataViewConfig<TFilters extends object, TRow extends RowData, TQueryData, TError, TQueryKey extends QueryKey> = Readonly<{
+    /**
+     * Stable id of this table instance, unique in the app. What the table
+     * remembers across reloads, such as its page size, is stored under it.
+     */
+    tableId: string;
+    initialFilters: TFilters;
+    /**
+     * Where the committed filters persist, usually
+     * `tableStoredValue(tableId, "filters", shape, storage)`. The table opens on
+     * them and writes them back on every commit.
+     */
+    storedFilters?: StoredValue<TFilters>;
+    /** The columns; a column is sortable when it sets `enableSorting`. */
+    columns: readonly ColumnDef<DataTableFeatures, TRow>[];
+    /**
+     * Query-options factory, parameterized by the committed filters, debounced
+     * search, pagination and sorting.
+     */
+    queryOptions: (params: DataViewQueryParams<TFilters>) => UseQueryOptions<TQueryData, TError, TQueryData, TQueryKey>;
+    /** Stable application id for a row. Required for selection. */
+    getRowId: (row: TRow) => string;
+    /** Whether a row offers to expand. @default never */
+    getRowCanExpand?: (row: Row<DataTableFeatures, TRow>) => boolean;
+    /** Extracts the current page's rows from the query data. */
+    getRows: (data: TQueryData) => readonly TRow[];
+    /** Extracts the server-side total row count from the query data. */
+    getRowCount: (data: TQueryData) => number;
+    initialPagination?: PaginationState;
+    /** The page sizes the user can pick from. @default PAGE_SIZE_OPTIONS */
+    pageSizeOptions?: PageSizeOptions;
+    initialSorting?: SortingState;
+    /** Debounce for the live search, in ms. @default 300 */
+    searchDelay?: number;
+    /** Where the picked page size persists, under `tableId`. Without it, nothing persists. */
+    storage?: StorageAdapter;
+}>;
+export type DataView<TFilters extends object, TRow extends RowData, TQueryData, TError> = Readonly<{
+    filters: FilterView<TFilters>;
+    table: ReactTable<DataTableFeatures, TRow>;
+    query: UseQueryResult<TQueryData, TError>;
+    selection: RowSelectionView;
+}>;
+/**
+ * Orchestrates a server-driven, filterable table: `useFilterView`, a TanStack
+ * Query and a TanStack Table instance with manual pagination and sorting, plus
+ * a row selection. Pagination, sorting, expansion and selection live in the
+ * instance's own state: read `table.state`, never mirror it back through
+ * `options.state`. A new filter or search returns to the first page and clears
+ * the selection, and rows from the last settled page stay on screen when a
+ * fetch fails.
+ *
+ * @example
+ * const { filters, table, query, selection } = useDataView({
+ * 	tableId: "declarations",
+ * 	initialFilters: {},
+ * 	columns,
+ * 	queryOptions: ({ filters, search, pagination, sorting }) =>
+ * 		declarationsQuery({ filters, search, pagination, sorting }),
+ * 	getRowId: row => row.id,
+ * 	getRows: data => data.rows,
+ * 	getRowCount: data => data.totalCount,
+ * 	storage: localStorageAdapter,
+ * });
+ */
+export declare const useDataView: <TFilters extends object, TRow extends RowData, TQueryData, TError = DefaultError, TQueryKey extends QueryKey = QueryKey>({ tableId, initialFilters, storedFilters, columns, queryOptions, getRowId, getRowCanExpand, getRows, getRowCount, initialPagination, pageSizeOptions, initialSorting, searchDelay, storage, }: UseDataViewConfig<TFilters, TRow, TQueryData, TError, TQueryKey>) => DataView<TFilters, TRow, TQueryData, TError>;