Merge pull request #2169 from zsviczian/2.7.2-casing

2.7.2 file and folder name casing + empty line before ## Text Elements

MathjaxToSVG/index.ts

@@ -1,64 +1,46 @@
-import { DataURL } from "@zsviczian/excalidraw/types/excalidraw/types";
 import {mathjax} from "mathjax-full/js/mathjax";
 import {TeX} from 'mathjax-full/js/input/tex.js';
 import {SVG} from 'mathjax-full/js/output/svg.js';
 import {LiteAdaptor, liteAdaptor} from 'mathjax-full/js/adaptors/liteAdaptor.js';
 import {RegisterHTMLHandler} from 'mathjax-full/js/handlers/html.js';
 import {AllPackages} from 'mathjax-full/js/input/tex/AllPackages.js';
+import { customAlphabet } from "nanoid";
 
-import ExcalidrawView from "./ExcalidrawView";
-import { FileData, MimeType } from "./EmbeddedFileLoader";
-import { FileId } from "@zsviczian/excalidraw/types/excalidraw/element/types";
-import { getImageSize, svgToBase64 } from "./utils/Utils";
-import { fileid } from "./constants/constants";
-import { TFile } from "obsidian";
-import { MathDocument } from "mathjax-full/js/core/MathDocument";
-
-export const updateEquation = async (
-  equation: string,
-  fileId: string,
-  view: ExcalidrawView,
-  addFiles: Function,
-) => {
-  const data = await tex2dataURL(equation);
-  if (data) {
-    const files: FileData[] = [];
-    files.push({
-      mimeType: data.mimeType,
-      id: fileId as FileId,
-      dataURL: data.dataURL,
-      created: data.created,
-      size: data.size,
-      hasSVGwithBitmap: false,
-      shouldScale: true,
-    });
-    addFiles(files, view);
-  }
-};
+type DataURL = string & { _brand: "DataURL" };
+type FileId = string & { _brand: "FileId" };
+const fileid = customAlphabet("1234567890abcdef", 40);
 
 let adaptor: LiteAdaptor;
-let html: MathDocument<any, any, any>;
+let html: any;
 let preamble: string;
 
-export const clearMathJaxVariables = () => {
-  adaptor = null;
-  html = null;
-  preamble = null;
-};
+function svgToBase64(svg: string): string {
+  const cleanSvg = svg.replaceAll("&nbsp;", " ");
+  
+  // Convert the string to UTF-8 and handle non-Latin1 characters
+  const encodedData = encodeURIComponent(cleanSvg)
+    .replace(/%([0-9A-F]{2})/g,
+      (match, p1) => String.fromCharCode(parseInt(p1, 16))
+    );
+    
+  return `data:image/svg+xml;base64,${btoa(encodedData)}`;
+}
 
-//https://github.com/xldenis/obsidian-latex/blob/master/main.ts
-const loadPreamble = async  () => {
-  const file = app.vault.getAbstractFileByPath("preamble.sty");
-  preamble = file && file instanceof TFile
-    ? await app.vault.read(file)
-    : null;
-};
+async function getImageSize(src: string): Promise<{ height: number; width: number }> {
+  return new Promise((resolve, reject) => {
+    const img = new Image();
+    img.onload = () => resolve({ height: img.naturalHeight, width: img.naturalWidth });
+    img.onerror = reject;
+    img.src = src;
+  });
+}
 
 export async function tex2dataURL(
   tex: string,
-  scale: number = 4 // Default scale value, adjust as needed
+  scale: number = 4,
+  app?: any
 ): Promise<{
-  mimeType: MimeType;
+  mimeType: string;
   fileId: FileId;
   dataURL: DataURL;
   created: number;
@@ -68,22 +50,26 @@ export async function tex2dataURL(
   let output: SVG<unknown, unknown, unknown>;
 
   if(!adaptor) {
-    await loadPreamble();
+    if (app) {
+      const file = app.vault.getAbstractFileByPath("preamble.sty");
+      preamble = file ? await app.vault.read(file) : null;
+    }
     adaptor = liteAdaptor();
     RegisterHTMLHandler(adaptor);
     input = new TeX({
       packages: AllPackages,
-      ...Boolean(preamble) ? {
+      ...(preamble ? {
         inlineMath: [['$', '$']],
         displayMath: [['$$', '$$']]
-      } : {},
+      } : {}),
     });
     output = new SVG({ fontCache: "local" });
     html = mathjax.document("", { InputJax: input, OutputJax: output });
   }
+
   try {
     const node = html.convert(
-      Boolean(preamble) ? `${preamble}${tex}` : tex,
+      preamble ? `${preamble}${tex}` : tex,
       { display: true, scale }
     );
     const svg = new DOMParser().parseFromString(adaptor.innerHTML(node), "image/svg+xml").firstChild as SVGSVGElement;
@@ -107,4 +93,10 @@ export async function tex2dataURL(
     console.error(e);
   }
   return null;
+}
+
+export function clearMathJaxVariables(): void {
+  adaptor = null;
+  html = null;
+  preamble = null;
 }

MathjaxToSVG/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@zsviczian/mathjax-to-svg",
+  "version": "1.0.0",
+  "main": "dist/index.js",
+  "scripts": {
+    "build": "cross-env NODE_ENV=production rollup --config rollup.config.js",
+    "dev": "cross-env NODE_ENV=development rollup --config rollup.config.js"
+  },
+  "dependencies": {
+    "mathjax-full": "^3.2.2",
+    "nanoid": "^4.0.2"
+  },
+  "devDependencies": {
+    "@rollup/plugin-commonjs": "^26.0.1",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@rollup/plugin-typescript": "^11.1.6",
+    "cross-env": "^7.0.3",
+    "obsidian": "1.5.7-1",
+    "rollup": "^2.70.1",
+    "typescript": "^5.2.2",
+    "rollup-plugin-terser": "^7.0.2"
+  }
+}

MathjaxToSVG/rollup.config.js

@@ -0,0 +1,35 @@
+import { nodeResolve } from '@rollup/plugin-node-resolve';
+import commonjs from '@rollup/plugin-commonjs';
+import typescript from '@rollup/plugin-typescript';
+import { terser } from 'rollup-plugin-terser';
+
+const isProd = (process.env.NODE_ENV === 'production');
+
+export default {
+  input: './index.ts',
+  output: {
+    dir: 'dist',
+    format: 'iife',
+    name: 'MathjaxToSVG', // Global variable name
+    exports: 'named',
+    sourcemap: !isProd,
+  },
+  plugins: [
+    typescript({
+      tsconfig: '../tsconfig.json',
+    }),
+    commonjs(),
+    nodeResolve({ 
+      browser: true,
+      preferBuiltins: false
+    }),
+    isProd && terser({
+      format: {
+        comments: false,
+      },
+      compress: {
+        passes: 2,
+      }
+    })
+  ].filter(Boolean)
+};

docs/API/ExcalidrawAutomate.d.ts

@@ -1,16 +1,16 @@
 /// <reference types="react" />
-import ExcalidrawPlugin from "src/main";
+import ExcalidrawPlugin from "src/core/main";
 import { FillStyle, StrokeStyle, ExcalidrawElement, ExcalidrawBindableElement, FileId, NonDeletedExcalidrawElement, ExcalidrawImageElement, StrokeRoundness, RoundnessType } from "@zsviczian/excalidraw/types/excalidraw/element/types";
 import { Editor, OpenViewState, TFile, WorkspaceLeaf } from "obsidian";
 import * as obsidian_module from "obsidian";
-import ExcalidrawView, { ExportSettings } from "src/ExcalidrawView";
+import ExcalidrawView, { ExportSettings } from "src/view/ExcalidrawView";
 import { AppState, BinaryFileData, DataURL, ExcalidrawImperativeAPI, Point } from "@zsviczian/excalidraw/types/excalidraw/types";
 import { EmbeddedFilesLoader } from "src/EmbeddedFileLoader";
 import { ConnectionPoint, DeviceType } from "src/types/types";
 import { ColorMaster } from "colormaster";
 import { TInput } from "colormaster/types";
 import { ClipboardData } from "@zsviczian/excalidraw/types/excalidraw/clipboard";
-import { PaneTarget } from "src/utils/ModifierkeyHelper";
+import { PaneTarget } from "src/utils/modifierkeyHelper";
 export declare class ExcalidrawAutomate {
     /**
      * Utility function that returns the Obsidian Module object.

docs/API/attributes_functions_overview.md

@@ -17,7 +17,7 @@ import { ConnectionPoint, DeviceType } from "src/types";
 import { ColorMaster } from "colormaster";
 import { TInput } from "colormaster/types";
 import { ClipboardData } from "@zsviczian/excalidraw/types/clipboard";
-import { PaneTarget } from "src/utils/ModifierkeyHelper";
+import { PaneTarget } from "src/utils/modifierkeyHelper";
 export declare class ExcalidrawAutomate {
     /**
      * Utility function that returns the Obsidian Module object.

ea-scripts/Image Occlusion.svg

@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+  <!-- Blue star background -->
+  <path
+    d="M50 5 L61 40 L98 40 L68 62 L79 95 L50 75 L21 95 L32 62 L2 40 L39 40 Z"
+    fill="#4a9eff"
+    stroke="#1e1e1e"
+    stroke-width="2"
+  />
+  <!-- White "A" text -->
+  <text
+    x="50"
+    y="65"
+    font-family="Arial"
+    font-size="40"
+    fill="white"
+    text-anchor="middle"
+    dominant-baseline="middle"
+  >A</text>
+</svg>

ea-scripts/index-new.md

@@ -130,6 +130,7 @@ I would love to include your contribution in the script library. If you have a s
 |<div><img src="https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Select%20Similar%20Elements.svg"/></div>|[[#Select Similar Elements]]|
 |<div><img src="https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Slideshow.svg"/></div>|[[#Slideshow]]|
 |<div><img src="https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Split%20Ellipse.svg"/></div>|[[#Split Ellipse]]|
+|<div><img src="https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Image%20Occlusion.svg"/></div>|[[#Image Occlusion]]|
 
 ## Collaboration and Export
 **Keywords**: Sharing, Teamwork, Exporting, Distribution, Cooperative, Publish
@@ -154,6 +155,7 @@ I would love to include your contribution in the script library. If you have a s
 |----|-----|
 |<div><img src="https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Crop%20Vintage%20Mask.svg"/></div>|[[#Crop Vintage Mask]]|
 
+
 ---
 
 # Description and Installation
@@ -267,6 +269,8 @@ https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea
 ```
 <table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Crop%20Vintage%20Mask.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Adds a rounded mask to the image by adding a full cover black mask and a rounded rectangle white mask. The script is also useful for adding just a black mask. In this case, run the script, then delete the white mask and add your custom white mask.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-crop-vintage.jpg'></td></tr></table>
 
+
+
 ## Custom Zoom
 ```excalidraw-script-install
 https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Custom%20Zoom.md
@@ -395,6 +399,12 @@ https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea
 ```
 <table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/GPT-Draw-a-UI.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script was discontinued in favor of ExcaliAI. Draw a UI and let GPT create the code for you.<br><iframe width="400" height="225" src="https://www.youtube.com/embed/y3kHl_6Ll4w" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-draw-a-ui.jpg'></td></tr></table>
 
+## Image Occlusion
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Image%20Occlusion.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/TrillStones'>@TrillStones</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Image%20Occlusion.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">An Excalidraw script for creating Anki image occlusion cards in Obsidian, similar to Anki's Image Occlusion Enhanced add-on but integrated into your Obsidian workflow.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-image-occlusion.png'></td></tr></table>
+
 ## Invert colors
 ```excalidraw-script-install
 https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Invert%20colors.md

manifest-beta.json

@@ -1,7 +1,7 @@
 {
 	"id": "obsidian-excalidraw-plugin",
 	"name": "Excalidraw",
-	"version": "2.6.3-beta-1",
+	"version": "2.7.1",
 	"minAppVersion": "1.1.6",
 	"description": "An Obsidian plugin to edit and view Excalidraw drawings",
 	"author": "Zsolt Viczian",

manifest.json

@@ -1,7 +1,7 @@
 {
   "id": "obsidian-excalidraw-plugin",
   "name": "Excalidraw",
-  "version": "2.6.2",
+  "version": "2.7.1",
   "minAppVersion": "1.1.6",
   "description": "An Obsidian plugin to edit and view Excalidraw drawings",
   "author": "Zsolt Viczian",

package.json

@@ -8,18 +8,23 @@
     "lib/**/*"
   ],
   "scripts": {
-    "dev": "cross-env NODE_ENV=development rollup --config rollup.config.js -w",
+    "dev": "cross-env NODE_ENV=development rollup --config rollup.config.js",
     "build": "cross-env NODE_ENV=production rollup --config rollup.config.js",
     "lib": "cross-env NODE_ENV=lib rollup --config rollup.config.js",
     "code:fix": "eslint --max-warnings=0 --ext .ts,.tsx ./src --fix",
-    "madge": "madge --circular ."
+    "madge": "madge --circular .",
+    "build:mathjax": "cd MathjaxToSVG && npm run build",
+    "build:all": "npm run build:mathjax && npm run build",
+    "dev:mathjax": "cd MathjaxToSVG && npm run dev",
+    "dev:all": "npm run dev:mathjax && npm run dev",
+    "build:lang": "node ./scripts/compressLanguages.js"
   },
   "keywords": [],
   "author": "",
   "license": "MIT",
   "dependencies": {
     "@popperjs/core": "^2.11.8",
-    "@zsviczian/excalidraw": "0.17.6-9",
+    "@zsviczian/excalidraw": "0.17.6-22",
     "chroma-js": "^2.4.2",
     "clsx": "^2.0.0",
     "@zsviczian/colormaster": "^1.2.2",
@@ -38,6 +43,7 @@
     "es6-promise-pool": "2.5.0"
   },
   "devDependencies": {
+    "jsesc": "^3.0.2",
     "@babel/core": "^7.22.9",
     "@babel/preset-env": "^7.22.10",
     "@babel/preset-react": "^7.22.5",
@@ -67,7 +73,7 @@
     "eslint-config-prettier": "^9.0.0",
     "eslint-plugin-prettier": "^5.0.0",
     "lz-string": "^1.5.0",
-    "obsidian": "1.5.7-1",
+    "obsidian": "^1.7.2",
     "prettier": "^3.0.1",
     "rollup": "^2.70.1",
     "rollup-plugin-copy": "^3.5.0",
@@ -76,7 +82,9 @@
     "rollup-plugin-typescript2": "^0.34.1",
     "tslib": "^2.6.1",
     "ttypescript": "^1.5.15",
-    "typescript": "^5.2.2"
+    "typescript": "^5.2.2",
+    "fs-extra": "^11.2.0",
+    "uglify-js": "^3.19.3"
   },
   "resolutions": {
     "@typescript-eslint/typescript-estree": "5.3.0"

rollup.config.js

@@ -9,6 +9,7 @@ import LZString from 'lz-string';
 import postprocess from '@zsviczian/rollup-plugin-postprocess';
 import cssnano from 'cssnano';
 import jsesc from 'jsesc';
+import { minify } from 'uglify-js';
 
 // Load environment variables
 import dotenv from 'dotenv';
@@ -19,15 +20,50 @@ const isProd = (process.env.NODE_ENV === "production");
 const isLib = (process.env.NODE_ENV === "lib");
 console.log(`Running: ${process.env.NODE_ENV}; isProd: ${isProd}; isLib: ${isLib}`);
 
-const excalidraw_pkg = isLib ? "" : isProd
+const mathjaxtosvg_pkg = isLib ? "" : fs.readFileSync("./MathjaxToSVG/dist/index.js", "utf8");
+
+const LANGUAGES = ['ru', 'zh-cn']; //english is not compressed as it is always loaded by default
+
+function trimLastSemicolon(input) {
+  if (input.endsWith(";")) {
+    return input.slice(0, -1);
+  }
+  return input;
+}
+
+function minifyCode(code) {
+  const minified = minify(code,{
+    compress: true,
+    mangle: true,
+    output: {
+      comments: false,
+      beautify: false,
+    },
+  });
+
+  if (minified.error) {
+    throw new Error(minified.error);
+  }
+  return minified.code;
+}
+
+function compressLanguageFile(lang) {
+  const inputDir = "./src/lang/locale";
+  const filePath = `${inputDir}/${lang}.ts`;
+  let content = fs.readFileSync(filePath, "utf-8");
+  content = trimLastSemicolon(content.split("export default")[1].trim());
+  return LZString.compressToBase64(minifyCode(`x = ${content};`));
+}
+
+const excalidraw_pkg = isLib ? "" : minifyCode( isProd
   ? fs.readFileSync("./node_modules/@zsviczian/excalidraw/dist/excalidraw.production.min.js", "utf8")
-  : fs.readFileSync("./node_modules/@zsviczian/excalidraw/dist/excalidraw.development.js", "utf8");
-const react_pkg = isLib ? "" : isProd
+  : fs.readFileSync("./node_modules/@zsviczian/excalidraw/dist/excalidraw.development.js", "utf8"));
+const react_pkg = isLib ? "" : minifyCode(isProd
   ? fs.readFileSync("./node_modules/react/umd/react.production.min.js", "utf8")
-  : fs.readFileSync("./node_modules/react/umd/react.development.js", "utf8");
-const reactdom_pkg = isLib ? "" : isProd
+  : fs.readFileSync("./node_modules/react/umd/react.development.js", "utf8"));
+const reactdom_pkg = isLib ? "" : minifyCode(isProd
   ? fs.readFileSync("./node_modules/react-dom/umd/react-dom.production.min.js", "utf8")
-  : fs.readFileSync("./node_modules/react-dom/umd/react-dom.development.js", "utf8");
+  : fs.readFileSync("./node_modules/react-dom/umd/react-dom.development.js", "utf8"));
 
 const lzstring_pkg = isLib ? "" : fs.readFileSync("./node_modules/lz-string/libs/lz-string.min.js", "utf8");
 if (!isLib) {
@@ -48,21 +84,25 @@ if (!isLib) {
 
 const manifestStr = isLib ? "" : fs.readFileSync("manifest.json", "utf-8");
 const manifest = isLib ? {} : JSON.parse(manifestStr);
-if (!isLib) console.log(manifest.version);
+if (!isLib) {
+  console.log(manifest.version);
+}
 
 const packageString = isLib
   ? ""
-  : ';' + lzstring_pkg +
+  : ';const INITIAL_TIMESTAMP=Date.now();' + lzstring_pkg +
   '\nlet REACT_PACKAGES = `' +
   jsesc(react_pkg + reactdom_pkg, { quotes: 'backtick' }) +
   '`;\n' +
-  'let EXCALIDRAW_PACKAGE = ""; const unpackExcalidraw = () => {EXCALIDRAW_PACKAGE = LZString.decompressFromBase64("' + LZString.compressToBase64(excalidraw_pkg) + '");};\n' +
-  'let {react, reactDOM } = window.eval.call(window, `(function() {' + '${REACT_PACKAGES};' + 'return {react: React, reactDOM: ReactDOM};})();`);\n' +
-  `let excalidrawLib = {};\n` +
-  'let PLUGIN_VERSION="' + manifest.version + '";';
+  'const unpackExcalidraw = () => LZString.decompressFromBase64("' + LZString.compressToBase64(excalidraw_pkg) + '");\n' +
+  'let {react, reactDOM } = new Function(`${REACT_PACKAGES}; return {react: React, reactDOM: ReactDOM};`)();\n' +
+  'let excalidrawLib = {};\n' +
+  'const loadMathjaxToSVG = () => new Function(`${LZString.decompressFromBase64("' + LZString.compressToBase64(mathjaxtosvg_pkg) + '")}; return MathjaxToSVG;`)();\n' +
+  `const PLUGIN_LANGUAGES = {${LANGUAGES.map(lang => `"${lang}": "${compressLanguageFile(lang)}"`).join(",")}};\n` +
+  'const PLUGIN_VERSION="' + manifest.version + '";';
 
 const BASE_CONFIG = {
-  input: 'src/main.ts',
+  input: 'src/core/main.ts',
   external: [
     '@codemirror/autocomplete',
     '@codemirror/collab',
@@ -101,7 +141,12 @@ const BUILD_CONFIG = {
     exports: 'default',
   },
   plugins: getRollupPlugins(
-    {tsconfig: isProd ? "tsconfig.json" : "tsconfig.dev.json"},
+    {
+      tsconfig: isProd ? "tsconfig.json" : "tsconfig.dev.json",
+      sourcemap: !isProd,
+      clean: true,
+      verbosity: isProd ? 1 : 2,
+    },
     ...(isProd ? [
       terser({
         toplevel: false,
@@ -126,10 +171,10 @@ const BUILD_CONFIG = {
 
 const LIB_CONFIG = {
   ...BASE_CONFIG,
-  input: "src/index.ts",
+  input: "src/core/index.ts",
   output: {
     dir: "lib",
-    sourcemap: true,
+    sourcemap: false,
     format: "cjs",
     name: "Excalidraw (Library)",
   },

src/OneOffs.ts

@@ -1,368 +0,0 @@
-import ExcalidrawPlugin from "./main";
-
-export class OneOffs {
-  private plugin: ExcalidrawPlugin;
-
-  constructor(plugin: ExcalidrawPlugin) {
-    this.plugin = plugin;
-  }
-
-  /*
-  public patchCommentBlock() {
-    //This is a once off cleanup process to remediate incorrectly placed comment %% before # Text Elements
-    if (!this.plugin.settings.patchCommentBlock) {
-      return;
-    }
-    const plugin = this.plugin;
-
-    log(
-      `${window
-        .moment()
-        .format("HH:mm:ss")}: Excalidraw will patch drawings in 5 minutes`,
-    );
-    setTimeout(async () => {
-      await plugin.loadSettings();
-      if (!plugin.settings.patchCommentBlock) {
-        log(
-          `${window
-            .moment()
-            .format(
-              "HH:mm:ss",
-            )}: Excalidraw patching aborted because synched data.json is already patched`,
-        );
-        return;
-      }
-      log(
-        `${window
-          .moment()
-          .format("HH:mm:ss")}: Excalidraw is starting the patching process`,
-      );
-      let i = 0;
-      const excalidrawFiles = plugin.app.vault.getFiles();
-      for (const f of (excalidrawFiles || []).filter((f: TFile) =>
-        plugin.isExcalidrawFile(f),
-      )) {
-        if (
-          f.extension !== "excalidraw" && //legacy files do not need to be touched
-          plugin.app.workspace.getActiveFile() !== f
-        ) {
-          //file is currently being edited
-          let drawing = await plugin.app.vault.read(f);
-          const orig_drawing = drawing;
-          drawing = drawing.replaceAll("\r\n", "\n").replaceAll("\r", "\n"); //Win, Mac, Linux compatibility
-          drawing = drawing.replace(
-            "\n%%\n# Text Elements\n",
-            "\n# Text Elements\n",
-          );
-          if (drawing.search("\n%%\n# Drawing\n") === -1) {
-            const sceneJSONandPOS = getJSON(drawing);
-            drawing = `${drawing.substr(
-              0,
-              sceneJSONandPOS.pos,
-            )}\n%%\n# Drawing\n\`\`\`json\n${sceneJSONandPOS.scene}\n\`\`\`%%`;
-          }
-          if (drawing !== orig_drawing) {
-            i++;
-            log(`Excalidraw patched: ${f.path}`);
-            await plugin.app.vault.modify(f, drawing);
-          }
-        }
-      }
-      plugin.settings.patchCommentBlock = false;
-      plugin.saveSettings();
-      log(
-        `${window
-          .moment()
-          .format("HH:mm:ss")}: Excalidraw patched in total ${i} files`,
-      );
-    }, 300000); //5 minutes
-  }
-
-  public migrationNotice() {
-    if (this.plugin.settings.loadCount > 0) {
-      return;
-    }
-    const plugin = this.plugin;
-
-    plugin.app.workspace.onLayoutReady(async () => {
-      plugin.settings.loadCount++;
-      plugin.saveSettings();
-      const files = plugin.app.vault
-        .getFiles()
-        .filter((f) => f.extension === "excalidraw");
-      if (files.length > 0) {
-        const prompt = new MigrationPrompt(plugin.app, plugin);
-        prompt.open();
-      }
-    });
-  }
-
-  public imageElementLaunchNotice() {
-    if (!this.plugin.settings.imageElementNotice) {
-      return;
-    }
-    const plugin = this.plugin;
-
-    plugin.app.workspace.onLayoutReady(async () => {
-      const prompt = new ImageElementNotice(plugin.app, plugin);
-      prompt.open();
-    });
-  }
-
-  public wysiwygPatch() {
-    if (this.plugin.settings.patchCommentBlock) {
-      return;
-    } //the comment block patch needs to happen first (unlikely that someone has waited this long with the update...)
-    //This is a once off process to patch excalidraw files remediate incorrectly placed comment %% before # Text Elements
-    if (
-      !(
-        this.plugin.settings.runWYSIWYGpatch ||
-        this.plugin.settings.fixInfinitePreviewLoop
-      )
-    ) {
-      return;
-    }
-    const plugin = this.plugin;
-
-    log(
-      `${window
-        .moment()
-        .format(
-          "HH:mm:ss",
-        )}: Excalidraw will patch drawings to support WYSIWYG in 7 minutes`,
-    );
-    setTimeout(async () => {
-      await plugin.loadSettings();
-      if (
-        !(
-          this.plugin.settings.runWYSIWYGpatch ||
-          this.plugin.settings.fixInfinitePreviewLoop
-        )
-      ) {
-        log(
-          `${window
-            .moment()
-            .format(
-              "HH:mm:ss",
-            )}: Excalidraw patching aborted because synched data.json is already patched`,
-        );
-        return;
-      }
-      log(
-        `${window
-          .moment()
-          .format("HH:mm:ss")}: Excalidraw is starting the patching process`,
-      );
-      let i = 0;
-      const excalidrawFiles = plugin.app.vault.getFiles();
-      for (const f of (excalidrawFiles || []).filter((f: TFile) =>
-        plugin.isExcalidrawFile(f),
-      )) {
-        if (
-          f.extension !== "excalidraw" && //legacy files do not need to be touched
-          plugin.app.workspace.getActiveFile() !== f
-        ) {
-          //file is currently being edited
-          try {
-            const excalidrawData = new ExcalidrawData(plugin);
-            const data = await plugin.app.vault.read(f);
-            const textMode = getTextMode(data);
-            await excalidrawData.loadData(data, f, textMode);
-
-            let trimLocation = data.search(/(^%%\n)?# Text Elements\n/m);
-            if (trimLocation == -1) {
-              trimLocation = data.search(/(%%\n)?# Drawing\n/);
-            }
-            if (trimLocation > -1) {
-              let header = data
-                .substring(0, trimLocation)
-                .replace(
-                  /excalidraw-plugin:\s.*\n/,
-                  `${FRONTMATTER_KEY}: ${
-                    textMode == TextMode.raw ? "raw\n" : "parsed\n"
-                  }`,
-                );
-
-              header = header.replace(
-                /cssclass:[\s]*excalidraw-hide-preview-text[\s]*\n/,
-                "",
-              );
-
-              const REG_IMG = /(^---[\w\W]*?---\n)(!\[\[.*?]]\n(%%\n)?)/m; //(%%\n)? because of 1.4.8-beta... to be backward compatible with anyone who installed that version
-              if (header.match(REG_IMG)) {
-                header = header.replace(REG_IMG, "$1");
-              }
-              const newData = header + excalidrawData.generateMD();
-
-              if (data !== newData) {
-                i++;
-                log(`Excalidraw patched: ${f.path}`);
-                await plugin.app.vault.modify(f, newData);
-              }
-            }
-          } catch (e) {
-            errorlog({
-              where: "OneOffs.wysiwygPatch",
-              message: `Unable to process: ${f.path}`,
-              error: e,
-            });
-          }
-        }
-      }
-      plugin.settings.runWYSIWYGpatch = false;
-      plugin.settings.fixInfinitePreviewLoop = false;
-      plugin.saveSettings();
-      log(
-        `${window
-          .moment()
-          .format("HH:mm:ss")}: Excalidraw patched in total ${i} files`,
-      );
-    }, 420000); //7 minutes
-  }
-}
-
-class MigrationPrompt extends Modal {
-  private plugin: ExcalidrawPlugin;
-
-  constructor(app: App, plugin: ExcalidrawPlugin) {
-    super(app);
-    this.plugin = plugin;
-  }
-
-  onOpen(): void {
-    this.titleEl.setText("Welcome to Excalidraw 1.2");
-    this.createForm();
-  }
-
-  onClose(): void {
-    this.contentEl.empty();
-  }
-
-  createForm(): void {
-    const div = this.contentEl.createDiv();
-    //    div.addClass("excalidraw-prompt-div");
-    //    div.style.maxWidth = "600px";
-    div.createEl("p", {
-      text: "This version comes with tons of new features and possibilities. Please read the description in Community Plugins to find out more.",
-    });
-    div.createEl("p", { text: "" }, (el) => {
-      el.innerHTML =
-        "Drawings you've created with version 1.1.x need to be converted to take advantage of the new features. You can also continue to use them in compatibility mode. " +
-        "During conversion your old *.excalidraw files will be replaced with new *.excalidraw.md files.";
-    });
-    div.createEl("p", { text: "" }, (el) => {
-      //files manually follow one of two options:
-      el.innerHTML =
-        "To convert your drawings you have the following options:<br><ul>" +
-        "<li>Click <code>CONVERT FILES</code> now to convert all of your *.excalidraw files, or if you prefer to make a backup first, then click <code>CANCEL</code>.</li>" +
-        "<li>In the Command Palette select <code>Excalidraw: Convert *.excalidraw files to *.excalidraw.md files</code></li>" +
-        "<li>Right click an <code>*.excalidraw</code> file in File Explorer and select one of the following options to convert files one by one: <ul>" +
-        "<li><code>*.excalidraw => *.excalidraw.md</code></li>" +
-        "<li><code>*.excalidraw => *.md (Logseq compatibility)</code>. This option will retain the original *.excalidraw file next to the new Obsidian format. " +
-        "Make sure you also enable <code>Compatibility features</code> in Settings for a full solution.</li></ul></li>" +
-        "<li>Open a drawing in compatibility mode and select <code>Convert to new format</code> from the <code>Options Menu</code></li></ul>";
-    });
-    div.createEl("p", {
-      text: "This message will only appear maximum 3 times in case you have *.excalidraw files in your Vault.",
-    });
-    const bConvert = div.createEl("button", { text: "CONVERT FILES" });
-    bConvert.onclick = () => {
-      this.plugin.convertExcalidrawToMD();
-      this.close();
-    };
-    const bCancel = div.createEl("button", { text: "CANCEL" });
-    bCancel.onclick = () => {
-      this.close();
-    };
-  }
-}
-
-class ImageElementNotice extends Modal {
-  private plugin: ExcalidrawPlugin;
-  private saveChanges: boolean = false;
-
-  constructor(app: App, plugin: ExcalidrawPlugin) {
-    super(app);
-    this.plugin = plugin;
-  }
-
-  onOpen(): void {
-    this.titleEl.setText("Image Elements have arrived!");
-    this.createForm();
-  }
-
-  async onClose() {
-    this.contentEl.empty();
-    if (!this.saveChanges) {
-      return;
-    }
-    await this.plugin.loadSettings();
-    this.plugin.settings.imageElementNotice = false;
-    this.plugin.saveSettings();
-  }
-
-  createForm(): void {
-    const div = this.contentEl.createDiv();
-    //div.addClass("excalidraw-prompt-div");
-    //div.style.maxWidth = "600px";
-
-    div.createEl("p", { text: "" }, (el) => {
-      el.innerHTML =
-        "Welcome to Obsidian-Excalidraw 1.4! I've added Image Elements. " +
-        "Please watch the video below to learn how to use this new feature.";
-    });
-
-    div.createEl("p", { text: "" }, (el) => {
-      el.innerHTML =
-        "<u>⚠ WARNING:</u> Opening new drawings with an older version of the plugin will lead to loss of images. " +
-        "Update the plugin on all your devices.";
-    });
-
-    div.createEl("p", { text: "" }, (el) => {
-      el.innerHTML =
-        "Since March, I have spent most of my free time building this plugin. Close to 75 workdays worth of my time (assuming 8-hour days).  " +
-        "Some of you have already bought me a coffee. THANK YOU! Your support really means a lot to me! If you have not yet done so, please consider clicking the button below.";
-    });
-
-    const coffeeDiv = div.createDiv("coffee");
-    coffeeDiv.addClass("ex-coffee-div");
-    const coffeeLink = coffeeDiv.createEl("a", {
-      href: "https://ko-fi.com/zsolt",
-    });
-    const coffeeImg = coffeeLink.createEl("img", {
-      attr: {
-        src: "https://cdn.ko-fi.com/cdn/kofi3.png?v=3",
-      },
-    });
-    coffeeImg.height = 45;
-
-    div.createEl("p", { text: "" }, (el) => {
-      //files manually follow one of two options:
-      el.style.textAlign = "center";
-      el.innerHTML =
-        '<iframe width="560" height="315" src="https://www.youtube.com/embed/_c_0zpBJ4Xc?start=20" title="YouTube video player" ' +
-        'frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" ' +
-        "allowfullscreen></iframe>";
-    });
-
-    div.createEl("p", { text: "" }, (el) => {
-      //files manually follow one of two options:
-      el.style.textAlign = "right";
-
-      const bOk = el.createEl("button", { text: "OK - Don't show this again" });
-      bOk.onclick = () => {
-        this.saveChanges = true;
-        this.close();
-      };
-
-      const bCancel = el.createEl("button", {
-        text: "CANCEL - Read next time",
-      });
-      bCancel.onclick = () => {
-        this.saveChanges = false;
-        this.close();
-      };
-    });
-  }
-  */
-}

src/constants/actionIcons.tsx

@@ -1,6 +1,6 @@
 import { Copy, Crop, Globe, RotateCcw, Scan, Settings, TextSelect } from "lucide-react";
 import * as React from "react";
-import { PenStyle } from "src/PenTypes";
+import { PenStyle } from "src/types/penTypes";
 
 export const ICONS = {
   ExportImage: (

src/constants/constants.ts

@@ -1,8 +1,8 @@
 import { customAlphabet } from "nanoid";
-import { DeviceType } from "../types/types";
-import { ExcalidrawLib } from "../ExcalidrawLib";
+import { ExcalidrawLib } from "../types/excalidrawLib";
 import { moment } from "obsidian";
-import ExcalidrawPlugin from "src/main";
+import ExcalidrawPlugin from "src/core/main";
+import { DeviceType } from "src/types/types";
 //This is only for backward compatibility because an early version of obsidian included an encoding to avoid fantom links from littering Obsidian graph view
 declare const PLUGIN_VERSION:string;
 export let EXCALIDRAW_PLUGIN: ExcalidrawPlugin = null;
@@ -27,6 +27,7 @@ export const ERROR_IFRAME_CONVERSION_CANCELED = "iframe conversion canceled";
 declare const excalidrawLib: typeof ExcalidrawLib;
 
 export const LOCALE = moment.locale();
+export const CJK_FONTS = "CJK Fonts";
 
 export const obsidianToExcalidrawMap: { [key: string]: string } = {
   'en': 'en-US',
@@ -104,6 +105,7 @@ export let {
   refreshTextDimensions,
   getCSSFontDefinition,
   loadSceneFonts,
+  loadMermaid,
 } = excalidrawLib;
 
 export function updateExcalidrawLib() {
@@ -129,6 +131,7 @@ export function updateExcalidrawLib() {
     refreshTextDimensions,
     getCSSFontDefinition,
     loadSceneFonts,
+    loadMermaid,
   } = excalidrawLib);
 }
 
@@ -152,7 +155,12 @@ export const DEVICE: DeviceType = {
   isAndroid: document.body.hasClass("is-android"),
 };
 
-export const ROOTELEMENTSIZE = (() => {
+export let ROOTELEMENTSIZE: number = 16;
+export function setRootElementSize(size?:number) {
+  if(size) {
+    ROOTELEMENTSIZE = size;
+    return;
+  }
   const tempElement = document.createElement('div');
   tempElement.style.fontSize = '1rem';
   tempElement.style.display = 'none'; // Hide the element
@@ -161,7 +169,7 @@ export const ROOTELEMENTSIZE = (() => {
   const pixelSize = parseFloat(computedStyle.fontSize);
   document.body.removeChild(tempElement);
   return pixelSize;
-})();
+};
 
 export const nanoid = customAlphabet(
   "1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ",
@@ -195,6 +203,10 @@ export const ANIMATED_IMAGE_TYPES = ["gif", "webp", "apng", "svg"];
 export const EXPORT_TYPES = ["svg", "dark.svg", "light.svg", "png", "dark.png", "light.png"];
 export const MAX_IMAGE_SIZE = 500;
 
+export const VIDEO_TYPES = ["mp4", "webm", "ogv", "mov", "mkv"];
+export const AUDIO_TYPES = ["mp3", "wav", "m4a", "3gp", "flac", "ogg", "oga", "opus"];
+export const CODE_TYPES = ["json", "css", "js"];
+
 export const FRONTMATTER_KEYS:{[key:string]: {name: string, type: string, depricated?:boolean}} = {
   "plugin": {name: "excalidraw-plugin", type: "text"},
   "export-transparent": {name: "excalidraw-export-transparent", type: "checkbox"},
@@ -222,6 +234,7 @@ export const FRONTMATTER_KEYS:{[key:string]: {name: string, type: string, depric
 
 export const EMBEDDABLE_THEME_FRONTMATTER_VALUES = ["light", "dark", "auto", "dafault"];
 export const VIEW_TYPE_EXCALIDRAW = "excalidraw";
+export const VIEW_TYPE_EXCALIDRAW_LOADING = "excalidraw-loading";
 export const ICON_NAME = "excalidraw-icon";
 export const MAX_COLORS = 5;
 export const COLOR_FREQ = 6;

src/core/editor/EditorHandler.ts

@@ -1,6 +1,7 @@
 import { Extension } from "@codemirror/state";
-import ExcalidrawPlugin from "src/main";
+import ExcalidrawPlugin from "src/core/main";
 import { HideTextBetweenCommentsExtension } from "./Fadeout";
+import { debug, DEBUGGING } from "src/utils/debugHelper";
 export const EDITOR_FADEOUT = "fadeOutExcalidrawMarkup";
 
 const editorExtensions: {[key:string]:Extension}= {
@@ -10,13 +11,16 @@ const editorExtensions: {[key:string]:Extension}= {
 export class EditorHandler {
   private activeEditorExtensions: Extension[] = [];
 
-  constructor(private plugin: ExcalidrawPlugin) {}
+  constructor(private plugin: ExcalidrawPlugin) {
+    (process.env.NODE_ENV === 'development') && DEBUGGING && debug(EditorHandler, `ExcalidrawPlugin.construct EditorHandler`);
+  }
 
   destroy(): void {
     this.plugin = null;
   }
 
   setup(): void {
+    (process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.setup, `ExcalidrawPlugin.construct EditorHandler.setup`);
     this.plugin.registerEditorExtension(this.activeEditorExtensions);
     this.updateCMExtensionState(EDITOR_FADEOUT, this.plugin.settings.fadeOutExcalidrawMarkup);
   }

src/core/index.ts

@@ -1,14 +1,14 @@
-import "obsidian";
-//import { ExcalidrawAutomate } from "./ExcalidrawAutomate";
-//export ExcalidrawAutomate from "./ExcalidrawAutomate";
-//export {ExcalidrawAutomate} from  "./ExcaildrawAutomate";
-export type { ExcalidrawBindableElement, ExcalidrawElement, FileId, FillStyle, StrokeRoundness, StrokeStyle } from "@zsviczian/excalidraw/types/excalidraw/element/types";
-export type { Point } from "src/types/types";
-export const getEA = (view?:any): any => {
-  try {
-    return window.ExcalidrawAutomate.getAPI(view);
-  } catch(e) {
-    console.log({message: "Excalidraw not available", fn: getEA});
-    return null;
-  }
+import "obsidian";
+//import { ExcalidrawAutomate } from "./ExcalidrawAutomate";
+//export ExcalidrawAutomate from "./ExcalidrawAutomate";
+//export {ExcalidrawAutomate} from  "./ExcaildrawAutomate";
+export type { ExcalidrawBindableElement, ExcalidrawElement, FileId, FillStyle, StrokeRoundness, StrokeStyle } from "@zsviczian/excalidraw/types/excalidraw/element/types";
+export type { Point } from "src/types/types";
+export const getEA = (view?:any): any => {
+  try {
+    return window.ExcalidrawAutomate.getAPI(view);
+  } catch(e) {
+    console.log({message: "Excalidraw not available", fn: getEA});
+    return null;
+  }
 }

src/core/managers/EventManager.ts

@@ -0,0 +1,340 @@
+import { WorkspaceLeaf, TFile, Editor, MarkdownView, MarkdownFileInfo, MetadataCache, App, EventRef, Menu, FileView } from "obsidian";
+import { ExcalidrawElement } from "@zsviczian/excalidraw/types/excalidraw/element/types";
+import { getLink } from "../../utils/fileUtils";
+import { editorInsertText, getParentOfClass, setExcalidrawView } from "../../utils/obsidianUtils";
+import ExcalidrawPlugin from "src/core/main";
+import { DEBUGGING, debug } from "src/utils/debugHelper";
+import { ExcalidrawAutomate } from "src/shared/ExcalidrawAutomate";
+import { DEVICE, FRONTMATTER_KEYS, ICON_NAME, VIEW_TYPE_EXCALIDRAW } from "src/constants/constants";
+import ExcalidrawView from "src/view/ExcalidrawView";
+import { t } from "src/lang/helpers";
+
+/**
+ * Registers event listeners for the plugin
+ * Must be constructed after the workspace is ready (onLayoutReady) 
+ * Intended to be called from onLayoutReady in onload()
+ */
+export class EventManager {
+  private plugin: ExcalidrawPlugin;
+  private app: App;
+  public leafChangeTimeout: number|null = null;
+  private removeEventLisnters:(()=>void)[] = []; //only used if I register an event directly, not via Obsidian's registerEvent
+  private previouslyActiveLeaf: WorkspaceLeaf;
+  private splitViewLeafSwitchTimestamp: number = 0;
+
+  get settings() {
+    return this.plugin.settings;
+  }
+
+  get ea():ExcalidrawAutomate {
+    return this.plugin.ea;
+  }
+
+  get activeExcalidrawView() {
+    return this.plugin.activeExcalidrawView;
+  }
+
+  set activeExcalidrawView(view: ExcalidrawView) {
+    this.plugin.activeExcalidrawView = view;
+  }
+
+  private registerEvent(eventRef: EventRef): void {
+    this.plugin.registerEvent(eventRef);
+  }
+  
+  constructor(plugin: ExcalidrawPlugin) {
+    this.plugin = plugin;
+    this.app = plugin.app;
+  }
+
+  destroy() {
+    if(this.leafChangeTimeout) {
+      window.clearTimeout(this.leafChangeTimeout);
+      this.leafChangeTimeout = null;
+    }
+    this.removeEventLisnters.forEach((removeEventListener) =>
+      removeEventListener(),
+    );
+    this.removeEventLisnters = [];
+  }
+
+  public async initialize() {
+    try {
+      await this.registerEvents();
+    } catch (e) {
+      console.error("Error registering event listeners", e);
+    }
+    this.plugin.logStartupEvent("Event listeners registered");
+  }
+
+  public isRecentSplitViewSwitch():boolean {
+    return (Date.now() - this.splitViewLeafSwitchTimestamp) < 3000;
+  }
+
+  public async registerEvents() {
+    await this.plugin.awaitInit();
+    this.registerEvent(this.app.workspace.on("editor-paste", this.onPasteHandler.bind(this)));
+    this.registerEvent(this.app.vault.on("rename", this.onRenameHandler.bind(this)));
+    this.registerEvent(this.app.vault.on("modify", this.onModifyHandler.bind(this)));
+    this.registerEvent(this.app.vault.on("delete", this.onDeleteHandler.bind(this)));
+
+    //save Excalidraw leaf and update embeds when switching to another leaf
+    this.registerEvent(this.plugin.app.workspace.on("active-leaf-change", this.onActiveLeafChangeHandler.bind(this)));
+
+    //File Save Trigger Handlers
+    //Save the drawing if the user clicks outside the Excalidraw Canvas
+    const onClickEventSaveActiveDrawing = this.onClickSaveActiveDrawing.bind(this);
+    this.app.workspace.containerEl.addEventListener("click", onClickEventSaveActiveDrawing);
+    this.removeEventLisnters.push(() => {
+      this.app.workspace.containerEl.removeEventListener("click", onClickEventSaveActiveDrawing)
+    });
+    this.registerEvent(this.app.workspace.on("file-menu", this.onFileMenuSaveActiveDrawing.bind(this)));
+
+    const metaCache: MetadataCache = this.app.metadataCache;
+    this.registerEvent(
+      metaCache.on("changed", (file, _, cache) =>
+        this.plugin.updateFileCache(file, cache?.frontmatter),
+      ),
+    );
+
+    this.registerEvent(this.app.workspace.on("file-menu", this.onFileMenuHandler.bind(this)));
+    this.plugin.registerEvent(this.plugin.app.workspace.on("editor-menu", this.onEditorMenuHandler.bind(this)));
+  }
+
+  private onPasteHandler (evt: ClipboardEvent, editor: Editor, info: MarkdownView | MarkdownFileInfo ) {
+    if(evt.defaultPrevented) return
+    const data = evt.clipboardData.getData("text/plain");
+    if (!data) return;
+    if (data.startsWith(`{"type":"excalidraw/clipboard"`)) {
+      evt.preventDefault();
+      try {
+        const drawing = JSON.parse(data);
+        const hasOneTextElement = drawing.elements.filter((el:ExcalidrawElement)=>el.type==="text").length === 1;
+        if (!(hasOneTextElement || drawing.elements?.length === 1)) {
+          return;
+        }
+        const element = hasOneTextElement
+          ? drawing.elements.filter((el:ExcalidrawElement)=>el.type==="text")[0]
+          : drawing.elements[0];
+        if (element.type === "image") {
+          const fileinfo = this.plugin.filesMaster.get(element.fileId);
+          if(fileinfo && fileinfo.path) {
+            let path = fileinfo.path;
+            const sourceFile = info.file;
+            const imageFile = this.app.vault.getAbstractFileByPath(path);
+            if(sourceFile && imageFile && imageFile instanceof TFile) {
+              path = this.app.metadataCache.fileToLinktext(imageFile,sourceFile.path);
+            }
+            editorInsertText(editor, getLink(this.plugin, {path}));
+          }
+          return;
+        }
+        if (element.type === "text") {
+          editorInsertText(editor, element.rawText);
+          return;
+        }
+        if (element.link) {
+          editorInsertText(editor, `${element.link}`);
+          return;
+        }
+      } catch (e) {
+      }
+    }
+  };
+
+  private onRenameHandler(file: TFile, oldPath: string) {
+    this.plugin.renameEventHandler(file, oldPath);
+  }
+
+  private onModifyHandler(file: TFile) {
+    this.plugin.modifyEventHandler(file);
+  }
+
+  private onDeleteHandler(file: TFile) {
+    this.plugin.deleteEventHandler(file);
+  }
+
+  public async onActiveLeafChangeHandler (leaf: WorkspaceLeaf) {
+    (process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onActiveLeafChangeHandler,`onActiveLeafChangeEventHandler`, leaf);
+    //https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/723
+
+    if (leaf.view && leaf.view.getViewType() === "pdf") {
+      this.plugin.lastPDFLeafID = leaf.id;
+    }
+
+    if(this.leafChangeTimeout) {
+      window.clearTimeout(this.leafChangeTimeout);
+    }
+    this.leafChangeTimeout = window.setTimeout(()=>{this.leafChangeTimeout = null;},1000);
+
+    if(this.settings.overrideObsidianFontSize) {
+      if(leaf.view && (leaf.view.getViewType() === VIEW_TYPE_EXCALIDRAW)) {
+        document.documentElement.style.fontSize = "";
+      } 
+    }
+
+    const previouslyActiveEV = this.activeExcalidrawView;
+    const newActiveviewEV: ExcalidrawView =
+      leaf.view instanceof ExcalidrawView ? leaf.view : null;
+    this.activeExcalidrawView = newActiveviewEV;
+    const previousFile = (this.previouslyActiveLeaf?.view as FileView)?.file;
+    const currentFile = (leaf?.view as FileView).file;
+    //editing the same file in a different leaf
+    if(currentFile && (previousFile === currentFile)) {
+      if((this.previouslyActiveLeaf.view instanceof MarkdownView   && leaf.view instanceof ExcalidrawView)) {
+        this.splitViewLeafSwitchTimestamp = Date.now();
+      }
+    }
+    this.previouslyActiveLeaf = leaf;
+    
+    if (newActiveviewEV) {
+      this.plugin.addModalContainerObserver();
+      this.plugin.lastActiveExcalidrawFilePath = newActiveviewEV.file?.path;
+    } else {
+      this.plugin.removeModalContainerObserver();
+    }
+
+    //!Temporary hack
+    //https://discord.com/channels/686053708261228577/817515900349448202/1031101635784613968
+    if (DEVICE.isMobile && newActiveviewEV && !previouslyActiveEV) {
+      const navbar = document.querySelector("body>.app-container>.mobile-navbar");
+      if(navbar && navbar instanceof HTMLDivElement) {
+        navbar.style.position="relative";
+      }
+    }
+
+    if (DEVICE.isMobile && !newActiveviewEV && previouslyActiveEV) {
+      const navbar = document.querySelector("body>.app-container>.mobile-navbar");
+      if(navbar && navbar instanceof HTMLDivElement) {
+        navbar.style.position="";
+      }
+    }
+
+    //----------------------
+    //----------------------
+
+    if (previouslyActiveEV && previouslyActiveEV !== newActiveviewEV) {
+      if (previouslyActiveEV.leaf !== leaf) {
+        //if loading new view to same leaf then don't save. Excalidarw view will take care of saving anyway.
+        //avoid double saving
+        if(previouslyActiveEV?.isDirty() && !previouslyActiveEV.semaphores?.viewunload) {
+          await previouslyActiveEV.save(true); //this will update transclusions in the drawing
+        }
+      }
+      if (previouslyActiveEV.file) {
+        this.plugin.triggerEmbedUpdates(previouslyActiveEV.file.path);
+      }
+    }
+
+    if (
+      newActiveviewEV &&
+      (!previouslyActiveEV || previouslyActiveEV.leaf !== leaf)
+    ) {
+      //the user switched to a new leaf
+      //timeout gives time to the view being exited to finish saving
+      const f = newActiveviewEV.file;
+      if (newActiveviewEV.file) {
+        setTimeout(() => {
+          if (!newActiveviewEV || !newActiveviewEV._loaded) {
+            return;
+          }
+          if (newActiveviewEV.file?.path !== f?.path) {
+            return;
+          }
+          if (newActiveviewEV.activeLoader) {
+            return;
+          }
+          newActiveviewEV.loadSceneFiles();
+        }, 2000);
+      } //refresh embedded files
+    }
+
+    
+    if (
+      newActiveviewEV && newActiveviewEV._loaded &&
+      newActiveviewEV.isLoaded && newActiveviewEV.excalidrawAPI &&
+      this.ea.onCanvasColorChangeHook
+    ) {
+      this.ea.onCanvasColorChangeHook(
+        this.ea,
+        newActiveviewEV,
+        newActiveviewEV.excalidrawAPI.getAppState().viewBackgroundColor
+      );
+    }
+
+    //https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/300
+    if (this.plugin.popScope) {
+      this.plugin.popScope();
+      this.plugin.popScope = null;
+    }
+    if (newActiveviewEV) {
+      this.plugin.registerHotkeyOverrides();
+    }
+  }
+
+  //https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/551
+  private onClickSaveActiveDrawing(e: PointerEvent) {
+    if (
+      !this.activeExcalidrawView ||
+      !this.activeExcalidrawView?.isDirty() ||
+      e.target && ((e.target as Element).className === "excalidraw__canvas" ||
+      getParentOfClass((e.target as Element),"excalidraw-wrapper"))
+    ) {
+      return;
+    }
+    this.activeExcalidrawView.save();
+  }
+
+  private onFileMenuSaveActiveDrawing () {
+    (process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onFileMenuSaveActiveDrawing,`onFileMenuSaveActiveDrawing`);
+    if (
+      !this.activeExcalidrawView ||
+      !this.activeExcalidrawView?.isDirty()
+    ) {
+      return;
+    }
+    this.activeExcalidrawView.save();
+  };
+
+  private onFileMenuHandler(menu: Menu, file: TFile, source: string, leaf: WorkspaceLeaf) {
+    (process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.onFileMenuHandler, `EventManager.onFileMenuHandler`, file, source, leaf);
+    if (!leaf) return;
+    const view = leaf.view;
+    if(!view || !(view instanceof MarkdownView)) return;
+    if (!(file instanceof TFile)) return;
+    const cache = this.app.metadataCache.getFileCache(file);
+    if (!cache?.frontmatter || !cache.frontmatter[FRONTMATTER_KEYS["plugin"].name]) return;
+    
+    menu.addItem(item => {
+      item
+      .setTitle(t("OPEN_AS_EXCALIDRAW"))
+      .setIcon(ICON_NAME)
+      .setSection("pane")
+      .onClick(async () => {
+        await view.save();
+        this.plugin.excalidrawFileModes[leaf.id || file.path] = VIEW_TYPE_EXCALIDRAW;
+        setExcalidrawView(leaf);
+      })});
+    menu.items.unshift(menu.items.pop());
+  }
+
+  private onEditorMenuHandler(menu: Menu, editor: Editor, view: MarkdownView) {
+    if(!view || !(view instanceof MarkdownView)) return;
+    const file = view.file;
+    const leaf = view.leaf;
+    if (!view.file) return;
+    const cache = this.app.metadataCache.getFileCache(file);
+    if (!cache?.frontmatter || !cache.frontmatter[FRONTMATTER_KEYS["plugin"].name]) return;
+    
+    menu.addItem(item => item
+      .setTitle(t("OPEN_AS_EXCALIDRAW"))
+      .setIcon(ICON_NAME)
+      .setSection("excalidraw")
+      .onClick(async () => {
+        await view.save();
+        this.plugin.excalidrawFileModes[leaf.id || file.path] = VIEW_TYPE_EXCALIDRAW;
+        setExcalidrawView(leaf);
+      })
+    );
+  }
+}

src/core/managers/FileManager.ts

@@ -0,0 +1,500 @@
+import { debug } from "src/utils/debugHelper";
+import { App, FrontMatterCache, MarkdownView, MetadataCache, normalizePath, Notice, TAbstractFile, TFile, WorkspaceLeaf } from "obsidian";
+import { BLANK_DRAWING, DARK_BLANK_DRAWING, DEVICE, EXPORT_TYPES, FRONTMATTER, FRONTMATTER_KEYS, JSON_parse, nanoid, VIEW_TYPE_EXCALIDRAW } from "src/constants/constants";
+import { Prompt, templatePromt } from "src/shared/Dialogs/Prompt";
+import { changeThemeOfExcalidrawMD, ExcalidrawData, getMarkdownDrawingSection } from "../../shared/ExcalidrawData";
+import ExcalidrawView, { getTextMode } from "src/view/ExcalidrawView";
+import ExcalidrawPlugin from "src/core/main";
+import { DEBUGGING } from "src/utils/debugHelper";
+import { checkAndCreateFolder, download, getIMGFilename, getLink, getListOfTemplateFiles, getNewUniqueFilepath } from "src/utils/fileUtils";
+import { PaneTarget } from "src/utils/modifierkeyHelper";
+import { getExcalidrawViews, getNewOrAdjacentLeaf, isObsidianThemeDark, openLeaf } from "src/utils/obsidianUtils";
+import { errorlog, getExportTheme } from "src/utils/utils";
+
+export class PluginFileManager {
+  private plugin: ExcalidrawPlugin;
+  private app: App;
+  private excalidrawFiles: Set<TFile> = new Set<TFile>();
+
+  get settings() {
+    return this.plugin.settings;
+  }
+
+  constructor(plugin: ExcalidrawPlugin) {
+    this.plugin = plugin;
+    this.app = plugin.app;
+  }
+
+  public async initialize() {
+    await this.plugin.awaitInit();
+    const metaCache: MetadataCache = this.app.metadataCache;
+    metaCache.getCachedFiles().forEach((filename: string) => {
+      const fm = metaCache.getCache(filename)?.frontmatter;
+      if (
+        (fm && typeof fm[FRONTMATTER_KEYS["plugin"].name] !== "undefined") ||
+        filename.match(/\.excalidraw$/)
+      ) {
+        this.updateFileCache(
+          this.app.vault.getAbstractFileByPath(filename) as TFile,
+          fm,
+        );
+      }
+    });
+  }
+
+  public isExcalidrawFile(f: TFile): boolean {
+    if(!f) return false;
+    if (f.extension === "excalidraw") {
+      return true;
+    }
+    const fileCache = f ? this.plugin.app.metadataCache.getFileCache(f) : null;
+    return !!fileCache?.frontmatter && !!fileCache.frontmatter[FRONTMATTER_KEYS["plugin"].name];
+  }
+
+  //managing my own list of Excalidraw files because in the onDelete event handler
+  //the file object is already gone from metadataCache, thus I can't check if it was an Excalidraw file
+  public updateFileCache(
+    file: TFile,
+    frontmatter?: FrontMatterCache,
+    deleted: boolean = false,
+  ) {
+    if (frontmatter && typeof frontmatter[FRONTMATTER_KEYS["plugin"].name] !== "undefined") {
+      this.excalidrawFiles.add(file);
+      return;
+    }
+    if (!deleted && file.extension === "excalidraw") {
+      this.excalidrawFiles.add(file);
+      return;
+    }
+    this.excalidrawFiles.delete(file);
+  }
+
+  public getExcalidrawFiles(): Set<TFile> {
+    return this.excalidrawFiles;
+  }
+
+  public destroy() {
+    this.excalidrawFiles.clear();
+  }
+
+  public async createDrawing(
+    filename: string,
+    foldername?: string,
+    initData?: string,
+  ): Promise<TFile> {
+    const folderpath = normalizePath(
+      foldername ? foldername : this.settings.folder,
+    );
+    await checkAndCreateFolder(folderpath); //create folder if it does not exist
+    const fname = getNewUniqueFilepath(this.app.vault, filename, folderpath);
+    const file = await this.app.vault.create(
+      fname,
+      initData ?? (await this.plugin.getBlankDrawing()),
+    );
+    
+    //wait for metadata cache
+    let counter = 0;
+    while(file instanceof TFile && !this.isExcalidrawFile(file) && counter++<10) {
+      await sleep(50);
+    }
+    
+    if(counter > 10) {
+      errorlog({file, error: "new drawing not recognized as an excalidraw file", fn: this.createDrawing});
+    }
+
+    return file;
+  }
+
+  public async getBlankDrawing(): Promise<string> {
+    const templates = getListOfTemplateFiles(this.plugin);
+    if(templates) {
+      const template = await templatePromt(templates, this.app);
+      if (template && template instanceof TFile) {
+        if (
+          (template.extension == "md" && !this.settings.compatibilityMode) ||
+          (template.extension == "excalidraw" && this.settings.compatibilityMode)
+        ) {
+          const data = await this.app.vault.read(template);
+          if (data) {
+            return this.settings.matchTheme
+              ? changeThemeOfExcalidrawMD(data)
+              : data;
+          }
+        }
+      }
+    }
+    if (this.settings.compatibilityMode) {
+      return this.settings.matchTheme && isObsidianThemeDark()
+        ? DARK_BLANK_DRAWING
+        : BLANK_DRAWING;
+    }
+    const blank =
+      this.settings.matchTheme && isObsidianThemeDark()
+        ? DARK_BLANK_DRAWING
+        : BLANK_DRAWING;
+    return `${FRONTMATTER}\n${getMarkdownDrawingSection(
+      blank,
+      this.settings.compress,
+    )}`;
+  }
+
+  public async embedDrawing(file: TFile) {
+    const activeView = this.app.workspace.getActiveViewOfType(MarkdownView);
+    if (activeView && activeView.file) {
+      const excalidrawRelativePath = this.app.metadataCache.fileToLinktext(
+        file,
+        activeView.file.path,
+        this.settings.embedType === "excalidraw",
+      );
+      const editor = activeView.editor;
+
+      //embed Excalidraw
+      if (this.settings.embedType === "excalidraw") {
+        editor.replaceSelection(
+          getLink(this.plugin, {path: excalidrawRelativePath}),
+        );
+        editor.focus();
+        return;
+      }
+
+      //embed image
+      let theme = this.settings.autoExportLightAndDark
+        ? getExportTheme (
+          this.plugin,
+          file,
+          this.settings.exportWithTheme
+            ? isObsidianThemeDark() ? "dark":"light"
+            : "light"
+          )
+        : "";
+
+      theme = (theme === "")
+       ? ""
+       : theme + ".";
+
+      const imageRelativePath = getIMGFilename(
+        excalidrawRelativePath,
+        theme+this.settings.embedType.toLowerCase(),
+      );
+      const imageFullpath = getIMGFilename(
+        file.path,
+        theme+this.settings.embedType.toLowerCase(),
+      );
+     
+      //will hold incorrect value if theme==="", however in that case it won't be used
+      const otherTheme = theme === "dark." ? "light." : "dark.";
+      const otherImageRelativePath = theme === "" 
+        ? null
+        : getIMGFilename(
+            excalidrawRelativePath,
+            otherTheme+this.settings.embedType.toLowerCase(),
+          );
+
+      const imgFile = this.app.vault.getAbstractFileByPath(imageFullpath);
+      if (!imgFile) {
+        await this.app.vault.create(imageFullpath, "");
+        await sleep(200); //wait for metadata cache to update
+      }
+
+      const inclCom = this.settings.embedMarkdownCommentLinks;
+
+      editor.replaceSelection(
+        this.settings.embedWikiLink
+          ? `![[${imageRelativePath}]]\n` +
+            (inclCom
+              ? `%%[[${excalidrawRelativePath}|🖋 Edit in Excalidraw]]${
+                otherImageRelativePath
+                  ? ", and the [["+otherImageRelativePath+"|"+otherTheme.split(".")[0]+" exported image]]"
+                  : ""
+                }%%`
+              : "")
+          : `![](${encodeURI(imageRelativePath)})\n` + 
+            (inclCom ? `%%[🖋 Edit in Excalidraw](${encodeURI(excalidrawRelativePath,
+              )})${otherImageRelativePath?", and the ["+otherTheme.split(".")[0]+" exported image]("+encodeURI(otherImageRelativePath)+")":""}%%` : ""),
+      );
+      editor.focus();
+    }
+  }
+
+  public async exportLibrary() {
+    if (DEVICE.isMobile) {
+      const prompt = new Prompt(
+        this.app,
+        "Please provide a filename",
+        "my-library",
+        "filename, leave blank to cancel action",
+      );
+      prompt.openAndGetValue(async (filename: string) => {
+        if (!filename) {
+          return;
+        }
+        filename = `${filename}.excalidrawlib`;
+        const folderpath = normalizePath(this.settings.folder);
+        await checkAndCreateFolder(folderpath); //create folder if it does not exist
+        const fname = getNewUniqueFilepath(
+          this.app.vault,
+          filename,
+          folderpath,
+        );
+        this.app.vault.create(fname, this.settings.library);
+        new Notice(`Exported library to ${fname}`, 6000);
+      });
+      return;
+    }
+    download(
+      "data:text/plain;charset=utf-8",
+      encodeURIComponent(JSON.stringify(this.settings.library2, null, "\t")),
+      "my-obsidian-library.excalidrawlib",
+    );
+  }
+
+  /**
+   * Opens a drawing file
+   * @param drawingFile 
+   * @param location 
+   * @param active 
+   * @param subpath 
+   * @param justCreated 
+   * @param popoutLocation 
+   */
+  public openDrawing(
+    drawingFile: TFile,
+    location: PaneTarget,
+    active: boolean = false,
+    subpath?: string,
+    justCreated: boolean = false,
+    popoutLocation?: {x?: number, y?: number, width?: number, height?: number},
+  ) {
+
+    const fnGetLeaf = ():WorkspaceLeaf => {
+      if(location === "md-properties") {
+        location = "new-tab";
+      }
+      let leaf: WorkspaceLeaf;
+      if(location === "popout-window") {
+        leaf = this.app.workspace.openPopoutLeaf(popoutLocation);
+      }
+      if(location === "new-tab") {
+        leaf = this.app.workspace.getLeaf('tab');
+      }
+      if(!leaf) {
+        leaf = this.app.workspace.getLeaf(false);
+        if ((leaf.view.getViewType() !== 'empty') && (location === "new-pane")) {
+          leaf = getNewOrAdjacentLeaf(this.plugin, leaf)    
+        }
+      }
+      return leaf;
+    }
+
+    const {leaf, promise} = openLeaf({
+      plugin: this.plugin,
+      fnGetLeaf: () => fnGetLeaf(),
+      file: drawingFile,
+      openState:!subpath || subpath === "" 
+        ? {active}
+        : { active, eState: { subpath } }
+    });
+
+    promise.then(()=>{
+      const ea = this.plugin.ea;
+      if(justCreated && ea.onFileCreateHook) {
+        try {
+          ea.onFileCreateHook({
+            ea,
+            excalidrawFile: drawingFile,
+            view: leaf.view as ExcalidrawView,
+          });
+        } catch(e) {
+          console.error(e);
+        }
+      }
+    })
+  }
+
+  /**
+ * Extracts the text elements from an Excalidraw scene into a string of ids as headers followed by the text contents
+ * @param {string} data - Excalidraw scene JSON string
+ * @returns {string} - Text starting with the "# Text Elements" header and followed by each "## id-value" and text
+ */
+  public async exportSceneToMD(data: string, compressOverride?: boolean): Promise<string> {
+    if (!data) {
+      return "";
+    }
+    const excalidrawData = JSON_parse(data);
+    const textElements = excalidrawData.elements?.filter(
+      (el: any) => el.type == "text",
+    );
+    let outString = `# Excalidraw Data\n\n## Text Elements\n`;
+    let id: string;
+    for (const te of textElements) {
+      id = te.id;
+      //replacing Excalidraw text IDs with my own, because default IDs may contain
+      //characters not recognized by Obsidian block references
+      //also Excalidraw IDs are inconveniently long
+      if (te.id.length > 8) {
+        id = nanoid();
+        data = data.replaceAll(te.id, id); //brute force approach to replace all occurrences.
+      }
+      outString += `${te.originalText ?? te.text} ^${id}\n\n`;
+    }
+    return (
+      outString +
+      getMarkdownDrawingSection(
+        JSON.stringify(JSON_parse(data), null, "\t"),
+        typeof compressOverride === "undefined"
+        ? this.settings.compress
+        : compressOverride,
+      )
+    );
+  }
+
+
+  // -------------------------------------------------------
+  // ------------------ Event Handlers ---------------------
+  // -------------------------------------------------------
+
+  /**
+   * watch filename change to rename .svg, .png; to sync to .md; to update links
+   * @param file 
+   * @param oldPath 
+   * @returns 
+   */
+  public async renameEventHandler (file: TAbstractFile, oldPath: string) {
+    (process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.renameEventHandler, `ExcalidrawPlugin.renameEventHandler`, file, oldPath);
+    if (!(file instanceof TFile)) {
+      return;
+    }
+    if (!this.isExcalidrawFile(file)) {
+      return;
+    }
+    if (!this.settings.keepInSync) {
+      return;
+    }
+    [EXPORT_TYPES, "excalidraw"].flat().forEach(async (ext: string) => {
+      const oldIMGpath = getIMGFilename(oldPath, ext);
+      const imgFile = this.app.vault.getAbstractFileByPath(
+        normalizePath(oldIMGpath),
+      );
+      if (imgFile && imgFile instanceof TFile) {
+        const newIMGpath = getIMGFilename(file.path, ext);
+        await this.app.fileManager.renameFile(imgFile, newIMGpath);
+      }
+    });
+  }
+
+  public async modifyEventHandler (file: TFile) {
+    (process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.modifyEventHandler,`FileManager.modifyEventHandler`, file);
+    const excalidrawViews = getExcalidrawViews(this.app);
+    excalidrawViews.forEach(async (excalidrawView) => {
+      if(excalidrawView.semaphores?.viewunload) {
+        return;
+      }
+      if (
+        excalidrawView.file &&
+        (excalidrawView.file.path === file.path ||
+          (file.extension === "excalidraw" &&
+            `${file.path.substring(
+              0,
+              file.path.lastIndexOf(".excalidraw"),
+            )}.md` === excalidrawView.file.path))
+      ) {
+        if(excalidrawView.semaphores?.preventReload) {
+          excalidrawView.semaphores.preventReload = false;
+          return;
+        }
+
+
+        // Avoid synchronizing or reloading if the user hasn't interacted with the file for 5 minutes.
+        // This prevents complex sync issues when multiple remote changes occur outside an active collaboration session.
+
+        // The following logic handles a rare edge case where:
+        // 1. The user opens an Excalidraw file.
+        // 2. Immediately splits the view without saving Excalidraw (since no changes were made).
+        // 3. Switches the new split view to Markdown, edits the file, and quickly returns to Excalidraw.
+        // 4. The "modify" event may fire while Excalidraw is active, triggering an unwanted reload and zoom reset.
+
+        // To address this:
+        // - We check if the user is currently editing the Markdown version of the Excalidraw file in a split view.  
+        // - As a heuristic, we also check for recent leaf switches.  
+        //   This is not perfectly accurate (e.g., rapid switching between views within a few seconds),  
+        //   but it is sufficient to avoid most edge cases without introducing complexity.
+
+        // Edge case impact:  
+        // - In extremely rare situations, an update arriving within the "recent switch" timeframe (e.g., from Obsidian Sync)  
+        //   might not trigger a reload. This is unlikely and an acceptable trade-off for better user experience.
+        const activeView = this.app.workspace.activeLeaf.view;
+        const isEditingMarkdownSideInSplitView = ((activeView !== excalidrawView) &&
+          activeView instanceof MarkdownView && activeView.file === excalidrawView.file) ||
+          (activeView === excalidrawView && this.plugin.isRecentSplitViewSwitch());
+
+        if(!isEditingMarkdownSideInSplitView && (excalidrawView.lastSaveTimestamp + 300000 < Date.now())) {
+          excalidrawView.reload(true, excalidrawView.file);
+          return;
+        }           
+        if(file.extension==="md") {
+          if(excalidrawView.semaphores?.embeddableIsEditingSelf) return;
+          const inData = new ExcalidrawData(this.plugin);
+          const data = await this.app.vault.read(file);
+          await inData.loadData(data,file,getTextMode(data));
+          excalidrawView.synchronizeWithData(inData);
+          inData.destroy();
+          if(excalidrawView?.isDirty()) {
+            if(excalidrawView.autosaveTimer && excalidrawView.autosaveFunction) {
+              clearTimeout(excalidrawView.autosaveTimer);
+            }
+            if(excalidrawView.autosaveFunction) {
+              excalidrawView.autosaveFunction();
+            }
+          }
+        } else {
+          excalidrawView.reload(true, excalidrawView.file);
+        }
+      }
+    });
+  }
+
+  /**
+   * watch file delete and delete corresponding .svg and .png
+   * @param file 
+   * @returns 
+   */
+  public async deleteEventHandler (file: TFile) {
+    (process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.deleteEventHandler,`ExcalidrawPlugin.deleteEventHandler`, file);
+    if (!(file instanceof TFile)) {
+      return;
+    }
+
+    const isExcalidarwFile = this.getExcalidrawFiles().has(file);
+    this.updateFileCache(file, undefined, true);
+    if (!isExcalidarwFile) {
+      return;
+    }
+
+    //close excalidraw view where this file is open
+    const excalidrawViews = getExcalidrawViews(this.app);
+    for (const excalidrawView of excalidrawViews) {
+      if (excalidrawView.file.path === file.path) {
+        await excalidrawView.leaf.setViewState({
+          type: VIEW_TYPE_EXCALIDRAW,
+          state: { file: null },
+        });
+      }
+    }
+
+    //delete PNG and SVG files as well
+    if (this.settings.keepInSync) {
+      window.setTimeout(() => {
+        [EXPORT_TYPES, "excalidraw"].flat().forEach(async (ext: string) => {
+          const imgPath = getIMGFilename(file.path, ext);
+          const imgFile = this.app.vault.getAbstractFileByPath(
+            normalizePath(imgPath),
+          );
+          if (imgFile && imgFile instanceof TFile) {
+            await this.app.vault.delete(imgFile);
+          }
+        });
+      }, 500);
+    }
+  };
+
+}

src/core/managers/ObserverManager.ts

@@ -0,0 +1,257 @@
+import { debug, DEBUGGING } from "src/utils/debugHelper";
+import ExcalidrawPlugin from "src/core/main";
+import { CustomMutationObserver } from "src/utils/debugHelper";
+import { getExcalidrawViews, isObsidianThemeDark } from "src/utils/obsidianUtils";
+import { App, Notice, TFile } from "obsidian";
+
+export class ObserverManager {
+  private plugin: ExcalidrawPlugin;
+  private app: App;
+  private themeObserver: MutationObserver | CustomMutationObserver;
+  private fileExplorerObserver: MutationObserver | CustomMutationObserver;
+  private modalContainerObserver: MutationObserver | CustomMutationObserver;
+  private workspaceDrawerLeftObserver: MutationObserver | CustomMutationObserver;
+  private workspaceDrawerRightObserver: MutationObserver | CustomMutationObserver;
+  private activeViewDoc: Document;
+
+  get settings() {
+    return this.plugin.settings;
+  }
+
+  constructor(plugin: ExcalidrawPlugin) {
+    this.plugin = plugin;
+    this.app = plugin.app;
+  }
+
+  public initialize() {
+    try {
+      if(this.settings.matchThemeTrigger) this.addThemeObserver();
+      this.experimentalFileTypeDisplayToggle(this.settings.experimentalFileType);
+      this.addModalContainerObserver();
+    } catch (e) {
+      new Notice("Error adding ObserverManager", 6000);
+      console.error("Error adding ObserverManager", e);
+    }
+    this.plugin.logStartupEvent("ObserverManager added");
+  }
+
+  public destroy() {
+    this.removeThemeObserver();
+    this.removeModalContainerObserver();
+    if (this.workspaceDrawerLeftObserver) {
+      this.workspaceDrawerLeftObserver.disconnect();
+    }
+    if (this.workspaceDrawerRightObserver) {
+      this.workspaceDrawerRightObserver.disconnect();
+    }
+    if (this.fileExplorerObserver) {
+      this.fileExplorerObserver.disconnect();
+    }
+    if (this.workspaceDrawerRightObserver) {
+      this.workspaceDrawerRightObserver.disconnect();
+    }
+    if (this.workspaceDrawerLeftObserver) {
+      this.workspaceDrawerLeftObserver.disconnect();
+    }
+  }
+
+  public addThemeObserver() {
+    if(this.themeObserver) return;
+    const { matchThemeTrigger } = this.settings;
+    if (!matchThemeTrigger) return;
+
+    const themeObserverFn:MutationCallback = async (mutations: MutationRecord[]) => {
+      (process.env.NODE_ENV === 'development') && DEBUGGING && debug(themeObserverFn, `ExcalidrawPlugin.addThemeObserver`, mutations);
+      const { matchThemeTrigger } = this.settings;
+      if (!matchThemeTrigger) return;
+
+      const bodyClassList = document.body.classList;
+      const mutation = mutations[0];
+      if (mutation?.oldValue === bodyClassList.value) return;
+      
+      const darkClass = bodyClassList.contains('theme-dark');
+      if (mutation?.oldValue?.includes('theme-dark') === darkClass) return;
+
+      setTimeout(()=>{ //run async to avoid blocking the UI
+        const theme = isObsidianThemeDark() ? "dark" : "light";
+        const excalidrawViews = getExcalidrawViews(this.app);
+        excalidrawViews.forEach(excalidrawView => {
+          if (excalidrawView.file && excalidrawView.excalidrawAPI) {
+            excalidrawView.setTheme(theme);
+          }
+        });
+      });
+    };
+
+    this.themeObserver = DEBUGGING
+      ? new CustomMutationObserver(themeObserverFn, "themeObserver")
+      : new MutationObserver(themeObserverFn);
+  
+    this.themeObserver.observe(document.body, {
+      attributeOldValue: true,
+      attributeFilter: ["class"],
+    });
+  }
+
+  public removeThemeObserver() {
+    if(!this.themeObserver) return;
+    this.themeObserver.disconnect();
+    this.themeObserver = null;
+  }
+
+  public experimentalFileTypeDisplayToggle(enabled: boolean) {
+    if (enabled) {
+      this.experimentalFileTypeDisplay();
+      return;
+    }
+    if (this.fileExplorerObserver) {
+      this.fileExplorerObserver.disconnect();
+    }
+    this.fileExplorerObserver = null;
+  }
+
+  /**
+   * Display characters configured in settings, in front of the filename, if the markdown file is an excalidraw drawing
+   * Must be called after the workspace is ready
+   * The function is called from onload()
+   */
+  private async experimentalFileTypeDisplay() {
+    (process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.experimentalFileTypeDisplay, `ExcalidrawPlugin.experimentalFileTypeDisplay`);
+    const insertFiletype = (el: HTMLElement) => {
+      if (el.childElementCount !== 1) {
+        return;
+      }
+      const filename = el.getAttribute("data-path");
+      if (!filename) {
+        return;
+      }
+      const f = this.app.vault.getAbstractFileByPath(filename);
+      if (!f || !(f instanceof TFile)) {
+        return;
+      }
+      if (this.plugin.isExcalidrawFile(f)) {
+        el.insertBefore(
+          createDiv({
+            cls: "nav-file-tag",
+            text: this.settings.experimentalFileTag,
+          }),
+          el.firstChild,
+        );
+      }
+    };
+
+    const fileExplorerObserverFn:MutationCallback = (mutationsList) => {
+      (process.env.NODE_ENV === 'development') && DEBUGGING && debug(fileExplorerObserverFn, `ExcalidrawPlugin.experimentalFileTypeDisplay > fileExplorerObserverFn`, mutationsList);
+      const mutationsWithNodes = mutationsList.filter((mutation) => mutation.addedNodes.length > 0);
+      mutationsWithNodes.forEach((mutationNode) => {
+        mutationNode.addedNodes.forEach((node) => {
+          if (!(node instanceof Element)) {
+            return;
+          }
+          node.querySelectorAll(".nav-file-title").forEach(insertFiletype);
+        });
+      });
+    };
+
+    this.fileExplorerObserver = DEBUGGING
+      ? new CustomMutationObserver(fileExplorerObserverFn, "fileExplorerObserver")
+      : new MutationObserver(fileExplorerObserverFn);
+
+    //the part that should only run after onLayoutReady
+    document.querySelectorAll(".nav-file-title").forEach(insertFiletype); //apply filetype to files already displayed
+    const container = document.querySelector(".nav-files-container");
+    if (container) {
+      this.fileExplorerObserver.observe(container, {
+        childList: true,
+        subtree: true,
+      });
+    }
+  }
+
+  /**
+   * Monitors if the user clicks outside the Excalidraw view, and saves the drawing if it's dirty
+   * @returns 
+   */
+  public addModalContainerObserver() {
+    if(!this.plugin.activeExcalidrawView) return;
+    if(this.modalContainerObserver) {
+      if(this.activeViewDoc === this.plugin.activeExcalidrawView.ownerDocument) {
+        return;
+      }
+      this.removeModalContainerObserver();
+    }
+    //The user clicks settings, or "open another vault", or the command palette
+    const modalContainerObserverFn: MutationCallback = async (m: MutationRecord[]) => {
+      (process.env.NODE_ENV === 'development') && DEBUGGING && debug(modalContainerObserverFn,`ExcalidrawPlugin.modalContainerObserverFn`, m);
+      if (
+        (m.length !== 1) ||
+        (m[0].type !== "childList") ||
+        (m[0].addedNodes.length !== 1) ||
+        (!this.plugin.activeExcalidrawView) ||
+        this.plugin.activeExcalidrawView?.semaphores?.viewunload ||
+        (!this.plugin.activeExcalidrawView?.isDirty())
+      ) {
+        return;
+      }
+      this.plugin.activeExcalidrawView.save();
+    };
+
+    this.modalContainerObserver = DEBUGGING
+      ? new CustomMutationObserver(modalContainerObserverFn, "modalContainerObserver")
+      : new MutationObserver(modalContainerObserverFn);
+    this.activeViewDoc = this.plugin.activeExcalidrawView.ownerDocument;
+    this.modalContainerObserver.observe(this.activeViewDoc.body, {
+      childList: true,
+    });    
+  }
+
+  public removeModalContainerObserver() {
+    if(!this.modalContainerObserver) return;
+    this.modalContainerObserver.disconnect();
+    this.activeViewDoc = null;
+    this.modalContainerObserver = null;
+  }
+
+  private addWorkspaceDrawerObserver() {
+    //when the user activates the sliding drawers on Obsidian Mobile
+    const leftWorkspaceDrawer = document.querySelector(
+      ".workspace-drawer.mod-left",
+    );
+    const rightWorkspaceDrawer = document.querySelector(
+      ".workspace-drawer.mod-right",
+    );
+    if (leftWorkspaceDrawer || rightWorkspaceDrawer) {
+      const action = async (m: MutationRecord[]) => {
+        if (
+          m[0].oldValue !== "display: none;" ||
+          !this.plugin.activeExcalidrawView ||
+          !this.plugin.activeExcalidrawView?.isDirty()
+        ) {
+          return;
+        }
+        this.plugin.activeExcalidrawView.save();
+      };
+      const options = {
+        attributeOldValue: true,
+        attributeFilter: ["style"],
+      };
+
+      if (leftWorkspaceDrawer) {
+        this.workspaceDrawerLeftObserver = DEBUGGING
+          ? new CustomMutationObserver(action, "slidingDrawerLeftObserver")
+          : new MutationObserver(action);
+        this.workspaceDrawerLeftObserver.observe(leftWorkspaceDrawer, options);
+      }
+
+      if (rightWorkspaceDrawer) {
+        this.workspaceDrawerRightObserver = DEBUGGING
+          ? new CustomMutationObserver(action, "slidingDrawerRightObserver")
+          : new MutationObserver(action);
+        this.workspaceDrawerRightObserver.observe(
+          rightWorkspaceDrawer,
+          options,
+        );
+      }
+    }
+  }
+}

src/core/managers/PackageManager.ts

@@ -0,0 +1,97 @@
+import { updateExcalidrawLib } from "src/constants/constants";
+import { ExcalidrawLib } from "../../types/excalidrawLib";
+import { Packages } from "../../types/types";
+import { debug, DEBUGGING } from "../../utils/debugHelper";
+import { Notice } from "obsidian";
+import ExcalidrawPlugin from "src/core/main";
+
+declare let REACT_PACKAGES:string;
+declare let react:any;
+declare let reactDOM:any;
+declare let excalidrawLib: typeof ExcalidrawLib;
+declare const unpackExcalidraw: Function;
+
+export class PackageManager {
+  private packageMap: Map<Window, Packages> = new Map<Window, Packages>();
+  private EXCALIDRAW_PACKAGE: string;
+
+  constructor(plugin: ExcalidrawPlugin) {
+    try {
+      this.EXCALIDRAW_PACKAGE = unpackExcalidraw();
+      excalidrawLib = window.eval.call(window,`(function() {${this.EXCALIDRAW_PACKAGE};return ExcalidrawLib;})()`);
+      updateExcalidrawLib();
+      this.setPackage(window,{react, reactDOM, excalidrawLib});
+    } catch (e) {
+      new Notice("Error loading the Excalidraw package", 6000);
+      console.error("Error loading the Excalidraw package", e);
+    }
+    plugin.logStartupEvent("Excalidraw package unpacked");
+  }
+
+  public setPackage(window: Window, pkg: Packages) {
+    this.packageMap.set(window, pkg);
+  }
+
+  public getPackageMap() {
+    return this.packageMap;
+  }
+
+  public getPackage(win:Window):Packages {
+    (process.env.NODE_ENV === 'development') && DEBUGGING && debug(this.getPackage, `ExcalidrawPlugin.getPackage`, win);
+
+    if(this.packageMap.has(win)) {
+      return this.packageMap.get(win);
+    }
+
+    const {react:r, reactDOM:rd, excalidrawLib:e} = win.eval.call(win,
+      `(function() {
+        ${REACT_PACKAGES + this.EXCALIDRAW_PACKAGE};
+        return {react:React,reactDOM:ReactDOM,excalidrawLib:ExcalidrawLib};
+       })()`);
+    this.packageMap.set(win,{react:r, reactDOM:rd, excalidrawLib:e});
+    return {react:r, reactDOM:rd, excalidrawLib:e};
+  }
+
+  public deletePackage(win: Window) {
+    const { react, reactDOM, excalidrawLib } = this.getPackage(win);
+
+    if (win.ExcalidrawLib === excalidrawLib) {
+      excalidrawLib.destroyObsidianUtils();
+      delete win.ExcalidrawLib;
+    }
+
+    if (win.React === react) {
+      Object.keys(win.React).forEach((key) => {
+        delete win.React[key];
+      });
+      delete win.React;
+    }
+
+    if (win.ReactDOM === reactDOM) {
+      Object.keys(win.ReactDOM).forEach((key) => {
+        delete win.ReactDOM[key];
+      });
+      delete win.ReactDOM;
+    }
+
+    this.packageMap.delete(win);
+  }
+
+  public setExcalidrawPackage(pkg: string) {
+    this.EXCALIDRAW_PACKAGE = pkg;
+  }
+
+  public destroy() {
+    REACT_PACKAGES = "";
+    Object.values(this.packageMap).forEach((p: Packages) => {
+      delete p.excalidrawLib;
+      delete p.reactDOM;
+      delete p.react;
+    });
+    this.packageMap.clear();
+    this.EXCALIDRAW_PACKAGE = "";
+    react = null;
+    reactDOM = null;
+    excalidrawLib = null;
+  }
+}

src/core/managers/StylesManager.ts

@@ -1,7 +1,7 @@
 import { WorkspaceWindow } from "obsidian";
-import ExcalidrawPlugin from "src/main";
-import { getAllWindowDocuments } from "./ObsidianUtils";
-import { DEBUGGING, debug } from "./DebugHelper";
+import ExcalidrawPlugin from "src/core/main";
+import { getAllWindowDocuments } from "../../utils/obsidianUtils";
+import { DEBUGGING, debug } from "../../utils/debugHelper";
 
 export let REM_VALUE = 16;
 

src/core/settings.ts

@@ -10,37 +10,37 @@ import {
   TextComponent,
   TFile,
 } from "obsidian";
-import { GITHUB_RELEASES } from "./constants/constants";
-import { t } from "./lang/helpers";
-import type ExcalidrawPlugin from "./main";
-import { PenStyle } from "./PenTypes";
-import { DynamicStyle, GridSettings } from "./types/types";
-import { PreviewImageType } from "./utils/UtilTypes";
-import { setDynamicStyle } from "./utils/DynamicStyling";
+import { GITHUB_RELEASES, setRootElementSize } from "src/constants/constants";
+import { t } from "src/lang/helpers";
+import type ExcalidrawPlugin from "src/core/main";
+import { PenStyle } from "src/types/penTypes";
+import { DynamicStyle, GridSettings } from "src/types/types";
+import { PreviewImageType } from "src/types/utilTypes";
+import { setDynamicStyle } from "src/utils/dynamicStyling";
 import {
   getDrawingFilename,
   getEmbedFilename,
-} from "./utils/FileUtils";
-import { PENS } from "./utils/Pens";
+} from "src/utils/fileUtils";
+import { PENS } from "src/utils/pens";
 import {
   addIframe,
   fragWithHTML,
   setLeftHandedMode,
-} from "./utils/Utils";
-import { imageCache } from "./utils/ImageCache";
-import { ConfirmationPrompt } from "./dialogs/Prompt";
-import { EmbeddableMDCustomProps } from "./dialogs/EmbeddableSettings";
-import { EmbeddalbeMDFileCustomDataSettingsComponent } from "./dialogs/EmbeddableMDFileCustomDataSettingsComponent";
-import { startupScript } from "./constants/starutpscript";
-import { ModifierKeySet, ModifierSetType } from "./utils/ModifierkeyHelper";
-import { ModifierKeySettingsComponent } from "./dialogs/ModifierKeySettings";
-import { ANNOTATED_PREFIX, CROPPED_PREFIX } from "./utils/CarveOut";
-import { EDITOR_FADEOUT } from "./CodeMirrorExtension/EditorHandler";
-import { setDebugging } from "./utils/DebugHelper";
-import { Rank } from "./menu/ActionIcons";
+} from "src/utils/utils";
+import { imageCache } from "src/shared/ImageCache";
+import { ConfirmationPrompt } from "src/shared/Dialogs/Prompt";
+import { EmbeddableMDCustomProps } from "src/shared/Dialogs/EmbeddableSettings";
+import { EmbeddalbeMDFileCustomDataSettingsComponent } from "src/shared/Dialogs/EmbeddableMDFileCustomDataSettingsComponent";
+import { startupScript } from "src/constants/starutpscript";
+import { ModifierKeySet, ModifierSetType } from "src/utils/modifierkeyHelper";
+import { ModifierKeySettingsComponent } from "src/shared/Dialogs/ModifierKeySettings";
+import { ANNOTATED_PREFIX, CROPPED_PREFIX } from "src/utils/carveout";
+import { EDITOR_FADEOUT } from "src/core/editor/EditorHandler";
+import { setDebugging } from "src/utils/debugHelper";
+import { Rank } from "src/constants/actionIcons";
 import { TAG_AUTOEXPORT, TAG_MDREADINGMODE, TAG_PDFEXPORT } from "src/constants/constSettingsTags";
-import { HotkeyEditor } from "./dialogs/HotkeyEditor";
-import { getExcalidrawViews } from "./utils/ObsidianUtils";
+import { HotkeyEditor } from "src/shared/Dialogs/HotkeyEditor";
+import { getExcalidrawViews } from "src/utils/obsidianUtils";
 
 export interface ExcalidrawSettings {
   folder: string;
@@ -76,6 +76,7 @@ export interface ExcalidrawSettings {
   previewMatchObsidianTheme: boolean;
   width: string;
   height: string;
+  overrideObsidianFontSize: boolean;
   dynamicStyling: DynamicStyle;
   isLeftHanded: boolean;
   iframeMatchExcalidrawTheme: boolean;
@@ -253,6 +254,7 @@ export const DEFAULT_SETTINGS: ExcalidrawSettings = {
   previewMatchObsidianTheme: false,
   width: "400",
   height: "",
+  overrideObsidianFontSize: false,
   dynamicStyling: "colorful",
   isLeftHanded: false,
   iframeMatchExcalidrawTheme: true,
@@ -516,6 +518,14 @@ export class ExcalidrawSettingTab extends PluginSettingTab {
   }
 
   async hide() {
+    if(this.plugin.settings.overrideObsidianFontSize) {
+      document.documentElement.style.fontSize = "";
+      setRootElementSize(16);
+    } else if(!document.documentElement.style.fontSize) {
+      document.documentElement.style.fontSize = getComputedStyle(document.body).getPropertyValue("--font-text-size");
+      setRootElementSize();
+    }
+    
     this.plugin.settings.scriptFolderPath = normalizePath(
       this.plugin.settings.scriptFolderPath,
     );
@@ -1163,6 +1173,18 @@ export class ExcalidrawSettingTab extends PluginSettingTab {
       cls: "excalidraw-setting-h3",
     });
     
+    new Setting(detailsEl)
+      .setName(t("OVERRIDE_OBSIDIAN_FONT_SIZE_NAME"))
+      .setDesc(fragWithHTML(t("OVERRIDE_OBSIDIAN_FONT_SIZE_DESC")))
+      .addToggle((toggle) =>
+        toggle
+          .setValue(this.plugin.settings.overrideObsidianFontSize)
+          .onChange((value) => {
+            this.plugin.settings.overrideObsidianFontSize = value;
+            this.applySettingsUpdate();
+          }),
+      );
+
     new Setting(detailsEl)
       .setName(t("DYNAMICSTYLE_NAME"))
       .setDesc(fragWithHTML(t("DYNAMICSTYLE_DESC")))

src/dialogs/FolderSuggester.ts

@@ -1,569 +0,0 @@
-import {
-  FuzzyMatch,
-  TFile,
-  BlockCache,
-  HeadingCache,
-  CachedMetadata,
-  TextComponent,
-  App,
-  TFolder,
-  FuzzySuggestModal,
-  SuggestModal,
-  Scope,
-} from "obsidian";
-import { createPopper, Instance as PopperInstance } from "@popperjs/core";
-
-class Suggester<T> {
-  owner: SuggestModal<T>;
-  items: T[];
-  suggestions: HTMLDivElement[];
-  selectedItem: number;
-  containerEl: HTMLElement;
-  constructor(owner: SuggestModal<T>, containerEl: HTMLElement, scope: Scope) {
-    this.containerEl = containerEl;
-    this.owner = owner;
-    containerEl.on(
-      "click",
-      ".suggestion-item",
-      this.onSuggestionClick.bind(this),
-    );
-    containerEl.on(
-      "mousemove",
-      ".suggestion-item",
-      this.onSuggestionMouseover.bind(this),
-    );
-
-    scope.register([], "ArrowUp", () => {
-      this.setSelectedItem(this.selectedItem - 1, true);
-      return false;
-    });
-
-    scope.register([], "ArrowDown", () => {
-      this.setSelectedItem(this.selectedItem + 1, true);
-      return false;
-    });
-
-    scope.register([], "Enter", (evt) => {
-      this.useSelectedItem(evt);
-      return false;
-    });
-
-    scope.register([], "Tab", (evt) => {
-      this.chooseSuggestion(evt);
-      return false;
-    });
-  }
-  chooseSuggestion(evt: KeyboardEvent) {
-    if (!this.items || !this.items.length) {
-      return;
-    }
-    const currentValue = this.items[this.selectedItem];
-    if (currentValue) {
-      this.owner.onChooseSuggestion(currentValue, evt);
-    }
-  }
-  onSuggestionClick(event: MouseEvent, el: HTMLDivElement): void {
-    event.preventDefault();
-    if (!this.suggestions || !this.suggestions.length) {
-      return;
-    }
-
-    const item = this.suggestions.indexOf(el);
-    this.setSelectedItem(item, false);
-    this.useSelectedItem(event);
-  }
-
-  onSuggestionMouseover(event: MouseEvent, el: HTMLDivElement): void {
-    if (!this.suggestions || !this.suggestions.length) {
-      return;
-    }
-    const item = this.suggestions.indexOf(el);
-    this.setSelectedItem(item, false);
-  }
-  empty() {
-    this.containerEl.empty();
-  }
-  setSuggestions(items: T[]) {
-    this.containerEl.empty();
-    const els: HTMLDivElement[] = [];
-
-    items.forEach((item) => {
-      const suggestionEl = this.containerEl.createDiv("suggestion-item");
-      this.owner.renderSuggestion(item, suggestionEl);
-      els.push(suggestionEl);
-    });
-    this.items = items;
-    this.suggestions = els;
-    this.setSelectedItem(0, false);
-  }
-  useSelectedItem(event: MouseEvent | KeyboardEvent) {
-    if (!this.items || !this.items.length) {
-      return;
-    }
-    const currentValue = this.items[this.selectedItem];
-    if (currentValue) {
-      this.owner.selectSuggestion(currentValue, event);
-    }
-  }
-  wrap(value: number, size: number): number {
-    return ((value % size) + size) % size;
-  }
-  setSelectedItem(index: number, scroll: boolean) {
-    const nIndex = this.wrap(index, this.suggestions.length);
-    const prev = this.suggestions[this.selectedItem];
-    const next = this.suggestions[nIndex];
-
-    if (prev) {
-      prev.removeClass("is-selected");
-    }
-    if (next) {
-      next.addClass("is-selected");
-    }
-
-    this.selectedItem = nIndex;
-
-    if (scroll) {
-      next.scrollIntoView(false);
-    }
-  }
-}
-
-export abstract class SuggestionModal<T> extends FuzzySuggestModal<T> {
-  items: T[] = [];
-  suggestions: HTMLDivElement[];
-  popper: WeakRef<PopperInstance>;
-  //@ts-ignore
-  scope: Scope = new Scope(this.app.scope);
-  suggester: Suggester<FuzzyMatch<T>>;
-  suggestEl: HTMLDivElement;
-  promptEl: HTMLDivElement;
-  emptyStateText: string = "No match found";
-  limit: number = 100;
-  shouldNotOpen: boolean;
-  constructor(app: App, inputEl: HTMLInputElement, items: T[]) {
-    super(app);
-    this.inputEl = inputEl;
-    this.items = items;
-
-    this.suggestEl = createDiv("suggestion-container");
-
-    this.contentEl = this.suggestEl.createDiv("suggestion");
-
-    this.suggester = new Suggester(this, this.contentEl, this.scope);
-
-    this.scope.register([], "Escape", this.onEscape.bind(this));
-
-    this.inputEl.addEventListener("input", this.onInputChanged.bind(this));
-    this.inputEl.addEventListener("focus", this.onFocus.bind(this));
-    this.inputEl.addEventListener("blur", this.close.bind(this));
-    this.suggestEl.on(
-      "mousedown",
-      ".suggestion-container",
-      (event: MouseEvent) => {
-        event.preventDefault();
-      },
-    );
-  }
-  empty() {
-    this.suggester.empty();
-  }
-  onInputChanged(): void {
-    if (this.shouldNotOpen) {
-      return;
-    }
-    const inputStr = this.modifyInput(this.inputEl.value);
-    const suggestions = this.getSuggestions(inputStr);
-    if (suggestions.length > 0) {
-      this.suggester.setSuggestions(suggestions.slice(0, this.limit));
-    } else {
-      this.onNoSuggestion();
-    }
-    this.open();
-  }
-  onFocus(): void {
-    this.shouldNotOpen = false;
-    this.onInputChanged();
-  }
-  modifyInput(input: string): string {
-    return input;
-  }
-  onNoSuggestion() {
-    this.empty();
-    this.renderSuggestion(null, this.contentEl.createDiv("suggestion-item"));
-  }
-  open(): void {
-    // TODO: Figure out a better way to do this. Idea from Periodic Notes plugin
-    this.app.keymap.pushScope(this.scope);
-
-    this.inputEl.ownerDocument.body.appendChild(this.suggestEl);
-    this.popper = new WeakRef(createPopper(this.inputEl, this.suggestEl, {
-      placement: "bottom-start",
-      modifiers: [
-        {
-          name: "offset",
-          options: {
-            offset: [0, 10],
-          },
-        },
-        {
-          name: "flip",
-          options: {
-            fallbackPlacements: ["top"],
-          },
-        },
-      ],
-    }));
-  }
-
-  onEscape(): void {
-    this.close();
-    this.shouldNotOpen = true;
-  }
-  close(): void {
-    // TODO: Figure out a better way to do this. Idea from Periodic Notes plugin
-    this.app.keymap.popScope(this.scope);
-
-    this.suggester.setSuggestions([]);
-    if (this.popper?.deref()) {
-      this.popper.deref().destroy();
-    }
-
-    this.inputEl.removeEventListener("input", this.onInputChanged.bind(this));
-    this.inputEl.removeEventListener("focus", this.onFocus.bind(this));
-    this.inputEl.removeEventListener("blur", this.close.bind(this));
-
-    this.suggestEl.detach(); 
-  }
-  createPrompt(prompts: HTMLSpanElement[]) {
-    if (!this.promptEl) {
-      this.promptEl = this.suggestEl.createDiv("prompt-instructions");
-    }
-    const prompt = this.promptEl.createDiv("prompt-instruction");
-    for (const p of prompts) {
-      prompt.appendChild(p);
-    }
-  }
-  abstract onChooseItem(item: T, evt: MouseEvent | KeyboardEvent): void;
-  abstract getItemText(arg: T): string;
-  abstract getItems(): T[];
-}
-
-export class PathSuggestionModal extends SuggestionModal<
-  TFile | BlockCache | HeadingCache
-> {
-  file: TFile;
-  files: TFile[];
-  text: TextComponent;
-  cache: CachedMetadata;
-  constructor(app: App, input: TextComponent, items: TFile[]) {
-    super(app, input.inputEl, items);
-    this.files = [...items];
-    this.text = input;
-    //this.getFile();
-
-    this.inputEl.addEventListener("input", this.getFile.bind(this));
-  }
-
-  getFile() {
-    const v = this.inputEl.value;
-    const file = this.app.metadataCache.getFirstLinkpathDest(
-      v.split(/[\^#]/).shift() || "",
-      "",
-    );
-    if (file == this.file) {
-      return;
-    }
-    this.file = file;
-    if (this.file) {
-      this.cache = this.app.metadataCache.getFileCache(this.file);
-    }
-    this.onInputChanged();
-  }
-  getItemText(item: TFile | HeadingCache | BlockCache) {
-    if (item instanceof TFile) {
-      return item.path;
-    }
-    if (Object.prototype.hasOwnProperty.call(item, "heading")) {
-      return (<HeadingCache>item).heading;
-    }
-    if (Object.prototype.hasOwnProperty.call(item, "id")) {
-      return (<BlockCache>item).id;
-    }
-  }
-  onChooseItem(item: TFile | HeadingCache | BlockCache) {
-    if (item instanceof TFile) {
-      this.text.setValue(item.basename);
-      this.file = item;
-      this.cache = this.app.metadataCache.getFileCache(this.file);
-    } else if (Object.prototype.hasOwnProperty.call(item, "heading")) {
-      this.text.setValue(
-        `${this.file.basename}#${(<HeadingCache>item).heading}`,
-      );
-    } else if (Object.prototype.hasOwnProperty.call(item, "id")) {
-      this.text.setValue(`${this.file.basename}^${(<BlockCache>item).id}`);
-    }
-  }
-  selectSuggestion({ item }: FuzzyMatch<TFile | BlockCache | HeadingCache>) {
-    let link: string;
-    if (item instanceof TFile) {
-      link = item.basename;
-    } else if (Object.prototype.hasOwnProperty.call(item, "heading")) {
-      link = `${this.file.basename}#${(<HeadingCache>item).heading}`;
-    } else if (Object.prototype.hasOwnProperty.call(item, "id")) {
-      link = `${this.file.basename}^${(<BlockCache>item).id}`;
-    }
-
-    this.text.setValue(link);
-    this.onClose();
-
-    this.close();
-  }
-  renderSuggestion(
-    result: FuzzyMatch<TFile | BlockCache | HeadingCache>,
-    el: HTMLElement,
-  ) {
-    const { item, match: matches } = result || {};
-    const content = el.createDiv({
-      cls: "suggestion-content",
-    });
-    if (!item) {
-      content.setText(this.emptyStateText);
-      content.parentElement.addClass("is-selected");
-      return;
-    }
-
-    if (item instanceof TFile) {
-      const pathLength = item.path.length - item.name.length;
-      const matchElements = matches.matches.map((m) => {
-        return createSpan("suggestion-highlight");
-      });
-      for (
-        let i = pathLength;
-        i < item.path.length - item.extension.length - 1;
-        i++
-      ) {
-        const match = matches.matches.find((m) => m[0] === i);
-        if (match) {
-          const element = matchElements[matches.matches.indexOf(match)];
-          content.appendChild(element);
-          element.appendText(item.path.substring(match[0], match[1]));
-
-          i += match[1] - match[0] - 1;
-          continue;
-        }
-
-        content.appendText(item.path[i]);
-      }
-      el.createDiv({
-        cls: "suggestion-note",
-        text: item.path,
-      });
-    } else if (Object.prototype.hasOwnProperty.call(item, "heading")) {
-      content.setText((<HeadingCache>item).heading);
-      content.prepend(
-        createSpan({
-          cls: "suggestion-flair",
-          text: `H${(<HeadingCache>item).level}`,
-        }),
-      );
-    } else if (Object.prototype.hasOwnProperty.call(item, "id")) {
-      content.setText((<BlockCache>item).id);
-    }
-  }
-  get headings() {
-    if (!this.file) {
-      return [];
-    }
-    if (!this.cache) {
-      this.cache = this.app.metadataCache.getFileCache(this.file);
-    }
-    return this.cache.headings || [];
-  }
-  get blocks() {
-    if (!this.file) {
-      return [];
-    }
-    if (!this.cache) {
-      this.cache = this.app.metadataCache.getFileCache(this.file);
-    }
-    return Object.values(this.cache.blocks || {}) || [];
-  }
-  getItems() {
-    const v = this.inputEl.value;
-    if (/#/.test(v)) {
-      this.modifyInput = (i) => i.split(/#/).pop();
-      return this.headings;
-    } else if (/\^/.test(v)) {
-      this.modifyInput = (i) => i.split(/\^/).pop();
-      return this.blocks;
-    }
-    return this.files;
-  }
-}
-
-export class FolderSuggestionModal extends SuggestionModal<TFolder> {
-  text: TextComponent;
-  cache: CachedMetadata;
-  folders: TFolder[];
-  folder: TFolder;
-  constructor(app: App, input: TextComponent, items: TFolder[]) {
-    super(app, input.inputEl, items);
-    this.folders = [...items];
-    this.text = input;
-
-    this.inputEl.addEventListener("input", () => this.getFolder());
-  }
-  getFolder() {
-    const v = this.inputEl.value;
-    const folder = this.app.vault.getAbstractFileByPath(v);
-    if (folder == this.folder) {
-      return;
-    }
-    if (!(folder instanceof TFolder)) {
-      return;
-    }
-    this.folder = folder;
-
-    this.onInputChanged();
-  }
-  getItemText(item: TFolder) {
-    return item.path;
-  }
-  onChooseItem(item: TFolder) {
-    this.text.setValue(item.path);
-    this.folder = item;
-  }
-  selectSuggestion({ item }: FuzzyMatch<TFolder>) {
-    const link = item.path;
-
-    this.text.setValue(link);
-    this.onClose();
-
-    this.close();
-  }
-  renderSuggestion(result: FuzzyMatch<TFolder>, el: HTMLElement) {
-    const { item, match: matches } = result || {};
-    const content = el.createDiv({
-      cls: "suggestion-content",
-    });
-    if (!item) {
-      content.setText(this.emptyStateText);
-      content.parentElement.addClass("is-selected");
-      return;
-    }
-
-    const pathLength = item.path.length - item.name.length;
-    const matchElements = matches.matches.map((m) => {
-      return createSpan("suggestion-highlight");
-    });
-    for (let i = pathLength; i < item.path.length; i++) {
-      const match = matches.matches.find((m) => m[0] === i);
-      if (match) {
-        const element = matchElements[matches.matches.indexOf(match)];
-        content.appendChild(element);
-        element.appendText(item.path.substring(match[0], match[1]));
-
-        i += match[1] - match[0] - 1;
-        continue;
-      }
-
-      content.appendText(item.path[i]);
-    }
-    el.createDiv({
-      cls: "suggestion-note",
-      text: item.path,
-    });
-  }
-
-  getItems() {
-    return this.folders;
-  }
-}
-
-export class FileSuggestionModal extends SuggestionModal<TFile> {
-  text: TextComponent;
-  cache: CachedMetadata;
-  files: TFile[];
-  file: TFile;
-  constructor(app: App, input: TextComponent, items: TFile[]) {
-    super(app, input.inputEl, items);
-    this.limit = 20;
-    this.files = [...items];
-    this.text = input;
-    this.inputEl.addEventListener("input", () => this.getFile());
-  }
-
-  getFile() {
-    const v = this.inputEl.value;
-    const file = this.app.vault.getAbstractFileByPath(v);
-    if (file === this.file) {
-      return;
-    }
-    if (!(file instanceof TFile)) {
-      return;
-    }
-    this.file = file;
-
-    this.onInputChanged();
-  }
-
-  getSelectedItem() {
-    return this.file;
-  }
-
-  getItemText(item: TFile) {
-    return item.path;
-  }
-
-  onChooseItem(item: TFile) {
-    this.file = item;
-    this.text.setValue(item.path);
-    this.text.onChanged();
-  }
-
-  selectSuggestion({ item }: FuzzyMatch<TFile>) {
-    this.file = item;
-    this.text.setValue(item.path);
-    this.onClose();
-    this.text.onChanged();
-    this.close();
-  }
-  
-  renderSuggestion(result: FuzzyMatch<TFile>, el: HTMLElement) {
-    const { item, match: matches } = result || {};
-    const content = el.createDiv({
-      cls: "suggestion-content",
-    });
-    if (!item) {
-      content.setText(this.emptyStateText);
-      content.parentElement.addClass("is-selected");
-      return;
-    }
-
-    const pathLength = item.path.length - item.name.length;
-    const matchElements = matches.matches.map((m) => {
-      return createSpan("suggestion-highlight");
-    });
-    for (let i = pathLength; i < item.path.length; i++) {
-      const match = matches.matches.find((m) => m[0] === i);
-      if (match) {
-        const element = matchElements[matches.matches.indexOf(match)];
-        content.appendChild(element);
-        element.appendText(item.path.substring(match[0], match[1]));
-
-        i += match[1] - match[0] - 1;
-        continue;
-      }
-
-      content.appendText(item.path[i]);
-    }
-    el.createDiv({
-      cls: "suggestion-note",
-      text: item.path,
-    });
-  }
-
-  getItems() {
-    return this.files;
-  }
-}

src/dialogs/InsertLinkDialog.ts

@@ -1,71 +0,0 @@
-import { App, FuzzySuggestModal, TFile } from "obsidian";
-import { REG_LINKINDEX_INVALIDCHARS } from "../constants/constants";
-import { t } from "../lang/helpers";
-import ExcalidrawPlugin from "src/main";
-import { getLink } from "src/utils/FileUtils";
-
-export class InsertLinkDialog extends FuzzySuggestModal<TFile> {
-  private addText: Function;
-  private drawingPath: string;
-
-  destroy() {
-    this.app = null;
-    this.addText = null;
-    this.drawingPath = null;
-  }
-
-  constructor(private plugin: ExcalidrawPlugin) {
-    super(plugin.app);
-    this.app = plugin.app;
-    this.limit = 20;
-    this.setInstructions([
-      {
-        command: t("SELECT_FILE"),
-        purpose: "",
-      },
-    ]);
-    this.setPlaceholder(t("SELECT_FILE_TO_LINK"));
-    this.emptyStateText = t("NO_MATCH");
-  }
-
-  getItems(): any[] {
-    //https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/422
-    return (
-      this.app.metadataCache
-        //@ts-ignore
-        .getLinkSuggestions()
-        //@ts-ignore
-        .filter((x) => !x.path.match(REG_LINKINDEX_INVALIDCHARS))
-    );
-  }
-
-  getItemText(item: any): string {
-    return item.path + (item.alias ? `|${item.alias}` : "");
-  }
-
-  onChooseItem(item: any): void {
-    let filepath = item.path;
-    if (item.file) {
-      filepath = this.app.metadataCache.fileToLinktext(
-        item.file,
-        this.drawingPath,
-        true,
-      );
-    }
-    const link = getLink(this.plugin,{embed: false, path: filepath, alias: item.alias});
-    this.addText(getLink(this.plugin,{embed: false, path: filepath, alias: item.alias}), filepath, item.alias);
-  }
-
-  onClose(): void {
-    window.setTimeout(()=>{
-      this.addText = null
-    }); //make sure this happens after onChooseItem runs
-    super.onClose();
-  }
-
-  public start(drawingPath: string, addText: Function) {
-    this.addText = addText;
-    this.drawingPath = drawingPath;
-    this.open();
-  }
-}

src/lang/helpers.ts

@@ -1,7 +1,32 @@
 //Solution copied from obsidian-kanban: https://github.com/mgmeyers/obsidian-kanban/blob/44118e25661bff9ebfe54f71ae33805dc88ffa53/src/lang/helpers.ts
 
-import { moment } from "obsidian";
-import { errorlog } from "src/utils/Utils";
+import { LOCALE } from "src/constants/constants";
+import en from "./locale/en";
+
+declare const PLUGIN_LANGUAGES: Record<string, string>;
+declare var LZString: any;
+
+let locale: Partial<typeof en> | null = null;
+
+function loadLocale(lang: string): Partial<typeof en> {
+  if (Object.keys(PLUGIN_LANGUAGES).includes(lang)) {
+    const decompressed = LZString.decompressFromBase64(PLUGIN_LANGUAGES[lang]);
+    let x = {};
+    eval(decompressed);
+    return x;
+  } else {
+    return en;
+  }
+}
+
+export function t(str: keyof typeof en): string {
+  if (!locale) {
+    locale = loadLocale(LOCALE);
+  }
+  return (locale && locale[str]) || en[str];
+}
+
+/*
 import ar from "./locale/ar";
 import cz from "./locale/cz";
 import da from "./locale/da";
@@ -51,11 +76,4 @@ const localeMap: { [k: string]: Partial<typeof en> } = {
   tr,
   "zh-cn": zhCN,
   "zh-tw": zhTW,
-};
-
-const locale = localeMap[LOCALE];
-
-export function t(str: keyof typeof en): string {
-
-  return (locale && locale[str]) || en[str];
-}
+};*/

src/lang/locale/en.ts

@@ -1,13 +1,17 @@
 import {
   DEVICE,
   FRONTMATTER_KEYS,
+  CJK_FONTS,
 } from "src/constants/constants";
 import { TAG_AUTOEXPORT, TAG_MDREADINGMODE, TAG_PDFEXPORT } from "src/constants/constSettingsTags";
-import { labelALT, labelCTRL, labelMETA, labelSHIFT } from "src/utils/ModifierkeyHelper";
+import { labelALT, labelCTRL, labelMETA, labelSHIFT } from "src/utils/modifierkeyHelper";
+
+declare const PLUGIN_VERSION:string;
 
-const CJK_FONTS = "CJK Fonts";
 // English
 export default {
+  // Sugester
+  SELECT_FILE_TO_INSERT: "Select a file to insert",
   // main.ts
   CONVERT_URL_TO_FILE: "Save image from URL to local file",
   UNZIP_CURRENT_FILE: "Decompress current Excalidraw file",
@@ -76,6 +80,7 @@ export default {
   IMPORT_SVG_CONTEXTMENU: "Convert SVG to strokes - with limitations",
   INSERT_MD: "Insert markdown file from vault",
   INSERT_PDF: "Insert PDF file from vault",
+  INSERT_LAST_ACTIVE_PDF_PAGE_AS_IMAGE: "Insert last active PDF page as image",
   UNIVERSAL_ADD_FILE: "Insert ANY file",
   INSERT_CARD: "Add back-of-note card",
   CONVERT_CARD_TO_FILE: "Move back-of-note card to File",
@@ -101,7 +106,11 @@ export default {
   FONTS_LOADED: "Excalidraw: CJK Fonts loaded",
   FONTS_LOAD_ERROR: "Excalidraw: Could not find CJK Fonts in the assets folder\n",
 
+  //Prompt.ts
+  SELECT_LINK_TO_OPEN: "Select a link to open",
+
   //ExcalidrawView.ts
+  ERROR_CANT_READ_FILEPATH: "Error, can't read file path. Importing file instead",
   NO_SEARCH_RESULT: "Didn't find a matching element in the drawing",
   FORCE_SAVE_ABORTED: "Force Save aborted because saving is in progress",
   LINKLIST_SECOND_ORDER_LINK: "Second Order Link",
@@ -322,6 +331,11 @@ FILENAME_HEAD: "Filename",
     "i.e. you are not using Excalidraw markdown files.<br><b><u>Toggle ON:</u></b> filename ends with .excalidraw.md<br><b><u>Toggle OFF:</u></b> filename ends with .md",
   DISPLAY_HEAD: "Excalidraw appearance and behavior",
   DISPLAY_DESC: "In the 'appearance and behavior' section of Excalidraw Settings, you can fine-tune how Excalidraw appears and behaves. This includes options for dynamic styling, left-handed mode, matching Excalidraw and Obsidian themes, default modes, and more.",
+  OVERRIDE_OBSIDIAN_FONT_SIZE_NAME: "Limit Obsidian Font Size to Editor Text",
+  OVERRIDE_OBSIDIAN_FONT_SIZE_DESC:
+    "Obsidian's custom font size setting affects the entire interface, including Excalidraw and themes that depend on the default font size. " +
+    "Enabling this option restricts font size changes to editor text, which will improve the look of Excalidraw. " +
+    "If parts of the UI look incorrect after enabling, try turning this setting off.",  
   DYNAMICSTYLE_NAME: "Dynamic styling",
   DYNAMICSTYLE_DESC:
     "Change Excalidraw UI colors to match the canvas color",
@@ -896,6 +910,8 @@ FILENAME_HEAD: "Filename",
   ES_YOUTUBE_START_INVALID: "The YouTube Start Time is invalid. Please check the format and try again",
   ES_FILENAME_VISIBLE: "Filename Visible",
   ES_BACKGROUND_HEAD: "Embedded note background color",
+  ES_BACKGROUND_DESC_INFO: "Click here for more info on colors",
+  ES_BACKGROUND_DESC_DETAIL: "Background color affects only the preview mode of the markdown embeddable. When editing, it follows the Obsidian light/dark theme as set for the scene (via document property) or in plugin settings. The background color has two layers: the element background color (lower layer) and a color on top (upper layer). Selecting 'Match Element Background' means both layers follow the element color. Selecting 'Match Canvas' or a specific background color keeps the element background layer. Setting opacity (e.g., 50%) mixes the canvas or selected color with the element background color. To remove the element background layer, set the element color to transparent in Excalidraw's element properties editor. This makes only the upper layer effective.",
   ES_BACKGROUND_MATCH_ELEMENT: "Match Element Background Color",
   ES_BACKGROUND_MATCH_CANVAS: "Match Canvas Background Color",
   ES_BACKGROUND_COLOR: "Background Color",
@@ -955,4 +971,33 @@ FILENAME_HEAD: "Filename",
   IPM_GROUP_PAGES_DESC: "This will group all pages into a single group. This is recommended if you are locking the pages after import, because the group will be easier to unlock later rather than unlocking one by one.",
   IPM_SELECT_PDF: "Please select a PDF file",
 
+  //Utils.ts
+  UPDATE_AVAILABLE: `A newer version of Excalidraw is available in Community Plugins.\n\nYou are using ${PLUGIN_VERSION}.\nThe latest is`,
+  ERROR_PNG_TOO_LARGE: "Error exporting PNG - PNG too large, try a smaller resolution",
+
+  //modifierkeyHelper.ts
+  // WebBrowserDragAction
+  WEB_DRAG_IMPORT_IMAGE: "Import Image to Vault",
+  WEB_DRAG_IMAGE_URL: "Insert Image or YouTube Thumbnail with URL",
+  WEB_DRAG_LINK: "Insert Link", 
+  WEB_DRAG_EMBEDDABLE: "Insert Interactive-Frame",
+
+  // LocalFileDragAction
+  LOCAL_DRAG_IMPORT: "Import external file or reuse existing file if path is from the Vault",
+  LOCAL_DRAG_IMAGE: "Insert Image: with local URI or internal-link if from Vault",
+  LOCAL_DRAG_LINK: "Insert Link: local URI or internal-link if from Vault",
+  LOCAL_DRAG_EMBEDDABLE: "Insert Interactive-Frame: local URI or internal-link if from Vault",
+
+  // InternalDragAction  
+  INTERNAL_DRAG_IMAGE: "Insert Image",
+  INTERNAL_DRAG_IMAGE_FULL: "Insert Image @100%",
+  INTERNAL_DRAG_LINK: "Insert Link",
+  INTERNAL_DRAG_EMBEDDABLE: "Insert Interactive-Frame",
+
+  // LinkClickAction
+  LINK_CLICK_ACTIVE: "Open in current active window",
+  LINK_CLICK_NEW_PANE: "Open in a new adjacent window",
+  LINK_CLICK_POPOUT: "Open in a popout window",
+  LINK_CLICK_NEW_TAB: "Open in a new tab",
+  LINK_CLICK_MD_PROPS: "Show the Markdown image-properties dialog (only relevant if you have embedded a markdown document as an image)",
 };

src/lang/locale/ru.ts

@@ -1,9 +1,6 @@
-import {
-  DEVICE,
-  FRONTMATTER_KEYS,
-} from "src/constants/constants";
+import { DEVICE, FRONTMATTER_KEYS, CJK_FONTS } from "src/constants/constants";
 import { TAG_AUTOEXPORT, TAG_MDREADINGMODE, TAG_PDFEXPORT } from "src/constants/constSettingsTags";
-import { labelALT, labelCTRL, labelMETA, labelSHIFT } from "src/utils/ModifierkeyHelper";
+import { labelALT, labelCTRL, labelMETA, labelSHIFT } from "src/utils/modifierkeyHelper";
 
 // русский
 export default {

src/lang/locale/zh-cn.ts

@@ -1,13 +1,17 @@
 import {
   DEVICE,
   FRONTMATTER_KEYS,
+  CJK_FONTS
 } from "src/constants/constants";
 import { TAG_AUTOEXPORT, TAG_MDREADINGMODE, TAG_PDFEXPORT } from "src/constants/constSettingsTags";
-import { labelALT, labelCTRL, labelMETA, labelSHIFT } from "src/utils/ModifierkeyHelper";
+import { labelALT, labelCTRL, labelMETA, labelSHIFT } from "src/utils/modifierkeyHelper";
+
+declare const PLUGIN_VERSION:string;
 
-const CJK_FONTS = "CJK Fonts";
 // 简体中文
 export default {
+  // Sugester
+  SELECT_FILE_TO_INSERT: "选择一个要插入的文件",
   // main.ts
   CONVERT_URL_TO_FILE: "从 URL 下载图像到本地",
   UNZIP_CURRENT_FILE: "解压当前 Excalidraw 文件",
@@ -76,6 +80,7 @@ export default {
   IMPORT_SVG_CONTEXTMENU: "转换 SVG 到线条 - 有限制",
   INSERT_MD: "插入 Markdown 文档（以图像形式嵌入）到当前绘图中",
   INSERT_PDF: "插入 PDF 文档（以图像形式嵌入）到当前绘图中",
+  INSERT_LAST_ACTIVE_PDF_PAGE_AS_IMAGE: "将最后激活的 PDF 页面插入为图片",
   UNIVERSAL_ADD_FILE: "插入任意文件（以交互形式嵌入，或者以图像形式嵌入）到当前绘图中",
   INSERT_CARD: "插入“背景笔记”卡片",
   CONVERT_CARD_TO_FILE: "将“背景笔记”卡片保存到文件",
@@ -101,7 +106,11 @@ export default {
   FONTS_LOADED : "Excalidraw: CJK 字体已加载" ,
   FONTS_LOAD_ERROR : "Excalidraw: 在资源文件夹下找不到 CJK 字体\n" ,
 
+  //Prompt.ts
+  SELECT_LINK_TO_OPEN: "选择要打开的链接",
+
   //ExcalidrawView.ts
+  ERROR_CANT_READ_FILEPATH : "错误，无法读取文件路径。正在改为导入文件",
   NO_SEARCH_RESULT: "在绘图中未找到匹配的元素",
   FORCE_SAVE_ABORTED: "自动保存被中止，因为文件正在保存中",
   LINKLIST_SECOND_ORDER_LINK: "二级链接",
@@ -321,7 +330,12 @@ FILENAME_HEAD: "文件名",
     "该选项在兼容模式（即非 Excalidraw 专用 Markdown 文件）下不会生效。<br>" +
     "<b>开启：</b>使用 .excalidraw.md 作为扩展名。<br><b>关闭：</b>使用 .md 作为扩展名。",
   DISPLAY_HEAD: "界面 & 行为",
-  DISPLAY_DESC: "包括：左手模式，主题匹配，缩放，激光笔工具，修饰键等的设置。",
+  DISPLAY_DESC: "在 Excalidraw 设置的 '外观和行为' 部分，您可以微调 Excalidraw 的外观和行为。这包括动态样式、左手模式、匹配 Excalidraw 和 Obsidian 主题、默认模式等选项。",
+  OVERRIDE_OBSIDIAN_FONT_SIZE_NAME : "限制 Obsidian 字体大小为编辑器文本" ,
+  OVERRIDE_OBSIDIAN_FONT_SIZE_DESC :
+    "Obsidian 的自定义字体大小设置会影响整个界面，包括 Excalidraw 和依赖默认字体大小的主题。" +
+    "启用此选项将限制字体大小更改为编辑器文本，这将改善 Excalidraw 的外观。" +
+    "如果启用后发现界面的某些部分看起来不正确，请尝试关闭此设置。" ,
   DYNAMICSTYLE_NAME: "动态样式",
   DYNAMICSTYLE_DESC:
     "根据画布颜色自动调节 Excalidraw 界面颜色",
@@ -866,6 +880,7 @@ FILENAME_HEAD: "文件名",
         对此带来的不便，我深表歉意。
       </p>
     `,
+
   //ObsidianMenu.tsx
   GOTO_FULLSCREEN: "进入全屏模式",
   EXIT_FULLSCREEN: "退出全屏模式",
@@ -895,6 +910,8 @@ FILENAME_HEAD: "文件名",
   ES_YOUTUBE_START_INVALID: "YouTube 起始时间无效。请检查格式并重试",
   ES_FILENAME_VISIBLE: "显示文件名",
   ES_BACKGROUND_HEAD: "背景色",
+  ES_BACKGROUND_DESC_INFO : "点击此处了解更多颜色信息" ,
+  ES_BACKGROUND_DESC_DETAIL : "背景颜色仅影响 Markdown 嵌入预览模式。在编辑模式下，它会根据场景（通过文档属性设置）或插件设置，遵循 Obsidian 的浅色/深色主题。背景颜色有两层：元素背景颜色（下层）和上层颜色。选择“匹配元素背景”意味着两层都遵循元素颜色。选择“匹配画布”或特定背景颜色时，保留元素背景层。设置透明度（例如 50%）会将画布或选定的颜色与元素背景颜色混合。要移除元素背景层，可以在 Excalidraw 的元素属性编辑器中将元素颜色设置为透明，这样只有上层颜色生效。" ,
   ES_BACKGROUND_MATCH_ELEMENT: "匹配元素背景色",
   ES_BACKGROUND_MATCH_CANVAS: "匹配画布背景色",
   ES_BACKGROUND_COLOR: "背景色",
@@ -954,4 +971,33 @@ FILENAME_HEAD: "文件名",
   IPM_GROUP_PAGES_DESC: "这将把所有页面建立为一个单独的组。如果您在导入后锁定页面，建议使用此方法，因为这样可以更方便地解锁整个组，而不是逐个解锁。",
   IPM_SELECT_PDF: "请选择一个 PDF 文件",
 
+  //Utils.ts
+  UPDATE_AVAILABLE: `Excalidraw 的新版本已在社区插件中可用。\n\n您正在使用 ${PLUGIN_VERSION}。\n最新版本是`,
+  ERROR_PNG_TOO_LARGE: "导出 PNG 时出错 - PNG 文件过大，请尝试较小的分辨率",
+
+  // ModifierkeyHelper.ts
+  // WebBrowserDragAction
+  WEB_DRAG_IMPORT_IMAGE : "导入图片到 Vault" ,
+  WEB_DRAG_IMAGE_URL : "通过 URL 插入图片或 YouTube 缩略图" ,
+  WEB_DRAG_LINK : "插入链接" ,
+  WEB_DRAG_EMBEDDABLE : "插入交互框架" ,
+
+  // LocalFileDragAction
+  LOCAL_DRAG_IMPORT : "导入外部文件，或在路径来自 Vault 时复用现有文件" ,
+  LOCAL_DRAG_IMAGE : "插入图片：使用本地 URI，或在路径来自 Vault 时使用内部链接" ,
+  LOCAL_DRAG_LINK : "插入链接：使用本地 URI，或在路径来自 Vault 时使用内部链接" ,
+  LOCAL_DRAG_EMBEDDABLE : "插入交互框架：使用本地 URI，或在路径来自 Vault 时使用内部链接" ,
+
+  // InternalDragAction
+  INTERNAL_DRAG_IMAGE : "插入图片" ,
+  INTERNAL_DRAG_IMAGE_FULL : "插入图片（100% 尺寸）" ,
+  INTERNAL_DRAG_LINK : "插入链接" ,
+  INTERNAL_DRAG_EMBEDDABLE : "插入交互框架" ,
+
+  // LinkClickAction
+  LINK_CLICK_ACTIVE : "在当前活动窗口中打开" ,
+  LINK_CLICK_NEW_PANE : "在相邻的新窗口中打开" ,
+  LINK_CLICK_POPOUT : "在弹出窗口中打开" ,
+  LINK_CLICK_NEW_TAB : "在新标签页中打开" ,
+  LINK_CLICK_MD_PROPS : "显示 Markdown 图片属性对话框（仅在嵌入 Markdown 文档为图片时适用）" ,
 };

src/shared/CropImage.ts

@@ -3,10 +3,11 @@ import { BinaryFileData } from "@zsviczian/excalidraw/types/excalidraw/types";
 import { Mutable } from "@zsviczian/excalidraw/types/excalidraw/utility-types";
 import { Notice } from "obsidian";
 
-import { getEA } from "src";
-import { ExcalidrawAutomate, cloneElement } from "src/ExcalidrawAutomate";
-import { ExportSettings } from "src/ExcalidrawView";
+import { getEA } from "src/core";
+import { ExcalidrawAutomate, cloneElement } from "src/shared/ExcalidrawAutomate";
+import { ExportSettings } from "src/view/ExcalidrawView";
 import { nanoid } from "src/constants/constants";
+import { svgToBase64 } from "../utils/utils";
 
 export class CropImage {
   private imageEA: ExcalidrawAutomate;
@@ -170,7 +171,7 @@ export class CropImage {
           1 // image quality (0 - 1)
         );
       };
-      image.src = `data:image/svg+xml;base64,${btoa(unescape(encodeURIComponent(svgData)))}`;
+      image.src = svgToBase64(svgData);
     });
   }
 

src/shared/Dialogs/EmbeddableMDFileCustomDataSettingsComponent.ts

@@ -1,6 +1,6 @@
 import { Setting, ToggleComponent } from "obsidian";
 import { EmbeddableMDCustomProps } from "./EmbeddableSettings";
-import { fragWithHTML } from "src/utils/Utils";
+import { fragWithHTML } from "src/utils/utils";
 import { t } from "src/lang/helpers";
 
 export class EmbeddalbeMDFileCustomDataSettingsComponent {
@@ -46,6 +46,16 @@ export class EmbeddalbeMDFileCustomDataSettingsComponent {
           );
       }
       contentEl.createEl("h4",{text: t("ES_BACKGROUND_HEAD")});
+      const descDiv = contentEl.createDiv({ cls: "excalidraw-setting-desc" });
+      descDiv.textContent = t("ES_BACKGROUND_DESC_INFO");
+
+      descDiv.addEventListener("click", () => {
+        if (descDiv.textContent === t("ES_BACKGROUND_DESC_INFO")) {
+          descDiv.textContent = t("ES_BACKGROUND_DESC_DETAIL");
+        } else {
+          descDiv.textContent = t("ES_BACKGROUND_DESC_INFO");
+        }
+      });
       
       let bgSetting: Setting;  
       let bgMatchElementToggle: ToggleComponent;

src/shared/Dialogs/EmbeddableSettings.ts

@@ -1,16 +1,16 @@
 import { ExcalidrawEmbeddableElement } from "@zsviczian/excalidraw/types/excalidraw/element/types";
 import { Mutable } from "@zsviczian/excalidraw/types/excalidraw/utility-types";
 import { Modal, Notice, Setting, TFile, ToggleComponent } from "obsidian";
-import { getEA } from "src";
-import { ExcalidrawAutomate } from "src/ExcalidrawAutomate";
-import ExcalidrawView from "src/ExcalidrawView";
+import { getEA } from "src/core";
+import { ExcalidrawAutomate } from "src/shared/ExcalidrawAutomate";
+import ExcalidrawView from "src/view/ExcalidrawView";
 import { t } from "src/lang/helpers";
-import ExcalidrawPlugin from "src/main";
-import { getNewUniqueFilepath, getPathWithoutExtension, splitFolderAndFilename } from "src/utils/FileUtils";
-import { addAppendUpdateCustomData, fragWithHTML } from "src/utils/Utils";
+import ExcalidrawPlugin from "src/core/main";
+import { getNewUniqueFilepath, getPathWithoutExtension, splitFolderAndFilename } from "src/utils/fileUtils";
+import { addAppendUpdateCustomData, fragWithHTML } from "src/utils/utils";
 import { getYouTubeStartAt, isValidYouTubeStart, isYouTube, updateYouTubeStartTime } from "src/utils/YoutTubeUtils";
 import { EmbeddalbeMDFileCustomDataSettingsComponent } from "./EmbeddableMDFileCustomDataSettingsComponent";
-import { isWinCTRLorMacCMD } from "src/utils/ModifierkeyHelper";
+import { isWinCTRLorMacCMD } from "src/utils/modifierkeyHelper";
 import { ExcalidrawImperativeAPI } from "@zsviczian/excalidraw/types/excalidraw/types";
 
 export type EmbeddableMDCustomProps = {

src/shared/Dialogs/ExportDialog.ts

@@ -1,11 +1,11 @@
 import { ExcalidrawImperativeAPI } from "@zsviczian/excalidraw/types/excalidraw/types";
 import { Modal, Setting, TFile } from "obsidian";
-import { getEA } from "src";
+import { getEA } from "src/core";
 import { DEVICE } from "src/constants/constants";
-import { ExcalidrawAutomate } from "src/ExcalidrawAutomate";
-import ExcalidrawView from "src/ExcalidrawView";
-import ExcalidrawPlugin from "src/main";
-import { fragWithHTML, getExportPadding, getExportTheme, getPNGScale, getWithBackground, shouldEmbedScene } from "src/utils/Utils";
+import { ExcalidrawAutomate } from "src/shared/ExcalidrawAutomate";
+import ExcalidrawView from "src/view/ExcalidrawView";
+import ExcalidrawPlugin from "src/core/main";
+import { fragWithHTML, getExportPadding, getExportTheme, getPNGScale, getWithBackground, shouldEmbedScene } from "src/utils/utils";
 
 export class ExportDialog extends Modal {
   private ea: ExcalidrawAutomate;

src/shared/Dialogs/FrameSettings.ts

@@ -1,11 +1,11 @@
-import { ExcalidrawAutomate } from "src/ExcalidrawAutomate";
+import { ExcalidrawAutomate } from "src/shared/ExcalidrawAutomate";
 import { t } from "src/lang/helpers";
 
 export const showFrameSettings = (ea: ExcalidrawAutomate) => {
   const {enabled, clip, name, outline} = ea.getExcalidrawAPI().getAppState().frameRendering;
   
   // Create modal dialog
-  const frameSettingsModal = new ea.obsidian.Modal(app);
+  const frameSettingsModal = new ea.obsidian.Modal(ea.plugin.app);
   
   frameSettingsModal.onOpen = () => {
     const {contentEl} = frameSettingsModal;

src/shared/Dialogs/HotkeyEditor.ts

@@ -1,9 +1,9 @@
 import { BaseComponent, Setting, Modifier } from 'obsidian';
 import { DEVICE } from 'src/constants/constants';
 import { t } from 'src/lang/helpers';
-import { ExcalidrawSettings } from 'src/settings';
-import { modifierLabel } from 'src/utils/ModifierkeyHelper';
-import { fragWithHTML } from 'src/utils/Utils';
+import { ExcalidrawSettings } from 'src/core/settings';
+import { modifierLabel } from 'src/utils/modifierkeyHelper';
+import { fragWithHTML } from 'src/utils/utils';
 
 export class HotkeyEditor extends BaseComponent {
   private settings: ExcalidrawSettings;

src/shared/Dialogs/ImportSVGDialog.ts

@@ -1,10 +1,10 @@
 import { App, FuzzySuggestModal, TFile } from "obsidian";
-import { REG_LINKINDEX_INVALIDCHARS } from "../constants/constants";
-import ExcalidrawView from "../ExcalidrawView";
-import { t } from "../lang/helpers";
-import ExcalidrawPlugin from "../main";
-import { getEA } from "src";
-import { ExcalidrawAutomate } from "src/ExcalidrawAutomate";
+import { REG_LINKINDEX_INVALIDCHARS } from "../../constants/constants";
+import ExcalidrawView from "../../view/ExcalidrawView";
+import { t } from "../../lang/helpers";
+import ExcalidrawPlugin from "../../core/main";
+import { getEA } from "src/core";
+import { ExcalidrawAutomate } from "src/shared/ExcalidrawAutomate";
 
 export class ImportSVGDialog extends FuzzySuggestModal<TFile> {
   public plugin: ExcalidrawPlugin;

src/shared/Dialogs/InsertCommandDialog.ts

@@ -1,6 +1,6 @@
 import { App, FuzzySuggestModal, TFile } from "obsidian";
-import { REG_LINKINDEX_INVALIDCHARS } from "../constants/constants";
-import { t } from "../lang/helpers";
+import { REG_LINKINDEX_INVALIDCHARS } from "../../constants/constants";
+import { t } from "../../lang/helpers";
 
 export class InsertCommandDialog extends FuzzySuggestModal<TFile> {
   private addText: Function;

src/shared/Dialogs/InsertImageDialog.ts

@@ -1,10 +1,10 @@
-import { App, FuzzySuggestModal, TFile } from "obsidian";
-import { scaleToFullsizeModifier } from "src/utils/ModifierkeyHelper";
-import { DEVICE, IMAGE_TYPES, REG_LINKINDEX_INVALIDCHARS } from "../constants/constants";
-import ExcalidrawView from "../ExcalidrawView";
-import { t } from "../lang/helpers";
-import ExcalidrawPlugin from "../main";
-import { getEA } from "src";
+import { FuzzySuggestModal, TFile } from "obsidian";
+import { scaleToFullsizeModifier } from "src/utils/modifierkeyHelper";
+import { DEVICE, IMAGE_TYPES, REG_LINKINDEX_INVALIDCHARS } from "../../constants/constants";
+import ExcalidrawView from "../../view/ExcalidrawView";
+import { t } from "../../lang/helpers";
+import ExcalidrawPlugin from "../../core/main";
+import { getEA } from "src/core";
 
 export class InsertImageDialog extends FuzzySuggestModal<TFile> {
   public plugin: ExcalidrawPlugin;

src/shared/Dialogs/InsertLinkDialog.ts

@@ -0,0 +1,142 @@
+import { FuzzyMatch, FuzzySuggestModal, setIcon } from "obsidian";
+import { AUDIO_TYPES, CODE_TYPES, ICON_NAME, IMAGE_TYPES, REG_LINKINDEX_INVALIDCHARS, VIDEO_TYPES } from "../../constants/constants";
+import { t } from "../../lang/helpers";
+import ExcalidrawPlugin from "src/core/main";
+import { getLink } from "src/utils/fileUtils";
+import { LinkSuggestion } from "src/types/types";
+
+
+export class InsertLinkDialog extends FuzzySuggestModal<LinkSuggestion> {
+  private addText: Function;
+  private drawingPath: string;
+
+  destroy() {
+    this.app = null;
+    this.addText = null;
+    this.drawingPath = null;
+  }
+
+  constructor(private plugin: ExcalidrawPlugin) {
+    super(plugin.app);
+    this.app = plugin.app;
+    this.limit = 20;
+    this.setInstructions([
+      {
+        command: t("SELECT_FILE"),
+        purpose: "",
+      },
+    ]);
+    this.setPlaceholder(t("SELECT_FILE_TO_LINK"));
+    this.emptyStateText = t("NO_MATCH");
+  }
+
+  getItems(): LinkSuggestion[] {
+    //https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/422
+    return (
+      this.app.metadataCache
+        //@ts-ignore
+        .getLinkSuggestions()
+        //@ts-ignore
+        .filter((x) => !x.path.match(REG_LINKINDEX_INVALIDCHARS))
+    );
+  }
+
+  getItemText(item: LinkSuggestion): string {
+    return item.path + (item.alias ? `|${item.alias}` : "");
+  }
+
+  onChooseItem(item: LinkSuggestion): void {
+    let filepath = item.path;
+    if (item.file) {
+      filepath = this.app.metadataCache.fileToLinktext(
+        item.file,
+        this.drawingPath,
+        true,
+      );
+    }
+    const link = getLink(this.plugin,{embed: false, path: filepath, alias: item.alias});
+    this.addText(getLink(this.plugin,{embed: false, path: filepath, alias: item.alias}), filepath, item.alias);
+  }
+
+  renderSuggestion(result: FuzzyMatch<LinkSuggestion>, itemEl: HTMLElement) {
+    const { item, match: matches } = result || {};
+    itemEl.addClass("mod-complex");
+    const contentEl = itemEl.createDiv("suggestion-content");
+    const auxEl = itemEl.createDiv("suggestion-aux");
+    const titleEl = contentEl.createDiv("suggestion-title");
+    const noteEl = contentEl.createDiv("suggestion-note");
+
+    if (!item) {
+      titleEl.setText(this.emptyStateText);
+      itemEl.addClass("is-selected");
+      return;
+    }
+
+    const path = item.file?.path ?? item.path;
+
+    const pathLength = path.length - (item.file?.name.length ?? 0);
+    const matchElements = matches.matches.map((m) => {
+      return createSpan("suggestion-highlight");
+    });
+    const itemText = this.getItemText(item);
+    for (let i = pathLength; i < itemText.length; i++) {
+      const match = matches.matches.find((m) => m[0] === i);
+      if (match) {
+        const element = matchElements[matches.matches.indexOf(match)];
+        titleEl.appendChild(element);
+        element.appendText(itemText.substring(match[0], match[1]));
+
+        i += match[1] - match[0] - 1;
+        continue;
+      }
+
+      titleEl.appendText(itemText[i]);
+    }
+    noteEl.setText(path);
+
+    if(!item.file) {
+      setIcon(auxEl, "ghost");
+    } else if(this.plugin.isExcalidrawFile(item.file)) {
+      setIcon(auxEl, ICON_NAME);
+    } else if (item.file.extension === "md") {
+      setIcon(auxEl, "square-pen");
+    } else if (IMAGE_TYPES.includes(item.file.extension)) {
+      setIcon(auxEl, "image");
+    } else if (VIDEO_TYPES.includes(item.file.extension)) {
+      setIcon(auxEl, "monitor-play");
+    } else if (AUDIO_TYPES.includes(item.file.extension)) {
+      setIcon(auxEl, "file-audio");
+    } else if (CODE_TYPES.includes(item.file.extension)) {
+      setIcon(auxEl, "file-code");
+    } else if (item.file.extension === "canvas") {
+      setIcon(auxEl, "layout-dashboard");
+    } else if (item.file.extension === "pdf") {
+      setIcon(auxEl, "book-open-text");
+    } else {
+      auxEl.setText(item.file.extension);
+    }
+  }
+
+  onClose(): void {
+    window.setTimeout(()=>{
+      this.addText = null
+    }); //make sure this happens after onChooseItem runs
+    super.onClose();
+  }
+
+  private inLink: string;
+  onOpen(): void {
+    super.onOpen();
+    if(this.inLink) {
+      this.inputEl.value = this.inLink;
+      this.inputEl.dispatchEvent(new Event('input'));
+    }
+  }
+
+  public start(drawingPath: string, addText: Function, link?: string) {
+    this.addText = addText;
+    this.drawingPath = drawingPath;
+    this.inLink = link;
+    this.open();
+  }
+}

src/shared/Dialogs/InsertMDDialog.ts

@@ -1,8 +1,8 @@
-import { App, FuzzySuggestModal, TFile } from "obsidian";
-import ExcalidrawView from "../ExcalidrawView";
-import { t } from "../lang/helpers";
-import ExcalidrawPlugin from "../main";
-import { getEA } from "src";
+import { FuzzySuggestModal, TFile } from "obsidian";
+import ExcalidrawView from "../../view/ExcalidrawView";
+import { t } from "../../lang/helpers";
+import ExcalidrawPlugin from "../../core/main";
+import { getEA } from "src/core";
 
 export class InsertMDDialog extends FuzzySuggestModal<TFile> {
   public plugin: ExcalidrawPlugin;

src/shared/Dialogs/InsertPDFModal.ts

@@ -1,11 +1,11 @@
 import { ButtonComponent, TFile, ToggleComponent } from "obsidian";
-import ExcalidrawView from "../ExcalidrawView";
-import ExcalidrawPlugin from "../main";
-import { getPDFDoc } from "src/utils/FileUtils";
+import ExcalidrawView from "../../view/ExcalidrawView";
+import ExcalidrawPlugin from "../../core/main";
+import { getPDFDoc } from "src/utils/fileUtils";
 import {  Modal, Setting, TextComponent } from "obsidian";
-import { FileSuggestionModal } from "./FolderSuggester";
-import { getEA } from "src";
-import { ExcalidrawAutomate } from "src/ExcalidrawAutomate";
+import { FileSuggestionModal } from "../Suggesters/FileSuggestionModal";
+import { getEA } from "src/core";
+import { ExcalidrawAutomate } from "src/shared/ExcalidrawAutomate";
 import { ExcalidrawImperativeAPI } from "@zsviczian/excalidraw/types/excalidraw/types";
 import { t } from "src/lang/helpers";
 
@@ -206,7 +206,11 @@ export class InsertPDFModal extends Modal {
 
     const search = new TextComponent(ce);
     search.inputEl.style.width = "100%";
-    const suggester = new FileSuggestionModal(this.app, search,app.vault.getFiles().filter((f: TFile) => f.extension.toLowerCase() === "pdf"));
+    const suggester = new FileSuggestionModal(
+      this.app,
+      search,this.app.vault.getFiles().filter((f: TFile) => f.extension.toLowerCase() === "pdf"),
+      this.plugin
+    );
     search.onChange(async () => {
       const file = suggester.getSelectedItem();
       await setFile(file);

src/shared/Dialogs/Messages.ts

@@ -0,0 +1,133 @@
+export const FIRST_RUN = `
+The Excalidraw Obsidian plugin is much more than "just" a drawing tool. To help you get started here's a showcase of the key Excalidraw plugin features.
+
+If you'd like to learn more, please subscribe to my YouTube channel: [Visual PKM](https://www.youtube.com/channel/UCC0gns4a9fhVkGkngvSumAQ) where I regularly share videos about Obsidian-Excalidraw and about tools and techniques for Visual Personal Knowledge Management.
+
+Thank you & Enjoy!
+
+<div class="excalidraw-videoWrapper"><div>
+<iframe src="https://www.youtube.com/embed/P_Q6avJGoWI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+</div></div>
+`;
+
+export const RELEASE_NOTES: { [k: string]: string } = {
+  Intro: `After each update you'll be prompted with the release notes. You can disable this in plugin settings.
+
+I develop this plugin as a hobby, spending my free time doing this. If you find it valuable, then please say THANK YOU or...
+
+<div class="ex-coffee-div"><a href="https://ko-fi.com/zsolt"><img src="https://storage.ko-fi.com/cdn/kofi6.png?v=6" border="0" alt="Buy Me a Coffee at ko-fi.com"  height=45></a></div>
+`,
+"2.7.1":`
+## Fixed
+- Deleting excalidraw file from file system while it is open in fullscreen mode in Obsidian causes Obsidian to be stuck in full-screen view [#2161](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2161)
+- Chinese fonts are not rendered in LaTeX statements [#2162](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2162)
+- Since Electron 32 (newer Obsidian Desktop installers) drag and drop links from Finder or OS File Explorer did not work. [Electron breaking change](https://www.electronjs.org/docs/latest/breaking-changes#removed-filepath). This is now fixed
+- Addressed unnecessary image reloads when changing windows in Obsidian
+`,
+"2.7.0":`
+## Fixed
+- Various Markdown embeddable "fuzziness":  
+    - Fixed issues with appearance settings and edit mode toggling when single-click editing is enabled.  
+    - Ensured embeddable file editing no longer gets interrupted unexpectedly.  
+- **Hover Preview**: Disabled hover preview for back-of-the-note cards to reduce distractions.
+- **Settings Save**: Fixed an issue where plugin settings unnecessarily saved on every startup.
+
+## New Features
+- **Image Cropping Snaps to Objects**: When snapping is enabled in the scene, image cropping now aligns to nearby objects.  
+- **Session Persistence for Pen Mode**: Excalidraw remembers the last pen mode when switching between drawings within the same session.
+
+## Refactoring
+- **Mermaid Diagrams**: Excalidraw now uses its own Mermaid package, breaking future dependencies on Obsidian's Mermaid updates. This ensures stability and includes all fixes and improvements made to Excalidraw Mermaid since February 2024. The plugin file size has increased slightly, but this change significantly improves maintainability while remaining invisible to users.  
+- **MathJax Optimization**: MathJax (LaTeX equation SVG image generation) now loads only on demand, with the package compressed to minimize the startup and file size impact caused by the inclusion of Mermaid.  
+- **On-Demand Language Loading**: Non-English language files are now compressed and load only when needed, counterbalancing the increase in file size due to Mermaid and improving load speeds.  
+- **Codebase Restructuring**: Improved type safety by removing many ${String.fromCharCode(96)}//@ts-ignore${String.fromCharCode(96)} commands and enhancing modularity. Introduced new management classes: **CommandManager**, **EventManager**, **PluginFileManager**, **ObserverManager**, and **PackageManager**. Further restructuring is planned for upcoming releases to improve maintainability and stability.
+`,
+"2.6.8":`
+## New
+- **QoL improvements**:
+  - Obsidian-link search button in Element Link Editor.
+  - Add Any File now searches file aliases as well.
+  - Cosmetic changes to file search modals (display path, show file type icon).
+  - Text Element cursor-color matches the text color.
+- New script in script store: [Image Occlusion](https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Image%20Occlusion.md) by [@TrillStones](https://github.com/TrillStones) 🙏
+
+## Fixed
+- Excalidraw icon on the **ribbon menu kept reappearing** every time you reopen Obsidian [#2115](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2115)
+- In pen mode, when **single-finger panning** is enabled, Excalidraw should still **allow actions with the mouse**.
+- When **editing a drawing in split mode** (drawing is on one side, markdown view is on the other), editing the markdown note sometimes causes the drawing to re-zoom and jump away from the selected area.
+- Hover-Editor compatibility resolved [2041](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2041)
+-  ${String.fromCharCode(96)}ExcalidrawAutomate.create() ${String.fromCharCode(96)} will now correctly include the markdown text in templates above Excalidraw Data and below YAML front matter. This also fixes the same issue with the **Deconstruct Selected Element script**.
+
+`,
+"2.6.7":`
+Hoping to finally move on to 2.7.0... but still have one last bug to fix in 2.6.x!
+
+## Fixed
+I misread a line in the Excalidraw package code... ended up breaking image loading in 2.6.6. The icon library script didn't work right, and updating nested drawings caused all images in the scene to be dropped from memory. This led to image-placeholders in exports and broke copy-paste to Excalidraw.com and between drawings. I am surprised no one reported it! 😳
+`,
+"2.6.6":`
+## Fixed
+- Images and LaTeX formulas did not update in the scene when the source was changed until the Excalidraw drawing was closed and reopened. [#2105](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2105)
+`,
+"2.6.5":`
+## Fixed
+- Text sizing issue in the drawing that is first loaded after Obsidian restarts [#2086](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2086)
+- Excalidraw didn't load if there was a file in the Excalidraw folder with a name that starts the same way as the Scripts folder name. [#2095](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2095)
+- **OVERSIZED EXCALIDRAW TOOLBAR**: Added a new setting under "Excalidraw Appearance and Behavior > Theme and Styling" called "Limit Obsidian Font Size to Editor Text." This setting is off by default. When enabled, it restricts Obsidian's custom font size adjustments to editor text only, preventing unintended scaling of Excalidraw UI elements and other themes that rely on the default interface font size. Feel free to experiment with this setting to improve Excalidraw UI consistency. However, because this change affects the broader Obsidian UI, it's recommended to turn it off if any layout issues arise. [#2087](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2087)`,
+"2.6.4":`
+## Fixed
+- Error saving when cropping images embedded from a URL (not from a file in the Vault) [#2096](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2096)
+`,
+"2.6.3":`
+<div class="excalidraw-videoWrapper"><div>
+<iframe src="https://www.youtube.com/embed/OfUWAvCgbXk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+</div></div>
+
+## New
+- **Cropping PDF Pages**  
+  - Improved PDF++ cropping: You can now double-click cropped images in Excalidraw to adjust the crop area, which will also appear as a highlight in PDF++. This feature applies to PDF cut-outs created in version 2.6.3 and beyond.
+- **Insert Last Active PDF Page as Image**  
+  - New command palette action lets you insert the currently active PDF page into Excalidraw. Ideal for setups with PDF and Excalidraw side-by-side. You can assign a hotkey for quicker access. Cropped areas in Excalidraw will show as highlights in PDF++.
+
+## Fixed
+- Fixed **Close Settings** button toggle behavior [#2085](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2085)
+- Resolved text wrapping issues causing layout shifts due to trailing whitespaces [#8714](https://github.com/excalidraw/excalidraw/pull/8714)
+- **Aspect Ratio and Size Reset** commands now function correctly with cropped images.
+- **Cropped Drawings**: Adjustments to cropped Excalidraw drawings are now supported. However, for nested Excalidraw drawings, it's recommended to use area, group, and frame references instead of cropping.
+
+## Refactoring
+- Further font loading optimizations on Excalidraw.com; no impact expected in Obsidian [#8693](https://github.com/excalidraw/excalidraw/pull/8693)
+- Text wrapping improvements [#8715](https://github.com/excalidraw/excalidraw/pull/8715)
+- Plugin initiation and error handling
+`,
+"2.6.2":`
+## Fixed
+- Image scaling issue with SVGs that miss the width and height property. [#8729](https://github.com/excalidraw/excalidraw/issues/8729)
+`,
+"2.6.1":`
+## New
+- Pen-mode single-finger panning enabled also for the "Selection" tool.
+- You can disable pen-mode single-finger panning in Plugin Settings under Excalidraw Appearance and Behavior [#2080](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2080)
+
+## Fixed
+- Text tool did not work in pen-mode using finger [#2080](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2080)
+- Pasting images to Excalidraw from the web resulted in filenames of "image_1.png", "image_2.png" instead of "Pasted Image TIMESTAMP" [#2081](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2081)
+`,
+"2.6.0":`
+## Performance
+- Much faster plugin initialization. Down from 1000-3000ms to 100-300ms. According to my testing speed varies on a wide spectrum depending on device, size of Vault and other plugins being loaded. I measured values ranging from 84ms up to 782ms [#2068](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2068)
+- Faster loading of scenes with many embedded illustrations or PDF pages.
+- SVG export results in even smaller files by further optimizing which characters are included in the embedded fonts. [#8641](https://github.com/excalidraw/excalidraw/pull/8641)
+
+## New
+- Image cropping tool. Double click the image to crop it. [#8613](https://github.com/excalidraw/excalidraw/pull/8613)
+- Single finger panning in pen mode.
+- Native handwritten CJK Font support [8530](https://github.com/excalidraw/excalidraw/pull/8530) 
+  - Created a new **Fonts** section in settings. This includes configuration of the "Local Font" and downloading of the CJK fonts in case you need them offline.
+- Option under **Appearance and Behavior / Link Click** to disable double-click link navigation in view mode. [#2075](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/2075)
+- New RU translation 🙏[@tovBender](https://github.com/tovBender)
+
+## Updated
+- CN translation 🙏[@dmscode](https://github.com/dmscode)
+`,
+};

src/shared/Dialogs/ModifierKeySettings.ts

@@ -1,7 +1,7 @@
 import { Setting } from "obsidian";
 import { DEVICE } from "src/constants/constants";
 import { t } from "src/lang/helpers";
-import { ModifierKeySet, ModifierSetType, modifierKeyTooltipMessages } from "src/utils/ModifierkeyHelper";
+import { ModifierKeySet, ModifierSetType, modifierKeyTooltipMessages } from "src/utils/modifierkeyHelper";
 
 type ModifierKeyCategories = Partial<{
   [modifierSetType in ModifierSetType]: string;

src/shared/Dialogs/OpenDrawing.ts

@@ -1,7 +1,7 @@
 import { App, FuzzySuggestModal, TFile } from "obsidian";
-import ExcalidrawPlugin from "../main";
-import { EMPTY_MESSAGE } from "../constants/constants";
-import { t } from "../lang/helpers";
+import ExcalidrawPlugin from "../../core/main";
+import { EMPTY_MESSAGE } from "../../constants/constants";
+import { t } from "../../lang/helpers";
 
 export enum openDialogAction {
   openFile,

src/shared/Dialogs/PenSettingsModal.ts

@@ -1,13 +1,13 @@
 import { ExcalidrawImperativeAPI } from "@zsviczian/excalidraw/types/excalidraw/types";
 import { ColorComponent, Modal, Setting, TextComponent, ToggleComponent } from "obsidian";
 import { COLOR_NAMES } from "src/constants/constants";
-import ExcalidrawView from "src/ExcalidrawView";
-import ExcalidrawPlugin from "src/main";
-import { setPen } from "src/menu/ObsidianMenu";
-import { ExtendedFillStyle, PenType } from "src/PenTypes";
-import { getExcalidrawViews } from "src/utils/ObsidianUtils";
-import { PENS } from "src/utils/Pens";
-import { fragWithHTML } from "src/utils/Utils";
+import ExcalidrawView from "src/view/ExcalidrawView";
+import ExcalidrawPlugin from "src/core/main";
+import { setPen } from "src/view/components/menu/ObsidianMenu";
+import { ExtendedFillStyle, PenType } from "src/types/penTypes";
+import { getExcalidrawViews } from "src/utils/obsidianUtils";
+import { PENS } from "src/utils/pens";
+import { fragWithHTML } from "src/utils/utils";
 import { __values } from "tslib";
 
 const EASINGFUNCTIONS: Record<string,string> = {
@@ -53,7 +53,7 @@ export class PenSettingsModal extends Modal {
     private view: ExcalidrawView,
     private pen: number,
   ) {
-    super(app);
+    super(plugin.app);
     this.api = view.excalidrawAPI;
 
   }

src/shared/Dialogs/Prompt.ts

@@ -8,21 +8,20 @@ import {
   TFile,
   Notice,
   TextAreaComponent,
-  TFolder,
 } from "obsidian";
-import ExcalidrawView from "../ExcalidrawView";
-import ExcalidrawPlugin from "../main";
-import { escapeRegExp, getLinkParts, sleep } from "../utils/Utils";
-import { getLeaf, openLeaf } from "../utils/ObsidianUtils";
-import { checkAndCreateFolder, splitFolderAndFilename } from "src/utils/FileUtils";
-import { KeyEvent, isWinCTRLorMacCMD } from "src/utils/ModifierkeyHelper";
+import ExcalidrawView from "../../view/ExcalidrawView";
+import ExcalidrawPlugin from "../../core/main";
+import { escapeRegExp, getLinkParts, sleep } from "../../utils/utils";
+import { getLeaf, openLeaf } from "../../utils/obsidianUtils";
+import { checkAndCreateFolder, splitFolderAndFilename } from "src/utils/fileUtils";
+import { KeyEvent, isWinCTRLorMacCMD } from "src/utils/modifierkeyHelper";
 import { t } from "src/lang/helpers";
-import { ExcalidrawElement, getEA } from "src";
-import { ExcalidrawAutomate } from "src/ExcalidrawAutomate";
+import { ExcalidrawElement, getEA } from "src/core";
+import { ExcalidrawAutomate } from "src/shared/ExcalidrawAutomate";
 import { MAX_IMAGE_SIZE, REG_LINKINDEX_INVALIDCHARS } from "src/constants/constants";
-import { REGEX_LINK, REGEX_TAGS } from "src/ExcalidrawData";
-import { ScriptEngine } from "src/Scripts";
-import { openExternalLink, openTagSearch, parseObsidianLink } from "src/utils/ExcalidrawViewUtils";
+import { REGEX_LINK, REGEX_TAGS } from "../ExcalidrawData";
+import { ScriptEngine } from "../Scripts";
+import { openExternalLink, openTagSearch, parseObsidianLink } from "src/utils/excalidrawViewUtils";
 
 export type ButtonDefinition = { caption: string; tooltip?:string; action: Function };
 
@@ -713,27 +712,70 @@ export class ConfirmationPrompt extends Modal {
   }
 }
 
-export async function linkPrompt (
-  linkText:string,
+export async function linkPrompt(
+  linkText: string,
   app: App,
   view?: ExcalidrawView,
-  message: string = "Select link to open",
-):Promise<[file:TFile, linkText:string, subpath: string]> {
-  const linksArray = REGEX_LINK.getResList(linkText);
-  const tagsArray = REGEX_TAGS.getResList(linkText.replaceAll(/([^\s])#/g,"$1 "));
+  message: string = t("SELECT_LINK_TO_OPEN"),
+): Promise<[file: TFile, linkText: string, subpath: string]> {
+  const linksArray = REGEX_LINK.getResList(linkText).filter(x => Boolean(x.value));
+  const links = linksArray.map(x => REGEX_LINK.getLink(x));
+
+  // Create a map to track duplicates by base link (without rect reference)
+  const linkMap = new Map<string, number[]>();
+  links.forEach((link, i) => {
+    const linkBase = link.split("&rect=")[0];
+    if (!linkMap.has(linkBase)) linkMap.set(linkBase, []);
+    linkMap.get(linkBase).push(i);
+  });
+
+  // Determine indices to keep
+  const indicesToKeep = new Set<number>();
+  linkMap.forEach(indices => {
+    if (indices.length === 1) {
+      // Only one link, keep it
+      indicesToKeep.add(indices[0]);
+    } else {
+      // Multiple links: prefer the one with rect reference, if available
+      const rectIndex = indices.find(i => links[i].includes("&rect="));
+      if (rectIndex !== undefined) {
+        indicesToKeep.add(rectIndex);
+      } else {
+        // No rect reference in duplicates, add the first one
+        indicesToKeep.add(indices[0]);
+      }
+    }
+  });
+
+  // Final validation to ensure each duplicate group has at least one entry
+  linkMap.forEach(indices => {
+    const hasKeptEntry = indices.some(i => indicesToKeep.has(i));
+    if (!hasKeptEntry) {
+      // Add the first index if none were kept
+      indicesToKeep.add(indices[0]);
+    }
+  });
+
+  // Filter linksArray, links, itemsDisplay, and items based on indicesToKeep
+  const filteredLinksArray = linksArray.filter((_, i) => indicesToKeep.has(i));
+  const tagsArray = REGEX_TAGS.getResList(linkText.replaceAll(/([^\s])#/g, "$1 ")).filter(x => Boolean(x.value));
+
   let subpath: string = null;
   let file: TFile = null;
-  let parts = linksArray[0] ?? tagsArray[0];
+  let parts = filteredLinksArray[0] ?? tagsArray[0];
+
+  // Generate filtered itemsDisplay and items arrays
   const itemsDisplay = [
-    ...linksArray.filter(p=> Boolean(p.value)).map(p => {
+    ...filteredLinksArray.map(p => {
       const alias = REGEX_LINK.getAliasOrLink(p);
       return alias === "100%" ? REGEX_LINK.getLink(p) : alias;
     }),
-    ...tagsArray.filter(x=> Boolean(x.value)).map(x => REGEX_TAGS.getTag(x)),
+    ...tagsArray.map(x => REGEX_TAGS.getTag(x)),
   ];
+
   const items = [
-    ...linksArray.filter(p=>Boolean(p.value)),
-    ...tagsArray.filter(x=> Boolean(x.value)),
+    ...filteredLinksArray,
+    ...tagsArray,
   ];
 
   if (items.length>1) {

src/shared/Dialogs/PublishOutOfDateFiles.ts

@@ -1,7 +1,7 @@
 import { Modal, Setting, TFile } from "obsidian";
-import ExcalidrawPlugin from "src/main";
-import { getIMGFilename } from "src/utils/FileUtils";
-import { addIframe } from "src/utils/Utils";
+import ExcalidrawPlugin from "src/core/main";
+import { getIMGFilename } from "src/utils/fileUtils";
+import { addIframe } from "src/utils/utils";
 
 const haveLinkedFilesChanged = (depth: number, mtime: number, path: string, sourceList: Set<string>, plugin: ExcalidrawPlugin):boolean  => {
   if(depth++ > 5) return false;

src/shared/Dialogs/RankMessage.ts

@@ -1,6 +1,6 @@
 import { App, MarkdownRenderer, Modal } from "obsidian";
-import ExcalidrawPlugin from "../main";
-import { Rank, SwordColors } from "src/menu/ActionIcons";
+import ExcalidrawPlugin from "../../core/main";
+import { Rank, SwordColors } from "src/constants/actionIcons";
 
 export class RankMessage extends Modal {
 

src/shared/Dialogs/ReleaseNotes.ts

@@ -1,6 +1,6 @@
 import { App, MarkdownRenderer, Modal } from "obsidian";
-import { isVersionNewerThanOther } from "src/utils/Utils";
-import ExcalidrawPlugin from "../main";
+import { isVersionNewerThanOther } from "src/utils/utils";
+import ExcalidrawPlugin from "../../core/main";
 import { FIRST_RUN, RELEASE_NOTES } from "./Messages";
 
 declare const PLUGIN_VERSION:string;

src/shared/Dialogs/ScriptInstallPrompt.ts

@@ -1,7 +1,7 @@
 import { MarkdownRenderer, Modal, Notice, request } from "obsidian";
-import ExcalidrawPlugin from "../main";
-import { errorlog, escapeRegExp } from "../utils/Utils";
-import { log } from "src/utils/DebugHelper";
+import ExcalidrawPlugin from "../../core/main";
+import { errorlog, escapeRegExp } from "../../utils/utils";
+import { log } from "src/utils/debugHelper";
 
 const URL =
   "https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/index-new.md";

src/shared/Dialogs/SelectCard.ts

@@ -1,10 +1,10 @@
 import { App, FuzzySuggestModal, Notice, TFile } from "obsidian";
-import { t } from "../lang/helpers";
-import ExcalidrawView from "src/ExcalidrawView";
-import { getEA } from "src";
-import { ExcalidrawAutomate } from "src/ExcalidrawAutomate";
+import { t } from "../../lang/helpers";
+import ExcalidrawView from "src/view/ExcalidrawView";
+import { getEA } from "src/core";
+import { ExcalidrawAutomate } from "src/shared/ExcalidrawAutomate";
 import { MD_EX_SECTIONS } from "src/constants/constants";
-import { addBackOfTheNoteCard } from "src/utils/ExcalidrawViewUtils";
+import { addBackOfTheNoteCard } from "src/utils/excalidrawViewUtils";
 
 export class SelectCard extends FuzzySuggestModal<string> {
 

src/shared/Dialogs/UniversalInsertFileModal.ts

@@ -1,15 +1,15 @@
 import { ButtonComponent, DropdownComponent, TFile, ToggleComponent } from "obsidian";
-import ExcalidrawView from "../ExcalidrawView";
-import ExcalidrawPlugin from "../main";
+import ExcalidrawView from "../../view/ExcalidrawView";
+import ExcalidrawPlugin from "../../core/main";
 import {  Modal, Setting, TextComponent } from "obsidian";
-import { FileSuggestionModal } from "./FolderSuggester";
+import { FileSuggestionModal } from "../Suggesters/FileSuggestionModal";
 import { IMAGE_TYPES, sceneCoordsToViewportCoords, viewportCoordsToSceneCoords, MAX_IMAGE_SIZE, ANIMATED_IMAGE_TYPES, MD_EX_SECTIONS } from "src/constants/constants";
-import { insertEmbeddableToView, insertImageToView } from "src/utils/ExcalidrawViewUtils";
-import { getEA } from "src";
+import { insertEmbeddableToView, insertImageToView } from "src/utils/excalidrawViewUtils";
+import { getEA } from "src/core";
 import { InsertPDFModal } from "./InsertPDFModal";
 import {  ExcalidrawImperativeAPI } from "@zsviczian/excalidraw/types/excalidraw/types";
-import { ExcalidrawAutomate } from "src/ExcalidrawAutomate";
-import { cleanSectionHeading } from "src/utils/ObsidianUtils";
+import { ExcalidrawAutomate } from "src/shared/ExcalidrawAutomate";
+import { cleanSectionHeading } from "src/utils/obsidianUtils";
 
 export class UniversalInsertFileModal extends Modal {
   private center: { x: number, y: number } = { x: 0, y: 0 };
@@ -146,7 +146,9 @@ export class UniversalInsertFileModal extends Modal {
     const suggester = new FileSuggestionModal(
       this.app,
       search,
-      this.app.vault.getFiles().filter((f: TFile) => sections?.length > 0 || f!==this.view.file));
+      this.app.vault.getFiles().filter((f: TFile) => sections?.length > 0 || f!==this.view.file),
+      this.plugin
+    );
     search.onChange(() => {
       file = suggester.getSelectedItem();
       updateForm();  
@@ -174,7 +176,7 @@ export class UniversalInsertFileModal extends Modal {
         button
           .setButtonText("as Embeddable")
           .onClick(async () => {
-            const path = app.metadataCache.fileToLinktext(
+            const path = this.app.metadataCache.fileToLinktext(
               file,
               this.view.file.path,
               file.extension === "md",

src/shared/ExcalidrawConfig.ts

@@ -1,5 +1,5 @@
 import { DEVICE } from "src/constants/constants";
-import ExcalidrawPlugin from "src/main";
+import ExcalidrawPlugin from "src/core/main";
 
 export class ExcalidrawConfig {
   public areaLimit: number = 16777216;

src/shared/ExcalidrawData.ts

@@ -18,9 +18,9 @@ import {
   refreshTextDimensions,
   getContainerElement,
   loadSceneFonts,
-} from "./constants/constants";
-import ExcalidrawPlugin from "./main";
-import { TextMode } from "./ExcalidrawView";
+} from "../constants/constants";
+import ExcalidrawPlugin from "../core/main";
+import { TextMode } from "../view/ExcalidrawView";
 import {
   addAppendUpdateCustomData,
   compress,
@@ -37,8 +37,8 @@ import {
   wrapTextAtCharLength,
   arrayToMap,
   compressAsync,
-} from "./utils/Utils";
-import { cleanBlockRef, cleanSectionHeading, getAttachmentsFolderAndFilePath, isObsidianThemeDark } from "./utils/ObsidianUtils";
+} from "../utils/utils";
+import { cleanBlockRef, cleanSectionHeading, getAttachmentsFolderAndFilePath, isObsidianThemeDark } from "../utils/obsidianUtils";
 import {
   ExcalidrawElement,
   ExcalidrawImageElement,
@@ -47,14 +47,15 @@ import {
 } from "@zsviczian/excalidraw/types/excalidraw/element/types";
 import { BinaryFiles, DataURL, SceneData } from "@zsviczian/excalidraw/types/excalidraw/types";
 import { EmbeddedFile, MimeType } from "./EmbeddedFileLoader";
-import { ConfirmationPrompt } from "./dialogs/Prompt";
-import { getMermaidImageElements, getMermaidText, shouldRenderMermaid } from "./utils/MermaidUtils";
-import { DEBUGGING, debug } from "./utils/DebugHelper";
+import { ConfirmationPrompt } from "./Dialogs/Prompt";
+import { getMermaidImageElements, getMermaidText, shouldRenderMermaid } from "../utils/mermaidUtils";
+import { DEBUGGING, debug } from "../utils/debugHelper";
 import { Mutable } from "@zsviczian/excalidraw/types/excalidraw/utility-types";
-import { updateElementIdsInScene } from "./utils/ExcalidrawSceneUtils";
-import { getNewUniqueFilepath } from "./utils/FileUtils";
-import { t } from "./lang/helpers";
-import { displayFontMessage } from "./utils/ExcalidrawViewUtils";
+import { updateElementIdsInScene } from "../utils/excalidrawSceneUtils";
+import { getNewUniqueFilepath } from "../utils/fileUtils";
+import { t } from "../lang/helpers";
+import { displayFontMessage } from "../utils/excalidrawViewUtils";
+import { getPDFRect } from "../utils/PDFUtils";
 
 type SceneDataWithFiles = SceneData & { files: BinaryFiles };
 
@@ -517,7 +518,7 @@ export class ExcalidrawData {
       return;
     }
 
-    const saveVersion = this.scene.source.split("https://github.com/zsviczian/obsidian-excalidraw-plugin/releases/tag/")[1]??"1.8.16";
+    const saveVersion = this.scene.source?.split("https://github.com/zsviczian/obsidian-excalidraw-plugin/releases/tag/")[1]??"1.8.16";
 
     const elements = this.scene.elements;
     for (const el of elements) {
@@ -755,7 +756,7 @@ export class ExcalidrawData {
         displayFontMessage(this.app);
       }
     },5000);
-    await loadSceneFonts(this.scene.elements);
+    const fontFaces = await loadSceneFonts(this.scene.elements);
     clearTimeout(timer);
 
     if (!this.scene.files) {
@@ -858,7 +859,7 @@ export class ExcalidrawData {
       return true; //Text Elements header does not exist
     }
     data = data.slice(position);
-    const normalMatch = data.match(/^((%%\n*)?# Excalidraw Data\n## Text Elements(?:\n|$))/m)
+    const normalMatch = data.match(/^((%%\n*)?# Excalidraw Data\n\n?## Text Elements(?:\n|$))/m)
       ?? data.match(/^((%%\n*)?##? Text Elements(?:\n|$))/m);
 
     const textElementsMatch = normalMatch
@@ -1426,7 +1427,7 @@ export class ExcalidrawData {
   disableCompression: boolean = false;
   generateMDBase(deletedElements: ExcalidrawElement[] = []) {
     let outString = this.textElementCommentedOut ? "%%\n" : "";
-    outString += `# Excalidraw Data\n## Text Elements\n`;
+    outString += `# Excalidraw Data\n\n## Text Elements\n`;
     if (this.plugin.settings.addDummyTextElement) {
       outString += `\n^_dummy!_\n\n`;
     }
@@ -1579,6 +1580,26 @@ export class ExcalidrawData {
     return file;
   }
 
+  private syncCroppedPDFs() {
+    let dirty = false;
+    const scene = this.scene as SceneDataWithFiles;
+    const pdfScale = this.plugin.settings.pdfScale;
+    scene.elements
+    .filter(el=>el.type === "image" && el.crop && !el.isDeleted)
+    .forEach((el: Mutable<ExcalidrawImageElement>)=>{
+      const ef = this.getFile(el.fileId);
+      if(!ef.file) return;
+      if(ef.file.extension !== "pdf") return;
+      const pageRef = ef.linkParts.original.split("#")?.[1];
+      if(!pageRef || !pageRef.startsWith("page=") || pageRef.includes("rect")) return;
+      const restOfLink = el.link ? el.link.match(/&rect=\d*,\d*,\d*,\d*(.*)/)?.[1] : "";
+      const link = ef.linkParts.original + getPDFRect(el.crop, pdfScale) + (restOfLink ? restOfLink : "]]");
+      el.link = `[[${link}`;
+      this.elementLinks.set(el.id, el.link);
+      dirty = true;
+    });
+  }
+
   /**
    * deletes fileIds from Excalidraw data for files no longer in the scene
    * @returns
@@ -1699,6 +1720,7 @@ export class ExcalidrawData {
     this.updateElementLinksFromScene();
     result =
       result ||
+      this.syncCroppedPDFs() ||
       this.setLinkPrefix() ||
       this.setUrlPrefix() ||
       this.setShowLinkBrackets() ||

src/shared/ImageCache.ts

@@ -1,8 +1,8 @@
 import { App, Notice, TFile } from "obsidian";
-import ExcalidrawPlugin from "src/main";
-import { convertSVGStringToElement } from "./Utils";
-import { FILENAMEPARTS, PreviewImageType } from "./UtilTypes";
-import { hasExcalidrawEmbeddedImagesTreeChanged } from "./FileUtils";
+import ExcalidrawPlugin from "src/core/main";
+import { convertSVGStringToElement } from "../utils/utils";
+import { FILENAMEPARTS, PreviewImageType } from "../types/utilTypes";
+import { hasExcalidrawEmbeddedImagesTreeChanged } from "../utils/fileUtils";
 
 //@ts-ignore
 const DB_NAME = "Excalidraw " + app.appId;

src/shared/LaTeX.ts

@@ -0,0 +1,71 @@
+// LaTeX.ts
+import { DataURL } from "@zsviczian/excalidraw/types/excalidraw/types";
+import ExcalidrawView from "../view/ExcalidrawView";
+import { FileData, MimeType } from "./EmbeddedFileLoader";
+import { FileId } from "@zsviczian/excalidraw/types/excalidraw/element/types";
+import { App } from "obsidian";
+
+declare const loadMathjaxToSVG: Function;
+let mathjaxLoaded = false;
+let tex2dataURLExternal: Function;
+let clearVariables: Function;
+
+let loadMathJaxPromise: Promise<void> | null = null;
+
+const loadMathJax = async () => {
+  if (!loadMathJaxPromise) {
+    loadMathJaxPromise = (async () => {
+      if (!mathjaxLoaded) {
+        const module = await loadMathjaxToSVG();
+        tex2dataURLExternal = module.tex2dataURL;
+        clearVariables = module.clearMathJaxVariables;
+        mathjaxLoaded = true;
+      }
+    })();
+  }
+  return loadMathJaxPromise;
+};
+
+export const updateEquation = async (
+  equation: string,
+  fileId: string,
+  view: ExcalidrawView,
+  addFiles: Function,
+) => {
+  await loadMathJax();
+  const data = await tex2dataURLExternal(equation, 4, view.app);
+  if (data) {
+    const files: FileData[] = [];
+    files.push({
+      mimeType: data.mimeType as MimeType,
+      id: fileId as FileId,
+      dataURL: data.dataURL as DataURL,
+      created: data.created,
+      size: data.size,
+      hasSVGwithBitmap: false,
+      shouldScale: true,
+    });
+    addFiles(files, view);
+  }
+};
+
+export async function tex2dataURL(
+  tex: string,
+  scale: number = 4,
+  app: App,
+): Promise<{
+  mimeType: MimeType;
+  fileId: FileId;
+  dataURL: DataURL;
+  created: number;
+  size: { height: number; width: number };
+}> {
+  await loadMathJax();
+  return tex2dataURLExternal(tex, scale, app);
+}
+
+export const clearMathJaxVariables = () => {
+  if (clearVariables) {
+    clearVariables();
+  }
+};

src/shared/OCR/Taskbone.ts

@@ -1,13 +1,13 @@
-import { ExcalidrawAutomate, createPNG } from "../ExcalidrawAutomate";
+import { ExcalidrawAutomate } from "../ExcalidrawAutomate";
 import {Notice, requestUrl} from "obsidian"
-import ExcalidrawPlugin from "../main"
-import ExcalidrawView, { ExportSettings } from "../ExcalidrawView"
-import FrontmatterEditor from "src/utils/Frontmatter";
+import ExcalidrawPlugin from "../../core/main"
+import ExcalidrawView, { ExportSettings } from "../../view/ExcalidrawView"
+import FrontmatterEditor from "src/shared/Frontmatter";
 import { ExcalidrawElement } from "@zsviczian/excalidraw/types/excalidraw/element/types";
-import { EmbeddedFilesLoader } from "src/EmbeddedFileLoader";
-import { blobToBase64 } from "src/utils/FileUtils";
-import { getEA } from "src";
-import { log } from "src/utils/DebugHelper";
+import { EmbeddedFilesLoader } from "../EmbeddedFileLoader";
+import { blobToBase64 } from "src/utils/fileUtils";
+import { getEA } from "src/core";
+import { log } from "src/utils/debugHelper";
 
 const TASKBONE_URL = "https://api.taskbone.com/"; //"https://excalidraw-preview.onrender.com/";
 const TASKBONE_OCR_FN = "execute?id=60f394af-85f6-40bc-9613-5d26dc283cbb";

src/shared/Scripts.ts

@@ -1,20 +1,20 @@
 import {
   App,
   Instruction,
+  normalizePath,
   TAbstractFile,
   TFile,
-  WorkspaceLeaf,
 } from "obsidian";
-import { PLUGIN_ID } from "./constants/constants";
-import ExcalidrawView from "./ExcalidrawView";
-import ExcalidrawPlugin from "./main";
-import { ButtonDefinition, GenericInputPrompt, GenericSuggester } from "./dialogs/Prompt";
-import { getIMGFilename } from "./utils/FileUtils";
-import { splitFolderAndFilename } from "./utils/FileUtils";
-import { getEA } from "src";
-import { ExcalidrawAutomate } from "./ExcalidrawAutomate";
-import { WeakArray } from "./utils/WeakArray";
-import { getExcalidrawViews } from "./utils/ObsidianUtils";
+import { PLUGIN_ID } from "../constants/constants";
+import ExcalidrawView from "../view/ExcalidrawView";
+import ExcalidrawPlugin from "../core/main";
+import { ButtonDefinition, GenericInputPrompt, GenericSuggester } from "./Dialogs/Prompt";
+import { getIMGFilename } from "../utils/fileUtils";
+import { splitFolderAndFilename } from "../utils/fileUtils";
+import { getEA } from "src/core";
+import { ExcalidrawAutomate } from "../shared/ExcalidrawAutomate";
+import { WeakArray } from "./WeakArray";
+import { getExcalidrawViews } from "../utils/obsidianUtils";
 
 export type ScriptIconMap = {
   [key: string]: { name: string; group: string; svgString: string };
@@ -22,6 +22,7 @@ export type ScriptIconMap = {
 
 export class ScriptEngine {
   private plugin: ExcalidrawPlugin;
+  private app: App;
   private scriptPath: string;
   //https://stackoverflow.com/questions/60218638/how-to-force-re-render-if-map-value-changes
   public scriptIconMap: ScriptIconMap;
@@ -29,6 +30,7 @@ export class ScriptEngine {
 
   constructor(plugin: ExcalidrawPlugin) {
     this.plugin = plugin;
+    this.app = plugin.app;
     this.scriptIconMap = {};
     this.loadScripts();
     this.registerEventHandlers();
@@ -58,7 +60,7 @@ export class ScriptEngine {
     if (!path.endsWith(".svg")) {
       return;
     }
-    const scriptFile = app.vault.getAbstractFileByPath(
+    const scriptFile = this.app.vault.getAbstractFileByPath(
       getIMGFilename(path, "md"),
     );
     if (scriptFile && scriptFile instanceof TFile) {
@@ -107,19 +109,19 @@ export class ScriptEngine {
 
   registerEventHandlers() {
     this.plugin.registerEvent(
-      this.plugin.app.vault.on(
+      this.app.vault.on(
         "delete",
         (file: TFile)=>this.deleteEventHandler(file)
       ),
     );
     this.plugin.registerEvent(
-      this.plugin.app.vault.on(
+      this.app.vault.on(
         "create",
         (file: TFile)=>this.createEventHandler(file)
       ),
     );
     this.plugin.registerEvent(
-      this.plugin.app.vault.on(
+      this.app.vault.on(
         "rename",
         (file: TAbstractFile, oldPath: string)=>this.renameEventHandler(file, oldPath)
       ),
@@ -138,15 +140,16 @@ export class ScriptEngine {
 
   public getListofScripts(): TFile[] {
     this.scriptPath = this.plugin.settings.scriptFolderPath;
-    if (!app.vault.getAbstractFileByPath(this.scriptPath)) {
-      //this.scriptPath = null;
+    if(!this.scriptPath) return;
+    this.scriptPath = normalizePath(this.scriptPath);
+    if (!this.app.vault.getAbstractFileByPath(this.scriptPath)) {
       return;
     }
-    return app.vault
+    return this.app.vault
       .getFiles()
       .filter(
         (f: TFile) =>
-          f.path.startsWith(this.scriptPath) && f.extension === "md",
+          f.path.startsWith(this.scriptPath+"/") && f.extension === "md",
       );
   }
 
@@ -166,7 +169,10 @@ export class ScriptEngine {
     }
 
     const subpath = path.split(`${this.scriptPath}/`)[1];
-    const lastSlash = subpath.lastIndexOf("/");
+    if(!subpath) {
+      console.warn(`ScriptEngine.getScriptName unexpected basename: ${basename}; path: ${path}`)
+    }
+    const lastSlash = subpath?.lastIndexOf("/");
     if (lastSlash > -1) {
       return subpath.substring(0, lastSlash + 1) + basename;
     }
@@ -175,10 +181,10 @@ export class ScriptEngine {
 
   async addScriptIconToMap(scriptPath: string, name: string) {
     const svgFilePath = getIMGFilename(scriptPath, "svg");
-    const file = app.vault.getAbstractFileByPath(svgFilePath);
+    const file = this.app.vault.getAbstractFileByPath(svgFilePath);
     const svgString: string =
       file && file instanceof TFile
-        ? await app.vault.read(file)
+        ? await this.app.vault.read(file)
         : null;
     this.scriptIconMap = {
       ...this.scriptIconMap,
@@ -199,12 +205,12 @@ export class ScriptEngine {
       name: `(Script) ${scriptName}`,
       checkCallback: (checking: boolean) => {
         if (checking) {
-          return Boolean(app.workspace.getActiveViewOfType(ExcalidrawView));
+          return Boolean(this.app.workspace.getActiveViewOfType(ExcalidrawView));
         }
-        const view = app.workspace.getActiveViewOfType(ExcalidrawView);
+        const view = this.app.workspace.getActiveViewOfType(ExcalidrawView);
         if (view) {
           (async()=>{
-            const script = await app.vault.read(f);
+            const script = await this.app.vault.read(f);
             if(script) {
               //remove YAML frontmatter if present
               this.executeScript(view, script, scriptName,f);
@@ -218,7 +224,7 @@ export class ScriptEngine {
   }
 
   unloadScripts() {
-    const scripts = app.vault
+    const scripts = this.app.vault
       .getFiles()
       .filter((f: TFile) => f.path.startsWith(this.scriptPath));
     scripts.forEach((f) => {
@@ -236,11 +242,11 @@ export class ScriptEngine {
 
     const commandId = `${PLUGIN_ID}:${basename}`;
     // @ts-ignore
-    if (!this.plugin.app.commands.commands[commandId]) {
+    if (!this.app.commands.commands[commandId]) {
       return;
     }
     // @ts-ignore
-    delete this.plugin.app.commands.commands[commandId];
+    delete this.app.commands.commands[commandId];
   }
 
   async executeScript(view: ExcalidrawView, script: string, title: string, file: TFile) {
@@ -271,7 +277,7 @@ export class ScriptEngine {
         ScriptEngine.inputPrompt(
           view,
           this.plugin,
-          this.plugin.app,
+          this.app,
           header,
           placeholder,
           value,
@@ -288,7 +294,7 @@ export class ScriptEngine {
         instructions?: Instruction[],
       ) =>
         ScriptEngine.suggester(
-          this.plugin.app,
+          this.app,
           displayItems,
           items,
           hint,
@@ -304,7 +310,7 @@ export class ScriptEngine {
 }
 
   private updateToolPannels() {
-    const excalidrawViews = getExcalidrawViews(this.plugin.app);
+    const excalidrawViews = getExcalidrawViews(this.app);
     excalidrawViews.forEach(excalidrawView => {
       excalidrawView.toolsPanelRef?.current?.updateScriptIconMap(
         this.scriptIconMap,

src/shared/Suggesters/FieldSuggester.ts

@@ -6,13 +6,16 @@ import {
   EditorSuggestTriggerInfo,
   TFile,
 } from "obsidian";
-import { FRONTMATTER_KEYS_INFO } from "./SuggesterInfo";
+import { FRONTMATTER_KEYS_INFO } from "../Dialogs/SuggesterInfo";
 import {
   EXCALIDRAW_AUTOMATE_INFO,
   EXCALIDRAW_SCRIPTENGINE_INFO,
-} from "./SuggesterInfo";
-import type ExcalidrawPlugin from "../main";
+} from "../Dialogs/SuggesterInfo";
+import type ExcalidrawPlugin from "../../core/main";
 
+/**
+ * The field suggester recommends document properties in source mode, ea and utils function and attribute names.
+ */
 export class FieldSuggester extends EditorSuggest<string> {
   plugin: ExcalidrawPlugin;
   suggestType: "ea" | "excalidraw" | "utils";

src/shared/Suggesters/FileSuggestionModal.ts

@@ -0,0 +1,142 @@
+import {
+  FuzzyMatch,
+  TFile,
+  CachedMetadata,
+  TextComponent,
+  App,
+  setIcon,
+} from "obsidian";
+import { SuggestionModal } from "./SuggestionModal";
+import { t } from "src/lang/helpers";
+import { LinkSuggestion } from "src/types/types";
+import ExcalidrawPlugin from "src/core/main";
+import { AUDIO_TYPES, CODE_TYPES, ICON_NAME, IMAGE_TYPES, VIDEO_TYPES } from "src/constants/constants";
+
+export class FileSuggestionModal extends SuggestionModal<LinkSuggestion> {
+  text: TextComponent;
+  cache: CachedMetadata;
+  filesAndAliases: LinkSuggestion[];
+  file: TFile;
+  constructor(app: App, input: TextComponent, items: TFile[], private plugin: ExcalidrawPlugin) {
+    const filesAndAliases = [];
+    for (const file of items) {
+      const path = file.path;
+      filesAndAliases.push({ file, path, alias: "" });
+      const metadata = app.metadataCache.getFileCache(file); // Get metadata for the file
+      const aliases = metadata?.frontmatter?.aliases || []; // Check for frontmatter aliases
+
+      for (const alias of aliases) {
+        if(!alias) continue; // Skip empty aliases
+        filesAndAliases.push({ file, path, alias });
+      }
+    }
+    super(app, input.inputEl, filesAndAliases);
+    this.limit = 20;
+    this.filesAndAliases = filesAndAliases;
+    this.text = input;
+    this.suggestEl.style.maxWidth = "100%";
+    this.suggestEl.style.width = `${input.inputEl.clientWidth}px`;
+    this.inputEl.addEventListener("input", () => this.getFile());
+    this.setPlaceholder(t("SELECT_FILE_TO_INSERT"));
+    this.emptyStateText = t("NO_MATCH");
+  }
+
+  getFile() {
+    const v = this.inputEl.value;
+    const file = this.app.vault.getAbstractFileByPath(v);
+    if (file === this.file) {
+      return;
+    }
+    if (!(file instanceof TFile)) {
+      return;
+    }
+    this.file = file;
+
+    this.onInputChanged();
+  }
+
+  getSelectedItem() {
+    return this.file;
+  }
+
+  getItemText(item: LinkSuggestion) {
+    return `${item.file.path}${item.alias ? `|${item.alias}` : ""}`;
+  }
+
+  onChooseItem(item: LinkSuggestion) {
+    this.file = item.file;
+    this.text.setValue(this.getItemText(item));
+    this.text.onChanged();
+  }
+
+  selectSuggestion({ item }: FuzzyMatch<LinkSuggestion>) {
+    this.file = item.file;
+    this.text.setValue(this.getItemText(item));
+    this.onClose();
+    this.text.onChanged();
+    this.close();
+  }
+  
+  renderSuggestion(result: FuzzyMatch<LinkSuggestion>, itemEl: HTMLElement) {
+    const { item, match: matches } = result || {};
+    itemEl.addClass("mod-complex");
+    const contentEl = itemEl.createDiv("suggestion-content");
+    const auxEl = itemEl.createDiv("suggestion-aux");
+    const titleEl = contentEl.createDiv("suggestion-title");
+    const noteEl = contentEl.createDiv("suggestion-note");
+
+    //el.style.flexDirection = "column";
+    //content.style.flexDirection = "initial";
+
+    if (!item) {
+      titleEl.setText(this.emptyStateText);
+      itemEl.addClass("is-selected");
+      return;
+    }
+
+    const path = item.file?.path ?? item.path;
+    const pathLength = path.length - item.file.name.length;
+    const matchElements = matches.matches.map((m) => {
+      return createSpan("suggestion-highlight");
+    });
+    const itemText = this.getItemText(item);
+    for (let i = pathLength; i < itemText.length; i++) {
+      const match = matches.matches.find((m) => m[0] === i);
+      if (match) {
+        const element = matchElements[matches.matches.indexOf(match)];
+        titleEl.appendChild(element);
+        element.appendText(itemText.substring(match[0], match[1]));
+
+        i += match[1] - match[0] - 1;
+        continue;
+      }
+
+      titleEl.appendText(itemText[i]);
+    }
+    noteEl.setText(path);
+
+    if(this.plugin.isExcalidrawFile(item.file)) {
+      setIcon(auxEl, ICON_NAME);
+    } else if (item.file.extension === "md") {
+      setIcon(auxEl, "square-pen");
+    } else if (IMAGE_TYPES.includes(item.file.extension)) {
+      setIcon(auxEl, "image");
+    } else if (VIDEO_TYPES.includes(item.file.extension)) {
+      setIcon(auxEl, "monitor-play");
+    } else if (AUDIO_TYPES.includes(item.file.extension)) {
+      setIcon(auxEl, "file-audio");
+    } else if (CODE_TYPES.includes(item.file.extension)) {
+      setIcon(auxEl, "file-code");
+    } else if (item.file.extension === "canvas") {
+      setIcon(auxEl, "layout-dashboard");
+    } else if (item.file.extension === "pdf") {
+      setIcon(auxEl, "book-open-text");
+    } else {
+      auxEl.setText(item.file.extension);
+    }
+  }
+
+  getItems() {
+    return this.filesAndAliases;
+  }
+}

src/shared/Suggesters/FolderSuggestionModal.ts

@@ -0,0 +1,87 @@
+import {
+  FuzzyMatch,
+  CachedMetadata,
+  TextComponent,
+  App,
+  TFolder,
+} from "obsidian";
+import { SuggestionModal } from "./SuggestionModal";
+
+export class FolderSuggestionModal extends SuggestionModal<TFolder> {
+  text: TextComponent;
+  cache: CachedMetadata;
+  folders: TFolder[];
+  folder: TFolder;
+  constructor(app: App, input: TextComponent, items: TFolder[]) {
+    super(app, input.inputEl, items);
+    this.folders = [...items];
+    this.text = input;
+
+    this.inputEl.addEventListener("input", () => this.getFolder());
+  }
+  getFolder() {
+    const v = this.inputEl.value;
+    const folder = this.app.vault.getAbstractFileByPath(v);
+    if (folder == this.folder) {
+      return;
+    }
+    if (!(folder instanceof TFolder)) {
+      return;
+    }
+    this.folder = folder;
+
+    this.onInputChanged();
+  }
+  getItemText(item: TFolder) {
+    return item.path;
+  }
+  onChooseItem(item: TFolder) {
+    this.text.setValue(item.path);
+    this.folder = item;
+  }
+  selectSuggestion({ item }: FuzzyMatch<TFolder>) {
+    const link = item.path;
+
+    this.text.setValue(link);
+    this.onClose();
+
+    this.close();
+  }
+  renderSuggestion(result: FuzzyMatch<TFolder>, el: HTMLElement) {
+    const { item, match: matches } = result || {};
+    const content = el.createDiv({
+      cls: "suggestion-content",
+    });
+    if (!item) {
+      content.setText(this.emptyStateText);
+      content.parentElement.addClass("is-selected");
+      return;
+    }
+
+    const pathLength = item.path.length - item.name.length;
+    const matchElements = matches.matches.map((m) => {
+      return createSpan("suggestion-highlight");
+    });
+    for (let i = pathLength; i < item.path.length; i++) {
+      const match = matches.matches.find((m) => m[0] === i);
+      if (match) {
+        const element = matchElements[matches.matches.indexOf(match)];
+        content.appendChild(element);
+        element.appendText(item.path.substring(match[0], match[1]));
+
+        i += match[1] - match[0] - 1;
+        continue;
+      }
+
+      content.appendText(item.path[i]);
+    }
+    el.createDiv({
+      cls: "suggestion-note",
+      text: item.path,
+    });
+  }
+
+  getItems() {
+    return this.folders;
+  }
+}

src/shared/Suggesters/PathSuggestionModal.ts

@@ -0,0 +1,163 @@
+import {
+  FuzzyMatch,
+  TFile,
+  BlockCache,
+  HeadingCache,
+  CachedMetadata,
+  TextComponent,
+  App,
+} from "obsidian";
+import { SuggestionModal } from "./SuggestionModal";
+
+export class PathSuggestionModal extends SuggestionModal<
+  TFile | BlockCache | HeadingCache
+> {
+  file: TFile;
+  files: TFile[];
+  text: TextComponent;
+  cache: CachedMetadata;
+  constructor(app: App, input: TextComponent, items: TFile[]) {
+    super(app, input.inputEl, items);
+    this.files = [...items];
+    this.text = input;
+    //this.getFile();
+
+    this.inputEl.addEventListener("input", this.getFile.bind(this));
+  }
+
+  getFile() {
+    const v = this.inputEl.value;
+    const file = this.app.metadataCache.getFirstLinkpathDest(
+      v.split(/[\^#]/).shift() || "",
+      "",
+    );
+    if (file == this.file) {
+      return;
+    }
+    this.file = file;
+    if (this.file) {
+      this.cache = this.app.metadataCache.getFileCache(this.file);
+    }
+    this.onInputChanged();
+  }
+  getItemText(item: TFile | HeadingCache | BlockCache) {
+    if (item instanceof TFile) {
+      return item.path;
+    }
+    if (Object.prototype.hasOwnProperty.call(item, "heading")) {
+      return (<HeadingCache>item).heading;
+    }
+    if (Object.prototype.hasOwnProperty.call(item, "id")) {
+      return (<BlockCache>item).id;
+    }
+  }
+  onChooseItem(item: TFile | HeadingCache | BlockCache) {
+    if (item instanceof TFile) {
+      this.text.setValue(item.basename);
+      this.file = item;
+      this.cache = this.app.metadataCache.getFileCache(this.file);
+    } else if (Object.prototype.hasOwnProperty.call(item, "heading")) {
+      this.text.setValue(
+        `${this.file.basename}#${(<HeadingCache>item).heading}`,
+      );
+    } else if (Object.prototype.hasOwnProperty.call(item, "id")) {
+      this.text.setValue(`${this.file.basename}^${(<BlockCache>item).id}`);
+    }
+  }
+  selectSuggestion({ item }: FuzzyMatch<TFile | BlockCache | HeadingCache>) {
+    let link: string;
+    if (item instanceof TFile) {
+      link = item.basename;
+    } else if (Object.prototype.hasOwnProperty.call(item, "heading")) {
+      link = `${this.file.basename}#${(<HeadingCache>item).heading}`;
+    } else if (Object.prototype.hasOwnProperty.call(item, "id")) {
+      link = `${this.file.basename}^${(<BlockCache>item).id}`;
+    }
+
+    this.text.setValue(link);
+    this.onClose();
+
+    this.close();
+  }
+  renderSuggestion(
+    result: FuzzyMatch<TFile | BlockCache | HeadingCache>,
+    el: HTMLElement,
+  ) {
+    const { item, match: matches } = result || {};
+    const content = el.createDiv({
+      cls: "suggestion-content",
+    });
+    if (!item) {
+      content.setText(this.emptyStateText);
+      content.parentElement.addClass("is-selected");
+      return;
+    }
+
+    if (item instanceof TFile) {
+      const pathLength = item.path.length - item.name.length;
+      const matchElements = matches.matches.map((m) => {
+        return createSpan("suggestion-highlight");
+      });
+      for (
+        let i = pathLength;
+        i < item.path.length - item.extension.length - 1;
+        i++
+      ) {
+        const match = matches.matches.find((m) => m[0] === i);
+        if (match) {
+          const element = matchElements[matches.matches.indexOf(match)];
+          content.appendChild(element);
+          element.appendText(item.path.substring(match[0], match[1]));
+
+          i += match[1] - match[0] - 1;
+          continue;
+        }
+
+        content.appendText(item.path[i]);
+      }
+      el.createDiv({
+        cls: "suggestion-note",
+        text: item.path,
+      });
+    } else if (Object.prototype.hasOwnProperty.call(item, "heading")) {
+      content.setText((<HeadingCache>item).heading);
+      content.prepend(
+        createSpan({
+          cls: "suggestion-flair",
+          text: `H${(<HeadingCache>item).level}`,
+        }),
+      );
+    } else if (Object.prototype.hasOwnProperty.call(item, "id")) {
+      content.setText((<BlockCache>item).id);
+    }
+  }
+  get headings() {
+    if (!this.file) {
+      return [];
+    }
+    if (!this.cache) {
+      this.cache = this.app.metadataCache.getFileCache(this.file);
+    }
+    return this.cache.headings || [];
+  }
+  get blocks() {
+    if (!this.file) {
+      return [];
+    }
+    if (!this.cache) {
+      this.cache = this.app.metadataCache.getFileCache(this.file);
+    }
+    return Object.values(this.cache.blocks || {}) || [];
+  }
+  getItems() {
+    const v = this.inputEl.value;
+    if (/#/.test(v)) {
+      this.modifyInput = (i) => i.split(/#/).pop();
+      return this.headings;
+    } else if (/\^/.test(v)) {
+      this.modifyInput = (i) => i.split(/\^/).pop();
+      return this.blocks;
+    }
+    return this.files;
+  }
+}

src/shared/Suggesters/Suggester.ts

@@ -0,0 +1,119 @@
+import {
+  SuggestModal,
+  Scope,
+} from "obsidian";
+
+export class Suggester<T> {
+  owner: SuggestModal<T>;
+  items: T[];
+  suggestions: HTMLDivElement[];
+  selectedItem: number;
+  containerEl: HTMLElement;
+  constructor(owner: SuggestModal<T>, containerEl: HTMLElement, scope: Scope) {
+    this.containerEl = containerEl;
+    this.owner = owner;
+    containerEl.on(
+      "click",
+      ".suggestion-item",
+      this.onSuggestionClick.bind(this),
+    );
+    containerEl.on(
+      "mousemove",
+      ".suggestion-item",
+      this.onSuggestionMouseover.bind(this),
+    );
+
+    scope.register([], "ArrowUp", () => {
+      this.setSelectedItem(this.selectedItem - 1, true);
+      return false;
+    });
+
+    scope.register([], "ArrowDown", () => {
+      this.setSelectedItem(this.selectedItem + 1, true);
+      return false;
+    });
+
+    scope.register([], "Enter", (evt) => {
+      this.useSelectedItem(evt);
+      return false;
+    });
+
+    scope.register([], "Tab", (evt) => {
+      this.chooseSuggestion(evt);
+      return false;
+    });
+  }
+  chooseSuggestion(evt: KeyboardEvent) {
+    if (!this.items || !this.items.length) {
+      return;
+    }
+    const currentValue = this.items[this.selectedItem];
+    if (currentValue) {
+      this.owner.onChooseSuggestion(currentValue, evt);
+    }
+  }
+  onSuggestionClick(event: MouseEvent, el: HTMLDivElement): void {
+    event.preventDefault();
+    if (!this.suggestions || !this.suggestions.length) {
+      return;
+    }
+
+    const item = this.suggestions.indexOf(el);
+    this.setSelectedItem(item, false);
+    this.useSelectedItem(event);
+  }
+
+  onSuggestionMouseover(event: MouseEvent, el: HTMLDivElement): void {
+    if (!this.suggestions || !this.suggestions.length) {
+      return;
+    }
+    const item = this.suggestions.indexOf(el);
+    this.setSelectedItem(item, false);
+  }
+  empty() {
+    this.containerEl.empty();
+  }
+  setSuggestions(items: T[]) {
+    this.containerEl.empty();
+    const els: HTMLDivElement[] = [];
+
+    items.forEach((item) => {
+      const suggestionEl = this.containerEl.createDiv("suggestion-item");
+      this.owner.renderSuggestion(item, suggestionEl);
+      els.push(suggestionEl);
+    });
+    this.items = items;
+    this.suggestions = els;
+    this.setSelectedItem(0, false);
+  }
+  useSelectedItem(event: MouseEvent | KeyboardEvent) {
+    if (!this.items || !this.items.length) {
+      return;
+    }
+    const currentValue = this.items[this.selectedItem];
+    if (currentValue) {
+      this.owner.selectSuggestion(currentValue, event);
+    }
+  }
+  wrap(value: number, size: number): number {
+    return ((value % size) + size) % size;
+  }
+  setSelectedItem(index: number, scroll: boolean) {
+    const nIndex = this.wrap(index, this.suggestions.length);
+    const prev = this.suggestions[this.selectedItem];
+    const next = this.suggestions[nIndex];
+
+    if (prev) {
+      prev.removeClass("is-selected");
+    }
+    if (next) {
+      next.addClass("is-selected");
+    }
+
+    this.selectedItem = nIndex;
+
+    if (scroll) {
+      next.scrollIntoView(false);
+    }
+  }
+}

src/shared/Suggesters/SuggestionModal.ts

@@ -0,0 +1,128 @@
+import {
+  FuzzyMatch,
+  App,
+  FuzzySuggestModal,
+  Scope,
+} from "obsidian";
+import { createPopper, Instance as PopperInstance } from "@popperjs/core";
+import { Suggester } from "./Suggester";
+
+export abstract class SuggestionModal<T> extends FuzzySuggestModal<T> {
+  items: T[] = [];
+  suggestions: HTMLDivElement[];
+  popper: WeakRef<PopperInstance>;
+  //@ts-ignore
+  scope: Scope = new Scope(this.app.scope);
+  suggester: Suggester<FuzzyMatch<T>>;
+  suggestEl: HTMLDivElement;
+  promptEl: HTMLDivElement;
+  emptyStateText: string = "No match found";
+  limit: number = 100;
+  shouldNotOpen: boolean;
+  constructor(app: App, inputEl: HTMLInputElement, items: T[]) {
+    super(app);
+    this.inputEl = inputEl;
+    this.items = items;
+    this.suggestEl = createDiv("suggestion-container");
+    this.contentEl = this.suggestEl.createDiv("suggestion");
+    this.suggester = new Suggester(this, this.contentEl, this.scope);
+    this.scope.register([], "Escape", this.onEscape.bind(this));
+    this.inputEl.addEventListener("input", this.onInputChanged.bind(this));
+    this.inputEl.addEventListener("focus", this.onFocus.bind(this));
+    this.inputEl.addEventListener("blur", this.close.bind(this));
+    this.suggestEl.on(
+      "mousedown",
+      ".suggestion-container",
+      (event: MouseEvent) => {
+        event.preventDefault();
+      },
+    );
+  }
+
+  empty() {
+    this.suggester.empty();
+  }
+
+  onInputChanged(): void {
+    if (this.shouldNotOpen) {
+      return;
+    }
+    const inputStr = this.modifyInput(this.inputEl.value);
+    const suggestions = this.getSuggestions(inputStr);
+    if (suggestions.length > 0) {
+      this.suggester.setSuggestions(suggestions.slice(0, this.limit));
+    } else {
+      this.onNoSuggestion();
+    }
+    this.open();
+  }
+
+  onFocus(): void {
+    this.shouldNotOpen = false;
+    this.onInputChanged();
+  }
+
+  modifyInput(input: string): string {
+    return input;
+  }
+
+  onNoSuggestion() {
+    this.empty();
+    this.renderSuggestion(null, this.contentEl.createDiv("suggestion-item"));
+  }
+
+  open(): void {
+    // TODO: Figure out a better way to do this. Idea from Periodic Notes plugin
+    this.app.keymap.pushScope(this.scope);
+    this.inputEl.ownerDocument.body.appendChild(this.suggestEl);
+    this.popper = new WeakRef(createPopper(this.inputEl, this.suggestEl, {
+      placement: "bottom-start",
+      modifiers: [
+        {
+          name: "offset",
+          options: {
+            offset: [0, 10],
+          },
+        },
+        {
+          name: "flip",
+          options: {
+            fallbackPlacements: ["top"],
+          },
+        },
+      ],
+    }));
+  }
+
+  onEscape(): void {
+    this.close();
+    this.shouldNotOpen = true;
+  }
+
+  close(): void {
+    // TODO: Figure out a better way to do this. Idea from Periodic Notes plugin
+    this.app.keymap.popScope(this.scope);
+    this.suggester.setSuggestions([]);
+    if (this.popper?.deref()) {
+      this.popper.deref().destroy();
+    }
+    this.inputEl.removeEventListener("input", this.onInputChanged.bind(this));
+    this.inputEl.removeEventListener("focus", this.onFocus.bind(this));
+    this.inputEl.removeEventListener("blur", this.close.bind(this));
+    this.suggestEl.detach(); 
+  }
+
+  createPrompt(prompts: HTMLSpanElement[]) {
+    if (!this.promptEl) {
+      this.promptEl = this.suggestEl.createDiv("prompt-instructions");
+    }
+    const prompt = this.promptEl.createDiv("prompt-instruction");
+    for (const p of prompts) {
+      prompt.appendChild(p);
+    }
+  }
+
+  abstract onChooseItem(item: T, evt: MouseEvent | KeyboardEvent): void;
+  abstract getItemText(arg: T): string;
+  abstract getItems(): T[];
+}

src/shared/svgToExcalidraw/walker.ts

@@ -25,7 +25,7 @@ import {
 import { getTransformMatrix, transformPoints } from "./transform";
 import { pointsOnPath } from "points-on-path";
 import { randomId, getWindingOrder } from "./utils";
-import { ROUNDNESS } from "../constants/constants";
+import { ROUNDNESS } from "../../constants/constants";
 
 const SUPPORTED_TAGS = [
   "svg",

src/types/excalidrawLib.d.ts

@@ -2,11 +2,42 @@ import { RestoredDataState } from "@zsviczian/excalidraw/types/excalidraw/data/r
 import { ImportedDataState } from "@zsviczian/excalidraw/types/excalidraw/data/types";
 import { BoundingBox } from "@zsviczian/excalidraw/types/excalidraw/element/bounds";
 import { ElementsMap, ExcalidrawBindableElement, ExcalidrawElement, ExcalidrawFrameElement, ExcalidrawFrameLikeElement, ExcalidrawTextContainer, ExcalidrawTextElement, FontFamilyValues, FontString, NonDeleted, NonDeletedExcalidrawElement, Theme } from "@zsviczian/excalidraw/types/excalidraw/element/types";
-import { FontMetadata } from "@zsviczian/excalidraw/types/excalidraw/fonts/metadata";
+import { FontMetadata } from "@zsviczian/excalidraw/types/excalidraw/fonts/FontMetadata";
 import { AppState, BinaryFiles, DataURL, GenerateDiagramToCode, Zoom } from "@zsviczian/excalidraw/types/excalidraw/types";
 import { Mutable } from "@zsviczian/excalidraw/types/excalidraw/utility-types";
 import { GlobalPoint } from "@zsviczian/excalidraw/types/math/types";
-import ExcalidrawPlugin from "./main";
+
+interface MermaidConfig {
+  /**
+   * Whether to start the diagram automatically when the page loads.
+   * @default false
+   */
+  startOnLoad?: boolean;
+  /**
+   * The flowchart curve style.
+   * @default "linear"
+   */
+  flowchart?: {
+      curve?: "linear" | "basis";
+  };
+  /**
+   * Theme variables
+   * @default { fontSize: "25px" }
+   */
+  themeVariables?: {
+      fontSize?: string;
+  };
+  /**
+   * Maximum number of edges to be rendered.
+   * @default 1000
+   */
+  maxEdges?: number;
+  /**
+   * Maximum number of characters to be rendered.
+   * @default 1000
+   */
+  maxTextSize?: number;
+}
 
 type EmbeddedLink =
   | ({
@@ -159,7 +190,7 @@ declare namespace ExcalidrawLib {
 
   function mermaidToExcalidraw(
     mermaidDefinition: string,
-    opts: {fontSize: number},
+    opts: MermaidConfig,
     forceSVG?: boolean,
   ): Promise<{
     elements?: ExcalidrawElement[];
@@ -189,5 +220,6 @@ declare namespace ExcalidrawLib {
   ): string;
   function safelyParseJSON (json: string): Record<string, any> | null;
   function loadSceneFonts(elements: NonDeletedExcalidrawElement[]): Promise<void>;
+  function loadMermaid(): Promise<any>;
 }
 

src/types/excalidrawViewTypes.ts

@@ -0,0 +1,73 @@
+// src/types/ExcalidrawViewTypes.ts
+
+import { WorkspaceLeaf } from "obsidian";
+import { FileId } from "@zsviczian/excalidraw/types/excalidraw/element/types";
+import { ObsidianCanvasNode } from "../view/managers/CanvasNodeFactory";
+
+export interface DropData {
+  files?: File[];
+  text?: string;
+  html?: string;
+  uri?: string;
+}
+
+export interface DropContext {
+  event: DragEvent;
+  position: {x: number; y: number};
+  modifierAction: string;
+}
+
+export interface SelectedElementWithLink {
+  id: string | null;
+  text: string | null;
+}
+
+export interface SelectedImage {
+  id: string | null;
+  fileId: FileId | null;
+}
+
+export interface EmbeddableLeafRef {
+  leaf: WorkspaceLeaf;
+  node?: ObsidianCanvasNode;
+  editNode?: Function;
+}
+
+export interface ViewSemaphores {
+  warnAboutLinearElementLinkClick: boolean;
+  //flag to prevent overwriting the changes the user makes in an embeddable view editing the back side of the drawing
+  embeddableIsEditingSelf: boolean;
+  popoutUnload: boolean; //the unloaded Excalidraw view was the last leaf in the popout window
+  viewunload: boolean;
+  //first time initialization of the view
+  scriptsReady: boolean;
+
+  //The role of justLoaded is to capture the Excalidraw.onChange event that fires right after the canvas was loaded for the first time to
+  //- prevent the first onChange event to mark the file as dirty and to consequently cause a save right after load, causing sync issues in turn
+  //- trigger autozoom (in conjunction with preventAutozoomOnLoad)
+  justLoaded: boolean;
+
+  //the modifyEventHandler in main.ts will fire when an Excalidraw file has changed (e.g. due to sync)
+  //when a drawing that is currently open in a view receives a sync update, excalidraw reload() is triggered
+  //the preventAutozoomOnLoad flag will prevent the open drawing from autozooming when it is reloaded
+  preventAutozoom: boolean;
+
+  autosaving: boolean; //flags that autosaving is in progress. Autosave is an async timer, the flag prevents collision with force save
+  forceSaving: boolean; //flags that forcesaving is in progress. The flag prevents collision with autosaving
+  dirty: string; //null if there are no changes to be saved, the path of the file if the drawing has unsaved changes
+
+  //reload() is triggered by modifyEventHandler in main.ts. preventReload is a one time flag to abort reloading
+  //to avoid interrupting the flow of drawing by the user.
+  preventReload: boolean;
+
+  isEditingText: boolean; //https://stackoverflow.com/questions/27132796/is-there-any-javascript-event-fired-when-the-on-screen-keyboard-on-mobile-safari
+
+  //Save is triggered by multiple threads when an Excalidraw pane is terminated
+  //- by the view itself
+  //- by the activeLeafChangeEventHandler change event handler
+  //- by monkeypatches on detach(next)
+  //This semaphore helps avoid collision of saves
+  saving: boolean;
+  hoverSleep: boolean; //flag with timer to prevent hover preview from being triggered dozens of times
+  wheelTimeout:number; //used to avoid hover preview while zooming
+}

src/types/types.d.ts

@@ -1,5 +1,6 @@
-import { ExcalidrawAutomate } from "../ExcalidrawAutomate";
-import { ExcalidrawLib } from "../ExcalidrawLib";
+import { TFile } from "obsidian";
+import { ExcalidrawAutomate } from "../shared/ExcalidrawAutomate";
+import { ExcalidrawLib } from "./excalidrawLib";
 
 export type ConnectionPoint = "top" | "bottom" | "left" | "right" | null;
 
@@ -33,10 +34,23 @@ export type DeviceType = {
 
 export type Point = [number, number];
 
+export type LinkSuggestion = {
+  file: TFile;
+  path: string;
+  alias?: string;
+}
+
 declare global {
   interface Window {
       ExcalidrawAutomate: ExcalidrawAutomate;
       pdfjsLib: any;
+      eval: (x: string) => any;
+      React?: any;
+      ReactDOM?: any;
+      ExcalidrawLib?: any;
+  }
+  interface File {
+    path?: string;
   }
 }
 
@@ -48,6 +62,24 @@ declare module "obsidian" {
     metadataTypeManager: {
       setType(name:string, type:string): void;
     };
+    plugins: {
+      plugins: {
+        [key: string]: Plugin | undefined;
+      };
+    };
+  }
+  interface FileManager {
+    promptForFileRename(file: TFile): Promise<void>;
+  }
+  interface FileView {
+    _loaded: boolean;
+    headerEl: HTMLElement;
+  }
+  interface TextFileView {
+    lastSavedData: string;
+  }
+  interface Menu {
+    items: MenuItem[];
   }
   interface Keymap {
     getRootScope(): Scope;
@@ -55,6 +87,16 @@ declare module "obsidian" {
   interface Scope {
     keys: any[];
   }
+  interface WorkspaceLeaf {
+    id: string;
+    containerEl: HTMLDivElement;
+    tabHeaderInnerTitleEl: HTMLDivElement;
+    tabHeaderInnerIconEl: HTMLDivElement;
+  }
+  interface WorkspaceWindowInitData {
+    x?: number;
+    y?: number;
+  }
   interface Workspace {
     on(
       name: "hover-link",
@@ -88,5 +130,15 @@ declare module "obsidian" {
   interface MetadataCache {
     getBacklinksForFile(file: TFile): any;
     getLinks(): { [id: string]: Array<{ link: string; displayText: string; original: string; position: any }> };
+    getCachedFiles(): string[];
+  }
+
+  interface HoverPopover {
+    containerEl: HTMLElement;
+    hide(): void;
+  }
+
+  interface Plugin {
+    _loaded: boolean;
   }
 }