https://github.com/eigenpal/docx-editor
Open-source WYSIWYG .docx editor library with canonical OOXML, tracked changes, and real-time collaboration.
https://github.com/eigenpal/docx-editor
docx docx-editor editor js msword next prosemirror react vite vue word word-editor wysiwyg
Last synced: about 15 hours ago
JSON representation
Open-source WYSIWYG .docx editor library with canonical OOXML, tracked changes, and real-time collaboration.
- Host: GitHub
- URL: https://github.com/eigenpal/docx-editor
- Owner: eigenpal
- License: apache-2.0
- Created: 2026-02-02T00:43:53.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2026-06-04T23:13:16.000Z (4 days ago)
- Last Synced: 2026-06-04T23:15:59.953Z (4 days ago)
- Topics: docx, docx-editor, editor, js, msword, next, prosemirror, react, vite, vue, word, word-editor, wysiwyg
- Language: TypeScript
- Homepage: https://docx-editor.dev
- Size: 56.6 MB
- Stars: 1,557
- Watchers: 14
- Forks: 157
- Open Issues: 47
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Agents: docs/agents.md
- Cla: CLA.md
Awesome Lists containing this project
README
Open-source WYSIWYG `.docx` editor for React and Vue with canonical OOXML, tracked changes, and real-time collaboration. Agent-ready. **[Live demo](https://docx-editor.dev/editor)** | **[Documentation](https://www.docx-editor.dev/docs)**
## Quick Start
```bash
npm install @eigenpal/docx-editor-react
```
See the [React quick start](#react) below.
```bash
npm install @eigenpal/docx-editor-vue
```
See the [Vue quick start](#vue) below.
```bash
npm install @eigenpal/nuxt-docx-editor
```
See the [Nuxt quick start](#nuxt) below.
## Packages
| Package | Description | Docs |
| -------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------- |
| [`@eigenpal/docx-editor-react`](https://www.npmjs.com/package/@eigenpal/docx-editor-react) |
React adapter. Toolbar, paged editor, plugins. | [Docs](https://www.docx-editor.dev/docs/1.x/react) |
| [`@eigenpal/docx-editor-vue`](https://www.npmjs.com/package/@eigenpal/docx-editor-vue) |
Vue 3 adapter. Toolbar, paged editor, plugins. | [Docs](https://www.docx-editor.dev/docs/1.x/vue) |
| [`@eigenpal/nuxt-docx-editor`](https://www.npmjs.com/package/@eigenpal/nuxt-docx-editor) |
Nuxt 3 & 4 module wrapping the Vue adapter. | [Docs](https://www.docx-editor.dev/docs/1.x/vue/nuxt) |
| [`@eigenpal/docx-editor-core`](https://www.npmjs.com/package/@eigenpal/docx-editor-core) | Framework-agnostic core: OOXML parser, serializer, layout engine, ProseMirror schema. Depend on this if you fork the React or Vue adapter. | [Docs](https://www.docx-editor.dev/docs/1.x/core) |
| [`@eigenpal/docx-editor-i18n`](https://www.npmjs.com/package/@eigenpal/docx-editor-i18n) | Shared locale strings and types consumed by both adapters. | [Docs](https://www.docx-editor.dev/docs/1.x/i18n) |
| [`@eigenpal/docx-editor-agents`](https://www.npmjs.com/package/@eigenpal/docx-editor-agents) | Agent SDK and chat UI: framework-agnostic bridge, MCP server, AI SDK adapters, plus UI components. | [Docs](https://www.docx-editor.dev/docs/1.x/agents) |
> **Forking the adapter?** Keep your fork thin. Depend on `@eigenpal/docx-editor-core` directly so parser, serializer, and rendering fixes land in your build automatically, without backporting each upstream change by hand.
## React
```tsx
import { useState } from 'react';
import { DocxEditor } from '@eigenpal/docx-editor-react';
import '@eigenpal/docx-editor-react/styles.css';
export function App() {
const [buffer, setBuffer] = useState(null);
return (
<>
setBuffer((await e.target.files?.[0]?.arrayBuffer()) ?? null)}
/>
{buffer && }
>
);
}
```
> **Next.js / SSR:** Use dynamic import. The editor requires the DOM.
Full docs: [`packages/react`](packages/react) · [API reference](https://www.docx-editor.dev/docs/props).
## Vue
```vue
import { ref } from 'vue';
import { DocxEditor } from '@eigenpal/docx-editor-vue';
import '@eigenpal/docx-editor-vue/styles.css';
const buffer = ref<ArrayBuffer | null>(null);
async function loadFile(e: Event) {
const file = (e.target as HTMLInputElement).files?.[0];
buffer.value = file ? await file.arrayBuffer() : null;
}
```
Full docs: [`packages/vue`](packages/vue) · [API reference](https://www.docx-editor.dev/docs/props).
## Nuxt
```ts
// nuxt.config.ts
export default defineNuxtConfig({
modules: ['@eigenpal/nuxt-docx-editor'],
});
```
`@eigenpal/nuxt-docx-editor` wraps the Vue adapter as a Nuxt 3 & 4 module: it auto-imports an SSR-safe `` component (no manual import, no `` wrapper) and the Vue composables.
Full docs: [`packages/nuxt`](packages/nuxt).
## Plugins
```tsx
import { DocxEditor } from '@eigenpal/docx-editor-react';
import { PluginHost, templatePlugin } from '@eigenpal/docx-editor-react/plugin-api';
;
```
See the [plugin documentation](https://www.docx-editor.dev/docs/plugins) for the full plugin API.
## Development
```bash
bun install
bun run dev # localhost:5173
bun run build
bun run typecheck
```
A live preview of `main` is auto-deployed at **[latest.docx-editor.dev](https://latest.docx-editor.dev/)** — useful for trying out changes before they ship to npm.
Examples: [Vite](examples/vite) | [Next.js](examples/nextjs) | [Remix](examples/remix) | [Astro](examples/astro) | [Vue](examples/vue) | [Nuxt](examples/nuxt)
**[Documentation](https://www.docx-editor.dev/docs)** | **[Props & Ref Methods](https://www.docx-editor.dev/docs/props)** | **[Plugins](https://www.docx-editor.dev/docs/plugins)** | **[Architecture](https://www.docx-editor.dev/docs/architecture)**
## Contributing
Contributions welcome. See [CONTRIBUTING.md](CONTRIBUTING.md) for setup, tests, and the one-time CLA signature.
## Translations
| Locale | Language |
| ------- | -------------------- |
| `en` | English |
| `de` | German |
| `fr` | French |
| `he` | Hebrew |
| `hi` | Hindi |
| `pl` | Polish |
| `pt-BR` | Portuguese (Brazil) |
| `tr` | Turkish |
| `zh-CN` | Chinese (Simplified) |
Help translate the editor into your language! See the full **[i18n contribution guide](docs/i18n.md)**.
```bash
bun run i18n:new de # scaffold German locale
bun run i18n:status # check translation coverage
```
## Commercial Support
> [!TIP]
> Questions or custom features? Email **[docx-editor@eigenpal.com](mailto:docx-editor@eigenpal.com)**.