Gooey Nav
A nav row where the active pill flows to the chosen item through a goo filter, shedding droplets that melt back in.
import { GooeyNav } from "pleate/effects/gooey-nav";Five items
Props
- items
Links or buttons.
{ label, href? }[]- value / defaultValue
Active index.
numberdefault 0- onChange
Called on select.
(index) => void- particleCount
Droplets per change.
numberdefault 12- color
Pill color.
stringdefault accent
Accessibility
- A nav landmark; the active item has aria-current="page".
- Left and right arrows move focus between items.
- Reduced motion moves the pill without droplets.