[EuiMarkdownEditor] Add remark-breaks and line break plugin (elasti…

…c#5272) * Add remark-breaks and line break plugin to MarkdownEditor * Update changelog
chandlerprall · Oct 26, 2021 · 86af5ba · 86af5ba
1 parent ca721f2
commit 86af5ba
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 0 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,7 @@ No public interface changes since `40.0.0`.
 ## [`40.0.0`](https://github.com/elastic/eui/tree/v40.0.0)
 
 - Updated `tokenKeyword` to match the definition of keyword field type ([#5251](https://github.com/elastic/eui/pull/5251))
+- Added `remark-breaks` plugin to mimic GitHub-flavored markdown line breaks within `EuiMarkdownEditor` ([#5272](https://github.com/elastic/eui/pull/5272))
 - Added `element`, `buttonElement`, and `arrowProps` props to further customize `EuiAccordion` ([#5258](https://github.com/elastic/eui/pull/5258))
 - Fixed missing `id` for `EuiCombobox` by generating one if `prepend` or `append` exists ([#5229](https://github.com/elastic/eui/pull/5229))
 

diff --git a/package.json b/package.json
@@ -83,6 +83,7 @@
     "rehype-raw": "^5.0.0",
     "rehype-react": "^6.0.0",
     "rehype-stringify": "^8.0.0",
+    "remark-breaks": "^2.0.2",
     "remark-emoji": "^2.1.0",
     "remark-parse": "^8.0.3",
     "remark-rehype": "^8.0.0",

diff --git a/src/components/markdown_editor/__snapshots__/markdown_editor.test.tsx.snap b/src/components/markdown_editor/__snapshots__/markdown_editor.test.tsx.snap
@@ -31,6 +31,10 @@ exports[`EuiMarkdownEditor custom plugins are excluded and popover is rendered 1
         [Function],
         Object {},
       ],
+      Array [
+        [Function],
+        Object {},
+      ],
     ]
   }
   processingPluginList={

diff --git a/src/components/markdown_editor/plugins/markdown_default_plugins/parsing_plugins.ts b/src/components/markdown_editor/plugins/markdown_default_plugins/parsing_plugins.ts
@@ -24,6 +24,7 @@ import {
 } from 'unified';
 import markdown from 'remark-parse';
 import emoji from 'remark-emoji';
+import breaks from 'remark-breaks';
 import highlight from '../remark/remark_prismjs';
 import * as MarkdownTooltip from '../markdown_tooltip';
 import * as MarkdownCheckbox from '../markdown_checkbox';
@@ -39,6 +40,7 @@ export const getDefaultEuiMarkdownParsingPlugins = ({
     [markdown, {}],
     [highlight, {}],
     [emoji, { emoticon: false }],
+    [breaks, {}],
     [markdownLinkValidator, {}],
     [MarkdownCheckbox.parser, {}],
   ];

diff --git a/yarn.lock b/yarn.lock
@@ -15774,6 +15774,13 @@ relateurl@^0.2.7:
   resolved "https://registry.yarnpkg.com/relateurl/-/relateurl-0.2.7.tgz#54dbf377e51440aca90a4cd274600d3ff2d888a9"
   integrity sha1-VNvzd+UUQKypCkzSdGANP/LYiKk=
 
+remark-breaks@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/remark-breaks/-/remark-breaks-2.0.2.tgz#55fdec6c7da84f659aa7fdb1aa95b632870cee8d"
+  integrity sha512-LsQnPPQ7Fzp9RTjj4IwdEmjPOr9bxe9zYKWhs9ZQOg9hMg8rOfeeqQ410cvVdIK87Famqza1CKRxNkepp2EvUA==
+  dependencies:
+    unist-util-visit "^2.0.0"
+
 release-zalgo@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/release-zalgo/-/release-zalgo-1.0.0.tgz#09700b7e5074329739330e535c5a90fb67851730"