YAY 3.0!!!

.eslintrc.js

@@ -37,6 +37,8 @@ module.exports = {
         'no-nested-ternary': 'off',
         'no-param-reassign': 'off',
         'tsdoc/syntax': 'off',
+        'import/no-extraneous-dependencies': 'off',
+        'eslint-comments/require-description': 'off',
       },
     },
   ],

.github/CONTRIBUTING.md

@@ -106,7 +106,6 @@ The `packages` folder contains all the code related to the Million.js package, b
 - `jsx-runtime` - This folder contains the code related to the runtime code for jsx.
 - `million` - This folder contains the code for the core Million.js package. The implementation of the optimized array rendering `<For/>`, `block()`, and virtual DOM for React are in here.
 - `react` and `react-server` - This folder contains the Million.js support package for React
-- `preact` and `preact-server` - This folder contains the Million.js support package for Preact
 - `types` - This folder contains all the shared types between packages
 
 To run the project locally, run the following commands:

README.md

@@ -6,7 +6,6 @@
   <a href="https://img.shields.io/github/actions/workflow/status/aidenybai/million/ci.yml?branch=main" target="_blank"><img src="https://img.shields.io/github/actions/workflow/status/aidenybai/million/ci.yml?branch=main&style=flat&colorA=000000&colorB=000000" alt="CI" /></a>
   <a href="https://www.npmjs.com/package/million" target="_blank"><img src="https://img.shields.io/npm/v/million?style=flat&colorA=000000&colorB=000000" alt="NPM Version" /></a>
     <a href="https://www.npmjs.com/package/million" target="_blank"><img src="https://img.shields.io/npm/dt/million.svg?style=flat&colorA=000000&colorB=000000" alt="NPM Downloads" /></a>
-    <img src="https://hits-app.vercel.app/hits?url=https://github.com/aidenybai/million&bgRight=000&bgLeft=000" />
   <a href="https://discord.gg/X9yFbcV2rF" target="_blank"><img src="https://img.shields.io/discord/938129049539186758?style=flat&colorA=000000&colorB=000000&label=discord&logo=discord&logoColor=ffffff" /></a>
 
 <table>
@@ -57,14 +56,13 @@ This repo is a "mono-repo" with modules. Million.js ships as one NPM package, bu
 
 You can also track our progress through our [Roadmap](https://github.com/users/aidenybai/projects/5/views/1?layout=roadmap).
 
-| Module                                                                                                                                                                | Description                                         |
-| --------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------- |
-| [`million`](https://github.com/aidenybai/million/tree/main/packages/million)                                                                                          | The main Virtual DOM with all of Million.js's core. |
-| [`react`](https://github.com/aidenybai/million/tree/main/packages/react) / [`react-server`](https://github.com/aidenybai/million/tree/main/packages/react-server)     | React compatibility for Million.js.                 |
-| [`preact`](https://github.com/aidenybai/million/tree/main/packages/preact) / [`preact-server`](https://github.com/aidenybai/million/tree/main/packages/preact-server) | Preact compatibility for Million.js.                |
-| [`compiler`](https://github.com/aidenybai/million/tree/main/packages/compiler)                                                                                        | The compiler for Million.js in React.               |
-| [`jsx-runtime`](https://github.com/aidenybai/million/tree/main/packages/jsx-runtime)                                                                                  | A simple JSX runtime for Million.js core.           |
-| [`types`](https://github.com/aidenybai/million/tree/main/packages/types)                                                                                              | Shared types between packages                       |
+| Module                                                                                                                                                            | Description                                         |
+| ----------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------- |
+| [`million`](https://github.com/aidenybai/million/tree/main/packages/million)                                                                                      | The main Virtual DOM with all of Million.js's core. |
+| [`react`](https://github.com/aidenybai/million/tree/main/packages/react) / [`react-server`](https://github.com/aidenybai/million/tree/main/packages/react-server) | React compatibility for Million.js.                 |
+| [`compiler`](https://github.com/aidenybai/million/tree/main/packages/compiler)                                                                                    | The compiler for Million.js in React.               |
+| [`jsx-runtime`](https://github.com/aidenybai/million/tree/main/packages/jsx-runtime)                                                                              | A simple JSX runtime for Million.js core.           |
+| [`types`](https://github.com/aidenybai/million/tree/main/packages/types)                                                                                          | Shared types between packages                       |
 
 ## Resources & Contributing Back
 

build.config.ts

@@ -15,8 +15,6 @@ export default defineBuildConfig({
     './packages/compiler',
     './packages/react',
     './packages/react-server',
-    './packages/preact',
-    './packages/preact-server',
     './packages/types',
   ],
   declaration: true,
@@ -39,5 +37,5 @@ export default defineBuildConfig({
       }
     },
   },
-  externals: ['react', 'react-dom', 'preact', 'million', 'vite', 'esbuild'],
+  externals: ['react', 'react-dom', 'million', 'vite', 'esbuild'],
 });

package.json

@@ -27,8 +27,6 @@
     "jsx-runtime.d.ts",
     "compiler.d.ts",
     "react-server.d.ts",
-    "preact.d.ts",
-    "preact-server.d.ts",
     "types.d.ts"
   ],
   "bin": {
@@ -85,26 +83,6 @@
         "default": "./dist/packages/react-server.cjs"
       }
     },
-    "./preact": {
-      "import": {
-        "types": "./dist/packages/preact.d.mts",
-        "default": "./dist/packages/preact.mjs"
-      },
-      "require": {
-        "types": "./dist/packages/preact.d.ts",
-        "default": "./dist/packages/preact.cjs"
-      }
-    },
-    "./preact-server": {
-      "import": {
-        "types": "./dist/packages/preact-server.d.mts",
-        "default": "./dist/packages/preact-server.mjs"
-      },
-      "require": {
-        "types": "./dist/packages/preact-server.d.ts",
-        "default": "./dist/packages/preact-server.cjs"
-      }
-    },
     "./types": {
       "import": {
         "types": "./dist/packages/types.d.mts",
@@ -140,24 +118,25 @@
   "homepage": "https://github.com/aidenybai/million",
   "prettier": "@vercel/style-guide/prettier",
   "dependencies": {
-    "@babel/core": "^7.21.0",
+    "@babel/core": "^7.23.3",
     "@babel/generator": "^7.22.7",
-    "@babel/plugin-syntax-jsx": "^7.21.4",
-    "@babel/plugin-syntax-typescript": "^7.21.4",
+    "@babel/parser": "^7.23.4",
+    "@babel/traverse": "^7.23.4",
     "@babel/types": "^7.21.3",
     "kleur": "^4.1.5",
-    "rollup": "^3.28.0",
     "unplugin": "^1.3.1"
   },
   "devDependencies": {
+    "@babel/helper-module-imports": "^7.22.15",
     "@rollup/plugin-replace": "^5.0.2",
-    "@types/babel__core": "^7.20.0",
-    "@types/babel__generator": "^7.6.4",
     "@types/babel-types": "^7.0.11",
+    "@types/babel__core": "^7.20.5",
+    "@types/babel__generator": "^7.6.4",
+    "@types/babel__helper-module-imports": "^7.18.3",
     "@types/node": "^18.14.1",
     "@typescript-eslint/eslint-plugin": "^5.53.0",
     "@typescript-eslint/parser": "^5.53.0",
-    "@vercel/style-guide": "^3.0.0",
+    "@vercel/style-guide": "^5.1.0",
     "@vitejs/plugin-react": "^4.0.0",
     "@vitest/coverage-v8": "^0.32.0",
     "bumpp": "^9.2.0",
@@ -168,10 +147,11 @@
     "jsdom": "^21.1.0",
     "prettier": "^2.8.4",
     "publint": "^0.1.12",
+    "rollup": "^4.5.1",
     "rollup-plugin-banner2": "^1.2.2",
     "source-map": "^0.7.4",
     "tslib": "^2.5.0",
-    "typescript": "^5.1.6",
+    "typescript": "^5.3.2",
     "unbuild": "2.0.0-rc.0",
     "vite": "^4.4.9",
     "vite-tsconfig-paths": "^4.2.0",

packages/compiler/__visitors.ts

@@ -0,0 +1,77 @@
+import type { Options } from './plugin';
+
+// TODO: refactor `any` type
+interface Visitor {
+  CallExpression: any | null;
+  JSXElement: any | null;
+  FunctionDeclaration: any | null;
+  VariableDeclaration: any | null;
+}
+
+const pool: Record<string, Visitor | null> = {
+  vdom: null,
+  react: null,
+  preact: null,
+};
+
+const vdom = async (options: Options) => {
+  if (pool.vdom) return pool.vdom;
+
+  const { visitor: callExpressionVisitor } = await import('./vdom');
+  const visitor = {
+    CallExpression: callExpressionVisitor(options),
+    JSXElement: null,
+    FunctionDeclaration: null,
+    VariableDeclaration: null,
+  };
+  pool.vdom = visitor;
+  return visitor;
+};
+
+const react = async (options: Options, isReact = true) => {
+  const mode = isReact ? 'react' : 'preact';
+  if (pool[mode]) return pool[mode] as Visitor;
+
+  const { callExpressionVisitor, jsxElementVisitor, componentVisitor } =
+    await import('./react');
+
+  const visitor = {
+    CallExpression: callExpressionVisitor(options, isReact),
+    JSXElement: jsxElementVisitor(options, isReact),
+    FunctionDeclaration: componentVisitor(options, isReact),
+    VariableDeclaration: componentVisitor(options, isReact),
+  };
+  pool[mode] = visitor;
+  return visitor;
+};
+
+const preact = (options: Options) => {
+  return react(options, false);
+};
+
+export const init = (
+  visitor: ReturnType<typeof visitors>,
+  options: Options,
+  ...params: any[]
+) => {
+  const result = {};
+
+  for (const key in visitor) {
+    const visit = visitor[key];
+    try {
+      result[key] = visit(...params);
+    } catch (err: unknown) {
+      if (err instanceof Error && err.message && !options.mute) {
+        // eslint-disable-next-line no-console
+        console.warn(err.message, '\n');
+      }
+    }
+  }
+  return result;
+};
+
+export const visitors = {
+  vdom,
+  react,
+  preact,
+};