@tangle-network/sandbox-ui 0.39.1 → 0.40.0

package/dist/{chunk-EX3UZWLB.js → chunk-6UDHPI2R.js}

@@ -861,6 +861,14 @@ function SandboxCard({
   const isRunning = sandbox.status === "running";
   const isTransitioning = sandbox.status === "provisioning" || sandbox.status === "creating";
   const isStopped = !isRunning && !isTransitioning;
+  const isHibernating = sandbox.status === "hibernating";
+  const resolveResumeHandler = (status) => {
+    if (onResume) return onResume;
+    if (status === "hibernating") return onWake;
+    return void 0;
+  };
+  const resumeLabel = isHibernating ? "Wake Sandbox" : "Resume Sandbox";
+  const resumeHandler = isStopped ? resolveResumeHandler(sandbox.status) : void 0;
   return /* @__PURE__ */ jsxs9("div", { className: cn(
     "group relative flex flex-col justify-between overflow-hidden rounded-lg border bg-card p-5 transition-colors",
     isRunning ? "border-[var(--status-running)]/30" : "border-border",
@@ -936,15 +944,16 @@ function SandboxCard({
             ] })
           ] }),
           isStopped && /* @__PURE__ */ jsxs9(Fragment4, { children: [
-            onResume && /* @__PURE__ */ jsxs9(DropdownMenuItem2, { onClick: () => onResume(sandbox.id), children: [
+            resumeHandler && /* @__PURE__ */ jsxs9(DropdownMenuItem2, { onClick: () => resumeHandler(sandbox.id), children: [
               /* @__PURE__ */ jsx10(Power, { className: "mr-2 h-4 w-4" }),
-              " Resume Sandbox"
+              " ",
+              resumeLabel
             ] }),
             onFork && /* @__PURE__ */ jsxs9(DropdownMenuItem2, { onClick: () => onFork(sandbox.id), children: [
               /* @__PURE__ */ jsx10(Copy, { className: "mr-2 h-4 w-4" }),
               " Fork Sandbox"
             ] }),
-            (onResume || onFork) && /* @__PURE__ */ jsx10(DropdownMenuSeparator2, {})
+            (resumeHandler || onFork) && /* @__PURE__ */ jsx10(DropdownMenuSeparator2, {})
           ] }),
           onDelete && canAdminSandbox(sandbox) && /* @__PURE__ */ jsxs9(DropdownMenuItem2, { className: "text-destructive focus:bg-destructive/10 focus:text-destructive", onClick: () => onDelete(sandbox.id), children: [
             /* @__PURE__ */ jsx10(Trash2, { className: "mr-2 h-4 w-4" }),
@@ -993,15 +1002,15 @@ function SandboxCard({
       "button",
       {
         type: "button",
-        onClick: () => onWake?.(sandbox.id),
-        disabled: isTransitioning,
+        onClick: () => resumeHandler?.(sandbox.id),
+        disabled: isTransitioning || !resumeHandler,
         className: cn(
           "flex w-full items-center justify-center gap-2 rounded-md px-4 py-2 text-sm font-semibold transition-colors border",
-          isTransitioning ? "bg-muted text-muted-foreground cursor-not-allowed border-border" : "bg-card text-foreground hover:bg-muted border-border active:scale-[0.97]"
+          isTransitioning || !resumeHandler ? "bg-muted text-muted-foreground cursor-not-allowed border-border" : "bg-card text-foreground hover:bg-muted border-border active:scale-[0.97]"
         ),
         children: [
           /* @__PURE__ */ jsx10(Play, { className: "h-4 w-4" }),
-          isTransitioning ? "Starting..." : "Wake Sandbox"
+          isTransitioning ? "Starting..." : resumeLabel
         ]
       }
     ) })

package/dist/chunk-7JLB7UZ3.js

@@ -0,0 +1,18 @@
+// src/assistant/provider-label.ts
+var PROVIDER_LABELS = {
+  github: "GitHub",
+  gitlab: "GitLab",
+  slack: "Slack",
+  stripe: "Stripe",
+  notion: "Notion",
+  linear: "Linear",
+  discord: "Discord"
+};
+function providerLabel(provider) {
+  const key = provider.toLowerCase();
+  return PROVIDER_LABELS[key] ?? provider.charAt(0).toUpperCase() + provider.slice(1);
+}
+
+export {
+  providerLabel
+};

package/dist/chunk-SUC6ZJZW.js

@@ -0,0 +1,207 @@
+import {
+  providerLabel
+} from "./chunk-7JLB7UZ3.js";
+
+// src/workflows/model.ts
+import { parse as parseYaml } from "yaml";
+var ROW_GAP = 112;
+var BRANCH_X = 300;
+var BRANCH_ROW_GAP = 84;
+var BRANCH_STACK_PADDING = 40;
+function asRecord(v) {
+  return v && typeof v === "object" && !Array.isArray(v) ? v : {};
+}
+function str(v) {
+  return typeof v === "string" && v.trim() !== "" ? v : void 0;
+}
+function urlHost(url) {
+  try {
+    return new URL(url).host;
+  } catch {
+    return url;
+  }
+}
+function describeAction(action) {
+  const rec = asRecord(action);
+  const [kind] = Object.keys(rec);
+  const cfg = asRecord(rec[kind]);
+  switch (kind) {
+    case "sandbox.spawn":
+      return {
+        title: "Spawn sandbox",
+        subtitle: str(cfg.template),
+        hasBranches: false,
+        isRoot: false,
+        tone: "action"
+      };
+    case "integration.invoke": {
+      const path = str(cfg.path);
+      return {
+        title: "Integration",
+        subtitle: path,
+        provider: path?.split(".")[0],
+        hasBranches: false,
+        isRoot: false,
+        tone: "action"
+      };
+    }
+    case "notify": {
+      const url = str(cfg.url);
+      return {
+        title: "Notify",
+        subtitle: url ? urlHost(url) : void 0,
+        hasBranches: false,
+        isRoot: false,
+        tone: "action"
+      };
+    }
+    case "agent.run":
+      return {
+        title: "Run agent",
+        subtitle: str(cfg.model) ?? str(cfg.profile) ?? str(cfg.prompt),
+        hasBranches: false,
+        isRoot: false,
+        tone: "action"
+      };
+    case "parallel": {
+      const branches = Array.isArray(cfg.branches) ? cfg.branches : [];
+      return {
+        title: "Parallel",
+        subtitle: `${branches.length} branch${branches.length === 1 ? "" : "es"}`,
+        badge: branches.length > 0 ? `\xD7${branches.length}` : void 0,
+        hasBranches: branches.length > 0,
+        isRoot: false,
+        tone: "structural"
+      };
+    }
+    case "foreach":
+      return {
+        title: "For each",
+        subtitle: typeof cfg.items === "string" ? cfg.items : "list",
+        // Only fans out when a `do` template is actually present.
+        hasBranches: Boolean(cfg.do),
+        isRoot: false,
+        tone: "structural"
+      };
+    default:
+      return {
+        title: kind ? kind : "Action",
+        hasBranches: false,
+        isRoot: false,
+        tone: "action"
+      };
+  }
+}
+function describeTrigger(on) {
+  const rec = asRecord(on);
+  if (rec.provider_event) {
+    const ev = asRecord(rec.provider_event);
+    const connection = str(ev.connection);
+    const event = str(ev.event);
+    const actions = Array.isArray(ev.actions) ? ev.actions.filter((a) => typeof a === "string") : [];
+    const repo = str(ev.repo);
+    let subtitle = connection ? providerLabel(connection) : "Event";
+    if (event) subtitle += ` \xB7 ${event}`;
+    if (actions.length > 0) subtitle += ` (${actions.join("/")})`;
+    if (repo) subtitle += ` on ${repo}`;
+    return {
+      title: "Trigger",
+      subtitle,
+      provider: connection,
+      hasBranches: false,
+      isRoot: true,
+      tone: "trigger"
+    };
+  }
+  if (rec.schedule) {
+    const sch = asRecord(rec.schedule);
+    const cron = str(sch.cron);
+    const tz = str(sch.timezone);
+    return {
+      title: "Schedule",
+      subtitle: cron ? tz ? `${cron} (${tz})` : cron : void 0,
+      hasBranches: false,
+      isRoot: true,
+      tone: "trigger"
+    };
+  }
+  return {
+    title: "Trigger",
+    hasBranches: false,
+    isRoot: true,
+    tone: "trigger"
+  };
+}
+function buildWorkflowGraph(yaml) {
+  if (!yaml || yaml.trim() === "") {
+    return { nodes: [], edges: [], error: "No definition" };
+  }
+  let parsed;
+  try {
+    parsed = parseYaml(yaml);
+  } catch {
+    return { nodes: [], edges: [], error: "Invalid YAML" };
+  }
+  const def = asRecord(parsed);
+  const actions = Array.isArray(def.do) ? def.do : [];
+  if (!def.on && actions.length === 0) {
+    return { nodes: [], edges: [], error: "Empty workflow" };
+  }
+  const nodes = [];
+  const edges = [];
+  let y = 0;
+  let prevId = null;
+  const addEdge = (source, target, branch) => {
+    edges.push({
+      id: `${source}->${target}`,
+      source,
+      target,
+      sourceHandle: branch ? "branch" : "out"
+    });
+  };
+  if (def.on) {
+    nodes.push({
+      id: "trigger",
+      position: { x: 0, y },
+      data: describeTrigger(def.on)
+    });
+    prevId = "trigger";
+    y += ROW_GAP;
+  }
+  actions.forEach((action, i) => {
+    const id = `a${i}`;
+    const data = describeAction(action);
+    nodes.push({ id, position: { x: 0, y }, data });
+    if (prevId) addEdge(prevId, id, false);
+    prevId = id;
+    const rec = asRecord(action);
+    const children = "parallel" in rec ? Array.isArray(asRecord(rec.parallel).branches) ? asRecord(rec.parallel).branches : [] : "foreach" in rec ? (
+      // A foreach with no `do` template has no child to render.
+      [asRecord(rec.foreach).do].filter(Boolean)
+    ) : [];
+    if (children.length > 0) {
+      let by = y;
+      children.forEach((child, j) => {
+        const cid = `${id}-b${j}`;
+        nodes.push({
+          id: cid,
+          position: { x: BRANCH_X, y: by },
+          data: describeAction(child)
+        });
+        addEdge(id, cid, true);
+        by += BRANCH_ROW_GAP;
+      });
+      y += Math.max(
+        ROW_GAP,
+        children.length * BRANCH_ROW_GAP + BRANCH_STACK_PADDING
+      );
+    } else {
+      y += ROW_GAP;
+    }
+  });
+  return { nodes, edges, error: null };
+}
+
+export {
+  buildWorkflowGraph
+};

package/dist/dashboard.d.ts

@@ -486,11 +486,16 @@ interface SandboxCardProps {
     sandbox: SandboxCardData;
     onOpenIDE?: (id: string) => void;
     onOpenTerminal?: (id: string) => void;
+    /** Preferred start handler; drives the footer + dropdown Resume action. */
+    onResume?: (id: string) => void;
+    /**
+     * @deprecated Use `onResume`. Retained for back-compat: only a
+     * `hibernating` card falls back to `onWake` when `onResume` is absent.
+     */
     onWake?: (id: string) => void;
     onRestore?: (id: string) => void;
     onDelete?: (id: string) => void;
     onStop?: (id: string) => void;
-    onResume?: (id: string) => void;
     onFork?: (id: string) => void;
     onKeepAlive?: (id: string) => void;
     onUsage?: (id: string) => void;

package/dist/dashboard.js

@@ -52,7 +52,7 @@ import {
   canAdminSandbox,
   parseInsufficientBalance,
   useSidebar
-} from "./chunk-EX3UZWLB.js";
+} from "./chunk-6UDHPI2R.js";
 import {
   BillingDashboard,
   InfoPanel,

package/dist/globals.css

@@ -623,6 +623,9 @@
     width: calc(var(--spacing) * 3);
     height: calc(var(--spacing) * 3);
   }
+  .\!h-2 {
+    height: calc(var(--spacing) * 2) !important;
+  }
   .h-1 {
     height: calc(var(--spacing) * 1);
   }
@@ -830,6 +833,9 @@
   .min-h-screen {
     min-height: 100vh;
   }
+  .\!w-2 {
+    width: calc(var(--spacing) * 2) !important;
+  }
   .w-0 {
     width: calc(var(--spacing) * 0);
   }
@@ -959,6 +965,9 @@
   .w-\[72\%\] {
     width: 72%;
   }
+  .w-\[240px\] {
+    width: 240px;
+  }
   .w-\[268px\] {
     width: 268px;
   }
@@ -1103,6 +1112,9 @@
   .max-w-xl {
     max-width: var(--container-xl);
   }
+  .\!min-w-0 {
+    min-width: calc(var(--spacing) * 0) !important;
+  }
   .min-w-0 {
     min-width: calc(var(--spacing) * 0);
   }
@@ -1151,6 +1163,9 @@
   .flex-shrink-0 {
     flex-shrink: 0;
   }
+  .shrink {
+    flex-shrink: 1;
+  }
   .shrink-0 {
     flex-shrink: 0;
   }
@@ -1237,6 +1252,9 @@
   .cursor-default {
     cursor: default;
   }
+  .cursor-ew-resize {
+    cursor: ew-resize;
+  }
   .cursor-not-allowed {
     cursor: not-allowed;
   }
@@ -1619,6 +1637,10 @@
   .rounded-bl-lg {
     border-bottom-left-radius: var(--radius-lg);
   }
+  .\!border-0 {
+    border-style: var(--tw-border-style) !important;
+    border-width: 0px !important;
+  }
   .border {
     border-style: var(--tw-border-style);
     border-width: 1px;
@@ -1831,6 +1853,9 @@
   .border-t-transparent {
     border-top-color: transparent;
   }
+  .\!bg-transparent {
+    background-color: transparent !important;
+  }
   .bg-\[color-mix\(in_oklch\,var\(--color-warning\,orange\)_18\%\,transparent\)\] {
     background-color: var(--color-warning,orange);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2952,6 +2977,10 @@
     --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+  .shadow-xl {
+    --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
   .ring {
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -3477,6 +3506,13 @@
       }
     }
   }
+  .hover\:opacity-90 {
+    &:hover {
+      @media (hover: hover) {
+        opacity: 90%;
+      }
+    }
+  }
   .hover\:opacity-100 {
     &:hover {
       @media (hover: hover) {
@@ -3686,6 +3722,11 @@
       opacity: 30%;
     }
   }
+  .disabled\:opacity-40 {
+    &:disabled {
+      opacity: 40%;
+    }
+  }
   .disabled\:opacity-50 {
     &:disabled {
       opacity: 50%;

package/dist/hooks.js

@@ -18,13 +18,13 @@ import {
   useSessions,
   useToolCallStream
 } from "./chunk-SOKKTB7W.js";
-import {
-  usePtySession
-} from "./chunk-77WVVJA4.js";
 import {
   useSessionStream,
   useSidecarAuth
 } from "./chunk-MEDE37J5.js";
+import {
+  usePtySession
+} from "./chunk-77WVVJA4.js";
 export {
   RealtimeSessionRegistry,
   createAuthFetcher,

package/dist/index.js

@@ -1,3 +1,27 @@
+import {
+  RealtimeSessionRegistry,
+  createAuthFetcher,
+  useApiKey,
+  useAuth,
+  useAutoScroll,
+  useCreateSession,
+  useDeleteSession,
+  useDropdownMenu,
+  useLiveTime,
+  useRealtimeSession,
+  useRenameSession,
+  useRunCollapseState,
+  useRunGroups,
+  useSSEStream,
+  useSandboxMetrics,
+  useSdkSession,
+  useSessions,
+  useToolCallStream
+} from "./chunk-SOKKTB7W.js";
+import {
+  useSessionStream,
+  useSidecarAuth
+} from "./chunk-MEDE37J5.js";
 import {
   activeSessionsAtom,
   addMessage,
@@ -52,91 +76,6 @@ import {
   timeAgo,
   truncateText
 } from "./chunk-TK46XFLM.js";
-import {
-  AuthHeader,
-  GitHubLoginButton,
-  LoginLayout,
-  TangleLoginButton,
-  UserMenu
-} from "./chunk-IOB2PW5Z.js";
-import {
-  RealtimeSessionRegistry,
-  createAuthFetcher,
-  useApiKey,
-  useAuth,
-  useAutoScroll,
-  useCreateSession,
-  useDeleteSession,
-  useDropdownMenu,
-  useLiveTime,
-  useRealtimeSession,
-  useRenameSession,
-  useRunCollapseState,
-  useRunGroups,
-  useSSEStream,
-  useSandboxMetrics,
-  useSdkSession,
-  useSessions,
-  useToolCallStream
-} from "./chunk-SOKKTB7W.js";
-import {
-  usePtySession
-} from "./chunk-77WVVJA4.js";
-import {
-  useSessionStream,
-  useSidecarAuth
-} from "./chunk-MEDE37J5.js";
-import {
-  AgentSessionControls,
-  AgentTimeline,
-  ArtifactAgentDock,
-  ChatContainer,
-  ChatInput,
-  ChatMessage,
-  DEFAULT_REASONING_LEVEL_OPTIONS,
-  HARNESS_MODEL_POLICIES,
-  MessageList,
-  ReasoningLevelPicker,
-  ThinkingIndicator,
-  UserMessage,
-  createFetchTransport,
-  isModelCompatibleWithHarness,
-  modelProvider,
-  snapHarnessToModel,
-  snapModelToHarness
-} from "./chunk-CUUUFJF5.js";
-import {
-  ExpandedToolDetail,
-  InlineThinkingItem,
-  InlineToolItem,
-  LiveDuration,
-  RunGroup
-} from "./chunk-JBGKGLD7.js";
-import {
-  AgentWorkbench,
-  ApprovalQueue,
-  ArtifactPane,
-  AuditResults,
-  CalendarView,
-  DirectoryPane,
-  RuntimePane,
-  SESSION_CREATED_EVENT,
-  SandboxWorkbench,
-  SessionActivityMonitor,
-  SessionSidebar,
-  StatusBanner,
-  StatusBar,
-  TaskBoard,
-  TerminalPanel,
-  WorkspaceLayout,
-  createShellShouldRevalidate,
-  dispatchSessionCreated,
-  shellShouldRevalidate,
-  useOptimisticSessionItems
-} from "./chunk-6NDOA4SB.js";
-import {
-  OpenUIArtifactRenderer
-} from "./chunk-AZ3AWMTM.js";
 import {
   FileArtifactPane,
   FilePreview,
@@ -199,7 +138,17 @@ import {
   canAdminSandbox,
   parseInsufficientBalance,
   useSidebar
-} from "./chunk-EX3UZWLB.js";
+} from "./chunk-6UDHPI2R.js";
+import {
+  usePtySession
+} from "./chunk-77WVVJA4.js";
+import {
+  AuthHeader,
+  GitHubLoginButton,
+  LoginLayout,
+  TangleLoginButton,
+  UserMenu
+} from "./chunk-IOB2PW5Z.js";
 import {
   BillingDashboard,
   InfoPanel,
@@ -295,6 +244,25 @@ import {
   useTheme,
   useToast
 } from "./chunk-4ZZUMXPX.js";
+import {
+  AgentSessionControls,
+  AgentTimeline,
+  ArtifactAgentDock,
+  ChatContainer,
+  ChatInput,
+  ChatMessage,
+  DEFAULT_REASONING_LEVEL_OPTIONS,
+  HARNESS_MODEL_POLICIES,
+  MessageList,
+  ReasoningLevelPicker,
+  ThinkingIndicator,
+  UserMessage,
+  createFetchTransport,
+  isModelCompatibleWithHarness,
+  modelProvider,
+  snapHarnessToModel,
+  snapModelToHarness
+} from "./chunk-CUUUFJF5.js";
 import {
   BackendSelector,
   HARNESS_BRAND,
@@ -312,7 +280,39 @@ import {
   formatPricing,
   modelDedupKey
 } from "./chunk-3RNYDTQ3.js";
+import {
+  ExpandedToolDetail,
+  InlineThinkingItem,
+  InlineToolItem,
+  LiveDuration,
+  RunGroup
+} from "./chunk-JBGKGLD7.js";
+import {
+  AgentWorkbench,
+  ApprovalQueue,
+  ArtifactPane,
+  AuditResults,
+  CalendarView,
+  DirectoryPane,
+  RuntimePane,
+  SESSION_CREATED_EVENT,
+  SandboxWorkbench,
+  SessionActivityMonitor,
+  SessionSidebar,
+  StatusBanner,
+  StatusBar,
+  TaskBoard,
+  TerminalPanel,
+  WorkspaceLayout,
+  createShellShouldRevalidate,
+  dispatchSessionCreated,
+  shellShouldRevalidate,
+  useOptimisticSessionItems
+} from "./chunk-6NDOA4SB.js";
 import "./chunk-EI44GEQ5.js";
+import {
+  OpenUIArtifactRenderer
+} from "./chunk-AZ3AWMTM.js";
 
 // src/index.ts
 import { CodeBlock as CodeBlock2 } from "@tangle-network/ui/markdown";