@compilr-dev/sdk 0.17.4 → 0.17.6

package/dist/capabilities/packs.js

@@ -233,6 +233,16 @@ export const CAPABILITY_PACKS = {
         estimatedPromptTokens: 150,
         estimatedToolTokens: 1500,
     },
+    canvas: {
+        id: 'canvas',
+        label: 'Visual Canvas',
+        tools: ['canvas_write', 'canvas_edit', 'canvas_list', 'canvas_get', 'canvas_delete'],
+        readOnly: false,
+        promptModules: ['platform-tool-hints'],
+        promptSnippet: 'Visual canvases (infographic/carousel/board) rendered from sandboxed HTML/SVG. Create/replace with canvas_write (raw HTML only — host injects the CSP; inline <style>/<script> only, no network/remote assets; optional Tweaks controls manifest). EDIT via canvas_get (outline=true or startLine/maxLines) then canvas_edit (str_replace/append/prepend) — never re-send the whole document.',
+        estimatedPromptTokens: 150,
+        estimatedToolTokens: 1500,
+    },
     plans: {
         id: 'plans',
         label: 'Planning',
@@ -443,6 +453,7 @@ export const FORBIDDEN_PACK_SUGGESTIONS = {
     backlog_write: '$pm',
     backlog_read: '$pm',
     documents: '$pm',
+    canvas: '$default',
     plans: '$pm',
     search: '$arch',
     dependencies: '$arch',

package/dist/platform/tools/document-tools.js

@@ -48,6 +48,30 @@ const DOC_TYPE_ENUM = [
     'session-notes',
     'chapter',
 ];
+/**
+ * Structured-model doc types must be edited via their dedicated *_model_update
+ * tool (semantic operations + schema validation), NOT raw document writes/patches
+ * — which bypass validation and can corrupt the model (invalid JSON that then
+ * crashes/garbles the viewer). Reading a model as a document is fine.
+ */
+const MODEL_DOC_UPDATE_TOOL = {
+    'app-model': 'app_model_update',
+    'business-model': 'business_model_update',
+    'research-model': 'research_model_update',
+    'book-model': 'book_model_update',
+    'brand-model': 'brand_model_update',
+    'curriculum-model': 'curriculum_model_update',
+};
+/** Returns a guard message if `docType` is a structured model (else null). */
+function modelDocGuard(docType) {
+    const tool = MODEL_DOC_UPDATE_TOOL[docType];
+    if (!tool)
+        return null;
+    const kind = docType.replace('-model', '');
+    return (`"${docType}" is a structured model, not a free-form document. ` +
+        `Edit it with ${tool} (semantic operations, schema-validated) — a raw document write/patch would ` +
+        `bypass validation and can corrupt the model. Read it with ${kind}_model_get.`);
+}
 // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
 export function createDocumentTools(config) {
     const { context: ctx } = config;
@@ -82,6 +106,9 @@ export function createDocumentTools(config) {
         },
         execute: async (input) => {
             try {
+                const guard = modelDocGuard(input.doc_type);
+                if (guard)
+                    return createErrorResult(guard);
                 const projectId = input.project_id ?? ctx.currentProjectId;
                 if (!projectId) {
                     return createErrorResult('No project specified and no active project. Use project_get or /projects to select a project first.');
@@ -410,6 +437,9 @@ export function createDocumentTools(config) {
         },
         execute: async (input) => {
             try {
+                const guard = modelDocGuard(input.doc_type);
+                if (guard)
+                    return createErrorResult(guard);
                 const projectId = input.project_id ?? ctx.currentProjectId;
                 if (!projectId) {
                     return createErrorResult('No project specified and no active project. Use project_get or /projects to select a project first.');

package/dist/skills/canvas-skills.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Canvas Skills
+ *
+ * canvas — author and edit a visual canvas (infographic, carousel, or board)
+ * rendered from sandboxed HTML/SVG, optionally with live "Tweaks" controls.
+ */
+export declare const canvasSkill: import("@compilr-dev/agents").Skill;

package/dist/skills/canvas-skills.js

@@ -0,0 +1,59 @@
+/**
+ * Canvas Skills
+ *
+ * canvas — author and edit a visual canvas (infographic, carousel, or board)
+ * rendered from sandboxed HTML/SVG, optionally with live "Tweaks" controls.
+ */
+import { defineSkill } from '@compilr-dev/agents';
+// =============================================================================
+// /canvas — visual canvas authoring
+// =============================================================================
+export const canvasSkill = defineSkill({
+    name: 'canvas',
+    description: 'Author or edit a visual canvas — an infographic, a slide carousel, or an infinite board — rendered ' +
+        'from HTML/SVG in a sandboxed preview, optionally with live "Tweaks" controls the user can adjust. ' +
+        'Use when the user wants something visual: a diagram, poster, stat card, one-pager, slide deck, or ' +
+        'explainer graphic, rather than prose or a code file.',
+    tags: ['visual', 'canvas', 'design'],
+    prompt: `You are in CANVAS MODE. Your job is to produce a VISUAL artifact — a rendered HTML/SVG canvas — not prose and not a code file. The canvas renders in a sandboxed preview and can carry live "Tweaks" the user adjusts.
+
+## When to Use
+- The user wants something visual: infographic, poster, stat card, one-pager, diagram, explainer, slide deck.
+- The user says "make a canvas", "visualize this", "turn this into slides", "draw me a…".
+
+## When NOT to Use
+- They want prose (a doc, PRD, notes) → use the document tools / relevant writing skill.
+- They want real application code/files on disk → use write_file / build.
+- They want a data model → use the factory model tools.
+
+## Canvas types (pick one)
+- **infographic** — a single self-contained composition (poster / stat card / one-pager). Default when unsure.
+- **carousel** — multiple slide "sheets"; author each slide as a top-level \`<section data-sheet>…</section>\`.
+- **board** — an infinite 2D board of loosely-placed elements.
+
+## STEPS
+
+1. **Clarify only if needed.** If the request is concrete, go straight to authoring. If the subject or type is ambiguous, ask ONE short question (what should it show, or which type) — do not run a long interview.
+
+2. **Author the content with canvas_write** (type, title, html). This is the ONLY way to create a canvas — describing it in chat does nothing. Write raw HTML/SVG for the \`html\` field:
+   - Do NOT include \`<html>\`, \`<head>\`, \`<meta>\`, \`<!doctype>\`, or your own CSP — the host injects the sandbox and CSP. Just the body content + a \`<style>\` and optional \`<script>\`.
+   - 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>\`.
+
+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).
+   - Text binding: \`<span data-bind="param"></span>\` gets replaced with the value.
+   - Visibility: \`[data-show="param"]\` shows/hides based on a toggle.
+   - For computed updates, define \`window.applyParams(values)\` in a \`<script>\` and read \`values.param\`.
+   Give every canvas at least 2–4 sensible controls (accent color, a headline size slider, a toggle to show/hide a section) so the user has something to play with. Seed \`default\` values that match what you authored.
+
+4. **To EDIT an existing canvas, do NOT re-send the whole document.** First call \`canvas_get\` with \`outline=true\` (or a \`startLine\`/\`maxLines\` slice) to find the exact snippet, then \`canvas_edit\` with \`operation=str_replace\` (old_str must be unique — include surrounding context — or set replace_all=true), or append/prepend. Reserve \`canvas_write\` with \`canvas_id\` for a full intentional rewrite.
+
+5. **After writing, tell the user what you made in one line** and point them at the Tweaks they can adjust. The canvas opens in its own tab.
+
+## Rules
+- CALL THE TOOL. Do not describe the HTML you "would" write and stop — emit \`canvas_write\` with real content. A canvas only exists once the tool succeeds.
+- Keep \`html\` self-contained and within the sandbox limits above — anything that needs the network or same-origin will silently fail to render.
+- One canvas per request unless the user asks for several.`,
+});

package/dist/skills/platform-skills.d.ts

@@ -11,7 +11,8 @@ export { businessVisionSkill, marketAnalysisSkill, competitorAnalysisSkill, fina
 export { brandSetupSkill, contentStrategySkill, contentCalendarSkill, createContentSkill, contentReviewSkill, } from './content-skills.js';
 export { curriculumDesignSkill, lessonPlanSkill, assessmentDesignSkill, courseReviewSkill, } from './course-skills.js';
 export { bookOutlineSkill, characterDesignSkill, plotThreadsSkill, sceneBreakdownSkill, bookReviewSkill, } from './book-skills.js';
+export { canvasSkill } from './canvas-skills.js';
 /**
- * All platform-specific skills (34 total).
+ * All platform-specific skills (35 total).
  */
 export declare const platformSkills: Skill[];

package/dist/skills/platform-skills.js

@@ -16,6 +16,8 @@ export { brandSetupSkill, contentStrategySkill, contentCalendarSkill, createCont
 export { curriculumDesignSkill, lessonPlanSkill, assessmentDesignSkill, courseReviewSkill, } from './course-skills.js';
 // Book
 export { bookOutlineSkill, characterDesignSkill, plotThreadsSkill, sceneBreakdownSkill, bookReviewSkill, } from './book-skills.js';
+// Canvas (visual)
+export { canvasSkill } from './canvas-skills.js';
 // Import all for the aggregate array
 import { designSkill, sketchSkill, prdSkill, refineSkill, refineItemSkill, architectureSkill, sessionNotesSkill, buildSkill, scaffoldSkill, } from './software-skills.js';
 import { outlineSkill, literatureReviewSkill, draftSectionSkill, peerReviewSkill, researchScaffoldSkill, } from './research-skills.js';
@@ -23,8 +25,9 @@ import { businessVisionSkill, marketAnalysisSkill, competitorAnalysisSkill, fina
 import { brandSetupSkill, contentStrategySkill, contentCalendarSkill, createContentSkill, contentReviewSkill, } from './content-skills.js';
 import { curriculumDesignSkill, lessonPlanSkill, assessmentDesignSkill, courseReviewSkill, } from './course-skills.js';
 import { bookOutlineSkill, characterDesignSkill, plotThreadsSkill, sceneBreakdownSkill, bookReviewSkill, } from './book-skills.js';
+import { canvasSkill } from './canvas-skills.js';
 /**
- * All platform-specific skills (34 total).
+ * All platform-specific skills (35 total).
  */
 export const platformSkills = [
     // Software (9)
@@ -67,4 +70,6 @@ export const platformSkills = [
     plotThreadsSkill,
     sceneBreakdownSkill,
     bookReviewSkill,
+    // Canvas (1)
+    canvasSkill,
 ];

package/dist/team/tool-config.js

@@ -284,6 +284,14 @@ export const TOOL_GROUPS = {
         readOnly: false,
         tier: 'meta',
     },
+    canvas: {
+        label: 'Visual Canvas',
+        // Canvas tools are defined in @compilr-dev/sdk (createPlatformTools), not in
+        // the agents-lib TOOL_NAMES registry, so they are referenced by literal name.
+        tools: ['canvas_write', 'canvas_edit', 'canvas_list', 'canvas_get', 'canvas_delete'],
+        readOnly: false,
+        tier: 'meta',
+    },
     plans: {
         label: 'Planning',
         tools: [
@@ -514,6 +522,7 @@ export const TOOL_PROFILES = {
         'backlog_read',
         'backlog_write',
         'documents',
+        'canvas',
         'plans',
         'artifacts',
         'anchors',
@@ -553,6 +562,7 @@ export const TOOL_PROFILES = {
         'project',
         'search',
         'documents',
+        'canvas',
         'web',
         'factory_models',
     ],
@@ -608,6 +618,7 @@ export const TOOL_PROFILES = {
         'dependencies',
         'backlog_read',
         'documents',
+        'canvas',
         'plans',
         'artifacts',
         'anchors',
@@ -631,6 +642,7 @@ export const TOOL_PROFILES = {
         'backlog_read',
         'backlog_write',
         'documents',
+        'canvas',
         'plans',
         'artifacts',
         'anchors',
@@ -652,6 +664,7 @@ export const TOOL_PROFILES = {
         'backlog_read',
         'backlog_write',
         'documents',
+        'canvas',
         'artifacts',
         'anchors',
         'web',

package/package.json

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