@wordrhyme/auto-crud 1.7.0 → 1.8.0

package/dist/index.cjs

@@ -43,12 +43,12 @@ let __wordrhyme_ui = require("@wordrhyme/ui");
 __wordrhyme_ui = __toESM(__wordrhyme_ui);
 let zod = require("zod");
 zod = __toESM(zod);
+let __wordrhyme_formily_shadcn = require("@wordrhyme/formily-shadcn");
+__wordrhyme_formily_shadcn = __toESM(__wordrhyme_formily_shadcn);
 let __formily_core = require("@formily/core");
 __formily_core = __toESM(__formily_core);
 let __formily_reactive = require("@formily/reactive");
 __formily_reactive = __toESM(__formily_reactive);
-let __wordrhyme_formily_shadcn = require("@wordrhyme/formily-shadcn");
-__wordrhyme_formily_shadcn = __toESM(__wordrhyme_formily_shadcn);
 let sonner = require("sonner");
 sonner = __toESM(sonner);
 let __tanstack_react_query = require("@tanstack/react-query");
@@ -67,12 +67,66 @@ function DataTablePagination({ table, pageSizeOptions = [
 	30,
 	40,
 	50
-], className,...props }) {
+], alwaysShowFirstLast = false, responsive = false, showPageJump = false, pageJumpLabel = "Go to page", className,...props }) {
+	const pageJump = (0, react.useRef)(null);
+	const container = (0, react.useRef)(null);
+	const summary = (0, react.useRef)(null);
+	const controls = (0, react.useRef)(null);
+	const navigation = (0, react.useRef)(null);
+	const [hasSpace, setHasSpace] = (0, react.useState)(false);
+	const hideExtras = responsive && !hasSpace;
+	const hiddenClass = hideExtras ? "absolute invisible pointer-events-none left-0 top-0" : void 0;
+	const pageIndex = table.getState().pagination.pageIndex;
+	const pageCount = table.getPageCount();
+	const canJump = Number.isFinite(pageCount) && pageCount > 0;
 	const total = table.options.rowCount ?? (table.options.manualPagination ? void 0 : table.getRowCount());
+	(0, react.useEffect)(() => {
+		if (!responsive || !container.current || !summary.current || !controls.current || !navigation.current) return;
+		if (typeof ResizeObserver === "undefined") return;
+		const root = container.current;
+		const info = summary.current;
+		const group = controls.current;
+		const nav = navigation.current;
+		const jump = pageJump.current;
+		const gap = (node) => parseFloat(getComputedStyle(node).columnGap) || 0;
+		const width = (node) => {
+			const children = Array.from(node.children);
+			return children.reduce((sum, child) => {
+				const style = getComputedStyle(child);
+				return sum + (child === nav || child === jump ? width(child) : child.getBoundingClientRect().width) + (parseFloat(style.marginLeft) || 0) + (parseFloat(style.marginRight) || 0);
+			}, 0) + Math.max(0, children.length - 1) * gap(node);
+		};
+		const measure = () => {
+			const style = getComputedStyle(root);
+			const available = root.clientWidth - (parseFloat(style.paddingLeft) || 0) - (parseFloat(style.paddingRight) || 0);
+			const required = style.flexDirection.startsWith("column") ? Math.max(width(info), width(group)) : width(info) + width(group) + gap(root);
+			setHasSpace(available + .5 >= required);
+		};
+		const observer = new ResizeObserver(measure);
+		for (const node of [
+			root,
+			info,
+			group,
+			nav,
+			...info.children,
+			...group.children,
+			...nav.children,
+			...jump?.children ?? []
+		]) observer.observe(node);
+		measure();
+		return () => observer.disconnect();
+	}, [
+		responsive,
+		showPageJump,
+		alwaysShowFirstLast,
+		total !== void 0
+	]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: cn("flex w-full flex-col-reverse items-center justify-between gap-4 overflow-auto p-1 sm:flex-row sm:gap-8", className),
+		ref: container,
+		className: cn("flex w-full flex-col-reverse items-center justify-between gap-4 overflow-auto p-1 sm:flex-row sm:gap-8", responsive && "relative", className),
 		...props,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			ref: summary,
 			className: "flex flex-1 items-center gap-6 whitespace-nowrap text-muted-foreground text-sm",
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
 				table.getFilteredSelectedRowModel().rows.length,
@@ -82,7 +136,8 @@ function DataTablePagination({ table, pageSizeOptions = [
 				" row(s) selected."
 			] }), total !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: ["Total: ", total] })]
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			className: "flex flex-col-reverse items-center gap-4 sm:flex-row sm:gap-6 lg:gap-8",
+			ref: controls,
+			className: cn("flex items-center gap-4 sm:gap-6 lg:gap-8", responsive ? "flex-row flex-wrap justify-center whitespace-nowrap [&>*]:shrink-0" : "flex-col-reverse sm:flex-row"),
 			children: [
 				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: "flex items-center space-x-2",
@@ -110,19 +165,55 @@ function DataTablePagination({ table, pageSizeOptions = [
 					className: "flex items-center justify-center font-medium text-sm",
 					children: [
 						"Page ",
-						table.getState().pagination.pageIndex + 1,
+						pageIndex + 1,
 						" of ",
-						table.getPageCount()
+						pageCount
 					]
 				}),
+				showPageJump && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					ref: pageJump,
+					className: hideExtras ? "pointer-events-none absolute inset-x-0 top-0 invisible overflow-hidden" : void 0,
+					"aria-hidden": hideExtras || void 0,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+						className: "flex w-max items-center gap-2",
+						onSubmit: (event) => {
+							event.preventDefault();
+							const page = Number(new FormData(event.currentTarget).get("page"));
+							if (canJump && Number.isInteger(page) && page >= 1 && page <= pageCount) table.setPageIndex(page - 1);
+						},
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+							className: "flex items-center gap-2 whitespace-nowrap text-sm",
+							children: [pageJumpLabel, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Input, {
+								name: "page",
+								type: "number",
+								min: 1,
+								max: canJump ? pageCount : void 0,
+								step: 1,
+								required: true,
+								defaultValue: pageIndex + 1,
+								disabled: !canJump,
+								className: "h-8 w-20"
+							}, `${pageIndex}-${pageCount}`)]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Button, {
+							type: "submit",
+							variant: "outline",
+							size: "icon",
+							className: "size-8",
+							disabled: !canJump,
+							"aria-label": pageJumpLabel,
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRight, {})
+						})]
+					})
+				}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					ref: navigation,
 					className: "flex items-center space-x-2",
 					children: [
 						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Button, {
 							"aria-label": "Go to first page",
 							variant: "outline",
 							size: "icon",
-							className: "hidden size-8 lg:flex",
+							className: cn("size-8", alwaysShowFirstLast ? "flex" : "hidden lg:flex", hiddenClass),
 							onClick: () => table.setPageIndex(0),
 							disabled: !table.getCanPreviousPage(),
 							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronsLeft, {})
@@ -149,9 +240,9 @@ function DataTablePagination({ table, pageSizeOptions = [
 							"aria-label": "Go to last page",
 							variant: "outline",
 							size: "icon",
-							className: "hidden size-8 lg:flex",
+							className: cn("size-8", alwaysShowFirstLast ? "flex" : "hidden lg:flex", hiddenClass),
 							onClick: () => table.setPageIndex(table.getPageCount() - 1),
-							disabled: !table.getCanNextPage(),
+							disabled: !table.getCanNextPage() || alwaysShowFirstLast && !canJump,
 							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronsRight, {})
 						})
 					]
@@ -497,7 +588,7 @@ function formatDate(date, opts = {}, preset) {
 
 //#endregion
 //#region src/components/data-table/data-table.tsx
-function DataTable({ table, actionBar, children, className, classNames,...props }) {
+function DataTable({ table, actionBar, pagination, children, className, classNames,...props }) {
 	useDateFormatterVersion();
 	const columns = [
 		...table.getLeftVisibleLeafColumns(),
@@ -562,7 +653,10 @@ function DataTable({ table, actionBar, children, className, classNames,...props
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: "flex flex-col gap-2.5",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataTablePagination, { table }), actionBar && table.getFilteredSelectedRowModel().rows.length > 0 && actionBar]
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataTablePagination, {
+					table,
+					...pagination
+				}), actionBar && table.getFilteredSelectedRowModel().rows.length > 0 && actionBar]
 			})
 		]
 	});
@@ -1101,6 +1195,59 @@ function parseCalendarDate(value) {
 	const date = new Date(Number(value));
 	return Number.isNaN(date.getTime()) ? void 0 : date;
 }
+/** Resolve bounds and the calendar's today marker in the Host's configured time zone. */
+function calendarMaxDate(value) {
+	if (value !== "today") return parseCalendarDate(value);
+	return parseCalendarDate(calendarDay(/* @__PURE__ */ new Date(), calendarDayFormatter()));
+}
+function calendarDayFormatter() {
+	return new Intl.DateTimeFormat("en-CA", {
+		timeZone: getDateLocaleOptions()?.timeZone,
+		year: "numeric",
+		month: "2-digit",
+		day: "2-digit"
+	});
+}
+function calendarDay(date, formatter) {
+	const parts = Object.fromEntries(formatter.formatToParts(date).map((part) => [part.type, part.value]));
+	return `${parts.year}-${parts.month}-${parts.day}`;
+}
+/** Keep both the today marker and relative bounds current while a filter stays mounted. */
+function useCalendarToday() {
+	useDateFormatterVersion();
+	const timeZone = getDateLocaleOptions()?.timeZone;
+	const [today, setToday] = (0, react.useState)(() => calendarMaxDate("today"));
+	(0, react.useEffect)(() => {
+		const formatter = calendarDayFormatter();
+		let timer;
+		const refresh = () => {
+			clearTimeout(timer);
+			const now = Date.now();
+			const day = calendarDay(new Date(now), formatter);
+			setToday((previous) => serializeCalendarDate(previous) === day ? previous : parseCalendarDate(day));
+			let before = now;
+			let after = now + 2880 * 60 * 1e3;
+			while (after - before > 1) {
+				const middle = Math.floor((before + after) / 2);
+				if (calendarDay(new Date(middle), formatter) === day) before = middle;
+				else after = middle;
+			}
+			timer = setTimeout(refresh, Math.max(1, after - Date.now()));
+		};
+		const onVisibilityChange = () => {
+			if (!document.hidden) refresh();
+		};
+		refresh();
+		window.addEventListener("focus", refresh);
+		document.addEventListener("visibilitychange", onVisibilityChange);
+		return () => {
+			clearTimeout(timer);
+			window.removeEventListener("focus", refresh);
+			document.removeEventListener("visibilitychange", onVisibilityChange);
+		};
+	}, [timeZone]);
+	return today;
+}
 function calendarPresentation() {
 	const localeOptions = getDateLocaleOptions();
 	const locale = localeOptions?.locale ?? "en-US";
@@ -1322,7 +1469,7 @@ function DataTableFilterList({ table, debounceMs = DEBOUNCE_MS$2, throttleMs = T
 	});
 }
 function DataTableFilterItem$1({ filter, index: index$1, filterItemId, joinOperator, setJoinOperator, columns, onFilterUpdate, onFilterRemove }) {
-	useDateFormatterVersion();
+	const today = useCalendarToday();
 	const [showFieldSelector, setShowFieldSelector] = react.useState(false);
 	const [showOperatorSelector, setShowOperatorSelector] = react.useState(false);
 	const [showValueSelector, setShowValueSelector] = react.useState(false);
@@ -1451,6 +1598,7 @@ function DataTableFilterItem$1({ filter, index: index$1, filterItemId, joinOpera
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 					className: "min-w-36 max-w-60 flex-1",
 					children: onFilterInputRender$1({
+						today,
 						filter,
 						inputId,
 						column,
@@ -1481,7 +1629,9 @@ function DataTableFilterItem$1({ filter, index: index$1, filterItemId, joinOpera
 		})
 	});
 }
-function onFilterInputRender$1({ filter, inputId, column, columnMeta, onFilterUpdate, showValueSelector, setShowValueSelector }) {
+function onFilterInputRender$1({ today, filter, inputId, column, columnMeta, onFilterUpdate, showValueSelector, setShowValueSelector }) {
+	const maxDate = column.columnDef.meta?.maxDate;
+	const upperBound = maxDate === "today" ? today : calendarMaxDate(maxDate);
 	if (filter.operator === "isEmpty" || filter.operator === "isNotEmpty") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		id: inputId,
 		role: "status",
@@ -1637,6 +1787,8 @@ function onFilterInputRender$1({ filter, inputId, column, columnMeta, onFilterUp
 					align: "start",
 					className: "w-auto p-0",
 					children: filter.operator === "isBetween" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Calendar, {
+						today,
+						disabled: upperBound ? { after: upperBound } : void 0,
 						lang: calendarPresentation().locale,
 						weekStartsOn: calendarPresentation().weekStartsOn,
 						formatters: calendarPresentation().formatters,
@@ -1645,6 +1797,7 @@ function onFilterInputRender$1({ filter, inputId, column, columnMeta, onFilterUp
 						autoFocus: true,
 						captionLayout: "dropdown",
 						mode: "range",
+						excludeDisabled: !!column.columnDef.meta?.maxDate,
 						selected: dateValue.length === 2 ? {
 							from: parseCalendarDate(dateValue[0]),
 							to: parseCalendarDate(dateValue[1])
@@ -1656,6 +1809,8 @@ function onFilterInputRender$1({ filter, inputId, column, columnMeta, onFilterUp
 							onFilterUpdate(filter.filterId, { value: date ? [date.from ? serializeCalendarDate(date.from) : "", date.to ? serializeCalendarDate(date.to) : ""] : [] });
 						}
 					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Calendar, {
+						today,
+						disabled: upperBound ? { after: upperBound } : void 0,
 						lang: calendarPresentation().locale,
 						weekStartsOn: calendarPresentation().weekStartsOn,
 						formatters: calendarPresentation().formatters,
@@ -1878,7 +2033,7 @@ function DataTableFilterMenu({ table, debounceMs = DEBOUNCE_MS$1, throttleMs = T
 }
 function DataTableFilterItem({ filter, filterItemId, columns, onFilterUpdate, onFilterRemove }) {
 	{
-		useDateFormatterVersion();
+		const today = useCalendarToday();
 		const [showFieldSelector, setShowFieldSelector] = react.useState(false);
 		const [showOperatorSelector, setShowOperatorSelector] = react.useState(false);
 		const [showValueSelector, setShowValueSelector] = react.useState(false);
@@ -1969,6 +2124,7 @@ function DataTableFilterItem({ filter, filterItemId, columns, onFilterUpdate, on
 					})]
 				}),
 				onFilterInputRender({
+					today,
 					filter,
 					column,
 					inputId,
@@ -1989,7 +2145,9 @@ function DataTableFilterItem({ filter, filterItemId, columns, onFilterUpdate, on
 	}
 }
 function FilterValueSelector({ column, value, onSelect }) {
-	useDateFormatterVersion();
+	const today = useCalendarToday();
+	const maxDate = column.columnDef.meta?.maxDate;
+	const upperBound = maxDate === "today" ? today : calendarMaxDate(maxDate);
 	switch (column.columnDef.meta?.variant ?? "text") {
 		case "boolean": return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_shadcn.CommandGroup, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.CommandItem, {
 			value: "true",
@@ -2018,6 +2176,8 @@ function FilterValueSelector({ column, value, onSelect }) {
 		}, option.value)) });
 		case "date":
 		case "dateRange": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Calendar, {
+			today,
+			disabled: upperBound ? { after: upperBound } : void 0,
 			lang: calendarPresentation().locale,
 			weekStartsOn: calendarPresentation().weekStartsOn,
 			formatters: calendarPresentation().formatters,
@@ -2046,7 +2206,9 @@ function FilterValueSelector({ column, value, onSelect }) {
 		}
 	}
 }
-function onFilterInputRender({ filter, column, inputId, onFilterUpdate, showValueSelector, setShowValueSelector }) {
+function onFilterInputRender({ today, filter, column, inputId, onFilterUpdate, showValueSelector, setShowValueSelector }) {
+	const maxDate = column.columnDef.meta?.maxDate;
+	const upperBound = maxDate === "today" ? today : calendarMaxDate(maxDate);
 	if (filter.operator === "isEmpty" || filter.operator === "isNotEmpty") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		id: inputId,
 		role: "status",
@@ -2205,6 +2367,8 @@ function onFilterInputRender({ filter, column, inputId, onFilterUpdate, showValu
 					align: "start",
 					className: "w-auto p-0",
 					children: filter.operator === "isBetween" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Calendar, {
+						today,
+						disabled: upperBound ? { after: upperBound } : void 0,
 						lang: calendarPresentation().locale,
 						weekStartsOn: calendarPresentation().weekStartsOn,
 						formatters: calendarPresentation().formatters,
@@ -2212,6 +2376,7 @@ function onFilterInputRender({ filter, column, inputId, onFilterUpdate, showValu
 						autoFocus: true,
 						captionLayout: "dropdown",
 						mode: "range",
+						excludeDisabled: !!column.columnDef.meta?.maxDate,
 						selected: dateValue.length === 2 ? {
 							from: parseCalendarDate(dateValue[0]),
 							to: parseCalendarDate(dateValue[1])
@@ -2223,6 +2388,8 @@ function onFilterInputRender({ filter, column, inputId, onFilterUpdate, showValu
 							onFilterUpdate(filter.filterId, { value: date ? [date.from ? serializeCalendarDate(date.from) : "", date.to ? serializeCalendarDate(date.to) : ""] : [] });
 						}
 					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Calendar, {
+						today,
+						disabled: upperBound ? { after: upperBound } : void 0,
 						lang: calendarPresentation().locale,
 						weekStartsOn: calendarPresentation().weekStartsOn,
 						formatters: calendarPresentation().formatters,
@@ -2758,6 +2925,7 @@ function AutoTableSimpleFilters({ table, shallow = false, filters: externalFilte
 						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SimpleDateFilter, {
 							title: meta.label ?? column.id,
 							multiple: meta.variant === "dateRange",
+							maxDate: meta.maxDate,
 							value,
 							onChange: (v) => updateFilter(column.id, v)
 						})
@@ -2980,7 +3148,9 @@ function SimpleSliderFilter({ title, range, unit, value, onChange }) {
 		]
 	})] });
 }
-function SimpleDateFilter({ title, multiple, value, onChange }) {
+function SimpleDateFilter({ title, maxDate, multiple, value, onChange }) {
+	const today = useCalendarToday();
+	const upperBound = maxDate === "today" ? today : calendarMaxDate(maxDate);
 	const [open, setOpen] = react.useState(false);
 	const commit = (next) => {
 		setOpen(false);
@@ -3047,6 +3217,8 @@ function SimpleDateFilter({ title, multiple, value, onChange }) {
 			className: "w-auto p-0",
 			align: "start",
 			children: multiple ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Calendar, {
+				today,
+				disabled: upperBound ? { after: upperBound } : void 0,
 				lang: presentation.locale,
 				weekStartsOn: presentation.weekStartsOn,
 				formatters: presentation.formatters,
@@ -3055,6 +3227,7 @@ function SimpleDateFilter({ title, multiple, value, onChange }) {
 				autoFocus: true,
 				captionLayout: "dropdown",
 				mode: "range",
+				excludeDisabled: !!upperBound,
 				selected: localRange,
 				onSelect: (range) => {
 					if (!range?.from && !range?.to) {
@@ -3106,6 +3279,8 @@ function SimpleDateFilter({ title, multiple, value, onChange }) {
 					}
 				}
 			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Calendar, {
+				today,
+				disabled: upperBound ? { after: upperBound } : void 0,
 				lang: presentation.locale,
 				weekStartsOn: presentation.weekStartsOn,
 				formatters: presentation.formatters,
@@ -3684,7 +3859,7 @@ function generateCSVTemplate(headers) {
 function dataToCSV(data, opts = {}) {
 	if (data.length === 0) return "";
 	const allHeaders = Object.keys(data[0]);
-	const headers = (opts.headers ?? allHeaders).filter((h) => !opts.excludeColumns?.includes(h));
+	const headers = (opts.headers ?? allHeaders).filter((h) => h !== "__crudExtensionProjection" && !opts.excludeColumns?.includes(h));
 	return [headers.map((h) => escapeCSVField(h)).join(","), ...data.map((row) => headers.map((h) => escapeCSVField(String(row[h] ?? ""))).join(","))].join("\n");
 }
 function escapeCSVField(field) {
@@ -3773,7 +3948,7 @@ function downloadCSVTemplate(headers, filename = "template") {
 	}).join(",") + "\n", filename);
 }
 function downloadCSV(csvContent, filename) {
-	const blob = new Blob([csvContent], { type: "text/csv;charset=utf-8;" });
+	const blob = new Blob(["", csvContent], { type: "text/csv;charset=utf-8;" });
 	const url = URL.createObjectURL(blob);
 	const link = document.createElement("a");
 	link.setAttribute("href", url);
@@ -4248,7 +4423,7 @@ const filterModeConfig = {
 		tooltip: "Linear-style command filters"
 	}
 };
-function AutoTable({ schema, data, pageCount = 1, total, overrides, classNames, enableRowSelection = true, exclude, actions, pinnedColumns, filterMode, search = false, onDeleteSelected, onUpdateSelected, batchUpdateFields, actionBarExtra, actionBarActions, deleteConfirmation, initialSorting, enableExport = true, showDefaultExport = true, onSelectedCountChange, onSelectedRowsChange, getSelectedRows }) {
+function AutoTable({ schema, data, pageCount = 1, pagination, total, overrides, classNames, enableRowSelection = true, exclude, actions, pinnedColumns, filterMode, search = false, onDeleteSelected, onUpdateSelected, batchUpdateFields, actionBarExtra, actionBarActions, deleteConfirmation, initialSorting, enableExport = true, showDefaultExport = true, onSelectedCountChange, onSelectedRowsChange, getSelectedRows }) {
 	const modes = filterMode ? Array.isArray(filterMode) ? filterMode : [filterMode] : DEFAULT_MODES;
 	const [currentMode, setCurrentMode] = useQueryState("filterMode", parseAsStringEnum(modes).withDefault(modes[0] ?? "simple"));
 	const showToggle = modes.length > 1;
@@ -4411,6 +4586,7 @@ function AutoTable({ schema, data, pageCount = 1, total, overrides, classNames,
 				})]
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataTable, {
+				pagination,
 				table,
 				classNames
 			}),
@@ -4484,6 +4660,45 @@ function FormModal({ open, onOpenChange, title, description, children, variant =
 	});
 }
 
+//#endregion
+//#region src/components/auto-crud/date-only-picker.tsx
+const primitives = {
+	Button: __wordrhyme_ui.Button,
+	Calendar: __wordrhyme_ui.Calendar,
+	Popover: __wordrhyme_ui.Popover,
+	PopoverContent: __wordrhyme_ui.PopoverContent,
+	PopoverTrigger: __wordrhyme_ui.PopoverTrigger
+};
+function DatePicker({ dateInput,...props }) {
+	if (props.valueFormat !== void 0 && dateInput === "utc-projection") {
+		const value = props.value;
+		props = {
+			...props,
+			value: value instanceof Date ? Number.isNaN(value.getTime()) ? "" : parseCalendarDate(value.toISOString().slice(0, 10)) : typeof value === "string" && /^\d{4}-\d{2}-\d{2}T/.test(value) && !Number.isNaN(Date.parse(value)) ? parseCalendarDate(value.slice(0, 10)) : value
+		};
+	}
+	useDateFormatterVersion();
+	const presentation = calendarPresentation();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_formily_shadcn.DatePicker, {
+		primitives,
+		...props.valueFormat !== void 0 ? {
+			captionLayout: "dropdown-months",
+			formatters: presentation.formatters,
+			labels: presentation.labels,
+			weekStartsOn: presentation.weekStartsOn,
+			placeholder: props.valueFormat
+		} : {},
+		...props
+	});
+}
+/** @deprecated Use DatePicker with valueFormat="YYYY-MM-DD". */
+function DateOnlyPicker(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DatePicker, {
+		...props,
+		valueFormat: "YYYY-MM-DD"
+	});
+}
+
 //#endregion
 //#region src/lib/schema-bridge/zod-to-formily.ts
 const DEFAULT_FORM_MANAGED_FIELDS = [
@@ -4586,6 +4801,27 @@ function createEditFormSchema(schema, options) {
 	});
 }
 
+//#endregion
+//#region src/lib/crud-reference-projection.ts
+function isRecord$1(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+/** Read a label only while its ID still matches the field's current value. */
+function readCrudReferenceOption(row, field, value) {
+	if (!isRecord$1(row)) return void 0;
+	const { __crudExtensionProjection: projections } = row;
+	if (!isRecord$1(projections)) return void 0;
+	const projection = projections[field];
+	if (!isRecord$1(projection)) return void 0;
+	if (typeof value !== "string" && typeof value !== "number") return void 0;
+	if (typeof projection.refId !== "string" && typeof projection.refId !== "number") return;
+	if (String(value).length === 0 || String(projection.refId) !== String(value) || typeof projection.display !== "string" || projection.display.length === 0) return;
+	return {
+		value: String(value),
+		label: projection.display
+	};
+}
+
 //#endregion
 //#region src/lib/registries.ts
 function createRegistry(label) {
@@ -4625,6 +4861,7 @@ function createRegistry(label) {
 		}
 	};
 }
+const tablePagination = createRegistry("table pagination");
 const formComponents = createRegistry("form component");
 const components = formComponents;
 function normalizeDataSourceRegistration(registration) {
@@ -4763,6 +5000,14 @@ function AutoCrudMultiCombobox({ options = [], className,...props }) {
 	});
 }
 const defaultFieldComponents = {
+	DatePicker: {
+		component: DatePicker,
+		decorator: "FormItem"
+	},
+	DateOnlyPicker: {
+		component: DateOnlyPicker,
+		decorator: "FormItem"
+	},
 	Combobox: {
 		component: FormilyCombobox,
 		decorator: "FormItem"
@@ -4838,6 +5083,13 @@ function mergeDataSourceOptions(current, incoming) {
 	for (const option of incoming) optionsByValue.set(option.value, option);
 	return Array.from(optionsByValue.values());
 }
+function setAutoCrudDataSourceOptions(field, options) {
+	const projectedOption = readCrudReferenceOption(field.form.initialValues, field.path.toString(), field.value);
+	field.setDataSource(projectedOption ? mergeDataSourceOptions([{
+		...projectedOption,
+		disabled: true
+	}], options) : options);
+}
 function isNearPopupScrollBottom$1(target) {
 	return target.scrollHeight - target.scrollTop - target.clientHeight <= POPUP_SCROLL_LOAD_THRESHOLD$1;
 }
@@ -4853,6 +5105,7 @@ function loadAutoCrudDataSource({ entry, field, registryVersion, search, sourceK
 		values,
 		search: searchValue
 	});
+	setAutoCrudDataSourceOptions(field, state.options);
 	if (!append && state.loadKey === loadKey && state.registryVersion === registryVersion) return;
 	if (entry.reset && state.dependencyKey !== void 0 && state.dependencyKey !== dependencyKey) field.setValue(void 0);
 	state.dependencyKey = dependencyKey;
@@ -4895,7 +5148,7 @@ function loadAutoCrudDataSource({ entry, field, registryVersion, search, sourceK
 		state.page = page ?? 0;
 		state.hasMore = entry.loadMore ? normalizeHasMore(result) : false;
 		state.appendLoading = false;
-		field.setDataSource(nextOptions);
+		setAutoCrudDataSourceOptions(field, nextOptions);
 		field.setLoading(false);
 		field.setComponentProps({
 			loading: false,
@@ -4907,7 +5160,7 @@ function loadAutoCrudDataSource({ entry, field, registryVersion, search, sourceK
 		if (!append) {
 			state.options = [];
 			state.hasMore = false;
-			field.setDataSource([]);
+			setAutoCrudDataSourceOptions(field, []);
 		}
 		state.appendLoading = false;
 		field.setLoading(false);
@@ -4931,7 +5184,7 @@ function applySearchComponentProps({ entry, field, registryState, sourceKey, sta
 				const currentEntry = dataSources.get(sourceKey);
 				if (!currentEntry) {
 					state.controller?.abort();
-					field.setDataSource([]);
+					setAutoCrudDataSourceOptions(field, []);
 					field.setLoading(false);
 					field.setComponentProps({ loading: false });
 					return;
@@ -4961,7 +5214,7 @@ function applyLoadMoreComponentProps({ entry, field, registryState, sourceKey, s
 				state.controller?.abort();
 				state.hasMore = false;
 				state.appendLoading = false;
-				field.setDataSource([]);
+				setAutoCrudDataSourceOptions(field, []);
 				field.setLoading(false);
 				field.setComponentProps({
 					hasMore: false,
@@ -4994,14 +5247,14 @@ function createAutoCrudDataSourceReaction(config, registryState) {
 			state.initialized = true;
 		}
 		if (!source) {
-			field.setDataSource([]);
+			setAutoCrudDataSourceOptions(field, []);
 			field.setLoading(false);
 			return;
 		}
 		const entry = dataSources.get(source.key);
 		if (!entry) {
 			state.controller?.abort();
-			field.setDataSource([]);
+			setAutoCrudDataSourceOptions(field, []);
 			field.setLoading(false);
 			return;
 		}
@@ -5099,6 +5352,7 @@ const AutoForm = (0, react.forwardRef)(AutoFormInner);
 //#endregion
 //#region src/i18n/locale.ts
 const zhCN = {
+	pagination: { pageJump: "跳转到页" },
 	toolbar: {
 		refresh: "刷新",
 		create: "新建",
@@ -5166,6 +5420,7 @@ const zhCN = {
 	}
 };
 const enUS = {
+	pagination: { pageJump: "Go to page" },
 	toolbar: {
 		refresh: "Refresh",
 		create: "New",
@@ -5233,6 +5488,7 @@ const enUS = {
 	}
 };
 const jaJP = {
+	pagination: { pageJump: "ページへ移動" },
 	toolbar: {
 		refresh: "更新",
 		create: "新規作成",
@@ -5300,6 +5556,7 @@ const jaJP = {
 	}
 };
 const koKR = {
+	pagination: { pageJump: "페이지로 이동" },
 	toolbar: {
 		refresh: "새로고침",
 		create: "새로 만들기",
@@ -5367,6 +5624,7 @@ const koKR = {
 	}
 };
 const frFR = {
+	pagination: { pageJump: "Aller à la page" },
 	toolbar: {
 		refresh: "Actualiser",
 		create: "Nouveau",
@@ -5434,6 +5692,7 @@ const frFR = {
 	}
 };
 const deDE = {
+	pagination: { pageJump: "Zur Seite springen" },
 	toolbar: {
 		refresh: "Aktualisieren",
 		create: "Neu",
@@ -5501,6 +5760,7 @@ const deDE = {
 	}
 };
 const esES = {
+	pagination: { pageJump: "Ir a la página" },
 	toolbar: {
 		refresh: "Actualizar",
 		create: "Nuevo",
@@ -5737,7 +5997,11 @@ function ImportDialog({ open, onOpenChange, onImport, columns = [], title, local
 		open,
 		onOpenChange: handleOpenChange,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_shadcn.DialogContent, {
-			className: "w-[calc(100vw-2rem)] sm:max-w-5xl",
+			className: "max-h-[85vh] overflow-y-auto",
+			style: {
+				width: "calc(100vw - 4rem)",
+				maxWidth: "52rem"
+			},
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_shadcn.DialogHeader, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.DialogTitle, { children: title ?? locale.title }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_shadcn.DialogDescription, { children: [
 				step === "upload" && locale.uploadDescription,
 				step === "preview" && locale.previewDescription(parsedData?.rows.length ?? 0),
@@ -6686,12 +6950,26 @@ function useDynamicResolveOptions(fields, rows, hiddenColumns) {
 		rows,
 		sourceEntries
 	]);
-	return { optionsByField };
+	const displayOptionsByField = { ...optionsByField };
+	for (const field of Object.keys(fields ?? {}).filter((key) => !hiddenColumns.includes(key))) {
+		const projectedOptions = rows.flatMap((row) => {
+			const option = readCrudReferenceOption(row, field, row[field]);
+			return option ? [option] : [];
+		});
+		if (projectedOptions.length > 0) displayOptionsByField[field] = mergeFilterOptions(projectedOptions, optionsByField[field] ?? []);
+	}
+	return { optionsByField: displayOptionsByField };
 }
 function getOptionLabel(value, options) {
 	const stringValue = String(value);
 	return options?.find((option) => option.value === stringValue)?.label ?? stringValue;
 }
+function formatExportRow(row, fields, values = row) {
+	return Object.fromEntries(Object.entries(values).map(([key, value]) => [key, fields[key]?.format?.(value, {
+		row,
+		target: "export"
+	}) ?? value]));
+}
 /**
 * 从统一配置生成表格 overrides
 * 当 filter 配置存在时，合并到 meta 中（不影响列隐藏）
@@ -6788,10 +7066,16 @@ function buildTableOverrides(fields, legacyOverrides, dynamicFilterState, dynami
 				const options = tableConfig?.dataSource ? mergeFieldOptions(dynamicResolveOptions, presentationOptions) : presentationOptions ?? mergedSharedDynamicOptions;
 				result[key] = {
 					...result[key],
-					cell: ({ row }) => renderFieldValue(row.getValue(key), "string", {
-						true: "true",
-						false: "false"
-					}, options, display ?? "auto")
+					cell: ({ row, getValue }) => {
+						const value = getValue();
+						return config.format?.(value, {
+							row: row.original,
+							target: "display"
+						}) ?? renderFieldValue(value, "string", {
+							true: "true",
+							false: "false"
+						}, options, display ?? "auto");
+					}
 				};
 			}
 		}
@@ -7008,7 +7292,13 @@ function ViewModalContent({ open, onOpenChange, variant, data, schema, fields: f
 					overrides[key] = {
 						label: tableConfig?.label ?? config.label ?? listOverride?.label ?? humanize(key),
 						index: tableConfig?.index ?? listOverride?.index,
-						cell: ({ getValue }) => renderFieldValue(getValue(), parseZodField(fieldSchema).type, locale.boolean, options, tableConfig?.display ?? "auto", Infinity),
+						cell: ({ getValue, row }) => {
+							const value = getValue();
+							return config.format?.(value, {
+								row: row.original,
+								target: "display"
+							}) ?? renderFieldValue(value, parseZodField(fieldSchema).type, locale.boolean, options, tableConfig?.display ?? "auto", Infinity);
+						},
 						...view?.presentation === "table" ? listOverride : void 0,
 						hidden: false,
 						...view?.overrides?.[key]
@@ -7040,18 +7330,18 @@ function ViewModalContent({ open, onOpenChange, variant, data, schema, fields: f
 			})]
 		}, cell.id))
 	});
-	if (variant === "sheet") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Sheet, {
+	if (variant === "sheet") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.Sheet, {
 		open,
 		onOpenChange,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_shadcn.SheetContent, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.SheetHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.SheetTitle, { children: locale.viewModal.title }) }), content] })
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_ui.SheetContent, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.SheetHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.SheetTitle, { children: locale.viewModal.title }) }), content] })
 	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Dialog, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.Dialog, {
 		open,
 		onOpenChange,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_shadcn.DialogContent, {
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_ui.DialogContent, {
 			"aria-describedby": void 0,
 			className: "max-w-2xl max-h-[80vh] overflow-y-auto",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.DialogHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.DialogTitle, { children: locale.viewModal.title }) }), content]
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.DialogHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.DialogTitle, { children: locale.viewModal.title }) }), content]
 		})
 	});
 }
@@ -7115,6 +7405,9 @@ function resolveActions(actions, defaults, rowActionsLocale, context) {
 */
 function AutoCrudTable({ id, title, description, schema, resource, fields, table: tableConfig, form: formConfig, view: viewConfig, permissions, actions: actionItems, toolbar, toolbarActions, locale: localeProp, onCreate }) {
 	const locale = resolveLocale(localeProp);
+	const getPagination = react.useCallback(() => id ? tablePagination.get(id) : void 0, [id]);
+	const registeredPagination = react.useSyncExternalStore(tablePagination.subscribe, getPagination, getPagination);
+	const pagination = tableConfig?.pagination ?? registeredPagination;
 	const resolvedSchema = resource.schema ?? schema;
 	const resolvedFields = react.useMemo(() => applyResourceTablePresentation(mergeFields(resource.fields, fields), resource.fields) ?? {}, [fields, resource.fields]);
 	const can = {
@@ -7187,13 +7480,13 @@ function AutoCrudTable({ id, title, description, schema, resource, fields, table
 		if (mode === "selected") {
 			const selectedRows$1 = getSelectedRowsRef.current?.();
 			if (!selectedRows$1 || selectedRows$1.length === 0) return;
-			exportAllToCSV(selectedRows$1, {
+			exportAllToCSV(selectedRows$1.map((row) => formatExportRow(row, resolvedFields)), {
 				filename,
 				excludeColumns
 			});
 		} else {
 			if (!resource.handlers.export) return;
-			exportAllToCSV(await resource.handlers.export(), {
+			exportAllToCSV((await resource.handlers.export()).map((row) => formatExportRow(row, resolvedFields)), {
 				filename,
 				excludeColumns
 			});
@@ -7201,7 +7494,8 @@ function AutoCrudTable({ id, title, description, schema, resource, fields, table
 	}, [
 		resource.handlers.export,
 		title,
-		denyFields
+		denyFields,
+		resolvedFields
 	]);
 	const handleExportClick = react.useCallback(async () => {
 		const mode = selectedCount > 0 ? "selected" : "filtered";
@@ -7212,6 +7506,26 @@ function AutoCrudTable({ id, title, description, schema, resource, fields, table
 			setExporting(false);
 		}
 	}, [selectedCount, handleExport]);
+	const exportBatchActions = react.useMemo(() => {
+		if (!Object.values(resolvedFields).some((field) => field.format)) return registryBatchActions;
+		return registryBatchActions.map((action$1) => {
+			if (action$1.type !== "export" || action$1.onClick !== void 0 || Boolean(action$1.component)) return action$1;
+			return {
+				...action$1,
+				onClick: (_rows, { table }) => {
+					const headers = table.getAllLeafColumns().map((column) => column.id).filter((key) => key !== "select" && key !== "actions" && !denyFields?.includes(key));
+					exportAllToCSV(table.getFilteredSelectedRowModel().rows.map((row) => formatExportRow(row.original, resolvedFields, Object.fromEntries(headers.map((key) => [key, row.getValue(key)])))), {
+						filename: "table",
+						headers
+					});
+				}
+			};
+		});
+	}, [
+		registryBatchActions,
+		resolvedFields,
+		denyFields
+	]);
 	const toolbarRefresh = react.useMemo(() => {
 		const refresh = ownerRefreshAction?.onClick ?? resource.handlers.refresh;
 		if (!refresh) return void 0;
@@ -7265,7 +7579,30 @@ function AutoCrudTable({ id, title, description, schema, resource, fields, table
 		toolbarOpenCreate
 	]);
 	const resolvedToolbarActions = resolveToolbarActionsWithResolver(id, registryToolbarActions, toolbarContext);
-	const tableOverrides = react.useMemo(() => mergeTableOverrides(buildTableOverrides(resolvedFields, tableConfig?.overrides, dynamicFilterOptions, dynamicResolveOptions), buildCapabilityTableOverrides(resolvedSchema, resource.capabilities)), [
+	const { tableOverrides, detailTableOverrides } = react.useMemo(() => {
+		const presentationOverrides = mergeTableOverrides(buildTableOverrides(resolvedFields, tableConfig?.overrides, dynamicFilterOptions, dynamicResolveOptions), buildCapabilityTableOverrides(resolvedSchema, resource.capabilities));
+		const formattedOverrides = { ...presentationOverrides };
+		for (const [key, config] of Object.entries(resolvedFields)) {
+			const override = formattedOverrides[key];
+			if (config.format && override?.cell === void 0 && resolvedSchema.shape[key]) {
+				const { type } = parseZodField(resolvedSchema.shape[key]);
+				formattedOverrides[key] = {
+					...override,
+					cell: (context) => {
+						const value = context.getValue();
+						return config.format?.(value, {
+							row: context.row.original,
+							target: "display"
+						}) ?? renderCell(value, type, context.column.columnDef.meta?.options);
+					}
+				};
+			}
+		}
+		return {
+			tableOverrides: formattedOverrides,
+			detailTableOverrides: presentationOverrides
+		};
+	}, [
 		resolvedFields,
 		tableConfig?.overrides,
 		dynamicFilterOptions,
@@ -7431,6 +7768,10 @@ function AutoCrudTable({ id, title, description, schema, resource, fields, table
 				data: resource.tableData.data,
 				schema: resolvedSchema,
 				pageCount: resource.tableData.pageCount,
+				pagination: pagination ? {
+					pageJumpLabel: locale.pagination?.pageJump,
+					...pagination
+				} : void 0,
 				...resource.tableData.total !== void 0 ? { total: resource.tableData.total } : {},
 				overrides: tableOverrides,
 				classNames: tableConfig?.classNames,
@@ -7441,7 +7782,7 @@ function AutoCrudTable({ id, title, description, schema, resource, fields, table
 				onDeleteSelected: can.delete ? resource.handlers.deleteMany : void 0,
 				onUpdateSelected: can.update ? resource.handlers.updateMany : void 0,
 				batchUpdateFields: can.update ? batchFields : void 0,
-				actionBarActions: registryBatchActions,
+				actionBarActions: exportBatchActions,
 				deleteConfirmation: locale.bulkDeleteModal,
 				enableExport: canExport,
 				showDefaultExport: false,
@@ -7478,13 +7819,13 @@ function AutoCrudTable({ id, title, description, schema, resource, fields, table
 				dynamicOptions: dynamicFilterOptions.labelOptionsByField,
 				denyFields,
 				locale,
-				tableOverrides,
+				tableOverrides: detailTableOverrides,
 				view: viewConfig
 			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.AlertDialog, {
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.AlertDialog, {
 				open: resource.modal.deleteOpen,
 				onOpenChange: (open) => !open && resource.handlers.closeModals(),
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_shadcn.AlertDialogContent, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_shadcn.AlertDialogHeader, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.AlertDialogTitle, { children: locale.deleteModal.title }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.AlertDialogDescription, { children: locale.deleteModal.description })] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_shadcn.AlertDialogFooter, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.AlertDialogCancel, { children: locale.deleteModal.cancel }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.AlertDialogAction, {
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_ui.AlertDialogContent, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_ui.AlertDialogHeader, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.AlertDialogTitle, { children: locale.deleteModal.title }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.AlertDialogDescription, { children: locale.deleteModal.description })] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__wordrhyme_ui.AlertDialogFooter, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.AlertDialogCancel, { children: locale.deleteModal.cancel }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_ui.AlertDialogAction, {
 					onClick: resource.handlers.confirmDelete,
 					disabled: resource.mutations.isDeleting,
 					children: resource.mutations.isDeleting ? locale.deleteModal.confirming : locale.deleteModal.confirm
@@ -7687,6 +8028,9 @@ function parseColumnFilterValue(value) {
 	return [];
 }
 function DataTableDateFilter({ column, title, multiple }) {
+	const today = useCalendarToday();
+	const maxDate = column.columnDef.meta?.maxDate;
+	const upperBound = maxDate === "today" ? today : calendarMaxDate(maxDate);
 	const formatterVersion = useDateFormatterVersion();
 	const presentation = react.useMemo(() => calendarPresentation(), [formatterVersion]);
 	const { formatDate: formatDate$1 } = presentation;
@@ -7840,6 +8184,8 @@ function DataTableDateFilter({ column, title, multiple }) {
 		className: "w-auto p-0",
 		align: "start",
 		children: multiple ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Calendar, {
+			today,
+			disabled: upperBound ? { after: upperBound } : void 0,
 			lang: presentation.locale,
 			weekStartsOn: presentation.weekStartsOn,
 			formatters: presentation.formatters,
@@ -7847,10 +8193,13 @@ function DataTableDateFilter({ column, title, multiple }) {
 			autoFocus: true,
 			captionLayout: "dropdown",
 			mode: "range",
+			excludeDisabled: !!upperBound,
 			defaultMonth: localRange.from,
 			selected: localRange,
 			onSelect
 		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__wordrhyme_shadcn.Calendar, {
+			today,
+			disabled: upperBound ? { after: upperBound } : void 0,
 			lang: presentation.locale,
 			weekStartsOn: presentation.weekStartsOn,
 			formatters: presentation.formatters,
@@ -8968,6 +9317,7 @@ exports.resolveLocale = resolveLocale;
 exports.setDateFormatter = setDateFormatter;
 exports.setSearchParams = setSearchParams;
 exports.setToolbarResolver = setToolbarResolver;
+exports.tablePagination = tablePagination;
 exports.useAutoCrudResource = useAutoCrudResource;
 exports.useDataTable = useDataTable;
 exports.useQueryState = useQueryState;