Add params for copying func

.changeset/rich-garlics-help.md

@@ -0,0 +1,5 @@
+---
+"react-use-clipboard": patch
+---
+
+Add params for copying func

README.md

@@ -26,10 +26,10 @@ Here's how to use `react-use-clipboard`:
 import useClipboard from "react-use-clipboard";
 
 function App() {
-  const [isCopied, setCopied] = useClipboard("Text to copy");
+  const [isCopied, setCopied] = useClipboard();
 
   return (
-    <button onClick={setCopied}>
+    <button onClick={() => setCopied("Text to copy")}>
       Was it copied? {isCopied ? "Yes! 👍" : "Nope! 👎"}
     </button>
   );
@@ -42,13 +42,13 @@ You can reset the `isCopied` value after a certain amount of time with the `succ
 import useClipboard from "react-use-clipboard";
 
 function App() {
-  const [isCopied, setCopied] = useClipboard("Text to copy", {
+  const [isCopied, setCopied] = useClipboard({
     // `isCopied` will go back to `false` after 1000ms.
     successDuration: 1000,
   });
 
   return (
-    <button onClick={setCopied}>
+    <button onClick={() => setCopied("Text to copy")}>
       Was it copied? {isCopied ? "Yes! 👍" : "Nope! 👎"}
     </button>
   );

example/pages/index.js

@@ -1,13 +1,13 @@
 import useClipboard from "react-use-clipboard";
 
 export default function App() {
-  const [isCopied, setCopied] = useClipboard("Text to copy", {
+  const [isCopied, setCopied] = useClipboard({
     // `isCopied` will go back to `false` after 1000ms.
     successDuration: 1000,
   });
 
   return (
-    <button onClick={setCopied}>
+    <button onClick={() => setCopied("Text to copy")}>
       Was it copied? {isCopied ? "Yes! 👍" : "Nope! 👎"}
     </button>
   );

src/index.test.tsx

@@ -6,10 +6,10 @@ afterEach(cleanup);
 
 test("display sucess message if the copy worked", () => {
   const Component = () => {
-    const [isCopied, setCopied] = useClipboard("Text to copy");
+    const [isCopied, setCopied] = useClipboard();
 
     return (
-      <button onClick={setCopied} data-testid="btn-example">
+      <button onClick={() => setCopied("Text to copy")} data-testid="btn-example">
         {isCopied ? "Yes" : "Nope"}
       </button>
     );
@@ -31,12 +31,12 @@ describe("successDuration", () => {
     const successDuration = 1000;
 
     const Component = () => {
-      const [isCopied, setCopied] = useClipboard("Text to copy", {
+      const [isCopied, setCopied] = useClipboard({
         successDuration,
       });
 
       return (
-        <button onClick={setCopied} data-testid="btn-example">
+        <button onClick={()=> setCopied("Text to copy")} data-testid="btn-example">
           {isCopied ? "Yes" : "Nope"}
         </button>
       );
@@ -68,10 +68,10 @@ describe("successDuration", () => {
     jest.useFakeTimers();
 
     const Component = () => {
-      const [isCopied, setCopied] = useClipboard("Text to copy", {});
+      const [isCopied, setCopied] = useClipboard({});
 
       return (
-        <button onClick={setCopied} data-testid="btn-example">
+        <button onClick={() => setCopied("Anything")} data-testid="btn-example">
           {isCopied ? "Yes" : "Nope"}
         </button>
       );

src/index.tsx

@@ -10,9 +10,8 @@ interface IOptions {
 }
 
 export default function useCopyClipboard(
-  text: string,
   options?: IOptions
-): [boolean, () => void] {
+): [boolean, (text: string) => void] {
   const [isCopied, setIsCopied] = useState(false);
   const successDuration = options && options.successDuration;
 
@@ -30,7 +29,7 @@ export default function useCopyClipboard(
 
   return [
     isCopied,
-    () => {
+    (text: string) => {
       const didCopy = copy(text);
       setIsCopied(didCopy);
     },