@tscircuit/cli 0.0.82 → 0.0.84

package/lib/cmd-fns/dev/derive-selector-from-pcb-component-id.ts

@@ -0,0 +1,23 @@
+import type { AnySoupElement } from "@tscircuit/builder"
+import { su } from "@tscircuit/soup-util"
+
+export const deriveSelectorFromPcbComponentId = ({
+  soup,
+  pcb_component_id,
+}: {
+  soup: AnySoupElement[]
+  pcb_component_id: string
+}) => {
+  const source_component = su(soup).source_component.getUsing({
+    pcb_component_id,
+  })
+  if (!source_component) {
+    throw new Error(
+      `Could not find source component for pcb_component_id="${pcb_component_id}"`
+    )
+  }
+
+  // TODO travel up the tree to make the selector more specific
+
+  return `.${source_component.name}`
+}

package/lib/cmd-fns/dev/index.ts

@@ -14,6 +14,7 @@ import { checkIfInitialized } from "./check-if-initialized"
 import { initCmd } from "../init"
 import { startExportRequestWatcher } from "./start-export-request-watcher"
 import $ from "dax-sh"
+import { startEditEventWatcher } from "./start-edit-event-watcher"
 
 export const devCmd = async (ctx: AppContext, args: any) => {
   const params = z
@@ -75,9 +76,10 @@ export const devCmd = async (ctx: AppContext, args: any) => {
   console.log(`Loading examples...`)
   await uploadExamplesFromDirectory({ devServerAxios, cwd }, ctx)
 
-  // Start watcher
+  // Start watchers
   const fs_watcher = await startFsWatcher({ cwd, devServerAxios }, ctx)
   const er_watcher = await startExportRequestWatcher({ devServerAxios }, ctx)
+  const ee_watcher = await startEditEventWatcher({ devServerAxios }, ctx)
 
   while (true) {
     const { action } = await prompts({
@@ -108,6 +110,7 @@ export const devCmd = async (ctx: AppContext, args: any) => {
       if (server.close) server.close()
       fs_watcher.stop()
       er_watcher.stop()
+      ee_watcher.stop()
       break
     }
   }

package/lib/cmd-fns/dev/start-edit-event-watcher.ts

@@ -0,0 +1,219 @@
+import { DevPackageExample } from "@server/db/get-db"
+import { AxiosInstance } from "axios"
+import kleur from "kleur"
+import { AppContext } from "lib/util/app-context"
+import fg from "fast-glob"
+import fs from "fs"
+import { Project, ts } from "ts-morph"
+import * as Path from "path"
+import { ManualPcbPosition } from "@tscircuit/builder"
+import { deriveSelectorFromPcbComponentId } from "./derive-selector-from-pcb-component-id"
+
+// TODO import from builder when builder exports it
+type EditEvent = {
+  edit_event_id: string
+  pcb_edit_event_type: "edit_component_location"
+  pcb_component_id: string
+  original_center: { x: number; y: number }
+  new_center: { x: number; y: number }
+}
+
+export const startEditEventWatcher = async (
+  {
+    devServerAxios,
+  }: {
+    devServerAxios: AxiosInstance
+  },
+  ctx: AppContext
+) => {
+  let running = true
+
+  ;(async () => {
+    let last_edit_event_update_time: Record<string, string> = {}
+
+    while (running) {
+      try {
+        const dev_package_examples: DevPackageExample[] = await devServerAxios
+          .post("/api/dev_package_examples/list", {})
+          .then((r) => r.data.dev_package_examples)
+
+        for (const dev_package_example of dev_package_examples) {
+          const dev_package_example_id: number =
+            dev_package_example.dev_package_example_id as any
+
+          const last_recorded_update_time =
+            last_edit_event_update_time[dev_package_example_id]
+
+          // TODO use last_edit_event_updated_at
+          if (
+            last_recorded_update_time !== dev_package_example.last_updated_at
+          ) {
+            console.log(
+              kleur.gray(
+                `Edit event detected for dev_package_example ${dev_package_example.dev_package_example_id}`
+              )
+            )
+            console.log(
+              kleur.gray(`  file_path: ${dev_package_example.file_path}`)
+            )
+
+            last_edit_event_update_time[dev_package_example_id] =
+              dev_package_example.last_updated_at // TODO last_edit_event_updated_at
+
+            console.log(kleur.gray(`  getting new edit events...`))
+
+            const dev_package_example_full = await devServerAxios
+              .post("/api/dev_package_examples/get", {
+                dev_package_example_id,
+              })
+              .then((r) => r.data.dev_package_example)
+
+            // 1. Find the *.manual-edits.ts, if there are multiple error
+            const manual_edit_files = fg.sync(
+              ["**/*.manual-edits.ts", "**/manual-edits.ts"],
+              {
+                cwd: ctx.cwd,
+              }
+            )
+
+            if (manual_edit_files.length === 0) {
+              console.log(
+                kleur.red(
+                  `No manual edit files found in "${ctx.cwd}", please create a file "manual-edits.ts" or "*.manual-edits.ts" to persist manual edits`
+                )
+              )
+              continue
+            }
+
+            if (manual_edit_files.length > 1) {
+              console.log(
+                kleur.red(
+                  `Multiple manual edit files found, tsci currently doesn't know how to handle this, you should go upvote an issue`
+                )
+              )
+              continue
+            }
+
+            const manual_edit_file = manual_edit_files[0]
+            const manual_edit_file_content = fs.readFileSync(
+              Path.join(ctx.cwd, manual_edit_file),
+              "utf-8"
+            )
+
+            console.log(
+              kleur.gray(`  found manual edit file: ${manual_edit_file}`)
+            )
+
+            // 2. Convert the edit events into ManualPcbPosition[] and append,
+            //    removing any old placements/positions for the same selector.
+            //    We can completely rewrite the file here for now (we'll need
+            //    to preserve comments etc. later)
+
+            const edit_events: EditEvent[] =
+              dev_package_example_full.completed_edit_events ?? []
+
+            if (edit_events.length === 0) continue
+
+            const project = new Project()
+
+            const ts_manual_edits_file = project.createSourceFile(
+              "manual-edits.ts",
+              manual_edit_file_content
+            )
+
+            // Access the default export declaration
+            const default_export_dec = ts_manual_edits_file
+              .getDefaultExportSymbol()!
+              .getDeclarations()[0]
+
+            // Get the object literal expression from the export default statement
+            const object_literal =
+              default_export_dec.getFirstChildByKindOrThrow(
+                ts.SyntaxKind.ObjectLiteralExpression
+              )
+
+            // Get the `pcb_placements` property
+            const pcb_placements_ts =
+              object_literal.getPropertyOrThrow("pcb_placements")
+
+            let pcb_placements: (ManualPcbPosition & {
+              _edit_event_id?: string
+            })[]
+            try {
+              pcb_placements = JSON.parse(
+                pcb_placements_ts.getText().replace(/pcb_placements:\s/, "")
+              )
+            } catch (e: any) {
+              console.log(
+                kleur.red(
+                  `Error parsing pcb_placements from manual edits file: ${pcb_placements_ts.getText()} ${e.toString()}`
+                )
+              )
+              continue
+            }
+
+            const handled_edit_events = new Set<string>(
+              pcb_placements
+                .map((p) => (p as any)._edit_event_id)
+                .filter(Boolean)
+            )
+
+            // Add PCB placements from edit events
+            for (const edit_event of edit_events) {
+              if (handled_edit_events.has(edit_event.edit_event_id)) continue
+
+              // TODO Figure out a good selector for this pcb_component
+              const selector = deriveSelectorFromPcbComponentId({
+                soup: dev_package_example_full.tscircuit_soup,
+                pcb_component_id: edit_event.pcb_component_id,
+              })
+
+              const existing_placement_for_selector = pcb_placements.find(
+                (pp) => pp.selector === selector
+              )
+
+              if (!existing_placement_for_selector) {
+                console.log(
+                  kleur.gray(
+                    `  adding PCB placement from edit event for "${selector}"`
+                  )
+                )
+
+                pcb_placements.push({
+                  _edit_event_id: edit_event.edit_event_id,
+                  selector,
+                  center: edit_event.new_center,
+                  relative_to: "group_center",
+                })
+              } else {
+                existing_placement_for_selector.center = edit_event.new_center
+              }
+
+              // Edit the pcb placements object
+              pcb_placements_ts.replaceWithText(
+                `pcb_placements: ${JSON.stringify(pcb_placements, null, "  ")}`
+              )
+
+              // Save the file
+
+              fs.writeFileSync(
+                Path.join(ctx.cwd, manual_edit_file),
+                ts_manual_edits_file.getFullText()
+              )
+            }
+          }
+        }
+      } catch (err: any) {
+        console.log(kleur.red(`Error in edit event watcher: ${err.toString()}`))
+      }
+
+      await new Promise((resolve) => setTimeout(resolve, 100))
+    }
+  })()
+
+  return {
+    stop: () => {
+      running = false
+    },
+  }
+}

package/lib/cmd-fns/dev/start-export-request-watcher.ts

@@ -15,7 +15,13 @@ export const startExportRequestWatcher = async (
 
   ;(async () => {
     while (running) {
-      await fulfillExportRequests({ dev_server_axios: devServerAxios }, ctx)
+      try {
+        await fulfillExportRequests({ dev_server_axios: devServerAxios }, ctx)
+      } catch (err: any) {
+        console.log(
+          kleur.red(`Error in export request watcher: ${err.toString()}`)
+        )
+      }
       await new Promise((resolve) => setTimeout(resolve, 100))
     }
   })()

package/lib/cmd-fns/init/index.ts

@@ -45,7 +45,7 @@ export const initCmd = async (ctx: AppContext, args: any) => {
     }
   }
 
-  let runtime = params.runtime
+  let runtime = params.runtime ?? ctx.runtime
   if (!runtime) {
     const bunExists = $.commandExistsSync("bun")
 
@@ -94,6 +94,10 @@ export const initCmd = async (ctx: AppContext, args: any) => {
   packageJson.scripts.build = "tsup ./index.ts --sourcemap --dts"
   writeFileSync("package.json", JSON.stringify(packageJson, null, 2))
 
+  console.log('Making package type: "module"...')
+  packageJson.type = "module"
+  writeFileSync("package.json", JSON.stringify(packageJson, null, 2))
+
   console.log(`Adding ".tscircuit" to .gitignore`)
   appendFileSync(".gitignore", "\n.tscircuit\n*.__tmp_entrypoint.tsx\ndist", {
     encoding: "utf-8",
@@ -107,15 +111,44 @@ export const initCmd = async (ctx: AppContext, args: any) => {
   mkdirSync("examples", { recursive: true })
   mkdirSync("lib", { recursive: true })
 
+  writeFileSync(
+    Path.join("lib", "MyCircuit.manual-edits.ts"),
+    `
+/**
+ * DO NOT EDIT THIS FILE DIRECTLY!
+ *
+ * This file is automatically edited when running \`tsci dev\` and dragging things
+ * around. \`tsci dev\` searches for a file named "*.manual-edits.ts" and edits
+ * it when you e.g. move a footprint. If there are multiple files, it'll try
+ * to pick one based on context or ask.
+ *
+ * If you're not running \`tsci dev\`, you can safely edit this file.
+ */
+export default {
+  // Generated when this file is created, this unique identifier is used to help
+  // determine which file to edit when there are many *.manual-edits.ts files
+  manual_edit_id: "abcdef",
+
+  // Manual pcb placements, added when you drag a footprint
+  pcb_placements: [],
+}
+`.trim()
+  )
+
   writeFileSync(
     Path.join("lib", "MyCircuit.tsx"),
     `
+  import { layout } from "tscircuit"
+  import manual_edits from "./MyCircuit.manual-edits"
+
   export const MyCircuit = () => (
-    <resistor
-      resistance="10kohm"
-      name="R1"
-      footprint="0805"
-    />
+    <group layout={layout().manualPcbPositions(manual_edits.pcb_placements)}>
+      <resistor
+        resistance="10kohm"
+        name="R1"
+        footprint="0805"
+      />
+    </group>
   )
   `.trim()
   )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tscircuit/cli",
-  "version": "0.0.82",
+  "version": "0.0.84",
   "private": false,
   "type": "module",
   "description": "Command line tool for developing, publishing and installing tscircuit circuits",
@@ -9,7 +9,8 @@
     "bootstrap": "bun i && cd dev-server-api && bun i && cd ../dev-server-frontend && bun i",
     "bootstrap:ci": "bun i --frozen-lockfile && cd dev-server-api && bun i --frozen-lockfile && cd ../dev-server-frontend && bun i --frozen-lockfile",
     "start": "bun cli.ts",
-    "start:dev-server:dev": "TSCI_DEV_SERVER_DB=$(pwd)/.tscircuit/dev-server.sqlite concurrently 'cd dev-server-api && bun start' 'cd dev-server-frontend && bun start'",
+    "dev": "TSCI_DEV_SERVER_DB=$(pwd)/.tscircuit/dev-server.sqlite concurrently 'cd dev-server-api && bun run build && bun start' 'cd dev-server-frontend && bun start' 'bun run dev-with-test-project'",
+    "clear": "rm -rf .tscircuit",
     "start:dev-server": "bun build:dev-server && bun cli.ts dev -y --cwd ./tests/assets/example-project",
     "build:dev-server": "cd dev-server-api && bun run build && cd ../dev-server-frontend && bun run build",
     "build:dev-server:api": "cd dev-server-api && bun run build",
@@ -17,7 +18,7 @@
     "build": "bun build:dev-server && npm run build:cli",
     "dev-with-test-project": "bun cli.ts dev --cwd ./tests/assets/example-project",
     "test:init": "bun cli.ts init --dir ./tmp/test --name test",
-    "update-deps": "bun add @tscircuit/builder@latest @tscircuit/react-fiber@latest && cd dev-server-frontend && bun run update-deps"
+    "update-deps": "npm add @tscircuit/builder@latest @tscircuit/react-fiber@latest && cd dev-server-frontend && npm run update-deps && cd ../tests/assets/example-project && npm add @tscircuit/builder@latest @tscircuit/react-fiber@latest"
   },
   "bin": {
     "tscircuit": "./dist/cli.js",
@@ -35,8 +36,9 @@
   "dependencies": {
     "@edge-runtime/primitives": "^4.1.0",
     "@hono/node-server": "^1.8.2",
-    "@tscircuit/builder": "1.5.72",
-    "@tscircuit/react-fiber": "^1.0.35",
+    "@tscircuit/builder": "^1.5.86",
+    "@tscircuit/react-fiber": "^1.0.39",
+    "@tscircuit/soup-util": "^0.0.1",
     "archiver": "^7.0.1",
     "axios": "^1.6.7",
     "better-sqlite3": "^9.4.3",
@@ -49,6 +51,7 @@
     "delay": "^6.0.0",
     "edgespec": "^0.0.69",
     "esbuild": "^0.20.2",
+    "fast-glob": "^3.3.2",
     "glob": "^10.3.10",
     "hono": "^4.1.0",
     "ignore": "^5.3.1",
@@ -63,6 +66,7 @@
     "prompts": "^2.4.2",
     "react": "^18.2.0",
     "semver": "^7.6.0",
+    "ts-morph": "^22.0.0",
     "tsup": "^8.0.2",
     "zod": "latest"
   },

package/tests/assets/example-project/examples/basic-bug.tsx

@@ -1,16 +1,28 @@
+import { layout } from "@tscircuit/layout"
+import manual_edits from "../src/manual-edits"
+
 export const BasicBug = () => (
-  <bug
-    name="U2"
-    port_arrangement={{
-      left_size: 4,
-      right_size: 4,
-    }}
-    center={[-10, 0]}
-    port_labels={{
-      "1": "GND",
-      "2": "VBUS",
-      "3": "D-",
-      "4": "D+",
-    }}
-  />
+  <group
+    layout={layout()
+      .autoLayoutSchematic()
+      .manualPcbPlacement(manual_edits.pcb_placements)}
+  >
+    <bug
+      name="U2"
+      port_arrangement={{
+        left_size: 4,
+        right_size: 4,
+      }}
+      footprint="sparkfun:ssop16"
+      center={[-10, 0]}
+      port_labels={{
+        "1": "GND",
+        "2": "VBUS",
+        "3": "D-",
+        "4": "D+",
+      }}
+    />
+    <resistor name="R1" resistance="10kohm" footprint="0805" />
+    <trace from=".U2 > .1" to=".R1 > .left" />
+  </group>
 )

package/tests/assets/example-project/package-lock.json

@@ -8,8 +8,8 @@
       "name": "example-project",
       "version": "1.2.26",
       "dependencies": {
-        "@tscircuit/builder": "^1.5.61",
-        "@tscircuit/react-fiber": "^1.0.34"
+        "@tscircuit/builder": "^1.5.86",
+        "@tscircuit/react-fiber": "^1.0.39"
       }
     },
     "node_modules/@babel/runtime": {
@@ -29,14 +29,17 @@
       "integrity": "sha512-iB+oaYyaVK1hQ0cODubnoSDg4gGYL9cp/4ad7G1b9Z0/IqehPztp5qE3KP2mV9Ns0UYmzwvtkEhTCmKUuhorbg=="
     },
     "node_modules/@tscircuit/builder": {
-      "version": "1.5.61",
-      "resolved": "https://registry.npmjs.org/@tscircuit/builder/-/builder-1.5.61.tgz",
-      "integrity": "sha512-pkaIte2C6Kksp3B79eQIG5f0/9KO2x0fdkHe/a0757lMYVUbcSvqjanL7RmJJ983C2wnEMo2au5ycgXvZseMUQ==",
+      "version": "1.5.86",
+      "resolved": "https://registry.npmjs.org/@tscircuit/builder/-/builder-1.5.86.tgz",
+      "integrity": "sha512-hZZvpo6t84kd66BfLE120eTLgoEUv42iEjxtQS6IeOUXk7y+pSMYwS16L+HHjmivKKRx0BOO+KmYFRsqi18mdw==",
       "dependencies": {
         "@lume/kiwi": "^0.1.0",
         "@tscircuit/footprints": "^0.0.14",
+        "@tscircuit/layout": "^0.0.7",
         "@tscircuit/routing": "^1.3.1",
-        "@tscircuit/sparkfun-packages": "^1.2.0",
+        "@tscircuit/schematic-autolayout": "^0.0.5",
+        "@tscircuit/soup-util": "^0.0.1",
+        "@tscircuit/sparkfun-packages": "^1.2.1",
         "convert-units": "^2.3.4",
         "fast-json-stable-stringify": "^2.1.0",
         "format-si-prefix": "^0.3.2",
@@ -57,6 +60,18 @@
         "typescript": "^5.0.0"
       }
     },
+    "node_modules/@tscircuit/layout": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/@tscircuit/layout/-/layout-0.0.7.tgz",
+      "integrity": "sha512-Jdd6j0+p4yK8zAqFX7dgmb5PT8A9KJduDBhEgAm+OgwDrw3Mp0hQ80pbR2Mvm02UF2Gu9H7TWpMytACCoNqPdA==",
+      "dependencies": {
+        "transformation-matrix": "^2.16.1"
+      },
+      "peerDependencies": {
+        "@tscircuit/builder": "*",
+        "zod": "*"
+      }
+    },
     "node_modules/@tscircuit/mm": {
       "version": "0.0.4",
       "resolved": "https://registry.npmjs.org/@tscircuit/mm/-/mm-0.0.4.tgz",
@@ -69,9 +84,9 @@
       }
     },
     "node_modules/@tscircuit/react-fiber": {
-      "version": "1.0.34",
-      "resolved": "https://registry.npmjs.org/@tscircuit/react-fiber/-/react-fiber-1.0.34.tgz",
-      "integrity": "sha512-kI5oOe/dbJGbeWlInx239hXNWPIRMRTgD8pO9IXvAvZ4YOldR6CJanx9DuT5vgTcZTjoswaXJzRJZZB1Ib2jmw==",
+      "version": "1.0.39",
+      "resolved": "https://registry.npmjs.org/@tscircuit/react-fiber/-/react-fiber-1.0.39.tgz",
+      "integrity": "sha512-xdEghvKDm9xr5j+zvEH8VVLj6haYCsQ5V8vNOyuXLoc63o7B/Maibsp5Yf6DdoC+SsxYYdZIt8cc0lAj7REfFg==",
       "dependencies": {
         "react-reconciler": "^0.29.0"
       },
@@ -89,10 +104,31 @@
         "react-error-boundary": "^4.0.11"
       }
     },
+    "node_modules/@tscircuit/schematic-autolayout": {
+      "version": "0.0.5",
+      "resolved": "https://registry.npmjs.org/@tscircuit/schematic-autolayout/-/schematic-autolayout-0.0.5.tgz",
+      "integrity": "sha512-I4CtLQfqTPTxDSumnquaJtkJkc16VjLC4bwU3jQdBXwwh9ODzBf88clUznUtDDzwV+BPM5P0W0VCfFhvPL3/Cw==",
+      "dependencies": {
+        "react": "^18.2.0",
+        "react-dom": "^18.2.0",
+        "react-supergrid": "^1.0.10",
+        "transformation-matrix": "^2.16.1",
+        "use-mouse-matrix-transform": "^1.1.12"
+      }
+    },
+    "node_modules/@tscircuit/soup-util": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/@tscircuit/soup-util/-/soup-util-0.0.1.tgz",
+      "integrity": "sha512-hNJayJ/Z+Clms1uAv8j6TCkK2aVNrm/C0PnAUcbSMY3gZfA+os7ovTxS/hCJfC22K4wHoBwsbZ+mE8R3KxaFfQ==",
+      "peerDependencies": {
+        "@tscircuit/builder": "*",
+        "zod": "*"
+      }
+    },
     "node_modules/@tscircuit/sparkfun-packages": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@tscircuit/sparkfun-packages/-/sparkfun-packages-1.2.0.tgz",
-      "integrity": "sha512-m+jCOaSBpwRzUN5trc9z5f8yh2zzLITANgNhuNQOtxNZRIrv98iYfL3dSSmf73xknh0Nz68EephNvKVZmproCQ==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@tscircuit/sparkfun-packages/-/sparkfun-packages-1.2.1.tgz",
+      "integrity": "sha512-2HzmmHydo5vgoKmNBAHd6RD93LaIMXRSt6t//1zx19/ZwrOA43qVOvb7cCTA82GHib1bSxoL7bqgii9sYudCHw==",
       "dependencies": {
         "change-case": "^5.4.3"
       }
@@ -359,10 +395,9 @@
       }
     },
     "node_modules/react": {
-      "version": "18.2.0",
-      "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz",
-      "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==",
-      "peer": true,
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
+      "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
       "dependencies": {
         "loose-envify": "^1.1.0"
       },
@@ -370,6 +405,18 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/react-dom": {
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
+      "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
+      "dependencies": {
+        "loose-envify": "^1.1.0",
+        "scheduler": "^0.23.2"
+      },
+      "peerDependencies": {
+        "react": "^18.3.1"
+      }
+    },
     "node_modules/react-error-boundary": {
       "version": "4.0.13",
       "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-4.0.13.tgz",
@@ -396,6 +443,16 @@
         "react": "^18.2.0"
       }
     },
+    "node_modules/react-supergrid": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/react-supergrid/-/react-supergrid-1.0.10.tgz",
+      "integrity": "sha512-dJd9wkH6BJkdfkv62EcRAIBn59e2wj58bJFVXiW/ZHQzxz20qIql63fTU2qFMOujXnBIDaMG0uTod67/mjEGeA==",
+      "peerDependencies": {
+        "react": "*",
+        "react-dom": "*",
+        "transformation-matrix": "*"
+      }
+    },
     "node_modules/rectilinear-router": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/rectilinear-router/-/rectilinear-router-1.0.1.tgz",
@@ -419,9 +476,9 @@
       }
     },
     "node_modules/scheduler": {
-      "version": "0.23.0",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz",
-      "integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==",
+      "version": "0.23.2",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
+      "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==",
       "dependencies": {
         "loose-envify": "^1.1.0"
       }
@@ -462,6 +519,26 @@
       "engines": {
         "node": ">=14.17"
       }
+    },
+    "node_modules/use-mouse-matrix-transform": {
+      "version": "1.1.13",
+      "resolved": "https://registry.npmjs.org/use-mouse-matrix-transform/-/use-mouse-matrix-transform-1.1.13.tgz",
+      "integrity": "sha512-NsP0j0Ifv9TywhqrNGfIhjpGzuyEzPK553ahn+LBVvZHZ6Gv+2T3tn41pJV6Syos1W7crWKolbP+XLfqa5BpCQ==",
+      "dependencies": {
+        "transformation-matrix": "^2.14.0"
+      },
+      "peerDependencies": {
+        "react": "^18.2.0"
+      }
+    },
+    "node_modules/zod": {
+      "version": "3.23.6",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-3.23.6.tgz",
+      "integrity": "sha512-RTHJlZhsRbuA8Hmp/iNL7jnfc4nZishjsanDAfEY1QpDQZCahUp3xDzl+zfweE9BklxMUcgBgS1b7Lvie/ZVwA==",
+      "peer": true,
+      "funding": {
+        "url": "https://github.com/sponsors/colinhacks"
+      }
     }
   }
 }

package/tests/assets/example-project/package.json

@@ -4,7 +4,7 @@
   "type": "module",
   "main": "dist/index.js",
   "dependencies": {
-    "@tscircuit/builder": "^1.5.61",
-    "@tscircuit/react-fiber": "^1.0.34"
+    "@tscircuit/builder": "^1.5.86",
+    "@tscircuit/react-fiber": "^1.0.39"
   }
 }

package/tests/assets/example-project/src/MyCircuit.tsx

@@ -1,7 +1,15 @@
 import "@tscircuit/react-fiber"
+import { layout } from "@tscircuit/layout"
+import manual_edits from "./manual-edits"
 
 export const MyCircuit = () => (
-  <board width="40mm" height="40mm" center_x={0} center_y={0}>
+  <board
+    width="40mm"
+    height="40mm"
+    center_x={0}
+    center_y={0}
+    layout={layout().manualPcbPlacement(manual_edits.pcb_placements)}
+  >
     <resistor
       name="R1"
       resistance="20kohm"