@synergenius/flow-weaver-pack-weaver 0.9.199 → 0.9.201

package/dist/ui/profile-editor.js

@@ -24,6 +24,8 @@ __export(profile_editor_exports, {
   default: () => profile_editor_default
 });
 module.exports = __toCommonJS(profile_editor_exports);
+var import_react = require("react");
+var import_plugin_ui_kit = require("@fw/plugin-ui-kit");
 
 // src/ui/bot-constants.ts
 var ICON_CATALOG = [
@@ -227,7 +229,7 @@ var CAP_CORE = {
   prompt: `You are Weaver. Execute tasks by calling tools \u2014 do not describe what you would do.
 
 ## System Constraints
-- All file paths are relative to the workspace root. "../" is blocked.
+- All file paths MUST be relative to the workspace root (e.g. "src/index.ts", not "/home/user/project/src/index.ts"). NEVER use absolute paths. "../" is blocked.
 - Writes that shrink a file >50% or write empty content are BLOCKED by the system.
 - Blocked shell commands: rm -rf, git push, npm publish, sudo, curl|sh.`
 };
@@ -235,45 +237,68 @@ var CAP_ROLE_ORCHESTRATOR = {
   name: "role-orchestrator",
   description: "Orchestrator role: decomposes objectives into subtask DAGs.",
   tools: [OP_TASK_CREATE, OP_LIST_FILES, OP_READ_FILE],
+  acceptance: [
+    { name: "subtasks-created", command: `python3 -c "import json; tasks=json.load(open('.weaver/tasks.json')); exit(0 if len(tasks)>=3 else 1)"` },
+    { name: "deps-defined", command: `python3 -c "import json; tasks=json.load(open('.weaver/tasks.json')); exit(0 if any(t.get('dependsOn') for t in tasks) else 1)"` }
+  ],
   prompt: `## YOUR ROLE: Orchestrator
 You decompose objectives into subtasks. You never write code or create files directly.
 Your only output is task_create calls + done.
 
-1. Analyze the objective and list_files to understand the workspace.
-2. Create subtasks via task_create with parentId: "@self".
-3. Assign profiles: developer (code), reviewer (review), ops (infra/setup).
-4. Set dependsOn using task titles (resolved to IDs automatically).
-5. Add acceptance.checks \u2014 shell commands that exit 0 on success. The system runs them after each run.
-6. Maximize parallelism: tasks with no shared files should not depend on each other.
-7. Your LAST subtask: "Review & Steer" assigned to orchestrator, dependsOn all others.
+### Execution Planning Protocol
+Before creating subtasks, you MUST:
+1. Use list_files and read_file to read every source file. Map the dependency graph (which files import which).
+2. IDENTIFY the critical path \u2014 the longest sequential chain. This is your bottleneck.
+3. GROUP tasks to match worker count (shown in context as maxConcurrent=N).
+   - Each dependency level should have at most N parallel tasks.
+   - Combine small independent files into single tasks to reduce overhead.
+   - Separate high-risk files (many bugs/complexity) from clean ones.
+   - Never create more sequential levels than necessary.
+4. SHOW YOUR REASONING in the first task_create description:
+   - Dependency graph you found
+   - Critical path identified
+   - Why you grouped tasks this way
 
-### Design First
-For multi-file projects, your FIRST subtask should create a .design.md with:
-- Module map: which files, what each exports (function signatures with types)
-- Conventions: naming, error handling, patterns (e.g., factory functions for servers)
-All subsequent developer tasks must read .design.md before writing code.
+### Task Creation Rules
+- Create subtasks via task_create with parentId: "@self".
+- Assign profiles: developer (code), reviewer (review), ops (infra/setup).
+- Set dependsOn using task titles (resolved to IDs automatically).
+- Fewer tasks with more work each > many tiny serial tasks.
+- A file and its only dependent CAN be in the same task.
+- Tests can be combined with the last implementation task.
+- Your LAST subtask: "Review & Steer" assigned to orchestrator, dependsOn all others.
 
 ### Acceptance Criteria
 Every subtask MUST have acceptance.checks \u2014 shell commands that verify "done" (exit 0 = pass).
+Checks must test BEHAVIOR (run the code, import the module), not string patterns (grep for text).
 The system runs them automatically after each run. If any fail, the task stays open.
 Examples:
-- File exists: test -f url-shortener/src/store.ts
-- Compiles: cd url-shortener && npx tsc --noEmit
-- Tests pass: cd url-shortener && npx vitest run
-- Export exists: grep -q "export.*startServer" url-shortener/src/server.ts
+- Compiles: npx tsc --noEmit
+- Tests pass: npx vitest run
+- Module works: node -e "import('./src/db.js').then(m => process.exit(m.getById ? 0 : 1))"
+- File exists: test -f src/types.ts
+
+### Design First
+For multi-file projects, your FIRST subtask should create a .design.md with:
+- Module map: which files, what each exports (function signatures with types)
+- Conventions: naming, error handling, patterns
+All subsequent developer tasks must read .design.md before writing code.
 
 ### Steering Mode (when running a Review & Steer task)
 Read the sibling task list in your context \u2014 it shows status, run count, and check failures with error details.
 - All checks pass \u2192 done.
 - Tasks with 0 runs still open \u2192 they will be picked up, do not recreate them.
-- Checks failing \u2192 read the specific error in the check detail, then create a targeted fix task addressing that exact error. Do not create broad "fix everything" tasks.
+- Checks failing \u2192 read the specific error in the check detail, then create a targeted fix task addressing that exact error.
 - Task stagnant (3+ failed runs) \u2192 redefine with smaller scope or reassign to different profile.
-- Before creating ANY task, check if an existing open sibling already covers the same work. If yes, do not create a duplicate \u2014 the existing task will be retried.
+- Before creating ANY task, check if an existing open sibling already covers the same work.
 - After creating fix tasks, create one more Review & Steer depending on them, then done.`
 };
 var CAP_ROLE_DEVELOPER = {
   name: "role-developer",
   description: "Developer role: writes code, creates files, runs commands.",
+  acceptance: [
+    { name: "file-changes-produced", command: 'test $(find src tests -name "*.ts" -newer .weaver/swarm.json 2>/dev/null | wc -l) -gt 0 || test $(find src tests -name "*.js" -newer .weaver/swarm.json 2>/dev/null | wc -l) -gt 0', condition: "src" }
+  ],
   prompt: `## YOUR ROLE: Developer
 You write code and produce files. Execute the task directly \u2014 do not delegate.
 
@@ -321,8 +346,8 @@ var CAP_SHELL = {
 };
 var CAP_TASK_MGMT = {
   name: "task-mgmt",
-  description: "Create swarm subtasks.",
-  tools: [OP_TASK_CREATE],
+  description: "Create and inspect swarm subtasks.",
+  tools: [OP_TASK_CREATE, "task_list", "task_get", "task_update"],
   prompt: `## Task Management
 - task_create(title, description?, assignedProfile?, parentId?, dependsOn?, complexity?, acceptance?):
   Creates a subtask in the swarm task pool. Returns task ID.
@@ -331,6 +356,9 @@ var CAP_TASK_MGMT = {
   - assignedProfile: "developer" | "reviewer" | "ops" | "orchestrator". Omit for auto-routing.
   - parentId: "@self" to nest under current task. Omit for top-level.
   - dependsOn: Array of task titles. Resolved to IDs automatically.
+- task_list(status?): List tasks in the swarm. Optionally filter by status (pending, in-progress, done, failed).
+- task_get(id): Get full details of a specific task.
+- task_update(id, notes?, files?, description?): Update a task's notes, files list, or description.
   - complexity: "trivial" | "simple" | "moderate" | "complex".
   - acceptance: { checks: [{ name: string, command: string }] } \u2014 shell commands that exit 0 on success.`
 };
@@ -435,17 +463,22 @@ var CAP_VERIFICATION = {
   name: "verification",
   description: "TypeScript compilation and test runner verification.",
   tools: [OP_RUN_SHELL],
+  acceptance: [
+    { name: "tsc-compiles", command: "npx tsc --noEmit", condition: "find src -name '*.ts' | head -1 | grep -q ." }
+  ],
   prompt: `## Verification
-- tsc_check: npx tsc --noEmit \u2014 returns TypeScript compilation errors or empty on success.
-- test_run: npx vitest run \u2014 returns test results with pass/fail counts.`
+Use run_shell for compilation and test verification:
+- npx tsc --noEmit \u2014 returns TypeScript compilation errors or empty on success.
+- npx vitest run \u2014 returns test results with pass/fail counts.`
 };
 var CAP_CROSS_FILE_CHECK = {
   name: "cross-file-check",
   description: "Cross-file dependency verification.",
   tools: [OP_READ_FILE, OP_LIST_FILES, OP_RUN_SHELL],
   prompt: `## Cross-File Checks
-Use grep (via run_shell) to find all import/export references across files.
-Use read_file to verify import paths resolve to actual exports.`
+Use list_files to find relevant files, read_file to inspect them,
+and run_shell with grep to find all import/export references across files.
+Verify import paths resolve to actual exports.`
 };
 var CAP_PROJECT_SETUP = {
   name: "project-setup",
@@ -460,7 +493,7 @@ var CAP_SECURITY = {
   description: "Security audit tools.",
   tools: [OP_READ_FILE, OP_LIST_FILES, OP_RUN_SHELL],
   prompt: `## Security
-Use grep (via run_shell) to scan for hardcoded secrets, eval(), shell injection patterns.
+Use list_files to discover files, read_file to inspect them, and run_shell with grep to scan for hardcoded secrets, eval(), shell injection patterns.
 Use npm audit (via run_shell) for dependency vulnerabilities.
 Finding format: FILE:LINE | SEVERITY (critical/high/medium/low) | ISSUE.`
 };
@@ -537,29 +570,7 @@ var STRATEGY_BUDGETS = {
 };
 
 // src/ui/profile-editor.tsx
-var React = require("react");
-var { useState, useEffect, useCallback } = React;
-var {
-  Flex,
-  Typography,
-  Input,
-  Button,
-  IconButton,
-  Icon,
-  SectionTitle,
-  Checkbox,
-  Chip,
-  Field,
-  Table,
-  IconPicker,
-  ColorPicker,
-  Switch,
-  ToggleGroup,
-  CollapsibleSection,
-  ScrollArea,
-  toast,
-  usePackWorkspace
-} = require("@fw/plugin-ui-kit");
+var import_jsx_runtime = require("react/jsx-runtime");
 var DEFAULT_PHASES = [
   { name: "plan", label: "Plan", isLlmPhase: true },
   { name: "execute", label: "Execute", isLlmPhase: true },
@@ -602,28 +613,28 @@ function defaultBehaviorForStrategy(strategy, phases) {
   return state;
 }
 function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
-  const ctx = usePackWorkspace();
+  const ctx = (0, import_plugin_ui_kit.usePackWorkspace)();
   const { callTool } = ctx;
-  const [name, setName] = useState("");
-  const [description, setDescription] = useState("");
-  const [botId, setBotId] = useState(mode === "create" && bots.length > 0 ? bots[0].id : "");
-  const [icon, setIcon] = useState("smartToy");
-  const [color, setColor] = useState("color-node-blue-icon");
-  const [costStrategy, setCostStrategy] = useState("balanced");
-  const [preset, setPreset] = useState("balanced");
-  const [capabilities, setCapabilities] = useState([]);
-  const [capName, setCapName] = useState("");
-  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("");
-  const [loading, setLoading] = useState(mode === "edit");
+  const [name, setName] = (0, import_react.useState)("");
+  const [description, setDescription] = (0, import_react.useState)("");
+  const [botId, setBotId] = (0, import_react.useState)(mode === "create" && bots.length > 0 ? bots[0].id : "");
+  const [icon, setIcon] = (0, import_react.useState)("smartToy");
+  const [color, setColor] = (0, import_react.useState)("color-node-blue-icon");
+  const [costStrategy, setCostStrategy] = (0, import_react.useState)("balanced");
+  const [preset, setPreset] = (0, import_react.useState)("balanced");
+  const [capabilities, setCapabilities] = (0, import_react.useState)([]);
+  const [capName, setCapName] = (0, import_react.useState)("");
+  const [capDescription, setCapDescription] = (0, import_react.useState)("");
+  const [instructions, setInstructions] = (0, import_react.useState)("");
+  const [requireApproval, setRequireApproval] = (0, import_react.useState)(false);
+  const [knowledgeCaps, setKnowledgeCaps] = (0, import_react.useState)(() => [...STRATEGY_CAPABILITIES.balanced]);
+  const [budget, setBudget] = (0, import_react.useState)(STRATEGY_BUDGETS.balanced);
+  const [behavior, setBehavior] = (0, import_react.useState)(defaultBehaviorForStrategy("balanced"));
+  const [blockedInput, setBlockedInput] = (0, import_react.useState)("");
+  const [allowedInput, setAllowedInput] = (0, import_react.useState)("");
+  const [loading, setLoading] = (0, import_react.useState)(mode === "edit");
   const isCustom = preset === "custom";
-  const handlePresetChange = useCallback((value) => {
+  const handlePresetChange = (0, import_react.useCallback)((value) => {
     const p = value;
     setPreset(p);
     if (p !== "custom") {
@@ -633,18 +644,18 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
       setBudget(STRATEGY_BUDGETS[p]);
     }
   }, []);
-  const updatePhase = useCallback((phase, field, value) => {
+  const updatePhase = (0, import_react.useCallback)((phase, field, value) => {
     setBehavior((prev) => ({
       ...prev,
       [phase]: { ...prev[phase], [field]: value }
     }));
     setPreset("custom");
   }, []);
-  const updateEscalation = useCallback((field, value) => {
+  const updateEscalation = (0, import_react.useCallback)((field, value) => {
     setBehavior((prev) => ({ ...prev, [field]: value }));
     setPreset("custom");
   }, []);
-  useEffect(() => {
+  (0, import_react.useEffect)(() => {
     if (mode !== "edit" || !profileId) return;
     let cancelled = false;
     (async () => {
@@ -655,7 +666,7 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
         const list = Array.isArray(data) ? data : [];
         const profile = list.find((p) => p.id === profileId);
         if (!profile) {
-          toast("Profile not found", { type: "error" });
+          (0, import_plugin_ui_kit.toast)("Profile not found", { type: "error" });
           onCancel();
           return;
         }
@@ -711,7 +722,7 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
           setPreset(strat);
         }
       } catch {
-        toast("Failed to load profile", { type: "error" });
+        (0, import_plugin_ui_kit.toast)("Failed to load profile", { type: "error" });
         onCancel();
       } finally {
         if (!cancelled) setLoading(false);
@@ -721,7 +732,7 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
       cancelled = true;
     };
   }, [mode, profileId, callTool, onCancel]);
-  const handleAddCapability = useCallback(() => {
+  const handleAddCapability = (0, import_react.useCallback)(() => {
     const trimName = capName.trim();
     const trimDesc = capDescription.trim();
     if (!trimName || !trimDesc) return;
@@ -729,17 +740,17 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
     setCapName("");
     setCapDescription("");
   }, [capName, capDescription]);
-  const handleRemoveCapability = useCallback((index) => {
+  const handleRemoveCapability = (0, import_react.useCallback)((index) => {
     setCapabilities((prev) => prev.filter((_, i) => i !== index));
   }, []);
-  const handleToggleKnowledgeCap = useCallback((capName2) => {
+  const handleToggleKnowledgeCap = (0, import_react.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 handleAddScopePath = (0, import_react.useCallback)((type) => {
     const input = type === "blocked" ? blockedInput : allowedInput;
     const trimmed = input.trim();
     if (!trimmed) return;
@@ -751,24 +762,24 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
     else setAllowedInput("");
     setPreset("custom");
   }, [blockedInput, allowedInput]);
-  const handleRemoveScopePath = useCallback((type, index) => {
+  const handleRemoveScopePath = (0, import_react.useCallback)((type, index) => {
     setBehavior((prev) => ({
       ...prev,
       [type === "blocked" ? "blockedPaths" : "allowedPaths"]: (type === "blocked" ? prev.blockedPaths : prev.allowedPaths).filter((_, i) => i !== index)
     }));
     setPreset("custom");
   }, []);
-  const handleSave = useCallback(async () => {
+  const handleSave = (0, import_react.useCallback)(async () => {
     if (!name.trim()) {
-      toast("Profile name is required", { type: "error" });
+      (0, import_plugin_ui_kit.toast)("Profile name is required", { type: "error" });
       return;
     }
     if (!botId) {
-      toast("Select a bot workflow", { type: "error" });
+      (0, import_plugin_ui_kit.toast)("Select a bot workflow", { type: "error" });
       return;
     }
     if (capabilities.length === 0) {
-      toast("Add at least one capability", { type: "error" });
+      (0, import_plugin_ui_kit.toast)("Add at least one capability", { type: "error" });
       return;
     }
     const NON_PHASE_KEYS = /* @__PURE__ */ new Set(["maxAttempts", "onExhausted", "blockedPaths", "allowedPaths"]);
@@ -806,7 +817,7 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
           requireApproval,
           behavior: behaviorPayload
         });
-        toast("Profile created", { type: "success" });
+        (0, import_plugin_ui_kit.toast)("Profile created", { type: "success" });
       } else {
         await callTool("fw_weaver_profile_update", {
           id: profileId,
@@ -820,14 +831,14 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
           requireApproval,
           behavior: behaviorPayload
         });
-        toast("Profile updated", { type: "success" });
+        (0, import_plugin_ui_kit.toast)("Profile updated", { type: "success" });
       }
       onSave();
     } catch (err) {
-      toast(err instanceof Error ? err.message : `Failed to ${mode} profile`, { type: "error" });
+      (0, import_plugin_ui_kit.toast)(err instanceof Error ? err.message : `Failed to ${mode} profile`, { type: "error" });
     }
   }, [mode, profileId, name, description, botId, icon, color, costStrategy, capabilities, knowledgeCaps, budget, instructions, requireApproval, behavior, callTool, onSave]);
-  const handleDelete = useCallback(async () => {
+  const handleDelete = (0, import_react.useCallback)(async () => {
     if (!profileId) return;
     const ok = await ctx.confirm("Are you sure you want to delete this profile?", {
       title: "Delete Profile",
@@ -837,527 +848,473 @@ function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
     if (!ok) return;
     try {
       await callTool("fw_weaver_profile_delete", { id: profileId });
-      toast("Profile deleted", { type: "success" });
+      (0, import_plugin_ui_kit.toast)("Profile deleted", { type: "success" });
       if (onDelete) onDelete();
     } catch (err) {
-      toast(err instanceof Error ? err.message : "Failed to delete profile", { type: "error" });
+      (0, import_plugin_ui_kit.toast)(err instanceof Error ? err.message : "Failed to delete profile", { type: "error" });
     }
   }, [profileId, callTool, onDelete, ctx]);
   if (loading) {
-    return React.createElement(
-      Flex,
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_plugin_ui_kit.Flex,
       {
         variant: "column-center-center-nowrap-12",
-        style: { padding: "24px 16px" }
-      },
-      React.createElement(Typography, { variant: "caption-regular", color: "color-text-subtle" }, "Loading profile...")
+        style: { padding: "24px 16px" },
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Typography, { variant: "caption-regular", color: "color-text-subtle", children: "Loading profile..." })
+      }
     );
   }
   const phaseRow = (phaseName, label, isLlmPhase) => {
     const phase = behavior[phaseName];
     const currentTier = phase.tier ?? "standard";
     const ro = !isCustom;
-    return React.createElement(
-      Flex,
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      import_plugin_ui_kit.Flex,
       {
-        key: phaseName,
         variant: "row-center-space-between-nowrap-8",
-        style: { minHeight: 30, padding: "2px 0" }
+        style: { minHeight: 30, padding: "2px 0" },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "row-center-start-nowrap-8", style: { minWidth: 100 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_plugin_ui_kit.Switch,
+              {
+                checked: phase.enabled,
+                size: "small",
+                readOnly: ro,
+                onChange: ro ? void 0 : (v) => updatePhase(phaseName, "enabled", v)
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_plugin_ui_kit.Typography,
+              {
+                variant: "smallCaption-regular",
+                color: phase.enabled ? "color-text-high" : "color-text-subtle",
+                children: label
+              }
+            )
+          ] }),
+          isLlmPhase && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_plugin_ui_kit.ToggleGroup,
+            {
+              options: [
+                { label: "Fast", value: "fast", icon: "speed", selected: currentTier === "fast", disabled: !phase.enabled },
+                { label: "Mid", value: "standard", icon: "balance", selected: currentTier === "standard", disabled: !phase.enabled },
+                { label: "Smart", value: "powerful", icon: "psychology", selected: currentTier === "powerful", disabled: !phase.enabled }
+              ],
+              onSelect: (v) => updatePhase(phaseName, "tier", v),
+              readOnly: ro,
+              size: "tiny"
+            }
+          )
+        ]
       },
-      React.createElement(
-        Flex,
-        { variant: "row-center-start-nowrap-8", style: { minWidth: 100 } },
-        React.createElement(Switch, {
-          checked: phase.enabled,
-          size: "small",
-          readOnly: ro,
-          onChange: ro ? void 0 : (v) => updatePhase(phaseName, "enabled", v)
-        }),
-        React.createElement(Typography, {
-          variant: "smallCaption-regular",
-          color: phase.enabled ? "color-text-high" : "color-text-subtle"
-        }, label)
-      ),
-      isLlmPhase && React.createElement(ToggleGroup, {
-        options: [
-          { label: "Fast", value: "fast", icon: "speed", selected: currentTier === "fast", disabled: !phase.enabled },
-          { label: "Mid", value: "standard", icon: "balance", selected: currentTier === "standard", disabled: !phase.enabled },
-          { label: "Smart", value: "powerful", icon: "psychology", selected: currentTier === "powerful", disabled: !phase.enabled }
-        ],
-        onSelect: (v) => updatePhase(phaseName, "tier", v),
-        readOnly: ro,
-        size: "tiny"
-      })
+      phaseName
     );
   };
-  return React.createElement(
-    Flex,
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    import_plugin_ui_kit.Flex,
     {
       variant: "column-stretch-start-nowrap-0",
-      style: { width: "100%", height: "100%", overflow: "hidden" }
-    },
-    // ── Header bar ──
-    React.createElement(
-      Flex,
-      {
-        variant: "row-center-space-between-nowrap-8",
-        style: { padding: "8px 16px", flexShrink: 0, borderBottom: "1px solid var(--color-border-default)" }
-      },
-      React.createElement(
-        Flex,
-        { variant: "row-center-start-nowrap-8" },
-        React.createElement(IconButton, {
-          icon: "back",
-          size: "xs",
-          variant: "clear",
-          onClick: onCancel,
-          title: "Back"
-        }),
-        React.createElement(
-          Typography,
-          { variant: "caption-thick", color: "color-text-high" },
-          mode === "create" ? "Create Profile" : "Edit Profile"
-        )
-      ),
-      mode === "edit" && onDelete && React.createElement(IconButton, {
-        icon: "outlinedDelete",
-        size: "sm",
-        variant: "clear",
-        color: "danger",
-        onClick: handleDelete,
-        title: "Delete profile"
-      })
-    ),
-    // ── Scrollable form body ──
-    React.createElement(
-      ScrollArea,
-      {
-        style: { flex: 1, minHeight: 0 }
-      },
-      React.createElement(
-        Flex,
-        {
-          variant: "column-stretch-start-nowrap-10",
-          style: { padding: "12px 16px" }
-        },
-        // ── 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"
-          })
+      style: { width: "100%", height: "100%", overflow: "hidden" },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          import_plugin_ui_kit.Flex,
+          {
+            variant: "row-center-space-between-nowrap-8",
+            style: { padding: "8px 16px", flexShrink: 0, borderBottom: "1px solid var(--color-border-default)" },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "row-center-start-nowrap-8", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_plugin_ui_kit.IconButton,
+                  {
+                    icon: "back",
+                    size: "xs",
+                    variant: "clear",
+                    onClick: onCancel,
+                    title: "Back"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Typography, { variant: "caption-thick", color: "color-text-high", children: mode === "create" ? "Create Profile" : "Edit Profile" })
+              ] }),
+              mode === "edit" && onDelete && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_plugin_ui_kit.IconButton,
+                {
+                  icon: "outlinedDelete",
+                  size: "sm",
+                  variant: "clear",
+                  color: "danger",
+                  onClick: handleDelete,
+                  title: "Delete profile"
+                }
+              )
+            ]
+          }
         ),
-        // ── Knowledge Capabilities (checkbox grid) ──
-        React.createElement(
-          Field,
-          { label: "Knowledge", align: "start" },
-          React.createElement(
-            Flex,
-            { variant: "column-stretch-start-nowrap-2" },
-            ...BUILT_IN_CAPABILITIES.map(
-              (cap) => React.createElement(
-                Flex,
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.ScrollArea, { style: { flex: 1, minHeight: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          import_plugin_ui_kit.Flex,
+          {
+            variant: "column-stretch-start-nowrap-10",
+            style: { padding: "12px 16px" },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Name", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_plugin_ui_kit.Input,
+                {
+                  type: "text",
+                  size: "small",
+                  placeholder: "Profile name",
+                  value: name,
+                  onChange: (v) => setName(v),
+                  defaultBoxStyle: { flex: 1, minWidth: 0 },
+                  inputBoxStyle: { maxWidth: "none" }
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Description", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_plugin_ui_kit.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" }
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Bot", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_plugin_ui_kit.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 }
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Icon", align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_plugin_ui_kit.IconPicker,
+                {
+                  catalog: ICON_CATALOG,
+                  value: icon,
+                  onChange: (v) => setIcon(v),
+                  accentColor: color,
+                  variant: "inline"
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Color", align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_plugin_ui_kit.ColorPicker,
+                {
+                  colors: BOT_COLORS,
+                  value: color,
+                  onChange: (v) => setColor(v),
+                  variant: "inline"
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Preset", align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_plugin_ui_kit.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"
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Capabilities", align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Flex, { variant: "column-stretch-start-nowrap-2", children: BUILT_IN_CAPABILITIES.map((cap) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+                import_plugin_ui_kit.Flex,
                 {
-                  key: cap.name,
                   variant: "row-center-start-nowrap-8",
-                  style: { minHeight: 28, padding: "1px 0" }
+                  style: { minHeight: 28, padding: "1px 0" },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_plugin_ui_kit.Checkbox,
+                      {
+                        checked: knowledgeCaps.includes(cap.name),
+                        onChange: () => handleToggleKnowledgeCap(cap.name),
+                        disabled: cap.name === "core" || !isCustom,
+                        size: "sm"
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_plugin_ui_kit.Typography,
+                      {
+                        variant: "smallCaption-thick",
+                        color: knowledgeCaps.includes(cap.name) ? "color-text-high" : "color-text-subtle",
+                        style: { minWidth: 80 },
+                        children: cap.name
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_plugin_ui_kit.Typography,
+                      {
+                        variant: "smallCaption-regular",
+                        color: "color-text-subtle",
+                        style: { flex: 1 },
+                        children: cap.description
+                      }
+                    )
+                  ]
                 },
-                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(budget),
-              readOnly: !isCustom,
-              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(
-            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);
-            })
-          )
-        ),
-        // ── Escalation (always visible, readOnly when preset) ──
-        React.createElement(
-          Field,
-          { label: "Retries", align: "start" },
-          React.createElement(
-            Flex,
-            {
-              variant: "column-stretch-start-nowrap-8"
-            },
-            React.createElement(
-              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: "column-stretch-start-nowrap-4" },
-                React.createElement(
-                  Flex,
-                  { variant: "row-center-start-nowrap-4" },
-                  React.createElement(Input, {
-                    type: "text",
+                cap.name
+              )) }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Budget", align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "row-center-start-nowrap-6", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Typography, { variant: "smallCaption-regular", color: "color-text-subtle", children: "$" }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_plugin_ui_kit.Input,
+                  {
+                    type: "number",
                     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()
-                  })
+                    value: String(budget),
+                    readOnly: !isCustom,
+                    onChange: isCustom ? (v) => {
+                      const n = parseFloat(v);
+                      if (!isNaN(n) && n >= 0) setBudget(n);
+                    } : void 0,
+                    defaultBoxStyle: { width: 80 }
+                  }
                 ),
-                ...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" },
-              React.createElement(
-                Flex,
-                { variant: "column-stretch-start-nowrap-4" },
-                React.createElement(
-                  Flex,
-                  { variant: "row-center-start-nowrap-4" },
-                  React.createElement(Input, {
-                    type: "text",
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Typography, { variant: "smallCaption-regular", color: "color-text-subtle", children: "/ task" })
+              ] }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Phases", align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Flex, { variant: "column-stretch-start-nowrap-6", children: 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);
+              }) }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Retries", align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "column-stretch-start-nowrap-8", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Max attempts", labelWidth: 100, align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_plugin_ui_kit.Input,
+                  {
+                    type: "number",
                     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(
-                    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)
-                    })
+                    value: String(behavior.maxAttempts),
+                    readOnly: !isCustom,
+                    onChange: isCustom ? (v) => updateEscalation("maxAttempts", Math.max(1, parseInt(v) || 1)) : void 0,
+                    defaultBoxStyle: { width: 60 }
+                  }
+                ) }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "On exhausted", labelWidth: 100, align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_plugin_ui_kit.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"
+                  }
+                ) })
+              ] }) }),
+              isCustom && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Scope", align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "column-stretch-start-nowrap-8", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Blocked", labelWidth: 70, align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "column-stretch-start-nowrap-4", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "row-center-start-nowrap-4", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_plugin_ui_kit.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" }
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_plugin_ui_kit.IconButton,
+                      {
+                        icon: "add",
+                        size: "sm",
+                        variant: "outlined",
+                        color: "primary",
+                        onClick: () => handleAddScopePath("blocked"),
+                        disabled: !blockedInput.trim()
+                      }
+                    )
+                  ] }),
+                  behavior.blockedPaths.map((p, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "row-center-start-nowrap-6", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Icon, { name: "block", size: 12, color: "color-status-negative" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Typography, { variant: "smallCaption-regular", color: "color-text-high", style: { flex: 1 }, children: p }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_plugin_ui_kit.IconButton,
+                      {
+                        icon: "close",
+                        size: "xs",
+                        variant: "clear",
+                        color: "danger",
+                        onClick: () => handleRemoveScopePath("blocked", i)
+                      }
+                    )
+                  ] }, `b-${p}-${i}`))
+                ] }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Allowed", labelWidth: 70, align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "column-stretch-start-nowrap-4", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "row-center-start-nowrap-4", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_plugin_ui_kit.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" }
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_plugin_ui_kit.IconButton,
+                      {
+                        icon: "add",
+                        size: "sm",
+                        variant: "outlined",
+                        color: "primary",
+                        onClick: () => handleAddScopePath("allowed"),
+                        disabled: !allowedInput.trim()
+                      }
+                    )
+                  ] }),
+                  behavior.allowedPaths.map((p, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "row-center-start-nowrap-6", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Icon, { name: "checkCircle", size: 12, color: "color-status-positive" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Typography, { variant: "smallCaption-regular", color: "color-text-high", style: { flex: 1 }, children: p }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_plugin_ui_kit.IconButton,
+                      {
+                        icon: "close",
+                        size: "xs",
+                        variant: "clear",
+                        color: "danger",
+                        onClick: () => handleRemoveScopePath("allowed", i)
+                      }
+                    )
+                  ] }, `a-${p}-${i}`))
+                ] }) })
+              ] }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Capabilities", align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "column-stretch-start-nowrap-6", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_plugin_ui_kit.Flex, { variant: "row-center-start-nowrap-4", style: { minWidth: 0 }, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    import_plugin_ui_kit.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 }
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    import_plugin_ui_kit.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 }
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    import_plugin_ui_kit.IconButton,
+                    {
+                      icon: "add",
+                      size: "sm",
+                      variant: "outlined",
+                      color: "primary",
+                      onClick: handleAddCapability,
+                      disabled: !capName.trim() || !capDescription.trim(),
+                      style: { flexShrink: 0 }
+                    }
                   )
+                ] }),
+                capabilities.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_plugin_ui_kit.Table,
+                  {
+                    size: "compact",
+                    showHeader: false,
+                    data: capabilities,
+                    getRowKey: (_row, i) => `cap-${i}`,
+                    columns: [
+                      {
+                        key: "name",
+                        header: "Name",
+                        width: "30%",
+                        render: (val) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { lineHeight: "28px" }, children: String(val) })
+                      },
+                      {
+                        key: "description",
+                        header: "Description",
+                        render: (val) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { lineHeight: "28px" }, children: String(val) })
+                      },
+                      {
+                        key: "actions",
+                        header: "",
+                        width: "32px",
+                        align: "right",
+                        render: (_val, _row, idx) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                          import_plugin_ui_kit.IconButton,
+                          {
+                            icon: "close",
+                            size: "xs",
+                            variant: "clear",
+                            color: "danger",
+                            onClick: () => handleRemoveCapability(idx)
+                          }
+                        )
+                      }
+                    ]
+                  }
                 )
-              )
-            )
-          )
-        ),
-        // ── Capabilities ──
-        React.createElement(
-          Field,
-          { label: "Capabilities", align: "start" },
-          React.createElement(
-            Flex,
-            { 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: [
+              ] }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "Instructions", align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_plugin_ui_kit.Input,
                 {
-                  key: "name",
-                  header: "Name",
-                  width: "30%",
-                  render: (val) => React.createElement("div", { style: { lineHeight: "28px" } }, String(val))
-                },
+                  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" }
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Field, { label: "", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_plugin_ui_kit.Checkbox,
                 {
-                  key: "description",
-                  header: "Description",
-                  render: (val) => React.createElement("div", { style: { lineHeight: "28px" } }, String(val))
-                },
+                  checked: requireApproval,
+                  onChange: (v) => setRequireApproval(v),
+                  label: "Require approval",
+                  size: "sm"
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_plugin_ui_kit.Flex, { variant: "row-center-end-nowrap-8", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_plugin_ui_kit.Button,
                 {
-                  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)
-                  })
+                  size: "xs",
+                  variant: "fill",
+                  color: "primary",
+                  onClick: handleSave,
+                  disabled: !name.trim() || !botId || capabilities.length === 0,
+                  children: 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")
-        )
-      )
-    )
+              ) })
+            ]
+          }
+        ) })
+      ]
+    }
   );
 }
 var profile_editor_default = ProfileEditor;
-module.exports = ProfileEditor;