RetroLittleArrows
The Mac OS 9 little arrows stepper, plus RetroNumberField: an inset field with little arrows, min/max/step clamping, ArrowUp/ArrowDown/PageUp/PageDown/Home/End keys, spinbutton semantics and press-and-hold auto-repeat.
Installation
npx shadcn@latest add "https://nostalgia-ui.com/r/retro-little-arrows.json"
Setup: installing any component also installs nostalgia-theme (the --os9-* tokens and os9-* utilities) via registryDependencies. To add the theme on its own: npx shadcn@latest add https://nostalgia-ui.com/r/nostalgia-theme.json
Import
import { RetroLittleArrows } from "@/components/ui/retro-little-arrows"Usage
<RetroLittleArrows
onIncrement={() => setN((n) => n + 1)}
onDecrement={() => setN((n) => n - 1)}
/>
<RetroNumberField defaultValue={12} min={9} max={72} aria-label="Size" />
<RetroNumberField value={v} onValueChange={setV} min={0} max={1} step={0.05} />Little Arrows
January
Disabled
Press and hold an arrow to auto-repeat.
Number Field
controlled: 0.5
Date & Time Style
:
Current Time