Add @excalidraw/element package

excalidraw-app/vite.config.mts

@@ -47,6 +47,14 @@ export default defineConfig(({ mode }) => {
           find: /^@excalidraw\/math\/(.*?)/,
           replacement: path.resolve(__dirname, "../packages/math/$1"),
         },
+        {
+          find: /^@excalidraw\/element$/,
+          replacement: path.resolve(__dirname, "../packages/element/index.ts"),
+        },
+        {
+          find: /^@excalidraw\/element\/(.*?)/,
+          replacement: path.resolve(__dirname, "../packages/element/$1"),
+        },
       ],
     },
     build: {

packages/element/README.md

@@ -0,0 +1,19 @@
+# @excalidraw/element
+
+## Install
+
+```bash
+npm install @excalidraw/element
+```
+
+If you prefer Yarn over npm, use this command to install the Excalidraw utils package:
+
+```bash
+yarn add @excalidraw/element
+```
+
+With PNPM, similarly install the package with this command:
+
+```bash
+pnpm add @excalidraw/element
+```

packages/element/package.json

@@ -0,0 +1,61 @@
+{
+    "name": "@excalidraw/element",
+    "version": "0.1.0",
+    "type": "module",
+    "types": "./dist/types/element/index.d.ts",
+    "main": "./dist/prod/index.js",
+    "module": "./dist/prod/index.js",
+    "exports": {
+      ".": {
+        "types": "./dist/types/element/index.d.ts",
+        "development": "./dist/dev/index.js",
+        "production": "./dist/prod/index.js",
+        "default": "./dist/prod/index.js"
+      },
+      "./*": {
+        "types": "./../element/dist/types/element/*"
+      }
+    },
+    "files": [
+      "dist/*"
+    ],
+    "description": "Excalidraw elements-related logic",
+    "publishConfig": {
+      "access": "public"
+    },
+    "license": "MIT",
+    "keywords": [
+      "excalidraw",
+      "excalidraw-utils"
+    ],
+    "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"
+      ]
+    },
+    "dependencies": {
+    },
+    "devDependencies": {
+    },
+    "bugs": "https://github.com/excalidraw/excalidraw/issues",
+    "repository": "https://github.com/excalidraw/excalidraw",
+    "scripts": {
+      "gen:types": "rm -rf types && tsc",
+      "build:esm": "rm -rf dist && node ../../scripts/buildShared.js && yarn gen:types"
+    }
+  }
+  

packages/element/tsconfig.json

@@ -0,0 +1,6 @@
+{
+  "extends": "../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "./dist/types"
+  }
+}

packages/excalidraw/tsconfig.json

@@ -1,24 +1,6 @@
 {
+  "extends": "../tsconfig.base.json",
   "compilerOptions": {
-    "outDir": "./dist/types",
-    "target": "ESNext",
-    "strict": true,
-    "skipLibCheck": true,
-    "declaration": true,
-    "allowSyntheticDefaultImports": true,
-    "module": "ESNext",
-    "moduleResolution": "Node",
-    "resolveJsonModule": true,
-    "jsx": "react-jsx",
-    "emitDeclarationOnly": true,
-    "paths": {
-      "@excalidraw/excalidraw": ["../excalidraw/index.tsx"],
-      "@excalidraw/utils": ["../utils/index.ts"],
-      "@excalidraw/math": ["../math/index.ts"],
-      "@excalidraw/excalidraw/*": ["../excalidraw/*"],
-      "@excalidraw/utils/*": ["../utils/*"],
-      "@excalidraw/math/*": ["../math/*"]
-    }
-  },
-  "exclude": ["**/*.test.*", "tests", "types", "examples", "dist"]
+    "outDir": "./dist/types"
+  }
 }

packages/math/README.md

@@ -17,5 +17,3 @@ With PNPM, similarly install the package with this command:
 ```bash
 pnpm add @excalidraw/math
 ```
-
-## API

packages/math/package.json

@@ -54,6 +54,6 @@
   "repository": "https://github.com/excalidraw/excalidraw",
   "scripts": {
     "gen:types": "rm -rf types && tsc",
-    "build:esm": "rm -rf dist && node ../../scripts/buildMath.js && yarn gen:types"
+    "build:esm": "rm -rf dist && node ../../scripts/buildShared.js && yarn gen:types"
   }
 }

packages/math/tsconfig.json

@@ -1,24 +1,6 @@
 {
+  "extends": "../tsconfig.base.json",
   "compilerOptions": {
-    "outDir": "./dist/types",
-    "target": "ESNext",
-    "strict": true,
-    "skipLibCheck": true,
-    "declaration": true,
-    "allowSyntheticDefaultImports": true,
-    "module": "ESNext",
-    "moduleResolution": "Node",
-    "resolveJsonModule": true,
-    "jsx": "react-jsx",
-    "emitDeclarationOnly": true,
-    "paths": {
-      "@excalidraw/excalidraw": ["../excalidraw/index.tsx"],
-      "@excalidraw/utils": ["../utils/index.ts"],
-      "@excalidraw/math": ["../math/index.ts"],
-      "@excalidraw/excalidraw/*": ["../excalidraw/*"],
-      "@excalidraw/utils/*": ["../utils/*"],
-      "@excalidraw/math/*": ["../math/*"]
-    }
-  },
-  "exclude": ["**/*.test.*", "tests", "types", "examples", "dist"]
+    "outDir": "./dist/types"
+  }
 }

packages/tsconfig.base.json

@@ -0,0 +1,27 @@
+
+{
+    "compilerOptions": {
+      "target": "ESNext",
+      "strict": true,
+      "skipLibCheck": true,
+      "declaration": true,
+      "allowSyntheticDefaultImports": true,
+      "module": "ESNext",
+      "moduleResolution": "Node",
+      "resolveJsonModule": true,
+      "jsx": "react-jsx",
+      "emitDeclarationOnly": true,
+      "paths": {
+        "@excalidraw/excalidraw": ["./excalidraw/index.tsx"],
+        "@excalidraw/utils": ["./utils/index.ts"],
+        "@excalidraw/math": ["./math/index.ts"],
+        "@excalidraw/element": ["./element/index.ts"],
+        "@excalidraw/excalidraw/*": ["./excalidraw/*"],
+        "@excalidraw/utils/*": ["./utils/*"],
+        "@excalidraw/math/*": ["./math/*"],
+        "@excalidraw/element/*": ["./element/*"]
+      }
+    },
+    "exclude": ["**/*.test.*", "tests", "types", "examples", "dist"]
+  }
+  

packages/utils/package.json

@@ -70,6 +70,6 @@
   "repository": "https://github.com/excalidraw/excalidraw",
   "scripts": {
     "gen:types": "rm -rf types && tsc",
-    "build:esm": "rm -rf dist && node ../../scripts/buildUtils.js && yarn gen:types"
+    "build:esm": "rm -rf dist && node ../../scripts/buildShared.js && yarn gen:types"
   }
 }

packages/utils/tsconfig.json

@@ -1,24 +1,6 @@
 {
+  "extends": "../tsconfig.base.json",
   "compilerOptions": {
-    "outDir": "./dist/types",
-    "target": "ESNext",
-    "strict": true,
-    "skipLibCheck": true,
-    "declaration": true,
-    "allowSyntheticDefaultImports": true,
-    "module": "ESNext",
-    "moduleResolution": "Node",
-    "resolveJsonModule": true,
-    "jsx": "react-jsx",
-    "emitDeclarationOnly": true,
-    "paths": {
-      "@excalidraw/excalidraw": ["../excalidraw/index.tsx"],
-      "@excalidraw/utils": ["../utils/index.ts"],
-      "@excalidraw/math": ["../math/index.ts"],
-      "@excalidraw/excalidraw/*": ["../excalidraw/*"],
-      "@excalidraw/utils/*": ["../utils/*"],
-      "@excalidraw/math/*": ["../math/*"]
-    }
-  },
-  "exclude": ["**/*.test.*", "tests", "types", "examples", "dist"]
+    "outDir": "./dist/types"
+  }
 }

scripts/buildMath.js

@@ -1,53 +0,0 @@
-const path = require("path");
-
-const { build } = require("esbuild");
-const { sassPlugin } = require("esbuild-sass-plugin");
-
-// contains all dependencies bundled inside
-const getConfig = (outdir) => ({
-  outdir,
-  bundle: true,
-  format: "esm",
-  entryPoints: ["index.ts"],
-  entryNames: "[name]",
-  assetNames: "[dir]/[name]",
-  alias: {
-    "@excalidraw/excalidraw": path.resolve(__dirname, "../packages/excalidraw"),
-    "@excalidraw/utils": path.resolve(__dirname, "../packages/utils"),
-    "@excalidraw/math": path.resolve(__dirname, "../packages/math"),
-  },
-});
-
-function buildDev(config) {
-  return build({
-    ...config,
-    plugins: [sassPlugin()],
-    sourcemap: true,
-    define: {
-      "import.meta.env": JSON.stringify({ DEV: true }),
-    },
-  });
-}
-
-function buildProd(config) {
-  return build({
-    ...config,
-    plugins: [sassPlugin()],
-    minify: true,
-    define: {
-      "import.meta.env": JSON.stringify({ PROD: true }),
-    },
-  });
-}
-
-const createESMRawBuild = async () => {
-  // development unminified build with source maps
-  buildDev(getConfig("dist/dev"));
-
-  // production minified build without sourcemaps
-  buildProd(getConfig("dist/prod"));
-};
-
-(async () => {
-  await createESMRawBuild();
-})();

scripts/buildPackage.js

@@ -31,6 +31,7 @@ const getConfig = (outdir) => ({
     "@excalidraw/excalidraw": path.resolve(__dirname, "../packages/excalidraw"),
     "@excalidraw/utils": path.resolve(__dirname, "../packages/utils"),
     "@excalidraw/math": path.resolve(__dirname, "../packages/math"),
+    "@excalidraw/element": path.resolve(__dirname, "../packages/element"),
   },
   loader: {
     ".woff2": "file",

scripts/buildShared.js

@@ -17,6 +17,7 @@ const getConfig = (outdir) => ({
     "@excalidraw/excalidraw": path.resolve(__dirname, "../packages/excalidraw"),
     "@excalidraw/utils": path.resolve(__dirname, "../packages/utils"),
     "@excalidraw/math": path.resolve(__dirname, "../packages/math"),
+    "@excalidraw/element": path.resolve(__dirname, "../packages/element"),
   },
 });
 

tsconfig.json

@@ -22,9 +22,11 @@
       "@excalidraw/excalidraw": ["./packages/excalidraw/index.tsx"],
       "@excalidraw/utils": ["./packages/utils/index.ts"],
       "@excalidraw/math": ["./packages/math/index.ts"],
+      "@excalidraw/element": ["./packages/element/index.ts"],
       "@excalidraw/excalidraw/*": ["./packages/excalidraw/*"],
       "@excalidraw/utils/*": ["./packages/utils/*"],
-      "@excalidraw/math/*": ["./packages/math/*"]
+      "@excalidraw/math/*": ["./packages/math/*"],
+      "@excalidraw/element/*": ["./packages/element/*"]
     }
   },
   "include": ["packages", "excalidraw-app"],