CopyableToken

Click-to-copy token displayed as an inline code label

Interactive-mode

Divergence from Blok

Interactive feedback beyond Blok. Blok's source renders a static tooltip with Copy to clipboard and silently copies on click. BlazorUI additionally:

Swaps the tooltip text to a confirmation message on click, then hides the tooltip after 1s (reset when the cursor leaves the token).
Exposes CopyMessage (default "Copy to clipboard") and CopiedMessage (default "Copied") parameters so callers can localise or re-word the states.
Fires a Clicked EventCallback<string> with the copied value so callers can react (analytics, a secondary toast, audit logging).

Examples

Default

api-key-4f2a9c71

UUID token

3b5e4d2f-7a1c-4f9b-8d6e-1a2b3c4d5e6f

Inline within prose

Run

npm install

in the project root to install dependencies.

Multiple tokens in a stack

client_id

client_secret

redirect_uri

Custom messages

sk-live-9f2a

Clicked callback

abc-123-def

API

The element family below can be composed together. Click an element to jump to its properties.

Element	Purpose
CopyableToken	Inline `<code>` label that copies `Token` to the clipboard when clicked. Wraps a `Tooltip` that swaps from `CopyMessage` to `CopiedMessage` for a brief confirmation window.

CopyableToken

Inline <code> label that copies Token to the clipboard when clicked. Wraps a Tooltip that swaps from CopyMessage to CopiedMessage for a brief confirmation window.

Property	Type	Description
Token	string	Text to display and copy to the clipboard on click.
CopyMessage	string	Tooltip text shown on hover before clicking. Default: `"Copy to clipboard"`.
CopiedMessage	string	Tooltip text shown briefly after a successful copy. Default: `"Copied"`.
Clicked	EventCallback<string>	Fires with the copied value after the clipboard write succeeds. Useful for analytics or audit logging.
ClassName	string?	Extra CSS classes appended to the token `<code>` element.
AdditionalAttributes	Dictionary<string, object>?	Captured unmatched attributes, forwarded to the token `<code>` element.