Add Node and Bun support to the TypeScript client

.github/workflows/publish-deno.yml → .github/workflows/publish-typescript-jsr.yml

@@ -1,4 +1,4 @@
-name: Publish Deno Client
+name: Publish TypeScript Client (JSR)
 on:
   workflow_run:
     workflows: ["Verify", "Release Rust Binary"]
@@ -11,7 +11,7 @@ jobs:
     runs-on: ubuntu-latest
     defaults:
       run:
-        working-directory: src/clients/deno
+        working-directory: src/clients/typescript
 
     permissions:
       contents: write

.github/workflows/publish-typescript-npm.yml

@@ -0,0 +1,42 @@
+name: Publish TypeScript Client (npm)
+on:
+  workflow_run:
+    workflows: ["Verify", "Release Rust Binary"]
+    types:
+      - completed
+    branches: [main]
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    defaults:
+      run:
+        working-directory: src/clients/typescript
+
+    permissions:
+      contents: read
+      id-token: write
+
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 24
+          registry-url: https://registry.npmjs.org
+
+      - name: Get current version
+        id: current_version
+        run: echo "version=$(node -p "require('./package.json').version")" >> $GITHUB_OUTPUT
+
+      - name: Get published version
+        id: published_version
+        run: echo "version=$(npm view @just-be/webview version 2>/dev/null || echo 'unpublished')" >> $GITHUB_OUTPUT
+
+      - name: Publish package
+        if: ${{ steps.current_version.outputs.version != steps.published_version.outputs.version }}
+        run: |
+          npm ci
+          npm publish --access public --provenance
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.gitignore

@@ -3,6 +3,7 @@ _test*
 .DS_Store
 __pycache__
 node_modules
+src/clients/typescript/dist
 
 .vscode/*
 !.vscode/*.shared.json

.vscode/settings.shared.json

@@ -8,7 +8,7 @@
   },
   "deno.enablePaths": [
     "scripts",
-    "src/clients/deno"
+    "src/clients/typescript"
   ],
   "python.analysis.typeCheckingMode": "strict",
   "python.analysis.extraPaths": [

.zed/settings.json

@@ -9,7 +9,7 @@
       "settings": {
         "deno": {
           "enable": true,
-          "enablePaths": ["src/clients/deno"]
+          "enablePaths": ["src/clients/typescript"]
         }
       }
     }

README.md

@@ -4,7 +4,7 @@ A light, cross-platform library for building web-based desktop apps. The project
 
 ## Available Clients
 
-- [Deno Client](src/clients/deno/README.md) - Build desktop apps using Deno and TypeScript
+- [TypeScript Client](src/clients/typescript/README.md) - Build desktop apps using Node, Deno, or Bun
 - [Python Client](src/clients/python/README.md) - Build desktop apps using Python
 
 ## Architecture
@@ -27,10 +27,12 @@ All clients support using a custom binary via the `WEBVIEW_BIN` environment vari
 ## Examples
 
 <details>
-<summary>Deno Example</summary>
+<summary>TypeScript Example (Node, Deno, or Bun)</summary>
 
 ```typescript
-import { createWebView } from "jsr:@justbe/webview";
+// Node/Bun: npm install @just-be/webview
+import { createWebView } from "@just-be/webview";
+// Deno: import { createWebView } from "jsr:@justbe/webview";
 
 using webview = await createWebView({
   title: "Example",

mise.toml

@@ -1,5 +1,7 @@
 [tools]
 deno = "2.4.2"
+node = "24"
+bun = "latest"
 ast-grep = "0.43.0"
 rust = { version = "1.90.0", components="rustfmt,clippy,rust-analyzer" }
 ruff = "0.15.14"
@@ -24,6 +26,14 @@ run = """
     rustup component add rustfmt clippy rust-analyzer
   """
 
+[tasks."npm:install"]
+hide = true
+description = "Install npm dependencies for the TypeScript client"
+dir = "src/clients/typescript"
+run = "npm install --no-audit --no-fund"
+sources = ["src/clients/typescript/package.json"]
+outputs = ["src/clients/typescript/node_modules/.package-lock.json"]
+
 [tasks.sync-versions]
 description = "Update all version references"
 run = "deno run -A scripts/sync-versions.ts"
@@ -37,13 +47,13 @@ depends_post = ["format:rust"]
 sources = ["src/**/*.rs", "Cargo.toml", "Cargo.lock"]
 outputs = ["schemas/*.json"]
 
-[tasks."gen:deno"]
-description = "Generate the deno client"
+[tasks."gen:ts"]
+description = "Generate the typescript client"
 run = "deno run -A scripts/generate-schema/index.ts --language typescript"
 depends = ["gen:rust"]
-depends_post = ["format:deno"]
+depends_post = ["format:ts"]
 sources = ["schemas/*", "scripts/generate-schema.ts"]
-outputs = ["src/clients/deno/schemas/*.ts"]
+outputs = ["src/clients/typescript/schemas.ts"]
 
 [tasks."gen:python"]
 description = "Generate the python client"
@@ -64,11 +74,17 @@ run = "deno run -A scripts/generate-schema/debug.ts $usage_schema"
 
 ## Publishing
 
-[tasks."verify-publish:deno"]
-description = "Verify the deno client is pulishable"
-dir = "src/clients/deno"
+[tasks."verify-publish:ts"]
+description = "Verify the typescript client is publishable to JSR"
+dir = "src/clients/typescript"
 run = "deno publish --dry-run"
 
+[tasks."verify-publish:npm"]
+description = "Verify the typescript client is publishable to npm"
+dir = "src/clients/typescript"
+depends = ["npm:install"]
+run = ["npm run build", "npm pack --dry-run"]
+
 [tasks.gen]
 description = "Run all code gen tasks"
 depends = ["gen:*"]
@@ -92,9 +108,9 @@ sources = ["src/**/*.rs", "Cargo.toml", "Cargo.lock"]
 outputs = ["target/debug/webview"]
 depends = ["gen:rust"]
 
-[tasks."build:deno"]
-description = "Run code gen for deno and ensure the binary is built"
-depends = ["gen:deno", "build:rust"]
+[tasks."build:ts"]
+description = "Run code gen for the typescript client and ensure the binary is built"
+depends = ["gen:ts", "build:rust"]
 
 [tasks."build:python"]
 description = "Run code gen for python and ensure the binary is built"
@@ -110,9 +126,9 @@ depends = ["build:*"]
 description = "Format rust code"
 run = ["rustfmt src/**/*.rs"]
 
-[tasks."format:deno"]
-description = "Format deno code"
-run = ["deno fmt src/clients/deno"]
+[tasks."format:ts"]
+description = "Format typescript code"
+run = ["deno fmt src/clients/typescript"]
 
 [tasks."format:python"]
 description = "Format python code"
@@ -129,11 +145,17 @@ depends = ["format:*"]
 description = "Run clippy against rust code"
 run = ["rustfmt --check src/**/*.rs", "cargo clippy"]
 
-[tasks."lint:deno"]
-description = "Run deno lint"
-dir = "src/clients/deno"
+[tasks."lint:ts"]
+description = "Run deno lint and typecheck"
+dir = "src/clients/typescript"
 run = ["deno lint", "deno check ."]
 
+[tasks."lint:ts-npm"]
+description = "Typecheck the typescript client against node types"
+dir = "src/clients/typescript"
+depends = ["npm:install"]
+run = ["npm run check"]
+
 [tasks."lint:ast-grep"]
 description = "Run ast-grep lint"
 run = """
@@ -161,11 +183,31 @@ run = "uv run -n examples/$usage_example.py"
 env = { LOG_LEVEL = "debug", WEBVIEW_BIN = "../../../target/debug/webview" }
 
 [tasks."example:deno"]
-description = "Run a deno example"
-depends = ["build:deno"]
+description = "Run a typescript example with Deno"
+depends = ["build:ts"]
 env = { LOG_LEVEL = "debug", WEBVIEW_BIN = "../../../target/debug/webview" }
 usage = '''
 arg "<example>" help="The example to run"
 '''
 run = "deno run -E -R -N --allow-run examples/$usage_example.ts"
-dir = "src/clients/deno"
+dir = "src/clients/typescript"
+
+[tasks."example:node"]
+description = "Run a typescript example with Node"
+depends = ["build:ts", "npm:install"]
+env = { LOG_LEVEL = "debug", WEBVIEW_BIN = "../../../target/debug/webview" }
+usage = '''
+arg "<example>" help="The example to run"
+'''
+run = "npx tsx examples/$usage_example.ts"
+dir = "src/clients/typescript"
+
+[tasks."example:bun"]
+description = "Run a typescript example with Bun"
+depends = ["build:ts", "npm:install"]
+env = { LOG_LEVEL = "debug", WEBVIEW_BIN = "../../../target/debug/webview" }
+usage = '''
+arg "<example>" help="The example to run"
+'''
+run = "bun run examples/$usage_example.ts"
+dir = "src/clients/typescript"

scripts/generate-schema/gen-typescript.ts

@@ -4,7 +4,7 @@ import { match } from "npm:ts-pattern";
 
 const header = (relativePath: string) =>
   `// DO NOT EDIT: This file is auto-generated by ${relativePath}\n` +
-  "import { z } from 'npm:zod';\n\n";
+  "import { z } from 'zod';\n\n";
 
 // Track generated definitions to avoid duplicates
 const generatedTypeDefinitions = new Set<string>();

scripts/generate-schema/index.ts

@@ -11,7 +11,8 @@ import {
 import { parseSchema } from "./parser.ts";
 
 const schemasDir = new URL("../../schemas", import.meta.url).pathname;
-const tsSchemaDir = new URL("../../src/clients/deno", import.meta.url).pathname;
+const tsSchemaDir =
+  new URL("../../src/clients/typescript", import.meta.url).pathname;
 const pySchemaDir =
   new URL("../../src/clients/python/src/justbe_webview", import.meta.url)
     .pathname;

scripts/sync-versions.ts

@@ -1,6 +1,7 @@
 /**
  * Synchronizes version numbers across the project:
- * - Updates BIN_VERSION in Deno client (main.ts)
+ * - Updates BIN_VERSION in TypeScript client (main.ts)
+ * - Keeps the TypeScript client's package.json version in sync with deno.json
  * - Updates package version in Python client (pyproject.toml)
  * - Updates BIN_VERSION in Python client (__init__.py)
  *
@@ -15,17 +16,33 @@ const latestVersion = await Deno
     parse(text) as { package: { version: string } }
   ).then((config) => config.package.version);
 
-// ===== Update Deno Client Version =====
-const denoPath = "./src/clients/deno/main.ts";
-const denoContent = await Deno.readTextFile(denoPath);
+// ===== Update TypeScript Client Version =====
+const tsClientPath = "./src/clients/typescript/main.ts";
+const tsClientContent = await Deno.readTextFile(tsClientPath);
 
-const updatedDenoContent = denoContent.replace(
+const updatedTsClientContent = tsClientContent.replace(
   /const BIN_VERSION = "[^"]+"/,
   `const BIN_VERSION = "${latestVersion}"`,
 );
 
-await Deno.writeTextFile(denoPath, updatedDenoContent);
-console.log(`✓ Updated Deno BIN_VERSION to ${latestVersion}`);
+await Deno.writeTextFile(tsClientPath, updatedTsClientContent);
+console.log(`✓ Updated TypeScript BIN_VERSION to ${latestVersion}`);
+
+// ===== Sync TypeScript package.json version with deno.json =====
+// The JSR (deno.json) and npm (package.json) manifests must always publish
+// the same package version; deno.json is the source of truth.
+const denoJsonPath = "./src/clients/typescript/deno.json";
+const packageJsonPath = "./src/clients/typescript/package.json";
+const denoJson = JSON.parse(await Deno.readTextFile(denoJsonPath)) as {
+  version: string;
+};
+const packageJsonContent = await Deno.readTextFile(packageJsonPath);
+const updatedPackageJsonContent = packageJsonContent.replace(
+  /"version": "[^"]+"/,
+  `"version": "${denoJson.version}"`,
+);
+await Deno.writeTextFile(packageJsonPath, updatedPackageJsonContent);
+console.log(`✓ Synced TypeScript package.json version to ${denoJson.version}`);
 
 // ===== Update Python Client BIN_VERSION =====
 const pythonInitPath = "./src/clients/python/src/justbe_webview/__init__.py";