extension-markdown
package @remirror/extension-markdown
class MarkdownExtension
This extension adds support for markdown editors using remirror.
TODO - when presets are removed automatically include all the supported extensions.
This extension adds the following to the ManagerStore
.
getMarkdown()
- extract the markdown representation from the editor.
Future features
- [ ] Add markdown specific commands which add the markdown syntax to the text content.
Signature:
export declare class MarkdownExtension extends PlainExtension<MarkdownOptions>
Extends: PlainExtension<MarkdownOptions>
(Some inherited members may not be shown because they are not represented in the documentation.)
property name
Signature:
get name(): "markdown";
method createPlugin
Signature:
createPlugin(): CreateExtensionPlugin;
Returns:
CreateExtensionPlugin
method getMarkdown
Get the markdown content from the current document.
Signature:
getMarkdown(state?: EditorState): Helper<string>;
Parameters:
Parameter | Type | Description |
---|---|---|
state | EditorState | (Optional) the state provided to the getMarkdown method. |
Returns:
Helper<string>
method insertMarkdown
Insert a markdown string as a ProseMirror Node.
commands.insertMarkdown('# Heading\nAnd content');
// => <h1 id="heading">Heading</h1><p>And content</p>
The content will be inlined by default if not a block node.
commands.insertMarkdown('**is bold.**')
// => <strong>is bold.</strong>
To always wrap the content in a block you can pass the following option.
commands.insertMarkdown('**is bold.**', { alwaysWrapInBlock: true });
// => <p><strong>is bold.</strong></p>
Signature:
insertMarkdown(markdown: string, options?: InsertNodeOptions & {
alwaysWrapInBlock?: boolean;
}): CommandFunction;
Parameters:
Parameter | Type | Description |
---|---|---|
markdown | string | |
options | InsertNodeOptions & { alwaysWrapInBlock?: boolean; } | (Optional) |
Returns:
CommandFunction
method onCreate
Add the markdown
string handler and getMarkdown
state helper method.
Signature:
onCreate(): void;
Returns:
void
interface MarkdownOptions
Signature:
export interface MarkdownOptions
property activeNodes
The parent nodes (or tags) where the markdown extension shortcuts are active.
Signature:
activeNodes?: string[];
property copyAsMarkdown
Set this to true
to copy the values from the text editor as markdown. This means that when pasting into a plain text editor (vscode) for example, the markdown will be preserved.
Signature:
copyAsMarkdown?: boolean;
property htmlSanitizer
Provide a sanitizer to prevent XSS attacks.
The default sanitizer has **zero** security guarantees so it's recommended that you provide your own html sanitizer here.
If you want to sanitize on the backend as well you will need to override this method.
Signature:
htmlSanitizer?: Static<(html: string) => string>;
property htmlToMarkdown
Converts the provided html to a markdown string.
By default this uses
Signature:
htmlToMarkdown?: Static<(html: string) => string>;
property markdownToHtml
Takes a markdown string and outputs html. It is up to you to make sure the markdown is sanitized during this function call by providing the sanitizeHtml
method.
Signature:
markdownToHtml?: Static<(markdown: string, sanitizer?: (html: string) => string) => string>;