[matthewmr-eqty]

Need

Docs sites and apps need sidebar folders readers open and close, built from Equality rather than hand-rolled.

Problem

Nav could only drill into a new level, so a docs tree had no Equality part. Its hints each set their own colour, apps hand-built new-tab arrows, and nav spacing came from each part's own padding, with special cases.

Change

• NavListExpandable adds folders that keep their links in server HTML, open themselves around the current row, and move with the drill's motion, now named once as --eq-nav-motion-*.
• --eq-list-item-muted-color colours every hint (›, ⌄, ‹, ↕, ↗). Each takes its row's colour on hover and on the current row.
• target="_blank" rows draw their own ↗, "(opens in a new tab)" and rel.
• Containers put one 2px gap between nav items, and a group label carries its own 12px headroom, so no header or group needs a special case. --eq-switcher-name-fade lets a site set its fade.
• NavDrill keeps each folder's state by its value. Badge and Icon render spans, so they're valid inside a folder header.
• With JavaScript off, closed folders show open, and the header leaves out aria-expanded until it loads.
• Hover fills show only with a mouse or trackpad. MotionCollapsibleContent no longer grows when it first renders open.

Evidence

• ui tests (192), the full build, lint, Prettier and astro check pass on this commit alone.
• Checked in the browser: a folder opening on first load runs no transition (12 ran before the fix); hint colours at rest and on hover; the ↗'s accessible name; nav spacing in six header cases, before and after (unlabelled under a switcher 0 → 2px; labelled and drilled unchanged; plain title 6px lower).

Review focus

Merging publishes 5.3.0. Start with NavListExpandable and how a folder opens around the current row in nav-list.tsx, then nav-list.module.css and nav.module.css. Studio sees four changes on upgrade: a quieter ›, hover fills only with a mouse, plain-title panels 6px lower, and Badge and Icon typed as spans. The Nav page that documents all this is its own PR, after this one.

Not covered

Studio's e2e/policy-subnav.spec.ts hasn't run against 5.3.0 (GRD-192). The live Nav page lags these parts until the docs PR merges. @eqtylab/docs 0.16.0 follows and must drop its own ↗.

Flow

row becomes current ──▶ folders around it open (instantly on first load)
reader closes folder ──▶ stays closed until the next page inside it
row hovered or current ──▶ its muted marks take the row's colour
target="_blank" ──▶ ↗ + "(opens in a new tab)" + rel="noopener noreferrer"
drill away and back ──▶ folders with a value keep their state

Part of GRD-193 · GRD-81

🤖 Generated with Claude Code

[tmccoy14]

Nice work on the folder groups. A handful of things below; the version clash is the one that blocks merging.

[Shrinks99]

Looks good!