Tiptap Docs

Configure when to load suggestions

You can customize when the AI Suggestion extension calls the LLM to generate suggestions. This allows you to control when new suggestions are loaded, and how often they are reloaded.

Load Suggestions on Start

By default, the AI Suggestion extension will automatically load suggestions when the editor is ready. You can disable this behavior with the loadOnStart option.

AiSuggestion.configure({
  // Disable automatic loading of suggestions
  loadOnStart: false,
})

Reload Suggestions on Content Update

By default, the AI Suggestion extension will reload suggestions when the editor's content changes. You can disable this behavior with the reloadOnUpdate option.

AiSuggestion.configure({
  // Disable automatic loading of suggestions
  reloadOnUpdate: false,
})

Debounce Timeout

By default, the AI Suggestion extension will wait 800 milliseconds after the user stops typing to reload suggestions. This prevents the API from being called too frequently. You can configure this timeout with the debounceTimeout option.

AiSuggestion.configure({
  debounceTimeout: 1000,
})

However, there are cases where you may want to force suggestions to reload. For example, you may want to reload suggestions when the user clicks a "refresh" button.

To reload suggestions manually, use the loadAiSuggestions command.

editor.commands.loadAiSuggestions()

To load suggestions after a delay, use the loadAiSuggestionsDebounced command. The delay is determined by the debounceTimeout option.

This command is used internally to reload the suggestions after the editor content changes (for example, when the user types on the editor). The function is debounced so that, if called multiple times within the debounce timeout, only the last call will be executed.

editor.commands.loadAiSuggestionsDebounced()

Set Suggestions Programmatically

If you want to set the suggestions to a certain value, without loading them with the configured API, you can use the setAiSuggestions command. This is useful in the following scenarios:

  • When you have a list of suggestions that you want to display immediately.
  • When you want to clear the suggestions.
  • When you want to display suggestions from a different source than the API you configured in the extension's options.
editor.commands.setAiSuggestions(suggestions)

To learn more about the data that a suggestion object should contain, check the API reference.