diff --git a/packages/tui/CHANGELOG.md b/packages/tui/CHANGELOG.md index 3a268e731..886f514dc 100644 --- a/packages/tui/CHANGELOG.md +++ b/packages/tui/CHANGELOG.md @@ -2,6 +2,10 @@ ## [Unreleased] +### Fixed + +- Stopped painting inline color swatches for 4-digit hex runs in Markdown rendering. The `#RGBA` CSS form collides with hashline `#TAG` snapshot tags (4 hex digits, e.g. `#6C5E`), which were sprouting spurious RGB swatches in prose and codespans. Only `#RGB`, `#RRGGBB`, and `#RRGGBBAA` qualify now. + ## [15.7.6] - 2026-06-01 ### Fixed diff --git a/packages/tui/src/components/markdown.ts b/packages/tui/src/components/markdown.ts index 19e8a0297..cef891041 100644 --- a/packages/tui/src/components/markdown.ts +++ b/packages/tui/src/components/markdown.ts @@ -146,22 +146,24 @@ const DEFAULT_COLOR_SWATCH_GLYPH = "■"; // entities like ☃ and paths like foo#fff) and not trailed by more hex // (so over-long runs never produce a misleading swatch). Length/letter rules // are enforced in classifyHexColor since the alternation can't express "exactly -// 3, 4, 6, or 8". +// 3, 6, or 8". const HEX_COLOR_REGEX = /(? { expect(out.includes(swatchFor("fff"))).toBeTruthy(); }); + it("does not swatch 4-digit hashline #TAG snapshot tags", () => { + // Hashline tags are 4 hex digits with letters (e.g. #6C5E) and would + // otherwise be read as #RGBA colors. Neither prose nor codespans swatch them. + const prose = new Markdown("Re-anchor on #6C5E before editing.", 0, 0, defaultMarkdownTheme).render(80).join(""); + expect(prose.includes("■")).toBe(false); + const code = new Markdown("Tag `#6C5E` stays plain.", 0, 0, defaultMarkdownTheme).render(80).join(""); + expect(code.includes("■")).toBe(false); + }); + it("uses the theme's colorSwatch symbol when provided", () => { const themed = { ...defaultMarkdownTheme, symbols: { ...defaultMarkdownTheme.symbols, colorSwatch: "▢" } }; const out = new Markdown("Accent #C5FFD6.", 0, 0, themed).render(80).join("\n");