@declarion/react 0.65.1 → 0.66.1

package/dist-lib/{ListCardsBody-BEoYjSZ2.js → components/pages/list/ListCardRow.js}

@@ -1,9 +1,12 @@
-import { sn as e, wn as t, wt as n } from "./useCurrentScreen-BZOHBGQZ.js";
-import { t as r } from "./Pill-D-wsfRhx.js";
-import { t as i } from "./Check-DAfMbQIw.js";
-import { f as a, m as o, n as s, p as c } from "./variants-vUtfBbE6.js";
-import { t as l } from "./cardProjection-Cxlogzh8.js";
-import { t as u } from "./SmartListPage.impl-Cu83Gv_G.js";
+import { coerceDisplayString as e } from "../../../lib/display-value.js";
+import { getDisplayValue as t } from "../../../types/schema.js";
+import { Pill as n } from "../../primitives/Pill.js";
+import { useText as r } from "../../../hooks/useText.js";
+import { Check as i } from "../../primitives/Check.js";
+import { getSchemaFieldValue as a, renderSchemaField as o, resolveSchemaFieldLabel as s } from "../../file-widgets/host.js";
+import { effectiveScreenForRecord as c } from "../../../lib/variants.js";
+import { resolveCard as l } from "./cardProjection.js";
+import { RowActionsCell as u } from "./RowActionsCell.js";
 import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/components/pages/list/ListCardRow.tsx
 function p(e, t, n, r) {
@@ -15,76 +18,76 @@ function p(e, t, n, r) {
 		let r = t.slice(10), i = n.properties?.[r];
 		return i ? e(i.name) || r : t;
 	}
-	return o(e, n, t, r);
+	return s(e, n, t, r);
 }
-function m(e, n, r) {
-	if (e.startsWith("$status.")) {
-		let t = e.slice(8), r = n.$statuses;
-		return Array.isArray(r) && r.some((e) => e.group_code === t);
+function m(t, n, r) {
+	if (t.startsWith("$status.")) {
+		let e = t.slice(8), r = n.$statuses;
+		return Array.isArray(r) && r.some((t) => t.group_code === e);
 	}
-	if (e.startsWith("$property.")) {
-		let r = e.slice(10), i = n.$properties, a = Array.isArray(i) ? i.find((e) => e.property_code === r) : void 0;
-		return a?.value != null && t(a.value) !== "";
+	if (t.startsWith("$property.")) {
+		let r = t.slice(10), i = n.$properties, a = Array.isArray(i) ? i.find((e) => e.property_code === r) : void 0;
+		return a?.value != null && e(a.value) !== "";
 	}
-	let i = a(r, n, e);
-	return i != null && t(i) !== "";
+	let i = a(r, n, t);
+	return i != null && e(i) !== "";
 }
-function h(e, n, i) {
-	let { entity: a, entityCode: o, refs: s, t: l, renderers: u } = i;
-	if (e.startsWith("$status.")) {
-		let t = e.slice(8), i = a.status_groups?.[t], o = n.$statuses, s = Array.isArray(o) ? o.find((e) => e.group_code === t) : void 0;
+function h(t, r, i) {
+	let { entity: a, entityCode: s, refs: c, t: l, renderers: u } = i;
+	if (t.startsWith("$status.")) {
+		let e = t.slice(8), i = a.status_groups?.[e], o = r.$statuses, s = Array.isArray(o) ? o.find((t) => t.group_code === e) : void 0;
 		if (!i || !s) return /* @__PURE__ */ d("span", {
 			style: { color: "var(--text-3)" },
 			children: "-"
 		});
 		let c = i.statuses.find((e) => e.code === s.status_code);
-		return /* @__PURE__ */ d(r, {
+		return /* @__PURE__ */ d(n, {
 			tone: c?.color ?? "slate",
 			size: "xs",
 			children: l(c?.name) || s.status_code
 		});
 	}
-	if (e.startsWith("$property.")) {
-		let r = e.slice(10), i = n.$properties, a = Array.isArray(i) ? i.find((e) => e.property_code === r) : void 0;
+	if (t.startsWith("$property.")) {
+		let n = t.slice(10), i = r.$properties, a = Array.isArray(i) ? i.find((e) => e.property_code === n) : void 0;
 		return !a || a.value == null ? /* @__PURE__ */ d("span", {
 			style: { color: "var(--text-3)" },
 			children: "-"
-		}) : /* @__PURE__ */ d("span", { children: t(a.value) });
+		}) : /* @__PURE__ */ d("span", { children: e(a.value) });
 	}
-	if (a.files?.get(e)) return c({
+	if (a.files?.get(t)) return o({
 		entity: a,
-		entityCode: o,
-		fieldName: e,
-		record: n,
+		entityCode: s,
+		fieldName: t,
+		record: r,
 		mode: "display",
 		surface: "list",
-		refs: s,
+		refs: c,
 		t: l
 	});
-	let f = u.get(e);
+	let f = u.get(t);
 	if (!f) {
-		let r = n[e];
-		return t(r) || /* @__PURE__ */ d("span", {
+		let n = r[t];
+		return e(n) || /* @__PURE__ */ d("span", {
 			style: { color: "var(--text-3)" },
 			children: "-"
 		});
 	}
-	return f(n[e], n);
+	return f(r[t], r);
 }
-function g({ row: t, rowIndex: r, entity: a, screen: o, entityCode: c, entities: g, savedViewColumns: _, refs: v, renderers: y, rowActions: b, tabNavigate: x, interaction: S, hasSoftDelete: C, zebra: w, hasBatchActions: T, hasDetailTarget: E, rowKey: D, measureElement: O }) {
-	let k = n(), A = {
+function g({ row: e, rowIndex: n, entity: a, screen: o, entityCode: s, entities: g, savedViewColumns: _, refs: v, renderers: y, rowActions: b, tabNavigate: x, interaction: S, hasSoftDelete: C, zebra: w, hasBatchActions: T, hasDetailTarget: E, rowKey: D, measureElement: O }) {
+	let k = r(), A = {
 		entity: a,
-		entityCode: c,
+		entityCode: s,
 		refs: v,
 		t: k,
 		renderers: y
-	}, j = t.original, M = s(a, o, j), N = l({
+	}, j = e.original, M = c(a, o, j), N = l({
 		entity: a,
 		screen: M,
 		savedViewColumns: _
-	}), P = C && j[a.soft_delete] != null, F = t.getIsSelected(), I = w && r % 2 == 1, L = E || S.peekAllowed, R = (N.titleUsesDisplay ? e(k, j, a) ?? (N.titleField ? null : D(j)) : null) || (N.titleField ? h(N.titleField, j, A) : D(j)), z = N.subtitleField && (N.explicit || m(N.subtitleField, j, a)) ? N.subtitleField : void 0, B = N.badgeFields.filter((e) => !N.hideEmptyFields || m(e, j, a)), V = N.bodyFields.filter((e) => !N.hideEmptyFields || m(e, j, a)), H = N.metaFields.filter((e) => !N.hideEmptyFields || m(e, j, a));
+	}), P = C && j[a.soft_delete] != null, F = e.getIsSelected(), I = w && n % 2 == 1, L = E || S.peekAllowed, R = (N.titleUsesDisplay ? t(k, j, a) ?? (N.titleField ? null : D(j)) : null) || (N.titleField ? h(N.titleField, j, A) : D(j)), z = N.subtitleField && (N.explicit || m(N.subtitleField, j, a)) ? N.subtitleField : void 0, B = N.badgeFields.filter((e) => !N.hideEmptyFields || m(e, j, a)), V = N.bodyFields.filter((e) => !N.hideEmptyFields || m(e, j, a)), H = N.metaFields.filter((e) => !N.hideEmptyFields || m(e, j, a));
 	return /* @__PURE__ */ d("div", {
-		"data-index": r,
+		"data-index": n,
 		"data-testid": "list-card",
 		ref: (e) => O(e),
 		style: {
@@ -102,7 +105,7 @@ function g({ row: t, rowIndex: r, entity: a, screen: o, entityCode: c, entities:
 				alignItems: "start",
 				width: "100%",
 				boxSizing: "border-box",
-				borderRadius: 8,
+				borderRadius: "var(--radius-md)",
 				opacity: P ? .56 : 1,
 				fontStyle: P ? "italic" : "normal",
 				padding: "12px",
@@ -130,7 +133,7 @@ function g({ row: t, rowIndex: r, entity: a, screen: o, entityCode: c, entities:
 					style: { paddingTop: 2 },
 					children: /* @__PURE__ */ d(i, {
 						checked: F,
-						onChange: () => t.toggleSelected()
+						onChange: () => e.toggleSelected()
 					})
 				}),
 				/* @__PURE__ */ f("div", {
@@ -238,7 +241,7 @@ function g({ row: t, rowIndex: r, entity: a, screen: o, entityCode: c, entities:
 					screen: o,
 					fullScreen: o,
 					entity: a,
-					entityCode: c,
+					entityCode: s,
 					rowActions: b,
 					tabNavigate: x,
 					peekAllowed: S.peekAllowed,
@@ -247,35 +250,7 @@ function g({ row: t, rowIndex: r, entity: a, screen: o, entityCode: c, entities:
 				})
 			]
 		})
-	}, t.id);
-}
-//#endregion
-//#region src/components/pages/list/ListCardsBody.tsx
-function _({ rows: e, virtualizer: t, ...n }) {
-	return /* @__PURE__ */ d("div", {
-		style: {
-			height: t.getTotalSize(),
-			width: "100%",
-			position: "relative",
-			boxSizing: "border-box"
-		},
-		children: t.getVirtualItems().map((r) => /* @__PURE__ */ d("div", {
-			style: {
-				position: "absolute",
-				top: 0,
-				left: 0,
-				width: "100%",
-				transform: `translateY(${r.start}px)`,
-				boxSizing: "border-box"
-			},
-			children: /* @__PURE__ */ d(g, {
-				row: e[r.index],
-				rowIndex: r.index,
-				measureElement: t.measureElement,
-				...n
-			})
-		}, e[r.index]?.id ?? r.key))
-	});
+	}, e.id);
 }
 //#endregion
-export { _ as ListCardsBody };
+export { g as ListCardRow };

package/dist-lib/components/pages/list/ListCardsBody.js

@@ -0,0 +1,31 @@
+import { ListCardRow as e } from "./ListCardRow.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/pages/list/ListCardsBody.tsx
+function n({ rows: n, virtualizer: r, ...i }) {
+	return /* @__PURE__ */ t("div", {
+		style: {
+			height: r.getTotalSize(),
+			width: "100%",
+			position: "relative",
+			boxSizing: "border-box"
+		},
+		children: r.getVirtualItems().map((a) => /* @__PURE__ */ t("div", {
+			style: {
+				position: "absolute",
+				top: 0,
+				left: 0,
+				width: "100%",
+				transform: `translateY(${a.start}px)`,
+				boxSizing: "border-box"
+			},
+			children: /* @__PURE__ */ t(e, {
+				row: n[a.index],
+				rowIndex: a.index,
+				measureElement: r.measureElement,
+				...i
+			})
+		}, n[a.index]?.id ?? a.key))
+	});
+}
+//#endregion
+export { n as ListCardsBody };

package/dist-lib/components/pages/list/ListFloatbar.js

@@ -0,0 +1,130 @@
+import { pluralText as e } from "../../../lib/language.js";
+import { Icon as t } from "../../primitives/Icons.js";
+import { useText as n } from "../../../hooks/useText.js";
+import { buildActionBody as r, executeAction as i } from "../../../api/data.js";
+import { applyRowState as a, defaultFlatForSlot as o, filterLayoutForSlot as s } from "../../../lib/actions.js";
+import { useActionRunner as c } from "../../actions/ActionRunner.js";
+import { dispatchAction as l } from "../../../lib/action-dispatch.js";
+import { ResponsiveActionBar as u } from "../../actions/ResponsiveActionBar.js";
+import { commonVariantActionCodes as d, effectiveScreenForRecord as f, resolveScreenVariantCode as p } from "../../../lib/variants.js";
+import { useMemo as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+//#region src/components/pages/list/ListFloatbar.tsx
+var _ = "@keyframes floatbarIn{from{transform:translateX(-50%) translateY(8px);opacity:0}to{transform:translateX(-50%) translateY(0);opacity:1}}";
+function v({ selectedIds: v, floatbarActions: y, screenActionLayout: b, entityActionLayout: x, data: S, rowKey: C, entityCode: w, entity: T, screen: E, onClear: D, onActionSuccess: O, widgetContext: k }) {
+	let A = n(), j = n("errors"), { run: M } = c(), N = m(() => {
+		let e = {};
+		for (let { code: t, action: n } of y) e[t] = n;
+		return e;
+	}, [y]), P = m(() => {
+		if (v.length === 0) return [];
+		let e = /* @__PURE__ */ new Map();
+		for (let t of S) e.set(C(t), t);
+		return v.map((t) => e.get(t)).filter((e) => e !== void 0);
+	}, [
+		v,
+		S,
+		C
+	]), F = m(() => {
+		if (!T || !E || P.length === 0) return b;
+		let e = P.map((e) => p(T, E, e));
+		return e.some((t) => t !== e[0]) ? b : f(T, E, P[0])?.action_layout;
+	}, [
+		T,
+		E,
+		P,
+		b
+	]), I = m(() => s((F ?? x) || o(N, "list_floatbar"), N, void 0, "list_floatbar"), [
+		F,
+		x,
+		N
+	]), L = m(() => a(A, I, N, void 0, {}, P, d(T, P)), [
+		A,
+		I,
+		N,
+		P,
+		T
+	]);
+	return L.length === 0 ? null : /* @__PURE__ */ g("div", {
+		style: {
+			position: "fixed",
+			left: "50%",
+			bottom: "calc(var(--tabbar-h) + var(--safe-area-bottom) + 14px)",
+			transform: "translateX(-50%)",
+			zIndex: 45,
+			display: "flex",
+			alignItems: "center",
+			flexWrap: "wrap",
+			gap: 8,
+			padding: "6px 10px 6px 14px",
+			maxWidth: "calc(100vw - var(--safe-area-left) - var(--safe-area-right) - 24px)",
+			boxSizing: "border-box",
+			background: "var(--text)",
+			color: "var(--background)",
+			borderRadius: "var(--radius-lg)",
+			boxShadow: "var(--shadow-lg)",
+			animation: "floatbarIn .15s ease-out"
+		},
+		children: [
+			/* @__PURE__ */ h("style", { children: _ }),
+			/* @__PURE__ */ g("span", {
+				style: {
+					fontSize: 12.5,
+					fontWeight: 600
+				},
+				children: [/* @__PURE__ */ h("span", {
+					style: {
+						padding: "1px 7px",
+						borderRadius: "var(--radius-sm)",
+						background: "var(--accent)",
+						color: "var(--accent-foreground)",
+						marginRight: 6,
+						fontSize: 11.5
+					},
+					children: v.length
+				}), e(A, "list.selection.selected", v.length, {
+					one: "selected",
+					other: "selected"
+				})]
+			}),
+			/* @__PURE__ */ h(u, {
+				layout: L,
+				kind: "toolbar",
+				entityActions: N,
+				rowSelection: P,
+				onRun: (e, t) => {
+					let n = l(j, e, t, {}, w);
+					if (n !== null) return M({
+						action: t,
+						title: A(t.display?.name) || e,
+						bulkSelection: P,
+						entity: w,
+						execute: async (e) => {
+							let t = await i(n, r(e, v));
+							return O(), t;
+						}
+					});
+				},
+				widgetContext: k,
+				ariaLabel: A("list.selection.floatbar", "Floating action bar"),
+				constrain: !1
+			}),
+			/* @__PURE__ */ h("button", {
+				onClick: D,
+				style: {
+					background: "none",
+					border: "none",
+					color: "var(--background)",
+					cursor: "pointer",
+					opacity: .6,
+					padding: "4px 6px",
+					borderRadius: "var(--radius-md)"
+				},
+				title: A("list.selection.clear", "Clear selection"),
+				children: /* @__PURE__ */ h(t.x, { size: 14 })
+			})
+		]
+	});
+}
+//#endregion
+export { v as ListFloatbar };

package/dist-lib/components/pages/list/ListFooter.js

@@ -0,0 +1,138 @@
+import { pluralText as e } from "../../../lib/language.js";
+import { Icon as t } from "../../primitives/Icons.js";
+import { IconBtn as n } from "../../primitives/IconBtn.js";
+import { useText as r } from "../../../hooks/useText.js";
+import { Spinner as i } from "../../primitives/Spinner.js";
+import { pageInsetX as a } from "../../../lib/page-inset.js";
+import { useBrandingChrome as o } from "../../../hooks/useBrandingChrome.js";
+import { formatCount as s } from "../../../lib/format-count.js";
+import { PER_PAGE_OPTIONS as c } from "./page-size.js";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/pages/list/ListFooter.tsx
+function f({ meta: f, isCursor: p, isPhone: m, rowsLoaded: h, selectedCount: g, countTotal: _, countStrategy: v, countLoading: y, countError: b, page: x, totalPages: S, goToPage: C, perPage: w, setPerPage: T, hasMorePages: E, fetchNextPage: D, isFetchingNextPage: O }) {
+	let k = o("list"), A = r();
+	return !f && !p ? null : /* @__PURE__ */ d("div", {
+		style: {
+			display: "flex",
+			alignItems: "center",
+			paddingTop: 8,
+			paddingBottom: 8,
+			...m ? a(12) : {
+				paddingLeft: 14,
+				paddingRight: 14
+			},
+			background: "var(--surface-2)",
+			borderTop: "1px solid var(--border)",
+			fontSize: 11.5,
+			color: "var(--text-3)",
+			gap: 12,
+			flexWrap: "wrap"
+		},
+		children: [
+			k.isVisible("show_count") && /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u("span", {
+				className: "num",
+				"data-testid": "list-footer-count",
+				style: {
+					display: "inline-flex",
+					alignItems: "center",
+					gap: 5
+				},
+				children: _ === void 0 ? y && !b ? /* @__PURE__ */ u("span", {
+					"data-testid": "list-footer-count-pending",
+					style: { display: "inline-flex" },
+					children: /* @__PURE__ */ u(i, { size: 11 })
+				}) : e(A, "list.footer.count", h, {
+					one: "{count} record",
+					other: "{count} records"
+				}) : e(A, "list.footer.count_of", _, {
+					one: "{loaded} of {total} record",
+					other: "{loaded} of {total} records"
+				}, {
+					loaded: h,
+					total: s(_, v ?? "exact", A.language)
+				})
+			}), /* @__PURE__ */ u("span", { children: "·" })] }),
+			/* @__PURE__ */ d("span", { children: [
+				A("list.footer.selected", "Selected:"),
+				" ",
+				/* @__PURE__ */ u("span", {
+					className: "num",
+					style: {
+						color: "var(--text-2)",
+						fontWeight: 500
+					},
+					children: g
+				})
+			] }),
+			/* @__PURE__ */ u("div", { style: { flex: m ? "1 1 100%" : 1 } }),
+			!m && /* @__PURE__ */ u("span", { children: A("list.footer.rows_per_page", "Rows per page") }),
+			/* @__PURE__ */ u("select", {
+				"aria-label": A("list.footer.rows_per_page", "Rows per page"),
+				value: w,
+				onChange: (e) => T(parseInt(e.target.value, 10)),
+				style: {
+					fontSize: 11.5,
+					padding: "2px 4px",
+					background: "var(--surface)",
+					border: "1px solid var(--border)",
+					borderRadius: "var(--radius-sm)",
+					color: "var(--text-2)",
+					cursor: "pointer"
+				},
+				children: c.map((e) => /* @__PURE__ */ u("option", {
+					value: e,
+					children: e
+				}, e))
+			}),
+			p ? E && /* @__PURE__ */ d("button", {
+				type: "button",
+				className: "num",
+				"data-testid": "list-footer-load-more",
+				onClick: D,
+				disabled: O,
+				style: {
+					display: "inline-flex",
+					alignItems: "center",
+					gap: 6,
+					padding: "2px 10px",
+					background: "var(--surface)",
+					border: "1px solid var(--border)",
+					borderRadius: "var(--radius-sm)",
+					color: "var(--text-2)",
+					cursor: O ? "default" : "pointer"
+				},
+				children: [O ? /* @__PURE__ */ u(i, { size: 11 }) : null, A("list.footer.load_more", "Load more")]
+			}) : (E || x > 1) && /* @__PURE__ */ d("div", {
+				style: {
+					display: "flex",
+					alignItems: "center",
+					gap: 4
+				},
+				children: [
+					/* @__PURE__ */ u(n, {
+						size: 22,
+						icon: /* @__PURE__ */ u(t.left, { size: 12 }),
+						onClick: () => C(x - 1),
+						disabled: x <= 1
+					}),
+					/* @__PURE__ */ u("span", {
+						className: "num",
+						style: { padding: "0 6px" },
+						children: S === void 0 ? A("list.footer.page", "Page {page}", { page: x }) : A("list.footer.page_of", "Page {page} of {total}", {
+							page: x,
+							total: S
+						})
+					}),
+					/* @__PURE__ */ u(n, {
+						size: 22,
+						icon: /* @__PURE__ */ u(t.right, { size: 12 }),
+						onClick: () => C(x + 1),
+						disabled: S === void 0 ? !E : x >= S
+					})
+				]
+			})
+		]
+	});
+}
+//#endregion
+export { f as ListFooter };

package/dist-lib/components/pages/list/ListHeader.js

@@ -0,0 +1,120 @@
+import { Icon as e } from "../../primitives/Icons.js";
+import { IconBtn as t } from "../../primitives/IconBtn.js";
+import { InfoTooltip as n } from "../../primitives/Tooltip.js";
+import { useText as r } from "../../../hooks/useText.js";
+import { useResponsiveMode as i } from "../../../hooks/useResponsiveMode.js";
+import { buildActionBody as a, executeAction as o } from "../../../api/data.js";
+import { pageInsetX as s } from "../../../lib/page-inset.js";
+import { actionRequiresSelection as c, applyRowState as l, defaultFlatForSlot as u, disableLeavesWhere as d, filterLayoutForSlot as f } from "../../../lib/actions.js";
+import { useActionRunner as p } from "../../actions/ActionRunner.js";
+import { useBrandingChrome as m } from "../../../hooks/useBrandingChrome.js";
+import { useScreenBack as h } from "../../../hooks/useScreenBack.js";
+import { dispatchAction as g } from "../../../lib/action-dispatch.js";
+import { ResponsiveActionBar as _ } from "../../actions/ResponsiveActionBar.js";
+import { useMemo as v } from "react";
+import { jsx as y, jsxs as b } from "react/jsx-runtime";
+//#region src/components/pages/list/ListHeader.tsx
+function x({ title: x, description: S, toolbarActions: C, screenActionLayout: w, entityActionLayout: T, selectedIds: E, data: D, rowKey: O, onActionSuccess: k, widgetContext: A }) {
+	let j = r(), M = r("errors"), { run: N } = p(), { isPhone: P } = i(), F = m("list"), I = F.isVisible("show_title"), L = F.isVisible("show_actions"), R = h(), z = v(() => {
+		let e = {};
+		for (let { code: t, action: n } of C) e[t] = n;
+		return e;
+	}, [C]), B = v(() => f((w ?? T) || u(z, "list_toolbar"), z, void 0, "list_toolbar"), [
+		w,
+		T,
+		z
+	]), V = v(() => d(B, z, void 0, c, j("list.toolbar.select_rows_first", "Select one or more rows first")), [
+		j,
+		B,
+		z
+	]), H = v(() => {
+		if (E.length === 0) return [];
+		let e = /* @__PURE__ */ new Map();
+		for (let t of D) e.set(O(t), t);
+		return E.map((t) => e.get(t)).filter((e) => e !== void 0);
+	}, [
+		E,
+		D,
+		O
+	]), U = v(() => l(j, B, z, void 0, {}, H), [
+		j,
+		B,
+		z,
+		H
+	]), W = E.length > 0 ? U : V, G = (e, t) => {
+		let n = g(M, e, t, {});
+		if (n === null) return;
+		let r = j(t.display?.name) || e;
+		return N({
+			action: t,
+			title: r,
+			bulkSelection: H.length > 0 ? H : void 0,
+			execute: async (e) => {
+				let t = E.length > 0 ? E : void 0, r = await o(n, a(e, t));
+				return t && t.length > 0 && k(), r;
+			}
+		});
+	};
+	return !I && !L ? null : /* @__PURE__ */ b("div", {
+		style: {
+			display: "flex",
+			alignItems: "center",
+			gap: 8,
+			flexWrap: P ? "wrap" : "nowrap",
+			paddingTop: P ? 12 : 16,
+			paddingBottom: 10,
+			...P ? s(12) : {
+				paddingLeft: 20,
+				paddingRight: 20
+			}
+		},
+		children: [
+			I && R.hasOriginBack && /* @__PURE__ */ y(t, {
+				icon: /* @__PURE__ */ y(e.back, { size: 14 }),
+				title: j("list.header.back", "Back"),
+				onClick: R.goBack
+			}),
+			I && /* @__PURE__ */ y("div", {
+				style: {
+					flex: P ? "1 1 100%" : "1 1 auto",
+					minWidth: 0
+				},
+				children: /* @__PURE__ */ b("div", {
+					style: {
+						display: "flex",
+						alignItems: "baseline",
+						gap: 10
+					},
+					children: [/* @__PURE__ */ y("h1", {
+						style: {
+							margin: 0,
+							minWidth: 0,
+							overflow: "hidden",
+							textOverflow: "ellipsis",
+							whiteSpace: "nowrap",
+							fontSize: "var(--page-title-size, var(--page-title-size-list))",
+							lineHeight: "var(--page-title-line-height, var(--page-title-line-height-list))",
+							fontWeight: "var(--page-title-weight)",
+							letterSpacing: "-0.012em",
+							color: "var(--text)"
+						},
+						children: x
+					}), S && /* @__PURE__ */ y(n, {
+						label: S,
+						"data-testid": "list-description-info"
+					})]
+				})
+			}),
+			L && W.length > 0 && /* @__PURE__ */ y(_, {
+				layout: W,
+				kind: "toolbar",
+				entityActions: z,
+				onRun: G,
+				widgetContext: A,
+				ariaLabel: j("list.toolbar.actions", "List toolbar actions")
+			})
+		]
+	});
+}
+//#endregion
+export { x as ListHeader };