‹ Back to reference

GrammarlyEditorPluginElement

A web component to encapsulate DOM elements rendered for displaying highlights and suggestion cards.

Emits custom events: GrammarlyEditorPluginElementEventMap

declare class GrammarlyEditorPluginElement extends HTMLElement {
  addEventListener<K extends keyof GrammarlyEditorPluginElementEventMap>(type: K, listener: (this: HTMLElement, ev: GrammarlyEditorPluginElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
  get clientId(): ClientId | undefined;
  get config(): EditorConfig;
  connect(editor: EditorElement, viewport?: HTMLElement): void;
  removeEventListener<K extends keyof GrammarlyEditorPluginElementEventMap>(type: K, listener: (this: HTMLElement, ev: GrammarlyEditorPluginElementEventMap[K]) => any, options?: boolean | EventListenerOptions | undefined): void;
}

Properties

clientId — ClientId | undefined

config — EditorConfig
Current editor configuration

Methods

addEventListener()

addEventListener<K extends keyof GrammarlyEditorPluginElementEventMap>(type: K, listener: (this: HTMLElement, ev: GrammarlyEditorPluginElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions | undefined): void;

Parameters

Name	Type	Description
type	K
listener	(this: HTMLElement, ev: GrammarlyEditorPluginElementEventMap[K]) => any
options	boolean | AddEventListenerOptions | undefined

connect()

When inserted into the DOM, the GrammarlyEditorPlugin will automatically detect and connect to an editable child element (editor) and its scrollable container (viewport). This function provides a way to specify the editor and viewport, overriding what was automatically detected.

connect(editor: EditorElement, viewport?: HTMLElement): void;

Parameters

Name	Type	Description
editor	EditorElement	the editable element
viewport	HTMLElement	scrollable outer element of the editable element

removeEventListener()

removeEventListener<K extends keyof GrammarlyEditorPluginElementEventMap>(type: K, listener: (this: HTMLElement, ev: GrammarlyEditorPluginElementEventMap[K]) => any, options?: boolean | EventListenerOptions | undefined): void;

Parameters

Name	Type	Description
type	K
listener	(this: HTMLElement, ev: GrammarlyEditorPluginElementEventMap[K]) => any
options	boolean | EventListenerOptions | undefined