@nex-ui/hooks/dist/esm/useClipboard.mjs

A collection of React Hooks for Nex UI components.

"use client";
import { useState } from 'react';

/**
 * Copies the given text to the clipboard.
 * @param {number} timeout - timeout in ms, default 2000
 * @returns {copy, copied, error, reset} - copy function, copied state, error state, reset function
 */ function useClipboard({ timeout = 2000 } = {}) {
    const [error, setError] = useState(null);
    const [copied, setCopied] = useState(false);
    const [copyTimeout, setCopyTimeout] = useState(null);
    const onClearTimeout = ()=>{
        if (copyTimeout) {
            clearTimeout(copyTimeout);
        }
    };
    const handleCopyResult = (value)=>{
        onClearTimeout();
        setCopyTimeout(setTimeout(()=>setCopied(false), timeout));
        setCopied(value);
    };
    const copy = (valueToCopy)=>{
        if ('clipboard' in navigator) {
            navigator.clipboard.writeText(valueToCopy).then(()=>handleCopyResult(true)).catch((err)=>setError(err));
        } else {
            setError(new Error('useClipboard: navigator.clipboard is not supported'));
        }
    };
    const reset = ()=>{
        setCopied(false);
        setError(null);
        onClearTimeout();
    };
    return {
        copy,
        reset,
        error,
        copied
    };
}

export { useClipboard };