Open-Source DOCX Editor for React Apps

Release Details

The eigenpal/docx-editor project appeared on Hacker News as a Show HN submission. It provides an open-source WYSIWYG editor for .docx files that runs in React and Vue applications. The library parses and serializes canonical OOXML, supports tracked changes, and includes real-time collaboration primitives. It ships separate adapters plus a framework-agnostic core package. The announcement lists an agent SDK for connecting document editing to AI workflows.

Technical Breakdown

The core package handles OOXML parsing, layout, and a ProseMirror-based schema. This keeps editing operations close to the actual document format instead of relying on an intermediate representation. Tracked changes follow the standard revision markup inside the .docx file, so compatibility with Microsoft Word remains intact. Real-time collaboration uses operational transforms that sync across clients while preserving the OOXML structure.

Developers who need only the editing engine can depend directly on @eigenpal/docx-editor-core. The React and Vue adapters then add toolbar components, pagination, and plugin hooks on top of that core. This separation lets teams fork an adapter without duplicating parser fixes. The agent package exposes an MCP server and AI SDK adapters, allowing external models to read or modify document state through defined tool calls.

Integration with Common Stacks

Installation starts with the framework adapter. For a React project the command is npm install @eigenpal/docx-editor-react. The Vue adapter follows the same pattern with @eigenpal/docx-editor-vue. A Nuxt module wraps the Vue adapter for projects already using that meta-framework.

Once installed, the editor accepts a document buffer and configuration for collaboration endpoints. The paged view renders at print sizes by default, which reduces layout surprises when exporting back to .docx. Plugin registration happens through the adapter API, so custom nodes or marks can extend the ProseMirror schema without touching the OOXML layer.

Teams already using Next.js can import the React adapter directly inside server components when handling document upload routes. Rails backends can serve the initial .docx file and expose a WebSocket channel for the collaboration layer. Python services can consume the same OOXML output for further processing or validation.

Practical Trade-offs

The library targets applications that must produce valid .docx files rather than generic rich text. This constraint adds implementation weight compared with simpler ProseMirror or Tiptap setups. Real-time features require a separate sync server; the repository provides examples but leaves production scaling decisions to the developer.

Because the project is relatively new, long-term maintenance and community plugin growth remain uncertain. On the other hand, the decision to keep the core thin and OOXML-centric reduces the risk of format drift that affects many document editors. Teams that already maintain custom .docx tooling may find the parser and serializer reusable even if they replace the UI layer.

What is the minimum setup needed to try the editor?
Install the React or Vue adapter via npm and pass an ArrayBuffer containing a .docx file to the component. The core package is only required when forking an adapter.

Does it preserve all OOXML features?
It aims for canonical OOXML round-tripping. Complex elements such as tracked changes and certain content controls are supported, though some niche Word-specific structures may need additional plugin work.

Can the agent SDK connect to existing LLM tooling?
Yes. The package includes adapters for common AI SDKs and an MCP server that exposes document operations as callable tools.

Need a consultation?

I help companies and startups build software, automate workflows, and integrate AI. Let's talk.

Get in touch