useClipboard Hook

Copy text to clipboard with feedback state

ReactClipboardBrowser API

useClipboard

Copy text to clipboard with feedback

Copy source code and paste it in hooks/devsloka-hooks folder

hooks/devsloka-hooks/use-clipboard.tsx

1"use client";
2import { useState } from "react";
3
4export const useClipboard = (): {
5 isCopied: boolean;
6 copy: (text: string) => void;
7} => {
8 const [isCopied, setIsCopied] = useState<boolean>(false);
9
10 const copy = async (text: string) => {
11 await navigator.clipboard.writeText(text);
12 setIsCopied(true);
13 setTimeout(() => setIsCopied(false), 2000);
14 };
15
16 return { isCopied, copy };
17};