---
name: "@eased"
slug: "eased"
description: "Motion-first React components and blocks for shadcn, with tuned springs, light and dark themes, and an MCP server for AI agents."
category: "Animated components"
tags: ["ai", "animation", "blocks", "buttons", "cards", "charts", "crypto", "forms", "loaders", "media", "navigation", "overlays", "tables", "theming"]
framework: "react"
license: "MIT"
author: "easedui"
website: "https://eased.dev"
github: "https://github.com/easedui/ui"
registry: "https://eased.dev/r/registry.json"
pro: false
pro_url: null
github_stars: 0
component_count: 135
generated_at: "2026-10-20T06:35:22.791Z"
---

# @eased

Motion-first React components and blocks for shadcn, with tuned springs, light and dark themes, and an MCP server for AI agents.

## Links

- Website: https://eased.dev
- GitHub: https://github.com/easedui/ui
- Registry JSON: https://eased.dev/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/eased
- This file: https://sh4dcn.vercel.app/md/eased.md

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://eased.dev/r/registry.json
pnpm dlx shadcn@latest add https://eased.dev/r/registry.json
bunx shadcn@latest add https://eased.dev/r/registry.json
# clone the source repo
git clone https://github.com/easedui/ui.git
# fetch the raw registry index
curl -s https://eased.dev/r/registry.json
```

## Components (135)

| name | type | description | install |
| --- | --- | --- | --- |
| eased-tokens | registry:item | The colours, shadows, radius roles, UI type sizes, springs, utilities (radius-nested, hit-area, focus-ring …) and variants (hover-fine, reduced) every Eased co… | `npx shadcn@latest add https://eased.dev/r/eased-tokens.json` |
| eased-motion | registry:lib | The named springs (snappy, smooth, bouncy), tweens, a hydration-safe useSafeReducedMotion and press classes every Eased component shares, matching the springs … | `npx shadcn@latest add https://eased.dev/r/eased-motion.json` |
| eased-demo-frame | registry:component | The shell every Eased demo renders in: 420px tall, shrinks to its container, one 48px header style. | `npx shadcn@latest add https://eased.dev/r/eased-demo-frame.json` |
| undo-pill | registry:ui | A pill that rises after a destructive action with a draining countdown ring. Undo (or ⌘Z) reverts it; only expiry commits it. Hover or focus pauses the countdo… | `npx shadcn@latest add https://eased.dev/r/undo-pill.json` |
| undo-pill-demo | registry:example | A file list where deleting a row shows the Undo Pill. | `npx shadcn@latest add https://eased.dev/r/undo-pill-demo.json` |
| concentric-frame | registry:ui | A layout primitive that exposes outer, padding and inner radius as CSS variables so nested corners stay concentric. | `npx shadcn@latest add https://eased.dev/r/concentric-frame.json` |
| concentric-frame-demo | registry:example | Demo for Concentric Frame. | `npx shadcn@latest add https://eased.dev/r/concentric-frame-demo.json` |
| accordion-demo | registry:example | A billing FAQ with answers of different lengths. | `npx shadcn@latest add https://eased.dev/r/accordion-demo.json` |
| accordion | registry:ui | Disclosures whose height springs open with no overshoot, content fading in as the height lands and the chevron turning on the same spring. Base UI Accordion be… | `npx shadcn@latest add https://eased.dev/r/accordion.json` |
| avatar-demo | registry:example | A members card: a stacked group with a rolling +N, a list with photos, initials and a failed image, and Invite. | `npx shadcn@latest add https://eased.dev/r/avatar-demo.json` |
| avatar | registry:ui | Avatar and AvatarGroup on Base UI Avatar: images fade in from a 4px blur once loaded so initials never flash; overlapping stacks with a cut-out ring spread apa… | `npx shadcn@latest add https://eased.dev/r/avatar.json` |
| badge-demo | registry:example | A mail sidebar with rolling unread counts (98 → 99+) and service status badges with a live dot. | `npx shadcn@latest add https://eased.dev/r/badge-demo.json` |
| badge | registry:ui | A status or count chip. Counts roll their digits; a count-only badge pops in above zero and leaves when cleared; a live dot breathes slowly and stops under red… | `npx shadcn@latest add https://eased.dev/r/badge.json` |
| button-demo | registry:example | An invoice with Send (loading, then “Sent”), Download and a two-step Void. | `npx shadcn@latest add https://eased.dev/r/button-demo.json` |
| button | registry:ui | A Base UI button whose press scale depends on its width, whose label swaps with y + blur while the width springs, and whose loading spinner overlays the label … | `npx shadcn@latest add https://eased.dev/r/button.json` |
| eased-auto-height | registry:ui | The height:auto spring primitive: a wrapper whose height springs to its content, opens and closes with the content fading in after the height lands, and rests … | `npx shadcn@latest add https://eased.dev/r/eased-auto-height.json` |
| eased-field | registry:ui | Label, description ⇄ error message slot and the bordered input group, on Base UI Field. Focus is the border alone; turning invalid shakes the group once, 6px, … | `npx shadcn@latest add https://eased.dev/r/eased-field.json` |
| eased-floating-demo | registry:example | One popover per side; each enters toward its trigger and flips on collision. | `npx shadcn@latest add https://eased.dev/r/eased-floating-demo.json` |
| eased-floating | registry:ui | The motion and material every Eased popup shares: grows from the trigger's transform-origin, enters a few pixels toward the trigger, closes at half the distanc… | `npx shadcn@latest add https://eased.dev/r/eased-floating.json` |
| eased-gesture-demo | registry:example | A three-detent sheet over a map: flicks project onto detents, pulls past the top rubber-band, and the list hands its scroll over to the sheet. | `npx shadcn@latest add https://eased.dev/r/eased-gesture-demo.json` |
| eased-gesture | registry:ui | useDrag: one-axis drag with Apple's rubber-band past the ends, velocity projection onto snap points, scroll handoff from an inner scroller, interruptible relea… | `npx shadcn@latest add https://eased.dev/r/eased-gesture.json` |
| eased-indicator | registry:ui | The shared-layout highlight primitive: render <Indicator> inside whichever item is active and it glides there on the snappy spring, with corners kept round whi… | `npx shadcn@latest add https://eased.dev/r/eased-indicator.json` |
| eased-number-roll | registry:ui | The rolling-digits engine every Eased number uses: Intl-formatted parts, each digit a ten-face cylinder on a spring that rolls in the direction of change, with… | `npx shadcn@latest add https://eased.dev/r/eased-number-roll.json` |
| eased-scroll-fade | registry:ui | Edge feathers that appear only where there is more to scroll (scrollFadeMask, useScrollEdges) and the stacked masked backdrop layers behind Progressive Blur (b… | `npx shadcn@latest add https://eased.dev/r/eased-scroll-fade.json` |
| eased-text-swap | registry:ui | The text-change engine: outgoing text lifts 3px and blurs out, incoming rises 4px and sharpens, and the box springs to the new width. Shared by Button, Field m… | `npx shadcn@latest add https://eased.dev/r/eased-text-swap.json` |
| field-demo | registry:example | A sign-up form on Base UI Form: submit focuses the first invalid field and a server error routes to its field. | `npx shadcn@latest add https://eased.dev/r/field-demo.json` |
| field | registry:ui | Label, control and one message line on Base UI Field. The description and the error share the line and swap with y + blur; inside Base UI's Form, submitting fo… | `npx shadcn@latest add https://eased.dev/r/field.json` |
| input-demo | registry:example | Workspace settings with a URL prefix, live validation and a disabled field. | `npx shadcn@latest add https://eased.dev/r/input-demo.json` |
| input | registry:ui | A Base UI text input whose focus is the border alone. An error shakes it once, 6px, then the field's message opens with a height spring. Leading and trailing a… | `npx shadcn@latest add https://eased.dev/r/input.json` |
| kbd-demo | registry:example | A keyboard shortcuts list whose keycaps press and rows light up as you hold the real keys. | `npx shadcn@latest add https://eased.dev/r/kbd-demo.json` |
| kbd | registry:ui | A keycap that presses down when the real key does: the face drops 1px onto its base and springs back on release. Glyphs are announced by name; useKeysHeld ligh… | `npx shadcn@latest add https://eased.dev/r/kbd.json` |
| number-roll-demo | registry:example | A revenue card: switch the range or the number format and every figure rolls; live orders tick the total up. | `npx shadcn@latest add https://eased.dev/r/number-roll-demo.json` |
| number-roll | registry:ui | Tabular digits that roll in the direction of change: a 9 → 0 carry rolls forward, a value that changes mid-roll redirects, new places fade in while the rest sl… | `npx shadcn@latest add https://eased.dev/r/number-roll.json` |
| popover-demo | registry:example | A Share popover with an invite field, people with access and a concentric footer. | `npx shadcn@latest add https://eased.dev/r/popover-demo.json` |
| popover | registry:ui | A panel that opens from its trigger's transform-origin with a 5px directional offset, closes at half the distance in 150ms, and reverses mid-flight. Its trigge… | `npx shadcn@latest add https://eased.dev/r/popover.json` |
| progress-demo | registry:example | An upload list: uneven chunks, an indeterminate processing step, then complete; plus a storage meter. | `npx shadcn@latest add https://eased.dev/r/progress-demo.json` |
| progress | registry:ui | A progress bar on Base UI Progress: the bar rides a spring and its value rolls; an unknown length sweeps with an accelerate–decelerate curve and hands over to … | `npx shadcn@latest add https://eased.dev/r/progress.json` |
| progressive-blur-demo | registry:example | A music library whose header and mini player blur the covers scrolling under them, with a flat-blur comparison. | `npx shadcn@latest add https://eased.dev/r/progressive-blur-demo.json` |
| progressive-blur | registry:ui | A blur that ramps from 0 to 20px over 80px toward an edge, from stacked masked backdrop layers, for headers, bottom bars and composers. Optionally scroll-linke… | `npx shadcn@latest add https://eased.dev/r/progressive-blur.json` |
| radio-group-demo | registry:example | A checkout delivery step: speed as radio cards, drop-off as radios that depend on it. | `npx shadcn@latest add https://eased.dev/r/radio-group-demo.json` |
| radio-group | registry:ui | Radios whose dot scales out from the centre on a snappy spring, and radio cards whose selected border travels between cards. Base UI RadioGroup behaviour. | `npx shadcn@latest add https://eased.dev/r/radio-group.json` |
| scroll-area-demo | registry:example | An activity feed with a horizontally scrolling filter row and a vertical list. | `npx shadcn@latest add https://eased.dev/r/scroll-area-demo.json` |
| scroll-area | registry:ui | A native scroller with a thin themed overlay scrollbar that thickens under the pointer, and edge fades that appear only when there is more to scroll. Base UI S… | `npx shadcn@latest add https://eased.dev/r/scroll-area.json` |
| segmented-demo | registry:example | A traffic card: a metric switch in the header and a date-range control that redraws the chart. | `npx shadcn@latest add https://eased.dev/r/segmented-demo.json` |
| segmented | registry:ui | A single-choice segmented control whose thumb glides to the selection on a spring. Base UI RadioGroup behaviour, concentric thumb, labels that never change wei… | `npx shadcn@latest add https://eased.dev/r/segmented.json` |
| skeleton-demo | registry:example | An activity feed that loads behind skeletons shaped by its own content, then hands off without moving a pixel. | `npx shadcn@latest add https://eased.dev/r/skeleton-demo.json` |
| skeleton | registry:ui | Loading placeholders with one page-wide shimmer: every skeleton shares a viewport-space highlight and one phase, so a single band sweeps across all of them. Wr… | `npx shadcn@latest add https://eased.dev/r/skeleton.json` |
| spinner-demo | registry:example | A deploy that walks its steps, each spinner swapping to a check, with the size scale underneath. | `npx shadcn@latest add https://eased.dev/r/spinner-demo.json` |
| spinner | registry:ui | A quarter arc turning on a faint ring, the eased.dev status-badge mark. Spins on the compositor, pauses off-screen, freezes under reduced motion, announces its… | `npx shadcn@latest add https://eased.dev/r/spinner.json` |
| tabs-demo | registry:example | A project page with Overview, Activity, Members and Settings tabs of different heights. | `npx shadcn@latest add https://eased.dev/r/tabs-demo.json` |
| tabs | registry:ui | Tabs with a gliding indicator (underline or pill) and panels that cross-fade 6px in the direction of travel while their container's height springs. Base UI Tab… | `npx shadcn@latest add https://eased.dev/r/tabs.json` |
| text-swap-demo | registry:example | An order tracker, a billing toggle and a copy button, each changing text with Text Swap. | `npx shadcn@latest add https://eased.dev/r/text-swap-demo.json` |
| text-swap | registry:ui | Change a label, status or short value with y + blur, and spring the width to fit, so neighbours glide instead of jumping. Direction-aware for counts and steps. | `npx shadcn@latest add https://eased.dev/r/text-swap.json` |
| textarea-demo | registry:example | A support reply that springs open as you write, with a rolling counter. | `npx shadcn@latest add https://eased.dev/r/textarea-demo.json` |
| textarea | registry:ui | A textarea that grows with its text on a smooth height spring instead of jumping a line at a time. The character counter rolls its digits and turns warning-col… | `npx shadcn@latest add https://eased.dev/r/textarea.json` |
| toggle-group-demo | registry:example | An editor toolbar: bold, italic, underline and strikethrough (multiple) beside text alignment (single). | `npx shadcn@latest add https://eased.dev/r/toggle-group-demo.json` |
| toggle-group | registry:ui | Toggle buttons sharing one highlight: it travels between items in single mode, and pressed neighbours fuse into one shape in multiple mode. Base UI ToggleGroup… | `npx shadcn@latest add https://eased.dev/r/toggle-group.json` |
| tooltip-demo | registry:example | An editor toolbar whose tooltips form one delay group, with keyboard shortcuts. | `npx shadcn@latest add https://eased.dev/r/tooltip-demo.json` |
| tooltip | registry:ui | A short label that waits 400ms for the first trigger, then follows the pointer instantly across its neighbours. Enters 3px toward its trigger, shows an optiona… | `npx shadcn@latest add https://eased.dev/r/tooltip.json` |
| cells-demo | registry:example | An accounts table: advance a month and MRR rolls, deltas recolour, onboarding meters glide, and active accounts breathe. | `npx shadcn@latest add https://eased.dev/r/cells-demo.json` |
| cells | registry:ui | Table cells that make rows look finished: avatar with name, status badge, number with a rolling value and coloured delta, a progress meter that fills on view, … | `npx shadcn@latest add https://eased.dev/r/cells.json` |
| eased-table-core | registry:ui | The layer under every Eased table: a TanStack Table v9 feature set with typed column meta, hairline rules, dense and comfortable densities, a hover-revealed so… | `npx shadcn@latest add https://eased.dev/r/eased-table-core.json` |
| table-demo | registry:example | An invoices table with mono IDs you can copy, avatars, status badges, amounts and relative dates, with a density toggle. | `npx shadcn@latest add https://eased.dev/r/table-demo.json` |
| table | registry:ui | A premium hairline table on TanStack Table: half-pixel row rules, a quiet sentence-case header, numbers right-aligned on one edge, one emphasised cell per row,… | `npx shadcn@latest add https://eased.dev/r/table.json` |
| attachment-demo | registry:example | A message draft with an upload in flight, a finished deck and a failed CSV with Retry. | `npx shadcn@latest add https://eased.dev/r/attachment-demo.json` |
| attachment | registry:ui | A chat attachment: images as a thumbnail that sharpens from a blur once decoded, files as a typed chip. Upload progress is a ring that springs between reports;… | `npx shadcn@latest add https://eased.dev/r/attachment.json` |
| composer-demo | registry:example | A working mini chat: send, attach, stop mid-reply, scroll up while it streams. | `npx shadcn@latest add https://eased.dev/r/composer-demo.json` |
| composer | registry:ui | A chat composer that grows on a spring, opens an attachments row with Auto Height, and morphs its Send arrow into a Stop square while a reply streams. Enter se… | `npx shadcn@latest add https://eased.dev/r/composer.json` |
| eased-chat-core | registry:ui | The chat model and hooks behind Eased's chat components: AI SDK UIMessage-compatible types, useStickToBottom, message grouping, the attachment model with useAt… | `npx shadcn@latest add https://eased.dev/r/eased-chat-core.json` |
| message-demo | registry:example | Follow-ups that merge into one run of bubbles, corners tightening as each lands. | `npx shadcn@latest add https://eased.dev/r/message-demo.json` |
| message | registry:ui | A chat message: the user's in a sunken bubble on the right, the assistant's flush on the left. Consecutive bubbles from one author merge, their touching corner… | `npx shadcn@latest add https://eased.dev/r/message.json` |
| eased-thinking-core | registry:ui | The clocks, models and contracts behind Eased's thinking states: useElapsed (seconds on the start's own grid), useTokenRate (a smoothed stream rate as motion v… | `npx shadcn@latest add https://eased.dev/r/eased-thinking-core.json` |
| shimmer-text-demo | registry:example | An agent's activity: a research status rotating mid-sweep, and a task list whose running row shimmers and settles as each task finishes. | `npx shadcn@latest add https://eased.dev/r/shimmer-text-demo.json` |
| shimmer-text | registry:ui | A soft band of light sweeps across a label while something is working. Every shimmer on the page shares one phase, status changes swap in without restarting th… | `npx shadcn@latest add https://eased.dev/r/shimmer-text.json` |
| thinking-bar-demo | registry:example | A billing question: the assistant thinks for six seconds with its reasoning streaming in, then answers while the bar settles to "Thought for 6s" and folds away. | `npx shadcn@latest add https://eased.dev/r/thinking-bar-demo.json` |
| thinking-bar | registry:ui | The line above a reasoning model's answer: the label shimmers while a seconds counter rolls, then "Thinking" morphs into "Thought for 12s" and the reasoning fo… | `npx shadcn@latest add https://eased.dev/r/thinking-bar.json` |
| agent-orb-demo | registry:example | A voice assistant: switch between idle, listening, thinking and speaking; speaking streams a reply in bursts and the orb speeds up and slows with the token rat… | `npx shadcn@latest add https://eased.dev/r/agent-orb-demo.json` |
| agent-orb | registry:ui | A small living orb for an assistant's state: colour fields drift inside a glassy sphere and it breathes, idle, listening, thinking or speaking, with its speed … | `npx shadcn@latest add https://eased.dev/r/agent-orb.json` |
| eased-chart-core | registry:ui | The engine under every Eased chart: nice scales, container sizing, path morphs on shared x samples, a slider-model scrub with a trailing tooltip, sliding gridl… | `npx shadcn@latest add https://eased.dev/r/eased-chart-core.json` |
| eased-layout | registry:lib | Alignment recipes for repeating rows: rowGrid and rowGridRow share a leading, a flexible and a fixed trailing track, so every row's role or value starts on one… | `npx shadcn@latest add https://eased.dev/r/eased-layout.json` |
| sparkline-demo | registry:example | A product-health card: a scrubbable daily-active-users line over four metric rows, all morphing with the range. | `npx shadcn@latest add https://eased.dev/r/sparkline-demo.json` |
| sparkline | registry:ui | A word-sized line chart that draws in once, rings its newest point in the surface colour and morphs to new values from the shape on screen. Optional scrub read… | `npx shadcn@latest add https://eased.dev/r/sparkline.json` |
| code-block-demo | registry:example | A docs excerpt: a 34-line debounce hook with line numbers and highlighted lines, collapsed after 12. | `npx shadcn@latest add https://eased.dev/r/code-block-demo.json` |
| code-block | registry:ui | Shiki-highlighted code in warm stone and cream themes, with a file title bar and language pill, a copy button that morphs into a check while "Copied" slides ou… | `npx shadcn@latest add https://eased.dev/r/code-block.json` |
| code-tabs-demo | registry:example | An install block synced across package managers, then three files of different heights and languages. | `npx shadcn@latest add https://eased.dev/r/code-tabs-demo.json` |
| code-tabs | registry:ui | Several files, or one command per package manager, in one code block: the underline glides between tabs, the code cross-fades 6px in the direction of travel wh… | `npx shadcn@latest add https://eased.dev/r/code-tabs.json` |
| eased-code-core | registry:ui | The engine behind Eased code components: a lazily loaded Shiki singleton (shiki/core + the JavaScript regex engine, grammars for tsx, ts, js, jsx, json, css, b… | `npx shadcn@latest add https://eased.dev/r/eased-code-core.json` |
| snippet-demo | registry:example | An install card: a package-manager switch drives two commands, plus a long git clone that scrolls under edge fades. | `npx shadcn@latest add https://eased.dev/r/snippet-demo.json` |
| snippet | registry:ui | A one-line command with a $ prompt and a copy button that morphs into a check. When the command changes (pnpm ↔ npm) the text swaps and the width springs, so t… | `npx shadcn@latest add https://eased.dev/r/snippet.json` |
| eased-skill | registry:item | The design skill Eased is built with, as an agent skill: alignment, the 1:2 spacing ratio, concentric radii, springs per role, enter and exit, focus rings, red… | `npx shadcn@latest add https://eased.dev/r/eased-skill.json` |
| eased-mac | registry:lib | The macOS look the Mac pack shares: the San Francisco font stack, frosted popover and HUD materials in light and dark, hairlines and macOS corner radii, with a… | `npx shadcn@latest add https://eased.dev/r/eased-mac.json` |
| mac-hud-demo | registry:example | A small macOS desktop with media keys: nudge volume, brightness and keyboard backlight (hold to repeat, or use the arrow keys) and switch between the classic a… | `npx shadcn@latest add https://eased.dev/r/mac-hud-demo.json` |
| mac-hud | registry:ui | The macOS volume and brightness overlay: a frosted, click-through HUD in the classic 200×200 square or the macOS 26 pill. Repeat changes update it in place and… | `npx shadcn@latest add https://eased.dev/r/mac-hud.json` |
| mac-menu-popover-demo | registry:example | A menu bar usage tracker: session and weekly plan usage, a reset countdown and app actions, over a frosted desktop. | `npx shadcn@latest add https://eased.dev/r/mac-menu-popover-demo.json` |
| mac-menu-popover | registry:ui | A macOS menu bar popover: a status item and a frosted panel whose arrow and panel are one shape, so one blur and one hairline follow the arrow. It grows from t… | `npx shadcn@latest add https://eased.dev/r/mac-menu-popover.json` |
| eased-mac-desktop | registry:component | The small macOS screen the Mac pack demos share: a soft wallpaper with a few files, a translucent menu bar with the app's menus, status items, Wi-Fi, battery a… | `npx shadcn@latest add https://eased.dev/r/eased-mac-desktop.json` |
| eased-inertia-core | registry:ui | useInertia: hand a MotionValue the release velocity and it coasts with UIScrollView friction onto the snap point the flick would reach (points, a step or a fun… | `npx shadcn@latest add https://eased.dev/r/eased-inertia-core.json` |
| image-compare-demo | registry:example | Plain vs Eased: the same share card as a default kit draws it and as Eased does, with a Loading mode that compares the skeleton with the loaded card. | `npx shadcn@latest add https://eased.dev/r/image-compare-demo.json` |
| image-compare | registry:ui | Compare any two layers (screenshots, themes, a plain component and its polished twin) with one divider. A flick coasts to 0, 50 or 100, a slow release stays wh… | `npx shadcn@latest add https://eased.dev/r/image-compare.json` |
| eased-calendar-core | registry:lib | Month, week and day grids, click-click and drag range selection over days or time slots with disabled units and length limits, WAI-ARIA grid keyboard movement,… | `npx shadcn@latest add https://eased.dev/r/eased-calendar-core.json` |
| eased-doc-core | registry:lib | Documents for contract review and docs: a paragraph/clause model with numbering and a text parser, word redlines on the diff package grouped into accept-or-rej… | `npx shadcn@latest add https://eased.dev/r/eased-doc-core.json` |
| eased-fixtures | registry:lib | Realistic, deterministic sample data per industry (AI, devtools, finance, crypto, SaaS, legal, e-commerce, real estate, health, HR), seeded and anchored to a f… | `npx shadcn@latest add https://eased.dev/r/eased-fixtures.json` |
| eased-flow-core | registry:lib | Node/edge graphs for CI pipelines, agent runs, payment routes and approval flows: a typed graph on thinking-core's StepStatus, a small-DAG auto layout (ranks, … | `npx shadcn@latest add https://eased.dev/r/eased-flow-core.json` |
| eased-realtime-core | registry:lib | Deterministic live data: a seeded RNG and tick stream (prices, rates, vitals), useClock and useTicker that pause off-screen and in hidden tabs and slow under r… | `npx shadcn@latest add https://eased.dev/r/eased-realtime-core.json` |
| eased-timeline-core | registry:lib | Events and timelines for matter histories, ledgers, deploy logs and activity feeds: a typed event model, Intl day grouping (Today, Yesterday, weekday), relativ… | `npx shadcn@latest add https://eased.dev/r/eased-timeline-core.json` |
| eased-overlay-core | registry:ui | What every Eased overlay shares: panel, menu and modal surfaces, the blurred scrim, menu rows on shared tracks with a gliding highlight, a drawn check and shor… | `npx shadcn@latest add https://eased.dev/r/eased-overlay-core.json` |
| dropdown-menu-demo | registry:example | A document's options menu: duplicate, rename, a Move to submenu, copy link, Show completed, Sort by and a danger Delete with undo. | `npx shadcn@latest add https://eased.dev/r/dropdown-menu-demo.json` |
| dropdown-menu | registry:ui | A menu that opens on mousedown 4px from its trigger, with one highlight gliding between rows and a macOS blink before it closes. Checkbox and radio rows, short… | `npx shadcn@latest add https://eased.dev/r/dropdown-menu.json` |
| eased-crypto-core | registry:ui | Shared pieces for Eased crypto blocks: a monochrome token glyph, chain tints as tokens with a ≤10% glow, address truncation, and USD price, token amount and si… | `npx shadcn@latest add https://eased.dev/r/eased-crypto-core.json` |
| eased-copy | registry:ui | The copy → check morph: a clipboard write with a textarea fallback, a useCopy hook that holds the copied state for 1.6s, the copy icon that swaps to a check wi… | `npx shadcn@latest add https://eased.dev/r/eased-copy.json` |
| eased-hold-core | registry:ui | Hold-to-confirm: a time-true linear fill while the pointer, Space or Enter is held, a quick no-overshoot drain when let go early, and a button that reveals its… | `npx shadcn@latest add https://eased.dev/r/eased-hold-core.json` |
| breadcrumb-demo | registry:example | A file browser five folders deep: open folders to grow the trail, click a crumb or the … menu to climb back. | `npx shadcn@latest add https://eased.dev/r/breadcrumb-demo.json` |
| breadcrumb | registry:ui | A trail from the root to the current page that folds its middle crumbs into a menu when it runs out of room, measured rather than guessed, with links that unde… | `npx shadcn@latest add https://eased.dev/r/breadcrumb.json` |
| pagination-demo | registry:example | An invoices list whose footer pages through 64 invoices, numbered in a wide tile and compact in a narrow one. | `npx shadcn@latest add https://eased.dev/r/pagination-demo.json` |
| pagination | registry:ui | Numbered pages whose selected chip glides on a spring, with ellipses in a fixed number of slots so the width never changes, and a compact Page 3 of 12 variant. | `npx shadcn@latest add https://eased.dev/r/pagination.json` |
| rating-demo | registry:example | A recipe's reviews: an average with a count that rolls when you rate, a large rating with a word that follows the pointer, and recent reviews. | `npx shadcn@latest add https://eased.dev/r/rating-demo.json` |
| rating | registry:ui | Star rating on Base UI RadioGroup with a hover preview, half steps and a read-only mode for any fraction. Icons fill from the left and pop in turn on a spring. | `npx shadcn@latest add https://eased.dev/r/rating.json` |
| carousel-demo | registry:example | Customer stories for a finance product, one metric and quote per slide. | `npx shadcn@latest add https://eased.dev/r/carousel-demo.json` |
| carousel | registry:ui | A scroll-snap carousel with native momentum, mouse drag and arrow keys. Its dot stretches between pages as you scroll and its edges fade only where there is mo… | `npx shadcn@latest add https://eased.dev/r/carousel.json` |
| file-upload-demo | registry:example | Lease documents with a simulated upload: one file is too large, one drops its connection once. | `npx shadcn@latest add https://eased.dev/r/file-upload-demo.json` |
| file-upload | registry:ui | A dropzone that wakes when files cross the page and lifts as they reach it. Rows rise in with per-file progress on a spring, and refused files are explained in… | `npx shadcn@latest add https://eased.dev/r/file-upload.json` |
| tree-demo | registry:example | A Next.js repository with git status markers and the selected path in the footer. | `npx shadcn@latest add https://eased.dev/r/tree-demo.json` |
| tree | registry:ui | A file tree whose folders open on a height spring as the chevron turns, both interruptible. One selection glides between rows, guides mark each level, and keys… | `npx shadcn@latest add https://eased.dev/r/tree.json` |
| date-picker-demo | registry:example | Time off: an away range that can't start in the past, and a typed handover date that must fall before it on a weekday. | `npx shadcn@latest add https://eased.dev/r/date-picker-demo.json` |
| date-picker | registry:ui | A date field with a calendar popover on Base UI and calendar-core. Typed dates parse in the field's locale, months slide the way you page, the selection glides… | `npx shadcn@latest add https://eased.dev/r/date-picker.json` |
| number-field-demo | registry:example | A limit order: shares with split steppers, a USD limit price and a scrubbable percent stop loss, with a rolling cost summary. | `npx shadcn@latest add https://eased.dev/r/number-field-demo.json` |
| number-field | registry:ui | A number input on Base UI's NumberField with steppers that speed up while held, digits that roll on every step, Intl formatting with a true minus, min, max and… | `npx shadcn@latest add https://eased.dev/r/number-field.json` |
| otp-field-demo | registry:example | Email verification with a 3-3 code, auto-verify on the last digit, a wrong-code error and a resend countdown. | `npx shadcn@latest add https://eased.dev/r/otp-field-demo.json` |
| otp-field | registry:ui | A one-time-code input on Base UI's OTPField: autofill and paste fill every cell, the caret blinks in the empty cell, characters pop in, a wrong code shakes onc… | `npx shadcn@latest add https://eased.dev/r/otp-field.json` |
| eased-commerce-core | registry:ui | Shared pieces for Eased e-commerce blocks: drawn product art, colour swatches, the price line, a rolling quantity stepper, the bag button and money and stock f… | `npx shadcn@latest add https://eased.dev/r/eased-commerce-core.json` |
| eased-saas-core | registry:ui | Shared pieces for Eased SaaS-admin blocks: a rolling delta chip that falls in warning, a usage meter that turns warning at 80%, relative times and compact mone… | `npx shadcn@latest add https://eased.dev/r/eased-saas-core.json` |
| eased-property-core | registry:ui | Shared pieces for Eased real-estate blocks: CRE units (SF, $/SF, terms, cap rates), lease-expiry status and its tints, the vacancy hatch and an expiry legend. | `npx shadcn@latest add https://eased.dev/r/eased-property-core.json` |
| eased-hr-core | registry:ui | Shared pieces for Eased HR and recruiting blocks: the 1–4 interview scale and its labels, four pips that fill to a rating, and the short time-in-stage clock. | `npx shadcn@latest add https://eased.dev/r/eased-hr-core.json` |
| eased-legal-core | registry:ui | Shared pieces for Eased legal blocks: the inline redline, the clause number track, deadline countdown wording, legal date and confidence formats, and the AI ma… | `npx shadcn@latest add https://eased.dev/r/eased-legal-core.json` |
| eased-health-core | registry:ui | Shared pieces for Eased health blocks: where a value sits against its range, a warning flag that pops in and out, and clinic clock times. | `npx shadcn@latest add https://eased.dev/r/eased-health-core.json` |

## For AI agents

```text
You are adding components from @eased to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/eased.md) for the component list.
2. Fetch the machine-readable index: https://eased.dev/r/registry.json
3. Install a single component with its install command from the table above.
4. Full structured record: https://sh4dcn.vercel.app/json (library slug: eased).
```