feat(markup): support codemirror tooltips config

src/bundle/Editor.ts

@@ -40,7 +40,7 @@
 export type ToolbarActionData = {
     editorMode: EditorMode;
     id: string;
     attrs?: {[key: string]: any};
 };
 
 export interface EventMap {
@@ -71,7 +71,7 @@
 
     moveCursor(position: 'start' | 'end' | {line: number}): void;
 
     /** @internal used in demo for dev-tools */
     readonly _wysiwygView?: PMEditorView;
 }
 
@@ -307,6 +307,7 @@
                         }).concat(this.#markupConfig?.languageData || []),
                     },
                     autocompletion: this.#markupConfig.autocompletion,
+                    tooltips: this.#markupConfig.tooltips,
                     directiveSyntax: this.directiveSyntax,
                     receiver: this,
                     searchPanel: this.#markupConfig.searchPanel,

src/bundle/types.ts

@@ -157,6 +157,8 @@ export type MarkdownEditorMarkupConfig = {
     languageData?: YfmLangOptions['languageData'];
     /** Config for @codemirror/autocomplete https://codemirror.net/docs/ref/#autocomplete.autocompletion%5Econfig */
     autocompletion?: CreateCodemirrorParams['autocompletion'];
+    /** Config for tooltips https://codemirror.net/docs/ref/#view.tooltips */
+    tooltips?: CreateCodemirrorParams['tooltips'];
     /**
      * The function, used to determine if the pasted text is the image url and should be inserted as an image
      */

src/markup/codemirror/create.ts

@@ -15,6 +15,7 @@ import {
     type KeyBinding,
     keymap,
     placeholder,
+    tooltips,
 } from '@codemirror/view';
 
 import {InputState} from 'src/utils/input-state';
@@ -62,6 +63,7 @@ import {type YfmLangOptions, yfmLang} from './yfm';
 export type {YfmLangOptions};
 
 type Autocompletion = Parameters<typeof autocompletion>[0];
+type Tooltips = Parameters<typeof tooltips>[0];
 
 const linkRegex = /\[[\s\S]*?]\([\s\S]*?\)/g;
 
@@ -88,6 +90,7 @@ export type CreateCodemirrorParams = {
     receiver?: Receiver<EventMap>;
     yfmLangOptions?: YfmLangOptions;
     autocompletion?: Autocompletion;
+    tooltips?: Tooltips;
     directiveSyntax: DirectiveSyntaxContext;
     preserveEmptyRows: boolean;
     searchPanel?: boolean;
@@ -110,6 +113,7 @@ export function createCodemirror(params: CreateCodemirrorParams) {
         extensions: extraExtensions,
         placeholder: placeholderContent,
         autocompletion: autocompletionConfig,
+        tooltips: tooltipsConfig,
         parseHtmlOnPaste,
         parseInsertedUrlAsImage,
         directiveSyntax,
@@ -317,6 +321,10 @@ export function createCodemirror(params: CreateCodemirrorParams) {
         );
     }
 
+    if (tooltipsConfig) {
+        extensions.push(tooltips(tooltipsConfig));
+    }
+
     if (extraExtensions) {
         extensions.push(...extraExtensions);
     }