Copy Text

The default CopyText renders as highlighted inline text within surrounding content. Clicking it copies the Value to the clipboard, and a tooltip appears on hover or focus prompting the user to copy, switching to a confirmation with a check icon after a successful copy.

The displayed content and the copied text are independent — ChildContent controls what the user sees while Value controls what lands on the clipboard. This is useful for masked secrets such as API keys, where the full key is copied but only the last characters are shown.

Use OnCopied to react after the value has been copied — the callback receives the copied string and fires only when the clipboard write succeeds. Here it triggers a toast via the injected ToastService to confirm the action beyond the built-in tooltip.

Use the Class parameter to restyle the element. This example turns the default primary-coloured text into a monospace code chip with a muted background — a common pattern for copyable install commands and terminal snippets.

Set AriaLabel to give assistive technologies a more descriptive announcement than the default localized "Click to copy" text. Describe what will be copied so screen reader users know the outcome before activating the element.