Input Rule
Execute some action when a certain pattern is typed. This is based on the prosemirror-inputrules.
You can directly pass an InputRule
instance to defineInputRule
.
import {
} from 'prosekit/extensions/input-rule' import { defineInputRule function defineInputRule(rule: InputRule): PlainExtension
Defines an input rule extension.} from 'prosekit/pm/inputrules' /** * Converts three dots to an ellipsis character. */ function InputRule class InputRule
Input rules are regular expressions describing a piece of text that, when typed, causes something to happen. This might be changing two dashes into an emdash, wrapping a paragraph starting with `"> "` into a blockquote, or something entirely different.() { const defineEllipsis function defineEllipsis(): PlainExtension
Converts three dots to an ellipsis character.= new rule const rule: InputRule
(/\.{3}$/, '…') return InputRule
new InputRule(match: RegExp, handler: string | ((state: EditorState, match: RegExpMatchArray, start: number, end: number) => Transaction | null), options?: { undoable?: boolean; inCode?: boolean | "only"; inCodeMark?: boolean; }): InputRule
Create an input rule. The rule applies when the user typed something and the text directly in front of the cursor matches `match`, which should end with `$`. The `handler` can be a string, in which case the matched text, or the first matched group in the regexp, is replaced by that string. Or a it can be a function, which will be called with the match array produced by [`RegExp.exec`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec), as well as the start and end of the matched range, and which can return a [transaction](https://prosemirror.net/docs/ref/#state.Transaction) that describes the rule's effect, or null to indicate the input was not handled.( defineInputRule function defineInputRule(rule: InputRule): PlainExtension
Defines an input rule extension.) } rule const rule: InputRule
Use defineTextBlockInputRule
to create a new input rule that can change the current text block into a different node type.
import {
} from 'prosekit/extensions/input-rule' /** * Converts the text block to a heading when `#` is typed at the start of a new * line followed by a space. */ export function defineTextBlockInputRule
function defineTextBlockInputRule({ regex, type, attrs, }: { regex: RegExp; type: string | NodeType; attrs?: Attrs | null | ((match: RegExpMatchArray) => Attrs | null); }): PlainExtension
Defines an input rule that changes the type of a textblock when the matched text is typed into it. See also [textblockTypeInputRule](https://prosemirror.net/docs/ref/#inputrules.textblockTypeInputRule)() { return defineHeadingInputRule function defineHeadingInputRule(): PlainExtension
Converts the text block to a heading when `#` is typed at the start of a new line followed by a space.({ defineTextBlockInputRule
function defineTextBlockInputRule({ regex, type, attrs, }: { regex: RegExp; type: string | NodeType; attrs?: Attrs | null | ((match: RegExpMatchArray) => Attrs | null); }): PlainExtension
Defines an input rule that changes the type of a textblock when the matched text is typed into it. See also [textblockTypeInputRule](https://prosemirror.net/docs/ref/#inputrules.textblockTypeInputRule): /^(#{1,6})\s$/, regex regex: RegExp
The regular expression to match against, which should end with `$`. It usually also starts with `^` to that it is only matched at the start of a textblock.: '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.) => { 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
Use defineWrappingInputRule
to create a new input rule that can change the current text block into a different node type.
import {
} from 'prosekit/extensions/input-rule' /** * Wraps the text block in a blockquote when `>` is typed at the start of a new * line followed by a space. */ export function defineWrappingInputRule
function defineWrappingInputRule({ regex, type, attrs, join, }: { regex: RegExp; type: string | NodeType; attrs?: Attrs | null | ((match: RegExpMatchArray) => Attrs | null); join?: (match: RegExpMatchArray, node: Node) => boolean; }): PlainExtension
Defines an input rule for automatically wrapping a textblock when a given string is typed. See also [wrappingInputRule](https://prosemirror.net/docs/ref/#inputrules.wrappingInputRule)() { return defineBlockquoteInputRule function defineBlockquoteInputRule(): PlainExtension
Wraps the text block in a blockquote when `>` is typed at the start of a new line followed by a space.({ defineWrappingInputRule
function defineWrappingInputRule({ regex, type, attrs, join, }: { regex: RegExp; type: string | NodeType; attrs?: Attrs | null | ((match: RegExpMatchArray) => Attrs | null); join?: (match: RegExpMatchArray, node: Node) => boolean; }): PlainExtension
Defines an input rule for automatically wrapping a textblock when a given string is typed. See also [wrappingInputRule](https://prosemirror.net/docs/ref/#inputrules.wrappingInputRule): /^>\s/, regex regex: RegExp
The regular expression to match against, which should end with `$`. It usually also starts with `^` to that it is only matched at the start of a textblock.: 'blockquote', }) } type type: string | NodeType
The type of node to wrap in.