@thinksharpe/react-compiler-unmemo 0.5.0 → 0.5.4

package/README.md

@@ -1,7 +1,9 @@
+
 # react-compiler-unmemo
 
 [![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)
 
 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.
 
@@ -74,12 +76,12 @@ cd ./my-app && npx tsc --noEmit
 | *(no flag)* | Preview changes without writing files | **dry-run** |
 | `--write` | Apply changes to files | off |
 | `--verbose` | Log every transformation | off |
-| `--files <glob>` | Limit to specific file patterns | `helpers/**/*.{tsx,ts}` |
+| `--files <glob>` | Limit to specific file patterns | `src/**/*.{tsx,ts}` |
 | `--skip-fix` | Skip type annotation repair step | off |
 
 ```bash
-# Only process specific directory
-node react-compiler-unmemo.mjs ./my-app --files "hooks/**/*.ts" --write
+# Only process hooks directory
+node react-compiler-unmemo.mjs ./my-app --files "src/hooks/**/*.ts" --write
 
 # app directory
 node react-compiler-unmemo.mjs ./my-app --files "app/**/*.{tsx,ts}"

package/helpers/remove-hooks.mjs

@@ -188,6 +188,73 @@ export function isInsideComment(content, idx) {
   return false;
 }
 
+/**
+ * Check if a position in the content is inside a string literal, template
+ * literal, or comment. Scans from the start of the content to correctly
+ * track nested context.
+ */
+export function isInsideStringOrComment(content, idx) {
+  let i = 0;
+  while (i < idx) {
+    const ch = content[i];
+
+    // Line comment — skip to end of line
+    if (ch === "/" && content[i + 1] === "/") {
+      const eol = content.indexOf("\n", i + 2);
+      if (eol === -1) return true; // idx is in this comment (rest of file)
+      if (idx < eol) return true;
+      i = eol + 1;
+      continue;
+    }
+
+    // Block comment — skip to closing */
+    if (ch === "/" && content[i + 1] === "*") {
+      const close = content.indexOf("*/", i + 2);
+      if (close === -1) return true; // unclosed block comment
+      if (idx < close + 2) return true;
+      i = close + 2;
+      continue;
+    }
+
+    // Template literal
+    if (ch === "`") {
+      i++;
+      let templateDepth = 0;
+      while (i < content.length) {
+        if (content[i] === "\\" ) {
+          if (idx === i || idx === i + 1) return true;
+          i += 2; continue;
+        }
+        if (content[i] === "`" && templateDepth === 0) { i++; break; }
+        if (content[i] === "$" && content[i + 1] === "{") { templateDepth++; i += 2; continue; }
+        if (content[i] === "}" && templateDepth > 0) { templateDepth--; i++; continue; }
+        if (i === idx) return true;
+        i++;
+      }
+      continue;
+    }
+
+    // String literals
+    if (ch === "'" || ch === '"') {
+      const quote = ch;
+      i++;
+      while (i < content.length) {
+        if (content[i] === "\\" ) {
+          if (idx === i || idx === i + 1) return true;
+          i += 2; continue;
+        }
+        if (content[i] === quote) { i++; break; }
+        if (i === idx) return true;
+        i++;
+      }
+      continue;
+    }
+
+    i++;
+  }
+  return false;
+}
+
 // ─── Main Processing ─────────────────────────────────────────────────────────
 
 export function processFile(filePath, { dryRun = false } = {}) {
@@ -218,7 +285,7 @@ export function processFile(filePath, { dryRun = false } = {}) {
         }
       }
 
-      if (isInsideComment(content, hookIdx)) {
+      if (isInsideStringOrComment(content, hookIdx)) {
         searchFrom = hookIdx + 1;
         continue;
       }
@@ -267,27 +334,31 @@ export function processFile(filePath, { dryRun = false } = {}) {
     let found = false;
 
     for (const pattern of patterns) {
-      const idx = content.indexOf(pattern);
-      if (idx === -1) continue;
-
-      // Skip if inside a comment
-      if (isInsideComment(content, idx)) {
-        // Replace the pattern temporarily to avoid infinite loop
-        // We'll restore comments at the end... actually just skip
-        // by searching for the next occurrence
-        const nextIdx = content.indexOf(pattern, idx + pattern.length);
-        if (nextIdx === -1) continue;
-      }
-
-      // Make sure this isn't part of a larger identifier (e.g. "myUseMemo(")
-      if (idx > 0 && !pattern.startsWith("React.")) {
-        const prevChar = content[idx - 1];
-        if (/[a-zA-Z0-9_$]/.test(prevChar)) {
+      // Search forward, skipping occurrences inside strings/comments
+      let searchFrom = 0;
+      let idx = -1;
+      while (true) {
+        const candidate = content.indexOf(pattern, searchFrom);
+        if (candidate === -1) break;
+
+        if (isInsideStringOrComment(content, candidate)) {
+          searchFrom = candidate + pattern.length;
           continue;
         }
-      }
 
-      if (isInsideComment(content, idx)) continue;
+        // Make sure this isn't part of a larger identifier (e.g. "myUseMemo(")
+        if (candidate > 0 && !pattern.startsWith("React.")) {
+          const prevChar = content[candidate - 1];
+          if (/[a-zA-Z0-9_$]/.test(prevChar)) {
+            searchFrom = candidate + pattern.length;
+            continue;
+          }
+        }
+
+        idx = candidate;
+        break;
+      }
+      if (idx === -1) continue;
 
       const openParenIdx = idx + pattern.length - 1;
       const closeParenIdx = findClosingParen(content, openParenIdx);
@@ -365,31 +436,33 @@ export function processFile(filePath, { dryRun = false } = {}) {
 
   // Phase 3: Clean up imports
   if (changed) {
-    // Handle: import React, { useMemo, useCallback, ... } from "react";
+    // Handle: import React, { useMemo, useCallback, ... } from "react"; (single or double quotes, semicolon optional)
     content = content.replace(
-      /import React, \{([^}]*)\} from "react";/g,
-      (match, imports) => {
+      /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 "react";';
-        return `import React, { ${cleaned} } from "react";`;
+        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";
+    // Handle: import { useMemo, useCallback, ... } from "react"; (single or double quotes, semicolon optional)
     content = content.replace(
-      /import \{([^}]*)\} from "react";/g,
-      (match, imports) => {
+      /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 "react";`;
+        return `import { ${cleaned} } from ${quote}react${quote}${semi}`;
       },
     );
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thinksharpe/react-compiler-unmemo",
-  "version": "0.5.0",
+  "version": "0.5.4",
   "description": "Remove useMemo and useCallback hooks from React codebases to leverage React Compiler automatic optimization",
   "license": "MIT",
   "type": "module",
@@ -39,7 +39,8 @@
     "LICENSE"
   ],
   "scripts": {
-    "start": "node react-compiler-unmemo.mjs"
+    "start": "node react-compiler-unmemo.mjs",
+    "test": "node --test tests/**/*.test.mjs"
   },
   "engines": {
     "node": ">=18"

package/react-compiler-unmemo.mjs

@@ -13,7 +13,7 @@
  * Options:
  *   --write         Apply changes to files (default is dry-run / preview)
  *   --verbose       Show detailed output for each transformation
- *   --files <glob>  File glob pattern (default: helpers/**\/*.{tsx,ts})
+ *   --files <glob>  File glob pattern (default: src/**\/*.{tsx,ts})
  *   --skip-fix      Skip the type annotation fix step
  *
  * Examples: