Nav State Indicator
The shared active/running marker that sits beside a selected navigation item in a Sidebar or SettingsShell.
The single active/running indicator shared by YunUI's navigation surfaces — the small accent marker that appears beside the selected item in a Sidebar, SettingsShell or nav list. It's a presentational <span> driven purely by two boolean data-states; place it inside a .nav-item and it inherits the correct geometry.
Import
1import { NavStateIndicator } from "@yuhuanowo/yunui/patterns";States
active shows the selected marker; running animates the same marker without changing its geometry (e.g. a page/session with work in progress).
States
Most apps get this for free through Sidebar / SettingsShell; reach for NavStateIndicator directly only when you're building a bespoke navigation surface that should match the rest of the system.
Props
NavStateIndicator also forwards any <span> HTML attributes.
| Prop | Type | Default | Description |
|---|---|---|---|
| active | boolean | — | Shows the indicator in its selected state. |
| running | boolean | — | Animates the same indicator without changing its geometry. |