A button that copies a value to the clipboard and confirms when it has.
| – |
Props for the copy button. |
children | ReactNode | – | What the field shows in place of |
copiedIcon | ReactNode | – | Replaces this icon. Accepts any node; |
copiedText | string | Copied! | The confirmation shown after copying, in the toast or, without one, in the tooltip. |
copyIcon | ReactNode | – | Replaces this icon. Accepts any node; |
disabled | boolean | false | Whether copying is disabled. |
onCopy | ((value: string) => void) | – | Called with the copied value once it reaches the clipboard. |
onError | ((error: unknown) => void) | – | Called when there is nothing to copy or the browser refuses the copy. |
showToast | boolean | true | Whether to confirm a copy with a toast anchored to the button. The toast needs an |
showTooltip | boolean | true | Whether the copy button shows a tooltip. |
side | "top"|"bottom"|"left"|"right" | top | Which side of the copy button the tooltip and toast open on. |
size | "lg"|"sm"|"default" | default | The size of the component. |
textProps | DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement> | – | Props for the element that shows the text. |
textToCopy | string | – | The text to copy, when it differs from |
timeout | number | 2000 | How long the copied state and its toast last, in milliseconds. |
tooltipText | string | Copy | The copy button's tooltip, also used as its accessible name. |
