@grammarly/editor-sdk

Overview

See the Text Editor SDK guide for installation options.

The Text Editor SDK can be configured according to your app's needs. Specify configuration with HTML attributes on the <grammarly-editor-plugin> web component.

<grammarly-editor-plugin
  config.documentDialect="british"
  config.suggestionCategories.oxfordComma="on"
>
  <textarea></textarea>
</grammarly-editor-plugin>

This allows your app to:

  • specify information about the end user's input to improve Grammarly's suggestions
  • influence Grammarly suggestion types (SuggestionCategories)

Configuration options can also be specified in javascript.

const pluginElement = document.querySelector("grammarly-editor-plugin");
pluginElement.config = {
  documentDialect: "canadian",
  suggestionCategories: {
    passiveVoice: "on",
  },
};

Refer to EditorConfig for full details.

Theming

CSS variables that allow you to theme your app are detailed in Customization.

Reference

NameDescription
init()Initialize Grammarly. The ClientId must be passed another way.
init(clientId, config, win)Initialize Grammarly and start using EditorSDK to connect editors.
ClientIdIdentifier used to authenticate with Grammarly.
ConfigConfiguration to customize the Grammarly integration.
DialectSpecific variety of English being written.
DocumentStatsStatistics about the user-entered text. Try it nowopen in new window
DomainThe style or type of writing to be analyzed.
EditorAn instance of Editor represents an HTML editor from your app enhanced with Grammarly.
EditorConfigConfiguration to customize the Grammarly integration per editor instance.
EditorSDKOverall API for the Editor SDK which can be used to create Editors, which represent HTML editors enhanced with Grammarly.
GrammarlyButtonElement<grammarly-button> is a web component that allows you to place the Grammarly button in a custom position in your app.
GrammarlyEditorPluginCallbacks
GrammarlyEditorPluginElement<grammarly-editor-plugin> is a web component that adds Grammarly suggestions to the HTML element it wraps.
GrammarlyEditorPluginElementEventMapCustom events emitted by GrammarlyEditorPluginElement Try it outopen in new window
MenuPositionPosition of the Grammarly button menu relative to the Grammarly button.
SessionStatsStatistics about the Grammarly session.
SessionSuggestionBreakdownSuggestion total along with counts by type.
SuggestionCategoriesCategories of suggestions that can be muted.
TimeTime in hours, minutes, and seconds.
TonePositionPosition of the tone detectoropen in new window (if present) relative to the Grammarly button.
Last Updated: 11/23/2022, 11:22:52 PM