feat(markup): added ability to override default placeholder in markup mode (#376)

Author: d3m1d0v

src/bundle/Editor.ts

@@ -118,6 +118,8 @@ export type MarkupConfig = {
     disabledExtensions?: CreateCodemirrorParams['disabledExtensions'];
     /** Additional keymaps for codemirror instance */
     keymaps?: CreateCodemirrorParams['keymaps'];
+    /** Overrides the default placeholder content. */
+    placeholder?: CreateCodemirrorParams['placeholder'];
     /**
      * Additional language data for markdown language in codemirror.
      * Can be used to configure additional autocompletions and others.
@@ -300,7 +302,7 @@ export class EditorImpl extends SafeEventEmitter<EventMapInt> implements EditorI
             this.#markupEditor = new MarkupEditor(
                 createCodemirror({
                     doc: this.#markup,
-                    placeholderText: i18n('markup_placeholder'),
+                    placeholder: this.#markupConfig.placeholder ?? i18n('markup_placeholder'),
                     onCancel: () => this.emit('cancel', null),
                     onSubmit: () => this.emit('submit', null),
                     onChange: () => this.emit('rerender-toolbar', null),

src/markup/codemirror/create.ts

@@ -47,7 +47,7 @@ type Autocompletion = Parameters<typeof autocompletion>[0];
 
 export type CreateCodemirrorParams = {
     doc: EditorViewConfig['doc'];
-    placeholderText: string;
+    placeholder: Parameters<typeof placeholder>[0];
     onCancel: () => void;
     onSubmit: () => void;
     onChange: () => void;
@@ -69,22 +69,22 @@ export type CreateCodemirrorParams = {
 export function createCodemirror(params: CreateCodemirrorParams) {
     const {
         doc,
-        placeholderText,
         reactRenderer,
         onCancel,
         onScroll,
         onSubmit,
         onChange,
         onDocChange,
-        extensions: extraExtensions,
         disabledExtensions = {},
         keymaps = [],
         receiver,
         yfmLangOptions,
+        extensions: extraExtensions,
+        placeholder: placeholderContent,
         autocompletion: autocompletionConfig,
     } = params;
 
-    const extensions: Extension[] = [gravityTheme, placeholder(placeholderText)];
+    const extensions: Extension[] = [gravityTheme, placeholder(placeholderContent)];
 
     if (!disabledExtensions.history) {
         extensions.push(history());