@bardioc/create-bardioc-app 0.5.4 → 0.5.6

package/templates/angular/src/styles.css

@@ -1,258 +1,262 @@
 * {
-  box-sizing: border-box;
+    box-sizing: border-box;
 }
 
 html,
 body,
 app-root {
-  margin: 0;
-  padding: 0;
-  height: 100%;
-  width: 100%;
-  overflow: hidden;
+    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);
+    --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;
+    background: var(--background);
+    color: var(--foreground);
+    font-family:
+        system-ui,
+        -apple-system,
+        sans-serif;
 }
 
 code {
-  font-family: inherit;
+    font-family: inherit;
 }
 
 .bg-background {
-  background-color: var(--background);
+    background-color: var(--background);
 }
 
 .text-foreground {
-  color: var(--foreground);
+    color: var(--foreground);
 }
 
 .text-muted-foreground {
-  color: var(--muted-foreground);
+    color: var(--muted-foreground);
 }
 
 .border-border {
-  border-color: var(--border);
+    border-color: var(--border);
 }
 
 .bg-primary {
-  background-color: var(--primary);
+    background-color: var(--primary);
 }
 
 .text-primary-foreground {
-  color: var(--primary-foreground);
+    color: var(--primary-foreground);
 }
 
 .text-destructive {
-  color: var(--destructive);
+    color: var(--destructive);
 }
 
 .focus\:ring-ring:focus {
-  --tw-ring-color: var(--ring);
+    --tw-ring-color: var(--ring);
 }
 
 .hover\:bg-primary\/90:hover {
-  background-color: oklch(from var(--primary) calc(l * 0.9) c h);
+    background-color: oklch(from var(--primary) calc(l * 0.9) c h);
 }
 
 .hover\:text-foreground:hover {
-  color: var(--foreground);
+    color: var(--foreground);
 }
 
 .mx-auto {
-  margin-left: auto;
-  margin-right: auto;
+    margin-left: auto;
+    margin-right: auto;
 }
 
 .m-0 {
-  margin: 0;
+    margin: 0;
 }
 
 .flex {
-  display: flex;
+    display: flex;
 }
 
 .min-h-0 {
-  min-height: 0;
+    min-height: 0;
 }
 
 .min-h-screen {
-  min-height: 100vh;
+    min-height: 100vh;
 }
 
 .h-full {
-  height: 100%;
+    height: 100%;
 }
 
 .w-full {
-  width: 100%;
+    width: 100%;
 }
 
 .max-w-2xl {
-  max-width: 42rem;
+    max-width: 42rem;
 }
 
 .max-w-3xl {
-  max-width: 48rem;
+    max-width: 48rem;
 }
 
 .shrink-0 {
-  flex-shrink: 0;
+    flex-shrink: 0;
 }
 
 .flex-1 {
-  flex: 1 1 0%;
+    flex: 1 1 0%;
 }
 
 .flex-col {
-  flex-direction: column;
+    flex-direction: column;
 }
 
 .flex-wrap {
-  flex-wrap: wrap;
+    flex-wrap: wrap;
 }
 
 .items-center {
-  align-items: center;
+    align-items: center;
 }
 
 .justify-center {
-  justify-content: center;
+    justify-content: center;
 }
 
 .gap-0 {
-  gap: 0;
+    gap: 0;
 }
 
 .gap-1 {
-  gap: 0.25rem;
+    gap: 0.25rem;
 }
 
 .gap-2 {
-  gap: 0.5rem;
+    gap: 0.5rem;
 }
 
 .gap-3 {
-  gap: 0.75rem;
+    gap: 0.75rem;
 }
 
 .gap-4 {
-  gap: 1rem;
+    gap: 1rem;
 }
 
 .overflow-hidden {
-  overflow: hidden;
+    overflow: hidden;
 }
 
 .overflow-auto {
-  overflow: auto;
+    overflow: auto;
 }
 
 .rounded {
-  border-radius: 0.25rem;
+    border-radius: 0.25rem;
 }
 
 .rounded-xl {
-  border-radius: 0.75rem;
+    border-radius: 0.75rem;
 }
 
 .border {
-  border-width: 1px;
-  border-style: solid;
+    border-width: 1px;
+    border-style: solid;
 }
 
 .border-b {
-  border-bottom-width: 1px;
-  border-bottom-style: solid;
+    border-bottom-width: 1px;
+    border-bottom-style: solid;
 }
 
 .p-3 {
-  padding: 0.75rem;
+    padding: 0.75rem;
 }
 
 .p-4 {
-  padding: 1rem;
+    padding: 1rem;
 }
 
 .px-3 {
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
+    padding-left: 0.75rem;
+    padding-right: 0.75rem;
 }
 
 .py-1 {
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
+    padding-top: 0.25rem;
+    padding-bottom: 0.25rem;
 }
 
 .pb-2 {
-  padding-bottom: 0.5rem;
+    padding-bottom: 0.5rem;
 }
 
 .text-center {
-  text-align: center;
+    text-align: center;
 }
 
 .text-2xl {
-  font-size: 1.5rem;
-  line-height: 2rem;
+    font-size: 1.5rem;
+    line-height: 2rem;
 }
 
 .text-xs {
-  font-size: 0.75rem;
-  line-height: 1rem;
+    font-size: 0.75rem;
+    line-height: 1rem;
 }
 
 .text-\[11px\] {
-  font-size: 11px;
+    font-size: 11px;
 }
 
 .font-medium {
-  font-weight: 500;
+    font-weight: 500;
 }
 
 .font-semibold {
-  font-weight: 600;
+    font-weight: 600;
 }
 
 .font-mono {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
-    'Courier New', monospace;
+    font-family:
+        ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
+        monospace;
 }
 
 .leading-5 {
-  line-height: 1.25rem;
+    line-height: 1.25rem;
 }
 
 .whitespace-pre-wrap {
-  white-space: pre-wrap;
+    white-space: pre-wrap;
 }
 
 .break-all {
-  word-break: break-all;
+    word-break: break-all;
 }
 
 .bg-muted\/20 {
-  background-color: oklch(from var(--muted-foreground) l c h / 0.2);
+    background-color: oklch(from var(--muted-foreground) l c h / 0.2);
 }
 
 .disabled\:opacity-50:disabled {
-  opacity: 0.5;
+    opacity: 0.5;
 }
 
 .disabled\:cursor-not-allowed:disabled {
-  cursor: not-allowed;
+    cursor: not-allowed;
 }

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

@@ -1,8 +1,8 @@
 interface ImportMetaEnv {
-	readonly DEV?: boolean;
-	readonly VITE_APP_NAME?: string;
+  readonly DEV?: boolean;
+  readonly VITE_APP_NAME?: string;
 }
 
 interface ImportMeta {
-	readonly env: ImportMetaEnv;
+  readonly env: ImportMetaEnv;
 }

package/templates/angular/tsconfig.json

@@ -7,6 +7,7 @@
     "noPropertyAccessFromIndexSignature": true,
     "noImplicitReturns": true,
     "noFallthroughCasesInSwitch": true,
+    "noUncheckedIndexedAccess": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
     "sourceMap": true,

package/templates/manifest.json

@@ -1,13 +1,5 @@
 {
   "schemaVersion": 1,
   "defaultTemplate": "vite",
-  "templates": [
-    "angular",
-    "nextjs",
-    "preact",
-    "solid",
-    "svelte",
-    "vite",
-    "vue"
-  ]
-}
+  "templates": ["angular", "nextjs", "preact", "solid", "svelte", "vite", "vue"]
+}

package/templates/nextjs/.env.example

@@ -1,7 +1,9 @@
+# Hosted app slug used by local runtime/dev-auth wiring.
 NEXT_PUBLIC_APP_NAME={{APP_NAME}}
 
-# Shared secret used for dev auth when proxying API requests through /rest.
+# Paste the dev secret from the BardiocOS AppStore after registering your app.
+# Used by the dev-auth proxy (scripts/dev-auth-proxy.mjs) to sign requests to the BFF.
 DEV_SECRET=
 
-# Base URL of the Bardioc API backend to proxy /rest requests to.
+# Base URL of the Bardioc BFF / backend-for-frontend (e.g. https://your-host).
 API_BASE_URL=

package/templates/nextjs/_gitignore

@@ -5,3 +5,4 @@ out
 node_modules
 *.zip
 .linked/
+.DS_Store

package/templates/nextjs/app/globals.css

@@ -1,75 +1,78 @@
 @import 'tailwindcss';
 
 * {
-  box-sizing: border-box;
+    box-sizing: border-box;
 }
 
 html,
 body {
-  margin: 0;
-  padding: 0;
-  height: 100%;
-  width: 100%;
-  overflow: hidden;
+    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);
+    --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;
+    background: var(--background);
+    color: var(--foreground);
+    font-family:
+        system-ui,
+        -apple-system,
+        sans-serif;
 }
 
 code {
-  font-family: inherit;
+    font-family: inherit;
 }
 
 .bg-background {
-  background-color: var(--background);
+    background-color: var(--background);
 }
 
 .text-foreground {
-  color: var(--foreground);
+    color: var(--foreground);
 }
 
 .text-muted-foreground {
-  color: var(--muted-foreground);
+    color: var(--muted-foreground);
 }
 
 .border-border {
-  border-color: var(--border);
+    border-color: var(--border);
 }
 
 .bg-primary {
-  background-color: var(--primary);
+    background-color: var(--primary);
 }
 
 .text-primary-foreground {
-  color: var(--primary-foreground);
+    color: var(--primary-foreground);
 }
 
 .text-destructive {
-  color: var(--destructive);
+    color: var(--destructive);
 }
 
 .focus\:ring-ring:focus {
-  --tw-ring-color: var(--ring);
+    --tw-ring-color: var(--ring);
 }
 
 .hover\:bg-primary\/90:hover {
-  background-color: oklch(from var(--primary) calc(l * 0.9) c h);
+    background-color: oklch(from var(--primary) calc(l * 0.9) c h);
 }
 
 .hover\:text-foreground:hover {
-  color: var(--foreground);
+    color: var(--foreground);
 }

package/templates/nextjs/app/layout.tsx

@@ -9,6 +9,8 @@ export default function RootLayout({ children }: Readonly<{ children: React.Reac
   return (
     <html lang="en" className="dark" style={{ height: '100%', margin: 0 }}>
       <head>
+        {/* Platform font contract — a fixed absolute URL the host serves, not a bundled asset. */}
+        {/* eslint-disable-next-line @next/next/no-css-tags */}
         <link rel="stylesheet" href="/fonts/bardioc-fonts.css" />
       </head>
       <body style={{ height: '100%', margin: 0 }}>{children}</body>

package/templates/nextjs/app/page.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { isInsideIframe, isDevStandalone, installDevBridge } from '@bardioc/app-sdk/dev';
+import { installDevBridge, isDevStandalone, isInsideIframe } from '@bardioc/app-sdk/dev';
 import { AppSdkProvider, useNotify, useSdk } from '@bardioc/app-sdk/react';
 import { useEffect, useState } from 'react';
 
@@ -12,6 +12,9 @@ type ResultState =
 
 const APP_NAME = process.env.NEXT_PUBLIC_APP_NAME?.trim();
 
+// scripts/dev-auth-proxy.mjs listens on the app port + 100 for standalone dev auth.
+const DEV_PROXY_PORT = Number('{{PORT}}') + 100;
+
 function SdkDemo() {
   const bridge = useSdk();
   const notify = useNotify();
@@ -63,14 +66,14 @@ function SdkDemo() {
 
       <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"
+          className="bg-primary text-primary-foreground hover:bg-primary/90 rounded px-3 py-1 text-xs font-medium disabled:cursor-not-allowed disabled:opacity-50"
           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"
+          className="bg-primary text-primary-foreground hover:bg-primary/90 rounded px-3 py-1 text-xs font-medium disabled:cursor-not-allowed disabled:opacity-50"
           onClick={handleNotify}
           disabled={running}
         >
@@ -103,7 +106,7 @@ function SdkDemo() {
             <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 className="text-destructive break-all whitespace-pre-wrap">{result.message}</div>
           </div>
         )}
         {result.status === 'success' && (
@@ -144,7 +147,7 @@ export default function Page() {
 
   useEffect(() => {
     if (isDevStandalone()) {
-      installDevBridge();
+      installDevBridge({ apiBaseUrl: `http://127.0.0.1:${DEV_PROXY_PORT}/rest` });
     }
   }, []);
 

package/templates/nextjs/eslint.config.mjs

@@ -0,0 +1,4 @@
+import { config } from '@bardioc/configs/eslint/next';
+
+// Static export output and Next's generated env types are not sources.
+export default [...config, { ignores: ['out/**', 'next-env.d.ts'] }];

package/templates/nextjs/global.d.ts

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

package/templates/nextjs/next.config.ts

@@ -1,32 +1,13 @@
 import type { NextConfig } from 'next';
 
-const apiBaseUrl = process.env.API_BASE_URL?.replace(/\/$/, '');
-const devSecret = process.env.DEV_SECRET;
-
+// Standalone dev auth lives in scripts/dev-auth-proxy.mjs (the SDK dev-auth proxy), not here:
+// the BFF needs Origin dropped and X-Requested-With stamped, which rewrites cannot do.
 const nextConfig: NextConfig = {
-	output: 'export',
-	images: {
-		unoptimized: true,
-	},
-	trailingSlash: true,
-	async headers() {
-		if (!devSecret) return [];
-		return [
-			{
-				source: '/rest/:path*',
-				headers: [{ key: 'X-Dev-Secret', value: devSecret }],
-			},
-		];
-	},
-	async rewrites() {
-		if (!apiBaseUrl) return [];
-		return [
-			{
-				source: '/rest/:path*',
-				destination: `${apiBaseUrl}/:path*`,
-			},
-		];
-	},
+  output: 'export',
+  images: {
+    unoptimized: true,
+  },
+  trailingSlash: true,
 };
 
 export default nextConfig;

package/templates/nextjs/package.json

@@ -3,29 +3,34 @@
   "version": "0.0.1",
   "private": true,
   "scripts": {
-    "dev": "next dev --port {{PORT}}",
-    "dev:live": "BARDIOC_TUNNEL=1 next dev --port {{PORT}}",
+    "dev": "node ./scripts/dev-auth-proxy.mjs & PROXY_PID=$!; next dev --port {{PORT}}; EXIT_CODE=$?; kill $PROXY_PID 2>/dev/null; exit $EXIT_CODE",
     "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",
+    "lint": "eslint .",
+    "format": "prettier --write .",
+    "format:check": "prettier --check .",
     "changeset": "changeset",
     "release:status": "changeset status --verbose",
     "release:version": "changeset version && npm install",
     "release:publish": "changeset publish"
   },
   "dependencies": {
-    "@bardioc/app-sdk": "latest",
+    "@bardioc/app-sdk": "^0.4.9",
     "next": "^15.3.2",
     "react": "^19.2.5",
     "react-dom": "^19.2.5"
   },
   "devDependencies": {
+    "@bardioc/configs": "^0.2.1",
     "@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",
+    "eslint": "^10.0.0",
+    "prettier": "^3.6.2",
     "tailwindcss": "^4.2.4",
     "typescript": "^6.0.3"
   }

package/templates/nextjs/prettier.config.mjs

@@ -0,0 +1 @@
+export { default } from '@bardioc/configs/prettier';

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

@@ -0,0 +1,17 @@
+#!/usr/bin/env node
+
+import { startDevAuthProxy } from '@bardioc/app-sdk/dev-proxy';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const projectDir = resolve(dirname(fileURLToPath(import.meta.url)), '..');
+
+// `next dev` cannot host the SDK Vite plugin, so the proxy runs beside it on the app
+// port + 100 — the same origin app/page.tsx points installDevBridge at.
+const server = await startDevAuthProxy({ projectDir, port: {{PORT}} + 100 });
+
+// Without DEV_SECRET / API_BASE_URL there is nothing to serve — exit and let the dev server run
+// on its own, matching how the SDK Vite plugin disables itself.
+if (!server) {
+  process.exit(0);
+}