@tangle-network/sandbox-ui 0.56.0 → 0.58.0

package/dist/assistant.js

@@ -9,7 +9,7 @@ import {
 } from "./chunk-7JLB7UZ3.js";
 import {
   ModelPicker
-} from "./chunk-LQHTCM56.js";
+} from "./chunk-SF6LPMMN.js";
 import "./chunk-EI44GEQ5.js";
 import "./chunk-U67V476Y.js";
 

package/dist/chat.d.ts

@@ -2,8 +2,10 @@ import { MessageRole } from '@tangle-network/ui/chat';
 export { AgentTimeline, AgentTimelineArtifactItem, AgentTimelineCustomItem, AgentTimelineItem, AgentTimelineMessageItem, AgentTimelineProps, AgentTimelineStatusItem, AgentTimelineTone, AgentTimelineToolGroupItem, AgentTimelineToolItem, ChatContainer, ChatContainerProps, ChatInput, ChatInputProps, ChatMessage, ChatMessageProps, MessageList, MessageListProps, MessageRole, PendingFile, ThinkingIndicator, ThinkingIndicatorProps, UserMessage, UserMessageProps } from '@tangle-network/ui/chat';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReasoningEffort, HarnessType } from '@tangle-network/agent-interface';
+export { modelProvider, snapHarnessToModel } from '@tangle-network/agent-interface';
+import * as Popover from '@radix-ui/react-dropdown-menu';
 import * as React from 'react';
-import { M as ModelInfo } from './model-picker-NOWFpRY4.js';
+import { M as ModelInfo } from './model-picker-COjPVMzg.js';
 
 /**
  * A reasoning selection: `auto` is a UI-only sentinel ("let the harness/model default decide",
@@ -33,9 +35,18 @@ interface ReasoningLevelPickerProps {
      * Omit to show every option.
      */
     available?: ReadonlyArray<ReasoningEffort>;
+    /** Side the menu opens toward. Defaults to Radix's "bottom". */
+    side?: Popover.DropdownMenuContentProps["side"];
+    /**
+     * Let Radix flip the menu to the opposite side when it would overflow the
+     * viewport. Defaults to `true` (Radix default). Pass `false` to pin the menu
+     * to `side` — e.g. a composer floating in open space that should always open
+     * downward rather than flipping up over the heading.
+     */
+    avoidCollisions?: boolean;
 }
 declare const DEFAULT_REASONING_LEVEL_OPTIONS: ReadonlyArray<ReasoningLevelOption>;
-declare function ReasoningLevelPicker({ value, onChange, disabled, className, triggerClassName, options, available, }: ReasoningLevelPickerProps): react_jsx_runtime.JSX.Element;
+declare function ReasoningLevelPicker({ value, onChange, disabled, className, triggerClassName, options, available, side, avoidCollisions, }: ReasoningLevelPickerProps): react_jsx_runtime.JSX.Element;
 
 interface AgentSessionHarnessControl {
     value: HarnessType;
@@ -104,6 +115,15 @@ interface AgentSessionControlsProps {
      * on the left of the gear menu.
      */
     layout?: "inline" | "gear";
+    /**
+     * Where the inline pickers open. `"auto"` (default) keeps Radix's
+     * collision-aware behavior: the menus open downward but flip up when the
+     * composer is docked at the bottom of the viewport. `"down"` pins them open
+     * downward — for a composer floating in open space (e.g. a centered new-chat
+     * surface) where flipping up would cover the heading. Only affects the
+     * `"inline"` layout; the gear menu is unchanged.
+     */
+    menuPlacement?: "auto" | "down";
 }
 /**
  * Compact control strip for an agent chat composer: harness, model, and
@@ -119,51 +139,22 @@ interface AgentSessionControlsProps {
  *
  * Designed to slot into `SandboxWorkbench`'s `session.composerControls`.
  */
-declare function AgentSessionControls({ harness, model, reasoning, trailing, className, context, layout, }: AgentSessionControlsProps): react_jsx_runtime.JSX.Element | null;
+declare function AgentSessionControls({ harness, model, reasoning, trailing, className, context, layout, menuPlacement, }: AgentSessionControlsProps): react_jsx_runtime.JSX.Element | null;
 
 /**
- * Harness ↔ model compatibility policy.
- *
- * Native CLI harnesses are vendor-locked: claude-code only drives
- * Anthropic models, codex only OpenAI models. Router-backed harnesses
- * (opencode) accept any catalog model. The pickers use this policy to
- * keep the pair coherent: changing one side snaps the other to its
- * nearest compatible choice instead of letting the user assemble a
- * combination that fails at inference time.
- */
-interface HarnessModelPolicy {
-    /** Canonical-id provider prefixes the harness can run; null = any. */
-    providers: ReadonlyArray<string> | null;
-    /**
-     * Patterns ranking snap targets, best first. Within one pattern's
-     * matches the highest version (numeric-aware descending sort) wins,
-     * so "latest standard frontier" stays correct as catalogs rotate.
-     */
-    preferred: ReadonlyArray<RegExp>;
-}
-declare const HARNESS_MODEL_POLICIES: Partial<Record<HarnessType, HarnessModelPolicy>>;
-/** Provider prefix of a canonical id ("anthropic/claude-…" → "anthropic"). */
-declare function modelProvider(modelId: string): string | null;
-/**
- * Ids without a provider prefix (consumer sentinels like "default",
- * or an empty selection) are treated as compatible everywhere — they
- * mean "the session's own configuration", which every harness honors.
+ * Whether `harness` can run `modelId`. Router-backed harnesses, and provider-less
+ * sentinel ids (like "default" or an empty selection — "the session's own
+ * configuration"), are compatible with everything.
  */
 declare function isModelCompatibleWithHarness(harness: HarnessType, modelId: string): boolean;
 /**
- * Keeps `modelId` when the harness can run it; otherwise returns the
- * harness's best compatible catalog model (preferred patterns in order,
- * highest version within a pattern). When the catalog holds nothing
- * compatible the original id is returned unchanged — the caller sees
- * the incompatibility instead of a silent wrong substitution.
+ * Keeps `modelId` when the harness can run it; otherwise returns the harness's
+ * best compatible model from the loaded catalog (preferred patterns in order,
+ * highest version within a pattern). Adapts the picker's `ModelInfo[]` to the
+ * canonical id list `agent-interface` ranks over; when the catalog holds nothing
+ * compatible the original id is returned unchanged.
  */
 declare function snapModelToHarness(harness: HarnessType, modelId: string, models: ReadonlyArray<ModelInfo>): string;
-/**
- * Keeps the harness when it can run `modelId`; otherwise returns the
- * model's native harness (anthropic → claude-code, openai → codex),
- * falling back to the router-backed opencode for everything else.
- */
-declare function snapHarnessToModel(harness: HarnessType, modelId: string): HarnessType;
 
 type ArtifactKind = string;
 interface ArtifactScope {
@@ -262,4 +253,4 @@ declare function createFetchTransport(opts: {
     fetchImpl?: typeof fetch;
 }): ArtifactAgentDockTransport;
 
-export { AgentSessionControls, type AgentSessionControlsProps, type AgentSessionHarnessControl, type AgentSessionModelControl, type AgentSessionReasoningControl, ArtifactAgentDock, type ArtifactAgentDockProps, type ArtifactAgentDockTransport, type ArtifactDockMessage, type ArtifactDockStreamEvent, type ArtifactKind, type ArtifactScope, DEFAULT_REASONING_LEVEL_OPTIONS, HARNESS_MODEL_POLICIES, type ReasoningLevel, type ReasoningLevelOption, ReasoningLevelPicker, type ReasoningLevelPickerProps, createFetchTransport, isModelCompatibleWithHarness, modelProvider, snapHarnessToModel, snapModelToHarness };
+export { AgentSessionControls, type AgentSessionControlsProps, type AgentSessionHarnessControl, type AgentSessionModelControl, type AgentSessionReasoningControl, ArtifactAgentDock, type ArtifactAgentDockProps, type ArtifactAgentDockTransport, type ArtifactDockMessage, type ArtifactDockStreamEvent, type ArtifactKind, type ArtifactScope, DEFAULT_REASONING_LEVEL_OPTIONS, type ReasoningLevel, type ReasoningLevelOption, ReasoningLevelPicker, type ReasoningLevelPickerProps, createFetchTransport, isModelCompatibleWithHarness, snapModelToHarness };

package/dist/chat.js

@@ -6,7 +6,6 @@ import {
   ChatInput,
   ChatMessage,
   DEFAULT_REASONING_LEVEL_OPTIONS,
-  HARNESS_MODEL_POLICIES,
   MessageList,
   ReasoningLevelPicker,
   ThinkingIndicator,
@@ -16,9 +15,9 @@ import {
   modelProvider,
   snapHarnessToModel,
   snapModelToHarness
-} from "./chunk-KOUYJ6QP.js";
-import "./chunk-BR2LMUAE.js";
-import "./chunk-LQHTCM56.js";
+} from "./chunk-WLMLD2CZ.js";
+import "./chunk-HU4B2M4K.js";
+import "./chunk-SF6LPMMN.js";
 import "./chunk-EI44GEQ5.js";
 import "./chunk-U67V476Y.js";
 export {
@@ -29,7 +28,6 @@ export {
   ChatInput,
   ChatMessage,
   DEFAULT_REASONING_LEVEL_OPTIONS,
-  HARNESS_MODEL_POLICIES,
   MessageList,
   ReasoningLevelPicker,
   ThinkingIndicator,

package/dist/{chunk-SVNWL3ZR.js → chunk-D7JJLG4L.js}

@@ -2014,7 +2014,7 @@ function DashboardLayoutInner({
         /* @__PURE__ */ jsx14(
           RailHeader,
           {
-            brand: /* @__PURE__ */ jsx14(Logo, { variant, size: "sm", iconOnly: true }),
+            brand: /* @__PURE__ */ jsx14(Logo, { variant, size: "sm", iconOnly: !showLabels }),
             brandHref: logoHref,
             collapsed: !showLabels,
             onToggle: toggleRail,

package/dist/{chunk-BR2LMUAE.js → chunk-HU4B2M4K.js}

@@ -1,6 +1,6 @@
 import {
   moonshot_default
-} from "./chunk-LQHTCM56.js";
+} from "./chunk-SF6LPMMN.js";
 import {
   cn
 } from "./chunk-EI44GEQ5.js";

package/dist/{chunk-DLKDWMFM.js → chunk-MKX3F55O.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-3J6FG3FJ.js";
 import {
   PortsList
-} from "./chunk-SVNWL3ZR.js";
+} from "./chunk-D7JJLG4L.js";
 import {
   TerminalView
 } from "./chunk-VIREDUBF.js";

package/dist/{chunk-LQHTCM56.js → chunk-SF6LPMMN.js}

@@ -262,7 +262,9 @@ function ModelPicker({
   placeholder = "Choose a model",
   className,
   triggerClassName,
-  disabled
+  disabled,
+  side,
+  avoidCollisions
 }) {
   const [query, setQuery] = React.useState("");
   const [open, setOpen] = React.useState(false);
@@ -394,11 +396,16 @@ function ModelPicker({
       /* @__PURE__ */ jsx2(Popover.Portal, { children: /* @__PURE__ */ jsxs2(
         Popover.Content,
         {
+          side,
           sideOffset: 4,
           align: variant === "pill" ? "start" : "start",
+          avoidCollisions,
+          collisionPadding: 24,
           className: cn(
             "z-50 w-[var(--radix-dropdown-menu-trigger-width)] min-w-[320px] max-w-[460px]",
-            "max-h-[440px] overflow-hidden flex flex-col",
+            // Cap to the smaller of the fixed height and the viewport space on
+            // the open side, so a list pinned downward never runs off-screen.
+            "max-h-[min(440px,var(--radix-dropdown-menu-content-available-height))] overflow-hidden flex flex-col",
             "rounded-[var(--radius-md)] border border-[var(--md3-outline-variant)] bg-surface-container-highest shadow-[0_8px_30px_rgba(0,0,0,0.45)] ring-1 ring-[#ffffff14]",
             "data-[state=open]:animate-in data-[state=closed]:animate-out",
             "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",

package/dist/{chunk-KOUYJ6QP.js → chunk-WLMLD2CZ.js}

@@ -2,11 +2,11 @@ import {
   HARNESS_OPTIONS,
   HarnessLogo,
   chatCapableHarnesses
-} from "./chunk-BR2LMUAE.js";
+} from "./chunk-HU4B2M4K.js";
 import {
   ModelPicker,
   canonicalModelId
-} from "./chunk-LQHTCM56.js";
+} from "./chunk-SF6LPMMN.js";
 import {
   cn
 } from "./chunk-EI44GEQ5.js";
@@ -72,7 +72,9 @@ function ReasoningLevelPicker({
   className,
   triggerClassName,
   options = DEFAULT_REASONING_LEVEL_OPTIONS,
-  available
+  available,
+  side,
+  avoidCollisions
 }) {
   const shown = available ? options.filter((o) => o.value === "auto" || available.includes(o.value)) : options;
   const selected = shown.find((option) => option.value === value);
@@ -103,10 +105,15 @@ function ReasoningLevelPicker({
     /* @__PURE__ */ jsx(DropdownMenu.Portal, { children: /* @__PURE__ */ jsx(
       DropdownMenu.Content,
       {
+        side,
         align: "start",
+        avoidCollisions,
+        collisionPadding: 24,
         sideOffset: 6,
         className: cn(
-          "z-50 w-64 overflow-hidden rounded-[var(--radius-md)] border border-[var(--md3-outline-variant)] bg-surface-container-highest p-1",
+          // Cap to the viewport space on the open side and scroll, so the menu
+          // pinned downward (floating composer) never runs off the bottom edge.
+          "z-50 w-64 max-h-[var(--radix-dropdown-menu-content-available-height)] overflow-y-auto rounded-[var(--radius-md)] border border-[var(--md3-outline-variant)] bg-surface-container-highest p-1",
           "shadow-[0_8px_30px_rgba(0,0,0,0.45)] ring-1 ring-[#ffffff14]",
           "data-[state=open]:animate-in data-[state=closed]:animate-out",
           "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
@@ -142,71 +149,16 @@ import * as DropdownMenu2 from "@radix-ui/react-dropdown-menu";
 import { ChevronDown as ChevronDown2, Lock, SlidersHorizontal } from "lucide-react";
 
 // src/chat/harness-model-compat.ts
-var HARNESS_MODEL_POLICIES = {
-  opencode: { providers: null, preferred: [] },
-  "claude-code": {
-    providers: ["anthropic"],
-    preferred: [
-      /^anthropic\/claude-opus-[\d.-]+$/,
-      /^anthropic\/claude-sonnet-[\d.-]+$/,
-      /^anthropic\//
-    ]
-  },
-  codex: {
-    providers: ["openai"],
-    // Standard frontier tier first (gpt-N / gpt-N.N), then any gpt
-    // variant (mini/nano), then anything OpenAI.
-    preferred: [/^openai\/gpt-\d+(\.\d+)?$/, /^openai\/gpt/, /^openai\//]
-  },
-  amp: { providers: null, preferred: [] },
-  "factory-droids": { providers: null, preferred: [] },
-  "cli-base": { providers: null, preferred: [] },
-  "kimi-code": {
-    providers: ["moonshot"],
-    preferred: [/^moonshot\//]
-  },
-  openclaw: { providers: null, preferred: [] },
-  nanoclaw: { providers: null, preferred: [] },
-  hermes: { providers: null, preferred: [] }
-};
-var PROVIDER_PREFERRED_HARNESS = {
-  anthropic: "claude-code",
-  openai: "codex",
-  moonshot: "kimi-code"
-};
-function modelProvider(modelId) {
-  const slash = modelId.indexOf("/");
-  return slash > 0 ? modelId.slice(0, slash) : null;
-}
+import {
+  harnessSupportsModel,
+  snapModelToHarness as snapModelIdToHarness
+} from "@tangle-network/agent-interface";
+import { modelProvider, snapHarnessToModel } from "@tangle-network/agent-interface";
 function isModelCompatibleWithHarness(harness, modelId) {
-  const policy = HARNESS_MODEL_POLICIES[harness];
-  if (!policy || policy.providers === null) return true;
-  const provider = modelProvider(modelId);
-  if (!provider) return true;
-  return policy.providers.includes(provider);
+  return harnessSupportsModel(harness, modelId);
 }
-var numericDesc = new Intl.Collator(void 0, {
-  numeric: true,
-  sensitivity: "base"
-});
 function snapModelToHarness(harness, modelId, models) {
-  if (isModelCompatibleWithHarness(harness, modelId)) return modelId;
-  const ids = models.map(canonicalModelId);
-  const policy = HARNESS_MODEL_POLICIES[harness];
-  if (!policy) return modelId;
-  for (const pattern of policy.preferred) {
-    const matches = ids.filter((id) => pattern.test(id)).sort((a, b) => numericDesc.compare(b, a));
-    if (matches.length > 0) return matches[0];
-  }
-  const fallback = ids.find(
-    (id) => isModelCompatibleWithHarness(harness, id)
-  );
-  return fallback ?? modelId;
-}
-function snapHarnessToModel(harness, modelId) {
-  if (isModelCompatibleWithHarness(harness, modelId)) return harness;
-  const provider = modelProvider(modelId);
-  return provider && PROVIDER_PREFERRED_HARNESS[provider] || "opencode";
+  return snapModelIdToHarness(harness, modelId, models.map(canonicalModelId));
 }
 
 // src/chat/agent-session-controls.tsx
@@ -219,7 +171,8 @@ function HarnessDropdown({
   locked,
   lockReason,
   side = "bottom",
-  align = "start"
+  align = "start",
+  avoidCollisions
 }) {
   const allowed = new Set(
     available ?? HARNESS_OPTIONS.map((h) => h.type)
@@ -253,9 +206,14 @@ function HarnessDropdown({
       {
         side,
         align,
+        avoidCollisions,
+        collisionPadding: 24,
         sideOffset: 6,
         className: cn(
-          "z-50 w-72 overflow-hidden rounded-[var(--radius-md)] border border-[var(--md3-outline-variant)] bg-surface-container-highest p-1",
+          // Cap to the viewport space on the open side and scroll, so a tall
+          // backend list pinned downward (floating composer) never runs off
+          // the bottom edge.
+          "z-50 w-72 max-h-[var(--radix-dropdown-menu-content-available-height)] overflow-y-auto rounded-[var(--radius-md)] border border-[var(--md3-outline-variant)] bg-surface-container-highest p-1",
           "shadow-[0_8px_30px_rgba(0,0,0,0.45)] ring-1 ring-[#ffffff14]",
           "data-[state=open]:animate-in data-[state=closed]:animate-out",
           "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
@@ -294,7 +252,8 @@ function AgentSessionControls({
   trailing,
   className,
   context = "chat",
-  layout = "inline"
+  layout = "inline",
+  menuPlacement = "auto"
 }) {
   if (!harness && !model && !reasoning && !trailing) return null;
   const handleHarnessChange = (next) => {
@@ -320,6 +279,8 @@ function AgentSessionControls({
   const harnessAvailable = harness?.available ?? (context === "chat" ? chatCapableHarnesses : void 0);
   const menuSide = layout === "gear" ? "left" : "bottom";
   const menuAlign = layout === "gear" ? "end" : "start";
+  const inlineForceDown = menuPlacement === "down" && layout !== "gear";
+  const avoidCollisions = inlineForceDown ? false : void 0;
   const harnessNode = harness && /* @__PURE__ */ jsx2(
     HarnessDropdown,
     {
@@ -327,7 +288,8 @@ function AgentSessionControls({
       available: harnessAvailable,
       onChange: handleHarnessChange,
       side: menuSide,
-      align: menuAlign
+      align: menuAlign,
+      avoidCollisions
     }
   );
   const modelNode = model && /* @__PURE__ */ jsx2(
@@ -341,7 +303,9 @@ function AgentSessionControls({
       loading: model.loading,
       popular: model.popular,
       recents: model.recents,
-      disabled: model.disabled || (visibleModels ?? []).length === 0
+      disabled: model.disabled || (visibleModels ?? []).length === 0,
+      side: layout === "gear" ? void 0 : "bottom",
+      avoidCollisions
     }
   );
   const selectedModel = model?.models.find(
@@ -358,7 +322,9 @@ function AgentSessionControls({
       onChange: reasoning.onChange,
       options: reasoning.options,
       disabled: reasoning.disabled,
-      available: harness ? reasoningEffortsFor(harness.value, modelReasoning) : reasoning.available
+      available: harness ? reasoningEffortsFor(harness.value, modelReasoning) : reasoning.available,
+      side: layout === "gear" ? void 0 : "bottom",
+      avoidCollisions
     }
   );
   if (layout === "gear") {
@@ -800,10 +766,9 @@ function createFetchTransport(opts) {
 export {
   DEFAULT_REASONING_LEVEL_OPTIONS,
   ReasoningLevelPicker,
-  HARNESS_MODEL_POLICIES,
-  modelProvider,
   isModelCompatibleWithHarness,
   snapModelToHarness,
+  modelProvider,
   snapHarnessToModel,
   AgentSessionControls,
   ArtifactAgentDock,

package/dist/dashboard.d.ts

@@ -3,9 +3,10 @@ import * as React from 'react';
 import { ReactNode } from 'react';
 import { HarnessType } from '@tangle-network/agent-interface';
 export { HarnessType } from '@tangle-network/agent-interface';
-export { D as DEFAULT_FEATURED_MODEL_IDS, M as ModelInfo, a as ModelPicker, b as ModelPickerProps, c as ModelPickerVariant, d as canonicalModelId, e as dedupeModels, f as formatContext, g as formatPricing, m as modelDedupKey } from './model-picker-NOWFpRY4.js';
+export { D as DEFAULT_FEATURED_MODEL_IDS, M as ModelInfo, a as ModelPicker, b as ModelPickerProps, c as ModelPickerVariant, d as canonicalModelId, e as dedupeModels, f as formatContext, g as formatPricing, m as modelDedupKey } from './model-picker-COjPVMzg.js';
 export { B as BillingBalance, a as BillingDashboard, b as BillingDashboardProps, c as BillingSubscription, d as BillingUsage, P as PricingPage, e as PricingPageProps, f as PricingTier, T as TemplateCard, g as TemplateCardData, h as TemplateCardProps, U as UsageChart, i as UsageChartProps, j as UsageDataPoint, k as formatPrice } from './template-card-UhV3pmRC.js';
 export { E as ExposedPort, P as PortsList, a as PortsListProps } from './ports-list-DfG0VfPt.js';
+import '@radix-ui/react-dropdown-menu';
 
 interface SidebarUser {
     email: string;

package/dist/dashboard.js

@@ -54,7 +54,7 @@ import {
   canAdminSandbox,
   parseInsufficientBalance,
   useSidebar
-} from "./chunk-SVNWL3ZR.js";
+} from "./chunk-D7JJLG4L.js";
 import {
   BillingDashboard,
   InfoPanel,
@@ -71,7 +71,7 @@ import {
   HarnessLogo,
   HarnessPicker,
   chatCapableHarnesses
-} from "./chunk-BR2LMUAE.js";
+} from "./chunk-HU4B2M4K.js";
 import {
   DEFAULT_FEATURED_MODEL_IDS,
   ModelPicker,
@@ -80,7 +80,7 @@ import {
   formatContext,
   formatPricing,
   modelDedupKey
-} from "./chunk-LQHTCM56.js";
+} from "./chunk-SF6LPMMN.js";
 import "./chunk-EI44GEQ5.js";
 import "./chunk-U67V476Y.js";
 export {

package/dist/globals.css

@@ -825,8 +825,11 @@
   .max-h-\[160px\] {
     max-height: 160px;
   }
-  .max-h-\[440px\] {
-    max-height: 440px;
+  .max-h-\[min\(440px\,var\(--radix-dropdown-menu-content-available-height\)\)\] {
+    max-height: min(440px, var(--radix-dropdown-menu-content-available-height));
+  }
+  .max-h-\[var\(--radix-dropdown-menu-content-available-height\)\] {
+    max-height: var(--radix-dropdown-menu-content-available-height);
   }
   .min-h-0 {
     min-height: calc(var(--spacing) * 0);

package/dist/index.d.ts

@@ -5,12 +5,12 @@ export { AgentWorkbench, ApprovalConfidenceStat, ApprovalItem, ApprovalQueue, Ap
 export { ArtifactView, BRAND_PRISM_THEME, CodeSurface, CodeSurfaceProps, CodeView, CodeViewProps, DiffStats, DiffView, DiffViewProps, FileBreadcrumb, FileBreadcrumbProps, GitStatusBadge, PanelHeader, PanelHeaderProps, PillTabItem, PillTabs, PillTabsProps, PreviewView, PreviewViewProps, SandboxArtifact, SandboxArtifactPane, SandboxArtifactPaneProps, SandboxArtifactTerminal, buildUnifiedPatch, computeDiffStats, resolveLanguage } from './workbench.js';
 export { OpenUIAction, OpenUIActionsNode, OpenUIArtifactRenderer, OpenUIArtifactRendererProps, OpenUIBadgeNode, OpenUICardNode, OpenUICodeNode, OpenUIComponentNode, OpenUIGridNode, OpenUIHeadingNode, OpenUIKeyValueNode, OpenUIMarkdownNode, OpenUIPrimitive, OpenUISeparatorNode, OpenUIStackNode, OpenUIStatNode, OpenUITableNode, OpenUITextNode } from '@tangle-network/ui/openui';
 export { AgentTimeline, AgentTimelineArtifactItem, AgentTimelineCustomItem, AgentTimelineItem, AgentTimelineMessageItem, AgentTimelineProps, AgentTimelineStatusItem, AgentTimelineTone, AgentTimelineToolGroupItem, AgentTimelineToolItem, ChatContainer, ChatContainerProps, ChatInput, ChatInputProps, ChatMessage, ChatMessageProps, MessageList, MessageListProps, MessageRole, PendingFile, ThinkingIndicator, ThinkingIndicatorProps, UserMessage, UserMessageProps } from '@tangle-network/ui/chat';
-export { AgentSessionControls, AgentSessionControlsProps, AgentSessionHarnessControl, AgentSessionModelControl, AgentSessionReasoningControl, ArtifactAgentDock, ArtifactAgentDockProps, ArtifactAgentDockTransport, ArtifactDockMessage, ArtifactDockStreamEvent, ArtifactKind, ArtifactScope, DEFAULT_REASONING_LEVEL_OPTIONS, HARNESS_MODEL_POLICIES, ReasoningLevel, ReasoningLevelOption, ReasoningLevelPicker, ReasoningLevelPickerProps, createFetchTransport, isModelCompatibleWithHarness, modelProvider, snapHarnessToModel, snapModelToHarness } from './chat.js';
+export { AgentSessionControls, AgentSessionControlsProps, AgentSessionHarnessControl, AgentSessionModelControl, AgentSessionReasoningControl, ArtifactAgentDock, ArtifactAgentDockProps, ArtifactAgentDockTransport, ArtifactDockMessage, ArtifactDockStreamEvent, ArtifactKind, ArtifactScope, DEFAULT_REASONING_LEVEL_OPTIONS, ReasoningLevel, ReasoningLevelOption, ReasoningLevelPicker, ReasoningLevelPickerProps, createFetchTransport, isModelCompatibleWithHarness, snapModelToHarness } from './chat.js';
 export { ExpandedToolDetail, ExpandedToolDetailProps, InlineThinkingItem, InlineThinkingItemProps, InlineToolItem, InlineToolItemProps, LiveDuration, RunGroup, RunGroupProps } from '@tangle-network/ui/run';
 export { CommandPreview, DiffPreview, GlobResultsPreview, GrepResultsPreview, QuestionPreview, WebSearchPreview, WriteFilePreview } from '@tangle-network/ui/tool-previews';
 export { FileArtifactPane, FileArtifactPaneProps, FileNode, FilePreview, FilePreviewProps, FileTabData, FileTabs, FileTabsProps, FileTree, FileTreeProps, FileTreeVisibilityOptions, RichFileTree, RichFileTreeGitEntry, RichFileTreeGitStatus, RichFileTreeProps, RichFileTreeThemeVars, filterFileTree } 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';
-export { D as DEFAULT_FEATURED_MODEL_IDS, M as ModelInfo, a as ModelPicker, b as ModelPickerProps, c as ModelPickerVariant, d as canonicalModelId, e as dedupeModels, f as formatContext, g as formatPricing, m as modelDedupKey } from './model-picker-NOWFpRY4.js';
+export { D as DEFAULT_FEATURED_MODEL_IDS, M as ModelInfo, a as ModelPicker, b as ModelPickerProps, c as ModelPickerVariant, d as canonicalModelId, e as dedupeModels, f as formatContext, g as formatPricing, m as modelDedupKey } from './model-picker-COjPVMzg.js';
 export { B as BillingBalance, a as BillingDashboard, b as BillingDashboardProps, c as BillingSubscription, d as BillingUsage, P as PricingPage, e as PricingPageProps, f as PricingTier, T as TemplateCard, g as TemplateCardData, h as TemplateCardProps, U as UsageChart, i as UsageChartProps, j as UsageDataPoint, k as formatPrice } from './template-card-UhV3pmRC.js';
 export { E as ExposedPort, P as PortsList, a as PortsListProps } from './ports-list-DfG0VfPt.js';
 export { AuthHeader, AuthHeaderProps, GitHubLoginButton, GitHubLoginButtonProps, LoginLayout, LoginLayoutProps, SessionUser, UserMenu, UserMenuProps } from '@tangle-network/ui/auth';
@@ -23,9 +23,10 @@ export { ChatSession, connectSession, disconnectSession, sessionAtom } from './s
 export { AgentBranding, CustomToolRenderer, DisplayVariant, FinalTextPart, GroupedMessage, MessageRun, MessageUser, ReasoningPart, Run, RunStats, SessionMessage, SessionPart, TextPart, ToolCategory, ToolDisplayMetadata, ToolPart, ToolState, ToolStatus, ToolTime } from '@tangle-network/ui/types';
 export { Session } from './types.js';
 export { TOOL_CATEGORY_ICONS, cn, copyText, formatBytes, formatDuration, formatUptime, getToolCategory, getToolDisplayMetadata, getToolErrorText, timeAgo, truncateText } from '@tangle-network/ui/utils';
-export { HarnessType } from '@tangle-network/agent-interface';
+export { HarnessType, modelProvider, snapHarnessToModel } from '@tangle-network/agent-interface';
 import 'react/jsx-runtime';
 import 'react';
+import '@radix-ui/react-dropdown-menu';
 import '@tanstack/react-query';
 import '@tangle-network/ui/sdk-hooks';
 import 'nanostores';

package/dist/index.js

@@ -81,7 +81,6 @@ import {
   ChatInput,
   ChatMessage,
   DEFAULT_REASONING_LEVEL_OPTIONS,
-  HARNESS_MODEL_POLICIES,
   MessageList,
   ReasoningLevelPicker,
   ThinkingIndicator,
@@ -91,7 +90,7 @@ import {
   modelProvider,
   snapHarnessToModel,
   snapModelToHarness
-} from "./chunk-KOUYJ6QP.js";
+} from "./chunk-WLMLD2CZ.js";
 import {
   TOOL_CATEGORY_ICONS,
   cn,
@@ -148,7 +147,7 @@ import {
   buildUnifiedPatch,
   computeDiffStats,
   resolveLanguage
-} from "./chunk-DLKDWMFM.js";
+} from "./chunk-MKX3F55O.js";
 import {
   FileArtifactPane,
   FilePreview,
@@ -213,7 +212,7 @@ import {
   canAdminSandbox,
   parseInsufficientBalance,
   useSidebar
-} from "./chunk-SVNWL3ZR.js";
+} from "./chunk-D7JJLG4L.js";
 import {
   BillingDashboard,
   InfoPanel,
@@ -320,7 +319,7 @@ import {
   HarnessLogo,
   HarnessPicker,
   chatCapableHarnesses
-} from "./chunk-BR2LMUAE.js";
+} from "./chunk-HU4B2M4K.js";
 import {
   DEFAULT_FEATURED_MODEL_IDS,
   ModelPicker,
@@ -329,7 +328,7 @@ import {
   formatContext,
   formatPricing,
   modelDedupKey
-} from "./chunk-LQHTCM56.js";
+} from "./chunk-SF6LPMMN.js";
 import "./chunk-EI44GEQ5.js";
 import "./chunk-U67V476Y.js";
 
@@ -432,7 +431,6 @@ export {
   GlobResultsPreview,
   GrepResultsPreview,
   HARNESS_BRAND,
-  HARNESS_MODEL_POLICIES,
   HARNESS_OPTIONS,
   HarnessLogo,
   HarnessPicker,

package/dist/{model-picker-NOWFpRY4.d.ts → model-picker-COjPVMzg.d.ts}

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReasoningEffort } from '@tangle-network/agent-interface';
+import * as Popover from '@radix-ui/react-dropdown-menu';
 
 /**
  * Wire-format model entry as returned by `/v1/models` on the Tangle Router
@@ -93,6 +94,15 @@ interface ModelPickerProps {
      */
     triggerClassName?: string;
     disabled?: boolean;
+    /** Side the menu opens toward. Defaults to Radix's "bottom". */
+    side?: Popover.DropdownMenuContentProps["side"];
+    /**
+     * Let Radix flip the menu to the opposite side when it would overflow the
+     * viewport. Defaults to `true` (Radix default). Pass `false` to pin the menu
+     * to `side` — e.g. a composer floating in open space that should always open
+     * downward rather than flipping up over the heading.
+     */
+    avoidCollisions?: boolean;
 }
 /**
  * Resolve the canonical id for a model. Some upstreams already prefix the
@@ -130,6 +140,6 @@ declare const DEFAULT_FEATURED_MODEL_IDS: ReadonlyArray<string>;
 declare function formatPricing(pricing: ModelInfo["pricing"]): string | null;
 /** Format context length compactly (e.g. 200_000 → "200k"). */
 declare function formatContext(ctx: number | undefined): string | null;
-declare function ModelPicker({ value, onChange, models, loading, recents, popular, excludeProviders, modalities, variant, label, placeholder, className, triggerClassName, disabled, }: ModelPickerProps): react_jsx_runtime.JSX.Element;
+declare function ModelPicker({ value, onChange, models, loading, recents, popular, excludeProviders, modalities, variant, label, placeholder, className, triggerClassName, disabled, side, avoidCollisions, }: ModelPickerProps): react_jsx_runtime.JSX.Element;
 
 export { DEFAULT_FEATURED_MODEL_IDS as D, type ModelInfo as M, ModelPicker as a, type ModelPickerProps as b, type ModelPickerVariant as c, canonicalModelId as d, dedupeModels as e, formatContext as f, formatPricing as g, modelDedupKey as m };

package/dist/pages.d.ts

@@ -2,8 +2,9 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { CSSProperties, ReactNode } from 'react';
 import { c as BillingSubscription, B as BillingBalance, d as BillingUsage, j as UsageDataPoint, f as PricingTier, g as TemplateCardData } from './template-card-UhV3pmRC.js';
-export { M as ModelInfo } from './model-picker-NOWFpRY4.js';
+export { M as ModelInfo } from './model-picker-COjPVMzg.js';
 import '@tangle-network/agent-interface';
+import '@radix-ui/react-dropdown-menu';
 
 /**
  * Shared, self-contained sign-in / sign-up page for every Tangle vertical app.

package/dist/pages.js

@@ -24,7 +24,7 @@ import {
   Switch,
   Textarea
 } from "./chunk-4ZZUMXPX.js";
-import "./chunk-LQHTCM56.js";
+import "./chunk-SF6LPMMN.js";
 import {
   cn
 } from "./chunk-EI44GEQ5.js";

package/dist/styles.css

@@ -825,8 +825,11 @@
   .max-h-\[160px\] {
     max-height: 160px;
   }
-  .max-h-\[440px\] {
-    max-height: 440px;
+  .max-h-\[min\(440px\,var\(--radix-dropdown-menu-content-available-height\)\)\] {
+    max-height: min(440px, var(--radix-dropdown-menu-content-available-height));
+  }
+  .max-h-\[var\(--radix-dropdown-menu-content-available-height\)\] {
+    max-height: var(--radix-dropdown-menu-content-available-height);
   }
   .min-h-0 {
     min-height: calc(var(--spacing) * 0);

package/dist/workbench.js

@@ -12,15 +12,15 @@ import {
   buildUnifiedPatch,
   computeDiffStats,
   resolveLanguage
-} from "./chunk-DLKDWMFM.js";
+} from "./chunk-MKX3F55O.js";
 import "./chunk-3J6FG3FJ.js";
-import "./chunk-SVNWL3ZR.js";
+import "./chunk-D7JJLG4L.js";
 import "./chunk-OMUIPJQZ.js";
 import "./chunk-VIREDUBF.js";
 import "./chunk-77WVVJA4.js";
 import "./chunk-4ZZUMXPX.js";
-import "./chunk-BR2LMUAE.js";
-import "./chunk-LQHTCM56.js";
+import "./chunk-HU4B2M4K.js";
+import "./chunk-SF6LPMMN.js";
 import "./chunk-EI44GEQ5.js";
 import "./chunk-U67V476Y.js";
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tangle-network/sandbox-ui",
-  "version": "0.56.0",
+  "version": "0.58.0",
   "description": "Unified UI component library for Tangle Sandbox — primitives, chat, dashboard, terminal, editor, and workspace components",
   "repository": {
     "type": "git",
@@ -126,7 +126,7 @@
     "test:bridge": "pnpm build && vitest run src/__tests__/re-export-identity.test.ts"
   },
   "peerDependencies": {
-    "@tangle-network/agent-interface": ">=0.10.0 <1.0.0",
+    "@tangle-network/agent-interface": ">=0.15.0 <1.0.0",
     "@tangle-network/brand": "^0.6.0",
     "@tangle-network/ui": "^4.0.0",
     "@xyflow/react": "^12.0.0",
@@ -181,7 +181,7 @@
     "@storybook/react-vite": "^8.6.18",
     "@tailwindcss/postcss": "^4.2.2",
     "@tailwindcss/vite": "^4.2.2",
-    "@tangle-network/agent-interface": ">=0.10.0 <1.0.0",
+    "@tangle-network/agent-interface": ">=0.15.0 <1.0.0",
     "@tangle-network/brand": "^0.6.0",
     "@tangle-network/ui": "^4.1.0",
     "@tanstack/react-query": "^5.91.0",