@compilr-dev/sdk 0.17.6 → 0.17.7

package/dist/agent.js

@@ -100,6 +100,7 @@ class CompilrAgentImpl {
             model: config?.model,
             apiKey: config?.apiKey,
             extendedContext: config?.context?.extendedContext,
+            maxTokens: config?.maxTokens,
         });
         // Resolve preset — non-software projects get 'general' by default
         const defaultPreset = config?.projectCategory && config.projectCategory !== 'software' ? 'general' : 'coding';

package/dist/config.d.ts

@@ -199,6 +199,11 @@ export interface CompilrAgentConfig {
     model?: string;
     /** API key (uses env var if omitted) */
     apiKey?: string;
+    /** Default max OUTPUT tokens per LLM call. Providers default to 4096, which
+     *  truncates large single tool calls (e.g. authoring a full canvas) — raise
+     *  it for hosts that emit big tool payloads. Stays within the model's own
+     *  output limit; do not exceed it. */
+    maxTokens?: number;
     /** Preset to use. Default: 'coding' (or 'general' for non-software projectCategory) */
     preset?: 'coding' | 'general' | 'read-only' | 'none' | Preset;
     /** Project type category — determines default preset when preset is omitted */

package/dist/provider.d.ts

@@ -18,6 +18,9 @@ export declare function createProviderFromType(type: ProviderType, options?: {
     siteName?: string;
     estimateTokens?: (text: string) => number;
     extendedContext?: boolean;
+    /** Default max OUTPUT tokens per call. Providers default to 4096, which is
+     *  too low for large single tool calls (e.g. authoring a full canvas). */
+    maxTokens?: number;
 }): LLMProvider;
 /**
  * Resolve a provider from config.
@@ -28,4 +31,6 @@ export declare function resolveProvider(config?: {
     model?: string;
     apiKey?: string;
     extendedContext?: boolean;
+    /** Default max OUTPUT tokens per call (forwarded to the provider). */
+    maxTokens?: number;
 }): LLMProvider;

package/dist/provider.js

@@ -32,7 +32,7 @@ export function detectProviderFromEnv() {
  * Create an LLM provider from a provider type string.
  */
 export function createProviderFromType(type, options) {
-    const { model, apiKey, baseUrl, siteName, estimateTokens, extendedContext } = options ?? {};
+    const { model, apiKey, baseUrl, siteName, estimateTokens, extendedContext, maxTokens } = options ?? {};
     switch (type) {
         case 'claude':
             return createClaudeProvider({
@@ -40,26 +40,27 @@ export function createProviderFromType(type, options) {
                 apiKey,
                 estimateTokens,
                 enableExtendedContext: extendedContext,
+                maxTokens,
             });
         case 'openai':
-            return createOpenAIProvider({ model, apiKey, estimateTokens });
+            return createOpenAIProvider({ model, apiKey, estimateTokens, maxTokens });
         case 'gemini':
-            return createGeminiNativeProvider({ model, apiKey, estimateTokens });
+            return createGeminiNativeProvider({ model, apiKey, estimateTokens, maxTokens });
         case 'ollama':
-            return createOllamaProvider({ model, baseUrl, estimateTokens });
+            return createOllamaProvider({ model, baseUrl, estimateTokens, maxTokens });
         case 'together':
-            return createTogetherProvider({ model, apiKey, estimateTokens });
+            return createTogetherProvider({ model, apiKey, estimateTokens, maxTokens });
         case 'groq':
-            return createGroqProvider({ model, apiKey, estimateTokens });
+            return createGroqProvider({ model, apiKey, estimateTokens, maxTokens });
         case 'fireworks':
-            return createFireworksProvider({ model, apiKey, estimateTokens });
+            return createFireworksProvider({ model, apiKey, estimateTokens, maxTokens });
         case 'perplexity':
-            return createPerplexityProvider({ model, apiKey, estimateTokens });
+            return createPerplexityProvider({ model, apiKey, estimateTokens, maxTokens });
         case 'openrouter':
-            return createOpenRouterProvider({ model, apiKey, siteName, estimateTokens });
+            return createOpenRouterProvider({ model, apiKey, siteName, estimateTokens, maxTokens });
         case 'custom':
             // Custom endpoints use OpenAI-compatible format
-            return createOpenAIProvider({ model, apiKey, estimateTokens });
+            return createOpenAIProvider({ model, apiKey, estimateTokens, maxTokens });
     }
 }
 /**
@@ -77,6 +78,7 @@ export function resolveProvider(config) {
             model: config.model,
             apiKey: config.apiKey,
             extendedContext: config.extendedContext,
+            maxTokens: config.maxTokens,
         });
     }
     // Auto-detect from env
@@ -86,6 +88,7 @@ export function resolveProvider(config) {
             model: config?.model,
             apiKey: config?.apiKey,
             extendedContext: config?.extendedContext,
+            maxTokens: config?.maxTokens,
         });
     }
     throw new Error('No LLM provider configured. Either:\n' +

package/dist/skills/canvas-skills.js

@@ -40,6 +40,7 @@ export const canvasSkill = defineSkill({
    - The sandbox is \`allow-scripts\` with NO same-origin and CSP \`default-src 'none'; script-src 'unsafe-inline'; style-src 'unsafe-inline'; img-src data: blob:\`. So: inline \`<style>\`/\`<script>\` only, no external fonts/CSS/JS/network, no remote images (use inline SVG or data: URIs).
    - Make it look intentional: a clear grid, strong type scale, generous spacing, a small cohesive palette. Prefer inline SVG for shapes/charts/icons.
    - For a **carousel**, wrap each slide in \`<section data-sheet>…</section>\`.
+   - **Build in steps for anything rich — do NOT try to emit a huge HTML document in one canvas_write.** A single very large tool call can be truncated and silently dropped. Instead: first \`canvas_write\` a COMPACT version — the \`<style>\` block plus the overall structure and the first section or two. Then use \`canvas_edit\` (operation=append, or str_replace to fill placeholders) to add the remaining sections one at a time. Each call stays small and reliable, and the preview grows as you go.
 
 3. **Add a Tweaks controls manifest when it helps** (the \`controls\` argument). Each control is \`{ type, param, label, default, …type config }\` where type ∈ slider | number | toggle | select | color | text. Bind params in your HTML three ways:
    - CSS custom property: use \`var(--param)\` in your styles (the host sets \`--param\` on the root).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@compilr-dev/sdk",
-  "version": "0.17.6",
+  "version": "0.17.7",
   "description": "Universal agent runtime for building AI-powered applications",
   "type": "module",
   "main": "dist/index.js",