Skip to main content
The root container for all document content. Every editor starts with a Document node that contains all blocks like paragraphs, headings, and lists.

​
Structure

<doc>
  <p>First paragraph</p>
  <p>Second paragraph</p>
  <!-- All block content -->
</doc>

​
Why it’s essential

  • Required root - Every editor needs exactly one document node
  • Content validation - Ensures at least one block element exists
  • Document operations - Enables document-level commands and queries

​
Commands

​
getDocumentStats

Get document statistics
Returns word count, character count, and paragraph count
Example: 
// Get word and character count
const stats = editor.commands.getDocumentStats()
console.log(`${stats.words} words, ${stats.characters} characters`)

import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    // Get word and character count
    const stats = editor.commands.getDocumentStats()
    console.log(`${stats.words} words, ${stats.characters} characters`)
  },
});

​
clearDocument

Clear entire document
Replaces all content with an empty paragraph
Example: 
editor.commands.clearDocument()

import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    editor.commands.clearDocument()
  },
});

​
setSectionPageMarginsAtSelection

Set page margins for the section at the current cursor position. Example: 
editor.commands.setSectionPageMarginsAtSelection({
  topInches: 1,
  rightInches: 1,
  bottomInches: 1,
  leftInches: 1
})

import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    editor.commands.setSectionPageMarginsAtSelection({
      topInches: 1,
      rightInches: 1,
      bottomInches: 1,
      leftInches: 1
    })
  },
});
Parameters:
​
options
Object
Object with optional topInches, rightInches, bottomInches, leftInches (numbers in inches)

​
Source code