refactor: Move MathJax into src/element/subtypes for the

`excalidraw-app` separation, maintaining lazy-loading of MathJax.

src/charts.ts

@@ -12,7 +12,7 @@ import { newElement, newLinearElement, newTextElement } from "./element";
 import { NonDeletedExcalidrawElement } from "./element/types";
 import { randomId } from "./random";
 import { AppState } from "./types";
-import { selectSubtype } from "./subtypes";
+import { selectSubtype } from "./element/subtypes";
 
 export type ChartElements = readonly NonDeletedExcalidrawElement[];
 

src/components/App.tsx

@@ -278,7 +278,7 @@ import {
   prepareSubtype,
   selectSubtype,
   subtypeActionPredicate,
-} from "../subtypes";
+} from "../element/subtypes";
 import {
   dataURLToFile,
   generateIdFromFile,
@@ -583,7 +583,6 @@ class App extends React.Component<AppProps, AppState> {
 
     this.actionManager.registerAction(createUndoAction(this.history));
     this.actionManager.registerAction(createRedoAction(this.history));
-    // Call `this.addSubtype()` here for `@excalidraw/excalidraw`-specific subtypes
     this.actionManager.registerActionPredicate(subtypeActionPredicate);
   }
 

src/components/PasteChartDialog.tsx

@@ -10,7 +10,7 @@ import { useApp } from "./App";
 import { Dialog } from "./Dialog";
 
 import "./PasteChartDialog.scss";
-import { ensureSubtypesLoaded } from "../subtypes";
+import { ensureSubtypesLoaded } from "../element/subtypes";
 import { isTextElement } from "../element";
 import {
   getContainerElement,

src/components/Subtypes.tsx

@@ -9,7 +9,7 @@ import {
   isSubtypeAction,
   isValidSubtype,
   subtypeCollides,
-} from "../subtypes";
+} from "../element/subtypes";
 import { ExcalidrawElement, Theme } from "../element/types";
 import {
   useExcalidrawActionManager,

src/data/restore.ts

@@ -36,7 +36,7 @@ import { LinearElementEditor } from "../element/linearElementEditor";
 import { bumpVersion } from "../element/mutateElement";
 import { getUpdatedTimestamp, updateActiveTool } from "../utils";
 import { arrayToMap } from "../utils";
-import { isValidSubtype } from "../subtypes";
+import { isValidSubtype } from "../element/subtypes";
 import { MarkOptional, Mutable } from "../utility-types";
 import {
   detectLineHeight,

src/element/mutateElement.ts

@@ -7,7 +7,7 @@ import { getUpdatedTimestamp } from "../utils";
 import { Mutable } from "../utility-types";
 import { ShapeCache } from "../scene/ShapeCache";
 import { maybeGetSubtypeProps } from "./newElement";
-import { getSubtypeMethods } from "../subtypes";
+import { getSubtypeMethods } from "./subtypes";
 
 type ElementUpdate<TElement extends ExcalidrawElement> = Omit<
   Partial<TElement>,

src/element/newElement.ts

@@ -40,7 +40,7 @@ import {
   VERTICAL_ALIGN,
 } from "../constants";
 import { MarkOptional, Merge, Mutable } from "../utility-types";
-import { getSubtypeMethods, isValidSubtype } from "../subtypes";
+import { getSubtypeMethods, isValidSubtype } from "./subtypes";
 
 export const maybeGetSubtypeProps = (
   obj: {

src/element/subtypes/index.ts

@@ -1,27 +1,23 @@
-import {
+import { ExcalidrawElement, ExcalidrawTextElement, NonDeleted } from "../types";
-  ExcalidrawElement,
+import { getNonDeletedElements } from "../";
-  ExcalidrawTextElement,
+import { getSelectedElements } from "../../scene";
-  NonDeleted,
+import { AppState } from "../../types";
-} from "./element/types";
+import { registerAuxLangData } from "../../i18n";
-import { getNonDeletedElements } from "./element";
-import { getSelectedElements } from "./scene";
-import { AppState } from "./types";
-import { registerAuxLangData } from "./i18n";
 
-import { Action, ActionName, ActionPredicateFn } from "./actions/types";
+import { Action, ActionName, ActionPredicateFn } from "../../actions/types";
 import {
   CustomShortcutName,
   registerCustomShortcuts,
-} from "./actions/shortcuts";
+} from "../../actions/shortcuts";
-import { register } from "./actions/register";
+import { register } from "../../actions/register";
-import { hasBoundTextElement, isTextElement } from "./element/typeChecks";
+import { hasBoundTextElement, isTextElement } from "../typeChecks";
 import {
   getBoundTextElement,
   getContainerElement,
   redrawTextBoundingBox,
-} from "./element/textElement";
+} from "../textElement";
-import { ShapeCache } from "./scene/ShapeCache";
+import { ShapeCache } from "../../scene/ShapeCache";
-import Scene from "./scene/Scene";
+import Scene from "../../scene/Scene";
 
 // Use "let" instead of "const" so we can dynamically add subtypes
 let subtypeNames: readonly Subtype[] = [];

src/element/subtypes/mathjax/implementation.tsx

@@ -37,11 +37,7 @@ import { getNonDeletedElements, redrawTextBoundingBox } from "../../../element";
 import { ButtonIconSelect } from "../../../components/ButtonIconSelect";
 
 // Subtype imports
-import {
+import { SubtypeLoadedCb, SubtypeMethods, SubtypePrepFn } from "../";
-  SubtypeLoadedCb,
-  SubtypeMethods,
-  SubtypePrepFn,
-} from "../../../subtypes";
 import { mathSubtypeIcon } from "./icon";
 import { getMathSubtypeRecord } from "./types";
 import { SubtypeButton } from "../../../components/Subtypes";

src/element/subtypes/mathjax/index.ts

@@ -1,6 +1,6 @@
 import { useEffect } from "react";
 import { ExcalidrawImperativeAPI } from "../../../types";
-import { addSubtypeMethods } from "../../../subtypes";
+import { addSubtypeMethods } from "../";
 import { getMathSubtypeRecord } from "./types";
 import { prepareMathSubtype } from "./implementation";
 

src/element/subtypes/mathjax/tests/implementation.test.tsx

@@ -1,9 +1,9 @@
 import { render } from "../../../../tests/test-utils";
 import { API } from "../../../../tests/helpers/api";
-import ExcalidrawApp from "../../../";
+import ExcalidrawApp from "../../../../excalidraw-app";
 
-import { measureTextElement } from "../../../../element/textElement";
+import { measureTextElement } from "../../../textElement";
-import { ensureSubtypesLoaded } from "../../../../subtypes";
+import { ensureSubtypesLoaded } from "../../";
 
 describe("mathjax", () => {
   it("text-only measurements match", async () => {

src/element/subtypes/mathjax/types.ts

@@ -1,5 +1,5 @@
 import { getShortcutKey } from "../../../utils";
-import { SubtypeRecord } from "../../../subtypes";
+import { SubtypeRecord } from "../";
 
 // Exports
 export const getMathSubtypeRecord = () => mathSubtype;

src/element/textElement.ts

@@ -1,4 +1,4 @@
-import { getSubtypeMethods, SubtypeMethods } from "../subtypes";
+import { getSubtypeMethods, SubtypeMethods } from "./subtypes";
 import { getFontString, arrayToMap, isTestEnv } from "../utils";
 import {
   ExcalidrawElement,

src/element/textWysiwyg.tsx

@@ -44,7 +44,7 @@ import { actionZoomIn, actionZoomOut } from "../actions/actionCanvas";
 import App from "../components/App";
 import { LinearElementEditor } from "./linearElementEditor";
 import { parseClipboard } from "../clipboard";
-import { SubtypeMethods, getSubtypeMethods } from "../subtypes";
+import { SubtypeMethods, getSubtypeMethods } from "./subtypes";
 
 const getTransform = (
   offsetX: number,

src/excalidraw-app/index.tsx

@@ -5,7 +5,7 @@ import { trackEvent } from "../analytics";
 import { getDefaultAppState } from "../appState";
 import { ErrorDialog } from "../components/ErrorDialog";
 import { TopErrorBoundary } from "../components/TopErrorBoundary";
-import { useSubtypes } from "./subtypes";
+import { useSubtypes } from "../element/subtypes/use";
 import {
   APP_NAME,
   EVENT,

src/renderer/renderElement.ts

@@ -31,7 +31,7 @@ import {
   InteractiveCanvasAppState,
 } from "../types";
 import { getDefaultAppState } from "../appState";
-import { getSubtypeMethods } from "../subtypes";
+import { getSubtypeMethods } from "../element/subtypes";
 import {
   BOUND_TEXT_PADDING,
   FRAME_STYLE,

src/tests/helpers/api.ts

@@ -23,7 +23,7 @@ import {
   prepareSubtype,
   selectSubtype,
   subtypeActionPredicate,
-} from "../../subtypes";
+} from "../../element/subtypes";
 import {
   maybeGetSubtypeProps,
   newEmbeddableElement,

src/tests/subtypes.test.tsx

@@ -12,7 +12,7 @@ import {
   isValidSubtype,
   selectSubtype,
   subtypeCollides,
-} from "../subtypes";
+} from "../element/subtypes";
 
 import { render } from "./test-utils";
 import { API } from "./helpers/api";

src/types.ts

@@ -37,7 +37,7 @@ import {
   Subtype,
   SubtypePrepFn,
   SubtypeRecord,
-} from "./subtypes";
+} from "./element/subtypes";
 import type { FileSystemHandle } from "./data/filesystem";
 import type { IMAGE_MIME_TYPES, MIME_TYPES } from "./constants";
 import { ContextMenuItems } from "./components/ContextMenu";