@handled-ai/design-system 0.18.1 → 0.18.3

package/dist/components/timeline-activity.js

@@ -5,6 +5,42 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../lib/utils.js";
 import { ChevronDown, ChevronUp, ExternalLink } from "lucide-react";
+const TONE_CLASSES = {
+  red: {
+    dot: "bg-red-50 border-red-200 dark:bg-red-950/30 dark:border-red-900/40",
+    icon: "text-red-600 dark:text-red-300"
+  },
+  amber: {
+    dot: "bg-amber-50 border-amber-200 dark:bg-amber-950/30 dark:border-amber-900/40",
+    icon: "text-amber-600 dark:text-amber-300"
+  },
+  emerald: {
+    dot: "bg-emerald-50 border-emerald-200 dark:bg-emerald-950/30 dark:border-emerald-900/40",
+    icon: "text-emerald-600 dark:text-emerald-300"
+  },
+  violet: {
+    dot: "bg-violet-50 border-violet-200 dark:bg-violet-950/30 dark:border-violet-900/40",
+    icon: "text-violet-600 dark:text-violet-300"
+  },
+  blue: {
+    dot: "bg-blue-50 border-blue-200 dark:bg-blue-950/30 dark:border-blue-900/40",
+    icon: "text-blue-600 dark:text-blue-300"
+  },
+  slate: {
+    dot: "bg-slate-100 border-slate-200 dark:bg-slate-800/50 dark:border-slate-700",
+    icon: "text-slate-500 dark:text-slate-300"
+  },
+  salesforce: {
+    dot: "bg-white border-[#00A1E0]/25 dark:bg-background dark:border-[#00A1E0]/25",
+    icon: "text-[#00A1E0]"
+  },
+  gmail: {
+    dot: "bg-white border-red-200 dark:bg-background dark:border-red-900/40",
+    icon: "text-red-500 dark:text-red-300"
+  }
+};
+const NEUTRAL_DOT_CLASSES = "border-border/60 bg-background";
+const NEUTRAL_ICON_CLASSES = "text-muted-foreground";
 function TimelineActivity({ events, className }) {
   return /* @__PURE__ */ jsx("div", { className: cn("space-y-0", className), children: events.map((event, index) => /* @__PURE__ */ jsx(
     TimelineItem,
@@ -15,20 +51,51 @@ function TimelineActivity({ events, className }) {
     event.id
   )) });
 }
+function ActorByline({ actor, time }) {
+  var _a, _b, _c;
+  if (actor.kind === "system") return null;
+  if (actor.kind === "integration") {
+    return /* @__PURE__ */ jsxs("div", { className: "mt-1 flex items-center gap-1.5 text-xs text-muted-foreground", "data-testid": "actor-byline", children: [
+      /* @__PURE__ */ jsx("span", { children: "Integration" }),
+      /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/40", children: "\xB7" }),
+      /* @__PURE__ */ jsx("span", { children: time })
+    ] });
+  }
+  const verb = (_a = actor.verb) != null ? _a : "performed this action";
+  const displayInitials = (_b = actor.initials) != null ? _b : actor.name ? actor.name.charAt(0).toUpperCase() : "?";
+  return /* @__PURE__ */ jsxs("div", { className: "mt-1 flex items-center gap-1.5 text-xs text-muted-foreground", "data-testid": "actor-byline", children: [
+    actor.avatarUrl ? /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: actor.avatarUrl,
+        alt: (_c = actor.name) != null ? _c : "User",
+        className: "h-4 w-4 rounded-full object-cover"
+      }
+    ) : /* @__PURE__ */ jsx("span", { className: "flex h-4 w-4 items-center justify-center rounded-full bg-muted-foreground/10 text-[8px] font-semibold text-muted-foreground", children: displayInitials }),
+    /* @__PURE__ */ jsx("span", { className: "text-foreground font-medium", children: actor.name }),
+    /* @__PURE__ */ jsx("span", { children: verb }),
+    /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/40", children: "\xB7" }),
+    /* @__PURE__ */ jsx("span", { children: time })
+  ] });
+}
 function TimelineItem({ event, isLast }) {
   var _a, _b, _c, _d;
   const [expanded, setExpanded] = React.useState((_a = event.defaultExpanded) != null ? _a : false);
   const [showAllRecipients, setShowAllRecipients] = React.useState(false);
   const hasContent = !!event.content;
   const hasEmail = !!event.email;
+  const toneStyle = event.tone ? TONE_CLASSES[event.tone] : null;
+  const dotClasses = toneStyle ? toneStyle.dot : NEUTRAL_DOT_CLASSES;
+  const iconClasses = toneStyle ? toneStyle.icon : NEUTRAL_ICON_CLASSES;
   return /* @__PURE__ */ jsxs("div", { className: "group relative flex gap-3.5", children: [
     !isLast && /* @__PURE__ */ jsx("div", { className: "absolute left-[9px] top-5 bottom-[-6px] w-px bg-border/60" }),
-    /* @__PURE__ */ jsx("div", { className: "relative z-10 mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-background", children: /* @__PURE__ */ jsx("div", { className: "flex h-4.5 w-4.5 items-center justify-center rounded-full border border-border/60 bg-background text-muted-foreground ring-4 ring-background", children: event.icon }) }),
+    /* @__PURE__ */ jsx("div", { className: "relative z-10 mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-background", children: /* @__PURE__ */ jsx("div", { className: cn("flex h-4.5 w-4.5 items-center justify-center rounded-full border ring-4 ring-background", dotClasses, iconClasses), "data-testid": "timeline-dot", children: event.icon }) }),
     /* @__PURE__ */ jsxs("div", { className: "flex-1 pb-5 pt-0.5", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-1 sm:flex-row sm:items-start sm:justify-between", children: [
         /* @__PURE__ */ jsx("div", { className: "pr-4 text-[13px] leading-relaxed text-foreground", children: event.title }),
         /* @__PURE__ */ jsx("span", { className: "mt-0.5 shrink-0 whitespace-nowrap text-[11px] text-muted-foreground/70", children: event.time })
       ] }),
+      event.actor && /* @__PURE__ */ jsx(ActorByline, { actor: event.actor, time: event.time }),
       (hasContent || hasEmail) && /* @__PURE__ */ jsx("div", { className: "mt-2", children: event.isInteractive ? hasEmail ? /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-md border border-border/80 bg-muted/20", children: /* @__PURE__ */ jsx(
         "div",
         {
@@ -176,6 +243,7 @@ function TimelineItem({ event, isLast }) {
   ] });
 }
 export {
+  TONE_CLASSES,
   TimelineActivity
 };
 //# sourceMappingURL=timeline-activity.js.map

package/dist/components/timeline-activity.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/timeline-activity.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"../lib/utils\"\nimport { ChevronDown, ChevronUp, ExternalLink } from \"lucide-react\"\n\nexport interface TimelineEvent {\n  id: string\n  icon: React.ReactNode\n  title: React.ReactNode\n  time: string\n  preview?: React.ReactNode\n  email?: {\n    from: string\n    fromEmail?: string\n    to: string\n    cc?: string\n    bcc?: string\n    date?: string\n    subject?: string\n    body: React.ReactNode\n  }\n  content?: React.ReactNode\n  source?: {\n    label: string\n    url: string\n  }\n  defaultExpanded?: boolean\n  isInteractive?: boolean\n  onSourceClick?: () => void\n}\n\nexport interface TimelineActivityProps {\n  events: TimelineEvent[]\n  className?: string\n}\n\nexport function TimelineActivity({ events, className }: TimelineActivityProps) {\n  return (\n    <div className={cn(\"space-y-0\", className)}>\n      {events.map((event, index) => (\n        <TimelineItem\n          key={event.id}\n          event={event}\n          isLast={index === events.length - 1}\n        />\n      ))}\n    </div>\n  )\n}\n\nfunction TimelineItem({ event, isLast }: { event: TimelineEvent; isLast: boolean }) {\n  const [expanded, setExpanded] = React.useState(event.defaultExpanded ?? false)\n  const [showAllRecipients, setShowAllRecipients] = React.useState(false)\n  const hasContent = !!event.content\n  const hasEmail = !!event.email\n\n  return (\n    <div className=\"group relative flex gap-3.5\">\n      {!isLast && (\n        <div className=\"absolute left-[9px] top-5 bottom-[-6px] w-px bg-border/60\" />\n      )}\n\n      <div className=\"relative z-10 mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-background\">\n        <div className=\"flex h-4.5 w-4.5 items-center justify-center rounded-full border border-border/60 bg-background text-muted-foreground ring-4 ring-background\">\n          {event.icon}\n        </div>\n      </div>\n\n      <div className=\"flex-1 pb-5 pt-0.5\">\n        <div className=\"flex min-w-0 flex-col gap-1 sm:flex-row sm:items-start sm:justify-between\">\n          <div className=\"pr-4 text-[13px] leading-relaxed text-foreground\">\n            {event.title}\n          </div>\n          <span className=\"mt-0.5 shrink-0 whitespace-nowrap text-[11px] text-muted-foreground/70\">\n            {event.time}\n          </span>\n        </div>\n\n        {(hasContent || hasEmail) && (\n          <div className=\"mt-2\">\n            {event.isInteractive ? (\n              hasEmail ? (\n                <div className=\"overflow-hidden rounded-md border border-border/80 bg-muted/20\">\n                  <div\n                    className={cn(\n                      \"px-3 py-2.5 text-sm\",\n                      !expanded && \"cursor-pointer hover:bg-muted/30 transition-colors\"\n                    )}\n                    onClick={() => !expanded && setExpanded(true)}\n                  >\n                    {expanded && event.email ? (\n                      <div className=\"space-y-3\">\n                        <div>\n                          <div className=\"flex items-center justify-between gap-4\">\n                            <div className=\"flex min-w-0 items-baseline gap-1.5\">\n                              <span className=\"font-semibold text-foreground text-[13px] whitespace-nowrap\">{event.email.from}</span>\n                              {event.email.fromEmail && (\n                                <span className=\"text-muted-foreground/60 text-xs truncate\">{event.email.fromEmail}</span>\n                              )}\n                            </div>\n                            {event.email.date && (\n                              <span className=\"shrink-0 text-xs text-muted-foreground/50 whitespace-nowrap\">{event.email.date}</span>\n                            )}\n                          </div>\n                          <div className=\"mt-0.5 flex items-center gap-1 text-xs text-muted-foreground\">\n                            <span className=\"truncate\">\n                              To {event.email.to}\n                              {!showAllRecipients && (event.email.cc || event.email.bcc) ? (\n                                <>, ...</>\n                              ) : null}\n                              {showAllRecipients && event.email.cc ? (\n                                <>, {event.email.cc}</>\n                              ) : null}\n                              {showAllRecipients && event.email.bcc ? (\n                                <> <span className=\"text-muted-foreground/40\">bcc</span> {event.email.bcc}</>\n                              ) : null}\n                            </span>\n                            {(event.email.cc || event.email.bcc) && (\n                              <button\n                                type=\"button\"\n                                onClick={(e) => {\n                                  e.stopPropagation()\n                                  setShowAllRecipients((prev) => !prev)\n                                }}\n                                className=\"shrink-0 text-muted-foreground/40 hover:text-muted-foreground transition-colors\"\n                              >\n                                <ChevronDown className={cn(\"h-3 w-3 transition-transform\", showAllRecipients && \"rotate-180\")} />\n                              </button>\n                            )}\n                          </div>\n                        </div>\n\n                        <div className=\"whitespace-pre-line text-sm leading-relaxed text-foreground/90\">\n                          {event.email.body}\n                        </div>\n\n                        <button\n                          onClick={(e) => {\n                            e.stopPropagation()\n                            setExpanded(false)\n                          }}\n                          className=\"mt-2 flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground transition-colors hover:text-foreground\"\n                        >\n                          Show less <ChevronUp className=\"h-3 w-3\" />\n                        </button>\n                      </div>\n                    ) : (\n                      <div className=\"flex items-center justify-between gap-2 text-muted-foreground\">\n                        <span className=\"line-clamp-1 pr-3 text-[13px]\">\n                          <span className=\"text-muted-foreground\">{event.email?.from}</span>\n                          <span className=\"mx-1.5 text-muted-foreground/40\">&middot;</span>\n                          {event.email?.subject ? (\n                            <>\n                              <span className=\"text-muted-foreground\">{event.email.subject}</span>\n                              <span className=\"mx-1.5 text-muted-foreground/40\">&middot;</span>\n                            </>\n                          ) : null}\n                          <span className=\"text-muted-foreground\">{event.preview}</span>\n                        </span>\n                        <button className=\"flex shrink-0 items-center gap-1 text-[11px] font-semibold uppercase tracking-wider transition-colors hover:text-foreground\">\n                          Expand <ChevronDown className=\"h-3 w-3\" />\n                        </button>\n                      </div>\n                    )}\n                  </div>\n                </div>\n              ) : (\n                <div className=\"overflow-hidden rounded-md border border-border/80 bg-muted/20\">\n                  <div\n                    className={cn(\n                      \"px-3 py-2.5 text-sm\",\n                      !expanded && \"cursor-pointer hover:bg-muted/30 transition-colors\"\n                    )}\n                    onClick={() => !expanded && setExpanded(true)}\n                  >\n                    {expanded ? (\n                      <div className=\"space-y-2\">\n                        {event.content}\n                        <div className=\"mt-2 flex items-center gap-3\">\n                          {event.source ? (\n                            event.onSourceClick ? (\n                              <button\n                                type=\"button\"\n                                onClick={(e) => { e.stopPropagation(); event.onSourceClick?.(); }}\n                                className=\"mr-auto inline-flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground transition-colors hover:text-foreground\"\n                              >\n                                Open in {event.source.label}\n                                <ExternalLink className=\"h-3 w-3\" />\n                              </button>\n                            ) : (\n                              <a\n                                href={event.source.url}\n                                target=\"_blank\"\n                                rel=\"noreferrer noopener\"\n                                className=\"mr-auto inline-flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground transition-colors hover:text-foreground\"\n                              >\n                                Open in {event.source.label}\n                                <ExternalLink className=\"h-3 w-3\" />\n                              </a>\n                            )\n                          ) : null}\n                          <button\n                            onClick={(e) => { e.stopPropagation(); setExpanded(false); }}\n                            className=\"flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground transition-colors hover:text-foreground\"\n                          >\n                            Show less <ChevronUp className=\"h-3 w-3\" />\n                          </button>\n                        </div>\n                      </div>\n                    ) : (\n                      <div className=\"flex items-center justify-between gap-2 text-muted-foreground\">\n                        <span className=\"line-clamp-1 pr-3\">\n                          {event.preview ?? event.content}\n                        </span>\n                        <button className=\"flex shrink-0 items-center gap-1 text-[11px] font-semibold uppercase tracking-wider transition-colors hover:text-foreground\">\n                          Expand <ChevronDown className=\"h-3 w-3\" />\n                        </button>\n                      </div>\n                    )}\n                  </div>\n                </div>\n              )\n            ) : (\n              <div className=\"pr-2 text-sm leading-relaxed text-muted-foreground\">\n                {event.content}\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","names":["_a"]}
+{"version":3,"sources":["../../src/components/timeline-activity.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"../lib/utils\"\nimport { ChevronDown, ChevronUp, ExternalLink } from \"lucide-react\"\n\nexport type TimelineEventTone =\n  | \"red\"\n  | \"amber\"\n  | \"emerald\"\n  | \"violet\"\n  | \"blue\"\n  | \"slate\"\n  | \"salesforce\"\n  | \"gmail\"\n\nexport interface TimelineEventActor {\n  kind: \"user\" | \"integration\" | \"system\"\n  name?: string\n  initials?: string\n  avatarUrl?: string\n  verb?: string\n}\n\nexport interface TimelineEvent {\n  id: string\n  icon: React.ReactNode\n  title: React.ReactNode\n  time: string\n  preview?: React.ReactNode\n  email?: {\n    from: string\n    fromEmail?: string\n    to: string\n    cc?: string\n    bcc?: string\n    date?: string\n    subject?: string\n    body: React.ReactNode\n  }\n  content?: React.ReactNode\n  source?: {\n    label: string\n    url: string\n  }\n  defaultExpanded?: boolean\n  isInteractive?: boolean\n  onSourceClick?: () => void\n  tone?: TimelineEventTone\n  actor?: TimelineEventActor\n  isSystemNoise?: boolean\n}\n\n// ---------------------------------------------------------------------------\n// Tone class map — every class is a complete static string literal so\n// Tailwind's JIT scanner can detect them. NO interpolation.\n// ---------------------------------------------------------------------------\n\nexport const TONE_CLASSES: Record<\n  TimelineEventTone,\n  { dot: string; icon: string }\n> = {\n  red: {\n    dot: \"bg-red-50 border-red-200 dark:bg-red-950/30 dark:border-red-900/40\",\n    icon: \"text-red-600 dark:text-red-300\",\n  },\n  amber: {\n    dot: \"bg-amber-50 border-amber-200 dark:bg-amber-950/30 dark:border-amber-900/40\",\n    icon: \"text-amber-600 dark:text-amber-300\",\n  },\n  emerald: {\n    dot: \"bg-emerald-50 border-emerald-200 dark:bg-emerald-950/30 dark:border-emerald-900/40\",\n    icon: \"text-emerald-600 dark:text-emerald-300\",\n  },\n  violet: {\n    dot: \"bg-violet-50 border-violet-200 dark:bg-violet-950/30 dark:border-violet-900/40\",\n    icon: \"text-violet-600 dark:text-violet-300\",\n  },\n  blue: {\n    dot: \"bg-blue-50 border-blue-200 dark:bg-blue-950/30 dark:border-blue-900/40\",\n    icon: \"text-blue-600 dark:text-blue-300\",\n  },\n  slate: {\n    dot: \"bg-slate-100 border-slate-200 dark:bg-slate-800/50 dark:border-slate-700\",\n    icon: \"text-slate-500 dark:text-slate-300\",\n  },\n  salesforce: {\n    dot: \"bg-white border-[#00A1E0]/25 dark:bg-background dark:border-[#00A1E0]/25\",\n    icon: \"text-[#00A1E0]\",\n  },\n  gmail: {\n    dot: \"bg-white border-red-200 dark:bg-background dark:border-red-900/40\",\n    icon: \"text-red-500 dark:text-red-300\",\n  },\n}\n\nconst NEUTRAL_DOT_CLASSES = \"border-border/60 bg-background\"\nconst NEUTRAL_ICON_CLASSES = \"text-muted-foreground\"\n\nexport interface TimelineActivityProps {\n  events: TimelineEvent[]\n  className?: string\n}\n\nexport function TimelineActivity({ events, className }: TimelineActivityProps) {\n  return (\n    <div className={cn(\"space-y-0\", className)}>\n      {events.map((event, index) => (\n        <TimelineItem\n          key={event.id}\n          event={event}\n          isLast={index === events.length - 1}\n        />\n      ))}\n    </div>\n  )\n}\n\nfunction ActorByline({ actor, time }: { actor: TimelineEventActor; time: string }) {\n  if (actor.kind === \"system\") return null\n\n  if (actor.kind === \"integration\") {\n    return (\n      <div className=\"mt-1 flex items-center gap-1.5 text-xs text-muted-foreground\" data-testid=\"actor-byline\">\n        <span>Integration</span>\n        <span className=\"text-muted-foreground/40\">&middot;</span>\n        <span>{time}</span>\n      </div>\n    )\n  }\n\n  // actor.kind === \"user\"\n  const verb = actor.verb ?? \"performed this action\"\n  const displayInitials = actor.initials ?? (actor.name ? actor.name.charAt(0).toUpperCase() : \"?\")\n\n  return (\n    <div className=\"mt-1 flex items-center gap-1.5 text-xs text-muted-foreground\" data-testid=\"actor-byline\">\n      {actor.avatarUrl ? (\n        <img\n          src={actor.avatarUrl}\n          alt={actor.name ?? \"User\"}\n          className=\"h-4 w-4 rounded-full object-cover\"\n        />\n      ) : (\n        <span className=\"flex h-4 w-4 items-center justify-center rounded-full bg-muted-foreground/10 text-[8px] font-semibold text-muted-foreground\">\n          {displayInitials}\n        </span>\n      )}\n      <span className=\"text-foreground font-medium\">{actor.name}</span>\n      <span>{verb}</span>\n      <span className=\"text-muted-foreground/40\">&middot;</span>\n      <span>{time}</span>\n    </div>\n  )\n}\n\nfunction TimelineItem({ event, isLast }: { event: TimelineEvent; isLast: boolean }) {\n  const [expanded, setExpanded] = React.useState(event.defaultExpanded ?? false)\n  const [showAllRecipients, setShowAllRecipients] = React.useState(false)\n  const hasContent = !!event.content\n  const hasEmail = !!event.email\n\n  const toneStyle = event.tone ? TONE_CLASSES[event.tone] : null\n  const dotClasses = toneStyle ? toneStyle.dot : NEUTRAL_DOT_CLASSES\n  const iconClasses = toneStyle ? toneStyle.icon : NEUTRAL_ICON_CLASSES\n\n  return (\n    <div className=\"group relative flex gap-3.5\">\n      {!isLast && (\n        <div className=\"absolute left-[9px] top-5 bottom-[-6px] w-px bg-border/60\" />\n      )}\n\n      <div className=\"relative z-10 mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-background\">\n        <div className={cn(\"flex h-4.5 w-4.5 items-center justify-center rounded-full border ring-4 ring-background\", dotClasses, iconClasses)} data-testid=\"timeline-dot\">\n          {event.icon}\n        </div>\n      </div>\n\n      <div className=\"flex-1 pb-5 pt-0.5\">\n        <div className=\"flex min-w-0 flex-col gap-1 sm:flex-row sm:items-start sm:justify-between\">\n          <div className=\"pr-4 text-[13px] leading-relaxed text-foreground\">\n            {event.title}\n          </div>\n          <span className=\"mt-0.5 shrink-0 whitespace-nowrap text-[11px] text-muted-foreground/70\">\n            {event.time}\n          </span>\n        </div>\n\n        {event.actor && <ActorByline actor={event.actor} time={event.time} />}\n\n        {(hasContent || hasEmail) && (\n          <div className=\"mt-2\">\n            {event.isInteractive ? (\n              hasEmail ? (\n                <div className=\"overflow-hidden rounded-md border border-border/80 bg-muted/20\">\n                  <div\n                    className={cn(\n                      \"px-3 py-2.5 text-sm\",\n                      !expanded && \"cursor-pointer hover:bg-muted/30 transition-colors\"\n                    )}\n                    onClick={() => !expanded && setExpanded(true)}\n                  >\n                    {expanded && event.email ? (\n                      <div className=\"space-y-3\">\n                        <div>\n                          <div className=\"flex items-center justify-between gap-4\">\n                            <div className=\"flex min-w-0 items-baseline gap-1.5\">\n                              <span className=\"font-semibold text-foreground text-[13px] whitespace-nowrap\">{event.email.from}</span>\n                              {event.email.fromEmail && (\n                                <span className=\"text-muted-foreground/60 text-xs truncate\">{event.email.fromEmail}</span>\n                              )}\n                            </div>\n                            {event.email.date && (\n                              <span className=\"shrink-0 text-xs text-muted-foreground/50 whitespace-nowrap\">{event.email.date}</span>\n                            )}\n                          </div>\n                          <div className=\"mt-0.5 flex items-center gap-1 text-xs text-muted-foreground\">\n                            <span className=\"truncate\">\n                              To {event.email.to}\n                              {!showAllRecipients && (event.email.cc || event.email.bcc) ? (\n                                <>, ...</>\n                              ) : null}\n                              {showAllRecipients && event.email.cc ? (\n                                <>, {event.email.cc}</>\n                              ) : null}\n                              {showAllRecipients && event.email.bcc ? (\n                                <> <span className=\"text-muted-foreground/40\">bcc</span> {event.email.bcc}</>\n                              ) : null}\n                            </span>\n                            {(event.email.cc || event.email.bcc) && (\n                              <button\n                                type=\"button\"\n                                onClick={(e) => {\n                                  e.stopPropagation()\n                                  setShowAllRecipients((prev) => !prev)\n                                }}\n                                className=\"shrink-0 text-muted-foreground/40 hover:text-muted-foreground transition-colors\"\n                              >\n                                <ChevronDown className={cn(\"h-3 w-3 transition-transform\", showAllRecipients && \"rotate-180\")} />\n                              </button>\n                            )}\n                          </div>\n                        </div>\n\n                        <div className=\"whitespace-pre-line text-sm leading-relaxed text-foreground/90\">\n                          {event.email.body}\n                        </div>\n\n                        <button\n                          onClick={(e) => {\n                            e.stopPropagation()\n                            setExpanded(false)\n                          }}\n                          className=\"mt-2 flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground transition-colors hover:text-foreground\"\n                        >\n                          Show less <ChevronUp className=\"h-3 w-3\" />\n                        </button>\n                      </div>\n                    ) : (\n                      <div className=\"flex items-center justify-between gap-2 text-muted-foreground\">\n                        <span className=\"line-clamp-1 pr-3 text-[13px]\">\n                          <span className=\"text-muted-foreground\">{event.email?.from}</span>\n                          <span className=\"mx-1.5 text-muted-foreground/40\">&middot;</span>\n                          {event.email?.subject ? (\n                            <>\n                              <span className=\"text-muted-foreground\">{event.email.subject}</span>\n                              <span className=\"mx-1.5 text-muted-foreground/40\">&middot;</span>\n                            </>\n                          ) : null}\n                          <span className=\"text-muted-foreground\">{event.preview}</span>\n                        </span>\n                        <button className=\"flex shrink-0 items-center gap-1 text-[11px] font-semibold uppercase tracking-wider transition-colors hover:text-foreground\">\n                          Expand <ChevronDown className=\"h-3 w-3\" />\n                        </button>\n                      </div>\n                    )}\n                  </div>\n                </div>\n              ) : (\n                <div className=\"overflow-hidden rounded-md border border-border/80 bg-muted/20\">\n                  <div\n                    className={cn(\n                      \"px-3 py-2.5 text-sm\",\n                      !expanded && \"cursor-pointer hover:bg-muted/30 transition-colors\"\n                    )}\n                    onClick={() => !expanded && setExpanded(true)}\n                  >\n                    {expanded ? (\n                      <div className=\"space-y-2\">\n                        {event.content}\n                        <div className=\"mt-2 flex items-center gap-3\">\n                          {event.source ? (\n                            event.onSourceClick ? (\n                              <button\n                                type=\"button\"\n                                onClick={(e) => { e.stopPropagation(); event.onSourceClick?.(); }}\n                                className=\"mr-auto inline-flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground transition-colors hover:text-foreground\"\n                              >\n                                Open in {event.source.label}\n                                <ExternalLink className=\"h-3 w-3\" />\n                              </button>\n                            ) : (\n                              <a\n                                href={event.source.url}\n                                target=\"_blank\"\n                                rel=\"noreferrer noopener\"\n                                className=\"mr-auto inline-flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground transition-colors hover:text-foreground\"\n                              >\n                                Open in {event.source.label}\n                                <ExternalLink className=\"h-3 w-3\" />\n                              </a>\n                            )\n                          ) : null}\n                          <button\n                            onClick={(e) => { e.stopPropagation(); setExpanded(false); }}\n                            className=\"flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground transition-colors hover:text-foreground\"\n                          >\n                            Show less <ChevronUp className=\"h-3 w-3\" />\n                          </button>\n                        </div>\n                      </div>\n                    ) : (\n                      <div className=\"flex items-center justify-between gap-2 text-muted-foreground\">\n                        <span className=\"line-clamp-1 pr-3\">\n                          {event.preview ?? event.content}\n                        </span>\n                        <button className=\"flex shrink-0 items-center gap-1 text-[11px] font-semibold uppercase tracking-wider transition-colors hover:text-foreground\">\n                          Expand <ChevronDown className=\"h-3 w-3\" />\n                        </button>\n                      </div>\n                    )}\n                  </div>\n                </div>\n              )\n            ) : (\n              <div className=\"pr-2 text-sm leading-relaxed text-muted-foreground\">\n                {event.content}\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","names":["_a"]}

package/dist/index.d.ts

@@ -23,7 +23,6 @@ export { DataTableFilter, DataTableFilterCategory, DataTableFilterProps, FilterO
 export { DataTableQuickViewValue, DataTableQuickViews } from './components/data-table-quick-views.js';
 export { DataTableToolbar } from './components/data-table-toolbar.js';
 export { Citation, DetailViewHeader, DetailViewSummary, DetailViewThread, SourceDef, SourceList, ThreadMessage } from './components/detail-view.js';
-export { DetailDrawer, DetailDrawerProps } from './components/detail-drawer.js';
 export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger } from './components/dialog.js';
 export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from './components/dropdown-menu.js';
 export { EmptyState, EmptyStateProps } from './components/empty-state.js';
@@ -36,8 +35,6 @@ export { AssigneeFilter, InboxFilterCategory, InboxToolbar, InboxToolbarProps }
 export { InlineBanner, InlineBannerProps } from './components/inline-banner.js';
 export { Input } from './components/input.js';
 export { FilterDefinition, InsightsFilterBar, InsightsFilterBarProps } from './components/insights-filter-bar.js';
-export { DaysOpenCell, DaysOpenCellProps, getDaysOpenIntent } from './components/days-open-cell.js';
-export { LinkedEntityCell, LinkedEntityCellProps } from './components/linked-entity-cell.js';
 export { GroupedListGroup, GroupedListView, GroupedListViewProps, ItemList } from './components/item-list.js';
 export { ItemListDisplay, ItemListDisplayState, ItemListGrouping, ItemListViewMode } from './components/item-list-display.js';
 export { ItemListFilter, ItemListFilterCategory } from './components/item-list-filter.js';
@@ -45,13 +42,11 @@ export { ItemListQuickView, ItemListToolbar } from './components/item-list-toolb
 export { KbdHint } from './components/kbd-hint.js';
 export { Label } from './components/label.js';
 export { Message, MessageAvatar, MessageAvatarProps, MessageContent, MessageContentProps, MessageProps } from './components/message.js';
-export { KpiStrip, KpiStripItem, KpiStripProps, MetricCard, MetricCardProps, MetricDataPoint } from './components/metric-card.js';
+export { MetricCard, MetricCardProps, MetricDataPoint } from './components/metric-card.js';
 export { PerformanceMetricsTable, PerformanceMetricsTableRow, PerformanceMetricsTableSortOption } from './components/performance-metrics-table.js';
-export { Pill, PillProps, PillStatus, StatusPill, StatusPillProps, pillVariants } from './components/pill.js';
 export { PreviewList, PreviewListItem, PreviewListItemProps } from './components/preview-list.js';
 export { Progress } from './components/progress.js';
 export { QuickActionChatArea, QuickActionSubmitPayload } from './components/quick-action-chat-area.js';
-export { QuickSegment, QuickSegmentProps } from './components/quick-segment.js';
 export { QuickActionModal, QuickActionPriority, QuickActionTaskDraft, QuickActionTemplate } from './components/quick-action-modal.js';
 export { ActiveVariant, QuickActionSidebarNav, SidebarNavItem, SidebarNavSection, SidebarUserProfile, UserMenuItem } from './components/quick-action-sidebar-nav.js';
 export { RecommendedAction, RecommendedActionsSection } from './components/recommended-actions-section.js';
@@ -81,7 +76,7 @@ export { Switch } from './components/switch.js';
 export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from './components/table.js';
 export { Tabs, TabsContent, TabsList, TabsTrigger, tabsListVariants } from './components/tabs.js';
 export { Textarea } from './components/textarea.js';
-export { TimelineActivity, TimelineActivityProps, TimelineEvent } from './components/timeline-activity.js';
+export { TONE_CLASSES, TimelineActivity, TimelineActivityProps, TimelineEvent, TimelineEventActor, TimelineEventTone } from './components/timeline-activity.js';
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './components/tooltip.js';
 export { ActorByline, ActorBylineProps, UserPill, UserPillProps } from './components/user-display.js';
 export { VariableAutocomplete, VariableAutocompleteProps, VariableDef, VariableGroup } from './components/variable-autocomplete.js';
@@ -97,7 +92,6 @@ export { VolumeAnalysisChart, VolumeAnalysisChartProps, VolumeDataKey } from './
 export { MetricCardData, TopLineMetrics, TopLineMetricsProps } from './charts/top-line-metrics.js';
 export { PipelineFilterBreakdown, PipelineOverview, PipelineOverviewProps, PipelineStage, PipelineStageMetrics, PipelineStageTiming } from './charts/pipeline-overview.js';
 export { SankeyChart, SankeyData, SankeyDropOff, SankeyHoverCardData, SankeyLink, SankeyNode, SankeyStageMetrics } from './charts/sankey-chart.js';
-export { EmptyChartState, EmptyChartStateProps } from './charts/empty-chart-state.js';
 export { PrototypeShell, PrototypeShellProps } from './prototype/prototype-shell.js';
 export { DetailView, DetailViewProps, PrototypeInboxView, PrototypeInboxViewProps } from './prototype/prototype-inbox-view.js';
 export { PrototypeInsightsView, PrototypeInsightsViewProps } from './prototype/prototype-insights-view.js';

package/dist/index.js

@@ -23,7 +23,6 @@ export * from "./components/data-table-filter.js";
 export * from "./components/data-table-quick-views.js";
 export * from "./components/data-table-toolbar.js";
 export * from "./components/detail-view.js";
-export * from "./components/detail-drawer.js";
 export * from "./components/dialog.js";
 export * from "./components/dropdown-menu.js";
 export * from "./components/empty-state.js";
@@ -36,8 +35,6 @@ export * from "./components/inbox-toolbar.js";
 export * from "./components/inline-banner.js";
 export * from "./components/input.js";
 export * from "./components/insights-filter-bar.js";
-export * from "./components/days-open-cell.js";
-export * from "./components/linked-entity-cell.js";
 export * from "./components/item-list.js";
 export * from "./components/item-list-display.js";
 export * from "./components/item-list-filter.js";
@@ -47,11 +44,9 @@ export * from "./components/label.js";
 export * from "./components/message.js";
 export * from "./components/metric-card.js";
 export * from "./components/performance-metrics-table.js";
-export * from "./components/pill.js";
 export * from "./components/preview-list.js";
 export * from "./components/progress.js";
 export * from "./components/quick-action-chat-area.js";
-export * from "./components/quick-segment.js";
 import {
   QuickActionModal
 } from "./components/quick-action-modal.js";

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * @handled-ai/design-system\n * UI components and utilities (shadcn-style, New York)\n */\n\n// Utilities\nexport { cn } from \"./lib/utils\"\nexport { BRAND_ICONS, BRAND_GRAPHICS } from \"./lib/icons\"\nexport { displayName, getInitials, shortName, type ProfileLike } from \"./lib/user-display\"\n\n// Hooks\nexport { useIsMobile } from \"./hooks/use-mobile\"\n\n// Components (light — no recharts/nivo/three transitive deps)\nexport * from \"./components/activity-detail\"\nexport * from \"./components/activity-log\"\nexport * from \"./components/agent-popover\"\nexport * from \"./components/agent-widget\"\nexport * from \"./components/avatar\"\nexport * from \"./components/badge\"\nexport * from \"./components/button\"\nexport * from \"./components/card\"\nexport { CollapsibleSection, type CollapsibleSectionProps } from \"./components/collapsible-section\"\nexport * from \"./components/compliance-badge\"\nexport * from \"./components/contact-chip\"\nexport * from \"./components/contact-list\"\nexport * from \"./components/contextual-quick-action-launcher\"\nexport * from \"./components/dashboard-cards\"\nexport * from \"./components/data-table\"\nexport * from \"./components/data-table-condition-filter\"\nexport * from \"./components/data-table-display\"\nexport * from \"./components/data-table-filter\"\nexport * from \"./components/data-table-quick-views\"\nexport * from \"./components/data-table-toolbar\"\nexport * from \"./components/detail-view\"\nexport * from \"./components/detail-drawer\"\nexport * from \"./components/dialog\"\nexport * from \"./components/dropdown-menu\"\nexport * from \"./components/empty-state\"\nexport * from \"./components/entity-panel\"\nexport { FeedbackFooter, FeedbackChipGroup, FeedbackInput, FeedbackActions } from \"./components/feedback-primitives\"\nexport type { FeedbackFooterProps, FeedbackChipTree, FeedbackChipGroupProps, FeedbackInputProps, FeedbackActionsProps, FeedbackSubmitData } from \"./components/feedback-primitives\"\nexport { SignalPriorityPopover } from \"./components/signal-priority-popover\"\nexport type { SignalPriorityPopoverProps, PriorityFactor } from \"./components/signal-priority-popover\"\nexport * from \"./components/filter-chip\"\nexport * from \"./components/inbox-row\"\nexport * from \"./components/inbox-toolbar\"\nexport * from \"./components/inline-banner\"\nexport * from \"./components/input\"\nexport * from \"./components/insights-filter-bar\"\nexport * from \"./components/days-open-cell\"\nexport * from \"./components/linked-entity-cell\"\nexport * from \"./components/item-list\"\nexport * from \"./components/item-list-display\"\nexport * from \"./components/item-list-filter\"\nexport * from \"./components/item-list-toolbar\"\nexport * from \"./components/kbd-hint\"\nexport * from \"./components/label\"\nexport * from \"./components/message\"\nexport * from \"./components/metric-card\"\nexport * from \"./components/performance-metrics-table\"\nexport * from \"./components/pill\"\nexport * from \"./components/preview-list\"\nexport * from \"./components/progress\"\nexport * from \"./components/quick-action-chat-area\"\nexport * from \"./components/quick-segment\"\nexport {\n  QuickActionModal,\n  type QuickActionPriority,\n  type QuickActionTaskDraft,\n  type QuickActionTemplate,\n} from \"./components/quick-action-modal\"\nexport * from \"./components/quick-action-sidebar-nav\"\nexport * from \"./components/recommended-actions-section\"\nexport * from \"./components/report-card\"\nexport * from \"./components/rich-text-toolbar\"\nexport * from \"./components/score-analysis-modal\"\nexport * from \"./components/score-breakdown\"\nexport * from \"./components/score-feedback\"\nexport * from \"./components/score-why-chips\"\nexport * from \"./components/score-ring\"\nexport * from \"./components/scroll-area\"\nexport * from \"./components/select\"\nexport * from \"./components/separator\"\nexport * from \"./components/sheet\"\nexport * from \"./components/sidebar\"\nexport * from \"./components/signal-feedback-inline\"\nexport * from \"./components/simple-data-table\"\nexport * from \"./components/skeleton\"\nexport * from \"./components/status-badge\"\nexport * from \"./components/step-timeline\"\nexport * from \"./components/sticky-action-bar\"\nexport * from \"./components/styled-bar-list\"\nexport { DraftFeedbackInline } from \"./components/draft-feedback-inline\"\nexport type { DraftFeedbackInlineProps } from \"./components/draft-feedback-inline\"\nexport { AccountContactsPopover, BrandIcon } from \"./components/account-contacts-popover\"\nexport type { AccountContactsPopoverProps } from \"./components/account-contacts-popover\"\nexport * from \"./components/suggested-actions\"\nexport * from \"./components/switch\"\nexport * from \"./components/table\"\nexport * from \"./components/tabs\"\nexport * from \"./components/textarea\"\nexport * from \"./components/timeline-activity\"\nexport * from \"./components/tooltip\"\nexport * from \"./components/user-display\"\nexport * from \"./components/variable-autocomplete\"\nexport * from \"./components/view-mode-toggle\"\nexport * from \"./components/virtualized-data-table\"\nexport type { ColumnSizingState } from \"@tanstack/react-table\"\n\n// Charts (re-exported for backward compatibility with root imports)\nexport * from \"./charts/index\"\n\n// Prototype template system (re-exported for backward compatibility)\nexport * from \"./prototype/prototype-config\"\nexport * from \"./prototype/prototype-shell\"\nexport * from \"./prototype/prototype-inbox-view\"\nexport * from \"./prototype/prototype-insights-view\"\nexport * from \"./prototype/prototype-accounts-view\"\nexport * from \"./prototype/prototype-admin-view\"\nexport * from \"./prototype/prototype-work-queue-view\"\n"],"mappings":"AAMA,SAAS,UAAU;AACnB,SAAS,aAAa,sBAAsB;AAC5C,SAAS,aAAa,aAAa,iBAAmC;AAGtE,SAAS,mBAAmB;AAG5B,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAAS,0BAAwD;AACjE,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAAS,gBAAgB,mBAAmB,eAAe,uBAAuB;AAElF,SAAS,6BAA6B;AAEtC,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd;AAAA,EACE;AAAA,OAIK;AACP,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAAS,2BAA2B;AAEpC,SAAS,wBAAwB,iBAAiB;AAElD,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AAId,cAAc;AAGd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * @handled-ai/design-system\n * UI components and utilities (shadcn-style, New York)\n */\n\n// Utilities\nexport { cn } from \"./lib/utils\"\nexport { BRAND_ICONS, BRAND_GRAPHICS } from \"./lib/icons\"\nexport { displayName, getInitials, shortName, type ProfileLike } from \"./lib/user-display\"\n\n// Hooks\nexport { useIsMobile } from \"./hooks/use-mobile\"\n\n// Components (light — no recharts/nivo/three transitive deps)\nexport * from \"./components/activity-detail\"\nexport * from \"./components/activity-log\"\nexport * from \"./components/agent-popover\"\nexport * from \"./components/agent-widget\"\nexport * from \"./components/avatar\"\nexport * from \"./components/badge\"\nexport * from \"./components/button\"\nexport * from \"./components/card\"\nexport { CollapsibleSection, type CollapsibleSectionProps } from \"./components/collapsible-section\"\nexport * from \"./components/compliance-badge\"\nexport * from \"./components/contact-chip\"\nexport * from \"./components/contact-list\"\nexport * from \"./components/contextual-quick-action-launcher\"\nexport * from \"./components/dashboard-cards\"\nexport * from \"./components/data-table\"\nexport * from \"./components/data-table-condition-filter\"\nexport * from \"./components/data-table-display\"\nexport * from \"./components/data-table-filter\"\nexport * from \"./components/data-table-quick-views\"\nexport * from \"./components/data-table-toolbar\"\nexport * from \"./components/detail-view\"\nexport * from \"./components/dialog\"\nexport * from \"./components/dropdown-menu\"\nexport * from \"./components/empty-state\"\nexport * from \"./components/entity-panel\"\nexport { FeedbackFooter, FeedbackChipGroup, FeedbackInput, FeedbackActions } from \"./components/feedback-primitives\"\nexport type { FeedbackFooterProps, FeedbackChipTree, FeedbackChipGroupProps, FeedbackInputProps, FeedbackActionsProps, FeedbackSubmitData } from \"./components/feedback-primitives\"\nexport { SignalPriorityPopover } from \"./components/signal-priority-popover\"\nexport type { SignalPriorityPopoverProps, PriorityFactor } from \"./components/signal-priority-popover\"\nexport * from \"./components/filter-chip\"\nexport * from \"./components/inbox-row\"\nexport * from \"./components/inbox-toolbar\"\nexport * from \"./components/inline-banner\"\nexport * from \"./components/input\"\nexport * from \"./components/insights-filter-bar\"\nexport * from \"./components/item-list\"\nexport * from \"./components/item-list-display\"\nexport * from \"./components/item-list-filter\"\nexport * from \"./components/item-list-toolbar\"\nexport * from \"./components/kbd-hint\"\nexport * from \"./components/label\"\nexport * from \"./components/message\"\nexport * from \"./components/metric-card\"\nexport * from \"./components/performance-metrics-table\"\nexport * from \"./components/preview-list\"\nexport * from \"./components/progress\"\nexport * from \"./components/quick-action-chat-area\"\nexport {\n  QuickActionModal,\n  type QuickActionPriority,\n  type QuickActionTaskDraft,\n  type QuickActionTemplate,\n} from \"./components/quick-action-modal\"\nexport * from \"./components/quick-action-sidebar-nav\"\nexport * from \"./components/recommended-actions-section\"\nexport * from \"./components/report-card\"\nexport * from \"./components/rich-text-toolbar\"\nexport * from \"./components/score-analysis-modal\"\nexport * from \"./components/score-breakdown\"\nexport * from \"./components/score-feedback\"\nexport * from \"./components/score-why-chips\"\nexport * from \"./components/score-ring\"\nexport * from \"./components/scroll-area\"\nexport * from \"./components/select\"\nexport * from \"./components/separator\"\nexport * from \"./components/sheet\"\nexport * from \"./components/sidebar\"\nexport * from \"./components/signal-feedback-inline\"\nexport * from \"./components/simple-data-table\"\nexport * from \"./components/skeleton\"\nexport * from \"./components/status-badge\"\nexport * from \"./components/step-timeline\"\nexport * from \"./components/sticky-action-bar\"\nexport * from \"./components/styled-bar-list\"\nexport { DraftFeedbackInline } from \"./components/draft-feedback-inline\"\nexport type { DraftFeedbackInlineProps } from \"./components/draft-feedback-inline\"\nexport { AccountContactsPopover, BrandIcon } from \"./components/account-contacts-popover\"\nexport type { AccountContactsPopoverProps } from \"./components/account-contacts-popover\"\nexport * from \"./components/suggested-actions\"\nexport * from \"./components/switch\"\nexport * from \"./components/table\"\nexport * from \"./components/tabs\"\nexport * from \"./components/textarea\"\nexport * from \"./components/timeline-activity\"\nexport * from \"./components/tooltip\"\nexport * from \"./components/user-display\"\nexport * from \"./components/variable-autocomplete\"\nexport * from \"./components/view-mode-toggle\"\nexport * from \"./components/virtualized-data-table\"\nexport type { ColumnSizingState } from \"@tanstack/react-table\"\n\n// Charts (re-exported for backward compatibility with root imports)\nexport * from \"./charts/index\"\n\n// Prototype template system (re-exported for backward compatibility)\nexport * from \"./prototype/prototype-config\"\nexport * from \"./prototype/prototype-shell\"\nexport * from \"./prototype/prototype-inbox-view\"\nexport * from \"./prototype/prototype-insights-view\"\nexport * from \"./prototype/prototype-accounts-view\"\nexport * from \"./prototype/prototype-admin-view\"\nexport * from \"./prototype/prototype-work-queue-view\"\n"],"mappings":"AAMA,SAAS,UAAU;AACnB,SAAS,aAAa,sBAAsB;AAC5C,SAAS,aAAa,aAAa,iBAAmC;AAGtE,SAAS,mBAAmB;AAG5B,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAAS,0BAAwD;AACjE,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAAS,gBAAgB,mBAAmB,eAAe,uBAAuB;AAElF,SAAS,6BAA6B;AAEtC,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd;AAAA,EACE;AAAA,OAIK;AACP,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAAS,2BAA2B;AAEpC,SAAS,wBAAwB,iBAAiB;AAElD,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AAId,cAAc;AAGd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}

package/dist/prototype/prototype-inbox-view.d.ts

@@ -68,8 +68,18 @@ interface DetailViewProps {
     onRequestApproval?: () => Promise<void>;
     /** Number of important/attention-worthy events to highlight on the collapsed timeline header. */
     attentionCount?: number;
+    /** Label for the system-events toggle button (e.g. "Score changes"). */
+    timelineSystemEventsToggleLabel?: string;
+    /** localStorage key for persisting the system-events toggle state. */
+    timelineSystemEventsStorageKey?: string;
+    /** Whether system-noise events are visible by default. @default false */
+    timelineSystemEventsDefaultVisible?: boolean;
+    /** Hint text shown below the timeline when system events are hidden. */
+    timelineSystemEventsHiddenHint?: string;
+    /** Hint text shown below the timeline when system events are visible. Uses {count} as placeholder. */
+    timelineSystemEventsVisibleHint?: string;
 }
-declare function DetailView({ item, sections, getSignalScore, buildSuggestedActions, buildSourceItems: _buildSourceItems, getTimelineEvents, accountContacts, emailSignature, iconMap, onOpenEntityPanel, onOpenRecentActivity, onSuggestedActionFeedback: _onSuggestedActionFeedback, onScoreFeedback: _onScoreFeedback, onSignalApprove, getSignalApprovalState, signalLabels, hideApproveButton, signalBriefCopy, briefStyleVariant, renderDetailExtra, renderBeforeScore, renderAfterScore, lastActivityTime, renderTitleExtra, renderTitleSubtext, renderMetadataExtra, onOpenSignalBucket, approveButtonIconUrl, opportunityPreview, onRequestApproval, attentionCount, }: DetailViewProps): React.JSX.Element;
+declare function DetailView({ item, sections, getSignalScore, buildSuggestedActions, buildSourceItems: _buildSourceItems, getTimelineEvents, accountContacts, emailSignature, iconMap, onOpenEntityPanel, onOpenRecentActivity, onSuggestedActionFeedback: _onSuggestedActionFeedback, onScoreFeedback: _onScoreFeedback, onSignalApprove, getSignalApprovalState, signalLabels, hideApproveButton, signalBriefCopy, briefStyleVariant, renderDetailExtra, renderBeforeScore, renderAfterScore, lastActivityTime, renderTitleExtra, renderTitleSubtext, renderMetadataExtra, onOpenSignalBucket, approveButtonIconUrl, opportunityPreview, onRequestApproval, attentionCount, timelineSystemEventsToggleLabel, timelineSystemEventsStorageKey, timelineSystemEventsDefaultVisible, timelineSystemEventsHiddenHint, timelineSystemEventsVisibleHint, }: DetailViewProps): React.JSX.Element;
 declare function PrototypeInboxView({ items, filterCategories, detailSections, accountContacts, buildAccountContacts, emailSignature, buildSuggestedActions: buildSuggestedActionsProp, buildSourceItems: buildSourceItemsProp, getSignalScore: getSignalScoreProp, getTimelineEvents, iconMap, hideToolbarActions, hideHoverActions, onSuggestedActionFeedback, onScoreFeedback, onOpenSignalBucket, headerActions, onOpenEntityPanel, onOpenRecentActivity, onItemSelect, defaultViewMode, buildEntityChips, quickFilterTabs, hideAccountsButton, accountDetailsLabel, onSignalApprove, getSignalApprovalState, signalLabels, hideApproveButton, signalBriefCopy, briefStyleVariant, renderDetailExtra, renderBeforeScore, renderAfterScore, lastActivityTime, renderTitleExtra, renderTitleSubtext, sortOptions, activeSortId, onSortChange, }: PrototypeInboxViewProps): React.JSX.Element;
 
 export { DetailView, type DetailViewProps, PrototypeInboxView, type PrototypeInboxViewProps };

package/dist/prototype/prototype-inbox-view.js

@@ -117,11 +117,40 @@ function DetailView({
   approveButtonIconUrl,
   opportunityPreview,
   onRequestApproval,
-  attentionCount
+  attentionCount,
+  timelineSystemEventsToggleLabel,
+  timelineSystemEventsStorageKey,
+  timelineSystemEventsDefaultVisible = false,
+  timelineSystemEventsHiddenHint,
+  timelineSystemEventsVisibleHint
 }) {
-  var _a, _b, _c, _d, _e;
+  var _a, _b, _c;
   const [showTimeline, setShowTimeline] = React.useState(false);
   const [extraActions, setExtraActions] = React.useState([]);
+  const [showSystemEvents, setShowSystemEvents] = React.useState(timelineSystemEventsDefaultVisible);
+  const initialReadDoneRef = React.useRef(false);
+  React.useEffect(() => {
+    if (!timelineSystemEventsStorageKey) {
+      initialReadDoneRef.current = true;
+      return;
+    }
+    try {
+      const stored = localStorage.getItem(timelineSystemEventsStorageKey);
+      if (stored !== null) {
+        setShowSystemEvents(stored === "true");
+      }
+    } catch (e) {
+    }
+    initialReadDoneRef.current = true;
+  }, [timelineSystemEventsStorageKey]);
+  React.useEffect(() => {
+    if (!timelineSystemEventsStorageKey) return;
+    if (!initialReadDoneRef.current) return;
+    try {
+      localStorage.setItem(timelineSystemEventsStorageKey, String(showSystemEvents));
+    } catch (e) {
+    }
+  }, [showSystemEvents, timelineSystemEventsStorageKey]);
   React.useEffect(() => {
     setShowTimeline(false);
     setExtraActions([]);
@@ -249,37 +278,76 @@ function DetailView({
             ] });
           })(),
           renderAfterScore == null ? void 0 : renderAfterScore(item),
-          sections.timeline && timelineEvents.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mb-8", children: [
-            /* @__PURE__ */ jsxs(
-              "button",
-              {
-                type: "button",
-                onClick: () => setShowTimeline((prev) => !prev),
-                className: "group/timeline flex w-full items-center justify-between gap-2 py-2 rounded-md transition-colors hover:bg-muted/40 -mx-2 px-2 cursor-pointer",
-                children: [
-                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-                    /* @__PURE__ */ jsx("h3", { className: "text-xs font-bold text-muted-foreground uppercase tracking-wider group-hover/timeline:text-foreground transition-colors", children: "Activity timeline" }),
-                    !showTimeline && attentionCount != null && attentionCount > 0 && /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 rounded-full bg-destructive/10 px-1.5 py-0.5 text-[10px] font-semibold text-destructive border border-destructive/20", children: [
-                      attentionCount,
-                      " new"
-                    ] }),
-                    !showTimeline && (lastActivityTime || timelineEvents.length > 0 && timelineEvents[0].time) && /* @__PURE__ */ jsxs("span", { className: "text-[11px] text-muted-foreground/60", children: [
-                      "\xB7 Last activity ",
-                      (_e = lastActivityTime != null ? lastActivityTime : (_d = timelineEvents[0]) == null ? void 0 : _d.time) != null ? _e : ""
-                    ] })
-                  ] }),
-                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
-                    /* @__PURE__ */ jsxs("span", { className: "text-[11px] font-medium text-muted-foreground", children: [
-                      timelineEvents.length,
-                      " events"
-                    ] }),
-                    /* @__PURE__ */ jsx(ChevronDown, { className: `h-3.5 w-3.5 text-muted-foreground transition-transform duration-200 ${showTimeline ? "rotate-180" : ""}` })
-                  ] })
-                ]
-              }
-            ),
-            showTimeline && /* @__PURE__ */ jsx("div", { className: "mt-3", children: /* @__PURE__ */ jsx(TimelineActivity, { events: timelineEvents }) })
-          ] })
+          sections.timeline && timelineEvents.length > 0 && (() => {
+            const visibleEvents = timelineEvents.filter(
+              (e) => !e.isSystemNoise || showSystemEvents
+            );
+            const hiddenCount = timelineEvents.filter((e) => e.isSystemNoise).length;
+            const hasSystemNoise = hiddenCount > 0;
+            const showToggle = hasSystemNoise && !!(timelineSystemEventsToggleLabel || timelineSystemEventsStorageKey);
+            const firstVisibleTime = lastActivityTime != null ? lastActivityTime : visibleEvents.length > 0 ? visibleEvents[0].time : "";
+            const visibleCount = visibleEvents.length;
+            const eventCountLabel = `${visibleCount} ${visibleCount === 1 ? "event" : "events"}`;
+            return /* @__PURE__ */ jsxs("div", { className: "mb-8", children: [
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: "group/timeline flex w-full items-center justify-between gap-2 py-2 rounded-md transition-colors hover:bg-muted/40 -mx-2 px-2",
+                  "data-testid": "timeline-header",
+                  children: [
+                    /* @__PURE__ */ jsxs(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: () => setShowTimeline((prev) => !prev),
+                        className: "flex items-center gap-2 cursor-pointer bg-transparent border-0 p-0",
+                        "data-testid": "timeline-collapse-btn",
+                        children: [
+                          /* @__PURE__ */ jsx("h3", { className: "text-xs font-bold text-muted-foreground uppercase tracking-wider group-hover/timeline:text-foreground transition-colors", children: "Activity timeline" }),
+                          !showTimeline && attentionCount != null && attentionCount > 0 && /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 rounded-full bg-destructive/10 px-1.5 py-0.5 text-[10px] font-semibold text-destructive border border-destructive/20", children: [
+                            attentionCount,
+                            " new"
+                          ] }),
+                          !showTimeline && firstVisibleTime && /* @__PURE__ */ jsxs("span", { className: "text-[11px] text-muted-foreground/60", "data-testid": "last-activity-hint", children: [
+                            "\xB7 Last activity ",
+                            firstVisibleTime
+                          ] }),
+                          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+                            /* @__PURE__ */ jsx("span", { className: "text-[11px] font-medium text-muted-foreground", "data-testid": "event-count", children: eventCountLabel }),
+                            /* @__PURE__ */ jsx(ChevronDown, { className: `h-3.5 w-3.5 text-muted-foreground transition-transform duration-200 ${showTimeline ? "rotate-180" : ""}` })
+                          ] })
+                        ]
+                      }
+                    ),
+                    showToggle && /* @__PURE__ */ jsxs(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: () => setShowSystemEvents((prev) => !prev),
+                        className: "flex shrink-0 items-center gap-1.5 rounded-full border border-border bg-background px-2.5 py-1 text-[11px] font-medium text-muted-foreground transition-colors hover:bg-muted/40 hover:text-foreground cursor-pointer",
+                        "aria-pressed": showSystemEvents,
+                        "data-testid": "system-events-toggle",
+                        children: [
+                          timelineSystemEventsToggleLabel != null ? timelineSystemEventsToggleLabel : "System events",
+                          /* @__PURE__ */ jsx(
+                            "span",
+                            {
+                              className: "inline-flex items-center justify-center rounded-full bg-muted px-1.5 text-[10px] font-semibold min-w-[18px] tabular-nums",
+                              "data-testid": "hidden-count-badge",
+                              children: hiddenCount
+                            }
+                          )
+                        ]
+                      }
+                    )
+                  ]
+                }
+              ),
+              showTimeline && visibleEvents.length > 0 && /* @__PURE__ */ jsx("div", { className: "mt-3", children: /* @__PURE__ */ jsx(TimelineActivity, { events: visibleEvents }) }),
+              showTimeline && !showSystemEvents && timelineSystemEventsHiddenHint && hasSystemNoise && /* @__PURE__ */ jsx("p", { className: "mt-2 text-[11px] text-muted-foreground/60 border-t border-dashed border-border pt-2", "data-testid": "timeline-footer-hint", children: timelineSystemEventsHiddenHint }),
+              showTimeline && showSystemEvents && timelineSystemEventsVisibleHint && hasSystemNoise && /* @__PURE__ */ jsx("p", { className: "mt-2 text-[11px] text-muted-foreground/60 border-t border-dashed border-border pt-2", "data-testid": "timeline-footer-hint", children: timelineSystemEventsVisibleHint.replace("{count}", String(hiddenCount)) })
+            ] });
+          })()
         ] }),
         sections.suggestedActions && /* @__PURE__ */ jsx(SignalApproval.Gate, { children: /* @__PURE__ */ jsx(
           SuggestedActions,