Summary
Add a framework-agnostic vanilla JS package that exposes the editor as a simple class consumers can mount into any DOM element — no React, Vue, or other framework required.
Motivation
The core package (@eigenpal/docx-core) is already fully framework-agnostic: managers, layout pipeline, ProseMirror extensions, and DOCX parsing all work without any framework. The React and Vue packages are orchestration wrappers. A vanilla JS package would:
- Enable usage in non-React/Vue environments (Svelte, Angular, plain HTML, web components, etc.)
- Provide the smallest possible bundle (no framework overhead)
- Serve as the foundation that framework wrappers could optionally build on top of
Proposed API
import { DocxEditor } from '@eigenpal/docx-editor-vanilla';
const editor = new DocxEditor(document.getElementById('editor'), {
zoom: 1,
// options...
});
await editor.load(docxBlob);
// Imperative API
editor.focus();
editor.undo();
editor.redo();
const blob = await editor.save();
editor.destroy();
// Events
editor.on('selectionChange', (state) => { ... });
editor.on('contentChange', () => { ... });
Scope
In scope
- Orchestration class that wires existing core managers, layout pipeline, and ProseMirror
- Hidden ProseMirror mount + visible pages rendering via
LayoutPainter
- Click/selection handling via
layout-bridge
- Transaction listener → repaint loop
- Imperative API:
load(), save(), focus(), destroy(), undo(), redo()
- Event emitter for selection/content changes
- Headless toolbar API (expose commands, let consumers build their own UI)
Out of scope (for now)
- Built-in toolbar UI (consumers use the commands API)
- Dialogs (find/replace, insert image, etc.)
- These can be added later as optional add-ons
Implementation Notes
The vanilla package replaces what React does in ~3 files:
| React Component |
Vanilla Equivalent |
DocxEditor.tsx (state wiring) |
Orchestration class, wire managers |
PagedEditor.tsx (render loop, mouse handlers) |
Transaction listener → repaint loop |
HiddenProseMirror.tsx (PM mount) |
new EditorView(hiddenDiv, {...}) |
Estimated ~500-800 lines of new code, primarily wiring existing @eigenpal/docx-core APIs together. No new rendering or parsing logic needed.
Summary
Add a framework-agnostic vanilla JS package that exposes the editor as a simple class consumers can mount into any DOM element — no React, Vue, or other framework required.
Motivation
The core package (
@eigenpal/docx-core) is already fully framework-agnostic: managers, layout pipeline, ProseMirror extensions, and DOCX parsing all work without any framework. The React and Vue packages are orchestration wrappers. A vanilla JS package would:Proposed API
Scope
In scope
LayoutPainterlayout-bridgeload(),save(),focus(),destroy(),undo(),redo()Out of scope (for now)
Implementation Notes
The vanilla package replaces what React does in ~3 files:
DocxEditor.tsx(state wiring)PagedEditor.tsx(render loop, mouse handlers)HiddenProseMirror.tsx(PM mount)new EditorView(hiddenDiv, {...})Estimated ~500-800 lines of new code, primarily wiring existing
@eigenpal/docx-coreAPIs together. No new rendering or parsing logic needed.