chore: Drop @excalidraw/extensions and move the MathJax subtype into

`src/excalidraw-app/subtypes` to leave `@excalidraw/excalidraw` untouched.

`@excalidraw/extensions` mostly contained boilerplate and obscured the
main new features here: `ExcalidrawElement` subtypes and MathJax support.

index.html

@@ -138,7 +138,6 @@
     <% } %>
     <script>
       window.EXCALIDRAW_ASSET_PATH = "/";
-      window.EXCALIDRAW_EXTENSIONS_ASSET_PATH = "/";
       // setting this so that libraries installation reuses this window tab.
       window.name = "_excalidraw";
     </script>

package.json

@@ -20,7 +20,6 @@
   },
   "dependencies": {
     "@braintree/sanitize-url": "6.0.2",
-    "@excalidraw/extensions": "link:src/packages/extensions",
     "@excalidraw/random-username": "1.0.0",
     "@radix-ui/react-popover": "1.0.3",
     "@radix-ui/react-tabs": "1.0.2",
@@ -41,6 +40,7 @@
     "image-blob-reduce": "3.0.1",
     "jotai": "1.13.1",
     "lodash.throttle": "4.1.1",
+    "mathjax-full": "3.2.2",
     "nanoid": "3.3.3",
     "open-color": "1.9.1",
     "pako": "1.0.11",
@@ -114,7 +114,7 @@
     "fix": "yarn fix:other && yarn fix:code",
     "locales-coverage": "node scripts/build-locales-coverage.js",
     "locales-coverage:description": "node scripts/locales-coverage-description.js",
-    "postinstall": "patch-package --patch-dir src/packages/extensions/patches",
+    "postinstall": "patch-package",
     "prepare": "husky install",
     "prettier": "prettier \"**/*.{css,scss,json,md,html,yml}\" --ignore-path=.eslintignore",
     "start": "vite",

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 { useExtensions } from "@excalidraw/extensions";
+import { useSubtypes } from "./subtypes";
 import {
   APP_NAME,
   EVENT,
@@ -297,7 +297,7 @@ const ExcalidrawWrapper = () => {
   const [excalidrawAPI, excalidrawRefCallback] =
     useCallbackRefState<ExcalidrawImperativeAPI>();
 
-  useExtensions(excalidrawAPI);
+  useSubtypes(excalidrawAPI);
 
   const [collabAPI] = useAtom(collabAPIAtom);
   const [, setCollabDialogShown] = useAtom(collabDialogShownAtom);

src/excalidraw-app/subtypes/index.ts

@@ -0,0 +1,42 @@
+import { ExcalidrawImperativeAPI } from "../../types";
+import {
+  MathJaxSubtype,
+  setMathJaxSubtypeEnabled,
+  useMathJaxSubtype,
+} from "./mathjax";
+
+const validSubtypes: readonly string[] = [MathJaxSubtype];
+const subtypesUsed: string[] = [];
+
+// The main invocation hook for use in the UI
+export const useSubtypes = (
+  api: ExcalidrawImperativeAPI | null,
+  subtypes?: string[],
+) => {
+  selectSubtypesToEnable(subtypes);
+  useMathJaxSubtype(api);
+  // Put calls like `useThisSubtype(api);` here
+};
+
+// This MUST be called before the `useSubtype` calls.
+const selectSubtypesToEnable = (subtypes?: string[]) => {
+  const subtypeList: string[] = [];
+  if (subtypes === undefined) {
+    subtypeList.push(...validSubtypes);
+  } else {
+    subtypes.forEach(
+      (val) => validSubtypes.includes(val) && subtypeList.push(val),
+    );
+  }
+  while (subtypesUsed.length > 0) {
+    subtypesUsed.pop();
+  }
+  subtypesUsed.push(...subtypeList);
+  enableSelectedSubtypes();
+};
+
+const enableSelectedSubtypes = () => {
+  setMathJaxSubtypeEnabled(subtypesUsed.includes(MathJaxSubtype));
+  // Put lines here like
+  // `setThisSubtypeEnabled(subtypesUsed.includes(ThisSubtype));`
+};

src/excalidraw-app/subtypes/mathjax/icon.tsx

@@ -1,5 +1,5 @@
-import { Theme } from "../../../../element/types";
+import { Theme } from "../../../element/types";
-import { createIcon, iconFillColor } from "../../../../components/icons";
+import { createIcon, iconFillColor } from "../../../components/icons";
 
 // We inline font-awesome icons in order to save on js size rather than including the font awesome react library
 export const mathSubtypeIcon = ({ theme }: { theme: Theme }) =>

src/excalidraw-app/subtypes/mathjax/implementation.tsx

@@ -1,7 +1,7 @@
 // Some imports
 import fallbackMathJaxLangData from "./locales/en.json";
-import { FONT_FAMILY, SVG_NS } from "../../../../constants";
+import { FONT_FAMILY, SVG_NS } from "../../../constants";
-import { getFontString, getFontFamilyString, isRTL } from "../../../../utils";
+import { getFontString, getFontFamilyString, isRTL } from "../../../utils";
 import {
   getBoundTextElement,
   getBoundTextMaxWidth,
@@ -10,44 +10,41 @@ import {
   getTextWidth,
   measureText,
   wrapText,
-} from "../../../../element/textElement";
+} from "../../../element/textElement";
 import {
   hasBoundTextElement,
   isTextElement,
-} from "../../../../element/typeChecks";
+} from "../../../element/typeChecks";
 import {
   ExcalidrawElement,
   ExcalidrawTextElement,
   NonDeleted,
-} from "../../../../element/types";
+} from "../../../element/types";
-import { newElementWith } from "../../../../element/mutateElement";
+import { newElementWith } from "../../../element/mutateElement";
-import { getElementAbsoluteCoords } from "../../../../element/bounds";
+import { getElementAbsoluteCoords } from "../../../element/bounds";
-import Scene from "../../../../scene/Scene";
+import Scene from "../../../scene/Scene";
 
 // Imports for actions
-import { t, registerAuxLangData } from "../../../../i18n";
+import { t, registerAuxLangData } from "../../../i18n";
-import { Action } from "../../../../actions/types";
+import { Action } from "../../../actions/types";
-import { AppState } from "../../../../types";
+import { AppState } from "../../../types";
 import {
   changeProperty,
   getFormValue,
-} from "../../../../actions/actionProperties";
+} from "../../../actions/actionProperties";
-import { getSelectedElements } from "../../../../scene";
+import { getSelectedElements } from "../../../scene";
-import {
+import { getNonDeletedElements, redrawTextBoundingBox } from "../../../element";
-  getNonDeletedElements,
+import { ButtonIconSelect } from "../../../components/ButtonIconSelect";
-  redrawTextBoundingBox,
-} from "../../../../element";
-import { ButtonIconSelect } from "../../../../components/ButtonIconSelect";
 
 // Subtype imports
 import {
   SubtypeLoadedCb,
   SubtypeMethods,
   SubtypePrepFn,
-} from "../../../../subtypes";
+} from "../../../subtypes";
 import { mathSubtypeIcon } from "./icon";
 import { getMathSubtypeRecord } from "./types";
-import { SubtypeButton } from "../../../../components/Subtypes";
+import { SubtypeButton } from "../../../components/Subtypes";
 
 const mathSubtype = getMathSubtypeRecord().subtype;
 const FONT_FAMILY_MATH = FONT_FAMILY.Helvetica;

src/excalidraw-app/subtypes/mathjax/index.ts

@@ -0,0 +1,27 @@
+import { useEffect } from "react";
+import { ExcalidrawImperativeAPI } from "../../../types";
+import { addSubtypeMethods } from "../../../subtypes";
+import { getMathSubtypeRecord } from "./types";
+import { prepareMathSubtype } from "./implementation";
+
+export const MathJaxSubtype = "mathjax";
+
+// The main hook to use the MathJax subtype
+export const useMathJaxSubtype = (api: ExcalidrawImperativeAPI | null) => {
+  const enabled = mathJaxEnabled;
+  useEffect(() => {
+    if (enabled && api) {
+      const prep = api.addSubtype(getMathSubtypeRecord(), prepareMathSubtype);
+      if (prep) {
+        addSubtypeMethods(getMathSubtypeRecord().subtype, prep.methods);
+      }
+    }
+  }, [enabled, api]);
+};
+
+// Determine whether or not to do anything in `useMathJaxSubtype`
+let mathJaxEnabled = false;
+
+export const setMathJaxSubtypeEnabled = (enabled: boolean) => {
+  mathJaxEnabled = enabled;
+};

src/excalidraw-app/subtypes/mathjax/types.ts

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

src/global.d.ts

@@ -14,7 +14,6 @@ interface Document {
 interface Window {
   ClipboardItem: any;
   __EXCALIDRAW_SHA__: string | undefined;
-  EXCALIDRAW_EXTENSIONS_ASSET_PATH: string | undefined;
   EXCALIDRAW_ASSET_PATH: string | undefined;
   EXCALIDRAW_EXPORT_SOURCE: string;
   EXCALIDRAW_THROTTLE_RENDER: boolean | undefined;

src/packages/excalidraw/CHANGELOG.md

@@ -33,6 +33,7 @@ JSX.Element | null: The JSX component representing the custom rendering, or null
 
 ### Features
 
+- Add a `subtype` attribute to `ExcalidrawElement` to allow self-contained extensions of any `ExcalidrawElement` type. Implement MathJax support on stem.excalidraw.com as a `math` subtype of `ExcalidrawTextElement`. Both standard Latex input and simplified AsciiMath input are supported. [#6037](https://github.com/excalidraw/excalidraw/pull/6037).
 - Added [`props.validateEmbeddable`](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/api/props#validateEmbeddable) to customize embeddable src url validation. [#6691](https://github.com/excalidraw/excalidraw/pull/6691)
 - Add support for `opts.fitToViewport` and `opts.viewportZoomFactor` in the [`ExcalidrawAPI.scrollToContent`](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/api/props/ref#scrolltocontent) API. [#6581](https://github.com/excalidraw/excalidraw/pull/6581).
 - Properly sanitize element `link` urls. [#6728](https://github.com/excalidraw/excalidraw/pull/6728).
@@ -496,12 +497,6 @@ For more details refer to the [docs](https://docs.excalidraw.com)
 
 #### Features
 
-- Render math notation using the MathJax library. Both standard Latex input and simplified AsciiMath input are supported.
-
-  Also added plugin-like subtypes for `ExcalidrawElement`. These allow easily supporting custom extensions of `ExcalidrawElement`s such as for MathJax, Markdown, or inline code.
-
-  Also created an `@excalidraw/extensions` package. This package holds the MathJax extension to make it completely decoupled from `@excalidraw/excalidraw`. The MathJax extension is implemented as a `math` subtype of `ExcalidrawTextElement`. [#2993](https://github.com/excalidraw/excalidraw/pull/2993).
-
 - `restoreElements()` now takes an optional parameter to indicate whether we should also recalculate text element dimensions. Defaults to `true`, but since this is a potentially costly operation, you may want to disable it if you restore elements in tight loops, such as during collaboration [#5432](https://github.com/excalidraw/excalidraw/pull/5432).
 - Support rendering custom sidebar using [`renderSidebar`](https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/README.md#renderSidebar) prop ([#5663](https://github.com/excalidraw/excalidraw/pull/5663)).
 - Add [`toggleMenu`](https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/README.md#toggleMenu) prop to toggle specific menu open/close state ([#5663](https://github.com/excalidraw/excalidraw/pull/5663)).

src/packages/excalidraw/publicPath.js

@@ -2,12 +2,6 @@ import { ENV } from "../../constants";
 if (process.env.NODE_ENV !== ENV.TEST) {
   /* eslint-disable */
   /* global __webpack_public_path__:writable */
-  if (process.env.NODE_ENV === ENV.DEVELOPMENT && (
-    window.EXCALIDRAW_ASSET_PATH === undefined ||
-    window.EXCALIDRAW_ASSET_PATH === ""
-  )) {
-    window.EXCALIDRAW_ASSET_PATH = "/";
-  }
   __webpack_public_path__ =
     window.EXCALIDRAW_ASSET_PATH ||
     `https://unpkg.com/${process.env.VITE_PKG_NAME}@${process.env.VITE_PKG_VERSION}/dist/`;

src/packages/extensions/.gitignore

@@ -1,2 +0,0 @@
-node_modules
-dist

src/packages/extensions/.size-limit.json

@@ -1,16 +0,0 @@
-[
-  {
-    "path": "dist/excalidraw-extensions.production.min.js",
-    "limit": "5 MB"
-  },
-  {
-    "path": "dist/excalidraw-extensions-assets/locales",
-    "name": "dist/excalidraw-extensions-assets/locales",
-    "limit": "1.2 MB"
-  },
-  {
-    "path": "dist/excalidraw-extensions-assets/vendor-*.js",
-    "name": "dist/excalidraw-extensions-assets/vendor*.js",
-    "limit": "2.2 MB"
-  }
-]

src/packages/extensions/CHANGELOG.md

@@ -1,24 +0,0 @@
-# Changelog
-
-<!--
-Guidelines for changelog:
-The change should be grouped under one of the following sections and must contain a PR link.
-- Features: For new features.
-- Fixes: For bug fixes.
-- Chore: Changes for non src files example package.json.
-- Refactor: For any refactoring.
-
-Please add the latest change at the top under the correct section.
--->
-
-## Unreleased
-
-### Excalidraw Extensions
-
-#### Features
-
-- Render math notation using the MathJax library. Both standard Latex input and simplified AsciiMath input are supported. MathJax support is implemented as a `math` subtype of `ExcalidrawTextElement`.
-
-  Also added plugin-like subtypes for `ExcalidrawElement`. These allow easily supporting custom extensions of `ExcalidrawElement`s such as for MathJax, Markdown, or inline code. [#5311](https://github.com/excalidraw/excalidraw/pull/5311).
-
-- Provided a stub example extension (`./empty/index.ts`).

src/packages/extensions/README.md

@@ -1,45 +0,0 @@
-#### Note
-
-⚠️ ⚠️ ⚠️ You are viewing the docs for the **next** release, in case you want to check the docs for the stable release, you can view it [here](https://www.npmjs.com/package/@excalidraw/extensions).
-
-### Extensions
-
-Excalidraw extensions to be used in Excalidraw.
-
-### Installation
-
-You can use npm
-
-```
-npm install react react-dom @excalidraw/extensions
-```
-
-or via yarn
-
-```
-yarn add react react-dom @excalidraw/extensions
-```
-
-After installation you will see a folder `excalidraw-extensions-assets` and `excalidraw-extensions-assets-dev` in `dist` directory which contains the assets needed for this app in prod and dev mode respectively.
-
-Move the folder `excalidraw-extensions-assets` and `excalidraw-extensions-assets-dev` to the path where your assets are served.
-
-By default it will try to load the files from `https://unpkg.com/@excalidraw/extensions/dist/`
-
-If you want to load assets from a different path you can set a variable `window.EXCALIDRAW_EXTENSIONS_ASSET_PATH` depending on environment (for example if you have different URL's for dev and prod) to the url from where you want to load the assets.
-
-#### Note
-
-**If you don't want to wait for the next stable release and try out the unreleased changes you can use `@excalidraw/extensions@next`.**
-
-### Need help?
-
-Check out the existing [Q&A](https://github.com/excalidraw/excalidraw/discussions?discussions_q=label%3Apackage%3Aextensions). If you have any queries or need help, ask us [here](https://github.com/excalidraw/excalidraw/discussions?discussions_q=label%3Apackage%3Aextensions).
-
-### Development
-
-#### Install the dependencies
-
-```bash
-yarn
-```

src/packages/extensions/entry.js

@@ -1,3 +0,0 @@
-import "./publicPath";
-
-export * from "./ts/node-main";

src/packages/extensions/env.js

@@ -1,18 +0,0 @@
-const dotenv = require("dotenv");
-const { readFileSync } = require("fs");
-const pkg = require("./package.json");
-const parseEnvVariables = (filepath) => {
-  const envVars = Object.entries(dotenv.parse(readFileSync(filepath))).reduce(
-    (env, [key, value]) => {
-      env[key] = JSON.stringify(value);
-      return env;
-    },
-    {},
-  );
-  envVars.VITE_PKG_NAME = JSON.stringify(pkg.name);
-  envVars.VITE_PKG_VERSION = JSON.stringify(pkg.version);
-  envVars.VITE_IS_EXCALIDRAW_EXTENSIONS_NPM_PACKAGE = JSON.stringify(true);
-  return envVars;
-};
-
-module.exports = { parseEnvVariables };

src/packages/extensions/example/index.tsx

@@ -1,23 +0,0 @@
-import React from "react";
-import ReactDOM from "react-dom";
-
-import App from "../../excalidraw/example/App";
-
-declare global {
-  interface Window {
-    ExcalidrawExtensionsLib: any;
-  }
-}
-const { useExtensions } = window.ExcalidrawExtensionsLib;
-
-const rootElement = document.getElementById("root");
-ReactDOM.render(
-  <React.StrictMode>
-    <App
-      appTitle={"Excalidraw Extensions Example"}
-      useCustom={useExtensions}
-      customArgs={["mathjax"]}
-    />
-  </React.StrictMode>,
-  rootElement,
-);

src/packages/extensions/example/public/excalidraw-assets-dev

@@ -1 +0,0 @@
-../../../excalidraw/dist/excalidraw-assets-dev/

src/packages/extensions/example/public/excalidraw.development.js

@@ -1 +0,0 @@
-../../../excalidraw/dist/excalidraw.development.js

src/packages/extensions/example/public/images

@@ -1 +0,0 @@
-../../../excalidraw/example/public/images/

src/packages/extensions/example/public/index.html

@@ -1,32 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <meta
-      name="viewport"
-      content="width=device-width, initial-scale=1, shrink-to-fit=no"
-    />
-    <meta name="theme-color" content="#000000" />
-
-    <title>React App</title>
-    <script>
-      window.EXCALIDRAW_ASSET_PATH = "/";
-      window.EXCALIDRAW_EXTENSIONS_ASSET_PATH = "/";
-      window.name = "codesandbox";
-    </script>
-  </head>
-
-  <body>
-    <noscript> You need to enable JavaScript to run this app. </noscript>
-    <div id="root"></div>
-    <script src="https://unpkg.com/react@17.0.2/umd/react.development.js"></script>
-    <script src="https://unpkg.com/react-dom@17.0.2/umd/react-dom.development.js"></script>
-
-    <!-- This is so that we use the bundled excalidraw.development.js file instead
-    of the actual source code -->
-    <script src="./excalidraw.development.js"></script>
-    <script src="./excalidraw-extensions.development.js"></script>
-
-    <script src="./bundle.js"></script>
-  </body>
-</html>

src/packages/extensions/index.ts

@@ -1 +0,0 @@
-export * from "./ts/node-main";

src/packages/extensions/package.json

@@ -1,94 +0,0 @@
-{
-  "name": "@excalidraw/extensions",
-  "version": "0.15.2",
-  "main": "index.ts",
-  "files": [
-    "dist/*"
-  ],
-  "publishConfig": {
-    "access": "public"
-  },
-  "description": "Excalidraw extensions",
-  "repository": "https://github.com/excalidraw/excalidraw",
-  "license": "MIT",
-  "keywords": [
-    "excalidraw",
-    "excalidraw-embed",
-    "react",
-    "npm",
-    "npm excalidraw"
-  ],
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not ie <= 11",
-      "not op_mini all",
-      "not safari < 12",
-      "not kaios <= 2.5",
-      "not edge < 79",
-      "not chrome < 70",
-      "not and_uc < 13",
-      "not samsung < 10"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "peerDependencies": {
-    "react": "^17.0.2 || ^18.2.0",
-    "react-dom": "^17.0.2 || ^18.2.0"
-  },
-  "devDependencies": {
-    "@babel/core": "7.18.9",
-    "@babel/plugin-transform-arrow-functions": "7.18.6",
-    "@babel/plugin-transform-async-to-generator": "7.18.6",
-    "@babel/plugin-transform-runtime": "7.18.9",
-    "@babel/plugin-transform-typescript": "7.18.8",
-    "@babel/preset-env": "7.18.6",
-    "@babel/preset-react": "7.18.6",
-    "@babel/preset-typescript": "7.18.6",
-    "@size-limit/preset-big-lib": "8.2.6",
-    "autoprefixer": "10.4.7",
-    "babel-loader": "8.2.5",
-    "babel-plugin-transform-class-properties": "6.24.1",
-    "cross-env": "7.0.3",
-    "css-loader": "6.7.1",
-    "dotenv": "16.0.1",
-    "import-meta-loader": "1.1.0",
-    "mini-css-extract-plugin": "2.6.1",
-    "postcss-loader": "7.0.1",
-    "sass-loader": "13.0.2",
-    "size-limit": "8.2.4",
-    "style-loader": "3.3.3",
-    "terser-webpack-plugin": "5.3.3",
-    "ts-loader": "9.3.1",
-    "typescript": "4.9.4",
-    "webpack": "5.76.0",
-    "webpack-bundle-analyzer": "4.5.0",
-    "webpack-cli": "4.10.0",
-    "webpack-dev-server": "4.9.3",
-    "webpack-merge": "5.8.0"
-  },
-  "bugs": "https://github.com/excalidraw/excalidraw/issues",
-  "homepage": "https://github.com/excalidraw/excalidraw/tree/master/src/packages/extensions",
-  "scripts": {
-    "gen:types": "tsc --project ../../../tsconfig-types.json",
-    "build:umd": "rm -rf dist && cross-env NODE_ENV=production webpack --config webpack.prod.config.js && cross-env NODE_ENV=development webpack --config webpack.dev.config.js && yarn gen:types",
-    "build:umd:withAnalyzer": "cross-env NODE_ENV=production ANALYZER=true webpack --config webpack.prod.config.js",
-    "pack": "yarn build:umd && yarn pack",
-    "postinstall": "patch-package",
-    "start": "webpack serve --config webpack.dev-server.config.js",
-    "install:deps": "yarn install --frozen-lockfile && yarn --cwd ../../../",
-    "build:deps": "yarn --cwd ../excalidraw cross-env NODE_ENV=development webpack --config webpack.dev.config.js",
-    "build:example": "EXAMPLE=true webpack --config webpack.dev-server.config.js && yarn gen:types",
-    "size": "yarn build:umd && size-limit"
-  },
-  "dependencies": {
-    "mathjax-full": "3.2.2",
-    "patch-package": "8.0.0",
-    "postinstall-postinstall": "2.1.0"
-  }
-}

src/packages/extensions/publicPath.js

@@ -1,14 +0,0 @@
-import { ENV } from "../../constants";
-if (process.env.NODE_ENV !== ENV.TEST) {
-  /* eslint-disable */
-  /* global __webpack_public_path__:writable */
-  if (process.env.NODE_ENV === ENV.DEVELOPMENT && (
-    window.EXCALIDRAW_EXTENSIONS_ASSET_PATH === undefined ||
-    window.EXCALIDRAW_EXTENSIONS_ASSET_PATH === ""
-  )) {
-    window.EXCALIDRAW_EXTENSIONS_ASSET_PATH = "/";
-  }
-  __webpack_public_path__ =
-    window.EXCALIDRAW_EXTENSIONS_ASSET_PATH ||
-    `https://unpkg.com/${process.env.VITE_PKG_NAME}@${process.env.VITE_PKG_VERSION}/dist/`;
-}

src/packages/extensions/ts/empty/index.ts

@@ -1,26 +0,0 @@
-import { useEffect } from "react";
-import { ExcalidrawImperativeAPI } from "../../../../types";
-
-// Extension authors: provide a extension name here like "myextension"
-export const EmptyExtension = "empty";
-
-// Extension authors: provide a hook like `useMyExtension` in `myextension/index`
-export const useEmptyExtension = (api: ExcalidrawImperativeAPI | null) => {
-  const enabled = emptyExtensionLoadable;
-  useEffect(() => {
-    if (enabled) {
-    }
-  }, [enabled, api]);
-};
-
-// Extension authors: Use a variable like `myExtensionLoadable` to determine
-// whether or not to do anything in each of `useMyExtension` and `testMyExtension`.
-let emptyExtensionLoadable = false;
-
-export const getEmptyExtensionLoadable = () => {
-  return emptyExtensionLoadable;
-};
-
-export const setEmptyExtensionLoadable = (loadable: boolean) => {
-  emptyExtensionLoadable = loadable;
-};

src/packages/extensions/ts/mathjax/index.ts

@@ -1,32 +0,0 @@
-import { useEffect } from "react";
-import { ExcalidrawImperativeAPI } from "../../../../types";
-import { addSubtypeMethods } from "../../../../subtypes";
-import { getMathSubtypeRecord } from "./types";
-import { prepareMathSubtype } from "./implementation";
-
-export const MathJaxExtension = "mathjax";
-
-// Extension authors: provide a hook like `useMyExtension` in `myextension/index`
-export const useMathJaxExtension = (api: ExcalidrawImperativeAPI | null) => {
-  const enabled = mathJaxExtensionLoadable;
-  useEffect(() => {
-    if (enabled && api) {
-      const prep = api.addSubtype(getMathSubtypeRecord(), prepareMathSubtype);
-      if (prep) {
-        addSubtypeMethods(getMathSubtypeRecord().subtype, prep.methods);
-      }
-    }
-  }, [enabled, api]);
-};
-
-// Extension authors: Use a variable like `myExtensionLoadable` to determine
-// whether or not to do anything in each of `useMyExtension` and `testMyExtension`.
-let mathJaxExtensionLoadable = false;
-
-export const getMathJaxExtensionLoadable = () => {
-  return mathJaxExtensionLoadable;
-};
-
-export const setMathJaxExtensionLoadable = (loadable: boolean) => {
-  mathJaxExtensionLoadable = loadable;
-};

src/packages/extensions/ts/node-main.ts

@@ -1,59 +0,0 @@
-import { ExcalidrawImperativeAPI } from "../../../types";
-import {
-  EmptyExtension,
-  setEmptyExtensionLoadable,
-  useEmptyExtension,
-} from "./empty";
-import {
-  MathJaxExtension,
-  setMathJaxExtensionLoadable,
-  useMathJaxExtension,
-} from "./mathjax";
-
-// Extension authors: do imports like follows:
-// ```
-// import {
-//   MyExtension,
-//   setMyExtensionLoadable,
-//   useMyExtension,
-// } from "./myExtension";
-// ```
-
-// Extension authors: include `MyExtension` in `validExtensions`
-const validExtensions: readonly string[] = [EmptyExtension, MathJaxExtension];
-const extensionsUsed: string[] = [];
-
-// The main invocation hook for use in the UI
-export const useExtensions = (
-  api: ExcalidrawImperativeAPI | null,
-  extensions?: string[],
-) => {
-  selectExtensionsToLoad(extensions);
-  useEmptyExtension(api);
-  useMathJaxExtension(api);
-  // Extension authors: add a line here like `useMyExtension();`
-};
-
-// This MUST be called before the `useExtension`/`testExtension` calls.
-const selectExtensionsToLoad = (extensions?: string[]) => {
-  const extensionList: string[] = [];
-  if (extensions === undefined) {
-    extensionList.push(...validExtensions);
-  } else {
-    extensions.forEach(
-      (val) => validExtensions.includes(val) && extensionList.push(val),
-    );
-  }
-  while (extensionsUsed.length > 0) {
-    extensionsUsed.pop();
-  }
-  extensionsUsed.push(...extensionList);
-  setLoadableExtensions();
-};
-
-const setLoadableExtensions = () => {
-  setEmptyExtensionLoadable(extensionsUsed.includes(EmptyExtension));
-  setMathJaxExtensionLoadable(extensionsUsed.includes(MathJaxExtension));
-  // Extension authors: add a line here like
-  // `setMyExtensionLoadable(extensionsUsed.includes(MyExtension));`
-};

src/packages/extensions/webpack.dev-server.config.js

@@ -1,28 +0,0 @@
-const path = require("path");
-const { merge } = require("webpack-merge");
-
-const devConfig = require("./webpack.dev.config");
-
-const devServerConfig = {
-  entry: {
-    bundle: "./example/index.tsx",
-  },
-  // Server Configuration options
-  devServer: {
-    port: 3001,
-    host: "localhost",
-    hot: true,
-    compress: true,
-    static: {
-      directory: path.join(__dirname, "./example/public"),
-    },
-    client: {
-      progress: true,
-      logging: "info",
-      overlay: true, //Shows a full-screen overlay in the browser when there are compiler errors or warnings.
-    },
-    open: ["./"],
-  },
-};
-
-module.exports = merge(devServerConfig, devConfig);

src/packages/extensions/webpack.dev.config.js

@@ -1,101 +0,0 @@
-const path = require("path");
-const webpack = require("webpack");
-const autoprefixer = require("autoprefixer");
-const { parseEnvVariables } = require("./env");
-
-const outputDir = process.env.EXAMPLE === "true" ? "example/public" : "dist";
-module.exports = {
-  mode: "development",
-  devtool: false,
-  entry: {
-    "excalidraw-extensions.development": "./entry.js",
-  },
-  output: {
-    path: path.resolve(__dirname, outputDir),
-    library: "ExcalidrawExtensionsLib",
-    libraryTarget: "umd",
-    filename: "[name].js",
-    chunkFilename: "excalidraw-extensions-assets-dev/[name]-[contenthash].js",
-    assetModuleFilename: "excalidraw-extensions-assets-dev/[name][ext]",
-
-    publicPath: "",
-  },
-  resolve: {
-    extensions: [".js", ".ts", ".tsx", ".css", ".scss"],
-  },
-  module: {
-    rules: [
-      {
-        test: /\.(sa|sc|c)ss$/,
-        exclude: /node_modules/,
-        use: [
-          "style-loader",
-          { loader: "css-loader" },
-          {
-            loader: "postcss-loader",
-            options: {
-              postcssOptions: {
-                plugins: [autoprefixer()],
-              },
-            },
-          },
-          "sass-loader",
-        ],
-      },
-      {
-        test: /\.(ts|tsx|js|jsx|mjs)$/,
-        exclude:
-          /node_modules\/(?!(browser-fs-access|canvas-roundrect-polyfill))/,
-        use: [
-          {
-            loader: "import-meta-loader",
-          },
-          {
-            loader: "ts-loader",
-            options: {
-              transpileOnly: true,
-              configFile: path.resolve(__dirname, "../tsconfig.dev.json"),
-            },
-          },
-        ],
-      },
-      {
-        test: /\.(woff|woff2|eot|ttf|otf)$/,
-        type: "asset/resource",
-      },
-    ],
-  },
-  optimization: {
-    splitChunks: {
-      chunks: "async",
-      cacheGroups: {
-        vendors: {
-          test: /[\\/]node_modules[\\/]/,
-          name: "vendor",
-        },
-      },
-    },
-  },
-  plugins: [
-    new webpack.EvalSourceMapDevToolPlugin({ exclude: /vendor/ }),
-    new webpack.DefinePlugin({
-      "process.env": parseEnvVariables(
-        path.resolve(__dirname, "../../../.env.development"),
-      ),
-    }),
-  ],
-  externals: {
-    react: {
-      root: "React",
-      commonjs2: "react",
-      commonjs: "react",
-      amd: "react",
-    },
-    "react-dom": {
-      root: "ReactDOM",
-      commonjs2: "react-dom",
-      commonjs: "react-dom",
-      amd: "react-dom",
-    },
-  },
-};

src/packages/extensions/webpack.prod.config.js

@@ -1,124 +0,0 @@
-const path = require("path");
-const TerserPlugin = require("terser-webpack-plugin");
-const BundleAnalyzerPlugin =
-  require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
-const autoprefixer = require("autoprefixer");
-const webpack = require("webpack");
-const { parseEnvVariables } = require("./env");
-
-module.exports = {
-  mode: "production",
-  entry: {
-    "excalidraw-extensions.production.min": "./entry.js",
-  },
-  output: {
-    path: path.resolve(__dirname, "dist"),
-    library: "ExcalidrawExtensionsLib",
-    libraryTarget: "umd",
-    filename: "[name].js",
-    chunkFilename: "excalidraw-extensions-assets/[name]-[contenthash].js",
-    assetModuleFilename: "excalidraw-extensions-assets/[name][ext]",
-    publicPath: "",
-  },
-  resolve: {
-    extensions: [".js", ".ts", ".tsx", ".css", ".scss"],
-  },
-  module: {
-    rules: [
-      {
-        test: /\.(sa|sc|c)ss$/,
-        exclude: /node_modules/,
-        use: [
-          "style-loader",
-          {
-            loader: "css-loader",
-          },
-          {
-            loader: "postcss-loader",
-            options: {
-              postcssOptions: {
-                plugins: [autoprefixer()],
-              },
-            },
-          },
-          "sass-loader",
-        ],
-      },
-      {
-        test: /\.(ts|tsx|js|jsx|mjs)$/,
-        exclude:
-          /node_modules\/(?!(browser-fs-access|canvas-roundrect-polyfill))/,
-
-        use: [
-          {
-            loader: "import-meta-loader",
-          },
-          {
-            loader: "ts-loader",
-            options: {
-              transpileOnly: true,
-              configFile: path.resolve(__dirname, "../tsconfig.prod.json"),
-            },
-          },
-          {
-            loader: "babel-loader",
-            options: {
-              presets: [
-                "@babel/preset-env",
-                ["@babel/preset-react", { runtime: "automatic" }],
-                "@babel/preset-typescript",
-              ],
-              plugins: [
-                "transform-class-properties",
-                "@babel/plugin-transform-runtime",
-              ],
-            },
-          },
-        ],
-      },
-      {
-        test: /\.(woff|woff2|eot|ttf|otf)$/,
-        type: "asset/resource",
-      },
-    ],
-  },
-  optimization: {
-    minimize: true,
-    minimizer: [
-      new TerserPlugin({
-        test: /\.js($|\?)/i,
-      }),
-    ],
-    splitChunks: {
-      chunks: "async",
-      cacheGroups: {
-        vendors: {
-          test: /[\\/]node_modules[\\/]/,
-          name: "vendor",
-        },
-      },
-    },
-  },
-  plugins: [
-    ...(process.env.ANALYZER === "true" ? [new BundleAnalyzerPlugin()] : []),
-    new webpack.DefinePlugin({
-      "process.env": parseEnvVariables(
-        path.resolve(__dirname, "../../../.env.production"),
-      ),
-    }),
-  ],
-  externals: {
-    react: {
-      root: "React",
-      commonjs2: "react",
-      commonjs: "react",
-      amd: "react",
-    },
-    "react-dom": {
-      root: "ReactDOM",
-      commonjs2: "react-dom",
-      commonjs: "react-dom",
-      amd: "react-dom",
-    },
-  },
-};

src/tests/scene/export.test.ts

@@ -8,7 +8,6 @@ import {
 
 describe("exportToSvg", () => {
   window.EXCALIDRAW_ASSET_PATH = "/";
-  window.EXCALIDRAW_EXTENSIONS_ASSET_PATH = "/";
   const ELEMENT_HEIGHT = 100;
   const ELEMENT_WIDTH = 100;
   const ELEMENTS = [

src/vite-env.d.ts

@@ -46,7 +46,6 @@ interface ImportMetaEnv {
   VITE_PKG_NAME: string;
   VITE_PKG_VERSION: string;
   VITE_IS_EXCALIDRAW_NPM_PACKAGE: string;
-  VITE_IS_EXCALIDRAW_EXTENSIONS_NPM_PACKAGE: string;
 
   VITE_WORKER_ID: string;
   MODE: string;

tsconfig-types.json

@@ -1,5 +1,5 @@
 {
-  "include": ["src/packages/excalidraw", "src/packages/extensions", "src/global.d.ts", "src/css.d.ts"],
+  "include": ["src/packages/excalidraw", "src/global.d.ts", "src/css.d.ts"],
   "compilerOptions": {
     "types": ["vite/client", "vite-plugin-svgr/client"],
     "allowJs": true,

yarn.lock

@@ -1522,10 +1522,6 @@
   resolved "https://registry.yarnpkg.com/@excalidraw/eslint-config/-/eslint-config-1.0.3.tgz#2122ef7413ae77874ae9848ce0f1c6b3f0d8bbbd"
   integrity sha512-GemHNF5Z6ga0BWBSX7GJaNBUchLu6RwTcAB84eX1MeckRNhNasAsPCdelDlFalz27iS4RuYEQh0bPE8SRxJgbQ==
 
-"@excalidraw/extensions@link:src/packages/extensions":
-  version "0.0.0"
-  uid ""
-
 "@excalidraw/prettier-config@1.0.2":
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/@excalidraw/prettier-config/-/prettier-config-1.0.2.tgz#b7c061c99cee2f78b9ca470ea1fbd602683bba65"