@bardioc/create-bardioc-app 0.5.4 → 0.5.5

package/templates/vue/src/App.vue

@@ -67,14 +67,14 @@ function clearResult() {
 
         <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"
+            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"
             @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"
+            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"
             @click="handleNotify"
             :disabled="running"
           >
@@ -89,11 +89,20 @@ function clearResult() {
           </button>
         </div>
 
-        <div class="border-border bg-background flex min-h-0 flex-1 flex-col overflow-hidden rounded border">
-          <div v-if="result.status === 'idle'" 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
+          class="border-border bg-background flex min-h-0 flex-1 flex-col overflow-hidden rounded border"
+        >
+          <div
+            v-if="result.status === 'idle'"
+            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>
-          <div v-else-if="result.status === 'loading'" class="flex h-full flex-col items-center justify-center gap-2 p-3">
+          <div
+            v-else-if="result.status === 'loading'"
+            class="flex h-full flex-col items-center justify-center gap-2 p-3"
+          >
             <div class="text-muted-foreground font-mono text-xs">{{ result.request }}</div>
             <div class="text-muted-foreground text-xs">Loading…</div>
           </div>
@@ -103,11 +112,18 @@ function clearResult() {
             </div>
             <div class="text-destructive whitespace-pre-wrap break-all">{{ result.message }}</div>
           </div>
-          <div v-else-if="result.status === 'success'" 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">
+          <div
+            v-else-if="result.status === 'success'"
+            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"
+            >
               {{ result.request }}
             </div>
-            <pre class="text-foreground flex-1 overflow-auto p-3 text-[11px] leading-5">{{ JSON.stringify(result.data, null, 2) }}</pre>
+            <pre class="text-foreground flex-1 overflow-auto p-3 text-[11px] leading-5">{{
+              JSON.stringify(result.data, null, 2)
+            }}</pre>
           </div>
         </div>
       </div>

package/templates/vue/src/bardioc-sdk.ts

@@ -4,20 +4,20 @@ import { inject, type InjectionKey } from 'vue';
 export const BARDIOC_BRIDGE_KEY: InjectionKey<HostBridge> = Symbol('bardiocBridge');
 
 export function createAppSdkBridge(appId: string): HostBridge {
-	return createHostBridge({ appId });
+  return createHostBridge({ appId });
 }
 
 export function useBardiocBridge(): HostBridge {
-	const bridge = inject(BARDIOC_BRIDGE_KEY);
-	if (!bridge) {
-		throw new Error('useBardiocBridge() must be used after providing BARDIOC_BRIDGE_KEY');
-	}
-	return bridge;
+  const bridge = inject(BARDIOC_BRIDGE_KEY);
+  if (!bridge) {
+    throw new Error('useBardiocBridge() must be used after providing BARDIOC_BRIDGE_KEY');
+  }
+  return bridge;
 }
 
 export function useNotify() {
-	const bridge = useBardiocBridge();
-	return (message: string, level?: NotifyLevel) => {
-		bridge.notify(message, level);
-	};
-}
+  const bridge = useBardiocBridge();
+  return (message: string, level?: NotifyLevel) => {
+    bridge.notify(message, level);
+  };
+}

package/templates/vue/src/index.css

@@ -1,76 +1,79 @@
 @import 'tailwindcss';
 
 * {
-  box-sizing: border-box;
+    box-sizing: border-box;
 }
 
 html,
 body,
 #app {
-  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/vue/src/vite-env.d.ts

@@ -1,11 +1,11 @@
 /// <reference types="vite/client" />
 
 interface ImportMetaEnv {
-  readonly VITE_APP_NAME: string
+  readonly VITE_APP_NAME: string;
 }
 
 interface ImportMeta {
-  readonly env: ImportMetaEnv
+  readonly env: ImportMetaEnv;
 }
 
 declare module '*.vue' {