Enter Rule
Execute some action when Enter
is pressed after a certain text pattern. This is similar to Input Rule.
Use defineTextBlockEnterRule
to create a new enter rule that can change the current text block into a different node type.
import {
} from 'prosekit/extensions/enter-rule' /** * Converts the text block to a heading when pressing `Enter` if the current * line is starting with `#` followed by a space. */ export function defineTextBlockEnterRule function defineTextBlockEnterRule({ regex, type, attrs, stop, }: TextBlockEnterRuleOptions): PlainExtension
Defines an enter rule that replaces the matched text with a block node. See also {@link defineEnterRule } .() { return defineHeadingEnterRule function defineHeadingEnterRule(): PlainExtension
Converts the text block to a heading when pressing `Enter` if the current line is starting with `#` followed by a space.({ defineTextBlockEnterRule function defineTextBlockEnterRule({ regex, type, attrs, stop, }: TextBlockEnterRuleOptions): PlainExtension
Defines an enter rule that replaces the matched text with a block node. See also {@link defineEnterRule } .: /^(#{1,6})\s.*$/, regex regex: RegExp
The regular expression to match against. It should end with `$`.: 'heading', type type: string | NodeType
The node type to replace the matched text with.: ( attrs attrs?: Attrs | ((match: RegExpMatchArray) => Attrs | null) | null | undefined
Attributes to set on the node. If a function is provided, it will be called with the matched result from the regular expression.) => { const match match: RegExpMatchArray
: number = level const level: number
[1]?. match match: RegExpMatchArray
?? 1 return { length String.length: number
Returns the length of a String object.} }, }) } level level: number
Unlike
defineHeadingInputRule
in Input Rule, this rule will only transform the current text block into a heading and remove the leading#
when you pressEnter
after typing the whole line.
Use defineEnterRule
to create an ambiguous enter rule.
import {
} from 'prosekit/extensions/enter-rule' /** * Converts the text before the text cursor into an emoji when pressing `Enter`. */ export function defineEnterRule function defineEnterRule({ regex, handler, stop, }: EnterRuleOptions): PlainExtension
Defines an enter rule. An enter rule applies when the text directly in front of the cursor matches `regex` and user presses Enter. The `regex` should end with `$`.() { return defineEmojiEnterRule function defineEmojiEnterRule(): PlainExtension
Converts the text before the text cursor into an emoji when pressing `Enter`.({ defineEnterRule function defineEnterRule({ regex, handler, stop, }: EnterRuleOptions): PlainExtension
Defines an enter rule. An enter rule applies when the text directly in front of the cursor matches `regex` and user presses Enter. The `regex` should end with `$`.: /:(apple|banana):$/, regex regex: RegExp
The regular expression to match against. It should end with `$`.: ({ handler handler: EnterRuleHandler
A function to be called when an enter rule is triggered., match match: RegExpExecArray
The matched result from the regular expression., from from: number
The start position of the matched text., to to: number
The end position of the matched text.}) => { const state state: EditorState
The current editor state.= text const text: "apple" | "banana"
[1] as 'apple' | 'banana' const match match: RegExpExecArray
The matched result from the regular expression.= emoji const emoji: "🍎" | "🍌"
=== 'apple' ? '🍎' : '🍌' return text const text: "apple" | "banana"
. state state: EditorState
The current editor state.. tr EditorState.tr: Transaction
Start a [transaction](https://prosemirror.net/docs/ref/#state.Transaction) from this state.( replaceWith Transform.replaceWith(from: number, to: number, content: Fragment | Node | readonly Node[]): Transaction
Replace the given range with the given content, which may be a fragment, node, or array of nodes., from from: number
The start position of the matched text., to to: number
The end position of the matched text.. state state: EditorState
The current editor state.. schema EditorState.schema: Schema<any, any>
The schema of the state's document.( text Schema<any, any>.text(text: string, marks?: readonly Mark[] | null): Node
Create a text node in the schema. Empty text nodes are not allowed.)) }, }) } emoji const emoji: "🍎" | "🍌"