@thinksharpe/react-compiler-unmemo 0.5.4 → 0.5.6

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-74%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

@@ -24,6 +24,20 @@ import path from "path";
 
 // ─── Core Parsing Helpers ────────────────────────────────────────────────────
 
+/**
+ * Check if the character at idx is escaped by counting consecutive
+ * backslashes before it. Odd count means escaped, even means not.
+ */
+export function isEscaped(str, idx) {
+  let count = 0;
+  let pos = idx - 1;
+  while (pos >= 0 && str[pos] === "\\") {
+    count++;
+    pos--;
+  }
+  return count % 2 === 1;
+}
+
 /**
  * Find the matching closing paren for an opening paren at startIdx.
  * Counts nested parens/brackets/braces and respects strings and template literals.
@@ -37,10 +51,9 @@ export function findClosingParen(content, startIdx) {
 
   for (let i = startIdx; i < content.length; i++) {
     const ch = content[i];
-    const prev = i > 0 ? content[i - 1] : "";
 
     // Handle escape sequences
-    if ((inString || inTemplate) && ch === "\\" && prev !== "\\") {
+    if ((inString || inTemplate) && ch === "\\" && !isEscaped(content, i)) {
       i++; // skip next char
       continue;
     }
@@ -84,6 +97,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--;
@@ -108,7 +137,7 @@ export function stripDepsArray(inner) {
     const ch = inner[i];
 
     // Simple string tracking
-    if ((ch === '"' || ch === "'" || ch === "`") && (i === 0 || inner[i - 1] !== "\\")) {
+    if ((ch === '"' || ch === "'" || ch === "`") && !isEscaped(inner, i)) {
       if (!inString) {
         inString = true;
         stringChar = ch;
@@ -120,6 +149,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) {
@@ -146,7 +191,7 @@ export function unwrapArrowFn(inner) {
   for (let i = 0; i < inner.length - 1; i++) {
     const ch = inner[i];
 
-    if ((ch === '"' || ch === "'" || ch === "`") && (i === 0 || inner[i - 1] !== "\\")) {
+    if ((ch === '"' || ch === "'" || ch === "`") && !isEscaped(inner, i)) {
       if (!inString) {
         inString = true;
         stringChar = ch;
@@ -158,6 +203,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,42 +495,63 @@ export function processFile(filePath, { dryRun = false } = {}) {
     if (!found) break;
   }
 
-  // Phase 3: Clean up imports
-  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}`;
+  // Phase 3: Clean up imports (always run — hooks are unnecessary with React Compiler)
+  {
+    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");
   }
 
+  // Track if imports were cleaned even without hook call changes
+  if (content !== original) {
+    changed = true;
+  }
+
   if (changed && !dryRun) {
     fs.writeFileSync(filePath, content);
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thinksharpe/react-compiler-unmemo",
-  "version": "0.5.4",
+  "version": "0.5.6",
   "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") || args[0] === "version") {
+  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 (use 'version' subcommand with npx)");
   console.log();
   console.log("Examples:");
   console.log("  npx react-compiler-unmemo ./my-react-app                # preview (safe default)");