---
title: "Apply suggestions to the editor's content"
description: "Learn how to apply, reject, and highlight AI Suggestions in your Tiptap editor. More in the docs!"
canonical_url: "https://tiptap.dev/docs/content-ai/capabilities/suggestion/features/apply-suggestions"
---

# Apply suggestions to the editor's content

Learn how to apply, reject, and highlight AI Suggestions in your Tiptap editor. More in the docs!

The AI Suggestion extension provides commands to apply suggestions to the editor's content. These commands allow you to accept or reject suggestions, and apply them to the editor's content.

## Apply a Single Suggestion

To apply a suggestion to the editor's content, use the `applyAiSuggestion` command.

A suggestion can have multiple replacement options. To apply a specific replacement option, provide the `replacementOptionId` property. If you do not provide this property, the first replacement option will be applied.

Note: if you use the Tiptap Content AI Cloud API to generate suggestions, there will be only one replacement option per suggestion. However, if you use your own backend and LLMs, you can provide multiple replacement options.

You can customize the format of the replacement text by providing the `format` property. The default format is "plain-text". If you want the replacement text to be formatted as rich text, use the "rich-text" format. This is useful when the suggestion modifies the styles, such as bold or italic formatting.

```ts
editor.commands.applyAiSuggestion({
  suggestionId: '1',
  replacementOptionId: '1',
  format: 'plain-text',
})
```

## Apply All Suggestions

To apply all suggestions at once, use the `applyAllAiSuggestions` command.

```ts
editor.commands.applyAllAiSuggestions()
```

This will apply the first replacement option of each suggestion to the editor's content.

If some suggestions overlap with each other, the AI Suggestion extension will automatically resolve the conflicts by ignoring the overlapping suggestions that are applied later. This is usually not a problem, as the suggestions are reloaded after each change, and the AI Suggestion extension will generate new suggestions based on the updated content.

## Reject a Suggestion

You can reject a suggestion by using the `rejectAiSuggestion` command.

```ts
editor.commands.rejectAiSuggestion('suggestionId')
```

When you reject a suggestion, it will not be displayed in the editor anymore. However, it will still be stored in the extension's storage object so you can retrieve it by calling `storage.getSuggestions()`. You can check if a suggestion is rejected by reading the `isRejected` property.

You can access the list of rejected suggestions by calling `storage.getRejections()`.

## Highlight Replaced Text After Applying a Suggestion

To highlight or add any mark to the text that was replaced by a suggestion, you can chain the `applyAiSuggestion` command with a command that sets the mark to the suggestion's range.

```ts
editor
  .chain()
  // Apply suggestion
  .applyAiSuggestion({
    suggestionId: suggestion.id,
    replacementOptionId: option.id,
  })
  // Select the changed text
  .command(({ tr, commands }) => {
    // We need to map the positions of the change text, because they might have changed when applying the suggestion
    return commands.setTextSelection({
      from: tr.mapping.map(suggestion.deleteRange.from),
      to: tr.mapping.map(suggestion.deleteRange.to),
    })
  })
  // Apply styles to changed text. For example, bold styles
  .setBold()
  // Set the cursor at the end of the changed text.
  .command(({ tr, commands }) => {
    return commands.setTextSelection(tr.mapping.map(suggestion.deleteRange.to))
  })
  .focus()
  .run()
```

## Using with Collaboration

When using AI Suggestion with Tiptap Collaboration, suggestions are private to each user. This allows showing different suggestions based on user preferences or context. Once accepted, suggestions become visible to all connected users ([learn more](https://tiptap.dev/docs/content-ai/resources/collaboration.md)).