@devalok/shilp-sutra 0.57.0 → 0.59.0

package/dist/composed/activity-feed.js

@@ -1,32 +1,33 @@
 "use client";
 import { tweens as e } from "../ui/lib/motion.js";
-import { cn as t } from "../ui/lib/utils.js";
-import { Icon as n } from "../ui/icon.js";
-import { Skeleton as r } from "../ui/skeleton.js";
-import { Avatar as i, AvatarFallback as a, AvatarImage as o } from "../ui/avatar.js";
-import { Button as s } from "../ui/button.js";
-import { formatRelativeTime as c } from "../ui/lib/date-utils.js";
-import { getInitials as l } from "./lib/string-utils.js";
-import * as u from "react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-import { IconChevronRight as p } from "@tabler/icons-react";
-import { motion as m } from "framer-motion";
+import { MotionPreference as t } from "../_chunks/motion-preference.js";
+import { cn as n } from "../ui/lib/utils.js";
+import { Icon as r } from "../ui/icon.js";
+import { Skeleton as i } from "../ui/skeleton.js";
+import { Avatar as a, AvatarFallback as o, AvatarImage as s } from "../ui/avatar.js";
+import { Button as c } from "../ui/button.js";
+import { formatRelativeTime as l } from "../ui/lib/date-utils.js";
+import { getInitials as u } from "./lib/string-utils.js";
+import * as d from "react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { IconChevronRight as m } from "@tabler/icons-react";
+import { motion as h } from "framer-motion";
 //#region src/composed/activity-feed.tsx
-var h = {
+var g = {
 	default: "bg-surface-fg-subtle",
 	success: "bg-success-9",
 	warning: "bg-warning-9",
 	error: "bg-error-9",
 	info: "bg-info-9"
-}, g = {
+}, _ = {
 	today: "Today",
 	yesterday: "Yesterday",
 	thisWeek: "This Week",
 	older: "Older"
 };
-function _(e, t) {
+function v(e, t) {
 	let n = {
-		...g,
+		..._,
 		...t
 	}, r = /* @__PURE__ */ new Date(), i = new Date(r.getFullYear(), r.getMonth(), r.getDate()), a = /* @__PURE__ */ new Date(i.getTime() - 1440 * 60 * 1e3), o = r.getDay(), s = o === 0 ? 6 : o - 1, c = /* @__PURE__ */ new Date(i.getTime() - s * 24 * 60 * 60 * 1e3), l = [], u = [], d = [], f = [];
 	for (let t of e) {
@@ -48,77 +49,77 @@ function _(e, t) {
 		items: f
 	}), p;
 }
-function v({ compact: e }) {
-	return /* @__PURE__ */ d("div", {
-		className: t("flex flex-col", e ? "gap-1" : "gap-3"),
+function y({ compact: e }) {
+	return /* @__PURE__ */ f("div", {
+		className: n("flex flex-col", e ? "gap-1" : "gap-3"),
 		children: [
 			0,
 			1,
 			2
-		].map((n) => /* @__PURE__ */ f("div", {
+		].map((t) => /* @__PURE__ */ p("div", {
 			className: "flex items-center gap-ds-03",
 			children: [
-				/* @__PURE__ */ d(r, { className: "h-2 w-2 shrink-0 rounded-pill" }),
-				!e && /* @__PURE__ */ d(r, { className: "h-4 w-4 shrink-0 rounded-pill" }),
-				/* @__PURE__ */ d(r, { className: t("flex-1", e ? "h-3" : "h-4") }),
-				/* @__PURE__ */ d(r, { className: "h-3 w-12" })
+				/* @__PURE__ */ f(i, { className: "h-2 w-2 shrink-0 rounded-pill" }),
+				!e && /* @__PURE__ */ f(i, { className: "h-4 w-4 shrink-0 rounded-pill" }),
+				/* @__PURE__ */ f(i, { className: n("flex-1", e ? "h-3" : "h-4") }),
+				/* @__PURE__ */ f(i, { className: "h-3 w-12" })
 			]
-		}, n))
+		}, t))
 	});
 }
-function y({ item: e, compact: r }) {
-	let [s, m] = u.useState(!1), g = u.useId(), _ = e.color ?? "default";
-	return /* @__PURE__ */ f("div", {
-		className: t("relative flex items-start", r ? "gap-ds-02" : "gap-ds-03"),
+function b({ item: e, compact: t }) {
+	let [i, c] = d.useState(!1), h = d.useId(), _ = e.color ?? "default";
+	return /* @__PURE__ */ p("div", {
+		className: n("relative flex items-start", t ? "gap-ds-02" : "gap-ds-03"),
 		children: [
-			/* @__PURE__ */ d("div", { className: t("relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-pill ring-2 ring-surface-base", h[_]) }),
-			!r && e.actor && /* @__PURE__ */ f(i, {
+			/* @__PURE__ */ f("div", { className: n("relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-pill ring-2 ring-surface-panel", g[_]) }),
+			!t && e.actor && /* @__PURE__ */ p(a, {
 				className: "h-5 w-5 shrink-0 text-[9px]",
-				children: [e.actor.image && /* @__PURE__ */ d(o, {
+				children: [e.actor.image && /* @__PURE__ */ f(s, {
 					src: e.actor.image,
 					alt: e.actor.name
-				}), /* @__PURE__ */ d(a, {
+				}), /* @__PURE__ */ f(o, {
 					className: "text-[9px]",
-					children: l(e.actor.name)
+					children: u(e.actor.name)
 				})]
 			}),
-			/* @__PURE__ */ f("div", {
+			/* @__PURE__ */ p("div", {
 				className: "flex min-w-0 flex-1 flex-col",
-				children: [/* @__PURE__ */ f("div", {
+				children: [/* @__PURE__ */ p("div", {
 					className: "flex items-center justify-between gap-ds-02",
-					children: [/* @__PURE__ */ f("div", {
-						className: t("min-w-0 flex-1 flex items-center gap-ds-01 flex-wrap", r ? "text-body-xs" : "text-body-sm"),
+					children: [/* @__PURE__ */ p("div", {
+						className: n("min-w-0 flex-1 flex items-center gap-ds-01 flex-wrap", t ? "text-body-xs" : "text-body-sm"),
 						children: [
-							e.actor && /* @__PURE__ */ f("span", {
+							e.actor && /* @__PURE__ */ p("span", {
 								className: "font-medium text-surface-fg",
 								children: [e.actor.name, " "]
 							}),
-							e.detail && /* @__PURE__ */ d(n, {
-								icon: p,
+							e.detail && /* @__PURE__ */ f(r, {
+								icon: m,
 								size: "xs",
-								className: t("shrink-0 text-surface-fg-subtle transition-transform duration-fast-02 ease-productive-standard", s && "rotate-90")
+								className: n("shrink-0 text-surface-fg-subtle transition-transform duration-fast-02 ease-productive-standard", i && "rotate-90")
 							}),
-							e.detail ? /* @__PURE__ */ d("button", {
+							e.detail ? /* @__PURE__ */ f("button", {
 								type: "button",
 								className: "rounded-control text-surface-fg-muted hover:underline hover:bg-surface-panel-hover focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9",
 								onClick: () => {
-									e.detail && m((e) => !e);
+									e.detail && c((e) => !e);
 								},
-								"aria-expanded": s,
-								"aria-controls": g,
+								"aria-expanded": i,
+								"aria-controls": h,
 								children: e.action
-							}) : /* @__PURE__ */ d("span", {
+							}) : /* @__PURE__ */ f("span", {
 								className: "text-surface-fg-muted",
 								children: e.action
 							})
 						]
-					}), /* @__PURE__ */ d("time", {
-						className: t("shrink-0 whitespace-nowrap text-surface-fg-subtle", r ? "text-body-xs" : "text-body-sm"),
+					}), /* @__PURE__ */ f("time", {
+						className: n("shrink-0 whitespace-nowrap text-surface-fg-subtle", t ? "text-body-xs" : "text-body-sm"),
 						dateTime: (typeof e.timestamp == "string" ? new Date(e.timestamp) : e.timestamp).toISOString(),
-						children: c(e.timestamp)
+						children: l(e.timestamp)
 					})]
-				}), s && e.detail && /* @__PURE__ */ d("div", {
-					id: g,
+				}), i && e.detail && /* @__PURE__ */ f("div", {
+					id: h,
 					className: "mt-ds-02 animate-in fade-in slide-in-from-top-1 text-body-sm text-surface-fg-muted",
 					children: e.detail
 				})]
@@ -126,116 +127,116 @@ function y({ item: e, compact: r }) {
 		]
 	});
 }
-function b({ item: e, compact: n, children: r }) {
+function x({ item: e, compact: t, children: r }) {
 	let i = e.color ?? "default";
-	return /* @__PURE__ */ f("div", {
-		className: t("relative flex items-start", n ? "gap-ds-02" : "gap-ds-03"),
-		children: [/* @__PURE__ */ d("div", { className: t("relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-pill ring-2 ring-surface-base", h[i]) }), /* @__PURE__ */ d("div", {
+	return /* @__PURE__ */ p("div", {
+		className: n("relative flex items-start", t ? "gap-ds-02" : "gap-ds-03"),
+		children: [/* @__PURE__ */ f("div", { className: n("relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-pill ring-2 ring-surface-panel", g[i]) }), /* @__PURE__ */ f("div", {
 			className: "min-w-0 flex-1",
 			children: r
 		})]
 	});
 }
-function x({ label: n, isFirst: r }) {
-	return /* @__PURE__ */ f(m.div, {
+function S({ label: r, isFirst: i }) {
+	return /* @__PURE__ */ f(t, { children: /* @__PURE__ */ p(h.div, {
 		initial: !1,
 		animate: { opacity: 1 },
 		transition: e.fade,
-		className: t("flex items-center gap-ds-03", r ? "" : "mt-ds-06", "mb-ds-03"),
+		className: n("flex items-center gap-ds-03", i ? "" : "mt-ds-06", "mb-ds-03"),
 		children: [
-			/* @__PURE__ */ d("hr", { className: "flex-1 border-surface-border" }),
-			/* @__PURE__ */ d("span", {
-				className: "bg-surface-base px-ds-03 text-label-xs font-medium uppercase tracking-wider text-surface-fg-subtle",
-				children: n
+			/* @__PURE__ */ f("hr", { className: "flex-1 border-surface-border" }),
+			/* @__PURE__ */ f("span", {
+				className: "bg-surface-panel px-ds-03 text-label-xs font-medium uppercase tracking-wider text-surface-fg-subtle",
+				children: r
 			}),
-			/* @__PURE__ */ d("hr", { className: "flex-1 border-surface-border" })
+			/* @__PURE__ */ f("hr", { className: "flex-1 border-surface-border" })
 		]
-	});
+	}) });
 }
-var S = u.forwardRef(({ items: n, onLoadMore: r, loading: i = !1, hasMore: a = !1, emptyState: o, compact: c = !1, maxInitialItems: l, groupBy: p = "none", groupLabels: h, renderItem: g, className: S, ...C }, w) => {
-	let [T, E] = u.useState(!1);
-	if (i) return /* @__PURE__ */ d("div", {
-		ref: w,
-		className: t("relative", S),
-		...C,
-		children: /* @__PURE__ */ d(v, { compact: c })
+var C = d.forwardRef(({ items: r, onLoadMore: i, loading: a = !1, hasMore: o = !1, emptyState: s, compact: l = !1, maxInitialItems: u, groupBy: m = "none", groupLabels: g, renderItem: _, className: C, ...w }, T) => {
+	let [E, D] = d.useState(!1);
+	if (a) return /* @__PURE__ */ f("div", {
+		ref: T,
+		className: n("relative", C),
+		...w,
+		children: /* @__PURE__ */ f(y, { compact: l })
 	});
-	if (n.length === 0) return o ? /* @__PURE__ */ d("div", {
-		ref: w,
-		className: S,
-		...C,
-		children: o
+	if (r.length === 0) return s ? /* @__PURE__ */ f("div", {
+		ref: T,
+		className: C,
+		...w,
+		children: s
 	}) : null;
-	let D = l != null && !T && n.length > l, O = D ? n.slice(0, l) : n, k = p === "time", A = (e, t) => {
-		if (g) {
-			let n = g(e, t);
-			if (n !== void 0) return /* @__PURE__ */ d(b, {
+	let O = u != null && !E && r.length > u, k = O ? r.slice(0, u) : r, A = m === "time", j = (e, t) => {
+		if (_) {
+			let n = _(e, t);
+			if (n !== void 0) return /* @__PURE__ */ f(x, {
 				item: e,
-				compact: c,
+				compact: l,
 				children: n
 			});
 		}
-		return /* @__PURE__ */ d(y, {
+		return /* @__PURE__ */ f(b, {
 			item: e,
-			compact: c
+			compact: l
 		});
 	};
-	return /* @__PURE__ */ f("div", {
-		ref: w,
-		className: t("relative", S),
-		...C,
+	return /* @__PURE__ */ f(t, { children: /* @__PURE__ */ p("div", {
+		ref: T,
+		className: n("relative", C),
+		...w,
 		children: [
-			k ? /* @__PURE__ */ d("div", { children: _(O, h).map((n, r) => /* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d(x, {
-				label: n.label,
+			A ? /* @__PURE__ */ f("div", { children: v(k, g).map((t, r) => /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f(S, {
+				label: t.label,
 				isFirst: r === 0
-			}), /* @__PURE__ */ f("div", {
-				className: t("relative flex flex-col", c ? "gap-1" : "gap-3"),
-				children: [/* @__PURE__ */ d("div", { className: "absolute bottom-0 left-[3px] top-0 w-px bg-surface-border" }), n.items.map((t, n) => /* @__PURE__ */ d(m.div, {
+			}), /* @__PURE__ */ p("div", {
+				className: n("relative flex flex-col", l ? "gap-1" : "gap-3"),
+				children: [/* @__PURE__ */ f("div", { className: "absolute bottom-0 left-[3px] top-0 w-px bg-surface-border" }), t.items.map((t, n) => /* @__PURE__ */ f(h.div, {
 					initial: !1,
 					animate: { opacity: 1 },
 					transition: {
 						...e.fade,
 						delay: n * .03
 					},
-					children: A(t, n)
+					children: j(t, n)
 				}, t.id))]
-			})] }, n.label)) }) : /* @__PURE__ */ f("div", {
-				className: t("relative flex flex-col", c ? "gap-1" : "gap-3"),
-				children: [/* @__PURE__ */ d("div", { className: "absolute bottom-0 left-[3px] top-0 w-px bg-surface-border" }), O.map((t, n) => /* @__PURE__ */ d(m.div, {
+			})] }, t.label)) }) : /* @__PURE__ */ p("div", {
+				className: n("relative flex flex-col", l ? "gap-1" : "gap-3"),
+				children: [/* @__PURE__ */ f("div", { className: "absolute bottom-0 left-[3px] top-0 w-px bg-surface-border" }), k.map((t, n) => /* @__PURE__ */ f(h.div, {
 					initial: !1,
 					animate: { opacity: 1 },
 					transition: {
 						...e.fade,
 						delay: n * .03
 					},
-					children: A(t, n)
+					children: j(t, n)
 				}, t.id))]
 			}),
-			D && /* @__PURE__ */ d("div", {
+			O && /* @__PURE__ */ f("div", {
 				className: "relative mt-ds-03 flex justify-center",
-				children: /* @__PURE__ */ f(s, {
+				children: /* @__PURE__ */ p(c, {
 					variant: "ghost",
 					size: "sm",
-					onClick: () => E(!0),
+					onClick: () => D(!0),
 					children: [
 						"Show all (",
-						n.length,
+						r.length,
 						")"
 					]
 				})
 			}),
-			a && r && !D && /* @__PURE__ */ d("div", {
+			o && i && !O && /* @__PURE__ */ f("div", {
 				className: "relative mt-ds-03 flex justify-center",
-				children: /* @__PURE__ */ d(s, {
+				children: /* @__PURE__ */ f(c, {
 					variant: "ghost",
 					size: "sm",
-					onClick: r,
+					onClick: i,
 					children: "Load more"
 				})
 			})
 		]
-	});
+	}) });
 });
-S.displayName = "ActivityFeed";
+C.displayName = "ActivityFeed";
 //#endregion
-export { S as ActivityFeed, _ as groupItemsByTime };
+export { C as ActivityFeed, v as groupItemsByTime };

package/dist/composed/activity-feed.js.map

@@ -1 +1 @@
-{"version":3,"file":"activity-feed.js","names":[],"sources":["../../src/composed/activity-feed.tsx"],"sourcesContent":["'use client'\n\nimport { IconChevronRight } from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Avatar, AvatarFallback, AvatarImage } from '../ui/avatar'\nimport { Button } from '../ui/button'\nimport { Icon } from '../ui/icon'\nimport { formatRelativeTime } from '../ui/lib/date-utils'\nimport type { IconInput } from '../ui/lib/icon-input'\nimport { tweens } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\nimport { Skeleton } from '../ui/skeleton'\nimport { getInitials } from './lib/string-utils'\n\nexport interface ActivityItem {\n  id: string\n  actor?: { name: string; image?: string }\n  action: string | React.ReactNode\n  timestamp: Date | string\n  icon?: IconInput\n  color?: 'default' | 'success' | 'warning' | 'error' | 'info'\n  detail?: React.ReactNode\n}\n\nexport interface GroupLabels {\n  today?: string\n  yesterday?: string\n  thisWeek?: string\n  older?: string\n}\n\nexport interface ActivityFeedProps extends React.HTMLAttributes<HTMLDivElement> {\n  items: ActivityItem[]\n  onLoadMore?: () => void\n  loading?: boolean\n  hasMore?: boolean\n  emptyState?: React.ReactNode\n  compact?: boolean\n  maxInitialItems?: number\n  groupBy?: 'time' | 'none'\n  groupLabels?: GroupLabels\n  /** Custom renderer per item. Return ReactNode for custom rendering, undefined to use default ActivityEntry. */\n  renderItem?: (item: ActivityItem, index: number) => React.ReactNode | undefined\n}\n\nconst dotColorMap = {\n  default: 'bg-surface-fg-subtle',\n  success: 'bg-success-9',\n  warning: 'bg-warning-9',\n  error: 'bg-error-9',\n  info: 'bg-info-9',\n} as const\n\nconst DEFAULT_GROUP_LABELS: Required<GroupLabels> = {\n  today: 'Today',\n  yesterday: 'Yesterday',\n  thisWeek: 'This Week',\n  older: 'Older',\n}\n\n/**\n * Buckets items into time-based groups: today, yesterday, earlier this week (since Monday), older.\n * Skips empty groups.\n */\nexport function groupItemsByTime(\n  items: ActivityItem[],\n  labels?: GroupLabels,\n): { label: string; items: ActivityItem[] }[] {\n  const l = { ...DEFAULT_GROUP_LABELS, ...labels }\n  const now = new Date()\n\n  // Start of today (midnight local)\n  const startOfToday = new Date(now.getFullYear(), now.getMonth(), now.getDate())\n  // Start of yesterday\n  const startOfYesterday = new Date(startOfToday.getTime() - 24 * 60 * 60 * 1000)\n  // Start of this week (Monday)\n  const dayOfWeek = now.getDay() // 0=Sun, 1=Mon, ...\n  const daysSinceMonday = dayOfWeek === 0 ? 6 : dayOfWeek - 1\n  const startOfWeek = new Date(\n    startOfToday.getTime() - daysSinceMonday * 24 * 60 * 60 * 1000,\n  )\n\n  const today: ActivityItem[] = []\n  const yesterday: ActivityItem[] = []\n  const thisWeek: ActivityItem[] = []\n  const older: ActivityItem[] = []\n\n  for (const item of items) {\n    const ts =\n      typeof item.timestamp === 'string'\n        ? new Date(item.timestamp)\n        : item.timestamp\n    const t = ts.getTime()\n\n    if (t >= startOfToday.getTime()) {\n      today.push(item)\n    } else if (t >= startOfYesterday.getTime()) {\n      yesterday.push(item)\n    } else if (t >= startOfWeek.getTime()) {\n      thisWeek.push(item)\n    } else {\n      older.push(item)\n    }\n  }\n\n  const groups: { label: string; items: ActivityItem[] }[] = []\n  if (today.length > 0) groups.push({ label: l.today, items: today })\n  if (yesterday.length > 0) groups.push({ label: l.yesterday, items: yesterday })\n  if (thisWeek.length > 0) groups.push({ label: l.thisWeek, items: thisWeek })\n  if (older.length > 0) groups.push({ label: l.older, items: older })\n\n  return groups\n}\n\nfunction LoadingSkeleton({ compact }: { compact: boolean }) {\n  return (\n    <div className={cn('flex flex-col', compact ? 'gap-1' : 'gap-3')}>\n      {[0, 1, 2].map((i) => (\n        <div key={i} className=\"flex items-center gap-ds-03\">\n          <Skeleton className=\"h-2 w-2 shrink-0 rounded-pill\" />\n          {!compact && <Skeleton className=\"h-4 w-4 shrink-0 rounded-pill\" />}\n          <Skeleton className={cn('flex-1', compact ? 'h-3' : 'h-4')} />\n          <Skeleton className=\"h-3 w-12\" />\n        </div>\n      ))}\n    </div>\n  )\n}\n\nfunction ActivityEntry({\n  item,\n  compact,\n}: {\n  item: ActivityItem\n  compact: boolean\n}) {\n  const [expandedDetail, setExpandedDetail] = React.useState(false)\n  const detailId = React.useId()\n  const color = item.color ?? 'default'\n\n  const handleActionClick = () => {\n    if (item.detail) {\n      setExpandedDetail((prev) => !prev)\n    }\n  }\n\n  return (\n    <div className={cn('relative flex items-start', compact ? 'gap-ds-02' : 'gap-ds-03')}>\n      {/* Dot */}\n      <div\n        className={cn(\n          'relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-pill ring-2 ring-surface-base',\n          dotColorMap[color],\n        )}\n      />\n\n      {/* Avatar (non-compact only) */}\n      {!compact && item.actor && (\n        <Avatar className=\"h-5 w-5 shrink-0 text-[9px]\">\n          {item.actor.image && (\n            <AvatarImage src={item.actor.image} alt={item.actor.name} />\n          )}\n          <AvatarFallback className=\"text-[9px]\">\n            {getInitials(item.actor.name)}\n          </AvatarFallback>\n        </Avatar>\n      )}\n\n      {/* Content */}\n      <div className=\"flex min-w-0 flex-1 flex-col\">\n        <div className=\"flex items-center justify-between gap-ds-02\">\n          <div className={cn('min-w-0 flex-1 flex items-center gap-ds-01 flex-wrap', compact ? 'text-body-xs' : 'text-body-sm')}>\n            {item.actor && (\n              <span className=\"font-medium text-surface-fg\">{item.actor.name} </span>\n            )}\n            {item.detail && (\n              <Icon icon={IconChevronRight} size=\"xs\" className={cn('shrink-0 text-surface-fg-subtle transition-transform duration-fast-02 ease-productive-standard', expandedDetail && 'rotate-90')} />\n            )}\n            {item.detail ? (\n              <button\n                type=\"button\"\n                className=\"rounded-control text-surface-fg-muted hover:underline hover:bg-surface-panel-hover focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9\"\n                onClick={handleActionClick}\n                aria-expanded={expandedDetail}\n                aria-controls={detailId}\n              >\n                {item.action}\n              </button>\n            ) : (\n              <span className=\"text-surface-fg-muted\">{item.action}</span>\n            )}\n          </div>\n\n          <time\n            className={cn(\n              'shrink-0 whitespace-nowrap text-surface-fg-subtle',\n              compact ? 'text-body-xs' : 'text-body-sm',\n            )}\n            dateTime={\n              (typeof item.timestamp === 'string'\n                ? new Date(item.timestamp)\n                : item.timestamp\n              ).toISOString()\n            }\n          >\n            {formatRelativeTime(item.timestamp)}\n          </time>\n        </div>\n\n        {/* Expandable detail */}\n        {expandedDetail && item.detail && (\n          <div id={detailId} className=\"mt-ds-02 animate-in fade-in slide-in-from-top-1 text-body-sm text-surface-fg-muted\">\n            {item.detail}\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n\n/**\n * Wraps custom renderItem content with the same dot + layout container\n * that ActivityEntry uses, keeping vertical rhythm consistent.\n */\nfunction CustomEntry({\n  item,\n  compact,\n  children,\n}: {\n  item: ActivityItem\n  compact: boolean\n  children: React.ReactNode\n}) {\n  const color = item.color ?? 'default'\n  return (\n    <div className={cn('relative flex items-start', compact ? 'gap-ds-02' : 'gap-ds-03')}>\n      {/* Dot — same as ActivityEntry */}\n      <div\n        className={cn(\n          'relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-pill ring-2 ring-surface-base',\n          dotColorMap[color],\n        )}\n      />\n      {/* Custom content in the same flex slot as ActivityEntry's content area */}\n      <div className=\"min-w-0 flex-1\">{children}</div>\n    </div>\n  )\n}\n\nfunction GroupHeader({\n  label,\n  isFirst,\n}: {\n  label: string\n  isFirst: boolean\n}) {\n  return (\n    <motion.div\n      initial={false}\n      animate={{ opacity: 1 }}\n      transition={tweens.fade}\n      className={cn(\n        'flex items-center gap-ds-03',\n        !isFirst ? 'mt-ds-06' : '',\n        'mb-ds-03',\n      )}\n    >\n      <hr className=\"flex-1 border-surface-border\" />\n      <span className=\"bg-surface-base px-ds-03 text-label-xs font-medium uppercase tracking-wider text-surface-fg-subtle\">\n        {label}\n      </span>\n      <hr className=\"flex-1 border-surface-border\" />\n    </motion.div>\n  )\n}\n\nconst ActivityFeed = React.forwardRef<HTMLDivElement, ActivityFeedProps>(\n  (\n    {\n      items,\n      onLoadMore,\n      loading = false,\n      hasMore = false,\n      emptyState,\n      compact = false,\n      maxInitialItems,\n      groupBy = 'none',\n      groupLabels,\n      renderItem,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const [showAll, setShowAll] = React.useState(false)\n\n    if (loading) {\n      return (\n        <div ref={ref} className={cn('relative', className)} {...props}>\n          <LoadingSkeleton compact={compact} />\n        </div>\n      )\n    }\n\n    if (items.length === 0) {\n      if (emptyState) {\n        return (\n          <div ref={ref} className={className} {...props}>\n            {emptyState}\n          </div>\n        )\n      }\n      return null\n    }\n\n    // maxInitialItems applies to the flat list BEFORE grouping\n    const truncated =\n      maxInitialItems != null && !showAll && items.length > maxInitialItems\n    const visibleItems = truncated ? items.slice(0, maxInitialItems) : items\n\n    const useGrouping = groupBy === 'time'\n\n    /** Resolve what to render for a single item, respecting renderItem. */\n    const resolveEntry = (item: ActivityItem, index: number) => {\n      if (renderItem) {\n        const custom = renderItem(item, index)\n        if (custom !== undefined) {\n          return <CustomEntry item={item} compact={compact}>{custom}</CustomEntry>\n        }\n      }\n      return <ActivityEntry item={item} compact={compact} />\n    }\n\n    return (\n      <div ref={ref} className={cn('relative', className)} {...props}>\n        {/* Items */}\n        {useGrouping ? (\n          <div>\n            {groupItemsByTime(visibleItems, groupLabels).map((group, gi) => (\n              <div key={group.label}>\n                <GroupHeader label={group.label} isFirst={gi === 0} />\n                {/* Timeline line scoped to this group */}\n                <div className={cn('relative flex flex-col', compact ? 'gap-1' : 'gap-3')}>\n                  <div className=\"absolute bottom-0 left-[3px] top-0 w-px bg-surface-border\" />\n                  {group.items.map((item, index) => (\n                    <motion.div key={item.id} initial={false} animate={{ opacity: 1 }} transition={{ ...tweens.fade, delay: index * 0.03 }}>\n                      {resolveEntry(item, index)}\n                    </motion.div>\n                  ))}\n                </div>\n              </div>\n            ))}\n          </div>\n        ) : (\n          <div className={cn('relative flex flex-col', compact ? 'gap-1' : 'gap-3')}>\n            {/* Timeline line */}\n            <div className=\"absolute bottom-0 left-[3px] top-0 w-px bg-surface-border\" />\n            {visibleItems.map((item, index) => (\n              <motion.div key={item.id} initial={false} animate={{ opacity: 1 }} transition={{ ...tweens.fade, delay: index * 0.03 }}>\n                {resolveEntry(item, index)}\n              </motion.div>\n            ))}\n          </div>\n        )}\n\n        {/* Show all button */}\n        {truncated && (\n          <div className=\"relative mt-ds-03 flex justify-center\">\n            <Button\n              variant=\"ghost\"\n              size=\"sm\"\n              onClick={() => setShowAll(true)}\n            >\n              Show all ({items.length})\n            </Button>\n          </div>\n        )}\n\n        {/* Load more button */}\n        {hasMore && onLoadMore && !truncated && (\n          <div className=\"relative mt-ds-03 flex justify-center\">\n            <Button variant=\"ghost\" size=\"sm\" onClick={onLoadMore}>\n              Load more\n            </Button>\n          </div>\n        )}\n      </div>\n    )\n  },\n)\nActivityFeed.displayName = 'ActivityFeed'\n\nexport { ActivityFeed }\n"],"mappings":"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"}
+{"version":3,"file":"activity-feed.js","names":[],"sources":["../../src/composed/activity-feed.tsx"],"sourcesContent":["'use client'\n\nimport { IconChevronRight } from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { MotionPreference } from '../motion/motion-preference'\nimport { Avatar, AvatarFallback, AvatarImage } from '../ui/avatar'\nimport { Button } from '../ui/button'\nimport { Icon } from '../ui/icon'\nimport { formatRelativeTime } from '../ui/lib/date-utils'\nimport type { IconInput } from '../ui/lib/icon-input'\nimport { tweens } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\nimport { Skeleton } from '../ui/skeleton'\nimport { getInitials } from './lib/string-utils'\n\nexport interface ActivityItem {\n  id: string\n  actor?: { name: string; image?: string }\n  action: string | React.ReactNode\n  timestamp: Date | string\n  icon?: IconInput\n  color?: 'default' | 'success' | 'warning' | 'error' | 'info'\n  detail?: React.ReactNode\n}\n\nexport interface GroupLabels {\n  today?: string\n  yesterday?: string\n  thisWeek?: string\n  older?: string\n}\n\nexport interface ActivityFeedProps extends React.HTMLAttributes<HTMLDivElement> {\n  items: ActivityItem[]\n  onLoadMore?: () => void\n  loading?: boolean\n  hasMore?: boolean\n  emptyState?: React.ReactNode\n  compact?: boolean\n  maxInitialItems?: number\n  groupBy?: 'time' | 'none'\n  groupLabels?: GroupLabels\n  /** Custom renderer per item. Return ReactNode for custom rendering, undefined to use default ActivityEntry. */\n  renderItem?: (item: ActivityItem, index: number) => React.ReactNode | undefined\n}\n\nconst dotColorMap = {\n  default: 'bg-surface-fg-subtle',\n  success: 'bg-success-9',\n  warning: 'bg-warning-9',\n  error: 'bg-error-9',\n  info: 'bg-info-9',\n} as const\n\nconst DEFAULT_GROUP_LABELS: Required<GroupLabels> = {\n  today: 'Today',\n  yesterday: 'Yesterday',\n  thisWeek: 'This Week',\n  older: 'Older',\n}\n\n/**\n * Buckets items into time-based groups: today, yesterday, earlier this week (since Monday), older.\n * Skips empty groups.\n */\nexport function groupItemsByTime(\n  items: ActivityItem[],\n  labels?: GroupLabels,\n): { label: string; items: ActivityItem[] }[] {\n  const l = { ...DEFAULT_GROUP_LABELS, ...labels }\n  const now = new Date()\n\n  // Start of today (midnight local)\n  const startOfToday = new Date(now.getFullYear(), now.getMonth(), now.getDate())\n  // Start of yesterday\n  const startOfYesterday = new Date(startOfToday.getTime() - 24 * 60 * 60 * 1000)\n  // Start of this week (Monday)\n  const dayOfWeek = now.getDay() // 0=Sun, 1=Mon, ...\n  const daysSinceMonday = dayOfWeek === 0 ? 6 : dayOfWeek - 1\n  const startOfWeek = new Date(\n    startOfToday.getTime() - daysSinceMonday * 24 * 60 * 60 * 1000,\n  )\n\n  const today: ActivityItem[] = []\n  const yesterday: ActivityItem[] = []\n  const thisWeek: ActivityItem[] = []\n  const older: ActivityItem[] = []\n\n  for (const item of items) {\n    const ts =\n      typeof item.timestamp === 'string'\n        ? new Date(item.timestamp)\n        : item.timestamp\n    const t = ts.getTime()\n\n    if (t >= startOfToday.getTime()) {\n      today.push(item)\n    } else if (t >= startOfYesterday.getTime()) {\n      yesterday.push(item)\n    } else if (t >= startOfWeek.getTime()) {\n      thisWeek.push(item)\n    } else {\n      older.push(item)\n    }\n  }\n\n  const groups: { label: string; items: ActivityItem[] }[] = []\n  if (today.length > 0) groups.push({ label: l.today, items: today })\n  if (yesterday.length > 0) groups.push({ label: l.yesterday, items: yesterday })\n  if (thisWeek.length > 0) groups.push({ label: l.thisWeek, items: thisWeek })\n  if (older.length > 0) groups.push({ label: l.older, items: older })\n\n  return groups\n}\n\nfunction LoadingSkeleton({ compact }: { compact: boolean }) {\n  return (\n    <div className={cn('flex flex-col', compact ? 'gap-1' : 'gap-3')}>\n      {[0, 1, 2].map((i) => (\n        <div key={i} className=\"flex items-center gap-ds-03\">\n          <Skeleton className=\"h-2 w-2 shrink-0 rounded-pill\" />\n          {!compact && <Skeleton className=\"h-4 w-4 shrink-0 rounded-pill\" />}\n          <Skeleton className={cn('flex-1', compact ? 'h-3' : 'h-4')} />\n          <Skeleton className=\"h-3 w-12\" />\n        </div>\n      ))}\n    </div>\n  )\n}\n\nfunction ActivityEntry({\n  item,\n  compact,\n}: {\n  item: ActivityItem\n  compact: boolean\n}) {\n  const [expandedDetail, setExpandedDetail] = React.useState(false)\n  const detailId = React.useId()\n  const color = item.color ?? 'default'\n\n  const handleActionClick = () => {\n    if (item.detail) {\n      setExpandedDetail((prev) => !prev)\n    }\n  }\n\n  return (\n    <div className={cn('relative flex items-start', compact ? 'gap-ds-02' : 'gap-ds-03')}>\n      {/* Dot */}\n      <div\n        className={cn(\n          'relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-pill ring-2 ring-surface-panel',\n          dotColorMap[color],\n        )}\n      />\n\n      {/* Avatar (non-compact only) */}\n      {!compact && item.actor && (\n        <Avatar className=\"h-5 w-5 shrink-0 text-[9px]\">\n          {item.actor.image && (\n            <AvatarImage src={item.actor.image} alt={item.actor.name} />\n          )}\n          <AvatarFallback className=\"text-[9px]\">\n            {getInitials(item.actor.name)}\n          </AvatarFallback>\n        </Avatar>\n      )}\n\n      {/* Content */}\n      <div className=\"flex min-w-0 flex-1 flex-col\">\n        <div className=\"flex items-center justify-between gap-ds-02\">\n          <div className={cn('min-w-0 flex-1 flex items-center gap-ds-01 flex-wrap', compact ? 'text-body-xs' : 'text-body-sm')}>\n            {item.actor && (\n              <span className=\"font-medium text-surface-fg\">{item.actor.name} </span>\n            )}\n            {item.detail && (\n              <Icon icon={IconChevronRight} size=\"xs\" className={cn('shrink-0 text-surface-fg-subtle transition-transform duration-fast-02 ease-productive-standard', expandedDetail && 'rotate-90')} />\n            )}\n            {item.detail ? (\n              <button\n                type=\"button\"\n                className=\"rounded-control text-surface-fg-muted hover:underline hover:bg-surface-panel-hover focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9\"\n                onClick={handleActionClick}\n                aria-expanded={expandedDetail}\n                aria-controls={detailId}\n              >\n                {item.action}\n              </button>\n            ) : (\n              <span className=\"text-surface-fg-muted\">{item.action}</span>\n            )}\n          </div>\n\n          <time\n            className={cn(\n              'shrink-0 whitespace-nowrap text-surface-fg-subtle',\n              compact ? 'text-body-xs' : 'text-body-sm',\n            )}\n            dateTime={\n              (typeof item.timestamp === 'string'\n                ? new Date(item.timestamp)\n                : item.timestamp\n              ).toISOString()\n            }\n          >\n            {formatRelativeTime(item.timestamp)}\n          </time>\n        </div>\n\n        {/* Expandable detail */}\n        {expandedDetail && item.detail && (\n          <div id={detailId} className=\"mt-ds-02 animate-in fade-in slide-in-from-top-1 text-body-sm text-surface-fg-muted\">\n            {item.detail}\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n\n/**\n * Wraps custom renderItem content with the same dot + layout container\n * that ActivityEntry uses, keeping vertical rhythm consistent.\n */\nfunction CustomEntry({\n  item,\n  compact,\n  children,\n}: {\n  item: ActivityItem\n  compact: boolean\n  children: React.ReactNode\n}) {\n  const color = item.color ?? 'default'\n  return (\n    <div className={cn('relative flex items-start', compact ? 'gap-ds-02' : 'gap-ds-03')}>\n      {/* Dot — same as ActivityEntry */}\n      <div\n        className={cn(\n          'relative z-10 mt-1.5 h-2 w-2 shrink-0 rounded-pill ring-2 ring-surface-panel',\n          dotColorMap[color],\n        )}\n      />\n      {/* Custom content in the same flex slot as ActivityEntry's content area */}\n      <div className=\"min-w-0 flex-1\">{children}</div>\n    </div>\n  )\n}\n\nfunction GroupHeader({\n  label,\n  isFirst,\n}: {\n  label: string\n  isFirst: boolean\n}) {\n  return (\n    <MotionPreference>\n      <motion.div\n        initial={false}\n        animate={{ opacity: 1 }}\n        transition={tweens.fade}\n        className={cn(\n          'flex items-center gap-ds-03',\n          !isFirst ? 'mt-ds-06' : '',\n          'mb-ds-03',\n        )}\n      >\n        <hr className=\"flex-1 border-surface-border\" />\n        <span className=\"bg-surface-panel px-ds-03 text-label-xs font-medium uppercase tracking-wider text-surface-fg-subtle\">\n          {label}\n        </span>\n        <hr className=\"flex-1 border-surface-border\" />\n      </motion.div>\n    </MotionPreference>\n  )\n}\n\nconst ActivityFeed = React.forwardRef<HTMLDivElement, ActivityFeedProps>(\n  (\n    {\n      items,\n      onLoadMore,\n      loading = false,\n      hasMore = false,\n      emptyState,\n      compact = false,\n      maxInitialItems,\n      groupBy = 'none',\n      groupLabels,\n      renderItem,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const [showAll, setShowAll] = React.useState(false)\n\n    if (loading) {\n      return (\n        <div ref={ref} className={cn('relative', className)} {...props}>\n          <LoadingSkeleton compact={compact} />\n        </div>\n      )\n    }\n\n    if (items.length === 0) {\n      if (emptyState) {\n        return (\n          <div ref={ref} className={className} {...props}>\n            {emptyState}\n          </div>\n        )\n      }\n      return null\n    }\n\n    // maxInitialItems applies to the flat list BEFORE grouping\n    const truncated =\n      maxInitialItems != null && !showAll && items.length > maxInitialItems\n    const visibleItems = truncated ? items.slice(0, maxInitialItems) : items\n\n    const useGrouping = groupBy === 'time'\n\n    /** Resolve what to render for a single item, respecting renderItem. */\n    const resolveEntry = (item: ActivityItem, index: number) => {\n      if (renderItem) {\n        const custom = renderItem(item, index)\n        if (custom !== undefined) {\n          return <CustomEntry item={item} compact={compact}>{custom}</CustomEntry>\n        }\n      }\n      return <ActivityEntry item={item} compact={compact} />\n    }\n\n    return (\n      <MotionPreference>\n        <div ref={ref} className={cn('relative', className)} {...props}>\n          {/* Items */}\n          {useGrouping ? (\n            <div>\n              {groupItemsByTime(visibleItems, groupLabels).map((group, gi) => (\n                <div key={group.label}>\n                  <GroupHeader label={group.label} isFirst={gi === 0} />\n                  {/* Timeline line scoped to this group */}\n                  <div className={cn('relative flex flex-col', compact ? 'gap-1' : 'gap-3')}>\n                    <div className=\"absolute bottom-0 left-[3px] top-0 w-px bg-surface-border\" />\n                    {group.items.map((item, index) => (\n                      <motion.div key={item.id} initial={false} animate={{ opacity: 1 }} transition={{ ...tweens.fade, delay: index * 0.03 }}>\n                        {resolveEntry(item, index)}\n                      </motion.div>\n                    ))}\n                  </div>\n                </div>\n              ))}\n            </div>\n          ) : (\n            <div className={cn('relative flex flex-col', compact ? 'gap-1' : 'gap-3')}>\n              {/* Timeline line */}\n              <div className=\"absolute bottom-0 left-[3px] top-0 w-px bg-surface-border\" />\n              {visibleItems.map((item, index) => (\n                <motion.div key={item.id} initial={false} animate={{ opacity: 1 }} transition={{ ...tweens.fade, delay: index * 0.03 }}>\n                  {resolveEntry(item, index)}\n                </motion.div>\n              ))}\n            </div>\n          )}\n\n          {/* Show all button */}\n          {truncated && (\n            <div className=\"relative mt-ds-03 flex justify-center\">\n              <Button\n                variant=\"ghost\"\n                size=\"sm\"\n                onClick={() => setShowAll(true)}\n              >\n                Show all ({items.length})\n              </Button>\n            </div>\n          )}\n\n          {/* Load more button */}\n          {hasMore && onLoadMore && !truncated && (\n            <div className=\"relative mt-ds-03 flex justify-center\">\n              <Button variant=\"ghost\" size=\"sm\" onClick={onLoadMore}>\n                Load more\n              </Button>\n            </div>\n          )}\n        </div>\n      </MotionPreference>\n    )\n  },\n)\nActivityFeed.displayName = 'ActivityFeed'\n\nexport { ActivityFeed }\n"],"mappings":"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"}