@bardioc/create-bardioc-app 0.5.4 → 0.5.6

package/templates/nextjs/tailwind.config.ts

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

package/templates/nextjs/tsconfig.json

@@ -1,23 +1,8 @@
 {
+  "extends": "@bardioc/configs/typescript/nextjs.json",
   "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"
-      }
-    ],
+    "declaration": false,
+    "declarationMap": false,
     "paths": {
       "@/*": ["./*"]
     }

package/templates/preact/eslint.config.mjs

@@ -0,0 +1,3 @@
+import { config } from '@bardioc/configs/eslint/vite-react';
+
+export default [...config];

package/templates/preact/index.html

@@ -1,5 +1,5 @@
-<!DOCTYPE html>
-<html lang="en" class="dark" style="height: 100%; margin: 0">
+<!doctype html>
+<html lang="en" class="dark" style="height: 100%; margin: 0; color-scheme: dark">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />

package/templates/preact/package.json

@@ -5,26 +5,31 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "dev:live": "BARDIOC_TUNNEL=1 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",
+    "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",
     "preact": "^10.26.7"
   },
   "devDependencies": {
+    "@bardioc/configs": "^0.2.1",
     "@changesets/cli": "^2.31.0",
-    "@preact/preset-vite": "^2.10.1",
+    "@preact/preset-vite": "^2.10.6",
     "@tailwindcss/vite": "^4.3.0",
     "@types/node": "^22.19.19",
+    "eslint": "^10.0.0",
     "preact-render-to-string": "^6.6.1",
+    "prettier": "^3.6.2",
     "tailwindcss": "4.3.0",
     "typescript": "6.0.3",
     "vite": "8.0.13"

package/templates/preact/prettier.config.mjs

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

package/templates/preact/src/App.tsx

@@ -1,5 +1,5 @@
 import { isDevStandalone, isInsideIframe } from '@bardioc/app-sdk/dev';
-import { useSdk, useNotify } from '@bardioc/app-sdk/react';
+import { useNotify, useSdk } from '@bardioc/app-sdk/react';
 import { useState } from 'preact/hooks';
 
 type ResultState =
@@ -59,14 +59,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}
         >
@@ -84,7 +84,8 @@ function SdkDemo() {
       <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.
+            Run a query to see results. If the host session is missing, the transport route will
+            return 401.
           </div>
         )}
         {result.status === 'loading' && (
@@ -98,7 +99,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' && (

package/templates/preact/src/index.css

@@ -1,76 +1,79 @@
 @import 'tailwindcss';
 
 * {
-  box-sizing: border-box;
+    box-sizing: border-box;
 }
 
 html,
 body,
 #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);
 }

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

@@ -1,9 +1,9 @@
 /// <reference types="vite/client" />
 
 interface ImportMetaEnv {
-  readonly VITE_APP_NAME: string
+  readonly VITE_APP_NAME: string;
 }
 
 interface ImportMeta {
-  readonly env: ImportMetaEnv
+  readonly env: ImportMetaEnv;
 }

package/templates/preact/tsconfig.json

@@ -1,18 +1,12 @@
 {
+  "extends": "@bardioc/configs/typescript/react-library.json",
   "compilerOptions": {
-    "target": "ES2022",
+    "declaration": false,
+    "declarationMap": false,
     "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
+    "jsxImportSource": "preact"
   },
   "include": ["src"],
   "exclude": ["node_modules", "dist"]

package/templates/preact/vite.config.ts

@@ -12,6 +12,11 @@ export default defineConfig(({ mode }) => {
   }
 
   return {
-    plugins: [bardiocDevAuth({ appName }), preact(), bardiocApp({ appName, port: {{PORT}} }), tailwindcss()],
+    plugins: [
+      bardiocDevAuth({ appName }),
+      preact(),
+      bardiocApp({ appName, port: {{PORT}} }),
+      tailwindcss(),
+    ],
   };
 });

package/templates/solid/eslint.config.mjs

@@ -0,0 +1,3 @@
+import { createBaseConfig } from '@bardioc/configs/eslint/base';
+
+export default [...createBaseConfig()];

package/templates/solid/index.html

@@ -1,5 +1,5 @@
-<!DOCTYPE html>
-<html lang="en" class="dark" style="height: 100%; margin: 0">
+<!doctype html>
+<html lang="en" class="dark" style="height: 100%; margin: 0; color-scheme: dark">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />

package/templates/solid/package.json

@@ -5,28 +5,32 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "dev:live": "BARDIOC_TUNNEL=1 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",
+    "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",
     "solid-js": "^1.9.7"
   },
   "devDependencies": {
+    "@bardioc/configs": "^0.2.1",
     "@changesets/cli": "^2.31.0",
     "@tailwindcss/vite": "^4.3.0",
     "@types/node": "^22.19.19",
-    "solid-devtools": "^0.33.0",
+    "eslint": "^10.0.0",
+    "prettier": "^3.6.2",
     "tailwindcss": "4.3.0",
     "typescript": "6.0.3",
     "vite": "8.0.13",
-    "vite-plugin-solid": "^2.11.6"
+    "vite-plugin-solid": "^2.11.14"
   }
 }

package/templates/solid/prettier.config.mjs

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

package/templates/solid/src/App.tsx

@@ -1,6 +1,6 @@
 import { isDevStandalone, isInsideIframe } from '@bardioc/app-sdk/dev';
 import { createSignal } from 'solid-js';
-import { useSdk, useNotify } from './bardioc-sdk';
+import { useNotify, useSdk } from './bardioc-sdk';
 
 type ResultState =
   | { status: 'idle' }
@@ -59,14 +59,14 @@ function SdkDemo() {
 
       <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"
-          onclick={runGetProfile}
+          class="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
-          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"
+          class="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()}
         >
@@ -87,7 +87,8 @@ function SdkDemo() {
           if (r.status === 'idle') {
             return (
               <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.
+                Run a query to see results. If the host session is missing, the transport route will
+                return 401.
               </div>
             );
           }
@@ -105,7 +106,7 @@ function SdkDemo() {
                 <div class="text-muted-foreground border-border border-b pb-2 font-mono text-xs">
                   {r.request}
                 </div>
-                <div class="text-destructive whitespace-pre-wrap break-all">{r.message}</div>
+                <div class="text-destructive break-all whitespace-pre-wrap">{r.message}</div>
               </div>
             );
           }

package/templates/solid/src/bardioc-sdk.tsx

@@ -4,30 +4,30 @@ import { createContext, onCleanup, onMount, useContext, type JSX } from 'solid-j
 const BardiocContext = createContext<HostBridge>();
 
 export function AppSdkProvider(props: { appId: string; children: JSX.Element }) {
-	const bridge = createHostBridge({ appId: props.appId });
+  const bridge = createHostBridge({ appId: props.appId });
 
-	onMount(() => {
-		void bridge.connect();
-	});
+  onMount(() => {
+    void bridge.connect();
+  });
 
-	onCleanup(() => {
-		bridge.destroy();
-	});
+  onCleanup(() => {
+    bridge.destroy();
+  });
 
-	return <BardiocContext.Provider value={bridge}>{props.children}</BardiocContext.Provider>;
+  return <BardiocContext.Provider value={bridge}>{props.children}</BardiocContext.Provider>;
 }
 
 export function useSdk(): HostBridge {
-	const bridge = useContext(BardiocContext);
-	if (!bridge) {
-		throw new Error('useSdk() must be used inside AppSdkProvider');
-	}
-	return bridge;
+  const bridge = useContext(BardiocContext);
+  if (!bridge) {
+    throw new Error('useSdk() must be used inside AppSdkProvider');
+  }
+  return bridge;
 }
 
 export function useNotify() {
-	const bridge = useSdk();
-	return (message: string, level?: NotifyLevel) => {
-		bridge.notify(message, level);
-	};
-}
+  const bridge = useSdk();
+  return (message: string, level?: NotifyLevel) => {
+    bridge.notify(message, level);
+  };
+}

package/templates/solid/src/index.css

@@ -1,76 +1,79 @@
 @import 'tailwindcss';
 
 * {
-  box-sizing: border-box;
+    box-sizing: border-box;
 }
 
 html,
 body,
 #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);
 }

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

@@ -1,9 +1,9 @@
 /// <reference types="vite/client" />
 
 interface ImportMetaEnv {
-  readonly VITE_APP_NAME: string
+  readonly VITE_APP_NAME: string;
 }
 
 interface ImportMeta {
-  readonly env: ImportMetaEnv
+  readonly env: ImportMetaEnv;
 }

package/templates/solid/tsconfig.json

@@ -1,18 +1,13 @@
 {
+  "extends": "@bardioc/configs/typescript/base.json",
   "compilerOptions": {
-    "target": "ES2022",
+    "declaration": false,
+    "declarationMap": false,
     "module": "ESNext",
     "moduleResolution": "Bundler",
-    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "noEmit": true,
     "jsx": "preserve",
     "jsxImportSource": "solid-js",
-    "strict": true,
-    "noEmit": true,
-    "esModuleInterop": true,
-    "skipLibCheck": true,
-    "forceConsistentCasingInFileNames": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
     "types": ["vite/client"]
   },
   "include": ["src"],

package/templates/solid/vite.config.ts

@@ -1,7 +1,7 @@
 import { bardiocApp, bardiocDevAuth } from '@bardioc/app-sdk/vite';
 import tailwindcss from '@tailwindcss/vite';
-import solid from 'vite-plugin-solid';
 import { defineConfig, loadEnv } from 'vite';
+import solid from 'vite-plugin-solid';
 
 export default defineConfig(({ mode }) => {
   const env = loadEnv(mode, __dirname, '');
@@ -12,6 +12,11 @@ export default defineConfig(({ mode }) => {
   }
 
   return {
-    plugins: [bardiocDevAuth({ appName }), solid(), bardiocApp({ appName, port: {{PORT}} }), tailwindcss()],
+    plugins: [
+      bardiocDevAuth({ appName }),
+      solid(),
+      bardiocApp({ appName, port: {{PORT}} }),
+      tailwindcss(),
+    ],
   };
 });

package/templates/svelte/_gitignore

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

package/templates/svelte/eslint.config.mjs

@@ -0,0 +1,3 @@
+import { createBaseConfig } from '@bardioc/configs/eslint/base';
+
+export default [...createBaseConfig()];

package/templates/svelte/index.html

@@ -1,5 +1,5 @@
-<!DOCTYPE html>
-<html lang="en" class="dark" style="height: 100%; margin: 0">
+<!doctype html>
+<html lang="en" class="dark" style="height: 100%; margin: 0; color-scheme: dark">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />