@peachy/plugin-react 0.0.9 → 0.0.11

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import { Plugin } from "rolldown";
 
 //#region src/index.d.ts
-declare function react(port: number): Plugin[];
+declare function reactHMRPlugin(port: number): Plugin[];
 //#endregion
-export { react };
+export { reactHMRPlugin };

package/dist/index.mjs

@@ -1,9 +1,9 @@
-import { babel } from "@rollup/plugin-babel";
-import ReactFreshBabelPlugin from "react-refresh/babel";
-import BabelJSX from "@babel/plugin-syntax-jsx";
-import BabelTS from "@babel/plugin-syntax-typescript";
 import { resolve } from "path";
+import { exactRegex, prefixRegex } from "rolldown/filter";
 import { readFileSync } from "fs";
+import remapping from "@ampproject/remapping";
+import MagicString from "magic-string";
+import { transform } from "rolldown/experimental";
 
 //#region src/entrypoint.ts
 function addHmrEntrypoint(input) {
@@ -28,16 +28,18 @@ function createHmrEntrypointPlugin() {
 				input: addHmrEntrypoint(opts.input)
 			};
 		},
-		resolveId(id) {
-			if (id.startsWith(PREFIX)) return id;
-			return null;
+		resolveId: {
+			filter: { id: prefixRegex(PREFIX) },
+			handler(id) {
+				return id;
+			}
 		},
-		load(id) {
-			if (id.startsWith(PREFIX)) {
+		load: {
+			filter: { id: prefixRegex(PREFIX) },
+			handler(id) {
 				const actualEntry = id.slice(21);
 				return `import '${resolvedPath}';\nimport '${resolve(process.cwd(), actualEntry)}';`;
 			}
-			return null;
 		}
 	};
 }
@@ -48,11 +50,17 @@ function hmrRuntimePlugin(port) {
 	const runtime = resolve(import.meta.dirname, "./templates/hmr-runtime.ts");
 	return {
 		name: "hmr-runtime-plugin",
-		resolveId(id) {
-			if (id === "\0virtual:hmr-runtime") return runtime;
+		resolveId: {
+			filter: { id: exactRegex("\0virtual:hmr-runtime") },
+			handler() {
+				return runtime;
+			}
 		},
-		async transform(code, id) {
-			if (id === runtime) return { code: code.replace("$port$", port.toString()) };
+		transform: {
+			filter: { id: exactRegex(runtime) },
+			handler(code) {
+				return { code: code.replace("$port$", port.toString()) };
+			}
 		}
 	};
 }
@@ -60,41 +68,52 @@ function hmrRuntimePlugin(port) {
 //#endregion
 //#region src/wrapper.ts
 function reactRefreshWrapperPlugin() {
-	const template = readFileSync(resolve(import.meta.dirname, "./templates/hmr-wrapper.ts"), "utf-8");
+	const [prefix, suffix] = readFileSync(resolve(import.meta.dirname, "./templates/hmr-wrapper.ts"), "utf-8").split("$sourceCode$");
 	return {
 		name: "react-refresh-wrapper",
-		transform(code, id) {
-			if (!id.startsWith(process.cwd()) || !id.match(/\.[tj]sx?$/) || id.includes("node_modules") || id.startsWith("gi://*")) return null;
-			return {
-				code: template.replace("$sourceCode$", code).replaceAll("$hmrId$", JSON.stringify(id)),
-				map: null
-			};
+		transform: {
+			filter: {
+				id: {
+					include: [prefixRegex(process.cwd())],
+					exclude: [/node_modules/, /^gi:/]
+				},
+				moduleType: ["jsx", "tsx"]
+			},
+			async handler(code, id) {
+				const { code: transformed, map, errors } = await transform(id, code, {
+					jsx: {
+						refresh: true,
+						importSource: "@peachy/react"
+					},
+					sourcemap: true
+				});
+				for (const error of errors) this.error({
+					frame: error.codeframe ?? void 0,
+					message: error.message,
+					cause: error.helpMessage,
+					stack: ""
+				});
+				const hmrId = JSON.stringify(id);
+				const s = new MagicString(transformed);
+				s.prepend(prefix.replaceAll("$hmrId$", hmrId));
+				s.append(suffix.replaceAll("$hmrId$", hmrId));
+				const combinedMap = remapping([s.generateMap({
+					source: id,
+					hires: true
+				}), map], () => null);
+				return {
+					code: s.toString(),
+					map: combinedMap.toString()
+				};
+			}
 		}
 	};
 }
 
 //#endregion
 //#region src/index.ts
-function react(port) {
+function reactHMRPlugin(port) {
 	return [
-		babel({
-			plugins: [
-				BabelJSX,
-				[BabelTS, { isTSX: true }],
-				ReactFreshBabelPlugin
-			],
-			babelHelpers: "bundled",
-			ignore: [/node_modules/],
-			extensions: [
-				".js",
-				".jsx",
-				".es6",
-				".es",
-				".mjs",
-				".ts",
-				".tsx"
-			]
-		}),
 		createHmrEntrypointPlugin(),
 		reactRefreshWrapperPlugin(),
 		hmrRuntimePlugin(port)
@@ -102,4 +121,4 @@ function react(port) {
 }
 
 //#endregion
-export { react };
+export { reactHMRPlugin };

package/dist/templates/hmr-runtime.ts

@@ -43,9 +43,7 @@ if (!globalThis.__hmr__) {
 
       connection.connect("message", async (_, _type, event) => {
         const decoder = new TextDecoder();
-        const payload = JSON.parse(
-          decoder.decode(event.toArray()),
-        ) as HMRMessage;
+        const payload = JSON.parse(decoder.decode(event.toArray())) as HMRMessage;
 
         switch (payload?.type) {
           case "reload":
@@ -60,12 +58,9 @@ if (!globalThis.__hmr__) {
               for (const update of payload.updates) {
                 if (globalThis.__hmr__.contexts[update.id]) {
                   try {
-                    const module = await import(
-                      "file://" + update.url + "?t=" + Date.now()
-                    );
+                    const module = await import("file://" + update.url + "?t=" + Date.now());
 
-                    const accepted =
-                      globalThis.__hmr__.contexts[update.id].emit(module);
+                    const accepted = globalThis.__hmr__.contexts[update.id].emit(module);
 
                     if (accepted) {
                       console.info("[HMR] Update accepted by", update.id);

package/dist/templates/hmr-wrapper.ts

@@ -7,9 +7,7 @@ if (import.meta) {
 }
 
 var NO_FAST_REFRESH =
-  !globalThis.$RefreshReg$ ||
-  !globalThis.$RefreshSig$ ||
-  !globalThis.$RefreshRuntime$;
+  !globalThis.$RefreshReg$ || !globalThis.$RefreshSig$ || !globalThis.$RefreshRuntime$;
 if (NO_FAST_REFRESH) {
   console.warn(
     "[HMR]: React Refresh is not enabled. Please ensure that you have installed the necessary dependencies and enabled the plugin in your webpack configuration.",
@@ -21,10 +19,10 @@ if (NO_FAST_REFRESH) {
     const fullId = $hmrId$ + "#" + id;
     globalThis.$RefreshRuntime$.register(type, fullId);
   };
-  globalThis.$RefreshSig$ =
-    globalThis.$RefreshRuntime$.createSignatureFunctionForTransform;
+  globalThis.$RefreshSig$ = globalThis.$RefreshRuntime$.createSignatureFunctionForTransform;
 }
 
+/* oxlint-disable no-unused-expressions */
 $sourceCode$;
 
 if (!NO_FAST_REFRESH) {

package/package.json

@@ -1,29 +1,30 @@
 {
   "name": "@peachy/plugin-react",
-  "version": "0.0.9",
+  "version": "0.0.11",
   "description": "HMR for react",
-  "type": "module",
-  "main": "./dist/index.mjs",
   "keywords": [],
-  "author": "Angelo Verlain <hey@vixalien.com>",
   "license": "MIT",
-  "devDependencies": {
-    "rolldown": "1.0.0-beta.60",
-    "tsdown": "0.20.0-beta.4",
-    "typescript": "^5.9.3"
-  },
+  "author": "Angelo Verlain <hey@vixalien.com>",
+  "files": [
+    "dist"
+  ],
+  "type": "module",
+  "main": "./dist/index.mjs",
   "dependencies": {
-    "@babel/plugin-syntax-jsx": "^7.28.6",
-    "@babel/plugin-syntax-typescript": "^7.28.6",
-    "@rollup/plugin-babel": "^6.1.0",
+    "@ampproject/remapping": "^2.3.0",
+    "magic-string": "^0.30.21",
     "react-refresh": "^0.18.0"
   },
+  "devDependencies": {
+    "@types/node": "^25.2.2",
+    "rolldown": "1.0.0-rc.3",
+    "tsdown": "0.20.3",
+    "typescript": "^5.9.3",
+    "@peachy/internal-utilities": "0.0.0"
+  },
   "peerDependencies": {
     "rolldown": "1.0.0-beta.58"
   },
-  "files": [
-    "dist"
-  ],
   "scripts": {
     "build": "tsdown src/index.ts --dts && mkdir -p dist/templates && cp src/templates/* dist/templates"
   },