prepare monorepo

.vscode/settings.json

@@ -1,9 +1,19 @@
 {
   "editor.defaultFormatter": "biomejs.biome",
-  "[markdown]": {
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
-  "[html]": {
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  }
+	"editor.formatOnSave": true,
+	"[typescript]": {
+		"editor.defaultFormatter": "biomejs.biome"
+	},
+	"[javascript]": {
+		"editor.defaultFormatter": "biomejs.biome"
+	},
+		"[markdown]": {
+			"editor.defaultFormatter": "esbenp.prettier-vscode"
+		},
+		"[html]": {
+			"editor.defaultFormatter": "esbenp.prettier-vscode"
+	},
+	"editor.insertSpaces": false,
+	"editor.detectIndentation": false,
+	"editor.tabSize": 2
 }

biome.json

@@ -47,7 +47,7 @@
 	"javascript": {
 		"formatter": {
 			"quoteStyle": "single",
-			"indentStyle": "space",
+			"indentStyle": "tab",
 			"indentWidth": 2,
 			"lineWidth": 80,
 			"lineEnding": "lf"

kitchen-sink/src/index.jsx

@@ -6,11 +6,12 @@ const PROJECT = "mini-react-scan";
 
 export const root = ReactDOM.createRoot(document.getElementById("root"));
 const render = async () => {
-	const Component = (
-		await import(
-			process.env.NODE_ENV !== "production" ? `./${PROJECT}.jsx` : "./main.jsx"
-		)
-	).default;
+	let Component;
+	if (process.env.NODE_ENV === "production") {
+		Component = (await import(/* @vite-ignore */ `./main.jsx`)).default;
+	} else {
+		Component = (await import(/* @vite-ignore */ `./${PROJECT}.jsx`)).default;
+	}
 	root.render(<Component />);
 };
 

kitchen-sink/src/mini-react-scan.jsx

@@ -1,5 +1,5 @@
 import React, { useState, createContext } from "react";
-import * as BippyScan from "bippy/dist/scan/index";
+import * as BippyScan from "bippy/scan";
 
 // const visit = createFiberVisitor({
 // 	onRender(fiber) {

kitchen-sink/vite.config.mjs

@@ -17,14 +17,14 @@ export default defineConfig({
 		tailwindcss(),
 	],
 	define: {
-		__VERSION__: `"v${JSON.parse(fs.readFileSync("../package.json", "utf8")).version}"`,
+		__VERSION__: `"v${JSON.parse(fs.readFileSync('../package.json', 'utf8')).version}"`,
 	},
 	resolve:
-		process.env.NODE_ENV === "production"
+		process.env.NODE_ENV === 'production'
 			? {}
 			: {
 					alias: {
-						bippy: path.resolve(__dirname, ".."),
+						bippy: path.resolve(__dirname, '../packages/bippy/dist'),
 					},
 				},
 });

package.json

@@ -1,91 +1,17 @@
 {
-	"name": "bippy",
-	"version": "0.1.1",
-	"description": "hack into react internals",
-	"keywords": [
-		"react",
-		"react-instrumentation",
-		"react instrumentation",
-		"fiber",
-		"internals"
-	],
-	"homepage": "https://github.com/aidenybai/bippy#readme",
-	"bugs": {
-		"url": "https://github.com/aidenybai/bippy/issues"
-	},
-	"repository": {
-		"type": "git",
-		"url": "git+https://github.com/aidenybai/bippy.git"
-	},
-	"license": "MIT",
-	"author": {
-		"name": "Aiden Bai",
-		"email": "[email protected]"
-	},
-	"sideEffects": false,
+	"name": "root",
 	"type": "module",
-	"exports": {
-		"./package.json": "./package.json",
-		".": {
-			"import": {
-				"types": "./dist/index.d.ts",
-				"default": "./dist/index.js"
-			},
-			"require": {
-				"types": "./dist/index.d.cts",
-				"default": "./dist/index.cjs"
-			}
-		},
-		"./core": {
-			"import": {
-				"types": "./dist/core.d.ts",
-				"default": "./dist/core.js"
-			},
-			"require": {
-				"types": "./dist/core.d.cts",
-				"default": "./dist/core.cjs"
-			}
-		},
-		"./dist/*": "./dist/*.js",
-		"./dist/*.js": "./dist/*.js",
-		"./dist/*.cjs": "./dist/*.cjs",
-		"./dist/*.mjs": "./dist/*.mjs"
-	},
-	"main": "dist/index.js",
-	"module": "dist/index.js",
-	"types": "dist/index.d.ts",
-	"files": ["dist", "bin", "package.json", "README.md", "LICENSE"],
 	"scripts": {
-		"build": "NODE_ENV=production tsup",
-		"dev": "NODE_ENV=development tsup --watch",
-		"lint": "pnpm biome lint --write src/*.ts",
-		"format": "pnpm biome format --write src/*.ts",
-		"check": "pnpm biome check --write src/*.ts",
-		"publint": "publint",
-		"test": "vitest --dom",
-		"coverage": "vitest run --coverage --dom"
+		"clean": "rm -rf dist",
+		"build": "pnpm clean && pnpm -r build",
+		"dev": "pnpm clean && pnpm -r dev",
+		"lint": "pnpm biome lint --write packages/*/src/**/*.ts",
+		"format": "pnpm biome format --write packages/*/src/**/*.ts",
+		"check": "pnpm biome check --write packages/*/src/**/*.ts"
 	},
 	"devDependencies": {
-		"@biomejs/biome": "1.9.4",
-		"@testing-library/dom": "^10.4.0",
-		"@testing-library/react": "^16.1.0",
-		"@types/react": "^18.3.12",
-		"@types/react-dom": "^19.0.2",
-		"@types/react-reconciler": "^0.28.9",
-		"@vitest/coverage-istanbul": "2.1.8",
-		"@vitest/ui": "^2.1.8",
-		"esbuild": "^0.24.2",
-		"esbuild-plugin-inline-worker": "^0.1.1",
-		"happy-dom": "^15.11.7",
-		"prettier": "^3.3.3",
-		"publint": "^0.2.12",
-		"react": "19.0.0",
-		"react-dom": "19.0.0",
-		"react-reconciler": "^0.31.0",
-		"semver": "^7.6.3",
-		"terser": "^5.36.0",
-		"tsup": "^8.2.4",
-		"vitest": "^2.1.8"
+		"@types/node": "^22.10.5",
+		"prettier": "^3.3.3"
 	},
 	"publishConfig": {
 		"access": "public"

packages/bippy/package.json

@@ -0,0 +1,97 @@
+{
+	"name": "bippy",
+	"version": "0.1.1",
+	"description": "hack into react internals",
+	"keywords": [
+		"react",
+		"react-instrumentation",
+		"react instrumentation",
+		"fiber",
+		"internals"
+	],
+	"homepage": "https://github.com/aidenybai/bippy#readme",
+	"bugs": {
+		"url": "https://github.com/aidenybai/bippy/issues"
+	},
+	"repository": {
+		"type": "git",
+		"url": "git+https://github.com/aidenybai/bippy.git"
+	},
+	"license": "MIT",
+	"author": {
+		"name": "Aiden Bai",
+		"email": "[email protected]"
+	},
+	"sideEffects": false,
+	"type": "module",
+	"exports": {
+		"./package.json": "./package.json",
+		".": {
+			"import": {
+				"types": "./dist/index.d.ts",
+				"default": "./dist/index.js"
+			},
+			"require": {
+				"types": "./dist/index.d.cts",
+				"default": "./dist/index.cjs"
+			}
+		},
+		"./core": {
+			"import": {
+				"types": "./dist/core.d.ts",
+				"default": "./dist/core.js"
+			},
+			"require": {
+				"types": "./dist/core.d.cts",
+				"default": "./dist/core.cjs"
+			}
+		},
+		"./dist/*": "./dist/*.js",
+		"./dist/*.js": "./dist/*.js",
+		"./dist/*.cjs": "./dist/*.cjs",
+		"./dist/*.mjs": "./dist/*.mjs"
+	},
+	"main": "dist/index.js",
+	"module": "dist/index.js",
+	"types": "dist/index.d.ts",
+	"files": [
+		"dist",
+		"bin",
+		"package.json",
+		"README.md",
+		"LICENSE"
+	],
+	"scripts": {
+		"build": "tsup",
+		"dev": "tsup --watch",
+		"publint": "publint",
+		"test": "vitest --dom",
+		"coverage": "vitest run --coverage --dom"
+	},
+	"devDependencies": {
+		"@biomejs/biome": "1.9.4",
+		"@testing-library/dom": "^10.4.0",
+		"@testing-library/react": "^16.1.0",
+		"@types/node": "^22.10.5",
+		"@types/react": "^18.3.12",
+		"@types/react-dom": "^19.0.2",
+		"@types/react-reconciler": "^0.28.9",
+		"@vitest/coverage-istanbul": "2.1.8",
+		"@vitest/ui": "^2.1.8",
+		"esbuild": "^0.24.2",
+		"esbuild-plugin-inline-worker": "^0.1.1",
+		"happy-dom": "^15.11.7",
+		"prettier": "^3.3.3",
+		"publint": "^0.2.12",
+		"react": "19.0.0",
+		"react-dom": "19.0.0",
+		"react-reconciler": "^0.31.0",
+		"semver": "^7.6.3",
+		"terser": "^5.36.0",
+		"tsup": "^8.2.4",
+		"vitest": "^2.1.8"
+	},
+	"publishConfig": {
+		"access": "public"
+	}
+}

src/core.ts → packages/bippy/src/core.ts

@@ -6,15 +6,15 @@ import {
 	BIPPY_INSTRUMENTATION_STRING,
 	getRDTHook,
 	hasRDTHook,
-} from "./rdt-hook.js";
+} from "./rdt-hook";
 import type {
 	ContextDependency,
 	Effect,
 	Fiber,
 	FiberRoot,
 	MemoizedState,
 	ReactRenderer,
-} from "./types.js";
+} from "./types";
 
 // https://github.com/facebook/react/blob/main/packages/react-reconciler/src/ReactWorkTags.js
 export const FunctionComponentTag = 0;

src/index-dom.test.tsx → packages/bippy/src/index-dom.test.tsx

@@ -27,7 +27,7 @@ import {
 	traverseFiber,
 	traverseProps,
 	traverseState,
-} from "./index.js";
+} from "./index";
 import React, { isValidElement } from "react";
 import { render, screen } from "@testing-library/react";
 

packages/bippy/src/index.ts

@@ -0,0 +1,3 @@
+export * from "./rdt-hook";
+export * from "./core";
+export type * from "./types";

src/rdt-hook.ts → packages/bippy/src/rdt-hook.ts

@@ -1,4 +1,4 @@
-import type { ReactDevToolsGlobalHook, ReactRenderer } from "./types.js";
+import type { ReactDevToolsGlobalHook, ReactRenderer } from "./types";
 
 export const version = process.env.VERSION;
 export const BIPPY_INSTRUMENTATION_STRING = `bippy-${version}`;

packages/bippy/tsconfig.json

@@ -0,0 +1,8 @@
+{
+	"extends": "../../tsconfig.json",
+	"include": [
+		"src",
+		"vitest.config.ts",
+		"tsup.config.ts"
+	]
+}