@malette/agent-sdk 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,307 @@
1
+ /* Agent SDK theme tokens */
2
+ .agent-sdk-theme {
3
+ --agent-bg: #0b0b0d;
4
+ --agent-surface-1: #111111;
5
+ --agent-surface-2: #1a1a1a;
6
+ --agent-surface-3: #222222;
7
+ --agent-border-1: #2a2a2a;
8
+ --agent-border-2: #333333;
9
+ --agent-text-1: #f8fafc;
10
+ --agent-text-2: #e2e8f0;
11
+ --agent-text-3: #cbd5e1;
12
+ --agent-text-4: #94a3b8;
13
+ --agent-muted: #64748b;
14
+ --agent-accent: #d8ff00;
15
+ --agent-accent-strong: #c2e600;
16
+ --agent-user-bubble-bg: #2563eb;
17
+ --agent-user-bubble-text: #ffffff;
18
+ --agent-info: #60a5fa;
19
+ --agent-info-strong: #3b82f6;
20
+ --agent-success: #34d399;
21
+ --agent-success-strong: #10b981;
22
+ --agent-warning: #f59e0b;
23
+ --agent-warning-strong: #d97706;
24
+ --agent-danger: #f87171;
25
+ --agent-danger-strong: #ef4444;
26
+ --agent-purple: #c084fc;
27
+ --agent-purple-strong: #a855f7;
28
+ --agent-json-key: #93c5fd;
29
+ --agent-json-string: #6ee7b7;
30
+ --agent-json-number: #fdba74;
31
+ --agent-json-boolean: #c4b5fd;
32
+ --agent-json-null: #94a3b8;
33
+ --agent-json-bracket: #e4e4e7;
34
+ --agent-json-colon: #a1a1aa;
35
+ --agent-ring: color-mix(in srgb, var(--agent-accent) 40%, transparent);
36
+ color: var(--agent-text-1);
37
+ background-color: var(--agent-bg);
38
+ }
39
+
40
+ .agent-sdk-theme.agent-sdk-light {
41
+ --agent-bg: #f8fafc;
42
+ --agent-surface-1: #ffffff;
43
+ --agent-surface-2: #f1f5f9;
44
+ --agent-surface-3: #e2e8f0;
45
+ --agent-border-1: #e2e8f0;
46
+ --agent-border-2: #cbd5e1;
47
+ --agent-text-1: #0f172a;
48
+ --agent-text-2: #1f2937;
49
+ --agent-text-3: #334155;
50
+ --agent-text-4: #475569;
51
+ --agent-muted: #64748b;
52
+ --agent-accent: #2563eb;
53
+ --agent-accent-strong: #1d4ed8;
54
+ --agent-user-bubble-bg: #D8E7FF;
55
+ --agent-user-bubble-text: #0f172a;
56
+ --agent-info: #2563eb;
57
+ --agent-info-strong: #1d4ed8;
58
+ --agent-success: #16a34a;
59
+ --agent-success-strong: #15803d;
60
+ --agent-warning: #d97706;
61
+ --agent-warning-strong: #b45309;
62
+ --agent-danger: #dc2626;
63
+ --agent-danger-strong: #b91c1c;
64
+ --agent-purple: #7c3aed;
65
+ --agent-purple-strong: #6d28d9;
66
+ --agent-json-key: #1d4ed8;
67
+ --agent-json-string: #047857;
68
+ --agent-json-number: #b45309;
69
+ --agent-json-boolean: #6d28d9;
70
+ --agent-json-null: #64748b;
71
+ --agent-json-bracket: #0f172a;
72
+ --agent-json-colon: #475569;
73
+ --agent-ring: color-mix(in srgb, var(--agent-accent) 25%, transparent);
74
+ }
75
+
76
+ /* Map common Tailwind utility classes to theme tokens */
77
+ .agent-sdk-theme .bg-black { background-color: var(--agent-bg) !important; }
78
+ .agent-sdk-theme .bg-zinc-950 { background-color: var(--agent-bg) !important; }
79
+ .agent-sdk-theme .bg-zinc-950\/80 { background-color: color-mix(in srgb, var(--agent-bg) 80%, transparent) !important; }
80
+ .agent-sdk-theme .bg-zinc-900 { background-color: var(--agent-surface-1) !important; }
81
+ .agent-sdk-theme .bg-zinc-900\/50 { background-color: color-mix(in srgb, var(--agent-surface-2) 80%, transparent) !important; }
82
+ .agent-sdk-theme .bg-zinc-900\/60 { background-color: color-mix(in srgb, var(--agent-surface-2) 85%, transparent) !important; }
83
+ .agent-sdk-theme .bg-zinc-900\/80 { background-color: color-mix(in srgb, var(--agent-surface-2) 90%, transparent) !important; }
84
+ .agent-sdk-theme .bg-zinc-900\/70 { background-color: color-mix(in srgb, var(--agent-surface-2) 85%, transparent) !important; }
85
+ .agent-sdk-theme .bg-zinc-900\/30 { background-color: color-mix(in srgb, var(--agent-surface-2) 60%, transparent) !important; }
86
+ .agent-sdk-theme .bg-zinc-900\/95 { background-color: color-mix(in srgb, var(--agent-surface-1) 95%, transparent) !important; }
87
+ .agent-sdk-theme .bg-zinc-800 { background-color: var(--agent-surface-2) !important; }
88
+ .agent-sdk-theme .bg-zinc-800\/40 { background-color: color-mix(in srgb, var(--agent-surface-3) 60%, transparent) !important; }
89
+ .agent-sdk-theme .bg-zinc-800\/30 { background-color: color-mix(in srgb, var(--agent-surface-3) 50%, transparent) !important; }
90
+ .agent-sdk-theme .bg-zinc-800\/70 { background-color: color-mix(in srgb, var(--agent-surface-3) 70%, transparent) !important; }
91
+ .agent-sdk-theme .bg-zinc-800\/50 { background-color: color-mix(in srgb, var(--agent-surface-3) 60%, transparent) !important; }
92
+ .agent-sdk-theme .bg-zinc-800\/60 { background-color: color-mix(in srgb, var(--agent-surface-3) 65%, transparent) !important; }
93
+ .agent-sdk-theme .bg-zinc-800\/80 { background-color: color-mix(in srgb, var(--agent-surface-3) 80%, transparent) !important; }
94
+ .agent-sdk-theme .bg-zinc-700 { background-color: var(--agent-surface-3) !important; }
95
+ .agent-sdk-theme .bg-zinc-700\/30 { background-color: color-mix(in srgb, var(--agent-surface-3) 40%, transparent) !important; }
96
+ .agent-sdk-theme .bg-zinc-700\/50 { background-color: color-mix(in srgb, var(--agent-surface-3) 60%, transparent) !important; }
97
+ .agent-sdk-theme .bg-black\/70 { background-color: color-mix(in srgb, var(--agent-bg) 70%, transparent) !important; }
98
+ .agent-sdk-theme .bg-blue-600 { background-color: var(--agent-user-bubble-bg) !important; }
99
+
100
+ .agent-sdk-theme .border-zinc-900 { border-color: var(--agent-border-1) !important; }
101
+ .agent-sdk-theme .border-zinc-800 { border-color: var(--agent-border-1) !important; }
102
+ .agent-sdk-theme .border-zinc-800\/50 { border-color: color-mix(in srgb, var(--agent-border-1) 70%, transparent) !important; }
103
+ .agent-sdk-theme .border-zinc-800\/40 { border-color: color-mix(in srgb, var(--agent-border-1) 70%, transparent) !important; }
104
+ .agent-sdk-theme .border-zinc-800\/30 { border-color: color-mix(in srgb, var(--agent-border-1) 60%, transparent) !important; }
105
+ .agent-sdk-theme .border-zinc-800\/60 { border-color: color-mix(in srgb, var(--agent-border-1) 80%, transparent) !important; }
106
+ .agent-sdk-theme .border-zinc-700 { border-color: var(--agent-border-2) !important; }
107
+ .agent-sdk-theme .border-zinc-700\/50 { border-color: color-mix(in srgb, var(--agent-border-2) 70%, transparent) !important; }
108
+ .agent-sdk-theme .border-zinc-700\/30 { border-color: color-mix(in srgb, var(--agent-border-2) 50%, transparent) !important; }
109
+ .agent-sdk-theme .border-zinc-700\/40 { border-color: color-mix(in srgb, var(--agent-border-2) 60%, transparent) !important; }
110
+ .agent-sdk-theme .border-zinc-700\/60 { border-color: color-mix(in srgb, var(--agent-border-2) 80%, transparent) !important; }
111
+ .agent-sdk-theme .border-zinc-600 { border-color: var(--agent-border-2) !important; }
112
+
113
+ .agent-sdk-theme .text-white { color: var(--agent-text-1) !important; }
114
+ .agent-sdk-theme .text-black { color: var(--agent-text-1) !important; }
115
+ .agent-sdk-theme .text-zinc-100 { color: var(--agent-text-1) !important; }
116
+ .agent-sdk-theme .text-zinc-200 { color: var(--agent-text-2) !important; }
117
+ .agent-sdk-theme .text-zinc-300 { color: var(--agent-text-3) !important; }
118
+ .agent-sdk-theme .text-zinc-400 { color: var(--agent-text-4) !important; }
119
+ .agent-sdk-theme .text-zinc-500 { color: var(--agent-muted) !important; }
120
+ .agent-sdk-theme .text-zinc-600 { color: var(--agent-muted) !important; }
121
+ .agent-sdk-theme .text-zinc-700 { color: var(--agent-text-3) !important; }
122
+ .agent-sdk-theme .text-zinc-800 { color: var(--agent-text-2) !important; }
123
+
124
+ .agent-sdk-theme .placeholder-zinc-600::placeholder { color: var(--agent-muted) !important; }
125
+ .agent-sdk-theme .placeholder-zinc-500::placeholder { color: var(--agent-muted) !important; }
126
+
127
+ .agent-sdk-theme .text-\[\#d8ff00\] { color: var(--agent-accent) !important; }
128
+ .agent-sdk-theme .bg-\[\#d8ff00\] { background-color: var(--agent-accent) !important; }
129
+ .agent-sdk-theme .hover\:bg-\[\#c2e600\]:hover { background-color: var(--agent-accent-strong) !important; }
130
+ .agent-sdk-theme .hover\:text-\[\#d8ff00\]:hover { color: var(--agent-accent) !important; }
131
+ .agent-sdk-theme .hover\:bg-\[\#e5ff4d\]:hover { background-color: color-mix(in srgb, var(--agent-accent) 70%, #ffffff 30%) !important; }
132
+ .agent-sdk-theme .border-\[\#d8ff00\] { border-color: var(--agent-accent) !important; }
133
+ .agent-sdk-theme .bg-\[\#d8ff00\]\/10 { background-color: color-mix(in srgb, var(--agent-accent) 12%, transparent) !important; }
134
+ .agent-sdk-theme .bg-\[\#d8ff00\]\/20 { background-color: color-mix(in srgb, var(--agent-accent) 20%, transparent) !important; }
135
+ .agent-sdk-theme .text-\[\#d8ff00\]\/70 { color: color-mix(in srgb, var(--agent-accent) 70%, transparent) !important; }
136
+ .agent-sdk-theme .text-\[\#d8ff00\]\/80 { color: color-mix(in srgb, var(--agent-accent) 80%, transparent) !important; }
137
+ .agent-sdk-theme .text-\[\#d8ff00\]\/30 { color: color-mix(in srgb, var(--agent-accent) 30%, transparent) !important; }
138
+ .agent-sdk-theme .text-\[\#e8ff40\] { color: color-mix(in srgb, var(--agent-accent) 85%, #ffffff 15%) !important; }
139
+ .agent-sdk-theme .shadow-\[\#d8ff00\]\/20 { --tw-shadow-color: color-mix(in srgb, var(--agent-accent) 20%, transparent) !important; }
140
+ .agent-sdk-theme .shadow-\[\#d8ff00\]\/25 { --tw-shadow-color: color-mix(in srgb, var(--agent-accent) 25%, transparent) !important; }
141
+ .agent-sdk-theme .shadow-\[\#d8ff00\]\/40 { --tw-shadow-color: color-mix(in srgb, var(--agent-accent) 40%, transparent) !important; }
142
+ .agent-sdk-theme .hover\:shadow-\[\#d8ff00\]\/40:hover { --tw-shadow-color: color-mix(in srgb, var(--agent-accent) 40%, transparent) !important; }
143
+ .agent-sdk-theme .border-\[\#d8ff00\]\/20 { border-color: color-mix(in srgb, var(--agent-accent) 20%, transparent) !important; }
144
+ .agent-sdk-theme .border-\[\#d8ff00\]\/30 { border-color: color-mix(in srgb, var(--agent-accent) 30%, transparent) !important; }
145
+ .agent-sdk-theme .border-\[\#d8ff00\]\/50 { border-color: color-mix(in srgb, var(--agent-accent) 50%, transparent) !important; }
146
+ .agent-sdk-theme .ring-\[\#d8ff00\]\/30 { --tw-ring-color: color-mix(in srgb, var(--agent-accent) 30%, transparent) !important; }
147
+ .agent-sdk-theme .focus\:ring-\[\#d8ff00\]\/50:focus { --tw-ring-color: color-mix(in srgb, var(--agent-accent) 50%, transparent) !important; }
148
+ .agent-sdk-theme .from-amber-500\/5 { --tw-gradient-from: color-mix(in srgb, var(--agent-warning) 8%, transparent) !important; --tw-gradient-to: color-mix(in srgb, var(--agent-warning) 0%, transparent) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
149
+
150
+ .agent-sdk-theme button:focus-visible,
151
+ .agent-sdk-theme input:focus-visible,
152
+ .agent-sdk-theme textarea:focus-visible {
153
+ outline: 2px solid var(--agent-ring);
154
+ outline-offset: 2px;
155
+ }
156
+
157
+ /* Avatar harmony */
158
+ .agent-sdk-theme .agent-avatar {
159
+ background-color: var(--agent-surface-2);
160
+ color: var(--agent-text-1);
161
+ border: 1px solid var(--agent-border-1);
162
+ }
163
+ .agent-sdk-theme .agent-avatar-user {
164
+ background-color: color-mix(in srgb, var(--agent-accent) 20%, transparent);
165
+ color: var(--agent-text-1);
166
+ border-color: color-mix(in srgb, var(--agent-accent) 30%, transparent);
167
+ }
168
+ .agent-sdk-theme .agent-avatar-bot {
169
+ background-color: color-mix(in srgb, var(--agent-surface-3) 60%, transparent);
170
+ color: var(--agent-text-1);
171
+ }
172
+ .agent-sdk-theme .agent-avatar-icon-user,
173
+ .agent-sdk-theme .agent-avatar-icon-bot {
174
+ color: currentColor;
175
+ }
176
+
177
+ /* ToolCall card readability */
178
+ .agent-sdk-theme .agent-toolcall-card {
179
+ background: linear-gradient(180deg, color-mix(in srgb, var(--agent-surface-2) 85%, transparent), color-mix(in srgb, var(--agent-surface-1) 95%, transparent));
180
+ border-color: var(--agent-border-1) !important;
181
+ }
182
+ .agent-sdk-theme .agent-toolcall-title {
183
+ color: var(--agent-text-2) !important;
184
+ }
185
+ .agent-sdk-theme .agent-toolcall-download {
186
+ background-color: color-mix(in srgb, var(--agent-surface-1) 70%, transparent) !important;
187
+ color: var(--agent-text-1) !important;
188
+ border: 1px solid color-mix(in srgb, var(--agent-border-1) 70%, transparent);
189
+ }
190
+ .agent-sdk-theme .agent-toolcall-download:hover {
191
+ background-color: color-mix(in srgb, var(--agent-surface-1) 85%, transparent) !important;
192
+ }
193
+
194
+ /* User bubble text for light theme */
195
+ .agent-sdk-theme .agent-user-bubble {
196
+ color: var(--agent-user-bubble-text) !important;
197
+ }
198
+ .agent-sdk-theme .agent-user-markdown,
199
+ .agent-sdk-theme .agent-user-markdown :where(p, li, span, strong, em, code, pre) {
200
+ color: var(--agent-user-bubble-text) !important;
201
+ }
202
+ .agent-sdk-theme .agent-user-markdown a {
203
+ color: var(--agent-info) !important;
204
+ }
205
+
206
+ /* Status color harmonization */
207
+ .agent-sdk-theme .text-blue-300,
208
+ .agent-sdk-theme .text-blue-400 { color: var(--agent-info) !important; }
209
+ .agent-sdk-theme .text-blue-500,
210
+ .agent-sdk-theme .text-blue-600 { color: var(--agent-info-strong) !important; }
211
+ .agent-sdk-theme .text-green-400 { color: var(--agent-success) !important; }
212
+ .agent-sdk-theme .text-green-500 { color: var(--agent-success-strong) !important; }
213
+ .agent-sdk-theme .text-amber-400 { color: var(--agent-warning) !important; }
214
+ .agent-sdk-theme .text-amber-500 { color: var(--agent-warning-strong) !important; }
215
+ .agent-sdk-theme .text-red-300,
216
+ .agent-sdk-theme .text-red-400 { color: var(--agent-danger) !important; }
217
+ .agent-sdk-theme .text-red-400\/60 { color: color-mix(in srgb, var(--agent-danger) 60%, transparent) !important; }
218
+ .agent-sdk-theme .text-red-500 { color: var(--agent-danger-strong) !important; }
219
+ .agent-sdk-theme .text-red-100 { color: var(--agent-danger) !important; }
220
+ .agent-sdk-theme .text-purple-300,
221
+ .agent-sdk-theme .text-purple-400 { color: var(--agent-purple) !important; }
222
+ .agent-sdk-theme .text-purple-400\/70 { color: color-mix(in srgb, var(--agent-purple) 70%, transparent) !important; }
223
+
224
+ .agent-sdk-theme .bg-blue-500\/10 { background-color: color-mix(in srgb, var(--agent-info) 12%, transparent) !important; }
225
+ .agent-sdk-theme .bg-blue-500\/20 { background-color: color-mix(in srgb, var(--agent-info) 20%, transparent) !important; }
226
+ .agent-sdk-theme .bg-green-500\/10 { background-color: color-mix(in srgb, var(--agent-success) 12%, transparent) !important; }
227
+ .agent-sdk-theme .bg-green-500\/20 { background-color: color-mix(in srgb, var(--agent-success) 20%, transparent) !important; }
228
+ .agent-sdk-theme .bg-amber-500\/10 { background-color: color-mix(in srgb, var(--agent-warning) 12%, transparent) !important; }
229
+ .agent-sdk-theme .bg-amber-500\/20 { background-color: color-mix(in srgb, var(--agent-warning) 20%, transparent) !important; }
230
+ .agent-sdk-theme .bg-amber-500\/30 { background-color: color-mix(in srgb, var(--agent-warning) 30%, transparent) !important; }
231
+ .agent-sdk-theme .bg-red-500\/10 { background-color: color-mix(in srgb, var(--agent-danger) 12%, transparent) !important; }
232
+ .agent-sdk-theme .bg-red-500\/15 { background-color: color-mix(in srgb, var(--agent-danger) 15%, transparent) !important; }
233
+ .agent-sdk-theme .bg-red-500\/20 { background-color: color-mix(in srgb, var(--agent-danger) 20%, transparent) !important; }
234
+ .agent-sdk-theme .bg-red-500\/25 { background-color: color-mix(in srgb, var(--agent-danger) 25%, transparent) !important; }
235
+ .agent-sdk-theme .bg-red-500\/30 { background-color: color-mix(in srgb, var(--agent-danger) 30%, transparent) !important; }
236
+ .agent-sdk-theme .bg-red-400\/10 { background-color: color-mix(in srgb, var(--agent-danger) 12%, transparent) !important; }
237
+ .agent-sdk-theme .bg-purple-500\/10 { background-color: color-mix(in srgb, var(--agent-purple) 12%, transparent) !important; }
238
+ .agent-sdk-theme .bg-purple-500\/20 { background-color: color-mix(in srgb, var(--agent-purple) 20%, transparent) !important; }
239
+
240
+ .agent-sdk-theme .border-blue-500\/30 { border-color: color-mix(in srgb, var(--agent-info-strong) 40%, transparent) !important; }
241
+ .agent-sdk-theme .border-l-blue-500\/50 { border-left-color: color-mix(in srgb, var(--agent-info-strong) 60%, transparent) !important; }
242
+ .agent-sdk-theme .border-green-500\/30 { border-color: color-mix(in srgb, var(--agent-success-strong) 40%, transparent) !important; }
243
+ .agent-sdk-theme .border-amber-500\/20 { border-color: color-mix(in srgb, var(--agent-warning-strong) 30%, transparent) !important; }
244
+ .agent-sdk-theme .border-amber-500\/30 { border-color: color-mix(in srgb, var(--agent-warning-strong) 40%, transparent) !important; }
245
+ .agent-sdk-theme .border-amber-500\/40 { border-color: color-mix(in srgb, var(--agent-warning-strong) 50%, transparent) !important; }
246
+ .agent-sdk-theme .border-red-500\/20 { border-color: color-mix(in srgb, var(--agent-danger-strong) 30%, transparent) !important; }
247
+ .agent-sdk-theme .border-red-500\/30 { border-color: color-mix(in srgb, var(--agent-danger-strong) 40%, transparent) !important; }
248
+ .agent-sdk-theme .border-purple-500\/20 { border-color: color-mix(in srgb, var(--agent-purple-strong) 30%, transparent) !important; }
249
+ .agent-sdk-theme .border-purple-500\/30 { border-color: color-mix(in srgb, var(--agent-purple-strong) 40%, transparent) !important; }
250
+
251
+ .agent-sdk-theme .hover\:bg-red-500\/10:hover { background-color: color-mix(in srgb, var(--agent-danger) 12%, transparent) !important; }
252
+ .agent-sdk-theme .hover\:bg-red-500\/20:hover { background-color: color-mix(in srgb, var(--agent-danger) 20%, transparent) !important; }
253
+ .agent-sdk-theme .hover\:bg-red-500\/30:hover { background-color: color-mix(in srgb, var(--agent-danger) 30%, transparent) !important; }
254
+ .agent-sdk-theme .hover\:text-red-400:hover { color: var(--agent-danger) !important; }
255
+ .agent-sdk-theme .hover\:text-amber-400:hover { color: var(--agent-warning) !important; }
256
+ .agent-sdk-theme .hover\:text-green-400:hover { color: var(--agent-success) !important; }
257
+ .agent-sdk-theme .hover\:text-blue-400:hover { color: var(--agent-info) !important; }
258
+ .agent-sdk-theme .hover\:text-purple-400:hover { color: var(--agent-purple) !important; }
259
+
260
+ .agent-sdk-theme .hover\:bg-zinc-800:hover { background-color: var(--agent-surface-2) !important; }
261
+ .agent-sdk-theme .hover\:bg-zinc-700:hover { background-color: var(--agent-surface-3) !important; }
262
+ .agent-sdk-theme .hover\:bg-zinc-800\/50:hover { background-color: color-mix(in srgb, var(--agent-surface-3) 60%, transparent) !important; }
263
+ .agent-sdk-theme .hover\:bg-zinc-800\/30:hover { background-color: color-mix(in srgb, var(--agent-surface-3) 50%, transparent) !important; }
264
+ .agent-sdk-theme .hover\:bg-zinc-700\/30:hover { background-color: color-mix(in srgb, var(--agent-surface-3) 40%, transparent) !important; }
265
+ .agent-sdk-theme .hover\:bg-zinc-700\/50:hover { background-color: color-mix(in srgb, var(--agent-surface-3) 60%, transparent) !important; }
266
+
267
+ .agent-sdk-theme .hover\:border-zinc-700:hover { border-color: var(--agent-border-2) !important; }
268
+ .agent-sdk-theme .hover\:border-zinc-700\/50:hover { border-color: color-mix(in srgb, var(--agent-border-2) 70%, transparent) !important; }
269
+ .agent-sdk-theme .hover\:border-zinc-600:hover { border-color: var(--agent-border-2) !important; }
270
+
271
+ .agent-sdk-theme .hover\:text-zinc-200:hover { color: var(--agent-text-2) !important; }
272
+ .agent-sdk-theme .hover\:text-zinc-300:hover { color: var(--agent-text-3) !important; }
273
+ .agent-sdk-theme .hover\:text-zinc-400:hover { color: var(--agent-text-4) !important; }
274
+ .agent-sdk-theme .hover\:text-white:hover { color: var(--agent-text-1) !important; }
275
+
276
+ .agent-sdk-theme .group-hover\:bg-zinc-700:hover { background-color: var(--agent-surface-3) !important; }
277
+
278
+ /* Plan card title hover */
279
+ .agent-sdk-theme .agent-plan-card {
280
+ background-color: color-mix(in srgb, var(--agent-surface-1) 90%, transparent) !important;
281
+ border-color: var(--agent-border-1) !important;
282
+ }
283
+ .agent-sdk-theme .agent-plan-title {
284
+ color: var(--agent-text-1) !important;
285
+ }
286
+ .agent-sdk-theme .agent-plan-header:hover .agent-plan-title {
287
+ color: var(--agent-text-2) !important;
288
+ }
289
+
290
+ /* Streaming JSON display */
291
+ .agent-sdk-theme .agent-json-display {
292
+ background: linear-gradient(
293
+ 180deg,
294
+ color-mix(in srgb, var(--agent-surface-2) 90%, transparent),
295
+ color-mix(in srgb, var(--agent-surface-1) 96%, transparent)
296
+ ) !important;
297
+ }
298
+ .agent-sdk-theme .agent-json-dot-red { background-color: var(--agent-danger) !important; }
299
+ .agent-sdk-theme .agent-json-dot-amber { background-color: var(--agent-warning) !important; }
300
+ .agent-sdk-theme .agent-json-dot-green { background-color: var(--agent-success) !important; }
301
+ .agent-sdk-theme .agent-json-pulse,
302
+ .agent-sdk-theme .agent-json-caret { background-color: var(--agent-accent) !important; }
303
+
304
+ /* AgentChat embedded mode - inherit container height */
305
+ .agent-chat-embedded .h-screen {
306
+ height: 100% !important;
307
+ }
package/package.json ADDED
@@ -0,0 +1,63 @@
1
+ {
2
+ "name": "@malette/agent-sdk",
3
+ "version": "0.1.0",
4
+ "description": "Agent SDK for Malette - Complete agent conversation capabilities",
5
+ "main": "dist/index.js",
6
+ "module": "dist/index.mjs",
7
+ "types": "dist/index.d.ts",
8
+ "exports": {
9
+ ".": {
10
+ "types": "./dist/index.d.ts",
11
+ "import": "./dist/index.mjs",
12
+ "require": "./dist/index.js"
13
+ },
14
+ "./components": {
15
+ "types": "./dist/components/index.d.ts",
16
+ "import": "./dist/components/index.mjs",
17
+ "require": "./dist/components/index.js"
18
+ },
19
+ "./styles.css": "./dist/styles.css"
20
+ },
21
+ "scripts": {
22
+ "build": "tsup",
23
+ "dev": "tsup --watch",
24
+ "clean": "rm -rf dist"
25
+ },
26
+ "dependencies": {
27
+ "@radix-ui/react-dialog": "^1.1.15",
28
+ "@radix-ui/react-scroll-area": "^1.1.0",
29
+ "@radix-ui/react-slot": "^1.2.3",
30
+ "ali-oss": "^6.18.0",
31
+ "js-cookie": "^3.0.5",
32
+ "zustand": "^5.0.2"
33
+ },
34
+ "peerDependencies": {
35
+ "antd": "^5.0.0 || ^6.0.0",
36
+ "highlight.js": "^11.0.0",
37
+ "lucide-react": "^0.453.0 || ^0.552.0",
38
+ "marked": "^15.0.0",
39
+ "react": "^18",
40
+ "react-dom": "^18",
41
+ "react-markdown": "^10.0.0"
42
+ },
43
+ "devDependencies": {
44
+ "@types/js-cookie": "^3.0.6",
45
+ "@types/react": "^18.3.0",
46
+ "@types/react-dom": "^18.3.0",
47
+ "react-is": "^18.0.0",
48
+ "tsup": "^8.0.0",
49
+ "typescript": "^5"
50
+ },
51
+ "files": [
52
+ "dist"
53
+ ],
54
+ "keywords": [
55
+ "agent",
56
+ "ai",
57
+ "chat",
58
+ "sdk",
59
+ "malette"
60
+ ],
61
+ "author": "",
62
+ "license": "MIT"
63
+ }