@tscircuit/eval 0.0.311 → 0.0.312

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tscircuit/eval",
   "main": "dist/lib/index.js",
-  "version": "0.0.311",
+  "version": "0.0.312",
   "type": "module",
   "scripts": {
     "build": "bun run build:lib && bun run build:webworker && bun run build:blob-url && bun run build:runner && bun run build:worker-wrapper",

package/tests/features/npm-import.test.tsx

@@ -0,0 +1,42 @@
+import { test, expect } from "bun:test"
+import { runTscircuitCode } from "lib/runner"
+
+test(
+  "should support importing various npm packages",
+  async () => {
+    const circuitJson = await runTscircuitCode(
+      `
+    import _ from "lodash"
+    import { v4 as uuidv4 } from "uuid"
+    import dayjs from "dayjs"
+
+    export default () => {
+      // Test lodash
+      if (!_.isEqual({ a: 1 }, { a: 1 })) {
+        throw new Error("_.isEqual failed")
+      }
+
+      // Test uuid
+      const uuid = uuidv4()
+      if (typeof uuid !== "string" || uuid.length < 36) {
+        throw new Error("uuid.v4 failed to generate a valid uuid")
+      }
+
+      // Test dayjs
+      if (!dayjs().isValid()) {
+        throw new Error("dayjs().isValid() failed")
+      }
+      
+      return <resistor name="R1" resistance="1k" />
+    }
+    `,
+    )
+
+    const resistor = circuitJson.find(
+      (element) => element.type === "source_component" && element.name === "R1",
+    )
+
+    expect(resistor).toBeDefined()
+  },
+  { timeout: 15000 },
+)

package/webworker/import-eval-path.ts

@@ -6,6 +6,7 @@ import { importSnippet } from "./import-snippet"
 import { resolveFilePath } from "lib/runner/resolveFilePath"
 import { resolveNodeModule } from "lib/utils/resolve-node-module"
 import { importNodeModule } from "./import-node-module"
+import { importNpmPackage } from "./import-npm-package"
 import Debug from "debug"
 
 const debug = Debug("tsci:eval:import-eval-path")
@@ -59,6 +60,10 @@ export async function importEvalPath(
     return importSnippet(importName, ctx, depth)
   }
 
+  if (!importName.startsWith(".") && !importName.startsWith("/")) {
+    return importNpmPackage(importName, ctx)
+  }
+
   throw new Error(
     `Unresolved import "${importName}" ${opts.cwd ? `from directory "${opts.cwd}"` : ""}`,
   )

package/webworker/import-npm-package.ts

@@ -0,0 +1,69 @@
+import { evalCompiledJs } from "./eval-compiled-js"
+import type { ExecutionContext } from "./execution-context"
+import * as Babel from "@babel/standalone"
+import { dirname } from "lib/utils/dirname"
+import Debug from "debug"
+
+const debug = Debug("tsci:eval:import-npm-package")
+
+function extractPackagePathFromJSDelivr(url: string) {
+  const prefix = "https://cdn.jsdelivr.net/npm/"
+  if (url.startsWith(prefix)) {
+    return url.substring(prefix.length).replace(/\/\+esm$/, "")
+  }
+  return url
+}
+
+export async function importNpmPackage(
+  importName: string,
+  ctx: ExecutionContext,
+) {
+  debug(`importing npm package: ${importName}`)
+  const { preSuppliedImports } = ctx
+
+  if (preSuppliedImports[importName]) return
+
+  const npmCdnUrl = `https://cdn.jsdelivr.net/npm/${importName}/+esm`
+
+  let finalUrl: string | undefined
+  const { content, error } = await globalThis
+    .fetch(npmCdnUrl)
+    .then(async (res) => {
+      finalUrl = res.url
+      if (!res.ok)
+        throw new Error(
+          `Could not fetch "${importName}" from jsdelivr: ${res.statusText}`,
+        )
+      return { content: await res.text(), error: null }
+    })
+    .catch((e) => ({ error: e, content: null }))
+
+  if (error) {
+    console.error("Error fetching npm import", importName, error)
+    throw error
+  }
+
+  const transpiled = Babel.transform(content!, {
+    presets: ["react", "env"],
+    plugins: ["transform-modules-commonjs"],
+    filename: importName,
+  })
+
+  if (!transpiled.code) {
+    throw new Error(`Babel transpilation failed for ${importName}`)
+  }
+  try {
+    const finalImportName = extractPackagePathFromJSDelivr(finalUrl!)
+    const cwd = dirname(finalImportName)
+    const exports = evalCompiledJs(
+      transpiled.code!,
+      preSuppliedImports,
+      cwd,
+    ).exports
+    preSuppliedImports[importName] = exports
+    preSuppliedImports[finalImportName] = exports
+    preSuppliedImports[finalUrl!] = exports
+  } catch (e: any) {
+    throw new Error(`Eval npm package error for "${importName}": ${e.message}`)
+  }
+}