Skip to content
kapable

CopyButton

Actions · 1 export · v0.1.0 · showcase

Clipboard action with visible success state and optional toast receipt.

Browse 72 component families

CopyButton requires the Clipboard API and client feedback after activation. This server-rendered page does not imitate client behavior. Open the live playground.

Usage

CopyButton usage
<CopyButton text={sha} label="Copy commit" />

API

CopyButton API

CopyButtonProps

Copy-to-clipboard button. Island doctrine (clipboard needs the client runtime); on success the glyph flips to a check for a moment and a toast fires if the page mounts a Toaster (the kp:toast event is harmless without one). Clipboard requires a secure context — failures surface as a fail toast, never silently.

CopyButton props
proptypenotes
textstringThe text that lands on the clipboard.
label?stringAccessible/visible label (default "Copy").
announce?stringToast message on success (default "Copied.").
glyphOnly?booleanShow only the glyph (label stays for AT).
variant?BtnVariant
size?BtnSize
mix?MixInput

More in Actions

More in Actions