From 021c659d1489a1b96367ee11418e004cb54bf4d9 Mon Sep 17 00:00:00 2001 From: amosblomqvist Date: Tue, 8 Sep 2026 22:43:17 +0300 Subject: [PATCH] graph-view docs: labels now render statement (post-redesign rekey follow-up) --- components/graph-view.tsx | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/components/graph-view.tsx b/components/graph-view.tsx index e4b31d9..8bb2209 100644 --- a/components/graph-view.tsx +++ b/components/graph-view.tsx @@ -10,20 +10,21 @@ * and cancelled on unmount — idle CPU stays near zero. Physics is * placement only: pan/zoom, no dragging, no editing. * - * Labels render the node `name` (the short header, never the statement) + * Labels render the node `statement` (the minimal proposition — identity + * key + rendering label; the full `description` lives on the detail card) * through custom canvas drawers that replace sigma's defaults: * - defaultDrawNodeLabel: plain wrapped text, centered below the node, * word-wrapped at a max line width — no truncation, no one-line sprawl. * - defaultDrawNodeHover: NO background box (sigma's default is a * hardcoded white one). Instead the hovered node gets a soft glow * halo in its own state color at a constant radius, flush with the - * disc edge, and its name brightens — the "this is clickable, + * disc edge, and its statement brightens — the "this is clickable, * click for the full fact" affordance. Entering/leaving hover fades * ONE transition factor shared by halo and text alike, so the * halo's opacity and the text's muted→bright cross-fade stay in * sync (no growth, no pulse; interpolating from the current value * means rapid hover toggles glide instead of snapping). Hover - * always shows the name, even when labels are zoomed out. + * always shows the statement, even when labels are zoomed out. * Node hit-testing is the disc PLUS a pad: sigma picks nodes from a * half-resolution framebuffer (no v3 setting enlarges hitboxes), and the * glow halo is bigger than the stock hitbox — touching the halo @@ -101,7 +102,7 @@ export function isNodeVisible( // sigma's defaults draw the label on ONE line to the right of the node with // a white box on hover. We replace both: names wrap under the node at a max // line width, muted at rest; on hover the node pulses a soft glow in its -// own state color and the name brightens (no background box). +// own state color and the statement brightens (no background box). const LABEL_MAX_WIDTH = 170; // px — wraps long names instead of a wide strip const LABEL_GAP = 6; // px between node edge and first label line @@ -226,7 +227,7 @@ function wrapLabel(context: CanvasRenderingContext2D, text: string, maxWidth: nu return lines; } -/** The wrapped node name, centered below the node — used by both drawers +/** The wrapped node statement, centered below the node — used by both drawers * with identical geometry so hover only changes the color, nothing jumps. */ function drawName( context: CanvasRenderingContext2D, @@ -253,7 +254,7 @@ function drawName( * 1 = fully hovered): a glow halo in the node's own state color at a * CONSTANT radius (opacity fades in/out; the halo never grows) starting * flush at the disc edge (the evenodd punch-out keeps the disc itself - * unpainted). The name is drawn at partial alpha in the bright hover + * unpainted). The statement is drawn at partial alpha in the bright hover * color — the muted resting label on the layer beneath shows through, * so text and halo cross-fade on the SAME factor and stay in sync. */ function paintHover( @@ -277,7 +278,7 @@ function paintHover( context.fill("evenodd"); } // Same fade factor as the halo: text and glow rise together. The - // bright name at partial alpha over the muted resting label beneath is + // bright statement at partial alpha over the muted resting label beneath is // a smooth muted→bright cross-fade rather than an instant color swap. context.globalAlpha = fade; drawName(context, data, settings, hoverTextColor);