New

docx-editor 1.x has shipped. Vue support, i18n, agents. Read the migration guide →

Packages

@eigenpal/docx-editor-vue

Vue 3 adapter. Same <DocxEditor>, hooks become composables. Beta in 1.0.

npmv1.0.2downloads280/molicenseApache-2.0sourcegithub

Status

@eigenpal/docx-editor-vue is new in the 1.0 release and currently in beta. The package targets Vue 3. Its surface mirrors the React adapter one-to-one: same component name, same subpath layout, same plugin contract. If you've shipped against @eigenpal/docx-editor-react, the Vue package is a port, not a learning curve.

Install

npm install @eigenpal/docx-editor-vue

Pulls in @eigenpal/docx-editor-core and @eigenpal/docx-editor-i18n.

Quickstart

<script setup lang="ts">
import { ref } from "vue";
import { DocxEditor } from "@eigenpal/docx-editor-vue";
import "@eigenpal/docx-editor-vue/styles.css";
 
const buf = ref<ArrayBuffer | null>(null);
</script>
 
<template>
  <DocxEditor :document-buffer="buf" />
</template>

Using with Nuxt

For Nuxt 3 and 4, install @eigenpal/nuxt-docx-editor, the official Nuxt module. It wraps this adapter and auto-imports an SSR-safe <DocxEditor>, so there's no <ClientOnly> wrapper to write:

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ["@eigenpal/nuxt-docx-editor"],
});

See Nuxt for the module options and what to import from the adapter directly.

Subpaths

  • @eigenpal/docx-editor-vue: <DocxEditor>, EditorMode, DocxEditorProps, i18nPlugin, provideLocale
  • @eigenpal/docx-editor-vue/composables: Vue equivalents of the React hooks (useDocxEditor, useHistory, useAutoSave, useTrackedChanges, etc.)
  • @eigenpal/docx-editor-vue/dialogs: hyperlink, find/replace, paste special, page setup
  • @eigenpal/docx-editor-vue/plugin-api: plugin host
  • @eigenpal/docx-editor-vue/styles: CSS

Vue 1.0 does not yet ship the UI primitives that React's /ui does (Toolbar, EditorToolbar, pickers). Compose your own with the dialogs, composables, and your design system, or use the editor's built-in toolbar (rendered when no slot is provided). Vue UI primitives are tracked for 1.1.

Every export is in the Vue API reference.

Parity with React

Upstream's etc/parity.contract.json lists every public symbol shipped under either adapter, with explicit buckets for paired, deferred, and exclusive. A CI step walks both packages' .d.ts and fails when the contract drifts. So anything in /docs/1.x/api/react has a matching entry in /docs/1.x/api/vue with the same name and behavior. File an issue if you find a gap.

Agent integration

Same toolkit, Vue subpath:

import { useDocxAgentTools } from "@eigenpal/docx-editor-agents/vue";

Composable instead of a hook. Same 14 tools, same transport. Server side is identical (@eigenpal/docx-editor-agents/ai-sdk/server).

Where to next