/
1.1k
Sponsor

Clipboard

Copy-to-clipboard button with success feedback

Terminal

Installation

$ pnpm dlx shadcn@latest add @termcn/ink/clipboard

Usage

import { Clipboard } from "@/components/ui/clipboard";
<Clipboard value="npm install termcn" label="Install command" />

API Reference

Clipboard

PropTypeDefault
valuestringrequired
labelstring-
successMessagestring"Copied!"
timeoutnumber2000

Notes

Accessibility

termcn exposes the following behavior through Ink's terminal accessibility APIs. This is not a browser ARIA or general WCAG-conformance claim.

  • Keyboard: Enter / Space activate the focused action when enabled; Escape dismisses or cancels when supported; Tab / Shift+Tab move through Ink focus targets.
  • Focus and composition: Input is active only while the component's focus target is focused, enabled, active, and inside the topmost focus scope.
  • Screen reader: Ink labels and semantic state expose the component without relying on visual styling alone.