@tangle-network/sandbox-ui 0.13.0 → 0.15.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.
Files changed (106) hide show
  1. package/dist/auth.d.ts +1 -74
  2. package/dist/auth.js +1 -4
  3. package/dist/chat.d.ts +1 -136
  4. package/dist/chat.js +2 -15
  5. package/dist/chunk-2BUPSB7O.js +0 -0
  6. package/dist/chunk-3J6FG3FJ.js +18 -0
  7. package/dist/chunk-76IQLPW2.js +206 -0
  8. package/dist/chunk-7ZA5SEK3.js +239 -0
  9. package/dist/{chunk-ESVYBDGA.js → chunk-AG7QDC2Q.js} +182 -2
  10. package/dist/chunk-AHBZCBDO.js +2960 -0
  11. package/dist/chunk-AZ3AWMTM.js +8 -0
  12. package/dist/chunk-CMY7W45U.js +380 -0
  13. package/dist/{chunk-QMU2PWOU.js → chunk-DNZ4DTNA.js} +71 -17
  14. package/dist/chunk-EI44GEQ5.js +6 -0
  15. package/dist/{chunk-5OQ27N57.js → chunk-GPT7VKK6.js} +34 -38
  16. package/dist/chunk-JBGKGLD7.js +16 -0
  17. package/dist/chunk-NJNME4J4.js +14 -0
  18. package/dist/chunk-QPAJR74X.js +20 -0
  19. package/dist/chunk-TK46XFLM.js +28 -0
  20. package/dist/chunk-WID73FPH.js +89 -0
  21. package/dist/chunk-YVXK4XRO.js +30 -0
  22. package/dist/dashboard.d.ts +538 -4
  23. package/dist/dashboard.js +15 -886
  24. package/dist/editor.d.ts +1 -120
  25. package/dist/editor.js +1 -5
  26. package/dist/files.d.ts +1 -129
  27. package/dist/files.js +2 -7
  28. package/dist/globals.css +5 -1265
  29. package/dist/hooks.d.ts +114 -11
  30. package/dist/hooks.js +17 -88
  31. package/dist/index.d.ts +24 -99
  32. package/dist/index.js +247 -252
  33. package/dist/markdown.d.ts +1 -29
  34. package/dist/markdown.js +2 -2
  35. package/dist/openui.d.ts +8 -115
  36. package/dist/openui.js +1 -6
  37. package/dist/pages.d.ts +1 -2
  38. package/dist/pages.js +68 -66
  39. package/dist/primitives.d.ts +14 -49
  40. package/dist/primitives.js +69 -77
  41. package/dist/run.d.ts +1 -14
  42. package/dist/run.js +2 -22
  43. package/dist/sdk-hooks.d.ts +3 -283
  44. package/dist/sdk-hooks.js +10 -14
  45. package/dist/stores.d.ts +2 -14
  46. package/dist/stores.js +11 -39
  47. package/dist/styles.css +5 -1265
  48. package/dist/{usage-chart-CPTcNlGs.d.ts → template-card-UhV3pmRC.d.ts} +16 -1
  49. package/dist/terminal.js +39 -2
  50. package/dist/types.d.ts +11 -8
  51. package/dist/types.js +1 -0
  52. package/dist/utils.d.ts +1 -44
  53. package/dist/utils.js +6 -12
  54. package/dist/workspace.d.ts +5 -10
  55. package/dist/workspace.js +3 -19
  56. package/package.json +23 -54
  57. package/dist/active-sessions-store-CeOmXgv5.d.ts +0 -85
  58. package/dist/artifact-pane-Bh45Ssco.d.ts +0 -24
  59. package/dist/branding-DCi5VEik.d.ts +0 -13
  60. package/dist/button-CMQuQEW_.d.ts +0 -17
  61. package/dist/chat-container-f4yEs6KN.d.ts +0 -106
  62. package/dist/chunk-34A66VBG.js +0 -214
  63. package/dist/chunk-34I7UFSX.js +0 -92
  64. package/dist/chunk-36QY2W5G.js +0 -802
  65. package/dist/chunk-4CLN43XT.js +0 -45
  66. package/dist/chunk-54SQQMMM.js +0 -156
  67. package/dist/chunk-66EZOYZR.js +0 -102
  68. package/dist/chunk-BX6AQMUS.js +0 -183
  69. package/dist/chunk-DI3NZ5ZX.js +0 -192
  70. package/dist/chunk-DPGIXDAI.js +0 -220
  71. package/dist/chunk-DXMIEK4K.js +0 -1426
  72. package/dist/chunk-GSZA3TSY.js +0 -79
  73. package/dist/chunk-HB5Y37YU.js +0 -54
  74. package/dist/chunk-LQNEZDRM.js +0 -109
  75. package/dist/chunk-MA7YKRUP.js +0 -131
  76. package/dist/chunk-MKTSMWVD.js +0 -109
  77. package/dist/chunk-MQXABZTB.js +0 -1348
  78. package/dist/chunk-MT5FJ3ZT.js +0 -186
  79. package/dist/chunk-NKUPJC34.js +0 -2070
  80. package/dist/chunk-OEX7NZE3.js +0 -321
  81. package/dist/chunk-OKLQVY3Y.js +0 -139
  82. package/dist/chunk-Q56BYXQF.js +0 -61
  83. package/dist/chunk-QD4QE5P5.js +0 -40
  84. package/dist/chunk-QDH5GEGY.js +0 -630
  85. package/dist/chunk-QID2OOMG.js +0 -133
  86. package/dist/chunk-RQHJBTEU.js +0 -10
  87. package/dist/chunk-T7HMZEVO.js +0 -216
  88. package/dist/chunk-U6QTHMY6.js +0 -1290
  89. package/dist/chunk-US6JKJKH.js +0 -124
  90. package/dist/chunk-VX3XOUEB.js +0 -63
  91. package/dist/chunk-XLG757B6.js +0 -933
  92. package/dist/chunk-ZMNSRDMH.js +0 -127
  93. package/dist/chunk-ZNCEM5CD.js +0 -316
  94. package/dist/document-editor-pane-A70-EhdQ.d.ts +0 -124
  95. package/dist/document-editor-pane-TLPVRBBU.js +0 -11
  96. package/dist/expanded-tool-detail-Dh99mcbY.d.ts +0 -63
  97. package/dist/file-tabs-BLfxfmAH.d.ts +0 -51
  98. package/dist/parts-CyGkM6Fp.d.ts +0 -50
  99. package/dist/run-CtFZ6s-D.d.ts +0 -41
  100. package/dist/sidebar-drop-zone-tDBsuOH5.d.ts +0 -301
  101. package/dist/sidecar-CFU2W9j1.d.ts +0 -8
  102. package/dist/template-card-BAtvcAkU.d.ts +0 -18
  103. package/dist/tool-call-feed-Bs3MyQMT.d.ts +0 -68
  104. package/dist/tool-display-Ct9nFAzJ.d.ts +0 -32
  105. package/dist/use-sandbox-metrics-B64diPqN.d.ts +0 -141
  106. package/dist/variant-list-BrHYcBCk.d.ts +0 -540
@@ -1,4 +1,5 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import * as React from 'react';
2
3
 
3
4
  interface BillingSubscription {
4
5
  status: string;
@@ -70,4 +71,18 @@ interface UsageChartProps {
70
71
  }
71
72
  declare function UsageChart({ data, title, unit, className }: UsageChartProps): react_jsx_runtime.JSX.Element;
72
73
 
73
- export { type BillingSubscription as B, type PricingTier as P, type UsageDataPoint as U, type BillingBalance as a, type BillingUsage as b, BillingDashboard as c, type BillingDashboardProps as d, PricingPage as e, type PricingPageProps as f, UsageChart as g, type UsageChartProps as h, formatPrice as i };
74
+ interface TemplateCardData {
75
+ id: string;
76
+ name: string;
77
+ description: string;
78
+ icon?: React.ReactNode;
79
+ tags?: string[];
80
+ }
81
+ interface TemplateCardProps {
82
+ template: TemplateCardData;
83
+ onUseTemplate: (templateId: string) => void;
84
+ className?: string;
85
+ }
86
+ declare function TemplateCard({ template, onUseTemplate, className }: TemplateCardProps): react_jsx_runtime.JSX.Element;
87
+
88
+ export { type BillingBalance as B, PricingPage as P, TemplateCard as T, UsageChart as U, BillingDashboard as a, type BillingDashboardProps as b, type BillingSubscription as c, type BillingUsage as d, type PricingPageProps as e, type PricingTier as f, type TemplateCardData as g, type TemplateCardProps as h, type UsageChartProps as i, type UsageDataPoint as j, formatPrice as k };
package/dist/terminal.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  usePtySession
3
- } from "./chunk-ESVYBDGA.js";
3
+ } from "./chunk-AG7QDC2Q.js";
4
4
 
5
5
  // src/terminal/terminal-view.tsx
6
6
  import "@xterm/xterm/css/xterm.css";
@@ -48,8 +48,19 @@ function TerminalView({
48
48
  const containerRef = useRef(null);
49
49
  const termRef = useRef(null);
50
50
  const fitAddonRef = useRef(null);
51
+ const pendingWritesRef = useRef([]);
52
+ const writeRafRef = useRef(null);
51
53
  const onData = useCallback((data) => {
52
- termRef.current?.write(data);
54
+ if (!data) return;
55
+ pendingWritesRef.current.push(data);
56
+ if (writeRafRef.current !== null) return;
57
+ writeRafRef.current = requestAnimationFrame(() => {
58
+ writeRafRef.current = null;
59
+ const chunks = pendingWritesRef.current;
60
+ if (chunks.length === 0) return;
61
+ pendingWritesRef.current = [];
62
+ termRef.current?.write(chunks.length === 1 ? chunks[0] : chunks.join(""));
63
+ });
53
64
  }, []);
54
65
  const { isConnected, error, sendCommand, resizeTerminal, reconnect } = usePtySession({
55
66
  apiUrl,
@@ -74,6 +85,25 @@ function TerminalView({
74
85
  term.loadAddon(fitAddon);
75
86
  term.loadAddon(webLinksAddon);
76
87
  term.open(containerRef.current);
88
+ let webglAddon = null;
89
+ let webglCancelled = false;
90
+ void (async () => {
91
+ try {
92
+ const mod = await import("@xterm/addon-webgl");
93
+ if (webglCancelled) return;
94
+ try {
95
+ const addon = new mod.WebglAddon();
96
+ addon.onContextLoss(() => {
97
+ webglAddon?.dispose();
98
+ webglAddon = null;
99
+ });
100
+ webglAddon = addon;
101
+ term.loadAddon(addon);
102
+ } catch {
103
+ }
104
+ } catch {
105
+ }
106
+ })();
77
107
  requestAnimationFrame(() => {
78
108
  fitAddon.fit();
79
109
  });
@@ -102,7 +132,14 @@ function TerminalView({
102
132
  });
103
133
  ro.observe(containerRef.current);
104
134
  return () => {
135
+ webglCancelled = true;
105
136
  ro.disconnect();
137
+ if (writeRafRef.current !== null) {
138
+ cancelAnimationFrame(writeRafRef.current);
139
+ writeRafRef.current = null;
140
+ }
141
+ pendingWritesRef.current = [];
142
+ webglAddon?.dispose();
106
143
  term.dispose();
107
144
  termRef.current = null;
108
145
  fitAddonRef.current = null;
package/dist/types.d.ts CHANGED
@@ -1,8 +1,11 @@
1
- export { R as ReasoningPart, S as SessionMessage, a as SessionPart, T as TextPart, b as ToolPart, c as ToolState, d as ToolStatus, e as ToolTime } from './parts-CyGkM6Fp.js';
2
- export { F as FinalTextPart, G as GroupedMessage, M as MessageRun, a as MessageUser, R as Run, b as RunStats, T as ToolCategory } from './run-CtFZ6s-D.js';
3
- export { S as Session } from './sidecar-CFU2W9j1.js';
4
- export { C as CustomToolRenderer, D as DisplayVariant, T as ToolDisplayMetadata } from './tool-display-Ct9nFAzJ.js';
5
- export { A as AgentBranding } from './branding-DCi5VEik.js';
6
- export { A as ActiveProjectActivity, a as ActiveSessionActivityOptions, b as ActiveSessionConnectionOptions, c as ActiveSessionConnectionState, d as ActiveSessionReconnectState, e as ActiveSessionRecord, f as ActiveSessionStatus, g as ActiveSessionTransportMode, h as ActiveSessionsState, R as RegisterActiveSessionOptions, S as SessionProjectKey } from './active-sessions-store-CeOmXgv5.js';
7
- import 'react';
8
- import 'nanostores';
1
+ export { AgentBranding, CustomToolRenderer, DisplayVariant, FinalTextPart, GroupedMessage, MessageRun, MessageUser, ReasoningPart, Run, RunStats, SessionMessage, SessionPart, TextPart, ToolCategory, ToolDisplayMetadata, ToolPart, ToolState, ToolStatus, ToolTime } from '@tangle-network/ui/types';
2
+ export { ActiveProjectActivity, ActiveSessionActivityOptions, ActiveSessionConnectionOptions, ActiveSessionConnectionState, ActiveSessionReconnectState, ActiveSessionRecord, ActiveSessionStatus, ActiveSessionTransportMode, ActiveSessionsState, RegisterActiveSessionOptions, SessionProjectKey } from '@tangle-network/ui/stores';
3
+
4
+ /** A chat session on the sidecar session gateway. */
5
+ interface Session {
6
+ id: string;
7
+ title: string;
8
+ parentID?: string;
9
+ }
10
+
11
+ export type { Session };
package/dist/types.js CHANGED
@@ -0,0 +1 @@
1
+ import "./chunk-2BUPSB7O.js";
package/dist/utils.d.ts CHANGED
@@ -1,44 +1 @@
1
- import { b as ToolPart } from './parts-CyGkM6Fp.js';
2
- import { T as ToolDisplayMetadata } from './tool-display-Ct9nFAzJ.js';
3
- import { T as ToolCategory } from './run-CtFZ6s-D.js';
4
- import { ClassValue } from 'clsx';
5
- import 'react';
6
-
7
- declare function cn(...inputs: ClassValue[]): string;
8
-
9
- /**
10
- * Copy text to clipboard with a non-secure-context fallback.
11
- * Returns true if a copy strategy likely succeeded.
12
- */
13
- declare function copyText(text: string): Promise<boolean>;
14
-
15
- /** Format a duration in milliseconds to a human-readable string. */
16
- declare function formatDuration(ms: number): string;
17
- /** Truncate text to `max` characters, appending "..." if truncated. */
18
- declare function truncateText(text: string, max: number): string;
19
- /**
20
- * Format an uptime duration in milliseconds with progressive
21
- * granularity, so short-lived sandboxes don't render as "0d 0h".
22
- * - < 60s → "Ns"
23
- * - < 60m → "Nm Ss"
24
- * - < 24h → "Nh Mm"
25
- * - otherwise → "Nd Hh"
26
- */
27
- declare function formatUptime(ms: number): string;
28
- /**
29
- * Format a byte count using binary units (KiB/MiB/GiB, surfaced as
30
- * "KB/MB/GB" for readability). KB and MB use one decimal below 10 and
31
- * round above; GB keeps two decimals below 10 so half-GB changes stay
32
- * visible on memory dashboards, and drops to one decimal above.
33
- */
34
- declare function formatBytes(bytes: number): string;
35
-
36
- declare function timeAgo(ts: number): string;
37
-
38
- declare const TOOL_CATEGORY_ICONS: Record<ToolCategory, string>;
39
- declare function getToolCategory(toolName: string): ToolCategory;
40
- declare function getToolDisplayMetadata(part: ToolPart): ToolDisplayMetadata;
41
- /** Extract error text from a tool part, if any. */
42
- declare function getToolErrorText(part: ToolPart, fallback?: string): string | undefined;
43
-
44
- export { TOOL_CATEGORY_ICONS, cn, copyText, formatBytes, formatDuration, formatUptime, getToolCategory, getToolDisplayMetadata, getToolErrorText, timeAgo, truncateText };
1
+ export { TOOL_CATEGORY_ICONS, cn, copyText, formatBytes, formatDuration, formatUptime, getToolCategory, getToolDisplayMetadata, getToolErrorText, timeAgo, truncateText } from '@tangle-network/ui/utils';
package/dist/utils.js CHANGED
@@ -1,22 +1,16 @@
1
1
  import {
2
+ TOOL_CATEGORY_ICONS,
3
+ cn,
2
4
  copyText,
3
- timeAgo
4
- } from "./chunk-QD4QE5P5.js";
5
- import {
6
5
  formatBytes,
7
6
  formatDuration,
8
7
  formatUptime,
9
- truncateText
10
- } from "./chunk-4CLN43XT.js";
11
- import {
12
- TOOL_CATEGORY_ICONS,
13
8
  getToolCategory,
14
9
  getToolDisplayMetadata,
15
- getToolErrorText
16
- } from "./chunk-BX6AQMUS.js";
17
- import {
18
- cn
19
- } from "./chunk-RQHJBTEU.js";
10
+ getToolErrorText,
11
+ timeAgo,
12
+ truncateText
13
+ } from "./chunk-TK46XFLM.js";
20
14
  export {
21
15
  TOOL_CATEGORY_ICONS,
22
16
  cn,
@@ -1,15 +1,10 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import { ReactNode } from 'react';
3
- export { a as ArtifactPane, A as ArtifactPaneProps } from './artifact-pane-Bh45Ssco.js';
4
- import { F as FileNode, f as FileTreeVisibilityOptions, a as FileTabData } from './file-tabs-BLfxfmAH.js';
5
- import { S as SessionProjectKey, f as ActiveSessionStatus, e as ActiveSessionRecord } from './active-sessions-store-CeOmXgv5.js';
6
- import { a as ChatContainerProps } from './chat-container-f4yEs6KN.js';
7
- import { OpenUIComponentNode, OpenUIAction } from './openui.js';
8
- import 'nanostores';
9
- import './parts-CyGkM6Fp.js';
10
- import './branding-DCi5VEik.js';
11
- import './tool-display-Ct9nFAzJ.js';
12
- import './run-CtFZ6s-D.js';
3
+ export { ArtifactPane, ArtifactPaneProps } from '@tangle-network/ui/primitives';
4
+ import { FileNode, FileTreeVisibilityOptions, FileTabData } from '@tangle-network/ui/files';
5
+ import { SessionProjectKey, ActiveSessionStatus, ActiveSessionRecord } from '@tangle-network/ui/stores';
6
+ import { ChatContainerProps } from '@tangle-network/ui/chat';
7
+ import { OpenUIComponentNode, OpenUIAction } from '@tangle-network/ui/openui';
13
8
 
14
9
  interface WorkspaceLayoutProps {
15
10
  /** Left sidebar content (file tree, navigation) */
package/dist/workspace.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import {
2
2
  AgentWorkbench,
3
3
  ApprovalQueue,
4
+ ArtifactPane,
4
5
  AuditResults,
5
6
  CalendarView,
6
7
  DirectoryPane,
@@ -13,25 +14,8 @@ import {
13
14
  TaskBoard,
14
15
  TerminalPanel,
15
16
  WorkspaceLayout
16
- } from "./chunk-5OQ27N57.js";
17
- import "./chunk-OEX7NZE3.js";
18
- import "./chunk-MA7YKRUP.js";
19
- import "./chunk-XLG757B6.js";
20
- import "./chunk-54SQQMMM.js";
21
- import "./chunk-MQXABZTB.js";
22
- import "./chunk-4CLN43XT.js";
23
- import "./chunk-MT5FJ3ZT.js";
24
- import "./chunk-BX6AQMUS.js";
25
- import "./chunk-ZNCEM5CD.js";
26
- import "./chunk-34I7UFSX.js";
27
- import "./chunk-QDH5GEGY.js";
28
- import {
29
- ArtifactPane
30
- } from "./chunk-HB5Y37YU.js";
31
- import "./chunk-T7HMZEVO.js";
32
- import "./chunk-ZMNSRDMH.js";
33
- import "./chunk-MKTSMWVD.js";
34
- import "./chunk-RQHJBTEU.js";
17
+ } from "./chunk-GPT7VKK6.js";
18
+ import "./chunk-EI44GEQ5.js";
35
19
  export {
36
20
  AgentWorkbench,
37
21
  ApprovalQueue,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tangle-network/sandbox-ui",
3
- "version": "0.13.0",
3
+ "version": "0.15.1",
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",
@@ -102,10 +102,12 @@
102
102
  "storybook": "storybook dev -p 6006",
103
103
  "build-storybook": "storybook build",
104
104
  "test": "vitest run",
105
- "test:watch": "vitest"
105
+ "test:watch": "vitest",
106
+ "test:bridge": "pnpm build && vitest run src/__tests__/re-export-identity.test.ts"
106
107
  },
107
108
  "peerDependencies": {
108
- "@tangle-network/brand": "^0.2.0",
109
+ "@tangle-network/brand": "^0.3.0",
110
+ "@tangle-network/ui": "^1.0.1",
109
111
  "react": "^18 || ^19",
110
112
  "react-dom": "^18 || ^19"
111
113
  },
@@ -119,63 +121,21 @@
119
121
  "@xterm/addon-web-links": {
120
122
  "optional": true
121
123
  },
122
- "@tanstack/react-query": {
124
+ "@xterm/addon-webgl": {
123
125
  "optional": true
124
126
  },
125
- "nanostores": {
126
- "optional": true
127
- },
128
- "@nanostores/react": {
129
- "optional": true
130
- },
131
- "@hocuspocus/provider": {
132
- "optional": true
133
- },
134
- "@tiptap/core": {
135
- "optional": true
136
- },
137
- "@tiptap/react": {
138
- "optional": true
139
- },
140
- "@tiptap/starter-kit": {
141
- "optional": true
142
- },
143
- "@tiptap/extension-collaboration": {
144
- "optional": true
145
- },
146
- "@tiptap/extension-collaboration-caret": {
127
+ "@tanstack/react-query": {
147
128
  "optional": true
148
129
  },
149
- "yjs": {
130
+ "nanostores": {
150
131
  "optional": true
151
132
  }
152
133
  },
153
134
  "dependencies": {
154
- "@nanostores/react": "^1.1.0",
155
- "@pierre/trees": "1.0.0-beta.3",
156
- "@radix-ui/react-avatar": "^1.1.0",
157
- "@radix-ui/react-collapsible": "^1.1.0",
158
- "@radix-ui/react-dialog": "^1.1.0",
159
135
  "@radix-ui/react-dropdown-menu": "^2.1.0",
160
- "@radix-ui/react-label": "^2.1.0",
161
- "@radix-ui/react-progress": "^1.1.0",
162
136
  "@radix-ui/react-select": "^2.1.0",
163
- "@radix-ui/react-slot": "^1.1.0",
164
- "@radix-ui/react-switch": "^1.1.0",
165
- "@radix-ui/react-tabs": "^1.1.0",
166
- "@radix-ui/react-toast": "^1.2.0",
167
- "class-variance-authority": "^0.7.0",
168
- "clsx": "^2.1.1",
169
137
  "lucide-react": "^0.469.0",
170
- "marked": "^17.0.5",
171
- "nanostores": "^1.2.0",
172
- "react-markdown": "^10.1.0",
173
- "react-pdf": "^9.2.1",
174
- "react-syntax-highlighter": "^16.1.1",
175
- "rehype-sanitize": "^6.0.0",
176
- "remark-gfm": "^4.0.1",
177
- "tailwind-merge": "^3.0.2",
178
- "turndown": "^7.2.2"
138
+ "nanostores": "^1.2.0"
179
139
  },
180
140
  "pnpm": {
181
141
  "overrides": {
@@ -184,13 +144,16 @@
184
144
  },
185
145
  "devDependencies": {
186
146
  "@hocuspocus/provider": "^3.4.4",
147
+ "@nanostores/react": "^1.1.0",
148
+ "@pierre/trees": "1.0.0-beta.3",
187
149
  "@storybook/addon-essentials": "^8",
188
150
  "@storybook/addon-mcp": "^0.4.2",
189
151
  "@storybook/react": "^8.6.18",
190
152
  "@storybook/react-vite": "^8.6.18",
191
153
  "@tailwindcss/postcss": "^4.2.2",
192
154
  "@tailwindcss/vite": "^4.2.2",
193
- "@tangle-network/brand": "^0.2.0",
155
+ "@tangle-network/brand": "^0.3.0",
156
+ "@tangle-network/ui": "^1.0.1",
194
157
  "@tanstack/react-query": "^5.91.0",
195
158
  "@testing-library/dom": "^10.4.1",
196
159
  "@testing-library/jest-dom": "^6.9.1",
@@ -202,12 +165,19 @@
202
165
  "@tiptap/react": "^3.20.4",
203
166
  "@tiptap/starter-kit": "^3.20.4",
204
167
  "@types/react": "^19.1.2",
205
- "@types/react-syntax-highlighter": "^15.5.13",
206
- "@types/turndown": "^5.0.6",
207
168
  "@xterm/addon-fit": "^0.11.0",
208
169
  "@xterm/addon-web-links": "^0.12.0",
170
+ "@xterm/addon-webgl": "^0.19.0",
209
171
  "@xterm/xterm": "^6.0.0",
210
172
  "jsdom": "^29.0.2",
173
+ "marked": "^17.0.5",
174
+ "react-markdown": "^10.1.0",
175
+ "react-pdf": "^9.2.1",
176
+ "react-syntax-highlighter": "^16.1.1",
177
+ "rehype-sanitize": "^6.0.0",
178
+ "remark-gfm": "^4.0.1",
179
+ "turndown": "^7.2.2",
180
+ "yjs": "^13.6.30",
211
181
  "postcss": "^8.5.8",
212
182
  "postcss-import": "^16.1.1",
213
183
  "react": "^19.1.0",
@@ -218,7 +188,6 @@
218
188
  "tsup": "^8.4.0",
219
189
  "typescript": "^5.8.3",
220
190
  "vite": "^8.0.5",
221
- "vitest": "^4.1.3",
222
- "yjs": "^13.6.30"
191
+ "vitest": "^4.1.3"
223
192
  }
224
193
  }
@@ -1,85 +0,0 @@
1
- import * as nanostores from 'nanostores';
2
-
3
- type SessionProjectKey = string | number;
4
- type ActiveSessionStatus = "idle" | "running" | "attention-needed" | "error";
5
- type ActiveSessionReconnectState = "idle" | "reconnecting" | "failed";
6
- type ActiveSessionConnectionState = "disconnected" | "connecting" | "connected" | "reconnecting" | "error";
7
- type ActiveSessionTransportMode = "websocket" | "sse" | "polling" | "custom";
8
- interface ActiveSessionRecord {
9
- sessionId: string;
10
- projectId: SessionProjectKey | null;
11
- projectLabel?: string;
12
- title?: string;
13
- href?: string;
14
- registeredAt: number;
15
- lastActivityAt: number;
16
- lastEventAt: number | null;
17
- status: ActiveSessionStatus;
18
- isRunning: boolean;
19
- isForeground: boolean;
20
- needsAttention: boolean;
21
- connectionState: ActiveSessionConnectionState;
22
- reconnectState: ActiveSessionReconnectState;
23
- transportMode: ActiveSessionTransportMode | null;
24
- lastError: string | null;
25
- metadata?: Record<string, unknown>;
26
- }
27
- interface ActiveSessionsState {
28
- sessions: Record<string, ActiveSessionRecord>;
29
- lastUpdatedAt: number;
30
- }
31
- interface RegisterActiveSessionOptions {
32
- sessionId: string;
33
- projectId?: SessionProjectKey | null;
34
- projectLabel?: string;
35
- title?: string;
36
- href?: string;
37
- metadata?: Record<string, unknown>;
38
- }
39
- interface ActiveSessionConnectionOptions {
40
- connectionState: ActiveSessionConnectionState;
41
- reconnectState?: ActiveSessionReconnectState;
42
- transportMode?: ActiveSessionTransportMode | null;
43
- lastError?: string | null;
44
- lastEventAt?: number | null;
45
- }
46
- interface ActiveSessionActivityOptions {
47
- lastEventAt?: number | null;
48
- }
49
- interface ActiveProjectActivity {
50
- projectId: SessionProjectKey;
51
- projectLabel?: string;
52
- activeSessionCount: number;
53
- runningSessionIds: string[];
54
- lastActivityAt: number;
55
- }
56
- declare const activeSessionsAtom: nanostores.PreinitializedWritableAtom<ActiveSessionsState> & object;
57
- declare function registerActiveSession(options: RegisterActiveSessionOptions): void;
58
- declare function unregisterActiveSession(sessionId: string): void;
59
- declare function setForegroundActiveSession(sessionId: string | null): void;
60
- declare function updateActiveSessionMeta(sessionId: string, meta: Partial<Pick<ActiveSessionRecord, "title" | "href" | "projectId" | "projectLabel" | "metadata">>): void;
61
- declare function setActiveSessionConnection(sessionId: string, options: ActiveSessionConnectionOptions): void;
62
- declare function setActiveSessionRunning(sessionId: string, isRunning: boolean, options?: ActiveSessionActivityOptions): void;
63
- declare function setActiveSessionAttention(sessionId: string, needsAttention: boolean, options?: ActiveSessionActivityOptions): void;
64
- declare function setActiveSessionError(sessionId: string, error: string | null): void;
65
- declare function bumpActiveSessionActivity(sessionId: string, options?: ActiveSessionActivityOptions): void;
66
- declare function resetActiveSessions(): void;
67
- declare function getAllActiveSessions(state: ActiveSessionsState): ActiveSessionRecord[];
68
- declare function getActiveSession(state: ActiveSessionsState, sessionId: string): ActiveSessionRecord | null;
69
- declare function getSessionsForProject(state: ActiveSessionsState, projectId: SessionProjectKey): ActiveSessionRecord[];
70
- declare function getSessionsForNavbar(state: ActiveSessionsState, projectId?: SessionProjectKey | null): ActiveSessionRecord[];
71
- declare function getSessionsByActivity(state: ActiveSessionsState): ActiveSessionRecord[];
72
- declare function getTotalRunningSessionCount(state: ActiveSessionsState): number;
73
- declare function hasBackgroundRunningSessions(state: ActiveSessionsState): boolean;
74
- declare function getAllProjectActivity(state: ActiveSessionsState): ActiveProjectActivity[];
75
- declare function useActiveSessionsState(): ActiveSessionsState;
76
- declare function useActiveSessions(): ActiveSessionRecord[];
77
- declare function useActiveSession(sessionId: string | null): ActiveSessionRecord | null;
78
- declare function useProjectSessions(projectId: SessionProjectKey | null): ActiveSessionRecord[];
79
- declare function useNavbarSessions(projectId?: SessionProjectKey | null): ActiveSessionRecord[];
80
- declare function useSessionsByActivity(): ActiveSessionRecord[];
81
- declare function useProjectActivity(): ActiveProjectActivity[];
82
- declare function useTotalRunningSessions(): number;
83
- declare function useHasBackgroundRunningSessions(): boolean;
84
-
85
- export { type ActiveProjectActivity as A, updateActiveSessionMeta as B, useActiveSession as C, useActiveSessions as D, useActiveSessionsState as E, useHasBackgroundRunningSessions as F, useNavbarSessions as G, useProjectActivity as H, useProjectSessions as I, useSessionsByActivity as J, useTotalRunningSessions as K, type RegisterActiveSessionOptions as R, type SessionProjectKey as S, type ActiveSessionActivityOptions as a, type ActiveSessionConnectionOptions as b, type ActiveSessionConnectionState as c, type ActiveSessionReconnectState as d, type ActiveSessionRecord as e, type ActiveSessionStatus as f, type ActiveSessionTransportMode as g, type ActiveSessionsState as h, activeSessionsAtom as i, bumpActiveSessionActivity as j, getActiveSession as k, getAllActiveSessions as l, getAllProjectActivity as m, getSessionsByActivity as n, getSessionsForNavbar as o, getSessionsForProject as p, getTotalRunningSessionCount as q, hasBackgroundRunningSessions as r, registerActiveSession as s, resetActiveSessions as t, setActiveSessionAttention as u, setActiveSessionConnection as v, setActiveSessionError as w, setActiveSessionRunning as x, setForegroundActiveSession as y, unregisterActiveSession as z };
@@ -1,24 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { ReactNode } from 'react';
3
-
4
- interface ArtifactPaneProps {
5
- eyebrow?: ReactNode;
6
- title: ReactNode;
7
- subtitle?: ReactNode;
8
- meta?: ReactNode;
9
- headerActions?: ReactNode;
10
- tabs?: ReactNode;
11
- toolbar?: ReactNode;
12
- footer?: ReactNode;
13
- emptyState?: ReactNode;
14
- children?: ReactNode;
15
- className?: string;
16
- contentClassName?: string;
17
- }
18
- /**
19
- * ArtifactPane — shared frame for files, previews, documents, inspectors, and
20
- * other artifact-like surfaces inside sandbox applications.
21
- */
22
- declare function ArtifactPane({ eyebrow, title, subtitle, meta, headerActions, tabs, toolbar, footer, emptyState, children, className, contentClassName, }: ArtifactPaneProps): react_jsx_runtime.JSX.Element;
23
-
24
- export { type ArtifactPaneProps as A, ArtifactPane as a };
@@ -1,13 +0,0 @@
1
- /** Visual branding for a run group header — injected by consuming app. */
2
- interface AgentBranding {
3
- label: string;
4
- accentClass: string;
5
- bgClass: string;
6
- containerBgClass: string;
7
- borderClass: string;
8
- /** CSS class for the agent icon (legacy). Ignored when using lucide-react icons. */
9
- iconClass: string;
10
- textClass: string;
11
- }
12
-
13
- export type { AgentBranding as A };
@@ -1,17 +0,0 @@
1
- import * as class_variance_authority_types from 'class-variance-authority/types';
2
- import * as React from 'react';
3
-
4
- declare const buttonVariants: (props?: ({
5
- variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | "sandbox" | null | undefined;
6
- size?: "default" | "sm" | "lg" | "xl" | "icon" | null | undefined;
7
- } & class_variance_authority_types.ClassProp) | undefined) => string;
8
- interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
9
- variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | "sandbox" | null;
10
- size?: "default" | "sm" | "lg" | "xl" | "icon" | null;
11
- asChild?: boolean;
12
- loading?: boolean;
13
- children?: React.ReactNode;
14
- }
15
- declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
16
-
17
- export { Button as B, type ButtonProps as a, buttonVariants as b };
@@ -1,106 +0,0 @@
1
- import * as React from 'react';
2
- import { ReactNode } from 'react';
3
- import * as react_jsx_runtime from 'react/jsx-runtime';
4
- import { S as SessionMessage, a as SessionPart, b as ToolPart } from './parts-CyGkM6Fp.js';
5
- import { A as AgentBranding } from './branding-DCi5VEik.js';
6
- import { C as CustomToolRenderer } from './tool-display-Ct9nFAzJ.js';
7
- import { R as Run } from './run-CtFZ6s-D.js';
8
- import { OpenUIAction } from './openui.js';
9
-
10
- /**
11
- * ChatInput — message input bar with file attach, drag-and-drop, send/cancel.
12
- *
13
- * - Auto-resizing textarea (up to max height)
14
- * - Enter to send, Shift+Enter for newline
15
- * - Drag-and-drop files onto the input with styled overlay
16
- * - File attachment button (files) + folder attachment button
17
- * - Pending file/folder chips
18
- * - Cancel button when streaming
19
- * - Optional model selector pill
20
- */
21
- interface PendingFile {
22
- id: string;
23
- name: string;
24
- size: number;
25
- type: "file" | "folder";
26
- /** Number of files inside (for folders) */
27
- fileCount?: number;
28
- status: "pending" | "uploading" | "ready" | "error";
29
- }
30
- interface ChatInputProps {
31
- onSend: (message: string, files?: File[]) => void;
32
- onCancel?: () => void;
33
- isStreaming?: boolean;
34
- disabled?: boolean;
35
- placeholder?: string;
36
- /** Currently selected model label */
37
- modelLabel?: string;
38
- onModelClick?: () => void;
39
- /** Pending uploaded files */
40
- pendingFiles?: PendingFile[];
41
- onRemoveFile?: (id: string) => void;
42
- /** Called when files are attached (via button or drag-and-drop) */
43
- onAttach?: (files: FileList) => void;
44
- /** Called when a folder is selected via the folder button */
45
- onAttachFolder?: (files: FileList) => void;
46
- /** Accepted file types for the file input (e.g. ".pdf,.csv") */
47
- accept?: string;
48
- /** Drop zone overlay title */
49
- dropTitle?: string;
50
- /** Drop zone overlay description */
51
- dropDescription?: string;
52
- className?: string;
53
- /** Label above the input. Set to null to hide. Default: "Agent Command Deck" */
54
- inputLabel?: string | null;
55
- /** Status text shown when idle. Set to null to hide. Default: "Ready for next instruction" */
56
- idleStatus?: string | null;
57
- /** Status text shown when streaming. Set to null to hide. Default: "Streaming response" */
58
- streamingStatus?: string | null;
59
- /** Hide the Cmd+L focus shortcut hint */
60
- hideShortcutHint?: boolean;
61
- }
62
- declare function ChatInput({ onSend, onCancel, isStreaming, disabled, placeholder, modelLabel, onModelClick, pendingFiles, onRemoveFile, onAttach, onAttachFolder, accept, dropTitle, dropDescription, className, inputLabel, idleStatus, streamingStatus, hideShortcutHint, }: ChatInputProps): react_jsx_runtime.JSX.Element;
63
-
64
- interface ChatContainerProps {
65
- messages: SessionMessage[];
66
- partMap: Record<string, SessionPart[]>;
67
- isStreaming: boolean;
68
- onSend?: (text: string) => void;
69
- onCancel?: () => void;
70
- branding?: AgentBranding;
71
- placeholder?: string;
72
- className?: string;
73
- /** Hide the input area (useful for read-only views). */
74
- hideInput?: boolean;
75
- /** Custom renderer for tool details. Return ReactNode to override, null to use default. */
76
- renderToolDetail?: CustomToolRenderer;
77
- /** Presentation mode for the session view. */
78
- presentation?: "runs" | "timeline";
79
- modelLabel?: string;
80
- onModelClick?: () => void;
81
- pendingFiles?: PendingFile[];
82
- onRemoveFile?: (id: string) => void;
83
- onAttach?: (files: FileList) => void;
84
- disabled?: boolean;
85
- /** Callback when an OpenUI action button is pressed within inline OpenUI blocks. */
86
- onOpenUIAction?: (action: OpenUIAction) => void;
87
- /** Enable rendering OpenUI schemas inline in the chat timeline. Defaults to true. */
88
- enableOpenUI?: boolean;
89
- /** Optional actions rendered beside each grouped assistant run. */
90
- renderRunActions?: (run: Run) => ReactNode;
91
- /** Optional actions rendered below each user message bubble. */
92
- renderUserMessageActions?: (message: SessionMessage, parts: SessionPart[]) => ReactNode;
93
- /** Optional actions rendered beside individual tool items. */
94
- renderToolActions?: (part: ToolPart, options: {
95
- run: Run;
96
- messageId: string;
97
- partIndex: number;
98
- }) => ReactNode;
99
- }
100
- /**
101
- * Full chat container: message list + auto-scroll + input area.
102
- * Orchestrates useRunGroups, useRunCollapseState, and useAutoScroll.
103
- */
104
- declare const ChatContainer: React.MemoExoticComponent<({ messages, partMap, isStreaming, onSend, onCancel, branding, placeholder, className, hideInput, renderToolDetail, presentation, modelLabel, onModelClick, pendingFiles, onRemoveFile, onAttach, disabled, onOpenUIAction, enableOpenUI, renderRunActions, renderUserMessageActions, renderToolActions, }: ChatContainerProps) => react_jsx_runtime.JSX.Element>;
105
-
106
- export { ChatContainer as C, type PendingFile as P, type ChatContainerProps as a, ChatInput as b, type ChatInputProps as c };