@handled-ai/design-system 0.19.2 → 0.20.1

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-CZitE9xq.js';
+import { Q as QueueItem, m as SignalScoreData, p as SignalScoreUrgencyLabel } from '../signal-priority-popover-BJHd07dU.js';
 import './feedback-primitives.js';
 import './quick-action-sidebar-nav.js';
 import './quick-action-modal.js';

package/dist/components/signal-priority-popover.d.ts

@@ -1,6 +1,6 @@
 import 'react';
 import './feedback-primitives.js';
-export { P as PriorityFactor, S as SignalPriorityPopover, k as SignalPriorityPopoverProps, l as SignalPriorityScoreDisplay } from '../signal-priority-popover-CZitE9xq.js';
+export { P as PriorityFactor, S as SignalPriorityPopover, k as SignalPriorityPopoverProps, l as SignalPriorityScoreDisplay } from '../signal-priority-popover-BJHd07dU.js';
 import './quick-action-sidebar-nav.js';
 import './quick-action-modal.js';
 import './score-breakdown.js';

package/dist/index.d.ts

@@ -40,7 +40,7 @@ export { EmptyState, EmptyStateProps } from './components/empty-state.js';
 export { ActivityItem, ConnectedApps, EntityActivityItem, EntityDetails, EntityMetadataField, EntityMetadataGrid, EntityPanel, EntityPanelBrandIcons, EntityPanelHeader, EntityPanelTabs, EntitySection, PanelMode, PotentialContacts, RecentActivity, SystemActivity, useEntityPanel } from './components/entity-panel.js';
 export { RelatedRecordActionCard, RelatedRecordActionCardKind, RelatedRecordActionCardProps, RelatedRecordActionIcon } from './components/related-record-action-card.js';
 export { FeedbackActions, FeedbackActionsProps, FeedbackChipGroup, FeedbackChipGroupProps, FeedbackChipTree, FeedbackFooter, FeedbackFooterProps, FeedbackInput, FeedbackInputProps, FeedbackSubmitData, InlineFeedbackControl, InlineFeedbackControlProps, PersistedFeedbackData } from './components/feedback-primitives.js';
-export { A as AccountFilterTab, a as AccountsViewConfig, b as AdminTab, c as AdminViewConfig, B as BriefStyleVariant, E as EntityPanelConfig, d as EntityPanelSection, I as InboxDetailSections, e as InboxSortOption, f as InboxViewConfig, g as InsightsCustomTab, h as InsightsViewConfig, P as PriorityFactor, i as PrototypeBrandConfig, j as PrototypeConfig, Q as QueueItem, S as SignalPriorityPopover, k as SignalPriorityPopoverProps, l as SignalPriorityScoreDisplay, m as SignalScoreData, n as SignalScoreExplanationBucket, o as SignalScoreExplanationSignal, p as SignalScoreUrgencyLabel, T as TimelineSystemEventsConfig, W as WorkQueueViewConfig } from './signal-priority-popover-CZitE9xq.js';
+export { A as AccountFilterTab, a as AccountsViewConfig, b as AdminTab, c as AdminViewConfig, B as BriefStyleVariant, E as EntityPanelConfig, d as EntityPanelSection, I as InboxDetailSections, e as InboxSortOption, f as InboxViewConfig, g as InsightsCustomTab, h as InsightsViewConfig, P as PriorityFactor, i as PrototypeBrandConfig, j as PrototypeConfig, Q as QueueItem, S as SignalPriorityPopover, k as SignalPriorityPopoverProps, l as SignalPriorityScoreDisplay, m as SignalScoreData, n as SignalScoreExplanationBucket, o as SignalScoreExplanationSignal, p as SignalScoreUrgencyLabel, T as TimelineSystemEventsConfig, W as WorkQueueViewConfig } from './signal-priority-popover-BJHd07dU.js';
 export { FilterChip, FilterChipProps } from './components/filter-chip.js';
 export { InboxGroupHeader, InboxRow, InboxRowProps } from './components/inbox-row.js';
 export { AssigneeFilter, InboxFilterCategory, InboxToolbar, InboxToolbarProps } from './components/inbox-toolbar.js';

package/dist/prototype/index.d.ts

@@ -1,4 +1,4 @@
-export { A as AccountFilterTab, a as AccountsViewConfig, b as AdminTab, c as AdminViewConfig, B as BriefStyleVariant, E as EntityPanelConfig, d as EntityPanelSection, I as InboxDetailSections, e as InboxSortOption, f as InboxViewConfig, g as InsightsCustomTab, h as InsightsViewConfig, i as PrototypeBrandConfig, j as PrototypeConfig, Q as QueueItem, m as SignalScoreData, n as SignalScoreExplanationBucket, o as SignalScoreExplanationSignal, p as SignalScoreUrgencyLabel, T as TimelineSystemEventsConfig, W as WorkQueueViewConfig } from '../signal-priority-popover-CZitE9xq.js';
+export { A as AccountFilterTab, a as AccountsViewConfig, b as AdminTab, c as AdminViewConfig, B as BriefStyleVariant, E as EntityPanelConfig, d as EntityPanelSection, I as InboxDetailSections, e as InboxSortOption, f as InboxViewConfig, g as InsightsCustomTab, h as InsightsViewConfig, i as PrototypeBrandConfig, j as PrototypeConfig, Q as QueueItem, m as SignalScoreData, n as SignalScoreExplanationBucket, o as SignalScoreExplanationSignal, p as SignalScoreUrgencyLabel, T as TimelineSystemEventsConfig, W as WorkQueueViewConfig } from '../signal-priority-popover-BJHd07dU.js';
 export { PrototypeShell, PrototypeShellProps } from './prototype-shell.js';
 export { DetailView, DetailViewProps, PrototypeInboxView, PrototypeInboxViewProps } from './prototype-inbox-view.js';
 export { PrototypeInsightsView, PrototypeInsightsViewProps } from './prototype-insights-view.js';

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { a as AccountsViewConfig } from '../signal-priority-popover-CZitE9xq.js';
+import { a as AccountsViewConfig } from '../signal-priority-popover-BJHd07dU.js';
 import { DataRow } from '../components/data-table.js';
 import '../components/feedback-primitives.js';
 import '../components/quick-action-sidebar-nav.js';

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { c as AdminViewConfig } from '../signal-priority-popover-CZitE9xq.js';
+import { c as AdminViewConfig } from '../signal-priority-popover-BJHd07dU.js';
 import '../components/feedback-primitives.js';
 import '../components/quick-action-sidebar-nav.js';
 import '../components/quick-action-modal.js';

package/dist/prototype/prototype-config.d.ts

@@ -11,7 +11,7 @@ import '../charts/pipeline-overview.js';
 import '../components/timeline-activity.js';
 import '../components/signal-feedback-inline.js';
 import 'lucide-react';
-export { A as AccountFilterTab, a as AccountsViewConfig, b as AdminTab, c as AdminViewConfig, B as BriefStyleVariant, E as EntityPanelConfig, d as EntityPanelSection, I as InboxDetailSections, e as InboxSortOption, f as InboxViewConfig, g as InsightsCustomTab, h as InsightsViewConfig, i as PrototypeBrandConfig, j as PrototypeConfig, Q as QueueItem, m as SignalScoreData, n as SignalScoreExplanationBucket, o as SignalScoreExplanationSignal, p as SignalScoreUrgencyLabel, T as TimelineSystemEventsConfig, W as WorkQueueViewConfig } from '../signal-priority-popover-CZitE9xq.js';
+export { A as AccountFilterTab, a as AccountsViewConfig, b as AdminTab, c as AdminViewConfig, B as BriefStyleVariant, E as EntityPanelConfig, d as EntityPanelSection, I as InboxDetailSections, e as InboxSortOption, f as InboxViewConfig, g as InsightsCustomTab, h as InsightsViewConfig, i as PrototypeBrandConfig, j as PrototypeConfig, Q as QueueItem, m as SignalScoreData, n as SignalScoreExplanationBucket, o as SignalScoreExplanationSignal, p as SignalScoreUrgencyLabel, T as TimelineSystemEventsConfig, W as WorkQueueViewConfig } from '../signal-priority-popover-BJHd07dU.js';
 import '../components/feedback-primitives.js';
 import '../components/quick-action-modal.js';
 import '../components/score-semantics.js';

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

@@ -3,7 +3,7 @@ import { OpportunityDraft, ApprovalState, OpportunityPreview } from '../componen
 import { SourceDef } from '../components/detail-view.js';
 import { SuggestedAction, SuggestedContact } from '../components/suggested-actions.js';
 import { TimelineEvent } from '../components/timeline-activity.js';
-import { Q as QueueItem, I as InboxDetailSections, m as SignalScoreData, f as InboxViewConfig, B as BriefStyleVariant, T as TimelineSystemEventsConfig } from '../signal-priority-popover-CZitE9xq.js';
+import { Q as QueueItem, I as InboxDetailSections, m as SignalScoreData, f as InboxViewConfig, B as BriefStyleVariant, T as TimelineSystemEventsConfig } from '../signal-priority-popover-BJHd07dU.js';
 import '../components/feedback-primitives.js';
 import '../components/quick-action-sidebar-nav.js';
 import '../components/quick-action-modal.js';
@@ -47,11 +47,17 @@ interface DetailViewProps {
     hideApproveButton?: boolean;
     signalBriefCopy?: InboxViewConfig["signalBriefCopy"];
     briefStyleVariant?: BriefStyleVariant;
+    /** Opt-in detail panel section ordering. Defaults to the existing layout. */
+    sectionLayout?: InboxViewConfig["sectionLayout"];
     renderDetailExtra?: (item: QueueItem) => React.ReactNode;
     /** Render content between the signal brief text and the signal score bar (e.g. "Signals on Case" chips). */
     renderBeforeScore?: (item: QueueItem) => React.ReactNode;
     /** Render content between the signal score section and the activity timeline. */
     renderAfterScore?: (item: QueueItem) => React.ReactNode;
+    /** Render primary case-panel content between the opportunity section and comment area. */
+    renderPrimaryAction?: (item: QueueItem) => React.ReactNode;
+    /** Render case-panel comment content before the activity timeline. */
+    renderCommentArea?: (item: QueueItem) => React.ReactNode;
     lastActivityTime?: string;
     /** Render extra content inline with the detail title. */
     renderTitleExtra?: (item: QueueItem) => React.ReactNode;
@@ -61,6 +67,13 @@ interface DetailViewProps {
     renderTitleSubtext?: (item: QueueItem) => React.ReactNode;
     /** Render extra metadata chips (e.g. assignee) inside the chips row below the title. */
     renderMetadataExtra?: (item: QueueItem) => React.ReactNode;
+    /**
+     * Where the metadata chips row (priority · deadline · account · renderMetadataExtra) sits.
+     * - "default": above the signal brief (legacy layout, unchanged for existing consumers).
+     * - "below-brief": moved beneath the brief text, just before `renderBeforeScore`
+     *   (case-panel redesign — chips + owners read as one block under the brief).
+     */
+    metadataLayout?: "default" | "below-brief";
     /** Override the built-in account details metadata button label. */
     accountDetailsButtonLabel?: (item: QueueItem) => React.ReactNode;
     /** Accessible label for the built-in account details metadata button. */
@@ -88,7 +101,7 @@ interface DetailViewProps {
     /** @deprecated Use `timelineSystemEventsConfig.visibleHint`. */
     timelineSystemEventsVisibleHint?: string;
 }
-declare function DetailView({ item, sections, getSignalScore, buildSuggestedActions, buildSourceItems: _buildSourceItems, getTimelineEvents, accountContacts, emailSignature, iconMap, onOpenEntityPanel, onOpenRecentActivity, onSuggestedActionFeedback: _onSuggestedActionFeedback, onScoreFeedback: _onScoreFeedback, onSignalApprove, getSignalApprovalState, signalLabels, hideApproveButton, signalBriefCopy, briefStyleVariant, renderDetailExtra, renderBeforeScore, renderAfterScore, lastActivityTime, renderTitleExtra, renderTitleActionRow, renderTitleSubtext, renderMetadataExtra, accountDetailsButtonLabel, getAccountDetailsButtonAriaLabel, onOpenSignalBucket, approveButtonIconUrl, opportunityPreview, onRequestApproval, attentionCount, timelineSystemEventsConfig: configProp, timelineSystemEventsToggleLabel, timelineSystemEventsStorageKey, timelineSystemEventsDefaultVisible, timelineSystemEventsHiddenHint, timelineSystemEventsVisibleHint, }: DetailViewProps): React.JSX.Element;
-declare function PrototypeInboxView({ items, filterCategories, detailSections, accountContacts, buildAccountContacts, emailSignature, buildSuggestedActions: buildSuggestedActionsProp, buildSourceItems: buildSourceItemsProp, getSignalScore: getSignalScoreProp, getTimelineEvents, iconMap, hideToolbarActions, hideHoverActions, onSuggestedActionFeedback, onScoreFeedback, onOpenSignalBucket, headerActions, onOpenEntityPanel, onOpenRecentActivity, onItemSelect, defaultViewMode, buildEntityChips, quickFilterTabs, hideAccountsButton, accountDetailsLabel, onSignalApprove, getSignalApprovalState, signalLabels, hideApproveButton, signalBriefCopy, briefStyleVariant, renderDetailExtra, renderBeforeScore, renderAfterScore, lastActivityTime, timelineSystemEventsConfig, attentionCount, renderTitleExtra, renderTitleActionRow, renderTitleSubtext, accountDetailsButtonLabel, getAccountDetailsButtonAriaLabel, sortOptions, activeSortId, onSortChange, }: PrototypeInboxViewProps): React.JSX.Element;
+declare function DetailView({ item, sections, getSignalScore, buildSuggestedActions, buildSourceItems: _buildSourceItems, getTimelineEvents, accountContacts, emailSignature, iconMap, onOpenEntityPanel, onOpenRecentActivity, onSuggestedActionFeedback: _onSuggestedActionFeedback, onScoreFeedback: _onScoreFeedback, onSignalApprove, getSignalApprovalState, signalLabels, hideApproveButton, signalBriefCopy, briefStyleVariant, sectionLayout, renderDetailExtra, renderBeforeScore, renderAfterScore, renderPrimaryAction, renderCommentArea, lastActivityTime, renderTitleExtra, renderTitleActionRow, renderTitleSubtext, renderMetadataExtra, metadataLayout, accountDetailsButtonLabel, getAccountDetailsButtonAriaLabel, onOpenSignalBucket, approveButtonIconUrl, opportunityPreview, onRequestApproval, attentionCount, timelineSystemEventsConfig: configProp, timelineSystemEventsToggleLabel, timelineSystemEventsStorageKey, timelineSystemEventsDefaultVisible, timelineSystemEventsHiddenHint, timelineSystemEventsVisibleHint, }: DetailViewProps): React.JSX.Element;
+declare function PrototypeInboxView({ items, filterCategories, detailSections, accountContacts, buildAccountContacts, emailSignature, buildSuggestedActions: buildSuggestedActionsProp, buildSourceItems: buildSourceItemsProp, getSignalScore: getSignalScoreProp, getTimelineEvents, iconMap, hideToolbarActions, hideHoverActions, onSuggestedActionFeedback, onScoreFeedback, onOpenSignalBucket, headerActions, onOpenEntityPanel, onOpenRecentActivity, onItemSelect, defaultViewMode, buildEntityChips, quickFilterTabs, hideAccountsButton, accountDetailsLabel, onSignalApprove, getSignalApprovalState, signalLabels, hideApproveButton, signalBriefCopy, briefStyleVariant, sectionLayout, renderDetailExtra, renderBeforeScore, renderAfterScore, renderPrimaryAction, renderCommentArea, lastActivityTime, timelineSystemEventsConfig, attentionCount, renderTitleExtra, renderTitleActionRow, renderTitleSubtext, accountDetailsButtonLabel, getAccountDetailsButtonAriaLabel, sortOptions, activeSortId, onSortChange, }: PrototypeInboxViewProps): React.JSX.Element;
 
 export { DetailView, type DetailViewProps, PrototypeInboxView, type PrototypeInboxViewProps };

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

@@ -206,14 +206,18 @@ function DetailView({
   hideApproveButton,
   signalBriefCopy,
   briefStyleVariant = "default",
+  sectionLayout = "default",
   renderDetailExtra,
   renderBeforeScore,
   renderAfterScore,
+  renderPrimaryAction,
+  renderCommentArea,
   lastActivityTime,
   renderTitleExtra,
   renderTitleActionRow,
   renderTitleSubtext,
   renderMetadataExtra,
+  metadataLayout = "default",
   accountDetailsButtonLabel,
   getAccountDetailsButtonAriaLabel,
   onOpenSignalBucket,
@@ -308,6 +312,95 @@ function DetailView({
     },
     [suggestedActions]
   );
+  const timeChipToneClass = signalData.timeChipTone === "red" ? "border-red-300 bg-red-50 text-red-700 hover:bg-red-50" : signalData.timeChipTone === "amber" ? "border-amber-300 bg-amber-50 text-amber-700 hover:bg-amber-50" : "hover:bg-muted/50";
+  const isCasePanelV2 = sectionLayout === "case-panel-v2";
+  const v2WhyText = signalData.signalBrief ? signalData.whyNow || signalData.urgencyExplanation : void 0;
+  const metadataChips = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      SignalPriorityPopover,
+      {
+        score: signalData.score,
+        urgencyLabel: signalData.urgencyLabel,
+        urgencyExplanation: (_b = signalData.urgencyExplanation) != null ? _b : signalData.signalBrief,
+        scoreDisplay: signalData.priorityScoreDisplay,
+        formulaLabel: signalData.priorityFormulaLabel,
+        factors: (_c = signalData.priorityFactors) != null ? _c : [],
+        metaText: void 0,
+        feedbackChips: signalData.priorityFeedbackChips,
+        onFeedbackSubmit: signalData.onPriorityFeedback,
+        initialFactorFeedback: signalData.initialFactorPopoverFeedback,
+        onFactorFeedback: signalData.onFactorFeedback,
+        initialPriorityFeedback: signalData.initialPriorityFeedback
+      }
+    ),
+    signalData.timeChipLabel && /* @__PURE__ */ jsx(
+      Badge,
+      {
+        variant: "outline",
+        title: (_d = signalData.timeChipDetail) != null ? _d : void 0,
+        className: `transition-colors ${timeChipToneClass}`,
+        children: signalData.timeChipLabel
+      }
+    ),
+    /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 300, children: /* @__PURE__ */ jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: onOpenEntityPanel,
+          className: "group/account ml-1 inline-flex max-w-full items-center gap-2 rounded-md border border-border/60 bg-background px-2 py-1 transition-colors hover:border-border hover:bg-muted/50",
+          "aria-label": (_e = getAccountDetailsButtonAriaLabel == null ? void 0 : getAccountDetailsButtonAriaLabel(item)) != null ? _e : `View account details for ${item.company}`,
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center rounded bg-foreground text-[9px] font-semibold uppercase leading-none text-background", children: getCompanyInitials(item.company) }),
+            accountDetailsButtonLabel ? /* @__PURE__ */ jsx("span", { className: "inline-flex min-w-0 items-center gap-1.5 text-xs font-medium text-foreground", children: accountDetailsButtonLabel(item) }) : /* @__PURE__ */ jsx("span", { className: "truncate text-xs font-medium text-foreground", children: item.company }),
+            /* @__PURE__ */ jsxs("span", { className: "flex shrink-0 items-center gap-1.5", children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  "aria-hidden": true,
+                  className: `h-1.5 w-1.5 shrink-0 rounded-full ${(_f = STATUS_DOT_CLASS[item.statusColor]) != null ? _f : "bg-muted-foreground/40"}`
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: "-ml-1.5 grid grid-cols-[0fr] transition-all duration-200 ease-out group-hover/account:ml-0 group-hover/account:grid-cols-[1fr]", children: /* @__PURE__ */ jsx("span", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "block whitespace-nowrap text-xs font-medium text-muted-foreground/80", children: "View account" }) }) }),
+              /* @__PURE__ */ jsx(ChevronRight, { className: "h-3 w-3 shrink-0 text-muted-foreground/50 transition-transform duration-150 group-hover/account:translate-x-0.5 group-hover/account:text-muted-foreground" })
+            ] })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsx(TooltipContent, { children: "Open account panel" })
+    ] }) }),
+    renderMetadataExtra == null ? void 0 : renderMetadataExtra(item)
+  ] });
+  const timelineSection = sections.timeline && timelineEvents.length > 0 ? /* @__PURE__ */ jsx(
+    TimelineSection,
+    {
+      timelineEvents,
+      showTimeline,
+      setShowTimeline,
+      showSystemEvents,
+      setShowSystemEvents,
+      attentionCount,
+      sysEvtConfig,
+      lastActivityTime
+    }
+  ) : null;
+  const suggestedActionsSection = sections.suggestedActions ? /* @__PURE__ */ jsx(SignalApproval.Gate, { children: /* @__PURE__ */ jsx(
+    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)
+    }
+  ) }) : null;
   return /* @__PURE__ */ jsx(
     SignalApproval.Root,
     {
@@ -330,21 +423,7 @@ function DetailView({
       },
       children: /* @__PURE__ */ jsxs("div", { className: "mx-auto w-full max-w-3xl p-6 pb-12 md:p-8", children: [
         /* @__PURE__ */ jsxs("div", { className: "pb-8", children: [
-          /* @__PURE__ */ jsxs("div", { className: "mb-4 flex items-center gap-2", children: [
-            /* @__PURE__ */ jsxs(
-              "button",
-              {
-                type: "button",
-                className: "flex items-center gap-1.5 text-xs font-medium text-muted-foreground transition-colors hover:text-foreground",
-                children: [
-                  /* @__PURE__ */ jsx(ArrowLeft, { className: "h-3.5 w-3.5" }),
-                  "Back"
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/40", children: "\xB7" }),
-            /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: item.company })
-          ] }),
+          /* @__PURE__ */ jsx("div", { className: "mb-4 flex items-center gap-2", children: /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: item.company }) }),
           /* @__PURE__ */ jsxs("div", { className: "mb-3 space-y-3", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-start gap-x-3 gap-y-2", children: [
               /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
@@ -355,62 +434,7 @@ function DetailView({
             ] }),
             renderTitleActionRow ? /* @__PURE__ */ jsx("div", { className: "flex w-full flex-wrap items-center gap-2", children: renderTitleActionRow(item) }) : null
           ] }),
-          /* @__PURE__ */ jsxs("div", { className: "mb-6 flex flex-wrap items-center gap-2", children: [
-            /* @__PURE__ */ jsx(
-              SignalPriorityPopover,
-              {
-                score: signalData.score,
-                urgencyLabel: signalData.urgencyLabel,
-                urgencyExplanation: (_b = signalData.urgencyExplanation) != null ? _b : signalData.signalBrief,
-                scoreDisplay: signalData.priorityScoreDisplay,
-                formulaLabel: signalData.priorityFormulaLabel,
-                factors: (_c = signalData.priorityFactors) != null ? _c : [],
-                metaText: void 0,
-                feedbackChips: signalData.priorityFeedbackChips,
-                onFeedbackSubmit: signalData.onPriorityFeedback,
-                initialFactorFeedback: signalData.initialFactorPopoverFeedback,
-                onFactorFeedback: signalData.onFactorFeedback,
-                initialPriorityFeedback: signalData.initialPriorityFeedback
-              }
-            ),
-            signalData.timeChipLabel && /* @__PURE__ */ jsx(
-              Badge,
-              {
-                variant: "outline",
-                title: (_d = signalData.timeChipDetail) != null ? _d : void 0,
-                className: "transition-colors hover:bg-muted/50",
-                children: signalData.timeChipLabel
-              }
-            ),
-            /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 300, children: /* @__PURE__ */ jsxs(Tooltip, { children: [
-              /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
-                "button",
-                {
-                  type: "button",
-                  onClick: onOpenEntityPanel,
-                  className: "group/account ml-1 inline-flex max-w-full items-center gap-2 rounded-md border border-border/60 bg-background px-2 py-1 transition-colors hover:border-border hover:bg-muted/50",
-                  "aria-label": (_e = getAccountDetailsButtonAriaLabel == null ? void 0 : getAccountDetailsButtonAriaLabel(item)) != null ? _e : `View account details for ${item.company}`,
-                  children: [
-                    /* @__PURE__ */ jsx("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center rounded bg-foreground text-[9px] font-semibold uppercase leading-none text-background", children: getCompanyInitials(item.company) }),
-                    accountDetailsButtonLabel ? /* @__PURE__ */ jsx("span", { className: "inline-flex min-w-0 items-center gap-1.5 text-xs font-medium text-foreground", children: accountDetailsButtonLabel(item) }) : /* @__PURE__ */ jsx("span", { className: "truncate text-xs font-medium text-foreground", children: item.company }),
-                    /* @__PURE__ */ jsxs("span", { className: "flex shrink-0 items-center gap-1.5", children: [
-                      /* @__PURE__ */ jsx(
-                        "span",
-                        {
-                          "aria-hidden": true,
-                          className: `h-1.5 w-1.5 shrink-0 rounded-full ${(_f = STATUS_DOT_CLASS[item.statusColor]) != null ? _f : "bg-muted-foreground/40"}`
-                        }
-                      ),
-                      /* @__PURE__ */ jsx("span", { className: "-ml-1.5 grid grid-cols-[0fr] transition-all duration-200 ease-out group-hover/account:ml-0 group-hover/account:grid-cols-[1fr]", children: /* @__PURE__ */ jsx("span", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "block whitespace-nowrap text-xs font-medium text-muted-foreground/80", children: "View account" }) }) }),
-                      /* @__PURE__ */ jsx(ChevronRight, { className: "h-3 w-3 shrink-0 text-muted-foreground/50 transition-transform duration-150 group-hover/account:translate-x-0.5 group-hover/account:text-muted-foreground" })
-                    ] })
-                  ]
-                }
-              ) }),
-              /* @__PURE__ */ jsx(TooltipContent, { children: "Open account panel" })
-            ] }) }),
-            renderMetadataExtra == null ? void 0 : renderMetadataExtra(item)
-          ] }),
+          !isCasePanelV2 && metadataLayout === "default" ? /* @__PURE__ */ jsx("div", { className: "mb-6 flex flex-wrap items-center gap-2", children: metadataChips }) : null,
           sections.signalBrief && (() => {
             var _a2;
             const briefHeading = (_a2 = signalBriefCopy == null ? void 0 : signalBriefCopy.heading) != null ? _a2 : "Signal brief";
@@ -421,51 +445,51 @@ function DetailView({
               briefHeading ? /* @__PURE__ */ jsx("h3", { className: "text-xs font-bold text-muted-foreground uppercase tracking-wider mb-3", children: briefHeading }) : null,
               briefIntro && !signalData.signalBrief ? /* @__PURE__ */ jsx("p", { className: isProminent ? "text-sm text-foreground/70 leading-relaxed mb-2" : "text-sm text-muted-foreground leading-relaxed mb-2", children: briefIntro }) : null,
               signalData.signalBrief ? /* @__PURE__ */ jsx("p", { className: isProminent ? "text-base text-foreground leading-relaxed mb-4" : "text-sm text-foreground/90 leading-relaxed mb-4", children: signalData.signalBrief }) : /* @__PURE__ */ jsx("p", { className: isProminent ? "text-base text-foreground leading-relaxed mb-4" : "text-sm text-foreground/90 leading-relaxed mb-4", children: signalData.whyNow }),
-              renderBeforeScore == null ? void 0 : renderBeforeScore(item),
-              /* @__PURE__ */ jsx(
-                ScoreWhyChips,
-                {
-                  item,
-                  signalData,
-                  onOpenSignalBucket
-                }
-              ),
-              /* @__PURE__ */ jsx("div", { className: "mt-4", children: /* @__PURE__ */ jsx(SignalApproval.Actions, {}) })
+              isCasePanelV2 || metadataLayout === "below-brief" ? /* @__PURE__ */ jsx("div", { className: "mb-4 flex flex-wrap items-center gap-2", children: metadataChips }) : null,
+              !isCasePanelV2 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                renderBeforeScore == null ? void 0 : renderBeforeScore(item),
+                /* @__PURE__ */ jsx(
+                  ScoreWhyChips,
+                  {
+                    item,
+                    signalData,
+                    onOpenSignalBucket
+                  }
+                ),
+                /* @__PURE__ */ jsx("div", { className: "mt-4", children: /* @__PURE__ */ jsx(SignalApproval.Actions, {}) })
+              ] }) : null
             ] });
           })(),
-          renderAfterScore == null ? void 0 : renderAfterScore(item),
-          sections.timeline && timelineEvents.length > 0 && /* @__PURE__ */ jsx(
-            TimelineSection,
-            {
-              timelineEvents,
-              showTimeline,
-              setShowTimeline,
-              showSystemEvents,
-              setShowSystemEvents,
-              attentionCount,
-              sysEvtConfig,
-              lastActivityTime
-            }
-          )
+          isCasePanelV2 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            sections.signalBrief ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              renderBeforeScore == null ? void 0 : renderBeforeScore(item),
+              v2WhyText ? /* @__PURE__ */ jsxs("div", { className: "mb-8", children: [
+                /* @__PURE__ */ jsx("h3", { className: "text-xs font-bold text-muted-foreground uppercase tracking-wider mb-3", children: "The why" }),
+                /* @__PURE__ */ jsx("p", { className: "text-sm text-foreground/90 leading-relaxed mb-4", children: v2WhyText })
+              ] }) : null,
+              /* @__PURE__ */ jsxs("div", { className: "mb-8", children: [
+                /* @__PURE__ */ jsx(
+                  ScoreWhyChips,
+                  {
+                    item,
+                    signalData,
+                    onOpenSignalBucket
+                  }
+                ),
+                /* @__PURE__ */ jsx("div", { className: "mt-4", children: /* @__PURE__ */ jsx(SignalApproval.Actions, {}) })
+              ] })
+            ] }) : null,
+            renderAfterScore == null ? void 0 : renderAfterScore(item),
+            renderPrimaryAction == null ? void 0 : renderPrimaryAction(item),
+            renderCommentArea == null ? void 0 : renderCommentArea(item),
+            timelineSection
+          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            renderAfterScore == null ? void 0 : renderAfterScore(item),
+            timelineSection
+          ] })
         ] }),
-        sections.suggestedActions && /* @__PURE__ */ jsx(SignalApproval.Gate, { children: /* @__PURE__ */ jsx(
-          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)
-          }
-        ) }),
-        renderDetailExtra == null ? void 0 : renderDetailExtra(item)
+        !isCasePanelV2 ? suggestedActionsSection : null,
+        !isCasePanelV2 ? renderDetailExtra == null ? void 0 : renderDetailExtra(item) : null
       ] })
     },
     item.id
@@ -503,9 +527,12 @@ function PrototypeInboxView({
   hideApproveButton,
   signalBriefCopy,
   briefStyleVariant,
+  sectionLayout,
   renderDetailExtra,
   renderBeforeScore,
   renderAfterScore,
+  renderPrimaryAction,
+  renderCommentArea,
   lastActivityTime,
   timelineSystemEventsConfig,
   attentionCount,
@@ -705,9 +732,12 @@ function PrototypeInboxView({
     hideApproveButton,
     signalBriefCopy,
     briefStyleVariant,
+    sectionLayout,
     renderDetailExtra,
     renderBeforeScore,
     renderAfterScore,
+    renderPrimaryAction,
+    renderCommentArea,
     lastActivityTime,
     timelineSystemEventsConfig,
     attentionCount,