fix: Markdown editor unregister tooltip plugin

CHANGELOG.md

@@ -1,5 +1,7 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
+- Added `getDefaultEuiMarkdownProcessingPlugins` method for better control over `EuiMarkdownEditor`'s toolbar UI ([#4383](https://github.com/elastic/eui/pull/4383))
+
 **Bug fixes**
 
 - Fixed heights of `append` and `prepend` in `EuiComboBox` ([#4410](https://github.com/elastic/eui/pull/4406))

src-docs/src/views/markdown_editor/markdown_editor_with_plugins.js

@@ -42,6 +42,7 @@ import {
   euiPalettePositive,
   euiPaletteWarm,
 } from '../../../../src/services/color';
+import { getDefaultEuiMarkdownUiPlugins } from '../../../../src/components/markdown_editor';
 
 const paletteData = {
   euiPaletteForStatus,
@@ -261,6 +262,9 @@ exampleParsingList.push(ChartMarkdownParser);
 const exampleProcessingList = getDefaultEuiMarkdownProcessingPlugins();
 exampleProcessingList[1][1].components.chartDemoPlugin = ChartMarkdownRenderer;
 
+const exampleUiPlugins = getDefaultEuiMarkdownUiPlugins();
+exampleUiPlugins.push(chartDemoPlugin);
+
 const initialExample = `## Chart plugin
 
 Notice the toolbar above has a new chart button. Click it to add a chart.
@@ -286,7 +290,7 @@ export default () => {
         value={value}
         onChange={setValue}
         height={400}
-        uiPlugins={[chartDemoPlugin]}
+        uiPlugins={exampleUiPlugins}
         parsingPluginList={exampleParsingList}
         processingPluginList={exampleProcessingList}
         onParse={onParse}

src/components/index.js

@@ -224,6 +224,7 @@ export {
   EuiMarkdownFormat,
   getDefaultEuiMarkdownParsingPlugins,
   getDefaultEuiMarkdownProcessingPlugins,
+  getDefaultEuiMarkdownUiPlugins,
 } from './markdown_editor';
 export { EuiMark } from './mark';
 

src/components/markdown_editor/index.ts

@@ -21,6 +21,7 @@ export { EuiMarkdownEditor, EuiMarkdownEditorProps } from './markdown_editor';
 export {
   getDefaultEuiMarkdownParsingPlugins,
   getDefaultEuiMarkdownProcessingPlugins,
+  getDefaultEuiMarkdownUiPlugins,
 } from './plugins/markdown_default_plugins';
 export { EuiMarkdownContext } from './markdown_context';
 export { EuiMarkdownFormat } from './markdown_format';

src/components/markdown_editor/markdown_editor.tsx

@@ -56,6 +56,7 @@ import * as MarkdownTooltip from './plugins/markdown_tooltip';
 import {
   defaultParsingPlugins,
   defaultProcessingPlugins,
+  defaultUiPlugins,
 } from './plugins/markdown_default_plugins';
 
 import { EuiResizeObserver } from '../observer/resize_observer';
@@ -193,7 +194,7 @@ export const EuiMarkdownEditor = forwardRef<
       autoExpandPreview = true,
       parsingPluginList = defaultParsingPlugins,
       processingPluginList = defaultProcessingPlugins,
-      uiPlugins = [],
+      uiPlugins = defaultUiPlugins,
       onParse,
       errors = [],
       'aria-label': ariaLabel,
@@ -214,7 +215,14 @@ export const EuiMarkdownEditor = forwardRef<
       EuiMarkdownEditorUiPlugin | undefined
     >(undefined);
 
-    const toolbarPlugins = [MarkdownTooltip.plugin, ...uiPlugins];
+    const toolbarPlugins = [...uiPlugins];
+    // @ts-ignore __originatedFromEui is a custom property
+    if (!uiPlugins.__originatedFromEui) {
+      toolbarPlugins.unshift(MarkdownTooltip.plugin);
+      console.warn(
+        'Deprecation warning: uiPlugins passed to EuiMarkdownEditor does not include the tooltip plugin, which has been added for you. This automatic inclusion has been deprecated and will be removed in the future, see https://github.com/elastic/eui/pull/4383'
+      );
+    }
 
     const markdownActions = useMemo(
       () => new MarkdownActions(editorId, toolbarPlugins),

src/components/markdown_editor/plugins/markdown_default_plugins.tsx

@@ -102,3 +102,12 @@ export const getDefaultEuiMarkdownProcessingPlugins = (): [
 ];
 
 export const defaultProcessingPlugins = getDefaultEuiMarkdownProcessingPlugins();
+
+export const getDefaultEuiMarkdownUiPlugins = () => {
+  const array = [MarkdownTooltip.plugin];
+  // @ts-ignore __originatedFromEui is a custom property
+  array.__originatedFromEui = true;
+  return array;
+};
+
+export const defaultUiPlugins = getDefaultEuiMarkdownUiPlugins();