peetzweg/ui

A small shadcn-compatible registry of animated, motion-based primitives.

This is a GitHub registry — the shadcn CLI reads registry.json and the component source directly from the repo, so there's no registry server and no hosted JSON. Install any component with:

pnpm dlx shadcn@latest add peetzweg/ui/<component>

Pin to a tag, branch, or commit for reproducibility:

pnpm dlx shadcn@latest add peetzweg/ui/time-machine#main

Primitives

Generic, domain-agnostic mechanics — you own the state union, content, and styling:

• MorphSurface — a surface that springs between a small trigger and a larger panel, morphing size and radius in one motion.
• MultiStateButton — generic multi-state animated button with slot-machine label transitions.
• ScrollStrip — horizontal filmstrip of clipped slivers; the active frame expands via a clip-path reveal.
• TactileButton — a neumorphic hardware key that physically depresses on press; recolor the cap via CSS variables.
• TickTape — tape-measure value scrubber: drag a strip of ticks under a fixed pointer, with a velocity-scaled glow trailing the motion.
• TimeMachine — stacked-frame gallery with a 3D-recede animation.

Presets

Opinionated, domain-specific layers over a primitive. A preset bakes in a state union, default content, and semantics — the mechanics stay in the primitive, and every default remains overridable:

• TimerSurface — iOS-style sleep-timer panel over MorphSurface and TickTape: a duration pill morphs into a scrubbable minute tape with a start button.
• TransactionButton — seven-state transaction-submission preset over MultiStateButton.

Every component is plain React — no framework lock-in — and depends only on motion (and lucide-react where icons are used).