@bardioc/create-bardioc-app 0.4.0

package/templates/nextjs/app/proxy/route.ts

@@ -0,0 +1,85 @@
+import { NextRequest, NextResponse } from 'next/server';
+
+type ProxyPayload = {
+  path?: string;
+  method?: 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';
+  body?: unknown;
+  contentType?: string;
+  scopeId?: string | null;
+  scopePolicy?: 'none' | 'optional' | 'required';
+  sessionKey?: string;
+  hostUrl?: string;
+};
+
+const APP_ID = process.env.NEXT_PUBLIC_APP_ID?.trim();
+const DEV_AUTH_HOST_URL =
+  process.env.NEXT_PUBLIC_DEV_AUTH_HOST_URL?.trim() ?? process.env.DEV_AUTH_HOST_URL?.trim();
+const DEV_SESSION_KEY =
+  process.env.NEXT_PUBLIC_DEV_SESSION_KEY?.trim() ?? process.env.DEV_SESSION_KEY?.trim();
+
+export async function POST(request: NextRequest) {
+  const payload = (await request.json().catch(() => null)) as ProxyPayload | null;
+
+  if (!payload?.path) {
+    return NextResponse.json(
+      { error: 'invalid_payload' },
+      { status: 400, headers: noStoreHeaders() }
+    );
+  }
+
+  const hostUrl = payload.hostUrl ?? DEV_AUTH_HOST_URL;
+  const sessionKey = payload.sessionKey ?? DEV_SESSION_KEY;
+
+  if (!hostUrl || !sessionKey) {
+    return NextResponse.json(
+      { error: 'missing_dev_session' },
+      { status: 400, headers: noStoreHeaders() }
+    );
+  }
+
+  if (!APP_ID) {
+    return NextResponse.json(
+      { error: 'missing_app_id' },
+      { status: 500, headers: noStoreHeaders() }
+    );
+  }
+
+  try {
+    const transportResponse = await fetch(`${hostUrl.replace(/\/$/, '')}/api/transport`, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        'X-Dev-Session-Key': sessionKey,
+      },
+      body: JSON.stringify({
+        appId: APP_ID,
+        path: payload.path,
+        method: payload.method ?? 'GET',
+        body: payload.body,
+        contentType: payload.contentType,
+        scopePolicy: payload.scopePolicy,
+        scopeId: payload.scopeId ?? null,
+      }),
+      cache: 'no-store',
+    });
+
+    const responseText = await transportResponse.text();
+
+    return new NextResponse(responseText, {
+      status: transportResponse.status,
+      headers: {
+        'Cache-Control': 'no-store',
+        'Content-Type': transportResponse.headers.get('content-type') ?? 'application/json',
+      },
+    });
+  } catch {
+    return NextResponse.json(
+      { error: 'host_transport_failed' },
+      { status: 502, headers: noStoreHeaders() }
+    );
+  }
+}
+
+function noStoreHeaders(): HeadersInit {
+  return { 'Cache-Control': 'no-store' };
+}

package/templates/nextjs/global.d.ts

@@ -0,0 +1 @@
+declare module '*.css';

package/templates/nextjs/next-env.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

package/templates/nextjs/next.config.ts

@@ -0,0 +1,21 @@
+import type { NextConfig } from 'next';
+
+const nextConfig: NextConfig = {
+	output: 'export',
+	env: {
+		NEXT_PUBLIC_APP_NAME: process.env.NEXT_PUBLIC_APP_NAME ?? process.env.VITE_APP_NAME,
+		NEXT_PUBLIC_APP_ID: process.env.NEXT_PUBLIC_APP_ID ?? process.env.VITE_APP_ID,
+		NEXT_PUBLIC_ENABLE_DEV_AUTH:
+			process.env.NEXT_PUBLIC_ENABLE_DEV_AUTH ?? process.env.VITE_ENABLE_DEV_AUTH,
+		NEXT_PUBLIC_DEV_AUTH_HOST_URL:
+			process.env.NEXT_PUBLIC_DEV_AUTH_HOST_URL ?? process.env.DEV_AUTH_HOST_URL,
+		NEXT_PUBLIC_DEV_SESSION_KEY:
+			process.env.NEXT_PUBLIC_DEV_SESSION_KEY ?? process.env.DEV_SESSION_KEY,
+	},
+	images: {
+		unoptimized: true,
+	},
+	trailingSlash: true,
+};
+
+export default nextConfig;

package/templates/nextjs/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "{{APP_NAME}}",
+  "version": "0.0.1",
+  "private": true,
+  "scripts": {
+    "dev": "bardioc-dev-session -- next dev --port {{PORT}}",
+    "dev:live": "BARDIOC_TUNNEL=1 bardioc-dev-session -- next dev --port {{PORT}}",
+    "build": "next build && node scripts/stamp-manifest.mjs out",
+    "bundle": "next build && node scripts/stamp-manifest.mjs out && cd out && zip -r ../{{APP_NAME}}.zip .",
+    "start": "next start",
+    "check-types": "tsc --noEmit",
+    "changeset": "changeset",
+    "release:status": "changeset status --verbose",
+    "release:version": "changeset version && pnpm install --lockfile-only",
+    "release:publish": "changeset publish"
+  },
+  "dependencies": {
+    "@bardioc/app-sdk": "latest",
+    "next": "^15.3.2",
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5"
+  },
+  "devDependencies": {
+    "@changesets/cli": "^2.31.0",
+    "@tailwindcss/postcss": "^4.2.4",
+    "@types/node": "^22.10.0",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "tailwindcss": "^4.2.4",
+    "typescript": "^6.0.3"
+  }
+}

package/templates/nextjs/postcss.config.mjs

@@ -0,0 +1,5 @@
+export default {
+  plugins: {
+    '@tailwindcss/postcss': {},
+  },
+};

package/templates/nextjs/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/nextjs/tailwind.config.ts

@@ -0,0 +1,10 @@
+import type { Config } from 'tailwindcss';
+
+const config: Config = {
+  content: [
+    './app/**/*.{js,ts,jsx,tsx,mdx}',
+    './components/**/*.{js,ts,jsx,tsx,mdx}',
+  ],
+};
+
+export default config;

package/templates/nextjs/tsconfig.json

@@ -0,0 +1,27 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
+    "paths": {
+      "@/*": ["./*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}

package/templates/preact/.env.example

@@ -0,0 +1,13 @@
+# Hosted app slug used by local runtime/dev-auth wiring.
+VITE_APP_NAME={{APP_NAME}}
+
+# Get this from the BardiocOS AppStore after registering your app.
+# Required for token exchange
+VITE_APP_ID=your-app-client-id-here
+
+# Opt into the host-backed standalone dev session when running outside the host iframe.
+VITE_ENABLE_DEV_AUTH=false
+
+# Copy these from the host App Store app details via "Copy Dev Session".
+DEV_AUTH_HOST_URL=
+DEV_SESSION_KEY=

package/templates/preact/_gitignore

@@ -0,0 +1,9 @@
+node_modules/
+dist/
+coverage/
+.DS_Store
+.env
+.env.local
+.env.*.local
+*.tsbuildinfo
+.linked/

package/templates/preact/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en" class="dark" style="height: 100%; margin: 0">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>{{DISPLAY_NAME}}</title>
+    <link rel="stylesheet" href="/fonts/bardioc-fonts.css" />
+  </head>
+  <body style="height: 100%; margin: 0">
+    <div id="root" style="height: 100%"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

package/templates/preact/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "{{APP_NAME}}",
+  "version": "0.0.1",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "bardioc-dev-session -- vite",
+    "dev:live": "BARDIOC_TUNNEL=1 bardioc-dev-session -- vite",
+    "build": "tsc && vite build && node scripts/stamp-manifest.mjs dist",
+    "bundle": "tsc && vite build && node scripts/stamp-manifest.mjs dist && cd dist && zip -r ../{{APP_NAME}}.zip .",
+    "preview": "vite preview",
+    "check-types": "tsc --noEmit",
+    "changeset": "changeset",
+    "release:status": "changeset status --verbose",
+    "release:version": "changeset version && pnpm install --lockfile-only",
+    "release:publish": "changeset publish"
+  },
+  "dependencies": {
+    "@bardioc/app-sdk": "latest",
+    "preact": "^10.26.7"
+  },
+  "devDependencies": {
+    "@changesets/cli": "^2.31.0",
+    "@preact/preset-vite": "^2.10.1",
+    "@tailwindcss/vite": "^4.3.0",
+    "@types/node": "^22.19.19",
+    "preact-render-to-string": "^6.6.1",
+    "tailwindcss": "4.3.0",
+    "typescript": "6.0.3",
+    "vite": "8.0.13"
+  }
+}

package/templates/preact/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/preact/src/App.tsx

@@ -0,0 +1,139 @@
+import { isDevStandalone, isInsideIframe } from '@bardioc/app-sdk/dev';
+import { useSdk, useNotify } from '@bardioc/app-sdk/react';
+import { useState } from 'preact/hooks';
+
+type ResultState =
+  | { status: 'idle' }
+  | { status: 'loading'; request: string }
+  | { status: 'success'; request: string; data: unknown }
+  | { status: 'error'; request: string; message: string };
+
+function SdkDemo() {
+  const bridge = useSdk();
+  const notify = useNotify();
+  const [result, setResult] = useState<ResultState>({ status: 'idle' });
+  const [running, setRunning] = useState(false);
+
+  async function runGetProfile() {
+    if (running) return;
+    setRunning(true);
+
+    const request = 'transport.os.profile.get()';
+    setResult({ status: 'loading', request });
+
+    const startTime = Date.now();
+    notify('Getting user profile', 'info');
+
+    try {
+      const data = await bridge.transport.os.profile.get();
+
+      const duration = Date.now() - startTime;
+      notify(`Profile loaded (${duration}ms)`, 'success');
+      setResult({ status: 'success', request, data });
+    } catch (err) {
+      const message = err instanceof Error ? err.message : String(err);
+      notify(`Failed: ${message}`, 'error');
+      setResult({ status: 'error', request, message });
+    }
+
+    setRunning(false);
+  }
+
+  function handleNotify() {
+    notify('Hello from {{DISPLAY_NAME}}', 'info');
+    setResult({
+      status: 'success',
+      request: 'SDK_NOTIFY',
+      data: { ok: true, message: 'Notification sent to OS' },
+    });
+  }
+
+  return (
+    <div className="mx-auto flex min-h-screen w-full max-w-3xl flex-col gap-3 p-4">
+      <div className="flex flex-col gap-1">
+        <h1 className="m-0 text-2xl font-semibold">Hello Bardioc App</h1>
+        <p className="text-muted-foreground m-0 text-xs leading-5">
+          Minimal hosted-app demo for API transport and SDK APIs.
+        </p>
+      </div>
+
+      <div className="flex flex-wrap gap-2">
+        <button
+          className="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"
+          onClick={() => void runGetProfile()}
+          disabled={running}
+        >
+          Get Profile
+        </button>
+        <button
+          className="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"
+          onClick={handleNotify}
+          disabled={running}
+        >
+          Send Notification OS
+        </button>
+        <button
+          className="border-border text-muted-foreground hover:text-foreground rounded border px-3 py-1 text-xs"
+          onClick={() => setResult({ status: 'idle' })}
+          disabled={running}
+        >
+          Clear
+        </button>
+      </div>
+
+      <div className="border-border bg-background flex min-h-0 flex-1 flex-col overflow-hidden rounded border">
+        {result.status === 'idle' && (
+          <div className="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>
+        )}
+        {result.status === 'loading' && (
+          <div className="flex h-full flex-col items-center justify-center gap-2 p-3">
+            <div className="text-muted-foreground font-mono text-xs">{result.request}</div>
+            <div className="text-muted-foreground text-xs">Loading…</div>
+          </div>
+        )}
+        {result.status === 'error' && (
+          <div className="flex h-full flex-col gap-2 p-3 text-xs">
+            <div className="text-muted-foreground border-border border-b pb-2 font-mono text-xs">
+              {result.request}
+            </div>
+            <div className="text-destructive whitespace-pre-wrap break-all">{result.message}</div>
+          </div>
+        )}
+        {result.status === 'success' && (
+          <div className="flex h-full flex-col gap-0 overflow-hidden">
+            <div className="border-border text-muted-foreground shrink-0 border-b px-3 py-1 font-mono text-xs">
+              {result.request}
+            </div>
+            <pre className="text-foreground flex-1 overflow-auto p-3 text-[11px] leading-5">
+              {JSON.stringify(result.data, null, 2)}
+            </pre>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}
+
+export function App() {
+  const showSdkDemo = isInsideIframe() || (import.meta.env.VITE_ENABLE_DEV_AUTH === 'true' && isDevStandalone());
+
+  return (
+    <div className="bg-background text-foreground min-h-screen">
+      {showSdkDemo ? (
+        <SdkDemo />
+      ) : (
+        <div className="mx-auto flex min-h-screen w-full max-w-3xl flex-col gap-4 p-4">
+          <h1 className="m-0 text-2xl font-semibold">Hello Bardioc App</h1>
+          <p className="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 className="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>
+  );
+}

package/templates/preact/src/index.css

@@ -0,0 +1,76 @@
+@import 'tailwindcss';
+
+* {
+  box-sizing: border-box;
+}
+
+html,
+body,
+#root {
+  margin: 0;
+  padding: 0;
+  height: 100%;
+  width: 100%;
+  overflow: hidden;
+}
+
+:root {
+  --background: oklch(17.88% 0.0075 229.38);
+  --foreground: oklch(98.69% 0.0093 99.98);
+  --muted-foreground: oklch(86.03% 0.0056 95.11);
+  --border: oklch(1 0 0 / 10%);
+  --primary: oklch(97.02% 0 0);
+  --primary-foreground: oklch(36.94% 0.0053 236.64);
+  --destructive: oklch(68.04% 0.1386 21.38);
+  --ring: oklch(79.43% 0.0084 98.91);
+}
+
+body {
+  background: var(--background);
+  color: var(--foreground);
+  font-family: system-ui, -apple-system, sans-serif;
+}
+
+code {
+  font-family: inherit;
+}
+
+.bg-background {
+  background-color: var(--background);
+}
+
+.text-foreground {
+  color: var(--foreground);
+}
+
+.text-muted-foreground {
+  color: var(--muted-foreground);
+}
+
+.border-border {
+  border-color: var(--border);
+}
+
+.bg-primary {
+  background-color: var(--primary);
+}
+
+.text-primary-foreground {
+  color: var(--primary-foreground);
+}
+
+.text-destructive {
+  color: var(--destructive);
+}
+
+.focus\:ring-ring:focus {
+  --tw-ring-color: var(--ring);
+}
+
+.hover\:bg-primary\/90:hover {
+  background-color: oklch(from var(--primary) calc(l * 0.9) c h);
+}
+
+.hover\:text-foreground:hover {
+  color: var(--foreground);
+}

package/templates/preact/src/main.tsx

@@ -0,0 +1,46 @@
+import {
+  ensureDevAuthSession,
+  installDevBridge,
+  isDevStandalone,
+  isInsideIframe,
+} from '@bardioc/app-sdk/dev';
+import { AppSdkProvider } from '@bardioc/app-sdk/react';
+import { render } from 'preact';
+import { App } from './App';
+import './index.css';
+
+const APP_NAME = import.meta.env.VITE_APP_NAME?.trim();
+const APP_ID = import.meta.env.VITE_APP_ID?.trim();
+const standaloneDevAuthEnabled = import.meta.env.DEV && import.meta.env.VITE_ENABLE_DEV_AUTH === 'true';
+
+if (!APP_NAME) {
+  throw new Error('Missing VITE_APP_NAME for runtime');
+}
+
+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 });
+  }
+
+  render(
+    useSdkProvider ? (
+      <AppSdkProvider appId={APP_ID!}>
+        <App />
+      </AppSdkProvider>
+    ) : (
+      <App />
+    ),
+    document.getElementById('root')!
+  );
+}
+
+bootstrap();

package/templates/preact/src/vite-env.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="vite/client" />
+
+interface ImportMetaEnv {
+  readonly VITE_APP_NAME: string
+  readonly VITE_APP_ID: string
+  readonly VITE_ENABLE_DEV_AUTH?: string
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv
+}

package/templates/preact/tsconfig.json

@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "jsx": "react-jsx",
+    "jsxImportSource": "preact",
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true
+  },
+  "include": ["src"],
+  "exclude": ["node_modules", "dist"]
+}

package/templates/preact/vite.config.ts

@@ -0,0 +1,17 @@
+import { bardiocApp, bardiocDevAuth } from '@bardioc/app-sdk/vite';
+import preact from '@preact/preset-vite';
+import tailwindcss from '@tailwindcss/vite';
+import { defineConfig, loadEnv } from 'vite';
+
+export default defineConfig(({ mode }) => {
+  const env = loadEnv(mode, __dirname, '');
+  const appName = env.VITE_APP_NAME?.trim();
+
+  if (!appName) {
+    throw new Error('Missing VITE_APP_NAME for Vite config');
+  }
+
+  return {
+    plugins: [bardiocDevAuth({ appName }), preact(), bardiocApp({ appName, port: {{PORT}} }), tailwindcss()],
+  };
+});

package/templates/solid/.env.example

@@ -0,0 +1,13 @@
+# Hosted app slug used by local runtime/dev-auth wiring.
+VITE_APP_NAME={{APP_NAME}}
+
+# Get this from the BardiocOS AppStore after registering your app.
+# Required for token exchange
+VITE_APP_ID=your-app-client-id-here
+
+# Opt into the host-backed standalone dev session when running outside the host iframe.
+VITE_ENABLE_DEV_AUTH=false
+
+# Copy these from the host App Store app details via "Copy Dev Session".
+DEV_AUTH_HOST_URL=
+DEV_SESSION_KEY=

package/templates/solid/_gitignore

@@ -0,0 +1,9 @@
+node_modules/
+dist/
+coverage/
+.DS_Store
+.env
+.env.local
+.env.*.local
+*.tsbuildinfo
+.linked/

package/templates/solid/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en" class="dark" style="height: 100%; margin: 0">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>{{DISPLAY_NAME}}</title>
+    <link rel="stylesheet" href="/fonts/bardioc-fonts.css" />
+  </head>
+  <body style="height: 100%; margin: 0">
+    <div id="root" style="height: 100%"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>