@synergenius/flow-weaver-pack-weaver 0.9.134 → 0.9.136

package/dist/ui/profile-editor.js

@@ -207,6 +207,205 @@ var BOT_COLORS = [
   { label: "Info", token: "color-status-info" }
 ];
 
+// src/bot/operations.ts
+var OP_WRITE_FILE = "write_file";
+var OP_READ_FILE = "read_file";
+var OP_PATCH_FILE = "patch_file";
+var OP_LIST_FILES = "list_files";
+var OP_RUN_SHELL = "run_shell";
+var OP_VALIDATE = "validate";
+var OP_TSC_CHECK = "tsc_check";
+var OP_RUN_TESTS = "run_tests";
+var OP_TASK_CREATE = "task_create";
+
+// src/bot/capability-registry.ts
+var CAP_CORE = {
+  name: "core",
+  description: "Bot identity, structured plan output format, and safety rules. Always loaded.",
+  prompt: `You are Weaver, an expert AI companion for Flow Weaver workflows.
+
+## Plan Format
+Your plans MUST be structured JSON with concrete steps.
+Each step has: operation (tool name), description (what it does), args (complete arguments).
+Do NOT describe what you would do \u2014 actually do it by calling tools.
+
+## Safety Rules
+- Writes that shrink a file by >50% or write empty content are automatically BLOCKED.
+- Blocked shell commands: rm -rf, git push, npm publish, sudo, curl|sh.
+- Always validate BEFORE and AFTER patching.
+- Always read a file before patching it (you need exact strings for find/replace).
+- Use patch_file for modifications, write_file only for new files.
+- Be concise \u2014 let tool results speak.`
+};
+var CAP_FILE_OPS = {
+  name: "file-ops",
+  description: "File read/write/patch operations and best practices for file manipulation.",
+  tools: [OP_READ_FILE, OP_WRITE_FILE, OP_PATCH_FILE, OP_LIST_FILES],
+  prompt: `## File Operations
+- read_file: Read a file and return its content. args: { file }
+- write_file: Write a file. args: { file, content }. Content must be the COMPLETE file.
+- patch_file: Surgical find-and-replace edits. args: { file, patches: [{ find: "old text", replace: "new text" }] }. PREFERRED for modifying existing files.
+- list_files: List files in a directory. args: { directory, pattern? } (pattern is regex)
+
+## Best Practices
+PREFER patch_file over write_file for modifying existing files (surgical edits, no truncation risk).
+Use read_file to understand a file before modifying it.
+Use list_files to discover project structure.
+Writes that shrink a file by >50% or write empty content are automatically BLOCKED.`
+};
+var CAP_SHELL = {
+  name: "shell",
+  description: "Shell command execution for running tests, builds, and inspecting output.",
+  tools: [OP_RUN_SHELL, OP_VALIDATE, OP_TSC_CHECK, OP_RUN_TESTS],
+  prompt: `## Shell Commands
+- run_shell: Execute a shell command and return output. args: { command }
+  Use for: npx vitest, git status, grep, find, etc.
+  Examples: { "command": "npx vitest run --reporter verbose" }, { "command": "npx flow-weaver validate src/workflow.ts --json" }
+  Blocked: rm -rf, git push, npm publish, sudo, curl|sh (safety policy).
+Use run_shell for running tests (npx vitest), validation (flow-weaver validate), and inspecting output.`
+};
+var CAP_TASK_MGMT = {
+  name: "task-mgmt",
+  description: "Create and manage swarm subtasks for parallel execution.",
+  tools: [OP_TASK_CREATE],
+  prompt: `## Task Management
+- task_create: Create swarm subtasks for parallel execution. args: { title, description, complexity, subtasks[] }
+- task_list, task_get, task_update: Query and update existing tasks
+
+Use task_create to decompose complex work into smaller, independent subtasks that other bots can execute in parallel.`
+};
+var CAP_FW_GRAMMAR = {
+  name: "fw-grammar",
+  description: "Flow Weaver annotation syntax, node types, workflows, patterns, and data flow.",
+  prompt: `## Core Mental Model
+
+The code IS the workflow. Flow Weaver workflows are plain TypeScript files with JSDoc annotations above functions. The compiler reads annotations and generates deterministic execution code between @flow-weaver-body-start/end markers. Compiled code is standalone with no runtime dependency on flow-weaver.
+
+Three block types:
+- @flowWeaver nodeType: A reusable function (node) with typed inputs/outputs
+- @flowWeaver workflow: A DAG orchestration that wires node instances together
+- @flowWeaver pattern: A reusable fragment with boundary ports (IN/OUT instead of Start/Exit)
+
+## Node Execution Model
+
+Expression nodes (@expression):
+- No execute/onSuccess/onFailure params. Just inputs and return value.
+- throw = failure path, return = success path
+- Synchronous. Use execSync for shell commands.
+- Preferred for deterministic operations.
+
+Standard nodes:
+- execute: boolean param gates execution
+- Return { onSuccess: boolean, onFailure: boolean, ...outputs }
+- Can be async for I/O operations
+
+Async agent nodes:
+- Use (globalThis as any).__fw_agent_channel__ to pause workflow
+- Call channel.request({ agentId, context, prompt }) which returns a Promise
+- Workflow suspends until agent responds
+- NOT @expression (must be async)
+
+Pass-through pattern:
+- FW auto-connects ports by matching names on adjacent nodes
+- To forward data through intermediate nodes, declare it as both @input and @output with the same name
+- For non-adjacent wiring, use @connect sourceNode.port -> targetNode.port
+
+Data flow:
+- @path A -> B -> C: Linear execution path (sugar for multiple @connect)
+- @autoConnect: Auto-wire all nodes in declaration order
+- @connect: Explicit port-to-port wiring
+- Merge strategies for fan-in: FIRST, LAST, COLLECT, MERGE, CONCAT`
+};
+var CAP_FW_VALIDATE = {
+  name: "fw-validate",
+  description: "Flow Weaver validation error codes and common fix patterns.",
+  prompt: `## Validation Errors
+
+When you encounter validation errors, suggest the specific fix. Common resolutions:
+- UNKNOWN_NODE_TYPE: Ensure the referenced function has @flowWeaver nodeType annotation
+- MISSING_REQUIRED_INPUT: Add a @connect from a source port or make the input optional with [brackets]
+- UNKNOWN_SOURCE_PORT / UNKNOWN_TARGET_PORT: Check port name spelling in @connect
+- CYCLE_DETECTED: Break the cycle; use scoped iteration (@scope, @map) instead of circular dependencies`
+};
+var CAP_FW_GENESIS = {
+  name: "fw-genesis",
+  description: "Flow Weaver genesis protocol for self-evolving workflows.",
+  prompt: `## Genesis Protocol
+
+Genesis is a 17-step self-evolving workflow engine:
+1. Load config 2. Observe project 3. Load task workflow 4. Diff fingerprint
+5. Check stabilize mode 6. Wait for agent 7. Propose evolution 8. Validate proposal
+9. Snapshot for rollback 10. Apply changes 11. Compile and validate
+12. Diff workflow 13. Check approval threshold 14. Wait for approval
+15. Commit or rollback 16. Update history 17. Report summary
+
+When stabilize mode is active, only fix-up operations are allowed.`
+};
+var CAP_FW_CLI = {
+  name: "fw-cli",
+  description: "Flow Weaver CLI command reference for compile, validate, diagram, and other operations.",
+  prompt: `## CLI Commands
+
+Note: compile, validate, modify, diff, diagram, and describe operations are available as direct plan steps (no CLI needed).`
+};
+var CAP_CODE_REVIEW = {
+  name: "code-review",
+  description: "Code review guidelines, quality checklist, and security review patterns.",
+  prompt: `## Code Review
+
+When reviewing code, check for:
+1. Correctness: Does the code do what the task asked?
+2. Security: No hardcoded secrets, no injection vulnerabilities, no exposed APIs
+3. Style: Consistent with project conventions, proper naming, no dead code
+4. Testing: Are there tests? Do they cover edge cases?
+5. Performance: No unnecessary loops, no blocking calls in async code
+
+Report concerns with specific file:line references and suggested fixes.`
+};
+var CAP_WEB = {
+  name: "web",
+  description: "Web fetch capability for fetching URLs and external resources.",
+  tools: ["web_fetch"],
+  prompt: `## Web
+- web_fetch(url): Fetch a URL and return its content. Use for API docs, examples, etc.`
+};
+var CAP_CONTEXT = {
+  name: "context",
+  description: "Project file listings, directory structure, and workspace context.",
+  prompt: `## Project Context
+
+Use list_files to understand the project structure before making changes.
+The context bundle (when available) provides a snapshot of the workspace.`
+};
+var BUILT_IN_CAPABILITIES = [
+  CAP_CORE,
+  CAP_FILE_OPS,
+  CAP_SHELL,
+  CAP_TASK_MGMT,
+  CAP_FW_GRAMMAR,
+  CAP_FW_VALIDATE,
+  CAP_FW_GENESIS,
+  CAP_FW_CLI,
+  CAP_CODE_REVIEW,
+  CAP_WEB,
+  CAP_CONTEXT
+];
+var capabilityMap = new Map(
+  BUILT_IN_CAPABILITIES.map((c) => [c.name, c])
+);
+
+// src/bot/behavior-defaults.ts
+var STRATEGY_CAPABILITIES = {
+  frugal: ["core", "file-ops", "shell", "context"],
+  balanced: ["core", "file-ops", "shell", "task-mgmt", "fw-grammar", "fw-validate", "context"],
+  performance: ["core", "file-ops", "shell", "task-mgmt", "fw-grammar", "fw-validate", "fw-genesis", "fw-cli", "code-review", "web", "context"]
+};
+var STRATEGY_BUDGETS = {
+  frugal: 0.1,
+  balanced: 0.5,
+  performance: 1
+};
+
 // src/ui/profile-editor.tsx
 var React = require("react");
 var { useState, useEffect, useCallback } = React;
@@ -227,6 +426,7 @@ var {
   Switch,
   ToggleGroup,
   CollapsibleSection,
+  ScrollArea,
   toast,
   usePackWorkspace
 } = require("@fw/plugin-ui-kit");
@@ -286,6 +486,8 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
   const [capDescription, setCapDescription] = useState("");
   const [instructions, setInstructions] = useState("");
   const [requireApproval, setRequireApproval] = useState(false);
+  const [knowledgeCaps, setKnowledgeCaps] = useState(() => [...STRATEGY_CAPABILITIES.balanced]);
+  const [budget, setBudget] = useState(STRATEGY_BUDGETS.balanced);
   const [behavior, setBehavior] = useState(defaultBehaviorForStrategy("balanced"));
   const [blockedInput, setBlockedInput] = useState("");
   const [allowedInput, setAllowedInput] = useState("");
@@ -297,6 +499,8 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
     if (p !== "custom") {
       setCostStrategy(p);
       setBehavior(defaultBehaviorForStrategy(p));
+      setKnowledgeCaps([...STRATEGY_CAPABILITIES[p]]);
+      setBudget(STRATEGY_BUDGETS[p]);
     }
   }, []);
   const updatePhase = useCallback((phase, field, value) => {
@@ -338,6 +542,22 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
         );
         setInstructions(prefs.instructions || "");
         setRequireApproval(!!prefs.requireApproval);
+        if (prefs.behavior) {
+          const b = prefs.behavior;
+          if (Array.isArray(b.capabilities)) {
+            setKnowledgeCaps(b.capabilities);
+          } else {
+            setKnowledgeCaps([...STRATEGY_CAPABILITIES[strat]]);
+          }
+          if (typeof b.budget === "number") {
+            setBudget(b.budget);
+          } else {
+            setBudget(STRATEGY_BUDGETS[strat]);
+          }
+        } else {
+          setKnowledgeCaps([...STRATEGY_CAPABILITIES[strat]]);
+          setBudget(STRATEGY_BUDGETS[strat]);
+        }
         if (prefs.behavior) {
           const b = prefs.behavior;
           const phases = b.phases;
@@ -382,6 +602,13 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
   const handleRemoveCapability = useCallback((index) => {
     setCapabilities((prev) => prev.filter((_, i) => i !== index));
   }, []);
+  const handleToggleKnowledgeCap = useCallback((capName2) => {
+    setKnowledgeCaps((prev) => {
+      if (capName2 === "core") return prev;
+      return prev.includes(capName2) ? prev.filter((n) => n !== capName2) : [...prev, capName2];
+    });
+    setPreset("custom");
+  }, []);
   const handleAddScopePath = useCallback((type) => {
     const input = type === "blocked" ? blockedInput : allowedInput;
     const trimmed = input.trim();
@@ -422,6 +649,8 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
       }
     }
     const behaviorPayload = {
+      capabilities: knowledgeCaps,
+      budget,
       phases,
       escalation: { maxAttempts: behavior.maxAttempts, onExhausted: behavior.onExhausted },
       scope: behavior.blockedPaths.length > 0 || behavior.allowedPaths.length > 0 ? {
@@ -467,7 +696,7 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
     } catch (err) {
       toast(err instanceof Error ? err.message : `Failed to ${mode} profile`, { type: "error" });
     }
-  }, [mode, profileId, name, description, botId, icon, color, costStrategy, capabilities, instructions, requireApproval, behavior, callTool, onSave]);
+  }, [mode, profileId, name, description, botId, icon, color, costStrategy, capabilities, knowledgeCaps, budget, instructions, requireApproval, behavior, callTool, onSave]);
   const handleDelete = useCallback(async () => {
     if (!profileId) return;
     const ok = await ctx.confirm("Are you sure you want to delete this profile?", {
@@ -571,361 +800,431 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
     ),
     // ── Scrollable form body ──
     React.createElement(
-      Flex,
+      ScrollArea,
       {
-        variant: "column-stretch-start-nowrap-10",
-        style: { flex: 1, minHeight: 0, overflow: "auto", padding: "12px 16px" }
+        style: { flex: 1, minHeight: 0 }
       },
-      // ── Name ──
       React.createElement(
-        Field,
-        { label: "Name" },
-        React.createElement(Input, {
-          type: "text",
-          size: "small",
-          placeholder: "Profile name",
-          value: name,
-          onChange: (v) => setName(v),
-          defaultBoxStyle: { flex: 1, minWidth: 0 },
-          inputBoxStyle: { maxWidth: "none" }
-        })
-      ),
-      // ── Description ──
-      React.createElement(
-        Field,
-        { label: "Description" },
-        React.createElement(Input, {
-          type: "text",
-          size: "small",
-          placeholder: "What does this profile do?",
-          value: description,
-          onChange: (v) => setDescription(v),
-          defaultBoxStyle: { flex: 1, minWidth: 0 },
-          inputBoxStyle: { maxWidth: "none" }
-        })
-      ),
-      // ── Bot ──
-      React.createElement(
-        Field,
-        { label: "Bot" },
-        React.createElement(Input, {
-          type: "select",
-          size: "small",
-          options: bots.map((b) => ({ id: b.id, label: b.name, icon: b.icon || "smartToy" })),
-          optionId: botId,
-          onChange: (id) => setBotId(id),
-          disabled: mode === "edit",
-          placeholder: "Select bot",
-          defaultBoxStyle: { flex: 1, minWidth: 0 }
-        })
-      ),
-      // ── Icon ──
-      React.createElement(
-        Field,
-        { label: "Icon", align: "start" },
-        React.createElement(IconPicker, {
-          catalog: ICON_CATALOG,
-          value: icon,
-          onChange: (v) => setIcon(v),
-          accentColor: color,
-          variant: "inline"
-        })
-      ),
-      // ── Color ──
-      React.createElement(
-        Field,
-        { label: "Color", align: "start" },
-        React.createElement(ColorPicker, {
-          colors: BOT_COLORS,
-          value: color,
-          onChange: (v) => setColor(v),
-          variant: "inline"
-        })
-      ),
-      // ── Preset (ToggleGroup with Custom option) ──
-      React.createElement(
-        Field,
-        { label: "Preset", align: "start" },
-        React.createElement(ToggleGroup, {
-          options: [
-            { label: "Fast", value: "frugal", icon: "speed", selected: preset === "frugal" },
-            { label: "Mid", value: "balanced", icon: "balance", selected: preset === "balanced" },
-            { label: "Smart", value: "performance", icon: "psychology", selected: preset === "performance" },
-            { label: "Custom", value: "custom", icon: "settings", selected: preset === "custom" }
-          ],
-          onSelect: handlePresetChange,
-          size: "extraSmall"
-        })
-      ),
-      // ── Phase Configuration (always visible, readOnly when preset) ──
-      React.createElement(
-        Field,
-        { label: "Phases", align: "start" },
+        Flex,
+        {
+          variant: "column-stretch-start-nowrap-10",
+          style: { padding: "12px 16px" }
+        },
+        // ── Name ──
         React.createElement(
-          Flex,
-          {
-            variant: "column-stretch-start-nowrap-6"
-          },
-          ...Object.entries(behavior).filter(([k]) => !["maxAttempts", "onExhausted", "blockedPaths", "allowedPaths"].includes(k)).map(([phaseName, phase]) => {
-            const phaseObj = phase;
-            const isLlm = phaseObj.tier !== void 0;
-            const label = phaseName.replace(/([A-Z])/g, " $1").replace(/^./, (s) => s.toUpperCase()).trim();
-            return phaseRow(phaseName, label, isLlm);
+          Field,
+          { label: "Name" },
+          React.createElement(Input, {
+            type: "text",
+            size: "small",
+            placeholder: "Profile name",
+            value: name,
+            onChange: (v) => setName(v),
+            defaultBoxStyle: { flex: 1, minWidth: 0 },
+            inputBoxStyle: { maxWidth: "none" }
           })
-        )
-      ),
-      // ── Escalation (always visible, readOnly when preset) ──
-      React.createElement(
-        Field,
-        { label: "Retries", align: "start" },
+        ),
+        // ── Description ──
         React.createElement(
-          Flex,
-          {
-            variant: "column-stretch-start-nowrap-8"
-          },
+          Field,
+          { label: "Description" },
+          React.createElement(Input, {
+            type: "text",
+            size: "small",
+            placeholder: "What does this profile do?",
+            value: description,
+            onChange: (v) => setDescription(v),
+            defaultBoxStyle: { flex: 1, minWidth: 0 },
+            inputBoxStyle: { maxWidth: "none" }
+          })
+        ),
+        // ── Bot ──
+        React.createElement(
+          Field,
+          { label: "Bot" },
+          React.createElement(Input, {
+            type: "select",
+            size: "small",
+            options: bots.map((b) => ({ id: b.id, label: b.name, icon: b.icon || "smartToy" })),
+            optionId: botId,
+            onChange: (id) => setBotId(id),
+            disabled: mode === "edit",
+            placeholder: "Select bot",
+            defaultBoxStyle: { flex: 1, minWidth: 0 }
+          })
+        ),
+        // ── Icon ──
+        React.createElement(
+          Field,
+          { label: "Icon", align: "start" },
+          React.createElement(IconPicker, {
+            catalog: ICON_CATALOG,
+            value: icon,
+            onChange: (v) => setIcon(v),
+            accentColor: color,
+            variant: "inline"
+          })
+        ),
+        // ── Color ──
+        React.createElement(
+          Field,
+          { label: "Color", align: "start" },
+          React.createElement(ColorPicker, {
+            colors: BOT_COLORS,
+            value: color,
+            onChange: (v) => setColor(v),
+            variant: "inline"
+          })
+        ),
+        // ── Preset (ToggleGroup with Custom option) ──
+        React.createElement(
+          Field,
+          { label: "Preset", align: "start" },
+          React.createElement(ToggleGroup, {
+            options: [
+              { label: "Fast", value: "frugal", icon: "speed", selected: preset === "frugal" },
+              { label: "Mid", value: "balanced", icon: "balance", selected: preset === "balanced" },
+              { label: "Smart", value: "performance", icon: "psychology", selected: preset === "performance" },
+              { label: "Custom", value: "custom", icon: "settings", selected: preset === "custom" }
+            ],
+            onSelect: handlePresetChange,
+            size: "extraSmall"
+          })
+        ),
+        // ── Knowledge Capabilities (checkbox grid) ──
+        React.createElement(
+          Field,
+          { label: "Knowledge", align: "start" },
           React.createElement(
-            Field,
-            { label: "Max attempts", labelWidth: 100, align: "center" },
+            Flex,
+            { variant: "column-stretch-start-nowrap-2" },
+            ...BUILT_IN_CAPABILITIES.map(
+              (cap) => React.createElement(
+                Flex,
+                {
+                  key: cap.name,
+                  variant: "row-center-start-nowrap-8",
+                  style: { minHeight: 28, padding: "1px 0" }
+                },
+                React.createElement(Checkbox, {
+                  checked: knowledgeCaps.includes(cap.name),
+                  onChange: () => handleToggleKnowledgeCap(cap.name),
+                  disabled: cap.name === "core" || !isCustom,
+                  size: "sm"
+                }),
+                React.createElement(Typography, {
+                  variant: "smallCaption-thick",
+                  color: knowledgeCaps.includes(cap.name) ? "color-text-high" : "color-text-subtle",
+                  style: { minWidth: 80 }
+                }, cap.name),
+                React.createElement(Typography, {
+                  variant: "smallCaption-regular",
+                  color: "color-text-subtle",
+                  style: { flex: 1 }
+                }, cap.description)
+              )
+            )
+          )
+        ),
+        // ── Budget ──
+        React.createElement(
+          Field,
+          { label: "Budget", align: "center" },
+          React.createElement(
+            Flex,
+            { variant: "row-center-start-nowrap-6" },
+            React.createElement(Typography, {
+              variant: "smallCaption-regular",
+              color: "color-text-subtle"
+            }, "$"),
             React.createElement(Input, {
               type: "number",
               size: "small",
-              value: String(behavior.maxAttempts),
+              value: String(budget),
               readOnly: !isCustom,
-              onChange: isCustom ? (v) => updateEscalation("maxAttempts", Math.max(1, parseInt(v) || 1)) : void 0,
-              defaultBoxStyle: { width: 60 }
-            })
-          ),
+              onChange: isCustom ? (v) => {
+                const n = parseFloat(v);
+                if (!isNaN(n) && n >= 0) setBudget(n);
+              } : void 0,
+              defaultBoxStyle: { width: 80 }
+            }),
+            React.createElement(Typography, {
+              variant: "smallCaption-regular",
+              color: "color-text-subtle"
+            }, "/ task")
+          )
+        ),
+        // ── Phase Configuration (always visible, readOnly when preset) ──
+        React.createElement(
+          Field,
+          { label: "Phases", align: "start" },
           React.createElement(
-            Field,
-            { label: "On exhausted", labelWidth: 100, align: "start" },
-            React.createElement(ToggleGroup, {
-              options: [
-                { label: "Block", value: "block", icon: "block", selected: behavior.onExhausted === "block" },
-                { label: "Reassign", value: "reassign", icon: "sync", selected: behavior.onExhausted === "reassign" },
-                { label: "Notify", value: "notify", icon: "notifications", selected: behavior.onExhausted === "notify" }
-              ],
-              onSelect: (v) => updateEscalation("onExhausted", v),
-              readOnly: !isCustom,
-              size: "extraSmall"
+            Flex,
+            {
+              variant: "column-stretch-start-nowrap-6"
+            },
+            ...Object.entries(behavior).filter(([k]) => !["maxAttempts", "onExhausted", "blockedPaths", "allowedPaths"].includes(k)).map(([phaseName, phase]) => {
+              const phaseObj = phase;
+              const isLlm = phaseObj.tier !== void 0;
+              const label = phaseName.replace(/([A-Z])/g, " $1").replace(/^./, (s) => s.toUpperCase()).trim();
+              return phaseRow(phaseName, label, isLlm);
             })
           )
-        )
-      ),
-      // ── Scope Constraints (collapsible) ──
-      // ── Custom: Scope Constraints (inline) ──
-      isCustom && React.createElement(
-        Field,
-        { label: "Scope", align: "start" },
+        ),
+        // ── Escalation (always visible, readOnly when preset) ──
         React.createElement(
-          Flex,
-          {
-            variant: "column-stretch-start-nowrap-8"
-          },
-          // Blocked paths
+          Field,
+          { label: "Retries", align: "start" },
           React.createElement(
-            Field,
-            { label: "Blocked", labelWidth: 70, align: "start" },
+            Flex,
+            {
+              variant: "column-stretch-start-nowrap-8"
+            },
             React.createElement(
-              Flex,
-              { variant: "column-stretch-start-nowrap-4" },
+              Field,
+              { label: "Max attempts", labelWidth: 100, align: "center" },
+              React.createElement(Input, {
+                type: "number",
+                size: "small",
+                value: String(behavior.maxAttempts),
+                readOnly: !isCustom,
+                onChange: isCustom ? (v) => updateEscalation("maxAttempts", Math.max(1, parseInt(v) || 1)) : void 0,
+                defaultBoxStyle: { width: 60 }
+              })
+            ),
+            React.createElement(
+              Field,
+              { label: "On exhausted", labelWidth: 100, align: "start" },
+              React.createElement(ToggleGroup, {
+                options: [
+                  { label: "Block", value: "block", icon: "block", selected: behavior.onExhausted === "block" },
+                  { label: "Reassign", value: "reassign", icon: "sync", selected: behavior.onExhausted === "reassign" },
+                  { label: "Notify", value: "notify", icon: "notifications", selected: behavior.onExhausted === "notify" }
+                ],
+                onSelect: (v) => updateEscalation("onExhausted", v),
+                readOnly: !isCustom,
+                size: "extraSmall"
+              })
+            )
+          )
+        ),
+        // ── Scope Constraints (collapsible) ──
+        // ── Custom: Scope Constraints (inline) ──
+        isCustom && React.createElement(
+          Field,
+          { label: "Scope", align: "start" },
+          React.createElement(
+            Flex,
+            {
+              variant: "column-stretch-start-nowrap-8"
+            },
+            // Blocked paths
+            React.createElement(
+              Field,
+              { label: "Blocked", labelWidth: 70, align: "start" },
               React.createElement(
                 Flex,
-                { variant: "row-center-start-nowrap-4" },
-                React.createElement(Input, {
-                  type: "text",
-                  size: "small",
-                  placeholder: "e.g. src/",
-                  value: blockedInput,
-                  onChange: (v) => setBlockedInput(v),
-                  onEnter: () => handleAddScopePath("blocked"),
-                  defaultBoxStyle: { flex: 1, minWidth: 0 },
-                  inputBoxStyle: { maxWidth: "none" }
-                }),
-                React.createElement(IconButton, {
-                  icon: "add",
-                  size: "sm",
-                  variant: "outlined",
-                  color: "primary",
-                  onClick: () => handleAddScopePath("blocked"),
-                  disabled: !blockedInput.trim()
-                })
-              ),
-              ...behavior.blockedPaths.map(
-                (p, i) => React.createElement(
+                { variant: "column-stretch-start-nowrap-4" },
+                React.createElement(
                   Flex,
-                  { key: `b-${p}-${i}`, variant: "row-center-start-nowrap-6" },
-                  React.createElement(Icon, { name: "block", size: 12, color: "color-status-negative" }),
-                  React.createElement(Typography, { variant: "smallCaption-regular", color: "color-text-high", style: { flex: 1 } }, p),
+                  { variant: "row-center-start-nowrap-4" },
+                  React.createElement(Input, {
+                    type: "text",
+                    size: "small",
+                    placeholder: "e.g. src/",
+                    value: blockedInput,
+                    onChange: (v) => setBlockedInput(v),
+                    onEnter: () => handleAddScopePath("blocked"),
+                    defaultBoxStyle: { flex: 1, minWidth: 0 },
+                    inputBoxStyle: { maxWidth: "none" }
+                  }),
                   React.createElement(IconButton, {
-                    icon: "close",
-                    size: "xs",
-                    variant: "clear",
-                    color: "danger",
-                    onClick: () => handleRemoveScopePath("blocked", i)
+                    icon: "add",
+                    size: "sm",
+                    variant: "outlined",
+                    color: "primary",
+                    onClick: () => handleAddScopePath("blocked"),
+                    disabled: !blockedInput.trim()
                   })
+                ),
+                ...behavior.blockedPaths.map(
+                  (p, i) => React.createElement(
+                    Flex,
+                    { key: `b-${p}-${i}`, variant: "row-center-start-nowrap-6" },
+                    React.createElement(Icon, { name: "block", size: 12, color: "color-status-negative" }),
+                    React.createElement(Typography, { variant: "smallCaption-regular", color: "color-text-high", style: { flex: 1 } }, p),
+                    React.createElement(IconButton, {
+                      icon: "close",
+                      size: "xs",
+                      variant: "clear",
+                      color: "danger",
+                      onClick: () => handleRemoveScopePath("blocked", i)
+                    })
+                  )
                 )
               )
-            )
-          ),
-          // Allowed paths
-          React.createElement(
-            Field,
-            { label: "Allowed", labelWidth: 70, align: "start" },
+            ),
+            // Allowed paths
             React.createElement(
-              Flex,
-              { variant: "column-stretch-start-nowrap-4" },
+              Field,
+              { label: "Allowed", labelWidth: 70, align: "start" },
               React.createElement(
                 Flex,
-                { variant: "row-center-start-nowrap-4" },
-                React.createElement(Input, {
-                  type: "text",
-                  size: "small",
-                  placeholder: "e.g. config/",
-                  value: allowedInput,
-                  onChange: (v) => setAllowedInput(v),
-                  onEnter: () => handleAddScopePath("allowed"),
-                  defaultBoxStyle: { flex: 1, minWidth: 0 },
-                  inputBoxStyle: { maxWidth: "none" }
-                }),
-                React.createElement(IconButton, {
-                  icon: "add",
-                  size: "sm",
-                  variant: "outlined",
-                  color: "primary",
-                  onClick: () => handleAddScopePath("allowed"),
-                  disabled: !allowedInput.trim()
-                })
-              ),
-              ...behavior.allowedPaths.map(
-                (p, i) => React.createElement(
+                { variant: "column-stretch-start-nowrap-4" },
+                React.createElement(
                   Flex,
-                  { key: `a-${p}-${i}`, variant: "row-center-start-nowrap-6" },
-                  React.createElement(Icon, { name: "checkCircle", size: 12, color: "color-status-positive" }),
-                  React.createElement(Typography, { variant: "smallCaption-regular", color: "color-text-high", style: { flex: 1 } }, p),
+                  { variant: "row-center-start-nowrap-4" },
+                  React.createElement(Input, {
+                    type: "text",
+                    size: "small",
+                    placeholder: "e.g. config/",
+                    value: allowedInput,
+                    onChange: (v) => setAllowedInput(v),
+                    onEnter: () => handleAddScopePath("allowed"),
+                    defaultBoxStyle: { flex: 1, minWidth: 0 },
+                    inputBoxStyle: { maxWidth: "none" }
+                  }),
                   React.createElement(IconButton, {
-                    icon: "close",
-                    size: "xs",
-                    variant: "clear",
-                    color: "danger",
-                    onClick: () => handleRemoveScopePath("allowed", i)
+                    icon: "add",
+                    size: "sm",
+                    variant: "outlined",
+                    color: "primary",
+                    onClick: () => handleAddScopePath("allowed"),
+                    disabled: !allowedInput.trim()
                   })
+                ),
+                ...behavior.allowedPaths.map(
+                  (p, i) => React.createElement(
+                    Flex,
+                    { key: `a-${p}-${i}`, variant: "row-center-start-nowrap-6" },
+                    React.createElement(Icon, { name: "checkCircle", size: 12, color: "color-status-positive" }),
+                    React.createElement(Typography, { variant: "smallCaption-regular", color: "color-text-high", style: { flex: 1 } }, p),
+                    React.createElement(IconButton, {
+                      icon: "close",
+                      size: "xs",
+                      variant: "clear",
+                      color: "danger",
+                      onClick: () => handleRemoveScopePath("allowed", i)
+                    })
+                  )
                 )
               )
             )
           )
-        )
-      ),
-      // ── Capabilities ──
-      React.createElement(
-        Field,
-        { label: "Capabilities", align: "start" },
+        ),
+        // ── Capabilities ──
         React.createElement(
-          Flex,
-          { variant: "column-stretch-start-nowrap-6" },
-          // Add row
+          Field,
+          { label: "Capabilities", align: "start" },
           React.createElement(
             Flex,
-            { variant: "row-center-start-nowrap-4", style: { overflow: "hidden" } },
-            React.createElement(Input, {
-              type: "text",
-              size: "small",
-              placeholder: "Name",
-              value: capName,
-              onChange: (v) => setCapName(v),
-              defaultBoxStyle: { flex: 1, minWidth: 0 },
-              inputBoxStyle: { maxWidth: "none" }
-            }),
-            React.createElement(Input, {
-              type: "text",
-              size: "small",
-              placeholder: "Description",
-              value: capDescription,
-              onChange: (v) => setCapDescription(v),
-              onEnter: handleAddCapability,
-              defaultBoxStyle: { flex: 2, minWidth: 0 },
-              inputBoxStyle: { maxWidth: "none" }
-            }),
-            React.createElement(IconButton, {
-              icon: "add",
-              size: "sm",
-              variant: "outlined",
-              color: "primary",
-              onClick: handleAddCapability,
-              disabled: !capName.trim() || !capDescription.trim()
+            { variant: "column-stretch-start-nowrap-6" },
+            // Add row
+            React.createElement(
+              Flex,
+              { variant: "row-center-start-nowrap-4", style: { minWidth: 0 } },
+              React.createElement(Input, {
+                type: "text",
+                size: "small",
+                placeholder: "Name",
+                value: capName,
+                onChange: (v) => setCapName(v),
+                defaultBoxStyle: { flex: "0 1 120px", minWidth: 0 },
+                inputBoxStyle: { maxWidth: "none", minWidth: 0 }
+              }),
+              React.createElement(Input, {
+                type: "text",
+                size: "small",
+                placeholder: "Description",
+                value: capDescription,
+                onChange: (v) => setCapDescription(v),
+                onEnter: handleAddCapability,
+                defaultBoxStyle: { flex: "1 1 0", minWidth: 0 },
+                inputBoxStyle: { maxWidth: "none", minWidth: 0 }
+              }),
+              React.createElement(IconButton, {
+                icon: "add",
+                size: "sm",
+                variant: "outlined",
+                color: "primary",
+                onClick: handleAddCapability,
+                disabled: !capName.trim() || !capDescription.trim(),
+                style: { flexShrink: 0 }
+              })
+            ),
+            // Table
+            capabilities.length > 0 && React.createElement(Table, {
+              size: "compact",
+              showHeader: false,
+              data: capabilities,
+              getRowKey: (_row, i) => `cap-${i}`,
+              columns: [
+                {
+                  key: "name",
+                  header: "Name",
+                  width: "30%",
+                  render: (val) => React.createElement("div", { style: { lineHeight: "28px" } }, String(val))
+                },
+                {
+                  key: "description",
+                  header: "Description",
+                  render: (val) => React.createElement("div", { style: { lineHeight: "28px" } }, String(val))
+                },
+                {
+                  key: "actions",
+                  header: "",
+                  width: "32px",
+                  align: "right",
+                  render: (_val, _row, idx) => React.createElement(IconButton, {
+                    icon: "close",
+                    size: "xs",
+                    variant: "clear",
+                    color: "danger",
+                    onClick: () => handleRemoveCapability(idx)
+                  })
+                }
+              ]
             })
-          ),
-          // Table
-          capabilities.length > 0 && React.createElement(Table, {
-            size: "compact",
-            showHeader: false,
-            data: capabilities,
-            getRowKey: (_row, i) => `cap-${i}`,
-            columns: [
-              {
-                key: "name",
-                header: "Name",
-                width: "30%",
-                render: (val) => React.createElement("div", { style: { lineHeight: "28px" } }, String(val))
-              },
-              {
-                key: "description",
-                header: "Description",
-                render: (val) => React.createElement("div", { style: { lineHeight: "28px" } }, String(val))
-              },
-              {
-                key: "actions",
-                header: "",
-                width: "32px",
-                align: "right",
-                render: (_val, _row, idx) => React.createElement(IconButton, {
-                  icon: "close",
-                  size: "xs",
-                  variant: "clear",
-                  color: "danger",
-                  onClick: () => handleRemoveCapability(idx)
-                })
-              }
-            ]
+          )
+        ),
+        // ── Instructions (multiline) ──
+        React.createElement(
+          Field,
+          { label: "Instructions", align: "start" },
+          React.createElement(Input, {
+            type: "text",
+            size: "small",
+            multiline: true,
+            placeholder: "Behavioral protocol for this profile (optional)",
+            value: instructions,
+            onChange: (v) => setInstructions(v),
+            defaultBoxStyle: { flex: 1, minWidth: 0 },
+            inputBoxStyle: { maxWidth: "none" }
           })
+        ),
+        // ── Require Approval ──
+        React.createElement(
+          Field,
+          { label: "" },
+          React.createElement(Checkbox, {
+            checked: requireApproval,
+            onChange: (v) => setRequireApproval(v),
+            label: "Require approval",
+            size: "sm"
+          })
+        ),
+        // ── Save button ──
+        React.createElement(
+          Flex,
+          { variant: "row-center-end-nowrap-8" },
+          React.createElement(Button, {
+            size: "xs",
+            variant: "fill",
+            color: "primary",
+            onClick: handleSave,
+            disabled: !name.trim() || !botId || capabilities.length === 0
+          }, mode === "create" ? "Create" : "Save")
         )
-      ),
-      // ── Instructions (multiline) ──
-      React.createElement(
-        Field,
-        { label: "Instructions", align: "start" },
-        React.createElement(Input, {
-          type: "text",
-          size: "small",
-          multiline: true,
-          placeholder: "Behavioral protocol for this profile (optional)",
-          value: instructions,
-          onChange: (v) => setInstructions(v),
-          defaultBoxStyle: { flex: 1, minWidth: 0 },
-          inputBoxStyle: { maxWidth: "none" }
-        })
-      ),
-      // ── Require Approval ──
-      React.createElement(
-        Field,
-        { label: "" },
-        React.createElement(Checkbox, {
-          checked: requireApproval,
-          onChange: (v) => setRequireApproval(v),
-          label: "Require approval",
-          size: "sm"
-        })
-      ),
-      // ── Save button ──
-      React.createElement(
-        Flex,
-        { variant: "row-center-end-nowrap-8" },
-        React.createElement(Button, {
-          size: "xs",
-          variant: "fill",
-          color: "primary",
-          onClick: handleSave,
-          disabled: !name.trim() || !botId || capabilities.length === 0
-        }, mode === "create" ? "Create" : "Save")
       )
     )
   );