Initial commit

packages/hooks/src/useCopyToClipboard/Readme.md

@@ -0,0 +1,41 @@
+# useCopyToClipboard
+
+Copies a string to the clipboard and exposes a temporary `isCopied` flag that resets after a configurable timeout.
+
+## Signature
+
+```ts
+function useCopyToClipboard(options?: { timeout?: number; onCopy?: () => void }): {
+  isCopied: boolean;
+  copyToClipboard: (value: string) => void;
+};
+```
+
+### Options
+
+| Option    | Type         | Default | Description                                        |
+| --------- | ------------ | ------- | -------------------------------------------------- |
+| `timeout` | `number`     | `2000`  | Milliseconds before `isCopied` resets to `false`   |
+| `onCopy`  | `() => void` | —       | Callback fired immediately after a successful copy |
+
+### Returns
+
+| Property          | Type                      | Description                             |
+| ----------------- | ------------------------- | --------------------------------------- |
+| `isCopied`        | `boolean`                 | `true` for `timeout` ms after each copy |
+| `copyToClipboard` | `(value: string) => void` | Writes `value` to the clipboard         |
+
+## Usage
+
+```tsx
+function CopyButton({ code }: { code: string }) {
+  const { isCopied, copyToClipboard } = useCopyToClipboard({ timeout: 1500 });
+
+  return <button onClick={() => copyToClipboard(code)}>{isCopied ? 'Copied!' : 'Copy'}</button>;
+}
+```
+
+## Notes
+
+- Uses the `navigator.clipboard` API — no-ops silently in non-secure contexts or environments without clipboard support.
+- Client-only (`'use client'`). Does not run during SSR.

packages/hooks/src/useCopyToClipboard/index.ts

@@ -0,0 +1 @@
+export * from './useCopyToClipboard';

packages/hooks/src/useCopyToClipboard/useCopyToClipboard.ts

@@ -0,0 +1,35 @@
+'use client';
+
+import * as React from 'react';
+
+export function useCopyToClipboard({
+  timeout = 2000,
+  onCopy,
+}: {
+  timeout?: number;
+  onCopy?: () => void;
+} = {}) {
+  const [isCopied, setIsCopied] = React.useState(false);
+
+  const copyToClipboard = (value: string) => {
+    if (typeof window === 'undefined' || !navigator.clipboard.writeText) {
+      return;
+    }
+
+    if (!value) return;
+
+    navigator.clipboard.writeText(value).then(() => {
+      setIsCopied(true);
+
+      if (onCopy) {
+        onCopy();
+      }
+
+      setTimeout(() => {
+        setIsCopied(false);
+      }, timeout);
+    }, console.error);
+  };
+
+  return { isCopied, copyToClipboard };
+}