themelia-react-ui 1.0.1 → 2.0.0

package/dist/data-display-3xWQUnMA.js

@@ -0,0 +1,1335 @@
+"use client";
+import { s as e } from "./ui-provider-D2_TeLqw.js";
+import { useStrings as t } from "./lib/strings.js";
+import { t as n } from "./utils-Cospvlj1.js";
+import { a as r, o as i, s as a } from "./typography-CAr3dQhX.js";
+import { a as o, c as s, o as c } from "./button-BS3KDg00.js";
+import { r as l, t as u } from "./structure-hzCW-XsV.js";
+import { i as d, o as f, r as p, s as m } from "./feedback-C7nR0UtT.js";
+import { _ as h, c as g, l as _, m as v, o as y, p as b, s as x } from "./primitives-BHrwQXFC.js";
+import { r as S } from "./number-CKRBYmZK.js";
+import { a as C, r as w, t as T } from "./date-uf3z37Nm.js";
+import { t as E } from "./badge-0tATj-tW.js";
+import { t as D } from "./separator-Do5GWDYi.js";
+import { t as O } from "./field-affordance-recipes-CkOCdE2y.js";
+import { n as k } from "./display-DrdvPwF0.js";
+import { c as ee, n as A, o as j, r as M, t as te, u as ne } from "./item-xzh8Df65.js";
+import N, { forwardRef as P, useId as F } from "react";
+import { Fragment as I, jsx as L, jsxs as R } from "react/jsx-runtime";
+import { Info as re, Search as ie } from "lucide-react";
+//#region src/components/blocks/data-display/dense-info-card/helpers.tsx
+function ae({ value: e, max: t = 5, label: r }) {
+	return /* @__PURE__ */ R("div", {
+		className: n("helpers--component", "flex items-center gap-space-md"),
+		children: [/* @__PURE__ */ L("div", {
+			className: "flex items-center gap-space-xs",
+			children: Array.from({ length: t }, (t, r) => /* @__PURE__ */ L("div", { className: n("h-1.5 w-3 rounded-full", r < e ? "bg-foreground/60" : "bg-muted") }, r))
+		}), !!r && /* @__PURE__ */ L(a, {
+			size: "xs",
+			type: "secondary",
+			children: r
+		})]
+	});
+}
+function z({ label: e, value: t, badge: n, badgeTone: r }) {
+	return /* @__PURE__ */ R(u, {
+		direction: "horizontal",
+		align: "center",
+		justify: "between",
+		gap: "md",
+		children: [
+			/* @__PURE__ */ L(a, {
+				size: "xs",
+				className: "shrink-0 text-muted-foreground",
+				children: e
+			}),
+			!!n && /* @__PURE__ */ L(E, {
+				tone: r ?? "secondary",
+				children: n
+			}),
+			!!t && !n && /* @__PURE__ */ L(a, {
+				weight: "semibold",
+				className: "text-right tabular-nums",
+				children: t
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/blocks/data-display/dense-info-card/partials/dense-info-dashboard.tsx
+function B({ title: e, description: t, statusBadges: r, rows: i, secondaryRows: o, scale: s, footerBadges: c, footerText: l, actions: d, className: f }) {
+	return /* @__PURE__ */ L(k, {
+		title: e,
+		description: t,
+		titleSuffix: r.length > 0 ? /* @__PURE__ */ L(u, {
+			direction: "horizontal",
+			wrap: !0,
+			align: "center",
+			gap: "sm",
+			children: r.map((e) => /* @__PURE__ */ L(E, {
+				tone: e.tone,
+				children: e.label
+			}, e.label))
+		}) : void 0,
+		actions: d,
+		className: n("dense-info-dashboard--component", f),
+		children: /* @__PURE__ */ R(u, {
+			gap: "2xl",
+			children: [
+				/* @__PURE__ */ R(u, {
+					gap: "md",
+					children: [i.map((e) => /* @__PURE__ */ L(z, { ...e }, e.label)), !!s && /* @__PURE__ */ R("div", {
+						className: "flex items-center justify-between",
+						children: [/* @__PURE__ */ L(a, {
+							size: "xs",
+							className: "text-muted-foreground",
+							children: s.label
+						}), /* @__PURE__ */ L(ae, {
+							value: s.value,
+							max: s.max,
+							label: `${String(s.value)}/${String(s.max ?? 5)}`
+						})]
+					})]
+				}),
+				!!o && o.length > 0 && /* @__PURE__ */ L(u, {
+					gap: "md",
+					children: o.map((e) => /* @__PURE__ */ L(z, { ...e }, e.label))
+				}),
+				(!!c || !!l) && /* @__PURE__ */ R(u, {
+					direction: "horizontal",
+					wrap: !0,
+					align: "center",
+					gap: "md",
+					children: [!!c && c.map((e) => /* @__PURE__ */ L(E, {
+						tone: e.tone,
+						children: e.label
+					}, e.label)), !!l && /* @__PURE__ */ L(a, {
+						size: "xs",
+						className: "text-muted-foreground",
+						children: l
+					})]
+				})
+			]
+		})
+	});
+}
+B.displayName = "DenseInfoDashboard";
+//#endregion
+//#region src/components/blocks/data-display/inline-stat/inline-stat.tsx
+function V({ label: e, value: t, layout: i = "between", mono: a = !1, className: o, labelClassName: s, valueClassName: c }) {
+	let l = a ? v : h, d = L(typeof e == "string" || typeof e == "number" ? r : "span", {
+		className: s,
+		children: e
+	});
+	return i === "stacked" ? /* @__PURE__ */ R(u, {
+		gap: "2xs",
+		className: n("inline-stat--component", o),
+		children: [d, /* @__PURE__ */ L(l, {
+			size: "inherit",
+			className: n("text-sm leading-snug", a && "tabular-nums", c),
+			children: t
+		})]
+	}) : /* @__PURE__ */ R(u, {
+		direction: "horizontal",
+		gap: "md",
+		justify: i === "between" ? "between" : "start",
+		wrap: !1,
+		className: n("inline-stat--component", o),
+		children: [d, /* @__PURE__ */ L(l, {
+			size: "inherit",
+			className: n("text-sm leading-snug", a && "tabular-nums", c),
+			children: t
+		})]
+	});
+}
+V.displayName = "InlineStat";
+//#endregion
+//#region src/components/blocks/data-display/dense-info-card/dense-info.strings.ts
+var H = {
+	total: "Total",
+	tasks: "tasks",
+	priority: "priority"
+};
+//#endregion
+//#region src/components/blocks/data-display/dense-info-card/partials/dense-info-classification.tsx
+function U({ title: e, description: r, stats: o, items: s, totalLabel: c, totalValue: d, footerBadges: f, footerText: p, actions: m, className: g, strings: _ }) {
+	let v = t(H, _);
+	return /* @__PURE__ */ L(k, {
+		title: e,
+		description: r,
+		actions: m,
+		className: n("dense-info-classification--component", g),
+		children: /* @__PURE__ */ R(u, {
+			gap: "2xl",
+			children: [
+				/* @__PURE__ */ L(l, {
+					columns: {
+						base: 2,
+						sm: 3
+					},
+					gap: "xl",
+					children: o.map((e) => /* @__PURE__ */ R(u, {
+						gap: "dense",
+						className: "min-w-0 items-start",
+						children: [
+							/* @__PURE__ */ L(i, {
+								tag: "h4",
+								className: "border-none pb-0 text-base font-semibold tabular-nums",
+								children: e.value
+							}),
+							/* @__PURE__ */ L(a, {
+								size: "xs",
+								type: "secondary",
+								weight: "medium",
+								children: e.label
+							}),
+							!!e.trendBadge && /* @__PURE__ */ L(E, {
+								tone: e.trendTone ?? "secondary",
+								className: "self-start",
+								children: e.trendBadge
+							})
+						]
+					}, e.label))
+				}),
+				/* @__PURE__ */ R(u, {
+					gap: "md",
+					children: [/* @__PURE__ */ L(j, { children: s.map((e) => /* @__PURE__ */ R(te, {
+						size: "sm",
+						role: "listitem",
+						children: [
+							/* @__PURE__ */ L(ee, { children: /* @__PURE__ */ L("span", { className: n("h-2 w-2 shrink-0 rounded-full", e.dotColor) }) }),
+							/* @__PURE__ */ L(M, { children: /* @__PURE__ */ R(ne, {
+								bold: !1,
+								className: "gap-space-md",
+								children: [e.label, !!e.badge && /* @__PURE__ */ L(E, {
+									tone: e.badgeTone ?? "secondary",
+									children: e.badge
+								})]
+							}) }),
+							/* @__PURE__ */ L(A, { children: /* @__PURE__ */ L(h, {
+								weight: "semibold",
+								className: "tabular-nums",
+								children: e.value
+							}) })
+						]
+					}, e.label)) }), !!d && /* @__PURE__ */ R(I, { children: [/* @__PURE__ */ L(D, {}), /* @__PURE__ */ L(V, {
+						label: /* @__PURE__ */ L(a, {
+							tag: "span",
+							weight: "bold",
+							lineHeight: "tight",
+							children: c ?? v.total
+						}),
+						value: d,
+						valueClassName: "text-sm font-bold tabular-nums"
+					})] })]
+				}),
+				(!!f || !!p) && /* @__PURE__ */ R(u, {
+					direction: "horizontal",
+					wrap: !0,
+					align: "center",
+					gap: "md",
+					children: [!!f && f.map((e) => /* @__PURE__ */ L(E, {
+						tone: e.tone,
+						children: e.label
+					}, e.label)), !!p && /* @__PURE__ */ L(a, {
+						size: "xs",
+						className: "text-muted-foreground",
+						children: p
+					})]
+				})
+			]
+		})
+	});
+}
+U.displayName = "DenseInfoClassification";
+//#endregion
+//#region src/components/blocks/data-display/dense-info-card/partials/dense-info-financial.tsx
+function W({ title: e, description: r, headerBadges: i, lineItems: o, totalLabel: s, totalAmount: c, footerBadges: l, footerText: d, actions: f, className: p, strings: m }) {
+	let g = t(H, m);
+	return /* @__PURE__ */ L(k, {
+		title: e,
+		description: r,
+		titleSuffix: i.length > 0 ? /* @__PURE__ */ L(u, {
+			direction: "horizontal",
+			wrap: !0,
+			align: "center",
+			gap: "sm",
+			children: i.map((e) => /* @__PURE__ */ L(E, {
+				tone: e.tone,
+				children: e.label
+			}, e.label))
+		}) : void 0,
+		actions: f,
+		className: n("dense-info-financial--component", p),
+		children: /* @__PURE__ */ R(u, {
+			gap: "2xl",
+			children: [/* @__PURE__ */ R(u, {
+				gap: "md",
+				children: [/* @__PURE__ */ L(j, { children: o.map((e) => /* @__PURE__ */ R(te, {
+					size: "sm",
+					role: "listitem",
+					children: [/* @__PURE__ */ L(M, { children: /* @__PURE__ */ R(ne, {
+						className: "gap-space-md",
+						children: [e.label, !!e.badge && /* @__PURE__ */ L(E, {
+							tone: e.badgeTone ?? "secondary",
+							children: e.badge
+						})]
+					}) }), /* @__PURE__ */ L(A, { children: /* @__PURE__ */ L(h, {
+						weight: "semibold",
+						className: "tabular-nums",
+						children: e.amount
+					}) })]
+				}, e.label)) }), !!c && /* @__PURE__ */ R(I, { children: [/* @__PURE__ */ L(D, {}), /* @__PURE__ */ L(V, {
+					label: /* @__PURE__ */ L(a, {
+						tag: "span",
+						weight: "semibold",
+						lineHeight: "tight",
+						children: s ?? g.total
+					}),
+					value: c,
+					valueClassName: "text-sm font-semibold tabular-nums"
+				})] })]
+			}), (!!l || !!d) && /* @__PURE__ */ R(u, {
+				direction: "horizontal",
+				wrap: !0,
+				align: "center",
+				gap: "md",
+				children: [!!l && l.map((e) => /* @__PURE__ */ L(E, {
+					tone: e.tone,
+					children: e.label
+				}, e.label)), !!d && /* @__PURE__ */ L(a, {
+					size: "xs",
+					className: "text-muted-foreground",
+					children: d
+				})]
+			})]
+		})
+	});
+}
+W.displayName = "DenseInfoFinancial";
+//#endregion
+//#region src/components/blocks/data-display/dense-info-card/partials/dense-info-project.tsx
+function G({ title: e, description: r, statusLabel: o, statusTone: s, metaPairs: c, date: l, priority: d, completedTasks: f, totalTasks: p, actions: m, className: h, strings: g }) {
+	let _ = t(H, g), v = p > 0 ? Math.round(f / p * 100) : 0, y = 2 * Math.PI * 7, b = y - v / 100 * y;
+	return /* @__PURE__ */ L(k, {
+		padding: "md",
+		actions: m,
+		className: n("dense-info-project-card--component", h),
+		children: /* @__PURE__ */ R(u, {
+			gap: "lg",
+			children: [
+				/* @__PURE__ */ R(u, {
+					gap: "normal",
+					children: [/* @__PURE__ */ R(u, {
+						direction: "horizontal",
+						wrap: !0,
+						align: "center",
+						gap: "sm",
+						children: [/* @__PURE__ */ L(i, {
+							tag: "h5",
+							className: "font-bold border-none pb-0",
+							children: e
+						}), /* @__PURE__ */ L(E, {
+							tone: s,
+							dot: !0,
+							children: o
+						})]
+					}), !!r && /* @__PURE__ */ L(a, {
+						type: "secondary",
+						className: "line-clamp-2",
+						children: r
+					})]
+				}),
+				!!c && c.length > 0 && /* @__PURE__ */ L(u, {
+					direction: "horizontal",
+					wrap: !0,
+					align: "center",
+					gap: "sm",
+					children: c.map((e, t) => /* @__PURE__ */ R("span", {
+						className: "flex items-center gap-space-xs",
+						children: [
+							t > 0 && /* @__PURE__ */ L(a, {
+								tag: "span",
+								type: "discrete",
+								children: "•"
+							}),
+							!!e.icon && /* @__PURE__ */ L("span", {
+								className: "text-muted-foreground",
+								children: e.icon
+							}),
+							/* @__PURE__ */ L(a, {
+								size: "xs",
+								type: "secondary",
+								children: e.label
+							})
+						]
+					}, e.label))
+				}),
+				(!!l || !!d) && /* @__PURE__ */ R(u, {
+					direction: "horizontal",
+					align: "center",
+					justify: "between",
+					gap: "md",
+					children: [!!l && /* @__PURE__ */ L(a, {
+						size: "xs",
+						type: "secondary",
+						children: l
+					}), !!d && /* @__PURE__ */ R(a, {
+						size: "xs",
+						type: "secondary",
+						children: [
+							d,
+							" ",
+							_.priority
+						]
+					})]
+				}),
+				/* @__PURE__ */ R("div", {
+					className: "flex items-center gap-space-md",
+					children: [/* @__PURE__ */ R("svg", {
+						width: "20",
+						height: "20",
+						viewBox: "0 0 20 20",
+						className: "shrink-0",
+						"aria-hidden": "true",
+						children: [/* @__PURE__ */ L("circle", {
+							cx: "10",
+							cy: "10",
+							r: "7",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: "2",
+							className: "stroke-border"
+						}), /* @__PURE__ */ L("circle", {
+							cx: "10",
+							cy: "10",
+							r: "7",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: "2",
+							strokeDasharray: y,
+							strokeDashoffset: b,
+							strokeLinecap: "round",
+							className: "text-primary-accent",
+							transform: "rotate(-90 10 10)"
+						})]
+					}), /* @__PURE__ */ R(a, {
+						size: "xs",
+						weight: "medium",
+						children: [
+							f,
+							"/",
+							p,
+							" ",
+							_.tasks
+						]
+					})]
+				})
+			]
+		})
+	});
+}
+G.displayName = "DenseInfoProjectCard";
+//#endregion
+//#region src/components/blocks/data-display/dense-info-card/partials/dense-info-score.tsx
+function K({ title: e, description: t, statusBadges: r, 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__ */ L(k, {
+		title: e,
+		description: t,
+		titleSuffix: r.length > 0 ? /* @__PURE__ */ L(u, {
+			direction: "horizontal",
+			wrap: !0,
+			align: "center",
+			gap: "sm",
+			children: r.map((e) => /* @__PURE__ */ L(E, {
+				tone: e.tone,
+				children: e.label
+			}, e.label))
+		}) : void 0,
+		actions: p,
+		className: n("dense-info-score-card--component", m),
+		children: /* @__PURE__ */ R(u, {
+			gap: "2xl",
+			children: [
+				/* @__PURE__ */ R(u, {
+					gap: "md",
+					align: "center",
+					children: [/* @__PURE__ */ L(i, {
+						tag: "h2",
+						className: "text-base font-bold tabular-nums border-none pb-0",
+						children: String(o)
+					}), /* @__PURE__ */ L(u, {
+						direction: "horizontal",
+						align: "center",
+						justify: "center",
+						gap: "xs",
+						children: Array.from({ length: l }, (e, t) => /* @__PURE__ */ L("div", { className: n("h-5 w-2 rounded-radius-sm", t < c ? h : "bg-muted") }, t))
+					})]
+				}),
+				/* @__PURE__ */ L(u, {
+					gap: "md",
+					children: d.map((e) => /* @__PURE__ */ L(V, {
+						label: /* @__PURE__ */ L(a, {
+							tag: "span",
+							size: "xs",
+							type: "secondary",
+							weight: "medium",
+							lineHeight: "tight",
+							children: e.label
+						}),
+						value: e.value,
+						valueClassName: "text-sm font-semibold text-right tabular-nums"
+					}, e.label))
+				}),
+				!!f && f.length > 0 && /* @__PURE__ */ L(u, {
+					direction: "horizontal",
+					wrap: !0,
+					align: "center",
+					gap: "md",
+					children: f.map((e) => /* @__PURE__ */ L(E, {
+						tone: e.tone,
+						children: e.label
+					}, e.label))
+				})
+			]
+		})
+	});
+}
+K.displayName = "DenseInfoScoreCard";
+//#endregion
+//#region src/components/blocks/data-display/empty-state/empty-state.strings.ts
+var q = {
+	title: "Nothing here yet",
+	description: "Once data lands, it will show up in this view.",
+	ariaLabel: "Empty state"
+}, oe = {
+	sm: "!p-surface-xs",
+	md: "!p-surface",
+	lg: "!p-surface-lg"
+}, se = {
+	none: "default",
+	icon: "icon",
+	"icon-soft": "icon",
+	illustration: "default"
+}, ce = {
+	none: void 0,
+	icon: void 0,
+	"icon-soft": "bg-muted/40 text-muted-foreground",
+	illustration: "mb-space-xl"
+}, J = P(function({ title: r, 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(q, b), { defaultScale: w } = e(), T = _ ?? w ?? "md", E = r ?? C.title, D = o === !1 ? null : o ?? C.description, O = l ? l({ mediaVariant: c }) : s, k = !!O;
+	return /* @__PURE__ */ R(p, {
+		ref: S,
+		role: "status",
+		"aria-label": x ?? C.ariaLabel,
+		className: n("empty-state--component", oe[T], v ? "border-border border border-dashed" : "border-border border-0", y),
+		children: [/* @__PURE__ */ R(f, {
+			className: "empty-state--header",
+			children: [
+				!!k && /* @__PURE__ */ L(m, {
+					variant: se[c],
+					className: n("empty-state--media", ce[c]),
+					children: O
+				}),
+				/* @__PURE__ */ L(i, {
+					tag: "h3",
+					align: "center",
+					className: "empty-state--title border-0 pb-0",
+					"data-slot": "empty-title",
+					children: E
+				}),
+				!!D && /* @__PURE__ */ L(a, {
+					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
+				})
+			]
+		}), (!!h || !!g) && /* @__PURE__ */ R(d, {
+			className: "empty-state--content",
+			children: [!!h && /* @__PURE__ */ L(u, {
+				direction: "horizontal",
+				gap: "md",
+				justify: "center",
+				className: "empty-state--actions",
+				children: h
+			}), !!g && /* @__PURE__ */ L(a, {
+				tag: "div",
+				size: "xs",
+				type: "secondary",
+				align: "center",
+				className: "empty-state--footer",
+				children: g
+			})]
+		})]
+	});
+});
+J.displayName = "EmptyState";
+//#endregion
+//#region src/components/blocks/data-display/empty-state/partials/illustrations/document-stack.tsx
+function Y({ className: e }) {
+	return /* @__PURE__ */ L("div", {
+		className: n("document-stack-illustration--component relative h-24 w-32", e),
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ R("svg", {
+			viewBox: "0 0 128 96",
+			className: "h-full w-full overflow-visible",
+			focusable: "false",
+			children: [/* @__PURE__ */ R("g", {
+				transform: "rotate(-6 44 44)",
+				children: [
+					/* @__PURE__ */ L("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__ */ L("rect", {
+						x: 13,
+						y: 13,
+						width: 48,
+						height: 8,
+						rx: 4,
+						className: "fill-muted"
+					}),
+					/* @__PURE__ */ L("rect", {
+						x: 13,
+						y: 27,
+						width: 40,
+						height: 6,
+						rx: 3,
+						className: "fill-muted/60"
+					}),
+					/* @__PURE__ */ L("rect", {
+						x: 13,
+						y: 39,
+						width: 36,
+						height: 6,
+						rx: 3,
+						className: "fill-muted/60"
+					})
+				]
+			}), /* @__PURE__ */ R("g", {
+				transform: "rotate(3 84 48)",
+				children: [
+					/* @__PURE__ */ L("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__ */ L("rect", {
+						x: 53,
+						y: 17,
+						width: 48,
+						height: 8,
+						rx: 4,
+						className: "fill-muted"
+					}),
+					/* @__PURE__ */ L("rect", {
+						x: 53,
+						y: 31,
+						width: 40,
+						height: 6,
+						rx: 3,
+						className: "fill-muted/60"
+					}),
+					/* @__PURE__ */ L("rect", {
+						x: 53,
+						y: 43,
+						width: 36,
+						height: 6,
+						rx: 3,
+						className: "fill-muted/60"
+					}),
+					/* @__PURE__ */ L("circle", {
+						cx: 56,
+						cy: 76,
+						r: 3,
+						className: "fill-success"
+					}),
+					/* @__PURE__ */ L("rect", {
+						x: 63,
+						y: 73,
+						width: 32,
+						height: 6,
+						rx: 3,
+						className: "fill-muted/60"
+					})
+				]
+			})]
+		})
+	});
+}
+Y.displayName = "DocumentStackIllustration";
+//#endregion
+//#region src/components/blocks/data-display/empty-state/partials/illustrations/inbox-clean.tsx
+function le({ className: e }) {
+	let t = F();
+	return /* @__PURE__ */ L("div", {
+		className: n("inbox-clean-illustration--component relative h-24 w-32", e),
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ R("svg", {
+			viewBox: "0 0 128 96",
+			className: "h-full w-full overflow-visible",
+			focusable: "false",
+			children: [
+				/* @__PURE__ */ L("defs", { children: /* @__PURE__ */ L("clipPath", {
+					id: t,
+					children: /* @__PURE__ */ L("rect", {
+						x: .5,
+						y: 40.5,
+						width: 127,
+						height: 55,
+						style: { rx: "var(--radius)" }
+					})
+				}) }),
+				/* @__PURE__ */ L("circle", {
+					cx: 64,
+					cy: 16,
+					r: 15.5,
+					className: "fill-success/12 stroke-success/30"
+				}),
+				/* @__PURE__ */ L("path", {
+					d: "M59 16l3 3 7-7",
+					fill: "none",
+					className: "stroke-success",
+					strokeWidth: 2,
+					strokeLinecap: "round",
+					strokeLinejoin: "round"
+				}),
+				/* @__PURE__ */ L("rect", {
+					x: .5,
+					y: 40.5,
+					width: 127,
+					height: 55,
+					style: { rx: "var(--radius)" },
+					className: "fill-background drop-shadow-xs"
+				}),
+				/* @__PURE__ */ R("g", {
+					clipPath: `url(#${t})`,
+					children: [
+						/* @__PURE__ */ L("rect", {
+							x: 1,
+							y: 41,
+							width: 126,
+							height: 12,
+							className: "fill-muted/30"
+						}),
+						/* @__PURE__ */ L("rect", {
+							x: 13,
+							y: 66,
+							width: 48,
+							height: 6,
+							rx: 3,
+							className: "fill-muted/60"
+						}),
+						/* @__PURE__ */ L("rect", {
+							x: 13,
+							y: 76,
+							width: 32,
+							height: 6,
+							rx: 3,
+							className: "fill-muted/40"
+						}),
+						/* @__PURE__ */ L("circle", {
+							cx: 109,
+							cy: 74,
+							r: 6,
+							className: "fill-muted/40"
+						})
+					]
+				}),
+				/* @__PURE__ */ L("rect", {
+					x: .5,
+					y: 40.5,
+					width: 127,
+					height: 55,
+					style: { rx: "var(--radius)" },
+					fill: "none",
+					className: "stroke-border"
+				})
+			]
+		})
+	});
+}
+le.displayName = "InboxCleanIllustration";
+//#endregion
+//#region src/components/blocks/data-display/empty-state/partials/illustrations/search-glass.tsx
+function ue({ className: e }) {
+	return /* @__PURE__ */ L("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__ */ L(ie, { className: "size-8 text-muted-foreground" })
+	});
+}
+ue.displayName = "SearchGlassIllustration";
+//#endregion
+//#region src/components/blocks/data-display/empty-state/partials/illustrations/stacked-cards.tsx
+function de({ className: e }) {
+	let t = F();
+	return /* @__PURE__ */ L("div", {
+		className: n("stacked-cards-illustration--component relative h-24 w-52", e),
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ R("svg", {
+			viewBox: "0 0 208 96",
+			className: "h-full w-full overflow-visible",
+			focusable: "false",
+			children: [
+				/* @__PURE__ */ L("defs", { children: /* @__PURE__ */ R("linearGradient", {
+					id: t,
+					x1: "0",
+					y1: "0",
+					x2: "0",
+					y2: "1",
+					children: [
+						/* @__PURE__ */ L("stop", {
+							stopColor: "var(--background)",
+							stopOpacity: 0
+						}),
+						/* @__PURE__ */ L("stop", {
+							offset: "0.5",
+							stopColor: "var(--background)",
+							stopOpacity: .6
+						}),
+						/* @__PURE__ */ L("stop", {
+							offset: "1",
+							stopColor: "var(--background)"
+						})
+					]
+				}) }),
+				/* @__PURE__ */ L("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__ */ L("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__ */ L("rect", {
+					x: .5,
+					y: 24.5,
+					width: 207,
+					height: 63,
+					style: { rx: "var(--radius)" },
+					className: "fill-background stroke-border drop-shadow-xs"
+				}),
+				/* @__PURE__ */ L("rect", {
+					x: 17,
+					y: 40,
+					width: 32,
+					height: 32,
+					rx: 4,
+					className: "fill-muted"
+				}),
+				/* @__PURE__ */ L("rect", {
+					x: 61,
+					y: 44,
+					width: 97.5,
+					height: 10,
+					rx: 4,
+					className: "fill-muted"
+				}),
+				/* @__PURE__ */ L("rect", {
+					x: 61,
+					y: 60,
+					width: 65,
+					height: 8,
+					rx: 4,
+					className: "fill-muted/60"
+				}),
+				/* @__PURE__ */ L("rect", {
+					y: 64,
+					width: 208,
+					height: 32,
+					fill: `url(#${t})`
+				})
+			]
+		})
+	});
+}
+de.displayName = "StackedCardsIllustration";
+//#endregion
+//#region src/components/blocks/data-display/empty-state/partials/illustrations/users-circle.tsx
+function fe({ className: e }) {
+	return /* @__PURE__ */ R("div", {
+		className: n("users-circle-illustration--component relative flex h-24 w-32 items-center justify-center", e),
+		"aria-hidden": "true",
+		children: [
+			/* @__PURE__ */ L("div", { className: "bg-muted/70 border-border absolute left-2 size-12 rounded-full border-2" }),
+			/* @__PURE__ */ L("div", { className: "bg-muted border-border z-10 size-14 rounded-full border-2 shadow-sm" }),
+			/* @__PURE__ */ L("div", { className: "bg-muted/60 border-border absolute right-2 size-10 rounded-full border-2" })
+		]
+	});
+}
+fe.displayName = "UsersCircleIllustration";
+//#endregion
+//#region src/components/blocks/data-display/metadata/metadata-list.strings.ts
+var pe = {
+	formatInfoAriaLabel: (e) => `${e} info`,
+	infoFallback: "Info"
+};
+//#endregion
+//#region src/components/blocks/data-display/metadata/metadata-value.tsx
+function me(e) {
+	return e == null || e === "";
+}
+function he(e, t = "—") {
+	return /* @__PURE__ */ L(b, {
+		className: n("metadata-value--component", e),
+		children: t
+	});
+}
+function ge(e) {
+	throw Error("Unsupported metadata value descriptor.");
+}
+function X(e) {
+	if (e.kind === "node") return /* @__PURE__ */ L(I, { children: e.node });
+	if (e.kind === "empty" || e.kind !== "link" && me(e.value)) return he(e.className, e.emptyLabel);
+	switch (e.kind) {
+		case void 0:
+		case "text": return /* @__PURE__ */ L(h, {
+			className: n("metadata-value--component", e.className),
+			children: e.display ?? e.value
+		});
+		case "mono": return /* @__PURE__ */ L(v, {
+			className: n("metadata-value--component", e.className),
+			children: e.display ?? e.value
+		});
+		case "email": return /* @__PURE__ */ L(y, {
+			value: e.value,
+			display: e.display,
+			emptyLabel: e.emptyLabel,
+			className: n("metadata-value--component", e.className)
+		});
+		case "phone": return /* @__PURE__ */ L(g, {
+			value: e.value,
+			display: e.display,
+			emptyLabel: e.emptyLabel,
+			className: n("metadata-value--component", e.className)
+		});
+		case "url": return /* @__PURE__ */ L(_, {
+			value: e.value,
+			display: e.display,
+			emptyLabel: e.emptyLabel,
+			className: n("metadata-value--component", e.className)
+		});
+		case "link": return /* @__PURE__ */ L(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__ */ L(T, {
+			value: e.value,
+			format: e.dateFormat,
+			preset: e.datePreset,
+			locale: e.dateLocale,
+			emptyLabel: e.emptyLabel,
+			className: n("metadata-value--component", e.className)
+		});
+		case "time": return /* @__PURE__ */ L(C, {
+			value: e.value,
+			format: e.timeFormat,
+			preset: e.timePreset,
+			locale: e.dateLocale,
+			emptyLabel: e.emptyLabel,
+			className: n("metadata-value--component", e.className)
+		});
+		case "datetime": return /* @__PURE__ */ L(w, {
+			value: e.value,
+			format: e.dateFormat,
+			timeFormat: e.timeFormat,
+			preset: e.datePreset,
+			locale: e.dateLocale,
+			emptyLabel: e.emptyLabel,
+			className: n("metadata-value--component", e.className)
+		});
+		case "money": return /* @__PURE__ */ L(S, {
+			amount: e.value,
+			currency: e.currency,
+			unit: e.unit,
+			minorUnitScale: e.minorUnitScale,
+			symbol: e.symbol,
+			currencyDisplay: e.currencyDisplay,
+			formatMode: e.formatMode,
+			minimumFractionDigits: e.minimumFractionDigits,
+			maximumFractionDigits: e.maximumFractionDigits,
+			locale: e.locale,
+			emptyLabel: e.emptyLabel,
+			className: n("metadata-value--component", e.className)
+		});
+		case "badge": return /* @__PURE__ */ L(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 ge(e);
+	}
+}
+X.displayName = "MetadataValue";
+//#endregion
+//#region src/components/blocks/data-display/metadata/metadata-list.tsx
+var _e = {
+	1: 1,
+	2: {
+		base: 1,
+		md: 2
+	},
+	3: {
+		base: 1,
+		sm: 2,
+		lg: 3
+	},
+	4: {
+		base: 1,
+		sm: 2,
+		lg: 3,
+		xl: 4
+	}
+};
+function ve(e) {
+	return typeof e == "object" ? e : _e[e];
+}
+var Z = (e, t) => e.id ? e.id : `metadata-${typeof e.label == "string" ? e.label : `${t}`}-${t}`;
+function ye(e) {
+	return typeof e == "string" || typeof e == "number";
+}
+function be(e) {
+	return typeof e == "object" && !!e && !N.isValidElement(e) && !Array.isArray(e) && ("kind" in e || "node" in e || "value" in e);
+}
+function Q({ value: e, isEmptyValue: t, emptyLabel: r, valueBase: i }) {
+	return be(e) ? e.kind === "node" ? /* @__PURE__ */ L(X, { ...e }) : /* @__PURE__ */ L(X, {
+		...e,
+		emptyLabel: e.emptyLabel ?? r,
+		className: n(i, e.className)
+	}) : ye(e) ? /* @__PURE__ */ L(X, {
+		value: e,
+		kind: t ? "empty" : "text",
+		emptyLabel: r,
+		className: i
+	}) : e;
+}
+function $({ triggerProps: e, ariaLabel: t }) {
+	let { className: r, ...i } = e;
+	return /* @__PURE__ */ L("button", {
+		...i,
+		type: "button",
+		className: n("metadata-list--info-trigger", O.target, O.focus, O.clear, r),
+		"aria-label": t,
+		children: /* @__PURE__ */ L(re, {
+			className: n(O.icon, "cursor-help"),
+			"aria-hidden": "true"
+		})
+	});
+}
+function xe({ 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(pe, y), x = N.useMemo(() => e.filter(Boolean), [e]);
+	if (x.length === 0) return null;
+	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__ */ R(u, {
+			gap: "sm",
+			className: n("metadata-list--component", "metadata-list-container @container/metadata-list", h),
+			children: [
+				!!E && /* @__PURE__ */ L(r, {
+					tag: "div",
+					className: n("metadata-list--title", T),
+					children: p
+				}),
+				!!O && /* @__PURE__ */ L(D, { className: "metadata-list--title-separator" }),
+				/* @__PURE__ */ L(u, {
+					direction: "horizontal",
+					align: "baseline",
+					gap: S ? "sm" : "md",
+					className: "metadata-list--inline",
+					children: x.map((t, i) => {
+						let l = Z(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__ */ R(N.Fragment, { children: [/* @__PURE__ */ R(u, {
+							direction: "horizontal",
+							align: "baseline",
+							gap: "xs",
+							className: "metadata-list--item min-w-0 [&>*]:max-w-full [&>*]:min-w-0 [&>.badge--component]:self-center",
+							children: [
+								!!h && /* @__PURE__ */ L(h, { className: n("flex-shrink-0 self-center", S ? "size-icon-sm" : "size-icon", "text-muted-foreground") }),
+								/* @__PURE__ */ R(u, {
+									direction: "horizontal",
+									gap: "none",
+									align: "baseline",
+									className: "min-w-0",
+									children: [
+										/* @__PURE__ */ L(r, {
+											className: n("metadata-list--label whitespace-nowrap", C),
+											children: t.label
+										}),
+										!!g && /* @__PURE__ */ R(o, { children: [/* @__PURE__ */ L(s, { render: (e) => /* @__PURE__ */ L($, {
+											triggerProps: e,
+											ariaLabel: typeof t.label == "string" ? b.formatInfoAriaLabel(t.label) : b.infoFallback
+										}) }), /* @__PURE__ */ L(c, {
+											side: "top",
+											align: "start",
+											className: "max-w-xs",
+											children: /* @__PURE__ */ L(a, {
+												type: "inverse",
+												size: "xs",
+												children: t.tooltip
+											})
+										})] }),
+										/* @__PURE__ */ L(a, {
+											tag: "span",
+											size: "sm",
+											type: "secondary",
+											children: _
+										})
+									]
+								}),
+								v ? t.render?.(t) : Q({
+									value: m,
+									isEmptyValue: p,
+									emptyLabel: d,
+									valueBase: n(w, "leading-tight")
+								})
+							]
+						}), !!y && /* @__PURE__ */ L(a, {
+							tag: "span",
+							size: "sm",
+							type: "secondary",
+							className: "metadata-list--item-separator",
+							children: e
+						})] }, l);
+					})
+				})
+			]
+		});
+	}
+	if (g === "rows") {
+		let e = S ? "py-row-y-sm" : "py-row-y";
+		return /* @__PURE__ */ R(u, {
+			gap: "sm",
+			className: n("metadata-list--component", "metadata-list-container @container/metadata-list", h),
+			children: [
+				!!E && /* @__PURE__ */ L(r, {
+					tag: "div",
+					className: n("metadata-list--title", T),
+					children: p
+				}),
+				!!O && /* @__PURE__ */ L(D, { className: "metadata-list--title-separator" }),
+				/* @__PURE__ */ L(u, {
+					render: /* @__PURE__ */ L("dl", {}),
+					gap: "none",
+					className: "metadata-list--rows m-0 divide-y divide-border/50",
+					children: x.map((t, i) => {
+						let l = Z(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__ */ R("div", {
+							className: n("metadata-list--item grid grid-cols-[minmax(0,1fr)_fit-content(60%)] items-baseline gap-x-space-md", e),
+							children: [/* @__PURE__ */ R("dt", {
+								className: "flex items-center gap-space-sm min-w-0",
+								children: [
+									!!m && /* @__PURE__ */ L(m, { className: n("flex-shrink-0 text-muted-foreground", S ? "size-icon-sm" : "size-icon") }),
+									/* @__PURE__ */ L(r, {
+										className: n("metadata-list--label", C),
+										children: t.label
+									}),
+									!!h && /* @__PURE__ */ R(o, { children: [/* @__PURE__ */ L(s, { render: (e) => /* @__PURE__ */ L($, {
+										triggerProps: e,
+										ariaLabel: typeof t.label == "string" ? b.formatInfoAriaLabel(t.label) : b.infoFallback
+									}) }), /* @__PURE__ */ L(c, {
+										side: "top",
+										align: "start",
+										className: "max-w-xs",
+										children: /* @__PURE__ */ L(a, {
+											type: "inverse",
+											size: "xs",
+											children: t.tooltip
+										})
+									})] })
+								]
+							}), /* @__PURE__ */ R("dd", {
+								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) : Q({
+									value: p,
+									isEmptyValue: d,
+									emptyLabel: u,
+									valueBase: n(w, "text-right break-words leading-tight")
+								}), !!t.description && /* @__PURE__ */ L(a, {
+									size: "xs",
+									type: "secondary",
+									align: "right",
+									lineHeight: "snug",
+									className: "metadata-list--description",
+									children: t.description
+								})]
+							})]
+						}, l);
+					})
+				})
+			]
+		});
+	}
+	return /* @__PURE__ */ R(u, {
+		gap: "sm",
+		className: n("metadata-list--component", "metadata-list-container @container/metadata-list", h),
+		children: [
+			!!E && /* @__PURE__ */ L(r, {
+				tag: "div",
+				className: n("metadata-list--title", T),
+				children: p
+			}),
+			!!O && /* @__PURE__ */ L(D, { className: "metadata-list--title-separator" }),
+			/* @__PURE__ */ L(l, {
+				columns: ve(i),
+				gap: S ? "md" : "xl",
+				align: "start",
+				className: "metadata-list--grid",
+				children: x.map((e, t) => {
+					let i = Z(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__ */ R(u, {
+						gap: S ? "dense" : "normal",
+						className: "metadata-list--item min-w-0 items-start [&>*]:max-w-full [&>*]:min-w-0 [&>.badge--component]:self-start",
+						children: [
+							/* @__PURE__ */ R("div", {
+								className: "flex items-center gap-space-sm",
+								children: [
+									!!m && /* @__PURE__ */ L(m, { className: n("flex-shrink-0", S ? "size-icon-sm" : "size-icon", "text-muted-foreground") }),
+									/* @__PURE__ */ L(r, {
+										className: n("metadata-list--label", C),
+										children: e.label
+									}),
+									!!h && /* @__PURE__ */ R(o, { children: [/* @__PURE__ */ L(s, { render: (t) => /* @__PURE__ */ L($, {
+										triggerProps: t,
+										ariaLabel: typeof e.label == "string" ? b.formatInfoAriaLabel(e.label) : b.infoFallback
+									}) }), /* @__PURE__ */ L(c, {
+										side: "top",
+										align: "start",
+										className: "max-w-xs",
+										children: /* @__PURE__ */ L(a, {
+											type: "inverse",
+											size: "xs",
+											children: e.tooltip
+										})
+									})] })
+								]
+							}),
+							g ? e.render?.(e) : Q({
+								value: p,
+								isEmptyValue: d,
+								emptyLabel: l,
+								valueBase: n(w, "leading-tight")
+							}),
+							!!e.description && /* @__PURE__ */ L(a, {
+								size: "xs",
+								type: "secondary",
+								lineHeight: "snug",
+								className: "metadata-list--description",
+								children: e.description
+							})
+						]
+					}, i);
+				})
+			})
+		]
+	});
+}
+xe.displayName = "MetadataList";
+//#endregion
+//#region src/components/blocks/data-display/relationship-card-frame.tsx
+function Se(e) {
+	return e ? typeof e == "object" && !Array.isArray(e) && "label" in e ? /* @__PURE__ */ L(E, {
+		inline: !0,
+		tone: e.tone ?? "secondary",
+		size: e.size,
+		children: e.label
+	}) : e : null;
+}
+var Ce = P(function({ icon: e, title: t, titleBadge: r, alertSlot: i, metadataSlot: o, primaryActionSlot: s, overflowActionSlot: c, selectorSlot: l, detailsSlot: d, className: f, headerClassName: p, bodyClassName: m, ...h }, g) {
+	let _ = !!i || !!o || !!s || !!l || !!d;
+	return /* @__PURE__ */ R(u, {
+		ref: g,
+		className: n("relationship-card-frame--component", f),
+		...h,
+		children: [/* @__PURE__ */ R(u, {
+			direction: "horizontal",
+			gap: "md",
+			align: "start",
+			justify: "between",
+			wrap: !1,
+			className: n("relationship-card-frame--header", p),
+			children: [/* @__PURE__ */ R(u, {
+				direction: "horizontal",
+				gap: "md",
+				align: "start",
+				wrap: !1,
+				className: "relationship-card-frame--header-start",
+				children: [!!e && /* @__PURE__ */ L("div", {
+					className: "relationship-card-frame--icon mt-space-2xs inline-flex shrink-0 items-center text-muted-foreground",
+					children: e
+				}), /* @__PURE__ */ L("div", {
+					className: "min-w-0",
+					children: /* @__PURE__ */ R(u, {
+						direction: "horizontal",
+						gap: "sm",
+						className: "relationship-card-frame--title-row",
+						children: [/* @__PURE__ */ L(a, {
+							tag: "div",
+							weight: "medium",
+							className: "relationship-card-frame--title truncate",
+							children: t
+						}), !!r && /* @__PURE__ */ L("span", {
+							className: "relationship-card-frame--title-badge inline-flex",
+							children: Se(r)
+						})]
+					})
+				})]
+			}), !!c && /* @__PURE__ */ L("div", {
+				className: "relationship-card-frame--overflow shrink-0",
+				children: c
+			})]
+		}), !!_ && /* @__PURE__ */ R(u, {
+			className: n("relationship-card-frame--body", m),
+			children: [
+				!!i && /* @__PURE__ */ L("div", {
+					className: "relationship-card-frame--alert",
+					children: i
+				}),
+				!!l && /* @__PURE__ */ L("div", {
+					className: "relationship-card-frame--selector",
+					children: l
+				}),
+				!!o && /* @__PURE__ */ L("div", {
+					className: "relationship-card-frame--metadata",
+					children: o
+				}),
+				!!s && /* @__PURE__ */ L("div", {
+					className: "relationship-card-frame--primary-action",
+					children: s
+				}),
+				!!d && /* @__PURE__ */ L("div", {
+					className: "relationship-card-frame--details",
+					children: d
+				})
+			]
+		})]
+	});
+});
+Ce.displayName = "RelationshipCardFrame";
+//#endregion
+export { B as _, de as a, Y as c, K as d, G as f, V as g, H as h, fe as i, J as l, U as m, xe as n, ue as o, W as p, X as r, le as s, Ce as t, q as u };
+
+//# sourceMappingURL=data-display-3xWQUnMA.js.map