component · navigation
TuxRailNav
children becomes a native <details> disclosure — the same "zero-JS, perfect-a11y" pattern as TuxFilterPanel, so the group header is a real browser-wired disclosure button (correct aria-expanded, keyboard, focus) with no roleless ARIA. This is the tux-owned replacement for Nuxt UI's
UNavigationMenu in vertical mode, whose collapsible chevron renders as a roleless <span aria-expanded> (axe aria-allowed-attr). Used in app/layouts/sidebar.vue's rail. expanded
Full rail with a collapsible group
Leaf entries are links; the "Sessions" entry has children, so it renders as an open <details> (defaultOpen). The second group sits below a hairline divider. Active route gets a maroon tint via router-link-active.
<tux-rail-nav :items="items" aria-label="Studio navigation" />collapsed
Icon-only rail
Pass collapsed for the narrow rail state: labels hide, groups fold to a single icon link, and every link keeps an aria-label so it stays named for screen readers. The layout drives this from its breakpoint (icon-only at lg, full at xl+).
<tux-rail-nav :items="items" collapsed aria-label="Studio navigation" />accessibility
Native disclosure, real landmark
The root is a <nav> landmark named by aria-label (override it per instance when several rails share a page, so each landmark is unique). Collapsible groups use <details>/<summary> — the browser supplies the disclosure semantics, so there is never a roleless element carrying aria-expanded. Verified by npm run audit:a11y.