@bardioc/create-bardioc-app 0.4.0

package/templates/angular/angular.json

@@ -0,0 +1,64 @@
+{
+  "$schema": "https://schemas.angular.io/schematics/angular",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "{{APP_NAME}}": {
+      "projectType": "application",
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:application",
+          "options": {
+            "outputPath": "dist/{{APP_NAME}}",
+            "index": "src/index.html",
+            "browser": "src/main.ts",
+            "polyfills": ["zone.js"],
+            "tsConfig": "tsconfig.json",
+            "assets": [{ "glob": "**/*", "input": "public" }],
+            "styles": ["src/styles.css"],
+            "scripts": [],
+            "outputMode": "static"
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "1MB",
+                  "maximumError": "2MB"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "4kB",
+                  "maximumError": "8kB"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "configurations": {
+            "production": {
+              "buildTarget": "{{APP_NAME}}:build:production"
+            },
+            "development": {
+              "buildTarget": "{{APP_NAME}}:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        }
+      }
+    }
+  }
+}

package/templates/angular/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "{{APP_NAME}}",
+  "version": "0.0.1",
+  "private": true,
+  "scripts": {
+    "sync:runtime-env": "node ./scripts/sync-runtime-env.mjs",
+    "ng": "ng",
+    "predev": "pnpm sync:runtime-env",
+    "dev": "node ./scripts/dev-auth-proxy.mjs --app-port {{PORT}} & PROXY_PID=$!; ng serve --port {{PORT}}; EXIT_CODE=$?; kill $PROXY_PID; exit $EXIT_CODE",
+    "predev:live": "pnpm sync:runtime-env",
+    "dev:live": "node ./scripts/dev-auth-proxy.mjs --app-port {{PORT}} & PROXY_PID=$!; BARDIOC_TUNNEL=1 ng serve --port {{PORT}}; EXIT_CODE=$?; kill $PROXY_PID; exit $EXIT_CODE",
+    "prebuild": "pnpm sync:runtime-env",
+    "build": "ng build && node scripts/stamp-manifest.mjs dist/{{APP_NAME}}/browser",
+    "bundle": "ng build && node scripts/stamp-manifest.mjs dist/{{APP_NAME}}/browser && cd dist/{{APP_NAME}}/browser && zip -r ../../../{{APP_NAME}}.zip .",
+    "prewatch": "pnpm sync:runtime-env",
+    "watch": "ng build --watch --configuration development",
+    "precheck-types": "pnpm sync:runtime-env",
+    "check-types": "ng build --configuration development",
+    "changeset": "changeset",
+    "release:status": "changeset status --verbose",
+    "release:version": "changeset version && pnpm install --lockfile-only",
+    "release:publish": "changeset publish"
+  },
+  "dependencies": {
+    "@angular/animations": "^19.2.12",
+    "@angular/common": "^19.2.12",
+    "@angular/compiler": "^19.2.12",
+    "@angular/core": "^19.2.12",
+    "@angular/forms": "^19.2.12",
+    "@angular/platform-browser": "^19.2.12",
+    "@angular/platform-browser-dynamic": "^19.2.12",
+    "@angular/router": "^19.2.12",
+    "@bardioc/app-sdk": "latest",
+    "rxjs": "~7.8.2",
+    "tslib": "^2.8.1",
+    "zone.js": "~0.15.1"
+  },
+  "devDependencies": {
+    "@angular-devkit/build-angular": "^19.2.13",
+    "@angular/cli": "^19.2.13",
+    "@angular/compiler-cli": "^19.2.12",
+    "@changesets/cli": "^2.31.0",
+    "@tailwindcss/postcss": "^4.2.4",
+    "autoprefixer": "^10.4.21",
+    "postcss": "^8.5.4",
+    "tailwindcss": "^4.2.4",
+    "typescript": "~5.8.3"
+  }
+}

package/templates/angular/postcss.config.mjs

@@ -0,0 +1,5 @@
+import tailwindcss from '@tailwindcss/postcss';
+
+export default {
+  plugins: [tailwindcss()],
+};

package/templates/angular/public/icon.svg

@@ -0,0 +1 @@
+<svg fill="none" height="20" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" gradientUnits="userSpaceOnUse" x1="15.3012" x2="-2.25993" y1="1.77049" y2="12.9254"><stop offset=".4898" stop-color="#c084fc"/><stop offset="1" stop-color="#9333ea"/></linearGradient><path d="m14.3984 3.35791c1.9618.00013 3.5514 1.59021 3.5518 3.55176v8.08593c0 1.9602-1.5896 3.5507-3.5518 3.5508h-8.84567c-1.96194-.0002-3.55273-1.5909-3.55273-3.5527v-8.08403c.00042-1.96151 1.59105-3.55156 3.55273-3.55176zm4.5186 12.18069c.0121-.1019.0221-.2048.0273-.3086.004-.0776.0059-.1559.0059-.2344v-8.08593c0-.18616-.0124-.36951-.0342-.54981.0218.18056.0352.36435.0352.55078v8.08496c0 .1837-.013.3649-.0342.543zm-17.8672.1318c-.03282-.2205-.0498-.4471-.0498-.6767 0 .2298.01694.456.0498.6767zm.00098-9.44042c-.03187.21266-.0494.43015-.05078.65137.00138-.22122.01891-.43871.05078-.65137zm3.60254-3.7832c.0723-.01449.14526-.02707.21875-.03809-.07349.01102-.14645.0236-.21875.03809zm.66504-.08301c-.14548.00737-.2891.02225-.43066.04297.14156-.02072.28518-.0356.43066-.04297zm9.31444 0c.1368.00693.272.02032.4053.03906-.1332-.01872-.2686-.03213-.4053-.03906zm-9.76171 17.13183c-.06758-.0101-.1346-.0221-.20117-.0352.06658.0131.13359.0251.20117.0352zm-2.92578-1.7256c-.0288-.0374-.0573-.075-.08496-.1133.02766.0383.05616.0759.08496.1133zm16.82719-12.11912c.0144.05023.0292.10044.042.15137-.0128-.05093-.0276-.10114-.042-.15137zm.0449.16504c.0166.06713.0313.13485.0449.20312-.0135-.06826-.0284-.13599-.0449-.20312zm.0644.31152c.006.03443.0124.06883.0176.10352-.0052-.03469-.0116-.06909-.0176-.10352zm-17.81246 9.65526c-.00653-.0373-.01393-.0746-.01954-.1123.00561.0377.01301.075.01954.1123zm17.57126-10.5244c.0165.04237.0326.08495.0479.12793-.0153-.04298-.0314-.08556-.0479-.12793zm-14.12888-2.78027c.04696-.01099.09409-.02174.1416-.03125-.04751.00952-.09464.02026-.1416.03125z" fill="url(#a)"/><g opacity=".31"><path d="m3.24438 5.75049v7.11941c0 1.4408.99919 2.6095 2.23108 2.6095h9.00044c1.2319 0 2.231-1.1687 2.231-2.6095v-7.11941z" fill="#fff" fill-opacity=".6"/></g><rect x="6" y="7" width="8" height="1.5" rx="0.75" fill="#eddcff"/><rect x="6" y="10" width="8" height="1.5" rx="0.75" fill="#eddcff"/><rect x="6" y="13" width="5" height="1.5" rx="0.75" fill="#eddcff"/></svg>

package/templates/angular/public/runtime-env.js

@@ -0,0 +1 @@
+window.__BARDIOC_RUNTIME_ENV__ = {};

package/templates/angular/scripts/dev-auth-proxy.mjs

@@ -0,0 +1,92 @@
+#!/usr/bin/env node
+
+import { readFileSync } from 'node:fs';
+import { createServer } from 'node:http';
+import { dirname, join, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { createDevAuthProxyHandler } from '@bardioc/app-sdk/dev-proxy';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const projectRoot = resolve(__dirname, '..');
+const appPort = readAppPort();
+const proxyPort = appPort + 100;
+const env = loadEnv(projectRoot);
+
+if (!env.VITE_APP_ID || !env.DEV_AUTH_HOST_URL || !env.DEV_SESSION_KEY) {
+  process.stderr.write('[bardioc-dev-auth-proxy] missing env, proxy disabled\n');
+  await new Promise(() => {});
+}
+
+const handler = createDevAuthProxyHandler({
+  appId: env.VITE_APP_ID,
+  hostUrl: env.DEV_AUTH_HOST_URL,
+  devSessionKey: env.DEV_SESSION_KEY,
+  allowOrigin: '*',
+});
+
+const server = createServer((req, res) => {
+  void handler(req, res);
+});
+
+server.listen(proxyPort, '127.0.0.1', () => {
+  process.stdout.write(`[bardioc-dev-auth-proxy] listening on http://127.0.0.1:${proxyPort}/proxy\n`);
+});
+
+for (const signal of ['SIGINT', 'SIGTERM']) {
+  process.on(signal, () => {
+    server.close(() => process.exit(0));
+  });
+}
+
+function readAppPort() {
+  const flagIndex = process.argv.indexOf('--app-port');
+  const raw = flagIndex >= 0 ? process.argv[flagIndex + 1] : undefined;
+  const parsed = Number.parseInt(raw ?? '{{PORT}}', 10);
+  return Number.isFinite(parsed) ? parsed : {{PORT}};
+}
+
+function loadEnv(projectDir) {
+  const result = {};
+
+  for (const fileName of ['.env', '.env.local']) {
+    const filePath = join(projectDir, fileName);
+
+    try {
+      Object.assign(result, parseEnv(readFileSync(filePath, 'utf8')));
+    } catch {
+      // Ignore missing env files.
+    }
+  }
+
+  return result;
+}
+
+function parseEnv(source) {
+  const result = {};
+
+  for (const rawLine of source.split(/\r?\n/)) {
+    const line = rawLine.trim();
+    if (!line || line.startsWith('#')) {
+      continue;
+    }
+
+    const equalsIndex = line.indexOf('=');
+    if (equalsIndex <= 0) {
+      continue;
+    }
+
+    const key = line.slice(0, equalsIndex).trim();
+    let value = line.slice(equalsIndex + 1).trim();
+
+    if (
+      (value.startsWith('"') && value.endsWith('"')) ||
+      (value.startsWith("'") && value.endsWith("'"))
+    ) {
+      value = value.slice(1, -1);
+    }
+
+    result[key] = value;
+  }
+
+  return result;
+}

package/templates/angular/scripts/sync-runtime-env.mjs

@@ -0,0 +1,89 @@
+#!/usr/bin/env node
+
+import { mkdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { dirname, join, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const projectRoot = resolve(__dirname, '..');
+const env = loadEnv(projectRoot);
+const appPort = readAppPort();
+const proxyPort = appPort + 100;
+
+const runtimeEnv = {
+  VITE_APP_NAME: env.VITE_APP_NAME,
+  VITE_APP_ID: env.VITE_APP_ID,
+  VITE_ENABLE_DEV_AUTH: env.VITE_ENABLE_DEV_AUTH,
+  DEV_AUTH_HOST_URL: env.DEV_AUTH_HOST_URL,
+  DEV_SESSION_KEY: env.DEV_SESSION_KEY,
+};
+
+const injectedDevAuth =
+  env.DEV_AUTH_HOST_URL && env.DEV_SESSION_KEY
+    ? {
+        hostUrl: env.DEV_AUTH_HOST_URL,
+        sessionKey: env.DEV_SESSION_KEY,
+        proxyUrl: `http://127.0.0.1:${proxyPort}/proxy`,
+      }
+    : null;
+
+const outputPath = join(projectRoot, 'public', 'runtime-env.js');
+mkdirSync(dirname(outputPath), { recursive: true });
+writeFileSync(
+  outputPath,
+  `window.__BARDIOC_RUNTIME_ENV__ = ${JSON.stringify(runtimeEnv, null, 2)};\nwindow.__BARDIOC_DEV_AUTH__ = ${JSON.stringify(injectedDevAuth, null, 2)};\n`,
+  'utf8'
+);
+
+function readAppPort() {
+  const flagIndex = process.argv.indexOf('--app-port');
+  const raw = flagIndex >= 0 ? process.argv[flagIndex + 1] : undefined;
+  const parsed = Number.parseInt(raw ?? '{{PORT}}', 10);
+  return Number.isFinite(parsed) ? parsed : {{PORT}};
+}
+
+function loadEnv(projectDir) {
+  const result = {};
+
+  for (const fileName of ['.env', '.env.local']) {
+    const filePath = join(projectDir, fileName);
+
+    try {
+      Object.assign(result, parseEnv(readFileSync(filePath, 'utf8')));
+    } catch {
+      // Ignore missing env files.
+    }
+  }
+
+  return result;
+}
+
+function parseEnv(source) {
+  const result = {};
+
+  for (const rawLine of source.split(/\r?\n/)) {
+    const line = rawLine.trim();
+    if (!line || line.startsWith('#')) {
+      continue;
+    }
+
+    const equalsIndex = line.indexOf('=');
+    if (equalsIndex <= 0) {
+      continue;
+    }
+
+    const key = line.slice(0, equalsIndex).trim();
+    let value = line.slice(equalsIndex + 1).trim();
+
+    if (
+      (value.startsWith('"') && value.endsWith('"')) ||
+      (value.startsWith("'") && value.endsWith("'"))
+    ) {
+      value = value.slice(1, -1);
+    }
+
+    result[key] = value;
+  }
+
+  return result;
+}

package/templates/angular/src/app/app.component.ts

@@ -0,0 +1,181 @@
+import { isDevStandalone, isInsideIframe } from '@bardioc/app-sdk/dev';
+import { JsonPipe } from '@angular/common';
+import { Component, inject, signal } from '@angular/core';
+import { BARDIOC_BRIDGE } from './bardioc.token';
+import type { HostBridge } from '@bardioc/app-sdk';
+import { readRuntimeEnv } from '../runtime-env';
+
+type InjectedDevAuthConfig = {
+  hostUrl?: string;
+  sessionKey?: string;
+};
+
+function readInjectedDevAuthConfig(): InjectedDevAuthConfig | null {
+  const config = (globalThis as typeof globalThis & {
+    __BARDIOC_DEV_AUTH__?: InjectedDevAuthConfig;
+  }).__BARDIOC_DEV_AUTH__;
+
+  if (!config?.hostUrl || !config?.sessionKey) {
+    return null;
+  }
+
+  return {
+    hostUrl: config.hostUrl,
+    sessionKey: config.sessionKey,
+  };
+}
+
+type ResultState =
+  | { status: 'idle' }
+  | { status: 'loading'; request: string }
+  | { status: 'success'; request: string; data: unknown }
+  | { status: 'error'; request: string; message: string };
+
+@Component({
+  selector: 'app-root',
+  standalone: true,
+  imports: [JsonPipe],
+  template: `
+    <div class="bg-background text-foreground min-h-screen">
+      @if (showSdkDemo) {
+        <div class="mx-auto flex min-h-screen w-full max-w-3xl flex-col gap-3 p-4">
+          <div class="flex flex-col gap-1">
+            <h1 class="m-0 text-2xl font-semibold">Hello Bardioc App</h1>
+            <p class="text-muted-foreground m-0 text-xs leading-5">
+              Minimal hosted-app demo for API transport and SDK APIs.
+            </p>
+          </div>
+
+          <div class="flex flex-wrap gap-2">
+            <button
+              class="bg-primary text-primary-foreground hover:bg-primary/90 disabled:opacity-50 rounded px-3 py-1 text-xs font-medium disabled:cursor-not-allowed"
+              (click)="runGetProfile()"
+              [disabled]="running()">
+              Get Profile
+            </button>
+            <button
+              class="bg-primary text-primary-foreground hover:bg-primary/90 disabled:opacity-50 rounded px-3 py-1 text-xs font-medium disabled:cursor-not-allowed"
+              (click)="handleNotify()"
+              [disabled]="running()">
+              Send Notification OS
+            </button>
+            <button
+              class="border-border text-muted-foreground hover:text-foreground rounded border px-3 py-1 text-xs"
+              (click)="clearResult()"
+              [disabled]="running()">
+              Clear
+            </button>
+          </div>
+
+          <div class="border-border bg-background flex min-h-0 flex-1 flex-col overflow-hidden rounded border">
+            @switch (result().status) {
+              @case ('idle') {
+                <div class="text-muted-foreground flex h-full items-center justify-center p-3 text-center text-xs leading-5">
+                  Run a query to see results. If the host session is missing, the transport route will return 401.
+                </div>
+              }
+              @case ('loading') {
+                <div class="flex h-full flex-col items-center justify-center gap-2 p-3">
+                  <div class="text-muted-foreground font-mono text-xs">{{ resultRequest() }}</div>
+                  <div class="text-muted-foreground text-xs">Loading…</div>
+                </div>
+              }
+              @case ('error') {
+                <div class="flex h-full flex-col gap-2 p-3 text-xs">
+                  <div class="text-muted-foreground border-border border-b pb-2 font-mono text-xs">
+                    {{ resultRequest() }}
+                  </div>
+                  <div class="text-destructive whitespace-pre-wrap break-all">{{ resultMessage() }}</div>
+                </div>
+              }
+              @case ('success') {
+                <div class="flex h-full flex-col gap-0 overflow-hidden">
+                  <div class="border-border text-muted-foreground shrink-0 border-b px-3 py-1 font-mono text-xs">
+                    {{ resultRequest() }}
+                  </div>
+                  <pre class="text-foreground flex-1 overflow-auto p-3 text-[11px] leading-5">{{ resultData() | json }}</pre>
+                </div>
+              }
+            }
+          </div>
+        </div>
+      } @else {
+        <div class="mx-auto flex min-h-screen w-full max-w-3xl flex-col gap-4 p-4">
+          <h1 class="m-0 text-2xl font-semibold">Hello Bardioc App</h1>
+          <p class="text-muted-foreground m-0 max-w-2xl text-xs leading-5">
+            Open this app inside Bardioc OS to use transport requests and send host notifications.
+          </p>
+          <div class="border-border bg-muted/20 rounded-xl border p-3 text-xs leading-5">
+            Outside the host iframe this page is only a local preview shell.
+          </div>
+        </div>
+      }
+    </div>
+  `,
+})
+export class AppComponent {
+  private bridge = inject(BARDIOC_BRIDGE, { optional: true }) as HostBridge | null;
+  private injectedDevAuth = readInjectedDevAuthConfig();
+  
+  showSdkDemo =
+    isInsideIframe() ||
+    (readRuntimeEnv('VITE_ENABLE_DEV_AUTH') === 'true' &&
+      !!this.injectedDevAuth?.hostUrl &&
+      !!this.injectedDevAuth?.sessionKey &&
+      isDevStandalone());
+  result = signal<ResultState>({ status: 'idle' });
+  running = signal(false);
+
+  async runGetProfile(): Promise<void> {
+    if (this.running() || !this.bridge) return;
+    this.running.set(true);
+
+    const request = 'transport.os.profile.get()';
+    this.result.set({ status: 'loading', request });
+
+    const startTime = Date.now();
+    this.bridge.notify('Getting user profile', 'info');
+    
+    try {
+      const data = await this.bridge.transport.os.profile.get();
+      const duration = Date.now() - startTime;
+      this.bridge.notify(`Profile loaded (${duration}ms)`, 'success');
+      this.result.set({ status: 'success', request, data });
+    } catch (err) {
+      const message = err instanceof Error ? err.message : String(err);
+      this.bridge.notify(`Failed: ${message}`, 'error');
+      this.result.set({ status: 'error', request, message });
+    }
+
+    this.running.set(false);
+  }
+
+  handleNotify(): void {
+    if (!this.bridge) return;
+    this.bridge.notify('Hello from {{DISPLAY_NAME}}', 'info');
+    this.result.set({
+      status: 'success',
+      request: 'SDK_NOTIFY',
+      data: { ok: true, message: 'Notification sent to OS' },
+    });
+  }
+
+  clearResult(): void {
+    this.result.set({ status: 'idle' });
+  }
+
+  resultRequest(): string {
+    const state = this.result();
+    return 'request' in state ? state.request : '';
+  }
+
+  resultMessage(): string {
+    const state = this.result();
+    return 'message' in state ? state.message : '';
+  }
+
+  resultData(): unknown {
+    const state = this.result();
+    return 'data' in state ? state.data : null;
+  }
+}

package/templates/angular/src/app/bardioc-bridge.ts

@@ -0,0 +1,5 @@
+import { createHostBridge, type HostBridge } from '@bardioc/app-sdk';
+
+export function createBardiocBridge(appId: string): HostBridge {
+	return createHostBridge({ appId });
+}

package/templates/angular/src/app/bardioc.token.ts

@@ -0,0 +1,4 @@
+import { InjectionToken } from '@angular/core';
+import type { HostBridge } from '@bardioc/app-sdk';
+
+export const BARDIOC_BRIDGE = new InjectionToken<HostBridge>('BARDIOC_BRIDGE');

package/templates/angular/src/index.html

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en" class="dark" style="height: 100%; margin: 0">
+  <head>
+    <meta charset="utf-8" />
+    <title>{{DISPLAY_NAME}}</title>
+    <base href="/" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="icon" type="image/x-icon" href="favicon.ico" />
+    <link rel="stylesheet" href="/fonts/bardioc-fonts.css" />
+  </head>
+  <body style="height: 100%; margin: 0">
+    <script src="runtime-env.js"></script>
+    <app-root style="height: 100%"></app-root>
+  </body>
+</html>

package/templates/angular/src/main.ts

@@ -0,0 +1,82 @@
+import {
+  ensureDevAuthSession,
+  installDevBridge,
+  isDevStandalone,
+  isInsideIframe,
+} from '@bardioc/app-sdk/dev';
+import { bootstrapApplication } from '@angular/platform-browser';
+import { provideHttpClient } from '@angular/common/http';
+import { isDevMode, type EnvironmentProviders, type Provider } from '@angular/core';
+import { AppComponent } from './app/app.component';
+import { createBardiocBridge } from './app/bardioc-bridge';
+import { BARDIOC_BRIDGE } from './app/bardioc.token';
+import { readRuntimeEnv } from './runtime-env';
+import './styles.css';
+
+type InjectedDevAuthConfig = {
+  hostUrl?: string;
+  sessionKey?: string;
+  proxyUrl?: string;
+};
+
+function readInjectedDevAuthConfig(): InjectedDevAuthConfig | null {
+  const config = (globalThis as typeof globalThis & {
+    __BARDIOC_DEV_AUTH__?: InjectedDevAuthConfig;
+  }).__BARDIOC_DEV_AUTH__;
+
+  if (!config?.hostUrl || !config?.sessionKey) {
+    return null;
+  }
+
+  return {
+    hostUrl: config.hostUrl,
+    sessionKey: config.sessionKey,
+    proxyUrl: typeof config.proxyUrl === 'string' ? config.proxyUrl : undefined,
+  };
+}
+
+const APP_NAME = (readRuntimeEnv('VITE_APP_NAME') ?? document.title.trim()) || 'Bardioc App';
+const APP_ID = readRuntimeEnv('VITE_APP_ID');
+const injectedDevAuth = readInjectedDevAuthConfig();
+const standaloneDevAuthEnabled =
+  isDevMode() &&
+  readRuntimeEnv('VITE_ENABLE_DEV_AUTH') === 'true' &&
+  !!injectedDevAuth?.hostUrl &&
+  !!injectedDevAuth?.sessionKey;
+
+const insideIframe = isInsideIframe();
+const devStandalone = standaloneDevAuthEnabled && isDevStandalone();
+const useSdkProvider = insideIframe || devStandalone;
+
+if (useSdkProvider && !APP_ID) {
+  throw new Error('Missing VITE_APP_ID for SDK runtime');
+}
+
+async function bootstrap() {
+  if (devStandalone) {
+    await ensureDevAuthSession({ appId: APP_ID!, appName: APP_NAME });
+    installDevBridge({
+      appId: APP_ID!,
+      appName: APP_NAME,
+      debug: false,
+      proxyPath: injectedDevAuth?.proxyUrl,
+    });
+  }
+
+  const providers: Array<Provider | EnvironmentProviders> = [
+    provideHttpClient(),
+  ];
+
+  if (useSdkProvider) {
+    providers.push({
+      provide: BARDIOC_BRIDGE,
+      useValue: createBardiocBridge(APP_ID!),
+    });
+  }
+
+  bootstrapApplication(AppComponent, {
+    providers,
+  });
+}
+
+bootstrap();

package/templates/angular/src/runtime-env.ts

@@ -0,0 +1,17 @@
+type RuntimeEnv = Record<string, string | undefined>;
+
+declare global {
+  interface Window {
+    __BARDIOC_RUNTIME_ENV__?: RuntimeEnv;
+  }
+}
+
+export function readRuntimeEnv(name: string): string | undefined {
+  const value = window.__BARDIOC_RUNTIME_ENV__?.[name];
+  if (typeof value !== 'string') {
+    return undefined;
+  }
+
+  const trimmed = value.trim();
+  return trimmed.length > 0 ? trimmed : undefined;
+}