Copy Button

import { CopyButton } from "@/components/ui/copy-button"

export function CopyButtonDemo() {

Installation


pnpmnpmyarnbun
pnpm dlx shadcn@latest add https://nessra-ui.vercel.app/r/copy-button.json

import { CopyButton } from "@/components/ui/copy-button"

<CopyButton value="Text to copy" />

Display next to a code snippet or command.

npm install nessra-ui

import { CopyButton } from "@/components/ui/copy-button"

export function CopyButtonWithText() {

Use custom text or icons inside the button.

import { CopyButton } from "@/components/ui/copy-button"

export function CopyButtonCustom() {

Extends the Button component with copy functionality.

Prop	Type	Default	Description
`value`	`string`	-	The text to copy to clipboard
`onCopy`	`() => void`	-	Called after successful copy
`timeout`	`number`	`2000`	Duration of success state (ms)
`variant`	`string`	`"outline"`	Button variant
`size`	`string`	`"icon"`	Button size

All other Button props are supported.