moonlight-editor

Rich text editor built on Plate with AI features and extensive plugin support.

Installation

npm install moonlight-editor
# or
yarn add moonlight-editor
# or
pnpm add moonlight-editor
# or
bun add moonlight-editor

Requirements

• React 18+
• React DOM 18+

All Plate.js dependencies are bundled.

Usage

import { PlateEditor } from 'moonlight-editor';
import 'moonlight-editor/styles.css';

export default function App() {
  return <PlateEditor />;
}

With Custom Components

import { 
  Editor, 
  FixedToolbar, 
  FixedToolbarButtons,
  FloatingToolbar,
  FloatingToolbarButtons 
} from 'moonlight-editor';
import 'moonlight-editor/styles.css';

export default function CustomEditor() {
  return (
    <Editor>
      <FixedToolbar>
        <FixedToolbarButtons />
      </FixedToolbar>
      <FloatingToolbar>
        <FloatingToolbarButtons />
      </FloatingToolbar>
    </Editor>
  );
}

Features

• AI-powered editing
• Rich text formatting
• Code blocks with syntax highlighting
• Tables, lists, and more
• Media support (images, videos, audio)
• Markdown support
• Collaborative editing
• Extensive plugin system

License

MIT