Skip to content

lbwalton/prompt-box-extension

Repository files navigation

Prompt Box - Chrome Extension

A simple Chrome extension to store, organize, and quickly access your AI prompts.

Features

  • 🗂️ Organize Prompts - Categorize your prompts (Writing, Coding, Research, etc.)
  • 🔍 Quick Search - Find prompts instantly with built-in search
  • 📋 One-Click Copy - Copy any prompt to clipboard
  • 💾 Right-Click Save - Select text on any webpage and save it as a prompt
  • 🔒 Private Storage - All data stored locally in Chrome (no cloud required)

Installation

From Chrome Web Store

Coming soon!

Developer Installation

  1. Download or clone this repository
  2. Open Chrome and go to chrome://extensions/
  3. Enable "Developer mode" (toggle in top right)
  4. Click "Load unpacked"
  5. Select the folder containing these files
  6. The Prompt Box extension will appear in your toolbar

How to Use

Adding Prompts

  • Method 1: Click the Prompt Box icon in your toolbar → click "+ Add"
  • Method 2: Select any text on a webpage → right-click → "Save to Prompt Box"

Using Prompts

  1. Click the Prompt Box icon
  2. Search for your prompt or browse by category
  3. Click "Copy" to copy the prompt to your clipboard
  4. Paste wherever you need it!

Files Structure

  • manifest.json - Extension configuration
  • popup.html - Main interface
  • popup.js - Interface logic
  • background.js - Right-click menu handler
  • content.js - Webpage integration
  • icon16.png, icon48.png, icon128.png - Extension icons

Development

Making Changes

  1. Edit the files in your local copy
  2. Go to chrome://extensions/
  3. Click the refresh icon on the Prompt Box extension
  4. Test your changes

Building for Chrome Web Store

When you're ready to submit to the Chrome Web Store, you need to create a clean package that excludes development files.

Option 1: Shell Script (Recommended)

./build.sh

This will:

  • Create a dist/ folder with only the necessary files
  • Generate prompt-box-extension.zip ready for upload
  • Show you what files are included

Option 2: Node.js Build Script

First install dependencies:

npm install

Then build:

npm run build  # Creates clean dist/ folder
npm run zip    # Creates ZIP file for Chrome Web Store

Option 3: Manual Process

If you prefer to do it manually:

  1. Create a new folder called dist/
  2. Copy only these files to dist/:
    • Manifest.json
    • background.js
    • popup.html
    • popup.js
    • icon16.png
    • icon48.png
    • icon128.png
  3. Create a ZIP file from the contents of dist/

Files Excluded from Chrome Web Store Package

The following development files are automatically excluded (see .chromeignore):

  • README.md (this file)
  • PRD.md (Product Requirements Document)
  • security.mdc (Security guidelines)
  • build.sh and build.js (build scripts)
  • package.json (npm configuration)
  • .git/ (git repository files)
  • Any .md files
  • Development tool configurations

Submitting to Chrome Web Store

  1. Run the build script: ./build.sh
  2. Go to Chrome Web Store Developer Dashboard
  3. Pay $5 developer fee (one-time)
  4. Upload the generated prompt-box-extension.zip file
  5. Fill in the store listing details
  6. Wait for review (1-3 days)

Development Commands Quick Reference

Command Description
./build.sh Build and create ZIP for Chrome Web Store
npm install Install Node.js dependencies
npm run build Create clean dist/ folder
npm run zip Create ZIP file after building

Contributing

Feel free to submit issues and feature requests!

License

MIT License - feel free to use and modify!

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors 2

  •  
  •