📋 Clipboard Utils (TypeScript)

A cross-platform clipboard utility library for both browser and Node.js environments. Supports universal copying and clipboard access with fallback strategies.

🚀 Installation

npm install clipboard-utils-ts

🔧 Usage

🖥️ Universal Usage (Browser & Node.js)

import { copyToClipboard } from 'clipboard-utils-ts';

await copyToClipboard('Hello, Clipboard!');

🌐 Browser-Specific

import {
  copyToClipboardBrowser,
  readFromClipboardBrowser,
} from 'clipboard-utils-ts';

// Copy to clipboard (browser)
await copyToClipboardBrowser('Copying text in browser');

// Read from clipboard (browser)
const text = await readFromClipboardBrowser();
console.log('Read from clipboard:', text);

⚠️ Reading requires HTTPS and user interaction in most browsers (like a button click).

🖥️ Node.js-Specific

import { copyToClipboardNode } from 'clipboard-utils-ts';

// Copy to clipboard (Node.js)
await copyToClipboardNode('Copied from Node.js');

Supports macOS (pbcopy), Linux (xclip/xsel), and Windows (clip).

🧪 React Example

✅ Example: Copy to Clipboard Button

'use client';
import React, { useState } from 'react';
import { copyToClipboard, readFromClipboardBrowser } from 'clipboard-utils-ts';

export default function ClipboardExample() {
  const [copied, setCopied] = useState(false);
  const [text, setText] = useState('');

  const handleCopy = async () => {
    await copyToClipboard('Copied from React!');
    setCopied(true);
    setTimeout(() => setCopied(false), 2000);
  };

  const handleRead = async () => {
    const clipboardText = await readFromClipboardBrowser();
    setText(clipboardText);
  };

  return (
    <div>
      <button onClick={handleCopy}>
        {copied ? 'Copied!' : 'Copy to Clipboard'}
      </button>
      <button onClick={handleRead}>Read from Clipboard</button>
      <p>Clipboard Text: {text}</p>
    </div>
  );
}

📘 API Reference

🔹 copyToClipboard(text: string): Promise<void>

Universal function that works in both browser and Node.js.

🔹 copyToClipboardBrowser(text: string): Promise<void>

Browser-specific implementation using the Clipboard API.

🔹 copyToClipboardNode(text: string): Promise<void>

Node.js implementation using:

• macOS: pbcopy
• Linux: xclip or xsel
• Windows: clip

🔹 readFromClipboardBrowser(): Promise<string>

Reads text from the system clipboard in browser environments.

🛠️ Edge Cases & Notes

• 📦 Node.js clipboard functions use native binaries — make sure tools like xclip are installed on Linux.
• 🔐 Clipboard read in the browser usually requires user interaction and secure context (HTTPS).
• ❌ Reading clipboard is not supported in Node.js due to security limitations (unless using external packages like clipboardy).

💡 Future Ideas

• ✅ Add readFromClipboardNode() using clipboardy (optional peer dep)
• 🌍 Add fallback polyfills for older browsers
• 🔄 Support structured clipboard data (like JSON)

🧑‍💻 Contributors

Built and maintained with ❤️ by Vijay.