@tanstack/ai-devtools-core 0.3.6 → 0.3.8
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/Shell/GHXECDJV.js +5056 -0
- package/dist/Shell/MUFU35SY.js +4242 -0
- package/dist/dev.js +11 -0
- package/dist/{esm/index.d.ts → index.d.ts} +7 -5
- package/dist/index.js +11 -0
- package/dist/production/Shell/GHXECDJV.js +5056 -0
- package/dist/production/Shell/MUFU35SY.js +4242 -0
- package/dist/production/dev.js +8 -0
- package/dist/production/index.d.ts +12 -0
- package/dist/production/index.js +8 -0
- package/dist/production/server.js +8 -0
- package/dist/server.js +11 -0
- package/package.json +45 -11
- package/src/{core.tsx → core.ts} +4 -5
- package/dist/esm/components/ConversationDetails.d.ts +0 -2
- package/dist/esm/components/ConversationDetails.js +0 -192
- package/dist/esm/components/ConversationDetails.js.map +0 -1
- package/dist/esm/components/ConversationsList.d.ts +0 -2
- package/dist/esm/components/ConversationsList.js +0 -30
- package/dist/esm/components/ConversationsList.js.map +0 -1
- package/dist/esm/components/Shell.d.ts +0 -1
- package/dist/esm/components/Shell.js +0 -94
- package/dist/esm/components/Shell.js.map +0 -1
- package/dist/esm/components/conversation/ActivityEventsTab.d.ts +0 -8
- package/dist/esm/components/conversation/ActivityEventsTab.js +0 -72
- package/dist/esm/components/conversation/ActivityEventsTab.js.map +0 -1
- package/dist/esm/components/conversation/ChunkBadges.d.ts +0 -7
- package/dist/esm/components/conversation/ChunkBadges.js +0 -54
- package/dist/esm/components/conversation/ChunkBadges.js.map +0 -1
- package/dist/esm/components/conversation/ChunkItem.d.ts +0 -9
- package/dist/esm/components/conversation/ChunkItem.js +0 -247
- package/dist/esm/components/conversation/ChunkItem.js.map +0 -1
- package/dist/esm/components/conversation/ChunksCollapsible.d.ts +0 -7
- package/dist/esm/components/conversation/ChunksCollapsible.js +0 -77
- package/dist/esm/components/conversation/ChunksCollapsible.js.map +0 -1
- package/dist/esm/components/conversation/ChunksTab.d.ts +0 -8
- package/dist/esm/components/conversation/ChunksTab.js +0 -87
- package/dist/esm/components/conversation/ChunksTab.js.map +0 -1
- package/dist/esm/components/conversation/ConversationHeader.d.ts +0 -7
- package/dist/esm/components/conversation/ConversationHeader.js +0 -230
- package/dist/esm/components/conversation/ConversationHeader.js.map +0 -1
- package/dist/esm/components/conversation/ConversationTabs.d.ts +0 -10
- package/dist/esm/components/conversation/ConversationTabs.js +0 -176
- package/dist/esm/components/conversation/ConversationTabs.js.map +0 -1
- package/dist/esm/components/conversation/MessageCard.d.ts +0 -7
- package/dist/esm/components/conversation/MessageCard.js +0 -207
- package/dist/esm/components/conversation/MessageCard.js.map +0 -1
- package/dist/esm/components/conversation/MessageGroup.d.ts +0 -15
- package/dist/esm/components/conversation/MessageGroup.js +0 -119
- package/dist/esm/components/conversation/MessageGroup.js.map +0 -1
- package/dist/esm/components/conversation/MessagesTab.d.ts +0 -7
- package/dist/esm/components/conversation/MessagesTab.js +0 -37
- package/dist/esm/components/conversation/MessagesTab.js.map +0 -1
- package/dist/esm/components/conversation/SummariesTab.d.ts +0 -7
- package/dist/esm/components/conversation/SummariesTab.js +0 -110
- package/dist/esm/components/conversation/SummariesTab.js.map +0 -1
- package/dist/esm/components/conversation/ToolCallDisplay.d.ts +0 -7
- package/dist/esm/components/conversation/ToolCallDisplay.js +0 -123
- package/dist/esm/components/conversation/ToolCallDisplay.js.map +0 -1
- package/dist/esm/components/conversation/index.d.ts +0 -7
- package/dist/esm/components/list/ConversationRow.d.ts +0 -7
- package/dist/esm/components/list/ConversationRow.js +0 -122
- package/dist/esm/components/list/ConversationRow.js.map +0 -1
- package/dist/esm/components/list/index.d.ts +0 -1
- package/dist/esm/components/utils/format.d.ts +0 -6
- package/dist/esm/components/utils/format.js +0 -68
- package/dist/esm/components/utils/format.js.map +0 -1
- package/dist/esm/components/utils/index.d.ts +0 -1
- package/dist/esm/core.d.ts +0 -22
- package/dist/esm/core.js +0 -9
- package/dist/esm/core.js.map +0 -1
- package/dist/esm/index.js +0 -6
- package/dist/esm/index.js.map +0 -1
- package/dist/esm/production.d.ts +0 -2
- package/dist/esm/production.js +0 -5
- package/dist/esm/production.js.map +0 -1
- package/dist/esm/store/ai-context.d.ts +0 -135
- package/dist/esm/store/ai-context.js +0 -1238
- package/dist/esm/store/ai-context.js.map +0 -1
- package/dist/esm/store/ai-store.d.ts +0 -1
- package/dist/esm/styles/tokens.d.ts +0 -298
- package/dist/esm/styles/tokens.js +0 -107
- package/dist/esm/styles/tokens.js.map +0 -1
- package/dist/esm/styles/use-styles.d.ts +0 -233
- package/dist/esm/styles/use-styles.js +0 -1602
- package/dist/esm/styles/use-styles.js.map +0 -1
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
interface AiDevtoolsInit {
|
|
2
|
+
}
|
|
3
|
+
declare const AiDevtoolsCore: new () => {
|
|
4
|
+
"__#private@#isMounted": boolean;
|
|
5
|
+
"__#private@#isMounting": boolean;
|
|
6
|
+
"__#private@#abortMount": boolean;
|
|
7
|
+
"__#private@#dispose"?: () => void;
|
|
8
|
+
mount<T extends HTMLElement>(el: T, theme: "light" | "dark"): Promise<void>;
|
|
9
|
+
unmount(): void;
|
|
10
|
+
};
|
|
11
|
+
|
|
12
|
+
export { AiDevtoolsCore, type AiDevtoolsInit };
|
package/dist/server.js
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { constructCoreClass } from '@tanstack/devtools-utils/solid/class';
|
|
2
|
+
|
|
3
|
+
// src/core.ts
|
|
4
|
+
var [AiDevtoolsCore, AiDevtoolsCoreNoOp] = constructCoreClass(
|
|
5
|
+
() => import('./Shell/MUFU35SY.js')
|
|
6
|
+
);
|
|
7
|
+
|
|
8
|
+
// src/index.ts
|
|
9
|
+
var AiDevtoolsCore2 = AiDevtoolsCoreNoOp ;
|
|
10
|
+
|
|
11
|
+
export { AiDevtoolsCore2 as AiDevtoolsCore };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/ai-devtools-core",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.8",
|
|
4
4
|
"description": "Core TanStack AI Devtools",
|
|
5
5
|
"author": "",
|
|
6
6
|
"license": "MIT",
|
|
@@ -10,16 +10,48 @@
|
|
|
10
10
|
"directory": "packages/typescript/ai"
|
|
11
11
|
},
|
|
12
12
|
"type": "module",
|
|
13
|
-
"types": "./dist/
|
|
14
|
-
"module": "./dist/
|
|
13
|
+
"types": "./dist/index.d.ts",
|
|
14
|
+
"module": "./dist/index.js",
|
|
15
15
|
"exports": {
|
|
16
16
|
".": {
|
|
17
|
-
"
|
|
18
|
-
|
|
17
|
+
"workerd": {
|
|
18
|
+
"types": "./dist/index.d.ts",
|
|
19
|
+
"import": "./dist/server.js"
|
|
20
|
+
},
|
|
21
|
+
"browser": {
|
|
22
|
+
"development": {
|
|
23
|
+
"types": "./dist/index.d.ts",
|
|
24
|
+
"import": "./dist/dev.js"
|
|
25
|
+
},
|
|
26
|
+
"types": "./dist/index.d.ts",
|
|
27
|
+
"import": "./dist/index.js"
|
|
28
|
+
},
|
|
29
|
+
"node": {
|
|
30
|
+
"types": "./dist/index.d.ts",
|
|
31
|
+
"import": "./dist/server.js"
|
|
32
|
+
},
|
|
33
|
+
"types": "./dist/index.d.ts",
|
|
34
|
+
"import": "./dist/index.js"
|
|
19
35
|
},
|
|
20
36
|
"./production": {
|
|
21
|
-
"
|
|
22
|
-
|
|
37
|
+
"workerd": {
|
|
38
|
+
"types": "./dist/production/index.d.ts",
|
|
39
|
+
"import": "./dist/production/server.js"
|
|
40
|
+
},
|
|
41
|
+
"browser": {
|
|
42
|
+
"development": {
|
|
43
|
+
"types": "./dist/production/index.d.ts",
|
|
44
|
+
"import": "./dist/production/dev.js"
|
|
45
|
+
},
|
|
46
|
+
"types": "./dist/production/index.d.ts",
|
|
47
|
+
"import": "./dist/production/index.js"
|
|
48
|
+
},
|
|
49
|
+
"node": {
|
|
50
|
+
"types": "./dist/production/index.d.ts",
|
|
51
|
+
"import": "./dist/production/server.js"
|
|
52
|
+
},
|
|
53
|
+
"types": "./dist/production/index.d.ts",
|
|
54
|
+
"import": "./dist/production/index.js"
|
|
23
55
|
},
|
|
24
56
|
"./package.json": "./package.json"
|
|
25
57
|
},
|
|
@@ -36,20 +68,22 @@
|
|
|
36
68
|
"embeddings"
|
|
37
69
|
],
|
|
38
70
|
"dependencies": {
|
|
39
|
-
"@tanstack/devtools-ui": "^0.
|
|
40
|
-
"@tanstack/devtools-utils": "
|
|
71
|
+
"@tanstack/devtools-ui": "^0.5.0",
|
|
72
|
+
"@tanstack/devtools-utils": "0.3.2",
|
|
41
73
|
"goober": "^2.1.18",
|
|
42
74
|
"solid-js": "^1.9.10",
|
|
43
|
-
"@tanstack/ai": "0.6.
|
|
75
|
+
"@tanstack/ai": "0.6.2"
|
|
44
76
|
},
|
|
45
77
|
"devDependencies": {
|
|
46
78
|
"@vitest/coverage-v8": "4.0.14",
|
|
47
79
|
"jsdom": "^27.2.0",
|
|
80
|
+
"tsup": "^8.5.1",
|
|
81
|
+
"tsup-preset-solid": "^2.2.0",
|
|
48
82
|
"vite": "^7.2.7",
|
|
49
83
|
"vite-plugin-solid": "^2.11.10"
|
|
50
84
|
},
|
|
51
85
|
"scripts": {
|
|
52
|
-
"build": "
|
|
86
|
+
"build": "tsup",
|
|
53
87
|
"clean": "premove ./build ./dist",
|
|
54
88
|
"lint:fix": "eslint ./src --fix",
|
|
55
89
|
"test:build": "publint --strict",
|
package/src/{core.tsx → core.ts}
RENAMED
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { constructCoreClass } from '@tanstack/devtools-utils/solid'
|
|
3
|
-
|
|
4
|
-
const Component = lazy(() => import('./components/Shell'))
|
|
1
|
+
import { constructCoreClass } from '@tanstack/devtools-utils/solid/class'
|
|
5
2
|
|
|
6
3
|
export interface AiDevtoolsInit {}
|
|
7
4
|
|
|
8
|
-
const [AiDevtoolsCore, AiDevtoolsCoreNoOp] = constructCoreClass(
|
|
5
|
+
const [AiDevtoolsCore, AiDevtoolsCoreNoOp] = constructCoreClass(
|
|
6
|
+
() => import('./components/Shell'),
|
|
7
|
+
)
|
|
9
8
|
|
|
10
9
|
export { AiDevtoolsCore, AiDevtoolsCoreNoOp }
|
|
@@ -1,192 +0,0 @@
|
|
|
1
|
-
import { createComponent, template, insert, effect, className } from "solid-js/web";
|
|
2
|
-
import { createSignal, createEffect, Show } from "solid-js";
|
|
3
|
-
import { useStyles } from "../styles/use-styles.js";
|
|
4
|
-
import { useAIStore } from "../store/ai-context.js";
|
|
5
|
-
import { ConversationHeader } from "./conversation/ConversationHeader.js";
|
|
6
|
-
import { ConversationTabs } from "./conversation/ConversationTabs.js";
|
|
7
|
-
import { MessagesTab } from "./conversation/MessagesTab.js";
|
|
8
|
-
import { ChunksTab } from "./conversation/ChunksTab.js";
|
|
9
|
-
import { SummariesTab } from "./conversation/SummariesTab.js";
|
|
10
|
-
import { ActivityEventsTab } from "./conversation/ActivityEventsTab.js";
|
|
11
|
-
var _tmpl$ = /* @__PURE__ */ template(`<div>Select a conversation to view details`), _tmpl$2 = /* @__PURE__ */ template(`<div><div>`);
|
|
12
|
-
const ConversationDetails = () => {
|
|
13
|
-
const {
|
|
14
|
-
state
|
|
15
|
-
} = useAIStore();
|
|
16
|
-
const styles = useStyles();
|
|
17
|
-
const [activeTab, setActiveTab] = createSignal("messages");
|
|
18
|
-
const activeConversation = () => {
|
|
19
|
-
if (!state.activeConversationId) return void 0;
|
|
20
|
-
return state.conversations[state.activeConversationId];
|
|
21
|
-
};
|
|
22
|
-
createEffect(() => {
|
|
23
|
-
const conv = activeConversation();
|
|
24
|
-
if (conv) {
|
|
25
|
-
if (conv.type === "server") {
|
|
26
|
-
if (conv.chunks.length > 0) {
|
|
27
|
-
setActiveTab("chunks");
|
|
28
|
-
} else if (conv.hasSummarize || conv.summaries && conv.summaries.length > 0) {
|
|
29
|
-
setActiveTab("summaries");
|
|
30
|
-
} else if (conv.hasImage || conv.imageEvents && conv.imageEvents.length > 0) {
|
|
31
|
-
setActiveTab("image");
|
|
32
|
-
} else if (conv.hasSpeech || conv.speechEvents && conv.speechEvents.length > 0) {
|
|
33
|
-
setActiveTab("speech");
|
|
34
|
-
} else if (conv.hasTranscription || conv.transcriptionEvents && conv.transcriptionEvents.length > 0) {
|
|
35
|
-
setActiveTab("transcription");
|
|
36
|
-
} else if (conv.hasVideo || conv.videoEvents && conv.videoEvents.length > 0) {
|
|
37
|
-
setActiveTab("video");
|
|
38
|
-
} else {
|
|
39
|
-
setActiveTab("chunks");
|
|
40
|
-
}
|
|
41
|
-
} else {
|
|
42
|
-
if (conv.messages.length > 0) {
|
|
43
|
-
setActiveTab("messages");
|
|
44
|
-
} else if (conv.hasImage || conv.imageEvents && conv.imageEvents.length > 0) {
|
|
45
|
-
setActiveTab("image");
|
|
46
|
-
} else if (conv.hasSpeech || conv.speechEvents && conv.speechEvents.length > 0) {
|
|
47
|
-
setActiveTab("speech");
|
|
48
|
-
} else if (conv.hasTranscription || conv.transcriptionEvents && conv.transcriptionEvents.length > 0) {
|
|
49
|
-
setActiveTab("transcription");
|
|
50
|
-
} else if (conv.hasVideo || conv.videoEvents && conv.videoEvents.length > 0) {
|
|
51
|
-
setActiveTab("video");
|
|
52
|
-
} else {
|
|
53
|
-
setActiveTab("messages");
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
});
|
|
58
|
-
return createComponent(Show, {
|
|
59
|
-
get when() {
|
|
60
|
-
return activeConversation();
|
|
61
|
-
},
|
|
62
|
-
get fallback() {
|
|
63
|
-
return (() => {
|
|
64
|
-
var _el$ = _tmpl$();
|
|
65
|
-
effect(() => className(_el$, styles().conversationDetails.emptyState));
|
|
66
|
-
return _el$;
|
|
67
|
-
})();
|
|
68
|
-
},
|
|
69
|
-
children: (conv) => (() => {
|
|
70
|
-
var _el$2 = _tmpl$2(), _el$3 = _el$2.firstChild;
|
|
71
|
-
insert(_el$2, createComponent(ConversationHeader, {
|
|
72
|
-
get conversation() {
|
|
73
|
-
return conv();
|
|
74
|
-
}
|
|
75
|
-
}), _el$3);
|
|
76
|
-
insert(_el$2, createComponent(ConversationTabs, {
|
|
77
|
-
get conversation() {
|
|
78
|
-
return conv();
|
|
79
|
-
},
|
|
80
|
-
get activeTab() {
|
|
81
|
-
return activeTab();
|
|
82
|
-
},
|
|
83
|
-
onTabChange: setActiveTab
|
|
84
|
-
}), _el$3);
|
|
85
|
-
insert(_el$3, createComponent(Show, {
|
|
86
|
-
get when() {
|
|
87
|
-
return activeTab() === "messages";
|
|
88
|
-
},
|
|
89
|
-
get children() {
|
|
90
|
-
return createComponent(MessagesTab, {
|
|
91
|
-
get messages() {
|
|
92
|
-
return conv().messages;
|
|
93
|
-
}
|
|
94
|
-
});
|
|
95
|
-
}
|
|
96
|
-
}), null);
|
|
97
|
-
insert(_el$3, createComponent(Show, {
|
|
98
|
-
get when() {
|
|
99
|
-
return activeTab() === "chunks";
|
|
100
|
-
},
|
|
101
|
-
get children() {
|
|
102
|
-
return createComponent(ChunksTab, {
|
|
103
|
-
get chunks() {
|
|
104
|
-
return conv().chunks;
|
|
105
|
-
},
|
|
106
|
-
get messages() {
|
|
107
|
-
return conv().messages;
|
|
108
|
-
}
|
|
109
|
-
});
|
|
110
|
-
}
|
|
111
|
-
}), null);
|
|
112
|
-
insert(_el$3, createComponent(Show, {
|
|
113
|
-
get when() {
|
|
114
|
-
return activeTab() === "summaries";
|
|
115
|
-
},
|
|
116
|
-
get children() {
|
|
117
|
-
return createComponent(SummariesTab, {
|
|
118
|
-
get summaries() {
|
|
119
|
-
return conv().summaries ?? [];
|
|
120
|
-
}
|
|
121
|
-
});
|
|
122
|
-
}
|
|
123
|
-
}), null);
|
|
124
|
-
insert(_el$3, createComponent(Show, {
|
|
125
|
-
get when() {
|
|
126
|
-
return activeTab() === "image";
|
|
127
|
-
},
|
|
128
|
-
get children() {
|
|
129
|
-
return createComponent(ActivityEventsTab, {
|
|
130
|
-
title: "Image Activity",
|
|
131
|
-
get events() {
|
|
132
|
-
return conv().imageEvents ?? [];
|
|
133
|
-
}
|
|
134
|
-
});
|
|
135
|
-
}
|
|
136
|
-
}), null);
|
|
137
|
-
insert(_el$3, createComponent(Show, {
|
|
138
|
-
get when() {
|
|
139
|
-
return activeTab() === "speech";
|
|
140
|
-
},
|
|
141
|
-
get children() {
|
|
142
|
-
return createComponent(ActivityEventsTab, {
|
|
143
|
-
title: "Speech Activity",
|
|
144
|
-
get events() {
|
|
145
|
-
return conv().speechEvents ?? [];
|
|
146
|
-
}
|
|
147
|
-
});
|
|
148
|
-
}
|
|
149
|
-
}), null);
|
|
150
|
-
insert(_el$3, createComponent(Show, {
|
|
151
|
-
get when() {
|
|
152
|
-
return activeTab() === "transcription";
|
|
153
|
-
},
|
|
154
|
-
get children() {
|
|
155
|
-
return createComponent(ActivityEventsTab, {
|
|
156
|
-
title: "Transcription Activity",
|
|
157
|
-
get events() {
|
|
158
|
-
return conv().transcriptionEvents ?? [];
|
|
159
|
-
}
|
|
160
|
-
});
|
|
161
|
-
}
|
|
162
|
-
}), null);
|
|
163
|
-
insert(_el$3, createComponent(Show, {
|
|
164
|
-
get when() {
|
|
165
|
-
return activeTab() === "video";
|
|
166
|
-
},
|
|
167
|
-
get children() {
|
|
168
|
-
return createComponent(ActivityEventsTab, {
|
|
169
|
-
title: "Video Activity",
|
|
170
|
-
get events() {
|
|
171
|
-
return conv().videoEvents ?? [];
|
|
172
|
-
}
|
|
173
|
-
});
|
|
174
|
-
}
|
|
175
|
-
}), null);
|
|
176
|
-
effect((_p$) => {
|
|
177
|
-
var _v$ = styles().conversationDetails.container, _v$2 = styles().conversationDetails.contentArea;
|
|
178
|
-
_v$ !== _p$.e && className(_el$2, _p$.e = _v$);
|
|
179
|
-
_v$2 !== _p$.t && className(_el$3, _p$.t = _v$2);
|
|
180
|
-
return _p$;
|
|
181
|
-
}, {
|
|
182
|
-
e: void 0,
|
|
183
|
-
t: void 0
|
|
184
|
-
});
|
|
185
|
-
return _el$2;
|
|
186
|
-
})()
|
|
187
|
-
});
|
|
188
|
-
};
|
|
189
|
-
export {
|
|
190
|
-
ConversationDetails
|
|
191
|
-
};
|
|
192
|
-
//# sourceMappingURL=ConversationDetails.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ConversationDetails.js","sources":["../../../src/components/ConversationDetails.tsx"],"sourcesContent":["import { Show, createEffect, createSignal } from 'solid-js'\nimport { useStyles } from '../styles/use-styles'\nimport { useAIStore } from '../store/ai-context'\nimport {\n ActivityEventsTab,\n ChunksTab,\n ConversationHeader,\n ConversationTabs,\n MessagesTab,\n SummariesTab,\n} from './conversation'\nimport type { TabType } from './conversation'\nimport type { Conversation } from '../store/ai-context'\nimport type { Component } from 'solid-js'\n\nexport const ConversationDetails: Component = () => {\n const { state } = useAIStore()\n const styles = useStyles()\n const [activeTab, setActiveTab] = createSignal<TabType>('messages')\n\n const activeConversation = (): Conversation | undefined => {\n if (!state.activeConversationId) return undefined\n return state.conversations[state.activeConversationId]\n }\n\n // Update active tab when conversation changes\n createEffect(() => {\n const conv = activeConversation()\n if (conv) {\n // For server conversations, always use chunks (messages tab is hidden)\n if (conv.type === 'server') {\n if (conv.chunks.length > 0) {\n setActiveTab('chunks')\n } else if (\n conv.hasSummarize ||\n (conv.summaries && conv.summaries.length > 0)\n ) {\n setActiveTab('summaries')\n } else if (\n conv.hasImage ||\n (conv.imageEvents && conv.imageEvents.length > 0)\n ) {\n setActiveTab('image')\n } else if (\n conv.hasSpeech ||\n (conv.speechEvents && conv.speechEvents.length > 0)\n ) {\n setActiveTab('speech')\n } else if (\n conv.hasTranscription ||\n (conv.transcriptionEvents && conv.transcriptionEvents.length > 0)\n ) {\n setActiveTab('transcription')\n } else if (\n conv.hasVideo ||\n (conv.videoEvents && conv.videoEvents.length > 0)\n ) {\n setActiveTab('video')\n } else {\n setActiveTab('chunks')\n }\n } else {\n // For client conversations, default to messages tab\n if (conv.messages.length > 0) {\n setActiveTab('messages')\n } else if (\n conv.hasImage ||\n (conv.imageEvents && conv.imageEvents.length > 0)\n ) {\n setActiveTab('image')\n } else if (\n conv.hasSpeech ||\n (conv.speechEvents && conv.speechEvents.length > 0)\n ) {\n setActiveTab('speech')\n } else if (\n conv.hasTranscription ||\n (conv.transcriptionEvents && conv.transcriptionEvents.length > 0)\n ) {\n setActiveTab('transcription')\n } else if (\n conv.hasVideo ||\n (conv.videoEvents && conv.videoEvents.length > 0)\n ) {\n setActiveTab('video')\n } else {\n setActiveTab('messages')\n }\n }\n }\n })\n\n return (\n <Show\n when={activeConversation()}\n fallback={\n <div class={styles().conversationDetails.emptyState}>\n Select a conversation to view details\n </div>\n }\n >\n {(conv) => (\n <div class={styles().conversationDetails.container}>\n <ConversationHeader conversation={conv()} />\n <ConversationTabs\n conversation={conv()}\n activeTab={activeTab()}\n onTabChange={setActiveTab}\n />\n <div class={styles().conversationDetails.contentArea}>\n <Show when={activeTab() === 'messages'}>\n <MessagesTab messages={conv().messages} />\n </Show>\n <Show when={activeTab() === 'chunks'}>\n <ChunksTab chunks={conv().chunks} messages={conv().messages} />\n </Show>\n <Show when={activeTab() === 'summaries'}>\n <SummariesTab summaries={conv().summaries ?? []} />\n </Show>\n <Show when={activeTab() === 'image'}>\n <ActivityEventsTab\n title=\"Image Activity\"\n events={conv().imageEvents ?? []}\n />\n </Show>\n <Show when={activeTab() === 'speech'}>\n <ActivityEventsTab\n title=\"Speech Activity\"\n events={conv().speechEvents ?? []}\n />\n </Show>\n <Show when={activeTab() === 'transcription'}>\n <ActivityEventsTab\n title=\"Transcription Activity\"\n events={conv().transcriptionEvents ?? []}\n />\n </Show>\n <Show when={activeTab() === 'video'}>\n <ActivityEventsTab\n title=\"Video Activity\"\n events={conv().videoEvents ?? []}\n />\n </Show>\n </div>\n </div>\n )}\n </Show>\n )\n}\n"],"names":["ConversationDetails","state","useAIStore","styles","useStyles","activeTab","setActiveTab","createSignal","activeConversation","activeConversationId","undefined","conversations","createEffect","conv","type","chunks","length","hasSummarize","summaries","hasImage","imageEvents","hasSpeech","speechEvents","hasTranscription","transcriptionEvents","hasVideo","videoEvents","messages","_$createComponent","Show","when","fallback","_el$","_tmpl$","_$effect","_$className","conversationDetails","emptyState","children","_el$2","_tmpl$2","_el$3","firstChild","_$insert","ConversationHeader","conversation","ConversationTabs","onTabChange","MessagesTab","ChunksTab","SummariesTab","ActivityEventsTab","title","events","_p$","_v$","container","_v$2","contentArea","e","t"],"mappings":";;;;;;;;;;;AAeO,MAAMA,sBAAiCA,MAAM;AAClD,QAAM;AAAA,IAAEC;AAAAA,EAAAA,IAAUC,WAAAA;AAClB,QAAMC,SAASC,UAAAA;AACf,QAAM,CAACC,WAAWC,YAAY,IAAIC,aAAsB,UAAU;AAElE,QAAMC,qBAAqBA,MAAgC;AACzD,QAAI,CAACP,MAAMQ,qBAAsB,QAAOC;AACxC,WAAOT,MAAMU,cAAcV,MAAMQ,oBAAoB;AAAA,EACvD;AAGAG,eAAa,MAAM;AACjB,UAAMC,OAAOL,mBAAAA;AACb,QAAIK,MAAM;AAER,UAAIA,KAAKC,SAAS,UAAU;AAC1B,YAAID,KAAKE,OAAOC,SAAS,GAAG;AAC1BV,uBAAa,QAAQ;AAAA,QACvB,WACEO,KAAKI,gBACJJ,KAAKK,aAAaL,KAAKK,UAAUF,SAAS,GAC3C;AACAV,uBAAa,WAAW;AAAA,QAC1B,WACEO,KAAKM,YACJN,KAAKO,eAAeP,KAAKO,YAAYJ,SAAS,GAC/C;AACAV,uBAAa,OAAO;AAAA,QACtB,WACEO,KAAKQ,aACJR,KAAKS,gBAAgBT,KAAKS,aAAaN,SAAS,GACjD;AACAV,uBAAa,QAAQ;AAAA,QACvB,WACEO,KAAKU,oBACJV,KAAKW,uBAAuBX,KAAKW,oBAAoBR,SAAS,GAC/D;AACAV,uBAAa,eAAe;AAAA,QAC9B,WACEO,KAAKY,YACJZ,KAAKa,eAAeb,KAAKa,YAAYV,SAAS,GAC/C;AACAV,uBAAa,OAAO;AAAA,QACtB,OAAO;AACLA,uBAAa,QAAQ;AAAA,QACvB;AAAA,MACF,OAAO;AAEL,YAAIO,KAAKc,SAASX,SAAS,GAAG;AAC5BV,uBAAa,UAAU;AAAA,QACzB,WACEO,KAAKM,YACJN,KAAKO,eAAeP,KAAKO,YAAYJ,SAAS,GAC/C;AACAV,uBAAa,OAAO;AAAA,QACtB,WACEO,KAAKQ,aACJR,KAAKS,gBAAgBT,KAAKS,aAAaN,SAAS,GACjD;AACAV,uBAAa,QAAQ;AAAA,QACvB,WACEO,KAAKU,oBACJV,KAAKW,uBAAuBX,KAAKW,oBAAoBR,SAAS,GAC/D;AACAV,uBAAa,eAAe;AAAA,QAC9B,WACEO,KAAKY,YACJZ,KAAKa,eAAeb,KAAKa,YAAYV,SAAS,GAC/C;AACAV,uBAAa,OAAO;AAAA,QACtB,OAAO;AACLA,uBAAa,UAAU;AAAA,QACzB;AAAA,MACF;AAAA,IACF;AAAA,EACF,CAAC;AAED,SAAAsB,gBACGC,MAAI;AAAA,IAAA,IACHC,OAAI;AAAA,aAAEtB,mBAAAA;AAAAA,IAAoB;AAAA,IAAA,IAC1BuB,WAAQ;AAAA,cAAA,MAAA;AAAA,YAAAC,OAAAC,OAAAA;AAAAC,eAAA,MAAAC,UAAAH,MACM7B,SAASiC,oBAAoBC,UAAU,CAAA;AAAA,eAAAL;AAAAA,MAAA,GAAA;AAAA,IAAA;AAAA,IAAAM,UAKnDzB,WAAI,MAAA;AAAA,UAAA0B,QAAAC,QAAAA,GAAAC,QAAAF,MAAAG;AAAAC,aAAAJ,OAAAX,gBAEDgB,oBAAkB;AAAA,QAAA,IAACC,eAAY;AAAA,iBAAEhC,KAAAA;AAAAA,QAAM;AAAA,MAAA,CAAA,GAAA4B,KAAA;AAAAE,aAAAJ,OAAAX,gBACvCkB,kBAAgB;AAAA,QAAA,IACfD,eAAY;AAAA,iBAAEhC,KAAAA;AAAAA,QAAM;AAAA,QAAA,IACpBR,YAAS;AAAA,iBAAEA,UAAAA;AAAAA,QAAW;AAAA,QACtB0C,aAAazC;AAAAA,MAAAA,CAAY,GAAAmC,KAAA;AAAAE,aAAAF,OAAAb,gBAGxBC,MAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEzB,gBAAgB;AAAA,QAAU;AAAA,QAAA,IAAAiC,WAAA;AAAA,iBAAAV,gBACnCoB,aAAW;AAAA,YAAA,IAACrB,WAAQ;AAAA,qBAAEd,OAAOc;AAAAA,YAAQ;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,GAAA,IAAA;AAAAgB,aAAAF,OAAAb,gBAEvCC,MAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEzB,gBAAgB;AAAA,QAAQ;AAAA,QAAA,IAAAiC,WAAA;AAAA,iBAAAV,gBACjCqB,WAAS;AAAA,YAAA,IAAClC,SAAM;AAAA,qBAAEF,OAAOE;AAAAA,YAAM;AAAA,YAAA,IAAEY,WAAQ;AAAA,qBAAEd,OAAOc;AAAAA,YAAQ;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,GAAA,IAAA;AAAAgB,aAAAF,OAAAb,gBAE5DC,MAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEzB,gBAAgB;AAAA,QAAW;AAAA,QAAA,IAAAiC,WAAA;AAAA,iBAAAV,gBACpCsB,cAAY;AAAA,YAAA,IAAChC,YAAS;AAAA,qBAAEL,KAAAA,EAAOK,aAAa,CAAA;AAAA,YAAE;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,GAAA,IAAA;AAAAyB,aAAAF,OAAAb,gBAEhDC,MAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEzB,gBAAgB;AAAA,QAAO;AAAA,QAAA,IAAAiC,WAAA;AAAA,iBAAAV,gBAChCuB,mBAAiB;AAAA,YAChBC,OAAK;AAAA,YAAA,IACLC,SAAM;AAAA,qBAAExC,KAAAA,EAAOO,eAAe,CAAA;AAAA,YAAE;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,GAAA,IAAA;AAAAuB,aAAAF,OAAAb,gBAGnCC,MAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEzB,gBAAgB;AAAA,QAAQ;AAAA,QAAA,IAAAiC,WAAA;AAAA,iBAAAV,gBACjCuB,mBAAiB;AAAA,YAChBC,OAAK;AAAA,YAAA,IACLC,SAAM;AAAA,qBAAExC,KAAAA,EAAOS,gBAAgB,CAAA;AAAA,YAAE;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,GAAA,IAAA;AAAAqB,aAAAF,OAAAb,gBAGpCC,MAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEzB,gBAAgB;AAAA,QAAe;AAAA,QAAA,IAAAiC,WAAA;AAAA,iBAAAV,gBACxCuB,mBAAiB;AAAA,YAChBC,OAAK;AAAA,YAAA,IACLC,SAAM;AAAA,qBAAExC,KAAAA,EAAOW,uBAAuB,CAAA;AAAA,YAAE;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,GAAA,IAAA;AAAAmB,aAAAF,OAAAb,gBAG3CC,MAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEzB,gBAAgB;AAAA,QAAO;AAAA,QAAA,IAAAiC,WAAA;AAAA,iBAAAV,gBAChCuB,mBAAiB;AAAA,YAChBC,OAAK;AAAA,YAAA,IACLC,SAAM;AAAA,qBAAExC,KAAAA,EAAOa,eAAe,CAAA;AAAA,YAAE;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,GAAA,IAAA;AAAAQ,aAAAoB,CAAAA,QAAA;AAAA,YAAAC,MAtC5BpD,SAASiC,oBAAoBoB,WAASC,OAOpCtD,SAASiC,oBAAoBsB;AAAWH,gBAAAD,IAAAK,KAAAxB,UAAAI,OAAAe,IAAAK,IAAAJ,GAAA;AAAAE,iBAAAH,IAAAM,KAAAzB,UAAAM,OAAAa,IAAAM,IAAAH,IAAA;AAAA,eAAAH;AAAAA,MAAA,GAAA;AAAA,QAAAK,GAAAjD;AAAAA,QAAAkD,GAAAlD;AAAAA,MAAAA,CAAA;AAAA,aAAA6B;AAAAA,IAAA,GAAA;AAAA,EAAA,CAoCvD;AAGP;"}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import { template, insert, createComponent, effect, className } from "solid-js/web";
|
|
2
|
-
import { For } from "solid-js";
|
|
3
|
-
import { useStyles } from "../styles/use-styles.js";
|
|
4
|
-
import { useAIStore } from "../store/ai-context.js";
|
|
5
|
-
import { ConversationRow } from "./list/ConversationRow.js";
|
|
6
|
-
var _tmpl$ = /* @__PURE__ */ template(`<div>`);
|
|
7
|
-
const ConversationsList = () => {
|
|
8
|
-
const {
|
|
9
|
-
state
|
|
10
|
-
} = useAIStore();
|
|
11
|
-
const styles = useStyles();
|
|
12
|
-
const conversations = () => Object.values(state.conversations);
|
|
13
|
-
return (() => {
|
|
14
|
-
var _el$ = _tmpl$();
|
|
15
|
-
insert(_el$, createComponent(For, {
|
|
16
|
-
get each() {
|
|
17
|
-
return conversations();
|
|
18
|
-
},
|
|
19
|
-
children: (conv) => createComponent(ConversationRow, {
|
|
20
|
-
conversation: conv
|
|
21
|
-
})
|
|
22
|
-
}));
|
|
23
|
-
effect(() => className(_el$, styles().utilList));
|
|
24
|
-
return _el$;
|
|
25
|
-
})();
|
|
26
|
-
};
|
|
27
|
-
export {
|
|
28
|
-
ConversationsList
|
|
29
|
-
};
|
|
30
|
-
//# sourceMappingURL=ConversationsList.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ConversationsList.js","sources":["../../../src/components/ConversationsList.tsx"],"sourcesContent":["import { For } from 'solid-js'\nimport { useStyles } from '../styles/use-styles'\nimport { useAIStore } from '../store/ai-context'\nimport { ConversationRow } from './list'\nimport type { Conversation } from '../store/ai-context'\nimport type { Component } from 'solid-js'\n\nexport const ConversationsList: Component = () => {\n const { state } = useAIStore()\n const styles = useStyles()\n\n const conversations = () => Object.values(state.conversations)\n\n return (\n <div class={styles().utilList}>\n <For each={conversations()}>\n {(conv: Conversation) => <ConversationRow conversation={conv} />}\n </For>\n </div>\n )\n}\n"],"names":["ConversationsList","state","useAIStore","styles","useStyles","conversations","Object","values","_el$","_tmpl$","_$insert","_$createComponent","For","each","children","conv","ConversationRow","conversation","_$effect","_$className","utilList"],"mappings":";;;;;;AAOO,MAAMA,oBAA+BA,MAAM;AAChD,QAAM;AAAA,IAAEC;AAAAA,EAAAA,IAAUC,WAAAA;AAClB,QAAMC,SAASC,UAAAA;AAEf,QAAMC,gBAAgBA,MAAMC,OAAOC,OAAON,MAAMI,aAAa;AAE7D,UAAA,MAAA;AAAA,QAAAG,OAAAC,OAAAA;AAAAC,WAAAF,MAAAG,gBAEKC,KAAG;AAAA,MAAA,IAACC,OAAI;AAAA,eAAER,cAAAA;AAAAA,MAAe;AAAA,MAAAS,UACvBA,CAACC,SAAkBJ,gBAAMK,iBAAe;AAAA,QAACC,cAAcF;AAAAA,MAAAA,CAAI;AAAA,IAAA,CAAI,CAAA;AAAAG,WAAA,MAAAC,UAAAX,MAFxDL,OAAAA,EAASiB,QAAQ,CAAA;AAAA,WAAAZ;AAAAA,EAAA,GAAA;AAMjC;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export default function Devtools(): import("solid-js").JSX.Element;
|
|
@@ -1,94 +0,0 @@
|
|
|
1
|
-
import { createComponent, template, insert, effect, className, setStyleProperty, delegateEvents } from "solid-js/web";
|
|
2
|
-
import { createSignal, onMount, onCleanup } from "solid-js";
|
|
3
|
-
import { MainPanel, Header, HeaderLogo } from "@tanstack/devtools-ui";
|
|
4
|
-
import { useStyles } from "../styles/use-styles.js";
|
|
5
|
-
import { AIProvider } from "../store/ai-context.js";
|
|
6
|
-
import { ConversationsList } from "./ConversationsList.js";
|
|
7
|
-
import { ConversationDetails } from "./ConversationDetails.js";
|
|
8
|
-
var _tmpl$ = /* @__PURE__ */ template(`<div><div style=min-width:150px;max-width:800px><div>Active Conversations</div></div><div></div><div style=flex:1>`);
|
|
9
|
-
function Devtools() {
|
|
10
|
-
return createComponent(AIProvider, {
|
|
11
|
-
get children() {
|
|
12
|
-
return createComponent(DevtoolsContent, {});
|
|
13
|
-
}
|
|
14
|
-
});
|
|
15
|
-
}
|
|
16
|
-
function DevtoolsContent() {
|
|
17
|
-
const styles = useStyles();
|
|
18
|
-
const [leftPanelWidth, setLeftPanelWidth] = createSignal(300);
|
|
19
|
-
const [isDragging, setIsDragging] = createSignal(false);
|
|
20
|
-
let dragStartX = 0;
|
|
21
|
-
let dragStartWidth = 0;
|
|
22
|
-
const handleMouseDown = (e) => {
|
|
23
|
-
e.preventDefault();
|
|
24
|
-
e.stopPropagation();
|
|
25
|
-
setIsDragging(true);
|
|
26
|
-
document.body.style.cursor = "col-resize";
|
|
27
|
-
document.body.style.userSelect = "none";
|
|
28
|
-
dragStartX = e.clientX;
|
|
29
|
-
dragStartWidth = leftPanelWidth();
|
|
30
|
-
};
|
|
31
|
-
const handleMouseMove = (e) => {
|
|
32
|
-
if (!isDragging()) return;
|
|
33
|
-
e.preventDefault();
|
|
34
|
-
const deltaX = e.clientX - dragStartX;
|
|
35
|
-
const newWidth = Math.max(150, Math.min(800, dragStartWidth + deltaX));
|
|
36
|
-
setLeftPanelWidth(newWidth);
|
|
37
|
-
};
|
|
38
|
-
const handleMouseUp = () => {
|
|
39
|
-
setIsDragging(false);
|
|
40
|
-
document.body.style.cursor = "";
|
|
41
|
-
document.body.style.userSelect = "";
|
|
42
|
-
};
|
|
43
|
-
onMount(() => {
|
|
44
|
-
document.addEventListener("mousemove", handleMouseMove);
|
|
45
|
-
document.addEventListener("mouseup", handleMouseUp);
|
|
46
|
-
});
|
|
47
|
-
onCleanup(() => {
|
|
48
|
-
document.removeEventListener("mousemove", handleMouseMove);
|
|
49
|
-
document.removeEventListener("mouseup", handleMouseUp);
|
|
50
|
-
});
|
|
51
|
-
return createComponent(MainPanel, {
|
|
52
|
-
get children() {
|
|
53
|
-
return [createComponent(Header, {
|
|
54
|
-
get children() {
|
|
55
|
-
return createComponent(HeaderLogo, {
|
|
56
|
-
flavor: {
|
|
57
|
-
light: "#ec4899",
|
|
58
|
-
dark: "#ec4899"
|
|
59
|
-
},
|
|
60
|
-
children: "TanStack AI"
|
|
61
|
-
});
|
|
62
|
-
}
|
|
63
|
-
}), (() => {
|
|
64
|
-
var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$2.nextSibling, _el$5 = _el$4.nextSibling;
|
|
65
|
-
insert(_el$2, createComponent(ConversationsList, {}), null);
|
|
66
|
-
_el$4.$$mousedown = handleMouseDown;
|
|
67
|
-
insert(_el$5, createComponent(ConversationDetails, {}));
|
|
68
|
-
effect((_p$) => {
|
|
69
|
-
var _v$ = styles().mainContainer, _v$2 = styles().leftPanel, _v$3 = `${leftPanelWidth()}px`, _v$4 = styles().shell.sectionHeader, _v$5 = `${styles().dragHandle} ${isDragging() ? "dragging" : ""}`, _v$6 = styles().rightPanel;
|
|
70
|
-
_v$ !== _p$.e && className(_el$, _p$.e = _v$);
|
|
71
|
-
_v$2 !== _p$.t && className(_el$2, _p$.t = _v$2);
|
|
72
|
-
_v$3 !== _p$.a && setStyleProperty(_el$2, "width", _p$.a = _v$3);
|
|
73
|
-
_v$4 !== _p$.o && className(_el$3, _p$.o = _v$4);
|
|
74
|
-
_v$5 !== _p$.i && className(_el$4, _p$.i = _v$5);
|
|
75
|
-
_v$6 !== _p$.n && className(_el$5, _p$.n = _v$6);
|
|
76
|
-
return _p$;
|
|
77
|
-
}, {
|
|
78
|
-
e: void 0,
|
|
79
|
-
t: void 0,
|
|
80
|
-
a: void 0,
|
|
81
|
-
o: void 0,
|
|
82
|
-
i: void 0,
|
|
83
|
-
n: void 0
|
|
84
|
-
});
|
|
85
|
-
return _el$;
|
|
86
|
-
})()];
|
|
87
|
-
}
|
|
88
|
-
});
|
|
89
|
-
}
|
|
90
|
-
delegateEvents(["mousedown"]);
|
|
91
|
-
export {
|
|
92
|
-
Devtools as default
|
|
93
|
-
};
|
|
94
|
-
//# sourceMappingURL=Shell.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Shell.js","sources":["../../../src/components/Shell.tsx"],"sourcesContent":["import { createSignal, onCleanup, onMount } from 'solid-js'\nimport { Header, HeaderLogo, MainPanel } from '@tanstack/devtools-ui'\nimport { useStyles } from '../styles/use-styles'\nimport { AIProvider } from '../store/ai-context'\nimport { ConversationsList } from './ConversationsList'\nimport { ConversationDetails } from './ConversationDetails'\n\nexport default function Devtools() {\n return (\n <AIProvider>\n <DevtoolsContent />\n </AIProvider>\n )\n}\n\nfunction DevtoolsContent() {\n const styles = useStyles()\n const [leftPanelWidth, setLeftPanelWidth] = createSignal(300)\n const [isDragging, setIsDragging] = createSignal(false)\n\n let dragStartX = 0\n let dragStartWidth = 0\n\n const handleMouseDown = (e: MouseEvent) => {\n e.preventDefault()\n e.stopPropagation()\n setIsDragging(true)\n document.body.style.cursor = 'col-resize'\n document.body.style.userSelect = 'none'\n dragStartX = e.clientX\n dragStartWidth = leftPanelWidth()\n }\n\n const handleMouseMove = (e: MouseEvent) => {\n if (!isDragging()) return\n\n e.preventDefault()\n const deltaX = e.clientX - dragStartX\n const newWidth = Math.max(150, Math.min(800, dragStartWidth + deltaX))\n setLeftPanelWidth(newWidth)\n }\n\n const handleMouseUp = () => {\n setIsDragging(false)\n document.body.style.cursor = ''\n document.body.style.userSelect = ''\n }\n\n onMount(() => {\n document.addEventListener('mousemove', handleMouseMove)\n document.addEventListener('mouseup', handleMouseUp)\n })\n\n onCleanup(() => {\n document.removeEventListener('mousemove', handleMouseMove)\n document.removeEventListener('mouseup', handleMouseUp)\n })\n\n return (\n <MainPanel>\n <Header>\n <HeaderLogo flavor={{ light: '#ec4899', dark: '#ec4899' }}>\n TanStack AI\n </HeaderLogo>\n </Header>\n\n <div class={styles().mainContainer}>\n <div\n class={styles().leftPanel}\n style={{\n width: `${leftPanelWidth()}px`,\n 'min-width': '150px',\n 'max-width': '800px',\n }}\n >\n {/* Section header */}\n <div class={styles().shell.sectionHeader}>Active Conversations</div>\n\n <ConversationsList />\n </div>\n\n <div\n class={`${styles().dragHandle} ${isDragging() ? 'dragging' : ''}`}\n onMouseDown={handleMouseDown}\n />\n\n <div class={styles().rightPanel} style={{ flex: 1 }}>\n <ConversationDetails />\n </div>\n </div>\n </MainPanel>\n )\n}\n"],"names":["Devtools","_$createComponent","AIProvider","children","DevtoolsContent","styles","useStyles","leftPanelWidth","setLeftPanelWidth","createSignal","isDragging","setIsDragging","dragStartX","dragStartWidth","handleMouseDown","e","preventDefault","stopPropagation","document","body","style","cursor","userSelect","clientX","handleMouseMove","deltaX","newWidth","Math","max","min","handleMouseUp","onMount","addEventListener","onCleanup","removeEventListener","MainPanel","Header","HeaderLogo","flavor","light","dark","_el$","_tmpl$","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$5","_$insert","ConversationsList","$$mousedown","ConversationDetails","_$effect","_p$","_v$","mainContainer","_v$2","leftPanel","_v$3","_v$4","shell","sectionHeader","_v$5","dragHandle","_v$6","rightPanel","_$className","t","a","_$setStyleProperty","o","i","n","undefined","_$delegateEvents"],"mappings":"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"}
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { Component } from 'solid-js';
|
|
2
|
-
import { ActivityEvent } from '../../store/ai-context.js';
|
|
3
|
-
interface ActivityEventsTabProps {
|
|
4
|
-
title: string;
|
|
5
|
-
events: Array<ActivityEvent>;
|
|
6
|
-
}
|
|
7
|
-
export declare const ActivityEventsTab: Component<ActivityEventsTabProps>;
|
|
8
|
-
export {};
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
import { createComponent, template, insert, effect, className } from "solid-js/web";
|
|
2
|
-
import { Show, For } from "solid-js";
|
|
3
|
-
import { useStyles } from "../../styles/use-styles.js";
|
|
4
|
-
var _tmpl$ = /* @__PURE__ */ template(`<div><div><div><div></div><div> events</div></div><div>Activity event log</div></div><div>`), _tmpl$2 = /* @__PURE__ */ template(`<div>No events yet`), _tmpl$3 = /* @__PURE__ */ template(`<div><div> · </div><pre>`);
|
|
5
|
-
const ActivityEventsTab = (props) => {
|
|
6
|
-
const styles = useStyles();
|
|
7
|
-
const formattedTimestamp = (timestamp) => new Date(timestamp).toLocaleTimeString();
|
|
8
|
-
return createComponent(Show, {
|
|
9
|
-
get when() {
|
|
10
|
-
return props.events.length > 0;
|
|
11
|
-
},
|
|
12
|
-
get fallback() {
|
|
13
|
-
return (() => {
|
|
14
|
-
var _el$9 = _tmpl$2();
|
|
15
|
-
effect(() => className(_el$9, styles().conversationDetails.noChunks));
|
|
16
|
-
return _el$9;
|
|
17
|
-
})();
|
|
18
|
-
},
|
|
19
|
-
get children() {
|
|
20
|
-
var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$6 = _el$5.firstChild, _el$7 = _el$3.nextSibling, _el$8 = _el$2.nextSibling;
|
|
21
|
-
insert(_el$4, () => props.title);
|
|
22
|
-
insert(_el$5, () => props.events.length, _el$6);
|
|
23
|
-
insert(_el$8, createComponent(For, {
|
|
24
|
-
get each() {
|
|
25
|
-
return props.events;
|
|
26
|
-
},
|
|
27
|
-
children: (event) => (() => {
|
|
28
|
-
var _el$0 = _tmpl$3(), _el$1 = _el$0.firstChild, _el$10 = _el$1.firstChild, _el$11 = _el$1.nextSibling;
|
|
29
|
-
insert(_el$1, () => event.name, _el$10);
|
|
30
|
-
insert(_el$1, () => formattedTimestamp(event.timestamp), null);
|
|
31
|
-
insert(_el$11, () => JSON.stringify(event.payload, null, 2));
|
|
32
|
-
effect((_p$) => {
|
|
33
|
-
var _v$8 = styles().detailSection, _v$9 = styles().detailSectionHeader, _v$0 = styles().conversationDetails.jsonPreview;
|
|
34
|
-
_v$8 !== _p$.e && className(_el$0, _p$.e = _v$8);
|
|
35
|
-
_v$9 !== _p$.t && className(_el$1, _p$.t = _v$9);
|
|
36
|
-
_v$0 !== _p$.a && className(_el$11, _p$.a = _v$0);
|
|
37
|
-
return _p$;
|
|
38
|
-
}, {
|
|
39
|
-
e: void 0,
|
|
40
|
-
t: void 0,
|
|
41
|
-
a: void 0
|
|
42
|
-
});
|
|
43
|
-
return _el$0;
|
|
44
|
-
})()
|
|
45
|
-
}));
|
|
46
|
-
effect((_p$) => {
|
|
47
|
-
var _v$ = styles().conversationDetails.streamContainer, _v$2 = styles().conversationDetails.streamHeader, _v$3 = styles().conversationDetails.streamHeaderRow, _v$4 = styles().conversationDetails.streamTitle, _v$5 = `${styles().conversationDetails.chunkBadge} ${styles().conversationDetails.chunkBadgeCount}`, _v$6 = styles().conversationDetails.streamSubtitle, _v$7 = styles().conversationDetails.messageGroups;
|
|
48
|
-
_v$ !== _p$.e && className(_el$, _p$.e = _v$);
|
|
49
|
-
_v$2 !== _p$.t && className(_el$2, _p$.t = _v$2);
|
|
50
|
-
_v$3 !== _p$.a && className(_el$3, _p$.a = _v$3);
|
|
51
|
-
_v$4 !== _p$.o && className(_el$4, _p$.o = _v$4);
|
|
52
|
-
_v$5 !== _p$.i && className(_el$5, _p$.i = _v$5);
|
|
53
|
-
_v$6 !== _p$.n && className(_el$7, _p$.n = _v$6);
|
|
54
|
-
_v$7 !== _p$.s && className(_el$8, _p$.s = _v$7);
|
|
55
|
-
return _p$;
|
|
56
|
-
}, {
|
|
57
|
-
e: void 0,
|
|
58
|
-
t: void 0,
|
|
59
|
-
a: void 0,
|
|
60
|
-
o: void 0,
|
|
61
|
-
i: void 0,
|
|
62
|
-
n: void 0,
|
|
63
|
-
s: void 0
|
|
64
|
-
});
|
|
65
|
-
return _el$;
|
|
66
|
-
}
|
|
67
|
-
});
|
|
68
|
-
};
|
|
69
|
-
export {
|
|
70
|
-
ActivityEventsTab
|
|
71
|
-
};
|
|
72
|
-
//# sourceMappingURL=ActivityEventsTab.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ActivityEventsTab.js","sources":["../../../../src/components/conversation/ActivityEventsTab.tsx"],"sourcesContent":["import { For, Show } from 'solid-js'\nimport { useStyles } from '../../styles/use-styles'\nimport type { Component } from 'solid-js'\nimport type { ActivityEvent } from '../../store/ai-context'\n\ninterface ActivityEventsTabProps {\n title: string\n events: Array<ActivityEvent>\n}\n\nexport const ActivityEventsTab: Component<ActivityEventsTabProps> = (props) => {\n const styles = useStyles()\n\n const formattedTimestamp = (timestamp: number) =>\n new Date(timestamp).toLocaleTimeString()\n\n return (\n <Show\n when={props.events.length > 0}\n fallback={\n <div class={styles().conversationDetails.noChunks}>No events yet</div>\n }\n >\n <div class={styles().conversationDetails.streamContainer}>\n <div class={styles().conversationDetails.streamHeader}>\n <div class={styles().conversationDetails.streamHeaderRow}>\n <div class={styles().conversationDetails.streamTitle}>\n {props.title}\n </div>\n <div\n class={`${styles().conversationDetails.chunkBadge} ${styles().conversationDetails.chunkBadgeCount}`}\n >\n {props.events.length} events\n </div>\n </div>\n <div class={styles().conversationDetails.streamSubtitle}>\n Activity event log\n </div>\n </div>\n <div class={styles().conversationDetails.messageGroups}>\n <For each={props.events}>\n {(event) => (\n <div class={styles().detailSection}>\n <div class={styles().detailSectionHeader}>\n {event.name} · {formattedTimestamp(event.timestamp)}\n </div>\n <pre class={styles().conversationDetails.jsonPreview}>\n {JSON.stringify(event.payload, null, 2)}\n </pre>\n </div>\n )}\n </For>\n </div>\n </div>\n </Show>\n )\n}\n"],"names":["ActivityEventsTab","props","styles","useStyles","formattedTimestamp","timestamp","Date","toLocaleTimeString","_$createComponent","Show","when","events","length","fallback","_el$9","_tmpl$2","_$effect","_$className","conversationDetails","noChunks","children","_el$","_tmpl$","_el$2","firstChild","_el$3","_el$4","_el$5","nextSibling","_el$6","_el$7","_el$8","_$insert","title","For","each","event","_el$0","_tmpl$3","_el$1","_el$10","_el$11","name","JSON","stringify","payload","_p$","_v$8","detailSection","_v$9","detailSectionHeader","_v$0","jsonPreview","e","t","a","undefined","_v$","streamContainer","_v$2","streamHeader","_v$3","streamHeaderRow","_v$4","streamTitle","_v$5","chunkBadge","chunkBadgeCount","_v$6","streamSubtitle","_v$7","messageGroups","o","i","n","s"],"mappings":"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"}
|