react-clean-paste

A tiny 0-dependency React hook that automatically cleans, formats, and sanitizes pasted text.

Users paste messy content from Word, Google Docs, emails, WhatsApp, PDFs, and more. react-clean-paste fixes all of it instantly with one hook.

✨ Features

• Remove HTML tags
• Normalize whitespace
• Convert bullets (• ● ▪) → "-"
• Fix smart quotes → normal quotes
• Trim spacing
• Fully typed (TypeScript)
• Zero dependencies
• Works with Formik, React Hook Form, Zod & any input or textarea

📦 Installation

npm install react-clean-paste

🚀 Quick Usage

import { useState } from "react";
import { useSmartPaste } from "react-clean-paste";

export default function App() {
  const [value, setValue] = useState("");

  const pasteHandler = useSmartPaste((cleaned) => {
    setValue(cleaned);
  });

  return (
    <textarea
      {...pasteHandler}
      value={value}
      onChange={(e) => setValue(e.target.value)}
      placeholder="Paste anything here..."
      rows={6}
    />
  );
}

⚙️ Options

useSmartPaste((cleaned) => console.log(cleaned), {
  stripHtml: true,
  normalizeWhitespace: true,
  cleanBullets: true,
  fixQuotes: true,
  trim: true
});

Options Table

Option	Type	Default	Description
stripHtml	boolean	true	Removes HTML tags
fixQuotes	boolean	true	Convert smart quotes to normal quotes
cleanBullets	boolean	true	Converts • ● ▪ → "-"
normalizeWhitespace	boolean	true	Cleans weird spacing, tabs & line breaks
trim	boolean	true	Trim leading & trailing spaces

🧹 Manual Sanitization (without React)

import { sanitize } from "react-clean-paste";

sanitize("<b>Hello</b>", { stripHtml: true });
// => "Hello"

sanitize("• One ● Two ▪ Three", { cleanBullets: true });
// => "- One - Two - Three"

📄 License

MIT