@panneau/lists 5.0.0-alpha.2 → 5.0.0-alpha.21

package/dist/ListView.js

@@ -2,23 +2,32 @@ import { getActionHref, groupListActions, hasScope, isAllowedOn } from "./action
 import { messages } from "./messages.js";
 import { ConfirmDialog, needsConfirmation } from "./actions/ConfirmDialog.js";
 import { getColumnValue, toText } from "./values.js";
-import { builtInDisplays } from "./displays/displays.js";
+import { getImageUrl } from "./images.js";
+import { getCalendarTimeZone } from "./layouts/calendarDays.js";
 import { cx } from "./cx.js";
 import { builtInLayouts } from "./layouts/builtIn.js";
+import { useRenderValue } from "./useRenderValue.js";
+import { ListSkeleton } from "./ListSkeleton.js";
 import ListView_module_default from "./ListView.module.js";
 import { ActionButton } from "./actions/ActionButton.js";
-import { RowActions } from "./actions/RowActions.js";
+import { RowActions, orderRowActions } from "./actions/RowActions.js";
+import { getShownColumns } from "./columns.js";
 import { FilterChips, FilterControls, useFilterLabels } from "./filters/Filters.js";
+import { InlineCell } from "./inline/InlineCell.js";
+import { getInlineField } from "./inline/editable.js";
 import { countSelected, getPageSelection, isItemSelected } from "./selection.js";
+import { ColumnMenu } from "./toolbar/ColumnMenu.js";
 import { LayoutSwitch } from "./toolbar/LayoutSwitch.js";
-import { Pagination } from "./toolbar/Pagination.js";
+import { CursorPagination, Pagination } from "./toolbar/Pagination.js";
 import { SearchField } from "./toolbar/SearchField.js";
 import { SortSelect } from "./toolbar/SortSelect.js";
 import { useListState } from "./useListState.js";
-import { usePlugins } from "@panneau/core";
-import { Alert, Button, Checkbox, Spinner, usePanneauIntl, useToast } from "@panneau/ui";
+import { asksConfirmation, currentMonth, formatRuleFailure, selectItemActions, usePlugins } from "@panneau/core";
+import { c } from "react/compiler-runtime";
+import { getActionLabel } from "@panneau/intl";
+import { Alert, Button, Checkbox, usePanneauIntl, useToast } from "@panneau/ui";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useState } from "react";
+import { useRef, useState } from "react";
 //#region src/ListView.tsx
 function keyOf(action, item) {
 	return item !== void 0 ? `${action.id}\u0000${item.id}` : action.id;
@@ -28,296 +37,685 @@ function keyOf(action, item) {
 * cards), with sorting, search, filters and their chips, pagination, selection and actions. It
 * fetches nothing: the caller gives the items of the list's query and their total.
 */
-function ListView({ list, items, columns, total, isLoading = false, error = null, onRetry, filters = [], fields = [], search = false, layouts: layoutsProp = ["table"], layout: controlledLayout, onLayoutChange, perPageOptions, selectable: selectableProp, actions: actionsProp, onAction, actionIcons, itemTitle, getItemLabel: getItemLabelProp, getItemHref, displays, layoutComponents, filterControls, toolbar, emptyMessage, "aria-label": ariaLabel, className }) {
+function ListView(t0) {
+	const $ = c(116);
+	const { list, items, columns: allColumns, columnChoice: t1, total, cursors, isLoading: t2, error: t3, onRetry, filters: t4, fields: t5, search: t6, layouts: t7, layout: controlledLayout, onLayoutChange, perPageOptions, selectable: selectableProp, actions: actionsProp, onAction, previewAction, actionIcons, itemTitle, itemImage, calendar: t8, primaryAction: primaryActionProp, getItemLabel: getItemLabelProp, getItemHref, getLinkHref, currentItemId: t9, displays, layoutComponents, filterControls, inlineEdit: t10, onInlineEdit, formatError: t11, toolbar, emptyMessage, "aria-label": ariaLabel, className } = t0;
+	const columnChoice = t1 === void 0 ? true : t1;
+	const isLoading = t2 === void 0 ? false : t2;
+	const error = t3 === void 0 ? null : t3;
+	let t12;
+	if ($[0] !== t4) {
+		t12 = t4 === void 0 ? [] : t4;
+		$[0] = t4;
+		$[1] = t12;
+	} else t12 = $[1];
+	const filtersProp = t12;
+	const fields = t5 === void 0 ? [] : t5;
+	const search = t6 === void 0 ? false : t6;
+	const layoutsProp = t7 === void 0 ? ["table"] : t7;
+	const calendar = t8 === void 0 ? null : t8;
+	const currentItemId = t9 === void 0 ? null : t9;
+	const inlineEdit = t10 === void 0 ? [] : t10;
+	const formatError = t11 === void 0 ? formatRuleFailure : t11;
 	const intl = usePanneauIntl();
 	const toasts = useToast();
 	const plugins = usePlugins();
-	const { query, selection } = useListState(list);
+	const { query, view, selection } = useListState(list);
 	const filterLabels = useFilterLabels();
-	const [uncontrolledLayout, setLayout] = useState(null);
 	const [confirming, setConfirming] = useState(null);
+	const [preview, setPreview] = useState(null);
+	const confirmation = useRef(0);
 	const [pending, setPending] = useState(null);
-	const label = ariaLabel ?? intl.formatMessage(messages.list);
-	const pageItems = items ?? [];
+	let t13;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t13 = {};
+		$[2] = t13;
+	} else t13 = $[2];
+	const [saved, setSaved] = useState(t13);
+	let t14;
+	if ($[3] !== items) {
+		t14 = (item) => {
+			const base = items?.find((candidate) => candidate.id === item.id);
+			if (base !== void 0) setSaved((current) => ({
+				...current,
+				[item.id]: {
+					base,
+					item
+				}
+			}));
+		};
+		$[3] = items;
+		$[4] = t14;
+	} else t14 = $[4];
+	const showItem = t14;
+	let t15;
+	if ($[5] !== ariaLabel || $[6] !== intl) {
+		t15 = ariaLabel ?? intl.formatMessage(messages.list);
+		$[5] = ariaLabel;
+		$[6] = intl;
+		$[7] = t15;
+	} else t15 = $[7];
+	const label = t15;
+	let t16;
+	if ($[8] !== saved) {
+		t16 = (item_0) => saved[item_0.id]?.base === item_0 ? saved[item_0.id]?.item ?? item_0 : item_0;
+		$[8] = saved;
+		$[9] = t16;
+	} else t16 = $[9];
+	const pageItems = (items ?? []).map(t16);
 	const count = total ?? pageItems.length;
-	const sort = query.sort ?? [];
-	const filterValues = query.filter ?? {};
-	const hasQuery = Object.keys(filterValues).length > 0 || (query.q ?? "") !== "";
-	const allDisplays = {
-		...builtInDisplays,
-		...Object.fromEntries(plugins.displays),
-		...displays
-	};
-	const allLayouts = {
-		...builtInLayouts,
-		...Object.fromEntries(plugins.listLayouts),
-		...layoutComponents
-	};
-	const available = layoutsProp.filter((id) => allLayouts[id] !== void 0);
+	let t17;
+	if ($[10] !== query.sort) {
+		t17 = query.sort ?? [];
+		$[10] = query.sort;
+		$[11] = t17;
+	} else t17 = $[11];
+	const sort = t17;
+	let t18;
+	if ($[12] !== plugins.listLayouts) {
+		t18 = Object.fromEntries(plugins.listLayouts);
+		$[12] = plugins.listLayouts;
+		$[13] = t18;
+	} else t18 = $[13];
+	const t19 = t18;
+	let t20;
+	if ($[14] !== layoutComponents || $[15] !== t19) {
+		t20 = {
+			...builtInLayouts,
+			...t19,
+			...layoutComponents
+		};
+		$[14] = layoutComponents;
+		$[15] = t19;
+		$[16] = t20;
+	} else t20 = $[16];
+	const allLayouts = t20;
+	let t21;
+	if ($[17] !== allLayouts || $[18] !== calendar || $[19] !== itemImage) {
+		t21 = (id) => allLayouts[id] !== void 0 && (id !== "gallery" || itemImage !== void 0) && (id !== "calendar" || calendar !== null);
+		$[17] = allLayouts;
+		$[18] = calendar;
+		$[19] = itemImage;
+		$[20] = t21;
+	} else t21 = $[20];
+	const available = layoutsProp.filter(t21);
 	const layouts = available.length > 0 ? available : ["table"];
-	const layout = controlledLayout ?? uncontrolledLayout ?? layouts[0] ?? "table";
+	const chosenLayout = view.layout !== void 0 && layouts.includes(view.layout) ? view.layout : void 0;
+	const layout = controlledLayout ?? chosenLayout ?? layouts[0] ?? "table";
+	const columns = getShownColumns(allColumns, view.columns);
 	const Layout = allLayouts[layout] ?? builtInLayouts.table;
+	const inCalendar = layout === "calendar" && calendar !== null;
+	let t22;
+	if ($[21] !== calendar || $[22] !== filtersProp || $[23] !== inCalendar) {
+		t22 = inCalendar ? filtersProp.filter((filter) => filter.id !== calendar.filter) : filtersProp;
+		$[21] = calendar;
+		$[22] = filtersProp;
+		$[23] = inCalendar;
+		$[24] = t22;
+	} else t22 = $[24];
+	const filters = t22;
+	let t23;
+	if ($[25] !== calendar || $[26] !== inCalendar || $[27] !== query.filter) {
+		t23 = Object.fromEntries(Object.entries(query.filter ?? {}).filter((t24) => {
+			const [id_0] = t24;
+			return !(inCalendar && id_0 === calendar.filter);
+		}));
+		$[25] = calendar;
+		$[26] = inCalendar;
+		$[27] = query.filter;
+		$[28] = t23;
+	} else t23 = $[28];
+	const filterValues = t23;
+	let t24;
+	if ($[29] !== filterValues || $[30] !== query.q) {
+		t24 = Object.keys(filterValues).length > 0 || (query.q ?? "") !== "";
+		$[29] = filterValues;
+		$[30] = query.q;
+		$[31] = t24;
+	} else t24 = $[31];
+	const hasQuery = t24;
 	const grouped = groupListActions(actionsProp);
-	const rowActions = grouped.row.filter((action) => hasScope(action, "item"));
-	const rowMenu = grouped.menu.filter((action_0) => hasScope(action_0, "item"));
-	const toolbarActions = [...grouped.toolbar, ...grouped.menu].filter((action_1, index, all) => (hasScope(action_1, "selection") || hasScope(action_1, "resource")) && all.findIndex((candidate) => candidate.id === action_1.id) === index);
-	const selectionActions = toolbarActions.filter((action_2) => hasScope(action_2, "selection"));
-	const resourceActions = toolbarActions.filter((action_3) => hasScope(action_3, "resource"));
+	const toolbarActions = [...grouped.toolbar, ...grouped.menu].filter(_temp);
+	const selectionActions = toolbarActions.filter(_temp2);
+	const resourceActions = toolbarActions.filter(_temp3);
 	const selectable = selectableProp ?? selectionActions.length > 0;
 	const selectedCount = selectable ? countSelected(selection, count) : 0;
-	const selectedItems = pageItems.filter((item) => isItemSelected(selection, item.id));
+	let t25;
+	if ($[32] !== selection) {
+		t25 = (item_1) => isItemSelected(selection, item_1.id);
+		$[32] = selection;
+		$[33] = t25;
+	} else t25 = $[33];
+	const selectedItems = pageItems.filter(t25);
 	const pageSelection = getPageSelection(selection, pageItems);
-	const getItemLabel = (item_0) => {
-		if (getItemLabelProp !== void 0) return getItemLabelProp(item_0);
-		const titleColumn = columns.find((column) => column.id === itemTitle) ?? (itemTitle === void 0 ? columns[0] : void 0);
-		const title = titleColumn !== void 0 ? toText(getColumnValue(item_0, titleColumn, intl.locale), intl.locale) : itemTitle !== void 0 ? toText(item_0[itemTitle], intl.locale) : "";
-		return title !== "" ? title : item_0.id;
+	const getItemLabel = (item_2) => {
+		if (getItemLabelProp !== void 0) return getItemLabelProp(item_2);
+		const titleColumn = allColumns.find((column) => column.id === itemTitle) ?? (itemTitle === void 0 ? columns[0] : void 0);
+		const title = titleColumn !== void 0 ? toText(getColumnValue(item_2, titleColumn, intl.locale), intl.locale) : itemTitle !== void 0 ? toText(item_2[itemTitle], intl.locale) : "";
+		return title !== "" ? title : item_2.id;
 	};
-	const renderValue = (item_1, column_0) => {
-		if (column_0.render !== void 0) return column_0.render(item_1);
-		const Display = (column_0.display !== void 0 && column_0.display !== null ? allDisplays[column_0.display] : void 0) ?? builtInDisplays.text;
-		if (Display === void 0) return null;
-		return /* @__PURE__ */ jsx(Display, {
-			value: getColumnValue(item_1, column_0, intl.locale),
-			item: item_1,
-			column: column_0,
-			field: column_0.field ?? null
-		});
+	const renderValue = useRenderValue(displays);
+	const renderCell = (item_3, column_0, content) => {
+		const field = onInlineEdit !== void 0 ? getInlineField(column_0, item_3, inlineEdit) : null;
+		if (field === null || onInlineEdit === void 0) return content;
+		return /* @__PURE__ */ jsx(InlineCell, {
+			item: item_3,
+			field,
+			itemLabel: getItemLabel(item_3),
+			getItemLabel,
+			renderValue: (current_0) => renderValue(current_0, column_0),
+			onSave: (base_0, value) => onInlineEdit({
+				item: base_0,
+				field,
+				value
+			}),
+			onItem: showItem,
+			formatError: (failure) => formatError(failure, field.name),
+			children: content
+		}, `${item_3.id}\u0000${column_0.id}`);
 	};
-	const execute = async (event) => {
+	const closeConfirmation = () => {
+		confirmation.current = confirmation.current + 1;
 		setConfirming(null);
+		setPreview(null);
+	};
+	const execute = async (event) => {
+		closeConfirmation();
 		setPending(keyOf(event.action, event.item));
-		try {
-			const outcome = await onAction?.(event);
+		await Promise.resolve().then(() => onAction?.(event)).then((outcome) => {
 			if (event.scope === "selection" && outcome !== false) list.clearSelection();
-		} catch (caught) {
+		}).catch((caught) => {
 			toasts.show({
-				title: intl.formatMessage(messages.actionFailed, { action: event.action.label }),
+				title: intl.formatMessage(messages.actionFailed, { action: getActionLabel(event.action, intl) }),
 				...caught instanceof Error && caught.message !== "" ? { description: caught.message } : {},
 				tone: "danger"
 			});
-		} finally {
-			setPending(null);
-		}
+		});
+		setPending(null);
 	};
 	const run = (event_0) => {
+		const { action: action_2, selection: selection_0 } = event_0;
+		if (previewAction !== void 0 && action_2.dryRun === true && selection_0 !== void 0 && "query" in selection_0) {
+			const current_1 = confirmation.current = confirmation.current + 1;
+			const asks = action_2.confirm !== void 0 && action_2.confirm !== false;
+			setConfirming(event_0);
+			setPreview({ status: "loading" });
+			previewAction(event_0).then((result) => {
+				if (confirmation.current !== current_1) return;
+				const skipped = result?.skipped ?? event_0.skipped.length;
+				if (skipped === 0 && !asks && !asksConfirmation(action_2, Math.max(0, event_0.count - skipped))) execute(event_0);
+				else setPreview(result !== null ? {
+					status: "done",
+					...result
+				} : null);
+			}, () => {
+				if (confirmation.current !== current_1) return;
+				if (needsConfirmation(event_0)) setPreview(null);
+				else execute(event_0);
+			});
+			return;
+		}
 		if (needsConfirmation(event_0)) setConfirming(event_0);
 		else execute(event_0);
 	};
-	const runOnItem = (action_4, item_2) => run({
-		action: action_4,
+	const runOnItem = (action_3, item_4) => run({
+		action: action_3,
 		scope: "item",
-		item: item_2,
+		item: item_4,
 		count: 1,
 		skipped: []
 	});
-	const runOnSelection = (action_5) => {
+	const runOnSelection = (action_4) => {
 		const selected = list.getSelection();
 		if (selected === null) return;
 		run({
-			action: action_5,
+			action: action_4,
 			scope: "selection",
 			selection: selected,
 			count: selectedCount,
-			skipped: selectedItems.filter((item_3) => !isAllowedOn(action_5, item_3))
+			skipped: selectedItems.filter((item_5) => !isAllowedOn(action_4, item_5))
 		});
 	};
-	const runOnResource = (action_6) => run({
-		action: action_6,
+	const runOnResource = (action_5) => run({
+		action: action_5,
 		scope: "resource",
 		count,
 		skipped: []
 	});
-	const renderActions = (item_4) => {
-		const allowed = rowActions.filter((action_7) => isAllowedOn(action_7, item_4));
-		const menu = rowMenu.filter((action_8) => isAllowedOn(action_8, item_4));
+	const pageActions = pageItems.map((item_6) => [...selectItemActions(grouped.row, item_6, "row", { getLinkHref }), ...selectItemActions(grouped.menu, item_6, "menu", { getLinkHref })]);
+	const firstOf = (action_6) => pageActions.flat().find((entry) => entry.action.id === action_6.id) ?? [];
+	const slots = orderRowActions(grouped.row.flatMap(firstOf), grouped.menu.flatMap(firstOf));
+	const primaryAction = primaryActionProp !== void 0 ? primaryActionProp : ["show", "edit"].find((id_1) => slots.some((slot) => slot.action.id === id_1)) ?? null;
+	const renderActions = (item_7) => {
+		const allowed = selectItemActions(grouped.row, item_7, "row", { getLinkHref });
+		const menu = selectItemActions(grouped.menu, item_7, "menu", { getLinkHref });
 		if (allowed.length === 0 && menu.length === 0) return null;
-		const running = pending?.endsWith(`\u0000${item_4.id}`) === true ? pending.split("\0")[0] : null;
+		const running = pending?.endsWith(`\u0000${item_7.id}`) === true ? pending.split("\0")[0] : null;
 		return /* @__PURE__ */ jsx(RowActions, {
-			item: item_4,
-			itemLabel: getItemLabel(item_4),
+			itemLabel: getItemLabel(item_7),
 			actions: allowed,
 			menu,
 			pending: running ?? null,
-			onRun: (action_9) => runOnItem(action_9, item_4),
-			icons: actionIcons
+			onRun: (action_7) => runOnItem(action_7, item_7),
+			icons: actionIcons,
+			slots,
+			primary: primaryAction
 		});
 	};
+	let t26;
+	if ($[34] !== intl) {
+		t26 = intl.formatMessage(messages.selectPage);
+		$[34] = intl;
+		$[35] = t26;
+	} else t26 = $[35];
 	const pageCheckbox = /* @__PURE__ */ jsx(Checkbox, {
-		"aria-label": intl.formatMessage(messages.selectPage),
+		"aria-label": t26,
 		isSelected: pageSelection === "all",
 		isIndeterminate: pageSelection === "some",
 		isDisabled: pageItems.length === 0,
 		onChange: () => {
-			const ids = pageItems.map((item_5) => item_5.id);
+			const ids = pageItems.map(_temp4);
 			if (pageSelection === "all") list.deselect(ids);
 			else list.select(ids);
 		}
 	});
-	const sortable = columns.some((column_1) => column_1.sortable === true);
-	const showToolbar = search || filters.length > 0 || sortable || layouts.length > 1 || resourceActions.length > 0 || toolbar !== void 0;
-	const body = (() => {
-		if (error !== null) return /* @__PURE__ */ jsx(Alert, {
-			tone: "danger",
-			title: intl.formatMessage(messages.loadFailed),
-			actions: onRetry !== void 0 ? /* @__PURE__ */ jsx(Button, {
-				size: "sm",
-				onPress: onRetry,
-				children: intl.formatMessage(messages.retry)
-			}) : void 0,
-			children: error.message
-		});
-		if (items === void 0) return /* @__PURE__ */ jsx("div", {
-			className: ListView_module_default.state,
-			children: /* @__PURE__ */ jsx(Spinner, { showLabel: true })
-		});
-		if (pageItems.length === 0) return /* @__PURE__ */ jsxs("div", {
-			className: ListView_module_default.state,
-			children: [/* @__PURE__ */ jsx("p", { children: hasQuery ? intl.formatMessage(messages.noResults) : emptyMessage ?? intl.formatMessage(messages.empty) }), hasQuery ? /* @__PURE__ */ jsx(Button, {
-				size: "sm",
-				onPress: () => clearFilters(),
-				children: intl.formatMessage(messages.clearFilters)
-			}) : null]
-		});
-		return /* @__PURE__ */ jsx(Layout, {
+	const sortable = allColumns.some(_temp5);
+	const choosesColumns = columnChoice && allColumns.length > 1;
+	const showToolbar = search || filters.length > 0 || sortable || choosesColumns || layouts.length > 1 || resourceActions.length > 0 || toolbar !== void 0;
+	let t27;
+	if ($[36] !== filterValues || $[37] !== list || $[38] !== query.q) {
+		t27 = function clearFilters() {
+			Object.keys(filterValues).forEach((id_2) => list.setFilter(id_2, void 0));
+			if ((query.q ?? "") !== "") list.setSearch("");
+		};
+		$[36] = filterValues;
+		$[37] = list;
+		$[38] = query.q;
+		$[39] = t27;
+	} else t27 = $[39];
+	const clearFilters = t27;
+	let t28;
+	bb0: {
+		if (error !== null) {
+			let t29;
+			if ($[40] !== intl) {
+				t29 = intl.formatMessage(messages.loadFailed);
+				$[40] = intl;
+				$[41] = t29;
+			} else t29 = $[41];
+			let t30;
+			if ($[42] !== intl || $[43] !== onRetry) {
+				t30 = onRetry !== void 0 ? /* @__PURE__ */ jsx(Button, {
+					size: "sm",
+					onPress: onRetry,
+					children: intl.formatMessage(messages.retry)
+				}) : void 0;
+				$[42] = intl;
+				$[43] = onRetry;
+				$[44] = t30;
+			} else t30 = $[44];
+			let t31;
+			if ($[45] !== error.message || $[46] !== t29 || $[47] !== t30) {
+				t31 = /* @__PURE__ */ jsx(Alert, {
+					tone: "danger",
+					title: t29,
+					actions: t30,
+					children: error.message
+				});
+				$[45] = error.message;
+				$[46] = t29;
+				$[47] = t30;
+				$[48] = t31;
+			} else t31 = $[48];
+			t28 = t31;
+			break bb0;
+		}
+		if (items === void 0) {
+			t28 = /* @__PURE__ */ jsx(ListSkeleton, {
+				Layout,
+				columns,
+				perPage: query.perPage,
+				sort,
+				label,
+				withImages: itemImage !== void 0
+			});
+			break bb0;
+		}
+		if (pageItems.length === 0 && !inCalendar) {
+			let t29;
+			if ($[49] !== emptyMessage || $[50] !== hasQuery || $[51] !== intl) {
+				t29 = hasQuery ? intl.formatMessage(messages.noResults) : emptyMessage ?? intl.formatMessage(messages.empty);
+				$[49] = emptyMessage;
+				$[50] = hasQuery;
+				$[51] = intl;
+				$[52] = t29;
+			} else t29 = $[52];
+			let t30;
+			if ($[53] !== t29) {
+				t30 = /* @__PURE__ */ jsx("p", { children: t29 });
+				$[53] = t29;
+				$[54] = t30;
+			} else t30 = $[54];
+			let t31;
+			if ($[55] !== clearFilters || $[56] !== hasQuery || $[57] !== intl) {
+				t31 = hasQuery ? /* @__PURE__ */ jsx(Button, {
+					size: "sm",
+					onPress: () => clearFilters(),
+					children: intl.formatMessage(messages.clearFilters)
+				}) : null;
+				$[55] = clearFilters;
+				$[56] = hasQuery;
+				$[57] = intl;
+				$[58] = t31;
+			} else t31 = $[58];
+			let t32;
+			if ($[59] !== t30 || $[60] !== t31) {
+				t32 = /* @__PURE__ */ jsxs("div", {
+					className: ListView_module_default.state,
+					children: [t30, t31]
+				});
+				$[59] = t30;
+				$[60] = t31;
+				$[61] = t32;
+			} else t32 = $[61];
+			t28 = t32;
+			break bb0;
+		}
+		let t29;
+		if ($[62] !== itemImage) {
+			t29 = itemImage !== void 0 ? (item_9) => getImageUrl(item_9[itemImage]) : void 0;
+			$[62] = itemImage;
+			$[63] = t29;
+		} else t29 = $[63];
+		let t30;
+		if ($[64] !== currentItemId) {
+			t30 = (item_10) => item_10.id === currentItemId;
+			$[64] = currentItemId;
+			$[65] = t30;
+		} else t30 = $[65];
+		let t31;
+		if ($[66] !== selection) {
+			t31 = (item_11) => isItemSelected(selection, item_11.id);
+			$[66] = selection;
+			$[67] = t31;
+		} else t31 = $[67];
+		let t32;
+		if ($[68] !== list) {
+			t32 = (item_12) => list.toggle(item_12.id);
+			$[68] = list;
+			$[69] = t32;
+		} else t32 = $[69];
+		let t33;
+		if ($[70] !== list) {
+			t33 = (column_3) => list.toggleSort(column_3.id);
+			$[70] = list;
+			$[71] = t33;
+		} else t33 = $[71];
+		t28 = /* @__PURE__ */ jsx(Layout, {
 			items: pageItems,
 			columns,
 			renderValue,
 			getItemLabel,
 			getItemHref,
+			getItemImage: t29,
+			calendar: inCalendar ? {
+				field: calendar.field,
+				timeZone: getCalendarTimeZone([...fields, ...allColumns.map(_temp6)].find((field_0) => field_0?.name === calendar.field)),
+				month: view.month ?? currentMonth(),
+				onMonthChange: (month) => list.setMonth(month),
+				more: total !== void 0 && total > pageItems.length ? { total } : cursors !== void 0 && cursors.next !== null ? { total: null } : null
+			} : void 0,
+			isCurrent: t30,
 			selectable,
-			isSelected: (item_6) => isItemSelected(selection, item_6.id),
-			onToggle: (item_7) => list.toggle(item_7.id),
+			isSelected: t31,
+			onToggle: t32,
 			renderActions,
 			sort,
-			onSort: (column_2) => list.toggleSort(column_2.id),
+			onSort: t33,
 			label,
-			pageSelection: pageCheckbox
+			pageSelection: pageCheckbox,
+			renderCell
 		});
-	})();
-	function clearFilters() {
-		Object.keys(filterValues).forEach((id_0) => list.setFilter(id_0, void 0));
-		if ((query.q ?? "") !== "") list.setSearch("");
 	}
-	return /* @__PURE__ */ jsxs("div", {
-		className: cx(ListView_module_default.list, className),
-		children: [
-			showToolbar ? /* @__PURE__ */ jsxs("div", {
-				className: ListView_module_default.toolbar,
-				children: [/* @__PURE__ */ jsxs("div", {
-					className: ListView_module_default.toolbarStart,
-					children: [search ? /* @__PURE__ */ jsx(SearchField, {
-						value: query.q ?? "",
-						onChange: (q) => list.setSearch(q)
-					}) : null, filters.length > 0 ? /* @__PURE__ */ jsx(FilterControls, {
-						filters,
-						values: filterValues,
-						onChange: (id_1, value) => list.setFilter(id_1, value),
-						onLabel: filterLabels.remember,
-						controls: filterControls,
-						columns,
-						fields,
-						labels: filterLabels.labels
-					}) : null]
-				}), /* @__PURE__ */ jsxs("div", {
-					className: ListView_module_default.toolbarEnd,
-					children: [
-						sortable ? /* @__PURE__ */ jsx("div", {
-							className: layout === "table" ? ListView_module_default.tableSort : void 0,
-							children: /* @__PURE__ */ jsx(SortSelect, {
-								columns,
-								sort,
-								onChange: (next) => list.setSort(next)
-							})
-						}) : null,
-						layouts.length > 1 ? /* @__PURE__ */ jsx(LayoutSwitch, {
-							layouts,
-							value: layout,
-							onChange: (next_0) => {
-								setLayout(next_0);
-								onLayoutChange?.(next_0);
-							}
-						}) : null,
-						resourceActions.filter((action_10) => selectedCount === 0 || !hasScope(action_10, "selection")).map((action_11) => /* @__PURE__ */ jsx(ActionButton, {
-							action: action_11,
-							icons: actionIcons,
-							size: "md",
-							href: getActionHref(action_11),
-							isPending: pending === keyOf(action_11),
-							onPress: () => runOnResource(action_11)
-						}, action_11.id)),
-						toolbar
-					]
-				})]
-			}) : null,
-			/* @__PURE__ */ jsx(FilterChips, {
+	const body = t28;
+	let t29;
+	if ($[72] !== className) {
+		t29 = cx(ListView_module_default.list, className);
+		$[72] = className;
+		$[73] = t29;
+	} else t29 = $[73];
+	const t30 = showToolbar ? /* @__PURE__ */ jsxs("div", {
+		className: ListView_module_default.toolbar,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: ListView_module_default.toolbarStart,
+			children: [search ? /* @__PURE__ */ jsx(SearchField, {
+				value: query.q ?? "",
+				onChange: (q) => list.setSearch(q)
+			}) : null, filters.length > 0 ? /* @__PURE__ */ jsx(FilterControls, {
 				filters,
 				values: filterValues,
-				q: query.q,
-				onRemove: (id_2) => list.setFilter(id_2, void 0),
-				onClearSearch: () => list.setSearch(""),
-				onClear: clearFilters,
-				columns,
+				onChange: (id_3, value_0) => list.setFilter(id_3, value_0),
+				onLabel: filterLabels.remember,
+				controls: filterControls,
+				columns: allColumns,
 				fields,
 				labels: filterLabels.labels
+			}) : null]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: ListView_module_default.toolbarEnd,
+			children: [
+				sortable ? /* @__PURE__ */ jsx("div", {
+					className: layout === "table" ? ListView_module_default.tableSort : void 0,
+					children: /* @__PURE__ */ jsx(SortSelect, {
+						columns: allColumns,
+						sort,
+						onChange: (next) => list.setSort(next)
+					})
+				}) : null,
+				layouts.length > 1 ? /* @__PURE__ */ jsx(LayoutSwitch, {
+					layouts,
+					value: layout,
+					onChange: (next_0) => {
+						if (controlledLayout === void 0) list.setLayout(next_0);
+						onLayoutChange?.(next_0);
+					}
+				}) : null,
+				choosesColumns ? /* @__PURE__ */ jsx(ColumnMenu, {
+					columns: allColumns,
+					shown: columns,
+					onChange: (ids_0) => list.setColumns(ids_0),
+					onReset: view.columns !== void 0 ? () => list.resetColumns() : null
+				}) : null,
+				resourceActions.filter((action_8) => selectedCount === 0 || !hasScope(action_8, "selection")).map((action_9) => /* @__PURE__ */ jsx(ActionButton, {
+					action: action_9,
+					icons: actionIcons,
+					size: "md",
+					href: getActionHref(action_9),
+					isPending: pending === keyOf(action_9),
+					onPress: () => runOnResource(action_9)
+				}, action_9.id)),
+				toolbar
+			]
+		})]
+	}) : null;
+	let t31;
+	let t32;
+	if ($[74] !== list) {
+		t31 = (id_4) => list.setFilter(id_4, void 0);
+		t32 = () => list.setSearch("");
+		$[74] = list;
+		$[75] = t31;
+		$[76] = t32;
+	} else {
+		t31 = $[75];
+		t32 = $[76];
+	}
+	let t33;
+	if ($[77] !== allColumns || $[78] !== clearFilters || $[79] !== fields || $[80] !== filterLabels.labels || $[81] !== filterValues || $[82] !== filters || $[83] !== query.q || $[84] !== t31 || $[85] !== t32) {
+		t33 = /* @__PURE__ */ jsx(FilterChips, {
+			filters,
+			values: filterValues,
+			q: query.q,
+			onRemove: t31,
+			onClearSearch: t32,
+			onClear: clearFilters,
+			columns: allColumns,
+			fields,
+			labels: filterLabels.labels
+		});
+		$[77] = allColumns;
+		$[78] = clearFilters;
+		$[79] = fields;
+		$[80] = filterLabels.labels;
+		$[81] = filterValues;
+		$[82] = filters;
+		$[83] = query.q;
+		$[84] = t31;
+		$[85] = t32;
+		$[86] = t33;
+	} else t33 = $[86];
+	const t34 = selectedCount > 0 ? /* @__PURE__ */ jsxs("div", {
+		className: ListView_module_default.selection,
+		children: [
+			/* @__PURE__ */ jsx("span", {
+				className: ListView_module_default.selectionCount,
+				role: "status",
+				children: selection.mode === "all" ? intl.formatMessage(messages.allMatchingSelected, { total: selectedCount }) : intl.formatMessage(messages.selectedCount, { count: selectedCount })
 			}),
-			selectedCount > 0 ? /* @__PURE__ */ jsxs("div", {
-				className: ListView_module_default.selection,
-				children: [
-					/* @__PURE__ */ jsx("span", {
-						className: ListView_module_default.selectionCount,
-						role: "status",
-						children: selection.mode === "all" ? intl.formatMessage(messages.allMatchingSelected, { total: selectedCount }) : intl.formatMessage(messages.selectedCount, { count: selectedCount })
-					}),
-					selection.mode === "ids" && pageSelection === "all" && count > pageItems.length ? /* @__PURE__ */ jsx(Button, {
-						size: "sm",
-						variant: "ghost",
-						onPress: () => list.selectAllMatching(),
-						children: intl.formatMessage(messages.selectAllMatching, { total: count })
-					}) : null,
-					/* @__PURE__ */ jsx(Button, {
-						size: "sm",
-						variant: "ghost",
-						onPress: () => list.clearSelection(),
-						children: intl.formatMessage(messages.clearSelection)
-					}),
-					selectionActions.length > 0 ? /* @__PURE__ */ jsx("div", {
-						className: ListView_module_default.selectionActions,
-						children: selectionActions.map((action_12) => {
-							const skipped = selectedItems.filter((item_8) => !isAllowedOn(action_12, item_8)).length;
-							return /* @__PURE__ */ jsx(ActionButton, {
-								action: action_12,
-								icons: actionIcons,
-								size: "md",
-								href: null,
-								isPending: pending === keyOf(action_12),
-								isDisabled: pending !== null && pending !== keyOf(action_12) || skipped >= selectedCount,
-								onPress: () => runOnSelection(action_12)
-							}, action_12.id);
-						})
-					}) : null
-				]
+			selection.mode === "ids" && pageSelection === "all" && count > pageItems.length ? /* @__PURE__ */ jsx(Button, {
+				size: "sm",
+				variant: "ghost",
+				onPress: () => list.selectAllMatching(),
+				children: intl.formatMessage(messages.selectAllMatching, { total: count })
 			}) : null,
-			/* @__PURE__ */ jsx("div", {
-				className: ListView_module_default.body,
-				"aria-busy": isLoading && items !== void 0,
-				children: body
+			/* @__PURE__ */ jsx(Button, {
+				size: "sm",
+				variant: "ghost",
+				onPress: () => list.clearSelection(),
+				children: intl.formatMessage(messages.clearSelection)
 			}),
-			total !== void 0 && error === null && total > 0 ? /* @__PURE__ */ jsx(Pagination, {
-				page: query.page ?? 1,
-				perPage: query.perPage ?? pageItems.length,
-				total,
-				onPageChange: (page) => list.setPage(page),
-				perPageOptions,
-				onPerPageChange: (perPage) => list.setPerPage(perPage)
-			}) : null,
-			/* @__PURE__ */ jsx(ConfirmDialog, {
-				event: confirming,
-				onConfirm: (event_1) => void execute(event_1),
-				onCancel: () => setConfirming(null)
-			})
+			selectionActions.length > 0 ? /* @__PURE__ */ jsx("div", {
+				className: ListView_module_default.selectionActions,
+				children: selectionActions.map((action_10) => {
+					const skipped_0 = selectedItems.filter((item_13) => !isAllowedOn(action_10, item_13)).length;
+					return /* @__PURE__ */ jsx(ActionButton, {
+						action: action_10,
+						icons: actionIcons,
+						size: "md",
+						href: null,
+						isPending: pending === keyOf(action_10),
+						isDisabled: pending !== null && pending !== keyOf(action_10) || skipped_0 >= selectedCount,
+						onPress: () => runOnSelection(action_10)
+					}, action_10.id);
+				})
+			}) : null
 		]
-	});
+	}) : null;
+	const t35 = isLoading && items !== void 0;
+	let t36;
+	if ($[87] !== body || $[88] !== t35) {
+		t36 = /* @__PURE__ */ jsx("div", {
+			className: ListView_module_default.body,
+			"aria-busy": t35,
+			children: body
+		});
+		$[87] = body;
+		$[88] = t35;
+		$[89] = t36;
+	} else t36 = $[89];
+	let t37;
+	if ($[90] !== cursors || $[91] !== error || $[92] !== inCalendar || $[93] !== list || $[94] !== pageItems || $[95] !== perPageOptions || $[96] !== query.cursor || $[97] !== query.page || $[98] !== query.perPage || $[99] !== total) {
+		t37 = inCalendar ? null : cursors !== void 0 && error === null ? /* @__PURE__ */ jsx(CursorPagination, {
+			perPage: query.perPage ?? pageItems.length,
+			hasPrevious: query.cursor !== void 0,
+			hasNext: cursors.next !== null,
+			onPrevious: () => list.previousPage(cursors.previous),
+			onNext: () => {
+				if (cursors.next !== null) list.nextPage(cursors.next);
+			},
+			perPageOptions,
+			onPerPageChange: (perPage) => list.setPerPage(perPage)
+		}) : total !== void 0 && error === null && total > 0 ? /* @__PURE__ */ jsx(Pagination, {
+			page: query.page ?? 1,
+			perPage: query.perPage ?? pageItems.length,
+			total,
+			onPageChange: (page) => list.setPage(page),
+			perPageOptions,
+			onPerPageChange: (perPage_0) => list.setPerPage(perPage_0)
+		}) : null;
+		$[90] = cursors;
+		$[91] = error;
+		$[92] = inCalendar;
+		$[93] = list;
+		$[94] = pageItems;
+		$[95] = perPageOptions;
+		$[96] = query.cursor;
+		$[97] = query.page;
+		$[98] = query.perPage;
+		$[99] = total;
+		$[100] = t37;
+	} else t37 = $[100];
+	let t38;
+	if ($[101] !== execute) {
+		t38 = (event_1) => void execute(event_1);
+		$[101] = execute;
+		$[102] = t38;
+	} else t38 = $[102];
+	let t39;
+	if ($[103] !== closeConfirmation || $[104] !== confirming || $[105] !== preview || $[106] !== t38) {
+		t39 = /* @__PURE__ */ jsx(ConfirmDialog, {
+			event: confirming,
+			preview,
+			onConfirm: t38,
+			onCancel: closeConfirmation
+		});
+		$[103] = closeConfirmation;
+		$[104] = confirming;
+		$[105] = preview;
+		$[106] = t38;
+		$[107] = t39;
+	} else t39 = $[107];
+	let t40;
+	if ($[108] !== t29 || $[109] !== t30 || $[110] !== t33 || $[111] !== t34 || $[112] !== t36 || $[113] !== t37 || $[114] !== t39) {
+		t40 = /* @__PURE__ */ jsxs("div", {
+			className: t29,
+			children: [
+				t30,
+				t33,
+				t34,
+				t36,
+				t37,
+				t39
+			]
+		});
+		$[108] = t29;
+		$[109] = t30;
+		$[110] = t33;
+		$[111] = t34;
+		$[112] = t36;
+		$[113] = t37;
+		$[114] = t39;
+		$[115] = t40;
+	} else t40 = $[115];
+	return t40;
+}
+function _temp6(column_2) {
+	return column_2.field;
+}
+function _temp5(column_1) {
+	return column_1.sortable === true;
+}
+function _temp4(item_8) {
+	return item_8.id;
+}
+function _temp3(action_1) {
+	return hasScope(action_1, "resource");
+}
+function _temp2(action_0) {
+	return hasScope(action_0, "selection");
+}
+function _temp(action, index, all) {
+	return (hasScope(action, "selection") || hasScope(action, "resource")) && all.findIndex((candidate_0) => candidate_0.id === action.id) === index;
 }
 //#endregion
 export { ListView };