@tangle-network/sandbox-ui 0.101.2 → 0.103.0

package/dist/chat.d.ts

@@ -57,7 +57,14 @@ declare const DEFAULT_REASONING_LEVEL_OPTIONS: ReadonlyArray<ReasoningLevelOptio
 declare const HARNESS_REASONING_OPTIONS: Partial<Record<HarnessType, ReadonlyArray<ReasoningLevelOption>>>;
 declare function ReasoningLevelPicker({ value, onChange, disabled, className, triggerClassName, options, available, side, avoidCollisions, }: ReasoningLevelPickerProps): React.JSX.Element;
 
-/** Limits applied when staging files onto a composer. */
+/**
+ * Limits applied when staging files onto a composer.
+ *
+ * @deprecated Composer-only helper of the legacy AgentComposer. Use
+ * ChatComposer from `@tangle-network/agent-app/web-react` — the canonical
+ * composer. AgentComposer is frozen and will be removed at sandbox-ui's next
+ * breaking release.
+ */
 interface ComposerFileValidationConfig {
     /** Reject any single file larger than this. */
     maxSizeBytes?: number;
@@ -72,7 +79,12 @@ interface ComposerFileValidationConfig {
      */
     accept?: string;
 }
-/** A file that failed validation, paired with a human-readable reason. */
+/** A file that failed validation, paired with a human-readable reason.
+ *
+ * @deprecated Composer-only helper of the legacy AgentComposer. Use
+ * ChatComposer from `@tangle-network/agent-app/web-react` — the canonical
+ * composer. AgentComposer is frozen and will be removed at sandbox-ui's next
+ * breaking release. */
 interface ComposerFileRejection {
     file: File;
     reason: string;
@@ -81,6 +93,11 @@ interface ComposerFileRejection {
  * Checks a single file against a comma-separated `accept` list using the same
  * grammar as the native `<input accept>` attribute. An undefined or empty
  * `accept` accepts everything.
+ *
+ * @deprecated Composer-only helper of the legacy AgentComposer. Use
+ * ChatComposer from `@tangle-network/agent-app/web-react` — the canonical
+ * composer. AgentComposer is frozen and will be removed at sandbox-ui's next
+ * breaking release.
  */
 declare function isAcceptedType(file: File, accept?: string): boolean;
 /**
@@ -89,6 +106,11 @@ declare function isAcceptedType(file: File, accept?: string): boolean;
  * `currentCount` + `maxCount`. Each rejection carries a reason naming the
  * file and the limit it broke. Pure data in, pure data out — no throwing,
  * no console noise, so callers decide how to surface rejections.
+ *
+ * @deprecated Composer-only helper of the legacy AgentComposer. Use
+ * ChatComposer from `@tangle-network/agent-app/web-react` — the canonical
+ * composer. AgentComposer is frozen and will be removed at sandbox-ui's next
+ * breaking release.
  */
 declare function validateComposerFiles(files: File[] | FileList, config: ComposerFileValidationConfig): {
     accepted: File[];
@@ -96,7 +118,11 @@ declare function validateComposerFiles(files: File[] | FileList, config: Compose
 };
 
 /** A selectable item in the `@`-mention popover. Generic — file semantics live
- * in the consuming app, not here. */
+ * in the consuming app, not here.
+ *
+ * @deprecated Part of the legacy AgentComposer API. Use ChatComposer from
+ * `@tangle-network/agent-app/web-react` — the canonical composer. AgentComposer
+ * is frozen and will be removed at sandbox-ui's next breaking release. */
 interface MentionItem {
     id: string;
     label: string;
@@ -107,6 +133,10 @@ interface MentionItem {
  * Opt-in `@`-mention support. Present ⇒ the composer swaps its textarea for a
  * TipTap rich input that renders mentions as atomic pills; absent ⇒ exactly
  * today's plain-textarea behavior. Data-agnostic: the app supplies items.
+ *
+ * @deprecated Part of the legacy AgentComposer API. Use ChatComposer from
+ * `@tangle-network/agent-app/web-react` — the canonical composer. AgentComposer
+ * is frozen and will be removed at sandbox-ui's next breaking release.
  */
 interface AgentComposerMention {
     /** The character that opens the popover. Default "@". */
@@ -127,7 +157,11 @@ interface AgentComposerMention {
      */
     popoverClassName?: string;
 }
-/** A staged attachment shown as a chip above the input. */
+/** A staged attachment shown as a chip above the input.
+ *
+ * @deprecated Part of the legacy AgentComposer API. Use ChatComposer from
+ * `@tangle-network/agent-app/web-react` — the canonical composer. AgentComposer
+ * is frozen and will be removed at sandbox-ui's next breaking release. */
 interface ComposerFile {
     id: string;
     name: string;
@@ -145,7 +179,11 @@ interface ComposerFile {
     /** Shown on the chip when `status === "error"`. */
     errorMessage?: string;
 }
-/** Context the agent will see alongside the next message. */
+/** Context the agent will see alongside the next message.
+ *
+ * @deprecated Part of the legacy AgentComposer API. Use ChatComposer from
+ * `@tangle-network/agent-app/web-react` — the canonical composer. AgentComposer
+ * is frozen and will be removed at sandbox-ui's next breaking release. */
 interface ComposerContextItem {
     id: string;
     label: string;
@@ -153,6 +191,13 @@ interface ComposerContextItem {
     /** Omit to render a non-removable chip. */
     onRemove?: () => void;
 }
+/**
+ * Props of the legacy {@link AgentComposer}.
+ *
+ * @deprecated Part of the legacy AgentComposer API. Use ChatComposer from
+ * `@tangle-network/agent-app/web-react` — the canonical composer. AgentComposer
+ * is frozen and will be removed at sandbox-ui's next breaking release.
+ */
 interface AgentComposerProps {
     /** Composer text (controlled). */
     value: string;
@@ -243,6 +288,12 @@ interface AgentComposerProps {
     autoFocus?: boolean;
 }
 /**
+ * @deprecated Use `ChatComposer` from `@tangle-network/agent-app/web-react` —
+ * the canonical composer (superset: attachments lifecycle, send-failure
+ * recovery, seeds, quiet/labeled controls, floating elevation, and the
+ * circular icon send via `sendVariant="icon"`). This slot-shell is frozen and
+ * will be removed at sandbox-ui's next breaking release.
+ *
  * The canonical agent chat input: one rounded surface holding an auto-growing
  * textarea and a bottom row that runs left → right — attach buttons, the
  * control strip (supplied via the required `controls` prop), trailing slot,
@@ -266,6 +317,11 @@ declare function AgentComposer({ value, onChange, onSubmit, placeholder, disable
  * silently drifting apart. Kept in its own module (no TipTap import) so
  * importing it never pulls the lazily-loaded editor chunk into a consumer's
  * bundle.
+ *
+ * @deprecated Mention-pill contract of the legacy AgentComposer mention
+ * feature. Use ChatComposer from `@tangle-network/agent-app/web-react` — the
+ * canonical composer. AgentComposer is frozen and will be removed at
+ * sandbox-ui's next breaking release.
  */
 declare const MENTION_PILL_CLASS: string;
 

package/dist/{chunk-FG6H4554.js → chunk-2XPJ2XF7.js}

@@ -30,7 +30,6 @@ import {
   DialogPortal,
   DialogTitle,
   DialogTrigger,
-  DropZone,
   DropdownMenu,
   DropdownMenuCheckboxItem,
   DropdownMenuContent,
@@ -46,10 +45,14 @@ import {
   DropdownMenuSubContent,
   DropdownMenuSubTrigger,
   DropdownMenuTrigger,
+  DropZone,
   EmptyState,
+  FilterField,
   InlineCode,
   Input,
   Label,
+  Metric,
+  MetricStrip,
   Progress,
   SegmentedControl,
   Select,
@@ -67,6 +70,7 @@ import {
   SkeletonCard,
   SkeletonTable,
   StatCard,
+  StatusPill,
   Switch,
   Table,
   TableBody,
@@ -88,6 +92,7 @@ import {
   ThemeToggle,
   ToastContainer,
   ToastProvider,
+  Toolbar,
   UploadProgress,
   useTheme,
   useToast
@@ -271,7 +276,6 @@ export {
   DialogPortal,
   DialogTitle,
   DialogTrigger,
-  DropZone,
   DropdownMenu,
   DropdownMenuCheckboxItem,
   DropdownMenuContent,
@@ -287,10 +291,14 @@ export {
   DropdownMenuSubContent,
   DropdownMenuSubTrigger,
   DropdownMenuTrigger,
+  DropZone,
   EmptyState,
+  FilterField,
   InlineCode,
   Input,
   Label,
+  Metric,
+  MetricStrip,
   Progress,
   SegmentedControl,
   Select,
@@ -308,6 +316,7 @@ export {
   SkeletonCard,
   SkeletonTable,
   StatCard,
+  StatusPill,
   Switch,
   Table,
   TableBody,
@@ -329,6 +338,7 @@ export {
   ThemeToggle,
   ToastContainer,
   ToastProvider,
+  Toolbar,
   UploadProgress,
   useTheme,
   useToast

package/dist/{chunk-5BAZTDVH.js → chunk-K4Q4E7D7.js}

@@ -1,7 +1,7 @@
 import {
   Button,
   Logo
-} from "./chunk-FG6H4554.js";
+} from "./chunk-2XPJ2XF7.js";
 import {
   moonshot_default
 } from "./chunk-RQZRXKMR.js";

package/dist/{chunk-5JXSQZZH.js → chunk-K5RMJOH6.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-PZVUIUUW.js";
 import {
   PortsList
-} from "./chunk-5BAZTDVH.js";
+} from "./chunk-K4Q4E7D7.js";
 import {
   TerminalView
 } from "./chunk-WYMAC3T3.js";

package/dist/{chunk-A5QIQYS6.js → chunk-M4K7ZGR2.js}

@@ -5,6 +5,8 @@ import {
   InlineToolItem,
   LiveDuration,
   RunGroup,
+  RunRowShell,
+  RunRowStatusDot,
   ToolCallFeed,
   parseToolEvent
 } from "@tangle-network/ui/run";
@@ -15,6 +17,8 @@ export {
   InlineToolItem,
   LiveDuration,
   RunGroup,
+  RunRowShell,
+  RunRowStatusDot,
   ToolCallFeed,
   parseToolEvent
 };

package/dist/dashboard.js

@@ -60,7 +60,7 @@ import {
   chatCapableHarnesses,
   parseInsufficientBalance,
   useSidebar
-} from "./chunk-5BAZTDVH.js";
+} from "./chunk-K4Q4E7D7.js";
 import {
   BillingDashboard,
   InfoPanel,
@@ -69,7 +69,7 @@ import {
   UsageChart,
   formatPrice
 } from "./chunk-OMUIPJQZ.js";
-import "./chunk-FG6H4554.js";
+import "./chunk-2XPJ2XF7.js";
 import {
   ModelBrandStack,
   canonicalModelId,

package/dist/globals.css

@@ -798,6 +798,9 @@
   .h-56 {
     height: calc(var(--spacing) * 56);
   }
+  .h-80 {
+    height: calc(var(--spacing) * 80);
+  }
   .h-\[3px\] {
     height: 3px;
   }
@@ -1359,6 +1362,9 @@
   .grow {
     flex-grow: 1;
   }
+  .basis-1\/3 {
+    flex-basis: calc(1 / 3 * 100%);
+  }
   .caption-bottom {
     caption-side: bottom;
   }
@@ -1665,6 +1671,9 @@
   .gap-x-4 {
     column-gap: calc(var(--spacing) * 4);
   }
+  .gap-x-6 {
+    column-gap: calc(var(--spacing) * 6);
+  }
   :where(.-space-x-2 > :not(:last-child)) {
     --tw-space-x-reverse: 0;
     margin-inline-start: calc(calc(var(--spacing) * -2) * var(--tw-space-x-reverse));
@@ -1673,9 +1682,18 @@
   .gap-y-1 {
     row-gap: var(--spacing);
   }
+  .gap-y-2 {
+    row-gap: calc(var(--spacing) * 2);
+  }
   .gap-y-3 {
     row-gap: calc(var(--spacing) * 3);
   }
+  :where(.divide-x > :not(:last-child)) {
+    --tw-divide-x-reverse: 0;
+    border-inline-style: var(--tw-border-style);
+    border-inline-start-width: calc(1px * var(--tw-divide-x-reverse));
+    border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
+  }
   :where(.divide-y > :not(:last-child)) {
     --tw-divide-y-reverse: 0;
     border-bottom-style: var(--tw-border-style);
@@ -1847,6 +1865,10 @@
     border-left-style: var(--tw-border-style);
     border-left-width: 1px;
   }
+  .border-l-0 {
+    border-left-style: var(--tw-border-style);
+    border-left-width: 0px;
+  }
   .border-l-2 {
     border-left-style: var(--tw-border-style);
     border-left-width: 2px;
@@ -2330,6 +2352,12 @@
       background-color: color-mix(in oklab, var(--color-card) 50%, transparent);
     }
   }
+  .bg-card\/60 {
+    background-color: color-mix(in srgb, hsl(var(--card)) 60%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-card) 60%, transparent);
+    }
+  }
   .bg-card\/80 {
     background-color: color-mix(in srgb, hsl(var(--card)) 80%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2665,6 +2693,9 @@
   .p-16 {
     padding: calc(var(--spacing) * 16);
   }
+  .px-0 {
+    padding-inline: 0px;
+  }
   .px-0\.5 {
     padding-inline: calc(var(--spacing) * 0.5);
   }
@@ -3136,6 +3167,9 @@
     --tw-tracking: var(--tracking-widest);
     letter-spacing: var(--tracking-widest);
   }
+  .text-balance {
+    text-wrap: balance;
+  }
   .break-words {
     overflow-wrap: break-word;
   }
@@ -3148,6 +3182,12 @@
   .whitespace-pre-wrap {
     white-space: pre-wrap;
   }
+  .text-\[color\:var\(--text-dim\)\] {
+    color: var(--text-dim);
+  }
+  .text-\[color\:var\(--x\)\] {
+    color: var(--x);
+  }
   .text-\[var\(--accent-text\)\] {
     color: var(--accent-text);
   }
@@ -3256,6 +3296,12 @@
   .text-\[var\(--text-dim\)\] {
     color: var(--text-dim);
   }
+  .text-\[var\(--text-dim\)\]\/70 {
+    color: var(--text-dim);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--text-dim) 70%, transparent);
+    }
+  }
   .text-\[var\(--text-muted\)\] {
     color: var(--text-muted);
   }
@@ -3271,6 +3317,12 @@
   .text-\[var\(--text-secondary\)\] {
     color: var(--text-secondary);
   }
+  .text-\[var\(--x\)\]\/40 {
+    color: var(--x);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--x) 40%, transparent);
+    }
+  }
   .text-accent-foreground {
     color: var(--color-accent-foreground);
   }
@@ -3391,6 +3443,18 @@
   .text-white {
     color: var(--color-white);
   }
+  .text-white\/50 {
+    color: color-mix(in srgb, #fff 50%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--color-white) 50%, transparent);
+    }
+  }
+  .text-white\/70 {
+    color: color-mix(in srgb, #fff 70%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--color-white) 70%, transparent);
+    }
+  }
   .text-yellow-400 {
     color: var(--color-yellow-400);
   }
@@ -3725,6 +3789,14 @@
         border-color: color-mix(in oklab, var(--color-primary) 40%, transparent);
       }
     }
+    .group-hover\:text-foreground\/40:is(:where(.group):hover *) {
+      color: color-mix(in srgb, hsl(var(--foreground)) 40%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .group-hover\:text-foreground\/40:is(:where(.group):hover *) {
+        color: color-mix(in oklab, var(--color-foreground) 40%, transparent);
+      }
+    }
     .group-hover\:text-primary:is(:where(.group):hover *) {
       color: var(--color-primary);
     }
@@ -4171,6 +4243,14 @@
     .hover\:text-green-600:hover {
       color: var(--color-green-600);
     }
+    .hover\:text-muted-foreground\/70:hover {
+      color: color-mix(in srgb, hsl(var(--muted-foreground)) 70%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .hover\:text-muted-foreground\/70:hover {
+        color: color-mix(in oklab, var(--color-muted-foreground) 70%, transparent);
+      }
+    }
     .hover\:text-primary:hover {
       color: var(--color-primary);
     }
@@ -4188,6 +4268,9 @@
     .hover\:underline:hover {
       text-decoration-line: underline;
     }
+    .hover\:opacity-50:hover {
+      opacity: 50%;
+    }
     .hover\:opacity-80:hover {
       opacity: 80%;
     }
@@ -4525,6 +4608,16 @@
   .data-\[state\=unchecked\]\:bg-input[data-state="unchecked"] {
     background-color: var(--color-input);
   }
+  @supports (display:grid) {
+    .supports-\[display\:grid\]\:text-white\/50 {
+      color: color-mix(in srgb, #fff 50%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .supports-\[display\:grid\]\:text-white\/50 {
+        color: color-mix(in oklab, var(--color-white) 50%, transparent);
+      }
+    }
+  }
   @media (width < 64rem) {
     .max-lg\:hidden {
       display: none;
@@ -4568,6 +4661,9 @@
       margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
       margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
     }
+    .sm\:p-5 {
+      padding: calc(var(--spacing) * 5);
+    }
     .sm\:text-left {
       text-align: left;
     }
@@ -4624,6 +4720,14 @@
     .md\:justify-between {
       justify-content: space-between;
     }
+    .md\:bg-card\/60 {
+      background-color: color-mix(in srgb, hsl(var(--card)) 60%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .md\:bg-card\/60 {
+        background-color: color-mix(in oklab, var(--color-card) 60%, transparent);
+      }
+    }
   }
   @media (width >= 64rem) {
     .lg\:col-span-1 {
@@ -4632,12 +4736,21 @@
     .lg\:ml-\[var\(--sb-content-margin\,0px\)\] {
       margin-left: var(--sb-content-margin,0px);
     }
+    .lg\:ml-auto {
+      margin-left: auto;
+    }
     .lg\:flex {
       display: flex;
     }
     .lg\:hidden {
       display: none;
     }
+    .lg\:max-w-sm {
+      max-width: var(--container-sm);
+    }
+    .lg\:flex-1 {
+      flex: 1;
+    }
     .lg\:grid-cols-3 {
       grid-template-columns: repeat(3, minmax(0, 1fr));
     }
@@ -4653,12 +4766,22 @@
     .lg\:flex-col {
       flex-direction: column;
     }
+    .lg\:flex-row {
+      flex-direction: row;
+    }
+    .lg\:items-center {
+      align-items: center;
+    }
     .lg\:p-4 {
       padding: calc(var(--spacing) * 4);
     }
     .lg\:px-8 {
       padding-inline: calc(var(--spacing) * 8);
     }
+    .lg\:text-2xl {
+      font-size: var(--text-2xl);
+      line-height: var(--tw-leading, var(--text-2xl--line-height));
+    }
   }
   @media (width >= 80rem) {
     .xl\:col-span-4 {
@@ -4681,6 +4804,27 @@
     .dark\:text-neutral-500 {
       color: var(--color-neutral-500);
     }
+    .dark\:text-white {
+      color: var(--color-white);
+    }
+    .dark\:text-white\/50 {
+      color: color-mix(in srgb, #fff 50%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .dark\:text-white\/50 {
+        color: color-mix(in oklab, var(--color-white) 50%, transparent);
+      }
+    }
+    @media (hover: hover) {
+      .dark\:hover\:text-white\/50:hover {
+        color: color-mix(in srgb, #fff 50%, transparent);
+      }
+      @supports (color: color-mix(in lab, red, red)) {
+        .dark\:hover\:text-white\/50:hover {
+          color: color-mix(in oklab, var(--color-white) 50%, transparent);
+        }
+      }
+    }
   }
   .\[\&_svg\]\:pointer-events-none svg {
     pointer-events: none;
@@ -4765,6 +4909,24 @@
   .\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]) {
     padding-right: 0px;
   }
+  @media (width < 40rem) {
+    .max-sm\:\[\&\:not\(\:nth-child\(2n\+1\)\)\]\:border-l:not(:nth-child(2n+1)) {
+      border-left-style: var(--tw-border-style);
+      border-left-width: 1px;
+    }
+  }
+  @media (width >= 48rem) {
+    .md\:\[\&\:not\(\:nth-child\(3n\+1\)\)\]\:border-l:not(:nth-child(3n+1)) {
+      border-left-style: var(--tw-border-style);
+      border-left-width: 1px;
+    }
+  }
+  @media (width >= 40rem) {
+    .sm\:\[\&\:not\(\:nth-child\(4n\+1\)\)\]\:border-l:not(:nth-child(4n+1)) {
+      border-left-style: var(--tw-border-style);
+      border-left-width: 1px;
+    }
+  }
   .\[\&\>span\]\:line-clamp-1 > span {
     overflow: hidden;
     display: -webkit-box;
@@ -6120,7 +6282,7 @@
   inherits: false;
   initial-value: 0;
 }
-@property --tw-divide-y-reverse {
+@property --tw-divide-x-reverse {
   syntax: "*";
   inherits: false;
   initial-value: 0;
@@ -6130,6 +6292,11 @@
   inherits: false;
   initial-value: solid;
 }
+@property --tw-divide-y-reverse {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
 @property --tw-gradient-position {
   syntax: "*";
   inherits: false;
@@ -6430,8 +6597,9 @@
       --tw-skew-y: initial;
       --tw-space-y-reverse: 0;
       --tw-space-x-reverse: 0;
-      --tw-divide-y-reverse: 0;
+      --tw-divide-x-reverse: 0;
       --tw-border-style: solid;
+      --tw-divide-y-reverse: 0;
       --tw-gradient-position: initial;
       --tw-gradient-from: #0000;
       --tw-gradient-via: #0000;

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export { ArtifactPane, ArtifactPaneProps, Avatar, AvatarFallback, AvatarImage, Badge, BadgeProps, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CodeBlock, CodeBlockProps, CopyButton, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropZone, DropZoneProps, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, EmptyStateProps, InlineCode, InlineCodeProps, Input, InputProps, Label, Progress, SegmentedControl, SegmentedControlOption, SegmentedControlProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SidebarDropZone, SidebarDropZoneProps, Skeleton, SkeletonCard, SkeletonTable, StatCard, StatCardProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TerminalDisplay, TerminalCursor as TerminalDisplayCursor, TerminalInput as TerminalDisplayInput, TerminalLine as TerminalDisplayLine, Textarea, TextareaProps, ThemeToggle, Toast, ToastContainer, ToastProvider, UploadFile, UploadProgress, UploadProgressProps, badgeVariants, buttonVariants, useTheme, useToast } from '@tangle-network/ui/primitives';
+export { ArtifactPane, ArtifactPaneProps, Avatar, AvatarFallback, AvatarImage, Badge, BadgeProps, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CodeBlock, CodeBlockProps, CopyButton, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropZone, DropZoneProps, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, EmptyStateProps, FilterField, FilterFieldProps, InlineCode, InlineCodeProps, Input, InputProps, Label, Metric, MetricProps, MetricStrip, MetricStripProps, Progress, SegmentedControl, SegmentedControlOption, SegmentedControlProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SidebarDropZone, SidebarDropZoneProps, Skeleton, SkeletonCard, SkeletonTable, StatCard, StatCardProps, StatusPill, StatusPillProps, StatusTone, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TerminalDisplay, TerminalCursor as TerminalDisplayCursor, TerminalInput as TerminalDisplayInput, TerminalLine as TerminalDisplayLine, Textarea, TextareaProps, ThemeToggle, Toast, ToastContainer, ToastProvider, Toolbar, ToolbarProps, UploadFile, UploadProgress, UploadProgressProps, badgeVariants, buttonVariants, useTheme, useToast } from '@tangle-network/ui/primitives';
 export { L as Logo, a as LogoProps, T as TangleKnot } from './logo-CaIvk3J1.js';
 export { CodeBlock as CodeBlockDisplay, Markdown, MarkdownProps } from '@tangle-network/ui/markdown';
 export { AgentWorkbench, ApprovalConfidenceStat, ApprovalItem, ApprovalQueue, ApprovalQueueProps, AuditCheck, AuditResults, AuditResultsProps, BannerType, CalendarEvent, CalendarView, CalendarViewProps, ContextBadge, DirectoryPane, DirectoryPaneProps, FormAudit, RuntimePane, RuntimePaneProps, SESSION_CREATED_EVENT, SandboxWorkbench, SandboxWorkbenchArtifact, SandboxWorkbenchCustomArtifact, SandboxWorkbenchFileArtifact, SandboxWorkbenchLayoutOptions, SandboxWorkbenchMarkdownArtifact, SandboxWorkbenchOpenUIArtifact, SandboxWorkbenchProps, SandboxWorkbenchSessionProps, SessionActivityMonitor, SessionActivityMonitorProps, SessionCreatedDetail, SessionOptimisticController, SessionSidebar, SessionSidebarBadge, SessionSidebarFilter, SessionSidebarItem, SessionSidebarLink, SessionSidebarProps, ShellShouldRevalidateArgs, ShellShouldRevalidateOptions, StatusBanner, StatusBannerProps, StatusBar, StatusBarProps, TaskBoard, TaskBoardColumn, TaskBoardItem, TaskBoardProps, TerminalLine, TerminalPanel, TerminalProps, UseOptimisticSessionItemsOptions, WorkspaceLayout, WorkspaceLayoutProps, WorkspacePaneHeader, WorkspacePaneHeaderProps, createShellShouldRevalidate, dispatchSessionCreated, shellShouldRevalidate, useOptimisticSessionItems } from './workspace.js';
@@ -7,7 +7,7 @@ export { OpenUIAction, OpenUIActionsNode, OpenUIArtifactRenderer, OpenUIArtifact
 export { AgentTimeline, AgentTimelineArtifactItem, AgentTimelineCustomItem, AgentTimelineItem, AgentTimelineMessageItem, AgentTimelineProps, AgentTimelineStatusItem, AgentTimelineTone, AgentTimelineToolGroupItem, AgentTimelineToolItem, ChatContainer, ChatContainerProps, ChatMessage, ChatMessageProps, MessageList, MessageListProps, MessageRole, ThinkingIndicator, ThinkingIndicatorProps, UserMessage, UserMessageProps } from '@tangle-network/ui/chat';
 export { AgentComposer, AgentComposerMention, AgentComposerProps, AgentProfileCapability, AgentProfileDraft, AgentProfileOption, AgentProfilePicker, AgentProfilePickerProps, ArtifactAgentDock, ArtifactAgentDockProps, ArtifactAgentDockTransport, ArtifactDockMessage, ArtifactDockStreamEvent, ArtifactKind, ArtifactScope, ComposerContextItem, ComposerFile, ComposerFileRejection, ComposerFileValidationConfig, DEFAULT_REASONING_LEVEL_OPTIONS, HARNESS_REASONING_OPTIONS, MENTION_PILL_CLASS, MentionItem, ReasoningLevel, ReasoningLevelOption, ReasoningLevelPicker, ReasoningLevelPickerProps, createFetchTransport, isAcceptedType, validateComposerFiles } from './chat.js';
 export { HarnessType, modelProvider, snapHarnessToModel } from '@tangle-network/agent-interface';
-export { ExpandedToolDetail, ExpandedToolDetailProps, FeedSegment, InlineThinkingItem, InlineThinkingItemProps, InlineToolItem, InlineToolItemProps, LiveDuration, RunGroup, RunGroupProps, ToolCallData, ToolCallFeed, ToolCallFeedProps, ToolCallStatus, ToolCallType, parseToolEvent } from '@tangle-network/ui/run';
+export { ExpandedToolDetail, ExpandedToolDetailProps, FeedSegment, InlineThinkingItem, InlineThinkingItemProps, InlineToolItem, InlineToolItemProps, LiveDuration, RunGroup, RunGroupProps, RunRowShell, RunRowShellProps, RunRowStatus, RunRowStatusDot, ToolCallData, ToolCallFeed, ToolCallFeedProps, ToolCallStatus, ToolCallType, parseToolEvent } from '@tangle-network/ui/run';
 export { CommandPreview, CommandPreviewProps, DiffPreview, DiffPreviewProps, GlobResultsPreview, GlobResultsPreviewProps, GrepResultsPreview, GrepResultsPreviewProps, QuestionPreview, QuestionPreviewProps, WebSearchPreview, WebSearchPreviewProps, WriteFilePreview, WriteFilePreviewProps } from '@tangle-network/ui/tool-previews';
 export { FileArtifactPane, FileArtifactPaneProps, FileFormat, FileNode, FilePreview, FilePreviewProps, FileTabData, FileTabs, FileTabsProps, FileTree, FileTreeProps, FileTreeVisibilityOptions, RichFileTree, RichFileTreeGitEntry, RichFileTreeGitStatus, RichFileTreeProps, RichFileTreeThemeVars, detectFileFormat, fileExtension, filterFileTree, getCodeLanguage, getFormatLabel, getSyntaxLanguage } from '@tangle-network/ui/files';
 export { ActivityFeed, ActivityFeedProps, ActivityItem, AppearanceController, Backend, BackendConfig, BackendConfigProps, BackendSelector, BackendSelectorProps, BackendStatusData, ClusterStatusBar, ClusterStatusBarProps, ClusterStatusItem, CreditBalance, CreditBalanceProps, DashboardLayout, DashboardLayoutProps, DashboardProfile, DashboardSnapshotInfo, DashboardUser, GitCommitData, GitPanel, GitPanelProps, GitStatusData, HARNESS_BRAND, HARNESS_OPTIONS, HarnessBrand, HarnessLogo, HarnessLogoProps, HarnessPicker, HarnessPickerProps, INSUFFICIENT_BALANCE_CODE, InfoPanel, InfoPanelProps, InsufficientBalance, Invoice, InvoiceTable, InvoiceTableProps, McpServer, MetricAreaChart, MetricAreaChartProps, MetricChartPoint, MetricChartTone, NavItem, NetworkConfig, NetworkConfigData, NetworkConfigProps, NewSandboxCard, NewSandboxCardProps, OutOfCreditsModal, OutOfCreditsModalProps, PlanCardData, PlanCards, PlanCardsProps, PlanFeature, ProcessInfo, ProcessList, ProcessListProps, ProductVariant, ProfileAvatar, ProfileAvatarProps, ProfileComparison, ProfileComparisonProps, ProfileSelector, ProfileSelectorProps, PromoBanner, PromoBannerProps, RailButton, RailButtonProps, RailCollapseToggle, RailCollapseToggleProps, RailExpandable, RailExpandableProps, RailExpandableSubItem, RailFlyout, RailFlyoutProps, RailHeader, RailHeaderProps, RailModeButton, RailModeButtonProps, RailSeparator, RailSeparatorProps, RailThemeToggle, RailTooltip, RailTooltipProps, ResourceMeter, ResourceMeterProps, ResourceSnapshot, ResourceSnapshotItem, ResourceSnapshotProps, SIDEBAR_MOBILE_WIDTH, SIDEBAR_PANEL_WIDTH, SIDEBAR_RAIL_LABELED_WIDTH, SIDEBAR_RAIL_WIDTH, SIDEBAR_TOTAL_WIDTH, SandboxCard, SandboxCardData, SandboxCardProps, SandboxStatus, SandboxTable, SandboxTableProps, Sidebar, SidebarContent, SidebarContentProps, SidebarLayout, SidebarLayoutFlyoutItem, SidebarLayoutNavItem, SidebarLayoutProps, SidebarPanel, SidebarPanelContent, SidebarPanelContentProps, SidebarPanelHeader, SidebarPanelHeaderProps, SidebarPanelProps, SidebarProps, SidebarProvider, SidebarProviderProps, SidebarRail, SidebarRailFooter, SidebarRailFooterProps, SidebarRailHeader, SidebarRailHeaderProps, SidebarRailNav, SidebarRailNavProps, SidebarRailProps, SidebarUser, SnapshotList, SnapshotListProps, SystemLogsViewer, SystemLogsViewerProps, TeamRole, ThemeMode, UsageSummary, UsageSummaryData, UsageSummaryProps, Variant, VariantList, VariantListProps, VariantOutcome, VariantStatus, canAdminSandbox, chatCapableHarnesses, parseInsufficientBalance, useSidebar } from './dashboard.js';

package/dist/index.js

@@ -111,9 +111,11 @@ import {
   InlineToolItem,
   LiveDuration,
   RunGroup,
+  RunRowShell,
+  RunRowStatusDot,
   ToolCallFeed,
   parseToolEvent
-} from "./chunk-A5QIQYS6.js";
+} from "./chunk-M4K7ZGR2.js";
 import {
   AgentWorkbench,
   ApprovalQueue,
@@ -151,7 +153,7 @@ import {
   buildUnifiedPatch,
   computeDiffStats,
   resolveLanguage
-} from "./chunk-5JXSQZZH.js";
+} from "./chunk-K5RMJOH6.js";
 import {
   FileArtifactPane,
   FilePreview,
@@ -227,7 +229,7 @@ import {
   chatCapableHarnesses,
   parseInsufficientBalance,
   useSidebar
-} from "./chunk-5BAZTDVH.js";
+} from "./chunk-K4Q4E7D7.js";
 import {
   BillingDashboard,
   InfoPanel,
@@ -281,10 +283,13 @@ import {
   DropdownMenuSubTrigger,
   DropdownMenuTrigger,
   EmptyState,
+  FilterField,
   InlineCode,
   Input,
   Label,
   Logo,
+  Metric,
+  MetricStrip,
   Progress,
   SegmentedControl,
   Select,
@@ -302,6 +307,7 @@ import {
   SkeletonCard,
   SkeletonTable,
   StatCard,
+  StatusPill,
   Switch,
   Table,
   TableBody,
@@ -321,12 +327,13 @@ import {
   ThemeToggle,
   ToastContainer,
   ToastProvider,
+  Toolbar,
   UploadProgress,
   badgeVariants,
   buttonVariants,
   useTheme,
   useToast
-} from "./chunk-FG6H4554.js";
+} from "./chunk-2XPJ2XF7.js";
 import {
   ModelBrandStack,
   canonicalModelId,
@@ -431,6 +438,7 @@ export {
   FilePreview,
   FileTabs,
   FileTree,
+  FilterField,
   GitHubLoginButton,
   GitPanel,
   GitStatusBadge,
@@ -455,7 +463,9 @@ export {
   MENTION_PILL_CLASS,
   Markdown,
   MessageList,
+  Metric,
   MetricAreaChart,
+  MetricStrip,
   ModelBrandStack,
   NetworkConfig,
   NewSandboxCard,
@@ -489,6 +499,8 @@ export {
   ResourceSnapshot,
   RichFileTree,
   RunGroup,
+  RunRowShell,
+  RunRowStatusDot,
   RuntimePane,
   SESSION_CREATED_EVENT,
   SIDEBAR_MOBILE_WIDTH,
@@ -532,6 +544,7 @@ export {
   StatCard,
   StatusBanner,
   StatusBar,
+  StatusPill,
   Switch,
   SystemLogsViewer,
   TOOL_CATEGORY_ICONS,
@@ -562,6 +575,7 @@ export {
   ToastContainer,
   ToastProvider,
   ToolCallFeed,
+  Toolbar,
   UploadProgress,
   UsageChart,
   UsageSummary,

package/dist/pages.js

@@ -23,7 +23,7 @@ import {
   SelectValue,
   Switch,
   Textarea
-} from "./chunk-FG6H4554.js";
+} from "./chunk-2XPJ2XF7.js";
 import "./chunk-RQZRXKMR.js";
 import {
   cn
@@ -1687,7 +1687,7 @@ function ProvisioningWizard({
   ] });
 }
 
-// src/pages/pricing-page.tsx
+// src/pages/standalone-pricing-page.tsx
 import * as React4 from "react";
 import { Skeleton as Skeleton2, SkeletonCard as SkeletonCard2 } from "@tangle-network/ui/primitives";
 import { ChevronDown } from "lucide-react";

package/dist/primitives.d.ts

@@ -1,4 +1,4 @@
-export { ArtifactPane, ArtifactPaneProps, Avatar, AvatarFallback, AvatarImage, Badge, BadgeProps, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CodeBlock, CodeBlockProps, CopyButton, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropZone, DropZoneProps, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, EmptyStateProps, InlineCode, InlineCodeProps, Input, InputProps, Label, Progress, SegmentedControl, SegmentedControlOption, SegmentedControlProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SidebarDropZone, SidebarDropZoneProps, Skeleton, SkeletonCard, SkeletonTable, StatCard, StatCardProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TerminalCursor, TerminalDisplay, TerminalInput, TerminalLine, Textarea, TextareaProps, ThemeToggle, Toast, ToastContainer, ToastProvider, UploadFile, UploadProgress, UploadProgressProps, badgeVariants, buttonVariants, useTheme, useToast } from '@tangle-network/ui/primitives';
+export { ArtifactPane, ArtifactPaneProps, Avatar, AvatarFallback, AvatarImage, Badge, BadgeProps, Button, ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CodeBlock, CodeBlockProps, CopyButton, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropZone, DropZoneProps, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, EmptyStateProps, FilterField, FilterFieldProps, InlineCode, InlineCodeProps, Input, InputProps, Label, Metric, MetricProps, MetricStrip, MetricStripProps, Progress, SegmentedControl, SegmentedControlOption, SegmentedControlProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SidebarDropZone, SidebarDropZoneProps, Skeleton, SkeletonCard, SkeletonTable, StatCard, StatCardProps, StatusPill, StatusPillProps, StatusTone, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TerminalCursor, TerminalDisplay, TerminalInput, TerminalLine, Textarea, TextareaProps, ThemeToggle, Toast, ToastContainer, ToastProvider, Toolbar, ToolbarProps, UploadFile, UploadProgress, UploadProgressProps, badgeVariants, buttonVariants, useTheme, useToast } from '@tangle-network/ui/primitives';
 export { L as Logo, a as LogoProps, T as TangleKnot } from './logo-CaIvk3J1.js';
 import * as React from 'react';
 import { HTMLAttributes, ElementType, ReactNode } from 'react';
@@ -20,8 +20,6 @@ import { HTMLAttributes, ElementType, ReactNode } from 'react';
  * <h1> for accessibility and SEO.
  */
 type HeadingVariant = "display" | "hero" | "page" | "section" | "subsection" | "eyebrow";
-/** @deprecated Renamed to {@link HeadingVariant}; kept as an alias. */
-type HeadingRole = HeadingVariant;
 interface HeadingProps extends Omit<HTMLAttributes<HTMLElement>, "role"> {
     /** Type role from the design system (size + weight + tracking + leading). */
     role: HeadingVariant;
@@ -72,4 +70,4 @@ interface PageShellProps {
  */
 declare function PageShell({ children, className }: PageShellProps): React.JSX.Element;
 
-export { Heading, type HeadingProps, type HeadingRole, type HeadingVariant, PageHeader, type PageHeaderProps, PageShell, type PageShellProps, SectionTitle, type SectionTitleProps };
+export { Heading, type HeadingProps, type HeadingVariant, PageHeader, type PageHeaderProps, PageShell, type PageShellProps, SectionTitle, type SectionTitleProps };

package/dist/primitives.js

@@ -40,11 +40,14 @@ import {
   DropdownMenuSubTrigger,
   DropdownMenuTrigger,
   EmptyState,
+  FilterField,
   Heading,
   InlineCode,
   Input,
   Label,
   Logo,
+  Metric,
+  MetricStrip,
   PageHeader,
   PageShell,
   Progress,
@@ -65,6 +68,7 @@ import {
   SkeletonCard,
   SkeletonTable,
   StatCard,
+  StatusPill,
   Switch,
   Table,
   TableBody,
@@ -87,12 +91,13 @@ import {
   ThemeToggle,
   ToastContainer,
   ToastProvider,
+  Toolbar,
   UploadProgress,
   badgeVariants,
   buttonVariants,
   useTheme,
   useToast
-} from "./chunk-FG6H4554.js";
+} from "./chunk-2XPJ2XF7.js";
 import "./chunk-EI44GEQ5.js";
 import "./chunk-CZ7CSFO4.js";
 export {
@@ -137,11 +142,14 @@ export {
   DropdownMenuSubTrigger,
   DropdownMenuTrigger,
   EmptyState,
+  FilterField,
   Heading,
   InlineCode,
   Input,
   Label,
   Logo,
+  Metric,
+  MetricStrip,
   PageHeader,
   PageShell,
   Progress,
@@ -162,6 +170,7 @@ export {
   SkeletonCard,
   SkeletonTable,
   StatCard,
+  StatusPill,
   Switch,
   Table,
   TableBody,
@@ -184,6 +193,7 @@ export {
   ThemeToggle,
   ToastContainer,
   ToastProvider,
+  Toolbar,
   UploadProgress,
   badgeVariants,
   buttonVariants,

package/dist/run.d.ts

@@ -1 +1 @@
-export { ExpandedToolDetail, ExpandedToolDetailProps, FeedSegment, InlineThinkingItem, InlineThinkingItemProps, InlineToolItem, InlineToolItemProps, LiveDuration, RunGroup, RunGroupProps, ToolCallData, ToolCallFeed, ToolCallFeedProps, ToolCallStatus, ToolCallType, parseToolEvent } from '@tangle-network/ui/run';
+export { ExpandedToolDetail, ExpandedToolDetailProps, FeedSegment, InlineThinkingItem, InlineThinkingItemProps, InlineToolItem, InlineToolItemProps, LiveDuration, RunGroup, RunGroupProps, RunRowShell, RunRowShellProps, RunRowStatus, RunRowStatusDot, ToolCallData, ToolCallFeed, ToolCallFeedProps, ToolCallStatus, ToolCallType, parseToolEvent } from '@tangle-network/ui/run';

package/dist/run.js

@@ -4,9 +4,11 @@ import {
   InlineToolItem,
   LiveDuration,
   RunGroup,
+  RunRowShell,
+  RunRowStatusDot,
   ToolCallFeed,
   parseToolEvent
-} from "./chunk-A5QIQYS6.js";
+} from "./chunk-M4K7ZGR2.js";
 import "./chunk-CZ7CSFO4.js";
 export {
   ExpandedToolDetail,
@@ -14,6 +16,8 @@ export {
   InlineToolItem,
   LiveDuration,
   RunGroup,
+  RunRowShell,
+  RunRowStatusDot,
   ToolCallFeed,
   parseToolEvent
 };

package/dist/styles.css

@@ -798,6 +798,9 @@
   .h-56 {
     height: calc(var(--spacing) * 56);
   }
+  .h-80 {
+    height: calc(var(--spacing) * 80);
+  }
   .h-\[3px\] {
     height: 3px;
   }
@@ -1359,6 +1362,9 @@
   .grow {
     flex-grow: 1;
   }
+  .basis-1\/3 {
+    flex-basis: calc(1 / 3 * 100%);
+  }
   .caption-bottom {
     caption-side: bottom;
   }
@@ -1665,6 +1671,9 @@
   .gap-x-4 {
     column-gap: calc(var(--spacing) * 4);
   }
+  .gap-x-6 {
+    column-gap: calc(var(--spacing) * 6);
+  }
   :where(.-space-x-2 > :not(:last-child)) {
     --tw-space-x-reverse: 0;
     margin-inline-start: calc(calc(var(--spacing) * -2) * var(--tw-space-x-reverse));
@@ -1673,9 +1682,18 @@
   .gap-y-1 {
     row-gap: var(--spacing);
   }
+  .gap-y-2 {
+    row-gap: calc(var(--spacing) * 2);
+  }
   .gap-y-3 {
     row-gap: calc(var(--spacing) * 3);
   }
+  :where(.divide-x > :not(:last-child)) {
+    --tw-divide-x-reverse: 0;
+    border-inline-style: var(--tw-border-style);
+    border-inline-start-width: calc(1px * var(--tw-divide-x-reverse));
+    border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
+  }
   :where(.divide-y > :not(:last-child)) {
     --tw-divide-y-reverse: 0;
     border-bottom-style: var(--tw-border-style);
@@ -1847,6 +1865,10 @@
     border-left-style: var(--tw-border-style);
     border-left-width: 1px;
   }
+  .border-l-0 {
+    border-left-style: var(--tw-border-style);
+    border-left-width: 0px;
+  }
   .border-l-2 {
     border-left-style: var(--tw-border-style);
     border-left-width: 2px;
@@ -2330,6 +2352,12 @@
       background-color: color-mix(in oklab, var(--color-card) 50%, transparent);
     }
   }
+  .bg-card\/60 {
+    background-color: color-mix(in srgb, hsl(var(--card)) 60%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-card) 60%, transparent);
+    }
+  }
   .bg-card\/80 {
     background-color: color-mix(in srgb, hsl(var(--card)) 80%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2665,6 +2693,9 @@
   .p-16 {
     padding: calc(var(--spacing) * 16);
   }
+  .px-0 {
+    padding-inline: 0px;
+  }
   .px-0\.5 {
     padding-inline: calc(var(--spacing) * 0.5);
   }
@@ -3136,6 +3167,9 @@
     --tw-tracking: var(--tracking-widest);
     letter-spacing: var(--tracking-widest);
   }
+  .text-balance {
+    text-wrap: balance;
+  }
   .break-words {
     overflow-wrap: break-word;
   }
@@ -3148,6 +3182,12 @@
   .whitespace-pre-wrap {
     white-space: pre-wrap;
   }
+  .text-\[color\:var\(--text-dim\)\] {
+    color: var(--text-dim);
+  }
+  .text-\[color\:var\(--x\)\] {
+    color: var(--x);
+  }
   .text-\[var\(--accent-text\)\] {
     color: var(--accent-text);
   }
@@ -3256,6 +3296,12 @@
   .text-\[var\(--text-dim\)\] {
     color: var(--text-dim);
   }
+  .text-\[var\(--text-dim\)\]\/70 {
+    color: var(--text-dim);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--text-dim) 70%, transparent);
+    }
+  }
   .text-\[var\(--text-muted\)\] {
     color: var(--text-muted);
   }
@@ -3271,6 +3317,12 @@
   .text-\[var\(--text-secondary\)\] {
     color: var(--text-secondary);
   }
+  .text-\[var\(--x\)\]\/40 {
+    color: var(--x);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--x) 40%, transparent);
+    }
+  }
   .text-accent-foreground {
     color: var(--color-accent-foreground);
   }
@@ -3391,6 +3443,18 @@
   .text-white {
     color: var(--color-white);
   }
+  .text-white\/50 {
+    color: color-mix(in srgb, #fff 50%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--color-white) 50%, transparent);
+    }
+  }
+  .text-white\/70 {
+    color: color-mix(in srgb, #fff 70%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--color-white) 70%, transparent);
+    }
+  }
   .text-yellow-400 {
     color: var(--color-yellow-400);
   }
@@ -3725,6 +3789,14 @@
         border-color: color-mix(in oklab, var(--color-primary) 40%, transparent);
       }
     }
+    .group-hover\:text-foreground\/40:is(:where(.group):hover *) {
+      color: color-mix(in srgb, hsl(var(--foreground)) 40%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .group-hover\:text-foreground\/40:is(:where(.group):hover *) {
+        color: color-mix(in oklab, var(--color-foreground) 40%, transparent);
+      }
+    }
     .group-hover\:text-primary:is(:where(.group):hover *) {
       color: var(--color-primary);
     }
@@ -4171,6 +4243,14 @@
     .hover\:text-green-600:hover {
       color: var(--color-green-600);
     }
+    .hover\:text-muted-foreground\/70:hover {
+      color: color-mix(in srgb, hsl(var(--muted-foreground)) 70%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .hover\:text-muted-foreground\/70:hover {
+        color: color-mix(in oklab, var(--color-muted-foreground) 70%, transparent);
+      }
+    }
     .hover\:text-primary:hover {
       color: var(--color-primary);
     }
@@ -4188,6 +4268,9 @@
     .hover\:underline:hover {
       text-decoration-line: underline;
     }
+    .hover\:opacity-50:hover {
+      opacity: 50%;
+    }
     .hover\:opacity-80:hover {
       opacity: 80%;
     }
@@ -4525,6 +4608,16 @@
   .data-\[state\=unchecked\]\:bg-input[data-state="unchecked"] {
     background-color: var(--color-input);
   }
+  @supports (display:grid) {
+    .supports-\[display\:grid\]\:text-white\/50 {
+      color: color-mix(in srgb, #fff 50%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .supports-\[display\:grid\]\:text-white\/50 {
+        color: color-mix(in oklab, var(--color-white) 50%, transparent);
+      }
+    }
+  }
   @media (width < 64rem) {
     .max-lg\:hidden {
       display: none;
@@ -4568,6 +4661,9 @@
       margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
       margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
     }
+    .sm\:p-5 {
+      padding: calc(var(--spacing) * 5);
+    }
     .sm\:text-left {
       text-align: left;
     }
@@ -4624,6 +4720,14 @@
     .md\:justify-between {
       justify-content: space-between;
     }
+    .md\:bg-card\/60 {
+      background-color: color-mix(in srgb, hsl(var(--card)) 60%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .md\:bg-card\/60 {
+        background-color: color-mix(in oklab, var(--color-card) 60%, transparent);
+      }
+    }
   }
   @media (width >= 64rem) {
     .lg\:col-span-1 {
@@ -4632,12 +4736,21 @@
     .lg\:ml-\[var\(--sb-content-margin\,0px\)\] {
       margin-left: var(--sb-content-margin,0px);
     }
+    .lg\:ml-auto {
+      margin-left: auto;
+    }
     .lg\:flex {
       display: flex;
     }
     .lg\:hidden {
       display: none;
     }
+    .lg\:max-w-sm {
+      max-width: var(--container-sm);
+    }
+    .lg\:flex-1 {
+      flex: 1;
+    }
     .lg\:grid-cols-3 {
       grid-template-columns: repeat(3, minmax(0, 1fr));
     }
@@ -4653,12 +4766,22 @@
     .lg\:flex-col {
       flex-direction: column;
     }
+    .lg\:flex-row {
+      flex-direction: row;
+    }
+    .lg\:items-center {
+      align-items: center;
+    }
     .lg\:p-4 {
       padding: calc(var(--spacing) * 4);
     }
     .lg\:px-8 {
       padding-inline: calc(var(--spacing) * 8);
     }
+    .lg\:text-2xl {
+      font-size: var(--text-2xl);
+      line-height: var(--tw-leading, var(--text-2xl--line-height));
+    }
   }
   @media (width >= 80rem) {
     .xl\:col-span-4 {
@@ -4681,6 +4804,27 @@
     .dark\:text-neutral-500 {
       color: var(--color-neutral-500);
     }
+    .dark\:text-white {
+      color: var(--color-white);
+    }
+    .dark\:text-white\/50 {
+      color: color-mix(in srgb, #fff 50%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .dark\:text-white\/50 {
+        color: color-mix(in oklab, var(--color-white) 50%, transparent);
+      }
+    }
+    @media (hover: hover) {
+      .dark\:hover\:text-white\/50:hover {
+        color: color-mix(in srgb, #fff 50%, transparent);
+      }
+      @supports (color: color-mix(in lab, red, red)) {
+        .dark\:hover\:text-white\/50:hover {
+          color: color-mix(in oklab, var(--color-white) 50%, transparent);
+        }
+      }
+    }
   }
   .\[\&_svg\]\:pointer-events-none svg {
     pointer-events: none;
@@ -4765,6 +4909,24 @@
   .\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]) {
     padding-right: 0px;
   }
+  @media (width < 40rem) {
+    .max-sm\:\[\&\:not\(\:nth-child\(2n\+1\)\)\]\:border-l:not(:nth-child(2n+1)) {
+      border-left-style: var(--tw-border-style);
+      border-left-width: 1px;
+    }
+  }
+  @media (width >= 48rem) {
+    .md\:\[\&\:not\(\:nth-child\(3n\+1\)\)\]\:border-l:not(:nth-child(3n+1)) {
+      border-left-style: var(--tw-border-style);
+      border-left-width: 1px;
+    }
+  }
+  @media (width >= 40rem) {
+    .sm\:\[\&\:not\(\:nth-child\(4n\+1\)\)\]\:border-l:not(:nth-child(4n+1)) {
+      border-left-style: var(--tw-border-style);
+      border-left-width: 1px;
+    }
+  }
   .\[\&\>span\]\:line-clamp-1 > span {
     overflow: hidden;
     display: -webkit-box;
@@ -6120,7 +6282,7 @@
   inherits: false;
   initial-value: 0;
 }
-@property --tw-divide-y-reverse {
+@property --tw-divide-x-reverse {
   syntax: "*";
   inherits: false;
   initial-value: 0;
@@ -6130,6 +6292,11 @@
   inherits: false;
   initial-value: solid;
 }
+@property --tw-divide-y-reverse {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
 @property --tw-gradient-position {
   syntax: "*";
   inherits: false;
@@ -6430,8 +6597,9 @@
       --tw-skew-y: initial;
       --tw-space-y-reverse: 0;
       --tw-space-x-reverse: 0;
-      --tw-divide-y-reverse: 0;
+      --tw-divide-x-reverse: 0;
       --tw-border-style: solid;
+      --tw-divide-y-reverse: 0;
       --tw-gradient-position: initial;
       --tw-gradient-from: #0000;
       --tw-gradient-via: #0000;

package/dist/workbench.js

@@ -12,13 +12,13 @@ import {
   buildUnifiedPatch,
   computeDiffStats,
   resolveLanguage
-} from "./chunk-5JXSQZZH.js";
+} from "./chunk-K5RMJOH6.js";
 import "./chunk-PZVUIUUW.js";
-import "./chunk-5BAZTDVH.js";
+import "./chunk-K4Q4E7D7.js";
 import "./chunk-OMUIPJQZ.js";
 import "./chunk-WYMAC3T3.js";
 import "./chunk-KEYPUGS3.js";
-import "./chunk-FG6H4554.js";
+import "./chunk-2XPJ2XF7.js";
 import "./chunk-RQZRXKMR.js";
 import "./chunk-BGVEHENC.js";
 import "./chunk-EI44GEQ5.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tangle-network/sandbox-ui",
-  "version": "0.101.2",
+  "version": "0.103.0",
   "description": "Unified UI component library for Tangle Sandbox — primitives, chat, dashboard, terminal, editor, and workspace components",
   "repository": {
     "type": "git",
@@ -120,7 +120,7 @@
     "@nanostores/react": ">=0.8.4 <2.0.0",
     "@tangle-network/agent-interface": ">=0.36.0 <0.48.0",
     "@tangle-network/brand": "^1.5.0",
-    "@tangle-network/ui": "^11.0.0",
+    "@tangle-network/ui": "^11.5.0",
     "@tanstack/react-query": "^5.0.0",
     "@tiptap/extension-collaboration": ">=3.20.4 <4.0.0",
     "@tiptap/extension-collaboration-caret": ">=3.7.0 <4.0.0",
@@ -192,7 +192,7 @@
     "@tailwindcss/postcss": "^4.3.3",
     "@tangle-network/agent-interface": "0.47.0",
     "@tangle-network/brand": "^1.5.0",
-    "@tangle-network/ui": "^11.2.0",
+    "@tangle-network/ui": "^11.5.0",
     "@tanstack/react-query": "^5.101.4",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^7.0.0",