Skip to main content

Class: TextNode

lexical.TextNode

Hierarchy

Constructors

constructor

new TextNode(text, key?): TextNode

Parameters

NameType
textstring
key?string

Returns

TextNode

Overrides

LexicalNode.constructor

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:297

Properties

__text

__text: string

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:279


constructor

constructor: KlassConstructor<typeof TextNode>

Overrides

LexicalNode.constructor

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:278

Methods

canHaveFormat

canHaveFormat(): boolean

Returns

boolean

true if the text node supports font styling, false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:447


canInsertTextAfter

canInsertTextAfter(): boolean

This method is meant to be overriden by TextNode subclasses to control the behavior of those nodes when a user event would cause text to be inserted after them in the editor. If true, Lexical will attempt to insert text into this node. If false, it will insert the text in a new sibling node.

Returns

boolean

true if text can be inserted after the node, false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:890


canInsertTextBefore

canInsertTextBefore(): boolean

This method is meant to be overriden by TextNode subclasses to control the behavior of those nodes when a user event would cause text to be inserted before them in the editor. If true, Lexical will attempt to insert text into this node. If false, it will insert the text in a new sibling node.

Returns

boolean

true if text can be inserted before the node, false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:879


createDOM

createDOM(config, editor?): HTMLElement

Called during the reconciliation process to determine which nodes to insert into the DOM for this Lexical Node.

This method must return exactly one HTMLElement. Nested elements are not supported.

Do not attempt to update the Lexical EditorState during this phase of the update lifecyle.

Parameters

NameTypeDescription
configEditorConfigallows access to things like the EditorTheme (to apply classes) during reconciliation.
editor?LexicalEditorallows access to the editor for context during reconciliation.

Returns

HTMLElement

Overrides

LexicalNode.createDOM

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:453


exportDOM

exportDOM(editor): DOMExportOutput

Controls how the this node is serialized to HTML. This is important for copy and paste between Lexical and non-Lexical editors, or Lexical editors with different namespaces, in which case the primary transfer format is HTML. It's also important if you're serializing to HTML for any other reason via $generateHtmlFromNodes. You could also use this method to build your own HTML renderer.

Parameters

NameType
editorLexicalEditor

Returns

DOMExportOutput

Overrides

LexicalNode.exportDOM

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:604


exportJSON

exportJSON(): SerializedTextNode

Controls how the this node is serialized to JSON. This is important for copy and paste between Lexical editors sharing the same namespace. It's also important if you're serializing to JSON for persistent storage somewhere. See Serialization & Deserialization.

Returns

SerializedTextNode

Overrides

LexicalNode.exportJSON

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:632


getDetail

getDetail(): number

Returns a 32-bit integer that represents the TextDetailTypes currently applied to the TextNode. You probably don't want to use this method directly - consider using TextNode.isDirectionless or TextNode.isUnmergeable instead.

Returns

number

a number representing the detail of the text node.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:324


getFormat

getFormat(): number

Returns a 32-bit integer that represents the TextFormatTypes currently applied to the TextNode. You probably don't want to use this method directly - consider using TextNode.hasFormat instead.

Returns

number

a number representing the format of the text node.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:312


getFormatFlags

getFormatFlags(type, alignWithFormat): number

Returns the format flags applied to the node as a 32-bit integer.

Parameters

NameType
typeTextFormatType
alignWithFormatnull | number

Returns

number

a number representing the TextFormatTypes applied to the node.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:437


getMode

getMode(): TextModeType

Returns the mode (TextModeType) of the TextNode, which may be "normal", "token", or "segmented"

Returns

TextModeType

TextModeType.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:334


getStyle

getStyle(): string

Returns the styles currently applied to the node. This is analogous to CSSText in the DOM.

Returns

string

CSSText-like string of styles applied to the underlying DOM node.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:344


getTextContent

getTextContent(): string

Returns the text content of the node as a string.

Returns

string

a string representing the text content of the node.

Overrides

LexicalNode.getTextContent

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:427


hasFormat

hasFormat(type): boolean

Returns whether or not the node has the provided format applied. Use this with the human-readable TextFormatType string values to get the format of a TextNode.

Parameters

NameTypeDescription
typeTextFormatTypethe TextFormatType to check for.

Returns

boolean

true if the node has the provided format, false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:407


isComposing

isComposing(): boolean

Returns

boolean

true if Lexical detects that an IME or other 3rd-party script is attempting to mutate the TextNode, false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:365


isDirectionless

isDirectionless(): boolean

Returns whether or not the node is "directionless". Directionless nodes don't respect changes between RTL and LTR modes.

Returns

boolean

true if the node is directionless, false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:384


isSegmented

isSegmented(): boolean

Returns whether or not the node is in "segemented" mode. TextNodes in segemented mode can be navigated through character-by-character with a RangeSelection, but are deleted in space-delimited "segments".

Returns

boolean

true if the node is in segmented mode, false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:375


isSimpleText

isSimpleText(): boolean

Returns whether or not the node is simple text. Simple text is defined as a TextNode that has the string type "text" (i.e., not a subclass) and has no mode applied to it (i.e., not segmented or token).

Returns

boolean

true if the node is simple text, false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:418


isTextEntity

isTextEntity(): boolean

This method is meant to be overriden by TextNode subclasses to control the behavior of those nodes when used with the registerLexicalTextEntity function. If you're using registerLexicalTextEntity, the node class that you create and replace matched text with should return true from this method.

Returns

boolean

true if the node is to be treated as a "text entity", false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:1085


isToken

isToken(): boolean

Returns whether or not the node is in "token" mode. TextNodes in token mode can be navigated through character-by-character with a RangeSelection, but are deleted as a single entity (not invdividually by character).

Returns

boolean

true if the node is in token mode, false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:355


isUnmergeable

isUnmergeable(): boolean

Returns whether or not the node is unmergeable. In some scenarios, Lexical tries to merge adjacent TextNodes into a single TextNode. If a TextNode is unmergeable, this won't happen.

Returns

boolean

true if the node is unmergeable, false otherwise.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:394


mergeWithSibling

mergeWithSibling(target): TextNode

Merges the target TextNode into this TextNode, removing the target node.

Parameters

NameTypeDescription
targetTextNodethe TextNode to merge into this one.

Returns

TextNode

this TextNode.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:1028


select

select(_anchorOffset?, _focusOffset?): RangeSelection

Sets the current Lexical selection to be a RangeSelection with anchor and focus on this TextNode at the provided offsets.

Parameters

NameTypeDescription
_anchorOffset?numberthe offset at which the Selection anchor will be placed.
_focusOffset?numberthe offset at which the Selection focus will be placed.

Returns

RangeSelection

the new RangeSelection.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:777


selectEnd

selectEnd(): RangeSelection

Returns

RangeSelection

Overrides

LexicalNode.selectEnd

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:822


selectStart

selectStart(): RangeSelection

Returns

RangeSelection

Overrides

LexicalNode.selectStart

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:818


selectionTransform

selectionTransform(prevSelection, nextSelection): void

Parameters

NameType
prevSelectionnull | BaseSelection
nextSelectionRangeSelection

Returns

void

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:645


setDetail

setDetail(detail): this

Sets the node detail to the provided TextDetailType or 32-bit integer. Note that the TextDetailType version of the argument can only specify one detail value and doing so will remove all other detail values that may be applied to the node. For toggling behavior, consider using TextNode.toggleDirectionless or TextNode.toggleUnmergeable

Parameters

NameTypeDescription
detailnumber | TextDetailTypeTextDetailType or 32-bit integer representing the node detail.

Returns

this

this TextNode. // TODO 0.12 This should just be a string.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:680


setFormat

setFormat(format): this

Sets the node format to the provided TextFormatType or 32-bit integer. Note that the TextFormatType version of the argument can only specify one format and doing so will remove all other formats that may be applied to the node. For toggling behavior, consider using TextNode.toggleFormat

Parameters

NameTypeDescription
formatnumber | TextFormatTypeTextFormatType or 32-bit integer representing the node format.

Returns

this

this TextNode. // TODO 0.12 This should just be a string.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:662


setMode

setMode(type): this

Sets the mode of the node.

Parameters

NameType
typeTextModeType

Returns

this

this TextNode.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:743


setStyle

setStyle(style): this

Sets the node style to the provided CSSText-like string. Set this property as you would an HTMLElement style attribute to apply inline styles to the underlying DOM Element.

Parameters

NameTypeDescription
stylestringCSSText to be applied to the underlying HTMLElement.

Returns

this

this TextNode.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:695


setTextContent

setTextContent(text): this

Sets the text content of the node.

Parameters

NameTypeDescription
textstringthe string to set as the text value of the node.

Returns

this

this TextNode.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:760


spliceText

spliceText(offset, delCount, newText, moveSelection?): TextNode

Inserts the provided text into this TextNode at the provided offset, deleting the number of characters specified. Can optionally calculate a new selection after the operation is complete.

Parameters

NameTypeDescription
offsetnumberthe offset at which the splice operation should begin.
delCountnumberthe number of characters to delete, starting from the offset.
newTextstringthe text to insert into the TextNode at the offset.
moveSelection?booleanoptional, whether or not to move selection to the end of the inserted substring.

Returns

TextNode

this TextNode.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:838


splitText

splitText(...splitOffsets): TextNode[]

Splits this TextNode at the provided character offsets, forming new TextNodes from the substrings formed by the split, and inserting those new TextNodes into the editor, replacing the one that was split.

Parameters

NameTypeDescription
...splitOffsetsnumber[]rest param of the text content character offsets at which this node should be split.

Returns

TextNode[]

an Array containing the newly-created TextNodes.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:902


toggleDirectionless

toggleDirectionless(): this

Toggles the directionless detail value of the node. Prefer using this method over setDetail.

Returns

this

this TextNode.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:721


toggleFormat

toggleFormat(type): this

Applies the provided format to this TextNode if it's not present. Removes it if it's present. The subscript and superscript formats are mutually exclusive. Prefer using this method to turn specific formats on and off.

Parameters

NameTypeDescription
typeTextFormatTypeTextFormatType to toggle.

Returns

this

this TextNode.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:710


toggleUnmergeable

toggleUnmergeable(): this

Toggles the unmergeable detail value of the node. Prefer using this method over setDetail.

Returns

this

this TextNode.

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:732


updateDOM

updateDOM(prevNode, dom, config): boolean

Called when a node changes and should update the DOM in whatever way is necessary to make it align with any changes that might have happened during the update.

Returning "true" here will cause lexical to unmount and recreate the DOM node (by calling createDOM). You would need to do this if the element tag changes, for instance.

Parameters

NameType
prevNodeTextNode
domHTMLElement
configEditorConfig

Returns

boolean

Overrides

LexicalNode.updateDOM

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:476


clone

clone(node): TextNode

Clones this node, creating a new node with a different key and adding it to the EditorState (but not attaching it anywhere!). All nodes must implement this method.

Parameters

NameType
nodeTextNode

Returns

TextNode

Overrides

LexicalNode.clone

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:293


getType

getType(): string

Returns the string type of this node. Every node must implement this and it MUST BE UNIQUE amongst nodes registered on the editor.

Returns

string

Overrides

LexicalNode.getType

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:289


importDOM

importDOM(): null | DOMConversionMap

Returns

null | DOMConversionMap

Overrides

LexicalNode.importDOM

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:543


importJSON

importJSON(serializedNode): TextNode

Controls how the this node is deserialized from JSON. This is usually boilerplate, but provides an abstraction between the node implementation and serialized interface that can be important if you ever make breaking changes to a node schema (by adding or removing properties). See Serialization & Deserialization.

Parameters

NameType
serializedNodeSerializedTextNode

Returns

TextNode

Overrides

LexicalNode.importJSON

Defined in

packages/lexical/src/nodes/LexicalTextNode.ts:592