prosekit/react
Interfaces
Section titled “Interfaces”ProseKitProps
Section titled “ProseKitProps”Properties
Section titled “Properties”-
children?:
ReactNode
ReactMarkViewOptions
Section titled “ReactMarkViewOptions”Options for defineReactMarkView.
Extends
Section titled “Extends”CoreMarkViewUserOptions
<ReactMarkViewComponent
>
Properties
Section titled “Properties”-
as?:
MarkViewDOMSpec
-
contentAs?:
MarkViewDOMSpec
-
destroy?: () =>
void
-
ignoreMutation?: (
mutation
:ViewMutationRecord
) =>boolean
|void
-
name:
string
-
The name of the mark type.
ReactMarkViewProps
Section titled “ReactMarkViewProps”Extends
Section titled “Extends”MarkViewContext
Properties
Section titled “Properties”-
contentRef:
MarkViewContentRef
ReactNodeViewOptions
Section titled “ReactNodeViewOptions”Options for defineReactNodeView.
Extends
Section titled “Extends”CoreNodeViewUserOptions
<ReactNodeViewComponent
>
Properties
Section titled “Properties”-
as?:
NodeViewDOMSpec
-
contentAs?:
NodeViewDOMSpec
-
deselectNode?: () =>
void
-
destroy?: () =>
void
-
ignoreMutation?: (
mutation
:ViewMutationRecord
) =>boolean
|void
-
name:
string
-
The name of the node type.
-
onUpdate?: () =>
void
-
selectNode?: () =>
void
-
setSelection?: (
anchor
:number
,head
:number
,root
:Document
|ShadowRoot
) =>void
-
update?: (
node
:ProseMirrorNode
,decorations
: readonlyDecoration
[],innerDecorations
:DecorationSource
) =>boolean
|void
ReactNodeViewProps
Section titled “ReactNodeViewProps”Extends
Section titled “Extends”NodeViewContext
Properties
Section titled “Properties”-
contentRef:
NodeViewContentRef
-
decorations: readonly
Decoration
[]
-
getPos: () =>
undefined
|number
-
selected:
boolean
UseEditorDerivedOptions<E>
Section titled “UseEditorDerivedOptions<E>”Type Parameters
Section titled “Type Parameters”Type Parameter | Default type |
---|---|
|
|
Properties
Section titled “Properties”-
The editor to add the extension to. If not provided, it will use the editor from the nearest
ProseKit
component.
UseExtensionOptions
Section titled “UseExtensionOptions”Properties
Section titled “Properties”-
The editor to add the extension to. If not provided, it will use the editor from the nearest
ProseKit
component.
Type Aliases
Section titled “Type Aliases”ReactMarkViewComponent
Section titled “ReactMarkViewComponent”-
type ReactMarkViewComponent =
ComponentType
<ReactMarkViewProps
>
ReactNodeViewComponent
Section titled “ReactNodeViewComponent”-
type ReactNodeViewComponent =
ComponentType
<ReactNodeViewProps
>
Variables
Section titled “Variables”ProseKit
Section titled “ProseKit”-
const ProseKit:
ComponentType
<ProseKitProps
> -
The root component for a ProseKit editor.
Functions
Section titled “Functions”defineReactMarkView()
Section titled “defineReactMarkView()”-
function defineReactMarkView(
options
:ReactMarkViewOptions
):Extension
-
Defines a mark view using a React component.
defineReactNodeView()
Section titled “defineReactNodeView()”-
function defineReactNodeView(
options
:ReactNodeViewOptions
):Extension
-
Defines a node view using a React component.
useDocChange()
Section titled “useDocChange()”-
function useDocChange(
handler
: (doc
:ProseMirrorNode
) =>void
,options?
:UseExtensionOptions
):void
-
Calls the given handler whenever the editor document changes.
useEditor()
Section titled “useEditor()”-
Retrieves the editor instance from the nearest ProseKit component.
useEditorDerivedValue()
Section titled “useEditorDerivedValue()”-
function useEditorDerivedValue<E, Derived>(
derive
: (editor
:Editor
<E
>) =>Derived
,options?
:UseEditorDerivedOptions
<E
>):Derived
-
A hook that runs a function to derive a value from the editor instance after editor state changes.
This is useful when you need to render something based on the editor state, for example, whether the selected text is wrapped in an italic mark.
useExtension()
Section titled “useExtension()”-
function useExtension(
extension
:null
|Extension
<ExtensionTyping
<any
,any
,any
>>,options?
:UseExtensionOptions
):void
-
Add an extension to the editor.
useKeymap()
Section titled “useKeymap()”-
function useKeymap(
keymap
:Keymap
,options?
:UseExtensionOptions
):void
useStateUpdate()
Section titled “useStateUpdate()”-
function useStateUpdate(
handler
: (state
:EditorState
) =>void
,options?
:UseExtensionOptions
):void
-
Calls the given handler whenever the editor state changes.