Port browser-specific logic from the old SDK

Author: jverce

.fernignore

@@ -19,6 +19,7 @@ MIGRATE.md
 # Custom Pipedream client files
 src/api/resources/index.ts
 src/api/types/index.ts
+src/browser/index.ts
 src/index.ts
 src/wrapper
 

MIGRATE.md

@@ -59,6 +59,9 @@ the latest version.
     - [Request options](#request-options)
     - [Abort signals](#abort-signals)
     - [Raw response access](#raw-response-access)
+  - [Browser/Server Environment Separation](#browserserver-environment-separation)
+    - [Package.json Export Structure](#packagejson-export-structure)
+    - [Import Recommendations](#import-recommendations)
   - [Additional namespaces](#additional-namespaces)
   - [Partial migration](#partial-migration)
   - [Important removed functionality](#important-removed-functionality)
@@ -148,6 +151,11 @@ const frontendClient = createFrontendClient({
 
 #### v2.x (new)
 
+The v2.x SDK provides two options for browser-side usage:
+
+**Option 1: Using PipedreamClient with connect token (for simple token-based
+auth)**
+
 ```javascript
 import { PipedreamClient } from '@pipedream/sdk';
 
@@ -158,6 +166,44 @@ const frontendClient = new PipedreamClient({
 });
 ```
 
+**Option 2: Using BrowserClient with token callback (for dynamic token
+management)**
+
+```javascript
+// Explicit browser import (recommended for browser apps)
+import { createFrontendClient, BrowserClient } from '@pipedream/sdk/browser';
+
+// Or automatic browser resolution
+import { createFrontendClient, BrowserClient } from '@pipedream/sdk';
+
+const client = createFrontendClient({
+  tokenCallback: async ({ externalUserId }) => {
+    // Call your backend to get a connect token
+    const response = await fetch('/api/pipedream/token', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ externalUserId })
+    });
+    return response.json();
+  },
+  externalUserId: 'user-123'
+});
+
+// Connect an account using Pipedream Connect
+client.connectAccount({
+  app: 'github',
+  onSuccess: (result) => {
+    console.log('Account connected:', result.id);
+  },
+  onError: (error) => {
+    console.error('Connection failed:', error);
+  }
+});
+
+// Get user's accounts
+const accounts = await client.getAccounts();
+```
+
 ### Environment variables
 
 The v2.x SDK supports automatic configuration via environment variables:
@@ -715,6 +761,55 @@ console.log(response.data); // Parsed response data
 console.log(response.rawResponse); // Original Response object
 ```
 
+## Browser/Server Environment Separation
+
+The v2.x SDK provides proper environment separation to ensure browser-safe
+imports without Node.js dependencies.
+
+### Package.json Export Structure
+
+The SDK uses conditional exports to automatically serve the right code:
+
+```json
+{
+  "exports": {
+    ".": {
+      "browser": "./dist/esm/browser/index.mjs",  // Browser gets browser-only code
+      "import": "./dist/esm/index.mjs",           // Node.js gets full functionality
+      "require": "./dist/cjs/index.js"
+    },
+    "./browser": {
+      "import": "./dist/esm/browser/index.mjs"    // Explicit browser import
+    },
+    "./server": {
+      "import": "./dist/esm/index.mjs",           // Explicit server import
+      "require": "./dist/cjs/index.js"
+    }
+  }
+}
+```
+
+### Import Recommendations
+
+```typescript
+// For browser applications - avoids Node.js dependencies
+import { BrowserClient, createFrontendClient } from '@pipedream/sdk/browser';
+
+// For server applications - includes full functionality
+import { Pipedream } from '@pipedream/sdk/server';
+
+// Automatic resolution (recommended for most cases)
+import { Pipedream } from '@pipedream/sdk';          // Server environments
+import { BrowserClient } from '@pipedream/sdk';     // Browser environments
+```
+
+This ensures:
+
+- **Browser bundlers** automatically get the browser-safe version
+- **Node.js environments** get the full SDK with all server functionality
+- **Smaller bundle sizes** for browser applications
+- **No Node.js dependency errors** in browser builds
+
 ## Additional namespaces
 
 The v2.x SDK includes several new namespaces not available in v1.x:
@@ -740,7 +835,7 @@ incrementally without breaking your existing codebase. To do this, you can
 install the new SDK with an alias:
 
 ```bash
-npm install @pipedream/sdk-v2@npm:@pipedream/sdk@^2.0.0-rc.3 --save
+npm install @pipedream/sdk-v2@npm:@pipedream/sdk@^2.0.0-rc.4 --save
 ```
 
 Then, in your code, you can import the new SDK with the alias:

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@pipedream/sdk",
-    "version": "2.0.0-rc.3",
+    "version": "2.0.0-rc.4",
     "private": false,
     "repository": "github:PipedreamHQ/pipedream-sdk-typescript",
     "type": "commonjs",
@@ -9,6 +9,28 @@
     "types": "./dist/cjs/index.d.ts",
     "exports": {
         ".": {
+            "types": "./dist/cjs/index.d.ts",
+            "browser": {
+                "types": "./dist/esm/browser/index.d.mts",
+                "import": "./dist/esm/browser/index.mjs",
+                "default": "./dist/esm/browser/index.mjs"
+            },
+            "import": {
+                "types": "./dist/esm/index.d.mts",
+                "default": "./dist/esm/index.mjs"
+            },
+            "require": {
+                "types": "./dist/cjs/index.d.ts",
+                "default": "./dist/cjs/index.js"
+            },
+            "default": "./dist/cjs/index.js"
+        },
+        "./browser": {
+            "types": "./dist/esm/browser/index.d.mts",
+            "import": "./dist/esm/browser/index.mjs",
+            "default": "./dist/esm/browser/index.mjs"
+        },
+        "./server": {
             "types": "./dist/cjs/index.d.ts",
             "import": {
                 "types": "./dist/esm/index.d.mts",

src/Client.ts

@@ -73,8 +73,8 @@ export class PipedreamClient {
                     "x-pd-environment": _options?.projectEnvironment,
                     "X-Fern-Language": "JavaScript",
                     "X-Fern-SDK-Name": "@pipedream/sdk",
-                    "X-Fern-SDK-Version": "2.0.0-rc.3",
-                    "User-Agent": "@pipedream/sdk/2.0.0-rc.3",
+                    "X-Fern-SDK-Version": "2.0.0-rc.4",
+                    "User-Agent": "@pipedream/sdk/2.0.0-rc.4",
                     "X-Fern-Runtime": core.RUNTIME.type,
                     "X-Fern-Runtime-Version": core.RUNTIME.version,
                 },