From 383460bb2edc12cb701f2739749c65112322b123 Mon Sep 17 00:00:00 2001 From: scotttong Date: Mon, 6 Jul 2026 16:17:13 -0700 Subject: [PATCH] refactor(ui): consolidate byte-identical readable-text contrast pair (A2) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Of the three flagged contrast-pair sites, only one pair is provably byte-identical across files: #f8fafc/#111827 (readable light/dark text) duplicated in lib/color-contrast.ts and lib/worktree-branding.ts. Export it once from color-contrast.ts as READABLE_TEXT_LIGHT/READABLE_TEXT_DARK and import it in worktree-branding.ts. Left untouched as semantically distinct (per DECISION-SHEET.md A2 'verify per-pair first'): ThemeContext.tsx's pair (#18181b/#ffffff — browser chrome color, not contrast math; and #ffffff != #f8fafc), color-contrast.ts's DARK_BG/LIGHT_BG compositing backgrounds (RGB objects), and worktree-branding.ts's #000000 hex-parse fallback. Zero rendered-output change. Co-Authored-By: Claude Fable 5 --- ui/src/lib/color-contrast.ts | 14 ++++++++++++-- ui/src/lib/worktree-branding.ts | 4 +++- 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/ui/src/lib/color-contrast.ts b/ui/src/lib/color-contrast.ts index 70b2296a31..a7eb692a2c 100644 --- a/ui/src/lib/color-contrast.ts +++ b/ui/src/lib/color-contrast.ts @@ -68,8 +68,18 @@ function composite( }; } -const TEXT_LIGHT = "#f8fafc"; -const TEXT_DARK = "#111827"; +/** + * Shared readable-text pair (slate-50 / gray-900) for "pick light or dark + * text over an arbitrary background" logic. Byte-identical values were + * previously duplicated in lib/worktree-branding.ts (DECISION-SHEET.md A2); + * this is the single source. NOT the same thing as ThemeContext.tsx's + * pair (#18181b/#ffffff), which stays separate. + */ +export const READABLE_TEXT_LIGHT = "#f8fafc"; +export const READABLE_TEXT_DARK = "#111827"; + +const TEXT_LIGHT = READABLE_TEXT_LIGHT; +const TEXT_DARK = READABLE_TEXT_DARK; /** * Pick a readable text color for a solid background. diff --git a/ui/src/lib/worktree-branding.ts b/ui/src/lib/worktree-branding.ts index 6f6d8dc4e4..d4781ded4d 100644 --- a/ui/src/lib/worktree-branding.ts +++ b/ui/src/lib/worktree-branding.ts @@ -1,3 +1,5 @@ +import { READABLE_TEXT_LIGHT, READABLE_TEXT_DARK } from "./color-contrast"; + export type WorktreeUiBranding = { enabled: true; name: string; @@ -46,7 +48,7 @@ function pickReadableTextColor(background: string): string { (0.0722 * relativeLuminanceChannel(b)); const whiteContrast = 1.05 / (luminance + 0.05); const blackContrast = (luminance + 0.05) / 0.05; - return whiteContrast >= blackContrast ? "#f8fafc" : "#111827"; + return whiteContrast >= blackContrast ? READABLE_TEXT_LIGHT : READABLE_TEXT_DARK; } export function getWorktreeUiBranding(): WorktreeUiBranding | null {