@handled-ai/design-system 0.18.48 → 0.18.50

package/dist/{signal-priority-popover-QJngMAj7.d.ts → signal-priority-popover-Cl98xw1n.d.ts}

@@ -10,7 +10,7 @@ import { DataRow } from './components/data-table.js';
 import { MetricCardProps } from './components/metric-card.js';
 import { PipelineStage, PipelineStageMetrics, PipelineStageTiming } from './charts/pipeline-overview.js';
 import { TimelineEvent } from './components/timeline-activity.js';
-import { OpportunityDraft, ApprovalState } from './components/signal-feedback-inline.js';
+import { ApprovalState } from './components/signal-feedback-inline.js';
 import { LucideIcon } from 'lucide-react';
 
 interface TimelineSystemEventsConfig {
@@ -93,6 +93,8 @@ interface SignalScoreData {
     confidence: number;
     urgencyLabel?: SignalScoreUrgencyLabel;
     urgencyExplanation?: string;
+    /** Controls whether the priority popover header shows the raw overall score number. @default "number" */
+    priorityScoreDisplay?: SignalPriorityScoreDisplay;
     explanationBuckets?: SignalScoreExplanationBucket[];
     onFactorFeedback?: (factorKey: string, type: "up" | "down" | null, detail?: string) => void;
     /** @deprecated The compact score UX no longer renders score-level thumbs by default. */
@@ -181,7 +183,7 @@ interface InboxViewConfig {
     }>;
     hideAccountsButton?: boolean;
     accountDetailsLabel?: string;
-    onSignalApprove?: (item: QueueItem, draft?: OpportunityDraft) => void | Promise<boolean>;
+    onSignalApprove?: (item: QueueItem) => void | Promise<boolean>;
     getSignalApprovalState?: (item: QueueItem) => ApprovalState | undefined;
     signalLabels?: {
         approveButton?: string;
@@ -412,8 +414,11 @@ interface PriorityFactor {
     /** Evidence text (e.g. "$3.4M moved in 8h - current treasury balance $0.00"). */
     rationale: string;
 }
+type SignalPriorityScoreDisplay = "label" | "number";
 interface SignalPriorityPopoverProps {
     score: number;
+    /** Controls whether the overall score number is shown in the popover header. @default "number" */
+    scoreDisplay?: SignalPriorityScoreDisplay;
     urgencyLabel?: SignalScoreUrgencyLabel;
     /** Synthesis sentence displayed in the popover head. */
     urgencyExplanation?: string;
@@ -435,6 +440,6 @@ interface SignalPriorityPopoverProps {
     /** Persisted priority-level feedback for the footer. */
     initialPriorityFeedback?: PersistedFeedbackData | null;
 }
-declare function SignalPriorityPopover({ score, urgencyLabel: providedLabel, urgencyExplanation, factors, metaText, feedbackChips, onFeedbackSubmit, className, initialFactorFeedback, onFactorFeedback, initialPriorityFeedback, }: SignalPriorityPopoverProps): React.JSX.Element;
+declare function SignalPriorityPopover({ score, urgencyLabel: providedLabel, urgencyExplanation, factors, metaText, feedbackChips, onFeedbackSubmit, className, initialFactorFeedback, onFactorFeedback, initialPriorityFeedback, scoreDisplay, }: SignalPriorityPopoverProps): React.JSX.Element;
 
-export { type AccountFilterTab as A, type BriefStyleVariant as B, type EntityPanelConfig as E, type InboxDetailSections as I, type PriorityFactor as P, type QueueItem as Q, SignalPriorityPopover as S, type TimelineSystemEventsConfig as T, type WorkQueueViewConfig as W, type AccountsViewConfig as a, type AdminTab as b, type AdminViewConfig as c, type EntityPanelSection as d, type InboxSortOption as e, type InboxViewConfig as f, type InsightsCustomTab as g, type InsightsViewConfig as h, type PrototypeBrandConfig as i, type PrototypeConfig as j, type SignalPriorityPopoverProps as k, type SignalScoreData as l, type SignalScoreExplanationBucket as m, type SignalScoreExplanationSignal as n, type SignalScoreUrgencyLabel as o };
+export { type AccountFilterTab as A, type BriefStyleVariant as B, type EntityPanelConfig as E, type InboxDetailSections as I, type PriorityFactor as P, type QueueItem as Q, SignalPriorityPopover as S, type TimelineSystemEventsConfig as T, type WorkQueueViewConfig as W, type AccountsViewConfig as a, type AdminTab as b, type AdminViewConfig as c, type EntityPanelSection as d, type InboxSortOption as e, type InboxViewConfig as f, type InsightsCustomTab as g, type InsightsViewConfig as h, type PrototypeBrandConfig as i, type PrototypeConfig as j, type SignalPriorityPopoverProps as k, type SignalScoreData as l, type SignalScoreExplanationBucket as m, type SignalScoreExplanationSignal as n, type SignalScoreUrgencyLabel as o, type SignalPriorityScoreDisplay as p };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@handled-ai/design-system",
-  "version": "0.18.48",
+  "version": "0.18.50",
   "description": "Handled UI component library (shadcn-style, New York)",
   "type": "module",
   "packageManager": "pnpm@9.12.0",

package/src/components/__tests__/case-panel-why.test.tsx

@@ -149,86 +149,4 @@ describe("CasePanelSignalApprovalActions", () => {
     expect(screen.getByText(/this will approve this action for/i)).toBeInTheDocument()
     expect(screen.getByRole("button", { name: /confirm/i }).className).toContain("h-7")
   })
-
-  it("lets callers collect edited opportunity preview fields before approval", async () => {
-    const onApprove = vi.fn()
-
-    renderApprovalActions({
-      initialApprovalState: "confirming",
-      onApprove,
-      opportunityPreview: {
-        name: "Churn Risk - Northwind Systems",
-        accountName: "Northwind Systems",
-        stage: "Prospecting",
-        closeDate: "Jun 30, 2026",
-        closeDateValue: "2026-06-30",
-        amount: "$75,000",
-        amountValue: 75000,
-        description: "Initial description",
-        churnType: "Churn Risk",
-        churnTypeOptions: ["Churn Risk", { value: "Win Back", label: "Win-back" }],
-      },
-    })
-
-    fireEvent.change(screen.getByLabelText("Close Date"), { target: { value: "2026-07-15" } })
-    expect(screen.getByLabelText("Amount")).toHaveValue("$75,000")
-    fireEvent.change(screen.getByLabelText("Amount"), { target: { value: "90000" } })
-    fireEvent.change(screen.getByLabelText("Churn Type"), { target: { value: "Win Back" } })
-    fireEvent.change(screen.getByLabelText("Description"), { target: { value: "Updated before create" } })
-    fireEvent.click(screen.getByRole("button", { name: /confirm/i }))
-
-    expect(onApprove).toHaveBeenCalledWith({
-      closeDate: "2026-07-15",
-      amount: "90000",
-      churnType: "Win Back",
-      description: "Updated before create",
-    })
-  })
-
-  it("keeps legacy display-only opportunity previews confirmable", () => {
-    const onApprove = vi.fn()
-
-    renderApprovalActions({
-      initialApprovalState: "confirming",
-      onApprove,
-      opportunityPreview: {
-        name: "Churn Risk - Northwind Systems",
-        accountName: "Northwind Systems",
-        stage: "Prospecting",
-        closeDate: "Jun 30, 2026",
-        amount: "$75,000",
-      },
-    })
-
-    expect(screen.getByText(/this will approve this action for/i)).toBeInTheDocument()
-    expect(screen.queryByLabelText("Close Date")).not.toBeInTheDocument()
-    expect(screen.getByRole("button", { name: /confirm/i })).not.toBeDisabled()
-
-    fireEvent.click(screen.getByRole("button", { name: /confirm/i }))
-    expect(onApprove).toHaveBeenCalledWith(undefined)
-  })
-
-  it("blocks confirmation until the close date is valid", () => {
-    const onApprove = vi.fn()
-
-    renderApprovalActions({
-      initialApprovalState: "confirming",
-      onApprove,
-      opportunityPreview: {
-        name: "Churn Risk - Northwind Systems",
-        accountName: "Northwind Systems",
-        stage: "Prospecting",
-        closeDate: "Jun 30, 2026",
-        closeDateValue: "2026-06-30",
-        amount: "$75,000",
-      },
-    })
-
-    fireEvent.change(screen.getByLabelText("Close Date"), { target: { value: "" } })
-    expect(screen.getByRole("button", { name: /confirm/i })).toBeDisabled()
-    expect(screen.getByText("Enter a valid close date.")).toBeInTheDocument()
-
-    fireEvent.click(screen.getByRole("button", { name: /confirm/i }))
-    expect(onApprove).not.toHaveBeenCalled()
-  })
 })

package/src/components/__tests__/signal-priority-popover.test.tsx

@@ -119,8 +119,8 @@ describe("SignalPriorityPopover", () => {
 
     // Check head section
     expect(content.textContent).toContain("Why this is high priority")
-    expect(content.textContent).toContain("79")
-    expect(content.textContent).toContain("/100")
+    expect(screen.getByTestId("priority-overall-score").textContent).toContain("79")
+    expect(screen.getByTestId("priority-overall-score").textContent).toContain("/100")
     expect(content.textContent).toContain("High range")
     expect(content.textContent).toContain("60-79")
   })
@@ -188,13 +188,36 @@ describe("SignalPriorityPopover", () => {
     expect(row.textContent).not.toContain("Raises0/100")
   })
 
-  it("renders Contributing factors section label", () => {
+  it("renders Contributing factors section label and calibrated priority copy", () => {
     render(<SignalPriorityPopover {...defaultProps} />)
     fireEvent.click(screen.getByTestId("priority-popover-trigger"))
 
     const content = screen.getByTestId("priority-popover-content")
     expect(content.textContent).toContain("Contributing factors")
-    expect(content.textContent).toContain("Score = weighted sum")
+    expect(content.textContent).toContain("Priority = weighted signals + calibration")
+    expect(content.textContent).not.toContain("Score = weighted sum")
+  })
+
+
+  it("renders the overall score number by default while preserving factor row scores", () => {
+    render(<SignalPriorityPopover {...defaultProps} />)
+    fireEvent.click(screen.getByTestId("priority-popover-trigger"))
+
+    expect(screen.getByTestId("priority-overall-score").textContent).toBe("79/100")
+    expect(screen.getByTestId("factor-row-test_severity").textContent).toContain("85/100")
+    expect(screen.getByTestId("factor-row-account_depth").textContent).toContain("30/100")
+  })
+
+  it("hides only the overall header score in label display mode", () => {
+    render(<SignalPriorityPopover {...defaultProps} scoreDisplay="label" />)
+    fireEvent.click(screen.getByTestId("priority-popover-trigger"))
+
+    const header = screen.getByTestId("priority-popover-header")
+    expect(screen.queryByTestId("priority-overall-score")).toBeNull()
+    expect(header.textContent).toContain("Why this is high priority")
+    expect(header.textContent).not.toContain("79/100")
+    expect(screen.getByTestId("factor-row-test_severity").textContent).toContain("85/100")
+    expect(screen.getByTestId("factor-row-account_depth").textContent).toContain("30/100")
   })
 
   it("renders score track bars with correct width percentage", () => {

package/src/components/signal-feedback-inline.tsx

@@ -73,32 +73,6 @@ const approveReasons = [
 
 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
@@ -132,9 +106,9 @@ interface SignalApprovalContextValue {
   labels: Required<SignalApprovalLabels>
   hideApproveButton?: boolean
   approveButtonIconUrl?: string
-  opportunityPreview?: OpportunityPreview
+  opportunityPreview?: RootProps['opportunityPreview']
   requestingApproval: boolean
-  approve: (draft?: OpportunityDraft) => void
+  approve: () => void
   submitApproveFeedback: (reasons: string[], detail: string) => void
   skipApproveFeedback: () => void
   dismiss: (reasons: string[], detail: string, subReason?: string) => void
@@ -163,7 +137,13 @@ 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?: OpportunityPreview
+  opportunityPreview?: {
+    name: string
+    stage: string
+    closeDate: string
+    amount: string
+    accountName: string
+  }
   /**
    * Async callback fired when the user clicks the approve button, BEFORE
    * transitioning to the "confirming" state. While the promise is pending,
@@ -180,7 +160,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?: (draft?: OpportunityDraft) => void | Promise<boolean>
+  onApprove?: () => void | Promise<boolean>
   onApproveFeedback?: (reasons: string[], detail: string) => void
   onDismiss?: (reasons: string[], detail: string, subReason?: string) => void
 }
@@ -225,8 +205,8 @@ function Root({ children, companyName, opportunityUrl, scheduledTime, initialApp
     setApprovalState("pending")
   }, [])
 
-  const approve = React.useCallback((draft?: OpportunityDraft) => {
-    const result = onApprove?.(draft)
+  const approve = React.useCallback(() => {
+    const result = onApprove?.()
     // If the callback returns a Promise, show a loading state and wait for it.
     if (result && typeof (result as Promise<boolean>).then === "function") {
       setApprovalState("creating")
@@ -437,49 +417,6 @@ function SubmittedFeedback({
   )
 }
 
-function optionValue(option: string | OpportunityPreviewOption): string {
-  return typeof option === "string" ? option : option.value
-}
-
-function optionLabel(option: string | OpportunityPreviewOption): string {
-  return typeof option === "string" ? option : option.label
-}
-
-function formatAmountDraftValue(value: string | number | null | undefined): string {
-  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?: OpportunityPreview): OpportunityDraft {
-  return {
-    closeDate: preview?.closeDateValue ?? preview?.closeDate ?? "",
-    amount: preview?.amountValue === undefined
-      ? preview?.amount ?? ""
-      : formatAmountDraftValue(preview.amountValue),
-    description: preview?.description ?? "",
-    churnType: preview?.churnType ?? "",
-  }
-}
-
-function hasEditableOpportunityPreview(preview?: OpportunityPreview): boolean {
-  return !!preview && isValidDateInput(preview.closeDateValue ?? preview.closeDate)
-}
-
-function isValidDateInput(value: string): boolean {
-  const match = /^(\d{4})-(\d{2})-(\d{2})$/.exec(value)
-  if (!match) return false
-  const parsed = new Date(`${value}T00:00:00Z`)
-  if (Number.isNaN(parsed.getTime())) return false
-  return parsed.toISOString().slice(0, 10) === value
-}
-
 function Actions() {
   const { approvalState, companyName, opportunityUrl, scheduledTime, labels, hideApproveButton, approveButtonIconUrl, opportunityPreview, requestingApproval, approve, submitApproveFeedback, skipApproveFeedback, dismiss, requestApproval, requestDismiss, cancel } =
     useSignalApproval()
@@ -489,16 +426,6 @@ function Actions() {
   const [detailText, setDetailText] = React.useState("")
   const [submittedFeedback, setSubmittedFeedback] = React.useState<{ reasons: string[]; detail: string; subReason?: string } | null>(null)
   const [isEditing, setIsEditing] = React.useState(false)
-  const [opportunityDraft, setOpportunityDraft] = React.useState<OpportunityDraft>(() => buildOpportunityDraft(opportunityPreview))
-
-  React.useEffect(() => {
-    if (approvalState === "confirming") {
-      setOpportunityDraft(buildOpportunityDraft(opportunityPreview))
-    }
-  }, [approvalState, opportunityPreview])
-
-  const churnTypeOptions = opportunityPreview?.churnTypeOptions ?? []
-  const hasChurnTypeOptions = churnTypeOptions.length > 0
 
   const topNode = dismissReasonTree.find((n) => n.label === selectedTopReason)
   const hasSubOptions = !!(topNode?.subOptions && topNode.subOptions.length > 0)
@@ -511,8 +438,6 @@ function Actions() {
     (!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: string) => {
     if (selectedTopReason === label) {
@@ -814,8 +739,8 @@ function Actions() {
           <p className="text-sm text-foreground">
             {labels.confirmPrompt} <strong>{companyName}</strong>. Confirm?
           </p>
-          {opportunityPreview && !isEditableOpportunityPreview && (
-            <div className="mt-3 space-y-2 border-t border-border/50 pt-3">
+          {opportunityPreview && (
+            <div className="mt-3 space-y-1.5 border-t border-border/50 pt-3">
               {[
                 { label: "Opportunity", value: opportunityPreview.name },
                 { label: "Account", value: opportunityPreview.accountName },
@@ -823,105 +748,19 @@ function Actions() {
                 { label: "Close Date", value: opportunityPreview.closeDate },
                 { label: "Amount", value: opportunityPreview.amount },
               ].map(({ label, value }) => (
-                <div key={label} className="flex items-center justify-between gap-3 text-xs">
-                  <span className="text-muted-foreground">{label}</span>
-                  <span className="text-right font-medium text-foreground">{value}</span>
-                </div>
-              ))}
-            </div>
-          )}
-          {opportunityPreview && isEditableOpportunityPreview && (
-            <div className="mt-3 space-y-3 border-t border-border/50 pt-3">
-              {[
-                { label: "Opportunity", value: opportunityPreview.name },
-                { label: "Account", value: opportunityPreview.accountName },
-                { label: "Stage", value: opportunityPreview.stage },
-              ].map(({ label, value }) => (
-                <div key={label} className="flex items-center justify-between gap-3 text-xs">
+                <div key={label} className="flex items-center justify-between text-xs">
                   <span className="text-muted-foreground">{label}</span>
-                  <span className="text-right font-medium text-foreground">{value}</span>
+                  <span className="font-medium text-foreground">{value}</span>
                 </div>
               ))}
-
-              <div className="grid gap-2 sm:grid-cols-2">
-                <label className="space-y-1 text-xs">
-                  <span className="font-medium text-muted-foreground">Close Date</span>
-                  <input
-                    type="date"
-                    value={opportunityDraft.closeDate}
-                    onChange={(event) => setOpportunityDraft((draft) => ({ ...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 && (
-                    <span className="text-[11px] text-red-600">Enter a valid close date.</span>
-                  )}
-                </label>
-
-                <label className="space-y-1 text-xs">
-                  <span className="font-medium text-muted-foreground">Amount</span>
-                  <input
-                    type="text"
-                    inputMode="decimal"
-                    value={opportunityDraft.amount}
-                    onChange={(event) => setOpportunityDraft((draft) => ({ ...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"
-                  />
-                </label>
-              </div>
-
-              <label className="space-y-1 text-xs">
-                <span className="font-medium text-muted-foreground">Churn Type</span>
-                {hasChurnTypeOptions ? (
-                  <select
-                    value={opportunityDraft.churnType}
-                    onChange={(event) => setOpportunityDraft((draft) => ({ ...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"
-                  >
-                    <option value="">No churn type</option>
-                    {churnTypeOptions.map((option) => (
-                      <option key={optionValue(option)} value={optionValue(option)}>
-                        {optionLabel(option)}
-                      </option>
-                    ))}
-                  </select>
-                ) : (
-                  <input
-                    type="text"
-                    value={opportunityDraft.churnType}
-                    onChange={(event) => setOpportunityDraft((draft) => ({ ...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"
-                  />
-                )}
-              </label>
-
-              <label className="space-y-1 text-xs">
-                <span className="font-medium text-muted-foreground">Description</span>
-                <textarea
-                  value={opportunityDraft.description}
-                  onChange={(event) => setOpportunityDraft((draft) => ({ ...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"
-                />
-              </label>
             </div>
           )}
         </div>
         <div className="flex items-center gap-2">
           <button
             type="button"
-            onClick={() => {
-              if (!opportunityPreview) {
-                approve()
-                return
-              }
-              approve(isEditableOpportunityPreview ? opportunityDraft : undefined)
-            }}
-            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"
+            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"
           >
             <Check className="h-3 w-3" />
             Confirm
@@ -1022,4 +861,5 @@ export {
   Gate as SignalApprovalGate,
 }
 export const SignalApproval = { Root, Actions, Gate }
-export type { ApprovalState, OpportunityPreview, OpportunityDraft, SignalApprovalLabels, SignalApprovalContextValue, RootProps as SignalApprovalRootProps }
+export type OpportunityPreview = NonNullable<RootProps['opportunityPreview']>
+export type { ApprovalState, SignalApprovalLabels, SignalApprovalContextValue, RootProps as SignalApprovalRootProps }

package/src/components/signal-priority-popover.tsx

@@ -50,8 +50,12 @@ export interface PriorityFactor {
   rationale: string
 }
 
+export type SignalPriorityScoreDisplay = "label" | "number"
+
 export interface SignalPriorityPopoverProps {
   score: number
+  /** Controls whether the overall score number is shown in the popover header. @default "number" */
+  scoreDisplay?: SignalPriorityScoreDisplay
   urgencyLabel?: SignalScoreUrgencyLabel
   /** Synthesis sentence displayed in the popover head. */
   urgencyExplanation?: string
@@ -282,6 +286,7 @@ export function SignalPriorityPopover({
   initialFactorFeedback,
   onFactorFeedback,
   initialPriorityFeedback,
+  scoreDisplay = "number",
 }: SignalPriorityPopoverProps) {
   const urgencyLabel = providedLabel ?? getUrgencyLevel(score)
   const scoreRange = getUrgencyRange(urgencyLabel)
@@ -330,15 +335,20 @@ export function SignalPriorityPopover({
           data-testid="priority-popover-content"
         >
           {/* Head section */}
-          <div className="p-4 pb-3">
+          <div className="p-4 pb-3" data-testid="priority-popover-header">
             <div className="flex items-start justify-between gap-3">
               <p className="text-sm font-semibold text-foreground">
                 Why this is {urgencyLabel.toLowerCase()} priority
               </p>
-              <span className="text-2xl font-bold tabular-nums text-foreground">
-                {score}
-                <span className="text-sm font-normal text-muted-foreground">/100</span>
-              </span>
+              {scoreDisplay === "number" && (
+                <span
+                  className="text-2xl font-bold tabular-nums text-foreground"
+                  data-testid="priority-overall-score"
+                >
+                  {score}
+                  <span className="text-sm font-normal text-muted-foreground">/100</span>
+                </span>
+              )}
             </div>
 
             {/* Band indicator */}
@@ -369,7 +379,7 @@ export function SignalPriorityPopover({
                 </span>
                 <span className="flex items-center gap-1 text-[10px] text-muted-foreground">
                   <Info className="h-3 w-3" />
-                  Score = weighted sum
+                  Priority = weighted signals + calibration
                 </span>
               </div>
 

package/src/prototype/__tests__/detail-view-score-why.test.tsx

@@ -89,6 +89,38 @@ describe("DetailView corrected compact score WHY UX", () => {
     expect(screen.queryByText("How's this score?")).toBeNull();
   });
 
+
+  it("passes priorityScoreDisplay through to the priority popover", () => {
+    render(
+      <DetailView
+        {...baseProps({
+          getSignalScore: () =>
+            makeSignalScore({
+              urgencyLabel: "High",
+              priorityScoreDisplay: "label",
+              priorityFactors: [
+                {
+                  key: "treasury",
+                  label: "Treasury activity",
+                  icon: "wallet",
+                  tone: "alert",
+                  direction: "raises",
+                  score: 85,
+                  rationale: "Full liquidation detected.",
+                },
+              ],
+            }),
+        })}
+      />,
+    );
+
+    fireEvent.click(screen.getByRole("button", { name: /high priority/i }));
+
+    expect(screen.queryByTestId("priority-overall-score")).toBeNull();
+    expect(screen.getByTestId("priority-popover-header").textContent).not.toContain("82/100");
+    expect(screen.getByTestId("factor-row-treasury").textContent).toContain("85/100");
+  });
+
   it("keeps signal WHY chips collapsed by default and excludes factor-only buckets", () => {
     render(
       <DetailView

package/src/prototype/prototype-config.ts

@@ -13,9 +13,9 @@ import type {
   PipelineStageTiming,
 } from "../charts/pipeline-overview"
 import type { TimelineEvent } from "../components/timeline-activity"
-import type { ApprovalState, OpportunityDraft } from "../components/signal-feedback-inline"
+import type { ApprovalState } from "../components/signal-feedback-inline"
 import type { LucideIcon } from "lucide-react"
-import type { PriorityFactor } from "../components/signal-priority-popover"
+import type { PriorityFactor, SignalPriorityScoreDisplay } from "../components/signal-priority-popover"
 import type { FeedbackChipTree, FeedbackSubmitData, PersistedFeedbackData } from "../components/feedback-primitives"
 
 // ---------------------------------------------------------------------------
@@ -109,6 +109,8 @@ export interface SignalScoreData {
   confidence: number
   urgencyLabel?: SignalScoreUrgencyLabel
   urgencyExplanation?: string
+  /** Controls whether the priority popover header shows the raw overall score number. @default "number" */
+  priorityScoreDisplay?: SignalPriorityScoreDisplay
   explanationBuckets?: SignalScoreExplanationBucket[]
   onFactorFeedback?: (factorKey: string, type: "up" | "down" | null, detail?: string) => void
   /** @deprecated The compact score UX no longer renders score-level thumbs by default. */
@@ -180,7 +182,7 @@ export interface InboxViewConfig {
   quickFilterTabs?: Array<{ id: string; label: string; matchValue?: string; count?: number }>
   hideAccountsButton?: boolean
   accountDetailsLabel?: string
-  onSignalApprove?: (item: QueueItem, draft?: OpportunityDraft) => void | Promise<boolean>
+  onSignalApprove?: (item: QueueItem) => void | Promise<boolean>
   getSignalApprovalState?: (item: QueueItem) => ApprovalState | undefined
   signalLabels?: {
     approveButton?: string

package/src/prototype/prototype-inbox-view.tsx

@@ -38,7 +38,7 @@ import {
   type InboxFilterCategory,
 } from "../components/inbox-toolbar"
 import { GroupedListView, type GroupedListGroup } from "../components/item-list"
-import { SignalApproval, type ApprovalState, type OpportunityDraft, type OpportunityPreview } from "../components/signal-feedback-inline"
+import { SignalApproval, type ApprovalState, type OpportunityPreview } from "../components/signal-feedback-inline"
 import { ScoreWhyChips } from "../components/score-why-chips"
 import { SignalPriorityPopover } from "../components/signal-priority-popover"
 import { type SourceDef } from "../components/detail-view"
@@ -149,7 +149,7 @@ export interface DetailViewProps {
   onSuggestedActionFeedback?: (actionId: number | string, feedback: string, actionTitle?: string) => void
   /** @deprecated The compact score UX no longer renders score-level thumbs by default. */
   onScoreFeedback?: (type: "up" | "down", pills: string[], detail: string) => void
-  onSignalApprove?: (item: QueueItem, draft?: OpportunityDraft) => void | Promise<boolean>
+  onSignalApprove?: (item: QueueItem) => void | Promise<boolean>
   getSignalApprovalState?: (item: QueueItem) => ApprovalState | undefined
   signalLabels?: InboxViewConfig["signalLabels"]
   hideApproveButton?: boolean
@@ -475,7 +475,7 @@ export function DetailView({
       opportunityPreview={opportunityPreview}
       onRequestApproval={onRequestApproval}
       initialApprovalState={getSignalApprovalState?.(item)}
-      onApprove={(draft) => onSignalApprove?.(item, draft)}
+      onApprove={() => onSignalApprove?.(item)}
       onApproveFeedback={(reasons, detail) => {
         signalData.onApproveFeedback?.(reasons, detail)
         console.log("Approval feedback:", { taskId: item.id, company: item.company, reasons, detail })
@@ -519,6 +519,7 @@ export function DetailView({
               score={signalData.score}
               urgencyLabel={signalData.urgencyLabel}
               urgencyExplanation={signalData.urgencyExplanation ?? signalData.signalBrief}
+              scoreDisplay={signalData.priorityScoreDisplay}
               factors={signalData.priorityFactors ?? []}
               metaText={undefined}
               feedbackChips={signalData.priorityFeedbackChips}