@kazzle/app 0.1.699 → 0.1.700

package/dist/index.d.ts

@@ -1,11 +1,3 @@
-export interface KazzleComponentRuntime {
-    /** Command to start the dev server (e.g. "bun run dev", "vite") */
-    dev?: string;
-    /** Command to build for production (e.g. "bun run build", "vite build") */
-    build?: string;
-    /** Command to start in production (e.g. "bun run start") */
-    run?: string;
-}
 export interface KazzleComponentEnv {
     /** Secret collection slug */
     collection: string;
@@ -14,6 +6,20 @@ export interface KazzleComponentEnv {
     /** Only inject these env var names. If omitted, inject all from collection+environment. */
     include?: string[];
 }
+export interface KazzleRuntimeMode {
+    /** Command to start the component in this mode (e.g. "bun run dev", "bun run start") */
+    command: string;
+    /** Command to build for this mode (used by production deploys, e.g. "bun run build") */
+    build?: string;
+    /** Mode-specific secret collection + environment. Falls back to the component env. */
+    env?: KazzleComponentEnv;
+}
+export interface KazzleComponentRuntime {
+    /** Local dev / preview runtime */
+    dev?: KazzleRuntimeMode;
+    /** Production runtime */
+    prod?: KazzleRuntimeMode;
+}
 /**
  * A single trigger entry on a process component. One component can declare
  * many triggers — for example, a daily cron AND a webhook handler that both
@@ -49,7 +55,9 @@ export interface KazzleComponent {
     type: 'ui' | 'process';
     /** Entry path within the app directory */
     path: string;
-    /** Commands for dev, build, and run phases */
+    /** Default secret collection + environment for env var injection. */
+    env?: KazzleComponentEnv;
+    /** Commands and optional env overrides for dev and production modes */
     runtime?: KazzleComponentRuntime;
     /**
      * Execution lifecycle for process components.
@@ -63,8 +71,6 @@ export interface KazzleComponent {
     processMode?: 'persistent' | 'triggered';
     /** Schedule and webhook triggers. One component may declare many. */
     triggers?: KazzleTrigger[];
-    /** Secret collection + environment for env var injection. */
-    env?: KazzleComponentEnv;
 }
 export interface KazzleSkill {
     /** Skill name */

package/dist/tools.d.ts

@@ -1,6 +1,61 @@
 import type { z } from 'zod';
 /** Zod schema for a tool's input object. Use .default(), .optional(), .transform(), etc. */
 export type KazzleToolInputSchema = z.ZodType<Record<string, unknown>>;
+export type ToolRequestMethod = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';
+export interface ToolRequestSpec {
+    method: ToolRequestMethod;
+    query?: Record<string, string>;
+    headers?: Record<string, string>;
+    body?: unknown;
+}
+export type KazzleTarget = ({
+    type: 'app';
+    component: string;
+    path: string;
+} & ToolRequestSpec) | ({
+    type: 'url';
+    url: string;
+} & ToolRequestSpec) | {
+    type: 'kazzle';
+    name: string;
+};
+export interface ToolInputButtonElement {
+    type: 'button';
+    id: string;
+    label: string;
+    input?: Record<string, unknown>;
+    target?: KazzleTarget;
+}
+export type ToolInputControlElement = {
+    type: 'text';
+    id: string;
+    label: string;
+    path: string;
+    required?: boolean;
+} | {
+    type: 'select';
+    id: string;
+    label: string;
+    path: string;
+    options: Array<{
+        label: string;
+        value: string;
+    }>;
+    required?: boolean;
+} | {
+    type: 'checkbox';
+    id: string;
+    label: string;
+    path: string;
+    required?: boolean;
+};
+export type ToolInputElement = ToolInputButtonElement | ToolInputControlElement;
+export interface KazzlePendingInput {
+    type: 'pending_input';
+    title: string;
+    description?: string;
+    elements: ToolInputElement[];
+}
 interface KazzleToolBase {
     /** Provider-safe identifier: letters, numbers, underscores, or hyphens. */
     name: string;
@@ -9,26 +64,29 @@ interface KazzleToolBase {
     /** AI-facing description for when to call this tool. */
     description: string;
 }
-/** A tool served by one of this app's own components. */
-export interface KazzleAppTool extends KazzleToolBase {
-    type: 'app';
+interface KazzleModeledToolBase extends KazzleToolBase {
     /** Zod schema for tool input. Use .default(), .optional(), .transform(), etc. here. */
     input: KazzleToolInputSchema;
-    /** Component name from kazzle.config.ts that serves this tool. */
-    component: string;
-    /** POST route on that component. */
-    path: string;
+    /** Addressing and HTTP request shape for dispatch. */
+    target: KazzleTarget;
+}
+/** A tool served by one of this app's own components. */
+export interface KazzleAppTool extends KazzleModeledToolBase {
+    target: Extract<KazzleTarget, {
+        type: 'app';
+    }>;
 }
 /** A tool served by an external publisher-hosted HTTP endpoint. */
-export interface KazzleUrlTool extends KazzleToolBase {
-    type: 'url';
-    input: KazzleToolInputSchema;
-    /** Literal absolute URL, used verbatim. */
-    url: string;
+export interface KazzleUrlTool extends KazzleModeledToolBase {
+    target: Extract<KazzleTarget, {
+        type: 'url';
+    }>;
 }
 /** A name-only reference to a platform/native tool resolved from the code registry. */
 export interface KazzleNativeTool extends KazzleToolBase {
-    type: 'kazzle';
+    target: Extract<KazzleTarget, {
+        type: 'kazzle';
+    }>;
 }
 export type KazzleTool = KazzleAppTool | KazzleUrlTool | KazzleNativeTool;
 /** Type-safe tools helper. Use: export const tools = defineTools([...]) */

package/dist/tools.js

@@ -14,7 +14,7 @@
 // Publish-time, the server compiles these Zod schemas into provider JSON schema
 // for model exposure AND server-side repair validation. That compiler is
 // server/apps/apps.skills.tools.ts — it reads the SAME shape defined here
-// (`type`, `name`, `displayName`, `description`, `input`, `component`/`path`/`url`).
+// (`name`, `displayName`, `description`, `input`, `target`).
 // If you change this contract, update that compiler and its tests together.
 /** Type-safe tools helper. Use: export const tools = defineTools([...]) */
 export function defineTools(tools) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kazzle/app",
-  "version": "0.1.699",
+  "version": "0.1.700",
   "description": "Contracts, tool helpers, Vite helper, and templates for building Kazzle apps.",
   "license": "UNLICENSED",
   "repository": {

package/templates/ai-app/kazzle.config.ts

@@ -4,6 +4,6 @@ export default defineConfig({
   icon: 'components/ui/public/favicon.svg',
   components: [
     { name: 'ui', type: 'ui', path: './components/ui' },
-    { name: 'server', type: 'process', path: './components/server/index.ts', runtime: { dev: 'bun run dev', run: 'bun run start' } },
+    { name: 'server', type: 'process', path: './components/server/index.ts', runtime: { dev: { command: 'bun run dev' }, prod: { command: 'bun run start' } } },
   ],
 });

package/templates/process-app/components/process/index.ts

@@ -109,14 +109,14 @@ const server = Bun.serve({
     // ── AI tool handlers (the "kitchen") ─────────────────────────────────
     //
     // Each tool declared in skills/tools/tools.ts is backed by a route here.
-    // When the AI calls `save_bookmark`, Kazzle POSTs { input } to this path
+    // When the AI calls `save_bookmark`, Kazzle POSTs the tool input to this path
     // with the app identity as `Authorization: Bearer <token>`. Return either
     // plain text or JSON { content } — that becomes the tool result the AI sees.
     //
     // To add a tool: add it to tools.ts (name + Zod input + path), then add
     // its matching `POST <path>` route below.
     if (req.method === 'POST' && url.pathname === '/tools/save-bookmark') {
-      const { input } = (await req.json().catch(() => ({}))) as { input?: unknown };
+      const input = await req.json().catch(() => ({}));
       const parsed = SaveBookmarkInput.safeParse(input);
       if (!parsed.success) {
         return Response.json({ content: parsed.error.issues.map(issue => issue.message).join('; ') }, { status: 400 });

package/templates/process-app/kazzle.config.ts

@@ -9,7 +9,7 @@ export default defineConfig({
       name: '{{APP_NAME}}',
       type: 'process',
       path: './components/process/index.ts',
-      runtime: { dev: 'bun run dev', run: 'bun run start' },
+      runtime: { dev: { command: 'bun run dev' }, prod: { command: 'bun run start' } },
       // Persistent processes are long-running servers. The platform posts
       // triggers into the running server at each trigger's `path` with
       // `Authorization: Bearer ${KAZZLE_TRIGGER_SECRET}`. Customer code

package/templates/process-app/skills/tools/tools.ts

@@ -8,12 +8,16 @@ export const SaveBookmarkInput = z.object({
 
 export const tools = [
   {
-    type: 'app',
     name: 'save_bookmark',
     displayName: 'Save bookmark',
     description: 'Save a bookmark URL and return a confirmation.',
-    component: '{{APP_NAME}}',
-    path: '/tools/save-bookmark',
     input: SaveBookmarkInput,
+    target: {
+      type: 'app',
+      component: '{{APP_NAME}}',
+      path: '/tools/save-bookmark',
+      method: 'POST',
+      body: '${input}',
+    },
   },
 ] as const satisfies readonly KazzleTool[];

package/templates/realtime-app/kazzle.config.ts

@@ -6,6 +6,6 @@ export default defineConfig({
   /** App components — each entry defines a deployable unit. Max 1 UI component. */
   components: [
     { name: 'ui', type: 'ui', path: './components/ui' },
-    { name: 'server', type: 'process', path: './components/server/index.ts', runtime: { dev: 'bun run dev', run: 'bun run start' } },
+    { name: 'server', type: 'process', path: './components/server/index.ts', runtime: { dev: { command: 'bun run dev' }, prod: { command: 'bun run start' } } },
   ],
 });

package/templates/ui-db-app/kazzle.config.ts

@@ -4,6 +4,6 @@ export default defineConfig({
   icon: 'components/ui/public/favicon.svg',
   components: [
     { name: 'ui', type: 'ui', path: './components/ui' },
-    { name: 'server', type: 'process', path: './components/server/index.ts', runtime: { dev: 'bun run dev', run: 'bun run start' } },
+    { name: 'server', type: 'process', path: './components/server/index.ts', runtime: { dev: { command: 'bun run dev' }, prod: { command: 'bun run start' } } },
   ],
 });