@declarion/react 0.59.0 → 0.60.0

package/dist-lib/SmartRecordListPage.impl-hbbLglC1.js

@@ -0,0 +1,780 @@
+import { s as e } from "./DynamicIcon-DW5krHuX.js";
+import { At as t, Dn as n, Jn as r, Mt as i, On as a, Ot as o, Rn as s, Tn as c, Vn as l, ct as u, fn as d, gn as f, ot as p, qn as ee, sn as te, un as m, v as h } from "./useCurrentScreen-BPq7HMF1.js";
+import { d as g, f as ne, t as _ } from "./useText-BFDCTUSo.js";
+import { c as v } from "./registry-CRPxNbkk.js";
+import { C as y, S as b, c as x, l as re, n as S, x as C } from "./useOwnRefresh-C18iWRgr.js";
+import { f as w, h as T, p as E, u as D } from "./action-dispatch-DbiOpvd6.js";
+import { n as O, r as k } from "./useProperties-C35JrjwQ.js";
+import { c as A, f as j, h as M, m as N, n as P, t as F } from "./useTabSearchMirror-DKktWWLB.js";
+import { t as I } from "./LayoutRenderer-B08IJKsZ.js";
+import { n as L, t as ie } from "./cardProjection-nveYLvHR.js";
+import { t as ae } from "./useListQuery-CG1WM4cv.js";
+import { useCallback as R, useEffect as z, useMemo as B, useRef as V, useState as oe } from "react";
+import { useSearchParams as se } from "react-router";
+import { Fragment as H, jsx as U, jsxs as W } from "react/jsx-runtime";
+//#region src/components/pages/SmartRecordListPage.impl.tsx
+var ce = 200, le = "items:";
+function G({ screenCode: r }) {
+	let a = _(), s = _("errors"), [c, u] = se(), { data: d } = ne(), p = f(), g = d?.screens[r], v = g?.entity ? d?.entities[g.entity] : void 0, b = g?.entity;
+	P(g, v, c.toString()), F(g?.route);
+	let x = re(), S = c.get("selected") ?? null, C = c.get("search") ?? "", w = i(C, 300), T = c.get("sort") ?? t(v, g?.sort_default) ?? "", E = B(() => j(c), [c]), D = E.filters.length > 0 ? E.filters : void 0, O = B(() => g?.columns ?? v?.fields.names().filter((e) => !v.fields.get(e)?.primary && !v.fields.get(e)?.auto && v.fields.get(e)?.display?.is_listable !== !1).slice(0, 4) ?? [], [g?.columns, v]), k = B(() => {
+		let e = g?.responsive?.[p.category]?.presentation;
+		return p.category === "phone" ? "drilldown" : e === "split" || e === "drilldown" || e === "stacked" ? e : "split";
+	}, [g?.responsive, p.category]), I = B(() => {
+		let e = g?.responsive?.[p.category];
+		return e?.list?.presentation === "table" || e?.list?.presentation === "cards" ? e.list.presentation : e?.presentation === "table" || e?.presentation === "cards" ? e.presentation : p.category === "phone" ? "cards" : "table";
+	}, [g?.responsive, p.category]), le = g?.responsive?.[p.category]?.layout?.related_records, G = B(() => ie({
+		entity: v,
+		screen: g
+	}), [v, g]), K = B(() => L({
+		entity: v,
+		screen: g,
+		presentation: I,
+		visibleColumns: O,
+		card: G,
+		sort: T
+	}), [
+		v,
+		g,
+		I,
+		O,
+		G,
+		T
+	]), q = ae({
+		entity: v,
+		entityCode: b,
+		screen: g,
+		screenCode: r,
+		page: 1,
+		perPage: ce,
+		sortForRequest: h(T),
+		debouncedSearch: w,
+		filters: E.filters,
+		includeDeleted: !1,
+		expand: K.expandFields,
+		select: K.selectFields,
+		isHeld: !1,
+		retryHeld: () => void 0,
+		runCountQuery: !1,
+		urlKey: `${b ?? ""}|${c.toString()}`
+	}), J = q.rows, de = q.refs, fe = q.isLoading, pe = B(() => v?.fields.names().find((e) => v.fields.get(e)?.primary) ?? "id", [v]), me = R((e, t) => {
+		u((t) => {
+			let n = new URLSearchParams(t);
+			return e ? n.set("selected", e) : n.delete("selected"), n;
+		}, { replace: t?.replace ?? !0 });
+	}, [u]), he = R((e) => {
+		u((t) => {
+			let n = new URLSearchParams(t);
+			return e ? n.set("search", e) : n.delete("search"), n;
+		}, { replace: !0 });
+	}, [u]), ge = R((e, t) => {
+		u((n) => {
+			let r = new URLSearchParams(n), i = j(n).filters, a;
+			return a = t && t !== "__all__" ? [...N(i, e), A(e, t)] : N(i, e), M(a, r), r;
+		}, { replace: !0 });
+	}, [u]), X = (g?.list_resizable ?? !1) && k === "split" && p.category !== "phone" && !p.touch, _e = V(null), [Z, Q] = oe(null), ve = V(!1), $ = g?.list_width;
+	z(() => {
+		X && $?.endsWith("%") && Q(null);
+	}, [
+		X,
+		$,
+		p.width,
+		p.height
+	]), z(() => {
+		if (!X || Z !== null) return;
+		let e = _e.current;
+		if (e) {
+			if ($ && $.endsWith("%")) {
+				let t = parseFloat($) / 100;
+				Q(Math.round(e.getBoundingClientRect().width * t));
+			} else Q($ && parseInt($, 10) || 320);
+		}
+	}, [
+		X,
+		$,
+		Z,
+		v
+	]);
+	let ye = V(null);
+	z(() => () => {
+		ye.current?.();
+	}, []);
+	let be = R((e) => {
+		e.preventDefault(), ve.current = !0;
+		let t = e.clientX, n = Z ?? 320, r = (e) => {
+			if (!ve.current) return;
+			let r = (_e.current?.getBoundingClientRect().width ?? window.innerWidth) - 300, i = Math.max(200, Math.min(r, n + e.clientX - t));
+			Q(i);
+		}, i = () => {
+			ve.current = !1, document.removeEventListener("mousemove", r), document.removeEventListener("mouseup", i), document.body.style.cursor = "", document.body.style.userSelect = "", ye.current = null;
+		};
+		document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", document.addEventListener("mousemove", r), document.addEventListener("mouseup", i), ye.current = i;
+	}, [Z]);
+	if (!d || !g || !v) return null;
+	let xe = D?.length ?? 0, Se = k === "split" || k === "stacked" || !S, Ce = k === "split" || k === "stacked" || !!S, we = k !== "split" && S ? () => me(null, { replace: !0 }) : void 0, Te = k === "split" ? X && Z !== null ? Z : g.list_width ?? "320px" : "100%";
+	return /* @__PURE__ */ W("div", {
+		ref: _e,
+		"data-record-list-presentation": k,
+		style: {
+			display: "flex",
+			flexDirection: k === "stacked" ? "column" : "row",
+			height: "100%",
+			minWidth: 0,
+			overflow: "hidden"
+		},
+		children: [
+			Se && /* @__PURE__ */ W("div", {
+				"data-testid": "record-list-panel",
+				style: {
+					flex: k === "split" ? "none" : "1 1 auto",
+					display: "flex",
+					flexDirection: "column",
+					overflow: "hidden",
+					borderRight: k === "split" && !X ? "1px solid var(--divider)" : "none",
+					borderBottom: k === "stacked" ? "1px solid var(--divider)" : "none",
+					width: Te,
+					minWidth: 0,
+					height: k === "stacked" ? "50%" : "100%"
+				},
+				children: [/* @__PURE__ */ W("div", {
+					style: {
+						paddingTop: 12,
+						paddingBottom: 12,
+						...y(12),
+						display: "flex",
+						flexDirection: "column",
+						gap: 8,
+						borderBottom: "1px solid var(--divider)"
+					},
+					children: [
+						x.hasOriginBack && /* @__PURE__ */ W("div", {
+							style: {
+								display: "flex",
+								alignItems: "center",
+								gap: 8
+							},
+							children: [/* @__PURE__ */ U(ee, {
+								icon: /* @__PURE__ */ U(e.back, { size: 14 }),
+								title: a("list.header.back", "Back"),
+								onClick: x.goBack
+							}), /* @__PURE__ */ U("span", {
+								style: {
+									fontSize: 12.5,
+									fontWeight: 600,
+									color: "var(--text)"
+								},
+								children: a(g.display?.name) || a(v.display.name_plural)
+							})]
+						}),
+						/* @__PURE__ */ U(m, {
+							value: C,
+							onChange: he,
+							placeholder: a("list.toolbar.search_placeholder", "Search {name}…", { name: a(v.display.name_plural) }),
+							prefix: /* @__PURE__ */ U(e.search, { size: 13 })
+						}),
+						E.error && /* @__PURE__ */ W("div", {
+							role: "alert",
+							"data-testid": "record-list-filter-url-error",
+							style: {
+								padding: "7px 9px",
+								border: "1px solid var(--danger)",
+								borderRadius: 6,
+								color: "var(--danger)",
+								fontSize: 11.5
+							},
+							children: [
+								s(E.errorCode ?? "", E.error),
+								" ",
+								a("list.filters.invalid_suffix", "Showing this list without URL filters.")
+							]
+						}),
+						g.filters && g.filters.length > 0 && /* @__PURE__ */ U("div", {
+							style: {
+								display: "flex",
+								flexWrap: "wrap",
+								gap: 6
+							},
+							children: g.filters.map((e) => {
+								let t = v.fields.get(e);
+								if (!t?.values || !o(v, e)) return null;
+								let r = D?.find((t) => t.field === e && t.op === "eq")?.value ?? "__all__", i = n(a, t, e, d.entities), s = [{
+									value: "__all__",
+									label: a("list.filters.all_values", "All {field}", { field: i })
+								}, ...t.values.map((e) => ({
+									value: e.code,
+									label: a(e.name) || e.code
+								}))];
+								return /* @__PURE__ */ U("div", {
+									style: { minWidth: 120 },
+									children: /* @__PURE__ */ U(te, {
+										value: r,
+										options: s,
+										onChange: (t) => ge(e, t),
+										placeholder: i
+									})
+								}, e);
+							})
+						}),
+						/* @__PURE__ */ W("div", {
+							style: {
+								display: "flex",
+								alignItems: "center",
+								justifyContent: "space-between",
+								fontSize: 11,
+								color: "var(--text-3)"
+							},
+							children: [/* @__PURE__ */ U("span", { children: fe ? a("list.records.loading", "Loading…") : a("list.records.count", "{count} {name}", {
+								count: J.length,
+								name: a(v.display.name_plural)
+							}) }), xe > 0 && /* @__PURE__ */ U("button", {
+								onClick: () => u((e) => {
+									let t = new URLSearchParams(e);
+									return t.delete("filters"), t;
+								}, { replace: !0 }),
+								style: {
+									background: "transparent",
+									border: 0,
+									color: "var(--accent)",
+									cursor: "pointer",
+									fontSize: 11,
+									textDecoration: "underline",
+									padding: 0
+								},
+								children: a("list.filters.clear", "Clear filters")
+							})]
+						})
+					]
+				}), /* @__PURE__ */ U("div", {
+					style: {
+						flex: 1,
+						overflowY: "auto",
+						padding: I === "cards" ? 10 : 0,
+						display: I === "cards" ? "flex" : "block",
+						flexDirection: "column",
+						gap: I === "cards" ? 10 : void 0
+					},
+					children: fe ? /* @__PURE__ */ U("div", {
+						style: {
+							padding: 12,
+							display: "flex",
+							flexDirection: "column",
+							gap: 6
+						},
+						children: Array.from({ length: 8 }).map((e, t) => /* @__PURE__ */ U("div", { style: {
+							height: 48,
+							borderRadius: 6,
+							background: "var(--surface-3)"
+						} }, t))
+					}) : J.length === 0 ? /* @__PURE__ */ U("div", {
+						style: {
+							padding: 28,
+							textAlign: "center",
+							fontSize: 12.5,
+							color: "var(--text-3)"
+						},
+						children: a("list.records.none", "No records found")
+					}) : /* @__PURE__ */ W(H, { children: [J.map((e) => {
+						let t = l(e[pe]);
+						return /* @__PURE__ */ U(ue, {
+							record: e,
+							entity: v,
+							columns: O,
+							card: G,
+							presentation: I,
+							refs: de,
+							isSelected: t === S,
+							onClick: () => me(t, { replace: k === "split" })
+						}, t);
+					}), q.isCursor && q.hasMorePages && /* @__PURE__ */ U("button", {
+						type: "button",
+						"data-testid": "record-list-load-more",
+						onClick: q.fetchNextPage,
+						disabled: q.isFetchingNextPage,
+						style: {
+							width: "100%",
+							padding: "8px 12px",
+							fontSize: 12,
+							background: "transparent",
+							border: "none",
+							borderTop: "1px solid var(--divider)",
+							color: "var(--text-2)",
+							cursor: q.isFetchingNextPage ? "default" : "pointer"
+						},
+						children: q.isFetchingNextPage ? a("list.records.loading", "Loading…") : a("list.footer.load_more", "Load more")
+					})] })
+				})]
+			}),
+			X && /* @__PURE__ */ U("div", {
+				"data-testid": "record-list-resize-handle",
+				onMouseDown: be,
+				style: {
+					flex: "none",
+					width: 1,
+					cursor: "col-resize",
+					background: "var(--divider)",
+					transition: "background-color .12s"
+				},
+				onMouseEnter: (e) => e.currentTarget.style.background = "var(--border-strong)",
+				onMouseLeave: (e) => e.currentTarget.style.background = "var(--divider)"
+			}),
+			Ce && /* @__PURE__ */ U("div", {
+				"data-testid": "record-detail-panel",
+				style: {
+					flex: 1,
+					minWidth: 0,
+					overflow: "hidden",
+					height: k === "stacked" ? "50%" : "100%"
+				},
+				children: S ? /* @__PURE__ */ U(Y, {
+					entityCode: b,
+					recordId: S,
+					items: g.items,
+					schema: d,
+					entity: v,
+					onBackToList: we,
+					relatedRecordsPresentation: le
+				}, S) : /* @__PURE__ */ U("div", {
+					style: {
+						display: "flex",
+						alignItems: "center",
+						justifyContent: "center",
+						height: "100%",
+						color: "var(--text-3)"
+					},
+					children: /* @__PURE__ */ U("p", {
+						style: { fontSize: 12.5 },
+						children: a("list.detail.select_prompt", "Select a {name} to view details", { name: a(v.display.name) })
+					})
+				})
+			})
+		]
+	});
+}
+function ue({ record: e, entity: t, columns: n, card: r, presentation: i, refs: a, isSelected: o, onClick: s }) {
+	let c = _();
+	if (i === "cards") {
+		let n = r.badgeFields.filter((n) => K(t, e, n)), i = r.bodyFields.filter((n) => K(t, e, n)), l = r.metaFields.filter((n) => K(t, e, n));
+		return /* @__PURE__ */ W("button", {
+			type: "button",
+			"data-testid": "record-list-card",
+			"aria-current": o ? "true" : void 0,
+			onClick: s,
+			style: {
+				width: "100%",
+				textAlign: "left",
+				padding: 12,
+				border: "1px solid var(--border)",
+				borderRadius: 8,
+				background: o ? "var(--row-selected-bg)" : "var(--surface)",
+				color: "var(--text)",
+				cursor: "pointer",
+				display: "flex",
+				flexDirection: "column",
+				gap: 8,
+				boxShadow: o ? "inset 3px 0 0 var(--accent)" : "none"
+			},
+			children: [
+				/* @__PURE__ */ U(q, {
+					entity: t,
+					record: e,
+					field: r.titleField,
+					refs: a
+				}),
+				r.subtitleField && /* @__PURE__ */ U("div", {
+					style: {
+						fontSize: 12,
+						color: "var(--text-3)",
+						overflowWrap: "anywhere"
+					},
+					children: E({
+						entity: t,
+						fieldName: r.subtitleField,
+						record: e,
+						mode: "display",
+						refs: a,
+						t: c
+					})
+				}),
+				n.length > 0 && /* @__PURE__ */ U("div", {
+					style: {
+						display: "flex",
+						flexWrap: "wrap",
+						gap: 6
+					},
+					children: n.map((n) => /* @__PURE__ */ U("span", {
+						style: {
+							border: "1px solid var(--border)",
+							borderRadius: 999,
+							padding: "2px 7px",
+							fontSize: 11,
+							color: "var(--text-2)",
+							maxWidth: "100%",
+							overflowWrap: "anywhere"
+						},
+						children: E({
+							entity: t,
+							fieldName: n,
+							record: e,
+							mode: "display",
+							refs: a,
+							t: c
+						})
+					}, n))
+				}),
+				i.length > 0 && /* @__PURE__ */ U("dl", {
+					style: {
+						display: "grid",
+						gridTemplateColumns: "minmax(72px, max-content) minmax(0, 1fr)",
+						gap: "5px 10px",
+						margin: 0
+					},
+					children: i.map((n) => /* @__PURE__ */ U(J, {
+						entity: t,
+						record: e,
+						fieldName: n,
+						refs: a
+					}, n))
+				}),
+				l.length > 0 && /* @__PURE__ */ U("div", {
+					style: {
+						display: "flex",
+						flexWrap: "wrap",
+						gap: 8,
+						fontSize: 11,
+						color: "var(--text-3)"
+					},
+					children: l.map((n) => /* @__PURE__ */ U("span", {
+						style: {
+							minWidth: 0,
+							overflowWrap: "anywhere"
+						},
+						children: E({
+							entity: t,
+							fieldName: n,
+							record: e,
+							mode: "display",
+							refs: a,
+							t: c
+						})
+					}, n))
+				})
+			]
+		});
+	}
+	let l = n[0], u = n[1], d = n.slice(2, 4);
+	return /* @__PURE__ */ W("button", {
+		onClick: s,
+		style: {
+			width: "100%",
+			textAlign: "left",
+			padding: "10px 12px",
+			borderBottom: "1px solid var(--divider)",
+			background: o ? "var(--row-selected-bg)" : "transparent",
+			borderLeft: o ? "2px solid var(--accent)" : "2px solid transparent",
+			cursor: "pointer",
+			transition: "background-color .12s",
+			display: "flex",
+			flexDirection: "column",
+			gap: 2,
+			border: "1px solid transparent",
+			borderBottomColor: "var(--divider)"
+		},
+		onMouseEnter: (e) => {
+			o || (e.currentTarget.style.background = "var(--surface-3)");
+		},
+		onMouseLeave: (e) => {
+			o || (e.currentTarget.style.background = "transparent");
+		},
+		children: [l && /* @__PURE__ */ U("div", {
+			style: {
+				fontSize: 12.5,
+				fontWeight: 500,
+				overflow: "hidden",
+				textOverflow: "ellipsis",
+				whiteSpace: "nowrap",
+				color: "var(--text)"
+			},
+			children: E({
+				entity: t,
+				fieldName: l,
+				record: e,
+				mode: "display",
+				refs: a,
+				t: c
+			})
+		}), /* @__PURE__ */ W("div", {
+			style: {
+				display: "flex",
+				alignItems: "center",
+				gap: 6
+			},
+			children: [u && /* @__PURE__ */ U("div", {
+				style: {
+					fontSize: 11,
+					color: "var(--text-3)",
+					flex: 1,
+					overflow: "hidden",
+					textOverflow: "ellipsis",
+					whiteSpace: "nowrap"
+				},
+				children: E({
+					entity: t,
+					fieldName: u,
+					record: e,
+					mode: "display",
+					refs: a,
+					t: c
+				})
+			}), /* @__PURE__ */ U("div", {
+				style: {
+					display: "flex",
+					alignItems: "center",
+					gap: 4,
+					flexShrink: 0
+				},
+				children: d.map((n) => w(t, e, n) == null ? null : /* @__PURE__ */ U("div", {
+					style: { fontSize: 11 },
+					children: E({
+						entity: t,
+						fieldName: n,
+						record: e,
+						mode: "display",
+						refs: a,
+						t: c
+					})
+				}, n))
+			})]
+		})]
+	});
+}
+function K(e, t, n) {
+	let r = w(e, t, n);
+	return !(r == null || r === "" || Array.isArray(r) && r.length === 0);
+}
+function q({ entity: e, record: t, field: n, refs: r }) {
+	let i = _(), o = a(i, t, e), s = n ? E({
+		entity: e,
+		fieldName: n,
+		record: t,
+		mode: "display",
+		refs: r,
+		t: i
+	}) : o;
+	return /* @__PURE__ */ U("div", {
+		style: {
+			fontSize: 13.5,
+			fontWeight: 600,
+			color: "var(--text)",
+			overflowWrap: "anywhere"
+		},
+		children: s || i(e.display.name)
+	});
+}
+function J({ entity: e, record: t, fieldName: r, refs: i }) {
+	let a = _(), o = w(e, t, r);
+	if (o == null || o === "") return null;
+	let s = e.fields.get(r);
+	return s ? /* @__PURE__ */ W(H, { children: [/* @__PURE__ */ U("dt", {
+		style: {
+			color: "var(--text-3)",
+			fontSize: 11.5,
+			minWidth: 0,
+			overflowWrap: "anywhere"
+		},
+		children: n(a, s, r)
+	}), /* @__PURE__ */ U("dd", {
+		style: {
+			margin: 0,
+			color: "var(--text)",
+			fontSize: 12,
+			minWidth: 0,
+			overflowWrap: "anywhere"
+		},
+		children: E({
+			entity: e,
+			fieldName: r,
+			record: t,
+			mode: "display",
+			refs: i,
+			t: a
+		})
+	})] }) : null;
+}
+function Y({ entityCode: e, recordId: t, items: n, schema: r, entity: i, onBackToList: a, relatedRecordsPresentation: o }) {
+	return /* @__PURE__ */ U(p, { children: /* @__PURE__ */ U(de, {
+		entityCode: e,
+		recordId: t,
+		items: n,
+		schema: r,
+		entity: i,
+		onBackToList: a,
+		relatedRecordsPresentation: o
+	}) });
+}
+function de({ entityCode: t, recordId: n, items: i, schema: o, entity: f, onBackToList: p, relatedRecordsPresentation: te }) {
+	let m = _(), h = c(f, "update"), ne = B(() => n ? s(f, n) : void 0, [n, f]), { data: re, isLoading: E } = v(t, ne), A = x(t), j = u(), [M, N] = oe(!1), [P, F] = oe({}), L = re?.data, ie = L?.$statuses, ae = L?.$properties, z = k(t, n), V = O(t, n), se = B(() => {
+		let e = /* @__PURE__ */ new Set();
+		for (let [t, n] of f.fields) !n.auto && !n.primary && e.add(t);
+		for (let [t] of f.files ?? []) e.add(t);
+		return e;
+	}, [f]), ce = R(() => {
+		if (L) {
+			let e = {};
+			se.forEach((t) => {
+				let n = w(f, L, t);
+				e[t] = D(f, t) ? n ?? null : n ?? "";
+			}), F(e);
+		}
+		N(!0);
+	}, [
+		L,
+		se,
+		f
+	]), G = R(async () => {
+		await j.flushAllDrafts(), N(!1), F({});
+	}, [j]), ue = R(() => {
+		let e = {}, t = C({
+			entity: f,
+			formData: P,
+			record: L,
+			isNew: !1
+		}), r = b(t);
+		for (let [t, n] of Object.entries(P)) f.files?.has(t) || (e[t] = T(f, t, n));
+		if (Object.keys(t).length > 0 && (e.$files = t), Object.keys(e).length === 0) {
+			N(!1), F({});
+			return;
+		}
+		A.mutate({
+			pkValues: n,
+			data: e
+		}, { onSuccess: () => {
+			r.forEach((e) => j.markCommitted(e)), N(!1), F({});
+		} });
+	}, [
+		j,
+		A,
+		n,
+		f,
+		P,
+		L
+	]), K = R((e, t) => {
+		F((n) => ({
+			...n,
+			[e]: t
+		}));
+	}, []);
+	if (E) return /* @__PURE__ */ U(S, {});
+	if (!L) return null;
+	let q = a(m, L, f), J = f.display?.display_field, Y = q ? void 0 : J ? L[J] : L[f.fields.names()[0]], de = q || (Y != null && typeof Y != "object" ? l(Y) : m(f.display.name)), fe = L?.$refs, pe = {
+		schema: o,
+		entity: f,
+		entityCode: t,
+		recordId: n,
+		record: M ? {
+			...L,
+			...P
+		} : L,
+		isNew: !1,
+		mode: M ? "edit" : "display",
+		onFieldChange: M ? K : void 0,
+		refs: fe,
+		objectProperties: ae ?? void 0,
+		onSetProperty: h ? (e, t) => V.mutate({
+			propertyCode: e,
+			value: t
+		}) : void 0,
+		isPropertyPending: V.isPending,
+		objectStatuses: ie ?? void 0,
+		onSetStatus: h ? (e, t) => z.mutate({
+			groupCode: e,
+			statusCode: t
+		}) : void 0,
+		isStatusPending: z.isPending,
+		relatedRecordsPresentation: te
+	};
+	return /* @__PURE__ */ W("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			height: "100%"
+		},
+		children: [/* @__PURE__ */ W("div", {
+			style: {
+				display: "flex",
+				alignItems: "center",
+				justifyContent: "space-between",
+				paddingTop: 10,
+				paddingBottom: 10,
+				...y(16),
+				borderBottom: "1px solid var(--divider)",
+				position: "sticky",
+				top: 0,
+				background: "var(--surface)",
+				zIndex: 10
+			},
+			children: [/* @__PURE__ */ U("h2", {
+				style: {
+					margin: 0,
+					fontSize: 13,
+					fontWeight: 600,
+					overflow: "hidden",
+					textOverflow: "ellipsis",
+					whiteSpace: "nowrap",
+					color: "var(--text)"
+				},
+				children: de
+			}), /* @__PURE__ */ W("div", {
+				style: {
+					display: "flex",
+					alignItems: "center",
+					gap: 6
+				},
+				children: [p && /* @__PURE__ */ U(ee, {
+					icon: /* @__PURE__ */ U(e.back, { size: 14 }),
+					title: m("list.detail.back_to_list", "Back to list"),
+					onClick: p
+				}), h && (M ? /* @__PURE__ */ W(H, { children: [/* @__PURE__ */ U(r, {
+					size: "xs",
+					icon: /* @__PURE__ */ U(e.x, { size: 12 }),
+					onClick: G,
+					children: m("dialog.cancel", "Cancel")
+				}), /* @__PURE__ */ U(r, {
+					kind: "primary",
+					size: "xs",
+					icon: A.isPending ? /* @__PURE__ */ U(d, { size: 12 }) : /* @__PURE__ */ U(e.save, { size: 12 }),
+					onClick: ue,
+					disabled: A.isPending,
+					children: A.isPending ? m("dialog.saving", "Saving…") : m("dialog.save", "Save")
+				})] }) : /* @__PURE__ */ U(r, {
+					size: "xs",
+					icon: /* @__PURE__ */ U(e.edit, { size: 12 }),
+					onClick: ce,
+					children: m("list.record.edit", "Edit")
+				}))]
+			})]
+		}), /* @__PURE__ */ U("div", {
+			style: {
+				flex: 1,
+				overflowY: "auto",
+				paddingTop: 16,
+				paddingBottom: 16,
+				...y(16),
+				display: "flex",
+				flexDirection: "column",
+				gap: 12
+			},
+			children: i && i.length > 0 ? /* @__PURE__ */ U(I, {
+				nodes: i,
+				ctx: pe
+			}) : /* @__PURE__ */ U("p", {
+				style: {
+					fontSize: 12.5,
+					color: "var(--text-3)"
+				},
+				children: g(m("list.detail.no_layout", "No layout configured. Add {key} to the screen definition."), { key: /* @__PURE__ */ U("code", { children: le }) })
+			})
+		})]
+	});
+}
+//#endregion
+export { G as SmartRecordListPage };