@ahmednawaz/crank 0.2.6 → 0.2.7

package/bin/crank.js

@@ -710,12 +710,9 @@ async function main() {
     });
   }
 
-  // One-shot parity: setup/default always try inject on React apps (idempotent).
-  if (
-    (command === 'init' || command === 'run') &&
-    detectEnv.hasReact &&
-    flags.mcp !== false
-  ) {
+  // One-shot: always try <Crank /> inject (idempotent). Do not gate on hasReact —
+  // root package.json often omits react in monorepos / Replit layouts.
+  if ((command === 'init' || command === 'run') && flags.mcp !== false) {
     const injectResult = injectCrank(projectRoot, { install: true });
     initResult = initResult || { wrote: [], projectRoot };
     initResult.inject = injectResult;

package/lib/detect.js

@@ -123,6 +123,91 @@ function packageHasDep(pkg, name) {
   );
 }
 
+const REACT_DEP_NAMES = [
+  'react',
+  'react-dom',
+  '@vitejs/plugin-react',
+  '@vitejs/plugin-react-swc',
+  'next'
+];
+
+const REACT_ENTRY_HINTS = [
+  'src/main.tsx',
+  'src/main.jsx',
+  'src/index.tsx',
+  'src/index.jsx',
+  'client/src/main.tsx',
+  'app/main.tsx',
+  'main.tsx',
+  'main.jsx',
+  'index.tsx',
+  'index.jsx'
+];
+
+function packageLooksLikeReact(pkg) {
+  return REACT_DEP_NAMES.some((name) => packageHasDep(pkg, name));
+}
+
+function dirHasNextConfig(dir) {
+  return (
+    exists(path.join(dir, 'next.config.js')) ||
+    exists(path.join(dir, 'next.config.mjs')) ||
+    exists(path.join(dir, 'next.config.ts'))
+  );
+}
+
+function dirHasReactEntryHint(dir) {
+  return REACT_ENTRY_HINTS.some((rel) => exists(path.join(dir, rel)));
+}
+
+/**
+ * True when this directory (or a common app child) looks like a React app.
+ * Root package.json often omits react in monorepos / Replit multi-package layouts.
+ */
+function detectHasReact(projectRoot, packageJson, viteConfig) {
+  if (packageLooksLikeReact(packageJson) || dirHasNextConfig(projectRoot)) {
+    return true;
+  }
+  if (dirHasReactEntryHint(projectRoot)) {
+    return true;
+  }
+
+  const dirs = new Set([projectRoot]);
+  for (const sub of APP_DIR_CANDIDATES) {
+    if (sub === '.') continue;
+    dirs.add(path.join(projectRoot, sub));
+  }
+  if (viteConfig) {
+    dirs.add(path.dirname(viteConfig));
+  }
+
+  for (const dir of dirs) {
+    if (!exists(dir) || dir === projectRoot) continue;
+    const pkg = readJson(path.join(dir, 'package.json'), null);
+    if (packageLooksLikeReact(pkg) || dirHasNextConfig(dir) || dirHasReactEntryHint(dir)) {
+      return true;
+    }
+  }
+
+  // Vite + JSX plugin import in config is a strong React signal
+  if (viteConfig && exists(viteConfig)) {
+    try {
+      const src = fs.readFileSync(viteConfig, 'utf8');
+      if (
+        /@vitejs\/plugin-react/.test(src) ||
+        /\bplugin-react\b/.test(src) ||
+        /from ['"]react['"]/.test(src)
+      ) {
+        return true;
+      }
+    } catch {
+      // ignore
+    }
+  }
+
+  return false;
+}
+
 function detectEnvironment(projectRoot) {
   const env = process.env;
   const isReplit = Boolean(
@@ -134,16 +219,13 @@ function detectEnvironment(projectRoot) {
     : null;
   const viteConfig = findViteConfig(projectRoot);
   const hasVite = Boolean(viteConfig) || packageHasDep(packageJson, 'vite');
-  const hasReact =
-    packageHasDep(packageJson, 'react') ||
-    exists(path.join(projectRoot, 'next.config.js')) ||
-    exists(path.join(projectRoot, 'next.config.mjs')) ||
-    exists(path.join(projectRoot, 'next.config.ts'));
+  const hasReact = detectHasReact(projectRoot, packageJson, viteConfig);
   const hasNext =
     packageHasDep(packageJson, 'next') ||
-    exists(path.join(projectRoot, 'next.config.js')) ||
-    exists(path.join(projectRoot, 'next.config.mjs')) ||
-    exists(path.join(projectRoot, 'next.config.ts'));
+    dirHasNextConfig(projectRoot) ||
+    [...APP_DIR_CANDIDATES]
+      .filter((s) => s !== '.')
+      .some((sub) => dirHasNextConfig(path.join(projectRoot, sub)));
   const hasWebpack =
     packageHasDep(packageJson, 'webpack') ||
     exists(path.join(projectRoot, 'webpack.config.js')) ||
@@ -182,6 +264,8 @@ module.exports = {
   readJson,
   writeJson,
   detectEnvironment,
+  detectHasReact,
+  packageLooksLikeReact,
   findViteConfig,
   VITE_CONFIG_NAMES,
   APP_DIR_CANDIDATES

package/lib/init.js

@@ -12,7 +12,7 @@ const {
 
 const PACKAGE_ROOT = path.resolve(__dirname, '..');
 const { resolveUrls } = require('./urls');
-const { installCrankPackage } = require('./wire-react');
+const { installCrankPackage, findEntry } = require('./wire-react');
 
 function ensureGitignore(projectRoot) {
   const file = path.join(projectRoot, '.gitignore');
@@ -623,7 +623,9 @@ function initProject(projectRoot, options = {}) {
   // React apps: <Crank /> only — do not inject the Vite plugin (avoids duplicating
   // node: imports when vite.config already has Vizpatch-style loaders).
   // Still repair duplicate imports left by older Crank versions.
-  if (env.hasReact && options.react !== false) {
+  // Treat findEntry hits as React even when root package.json omits the dep.
+  const looksLikeReact = env.hasReact || Boolean(findEntry(projectRoot));
+  if (looksLikeReact && options.react !== false) {
     writeReactMountHint(projectRoot, env, results);
     results.reactMount = true;
     if (env.hasVite) {

package/lib/resolve-project.js

@@ -3,7 +3,7 @@
 const fs = require('fs');
 const path = require('path');
 const { execSync } = require('child_process');
-const { exists, readJson } = require('./detect');
+const { exists, readJson, findViteConfig, packageLooksLikeReact } = require('./detect');
 
 const APP_DIR_CANDIDATES = [
   '.',
@@ -37,6 +37,59 @@ function hasFrameworkMarker(dir) {
   return FRAMEWORK_FILES.some((name) => exists(path.join(dir, name)));
 }
 
+function dirPackageLooksLikeReact(dir) {
+  return packageLooksLikeReact(readJson(path.join(dir, 'package.json'), null));
+}
+
+/**
+ * Prefer the real app package (Vite/React) over a bare repo-root package.json.
+ */
+function findAppDirectory(repoRoot) {
+  const root = path.resolve(repoRoot);
+
+  // 1. Known app subdirs with a framework config (before root — monorepos)
+  for (const rel of APP_DIR_CANDIDATES) {
+    if (rel === '.') continue;
+    const candidate = path.join(root, rel);
+    if (exists(candidate) && hasFrameworkMarker(candidate)) {
+      return { appRoot: candidate, reason: `framework in ${rel}/` };
+    }
+  }
+
+  // 2. Vite config found via shallow search (e.g. artifacts/<app>/ on Replit)
+  const viteConfig = findViteConfig(root);
+  if (viteConfig) {
+    const viteDir = path.dirname(viteConfig);
+    if (viteDir !== root) {
+      // Prefer the vite package dir when it looks like React, or root does not.
+      if (dirPackageLooksLikeReact(viteDir) || !dirPackageLooksLikeReact(root)) {
+        return {
+          appRoot: viteDir,
+          reason: `vite.config in ${path.relative(root, viteDir) || '.'}`
+        };
+      }
+    }
+  }
+
+  // 3. Root has framework
+  if (hasFrameworkMarker(root)) {
+    return { appRoot: root, reason: 'framework at repo root' };
+  }
+
+  // 4. Subdir / root package.json
+  for (const rel of APP_DIR_CANDIDATES) {
+    const candidate = path.join(root, rel === '.' ? '' : rel);
+    if (exists(candidate) && exists(path.join(candidate, 'package.json'))) {
+      return {
+        appRoot: candidate,
+        reason: `package.json in ${rel === '.' ? 'root' : rel + '/'}`
+      };
+    }
+  }
+
+  return { appRoot: root, reason: 'repo root (fallback)' };
+}
+
 function readCrankConfig(startDir) {
   let dir = path.resolve(startDir);
   for (let i = 0; i < 12; i++) {
@@ -95,33 +148,6 @@ function findPackageRoot(startDir) {
   return path.resolve(startDir);
 }
 
-/**
- * Retune-style: find the app directory inside a repo (app/, client/, web/, …).
- */
-function findAppDirectory(repoRoot) {
-  const root = path.resolve(repoRoot);
-  if (hasFrameworkMarker(root)) {
-    return { appRoot: root, reason: 'framework at repo root' };
-  }
-
-  for (const rel of APP_DIR_CANDIDATES) {
-    if (rel === '.') continue;
-    const candidate = path.join(root, rel);
-    if (exists(candidate) && hasFrameworkMarker(candidate)) {
-      return { appRoot: candidate, reason: `framework in ${rel}/` };
-    }
-  }
-
-  for (const rel of APP_DIR_CANDIDATES) {
-    const candidate = path.join(root, rel === '.' ? '' : rel);
-    if (exists(candidate) && exists(path.join(candidate, 'package.json'))) {
-      return { appRoot: candidate, reason: `package.json in ${rel === '.' ? 'root' : rel + '/'}` };
-    }
-  }
-
-  return { appRoot: root, reason: 'repo root (fallback)' };
-}
-
 /**
  * Resolve where the user's app code lives — no manual path required.
  * Priority: CRANK_PROJECT_ROOT → .crank/config → git root + app dir → package.json walk → cwd.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ahmednawaz/crank",
-  "version": "0.2.6",
+  "version": "0.2.7",
   "description": "Internal Motive UX copy iteration: select UI text \u2192 Glean variants \u2192 MCP apply. Cursor, Replit, Claude.",
   "repository": {
     "type": "git",
@@ -67,7 +67,8 @@
     "prepare:publish": "node scripts/prepare-publish.js",
     "verify:deps": "node scripts/verify-deps.js",
     "publish:team": "node scripts/prepare-publish.js && node scripts/verify-deps.js && npm publish --access public",
-    "test:patch-vite": "node scripts/test-patch-vite.js"
+    "test:patch-vite": "node scripts/test-patch-vite.js",
+    "test:react-detect": "node scripts/test-react-detect.js"
   },
   "engines": {
     "node": ">=18"