> ## 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.

# Comments extension

The Comments extension adds Word-style commenting with threads, replies, and resolution.

## Usage

Configure comments through the modules option:

```javascript theme={null}
modules: {
  comments: {
    readOnly: false,
    allowResolve: true
  }
}
```

## Commands

### `addComment`

Add a comment to the current text selection. Requires text to be selected.

```javascript Usage theme={null}
// Simple text comment
editor.commands.addComment('Please review this section')

// With options
editor.commands.addComment({
  content: 'Please review',
  author: 'Jane Smith',
  authorEmail: 'jane@example.com',
  isInternal: false
})
```

```javascript Full Example theme={null}
import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    // Simple text comment
    editor.commands.addComment('Please review this section')

    // With options
    editor.commands.addComment({
      content: 'Please review',
      author: 'Jane Smith',
      authorEmail: 'jane@example.com',
      isInternal: false
    })
  },
});
```

**Parameters:**

**contentOrOptions** `string | Object` *required*

Comment text, or an options object with `content`, `author`, `authorEmail`, `authorImage`, and `isInternal` fields

### `addCommentReply`

Add a reply to an existing comment thread.

```javascript Usage theme={null}
editor.commands.addCommentReply({
  parentId: 'comment-123',
  content: 'Done, updated the wording.'
})
```

```javascript Full Example theme={null}
import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    editor.commands.addCommentReply({
      parentId: 'comment-123',
      content: 'Done, updated the wording.'
    })
  },
});
```

**Parameters:**

**options** `Object` *required*

Object with `parentId` (required), `content`, `author`, `authorEmail`, `authorImage`

### `removeComment`

Remove a comment and its highlight marks from the document.

```javascript Usage theme={null}
editor.commands.removeComment({ commentId: 'abc-123' })
```

```javascript Full Example theme={null}
import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    editor.commands.removeComment({ commentId: 'abc-123' })
  },
});
```

**Parameters:**

**options** `Object` *required*

Object with `commentId` and/or `importedId`

### `resolveComment`

Resolve a comment. Removes the highlight but preserves positional anchors for export.

```javascript Usage theme={null}
editor.commands.resolveComment({ commentId: 'abc-123' })
```

```javascript Full Example theme={null}
import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    editor.commands.resolveComment({ commentId: 'abc-123' })
  },
});
```

**Parameters:**

**options** `Object` *required*

Object with `commentId`

### `setActiveComment`

Set the active/selected comment thread by ID.

```javascript Usage theme={null}
editor.commands.setActiveComment({ commentId: 'abc-123' })
```

```javascript Full Example theme={null}
import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    editor.commands.setActiveComment({ commentId: 'abc-123' })
  },
});
```

### `setCommentInternal`

Toggle whether a comment is internal (private) or external.

```javascript Usage theme={null}
editor.commands.setCommentInternal({
  commentId: 'abc-123',
  isInternal: true
})
```

```javascript Full Example theme={null}
import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    editor.commands.setCommentInternal({
      commentId: 'abc-123',
      isInternal: true
    })
  },
});
```

### `setCursorById`

Move the cursor to the start of a comment's range. Also works for tracked change IDs.

```javascript Usage theme={null}
editor.commands.setCursorById('abc-123')
```

```javascript Full Example theme={null}
import { SuperDoc } from 'superdoc';
import 'superdoc/style.css';

const superdoc = new SuperDoc({
  selector: '#editor',
  document: yourFile,
  onReady: (superdoc) => {
    const editor = superdoc.activeEditor;
    editor.commands.setCursorById('abc-123')
  },
});
```

## Events

```javascript theme={null}
superdoc.on('comments-update', ({ type, comment, pendingSelection }) => {
  // type: 'pending' | 'add' | 'update' | 'deleted' | 'new' | 'resolved' | 'selected' | ...
  // pendingSelection: SelectionInfo | null on 'pending'
});
```

## Export behavior

Comments export to DOCX as native Word comments:

```javascript theme={null}
await superdoc.export({ commentsType: 'external' });

// Without comments
await superdoc.export({ commentsType: 'clean' });
```

## Source code

[View on GitHub →](https://github.com/superdoc/docx-editor/tree/main/packages/super-editor/src/editors/v1/extensions/comment/comments-plugin.js)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.