@handled-ai/design-system 0.2.1 → 0.3.1

package/dist/index.js

@@ -1,7 +1,7 @@
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import * as React52 from 'react';
-import { AlertCircle, Phone, Mail, MessageSquare, ArrowLeft, ExternalLink, ChevronDown, ArrowRight, Plus, Square, Video, Clock, Eye, CheckCircle2, CheckSquare, CheckIcon, CircleIcon, ChevronRightIcon, X, ListFilter, Search, ChevronDownIcon, ChevronUpIcon, LayoutGrid, ArrowUpDown, ArrowDown, ArrowUp, XIcon, ThumbsUp, ThumbsDown, Check, CirclePlus, Lock, ChevronUp, Briefcase, History, Calendar, DollarSign, Users, TrendingUp, User, Link, SearchX, CalendarDays, Minimize2, Maximize2, MessageCircle, FileText, Building2, List, Filter, SlidersHorizontal, LayoutTemplate, ArrowDownAZ, ArrowUpAZ, RotateCcw, Info, ChevronLeft, ChevronRight, Paperclip, Inbox, Building, Activity, BarChart2, MoreHorizontal, Settings, Code, LogOut, PanelLeftOpen, PanelLeftClose, MoreVertical, HelpCircle, SkipForward, PanelLeftIcon, Heart, Scale, AlertTriangle, Undo2, Copy, RefreshCw, Redo2, Bold, Italic, Underline, AlignLeft, Trash, PenLine, Sparkles } from 'lucide-react';
+import { AlertCircle, Phone, Mail, MessageSquare, ArrowLeft, ExternalLink, ChevronDown, ArrowRight, Plus, Square, Video, Clock, Eye, CheckCircle2, CheckSquare, CheckIcon, CircleIcon, ChevronRightIcon, X, ListFilter, Search, ChevronDownIcon, ChevronUpIcon, LayoutGrid, ArrowUpDown, ArrowDown, ArrowUp, XIcon, ThumbsUp, ThumbsDown, Check, CirclePlus, Lock, ChevronUp, Briefcase, History, Calendar, DollarSign, Users, TrendingUp, User, Link, SearchX, CalendarDays, Minimize2, Maximize2, MessageCircle, FileText, Building2, List, Filter, SlidersHorizontal, LayoutTemplate, ArrowDownAZ, ArrowUpAZ, RotateCcw, Info, ChevronLeft, ChevronRight, Paperclip, Inbox, Building, Activity, BarChart2, MoreHorizontal, Settings, Code, LogOut, PanelLeftOpen, PanelLeftClose, MoreVertical, HelpCircle, SkipForward, PanelLeftIcon, Tag, Columns2, LayoutList, Heart, Scale, AlertTriangle, Undo2, Copy, RefreshCw, Redo2, Bold, Italic, Underline, AlignLeft, Trash, PenLine, Sparkles } from 'lucide-react';
 import { cva } from 'class-variance-authority';
 import { Slot, Avatar as Avatar$1, DropdownMenu as DropdownMenu$1, Select as Select$1, Dialog as Dialog$1, HoverCard as HoverCard$1, Separator as Separator$1, Popover, ScrollArea as ScrollArea$1, Tooltip as Tooltip$1, Progress as Progress$1, Tabs as Tabs$1 } from 'radix-ui';
 import { format } from 'date-fns';
@@ -5878,8 +5878,11 @@ function NavItemRow({
   item,
   isActive,
   isCollapsed,
+  activeVariant = "default",
   onClick
 }) {
+  const activeClasses = activeVariant === "gradient" ? "bg-gradient-to-r from-primary/10 to-transparent text-primary" : "bg-sidebar-accent text-sidebar-accent-foreground";
+  const iconActiveClasses = activeVariant === "gradient" ? "text-primary" : "";
   const content = /* @__PURE__ */ React52.createElement(
     "button",
     {
@@ -5888,10 +5891,10 @@ function NavItemRow({
       className: cn(
         "flex w-full items-center gap-3 rounded-lg text-sm font-medium transition-colors",
         isCollapsed ? "justify-center p-2" : "px-3 py-2",
-        isActive ? "bg-sidebar-accent text-sidebar-accent-foreground" : "text-sidebar-foreground/70 hover:text-sidebar-foreground hover:bg-sidebar-accent"
+        isActive ? activeClasses : "text-sidebar-foreground/70 hover:text-sidebar-foreground hover:bg-sidebar-accent"
       )
     },
-    /* @__PURE__ */ React52.createElement(item.icon, { className: cn("shrink-0", isCollapsed ? "w-5 h-5" : "w-4 h-4") }),
+    /* @__PURE__ */ React52.createElement(item.icon, { className: cn("shrink-0", isCollapsed ? "w-5 h-5" : "w-4 h-4", isActive && iconActiveClasses) }),
     !isCollapsed && /* @__PURE__ */ React52.createElement("span", { className: "flex-1 truncate text-left" }, item.label)
   );
   if (isCollapsed) {
@@ -5903,6 +5906,7 @@ function NavSection({
   section,
   activeItemId,
   isCollapsed,
+  activeVariant = "default",
   onNavigate
 }) {
   var _a;
@@ -5932,6 +5936,7 @@ function NavSection({
       item,
       isActive: activeItemId === item.id,
       isCollapsed,
+      activeVariant,
       onClick: () => onNavigate == null ? void 0 : onNavigate(item.id)
     }
   )), !isCollapsed && section.moreItems && section.moreItems.length > 0 && /* @__PURE__ */ React52.createElement(DropdownMenu, null, /* @__PURE__ */ React52.createElement(DropdownMenuTrigger, { className: "flex items-center gap-3 w-full px-3 py-2 rounded-lg text-sm font-medium text-sidebar-foreground/70 hover:text-sidebar-foreground hover:bg-sidebar-accent transition-colors outline-none" }, /* @__PURE__ */ React52.createElement(MoreHorizontal, { className: "shrink-0 w-4 h-4" }), /* @__PURE__ */ React52.createElement("span", { className: "flex-1 text-left" }, "More")), /* @__PURE__ */ React52.createElement(DropdownMenuContent, { align: "start", side: "bottom", className: "w-48" }, section.moreItems.map((item) => /* @__PURE__ */ React52.createElement(
@@ -5950,6 +5955,7 @@ function NavSection({
       item,
       isActive: activeItemId === item.id,
       isCollapsed,
+      activeVariant,
       onClick: () => onNavigate == null ? void 0 : onNavigate(item.id)
     }
   )))));
@@ -5961,6 +5967,7 @@ function QuickActionSidebarNav(_a) {
     brandSubtitle = "Placeholder",
     navSections = DEFAULT_NAV_SECTIONS,
     activeItemId = "inbox",
+    activeVariant = "default",
     onNavigate,
     user = DEFAULT_USER,
     userMenuItems = DEFAULT_USER_MENU,
@@ -5973,6 +5980,7 @@ function QuickActionSidebarNav(_a) {
     "brandSubtitle",
     "navSections",
     "activeItemId",
+    "activeVariant",
     "onNavigate",
     "user",
     "userMenuItems",
@@ -6024,6 +6032,7 @@ function QuickActionSidebarNav(_a) {
           section,
           activeItemId,
           isCollapsed,
+          activeVariant,
           onNavigate
         }
       ));
@@ -8765,7 +8774,701 @@ function VolumeAnalysisChart({
     ))
   ))));
 }
+var DEFAULT_DETAIL_SECTIONS = {
+  signalBrief: true,
+  suggestedActions: true,
+  timeline: true
+};
+var DEFAULT_SIGNAL_SCORE = {
+  score: 65,
+  factors: [
+    { key: "trigger", label: "Trigger strength", score: 70, why: "Moderate signal detected based on account activity" },
+    { key: "fit", label: "Company fit", score: 65, why: "Reasonable fit based on company profile" },
+    { key: "timing", label: "Timing", score: 58, why: "Within general evaluation window" }
+  ],
+  whyNow: "Moderate signals detected that warrant review and potential outreach.",
+  evidence: [
+    "Activity patterns suggest potential opportunity",
+    "Company profile aligns with target segment"
+  ],
+  confidence: 72
+};
+function DetailView({
+  item,
+  sections,
+  getSignalScore,
+  buildSuggestedActions,
+  buildSourceItems,
+  getTimelineEvents,
+  accountContacts,
+  emailSignature,
+  iconMap,
+  onOpenEntityPanel,
+  onOpenRecentActivity
+}) {
+  const [evidenceExpanded, setEvidenceExpanded] = React52.useState(false);
+  const [showTimeline, setShowTimeline] = React52.useState(false);
+  const [extraActions, setExtraActions] = React52.useState([]);
+  React52.useEffect(() => {
+    setShowTimeline(false);
+    setEvidenceExpanded(false);
+    setExtraActions([]);
+  }, [item.id]);
+  const suggestedActions = React52.useMemo(
+    () => [...buildSuggestedActions(item), ...extraActions],
+    [buildSuggestedActions, item, extraActions]
+  );
+  const sourceItems = React52.useMemo(() => buildSourceItems(item), [buildSourceItems, item]);
+  const timelineEvents = React52.useMemo(
+    () => {
+      var _a;
+      return (_a = getTimelineEvents == null ? void 0 : getTimelineEvents(item)) != null ? _a : [];
+    },
+    [getTimelineEvents, item]
+  );
+  const handleDuplicate = React52.useCallback(
+    (id) => {
+      const base = suggestedActions.find((a) => a.id === id);
+      if (!base || base.type !== "email") return;
+      const clone = __spreadProps(__spreadValues({}, base), {
+        id: `${base.id}-dup-${Date.now()}`,
+        emailMeta: base.emailMeta ? __spreadProps(__spreadValues({}, base.emailMeta), { to: void 0 }) : void 0
+      });
+      setExtraActions((prev) => [...prev, clone]);
+    },
+    [suggestedActions]
+  );
+  return /* @__PURE__ */ React52.createElement(
+    SignalApproval.Root,
+    {
+      companyName: item.company,
+      opportunityUrl: `https://acme.lightning.force.com/lightning/r/Opportunity/006${item.id}/view`,
+      onApprove: () => {
+        console.log("Approved signal:", { taskId: item.id, company: item.company });
+      },
+      onApproveFeedback: (reasons, detail) => {
+        console.log("Approval feedback:", { taskId: item.id, company: item.company, reasons, detail });
+      },
+      onDismiss: (reasons, detail) => {
+        console.log("Dismissed signal:", { taskId: item.id, reasons, detail });
+      }
+    },
+    /* @__PURE__ */ React52.createElement("div", { className: "mx-auto w-full max-w-3xl p-6 pb-12 md:p-8" }, /* @__PURE__ */ React52.createElement("div", { className: "pb-8" }, /* @__PURE__ */ React52.createElement("div", { className: "mb-4 flex items-center gap-2" }, /* @__PURE__ */ React52.createElement(
+      "button",
+      {
+        type: "button",
+        className: "flex items-center gap-1.5 text-xs font-medium text-muted-foreground transition-colors hover:text-foreground"
+      },
+      /* @__PURE__ */ React52.createElement(ArrowLeft, { className: "h-3.5 w-3.5" }),
+      "Back"
+    ), /* @__PURE__ */ React52.createElement("span", { className: "text-muted-foreground/40" }, "\xB7"), /* @__PURE__ */ React52.createElement("span", { className: "text-xs text-muted-foreground" }, item.company)), /* @__PURE__ */ React52.createElement("h1", { className: "mb-3 text-2xl font-bold tracking-tight text-foreground" }, item.title), /* @__PURE__ */ React52.createElement("div", { className: "mb-6 flex flex-wrap items-center gap-2" }, item.statusColor === "red" && /* @__PURE__ */ React52.createElement("div", { className: "inline-flex items-center gap-1 rounded-md bg-red-50 px-2.5 py-1 text-xs font-semibold text-red-700" }, /* @__PURE__ */ React52.createElement("span", { className: "text-[10px] font-bold" }, "!"), " Urgent"), /* @__PURE__ */ React52.createElement("div", { className: "inline-flex items-center gap-1 rounded-md bg-muted px-2.5 py-1 text-xs font-medium text-muted-foreground" }, item.tag1), /* @__PURE__ */ React52.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: onOpenEntityPanel,
+        className: "ml-1 inline-flex items-center gap-1.5 rounded-md border border-border/60 bg-muted/30 px-2 py-1 transition-colors hover:bg-muted/50"
+      },
+      /* @__PURE__ */ React52.createElement("div", { className: "flex h-4 w-4 items-center justify-center rounded bg-muted-foreground/10 text-[9px] font-semibold text-muted-foreground" }, item.company.substring(0, 1)),
+      /* @__PURE__ */ React52.createElement("span", { className: "text-xs font-medium text-foreground" }, item.company),
+      /* @__PURE__ */ React52.createElement(ChevronRight, { className: "h-3 w-3 text-muted-foreground/50" })
+    )), sections.signalBrief && (() => {
+      const signalData = getSignalScore(item.company);
+      const pct = signalData.score;
+      const scoreColor = pct >= 70 ? "text-emerald-600" : pct >= 40 ? "text-amber-600" : "text-red-600";
+      const barColor = pct >= 70 ? "bg-emerald-500" : pct >= 40 ? "bg-amber-500" : "bg-red-500";
+      const scoreLabel = pct >= 70 ? "HIGH" : pct >= 40 ? "MEDIUM" : "LOW";
+      const evidenceWithCitations = sourceItems.length >= 4 ? [
+        /* @__PURE__ */ React52.createElement(React52.Fragment, null, "There are ", /* @__PURE__ */ React52.createElement("span", { className: "font-medium text-foreground" }, "3 unusual signals"), " including a large balance outflow and reduced login frequency", /* @__PURE__ */ React52.createElement(Citation, { number: 1, source: sourceItems[0] }), /* @__PURE__ */ React52.createElement(Citation, { number: 2, source: sourceItems[1] }), /* @__PURE__ */ React52.createElement(Citation, { number: 3, source: sourceItems[2] })),
+        /* @__PURE__ */ React52.createElement(React52.Fragment, null, "Scott mentioned in ", /* @__PURE__ */ React52.createElement("span", { className: "font-medium text-foreground" }, "#treasury-questions"), " that they are actively looking for treasury management options", /* @__PURE__ */ React52.createElement(Citation, { number: 4, source: sourceItems[2] })),
+        /* @__PURE__ */ React52.createElement(React52.Fragment, null, "You have a recent email thread regarding optimization options that hasn't been replied to", /* @__PURE__ */ React52.createElement(Citation, { number: 5, source: sourceItems[3] }))
+      ] : signalData.evidence.map((ev, i) => /* @__PURE__ */ React52.createElement("span", { key: i }, ev));
+      return /* @__PURE__ */ React52.createElement("div", { className: "mb-8" }, /* @__PURE__ */ React52.createElement("h3", { className: "text-xs font-bold text-muted-foreground uppercase tracking-wider mb-3" }, "Signal brief"), /* @__PURE__ */ React52.createElement("p", { className: "text-sm text-muted-foreground leading-relaxed mb-2" }, "We detected signals that suggest a potential opportunity with ", item.company, "."), /* @__PURE__ */ React52.createElement("p", { className: "text-sm text-foreground/90 leading-relaxed mb-4" }, signalData.whyNow), /* @__PURE__ */ React52.createElement("div", { className: "mb-5 rounded-md border border-border bg-muted/20 p-3" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-center justify-between mb-1.5" }, /* @__PURE__ */ React52.createElement("span", { className: "text-[10px] font-bold text-muted-foreground uppercase tracking-wider" }, "Signal Score"), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React52.createElement("span", { className: "text-sm font-bold text-foreground" }, signalData.score, "/100"), /* @__PURE__ */ React52.createElement("span", { className: `text-[10px] font-bold uppercase ${scoreColor}` }, scoreLabel))), /* @__PURE__ */ React52.createElement("div", { className: "h-1.5 bg-muted rounded-full overflow-hidden mb-2" }, /* @__PURE__ */ React52.createElement(
+        "div",
+        {
+          className: `h-full rounded-full transition-all duration-500 ${barColor}`,
+          style: { width: `${signalData.score}%` }
+        }
+      )), /* @__PURE__ */ React52.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: () => setEvidenceExpanded((prev) => !prev),
+          className: "flex items-center gap-1 text-[11px] font-medium text-muted-foreground hover:text-foreground transition-colors"
+        },
+        /* @__PURE__ */ React52.createElement(ChevronDown, { className: `h-3 w-3 transition-transform duration-200 ${evidenceExpanded ? "rotate-180" : ""}` }),
+        "View more"
+      ), evidenceExpanded && /* @__PURE__ */ React52.createElement("div", { className: "mt-3 space-y-3" }, /* @__PURE__ */ React52.createElement("ul", { className: "space-y-2" }, evidenceWithCitations.map((ev, index) => /* @__PURE__ */ React52.createElement("li", { key: index, className: "flex items-start gap-2 text-sm" }, /* @__PURE__ */ React52.createElement("div", { className: "w-1.5 h-1.5 bg-primary rounded-full mt-2 flex-shrink-0" }), /* @__PURE__ */ React52.createElement("span", { className: "text-muted-foreground leading-relaxed" }, ev)))), /* @__PURE__ */ React52.createElement(
+        ScoreBreakdown,
+        {
+          factors: signalData.factors,
+          onFactorFeedback: (key, type, detail) => console.log("Signal factor feedback:", { company: item.company, factor: key, type, detail })
+        }
+      ), /* @__PURE__ */ React52.createElement(SignalApproval.Actions, null))), !evidenceExpanded && /* @__PURE__ */ React52.createElement(SignalApproval.Actions, null));
+    })(), sections.timeline && timelineEvents.length > 0 && /* @__PURE__ */ React52.createElement("div", { className: "mb-8" }, /* @__PURE__ */ React52.createElement(
+      "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"
+      },
+      /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React52.createElement("h3", { className: "text-xs font-bold text-muted-foreground uppercase tracking-wider group-hover/timeline:text-foreground transition-colors" }, "Activity timeline"), !showTimeline && /* @__PURE__ */ React52.createElement("span", { className: "text-[11px] text-muted-foreground/60" }, "\xB7 Last activity 1d ago")),
+      /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-1.5" }, /* @__PURE__ */ React52.createElement("span", { className: "text-[11px] font-medium text-muted-foreground" }, timelineEvents.length, " events"), /* @__PURE__ */ React52.createElement(ChevronDown, { className: `h-3.5 w-3.5 text-muted-foreground transition-transform duration-200 ${showTimeline ? "rotate-180" : ""}` }))
+    ), showTimeline && /* @__PURE__ */ React52.createElement("div", { className: "mt-3" }, /* @__PURE__ */ React52.createElement(TimelineActivity, { events: timelineEvents })))), sections.suggestedActions && /* @__PURE__ */ React52.createElement(SignalApproval.Gate, null, /* @__PURE__ */ React52.createElement(
+      SuggestedActions,
+      {
+        actions: suggestedActions,
+        accountContacts,
+        signature: emailSignature,
+        iconMap,
+        onDismiss: (id) => console.log("Dismiss action:", id),
+        onSend: (id) => console.log("Send action:", id),
+        onSaveDraft: (id) => console.log("Save draft:", id),
+        onDuplicate: handleDuplicate,
+        onOpenAccountDetails: onOpenEntityPanel,
+        onOpenRecentActivity,
+        onMarkComplete: (id) => console.log("Mark complete:", id),
+        onDispatchAgent: (id) => console.log("Dispatch agent:", id)
+      }
+    )))
+  );
+}
+function PrototypeInboxView({
+  items,
+  filterCategories,
+  detailSections,
+  accountContacts = [],
+  emailSignature = "",
+  buildSuggestedActions: buildSuggestedActionsProp,
+  buildSourceItems: buildSourceItemsProp,
+  getSignalScore: getSignalScoreProp,
+  getTimelineEvents,
+  iconMap = {},
+  headerActions,
+  onOpenEntityPanel,
+  onOpenRecentActivity
+}) {
+  const [inboxViewMode, setInboxViewMode] = React52.useState("inbox");
+  const [previousViewMode, setPreviousViewMode] = React52.useState("inbox");
+  const [selectedTask, setSelectedTask] = React52.useState(items[0]);
+  const [inboxAssignee, setInboxAssignee] = React52.useState("me");
+  const [inboxFilters, setInboxFilters] = React52.useState({});
+  const sections = React52.useMemo(
+    () => __spreadValues(__spreadValues({}, DEFAULT_DETAIL_SECTIONS), detailSections),
+    [detailSections]
+  );
+  const resolvedFilterCategories = React52.useMemo(
+    () => filterCategories != null ? filterCategories : [
+      {
+        id: "category",
+        label: "Category",
+        icon: /* @__PURE__ */ React52.createElement(Tag, { className: "h-3.5 w-3.5 text-muted-foreground" }),
+        options: [...new Set(items.map((i) => i.tag1))]
+      },
+      {
+        id: "account",
+        label: "Account",
+        icon: /* @__PURE__ */ React52.createElement(Building, { className: "h-3.5 w-3.5 text-muted-foreground" }),
+        options: [...new Set(items.map((i) => i.company))]
+      }
+    ],
+    [filterCategories, items]
+  );
+  const buildSuggestedActions = React52.useMemo(
+    () => buildSuggestedActionsProp != null ? buildSuggestedActionsProp : (() => []),
+    [buildSuggestedActionsProp]
+  );
+  const buildSourceItems = React52.useMemo(
+    () => buildSourceItemsProp != null ? buildSourceItemsProp : (() => []),
+    [buildSourceItemsProp]
+  );
+  const getSignalScore = React52.useMemo(
+    () => getSignalScoreProp != null ? getSignalScoreProp : (() => DEFAULT_SIGNAL_SCORE),
+    [getSignalScoreProp]
+  );
+  const inboxGroups = React52.useMemo(() => {
+    const urgent = items.filter((i) => i.statusColor === "red");
+    const active = items.filter((i) => i.statusColor !== "red");
+    return [
+      { key: "urgent", label: "Urgent", items: urgent },
+      { key: "active", label: "Active", items: active }
+    ].filter((g) => g.items.length > 0);
+  }, [items]);
+  const renderInboxRow = React52.useCallback(
+    (item) => /* @__PURE__ */ React52.createElement(React52.Fragment, null, /* @__PURE__ */ React52.createElement("span", { className: `h-2 w-2 shrink-0 rounded-full ${item.statusColor === "red" ? "bg-[#f43f5e]" : "bg-[#3b82f6]"}` }), /* @__PURE__ */ React52.createElement("span", { className: "w-[80px] shrink-0 font-mono text-xs text-muted-foreground/80" }, item.id), /* @__PURE__ */ React52.createElement("span", { className: "shrink-0 rounded-md border border-border bg-muted px-1.5 py-0.5 text-[10px] font-medium text-muted-foreground whitespace-nowrap" }, item.tag1), /* @__PURE__ */ React52.createElement("span", { className: "min-w-0 flex-1 truncate text-sm font-semibold text-foreground" }, item.title), /* @__PURE__ */ React52.createElement("span", { className: "w-[120px] shrink-0 truncate text-xs font-medium text-foreground" }, item.company), /* @__PURE__ */ React52.createElement("span", { className: "w-[80px] shrink-0 text-right text-xs text-muted-foreground" }, item.time)),
+    []
+  );
+  const handleInboxItemSelect = React52.useCallback(
+    (item) => {
+      setSelectedTask(item);
+      if (inboxViewMode === "list") {
+        setPreviousViewMode("list");
+        setInboxViewMode("detail");
+      }
+    },
+    [inboxViewMode]
+  );
+  const handleBackFromDetail = React52.useCallback(() => {
+    setInboxViewMode(previousViewMode);
+  }, [previousViewMode]);
+  const handleViewModeChange = React52.useCallback((id) => {
+    const mode = id;
+    if (mode !== "detail") {
+      setPreviousViewMode(mode);
+    }
+    setInboxViewMode(mode);
+  }, []);
+  React52.useEffect(() => {
+    const mql = window.matchMedia("(max-width: 768px)");
+    function handleChange(e) {
+      if (e.matches && inboxViewMode === "inbox") {
+        setPreviousViewMode("inbox");
+        setInboxViewMode("detail");
+      }
+    }
+    handleChange(mql);
+    mql.addEventListener("change", handleChange);
+    return () => mql.removeEventListener("change", handleChange);
+  }, [inboxViewMode]);
+  const detailViewProps = {
+    item: selectedTask,
+    sections,
+    getSignalScore,
+    buildSuggestedActions,
+    buildSourceItems,
+    getTimelineEvents,
+    accountContacts,
+    emailSignature,
+    iconMap,
+    onOpenEntityPanel,
+    onOpenRecentActivity
+  };
+  return /* @__PURE__ */ React52.createElement("div", { className: "flex h-full w-full flex-col" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-center justify-between border-b border-border bg-background px-4 py-3 shrink-0" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-3" }, inboxViewMode === "detail" ? /* @__PURE__ */ React52.createElement(
+    "button",
+    {
+      type: "button",
+      onClick: handleBackFromDetail,
+      className: "flex items-center gap-2 text-sm font-medium text-muted-foreground hover:text-foreground transition-colors"
+    },
+    /* @__PURE__ */ React52.createElement(ArrowLeft, { className: "h-4 w-4" }),
+    "Back"
+  ) : null, /* @__PURE__ */ React52.createElement("h2", { className: "text-lg font-semibold text-foreground" }, "Inbox"), /* @__PURE__ */ React52.createElement(Badge, { variant: "secondary", className: "bg-muted text-muted-foreground hover:bg-muted font-medium text-[11px] px-2 py-0.5 rounded-md" }, items.length)), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React52.createElement(
+    ViewModeToggle,
+    {
+      modes: [
+        { id: "inbox", icon: /* @__PURE__ */ React52.createElement(Columns2, { className: "h-3.5 w-3.5" }), label: "Split View" },
+        { id: "list", icon: /* @__PURE__ */ React52.createElement(LayoutList, { className: "h-3.5 w-3.5" }), label: "List View" },
+        { id: "detail", icon: /* @__PURE__ */ React52.createElement(Square, { className: "h-3.5 w-3.5" }), label: "Detail View" }
+      ],
+      activeMode: inboxViewMode,
+      onModeChange: handleViewModeChange
+    }
+  ), headerActions)), inboxViewMode === "detail" ? /* @__PURE__ */ React52.createElement("div", { className: "flex h-full flex-1 flex-col overflow-hidden bg-background" }, /* @__PURE__ */ React52.createElement("div", { className: "flex-1 overflow-y-auto" }, /* @__PURE__ */ React52.createElement(DetailView, __spreadValues({}, detailViewProps)))) : inboxViewMode === "list" ? /* @__PURE__ */ React52.createElement("div", { className: "flex-1 overflow-y-auto bg-background" }, /* @__PURE__ */ React52.createElement(
+    InboxToolbar,
+    {
+      assignee: inboxAssignee,
+      onAssigneeChange: setInboxAssignee,
+      filterCategories: resolvedFilterCategories,
+      selectedFilters: inboxFilters,
+      onFilterChange: (catId, val) => setInboxFilters((prev) => __spreadProps(__spreadValues({}, prev), { [catId]: val })),
+      onClearFilters: () => setInboxFilters({})
+    }
+  ), /* @__PURE__ */ React52.createElement(
+    GroupedListView,
+    {
+      groups: inboxGroups,
+      renderRow: renderInboxRow,
+      getItemKey: (item) => item.id,
+      selectedKey: selectedTask.id,
+      onItemClick: handleInboxItemSelect,
+      emptyMessage: "No inbox items"
+    }
+  )) : (
+    /* Split view */
+    /* @__PURE__ */ React52.createElement("div", { className: "flex h-full min-h-0 w-full flex-1" }, /* @__PURE__ */ React52.createElement("div", { className: "flex h-full min-w-[380px] w-[380px] flex-col border-r border-border bg-background shadow-sm z-10" }, /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col gap-4 border-b border-border p-4 shrink-0" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-1" }, /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "icon", className: "h-8 w-8 text-muted-foreground" }, /* @__PURE__ */ React52.createElement(Eye, { className: "w-4 h-4" })), /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "icon", className: "h-8 w-8 text-muted-foreground" }, /* @__PURE__ */ React52.createElement(FileText, { className: "w-4 h-4" })), /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "icon", className: "h-8 w-8 text-muted-foreground" }, /* @__PURE__ */ React52.createElement(Clock, { className: "w-4 h-4" })), /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "icon", className: "h-8 w-8 text-muted-foreground" }, /* @__PURE__ */ React52.createElement(CheckSquare, { className: "w-4 h-4" }))), /* @__PURE__ */ React52.createElement(Button, { size: "sm", className: "h-8 px-4 bg-foreground text-background hover:bg-foreground/90 text-xs font-semibold gap-1.5 rounded-md" }, /* @__PURE__ */ React52.createElement(Plus, { className: "w-4 h-4" }), " Add Task")), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React52.createElement("div", { className: "relative flex-1" }, /* @__PURE__ */ React52.createElement(Filter, { className: "absolute left-2.5 top-1.5 w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ React52.createElement(Input, { className: "h-8 pl-8 text-xs bg-background border-border rounded-md shadow-none", placeholder: "Categories" })), /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "sm", className: "h-8 text-xs font-medium rounded-md shadow-none" }, /* @__PURE__ */ React52.createElement(Building, { className: "w-3.5 h-3.5 mr-1.5" }), " Accounts")), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-1.5 overflow-x-auto pb-1 mt-1 scrollbar-hide" }, /* @__PURE__ */ React52.createElement(Button, { size: "sm", className: "h-7 rounded-full px-3.5 text-[11px] font-semibold bg-foreground text-background hover:bg-foreground/90 shadow-none" }, "All"), /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "sm", className: "h-7 rounded-full px-3.5 text-[11px] font-medium bg-transparent border-border text-muted-foreground hover:text-foreground shadow-none" }, "Outbound (10)"), /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "sm", className: "h-7 rounded-full px-3.5 text-[11px] font-medium bg-transparent border-border text-muted-foreground hover:text-foreground shadow-none" }, "Retention (12)"), /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "sm", className: "h-7 rounded-full px-3.5 text-[11px] font-medium bg-transparent border-border text-muted-foreground hover:text-foreground shadow-none" }, "Relationship (9)"))), /* @__PURE__ */ React52.createElement("div", { className: "flex-1 overflow-y-auto" }, items.map((item) => /* @__PURE__ */ React52.createElement(
+      "div",
+      {
+        key: item.id,
+        onClick: () => setSelectedTask(item),
+        className: `cursor-pointer border-b border-border p-4 transition-colors group relative border-l-2 ${selectedTask.id === item.id ? "bg-muted/30 border-l-brand-purple" : "bg-transparent border-l-transparent hover:bg-muted/10"}`
+      },
+      /* @__PURE__ */ React52.createElement("div", { className: "mb-1.5 flex items-center gap-2" }, /* @__PURE__ */ React52.createElement("span", { className: "min-w-0 truncate text-[13px] font-semibold text-foreground leading-tight" }, item.title), selectedTask.id !== item.id && item.tag1 && /* @__PURE__ */ React52.createElement("span", { className: "shrink-0 rounded-md border border-border bg-muted/60 px-2 py-0.5 text-[10px] font-medium text-muted-foreground" }, item.tag1), /* @__PURE__ */ React52.createElement("span", { className: "ml-auto shrink-0 text-[10px] font-medium text-muted-foreground/80" }, item.time)),
+      /* @__PURE__ */ React52.createElement("div", { className: "flex items-start gap-2 mt-2" }, /* @__PURE__ */ React52.createElement("span", { className: `w-1.5 h-1.5 rounded-full shrink-0 mt-1.5 ${item.statusColor === "red" ? "bg-[#f43f5e]" : "bg-[#3b82f6]"}` }), /* @__PURE__ */ React52.createElement("span", { className: "text-xs text-muted-foreground leading-tight" }, item.details)),
+      /* @__PURE__ */ React52.createElement("div", { className: `absolute right-4 bottom-4 flex items-center gap-1.5 bg-background shadow-sm rounded-md px-1 py-0.5 border border-border ${selectedTask.id === item.id ? "opacity-100" : "opacity-0 group-hover:opacity-100 transition-opacity"}` }, /* @__PURE__ */ React52.createElement(Button, { variant: "ghost", size: "icon", className: "h-6 w-6 rounded text-muted-foreground hover:text-foreground" }, /* @__PURE__ */ React52.createElement(CheckSquare, { className: "w-3.5 h-3.5" })), /* @__PURE__ */ React52.createElement(Button, { variant: "ghost", size: "icon", className: "h-6 w-6 rounded text-muted-foreground hover:text-foreground" }, /* @__PURE__ */ React52.createElement(Clock, { className: "w-3.5 h-3.5" })))
+    )), /* @__PURE__ */ React52.createElement("div", { className: "p-4" }, /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "sm", className: "h-8 text-xs font-semibold rounded-md shadow-none" }, "See more")))), /* @__PURE__ */ React52.createElement("div", { className: "flex h-full flex-1 flex-col overflow-hidden bg-background" }, /* @__PURE__ */ React52.createElement("div", { className: "flex-1 overflow-y-auto" }, /* @__PURE__ */ React52.createElement(DetailView, __spreadValues({}, detailViewProps)))))
+  ));
+}
+var DEFAULT_METRICS = [
+  {
+    title: "Referrals at Risk",
+    value: 28,
+    change: { value: "2 vs last week", direction: "up", isGood: false },
+    showExternalLink: true,
+    showInfo: true,
+    dataPoints: [
+      { label: "No Contact", value: 6, color: "#166534" },
+      { label: "Stalled", value: 4, color: "#22c55e" },
+      { label: "Needs Attn", value: 8, color: "#6ee7b7" },
+      { label: "Auth Delay", value: 5, color: "#ccfbf1" },
+      { label: "DCS Hold", value: 3, color: "#99f6e4" },
+      { label: "Expired Referral", value: 2, color: "#f1f5f9" }
+    ]
+  },
+  {
+    title: "Dropped from Pipeline",
+    value: 47,
+    change: { value: "12 vs last week", direction: "down", isGood: true },
+    showExternalLink: true,
+    showInfo: true,
+    dataPoints: [
+      { label: "No Contact", value: 12, color: "#166534" },
+      { label: "Ins. Denied", value: 15, color: "#22c55e" },
+      { label: "Refused", value: 6, color: "#6ee7b7" },
+      { label: "Intake Stalled", value: 8, color: "#ccfbf1" },
+      { label: "Other", value: 6, color: "#f1f5f9" }
+    ]
+  },
+  {
+    title: "Time to Schedule",
+    value: "4.2 days",
+    subtitle: "median, referrals \u2192 scheduled",
+    change: { value: "0.8d vs last week", direction: "down", isGood: true },
+    footerText: "Slowest stage: Contact \u2192 Intake (1.5d)",
+    showInfo: true
+  },
+  {
+    title: "Conversion Rate",
+    value: "53%",
+    subtitle: "referrals \u2192 scheduled",
+    change: { value: "3% vs last week", direction: "up", isGood: true },
+    footerText: "Largest drop-off: No Contact (22%)",
+    showInfo: true
+  }
+];
+var DEFAULT_EXPANDED_METRICS = [
+  {
+    title: "Avg Handle Time",
+    value: "1.2",
+    unit: "days",
+    change: { value: "0.3d vs last week", direction: "down", isGood: true },
+    footerText: "Fastest stage: Verification (0.2d)",
+    showInfo: true
+  },
+  {
+    title: "Conversion Rate",
+    value: "78%",
+    change: { value: "2% vs last week", direction: "up", isGood: true },
+    footerText: "Top source: Internal Referrals (85%)",
+    showInfo: true
+  },
+  {
+    title: "Pending Intakes",
+    value: "124",
+    change: { value: "15 vs last week", direction: "up", isGood: false },
+    footerText: "Requires immediate attention: 32",
+    showInfo: true
+  },
+  {
+    title: "Patient Satisfaction",
+    value: "4.8",
+    unit: "/ 5",
+    change: { value: "0.1 vs last month", direction: "up", isGood: true },
+    footerText: "Based on 450 recent surveys",
+    showInfo: true
+  }
+];
+function PrototypeInsightsView({
+  tabs,
+  coaching,
+  metrics,
+  expandedMetrics,
+  dashboardCards,
+  analytics,
+  assistantName,
+  headerActions,
+  onNavigateToInbox
+}) {
+  var _a, _b, _c, _d, _e, _f;
+  const showOverview = (tabs == null ? void 0 : tabs.overview) !== false;
+  const showAnalytics = (tabs == null ? void 0 : tabs.analytics) !== false;
+  const [insightsTab, setInsightsTab] = React52.useState(
+    showOverview ? "overview" : "analytics"
+  );
+  const [showAllMetrics, setShowAllMetrics] = React52.useState(false);
+  const [showCoaching, setShowCoaching] = React52.useState((coaching == null ? void 0 : coaching.enabled) !== false);
+  const resolvedMetrics = metrics != null ? metrics : DEFAULT_METRICS;
+  const resolvedExpandedMetrics = expandedMetrics != null ? expandedMetrics : DEFAULT_EXPANDED_METRICS;
+  const cards = {
+    topTasks: (dashboardCards == null ? void 0 : dashboardCards.topTasks) !== false,
+    upcomingMeetings: (dashboardCards == null ? void 0 : dashboardCards.upcomingMeetings) !== false,
+    recentlyCompleted: (dashboardCards == null ? void 0 : dashboardCards.recentlyCompleted) !== false,
+    checkIns: (dashboardCards == null ? void 0 : dashboardCards.checkIns) !== false
+  };
+  return /* @__PURE__ */ React52.createElement("div", { className: "mx-auto max-w-7xl space-y-8 p-6 md:p-8" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React52.createElement("div", null, /* @__PURE__ */ React52.createElement("h2", { className: "mb-1 text-xl font-bold tracking-tight text-foreground" }, "Insights & Overview"), /* @__PURE__ */ React52.createElement("p", { className: "text-sm text-muted-foreground" }, "Monitor your key performance indicators and daily tasks.")), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-3" }, assistantName && /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "sm", className: "h-8 gap-2 text-xs font-semibold rounded-full px-4 border-foreground text-foreground hover:bg-muted/50" }, /* @__PURE__ */ React52.createElement(MessageCircle, { className: "w-3.5 h-3.5" }), "Talk to ", assistantName), headerActions)), showOverview && showAnalytics && /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-1 border-b border-border" }, /* @__PURE__ */ React52.createElement(
+    "button",
+    {
+      type: "button",
+      onClick: () => setInsightsTab("overview"),
+      className: `relative px-4 py-2 text-sm font-medium transition-colors ${insightsTab === "overview" ? "text-foreground" : "text-muted-foreground hover:text-foreground"}`
+    },
+    /* @__PURE__ */ React52.createElement("span", { className: "flex items-center gap-2" }, /* @__PURE__ */ React52.createElement(BarChart2, { className: "h-3.5 w-3.5" }), "Overview"),
+    insightsTab === "overview" && /* @__PURE__ */ React52.createElement("span", { className: "absolute bottom-0 left-0 right-0 h-0.5 bg-foreground rounded-full" })
+  ), /* @__PURE__ */ React52.createElement(
+    "button",
+    {
+      type: "button",
+      onClick: () => setInsightsTab("analytics"),
+      className: `relative px-4 py-2 text-sm font-medium transition-colors ${insightsTab === "analytics" ? "text-foreground" : "text-muted-foreground hover:text-foreground"}`
+    },
+    /* @__PURE__ */ React52.createElement("span", { className: "flex items-center gap-2" }, /* @__PURE__ */ React52.createElement(TrendingUp, { className: "h-3.5 w-3.5" }), "Analytics"),
+    insightsTab === "analytics" && /* @__PURE__ */ React52.createElement("span", { className: "absolute bottom-0 left-0 right-0 h-0.5 bg-foreground rounded-full" })
+  )), insightsTab === "overview" && showOverview && /* @__PURE__ */ React52.createElement(React52.Fragment, null, showCoaching && /* @__PURE__ */ React52.createElement("div", { className: "border border-border rounded-xl p-6 relative bg-card shadow-sm" }, /* @__PURE__ */ React52.createElement(
+    Button,
+    {
+      variant: "ghost",
+      size: "icon",
+      className: "absolute top-4 right-4 h-6 w-6 text-muted-foreground hover:text-foreground",
+      onClick: () => setShowCoaching(false)
+    },
+    /* @__PURE__ */ React52.createElement(X, { className: "w-4 h-4" })
+  ), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-2 mb-2" }, /* @__PURE__ */ React52.createElement("h3", { className: "font-bold text-foreground text-sm" }, "Daily Coaching Insight")), /* @__PURE__ */ React52.createElement("p", { className: "text-sm text-muted-foreground leading-relaxed mb-4 max-w-4xl" }, "We analyze your pipeline activity, recent communications, and account health to provide personalized recommendations for your day."), /* @__PURE__ */ React52.createElement("div", { className: "bg-brand-purple/10 rounded-lg p-5 text-[13px] text-foreground font-medium italic border border-brand-purple/20 relative" }, /* @__PURE__ */ React52.createElement("div", { className: "absolute top-0 left-0 w-1 h-full bg-brand-purple rounded-l-lg" }), (_a = coaching == null ? void 0 : coaching.message) != null ? _a : "\u201CGreat job catching the churn risk on Lunchclub yesterday. Today, focus on pushing the stalled intake pipeline. Try making 2 more touches on accounts that have gone dark this week.\u201D"), /* @__PURE__ */ React52.createElement("div", { className: "mt-4 flex items-center gap-2" }, /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "sm", className: "h-7 text-xs text-muted-foreground hover:text-foreground shadow-none" }, /* @__PURE__ */ React52.createElement(ThumbsUp, { className: "w-3.5 h-3.5 mr-1.5" }), " Helpful"), /* @__PURE__ */ React52.createElement(Button, { variant: "outline", size: "sm", className: "h-7 text-xs text-muted-foreground hover:text-foreground shadow-none" }, /* @__PURE__ */ React52.createElement(ThumbsDown, { className: "w-3.5 h-3.5 mr-1.5" }), " Not Helpful"), /* @__PURE__ */ React52.createElement("div", { className: "relative max-w-sm ml-2 flex-1" }, /* @__PURE__ */ React52.createElement(Input, { placeholder: "Provide additional feedback...", className: "h-7 text-xs shadow-none border-border bg-muted/20 w-full" })))), /* @__PURE__ */ React52.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React52.createElement("h3", { className: "text-sm font-semibold text-foreground uppercase tracking-wider" }, "Key Metrics"), resolvedExpandedMetrics.length > 0 && /* @__PURE__ */ React52.createElement(
+    Button,
+    {
+      variant: "ghost",
+      size: "sm",
+      className: "text-xs text-muted-foreground hover:text-foreground",
+      onClick: () => setShowAllMetrics(!showAllMetrics)
+    },
+    showAllMetrics ? "Hide additional metrics" : "Show more metrics"
+  )), /* @__PURE__ */ React52.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4" }, resolvedMetrics.map((m, i) => /* @__PURE__ */ React52.createElement(MetricCard, __spreadValues({ key: i }, m))), showAllMetrics && resolvedExpandedMetrics.map((m, i) => /* @__PURE__ */ React52.createElement(MetricCard, __spreadValues({ key: `exp-${i}` }, m))))), /* @__PURE__ */ React52.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-3 gap-6 mt-8" }, /* @__PURE__ */ React52.createElement("div", { className: "lg:col-span-2 space-y-6" }, cards.topTasks && /* @__PURE__ */ React52.createElement(TopTasksCard, { onViewAll: onNavigateToInbox }), /* @__PURE__ */ React52.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6" }, cards.upcomingMeetings && /* @__PURE__ */ React52.createElement(UpcomingMeetingsCard, null), cards.recentlyCompleted && /* @__PURE__ */ React52.createElement(RecentlyCompletedCard, null))), /* @__PURE__ */ React52.createElement("div", { className: "space-y-6" }, cards.checkIns && /* @__PURE__ */ React52.createElement(CheckInsCard, null)))), insightsTab === "analytics" && showAnalytics && /* @__PURE__ */ React52.createElement("div", { className: "space-y-6" }, (analytics == null ? void 0 : analytics.pipeline) && /* @__PURE__ */ React52.createElement(
+    PipelineOverview,
+    {
+      stages: analytics.pipeline.stages,
+      stageMetrics: analytics.pipeline.stageMetrics,
+      stageTimings: analytics.pipeline.stageTimings,
+      filterBreakdowns: analytics.pipeline.filterBreakdowns
+    }
+  ), (analytics == null ? void 0 : analytics.volumeChart) && /* @__PURE__ */ React52.createElement(
+    ReportCard,
+    {
+      title: "Volume Analysis",
+      subtitle: "Referral volume broken down by facility over time",
+      filterOptions: analytics.volumeChart.filterOptions,
+      selectedFilter: (_c = (_b = analytics.volumeChart.filterOptions) == null ? void 0 : _b[0]) == null ? void 0 : _c.value
+    },
+    /* @__PURE__ */ React52.createElement(
+      VolumeAnalysisChart,
+      {
+        data: analytics.volumeChart.data,
+        dataKeys: analytics.volumeChart.dataKeys
+      }
+    )
+  ), /* @__PURE__ */ React52.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6" }, (analytics == null ? void 0 : analytics.donutChart) && /* @__PURE__ */ React52.createElement(ReportCard, { title: "Risk Breakdown", subtitle: "Referrals at risk by category" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-center justify-center" }, /* @__PURE__ */ React52.createElement(
+    DonutChart,
+    {
+      data: analytics.donutChart.data,
+      centerLabel: analytics.donutChart.centerLabel,
+      showLegend: true
+    }
+  ))), (analytics == null ? void 0 : analytics.trendChart) && /* @__PURE__ */ React52.createElement(
+    ReportCard,
+    {
+      title: "Referrals Over Time",
+      subtitle: "Weekly appointment trends",
+      toggleOptions: analytics.trendChart.toggleOptions,
+      selectedToggle: (_d = analytics.trendChart.toggleOptions) == null ? void 0 : _d[0]
+    },
+    /* @__PURE__ */ React52.createElement(
+      TrendAreaChart,
+      {
+        data: analytics.trendChart.data,
+        series: analytics.trendChart.series,
+        xAxisKey: (_e = analytics.trendChart.xAxisKey) != null ? _e : "name",
+        height: (_f = analytics.trendChart.height) != null ? _f : 220
+      }
+    )
+  )), ((analytics == null ? void 0 : analytics.barChart) || (analytics == null ? void 0 : analytics.barList)) && /* @__PURE__ */ React52.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-3 gap-6" }, (analytics == null ? void 0 : analytics.barChart) && /* @__PURE__ */ React52.createElement(
+    ReportCard,
+    {
+      title: "Outreach Activity",
+      subtitle: "Daily outreach by channel",
+      className: "lg:col-span-2"
+    },
+    /* @__PURE__ */ React52.createElement(
+      BarChartComponent,
+      {
+        data: analytics.barChart.data,
+        bars: analytics.barChart.bars
+      }
+    )
+  ), (analytics == null ? void 0 : analytics.barList) && /* @__PURE__ */ React52.createElement(ReportCard, { title: "Top Activity Types", subtitle: "By completion percentage" }, /* @__PURE__ */ React52.createElement(
+    StyledBarList,
+    {
+      data: analytics.barList.data,
+      valueFormatter: analytics.barList.valueFormatter
+    }
+  )))));
+}
+var DEFAULT_FILTER_TABS = [
+  { label: "All Accounts", count: 6, variant: "default" },
+  { label: "Needs Attention", count: 11, variant: "attention" },
+  { label: "Recent", count: 7, variant: "ghost" }
+];
+function PrototypeAccountsView({
+  filterTabs,
+  headerActions,
+  onRowClick
+}) {
+  const tabs = filterTabs != null ? filterTabs : DEFAULT_FILTER_TABS;
+  return /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col h-full w-full bg-background relative" }, headerActions && /* @__PURE__ */ React52.createElement("div", { className: "absolute top-4 right-4 z-10" }, headerActions), /* @__PURE__ */ React52.createElement("div", { className: "px-4 py-3 border-b border-border flex items-center gap-2 overflow-x-auto shrink-0 mt-2" }, tabs.map((tab, i) => {
+    if (tab.variant === "attention") {
+      return /* @__PURE__ */ React52.createElement(Button, { key: i, size: "sm", className: "h-7 text-xs rounded-md bg-emerald-600 hover:bg-emerald-700 text-white font-medium" }, tab.label, tab.count != null && /* @__PURE__ */ React52.createElement(Badge, { variant: "secondary", className: "ml-2 h-4 px-1.5 text-[10px] bg-white/20 text-white border-transparent" }, tab.count));
+    }
+    if (tab.variant === "ghost") {
+      return /* @__PURE__ */ React52.createElement(Button, { key: i, variant: "ghost", size: "sm", className: "h-7 text-xs rounded-md border border-border bg-transparent font-medium" }, tab.label, tab.count != null && /* @__PURE__ */ React52.createElement(Badge, { variant: "secondary", className: "ml-2 h-4 px-1.5 text-[10px]" }, tab.count));
+    }
+    return /* @__PURE__ */ React52.createElement(Button, { key: i, variant: "secondary", size: "sm", className: "h-7 text-xs rounded-md bg-muted font-medium" }, tab.label, tab.count != null && /* @__PURE__ */ React52.createElement(Badge, { variant: "outline", className: "ml-2 h-4 px-1.5 text-[10px]" }, tab.count));
+  })), /* @__PURE__ */ React52.createElement("div", { className: "flex-1 overflow-auto" }, /* @__PURE__ */ React52.createElement(DataTable, { onRowClick })));
+}
+function PrototypeWorkQueueView({
+  headerActions
+}) {
+  return /* @__PURE__ */ React52.createElement("div", { className: "relative flex h-full w-full flex-col bg-background" }, headerActions && /* @__PURE__ */ React52.createElement("div", { className: "absolute top-4 right-4 z-10" }, headerActions), /* @__PURE__ */ React52.createElement("div", { className: "flex-1 overflow-auto" }, /* @__PURE__ */ React52.createElement(ItemList, null)));
+}
+
+// registry/new-york/ui/prototype-shell.tsx
+var VIEW_KEY_MAP = {
+  inbox: "inbox",
+  dashboard: "insights",
+  insights: "insights",
+  accounts: "accounts",
+  activity: "workQueue",
+  workQueue: "workQueue",
+  "work-queue": "workQueue"
+};
+var DEFAULT_ENTITY_SECTIONS = [
+  { type: "details" },
+  { type: "contacts" },
+  { type: "recentActivity" },
+  { type: "connectedApps" },
+  { type: "systemActivity" }
+];
+function PrototypeShell({
+  config,
+  headerActions,
+  entityPanelChildren,
+  onNavigate
+}) {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const [currentView, setCurrentView] = React52.useState(config.defaultView);
+  const [isEntityPanelOpen, setIsEntityPanelOpen] = React52.useState(false);
+  const navigableViews = React52.useMemo(() => {
+    if (config.navigableViews) return config.navigableViews;
+    const keys = [];
+    if (config.views.inbox) keys.push("inbox");
+    if (config.views.accounts) keys.push("accounts");
+    if (config.views.workQueue) keys.push("activity", "workQueue", "work-queue");
+    if (config.views.insights) keys.push("dashboard", "insights");
+    return keys;
+  }, [config.navigableViews, config.views]);
+  const handleNavigate = React52.useCallback(
+    (id) => {
+      if (navigableViews.includes(id)) {
+        setCurrentView(id);
+      }
+      onNavigate == null ? void 0 : onNavigate(id);
+    },
+    [navigableViews, onNavigate]
+  );
+  const handleOpenEntityPanel = React52.useCallback(() => setIsEntityPanelOpen(true), []);
+  const handleOpenRecentActivity = React52.useCallback(() => {
+    setIsEntityPanelOpen(true);
+    setTimeout(() => {
+      var _a2;
+      (_a2 = document.getElementById("entity-recent-activity")) == null ? void 0 : _a2.scrollIntoView({ behavior: "smooth", block: "start" });
+    }, 150);
+  }, []);
+  const resolvedViewKey = (_a = VIEW_KEY_MAP[currentView]) != null ? _a : currentView;
+  const entitySections = (_c = (_b = config.entityPanel) == null ? void 0 : _b.sections) != null ? _c : DEFAULT_ENTITY_SECTIONS;
+  const entityIcons = (_e = (_d = config.entityPanel) == null ? void 0 : _d.icons) != null ? _e : {};
+  return /* @__PURE__ */ React52.createElement("div", { className: "flex h-screen w-full overflow-hidden bg-background font-sans" }, /* @__PURE__ */ React52.createElement(
+    QuickActionSidebarNav,
+    {
+      className: "z-20 h-screen shrink-0",
+      navSections: config.sidebar,
+      activeItemId: currentView,
+      onNavigate: handleNavigate,
+      onCreateTask: (draft) => {
+        console.log("Quick action created:", draft);
+      }
+    }
+  ), /* @__PURE__ */ React52.createElement("main", { className: "flex min-w-0 flex-1 flex-col overflow-hidden bg-background" }, /* @__PURE__ */ React52.createElement("div", { className: "relative h-full flex-1 overflow-auto" }, resolvedViewKey === "insights" && config.views.insights ? /* @__PURE__ */ React52.createElement(
+    PrototypeInsightsView,
+    __spreadProps(__spreadValues({}, config.views.insights), {
+      assistantName: (_f = config.brand) == null ? void 0 : _f.assistantName,
+      headerActions,
+      onNavigateToInbox: () => setCurrentView("inbox")
+    })
+  ) : resolvedViewKey === "inbox" && config.views.inbox ? /* @__PURE__ */ React52.createElement(
+    PrototypeInboxView,
+    __spreadProps(__spreadValues({}, config.views.inbox), {
+      headerActions,
+      onOpenEntityPanel: handleOpenEntityPanel,
+      onOpenRecentActivity: handleOpenRecentActivity
+    })
+  ) : resolvedViewKey === "accounts" && config.views.accounts ? /* @__PURE__ */ React52.createElement(
+    PrototypeAccountsView,
+    __spreadProps(__spreadValues({}, config.views.accounts), {
+      headerActions,
+      onRowClick: handleOpenEntityPanel
+    })
+  ) : resolvedViewKey === "workQueue" && config.views.workQueue ? /* @__PURE__ */ React52.createElement(
+    PrototypeWorkQueueView,
+    {
+      headerActions
+    }
+  ) : null)), /* @__PURE__ */ React52.createElement(EntityPanel, { isOpen: isEntityPanelOpen, onClose: setIsEntityPanelOpen }, (_g = typeof entityPanelChildren === "function" ? entityPanelChildren({ onClose: () => setIsEntityPanelOpen(false) }) : entityPanelChildren) != null ? _g : /* @__PURE__ */ React52.createElement(React52.Fragment, null, entitySections.map((section, i) => {
+    var _a2, _b2;
+    switch (section.type) {
+      case "details":
+        return /* @__PURE__ */ React52.createElement(EntityDetails, { key: i, onClose: () => setIsEntityPanelOpen(false) });
+      case "contacts":
+        return /* @__PURE__ */ React52.createElement(
+          PotentialContacts,
+          {
+            key: i,
+            icons: {
+              linkedin: entityIcons.linkedin,
+              gmail: entityIcons.gmail
+            }
+          }
+        );
+      case "recentActivity":
+        return /* @__PURE__ */ React52.createElement(
+          RecentActivity,
+          {
+            key: i,
+            items: (_b2 = (_a2 = section.props) == null ? void 0 : _a2.items) != null ? _b2 : []
+          }
+        );
+      case "connectedApps":
+        return /* @__PURE__ */ React52.createElement(
+          ConnectedApps,
+          {
+            key: i,
+            icons: {
+              slack: entityIcons.slack,
+              gdoc: entityIcons.gdoc
+            }
+          }
+        );
+      case "systemActivity":
+        return /* @__PURE__ */ React52.createElement(SystemActivity, { key: i });
+      default:
+        return null;
+    }
+  }))));
+}
 
-export { ActivityDetail, ActivityLog, ActivityRow, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, BarChartComponent, Button, CHART_CURSOR_STYLE, CHART_TOOLTIP_STYLE, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, CheckInsCard, Citation, ConnectedApps, ContactList, DataTable, DataTableDisplay, DataTableFilter, DataTableQuickViews, DataTableToolbar, DetailViewHeader, DetailViewSummary, DetailViewThread, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DonutChart, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EntityActivityItem, EntityDetails, EntityMetadataGrid, EntityPanel, EntityPanelHeader, EntityPanelTabs, EntitySection, GroupedListView, InboxGroupHeader, InboxRow, InboxToolbar, Input, ItemList, ItemListDisplay, ItemListFilter, ItemListToolbar, Label2 as Label, MetricCard, PerformanceMetricsTable, PipelineOverview, PotentialContacts, PreviewList, PreviewListItem, Progress, QuickActionChatArea, QuickActionModal, QuickActionSidebarNav, RecentActivity, RecentlyCompletedCard, RecommendedActionsSection, ReportCard, SankeyChart, ScoreAnalysisModal, ScoreAnalysisPanel, ScoreBreakdown, ScoreFeedback, ScoreRing, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SignalApproval, Actions as SignalApprovalActions, Gate as SignalApprovalGate, Root as SignalApprovalRoot, SimpleChartTooltip, Skeleton, SourceList, StyledBarList, SuggestedActions, SystemActivity, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThreadMessage, TimelineActivity, Tooltip4 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopLineMetrics, TopTasksCard, TrendAreaChart, UpcomingMeetingsCard, ViewModeToggle, VolumeAnalysisChart, badgeVariants, buttonVariants, cn, getScoreColor, tabsListVariants, useIsMobile, useScoreFeedback, useSidebar, useSignalApproval };
+export { ActivityDetail, ActivityLog, ActivityRow, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, BarChartComponent, Button, CHART_CURSOR_STYLE, CHART_TOOLTIP_STYLE, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, CheckInsCard, Citation, ConnectedApps, ContactList, DataTable, DataTableDisplay, DataTableFilter, DataTableQuickViews, DataTableToolbar, DetailViewHeader, DetailViewSummary, DetailViewThread, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DonutChart, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EntityActivityItem, EntityDetails, EntityMetadataGrid, EntityPanel, EntityPanelHeader, EntityPanelTabs, EntitySection, GroupedListView, InboxGroupHeader, InboxRow, InboxToolbar, Input, ItemList, ItemListDisplay, ItemListFilter, ItemListToolbar, Label2 as Label, MetricCard, PerformanceMetricsTable, PipelineOverview, PotentialContacts, PreviewList, PreviewListItem, Progress, PrototypeAccountsView, PrototypeInboxView, PrototypeInsightsView, PrototypeShell, PrototypeWorkQueueView, QuickActionChatArea, QuickActionModal, QuickActionSidebarNav, RecentActivity, RecentlyCompletedCard, RecommendedActionsSection, ReportCard, SankeyChart, ScoreAnalysisModal, ScoreAnalysisPanel, ScoreBreakdown, ScoreFeedback, ScoreRing, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SignalApproval, Actions as SignalApprovalActions, Gate as SignalApprovalGate, Root as SignalApprovalRoot, SimpleChartTooltip, Skeleton, SourceList, StyledBarList, SuggestedActions, SystemActivity, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThreadMessage, TimelineActivity, Tooltip4 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopLineMetrics, TopTasksCard, TrendAreaChart, UpcomingMeetingsCard, ViewModeToggle, VolumeAnalysisChart, badgeVariants, buttonVariants, cn, getScoreColor, tabsListVariants, useIsMobile, useScoreFeedback, useSidebar, useSignalApproval };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map