Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.superdoc.dev/llms.txt

Use this file to discover all available pages before exploring further.

@superdoc-dev/react is a first-party React wrapper for SuperDoc. It handles lifecycle management, SSR safety, and React Strict Mode compatibility so you can drop a DOCX editor into any React app. Building your own toolbar, comments sidebar, or review panel? Pair <SuperDocEditor> with superdoc/ui/react. See Custom UI.

Installation

npm install @superdoc-dev/react
superdoc is included as a dependency: no need to install it separately.

Quick start

import { SuperDocEditor } from '@superdoc-dev/react';
import '@superdoc-dev/react/style.css';

function App() {
  return (
    <SuperDocEditor
      document={file}
      documentMode="editing"
      onReady={() => console.log('Editor ready!')}
    />
  );
}

What the component handles

  • Mounting: Creates a SuperDoc instance when the component mounts
  • Updates: Rebuilds automatically when the document prop changes
  • Cleanup: Destroys the instance on unmount
  • SSR: Renders container structure on server, initializes SuperDoc after hydration
  • Strict Mode: Internal cleanup flag prevents issues from React 18 double-invocation

Requirements

RequirementVersion
React16.8.0+
Node.js16+

API structure

  • Configuration: All props reference
  • Methods: Ref API, instance methods, and patterns
  • Types: TypeScript types, framework integration, troubleshooting