diff --git a/src/components/insights/mood/__tests__/mood-tag-bars-muted.test.tsx b/src/components/insights/mood/__tests__/mood-tag-bars-muted.test.tsx index dc7360447..8fef436b1 100644 --- a/src/components/insights/mood/__tests__/mood-tag-bars-muted.test.tsx +++ b/src/components/insights/mood/__tests__/mood-tag-bars-muted.test.tsx @@ -6,11 +6,11 @@ import { MoodTagBreakdown } from "../mood-tag-breakdown"; import { MoodStructuredTagBreakdown } from "../mood-structured-tag-breakdown"; /** - * v1.16.8 — the tag-breakdown bars carry the same muted treatment as - * the mood Recharts charts (`fillOpacity={0.55}` on distribution / - * weekday / time-of-day). The CSS bars rendered the raw `--dracula-*` - * hues at full opacity, which made the two tag cards shout next to the - * matte charts above them. Pinned: every fill bar ships `opacity-55`. + * v1.19.0 — the muted mood treatment (`opacity-55` on the tag bars, + * `fillOpacity={0.55}` on the Recharts bars) read as a rendering glitch, + * so the bars now paint at full saturation in their level hue. This guard + * keeps the dimming from creeping back: every fill bar carries the level + * colour at full opacity. */ function render(node: React.ReactNode) { @@ -19,8 +19,8 @@ function render(node: React.ReactNode) { ); } -describe("mood tag bars — muted palette (v1.16.8)", () => { - it("free-text tag breakdown bars render at the shared chart opacity", () => { +describe("mood tag bars — full-saturation palette (v1.19.0)", () => { + it("free-text tag breakdown bars render at full opacity", () => { const html = render( { const fills = html.match(/class="[^"]*absolute inset-y-0 left-0[^"]*"/g); expect(fills).toHaveLength(2); for (const fill of fills ?? []) { - expect(fill).toContain("opacity-55"); + expect(fill).not.toContain("opacity-55"); } // The level hue itself stays a Dracula token. expect(html).toContain("var(--dracula-red)"); expect(html).toContain("var(--dracula-green)"); }); - it("structured tag breakdown bars render at the shared chart opacity", () => { + it("structured tag breakdown bars render at full opacity", () => { const html = render( { ); const fills = html.match(/class="[^"]*absolute inset-y-0 left-0[^"]*"/g); expect(fills).toHaveLength(1); - expect(fills?.[0]).toContain("opacity-55"); + expect(fills?.[0]).not.toContain("opacity-55"); }); }); diff --git a/src/components/insights/mood/mood-distribution-chart.tsx b/src/components/insights/mood/mood-distribution-chart.tsx index 713d50e23..9e1f64f8b 100644 --- a/src/components/insights/mood/mood-distribution-chart.tsx +++ b/src/components/insights/mood/mood-distribution-chart.tsx @@ -111,13 +111,8 @@ export function MoodDistributionChart({ // than a missing slot. The coloured bar paints over the track // for non-empty levels. background={{ fill: "var(--secondary)", opacity: 0.35, radius: 3 }} - // v1.15.14 — the saturated full-bleed mood hues read as - // "erschlagend"; soften every bar to a muted tint of its level - // colour. The hue (= mood-level semantics) still distinguishes the - // bands, but the fill sits calmly over the card rather than - // shouting. Scoped to this chart only — the shared `--dracula-*` - // mood tokens (heatmap, legend) are untouched. - fillOpacity={0.55} + // v1.19.0 — bars paint at full saturation in their level colour; + // the earlier muted tint read as a rendering glitch. > {data.map((row) => (
- {/* v1.16.8 — `opacity-55` matches the `fillOpacity={0.55}` - the mood Recharts bars carry (distribution / weekday / - time-of-day), so the tag bars read equally matte. */} + {/* v1.19.0 — full-saturation fill, matching the mood Recharts + bars (the earlier muted tint read as a rendering glitch). */}
- {/* v1.16.8 — `opacity-55` matches the `fillOpacity={0.55}` - the mood Recharts bars carry (distribution / weekday / - time-of-day), so the tag bars read equally matte. */} + {/* v1.19.0 — full-saturation fill, matching the mood Recharts + bars (the earlier muted tint read as a rendering glitch). */}
- {/* v1.15.14 — soften the saturated mood hues to a muted tint - (the level semantics still distinguish the bars; the fill no - longer shouts). Scoped here — the shared `--dracula-*` mood - tokens used by the heatmap/legend stay untouched. */} - + {/* v1.19.0 — bars paint at full saturation in their level colour; + the earlier muted tint read as a rendering glitch. */} + {data.map((row) => (