Skip to main content

@lexical/clipboard

Interfaces

LexicalClipboardData

Defined in: packages/lexical-clipboard/src/clipboard.ts:58

Indexable

[mimeType: string]: string | undefined

Properties

application/x-lexical-editor?

optional application/x-lexical-editor?: string

Defined in: packages/lexical-clipboard/src/clipboard.ts:60

text/html?

optional text/html?: string

Defined in: packages/lexical-clipboard/src/clipboard.ts:59

text/plain

text/plain: string

Defined in: packages/lexical-clipboard/src/clipboard.ts:61

Functions

$generateJSONFromSelectedNodes()

$generateJSONFromSelectedNodes<SerializedNode>(editor, selection): object

Defined in: packages/lexical-clipboard/src/clipboard.ts:621

Gets the Lexical JSON of the nodes inside the provided Selection.

Type Parameters

SerializedNode

SerializedNode extends BaseSerializedNode

Parameters

editor

LexicalEditor

LexicalEditor to get the JSON content from.

selection

BaseSelection | null

Selection to get the JSON content from.

Returns

object

an object with the editor namespace and a list of serializable nodes as JavaScript objects.

namespace

namespace: string

nodes

nodes: SerializedNode[]


$generateNodesFromSerializedNodes()

$generateNodesFromSerializedNodes(serializedNodes): LexicalNode[]

Defined in: packages/lexical-clipboard/src/clipboard.ts:651

This method takes an array of objects conforming to the BaseSerializedNode interface and returns an Array containing instances of the corresponding LexicalNode classes registered on the editor. Normally, you'd get an Array of BaseSerialized nodes from $generateJSONFromSelectedNodes

Parameters

serializedNodes

BaseSerializedNode[]

an Array of objects conforming to the BaseSerializedNode interface.

Returns

LexicalNode[]

an Array of Lexical Node objects.


$getClipboardDataFromSelection()

$getClipboardDataFromSelection(selection?): LexicalClipboardData

Defined in: packages/lexical-clipboard/src/clipboard.ts:795

Serialize the content of the current selection to strings in text/plain, text/html, and application/x-lexical-editor (Lexical JSON) formats (as available).

Parameters

selection?

BaseSelection | null

the selection to serialize (defaults to $getSelection())

Returns

LexicalClipboardData

LexicalClipboardData


$getHtmlContent()

$getHtmlContent(editor, selection?): string

Defined in: packages/lexical-clipboard/src/clipboard.ts:75

Returns the currently selected Lexical content as an HTML string, relying on the logic defined in the exportDOM methods on the LexicalNode classes. Note that this will not return the HTML content of the entire editor (unless all the content is included in the current selection).

Parameters

editor

LexicalEditor

LexicalEditor instance to get HTML content from

selection?

BaseSelection | null

The selection to use (default is $getSelection())

Returns

string

a string of HTML content


$getLexicalContent()

$getLexicalContent(editor, selection?): string | null

Defined in: packages/lexical-clipboard/src/clipboard.ts:104

Returns the currently selected Lexical content as a JSON string, relying on the logic defined in the exportJSON methods on the LexicalNode classes. Note that this will not return the JSON content of the entire editor (unless all the content is included in the current selection).

Parameters

editor

LexicalEditor

LexicalEditor instance to get the JSON content from

selection?

BaseSelection | null

The selection to use (default is $getSelection())

Returns

string | null


$handlePlainTextDrop()

$handlePlainTextDrop(event, editor): boolean

Defined in: packages/lexical-clipboard/src/clipboard.ts:440

Drop handler for plain-text editors. Same semantics as $handleRichTextDrop but inserts via $insertDataTransferForPlainText.

Parameters

event

DragEvent

editor

LexicalEditor

Returns

boolean


$handleRichTextDrop()

$handleRichTextDrop(event, editor): boolean

Defined in: packages/lexical-clipboard/src/clipboard.ts:428

Drop handler for rich-text editors. Inserts the DataTransfer payload via $insertDataTransferForRichText at the drop caret and, when the drag originated from a Lexical editor (marked via $writeDragSourceToDataTransfer on DRAGSTART), removes the source range — producing cut-and-paste semantics whether the drop is in the same editor or a different one on the same page.

Parameters

event

DragEvent

editor

LexicalEditor

Returns

boolean


$insertDataTransferForPlainText()

$insertDataTransferForPlainText(dataTransfer, selection): void

Defined in: packages/lexical-clipboard/src/clipboard.ts:131

Attempts to insert content of the mime-types text/plain or text/uri-list from the provided DataTransfer object into the editor at the provided selection. text/uri-list is only used if text/plain is not also provided.

Parameters

dataTransfer

DataTransfer

an object conforming to the [DataTransfer interface] (https://html.spec.whatwg.org/multipage/dnd.html#the-datatransfer-interface)

selection

BaseSelection

the selection to use as the insertion point for the content in the DataTransfer object

Returns

void


$insertDataTransferForRichText()

$insertDataTransferForRichText(dataTransfer, selection, editor): void

Defined in: packages/lexical-clipboard/src/clipboard.ts:152

Attempts to insert content of the mime-types application/x-lexical-editor, text/html, text/plain, or text/uri-list (in descending order of priority) from the provided DataTransfer object into the editor at the provided selection.

Parameters

dataTransfer

DataTransfer

an object conforming to the [DataTransfer interface] (https://html.spec.whatwg.org/multipage/dnd.html#the-datatransfer-interface)

selection

BaseSelection

the selection to use as the insertion point for the content in the DataTransfer object

editor

LexicalEditor

the LexicalEditor the content is being inserted into.

Returns

void


$insertGeneratedNodes()

$insertGeneratedNodes(editor, nodes, selection): void

Defined in: packages/lexical-clipboard/src/clipboard.ts:469

Inserts Lexical nodes into the editor using different strategies depending on some simple selection-based heuristics. If you're looking for a generic way to to insert nodes into the editor at a specific selection point, you probably want lexical.$insertNodes

Parameters

editor

LexicalEditor

LexicalEditor instance to insert the nodes into.

nodes

LexicalNode[]

The nodes to insert.

selection

BaseSelection

The selection to insert the nodes into.

Returns

void


$writeDragSourceToDataTransfer()

$writeDragSourceToDataTransfer(dataTransfer, editor): void

Defined in: packages/lexical-clipboard/src/clipboard.ts:245

Populate dataTransfer with a marker identifying the current editor as a drag source. Pair this with $handleRichTextDrop or $handlePlainTextDrop on the drop side to get cut-and-paste semantics for drags that end in a different editor.

Only the source editor's key needs to round-trip — the source's RangeSelection itself is preserved on the source editor between drag start and drop (Lexical suppresses selectionchange during drag), so the drop handler reads it directly via $getSelection() on the resolved source editor.

Callers typically invoke this from a DRAGSTART_COMMAND handler alongside setLexicalClipboardDataTransfer (so that the dragged content itself round-trips with full node fidelity).

Parameters

dataTransfer

DataTransfer

editor

LexicalEditor

Returns

void


copyToClipboard()

copyToClipboard(editor, event, data?): Promise<boolean>

Defined in: packages/lexical-clipboard/src/clipboard.ts:680

Copies the content of the current selection to the clipboard in text/plain, text/html, and application/x-lexical-editor (Lexical JSON) formats.

Parameters

editor

LexicalEditor

the LexicalEditor instance to copy content from

event

ClipboardEvent | null

the native browser ClipboardEvent to add the content to.

data?

LexicalClipboardData

Returns

Promise<boolean>


setLexicalClipboardDataTransfer()

setLexicalClipboardDataTransfer(clipboardData, data): void

Defined in: packages/lexical-clipboard/src/clipboard.ts:811

Call setData on the given clipboardData for each MIME type present in the given data (from $getClipboardDataFromSelection)

Parameters

clipboardData

DataTransfer

the event.clipboardData to populate from data

data

LexicalClipboardData

The lexical data

Returns

void