@tangle-network/sandbox-ui 0.96.0 → 0.99.0

package/dist/dashboard.d.ts

@@ -2,9 +2,7 @@ import * as React from 'react';
 import React__default, { ReactNode } from 'react';
 import { HarnessType } from '@tangle-network/agent-interface';
 export { HarnessType } from '@tangle-network/agent-interface';
-import * as Popover from '@radix-ui/react-dropdown-menu';
-import { b as ModelInfo } from './model-brand-CuXKfTMh.js';
-export { M as ModelBrandIdentity, a as ModelBrandStack, c as canonicalModelId, m as modelBrandFor } from './model-brand-CuXKfTMh.js';
+export { M as ModelBrandIdentity, a as ModelBrandStack, b as ModelInfo, c as canonicalModelId, m as modelBrandFor } from './model-brand-BNnaUKKZ.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-Bn-Bw5xC.js';
 export { E as ExposedPort, P as PortsList, a as PortsListProps } from './ports-list-CDIvTNnX.js';
 
@@ -705,10 +703,10 @@ interface BackendSelectorProps {
     selected: string;
     onChange: (selected: string) => void;
     /**
-     * Trigger appearance. "pill" (default) = compact inline pill matching the
-     * ModelPicker pill — logo + short label only. "field" = full-width form
-     * field with a label above. Either way the long descriptor lives only as
-     * subtext inside the open dropdown, never on the closed trigger.
+     * Trigger appearance. "pill" (default) = compact inline pill — logo + short
+     * label only. "field" = full-width form field with a label above. Either
+     * way the long descriptor lives only as subtext inside the open dropdown,
+     * never on the closed trigger.
      */
     variant?: BackendSelectorVariant;
     label?: string;
@@ -781,89 +779,13 @@ interface HarnessLogoProps {
     className?: string;
 }
 /**
- * Brand chip for a harness, matching {@link BrandLogo}'s render contract in
- * model-picker: a rounded `bg-background ring-1 ring-border` chip wrapping
+ * Brand chip for a harness, matching `BrandLogo`'s render contract in
+ * `lib/model-brand`: a rounded `bg-background ring-1 ring-border` chip wrapping
  * either a foreground-filled CSS-mask of the brand SVG or a lucide fallback
  * glyph. Keeps harness pills visually consistent with model pills.
  */
 declare function HarnessLogo({ type, size, className }: HarnessLogoProps): React.JSX.Element;
 
-type ModelPickerVariant = "field" | "pill";
-interface ModelPickerProps {
-    /** Canonical model id (provider-prefixed, e.g. "openai/gpt-5.4"). */
-    value: string;
-    onChange: (modelId: string) => void;
-    /** Models to choose from. Pass `[]` while loading. */
-    models: ModelInfo[];
-    /** Show the loading state (overrides empty-list copy). */
-    loading?: boolean;
-    /** Recently-used canonical ids to surface at the top. */
-    recents?: ReadonlyArray<string>;
-    /**
-     * Canonical model ids to surface in a "Popular" section above the full
-     * list. Each id is resolved against `models`; ids not present in the
-     * loaded catalog are silently skipped, so callers can pass a stable
-     * curation list without worrying about provider availability.
-     */
-    popular?: ReadonlyArray<string>;
-    /** Drop providers from the picker entirely (e.g. "audio", "embedding"). */
-    excludeProviders?: ReadonlyArray<string>;
-    /** Restrict to these architectures (e.g. ["text"]). Default: all. */
-    modalities?: ReadonlyArray<string>;
-    /** Trigger appearance. "field" = full-width form field; "pill" = inline chat input pill. */
-    variant?: ModelPickerVariant;
-    label?: string;
-    placeholder?: string;
-    className?: string;
-    /**
-     * Extra classes merged onto the trigger button itself (after the
-     * built-in defaults, so callers can override sizing/radius/font to
-     * match a surrounding form). Distinct from `className`, which on the
-     * "field" variant styles the outer wrapper.
-     */
-    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;
-}
-/**
- * Stable key used to collapse catalog duplicates. The Tangle Router lists the
- * same underlying model under several host prefixes (e.g. `openai/gpt-5.4`,
- * `tcloud/gpt-5.4`, `openrouter/openai/gpt-5.4`); they all name one model and
- * should occupy a single row. The key is `<lab>/<model-id>`: the authoring lab
- * (inferred via {@link resolveModelBrandIdentity}, which already maps
- * `gpt-5.4` → openai, `kimi-k2` → moonshot, etc.) plus the final id segment,
- * so a model collapses to one identity regardless of which host serves it.
- */
-declare function modelDedupKey(model: ModelInfo): string;
-/**
- * Collapse catalog duplicates to one row per {@link modelDedupKey}. When a
- * model is served under multiple hosts the preferred row wins: a `featured`
- * row beats a non-featured one, otherwise the first occurrence is kept (so
- * caller-controlled catalog order still decides ties). Input order is
- * preserved for the surviving rows.
- */
-declare function dedupeModels(models: ReadonlyArray<ModelInfo>): ModelInfo[];
-/**
- * Fallback "Recommended" seed — latest frontier models per major lab, matched
- * by {@link modelDedupKey} against the loaded catalog. Used only when no
- * catalog row carries an explicit `featured` flag, so a standard router
- * catalog still gets a curated top section without per-deployment config.
- */
-declare const DEFAULT_FEATURED_MODEL_IDS: ReadonlyArray<string>;
-/** Format $/M tokens. Returns null if pricing is missing or zero. */
-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, side, avoidCollisions, }: ModelPickerProps): React.JSX.Element;
-
 type ProductVariant = "sandbox";
 interface NavItem {
     id: string;
@@ -1353,4 +1275,4 @@ interface InfoPanelProps {
 }
 declare function InfoPanel({ label, title, description, className }: InfoPanelProps): React.JSX.Element;
 
-export { ActivityFeed, type ActivityFeedProps, type ActivityItem, type AppearanceController, type Backend, BackendConfig, type BackendConfigProps, BackendSelector, type BackendSelectorProps, type BackendStatusData, ClusterStatusBar, type ClusterStatusBarProps, type ClusterStatusItem, CreditBalance, type CreditBalanceProps, DEFAULT_FEATURED_MODEL_IDS, DashboardLayout, type DashboardLayoutProps, type Profile as DashboardProfile, type SnapshotInfo as DashboardSnapshotInfo, type DashboardUser, type GitCommitData, GitPanel, type GitPanelProps, type GitStatusData, HARNESS_BRAND, HARNESS_OPTIONS, type HarnessBrand, HarnessLogo, type HarnessLogoProps, HarnessPicker, type HarnessPickerProps, INSUFFICIENT_BALANCE_CODE, InfoPanel, type InfoPanelProps, type InsufficientBalance, type Invoice, InvoiceTable, type InvoiceTableProps, type McpServer, MetricAreaChart, type MetricAreaChartProps, type MetricChartPoint, type MetricChartTone, ModelInfo, ModelPicker, type ModelPickerProps, type ModelPickerVariant, type NavItem, NetworkConfig, type NetworkConfigData, type NetworkConfigProps, NewSandboxCard, type NewSandboxCardProps, OutOfCreditsModal, type OutOfCreditsModalProps, type PlanCardData, PlanCards, type PlanCardsProps, type PlanFeature, type ProcessInfo, ProcessList, type ProcessListProps, type ProductVariant, ProfileAvatar, type ProfileAvatarProps, ProfileComparison, type ProfileComparisonProps, ProfileSelector, type ProfileSelectorProps, PromoBanner, type PromoBannerProps, RailButton, type RailButtonProps, RailCollapseToggle, type RailCollapseToggleProps, RailExpandable, type RailExpandableProps, type RailExpandableSubItem, RailFlyout, type RailFlyoutProps, RailHeader, type RailHeaderProps, RailModeButton, type RailModeButtonProps, RailSeparator, type RailSeparatorProps, RailThemeToggle, RailTooltip, type RailTooltipProps, ResourceMeter, type ResourceMeterProps, ResourceSnapshot, type ResourceSnapshotItem, type ResourceSnapshotProps, SIDEBAR_MOBILE_WIDTH, SIDEBAR_PANEL_WIDTH, SIDEBAR_RAIL_LABELED_WIDTH, SIDEBAR_RAIL_WIDTH, SIDEBAR_TOTAL_WIDTH, SandboxCard, type SandboxCardData, type SandboxCardProps, type SandboxStatus, SandboxTable, type SandboxTableProps, Sidebar, SidebarContent, type SidebarContentProps, SidebarLayout, type SidebarLayoutFlyoutItem, type SidebarLayoutNavItem, type SidebarLayoutProps, SidebarPanel, SidebarPanelContent, type SidebarPanelContentProps, SidebarPanelHeader, type SidebarPanelHeaderProps, type SidebarPanelProps, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarRail, SidebarRailFooter, type SidebarRailFooterProps, SidebarRailHeader, type SidebarRailHeaderProps, SidebarRailNav, type SidebarRailNavProps, type SidebarRailProps, type SidebarUser, SnapshotList, type SnapshotListProps, SystemLogsViewer, type SystemLogsViewerProps, type TeamRole, type ThemeMode, UsageSummary, type UsageSummaryData, type UsageSummaryProps, type Variant, VariantList, type VariantListProps, type VariantOutcome, type VariantStatus, canAdminSandbox, chatCapableHarnesses, dedupeModels, formatContext, formatPricing, modelDedupKey, parseInsufficientBalance, useSidebar };
+export { ActivityFeed, type ActivityFeedProps, type ActivityItem, type AppearanceController, type Backend, BackendConfig, type BackendConfigProps, BackendSelector, type BackendSelectorProps, type BackendStatusData, ClusterStatusBar, type ClusterStatusBarProps, type ClusterStatusItem, CreditBalance, type CreditBalanceProps, DashboardLayout, type DashboardLayoutProps, type Profile as DashboardProfile, type SnapshotInfo as DashboardSnapshotInfo, type DashboardUser, type GitCommitData, GitPanel, type GitPanelProps, type GitStatusData, HARNESS_BRAND, HARNESS_OPTIONS, type HarnessBrand, HarnessLogo, type HarnessLogoProps, HarnessPicker, type HarnessPickerProps, INSUFFICIENT_BALANCE_CODE, InfoPanel, type InfoPanelProps, type InsufficientBalance, type Invoice, InvoiceTable, type InvoiceTableProps, type McpServer, MetricAreaChart, type MetricAreaChartProps, type MetricChartPoint, type MetricChartTone, type NavItem, NetworkConfig, type NetworkConfigData, type NetworkConfigProps, NewSandboxCard, type NewSandboxCardProps, OutOfCreditsModal, type OutOfCreditsModalProps, type PlanCardData, PlanCards, type PlanCardsProps, type PlanFeature, type ProcessInfo, ProcessList, type ProcessListProps, type ProductVariant, ProfileAvatar, type ProfileAvatarProps, ProfileComparison, type ProfileComparisonProps, ProfileSelector, type ProfileSelectorProps, PromoBanner, type PromoBannerProps, RailButton, type RailButtonProps, RailCollapseToggle, type RailCollapseToggleProps, RailExpandable, type RailExpandableProps, type RailExpandableSubItem, RailFlyout, type RailFlyoutProps, RailHeader, type RailHeaderProps, RailModeButton, type RailModeButtonProps, RailSeparator, type RailSeparatorProps, RailThemeToggle, RailTooltip, type RailTooltipProps, ResourceMeter, type ResourceMeterProps, ResourceSnapshot, type ResourceSnapshotItem, type ResourceSnapshotProps, SIDEBAR_MOBILE_WIDTH, SIDEBAR_PANEL_WIDTH, SIDEBAR_RAIL_LABELED_WIDTH, SIDEBAR_RAIL_WIDTH, SIDEBAR_TOTAL_WIDTH, SandboxCard, type SandboxCardData, type SandboxCardProps, type SandboxStatus, SandboxTable, type SandboxTableProps, Sidebar, SidebarContent, type SidebarContentProps, SidebarLayout, type SidebarLayoutFlyoutItem, type SidebarLayoutNavItem, type SidebarLayoutProps, SidebarPanel, SidebarPanelContent, type SidebarPanelContentProps, SidebarPanelHeader, type SidebarPanelHeaderProps, type SidebarPanelProps, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarRail, SidebarRailFooter, type SidebarRailFooterProps, SidebarRailHeader, type SidebarRailHeaderProps, SidebarRailNav, type SidebarRailNavProps, type SidebarRailProps, type SidebarUser, SnapshotList, type SnapshotListProps, SystemLogsViewer, type SystemLogsViewerProps, type TeamRole, type ThemeMode, UsageSummary, type UsageSummaryData, type UsageSummaryProps, type Variant, VariantList, type VariantListProps, type VariantOutcome, type VariantStatus, canAdminSandbox, chatCapableHarnesses, parseInsufficientBalance, useSidebar };

package/dist/dashboard.js

@@ -1,10 +1,15 @@
 import {
   ActivityFeed,
   BackendConfig,
+  BackendSelector,
   ClusterStatusBar,
   CreditBalance,
   DashboardLayout,
   GitPanel,
+  HARNESS_BRAND,
+  HARNESS_OPTIONS,
+  HarnessLogo,
+  HarnessPicker,
   INSUFFICIENT_BALANCE_CODE,
   InvoiceTable,
   MetricAreaChart,
@@ -52,9 +57,10 @@ import {
   UsageSummary,
   VariantList,
   canAdminSandbox,
+  chatCapableHarnesses,
   parseInsufficientBalance,
   useSidebar
-} from "./chunk-VQZ6XDRR.js";
+} from "./chunk-Y4OTBMZS.js";
 import {
   BillingDashboard,
   InfoPanel,
@@ -64,27 +70,11 @@ import {
   formatPrice
 } from "./chunk-OMUIPJQZ.js";
 import "./chunk-4ZZUMXPX.js";
-import {
-  BackendSelector,
-  HARNESS_BRAND,
-  HARNESS_OPTIONS,
-  HarnessLogo,
-  HarnessPicker,
-  chatCapableHarnesses
-} from "./chunk-WSN2RZC6.js";
-import {
-  DEFAULT_FEATURED_MODEL_IDS,
-  ModelPicker,
-  dedupeModels,
-  formatContext,
-  formatPricing,
-  modelDedupKey
-} from "./chunk-WMVUJ5SA.js";
 import {
   ModelBrandStack,
   canonicalModelId,
   modelBrandFor
-} from "./chunk-5XRAKVIV.js";
+} from "./chunk-RQZRXKMR.js";
 import "./chunk-EI44GEQ5.js";
 import "./chunk-CZ7CSFO4.js";
 export {
@@ -94,7 +84,6 @@ export {
   BillingDashboard,
   ClusterStatusBar,
   CreditBalance,
-  DEFAULT_FEATURED_MODEL_IDS,
   DashboardLayout,
   GitPanel,
   HARNESS_BRAND,
@@ -106,7 +95,6 @@ export {
   InvoiceTable,
   MetricAreaChart,
   ModelBrandStack,
-  ModelPicker,
   NetworkConfig,
   NewSandboxCard,
   OutOfCreditsModal,
@@ -156,12 +144,8 @@ export {
   canAdminSandbox,
   canonicalModelId,
   chatCapableHarnesses,
-  dedupeModels,
-  formatContext,
   formatPrice,
-  formatPricing,
   modelBrandFor,
-  modelDedupKey,
   parseInsufficientBalance,
   useSidebar
 };

package/dist/globals.css

@@ -409,9 +409,6 @@
   .bottom-\[-0\.75rem\] {
     bottom: -0.75rem;
   }
-  .bottom-full {
-    bottom: 100%;
-  }
   .left-0 {
     left: 0px;
   }
@@ -688,9 +685,6 @@
   .table {
     display: table;
   }
-  .table-row {
-    display: table-row;
-  }
   .aspect-\[9\/16\] {
     aspect-ratio: 9/16;
   }
@@ -919,9 +913,6 @@
   .max-h-\[min\(60vh\,420px\)\] {
     max-height: min(60vh, 420px);
   }
-  .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);
   }
@@ -979,9 +970,6 @@
   .min-h-\[300px\] {
     min-height: 300px;
   }
-  .min-h-\[560px\] {
-    min-height: 560px;
-  }
   .min-h-\[640px\] {
     min-height: 640px;
   }
@@ -1150,9 +1138,6 @@
   .w-\[300px\] {
     width: 300px;
   }
-  .w-\[320px\] {
-    width: 320px;
-  }
   .w-\[360px\] {
     width: 360px;
   }
@@ -1177,9 +1162,6 @@
   .w-\[680px\] {
     width: 680px;
   }
-  .w-\[720px\] {
-    width: 720px;
-  }
   .w-\[760px\] {
     width: 760px;
   }
@@ -1195,6 +1177,9 @@
   .w-\[min\(88vw\,24rem\)\] {
     width: min(88vw, 24rem);
   }
+  .w-\[min\(320px\,calc\(100vw-2rem\)\)\] {
+    width: min(320px, calc(100vw - 2rem));
+  }
   .w-\[var\(--avatar-size\)\] {
     width: var(--avatar-size);
   }
@@ -1204,9 +1189,6 @@
   .w-\[var\(--indicator-dot-size\)\] {
     width: var(--indicator-dot-size);
   }
-  .w-\[var\(--radix-dropdown-menu-trigger-width\)\] {
-    width: var(--radix-dropdown-menu-trigger-width);
-  }
   .w-\[var\(--radix-select-trigger-width\)\] {
     width: var(--radix-select-trigger-width);
   }
@@ -1276,9 +1258,6 @@
   .max-w-\[150px\] {
     max-width: 150px;
   }
-  .max-w-\[180px\] {
-    max-width: 180px;
-  }
   .max-w-\[250px\] {
     max-width: 250px;
   }
@@ -1291,9 +1270,6 @@
   .max-w-\[420px\] {
     max-width: 420px;
   }
-  .max-w-\[460px\] {
-    max-width: 460px;
-  }
   .max-w-\[480px\] {
     max-width: 480px;
   }
@@ -1357,9 +1333,6 @@
   .min-w-\[240px\] {
     min-width: 240px;
   }
-  .min-w-\[320px\] {
-    min-width: 320px;
-  }
   .min-w-\[360px\] {
     min-width: 360px;
   }
@@ -2049,12 +2022,6 @@
   .border-primary {
     border-color: var(--color-primary);
   }
-  .border-primary\/10 {
-    border-color: color-mix(in srgb, hsl(var(--primary)) 10%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      border-color: color-mix(in oklab, var(--color-primary) 10%, transparent);
-    }
-  }
   .border-primary\/20 {
     border-color: color-mix(in srgb, hsl(var(--primary)) 20%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2421,12 +2388,6 @@
       background-color: color-mix(in oklab, var(--color-muted) 10%, transparent);
     }
   }
-  .bg-muted\/20 {
-    background-color: color-mix(in srgb, hsl(var(--muted)) 20%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      background-color: color-mix(in oklab, var(--color-muted) 20%, transparent);
-    }
-  }
   .bg-muted\/30 {
     background-color: color-mix(in srgb, hsl(var(--muted)) 30%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2487,12 +2448,6 @@
       background-color: color-mix(in oklab, var(--color-primary) 20%, transparent);
     }
   }
-  .bg-primary\/\[0\.04\] {
-    background-color: color-mix(in srgb, hsl(var(--primary)) 4%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      background-color: color-mix(in oklab, var(--color-primary) 4%, transparent);
-    }
-  }
   .bg-red-500 {
     background-color: var(--color-red-500);
   }
@@ -2511,9 +2466,6 @@
       background-color: color-mix(in oklab, var(--color-red-600) 20%, transparent);
     }
   }
-  .bg-ring {
-    background-color: var(--color-ring);
-  }
   .bg-secondary {
     background-color: var(--color-secondary);
   }
@@ -2837,9 +2789,6 @@
   .pt-12 {
     padding-top: calc(var(--spacing) * 12);
   }
-  .pt-14 {
-    padding-top: calc(var(--spacing) * 14);
-  }
   .pt-16 {
     padding-top: calc(var(--spacing) * 16);
   }
@@ -2861,9 +2810,6 @@
   .pb-0 {
     padding-bottom: 0px;
   }
-  .pb-0\.5 {
-    padding-bottom: calc(var(--spacing) * 0.5);
-  }
   .pb-1 {
     padding-bottom: var(--spacing);
   }
@@ -2879,9 +2825,6 @@
   .pb-8 {
     padding-bottom: calc(var(--spacing) * 8);
   }
-  .pb-12 {
-    padding-bottom: calc(var(--spacing) * 12);
-  }
   .pl-2 {
     padding-left: calc(var(--spacing) * 2);
   }
@@ -3087,10 +3030,6 @@
     --tw-leading: var(--leading-tight);
     line-height: var(--leading-tight);
   }
-  .font-\[var\(--font-display\)\] {
-    --tw-font-weight: var(--font-display);
-    font-weight: var(--font-display);
-  }
   .font-bold {
     --tw-font-weight: var(--font-weight-bold);
     font-weight: var(--font-weight-bold);
@@ -3300,6 +3239,9 @@
   .text-\[var\(--surface-warning-text\)\] {
     color: var(--surface-warning-text);
   }
+  .text-\[var\(--text-dim\)\] {
+    color: var(--text-dim);
+  }
   .text-\[var\(--text-muted\)\] {
     color: var(--text-muted);
   }
@@ -3312,6 +3254,9 @@
   .text-\[var\(--text-primary\,hsl\(var\(--foreground\)\)\)\] {
     color: var(--text-primary,hsl(var(--foreground)));
   }
+  .text-\[var\(--text-secondary\)\] {
+    color: var(--text-secondary);
+  }
   .text-accent-foreground {
     color: var(--color-accent-foreground);
   }
@@ -3470,9 +3415,6 @@
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
   }
-  .accent-foreground {
-    accent-color: var(--color-foreground);
-  }
   .accent-primary {
     accent-color: var(--color-primary);
   }
@@ -3641,10 +3583,6 @@
     -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
     backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
   }
-  .backdrop-filter {
-    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
-    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
-  }
   .transition {
     transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -3800,10 +3738,6 @@
     --tw-font-weight: var(--font-weight-medium);
     font-weight: var(--font-weight-medium);
   }
-  .placeholder\:font-normal::placeholder {
-    --tw-font-weight: var(--font-weight-normal);
-    font-weight: var(--font-weight-normal);
-  }
   .placeholder\:text-muted-foreground::placeholder {
     color: var(--color-muted-foreground);
   }
@@ -3957,9 +3891,6 @@
         border-color: color-mix(in oklab, var(--color-primary) 50%, transparent);
       }
     }
-    .hover\:border-transparent:hover {
-      border-color: transparent;
-    }
     .hover\:\!bg-primary:hover {
       background-color: var(--color-primary) !important;
     }
@@ -4113,14 +4044,6 @@
         background-color: color-mix(in oklab, var(--color-muted) 50%, transparent);
       }
     }
-    .hover\:bg-muted\/60:hover {
-      background-color: color-mix(in srgb, hsl(var(--muted)) 60%, transparent);
-    }
-    @supports (color: color-mix(in lab, red, red)) {
-      .hover\:bg-muted\/60:hover {
-        background-color: color-mix(in oklab, var(--color-muted) 60%, transparent);
-      }
-    }
     .hover\:bg-muted\/80:hover {
       background-color: color-mix(in srgb, hsl(var(--muted)) 80%, transparent);
     }
@@ -4289,12 +4212,6 @@
       background-color: color-mix(in oklab, var(--color-muted) 50%, transparent);
     }
   }
-  .focus\:bg-primary\/15:focus {
-    background-color: color-mix(in srgb, hsl(var(--primary)) 15%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      background-color: color-mix(in oklab, var(--color-primary) 15%, transparent);
-    }
-  }
   .focus\:text-\[var\(--surface-danger-text\)\]:focus {
     color: var(--surface-danger-text);
   }
@@ -4544,9 +4461,6 @@
   .data-\[state\=open\]\:border-\[var\(--md3-outline-variant\)\][data-state="open"] {
     border-color: var(--md3-outline-variant);
   }
-  .data-\[state\=open\]\:border-transparent[data-state="open"] {
-    border-color: transparent;
-  }
   .data-\[state\=open\]\:bg-\[var\(--accent-surface-strong\)\][data-state="open"] {
     background-color: var(--accent-surface-strong);
   }
@@ -4559,18 +4473,9 @@
       background-color: color-mix(in oklab, var(--color-muted) 50%, transparent);
     }
   }
-  .data-\[state\=open\]\:bg-muted\/60[data-state="open"] {
-    background-color: color-mix(in srgb, hsl(var(--muted)) 60%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      background-color: color-mix(in oklab, var(--color-muted) 60%, transparent);
-    }
-  }
   .data-\[state\=open\]\:bg-surface-container-high[data-state="open"] {
     background-color: var(--color-surface-container-high);
   }
-  .data-\[state\=open\]\:text-foreground[data-state="open"] {
-    color: var(--color-foreground);
-  }
   .data-\[state\=open\]\:text-muted-foreground[data-state="open"] {
     color: var(--color-muted-foreground);
   }
@@ -5558,6 +5463,17 @@
   --border-default: rgba(120, 108, 158, 0.18);
   --border-hover: rgba(120, 108, 158, 0.28);
 }
+:root:not([data-theme]),
+[data-sandbox-ui]:not([data-theme]),
+[data-theme="dark"],
+.dark:not([data-theme]) {
+  --text-dim: #92929a;
+}
+[data-sandbox-theme="vault"]:not([data-theme]),
+[data-theme="light"],
+.light:not([data-theme]) {
+  --text-dim: #6b6b75;
+}
 .sandbox-tree-surface {
   --trees-bg-override: var(--md3-surface-container-lowest);
   --trees-bg-muted-override: var(--md3-surface-container-low);

package/dist/index.d.ts

@@ -5,11 +5,13 @@ 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, ChatMessage, ChatMessageProps, MessageList, MessageListProps, MessageRole, ThinkingIndicator, ThinkingIndicatorProps, UserMessage, UserMessageProps } from '@tangle-network/ui/chat';
-export { AgentComposer, AgentComposerMention, AgentComposerProps, AgentProfileCapability, AgentProfileDraft, AgentProfileOption, AgentProfilePicker, AgentProfilePickerProps, AgentSessionControls, AgentSessionControlsProps, AgentSessionHarnessControl, AgentSessionModelControl, AgentSessionProfileControl, AgentSessionReasoningControl, ArtifactAgentDock, ArtifactAgentDockProps, ArtifactAgentDockTransport, ArtifactDockMessage, ArtifactDockStreamEvent, ArtifactKind, ArtifactScope, ComposerFile, ComposerFileRejection, ComposerFileValidationConfig, DEFAULT_REASONING_LEVEL_OPTIONS, HARNESS_REASONING_OPTIONS, MENTION_PILL_CLASS, MentionItem, ReasoningLevel, ReasoningLevelOption, ReasoningLevelPicker, ReasoningLevelPickerProps, createFetchTransport, isAcceptedType, isModelCompatibleWithHarness, snapModelToHarness, validateComposerFiles } from './chat.js';
+export { AgentComposer, AgentComposerMention, AgentComposerProps, AgentProfileCapability, AgentProfileDraft, AgentProfileOption, AgentProfilePicker, AgentProfilePickerProps, ArtifactAgentDock, ArtifactAgentDockProps, ArtifactAgentDockTransport, ArtifactDockMessage, ArtifactDockStreamEvent, ArtifactKind, ArtifactScope, 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, 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, DEFAULT_FEATURED_MODEL_IDS, 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, ModelPicker, ModelPickerProps, ModelPickerVariant, 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, dedupeModels, formatContext, formatPricing, modelDedupKey, parseInsufficientBalance, useSidebar } from './dashboard.js';
+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 { M as ModelBrandIdentity, a as ModelBrandStack, b as ModelInfo, c as canonicalModelId, m as modelBrandFor } from './model-brand-BNnaUKKZ.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-Bn-Bw5xC.js';
 export { E as ExposedPort, P as PortsList, a as PortsListProps } from './ports-list-CDIvTNnX.js';
 export { AuthHeader, AuthHeaderProps, GitHubLoginButton, GitHubLoginButtonProps, LoginLayout, LoginLayoutProps, SessionUser, UserMenu, UserMenuProps } from '@tangle-network/ui/auth';
@@ -22,8 +24,6 @@ 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, modelProvider, snapHarnessToModel } from '@tangle-network/agent-interface';
-export { M as ModelBrandIdentity, a as ModelBrandStack, b as ModelInfo, c as canonicalModelId, m as modelBrandFor } from './model-brand-CuXKfTMh.js';
 import 'react';
 import '@radix-ui/react-dropdown-menu';
 import '@tanstack/react-query';