admin-ui-starter-kit 0.1.4 → 0.4.2

package/dist/_shared/display-C4n0uuxl.js

@@ -0,0 +1,1154 @@
+import { useStrings as e } from "../lib/strings.js";
+import { m as t } from "./ui-provider-C8Ot88lS.js";
+import { cn as n } from "../lib/utils.js";
+import { n as r, r as i, t as a } from "./heading-HeP06nXG.js";
+import { t as o } from "./badge-yGlx9trX.js";
+import { t as s } from "./button-SuocMQFT.js";
+import { t as c } from "./slot-C5EJicOc.js";
+import { i as l, n as u, t as d } from "./tooltip-CLr_sPX8.js";
+import { r as f, t as p } from "./alert-k60OnTtb.js";
+import { n as m, r as h } from "./form-field-B7taMVbC.js";
+import { t as g } from "./copyable-cfF4gZoT.js";
+import { a as _, i as v, o as y, r as b, t as x } from "./avatar-CBi4LGxy.js";
+import * as S from "react";
+import C, { forwardRef as w, useCallback as T, useEffect as E, useId as D, useMemo as O, useState as k } from "react";
+import { format as A } from "date-fns";
+import { Fragment as j, jsx as M, jsxs as N } from "react/jsx-runtime";
+import { AlertTriangle as P, BadgeCheck as F, CheckCircle2 as I, CircleAlert as ee, Clock as te, ExternalLink as ne, Info as L, RotateCcw as re, Search as ie, ShieldAlert as R, X as ae, XCircle as oe } from "lucide-react";
+import { cva as se } from "class-variance-authority";
+import { Collapsible as z } from "@base-ui/react/collapsible";
+import { Progress as B } from "@base-ui/react/progress";
+import { formatHex as V, oklch as H } from "culori";
+import ce from "qrcode";
+//#region src/components/base/display/notification-banner.tsx
+var le = {
+	info: {
+		wrapper: "border-info/30 bg-info/5",
+		iconRing: "bg-info/15",
+		iconColor: "text-info",
+		title: "text-info",
+		close: "text-info/70 hover:text-info hover:bg-info/10"
+	},
+	success: {
+		wrapper: "border-success/30 bg-success/5",
+		iconRing: "bg-success/15",
+		iconColor: "text-success",
+		title: "text-success",
+		close: "text-success/70 hover:text-success hover:bg-success/10"
+	},
+	error: {
+		wrapper: "border-destructive/30 bg-destructive/5",
+		iconRing: "bg-destructive/15",
+		iconColor: "text-destructive",
+		title: "text-destructive",
+		close: "text-destructive/70 hover:text-destructive hover:bg-destructive/10"
+	},
+	warning: {
+		wrapper: "border-warning/40 bg-warning/10",
+		iconRing: "bg-warning/20",
+		iconColor: "text-warning-foreground",
+		title: "text-warning-foreground",
+		close: "text-warning-foreground/70 hover:text-warning-foreground hover:bg-warning/20"
+	}
+}, ue = {
+	info: L,
+	success: F,
+	error: ee,
+	warning: P
+};
+function de({ html: e }) {
+	return C.createElement("span", { dangerouslySetInnerHTML: { __html: e } });
+}
+function U({ type: e = "info", dismissible: t = !1, title: a, message: o, onDismiss: c, children: l, asHTML: u = !1, dismissAriaLabel: d = "Dismiss notification", className: f }) {
+	let p = le[e], m = ue[e], h = C.useMemo(() => i(o ?? (typeof l == "string" ? l : "")), [l, o]), g = !!a;
+	return /* @__PURE__ */ N("div", {
+		role: "status",
+		className: n("notification-banner--component", "flex w-full items-start gap-3 rounded-lg border px-4 py-3", "animate-in fade-in-0 slide-in-from-bottom-1 duration-200", p.wrapper, f),
+		children: [
+			/* @__PURE__ */ M("span", {
+				"aria-hidden": "true",
+				className: n("mt-0.5 inline-flex size-8 shrink-0 items-center justify-center rounded-full", p.iconRing, p.iconColor),
+				children: /* @__PURE__ */ M(m, { className: "size-4" })
+			}),
+			/* @__PURE__ */ N("div", {
+				className: "min-w-0 flex-1",
+				children: [g && /* @__PURE__ */ M(r, {
+					tag: "div",
+					weight: "semibold",
+					className: "leading-snug text-foreground",
+					children: a
+				}), /* @__PURE__ */ N(r, {
+					tag: "div",
+					type: g ? "secondary" : "main",
+					className: n("break-words leading-snug", g && "mt-0.5"),
+					children: [!!u && /* @__PURE__ */ M(de, { html: h }), !u && (o ?? l)]
+				})]
+			}),
+			!!t && /* @__PURE__ */ M(s, {
+				type: "button",
+				variant: "secondary",
+				buttonStyle: "ghost",
+				size: "icon-xs",
+				"aria-label": d,
+				onClick: c,
+				className: n("-mr-1 inline-flex size-7 shrink-0 items-center justify-center rounded-md transition-colors", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40", p.close),
+				children: /* @__PURE__ */ M(ae, { className: "size-4" })
+			})
+		]
+	});
+}
+U.displayName = "NotificationBanner";
+//#endregion
+//#region src/components/base/display/placeholder-pattern.tsx
+function W({ className: e }) {
+	let t = D();
+	return /* @__PURE__ */ N("svg", {
+		className: n("placeholder-pattern--component", e),
+		fill: "none",
+		stroke: "currentColor",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ M("defs", { children: /* @__PURE__ */ M("pattern", {
+			id: t,
+			x: "0",
+			y: "0",
+			width: "10",
+			height: "10",
+			patternUnits: "userSpaceOnUse",
+			children: /* @__PURE__ */ M("path", {
+				d: "M-3 13 15-5M-5 5l18-18M-1 21 17 3",
+				stroke: "currentColor",
+				strokeWidth: "0.75",
+				strokeLinecap: "square",
+				vectorEffect: "non-scaling-stroke"
+			})
+		}) }), /* @__PURE__ */ M("rect", {
+			stroke: "none",
+			fill: `url(#${t})`,
+			width: "100%",
+			height: "100%"
+		})]
+	});
+}
+W.displayName = "PlaceholderPattern";
+//#endregion
+//#region src/components/base/display/show-if.tsx
+function G({ when: e, children: t, fallback: n = null }) {
+	return e ? t : n || null;
+}
+G.displayName = "ShowIf";
+//#endregion
+//#region src/components/base/display/throttle-alert.tsx
+var fe = {
+	maxAttempts: "Max attempts",
+	tryAgainIn: "Try again in"
+};
+function K({ message: t, attempts: i, remaining: a, className: o, strings: s }) {
+	let c = e(fe, s);
+	return /* @__PURE__ */ N("div", {
+		role: "alert",
+		className: n("throttle-alert--component", "flex items-start gap-3 rounded-lg border border-destructive/30 bg-destructive/5 px-4 py-3", o),
+		children: [/* @__PURE__ */ M("span", {
+			"aria-hidden": "true",
+			className: "mt-0.5 inline-flex size-8 shrink-0 items-center justify-center rounded-full bg-destructive/15 text-destructive",
+			children: /* @__PURE__ */ M(R, { className: "size-4" })
+		}), /* @__PURE__ */ N("div", {
+			className: "min-w-0 flex-1 space-y-1.5",
+			children: [/* @__PURE__ */ M(r, {
+				weight: "medium",
+				className: "text-destructive leading-snug",
+				children: t
+			}), /* @__PURE__ */ N("div", {
+				className: "flex flex-wrap items-center gap-x-4 gap-y-1 text-xs text-destructive/80",
+				children: [/* @__PURE__ */ N("span", {
+					className: "inline-flex items-center gap-1.5",
+					children: [
+						/* @__PURE__ */ M(re, {
+							className: "size-3",
+							"aria-hidden": "true"
+						}),
+						/* @__PURE__ */ M("span", { children: c.maxAttempts }),
+						/* @__PURE__ */ M("span", {
+							className: "font-semibold tabular-nums text-destructive",
+							children: i
+						})
+					]
+				}), /* @__PURE__ */ N("span", {
+					className: "inline-flex items-center gap-1.5",
+					children: [
+						/* @__PURE__ */ M(te, {
+							className: "size-3",
+							"aria-hidden": "true"
+						}),
+						/* @__PURE__ */ M("span", { children: c.tryAgainIn }),
+						/* @__PURE__ */ M("span", {
+							className: "font-semibold tabular-nums text-destructive",
+							children: a
+						})
+					]
+				})]
+			})]
+		})]
+	});
+}
+K.displayName = "ThrottleAlert";
+//#endregion
+//#region src/components/base/display/visually-hidden.tsx
+function q({ children: e, className: t }) {
+	return /* @__PURE__ */ M("span", {
+		className: n("visually-hidden--component", "absolute w-px h-px p-0 -m-px overflow-hidden whitespace-nowrap border-0", "[clip:rect(0,0,0,0)]", t),
+		children: e
+	});
+}
+q.displayName = "VisuallyHidden";
+//#endregion
+//#region src/components/base/display/stacked-avatars.tsx
+var J = [
+	"muted",
+	"primary",
+	"secondary",
+	"info",
+	"success"
+], pe = {
+	muted: "bg-muted text-muted-foreground",
+	primary: "bg-primary/10 text-primary",
+	secondary: "bg-secondary text-secondary-foreground",
+	info: "bg-info/10 text-info",
+	success: "bg-success/10 text-success",
+	warning: "bg-warning/15 text-warning",
+	destructive: "bg-destructive/10 text-destructive"
+};
+function me(e, t = !1) {
+	let n = e.trim().split(/\s+/);
+	return n.length === 0 ? "?" : t ? n[0].slice(0, 1).toUpperCase() : n.length === 1 ? n[0].slice(0, 2).toUpperCase() : (n[0][0] + n[n.length - 1][0]).toUpperCase();
+}
+function he(e, t) {
+	return typeof t == "string" ? t : typeof t == "number" ? J[Math.abs(t) % J.length] : J[(typeof e == "number" ? e : Array.from(e).reduce((e, t) => e + t.charCodeAt(0), 0)) % J.length];
+}
+function Y({ users: e, max: t = 4, size: i = "default", className: a, showOverflow: o = !0, overflowFormatter: s, avatarClassName: c }) {
+	let l = e.slice(0, t), u = Math.max(0, e.length - t);
+	return /* @__PURE__ */ N(v, {
+		className: n("stacked-avatars--component", a),
+		children: [l.map((e, t) => {
+			let r = me(e.name, i === "sm"), a = he(e.id ?? e.name ?? t, e.tone);
+			return /* @__PURE__ */ N(x, {
+				size: i,
+				className: n("ring-background", c),
+				title: e.name,
+				children: [e.imageUrl ? /* @__PURE__ */ M(y, {
+					src: e.imageUrl,
+					alt: e.name
+				}) : null, /* @__PURE__ */ M(b, {
+					className: n("font-semibold", pe[a]),
+					children: r
+				})]
+			}, e.id ?? `${e.name}-${t}`);
+		}), !!o && u > 0 && /* @__PURE__ */ M(_, { children: /* @__PURE__ */ M(r, {
+			size: "xs",
+			weight: "semibold",
+			children: s ? s(u) : `+${u}`
+		}) })]
+	});
+}
+Y.displayName = "StackedAvatars";
+//#endregion
+//#region src/components/base/display/date-block.tsx
+var X = { separator: "·" }, ge = {
+	default: {
+		bg: "bg-card",
+		text: "text-foreground",
+		border: "border-border",
+		accent: "text-foreground",
+		subtle: "text-muted-foreground"
+	},
+	inverse: {
+		bg: "bg-primary",
+		text: "text-background",
+		border: "border-primary",
+		accent: "text-background/80",
+		subtle: "text-background/65"
+	},
+	muted: {
+		bg: "bg-muted/50",
+		text: "text-foreground",
+		border: "border-border",
+		accent: "text-foreground",
+		subtle: "text-muted-foreground"
+	},
+	primary: {
+		bg: "bg-primary/10",
+		text: "text-foreground",
+		border: "border-primary/30",
+		accent: "text-primary",
+		subtle: "text-muted-foreground"
+	},
+	success: {
+		bg: "bg-success/10",
+		text: "text-foreground",
+		border: "border-success/30",
+		accent: "text-success",
+		subtle: "text-muted-foreground"
+	},
+	warning: {
+		bg: "bg-warning/15",
+		text: "text-foreground",
+		border: "border-warning/40",
+		accent: "text-warning-foreground",
+		subtle: "text-muted-foreground"
+	},
+	destructive: {
+		bg: "bg-destructive/10",
+		text: "text-foreground",
+		border: "border-destructive/30",
+		accent: "text-destructive",
+		subtle: "text-muted-foreground"
+	},
+	info: {
+		bg: "bg-info/10",
+		text: "text-foreground",
+		border: "border-info/30",
+		accent: "text-info",
+		subtle: "text-muted-foreground"
+	}
+};
+function _e(e) {
+	return e instanceof Date ? e : new Date(e);
+}
+function Z({ date: t, time: i, locale: a, layout: o = "stacked", timePlacement: s, tone: c = "default", boxed: l, showMonth: u = !0, dayFormat: d = "d", weekdayFormat: f = "EEE", monthFormat: p = "MMM", className: m, strings: h }) {
+	let g = _e(t), _ = e(X, h), v = ge[c], y = !Number.isNaN(g.getTime()), b = y ? A(g, f, a ? { locale: a } : void 0) : "", x = y ? A(g, d, a ? { locale: a } : void 0) : "", S = y ? A(g, p, a ? { locale: a } : void 0) : "", C = s ?? (o === "inline" ? "inline" : "below"), w = l ?? o === "stacked";
+	return o === "inline" ? /* @__PURE__ */ N("span", {
+		className: n("date-block--component", "inline-flex items-center gap-1.5 tabular-nums", w && n("rounded-md border px-2 py-1", v.bg, v.border), m),
+		children: [
+			/* @__PURE__ */ M(r, {
+				size: "xs",
+				weight: "semibold",
+				className: n(v.accent, "uppercase tracking-wide"),
+				children: b
+			}),
+			/* @__PURE__ */ M(r, {
+				weight: "semibold",
+				children: x
+			}),
+			!!u && /* @__PURE__ */ M(r, {
+				size: "xs",
+				type: "secondary",
+				className: "uppercase tracking-wide",
+				children: S
+			}),
+			!!i && C === "inline" && /* @__PURE__ */ N(j, { children: [/* @__PURE__ */ M(r, {
+				size: "xs",
+				type: "discrete",
+				"aria-hidden": !0,
+				children: _.separator
+			}), /* @__PURE__ */ M(r, {
+				size: "xs",
+				type: "secondary",
+				children: i
+			})] })
+		]
+	}) : /* @__PURE__ */ N("div", {
+		className: n("inline-flex flex-col items-center gap-0.5", m),
+		children: [
+			/* @__PURE__ */ N("div", {
+				className: n("flex flex-col items-center justify-center gap-1 tabular-nums", w && n("w-14 min-h-14 rounded-md border px-1.5 py-1.5", v.bg, v.border)),
+				children: [
+					/* @__PURE__ */ M(r, {
+						size: "xxs",
+						weight: "semibold",
+						style: { lineHeight: 1 },
+						className: n(v.accent, "uppercase tracking-wider"),
+						children: b
+					}),
+					/* @__PURE__ */ M(r, {
+						size: "lg",
+						weight: "bold",
+						style: { lineHeight: 1 },
+						className: v.text,
+						children: x
+					}),
+					!!u && /* @__PURE__ */ M(r, {
+						size: "xxs",
+						style: { lineHeight: 1 },
+						className: n(v.subtle, "uppercase tracking-wider"),
+						children: S
+					})
+				]
+			}),
+			!!i && C === "below" && /* @__PURE__ */ M(r, {
+				size: "xxs",
+				type: "secondary",
+				className: "tabular-nums",
+				children: i
+			}),
+			!!i && C === "inline" && /* @__PURE__ */ M(r, {
+				size: "xxs",
+				type: "secondary",
+				className: "tabular-nums",
+				children: i
+			})
+		]
+	});
+}
+Z.displayName = "DateBlock";
+//#endregion
+//#region src/components/ui/collapsible.tsx
+function ve({ ...e }) {
+	return /* @__PURE__ */ M(z.Root, {
+		"data-slot": "collapsible",
+		...e
+	});
+}
+function ye({ asChild: e = !1, nativeButton: t, render: n, children: r, ...i }) {
+	let a = e ? /* @__PURE__ */ M(c, {}) : void 0, o = typeof n == "function" ? ((e, t) => {
+		let { nativeButton: r, ...i } = e;
+		return n(i, t);
+	}) : n, s = !0;
+	e && S.isValidElement(r) && (s = typeof r.type == "string" ? r.type === "button" : !("href" in (r.props ?? {})));
+	let l = t ?? (e ? s : !0);
+	return /* @__PURE__ */ M(z.Trigger, {
+		"data-slot": "collapsible-trigger",
+		render: a ?? o,
+		nativeButton: l,
+		...i,
+		children: r
+	});
+}
+function be({ ...e }) {
+	return /* @__PURE__ */ M(z.Panel, {
+		"data-slot": "collapsible-content",
+		...e
+	});
+}
+//#endregion
+//#region src/components/base/display/money-input.tsx
+var xe = "—", Se = (e) => typeof e == "string" ? e.trim() : "";
+function Ce({ money: e, currency: t = "EUR", onChangeData: i, recordCurrency: a, label: o, hint: s, helperText: c, error: l, required: u, invalid: d, showMigrationWarning: g = !0, migrationWarningMessage: _, showOriginalHint: v = !0, className: y, onChange: b, onCurrencyChange: x, ...S }) {
+	let C = a ?? e?.recordCurrency ?? void 0, w = O(() => C !== void 0 && C !== t, [C, t]), E = O(() => v ? Se(e?.pair?.formatted) : "", [v, e?.pair?.formatted]), D = E.length > 0 && !l, k = w && g, A = T((e) => {
+		b?.(e);
+		let n = Number.parseFloat(e.target.value);
+		i?.({
+			amount: Number.isFinite(n) ? n : 0,
+			currency: t
+		});
+	}, [
+		b,
+		i,
+		t
+	]), j = T((e) => {
+		x?.(e);
+		let t = Number.parseFloat(String(S.value ?? ""));
+		i?.({
+			amount: Number.isFinite(t) ? t : 0,
+			currency: e
+		});
+	}, [
+		x,
+		i,
+		S.value
+	]), F = d ?? !!l, I = /* @__PURE__ */ M(h, {
+		...S,
+		currency: t,
+		onChange: A,
+		onCurrencyChange: j,
+		invalid: F
+	}), ee = o || s || c || l || u ? /* @__PURE__ */ M(m, {
+		label: o,
+		hint: s,
+		helperText: c,
+		error: l,
+		required: u,
+		children: I
+	}) : I;
+	return /* @__PURE__ */ N("div", {
+		className: n("money-input--component", "space-y-2", y),
+		children: [
+			ee,
+			!!D && /* @__PURE__ */ N("div", {
+				className: "flex items-center gap-1.5 text-muted-foreground",
+				children: [/* @__PURE__ */ M(L, { className: "h-3.5 w-3.5 shrink-0" }), /* @__PURE__ */ M(r, {
+					size: "xs",
+					type: "secondary",
+					children: E || xe
+				})]
+			}),
+			!!k && /* @__PURE__ */ N(p, {
+				className: "border-warning/50 bg-warning/5 py-2",
+				children: [/* @__PURE__ */ M(P, { className: "h-4 w-4 text-warning" }), /* @__PURE__ */ M(f, {
+					className: "text-warning-foreground text-xs",
+					children: _ ?? `Currency will be converted from ${C ?? ""} to ${t}.`
+				})]
+			})
+		]
+	});
+}
+Ce.displayName = "MoneyInput";
+//#endregion
+//#region src/components/base/display/boolean-indicator.tsx
+var we = {
+	true: "Yes",
+	false: "No"
+};
+function Te({ label: t, value: i = !1, trueLabel: a, falseLabel: s, showIcon: c = !0, trueVariant: l = "success", falseVariant: u = "secondary", className: d, badgeClassName: f, strings: p }) {
+	let m = e(we, p), h = !!i, g = h ? I : oe, _ = h ? l : u, v = (h ? a : s) ?? (h ? m.true : m.false);
+	return /* @__PURE__ */ N("div", {
+		className: n("boolean-indicator--component", "flex items-center justify-between rounded-md border border-border/60 bg-muted/30 px-3 py-2", d),
+		children: [/* @__PURE__ */ M(r, {
+			size: "xs",
+			type: "secondary",
+			className: "uppercase tracking-wide",
+			children: t
+		}), /* @__PURE__ */ N(o, {
+			variant: _,
+			size: "sm",
+			className: n("whitespace-nowrap", f),
+			children: [!!c && /* @__PURE__ */ M(g, { className: "h-3.5 w-3.5" }), v]
+		})]
+	});
+}
+Te.displayName = "BooleanIndicator";
+//#endregion
+//#region src/components/ui/progress.tsx
+function Ee({ className: e, children: t, value: r, ...i }) {
+	return /* @__PURE__ */ N(B.Root, {
+		value: r,
+		"data-slot": "progress",
+		className: n("flex flex-wrap gap-3", e),
+		...i,
+		children: [t, /* @__PURE__ */ M(De, { children: /* @__PURE__ */ M(Oe, {}) })]
+	});
+}
+function De({ className: e, ...t }) {
+	return /* @__PURE__ */ M(B.Track, {
+		className: n("bg-muted h-1.5 rounded-full relative flex w-full items-center overflow-x-hidden", e),
+		"data-slot": "progress-track",
+		...t
+	});
+}
+function Oe({ className: e, ...t }) {
+	return /* @__PURE__ */ M(B.Indicator, {
+		"data-slot": "progress-indicator",
+		className: n("bg-primary h-full transition-all", e),
+		...t
+	});
+}
+function ke({ className: e, ...t }) {
+	return /* @__PURE__ */ M(B.Label, {
+		className: n("text-sm font-medium", e),
+		"data-slot": "progress-label",
+		...t
+	});
+}
+function Ae({ className: e, ...t }) {
+	return /* @__PURE__ */ M(B.Value, {
+		className: n("text-muted-foreground ml-auto text-sm tabular-nums", e),
+		"data-slot": "progress-value",
+		...t
+	});
+}
+//#endregion
+//#region src/components/base/display/qr-code.tsx
+var je = /oklch\\(([.\\d-]+)\\s+([.\\d]+)\\s+([.\\d]+)\\)/;
+function Me(e, t) {
+	let n = e.match(je);
+	return n ? {
+		l: Number.parseFloat(n[1]),
+		c: Number.parseFloat(n[2]),
+		h: Number.parseFloat(n[3])
+	} : {
+		l: t[0],
+		c: t[1],
+		h: t[2]
+	};
+}
+function Ne({ data: e, foreground: t, background: r, robustness: i = "M", className: a, ...o }) {
+	let [s, c] = k(null);
+	return E(() => {
+		(async () => {
+			try {
+				let n = String(e ?? "").trim();
+				if (!n) {
+					c(null);
+					return;
+				}
+				let a = getComputedStyle(document.documentElement), o = t ?? a.getPropertyValue("--foreground"), s = r ?? a.getPropertyValue("--background"), l = Me(o, [
+					.21,
+					.006,
+					285.885
+				]), u = Me(s, [
+					.985,
+					0,
+					0
+				]);
+				c(await ce.toString(n, {
+					type: "svg",
+					color: {
+						dark: V(H({
+							mode: "oklch",
+							...l
+						})),
+						light: V(H({
+							mode: "oklch",
+							...u
+						}))
+					},
+					width: 200,
+					errorCorrectionLevel: i,
+					margin: 0
+				}));
+			} catch {
+				c("");
+			}
+		})();
+	}, [
+		e,
+		t,
+		r,
+		i
+	]), s ? /* @__PURE__ */ M("div", {
+		className: n("qr-code--component", "size-full", "[&_svg]:size-full", a),
+		dangerouslySetInnerHTML: { __html: s },
+		...o
+	}) : null;
+}
+Ne.displayName = "QRCode";
+//#endregion
+//#region src/components/ui/empty.tsx
+function Pe({ className: e, ...t }) {
+	return /* @__PURE__ */ M("div", {
+		"data-slot": "empty",
+		className: n("gap-4 rounded-lg border-dashed p-12 flex w-full min-w-0 flex-1 flex-col items-center justify-center text-center text-balance", e),
+		...t
+	});
+}
+function Fe({ className: e, ...t }) {
+	return /* @__PURE__ */ M("div", {
+		"data-slot": "empty-header",
+		className: n("gap-2 flex max-w-sm flex-col items-center", e),
+		...t
+	});
+}
+var Ie = se("mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0", {
+	variants: { variant: {
+		default: "bg-transparent",
+		icon: "bg-muted text-foreground flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function Le({ className: e, variant: t = "default", ...r }) {
+	return /* @__PURE__ */ M("div", {
+		"data-slot": "empty-icon",
+		"data-variant": t,
+		className: n(Ie({
+			variant: t,
+			className: e
+		})),
+		...r
+	});
+}
+function Re({ className: e, ...t }) {
+	return /* @__PURE__ */ M("div", {
+		"data-slot": "empty-content",
+		className: n("gap-4 text-sm flex w-full max-w-sm min-w-0 flex-col items-center text-balance", e),
+		...t
+	});
+}
+//#endregion
+//#region src/components/base/display/empty-state/empty-state.strings.ts
+var ze = {
+	title: "Nothing here yet",
+	description: "Once data lands, it will show up in this view.",
+	ariaLabel: "Empty state"
+}, Be = {
+	compact: "py-6",
+	base: "py-12",
+	loose: "py-16"
+}, Ve = {
+	none: "default",
+	icon: "icon",
+	"icon-soft": "icon",
+	illustration: "default"
+}, He = {
+	none: void 0,
+	icon: void 0,
+	"icon-soft": "bg-muted/40 text-muted-foreground",
+	illustration: "mb-4"
+}, Ue = w(function({ title: t, description: i, media: o, mediaVariant: s = "none", renderMedia: c, actions: l, footer: u, padding: d = "base", border: f = !1, className: p, strings: m, ariaLabel: h }, g) {
+	let _ = e(ze, m), v = t ?? _.title, y = i === !1 ? null : i ?? _.description, b = c ? c({ mediaVariant: s }) : o, x = !!b;
+	return /* @__PURE__ */ N(Pe, {
+		ref: g,
+		role: "status",
+		"aria-label": h ?? _.ariaLabel,
+		className: n("empty-state--component", Be[d], f ? "border border-dashed" : "border-0", p),
+		children: [/* @__PURE__ */ N(Fe, { children: [
+			!!x && /* @__PURE__ */ M(Le, {
+				variant: Ve[s],
+				className: He[s],
+				children: b
+			}),
+			/* @__PURE__ */ M(a, {
+				tag: "h3",
+				className: "border-0 pb-0 text-base",
+				"data-slot": "empty-title",
+				children: v
+			}),
+			!!y && /* @__PURE__ */ M(r, {
+				size: "xs",
+				type: "secondary",
+				className: "leading-relaxed [&>a]:text-primary [&>a]:underline [&>a]:underline-offset-4 hover:[&>a]:no-underline",
+				"data-slot": "empty-description",
+				children: y
+			})
+		] }), (!!l || !!u) && /* @__PURE__ */ N(Re, { children: [!!l && /* @__PURE__ */ M("div", {
+			className: "flex flex-wrap items-center justify-center gap-2",
+			children: l
+		}), !!u && /* @__PURE__ */ M("div", {
+			className: "text-xs text-muted-foreground",
+			children: u
+		})] })]
+	});
+});
+Ue.displayName = "EmptyState";
+//#endregion
+//#region src/components/base/display/empty-state/partials/illustrations/document-stack.tsx
+function We({ className: e }) {
+	return /* @__PURE__ */ N("div", {
+		className: n("relative h-24 w-32", e),
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ N("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-md border p-2 shadow-sm",
+			children: [
+				/* @__PURE__ */ M("div", { className: "bg-muted h-2 w-12 rounded" }),
+				/* @__PURE__ */ M("div", { className: "bg-muted/60 h-1.5 w-10 rounded" }),
+				/* @__PURE__ */ M("div", { className: "bg-muted/60 h-1.5 w-9 rounded" })
+			]
+		}), /* @__PURE__ */ N("div", {
+			className: "bg-background border-border absolute right-1 top-2 flex h-20 w-20 rotate-3 flex-col gap-1.5 rounded-md border p-2 shadow-sm",
+			children: [
+				/* @__PURE__ */ M("div", { className: "bg-muted h-2 w-12 rounded" }),
+				/* @__PURE__ */ M("div", { className: "bg-muted/60 h-1.5 w-10 rounded" }),
+				/* @__PURE__ */ M("div", { className: "bg-muted/60 h-1.5 w-9 rounded" }),
+				/* @__PURE__ */ N("div", {
+					className: "mt-auto flex items-center gap-1",
+					children: [/* @__PURE__ */ M("div", { className: "bg-success size-1.5 rounded-full" }), /* @__PURE__ */ M("div", { className: "bg-muted/60 h-1.5 w-8 rounded" })]
+				})
+			]
+		})]
+	});
+}
+We.displayName = "DocumentStackIllustration";
+//#endregion
+//#region src/components/base/display/empty-state/partials/illustrations/inbox-clean.tsx
+function Ge({ className: e }) {
+	return /* @__PURE__ */ N("div", {
+		className: n("relative h-24 w-32", e),
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ M("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__ */ M("svg", {
+				viewBox: "0 0 16 16",
+				className: "text-success size-3.5",
+				fill: "none",
+				stroke: "currentColor",
+				strokeWidth: "2",
+				strokeLinecap: "round",
+				strokeLinejoin: "round",
+				children: /* @__PURE__ */ M("path", { d: "M3 8l3 3 7-7" })
+			})
+		}), /* @__PURE__ */ N("div", {
+			className: "bg-background border-border absolute inset-x-0 bottom-0 flex h-14 flex-col rounded-lg border shadow-sm",
+			children: [/* @__PURE__ */ M("div", { className: "bg-muted/30 h-3 rounded-t-lg" }), /* @__PURE__ */ N("div", {
+				className: "flex flex-1 items-center justify-between px-3",
+				children: [/* @__PURE__ */ N("div", {
+					className: "flex flex-col gap-1",
+					children: [/* @__PURE__ */ M("div", { className: "bg-muted/60 h-1.5 w-12 rounded" }), /* @__PURE__ */ M("div", { className: "bg-muted/40 h-1.5 w-8 rounded" })]
+				}), /* @__PURE__ */ M("div", { className: "bg-muted/40 size-3 rounded-full" })]
+			})]
+		})]
+	});
+}
+Ge.displayName = "InboxCleanIllustration";
+//#endregion
+//#region src/components/base/display/empty-state/partials/illustrations/search-glass.tsx
+function Ke({ className: e }) {
+	return /* @__PURE__ */ M("div", {
+		className: n("flex size-20 items-center justify-center rounded-full bg-muted/40 ring-8 ring-muted/20", e),
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ M(ie, { className: "size-8 text-muted-foreground" })
+	});
+}
+Ke.displayName = "SearchGlassIllustration";
+//#endregion
+//#region src/components/base/display/empty-state/partials/illustrations/stacked-cards.tsx
+function qe({ className: e }) {
+	return /* @__PURE__ */ N("div", {
+		className: n("relative h-24 w-52", e),
+		"aria-hidden": "true",
+		children: [
+			/* @__PURE__ */ M("div", { className: "bg-muted/60 dark:bg-muted/30 border-border/50 absolute inset-x-6 top-0 h-6 rounded-t-lg border" }),
+			/* @__PURE__ */ M("div", { className: "bg-muted/80 dark:bg-muted/50 border-border/60 absolute inset-x-3 top-3 h-6 rounded-t-lg border" }),
+			/* @__PURE__ */ N("div", {
+				className: "bg-background border-border absolute inset-x-0 top-6 flex h-16 items-center gap-3 rounded-lg border px-4 shadow-sm",
+				children: [/* @__PURE__ */ M("div", { className: "bg-muted size-8 shrink-0 rounded" }), /* @__PURE__ */ N("div", {
+					className: "flex flex-1 flex-col gap-1.5",
+					children: [/* @__PURE__ */ M("div", { className: "bg-muted h-2.5 w-3/4 rounded" }), /* @__PURE__ */ M("div", { className: "bg-muted/60 h-2 w-1/2 rounded" })]
+				})]
+			}),
+			/* @__PURE__ */ M("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" })
+		]
+	});
+}
+qe.displayName = "StackedCardsIllustration";
+//#endregion
+//#region src/components/base/display/empty-state/partials/illustrations/users-circle.tsx
+function Je({ className: e }) {
+	return /* @__PURE__ */ N("div", {
+		className: n("relative flex h-24 w-32 items-center justify-center", e),
+		"aria-hidden": "true",
+		children: [
+			/* @__PURE__ */ M("div", { className: "bg-muted/70 border-border absolute left-2 size-12 rounded-full border-2" }),
+			/* @__PURE__ */ M("div", { className: "bg-muted border-border z-10 size-14 rounded-full border-2 shadow-sm" }),
+			/* @__PURE__ */ M("div", { className: "bg-muted/60 border-border absolute right-2 size-10 rounded-full border-2" })
+		]
+	});
+}
+Je.displayName = "UsersCircleIllustration";
+//#endregion
+//#region src/components/base/display/fields/email-display.tsx
+var Ye = { copySuccess: "Email copied to clipboard" };
+function Q({ email: i, copyable: a = !0, copySuccessMessage: o, emptyLabel: s = "—", clickable: c = !0, strings: l, size: u, type: d = "main", tag: f = "span", className: p, ...m }) {
+	let { defaultTextSize: h } = t(), _ = u ?? h ?? "sm", v = e(Ye, {
+		...o ? { copySuccess: o } : {},
+		...l
+	});
+	if (!i || i.trim().length === 0) return /* @__PURE__ */ M(r, {
+		size: _,
+		type: "secondary",
+		tag: f,
+		className: n("email-display--component", p),
+		...m,
+		children: s
+	});
+	let y = /* @__PURE__ */ M(r, {
+		size: _,
+		type: d,
+		tag: "span",
+		className: n("font-medium", "decoration-dotted decoration-border underline underline-offset-4", "transition-colors duration-200", c ? "hover:decoration-current" : null, p),
+		children: i
+	});
+	if (a) {
+		let e = /* @__PURE__ */ M(g, {
+			value: i,
+			displayValue: y,
+			successMessage: v.copySuccess,
+			className: "-mx-0"
+		});
+		return c ? /* @__PURE__ */ M("a", {
+			href: `mailto:${i}`,
+			className: "inline-flex items-center no-underline",
+			onClick: (e) => e.stopPropagation(),
+			children: e
+		}) : e;
+	}
+	return c ? /* @__PURE__ */ M("a", {
+		href: `mailto:${i}`,
+		className: "inline-flex items-center no-underline",
+		children: y
+	}) : y;
+}
+Q.displayName = "EmailDisplay";
+//#endregion
+//#region src/components/base/display/fields/phone-display.tsx
+var Xe = { copySuccess: "Phone number copied to clipboard" };
+function Ze(e) {
+	return e.replace(/[\s().-]/g, "");
+}
+function Qe({ phone: i, copyable: a = !0, copySuccessMessage: o, emptyLabel: s = "—", clickable: c = !0, strings: l, size: u, type: d = "main", tag: f = "span", className: p, ...m }) {
+	let { defaultTextSize: h } = t(), _ = u ?? h ?? "sm", v = e(Xe, {
+		...o ? { copySuccess: o } : {},
+		...l
+	});
+	if (!i || i.trim().length === 0) return /* @__PURE__ */ M(r, {
+		size: _,
+		type: "secondary",
+		tag: f,
+		className: n("phone-display--component", p),
+		...m,
+		children: s
+	});
+	let y = /* @__PURE__ */ M(r, {
+		size: _,
+		type: d,
+		tag: "span",
+		className: n("font-medium", "decoration-dotted decoration-border underline underline-offset-4", "transition-colors duration-200", c ? "hover:decoration-current" : null, p),
+		children: i
+	});
+	if (a) {
+		let e = /* @__PURE__ */ M(g, {
+			value: i,
+			displayValue: y,
+			successMessage: v.copySuccess,
+			className: "-mx-0"
+		});
+		return c ? /* @__PURE__ */ M("a", {
+			href: `tel:${Ze(i)}`,
+			className: "inline-flex items-center no-underline",
+			onClick: (e) => e.stopPropagation(),
+			children: e
+		}) : e;
+	}
+	return c ? /* @__PURE__ */ M("a", {
+		href: `tel:${Ze(i)}`,
+		className: "inline-flex items-center no-underline",
+		children: y
+	}) : y;
+}
+Qe.displayName = "PhoneDisplay";
+//#endregion
+//#region src/components/base/display/fields/url-display.tsx
+var $e = {
+	copySuccess: "URL copied to clipboard",
+	httpWarning: "This URL uses HTTP which is not secure"
+};
+function et(e) {
+	try {
+		return new URL(e).protocol === "http:";
+	} catch {
+		return e.toLowerCase().startsWith("http://");
+	}
+}
+function tt(e, t, n) {
+	if (!t || e.length <= n) return e;
+	try {
+		let t = new URL(e), r = t.hostname, i = n - r.length - 5;
+		return i > 10 ? `${r}${t.pathname.slice(0, i)}...` : `${e.slice(0, n - 3)}...`;
+	} catch {
+		return `${e.slice(0, n - 3)}...`;
+	}
+}
+function nt({ url: i, copyable: a = !0, copySuccessMessage: o, emptyLabel: s = "—", clickable: c = !0, truncate: f = !1, maxLength: p = 50, showExternalIcon: m = !0, httpWarningMessage: h, strings: _, size: v, type: y = "main", tag: b = "span", className: x, ...S }) {
+	let { defaultTextSize: C } = t(), w = v ?? C ?? "sm", T = e($e, {
+		...o ? { copySuccess: o } : {},
+		...h ? { httpWarning: h } : {},
+		..._
+	});
+	if (!i || i.trim().length === 0) return /* @__PURE__ */ M(r, {
+		size: w,
+		type: "secondary",
+		tag: b,
+		className: n("url-display--component", x),
+		...S,
+		children: s
+	});
+	let E = et(i), D = tt(i, f, p), O = f && i.length > p, k = /* @__PURE__ */ N(r, {
+		size: w,
+		type: y,
+		tag: "span",
+		className: "inline-flex items-center gap-1.5",
+		children: [
+			!!E && /* @__PURE__ */ N(d, { children: [/* @__PURE__ */ M(l, { render: (e) => {
+				let { type: t, disabled: r, className: i, ...a } = e;
+				return /* @__PURE__ */ M("span", {
+					...a,
+					tabIndex: 0,
+					role: "img",
+					"aria-label": T.httpWarning,
+					className: n("inline-flex items-center text-warning", i),
+					children: /* @__PURE__ */ M(R, {
+						className: "size-3.5",
+						"aria-hidden": "true"
+					})
+				});
+			} }), /* @__PURE__ */ M(u, {
+				side: "top",
+				className: "max-w-xs",
+				children: /* @__PURE__ */ M(r, {
+					size: "xs",
+					children: T.httpWarning
+				})
+			})] }),
+			/* @__PURE__ */ M("span", {
+				className: n("decoration-dotted underline underline-offset-4", "transition-colors duration-200", E ? "decoration-warning" : "decoration-border", c ? "hover:decoration-current" : null),
+				title: O && i || void 0,
+				children: D
+			}),
+			!!c && !!m && /* @__PURE__ */ M(ne, { className: "size-3 text-muted-foreground" })
+		]
+	});
+	if (a) {
+		let e = /* @__PURE__ */ M(g, {
+			value: i,
+			displayValue: k,
+			successMessage: T.copySuccess,
+			className: n("-mx-0", x)
+		});
+		return c ? /* @__PURE__ */ M("a", {
+			href: i,
+			target: "_blank",
+			rel: "noopener noreferrer",
+			className: "inline-flex items-center no-underline",
+			onClick: (e) => e.stopPropagation(),
+			children: e
+		}) : e;
+	}
+	return c ? /* @__PURE__ */ M("a", {
+		href: i,
+		target: "_blank",
+		rel: "noopener noreferrer",
+		className: "inline-flex items-center no-underline",
+		children: k
+	}) : k;
+}
+nt.displayName = "UrlDisplay";
+//#endregion
+//#region src/components/base/display/inline-stat/inline-stat.tsx
+function rt({ label: e, value: t, layout: i = "between", mono: a = !1, className: o, labelClassName: s, valueClassName: c }) {
+	return i === "stacked" ? /* @__PURE__ */ N("div", {
+		className: n("inline-stat--component", "flex flex-col gap-0.5", o),
+		children: [/* @__PURE__ */ M(r, {
+			tag: "span",
+			size: "xxs",
+			type: "secondary",
+			className: s,
+			children: e
+		}), /* @__PURE__ */ M(r, {
+			tag: "span",
+			className: n(a && "tabular-nums", c),
+			children: t
+		})]
+	}) : /* @__PURE__ */ N("div", {
+		className: n("flex items-center gap-2", i === "between" ? "justify-between" : "justify-start", o),
+		children: [/* @__PURE__ */ M(r, {
+			tag: "span",
+			size: "xs",
+			type: "secondary",
+			className: s,
+			children: e
+		}), /* @__PURE__ */ M(r, {
+			tag: "span",
+			className: n(a && "tabular-nums", c),
+			children: t
+		})]
+	});
+}
+rt.displayName = "InlineStat";
+//#endregion
+//#region src/components/base/display/numeric-value/numeric-value.tsx
+var it = "—", at = (e, t, n) => {
+	if (e == null || e === "") return null;
+	if (typeof e == "string") return e;
+	if (Number.isNaN(e)) return null;
+	try {
+		return new Intl.NumberFormat(t, n).format(e);
+	} catch {
+		return String(e);
+	}
+};
+function ot({ value: e, align: i = "right", locale: a, formatOptions: o, emptyLabel: s = it, size: c, weight: l, type: u, className: d, ...f }) {
+	let { defaultTextSize: p } = t(), m = c ?? p ?? "sm", h = at(e, a, o), g = i === "right" ? "text-right" : i === "center" ? "text-center" : "text-left";
+	return h === null ? /* @__PURE__ */ M(r, {
+		size: m,
+		weight: l,
+		type: u ?? "secondary",
+		className: n("numeric-value--component", "tabular-nums", g, d),
+		...f,
+		children: s
+	}) : /* @__PURE__ */ M(r, {
+		size: m,
+		weight: l,
+		type: u,
+		className: n("tabular-nums", g, d),
+		...f,
+		children: h
+	});
+}
+ot.displayName = "NumericValue";
+//#endregion
+//#region src/components/base/display/user-cell/user-cell.tsx
+var st = {
+	sm: {
+		avatar: "size-7",
+		gap: "gap-2",
+		nameSize: "sm",
+		subtitleSize: "xs"
+	},
+	base: {
+		avatar: "size-9",
+		gap: "gap-3",
+		nameSize: "sm",
+		subtitleSize: "xs"
+	},
+	lg: {
+		avatar: "size-11",
+		gap: "gap-3",
+		nameSize: "base",
+		subtitleSize: "sm"
+	}
+};
+function ct({ name: e, subtitle: t, avatarUrl: i, avatarAlt: a, initials: o, avatar: s, trailing: c, size: l = "base", className: u }) {
+	let d = st[l], f = s ?? /* @__PURE__ */ N(x, {
+		className: d.avatar,
+		children: [!!i && /* @__PURE__ */ M(y, {
+			src: i,
+			alt: a ?? (typeof e == "string" ? e : void 0)
+		}), !!o && /* @__PURE__ */ M(b, { children: o })]
+	});
+	return /* @__PURE__ */ N("div", {
+		className: n("user-cell--component", "flex items-center", d.gap, u),
+		children: [
+			f,
+			/* @__PURE__ */ N("div", {
+				className: "min-w-0 flex-1",
+				children: [/* @__PURE__ */ M(r, {
+					size: d.nameSize,
+					weight: "semibold",
+					className: "truncate",
+					children: e
+				}), !!t && /* @__PURE__ */ M(r, {
+					size: d.subtitleSize,
+					type: "secondary",
+					className: "truncate",
+					children: t
+				})]
+			}),
+			!!c && /* @__PURE__ */ M("div", {
+				className: "shrink-0",
+				children: c
+			})
+		]
+	});
+}
+ct.displayName = "UserCell";
+//#endregion
+//#region src/components/base/display/section-header/section-header.tsx
+function $({ title: e, description: t, badge: i, action: a, dense: o = !1, className: s }) {
+	return /* @__PURE__ */ N("div", {
+		className: n("section-header--component", "flex items-start justify-between", o ? "gap-2" : "gap-3", s),
+		children: [/* @__PURE__ */ N("div", {
+			className: "min-w-0 flex-1",
+			children: [/* @__PURE__ */ N("div", {
+				className: n("flex items-center", o ? "gap-1.5" : "gap-2"),
+				children: [/* @__PURE__ */ M(r, {
+					size: o ? "xs" : "sm",
+					weight: "semibold",
+					className: "truncate",
+					children: e
+				}), !!i && /* @__PURE__ */ M("span", {
+					className: "shrink-0",
+					children: i
+				})]
+			}), !!t && /* @__PURE__ */ M(r, {
+				size: o ? "xxs" : "xs",
+				type: "secondary",
+				className: o ? "mt-0.5" : "mt-1",
+				children: t
+			})]
+		}), !!a && /* @__PURE__ */ M("div", {
+			className: "shrink-0",
+			children: a
+		})]
+	});
+}
+$.displayName = "SectionHeader";
+//#endregion
+export { K as A, ve as C, X as D, Z as E, W as M, U as N, Y as O, Ce as S, ye as T, Oe as _, nt as a, Ae as b, Je as c, Ge as d, We as f, Ee as g, Ne as h, rt as i, G as j, q as k, qe as l, ze as m, ct as n, Qe as o, Ue as p, ot as r, Q as s, $ as t, Ke as u, ke as v, be as w, Te as x, De as y };
+
+//# sourceMappingURL=display-C4n0uuxl.js.map