admin-ui-starter-kit 0.5.0 → 0.6.1

package/dist/components/composed/analytics/index.js

@@ -1,8 +1,8 @@
 import { useStrings as e } from "../../../lib/strings.js";
 import { cn as t } from "../../../lib/utils.js";
-import { t as n } from "../../../_shared/button-BGKY8UY0.js";
-import { n as r, t as i } from "../../../_shared/heading-HeP06nXG.js";
-import { t as a } from "../../../_shared/smart-card-thLb85Ih.js";
+import { t as n } from "../../../_shared/button-DHksjMvc.js";
+import { o as r, s as i } from "../../../_shared/typography-DE0NGEIE.js";
+import { t as a } from "../../../_shared/cards-CtBoSZG9.js";
 import { i as o, n as s, r as c, t as l } from "../../../_shared/format-BX3QestD.js";
 import { ChartContainer as u } from "../../base/display/chart.js";
 import { useId as d, useMemo as f } from "react";
@@ -92,45 +92,45 @@ var ee = {
 function ne(e, t) {
 	return e || (t === "up" ? "positive" : t === "down" ? "negative" : "neutral");
 }
-function j({ change: e, trend: n, size: i = "md", variant: a = "default", className: o }) {
+function j({ change: e, trend: n, size: r = "md", variant: a = "default", className: o }) {
 	let s = ne(n, e.direction), c = e.direction === "up" ? v : e.direction === "down" ? g : S, l = ee[s], u = String(e.value), d = e.direction === "up" ? "+" : (e.direction, "");
-	return a === "inline" ? /* @__PURE__ */ h(r, {
+	return a === "inline" ? /* @__PURE__ */ h(i, {
 		tag: "span",
-		size: A[i],
+		size: A[r],
 		weight: "medium",
 		className: t("metric-trend-chip--component", l.text, "tabular-nums", o),
 		children: [d, u]
 	}) : a === "compact" ? /* @__PURE__ */ h("span", {
 		className: t("inline-flex items-center gap-0.5", l.text, o),
 		children: [/* @__PURE__ */ m(c, {
-			className: k[i],
+			className: k[r],
 			strokeWidth: 2.5,
 			"aria-hidden": "true"
-		}), /* @__PURE__ */ m(r, {
+		}), /* @__PURE__ */ m(i, {
 			tag: "span",
-			size: A[i],
+			size: A[r],
 			weight: "semibold",
 			className: "text-current tabular-nums",
 			children: u
 		})]
 	}) : a === "badge" ? /* @__PURE__ */ h("span", {
-		className: t("inline-flex items-center gap-1 rounded-full font-medium tabular-nums", l.badge, te[i], o),
+		className: t("inline-flex items-center gap-1 rounded-full font-medium tabular-nums", l.badge, te[r], o),
 		children: [
 			/* @__PURE__ */ m(c, {
-				className: k[i],
+				className: k[r],
 				strokeWidth: 2.5,
 				"aria-hidden": "true"
 			}),
-			/* @__PURE__ */ m(r, {
+			/* @__PURE__ */ m(i, {
 				tag: "span",
-				size: A[i],
+				size: A[r],
 				weight: "semibold",
 				className: "text-current tabular-nums",
 				children: u
 			}),
-			!!e.label && /* @__PURE__ */ m(r, {
+			!!e.label && /* @__PURE__ */ m(i, {
 				tag: "span",
-				size: A[i],
+				size: A[r],
 				className: "text-current opacity-70",
 				children: e.label
 			})
@@ -139,20 +139,20 @@ function j({ change: e, trend: n, size: i = "md", variant: a = "default", classN
 		className: t("inline-flex items-center gap-1", l.text, o),
 		children: [
 			/* @__PURE__ */ m(c, {
-				className: k[i],
+				className: k[r],
 				strokeWidth: 2.5,
 				"aria-hidden": "true"
 			}),
-			/* @__PURE__ */ m(r, {
+			/* @__PURE__ */ m(i, {
 				tag: "span",
-				size: A[i],
+				size: A[r],
 				weight: "semibold",
 				className: "tabular-nums",
 				children: u
 			}),
-			!!e.label && /* @__PURE__ */ m(r, {
+			!!e.label && /* @__PURE__ */ m(i, {
 				tag: "span",
-				size: A[i],
+				size: A[r],
 				type: "secondary",
 				children: e.label
 			})
@@ -325,15 +325,15 @@ var F = {
 	lg: "h-10"
 }, R = 16;
 function z(e) {
-	let { data: n, variant: i = "default", size: a = "md", colorScheme: o = "default", showSparkline: s = !0, showChange: c = !0, showIcon: l = !0, loading: u = !1, error: d = !1, errorLabel: p, progress: h = 0, className: g, "aria-label": _ } = e, v = f(() => D(n), [n]), y = f(() => O(n), [n]);
+	let { data: n, variant: r = "default", size: a = "md", colorScheme: o = "default", showSparkline: s = !0, showChange: c = !0, showIcon: l = !0, loading: u = !1, error: d = !1, errorLabel: p, progress: h = 0, className: g, "aria-label": _ } = e, v = f(() => D(n), [n]), y = f(() => O(n), [n]);
 	if (u) return /* @__PURE__ */ m(P, {
-		variant: i,
+		variant: r,
 		size: a,
 		className: t("metric--component", g)
 	});
 	if (d) return /* @__PURE__ */ m("div", {
 		className: t("flex items-center justify-center rounded-lg border border-border bg-card p-4 text-muted-foreground", g),
-		children: /* @__PURE__ */ m(r, { children: p ?? E.metricErrorLabel })
+		children: /* @__PURE__ */ m(i, { children: p ?? E.metricErrorLabel })
 	});
 	let b = {
 		data: n,
@@ -347,7 +347,7 @@ function z(e) {
 		ariaLabel: _ ?? n.label,
 		className: g
 	};
-	switch (i) {
+	switch (r) {
 		case "card": return /* @__PURE__ */ m(oe, { ...b });
 		case "compact": return /* @__PURE__ */ m(se, { ...b });
 		case "minimal": return /* @__PURE__ */ m(ce, { ...b });
@@ -372,7 +372,7 @@ function ae({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 				children: [!!l && !!f && /* @__PURE__ */ m(f, {
 					className: "size-3.5 shrink-0",
 					"aria-hidden": "true"
-				}), /* @__PURE__ */ m(r, {
+				}), /* @__PURE__ */ m(i, {
 					size: "xs",
 					type: "secondary",
 					weight: "medium",
@@ -380,7 +380,7 @@ function ae({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 					children: e.label
 				})]
 			}),
-			/* @__PURE__ */ m(i, {
+			/* @__PURE__ */ m(r, {
 				tag: "h5",
 				className: t("font-bold tabular-nums tracking-tight border-none pb-0 leading-tight truncate", ie[o]),
 				title: n,
@@ -395,7 +395,7 @@ function ae({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 					variant: "compact"
 				})
 			}),
-			!!e.subtitle && /* @__PURE__ */ m(r, {
+			!!e.subtitle && /* @__PURE__ */ m(i, {
 				size: "xs",
 				type: "secondary",
 				className: "truncate",
@@ -406,7 +406,7 @@ function ae({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 				trend: a,
 				className: t("mt-auto", L[o])
 			}),
-			!!e.footer && /* @__PURE__ */ m(r, {
+			!!e.footer && /* @__PURE__ */ m(i, {
 				size: "xxs",
 				type: "discrete",
 				className: "truncate",
@@ -416,7 +416,7 @@ function ae({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 	});
 }
 function oe({ data: e, formattedValue: n, trend: o, size: s, showSparkline: c, showChange: l, showIcon: u, ariaLabel: d, className: f }) {
-	let p = e.icon, g = !!(e.href || e.onClick), _ = s === "sm" ? "sm" : s === "lg" ? "lg" : "base", v = /* @__PURE__ */ h(a, {
+	let p = e.icon, g = !!(e.href || e.onClick), _ = s === "sm" ? "small" : "default", v = /* @__PURE__ */ h(a, {
 		title: e.label,
 		icon: u && p ? /* @__PURE__ */ m(p, {
 			className: "size-4",
@@ -429,7 +429,7 @@ function oe({ data: e, formattedValue: n, trend: o, size: s, showSparkline: c, s
 		children: [
 			/* @__PURE__ */ h("div", {
 				className: "flex items-baseline justify-between gap-3",
-				children: [/* @__PURE__ */ m(i, {
+				children: [/* @__PURE__ */ m(r, {
 					tag: s === "sm" ? "h5" : s === "lg" ? "h3" : "h4",
 					className: t("font-bold tabular-nums tracking-tight border-none pb-0 leading-none", I[s]),
 					children: n
@@ -440,7 +440,7 @@ function oe({ data: e, formattedValue: n, trend: o, size: s, showSparkline: c, s
 					variant: "badge"
 				})]
 			}),
-			!!e.subtitle && /* @__PURE__ */ m(r, {
+			!!e.subtitle && /* @__PURE__ */ m(i, {
 				type: "secondary",
 				className: "mt-2",
 				children: e.subtitle
@@ -450,7 +450,7 @@ function oe({ data: e, formattedValue: n, trend: o, size: s, showSparkline: c, s
 				trend: o,
 				className: t("mt-3", s === "lg" ? "h-12" : "h-10")
 			}),
-			!!e.footer && /* @__PURE__ */ m(r, {
+			!!e.footer && /* @__PURE__ */ m(i, {
 				size: "xs",
 				type: "secondary",
 				className: "mt-2",
@@ -467,7 +467,7 @@ function oe({ data: e, formattedValue: n, trend: o, size: s, showSparkline: c, s
 		children: v
 	}) : v;
 }
-function se({ data: e, formattedValue: n, size: i, showChange: a, showIcon: o, ariaLabel: s, className: c }) {
+function se({ data: e, formattedValue: n, size: r, showChange: a, showIcon: o, ariaLabel: s, className: c }) {
 	let l = e.icon;
 	return /* @__PURE__ */ h("div", {
 		className: t("flex items-center gap-3", c),
@@ -482,14 +482,14 @@ function se({ data: e, formattedValue: n, size: i, showChange: a, showIcon: o, a
 			}),
 			/* @__PURE__ */ h("div", {
 				className: "min-w-0 flex-1",
-				children: [/* @__PURE__ */ m(r, {
+				children: [/* @__PURE__ */ m(i, {
 					size: "xs",
 					type: "secondary",
 					className: "truncate",
 					children: e.label
-				}), /* @__PURE__ */ m(r, {
+				}), /* @__PURE__ */ m(i, {
 					tag: "span",
-					size: i === "sm" ? "sm" : "lg",
+					size: r === "sm" ? "sm" : "lg",
 					weight: "bold",
 					className: "block truncate tabular-nums",
 					children: n
@@ -498,27 +498,27 @@ function se({ data: e, formattedValue: n, size: i, showChange: a, showIcon: o, a
 			!!a && !!e.change && /* @__PURE__ */ m(j, {
 				change: e.change,
 				trend: e.trend,
-				size: i,
+				size: r,
 				variant: "badge",
 				className: "shrink-0"
 			})
 		]
 	});
 }
-function ce({ data: e, formattedValue: n, size: i, showChange: a, ariaLabel: o, className: s }) {
+function ce({ data: e, formattedValue: n, size: r, showChange: a, ariaLabel: o, className: s }) {
 	return /* @__PURE__ */ h("span", {
 		className: t("inline-flex items-baseline gap-2", s),
 		"aria-label": o,
 		children: [
-			/* @__PURE__ */ h(r, {
+			/* @__PURE__ */ h(i, {
 				tag: "span",
-				size: i === "lg" ? "sm" : "xs",
+				size: r === "lg" ? "sm" : "xs",
 				type: "secondary",
 				children: [e.label, ":"]
 			}),
-			/* @__PURE__ */ m(r, {
+			/* @__PURE__ */ m(i, {
 				tag: "span",
-				size: i === "lg" ? "sm" : "xs",
+				size: r === "lg" ? "sm" : "xs",
 				weight: "semibold",
 				className: "tabular-nums",
 				children: n
@@ -545,7 +545,7 @@ function le({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 					children: [!!l && !!p && /* @__PURE__ */ m(p, {
 						className: "size-4 shrink-0",
 						"aria-hidden": "true"
-					}), /* @__PURE__ */ m(r, {
+					}), /* @__PURE__ */ m(i, {
 						size: "xs",
 						type: "secondary",
 						weight: "medium",
@@ -558,12 +558,12 @@ function le({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 					variant: "badge"
 				})]
 			}),
-			/* @__PURE__ */ m(i, {
+			/* @__PURE__ */ m(r, {
 				tag: o === "lg" ? "h3" : "h4",
 				className: t("font-bold tabular-nums tracking-tight border-none pb-0 leading-none", I[o]),
 				children: n
 			}),
-			!!e.subtitle && /* @__PURE__ */ m(r, {
+			!!e.subtitle && /* @__PURE__ */ m(i, {
 				size: "xs",
 				type: "secondary",
 				children: e.subtitle
@@ -573,7 +573,7 @@ function le({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 				trend: a,
 				className: L[o]
 			}),
-			!!e.footer && /* @__PURE__ */ m(r, {
+			!!e.footer && /* @__PURE__ */ m(i, {
 				size: "xxs",
 				type: "discrete",
 				children: e.footer
@@ -591,7 +591,7 @@ function ue({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 			children: [
 				/* @__PURE__ */ h("div", {
 					className: "flex items-center justify-between gap-3",
-					children: [/* @__PURE__ */ m(r, {
+					children: [/* @__PURE__ */ m(i, {
 						size: "xs",
 						type: "secondary",
 						weight: "medium",
@@ -607,7 +607,7 @@ function ue({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 				}),
 				/* @__PURE__ */ h("div", {
 					className: "flex items-baseline gap-2.5",
-					children: [/* @__PURE__ */ m(i, {
+					children: [/* @__PURE__ */ m(r, {
 						tag: "h3",
 						className: t("font-bold tabular-nums tracking-tight border-none pb-0 leading-none text-foreground", I[o]),
 						children: n
@@ -618,7 +618,7 @@ function ue({ data: e, formattedValue: n, trend: a, size: o, showSparkline: s, s
 						variant: "compact"
 					})]
 				}),
-				!!e.subtitle && /* @__PURE__ */ m(r, {
+				!!e.subtitle && /* @__PURE__ */ m(i, {
 					size: "xs",
 					type: "secondary",
 					children: e.subtitle
@@ -639,7 +639,7 @@ function de({ data: e, formattedValue: n, size: a, showChange: o, colorScheme: s
 		children: [
 			/* @__PURE__ */ h("div", {
 				className: "flex items-center gap-2",
-				children: [/* @__PURE__ */ m(r, {
+				children: [/* @__PURE__ */ m(i, {
 					size: "xs",
 					type: "secondary",
 					weight: "medium",
@@ -652,11 +652,11 @@ function de({ data: e, formattedValue: n, size: a, showChange: o, colorScheme: s
 			}),
 			/* @__PURE__ */ h("div", {
 				className: "mt-2.5 flex items-baseline gap-2",
-				children: [/* @__PURE__ */ m(i, {
+				children: [/* @__PURE__ */ m(r, {
 					tag: "h3",
 					className: t("font-bold tabular-nums tracking-tight border-none pb-0 leading-none", I[a]),
 					children: n
-				}), !!e.subtitle && /* @__PURE__ */ m(r, {
+				}), !!e.subtitle && /* @__PURE__ */ m(i, {
 					size: "xs",
 					type: "secondary",
 					children: e.subtitle
@@ -686,7 +686,7 @@ function de({ data: e, formattedValue: n, size: a, showChange: o, colorScheme: s
 				children: [/* @__PURE__ */ m(y, {
 					className: "size-3",
 					"aria-hidden": "true"
-				}), /* @__PURE__ */ m(r, {
+				}), /* @__PURE__ */ m(i, {
 					size: "xxs",
 					type: "secondary",
 					children: e.footer
@@ -697,7 +697,7 @@ function de({ data: e, formattedValue: n, size: a, showChange: o, colorScheme: s
 }
 //#endregion
 //#region src/components/composed/analytics/metric-bar/metric-bar.tsx
-function B({ metrics: e, period: i, onPeriodChange: a, variant: o = "default", size: s = "sm", showSparklines: c = !0, showChanges: l = !0, footerText: u, className: d }) {
+function B({ metrics: e, period: r, onPeriodChange: a, variant: o = "default", size: s = "sm", showSparklines: c = !0, showChanges: l = !0, footerText: u, className: d }) {
 	let f = /* @__PURE__ */ m("div", {
 		className: "grid min-w-0 flex-1 grid-cols-1 divide-y divide-border lg:flex lg:items-stretch lg:divide-x lg:divide-y-0",
 		children: e.map((e) => /* @__PURE__ */ m("div", {
@@ -710,25 +710,25 @@ function B({ metrics: e, period: i, onPeriodChange: a, variant: o = "default", s
 				showChange: l
 			})
 		}, e.id))
-	}), g = !!i && /* @__PURE__ */ m("div", {
+	}), g = !!r && /* @__PURE__ */ m("div", {
 		className: "flex shrink-0 items-center border-b border-border px-3 py-2 lg:border-b-0 lg:py-0",
 		children: /* @__PURE__ */ h(n, {
 			variant: "secondary",
 			buttonStyle: "ghost",
 			className: "gap-1.5",
-			onClick: a ? () => a(i.value) : void 0,
+			onClick: a ? () => a(r.value) : void 0,
 			children: [/* @__PURE__ */ m(b, {
 				className: "size-3.5",
 				"aria-hidden": "true"
-			}), /* @__PURE__ */ m(r, {
+			}), /* @__PURE__ */ m(i, {
 				size: "xs",
 				weight: "medium",
-				children: i.label
+				children: r.label
 			})]
 		})
 	});
 	return o === "gradient" ? /* @__PURE__ */ h("div", {
-		className: t("metric-bar--component", "w-full", "rounded-lg bg-gradient-to-r from-primary/8 via-info/5 to-success/8 p-[1px]", d),
+		className: t("metric-bar--component", "w-full", "rounded-lg bg-gradient-to-r from-primary/8 via-info/5 to-success/8 p-px", d),
 		children: [/* @__PURE__ */ h("div", {
 			className: "flex min-w-0 flex-col overflow-hidden rounded-radius bg-card lg:flex-row",
 			children: [g && /* @__PURE__ */ h(p, { children: [g, /* @__PURE__ */ m("div", {
@@ -737,7 +737,7 @@ function B({ metrics: e, period: i, onPeriodChange: a, variant: o = "default", s
 			})] }), f]
 		}), !!u && /* @__PURE__ */ m("div", {
 			className: "rounded-b-radius border-t border-border/50 bg-card px-4 py-2",
-			children: /* @__PURE__ */ m(r, {
+			children: /* @__PURE__ */ m(i, {
 				size: "xxs",
 				type: "discrete",
 				children: u
@@ -753,7 +753,7 @@ function B({ metrics: e, period: i, onPeriodChange: a, variant: o = "default", s
 			})] }), f]
 		}), !!u && /* @__PURE__ */ m("div", {
 			className: "border-t border-border/50 px-4 py-2",
-			children: /* @__PURE__ */ m(r, {
+			children: /* @__PURE__ */ m(i, {
 				size: "xxs",
 				type: "discrete",
 				children: u
@@ -826,13 +826,13 @@ function G({ current: n, previous: o, title: s, currentPeriod: c, previousPeriod
 		children: [
 			!!(c || l) && /* @__PURE__ */ h("div", {
 				className: "flex flex-wrap items-center gap-1.5",
-				children: [!!c && /* @__PURE__ */ m(r, {
+				children: [!!c && /* @__PURE__ */ m(i, {
 					tag: "span",
 					size: "xxs",
 					weight: "medium",
 					className: "rounded-full bg-muted px-2 py-0.5 uppercase tracking-wider text-muted-foreground",
 					children: c
-				}), !!l && /* @__PURE__ */ m(r, {
+				}), !!l && /* @__PURE__ */ m(i, {
 					tag: "span",
 					size: "xxs",
 					weight: "medium",
@@ -845,13 +845,13 @@ function G({ current: n, previous: o, title: s, currentPeriod: c, previousPeriod
 				children: [
 					/* @__PURE__ */ h("div", {
 						className: "rounded-lg border border-border/60 bg-card px-3 py-2.5",
-						children: [/* @__PURE__ */ m(r, {
+						children: [/* @__PURE__ */ m(i, {
 							size: "xxs",
 							type: "secondary",
 							weight: "medium",
 							className: "uppercase tracking-wider",
 							children: f.currentLabel
-						}), /* @__PURE__ */ m(i, {
+						}), /* @__PURE__ */ m(r, {
 							tag: "h5",
 							className: "text-xl tabular-nums tracking-tight border-none pb-0",
 							children: D(n)
@@ -869,13 +869,13 @@ function G({ current: n, previous: o, title: s, currentPeriod: c, previousPeriod
 					}),
 					/* @__PURE__ */ h("div", {
 						className: "rounded-lg border border-border/60 bg-muted/30 px-3 py-2.5",
-						children: [/* @__PURE__ */ m(r, {
+						children: [/* @__PURE__ */ m(i, {
 							size: "xxs",
 							type: "secondary",
 							weight: "medium",
 							className: "uppercase tracking-wider",
 							children: f.previousLabel
-						}), /* @__PURE__ */ m(i, {
+						}), /* @__PURE__ */ m(r, {
 							tag: "h5",
 							className: "text-xl tabular-nums tracking-tight border-none pb-0 text-muted-foreground",
 							children: D(o)
@@ -891,7 +891,7 @@ function G({ current: n, previous: o, title: s, currentPeriod: c, previousPeriod
 						className: "size-3",
 						strokeWidth: 2.5,
 						"aria-hidden": "true"
-					}), /* @__PURE__ */ h(r, {
+					}), /* @__PURE__ */ h(i, {
 						tag: "span",
 						size: "xs",
 						weight: "semibold",
@@ -904,7 +904,7 @@ function G({ current: n, previous: o, title: s, currentPeriod: c, previousPeriod
 							});
 						})(S)]
 					})]
-				}), /* @__PURE__ */ h(r, {
+				}), /* @__PURE__ */ h(i, {
 					size: "xs",
 					type: "secondary",
 					className: t("tabular-nums", w && "text-success", !w && !T && "text-destructive"),
@@ -944,7 +944,7 @@ var me = [
 function ge({ data: e, color: n }) {
 	let r = Math.max(...e, 1);
 	return /* @__PURE__ */ m("div", {
-		className: t("metric-micro-grid--component", "flex h-5 items-end gap-[2px]"),
+		className: t("metric-micro-grid--component", "flex h-5 items-end gap-0.5"),
 		children: e.slice(0, 6).map((e, t) => /* @__PURE__ */ m("div", {
 			className: "flex-1 rounded-t-sm",
 			style: {
@@ -1080,23 +1080,23 @@ function Se({ kind: e, data: t }) {
 		color: n
 	}) : /* @__PURE__ */ m(xe, { data: t });
 }
-function q({ title: e = "Overview", cells: n, className: i }) {
+function q({ title: e = "Overview", cells: n, className: r }) {
 	return /* @__PURE__ */ m(a, {
 		title: e,
-		className: i,
-		padding: "sm",
+		className: r,
+		padding: "default",
 		children: /* @__PURE__ */ m("div", {
 			className: "grid grid-cols-3 grid-rows-2 -m-2",
 			children: n.slice(0, 6).map((e, n) => /* @__PURE__ */ h("div", {
 				className: t("flex flex-col gap-1.5 px-3 py-2.5", n % 3 != 2 && "border-r border-border/50", n < 3 && "border-b border-border/50"),
 				children: [
-					/* @__PURE__ */ m(r, {
+					/* @__PURE__ */ m(i, {
 						size: "xxs",
 						type: "secondary",
 						className: "truncate uppercase tracking-wider",
 						children: e.label
 					}),
-					/* @__PURE__ */ m(r, {
+					/* @__PURE__ */ m(i, {
 						tag: "span",
 						weight: "bold",
 						className: "tabular-nums truncate",
@@ -1132,18 +1132,18 @@ function X({ title: e, value: n, change: a, data: o, theme: s = "green", subtitl
 			children: [/* @__PURE__ */ h("div", {
 				className: "min-w-0",
 				children: [
-					/* @__PURE__ */ m(r, {
+					/* @__PURE__ */ m(i, {
 						size: "xs",
 						weight: "medium",
 						className: "uppercase tracking-wider text-inverse-muted",
 						children: e
 					}),
-					!!n && /* @__PURE__ */ m(i, {
+					!!n && /* @__PURE__ */ m(r, {
 						tag: "h3",
 						className: "mt-1 text-3xl font-bold tabular-nums tracking-tight border-none pb-0 leading-none text-inverse-foreground",
 						children: n
 					}),
-					!!c && /* @__PURE__ */ m(r, {
+					!!c && /* @__PURE__ */ m(i, {
 						size: "xs",
 						className: "mt-1 text-inverse-muted",
 						children: c
@@ -1255,11 +1255,11 @@ function we(e, t) {
 		monthLabels: u
 	};
 }
-function Q({ title: n, description: i, data: o, className: s, strings: c }) {
+function Q({ title: n, description: r, data: o, className: s, strings: c }) {
 	let l = e(E, c), { weeks: u, monthLabels: d } = we(o, l.heatmapMonthNames);
 	return /* @__PURE__ */ h(a, {
 		title: n,
-		description: i,
+		description: r,
 		className: t("activity-heatmap--component", s),
 		children: [/* @__PURE__ */ h("div", {
 			className: "overflow-x-auto",
@@ -1272,7 +1272,7 @@ function Q({ title: n, description: i, data: o, className: s, strings: c }) {
 				children: /* @__PURE__ */ m("div", {
 					className: "relative flex",
 					style: { width: `${u.length * 15}px` },
-					children: d.filter((e, t, n) => t === 0 || e.weekIndex - n[t - 1].weekIndex >= 3).map((e) => /* @__PURE__ */ m(r, {
+					children: d.filter((e, t, n) => t === 0 || e.weekIndex - n[t - 1].weekIndex >= 3).map((e) => /* @__PURE__ */ m(i, {
 						size: "xxs",
 						type: "secondary",
 						className: "absolute leading-none whitespace-nowrap",
@@ -1286,10 +1286,10 @@ function Q({ title: n, description: i, data: o, className: s, strings: c }) {
 			}), /* @__PURE__ */ h("div", {
 				className: "flex gap-0",
 				children: [/* @__PURE__ */ m("div", {
-					className: "mr-1 flex flex-col gap-[3px]",
+					className: "mr-1 flex flex-col gap-0.75",
 					children: l.heatmapDayLabels.map((e, t) => /* @__PURE__ */ m("div", {
 						className: "flex h-3 w-6 items-center justify-end",
-						children: !!e && /* @__PURE__ */ m(r, {
+						children: !!e && /* @__PURE__ */ m(i, {
 							size: "xxs",
 							type: "secondary",
 							className: "leading-none",
@@ -1297,9 +1297,9 @@ function Q({ title: n, description: i, data: o, className: s, strings: c }) {
 						})
 					}, `day-${t}`))
 				}), /* @__PURE__ */ m("div", {
-					className: "flex gap-[3px]",
+					className: "flex gap-0.75",
 					children: u.map((e, n) => /* @__PURE__ */ m("div", {
-						className: "flex flex-col gap-[3px]",
+						className: "flex flex-col gap-0.75",
 						children: e.map((e, r) => {
 							let i = e ? `${e.date}: Level ${e.level}` : void 0;
 							return /* @__PURE__ */ m("div", {
@@ -1313,7 +1313,7 @@ function Q({ title: n, description: i, data: o, className: s, strings: c }) {
 		}), /* @__PURE__ */ h("div", {
 			className: "mt-4 flex items-center justify-end gap-1.5",
 			children: [
-				/* @__PURE__ */ m(r, {
+				/* @__PURE__ */ m(i, {
 					size: "xxs",
 					type: "secondary",
 					children: l.heatmapLegendLess
@@ -1325,7 +1325,7 @@ function Q({ title: n, description: i, data: o, className: s, strings: c }) {
 					3,
 					4
 				].map((e) => /* @__PURE__ */ m("div", { className: t("size-3 rounded-sm", Z[e]) }, `legend-${e}`)),
-				/* @__PURE__ */ m(r, {
+				/* @__PURE__ */ m(i, {
 					size: "xxs",
 					type: "secondary",
 					children: l.heatmapLegendMore