Hooks
useCopyToClipboard
Handle copy interactions, copied state, and timeout reset in a single helper.
Registry URL: https://react.tileui.zmorg.cn/r/button.json
import { Button } from '@tile-ui/react';
import { useCopyToClipboard } from '@tile-ui/react/hooks';
export default function UseCopyToClipboardDemo() {
const [copy, { copied }] = useCopyToClipboard();
Use this hook to copy text to the clipboard while managing the transient "copied" feedback state in one place.
Registry install
pnpm dlx shadcn@latest add @tile-ui/use-copy-to-clipboardUsage
const [copy, { copied }] = useCopyToClipboard();What it covers
- Writing text to the browser clipboard
- A
copiedboolean that flips for a short period after a copy - Timeout cleanup so stale feedback does not linger
Common use cases
- Copy buttons for registry URLs or install commands
- Sharing short snippets from the UI
- Capture flows that mirror the copy-and-paste workflow