themelia-react-ui 1.0.0 → 1.0.2

package/dist/{data-display-b3d1TfL4.js → data-display-Bihs9Ven.js}

@@ -1,50 +1,53 @@
 "use client";
-import { s as e } from "./ui-provider-CftIB6TY.js";
+import { s as e } from "./ui-provider-DRPn3qNl.js";
 import { useStrings as t } from "./lib/strings.js";
-import { t as n } from "./utils-C2EKeIw3.js";
-import { l as r, n as i, o as a, s as o } from "./buttons-Co6GavvM.js";
-import { a as s, i as c, r as l } from "./typography-Cv8MT-82.js";
-import { r as u, t as d } from "./structure-BvW4vG4H.js";
-import { f, l as p, p as m, u as h } from "./feedback-a9j9J-9A.js";
-import { _ as g, c as _, l as v, m as y, o as b, p as x, s as S } from "./primitives-DKPOGVpj.js";
-import { r as C } from "./number-BNT_BIzJ.js";
-import { a as w, r as T, t as E } from "./date-BFNMnrS5.js";
-import { t as D } from "./badge-BZXZT9wd.js";
-import { t as O } from "./separator-Gk_WXH-l.js";
-import { n as k } from "./display-ByI5tkqy.js";
-import { c as ee, l as te, n as A, o as j, r as ne, t as re, u as M } from "./item-pJ0GsOiJ.js";
-import N, { forwardRef as ie } from "react";
+import { t as n } from "./utils-BvH9PSmq.js";
+import { a as r, i, r as a } from "./typography-BxQgiZyw.js";
+import { a as o, c as s, o as c } from "./button-BZDasD04.js";
+import { r as l, t as u } from "./structure-CRdqVawd.js";
+import { i as d, o as f, r as p, s as m } from "./feedback-CJkUAapr.js";
+import { _ as h, c as g, l as _, m as v, o as y, p as b, s as x } from "./primitives-C7ff0QaI.js";
+import { r as S } from "./number-DasMFWEG.js";
+import { a as C, r as w, t as T } from "./date-DOKhJPu7.js";
+import { t as E } from "./badge-CzId1Wlm.js";
+import { t as D } from "./separator-BNIgG3au.js";
+import { t as O } from "./field-affordance-recipes-uKY4MsZ_.js";
+import { n as k } from "./display-CS6Hbk18.js";
+import { c as ee, l as te, n as A, o as j, r as ne, t as re, u as M } from "./item-DE4YnuJx.js";
+import N, { forwardRef as ie, useId as ae } from "react";
 import { Fragment as P, jsx as F, jsxs as I } from "react/jsx-runtime";
-import { BarChart3 as ae, Calendar as oe, FolderOpen as se, Info as ce, Search as le } from "lucide-react";
+import { BarChart3 as oe, Calendar as se, FolderOpen as ce, Info as le, Search as ue } from "lucide-react";
 //#region src/components/blocks/data-display/dense-info-card/helpers.tsx
-function ue({ value: e, max: t = 5, label: r }) {
+function de({ value: e, max: t = 5, label: i }) {
 	return /* @__PURE__ */ I("div", {
-		className: n("helpers--component", "flex items-center gap-space-xs"),
-		children: [Array.from({ length: t }, (t, r) => /* @__PURE__ */ F("div", { className: n("h-1.5 w-3 rounded-full", r < e ? "bg-foreground/60" : "bg-muted") }, r)), !!r && /* @__PURE__ */ F(s, {
+		className: n("helpers--component", "flex items-center gap-space-md"),
+		children: [/* @__PURE__ */ F("div", {
+			className: "flex items-center gap-space-xs",
+			children: Array.from({ length: t }, (t, r) => /* @__PURE__ */ F("div", { className: n("h-1.5 w-3 rounded-full", r < e ? "bg-foreground/60" : "bg-muted") }, r))
+		}), !!i && /* @__PURE__ */ F(r, {
 			size: "xs",
 			type: "secondary",
-			className: "ml-1",
-			children: r
+			children: i
 		})]
 	});
 }
-function L({ label: e, value: t, badge: n, badgeTone: r }) {
-	return /* @__PURE__ */ I(d, {
+function L({ label: e, value: t, badge: n, badgeTone: i }) {
+	return /* @__PURE__ */ I(u, {
 		direction: "horizontal",
 		align: "center",
 		justify: "between",
 		gap: "md",
 		children: [
-			/* @__PURE__ */ F(s, {
+			/* @__PURE__ */ F(r, {
 				size: "xs",
 				className: "shrink-0 text-muted-foreground",
 				children: e
 			}),
-			!!n && /* @__PURE__ */ F(D, {
-				tone: r ?? "secondary",
+			!!n && /* @__PURE__ */ F(E, {
+				tone: i ?? "secondary",
 				children: n
 			}),
-			!!t && !n && /* @__PURE__ */ F(s, {
+			!!t && !n && /* @__PURE__ */ F(r, {
 				weight: "semibold",
 				className: "text-right tabular-nums",
 				children: t
@@ -54,55 +57,55 @@ function L({ label: e, value: t, badge: n, badgeTone: r }) {
 }
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/partials/dense-info-dashboard.tsx
-function R({ title: e, description: t, statusBadges: r, rows: i, secondaryRows: a, scale: o, footerBadges: c, footerText: l, actions: u, className: f }) {
+function R({ title: e, description: t, statusBadges: i, rows: a, secondaryRows: o, scale: s, footerBadges: c, footerText: l, actions: d, className: f }) {
 	return /* @__PURE__ */ F(k, {
 		title: e,
 		description: t,
-		actions: u,
+		actions: d,
 		className: n("dense-info-dashboard--component", f),
-		children: /* @__PURE__ */ I(d, {
+		children: /* @__PURE__ */ I(u, {
 			gap: "lg",
 			children: [
-				/* @__PURE__ */ F(d, {
+				/* @__PURE__ */ F(u, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "sm",
-					children: r.map((e) => /* @__PURE__ */ F(D, {
+					children: i.map((e) => /* @__PURE__ */ F(E, {
 						tone: e.tone,
 						children: e.label
 					}, e.label))
 				}),
-				/* @__PURE__ */ F(d, {
+				/* @__PURE__ */ F(u, {
 					gap: "md",
-					children: i.map((e) => /* @__PURE__ */ F(L, { ...e }, e.label))
+					children: a.map((e) => /* @__PURE__ */ F(L, { ...e }, e.label))
 				}),
-				!!o && /* @__PURE__ */ I("div", {
+				!!s && /* @__PURE__ */ I("div", {
 					className: "flex items-center justify-between",
-					children: [/* @__PURE__ */ F(s, {
+					children: [/* @__PURE__ */ F(r, {
 						size: "xs",
 						className: "text-muted-foreground",
-						children: o.label
-					}), /* @__PURE__ */ F(ue, {
-						value: o.value,
-						max: o.max,
-						label: `${String(o.value)}/${String(o.max ?? 5)}`
+						children: s.label
+					}), /* @__PURE__ */ F(de, {
+						value: s.value,
+						max: s.max,
+						label: `${String(s.value)}/${String(s.max ?? 5)}`
 					})]
 				}),
-				!!a && a.length > 0 && /* @__PURE__ */ I(P, { children: [/* @__PURE__ */ F(O, {}), /* @__PURE__ */ F(d, {
+				!!o && o.length > 0 && /* @__PURE__ */ I(P, { children: [/* @__PURE__ */ F(D, {}), /* @__PURE__ */ F(u, {
 					gap: "md",
-					children: a.map((e) => /* @__PURE__ */ F(L, { ...e }, e.label))
+					children: o.map((e) => /* @__PURE__ */ F(L, { ...e }, e.label))
 				})] }),
-				(!!c || !!l) && /* @__PURE__ */ I(d, {
+				(!!c || !!l) && /* @__PURE__ */ I(u, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "md",
 					className: "border-border border-t pt-space-md",
-					children: [!!c && c.map((e) => /* @__PURE__ */ F(D, {
+					children: [!!c && c.map((e) => /* @__PURE__ */ F(E, {
 						tone: e.tone,
 						children: e.label
-					}, e.label)), !!l && /* @__PURE__ */ F(s, {
+					}, e.label)), !!l && /* @__PURE__ */ F(r, {
 						size: "xs",
 						className: "text-muted-foreground",
 						children: l
@@ -115,28 +118,28 @@ function R({ title: e, description: t, statusBadges: r, rows: i, secondaryRows:
 R.displayName = "DenseInfoDashboard";
 //#endregion
 //#region src/components/blocks/data-display/inline-stat/inline-stat.tsx
-function z({ label: e, value: t, layout: r = "between", mono: i = !1, className: a, labelClassName: o, valueClassName: s }) {
-	let c = i ? y : g, u = F(typeof e == "string" || typeof e == "number" ? l : "span", {
-		className: o,
+function z({ label: e, value: t, layout: r = "between", mono: i = !1, className: o, labelClassName: s, valueClassName: c }) {
+	let l = i ? v : h, d = F(typeof e == "string" || typeof e == "number" ? a : "span", {
+		className: s,
 		children: e
 	});
-	return r === "stacked" ? /* @__PURE__ */ I(d, {
+	return r === "stacked" ? /* @__PURE__ */ I(u, {
 		gap: "2xs",
-		className: n("inline-stat--component", a),
-		children: [u, /* @__PURE__ */ F(c, {
+		className: n("inline-stat--component", o),
+		children: [d, /* @__PURE__ */ F(l, {
 			size: "inherit",
-			className: n("text-sm leading-snug", i && "tabular-nums", s),
+			className: n("text-sm leading-snug", i && "tabular-nums", c),
 			children: t
 		})]
-	}) : /* @__PURE__ */ I(d, {
+	}) : /* @__PURE__ */ I(u, {
 		direction: "horizontal",
 		gap: "md",
 		justify: r === "between" ? "between" : "start",
 		wrap: !1,
-		className: n("inline-stat--component", a),
-		children: [u, /* @__PURE__ */ F(c, {
+		className: n("inline-stat--component", o),
+		children: [d, /* @__PURE__ */ F(l, {
 			size: "inherit",
-			className: n("text-sm leading-snug", i && "tabular-nums", s),
+			className: n("text-sm leading-snug", i && "tabular-nums", c),
 			children: t
 		})]
 	});
@@ -150,40 +153,40 @@ var B = {
 };
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/partials/dense-info-classification.tsx
-function V({ title: e, description: r, stats: i, items: a, totalLabel: o, totalValue: l, footerBadges: f, footerText: p, actions: m, className: h, strings: _ }) {
+function V({ title: e, description: a, stats: o, items: s, totalLabel: c, totalValue: d, footerBadges: f, footerText: p, actions: m, className: g, strings: _ }) {
 	let v = t(B, _);
 	return /* @__PURE__ */ F(k, {
 		title: e,
-		description: r,
+		description: a,
 		actions: m,
-		className: n("dense-info-classification--component", h),
-		children: /* @__PURE__ */ I(d, {
+		className: n("dense-info-classification--component", g),
+		children: /* @__PURE__ */ I(u, {
 			gap: "lg",
 			children: [
-				/* @__PURE__ */ F(u, {
+				/* @__PURE__ */ F(l, {
 					columns: {
 						base: 2,
 						sm: 3
 					},
 					gap: "md",
-					children: i.map((e) => /* @__PURE__ */ I("div", {
+					children: o.map((e) => /* @__PURE__ */ I(u, {
+						gap: "dense",
 						className: "rounded-radius border border-border/50 bg-muted/30 p-surface-xs text-center",
 						children: [
-							/* @__PURE__ */ F(c, {
+							/* @__PURE__ */ F(i, {
 								tag: "h4",
 								className: "border-none pb-0 text-base font-semibold tabular-nums",
 								children: e.value
 							}),
-							/* @__PURE__ */ F(s, {
+							/* @__PURE__ */ F(r, {
 								size: "xs",
 								type: "secondary",
 								weight: "medium",
-								className: "mt-0.5",
 								children: e.label
 							}),
 							!!e.trendBadge && /* @__PURE__ */ F("div", {
-								className: "mt-1 flex justify-center",
-								children: /* @__PURE__ */ F(D, {
+								className: "flex justify-center",
+								children: /* @__PURE__ */ F(E, {
 									tone: e.trendTone ?? "secondary",
 									children: e.trendBadge
 								})
@@ -191,47 +194,47 @@ function V({ title: e, description: r, stats: i, items: a, totalLabel: o, totalV
 						]
 					}, e.label))
 				}),
-				/* @__PURE__ */ F(O, {}),
-				/* @__PURE__ */ F(j, { children: a.map((e) => /* @__PURE__ */ I(re, {
+				/* @__PURE__ */ F(D, {}),
+				/* @__PURE__ */ F(j, { children: s.map((e) => /* @__PURE__ */ I(re, {
 					size: "sm",
 					children: [
 						/* @__PURE__ */ F(ee, { children: /* @__PURE__ */ F("span", { className: n("h-2 w-2 shrink-0 rounded-full", e.dotColor) }) }),
 						/* @__PURE__ */ F(ne, { children: /* @__PURE__ */ I(M, {
 							bold: !1,
 							className: "gap-space-md",
-							children: [e.label, !!e.badge && /* @__PURE__ */ F(D, {
+							children: [e.label, !!e.badge && /* @__PURE__ */ F(E, {
 								tone: e.badgeTone ?? "secondary",
 								children: e.badge
 							})]
 						}) }),
-						/* @__PURE__ */ F(A, { children: /* @__PURE__ */ F(g, {
+						/* @__PURE__ */ F(A, { children: /* @__PURE__ */ F(h, {
 							weight: "semibold",
 							className: "tabular-nums",
 							children: e.value
 						}) })
 					]
 				}, e.label)) }),
-				!!l && /* @__PURE__ */ I(P, { children: [/* @__PURE__ */ F(O, {}), /* @__PURE__ */ F(z, {
-					label: /* @__PURE__ */ F(s, {
+				!!d && /* @__PURE__ */ I(P, { children: [/* @__PURE__ */ F(D, {}), /* @__PURE__ */ F(z, {
+					label: /* @__PURE__ */ F(r, {
 						tag: "span",
 						weight: "bold",
 						lineHeight: "tight",
-						children: o ?? v.total
+						children: c ?? v.total
 					}),
-					value: l,
+					value: d,
 					mono: !0,
 					valueClassName: "text-sm font-bold"
 				})] }),
-				(!!f || !!p) && /* @__PURE__ */ I(d, {
+				(!!f || !!p) && /* @__PURE__ */ I(u, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "md",
 					className: "border-border border-t pt-space-md",
-					children: [!!f && f.map((e) => /* @__PURE__ */ F(D, {
+					children: [!!f && f.map((e) => /* @__PURE__ */ F(E, {
 						tone: e.tone,
 						children: e.label
-					}, e.label)), !!p && /* @__PURE__ */ F(s, {
+					}, e.label)), !!p && /* @__PURE__ */ F(r, {
 						size: "xs",
 						className: "text-muted-foreground",
 						children: p
@@ -244,35 +247,35 @@ function V({ title: e, description: r, stats: i, items: a, totalLabel: o, totalV
 V.displayName = "DenseInfoClassification";
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/partials/dense-info-financial.tsx
-function H({ title: e, description: r, headerBadges: i, lineItems: a, totalLabel: o, totalAmount: c, footerBadges: l, footerText: u, actions: f, className: p, strings: m }) {
-	let h = t(B, m);
+function H({ title: e, description: i, headerBadges: a, lineItems: o, totalLabel: s, totalAmount: c, footerBadges: l, footerText: d, actions: f, className: p, strings: m }) {
+	let g = t(B, m);
 	return /* @__PURE__ */ F(k, {
 		title: e,
-		description: r,
+		description: i,
 		actions: f,
 		className: n("dense-info-financial--component", p),
-		children: /* @__PURE__ */ I(d, {
+		children: /* @__PURE__ */ I(u, {
 			gap: "lg",
 			children: [
-				/* @__PURE__ */ F(d, {
+				/* @__PURE__ */ F(u, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "sm",
-					children: i.map((e) => /* @__PURE__ */ F(D, {
+					children: a.map((e) => /* @__PURE__ */ F(E, {
 						tone: e.tone,
 						children: e.label
 					}, e.label))
 				}),
-				/* @__PURE__ */ F(j, { children: a.map((e, t) => /* @__PURE__ */ I("div", { children: [t > 0 && /* @__PURE__ */ F(te, { className: "my-0" }), /* @__PURE__ */ I(re, {
+				/* @__PURE__ */ F(j, { children: o.map((e, t) => /* @__PURE__ */ I("div", { children: [t > 0 && /* @__PURE__ */ F(te, { className: "my-0" }), /* @__PURE__ */ I(re, {
 					size: "sm",
 					children: [/* @__PURE__ */ F(ne, { children: /* @__PURE__ */ I(M, {
 						className: "gap-space-md",
-						children: [e.label, !!e.badge && /* @__PURE__ */ F(D, {
+						children: [e.label, !!e.badge && /* @__PURE__ */ F(E, {
 							tone: e.badgeTone ?? "secondary",
 							children: e.badge
 						})]
-					}) }), /* @__PURE__ */ F(A, { children: /* @__PURE__ */ F(g, {
+					}) }), /* @__PURE__ */ F(A, { children: /* @__PURE__ */ F(h, {
 						weight: "semibold",
 						className: "tabular-nums",
 						children: e.amount
@@ -280,29 +283,29 @@ function H({ title: e, description: r, headerBadges: i, lineItems: a, totalLabel
 				})] }, e.label)) }),
 				!!c && /* @__PURE__ */ F(z, {
 					className: "rounded-radius bg-muted/50 p-surface-xs",
-					label: /* @__PURE__ */ F(s, {
+					label: /* @__PURE__ */ F(r, {
 						tag: "span",
 						weight: "semibold",
 						lineHeight: "tight",
-						children: o ?? h.total
+						children: s ?? g.total
 					}),
 					value: c,
 					mono: !0,
 					valueClassName: "text-sm font-semibold"
 				}),
-				(!!l || !!u) && /* @__PURE__ */ I(d, {
+				(!!l || !!d) && /* @__PURE__ */ I(u, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "md",
 					className: "border-border border-t pt-space-md",
-					children: [!!l && l.map((e) => /* @__PURE__ */ F(D, {
+					children: [!!l && l.map((e) => /* @__PURE__ */ F(E, {
 						tone: e.tone,
 						children: e.label
-					}, e.label)), !!u && /* @__PURE__ */ F(s, {
+					}, e.label)), !!d && /* @__PURE__ */ F(r, {
 						size: "xs",
 						className: "text-muted-foreground",
-						children: u
+						children: d
 					})]
 				})
 			]
@@ -312,52 +315,51 @@ function H({ title: e, description: r, headerBadges: i, lineItems: a, totalLabel
 H.displayName = "DenseInfoFinancial";
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/partials/dense-info-project.tsx
-function U({ title: e, description: r, statusLabel: i, statusTone: a, metaPairs: o, date: l, priority: u, completedTasks: f, totalTasks: p, actions: m, className: h, strings: g }) {
+function U({ title: e, description: a, statusLabel: o, statusTone: s, metaPairs: c, date: l, priority: d, completedTasks: f, totalTasks: p, actions: m, className: h, strings: g }) {
 	let _ = t(B, g), v = p > 0 ? Math.round(f / p * 100) : 0, y = 2 * Math.PI * 7, b = y - v / 100 * y;
 	return /* @__PURE__ */ F(k, {
 		padding: "md",
 		actions: m,
 		className: n("dense-info-project-card--component", h),
-		children: /* @__PURE__ */ I(d, {
+		children: /* @__PURE__ */ I(u, {
 			gap: "lg",
 			children: [
 				/* @__PURE__ */ I("div", {
 					className: "flex items-center justify-between",
-					children: [/* @__PURE__ */ F(se, { className: "h-4 w-4 text-muted-foreground" }), /* @__PURE__ */ F(D, {
-						tone: a,
+					children: [/* @__PURE__ */ F(ce, { className: "h-4 w-4 text-muted-foreground" }), /* @__PURE__ */ F(E, {
+						tone: s,
 						dot: !0,
-						children: i
+						children: o
 					})]
 				}),
-				/* @__PURE__ */ F(c, {
+				/* @__PURE__ */ F(i, {
 					tag: "h5",
 					className: "font-bold border-none pb-0",
 					children: e
 				}),
-				!!r && /* @__PURE__ */ F(s, {
+				!!a && /* @__PURE__ */ F(r, {
 					type: "secondary",
 					className: "line-clamp-2",
-					children: r
+					children: a
 				}),
-				!!o && o.length > 0 && /* @__PURE__ */ F(d, {
+				!!c && c.length > 0 && /* @__PURE__ */ F(u, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "sm",
-					children: o.map((e, t) => /* @__PURE__ */ I("span", {
+					children: c.map((e, t) => /* @__PURE__ */ I("span", {
 						className: "flex items-center gap-space-xs",
 						children: [
-							t > 0 && /* @__PURE__ */ F(s, {
+							t > 0 && /* @__PURE__ */ F(r, {
 								tag: "span",
 								type: "discrete",
-								className: "mx-0.5",
 								children: "•"
 							}),
 							!!e.icon && /* @__PURE__ */ F("span", {
 								className: "text-muted-foreground",
 								children: e.icon
 							}),
-							/* @__PURE__ */ F(s, {
+							/* @__PURE__ */ F(r, {
 								size: "xs",
 								type: "secondary",
 								children: e.label
@@ -365,25 +367,25 @@ function U({ title: e, description: r, statusLabel: i, statusTone: a, metaPairs:
 						]
 					}, e.label))
 				}),
-				(!!l || !!u) && /* @__PURE__ */ I("div", {
+				(!!l || !!d) && /* @__PURE__ */ I("div", {
 					className: "flex items-center justify-between",
 					children: [!!l && /* @__PURE__ */ I("div", {
 						className: "flex items-center gap-space-sm",
-						children: [/* @__PURE__ */ F(oe, { className: "h-3 w-3 text-muted-foreground" }), /* @__PURE__ */ F(s, {
+						children: [/* @__PURE__ */ F(se, { className: "h-3 w-3 text-muted-foreground" }), /* @__PURE__ */ F(r, {
 							size: "xs",
 							type: "secondary",
 							children: l
 						})]
-					}), !!u && /* @__PURE__ */ I("div", {
+					}), !!d && /* @__PURE__ */ I("div", {
 						className: "flex items-center gap-space-sm",
-						children: [/* @__PURE__ */ F(ae, { className: "h-3 w-3 text-muted-foreground" }), /* @__PURE__ */ F(s, {
+						children: [/* @__PURE__ */ F(oe, { className: "h-3 w-3 text-muted-foreground" }), /* @__PURE__ */ F(r, {
 							size: "xs",
 							type: "secondary",
-							children: u
+							children: d
 						})]
 					})]
 				}),
-				/* @__PURE__ */ F(O, {}),
+				/* @__PURE__ */ F(D, {}),
 				/* @__PURE__ */ I("div", {
 					className: "flex items-center justify-between",
 					children: [/* @__PURE__ */ I("div", {
@@ -414,7 +416,7 @@ function U({ title: e, description: r, statusLabel: i, statusTone: a, metaPairs:
 								className: "text-primary-accent",
 								transform: "rotate(-90 10 10)"
 							})]
-						}), /* @__PURE__ */ I(s, {
+						}), /* @__PURE__ */ I(r, {
 							size: "xs",
 							weight: "medium",
 							children: [
@@ -434,46 +436,46 @@ function U({ title: e, description: r, statusLabel: i, statusTone: a, metaPairs:
 U.displayName = "DenseInfoProjectCard";
 //#endregion
 //#region src/components/blocks/data-display/dense-info-card/partials/dense-info-score.tsx
-function W({ title: e, description: t, statusBadges: r, score: i, scoreLevel: a, scoreFilled: o, scoreTotal: l = 10, rows: u, footerBadges: f, actions: p, className: m }) {
-	let h = a === "good" ? "bg-success" : a === "medium" ? "bg-warning" : "bg-destructive";
+function W({ title: e, description: t, statusBadges: a, score: o, scoreLevel: s, scoreFilled: c, scoreTotal: l = 10, rows: d, footerBadges: f, actions: p, className: m }) {
+	let h = s === "good" ? "bg-success" : s === "medium" ? "bg-warning" : "bg-destructive";
 	return /* @__PURE__ */ F(k, {
 		title: e,
 		description: t,
 		actions: p,
 		className: n("dense-info-score-card--component", m),
-		children: /* @__PURE__ */ I(d, {
+		children: /* @__PURE__ */ I(u, {
 			gap: "lg",
 			children: [
-				/* @__PURE__ */ F(d, {
+				/* @__PURE__ */ F(u, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "sm",
-					children: r.map((e) => /* @__PURE__ */ F(D, {
+					children: a.map((e) => /* @__PURE__ */ F(E, {
 						tone: e.tone,
 						children: e.label
 					}, e.label))
 				}),
 				/* @__PURE__ */ F("div", {
 					className: "flex items-center justify-center py-space-md",
-					children: /* @__PURE__ */ F(c, {
+					children: /* @__PURE__ */ F(i, {
 						tag: "h2",
 						className: "text-base font-bold tabular-nums border-none pb-0",
-						children: String(i)
+						children: String(o)
 					})
 				}),
-				/* @__PURE__ */ F(d, {
+				/* @__PURE__ */ F(u, {
 					direction: "horizontal",
 					align: "center",
 					justify: "center",
 					gap: "xs",
-					children: Array.from({ length: l }, (e, t) => /* @__PURE__ */ F("div", { className: n("h-5 w-2 rounded-radius-sm", t < o ? h : "bg-muted") }, t))
+					children: Array.from({ length: l }, (e, t) => /* @__PURE__ */ F("div", { className: n("h-5 w-2 rounded-radius-sm", t < c ? h : "bg-muted") }, t))
 				}),
-				/* @__PURE__ */ F(O, {}),
-				/* @__PURE__ */ F(d, {
+				/* @__PURE__ */ F(D, {}),
+				/* @__PURE__ */ F(u, {
 					gap: "md",
-					children: u.map((e) => /* @__PURE__ */ F(z, {
-						label: /* @__PURE__ */ F(s, {
+					children: d.map((e) => /* @__PURE__ */ F(z, {
+						label: /* @__PURE__ */ F(r, {
 							tag: "span",
 							size: "xs",
 							type: "secondary",
@@ -486,13 +488,13 @@ function W({ title: e, description: t, statusBadges: r, score: i, scoreLevel: a,
 						valueClassName: "text-sm font-semibold text-right"
 					}, e.label))
 				}),
-				!!f && f.length > 0 && /* @__PURE__ */ F(d, {
+				!!f && f.length > 0 && /* @__PURE__ */ F(u, {
 					direction: "horizontal",
 					wrap: !0,
 					align: "center",
 					gap: "md",
 					className: "border-border border-t pt-space-md",
-					children: f.map((e) => /* @__PURE__ */ F(D, {
+					children: f.map((e) => /* @__PURE__ */ F(E, {
 						tone: e.tone,
 						children: e.label
 					}, e.label))
@@ -508,60 +510,63 @@ var G = {
 	title: "Nothing here yet",
 	description: "Once data lands, it will show up in this view.",
 	ariaLabel: "Empty state"
-}, de = {
+}, fe = {
 	sm: "!p-surface-xs",
 	md: "!p-surface",
 	lg: "!p-surface-lg"
-}, fe = {
+}, pe = {
 	none: "default",
 	icon: "icon",
 	"icon-soft": "icon",
 	illustration: "default"
-}, pe = {
+}, me = {
 	none: void 0,
 	icon: void 0,
 	"icon-soft": "bg-muted/40 text-muted-foreground",
 	illustration: "mb-space-xl"
-}, K = ie(function({ title: r, description: i, media: a, mediaVariant: o = "none", renderMedia: l, actions: u, footer: g, padding: _, border: v = !1, className: y, strings: b, ariaLabel: x }, S) {
-	let C = t(G, b), { defaultScale: w } = e(), T = _ ?? w ?? "md", E = r ?? C.title, D = i === !1 ? null : i ?? C.description, O = l ? l({ mediaVariant: o }) : a, k = !!O;
+}, K = ie(function({ title: a, description: o, media: s, mediaVariant: c = "none", renderMedia: l, actions: h, footer: g, padding: _, border: v = !1, className: y, strings: b, ariaLabel: x }, S) {
+	let C = t(G, b), { defaultScale: w } = e(), T = _ ?? w ?? "md", E = a ?? C.title, D = o === !1 ? null : o ?? C.description, O = l ? l({ mediaVariant: c }) : s, k = !!O;
 	return /* @__PURE__ */ I(p, {
 		ref: S,
 		role: "status",
 		"aria-label": x ?? C.ariaLabel,
-		className: n("empty-state--component", de[T], v ? "border-border border border-dashed" : "border-border border-0", y),
+		className: n("empty-state--component", fe[T], v ? "border-border border border-dashed" : "border-border border-0", y),
 		children: [/* @__PURE__ */ I(f, {
 			className: "empty-state--header",
 			children: [
 				!!k && /* @__PURE__ */ F(m, {
-					variant: fe[o],
-					className: n("empty-state--media", pe[o]),
+					variant: pe[c],
+					className: n("empty-state--media", me[c]),
 					children: O
 				}),
-				/* @__PURE__ */ F(c, {
+				/* @__PURE__ */ F(i, {
 					tag: "h3",
+					align: "center",
 					className: "empty-state--title border-0 pb-0",
 					"data-slot": "empty-title",
 					children: E
 				}),
-				!!D && /* @__PURE__ */ F(s, {
+				!!D && /* @__PURE__ */ F(r, {
 					type: "secondary",
+					align: "center",
 					className: "empty-state--description leading-relaxed [&>a]:text-primary-accent [&>a]:underline [&>a]:underline-offset-4 hover:[&>a]:no-underline",
 					"data-slot": "empty-description",
 					children: D
 				})
 			]
-		}), (!!u || !!g) && /* @__PURE__ */ I(h, {
+		}), (!!h || !!g) && /* @__PURE__ */ I(d, {
 			className: "empty-state--content",
-			children: [!!u && /* @__PURE__ */ F(d, {
+			children: [!!h && /* @__PURE__ */ F(u, {
 				direction: "horizontal",
 				gap: "md",
 				justify: "center",
 				className: "empty-state--actions",
-				children: u
-			}), !!g && /* @__PURE__ */ F(s, {
+				children: h
+			}), !!g && /* @__PURE__ */ F(r, {
 				tag: "div",
 				size: "xs",
 				type: "secondary",
+				align: "center",
 				className: "empty-state--footer",
 				children: g
 			})]
@@ -572,96 +577,302 @@ K.displayName = "EmptyState";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/partials/illustrations/document-stack.tsx
 function q({ className: e }) {
-	return /* @__PURE__ */ I("div", {
+	return /* @__PURE__ */ F("div", {
 		className: n("document-stack-illustration--component relative h-24 w-32", e),
 		"aria-hidden": "true",
-		children: [/* @__PURE__ */ I("div", {
-			className: "bg-muted/70 dark:bg-muted/40 border-border/50 absolute left-1 top-1 flex h-20 w-20 -rotate-6 flex-col gap-1.5 rounded-radius-md border p-2 shadow-sm",
-			children: [
-				/* @__PURE__ */ F("div", { className: "bg-muted h-2 w-12 rounded" }),
-				/* @__PURE__ */ F("div", { className: "bg-muted/60 h-1.5 w-10 rounded" }),
-				/* @__PURE__ */ F("div", { className: "bg-muted/60 h-1.5 w-9 rounded" })
-			]
-		}), /* @__PURE__ */ I("div", {
-			className: "bg-background border-border absolute right-1 top-2 flex h-20 w-20 rotate-3 flex-col gap-1.5 rounded-radius-md border p-2 shadow-sm",
-			children: [
-				/* @__PURE__ */ F("div", { className: "bg-muted h-2 w-12 rounded" }),
-				/* @__PURE__ */ F("div", { className: "bg-muted/60 h-1.5 w-10 rounded" }),
-				/* @__PURE__ */ F("div", { className: "bg-muted/60 h-1.5 w-9 rounded" }),
-				/* @__PURE__ */ I("div", {
-					className: "mt-auto flex items-center gap-1",
-					children: [/* @__PURE__ */ F("div", { className: "bg-success size-1.5 rounded-full" }), /* @__PURE__ */ F("div", { className: "bg-muted/60 h-1.5 w-8 rounded" })]
-				})
-			]
-		})]
+		children: /* @__PURE__ */ I("svg", {
+			viewBox: "0 0 128 96",
+			className: "h-full w-full overflow-visible",
+			focusable: "false",
+			children: [/* @__PURE__ */ I("g", {
+				transform: "rotate(-6 44 44)",
+				children: [
+					/* @__PURE__ */ F("rect", {
+						x: 4.5,
+						y: 4.5,
+						width: 79,
+						height: 79,
+						style: { rx: "var(--radius-md)" },
+						className: "fill-muted/70 dark:fill-muted/40 stroke-border/50 drop-shadow-xs"
+					}),
+					/* @__PURE__ */ F("rect", {
+						x: 13,
+						y: 13,
+						width: 48,
+						height: 8,
+						rx: 4,
+						className: "fill-muted"
+					}),
+					/* @__PURE__ */ F("rect", {
+						x: 13,
+						y: 27,
+						width: 40,
+						height: 6,
+						rx: 3,
+						className: "fill-muted/60"
+					}),
+					/* @__PURE__ */ F("rect", {
+						x: 13,
+						y: 39,
+						width: 36,
+						height: 6,
+						rx: 3,
+						className: "fill-muted/60"
+					})
+				]
+			}), /* @__PURE__ */ I("g", {
+				transform: "rotate(3 84 48)",
+				children: [
+					/* @__PURE__ */ F("rect", {
+						x: 44.5,
+						y: 8.5,
+						width: 79,
+						height: 79,
+						style: { rx: "var(--radius-md)" },
+						className: "fill-background stroke-border drop-shadow-xs"
+					}),
+					/* @__PURE__ */ F("rect", {
+						x: 53,
+						y: 17,
+						width: 48,
+						height: 8,
+						rx: 4,
+						className: "fill-muted"
+					}),
+					/* @__PURE__ */ F("rect", {
+						x: 53,
+						y: 31,
+						width: 40,
+						height: 6,
+						rx: 3,
+						className: "fill-muted/60"
+					}),
+					/* @__PURE__ */ F("rect", {
+						x: 53,
+						y: 43,
+						width: 36,
+						height: 6,
+						rx: 3,
+						className: "fill-muted/60"
+					}),
+					/* @__PURE__ */ F("circle", {
+						cx: 56,
+						cy: 76,
+						r: 3,
+						className: "fill-success"
+					}),
+					/* @__PURE__ */ F("rect", {
+						x: 63,
+						y: 73,
+						width: 32,
+						height: 6,
+						rx: 3,
+						className: "fill-muted/60"
+					})
+				]
+			})]
+		})
 	});
 }
 q.displayName = "DocumentStackIllustration";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/partials/illustrations/inbox-clean.tsx
 function J({ className: e }) {
-	return /* @__PURE__ */ I("div", {
+	let t = ae();
+	return /* @__PURE__ */ F("div", {
 		className: n("inbox-clean-illustration--component relative h-24 w-32", e),
 		"aria-hidden": "true",
-		children: [/* @__PURE__ */ F("div", {
-			className: "bg-success/12 border-success/30 absolute left-1/2 top-0 flex size-8 -translate-x-1/2 items-center justify-center rounded-full border",
-			children: /* @__PURE__ */ F("svg", {
-				viewBox: "0 0 16 16",
-				className: "text-success size-icon-md",
-				fill: "none",
-				stroke: "currentColor",
-				strokeWidth: "2",
-				strokeLinecap: "round",
-				strokeLinejoin: "round",
-				children: /* @__PURE__ */ F("path", { d: "M3 8l3 3 7-7" })
-			})
-		}), /* @__PURE__ */ I("div", {
-			className: "bg-background border-border absolute inset-x-0 bottom-0 flex h-14 flex-col rounded-radius border shadow-sm",
-			children: [/* @__PURE__ */ F("div", { className: "bg-muted/30 h-3 rounded-t-radius" }), /* @__PURE__ */ I("div", {
-				className: "flex flex-1 items-center justify-between px-3",
-				children: [/* @__PURE__ */ I("div", {
-					className: "flex flex-col gap-1",
-					children: [/* @__PURE__ */ F("div", { className: "bg-muted/60 h-1.5 w-12 rounded" }), /* @__PURE__ */ F("div", { className: "bg-muted/40 h-1.5 w-8 rounded" })]
-				}), /* @__PURE__ */ F("div", { className: "bg-muted/40 size-3 rounded-full" })]
-			})]
-		})]
+		children: /* @__PURE__ */ I("svg", {
+			viewBox: "0 0 128 96",
+			className: "h-full w-full overflow-visible",
+			focusable: "false",
+			children: [
+				/* @__PURE__ */ F("defs", { children: /* @__PURE__ */ F("clipPath", {
+					id: t,
+					children: /* @__PURE__ */ F("rect", {
+						x: .5,
+						y: 40.5,
+						width: 127,
+						height: 55,
+						style: { rx: "var(--radius)" }
+					})
+				}) }),
+				/* @__PURE__ */ F("circle", {
+					cx: 64,
+					cy: 16,
+					r: 15.5,
+					className: "fill-success/12 stroke-success/30"
+				}),
+				/* @__PURE__ */ F("path", {
+					d: "M59 16l3 3 7-7",
+					fill: "none",
+					className: "stroke-success",
+					strokeWidth: 2,
+					strokeLinecap: "round",
+					strokeLinejoin: "round"
+				}),
+				/* @__PURE__ */ F("rect", {
+					x: .5,
+					y: 40.5,
+					width: 127,
+					height: 55,
+					style: { rx: "var(--radius)" },
+					className: "fill-background drop-shadow-xs"
+				}),
+				/* @__PURE__ */ I("g", {
+					clipPath: `url(#${t})`,
+					children: [
+						/* @__PURE__ */ F("rect", {
+							x: 1,
+							y: 41,
+							width: 126,
+							height: 12,
+							className: "fill-muted/30"
+						}),
+						/* @__PURE__ */ F("rect", {
+							x: 13,
+							y: 66,
+							width: 48,
+							height: 6,
+							rx: 3,
+							className: "fill-muted/60"
+						}),
+						/* @__PURE__ */ F("rect", {
+							x: 13,
+							y: 76,
+							width: 32,
+							height: 6,
+							rx: 3,
+							className: "fill-muted/40"
+						}),
+						/* @__PURE__ */ F("circle", {
+							cx: 109,
+							cy: 74,
+							r: 6,
+							className: "fill-muted/40"
+						})
+					]
+				}),
+				/* @__PURE__ */ F("rect", {
+					x: .5,
+					y: 40.5,
+					width: 127,
+					height: 55,
+					style: { rx: "var(--radius)" },
+					fill: "none",
+					className: "stroke-border"
+				})
+			]
+		})
 	});
 }
 J.displayName = "InboxCleanIllustration";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/partials/illustrations/search-glass.tsx
-function me({ className: e }) {
+function he({ className: e }) {
 	return /* @__PURE__ */ F("div", {
 		className: n("search-glass-illustration--component", "flex size-20 items-center justify-center rounded-full bg-muted/40 ring-8 ring-muted/20", e),
 		"aria-hidden": "true",
-		children: /* @__PURE__ */ F(le, { className: "size-8 text-muted-foreground" })
+		children: /* @__PURE__ */ F(ue, { className: "size-8 text-muted-foreground" })
 	});
 }
-me.displayName = "SearchGlassIllustration";
+he.displayName = "SearchGlassIllustration";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/partials/illustrations/stacked-cards.tsx
-function he({ className: e }) {
-	return /* @__PURE__ */ I("div", {
+function ge({ className: e }) {
+	let t = ae();
+	return /* @__PURE__ */ F("div", {
 		className: n("stacked-cards-illustration--component relative h-24 w-52", e),
 		"aria-hidden": "true",
-		children: [
-			/* @__PURE__ */ F("div", { className: "bg-muted/60 dark:bg-muted/30 border-border/50 absolute inset-x-6 top-0 h-6 rounded-t-radius border" }),
-			/* @__PURE__ */ F("div", { className: "bg-muted/80 dark:bg-muted/50 border-border/60 absolute inset-x-3 top-3 h-6 rounded-t-radius border" }),
-			/* @__PURE__ */ I("div", {
-				className: "bg-background border-border absolute inset-x-0 top-6 flex h-16 items-center gap-3 rounded-radius border px-4 shadow-sm",
-				children: [/* @__PURE__ */ F("div", { className: "bg-muted size-8 shrink-0 rounded" }), /* @__PURE__ */ I("div", {
-					className: "flex flex-1 flex-col gap-1.5",
-					children: [/* @__PURE__ */ F("div", { className: "bg-muted h-2.5 w-3/4 rounded" }), /* @__PURE__ */ F("div", { className: "bg-muted/60 h-2 w-1/2 rounded" })]
-				})]
-			}),
-			/* @__PURE__ */ F("div", { className: "from-background/0 via-background/60 to-background pointer-events-none absolute inset-x-0 bottom-0 h-8 bg-linear-to-b" })
-		]
+		children: /* @__PURE__ */ I("svg", {
+			viewBox: "0 0 208 96",
+			className: "h-full w-full overflow-visible",
+			focusable: "false",
+			children: [
+				/* @__PURE__ */ F("defs", { children: /* @__PURE__ */ I("linearGradient", {
+					id: t,
+					x1: "0",
+					y1: "0",
+					x2: "0",
+					y2: "1",
+					children: [
+						/* @__PURE__ */ F("stop", {
+							stopColor: "var(--background)",
+							stopOpacity: 0
+						}),
+						/* @__PURE__ */ F("stop", {
+							offset: "0.5",
+							stopColor: "var(--background)",
+							stopOpacity: .6
+						}),
+						/* @__PURE__ */ F("stop", {
+							offset: "1",
+							stopColor: "var(--background)"
+						})
+					]
+				}) }),
+				/* @__PURE__ */ F("rect", {
+					x: 24.5,
+					y: .5,
+					width: 159,
+					height: 23,
+					style: { rx: "var(--radius)" },
+					className: "fill-muted/60 dark:fill-muted/30 stroke-border/50"
+				}),
+				/* @__PURE__ */ F("rect", {
+					x: 12.5,
+					y: 12.5,
+					width: 183,
+					height: 23,
+					style: { rx: "var(--radius)" },
+					className: "fill-muted/80 dark:fill-muted/50 stroke-border/60"
+				}),
+				/* @__PURE__ */ F("rect", {
+					x: .5,
+					y: 24.5,
+					width: 207,
+					height: 63,
+					style: { rx: "var(--radius)" },
+					className: "fill-background stroke-border drop-shadow-xs"
+				}),
+				/* @__PURE__ */ F("rect", {
+					x: 17,
+					y: 40,
+					width: 32,
+					height: 32,
+					rx: 4,
+					className: "fill-muted"
+				}),
+				/* @__PURE__ */ F("rect", {
+					x: 61,
+					y: 44,
+					width: 97.5,
+					height: 10,
+					rx: 4,
+					className: "fill-muted"
+				}),
+				/* @__PURE__ */ F("rect", {
+					x: 61,
+					y: 60,
+					width: 65,
+					height: 8,
+					rx: 4,
+					className: "fill-muted/60"
+				}),
+				/* @__PURE__ */ F("rect", {
+					y: 64,
+					width: 208,
+					height: 32,
+					fill: `url(#${t})`
+				})
+			]
+		})
 	});
 }
-he.displayName = "StackedCardsIllustration";
+ge.displayName = "StackedCardsIllustration";
 //#endregion
 //#region src/components/blocks/data-display/empty-state/partials/illustrations/users-circle.tsx
-function ge({ className: e }) {
+function _e({ className: e }) {
 	return /* @__PURE__ */ I("div", {
 		className: n("users-circle-illustration--component relative flex h-24 w-32 items-center justify-center", e),
 		"aria-hidden": "true",
@@ -672,96 +883,90 @@ function ge({ className: e }) {
 		]
 	});
 }
-ge.displayName = "UsersCircleIllustration";
+_e.displayName = "UsersCircleIllustration";
 //#endregion
 //#region src/components/blocks/data-display/metadata/metadata-list.strings.ts
-var _e = {
+var ve = {
 	formatInfoAriaLabel: (e) => `${e} info`,
 	infoFallback: "Info"
 };
 //#endregion
 //#region src/components/blocks/data-display/metadata/metadata-value.tsx
-function ve(e) {
+function ye(e) {
 	return e == null || e === "";
 }
-function ye(e, t = "—") {
-	return /* @__PURE__ */ F(x, {
-		size: "inherit",
+function be(e, t = "—") {
+	return /* @__PURE__ */ F(b, {
 		className: n("metadata-value--component", e),
 		children: t
 	});
 }
-function be(e) {
+function xe(e) {
 	throw Error("Unsupported metadata value descriptor.");
 }
 function Y(e) {
 	if (e.kind === "node") return /* @__PURE__ */ F(P, { children: e.node });
-	if (e.kind === "empty" || e.kind !== "link" && ve(e.value)) return ye(e.className, e.emptyLabel);
+	if (e.kind === "empty" || e.kind !== "link" && ye(e.value)) return be(e.className, e.emptyLabel);
 	switch (e.kind) {
 		case void 0:
-		case "text": return /* @__PURE__ */ F(g, {
-			size: "inherit",
+		case "text": return /* @__PURE__ */ F(h, {
 			className: n("metadata-value--component", e.className),
 			children: e.display ?? e.value
 		});
-		case "mono": return /* @__PURE__ */ F(y, {
-			size: "inherit",
+		case "mono": return /* @__PURE__ */ F(v, {
 			className: n("metadata-value--component", e.className),
 			children: e.display ?? e.value
 		});
-		case "email": return /* @__PURE__ */ F(b, {
+		case "email": return /* @__PURE__ */ F(y, {
 			value: e.value,
 			display: e.display,
 			emptyLabel: e.emptyLabel,
 			className: n("metadata-value--component", e.className)
 		});
-		case "phone": return /* @__PURE__ */ F(_, {
+		case "phone": return /* @__PURE__ */ F(g, {
 			value: e.value,
 			display: e.display,
 			emptyLabel: e.emptyLabel,
 			className: n("metadata-value--component", e.className)
 		});
-		case "url": return /* @__PURE__ */ F(v, {
+		case "url": return /* @__PURE__ */ F(_, {
 			value: e.value,
 			display: e.display,
 			emptyLabel: e.emptyLabel,
 			className: n("metadata-value--component", e.className)
 		});
-		case "link": return /* @__PURE__ */ F(S, {
+		case "link": return /* @__PURE__ */ F(x, {
 			href: e.href,
 			emptyLabel: e.emptyLabel,
 			className: n("metadata-value--component", e.className),
 			children: e.display ?? e.value ?? e.href
 		});
-		case "date": return /* @__PURE__ */ F(E, {
+		case "date": return /* @__PURE__ */ F(T, {
 			value: e.value,
 			format: e.dateFormat,
 			preset: e.datePreset,
 			locale: e.dateLocale,
 			emptyLabel: e.emptyLabel,
-			size: "inherit",
 			className: n("metadata-value--component", e.className)
 		});
-		case "time": return /* @__PURE__ */ F(w, {
+		case "time": return /* @__PURE__ */ F(C, {
 			value: e.value,
 			format: e.timeFormat,
 			preset: e.timePreset,
 			locale: e.dateLocale,
 			emptyLabel: e.emptyLabel,
-			size: "inherit",
 			className: n("metadata-value--component", e.className)
 		});
-		case "datetime": return /* @__PURE__ */ F(T, {
+		case "datetime": return /* @__PURE__ */ F(w, {
 			value: e.value,
 			format: e.dateFormat,
 			timeFormat: e.timeFormat,
 			preset: e.datePreset,
 			locale: e.dateLocale,
 			emptyLabel: e.emptyLabel,
-			size: "inherit",
 			className: n("metadata-value--component", e.className)
 		});
-		case "money": return /* @__PURE__ */ F(C, {
+		case "money": return /* @__PURE__ */ F(S, {
 			amount: e.value,
 			currency: e.currency,
 			unit: e.unit,
@@ -773,23 +978,22 @@ function Y(e) {
 			maximumFractionDigits: e.maximumFractionDigits,
 			locale: e.locale,
 			emptyLabel: e.emptyLabel,
-			size: "inherit",
 			className: n("metadata-value--component", e.className)
 		});
-		case "badge": return /* @__PURE__ */ F(D, {
+		case "badge": return /* @__PURE__ */ F(E, {
 			tone: e.badgeTone ?? "secondary",
 			size: e.badgeSize,
 			inline: !0,
 			className: n("metadata-value--component self-start justify-self-start", e.className),
 			children: e.display ?? e.value
 		});
-		default: return be(e);
+		default: return xe(e);
 	}
 }
 Y.displayName = "MetadataValue";
 //#endregion
 //#region src/components/blocks/data-display/metadata/metadata-list.tsx
-var xe = {
+var Se = {
 	1: 1,
 	2: {
 		base: 1,
@@ -807,22 +1011,22 @@ var xe = {
 		xl: 4
 	}
 };
-function Se(e) {
-	return typeof e == "object" ? e : xe[e];
+function Ce(e) {
+	return typeof e == "object" ? e : Se[e];
 }
 var X = (e, t) => e.id ? e.id : `metadata-${typeof e.label == "string" ? e.label : `${t}`}-${t}`;
-function Ce(e) {
+function we(e) {
 	return typeof e == "string" || typeof e == "number";
 }
-function we(e) {
+function Te(e) {
 	return typeof e == "object" && !!e && !N.isValidElement(e) && !Array.isArray(e) && ("kind" in e || "node" in e || "value" in e);
 }
 function Z({ value: e, isEmptyValue: t, emptyLabel: r, valueBase: i }) {
-	return we(e) ? e.kind === "node" ? /* @__PURE__ */ F(Y, { ...e }) : /* @__PURE__ */ F(Y, {
+	return Te(e) ? e.kind === "node" ? /* @__PURE__ */ F(Y, { ...e }) : /* @__PURE__ */ F(Y, {
 		...e,
 		emptyLabel: e.emptyLabel ?? r,
 		className: n(i, e.className)
-	}) : Ce(e) ? /* @__PURE__ */ F(Y, {
+	}) : we(e) ? /* @__PURE__ */ F(Y, {
 		value: e,
 		kind: t ? "empty" : "text",
 		emptyLabel: r,
@@ -830,71 +1034,74 @@ function Z({ value: e, isEmptyValue: t, emptyLabel: r, valueBase: i }) {
 	}) : e;
 }
 function Q({ triggerProps: e, ariaLabel: t }) {
-	let { className: r, ...a } = e;
-	return /* @__PURE__ */ F(i, {
-		...a,
+	let { className: r, ...i } = e;
+	return /* @__PURE__ */ F("button", {
+		...i,
 		type: "button",
-		tone: "secondary",
-		buttonStyle: "ghost",
-		size: "sm",
-		iconOnly: !0,
-		className: n("metadata-list--info-trigger -mx-space-2xs inline-flex size-avatar-sm shrink-0 items-center justify-center rounded-radius-sm", "text-muted-foreground transition-colors hover:text-foreground", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40", r),
+		className: n("metadata-list--info-trigger", O.target, O.focus, O.clear, r),
 		"aria-label": t,
-		children: /* @__PURE__ */ F(ce, { className: "size-icon-sm cursor-help" })
+		children: /* @__PURE__ */ F(le, {
+			className: n(O.icon, "cursor-help"),
+			"aria-hidden": "true"
+		})
 	});
 }
-function Te({ items: e, columns: i = 2, density: c = "default", emptyLabel: f = "—", title: p, titleSeparator: m = !1, className: h, layout: g = "grid", separator: _ = ": ", itemSeparator: v = !1, strings: y }) {
-	let b = t(_e, y), x = N.useMemo(() => e.filter(Boolean), [e]);
+function Ee({ items: e, columns: i = 2, density: d = "default", emptyLabel: f = "—", title: p, titleSeparator: m = !1, className: h, layout: g = "grid", separator: _ = ": ", itemSeparator: v = !1, strings: y }) {
+	let b = t(ve, y), x = N.useMemo(() => e.filter(Boolean), [e]);
 	if (x.length === 0) return null;
-	let S = c === "compact", C = "metadata--field text-left", w = n("metadata-list--value", S ? "text-xs" : "text-sm"), T = "mb-space-sm block", E = p != null, D = E && m;
+	let S = d === "compact", C = "metadata--field text-left", w = "metadata-list--value text-sm", T = "block", E = p != null, O = E && m;
 	if (g === "inline") {
 		let e = typeof v == "string" ? v : v ? " | " : "";
-		return /* @__PURE__ */ I("div", {
+		return /* @__PURE__ */ I(u, {
+			gap: "sm",
 			className: n("metadata-list--component", "metadata-list-container @container/metadata-list", h),
 			children: [
-				!!E && /* @__PURE__ */ F(l, {
+				!!E && /* @__PURE__ */ F(a, {
 					tag: "div",
 					className: n("metadata-list--title", T),
 					children: p
 				}),
-				!!D && /* @__PURE__ */ F(O, { className: "metadata-list--title-separator mb-space-md" }),
-				/* @__PURE__ */ F(d, {
+				!!O && /* @__PURE__ */ F(D, { className: "metadata-list--title-separator" }),
+				/* @__PURE__ */ F(u, {
 					direction: "horizontal",
+					align: "baseline",
 					gap: S ? "sm" : "md",
 					className: "metadata-list--inline",
 					children: x.map((t, i) => {
-						let c = X(t, i), u = t.emptyLabel ?? f, p = t.value === null || t.value === void 0, m = t.value ?? u, h = t.icon, g = t.tooltip !== null && t.tooltip !== void 0, v = typeof t.render == "function", y = e && i < x.length - 1;
-						return /* @__PURE__ */ I(N.Fragment, { children: [/* @__PURE__ */ I(d, {
+						let l = X(t, i), d = t.emptyLabel ?? f, p = t.value === null || t.value === void 0, m = t.value ?? d, h = t.icon, g = t.tooltip !== null && t.tooltip !== void 0, v = typeof t.render == "function", y = e && i < x.length - 1;
+						return /* @__PURE__ */ I(N.Fragment, { children: [/* @__PURE__ */ I(u, {
 							direction: "horizontal",
-							gap: "md",
-							className: "metadata-list--item min-w-0 items-start [&>*]:max-w-full [&>*]:min-w-0 [&>.badge--component]:self-start",
+							align: "baseline",
+							gap: "xs",
+							className: "metadata-list--item min-w-0 [&>*]:max-w-full [&>*]:min-w-0 [&>.badge--component]:self-center",
 							children: [
-								!!h && /* @__PURE__ */ F(h, { className: n("flex-shrink-0", S ? "size-icon-sm" : "size-icon", "text-muted-foreground") }),
-								/* @__PURE__ */ I(d, {
+								!!h && /* @__PURE__ */ F(h, { className: n("flex-shrink-0 self-center", S ? "size-icon-sm" : "size-icon", "text-muted-foreground") }),
+								/* @__PURE__ */ I(u, {
 									direction: "horizontal",
 									gap: "none",
 									align: "baseline",
 									className: "min-w-0",
 									children: [
-										/* @__PURE__ */ F(l, {
+										/* @__PURE__ */ F(a, {
 											className: n("metadata-list--label whitespace-nowrap", C),
 											children: t.label
 										}),
-										!!g && /* @__PURE__ */ I(a, { children: [/* @__PURE__ */ F(r, { render: (e) => /* @__PURE__ */ F(Q, {
+										!!g && /* @__PURE__ */ I(o, { children: [/* @__PURE__ */ F(s, { render: (e) => /* @__PURE__ */ F(Q, {
 											triggerProps: e,
 											ariaLabel: typeof t.label == "string" ? b.formatInfoAriaLabel(t.label) : b.infoFallback
-										}) }), /* @__PURE__ */ F(o, {
+										}) }), /* @__PURE__ */ F(c, {
 											side: "top",
 											align: "start",
 											className: "max-w-xs",
-											children: /* @__PURE__ */ F(s, {
+											children: /* @__PURE__ */ F(r, {
 												type: "inverse",
 												size: "xs",
 												children: t.tooltip
 											})
 										})] }),
-										/* @__PURE__ */ F(s, {
-											size: "inherit",
+										/* @__PURE__ */ F(r, {
+											tag: "span",
+											size: "sm",
 											type: "secondary",
 											children: _
 										})
@@ -903,16 +1110,17 @@ function Te({ items: e, columns: i = 2, density: c = "default", emptyLabel: f =
 								v ? t.render?.(t) : Z({
 									value: m,
 									isEmptyValue: p,
-									emptyLabel: u,
+									emptyLabel: d,
 									valueBase: n(w, "leading-tight")
 								})
 							]
-						}), !!y && /* @__PURE__ */ F(s, {
-							size: "inherit",
+						}), !!y && /* @__PURE__ */ F(r, {
+							tag: "span",
+							size: "sm",
 							type: "secondary",
 							className: "metadata-list--item-separator",
 							children: e
-						})] }, c);
+						})] }, l);
 					})
 				})
 			]
@@ -920,39 +1128,40 @@ function Te({ items: e, columns: i = 2, density: c = "default", emptyLabel: f =
 	}
 	if (g === "rows") {
 		let e = S ? "py-row-y-sm" : "py-row-y";
-		return /* @__PURE__ */ I("div", {
+		return /* @__PURE__ */ I(u, {
+			gap: "sm",
 			className: n("metadata-list--component", "metadata-list-container @container/metadata-list", h),
 			children: [
-				!!E && /* @__PURE__ */ F(l, {
+				!!E && /* @__PURE__ */ F(a, {
 					tag: "div",
-					className: n("metadata-list--title mb-space-md", T),
+					className: n("metadata-list--title", T),
 					children: p
 				}),
-				!!D && /* @__PURE__ */ F(O, { className: "metadata-list--title-separator mb-space-md" }),
-				/* @__PURE__ */ F(d, {
+				!!O && /* @__PURE__ */ F(D, { className: "metadata-list--title-separator" }),
+				/* @__PURE__ */ F(u, {
 					render: /* @__PURE__ */ F("dl", {}),
 					gap: "none",
-					className: "metadata-list--rows divide-y divide-border/50",
+					className: "metadata-list--rows m-0 divide-y divide-border/50",
 					children: x.map((t, i) => {
-						let c = X(t, i), u = t.emptyLabel ?? f, d = t.value === null || t.value === void 0, p = t.value ?? u, m = t.icon, h = t.tooltip !== null && t.tooltip !== void 0, g = typeof t.render == "function";
+						let l = X(t, i), u = t.emptyLabel ?? f, d = t.value === null || t.value === void 0, p = t.value ?? u, m = t.icon, h = t.tooltip !== null && t.tooltip !== void 0, g = typeof t.render == "function";
 						return /* @__PURE__ */ I("div", {
-							className: n("metadata-list--item grid items-baseline gap-x-space-xl gap-y-space-sm grid-cols-[minmax(0,1fr)_minmax(0,2fr)]", e),
+							className: n("metadata-list--item flex items-baseline justify-between gap-x-space-md", e),
 							children: [/* @__PURE__ */ I("dt", {
-								className: "flex items-center gap-space-sm min-w-0",
+								className: "flex shrink-0 items-center gap-space-sm min-w-0",
 								children: [
 									!!m && /* @__PURE__ */ F(m, { className: n("flex-shrink-0 text-muted-foreground", S ? "size-icon-sm" : "size-icon") }),
-									/* @__PURE__ */ F(l, {
-										className: n("metadata-list--label truncate", C),
+									/* @__PURE__ */ F(a, {
+										className: n("metadata-list--label", C),
 										children: t.label
 									}),
-									!!h && /* @__PURE__ */ I(a, { children: [/* @__PURE__ */ F(r, { render: (e) => /* @__PURE__ */ F(Q, {
+									!!h && /* @__PURE__ */ I(o, { children: [/* @__PURE__ */ F(s, { render: (e) => /* @__PURE__ */ F(Q, {
 										triggerProps: e,
 										ariaLabel: typeof t.label == "string" ? b.formatInfoAriaLabel(t.label) : b.infoFallback
-									}) }), /* @__PURE__ */ F(o, {
+									}) }), /* @__PURE__ */ F(c, {
 										side: "top",
 										align: "start",
 										className: "max-w-xs",
-										children: /* @__PURE__ */ F(s, {
+										children: /* @__PURE__ */ F(r, {
 											type: "inverse",
 											size: "xs",
 											children: t.tooltip
@@ -960,61 +1169,64 @@ function Te({ items: e, columns: i = 2, density: c = "default", emptyLabel: f =
 									})] })
 								]
 							}), /* @__PURE__ */ I("dd", {
-								className: "min-w-0 break-words [overflow-wrap:anywhere] [&>*]:max-w-full [&>*]:min-w-0",
+								className: "m-0 grid min-w-0 justify-items-end text-right gap-dense break-words [overflow-wrap:anywhere] [&>*]:max-w-full [&>*]:min-w-0 [&>.badge--component]:justify-self-end",
 								children: [g ? t.render?.(t) : Z({
 									value: p,
 									isEmptyValue: d,
 									emptyLabel: u,
-									valueBase: n(w, "break-words leading-tight")
-								}), !!t.description && /* @__PURE__ */ F(s, {
-									size: "inherit",
+									valueBase: n(w, "text-right break-words leading-tight")
+								}), !!t.description && /* @__PURE__ */ F(r, {
+									size: "xs",
 									type: "secondary",
-									className: "metadata-list--description mt-space-xs text-xs leading-snug",
+									align: "right",
+									lineHeight: "snug",
+									className: "metadata-list--description",
 									children: t.description
 								})]
 							})]
-						}, c);
+						}, l);
 					})
 				})
 			]
 		});
 	}
-	return /* @__PURE__ */ I("div", {
+	return /* @__PURE__ */ I(u, {
+		gap: "sm",
 		className: n("metadata-list--component", "metadata-list-container @container/metadata-list", h),
 		children: [
-			!!E && /* @__PURE__ */ F(l, {
+			!!E && /* @__PURE__ */ F(a, {
 				tag: "div",
 				className: n("metadata-list--title", T),
 				children: p
 			}),
-			!!D && /* @__PURE__ */ F(O, { className: "metadata-list--title-separator mb-space-md" }),
-			/* @__PURE__ */ F(u, {
-				columns: Se(i),
+			!!O && /* @__PURE__ */ F(D, { className: "metadata-list--title-separator" }),
+			/* @__PURE__ */ F(l, {
+				columns: Ce(i),
 				gap: S ? "md" : "xl",
 				align: "start",
 				className: "metadata-list--grid",
 				children: x.map((e, t) => {
-					let i = X(e, t), c = e.emptyLabel ?? f, u = e.value === null || e.value === void 0, p = e.value ?? c, m = e.icon, h = e.tooltip !== null && e.tooltip !== void 0, g = typeof e.render == "function";
-					return /* @__PURE__ */ I(d, {
-						gap: "sm",
+					let i = X(e, t), l = e.emptyLabel ?? f, d = e.value === null || e.value === void 0, p = e.value ?? l, m = e.icon, h = e.tooltip !== null && e.tooltip !== void 0, g = typeof e.render == "function";
+					return /* @__PURE__ */ I(u, {
+						gap: S ? "2xs" : "xs",
 						className: "metadata-list--item min-w-0 items-start [&>*]:max-w-full [&>*]:min-w-0 [&>.badge--component]:self-start",
 						children: [
 							/* @__PURE__ */ I("div", {
 								className: "flex items-center gap-space-sm",
 								children: [
 									!!m && /* @__PURE__ */ F(m, { className: n("flex-shrink-0", S ? "size-icon-sm" : "size-icon", "text-muted-foreground") }),
-									/* @__PURE__ */ F(l, {
+									/* @__PURE__ */ F(a, {
 										className: n("metadata-list--label", C),
 										children: e.label
 									}),
-									!!h && /* @__PURE__ */ I(a, { children: [/* @__PURE__ */ F(r, { render: (t) => /* @__PURE__ */ F(Q, {
+									!!h && /* @__PURE__ */ I(o, { children: [/* @__PURE__ */ F(s, { render: (t) => /* @__PURE__ */ F(Q, {
 										triggerProps: t,
 										ariaLabel: typeof e.label == "string" ? b.formatInfoAriaLabel(e.label) : b.infoFallback
-									}) }), /* @__PURE__ */ F(o, {
+									}) }), /* @__PURE__ */ F(c, {
 										side: "top",
 										align: "start",
 										className: "max-w-xs",
-										children: /* @__PURE__ */ F(s, {
+										children: /* @__PURE__ */ F(r, {
 											type: "inverse",
 											size: "xs",
 											children: e.tooltip
@@ -1024,14 +1236,15 @@ function Te({ items: e, columns: i = 2, density: c = "default", emptyLabel: f =
 							}),
 							g ? e.render?.(e) : Z({
 								value: p,
-								isEmptyValue: u,
-								emptyLabel: c,
+								isEmptyValue: d,
+								emptyLabel: l,
 								valueBase: n(w, "leading-tight")
 							}),
-							!!e.description && /* @__PURE__ */ F(s, {
-								size: "inherit",
+							!!e.description && /* @__PURE__ */ F(r, {
+								size: "xs",
 								type: "secondary",
-								className: "metadata-list--description text-xs leading-snug",
+								lineHeight: "snug",
+								className: "metadata-list--description",
 								children: e.description
 							})
 						]
@@ -1041,31 +1254,31 @@ function Te({ items: e, columns: i = 2, density: c = "default", emptyLabel: f =
 		]
 	});
 }
-Te.displayName = "MetadataList";
+Ee.displayName = "MetadataList";
 //#endregion
 //#region src/components/blocks/data-display/relationship-card-frame.tsx
-function Ee(e) {
-	return e ? typeof e == "object" && !Array.isArray(e) && "label" in e ? /* @__PURE__ */ F(D, {
+function De(e) {
+	return e ? typeof e == "object" && !Array.isArray(e) && "label" in e ? /* @__PURE__ */ F(E, {
 		inline: !0,
 		tone: e.tone ?? "secondary",
 		size: e.size,
 		children: e.label
 	}) : e : null;
 }
-var $ = ie(function({ icon: e, title: t, titleBadge: r, alertSlot: i, metadataSlot: a, primaryActionSlot: o, overflowActionSlot: c, selectorSlot: l, detailsSlot: u, className: f, headerClassName: p, bodyClassName: m, ...h }, g) {
-	let _ = !!i || !!a || !!o || !!l || !!u;
-	return /* @__PURE__ */ I(d, {
+var $ = ie(function({ icon: e, title: t, titleBadge: i, alertSlot: a, metadataSlot: o, primaryActionSlot: s, overflowActionSlot: c, selectorSlot: l, detailsSlot: d, className: f, headerClassName: p, bodyClassName: m, ...h }, g) {
+	let _ = !!a || !!o || !!s || !!l || !!d;
+	return /* @__PURE__ */ I(u, {
 		ref: g,
 		className: n("relationship-card-frame--component", f),
 		...h,
-		children: [/* @__PURE__ */ I(d, {
+		children: [/* @__PURE__ */ I(u, {
 			direction: "horizontal",
 			gap: "md",
 			align: "start",
 			justify: "between",
 			wrap: !1,
 			className: n("relationship-card-frame--header", p),
-			children: [/* @__PURE__ */ I(d, {
+			children: [/* @__PURE__ */ I(u, {
 				direction: "horizontal",
 				gap: "md",
 				align: "start",
@@ -1076,18 +1289,18 @@ var $ = ie(function({ icon: e, title: t, titleBadge: r, alertSlot: i, metadataSl
 					children: e
 				}), /* @__PURE__ */ F("div", {
 					className: "min-w-0",
-					children: /* @__PURE__ */ I(d, {
+					children: /* @__PURE__ */ I(u, {
 						direction: "horizontal",
 						gap: "sm",
 						className: "relationship-card-frame--title-row",
-						children: [/* @__PURE__ */ F(s, {
+						children: [/* @__PURE__ */ F(r, {
 							tag: "div",
 							weight: "medium",
 							className: "relationship-card-frame--title truncate",
 							children: t
-						}), !!r && /* @__PURE__ */ F("span", {
+						}), !!i && /* @__PURE__ */ F("span", {
 							className: "relationship-card-frame--title-badge inline-flex",
-							children: Ee(r)
+							children: De(i)
 						})]
 					})
 				})]
@@ -1095,28 +1308,28 @@ var $ = ie(function({ icon: e, title: t, titleBadge: r, alertSlot: i, metadataSl
 				className: "relationship-card-frame--overflow shrink-0",
 				children: c
 			})]
-		}), !!_ && /* @__PURE__ */ I(d, {
+		}), !!_ && /* @__PURE__ */ I(u, {
 			className: n("relationship-card-frame--body", m),
 			children: [
-				!!i && /* @__PURE__ */ F("div", {
+				!!a && /* @__PURE__ */ F("div", {
 					className: "relationship-card-frame--alert",
-					children: i
+					children: a
 				}),
 				!!l && /* @__PURE__ */ F("div", {
 					className: "relationship-card-frame--selector",
 					children: l
 				}),
-				!!a && /* @__PURE__ */ F("div", {
+				!!o && /* @__PURE__ */ F("div", {
 					className: "relationship-card-frame--metadata",
-					children: a
+					children: o
 				}),
-				!!o && /* @__PURE__ */ F("div", {
+				!!s && /* @__PURE__ */ F("div", {
 					className: "relationship-card-frame--primary-action",
-					children: o
+					children: s
 				}),
-				!!u && /* @__PURE__ */ F("div", {
+				!!d && /* @__PURE__ */ F("div", {
 					className: "relationship-card-frame--details",
-					children: u
+					children: d
 				})
 			]
 		})]
@@ -1124,6 +1337,6 @@ var $ = ie(function({ icon: e, title: t, titleBadge: r, alertSlot: i, metadataSl
 });
 $.displayName = "RelationshipCardFrame";
 //#endregion
-export { R as _, he as a, q as c, W as d, U as f, z as g, B as h, ge as i, K as l, V as m, Te as n, me as o, H as p, Y as r, J as s, $ as t, G as u };
+export { R as _, ge as a, q as c, W as d, U as f, z as g, B as h, _e as i, K as l, V as m, Ee as n, he as o, H as p, Y as r, J as s, $ as t, G as u };
 
-//# sourceMappingURL=data-display-b3d1TfL4.js.map
+//# sourceMappingURL=data-display-Bihs9Ven.js.map