ClipboardButton

Maintainer:
Raubzeug
GitHub
size
text
hasTooltip
timeout
tooltipInitialText
tooltipSuccessText
import {ClipboardButton} from '@gravity-ui/uikit';

This component puts CopyToClipboard and ClipboardIcon together. CopyToClipboard sends a text to the clipboard and, as a wrapper, uses ClipboardIcon as content for itself to display animation when a copy-paste event happens.

<ClipboardButton text="Some text to copy" />

Properties

The ClipboardButton properties are inherited from the Button properties.

NameDescriptionTypeDefault
hasTooltipToggles displaying the tooltipbooleantrue
onCopyCallback after copying (text: string, result: boolean) => voidFunction
textText to copy (can be a string or a function that returns a string)string | () => string
timeoutTime before the state switches back to normal after the button is clickednumber1000
tooltipInitialTextText shown before copyingstring"Copy"
tooltipSuccessTextText shown after copyingstring"Copied!"
iconCustom iconReact.ReactNode
iconPositionPosition of iconstart | endstart