Copy to Clipboard

A button that copies specified text to the system clipboard and provides visual feedback on success.

Install

npx @vultra/cli add copy-to-clipboard

Usage

<script>
  import { CopyToClipboard } from '@vultra/ui';
</script>

<CopyToClipboard text="npm install @vultra/ui">
  <span class="font-mono">npm install @vultra/ui</span>
</CopyToClipboard>

Props

Prop	Type	Default	Description
text	string	-	Text to copy to clipboard
copiedDuration	number	2000	Duration (ms) to show copied state
class	string	-	Additional CSS classes

Slots

Slot	Description
default	Trigger element (button content)
copied	Content shown during copied state

Accessibility

• Uses navigator.clipboard.writeText().
• Announces “Copied!” to screen readers via aria-live.