themelia-react-ui 1.0.1 → 2.0.0

package/dist/features/activities.js

@@ -1,15 +1,15 @@
 "use client";
-import { o as e } from "../ui-provider-CftIB6TY.js";
+import { o as e } from "../ui-provider-D2_TeLqw.js";
 import { useStrings as t } from "../lib/strings.js";
-import { t as n } from "../utils-C2EKeIw3.js";
-import { n as r } from "../buttons-Co6GavvM.js";
-import { a as i, t as a } from "../typography-Cv8MT-82.js";
-import { r as o, t as s } from "../structure-MvKVq-oL.js";
-import { n as c } from "../action-menu-Cx3SdfbN.js";
-import { t as l } from "../badge-BZXZT9wd.js";
-import { l as u } from "../data-display-cWIRdeaf.js";
-import { o as d, r as f, u as p } from "../comments-DviPLnwy.js";
-import { o as m } from "../mentions-B8Ko-fhS.js";
+import { t as n } from "../utils-Cospvlj1.js";
+import { s as r, t as i } from "../typography-CAr3dQhX.js";
+import { t as a } from "../button-BS3KDg00.js";
+import { r as o, t as s } from "../structure-hzCW-XsV.js";
+import { n as c } from "../action-menu-BTpyPWJ2.js";
+import { t as l } from "../badge-0tATj-tW.js";
+import { l as u } from "../data-display-3xWQUnMA.js";
+import { o as d, r as f, u as p } from "../comments-You0Bzbr.js";
+import { o as m } from "../mentions-DwnO1hh4.js";
 import { Fragment as h, useCallback as g, useEffect as _, useMemo as v, useRef as y, useState as b } from "react";
 import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
 import { Activity as w, AlertTriangle as T, ArrowLeftRight as E, Ban as D, Check as O, ChevronDown as ee, ChevronRight as te, CircleDot as k, FileEdit as A, Flag as j, Heart as M, LinkIcon as N, Mail as P, MailCheck as F, MailOpen as I, MailX as L, MessageCircle as ne, MessageSquare as R, Pencil as z, Plus as B, ShieldCheck as V, ShoppingBag as H, Sparkles as U, Star as W, Trash2 as G, UserMinus as re, UserPlus as K } from "lucide-react";
@@ -26,12 +26,12 @@ var ae = {
 	},
 	updated: {
 		icon: z,
-		tone: "info",
+		tone: "neutral",
 		label: "Updated"
 	},
 	edited: {
 		icon: A,
-		tone: "info",
+		tone: "neutral",
 		label: "Edited"
 	},
 	deleted: {
@@ -51,12 +51,12 @@ var ae = {
 	},
 	status_changed: {
 		icon: E,
-		tone: "primary",
+		tone: "neutral",
 		label: "Status changed"
 	},
 	status_transition: {
 		icon: E,
-		tone: "primary",
+		tone: "neutral",
 		label: "Status changed"
 	},
 	status_override: {
@@ -66,17 +66,17 @@ var ae = {
 	},
 	assigned: {
 		icon: K,
-		tone: "info",
+		tone: "neutral",
 		label: "Assigned"
 	},
 	unassigned: {
 		icon: re,
-		tone: "destructive",
+		tone: "neutral",
 		label: "Unassigned"
 	},
 	mail_sent: {
 		icon: P,
-		tone: "info",
+		tone: "neutral",
 		label: "Email sent"
 	},
 	mail_delivered: {
@@ -86,12 +86,12 @@ var ae = {
 	},
 	mail_opened: {
 		icon: I,
-		tone: "info",
+		tone: "neutral",
 		label: "Email opened"
 	},
 	mail_clicked: {
 		icon: I,
-		tone: "info",
+		tone: "neutral",
 		label: "Email clicked"
 	},
 	mail_bounced: {
@@ -106,7 +106,7 @@ var ae = {
 	},
 	comment_created: {
 		icon: R,
-		tone: "warning",
+		tone: "neutral",
 		label: "Comment posted"
 	},
 	comment_deleted: {
@@ -131,12 +131,12 @@ var ae = {
 	},
 	favorited: {
 		icon: M,
-		tone: "warning",
+		tone: "neutral",
 		label: "Favorited"
 	},
 	ordered: {
 		icon: H,
-		tone: "primary",
+		tone: "neutral",
 		label: "Order placed"
 	},
 	published: {
@@ -151,7 +151,7 @@ var ae = {
 	},
 	linked: {
 		icon: N,
-		tone: "info",
+		tone: "neutral",
 		label: "Linked"
 	},
 	failed: {
@@ -206,9 +206,13 @@ function le(e, t, n) {
 	if (Y(r)) return t.today;
 	if (Z(r)) return t.yesterday;
 	try {
-		return q(r, "PPP", n ? { locale: n } : void 0);
+		return new Intl.DateTimeFormat(n?.code ?? "en-US", { dateStyle: "long" }).format(r);
 	} catch {
-		return e;
+		try {
+			return q(r, "PP", n ? { locale: n } : void 0);
+		} catch {
+			return e;
+		}
 	}
 }
 function ue({ activities: e, groupByDate: t = !0, expandedByDefault: n = !1, defaultExpandedIds: r, expandedIds: i, onExpandedIdsChange: a, locale: o, strings: s, formatDateGroupLabel: c }) {
@@ -400,26 +404,26 @@ function pe({ activity: e, actions: t, onAction: n, label: r }) {
 //#region src/components/features/activities/partials/activity-changes.tsx
 function me({ change: e }) {
 	let t = e.old !== null && e.old !== void 0, n = e.new !== null && e.new !== void 0;
-	return !t && !n ? /* @__PURE__ */ S(i, {
+	return !t && !n ? /* @__PURE__ */ S(r, {
 		tag: "span",
 		children: e.description
-	}) : /* @__PURE__ */ C(i, {
+	}) : /* @__PURE__ */ C(r, {
 		tag: "span",
 		className: "inline-flex flex-wrap items-baseline gap-space-xs",
 		children: [
-			!!t && /* @__PURE__ */ S(i, {
+			!!t && /* @__PURE__ */ S(r, {
 				tag: "span",
 				size: "inherit",
 				className: "rounded bg-destructive/10 text-destructive line-through px-1 py-px",
 				children: e.old
 			}),
-			t && n && /* @__PURE__ */ S(i, {
+			t && n && /* @__PURE__ */ S(r, {
 				tag: "span",
 				size: "inherit",
 				type: "secondary",
 				children: "→"
 			}),
-			!!n && /* @__PURE__ */ S(i, {
+			!!n && /* @__PURE__ */ S(r, {
 				tag: "span",
 				size: "inherit",
 				className: "rounded bg-success/15 text-success px-1 py-px",
@@ -435,7 +439,7 @@ function he({ changes: e, className: t }) {
 			gap: "sm",
 			children: e.map((e) => /* @__PURE__ */ C("div", {
 				className: "flex items-baseline gap-space-md",
-				children: [/* @__PURE__ */ S(i, {
+				children: [/* @__PURE__ */ S(r, {
 					size: "xs",
 					type: "secondary",
 					weight: "medium",
@@ -448,13 +452,16 @@ function he({ changes: e, className: t }) {
 }
 //#endregion
 //#region src/components/features/activities/partials/activity-date-label.tsx
-function ge({ label: e, first: t, className: r }) {
-	return e === "" ? null : /* @__PURE__ */ S(i, {
-		size: "xs",
-		type: "secondary",
-		weight: "medium",
-		className: n("activity-date-label--component", "uppercase tracking-wider", !t && "mt-space-md", r),
-		children: e
+function ge({ label: e, first: t, className: i }) {
+	return e === "" ? null : /* @__PURE__ */ S(s, {
+		gap: "none",
+		className: n("activity-date-label--component", !t && "mt-space-md", i),
+		children: /* @__PURE__ */ S(r, {
+			size: "xs",
+			type: "secondary",
+			weight: "medium",
+			children: e
+		})
 	});
 }
 //#endregion
@@ -542,21 +549,21 @@ var ve = {
 };
 //#endregion
 //#region src/components/features/activities/partials/activity-resource-tag.tsx
-function be({ resource: e, config: t, fallbackText: a, onClick: o }) {
-	let s = ve[t?.tone ?? "neutral"], c = t?.icon ?? k, u = t?.label ?? a ?? e.label ?? e.key, d = typeof o == "function", f = /* @__PURE__ */ C(x, { children: [
+function be({ resource: e, config: t, fallbackText: i, onClick: o }) {
+	let s = ve[t?.tone ?? "neutral"], c = t?.icon ?? k, u = t?.label ?? i ?? e.label ?? e.key, d = typeof o == "function", f = /* @__PURE__ */ C(x, { children: [
 		/* @__PURE__ */ S(c, { className: n("size-icon-sm shrink-0", s.fg) }),
-		/* @__PURE__ */ S(i, {
+		/* @__PURE__ */ S(r, {
 			tag: "span",
 			weight: "medium",
 			lineHeight: "none",
 			className: s.chipFg,
 			children: u
 		}),
-		!!t?.tags && t.tags.length > 0 && /* @__PURE__ */ S(i, {
+		!!t?.tags && t.tags.length > 0 && /* @__PURE__ */ S(r, {
 			tag: "span",
 			size: "xs",
 			type: "secondary",
-			className: "ml-space-2xs border-l border-border pl-space-sm",
+			className: "border-l border-border pl-space-sm",
 			children: t.tags.join(" · ")
 		}),
 		!!t?.badge && /* @__PURE__ */ S(l, {
@@ -567,7 +574,7 @@ function be({ resource: e, config: t, fallbackText: a, onClick: o }) {
 			children: t.badge.label
 		})
 	] }), p = n("inline-flex items-center gap-space-xs rounded-full px-space-sm py-px align-baseline", "border border-border/50 shadow-none", s.chipBg, d && "cursor-pointer transition-colors hover:bg-foreground/5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring");
-	return d ? /* @__PURE__ */ S(r, {
+	return d ? /* @__PURE__ */ S(a, {
 		type: "button",
 		tone: "secondary",
 		buttonStyle: "ghost",
@@ -575,7 +582,7 @@ function be({ resource: e, config: t, fallbackText: a, onClick: o }) {
 		onClick: (e) => {
 			e.stopPropagation(), o?.();
 		},
-		className: n("activity-resource-tag--component", p, "h-auto rounded-full"),
+		className: n("activity-resource-tag--component gap-space-xs align-baseline", s.chipBg),
 		title: t?.note,
 		children: f
 	}) : /* @__PURE__ */ S("span", {
@@ -591,7 +598,7 @@ function xe({ actorId: e, text: t, href: n, activity: o, youLabel: s, currentUse
 		id: e,
 		name: t
 	};
-	return n ? /* @__PURE__ */ S(a, {
+	return n ? /* @__PURE__ */ S(i, {
 		href: n,
 		size: "inherit",
 		underline: !1,
@@ -600,7 +607,7 @@ function xe({ actorId: e, text: t, href: n, activity: o, youLabel: s, currentUse
 		},
 		className: "font-semibold text-foreground underline-offset-2 hover:underline",
 		children: u
-	}) : l ? /* @__PURE__ */ S(r, {
+	}) : l ? /* @__PURE__ */ S(a, {
 		type: "button",
 		tone: "secondary",
 		buttonStyle: "ghost",
@@ -608,13 +615,13 @@ function xe({ actorId: e, text: t, href: n, activity: o, youLabel: s, currentUse
 		onClick: (e) => {
 			e.stopPropagation(), l(d, o);
 		},
-		className: "h-auto rounded px-0 py-0 text-foreground underline-offset-2 hover:underline",
-		children: /* @__PURE__ */ S(i, {
+		className: "h-auto min-h-0 rounded-inner px-0 py-0 text-foreground underline-offset-2 hover:underline",
+		children: /* @__PURE__ */ S(r, {
 			tag: "span",
 			weight: "semibold",
 			children: u
 		})
-	}) : /* @__PURE__ */ S(i, {
+	}) : /* @__PURE__ */ S(r, {
 		tag: "span",
 		weight: "semibold",
 		children: u
@@ -622,7 +629,7 @@ function xe({ actorId: e, text: t, href: n, activity: o, youLabel: s, currentUse
 }
 function Se(e, t) {
 	return e.map((e, n) => {
-		let r = `seg-${n}-${e.type}`;
+		let i = `seg-${n}-${e.type}`;
 		switch (e.type) {
 			case "actor": return /* @__PURE__ */ C(h, { children: [/* @__PURE__ */ S(xe, {
 				actorId: e.actorId,
@@ -632,19 +639,19 @@ function Se(e, t) {
 				youLabel: t.youLabel,
 				currentUserId: t.currentUserId,
 				onActorClick: t.onActorClick
-			}), " "] }, r);
+			}), " "] }, i);
 			case "field":
-			case "value": return /* @__PURE__ */ C(h, { children: [/* @__PURE__ */ S(i, {
+			case "value": return /* @__PURE__ */ C(h, { children: [/* @__PURE__ */ S(r, {
 				tag: "span",
 				weight: "semibold",
 				children: e.text
-			}), " "] }, r);
+			}), " "] }, i);
 			case "status": return /* @__PURE__ */ C(h, { children: [/* @__PURE__ */ S(l, {
 				inline: !0,
 				size: "sm",
 				tone: ye[e.tone ?? "neutral"],
 				children: e.text
-			}), " "] }, r);
+			}), " "] }, i);
 			case "resource": {
 				let n = t.getResourceConfig?.(e.resource);
 				return /* @__PURE__ */ C(h, { children: [/* @__PURE__ */ S(be, {
@@ -652,39 +659,39 @@ function Se(e, t) {
 					config: n,
 					fallbackText: e.text,
 					onClick: t.onResourceClick ? () => t.onResourceClick?.(e.resource, n, t.activity) : void 0
-				}), " "] }, r);
+				}), " "] }, i);
 			}
-			default: return /* @__PURE__ */ C(h, { children: [/* @__PURE__ */ S(i, {
+			default: return /* @__PURE__ */ C(h, { children: [/* @__PURE__ */ S(r, {
 				tag: "span",
 				children: e.text
-			}), " "] }, r);
+			}), " "] }, i);
 		}
 	});
 }
 function Ce(e) {
-	let { activity: t } = e, n = t.headline ?? t.event, r = t.actor?.name;
-	if (!r || !n.includes(r)) return /* @__PURE__ */ S(i, {
+	let { activity: t } = e, n = t.headline ?? t.event, i = t.actor?.name;
+	if (!i || !n.includes(i)) return /* @__PURE__ */ S(r, {
 		tag: "span",
 		children: n
 	});
-	let [a, ...o] = n.split(r);
+	let [a, ...o] = n.split(i);
 	return /* @__PURE__ */ C(x, { children: [
-		!!a && /* @__PURE__ */ S(i, {
+		!!a && /* @__PURE__ */ S(r, {
 			tag: "span",
 			children: a
 		}),
 		/* @__PURE__ */ S(xe, {
 			actorId: t.actor?.id,
-			text: r,
+			text: i,
 			href: t.actor?.href,
 			activity: t,
 			youLabel: e.youLabel,
 			currentUserId: e.currentUserId,
 			onActorClick: e.onActorClick
 		}),
-		o.length > 0 && /* @__PURE__ */ S(i, {
+		o.length > 0 && /* @__PURE__ */ S(r, {
 			tag: "span",
-			children: o.join(r)
+			children: o.join(i)
 		})
 	] });
 }
@@ -734,14 +741,18 @@ function Te({ icon: e, tone: t, density: r, last: i, className: a }) {
 //#endregion
 //#region src/components/features/activities/partials/activity-row.tsx
 function Ee({ metadata: e, moreLabel: t }) {
-	let n = e.slice(0, 3), r = e.length - n.length;
-	return /* @__PURE__ */ C("div", {
-		className: "activity-row--metadata-preview mt-space-xs flex min-w-0 flex-wrap items-center gap-x-space-sm gap-y-space-2xs",
-		children: [n.map((e, t) => /* @__PURE__ */ C(h, { children: [/* @__PURE__ */ C(i, {
+	let n = e.slice(0, 3), i = e.length - n.length;
+	return /* @__PURE__ */ C(s, {
+		direction: "horizontal",
+		align: "center",
+		wrap: !0,
+		gap: "sm",
+		className: "activity-row--metadata-preview mt-space-xs min-w-0 gap-y-space-2xs",
+		children: [n.map((e, t) => /* @__PURE__ */ C(h, { children: [/* @__PURE__ */ C(r, {
 			tag: "span",
 			type: "secondary",
 			className: "inline-flex min-w-0 items-baseline gap-space-xs leading-snug",
-			children: [/* @__PURE__ */ C(i, {
+			children: [/* @__PURE__ */ C(r, {
 				tag: "span",
 				size: "xs",
 				type: "discrete",
@@ -751,27 +762,27 @@ function Ee({ metadata: e, moreLabel: t }) {
 					":",
 					" "
 				]
-			}), /* @__PURE__ */ S(i, {
+			}), /* @__PURE__ */ S(r, {
 				tag: "span",
 				size: "inherit",
 				className: "min-w-0 truncate",
 				children: e.value
 			})]
-		}), t < n.length - 1 && /* @__PURE__ */ S(i, {
+		}), t < n.length - 1 && /* @__PURE__ */ S(r, {
 			tag: "span",
 			size: "xs",
 			type: "discrete",
 			className: "leading-snug",
 			"aria-hidden": "true",
 			children: " · "
-		})] }, e.label)), r > 0 && /* @__PURE__ */ C(i, {
+		})] }, e.label)), i > 0 && /* @__PURE__ */ C(r, {
 			tag: "span",
 			size: "xs",
 			type: "discrete",
 			className: "leading-snug",
 			children: [
 				"+",
-				r,
+				i,
 				" ",
 				t
 			]
@@ -784,27 +795,28 @@ function De({ metadata: e }) {
 			base: 1,
 			sm: 2
 		},
-		gap: "xs",
+		gap: "md",
 		className: "activity-row--metadata",
-		children: e.map((e) => /* @__PURE__ */ C("div", {
-			className: "min-w-0 rounded-radius-md border border-border/60 bg-background/70 px-space-sm py-space-xs",
-			children: [/* @__PURE__ */ S(i, {
+		children: e.map((e) => /* @__PURE__ */ C(s, {
+			gap: "dense",
+			className: "min-w-0",
+			children: [/* @__PURE__ */ S(r, {
 				tag: "div",
 				size: "xs",
 				type: "discrete",
 				weight: "medium",
 				className: "leading-snug",
 				children: e.label
-			}), /* @__PURE__ */ S(i, {
+			}), /* @__PURE__ */ S(r, {
 				tag: "div",
-				className: "mt-space-2xs min-w-0 break-words leading-snug",
+				className: "min-w-0 break-words leading-snug",
 				children: e.value
 			})]
 		}, e.label))
 	});
 }
 function Oe(e) {
-	let { activity: t, density: a, itemSpacing: o, eventConfig: c, tone: u, last: d, expanded: f, onExpandedChange: p, detailsCollapsible: m, relativeTime: h, absoluteTime: g, sourceLabel: _, youLabel: v, showChangesLabel: y, hideChangesLabel: b, moreLabel: x, actionsLabel: w, currentUserId: T, actions: E, onActivityClick: D, onActorClick: O, onResourceClick: k, onAction: A, getResourceConfig: j, headlineOverride: M, markerOverride: N, customDetails: P, rowClassName: F, markerClassName: I, contentClassName: L, detailsClassName: ne } = e, R = t.iconOverride ?? c.icon, z = (t.changes?.length ?? 0) > 0, B = t.metadata ?? [], V = B.length > 0, H = (t.resources?.length ?? 0) > 0, U = t.details !== void 0 && t.details !== null && t.details !== !1, W = P != null && P !== !1, G = V || z || U || W, re = t.description !== void 0 && t.description !== null && t.description !== "", K = a !== "compact", q = a === "rich", J = m ?? (V || z), Y = q && G && (!J || f), X = q && V && J && !f, Z = E.filter((e) => e.presentation === "inline"), ie = E.filter((e) => e.presentation !== "inline"), ae = M ?? /* @__PURE__ */ S(we, {
+	let { activity: t, density: i, itemSpacing: o, eventConfig: c, tone: u, last: d, expanded: f, onExpandedChange: p, detailsCollapsible: m, relativeTime: h, absoluteTime: g, sourceLabel: _, youLabel: v, showChangesLabel: y, hideChangesLabel: b, moreLabel: x, actionsLabel: w, currentUserId: T, actions: E, onActivityClick: D, onActorClick: O, onResourceClick: k, onAction: A, getResourceConfig: j, headlineOverride: M, markerOverride: N, customDetails: P, rowClassName: F, markerClassName: I, contentClassName: L, detailsClassName: ne } = e, R = t.iconOverride ?? c.icon, z = (t.changes?.length ?? 0) > 0, B = t.metadata ?? [], V = B.length > 0, H = (t.resources?.length ?? 0) > 0, U = t.details !== void 0 && t.details !== null && t.details !== !1, W = P != null && P !== !1, G = V || z || U || W, re = t.description !== void 0 && t.description !== null && t.description !== "", K = i !== "compact", q = i === "rich", J = m ?? (V || z), Y = q && G && (!J || f), X = q && V && J && !f, Z = E.filter((e) => e.presentation === "inline"), ie = E.filter((e) => e.presentation !== "inline"), ae = M ?? /* @__PURE__ */ S(we, {
 		activity: t,
 		currentUserId: T,
 		youLabel: v,
@@ -814,12 +826,12 @@ function Oe(e) {
 	}), oe = N ?? /* @__PURE__ */ S(Te, {
 		icon: R,
 		tone: u,
-		density: a,
+		density: i,
 		last: d,
 		className: I
-	}), Q = typeof D == "function", se = z || H || ie.length > 0 || Z.length > 0 || typeof O == "function" || typeof k == "function", ce = Q && !se, le = a === "rich" ? "gap-space-md py-space-xs" : a === "compact" ? "gap-space-sm py-space-2xs" : "gap-space-md py-space-2xs", ue = d ? "" : o === "compact" ? "pb-space-sm" : o === "relaxed" ? "pb-space-xl" : "pb-space-md";
+	}), Q = typeof D == "function", se = z || H || ie.length > 0 || Z.length > 0 || typeof O == "function" || typeof k == "function", ce = Q && !se, le = i === "rich" ? "gap-space-md py-space-xs" : i === "compact" ? "gap-space-sm py-space-2xs" : "gap-space-md py-space-2xs", ue = d ? "" : o === "compact" ? "pb-space-sm" : o === "relaxed" ? "pb-space-xl" : "pb-space-md";
 	return /* @__PURE__ */ C("div", {
-		className: n("activity-row--component relative flex", le, Q && "cursor-pointer rounded-radius-md hover:bg-muted/40", F),
+		className: n("activity-row--component relative flex", le, Q && "cursor-pointer rounded-radius hover:bg-muted/40", F),
 		onClick: Q ? () => D?.(t) : void 0,
 		role: ce ? "button" : void 0,
 		tabIndex: ce ? 0 : void 0,
@@ -829,76 +841,78 @@ function Oe(e) {
 		children: [oe, /* @__PURE__ */ C("div", {
 			className: n("activity-row--content min-w-0 flex-1", ue, L),
 			children: [
-				/* @__PURE__ */ C("div", {
-					className: "activity-row--summary grid min-w-0 grid-cols-1 items-start gap-x-space-lg gap-y-space-sm sm:grid-cols-[minmax(0,1fr)_max-content]",
-					children: [/* @__PURE__ */ C(s, {
-						gap: "dense",
-						className: "min-w-0",
-						children: [/* @__PURE__ */ C("div", {
-							className: "activity-row--headline flex min-w-0 flex-wrap items-center gap-x-space-sm gap-y-space-xs",
-							children: [/* @__PURE__ */ S(i, {
-								tag: "span",
-								size: "inherit",
-								lineHeight: "snug",
-								className: "min-w-0 break-words [overflow-wrap:anywhere]",
-								children: ae
-							}), !!_ && /* @__PURE__ */ S(l, {
-								inline: !0,
-								size: "sm",
-								tone: "secondary",
-								children: _
+				/* @__PURE__ */ C(s, {
+					gap: "dense",
+					children: [/* @__PURE__ */ C("div", {
+						className: "activity-row--summary grid min-w-0 grid-cols-1 items-start gap-x-space-lg gap-y-space-sm sm:grid-cols-[minmax(0,1fr)_max-content]",
+						children: [/* @__PURE__ */ C(s, {
+							gap: "dense",
+							className: "min-w-0",
+							children: [/* @__PURE__ */ C("div", {
+								className: "activity-row--headline flex min-w-0 flex-wrap items-center gap-x-space-sm gap-y-space-xs",
+								children: [/* @__PURE__ */ S(r, {
+									tag: "span",
+									size: "inherit",
+									lineHeight: "snug",
+									className: "min-w-0 break-words [overflow-wrap:anywhere]",
+									children: ae
+								}), !!_ && /* @__PURE__ */ S(l, {
+									inline: !0,
+									size: "sm",
+									tone: "secondary",
+									children: _
+								})]
+							}), X && /* @__PURE__ */ S(Ee, {
+								metadata: B,
+								moreLabel: x
 							})]
-						}), X && /* @__PURE__ */ S(Ee, {
-							metadata: B,
-							moreLabel: x
+						}), /* @__PURE__ */ C(s, {
+							direction: "horizontal",
+							gap: "xs",
+							justify: {
+								base: "between",
+								sm: "end"
+							},
+							wrap: !1,
+							className: "activity-row--trailing w-full shrink-0 justify-self-start sm:w-auto sm:justify-self-end",
+							children: [
+								!!h && /* @__PURE__ */ S(r, {
+									size: "xs",
+									type: "secondary",
+									className: "whitespace-nowrap tabular-nums leading-snug",
+									title: g ?? void 0,
+									children: h
+								}),
+								q && G && J && /* @__PURE__ */ S(a, {
+									type: "button",
+									size: "sm",
+									iconOnly: !0,
+									tone: "secondary",
+									buttonStyle: "ghost",
+									className: "size-action-sm text-muted-foreground",
+									onClick: (e) => {
+										e.stopPropagation(), p(!f);
+									},
+									title: f ? b : y,
+									"aria-label": f ? b : y,
+									"aria-expanded": f,
+									children: S(f ? ee : te, { className: "size-icon-sm" })
+								}),
+								q && ie.length > 0 && /* @__PURE__ */ S(pe, {
+									activity: t,
+									actions: ie,
+									onAction: A,
+									label: w
+								})
+							]
 						})]
-					}), /* @__PURE__ */ C(s, {
-						direction: "horizontal",
-						gap: "xs",
-						justify: {
-							base: "between",
-							sm: "end"
-						},
-						wrap: !1,
-						className: "activity-row--trailing w-full shrink-0 justify-self-start sm:w-auto sm:justify-self-end",
-						children: [
-							!!h && /* @__PURE__ */ S(i, {
-								size: "xs",
-								type: "secondary",
-								className: "whitespace-nowrap tabular-nums leading-snug",
-								title: g ?? void 0,
-								children: h
-							}),
-							q && G && J && /* @__PURE__ */ S(r, {
-								type: "button",
-								size: "sm",
-								iconOnly: !0,
-								tone: "secondary",
-								buttonStyle: "ghost",
-								className: "size-action-sm text-muted-foreground",
-								onClick: (e) => {
-									e.stopPropagation(), p(!f);
-								},
-								title: f ? b : y,
-								"aria-label": f ? b : y,
-								"aria-expanded": f,
-								children: S(f ? ee : te, { className: "size-icon-sm" })
-							}),
-							q && ie.length > 0 && /* @__PURE__ */ S(pe, {
-								activity: t,
-								actions: ie,
-								onAction: A,
-								label: w
-							})
-						]
+					}), !!K && re && /* @__PURE__ */ S(r, {
+						tag: "div",
+						type: "secondary",
+						className: "max-w-3xl leading-relaxed",
+						children: t.description
 					})]
 				}),
-				!!K && re && /* @__PURE__ */ S(i, {
-					tag: "div",
-					type: "secondary",
-					className: "mt-space-xs max-w-3xl leading-relaxed",
-					children: t.description
-				}),
 				!!q && H && t.resources && /* @__PURE__ */ S(s, {
 					direction: "horizontal",
 					gap: "xs",
@@ -918,11 +932,11 @@ function Oe(e) {
 					className: "activity-row--inline-actions mt-space-sm",
 					children: Z.map((e) => {
 						let n = e.icon;
-						return /* @__PURE__ */ S(r, {
+						return /* @__PURE__ */ S(a, {
 							type: "button",
 							size: "sm",
 							tone: e.tone === "destructive" ? "destructive" : "secondary",
-							buttonStyle: "ghost",
+							buttonStyle: "outline",
 							icon: n,
 							disabled: e.disabled,
 							className: "h-auto min-h-action-sm px-control-sm py-space-xs",
@@ -936,9 +950,9 @@ function Oe(e) {
 				Y && /* @__PURE__ */ S("div", {
 					className: "mt-space-sm",
 					children: /* @__PURE__ */ S("div", {
-						className: n("activity-row--details rounded-radius border border-border/60 bg-card/70 p-surface shadow-xs", ne),
+						className: n("activity-row--details", ne),
 						children: /* @__PURE__ */ C(s, {
-							gap: "sm",
+							gap: "md",
 							children: [
 								V && /* @__PURE__ */ S(De, { metadata: B }),
 								z && t.changes && /* @__PURE__ */ S(he, {
@@ -946,11 +960,11 @@ function Oe(e) {
 									className: "border-0 bg-transparent p-0"
 								}),
 								U && /* @__PURE__ */ S("div", {
-									className: n(z && "pt-space-xs"),
+									className: "activity-row--details-body",
 									children: t.details
 								}),
 								W && /* @__PURE__ */ S("div", {
-									className: n((z || U) && "pt-space-xs"),
+									className: "activity-row--details-custom",
 									children: P
 								})
 							]
@@ -977,8 +991,8 @@ function Ae(e, t) {
 function je(e, t) {
 	return e.toneOverride ?? t;
 }
-function Me(r) {
-	let { activities: a = [], density: o = "default", itemSpacing: c = "relaxed", groupByDate: l = !0, expandedByDefault: u = !1, detailsCollapsible: d, defaultExpandedIds: f, expandedIds: p, onExpandedIdsChange: m, currentUserId: h, loading: g = !1, eventConfig: _, strings: y, slots: b, rowClassNames: x, className: w, locale: T, formatRelativeTime: E, formatAbsoluteTime: D, formatDateGroupLabel: O, getEventLabel: ee, getSourceLabel: te, actionsForActivity: k, onActivityClick: A, onActorClick: j, onResourceClick: M, onAction: N, onActivityExpandedChange: P, resources: F, onResourcesChange: I } = r, L = t(se, y), ne = v(() => ({
+function Me(i) {
+	let { activities: a = [], density: o = "default", itemSpacing: c = "relaxed", groupByDate: l = !0, expandedByDefault: u = !1, detailsCollapsible: d, defaultExpandedIds: f, expandedIds: p, onExpandedIdsChange: m, currentUserId: h, loading: g = !1, eventConfig: _, strings: y, slots: b, rowClassNames: x, className: w, locale: T, formatRelativeTime: E, formatAbsoluteTime: D, formatDateGroupLabel: O, getEventLabel: ee, getSourceLabel: te, actionsForActivity: k, onActivityClick: A, onActorClick: j, onResourceClick: M, onAction: N, onActivityExpandedChange: P, resources: F, onResourcesChange: I } = i, L = t(se, y), ne = v(() => ({
 		...oe,
 		..._
 	}), [_]), R = de({
@@ -997,7 +1011,7 @@ function Me(r) {
 	}), H = E ?? z.formatRelativeTime ?? ((e) => e), U = D ?? ((e) => ke(e, B));
 	if (g) return /* @__PURE__ */ S("div", {
 		className: n("activities-feed--component", "px-space-md py-space-xl", w),
-		children: b?.loading ?? /* @__PURE__ */ S(i, {
+		children: b?.loading ?? /* @__PURE__ */ S(r, {
 			type: "secondary",
 			align: "center",
 			children: L.loading
@@ -1117,7 +1131,7 @@ function Le(e, t) {
 	return {
 		id: e.id,
 		event: e.event ?? e.kind,
-		source: typeof e.label == "string" ? e.label : e.kind,
+		source: typeof e.label == "string" ? e.label : void 0,
 		actor: n,
 		createdAt: e.timestamp,
 		timestamp: void 0,
@@ -1152,8 +1166,8 @@ function Le(e, t) {
 		] : void 0
 	};
 }
-function Re(r) {
-	let { entries: a, order: o = "desc", itemSpacing: c = "relaxed", resources: l, onResourceSearch: u, canModerate: m, onCommentDelete: h, onCommentReact: _, onCommentReply: y, onCommentPinToggle: b, strings: x, activityStrings: w, renderers: T, renderEventDetails: E, eventDetailsCollapsible: D = !0, defaultExpandedIds: O, expandedIds: ee, onExpandedIdsChange: te, onEventExpandedChange: k, onEventAction: A, classNames: j, composer: M, bare: N = !1, title: P, getMediaUrl: F, getMediaName: I, getStatusLabel: L, formatRelativeTime: R, className: z } = r, B = t(se, w), V = e(), H = g((e) => {
+function Re(i) {
+	let { entries: a, order: o = "desc", itemSpacing: c = "relaxed", resources: l, onResourceSearch: u, canModerate: m, onCommentDelete: h, onCommentReact: _, onCommentReply: y, onCommentPinToggle: b, strings: x, activityStrings: w, renderers: T, renderEventDetails: E, eventDetailsCollapsible: D = !0, defaultExpandedIds: O, expandedIds: ee, onExpandedIdsChange: te, onEventExpandedChange: k, onEventAction: A, classNames: j, composer: M, bare: N = !1, title: P, getMediaUrl: F, getMediaName: I, getStatusLabel: L, formatRelativeTime: R, className: z } = i, B = t(se, w), V = e(), H = g((e) => {
 		let t = R ?? V.formatRelativeTime;
 		if (t) return t(e);
 		let n = ie(e);
@@ -1307,7 +1321,7 @@ function Re(r) {
 		"data-slot": "activity-log",
 		className: n("activity-log--component", z),
 		"aria-label": ae,
-		children: [!!Z && /* @__PURE__ */ S(i, {
+		children: [!!Z && /* @__PURE__ */ S(r, {
 			weight: "semibold",
 			children: Z
 		}), Y]