Provides copy to clipboard functionality.


Install the custom hook from your command line.

npm i @raddix/use-clipboard


Displaying a Temporary Success State

Copies text to the clipboard and shows the user that it was copied successfully with a copied status and after a certain amount of time resets it to its initial state.

The duration in milliseconds used to toggle the isCopied state is 2000, you can change this using the timeout option

import { useClipboard } from '@raddix/use-clipboard';
const Copy = () => {
const [isCopied, copy] = useClipboard();
let url = window.location.href;
return (
<input value={url} readOnly />
<button onClick={() => copy(url)}>
{isCopied ? 'Copied!' : 'Copy Link'}

Handling Success and Errors

In case the copy action fails you can handle it using the onError callback. If the copy action was successful, use onSuccess.

For example you can give a notification to the user when the copy fails.

import { ToastContainer, toast } from 'react-toastify';
import { useClipboard } from '@raddix/use-clipboard';
import 'react-toastify/dist/ReactToastify.css';
const Copy = () => {
const [isCopied, copy] = useClipboard({
onError(err) {
toast.error("Error al copiar al portapapeles");
console.log('Error al copiar al portapapeles:', err);
let urlShare = 'https://meeting.raddix.dev/klp-z3e0-tc1'
return (
Comparte este vínculo de reunión con otras personas que quieres que participen en ella
<button onClick={() => copy(urlShare)}>
{isCopied ? '✅Copied' : 'Copy'}
<ToastContainer />



The useClipboard hook accepts a configuration object:

NameDescriptionDefault ValueType
timeoutDefines the timeout duration for the isCopied state2000number
onSuccessA callback function that will be called upon a successful copy action.function
onErrorA callback function that will be called when the copy action fails.function


The useClipboard hook returns an array with the following elements:

0A boolean value indicating whether the copy action was performed.boolean
1A function to copy a specified value to the clipboard.function