Overview
tng-copy-button copies text to the clipboard on click and shows a brief “copied” state. Use variant (ghost | outline | solid) and size (sm | md). Project default content and [tngCopied] for the copied state. Styling is via [slot]: container and content are merged with defaults.
Quick example
Basic
<tng-copy-button [text]="snippet()">
<span>Copy</span>
<span tngCopied>Copied</span>
</tng-copy-button>
import { TngCopyButton } from '@tailng-ui/ui/utilities';
snippet = computed(() => 'Text to copy');Features
Variant & size
variant: ghost | outline | solid. size: sm | md. Defaults drive base styles; override with [slot] (container, content).
Content slots
Default content for the button; project [tngCopied] for the content shown after copy (e.g. icon + “Copied”).
Slot styling
Pass [slot] with container and content; classes are merged with defaults.