@interior
Copy-paste React micro-interactions: a headless hook plus a styled example in one self-contained file, with motion as the only dependency.
Install this registry
npx shadcn@latest add https://www.interior.dev/r/registry.json pnpm dlx shadcn@latest add https://www.interior.dev/r/registry.json bunx shadcn@latest add https://www.interior.dev/r/registry.json curl -s https://www.interior.dev/r/registry.json Components
54 totalCopy to tick, width locked, reverts after 2s.
npx shadcn@latest add https://www.interior.dev/r/copy-button.json Label to state without layout shift.
npx shadcn@latest add https://www.interior.dev/r/loading-button.json A guard rail in front of destructive actions.
npx shadcn@latest add https://www.interior.dev/r/hold-to-confirm.json Optimistic like that survives rapid taps.
npx shadcn@latest add https://www.interior.dev/r/like-burst.json Touch feedback from the pointer origin.
npx shadcn@latest add https://www.interior.dev/r/ripple.json Play/pause, menu/close as one mechanism.
npx shadcn@latest add https://www.interior.dev/r/icon-morph.json The feeling that the press landed.
npx shadcn@latest add https://www.interior.dev/r/press-depth.json The label makes room instead of disappearing.
npx shadcn@latest add https://www.interior.dev/r/floating-label.json Error message that does not shove the form.
npx shadcn@latest add https://www.interior.dev/r/inline-validation.json Strength read segment by segment.
npx shadcn@latest add https://www.interior.dev/r/password-strength.json Auto advance, paste, error recovery.
npx shadcn@latest add https://www.interior.dev/r/otp-input.json Enter adds, backspace highlights then removes.
npx shadcn@latest add https://www.interior.dev/r/tag-input.json Icon to field with focus handled.
npx shadcn@latest add https://www.interior.dev/r/expanding-search.json Skeleton to content with zero layout shift.
npx shadcn@latest add https://www.interior.dev/r/skeleton-swap.json Indeterminate handing over to determinate.
npx shadcn@latest add https://www.interior.dev/r/progress-bar.json Sentinel that loads before you hit the end.
npx shadcn@latest add https://www.interior.dev/r/load-more.json Token by token with a caret.
npx shadcn@latest add https://www.interior.dev/r/streaming-text.json The system narrates its work.
npx shadcn@latest add https://www.interior.dev/r/task-steps.json The system's ongoing work, worn as a small object.
npx shadcn@latest add https://www.interior.dev/r/live-activity.json Folds to its title, or lets go entirely.
npx shadcn@latest add https://www.interior.dev/r/collapsible-banner.json Join and leave as a layout change.
npx shadcn@latest add https://www.interior.dev/r/presence-avatars.json Someone is writing.
npx shadcn@latest add https://www.interior.dev/r/typing-indicator.json New content without stealing your scroll.
npx shadcn@latest add https://www.interior.dev/r/new-items-pill.json Backdrop, scroll lock, focus trap.
npx shadcn@latest add https://www.interior.dev/r/modal.json Knows its origin, flips on collision.
npx shadcn@latest add https://www.interior.dev/r/popover.json Delayed once, instant after that.
npx shadcn@latest add https://www.interior.dev/r/tooltip-group.json Results reorder as you type.
npx shadcn@latest add https://www.interior.dev/r/command-palette.json Side panel that keeps its place.
npx shadcn@latest add https://www.interior.dev/r/drawer.json Opens from the pointer, not the corner.
npx shadcn@latest add https://www.interior.dev/r/context-menu.json Active highlight travels between items.
npx shadcn@latest add https://www.interior.dev/r/dropdown.json One indicator shared across tabs.
npx shadcn@latest add https://www.interior.dev/r/tabs.json Thumb slides, label inverts through it.
npx shadcn@latest add https://www.interior.dev/r/segmented-control.json height auto, done correctly.
npx shadcn@latest add https://www.interior.dev/r/accordion.json Transition knows forward from back.
npx shadcn@latest add https://www.interior.dev/r/wizard-steps.json The window moves, the row does not.
npx shadcn@latest add https://www.interior.dev/r/pagination.json Disclosure the arrow keys can walk.
npx shadcn@latest add https://www.interior.dev/r/tree-view.json Condenses as you go down.
npx shadcn@latest add https://www.interior.dev/r/sticky-header.json How much is left.
npx shadcn@latest add https://www.interior.dev/r/reading-progress.json The section you are actually in.
npx shadcn@latest add https://www.interior.dev/r/scroll-spy.json Momentum that lands on a slide.
npx shadcn@latest add https://www.interior.dev/r/snap-carousel.json Toolbar yields to the content.
npx shadcn@latest add https://www.interior.dev/r/hide-on-scroll.json Rows travel to their new order.
npx shadcn@latest add https://www.interior.dev/r/sortable-table.json Filtering rearranges, it does not blink.
npx shadcn@latest add https://www.interior.dev/r/filter-grid.json Marks what just changed.
npx shadcn@latest add https://www.interior.dev/r/value-flash.json The winner lands last.
npx shadcn@latest add https://www.interior.dev/r/poll-results.json Stops you can feel.
npx shadcn@latest add https://www.interior.dev/r/slider-detents.json A stack you decide through.
npx shadcn@latest add https://www.interior.dev/r/swipe-deck.json The gap the siblings open is the drop target.
npx shadcn@latest add https://www.interior.dev/r/reorder-list.json Intent confirmed by time, and cancelled by everything else.
npx shadcn@latest add https://www.interior.dev/r/long-press.json Zoom that returns where it started.
npx shadcn@latest add https://www.interior.dev/r/lightbox.json Words arrive in reading order.
npx shadcn@latest add https://www.interior.dev/r/text-reveal.json Stops when you look at it.
npx shadcn@latest add https://www.interior.dev/r/logo-marquee.json Placeholder resolves into the photo.
npx shadcn@latest add https://www.interior.dev/r/blur-up-image.json Height animates, text does not reflow.
npx shadcn@latest add https://www.interior.dev/r/show-more.json