Interactive Examples
Interactive demos for DocxEditor. Toggle props and see how each feature works.
Playground
Try the full interactive playground to toggle props and see changes immediately:
Read-Only Mode
Compare the full editor with a read-only preview. The readOnly prop strips the toolbar and all editing UI:
Mode Toggle
Switch between editing, suggesting, and viewing modes to see how the editor behaves in each:
Toolbar Customization
Customize the title bar with a logo, document name, and right-side actions:
Author Attribution
Set the author prop to attribute comments and track changes to specific users:
Agent Chat in the Editor
Added in 0.2.0. Wire <DocxEditor> to the agent UI kit (<AgentPanel>, <AgentChatLog>, <AgentComposer>) and a chat backend in one component. The agent reads paragraphs, adds comments, suggests tracked changes, and scrolls while the user watches.
The full client + server snippet is on the Live editor page. For OpenAI, Anthropic, and Vercel AI SDK adapters see Bring your own agent. Runnable Next.js example: agent-chat-demo on GitHub.
For the server-side flavor (no editor, batch review) see Headless and MCP server.