fix(mermaid): bring back auto resize on drag

src/public/app/widgets/type_widgets/abstract_split_type_widget.ts

@@ -43,7 +43,7 @@ const TPL = `\
  *
  * Features:
  *
- * - The two panes are resizeable via a split, on desktop.
+ * - The two panes are resizeable via a split, on desktop. The split can be optionally customized via {@link buildSplitExtraOptions}.
  */
 export default abstract class AbstractSplitTypeWidget extends TypeWidget {
 
@@ -95,10 +95,19 @@ export default abstract class AbstractSplitTypeWidget extends TypeWidget {
             sizes: [ 50, 50 ],
             direction: "horizontal",
             gutterSize: DEFAULT_GUTTER_SIZE,
-            // onDragEnd: () => this.zoomHandler?.()
+            ...this.buildSplitExtraOptions()
         });
     }
 
+    /**
+     * Called upon when the split between the preview and content pane is initialized. Can be used to add additional listeners if needed.
+     *
+     * @returns the additional split options.
+     */
+    buildSplitExtraOptions(): Split.Options {
+        return {};
+    }
+
     getData() {
         return this.editorTypeWidget.getData();
     }

src/public/app/widgets/type_widgets/abstract_svg_split_type_widget.ts

@@ -12,15 +12,27 @@ import AbstractSplitTypeWidget from "./abstract_split_type_widget.js";
 export default abstract class AbstractSvgSplitTypeWidget extends AbstractSplitTypeWidget {
 
     private $renderContainer!: JQuery<HTMLElement>;
-    private zoomHandler?: () => void;
+    private zoomHandler: () => void;
     private zoomInstance?: SvgPanZoom.Instance;
 
+    constructor() {
+        super();
+        this.zoomHandler = () => {
+            if (this.zoomInstance) {
+                this.zoomInstance.resize();
+                this.zoomInstance.fit();
+                this.zoomInstance.center();
+            }
+        }
+    }
+
     doRender(): void {
         super.doRender();
         this.$renderContainer = $(`<div>`)
             .addClass("render-container")
             .css("height", "100%");
         this.$preview.append(this.$renderContainer);
+        $(window).on("resize", this.zoomHandler);
     }
 
     async doRefresh(note: FNote | null | undefined) {
@@ -52,6 +64,7 @@ export default abstract class AbstractSvgSplitTypeWidget extends AbstractSplitTy
 
     cleanup(): void {
         this.#cleanUpZoom();
+        $(window).off("resize", this.zoomHandler);
         super.cleanup();
     }
 
@@ -102,13 +115,13 @@ export default abstract class AbstractSvgSplitTypeWidget extends AbstractSplitTy
             zoomInstance.fit();
         }
 
-        this.zoomHandler = () => {
-            zoomInstance.resize();
-            zoomInstance.fit();
-            zoomInstance.center();
-        };
         this.zoomInstance = zoomInstance;
-        $(window).on("resize", this.zoomHandler);
+    }
+
+    buildSplitExtraOptions(): Split.Options {
+        return {
+            onDragEnd: () => this.zoomHandler?.()
+        }
     }
 
     #cleanUpZoom() {