prosekit/core
Enumerations
Section titled “Enumerations”Priority
Section titled “Priority”ProseKit extension priority.
Enumeration Members
Section titled “Enumeration Members”Enumeration Member | Value |
---|---|
| |
| |
| |
| |
|
Classes
Section titled “Classes”Editor<E>
Section titled “Editor<E>”Extended by
Section titled “Extended by”Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
|
Accessors
Section titled “Accessors”commands
Section titled “commands”Get Signature
Section titled “Get Signature”get commands():
ExtractCommandActions
<E
>
All CommandActions defined by the editor.
Returns
Section titled “Returns”focused
Section titled “focused”Get Signature
Section titled “Get Signature”get focused():
boolean
Whether the editor is focused.
Returns
Section titled “Returns”boolean
Get Signature
Section titled “Get Signature”get marks():
ExtractMarkActions
<E
>
All MarkActions defined by the editor.
Returns
Section titled “Returns”mounted
Section titled “mounted”Get Signature
Section titled “Get Signature”get mounted():
boolean
Whether the editor is mounted.
Returns
Section titled “Returns”boolean
Get Signature
Section titled “Get Signature”get nodes():
ExtractNodeActions
<E
>
All NodeActions defined by the editor.
Returns
Section titled “Returns”schema
Section titled “schema”Get Signature
Section titled “Get Signature”get schema():
Schema
<ExtractNodeNames
<E
>, ExtractMarkNames
<E
>>
The editor schema.
Returns
Section titled “Returns”Schema
<ExtractNodeNames
<E
>, ExtractMarkNames
<E
>>
Get Signature
Section titled “Get Signature”get state():
EditorState
The editor’s current state.
Returns
Section titled “Returns”Get Signature
Section titled “Get Signature”get view():
EditorView
The editor view.
Returns
Section titled “Returns”Methods
Section titled “Methods”blur()
Section titled “blur()”-
blur():
void
-
Blur the editor.
canExec()
Section titled “canExec()”-
Check if the given command can be executed. Return
true
if the command can be executed, otherwisefalse
.
exec()
Section titled “exec()”-
Execute the given command. Return
true
if the command was successfully executed, otherwisefalse
.
focus()
Section titled “focus()”-
focus():
void
-
Focus the editor.
getDocHTML()
Section titled “getDocHTML()”-
getDocHTML(
options?
:getDocHTMLOptions
):string
-
Return a HTML string representing the editor’s current document.
getDocJSON()
Section titled “getDocJSON()”-
Return a JSON object representing the editor’s current document.
mount()
Section titled “mount()”-
mount(
place
:undefined
|null
|HTMLElement
):void
-
Mount the editor to the given HTML element. Pass
null
orundefined
to unmount the editor.
setContent()
Section titled “setContent()”-
setContent(
content
:string
|ProseMirrorNode
|NodeJSON
|HTMLElement
,selection?
:Selection
|"start"
|SelectionJSON
|"end"
):void
-
Update the editor’s document and selection.
unmount()
Section titled “unmount()”-
unmount():
void
-
Unmount the editor. This is equivalent to
mount(null)
.
updateState()
Section titled “updateState()”-
updateState(
state
:EditorState
):void
-
Update the editor’s state.
Remarks
Section titled “Remarks”This is an advanced method. Use it only if you have a specific reason to directly manipulate the editor’s state.
-
Register an extension to the editor. Return a function to unregister the extension.
Interfaces
Section titled “Interfaces”AddMarkOptions
Section titled “AddMarkOptions”Properties
Section titled “Properties”-
from?:
number
-
The start position of the document. By default it will be the start position of current selection.
-
to?:
number
-
The end position of the document. By default it will be the end position of current selection.
CommandAction()<Args>
Section titled “CommandAction()<Args>”A function to apply a command to the editor. It will return true
if the command was applied, and false
otherwise.
It also has a canExec
method to check if the command can be applied.
Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
|
-
CommandAction(…
args
:Args
):boolean
-
Execute the current command. Return
true
if the command was successfully executed, otherwisefalse
.
Methods
Section titled “Methods”canApply()
Section titled “canApply()”-
canApply(…
args
:Args
):boolean
-
An alias for
canExec
.Deprecated
Section titled “Deprecated”Use
canExec
instead.
canExec()
Section titled “canExec()”-
canExec(…
args
:Args
):boolean
-
Check if the current command can be executed. Return
true
if the command can be executed, otherwisefalse
.
DefaultStateOptions
Section titled “DefaultStateOptions”Properties
Section titled “Properties”-
defaultContent?:
string
|NodeJSON
|HTMLElement
-
The starting document to use when creating the editor. It can be a ProseMirror node JSON object, a HTML string, or a HTML element instance.
-
A JSON object representing the starting document to use when creating the editor.
Deprecated
Section titled “Deprecated”Use
defaultContent
instead.
-
defaultHTML?:
string
|HTMLElement
-
A HTML element or a HTML string representing the starting document to use when creating the editor.
Deprecated
Section titled “Deprecated”Use
defaultContent
instead.
-
A JSON object representing the starting selection to use when creating the editor. It’s only used when
defaultContent
is also provided.
DOMDocumentOptions
Section titled “DOMDocumentOptions”Properties
Section titled “Properties”-
The Document object to use for DOM operations. If not provided, defaults to the current browser’s document object. Useful for server-side rendering or testing environments.
DOMParserOptions
Section titled “DOMParserOptions”Extends
Section titled “Extends”Properties
Section titled “Properties”-
findPositions?:
object
[] -
When given, the parser will, beside parsing the content, record the document positions of the given DOM positions. It will do so by writing to the objects, adding a
pos
property that holds the document position. DOM positions that are not in the parsed content will not be written to.
-
from?:
number
-
The child node index to start parsing from.
-
preserveWhitespace?:
boolean
|"full"
-
By default, whitespace is collapsed as per HTML’s rules. Pass
true
to preserve whitespace, but normalize newlines to spaces, and"full"
to preserve whitespace entirely.
-
to?:
number
-
The child node index to stop parsing at.
-
Provide the starting content match that content parsed into the top node is matched against.
-
By default, the content is parsed into the schema’s default top node type. You can pass this option to use the type and attributes from a different node as the top container.
DOMSerializerOptions
Section titled “DOMSerializerOptions”Properties
Section titled “Properties”-
DOMSerializer?:
object
EditorOptions<E>
Section titled “EditorOptions<E>”Type Parameters
Section titled “Type Parameters”Type Parameter |
---|
|
Properties
Section titled “Properties”-
defaultContent?:
string
|NodeJSON
|HTMLElement
-
The starting document to use when creating the editor. It can be a ProseMirror node JSON object, a HTML string, or a HTML element instance.
-
A JSON object representing the starting document to use when creating the editor.
Deprecated
Section titled “Deprecated”Use
defaultContent
instead.
-
defaultHTML?:
string
|HTMLElement
-
A HTML element or a HTML string representing the starting document to use when creating the editor.
Deprecated
Section titled “Deprecated”Use
defaultContent
instead.
-
A JSON object representing the starting selection to use when creating the editor. It’s only used when
defaultContent
is also provided.
-
extension:
E
-
The extension to use when creating the editor.
ExpandMarkOptions
Section titled “ExpandMarkOptions”Properties
Section titled “Properties”Extension<T>
Section titled “Extension<T>”Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
|
Properties
Section titled “Properties”-
_type?:
T
Facet<Input, Output>
Section titled “Facet<Input, Output>”Type Parameters
Section titled “Type Parameters”Type Parameter |
---|
|
|
Accessors
Section titled “Accessors”reducer
Section titled “reducer”Get Signature
Section titled “Get Signature”get reducer():
FacetReducer
<Input
, Output
>
Returns
Section titled “Returns”FacetReducer
<Input
, Output
>
FindParentNodeResult
Section titled “FindParentNodeResult”Properties
Section titled “Properties”-
depth:
number
-
The depth of the node.
-
The closest parent node that satisfies the predicate.
-
pos:
number
-
The position directly before the node.
-
start:
number
-
The position at the start of the node.
HistoryOptions
Section titled “HistoryOptions”Options for defineHistory.
Properties
Section titled “Properties”-
depth?:
number
-
The amount of history events that are collected before the oldest events are discarded.
Default
Section titled “Default”200
-
newGroupDelay?:
number
-
The delay in milliseconds between changes after which a new group should be started.
Default
Section titled “Default”250
InsertDefaultBlockOptions
Section titled “InsertDefaultBlockOptions”Properties
Section titled “Properties”-
pos?:
number
-
The position to insert the node at. By default it will insert after the current selection.
InsertNodeOptions
Section titled “InsertNodeOptions”Properties
Section titled “Properties”-
The node to insert. Either this or
type
must be provided.
-
pos?:
number
-
The position to insert the node at. By default it will be the anchor position of current selection.
JSONParserOptions
Section titled “JSONParserOptions”Properties
Section titled “Properties”Keymap
Section titled “Keymap”Indexable
Section titled “Indexable”[key
: string
]: Command
MarkAction()<Attrs>
Section titled “MarkAction()<Attrs>”A function for applying a mark with optional attributes and any number of children.
It also has a isActive
method for checking if the mark is active in the current editor selection.
Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
Call Signature
Section titled “Call Signature”-
MarkAction(
attrs
:null
|Attrs
, …children
:NodeChild
[]):ProseMirrorNode
[] -
Applies a mark with attributes and any number of children.
Call Signature
Section titled “Call Signature”-
MarkAction(…
children
:NodeChild
[]):ProseMirrorNode
[] -
Applies a mark with any number of children.
Properties
Section titled “Properties”-
isActive: (
attrs?
:Attrs
) =>boolean
-
Checks if the mark is active in the current editor selection. If the optional
attrs
parameter is provided, it will check if the mark is active with the given attributes.
MarkAttrOptions<MarkName, AttrName, AttrType>
Section titled “MarkAttrOptions<MarkName, AttrName, AttrType>”Extends
Section titled “Extends”AttrSpec
<AttrType
>
Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
|
|
|
|
|
Properties
Section titled “Properties”-
attr:
AttrName
-
The name of the attribute.
-
default?:
AttrType
-
The default value for this attribute, to use when no explicit value is provided. Attributes that have no default must be provided whenever a node or mark of a type that has them is created.
-
parseDOM?: (
node
:HTMLElement
) =>AttrType
-
Parses the attribute value from the DOM.
-
toDOM?: (
value
:AttrType
) =>undefined
|null
| [string
,string
] -
Returns the attribute key and value to be set on the HTML element.
If the returned
key
is"style"
, the value is a string of CSS properties and will be prepended to the existingstyle
attribute on the DOM node.
-
type:
MarkName
-
The name of the mark type.
-
validate?:
string
| (value
:unknown
) =>void
-
A function or type name used to validate values of this attribute. This will be used when deserializing the attribute from JSON, and when running
Node.check
. When a function, it should raise an exception if the value isn’t of the expected type or shape. When a string, it should be a|
-separated string of primitive types ("number"
,"string"
,"boolean"
,"null"
, and"undefined"
), and the library will raise an error when the value is not one of those types.
MarkSpecOptions<MarkName, Attrs>
Section titled “MarkSpecOptions<MarkName, Attrs>”Extends
Section titled “Extends”Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
|
|
Indexable
Section titled “Indexable”[key
: string
]: any
Mark specs can include additional properties that can be inspected through MarkType.spec
when working with the mark.
Properties
Section titled “Properties”-
attrs?: { [K in string | number | symbol]: AttrSpec<Attrs[K]> }
-
The attributes that marks of this type get.
-
code?:
boolean
-
Marks the content of this span as being code, which causes some commands and extensions to treat it differently.
-
excludes?:
string
-
Determines which other marks this mark can coexist with. Should be a space-separated strings naming other marks or groups of marks. When a mark is added to a set, all marks that it excludes are removed in the process. If the set contains any mark that excludes the new mark but is not, itself, excluded by the new mark, the mark can not be added an the set. You can use the value
"_"
to indicate that the mark excludes all marks in the schema.Defaults to only being exclusive with marks of the same type. You can set it to an empty string (or any string not containing the mark’s own name) to allow multiple marks of a given type to coexist (as long as they have different attributes).
-
group?:
string
-
The group or space-separated groups to which this mark belongs.
-
inclusive?:
boolean
-
Whether this mark should be active when the cursor is positioned at its end (or at its start when that is also the start of the parent node). Defaults to true.
-
name:
MarkName
-
The name of the mark type.
-
Associates DOM parser information with this mark (see the corresponding node spec field). The
mark
field in the rules is implied.
-
spanning?:
boolean
-
Determines whether marks of this type can span multiple adjacent nodes when serialized to DOM/HTML. Defaults to true.
-
toDOM?: (
mark
:Mark
,inline
:boolean
) =>DOMOutputSpec
-
Defines the default way marks of this type should be serialized to DOM/HTML. When the resulting spec contains a hole, that is where the marked content is placed. Otherwise, it is appended to the top node.
MarkViewOptions
Section titled “MarkViewOptions”Properties
Section titled “Properties”-
name:
string
NodeAction()<Attrs>
Section titled “NodeAction()<Attrs>”A function for creating a node with optional attributes and any number of children.
It also has a isActive
method for checking if the node is active in the current editor selection.
Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
Call Signature
Section titled “Call Signature”-
NodeAction(
attrs
:null
|Attrs
, …children
:NodeChild
[]):ProseMirrorNode
-
Creates a node with attributes and any number of children.
Call Signature
Section titled “Call Signature”-
NodeAction(…
children
:NodeChild
[]):ProseMirrorNode
-
Creates a node with any number of children.
Properties
Section titled “Properties”-
isActive: (
attrs?
:Attrs
) =>boolean
-
Checks if the node is active in the current editor selection. If the optional
attrs
parameter is provided, it will check if the node is active with the given attributes.
NodeAttrOptions<NodeName, AttrName, AttrType>
Section titled “NodeAttrOptions<NodeName, AttrName, AttrType>”Extends
Section titled “Extends”AttrSpec
<AttrType
>
Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
|
|
|
|
|
Properties
Section titled “Properties”-
attr:
AttrName
-
The name of the attribute.
-
default?:
AttrType
-
The default value for this attribute, to use when no explicit value is provided. Attributes that have no default must be provided whenever a node or mark of a type that has them is created.
-
parseDOM?: (
node
:HTMLElement
) =>AttrType
-
Parses the attribute value from the DOM.
-
splittable?:
boolean
-
Whether the attribute should be kept when the node is split. Set it to
true
if you want to inherit the attribute from the previous node when splitting the node by pressingEnter
.Default
Section titled “Default”undefined
-
toDOM?: (
value
:AttrType
) =>undefined
|null
| [string
,string
] -
Returns the attribute key and value to be set on the HTML element.
If the returned
key
is"style"
, the value is a string of CSS properties and will be prepended to the existingstyle
attribute on the DOM node.
-
type:
NodeName
-
The name of the node type.
-
validate?:
string
| (value
:unknown
) =>void
-
A function or type name used to validate values of this attribute. This will be used when deserializing the attribute from JSON, and when running
Node.check
. When a function, it should raise an exception if the value isn’t of the expected type or shape. When a string, it should be a|
-separated string of primitive types ("number"
,"string"
,"boolean"
,"null"
, and"undefined"
), and the library will raise an error when the value is not one of those types.
NodeJSON
Section titled “NodeJSON”A JSON representation of the prosemirror node.
Properties
Section titled “Properties”-
marks?:
object
[]
-
text?:
string
-
type:
string
NodeSpecOptions<NodeName, Attrs>
Section titled “NodeSpecOptions<NodeName, Attrs>”Extends
Section titled “Extends”Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
|
|
Indexable
Section titled “Indexable”[key
: string
]: any
Node specs may include arbitrary properties that can be read by other code via NodeType.spec
.
Properties
Section titled “Properties”-
atom?:
boolean
-
Can be set to true to indicate that, though this isn’t a leaf node, it doesn’t have directly editable content and should be treated as a single unit in the view.
-
attrs?: { [key in string | number | symbol]: AttrSpec<Attrs[key]> }
-
The attributes that nodes of this type get.
-
code?:
boolean
-
Can be used to indicate that this node contains code, which causes some commands to behave differently.
-
content?:
string
-
The content expression for this node, as described in the schema guide. When not given, the node does not allow any content.
-
defining?:
boolean
-
When enabled, enables both
definingAsContext
anddefiningForContent
.
-
definingAsContext?:
boolean
-
Determines whether this node is considered an important parent node during replace operations (such as paste). Non-defining (the default) nodes get dropped when their entire content is replaced, whereas defining nodes persist and wrap the inserted content.
-
definingForContent?:
boolean
-
In inserted content the defining parents of the content are preserved when possible. Typically, non-default-paragraph textblock types, and possibly list items, are marked as defining.
-
disableDropCursor?:
boolean
| (view
:EditorView
,pos
:object
,event
:DragEvent
) =>boolean
-
draggable?:
boolean
-
Determines whether nodes of this type can be dragged without being selected. Defaults to false.
-
group?:
string
-
The group or space-separated groups to which this node belongs, which can be referred to in the content expressions for the schema.
-
inline?:
boolean
-
Should be set to true for inline nodes. (Implied for text nodes.)
-
isolating?:
boolean
-
When enabled (default is false), the sides of nodes of this type count as boundaries that regular editing operations, like backspacing or lifting, won’t cross. An example of a node that should probably have this enabled is a table cell.
-
leafText?: (
node
:ProseMirrorNode
) =>string
-
Defines the default way a leaf node of this type should be serialized to a string (as used by
Node.textBetween
andNode.textContent
).
-
linebreakReplacement?:
boolean
-
A single inline node in a schema can be set to be a linebreak equivalent. When converting between block types that support the node and block types that don’t but have
whitespace
set to"pre"
,setBlockType
will convert between newline characters to or from linebreak nodes as appropriate.
-
marks?:
string
-
The marks that are allowed inside of this node. May be a space-separated string referring to mark names or groups,
"_"
to explicitly allow all marks, or""
to disallow marks. When not given, nodes with inline content default to allowing all marks, other nodes default to not allowing marks.
-
name:
NodeName
-
The name of the node type.
-
parseDOM?: readonly
TagParseRule
[] -
Associates DOM parser information with this node, which can be used by
DOMParser.fromSchema
to automatically derive a parser. Thenode
field in the rules is implied (the name of this node will be filled in automatically). If you supply your own parser, you do not need to also specify parsing rules in your schema.
-
selectable?:
boolean
-
Controls whether nodes of this type can be selected as a node selection. Defaults to true for non-text nodes.
-
toDebugString?: (
node
:ProseMirrorNode
) =>string
-
Defines the default way a node of this type should be serialized to a string representation for debugging (e.g. in error messages).
-
toDOM?: (
node
:ProseMirrorNode
) =>DOMOutputSpec
-
Defines the default way a node of this type should be serialized to DOM/HTML (as used by
DOMSerializer.fromSchema
). Should return a DOM node or an array structure that describes one, with an optional number zero (“hole”) in it to indicate where the node’s content should be inserted.For text nodes, the default is to create a text DOM node. Though it is possible to create a serializer where text is rendered differently, this is not supported inside the editor, so you shouldn’t override that in your text node spec.
-
topNode?:
boolean
-
Whether this is the top-level node type. Only one node type can be the top-level node type in a schema.
-
whitespace?:
"pre"
|"normal"
-
Controls way whitespace in this a node is parsed. The default is
"normal"
, which causes the DOM parser to collapse whitespace in normal mode, and normalize it (replacing newlines and such with spaces) otherwise."pre"
causes the parser to preserve spaces inside the node. When this option isn’t given, butcode
is true,whitespace
will default to"pre"
. Note that this option doesn’t influence the way the node is rendered—that should be handled bytoDOM
and/or styling.
NodeViewOptions
Section titled “NodeViewOptions”Properties
Section titled “Properties”-
name:
string
RemoveMarkOptions
Section titled “RemoveMarkOptions”Properties
Section titled “Properties”-
If attrs is given, remove precisely the mark with the given attrs. Otherwise, remove all marks of the given type.
-
from?:
number
-
The start position of the document. By default it will be the start position of current selection.
-
to?:
number
-
The end position of the document. By default it will be the end position of current selection.
RemoveNodeOptions
Section titled “RemoveNodeOptions”Properties
Section titled “Properties”-
pos?:
number
-
The document position to start searching node. By default it will be the anchor position of current selection.
SelectionJSON
Section titled “SelectionJSON”A JSON representation of the prosemirror selection.
Properties
Section titled “Properties”-
anchor:
number
-
head:
number
-
type:
string
SetBlockTypeOptions
Section titled “SetBlockTypeOptions”Properties
Section titled “Properties”-
from?:
number
-
to?:
number
SetNodeAttrsOptions
Section titled “SetNodeAttrsOptions”Properties
Section titled “Properties”-
pos?:
number
-
The position of the node. Defaults to the position of the wrapping node containing the current selection.
-
The type of node to set the attributes of.
If current node is not of this type, the command will do nothing.
StateJSON
Section titled “StateJSON”A JSON representation of the prosemirror state.
Properties
Section titled “Properties”-
The current selection.
StepJSON
Section titled “StepJSON”A JSON representation of the prosemirror step.
Indexable
Section titled “Indexable”[x
: string
]: unknown
Properties
Section titled “Properties”-
stepType:
string
-
The type of the step.
ToggleMarkOptions
Section titled “ToggleMarkOptions”Properties
Section titled “Properties”-
enterInlineAtoms?:
boolean
-
Whether the command should act on the content of inline nodes marked as atoms that are completely covered by a selection range.
Default
Section titled “Default”true
-
removeWhenPresent?:
boolean
-
Controls whether, when part of the selected range has the mark already and part doesn’t, the mark is removed (
true
) or added (false
).Default
Section titled “Default”false
ToggleNodeOptions
Section titled “ToggleNodeOptions”Properties
Section titled “Properties”ToggleWrapOptions
Section titled “ToggleWrapOptions”Properties
Section titled “Properties”UnsetBlockTypeOptions
Section titled “UnsetBlockTypeOptions”Properties
Section titled “Properties”-
from?:
number
-
The start position of the document. By default it will be the start position of current selection.
-
to?:
number
-
The end position of the document. By default it will be the end position of current selection.
UnsetMarkOptions
Section titled “UnsetMarkOptions”Properties
Section titled “Properties”-
from?:
number
-
The start position of the document. By default it will be the start position of current selection.
-
to?:
number
-
The end position of the document. By default it will be the end position of current selection.
WrapOptions
Section titled “WrapOptions”Properties
Section titled “Properties”-
Deprecated
Section titled “Deprecated”Use
nodeSpec
instead.
Type Aliases
Section titled “Type Aliases”AnyAttrs
Section titled “AnyAttrs”AttrSpec<AttrType>
Section titled “AttrSpec<AttrType>” type AttrSpec<AttrType> = {
default?
: AttrType
; validate?
: string
| (value
: unknown
) => void
; }
Extended by
Section titled “Extended by”Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
|
Properties
Section titled “Properties”-
default?:
AttrType
-
The default value for this attribute, to use when no explicit value is provided. Attributes that have no default must be provided whenever a node or mark of a type that has them is created.
-
validate?:
string
| (value
:unknown
) =>void
-
A function or type name used to validate values of this attribute. This will be used when deserializing the attribute from JSON, and when running
Node.check
. When a function, it should raise an exception if the value isn’t of the expected type or shape. When a string, it should be a|
-separated string of primitive types ("number"
,"string"
,"boolean"
,"null"
, and"undefined"
), and the library will raise an error when the value is not one of those types.
ClickHandler()
Section titled “ClickHandler()”-
type ClickHandler = (
view
:EditorView
,pos
:number
,event
:MouseEvent
) =>boolean
|void
ClickOnHandler()
Section titled “ClickOnHandler()”-
type ClickOnHandler = (
view
:EditorView
,pos
:number
,node
:ProseMirrorNode
,nodePos
:number
,event
:MouseEvent
,direct
:boolean
) =>boolean
|void
DocChangeHandler()
Section titled “DocChangeHandler()”-
type DocChangeHandler = (
view
:EditorView
,prevState
:EditorState
) =>void
-
A function that is called when the editor document is changed.
DOMEventHandler()<Event>
Section titled “DOMEventHandler()<Event>”-
type DOMEventHandler<Event> = (
view
:EditorView
,event
:DOMEventMap
[Event
]) =>boolean
|void
-
A function to handle the events fired on the editable DOM element. Returns
true
to indicate that it handled the given event. you are responsible for callingpreventDefault
yourself (or not, if you want to allow the default behavior).Type Parameters
Section titled “Type Parameters”Type Parameter Default type Event
extends keyofDOMEventMap
string
DoubleClickHandler()
Section titled “DoubleClickHandler()”-
type DoubleClickHandler = (
view
:EditorView
,pos
:number
,event
:MouseEvent
) =>boolean
|void
DoubleClickOnHandler()
Section titled “DoubleClickOnHandler()”-
type DoubleClickOnHandler = (
view
:EditorView
,pos
:number
,node
:ProseMirrorNode
,nodePos
:number
,event
:MouseEvent
,direct
:boolean
) =>boolean
|void
DropHandler()
Section titled “DropHandler()”-
type DropHandler = (
view
:EditorView
,event
:DragEvent
,slice
:Slice
,moved
:boolean
) =>boolean
|void
ExtractCommandActions<E>
Section titled “ExtractCommandActions<E>”-
type ExtractCommandActions<E> =
ToCommandAction
<ExtractCommands
<E
>> -
Extracts the CommandActions from an extension type.
Type Parameters
Section titled “Type Parameters”Type Parameter E
extendsExtension
ExtractCommandAppliers<E>
Section titled “ExtractCommandAppliers<E>”-
type ExtractCommandAppliers<E> =
ExtractCommandActions
<E
> -
Type Parameters
Section titled “Type Parameters”Type Parameter E
extendsExtension
Deprecated
Section titled “Deprecated”Use
ExtractCommandActions
instead.
ExtractCommandCreators<E>
Section titled “ExtractCommandCreators<E>”-
type ExtractCommandCreators<E> =
ToCommandCreators
<ExtractCommands
<E
>> -
Type Parameters
Section titled “Type Parameters”Type Parameter E
extendsExtension
ExtractMarkActions<E>
Section titled “ExtractMarkActions<E>”-
type ExtractMarkActions<E> =
ToMarkAction
<ExtractMarks
<E
>> -
Extracts the MarkActions from an extension type.
Type Parameters
Section titled “Type Parameters”Type Parameter E
extendsExtension
ExtractMarks<E>
Section titled “ExtractMarks<E>”-
type ExtractMarks<E> =
SimplifyDeeper
<SimplifyUnion
<ExtractTyping
<E
>["Marks"
]>> -
Type Parameters
Section titled “Type Parameters”Type Parameter E
extendsExtension
ExtractNodeActions<E>
Section titled “ExtractNodeActions<E>”-
type ExtractNodeActions<E> =
ToNodeAction
<ExtractNodes
<E
>> -
Extracts the NodeActions from an extension type.
Type Parameters
Section titled “Type Parameters”Type Parameter E
extendsExtension
ExtractNodes<E>
Section titled “ExtractNodes<E>”-
type ExtractNodes<E> =
SimplifyDeeper
<SimplifyUnion
<ExtractTyping
<E
>["Nodes"
]>> -
Type Parameters
Section titled “Type Parameters”Type Parameter E
extendsExtension
FocusChangeHandler()
Section titled “FocusChangeHandler()”-
type FocusChangeHandler = (
hasFocus
:boolean
) =>void
-
A function that is called when the editor gains or loses focus.
KeyDownHandler()
Section titled “KeyDownHandler()”-
type KeyDownHandler = (
view
:EditorView
,event
:KeyboardEvent
) =>boolean
|void
KeyPressHandler()
Section titled “KeyPressHandler()”-
type KeyPressHandler = (
view
:EditorView
,event
:KeyboardEvent
) =>boolean
|void
MarkBuilder
Section titled “MarkBuilder”-
type MarkBuilder =
MarkAction
-
Deprecated
Section titled “Deprecated”Use type MarkAction instead.
MountHandler()
Section titled “MountHandler()”-
type MountHandler = (
view
:EditorView
) =>void
-
A function that is called when the editor view is mounted.
NodeBuilder
Section titled “NodeBuilder”-
type NodeBuilder =
NodeAction
-
Deprecated
Section titled “Deprecated”Use type NodeAction instead.
NodeChild
Section titled “NodeChild”-
type NodeChild =
ProseMirrorNode
|string
|NodeChild
[] -
Available children parameters for NodeAction and MarkAction.
PasteHandler()
Section titled “PasteHandler()”-
type PasteHandler = (
view
:EditorView
,event
:ClipboardEvent
,slice
:Slice
) =>boolean
|void
ScrollToSelectionHandler()
Section titled “ScrollToSelectionHandler()”-
type ScrollToSelectionHandler = (
view
:EditorView
) =>boolean
TextInputHandler()
Section titled “TextInputHandler()”-
type TextInputHandler = (
view
:EditorView
,from
:number
,to
:number
,text
:string
) =>boolean
|void
TripleClickHandler()
Section titled “TripleClickHandler()”-
type TripleClickHandler = (
view
:EditorView
,pos
:number
,event
:MouseEvent
) =>boolean
|void
TripleClickOnHandler()
Section titled “TripleClickOnHandler()”-
type TripleClickOnHandler = (
view
:EditorView
,pos
:number
,node
:ProseMirrorNode
,nodePos
:number
,event
:MouseEvent
,direct
:boolean
) =>boolean
|void
UnmountHandler()
Section titled “UnmountHandler()”-
type UnmountHandler = () =>
void
-
A function that is called when the editor view is unmounted.
UpdateHandler()
Section titled “UpdateHandler()”-
type UpdateHandler = (
view
:EditorView
,prevState
:EditorState
) =>void
-
A function that is called when the editor state is updated.
Variables
Section titled “Variables”canUseRegexLookbehind()
Section titled “canUseRegexLookbehind()”-
const canUseRegexLookbehind: () =>
boolean
clsx()
Section titled “clsx()”-
const clsx: (…
args
: (string
|boolean
|null
|undefined
)[]) =>string
=clsxLite
-
A utility for constructing
className
strings conditionally.It is a re-export of clsx/lite with stricter types.
Functions
Section titled “Functions”addMark()
Section titled “addMark()”-
function addMark(
options
:AddMarkOptions
):Command
-
Returns a command that adds the given mark with the given attributes.
createEditor()
Section titled “createEditor()”-
function createEditor<E>(
options
:EditorOptions
<E
>):Editor
<E
>
defineBaseCommands()
Section titled “defineBaseCommands()”-
function defineBaseCommands():
BaseCommandsExtension
-
Add some base commands
defineBaseKeymap()
Section titled “defineBaseKeymap()”-
function defineBaseKeymap(
options?
:object
):PlainExtension
-
Defines some basic key bindings.
defineClickHandler()
Section titled “defineClickHandler()”-
function defineClickHandler(
handler
:ClickHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleClick
defineClickOnHandler()
Section titled “defineClickOnHandler()”-
function defineClickOnHandler(
handler
:ClickOnHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleClickOn
defineCommands()
Section titled “defineCommands()”-
function defineCommands<T>(
commands
:T
):Extension
<{Commands
: { [K in string | number | symbol]: Parameters<T[K]> }; }>
defineDefaultState()
Section titled “defineDefaultState()”-
function defineDefaultState(
options
:DefaultStateOptions
):PlainExtension
-
Define a default state for the editor.
defineDoc()
Section titled “defineDoc()”-
function defineDoc():
DocExtension
-
Deprecated
Section titled “Deprecated”Use the following import instead:
import { defineDoc } from 'prosekit/extensions/doc'
defineDocChangeHandler()
Section titled “defineDocChangeHandler()”-
function defineDocChangeHandler(
handler
:DocChangeHandler
):PlainExtension
-
Registers a event handler that is called when the editor document is changed.
defineDOMEventHandler()
Section titled “defineDOMEventHandler()”-
function defineDOMEventHandler<Event>(
event
:Event
,handler
:DOMEventHandler
<Event
>):PlainExtension
-
Register a new event handler for the given event type.
defineDoubleClickHandler()
Section titled “defineDoubleClickHandler()”-
function defineDoubleClickHandler(
handler
:DoubleClickHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleDoubleClick
defineDoubleClickOnHandler()
Section titled “defineDoubleClickOnHandler()”-
function defineDoubleClickOnHandler(
handler
:DoubleClickOnHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleDoubleClickOn
defineDropHandler()
Section titled “defineDropHandler()”-
function defineDropHandler(
handler
:DropHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleDrop
defineFocusChangeHandler()
Section titled “defineFocusChangeHandler()”-
function defineFocusChangeHandler(
handler
:FocusChangeHandler
):PlainExtension
-
Registers a event handler that is called when the editor gains or loses focus.
defineHistory()
Section titled “defineHistory()”-
function defineHistory(
options
:HistoryOptions
):HistoryExtension
-
Add undo/redo history to the editor.
defineKeyDownHandler()
Section titled “defineKeyDownHandler()”-
function defineKeyDownHandler(
handler
:KeyDownHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleKeyDown
defineKeymap()
Section titled “defineKeymap()”-
function defineKeymap(
keymap
:Keymap
):PlainExtension
defineKeyPressHandler()
Section titled “defineKeyPressHandler()”-
function defineKeyPressHandler(
handler
:KeyPressHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleKeyPress
defineMarkAttr()
Section titled “defineMarkAttr()”-
function defineMarkAttr<MarkType, AttrName, AttrType>(
options
:MarkAttrOptions
<MarkType
,AttrName
,AttrType
>):Extension
<{Marks
:{ [K in string]: AttrType }
; }>
defineMarkSpec()
Section titled “defineMarkSpec()”-
function defineMarkSpec<Mark, Attrs>(
options
:MarkSpecOptions
<Mark
,Attrs
>):Extension
<{Marks
:{ [K in string]: Attrs }
; }>
defineMarkView()
Section titled “defineMarkView()”-
function defineMarkView(
options
:MarkViewOptions
):Extension
defineMountHandler()
Section titled “defineMountHandler()”-
function defineMountHandler(
handler
:MountHandler
):PlainExtension
-
Registers a event handler that is called when the editor view is mounted.
defineNodeAttr()
Section titled “defineNodeAttr()”-
function defineNodeAttr<NodeType, AttrName, AttrType>(
options
:NodeAttrOptions
<NodeType
,AttrName
,AttrType
>):Extension
<{Nodes
:{ [K in string]: { [K in string]: AttrType } }
; }> -
Defines an attribute for a node type.
defineNodeSpec()
Section titled “defineNodeSpec()”-
function defineNodeSpec<Node, Attrs>(
options
:NodeSpecOptions
<Node
,Attrs
>):Extension
<{Nodes
:{ [K in string]: Attrs }
; }> -
Defines a node type.
defineNodeView()
Section titled “defineNodeView()”-
function defineNodeView(
options
:NodeViewOptions
):Extension
defineParagraph()
Section titled “defineParagraph()”-
function defineParagraph():
ParagraphSpecExtension
-
Defines a paragraph node spec as the highest priority, because it should be the default block node for most cases.
Deprecated
Section titled “Deprecated”Use the following import instead:
import { defineParagraph } from 'prosekit/extensions/paragraph'
definePasteHandler()
Section titled “definePasteHandler()”-
function definePasteHandler(
handler
:PasteHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handlePaste
definePlugin()
Section titled “definePlugin()”-
function definePlugin(
plugin
:ProseMirrorPlugin
<any
> |ProseMirrorPlugin
<any
>[] | (context
:object
) =>ProseMirrorPlugin
<any
> |ProseMirrorPlugin
<any
>[]):PlainExtension
-
Adds a ProseMirror plugin to the editor.
defineScrollToSelectionHandler()
Section titled “defineScrollToSelectionHandler()”-
function defineScrollToSelectionHandler(
handler
:ScrollToSelectionHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleScrollToSelection
defineText()
Section titled “defineText()”-
function defineText():
TextExtension
-
Deprecated
Section titled “Deprecated”Use the following import instead:
import { defineText } from 'prosekit/extensions/text'
defineTextInputHandler()
Section titled “defineTextInputHandler()”-
function defineTextInputHandler(
handler
:TextInputHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleTextInput
defineTripleClickHandler()
Section titled “defineTripleClickHandler()”-
function defineTripleClickHandler(
handler
:TripleClickHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleTripleClick
defineTripleClickOnHandler()
Section titled “defineTripleClickOnHandler()”-
function defineTripleClickOnHandler(
handler
:TripleClickOnHandler
):PlainExtension
-
See https://prosemirror.net/docs/ref/#view.EditorProps.handleTripleClickOn
defineUnmountHandler()
Section titled “defineUnmountHandler()”-
function defineUnmountHandler(
handler
:UnmountHandler
):PlainExtension
-
Registers a event handler that is called when the editor view is unmounted.
defineUpdateHandler()
Section titled “defineUpdateHandler()”-
function defineUpdateHandler(
handler
:UpdateHandler
):PlainExtension
-
Registers a event handler that is called when the editor state is updated.
elementFromJSON()
Section titled “elementFromJSON()”-
function elementFromJSON(
json
:NodeJSON
,options
:JSONParserOptions
&DOMSerializerOptions
&DOMDocumentOptions
):HTMLElement
-
Parse a ProseMirror document JSON object to a HTML element.
Example
Section titled “Example”const json = { type: 'doc', content: [{ type: 'paragraph' }] } const element = elementFromJSON(json, { schema: editor.schema })
elementFromNode()
Section titled “elementFromNode()”-
function elementFromNode(
node
:ProseMirrorNode
,options?
:DOMSerializerOptions
&DOMDocumentOptions
):HTMLElement
-
Serialize a ProseMirror node to a HTML element.
Example
Section titled “Example”const node = editor.state.doc const element = elementFromNode(node)
expandMark()
Section titled “expandMark()”-
function expandMark(
options
:ExpandMarkOptions
):Command
-
Expands the selection to include the entire mark at the current position.
findParentNode()
Section titled “findParentNode()”-
function findParentNode(
predicate
: (node
:ProseMirrorNode
) =>boolean
,$pos
:ResolvedPos
):undefined
|FindParentNodeResult
-
Find the closest parent node that satisfies the predicate.
findParentNodeOfType()
Section titled “findParentNodeOfType()”-
function findParentNodeOfType(
type
:string
|NodeType
,$pos
:ResolvedPos
):undefined
|FindParentNodeResult
-
Finds the closest parent node that matches the given node type.
htmlFromJSON()
Section titled “htmlFromJSON()”-
function htmlFromJSON(
json
:NodeJSON
,options
:JSONParserOptions
&DOMSerializerOptions
&DOMDocumentOptions
):string
-
Parse a ProseMirror document JSON object to a HTML string.
Example
Section titled “Example”const json = { type: 'doc', content: [{ type: 'paragraph' }] } const html = htmlFromJSON(json, { schema: editor.schema })
htmlFromNode()
Section titled “htmlFromNode()”-
function htmlFromNode(
node
:ProseMirrorNode
,options?
:DOMSerializerOptions
&DOMDocumentOptions
):string
-
Serialize a ProseMirror node to a HTML string
Example
Section titled “Example”const node = document.getElementById('content') const html = htmlFromNode(node)
insertDefaultBlock()
Section titled “insertDefaultBlock()”-
function insertDefaultBlock(
options?
:InsertDefaultBlockOptions
):Command
-
Returns a command that inserts a default block after current selection or at the given position.
insertNode()
Section titled “insertNode()”-
function insertNode(
options
:InsertNodeOptions
):Command
-
Returns a command that inserts the given node at the current selection or at the given position.
isAllSelection()
Section titled “isAllSelection()”-
function isAllSelection(
value
:Selection
):value is AllSelection
-
Checks if the given object is a AllSelection instance.
isFragment()
Section titled “isFragment()”-
function isFragment(
value
:unknown
):value is ProseMirrorFragment
-
Checks if the given object is a Fragment instance.
isMark()
Section titled “isMark()”isNodeSelection()
Section titled “isNodeSelection()”-
function isNodeSelection(
value
:Selection
):value is NodeSelection
-
Checks if the given object is a NodeSelection instance.
isProseMirrorNode()
Section titled “isProseMirrorNode()”-
function isProseMirrorNode(
value
:unknown
):value is ProseMirrorNode
-
Checks if the given object is a ProseMirrorNode instance.
isSelection()
Section titled “isSelection()”-
function isSelection(
value
:unknown
):value is Selection
-
Checks if the given object is a Selection instance.
isSlice()
Section titled “isSlice()”isTextSelection()
Section titled “isTextSelection()”-
function isTextSelection(
value
:Selection
):value is TextSelection
-
Checks if the given object is a TextSelection instance.
jsonFromHTML()
Section titled “jsonFromHTML()”-
function jsonFromHTML(
html
:string
,options
:DOMDocumentOptions
&DOMParserOptions
&JSONParserOptions
):NodeJSON
-
Parse a HTML string to a ProseMirror document JSON object.
Example
Section titled “Example”const html = '<p>Hello, world!</p>' const json = jsonFromHTML(html, { schema: editor.schema })
jsonFromNode()
Section titled “jsonFromNode()”-
function jsonFromNode(
node
:ProseMirrorNode
):NodeJSON
-
Return a JSON object representing this node.
Example
Section titled “Example”const node = editor.state.doc const json = jsonFromNode(node)
jsonFromState()
Section titled “jsonFromState()”-
function jsonFromState(
state
:EditorState
):StateJSON
-
Return a JSON object representing this state.
Example
Section titled “Example”const state = editor.state const json = jsonFromState(state)
nodeFromElement()
Section titled “nodeFromElement()”-
function nodeFromElement(
element
:Node
,options
:DOMParserOptions
&JSONParserOptions
):ProseMirrorNode
-
Parse a HTML element to a ProseMirror node.
Example
Section titled “Example”const element = document.getElementById('content') const node = nodeFromElement(element, { schema: editor.schema }) </dd> </dl> *** ### nodeFromHTML() {#nodefromhtml} <dl> <dt> <code data-typedoc-declaration><i>function</i> <i></i> <a id="nodefromhtml-2" href="#nodefromhtml-2">nodeFromHTML</a>(`html`: `string`, `options`: [`DOMParserOptions`](#domparseroptions) & [`JSONParserOptions`](#jsonparseroptions) & [`DOMDocumentOptions`](#domdocumentoptions)): [`ProseMirrorNode`](pm/model.md#prosemirrornode)</code> </dt> <dd> Parse a HTML string to a ProseMirror node. #### Example ```ts const html = '<p>Hello, world!</p>' const node = nodeFromHTML(html, { schema: editor.schema }) </dd> </dl> *** ### nodeFromJSON() {#nodefromjson} <dl> <dt> <code data-typedoc-declaration><i>function</i> <i></i> <a id="nodefromjson-2" href="#nodefromjson-2">nodeFromJSON</a>(`json`: [`NodeJSON`](#nodejson), `options`: [`JSONParserOptions`](#jsonparseroptions)): [`ProseMirrorNode`](pm/model.md#prosemirrornode)</code> </dt> <dd> Parse a JSON object to a ProseMirror node. #### Example ```ts const json = { type: 'doc', content: [{ type: 'paragraph' }] } const node = nodeFromJSON(json, { schema: editor.schema })
removeMark()
Section titled “removeMark()”-
function removeMark(
options
:RemoveMarkOptions
):Command
-
Returns a command that removes the given mark.
removeNode()
Section titled “removeNode()”-
function removeNode(
options
:RemoveNodeOptions
):Command
-
Returns a command to remove the nearest ancestor node of a specific type from the current position.
setBlockType()
Section titled “setBlockType()”-
function setBlockType(
options
:SetBlockTypeOptions
):Command
-
Returns a command that tries to set the selected textblocks to the given node type with the given attributes.
setNodeAttrs()
Section titled “setNodeAttrs()”-
function setNodeAttrs(
options
:SetNodeAttrsOptions
):Command
-
Returns a command that set the attributes of the current node.
setSelectionAround()
Section titled “setSelectionAround()”-
function setSelectionAround(
tr
:Transaction
,pos
:number
):void
stateFromJSON()
Section titled “stateFromJSON()”-
function stateFromJSON(
json
:StateJSON
,options
:JSONParserOptions
):EditorState
-
Parse a JSON object to a ProseMirror state.
Example
Section titled “Example”const json = { state: { type: 'doc', content: [{ type: 'paragraph' }], selection: { type: 'text', from: 1, to: 1 } } } const state = stateFromJSON(json, { schema: editor.schema })
toggleMark()
Section titled “toggleMark()”-
function toggleMark(
options
:ToggleMarkOptions
):Command
-
Returns a command that toggles the given mark with the given attributes.
toggleNode()
Section titled “toggleNode()”-
function toggleNode(
options
:ToggleNodeOptions
):Command
-
Returns a command that set the selected textblocks to the given node type with the given attributes.
toggleWrap()
Section titled “toggleWrap()”-
function toggleWrap(
options
:ToggleWrapOptions
):Command
-
Toggle between wrapping an inactive node with the provided node type, and lifting it up into its parent.
union()
Section titled “union()”Call Signature
Section titled “Call Signature”-
function union<E>(…
exts
:E
):Union
<E
> -
Merges multiple extensions into one. You can pass multiple extensions as arguments or a single array containing multiple extensions.
Throws
Section titled “Throws”If no extensions are provided.
Examples
Section titled “Examples”function defineFancyNodes() { return union( defineFancyParagraph(), defineFancyHeading(), ) }
function defineFancyNodes() { return union([ defineFancyParagraph(), defineFancyHeading(), ]) }
Call Signature
Section titled “Call Signature”-
function union<E>(
exts
:E
):Union
<E
> -
Merges multiple extensions into one. You can pass multiple extensions as arguments or a single array containing multiple extensions.
Throws
Section titled “Throws”If no extensions are provided.
Examples
Section titled “Examples”function defineFancyNodes() { return union( defineFancyParagraph(), defineFancyHeading(), ) }
function defineFancyNodes() { return union([ defineFancyParagraph(), defineFancyHeading(), ]) }
unsetBlockType()
Section titled “unsetBlockType()”-
function unsetBlockType(
options?
:UnsetBlockTypeOptions
):Command
-
Returns a command that set the type of all textblocks between the given range to the default type (usually
paragraph
).
unsetMark()
Section titled “unsetMark()”-
function unsetMark(
options?
:UnsetMarkOptions
):Command
-
Returns a command that removes all marks.
withPriority()
Section titled “withPriority()”-
function withPriority<T>(
extension
:T
,priority
:Priority
):T
-
Return an new extension with the given priority.
Example
Section titled “Example”import { Priority, withPriority } from 'prosekit/core' const extension = withPriority(defineMyExtension(), Priority.high)
wrap()
Section titled “wrap()”-
function wrap(
options
:WrapOptions
):Command
-
Returns a command that wraps the selected textblock with the given node type.