💻 Write Your Code (Example)

This simple example transforms text into PascalCase or kebab-case using a popup interface.

📄 manifest.json

{
  "manifest_version": 3,
  "name": "Text Transform",
  "version": "1.0",
  "description": "A simple text transformer Chrome extension.",
  "action": {
    "default_popup": "popup.html",
  }
}

🖼️ popup.html

<!DOCTYPE html>
<html>
  <head>
    <title>TextTransformer</title>
    <style>
      body {
        font-family: Arial, sans-serif;
        padding: 20px;
        width: 300px;
      }
      textarea {
        width: 100%;
        height: 80px;
        margin-bottom: 10px;
      }
      button {
        margin: 5px 5px 10px 0;
      }
    </style>
  </head>
  <body>
    <h2>Text Transformer</h2>

    <textarea id="inputText" placeholder="Enter your text here"></textarea>

    <div>
      <button id="pascalCaseBtn">Pascal Case</button>
      <button id="kebabCaseBtn">Kebab Case</button>
    </div>

    <textarea id="outputText" placeholder="Converted text"></textarea>

    <script src="popup.js"></script>
  </body>
</html>

🧠 popup.js

function toPascalCase(text) {
  return text
    .replace(/\w+/g, (w) => w[0].toUpperCase() + w.slice(1).toLowerCase())
    .replace(/\s+/g, '');
}

function toKebabCase(text) {
  return text
    .toLowerCase()
    .replace(/\s+/g, '-');
}

document.getElementById('pascalCaseBtn').addEventListener('click', () => {
  const input = document.getElementById('inputText').value;
  document.getElementById('outputText').value = toPascalCase(input);
});

document.getElementById('kebabCaseBtn').addEventListener('click', () => {
  const input = document.getElementById('inputText').value;
  document.getElementById('outputText').value = toKebabCase(input);
});

🎯 Add an Icon (Optional but Recommended)

Create an icon image named icon.png (size: 128x128 px recommended).
Save it inside your extension folder.

📂 Folder Structure

text-transformer-extension/
│
├── manifest.json
├── popup.html
├── popup.js
├── style.js
└── icon.png  (optional)

✅ That’s it! You now have a fully functional Chrome extension that converts text to PascalCase or kebab-case via a pop-up interface.

Download/Clone/Preview this repository:
👉 GitHub - ArshdeepGrover/text-transformer-extension