useClipboard
@astryxdesign/core v0.7.1 · useClipboard
Usage
Copy-to-clipboard behavior: the clipboard write, a transient isCopied flag with its own reset timer, and an optional polite screen-reader announcement. Extracted so every copy affordance is a thin control over one implementation instead of re-deriving the timer and announcement. Rapid re-copies restart the reset timer so the confirmation always lasts the full duration, and the timer is cleaned up when the effect scope is disposed. CodeBlock builds its built-in copy button on it; reach for it directly when building a copy affordance that is not a plain icon button (a menu item, a labeled text button, a copy-on-click value chip).
import { useClipboard } from '@astryx-vue/core'The same function is also exported as useCopyToClipboard, from @astryx-vue/core and from @astryx-vue/core/Code. isCopied is a ref, so the template unwraps it.
Best practices
| Guidance | Practices |
|---|---|
| Do | Drive the copied confirmation (copy → check icon, label swap) off the returned isCopied ref rather than tracking your own state. |
| Do | Pass a localized announce message so the copy is spoken by screen readers; swapping the button aria-label alone is not reliably announced. |
| Do | For the common compact icon copy button, render a ghost IconButton with a "Copy" tooltip and wire @click to copy(); the tooltip stays "Copy" and the icon flip is the confirmation. |
| Don't | Track a separate copied ref alongside the hook; isCopied already reflects the copied window and resets itself. |