Diffdown is a real-time collaborative Markdown editor/previewer built on the AT Protocol diffdown.com
1<!-- NOTE: README.md is generated from src/README.md --> 2 3# @codemirror/lang-markdown [![NPM version](https://img.shields.io/npm/v/@codemirror/lang-markdown.svg)](https://www.npmjs.org/package/@codemirror/lang-markdown) 4 5[ [**WEBSITE**](https://codemirror.net/) | [**ISSUES**](https://github.com/codemirror/dev/issues) | [**FORUM**](https://discuss.codemirror.net/c/next/) | [**CHANGELOG**](https://github.com/codemirror/lang-markdown/blob/main/CHANGELOG.md) ] 6 7This package implements Markdown language support for the 8[CodeMirror](https://codemirror.net/) code editor. 9 10The [project page](https://codemirror.net/) has more information, a 11number of [examples](https://codemirror.net/examples/) and the 12[documentation](https://codemirror.net/docs/). 13 14This code is released under an 15[MIT license](https://github.com/codemirror/lang-markdown/tree/main/LICENSE). 16 17We aim to be an inclusive, welcoming community. To make that explicit, 18we have a [code of 19conduct](http://contributor-covenant.org/version/1/1/0/) that applies 20to communication around the project. 21 22## Usage 23 24```javascript 25import {EditorView, basicSetup} from "codemirror" 26import {markdown} from "@codemirror/lang-markdown" 27 28const view = new EditorView({ 29 parent: document.body, 30 doc: `*CodeMirror* Markdown \`mode\``, 31 extensions: [basicSetup, markdown()] 32}) 33``` 34 35## API Reference 36 37<dl> 38<dt id="user-content-markdown"> 39 <code><strong><a href="#user-content-markdown">markdown</a></strong>(<a id="user-content-markdown^config" href="#user-content-markdown^config">config</a>&#8288;?: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">Object</a> = {}) → <a href="https://codemirror.net/docs/ref#language.LanguageSupport">LanguageSupport</a></code></dt> 40 41<dd><p>Markdown language support.</p> 42<dl><dt id="user-content-markdown^config"> 43 <code><strong><a href="#user-content-markdown^config">config</a></strong></code></dt> 44 45<dd><dl><dt id="user-content-markdown^config.defaultcodelanguage"> 46 <code><strong><a href="#user-content-markdown^config.defaultcodelanguage">defaultCodeLanguage</a></strong>&#8288;?: <a href="https://codemirror.net/docs/ref#language.Language">Language</a> | <a href="https://codemirror.net/docs/ref#language.LanguageSupport">LanguageSupport</a></code></dt> 47 48<dd><p>When given, this language will be used by default to parse code 49blocks.</p> 50</dd><dt id="user-content-markdown^config.codelanguages"> 51 <code><strong><a href="#user-content-markdown^config.codelanguages">codeLanguages</a></strong>&#8288;?: readonly <a href="https://codemirror.net/docs/ref#language.LanguageDescription">LanguageDescription</a>[] | fn(<a id="user-content-markdown^config.codelanguages^info" href="#user-content-markdown^config.codelanguages^info">info</a>: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>) → <a href="https://codemirror.net/docs/ref#language.Language">Language</a> | <a href="https://codemirror.net/docs/ref#language.LanguageDescription">LanguageDescription</a> | <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/null">null</a></code></dt> 52 53<dd><p>A source of language support for highlighting fenced code 54blocks. When it is an array, the parser will use 55<a href="https://codemirror.net/docs/ref/#language.LanguageDescription%5EmatchLanguageName"><code>LanguageDescription.matchLanguageName</code></a> 56with the fenced code info to find a matching language. When it 57is a function, will be called with the info string and may 58return a language or <code>LanguageDescription</code> object.</p> 59</dd><dt id="user-content-markdown^config.addkeymap"> 60 <code><strong><a href="#user-content-markdown^config.addkeymap">addKeymap</a></strong>&#8288;?: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></code></dt> 61 62<dd><p>Set this to false to disable installation of the Markdown 63<a href="#user-content-markdownkeymap">keymap</a>.</p> 64</dd><dt id="user-content-markdown^config.extensions"> 65 <code><strong><a href="#user-content-markdown^config.extensions">extensions</a></strong>&#8288;?: <a href="https://github.com/lezer-parser/markdown#user-content-markdownextension">MarkdownExtension</a></code></dt> 66 67<dd><p>Markdown parser 68<a href="https://github.com/lezer-parser/markdown#user-content-markdownextension">extensions</a> 69to add to the parser.</p> 70</dd><dt id="user-content-markdown^config.base"> 71 <code><strong><a href="#user-content-markdown^config.base">base</a></strong>&#8288;?: <a href="https://codemirror.net/docs/ref#language.Language">Language</a></code></dt> 72 73<dd><p>The base language to use. Defaults to 74<a href="#user-content-commonmarklanguage"><code>commonmarkLanguage</code></a>.</p> 75</dd><dt id="user-content-markdown^config.completehtmltags"> 76 <code><strong><a href="#user-content-markdown^config.completehtmltags">completeHTMLTags</a></strong>&#8288;?: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></code></dt> 77 78<dd><p>By default, the extension installs an autocompletion source that 79completes HTML tags when a <code>&lt;</code> is typed. Set this to false to 80disable this.</p> 81</dd><dt id="user-content-markdown^config.pasteurlaslink"> 82 <code><strong><a href="#user-content-markdown^config.pasteurlaslink">pasteURLAsLink</a></strong>&#8288;?: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></code></dt> 83 84<dd><p>The returned language contains 85<a href="#user-content-pasteurlaslink"><code>pasteURLAsLink</code></a> as a support 86extension unless you set this to false.</p> 87</dd><dt id="user-content-markdown^config.htmltaglanguage"> 88 <code><strong><a href="#user-content-markdown^config.htmltaglanguage">htmlTagLanguage</a></strong>&#8288;?: <a href="https://codemirror.net/docs/ref#language.LanguageSupport">LanguageSupport</a></code></dt> 89 90<dd><p>By default, HTML tags in the document are handled by the <a href="https://github.com/codemirror/lang-html">HTML 91language</a> package with 92tag matching turned off. You can pass in an alternative language 93configuration here if you want.</p> 94</dd></dl></dd></dl></dd> 95<dt id="user-content-markdownlanguage"> 96 <code><strong><a href="#user-content-markdownlanguage">markdownLanguage</a></strong>: <a href="https://codemirror.net/docs/ref#language.Language">Language</a></code></dt> 97 98<dd><p>Language support for <a href="https://github.github.com/gfm/">GFM</a> plus 99subscript, superscript, and emoji syntax.</p> 100</dd> 101<dt id="user-content-commonmarklanguage"> 102 <code><strong><a href="#user-content-commonmarklanguage">commonmarkLanguage</a></strong>: <a href="https://codemirror.net/docs/ref#language.Language">Language</a></code></dt> 103 104<dd><p>Language support for strict CommonMark.</p> 105</dd> 106<dt id="user-content-insertnewlinecontinuemarkup"> 107 <code><strong><a href="#user-content-insertnewlinecontinuemarkup">insertNewlineContinueMarkup</a></strong>: <a href="https://codemirror.net/docs/ref#state.StateCommand">StateCommand</a></code></dt> 108 109<dd><p>This command, when invoked in Markdown context with cursor 110selection(s), will create a new line with the markup for 111blockquotes and lists that were active on the old line. If the 112cursor was directly after the end of the markup for the old line, 113trailing whitespace and list markers are removed from that line.</p> 114<p>The command does nothing in non-Markdown context, so it should 115not be used as the only binding for Enter (even in a Markdown 116document, HTML and code regions might use a different language).</p> 117</dd> 118<dt id="user-content-insertnewlinecontinuemarkupcommand"> 119 <code><strong><a href="#user-content-insertnewlinecontinuemarkupcommand">insertNewlineContinueMarkupCommand</a></strong>(<a id="user-content-insertnewlinecontinuemarkupcommand^config" href="#user-content-insertnewlinecontinuemarkupcommand^config">config</a>&#8288;?: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">Object</a> = {}) → <a href="https://codemirror.net/docs/ref#state.StateCommand">StateCommand</a></code></dt> 120 121<dd><p>Returns a command like 122<a href="#user-content-insertnewlinecontinuemarkup"><code>insertNewlineContinueMarkup</code></a>, 123allowing further configuration.</p> 124<dl><dt id="user-content-insertnewlinecontinuemarkupcommand^config"> 125 <code><strong><a href="#user-content-insertnewlinecontinuemarkupcommand^config">config</a></strong></code></dt> 126 127<dd><dl><dt id="user-content-insertnewlinecontinuemarkupcommand^config.nontightlists"> 128 <code><strong><a href="#user-content-insertnewlinecontinuemarkupcommand^config.nontightlists">nonTightLists</a></strong>&#8288;?: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></code></dt> 129 130<dd><p>By default, when pressing enter in a blank second item in a 131tight (no blank lines between items) list, the command will 132insert a blank line above that item, starting a non-tight list. 133Set this to false to disable this behavior.</p> 134</dd></dl></dd></dl></dd> 135<dt id="user-content-deletemarkupbackward"> 136 <code><strong><a href="#user-content-deletemarkupbackward">deleteMarkupBackward</a></strong>: <a href="https://codemirror.net/docs/ref#state.StateCommand">StateCommand</a></code></dt> 137 138<dd><p>This command will, when invoked in a Markdown context with the 139cursor directly after list or blockquote markup, delete one level 140of markup. When the markup is for a list, it will be replaced by 141spaces on the first invocation (a further invocation will delete 142the spaces), to make it easy to continue a list.</p> 143<p>When not after Markdown block markup, this command will return 144false, so it is intended to be bound alongside other deletion 145commands, with a higher precedence than the more generic commands.</p> 146</dd> 147<dt id="user-content-markdownkeymap"> 148 <code><strong><a href="#user-content-markdownkeymap">markdownKeymap</a></strong>: readonly <a href="https://codemirror.net/docs/ref#view.KeyBinding">KeyBinding</a>[]</code></dt> 149 150<dd><p>A small keymap with Markdown-specific bindings. Binds Enter to 151<a href="#user-content-insertnewlinecontinuemarkup"><code>insertNewlineContinueMarkup</code></a> 152and Backspace to 153<a href="#user-content-deletemarkupbackward"><code>deleteMarkupBackward</code></a>.</p> 154</dd> 155<dt id="user-content-pasteurlaslink"> 156 <code><strong><a href="#user-content-pasteurlaslink">pasteURLAsLink</a></strong>: <a href="https://codemirror.net/docs/ref#state.Extension">Extension</a></code></dt> 157 158<dd><p>An extension that intercepts pastes when the pasted content looks 159like a URL and the selection is non-empty and selects regular 160text, making the selection a link with the pasted URL as target.</p> 161</dd> 162</dl>