chore: release

.github/workflows/deploy-staging.yml

@@ -38,9 +38,22 @@ jobs:
         env:
           CLOUDFLARE_ENV: staging # for vite.config.ts to figure out which environment to build for
           VITE_ENV: staging
-          VITE_ORG_ID: ${{ secrets.VITE_ORG_ID_STAGING }}
-          VITE_API_KEY: ${{ secrets.VITE_API_KEY_STAGING }}
-          VITE_BASE_URL: staging.realtime.cloudflare.com
+
+      - name: Configure RealtimeKit API key
+        run: pnpm wrangler secret put REALTIMEKIT_API_KEY --env staging <<< "$REALTIMEKIT_API_KEY"
+        working-directory: ./demo-app
+        env:
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          REALTIMEKIT_API_KEY: ${{ secrets.REALTIMEKIT_API_KEY_STAGING }}
+
+      - name: Configure RealtimeKit org ID
+        run: pnpm wrangler secret put REALTIMEKIT_ORG_ID --env staging <<< "$REALTIMEKIT_ORG_ID"
+        working-directory: ./demo-app
+        env:
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          REALTIMEKIT_ORG_ID: ${{ secrets.REALTIMEKIT_ORG_ID_STAGING }}
 
       - name: Deploy to Cloudflare Workers
         uses: cloudflare/wrangler-action@v4
@@ -52,6 +65,3 @@ jobs:
         env:
           VITE_ENV: staging
           CLOUDFLARE_ENV: staging # for vite.config.ts to figure out which environment to deploy to
-          VITE_API_KEY: ${{ secrets.VITE_API_KEY_STAGING }}
-          VITE_ORG_ID: ${{ secrets.VITE_ORG_ID_STAGING }}
-          VITE_BASE_URL: staging.realtime.cloudflare.com

.github/workflows/deploy.yml

@@ -32,26 +32,28 @@ jobs:
         run: pnpm install --frozen-lockfile
         working-directory: ./
 
-      - name: Debug env vars
-        run: |
-          echo "VITE_BASE_URL is set: ${{ secrets.VITE_BASE_URL != '' }}"
-          echo "VITE_API_KEY is set: ${{ secrets.VITE_API_KEY != '' }}"
-          echo "VITE_ORG_ID is set: ${{ secrets.VITE_ORG_ID != '' }}"
-          echo "VITE_BASE_URL length: ${#VITE_BASE_URL}"
-        env:
-          VITE_BASE_URL: realtime.cloudflare.com
-          VITE_API_KEY: ${{ secrets.VITE_API_KEY }}
-          VITE_ORG_ID: ${{ secrets.VITE_ORG_ID }}
-
       - name: Build
         run: pnpm run build
         working-directory: ./demo-app
         env:
           CLOUDFLARE_ENV: production # for vite.config.ts to figure out which environment to build for
           VITE_ENV: production
-          VITE_ORG_ID: ${{ secrets.VITE_ORG_ID }}
-          VITE_API_KEY: ${{ secrets.VITE_API_KEY }}
-          VITE_BASE_URL: realtime.cloudflare.com
+
+      - name: Configure RealtimeKit API key
+        run: pnpm wrangler secret put REALTIMEKIT_API_KEY --env production <<< "$REALTIMEKIT_API_KEY"
+        working-directory: ./demo-app
+        env:
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          REALTIMEKIT_API_KEY: ${{ secrets.REALTIMEKIT_API_KEY }}
+
+      - name: Configure RealtimeKit org ID
+        run: pnpm wrangler secret put REALTIMEKIT_ORG_ID --env production <<< "$REALTIMEKIT_ORG_ID"
+        working-directory: ./demo-app
+        env:
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          REALTIMEKIT_ORG_ID: ${{ secrets.REALTIMEKIT_ORG_ID }}
 
       - name: Deploy to Cloudflare Workers
         uses: cloudflare/wrangler-action@v4
@@ -63,6 +65,3 @@ jobs:
         env:
           VITE_ENV: production
           CLOUDFLARE_ENV: production # for vite.config.ts to figure out which environment to deploy to
-          VITE_API_KEY: ${{ secrets.VITE_API_KEY }}
-          VITE_ORG_ID: ${{ secrets.VITE_ORG_ID }}
-          VITE_BASE_URL: realtime.cloudflare.com

AGENTS.md

@@ -31,7 +31,7 @@ realtimekit-web-examples/
 | Update SDK versions | `<workspace>/update-cloudflare-realtime-deps.sh` | Fetches from npm; pass `--env staging\|prod` |
 | Gallery example catalog | `demo-app/app/utils/react.ts`, `angular.ts`, `vanilla.ts` | Hardcoded; new examples won't appear without editing |
 | CI / deploy config | `.github/workflows/` | Per-framework staging + prod deploy workflows |
-| API credentials | `demo-app/.env.example` | `VITE_ORG_ID`, `VITE_API_KEY`, `VITE_BASE_URL`, `VITE_ENV` |
+| API credentials | `demo-app/.dev.vars.example` | `REALTIMEKIT_ORG_ID`, `REALTIMEKIT_API_KEY`, `REALTIMEKIT_BASE_URL` |
 
 ## COMMANDS
 
@@ -71,6 +71,6 @@ cd demo-app && pnpm dev
 
 - `pnpm-workspace.yaml` has a stale path: `recording-sdk-app-examples/react-examples/*` (actual dir: `recording-sdk-app-samples`) — this workspace glob is broken
 - `demo-app/README.md` contains only "TODO" — consult root `README.md`
-- `VITE_BASE_URL=realtime.cloudflare.com` in `.env.example` is a legacy URL (pre-Cloudflare branding) — verify the actual endpoint in CI secrets
+- `REALTIMEKIT_BASE_URL=realtime.cloudflare.com` is the server-side API base hostname for production; public SDK example builds use `VITE_BASE_URL` with staging using `staging.realtime.cloudflare.com`
 - Node version unspecified in the repo; CI uses Node 20 — match locally
 - `@dyteinternals/utils` in `recording-sdk-app-samples/react-examples/recording-with-watermark/package.json` is a vestigial upstream dependency

angular-examples/.env.examples

@@ -1,10 +1,5 @@
-# API Credentials
-VITE_ORG_ID=
-VITE_API_KEY=
-
 # API Base URL
 VITE_BASE_URL=realtime.cloudflare.com
 
-
 VITE_ENV=production
-# VITE_ENV=production
+# VITE_ENV=production

angular-examples/examples/create-your-own-ui/src/app/app.component.ts

@@ -35,9 +35,13 @@ export class AppComponent implements OnInit {
     if (!this.meeting) {
       try {
         // Initialize RealtimeKit client
+        const baseURI = searchParams.get('baseURI') || environment.baseUrl;
+        const logInConsole = searchParams.get('logInConsole') === 'true';
+
         const meeting = await RealtimeKitClient.init({
           authToken,
-          baseURI: environment.baseUrl,
+          baseURI,
+          modules: { devTools: { logs: logInConsole } },
         });
 
         this.meeting = meeting;

angular-examples/examples/default-meeting-ui/src/app/app.component.ts

@@ -25,9 +25,13 @@ export class AppComponent {
       return;
     }
 
+    const baseURI = searchParams.get('baseURI') || environment.baseUrl;
+    const logInConsole = searchParams.get('logInConsole') === 'true';
+
     const meeting = await RealtimeKitClient.init({
       authToken,
-      baseURI: environment.baseUrl,
+      baseURI,
+      modules: { devTools: { logs: logInConsole } },
     });
 
     this.$meetingEl.meeting = meeting;

angular-examples/examples/with-video-transformer/src/app/app.component.ts

@@ -28,9 +28,13 @@ export class AppComponent {
       return;
     }
 
+    const baseURI = searchParams.get('baseURI') || environment.baseUrl;
+    const logInConsole = searchParams.get('logInConsole') === 'true';
+
     const meeting = await RealtimeKitClient.init({
       authToken,
-      baseURI: environment.baseUrl,
+      baseURI,
+      modules: { devTools: { logs: logInConsole } },
     });
 
     this.$meetingEl.meeting = meeting;

demo-app/.dev.vars.example

@@ -0,0 +1,3 @@
+REALTIMEKIT_ORG_ID=your-org-id-here
+REALTIMEKIT_API_KEY=your-api-key-here
+REALTIMEKIT_BASE_URL=realtime.cloudflare.com

demo-app/.env.example

@@ -1,9 +1,2 @@
-# Dyte API Credentials
-# Please use this ORG ID in order for presets to work
-VITE_ORG_ID=05dc4990-76b0-44f8-adc9-42d27cd9f68f
-VITE_API_KEY=your-api-key-here
-
-# Dyte API Base URL
-VITE_BASE_URL=realtime.cloudflare.com
-
+# Browser-exposed environment only. Do not put API credentials in VITE_* vars.
 VITE_ENV=production

demo-app/.gitignore

@@ -33,4 +33,5 @@ html-examples
 *.tsbuildinfo
 
 .env.production
-.env.staging
+.env.staging
+.dev.vars

demo-app/AGENTS.md

@@ -22,6 +22,7 @@ demo-app/
 │   └── app.ts              # Cloudflare Worker entry point (SSR)
 ├── worker-configuration.d.ts  # Auto-generated Wrangler env bindings — do not edit manually
 ├── .env.example
+├── .dev.vars.example
 ├── vite.config.ts
 └── tsconfig.cloudflare.json   # Primary TS config; includes .react-router/types/**/*
 ```
@@ -52,7 +53,7 @@ demo-app/
 ## COMMANDS
 
 ```bash
-pnpm dev         # Local dev (requires .env with valid VITE_ORG_ID + VITE_API_KEY)
+pnpm dev         # Local dev (requires .dev.vars with valid REALTIMEKIT_ORG_ID + REALTIMEKIT_API_KEY)
 pnpm build       # Production build
 pnpm deploy      # Build + wrangler deploy
 pnpm typecheck   # wrangler types + react-router typegen + tsc
@@ -61,7 +62,7 @@ pnpm cf-typegen  # Regenerate worker-configuration.d.ts
 
 ## NOTES
 
-- `.env.example` includes a real shared demo `VITE_ORG_ID` — intentional for preset compatibility
-- `VITE_BASE_URL=dyte.io` in `.env.example` is a legacy URL — verify actual endpoint in CI secrets
+- `.env.example` is browser-exposed and must not include API credentials
+- `.dev.vars.example` documents local Worker runtime credentials for meeting creation
 - `demo-app/README.md` is blank ("TODO") — this file is the authoritative reference
-- Stack: React 18 + React Router 7 + Tailwind CSS v4 + `@cloudflare/vite-plugin` + Wrangler
+- Stack: React 18 + React Router 7 + Tailwind CSS v4 + `@cloudflare/vite-plugin` + Wrangler

demo-app/README.md

@@ -21,28 +21,29 @@ This application lists, filters, and launches all SDK examples. It creates meeti
 
 ### Environment Setup
 
-Copy `.env.example` to `.env` and fill in your credentials:
+Copy `.env.example` to `.env` for browser-safe Vite values, and copy `.dev.vars.example` to `.dev.vars` for Worker runtime credentials:
 
 ```bash
 cp .env.example .env
+cp .dev.vars.example .dev.vars
 ```
 
 Required environment variables:
 
 | Variable | Description |
 |----------|-------------|
-| `VITE_ORG_ID` | Your RealtimeKit organization ID |
-| `VITE_API_KEY` | Your RealtimeKit API key |
-| `VITE_BASE_URL` | RealtimeKit API base URL (e.g., `https://api.cloudflare.com/client/v2` or legacy `https://api.dyte.io/v2`) |
 | `VITE_ENV` | Environment identifier (e.g., `staging`, `production`) |
+| `REALTIMEKIT_ORG_ID` | Your RealtimeKit organization ID, stored in `.dev.vars` locally or Worker secrets in deploys |
+| `REALTIMEKIT_API_KEY` | Your RealtimeKit API key, stored in `.dev.vars` locally or Worker secrets in deploys |
+| `REALTIMEKIT_BASE_URL` | RealtimeKit API base hostname (e.g., `realtime.cloudflare.com`) |
 
 ### Development
 
 ```bash
 # Install dependencies
 pnpm install
 
-# Start dev server (requires .env with valid credentials)
+# Start dev server (requires .dev.vars with valid credentials)
 pnpm dev
 ```
 
@@ -79,7 +80,8 @@ demo-app/
 ├── worker-configuration.d.ts # Auto-generated Wrangler env bindings
 ├── vite.config.ts
 ├── wrangler.jsonc
-└── .env.example
+├── .env.example
+└── .dev.vars.example
 ```
 
 ## Adding Examples to the Gallery
@@ -129,7 +131,7 @@ The gallery catalog is **hardcoded** (not auto-discovered). To add a new example
 
 - **Type errors after route changes**: Run `pnpm typecheck` to regenerate `.react-router/types/`
 - **Wrangler env binding errors**: Run `pnpm cf-typegen` to update `worker-configuration.d.ts`
-- **Meeting creation fails**: Verify your `.env` contains valid `VITE_ORG_ID` and `VITE_API_KEY`
+- **Meeting creation fails**: Verify your `.dev.vars` contains valid `REALTIMEKIT_ORG_ID` and `REALTIMEKIT_API_KEY`
 
 ## Related
 

demo-app/app/api/meeting.ts

@@ -1,34 +1,27 @@
-export const createMeeting = async ({
-    meetingName,
-    recordOnStart,
-    aiSummary
-}: {
-    meetingName: string;
-    recordOnStart: boolean;
-    aiSummary: boolean;
-}) => {
-    const apiKey = import.meta.env.VITE_API_KEY;
-    const orgId = import.meta.env.VITE_ORG_ID;
-    const baseUrl = `https://api.${import.meta.env.VITE_BASE_URL}/v2`;
-    const authHeader = btoa(`${orgId}:${apiKey}`);
-    const response = await fetch(`${baseUrl}/meetings`, {
-        method: "POST",
-        headers: {
-            "Authorization": `Basic ${authHeader}`,
-            "Content-Type": "application/json"
-        },
-        body: JSON.stringify({
-            title: meetingName ?? "RealtimeKit Meeting",
-            record_on_start: recordOnStart,
-            summarize_on_end: aiSummary
-        })
-    })
-
-    const data = await response.json() as { message: string, data: { id: string } };
-
-    if (!response.ok) {
-        throw new Error(data.message || `API request failed with status ${response.status}`);
-    }
-
-    return data;
-}
+import type { ActionFunctionArgs } from "react-router";
+import { apiError, getAuthHeaders, getRealtimeKitConfig } from "./realtimekit.server";
+
+export const action = async ({ context, request }: ActionFunctionArgs) => {
+  try {
+    const { meetingName, recordOnStart, aiSummary } = await request.json() as {
+      meetingName: string;
+      recordOnStart: boolean;
+      aiSummary: boolean;
+    };
+    const config = getRealtimeKitConfig(context);
+    const response = await fetch(`${config.baseUrl}/meetings`, {
+      method: "POST",
+      headers: getAuthHeaders(config),
+      body: JSON.stringify({
+        title: meetingName ?? "RealtimeKit Meeting",
+        record_on_start: recordOnStart,
+        summarize_on_end: aiSummary,
+      }),
+    });
+    const data = await response.json();
+
+    return Response.json(data, { status: response.status });
+  } catch (error) {
+    return apiError(error);
+  }
+};