@tangle-network/sandbox-ui 0.22.1 → 0.23.1
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.
- package/dist/assets.d.ts +276 -0
- package/dist/assets.js +946 -0
- package/dist/{chunk-7X2DHDQ6.js → chunk-CB3KBKYN.js} +546 -425
- package/dist/dashboard.d.ts +95 -4
- package/dist/dashboard.js +3 -1
- package/dist/globals.css +102 -0
- package/dist/index.d.ts +1 -1
- package/dist/index.js +3 -1
- package/dist/styles.css +102 -0
- package/package.json +5 -1
package/dist/dashboard.d.ts
CHANGED
|
@@ -57,8 +57,17 @@ interface RailButtonProps {
|
|
|
57
57
|
className?: string;
|
|
58
58
|
/** Show label text next to icon (for mobile drawer) */
|
|
59
59
|
showLabel?: boolean;
|
|
60
|
+
/**
|
|
61
|
+
* Render the rail-button styling onto a single child element (e.g. a router
|
|
62
|
+
* `<Link>`) instead of an inner `<button>`. The child receives the button
|
|
63
|
+
* classes, `title`, and the icon/label/badge as its content — so navigation
|
|
64
|
+
* items stay real anchors (keyboard, cmd-click, prefetch) without copying the
|
|
65
|
+
* class recipe or nesting `<a><button>`.
|
|
66
|
+
*/
|
|
67
|
+
asChild?: boolean;
|
|
68
|
+
children?: React.ReactNode;
|
|
60
69
|
}
|
|
61
|
-
declare function RailButton({ icon: Icon, label, isActive, badge, onClick, className, showLabel }: RailButtonProps): react_jsx_runtime.JSX.Element;
|
|
70
|
+
declare function RailButton({ icon: Icon, label, isActive, badge, onClick, className, showLabel, asChild, children }: RailButtonProps): react_jsx_runtime.JSX.Element;
|
|
62
71
|
interface RailModeButtonProps {
|
|
63
72
|
mode: string;
|
|
64
73
|
icon: React.ComponentType<{
|
|
@@ -101,9 +110,11 @@ interface ProfileAvatarProps {
|
|
|
101
110
|
/** Extra dropdown items rendered before settings/logout */
|
|
102
111
|
children?: React.ReactNode;
|
|
103
112
|
className?: string;
|
|
113
|
+
/** Show name/email beside the avatar (for a labeled rail) instead of an icon-only avatar button. */
|
|
114
|
+
showDetails?: boolean;
|
|
104
115
|
LinkComponent?: React.ComponentType<any>;
|
|
105
116
|
}
|
|
106
|
-
declare function ProfileAvatar({ user, isLoading, onLogout, onSettingsClick, settingsHref, children, className, LinkComponent, }: ProfileAvatarProps): react_jsx_runtime.JSX.Element;
|
|
117
|
+
declare function ProfileAvatar({ user, isLoading, onLogout, onSettingsClick, settingsHref, children, className, showDetails, LinkComponent, }: ProfileAvatarProps): react_jsx_runtime.JSX.Element;
|
|
107
118
|
|
|
108
119
|
/** Width constants (px) matching blueprint-agent layout */
|
|
109
120
|
declare const SIDEBAR_RAIL_WIDTH = 64;
|
|
@@ -132,14 +143,28 @@ interface SidebarContextValue {
|
|
|
132
143
|
contentMargin: number;
|
|
133
144
|
/** Whether there are panels at all */
|
|
134
145
|
hasPanels: boolean;
|
|
146
|
+
/** Rail width in px — 64 for the icon-only rail, wider when labels show */
|
|
147
|
+
railWidth: number;
|
|
135
148
|
}
|
|
136
149
|
interface SidebarProviderProps {
|
|
137
150
|
defaultPanelOpen?: boolean;
|
|
138
151
|
defaultMode?: string;
|
|
139
152
|
hasPanels?: boolean;
|
|
153
|
+
/** Rail width in px. Defaults to the 64px icon-only rail. */
|
|
154
|
+
railWidth?: number;
|
|
155
|
+
/**
|
|
156
|
+
* Controlled panel-open state. When provided, the provider treats panel
|
|
157
|
+
* visibility as controlled: it never reads or writes localStorage and
|
|
158
|
+
* reports changes through {@link onPanelOpenChange} instead. Use this in
|
|
159
|
+
* server-rendered apps — seed it from a value the server also has (e.g. a
|
|
160
|
+
* cookie) so the SSR markup matches the first client render. The localStorage
|
|
161
|
+
* read in the uncontrolled path is what diverges from SSR and breaks hydration.
|
|
162
|
+
*/
|
|
163
|
+
panelOpen?: boolean;
|
|
164
|
+
onPanelOpenChange?: (open: boolean) => void;
|
|
140
165
|
children: React.ReactNode;
|
|
141
166
|
}
|
|
142
|
-
declare function SidebarProvider({ defaultPanelOpen, defaultMode, hasPanels, children, }: SidebarProviderProps): react_jsx_runtime.JSX.Element;
|
|
167
|
+
declare function SidebarProvider({ defaultPanelOpen, defaultMode, hasPanels, railWidth, panelOpen: controlledPanelOpen, onPanelOpenChange, children, }: SidebarProviderProps): react_jsx_runtime.JSX.Element;
|
|
143
168
|
declare function useSidebar(): SidebarContextValue;
|
|
144
169
|
|
|
145
170
|
interface CreditBalanceProps {
|
|
@@ -479,6 +504,72 @@ interface DashboardLayoutProps {
|
|
|
479
504
|
}
|
|
480
505
|
declare function DashboardLayout({ defaultPanelOpen, defaultMode, ...props }: DashboardLayoutProps): react_jsx_runtime.JSX.Element;
|
|
481
506
|
|
|
507
|
+
interface SidebarLayoutNavItem {
|
|
508
|
+
id: string;
|
|
509
|
+
label: string;
|
|
510
|
+
icon: React.ComponentType<{
|
|
511
|
+
className?: string;
|
|
512
|
+
}>;
|
|
513
|
+
/** Destination for link items. Omit when `togglesPanel` is set. */
|
|
514
|
+
href?: string;
|
|
515
|
+
/** Render this item as the panel toggle instead of a link. */
|
|
516
|
+
togglesPanel?: boolean;
|
|
517
|
+
badge?: number;
|
|
518
|
+
}
|
|
519
|
+
interface SidebarLayoutProps {
|
|
520
|
+
children: React.ReactNode;
|
|
521
|
+
/** Rail navigation, in display order. Each item is a link or the panel toggle. */
|
|
522
|
+
navItems: SidebarLayoutNavItem[];
|
|
523
|
+
/** Id of the active link item (drives the highlighted state). */
|
|
524
|
+
activeId?: string;
|
|
525
|
+
/** Content rendered inside the slide-out panel (e.g. a SessionSidebar). */
|
|
526
|
+
panel?: React.ReactNode;
|
|
527
|
+
/** Logo element rendered in the rail header. */
|
|
528
|
+
logo?: React.ReactNode;
|
|
529
|
+
/** Destination for the logo link. */
|
|
530
|
+
logoHref?: string;
|
|
531
|
+
user?: SidebarUser | null;
|
|
532
|
+
isLoading?: boolean;
|
|
533
|
+
onLogout?: () => void;
|
|
534
|
+
onSettingsClick?: () => void;
|
|
535
|
+
settingsHref?: string;
|
|
536
|
+
/** Extra items rendered before settings/logout in the profile menu. */
|
|
537
|
+
profileMenuItems?: React.ReactNode;
|
|
538
|
+
/** Extra content in the rail footer, above the profile avatar. */
|
|
539
|
+
railFooter?: React.ReactNode;
|
|
540
|
+
LinkComponent?: React.ComponentType<any>;
|
|
541
|
+
/**
|
|
542
|
+
* Controlled panel-open state. Provide it (seeded from a server-readable
|
|
543
|
+
* source such as a cookie) in SSR apps so the panel survives reload without a
|
|
544
|
+
* hydration mismatch. Omit to let the panel persist to localStorage.
|
|
545
|
+
*/
|
|
546
|
+
panelOpen?: boolean;
|
|
547
|
+
onPanelOpenChange?: (open: boolean) => void;
|
|
548
|
+
defaultPanelOpen?: boolean;
|
|
549
|
+
/** Hide the whole sidebar below this breakpoint (content spans full width). */
|
|
550
|
+
hideBelow?: "md" | "lg";
|
|
551
|
+
/** Show text labels beside the rail icons on a wider rail (vs. icon-only with hover tooltips). */
|
|
552
|
+
railLabels?: boolean;
|
|
553
|
+
/**
|
|
554
|
+
* Close the panel when a link nav item is clicked. Useful when the panel is
|
|
555
|
+
* contextual to one section (e.g. a chat thread list) rather than a global
|
|
556
|
+
* dock. Selecting items inside the panel itself does not trigger this.
|
|
557
|
+
*/
|
|
558
|
+
closePanelOnNavigate?: boolean;
|
|
559
|
+
className?: string;
|
|
560
|
+
sidebarClassName?: string;
|
|
561
|
+
/** Class for the `<main>` content region (e.g. `flex h-screen ... overflow-hidden`). */
|
|
562
|
+
contentClassName?: string;
|
|
563
|
+
}
|
|
564
|
+
/**
|
|
565
|
+
* App shell built on the sidebar rail + slide-out panel, without a top nav bar.
|
|
566
|
+
* Apps supply nav items, an optional panel, and profile/branding props; the
|
|
567
|
+
* standard look, panel docking, content-margin coordination, and responsive
|
|
568
|
+
* hide all live here. Pair `panelOpen`/`onPanelOpenChange` with a cookie for
|
|
569
|
+
* SSR-safe persistence.
|
|
570
|
+
*/
|
|
571
|
+
declare function SidebarLayout({ panelOpen, onPanelOpenChange, defaultPanelOpen, ...props }: SidebarLayoutProps): react_jsx_runtime.JSX.Element;
|
|
572
|
+
|
|
482
573
|
interface Profile {
|
|
483
574
|
id: string;
|
|
484
575
|
name: string;
|
|
@@ -722,4 +813,4 @@ interface InfoPanelProps {
|
|
|
722
813
|
}
|
|
723
814
|
declare function InfoPanel({ label, title, description, className }: InfoPanelProps): react_jsx_runtime.JSX.Element;
|
|
724
815
|
|
|
725
|
-
export { ActivityFeed, type ActivityFeedProps, type ActivityItem, BackendConfig, type BackendConfigProps, type BackendStatusData, 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, 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, PortsList, type PortsListProps, type ProcessInfo, ProcessList, type ProcessListProps, type ProductVariant, ProfileAvatar, type ProfileAvatarProps, ProfileComparison, type ProfileComparisonProps, ProfileSelector, type ProfileSelectorProps, PromoBanner, type PromoBannerProps, RailButton, type RailButtonProps, RailModeButton, type RailModeButtonProps, RailSeparator, type RailSeparatorProps, ResourceMeter, type ResourceMeterProps, ResourceSnapshot, type ResourceSnapshotItem, type ResourceSnapshotProps, SIDEBAR_MOBILE_WIDTH, SIDEBAR_PANEL_WIDTH, SIDEBAR_RAIL_WIDTH, SIDEBAR_TOTAL_WIDTH, SandboxCard, type SandboxCardData, type SandboxCardProps, type SandboxStatus, SandboxTable, type SandboxTableProps, Sidebar, SidebarContent, type SidebarContentProps, 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, UsageSummary, type UsageSummaryData, type UsageSummaryProps, type Variant, VariantList, type VariantListProps, type VariantOutcome, type VariantStatus, canAdminSandbox, parseInsufficientBalance, useSidebar };
|
|
816
|
+
export { ActivityFeed, type ActivityFeedProps, type ActivityItem, BackendConfig, type BackendConfigProps, type BackendStatusData, 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, 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, PortsList, type PortsListProps, type ProcessInfo, ProcessList, type ProcessListProps, type ProductVariant, ProfileAvatar, type ProfileAvatarProps, ProfileComparison, type ProfileComparisonProps, ProfileSelector, type ProfileSelectorProps, PromoBanner, type PromoBannerProps, RailButton, type RailButtonProps, RailModeButton, type RailModeButtonProps, RailSeparator, type RailSeparatorProps, ResourceMeter, type ResourceMeterProps, ResourceSnapshot, type ResourceSnapshotItem, type ResourceSnapshotProps, SIDEBAR_MOBILE_WIDTH, SIDEBAR_PANEL_WIDTH, SIDEBAR_RAIL_WIDTH, SIDEBAR_TOTAL_WIDTH, SandboxCard, type SandboxCardData, type SandboxCardProps, type SandboxStatus, SandboxTable, type SandboxTableProps, Sidebar, SidebarContent, type SidebarContentProps, SidebarLayout, 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, UsageSummary, type UsageSummaryData, type UsageSummaryProps, type Variant, VariantList, type VariantListProps, type VariantOutcome, type VariantStatus, canAdminSandbox, parseInsufficientBalance, useSidebar };
|
package/dist/dashboard.js
CHANGED
|
@@ -31,6 +31,7 @@ import {
|
|
|
31
31
|
SandboxTable,
|
|
32
32
|
Sidebar,
|
|
33
33
|
SidebarContent,
|
|
34
|
+
SidebarLayout,
|
|
34
35
|
SidebarPanel,
|
|
35
36
|
SidebarPanelContent,
|
|
36
37
|
SidebarPanelHeader,
|
|
@@ -46,7 +47,7 @@ import {
|
|
|
46
47
|
canAdminSandbox,
|
|
47
48
|
parseInsufficientBalance,
|
|
48
49
|
useSidebar
|
|
49
|
-
} from "./chunk-
|
|
50
|
+
} from "./chunk-CB3KBKYN.js";
|
|
50
51
|
import {
|
|
51
52
|
BillingDashboard,
|
|
52
53
|
InfoPanel,
|
|
@@ -108,6 +109,7 @@ export {
|
|
|
108
109
|
SandboxTable,
|
|
109
110
|
Sidebar,
|
|
110
111
|
SidebarContent,
|
|
112
|
+
SidebarLayout,
|
|
111
113
|
SidebarPanel,
|
|
112
114
|
SidebarPanelContent,
|
|
113
115
|
SidebarPanelHeader,
|
package/dist/globals.css
CHANGED
|
@@ -365,6 +365,9 @@
|
|
|
365
365
|
.bottom-0 {
|
|
366
366
|
bottom: calc(var(--spacing) * 0);
|
|
367
367
|
}
|
|
368
|
+
.bottom-2 {
|
|
369
|
+
bottom: calc(var(--spacing) * 2);
|
|
370
|
+
}
|
|
368
371
|
.bottom-4 {
|
|
369
372
|
bottom: calc(var(--spacing) * 4);
|
|
370
373
|
}
|
|
@@ -380,12 +383,18 @@
|
|
|
380
383
|
.left-0\.5 {
|
|
381
384
|
left: calc(var(--spacing) * 0.5);
|
|
382
385
|
}
|
|
386
|
+
.left-1 {
|
|
387
|
+
left: calc(var(--spacing) * 1);
|
|
388
|
+
}
|
|
383
389
|
.left-1\/2 {
|
|
384
390
|
left: calc(1 / 2 * 100%);
|
|
385
391
|
}
|
|
386
392
|
.left-2 {
|
|
387
393
|
left: calc(var(--spacing) * 2);
|
|
388
394
|
}
|
|
395
|
+
.left-2\.5 {
|
|
396
|
+
left: calc(var(--spacing) * 2.5);
|
|
397
|
+
}
|
|
389
398
|
.left-3 {
|
|
390
399
|
left: calc(var(--spacing) * 3);
|
|
391
400
|
}
|
|
@@ -602,6 +611,9 @@
|
|
|
602
611
|
.table {
|
|
603
612
|
display: table;
|
|
604
613
|
}
|
|
614
|
+
.aspect-\[9\/16\] {
|
|
615
|
+
aspect-ratio: 9/16;
|
|
616
|
+
}
|
|
605
617
|
.aspect-square {
|
|
606
618
|
aspect-ratio: 1 / 1;
|
|
607
619
|
}
|
|
@@ -723,6 +735,9 @@
|
|
|
723
735
|
.h-screen {
|
|
724
736
|
height: 100vh;
|
|
725
737
|
}
|
|
738
|
+
.max-h-40 {
|
|
739
|
+
max-height: calc(var(--spacing) * 40);
|
|
740
|
+
}
|
|
726
741
|
.max-h-48 {
|
|
727
742
|
max-height: calc(var(--spacing) * 48);
|
|
728
743
|
}
|
|
@@ -777,6 +792,9 @@
|
|
|
777
792
|
.min-h-\[44px\] {
|
|
778
793
|
min-height: 44px;
|
|
779
794
|
}
|
|
795
|
+
.min-h-\[60px\] {
|
|
796
|
+
min-height: 60px;
|
|
797
|
+
}
|
|
780
798
|
.min-h-\[72px\] {
|
|
781
799
|
min-height: 72px;
|
|
782
800
|
}
|
|
@@ -792,6 +810,9 @@
|
|
|
792
810
|
.min-h-\[200px\] {
|
|
793
811
|
min-height: 200px;
|
|
794
812
|
}
|
|
813
|
+
.min-h-\[300px\] {
|
|
814
|
+
min-height: 300px;
|
|
815
|
+
}
|
|
795
816
|
.min-h-full {
|
|
796
817
|
min-height: 100%;
|
|
797
818
|
}
|
|
@@ -1065,6 +1086,9 @@
|
|
|
1065
1086
|
.min-w-4 {
|
|
1066
1087
|
min-width: calc(var(--spacing) * 4);
|
|
1067
1088
|
}
|
|
1089
|
+
.min-w-40 {
|
|
1090
|
+
min-width: calc(var(--spacing) * 40);
|
|
1091
|
+
}
|
|
1068
1092
|
.min-w-\[8rem\] {
|
|
1069
1093
|
min-width: 8rem;
|
|
1070
1094
|
}
|
|
@@ -1614,6 +1638,10 @@
|
|
|
1614
1638
|
border-left-style: var(--tw-border-style);
|
|
1615
1639
|
border-left-width: 1px;
|
|
1616
1640
|
}
|
|
1641
|
+
.border-l-2 {
|
|
1642
|
+
border-left-style: var(--tw-border-style);
|
|
1643
|
+
border-left-width: 2px;
|
|
1644
|
+
}
|
|
1617
1645
|
.border-dashed {
|
|
1618
1646
|
--tw-border-style: dashed;
|
|
1619
1647
|
border-style: dashed;
|
|
@@ -1931,6 +1959,9 @@
|
|
|
1931
1959
|
background-color: color-mix(in oklab, var(--color-amber-500) 10%, transparent);
|
|
1932
1960
|
}
|
|
1933
1961
|
}
|
|
1962
|
+
.bg-black {
|
|
1963
|
+
background-color: var(--color-black);
|
|
1964
|
+
}
|
|
1934
1965
|
.bg-black\/40 {
|
|
1935
1966
|
background-color: color-mix(in srgb, #000 40%, transparent);
|
|
1936
1967
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -2039,6 +2070,12 @@
|
|
|
2039
2070
|
background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
|
|
2040
2071
|
}
|
|
2041
2072
|
}
|
|
2073
|
+
.bg-white\/40 {
|
|
2074
|
+
background-color: color-mix(in srgb, #fff 40%, transparent);
|
|
2075
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
2076
|
+
background-color: color-mix(in oklab, var(--color-white) 40%, transparent);
|
|
2077
|
+
}
|
|
2078
|
+
}
|
|
2042
2079
|
.bg-yellow-500 {
|
|
2043
2080
|
background-color: var(--color-yellow-500);
|
|
2044
2081
|
}
|
|
@@ -2078,6 +2115,9 @@
|
|
|
2078
2115
|
.object-contain {
|
|
2079
2116
|
object-fit: contain;
|
|
2080
2117
|
}
|
|
2118
|
+
.object-cover {
|
|
2119
|
+
object-fit: cover;
|
|
2120
|
+
}
|
|
2081
2121
|
.p-0 {
|
|
2082
2122
|
padding: calc(var(--spacing) * 0);
|
|
2083
2123
|
}
|
|
@@ -2270,6 +2310,9 @@
|
|
|
2270
2310
|
.pt-16 {
|
|
2271
2311
|
padding-top: calc(var(--spacing) * 16);
|
|
2272
2312
|
}
|
|
2313
|
+
.pr-1 {
|
|
2314
|
+
padding-right: calc(var(--spacing) * 1);
|
|
2315
|
+
}
|
|
2273
2316
|
.pr-2 {
|
|
2274
2317
|
padding-right: calc(var(--spacing) * 2);
|
|
2275
2318
|
}
|
|
@@ -2309,6 +2352,9 @@
|
|
|
2309
2352
|
.pl-2 {
|
|
2310
2353
|
padding-left: calc(var(--spacing) * 2);
|
|
2311
2354
|
}
|
|
2355
|
+
.pl-3 {
|
|
2356
|
+
padding-left: calc(var(--spacing) * 3);
|
|
2357
|
+
}
|
|
2312
2358
|
.pl-4 {
|
|
2313
2359
|
padding-left: calc(var(--spacing) * 4);
|
|
2314
2360
|
}
|
|
@@ -2678,6 +2724,9 @@
|
|
|
2678
2724
|
.text-blue-400 {
|
|
2679
2725
|
color: var(--color-blue-400);
|
|
2680
2726
|
}
|
|
2727
|
+
.text-blue-500 {
|
|
2728
|
+
color: var(--color-blue-500);
|
|
2729
|
+
}
|
|
2681
2730
|
.text-emerald-400 {
|
|
2682
2731
|
color: var(--color-emerald-400);
|
|
2683
2732
|
}
|
|
@@ -2735,6 +2784,9 @@
|
|
|
2735
2784
|
.italic {
|
|
2736
2785
|
font-style: italic;
|
|
2737
2786
|
}
|
|
2787
|
+
.not-italic {
|
|
2788
|
+
font-style: normal;
|
|
2789
|
+
}
|
|
2738
2790
|
.tabular-nums {
|
|
2739
2791
|
--tw-numeric-spacing: tabular-nums;
|
|
2740
2792
|
font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
|
|
@@ -2758,6 +2810,9 @@
|
|
|
2758
2810
|
.opacity-30 {
|
|
2759
2811
|
opacity: 30%;
|
|
2760
2812
|
}
|
|
2813
|
+
.opacity-40 {
|
|
2814
|
+
opacity: 40%;
|
|
2815
|
+
}
|
|
2761
2816
|
.opacity-50 {
|
|
2762
2817
|
opacity: 50%;
|
|
2763
2818
|
}
|
|
@@ -3204,6 +3259,16 @@
|
|
|
3204
3259
|
}
|
|
3205
3260
|
}
|
|
3206
3261
|
}
|
|
3262
|
+
.hover\:bg-black\/60 {
|
|
3263
|
+
&:hover {
|
|
3264
|
+
@media (hover: hover) {
|
|
3265
|
+
background-color: color-mix(in srgb, #000 60%, transparent);
|
|
3266
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
3267
|
+
background-color: color-mix(in oklab, var(--color-black) 60%, transparent);
|
|
3268
|
+
}
|
|
3269
|
+
}
|
|
3270
|
+
}
|
|
3271
|
+
}
|
|
3207
3272
|
.hover\:bg-blue-600\/30 {
|
|
3208
3273
|
&:hover {
|
|
3209
3274
|
@media (hover: hover) {
|
|
@@ -3224,6 +3289,16 @@
|
|
|
3224
3289
|
}
|
|
3225
3290
|
}
|
|
3226
3291
|
}
|
|
3292
|
+
.hover\:bg-green-600\/5 {
|
|
3293
|
+
&:hover {
|
|
3294
|
+
@media (hover: hover) {
|
|
3295
|
+
background-color: color-mix(in srgb, oklch(62.7% 0.194 149.214) 5%, transparent);
|
|
3296
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
3297
|
+
background-color: color-mix(in oklab, var(--color-green-600) 5%, transparent);
|
|
3298
|
+
}
|
|
3299
|
+
}
|
|
3300
|
+
}
|
|
3301
|
+
}
|
|
3227
3302
|
.hover\:bg-green-600\/30 {
|
|
3228
3303
|
&:hover {
|
|
3229
3304
|
@media (hover: hover) {
|
|
@@ -3282,6 +3357,13 @@
|
|
|
3282
3357
|
}
|
|
3283
3358
|
}
|
|
3284
3359
|
}
|
|
3360
|
+
.hover\:text-green-600 {
|
|
3361
|
+
&:hover {
|
|
3362
|
+
@media (hover: hover) {
|
|
3363
|
+
color: var(--color-green-600);
|
|
3364
|
+
}
|
|
3365
|
+
}
|
|
3366
|
+
}
|
|
3285
3367
|
.hover\:underline {
|
|
3286
3368
|
&:hover {
|
|
3287
3369
|
@media (hover: hover) {
|
|
@@ -3577,6 +3659,16 @@
|
|
|
3577
3659
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
3578
3660
|
}
|
|
3579
3661
|
}
|
|
3662
|
+
.max-lg\:hidden {
|
|
3663
|
+
@media (width < 64rem) {
|
|
3664
|
+
display: none;
|
|
3665
|
+
}
|
|
3666
|
+
}
|
|
3667
|
+
.max-md\:hidden {
|
|
3668
|
+
@media (width < 48rem) {
|
|
3669
|
+
display: none;
|
|
3670
|
+
}
|
|
3671
|
+
}
|
|
3580
3672
|
.sm\:mx-3 {
|
|
3581
3673
|
@media (width >= 40rem) {
|
|
3582
3674
|
margin-inline: calc(var(--spacing) * 3);
|
|
@@ -3597,6 +3689,11 @@
|
|
|
3597
3689
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
3598
3690
|
}
|
|
3599
3691
|
}
|
|
3692
|
+
.sm\:grid-cols-3 {
|
|
3693
|
+
@media (width >= 40rem) {
|
|
3694
|
+
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
3695
|
+
}
|
|
3696
|
+
}
|
|
3600
3697
|
.sm\:grid-cols-4 {
|
|
3601
3698
|
@media (width >= 40rem) {
|
|
3602
3699
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
@@ -3783,6 +3880,11 @@
|
|
|
3783
3880
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
3784
3881
|
}
|
|
3785
3882
|
}
|
|
3883
|
+
.xl\:grid-cols-5 {
|
|
3884
|
+
@media (width >= 80rem) {
|
|
3885
|
+
grid-template-columns: repeat(5, minmax(0, 1fr));
|
|
3886
|
+
}
|
|
3887
|
+
}
|
|
3786
3888
|
.dark\:text-neutral-500 {
|
|
3787
3889
|
@media (prefers-color-scheme: dark) {
|
|
3788
3890
|
color: var(--color-neutral-500);
|
package/dist/index.d.ts
CHANGED
|
@@ -8,7 +8,7 @@ export { AgentSessionControls, AgentSessionControlsProps, AgentSessionHarnessCon
|
|
|
8
8
|
export { ExpandedToolDetail, ExpandedToolDetailProps, InlineThinkingItem, InlineThinkingItemProps, InlineToolItem, InlineToolItemProps, LiveDuration, RunGroup, RunGroupProps } from '@tangle-network/ui/run';
|
|
9
9
|
export { CommandPreview, DiffPreview, GlobResultsPreview, GrepResultsPreview, QuestionPreview, WebSearchPreview, WriteFilePreview } from '@tangle-network/ui/tool-previews';
|
|
10
10
|
export { FileArtifactPane, FileArtifactPaneProps, FileNode, FilePreview, FilePreviewProps, FileTabData, FileTabs, FileTabsProps, FileTree, FileTreeProps, FileTreeVisibilityOptions, RichFileTree, RichFileTreeGitEntry, RichFileTreeGitStatus, RichFileTreeProps, RichFileTreeThemeVars, filterFileTree } from '@tangle-network/ui/files';
|
|
11
|
-
export { ActivityFeed, ActivityFeedProps, ActivityItem, BackendConfig, BackendConfigProps, BackendStatusData, ClusterStatusBar, ClusterStatusBarProps, ClusterStatusItem, CreditBalance, CreditBalanceProps, DashboardLayout, DashboardLayoutProps, DashboardProfile, DashboardSnapshotInfo, DashboardUser, ExposedPort, GitCommitData, GitPanel, GitPanelProps, GitStatusData, 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, PortsList, PortsListProps, ProcessInfo, ProcessList, ProcessListProps, ProductVariant, ProfileAvatar, ProfileAvatarProps, ProfileComparison, ProfileComparisonProps, ProfileSelector, ProfileSelectorProps, PromoBanner, PromoBannerProps, RailButton, RailButtonProps, RailModeButton, RailModeButtonProps, RailSeparator, RailSeparatorProps, ResourceMeter, ResourceMeterProps, ResourceSnapshot, ResourceSnapshotItem, ResourceSnapshotProps, SIDEBAR_MOBILE_WIDTH, SIDEBAR_PANEL_WIDTH, SIDEBAR_RAIL_WIDTH, SIDEBAR_TOTAL_WIDTH, SandboxCard, SandboxCardData, SandboxCardProps, SandboxStatus, SandboxTable, SandboxTableProps, Sidebar, SidebarContent, SidebarContentProps, SidebarPanel, SidebarPanelContent, SidebarPanelContentProps, SidebarPanelHeader, SidebarPanelHeaderProps, SidebarPanelProps, SidebarProps, SidebarProvider, SidebarProviderProps, SidebarRail, SidebarRailFooter, SidebarRailFooterProps, SidebarRailHeader, SidebarRailHeaderProps, SidebarRailNav, SidebarRailNavProps, SidebarRailProps, SidebarUser, SnapshotList, SnapshotListProps, SystemLogsViewer, SystemLogsViewerProps, TeamRole, UsageSummary, UsageSummaryData, UsageSummaryProps, Variant, VariantList, VariantListProps, VariantOutcome, VariantStatus, canAdminSandbox, parseInsufficientBalance, useSidebar } from './dashboard.js';
|
|
11
|
+
export { ActivityFeed, ActivityFeedProps, ActivityItem, BackendConfig, BackendConfigProps, BackendStatusData, ClusterStatusBar, ClusterStatusBarProps, ClusterStatusItem, CreditBalance, CreditBalanceProps, DashboardLayout, DashboardLayoutProps, DashboardProfile, DashboardSnapshotInfo, DashboardUser, ExposedPort, GitCommitData, GitPanel, GitPanelProps, GitStatusData, 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, PortsList, PortsListProps, ProcessInfo, ProcessList, ProcessListProps, ProductVariant, ProfileAvatar, ProfileAvatarProps, ProfileComparison, ProfileComparisonProps, ProfileSelector, ProfileSelectorProps, PromoBanner, PromoBannerProps, RailButton, RailButtonProps, RailModeButton, RailModeButtonProps, RailSeparator, RailSeparatorProps, ResourceMeter, ResourceMeterProps, ResourceSnapshot, ResourceSnapshotItem, ResourceSnapshotProps, SIDEBAR_MOBILE_WIDTH, SIDEBAR_PANEL_WIDTH, SIDEBAR_RAIL_WIDTH, SIDEBAR_TOTAL_WIDTH, SandboxCard, SandboxCardData, SandboxCardProps, SandboxStatus, SandboxTable, SandboxTableProps, Sidebar, SidebarContent, SidebarContentProps, SidebarLayout, 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, UsageSummary, UsageSummaryData, UsageSummaryProps, Variant, VariantList, VariantListProps, VariantOutcome, VariantStatus, canAdminSandbox, parseInsufficientBalance, useSidebar } from './dashboard.js';
|
|
12
12
|
export { B as Backend, a as BackendSelector, b as BackendSelectorProps, H as HARNESS_OPTIONS, c as HarnessPicker, d as HarnessPickerProps, e as HarnessType } from './harness-picker-C1W3rTeb.js';
|
|
13
13
|
export { M as ModelInfo, a as ModelPicker, b as ModelPickerProps, c as ModelPickerVariant, d as canonicalModelId, f as formatContext, e as formatPricing } from './model-picker-DUfMTQo5.js';
|
|
14
14
|
export { B as BillingBalance, a as BillingDashboard, b as BillingDashboardProps, c as BillingSubscription, d as BillingUsage, P as PricingPage, e as PricingPageProps, f as PricingTier, T as TemplateCard, g as TemplateCardData, h as TemplateCardProps, U as UsageChart, i as UsageChartProps, j as UsageDataPoint, k as formatPrice } from './template-card-UhV3pmRC.js';
|
package/dist/index.js
CHANGED
|
@@ -173,6 +173,7 @@ import {
|
|
|
173
173
|
SandboxTable,
|
|
174
174
|
Sidebar,
|
|
175
175
|
SidebarContent,
|
|
176
|
+
SidebarLayout,
|
|
176
177
|
SidebarPanel,
|
|
177
178
|
SidebarPanelContent,
|
|
178
179
|
SidebarPanelHeader,
|
|
@@ -188,7 +189,7 @@ import {
|
|
|
188
189
|
canAdminSandbox,
|
|
189
190
|
parseInsufficientBalance,
|
|
190
191
|
useSidebar
|
|
191
|
-
} from "./chunk-
|
|
192
|
+
} from "./chunk-CB3KBKYN.js";
|
|
192
193
|
import {
|
|
193
194
|
BillingDashboard,
|
|
194
195
|
InfoPanel,
|
|
@@ -453,6 +454,7 @@ export {
|
|
|
453
454
|
Sidebar,
|
|
454
455
|
SidebarContent,
|
|
455
456
|
SidebarDropZone,
|
|
457
|
+
SidebarLayout,
|
|
456
458
|
SidebarPanel,
|
|
457
459
|
SidebarPanelContent,
|
|
458
460
|
SidebarPanelHeader,
|