themelia-react-ui 2.0.5 → 3.0.0

package/dist/{data-display-BdgCAw8T.js → data-display-CWe9SOYh.js}

@@ -1,51 +1,57 @@
 "use client";
-import { d as e } from "./ui-provider-C-74NVLc.js";
+import { f as e } from "./ui-provider-Bu1S-o96.js";
 import { useStrings as t } from "./lib/strings.js";
-import { t as n } from "./utils-B6kKb8jB.js";
-import { c as r, o as i, s as a } from "./typography-BQnine1k.js";
+import { t as n } from "./utils-BVbAG2J6.js";
+import { c as r, o as i, s as a } from "./typography-C0dELqYV.js";
 import { n as o } from "./text.styles-B64My8RZ.js";
-import { r as s, t as c } from "./structure-DuxKl954.js";
-import { i as l, o as u, r as d, s as f } from "./feedback-Dm4izqFn.js";
-import { n as p } from "./composition.recipes-COdiFhxB.js";
-import { _ as m, m as h } from "./primitives-ByWgGUgt.js";
-import { t as g } from "./badge-xIiV_E7f.js";
-import { t as _ } from "./separator-Ct_WSWTJ.js";
-import { n as v } from "./display-KsZLw9Ov.js";
-import { c as y, n as b, o as x, r as S, t as C, u as w } from "./item-DjCcM18E.js";
-import { forwardRef as T, useId as E } from "react";
-import { Fragment as D, jsx as O, jsxs as k } from "react/jsx-runtime";
-import { Search as A } from "lucide-react";
+import { r as s, t as c } from "./structure-DElaQwwN.js";
+import { t as l } from "./smart-card-C59z6KFO.js";
+import { a as u, c as d, i as f, s as p } from "./feedback-DmqmXKLn.js";
+import { n as m } from "./composition.recipes-COdiFhxB.js";
+import { _ as h, m as g } from "./primitives-BlC1lXBr.js";
+import { t as _ } from "./badge-oGiXblW7.js";
+import { t as v } from "./separator-DaDe26sf.js";
+import { c as y, n as b, o as x, r as S, t as C, u as w } from "./item-GJ9mvCcg.js";
+import { t as T } from "./content-block-hooks-Z3iKjqd1.js";
+import { forwardRef as E, useId as D } from "react";
+import { Fragment as O, jsx as k, jsxs as A } from "react/jsx-runtime";
+import { Search as j } from "lucide-react";
 //#region src/components/blocks/data-display/dense-info-card/helpers.tsx
-function j({ value: e, max: t = 5, label: i }) {
-	return /* @__PURE__ */ k("div", {
+function M({ value: e, max: t = 5, label: i, name: a }) {
+	return /* @__PURE__ */ A("div", {
 		className: n("helpers--component", "flex items-center gap-space-md"),
-		children: [/* @__PURE__ */ O("div", {
+		children: [/* @__PURE__ */ k("div", {
+			role: "meter",
+			"aria-label": a,
+			"aria-valuenow": e,
+			"aria-valuemin": 0,
+			"aria-valuemax": t,
 			className: "flex items-center gap-space-xs",
-			children: Array.from({ length: t }, (t, r) => /* @__PURE__ */ O("div", { className: n("h-1.5 w-3 rounded-full", r < e ? "bg-muted-foreground" : "bg-muted") }, r))
-		}), !!i && /* @__PURE__ */ O(r, {
+			children: Array.from({ length: t }, (t, r) => /* @__PURE__ */ k("div", { className: n("h-1.5 w-3 rounded-full", r < e ? "bg-muted-foreground" : "bg-muted") }, r))
+		}), !!i && /* @__PURE__ */ k(r, {
 			size: "xs",
 			type: "secondary",
 			children: i
 		})]
 	});
 }
-function M({ label: e, value: t, badge: n, badgeTone: i }) {
-	return /* @__PURE__ */ k(c, {
+function N({ label: e, value: t, badge: n, badgeTone: i }) {
+	return /* @__PURE__ */ A(c, {
 		direction: "horizontal",
 		align: "center",
 		justify: "between",
 		gap: "md",
 		children: [
-			/* @__PURE__ */ O(r, {
+			/* @__PURE__ */ k(r, {
 				size: "xs",
 				className: "shrink-0 text-muted-foreground",
 				children: e
 			}),
-			!!n && /* @__PURE__ */ O(g, {
+			!!n && /* @__PURE__ */ k(_, {
 				tone: i ?? "secondary",
 				children: n
 			}),
-			!!t && !n && /* @__PURE__ */ O(r, {
+			!!t && !n && /* @__PURE__ */ k(r, {
 				type: "inherit",
 				weight: "semibold",
 				className: "text-right tabular-nums",
@@ -56,83 +62,87 @@ function M({ label: e, value: t, badge: n, badgeTone: i }) {
 }
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/partials/dense-info-dashboard.tsx
-function N({ title: e, description: t, statusBadges: i, rows: a, secondaryRows: o, scale: s, footerBadges: l, footerText: u, actions: d, className: f }) {
-	return /* @__PURE__ */ O(v, {
+function P({ title: e, description: t, statusBadges: i, rows: a, secondaryRows: o, scale: s, footerBadges: u, footerText: d, actions: f, surface: p = "flat", padding: m = p === "flat" ? "none" : "md", headerDivider: h, className: g }) {
+	return /* @__PURE__ */ k(l, {
+		surface: p,
+		padding: m,
+		headerDivider: h,
 		title: e,
 		description: t,
-		titleSuffix: i.length > 0 ? /* @__PURE__ */ O(c, {
+		titleSuffix: i.length > 0 ? /* @__PURE__ */ k(c, {
 			direction: "horizontal",
 			wrap: !0,
 			align: "center",
 			gap: "sm",
-			children: i.map((e) => /* @__PURE__ */ O(g, {
+			children: i.map((e) => /* @__PURE__ */ k(_, {
 				tone: e.tone,
 				children: e.label
 			}, e.label))
 		}) : void 0,
-		actions: d,
-		className: n("dense-info-dashboard--component", f),
-		children: /* @__PURE__ */ k(c, {
+		actions: f,
+		...T(n("dense-info-dashboard--component", g)),
+		children: /* @__PURE__ */ A(c, {
 			gap: "2xl",
 			children: [
-				/* @__PURE__ */ k(c, {
+				/* @__PURE__ */ A(c, {
 					gap: "md",
-					children: [a.map((e) => /* @__PURE__ */ O(M, { ...e }, e.label)), !!s && /* @__PURE__ */ k("div", {
+					children: [a.map((e) => /* @__PURE__ */ k(N, { ...e }, e.label)), !!s && /* @__PURE__ */ A("div", {
 						className: "flex items-center justify-between",
-						children: [/* @__PURE__ */ O(r, {
+						children: [/* @__PURE__ */ k(r, {
 							size: "xs",
 							className: "text-muted-foreground",
 							children: s.label
-						}), /* @__PURE__ */ O(j, {
+						}), /* @__PURE__ */ k(M, {
+							name: s.label,
 							value: s.value,
 							max: s.max,
 							label: `${String(s.value)}/${String(s.max ?? 5)}`
 						})]
 					})]
 				}),
-				!!o && o.length > 0 && /* @__PURE__ */ O(c, {
+				!!o && o.length > 0 && /* @__PURE__ */ k(c, {
 					gap: "md",
-					children: o.map((e) => /* @__PURE__ */ O(M, { ...e }, e.label))
+					children: o.map((e) => /* @__PURE__ */ k(N, { ...e }, e.label))
 				}),
-				(!!l || !!u) && /* @__PURE__ */ k(c, {
+				(!!u || !!d) && /* @__PURE__ */ A(c, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "md",
-					children: [!!l && l.map((e) => /* @__PURE__ */ O(g, {
+					children: [!!u && u.map((e) => /* @__PURE__ */ k(_, {
 						tone: e.tone,
 						children: e.label
-					}, e.label)), !!u && /* @__PURE__ */ O(r, {
+					}, e.label)), !!d && /* @__PURE__ */ k(r, {
 						size: "xs",
 						className: "text-muted-foreground",
-						children: u
+						children: d
 					})]
 				})
 			]
 		})
 	});
 }
-N.displayName = "DenseInfoDashboard";
+P.displayName = "DenseInfoDashboard";
 //#endregion
 //#region src/components/blocks/data-display/inline-stat/inline-stat.tsx
-function P({ label: e, value: t, layout: r = "between", mono: a = !1, valueWeight: o, className: s, labelClassName: l, valueClassName: u }) {
-	let d = a ? h : m, f = typeof e == "string" || typeof e == "number" ? /* @__PURE__ */ O(i, {
+function F({ label: e, value: t, layout: r = "between", mono: a = !1, valueWeight: o, className: s, labelClassName: l, valueClassName: u }) {
+	let d = a ? g : h, f = typeof e == "string" || typeof e == "number" ? /* @__PURE__ */ k(i, {
 		className: n("text-inherit", l),
 		children: e
-	}) : /* @__PURE__ */ O("span", {
+	}) : /* @__PURE__ */ k("span", {
 		className: l,
 		children: e
-	}), p = /* @__PURE__ */ O(d, {
+	}), p = /* @__PURE__ */ k(d, {
 		type: "inherit",
 		weight: o,
 		className: u,
 		children: t
 	});
-	return r === "stacked" ? /* @__PURE__ */ k(c, {
+	return r === "stacked" ? /* @__PURE__ */ A(c, {
 		gap: "2xs",
 		className: n("inline-stat--component", s),
 		children: [f, p]
-	}) : /* @__PURE__ */ k(c, {
+	}) : /* @__PURE__ */ A(c, {
 		direction: "horizontal",
 		gap: "md",
 		justify: r === "between" ? "between" : "start",
@@ -141,48 +151,51 @@ function P({ label: e, value: t, layout: r = "between", mono: a = !1, valueWeigh
 		children: [f, p]
 	});
 }
-P.displayName = "InlineStat";
+F.displayName = "InlineStat";
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/dense-info.strings.ts
-var F = {
+var I = {
 	total: "Total",
 	tasks: "tasks",
 	priority: "priority"
 };
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/partials/dense-info-classification.tsx
-function I({ title: e, description: i, stats: o, items: l, totalLabel: u, totalValue: d, footerBadges: f, footerText: p, actions: h, className: T, strings: E }) {
-	let A = t(F, E);
-	return /* @__PURE__ */ O(v, {
+function L({ title: e, description: i, stats: o, items: u, totalLabel: d, totalValue: f, footerBadges: p, footerText: m, actions: g, surface: E = "flat", padding: D = E === "flat" ? "none" : "md", headerDivider: j, className: M, strings: N }) {
+	let P = t(I, N);
+	return /* @__PURE__ */ k(l, {
+		surface: E,
+		padding: D,
+		headerDivider: j,
 		title: e,
 		description: i,
-		actions: h,
-		className: n("dense-info-classification--component", T),
-		children: /* @__PURE__ */ k(c, {
+		actions: g,
+		...T(n("dense-info-classification--component", M)),
+		children: /* @__PURE__ */ A(c, {
 			gap: "2xl",
 			children: [
-				/* @__PURE__ */ O(s, {
+				/* @__PURE__ */ k(s, {
 					columns: {
 						base: 2,
 						sm: 3
 					},
 					gap: "xl",
-					children: o.map((e) => /* @__PURE__ */ k(c, {
+					children: o.map((e) => /* @__PURE__ */ A(c, {
 						gap: "dense",
 						className: "min-w-0 items-start",
 						children: [
-							/* @__PURE__ */ O(a, {
-								tag: "h4",
+							/* @__PURE__ */ k(a, {
+								tag: "p",
 								className: "tabular-nums text-inherit",
 								children: e.value
 							}),
-							/* @__PURE__ */ O(r, {
+							/* @__PURE__ */ k(r, {
 								size: "xs",
 								type: "secondary",
 								weight: "medium",
 								children: e.label
 							}),
-							!!e.trendBadge && /* @__PURE__ */ O(g, {
+							!!e.trendBadge && /* @__PURE__ */ k(_, {
 								tone: e.trendTone ?? "secondary",
 								className: "self-start",
 								children: e.trendBadge
@@ -190,168 +203,172 @@ function I({ title: e, description: i, stats: o, items: l, totalLabel: u, totalV
 						]
 					}, e.label))
 				}),
-				/* @__PURE__ */ k(c, {
+				/* @__PURE__ */ A(c, {
 					gap: "md",
-					children: [/* @__PURE__ */ O(x, { children: l.map((e) => /* @__PURE__ */ k(C, {
+					children: [/* @__PURE__ */ k(x, { children: u.map((e) => /* @__PURE__ */ A(C, {
 						size: "sm",
 						role: "listitem",
 						children: [
-							/* @__PURE__ */ O(y, { children: /* @__PURE__ */ O("span", { className: n("h-2 w-2 shrink-0 rounded-full", e.dotColor) }) }),
-							/* @__PURE__ */ O(S, { children: /* @__PURE__ */ k(w, {
+							/* @__PURE__ */ k(y, { children: /* @__PURE__ */ k("span", { className: n("h-2 w-2 shrink-0 rounded-full", e.dotColor) }) }),
+							/* @__PURE__ */ k(S, { children: /* @__PURE__ */ A(w, {
 								bold: !1,
 								className: "gap-space-md",
-								children: [e.label, !!e.badge && /* @__PURE__ */ O(g, {
+								children: [e.label, !!e.badge && /* @__PURE__ */ k(_, {
 									tone: e.badgeTone ?? "secondary",
 									children: e.badge
 								})]
 							}) }),
-							/* @__PURE__ */ O(b, { children: /* @__PURE__ */ O(m, {
+							/* @__PURE__ */ k(b, { children: /* @__PURE__ */ k(h, {
 								type: "inherit",
 								weight: "semibold",
 								className: "tabular-nums",
 								children: e.value
 							}) })
 						]
-					}, e.label)) }), !!d && /* @__PURE__ */ k(D, { children: [/* @__PURE__ */ O(_, {}), /* @__PURE__ */ O(P, {
-						label: /* @__PURE__ */ O(r, {
+					}, e.label)) }), !!f && /* @__PURE__ */ A(O, { children: [/* @__PURE__ */ k(v, {}), /* @__PURE__ */ k(F, {
+						label: /* @__PURE__ */ k(r, {
 							type: "inherit",
 							tag: "span",
 							weight: "bold",
 							lineHeight: "tight",
-							children: u ?? A.total
+							children: d ?? P.total
 						}),
-						value: d,
+						value: f,
 						valueWeight: "bold",
 						valueClassName: "tabular-nums"
 					})] })]
 				}),
-				(!!f || !!p) && /* @__PURE__ */ k(c, {
+				(!!p || !!m) && /* @__PURE__ */ A(c, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "md",
-					children: [!!f && f.map((e) => /* @__PURE__ */ O(g, {
+					children: [!!p && p.map((e) => /* @__PURE__ */ k(_, {
 						tone: e.tone,
 						children: e.label
-					}, e.label)), !!p && /* @__PURE__ */ O(r, {
+					}, e.label)), !!m && /* @__PURE__ */ k(r, {
 						size: "xs",
 						className: "text-muted-foreground",
-						children: p
+						children: m
 					})]
 				})
 			]
 		})
 	});
 }
-I.displayName = "DenseInfoClassification";
+L.displayName = "DenseInfoClassification";
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/partials/dense-info-financial.tsx
-function L({ title: e, description: i, headerBadges: a, lineItems: o, totalLabel: s, totalAmount: l, footerBadges: u, footerText: d, actions: f, className: p, strings: h }) {
-	let y = t(F, h);
-	return /* @__PURE__ */ O(v, {
+function R({ title: e, description: i, headerBadges: a, lineItems: o, totalLabel: s, totalAmount: u, footerBadges: d, footerText: f, actions: p, surface: m = "flat", padding: g = m === "flat" ? "none" : "md", headerDivider: y, className: E, strings: D }) {
+	let j = t(I, D);
+	return /* @__PURE__ */ k(l, {
+		surface: m,
+		padding: g,
+		headerDivider: y,
 		title: e,
 		description: i,
-		titleSuffix: a.length > 0 ? /* @__PURE__ */ O(c, {
+		titleSuffix: a.length > 0 ? /* @__PURE__ */ k(c, {
 			direction: "horizontal",
 			wrap: !0,
 			align: "center",
 			gap: "sm",
-			children: a.map((e) => /* @__PURE__ */ O(g, {
+			children: a.map((e) => /* @__PURE__ */ k(_, {
 				tone: e.tone,
 				children: e.label
 			}, e.label))
 		}) : void 0,
-		actions: f,
-		className: n("dense-info-financial--component", p),
-		children: /* @__PURE__ */ k(c, {
+		actions: p,
+		...T(n("dense-info-financial--component", E)),
+		children: /* @__PURE__ */ A(c, {
 			gap: "2xl",
-			children: [/* @__PURE__ */ k(c, {
+			children: [/* @__PURE__ */ A(c, {
 				gap: "md",
-				children: [/* @__PURE__ */ O(x, { children: o.map((e) => /* @__PURE__ */ k(C, {
+				children: [/* @__PURE__ */ k(x, { children: o.map((e) => /* @__PURE__ */ A(C, {
 					size: "sm",
 					role: "listitem",
-					children: [/* @__PURE__ */ O(S, { children: /* @__PURE__ */ k(w, {
+					children: [/* @__PURE__ */ k(S, { children: /* @__PURE__ */ A(w, {
 						className: "gap-space-md",
-						children: [e.label, !!e.badge && /* @__PURE__ */ O(g, {
+						children: [e.label, !!e.badge && /* @__PURE__ */ k(_, {
 							tone: e.badgeTone ?? "secondary",
 							children: e.badge
 						})]
-					}) }), /* @__PURE__ */ O(b, { children: /* @__PURE__ */ O(m, {
+					}) }), /* @__PURE__ */ k(b, { children: /* @__PURE__ */ k(h, {
 						type: "inherit",
 						weight: "semibold",
 						className: "tabular-nums",
 						children: e.amount
 					}) })]
-				}, e.label)) }), !!l && /* @__PURE__ */ k(D, { children: [/* @__PURE__ */ O(_, {}), /* @__PURE__ */ O(P, {
-					label: /* @__PURE__ */ O(r, {
+				}, e.label)) }), !!u && /* @__PURE__ */ A(O, { children: [/* @__PURE__ */ k(v, {}), /* @__PURE__ */ k(F, {
+					label: /* @__PURE__ */ k(r, {
 						type: "inherit",
 						tag: "span",
 						weight: "semibold",
 						lineHeight: "tight",
-						children: s ?? y.total
+						children: s ?? j.total
 					}),
-					value: l,
+					value: u,
 					valueWeight: "semibold",
 					valueClassName: "tabular-nums"
 				})] })]
-			}), (!!u || !!d) && /* @__PURE__ */ k(c, {
+			}), (!!d || !!f) && /* @__PURE__ */ A(c, {
 				direction: "horizontal",
 				wrap: !0,
 				align: "center",
 				gap: "md",
-				children: [!!u && u.map((e) => /* @__PURE__ */ O(g, {
+				children: [!!d && d.map((e) => /* @__PURE__ */ k(_, {
 					tone: e.tone,
 					children: e.label
-				}, e.label)), !!d && /* @__PURE__ */ O(r, {
+				}, e.label)), !!f && /* @__PURE__ */ k(r, {
 					size: "xs",
 					className: "text-muted-foreground",
-					children: d
+					children: f
 				})]
 			})]
 		})
 	});
 }
-L.displayName = "DenseInfoFinancial";
+R.displayName = "DenseInfoFinancial";
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/partials/dense-info-project.tsx
-function R({ title: e, description: i, statusLabel: a, statusTone: o, metaPairs: s, date: l, priority: u, completedTasks: d, totalTasks: f, actions: p, className: m, strings: h }) {
-	let _ = t(F, h), y = f > 0 ? Math.round(d / f * 100) : 0, b = 2 * Math.PI * 7, x = b - y / 100 * b;
-	return /* @__PURE__ */ O(v, {
-		padding: "md",
+function z({ title: e, description: i, statusLabel: a, statusTone: o, metaPairs: s, date: u, priority: d, completedTasks: f, totalTasks: p, actions: m, surface: h = "flat", padding: g, headerDivider: v, className: y, strings: b }) {
+	let x = t(I, b), S = p > 0 ? Math.round(f / p * 100) : 0, C = 2 * Math.PI * 7, w = C - S / 100 * C;
+	return /* @__PURE__ */ k(l, {
+		surface: h,
+		padding: g ?? (h === "flat" ? "none" : "md"),
+		headerDivider: v,
 		title: e,
-		titleSuffix: /* @__PURE__ */ O(g, {
+		titleSuffix: /* @__PURE__ */ k(_, {
 			tone: o,
 			dot: !0,
 			children: a
 		}),
-		description: i ? /* @__PURE__ */ O("span", {
+		description: i ? /* @__PURE__ */ k("span", {
 			className: "line-clamp-2",
 			children: i
 		}) : void 0,
-		actions: p,
-		className: n("dense-info-project-card--component", m),
-		contentClassName: "flex-1 justify-end",
-		children: /* @__PURE__ */ k(c, {
+		actions: m,
+		...T(n("dense-info-project-card--component", y), { content: "flex-1 justify-end" }, g),
+		children: /* @__PURE__ */ A(c, {
 			gap: "lg",
 			children: [
-				!!s && s.length > 0 && /* @__PURE__ */ O(c, {
+				!!s && s.length > 0 && /* @__PURE__ */ k(c, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "sm",
-					children: s.map((e, t) => /* @__PURE__ */ k("span", {
+					children: s.map((e, t) => /* @__PURE__ */ A("span", {
 						className: "flex items-center gap-space-xs",
 						children: [
-							t > 0 && /* @__PURE__ */ O(r, {
+							t > 0 && /* @__PURE__ */ k(r, {
 								tag: "span",
 								type: "discrete",
 								children: "•"
 							}),
-							!!e.icon && /* @__PURE__ */ O("span", {
+							!!e.icon && /* @__PURE__ */ k("span", {
 								className: "text-muted-foreground",
 								children: e.icon
 							}),
-							/* @__PURE__ */ O(r, {
+							/* @__PURE__ */ k(r, {
 								size: "xs",
 								type: "secondary",
 								children: e.label
@@ -359,34 +376,30 @@ function R({ title: e, description: i, statusLabel: a, statusTone: o, metaPairs:
 						]
 					}, e.label))
 				}),
-				(!!l || !!u) && /* @__PURE__ */ k(c, {
+				(!!u || !!d) && /* @__PURE__ */ A(c, {
 					direction: "horizontal",
 					align: "center",
 					justify: "between",
 					gap: "md",
-					children: [!!l && /* @__PURE__ */ O(r, {
+					children: [!!u && /* @__PURE__ */ k(r, {
 						size: "xs",
 						type: "secondary",
-						children: l
-					}), !!u && /* @__PURE__ */ k(r, {
+						children: u
+					}), !!d && /* @__PURE__ */ k(r, {
 						size: "xs",
 						type: "secondary",
-						children: [
-							u,
-							" ",
-							_.priority
-						]
+						children: x.formatPriority?.(d) ?? `${d} ${x.priority}`
 					})]
 				}),
-				/* @__PURE__ */ k("div", {
+				/* @__PURE__ */ A("div", {
 					className: "flex items-center gap-space-md",
-					children: [/* @__PURE__ */ k("svg", {
+					children: [/* @__PURE__ */ A("svg", {
 						width: "20",
 						height: "20",
 						viewBox: "0 0 20 20",
 						className: "shrink-0",
 						"aria-hidden": "true",
-						children: [/* @__PURE__ */ O("circle", {
+						children: [/* @__PURE__ */ k("circle", {
 							cx: "10",
 							cy: "10",
 							r: "7",
@@ -394,15 +407,15 @@ function R({ title: e, description: i, statusLabel: a, statusTone: o, metaPairs:
 							stroke: "currentColor",
 							strokeWidth: "2",
 							className: "stroke-border"
-						}), /* @__PURE__ */ O("circle", {
+						}), /* @__PURE__ */ k("circle", {
 							cx: "10",
 							cy: "10",
 							r: "7",
 							fill: "none",
 							stroke: "currentColor",
 							strokeWidth: "2",
-							strokeDasharray: b,
-							strokeDashoffset: x,
+							strokeDasharray: C,
+							strokeDashoffset: w,
 							strokeLinecap: "round",
 							className: "text-primary-accent",
 							transform: "rotate(-90 10 10)"
@@ -411,60 +424,63 @@ function R({ title: e, description: i, statusLabel: a, statusTone: o, metaPairs:
 						type: "inherit",
 						size: "xs",
 						weight: "medium",
-						children: [
-							d,
-							"/",
-							f,
-							" ",
-							_.tasks
-						]
+						children: x.formatTasks?.(f, p) ?? `${f}/${p} ${x.tasks}`
 					})]
 				})
 			]
 		})
 	});
 }
-R.displayName = "DenseInfoProjectCard";
+z.displayName = "DenseInfoProjectCard";
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/partials/dense-info-score.tsx
-function z({ title: e, description: t, statusBadges: i, score: o, scoreLevel: s, scoreFilled: l, scoreTotal: u = 10, rows: d, footerBadges: f, actions: p, className: m }) {
-	let h = s === "good" ? "bg-success" : s === "medium" ? "bg-warning" : "bg-destructive";
-	return /* @__PURE__ */ O(v, {
+function B({ title: e, description: t, statusBadges: i, score: o, scoreLevel: s, scoreFilled: u, scoreTotal: d = 10, rows: f, footerBadges: p, actions: m, surface: h = "flat", padding: g = h === "flat" ? "none" : "md", headerDivider: v, className: y }) {
+	let b = s === "good" ? "bg-success" : s === "medium" ? "bg-warning" : "bg-destructive";
+	return /* @__PURE__ */ k(l, {
+		surface: h,
+		padding: g,
+		headerDivider: v,
 		title: e,
 		description: t,
-		titleSuffix: i.length > 0 ? /* @__PURE__ */ O(c, {
+		titleSuffix: i.length > 0 ? /* @__PURE__ */ k(c, {
 			direction: "horizontal",
 			wrap: !0,
 			align: "center",
 			gap: "sm",
-			children: i.map((e) => /* @__PURE__ */ O(g, {
+			children: i.map((e) => /* @__PURE__ */ k(_, {
 				tone: e.tone,
 				children: e.label
 			}, e.label))
 		}) : void 0,
-		actions: p,
-		className: n("dense-info-score-card--component", m),
-		children: /* @__PURE__ */ k(c, {
+		actions: m,
+		...T(n("dense-info-score-card--component", y)),
+		children: /* @__PURE__ */ A(c, {
 			gap: "2xl",
 			children: [
-				/* @__PURE__ */ k(c, {
+				/* @__PURE__ */ A(c, {
 					gap: "md",
-					children: [/* @__PURE__ */ O(a, {
-						tag: "h2",
+					children: [/* @__PURE__ */ k(a, {
+						tag: "p",
 						size: "2xl",
 						className: "tabular-nums text-inherit",
 						children: String(o)
-					}), /* @__PURE__ */ O(c, {
+					}), /* @__PURE__ */ k(c, {
 						direction: "horizontal",
 						align: "center",
 						gap: "xs",
-						children: Array.from({ length: u }, (e, t) => /* @__PURE__ */ O("div", { className: n("h-5 w-2 rounded-radius-sm", t < l ? h : "bg-muted") }, t))
+						role: "meter",
+						"aria-label": e,
+						"aria-valuenow": u,
+						"aria-valuemin": 0,
+						"aria-valuemax": d,
+						className: "dense-info-score-card--meter",
+						children: Array.from({ length: d }, (e, t) => /* @__PURE__ */ k("div", { className: n("h-5 w-2 rounded-radius-sm", t < u ? b : "bg-muted") }, t))
 					})]
 				}),
-				/* @__PURE__ */ O(c, {
+				/* @__PURE__ */ k(c, {
 					gap: "md",
-					children: d.map((e) => /* @__PURE__ */ O(P, {
-						label: /* @__PURE__ */ O(r, {
+					children: f.map((e) => /* @__PURE__ */ k(F, {
+						label: /* @__PURE__ */ k(r, {
 							tag: "span",
 							size: "xs",
 							type: "secondary",
@@ -477,12 +493,12 @@ function z({ title: e, description: t, statusBadges: i, score: o, scoreLevel: s,
 						valueClassName: "text-end tabular-nums"
 					}, e.label))
 				}),
-				!!f && f.length > 0 && /* @__PURE__ */ O(c, {
+				!!p && p.length > 0 && /* @__PURE__ */ k(c, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "md",
-					children: f.map((e) => /* @__PURE__ */ O(g, {
+					children: p.map((e) => /* @__PURE__ */ k(_, {
 						tone: e.tone,
 						children: e.label
 					}, e.label))
@@ -491,17 +507,13 @@ function z({ title: e, description: t, statusBadges: i, score: o, scoreLevel: s,
 		})
 	});
 }
-z.displayName = "DenseInfoScoreCard";
+B.displayName = "DenseInfoScoreCard";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/empty-state.strings.ts
-var B = {
+var V = {
 	title: "Nothing here yet",
 	description: "Once data lands, it will show up in this view.",
 	ariaLabel: "Empty state"
-}, V = {
-	sm: "!p-surface-xs",
-	md: "!p-surface",
-	lg: "!p-surface-lg"
 }, H = {
 	none: "default",
 	icon: "icon",
@@ -512,52 +524,54 @@ var B = {
 	icon: void 0,
 	"icon-soft": "bg-muted/50 text-muted-foreground",
 	illustration: "mb-space-xl"
-}, W = T(function({ title: i, description: o, media: s, mediaVariant: m = "none", renderMedia: h, actions: g, footer: _, padding: v, border: y = !1, className: b, strings: x, ariaLabel: S }, C) {
-	let w = t(B, x), { defaultScale: T } = e(), E = v ?? T ?? "md", D = i ?? w.title, A = o === !1 ? null : o ?? w.description, j = h ? h({ mediaVariant: m }) : s, M = !!j;
-	return /* @__PURE__ */ k(d, {
-		ref: C,
+}, W = E(function({ title: i, headingTag: o = "h3", description: s, media: l, mediaVariant: h = "none", renderMedia: g, actions: _, footer: v, padding: y, surface: b = "plain", border: x = !1, className: S, strings: C, ariaLabel: w }, T) {
+	let E = t(V, C), { defaultScale: D } = e(), O = y ?? D ?? "md", j = i ?? E.title, M = s === !1 ? null : s ?? E.description, N = g ? g({ mediaVariant: h }) : l, P = !!N;
+	return /* @__PURE__ */ A(f, {
+		ref: T,
 		role: "status",
-		"aria-label": S ?? w.ariaLabel,
-		className: n("empty-state--component", V[E], y ? "border-border border border-dashed" : "border-border border-0", b),
-		children: [/* @__PURE__ */ k(u, {
+		"aria-label": w ?? E.ariaLabel,
+		padding: O,
+		surface: b,
+		className: n("empty-state--component", x ? "border-border border border-dashed" : b === "plain" && "border-border border-0", S),
+		children: [/* @__PURE__ */ A(p, {
 			className: "empty-state--header",
 			children: [
-				!!M && /* @__PURE__ */ O(f, {
-					variant: H[m],
-					className: n("empty-state--media", U[m]),
-					children: j
+				!!P && /* @__PURE__ */ k(d, {
+					variant: H[h],
+					className: n("empty-state--media", U[h]),
+					children: N
 				}),
-				/* @__PURE__ */ O(a, {
-					tag: "h3",
+				/* @__PURE__ */ k(a, {
+					tag: o,
 					align: "center",
 					className: "empty-state--title border-0 pb-0 text-inherit",
 					"data-slot": "empty-title",
-					children: D
+					children: j
 				}),
-				!!A && /* @__PURE__ */ O(r, {
+				!!M && /* @__PURE__ */ k(r, {
 					type: "secondary",
 					align: "center",
 					lineHeight: "relaxed",
 					className: "empty-state--description [&>a]:text-primary-accent [&>a]:underline [&>a]:underline-offset-4 hover:[&>a]:no-underline",
 					"data-slot": "empty-description",
-					children: A
+					children: M
 				})
 			]
-		}), (!!g || !!_) && /* @__PURE__ */ k(l, {
+		}), (!!_ || !!v) && /* @__PURE__ */ A(u, {
 			className: "empty-state--content",
-			children: [!!g && /* @__PURE__ */ O(c, {
+			children: [!!_ && /* @__PURE__ */ k(c, {
 				direction: "horizontal",
-				gap: p.commands,
+				gap: m.commands,
 				justify: "center",
 				className: "empty-state--actions",
-				children: g
-			}), !!_ && /* @__PURE__ */ O(r, {
+				children: _
+			}), !!v && /* @__PURE__ */ k(r, {
 				tag: "div",
 				size: "xs",
 				type: "secondary",
 				align: "center",
 				className: "empty-state--footer",
-				children: _
+				children: v
 			})]
 		})]
 	});
@@ -566,17 +580,17 @@ W.displayName = "EmptyState";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/partials/illustrations/document-stack.tsx
 function G({ className: e }) {
-	return /* @__PURE__ */ O("div", {
+	return /* @__PURE__ */ k("div", {
 		className: n("document-stack-illustration--component relative h-24 w-32", e),
 		"aria-hidden": "true",
-		children: /* @__PURE__ */ k("svg", {
+		children: /* @__PURE__ */ A("svg", {
 			viewBox: "0 0 128 96",
 			className: "h-full w-full overflow-visible",
 			focusable: "false",
-			children: [/* @__PURE__ */ k("g", {
+			children: [/* @__PURE__ */ A("g", {
 				transform: "rotate(-6 44 44)",
 				children: [
-					/* @__PURE__ */ O("rect", {
+					/* @__PURE__ */ k("rect", {
 						x: 4.5,
 						y: 4.5,
 						width: 79,
@@ -584,7 +598,7 @@ function G({ className: e }) {
 						style: { rx: "var(--radius-md)" },
 						className: "fill-muted/70 dark:fill-muted/40 stroke-border/50 drop-shadow-xs"
 					}),
-					/* @__PURE__ */ O("rect", {
+					/* @__PURE__ */ k("rect", {
 						x: 13,
 						y: 13,
 						width: 48,
@@ -592,7 +606,7 @@ function G({ className: e }) {
 						rx: 4,
 						className: "fill-muted"
 					}),
-					/* @__PURE__ */ O("rect", {
+					/* @__PURE__ */ k("rect", {
 						x: 13,
 						y: 27,
 						width: 40,
@@ -600,7 +614,7 @@ function G({ className: e }) {
 						rx: 3,
 						className: "fill-muted/60"
 					}),
-					/* @__PURE__ */ O("rect", {
+					/* @__PURE__ */ k("rect", {
 						x: 13,
 						y: 39,
 						width: 36,
@@ -609,10 +623,10 @@ function G({ className: e }) {
 						className: "fill-muted/60"
 					})
 				]
-			}), /* @__PURE__ */ k("g", {
+			}), /* @__PURE__ */ A("g", {
 				transform: "rotate(3 84 48)",
 				children: [
-					/* @__PURE__ */ O("rect", {
+					/* @__PURE__ */ k("rect", {
 						x: 44.5,
 						y: 8.5,
 						width: 79,
@@ -620,7 +634,7 @@ function G({ className: e }) {
 						style: { rx: "var(--radius-md)" },
 						className: "fill-background stroke-border drop-shadow-xs"
 					}),
-					/* @__PURE__ */ O("rect", {
+					/* @__PURE__ */ k("rect", {
 						x: 53,
 						y: 17,
 						width: 48,
@@ -628,7 +642,7 @@ function G({ className: e }) {
 						rx: 4,
 						className: "fill-muted"
 					}),
-					/* @__PURE__ */ O("rect", {
+					/* @__PURE__ */ k("rect", {
 						x: 53,
 						y: 31,
 						width: 40,
@@ -636,7 +650,7 @@ function G({ className: e }) {
 						rx: 3,
 						className: "fill-muted/60"
 					}),
-					/* @__PURE__ */ O("rect", {
+					/* @__PURE__ */ k("rect", {
 						x: 53,
 						y: 43,
 						width: 36,
@@ -644,13 +658,13 @@ function G({ className: e }) {
 						rx: 3,
 						className: "fill-muted/60"
 					}),
-					/* @__PURE__ */ O("circle", {
+					/* @__PURE__ */ k("circle", {
 						cx: 56,
 						cy: 76,
 						r: 3,
 						className: "fill-success"
 					}),
-					/* @__PURE__ */ O("rect", {
+					/* @__PURE__ */ k("rect", {
 						x: 63,
 						y: 73,
 						width: 32,
@@ -667,18 +681,18 @@ G.displayName = "DocumentStackIllustration";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/partials/illustrations/inbox-clean.tsx
 function K({ className: e }) {
-	let t = E();
-	return /* @__PURE__ */ O("div", {
+	let t = D();
+	return /* @__PURE__ */ k("div", {
 		className: n("inbox-clean-illustration--component relative h-24 w-32", e),
 		"aria-hidden": "true",
-		children: /* @__PURE__ */ k("svg", {
+		children: /* @__PURE__ */ A("svg", {
 			viewBox: "0 0 128 96",
 			className: "h-full w-full overflow-visible",
 			focusable: "false",
 			children: [
-				/* @__PURE__ */ O("defs", { children: /* @__PURE__ */ O("clipPath", {
+				/* @__PURE__ */ k("defs", { children: /* @__PURE__ */ k("clipPath", {
 					id: t,
-					children: /* @__PURE__ */ O("rect", {
+					children: /* @__PURE__ */ k("rect", {
 						x: .5,
 						y: 40.5,
 						width: 127,
@@ -686,13 +700,13 @@ function K({ className: e }) {
 						style: { rx: "var(--radius)" }
 					})
 				}) }),
-				/* @__PURE__ */ O("circle", {
+				/* @__PURE__ */ k("circle", {
 					cx: 64,
 					cy: 16,
 					r: 15.5,
 					className: "fill-success/12 stroke-success/30"
 				}),
-				/* @__PURE__ */ O("path", {
+				/* @__PURE__ */ k("path", {
 					d: "M59 16l3 3 7-7",
 					fill: "none",
 					className: "stroke-success",
@@ -700,7 +714,7 @@ function K({ className: e }) {
 					strokeLinecap: "round",
 					strokeLinejoin: "round"
 				}),
-				/* @__PURE__ */ O("rect", {
+				/* @__PURE__ */ k("rect", {
 					x: .5,
 					y: 40.5,
 					width: 127,
@@ -708,17 +722,17 @@ function K({ className: e }) {
 					style: { rx: "var(--radius)" },
 					className: "fill-background drop-shadow-xs"
 				}),
-				/* @__PURE__ */ k("g", {
+				/* @__PURE__ */ A("g", {
 					clipPath: `url(#${t})`,
 					children: [
-						/* @__PURE__ */ O("rect", {
+						/* @__PURE__ */ k("rect", {
 							x: 1,
 							y: 41,
 							width: 126,
 							height: 12,
 							className: "fill-muted/30"
 						}),
-						/* @__PURE__ */ O("rect", {
+						/* @__PURE__ */ k("rect", {
 							x: 13,
 							y: 66,
 							width: 48,
@@ -726,7 +740,7 @@ function K({ className: e }) {
 							rx: 3,
 							className: "fill-muted/60"
 						}),
-						/* @__PURE__ */ O("rect", {
+						/* @__PURE__ */ k("rect", {
 							x: 13,
 							y: 76,
 							width: 32,
@@ -734,7 +748,7 @@ function K({ className: e }) {
 							rx: 3,
 							className: "fill-muted/40"
 						}),
-						/* @__PURE__ */ O("circle", {
+						/* @__PURE__ */ k("circle", {
 							cx: 109,
 							cy: 74,
 							r: 6,
@@ -742,7 +756,7 @@ function K({ className: e }) {
 						})
 					]
 				}),
-				/* @__PURE__ */ O("rect", {
+				/* @__PURE__ */ k("rect", {
 					x: .5,
 					y: 40.5,
 					width: 127,
@@ -759,48 +773,48 @@ K.displayName = "InboxCleanIllustration";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/partials/illustrations/search-glass.tsx
 function q({ className: e }) {
-	return /* @__PURE__ */ O("div", {
+	return /* @__PURE__ */ k("div", {
 		className: n("search-glass-illustration--component", "flex size-20 items-center justify-center rounded-full bg-muted/50 ring-8 ring-muted/30", e),
 		"aria-hidden": "true",
-		children: /* @__PURE__ */ O(A, { className: "size-8 text-muted-foreground" })
+		children: /* @__PURE__ */ k(j, { className: "size-8 text-muted-foreground" })
 	});
 }
 q.displayName = "SearchGlassIllustration";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/partials/illustrations/stacked-cards.tsx
 function J({ className: e }) {
-	let t = E();
-	return /* @__PURE__ */ O("div", {
+	let t = D();
+	return /* @__PURE__ */ k("div", {
 		className: n("stacked-cards-illustration--component relative h-24 w-52", e),
 		"aria-hidden": "true",
-		children: /* @__PURE__ */ k("svg", {
+		children: /* @__PURE__ */ A("svg", {
 			viewBox: "0 0 208 96",
 			className: "h-full w-full overflow-visible",
 			focusable: "false",
 			children: [
-				/* @__PURE__ */ O("defs", { children: /* @__PURE__ */ k("linearGradient", {
+				/* @__PURE__ */ k("defs", { children: /* @__PURE__ */ A("linearGradient", {
 					id: t,
 					x1: "0",
 					y1: "0",
 					x2: "0",
 					y2: "1",
 					children: [
-						/* @__PURE__ */ O("stop", {
+						/* @__PURE__ */ k("stop", {
 							stopColor: "var(--background)",
 							stopOpacity: 0
 						}),
-						/* @__PURE__ */ O("stop", {
+						/* @__PURE__ */ k("stop", {
 							offset: "0.5",
 							stopColor: "var(--background)",
 							stopOpacity: .6
 						}),
-						/* @__PURE__ */ O("stop", {
+						/* @__PURE__ */ k("stop", {
 							offset: "1",
 							stopColor: "var(--background)"
 						})
 					]
 				}) }),
-				/* @__PURE__ */ O("rect", {
+				/* @__PURE__ */ k("rect", {
 					x: 24.5,
 					y: .5,
 					width: 159,
@@ -808,7 +822,7 @@ function J({ className: e }) {
 					style: { rx: "var(--radius)" },
 					className: "fill-muted/60 dark:fill-muted/30 stroke-border/50"
 				}),
-				/* @__PURE__ */ O("rect", {
+				/* @__PURE__ */ k("rect", {
 					x: 12.5,
 					y: 12.5,
 					width: 183,
@@ -816,7 +830,7 @@ function J({ className: e }) {
 					style: { rx: "var(--radius)" },
 					className: "fill-muted/80 dark:fill-muted/50 stroke-border/60"
 				}),
-				/* @__PURE__ */ O("rect", {
+				/* @__PURE__ */ k("rect", {
 					x: .5,
 					y: 24.5,
 					width: 207,
@@ -824,7 +838,7 @@ function J({ className: e }) {
 					style: { rx: "var(--radius)" },
 					className: "fill-background stroke-border drop-shadow-xs"
 				}),
-				/* @__PURE__ */ O("rect", {
+				/* @__PURE__ */ k("rect", {
 					x: 17,
 					y: 40,
 					width: 32,
@@ -832,7 +846,7 @@ function J({ className: e }) {
 					rx: 4,
 					className: "fill-muted"
 				}),
-				/* @__PURE__ */ O("rect", {
+				/* @__PURE__ */ k("rect", {
 					x: 61,
 					y: 44,
 					width: 97.5,
@@ -840,7 +854,7 @@ function J({ className: e }) {
 					rx: 4,
 					className: "fill-muted"
 				}),
-				/* @__PURE__ */ O("rect", {
+				/* @__PURE__ */ k("rect", {
 					x: 61,
 					y: 60,
 					width: 65,
@@ -848,7 +862,7 @@ function J({ className: e }) {
 					rx: 4,
 					className: "fill-muted/60"
 				}),
-				/* @__PURE__ */ O("rect", {
+				/* @__PURE__ */ k("rect", {
 					y: 64,
 					width: 208,
 					height: 32,
@@ -862,13 +876,13 @@ J.displayName = "StackedCardsIllustration";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/partials/illustrations/users-circle.tsx
 function Y({ className: e }) {
-	return /* @__PURE__ */ k("div", {
+	return /* @__PURE__ */ A("div", {
 		className: n("users-circle-illustration--component relative flex h-24 w-32 items-center justify-center", e),
 		"aria-hidden": "true",
 		children: [
-			/* @__PURE__ */ O("div", { className: "bg-muted/50 border-border absolute left-2 size-12 rounded-full border-2" }),
-			/* @__PURE__ */ O("div", { className: "bg-muted border-border z-10 size-14 rounded-full border-2 shadow-sm" }),
-			/* @__PURE__ */ O("div", { className: "bg-muted/50 border-border absolute right-2 size-10 rounded-full border-2" })
+			/* @__PURE__ */ k("div", { className: "bg-muted/50 border-border absolute left-2 size-12 rounded-full border-2" }),
+			/* @__PURE__ */ k("div", { className: "bg-muted border-border z-10 size-14 rounded-full border-2 shadow-sm" }),
+			/* @__PURE__ */ k("div", { className: "bg-muted/50 border-border absolute right-2 size-10 rounded-full border-2" })
 		]
 	});
 }
@@ -876,42 +890,42 @@ Y.displayName = "UsersCircleIllustration";
 //#endregion
 //#region src/components/blocks/data-display/relationship-card-frame.tsx
 function X(e) {
-	return e ? typeof e == "object" && !Array.isArray(e) && "label" in e ? /* @__PURE__ */ O(g, {
+	return e ? typeof e == "object" && !Array.isArray(e) && "label" in e ? /* @__PURE__ */ k(_, {
 		inline: !0,
 		tone: e.tone ?? "secondary",
 		size: e.size,
 		children: e.label
 	}) : e : null;
 }
-var Z = T(function({ icon: e, title: t, titleBadge: i, alertSlot: a, metadataSlot: s, primaryActionSlot: l, overflowActionSlot: u, selectorSlot: d, detailsSlot: f, className: p, headerClassName: m, bodyClassName: h, ...g }, _) {
+var Z = E(function({ icon: e, title: t, titleBadge: i, alertSlot: a, metadataSlot: s, primaryActionSlot: l, overflowActionSlot: u, selectorSlot: d, detailsSlot: f, className: p, headerClassName: m, bodyClassName: h, ...g }, _) {
 	let v = !!a || !!s || !!l || !!d || !!f;
-	return /* @__PURE__ */ k(c, {
+	return /* @__PURE__ */ A(c, {
 		ref: _,
 		className: n("relationship-card-frame--component", p),
 		...g,
-		children: [/* @__PURE__ */ k(c, {
+		children: [/* @__PURE__ */ A(c, {
 			direction: "horizontal",
 			gap: "md",
 			align: "start",
 			justify: "between",
 			wrap: !1,
 			className: n("relationship-card-frame--header", m),
-			children: [/* @__PURE__ */ k(c, {
+			children: [/* @__PURE__ */ A(c, {
 				direction: "horizontal",
 				gap: "md",
 				align: "start",
 				wrap: !1,
 				className: "relationship-card-frame--header-start",
-				children: [!!e && /* @__PURE__ */ O("div", {
+				children: [!!e && /* @__PURE__ */ k("div", {
 					className: "relationship-card-frame--icon mt-space-2xs inline-flex shrink-0 items-center text-muted-foreground",
 					children: e
-				}), /* @__PURE__ */ O("div", {
+				}), /* @__PURE__ */ k("div", {
 					className: "min-w-0",
-					children: /* @__PURE__ */ k(c, {
+					children: /* @__PURE__ */ A(c, {
 						direction: "horizontal",
 						gap: "sm",
 						className: "relationship-card-frame--title-row",
-						children: [/* @__PURE__ */ O(r, {
+						children: [/* @__PURE__ */ k(r, {
 							type: "inherit",
 							tag: "div",
 							size: o.subject,
@@ -919,36 +933,36 @@ var Z = T(function({ icon: e, title: t, titleBadge: i, alertSlot: a, metadataSlo
 							lineHeight: "tight",
 							className: "relationship-card-frame--title truncate",
 							children: t
-						}), !!i && /* @__PURE__ */ O("span", {
+						}), !!i && /* @__PURE__ */ k("span", {
 							className: "relationship-card-frame--title-badge inline-flex",
 							children: X(i)
 						})]
 					})
 				})]
-			}), !!u && /* @__PURE__ */ O("div", {
+			}), !!u && /* @__PURE__ */ k("div", {
 				className: "relationship-card-frame--overflow shrink-0",
 				children: u
 			})]
-		}), !!v && /* @__PURE__ */ k(c, {
+		}), !!v && /* @__PURE__ */ A(c, {
 			className: n("relationship-card-frame--body", h),
 			children: [
-				!!a && /* @__PURE__ */ O("div", {
+				!!a && /* @__PURE__ */ k("div", {
 					className: "relationship-card-frame--alert",
 					children: a
 				}),
-				!!d && /* @__PURE__ */ O("div", {
+				!!d && /* @__PURE__ */ k("div", {
 					className: "relationship-card-frame--selector",
 					children: d
 				}),
-				!!s && /* @__PURE__ */ O("div", {
+				!!s && /* @__PURE__ */ k("div", {
 					className: "relationship-card-frame--metadata",
 					children: s
 				}),
-				!!l && /* @__PURE__ */ O("div", {
+				!!l && /* @__PURE__ */ k("div", {
 					className: "relationship-card-frame--primary-action",
 					children: l
 				}),
-				!!f && /* @__PURE__ */ O("div", {
+				!!f && /* @__PURE__ */ k("div", {
 					className: "relationship-card-frame--details",
 					children: f
 				})
@@ -958,6 +972,6 @@ var Z = T(function({ icon: e, title: t, titleBadge: i, alertSlot: a, metadataSlo
 });
 Z.displayName = "RelationshipCardFrame";
 //#endregion
-export { K as a, B as c, L as d, I as f, N as h, q as i, z as l, P as m, Y as n, G as o, F as p, J as r, W as s, Z as t, R as u };
+export { K as a, V as c, R as d, L as f, P as h, q as i, B as l, F as m, Y as n, G as o, I as p, J as r, W as s, Z as t, z as u };
 
-//# sourceMappingURL=data-display-BdgCAw8T.js.map
+//# sourceMappingURL=data-display-CWe9SOYh.js.map