Astryx Design System

Mobile Nav Toggle@astryxdesign/core v0.0.15 · MobileNavToggle

Usage

A slide-out drawer for mobile navigation. MobileNav is the mobile counterpart to SideNav and accepts the same children. Use it on narrow viewports where a persistent sidebar is not practical. Inside AppShell, use MobileNavToggle as the trigger; it reads state from context automatically.

ts
import {MobileNavToggle} from '@astryxdesign/core/MobileNav'

Best practices

Guidance	Practices
Do	Share the same nav items between MobileNav and SideNav by extracting them into a variable.
Do	Provide a header when the drawer's purpose is not obvious from its content.
Do	Inside AppShell, use MobileNavToggle to open the drawer; it reads state from context. Do not pass isOpen/onOpenChange to the toggle.
Don't	Use MobileNav on desktop: use a persistent SideNav instead.