Motion primitives for shadcn teams.
A compact registry for polished interaction components, hooks, and CSS-friendly motion patterns you can install as source.
README
Install small, composable UI pieces for animated height, clipboard feedback, tab highlights, multi-step flows, adaptive drawers, and reduced-motion-aware behavior.
pnpm dlx shadcn@latest add @ericts/copy-buttonBuilt on
Registry highlights
Smooth Height Layout
A Motion-powered layout primitive that observes content size and animates height changes.
Copy Button
A shadcn Button-based clipboard control with animated copy and success states.
Status Button
A shadcn Button-based action that transitions through idle, loading, and success states.
Jitter Animation
A jitter animation primitive plus a ready-made vibration icon.
Squeeze Animation
A squeeze animation primitive plus a ready-made SVG card icon.
Highlight Tabs
A Motion-powered tab list with a shared highlight indicator and keyboard navigation.
Morphing Text
A Motion-powered text primitive that morphs matching characters between string updates.
Multi-Step Flow
A Motion-powered multi-step container that slides between steps and animates height changes.
Adaptive Drawer
A shadcn Drawer that measures panel content and animates height changes.
useReducedMotion
A client-safe React hook for reading prefers-reduced-motion and reacting to preference changes.
Component preview
Try a featured component and copy the install command.
Expandable Tabs
navigationshared-layoutA DynamicIsland-style toolbar whose icon tabs expand into actionable menu or content panels, with full keyboard and ARIA support.
Install
pnpm dlx shadcn@latest add @ericts/expandable-tabs