React HTML Content Editor

A sophisticated HTML and CSS content editor with Monaco Editor integration, multiple view modes, scroll synchronization, and auto-save functionality.

Project Structure

This is a pnpm workspace monorepo containing:

• packages/library - The main library package
• packages/demo - Demo application showcasing the library

🌐 Live Demo

Check out the live demo and documentation: https://adrianomaringolo.github.io/react-html-content-editor/

The demo is automatically deployed to GitHub Pages on every push to main.

Getting Started

Prerequisites

• Node.js >= 18.0.0
• pnpm >= 8.0.0

Installation

pnpm install

Development

Run the demo app in development mode:

pnpm dev

Build the library:

pnpm build

Build all packages:

pnpm build:all

Run tests:

pnpm test

Packages

react-html-content-editor

The main library package. See packages/library/README.md for detailed documentation.

demo

Demo application showcasing all features of the library.

License

MIT

🚀 Release Process

This project uses automated releases with Changesets and GitHub Actions.

Quick Start

1. Make your changes
2. Create a changeset: pnpm changeset
3. Commit and push to main
4. GitHub Actions will create a Release PR
5. Merge the PR to publish to npm automatically

For detailed instructions, see RELEASE.md.

Manual Release

# Create a changeset
pnpm changeset

# Version packages (updates package.json and CHANGELOG)
pnpm changeset version

# Build and publish
pnpm release

📚 Documentation

• Published Documentation
• Library Documentation
• Live Demo
• GitHub Pages Setup
• Release Process
• Release Quick Guide
• Setup Checklist
• Contributing Guide
• Keyboard Shortcuts

🤝 Contributing

Contributions are welcome! Please read our Contributing Guide and Release Process before submitting a PR.