@tangle-network/sandbox-ui 0.116.4 → 0.116.5

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.
@@ -7,7 +7,7 @@ import { Avatar, AvatarFallback, AvatarImage, Badge, Button, DropdownMenu, Dropd
7
7
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
8
8
  import * as React$1 from "react";
9
9
  import { useEffect, useRef, useState } from "react";
10
- import { focusField, focusFieldWithin, focusRing, timeAgo } from "@tangle-network/ui/utils";
10
+ import { focusField, focusFieldWithin, focusRing, focusRingInset, timeAgo } from "@tangle-network/ui/utils";
11
11
  import { Activity, BarChart2, Bell, Bot, Box, Camera, Check, CheckCircle2, ChevronDown, ChevronLeft, ChevronRight, Clock, Code2, Copy, Cpu, DollarSign, Download, ExternalLink, File, FileEdit, FilePlus, FileText, GitBranch, GitCommit, Globe, HardDrive, Key, Layers, Loader2, MemoryStick, MessageSquare, Monitor, MoreHorizontal, MoreVertical, Network, PanelLeft, Play, Plug, Plus, Power, PowerOff, RefreshCw, RotateCcw, Server, Settings, ShieldAlert, Skull, Terminal, Timer, Trash2, User, Users, Wrench, X, XCircle } from "lucide-react";
12
12
  import { createPortal } from "react-dom";
13
13
  import * as Select from "@radix-ui/react-select";
@@ -1803,6 +1803,27 @@ function SandboxTable({ sandboxes, page = 1, pageSize = 10, total, onPageChange,
1803
1803
  const totalCount = total ?? sandboxes.length;
1804
1804
  const totalPages = Math.ceil(totalCount / pageSize);
1805
1805
  const hasTeamSandboxes = sandboxes.some((sb) => sb.team !== void 0);
1806
+ const tableScrollRef = React$1.useRef(null);
1807
+ const [hasHiddenColumns, setHasHiddenColumns] = React$1.useState(false);
1808
+ React$1.useEffect(() => {
1809
+ const scroller = tableScrollRef.current;
1810
+ const table = scroller?.querySelector("table");
1811
+ if (!scroller || !table) return;
1812
+ const measure = () => setHasHiddenColumns(scroller.scrollWidth > scroller.clientWidth + 1);
1813
+ measure();
1814
+ if (typeof ResizeObserver === "undefined") {
1815
+ window.addEventListener("resize", measure);
1816
+ return () => window.removeEventListener("resize", measure);
1817
+ }
1818
+ const observer = new ResizeObserver(measure);
1819
+ observer.observe(scroller);
1820
+ observer.observe(table);
1821
+ return () => observer.disconnect();
1822
+ }, [sandboxes, hasTeamSandboxes]);
1823
+ const scrollColumns = (direction) => {
1824
+ const scroller = tableScrollRef.current;
1825
+ scroller?.scrollBy({ left: direction * scroller.clientWidth * .75 });
1826
+ };
1806
1827
  const resolveResumeHandler = (status) => {
1807
1828
  if (onResume) return onResume;
1808
1829
  if (status === "hibernating") return onWake;
@@ -1815,306 +1836,348 @@ function SandboxTable({ sandboxes, page = 1, pageSize = 10, total, onPageChange,
1815
1836
  };
1816
1837
  return /* @__PURE__ */ jsxs("div", {
1817
1838
  className: cn$1("w-full", className),
1818
- children: [/* @__PURE__ */ jsx("div", {
1819
- className: "w-full bg-surface-container rounded-2xl overflow-hidden border border-[var(--md3-outline-variant)]",
1820
- children: /* @__PURE__ */ jsx("div", {
1821
- className: "overflow-x-auto",
1822
- children: /* @__PURE__ */ jsxs("table", {
1823
- className: "w-full text-left border-collapse",
1824
- children: [/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", {
1825
- className: "bg-surface-container-high border-b border-[var(--md3-outline-variant)]",
1826
- children: [
1827
- /* @__PURE__ */ jsx("th", {
1828
- className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
1829
- children: "Status"
1830
- }),
1831
- /* @__PURE__ */ jsx("th", {
1832
- className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
1833
- children: "Sandbox Name"
1834
- }),
1835
- hasTeamSandboxes && /* @__PURE__ */ jsx("th", {
1836
- className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
1837
- children: "Scope"
1838
- }),
1839
- /* @__PURE__ */ jsx("th", {
1840
- className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
1841
- children: "Environment"
1842
- }),
1843
- /* @__PURE__ */ jsx("th", {
1844
- className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
1845
- children: "Resources"
1846
- }),
1847
- /* @__PURE__ */ jsx("th", {
1848
- className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider text-right",
1849
- children: "Actions"
1850
- })
1851
- ]
1852
- }) }), /* @__PURE__ */ jsx("tbody", {
1853
- className: "divide-y divide-border",
1854
- children: sandboxes.map((sb) => {
1855
- const sc = statusColors[sb.status] ?? statusColors.stopped;
1856
- const isActive = sb.status === "running";
1857
- const isHibernating = sb.status === "hibernating";
1858
- const isProvisioning = sb.status === "provisioning";
1859
- const resumeHandler = isResumable(sb.status) ? resolveResumeHandler(sb.status) : void 0;
1860
- const onRowClick = resolveRowClick(sb);
1861
- const resumeLabel = isHibernating ? "Wake Up" : "Resume";
1862
- const stopRowClick = (e) => e.stopPropagation();
1863
- return /* @__PURE__ */ jsxs("tr", {
1864
- className: cn$1("group relative transition-colors", onRowClick ? "cursor-pointer hover:bg-surface-container-high" : "hover:bg-surface-container-high"),
1865
- onClick: onRowClick,
1839
+ children: [
1840
+ sandboxes.length > 0 && hasHiddenColumns && /* @__PURE__ */ jsxs("div", {
1841
+ className: "mb-2 flex items-center justify-end gap-2 text-xs text-muted-foreground",
1842
+ children: [
1843
+ /* @__PURE__ */ jsx("span", { children: "Columns" }),
1844
+ /* @__PURE__ */ jsx("button", {
1845
+ type: "button",
1846
+ onClick: () => scrollColumns(-1),
1847
+ className: `rounded-md border border-[var(--md3-outline-variant)] p-1.5 ${focusRing}`,
1848
+ "aria-label": "Scroll sandbox table left",
1849
+ title: "Scroll table left",
1850
+ children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
1851
+ }),
1852
+ /* @__PURE__ */ jsx("button", {
1853
+ type: "button",
1854
+ onClick: () => scrollColumns(1),
1855
+ className: `rounded-md border border-[var(--md3-outline-variant)] p-1.5 ${focusRing}`,
1856
+ "aria-label": "Scroll sandbox table right",
1857
+ title: "Scroll table right",
1858
+ children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
1859
+ })
1860
+ ]
1861
+ }),
1862
+ /* @__PURE__ */ jsx("div", {
1863
+ className: "w-full bg-surface-container rounded-2xl overflow-hidden border border-[var(--md3-outline-variant)]",
1864
+ children: /* @__PURE__ */ jsx("div", {
1865
+ ref: tableScrollRef,
1866
+ className: `max-h-[min(60vh,35rem)] overflow-auto ${focusRingInset}`,
1867
+ role: "region",
1868
+ "aria-label": "Sandbox table; scroll horizontally for more columns",
1869
+ tabIndex: 0,
1870
+ children: /* @__PURE__ */ jsxs("table", {
1871
+ className: cn$1("w-full text-left border-collapse", hasTeamSandboxes && "[&_th]:px-4 [&_td]:px-4"),
1872
+ children: [/* @__PURE__ */ jsx("thead", {
1873
+ className: "sticky top-0 z-10",
1874
+ children: /* @__PURE__ */ jsxs("tr", {
1875
+ className: "bg-surface-container-high border-b border-[var(--md3-outline-variant)]",
1866
1876
  children: [
1867
- /* @__PURE__ */ jsx("td", {
1868
- className: "px-6 py-5 whitespace-nowrap",
1869
- children: /* @__PURE__ */ jsxs("div", {
1870
- className: "flex items-center gap-2",
1871
- children: [/* @__PURE__ */ jsx("span", {
1872
- className: cn$1("flex h-2.5 w-2.5 rounded-full", sc.dot),
1873
- ...sc.dot.includes("animate-") ? { "data-motion": "essential" } : {}
1874
- }), /* @__PURE__ */ jsx("span", {
1875
- className: cn$1("text-xs font-bold uppercase tracking-wide", sc.text),
1876
- children: sb.status.charAt(0).toUpperCase() + sb.status.slice(1)
1877
- })]
1878
- })
1877
+ /* @__PURE__ */ jsx("th", {
1878
+ className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
1879
+ children: "Status"
1879
1880
  }),
1880
- /* @__PURE__ */ jsx("td", {
1881
- className: "px-6 py-5",
1882
- children: /* @__PURE__ */ jsxs("div", {
1883
- className: "flex flex-col",
1884
- children: [/* @__PURE__ */ jsx("span", {
1885
- className: "text-sm font-bold text-foreground group-hover:text-primary transition-colors",
1886
- children: sb.name
1887
- }), sb.nodeId && /* @__PURE__ */ jsx("span", {
1888
- className: "text-[10px] font-mono text-muted-foreground",
1889
- children: sb.nodeId
1890
- })]
1891
- })
1881
+ /* @__PURE__ */ jsx("th", {
1882
+ className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
1883
+ children: "Sandbox Name"
1892
1884
  }),
1893
- hasTeamSandboxes && /* @__PURE__ */ jsx("td", {
1894
- className: "px-6 py-5",
1895
- children: sb.team ? /* @__PURE__ */ jsxs("div", {
1896
- className: "inline-flex items-center gap-1.5 rounded-full bg-[var(--accent-surface-soft)] px-2.5 py-1 text-[11px] font-semibold text-[var(--accent-text)]",
1897
- title: `Shared with ${sb.team.name ?? "Team"} · ${sb.team.role}`,
1898
- children: [
1899
- /* @__PURE__ */ jsx(Users, {
1900
- className: "h-3 w-3",
1901
- "aria-hidden": "true"
1902
- }),
1903
- /* @__PURE__ */ jsx("span", { children: sb.team.name ?? "Team" }),
1904
- /* @__PURE__ */ jsxs("span", {
1905
- className: "font-normal text-muted-foreground",
1906
- children: ["· ", sb.team.role]
1907
- })
1908
- ]
1909
- }) : /* @__PURE__ */ jsxs("div", {
1910
- className: "inline-flex items-center gap-1.5 rounded-full bg-surface-container-high px-2.5 py-1 text-[11px] font-medium text-muted-foreground",
1911
- title: "Personal sandbox",
1912
- children: [/* @__PURE__ */ jsx(User, {
1913
- className: "h-3 w-3",
1914
- "aria-hidden": "true"
1915
- }), "Personal"]
1916
- })
1885
+ hasTeamSandboxes && /* @__PURE__ */ jsx("th", {
1886
+ className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
1887
+ children: "Scope"
1917
1888
  }),
1918
- /* @__PURE__ */ jsx("td", {
1919
- className: "px-6 py-5",
1920
- children: /* @__PURE__ */ jsxs("div", {
1921
- className: "flex items-center gap-3",
1922
- children: [sb.imageIcon && /* @__PURE__ */ jsx("div", {
1923
- className: "w-8 h-8 rounded-lg bg-surface-container-high flex items-center justify-center",
1924
- children: sb.imageIcon
1925
- }), sb.image && /* @__PURE__ */ jsx("span", {
1926
- className: "text-xs font-bold text-foreground",
1927
- children: sb.image
1928
- })]
1929
- })
1889
+ /* @__PURE__ */ jsx("th", {
1890
+ className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
1891
+ children: "Environment"
1930
1892
  }),
1931
- /* @__PURE__ */ jsx("td", {
1932
- className: "px-6 py-5",
1933
- children: isActive ? /* @__PURE__ */ jsxs("div", {
1934
- className: "space-y-3 w-48",
1935
- children: [/* @__PURE__ */ jsx(MiniMeter, {
1936
- label: "CPU",
1937
- percent: sb.cpuPercent ?? 0
1938
- }), /* @__PURE__ */ jsx(MiniMeter, {
1939
- label: "RAM",
1940
- percent: sb.ramTotal ? Math.round((sb.ramUsed ?? 0) / sb.ramTotal * 100) : 0
1941
- })]
1942
- }) : isProvisioning ? /* @__PURE__ */ jsxs("div", {
1943
- className: "flex items-center gap-2 text-primary italic text-[10px] font-bold",
1944
- children: [/* @__PURE__ */ jsx(RefreshCw, {
1945
- className: "h-3.5 w-3.5 animate-spin",
1946
- "data-motion": "essential"
1947
- }), sb.provisioningMessage ?? "Allocating nodes..."]
1948
- }) : isHibernating ? /* @__PURE__ */ jsxs("div", {
1949
- className: "space-y-3 w-48 opacity-30",
1950
- children: [/* @__PURE__ */ jsx(MiniMeter, {
1951
- label: "CPU",
1952
- percent: 0
1953
- }), /* @__PURE__ */ jsx(MiniMeter, {
1954
- label: "RAM",
1955
- percent: 0
1956
- })]
1957
- }) : null
1893
+ /* @__PURE__ */ jsx("th", {
1894
+ className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider",
1895
+ children: "Resources"
1958
1896
  }),
1959
- /* @__PURE__ */ jsx("td", {
1960
- className: "px-6 py-5 text-right",
1961
- children: /* @__PURE__ */ jsxs("div", {
1962
- className: "flex items-center justify-end gap-1",
1963
- children: [
1964
- isActive && /* @__PURE__ */ jsxs(Fragment, { children: [
1965
- /* @__PURE__ */ jsx("button", {
1966
- type: "button",
1967
- onClick: (e) => {
1968
- stopRowClick(e);
1969
- onOpenIDE?.(sb.id);
1970
- },
1971
- className: "p-2 rounded-lg hover:bg-surface-container-high text-muted-foreground hover:text-foreground transition-all active:scale-90",
1972
- title: "Open IDE",
1973
- children: /* @__PURE__ */ jsx(Code2, { className: "h-4 w-4" })
1897
+ /* @__PURE__ */ jsx("th", {
1898
+ className: "px-6 py-4 text-xs font-semibold text-muted-foreground uppercase tracking-wider text-right",
1899
+ children: "Actions"
1900
+ })
1901
+ ]
1902
+ })
1903
+ }), /* @__PURE__ */ jsx("tbody", {
1904
+ className: "divide-y divide-border",
1905
+ children: sandboxes.map((sb) => {
1906
+ const sc = statusColors[sb.status] ?? statusColors.stopped;
1907
+ const isActive = sb.status === "running";
1908
+ const isHibernating = sb.status === "hibernating";
1909
+ const isProvisioning = sb.status === "provisioning";
1910
+ const resumeHandler = isResumable(sb.status) ? resolveResumeHandler(sb.status) : void 0;
1911
+ const onRowClick = resolveRowClick(sb);
1912
+ const resumeLabel = isHibernating ? "Wake Up" : "Resume";
1913
+ const stopRowClick = (e) => e.stopPropagation();
1914
+ return /* @__PURE__ */ jsxs("tr", {
1915
+ className: cn$1("group relative transition-colors", onRowClick ? "cursor-pointer hover:bg-surface-container-high" : "hover:bg-surface-container-high"),
1916
+ onClick: onRowClick,
1917
+ children: [
1918
+ /* @__PURE__ */ jsx("td", {
1919
+ className: "px-6 py-5 whitespace-nowrap",
1920
+ children: /* @__PURE__ */ jsxs("div", {
1921
+ className: "flex items-center gap-2",
1922
+ children: [/* @__PURE__ */ jsx("span", {
1923
+ className: cn$1("flex h-2.5 w-2.5 rounded-full", sc.dot),
1924
+ ...sc.dot.includes("animate-") ? { "data-motion": "essential" } : {}
1925
+ }), /* @__PURE__ */ jsx("span", {
1926
+ className: cn$1("text-xs font-bold uppercase tracking-wide", sc.text),
1927
+ children: sb.status.charAt(0).toUpperCase() + sb.status.slice(1)
1928
+ })]
1929
+ })
1930
+ }),
1931
+ /* @__PURE__ */ jsx("td", {
1932
+ className: "px-6 py-5",
1933
+ children: /* @__PURE__ */ jsxs("div", {
1934
+ className: cn$1("flex min-w-0 flex-col", hasTeamSandboxes ? "max-w-36" : "max-w-64"),
1935
+ children: [/* @__PURE__ */ jsx("span", {
1936
+ className: "truncate text-sm font-bold text-foreground group-hover:text-primary transition-colors",
1937
+ title: sb.name,
1938
+ children: sb.name
1939
+ }), sb.nodeId && /* @__PURE__ */ jsx("span", {
1940
+ className: "truncate text-[10px] font-mono text-muted-foreground",
1941
+ title: sb.nodeId,
1942
+ children: sb.nodeId
1943
+ })]
1944
+ })
1945
+ }),
1946
+ hasTeamSandboxes && /* @__PURE__ */ jsx("td", {
1947
+ className: "px-6 py-5",
1948
+ children: sb.team ? /* @__PURE__ */ jsxs("div", {
1949
+ className: "inline-flex max-w-40 items-center gap-1.5 rounded-full bg-[var(--accent-surface-soft)] px-2.5 py-1 text-[11px] font-semibold text-[var(--accent-text)]",
1950
+ title: `Shared with ${sb.team.name ?? "Team"} · ${sb.team.role}`,
1951
+ children: [
1952
+ /* @__PURE__ */ jsx(Users, {
1953
+ className: "h-3 w-3 shrink-0",
1954
+ "aria-hidden": "true"
1955
+ }),
1956
+ /* @__PURE__ */ jsx("span", {
1957
+ className: "min-w-0 truncate",
1958
+ children: sb.team.name ?? "Team"
1974
1959
  }),
1975
- /* @__PURE__ */ jsx("button", {
1960
+ /* @__PURE__ */ jsxs("span", {
1961
+ className: "shrink-0 font-normal text-muted-foreground",
1962
+ children: ["· ", sb.team.role]
1963
+ })
1964
+ ]
1965
+ }) : /* @__PURE__ */ jsxs("div", {
1966
+ className: "inline-flex items-center gap-1.5 rounded-full bg-surface-container-high px-2.5 py-1 text-[11px] font-medium text-muted-foreground",
1967
+ title: "Personal sandbox",
1968
+ children: [/* @__PURE__ */ jsx(User, {
1969
+ className: "h-3 w-3",
1970
+ "aria-hidden": "true"
1971
+ }), "Personal"]
1972
+ })
1973
+ }),
1974
+ /* @__PURE__ */ jsx("td", {
1975
+ className: "px-6 py-5",
1976
+ children: /* @__PURE__ */ jsxs("div", {
1977
+ className: cn$1("flex min-w-0 items-center gap-3", hasTeamSandboxes ? "max-w-26" : "max-w-28"),
1978
+ children: [sb.imageIcon && /* @__PURE__ */ jsx("div", {
1979
+ className: "w-8 h-8 shrink-0 rounded-lg bg-surface-container-high flex items-center justify-center",
1980
+ children: sb.imageIcon
1981
+ }), sb.image && /* @__PURE__ */ jsx("span", {
1982
+ className: "min-w-0 truncate text-xs font-bold text-foreground",
1983
+ title: sb.image,
1984
+ children: sb.image
1985
+ })]
1986
+ })
1987
+ }),
1988
+ /* @__PURE__ */ jsx("td", {
1989
+ className: "px-6 py-5",
1990
+ children: isActive ? /* @__PURE__ */ jsxs("div", {
1991
+ className: cn$1("space-y-3", hasTeamSandboxes ? "w-44" : "w-48"),
1992
+ children: [/* @__PURE__ */ jsx(MiniMeter, {
1993
+ label: "CPU",
1994
+ percent: sb.cpuPercent ?? 0
1995
+ }), /* @__PURE__ */ jsx(MiniMeter, {
1996
+ label: "RAM",
1997
+ percent: sb.ramTotal ? Math.round((sb.ramUsed ?? 0) / sb.ramTotal * 100) : 0
1998
+ })]
1999
+ }) : isProvisioning ? /* @__PURE__ */ jsxs("div", {
2000
+ className: cn$1("flex items-center gap-2 text-primary italic text-[10px] font-bold", hasTeamSandboxes ? "max-w-44" : "max-w-48"),
2001
+ children: [/* @__PURE__ */ jsx(RefreshCw, {
2002
+ className: "h-3.5 w-3.5 shrink-0 animate-spin",
2003
+ "data-motion": "essential"
2004
+ }), /* @__PURE__ */ jsx("span", {
2005
+ className: "min-w-0 truncate",
2006
+ title: sb.provisioningMessage ?? "Allocating nodes...",
2007
+ children: sb.provisioningMessage ?? "Allocating nodes..."
2008
+ })]
2009
+ }) : isHibernating ? /* @__PURE__ */ jsxs("div", {
2010
+ className: cn$1("space-y-3 opacity-30", hasTeamSandboxes ? "w-44" : "w-48"),
2011
+ children: [/* @__PURE__ */ jsx(MiniMeter, {
2012
+ label: "CPU",
2013
+ percent: 0
2014
+ }), /* @__PURE__ */ jsx(MiniMeter, {
2015
+ label: "RAM",
2016
+ percent: 0
2017
+ })]
2018
+ }) : null
2019
+ }),
2020
+ /* @__PURE__ */ jsx("td", {
2021
+ className: "px-6 py-5 text-right",
2022
+ children: /* @__PURE__ */ jsxs("div", {
2023
+ className: "flex items-center justify-end gap-1",
2024
+ children: [
2025
+ isActive && /* @__PURE__ */ jsxs(Fragment, { children: [
2026
+ /* @__PURE__ */ jsx("button", {
2027
+ type: "button",
2028
+ onClick: (e) => {
2029
+ stopRowClick(e);
2030
+ onOpenIDE?.(sb.id);
2031
+ },
2032
+ className: "p-2 rounded-lg hover:bg-surface-container-high text-muted-foreground hover:text-foreground transition-all active:scale-90",
2033
+ title: "Open IDE",
2034
+ children: /* @__PURE__ */ jsx(Code2, { className: "h-4 w-4" })
2035
+ }),
2036
+ /* @__PURE__ */ jsx("button", {
2037
+ type: "button",
2038
+ onClick: (e) => {
2039
+ stopRowClick(e);
2040
+ onOpenTerminal?.(sb.id);
2041
+ },
2042
+ className: "p-2 rounded-lg hover:bg-surface-container-high text-muted-foreground hover:text-foreground transition-all active:scale-90",
2043
+ title: "Terminal",
2044
+ children: /* @__PURE__ */ jsx(Terminal, { className: "h-4 w-4" })
2045
+ }),
2046
+ /* @__PURE__ */ jsx("button", {
2047
+ type: "button",
2048
+ onClick: (e) => {
2049
+ stopRowClick(e);
2050
+ onSSH?.(sb.id);
2051
+ },
2052
+ className: "p-2 rounded-lg hover:bg-surface-container-high text-muted-foreground hover:text-foreground transition-all active:scale-90",
2053
+ title: "SSH",
2054
+ children: /* @__PURE__ */ jsx(Key, { className: "h-4 w-4" })
2055
+ })
2056
+ ] }),
2057
+ resumeHandler && /* @__PURE__ */ jsxs("button", {
1976
2058
  type: "button",
1977
2059
  onClick: (e) => {
1978
2060
  stopRowClick(e);
1979
- onOpenTerminal?.(sb.id);
2061
+ resumeHandler(sb.id);
1980
2062
  },
1981
- className: "p-2 rounded-lg hover:bg-surface-container-high text-muted-foreground hover:text-foreground transition-all active:scale-90",
1982
- title: "Terminal",
1983
- children: /* @__PURE__ */ jsx(Terminal, { className: "h-4 w-4" })
2063
+ className: "inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-[var(--md3-outline-variant)] text-primary text-[10px] font-bold uppercase tracking-wider hover:bg-[var(--accent-surface-soft)] active:scale-95 transition-all",
2064
+ title: resumeLabel,
2065
+ children: [/* @__PURE__ */ jsx(Play, { className: "h-3 w-3" }), resumeLabel]
1984
2066
  }),
1985
- /* @__PURE__ */ jsx("button", {
2067
+ (() => {
2068
+ const runItem = (handler) => (e) => {
2069
+ e.stopPropagation();
2070
+ handler(sb.id);
2071
+ };
2072
+ const overflowSections = [];
2073
+ if (isActive) {
2074
+ const lifecycle = [];
2075
+ if (onStop) lifecycle.push(/* @__PURE__ */ jsxs(DropdownMenuItem, {
2076
+ onClick: runItem(onStop),
2077
+ children: [/* @__PURE__ */ jsx(PowerOff, { className: "mr-2 h-4 w-4" }), " Stop Sandbox"]
2078
+ }, "stop"));
2079
+ if (onKeepAlive) lifecycle.push(/* @__PURE__ */ jsxs(DropdownMenuItem, {
2080
+ onClick: runItem(onKeepAlive),
2081
+ children: [/* @__PURE__ */ jsx(Clock, { className: "mr-2 h-4 w-4" }), " Keep Alive"]
2082
+ }, "keep-alive"));
2083
+ if (lifecycle.length) overflowSections.push(lifecycle);
2084
+ const observability = [];
2085
+ if (onUsage) observability.push(/* @__PURE__ */ jsxs(DropdownMenuItem, {
2086
+ onClick: runItem(onUsage),
2087
+ children: [/* @__PURE__ */ jsx(BarChart2, { className: "mr-2 h-4 w-4" }), " View Usage"]
2088
+ }, "usage"));
2089
+ if (onHealth) observability.push(/* @__PURE__ */ jsxs(DropdownMenuItem, {
2090
+ onClick: runItem(onHealth),
2091
+ children: [/* @__PURE__ */ jsx(Activity, { className: "mr-2 h-4 w-4" }), " Health Check"]
2092
+ }, "health"));
2093
+ if (observability.length) overflowSections.push(observability);
2094
+ if (onFork) overflowSections.push([/* @__PURE__ */ jsxs(DropdownMenuItem, {
2095
+ onClick: runItem(onFork),
2096
+ children: [/* @__PURE__ */ jsx(Copy, { className: "mr-2 h-4 w-4" }), " Fork Sandbox"]
2097
+ }, "fork")]);
2098
+ } else if (isResumable(sb.status)) {
2099
+ if (onFork) overflowSections.push([/* @__PURE__ */ jsxs(DropdownMenuItem, {
2100
+ onClick: runItem(onFork),
2101
+ children: [/* @__PURE__ */ jsx(Copy, { className: "mr-2 h-4 w-4" }), " Fork Sandbox"]
2102
+ }, "fork")]);
2103
+ }
2104
+ if (onMore) overflowSections.push([/* @__PURE__ */ jsxs(DropdownMenuItem, {
2105
+ onClick: runItem(onMore),
2106
+ children: [/* @__PURE__ */ jsx(ExternalLink, { className: "mr-2 h-4 w-4" }), " View Details"]
2107
+ }, "view-details")]);
2108
+ if (overflowSections.length === 0) return null;
2109
+ return /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
2110
+ asChild: true,
2111
+ children: /* @__PURE__ */ jsx("button", {
2112
+ type: "button",
2113
+ onClick: stopRowClick,
2114
+ className: `p-2 rounded-lg hover:bg-surface-container-high text-muted-foreground hover:text-foreground transition-all active:scale-90 ${focusRing}`,
2115
+ "aria-label": `More actions for ${sb.name}`,
2116
+ title: "More actions",
2117
+ children: /* @__PURE__ */ jsx(MoreVertical, { className: "h-4 w-4" })
2118
+ })
2119
+ }), /* @__PURE__ */ jsx(DropdownMenuContent, {
2120
+ align: "end",
2121
+ className: "min-w-[180px]",
2122
+ children: overflowSections.map((section, sectionIdx) => /* @__PURE__ */ jsxs(React$1.Fragment, { children: [sectionIdx > 0 && /* @__PURE__ */ jsx(DropdownMenuSeparator, {}), section] }, sectionIdx))
2123
+ })] });
2124
+ })(),
2125
+ onDelete && canAdminSandbox(sb) && /* @__PURE__ */ jsx("button", {
1986
2126
  type: "button",
2127
+ "aria-label": `Delete ${sb.name}`,
1987
2128
  onClick: (e) => {
1988
2129
  stopRowClick(e);
1989
- onSSH?.(sb.id);
2130
+ onDelete(sb.id);
1990
2131
  },
1991
- className: "p-2 rounded-lg hover:bg-surface-container-high text-muted-foreground hover:text-foreground transition-all active:scale-90",
1992
- title: "SSH",
1993
- children: /* @__PURE__ */ jsx(Key, { className: "h-4 w-4" })
2132
+ className: `p-2 rounded-lg hover:bg-[var(--surface-danger-bg)] text-muted-foreground hover:text-[var(--surface-danger-text)] transition-all active:scale-90 ${focusRing}`,
2133
+ title: "Delete",
2134
+ children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
1994
2135
  })
1995
- ] }),
1996
- resumeHandler && /* @__PURE__ */ jsxs("button", {
1997
- type: "button",
1998
- onClick: (e) => {
1999
- stopRowClick(e);
2000
- resumeHandler(sb.id);
2001
- },
2002
- className: "inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-[var(--md3-outline-variant)] text-primary text-[10px] font-bold uppercase tracking-wider hover:bg-[var(--accent-surface-soft)] active:scale-95 transition-all",
2003
- title: resumeLabel,
2004
- children: [/* @__PURE__ */ jsx(Play, { className: "h-3 w-3" }), resumeLabel]
2005
- }),
2006
- (() => {
2007
- const runItem = (handler) => (e) => {
2008
- e.stopPropagation();
2009
- handler(sb.id);
2010
- };
2011
- const overflowSections = [];
2012
- if (isActive) {
2013
- const lifecycle = [];
2014
- if (onStop) lifecycle.push(/* @__PURE__ */ jsxs(DropdownMenuItem, {
2015
- onClick: runItem(onStop),
2016
- children: [/* @__PURE__ */ jsx(PowerOff, { className: "mr-2 h-4 w-4" }), " Stop Sandbox"]
2017
- }, "stop"));
2018
- if (onKeepAlive) lifecycle.push(/* @__PURE__ */ jsxs(DropdownMenuItem, {
2019
- onClick: runItem(onKeepAlive),
2020
- children: [/* @__PURE__ */ jsx(Clock, { className: "mr-2 h-4 w-4" }), " Keep Alive"]
2021
- }, "keep-alive"));
2022
- if (lifecycle.length) overflowSections.push(lifecycle);
2023
- const observability = [];
2024
- if (onUsage) observability.push(/* @__PURE__ */ jsxs(DropdownMenuItem, {
2025
- onClick: runItem(onUsage),
2026
- children: [/* @__PURE__ */ jsx(BarChart2, { className: "mr-2 h-4 w-4" }), " View Usage"]
2027
- }, "usage"));
2028
- if (onHealth) observability.push(/* @__PURE__ */ jsxs(DropdownMenuItem, {
2029
- onClick: runItem(onHealth),
2030
- children: [/* @__PURE__ */ jsx(Activity, { className: "mr-2 h-4 w-4" }), " Health Check"]
2031
- }, "health"));
2032
- if (observability.length) overflowSections.push(observability);
2033
- if (onFork) overflowSections.push([/* @__PURE__ */ jsxs(DropdownMenuItem, {
2034
- onClick: runItem(onFork),
2035
- children: [/* @__PURE__ */ jsx(Copy, { className: "mr-2 h-4 w-4" }), " Fork Sandbox"]
2036
- }, "fork")]);
2037
- } else if (isResumable(sb.status)) {
2038
- if (onFork) overflowSections.push([/* @__PURE__ */ jsxs(DropdownMenuItem, {
2039
- onClick: runItem(onFork),
2040
- children: [/* @__PURE__ */ jsx(Copy, { className: "mr-2 h-4 w-4" }), " Fork Sandbox"]
2041
- }, "fork")]);
2042
- }
2043
- if (onMore) overflowSections.push([/* @__PURE__ */ jsxs(DropdownMenuItem, {
2044
- onClick: runItem(onMore),
2045
- children: [/* @__PURE__ */ jsx(ExternalLink, { className: "mr-2 h-4 w-4" }), " View Details"]
2046
- }, "view-details")]);
2047
- if (overflowSections.length === 0) return null;
2048
- return /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
2049
- asChild: true,
2050
- children: /* @__PURE__ */ jsx("button", {
2051
- type: "button",
2052
- onClick: stopRowClick,
2053
- className: `p-2 rounded-lg hover:bg-surface-container-high text-muted-foreground hover:text-foreground transition-all active:scale-90 ${focusRing}`,
2054
- "aria-label": `More actions for ${sb.name}`,
2055
- title: "More actions",
2056
- children: /* @__PURE__ */ jsx(MoreVertical, { className: "h-4 w-4" })
2057
- })
2058
- }), /* @__PURE__ */ jsx(DropdownMenuContent, {
2059
- align: "end",
2060
- className: "min-w-[180px]",
2061
- children: overflowSections.map((section, sectionIdx) => /* @__PURE__ */ jsxs(React$1.Fragment, { children: [sectionIdx > 0 && /* @__PURE__ */ jsx(DropdownMenuSeparator, {}), section] }, sectionIdx))
2062
- })] });
2063
- })(),
2064
- onDelete && canAdminSandbox(sb) && /* @__PURE__ */ jsx("button", {
2065
- type: "button",
2066
- "aria-label": `Delete ${sb.name}`,
2067
- onClick: (e) => {
2068
- stopRowClick(e);
2069
- onDelete(sb.id);
2070
- },
2071
- className: `p-2 rounded-lg hover:bg-[var(--surface-danger-bg)] text-muted-foreground hover:text-[var(--surface-danger-text)] transition-all active:scale-90 ${focusRing}`,
2072
- title: "Delete",
2073
- children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
2074
- })
2075
- ]
2136
+ ]
2137
+ })
2076
2138
  })
2077
- })
2078
- ]
2079
- }, sb.id);
2080
- })
2081
- })]
2139
+ ]
2140
+ }, sb.id);
2141
+ })
2142
+ })]
2143
+ })
2082
2144
  })
2145
+ }),
2146
+ totalPages > 1 && /* @__PURE__ */ jsxs("div", {
2147
+ className: "mt-6 flex flex-col md:flex-row justify-between items-center text-muted-foreground text-xs font-medium gap-4",
2148
+ children: [/* @__PURE__ */ jsxs("p", { children: [
2149
+ "Showing ",
2150
+ sandboxes.length,
2151
+ " of ",
2152
+ totalCount,
2153
+ " active sandboxes"
2154
+ ] }), /* @__PURE__ */ jsxs("div", {
2155
+ className: "flex items-center gap-2",
2156
+ children: [
2157
+ /* @__PURE__ */ jsx("button", {
2158
+ type: "button",
2159
+ onClick: () => onPageChange?.(page - 1),
2160
+ disabled: page <= 1,
2161
+ className: "p-2 rounded-lg border border-[var(--md3-outline-variant)] hover:bg-surface-container-high transition-colors disabled:opacity-30",
2162
+ children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
2163
+ }),
2164
+ Array.from({ length: Math.min(totalPages, 5) }, (_, i) => i + 1).map((p) => /* @__PURE__ */ jsx("button", {
2165
+ type: "button",
2166
+ onClick: () => onPageChange?.(p),
2167
+ className: cn$1("px-3 py-1 rounded-lg transition-colors", p === page ? "bg-[var(--accent-surface-soft)] text-primary border border-[var(--md3-outline)]" : "hover:bg-surface-container-high"),
2168
+ children: p
2169
+ }, p)),
2170
+ /* @__PURE__ */ jsx("button", {
2171
+ type: "button",
2172
+ onClick: () => onPageChange?.(page + 1),
2173
+ disabled: page >= totalPages,
2174
+ className: "p-2 rounded-lg border border-[var(--md3-outline-variant)] hover:bg-surface-container-high transition-colors disabled:opacity-30",
2175
+ children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
2176
+ })
2177
+ ]
2178
+ })]
2083
2179
  })
2084
- }), totalPages > 1 && /* @__PURE__ */ jsxs("div", {
2085
- className: "mt-6 flex flex-col md:flex-row justify-between items-center text-muted-foreground text-xs font-medium gap-4",
2086
- children: [/* @__PURE__ */ jsxs("p", { children: [
2087
- "Showing ",
2088
- sandboxes.length,
2089
- " of ",
2090
- totalCount,
2091
- " active sandboxes"
2092
- ] }), /* @__PURE__ */ jsxs("div", {
2093
- className: "flex items-center gap-2",
2094
- children: [
2095
- /* @__PURE__ */ jsx("button", {
2096
- type: "button",
2097
- onClick: () => onPageChange?.(page - 1),
2098
- disabled: page <= 1,
2099
- className: "p-2 rounded-lg border border-[var(--md3-outline-variant)] hover:bg-surface-container-high transition-colors disabled:opacity-30",
2100
- children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
2101
- }),
2102
- Array.from({ length: Math.min(totalPages, 5) }, (_, i) => i + 1).map((p) => /* @__PURE__ */ jsx("button", {
2103
- type: "button",
2104
- onClick: () => onPageChange?.(p),
2105
- className: cn$1("px-3 py-1 rounded-lg transition-colors", p === page ? "bg-[var(--accent-surface-soft)] text-primary border border-[var(--md3-outline)]" : "hover:bg-surface-container-high"),
2106
- children: p
2107
- }, p)),
2108
- /* @__PURE__ */ jsx("button", {
2109
- type: "button",
2110
- onClick: () => onPageChange?.(page + 1),
2111
- disabled: page >= totalPages,
2112
- className: "p-2 rounded-lg border border-[var(--md3-outline-variant)] hover:bg-surface-container-high transition-colors disabled:opacity-30",
2113
- children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
2114
- })
2115
- ]
2116
- })]
2117
- })]
2180
+ ]
2118
2181
  });
2119
2182
  }
2120
2183
  //#endregion
package/dist/dashboard.js CHANGED
@@ -1,4 +1,4 @@
1
- import { $ as SidebarRailNav, A as ResourceMeter, B as RailFlyout, C as InvoiceTable, D as canAdminSandbox, E as SandboxCard, F as CreditBalance, G as Sidebar, H as RailModeButton, I as ProfileAvatar, J as SidebarPanelContent, K as SidebarContent, L as RailButton, M as INSUFFICIENT_BALANCE_CODE, N as OutOfCreditsModal, O as ActivityFeed, P as parseInsufficientBalance, Q as SidebarRailHeader, R as RailCollapseToggle, S as PlanCards, T as NewSandboxCard, U as RailSeparator, V as RailHeader, W as RailThemeToggle, X as SidebarRail, Y as SidebarPanelHeader, Z as SidebarRailFooter, _ as HarnessPicker, a as ProcessList, at as SIDEBAR_TOTAL_WIDTH, b as HarnessLogo, c as UsageSummary, d as MetricAreaChart, et as RailTooltip, f as ProfileComparison, g as HARNESS_OPTIONS, h as DashboardLayout, i as NetworkConfig, it as SIDEBAR_RAIL_WIDTH, j as ClusterStatusBar, k as ResourceSnapshot, l as SystemLogsViewer, m as SidebarLayout, n as SnapshotList, nt as SIDEBAR_PANEL_WIDTH, o as PortsList, ot as SidebarProvider, p as ProfileSelector, q as SidebarPanel, r as BackendConfig, rt as SIDEBAR_RAIL_LABELED_WIDTH, s as GitPanel, st as useSidebar, t as PromoBanner, tt as SIDEBAR_MOBILE_WIDTH, u as VariantList, v as chatCapableHarnesses, w as SandboxTable, x as BackendSelector, y as HARNESS_BRAND, z as RailExpandable } from "./dashboard-CqyJQc7V.js";
1
+ import { $ as SidebarRailNav, A as ResourceMeter, B as RailFlyout, C as InvoiceTable, D as canAdminSandbox, E as SandboxCard, F as CreditBalance, G as Sidebar, H as RailModeButton, I as ProfileAvatar, J as SidebarPanelContent, K as SidebarContent, L as RailButton, M as INSUFFICIENT_BALANCE_CODE, N as OutOfCreditsModal, O as ActivityFeed, P as parseInsufficientBalance, Q as SidebarRailHeader, R as RailCollapseToggle, S as PlanCards, T as NewSandboxCard, U as RailSeparator, V as RailHeader, W as RailThemeToggle, X as SidebarRail, Y as SidebarPanelHeader, Z as SidebarRailFooter, _ as HarnessPicker, a as ProcessList, at as SIDEBAR_TOTAL_WIDTH, b as HarnessLogo, c as UsageSummary, d as MetricAreaChart, et as RailTooltip, f as ProfileComparison, g as HARNESS_OPTIONS, h as DashboardLayout, i as NetworkConfig, it as SIDEBAR_RAIL_WIDTH, j as ClusterStatusBar, k as ResourceSnapshot, l as SystemLogsViewer, m as SidebarLayout, n as SnapshotList, nt as SIDEBAR_PANEL_WIDTH, o as PortsList, ot as SidebarProvider, p as ProfileSelector, q as SidebarPanel, r as BackendConfig, rt as SIDEBAR_RAIL_LABELED_WIDTH, s as GitPanel, st as useSidebar, t as PromoBanner, tt as SIDEBAR_MOBILE_WIDTH, u as VariantList, v as chatCapableHarnesses, w as SandboxTable, x as BackendSelector, y as HARNESS_BRAND, z as RailExpandable } from "./dashboard-Bx27mUVe.js";
2
2
  import { n as canonicalModelId, r as modelBrandFor, t as ModelBrandStack } from "./model-brand-hMyDTUqB.js";
3
3
  import { a as formatPrice, i as PricingPage, n as TemplateCard, o as BillingDashboard, r as UsageChart, t as InfoPanel } from "./info-panel-C9cqDzOL.js";
4
4
  export { ActivityFeed, BackendConfig, BackendSelector, BillingDashboard, ClusterStatusBar, CreditBalance, DashboardLayout, GitPanel, HARNESS_BRAND, HARNESS_OPTIONS, HarnessLogo, HarnessPicker, INSUFFICIENT_BALANCE_CODE, InfoPanel, InvoiceTable, MetricAreaChart, ModelBrandStack, NetworkConfig, NewSandboxCard, OutOfCreditsModal, PlanCards, PortsList, PricingPage, ProcessList, ProfileAvatar, ProfileComparison, ProfileSelector, PromoBanner, RailButton, RailCollapseToggle, RailExpandable, RailFlyout, RailHeader, RailModeButton, RailSeparator, RailThemeToggle, RailTooltip, ResourceMeter, ResourceSnapshot, SIDEBAR_MOBILE_WIDTH, SIDEBAR_PANEL_WIDTH, SIDEBAR_RAIL_LABELED_WIDTH, SIDEBAR_RAIL_WIDTH, SIDEBAR_TOTAL_WIDTH, SandboxCard, SandboxTable, Sidebar, SidebarContent, SidebarLayout, SidebarPanel, SidebarPanelContent, SidebarPanelHeader, SidebarProvider, SidebarRail, SidebarRailFooter, SidebarRailHeader, SidebarRailNav, SnapshotList, SystemLogsViewer, TemplateCard, UsageChart, UsageSummary, VariantList, canAdminSandbox, canonicalModelId, chatCapableHarnesses, formatPrice, modelBrandFor, parseInsufficientBalance, useSidebar };
package/dist/globals.css CHANGED
@@ -971,6 +971,9 @@
971
971
  .max-h-\[90vh\] {
972
972
  max-height: 90vh;
973
973
  }
974
+ .max-h-\[min\(60vh\,35rem\)\] {
975
+ max-height: min(60vh, 35rem);
976
+ }
974
977
  .max-h-\[min\(60vh\,420px\)\] {
975
978
  max-height: min(60vh, 420px);
976
979
  }
@@ -1310,9 +1313,27 @@
1310
1313
  .max-w-6xl {
1311
1314
  max-width: var(--container-6xl);
1312
1315
  }
1316
+ .max-w-26 {
1317
+ max-width: calc(var(--spacing) * 26);
1318
+ }
1319
+ .max-w-28 {
1320
+ max-width: calc(var(--spacing) * 28);
1321
+ }
1322
+ .max-w-36 {
1323
+ max-width: calc(var(--spacing) * 36);
1324
+ }
1313
1325
  .max-w-40 {
1314
1326
  max-width: calc(var(--spacing) * 40);
1315
1327
  }
1328
+ .max-w-44 {
1329
+ max-width: calc(var(--spacing) * 44);
1330
+ }
1331
+ .max-w-48 {
1332
+ max-width: calc(var(--spacing) * 48);
1333
+ }
1334
+ .max-w-64 {
1335
+ max-width: calc(var(--spacing) * 64);
1336
+ }
1316
1337
  .max-w-80 {
1317
1338
  max-width: calc(var(--spacing) * 80);
1318
1339
  }
@@ -1430,6 +1451,9 @@
1430
1451
  .max-w-\[1050px\] {
1431
1452
  max-width: 1050px;
1432
1453
  }
1454
+ .max-w-\[1086px\] {
1455
+ max-width: 1086px;
1456
+ }
1433
1457
  .max-w-\[1100px\] {
1434
1458
  max-width: 1100px;
1435
1459
  }
@@ -5061,6 +5085,12 @@
5061
5085
  .\[\&_svg\]\:shrink-0 svg {
5062
5086
  flex-shrink: 0;
5063
5087
  }
5088
+ .\[\&_td\]\:px-4 td {
5089
+ padding-inline: calc(var(--spacing) * 4);
5090
+ }
5091
+ .\[\&_th\]\:px-4 th {
5092
+ padding-inline: calc(var(--spacing) * 4);
5093
+ }
5064
5094
  .\[\&_tr\]\:border-b tr {
5065
5095
  border-bottom-style: var(--tw-border-style);
5066
5096
  border-bottom-width: 1px;
package/dist/index.js CHANGED
@@ -1,8 +1,8 @@
1
- import { a as computeDiffStats, c as BRAND_PRISM_THEME, d as DiffStatsBadge, f as GitStatusBadge, i as buildUnifiedPatch, l as CodeSurface, m as PillTabs, n as SandboxArtifactPane, o as CodeView, p as PanelHeader, r as DiffView, s as FileBreadcrumb, t as ChangesPane, u as resolveLanguage } from "./workbench-DJlOqodW.js";
1
+ import { a as computeDiffStats, c as BRAND_PRISM_THEME, d as DiffStatsBadge, f as GitStatusBadge, i as buildUnifiedPatch, l as CodeSurface, m as PillTabs, n as SandboxArtifactPane, o as CodeView, p as PanelHeader, r as DiffView, s as FileBreadcrumb, t as ChangesPane, u as resolveLanguage } from "./workbench-BbeBgtUT.js";
2
2
  import { $ as SelectItem, A as DropdownMenuItem, At as Textarea, B as DropdownMenuTrigger, C as DialogTitle, Ct as TabsList, D as DropdownMenuCheckboxItem, E as DropdownMenu, Et as TerminalDisplay, F as DropdownMenuSeparator, Ft as UploadProgress, G as Label, Gt as TangleKnot, H as FilterField, I as DropdownMenuShortcut, It as badgeVariants, J as Progress, K as Metric, L as DropdownMenuSub, Lt as buttonVariants, M as DropdownMenuPortal, Mt as ToastContainer, N as DropdownMenuRadioGroup, Nt as ToastProvider, O as DropdownMenuContent, P as DropdownMenuRadioItem, Pt as Toolbar, Q as SelectGroup, R as DropdownMenuSubContent, Rt as useTheme, S as DialogPortal, St as TabsContent, T as DropZone, U as InlineCode, V as EmptyState, W as Input, Wt as Logo, X as Select, Y as SegmentedControl, Z as SelectContent, _ as DialogContent, _t as TableFooter, a as Badge, at as SelectValue, b as DialogHeader, bt as TableRow, c as CardContent, ct as SkeletonCard, d as CardHeader, dt as StatusPill, et as SelectLabel, f as CardTitle, ft as Switch, g as DialogClose, gt as TableCell, h as Dialog, ht as TableCaption, i as AvatarImage, it as SelectTrigger, j as DropdownMenuLabel, jt as ThemeToggle, k as DropdownMenuGroup, kt as TextShimmer, l as CardDescription, lt as SkeletonTable, m as CopyButton, mt as TableBody, n as Avatar, nt as SelectScrollUpButton, o as Button, ot as SidebarDropZone, p as CodeBlock, pt as Table, q as MetricStrip, r as AvatarFallback, rt as SelectSeparator, s as Card, st as Skeleton, tt as SelectScrollDownButton, u as CardFooter, ut as StatCard, v as DialogDescription, vt as TableHead, w as DialogTrigger, wt as TabsTrigger, x as DialogOverlay, xt as Tabs, y as DialogFooter, yt as TableHeader, z as DropdownMenuSubTrigger, zt as useToast } from "./primitives-Dh1vG6J3.js";
3
3
  import { t as WorkspacePaneHeader } from "./workspace-pane-header-Bg1cCcHX.js";
4
4
  import { _ as TerminalPanel, a as AuditResults, b as DirectoryPane, c as SessionActivityMonitor, d as SessionSidebar, f as SESSION_CREATED_EVENT, g as RuntimePane, h as formatRelativeAge, i as TaskBoard, l as createShellShouldRevalidate, m as useOptimisticSessionItems, n as ApprovalQueue, o as AgentWorkbench, p as dispatchSessionCreated, r as CalendarView, s as SandboxWorkbench, t as ArtifactPane, u as shellShouldRevalidate, v as StatusBar, x as WorkspaceLayout, y as StatusBanner } from "./workspace-Pq-koOTW.js";
5
- import { $ as SidebarRailNav, A as ResourceMeter, B as RailFlyout, C as InvoiceTable, D as canAdminSandbox, E as SandboxCard, F as CreditBalance, G as Sidebar, H as RailModeButton, I as ProfileAvatar, J as SidebarPanelContent, K as SidebarContent, L as RailButton, M as INSUFFICIENT_BALANCE_CODE, N as OutOfCreditsModal, O as ActivityFeed, P as parseInsufficientBalance, Q as SidebarRailHeader, R as RailCollapseToggle, S as PlanCards, T as NewSandboxCard, U as RailSeparator, V as RailHeader, W as RailThemeToggle, X as SidebarRail, Y as SidebarPanelHeader, Z as SidebarRailFooter, _ as HarnessPicker, a as ProcessList, at as SIDEBAR_TOTAL_WIDTH, b as HarnessLogo, c as UsageSummary, d as MetricAreaChart, et as RailTooltip, f as ProfileComparison, g as HARNESS_OPTIONS, h as DashboardLayout, i as NetworkConfig, it as SIDEBAR_RAIL_WIDTH, j as ClusterStatusBar, k as ResourceSnapshot, l as SystemLogsViewer, m as SidebarLayout, n as SnapshotList, nt as SIDEBAR_PANEL_WIDTH, o as PortsList, ot as SidebarProvider, p as ProfileSelector, q as SidebarPanel, r as BackendConfig, rt as SIDEBAR_RAIL_LABELED_WIDTH, s as GitPanel, st as useSidebar, t as PromoBanner, tt as SIDEBAR_MOBILE_WIDTH, u as VariantList, v as chatCapableHarnesses, w as SandboxTable, x as BackendSelector, y as HARNESS_BRAND, z as RailExpandable } from "./dashboard-CqyJQc7V.js";
5
+ import { $ as SidebarRailNav, A as ResourceMeter, B as RailFlyout, C as InvoiceTable, D as canAdminSandbox, E as SandboxCard, F as CreditBalance, G as Sidebar, H as RailModeButton, I as ProfileAvatar, J as SidebarPanelContent, K as SidebarContent, L as RailButton, M as INSUFFICIENT_BALANCE_CODE, N as OutOfCreditsModal, O as ActivityFeed, P as parseInsufficientBalance, Q as SidebarRailHeader, R as RailCollapseToggle, S as PlanCards, T as NewSandboxCard, U as RailSeparator, V as RailHeader, W as RailThemeToggle, X as SidebarRail, Y as SidebarPanelHeader, Z as SidebarRailFooter, _ as HarnessPicker, a as ProcessList, at as SIDEBAR_TOTAL_WIDTH, b as HarnessLogo, c as UsageSummary, d as MetricAreaChart, et as RailTooltip, f as ProfileComparison, g as HARNESS_OPTIONS, h as DashboardLayout, i as NetworkConfig, it as SIDEBAR_RAIL_WIDTH, j as ClusterStatusBar, k as ResourceSnapshot, l as SystemLogsViewer, m as SidebarLayout, n as SnapshotList, nt as SIDEBAR_PANEL_WIDTH, o as PortsList, ot as SidebarProvider, p as ProfileSelector, q as SidebarPanel, r as BackendConfig, rt as SIDEBAR_RAIL_LABELED_WIDTH, s as GitPanel, st as useSidebar, t as PromoBanner, tt as SIDEBAR_MOBILE_WIDTH, u as VariantList, v as chatCapableHarnesses, w as SandboxTable, x as BackendSelector, y as HARNESS_BRAND, z as RailExpandable } from "./dashboard-Bx27mUVe.js";
6
6
  import { n as canonicalModelId, r as modelBrandFor, t as ModelBrandStack } from "./model-brand-hMyDTUqB.js";
7
7
  import { a as formatPrice, i as PricingPage, n as TemplateCard, o as BillingDashboard, r as UsageChart, t as InfoPanel } from "./info-panel-C9cqDzOL.js";
8
8
  import { t as usePtySession } from "./use-pty-session-Bf4hBLXJ.js";
package/dist/styles.css CHANGED
@@ -971,6 +971,9 @@
971
971
  .max-h-\[90vh\] {
972
972
  max-height: 90vh;
973
973
  }
974
+ .max-h-\[min\(60vh\,35rem\)\] {
975
+ max-height: min(60vh, 35rem);
976
+ }
974
977
  .max-h-\[min\(60vh\,420px\)\] {
975
978
  max-height: min(60vh, 420px);
976
979
  }
@@ -1310,9 +1313,27 @@
1310
1313
  .max-w-6xl {
1311
1314
  max-width: var(--container-6xl);
1312
1315
  }
1316
+ .max-w-26 {
1317
+ max-width: calc(var(--spacing) * 26);
1318
+ }
1319
+ .max-w-28 {
1320
+ max-width: calc(var(--spacing) * 28);
1321
+ }
1322
+ .max-w-36 {
1323
+ max-width: calc(var(--spacing) * 36);
1324
+ }
1313
1325
  .max-w-40 {
1314
1326
  max-width: calc(var(--spacing) * 40);
1315
1327
  }
1328
+ .max-w-44 {
1329
+ max-width: calc(var(--spacing) * 44);
1330
+ }
1331
+ .max-w-48 {
1332
+ max-width: calc(var(--spacing) * 48);
1333
+ }
1334
+ .max-w-64 {
1335
+ max-width: calc(var(--spacing) * 64);
1336
+ }
1316
1337
  .max-w-80 {
1317
1338
  max-width: calc(var(--spacing) * 80);
1318
1339
  }
@@ -1430,6 +1451,9 @@
1430
1451
  .max-w-\[1050px\] {
1431
1452
  max-width: 1050px;
1432
1453
  }
1454
+ .max-w-\[1086px\] {
1455
+ max-width: 1086px;
1456
+ }
1433
1457
  .max-w-\[1100px\] {
1434
1458
  max-width: 1100px;
1435
1459
  }
@@ -5061,6 +5085,12 @@
5061
5085
  .\[\&_svg\]\:shrink-0 svg {
5062
5086
  flex-shrink: 0;
5063
5087
  }
5088
+ .\[\&_td\]\:px-4 td {
5089
+ padding-inline: calc(var(--spacing) * 4);
5090
+ }
5091
+ .\[\&_th\]\:px-4 th {
5092
+ padding-inline: calc(var(--spacing) * 4);
5093
+ }
5064
5094
  .\[\&_tr\]\:border-b tr {
5065
5095
  border-bottom-style: var(--tw-border-style);
5066
5096
  border-bottom-width: 1px;
@@ -1,5 +1,5 @@
1
1
  import { t as cn$1 } from "./utils-DzWbktWG.js";
2
- import { o as PortsList } from "./dashboard-CqyJQc7V.js";
2
+ import { o as PortsList } from "./dashboard-Bx27mUVe.js";
3
3
  import { n as TerminalView } from "./terminal-DmSUfGha.js";
4
4
  import { RichFileTree } from "./files.js";
5
5
  import { n as PreviewView } from "./embedded-app-view-CoiS_kfY.js";
package/dist/workbench.js CHANGED
@@ -1,3 +1,3 @@
1
- import { a as computeDiffStats, c as BRAND_PRISM_THEME, d as DiffStatsBadge, f as GitStatusBadge, i as buildUnifiedPatch, l as CodeSurface, m as PillTabs, n as SandboxArtifactPane, o as CodeView, p as PanelHeader, r as DiffView, s as FileBreadcrumb, t as ChangesPane, u as resolveLanguage } from "./workbench-DJlOqodW.js";
1
+ import { a as computeDiffStats, c as BRAND_PRISM_THEME, d as DiffStatsBadge, f as GitStatusBadge, i as buildUnifiedPatch, l as CodeSurface, m as PillTabs, n as SandboxArtifactPane, o as CodeView, p as PanelHeader, r as DiffView, s as FileBreadcrumb, t as ChangesPane, u as resolveLanguage } from "./workbench-BbeBgtUT.js";
2
2
  import { n as PreviewView, t as EmbeddedAppView } from "./embedded-app-view-CoiS_kfY.js";
3
3
  export { BRAND_PRISM_THEME, ChangesPane, CodeSurface, CodeView, DiffStatsBadge, DiffView, EmbeddedAppView, FileBreadcrumb, GitStatusBadge, PanelHeader, PillTabs, PreviewView, SandboxArtifactPane, buildUnifiedPatch, computeDiffStats, resolveLanguage };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tangle-network/sandbox-ui",
3
- "version": "0.116.4",
3
+ "version": "0.116.5",
4
4
  "description": "Unified UI component library for Tangle Sandbox — primitives, chat, dashboard, terminal, editor, and workspace components",
5
5
  "repository": {
6
6
  "type": "git",