CopyButton

A copy button whose icon morphs into a check.

npx shadcn@latest add https://www.rad-ui.com/r/copy-button.json

Installation

bash
npx shadcn@latest add https://www.rad-ui.com/r/copy-button.json

React
import CopyButton from "@/components/fx/copy-button"

<CopyButton value={command} label="Copy install command" />

The result is announced with a role="status" "Copied" message, not just shown.
Needs an accessible name via `label`, e.g. "Copy install command".
prefers-reduced-motion: reduce (or data-rad-fx-motion="reduce" on an ancestor) swaps the icons without animating.

Prop	Type	Default	Description
value	string	—	Text to copy.
label	string	'Copy'	Accessible name.
resetAfter	number	1800	Milliseconds before resetting.