Hi, I have started to develop a plugin to create character sheets for a friend’s homebrew RPG system.
To do so, I had to use a lot of custom components but one I can’t handle myself is the markdown editor. And I cannot find a way to add one as a simple field in my view.
I currently use the MarkdownSourceView
class with a lot of workarounds to make it almost usable, but I’m wondering if there is a better way to add an markdown editor with only a HTMLElement
(and preferably no file as it’s not meant for files edition). I would really like to avoid using the view since I want to add more than one editor per view.
I tried to have a look at the code but most of the classes I could use are not exported.
The workarounds
In my component :
constructor(parent: HTMLElement, name: string, view: View)
{
super(parent, name);
[...]
this.view = view;
this.editor = new MarkdownSourceView(view);
this.editor.editorEl.parentElement.removeChild(this.editor.editorEl);
this.compElmt.appendChild(this.editor.editorEl);
this.compElmt.addEventListener("contextmenu", () => this.view.editor = this.editor.editor, { capture: true });
[...]
}
In my view :
editor: any;
requestSave() {}
triggerQuickPreview() {}
onMarkdownFold() {}
onMarkdownScroll() {}
I found I could use
const editor = app.embedRegistry.getEmbedCreator({ extension: "md" })({
app: this.app,
linktext: null,
sourcePath: null,
containerEl: this.compElmt,
displayMode: false,
showInline: false,
depth: 0
}, null);
editor.editable = true;
editor.showEditor();
but it don’t seems cleaner and I’m getting errors with files.