fix(goals): cover money displays with privacy-sensitive

Audit-driven sweep. The class was already on the obvious surfaces (KPI
strip, ring center, card balance, funding-accounts breakdown); these
were the secondary surfaces missed in the initial PR — money interpolated
into descriptive prose, account-picker balances, live previews, and the
projection chart tooltip.

- card_component: target divisor next to the masked balance, pace line,
  and behind-status footer (`footer_has_money?` helper keeps non-money
  branches unmasked so paused / archived / "Goal reached" copy stays
  readable in privacy mode).
- show: header_summary (target + date subtitle), to_go remaining,
  inactive recap body, celebration body, catch_up body.
- _status_callout: conditional on `goal.status == :behind` — only that
  branch carries an amount; on_track / no_target_date have date or
  static copy.
- _form_edit + _form_stepper: account balance shown in the linked-
  account picker rows.
- _form_stepper review section: reviewSummary + reviewSuggested ps
  (Stimulus injects target / suggested $X/mo into both).
- _pending_pledge_banner: banner title span (amount + account + days).
- goal_pledges/new: live preview p (Stimulus injects "Reaches X%, $A of
  $B" / "Hits your $B target").
- goal_projection_chart_controller: tooltip was inline-styled with
  hard-coded gray-900 + white (DS drift) and had no privacy class.
  Replaced cssText with className using bg-container + text-primary +
  border-secondary + rounded-lg + privacy-sensitive — mirrors the
  pattern in time_series_chart_controller and the post-#1996 sankey
  fix. Tooltip now respects theme and privacy mode.
This commit is contained in:
Guillem Arias
2026-05-27 10:14:13 +02:00
parent 0d9079a79c
commit 91baa62604
9 changed files with 21 additions and 16 deletions

View File

@@ -440,7 +440,8 @@ export default class extends Controller {
// own `relative`. Read the computed style instead.
if (getComputedStyle(root).position === "static") root.style.position = "relative";
const tooltip = document.createElement("div");
tooltip.style.cssText = "position:absolute;pointer-events:none;display:none;background:var(--color-gray-900);color:var(--color-white);font-size:12px;line-height:1.35;padding:6px 8px;border-radius:6px;white-space:nowrap;z-index:5;box-shadow:0 2px 8px rgba(0,0,0,0.15);";
tooltip.className = "bg-container text-primary text-sm font-sans absolute p-2 border border-secondary rounded-lg pointer-events-none z-50 privacy-sensitive";
tooltip.style.display = "none";
root.appendChild(tooltip);
const overlay = svg