@synergenius/flow-weaver-pack-weaver 0.9.62 → 0.9.78

package/dist/ui/swarm-dashboard.js

@@ -1,7 +1,9 @@
 "use strict";
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -15,6 +17,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/ui/swarm-dashboard.tsx
@@ -37,17 +47,17 @@ var {
   toast,
   usePackWorkspace
 } = require("@fw/plugin-ui-kit");
-function statusToVariant(status) {
+function swarmStatusToIconStatus(status) {
   switch (status) {
     case "running":
-      return "positive";
+      return "running";
     case "paused":
-      return "caution";
+      return "pending";
     case "stopping":
-      return "negative";
+      return "failed";
     case "idle":
     default:
-      return "neutral";
+      return "completed";
   }
 }
 function statusLabel(status) {
@@ -63,9 +73,9 @@ function statusLabel(status) {
       return "Idle";
   }
 }
-function countActiveBots(bots) {
-  const entries = Object.values(bots);
-  const active = entries.filter((b) => b.status === "executing").length;
+function countActiveInstances(instances) {
+  const entries = Object.values(instances);
+  const active = entries.filter((i) => i.status === "executing").length;
   return { active, total: entries.length };
 }
 function SwarmControls({ swarmStatus, onRefresh }) {
@@ -74,8 +84,8 @@ function SwarmControls({ swarmStatus, onRefresh }) {
   const [pausing, setPausing] = useState(false);
   const [stopping, setStopping] = useState(false);
   const status = swarmStatus?.status ?? "idle";
-  const bots = swarmStatus?.bots ?? {};
-  const { active, total } = countActiveBots(bots);
+  const instances = swarmStatus?.instances ?? {};
+  const { active, total } = countActiveInstances(instances);
   const isIdle = status === "idle";
   const isRunning = status === "running";
   const isPaused = status === "paused";
@@ -133,6 +143,15 @@ function SwarmControls({ swarmStatus, onRefresh }) {
   }, [ctx, onRefresh]);
   const handleStop = useCallback(async () => {
     setStopping(true);
+    const ok = await ctx.confirm("This will stop all running instances and abort active tasks.", {
+      title: "Stop Swarm",
+      confirmLabel: "Stop",
+      state: "danger"
+    });
+    if (!ok) {
+      setStopping(false);
+      return;
+    }
     try {
       const result = await ctx.callTool("fw_weaver_swarm_stop", {});
       const data = result;
@@ -154,9 +173,9 @@ function SwarmControls({ swarmStatus, onRefresh }) {
     {
       variant: "row-center-space-between-nowrap-10",
       style: {
-        flexShrink: 0,
         padding: "8px 16px",
         borderBottom: "1px solid var(--color-border-default)",
+        flexShrink: 0,
         backgroundColor: isRunning ? "var(--color-brand-main-alpha-10)" : isPaused ? "var(--color-status-caution-alpha-10)" : "transparent"
       }
     },
@@ -165,12 +184,11 @@ function SwarmControls({ swarmStatus, onRefresh }) {
       Flex,
       { variant: "row-center-start-nowrap-8", style: { flexShrink: 0 } },
       React.createElement(StatusIcon, {
-        variant: statusToVariant(status),
-        size: 10
+        status: swarmStatusToIconStatus(status),
+        size: "sm"
       }),
       React.createElement(Typography, {
-        variant: "caption-bold",
-        style: { textTransform: "capitalize" }
+        variant: "caption-bold"
       }, statusLabel(status))
     ),
     // Center: bot count + stats
@@ -178,7 +196,7 @@ function SwarmControls({ swarmStatus, onRefresh }) {
       Flex,
       {
         variant: "row-center-start-nowrap-12",
-        style: { flex: 1, fontSize: "12px" }
+        style: { flex: 1 }
       },
       total > 0 && React.createElement(Typography, {
         variant: "caption-regular",
@@ -196,27 +214,29 @@ function SwarmControls({ swarmStatus, onRefresh }) {
     // Right: action buttons
     React.createElement(
       Flex,
-      { variant: "row-center-start-nowrap-6", style: { flexShrink: 0 } },
+      { variant: "row-center-start-nowrap-4", style: { flexShrink: 0 } },
       // Start / Resume button
       (isIdle || isPaused) && React.createElement(Button, {
-        size: "sm",
-        variant: "clear",
+        size: "xs",
+        variant: "outlined",
+        color: "primary",
         onClick: isPaused ? handleResume : handleStart,
         loading: starting,
         disabled: anyLoading
       }, isPaused ? "Resume" : "Start"),
       // Pause button (only when running)
       isRunning && React.createElement(Button, {
-        size: "sm",
-        variant: "clear",
+        size: "xs",
+        variant: "outlined",
+        color: "warning",
         onClick: handlePause,
         loading: pausing,
         disabled: anyLoading
       }, "Pause"),
       // Stop button (when running or paused)
       (isRunning || isPaused) && React.createElement(Button, {
-        size: "sm",
-        variant: "clear",
+        size: "xs",
+        variant: "outlined",
         color: "danger",
         onClick: handleStop,
         loading: stopping,
@@ -224,12 +244,11 @@ function SwarmControls({ swarmStatus, onRefresh }) {
       }, "Stop"),
       // Refresh button (always available)
       React.createElement(IconButton, {
-        icon: "refresh",
+        icon: "reset",
         size: "xs",
-        variant: "clear",
+        variant: "outlined",
         onClick: onRefresh,
-        disabled: anyLoading,
-        title: "Refresh swarm status"
+        disabled: anyLoading
       })
     )
   );
@@ -257,11 +276,13 @@ function BudgetBar({ label, used, limit, unit }) {
       )
     ),
     React2.createElement(
-      "div",
+      Flex2,
       {
-        style: { width: "100%", height: "4px", borderRadius: "2px", backgroundColor: "var(--color-surface-raised)" }
+        variant: "row-start-start-nowrap-0",
+        style: { width: "100%", height: "4px", borderRadius: "2px", backgroundColor: "var(--color-surface-raised)", overflow: "hidden" }
       },
-      React2.createElement("div", {
+      React2.createElement(Flex2, {
+        variant: "row-start-start-nowrap-0",
         style: { width: `${pct}%`, height: "100%", borderRadius: "2px", backgroundColor: color, transition: "width 0.3s" }
       })
     )
@@ -271,20 +292,8 @@ var budget_bar_default = BudgetBar;
 module.exports = BudgetBar;
 
 // src/ui/bot-slot-card.tsx
-var React3 = require("react");
-var { Flex: Flex3, Typography: Typography3, IconButton: IconButton2, StatusIcon: StatusIcon2, Icon } = require("@fw/plugin-ui-kit");
-var statusToDot = {
-  idle: "neutral",
-  executing: "info",
-  paused: "caution",
-  stopped: "negative"
-};
-var statusToIcon = {
-  idle: "pending",
-  executing: "running",
-  paused: "pause",
-  stopped: "stop"
-};
+var import_react = __toESM(require("react"), 1);
+var import_plugin_ui_kit = require("@fw/plugin-ui-kit");
 var statusToLabel = {
   idle: "Idle",
   executing: "Executing",
@@ -300,133 +309,100 @@ function formatCost(n) {
   if (n < 0.01 && n > 0) return "<$0.01";
   return `$${n.toFixed(2)}`;
 }
-function BotSlotCard({ bot, currentTaskTitle, onPause, onResume, onStop }) {
+function BotSlotCard({ bot, currentTaskTitle, profileName, botDisplayName, botIcon, botColor, onPause, onResume, onStop }) {
   const { botId, botName, status, currentTaskId, tokensUsed, cost } = bot;
-  const dotStatus = statusToDot[status] ?? "neutral";
-  const iconName = statusToIcon[status] ?? "pending";
-  const label = statusToLabel[status] ?? status;
   const isExecuting = status === "executing";
   const isPaused = status === "paused";
-  const iconColor = dotStatus === "neutral" ? "color-text-subtle" : `color-status-${dotStatus}`;
-  const taskText = isExecuting ? currentTaskTitle || currentTaskId || "Working..." : null;
-  const actions = React3.createElement(
-    Flex3,
+  const label = statusToLabel[status] ?? status;
+  const taskText = isExecuting ? currentTaskTitle || currentTaskId || "-" : "-";
+  return import_react.default.createElement(
+    import_plugin_ui_kit.Flex,
     {
-      variant: "row-center-center-nowrap-2",
-      style: { marginTop: "4px" }
+      variant: "row-center-start-nowrap-8",
+      style: { padding: "6px 16px", minHeight: "38px", borderBottom: "1px solid var(--color-border-default)" }
     },
-    // Pause / Resume button
-    isExecuting && onPause ? React3.createElement(IconButton2, {
-      icon: "pause",
-      size: "xs",
-      variant: "clear",
-      onClick: (e) => {
-        e.stopPropagation();
-        onPause(botId);
-      },
-      title: "Pause bot"
-    }) : null,
-    isPaused && onResume ? React3.createElement(IconButton2, {
-      icon: "playArrow",
-      size: "xs",
-      variant: "clear",
-      onClick: (e) => {
-        e.stopPropagation();
-        onResume(botId);
-      },
-      title: "Resume bot"
-    }) : null,
-    // Stop button (available when executing or paused)
-    (isExecuting || isPaused) && onStop ? React3.createElement(IconButton2, {
-      icon: "stop",
-      size: "xs",
-      variant: "clear",
-      onClick: (e) => {
-        e.stopPropagation();
-        onStop(botId);
+    // Instance name
+    import_react.default.createElement(import_plugin_ui_kit.Typography, {
+      variant: "smallCaption-regular",
+      color: "color-text-high",
+      style: { width: "120px", flexShrink: 0 }
+    }, profileName ? `${profileName} #${botId.split("-").pop() ?? "0"}` : botName),
+    // Bot (icon + name)
+    import_react.default.createElement(
+      import_plugin_ui_kit.Flex,
+      {
+        variant: "row-center-start-nowrap-4",
+        style: { width: "110px", flexShrink: 0, color: botColor ? `var(--${botColor})` : void 0 }
       },
-      title: "Stop bot"
-    }) : null
-  );
-  const hasActions = isExecuting && onPause || isPaused && onResume || (isExecuting || isPaused) && onStop;
-  return React3.createElement(
-    "div",
-    {
-      style: {
-        width: "120px",
-        minWidth: "120px",
-        padding: "8px",
-        borderRadius: "var(--border-radius-secondary)",
-        border: "1px solid var(--color-border-default)",
-        backgroundColor: "var(--color-surface-elevated)",
-        display: "flex",
-        flexDirection: "column",
-        gap: "4px",
-        flexShrink: 0
-      }
-    },
-    // Row 1: Status icon + bot name
-    React3.createElement(
-      Flex3,
-      { variant: "row-center-start-nowrap-4" },
-      React3.createElement(Icon, {
-        name: iconName,
-        size: 12,
-        color: iconColor
-      }),
-      React3.createElement(Typography3, {
-        variant: "caption-thick",
-        color: "color-text-high",
-        style: {
-          overflow: "hidden",
-          textOverflow: "ellipsis",
-          whiteSpace: "nowrap",
-          flex: 1,
-          minWidth: 0
-        }
-      }, botName)
+      import_react.default.createElement(import_plugin_ui_kit.Icon, { name: botIcon || "smartToy", size: 12 }),
+      import_react.default.createElement(import_plugin_ui_kit.Typography, {
+        variant: "smallCaption-regular",
+        color: "color-text-subtle"
+      }, botDisplayName || "-")
     ),
-    // Row 2: Status label
-    React3.createElement(Typography3, {
+    // Status
+    import_react.default.createElement(import_plugin_ui_kit.Typography, {
       variant: "smallCaption-regular",
-      color: iconColor,
-      style: { textTransform: "capitalize" }
+      color: isExecuting ? "color-brand-main" : "color-text-subtle",
+      style: { width: "70px", flexShrink: 0 }
     }, label),
-    // Row 3: Current task (if executing)
-    taskText ? React3.createElement(Typography3, {
+    // Current task
+    import_react.default.createElement(import_plugin_ui_kit.Typography, {
       variant: "smallCaption-regular",
-      color: "color-text-medium",
-      style: {
-        overflow: "hidden",
-        textOverflow: "ellipsis",
-        whiteSpace: "nowrap"
-      }
-    }, taskText) : null,
-    // Row 4: Tokens + cost
-    React3.createElement(
-      Flex3,
-      { variant: "row-center-between-nowrap-4", style: { marginTop: "auto" } },
-      React3.createElement(Typography3, {
-        variant: "smallCaption-regular",
-        color: "color-text-subtle"
-      }, formatTokens(tokensUsed)),
-      React3.createElement(Typography3, {
-        variant: "smallCaption-regular",
-        color: "color-text-subtle"
-      }, formatCost(cost))
-    ),
-    // Row 5: Actions (optional)
-    hasActions ? actions : null
+      color: isExecuting ? "color-text-medium" : "color-text-subtle",
+      style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }
+    }, taskText),
+    // Tokens
+    import_react.default.createElement(import_plugin_ui_kit.Typography, {
+      variant: "smallCaption-regular",
+      color: "color-text-subtle",
+      style: { width: "50px", flexShrink: 0, textAlign: "right" }
+    }, formatTokens(tokensUsed)),
+    // Cost
+    import_react.default.createElement(import_plugin_ui_kit.Typography, {
+      variant: "smallCaption-regular",
+      color: "color-text-subtle",
+      style: { width: "50px", flexShrink: 0, textAlign: "right" }
+    }, formatCost(cost)),
+    // Actions
+    import_react.default.createElement(
+      import_plugin_ui_kit.Flex,
+      {
+        variant: "row-center-end-nowrap-1",
+        style: { width: "50px", flexShrink: 0 }
+      },
+      isExecuting && onPause && import_react.default.createElement(import_plugin_ui_kit.IconButton, {
+        icon: "pause",
+        size: "xs",
+        variant: "clear",
+        onClick: () => onPause(botId),
+        title: "Pause"
+      }),
+      isPaused && onResume && import_react.default.createElement(import_plugin_ui_kit.IconButton, {
+        icon: "playArrow",
+        size: "xs",
+        variant: "clear",
+        onClick: () => onResume(botId),
+        title: "Resume"
+      }),
+      (isExecuting || isPaused) && onStop && import_react.default.createElement(import_plugin_ui_kit.IconButton, {
+        icon: "stop",
+        size: "xs",
+        variant: "clear",
+        color: "danger",
+        onClick: () => onStop(botId),
+        title: "Stop"
+      })
+    )
   );
 }
 var bot_slot_card_default = BotSlotCard;
-module.exports = BotSlotCard;
 
 // src/ui/task-pool-list.tsx
 var React4 = require("react");
-var { Flex: Flex4, Typography: Typography4, Icon: Icon2, StatusIcon: StatusIcon3, Tag, ScrollArea, Badge } = require("@fw/plugin-ui-kit");
-var { styled } = require("@fw/plugin-theme");
-var statusToIcon2 = {
+var { useState: useState2 } = React4;
+var { Flex: Flex4, Typography: Typography4, Icon: Icon2, StatusIcon: StatusIcon2, Tag, ScrollArea, Badge, EmptyState } = require("@fw/plugin-ui-kit");
+var statusToIcon = {
   "pending": "pending",
   "in-progress": "running",
   "done": "completed",
@@ -434,50 +410,15 @@ var statusToIcon2 = {
   "blocked": "pending",
   "cancelled": "failed"
 };
-var statusToColor = {
-  "pending": "color-text-subtle",
-  "in-progress": "color-status-info",
-  "done": "color-status-positive",
-  "failed": "color-status-negative",
-  "blocked": "color-status-caution",
-  "cancelled": "color-text-subtle"
-};
-var Container = styled.div({
-  display: "flex",
-  flexDirection: "column",
-  height: "100%",
-  overflow: "hidden"
-});
-var TaskRow = styled.div({
-  display: "flex",
-  alignItems: "center",
-  gap: "8px",
+var rowBaseStyle = {
   padding: "8px 12px",
   cursor: "pointer",
-  borderBottom: "1px solid $color-border-default",
-  "&:hover": { backgroundColor: "$color-surface-elevated" }
-});
-var TitleText = styled.div({
-  flex: 1,
-  overflow: "hidden",
-  textOverflow: "ellipsis",
-  whiteSpace: "nowrap",
-  minWidth: 0
-});
-var BotTags = styled.div({
-  display: "flex",
-  gap: "4px",
-  flexShrink: 0
-});
-var EmptyState = styled.div({
-  display: "flex",
-  flexDirection: "column",
-  alignItems: "center",
-  justifyContent: "center",
-  gap: "8px",
-  padding: "24px 16px",
-  flex: 1
-});
+  borderBottom: "1px solid var(--color-border-default)"
+};
+var indentedRowStyle = {
+  ...rowBaseStyle,
+  paddingLeft: "32px"
+};
 function sortTasks(tasks) {
   return [...tasks].sort((a, b) => {
     if (b.priority !== a.priority) return b.priority - a.priority;
@@ -513,65 +454,75 @@ function buildHierarchy(tasks) {
   }
   return result;
 }
-function TaskPoolList({ tasks, onTaskClick }) {
-  if (!tasks || tasks.length === 0) {
-    return React4.createElement(
-      EmptyState,
-      null,
-      React4.createElement(Icon2, { name: "inbox", size: 20, color: "color-text-subtle" }),
+function TaskRowItem({ task, indent, onClick }) {
+  const [hovered, setHovered] = useState2(false);
+  const style = {
+    ...indent ? indentedRowStyle : rowBaseStyle,
+    ...hovered ? { backgroundColor: "var(--color-surface-elevated)" } : void 0
+  };
+  return React4.createElement(
+    Flex4,
+    {
+      variant: "row-center-start-nowrap-8",
+      style,
+      onClick,
+      onMouseEnter: () => setHovered(true),
+      onMouseLeave: () => setHovered(false)
+    },
+    // Status icon
+    React4.createElement(StatusIcon2, {
+      status: statusToIcon[task.status] || "pending",
+      size: "sm"
+    }),
+    // Title
+    React4.createElement(
+      Flex4,
+      {
+        variant: "row-center-start-nowrap-0",
+        style: { flex: 1, minWidth: 0 }
+      },
       React4.createElement(Typography4, {
         variant: "caption-regular",
-        color: "color-text-subtle"
-      }, "No tasks in the pool.")
-    );
+        color: task.status === "cancelled" ? "color-text-subtle" : "color-text-high",
+        truncate: true,
+        style: task.status === "cancelled" ? { textDecoration: "line-through", opacity: 0.6 } : void 0
+      }, task.title)
+    ),
+    // Assigned profile as Tag
+    task.assignedProfile && React4.createElement(Tag, {
+      size: "small",
+      color: "info"
+    }, task.assignedProfile),
+    // Priority badge (only if > 0)
+    task.priority > 0 && React4.createElement(Badge, {
+      variant: task.priority >= 3 ? "warning" : "info"
+    }, `P${task.priority}`)
+  );
+}
+function TaskPoolList({ tasks, onTaskClick }) {
+  if (!tasks || tasks.length === 0) {
+    return React4.createElement(EmptyState, {
+      icon: "inbox",
+      message: "No tasks in the pool."
+    });
   }
   const rows = buildHierarchy(tasks);
   return React4.createElement(
-    Container,
-    null,
+    Flex4,
+    {
+      variant: "column-stretch-start-nowrap-0",
+      style: { height: "100%", overflow: "hidden" }
+    },
     React4.createElement(
       ScrollArea,
       { style: { flex: 1 } },
       rows.map(
-        ({ task, indent }) => React4.createElement(
-          TaskRow,
-          {
-            key: task.id,
-            style: indent ? { paddingLeft: "32px" } : void 0,
-            onClick: () => onTaskClick(task.id)
-          },
-          // Status icon
-          React4.createElement(StatusIcon3, {
-            status: statusToIcon2[task.status] || "pending",
-            size: "sm"
-          }),
-          // Title
-          React4.createElement(
-            TitleText,
-            null,
-            React4.createElement(Typography4, {
-              variant: "caption-regular",
-              color: statusToColor[task.status] === "color-text-subtle" && task.status === "cancelled" ? "color-text-subtle" : "color-text-high",
-              style: task.status === "cancelled" ? { textDecoration: "line-through", opacity: 0.6 } : void 0
-            }, task.title)
-          ),
-          // Assigned bots as Tags
-          task.assignedBots.length > 0 && React4.createElement(
-            BotTags,
-            null,
-            task.assignedBots.map(
-              (botId) => React4.createElement(Tag, {
-                key: botId,
-                size: "small",
-                color: "info"
-              }, botId)
-            )
-          ),
-          // Priority badge (only if > 0)
-          task.priority > 0 && React4.createElement(Badge, {
-            variant: task.priority >= 3 ? "warning" : "info"
-          }, `P${task.priority}`)
-        )
+        ({ task, indent }) => React4.createElement(TaskRowItem, {
+          key: task.id,
+          task,
+          indent,
+          onClick: () => onTaskClick(task.id)
+        })
       )
     )
   );
@@ -580,16 +531,9 @@ var task_pool_list_default = TaskPoolList;
 module.exports = TaskPoolList;
 
 // src/ui/task-create-form.tsx
-var React5 = require("react");
-var { useState: useState2, useCallback: useCallback2 } = React5;
-var {
-  Flex: Flex5,
-  Typography: Typography5,
-  Input,
-  Button: Button2,
-  toast: toast2,
-  usePackWorkspace: usePackWorkspace2
-} = require("@fw/plugin-ui-kit");
+var import_react2 = __toESM(require("react"), 1);
+var import_plugin_ui_kit2 = require("@fw/plugin-ui-kit");
+var { useState: useState3, useCallback: useCallback2 } = import_react2.default;
 function parseToolResult(raw) {
   if (typeof raw === "string") {
     try {
@@ -601,140 +545,60 @@ function parseToolResult(raw) {
   return raw;
 }
 function TaskCreateForm({ onTaskCreated }) {
-  const ctx = usePackWorkspace2();
+  const ctx = (0, import_plugin_ui_kit2.usePackWorkspace)();
   const { callTool } = ctx;
-  const [open, setOpen] = useState2(false);
-  const [title, setTitle] = useState2("");
-  const [description, setDescription] = useState2("");
-  const [priority, setPriority] = useState2("0");
-  const [creating, setCreating] = useState2(false);
-  const toggleOpen = useCallback2(() => setOpen((v) => !v), []);
+  const [title, setTitle] = useState3("");
+  const [creating, setCreating] = useState3(false);
   const handleCreate = useCallback2(async () => {
-    const trimmedTitle = title.trim();
-    if (!trimmedTitle) {
-      toast2("Title is required", { type: "error" });
-      return;
-    }
+    const trimmed = title.trim();
+    if (!trimmed) return;
     setCreating(true);
     try {
-      const raw = await callTool("fw_weaver_task_create", {
-        title: trimmedTitle,
-        description: description.trim() || void 0,
-        priority: Number(priority) || 0
-      });
+      const raw = await callTool("fw_weaver_task_create", { title: trimmed });
       const result = parseToolResult(raw);
-      const taskTitle = result?.task?.title ?? trimmedTitle;
-      toast2(`Task created: ${taskTitle}`, { type: "success" });
+      (0, import_plugin_ui_kit2.toast)(`Task created: ${result?.task?.title ?? trimmed}`, { type: "success" });
       setTitle("");
-      setDescription("");
-      setPriority("0");
       onTaskCreated?.();
     } catch (err) {
-      toast2(err instanceof Error ? err.message : "Failed to create task", { type: "error" });
+      (0, import_plugin_ui_kit2.toast)(err instanceof Error ? err.message : "Failed to create task", { type: "error" });
     } finally {
       setCreating(false);
     }
-  }, [title, description, priority, callTool, onTaskCreated]);
-  const toggleButton = React5.createElement(Button2, {
-    variant: "ghost",
-    size: "sm",
-    onClick: toggleOpen,
-    style: { width: "100%" }
-  }, open ? "\u25BE Hide create form" : "\u25B8 Create new task");
-  if (!open) {
-    return React5.createElement(Flex5, {
-      variant: "column-start-start-nowrap-4",
-      style: { width: "100%" }
-    }, toggleButton);
-  }
-  const titleField = React5.createElement(
-    Flex5,
+  }, [title, callTool, onTaskCreated]);
+  return import_react2.default.createElement(
+    import_plugin_ui_kit2.Flex,
     {
-      variant: "column-start-start-nowrap-2",
-      style: { width: "100%" }
+      variant: "row-center-start-nowrap-6"
     },
-    React5.createElement(Typography5, { variant: "smallCaption-regular", color: "color-text-subtle" }, "Title *"),
-    React5.createElement(Input, {
-      placeholder: "Task title",
+    import_react2.default.createElement(import_plugin_ui_kit2.Input, {
+      type: "text",
+      size: "small",
+      placeholder: "What needs to be done?",
       value: title,
       onChange: (v) => setTitle(v),
-      disabled: creating
-    })
-  );
-  const descriptionField = React5.createElement(
-    Flex5,
-    {
-      variant: "column-start-start-nowrap-2",
-      style: { width: "100%" }
-    },
-    React5.createElement(Typography5, { variant: "smallCaption-regular", color: "color-text-subtle" }, "Description"),
-    React5.createElement(Input, {
-      placeholder: "Detailed instructions for the task",
-      value: description,
-      onChange: (v) => setDescription(v),
+      onEnter: handleCreate,
       disabled: creating,
-      multiline: true
-    })
-  );
-  const priorityField = React5.createElement(
-    Flex5,
-    {
-      variant: "column-start-start-nowrap-2",
-      style: { width: "100%" }
-    },
-    React5.createElement(Typography5, { variant: "smallCaption-regular", color: "color-text-subtle" }, "Priority"),
-    React5.createElement(Input, {
-      placeholder: "0",
-      value: priority,
-      onChange: (v) => setPriority(v),
-      disabled: creating,
-      type: "number"
+      defaultBoxStyle: { flex: 1, minWidth: 0 },
+      inputBoxStyle: { maxWidth: "none" }
+    }),
+    import_react2.default.createElement(import_plugin_ui_kit2.IconButton, {
+      icon: "add",
+      size: "sm",
+      variant: "fill",
+      color: "primary",
+      onClick: handleCreate,
+      disabled: creating || !title.trim(),
+      loading: creating
     })
   );
-  const createButton = React5.createElement(Button2, {
-    variant: "primary",
-    size: "sm",
-    onClick: handleCreate,
-    disabled: creating || !title.trim(),
-    style: { width: "100%" }
-  }, creating ? "Creating\u2026" : "Create Task");
-  return React5.createElement(
-    Flex5,
-    {
-      variant: "column-start-start-nowrap-4",
-      style: {
-        width: "100%",
-        padding: "0"
-      }
-    },
-    toggleButton,
-    React5.createElement(
-      Flex5,
-      {
-        variant: "column-start-start-nowrap-8",
-        style: {
-          width: "100%",
-          padding: "8px",
-          borderRadius: "6px",
-          backgroundColor: "var(--color-surface-raised)"
-        }
-      },
-      React5.createElement(Typography5, { variant: "caption-medium" }, "New Task"),
-      titleField,
-      descriptionField,
-      priorityField,
-      createButton
-    )
-  );
 }
 var task_create_form_default = TaskCreateForm;
-module.exports = TaskCreateForm;
 
 // src/ui/use-stream-timeline.ts
 var React6 = require("react");
-var { useMemo, useState: useState3, useEffect, useRef } = React6;
+var { useMemo, useState: useState4, useEffect, useRef } = React6;
 function useStreamTimeline(events, isDone) {
-  const [elapsed, setElapsed] = useState3(0);
+  const [elapsed, setElapsed] = useState4(0);
   const startTimeRef = useRef(null);
   useEffect(() => {
     if (events.length === 0) {
@@ -992,23 +856,29 @@ function traceToTimeline(run) {
 
 // src/ui/task-detail-view.tsx
 var React7 = require("react");
-var { useState: useState4, useEffect: useEffect2, useCallback: useCallback3, useRef: useRef2, useMemo: useMemo2 } = React7;
+var { useState: useState5, useEffect: useEffect2, useCallback: useCallback3, useRef: useRef2, useMemo: useMemo2 } = React7;
 var {
   Flex: Flex6,
-  Typography: Typography6,
+  Typography: Typography5,
   ScrollArea: ScrollArea2,
-  StatusIcon: StatusIcon4,
+  StatusIcon: StatusIcon3,
   Tag: Tag2,
   Badge: Badge2,
   Icon: Icon3,
+  IconButton: IconButton4,
   TaskBlock,
-  Button: Button3,
+  Button: Button2,
+  Card,
+  Chip,
+  Checkbox,
+  Table,
+  Tabs,
+  EmptyState: EmptyState2,
   toast: toast3,
   usePackWorkspace: usePackWorkspace3,
   useEventStream
 } = require("@fw/plugin-ui-kit");
-var { styled: styled2 } = require("@fw/plugin-theme");
-var statusToIcon3 = {
+var statusToIcon2 = {
   "pending": "pending",
   "in-progress": "running",
   "done": "completed",
@@ -1024,92 +894,84 @@ var statusToLabel2 = {
   "blocked": "Blocked",
   "cancelled": "Cancelled"
 };
-var priorityLabel = (p) => p >= 3 ? "High" : p === 2 ? "Medium" : p === 1 ? "Low" : "None";
-var Container2 = styled2.div({
-  display: "flex",
-  flexDirection: "column",
-  width: "100%",
-  height: "100%",
-  overflow: "hidden"
-});
-var Header = styled2.div({
+var headerStyle = {
   padding: "12px 16px",
-  borderBottom: "1px solid $color-border-default",
-  display: "flex",
-  flexDirection: "column",
-  gap: "8px",
+  borderBottom: "1px solid var(--color-border-default)",
   flexShrink: 0
-});
-var HeaderTopRow = styled2.div({
-  display: "flex",
-  alignItems: "center",
-  gap: "8px"
-});
-var HeaderMeta = styled2.div({
-  display: "flex",
-  alignItems: "center",
-  gap: "8px",
-  flexWrap: "wrap"
-});
-var Section = styled2.div({
-  padding: "12px 16px",
-  borderBottom: "1px solid $color-border-default"
-});
-var SectionTitle = styled2.div({
-  marginBottom: "8px"
-});
-var FileList = styled2.div({
-  display: "flex",
-  flexDirection: "column",
-  gap: "2px"
-});
-var FileItem = styled2.div({
+};
+var fileItemStyle = {
   fontFamily: "monospace",
   fontSize: "12px",
-  color: "$color-text-mid",
+  color: "var(--color-text-mid)",
   padding: "2px 4px",
-  borderRadius: "4px",
-  "&:hover": { backgroundColor: "$color-surface-elevated" }
-});
-var NotesBlock = styled2.div({
-  whiteSpace: "pre-wrap",
-  fontSize: "13px",
-  color: "$color-text-mid",
-  lineHeight: 1.5,
-  padding: "4px 0"
-});
-var SubtaskRow = styled2.div({
-  display: "flex",
-  alignItems: "center",
-  gap: "8px",
+  borderRadius: "4px"
+};
+var fileItemHoverStyle = {
+  ...fileItemStyle,
+  backgroundColor: "var(--color-surface-elevated)"
+};
+var subtaskRowStyle = {
   padding: "6px 8px",
   cursor: "pointer",
-  borderRadius: "6px",
-  "&:hover": { backgroundColor: "$color-surface-elevated" }
-});
-var SubtaskTitle = styled2.div({
-  flex: 1,
-  overflow: "hidden",
-  textOverflow: "ellipsis",
-  whiteSpace: "nowrap",
-  minWidth: 0
-});
+  borderRadius: "6px"
+};
+var subtaskRowHoverStyle = {
+  ...subtaskRowStyle,
+  backgroundColor: "var(--color-surface-elevated)"
+};
+function SubtaskRowItem({ sub, onBack }) {
+  const [hovered, setHovered] = useState5(false);
+  return React7.createElement(
+    Flex6,
+    {
+      variant: "row-center-start-nowrap-8",
+      style: hovered ? subtaskRowHoverStyle : subtaskRowStyle,
+      onClick: () => onBack(),
+      onMouseEnter: () => setHovered(true),
+      onMouseLeave: () => setHovered(false)
+    },
+    React7.createElement(StatusIcon3, {
+      status: statusToIcon2[sub.status] || "pending",
+      size: "sm"
+    }),
+    React7.createElement(
+      Flex6,
+      {
+        variant: "row-center-start-nowrap-0",
+        style: { flex: 1, minWidth: 0 }
+      },
+      React7.createElement(Typography5, { variant: "caption-regular", truncate: true }, sub.title)
+    ),
+    sub.assignedProfile && React7.createElement(Tag2, {
+      size: "small",
+      color: "info"
+    }, sub.assignedProfile),
+    React7.createElement(Typography5, {
+      variant: "caption-regular",
+      color: "color-text-subtle"
+    }, `#${sub.attempt}`)
+  );
+}
 function TaskDetailView({ taskId, onBack }) {
   const ctx = usePackWorkspace3();
   const { callTool } = ctx;
   const packId = ctx.packId;
-  const [task, setTask] = useState4(null);
-  const [subtasks, setSubtasks] = useState4([]);
-  const [history, setHistory] = useState4([]);
-  const [loading, setLoading] = useState4(true);
+  const [task, setTask] = useState5(null);
+  const [subtasks, setSubtasks] = useState5([]);
+  const [history, setHistory] = useState5([]);
+  const [loading, setLoading] = useState5(true);
   const fetchTask = useCallback3(async () => {
     try {
-      const data = await callTool("fw_weaver_task_get", { id: taskId });
+      const raw = await callTool("fw_weaver_task_get", { id: taskId });
+      const data = typeof raw === "string" ? JSON.parse(raw) : raw;
       if (!data) return;
-      const t = data;
+      const t = data.task ?? data;
       setTask(t);
-      if (t.isParent) {
-        const listData = await callTool("fw_weaver_task_list", { parentId: taskId });
+      if (data.subtasks && Array.isArray(data.subtasks)) {
+        setSubtasks(data.subtasks);
+      } else if (t.isParent) {
+        const listRaw = await callTool("fw_weaver_task_list", { parentId: taskId });
+        const listData = typeof listRaw === "string" ? JSON.parse(listRaw) : listRaw;
         if (Array.isArray(listData)) {
           setSubtasks(listData);
         }
@@ -1119,7 +981,8 @@ function TaskDetailView({ taskId, onBack }) {
   }, [callTool, taskId]);
   const fetchHistory = useCallback3(async () => {
     try {
-      const data = await callTool("fw_weaver_history", { taskId });
+      const raw = await callTool("fw_weaver_history", { taskId });
+      const data = typeof raw === "string" ? JSON.parse(raw) : raw;
       if (Array.isArray(data)) {
         setHistory(
           data.map((r) => {
@@ -1160,8 +1023,66 @@ function TaskDetailView({ taskId, onBack }) {
     stream.start(packId, "fw_weaver_events", currentRunId);
     return () => stream.stop();
   }, [isLive, currentRunId, packId]);
-  const [expandedRunId, setExpandedRunId] = useState4(null);
-  const [liveExpanded, setLiveExpanded] = useState4(true);
+  const [detailTab, setDetailTab] = useState5("runs");
+  const [actionLoading, setActionLoading] = useState5(null);
+  const [availableProfiles, setAvailableProfiles] = useState5([]);
+  useEffect2(() => {
+    callTool("fw_weaver_profile_list", {}).then((raw) => {
+      const data = typeof raw === "string" ? JSON.parse(raw) : raw;
+      if (Array.isArray(data)) setAvailableProfiles(data);
+    }).catch(() => {
+    });
+  }, [callTool]);
+  const handleRetry = useCallback3(async () => {
+    setActionLoading("retry");
+    try {
+      await callTool("fw_weaver_task_retry", { id: taskId });
+      toast3("Task retried, back in pool", { type: "success" });
+      fetchTask();
+    } catch (err) {
+      toast3(err instanceof Error ? err.message : "Failed to retry", { type: "error" });
+    }
+    setActionLoading(null);
+  }, [callTool, taskId, fetchTask]);
+  const handleCancel = useCallback3(async () => {
+    const ok = await ctx.confirm("Cancel this task? It cannot be undone.", {
+      title: "Cancel Task",
+      confirmLabel: "Cancel Task",
+      state: "warning"
+    });
+    if (!ok) return;
+    setActionLoading("cancel");
+    try {
+      await callTool("fw_weaver_task_cancel", { id: taskId });
+      toast3("Task cancelled", { type: "info" });
+      fetchTask();
+    } catch (err) {
+      toast3(err instanceof Error ? err.message : "Failed to cancel", { type: "error" });
+    }
+    setActionLoading(null);
+  }, [callTool, taskId, fetchTask, ctx]);
+  const handleAssignProfile = useCallback3(async (profileId) => {
+    setActionLoading("assign-profile");
+    try {
+      const newProfile = task?.assignedProfile === profileId ? void 0 : profileId;
+      await callTool("fw_weaver_task_update", { id: taskId, assignedProfile: newProfile ?? null });
+      toast3(newProfile ? `Assigned profile ${profileId}` : `Unassigned profile`, { type: "success" });
+      fetchTask();
+    } catch (err) {
+      toast3(err instanceof Error ? err.message : "Failed to assign profile", { type: "error" });
+    }
+    setActionLoading(null);
+  }, [callTool, taskId, task, fetchTask]);
+  const handlePriorityChange = useCallback3(async (delta) => {
+    const newPriority = Math.max(0, (task?.priority ?? 0) + delta);
+    try {
+      await callTool("fw_weaver_task_update", { id: taskId, priority: newPriority });
+      fetchTask();
+    } catch {
+    }
+  }, [callTool, taskId, task, fetchTask]);
+  const [expandedRunId, setExpandedRunId] = useState5(null);
+  const [liveExpanded, setLiveExpanded] = useState5(true);
   const toggleExpand = useCallback3((id) => {
     setExpandedRunId((prev) => prev === id ? null : id);
   }, []);
@@ -1170,8 +1091,8 @@ function TaskDetailView({ taskId, onBack }) {
     const el = scrollRef.current;
     if (el) el.scrollTop = el.scrollHeight;
   }, [liveTimeline.length, stream.events.length]);
-  const [approvalStatus, setApprovalStatus] = useState4(null);
-  const [approvalLoading, setApprovalLoading] = useState4(false);
+  const [approvalStatus, setApprovalStatus] = useState5(null);
+  const [approvalLoading, setApprovalLoading] = useState5(false);
   useEffect2(() => {
     if (awaitingApproval) setApprovalStatus("pending");
   }, [awaitingApproval]);
@@ -1226,13 +1147,19 @@ function TaskDetailView({ taskId, onBack }) {
   }
   if (loading && !task) {
     return React7.createElement(
-      Container2,
-      null,
+      Flex6,
+      {
+        variant: "column-stretch-start-nowrap-0",
+        style: { width: "100%", height: "100%", overflow: "hidden" }
+      },
       React7.createElement(
-        Header,
-        null,
+        Flex6,
+        {
+          variant: "column-stretch-start-nowrap-8",
+          style: headerStyle
+        },
         React7.createElement(
-          Button3,
+          Button2,
           { variant: "ghost", size: "sm", onClick: onBack },
           React7.createElement(Icon3, { name: "arrowBack", size: 16 }),
           " Back"
@@ -1242,10 +1169,10 @@ function TaskDetailView({ taskId, onBack }) {
         Flex6,
         {
           variant: "column-center-center-nowrap-0",
-          style: { flex: 1, padding: "24px" }
+          style: { flex: 1 }
         },
         React7.createElement(
-          Typography6,
+          Typography5,
           { variant: "caption-regular", color: "color-text-subtle" },
           "Loading task..."
         )
@@ -1254,13 +1181,19 @@ function TaskDetailView({ taskId, onBack }) {
   }
   if (!task) {
     return React7.createElement(
-      Container2,
-      null,
+      Flex6,
+      {
+        variant: "column-stretch-start-nowrap-0",
+        style: { width: "100%", height: "100%", overflow: "hidden" }
+      },
       React7.createElement(
-        Header,
-        null,
+        Flex6,
+        {
+          variant: "column-stretch-start-nowrap-8",
+          style: headerStyle
+        },
         React7.createElement(
-          Button3,
+          Button2,
           { variant: "ghost", size: "sm", onClick: onBack },
           React7.createElement(Icon3, { name: "arrowBack", size: 16 }),
           " Back"
@@ -1270,10 +1203,10 @@ function TaskDetailView({ taskId, onBack }) {
         Flex6,
         {
           variant: "column-center-center-nowrap-0",
-          style: { flex: 1, padding: "24px" }
+          style: { flex: 1 }
         },
         React7.createElement(
-          Typography6,
+          Typography5,
           { variant: "caption-regular", color: "color-text-subtle" },
           "Task not found."
         )
@@ -1284,210 +1217,392 @@ function TaskDetailView({ taskId, onBack }) {
   const hasSubtasks = task.isParent && subtasks.length > 0;
   const hasRuns = runItems.length > 0 || isLive;
   return React7.createElement(
-    Container2,
-    null,
+    Flex6,
+    {
+      variant: "column-stretch-start-nowrap-0",
+      style: { width: "100%", height: "100%", overflow: "hidden" }
+    },
     // ── Header ──
     React7.createElement(
-      Header,
-      null,
-      // Back button
-      React7.createElement(
-        Button3,
-        { variant: "ghost", size: "sm", onClick: onBack },
-        React7.createElement(Icon3, { name: "arrowBack", size: 16 }),
-        " Back"
-      ),
-      // Title row
+      Flex6,
+      {
+        variant: "column-stretch-start-nowrap-6",
+        style: { ...headerStyle, padding: "12px 16px", borderBottom: "1px solid var(--color-border-default)" }
+      },
+      // Top row: back + title + status
       React7.createElement(
-        HeaderTopRow,
-        null,
-        React7.createElement(StatusIcon4, {
-          status: statusToIcon3[task.status] || "pending",
-          size: "md"
+        Flex6,
+        { variant: "row-center-start-nowrap-8" },
+        React7.createElement(IconButton4, {
+          icon: "back",
+          size: "xs",
+          variant: "clear",
+          onClick: onBack
+        }),
+        React7.createElement(StatusIcon3, {
+          status: statusToIcon2[task.status] || "pending",
+          size: "sm"
         }),
-        React7.createElement(Typography6, { variant: "body-semibold" }, task.title)
+        React7.createElement(Typography5, {
+          variant: "caption-thick",
+          color: "color-text-high",
+          style: { flex: 1, minWidth: 0, wordBreak: "break-word" }
+        }, task.title || "Untitled Task")
       ),
-      // Meta row: status label, assigned bots, priority, attempts
+      // Meta row: status tag, assigned profile, priority, attempts
       React7.createElement(
-        HeaderMeta,
-        null,
+        Flex6,
+        { variant: "row-center-start-wrap-6" },
         React7.createElement(Tag2, {
           size: "small",
-          color: task.status === "done" ? "positive" : task.status === "failed" ? "negative" : task.status === "in-progress" ? "info" : task.status === "blocked" ? "caution" : "default"
-        }, statusToLabel2[task.status]),
-        ...task.assignedBots.map(
-          (botId) => React7.createElement(Tag2, { key: `bot-${botId}`, size: "small", color: "info" }, botId)
-        ),
-        // Priority
-        task.priority > 0 && React7.createElement(Badge2, {
-          variant: task.priority >= 3 ? "warning" : "info"
-        }, `P${task.priority} ${priorityLabel(task.priority)}`),
-        // Attempt count
-        React7.createElement(Typography6, {
-          variant: "caption-regular",
+          color: task.status === "done" ? "positive" : task.status === "failed" ? "negative" : task.status === "in-progress" ? "info" : task.status === "blocked" ? "caution" : "secondary"
+        }, statusToLabel2[task.status] || task.status || "pending"),
+        task.assignedProfile && React7.createElement(Tag2, { key: `profile-${task.assignedProfile}`, size: "small", color: "info" }, task.assignedProfile),
+        task.priority > 0 && React7.createElement(Tag2, {
+          size: "small",
+          color: task.priority >= 3 ? "caution" : "info"
+        }, `P${task.priority}`),
+        task.attempt != null && task.maxAttempts != null && React7.createElement(Typography5, {
+          variant: "smallCaption-regular",
           color: "color-text-subtle"
         }, `Attempt ${task.attempt}/${task.maxAttempts}`)
       ),
       // Description
-      task.description && React7.createElement(Typography6, {
-        variant: "caption-regular",
-        color: "color-text-mid",
-        style: { marginTop: "4px" }
-      }, task.description)
+      task.description && React7.createElement(Typography5, {
+        variant: "smallCaption-regular",
+        color: "color-text-medium"
+      }, task.description),
+      // Profile routing info
+      task.assignedProfile && React7.createElement(
+        Flex6,
+        { variant: "column-stretch-start-nowrap-2" },
+        React7.createElement(Typography5, {
+          variant: "smallCaption-regular",
+          color: "color-text-medium"
+        }, `Profile: ${task.assignedProfile}`),
+        task.routingReason && React7.createElement(Typography5, {
+          variant: "smallCaption-regular",
+          color: "color-text-subtle"
+        }, task.routingReason)
+      )
+      // (Actions moved to tab)
     ),
-    // ── Scrollable content ──
+    // ── Tabs ──
+    React7.createElement(Tabs, {
+      tabs: [
+        { id: "runs", title: `Runs (${runItems.length}${isLive ? "+1" : ""})` },
+        ...hasSubtasks ? [{ id: "subtasks", title: `Subtasks (${subtasks.filter((s) => s.status === "done").length}/${subtasks.length})` }] : [],
+        ...task.status !== "done" && task.status !== "cancelled" ? [{ id: "actions", title: "Actions" }] : [],
+        ...hasContext ? [{ id: "context", title: "Context" }] : []
+      ],
+      activeTabId: detailTab,
+      onSelectTab: (id) => setDetailTab(id),
+      size: "sm"
+    }),
+    // ── Tab content ──
     React7.createElement(
       ScrollArea2,
       { ref: scrollRef, style: { flex: 1 } },
       React7.createElement(
         Flex6,
-        { variant: "column-stretch-start-nowrap-0" },
-        // ── Context section ──
-        hasContext && React7.createElement(
-          Section,
-          null,
+        { variant: "column-stretch-start-nowrap-8", style: { padding: "12px 16px" } },
+        // ── Runs tab ──
+        detailTab === "runs" && (hasRuns || (task.runs?.length ?? 0) > 0) ? React7.createElement(
+          Flex6,
+          { variant: "column-stretch-start-nowrap-8" },
+          ...runItems.map(({ run, runTimeline }) => {
+            const runId = run.id;
+            const isExpanded = expandedRunId === runId;
+            const isSuccess = run.outcome === "completed" || run.success === true;
+            return React7.createElement(TaskBlock, {
+              key: `run-${runId}`,
+              state: isSuccess ? "completed" : "failed",
+              instruction: extractInstruction(run),
+              timeline: runTimeline,
+              cost: typeof run.cost === "number" ? run.cost : run.costDetail?.totalCost ?? null,
+              plan: run.plan,
+              startedAt: run.startedAt,
+              durationMs: run.durationMs ?? run.duration,
+              expanded: isExpanded,
+              onToggleExpand: () => toggleExpand(runId)
+            });
+          }),
+          // Live run
+          isLive && React7.createElement(TaskBlock, {
+            key: "live-run",
+            state: "running",
+            instruction: liveInstruction ?? task.title,
+            timeline: liveTimeline,
+            phase: livePhase,
+            elapsed,
+            cost: liveCost,
+            plan,
+            error: stream.error,
+            approval: approvalStatus ?? void 0,
+            approvalLoading,
+            onApprove: handleApprove,
+            onReject: handleReject,
+            expanded: liveExpanded,
+            onToggleExpand: () => setLiveExpanded((v) => !v)
+          })
+        ) : detailTab === "runs" && React7.createElement(EmptyState2, {
+          icon: "smartToy",
+          message: "No runs yet",
+          description: "This task has not been executed yet."
+        }),
+        // ── Subtasks tab ──
+        detailTab === "subtasks" && hasSubtasks && React7.createElement(
+          Flex6,
+          {
+            variant: "column-stretch-start-nowrap-0"
+          },
+          ...(subtasks ?? []).map(
+            (sub) => React7.createElement(SubtaskRowItem, {
+              key: sub.id,
+              sub,
+              onBack
+            })
+          )
+        ),
+        // ── Actions tab ──
+        detailTab === "actions" && React7.createElement(
+          Flex6,
+          {
+            variant: "column-stretch-start-nowrap-16"
+          },
+          // Status actions
           React7.createElement(
-            SectionTitle,
-            null,
-            React7.createElement(Typography6, { variant: "caption-semibold", color: "color-text-high" }, "Context")
-          ),
-          // Files
-          task.context.files.length > 0 && React7.createElement(
             Flex6,
-            {
-              variant: "column-stretch-start-nowrap-4",
-              style: { marginBottom: "8px" }
-            },
-            React7.createElement(Typography6, { variant: "caption-regular", color: "color-text-subtle" }, "Files:"),
+            { variant: "column-stretch-start-nowrap-8" },
+            React7.createElement(Typography5, { variant: "caption-thick", color: "color-text-medium" }, "Status"),
             React7.createElement(
-              FileList,
-              null,
-              ...task.context.files.map(
-                (file) => React7.createElement(FileItem, { key: file }, file)
-              )
+              Flex6,
+              { variant: "row-center-start-nowrap-6" },
+              task.status === "failed" && React7.createElement(Button2, {
+                size: "xs",
+                variant: "fill",
+                color: "primary",
+                onClick: handleRetry,
+                loading: actionLoading === "retry",
+                disabled: !!actionLoading
+              }, "Retry Task"),
+              (task.status === "pending" || task.status === "in-progress" || task.status === "blocked") && React7.createElement(Button2, {
+                size: "xs",
+                variant: "outlined",
+                color: "danger",
+                onClick: handleCancel,
+                loading: actionLoading === "cancel",
+                disabled: !!actionLoading
+              }, "Cancel Task")
             )
           ),
-          // Notes
-          task.context.notes && React7.createElement(
-            Flex6,
-            { variant: "column-stretch-start-nowrap-4" },
-            React7.createElement(Typography6, { variant: "caption-regular", color: "color-text-subtle" }, "Notes:"),
-            React7.createElement(NotesBlock, null, task.context.notes)
-          )
-        ),
-        // ── Subtasks section ──
-        hasSubtasks && React7.createElement(
-          Section,
-          null,
+          // Priority
           React7.createElement(
-            SectionTitle,
-            null,
+            Flex6,
+            { variant: "column-stretch-start-nowrap-8" },
+            React7.createElement(Typography5, { variant: "caption-thick", color: "color-text-medium" }, "Priority"),
             React7.createElement(
-              Typography6,
-              { variant: "caption-semibold", color: "color-text-high" },
-              `Subtasks (${subtasks.filter((s) => s.status === "done").length}/${subtasks.length} done)`
+              Flex6,
+              { variant: "row-center-start-nowrap-8" },
+              React7.createElement(IconButton4, {
+                icon: "expandLess",
+                size: "xs",
+                variant: "outlined",
+                onClick: () => handlePriorityChange(1),
+                title: "Increase priority"
+              }),
+              React7.createElement(
+                Typography5,
+                { variant: "smallCaption-regular", color: "color-text-high" },
+                `P${task.priority ?? 0}`
+              ),
+              React7.createElement(IconButton4, {
+                icon: "expandMore",
+                size: "xs",
+                variant: "outlined",
+                onClick: () => handlePriorityChange(-1),
+                title: "Decrease priority"
+              })
             )
           ),
-          React7.createElement(
+          // Assign Profile
+          availableProfiles.length > 0 && React7.createElement(
             Flex6,
-            { variant: "column-stretch-start-nowrap-0" },
-            ...subtasks.map(
-              (sub) => React7.createElement(
-                SubtaskRow,
+            { variant: "column-stretch-start-nowrap-8" },
+            React7.createElement(Typography5, { variant: "caption-thick", color: "color-text-medium" }, "Assign Profile"),
+            React7.createElement(Table, {
+              size: "compact",
+              getRowKey: (row) => row.id,
+              columns: [
+                {
+                  key: "icon",
+                  header: "",
+                  width: "30px",
+                  render: (_, row) => React7.createElement(Icon3, {
+                    name: row.icon || "smartToy",
+                    size: 14,
+                    color: row.color || "color-text-medium"
+                  })
+                },
+                {
+                  key: "name",
+                  header: "Profile"
+                },
                 {
-                  key: sub.id,
-                  onClick: () => {
-                    onBack();
+                  key: "capabilities",
+                  header: "Capabilities",
+                  render: (_, row) => {
+                    const caps = row.capabilities || [];
+                    if (caps.length === 0) return null;
+                    return React7.createElement(
+                      Flex6,
+                      { variant: "row-center-start-wrap-4" },
+                      ...caps.slice(0, 4).map(
+                        (cap) => React7.createElement(
+                          "span",
+                          { key: cap.name, title: cap.description },
+                          React7.createElement(Chip, { label: cap.name, size: "small", color: "color-brand-main" })
+                        )
+                      ),
+                      caps.length > 4 && React7.createElement(Typography5, {
+                        variant: "smallCaption-regular",
+                        color: "color-text-subtle"
+                      }, `+${caps.length - 4}`)
+                    );
                   }
                 },
-                React7.createElement(StatusIcon4, {
-                  status: statusToIcon3[sub.status] || "pending",
-                  size: "sm"
-                }),
-                React7.createElement(
-                  SubtaskTitle,
-                  null,
-                  React7.createElement(Typography6, { variant: "caption-regular" }, sub.title)
-                ),
-                sub.assignedBots.length > 0 && React7.createElement(Tag2, {
-                  size: "small",
-                  color: "info"
-                }, sub.assignedBots[0]),
-                React7.createElement(Typography6, {
-                  variant: "caption-regular",
-                  color: "color-text-subtle"
-                }, `#${sub.attempt}`)
-              )
-            )
+                {
+                  key: "assigned",
+                  header: "Assign",
+                  width: "50px",
+                  align: "right",
+                  render: (_, row) => {
+                    const isAssigned = task.assignedProfile === row.id;
+                    return React7.createElement(Checkbox, {
+                      checked: isAssigned,
+                      onChange: () => handleAssignProfile(row.id),
+                      size: "sm"
+                    });
+                  }
+                }
+              ],
+              data: availableProfiles
+            })
           )
         ),
-        // ── Run history section ──
-        (hasRuns || task.runs.length > 0) && React7.createElement(
-          Section,
-          { style: { borderBottom: "none" } },
-          React7.createElement(
-            SectionTitle,
-            null,
-            React7.createElement(
-              Typography6,
-              { variant: "caption-semibold", color: "color-text-high" },
-              `Run History (${runItems.length}${isLive ? " + 1 live" : ""})`
-            )
-          ),
-          React7.createElement(
+        // ── Context tab ──
+        detailTab === "context" && hasContext && React7.createElement(
+          Flex6,
+          {
+            variant: "column-stretch-start-nowrap-12"
+          },
+          // Files
+          (task.context?.files?.length ?? 0) > 0 && React7.createElement(
             Flex6,
-            { variant: "column-stretch-start-nowrap-8" },
-            ...runItems.map(({ run, runTimeline }) => {
-              const runId = run.id;
-              const isExpanded = expandedRunId === runId;
-              const isSuccess = run.outcome === "completed" || run.success === true;
-              return React7.createElement(TaskBlock, {
-                key: `run-${runId}`,
-                state: isSuccess ? "completed" : "failed",
-                instruction: extractInstruction(run),
-                timeline: runTimeline,
-                cost: typeof run.cost === "number" ? run.cost : run.costDetail?.totalCost ?? null,
-                plan: run.plan,
-                startedAt: run.startedAt,
-                durationMs: run.durationMs ?? run.duration,
-                expanded: isExpanded,
-                onToggleExpand: () => toggleExpand(runId)
-              });
-            }),
-            // Live run
-            isLive && React7.createElement(TaskBlock, {
-              key: "live-run",
-              state: "running",
-              instruction: liveInstruction ?? task.title,
-              timeline: liveTimeline,
-              phase: livePhase,
-              elapsed,
-              cost: liveCost,
-              plan,
-              error: stream.error,
-              approval: approvalStatus ?? void 0,
-              approvalLoading,
-              onApprove: handleApprove,
-              onReject: handleReject,
-              expanded: liveExpanded,
-              onToggleExpand: () => setLiveExpanded((v) => !v)
-            })
-          )
-        ),
-        // Empty state when no runs and no live
-        !hasRuns && task.runs.length === 0 && React7.createElement(
-          Section,
-          { style: { borderBottom: "none" } },
-          React7.createElement(
+            {
+              variant: "column-stretch-start-nowrap-4"
+            },
+            React7.createElement(Typography5, { variant: "caption-thick", color: "color-text-medium" }, "Files"),
+            ...(task.context?.files ?? []).map(
+              (file) => React7.createElement(Typography5, {
+                key: file,
+                variant: "smallCaption-regular",
+                color: "color-text-high",
+                style: { fontFamily: "var(--font-mono, monospace)" }
+              }, file)
+            )
+          ),
+          // Notes
+          task.context?.notes && React7.createElement(
+            Flex6,
+            {
+              variant: "column-stretch-start-nowrap-4"
+            },
+            React7.createElement(Typography5, { variant: "caption-thick", color: "color-text-medium" }, "Notes"),
+            React7.createElement(Typography5, {
+              variant: "smallCaption-regular",
+              color: "color-text-high",
+              style: { whiteSpace: "pre-wrap" }
+            }, task.context.notes)
+          ),
+          // Last error
+          task.context?.lastError && React7.createElement(
+            Flex6,
+            {
+              variant: "column-stretch-start-nowrap-4"
+            },
+            React7.createElement(Typography5, { variant: "caption-thick", color: "color-status-negative" }, "Last Error"),
+            React7.createElement(Typography5, {
+              variant: "smallCaption-regular",
+              color: "color-text-high",
+              style: { fontFamily: "var(--font-mono, monospace)", whiteSpace: "pre-wrap" }
+            }, task.context.lastError)
+          ),
+          // Run summaries (accumulated context)
+          (task.context?.runSummaries?.length ?? 0) > 0 && React7.createElement(
             Flex6,
             {
-              variant: "column-center-center-nowrap-0",
-              style: { padding: "16px" }
+              variant: "column-stretch-start-nowrap-6"
             },
-            React7.createElement(Typography6, {
-              variant: "caption-regular",
-              color: "color-text-subtle"
-            }, "No runs yet for this task.")
+            React7.createElement(Typography5, { variant: "caption-thick", color: "color-text-medium" }, "Run Summaries"),
+            ...(task.context?.runSummaries ?? []).map(
+              (rs, i) => React7.createElement(
+                Card,
+                {
+                  key: `rs-${i}`,
+                  variant: "bordered",
+                  padding: "compact",
+                  style: { gap: "4px" }
+                },
+                React7.createElement(
+                  Flex6,
+                  { variant: "row-center-space-between-nowrap-8" },
+                  React7.createElement(Typography5, {
+                    variant: "smallCaption-thick",
+                    color: rs.outcome === "success" ? "color-status-positive" : "color-status-negative"
+                  }, `${rs.outcome === "success" ? "Success" : "Failed"} (${rs.botId ?? "unknown bot"})`),
+                  React7.createElement(Typography5, {
+                    variant: "smallCaption-regular",
+                    color: "color-text-subtle"
+                  }, `${Math.round((rs.durationMs ?? 0) / 1e3)}s \xB7 ${rs.tokensUsed ?? 0} tok \xB7 $${(rs.cost ?? 0).toFixed(3)}`)
+                ),
+                React7.createElement(Typography5, {
+                  variant: "smallCaption-regular",
+                  color: "color-text-medium"
+                }, rs.summary ?? ""),
+                (rs.filesModified ?? []).length > 0 && React7.createElement(Typography5, {
+                  variant: "smallCaption-regular",
+                  color: "color-text-subtle",
+                  style: { fontFamily: "var(--font-mono, monospace)" }
+                }, `Files: ${rs.filesModified.join(", ")}`),
+                rs.error && React7.createElement(Typography5, {
+                  variant: "smallCaption-regular",
+                  color: "color-status-negative"
+                }, `Error: ${rs.error}`)
+              )
+            )
+          ),
+          // Budget
+          (task.tokensUsed > 0 || task.costUsed > 0) && React7.createElement(
+            Flex6,
+            {
+              variant: "column-stretch-start-nowrap-4"
+            },
+            React7.createElement(Typography5, { variant: "caption-thick", color: "color-text-medium" }, "Budget"),
+            React7.createElement(
+              Flex6,
+              { variant: "row-center-start-nowrap-16" },
+              React7.createElement(
+                Typography5,
+                { variant: "smallCaption-regular", color: "color-text-high" },
+                `Tokens: ${task.tokensUsed?.toLocaleString() ?? 0}${task.budgetTokens ? ` / ${task.budgetTokens.toLocaleString()}` : ""}`
+              ),
+              React7.createElement(
+                Typography5,
+                { variant: "smallCaption-regular", color: "color-text-high" },
+                `Cost: $${(task.costUsed ?? 0).toFixed(3)}${task.budgetCost ? ` / $${task.budgetCost.toFixed(2)}` : ""}`
+              )
+            )
           )
         )
       )
@@ -1497,16 +1612,845 @@ function TaskDetailView({ taskId, onBack }) {
 var task_detail_view_default = TaskDetailView;
 module.exports = TaskDetailView;
 
-// src/ui/swarm-dashboard.tsx
+// src/ui/profile-card.tsx
 var React8 = require("react");
-var { useState: useState5, useEffect: useEffect3, useCallback: useCallback4, useRef: useRef3 } = React8;
 var {
   Flex: Flex7,
-  ScrollArea: ScrollArea3,
-  EmptyState: EmptyState2,
+  Typography: Typography6,
+  Icon: Icon4,
+  Chip: Chip2,
+  IconButton: IconButton5,
+  Tag: Tag3
+} = require("@fw/plugin-ui-kit");
+function ProfileCard({ profile, activeInstances, onEdit, onDelete }) {
+  const {
+    id,
+    name,
+    description,
+    icon,
+    color,
+    capabilities,
+    preferences,
+    maxInstances
+  } = profile;
+  const budgetParts = [];
+  if (preferences.maxCostPerRun) budgetParts.push(`$${preferences.maxCostPerRun.toFixed(2)}/run`);
+  if (preferences.maxCostPerTask) budgetParts.push(`$${preferences.maxCostPerTask.toFixed(2)}/task`);
+  const budgetText = budgetParts.length > 0 ? budgetParts.join(" / ") : null;
+  return React8.createElement(
+    Flex7,
+    {
+      variant: "column-stretch-start-nowrap-6",
+      style: {
+        padding: "10px 12px",
+        borderRadius: "8px",
+        border: "1px solid var(--color-border-default)",
+        backgroundColor: "var(--color-surface-elevated)"
+      }
+    },
+    // Row 1: Icon + Name + Edit/Delete buttons
+    React8.createElement(
+      Flex7,
+      { variant: "row-center-start-nowrap-8" },
+      React8.createElement(
+        Flex7,
+        {
+          variant: "row-center-center-nowrap-0",
+          style: { color: `var(--${color})`, flexShrink: 0 }
+        },
+        React8.createElement(Icon4, { name: icon || "smartToy", size: 18 })
+      ),
+      React8.createElement(Typography6, {
+        variant: "caption-thick",
+        color: "color-text-high",
+        style: { flex: 1, minWidth: 0 }
+      }, name),
+      onEdit && React8.createElement(IconButton5, {
+        icon: "edit",
+        size: "xs",
+        variant: "clear",
+        onClick: () => onEdit(id),
+        title: "Edit profile"
+      }),
+      onDelete && React8.createElement(IconButton5, {
+        icon: "delete",
+        size: "xs",
+        variant: "clear",
+        color: "danger",
+        onClick: () => onDelete(id),
+        title: "Delete profile"
+      })
+    ),
+    // Description
+    description && React8.createElement(Typography6, {
+      variant: "smallCaption-regular",
+      color: "color-text-medium"
+    }, description),
+    // Divider
+    React8.createElement(Flex7, {
+      variant: "row-center-start-nowrap-0",
+      style: { borderTop: "1px solid var(--color-border-default)", margin: "2px 0" }
+    }),
+    // Capabilities
+    capabilities.length > 0 && React8.createElement(
+      Flex7,
+      { variant: "row-center-start-wrap-4" },
+      React8.createElement(Typography6, {
+        variant: "smallCaption-regular",
+        color: "color-text-subtle",
+        style: { flexShrink: 0 }
+      }, "Capabilities:"),
+      ...capabilities.map(
+        (cap) => React8.createElement(
+          "span",
+          { key: cap.name, title: cap.description },
+          React8.createElement(Chip2, { label: cap.name, size: "small", color: "color-brand-main" })
+        )
+      )
+    ),
+    // Cost strategy
+    React8.createElement(
+      Flex7,
+      { variant: "row-center-start-wrap-12" },
+      React8.createElement(Typography6, {
+        variant: "smallCaption-regular",
+        color: "color-text-subtle"
+      }, `Cost strategy: ${preferences.costStrategy}`)
+    ),
+    // Instances + Approval + Budget
+    React8.createElement(
+      Flex7,
+      { variant: "row-center-start-wrap-12" },
+      React8.createElement(Typography6, {
+        variant: "smallCaption-regular",
+        color: "color-text-subtle"
+      }, `Instances: ${activeInstances}/${maxInstances} active`),
+      React8.createElement(Tag3, {
+        size: "small",
+        color: preferences.requireApproval ? "caution" : "positive"
+      }, preferences.requireApproval ? "Approval required" : "Auto-approve")
+    ),
+    // Budget line
+    budgetText && React8.createElement(Typography6, {
+      variant: "smallCaption-regular",
+      color: "color-text-subtle"
+    }, `Budget: ${budgetText}`),
+    // Instructions
+    preferences.instructions && React8.createElement(Typography6, {
+      variant: "smallCaption-regular",
+      color: "color-text-subtle",
+      style: { fontStyle: "italic" }
+    }, preferences.instructions)
+  );
+}
+var profile_card_default = ProfileCard;
+module.exports = ProfileCard;
+
+// src/ui/bot-constants.ts
+var ICON_CATALOG = [
+  {
+    category: "Actions",
+    icons: [
+      "playArrow",
+      "stop",
+      "pause",
+      "restart",
+      "send",
+      "check",
+      "edit",
+      "copy",
+      "add",
+      "reset",
+      "resume"
+    ]
+  },
+  {
+    category: "AI & Science",
+    icons: ["smartToy", "psychology", "autoAwesome", "modelTraining", "biotech", "science", "ai"]
+  },
+  {
+    category: "Data & Storage",
+    icons: ["database", "dataObject", "dataArray", "tableChart", "token", "dns", "cloudStorage"]
+  },
+  {
+    category: "Logic & Flow",
+    icons: [
+      "altRoute",
+      "callSplit",
+      "callMerge",
+      "rule",
+      "filterAlt",
+      "sort",
+      "loop",
+      "repeat",
+      "compareArrows",
+      "swapHoriz",
+      "syncAlt",
+      "changeCircle",
+      "allInclusive"
+    ]
+  },
+  {
+    category: "Cloud & Network",
+    icons: [
+      "cloudSync",
+      "cloudUpload",
+      "cloudDownload",
+      "cloudDone",
+      "api",
+      "webhook",
+      "public",
+      "router"
+    ]
+  },
+  {
+    category: "Communication",
+    icons: ["email", "chat", "forum", "notifications", "campaign", "rssFeed", "sms"]
+  },
+  {
+    category: "Security",
+    icons: [
+      "key",
+      "shield",
+      "security",
+      "vpnKey",
+      "adminPanel",
+      "policy",
+      "verified",
+      "lockClosed",
+      "lockOpened"
+    ]
+  },
+  {
+    category: "Time",
+    icons: [
+      "timer",
+      "alarm",
+      "hourglassEmpty",
+      "pendingActions",
+      "update",
+      "watchLater",
+      "scheduled"
+    ]
+  },
+  {
+    category: "Tasks & Workflow",
+    icons: [
+      "task",
+      "taskAlt",
+      "checklist",
+      "assignment",
+      "publish",
+      "build",
+      "construction",
+      "engineering"
+    ]
+  },
+  {
+    category: "Analytics",
+    icons: [
+      "analytics",
+      "insights",
+      "barChart",
+      "pieChart",
+      "trendingUp",
+      "showChart",
+      "leaderboard",
+      "monitoring"
+    ]
+  },
+  {
+    category: "Flow Nodes",
+    icons: [
+      "schema",
+      "hub",
+      "deviceHub",
+      "source",
+      "trigger",
+      "pulse",
+      "step",
+      "event",
+      "outlinedFlow"
+    ]
+  },
+  {
+    category: "Files & Documents",
+    icons: [
+      "file",
+      "filePresent",
+      "fileCopy",
+      "textSnippet",
+      "attachFile",
+      "uploadFile",
+      "save",
+      "upload",
+      "download"
+    ]
+  },
+  {
+    category: "General",
+    icons: [
+      "rocketLaunch",
+      "code",
+      "terminal",
+      "logs",
+      "info",
+      "help",
+      "list",
+      "category",
+      "hash",
+      "calendar",
+      "history",
+      "integration",
+      "layers",
+      "link",
+      "search",
+      "outlinedSettings",
+      "outlinedBug",
+      "collaboration",
+      "person",
+      "people",
+      "backup",
+      "healthAndSafety"
+    ]
+  }
+];
+var BOT_COLORS = [
+  { label: "Blue", token: "color-node-blue-icon" },
+  { label: "Purple", token: "color-node-purple-icon" },
+  { label: "Cyan", token: "color-node-cyan-icon" },
+  { label: "Orange", token: "color-node-orange-icon" },
+  { label: "Pink", token: "color-node-pink-icon" },
+  { label: "Green", token: "color-node-green-icon" },
+  { label: "Brand", token: "color-brand-main" },
+  { label: "Accent", token: "color-brand-alt" },
+  { label: "Positive", token: "color-status-positive" },
+  { label: "Info", token: "color-status-info" }
+];
+
+// src/ui/profile-editor.tsx
+var React9 = require("react");
+var { useState: useState6, useEffect: useEffect3, useCallback: useCallback4 } = React9;
+var {
+  Flex: Flex8,
   Typography: Typography7,
+  Input: Input2,
+  Button: Button3,
+  IconButton: IconButton6,
+  Icon: Icon5,
+  SectionTitle,
+  Checkbox: Checkbox2,
+  Field,
+  IconPicker,
+  ColorPicker,
+  toast: toast4,
   usePackWorkspace: usePackWorkspace4
 } = require("@fw/plugin-ui-kit");
+function ProfileEditor({ mode, profileId, bots, onSave, onCancel, onDelete }) {
+  const ctx = usePackWorkspace4();
+  const { callTool } = ctx;
+  const [name, setName] = useState6("");
+  const [description, setDescription] = useState6("");
+  const [botId, setBotId] = useState6(mode === "create" && bots.length > 0 ? bots[0].id : "");
+  const [icon, setIcon] = useState6("smartToy");
+  const [color, setColor] = useState6("color-node-blue-icon");
+  const [costStrategy, setCostStrategy] = useState6("balanced");
+  const [capabilities, setCapabilities] = useState6([]);
+  const [capName, setCapName] = useState6("");
+  const [capDescription, setCapDescription] = useState6("");
+  const [instructions, setInstructions] = useState6("");
+  const [requireApproval, setRequireApproval] = useState6(false);
+  const [loading, setLoading] = useState6(mode === "edit");
+  useEffect3(() => {
+    if (mode !== "edit" || !profileId) return;
+    let cancelled = false;
+    (async () => {
+      try {
+        const raw = await callTool("fw_weaver_profile_list", {});
+        if (cancelled) return;
+        const data = typeof raw === "string" ? JSON.parse(raw) : raw;
+        const list = Array.isArray(data) ? data : [];
+        const profile = list.find((p) => p.id === profileId);
+        if (!profile) {
+          toast4("Profile not found", { type: "error" });
+          onCancel();
+          return;
+        }
+        setName(profile.name || "");
+        setDescription(profile.description || "");
+        setBotId(profile.botId || "");
+        setIcon(profile.icon || "smartToy");
+        setColor(profile.color || "color-node-blue-icon");
+        const prefs = profile.preferences || {};
+        setCostStrategy(prefs.costStrategy || "balanced");
+        setCapabilities(
+          Array.isArray(profile.capabilities) ? profile.capabilities : []
+        );
+        setInstructions(prefs.instructions || "");
+        setRequireApproval(!!prefs.requireApproval);
+      } catch {
+        toast4("Failed to load profile", { type: "error" });
+        onCancel();
+      } finally {
+        if (!cancelled) setLoading(false);
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [mode, profileId, callTool, onCancel]);
+  const handleAddCapability = useCallback4(() => {
+    const trimName = capName.trim();
+    const trimDesc = capDescription.trim();
+    if (!trimName || !trimDesc) return;
+    setCapabilities((prev) => [...prev, { name: trimName, description: trimDesc }]);
+    setCapName("");
+    setCapDescription("");
+  }, [capName, capDescription]);
+  const handleRemoveCapability = useCallback4((index) => {
+    setCapabilities((prev) => prev.filter((_, i) => i !== index));
+  }, []);
+  const handleSave = useCallback4(async () => {
+    if (!name.trim()) {
+      toast4("Profile name is required", { type: "error" });
+      return;
+    }
+    if (!botId) {
+      toast4("Select a bot workflow", { type: "error" });
+      return;
+    }
+    if (capabilities.length === 0) {
+      toast4("Add at least one capability", { type: "error" });
+      return;
+    }
+    try {
+      if (mode === "create") {
+        await callTool("fw_weaver_profile_create", {
+          name: name.trim(),
+          description: description.trim(),
+          botId,
+          icon,
+          color,
+          capabilities,
+          costStrategy,
+          instructions: instructions.trim() || void 0,
+          requireApproval
+        });
+        toast4("Profile created", { type: "success" });
+      } else {
+        await callTool("fw_weaver_profile_update", {
+          id: profileId,
+          name: name.trim(),
+          description: description.trim(),
+          icon,
+          color,
+          capabilities,
+          costStrategy,
+          instructions: instructions.trim() || void 0,
+          requireApproval
+        });
+        toast4("Profile updated", { type: "success" });
+      }
+      onSave();
+    } catch (err) {
+      toast4(err instanceof Error ? err.message : `Failed to ${mode} profile`, { type: "error" });
+    }
+  }, [mode, profileId, name, description, botId, icon, color, costStrategy, capabilities, instructions, requireApproval, callTool, onSave]);
+  const handleDelete = useCallback4(async () => {
+    if (!profileId) return;
+    const ok = await ctx.confirm("Are you sure you want to delete this profile?", {
+      title: "Delete Profile",
+      confirmLabel: "Delete",
+      state: "danger"
+    });
+    if (!ok) return;
+    try {
+      await callTool("fw_weaver_profile_delete", { id: profileId });
+      toast4("Profile deleted", { type: "success" });
+      if (onDelete) onDelete();
+    } catch (err) {
+      toast4(err instanceof Error ? err.message : "Failed to delete profile", { type: "error" });
+    }
+  }, [profileId, callTool, onDelete, ctx]);
+  if (loading) {
+    return React9.createElement(
+      Flex8,
+      {
+        variant: "column-center-center-nowrap-12",
+        style: { padding: "24px 16px" }
+      },
+      React9.createElement(Typography7, { variant: "caption-regular", color: "color-text-subtle" }, "Loading profile...")
+    );
+  }
+  return React9.createElement(
+    Flex8,
+    {
+      variant: "column-stretch-start-nowrap-0",
+      style: { width: "100%", height: "100%", overflow: "hidden" }
+    },
+    // ── Header bar ──
+    React9.createElement(
+      Flex8,
+      {
+        variant: "row-center-space-between-nowrap-8",
+        style: { padding: "8px 16px", flexShrink: 0, borderBottom: "1px solid var(--color-border-default)" }
+      },
+      React9.createElement(
+        Flex8,
+        { variant: "row-center-start-nowrap-8" },
+        React9.createElement(IconButton6, {
+          icon: "back",
+          size: "xs",
+          variant: "clear",
+          onClick: onCancel,
+          title: "Back"
+        }),
+        React9.createElement(Typography7, { variant: "caption-thick", color: "color-text-high" }, mode === "create" ? "Create Profile" : "Edit Profile")
+      ),
+      mode === "edit" && onDelete && React9.createElement(IconButton6, {
+        icon: "outlinedDelete",
+        size: "sm",
+        variant: "clear",
+        color: "danger",
+        onClick: handleDelete,
+        title: "Delete profile"
+      })
+    ),
+    // ── Scrollable form body ──
+    React9.createElement(
+      Flex8,
+      {
+        variant: "column-stretch-start-nowrap-10",
+        style: { flex: 1, minHeight: 0, overflow: "auto", padding: "12px 16px" }
+      },
+      // ── Name ──
+      React9.createElement(
+        Field,
+        { label: "Name" },
+        React9.createElement(Input2, {
+          type: "text",
+          size: "small",
+          placeholder: "Profile name",
+          value: name,
+          onChange: (v) => setName(v),
+          defaultBoxStyle: { flex: 1, minWidth: 0 },
+          inputBoxStyle: { maxWidth: "none" }
+        })
+      ),
+      // ── Description ──
+      React9.createElement(
+        Field,
+        { label: "Description" },
+        React9.createElement(Input2, {
+          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 ──
+      React9.createElement(
+        Field,
+        { label: "Bot" },
+        React9.createElement(Input2, {
+          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 ──
+      React9.createElement(
+        Field,
+        { label: "Icon", align: "start" },
+        React9.createElement(IconPicker, {
+          catalog: ICON_CATALOG,
+          value: icon,
+          onChange: (v) => setIcon(v),
+          accentColor: color,
+          variant: "inline"
+        })
+      ),
+      // ── Color ──
+      React9.createElement(
+        Field,
+        { label: "Color", align: "start" },
+        React9.createElement(ColorPicker, {
+          colors: BOT_COLORS,
+          value: color,
+          onChange: (v) => setColor(v),
+          variant: "inline"
+        })
+      ),
+      // ── Cost Strategy ──
+      React9.createElement(
+        Field,
+        { label: "Cost Strategy" },
+        React9.createElement(Input2, {
+          type: "select",
+          size: "small",
+          options: [
+            { id: "frugal", label: "Frugal", icon: "timer" },
+            { id: "balanced", label: "Balanced", icon: "syncAlt" },
+            { id: "performance", label: "Performance", icon: "rocketLaunch" }
+          ],
+          optionId: costStrategy,
+          onChange: (id) => setCostStrategy(id),
+          defaultBoxStyle: { flex: 1, minWidth: 0 }
+        })
+      ),
+      // ── Capabilities ──
+      React9.createElement(
+        Field,
+        { label: "Capabilities", align: "start" },
+        React9.createElement(
+          Flex8,
+          { variant: "column-stretch-start-nowrap-6" },
+          // Add capability row
+          React9.createElement(
+            Flex8,
+            { variant: "row-center-start-nowrap-4", style: { overflow: "hidden" } },
+            React9.createElement(Input2, {
+              type: "text",
+              size: "small",
+              placeholder: "Name",
+              value: capName,
+              onChange: (v) => setCapName(v),
+              defaultBoxStyle: { flex: 1, minWidth: 0 },
+              inputBoxStyle: { maxWidth: "none" }
+            }),
+            React9.createElement(Input2, {
+              type: "text",
+              size: "small",
+              placeholder: "Description",
+              value: capDescription,
+              onChange: (v) => setCapDescription(v),
+              onEnter: handleAddCapability,
+              defaultBoxStyle: { flex: 2, minWidth: 0 },
+              inputBoxStyle: { maxWidth: "none" }
+            }),
+            React9.createElement(IconButton6, {
+              icon: "add",
+              size: "sm",
+              variant: "outlined",
+              color: "primary",
+              onClick: handleAddCapability,
+              disabled: !capName.trim() || !capDescription.trim()
+            })
+          ),
+          ...capabilities.map(
+            (cap, idx) => React9.createElement(
+              Flex8,
+              {
+                key: `${cap.name}-${idx}`,
+                variant: "row-center-start-nowrap-6",
+                style: { paddingLeft: "4px" }
+              },
+              React9.createElement(Typography7, {
+                variant: "smallCaption-regular",
+                color: "color-text-high",
+                style: { flexShrink: 0 }
+              }, `\u2022 ${cap.name}:`),
+              React9.createElement(Typography7, {
+                variant: "smallCaption-regular",
+                color: "color-text-medium",
+                style: { flex: 1, minWidth: 0 }
+              }, cap.description),
+              React9.createElement(IconButton6, {
+                icon: "close",
+                size: "xs",
+                variant: "clear",
+                color: "danger",
+                onClick: () => handleRemoveCapability(idx)
+              })
+            )
+          )
+        )
+      ),
+      // ── Instructions ──
+      React9.createElement(
+        Field,
+        { label: "Instructions" },
+        React9.createElement(Input2, {
+          type: "text",
+          size: "small",
+          placeholder: "Optional instructions for the bot",
+          value: instructions,
+          onChange: (v) => setInstructions(v),
+          defaultBoxStyle: { flex: 1, minWidth: 0 },
+          inputBoxStyle: { maxWidth: "none" }
+        })
+      ),
+      // ── Require Approval ──
+      React9.createElement(
+        Field,
+        { label: "" },
+        React9.createElement(Checkbox2, {
+          checked: requireApproval,
+          onChange: (v) => setRequireApproval(v),
+          label: "Require approval",
+          size: "sm"
+        })
+      ),
+      // ── Save button ──
+      React9.createElement(
+        Flex8,
+        { variant: "row-center-end-nowrap-8" },
+        React9.createElement(Button3, {
+          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;
+
+// src/ui/decision-log.tsx
+var React10 = require("react");
+var {
+  Flex: Flex9,
+  Typography: Typography8,
+  ScrollArea: ScrollArea3,
+  Tag: Tag4,
+  SectionTitle: SectionTitle2
+} = require("@fw/plugin-ui-kit");
+var methodColors = {
+  "exact-match": "info",
+  "single-eligible": "positive",
+  "ai-routed": "secondary",
+  "round-robin": "secondary",
+  "manual": "caution"
+};
+var methodLabels = {
+  "exact-match": "exact",
+  "single-eligible": "single",
+  "ai-routed": "ai",
+  "round-robin": "robin",
+  "manual": "manual"
+};
+function formatTime(ts) {
+  const d = new Date(ts);
+  return d.toLocaleTimeString("en-GB", { hour: "2-digit", minute: "2-digit", second: "2-digit" });
+}
+function truncate(text, max) {
+  return text.length > max ? text.slice(0, max - 1) + "\u2026" : text;
+}
+function DecisionLog({ decisions }) {
+  if (!decisions || decisions.length === 0) {
+    return React10.createElement(
+      Flex9,
+      {
+        variant: "column-stretch-start-nowrap-4"
+      },
+      React10.createElement(SectionTitle2, null, "Decision Log"),
+      React10.createElement(Typography8, {
+        variant: "smallCaption-regular",
+        color: "color-text-subtle"
+      }, "No routing decisions yet.")
+    );
+  }
+  const sorted = [...decisions].sort((a, b) => b.timestamp - a.timestamp);
+  return React10.createElement(
+    Flex9,
+    {
+      variant: "column-stretch-start-nowrap-4"
+    },
+    React10.createElement(SectionTitle2, null, "Decision Log"),
+    React10.createElement(
+      ScrollArea3,
+      {
+        style: { maxHeight: "260px" }
+      },
+      React10.createElement(
+        Flex9,
+        {
+          variant: "column-stretch-start-nowrap-0"
+        },
+        ...sorted.map((d) => {
+          const methodLabel = d.method === "ai-routed" && d.confidence != null ? `ai ${d.confidence}%` : methodLabels[d.method] || d.method;
+          return React10.createElement(
+            Flex9,
+            {
+              key: d.id,
+              variant: "column-stretch-start-nowrap-2",
+              style: {
+                padding: "6px 8px",
+                borderBottom: "1px solid var(--color-border-default)"
+              }
+            },
+            // Main line: time, title, instance, method
+            React10.createElement(
+              Flex9,
+              { variant: "row-center-start-nowrap-8" },
+              React10.createElement(Typography8, {
+                variant: "smallCaption-regular",
+                color: "color-text-subtle",
+                style: { flexShrink: 0, fontFamily: "var(--font-mono, monospace)", fontSize: "11px" }
+              }, formatTime(d.timestamp)),
+              React10.createElement(Typography8, {
+                variant: "smallCaption-regular",
+                color: "color-text-high",
+                style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }
+              }, `"${truncate(d.taskTitle, 40)}"`),
+              React10.createElement(Typography8, {
+                variant: "smallCaption-regular",
+                color: "color-text-medium",
+                style: { flexShrink: 0 }
+              }, `\u2192 ${d.assignedInstanceId}`),
+              React10.createElement(Tag4, {
+                size: "small",
+                color: methodColors[d.method] || "secondary"
+              }, methodLabel)
+            ),
+            // Reason line
+            React10.createElement(Typography8, {
+              variant: "smallCaption-regular",
+              color: "color-text-subtle",
+              style: { paddingLeft: "70px" }
+            }, d.reason)
+          );
+        })
+      )
+    )
+  );
+}
+var decision_log_default = DecisionLog;
+module.exports = DecisionLog;
+
+// src/ui/swarm-dashboard.tsx
+var React11 = require("react");
+var { useState: useState7, useEffect: useEffect4, useCallback: useCallback5, useRef: useRef3 } = React11;
+var {
+  Flex: Flex10,
+  ScrollArea: ScrollArea4,
+  EmptyState: EmptyState3,
+  Typography: Typography9,
+  StatusIcon: StatusIcon4,
+  Icon: Icon6,
+  Tag: Tag5,
+  Card: Card2,
+  Tabs: Tabs2,
+  SectionTitle: SectionTitle3,
+  Button: Button4,
+  Input: Input3,
+  IconButton: IconButton7,
+  IconPicker: IconPicker2,
+  ColorPicker: ColorPicker2,
+  toast: toast5,
+  usePackWorkspace: usePackWorkspace5
+} = require("@fw/plugin-ui-kit");
 function parseToolResult2(raw) {
   if (typeof raw === "string") {
     try {
@@ -1523,20 +2467,29 @@ function resolveTaskTitle(taskId, tasks) {
   return task?.title;
 }
 function SwarmDashboard() {
-  const ctx = usePackWorkspace4();
+  const ctx = usePackWorkspace5();
   const { callTool, onRefresh } = ctx;
-  const [selectedTaskId, setSelectedTaskId] = useState5(null);
-  const [swarmStatus, setSwarmStatus] = useState5(null);
-  const [tasks, setTasks] = useState5([]);
-  const [loading, setLoading] = useState5(true);
+  const [selectedTaskId, setSelectedTaskId] = useState7(null);
+  const [activeTab, setActiveTab] = useState7("tasks");
+  const [editingBotId, setEditingBotId] = useState7(null);
+  const [profileEditorMode, setProfileEditorMode] = useState7(null);
+  const [editingProfileId, setEditingProfileId] = useState7(null);
+  const [swarmStatus, setSwarmStatus] = useState7(null);
+  const [tasks, setTasks] = useState7([]);
+  const [registeredBots, setRegisteredBots] = useState7([]);
+  const [providers, setProviders] = useState7([]);
+  const [insights, setInsights] = useState7(null);
+  const [profiles, setProfiles] = useState7([]);
+  const [orchestratorDecisions, setOrchestratorDecisions] = useState7([]);
+  const [loading, setLoading] = useState7(true);
   const mountedRef = useRef3(true);
-  useEffect3(() => {
+  useEffect4(() => {
     mountedRef.current = true;
     return () => {
       mountedRef.current = false;
     };
   }, []);
-  const fetchSwarmStatus = useCallback4(async () => {
+  const fetchSwarmStatus = useCallback5(async () => {
     try {
       const raw = await callTool("fw_weaver_swarm_status", {});
       if (!mountedRef.current) return;
@@ -1545,7 +2498,7 @@ function SwarmDashboard() {
     } catch {
     }
   }, [callTool]);
-  const fetchTaskList = useCallback4(async () => {
+  const fetchTaskList = useCallback5(async () => {
     try {
       const raw = await callTool("fw_weaver_task_list", {});
       if (!mountedRef.current) return;
@@ -1558,155 +2511,500 @@ function SwarmDashboard() {
     } catch {
     }
   }, [callTool]);
-  const refreshAll = useCallback4(async () => {
-    await Promise.all([fetchSwarmStatus(), fetchTaskList()]);
+  const fetchBots = useCallback5(async () => {
+    try {
+      const raw = await callTool("fw_weaver_list_bots", {});
+      if (!mountedRef.current) return;
+      const data = typeof raw === "string" ? JSON.parse(raw) : raw;
+      if (Array.isArray(data)) setRegisteredBots(data);
+    } catch {
+    }
+  }, [callTool]);
+  const fetchConfig = useCallback5(async () => {
+    try {
+      const [provRaw, insRaw] = await Promise.all([
+        callTool("fw_weaver_providers", {}),
+        callTool("fw_weaver_insights", {})
+      ]);
+      if (!mountedRef.current) return;
+      const provData = typeof provRaw === "string" ? JSON.parse(provRaw) : provRaw;
+      const insData = typeof insRaw === "string" ? JSON.parse(insRaw) : insRaw;
+      if (Array.isArray(provData)) setProviders(provData);
+      if (insData && typeof insData === "object") setInsights(insData);
+    } catch {
+    }
+  }, [callTool]);
+  const fetchProfiles = useCallback5(async () => {
+    try {
+      const raw = await callTool("fw_weaver_profile_list", {});
+      if (!mountedRef.current) return;
+      const data = typeof raw === "string" ? JSON.parse(raw) : raw;
+      if (Array.isArray(data)) setProfiles(data);
+    } catch {
+    }
+  }, [callTool]);
+  const fetchOrchestratorStatus = useCallback5(async () => {
+    try {
+      const raw = await callTool("fw_weaver_orchestrator_status", {});
+      if (!mountedRef.current) return;
+      const data = typeof raw === "string" ? JSON.parse(raw) : raw;
+      if (data && typeof data === "object") {
+        const decisions = data.recentDecisions;
+        if (Array.isArray(decisions)) setOrchestratorDecisions(decisions);
+      }
+    } catch {
+    }
+  }, [callTool]);
+  const refreshAll = useCallback5(async () => {
+    await Promise.all([fetchSwarmStatus(), fetchTaskList(), fetchBots(), fetchConfig(), fetchProfiles(), fetchOrchestratorStatus()]);
     if (mountedRef.current) setLoading(false);
-  }, [fetchSwarmStatus, fetchTaskList]);
-  useEffect3(() => {
+  }, [fetchSwarmStatus, fetchTaskList, fetchBots, fetchConfig, fetchProfiles, fetchOrchestratorStatus]);
+  useEffect4(() => {
     refreshAll();
   }, [refreshAll]);
-  useEffect3(() => {
+  useEffect4(() => {
     const interval = setInterval(fetchSwarmStatus, 3e3);
     return () => clearInterval(interval);
   }, [fetchSwarmStatus]);
-  useEffect3(() => {
+  useEffect4(() => {
     const interval = setInterval(fetchTaskList, 5e3);
     return () => clearInterval(interval);
   }, [fetchTaskList]);
-  useEffect3(() => {
+  useEffect4(() => {
+    const interval = setInterval(() => {
+      fetchProfiles();
+      fetchOrchestratorStatus();
+    }, 1e4);
+    return () => clearInterval(interval);
+  }, [fetchProfiles, fetchOrchestratorStatus]);
+  useEffect4(() => {
     return onRefresh(() => refreshAll());
   }, [refreshAll, onRefresh]);
-  const handleTaskClick = useCallback4((taskId) => {
+  const handleUpdateBot = useCallback5(async (botId, patch) => {
+    try {
+      await callTool("fw_weaver_register_bot", { id: botId, ...patch });
+      await fetchBots();
+      toast5("Bot updated", { type: "success" });
+    } catch (err) {
+      toast5(err instanceof Error ? err.message : "Failed to update bot", { type: "error" });
+    }
+  }, [callTool, fetchBots]);
+  const handleSteerBot = useCallback5(async (botId, command) => {
+    try {
+      await callTool("fw_weaver_steer", { botId, command });
+      toast5(`${command} signal sent to ${botId}`, { type: "info" });
+      fetchSwarmStatus();
+    } catch (err) {
+      toast5(err instanceof Error ? err.message : `Failed to ${command}`, { type: "error" });
+    }
+  }, [callTool, fetchSwarmStatus]);
+  const handleTaskClick = useCallback5((taskId) => {
     setSelectedTaskId(taskId);
   }, []);
-  const handleBack = useCallback4(() => {
+  const handleBack = useCallback5(() => {
     setSelectedTaskId(null);
     refreshAll();
   }, [refreshAll]);
-  const handleTaskCreated = useCallback4(() => {
+  const handleTaskCreated = useCallback5(() => {
     fetchTaskList();
   }, [fetchTaskList]);
   if (selectedTaskId) {
-    return React8.createElement(task_detail_view_default, {
+    return React11.createElement(task_detail_view_default, {
       taskId: selectedTaskId,
       onBack: handleBack
     });
   }
-  const bots = swarmStatus?.bots ?? {};
-  const botEntries = Object.values(bots);
-  const hasBots = botEntries.length > 0;
-  const hasBudget = !!swarmStatus?.budget;
-  const hasContent = hasBots || tasks.length > 0 || swarmStatus !== null;
-  return React8.createElement(
-    Flex7,
+  const swarmInstances = swarmStatus?.instances ?? {};
+  const swarmInstanceEntries = Object.values(swarmInstances);
+  const hasSwarmInstances = swarmInstanceEntries.length > 0;
+  const hasRegisteredBots = registeredBots.length > 0;
+  const sessionBudget = swarmStatus?.budgets?.session;
+  const hasBudget = !!(sessionBudget && (sessionBudget.limitTokens > 0 || sessionBudget.limitCost > 0));
+  const hasContent = hasSwarmInstances || hasRegisteredBots || tasks.length > 0 || swarmStatus !== null;
+  return React11.createElement(
+    Flex10,
     {
       variant: "column-stretch-start-nowrap-0",
       style: { width: "100%", height: "100%", overflow: "hidden" }
     },
     // ── SwarmControls (top bar) ──────────────────────────────────
-    React8.createElement(swarm_controls_default, {
+    React11.createElement(swarm_controls_default, {
       swarmStatus,
       onRefresh: refreshAll
     }),
     // ── BudgetBar (below controls) ──────────────────────────────
-    hasBudget && React8.createElement(
-      Flex7,
+    hasBudget && React11.createElement(
+      Flex10,
       {
         variant: "column-stretch-start-nowrap-4",
-        style: {
-          padding: "8px 16px",
-          borderBottom: "1px solid var(--color-border-default)",
-          flexShrink: 0
-        }
+        style: { padding: "8px 16px", flexShrink: 0, borderBottom: "1px solid var(--color-border-default)" }
       },
-      React8.createElement(budget_bar_default, {
+      React11.createElement(budget_bar_default, {
         label: "Tokens",
-        used: swarmStatus.budget.tokensUsed,
-        limit: swarmStatus.budget.tokenLimit,
+        used: sessionBudget.usedTokens,
+        limit: sessionBudget.limitTokens,
         unit: "tokens"
       }),
-      React8.createElement(budget_bar_default, {
+      React11.createElement(budget_bar_default, {
         label: "Cost",
-        used: swarmStatus.budget.costUsed,
-        limit: swarmStatus.budget.costLimit,
+        used: sessionBudget.usedCost,
+        limit: sessionBudget.limitCost,
         unit: "USD"
       })
     ),
     // ── Bot slot cards (horizontal scrollable row) ──────────────
-    hasBots && React8.createElement(
-      Flex7,
-      {
-        variant: "row-start-start-nowrap-8",
-        style: {
-          padding: "8px 16px",
-          overflowX: "auto",
-          overflowY: "hidden",
-          flexShrink: 0,
-          borderBottom: "1px solid var(--color-border-default)"
-        }
-      },
-      ...botEntries.map(
-        (bot) => React8.createElement(bot_slot_card_default, {
-          key: bot.botId,
-          bot,
-          currentTaskTitle: resolveTaskTitle(bot.currentTaskId, tasks)
-        })
-      )
-    ),
-    // ── Main scrollable area ────────────────────────────────────
-    React8.createElement(
-      Flex7,
+    // ── Tabs ──────────────────────────────────────────────────────
+    React11.createElement(Tabs2, {
+      tabs: [
+        { id: "tasks", title: `Tasks (${tasks.length})` },
+        { id: "bots", title: hasSwarmInstances ? `Instances (${swarmInstanceEntries.length})` : `Bots (${registeredBots.length})` },
+        { id: "profiles", title: `Profiles (${profiles.length})` },
+        { id: "config", title: "Config" }
+      ],
+      activeTabId: activeTab,
+      onSelectTab: (id) => setActiveTab(id),
+      size: "sm"
+    }),
+    // ── Tab content ──────────────────────────────────────────────
+    React11.createElement(
+      Flex10,
       {
         variant: "column-stretch-start-nowrap-0",
-        style: { flex: 1, minHeight: 0 }
+        style: { flex: 1, minHeight: 0, overflow: "auto" }
       },
-      // Section header
-      React8.createElement(
-        Flex7,
+      // Tasks tab
+      activeTab === "tasks" && React11.createElement(
+        Flex10,
         {
-          variant: "row-center-space-between-nowrap-8",
-          style: {
-            padding: "8px 16px 4px",
-            flexShrink: 0
-          }
+          variant: "column-stretch-start-nowrap-0",
+          style: { flex: 1, minHeight: 0 }
         },
-        React8.createElement(Typography7, {
-          variant: "caption-bold",
-          color: "color-text-medium"
-        }, `Task Pool (${tasks.length})`)
+        !hasContent && !loading && React11.createElement(EmptyState3, {
+          icon: "smartToy",
+          message: "Swarm not started",
+          description: "Start the swarm to begin processing tasks, or create tasks below."
+        }),
+        hasContent && React11.createElement(task_pool_list_default, {
+          tasks,
+          onTaskClick: handleTaskClick
+        }),
+        // Task create form (inside Tasks tab)
+        React11.createElement(
+          Flex10,
+          {
+            variant: "column-stretch-start-nowrap-0",
+            style: { padding: "8px 16px", flexShrink: 0, borderTop: "1px solid var(--color-border-default)" }
+          },
+          React11.createElement(task_create_form_default, {
+            onTaskCreated: handleTaskCreated
+          })
+        )
       ),
-      // Task pool list (scrollable)
-      !hasContent && !loading && React8.createElement(EmptyState2, {
-        icon: "smartToy",
-        message: "Swarm not started",
-        description: "Start the swarm to begin processing tasks, or create tasks below."
-      }),
-      hasContent && React8.createElement(
-        Flex7,
+      // Bots tab
+      activeTab === "bots" && React11.createElement(
+        Flex10,
         {
           variant: "column-stretch-start-nowrap-0",
           style: { flex: 1, minHeight: 0 }
         },
-        React8.createElement(task_pool_list_default, {
-          tasks,
-          onTaskClick: handleTaskClick
+        // When swarm is running: show swarm instances
+        hasSwarmInstances && React11.createElement(
+          Flex10,
+          {
+            variant: "column-stretch-start-nowrap-0"
+          },
+          React11.createElement(
+            Flex10,
+            {
+              variant: "row-center-start-nowrap-8",
+              style: { padding: "8px 16px", borderBottom: "1px solid var(--color-border-default)" }
+            },
+            React11.createElement(Typography9, {
+              variant: "smallCaption-regular",
+              color: "color-text-subtle",
+              style: { width: "120px", flexShrink: 0 }
+            }, "Instance"),
+            React11.createElement(Typography9, {
+              variant: "smallCaption-regular",
+              color: "color-text-subtle",
+              style: { width: "110px", flexShrink: 0 }
+            }, "Bot"),
+            React11.createElement(Typography9, {
+              variant: "smallCaption-regular",
+              color: "color-text-subtle",
+              style: { width: "70px", flexShrink: 0 }
+            }, "Status"),
+            React11.createElement(Typography9, {
+              variant: "smallCaption-regular",
+              color: "color-text-subtle",
+              style: { flex: 1, minWidth: 0 }
+            }, "Task"),
+            React11.createElement(Typography9, {
+              variant: "smallCaption-regular",
+              color: "color-text-subtle",
+              style: { width: "50px", flexShrink: 0, textAlign: "right" }
+            }, "Tokens"),
+            React11.createElement(Typography9, {
+              variant: "smallCaption-regular",
+              color: "color-text-subtle",
+              style: { width: "50px", flexShrink: 0, textAlign: "right" }
+            }, "Cost"),
+            React11.createElement(Typography9, {
+              variant: "smallCaption-regular",
+              color: "color-text-subtle",
+              style: { width: "50px", flexShrink: 0 }
+            }, "")
+          ),
+          ...swarmInstanceEntries.map((inst) => {
+            const profile = profiles.find((p) => p.id === inst.profileId);
+            const botId = profile?.botId;
+            const bot = registeredBots.find((b) => b.id === botId);
+            return React11.createElement(bot_slot_card_default, {
+              key: inst.instanceId,
+              bot: {
+                botId: inst.instanceId,
+                botName: `${inst.profileId} #${inst.index}`,
+                status: inst.status,
+                currentTaskId: inst.currentTaskId,
+                currentRunId: inst.currentRunId,
+                startedAt: inst.startedAt,
+                tokensUsed: inst.tokensUsed,
+                cost: inst.cost
+              },
+              profileName: profile?.name || inst.profileId,
+              botDisplayName: bot?.name,
+              botIcon: bot?.icon,
+              botColor: bot?.color,
+              currentTaskTitle: resolveTaskTitle(inst.currentTaskId, tasks),
+              onPause: (id) => handleSteerBot(id, "pause"),
+              onResume: (id) => handleSteerBot(id, "resume"),
+              onStop: (id) => handleSteerBot(id, "cancel")
+            });
+          })
+        ),
+        // When swarm is NOT running: show registered bots
+        !hasSwarmInstances && hasRegisteredBots && React11.createElement(
+          Flex10,
+          {
+            variant: "column-stretch-start-nowrap-0",
+            style: { padding: "8px 16px" }
+          },
+          ...registeredBots.map((bot) => {
+            const isEditing = editingBotId === bot.id;
+            return React11.createElement(
+              Flex10,
+              {
+                key: bot.id,
+                variant: "column-stretch-start-nowrap-0",
+                style: { borderBottom: "1px solid var(--color-border-default)" }
+              },
+              // Bot row (clickable to toggle edit)
+              React11.createElement(
+                Flex10,
+                {
+                  variant: "row-center-start-nowrap-8",
+                  style: { padding: "6px 0", cursor: "pointer" },
+                  onClick: () => setEditingBotId(isEditing ? null : bot.id)
+                },
+                React11.createElement(Icon6, {
+                  name: bot.icon || "smartToy",
+                  size: 16,
+                  color: bot.color || "color-text-medium"
+                }),
+                React11.createElement(
+                  Flex10,
+                  { variant: "column-start-start-nowrap-1", style: { flex: 1, minWidth: 0 } },
+                  React11.createElement(Typography9, { variant: "smallCaption-regular", color: "color-text-high" }, bot.name),
+                  bot.description && React11.createElement(Typography9, { variant: "smallCaption-regular", color: "color-text-subtle" }, bot.description)
+                ),
+                React11.createElement(Icon6, { name: isEditing ? "expandLess" : "expandMore", size: 14, color: "color-text-subtle" })
+              ),
+              // Edit section (icon + color pickers)
+              isEditing && React11.createElement(
+                Flex10,
+                {
+                  variant: "column-stretch-start-nowrap-12",
+                  style: { padding: "8px 0 12px 24px" }
+                },
+                React11.createElement(IconPicker2, {
+                  catalog: ICON_CATALOG,
+                  value: bot.icon || "smartToy",
+                  onChange: (icon) => handleUpdateBot(bot.id, { icon }),
+                  accentColor: bot.color || void 0,
+                  defaultExpanded: true
+                }),
+                React11.createElement(ColorPicker2, {
+                  colors: BOT_COLORS,
+                  value: bot.color || "",
+                  onChange: (color) => handleUpdateBot(bot.id, { color }),
+                  defaultExpanded: true
+                })
+              )
+            );
+          })
+        ),
+        // No bots at all
+        !hasSwarmInstances && !hasRegisteredBots && React11.createElement(EmptyState3, {
+          icon: "smartToy",
+          message: "No bots registered",
+          description: "Register bots to start the swarm."
         })
+      ),
+      // Profiles tab — when ProfileEditor is open, render it INSTEAD of the list
+      activeTab === "profiles" && profileEditorMode != null && React11.createElement(profile_editor_default, {
+        mode: profileEditorMode,
+        profileId: editingProfileId ?? void 0,
+        bots: registeredBots.map((b) => ({ id: b.id, name: b.name, icon: b.icon, color: b.color })),
+        onSave: () => {
+          setProfileEditorMode(null);
+          setEditingProfileId(null);
+          fetchProfiles();
+        },
+        onCancel: () => {
+          setProfileEditorMode(null);
+          setEditingProfileId(null);
+        },
+        onDelete: profileEditorMode === "edit" ? () => {
+          setProfileEditorMode(null);
+          setEditingProfileId(null);
+          fetchProfiles();
+        } : void 0
+      }),
+      // Profiles tab — default list view
+      activeTab === "profiles" && profileEditorMode == null && React11.createElement(
+        Flex10,
+        {
+          variant: "column-stretch-start-nowrap-0",
+          style: { flex: 1, minHeight: 0 }
+        },
+        // ── Profile cards (scrollable) ──
+        React11.createElement(
+          Flex10,
+          {
+            variant: "column-stretch-start-nowrap-8",
+            style: { flex: 1, minHeight: 0, overflow: "auto", padding: "12px 16px" }
+          },
+          profiles.length > 0 ? React11.createElement(
+            Flex10,
+            { variant: "column-stretch-start-nowrap-8" },
+            ...profiles.map((p) => {
+              const activeCount = swarmInstanceEntries.filter(
+                (inst) => inst.profileId === p.id && inst.status === "executing"
+              ).length;
+              return React11.createElement(profile_card_default, {
+                key: p.id,
+                profile: p,
+                activeInstances: activeCount,
+                onEdit: (id) => {
+                  setEditingProfileId(id);
+                  setProfileEditorMode("edit");
+                },
+                onDelete: async (id) => {
+                  const ok = await ctx.confirm("Are you sure you want to delete this profile?", {
+                    title: "Delete Profile",
+                    confirmLabel: "Delete",
+                    state: "danger"
+                  });
+                  if (!ok) return;
+                  try {
+                    await callTool("fw_weaver_profile_delete", { id });
+                    await fetchProfiles();
+                    toast5("Profile deleted", { type: "success" });
+                  } catch (err) {
+                    toast5(err instanceof Error ? err.message : "Failed to delete profile", { type: "error" });
+                  }
+                }
+              });
+            })
+          ) : React11.createElement(EmptyState3, {
+            icon: "person",
+            message: "No profiles",
+            description: "Profiles define how bots behave. Start the swarm to create defaults, or create one below."
+          }),
+          // ── Routing / Decision Log (inside scrollable area) ──
+          orchestratorDecisions.length > 0 && React11.createElement(decision_log_default, {
+            decisions: orchestratorDecisions
+          })
+        ),
+        // ── New Profile button (bottom bar) ──
+        React11.createElement(
+          Flex10,
+          {
+            variant: "column-stretch-start-nowrap-0",
+            style: { flexShrink: 0, borderTop: "1px solid var(--color-border-default)", padding: "8px 16px" }
+          },
+          React11.createElement(Button4, {
+            size: "xs",
+            variant: "clear",
+            color: "primary",
+            leftIcon: "add",
+            onClick: () => setProfileEditorMode("create")
+          }, "New Profile")
+        )
+      ),
+      // Config tab
+      activeTab === "config" && React11.createElement(
+        Flex10,
+        {
+          variant: "column-stretch-start-nowrap-12",
+          style: { padding: "12px 16px" }
+        },
+        // ── Provider ──
+        React11.createElement(
+          Flex10,
+          { variant: "row-center-space-between-nowrap-8" },
+          React11.createElement(Typography9, { variant: "smallCaption-regular", color: "color-text-subtle" }, "Provider"),
+          React11.createElement(
+            Flex10,
+            { variant: "row-center-start-nowrap-4" },
+            React11.createElement(
+              Typography9,
+              { variant: "smallCaption-regular", color: "color-text-high" },
+              providers.find((p) => p.envVarsSet)?.name ?? "None detected"
+            ),
+            providers.find((p) => p.envVarsSet) && React11.createElement(Tag5, { size: "small", color: "info" }, "active")
+          )
+        ),
+        // Trust
+        insights?.trust && React11.createElement(
+          Flex10,
+          { variant: "row-center-space-between-nowrap-8" },
+          React11.createElement(Typography9, { variant: "smallCaption-regular", color: "color-text-subtle" }, "Trust"),
+          React11.createElement(
+            Typography9,
+            { variant: "smallCaption-regular", color: "color-text-high" },
+            `Phase ${insights.trust.phase} \xB7 ${insights.trust.score}/100`
+          )
+        ),
+        // Health
+        insights?.health && React11.createElement(
+          Flex10,
+          { variant: "row-center-space-between-nowrap-8" },
+          React11.createElement(Typography9, { variant: "smallCaption-regular", color: "color-text-subtle" }, "Health"),
+          React11.createElement(
+            Typography9,
+            { variant: "smallCaption-regular", color: "color-text-high" },
+            `${insights.health.overall}/100`
+          )
+        ),
+        // Available providers
+        providers.length > 0 && React11.createElement(
+          Flex10,
+          { variant: "column-stretch-start-nowrap-4" },
+          React11.createElement(Typography9, { variant: "smallCaption-regular", color: "color-text-subtle" }, "Available Providers"),
+          React11.createElement(
+            Flex10,
+            { variant: "row-center-start-wrap-4" },
+            ...providers.map(
+              (p) => React11.createElement(Tag5, {
+                key: p.name,
+                size: "small",
+                color: p.envVarsSet ? "positive" : "secondary"
+              }, p.name)
+            )
+          )
+        )
       )
-    ),
-    // ── Task create form (bottom, collapsible) ──────────────────
-    React8.createElement(
-      Flex7,
-      {
-        variant: "column-stretch-start-nowrap-0",
-        style: {
-          padding: "8px 16px",
-          borderTop: "1px solid var(--color-border-default)",
-          flexShrink: 0
-        }
-      },
-      React8.createElement(task_create_form_default, {
-        onTaskCreated: handleTaskCreated
-      })
     )
   );
 }