@declarion/react 0.65.1 → 0.66.0

package/dist-lib/components/actions/ResponsiveActionBar.js

@@ -0,0 +1,773 @@
+import { Icon as e } from "../primitives/Icons.js";
+import { Btn as t } from "../primitives/Btn.js";
+import { IconBtn as n } from "../primitives/IconBtn.js";
+import { Dropdown as r } from "../primitives/Dropdown.js";
+import { useText as i } from "../../hooks/useText.js";
+import { MenuItem as a } from "../primitives/MenuItem.js";
+import { Spinner as o } from "../primitives/Spinner.js";
+import { DynamicIcon as s } from "../shared/DynamicIcon.js";
+import { actionTooltip as c, isNavDefaultCode as l, rowDetailId as u } from "../../lib/actions.js";
+import { Fragment as d, useCallback as f, useEffect as p, useLayoutEffect as m, useMemo as h, useRef as g, useState as _ } from "react";
+import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
+//#region src/components/actions/ResponsiveActionBar.tsx
+function x(e, t) {
+	return e.replace(/\$\{([^}]+)\}/g, (e, n) => Object.prototype.hasOwnProperty.call(t, n) ? t[n] : e);
+}
+function S(e) {
+	return e.widget ? "widget" : e.href ? "href" : e.handler ? "handler" : e.association ? "association" : e.ui_steps && e.ui_steps.length > 0 ? "ui_steps" : "unknown";
+}
+function C(e, t, n, r, i) {
+	let a = S(t), o = u(n, r?.entity), s = r?.entityCode ?? "";
+	if (e === "__peek") return i?.({
+		code: e,
+		entity: s,
+		mode: "peek",
+		rowId: o
+	}), r?.openPeek?.(n), !0;
+	if (i?.({
+		code: e,
+		entity: s,
+		mode: a,
+		rowId: o
+	}), a === "widget") return console.warn(`[ResponsiveActionBar] widget "${t.widget}" requested for action "${e}" but the SDK has no widget registry yet; falling back to onRun.`), !1;
+	if (a === "href" && r) {
+		let n = e === "__open" || e === "__edit" ? r.recordHref?.(o) : null, i = n ? e === "__edit" ? `${n}?edit=true` : n : x(t.href ?? "", {
+			entity: s,
+			id: encodeURIComponent(o)
+		}), a = i.indexOf("?");
+		return a === -1 ? r.tabNavigate(i) : r.tabNavigate(i.slice(0, a), { search: i.slice(a + 1) }), !0;
+	}
+	return a === "handler" || a === "association" || a === "ui_steps" || a === "unknown" && console.warn(`[ResponsiveActionBar] no dispatch mode set on action "${e}" (none of handler/association/widget/href/ui_steps).`), !1;
+}
+function w(e) {
+	let t = 0;
+	for (let n of e) n.kind === "action" ? t++ : t += w(n.items);
+	return t;
+}
+function T(e, t, n) {
+	let r = [], i = [];
+	for (let a of e) a.kind === "action" && D(a.code, t, n)?.destructive ? i.push(a) : r.push(a);
+	return {
+		normal: r,
+		destructive: i
+	};
+}
+function E(e, t, n) {
+	let r = [], i = [], a = [];
+	for (let o of e) {
+		if (o.kind !== "action") {
+			i.push(o);
+			continue;
+		}
+		let e = D(o.code, t, n), s = e?.destructive === !0, c = e?.display?.primary === !0;
+		s && c ? (console.warn(`[ResponsiveActionBar] action "${o.code}" declares both primary and destructive; treating as destructive.`), a.push(o)) : s ? a.push(o) : c ? r.push(o) : i.push(o);
+	}
+	return {
+		primary: r,
+		regular: i,
+		destructive: a
+	};
+}
+function D(e, t, n) {
+	if (t && e in t) return t[e];
+	if (n && e in n) return n[e];
+}
+function O(e, t, n, r) {
+	return e(D(t, n, r)?.display?.name) || t;
+}
+function k(e, t, n) {
+	return D(e, t, n)?.display?.icon || void 0;
+}
+function A(e) {
+	return `action-tooltip-${e}`;
+}
+function j({ leaf: e, entityActions: n, globalActions: r, onRun: a, loading: l, onLoadingChange: u, measureRef: d, style: p, row: m, widgetContext: h, onActionClick: g, iconOnly: _ = !1 }) {
+	let x = i(), S = D(e.code, n, r), w = O(x, e.code, n, r), T = k(e.code, n, r), E = S?.destructive ?? !1, j = !E && S?.display?.primary === !0, M = !e.enabled, N = M ? A(e.code) : void 0, P = f(async () => {
+		if (!(!S || M || l)) {
+			u(!0);
+			try {
+				C(e.code, S, m, h, g) || await Promise.resolve(a(e.code, S));
+			} finally {
+				u(!1);
+			}
+		}
+	}, [
+		S,
+		M,
+		l,
+		a,
+		e.code,
+		u,
+		m,
+		h,
+		g
+	]), F = l ? /* @__PURE__ */ y(o, { size: 12 }) : T ? /* @__PURE__ */ y(s, {
+		name: T,
+		size: 12
+	}) : null;
+	return /* @__PURE__ */ b(v, { children: [N && e.reason && /* @__PURE__ */ y("span", {
+		id: N,
+		role: "tooltip",
+		style: {
+			position: "absolute",
+			width: 1,
+			height: 1,
+			overflow: "hidden",
+			clip: "rect(0,0,0,0)"
+		},
+		children: e.reason
+	}), /* @__PURE__ */ y(t, {
+		ref: d,
+		kind: j ? "primary" : "default",
+		danger: E,
+		icon: F,
+		disabled: M || l,
+		"aria-disabled": M ? "true" : void 0,
+		"aria-describedby": N,
+		"aria-label": _ ? w : void 0,
+		title: c(x, S, w, M, e.reason, _),
+		onClick: P,
+		style: p,
+		children: _ ? null : w
+	})] });
+}
+function M({ group: n, entityActions: a, globalActions: c, onRun: l, loading: u, onLoadingChange: d, measureRef: p, style: m, row: h, widgetContext: x, onActionClick: S }) {
+	let C = i(), w = g(null), [T, E] = _(!1), D = n.name ? C(n.name) : C("action.menu.title", "Actions"), O = f((e) => {
+		w.current = e, p?.(e);
+	}, [p]), k = f((e, t) => (E(!1), l(e, t)), [l]);
+	return /* @__PURE__ */ b(v, { children: [/* @__PURE__ */ y(t, {
+		ref: O,
+		kind: "default",
+		icon: u == null ? n.icon ? /* @__PURE__ */ y(s, {
+			name: n.icon,
+			size: 12
+		}) : void 0 : /* @__PURE__ */ y(o, { size: 12 }),
+		iconRight: /* @__PURE__ */ y(e.down, { size: 10 }),
+		"aria-haspopup": "menu",
+		"aria-expanded": T ? "true" : "false",
+		title: D,
+		onClick: () => E((e) => !e),
+		style: m,
+		children: D
+	}), /* @__PURE__ */ y(r, {
+		open: T,
+		anchor: w.current,
+		onClose: () => E(!1),
+		align: "start",
+		width: 200,
+		children: /* @__PURE__ */ y("div", {
+			role: "menu",
+			"aria-label": D,
+			children: n.items.map((e) => e.kind === "action" ? /* @__PURE__ */ y(N, {
+				leaf: e,
+				entityActions: a,
+				globalActions: c,
+				onRun: k,
+				loading: u === e.code,
+				onLoadingChange: (t) => d(t ? e.code : null),
+				row: h,
+				widgetContext: x,
+				onActionClick: S
+			}, e.code) : /* @__PURE__ */ y(P, {
+				group: e,
+				entityActions: a,
+				globalActions: c,
+				onRun: k,
+				loading: u,
+				onLoadingChange: d,
+				row: h,
+				widgetContext: x,
+				onActionClick: S
+			}, e.items[0]?.kind === "action" ? e.items[0].code : e.icon ?? "group"))
+		})
+	})] });
+}
+function N({ leaf: e, entityActions: t, globalActions: n, onRun: r, loading: a, onLoadingChange: l, row: u, widgetContext: d, onActionClick: f }) {
+	let p = i(), m = D(e.code, t, n), h = O(p, e.code, t, n), g = k(e.code, t, n), _ = m?.destructive ?? !1, x = !e.enabled, S = x ? A(e.code) : void 0, w = a ? /* @__PURE__ */ y(o, { size: 12 }) : g ? /* @__PURE__ */ y(s, {
+		name: g,
+		size: 12
+	}) : null;
+	return /* @__PURE__ */ b(v, { children: [S && e.reason && /* @__PURE__ */ y("span", {
+		id: S,
+		role: "tooltip",
+		style: {
+			position: "absolute",
+			width: 1,
+			height: 1,
+			overflow: "hidden",
+			clip: "rect(0,0,0,0)"
+		},
+		children: e.reason
+	}), /* @__PURE__ */ b("div", {
+		role: "menuitem",
+		"aria-disabled": x ? "true" : void 0,
+		"aria-describedby": S,
+		title: c(p, m, h, x, e.reason),
+		onClick: async () => {
+			if (!(!m || x || a)) {
+				l(!0);
+				try {
+					C(e.code, m, u, d, f) || await Promise.resolve(r(e.code, m));
+				} finally {
+					l(!1);
+				}
+			}
+		},
+		style: {
+			display: "flex",
+			alignItems: "center",
+			gap: 8,
+			padding: "6px 10px",
+			borderRadius: "var(--radius-sm)",
+			fontSize: 12.5,
+			color: _ ? "var(--danger)" : x ? "var(--text-3)" : "var(--text-2)",
+			cursor: x ? "not-allowed" : "pointer",
+			opacity: x ? .6 : 1
+		},
+		onMouseEnter: (e) => {
+			x || (e.currentTarget.style.background = "var(--surface-3)");
+		},
+		onMouseLeave: (e) => {
+			e.currentTarget.style.background = "transparent";
+		},
+		children: [w && /* @__PURE__ */ y("span", {
+			style: {
+				color: _ ? "var(--danger)" : "var(--text-3)",
+				display: "flex"
+			},
+			children: w
+		}), /* @__PURE__ */ y("span", {
+			style: { flex: 1 },
+			children: h
+		})]
+	})] });
+}
+function P({ group: e, entityActions: t, globalActions: n, onRun: r, loading: a, onLoadingChange: o, row: s, widgetContext: c, onActionClick: l }) {
+	let u = i(), d = e.name ? u(e.name) : void 0;
+	return /* @__PURE__ */ b(v, { children: [d && /* @__PURE__ */ y("div", {
+		style: {
+			padding: "4px 10px 2px",
+			fontSize: 10.5,
+			fontWeight: 600,
+			color: "var(--text-3)",
+			textTransform: "uppercase",
+			letterSpacing: "0.05em"
+		},
+		children: d
+	}), e.items.map((e) => e.kind === "action" ? /* @__PURE__ */ y(N, {
+		leaf: e,
+		entityActions: t,
+		globalActions: n,
+		onRun: r,
+		loading: a === e.code,
+		onLoadingChange: (t) => o(t ? e.code : null),
+		row: s,
+		widgetContext: c,
+		onActionClick: l
+	}, e.code) : /* @__PURE__ */ y(P, {
+		group: e,
+		entityActions: t,
+		globalActions: n,
+		onRun: r,
+		loading: a,
+		onLoadingChange: o,
+		row: s,
+		widgetContext: c,
+		onActionClick: l
+	}, e.icon ?? "nested"))] });
+}
+function F({ layout: t, entityActions: a, globalActions: s, onRun: c, row: l, widgetContext: u, onActionClick: d }) {
+	let p = i(), m = g(null), [h, v] = _(!1), [x, S] = _(null), C = f((e, t) => (v(!1), c(e, t)), [c]);
+	return w(t) === 0 ? null : /* @__PURE__ */ b("div", {
+		"data-open": h ? "true" : void 0,
+		style: {
+			display: "inline-flex",
+			alignItems: "center"
+		},
+		children: [/* @__PURE__ */ y(n, {
+			ref: m,
+			icon: y(x == null ? e.more : o, { size: 14 }),
+			title: p("action.menu.title", "Actions"),
+			size: 28,
+			onClick: () => v((e) => !e)
+		}), /* @__PURE__ */ y(r, {
+			open: h,
+			anchor: m.current,
+			onClose: () => v(!1),
+			align: "end",
+			width: 220,
+			children: /* @__PURE__ */ y(L, {
+				layout: t,
+				entityActions: a,
+				globalActions: s,
+				onRun: C,
+				loading: x,
+				onLoadingChange: S,
+				row: l,
+				widgetContext: u,
+				onActionClick: d
+			})
+		})]
+	});
+}
+function I(e) {
+	let t = 0;
+	for (let n of e) if (n.kind === "action" && l(n.code)) t++;
+	else break;
+	return t;
+}
+function L({ layout: e, entityActions: t, globalActions: n, onRun: r, loading: o, onLoadingChange: s, row: c, widgetContext: l, onActionClick: u, ariaLabel: d }) {
+	let f = i(), { normal: p, destructive: m } = T(e, t, n), h = I(p), g = p.slice(0, h), _ = p.slice(h), v = m.length > 0, x = _.length > 0, S = (e) => /* @__PURE__ */ y(N, {
+		leaf: e,
+		entityActions: t,
+		globalActions: n,
+		onRun: r,
+		loading: o === e.code,
+		onLoadingChange: (t) => s(t ? e.code : null),
+		row: c,
+		widgetContext: l,
+		onActionClick: u
+	}, e.code);
+	return /* @__PURE__ */ b("div", {
+		role: "menu",
+		"aria-label": d ?? f("action.menu.row_actions", "Row actions"),
+		children: [
+			g.map((e) => e.kind === "action" ? S(e) : null),
+			g.length > 0 && x && /* @__PURE__ */ y(a, { divider: !0 }),
+			_.map((e) => e.kind === "action" ? S(e) : /* @__PURE__ */ y(P, {
+				group: e,
+				entityActions: t,
+				globalActions: n,
+				onRun: r,
+				loading: o,
+				onLoadingChange: s,
+				row: c,
+				widgetContext: l,
+				onActionClick: u
+			}, e.icon ?? "group")),
+			v && /* @__PURE__ */ y(a, { divider: !0 }),
+			m.map((e) => S(e))
+		]
+	});
+}
+var R = "__overflow_trigger__", z = 90, ee = 4, B = 8;
+function te(e) {
+	return `icon:${J(e)}`;
+}
+function ne() {
+	return B;
+}
+function V(e, t, n) {
+	return [
+		...e,
+		...t,
+		...n
+	];
+}
+var H = () => {}, U = () => Promise.resolve();
+function W(e) {
+	return (t) => {
+		t && (t.setAttribute("data-node-key", e), t.setAttribute("tabindex", "-1"));
+	};
+}
+function re(e, t) {
+	if (e.size !== t.size) return !1;
+	for (let [n, r] of t) if (e.get(n) !== r) return !1;
+	return !0;
+}
+function G(e, t) {
+	return t.get(J(e)) ?? 0;
+}
+function K(e, t) {
+	return t.get(te(e));
+}
+function q(e, t, n, r, i, a, o, s, c) {
+	let { primary: l, regular: u, destructive: d } = E(e, i, a), f = ee, p = r.get(R) ?? z, m = t - n, h = V(l, u, d), g = /* @__PURE__ */ new Set(), _ = /* @__PURE__ */ new Set();
+	if (o) for (let e of h) o(e) && g.add(J(e));
+	else {
+		let e = (e, t) => t ? K(e, r) ?? G(e, r) : G(e, r), t = (e) => s ? e.filter((e) => !s.has(J(e))).length * ne() : 0, n = (e, t) => c ? e.slice(0, t).filter((e) => c.has(J(e))).length * ne() : 0, i = (r, i) => {
+			let a = r.length < h.length ? p + f : 0, o = r.length > 1 ? (r.length - 1) * f : 0;
+			return r.reduce((t, n, r) => t + e(n, r >= i), 0) + o + a + t(r) + n(r, i) <= m;
+		}, a = 0, o = !1;
+		for (let e = h.length; e >= 1 && a === 0; e--) i(h.slice(0, e), 1) ? a = e : i(h.slice(0, e), 0) && (a = e, o = !0);
+		let l = o ? 0 : Math.min(1, a), u = h.slice(0, a);
+		for (; l < a && i(u, l + 1);) l++;
+		u.forEach((e, t) => {
+			let n = J(e);
+			g.add(n), t >= l && _.add(n);
+		});
+	}
+	let v = (e) => g.has(J(e)), y = [
+		...l,
+		...u,
+		...d
+	].filter((e) => !v(e));
+	return {
+		primaryInline: l.filter(v),
+		inline: u.filter(v),
+		overflow: y,
+		destructiveInline: d.filter(v),
+		iconOnly: _
+	};
+}
+function J(e) {
+	return e.kind === "action" ? `action:${e.code}` : `group:${JSON.stringify(e.name ?? {})}`;
+}
+function ie(e) {
+	let t = e.parentElement;
+	for (; t && getComputedStyle(t).display === "contents";) t = t.parentElement;
+	if (!t) return !1;
+	let n = getComputedStyle(t);
+	return !(parseFloat(n.flexGrow) > 0 || n.display === "block" || n.display === "flow-root" || n.width !== "auto" || n.maxWidth !== "none");
+}
+function Y({ layout: n, entityActions: o, globalActions: s, onRun: c, reservedRightWidth: l = 0, measurementOverride: u, ariaLabel: x, align: S = "trailing", constrain: C = !0, row: E, widgetContext: D, onActionClick: O }) {
+	let A = i(), F = g(null), I = g(null), [L, z] = _(0), [B, ne] = _(/* @__PURE__ */ new Map()), [V, G] = _(!1), [K, Y] = _(null), [X, ae] = _(() => typeof document < "u" && document.documentElement.dir === "rtl");
+	p(() => {
+		if (typeof MutationObserver > "u") return;
+		let e = new MutationObserver((e) => {
+			for (let t of e) t.attributeName === "dir" && ae(document.documentElement.dir === "rtl"), t.attributeName === "lang" && G(!1);
+		});
+		return e.observe(document.documentElement, {
+			attributes: !0,
+			attributeFilter: ["dir", "lang"]
+		}), () => e.disconnect();
+	}, []);
+	let oe = g(null), [se, ce] = _(!1), le = f((e, t) => (ce(!1), c(e, t)), [c]), ue = w(n), Z = !!u, Q = f(() => {
+		if (Z || !I.current) return;
+		let e = Array.from(I.current.children), t = /* @__PURE__ */ new Map();
+		e.forEach((e) => {
+			let n = e.dataset.nodeKey;
+			n && t.set(n, e.getBoundingClientRect().width || e.offsetWidth);
+		}), ne((e) => re(e, t) ? e : t), G(!0);
+	}, [Z]), de = h(() => JSON.stringify(n.map((e) => J(e))), [n]);
+	p(() => {
+		if (Z) return;
+		let e = I.current;
+		if (!e || typeof ResizeObserver > "u") return;
+		let t = new ResizeObserver(() => Q());
+		t.observe(e);
+		for (let n of Array.from(e.children)) t.observe(n);
+		return () => t.disconnect();
+	}, [
+		Q,
+		Z,
+		de
+	]), m(() => {
+		if (Z) {
+			G(!0);
+			return;
+		}
+		G(!1);
+		let e = requestAnimationFrame(() => {
+			Q();
+		});
+		return () => cancelAnimationFrame(e);
+	}, [
+		de,
+		Q,
+		Z
+	]), p(() => {
+		if (Z || V) return;
+		let e = setTimeout(() => {
+			Q(), G(!0);
+		}, 16);
+		return () => clearTimeout(e);
+	}, [
+		V,
+		Q,
+		Z
+	]), p(() => {
+		if (Z || !C || !V || L === 0) return;
+		let e = F.current;
+		if (!e || !ie(e)) return;
+		let t = [...e.children].filter((e) => e.getAttribute("aria-hidden") !== "true"), n = t.length > 1 ? (t.length - 1) * 4 : 0, r = t.reduce((e, t) => e + t.getBoundingClientRect().width, 0) + n;
+		r > 0 && Math.abs(L - r) < 1 && console.error(`[declarion] ResponsiveActionBar is measuring itself: its container is ${Math.round(L)}px, exactly the width of what it just rendered. The slot holding this bar is sized by its own content, so it cannot tell the bar how much room there is. Give that slot \`flex: 1 1 auto; min-width: 0\` (and justify its content to the edge the buttons sit on), or pass \`constrain={false}\` if it genuinely has no row to take space from.`);
+	}, [
+		Z,
+		C,
+		V,
+		L,
+		B
+	]), p(() => {
+		if (Z) return;
+		let e = F.current;
+		if (!e) return;
+		if (typeof ResizeObserver > "u") {
+			z(e.getBoundingClientRect().width);
+			return;
+		}
+		let t = new ResizeObserver((e) => {
+			let t = e[0];
+			t && z(t.contentRect.width);
+		});
+		return t.observe(e), z(e.getBoundingClientRect().width), () => t.disconnect();
+	}, [Z]);
+	let fe = g(void 0), pe = g(void 0);
+	p(() => {
+		fe.current = void 0, pe.current = void 0;
+	}, [de]);
+	let $ = h(() => Z || !C ? q(n, 2 ** 53 - 1, l, B, o, s, u) : V ? L === 0 ? q(n, 2 ** 53 - 1, l, B, o, s, u) : q(n, L, l, B, o, s, u, fe.current, pe.current) : {
+		primaryInline: [],
+		inline: [],
+		overflow: [],
+		destructiveInline: [],
+		iconOnly: /* @__PURE__ */ new Set()
+	}, [
+		Z,
+		C,
+		V,
+		L,
+		n,
+		l,
+		B,
+		o,
+		s,
+		u
+	]);
+	if (p(() => {
+		(V || Z) && (fe.current = new Set([
+			...$.primaryInline,
+			...$.inline,
+			...$.destructiveInline
+		].map(J)), pe.current = new Set($.iconOnly));
+	}, [
+		$,
+		V,
+		Z
+	]), ue === 0) return null;
+	let me = $.overflow.length > 0, { normal: he, destructive: ge } = T($.overflow, o, s);
+	return /* @__PURE__ */ b("div", {
+		ref: F,
+		role: "toolbar",
+		"aria-label": x ?? A("action.menu.title", "Actions"),
+		style: {
+			display: "flex",
+			flexDirection: X ? "row-reverse" : "row",
+			alignItems: "center",
+			gap: ee,
+			flexWrap: "wrap",
+			visibility: V || Z ? "visible" : "hidden",
+			position: "relative",
+			flex: C ? "1 1 auto" : "0 1 auto",
+			justifyContent: S === "trailing" ? "flex-end" : "flex-start",
+			minWidth: 0,
+			boxSizing: "border-box"
+		},
+		children: [
+			/* @__PURE__ */ b("div", {
+				ref: I,
+				"aria-hidden": "true",
+				inert: !0,
+				style: {
+					position: "absolute",
+					visibility: "hidden",
+					pointerEvents: "none",
+					display: "flex",
+					gap: 4,
+					top: 0,
+					left: 0,
+					width: "max-content",
+					flexWrap: "nowrap"
+				},
+				children: [/* @__PURE__ */ y(t, {
+					"data-node-key": R,
+					iconRight: /* @__PURE__ */ y(e.down, { size: 10 }),
+					tabIndex: -1,
+					children: A("action.menu.title", "Actions")
+				}, R), n.map((e) => {
+					let t = J(e);
+					return e.kind === "action" ? /* @__PURE__ */ b(d, { children: [/* @__PURE__ */ y(j, {
+						leaf: e,
+						entityActions: o,
+						globalActions: s,
+						onRun: U,
+						loading: !1,
+						onLoadingChange: H,
+						row: E,
+						widgetContext: D,
+						measureRef: W(t)
+					}), k(e.code, o, s) && /* @__PURE__ */ y(j, {
+						leaf: e,
+						entityActions: o,
+						globalActions: s,
+						onRun: U,
+						loading: !1,
+						onLoadingChange: H,
+						row: E,
+						widgetContext: D,
+						iconOnly: !0,
+						measureRef: W(te(e))
+					})] }, t) : /* @__PURE__ */ y(M, {
+						group: e,
+						entityActions: o,
+						globalActions: s,
+						onRun: U,
+						loading: null,
+						onLoadingChange: H,
+						row: E,
+						widgetContext: D,
+						onActionClick: O,
+						measureRef: W(t)
+					}, t);
+				})]
+			}),
+			$.primaryInline.map((e) => /* @__PURE__ */ y(j, {
+				leaf: e,
+				entityActions: o,
+				globalActions: s,
+				onRun: c,
+				loading: K === e.code,
+				onLoadingChange: (t) => Y(t ? e.code : null),
+				row: E,
+				widgetContext: D,
+				onActionClick: O,
+				iconOnly: $.iconOnly.has(J(e))
+			}, J(e))),
+			$.inline.map((e) => {
+				let t = J(e);
+				return e.kind === "action" ? /* @__PURE__ */ y(j, {
+					leaf: e,
+					entityActions: o,
+					globalActions: s,
+					onRun: c,
+					loading: K === e.code,
+					onLoadingChange: (t) => Y(t ? e.code : null),
+					row: E,
+					widgetContext: D,
+					onActionClick: O,
+					iconOnly: $.iconOnly.has(t)
+				}, t) : /* @__PURE__ */ y(M, {
+					group: e,
+					entityActions: o,
+					globalActions: s,
+					onRun: c,
+					loading: K,
+					onLoadingChange: Y,
+					row: E,
+					widgetContext: D,
+					onActionClick: O
+				}, t);
+			}),
+			me && /* @__PURE__ */ b(v, { children: [/* @__PURE__ */ y(t, {
+				ref: oe,
+				kind: "default",
+				iconRight: /* @__PURE__ */ y(e.down, { size: 10 }),
+				"aria-haspopup": "menu",
+				"aria-expanded": se ? "true" : "false",
+				onClick: () => ce((e) => !e),
+				children: A("action.menu.title", "Actions")
+			}), /* @__PURE__ */ y(r, {
+				open: se,
+				anchor: oe.current,
+				onClose: () => ce(!1),
+				align: X ? "start" : "end",
+				width: 220,
+				children: /* @__PURE__ */ y("div", {
+					role: "menu",
+					"aria-label": A("action.menu.more", "More actions"),
+					children: [
+						...he,
+						...ge.length > 0 ? [null] : [],
+						...ge
+					].map((e, t) => e === null ? /* @__PURE__ */ y(a, { divider: !0 }, "destructive-divider") : e.kind === "action" ? /* @__PURE__ */ y(N, {
+						leaf: e,
+						entityActions: o,
+						globalActions: s,
+						onRun: le,
+						loading: K === e.code,
+						onLoadingChange: (t) => Y(t ? e.code : null),
+						row: E,
+						widgetContext: D,
+						onActionClick: O
+					}, e.code) : /* @__PURE__ */ y(P, {
+						group: e,
+						entityActions: o,
+						globalActions: s,
+						onRun: le,
+						loading: K,
+						onLoadingChange: Y,
+						row: E,
+						widgetContext: D,
+						onActionClick: O
+					}, `${J(e)}-${t}`))
+				})
+			})] }),
+			$.destructiveInline.map((e) => /* @__PURE__ */ y(j, {
+				leaf: e,
+				entityActions: o,
+				globalActions: s,
+				onRun: c,
+				loading: K === e.code,
+				onLoadingChange: (t) => Y(t ? e.code : null),
+				row: E,
+				widgetContext: D,
+				onActionClick: O,
+				iconOnly: $.iconOnly.has(J(e))
+			}, J(e)))
+		]
+	});
+}
+function X({ layout: e, rowSelection: t = [], ...n }) {
+	let r = t.length > 0;
+	return /* @__PURE__ */ b("div", {
+		style: {
+			position: "relative",
+			display: "flex",
+			flex: "1 1 auto",
+			minWidth: 0
+		},
+		children: [/* @__PURE__ */ y("div", {
+			"aria-hidden": r ? "true" : void 0,
+			style: {
+				display: r ? "none" : "flex",
+				flex: "1 1 auto",
+				minWidth: 0
+			},
+			children: /* @__PURE__ */ y(Y, {
+				layout: e,
+				rowSelection: [],
+				...n
+			})
+		}), /* @__PURE__ */ y("div", {
+			"aria-hidden": r ? void 0 : "true",
+			style: {
+				display: r ? "flex" : "none",
+				flex: "1 1 auto",
+				minWidth: 0
+			},
+			children: /* @__PURE__ */ y(Y, {
+				layout: e,
+				rowSelection: t,
+				...n
+			})
+		})]
+	});
+}
+function ae({ layout: e, row: t, rowSelection: n, onRun: r, reservedRightWidth: i = 0, kind: a = "toolbar", align: o = "trailing", constrain: s = !0, measurementOverride: c, entityActions: l, globalActions: u, ariaLabel: d, widgetContext: f, onActionClick: p }) {
+	let m = w(e);
+	return a === "row" ? /* @__PURE__ */ y(F, {
+		layout: e,
+		entityActions: l,
+		globalActions: u,
+		onRun: r,
+		row: t,
+		widgetContext: f,
+		onActionClick: p
+	}) : m === 0 ? null : y(a === "toolbar" ? X : Y, {
+		layout: e,
+		row: t,
+		rowSelection: n,
+		onRun: r,
+		reservedRightWidth: i,
+		measurementOverride: c,
+		entityActions: l,
+		globalActions: u,
+		ariaLabel: d,
+		align: o,
+		constrain: s,
+		widgetContext: f,
+		onActionClick: p
+	});
+}
+//#endregion
+export { ae as ResponsiveActionBar, L as RowMenuContent, q as computeLayout, x as interpolate, ie as slotIsContentSized };