Fix editor loading

ts/editor/base.ts

@@ -33,6 +33,7 @@ declare global {
 }
 
 import { ModuleName } from "@tslib/i18n";
+import { mount } from "svelte";
 
 export const editorModules = [
     ModuleName.EDITING,
@@ -56,29 +57,17 @@ export { editorToolbar } from "./editor-toolbar";
 
 async function setupBrowserEditor(): Promise<void> {
     await setupI18n({ modules: editorModules });
-
+    mount(BrowserEditor, {target: document.body, props: { uiResolve }});
-    new BrowserEditor({
-        target: document.body,
-        props: { uiResolve },
-    });
 }
 
 async function setupNoteCreator(): Promise<void> {
     await setupI18n({ modules: editorModules });
-
+    mount(NoteCreator, {target: document.body, props: { uiResolve }});
-    new NoteCreator({
-        target: document.body,
-        props: { uiResolve },
-    });
 }
 
 async function setupReviewerEditor(): Promise<void> {
     await setupI18n({ modules: editorModules });
-
+    mount(ReviewerEditor, {target: document.body, props: { uiResolve }});
-    new ReviewerEditor({
-        target: document.body,
-        props: { uiResolve },
-    });
 }
 
 export function setupEditor(mode: "add" | "browse" | "review") {

ts/editor/rich-text-input/RichTextInput.svelte

@@ -66,7 +66,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     import { directionKey, fontFamilyKey, fontSizeKey } from "@tslib/context-keys";
     import { promiseWithResolver } from "@tslib/promise";
     import { singleCallback } from "@tslib/typing";
-    import { getAllContexts, getContext, onMount, tick } from "svelte";
+    import { getAllContexts, getContext, mount, onMount, tick } from "svelte";
     import type { Readable } from "svelte/store";
 
     import { placeCaretAfterContent } from "$lib/domlib/place-caret";
@@ -164,7 +164,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
         (async () => {
             await stylesDidLoad;
 
-            new ContentEditable({
+            mount(ContentEditable, {
                 target: element.shadowRoot!,
                 props: {
                     nodes,

ts/editor/rich-text-input/RichTextStyles.svelte

@@ -7,6 +7,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 
     import type { StyleLinkType, StyleObject } from "./CustomStyles.svelte";
     import CustomStyles from "./CustomStyles.svelte";
+    import { mount } from "svelte";
 
     export let callback: (styles: CustomStyles) => void;
 
@@ -51,11 +52,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     ];
 
     function attachToShadow(element: Element) {
-        const customStyles = new CustomStyles({
+        const customStyles = mount(CustomStyles, {
             target: element.shadowRoot as any,
             props: { styles },
         });
-
         customStyles.addStyleTag("userBase").then((styleTag) => {
             userBaseResolve(styleTag);
             callback(customStyles);