@handled-ai/design-system 0.18.51 → 0.18.53

package/dist/components/entity-panel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/entity-panel.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Sheet, SheetContent, SheetHeader, SheetTitle } from \"./sheet\"\nimport { Badge } from \"./badge\"\nimport { Button } from \"./button\"\nimport { Input } from \"./input\"\nimport {\n  Plus,\n  ExternalLink,\n  Mail,\n  FileText,\n  MessageCircle,\n  Briefcase,\n  Building2,\n  Users,\n  X,\n  ChevronDown,\n  ChevronUp,\n  Link as LinkIcon,\n  Maximize2,\n  Minimize2,\n  CalendarDays,\n} from \"lucide-react\"\nimport { TimelineActivity, type TimelineEvent } from \"./timeline-activity\"\n\n// ---------------------------------------------------------------------------\n// EntityPanel -- supports Sheet (side panel), wide, and fullscreen modes\n// ---------------------------------------------------------------------------\n\nexport type PanelMode = 'default' | 'wide' | 'fullscreen'\n\nexport function EntityPanel({\n  isOpen,\n  onClose,\n  children,\n}: {\n  isOpen: boolean\n  onClose: (open: boolean) => void\n  children?: React.ReactNode\n}) {\n  const [panelMode, setPanelMode] = React.useState<PanelMode>('default')\n\n  // Backward-compatible derived values\n  const isFullscreen = panelMode === 'fullscreen'\n  const setIsFullscreen = React.useCallback(\n    (val: boolean) => setPanelMode(val ? 'fullscreen' : 'default'),\n    [],\n  )\n\n  const cyclePanelMode = React.useCallback(() => {\n    setPanelMode((prev) =>\n      prev === 'default' ? 'wide' : prev === 'wide' ? 'fullscreen' : 'default',\n    )\n  }, [])\n\n  React.useEffect(() => {\n    if (!isOpen) setPanelMode('default')\n  }, [isOpen])\n\n  const handleClose = React.useCallback(() => {\n    setPanelMode('default')\n    onClose(false)\n  }, [onClose])\n\n  const panelContent = (\n    <EntityPanelContext.Provider\n      value={{\n        isFullscreen,\n        setIsFullscreen,\n        panelMode,\n        setPanelMode,\n        cyclePanelMode,\n        onClose: handleClose,\n      }}\n    >\n      {children}\n    </EntityPanelContext.Provider>\n  )\n\n  if (isFullscreen && isOpen) {\n    return (\n      <div className=\"fixed inset-0 z-50 flex flex-col overflow-hidden bg-background\">\n        <div className=\"flex-1 overflow-y-auto px-5 py-5\">{panelContent}</div>\n      </div>\n    )\n  }\n\n  const widthClass =\n    panelMode === 'wide'\n      ? 'sm:w-[800px] sm:max-w-[900px]'\n      : 'sm:w-[500px] sm:max-w-[600px]'\n\n  return (\n    <Sheet open={isOpen} onOpenChange={onClose}>\n      <SheetContent\n        side=\"right\"\n        className={`w-full ${widthClass} overflow-hidden p-0 bg-background border-l border-border flex flex-col`}\n        showCloseButton={false}\n      >\n        <SheetHeader className=\"sr-only p-0\">\n          <SheetTitle>Entity panel</SheetTitle>\n        </SheetHeader>\n        <div className=\"flex-1 overflow-y-auto px-5 py-5\">{panelContent}</div>\n      </SheetContent>\n    </Sheet>\n  )\n}\n\nconst EntityPanelContext = React.createContext<{\n  isFullscreen: boolean\n  setIsFullscreen: (v: boolean) => void\n  panelMode: PanelMode\n  setPanelMode: (mode: PanelMode) => void\n  cyclePanelMode: () => void\n  onClose: () => void\n}>({\n  isFullscreen: false,\n  setIsFullscreen: () => {},\n  panelMode: 'default',\n  setPanelMode: () => {},\n  cyclePanelMode: () => {},\n  onClose: () => {},\n})\n\nexport function useEntityPanel() {\n  return React.useContext(EntityPanelContext)\n}\n\n// ---------------------------------------------------------------------------\n// EntityPanelHeader – MeetingDetail-inspired header bar\n// ---------------------------------------------------------------------------\n\nexport function EntityPanelHeader({\n  icon,\n  title,\n  badgeLabel,\n  subtitle,\n  headerAction,\n  headerSecondaryAction,\n}: {\n  icon?: React.ReactNode\n  title: string\n  badgeLabel?: string\n  subtitle?: string\n  headerAction?: React.ReactNode\n  headerSecondaryAction?: React.ReactNode\n}) {\n  const { panelMode, cyclePanelMode, onClose } = useEntityPanel()\n\n  const sizeButtonTitle =\n    panelMode === 'default' ? 'Wide' : panelMode === 'wide' ? 'Fullscreen' : 'Exit fullscreen'\n\n  return (\n    <div className=\"mb-3 space-y-2\">\n      <div className=\"flex items-center justify-between\">\n        <div className=\"flex items-center gap-2 min-w-0\">\n          {icon ?? <CalendarDays className=\"w-5 h-5 text-muted-foreground shrink-0\" />}\n          <h2 className=\"text-[16px] font-semibold text-foreground truncate\">{title}</h2>\n          {badgeLabel && (\n            <Badge\n              variant=\"outline\"\n              className=\"text-blue-600 border-blue-300 dark:border-blue-700 dark:text-blue-400 shadow-none px-2 py-0.5 text-[11px] font-medium shrink-0\"\n            >\n              {badgeLabel}\n            </Badge>\n          )}\n        </div>\n        <div className=\"flex items-center gap-1 shrink-0 ml-4 text-muted-foreground\">\n          {headerAction}\n          <button\n            type=\"button\"\n            className=\"p-1.5 rounded-md hover:bg-secondary transition-colors\"\n            title=\"Copy Link\"\n          >\n            <LinkIcon className=\"w-4 h-4\" />\n          </button>\n          <button\n            type=\"button\"\n            onClick={cyclePanelMode}\n            className=\"p-1.5 rounded-md hover:bg-secondary transition-colors\"\n            title={sizeButtonTitle}\n          >\n            {panelMode === 'fullscreen' ? (\n              <Minimize2 className=\"w-4 h-4\" />\n            ) : (\n              <Maximize2 className=\"w-4 h-4\" />\n            )}\n          </button>\n          <button\n            type=\"button\"\n            onClick={onClose}\n            className=\"p-1.5 rounded-md hover:bg-secondary transition-colors\"\n            title=\"Close\"\n          >\n            <X className=\"w-4 h-4\" />\n          </button>\n        </div>\n      </div>\n      {(subtitle || headerSecondaryAction) && (\n        <div className=\"flex flex-wrap items-center justify-between gap-x-3 gap-y-2\">\n          {subtitle ? (\n            <p className=\"min-w-0 flex-1 text-xs text-muted-foreground\">{subtitle}</p>\n          ) : (\n            <div className=\"min-w-0 flex-1\" />\n          )}\n          {headerSecondaryAction ? (\n            <div className=\"flex shrink-0 items-center gap-2\">{headerSecondaryAction}</div>\n          ) : null}\n        </div>\n      )}\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// EntityPanelTabs – Overview/Details tab bar\n// ---------------------------------------------------------------------------\n\nexport function EntityPanelTabs({\n  tabs,\n  activeTab,\n  onTabChange,\n}: {\n  tabs: { id: string; label: string }[]\n  activeTab: string\n  onTabChange: (id: string) => void\n}) {\n  return (\n    <div className=\"flex items-center gap-5 border-b border-border mb-4 overflow-x-auto\">\n      {tabs.map((tab) => (\n        <button\n          key={tab.id}\n          type=\"button\"\n          onClick={() => onTabChange(tab.id)}\n          className={`whitespace-nowrap shrink-0 pb-2.5 text-[13px] font-medium border-b-2 transition-colors ${\n            activeTab === tab.id\n              ? \"border-primary text-foreground\"\n              : \"border-transparent text-muted-foreground hover:text-foreground\"\n          }`}\n        >\n          {tab.label}\n        </button>\n      ))}\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// EntityMetadataGrid – key/value metadata rows with icons\n// ---------------------------------------------------------------------------\n\nexport interface EntityMetadataField {\n  icon: React.ComponentType<{ className?: string }>\n  label: string\n  value: React.ReactNode\n}\n\nexport function EntityMetadataGrid({ fields }: { fields: EntityMetadataField[] }) {\n  return (\n    <div className=\"grid grid-cols-1 md:grid-cols-[140px_1fr] gap-y-3 gap-x-4 mb-7 text-[13px] overflow-hidden\">\n      {fields.map((field, idx) => (\n        <React.Fragment key={idx}>\n          <div className=\"flex items-center gap-1.5 text-muted-foreground text-[13px] font-normal\">\n            <field.icon className=\"w-3.5 h-3.5 shrink-0\" />\n            <span>{field.label}</span>\n          </div>\n          <div className=\"min-w-0 truncate text-foreground\">{field.value}</div>\n        </React.Fragment>\n      ))}\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// EntitySection – clean section with title (MeetingDetail-style)\n// ---------------------------------------------------------------------------\n\nexport function EntitySection({\n  title,\n  children,\n  action,\n}: {\n  title: string\n  children: React.ReactNode\n  action?: React.ReactNode\n}) {\n  return (\n    <section className=\"mb-7\">\n      <div className=\"flex items-center justify-between mb-3\">\n        <h3 className=\"text-[12px] font-semibold text-muted-foreground tracking-wide\">{title}</h3>\n        {action}\n      </div>\n      {children}\n    </section>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// EntityActivityItem – clean activity row (MeetingDetail-style)\n// ---------------------------------------------------------------------------\n\nexport function EntityActivityItem({\n  icon,\n  title,\n  description,\n  date,\n}: {\n  icon?: React.ReactNode\n  title: React.ReactNode\n  description?: React.ReactNode\n  date?: string\n}) {\n  return (\n    <div className=\"flex gap-3 text-[13px]\">\n      <div className=\"mt-0.5 text-muted-foreground shrink-0\">\n        {icon ?? <CalendarDays className=\"w-4 h-4\" />}\n      </div>\n      <div>\n        <p className=\"text-foreground leading-relaxed\">{title}</p>\n        {description && <p className=\"text-[11px] text-muted-foreground/70 mt-0.5\">{description}</p>}\n        {date && <p className=\"text-[11px] text-muted-foreground/70 mt-0.5\">{date}</p>}\n      </div>\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// SystemActivity – standalone section for bottom of entity panel\n// ---------------------------------------------------------------------------\n\nexport function SystemActivity() {\n  return (\n    <EntitySection title=\"System Activity\">\n      <div className=\"space-y-4\">\n        <EntityActivityItem\n          title={<><span className=\"font-medium\">System</span> enriched the lead</>}\n          date=\"Today at 10:15 AM\"\n        />\n        <EntityActivityItem\n          icon={<Mail className=\"w-4 h-4\" />}\n          title={<><span className=\"font-medium\">Jackie Lee</span> submitted website form</>}\n          date=\"Yesterday at 3:22 PM\"\n        />\n      </div>\n    </EntitySection>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// PotentialContacts – unchanged from original\n// ---------------------------------------------------------------------------\n\nexport interface EntityPanelBrandIcons {\n  linkedin?: string\n  gmail?: string\n  slack?: string\n  gdoc?: string\n}\n\nfunction EntityPanelBrandIcon({\n  src,\n  alt,\n  className,\n  fallback,\n}: {\n  src?: string\n  alt: string\n  className: string\n  fallback: React.ReactNode\n}) {\n  if (!src) {\n    return <>{fallback}</>\n  }\n\n  return <img src={src} alt={alt} className={className} />\n}\n\nexport function PotentialContacts({\n  icons,\n}: {\n  icons?: Pick<EntityPanelBrandIcons, \"linkedin\" | \"gmail\">\n}) {\n  return (\n    <div className=\"space-y-2.5 mb-6\">\n      <div className=\"flex items-center justify-between\">\n        <h3 className=\"text-[13px] font-semibold text-foreground\">Potential Contacts</h3>\n        <span className=\"text-xs text-muted-foreground\">3 identified</span>\n      </div>\n      <div className=\"space-y-0\">\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-2.5 min-w-0\">\n            <Badge variant=\"outline\" className=\"bg-indigo-50 text-indigo-700 border-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-300 dark:border-indigo-800 shadow-none px-2 py-0 text-[11px] font-medium shrink-0\">Primary</Badge>\n            <span className=\"font-medium text-sm text-foreground truncate\">Jackie Lee</span>\n            <span className=\"text-muted-foreground text-sm shrink-0\">&middot;</span>\n            <span className=\"text-muted-foreground text-sm truncate\">VP Finance</span>\n          </div>\n          <div className=\"flex items-center gap-1 shrink-0\">\n            <button className=\"h-7 w-7 flex items-center justify-center hover:bg-muted rounded-md transition-colors\">\n              <EntityPanelBrandIcon\n                src={icons?.linkedin}\n                alt=\"LinkedIn\"\n                className=\"w-3.5 h-3.5 object-contain\"\n                fallback={<LinkIcon className=\"w-3.5 h-3.5 text-muted-foreground\" />}\n              />\n            </button>\n            <button className=\"h-7 w-7 flex items-center justify-center hover:bg-muted rounded-md transition-colors\">\n              <EntityPanelBrandIcon\n                src={icons?.gmail}\n                alt=\"Gmail\"\n                className=\"w-3.5 h-3.5 object-contain\"\n                fallback={<Mail className=\"w-3.5 h-3.5 text-muted-foreground\" />}\n              />\n            </button>\n            <Button size=\"sm\" className=\"bg-foreground text-background hover:bg-foreground/90 h-6 text-[11px] font-medium shadow-none ml-1\">\n              <Plus className=\"w-3 h-3 mr-1\" /> Add to SF\n            </Button>\n          </div>\n        </div>\n\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-2.5 min-w-0\">\n            <Badge variant=\"outline\" className=\"bg-green-50 text-green-700 border-green-200 dark:bg-green-900/30 dark:text-green-300 dark:border-green-800 shadow-none px-2 py-0 text-[11px] font-medium shrink-0\">78%</Badge>\n            <span className=\"font-medium text-sm text-foreground truncate\">Marcus Webb</span>\n            <span className=\"text-muted-foreground text-sm shrink-0\">&middot;</span>\n            <span className=\"text-muted-foreground text-sm truncate\">CEO</span>\n          </div>\n          <div className=\"flex items-center gap-1 shrink-0\">\n            <button className=\"h-7 w-7 flex items-center justify-center hover:bg-muted rounded-md transition-colors\">\n              <EntityPanelBrandIcon\n                src={icons?.linkedin}\n                alt=\"LinkedIn\"\n                className=\"w-3.5 h-3.5 object-contain\"\n                fallback={<LinkIcon className=\"w-3.5 h-3.5 text-muted-foreground\" />}\n              />\n            </button>\n            <Button size=\"sm\" className=\"bg-foreground text-background hover:bg-foreground/90 h-6 text-[11px] font-medium shadow-none ml-1\">\n              <Plus className=\"w-3 h-3 mr-1\" /> Add to SF\n            </Button>\n          </div>\n        </div>\n\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 last:border-0 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-2.5 min-w-0\">\n            <Badge variant=\"outline\" className=\"bg-amber-50 text-amber-700 border-amber-200 dark:bg-amber-900/30 dark:text-amber-300 dark:border-amber-800 shadow-none px-2 py-0 text-[11px] font-medium shrink-0\">65%</Badge>\n            <span className=\"font-medium text-sm text-foreground truncate\">Priya Shah</span>\n            <span className=\"text-muted-foreground text-sm shrink-0\">&middot;</span>\n            <span className=\"text-muted-foreground text-sm truncate\">Head of Ops</span>\n          </div>\n          <div className=\"flex items-center gap-1 shrink-0\">\n            <button className=\"h-7 w-7 flex items-center justify-center hover:bg-muted rounded-md transition-colors\">\n              <EntityPanelBrandIcon\n                src={icons?.linkedin}\n                alt=\"LinkedIn\"\n                className=\"w-3.5 h-3.5 object-contain\"\n                fallback={<LinkIcon className=\"w-3.5 h-3.5 text-muted-foreground\" />}\n              />\n            </button>\n            <button className=\"h-7 w-7 flex items-center justify-center hover:bg-muted rounded-md transition-colors\">\n              <EntityPanelBrandIcon\n                src={icons?.gmail}\n                alt=\"Gmail\"\n                className=\"w-3.5 h-3.5 object-contain\"\n                fallback={<Mail className=\"w-3.5 h-3.5 text-muted-foreground\" />}\n              />\n            </button>\n            <Button size=\"sm\" className=\"bg-foreground text-background hover:bg-foreground/90 h-6 text-[11px] font-medium shadow-none ml-1\">\n              <Plus className=\"w-3 h-3 mr-1\" /> Add to SF\n            </Button>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// RecentActivity\n// ---------------------------------------------------------------------------\n\nexport type ActivityItem = TimelineEvent\n\nexport function RecentActivity({\n  title = \"Recent Activity\",\n  count = \"10 total events\",\n  filters = [],\n  items = [],\n}: {\n  title?: string\n  count?: string\n  filters?: string[]\n  items?: TimelineEvent[]\n}) {\n  return (\n    <div id=\"entity-recent-activity\" className=\"space-y-3 mb-6 scroll-m-20\">\n      <div className=\"flex items-center justify-between\">\n        <h3 className=\"text-[13px] font-semibold text-foreground\">{title}</h3>\n        {count && <span className=\"text-xs text-muted-foreground\">{count}</span>}\n      </div>\n\n      {filters.length > 0 && (\n        <div className=\"flex flex-wrap items-center gap-1.5\">\n          {filters.map((filter) => (\n            <Button\n              key={filter}\n              variant=\"outline\"\n              size=\"sm\"\n              className=\"h-7 text-xs rounded-md shadow-none font-medium border-border text-muted-foreground hover:text-foreground\"\n            >\n              {filter}\n            </Button>\n          ))}\n        </div>\n      )}\n\n      <div className=\"relative\">\n        <Input\n          placeholder=\"Search activity...\"\n          className=\"h-9 text-sm bg-background border-border shadow-none\"\n        />\n      </div>\n\n      <div>\n        <TimelineActivity events={items} />\n      </div>\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// ConnectedApps\n// ---------------------------------------------------------------------------\n\nexport function ConnectedApps({\n  icons,\n}: {\n  icons?: Pick<EntityPanelBrandIcons, \"slack\" | \"gdoc\">\n}) {\n  return (\n    <div className=\"space-y-2.5 mb-6\">\n      <div className=\"flex items-center justify-between\">\n        <h3 className=\"text-[13px] font-semibold text-foreground\">Connected Apps</h3>\n        <span className=\"text-xs text-muted-foreground\">3 connected</span>\n      </div>\n\n      <div className=\"space-y-0\">\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-3 min-w-0\">\n            <div className=\"w-8 h-8 rounded-md border border-border/60 bg-muted/30 flex items-center justify-center shrink-0\">\n              <EntityPanelBrandIcon\n                src={icons?.slack}\n                alt=\"Slack\"\n                className=\"w-4 h-4 object-contain\"\n                fallback={<MessageCircle className=\"w-4 h-4 text-muted-foreground\" />}\n              />\n            </div>\n            <div className=\"min-w-0\">\n              <p className=\"font-medium text-sm text-foreground leading-snug truncate\">#lunchclub-acmeco</p>\n              <p className=\"text-xs text-muted-foreground/60\">Slack Channel</p>\n            </div>\n          </div>\n          <div className=\"flex items-center gap-1.5 shrink-0\">\n            <ExternalLink className=\"w-3 h-3 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity\" />\n            <span className=\"text-xs text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity cursor-pointer hover:text-foreground\">Open</span>\n          </div>\n        </div>\n\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-3 min-w-0\">\n            <div className=\"w-8 h-8 rounded-md border border-border/60 bg-muted/30 flex items-center justify-center shrink-0\">\n              <EntityPanelBrandIcon\n                src={icons?.gdoc}\n                alt=\"Google Docs\"\n                className=\"w-4 h-4 object-contain\"\n                fallback={<FileText className=\"w-4 h-4 text-muted-foreground\" />}\n              />\n            </div>\n            <div className=\"min-w-0\">\n              <p className=\"font-medium text-sm text-foreground leading-snug truncate\">Account Strategy Document</p>\n              <p className=\"text-xs text-muted-foreground/60\">Google Document</p>\n            </div>\n          </div>\n          <div className=\"flex items-center gap-1.5 shrink-0\">\n            <ExternalLink className=\"w-3 h-3 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity\" />\n            <span className=\"text-xs text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity cursor-pointer hover:text-foreground\">Open</span>\n          </div>\n        </div>\n\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 last:border-0 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-3 min-w-0\">\n            <div className=\"w-8 h-8 rounded-md border border-border/60 bg-muted/30 flex items-center justify-center shrink-0\">\n              <FileText className=\"w-4 h-4 text-foreground\" />\n            </div>\n            <div className=\"min-w-0\">\n              <p className=\"font-medium text-sm text-foreground leading-snug truncate\">Customer Success Playbook</p>\n              <p className=\"text-xs text-muted-foreground/60\">Notion Page</p>\n            </div>\n          </div>\n          <div className=\"flex items-center gap-1.5 shrink-0\">\n            <ExternalLink className=\"w-3 h-3 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity\" />\n            <span className=\"text-xs text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity cursor-pointer hover:text-foreground\">Open</span>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// EntityDetails – updated with MeetingDetail-inspired metadata grid + tabs\n// ---------------------------------------------------------------------------\n\nexport function EntityDetails({ onClose: _onClose }: { onClose?: () => void }) {\n  const [activeTab, setActiveTab] = React.useState<\"overview\" | \"details\">(\"overview\")\n  const [showMore, setShowMore] = React.useState(false)\n\n  const leadFields: EntityMetadataField[] = [\n    { icon: Users, label: \"Lead Name\", value: <span className=\"font-medium\">Jackie Lee</span> },\n    { icon: Briefcase, label: \"Title\", value: <span className=\"font-medium\">VP Finance</span> },\n    { icon: Building2, label: \"Company\", value: <span className=\"font-medium\">CloudKitchen</span> },\n    { icon: Mail, label: \"Lead Source\", value: <span className=\"font-medium\">Inbound — Website form</span> },\n    {\n      icon: ({ className }) => (\n        <div className={className}>\n          <div className=\"w-3 h-3 rounded-full border-[2px] border-amber-500\" />\n        </div>\n      ),\n      label: \"Lead Status\",\n      value: (\n        <Badge variant=\"outline\" className=\"text-amber-700 border-amber-200 bg-amber-50 dark:bg-amber-950 dark:text-amber-300 dark:border-amber-800 shadow-none font-medium px-2 py-0 text-[11px]\">\n          New — Not Contacted\n        </Badge>\n      ),\n    },\n    { icon: Users, label: \"Lead Owner\", value: <span className=\"font-medium\">Sarah Johnson (SDR)</span> },\n    {\n      icon: Building2,\n      label: \"Industry\",\n      value: (\n        <Badge variant=\"outline\" className=\"text-blue-700 border-blue-200 bg-blue-50 dark:bg-blue-950 dark:text-blue-300 dark:border-blue-800 shadow-none font-medium px-2 py-0 text-[11px]\">\n          Food Tech / Logistics\n        </Badge>\n      ),\n    },\n    { icon: Users, label: \"Company Size\", value: <span className=\"font-medium\">200-500 employees</span> },\n  ]\n\n  const visibleFields = showMore ? leadFields : leadFields.slice(0, 6)\n\n  return (\n    <div className=\"space-y-0\">\n      {/* Header */}\n      <EntityPanelHeader\n        icon={\n          <div className=\"w-10 h-10 rounded-lg bg-muted flex items-center justify-center text-sm font-medium text-muted-foreground shrink-0\">\n            CK\n          </div>\n        }\n        title=\"CloudKitchen\"\n        badgeLabel=\"Lead\"\n        subtitle=\"Last enriched: Today at 10:15 AM\"\n      />\n\n      {/* Tabs */}\n      <EntityPanelTabs\n        tabs={[\n          { id: \"overview\", label: \"Overview\" },\n          { id: \"details\", label: \"Details\" },\n        ]}\n        activeTab={activeTab}\n        onTabChange={(id) => setActiveTab(id as \"overview\" | \"details\")}\n      />\n\n      {activeTab === \"overview\" ? (\n        <div className=\"space-y-0\">\n          {/* Metadata Grid */}\n          <EntityMetadataGrid fields={visibleFields} />\n\n          {leadFields.length > 6 && (\n            <button\n              onClick={() => setShowMore(!showMore)}\n              className=\"flex items-center gap-1 text-xs text-muted-foreground hover:text-foreground transition-colors mb-6\"\n            >\n              {showMore ? \"See less\" : \"See more\"}\n              {showMore ? <ChevronUp className=\"w-3 h-3\" /> : <ChevronDown className=\"w-3 h-3\" />}\n            </button>\n          )}\n\n          {/* Enrichment as sections */}\n          <EntitySection title=\"Company Signals\">\n            <ul className=\"space-y-2\">\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  Recent funding: $45M Series B, 3 months ago\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">1</span>\n                </span>\n              </li>\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  Hiring: 3 finance/treasury roles in last 30 days\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">2</span>\n                </span>\n              </li>\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  Market expansion: 8 &rarr; 15 US markets planned\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">3</span>\n                </span>\n              </li>\n            </ul>\n          </EntitySection>\n\n          <EntitySection title=\"Contact Signals (Jackie Lee)\">\n            <ul className=\"space-y-2\">\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  Started role: 12 days ago\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">4</span>\n                </span>\n              </li>\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  Previous: Deel — operations/finance\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">4</span>\n                </span>\n              </li>\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  LinkedIn connections to existing customers: 2 detected\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">4</span>\n                </span>\n              </li>\n            </ul>\n          </EntitySection>\n\n          <SourcesToggle />\n        </div>\n      ) : (\n        <div className=\"space-y-0\">\n          <EntitySection title=\"Estimated Tech Stack\">\n            <div className=\"space-y-2\">\n              <div className=\"flex items-start gap-2 text-sm\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span className=\"text-muted-foreground min-w-[100px] shrink-0\">Banking:</span>\n                <span className=\"text-muted-foreground/50 italic\">Unknown</span>\n              </div>\n              <div className=\"flex items-start gap-2 text-sm\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span className=\"text-muted-foreground min-w-[100px] shrink-0\">Corporate Cards:</span>\n                <span className=\"text-foreground font-medium\">\n                  Brex <span className=\"text-muted-foreground font-normal\">(from job posting requirements)</span>\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">2</span>\n                </span>\n              </div>\n              <div className=\"flex items-start gap-2 text-sm\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span className=\"text-muted-foreground min-w-[100px] shrink-0\">Payroll:</span>\n                <span className=\"text-foreground font-medium\">\n                  Gusto <span className=\"text-muted-foreground font-normal\">(from LinkedIn integrations)</span>\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">5</span>\n                </span>\n              </div>\n            </div>\n          </EntitySection>\n        </div>\n      )}\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// SourcesToggle – collapsible sources list\n// ---------------------------------------------------------------------------\n\nfunction SourcesToggle() {\n  const [expanded, setExpanded] = React.useState(false)\n\n  const sources = [\n    { name: \"Crunchbase\", type: \"Funding data\", lastPull: \"2h ago\" },\n    { name: \"LinkedIn\", type: \"People & company\", lastPull: \"12h ago\" },\n    { name: \"LinkedIn Jobs\", type: \"Hiring signals\", lastPull: \"1d ago\" },\n    { name: \"PR Newswire\", type: \"News & press\", lastPull: \"6h ago\" },\n    { name: \"Clearbit\", type: \"Tech stack & firmographics\", lastPull: \"2h ago\" },\n  ]\n\n  return (\n    <div className=\"mb-6\">\n      <button\n        onClick={() => setExpanded(!expanded)}\n        className=\"flex items-center gap-1.5 text-xs font-semibold text-muted-foreground hover:text-foreground transition-colors\"\n      >\n        Sources\n        <ChevronDown className={`w-3.5 h-3.5 transition-transform duration-200 ${expanded ? \"rotate-180\" : \"\"}`} />\n      </button>\n\n      {expanded && (\n        <div className=\"pt-3 space-y-2 animate-in fade-in slide-in-from-top-1 duration-200\">\n          {sources.map((src, idx) => (\n            <div key={idx} className=\"flex items-center justify-between text-xs text-muted-foreground py-1\">\n              <div className=\"flex items-center gap-2\">\n                <span className=\"inline-flex items-center justify-center w-4 h-4 text-[9px] font-medium text-muted-foreground/50 border border-border rounded-full\">\n                  {idx + 1}\n                </span>\n                <span className=\"font-medium text-foreground\">{src.name}</span>\n                <span className=\"text-muted-foreground/60\">&middot;</span>\n                <span>{src.type}</span>\n              </div>\n              <span className=\"text-muted-foreground/50\">{src.lastPull}</span>\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/entity-panel.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Sheet, SheetContent, SheetHeader, SheetTitle } from \"./sheet\"\nimport { Badge } from \"./badge\"\nimport { Button } from \"./button\"\nimport { Input } from \"./input\"\nimport {\n  Plus,\n  ExternalLink,\n  Mail,\n  FileText,\n  MessageCircle,\n  Briefcase,\n  Building2,\n  Users,\n  X,\n  ChevronDown,\n  ChevronUp,\n  Link as LinkIcon,\n  Maximize2,\n  Minimize2,\n  CalendarDays,\n} from \"lucide-react\"\nimport { TimelineActivity, type TimelineEvent } from \"./timeline-activity\"\n\n// ---------------------------------------------------------------------------\n// EntityPanel -- supports Sheet (side panel), wide, and fullscreen modes\n// ---------------------------------------------------------------------------\n\nexport type PanelMode = 'default' | 'wide' | 'fullscreen'\n\nexport function EntityPanel({\n  isOpen,\n  onClose,\n  children,\n}: {\n  isOpen: boolean\n  onClose: (open: boolean) => void\n  children?: React.ReactNode\n}) {\n  const [panelMode, setPanelMode] = React.useState<PanelMode>('default')\n\n  // Backward-compatible derived values\n  const isFullscreen = panelMode === 'fullscreen'\n  const setIsFullscreen = React.useCallback(\n    (val: boolean) => setPanelMode(val ? 'fullscreen' : 'default'),\n    [],\n  )\n\n  const cyclePanelMode = React.useCallback(() => {\n    setPanelMode((prev) =>\n      prev === 'default' ? 'wide' : prev === 'wide' ? 'fullscreen' : 'default',\n    )\n  }, [])\n\n  React.useEffect(() => {\n    if (!isOpen) setPanelMode('default')\n  }, [isOpen])\n\n  const handleClose = React.useCallback(() => {\n    setPanelMode('default')\n    onClose(false)\n  }, [onClose])\n\n  const panelContent = (\n    <EntityPanelContext.Provider\n      value={{\n        isFullscreen,\n        setIsFullscreen,\n        panelMode,\n        setPanelMode,\n        cyclePanelMode,\n        onClose: handleClose,\n      }}\n    >\n      {children}\n    </EntityPanelContext.Provider>\n  )\n\n  if (isFullscreen && isOpen) {\n    return (\n      <div className=\"fixed inset-0 z-50 flex flex-col overflow-hidden bg-background\">\n        <div className=\"flex-1 overflow-y-auto px-5 py-5\">{panelContent}</div>\n      </div>\n    )\n  }\n\n  const widthClass =\n    panelMode === 'wide'\n      ? 'sm:w-[800px] sm:max-w-[900px]'\n      : 'sm:w-[500px] sm:max-w-[600px]'\n\n  return (\n    <Sheet open={isOpen} onOpenChange={onClose}>\n      <SheetContent\n        side=\"right\"\n        className={`w-full ${widthClass} overflow-hidden p-0 bg-background border-l border-border flex flex-col`}\n        showCloseButton={false}\n      >\n        <SheetHeader className=\"sr-only p-0\">\n          <SheetTitle>Entity panel</SheetTitle>\n        </SheetHeader>\n        <div className=\"flex-1 overflow-y-auto px-5 py-5\">{panelContent}</div>\n      </SheetContent>\n    </Sheet>\n  )\n}\n\nconst EntityPanelContext = React.createContext<{\n  isFullscreen: boolean\n  setIsFullscreen: (v: boolean) => void\n  panelMode: PanelMode\n  setPanelMode: (mode: PanelMode) => void\n  cyclePanelMode: () => void\n  onClose: () => void\n}>({\n  isFullscreen: false,\n  setIsFullscreen: () => {},\n  panelMode: 'default',\n  setPanelMode: () => {},\n  cyclePanelMode: () => {},\n  onClose: () => {},\n})\n\nexport function useEntityPanel() {\n  return React.useContext(EntityPanelContext)\n}\n\n// ---------------------------------------------------------------------------\n// EntityPanelHeader – MeetingDetail-inspired header bar\n// ---------------------------------------------------------------------------\n\nexport function EntityPanelHeader({\n  icon,\n  title,\n  badgeLabel,\n  subtitle,\n  headerAction,\n  headerSecondaryAction,\n}: {\n  icon?: React.ReactNode\n  title: string\n  badgeLabel?: string\n  subtitle?: string\n  headerAction?: React.ReactNode\n  headerSecondaryAction?: React.ReactNode\n}) {\n  const { panelMode, cyclePanelMode, onClose } = useEntityPanel()\n\n  const sizeButtonTitle =\n    panelMode === 'default' ? 'Wide' : panelMode === 'wide' ? 'Fullscreen' : 'Exit fullscreen'\n\n  return (\n    <div className=\"mb-3 space-y-2\">\n      <div className=\"flex items-center justify-between\">\n        <div className=\"flex items-center gap-2 min-w-0\">\n          {icon ?? <CalendarDays className=\"w-5 h-5 text-muted-foreground shrink-0\" />}\n          <h2 className=\"text-[16px] font-semibold text-foreground truncate\">{title}</h2>\n          {badgeLabel && (\n            <Badge\n              variant=\"outline\"\n              className=\"text-blue-600 border-blue-300 dark:border-blue-700 dark:text-blue-400 shadow-none px-2 py-0.5 text-[11px] font-medium shrink-0\"\n            >\n              {badgeLabel}\n            </Badge>\n          )}\n        </div>\n        <div className=\"flex items-center gap-1 shrink-0 ml-4 text-muted-foreground\">\n          {headerAction}\n          <button\n            type=\"button\"\n            className=\"p-1.5 rounded-md hover:bg-secondary transition-colors\"\n            title=\"Copy Link\"\n          >\n            <LinkIcon className=\"w-4 h-4\" />\n          </button>\n          <button\n            type=\"button\"\n            onClick={cyclePanelMode}\n            className=\"p-1.5 rounded-md hover:bg-secondary transition-colors\"\n            title={sizeButtonTitle}\n          >\n            {panelMode === 'fullscreen' ? (\n              <Minimize2 className=\"w-4 h-4\" />\n            ) : (\n              <Maximize2 className=\"w-4 h-4\" />\n            )}\n          </button>\n          <button\n            type=\"button\"\n            onClick={onClose}\n            className=\"p-1.5 rounded-md hover:bg-secondary transition-colors\"\n            title=\"Close\"\n          >\n            <X className=\"w-4 h-4\" />\n          </button>\n        </div>\n      </div>\n      {(subtitle || headerSecondaryAction) && (\n        <div className=\"flex flex-wrap items-center justify-between gap-x-3 gap-y-2\">\n          {subtitle ? (\n            <p className=\"min-w-0 flex-1 text-xs text-muted-foreground\">{subtitle}</p>\n          ) : (\n            <div className=\"min-w-0 flex-1\" />\n          )}\n          {headerSecondaryAction ? (\n            <div className=\"flex shrink-0 items-center gap-2\">{headerSecondaryAction}</div>\n          ) : null}\n        </div>\n      )}\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// EntityPanelTabs – Overview/Details tab bar\n// ---------------------------------------------------------------------------\n\nexport function EntityPanelTabs({\n  tabs,\n  activeTab,\n  onTabChange,\n}: {\n  tabs: { id: string; label: string }[]\n  activeTab: string\n  onTabChange: (id: string) => void\n}) {\n  return (\n    <div className=\"flex items-center gap-5 border-b border-border mb-4 overflow-x-auto\">\n      {tabs.map((tab) => (\n        <button\n          key={tab.id}\n          type=\"button\"\n          onClick={() => onTabChange(tab.id)}\n          className={`whitespace-nowrap shrink-0 pb-2.5 text-[13px] font-medium border-b-2 transition-colors ${\n            activeTab === tab.id\n              ? \"border-primary text-foreground\"\n              : \"border-transparent text-muted-foreground hover:text-foreground\"\n          }`}\n        >\n          {tab.label}\n        </button>\n      ))}\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// EntityMetadataGrid – key/value metadata rows with icons\n// ---------------------------------------------------------------------------\n\nexport interface EntityMetadataField {\n  icon: React.ComponentType<{ className?: string }>\n  label: string\n  value: React.ReactNode\n}\n\nexport function EntityMetadataGrid({ fields }: { fields: EntityMetadataField[] }) {\n  return (\n    <div className=\"mb-7 grid min-w-0 grid-cols-1 gap-x-4 gap-y-3 overflow-hidden text-[13px] md:grid-cols-[minmax(0,140px)_minmax(0,1fr)]\">\n      {fields.map((field, idx) => (\n        <React.Fragment key={idx}>\n          <div className=\"flex min-w-0 items-start gap-1.5 text-[13px] font-normal text-muted-foreground\">\n            <field.icon className=\"mt-0.5 h-3.5 w-3.5 shrink-0\" />\n            <span className=\"min-w-0 break-words leading-relaxed [overflow-wrap:anywhere]\">{field.label}</span>\n          </div>\n          <div className=\"min-w-0 whitespace-normal break-words leading-relaxed text-foreground [overflow-wrap:anywhere] [&_*]:max-w-full [&_*]:[overflow-wrap:anywhere] [&_a]:break-all\">\n            {field.value}\n          </div>\n        </React.Fragment>\n      ))}\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// EntitySection – clean section with title (MeetingDetail-style)\n// ---------------------------------------------------------------------------\n\nexport function EntitySection({\n  title,\n  children,\n  action,\n}: {\n  title: string\n  children: React.ReactNode\n  action?: React.ReactNode\n}) {\n  return (\n    <section className=\"mb-7\">\n      <div className=\"flex items-center justify-between mb-3\">\n        <h3 className=\"text-[12px] font-semibold text-muted-foreground tracking-wide\">{title}</h3>\n        {action}\n      </div>\n      {children}\n    </section>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// EntityActivityItem – clean activity row (MeetingDetail-style)\n// ---------------------------------------------------------------------------\n\nexport function EntityActivityItem({\n  icon,\n  title,\n  description,\n  date,\n}: {\n  icon?: React.ReactNode\n  title: React.ReactNode\n  description?: React.ReactNode\n  date?: string\n}) {\n  return (\n    <div className=\"flex gap-3 text-[13px]\">\n      <div className=\"mt-0.5 text-muted-foreground shrink-0\">\n        {icon ?? <CalendarDays className=\"w-4 h-4\" />}\n      </div>\n      <div>\n        <p className=\"text-foreground leading-relaxed\">{title}</p>\n        {description && <p className=\"text-[11px] text-muted-foreground/70 mt-0.5\">{description}</p>}\n        {date && <p className=\"text-[11px] text-muted-foreground/70 mt-0.5\">{date}</p>}\n      </div>\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// SystemActivity – standalone section for bottom of entity panel\n// ---------------------------------------------------------------------------\n\nexport function SystemActivity() {\n  return (\n    <EntitySection title=\"System Activity\">\n      <div className=\"space-y-4\">\n        <EntityActivityItem\n          title={<><span className=\"font-medium\">System</span> enriched the lead</>}\n          date=\"Today at 10:15 AM\"\n        />\n        <EntityActivityItem\n          icon={<Mail className=\"w-4 h-4\" />}\n          title={<><span className=\"font-medium\">Jackie Lee</span> submitted website form</>}\n          date=\"Yesterday at 3:22 PM\"\n        />\n      </div>\n    </EntitySection>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// PotentialContacts – unchanged from original\n// ---------------------------------------------------------------------------\n\nexport interface EntityPanelBrandIcons {\n  linkedin?: string\n  gmail?: string\n  slack?: string\n  gdoc?: string\n}\n\nfunction EntityPanelBrandIcon({\n  src,\n  alt,\n  className,\n  fallback,\n}: {\n  src?: string\n  alt: string\n  className: string\n  fallback: React.ReactNode\n}) {\n  if (!src) {\n    return <>{fallback}</>\n  }\n\n  return <img src={src} alt={alt} className={className} />\n}\n\nexport function PotentialContacts({\n  icons,\n}: {\n  icons?: Pick<EntityPanelBrandIcons, \"linkedin\" | \"gmail\">\n}) {\n  return (\n    <div className=\"space-y-2.5 mb-6\">\n      <div className=\"flex items-center justify-between\">\n        <h3 className=\"text-[13px] font-semibold text-foreground\">Potential Contacts</h3>\n        <span className=\"text-xs text-muted-foreground\">3 identified</span>\n      </div>\n      <div className=\"space-y-0\">\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-2.5 min-w-0\">\n            <Badge variant=\"outline\" className=\"bg-indigo-50 text-indigo-700 border-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-300 dark:border-indigo-800 shadow-none px-2 py-0 text-[11px] font-medium shrink-0\">Primary</Badge>\n            <span className=\"font-medium text-sm text-foreground truncate\">Jackie Lee</span>\n            <span className=\"text-muted-foreground text-sm shrink-0\">&middot;</span>\n            <span className=\"text-muted-foreground text-sm truncate\">VP Finance</span>\n          </div>\n          <div className=\"flex items-center gap-1 shrink-0\">\n            <button className=\"h-7 w-7 flex items-center justify-center hover:bg-muted rounded-md transition-colors\">\n              <EntityPanelBrandIcon\n                src={icons?.linkedin}\n                alt=\"LinkedIn\"\n                className=\"w-3.5 h-3.5 object-contain\"\n                fallback={<LinkIcon className=\"w-3.5 h-3.5 text-muted-foreground\" />}\n              />\n            </button>\n            <button className=\"h-7 w-7 flex items-center justify-center hover:bg-muted rounded-md transition-colors\">\n              <EntityPanelBrandIcon\n                src={icons?.gmail}\n                alt=\"Gmail\"\n                className=\"w-3.5 h-3.5 object-contain\"\n                fallback={<Mail className=\"w-3.5 h-3.5 text-muted-foreground\" />}\n              />\n            </button>\n            <Button size=\"sm\" className=\"bg-foreground text-background hover:bg-foreground/90 h-6 text-[11px] font-medium shadow-none ml-1\">\n              <Plus className=\"w-3 h-3 mr-1\" /> Add to SF\n            </Button>\n          </div>\n        </div>\n\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-2.5 min-w-0\">\n            <Badge variant=\"outline\" className=\"bg-green-50 text-green-700 border-green-200 dark:bg-green-900/30 dark:text-green-300 dark:border-green-800 shadow-none px-2 py-0 text-[11px] font-medium shrink-0\">78%</Badge>\n            <span className=\"font-medium text-sm text-foreground truncate\">Marcus Webb</span>\n            <span className=\"text-muted-foreground text-sm shrink-0\">&middot;</span>\n            <span className=\"text-muted-foreground text-sm truncate\">CEO</span>\n          </div>\n          <div className=\"flex items-center gap-1 shrink-0\">\n            <button className=\"h-7 w-7 flex items-center justify-center hover:bg-muted rounded-md transition-colors\">\n              <EntityPanelBrandIcon\n                src={icons?.linkedin}\n                alt=\"LinkedIn\"\n                className=\"w-3.5 h-3.5 object-contain\"\n                fallback={<LinkIcon className=\"w-3.5 h-3.5 text-muted-foreground\" />}\n              />\n            </button>\n            <Button size=\"sm\" className=\"bg-foreground text-background hover:bg-foreground/90 h-6 text-[11px] font-medium shadow-none ml-1\">\n              <Plus className=\"w-3 h-3 mr-1\" /> Add to SF\n            </Button>\n          </div>\n        </div>\n\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 last:border-0 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-2.5 min-w-0\">\n            <Badge variant=\"outline\" className=\"bg-amber-50 text-amber-700 border-amber-200 dark:bg-amber-900/30 dark:text-amber-300 dark:border-amber-800 shadow-none px-2 py-0 text-[11px] font-medium shrink-0\">65%</Badge>\n            <span className=\"font-medium text-sm text-foreground truncate\">Priya Shah</span>\n            <span className=\"text-muted-foreground text-sm shrink-0\">&middot;</span>\n            <span className=\"text-muted-foreground text-sm truncate\">Head of Ops</span>\n          </div>\n          <div className=\"flex items-center gap-1 shrink-0\">\n            <button className=\"h-7 w-7 flex items-center justify-center hover:bg-muted rounded-md transition-colors\">\n              <EntityPanelBrandIcon\n                src={icons?.linkedin}\n                alt=\"LinkedIn\"\n                className=\"w-3.5 h-3.5 object-contain\"\n                fallback={<LinkIcon className=\"w-3.5 h-3.5 text-muted-foreground\" />}\n              />\n            </button>\n            <button className=\"h-7 w-7 flex items-center justify-center hover:bg-muted rounded-md transition-colors\">\n              <EntityPanelBrandIcon\n                src={icons?.gmail}\n                alt=\"Gmail\"\n                className=\"w-3.5 h-3.5 object-contain\"\n                fallback={<Mail className=\"w-3.5 h-3.5 text-muted-foreground\" />}\n              />\n            </button>\n            <Button size=\"sm\" className=\"bg-foreground text-background hover:bg-foreground/90 h-6 text-[11px] font-medium shadow-none ml-1\">\n              <Plus className=\"w-3 h-3 mr-1\" /> Add to SF\n            </Button>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// RecentActivity\n// ---------------------------------------------------------------------------\n\nexport type ActivityItem = TimelineEvent\n\nexport function RecentActivity({\n  title = \"Recent Activity\",\n  count = \"10 total events\",\n  filters = [],\n  items = [],\n}: {\n  title?: string\n  count?: string\n  filters?: string[]\n  items?: TimelineEvent[]\n}) {\n  return (\n    <div id=\"entity-recent-activity\" className=\"space-y-3 mb-6 scroll-m-20\">\n      <div className=\"flex items-center justify-between\">\n        <h3 className=\"text-[13px] font-semibold text-foreground\">{title}</h3>\n        {count && <span className=\"text-xs text-muted-foreground\">{count}</span>}\n      </div>\n\n      {filters.length > 0 && (\n        <div className=\"flex flex-wrap items-center gap-1.5\">\n          {filters.map((filter) => (\n            <Button\n              key={filter}\n              variant=\"outline\"\n              size=\"sm\"\n              className=\"h-7 text-xs rounded-md shadow-none font-medium border-border text-muted-foreground hover:text-foreground\"\n            >\n              {filter}\n            </Button>\n          ))}\n        </div>\n      )}\n\n      <div className=\"relative\">\n        <Input\n          placeholder=\"Search activity...\"\n          className=\"h-9 text-sm bg-background border-border shadow-none\"\n        />\n      </div>\n\n      <div>\n        <TimelineActivity events={items} />\n      </div>\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// ConnectedApps\n// ---------------------------------------------------------------------------\n\nexport function ConnectedApps({\n  icons,\n}: {\n  icons?: Pick<EntityPanelBrandIcons, \"slack\" | \"gdoc\">\n}) {\n  return (\n    <div className=\"space-y-2.5 mb-6\">\n      <div className=\"flex items-center justify-between\">\n        <h3 className=\"text-[13px] font-semibold text-foreground\">Connected Apps</h3>\n        <span className=\"text-xs text-muted-foreground\">3 connected</span>\n      </div>\n\n      <div className=\"space-y-0\">\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-3 min-w-0\">\n            <div className=\"w-8 h-8 rounded-md border border-border/60 bg-muted/30 flex items-center justify-center shrink-0\">\n              <EntityPanelBrandIcon\n                src={icons?.slack}\n                alt=\"Slack\"\n                className=\"w-4 h-4 object-contain\"\n                fallback={<MessageCircle className=\"w-4 h-4 text-muted-foreground\" />}\n              />\n            </div>\n            <div className=\"min-w-0\">\n              <p className=\"font-medium text-sm text-foreground leading-snug truncate\">#lunchclub-acmeco</p>\n              <p className=\"text-xs text-muted-foreground/60\">Slack Channel</p>\n            </div>\n          </div>\n          <div className=\"flex items-center gap-1.5 shrink-0\">\n            <ExternalLink className=\"w-3 h-3 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity\" />\n            <span className=\"text-xs text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity cursor-pointer hover:text-foreground\">Open</span>\n          </div>\n        </div>\n\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-3 min-w-0\">\n            <div className=\"w-8 h-8 rounded-md border border-border/60 bg-muted/30 flex items-center justify-center shrink-0\">\n              <EntityPanelBrandIcon\n                src={icons?.gdoc}\n                alt=\"Google Docs\"\n                className=\"w-4 h-4 object-contain\"\n                fallback={<FileText className=\"w-4 h-4 text-muted-foreground\" />}\n              />\n            </div>\n            <div className=\"min-w-0\">\n              <p className=\"font-medium text-sm text-foreground leading-snug truncate\">Account Strategy Document</p>\n              <p className=\"text-xs text-muted-foreground/60\">Google Document</p>\n            </div>\n          </div>\n          <div className=\"flex items-center gap-1.5 shrink-0\">\n            <ExternalLink className=\"w-3 h-3 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity\" />\n            <span className=\"text-xs text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity cursor-pointer hover:text-foreground\">Open</span>\n          </div>\n        </div>\n\n        <div className=\"flex items-center justify-between gap-3 group py-2 border-b border-border/30 last:border-0 hover:bg-muted/20 -mx-2 px-2 rounded-sm transition-colors\">\n          <div className=\"flex items-center gap-3 min-w-0\">\n            <div className=\"w-8 h-8 rounded-md border border-border/60 bg-muted/30 flex items-center justify-center shrink-0\">\n              <FileText className=\"w-4 h-4 text-foreground\" />\n            </div>\n            <div className=\"min-w-0\">\n              <p className=\"font-medium text-sm text-foreground leading-snug truncate\">Customer Success Playbook</p>\n              <p className=\"text-xs text-muted-foreground/60\">Notion Page</p>\n            </div>\n          </div>\n          <div className=\"flex items-center gap-1.5 shrink-0\">\n            <ExternalLink className=\"w-3 h-3 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity\" />\n            <span className=\"text-xs text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity cursor-pointer hover:text-foreground\">Open</span>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// EntityDetails – updated with MeetingDetail-inspired metadata grid + tabs\n// ---------------------------------------------------------------------------\n\nexport function EntityDetails({ onClose: _onClose }: { onClose?: () => void }) {\n  const [activeTab, setActiveTab] = React.useState<\"overview\" | \"details\">(\"overview\")\n  const [showMore, setShowMore] = React.useState(false)\n\n  const leadFields: EntityMetadataField[] = [\n    { icon: Users, label: \"Lead Name\", value: <span className=\"font-medium\">Jackie Lee</span> },\n    { icon: Briefcase, label: \"Title\", value: <span className=\"font-medium\">VP Finance</span> },\n    { icon: Building2, label: \"Company\", value: <span className=\"font-medium\">CloudKitchen</span> },\n    { icon: Mail, label: \"Lead Source\", value: <span className=\"font-medium\">Inbound — Website form</span> },\n    {\n      icon: ({ className }) => (\n        <div className={className}>\n          <div className=\"w-3 h-3 rounded-full border-[2px] border-amber-500\" />\n        </div>\n      ),\n      label: \"Lead Status\",\n      value: (\n        <Badge variant=\"outline\" className=\"text-amber-700 border-amber-200 bg-amber-50 dark:bg-amber-950 dark:text-amber-300 dark:border-amber-800 shadow-none font-medium px-2 py-0 text-[11px]\">\n          New — Not Contacted\n        </Badge>\n      ),\n    },\n    { icon: Users, label: \"Lead Owner\", value: <span className=\"font-medium\">Sarah Johnson (SDR)</span> },\n    {\n      icon: Building2,\n      label: \"Industry\",\n      value: (\n        <Badge variant=\"outline\" className=\"text-blue-700 border-blue-200 bg-blue-50 dark:bg-blue-950 dark:text-blue-300 dark:border-blue-800 shadow-none font-medium px-2 py-0 text-[11px]\">\n          Food Tech / Logistics\n        </Badge>\n      ),\n    },\n    { icon: Users, label: \"Company Size\", value: <span className=\"font-medium\">200-500 employees</span> },\n  ]\n\n  const visibleFields = showMore ? leadFields : leadFields.slice(0, 6)\n\n  return (\n    <div className=\"space-y-0\">\n      {/* Header */}\n      <EntityPanelHeader\n        icon={\n          <div className=\"w-10 h-10 rounded-lg bg-muted flex items-center justify-center text-sm font-medium text-muted-foreground shrink-0\">\n            CK\n          </div>\n        }\n        title=\"CloudKitchen\"\n        badgeLabel=\"Lead\"\n        subtitle=\"Last enriched: Today at 10:15 AM\"\n      />\n\n      {/* Tabs */}\n      <EntityPanelTabs\n        tabs={[\n          { id: \"overview\", label: \"Overview\" },\n          { id: \"details\", label: \"Details\" },\n        ]}\n        activeTab={activeTab}\n        onTabChange={(id) => setActiveTab(id as \"overview\" | \"details\")}\n      />\n\n      {activeTab === \"overview\" ? (\n        <div className=\"space-y-0\">\n          {/* Metadata Grid */}\n          <EntityMetadataGrid fields={visibleFields} />\n\n          {leadFields.length > 6 && (\n            <button\n              onClick={() => setShowMore(!showMore)}\n              className=\"flex items-center gap-1 text-xs text-muted-foreground hover:text-foreground transition-colors mb-6\"\n            >\n              {showMore ? \"See less\" : \"See more\"}\n              {showMore ? <ChevronUp className=\"w-3 h-3\" /> : <ChevronDown className=\"w-3 h-3\" />}\n            </button>\n          )}\n\n          {/* Enrichment as sections */}\n          <EntitySection title=\"Company Signals\">\n            <ul className=\"space-y-2\">\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  Recent funding: $45M Series B, 3 months ago\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">1</span>\n                </span>\n              </li>\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  Hiring: 3 finance/treasury roles in last 30 days\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">2</span>\n                </span>\n              </li>\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  Market expansion: 8 &rarr; 15 US markets planned\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">3</span>\n                </span>\n              </li>\n            </ul>\n          </EntitySection>\n\n          <EntitySection title=\"Contact Signals (Jackie Lee)\">\n            <ul className=\"space-y-2\">\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  Started role: 12 days ago\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">4</span>\n                </span>\n              </li>\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  Previous: Deel — operations/finance\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">4</span>\n                </span>\n              </li>\n              <li className=\"flex items-start gap-2 text-sm text-muted-foreground\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span>\n                  LinkedIn connections to existing customers: 2 detected\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">4</span>\n                </span>\n              </li>\n            </ul>\n          </EntitySection>\n\n          <SourcesToggle />\n        </div>\n      ) : (\n        <div className=\"space-y-0\">\n          <EntitySection title=\"Estimated Tech Stack\">\n            <div className=\"space-y-2\">\n              <div className=\"flex items-start gap-2 text-sm\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span className=\"text-muted-foreground min-w-[100px] shrink-0\">Banking:</span>\n                <span className=\"text-muted-foreground/50 italic\">Unknown</span>\n              </div>\n              <div className=\"flex items-start gap-2 text-sm\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span className=\"text-muted-foreground min-w-[100px] shrink-0\">Corporate Cards:</span>\n                <span className=\"text-foreground font-medium\">\n                  Brex <span className=\"text-muted-foreground font-normal\">(from job posting requirements)</span>\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">2</span>\n                </span>\n              </div>\n              <div className=\"flex items-start gap-2 text-sm\">\n                <span className=\"text-muted-foreground/50 mt-1 shrink-0\">&bull;</span>\n                <span className=\"text-muted-foreground min-w-[100px] shrink-0\">Payroll:</span>\n                <span className=\"text-foreground font-medium\">\n                  Gusto <span className=\"text-muted-foreground font-normal\">(from LinkedIn integrations)</span>\n                  <span className=\"inline-flex items-center justify-center w-4 h-4 ml-1.5 align-text-top text-[9px] font-medium text-muted-foreground bg-muted/30 border border-border/50 rounded-full\">5</span>\n                </span>\n              </div>\n            </div>\n          </EntitySection>\n        </div>\n      )}\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// SourcesToggle – collapsible sources list\n// ---------------------------------------------------------------------------\n\nfunction SourcesToggle() {\n  const [expanded, setExpanded] = React.useState(false)\n\n  const sources = [\n    { name: \"Crunchbase\", type: \"Funding data\", lastPull: \"2h ago\" },\n    { name: \"LinkedIn\", type: \"People & company\", lastPull: \"12h ago\" },\n    { name: \"LinkedIn Jobs\", type: \"Hiring signals\", lastPull: \"1d ago\" },\n    { name: \"PR Newswire\", type: \"News & press\", lastPull: \"6h ago\" },\n    { name: \"Clearbit\", type: \"Tech stack & firmographics\", lastPull: \"2h ago\" },\n  ]\n\n  return (\n    <div className=\"mb-6\">\n      <button\n        onClick={() => setExpanded(!expanded)}\n        className=\"flex items-center gap-1.5 text-xs font-semibold text-muted-foreground hover:text-foreground transition-colors\"\n      >\n        Sources\n        <ChevronDown className={`w-3.5 h-3.5 transition-transform duration-200 ${expanded ? \"rotate-180\" : \"\"}`} />\n      </button>\n\n      {expanded && (\n        <div className=\"pt-3 space-y-2 animate-in fade-in slide-in-from-top-1 duration-200\">\n          {sources.map((src, idx) => (\n            <div key={idx} className=\"flex items-center justify-between text-xs text-muted-foreground py-1\">\n              <div className=\"flex items-center gap-2\">\n                <span className=\"inline-flex items-center justify-center w-4 h-4 text-[9px] font-medium text-muted-foreground/50 border border-border rounded-full\">\n                  {idx + 1}\n                </span>\n                <span className=\"font-medium text-foreground\">{src.name}</span>\n                <span className=\"text-muted-foreground/60\">&middot;</span>\n                <span>{src.type}</span>\n              </div>\n              <span className=\"text-muted-foreground/50\">{src.lastPull}</span>\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","names":[]}

package/dist/components/pill.d.ts

@@ -12,7 +12,7 @@ import { VariantProps } from 'class-variance-authority';
  */
 type PillStatus = "success" | "warning" | "error" | "neutral" | "info";
 declare const pillVariants: (props?: ({
-    variant?: "error" | "default" | "secondary" | "destructive" | "outline" | "ghost" | "neutral" | "info" | "success" | "warning" | null | undefined;
+    variant?: "default" | "secondary" | "destructive" | "outline" | "ghost" | "error" | "neutral" | "info" | "success" | "warning" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface PillProps extends React.ComponentProps<"span">, VariantProps<typeof pillVariants> {
 }

package/dist/components/score-why-chips.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Q as QueueItem, m as SignalScoreData, p as SignalScoreUrgencyLabel } from '../signal-priority-popover-DTedstRL.js';
+import { Q as QueueItem, l as SignalScoreData, o as SignalScoreUrgencyLabel } from '../signal-priority-popover-QJngMAj7.js';
 import './feedback-primitives.js';
 import './quick-action-sidebar-nav.js';
 import './quick-action-modal.js';

package/dist/components/signal-feedback-inline.d.ts

@@ -1,6 +1,29 @@
 import * as React from 'react';
 
 type ApprovalState = "pending" | "confirming" | "creating" | "approving-feedback" | "dismissing" | "approved" | "dismissed" | "auto-approved";
+interface OpportunityPreviewOption {
+    value: string;
+    label: string;
+}
+interface OpportunityPreview {
+    name: string;
+    stage: string;
+    closeDate: string;
+    closeDateValue?: string;
+    amount: string;
+    /** Raw draft input value. Numeric values render as currency in the editable field. */
+    amountValue?: string | number | null;
+    accountName: string;
+    description?: string | null;
+    churnType?: string | null;
+    churnTypeOptions?: Array<string | OpportunityPreviewOption>;
+}
+interface OpportunityDraft {
+    closeDate: string;
+    amount: string;
+    description: string;
+    churnType: string;
+}
 interface SignalApprovalLabels {
     approveButton?: string;
     dismissButton?: string;
@@ -21,9 +44,9 @@ interface SignalApprovalContextValue {
     labels: Required<SignalApprovalLabels>;
     hideApproveButton?: boolean;
     approveButtonIconUrl?: string;
-    opportunityPreview?: RootProps['opportunityPreview'];
+    opportunityPreview?: OpportunityPreview;
     requestingApproval: boolean;
-    approve: () => void;
+    approve: (draft?: OpportunityDraft) => void;
     submitApproveFeedback: (reasons: string[], detail: string) => void;
     skipApproveFeedback: () => void;
     dismiss: (reasons: string[], detail: string, subReason?: string) => void;
@@ -44,13 +67,7 @@ interface RootProps {
     /** Optional icon URL for the approve button. Renders an img instead of CirclePlus when provided. */
     approveButtonIconUrl?: string;
     /** Optional structured preview data shown in the confirmation dialog. */
-    opportunityPreview?: {
-        name: string;
-        stage: string;
-        closeDate: string;
-        amount: string;
-        accountName: string;
-    };
+    opportunityPreview?: OpportunityPreview;
     /**
      * Async callback fired when the user clicks the approve button, BEFORE
      * transitioning to the "confirming" state. While the promise is pending,
@@ -67,7 +84,7 @@ interface RootProps {
      *   "creating" loading state while the promise is pending. On `true` it
      *   transitions to the feedback step; on `false` it reverts to "pending".
      */
-    onApprove?: () => void | Promise<boolean>;
+    onApprove?: (draft?: OpportunityDraft) => void | Promise<boolean>;
     onApproveFeedback?: (reasons: string[], detail: string) => void;
     onDismiss?: (reasons: string[], detail: string, subReason?: string) => void;
 }
@@ -82,6 +99,5 @@ declare const SignalApproval: {
     Actions: typeof Actions;
     Gate: typeof Gate;
 };
-type OpportunityPreview = NonNullable<RootProps['opportunityPreview']>;
 
-export { type ApprovalState, type OpportunityPreview, SignalApproval, Actions as SignalApprovalActions, type SignalApprovalContextValue, Gate as SignalApprovalGate, type SignalApprovalLabels, Root as SignalApprovalRoot, type RootProps as SignalApprovalRootProps, useSignalApproval };
+export { type ApprovalState, type OpportunityDraft, type OpportunityPreview, SignalApproval, Actions as SignalApprovalActions, type SignalApprovalContextValue, Gate as SignalApprovalGate, type SignalApprovalLabels, Root as SignalApprovalRoot, type RootProps as SignalApprovalRootProps, useSignalApproval };

package/dist/components/signal-feedback-inline.js

@@ -2,6 +2,8 @@
 
 "use client";
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -17,6 +19,7 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { Check, CirclePlus, ExternalLink, Loader2, Lock, ThumbsDown } from "lucide-react";
@@ -104,6 +107,7 @@ function Root({ children, companyName, opportunityUrl, scheduledTime, initialApp
   const [requestingApproval, setRequestingApproval] = React.useState(false);
   const mountedRef = React.useRef(true);
   React.useEffect(() => {
+    mountedRef.current = true;
     return () => {
       mountedRef.current = false;
     };
@@ -131,8 +135,8 @@ function Root({ children, companyName, opportunityUrl, scheduledTime, initialApp
   const cancel = React.useCallback(() => {
     setApprovalState("pending");
   }, []);
-  const approve = React.useCallback(() => {
-    const result = onApprove == null ? void 0 : onApprove();
+  const approve = React.useCallback((draft) => {
+    const result = onApprove == null ? void 0 : onApprove(draft);
     if (result && typeof result.then === "function") {
       setApprovalState("creating");
       result.then((success) => {
@@ -288,7 +292,45 @@ function SubmittedFeedback({
     }
   );
 }
+function optionValue(option) {
+  return typeof option === "string" ? option : option.value;
+}
+function optionLabel(option) {
+  return typeof option === "string" ? option : option.label;
+}
+function formatAmountDraftValue(value) {
+  if (value == null || value === "") return "";
+  if (typeof value === "number") {
+    return new Intl.NumberFormat("en-US", {
+      style: "currency",
+      currency: "USD",
+      maximumFractionDigits: 0
+    }).format(value);
+  }
+  return value;
+}
+function buildOpportunityDraft(preview) {
+  var _a, _b, _c, _d, _e;
+  return {
+    closeDate: (_b = (_a = preview == null ? void 0 : preview.closeDateValue) != null ? _a : preview == null ? void 0 : preview.closeDate) != null ? _b : "",
+    amount: (preview == null ? void 0 : preview.amountValue) === void 0 ? (_c = preview == null ? void 0 : preview.amount) != null ? _c : "" : formatAmountDraftValue(preview.amountValue),
+    description: (_d = preview == null ? void 0 : preview.description) != null ? _d : "",
+    churnType: (_e = preview == null ? void 0 : preview.churnType) != null ? _e : ""
+  };
+}
+function hasEditableOpportunityPreview(preview) {
+  var _a;
+  return !!preview && isValidDateInput((_a = preview.closeDateValue) != null ? _a : preview.closeDate);
+}
+function isValidDateInput(value) {
+  const match = /^(\d{4})-(\d{2})-(\d{2})$/.exec(value);
+  if (!match) return false;
+  const parsed = /* @__PURE__ */ new Date(`${value}T00:00:00Z`);
+  if (Number.isNaN(parsed.getTime())) return false;
+  return parsed.toISOString().slice(0, 10) === value;
+}
 function Actions() {
+  var _a;
   const { approvalState, companyName, opportunityUrl, scheduledTime, labels, hideApproveButton, approveButtonIconUrl, opportunityPreview, requestingApproval, approve, submitApproveFeedback, skipApproveFeedback, dismiss, requestApproval, requestDismiss, cancel } = useSignalApproval();
   const [selectedTopReason, setSelectedTopReason] = React.useState(null);
   const [selectedSubReason, setSelectedSubReason] = React.useState(null);
@@ -296,6 +338,14 @@ function Actions() {
   const [detailText, setDetailText] = React.useState("");
   const [submittedFeedback, setSubmittedFeedback] = React.useState(null);
   const [isEditing, setIsEditing] = React.useState(false);
+  const [opportunityDraft, setOpportunityDraft] = React.useState(() => buildOpportunityDraft(opportunityPreview));
+  React.useEffect(() => {
+    if (approvalState === "confirming") {
+      setOpportunityDraft(buildOpportunityDraft(opportunityPreview));
+    }
+  }, [approvalState, opportunityPreview]);
+  const churnTypeOptions = (_a = opportunityPreview == null ? void 0 : opportunityPreview.churnTypeOptions) != null ? _a : [];
+  const hasChurnTypeOptions = churnTypeOptions.length > 0;
   const topNode = dismissReasonTree.find((n) => n.label === selectedTopReason);
   const hasSubOptions = !!((topNode == null ? void 0 : topNode.subOptions) && topNode.subOptions.length > 0);
   const isTopOther = selectedTopReason === "Other" && !hasSubOptions;
@@ -303,6 +353,8 @@ function Actions() {
   const needsText = isTopOther || isSubOther;
   const canSubmitDismiss = selectedTopReason !== null && (!hasSubOptions || selectedSubReason !== null) && (!needsText || detailText.trim().length > 0);
   const canSubmitApprove = selectedReasons.length > 0 || detailText.trim().length > 0;
+  const isEditableOpportunityPreview = hasEditableOpportunityPreview(opportunityPreview);
+  const canConfirmOpportunity = !isEditableOpportunityPreview || isValidDateInput(opportunityDraft.closeDate);
   const selectTopReason = (label) => {
     if (selectedTopReason === label) {
       setSelectedTopReason(null);
@@ -323,9 +375,9 @@ function Actions() {
     );
   };
   const startEditing = () => {
-    var _a, _b;
+    var _a2, _b;
     if (submittedFeedback) {
-      setSelectedTopReason((_a = submittedFeedback.reasons[0]) != null ? _a : null);
+      setSelectedTopReason((_a2 = submittedFeedback.reasons[0]) != null ? _a2 : null);
       setSelectedSubReason((_b = submittedFeedback.subReason) != null ? _b : null);
       setSelectedReasons([...submittedFeedback.reasons]);
       setDetailText(submittedFeedback.detail);
@@ -595,24 +647,108 @@ function Actions() {
           /* @__PURE__ */ jsx("strong", { children: companyName }),
           ". Confirm?"
         ] }),
-        opportunityPreview && /* @__PURE__ */ jsx("div", { className: "mt-3 space-y-1.5 border-t border-border/50 pt-3", children: [
+        opportunityPreview && !isEditableOpportunityPreview && /* @__PURE__ */ jsx("div", { className: "mt-3 space-y-2 border-t border-border/50 pt-3", children: [
           { label: "Opportunity", value: opportunityPreview.name },
           { label: "Account", value: opportunityPreview.accountName },
           { label: "Stage", value: opportunityPreview.stage },
           { label: "Close Date", value: opportunityPreview.closeDate },
           { label: "Amount", value: opportunityPreview.amount }
-        ].map(({ label, value }) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-xs", children: [
+        ].map(({ label, value }) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 text-xs", children: [
           /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: label }),
-          /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: value })
-        ] }, label)) })
+          /* @__PURE__ */ jsx("span", { className: "text-right font-medium text-foreground", children: value })
+        ] }, label)) }),
+        opportunityPreview && isEditableOpportunityPreview && /* @__PURE__ */ jsxs("div", { className: "mt-3 space-y-3 border-t border-border/50 pt-3", children: [
+          [
+            { label: "Opportunity", value: opportunityPreview.name },
+            { label: "Account", value: opportunityPreview.accountName },
+            { label: "Stage", value: opportunityPreview.stage }
+          ].map(({ label, value }) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 text-xs", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: label }),
+            /* @__PURE__ */ jsx("span", { className: "text-right font-medium text-foreground", children: value })
+          ] }, label)),
+          /* @__PURE__ */ jsxs("div", { className: "grid gap-2 sm:grid-cols-2", children: [
+            /* @__PURE__ */ jsxs("label", { className: "space-y-1 text-xs", children: [
+              /* @__PURE__ */ jsx("span", { className: "font-medium text-muted-foreground", children: "Close Date" }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "date",
+                  value: opportunityDraft.closeDate,
+                  onChange: (event) => setOpportunityDraft((draft) => __spreadProps(__spreadValues({}, draft), { closeDate: event.target.value })),
+                  "aria-invalid": !canConfirmOpportunity,
+                  className: "h-8 w-full rounded-md border border-border bg-background px-2 text-xs text-foreground focus:outline-none focus:ring-1 focus:ring-ring"
+                }
+              ),
+              !canConfirmOpportunity && /* @__PURE__ */ jsx("span", { className: "text-[11px] text-red-600", children: "Enter a valid close date." })
+            ] }),
+            /* @__PURE__ */ jsxs("label", { className: "space-y-1 text-xs", children: [
+              /* @__PURE__ */ jsx("span", { className: "font-medium text-muted-foreground", children: "Amount" }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "text",
+                  inputMode: "decimal",
+                  value: opportunityDraft.amount,
+                  onChange: (event) => setOpportunityDraft((draft) => __spreadProps(__spreadValues({}, draft), { amount: event.target.value })),
+                  placeholder: opportunityPreview.amount,
+                  className: "h-8 w-full rounded-md border border-border bg-background px-2 text-xs text-foreground placeholder:text-muted-foreground/60 focus:outline-none focus:ring-1 focus:ring-ring"
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("label", { className: "space-y-1 text-xs", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-medium text-muted-foreground", children: "Churn Type" }),
+            hasChurnTypeOptions ? /* @__PURE__ */ jsxs(
+              "select",
+              {
+                value: opportunityDraft.churnType,
+                onChange: (event) => setOpportunityDraft((draft) => __spreadProps(__spreadValues({}, draft), { churnType: event.target.value })),
+                className: "h-8 w-full rounded-md border border-border bg-background px-2 text-xs text-foreground focus:outline-none focus:ring-1 focus:ring-ring",
+                children: [
+                  /* @__PURE__ */ jsx("option", { value: "", children: "No churn type" }),
+                  churnTypeOptions.map((option) => /* @__PURE__ */ jsx("option", { value: optionValue(option), children: optionLabel(option) }, optionValue(option)))
+                ]
+              }
+            ) : /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                value: opportunityDraft.churnType,
+                onChange: (event) => setOpportunityDraft((draft) => __spreadProps(__spreadValues({}, draft), { churnType: event.target.value })),
+                placeholder: "No churn type",
+                className: "h-8 w-full rounded-md border border-border bg-background px-2 text-xs text-foreground placeholder:text-muted-foreground/60 focus:outline-none focus:ring-1 focus:ring-ring"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("label", { className: "space-y-1 text-xs", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-medium text-muted-foreground", children: "Description" }),
+            /* @__PURE__ */ jsx(
+              "textarea",
+              {
+                value: opportunityDraft.description,
+                onChange: (event) => setOpportunityDraft((draft) => __spreadProps(__spreadValues({}, draft), { description: event.target.value })),
+                rows: 3,
+                placeholder: "Add a short description",
+                className: "w-full resize-none rounded-md border border-border bg-background px-2 py-1.5 text-xs text-foreground placeholder:text-muted-foreground/60 focus:outline-none focus:ring-1 focus:ring-ring"
+              }
+            )
+          ] })
+        ] })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ jsxs(
           "button",
           {
             type: "button",
-            onClick: approve,
-            className: "inline-flex h-7 items-center gap-1.5 rounded-md bg-foreground px-3 text-xs font-semibold text-background transition-colors hover:bg-foreground/90",
+            onClick: () => {
+              if (!opportunityPreview) {
+                approve();
+                return;
+              }
+              approve(isEditableOpportunityPreview ? opportunityDraft : void 0);
+            },
+            disabled: !canConfirmOpportunity,
+            className: "inline-flex h-7 items-center gap-1.5 rounded-md bg-foreground px-3 text-xs font-semibold text-background transition-colors hover:bg-foreground/90 disabled:cursor-not-allowed disabled:bg-muted disabled:text-muted-foreground",
             children: [
               /* @__PURE__ */ jsx(Check, { className: "h-3 w-3" }),
               "Confirm"