@tangle-network/sandbox-ui 0.113.7 → 0.115.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (107) hide show
  1. package/README.md +40 -0
  2. package/dist/WorkflowGraph-B-NsdYz_.js +1961 -0
  3. package/dist/assets.d.ts +214 -206
  4. package/dist/assets.js +1057 -908
  5. package/dist/auth-CWe17Hly.js +37 -0
  6. package/dist/auth.d.ts +2 -30
  7. package/dist/auth.js +2 -15
  8. package/dist/chat-BOvFAe6p.js +903 -0
  9. package/dist/chat.d.ts +2 -230
  10. package/dist/chat.js +2 -34
  11. package/dist/connectors.d.ts +52 -49
  12. package/dist/connectors.js +595 -643
  13. package/dist/dashboard-CZ3VgNPR.js +4969 -0
  14. package/dist/dashboard.d.ts +4 -1297
  15. package/dist/dashboard.js +4 -152
  16. package/dist/editor.d.ts +2 -1
  17. package/dist/editor.js +2 -31
  18. package/dist/files.d.ts +2 -6
  19. package/dist/files.js +2 -33
  20. package/dist/globals.css +75 -3
  21. package/dist/hooks.d.ts +146 -148
  22. package/dist/hooks.js +222 -55
  23. package/dist/index-CKRaj1pM.d.ts +776 -0
  24. package/dist/index-CXX5IpH2.d.ts +2 -0
  25. package/dist/index-CesPlOyx.d.ts +367 -0
  26. package/dist/index-DPePq7c8.d.ts +1340 -0
  27. package/dist/index-DiyLLZuJ.d.ts +230 -0
  28. package/dist/index-DvmZLMT1.d.ts +30 -0
  29. package/dist/index-PRM636Ex.d.ts +86 -0
  30. package/dist/index.d.ts +21 -33
  31. package/dist/index.js +21 -701
  32. package/dist/info-panel-C9cqDzOL.js +594 -0
  33. package/dist/integrations.d.ts +133 -141
  34. package/dist/integrations.js +491 -673
  35. package/dist/markdown.d.ts +2 -1
  36. package/dist/markdown.js +2 -13
  37. package/dist/model-I-NIxeM-.js +1250 -0
  38. package/dist/model-brand-B9A4H9pJ.d.ts +98 -0
  39. package/dist/model-brand-hMyDTUqB.js +624 -0
  40. package/dist/motion-DkyBRJb9.js +37 -0
  41. package/dist/openui.d.ts +2 -1
  42. package/dist/openui.js +2 -7
  43. package/dist/pages.d.ts +307 -300
  44. package/dist/pages.js +4404 -4181
  45. package/dist/primitives-Dh1vG6J3.js +113 -0
  46. package/dist/primitives.d.ts +2 -74
  47. package/dist/primitives.js +2 -204
  48. package/dist/provider-logo-DjqmConF.js +311 -0
  49. package/dist/run.d.ts +2 -1
  50. package/dist/run.js +2 -23
  51. package/dist/sdk-hooks.d.ts +3 -4
  52. package/dist/sdk-hooks.js +3 -31
  53. package/dist/sidecar-DgH_vQ6m.d.ts +9 -0
  54. package/dist/stores.d.ts +14 -15
  55. package/dist/stores.js +13 -81
  56. package/dist/styles.css +75 -3
  57. package/dist/template-card-L-4gmjx2.d.ts +90 -0
  58. package/dist/terminal-CN9ZgHRt.js +197 -0
  59. package/dist/terminal.d.ts +60 -60
  60. package/dist/terminal.js +2 -10
  61. package/dist/tokens.css +51 -0
  62. package/dist/types.d.ts +4 -11
  63. package/dist/types.js +0 -1
  64. package/dist/use-pty-session-C8cE0adT.js +669 -0
  65. package/dist/use-sidecar-auth-CCTJcrq7.d.ts +145 -0
  66. package/dist/use-sidecar-auth-DkdcufOz.js +742 -0
  67. package/dist/utils-DzWbktWG.js +2 -0
  68. package/dist/utils.d.ts +2 -1
  69. package/dist/utils.js +2 -37
  70. package/dist/workbench-ztU44Jt2.js +8455 -0
  71. package/dist/workbench.d.ts +2 -310
  72. package/dist/workbench.js +2 -44
  73. package/dist/workflows.d.ts +341 -339
  74. package/dist/workflows.js +74 -109
  75. package/dist/workspace-B6AtI6ld.js +2510 -0
  76. package/dist/workspace.d.ts +2 -761
  77. package/dist/workspace.js +2 -51
  78. package/package.json +46 -40
  79. package/dist/WorkflowGraph-2QOORYIR.js +0 -1722
  80. package/dist/chunk-2BUPSB7O.js +0 -0
  81. package/dist/chunk-3KBNPQQF.js +0 -2697
  82. package/dist/chunk-3LIXVEEE.js +0 -279
  83. package/dist/chunk-72UF2H5H.js +0 -707
  84. package/dist/chunk-AI25G5MX.js +0 -944
  85. package/dist/chunk-ANSC5AFC.js +0 -314
  86. package/dist/chunk-AZ3AWMTM.js +0 -8
  87. package/dist/chunk-BGVEHENC.js +0 -10
  88. package/dist/chunk-CZ7CSFO4.js +0 -39
  89. package/dist/chunk-DYXXYGS4.js +0 -4700
  90. package/dist/chunk-EI44GEQ5.js +0 -6
  91. package/dist/chunk-IACRDXER.js +0 -219
  92. package/dist/chunk-IOB2PW5Z.js +0 -55
  93. package/dist/chunk-M4K7ZGR2.js +0 -24
  94. package/dist/chunk-MYZAW4RX.js +0 -665
  95. package/dist/chunk-OMUIPJQZ.js +0 -555
  96. package/dist/chunk-RQZRXKMR.js +0 -398
  97. package/dist/chunk-SOKKTB7W.js +0 -230
  98. package/dist/chunk-TADGS4Q7.js +0 -1010
  99. package/dist/chunk-UCQNOUN3.js +0 -7964
  100. package/dist/chunk-ULPLRBMF.js +0 -34
  101. package/dist/chunk-WID73FPH.js +0 -89
  102. package/dist/chunk-X3YXP7FG.js +0 -38
  103. package/dist/logo-DiAjq759.d.ts +0 -15
  104. package/dist/model-brand-BNnaUKKZ.d.ts +0 -99
  105. package/dist/ports-list-CDIvTNnX.d.ts +0 -17
  106. package/dist/sdk-hooks-Djkjq4cp.d.ts +0 -145
  107. package/dist/template-card-Bn-Bw5xC.d.ts +0 -87
@@ -1,1297 +1,4 @@
1
- import * as React from 'react';
2
- import React__default, { ReactNode } from 'react';
3
- import { HarnessType } from '@tangle-network/agent-interface';
4
- export { HarnessType } from '@tangle-network/agent-interface';
5
- export { M as ModelBrandIdentity, a as ModelBrandStack, b as ModelInfo, c as canonicalModelId, m as modelBrandFor } from './model-brand-BNnaUKKZ.js';
6
- 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';
7
- export { E as ExposedPort, P as PortsList, a as PortsListProps } from './ports-list-CDIvTNnX.js';
8
-
9
- interface SidebarUser {
10
- email: string;
11
- name?: string;
12
- tier?: string;
13
- avatarUrl?: string;
14
- }
15
- /** Theme modes offered by the account menu's Appearance section. */
16
- type ThemeMode = "light" | "dark" | "system";
17
- /**
18
- * Host-supplied controller for the account-menu Appearance section. The rail is
19
- * theme-engine-agnostic: each app wires this to its own theme hook (gtm-agent
20
- * uses the shared `useTheme`; the sandbox app uses its `vault`-aware
21
- * `useThemeMode`). Provide it to {@link ProfileAvatar} to render Light/Dark/System.
22
- */
23
- interface AppearanceController {
24
- value: ThemeMode;
25
- onChange: (mode: ThemeMode) => void;
26
- /** Which modes to offer, in order. Defaults to all three. */
27
- modes?: ThemeMode[];
28
- }
29
- /**
30
- * Compact light/dark switch driven by the shared `useTheme` hook.
31
- *
32
- * @deprecated The redesigned rail no longer renders a standalone theme toggle —
33
- * theme lives in the account menu as a Light/Dark/System control via the
34
- * `appearance` controller on {@link ProfileAvatar} (and both layouts). Kept for
35
- * backward compatibility; not used by `SidebarLayout`/`DashboardLayout`.
36
- */
37
- declare function RailThemeToggle({ className }: {
38
- className?: string;
39
- }): React.JSX.Element;
40
- interface RailCollapseToggleProps {
41
- /** Whether the rail is currently collapsed (icon-only). */
42
- collapsed: boolean;
43
- /** Render with a label beside the chevron (expanded/labeled rail) vs. icon-only. */
44
- showLabel?: boolean;
45
- onToggle: () => void;
46
- className?: string;
47
- }
48
- declare function RailCollapseToggle({ collapsed, showLabel, onToggle, className }: RailCollapseToggleProps): React.JSX.Element;
49
- interface RailHeaderProps {
50
- /** Brand mark shown on the left, e.g. `<Logo iconOnly />`. */
51
- brand?: React.ReactNode;
52
- /** Destination for the brand link. When set with `LinkComponent`, the brand is a link. */
53
- brandHref?: string;
54
- /**
55
- * Optional middle content (e.g. a project/workspace switcher).
56
- *
57
- * When `brand` is set, this is expanded-only — the collapsed rail has room
58
- * for the mark alone. When `brand` is NOT set this content owns the rail top
59
- * in BOTH states, so it is also rendered collapsed; read `useSidebar()` to
60
- * swap in a compact mark there.
61
- */
62
- children?: React.ReactNode;
63
- /** Whether the rail is collapsed (icon-only). */
64
- collapsed: boolean;
65
- /** Collapse/expand the rail. */
66
- onToggle: () => void;
67
- /**
68
- * Whether the rail can collapse/expand. When `false`, no panel toggle is
69
- * rendered and the collapsed header shows the brand without the hover-morph.
70
- * Defaults to `true`.
71
- */
72
- collapsible?: boolean;
73
- LinkComponent?: React.ComponentType<any>;
74
- className?: string;
75
- }
76
- declare function RailHeader({ brand, brandHref, children, collapsed, onToggle, collapsible, LinkComponent, className }: RailHeaderProps): React.JSX.Element;
77
- interface SidebarProps {
78
- children: React.ReactNode;
79
- className?: string;
80
- style?: React.CSSProperties;
81
- }
82
- declare function Sidebar({ children, className, style }: SidebarProps): React.JSX.Element;
83
- interface SidebarRailProps {
84
- children: React.ReactNode;
85
- className?: string;
86
- /**
87
- * Render the rail at the wider mobile-drawer width so labels fit
88
- * beside the icons. Defaults to the 64px icon-only rail used on
89
- * desktop.
90
- */
91
- wide?: boolean;
92
- }
93
- declare function SidebarRail({ children, className, wide }: SidebarRailProps): React.JSX.Element;
94
- interface SidebarRailHeaderProps {
95
- children: React.ReactNode;
96
- className?: string;
97
- }
98
- /**
99
- * @deprecated Superseded by {@link RailHeader}, the three-slot header
100
- * (brand · middle · panel toggle) used by both shells. Kept for backward
101
- * compatibility; no longer rendered by `SidebarLayout`/`DashboardLayout`.
102
- */
103
- declare function SidebarRailHeader({ children, className }: SidebarRailHeaderProps): React.JSX.Element;
104
- interface SidebarRailNavProps {
105
- children: React.ReactNode;
106
- className?: string;
107
- /**
108
- * Click handler on the `<nav>` itself. Layouts use it (with a
109
- * `target === currentTarget` guard) so clicking the empty body of a collapsed
110
- * rail expands it, without intercepting clicks on the nav items.
111
- */
112
- onClick?: React.MouseEventHandler<HTMLElement>;
113
- }
114
- declare function SidebarRailNav({ children, className, onClick }: SidebarRailNavProps): React.JSX.Element;
115
- interface SidebarRailFooterProps {
116
- children: React.ReactNode;
117
- className?: string;
118
- }
119
- declare function SidebarRailFooter({ children, className }: SidebarRailFooterProps): React.JSX.Element;
120
- interface RailSeparatorProps {
121
- className?: string;
122
- }
123
- declare function RailSeparator({ className }: RailSeparatorProps): React.JSX.Element;
124
- interface RailButtonProps {
125
- icon: React.ComponentType<{
126
- className?: string;
127
- }>;
128
- label: string;
129
- isActive?: boolean;
130
- badge?: number;
131
- onClick?: () => void;
132
- className?: string;
133
- /** Show label text next to icon (for mobile drawer) */
134
- showLabel?: boolean;
135
- /**
136
- * Render the rail-button styling onto a single child element (e.g. a router
137
- * `<Link>`) instead of an inner `<button>`. The child receives the button
138
- * classes, `title`, and the icon/label/badge as its content — so navigation
139
- * items stay real anchors (keyboard, cmd-click, prefetch) without copying the
140
- * class recipe or nesting `<a><button>`.
141
- */
142
- asChild?: boolean;
143
- children?: React.ReactNode;
144
- /**
145
- * `"primary"` gives the item a distinct emphasized pill (accent fill + accent
146
- * border) so it stands out from the rest of the nav, e.g. a "New" action.
147
- * Defaults to `"normal"`.
148
- */
149
- variant?: "normal" | "primary";
150
- /**
151
- * Inline style for the rendered row. Layouts use it to set `--stagger-index`
152
- * so a rail of nav items arrives as a sequence rather than a flash; the
153
- * variable has to land on the animated element itself, which is this one.
154
- */
155
- style?: React.CSSProperties;
156
- }
157
- declare function RailButton({ icon: Icon, label, isActive, badge, onClick, className, showLabel, asChild, children, variant, style }: RailButtonProps): React.JSX.Element;
158
- interface RailFlyoutProps {
159
- icon: React.ComponentType<{
160
- className?: string;
161
- }>;
162
- label: string;
163
- /** Highlight the trigger (e.g. when a child route is active). */
164
- isActive?: boolean;
165
- /** Show the label text beside the icon (labeled rail) vs. icon-only. */
166
- showLabel?: boolean;
167
- /** Heading rendered at the top of the open flyout. Defaults to `label`. */
168
- title?: string;
169
- /** Flyout body — the sub-surfaces revealed when the item is opened. */
170
- children: React.ReactNode;
171
- className?: string;
172
- /** @see {@link RailButtonProps.style} — carries `--stagger-index` in a rail. */
173
- style?: React.CSSProperties;
174
- }
175
- /**
176
- * A rail entry that reveals its sub-surfaces in a small panel anchored to the
177
- * RIGHT of the rail item, rather than pushing the rail open with an inline
178
- * accordion. Opens on click, closes on outside-click, Escape, or selecting an
179
- * item inside it. Use for a single "door" (e.g. Studio) that fronts several
180
- * related destinations without permanently spending rail height on them.
181
- */
182
- declare function RailFlyout({ icon: Icon, label, isActive, showLabel, title, children, className, style, }: RailFlyoutProps): React.JSX.Element;
183
- /** A single entry in a sub-item's hover actions menu (kebab). */
184
- interface RailSubItemAction {
185
- id: string;
186
- label: string;
187
- icon?: React.ComponentType<{
188
- className?: string;
189
- }>;
190
- /** Style the item as a destructive action (e.g. delete). */
191
- destructive?: boolean;
192
- onSelect: () => void;
193
- }
194
- /** A sub-destination revealed by a {@link RailExpandable} item. */
195
- interface RailExpandableSubItem {
196
- id: string;
197
- label: string;
198
- icon?: React.ComponentType<{
199
- className?: string;
200
- }>;
201
- href: string;
202
- prefetch?: "none" | "intent" | "render" | "viewport";
203
- /** Show a live working indicator on the row while the item is busy. */
204
- isLoading?: boolean;
205
- /** Render the row emphasized (bold + accent) so it stands out — e.g. a
206
- * trailing "view all" action below a capped list. */
207
- emphasis?: boolean;
208
- /** Mark the row as unread — bold label + a leading dot. Suppressed while
209
- * `isLoading` so a responding row shows only the working indicator. */
210
- unread?: boolean;
211
- /** Hover-revealed kebab actions (e.g. rename/delete). Rendered on the
212
- * labeled rail only; ignored in the collapsed-rail flyout. */
213
- actions?: RailSubItemAction[];
214
- }
215
- interface RailExpandableProps {
216
- icon: React.ComponentType<{
217
- className?: string;
218
- }>;
219
- label: string;
220
- /** Destination for the row itself. Clicking the label navigates here. */
221
- href?: string;
222
- /** Highlight the row (e.g. its own route or a child route is active). */
223
- isActive?: boolean;
224
- /** Labeled (expanded) rail vs. icon-only (collapsed) rail. */
225
- showLabel?: boolean;
226
- /** Fixed sub-items. Mutually exclusive with `loadSubItems`. */
227
- subItems?: RailExpandableSubItem[];
228
- /** Lazy sub-items — called once on first open; the result is cached. */
229
- loadSubItems?: () => Promise<RailExpandableSubItem[]>;
230
- /** Start expanded on mount (labeled rail). Defaults to collapsed. */
231
- defaultOpen?: boolean;
232
- /** Ids of sub-items whose route is active (drives sub-item highlight). */
233
- activeSubIds?: string[];
234
- /** Shown when the resolved sub-item list is empty. */
235
- emptyLabel?: string;
236
- /** Called when the row or a sub-item navigates (e.g. to close a mobile drawer). */
237
- onNavigate?: () => void;
238
- LinkComponent?: React.ComponentType<any>;
239
- className?: string;
240
- /** @see {@link RailButtonProps.style} — carries `--stagger-index` in a rail. */
241
- style?: React.CSSProperties;
242
- }
243
- /**
244
- * A nav item that reveals sub-items. On the labeled rail it expands inline as an
245
- * accordion: the leading icon morphs into a chevron on hover, clicking the
246
- * chevron toggles the list, and clicking the label navigates (`href`). On the
247
- * icon-only rail it shows the sub-items in a right-anchored flyout on hover.
248
- * Sub-items can be fixed (`subItems`) or lazy (`loadSubItems`, with a loading
249
- * skeleton). Used for e.g. a "History" entry fronting recent sessions.
250
- */
251
- declare function RailExpandable({ icon: Icon, label, href, isActive, showLabel, subItems, loadSubItems, activeSubIds, emptyLabel, defaultOpen, onNavigate, LinkComponent, className, style, }: RailExpandableProps): React.JSX.Element;
252
- interface RailModeButtonProps {
253
- mode: string;
254
- icon: React.ComponentType<{
255
- className?: string;
256
- }>;
257
- label: string;
258
- badge?: number;
259
- className?: string;
260
- /** Show label text next to icon (for mobile drawer) */
261
- showLabel?: boolean;
262
- /** @see {@link RailButtonProps.style} — carries `--stagger-index` in a rail. */
263
- style?: React.CSSProperties;
264
- }
265
- declare function RailModeButton({ mode, icon, label, badge, className, showLabel, style }: RailModeButtonProps): React.JSX.Element;
266
- interface SidebarPanelProps {
267
- children: React.ReactNode;
268
- className?: string;
269
- }
270
- declare function SidebarPanel({ children, className }: SidebarPanelProps): React.JSX.Element;
271
- interface SidebarPanelHeaderProps {
272
- children?: React.ReactNode;
273
- title?: string;
274
- className?: string;
275
- }
276
- declare function SidebarPanelHeader({ children, title, className }: SidebarPanelHeaderProps): React.JSX.Element;
277
- interface SidebarPanelContentProps {
278
- children: React.ReactNode;
279
- className?: string;
280
- }
281
- declare function SidebarPanelContent({ children, className }: SidebarPanelContentProps): React.JSX.Element;
282
- interface SidebarContentProps {
283
- children: React.ReactNode;
284
- className?: string;
285
- }
286
- declare function SidebarContent({ children, className }: SidebarContentProps): React.JSX.Element;
287
- interface ProfileAvatarProps {
288
- user?: SidebarUser | null;
289
- isLoading?: boolean;
290
- onLogout?: () => void;
291
- onSettingsClick?: () => void;
292
- settingsHref?: string;
293
- /** Extra dropdown items rendered before settings/logout */
294
- children?: React.ReactNode;
295
- className?: string;
296
- /** Show name/email beside the avatar (for a labeled rail) instead of an icon-only avatar button. */
297
- showDetails?: boolean;
298
- /**
299
- * When provided, the menu renders an Appearance section (Light/Dark/System)
300
- * driven by this host-supplied controller. Omit to hide it.
301
- */
302
- appearance?: AppearanceController;
303
- LinkComponent?: React.ComponentType<any>;
304
- }
305
- declare function ProfileAvatar({ user, isLoading, onLogout, onSettingsClick, settingsHref, children, className, showDetails, appearance, LinkComponent, }: ProfileAvatarProps): React.JSX.Element;
306
-
307
- interface RailTooltipProps {
308
- /** Tooltip text shown to the right of the trigger. */
309
- label: string;
310
- /** The trigger element (icon button / link). */
311
- children: React.ReactNode;
312
- /** Disable the tooltip (e.g. when the rail is expanded and the label is inline). */
313
- disabled?: boolean;
314
- className?: string;
315
- }
316
- /**
317
- * Quiet styled tooltip for the icon-only rail, rendered in a portal anchored to
318
- * the RIGHT of the trigger. The portal is essential: the rail's nav is a
319
- * vertical scroll container (`overflow-y-auto`), which the CSS spec forces to
320
- * also clip horizontally — an in-flow tooltip would be cut off at the rail's
321
- * edge. Positioned via `getBoundingClientRect` on hover/focus, shown after a
322
- * short delay, and `pointer-events-none` so it never interferes with the
323
- * trigger. Hidden from the a11y tree (`aria-hidden`) since the trigger already
324
- * carries an accessible name.
325
- *
326
- * `disabled` suppresses the tooltip but NOT the wrapper. Returning a fragment
327
- * instead changes the rendered element type, and React reconciles by type: the
328
- * trigger inside would be torn down and rebuilt every time the rail toggles
329
- * between icon-only and labeled. A rebuilt element replays its CSS entrance, so
330
- * the whole nav would re-stagger on a collapse that moved nothing off screen.
331
- * One element type, both states.
332
- */
333
- declare function RailTooltip({ label, children, disabled, className }: RailTooltipProps): React.JSX.Element;
334
-
335
- /** Width constants (px) — Tangle Quiet density (ChatGPT-minimal) */
336
- declare const SIDEBAR_RAIL_WIDTH = 56;
337
- declare const SIDEBAR_PANEL_WIDTH = 268;
338
- declare const SIDEBAR_TOTAL_WIDTH: number;
339
- /**
340
- * Width of the mobile drawer when the rail is rendered with labels
341
- * (`showLabel` on {@link RailButton}). The standard 64px rail is only
342
- * wide enough for icons; labels need a wider container to avoid truncation.
343
- */
344
- declare const SIDEBAR_MOBILE_WIDTH = 256;
345
- /**
346
- * Rail width when labels are shown beside icons on desktop. The default rail is
347
- * icon-only at {@link SIDEBAR_RAIL_WIDTH}; a labeled rail needs room for the
348
- * longest nav label plus its badge.
349
- */
350
- declare const SIDEBAR_RAIL_LABELED_WIDTH = 248;
351
- interface SidebarContextValue {
352
- /** Whether the content panel beside the rail is open */
353
- panelOpen: boolean;
354
- setPanelOpen: (open: boolean) => void;
355
- togglePanel: () => void;
356
- /** Current panel mode (app-defined, e.g. "projects", "batches") */
357
- mode: string;
358
- setMode: (mode: string) => void;
359
- /** Switch mode — opens panel if closed, closes if same mode clicked */
360
- switchMode: (mode: string) => void;
361
- /** Whether entire sidebar (rail + panel) is hidden (focus mode) */
362
- hidden: boolean;
363
- setHidden: (hidden: boolean) => void;
364
- /** Computed content margin in px */
365
- contentMargin: number;
366
- /** Whether there are panels at all */
367
- hasPanels: boolean;
368
- /**
369
- * Whether the labeled nav rail is collapsed to the icon-only width. Independent
370
- * of {@link panelOpen} (the slide-out content panel) — two separate collapses.
371
- * Only meaningful when the rail is label-capable; an icon-only rail stays
372
- * icon-only regardless.
373
- */
374
- railCollapsed: boolean;
375
- setRailCollapsed: (collapsed: boolean) => void;
376
- toggleRail: () => void;
377
- /**
378
- * Rail width in px — derived from {@link railCollapsed}: the icon-only width
379
- * when collapsed (or when the rail is not label-capable), the labeled width
380
- * when expanded.
381
- */
382
- railWidth: number;
383
- }
384
- interface SidebarProviderProps {
385
- defaultPanelOpen?: boolean;
386
- defaultMode?: string;
387
- hasPanels?: boolean;
388
- /**
389
- * Whether the rail can show labels beside icons. When `true`, the expanded
390
- * rail renders at {@link SIDEBAR_RAIL_LABELED_WIDTH} and the user can collapse
391
- * it to the icon-only {@link SIDEBAR_RAIL_WIDTH} via {@link toggleRail}. When
392
- * `false` (default) the rail is permanently icon-only and `railCollapsed` has
393
- * no width effect.
394
- */
395
- labeledRail?: boolean;
396
- /**
397
- * Controlled panel-open state. When provided, the provider treats panel
398
- * visibility as controlled: it never reads or writes localStorage and
399
- * reports changes through {@link onPanelOpenChange} instead. Use this in
400
- * server-rendered apps — seed it from a value the server also has (e.g. a
401
- * cookie) so the SSR markup matches the first client render. The localStorage
402
- * read in the uncontrolled path is what diverges from SSR and breaks hydration.
403
- */
404
- panelOpen?: boolean;
405
- onPanelOpenChange?: (open: boolean) => void;
406
- /**
407
- * Controlled rail-collapsed state. Parallels {@link panelOpen}: when provided
408
- * the provider never touches localStorage for the rail and reports changes
409
- * through {@link onRailCollapsedChange}. Seed it from a cookie in SSR apps so
410
- * the rail width survives reload without a hydration mismatch.
411
- */
412
- railCollapsed?: boolean;
413
- onRailCollapsedChange?: (collapsed: boolean) => void;
414
- /** Initial rail-collapsed state for the uncontrolled path. Default: expanded. */
415
- defaultRailCollapsed?: boolean;
416
- children: React.ReactNode;
417
- }
418
- declare function SidebarProvider({ defaultPanelOpen, defaultMode, hasPanels, labeledRail, panelOpen: controlledPanelOpen, onPanelOpenChange, railCollapsed: controlledRailCollapsed, onRailCollapsedChange, defaultRailCollapsed, children, }: SidebarProviderProps): React.JSX.Element;
419
- declare function useSidebar(): SidebarContextValue;
420
-
421
- interface CreditBalanceProps {
422
- amount: number;
423
- description?: string;
424
- onTopUp?: (amount: number) => void;
425
- quickAmounts?: number[];
426
- className?: string;
427
- }
428
- declare function CreditBalance({ amount, description, onTopUp, quickAmounts, className, }: CreditBalanceProps): React.JSX.Element;
429
-
430
- /**
431
- * Canonical "out of credits" UX, shared across every Tangle product.
432
- *
433
- * Backends emit a 402 with `{ error, code: "insufficient_balance", manageUrl,
434
- * plan?, remainingBalanceUsd? }` when a billable action can't be funded. The
435
- * frontend catches it, calls {@link parseInsufficientBalance} to extract the
436
- * shape, and renders {@link OutOfCreditsModal} — a single "add credits /
437
- * subscribe" CTA that links to the platform billing page (`manageUrl`).
438
- *
439
- * This replaces the per-app bespoke handling (silent failures, raw errors,
440
- * un-clickable text) with one component so the funnel is uniform + testable.
441
- */
442
- declare const INSUFFICIENT_BALANCE_CODE = "insufficient_balance";
443
- interface InsufficientBalance {
444
- /** Platform billing URL to add credits / subscribe / connect a card. */
445
- manageUrl: string;
446
- /** Current plan, when the backend includes it. */
447
- plan?: string;
448
- /** Remaining balance (USD), when included. */
449
- remainingBalanceUsd?: number;
450
- /** Backend-supplied human message, when included. */
451
- message?: string;
452
- }
453
- /**
454
- * Detect + parse an insufficient-balance 402 from a parsed JSON body. Returns
455
- * the typed shape when the body is an insufficient-balance error, else `null`.
456
- * Falls back to the platform default billing URL when the backend omits
457
- * `manageUrl` so the CTA is never dead.
458
- */
459
- declare function parseInsufficientBalance(payload: unknown, opts?: {
460
- defaultManageUrl?: string;
461
- }): InsufficientBalance | null;
462
- interface OutOfCreditsModalProps {
463
- /** Parsed insufficient-balance details (from {@link parseInsufficientBalance}). */
464
- balance: InsufficientBalance | null;
465
- /** Dismiss handler. When omitted the modal cannot be closed (hard paywall). */
466
- onClose?: () => void;
467
- /** Override the primary CTA label. Default "Add credits". */
468
- ctaLabel?: string;
469
- className?: string;
470
- }
471
- /**
472
- * Modal shown when a user runs out of credits. Renders nothing when
473
- * `balance` is null. The primary CTA opens the platform billing page where
474
- * the user can add credits, subscribe, or connect a card for pay-per-use.
475
- */
476
- declare function OutOfCreditsModal({ balance, onClose, ctaLabel, className, }: OutOfCreditsModalProps): React.JSX.Element | null;
477
-
478
- interface ClusterStatusItem {
479
- icon?: React.ReactNode;
480
- label: string;
481
- value: React.ReactNode;
482
- valueClass?: string;
483
- }
484
- interface ClusterStatusBarProps {
485
- items: ClusterStatusItem[];
486
- latency?: string;
487
- className?: string;
488
- }
489
- declare function ClusterStatusBar({ items, latency, className }: ClusterStatusBarProps): React.JSX.Element | null;
490
-
491
- interface ResourceMeterProps {
492
- label: string;
493
- value: number;
494
- max?: number;
495
- unit?: string;
496
- icon?: React.ReactNode;
497
- /**
498
- * Overrides the right-hand readout. Use for values the raw
499
- * `value{unit}/max{unit}` template can't express, e.g. byte sizes
500
- * ("1.2 GB / 4 GB"). The bar fill still derives from value/max.
501
- */
502
- valueLabel?: string;
503
- className?: string;
504
- }
505
- declare function ResourceMeter({ label, value, max, unit, valueLabel, icon, className }: ResourceMeterProps): React.JSX.Element;
506
-
507
- interface ResourceSnapshotItem {
508
- /** Stable React key; falls back to `label` plus row index when omitted. */
509
- id?: string;
510
- label: string;
511
- /** Current value, in the same unit as `max`. */
512
- value: number;
513
- /** Full-scale value. Omit to treat `value` as a 0-100 percent. */
514
- max?: number;
515
- /** Unit suffix for the default `value{unit}/max{unit}` readout. */
516
- unit?: string;
517
- /** Right-hand readout override (e.g. "1.2 GB / 4 GB"). */
518
- valueLabel?: string;
519
- icon?: React.ReactNode;
520
- }
521
- interface ResourceSnapshotProps {
522
- title?: string;
523
- /** Right-aligned header slot, e.g. a "View metrics" link. */
524
- action?: React.ReactNode;
525
- items: ResourceSnapshotItem[];
526
- loading?: boolean;
527
- /** When set, replaces the meters with an error line. */
528
- error?: string | null;
529
- className?: string;
530
- }
531
- /**
532
- * Compact at-a-glance resource panel: a stack of {@link ResourceMeter}
533
- * rows for an instantaneous CPU / memory / disk read. Time-series detail
534
- * belongs in a dedicated metrics view; this is the snapshot.
535
- */
536
- declare function ResourceSnapshot({ title, action, items, loading, error, className, }: ResourceSnapshotProps): React.JSX.Element;
537
-
538
- interface ActivityItem {
539
- /** Stable key. */
540
- id: string;
541
- icon?: React.ReactNode;
542
- title: string;
543
- detail?: string;
544
- /** Wall-clock ms. Drives ordering and the relative timestamp. */
545
- timestamp?: number;
546
- }
547
- interface ActivityFeedProps {
548
- title?: string;
549
- action?: React.ReactNode;
550
- items: ActivityItem[];
551
- loading?: boolean;
552
- /** Caps the rendered rows after sorting newest-first. Default 6. */
553
- maxItems?: number;
554
- emptyLabel?: string;
555
- className?: string;
556
- }
557
- /**
558
- * Newest-first list of recent sandbox activity (commits, snapshots,
559
- * lifecycle events). Items are sorted by `timestamp` descending here so
560
- * callers can merge heterogeneous sources without pre-sorting.
561
- */
562
- declare function ActivityFeed({ title, action, items, loading, maxItems, emptyLabel, className, }: ActivityFeedProps): React.JSX.Element;
563
-
564
- type SandboxStatus = "running" | "hibernating" | "provisioning" | "stopped" | "failed" | "archived" | "creating";
565
- type TeamRole = "owner" | "admin" | "member" | "viewer";
566
- interface SandboxCardData {
567
- id: string;
568
- name: string;
569
- nodeId?: string;
570
- status: SandboxStatus;
571
- /**
572
- * A user-customized container image (e.g. `ghcr.io/acme/api:sha-1a2b`).
573
- * Surfaced only when set — sandboxes run a managed agent runtime image by
574
- * default, which is not operator-relevant and is intentionally not shown.
575
- */
576
- customImage?: string;
577
- /** @deprecated The product has no user-selectable environment. Use `customImage`. */
578
- image?: string;
579
- /** @deprecated No longer rendered; the card derives its glyph from status. */
580
- imageIcon?: React.ReactNode;
581
- /** Allocated vCPU count. */
582
- vcpu?: number;
583
- /** Live CPU utilization, 0–100. */
584
- cpuPercent?: number;
585
- /** Live RAM in use (GB). */
586
- ramUsed?: number;
587
- /** Allocated RAM (GB). */
588
- ramTotal?: number;
589
- /** Disk in use (GB). */
590
- diskUsed?: number;
591
- /** Allocated disk (GB). */
592
- diskTotal?: number;
593
- /** Human-readable uptime since last start, e.g. "3d 4h" or "12m". */
594
- uptime?: string;
595
- provisioningMessage?: string;
596
- provisioningPercent?: number;
597
- archivedAt?: string;
598
- /**
599
- * Populated when the sandbox is shared with a team. Drives a small
600
- * "shared with X" badge in the card header so a user can see at a
601
- * glance which of their sandboxes are personal vs. collaborative.
602
- */
603
- team?: {
604
- id: string;
605
- name?: string;
606
- /** Caller's role in the team — the card uses this to gate the Delete action. */
607
- role: TeamRole;
608
- };
609
- }
610
- interface SandboxCardProps {
611
- sandbox: SandboxCardData;
612
- onOpenIDE?: (id: string) => void;
613
- onOpenTerminal?: (id: string) => void;
614
- /** Preferred start handler; drives the footer + dropdown Resume action. */
615
- onResume?: (id: string) => void;
616
- /**
617
- * @deprecated Use `onResume`. Retained for back-compat: only a
618
- * `hibernating` card falls back to `onWake` when `onResume` is absent.
619
- */
620
- onWake?: (id: string) => void;
621
- onRestore?: (id: string) => void;
622
- onDelete?: (id: string) => void;
623
- onStop?: (id: string) => void;
624
- onFork?: (id: string) => void;
625
- onKeepAlive?: (id: string) => void;
626
- onUsage?: (id: string) => void;
627
- onHealth?: (id: string) => void;
628
- className?: string;
629
- }
630
- declare function canAdminSandbox(sandbox: SandboxCardData): boolean;
631
- declare function SandboxCard({ sandbox, onOpenIDE, onOpenTerminal, onWake, onRestore, onDelete, onStop, onResume, onFork, onKeepAlive, onUsage, onHealth, className }: SandboxCardProps): React.JSX.Element;
632
- interface NewSandboxCardProps {
633
- onClick?: () => void;
634
- className?: string;
635
- }
636
- declare function NewSandboxCard({ onClick, className }: NewSandboxCardProps): React.JSX.Element;
637
-
638
- interface SandboxTableProps {
639
- sandboxes: SandboxCardData[];
640
- page?: number;
641
- pageSize?: number;
642
- total?: number;
643
- onPageChange?: (page: number) => void;
644
- onOpenIDE?: (id: string) => void;
645
- onOpenTerminal?: (id: string) => void;
646
- onSSH?: (id: string) => void;
647
- /**
648
- * Resume a stopped / failed / archived sandbox, or wake a hibernating
649
- * one. Surfaces an explicit "Resume" (or "Wake Up" for `hibernating`)
650
- * button in the actions cell and makes the row body clickable for any
651
- * status this prop covers. Preferred over `onWake` for new code — the
652
- * two are kept as separate props only so existing consumers that
653
- * wired up `onWake` for hibernating continue to work.
654
- */
655
- onResume?: (id: string) => void;
656
- /**
657
- * @deprecated Use `onResume` instead. Retained for back-compat:
658
- * when `onResume` is not provided but `onWake` is, hibernating rows
659
- * will still surface a Wake action. New consumers should pass
660
- * `onResume` so stopped / failed / archived rows also get a start
661
- * affordance.
662
- */
663
- onWake?: (id: string) => void;
664
- onMore?: (id: string) => void;
665
- /** Fired on the user's first click; the caller owns the confirmation step. */
666
- onDelete?: (id: string) => void;
667
- onStop?: (id: string) => void;
668
- onKeepAlive?: (id: string) => void;
669
- onUsage?: (id: string) => void;
670
- onHealth?: (id: string) => void;
671
- onFork?: (id: string) => void;
672
- className?: string;
673
- }
674
- declare function SandboxTable({ sandboxes, page, pageSize, total, onPageChange, onOpenIDE, onOpenTerminal, onSSH, onResume, onWake, onMore, onDelete, onStop, onKeepAlive, onUsage, onHealth, onFork, className, }: SandboxTableProps): React.JSX.Element;
675
-
676
- interface Invoice {
677
- id: string;
678
- date: string;
679
- amount: number;
680
- status: "paid" | "pending" | "failed";
681
- }
682
- interface InvoiceTableProps {
683
- invoices: Invoice[];
684
- onExportAll?: () => void;
685
- onLoadMore?: () => void;
686
- onViewInvoice?: (id: string) => void;
687
- hasMore?: boolean;
688
- className?: string;
689
- }
690
- declare function InvoiceTable({ invoices, onExportAll, onLoadMore, onViewInvoice, hasMore, className }: InvoiceTableProps): React.JSX.Element;
691
-
692
- interface PlanFeature {
693
- text: string;
694
- }
695
- interface PlanCardData {
696
- id: string;
697
- name: string;
698
- price: number;
699
- period?: string;
700
- features: PlanFeature[];
701
- popular?: boolean;
702
- current?: boolean;
703
- ctaLabel?: string;
704
- onSelect?: (id: string) => void;
705
- }
706
- interface PlanCardsProps {
707
- plans: PlanCardData[];
708
- className?: string;
709
- }
710
- declare function PlanCards({ plans, className }: PlanCardsProps): React.JSX.Element;
711
-
712
- interface Backend {
713
- type: string;
714
- label: string;
715
- description?: string;
716
- /** Optional leading brand glyph (e.g. a HarnessLogo) shown in the trigger and rows. */
717
- icon?: ReactNode;
718
- }
719
- type BackendSelectorVariant = "field" | "pill";
720
- interface BackendSelectorProps {
721
- backends: Backend[];
722
- selected: string;
723
- onChange: (selected: string) => void;
724
- /**
725
- * Trigger appearance. "pill" (default) = compact inline pill — logo + short
726
- * label only. "field" = full-width form field with a label above. Either
727
- * way the long descriptor lives only as subtext inside the open dropdown,
728
- * never on the closed trigger.
729
- */
730
- variant?: BackendSelectorVariant;
731
- label?: string;
732
- placeholder?: string;
733
- className?: string;
734
- /** Extra classes merged onto the trigger itself (after the built-in defaults). */
735
- triggerClassName?: string;
736
- }
737
- declare function BackendSelector({ backends, selected, onChange, variant, label, placeholder, className, triggerClassName, }: BackendSelectorProps): React.JSX.Element;
738
-
739
- interface HarnessOption extends Backend {
740
- type: HarnessType;
741
- /**
742
- * Whether this harness can drive an interactive chat session. `false` for
743
- * shell-only backends (`cli-base`) that have no conversational agent — the
744
- * chat composer filters these out (see {@link chatCapableHarnesses}) while
745
- * scheduled/non-chat surfaces keep them.
746
- */
747
- chatCapable: boolean;
748
- }
749
- /**
750
- * Default option list with human-readable copy. Order is curated so the
751
- * recommended choice (`opencode`) appears first; `cli-base` (no agent) last.
752
- *
753
- * Descriptions name what the AGENT is, in one short line that fits the menu row
754
- * without wrapping. They deliberately do NOT mention credentials: which keys a
755
- * deployment supplies is a product decision, not a property of the harness, and
756
- * an env-var name (`ANTHROPIC_API_KEY`) is developer text that has no place in a
757
- * customer-facing menu. A product whose deployment really does require a
758
- * user-supplied key says so through `optionsOverride`.
759
- */
760
- declare const HARNESS_OPTIONS: readonly HarnessOption[];
761
- /** Harness types that can drive an interactive chat session. */
762
- declare const chatCapableHarnesses: ReadonlyArray<HarnessType>;
763
- interface HarnessPickerProps extends Omit<BackendSelectorProps, "backends" | "selected" | "onChange"> {
764
- value: HarnessType;
765
- onChange: (next: HarnessType) => void;
766
- /** Filter the available harnesses (e.g. by plan tier). Defaults to all. */
767
- available?: ReadonlyArray<HarnessType>;
768
- /** Override or extend the option metadata. Keys are HarnessType. */
769
- optionsOverride?: Partial<Record<HarnessType, Partial<Omit<HarnessOption, "type">>>>;
770
- }
771
- /**
772
- * Type-safe harness/backend selector for sandbox-backed agent products.
773
- *
774
- * Wraps the generic {@link BackendSelector} with the canonical harness list
775
- * baked in, so consumers don't have to re-declare it (or risk drifting from
776
- * the SDK enum).
777
- */
778
- declare function HarnessPicker({ value, onChange, available, optionsOverride, label, ...rest }: HarnessPickerProps): React.JSX.Element;
779
-
780
- /**
781
- * Per-harness brand glyph. `logoUrl` is a bundled lobehub data-url rendered
782
- * as a CSS mask filled with the foreground token (single-color brand mark,
783
- * theme-safe). `icon` is an honest lucide fallback for harnesses that have
784
- * no published brand mark — never an invented logo.
785
- */
786
- interface HarnessBrand {
787
- label: string;
788
- logoUrl?: string;
789
- icon?: React.ComponentType<{
790
- className?: string;
791
- }>;
792
- }
793
- declare const HARNESS_BRAND: Partial<Record<HarnessType, HarnessBrand>>;
794
- interface HarnessLogoProps {
795
- type: HarnessType;
796
- /** Chip edge length in px. Default 16 (matches the model pill glyph). */
797
- size?: number;
798
- className?: string;
799
- }
800
- /**
801
- * Brand chip for a harness, matching `BrandLogo`'s render contract in
802
- * `lib/model-brand`: a rounded `bg-background ring-1 ring-border` chip wrapping
803
- * either a foreground-filled CSS-mask of the brand SVG or a lucide fallback
804
- * glyph. Keeps harness pills visually consistent with model pills.
805
- */
806
- declare function HarnessLogo({ type, size, className }: HarnessLogoProps): React.JSX.Element;
807
-
808
- type ProductVariant = "sandbox";
809
- interface NavItem {
810
- id: string;
811
- label: string;
812
- href?: string;
813
- icon: React.ComponentType<{
814
- className?: string;
815
- }>;
816
- badge?: number;
817
- }
818
- interface DashboardUser {
819
- email: string;
820
- name?: string;
821
- tier?: string;
822
- avatarUrl?: string;
823
- }
824
- interface TopNavLink {
825
- label: string;
826
- href: string;
827
- }
828
- interface PanelConfig {
829
- mode: string;
830
- title: string;
831
- content: React.ReactNode;
832
- }
833
- interface DashboardLayoutProps {
834
- children: React.ReactNode;
835
- variant?: ProductVariant;
836
- /** Navigation items for the rail */
837
- navItems: NavItem[];
838
- /** Nav item IDs that act as panel mode switchers (others are direct links) */
839
- modeItems?: string[];
840
- /** Panel content per mode */
841
- panels?: PanelConfig[];
842
- activeNavId?: string;
843
- user?: DashboardUser | null;
844
- isLoading?: boolean;
845
- onLogout?: () => void;
846
- onSettingsClick?: () => void;
847
- settingsHref?: string;
848
- onNewSandbox?: () => void;
849
- className?: string;
850
- sidebarClassName?: string;
851
- contentClassName?: string;
852
- topNavLinks?: TopNavLink[];
853
- activeTopNavHref?: string;
854
- /** Arbitrary content rendered at the leading (left) edge of the top bar —
855
- * e.g. a workspace/team switcher — so consumers don't need a second bar. */
856
- topBarLeading?: React.ReactNode;
857
- LinkComponent?: React.ComponentType<any>;
858
- /**
859
- * Where the in-app logo links. Defaults to "/" (backward compatible);
860
- * pass an in-app path (e.g. "/dashboard") so the logo never bounces an
861
- * authenticated user back out to the public marketing homepage.
862
- */
863
- logoHref?: string;
864
- /**
865
- * @deprecated No longer wired. The redesigned {@link RailHeader} renders the
866
- * brand mark plus a dedicated panel-toggle button; the logo is no longer the
867
- * collapse control. Kept for back-compat; has no effect.
868
- */
869
- onLogoClick?: () => void;
870
- /**
871
- * @deprecated No longer wired (see {@link onLogoClick}). Has no effect.
872
- */
873
- logoAriaLabel?: string;
874
- /**
875
- * Let the icon rail expand to a labeled rail. When true, the rail logo
876
- * toggles between icon-only and labeled instead of navigating.
877
- */
878
- labeledRail?: boolean;
879
- /**
880
- * Initial rail-collapsed state when `labeledRail` is set and the rail is
881
- * uncontrolled. Defaults to expanded (`false`). Pass `true` to start on the
882
- * compact icon rail — the user's choice then persists to localStorage.
883
- */
884
- defaultRailCollapsed?: boolean;
885
- footer?: React.ReactNode;
886
- defaultPanelOpen?: boolean;
887
- defaultMode?: string;
888
- /** Extra content in the rail footer (above profile avatar) */
889
- railFooter?: React.ReactNode;
890
- /** Extra dropdown items in the profile menu */
891
- profileMenuItems?: React.ReactNode;
892
- /**
893
- * When provided, the profile menu shows an Appearance section
894
- * (Light/Dark/System) driven by this host-supplied controller. Replaces the
895
- * old standalone rail theme toggle.
896
- */
897
- appearance?: AppearanceController;
898
- /** Notification data for the bell dropdown */
899
- notifications?: {
900
- items: {
901
- id: string;
902
- title: string;
903
- message: string;
904
- read: boolean;
905
- createdAt: string;
906
- }[];
907
- unreadCount: number;
908
- onMarkRead?: (id: string) => void;
909
- onMarkAllRead?: () => void;
910
- };
911
- }
912
- declare function DashboardLayout({ defaultPanelOpen, defaultMode, labeledRail, defaultRailCollapsed, ...props }: DashboardLayoutProps): React.JSX.Element;
913
-
914
- /** A sub-destination revealed inside a nav item's right-flyout. */
915
- interface SidebarLayoutFlyoutItem {
916
- id: string;
917
- label: string;
918
- icon: React.ComponentType<{
919
- className?: string;
920
- }>;
921
- href: string;
922
- prefetch?: "none" | "intent" | "render" | "viewport";
923
- }
924
- interface SidebarLayoutNavItem {
925
- id: string;
926
- label: string;
927
- icon: React.ComponentType<{
928
- className?: string;
929
- }>;
930
- /** Destination for link items. Omit when `togglesPanel` or `flyoutItems` is set. */
931
- href?: string;
932
- /** Render this item as the panel toggle instead of a link. */
933
- togglesPanel?: boolean;
934
- /**
935
- * Render this item as a right-flyout "door" fronting these sub-destinations
936
- * instead of a link. The flyout opens to the right of the rail item. Takes
937
- * precedence over `href`/`togglesPanel`.
938
- */
939
- flyoutItems?: SidebarLayoutFlyoutItem[];
940
- /** Ids of `flyoutItems` whose route is currently active (drives the door highlight). */
941
- flyoutActiveIds?: string[];
942
- /**
943
- * Give the item an emphasized "primary" pill so it stands out (e.g. a "New"
944
- * action). Ignored for `togglesPanel`/`flyoutItems`/`expandable` items.
945
- */
946
- variant?: "normal" | "primary";
947
- /**
948
- * Render as an expandable item: an inline accordion on the labeled rail, a
949
- * hover flyout on the icon-only rail. `href` (if set) navigates; the
950
- * disclosure reveals `subItems` (fixed) or `loadSubItems()` (lazy). Takes
951
- * precedence over `href`/`togglesPanel`/`flyoutItems`.
952
- */
953
- expandable?: boolean;
954
- /** Fixed sub-items for an `expandable` item (icon optional). */
955
- subItems?: RailExpandableSubItem[];
956
- /** Lazy sub-items for an `expandable` item — loaded once on first open. */
957
- loadSubItems?: () => Promise<RailExpandableSubItem[]>;
958
- /** Ids of an `expandable` item's sub-items whose route is active. */
959
- subActiveIds?: string[];
960
- /** Empty-state text for an `expandable` item that resolves to no sub-items. */
961
- emptyLabel?: string;
962
- /** Start an `expandable` item expanded on mount (labeled rail). */
963
- defaultOpen?: boolean;
964
- badge?: number;
965
- /**
966
- * React Router prefetch behavior for this link, forwarded to the underlying
967
- * `<Link prefetch>`. Omit to preserve the router's default (no prefetch).
968
- * Ignored for panel-toggle items and for `LinkComponent`s that don't support it.
969
- */
970
- prefetch?: "none" | "intent" | "render" | "viewport";
971
- }
972
- interface SidebarLayoutProps {
973
- children: React.ReactNode;
974
- /** Rail navigation, in display order. Each item is a link or the panel toggle. */
975
- navItems: SidebarLayoutNavItem[];
976
- /** Id of the active link item (drives the highlighted state). */
977
- activeId?: string;
978
- /** Content rendered inside the slide-out panel (e.g. a SessionSidebar). */
979
- panel?: React.ReactNode;
980
- /** Logo element rendered in the rail header. */
981
- logo?: React.ReactNode;
982
- /** Destination for the logo link. */
983
- logoHref?: string;
984
- /**
985
- * Content rendered in the rail header in place of the logo link — e.g. a
986
- * project/workspace switcher. Spans the header so the app's primary
987
- * orientation control sits at the top of the rail. When set, `logo`/`logoHref`
988
- * are ignored. The header keeps its `h-14` height for cross-view alignment.
989
- */
990
- railHeaderContent?: React.ReactNode;
991
- user?: SidebarUser | null;
992
- isLoading?: boolean;
993
- onLogout?: () => void;
994
- onSettingsClick?: () => void;
995
- settingsHref?: string;
996
- /** Extra items rendered before settings/logout in the profile menu. */
997
- profileMenuItems?: React.ReactNode;
998
- /**
999
- * When provided, the profile menu shows an Appearance section
1000
- * (Light/Dark/System) driven by this host-supplied controller. The host wires
1001
- * it to its own theme engine. Replaces the old standalone rail theme toggle.
1002
- */
1003
- appearance?: AppearanceController;
1004
- /**
1005
- * @deprecated No-op. The standalone rail theme toggle was replaced by the
1006
- * account-menu `appearance` control. Accepted (and ignored) for backward
1007
- * compatibility; will be removed in a future major.
1008
- */
1009
- showThemeToggle?: boolean;
1010
- /**
1011
- * @deprecated No-op. The collapse/expand control now always lives in the
1012
- * header (`RailHeader`). Accepted (and ignored) for backward compatibility;
1013
- * will be removed in a future major.
1014
- */
1015
- railCollapseToggle?: "header" | "footer";
1016
- /** Extra content in the rail footer, above the profile avatar. */
1017
- railFooter?: React.ReactNode;
1018
- LinkComponent?: React.ComponentType<any>;
1019
- /**
1020
- * Controlled panel-open state. Provide it (seeded from a server-readable
1021
- * source such as a cookie) in SSR apps so the panel survives reload without a
1022
- * hydration mismatch. Omit to let the panel persist to localStorage.
1023
- */
1024
- panelOpen?: boolean;
1025
- onPanelOpenChange?: (open: boolean) => void;
1026
- defaultPanelOpen?: boolean;
1027
- /** Hide the whole sidebar below this breakpoint (content spans full width). */
1028
- hideBelow?: "md" | "lg";
1029
- /**
1030
- * Make the rail label-capable: it renders labels beside the icons on a wider
1031
- * rail and gains a collapse/expand control that toggles between the labeled
1032
- * width and the icon-only rail (icons + hover tooltips). When omitted the rail
1033
- * is permanently icon-only with no collapse control.
1034
- */
1035
- railLabels?: boolean;
1036
- /**
1037
- * Controlled rail-collapsed state. Provide it (seeded from a server-readable
1038
- * source such as a cookie) in SSR apps so the collapsed/expanded rail survives
1039
- * reload without a hydration mismatch. Omit to let the rail persist to
1040
- * localStorage. Independent of `panelOpen` — the nav rail and the slide-out
1041
- * panel collapse separately. Only meaningful with `railLabels`.
1042
- */
1043
- railCollapsed?: boolean;
1044
- onRailCollapsedChange?: (collapsed: boolean) => void;
1045
- /** Initial rail-collapsed state when uncontrolled (default: expanded). */
1046
- defaultRailCollapsed?: boolean;
1047
- /**
1048
- * Close the panel when a link nav item is clicked. Useful when the panel is
1049
- * contextual to one section (e.g. a chat thread list) rather than a global
1050
- * dock. Selecting items inside the panel itself does not trigger this.
1051
- */
1052
- closePanelOnNavigate?: boolean;
1053
- className?: string;
1054
- sidebarClassName?: string;
1055
- /** Class for the `<main>` content region (e.g. `flex h-screen ... overflow-hidden`). */
1056
- contentClassName?: string;
1057
- }
1058
- /**
1059
- * App shell built on the sidebar rail + slide-out panel, without a top nav bar.
1060
- * Apps supply nav items, an optional panel, and profile/branding props; the
1061
- * standard look, panel docking, content-margin coordination, and responsive
1062
- * hide all live here. Pair `panelOpen`/`onPanelOpenChange` with a cookie for
1063
- * SSR-safe persistence.
1064
- */
1065
- declare function SidebarLayout({ panelOpen, onPanelOpenChange, defaultPanelOpen, railCollapsed, onRailCollapsedChange, defaultRailCollapsed, ...props }: SidebarLayoutProps): React.JSX.Element;
1066
-
1067
- interface Profile {
1068
- id: string;
1069
- name: string;
1070
- description?: string;
1071
- is_builtin?: boolean;
1072
- extends?: string;
1073
- model?: string;
1074
- metrics?: {
1075
- total_runs: number;
1076
- success_rate: number;
1077
- avg_duration_ms: number;
1078
- };
1079
- }
1080
- interface ProfileSelectorProps {
1081
- profiles: Profile[];
1082
- selectedId?: string | null;
1083
- onSelect: (profile: Profile | null) => void;
1084
- onCreateClick?: () => void;
1085
- onManageClick?: () => void;
1086
- label?: string;
1087
- placeholder?: string;
1088
- showMetrics?: boolean;
1089
- className?: string;
1090
- }
1091
- declare function ProfileSelector({ profiles, selectedId, onSelect, onCreateClick, onManageClick, label, placeholder, showMetrics, className, }: ProfileSelectorProps): React.JSX.Element;
1092
- /**
1093
- * Profile performance comparison card.
1094
- * Shows metrics from multiple profiles side by side.
1095
- */
1096
- interface ProfileComparisonProps {
1097
- profiles: Profile[];
1098
- className?: string;
1099
- }
1100
- declare function ProfileComparison({ profiles, className, }: ProfileComparisonProps): React.JSX.Element | null;
1101
-
1102
- interface MetricChartPoint {
1103
- /** Wall-clock ms. */
1104
- at: number;
1105
- /** Null renders a gap in the series, never a zero. */
1106
- value: number | null;
1107
- }
1108
- type MetricChartTone = "primary" | "success" | "warning" | "danger";
1109
- interface MetricAreaChartProps {
1110
- points: MetricChartPoint[];
1111
- label: string;
1112
- /** Formats the current value and y-axis bounds (e.g. percent, bytes). */
1113
- formatValue: (value: number) => string;
1114
- /**
1115
- * Fixed y-axis maximum (100 for percents, memory total for bytes).
1116
- * Omitted = auto-scale to the observed maximum with 10% headroom.
1117
- */
1118
- maxValue?: number;
1119
- /** Secondary line under the current value (e.g. "of 8 GiB"). */
1120
- detail?: React.ReactNode;
1121
- tone?: MetricChartTone;
1122
- /** Plot height in px. Defaults to 96. */
1123
- height?: number;
1124
- /** Shown instead of the plot while no point has a value yet. */
1125
- emptyState?: React.ReactNode;
1126
- className?: string;
1127
- }
1128
- /**
1129
- * Lightweight live time-series panel (Prometheus/Grafana idiom): big
1130
- * current value, area chart of the rolling window, dashed gridlines.
1131
- * Pure SVG — no chart dependency. Null samples render as gaps.
1132
- */
1133
- declare function MetricAreaChart({ points, label, formatValue, maxValue, detail, tone, height, emptyState, className, }: MetricAreaChartProps): React.JSX.Element;
1134
-
1135
- type VariantStatus = "pending" | "running" | "completed" | "failed" | "cancelled";
1136
- type VariantOutcome = "pending_review" | "accepted" | "rejected" | "merged_with_conflicts" | "expired";
1137
- interface Variant {
1138
- id: string;
1139
- label: string;
1140
- sublabel?: string;
1141
- status: VariantStatus;
1142
- outcome?: VariantOutcome;
1143
- durationMs?: number;
1144
- error?: string;
1145
- summary?: string;
1146
- /** Link to view variant details (e.g., chat UI) */
1147
- detailsUrl?: string;
1148
- }
1149
- interface VariantListProps {
1150
- variants: Variant[];
1151
- selectedId?: string | null;
1152
- onSelect?: (id: string) => void;
1153
- onAccept?: (id: string) => void;
1154
- onReject?: (id: string) => void;
1155
- isActioning?: string | null;
1156
- className?: string;
1157
- }
1158
- declare function VariantList({ variants, selectedId, onSelect, onAccept, onReject, isActioning, className, }: VariantListProps): React.JSX.Element;
1159
-
1160
- interface SystemLogsViewerProps {
1161
- apiUrl: string;
1162
- token: string;
1163
- className?: string;
1164
- }
1165
- declare function SystemLogsViewer({ apiUrl, token, className }: SystemLogsViewerProps): React__default.JSX.Element;
1166
-
1167
- interface UsageSummaryData {
1168
- computeHours: number;
1169
- activeSessions: number;
1170
- messagesSent: number;
1171
- estimatedCost: number;
1172
- }
1173
- interface UsageSummaryProps {
1174
- data: UsageSummaryData | null;
1175
- loading?: boolean;
1176
- className?: string;
1177
- }
1178
- declare function UsageSummary({ data, loading, className }: UsageSummaryProps): React.JSX.Element;
1179
-
1180
- interface GitStatusData {
1181
- branch: string;
1182
- isDirty: boolean;
1183
- ahead: number;
1184
- behind: number;
1185
- staged: string[];
1186
- modified: string[];
1187
- untracked: string[];
1188
- }
1189
- interface GitCommitData {
1190
- shortSha: string;
1191
- message: string;
1192
- author: string;
1193
- date: string;
1194
- }
1195
- interface GitPanelProps {
1196
- status: GitStatusData | null;
1197
- log: GitCommitData[];
1198
- loading?: boolean;
1199
- onRefresh?: () => void;
1200
- className?: string;
1201
- }
1202
- declare function GitPanel({ status, log, loading, onRefresh, className }: GitPanelProps): React.JSX.Element;
1203
-
1204
- interface ProcessInfo {
1205
- pid: number;
1206
- command: string;
1207
- running: boolean;
1208
- exitCode?: number;
1209
- startedAt?: string;
1210
- cwd?: string;
1211
- }
1212
- interface ProcessListProps {
1213
- processes: ProcessInfo[];
1214
- onSpawn: (command: string) => void;
1215
- onKill: (pid: number) => void;
1216
- loading?: boolean;
1217
- className?: string;
1218
- }
1219
- declare function ProcessList({ processes, onSpawn, onKill, loading, className }: ProcessListProps): React.JSX.Element;
1220
-
1221
- interface NetworkConfigData {
1222
- blockOutbound: boolean;
1223
- allowList: string[];
1224
- }
1225
- interface NetworkConfigProps {
1226
- config: NetworkConfigData | null;
1227
- onUpdate: (config: Partial<NetworkConfigData>) => void;
1228
- loading?: boolean;
1229
- className?: string;
1230
- }
1231
- declare function NetworkConfig({ config, onUpdate, loading, className }: NetworkConfigProps): React.JSX.Element;
1232
-
1233
- interface BackendStatusData {
1234
- running: boolean;
1235
- model?: string;
1236
- provider?: string;
1237
- uptime?: number;
1238
- }
1239
- interface McpServer {
1240
- name: string;
1241
- command: string;
1242
- args?: string[];
1243
- status?: "running" | "stopped" | "error";
1244
- }
1245
- interface BackendConfigProps {
1246
- status: BackendStatusData | null;
1247
- mcpServers: McpServer[];
1248
- onAddMcp: (server: {
1249
- name: string;
1250
- command: string;
1251
- args?: string[];
1252
- }) => void;
1253
- onRemoveMcp: (name: string) => void;
1254
- /** Render a restart action only when the host has a real restart operation. */
1255
- onRestart?: () => void;
1256
- loading?: boolean;
1257
- className?: string;
1258
- }
1259
- declare function BackendConfig({ status, mcpServers, onAddMcp, onRemoveMcp, onRestart, loading, className, }: BackendConfigProps): React.JSX.Element;
1260
-
1261
- interface SnapshotInfo {
1262
- id: string;
1263
- createdAt: string;
1264
- sizeBytes?: number;
1265
- tags?: string[];
1266
- }
1267
- interface SnapshotListProps {
1268
- snapshots: SnapshotInfo[];
1269
- onCreate: (tags?: string[]) => void;
1270
- onRestore: (snapshotId: string) => void;
1271
- onSaveAsTemplate?: (snapshotId: string) => void;
1272
- loading?: boolean;
1273
- className?: string;
1274
- }
1275
- declare function SnapshotList({ snapshots, onCreate, onRestore, onSaveAsTemplate, loading, className }: SnapshotListProps): React.JSX.Element;
1276
-
1277
- interface PromoBannerProps {
1278
- title: string;
1279
- description: string;
1280
- buttonLabel: string;
1281
- href?: string;
1282
- onClick?: () => void;
1283
- icon?: React.ReactNode;
1284
- disabled?: boolean;
1285
- className?: string;
1286
- }
1287
- declare function PromoBanner({ title, description, buttonLabel, href, onClick, icon, disabled, className, }: PromoBannerProps): React.JSX.Element;
1288
-
1289
- interface InfoPanelProps {
1290
- label: string;
1291
- title: string;
1292
- description: string;
1293
- className?: string;
1294
- }
1295
- declare function InfoPanel({ label, title, description, className }: InfoPanelProps): React.JSX.Element;
1296
-
1297
- 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 };
1
+ import { $ as HARNESS_BRAND, $t as useSidebar, A as Variant, An as SidebarProps, At as ActivityItem, B as ProfileComparison, Bn as ThemeMode, Bt as InsufficientBalance, C as GitPanelProps, Cn as SidebarContentProps, Ct as SandboxCardData, D as UsageSummaryProps, Dn as SidebarPanelHeader, Dt as canAdminSandbox, E as UsageSummaryData, En as SidebarPanelContentProps, Et as TeamRole, F as MetricAreaChart, Fn as SidebarRailHeaderProps, Ft as ResourceMeterProps, G as SidebarLayoutFlyoutItem, Gt as CreditBalanceProps, H as ProfileSelector, Ht as OutOfCreditsModalProps, I as MetricAreaChartProps, In as SidebarRailNav, It as ClusterStatusBar, J as DashboardLayout, Jt as SIDEBAR_RAIL_LABELED_WIDTH, K as SidebarLayoutNavItem, Kt as SIDEBAR_MOBILE_WIDTH, L as MetricChartPoint, Ln as SidebarRailNavProps, Lt as ClusterStatusBarProps, M as VariantListProps, Mn as SidebarRailFooter, Mt as ResourceSnapshotItem, N as VariantOutcome, Nn as SidebarRailFooterProps, Nt as ResourceSnapshotProps, O as SystemLogsViewer, On as SidebarPanelHeaderProps, Ot as ActivityFeed, P as VariantStatus, Pn as SidebarRailHeader, Pt as ResourceMeter, Q as ProductVariant, Qt as SidebarProviderProps, R as MetricChartTone, Rn as SidebarRailProps, Rt as ClusterStatusItem, S as GitPanel, Sn as SidebarContent, St as SandboxCard, T as UsageSummary, Tn as SidebarPanelContent, Tt as SandboxStatus, U as ProfileSelectorProps, Ut as parseInsufficientBalance, V as ProfileComparisonProps, Vt as OutOfCreditsModal, W as SidebarLayout, Wt as CreditBalance, X as DashboardUser, Xt as SIDEBAR_TOTAL_WIDTH, Y as DashboardLayoutProps, Yt as SIDEBAR_RAIL_WIDTH, Z as NavItem, Zt as SidebarProvider, _ as ProcessListProps, _n as RailModeButtonProps, _t as InvoiceTableProps, a as SnapshotInfo, an as RailButton, at as HarnessPickerProps, b as PortsListProps, bn as RailThemeToggle, bt as NewSandboxCard, c as BackendConfig, cn as RailCollapseToggleProps, ct as Backend, d as McpServer, dn as RailExpandableSubItem, dt as PlanCardData, en as RailTooltip, et as HarnessBrand, f as NetworkConfig, fn as RailFlyout, ft as PlanCards, g as ProcessList, gn as RailModeButton, gt as InvoiceTable, h as ProcessInfo, hn as RailHeaderProps, ht as Invoice, i as PromoBannerProps, in as ProfileAvatarProps, it as HarnessPicker, j as VariantList, jn as SidebarRail, jt as ResourceSnapshot, k as SystemLogsViewerProps, kn as SidebarPanelProps, kt as ActivityFeedProps, l as BackendConfigProps, ln as RailExpandable, lt as BackendSelector, m as NetworkConfigProps, mn as RailHeader, mt as PlanFeature, n as InfoPanelProps, nn as AppearanceController, nt as HarnessLogoProps, o as SnapshotList, on as RailButtonProps, ot as HarnessType, p as NetworkConfigData, pn as RailFlyoutProps, pt as PlanCardsProps, q as SidebarLayoutProps, qt as SIDEBAR_PANEL_WIDTH, r as PromoBanner, rn as ProfileAvatar, rt as HARNESS_OPTIONS, s as SnapshotListProps, sn as RailCollapseToggle, st as chatCapableHarnesses, t as InfoPanel, tn as RailTooltipProps, tt as HarnessLogo, u as BackendStatusData, un as RailExpandableProps, ut as BackendSelectorProps, v as ExposedPort, vn as RailSeparator, vt as SandboxTable, w as GitStatusData, wn as SidebarPanel, wt as SandboxCardProps, x as GitCommitData, xn as Sidebar, xt as NewSandboxCardProps, y as PortsList, yn as RailSeparatorProps, yt as SandboxTableProps, z as Profile, zn as SidebarUser, zt as INSUFFICIENT_BALANCE_CODE } from "./index-DPePq7c8.js";
2
+ import { a as modelBrandFor, i as canonicalModelId, n as ModelBrandStack, r as ModelInfo, t as ModelBrandIdentity } from "./model-brand-B9A4H9pJ.js";
3
+ import { a as UsageChartProps, c as PricingPageProps, d as BillingBalance, f as BillingDashboard, h as BillingUsage, i as UsageChart, l as PricingTier, m as BillingSubscription, n as TemplateCardData, o as UsageDataPoint, p as BillingDashboardProps, r as TemplateCardProps, s as PricingPage, t as TemplateCard, u as formatPrice } from "./template-card-L-4gmjx2.js";
4
+ export { ActivityFeed, type ActivityFeedProps, type ActivityItem, type AppearanceController, type Backend, BackendConfig, type BackendConfigProps, BackendSelector, type BackendSelectorProps, type BackendStatusData, type BillingBalance, BillingDashboard, type BillingDashboardProps, type BillingSubscription, type BillingUsage, ClusterStatusBar, type ClusterStatusBarProps, type ClusterStatusItem, CreditBalance, type CreditBalanceProps, DashboardLayout, type DashboardLayoutProps, type Profile as DashboardProfile, type SnapshotInfo as DashboardSnapshotInfo, type DashboardUser, type ExposedPort, type GitCommitData, GitPanel, type GitPanelProps, type GitStatusData, HARNESS_BRAND, HARNESS_OPTIONS, type HarnessBrand, HarnessLogo, type HarnessLogoProps, HarnessPicker, type HarnessPickerProps, type HarnessType, INSUFFICIENT_BALANCE_CODE, InfoPanel, type InfoPanelProps, type InsufficientBalance, type Invoice, InvoiceTable, type InvoiceTableProps, type McpServer, MetricAreaChart, type MetricAreaChartProps, type MetricChartPoint, type MetricChartTone, type ModelBrandIdentity, ModelBrandStack, type ModelInfo, type NavItem, NetworkConfig, type NetworkConfigData, type NetworkConfigProps, NewSandboxCard, type NewSandboxCardProps, OutOfCreditsModal, type OutOfCreditsModalProps, type PlanCardData, PlanCards, type PlanCardsProps, type PlanFeature, PortsList, type PortsListProps, PricingPage, type PricingPageProps, type PricingTier, 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, TemplateCard, type TemplateCardData, type TemplateCardProps, type ThemeMode, UsageChart, type UsageChartProps, type UsageDataPoint, UsageSummary, type UsageSummaryData, type UsageSummaryProps, type Variant, VariantList, type VariantListProps, type VariantOutcome, type VariantStatus, canAdminSandbox, canonicalModelId, chatCapableHarnesses, formatPrice, modelBrandFor, parseInsufficientBalance, useSidebar };