feat(scan): implement new whats-changed, offscreen outline impl, bug …

…fixes, ux improvements"

biome.json

@@ -23,7 +23,7 @@
     "enabled": true
   },
   "linter": {
-    "enabled": true,
+    "enabled": false,
     "rules": {
       "recommended": true,
       "correctness": {
@@ -49,8 +49,7 @@
         }
       },
       "suspicious": {
-        "noExplicitAny": "error",
-        "noConsole": "error"
+        "noExplicitAny": "error"
       },
       "security": {
         "noDangerouslySetInnerHtml": "error"

packages/extension/src/assets/css/no-react.css

@@ -49,7 +49,7 @@ html.freeze #react-scan-toast {
 }
 
 #react-scan-toast .icon {
-  font-size: 16px;
+  font-size: .75rem;
 }
 
 @media (max-width: 320px) {

packages/kitchen-sink/src/index.jsx

@@ -4,13 +4,13 @@ import { scan } from 'react-scan'; // force production build
 
 import './styles.css';
 
-scan({
-  enabled: true,
-  dangerouslyForceRunInProduction: true,
-  // monitor: {
-  //   url: 'https://localhost:3000/api/scan',
-  // },
-});
+// scan({
+//   enabled: true,
+//   dangerouslyForceRunInProduction: true,
+//   // monitor: {
+//   //   url: 'https://localhost:3000/api/scan',
+//   // },
+// });
 
 const TooltipContext = createContext({ tooltip: '' });
 

packages/scan/package.json

@@ -1,8 +1,14 @@
 {
   "name": "react-scan",
-  "version": "0.0.54",
+  "version": "0.0.60",
   "description": "Scan your React app for renders",
-  "keywords": ["react", "react-scan", "react scan", "render", "performance"],
+  "keywords": [
+    "react",
+    "react-scan",
+    "react scan",
+    "render",
+    "performance"
+  ],
   "homepage": "https://react-scan.million.dev",
   "bugs": {
     "url": "https://github.com/aidenybai/react-scan/issues"
@@ -161,17 +167,27 @@
   "types": "dist/index.d.ts",
   "typesVersions": {
     "*": {
-      "monitoring": ["./dist/core/monitor/index.d.ts"],
-      "monitoring/next": ["./dist/core/monitor/params/next.d.ts"],
+      "monitoring": [
+        "./dist/core/monitor/index.d.ts"
+      ],
+      "monitoring/next": [
+        "./dist/core/monitor/params/next.d.ts"
+      ],
       "monitoring/react-router-legacy": [
         "./dist/core/monitor/params/react-router-v5.d.ts"
       ],
       "monitoring/react-router": [
         "./dist/core/monitor/params/react-router-v6.d.ts"
       ],
-      "monitoring/remix": ["./dist/core/monitor/params/remix.d.ts"],
-      "monitoring/astro": ["./dist/core/monitor/params/astro/index.ts"],
-      "react-component-name/vite": ["./dist/react-component-name/vite.d.ts"],
+      "monitoring/remix": [
+        "./dist/core/monitor/params/remix.d.ts"
+      ],
+      "monitoring/astro": [
+        "./dist/core/monitor/params/astro/index.ts"
+      ],
+      "react-component-name/vite": [
+        "./dist/react-component-name/vite.d.ts"
+      ],
       "react-component-name/webpack": [
         "./dist/react-component-name/webpack.d.ts"
       ],
@@ -187,15 +203,24 @@
       "react-component-name/rollup": [
         "./dist/react-component-name/rollup.d.ts"
       ],
-      "react-component-name/astro": ["./dist/react-component-name/astro.d.ts"]
+      "react-component-name/astro": [
+        "./dist/react-component-name/astro.d.ts"
+      ]
     }
   },
   "bin": "bin/cli.js",
-  "files": ["dist", "bin", "package.json", "README.md", "LICENSE", "auto.d.ts"],
+  "files": [
+    "dist",
+    "bin",
+    "package.json",
+    "README.md",
+    "LICENSE",
+    "auto.d.ts"
+  ],
   "scripts": {
     "build": "npm run build:css && NODE_ENV=production tsup",
     "postbuild": "pnpm copy-astro && node ../../scripts/version-warning.mjs",
-    "build:copy": "NODE_ENV=production tsup && cat dist/auto.global.js | pbcopy",
+    "build:copy": "npm run build:css && NODE_ENV=production tsup && cat dist/auto.global.js | pbcopy",
     "copy-astro": "cp -R src/core/monitor/params/astro dist/core/monitor/params",
     "dev:css": "npx tailwindcss -i ./src/web/assets/css/styles.tailwind.css -o ./src/web/assets/css/styles.css --watch",
     "dev:tsup": "NODE_ENV=development tsup --watch",

packages/scan/src/auto.ts

@@ -4,7 +4,7 @@ import { init } from './install-hook'; // Initialize RDT hook
 init();
 
 if (typeof window !== 'undefined') {
-  scan({ dangerouslyForceRunInProduction: true });
+  scan({ dangerouslyForceRunInProduction: true, showToolbar: true });
   window.reactScan = scan;
 }