@thinksharpe/react-compiler-unmemo 0.5.4 → 0.5.5

package/README.md

@@ -3,7 +3,7 @@
 
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg?style=flat-square)](https://opensource.org/licenses/MIT)
 [![Node.js](https://img.shields.io/badge/node-%3E%3D18-brightgreen?style=flat-square)](https://nodejs.org)
-[![Tests](https://img.shields.io/badge/tests-62%20passing-brightgreen?style=flat-square)](./tests)
+[![Tests](https://img.shields.io/badge/tests-69%20passing-brightgreen?style=flat-square)](./tests)
 
 A codemod that removes `useMemo` and `useCallback` from your React codebase so you can adopt [React Compiler](https://react.dev/learn/react-compiler) without the manual cleanup.
 

package/helpers/remove-hooks.mjs

@@ -84,6 +84,22 @@ export function findClosingParen(content, startIdx) {
 
     if (inString || inTemplate) continue;
 
+    // Skip line comments
+    if (ch === "/" && content[i + 1] === "/") {
+      const eol = content.indexOf("\n", i + 2);
+      if (eol === -1) return -1;
+      i = eol;
+      continue;
+    }
+
+    // Skip block comments
+    if (ch === "/" && content[i + 1] === "*") {
+      const close = content.indexOf("*/", i + 2);
+      if (close === -1) return -1;
+      i = close + 1;
+      continue;
+    }
+
     if (ch === "(") depth++;
     if (ch === ")") {
       depth--;
@@ -120,6 +136,22 @@ export function stripDepsArray(inner) {
     }
     if (inString) continue;
 
+    // Skip line comments
+    if (ch === "/" && inner[i + 1] === "/") {
+      const eol = inner.indexOf("\n", i + 2);
+      if (eol === -1) break;
+      i = eol;
+      continue;
+    }
+
+    // Skip block comments
+    if (ch === "/" && inner[i + 1] === "*") {
+      const close = inner.indexOf("*/", i + 2);
+      if (close === -1) break;
+      i = close + 1;
+      continue;
+    }
+
     if (ch === "(" || ch === "[" || ch === "{") depth++;
     if (ch === ")" || ch === "]" || ch === "}") depth--;
     if (ch === "," && depth === 0) {
@@ -158,6 +190,22 @@ export function unwrapArrowFn(inner) {
     }
     if (inString) continue;
 
+    // Skip line comments
+    if (ch === "/" && inner[i + 1] === "/") {
+      const eol = inner.indexOf("\n", i + 2);
+      if (eol === -1) break;
+      i = eol;
+      continue;
+    }
+
+    // Skip block comments
+    if (ch === "/" && inner[i + 1] === "*") {
+      const close = inner.indexOf("*/", i + 2);
+      if (close === -1) break;
+      i = close + 1;
+      continue;
+    }
+
     if (ch === "(" || ch === "[" || ch === "{") depth++;
     if (ch === ")" || ch === "]" || ch === "}") depth--;
     if (ch === "=" && inner[i + 1] === ">" && depth === 0) {
@@ -434,37 +482,53 @@ export function processFile(filePath, { dryRun = false } = {}) {
     if (!found) break;
   }
 
-  // Phase 3: Clean up imports
+  // Phase 3: Clean up imports (skip matches inside strings/comments)
   if (changed) {
-    // Handle: import React, { useMemo, useCallback, ... } from "react"; (single or double quotes, semicolon optional)
-    content = content.replace(
-      /import React, \{([^}]*)\} from (["'])react\2[^\S\n]*;?/g,
-      (match, imports, quote) => {
-        const semi = match.trimEnd().endsWith(";") ? ";" : "";
-        const cleaned = imports
-          .split(",")
-          .map((s) => s.trim())
-          .filter((s) => s && s !== "useMemo" && s !== "useCallback")
-          .join(", ");
-        if (!cleaned) return `import React from ${quote}react${quote}${semi}`;
-        return `import React, { ${cleaned} } from ${quote}react${quote}${semi}`;
+    const importPatterns = [
+      {
+        regex: /import React, \{([^}]*)\} from (["'])react\2[^\S\n]*;?/g,
+        replace: (match, imports, quote) => {
+          const semi = match.trimEnd().endsWith(";") ? ";" : "";
+          const cleaned = imports
+            .split(",")
+            .map((s) => s.trim())
+            .filter((s) => s && s !== "useMemo" && s !== "useCallback")
+            .join(", ");
+          if (!cleaned) return `import React from ${quote}react${quote}${semi}`;
+          return `import React, { ${cleaned} } from ${quote}react${quote}${semi}`;
+        },
       },
-    );
-
-    // Handle: import { useMemo, useCallback, ... } from "react"; (single or double quotes, semicolon optional)
-    content = content.replace(
-      /import \{([^}]*)\} from (["'])react\2[^\S\n]*;?/g,
-      (match, imports, quote) => {
-        const semi = match.trimEnd().endsWith(";") ? ";" : "";
-        const cleaned = imports
-          .split(",")
-          .map((s) => s.trim())
-          .filter((s) => s && s !== "useMemo" && s !== "useCallback")
-          .join(", ");
-        if (!cleaned) return ""; // Remove empty import entirely
-        return `import { ${cleaned} } from ${quote}react${quote}${semi}`;
+      {
+        regex: /import \{([^}]*)\} from (["'])react\2[^\S\n]*;?/g,
+        replace: (match, imports, quote) => {
+          const semi = match.trimEnd().endsWith(";") ? ";" : "";
+          const cleaned = imports
+            .split(",")
+            .map((s) => s.trim())
+            .filter((s) => s && s !== "useMemo" && s !== "useCallback")
+            .join(", ");
+          if (!cleaned) return ""; // Remove empty import entirely
+          return `import { ${cleaned} } from ${quote}react${quote}${semi}`;
+        },
       },
-    );
+    ];
+
+    for (const { regex, replace } of importPatterns) {
+      let result = "";
+      let lastIndex = 0;
+      let m;
+      regex.lastIndex = 0;
+      while ((m = regex.exec(content)) !== null) {
+        if (isInsideStringOrComment(content, m.index)) {
+          continue;
+        }
+        result += content.slice(lastIndex, m.index);
+        result += replace(m[0], m[1], m[2]);
+        lastIndex = m.index + m[0].length;
+      }
+      result += content.slice(lastIndex);
+      content = result;
+    }
 
     // Clean up any resulting blank lines from removed imports
     content = content.replace(/\n\n\n+/g, "\n\n");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thinksharpe/react-compiler-unmemo",
-  "version": "0.5.4",
+  "version": "0.5.5",
   "description": "Remove useMemo and useCallback hooks from React codebases to leverage React Compiler automatic optimization",
   "license": "MIT",
   "type": "module",

package/react-compiler-unmemo.mjs

@@ -23,13 +23,24 @@
  *   npx react-compiler-unmemo /absolute/path/to/project --files "app/**\/*.tsx"
  */
 
+import fs from "fs";
 import path from "path";
+import { fileURLToPath } from "url";
+
 import { run as fixTypes } from "./helpers/fix-type-annotations.mjs";
 import { run as removeHooks } from "./helpers/remove-hooks.mjs";
 
 // ─── CLI ─────────────────────────────────────────────────────────────────────
 
 const args = process.argv.slice(2);
+
+if (args.includes("--version") || args.includes("-v")) {
+  const __dirname = path.dirname(fileURLToPath(import.meta.url));
+  const pkg = JSON.parse(fs.readFileSync(path.join(__dirname, "package.json"), "utf8"));
+  console.log(pkg.version);
+  process.exit(0);
+}
+
 const write = args.includes("--write");
 const dryRun = !write;
 const verbose = args.includes("--verbose");
@@ -52,6 +63,7 @@ if (!targetDir) {
   console.log("  --verbose       Show detailed output per transformation");
   console.log("  --files <glob>  File glob pattern (default: src/**/*.{tsx,ts})");
   console.log("  --skip-fix      Skip the type annotation fix step");
+  console.log("  --version, -v   Show version number");
   console.log();
   console.log("Examples:");
   console.log("  npx react-compiler-unmemo ./my-react-app                # preview (safe default)");