@apteva/apteva-kit 0.1.86 → 0.1.88
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/index.d.mts +20 -1
- package/dist/index.d.ts +20 -1
- package/dist/index.js +128 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +575 -447
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -761,6 +761,10 @@ var WIDGET_DEFINITIONS = {
|
|
|
761
761
|
chart: {
|
|
762
762
|
schema: "chartType: line|bar|pie, data: {labels, datasets}",
|
|
763
763
|
example: '@ui:chart[{"chartType": "bar", "data": {"labels": ["A"], "datasets": [{"label": "X", "data": [10]}]}}]'
|
|
764
|
+
},
|
|
765
|
+
flow: {
|
|
766
|
+
schema: "title?, steps: [{id, label, description?, status?: pending|active|completed|error|skipped}], direction?: vertical|horizontal, compact? - Show task/process flow. Omit status for proposal view.",
|
|
767
|
+
example: '@ui:flow[{"title": "Plan", "steps": [{"id": "1", "label": "Step 1", "description": "Details"}, {"id": "2", "label": "Step 2"}]}]'
|
|
764
768
|
}
|
|
765
769
|
};
|
|
766
770
|
var ALL_WIDGET_TYPES = Object.keys(WIDGET_DEFINITIONS);
|
|
@@ -1204,38 +1208,162 @@ function Form({ widget, onAction }) {
|
|
|
1204
1208
|
] });
|
|
1205
1209
|
}
|
|
1206
1210
|
|
|
1207
|
-
// src/components/Widgets/
|
|
1211
|
+
// src/components/Widgets/widget-library/Image.tsx
|
|
1208
1212
|
import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
1213
|
+
function Image({ widget }) {
|
|
1214
|
+
const { src, alt, caption } = widget.props;
|
|
1215
|
+
return /* @__PURE__ */ jsxs5("figure", { className: "overflow-hidden rounded-xl", children: [
|
|
1216
|
+
/* @__PURE__ */ jsx7(
|
|
1217
|
+
"img",
|
|
1218
|
+
{
|
|
1219
|
+
src,
|
|
1220
|
+
alt,
|
|
1221
|
+
className: "w-full h-auto object-contain bg-neutral-100 dark:bg-neutral-800",
|
|
1222
|
+
loading: "lazy"
|
|
1223
|
+
}
|
|
1224
|
+
),
|
|
1225
|
+
caption && /* @__PURE__ */ jsx7("figcaption", { className: "mt-2 text-center text-sm text-neutral-600 dark:text-neutral-400", children: caption })
|
|
1226
|
+
] });
|
|
1227
|
+
}
|
|
1228
|
+
|
|
1229
|
+
// src/components/Widgets/widget-library/Flow.tsx
|
|
1230
|
+
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
1231
|
+
function StepIcon({ status, isLast }) {
|
|
1232
|
+
if (status === "completed") {
|
|
1233
|
+
return /* @__PURE__ */ jsx8("div", { className: "w-6 h-6 rounded-full bg-emerald-500 flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx8("svg", { className: "w-3.5 h-3.5 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx8("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2.5, d: "M5 13l4 4L19 7" }) }) });
|
|
1234
|
+
}
|
|
1235
|
+
if (status === "active") {
|
|
1236
|
+
return /* @__PURE__ */ jsx8("div", { className: "w-6 h-6 rounded-full bg-blue-500 flex items-center justify-center flex-shrink-0 animate-pulse", children: /* @__PURE__ */ jsx8("div", { className: "w-2 h-2 rounded-full bg-white" }) });
|
|
1237
|
+
}
|
|
1238
|
+
if (status === "error") {
|
|
1239
|
+
return /* @__PURE__ */ jsx8("div", { className: "w-6 h-6 rounded-full bg-red-500 flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx8("svg", { className: "w-3.5 h-3.5 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx8("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2.5, d: "M6 18L18 6M6 6l12 12" }) }) });
|
|
1240
|
+
}
|
|
1241
|
+
if (status === "skipped") {
|
|
1242
|
+
return /* @__PURE__ */ jsx8("div", { className: "w-6 h-6 rounded-full bg-neutral-300 dark:bg-neutral-600 flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx8("svg", { className: "w-3.5 h-3.5 text-neutral-500 dark:text-neutral-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx8("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2.5, d: "M20 12H4" }) }) });
|
|
1243
|
+
}
|
|
1244
|
+
return /* @__PURE__ */ jsx8("div", { className: "w-6 h-6 rounded-full border-2 border-neutral-300 dark:border-neutral-600 bg-white dark:bg-neutral-800 flex-shrink-0" });
|
|
1245
|
+
}
|
|
1246
|
+
function VerticalFlow({ steps, compact }) {
|
|
1247
|
+
return /* @__PURE__ */ jsx8("div", { className: "relative", children: steps.map((step, index) => {
|
|
1248
|
+
const isLast = index === steps.length - 1;
|
|
1249
|
+
const isCompleted = step.status === "completed";
|
|
1250
|
+
const isActive = step.status === "active";
|
|
1251
|
+
const isSkipped = step.status === "skipped";
|
|
1252
|
+
return /* @__PURE__ */ jsxs6("div", { className: "relative flex gap-3", children: [
|
|
1253
|
+
!isLast && /* @__PURE__ */ jsx8(
|
|
1254
|
+
"div",
|
|
1255
|
+
{
|
|
1256
|
+
className: `absolute left-[11px] top-6 w-0.5 ${compact ? "h-6" : "h-8"} ${isCompleted ? "bg-emerald-500" : "bg-neutral-200 dark:bg-neutral-700"}`
|
|
1257
|
+
}
|
|
1258
|
+
),
|
|
1259
|
+
/* @__PURE__ */ jsx8(StepIcon, { status: step.status, isLast }),
|
|
1260
|
+
/* @__PURE__ */ jsxs6("div", { className: `${compact ? "pb-4" : "pb-6"} ${isLast ? "pb-0" : ""}`, children: [
|
|
1261
|
+
/* @__PURE__ */ jsx8(
|
|
1262
|
+
"div",
|
|
1263
|
+
{
|
|
1264
|
+
className: `font-medium text-sm ${isSkipped ? "text-neutral-400 dark:text-neutral-500 line-through" : isActive ? "text-blue-600 dark:text-blue-400" : "text-neutral-900 dark:text-neutral-100"}`,
|
|
1265
|
+
children: step.label
|
|
1266
|
+
}
|
|
1267
|
+
),
|
|
1268
|
+
step.description && /* @__PURE__ */ jsx8(
|
|
1269
|
+
"div",
|
|
1270
|
+
{
|
|
1271
|
+
className: `text-xs mt-0.5 ${isSkipped ? "text-neutral-300 dark:text-neutral-600" : "text-neutral-500 dark:text-neutral-400"}`,
|
|
1272
|
+
children: step.description
|
|
1273
|
+
}
|
|
1274
|
+
)
|
|
1275
|
+
] })
|
|
1276
|
+
] }, step.id);
|
|
1277
|
+
}) });
|
|
1278
|
+
}
|
|
1279
|
+
function HorizontalFlow({ steps, compact }) {
|
|
1280
|
+
return /* @__PURE__ */ jsx8("div", { className: "flex items-start gap-2 overflow-x-auto pb-2", children: steps.map((step, index) => {
|
|
1281
|
+
const isLast = index === steps.length - 1;
|
|
1282
|
+
const isCompleted = step.status === "completed";
|
|
1283
|
+
const isActive = step.status === "active";
|
|
1284
|
+
const isSkipped = step.status === "skipped";
|
|
1285
|
+
return /* @__PURE__ */ jsxs6("div", { className: "flex items-center", children: [
|
|
1286
|
+
/* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center text-center min-w-[80px] max-w-[120px]", children: [
|
|
1287
|
+
/* @__PURE__ */ jsx8(StepIcon, { status: step.status, isLast }),
|
|
1288
|
+
/* @__PURE__ */ jsx8(
|
|
1289
|
+
"div",
|
|
1290
|
+
{
|
|
1291
|
+
className: `font-medium text-xs mt-2 ${isSkipped ? "text-neutral-400 dark:text-neutral-500 line-through" : isActive ? "text-blue-600 dark:text-blue-400" : "text-neutral-900 dark:text-neutral-100"}`,
|
|
1292
|
+
children: step.label
|
|
1293
|
+
}
|
|
1294
|
+
),
|
|
1295
|
+
step.description && !compact && /* @__PURE__ */ jsx8(
|
|
1296
|
+
"div",
|
|
1297
|
+
{
|
|
1298
|
+
className: `text-[10px] mt-0.5 ${isSkipped ? "text-neutral-300 dark:text-neutral-600" : "text-neutral-500 dark:text-neutral-400"}`,
|
|
1299
|
+
children: step.description
|
|
1300
|
+
}
|
|
1301
|
+
)
|
|
1302
|
+
] }),
|
|
1303
|
+
!isLast && /* @__PURE__ */ jsxs6("div", { className: "flex items-center px-1", children: [
|
|
1304
|
+
/* @__PURE__ */ jsx8(
|
|
1305
|
+
"div",
|
|
1306
|
+
{
|
|
1307
|
+
className: `w-8 h-0.5 ${isCompleted ? "bg-emerald-500" : "bg-neutral-200 dark:bg-neutral-700"}`
|
|
1308
|
+
}
|
|
1309
|
+
),
|
|
1310
|
+
/* @__PURE__ */ jsx8(
|
|
1311
|
+
"svg",
|
|
1312
|
+
{
|
|
1313
|
+
className: `w-2 h-2 -ml-0.5 ${isCompleted ? "text-emerald-500" : "text-neutral-300 dark:text-neutral-600"}`,
|
|
1314
|
+
fill: "currentColor",
|
|
1315
|
+
viewBox: "0 0 24 24",
|
|
1316
|
+
children: /* @__PURE__ */ jsx8("path", { d: "M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z" })
|
|
1317
|
+
}
|
|
1318
|
+
)
|
|
1319
|
+
] })
|
|
1320
|
+
] }, step.id);
|
|
1321
|
+
}) });
|
|
1322
|
+
}
|
|
1323
|
+
function Flow({ widget }) {
|
|
1324
|
+
const { title, steps, direction = "vertical", compact } = widget.props;
|
|
1325
|
+
return /* @__PURE__ */ jsxs6("div", { className: "border border-neutral-200 dark:border-neutral-700 rounded-xl bg-white dark:bg-neutral-900 overflow-hidden", children: [
|
|
1326
|
+
title && /* @__PURE__ */ jsx8("div", { className: "px-4 py-3 border-b border-neutral-200 dark:border-neutral-700", children: /* @__PURE__ */ jsx8("h3", { className: "font-semibold text-sm text-neutral-900 dark:text-neutral-100", children: title }) }),
|
|
1327
|
+
/* @__PURE__ */ jsx8("div", { className: `p-4 ${direction === "horizontal" ? "overflow-x-auto" : ""}`, children: direction === "horizontal" ? /* @__PURE__ */ jsx8(HorizontalFlow, { steps, compact }) : /* @__PURE__ */ jsx8(VerticalFlow, { steps, compact }) })
|
|
1328
|
+
] });
|
|
1329
|
+
}
|
|
1330
|
+
|
|
1331
|
+
// src/components/Widgets/WidgetRenderer.tsx
|
|
1332
|
+
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1209
1333
|
function WidgetRenderer({ widget, onAction }) {
|
|
1210
1334
|
const renderWidget = () => {
|
|
1211
1335
|
switch (widget.type) {
|
|
1212
1336
|
case "card":
|
|
1213
|
-
return /* @__PURE__ */
|
|
1337
|
+
return /* @__PURE__ */ jsx9(Card, { widget, onAction });
|
|
1214
1338
|
case "list":
|
|
1215
|
-
return /* @__PURE__ */
|
|
1339
|
+
return /* @__PURE__ */ jsx9(List, { widget, onAction });
|
|
1216
1340
|
case "button":
|
|
1217
|
-
return /* @__PURE__ */
|
|
1341
|
+
return /* @__PURE__ */ jsx9(Button, { widget, onAction });
|
|
1218
1342
|
case "button_group":
|
|
1219
|
-
return /* @__PURE__ */
|
|
1343
|
+
return /* @__PURE__ */ jsx9(ButtonGroup, { widget, onAction });
|
|
1220
1344
|
case "table":
|
|
1221
|
-
return /* @__PURE__ */
|
|
1345
|
+
return /* @__PURE__ */ jsx9(Table, { widget, onAction });
|
|
1222
1346
|
case "form":
|
|
1223
|
-
return /* @__PURE__ */
|
|
1347
|
+
return /* @__PURE__ */ jsx9(Form, { widget, onAction });
|
|
1348
|
+
case "image":
|
|
1349
|
+
return /* @__PURE__ */ jsx9(Image, { widget });
|
|
1350
|
+
case "flow":
|
|
1351
|
+
return /* @__PURE__ */ jsx9(Flow, { widget });
|
|
1224
1352
|
default:
|
|
1225
|
-
return /* @__PURE__ */
|
|
1226
|
-
/* @__PURE__ */
|
|
1353
|
+
return /* @__PURE__ */ jsxs7("div", { className: "p-4 border border-yellow-300 bg-yellow-50 rounded-lg", children: [
|
|
1354
|
+
/* @__PURE__ */ jsxs7("p", { className: "text-sm text-yellow-800", children: [
|
|
1227
1355
|
"Unknown widget type: ",
|
|
1228
1356
|
widget.type
|
|
1229
1357
|
] }),
|
|
1230
|
-
/* @__PURE__ */
|
|
1358
|
+
/* @__PURE__ */ jsx9("pre", { className: "text-xs mt-2 overflow-auto", children: JSON.stringify(widget, null, 2) })
|
|
1231
1359
|
] });
|
|
1232
1360
|
}
|
|
1233
1361
|
};
|
|
1234
|
-
return /* @__PURE__ */
|
|
1362
|
+
return /* @__PURE__ */ jsx9("div", { className: "apteva-widget", children: renderWidget() });
|
|
1235
1363
|
}
|
|
1236
1364
|
|
|
1237
1365
|
// src/components/Widgets/Widgets.tsx
|
|
1238
|
-
import { jsx as
|
|
1366
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
1239
1367
|
function Widgets({
|
|
1240
1368
|
widgets,
|
|
1241
1369
|
onAction,
|
|
@@ -1260,85 +1388,85 @@ function Widgets({
|
|
|
1260
1388
|
normal: "gap-4",
|
|
1261
1389
|
loose: "gap-6"
|
|
1262
1390
|
};
|
|
1263
|
-
return /* @__PURE__ */
|
|
1391
|
+
return /* @__PURE__ */ jsx10("div", { className: cn(layoutClasses[layout], spacingClasses[spacing], className), children: widgets.map((widget) => /* @__PURE__ */ jsx10(WidgetRenderer, { widget, onAction }, widget.id)) });
|
|
1264
1392
|
}
|
|
1265
1393
|
|
|
1266
1394
|
// src/components/Widgets/WidgetSkeleton.tsx
|
|
1267
|
-
import { jsx as
|
|
1395
|
+
import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1268
1396
|
function WidgetSkeleton({ type, className }) {
|
|
1269
1397
|
switch (type) {
|
|
1270
1398
|
case "card":
|
|
1271
|
-
return /* @__PURE__ */
|
|
1272
|
-
/* @__PURE__ */
|
|
1273
|
-
/* @__PURE__ */
|
|
1274
|
-
/* @__PURE__ */
|
|
1399
|
+
return /* @__PURE__ */ jsx11("div", { className: cn("apteva-widget-skeleton animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 overflow-hidden", className), children: /* @__PURE__ */ jsxs8("div", { className: "p-4 space-y-3", children: [
|
|
1400
|
+
/* @__PURE__ */ jsx11("div", { className: "h-4 bg-neutral-200 dark:bg-neutral-700 rounded w-3/4" }),
|
|
1401
|
+
/* @__PURE__ */ jsx11("div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-full" }),
|
|
1402
|
+
/* @__PURE__ */ jsx11("div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-5/6" })
|
|
1275
1403
|
] }) });
|
|
1276
1404
|
case "list":
|
|
1277
|
-
return /* @__PURE__ */
|
|
1278
|
-
/* @__PURE__ */
|
|
1279
|
-
/* @__PURE__ */
|
|
1280
|
-
/* @__PURE__ */
|
|
1281
|
-
/* @__PURE__ */
|
|
1405
|
+
return /* @__PURE__ */ jsx11("div", { className: cn("apteva-widget-skeleton animate-pulse space-y-2", className), children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-3 p-3 rounded-lg border border-neutral-200 dark:border-neutral-800", children: [
|
|
1406
|
+
/* @__PURE__ */ jsx11("div", { className: "w-10 h-10 bg-neutral-200 dark:bg-neutral-700 rounded-full flex-shrink-0" }),
|
|
1407
|
+
/* @__PURE__ */ jsxs8("div", { className: "flex-1 space-y-2", children: [
|
|
1408
|
+
/* @__PURE__ */ jsx11("div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-1/2" }),
|
|
1409
|
+
/* @__PURE__ */ jsx11("div", { className: "h-2 bg-neutral-200 dark:bg-neutral-700 rounded w-3/4" })
|
|
1282
1410
|
] })
|
|
1283
1411
|
] }, i)) });
|
|
1284
1412
|
case "button_group":
|
|
1285
|
-
return /* @__PURE__ */
|
|
1286
|
-
/* @__PURE__ */
|
|
1287
|
-
/* @__PURE__ */
|
|
1288
|
-
/* @__PURE__ */
|
|
1413
|
+
return /* @__PURE__ */ jsxs8("div", { className: cn("apteva-widget-skeleton animate-pulse flex gap-2", className), children: [
|
|
1414
|
+
/* @__PURE__ */ jsx11("div", { className: "h-9 bg-neutral-200 dark:bg-neutral-700 rounded-lg w-20" }),
|
|
1415
|
+
/* @__PURE__ */ jsx11("div", { className: "h-9 bg-neutral-200 dark:bg-neutral-700 rounded-lg w-20" }),
|
|
1416
|
+
/* @__PURE__ */ jsx11("div", { className: "h-9 bg-neutral-200 dark:bg-neutral-700 rounded-lg w-20" })
|
|
1289
1417
|
] });
|
|
1290
1418
|
case "form":
|
|
1291
|
-
return /* @__PURE__ */
|
|
1292
|
-
/* @__PURE__ */
|
|
1293
|
-
/* @__PURE__ */
|
|
1294
|
-
/* @__PURE__ */
|
|
1295
|
-
/* @__PURE__ */
|
|
1419
|
+
return /* @__PURE__ */ jsxs8("div", { className: cn("apteva-widget-skeleton animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 p-4 space-y-4", className), children: [
|
|
1420
|
+
/* @__PURE__ */ jsx11("div", { className: "h-4 bg-neutral-200 dark:bg-neutral-700 rounded w-1/3" }),
|
|
1421
|
+
/* @__PURE__ */ jsxs8("div", { className: "space-y-3", children: [
|
|
1422
|
+
/* @__PURE__ */ jsx11("div", { className: "h-10 bg-neutral-200 dark:bg-neutral-700 rounded" }),
|
|
1423
|
+
/* @__PURE__ */ jsx11("div", { className: "h-10 bg-neutral-200 dark:bg-neutral-700 rounded" })
|
|
1296
1424
|
] }),
|
|
1297
|
-
/* @__PURE__ */
|
|
1425
|
+
/* @__PURE__ */ jsx11("div", { className: "h-9 bg-neutral-200 dark:bg-neutral-700 rounded w-24" })
|
|
1298
1426
|
] });
|
|
1299
1427
|
case "chart":
|
|
1300
|
-
return /* @__PURE__ */
|
|
1301
|
-
/* @__PURE__ */
|
|
1302
|
-
/* @__PURE__ */
|
|
1303
|
-
/* @__PURE__ */
|
|
1304
|
-
/* @__PURE__ */
|
|
1305
|
-
/* @__PURE__ */
|
|
1306
|
-
/* @__PURE__ */
|
|
1307
|
-
/* @__PURE__ */
|
|
1428
|
+
return /* @__PURE__ */ jsxs8("div", { className: cn("apteva-widget-skeleton animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 p-4", className), children: [
|
|
1429
|
+
/* @__PURE__ */ jsx11("div", { className: "h-4 bg-neutral-200 dark:bg-neutral-700 rounded w-1/4 mb-4" }),
|
|
1430
|
+
/* @__PURE__ */ jsxs8("div", { className: "flex items-end gap-2 h-32", children: [
|
|
1431
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 bg-neutral-200 dark:bg-neutral-700 rounded-t h-1/2" }),
|
|
1432
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 bg-neutral-200 dark:bg-neutral-700 rounded-t h-3/4" }),
|
|
1433
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 bg-neutral-200 dark:bg-neutral-700 rounded-t h-1/3" }),
|
|
1434
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 bg-neutral-200 dark:bg-neutral-700 rounded-t h-full" }),
|
|
1435
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 bg-neutral-200 dark:bg-neutral-700 rounded-t h-2/3" })
|
|
1308
1436
|
] })
|
|
1309
1437
|
] });
|
|
1310
1438
|
case "image":
|
|
1311
|
-
return /* @__PURE__ */
|
|
1439
|
+
return /* @__PURE__ */ jsx11("div", { className: cn("apteva-widget-skeleton animate-pulse", className), children: /* @__PURE__ */ jsx11("div", { className: "aspect-video bg-neutral-200 dark:bg-neutral-700 rounded-lg" }) });
|
|
1312
1440
|
case "gallery":
|
|
1313
|
-
return /* @__PURE__ */
|
|
1441
|
+
return /* @__PURE__ */ jsx11("div", { className: cn("apteva-widget-skeleton animate-pulse grid grid-cols-3 gap-2", className), children: [1, 2, 3].map((i) => /* @__PURE__ */ jsx11("div", { className: "aspect-square bg-neutral-200 dark:bg-neutral-700 rounded-lg" }, i)) });
|
|
1314
1442
|
case "map":
|
|
1315
|
-
return /* @__PURE__ */
|
|
1316
|
-
/* @__PURE__ */
|
|
1317
|
-
/* @__PURE__ */
|
|
1443
|
+
return /* @__PURE__ */ jsx11("div", { className: cn("apteva-widget-skeleton animate-pulse", className), children: /* @__PURE__ */ jsx11("div", { className: "h-48 bg-neutral-200 dark:bg-neutral-700 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ jsxs8("svg", { className: "w-8 h-8 text-neutral-400 dark:text-neutral-500", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: [
|
|
1444
|
+
/* @__PURE__ */ jsx11("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" }),
|
|
1445
|
+
/* @__PURE__ */ jsx11("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M15 11a3 3 0 11-6 0 3 3 0 016 0z" })
|
|
1318
1446
|
] }) }) });
|
|
1319
1447
|
case "table":
|
|
1320
|
-
return /* @__PURE__ */
|
|
1321
|
-
/* @__PURE__ */
|
|
1322
|
-
/* @__PURE__ */
|
|
1323
|
-
/* @__PURE__ */
|
|
1324
|
-
/* @__PURE__ */
|
|
1448
|
+
return /* @__PURE__ */ jsxs8("div", { className: cn("apteva-widget-skeleton animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 overflow-hidden", className), children: [
|
|
1449
|
+
/* @__PURE__ */ jsxs8("div", { className: "flex bg-neutral-100 dark:bg-neutral-800 border-b border-neutral-200 dark:border-neutral-700", children: [
|
|
1450
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 px-4 py-3", children: /* @__PURE__ */ jsx11("div", { className: "h-3 bg-neutral-300 dark:bg-neutral-600 rounded w-16" }) }),
|
|
1451
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 px-4 py-3", children: /* @__PURE__ */ jsx11("div", { className: "h-3 bg-neutral-300 dark:bg-neutral-600 rounded w-20" }) }),
|
|
1452
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 px-4 py-3", children: /* @__PURE__ */ jsx11("div", { className: "h-3 bg-neutral-300 dark:bg-neutral-600 rounded w-14" }) })
|
|
1325
1453
|
] }),
|
|
1326
|
-
[1, 2, 3].map((i) => /* @__PURE__ */
|
|
1327
|
-
/* @__PURE__ */
|
|
1328
|
-
/* @__PURE__ */
|
|
1329
|
-
/* @__PURE__ */
|
|
1454
|
+
[1, 2, 3].map((i) => /* @__PURE__ */ jsxs8("div", { className: "flex border-b border-neutral-200 dark:border-neutral-800 last:border-b-0", children: [
|
|
1455
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 px-4 py-3", children: /* @__PURE__ */ jsx11("div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-24" }) }),
|
|
1456
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 px-4 py-3", children: /* @__PURE__ */ jsx11("div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-16" }) }),
|
|
1457
|
+
/* @__PURE__ */ jsx11("div", { className: "flex-1 px-4 py-3", children: /* @__PURE__ */ jsx11("div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-20" }) })
|
|
1330
1458
|
] }, i))
|
|
1331
1459
|
] });
|
|
1332
1460
|
default:
|
|
1333
|
-
return /* @__PURE__ */
|
|
1334
|
-
/* @__PURE__ */
|
|
1335
|
-
/* @__PURE__ */
|
|
1461
|
+
return /* @__PURE__ */ jsxs8("div", { className: cn("apteva-widget-skeleton animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 p-4", className), children: [
|
|
1462
|
+
/* @__PURE__ */ jsx11("div", { className: "h-4 bg-neutral-200 dark:bg-neutral-700 rounded w-1/2 mb-2" }),
|
|
1463
|
+
/* @__PURE__ */ jsx11("div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-full" })
|
|
1336
1464
|
] });
|
|
1337
1465
|
}
|
|
1338
1466
|
}
|
|
1339
1467
|
|
|
1340
1468
|
// src/components/Chat/MarkdownContent.tsx
|
|
1341
|
-
import { jsx as
|
|
1469
|
+
import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1342
1470
|
function isImageUrl(url) {
|
|
1343
1471
|
const imageExtensions = /\.(jpg|jpeg|png|gif|webp|svg|bmp|ico)(\?.*)?$/i;
|
|
1344
1472
|
return imageExtensions.test(url);
|
|
@@ -1357,7 +1485,7 @@ function parseInlineMarkdown(text, keyPrefix = "") {
|
|
|
1357
1485
|
const alt = match[1] || "";
|
|
1358
1486
|
const src = match[2];
|
|
1359
1487
|
result.push(
|
|
1360
|
-
/* @__PURE__ */
|
|
1488
|
+
/* @__PURE__ */ jsx12(
|
|
1361
1489
|
"img",
|
|
1362
1490
|
{
|
|
1363
1491
|
src,
|
|
@@ -1372,7 +1500,7 @@ function parseInlineMarkdown(text, keyPrefix = "") {
|
|
|
1372
1500
|
const href = match[4];
|
|
1373
1501
|
if (isImageUrl(href)) {
|
|
1374
1502
|
result.push(
|
|
1375
|
-
/* @__PURE__ */
|
|
1503
|
+
/* @__PURE__ */ jsx12(
|
|
1376
1504
|
"img",
|
|
1377
1505
|
{
|
|
1378
1506
|
src: href,
|
|
@@ -1384,7 +1512,7 @@ function parseInlineMarkdown(text, keyPrefix = "") {
|
|
|
1384
1512
|
);
|
|
1385
1513
|
} else {
|
|
1386
1514
|
result.push(
|
|
1387
|
-
/* @__PURE__ */
|
|
1515
|
+
/* @__PURE__ */ jsx12(
|
|
1388
1516
|
"a",
|
|
1389
1517
|
{
|
|
1390
1518
|
href,
|
|
@@ -1398,10 +1526,10 @@ function parseInlineMarkdown(text, keyPrefix = "") {
|
|
|
1398
1526
|
);
|
|
1399
1527
|
}
|
|
1400
1528
|
} else if (match[5] !== void 0) {
|
|
1401
|
-
result.push(/* @__PURE__ */
|
|
1529
|
+
result.push(/* @__PURE__ */ jsx12("strong", { children: match[6] }, `${keyPrefix}b${key++}`));
|
|
1402
1530
|
} else if (match[7] !== void 0) {
|
|
1403
1531
|
result.push(
|
|
1404
|
-
/* @__PURE__ */
|
|
1532
|
+
/* @__PURE__ */ jsx12("code", { className: "apteva-md-inline-code", children: match[7] }, `${keyPrefix}code${key++}`)
|
|
1405
1533
|
);
|
|
1406
1534
|
}
|
|
1407
1535
|
lastIndex = match.index + match[0].length;
|
|
@@ -1421,7 +1549,7 @@ function parseMarkdown(content) {
|
|
|
1421
1549
|
const h2Match = line.match(/^##\s+(.*)$/);
|
|
1422
1550
|
if (h2Match) {
|
|
1423
1551
|
result.push(
|
|
1424
|
-
/* @__PURE__ */
|
|
1552
|
+
/* @__PURE__ */ jsx12("h2", { className: "apteva-md-h2", children: parseInlineMarkdown(h2Match[1], `${key}`) }, `h2${key++}`)
|
|
1425
1553
|
);
|
|
1426
1554
|
i++;
|
|
1427
1555
|
continue;
|
|
@@ -1429,7 +1557,7 @@ function parseMarkdown(content) {
|
|
|
1429
1557
|
const h3Match = line.match(/^###\s+(.*)$/);
|
|
1430
1558
|
if (h3Match) {
|
|
1431
1559
|
result.push(
|
|
1432
|
-
/* @__PURE__ */
|
|
1560
|
+
/* @__PURE__ */ jsx12("h3", { className: "apteva-md-h3", children: parseInlineMarkdown(h3Match[1], `${key}`) }, `h3${key++}`)
|
|
1433
1561
|
);
|
|
1434
1562
|
i++;
|
|
1435
1563
|
continue;
|
|
@@ -1442,7 +1570,7 @@ function parseMarkdown(content) {
|
|
|
1442
1570
|
const itemMatch = lines[i].match(/^(\s*)([-*+])\s+(.*)$/);
|
|
1443
1571
|
if (itemMatch && itemMatch[1].length === indent) {
|
|
1444
1572
|
listItems.push(
|
|
1445
|
-
/* @__PURE__ */
|
|
1573
|
+
/* @__PURE__ */ jsx12("li", { className: "apteva-md-li", children: parseInlineMarkdown(itemMatch[3], `${key}`) }, `li${key++}`)
|
|
1446
1574
|
);
|
|
1447
1575
|
i++;
|
|
1448
1576
|
} else {
|
|
@@ -1450,7 +1578,7 @@ function parseMarkdown(content) {
|
|
|
1450
1578
|
}
|
|
1451
1579
|
}
|
|
1452
1580
|
result.push(
|
|
1453
|
-
/* @__PURE__ */
|
|
1581
|
+
/* @__PURE__ */ jsx12("ul", { className: "apteva-md-ul", children: listItems }, `ul${key++}`)
|
|
1454
1582
|
);
|
|
1455
1583
|
continue;
|
|
1456
1584
|
}
|
|
@@ -1462,7 +1590,7 @@ function parseMarkdown(content) {
|
|
|
1462
1590
|
const itemMatch = lines[i].match(/^(\s*)(\d+)\.\s+(.*)$/);
|
|
1463
1591
|
if (itemMatch && itemMatch[1].length === indent) {
|
|
1464
1592
|
listItems.push(
|
|
1465
|
-
/* @__PURE__ */
|
|
1593
|
+
/* @__PURE__ */ jsx12("li", { className: "apteva-md-li", children: parseInlineMarkdown(itemMatch[3], `${key}`) }, `li${key++}`)
|
|
1466
1594
|
);
|
|
1467
1595
|
i++;
|
|
1468
1596
|
} else {
|
|
@@ -1470,7 +1598,7 @@ function parseMarkdown(content) {
|
|
|
1470
1598
|
}
|
|
1471
1599
|
}
|
|
1472
1600
|
result.push(
|
|
1473
|
-
/* @__PURE__ */
|
|
1601
|
+
/* @__PURE__ */ jsx12("ol", { className: "apteva-md-ol", children: listItems }, `ol${key++}`)
|
|
1474
1602
|
);
|
|
1475
1603
|
continue;
|
|
1476
1604
|
}
|
|
@@ -1493,19 +1621,19 @@ function parseMarkdown(content) {
|
|
|
1493
1621
|
}
|
|
1494
1622
|
}
|
|
1495
1623
|
result.push(
|
|
1496
|
-
/* @__PURE__ */
|
|
1497
|
-
/* @__PURE__ */
|
|
1498
|
-
/* @__PURE__ */
|
|
1624
|
+
/* @__PURE__ */ jsx12("div", { className: "apteva-md-table-wrapper", children: /* @__PURE__ */ jsxs9("table", { className: "apteva-md-table", children: [
|
|
1625
|
+
/* @__PURE__ */ jsx12("thead", { children: /* @__PURE__ */ jsx12("tr", { children: headerCells.map((cell, idx) => /* @__PURE__ */ jsx12("th", { className: "apteva-md-th", children: parseInlineMarkdown(cell, `th${key}${idx}`) }, `th${idx}`)) }) }),
|
|
1626
|
+
/* @__PURE__ */ jsx12("tbody", { children: bodyRows.map((row, rowIdx) => /* @__PURE__ */ jsx12("tr", { children: row.map((cell, cellIdx) => /* @__PURE__ */ jsx12("td", { className: "apteva-md-td", children: parseInlineMarkdown(cell, `td${key}${rowIdx}${cellIdx}`) }, `td${cellIdx}`)) }, `tr${rowIdx}`)) })
|
|
1499
1627
|
] }) }, `table-wrapper${key++}`)
|
|
1500
1628
|
);
|
|
1501
1629
|
continue;
|
|
1502
1630
|
}
|
|
1503
1631
|
}
|
|
1504
1632
|
if (line === "") {
|
|
1505
|
-
result.push(/* @__PURE__ */
|
|
1633
|
+
result.push(/* @__PURE__ */ jsx12("br", {}, `br${key++}`));
|
|
1506
1634
|
} else {
|
|
1507
1635
|
result.push(
|
|
1508
|
-
/* @__PURE__ */
|
|
1636
|
+
/* @__PURE__ */ jsxs9("span", { children: [
|
|
1509
1637
|
parseInlineMarkdown(line, `${key}`),
|
|
1510
1638
|
i < lines.length - 1 ? "\n" : ""
|
|
1511
1639
|
] }, `p${key++}`)
|
|
@@ -1516,53 +1644,53 @@ function parseMarkdown(content) {
|
|
|
1516
1644
|
return result;
|
|
1517
1645
|
}
|
|
1518
1646
|
function MarkdownContent({ content, className = "" }) {
|
|
1519
|
-
return /* @__PURE__ */
|
|
1647
|
+
return /* @__PURE__ */ jsx12("div", { className: `apteva-md ${className}`, children: parseMarkdown(content) });
|
|
1520
1648
|
}
|
|
1521
1649
|
|
|
1522
1650
|
// src/components/Chat/ToolCall.tsx
|
|
1523
|
-
import { Fragment, jsx as
|
|
1651
|
+
import { Fragment, jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1524
1652
|
function ToolCall({ name, status, isReceiving = false, inputLength = 0, streamOutput }) {
|
|
1525
1653
|
if (status === "preparing") {
|
|
1526
|
-
return /* @__PURE__ */
|
|
1527
|
-
/* @__PURE__ */
|
|
1528
|
-
/* @__PURE__ */
|
|
1529
|
-
/* @__PURE__ */
|
|
1654
|
+
return /* @__PURE__ */ jsxs10("div", { className: "apteva-tool-card apteva-tool-card-preparing", children: [
|
|
1655
|
+
/* @__PURE__ */ jsxs10("svg", { className: "apteva-tool-icon apteva-tool-icon-spin", fill: "none", viewBox: "0 0 24 24", children: [
|
|
1656
|
+
/* @__PURE__ */ jsx13("circle", { className: "apteva-tool-spinner-track", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
|
|
1657
|
+
/* @__PURE__ */ jsx13("path", { className: "apteva-tool-spinner-fill", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" })
|
|
1530
1658
|
] }),
|
|
1531
|
-
/* @__PURE__ */
|
|
1532
|
-
/* @__PURE__ */
|
|
1533
|
-
/* @__PURE__ */
|
|
1659
|
+
/* @__PURE__ */ jsxs10("span", { className: "apteva-tool-label", children: [
|
|
1660
|
+
/* @__PURE__ */ jsx13("strong", { children: name }),
|
|
1661
|
+
/* @__PURE__ */ jsx13("span", { className: "apteva-tool-status-text", children: " preparing..." })
|
|
1534
1662
|
] })
|
|
1535
1663
|
] });
|
|
1536
1664
|
}
|
|
1537
1665
|
if (status === "running") {
|
|
1538
|
-
return /* @__PURE__ */
|
|
1539
|
-
/* @__PURE__ */
|
|
1540
|
-
/* @__PURE__ */
|
|
1541
|
-
/* @__PURE__ */
|
|
1666
|
+
return /* @__PURE__ */ jsxs10("div", { className: "apteva-tool-card apteva-tool-card-running", children: [
|
|
1667
|
+
/* @__PURE__ */ jsxs10("svg", { className: "apteva-tool-icon apteva-tool-icon-spin", fill: "none", viewBox: "0 0 24 24", children: [
|
|
1668
|
+
/* @__PURE__ */ jsx13("circle", { className: "apteva-tool-spinner-track", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
|
|
1669
|
+
/* @__PURE__ */ jsx13("path", { className: "apteva-tool-spinner-fill", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" })
|
|
1542
1670
|
] }),
|
|
1543
|
-
/* @__PURE__ */
|
|
1544
|
-
/* @__PURE__ */
|
|
1545
|
-
streamOutput ? /* @__PURE__ */
|
|
1546
|
-
streamOutput ? /* @__PURE__ */
|
|
1547
|
-
/* @__PURE__ */
|
|
1548
|
-
/* @__PURE__ */
|
|
1549
|
-
/* @__PURE__ */
|
|
1550
|
-
/* @__PURE__ */
|
|
1551
|
-
/* @__PURE__ */
|
|
1671
|
+
/* @__PURE__ */ jsxs10("span", { className: "apteva-tool-label", children: [
|
|
1672
|
+
/* @__PURE__ */ jsx13("strong", { children: name }),
|
|
1673
|
+
streamOutput ? /* @__PURE__ */ jsx13("span", { className: "apteva-tool-stream-separator", children: " \xB7 " }) : null,
|
|
1674
|
+
streamOutput ? /* @__PURE__ */ jsx13("span", { className: "apteva-tool-stream-output", children: streamOutput }) : /* @__PURE__ */ jsxs10(Fragment, { children: [
|
|
1675
|
+
/* @__PURE__ */ jsx13("span", { className: "apteva-tool-status-text", children: " running" }),
|
|
1676
|
+
/* @__PURE__ */ jsxs10("span", { className: "apteva-tool-dots", children: [
|
|
1677
|
+
/* @__PURE__ */ jsx13("span", { children: "." }),
|
|
1678
|
+
/* @__PURE__ */ jsx13("span", { children: "." }),
|
|
1679
|
+
/* @__PURE__ */ jsx13("span", { children: "." })
|
|
1552
1680
|
] })
|
|
1553
1681
|
] })
|
|
1554
1682
|
] })
|
|
1555
1683
|
] });
|
|
1556
1684
|
}
|
|
1557
1685
|
if (status === "completed") {
|
|
1558
|
-
return /* @__PURE__ */
|
|
1559
|
-
/* @__PURE__ */
|
|
1560
|
-
/* @__PURE__ */
|
|
1686
|
+
return /* @__PURE__ */ jsxs10("div", { className: "apteva-tool-card apteva-tool-card-completed", children: [
|
|
1687
|
+
/* @__PURE__ */ jsx13("svg", { className: "apteva-tool-icon", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx13("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) }),
|
|
1688
|
+
/* @__PURE__ */ jsx13("span", { className: "apteva-tool-label", children: name })
|
|
1561
1689
|
] });
|
|
1562
1690
|
}
|
|
1563
|
-
return /* @__PURE__ */
|
|
1564
|
-
/* @__PURE__ */
|
|
1565
|
-
/* @__PURE__ */
|
|
1691
|
+
return /* @__PURE__ */ jsxs10("div", { className: "apteva-tool-card apteva-tool-card-error", children: [
|
|
1692
|
+
/* @__PURE__ */ jsx13("svg", { className: "apteva-tool-icon", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx13("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }),
|
|
1693
|
+
/* @__PURE__ */ jsxs10("span", { className: "apteva-tool-label", children: [
|
|
1566
1694
|
name,
|
|
1567
1695
|
" failed"
|
|
1568
1696
|
] })
|
|
@@ -1570,7 +1698,7 @@ function ToolCall({ name, status, isReceiving = false, inputLength = 0, streamOu
|
|
|
1570
1698
|
}
|
|
1571
1699
|
|
|
1572
1700
|
// src/components/Chat/Message.tsx
|
|
1573
|
-
import { jsx as
|
|
1701
|
+
import { jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1574
1702
|
function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
1575
1703
|
const isUser = message.role === "user";
|
|
1576
1704
|
const contentSegments = message.metadata?.content_segments;
|
|
@@ -1606,14 +1734,14 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
|
1606
1734
|
}, [parsedWidgets, onWidgetRender]);
|
|
1607
1735
|
const renderTextContent = (text) => {
|
|
1608
1736
|
if (!enableWidgets || isUser) {
|
|
1609
|
-
return /* @__PURE__ */
|
|
1737
|
+
return /* @__PURE__ */ jsx14(MarkdownContent, { content: text });
|
|
1610
1738
|
}
|
|
1611
1739
|
const parsed = parseWidgetsFromText(text);
|
|
1612
1740
|
const cleanedText = parsed.segments.filter((seg) => seg.type === "text" && seg.content).map((seg) => seg.content).join("");
|
|
1613
1741
|
if (!cleanedText.trim()) {
|
|
1614
1742
|
return null;
|
|
1615
1743
|
}
|
|
1616
|
-
return /* @__PURE__ */
|
|
1744
|
+
return /* @__PURE__ */ jsx14(MarkdownContent, { content: cleanedText });
|
|
1617
1745
|
};
|
|
1618
1746
|
const renderContentWithWidgets = () => {
|
|
1619
1747
|
if (!enableWidgets || isUser || !message.content) {
|
|
@@ -1628,28 +1756,28 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
|
1628
1756
|
} else if (segment.type === "widget" && segment.widget) {
|
|
1629
1757
|
if (textBuffer.trim()) {
|
|
1630
1758
|
elements.push(
|
|
1631
|
-
/* @__PURE__ */
|
|
1759
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-message-bubble apteva-message-assistant", children: /* @__PURE__ */ jsx14("div", { className: "apteva-message-content-assistant", children: /* @__PURE__ */ jsx14(MarkdownContent, { content: textBuffer }) }) }, `text-${index}`)
|
|
1632
1760
|
);
|
|
1633
1761
|
textBuffer = "";
|
|
1634
1762
|
}
|
|
1635
1763
|
elements.push(
|
|
1636
|
-
/* @__PURE__ */
|
|
1764
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-widget-standalone", children: /* @__PURE__ */ jsx14(WidgetRenderer, { widget: segment.widget, onAction }) }, `widget-${index}`)
|
|
1637
1765
|
);
|
|
1638
1766
|
} else if (segment.type === "widget_pending" && segment.pendingType) {
|
|
1639
1767
|
if (textBuffer.trim()) {
|
|
1640
1768
|
elements.push(
|
|
1641
|
-
/* @__PURE__ */
|
|
1769
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-message-bubble apteva-message-assistant", children: /* @__PURE__ */ jsx14("div", { className: "apteva-message-content-assistant", children: /* @__PURE__ */ jsx14(MarkdownContent, { content: textBuffer }) }) }, `text-${index}`)
|
|
1642
1770
|
);
|
|
1643
1771
|
textBuffer = "";
|
|
1644
1772
|
}
|
|
1645
1773
|
elements.push(
|
|
1646
|
-
/* @__PURE__ */
|
|
1774
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-widget-standalone", children: /* @__PURE__ */ jsx14(WidgetSkeleton, { type: segment.pendingType }) }, `pending-${index}`)
|
|
1647
1775
|
);
|
|
1648
1776
|
}
|
|
1649
1777
|
});
|
|
1650
1778
|
if (textBuffer.trim()) {
|
|
1651
1779
|
elements.push(
|
|
1652
|
-
/* @__PURE__ */
|
|
1780
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-message-bubble apteva-message-assistant", children: /* @__PURE__ */ jsx14("div", { className: "apteva-message-content-assistant", children: /* @__PURE__ */ jsx14(MarkdownContent, { content: textBuffer }) }) }, "text-final")
|
|
1653
1781
|
);
|
|
1654
1782
|
}
|
|
1655
1783
|
return elements.length > 0 ? elements : null;
|
|
@@ -1658,11 +1786,11 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
|
1658
1786
|
const hasAttachments = attachments.length > 0;
|
|
1659
1787
|
const renderAttachments = () => {
|
|
1660
1788
|
if (!hasAttachments) return null;
|
|
1661
|
-
return /* @__PURE__ */
|
|
1789
|
+
return /* @__PURE__ */ jsx14("div", { className: "apteva-message-attachments flex flex-wrap gap-2 mb-2 justify-end", children: attachments.map((att, index) => {
|
|
1662
1790
|
const isImage = att.type.startsWith("image/");
|
|
1663
1791
|
const isPdf = att.type === "application/pdf";
|
|
1664
1792
|
if (isImage && att.preview) {
|
|
1665
|
-
return /* @__PURE__ */
|
|
1793
|
+
return /* @__PURE__ */ jsx14("div", { className: "apteva-attachment-image relative rounded-lg overflow-hidden shadow-sm", children: /* @__PURE__ */ jsx14(
|
|
1666
1794
|
"img",
|
|
1667
1795
|
{
|
|
1668
1796
|
src: att.preview,
|
|
@@ -1671,15 +1799,15 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
|
1671
1799
|
}
|
|
1672
1800
|
) }, index);
|
|
1673
1801
|
}
|
|
1674
|
-
return /* @__PURE__ */
|
|
1802
|
+
return /* @__PURE__ */ jsxs11(
|
|
1675
1803
|
"div",
|
|
1676
1804
|
{
|
|
1677
1805
|
className: "apteva-attachment-doc flex items-center gap-3 px-4 py-3 bg-neutral-100 dark:bg-neutral-800 border border-neutral-200 dark:border-neutral-700 rounded-xl shadow-sm",
|
|
1678
1806
|
children: [
|
|
1679
|
-
/* @__PURE__ */
|
|
1680
|
-
/* @__PURE__ */
|
|
1681
|
-
/* @__PURE__ */
|
|
1682
|
-
/* @__PURE__ */
|
|
1807
|
+
/* @__PURE__ */ jsx14("div", { className: "w-10 h-10 flex items-center justify-center bg-red-100 dark:bg-red-900/30 rounded-lg text-red-600 dark:text-red-400", children: isPdf ? /* @__PURE__ */ jsx14("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx14("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z" }) }) : /* @__PURE__ */ jsx14("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx14("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" }) }) }),
|
|
1808
|
+
/* @__PURE__ */ jsxs11("div", { className: "flex flex-col min-w-0", children: [
|
|
1809
|
+
/* @__PURE__ */ jsx14("span", { className: "text-sm font-medium text-neutral-800 dark:text-neutral-200 truncate max-w-[180px]", children: att.name }),
|
|
1810
|
+
/* @__PURE__ */ jsxs11("span", { className: "text-xs text-neutral-500 dark:text-neutral-400", children: [
|
|
1683
1811
|
isPdf ? "PDF" : "Document",
|
|
1684
1812
|
" \xB7 ",
|
|
1685
1813
|
formatFileSize(att.size)
|
|
@@ -1693,13 +1821,13 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
|
1693
1821
|
};
|
|
1694
1822
|
const renderContent = () => {
|
|
1695
1823
|
if (isUser) {
|
|
1696
|
-
return /* @__PURE__ */
|
|
1824
|
+
return /* @__PURE__ */ jsx14("div", { className: "apteva-message-text", children: message.content });
|
|
1697
1825
|
}
|
|
1698
1826
|
if (isStreaming && !hasContent) {
|
|
1699
|
-
return /* @__PURE__ */
|
|
1700
|
-
/* @__PURE__ */
|
|
1701
|
-
/* @__PURE__ */
|
|
1702
|
-
/* @__PURE__ */
|
|
1827
|
+
return /* @__PURE__ */ jsxs11("div", { className: "apteva-typing-indicator", children: [
|
|
1828
|
+
/* @__PURE__ */ jsx14("span", {}),
|
|
1829
|
+
/* @__PURE__ */ jsx14("span", {}),
|
|
1830
|
+
/* @__PURE__ */ jsx14("span", {})
|
|
1703
1831
|
] });
|
|
1704
1832
|
}
|
|
1705
1833
|
if (contentSegments && contentSegments.length > 0) {
|
|
@@ -1709,7 +1837,7 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
|
1709
1837
|
};
|
|
1710
1838
|
const renderTextSegmentWithWidgets = (text, keyPrefix) => {
|
|
1711
1839
|
if (!enableWidgets) {
|
|
1712
|
-
return /* @__PURE__ */
|
|
1840
|
+
return /* @__PURE__ */ jsx14("div", { className: "apteva-message-bubble apteva-message-assistant", children: /* @__PURE__ */ jsx14("div", { className: "apteva-message-content-assistant", children: /* @__PURE__ */ jsx14(MarkdownContent, { content: text }) }) }, keyPrefix);
|
|
1713
1841
|
}
|
|
1714
1842
|
const parsed = parseWidgetsFromText(text);
|
|
1715
1843
|
const elements = [];
|
|
@@ -1720,28 +1848,28 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
|
1720
1848
|
} else if (seg.type === "widget" && seg.widget) {
|
|
1721
1849
|
if (textBuffer.trim()) {
|
|
1722
1850
|
elements.push(
|
|
1723
|
-
/* @__PURE__ */
|
|
1851
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-message-bubble apteva-message-assistant", children: /* @__PURE__ */ jsx14("div", { className: "apteva-message-content-assistant", children: /* @__PURE__ */ jsx14(MarkdownContent, { content: textBuffer }) }) }, `${keyPrefix}-text-${idx}`)
|
|
1724
1852
|
);
|
|
1725
1853
|
textBuffer = "";
|
|
1726
1854
|
}
|
|
1727
1855
|
elements.push(
|
|
1728
|
-
/* @__PURE__ */
|
|
1856
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-widget-standalone", children: /* @__PURE__ */ jsx14(WidgetRenderer, { widget: seg.widget, onAction }) }, `${keyPrefix}-widget-${idx}`)
|
|
1729
1857
|
);
|
|
1730
1858
|
} else if (seg.type === "widget_pending" && seg.pendingType) {
|
|
1731
1859
|
if (textBuffer.trim()) {
|
|
1732
1860
|
elements.push(
|
|
1733
|
-
/* @__PURE__ */
|
|
1861
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-message-bubble apteva-message-assistant", children: /* @__PURE__ */ jsx14("div", { className: "apteva-message-content-assistant", children: /* @__PURE__ */ jsx14(MarkdownContent, { content: textBuffer }) }) }, `${keyPrefix}-text-${idx}`)
|
|
1734
1862
|
);
|
|
1735
1863
|
textBuffer = "";
|
|
1736
1864
|
}
|
|
1737
1865
|
elements.push(
|
|
1738
|
-
/* @__PURE__ */
|
|
1866
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-widget-standalone", children: /* @__PURE__ */ jsx14(WidgetSkeleton, { type: seg.pendingType }) }, `${keyPrefix}-pending-${idx}`)
|
|
1739
1867
|
);
|
|
1740
1868
|
}
|
|
1741
1869
|
});
|
|
1742
1870
|
if (textBuffer.trim()) {
|
|
1743
1871
|
elements.push(
|
|
1744
|
-
/* @__PURE__ */
|
|
1872
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-message-bubble apteva-message-assistant", children: /* @__PURE__ */ jsx14("div", { className: "apteva-message-content-assistant", children: /* @__PURE__ */ jsx14(MarkdownContent, { content: textBuffer }) }) }, `${keyPrefix}-text-final`)
|
|
1745
1873
|
);
|
|
1746
1874
|
}
|
|
1747
1875
|
return elements;
|
|
@@ -1761,7 +1889,7 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
|
1761
1889
|
}
|
|
1762
1890
|
} else if (segment.type === "tool") {
|
|
1763
1891
|
elements.push(
|
|
1764
|
-
/* @__PURE__ */
|
|
1892
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-tool-call-standalone", children: /* @__PURE__ */ jsx14(
|
|
1765
1893
|
ToolCall,
|
|
1766
1894
|
{
|
|
1767
1895
|
name: segment.name,
|
|
@@ -1777,28 +1905,28 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
|
1777
1905
|
return elements;
|
|
1778
1906
|
};
|
|
1779
1907
|
if (!isUser && (contentSegments && contentSegments.length > 0)) {
|
|
1780
|
-
return /* @__PURE__ */
|
|
1908
|
+
return /* @__PURE__ */ jsxs11("div", { className: "apteva-message-segmented", children: [
|
|
1781
1909
|
renderSegmentedContent(),
|
|
1782
|
-
message.widgets && message.widgets.length > 0 && /* @__PURE__ */
|
|
1783
|
-
/* @__PURE__ */
|
|
1910
|
+
message.widgets && message.widgets.length > 0 && /* @__PURE__ */ jsx14("div", { className: "apteva-widget-standalone", children: /* @__PURE__ */ jsx14(Widgets, { widgets: message.widgets, onAction, layout: "stack" }) }),
|
|
1911
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-message-timestamp apteva-message-timestamp-assistant", suppressHydrationWarning: true, children: message.timestamp.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) })
|
|
1784
1912
|
] });
|
|
1785
1913
|
}
|
|
1786
1914
|
const widgetContent = renderContentWithWidgets();
|
|
1787
1915
|
if (!isUser && enableWidgets && widgetContent) {
|
|
1788
|
-
return /* @__PURE__ */
|
|
1916
|
+
return /* @__PURE__ */ jsxs11("div", { className: "apteva-message-segmented", children: [
|
|
1789
1917
|
widgetContent,
|
|
1790
|
-
message.widgets && message.widgets.length > 0 && /* @__PURE__ */
|
|
1791
|
-
/* @__PURE__ */
|
|
1918
|
+
message.widgets && message.widgets.length > 0 && /* @__PURE__ */ jsx14("div", { className: "apteva-widget-standalone", children: /* @__PURE__ */ jsx14(Widgets, { widgets: message.widgets, onAction, layout: "stack" }) }),
|
|
1919
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-message-timestamp apteva-message-timestamp-assistant", suppressHydrationWarning: true, children: message.timestamp.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) })
|
|
1792
1920
|
] });
|
|
1793
1921
|
}
|
|
1794
1922
|
if (isUser && hasAttachments) {
|
|
1795
|
-
return /* @__PURE__ */
|
|
1923
|
+
return /* @__PURE__ */ jsxs11("div", { className: "apteva-message-segmented apteva-message-user-with-attachments flex flex-col items-end", children: [
|
|
1796
1924
|
renderAttachments(),
|
|
1797
|
-
message.content && /* @__PURE__ */
|
|
1798
|
-
/* @__PURE__ */
|
|
1925
|
+
message.content && /* @__PURE__ */ jsx14("div", { className: "apteva-message-bubble apteva-message-user", children: /* @__PURE__ */ jsx14("div", { className: "apteva-message-content-user", children: /* @__PURE__ */ jsx14("div", { className: "apteva-message-text", children: message.content }) }) }),
|
|
1926
|
+
/* @__PURE__ */ jsx14("div", { className: "apteva-message-timestamp apteva-message-timestamp-user", suppressHydrationWarning: true, children: message.timestamp.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) })
|
|
1799
1927
|
] });
|
|
1800
1928
|
}
|
|
1801
|
-
return /* @__PURE__ */
|
|
1929
|
+
return /* @__PURE__ */ jsxs11(
|
|
1802
1930
|
"div",
|
|
1803
1931
|
{
|
|
1804
1932
|
className: cn(
|
|
@@ -1806,17 +1934,17 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
|
|
|
1806
1934
|
isUser ? "apteva-message-user" : "apteva-message-assistant"
|
|
1807
1935
|
),
|
|
1808
1936
|
children: [
|
|
1809
|
-
/* @__PURE__ */
|
|
1810
|
-
message.widgets && message.widgets.length > 0 && /* @__PURE__ */
|
|
1811
|
-
/* @__PURE__ */
|
|
1937
|
+
/* @__PURE__ */ jsx14("div", { className: isUser ? "apteva-message-content-user" : "apteva-message-content-assistant", children: renderContent() }),
|
|
1938
|
+
message.widgets && message.widgets.length > 0 && /* @__PURE__ */ jsx14("div", { className: "apteva-widget-standalone", children: /* @__PURE__ */ jsx14(Widgets, { widgets: message.widgets, onAction, layout: "stack" }) }),
|
|
1939
|
+
/* @__PURE__ */ jsx14("div", { className: cn("apteva-message-timestamp", isUser ? "apteva-message-timestamp-user" : "apteva-message-timestamp-assistant"), suppressHydrationWarning: true, children: message.timestamp.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) })
|
|
1812
1940
|
]
|
|
1813
1941
|
}
|
|
1814
1942
|
);
|
|
1815
1943
|
}
|
|
1816
1944
|
|
|
1817
1945
|
// src/components/Chat/WelcomeScreen.tsx
|
|
1818
|
-
import { jsx as
|
|
1819
|
-
var DefaultIcon = () => /* @__PURE__ */
|
|
1946
|
+
import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1947
|
+
var DefaultIcon = () => /* @__PURE__ */ jsx15("svg", { className: "w-12 h-12 sm:w-16 sm:h-16", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx15(
|
|
1820
1948
|
"path",
|
|
1821
1949
|
{
|
|
1822
1950
|
strokeLinecap: "round",
|
|
@@ -1825,7 +1953,7 @@ var DefaultIcon = () => /* @__PURE__ */ jsx13("svg", { className: "w-12 h-12 sm:
|
|
|
1825
1953
|
d: "M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"
|
|
1826
1954
|
}
|
|
1827
1955
|
) });
|
|
1828
|
-
var ArrowIcon = () => /* @__PURE__ */
|
|
1956
|
+
var ArrowIcon = () => /* @__PURE__ */ jsx15("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx15("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 7l5 5m0 0l-5 5m5-5H6" }) });
|
|
1829
1957
|
function WelcomeScreen({
|
|
1830
1958
|
title,
|
|
1831
1959
|
subtitle,
|
|
@@ -1840,18 +1968,18 @@ function WelcomeScreen({
|
|
|
1840
1968
|
const hasPrompts = normalizedPrompts.length > 0;
|
|
1841
1969
|
const hasHeader = title || subtitle || icon;
|
|
1842
1970
|
if (!hasHeader && !hasPrompts) {
|
|
1843
|
-
return /* @__PURE__ */
|
|
1844
|
-
/* @__PURE__ */
|
|
1845
|
-
/* @__PURE__ */
|
|
1971
|
+
return /* @__PURE__ */ jsx15("div", { className: "flex items-center justify-center h-full !text-neutral-500 dark:!text-neutral-400", children: /* @__PURE__ */ jsxs12("div", { className: "text-center space-y-2", children: [
|
|
1972
|
+
/* @__PURE__ */ jsx15("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx15(DefaultIcon, {}) }),
|
|
1973
|
+
/* @__PURE__ */ jsx15("p", { className: "text-sm", children: "No messages yet. Start a conversation!" })
|
|
1846
1974
|
] }) });
|
|
1847
1975
|
}
|
|
1848
1976
|
if (variant === "minimal") {
|
|
1849
|
-
return /* @__PURE__ */
|
|
1850
|
-
hasHeader && /* @__PURE__ */
|
|
1851
|
-
title && /* @__PURE__ */
|
|
1852
|
-
subtitle && /* @__PURE__ */
|
|
1977
|
+
return /* @__PURE__ */ jsxs12("div", { className: "flex flex-col h-full px-4 py-4", children: [
|
|
1978
|
+
hasHeader && /* @__PURE__ */ jsxs12("div", { className: "mb-4", children: [
|
|
1979
|
+
title && /* @__PURE__ */ jsx15("h2", { className: "text-lg font-semibold !text-neutral-900 dark:!text-white", children: title }),
|
|
1980
|
+
subtitle && /* @__PURE__ */ jsx15("p", { className: "text-sm !text-neutral-500 dark:!text-neutral-400 mt-1", children: subtitle })
|
|
1853
1981
|
] }),
|
|
1854
|
-
hasPrompts && /* @__PURE__ */
|
|
1982
|
+
hasPrompts && /* @__PURE__ */ jsx15("div", { className: "flex-1 space-y-2", children: normalizedPrompts.map((prompt, index) => /* @__PURE__ */ jsx15(
|
|
1855
1983
|
"button",
|
|
1856
1984
|
{
|
|
1857
1985
|
onClick: () => onPromptClick(prompt.text),
|
|
@@ -1864,11 +1992,11 @@ function WelcomeScreen({
|
|
|
1864
1992
|
"transition-all duration-200",
|
|
1865
1993
|
"group"
|
|
1866
1994
|
),
|
|
1867
|
-
children: /* @__PURE__ */
|
|
1868
|
-
/* @__PURE__ */
|
|
1869
|
-
/* @__PURE__ */
|
|
1870
|
-
/* @__PURE__ */
|
|
1871
|
-
prompt.description && /* @__PURE__ */
|
|
1995
|
+
children: /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-3", children: [
|
|
1996
|
+
/* @__PURE__ */ jsx15("div", { className: "flex-shrink-0 !text-neutral-400 dark:!text-neutral-500 group-hover:!text-blue-500 dark:group-hover:!text-blue-400 transition-colors", children: prompt.icon || /* @__PURE__ */ jsx15(ArrowIcon, {}) }),
|
|
1997
|
+
/* @__PURE__ */ jsxs12("div", { className: "flex-1 min-w-0", children: [
|
|
1998
|
+
/* @__PURE__ */ jsx15("p", { className: "text-sm font-medium !text-neutral-900 dark:!text-white truncate", children: prompt.text }),
|
|
1999
|
+
prompt.description && /* @__PURE__ */ jsx15("p", { className: "text-xs !text-neutral-500 dark:!text-neutral-400 mt-0.5 truncate", children: prompt.description })
|
|
1872
2000
|
] })
|
|
1873
2001
|
] })
|
|
1874
2002
|
},
|
|
@@ -1876,14 +2004,14 @@ function WelcomeScreen({
|
|
|
1876
2004
|
)) })
|
|
1877
2005
|
] });
|
|
1878
2006
|
}
|
|
1879
|
-
return /* @__PURE__ */
|
|
1880
|
-
/* @__PURE__ */
|
|
1881
|
-
/* @__PURE__ */
|
|
1882
|
-
title && /* @__PURE__ */
|
|
1883
|
-
subtitle && /* @__PURE__ */
|
|
2007
|
+
return /* @__PURE__ */ jsxs12("div", { className: "flex flex-col items-center justify-center h-full px-4 py-6 sm:py-8", children: [
|
|
2008
|
+
/* @__PURE__ */ jsxs12("div", { className: "text-center mb-6 sm:mb-8 max-w-md", children: [
|
|
2009
|
+
/* @__PURE__ */ jsx15("div", { className: "mb-4 !text-neutral-400 dark:!text-neutral-500 flex justify-center", children: icon || /* @__PURE__ */ jsx15(DefaultIcon, {}) }),
|
|
2010
|
+
title && /* @__PURE__ */ jsx15("h1", { className: "text-xl sm:text-2xl font-semibold !text-neutral-900 dark:!text-white mb-2", children: title }),
|
|
2011
|
+
subtitle && /* @__PURE__ */ jsx15("p", { className: "text-sm sm:text-base !text-neutral-500 dark:!text-neutral-400", children: subtitle })
|
|
1884
2012
|
] }),
|
|
1885
|
-
hasPrompts && /* @__PURE__ */
|
|
1886
|
-
/* @__PURE__ */
|
|
2013
|
+
hasPrompts && /* @__PURE__ */ jsxs12("div", { className: "w-full max-w-2xl", children: [
|
|
2014
|
+
/* @__PURE__ */ jsx15("div", { className: "sm:hidden space-y-2", children: normalizedPrompts.map((prompt, index) => /* @__PURE__ */ jsx15(
|
|
1887
2015
|
"button",
|
|
1888
2016
|
{
|
|
1889
2017
|
onClick: () => onPromptClick(prompt.text),
|
|
@@ -1898,20 +2026,20 @@ function WelcomeScreen({
|
|
|
1898
2026
|
"shadow-sm hover:shadow",
|
|
1899
2027
|
"group"
|
|
1900
2028
|
),
|
|
1901
|
-
children: /* @__PURE__ */
|
|
1902
|
-
/* @__PURE__ */
|
|
1903
|
-
/* @__PURE__ */
|
|
1904
|
-
/* @__PURE__ */
|
|
1905
|
-
prompt.description && /* @__PURE__ */
|
|
2029
|
+
children: /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-3", children: [
|
|
2030
|
+
/* @__PURE__ */ jsx15("div", { className: "flex-shrink-0 w-8 h-8 rounded-lg bg-neutral-100 dark:bg-neutral-700 flex items-center justify-center !text-neutral-500 dark:!text-neutral-400 group-hover:bg-blue-100 dark:group-hover:bg-blue-900/30 group-hover:!text-blue-600 dark:group-hover:!text-blue-400 transition-colors", children: prompt.icon || /* @__PURE__ */ jsx15(ArrowIcon, {}) }),
|
|
2031
|
+
/* @__PURE__ */ jsxs12("div", { className: "flex-1 min-w-0", children: [
|
|
2032
|
+
/* @__PURE__ */ jsx15("p", { className: "text-sm font-medium !text-neutral-900 dark:!text-white", children: prompt.text }),
|
|
2033
|
+
prompt.description && /* @__PURE__ */ jsx15("p", { className: "text-xs !text-neutral-500 dark:!text-neutral-400 mt-0.5 line-clamp-1", children: prompt.description })
|
|
1906
2034
|
] }),
|
|
1907
|
-
/* @__PURE__ */
|
|
2035
|
+
/* @__PURE__ */ jsx15(
|
|
1908
2036
|
"svg",
|
|
1909
2037
|
{
|
|
1910
2038
|
className: "w-4 h-4 !text-neutral-400 group-hover:!text-blue-500 transition-colors flex-shrink-0",
|
|
1911
2039
|
fill: "none",
|
|
1912
2040
|
stroke: "currentColor",
|
|
1913
2041
|
viewBox: "0 0 24 24",
|
|
1914
|
-
children: /* @__PURE__ */
|
|
2042
|
+
children: /* @__PURE__ */ jsx15(
|
|
1915
2043
|
"path",
|
|
1916
2044
|
{
|
|
1917
2045
|
strokeLinecap: "round",
|
|
@@ -1926,7 +2054,7 @@ function WelcomeScreen({
|
|
|
1926
2054
|
},
|
|
1927
2055
|
index
|
|
1928
2056
|
)) }),
|
|
1929
|
-
/* @__PURE__ */
|
|
2057
|
+
/* @__PURE__ */ jsx15("div", { className: "hidden sm:grid sm:grid-cols-2 gap-3", children: normalizedPrompts.map((prompt, index) => /* @__PURE__ */ jsx15(
|
|
1930
2058
|
"button",
|
|
1931
2059
|
{
|
|
1932
2060
|
onClick: () => onPromptClick(prompt.text),
|
|
@@ -1941,11 +2069,11 @@ function WelcomeScreen({
|
|
|
1941
2069
|
"transition-all duration-200",
|
|
1942
2070
|
"group"
|
|
1943
2071
|
),
|
|
1944
|
-
children: /* @__PURE__ */
|
|
1945
|
-
/* @__PURE__ */
|
|
1946
|
-
/* @__PURE__ */
|
|
1947
|
-
/* @__PURE__ */
|
|
1948
|
-
prompt.description && /* @__PURE__ */
|
|
2072
|
+
children: /* @__PURE__ */ jsxs12("div", { className: "flex items-start gap-3", children: [
|
|
2073
|
+
/* @__PURE__ */ jsx15("div", { className: "flex-shrink-0 w-9 h-9 rounded-lg bg-neutral-100 dark:bg-neutral-700 flex items-center justify-center !text-neutral-500 dark:!text-neutral-400 group-hover:bg-blue-100 dark:group-hover:bg-blue-900/30 group-hover:!text-blue-600 dark:group-hover:!text-blue-400 transition-colors", children: prompt.icon || /* @__PURE__ */ jsx15(ArrowIcon, {}) }),
|
|
2074
|
+
/* @__PURE__ */ jsxs12("div", { className: "flex-1 min-w-0", children: [
|
|
2075
|
+
/* @__PURE__ */ jsx15("p", { className: "text-sm font-medium !text-neutral-900 dark:!text-white leading-snug", children: prompt.text }),
|
|
2076
|
+
prompt.description && /* @__PURE__ */ jsx15("p", { className: "text-xs !text-neutral-500 dark:!text-neutral-400 mt-1 line-clamp-2", children: prompt.description })
|
|
1949
2077
|
] })
|
|
1950
2078
|
] })
|
|
1951
2079
|
},
|
|
@@ -1956,7 +2084,7 @@ function WelcomeScreen({
|
|
|
1956
2084
|
}
|
|
1957
2085
|
|
|
1958
2086
|
// src/components/Chat/MessageList.tsx
|
|
1959
|
-
import { jsx as
|
|
2087
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
1960
2088
|
function MessageList({
|
|
1961
2089
|
messages,
|
|
1962
2090
|
onAction,
|
|
@@ -1987,7 +2115,7 @@ function MessageList({
|
|
|
1987
2115
|
}
|
|
1988
2116
|
}
|
|
1989
2117
|
}, [messages]);
|
|
1990
|
-
return /* @__PURE__ */
|
|
2118
|
+
return /* @__PURE__ */ jsx16("div", { ref: listRef, className: "apteva-message-list apteva-scrollbar-hidden", onScroll: handleScroll, children: messages.length === 0 ? /* @__PURE__ */ jsx16(
|
|
1991
2119
|
WelcomeScreen,
|
|
1992
2120
|
{
|
|
1993
2121
|
title: welcomeTitle,
|
|
@@ -1998,12 +2126,12 @@ function MessageList({
|
|
|
1998
2126
|
onPromptClick: onPromptClick || (() => {
|
|
1999
2127
|
})
|
|
2000
2128
|
}
|
|
2001
|
-
) : messages.map((message) => /* @__PURE__ */
|
|
2129
|
+
) : messages.map((message) => /* @__PURE__ */ jsx16("div", { className: message.role === "user" ? "apteva-message-row-user" : "apteva-message-row-assistant", children: /* @__PURE__ */ jsx16(Message, { message, onAction, enableWidgets, onWidgetRender }) }, message.id)) });
|
|
2002
2130
|
}
|
|
2003
2131
|
|
|
2004
2132
|
// src/components/Chat/Composer.tsx
|
|
2005
2133
|
import { useState as useState4, useRef as useRef5 } from "react";
|
|
2006
|
-
import { Fragment as Fragment2, jsx as
|
|
2134
|
+
import { Fragment as Fragment2, jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
2007
2135
|
function Composer({ onSendMessage, placeholder = "Type a message...", disabled = false, isLoading = false, onStop, onFileUpload, onSwitchMode }) {
|
|
2008
2136
|
const [text, setText] = useState4("");
|
|
2009
2137
|
const [showMenu, setShowMenu] = useState4(false);
|
|
@@ -2077,56 +2205,56 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
2077
2205
|
};
|
|
2078
2206
|
const getFileIcon = (mimeType) => {
|
|
2079
2207
|
if (mimeType.startsWith("image/")) {
|
|
2080
|
-
return /* @__PURE__ */
|
|
2208
|
+
return /* @__PURE__ */ jsx17("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx17("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" }) });
|
|
2081
2209
|
}
|
|
2082
2210
|
if (mimeType === "application/pdf") {
|
|
2083
|
-
return /* @__PURE__ */
|
|
2211
|
+
return /* @__PURE__ */ jsx17("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx17("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z" }) });
|
|
2084
2212
|
}
|
|
2085
|
-
return /* @__PURE__ */
|
|
2213
|
+
return /* @__PURE__ */ jsx17("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx17("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" }) });
|
|
2086
2214
|
};
|
|
2087
|
-
return /* @__PURE__ */
|
|
2088
|
-
fileError && /* @__PURE__ */
|
|
2089
|
-
/* @__PURE__ */
|
|
2090
|
-
/* @__PURE__ */
|
|
2215
|
+
return /* @__PURE__ */ jsxs13("div", { className: "px-4 py-3 relative", children: [
|
|
2216
|
+
fileError && /* @__PURE__ */ jsx17("div", { className: "absolute bottom-full left-4 right-4 mb-2 p-3 bg-red-50 dark:bg-red-900/30 border border-red-200 dark:border-red-800 rounded-lg z-20", children: /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2 !text-red-700 dark:!text-red-300 text-sm", children: [
|
|
2217
|
+
/* @__PURE__ */ jsx17("svg", { className: "w-4 h-4 flex-shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx17("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
2218
|
+
/* @__PURE__ */ jsx17("span", { children: fileError })
|
|
2091
2219
|
] }) }),
|
|
2092
|
-
pendingFiles.length > 0 && /* @__PURE__ */
|
|
2220
|
+
pendingFiles.length > 0 && /* @__PURE__ */ jsx17("div", { className: "mb-2 flex flex-wrap gap-2", children: pendingFiles.map((pf, index) => /* @__PURE__ */ jsxs13(
|
|
2093
2221
|
"div",
|
|
2094
2222
|
{
|
|
2095
2223
|
className: "relative group flex items-center gap-2 px-3 py-2 bg-neutral-100 dark:bg-neutral-800 border border-neutral-200 dark:border-neutral-700 rounded-lg",
|
|
2096
2224
|
children: [
|
|
2097
|
-
pf.preview ? /* @__PURE__ */
|
|
2098
|
-
/* @__PURE__ */
|
|
2099
|
-
/* @__PURE__ */
|
|
2100
|
-
/* @__PURE__ */
|
|
2225
|
+
pf.preview ? /* @__PURE__ */ jsx17("img", { src: pf.preview, alt: pf.file.name, className: "w-8 h-8 object-cover rounded" }) : /* @__PURE__ */ jsx17("div", { className: "w-8 h-8 flex items-center justify-center bg-neutral-200 dark:bg-neutral-700 rounded !text-neutral-500 dark:!text-neutral-400", children: getFileIcon(pf.file.type) }),
|
|
2226
|
+
/* @__PURE__ */ jsxs13("div", { className: "flex flex-col min-w-0", children: [
|
|
2227
|
+
/* @__PURE__ */ jsx17("span", { className: "text-xs font-medium !text-neutral-700 dark:!text-neutral-300 truncate max-w-[120px]", children: pf.file.name }),
|
|
2228
|
+
/* @__PURE__ */ jsx17("span", { className: "text-xs !text-neutral-500 dark:!text-neutral-400", children: formatFileSize(pf.file.size) })
|
|
2101
2229
|
] }),
|
|
2102
|
-
/* @__PURE__ */
|
|
2230
|
+
/* @__PURE__ */ jsx17(
|
|
2103
2231
|
"button",
|
|
2104
2232
|
{
|
|
2105
2233
|
onClick: () => removeFile(index),
|
|
2106
2234
|
className: "absolute -top-1.5 -right-1.5 w-5 h-5 bg-neutral-500 hover:bg-red-500 text-white rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity",
|
|
2107
2235
|
title: "Remove file",
|
|
2108
|
-
children: /* @__PURE__ */
|
|
2236
|
+
children: /* @__PURE__ */ jsx17("svg", { className: "w-3 h-3", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx17("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
2109
2237
|
}
|
|
2110
2238
|
)
|
|
2111
2239
|
]
|
|
2112
2240
|
},
|
|
2113
2241
|
index
|
|
2114
2242
|
)) }),
|
|
2115
|
-
/* @__PURE__ */
|
|
2116
|
-
/* @__PURE__ */
|
|
2117
|
-
/* @__PURE__ */
|
|
2243
|
+
/* @__PURE__ */ jsxs13("div", { className: "apteva-composer relative border-2 border-neutral-300 dark:border-neutral-700 bg-white dark:bg-neutral-900 transition-all duration-300 flex items-center px-3 py-2 gap-3", children: [
|
|
2244
|
+
/* @__PURE__ */ jsxs13("div", { className: "relative flex-shrink-0", children: [
|
|
2245
|
+
/* @__PURE__ */ jsx17(
|
|
2118
2246
|
"button",
|
|
2119
2247
|
{
|
|
2120
2248
|
ref: menuButtonRef,
|
|
2121
2249
|
onClick: () => setShowMenu(!showMenu),
|
|
2122
2250
|
className: "apteva-composer-menu-btn w-8 h-8 rounded-lg flex items-center justify-center transition-all !text-neutral-700 dark:!text-neutral-300 hover:bg-neutral-100 dark:hover:bg-neutral-800",
|
|
2123
2251
|
title: "More options",
|
|
2124
|
-
children: /* @__PURE__ */
|
|
2252
|
+
children: /* @__PURE__ */ jsx17("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17("path", { d: "M10 5v10M5 10h10", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
2125
2253
|
}
|
|
2126
2254
|
),
|
|
2127
|
-
showMenu && /* @__PURE__ */
|
|
2128
|
-
/* @__PURE__ */
|
|
2129
|
-
/* @__PURE__ */
|
|
2255
|
+
showMenu && /* @__PURE__ */ jsxs13(Fragment2, { children: [
|
|
2256
|
+
/* @__PURE__ */ jsx17("div", { className: "fixed inset-0 z-[9998]", onClick: () => setShowMenu(false) }),
|
|
2257
|
+
/* @__PURE__ */ jsxs13(
|
|
2130
2258
|
"div",
|
|
2131
2259
|
{
|
|
2132
2260
|
className: "apteva-composer-menu fixed bg-neutral-800 dark:bg-neutral-800 rounded-xl shadow-lg overflow-hidden z-[9999] min-w-[200px]",
|
|
@@ -2135,7 +2263,7 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
2135
2263
|
top: (menuButtonRef.current?.getBoundingClientRect().bottom ?? 0) + 8
|
|
2136
2264
|
},
|
|
2137
2265
|
children: [
|
|
2138
|
-
/* @__PURE__ */
|
|
2266
|
+
/* @__PURE__ */ jsxs13(
|
|
2139
2267
|
"button",
|
|
2140
2268
|
{
|
|
2141
2269
|
onClick: () => {
|
|
@@ -2144,12 +2272,12 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
2144
2272
|
},
|
|
2145
2273
|
className: "w-full flex items-center gap-3 px-4 py-3 hover:bg-neutral-700 dark:hover:bg-neutral-700 transition-colors !text-white text-left",
|
|
2146
2274
|
children: [
|
|
2147
|
-
/* @__PURE__ */
|
|
2148
|
-
/* @__PURE__ */
|
|
2275
|
+
/* @__PURE__ */ jsx17("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17("path", { d: "M10.5 3.5L5.5 8.5C4.67157 9.32843 4.67157 10.6716 5.5 11.5C6.32843 12.3284 7.67157 12.3284 8.5 11.5L14.5 5.5C15.8807 4.11929 15.8807 1.88071 14.5 0.5C13.1193 -0.880711 10.8807 -0.880711 9.5 0.5L3.5 6.5C1.56846 8.43154 1.56846 11.5685 3.5 13.5C5.43154 15.4315 8.56846 15.4315 10.5 13.5L15.5 8.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(2, 3)" }) }),
|
|
2276
|
+
/* @__PURE__ */ jsx17("span", { className: "!text-sm font-medium", children: "Add photos & files" })
|
|
2149
2277
|
]
|
|
2150
2278
|
}
|
|
2151
2279
|
),
|
|
2152
|
-
onSwitchMode && /* @__PURE__ */
|
|
2280
|
+
onSwitchMode && /* @__PURE__ */ jsxs13(
|
|
2153
2281
|
"button",
|
|
2154
2282
|
{
|
|
2155
2283
|
onClick: () => {
|
|
@@ -2158,8 +2286,8 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
2158
2286
|
},
|
|
2159
2287
|
className: "w-full flex items-center gap-3 px-4 py-3 hover:bg-neutral-700 dark:hover:bg-neutral-700 transition-colors !text-white text-left border-t border-neutral-700 dark:border-neutral-700",
|
|
2160
2288
|
children: [
|
|
2161
|
-
/* @__PURE__ */
|
|
2162
|
-
/* @__PURE__ */
|
|
2289
|
+
/* @__PURE__ */ jsx17("svg", { className: "w-4.5 h-4.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx17("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 10V3L4 14h7v7l9-11h-7z" }) }),
|
|
2290
|
+
/* @__PURE__ */ jsx17("span", { className: "!text-sm font-medium", children: "Switch to command mode" })
|
|
2163
2291
|
]
|
|
2164
2292
|
}
|
|
2165
2293
|
)
|
|
@@ -2168,7 +2296,7 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
2168
2296
|
)
|
|
2169
2297
|
] })
|
|
2170
2298
|
] }),
|
|
2171
|
-
/* @__PURE__ */
|
|
2299
|
+
/* @__PURE__ */ jsx17(
|
|
2172
2300
|
"textarea",
|
|
2173
2301
|
{
|
|
2174
2302
|
ref: textareaRef,
|
|
@@ -2181,26 +2309,26 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
2181
2309
|
rows: 1
|
|
2182
2310
|
}
|
|
2183
2311
|
),
|
|
2184
|
-
isLoading && onStop ? /* @__PURE__ */
|
|
2312
|
+
isLoading && onStop ? /* @__PURE__ */ jsx17(
|
|
2185
2313
|
"button",
|
|
2186
2314
|
{
|
|
2187
2315
|
onClick: onStop,
|
|
2188
2316
|
className: "apteva-composer-stop-btn !w-8 !h-8 !rounded-lg !flex !items-center !justify-center !font-bold !transition-all !flex-shrink-0 !border !border-red-400 dark:!border-red-500 !bg-red-50 dark:!bg-red-900/30 !text-red-600 dark:!text-red-400 hover:!bg-red-100 dark:hover:!bg-red-900/50",
|
|
2189
2317
|
title: "Stop generation",
|
|
2190
|
-
children: /* @__PURE__ */
|
|
2318
|
+
children: /* @__PURE__ */ jsx17("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17("rect", { x: "2", y: "2", width: "10", height: "10", rx: "1", fill: "currentColor" }) })
|
|
2191
2319
|
}
|
|
2192
|
-
) : /* @__PURE__ */
|
|
2320
|
+
) : /* @__PURE__ */ jsx17(
|
|
2193
2321
|
"button",
|
|
2194
2322
|
{
|
|
2195
2323
|
onClick: handleSend,
|
|
2196
2324
|
disabled: !text.trim() && pendingFiles.length === 0 || disabled,
|
|
2197
2325
|
className: "apteva-composer-send-btn w-8 h-8 rounded-lg flex items-center justify-center font-bold transition-all flex-shrink-0 border border-neutral-300 dark:border-neutral-600 bg-white dark:bg-neutral-800 !text-neutral-700 dark:!text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-700 disabled:opacity-30 disabled:cursor-not-allowed !text-lg",
|
|
2198
2326
|
title: "Send message",
|
|
2199
|
-
children: /* @__PURE__ */
|
|
2327
|
+
children: /* @__PURE__ */ jsx17("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx17("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
2200
2328
|
}
|
|
2201
2329
|
)
|
|
2202
2330
|
] }),
|
|
2203
|
-
/* @__PURE__ */
|
|
2331
|
+
/* @__PURE__ */ jsx17(
|
|
2204
2332
|
"input",
|
|
2205
2333
|
{
|
|
2206
2334
|
ref: fileInputRef,
|
|
@@ -2216,7 +2344,7 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
2216
2344
|
|
|
2217
2345
|
// src/components/Chat/CommandComposer.tsx
|
|
2218
2346
|
import { useState as useState5, useRef as useRef6 } from "react";
|
|
2219
|
-
import { Fragment as Fragment3, jsx as
|
|
2347
|
+
import { Fragment as Fragment3, jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2220
2348
|
function CommandComposer({
|
|
2221
2349
|
onExecute,
|
|
2222
2350
|
state,
|
|
@@ -2306,12 +2434,12 @@ function CommandComposer({
|
|
|
2306
2434
|
};
|
|
2307
2435
|
const getFileIcon = (mimeType) => {
|
|
2308
2436
|
if (mimeType.startsWith("image/")) {
|
|
2309
|
-
return /* @__PURE__ */
|
|
2437
|
+
return /* @__PURE__ */ jsx18("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx18("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" }) });
|
|
2310
2438
|
}
|
|
2311
2439
|
if (mimeType === "application/pdf") {
|
|
2312
|
-
return /* @__PURE__ */
|
|
2440
|
+
return /* @__PURE__ */ jsx18("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx18("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z" }) });
|
|
2313
2441
|
}
|
|
2314
|
-
return /* @__PURE__ */
|
|
2442
|
+
return /* @__PURE__ */ jsx18("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx18("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" }) });
|
|
2315
2443
|
};
|
|
2316
2444
|
const getDisplayContent = () => {
|
|
2317
2445
|
if (state === "loading") {
|
|
@@ -2336,12 +2464,12 @@ function CommandComposer({
|
|
|
2336
2464
|
};
|
|
2337
2465
|
const isShowingResult = state !== "idle";
|
|
2338
2466
|
const { text: displayContent, isToolCall } = getDisplayContent();
|
|
2339
|
-
return /* @__PURE__ */
|
|
2340
|
-
fileError && /* @__PURE__ */
|
|
2341
|
-
/* @__PURE__ */
|
|
2342
|
-
/* @__PURE__ */
|
|
2467
|
+
return /* @__PURE__ */ jsxs14("div", { className: "w-full relative", children: [
|
|
2468
|
+
fileError && /* @__PURE__ */ jsx18("div", { className: "absolute -top-12 left-0 right-0 mx-3 p-2 bg-red-50 dark:bg-red-900/30 border border-red-200 dark:border-red-800 rounded-lg z-30", children: /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-2 !text-red-700 dark:!text-red-300 text-xs", children: [
|
|
2469
|
+
/* @__PURE__ */ jsx18("svg", { className: "w-3 h-3 flex-shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx18("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
2470
|
+
/* @__PURE__ */ jsx18("span", { children: fileError })
|
|
2343
2471
|
] }) }),
|
|
2344
|
-
/* @__PURE__ */
|
|
2472
|
+
/* @__PURE__ */ jsxs14(
|
|
2345
2473
|
"div",
|
|
2346
2474
|
{
|
|
2347
2475
|
className: cn(
|
|
@@ -2353,21 +2481,21 @@ function CommandComposer({
|
|
|
2353
2481
|
state === "error" && "border-red-400 dark:border-red-500"
|
|
2354
2482
|
),
|
|
2355
2483
|
children: [
|
|
2356
|
-
/* @__PURE__ */
|
|
2357
|
-
state === "idle" && /* @__PURE__ */
|
|
2358
|
-
/* @__PURE__ */
|
|
2484
|
+
/* @__PURE__ */ jsxs14("div", { className: "w-8 h-8 flex items-center justify-center flex-shrink-0", children: [
|
|
2485
|
+
state === "idle" && /* @__PURE__ */ jsxs14("div", { className: "relative", children: [
|
|
2486
|
+
/* @__PURE__ */ jsx18(
|
|
2359
2487
|
"button",
|
|
2360
2488
|
{
|
|
2361
2489
|
ref: menuButtonRef,
|
|
2362
2490
|
onClick: () => setShowMenu(!showMenu),
|
|
2363
2491
|
className: "apteva-composer-menu-btn w-8 h-8 rounded-lg flex items-center justify-center transition-all !text-neutral-500 dark:!text-neutral-400 hover:!text-neutral-700 dark:hover:!text-neutral-200 hover:bg-neutral-100 dark:hover:bg-neutral-800",
|
|
2364
2492
|
title: "More options",
|
|
2365
|
-
children: /* @__PURE__ */
|
|
2493
|
+
children: /* @__PURE__ */ jsx18("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx18("path", { d: "M10 5v10M5 10h10", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
2366
2494
|
}
|
|
2367
2495
|
),
|
|
2368
|
-
showMenu && /* @__PURE__ */
|
|
2369
|
-
/* @__PURE__ */
|
|
2370
|
-
/* @__PURE__ */
|
|
2496
|
+
showMenu && /* @__PURE__ */ jsxs14(Fragment3, { children: [
|
|
2497
|
+
/* @__PURE__ */ jsx18("div", { className: "fixed inset-0 z-[9998]", onClick: () => setShowMenu(false) }),
|
|
2498
|
+
/* @__PURE__ */ jsxs14(
|
|
2371
2499
|
"div",
|
|
2372
2500
|
{
|
|
2373
2501
|
className: "apteva-composer-menu fixed bg-neutral-800 dark:bg-neutral-800 rounded-xl shadow-lg overflow-hidden z-[9999] min-w-[200px]",
|
|
@@ -2376,7 +2504,7 @@ function CommandComposer({
|
|
|
2376
2504
|
top: (menuButtonRef.current?.getBoundingClientRect().bottom ?? 0) + 8
|
|
2377
2505
|
},
|
|
2378
2506
|
children: [
|
|
2379
|
-
/* @__PURE__ */
|
|
2507
|
+
/* @__PURE__ */ jsxs14(
|
|
2380
2508
|
"button",
|
|
2381
2509
|
{
|
|
2382
2510
|
onClick: () => {
|
|
@@ -2385,12 +2513,12 @@ function CommandComposer({
|
|
|
2385
2513
|
},
|
|
2386
2514
|
className: "w-full flex items-center gap-3 px-4 py-3 hover:bg-neutral-700 dark:hover:bg-neutral-700 transition-colors !text-white text-left",
|
|
2387
2515
|
children: [
|
|
2388
|
-
/* @__PURE__ */
|
|
2389
|
-
/* @__PURE__ */
|
|
2516
|
+
/* @__PURE__ */ jsx18("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx18("path", { d: "M10.5 3.5L5.5 8.5C4.67157 9.32843 4.67157 10.6716 5.5 11.5C6.32843 12.3284 7.67157 12.3284 8.5 11.5L14.5 5.5C15.8807 4.11929 15.8807 1.88071 14.5 0.5C13.1193 -0.880711 10.8807 -0.880711 9.5 0.5L3.5 6.5C1.56846 8.43154 1.56846 11.5685 3.5 13.5C5.43154 15.4315 8.56846 15.4315 10.5 13.5L15.5 8.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(2, 3)" }) }),
|
|
2517
|
+
/* @__PURE__ */ jsx18("span", { className: "!text-sm font-medium", children: "Add photos & files" })
|
|
2390
2518
|
]
|
|
2391
2519
|
}
|
|
2392
2520
|
),
|
|
2393
|
-
onExpand && /* @__PURE__ */
|
|
2521
|
+
onExpand && /* @__PURE__ */ jsxs14(
|
|
2394
2522
|
"button",
|
|
2395
2523
|
{
|
|
2396
2524
|
onClick: () => {
|
|
@@ -2399,8 +2527,8 @@ function CommandComposer({
|
|
|
2399
2527
|
},
|
|
2400
2528
|
className: "w-full flex items-center gap-3 px-4 py-3 hover:bg-neutral-700 dark:hover:bg-neutral-700 transition-colors !text-white text-left border-t border-neutral-700 dark:border-neutral-700",
|
|
2401
2529
|
children: [
|
|
2402
|
-
/* @__PURE__ */
|
|
2403
|
-
/* @__PURE__ */
|
|
2530
|
+
/* @__PURE__ */ jsx18("svg", { className: "w-4.5 h-4.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx18("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z" }) }),
|
|
2531
|
+
/* @__PURE__ */ jsx18("span", { className: "!text-sm font-medium", children: "Expand to chat" })
|
|
2404
2532
|
]
|
|
2405
2533
|
}
|
|
2406
2534
|
)
|
|
@@ -2409,30 +2537,30 @@ function CommandComposer({
|
|
|
2409
2537
|
)
|
|
2410
2538
|
] })
|
|
2411
2539
|
] }),
|
|
2412
|
-
state === "loading" && !toolName && /* @__PURE__ */
|
|
2413
|
-
state === "loading" && toolName && /* @__PURE__ */
|
|
2540
|
+
state === "loading" && !toolName && /* @__PURE__ */ jsx18("div", { className: "w-4 h-4 border-2 border-blue-200 border-t-blue-500 rounded-full animate-spin" }),
|
|
2541
|
+
state === "loading" && toolName && /* @__PURE__ */ jsx18("div", { className: "w-2 h-2 rounded-full bg-blue-500 animate-pulse" })
|
|
2414
2542
|
] }),
|
|
2415
|
-
pendingFiles.length > 0 && state === "idle" && /* @__PURE__ */
|
|
2543
|
+
pendingFiles.length > 0 && state === "idle" && /* @__PURE__ */ jsx18("div", { className: "flex items-center gap-1 flex-shrink-0", children: pendingFiles.map((pf, index) => /* @__PURE__ */ jsxs14(
|
|
2416
2544
|
"div",
|
|
2417
2545
|
{
|
|
2418
2546
|
className: "relative group flex items-center justify-center w-6 h-6 bg-neutral-100 dark:bg-neutral-800 rounded overflow-hidden",
|
|
2419
2547
|
title: pf.file.name,
|
|
2420
2548
|
children: [
|
|
2421
|
-
pf.preview ? /* @__PURE__ */
|
|
2422
|
-
/* @__PURE__ */
|
|
2549
|
+
pf.preview ? /* @__PURE__ */ jsx18("img", { src: pf.preview, alt: pf.file.name, className: "w-6 h-6 object-cover" }) : /* @__PURE__ */ jsx18("span", { className: "text-xs !text-neutral-500 dark:!text-neutral-400", children: getFileIcon(pf.file.type) }),
|
|
2550
|
+
/* @__PURE__ */ jsx18(
|
|
2423
2551
|
"button",
|
|
2424
2552
|
{
|
|
2425
2553
|
onClick: () => removeFile(index),
|
|
2426
2554
|
className: "absolute inset-0 bg-black/50 opacity-0 group-hover:opacity-100 flex items-center justify-center transition-opacity",
|
|
2427
2555
|
title: "Remove",
|
|
2428
|
-
children: /* @__PURE__ */
|
|
2556
|
+
children: /* @__PURE__ */ jsx18("svg", { className: "w-3 h-3 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx18("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
2429
2557
|
}
|
|
2430
2558
|
)
|
|
2431
2559
|
]
|
|
2432
2560
|
},
|
|
2433
2561
|
index
|
|
2434
2562
|
)) }),
|
|
2435
|
-
state === "idle" ? /* @__PURE__ */
|
|
2563
|
+
state === "idle" ? /* @__PURE__ */ jsx18(
|
|
2436
2564
|
"textarea",
|
|
2437
2565
|
{
|
|
2438
2566
|
ref: inputRef,
|
|
@@ -2450,7 +2578,7 @@ function CommandComposer({
|
|
|
2450
2578
|
),
|
|
2451
2579
|
style: { minHeight: "24px", maxHeight: "120px" }
|
|
2452
2580
|
}
|
|
2453
|
-
) : /* @__PURE__ */
|
|
2581
|
+
) : /* @__PURE__ */ jsx18(
|
|
2454
2582
|
"div",
|
|
2455
2583
|
{
|
|
2456
2584
|
className: cn(
|
|
@@ -2461,14 +2589,14 @@ function CommandComposer({
|
|
|
2461
2589
|
state === "error" && "!text-red-600 dark:!text-red-400",
|
|
2462
2590
|
state === "plan-pending" && "!text-amber-700 dark:!text-amber-300"
|
|
2463
2591
|
),
|
|
2464
|
-
children: isToolCall ? /* @__PURE__ */
|
|
2465
|
-
/* @__PURE__ */
|
|
2466
|
-
/* @__PURE__ */
|
|
2592
|
+
children: isToolCall ? /* @__PURE__ */ jsxs14(Fragment3, { children: [
|
|
2593
|
+
/* @__PURE__ */ jsx18("span", { className: "font-mono", children: displayContent }),
|
|
2594
|
+
/* @__PURE__ */ jsx18("span", { className: "text-neutral-400 dark:text-neutral-500", children: "Running..." })
|
|
2467
2595
|
] }) : displayContent
|
|
2468
2596
|
}
|
|
2469
2597
|
),
|
|
2470
|
-
/* @__PURE__ */
|
|
2471
|
-
/* @__PURE__ */
|
|
2598
|
+
/* @__PURE__ */ jsx18("div", { className: "w-8 h-8 flex items-center justify-center flex-shrink-0", children: state === "plan-pending" ? /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-1", children: [
|
|
2599
|
+
/* @__PURE__ */ jsx18(
|
|
2472
2600
|
"button",
|
|
2473
2601
|
{
|
|
2474
2602
|
onClick: onApprove,
|
|
@@ -2476,7 +2604,7 @@ function CommandComposer({
|
|
|
2476
2604
|
children: "Approve"
|
|
2477
2605
|
}
|
|
2478
2606
|
),
|
|
2479
|
-
/* @__PURE__ */
|
|
2607
|
+
/* @__PURE__ */ jsx18(
|
|
2480
2608
|
"button",
|
|
2481
2609
|
{
|
|
2482
2610
|
onClick: onReject,
|
|
@@ -2484,26 +2612,26 @@ function CommandComposer({
|
|
|
2484
2612
|
children: "Modify"
|
|
2485
2613
|
}
|
|
2486
2614
|
)
|
|
2487
|
-
] }) : /* @__PURE__ */
|
|
2488
|
-
state === "loading" && onStop && /* @__PURE__ */
|
|
2615
|
+
] }) : /* @__PURE__ */ jsxs14(Fragment3, { children: [
|
|
2616
|
+
state === "loading" && onStop && /* @__PURE__ */ jsx18(
|
|
2489
2617
|
"button",
|
|
2490
2618
|
{
|
|
2491
2619
|
onClick: onStop,
|
|
2492
2620
|
className: "apteva-composer-stop-btn !w-8 !h-8 !rounded-lg !flex !items-center !justify-center !transition-all !border !border-red-400 dark:!border-red-500 !bg-red-50 dark:!bg-red-900/30 !text-red-600 dark:!text-red-400 hover:!bg-red-100 dark:hover:!bg-red-900/50",
|
|
2493
2621
|
title: "Stop generation",
|
|
2494
|
-
children: /* @__PURE__ */
|
|
2622
|
+
children: /* @__PURE__ */ jsx18("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx18("rect", { x: "2", y: "2", width: "10", height: "10", rx: "1", fill: "currentColor" }) })
|
|
2495
2623
|
}
|
|
2496
2624
|
),
|
|
2497
|
-
(state === "success" || state === "error") && /* @__PURE__ */
|
|
2625
|
+
(state === "success" || state === "error") && /* @__PURE__ */ jsx18(
|
|
2498
2626
|
"button",
|
|
2499
2627
|
{
|
|
2500
2628
|
onClick: handleNewCommand,
|
|
2501
2629
|
className: "w-8 h-8 rounded-lg flex items-center justify-center !text-neutral-400 hover:!text-neutral-600 dark:hover:!text-neutral-300 hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors",
|
|
2502
2630
|
title: "New command",
|
|
2503
|
-
children: /* @__PURE__ */
|
|
2631
|
+
children: /* @__PURE__ */ jsx18("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx18("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
2504
2632
|
}
|
|
2505
2633
|
),
|
|
2506
|
-
state === "idle" && /* @__PURE__ */
|
|
2634
|
+
state === "idle" && /* @__PURE__ */ jsx18(
|
|
2507
2635
|
"button",
|
|
2508
2636
|
{
|
|
2509
2637
|
onClick: handleSubmit,
|
|
@@ -2515,14 +2643,14 @@ function CommandComposer({
|
|
|
2515
2643
|
input.trim() || pendingFiles.length > 0 ? "bg-neutral-900 dark:bg-white !text-white dark:!text-neutral-900 border-neutral-900 dark:border-white" : "bg-white dark:bg-neutral-800 !text-neutral-400"
|
|
2516
2644
|
),
|
|
2517
2645
|
title: "Execute command",
|
|
2518
|
-
children: /* @__PURE__ */
|
|
2646
|
+
children: /* @__PURE__ */ jsx18("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx18("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 12h14M12 5l7 7-7 7" }) })
|
|
2519
2647
|
}
|
|
2520
2648
|
)
|
|
2521
2649
|
] }) })
|
|
2522
2650
|
]
|
|
2523
2651
|
}
|
|
2524
2652
|
),
|
|
2525
|
-
/* @__PURE__ */
|
|
2653
|
+
/* @__PURE__ */ jsx18(
|
|
2526
2654
|
"input",
|
|
2527
2655
|
{
|
|
2528
2656
|
ref: fileInputRef,
|
|
@@ -2722,7 +2850,7 @@ var AptevaClient = class {
|
|
|
2722
2850
|
var aptevaClient = new AptevaClient();
|
|
2723
2851
|
|
|
2724
2852
|
// src/components/Chat/Chat.tsx
|
|
2725
|
-
import { Fragment as Fragment4, jsx as
|
|
2853
|
+
import { Fragment as Fragment4, jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2726
2854
|
var Chat = forwardRef(function Chat2({
|
|
2727
2855
|
agentId,
|
|
2728
2856
|
threadId,
|
|
@@ -3326,16 +3454,16 @@ ${planToExecute}`;
|
|
|
3326
3454
|
setCurrentRequestId(null);
|
|
3327
3455
|
};
|
|
3328
3456
|
const isCompact = commandVariant === "compact";
|
|
3329
|
-
return /* @__PURE__ */
|
|
3330
|
-
showHeader && mode === "chat" && /* @__PURE__ */
|
|
3331
|
-
/* @__PURE__ */
|
|
3332
|
-
/* @__PURE__ */
|
|
3457
|
+
return /* @__PURE__ */ jsxs15("div", { className: cn("apteva-chat flex flex-col h-full", className), children: [
|
|
3458
|
+
showHeader && mode === "chat" && /* @__PURE__ */ jsx19("div", { className: "apteva-chat-header px-4 py-3 flex items-center justify-between", children: /* @__PURE__ */ jsxs15("div", { children: [
|
|
3459
|
+
/* @__PURE__ */ jsx19("div", { className: "apteva-chat-title", children: headerTitle }),
|
|
3460
|
+
/* @__PURE__ */ jsx19("div", { className: cn(
|
|
3333
3461
|
"apteva-chat-status",
|
|
3334
3462
|
isLoading ? chatToolName ? "apteva-chat-status-tool" : "apteva-chat-status-thinking" : "apteva-chat-status-ready"
|
|
3335
3463
|
), children: isLoading ? chatToolName ? `Using ${chatToolName}...` : "Thinking..." : "Ready" })
|
|
3336
3464
|
] }) }),
|
|
3337
|
-
mode === "chat" && /* @__PURE__ */
|
|
3338
|
-
/* @__PURE__ */
|
|
3465
|
+
mode === "chat" && /* @__PURE__ */ jsxs15(Fragment4, { children: [
|
|
3466
|
+
/* @__PURE__ */ jsx19(
|
|
3339
3467
|
MessageList,
|
|
3340
3468
|
{
|
|
3341
3469
|
messages,
|
|
@@ -3350,7 +3478,7 @@ ${planToExecute}`;
|
|
|
3350
3478
|
onWidgetRender
|
|
3351
3479
|
}
|
|
3352
3480
|
),
|
|
3353
|
-
/* @__PURE__ */
|
|
3481
|
+
/* @__PURE__ */ jsx19(
|
|
3354
3482
|
Composer,
|
|
3355
3483
|
{
|
|
3356
3484
|
onSendMessage: handleSendMessage,
|
|
@@ -3363,7 +3491,7 @@ ${planToExecute}`;
|
|
|
3363
3491
|
}
|
|
3364
3492
|
)
|
|
3365
3493
|
] }),
|
|
3366
|
-
mode === "command" && /* @__PURE__ */
|
|
3494
|
+
mode === "command" && /* @__PURE__ */ jsx19("div", { className: "w-full", children: /* @__PURE__ */ jsx19(
|
|
3367
3495
|
CommandComposer,
|
|
3368
3496
|
{
|
|
3369
3497
|
onExecute: (text, files) => {
|
|
@@ -3384,7 +3512,7 @@ ${planToExecute}`;
|
|
|
3384
3512
|
placeholder: placeholder || "Enter your command..."
|
|
3385
3513
|
}
|
|
3386
3514
|
) }),
|
|
3387
|
-
/* @__PURE__ */
|
|
3515
|
+
/* @__PURE__ */ jsx19("style", { dangerouslySetInnerHTML: {
|
|
3388
3516
|
__html: `
|
|
3389
3517
|
@keyframes pulse-border {
|
|
3390
3518
|
0%, 100% { border-color: rgb(59, 130, 246); }
|
|
@@ -3403,11 +3531,11 @@ ${planToExecute}`;
|
|
|
3403
3531
|
|
|
3404
3532
|
// src/components/Chat/CommandOutput.tsx
|
|
3405
3533
|
import { useState as useState7 } from "react";
|
|
3406
|
-
import { jsx as
|
|
3534
|
+
import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
3407
3535
|
|
|
3408
3536
|
// src/components/Command/Command.tsx
|
|
3409
3537
|
import React, { useState as useState8, useEffect as useEffect7 } from "react";
|
|
3410
|
-
import { Fragment as Fragment5, jsx as
|
|
3538
|
+
import { Fragment as Fragment5, jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
3411
3539
|
function Command({
|
|
3412
3540
|
agentId,
|
|
3413
3541
|
command: initialCommand,
|
|
@@ -3857,7 +3985,7 @@ ${planToExecute}`;
|
|
|
3857
3985
|
setUploadedFiles((prev) => prev.filter((_, i) => i !== index));
|
|
3858
3986
|
};
|
|
3859
3987
|
const isCompact = variant === "compact";
|
|
3860
|
-
return /* @__PURE__ */
|
|
3988
|
+
return /* @__PURE__ */ jsxs17(
|
|
3861
3989
|
"div",
|
|
3862
3990
|
{
|
|
3863
3991
|
className: cn(
|
|
@@ -3872,9 +4000,9 @@ ${planToExecute}`;
|
|
|
3872
4000
|
),
|
|
3873
4001
|
style: { minHeight: isCompact ? "auto" : "180px" },
|
|
3874
4002
|
children: [
|
|
3875
|
-
/* @__PURE__ */
|
|
3876
|
-
state === "idle" && allowInput && !isCompact && /* @__PURE__ */
|
|
3877
|
-
/* @__PURE__ */
|
|
4003
|
+
/* @__PURE__ */ jsxs17("div", { className: cn("flex-1 flex", isCompact ? "flex-row items-center p-3 gap-3" : "flex-col p-4"), children: [
|
|
4004
|
+
state === "idle" && allowInput && !isCompact && /* @__PURE__ */ jsxs17(Fragment5, { children: [
|
|
4005
|
+
/* @__PURE__ */ jsx21(
|
|
3878
4006
|
"textarea",
|
|
3879
4007
|
{
|
|
3880
4008
|
value: command,
|
|
@@ -3890,42 +4018,42 @@ ${planToExecute}`;
|
|
|
3890
4018
|
rows: 6
|
|
3891
4019
|
}
|
|
3892
4020
|
),
|
|
3893
|
-
uploadedFiles.length > 0 && /* @__PURE__ */
|
|
3894
|
-
file.type === "image" ? /* @__PURE__ */
|
|
4021
|
+
uploadedFiles.length > 0 && /* @__PURE__ */ jsx21("div", { className: "flex flex-wrap gap-2 mt-2", children: uploadedFiles.map((file, index) => /* @__PURE__ */ jsxs17("div", { className: "relative group", children: [
|
|
4022
|
+
file.type === "image" ? /* @__PURE__ */ jsx21(
|
|
3895
4023
|
"img",
|
|
3896
4024
|
{
|
|
3897
4025
|
src: file.preview,
|
|
3898
4026
|
alt: file.name,
|
|
3899
4027
|
className: "w-20 h-20 object-cover rounded-lg border-2 border-neutral-300 dark:border-neutral-600"
|
|
3900
4028
|
}
|
|
3901
|
-
) : /* @__PURE__ */
|
|
3902
|
-
/* @__PURE__ */
|
|
3903
|
-
/* @__PURE__ */
|
|
4029
|
+
) : /* @__PURE__ */ jsxs17("div", { className: "w-20 h-20 flex flex-col items-center justify-center rounded-lg border-2 border-neutral-300 dark:border-neutral-600 bg-neutral-50 dark:bg-neutral-800", children: [
|
|
4030
|
+
/* @__PURE__ */ jsx21("svg", { className: "w-8 h-8 text-neutral-500 dark:text-neutral-400", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx21("path", { fillRule: "evenodd", d: "M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z", clipRule: "evenodd" }) }),
|
|
4031
|
+
/* @__PURE__ */ jsx21("span", { className: "text-[8px] text-neutral-500 dark:text-neutral-400 mt-1 px-1 truncate max-w-full", children: file.name.length > 12 ? file.name.slice(0, 12) + "..." : file.name })
|
|
3904
4032
|
] }),
|
|
3905
|
-
/* @__PURE__ */
|
|
4033
|
+
/* @__PURE__ */ jsx21(
|
|
3906
4034
|
"button",
|
|
3907
4035
|
{
|
|
3908
4036
|
onClick: () => removeFile(index),
|
|
3909
4037
|
className: "absolute -top-2 -right-2 w-6 h-6 bg-red-500 hover:bg-red-600 text-white rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity",
|
|
3910
4038
|
title: `Remove ${file.type}`,
|
|
3911
|
-
children: /* @__PURE__ */
|
|
4039
|
+
children: /* @__PURE__ */ jsx21("svg", { className: "w-4 h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
3912
4040
|
}
|
|
3913
4041
|
)
|
|
3914
4042
|
] }, index)) })
|
|
3915
4043
|
] }),
|
|
3916
|
-
state === "idle" && allowInput && isCompact && /* @__PURE__ */
|
|
3917
|
-
/* @__PURE__ */
|
|
3918
|
-
enableFileUpload && /* @__PURE__ */
|
|
4044
|
+
state === "idle" && allowInput && isCompact && /* @__PURE__ */ jsxs17(Fragment5, { children: [
|
|
4045
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-0.5 flex-shrink-0", children: [
|
|
4046
|
+
enableFileUpload && /* @__PURE__ */ jsx21(
|
|
3919
4047
|
"button",
|
|
3920
4048
|
{
|
|
3921
4049
|
onClick: () => fileInputRef.current?.click(),
|
|
3922
4050
|
className: "w-8 h-8 rounded-lg flex items-center justify-center transition-all flex-shrink-0 !text-neutral-500 dark:!text-neutral-500 hover:bg-neutral-100 dark:hover:bg-neutral-800",
|
|
3923
4051
|
title: "Attach file",
|
|
3924
|
-
children: /* @__PURE__ */
|
|
4052
|
+
children: /* @__PURE__ */ jsx21("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx21("path", { d: "M8.4 2.8L4.4 6.8C3.736 7.464 3.736 8.536 4.4 9.2C5.064 9.864 6.136 9.864 6.8 9.2L11.6 4.4C12.704 3.296 12.704 1.504 11.6 0.4C10.496 -0.704 8.704 -0.704 7.6 0.4L2.8 5.2C1.256 6.744 1.256 9.256 2.8 10.8C4.344 12.344 6.856 12.344 8.4 10.8L12.4 6.8", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(1.6, 2.4)" }) })
|
|
3925
4053
|
}
|
|
3926
4054
|
),
|
|
3927
|
-
planMode && /* @__PURE__ */
|
|
3928
|
-
/* @__PURE__ */
|
|
4055
|
+
planMode && /* @__PURE__ */ jsxs17("div", { className: "relative settings-menu-container", children: [
|
|
4056
|
+
/* @__PURE__ */ jsx21(
|
|
3929
4057
|
"button",
|
|
3930
4058
|
{
|
|
3931
4059
|
onClick: () => setShowSettingsMenu(!showSettingsMenu),
|
|
@@ -3934,28 +4062,28 @@ ${planToExecute}`;
|
|
|
3934
4062
|
internalPlanMode ? "!text-blue-600 dark:!text-blue-400" : "!text-neutral-500 dark:!text-neutral-500"
|
|
3935
4063
|
),
|
|
3936
4064
|
title: "Settings",
|
|
3937
|
-
children: /* @__PURE__ */
|
|
3938
|
-
/* @__PURE__ */
|
|
3939
|
-
/* @__PURE__ */
|
|
3940
|
-
/* @__PURE__ */
|
|
3941
|
-
/* @__PURE__ */
|
|
3942
|
-
/* @__PURE__ */
|
|
3943
|
-
/* @__PURE__ */
|
|
3944
|
-
/* @__PURE__ */
|
|
3945
|
-
/* @__PURE__ */
|
|
3946
|
-
/* @__PURE__ */
|
|
4065
|
+
children: /* @__PURE__ */ jsxs17("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
4066
|
+
/* @__PURE__ */ jsx21("line", { x1: "4", y1: "21", x2: "4", y2: "14" }),
|
|
4067
|
+
/* @__PURE__ */ jsx21("line", { x1: "4", y1: "10", x2: "4", y2: "3" }),
|
|
4068
|
+
/* @__PURE__ */ jsx21("line", { x1: "12", y1: "21", x2: "12", y2: "12" }),
|
|
4069
|
+
/* @__PURE__ */ jsx21("line", { x1: "12", y1: "8", x2: "12", y2: "3" }),
|
|
4070
|
+
/* @__PURE__ */ jsx21("line", { x1: "20", y1: "21", x2: "20", y2: "16" }),
|
|
4071
|
+
/* @__PURE__ */ jsx21("line", { x1: "20", y1: "12", x2: "20", y2: "3" }),
|
|
4072
|
+
/* @__PURE__ */ jsx21("line", { x1: "1", y1: "14", x2: "7", y2: "14" }),
|
|
4073
|
+
/* @__PURE__ */ jsx21("line", { x1: "9", y1: "8", x2: "15", y2: "8" }),
|
|
4074
|
+
/* @__PURE__ */ jsx21("line", { x1: "17", y1: "16", x2: "23", y2: "16" })
|
|
3947
4075
|
] })
|
|
3948
4076
|
}
|
|
3949
4077
|
),
|
|
3950
|
-
showSettingsMenu && /* @__PURE__ */
|
|
3951
|
-
/* @__PURE__ */
|
|
3952
|
-
/* @__PURE__ */
|
|
3953
|
-
/* @__PURE__ */
|
|
3954
|
-
/* @__PURE__ */
|
|
3955
|
-
/* @__PURE__ */
|
|
4078
|
+
showSettingsMenu && /* @__PURE__ */ jsx21("div", { className: "absolute top-10 left-0 z-50 w-56 bg-white dark:bg-neutral-800 border border-neutral-200 dark:border-neutral-700 rounded-lg shadow-lg p-2.5 settings-menu-container", children: /* @__PURE__ */ jsxs17("label", { className: "flex items-center justify-between cursor-pointer group", children: [
|
|
4079
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
|
|
4080
|
+
/* @__PURE__ */ jsx21("svg", { className: "w-3.5 h-3.5 text-neutral-500 dark:text-neutral-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
4081
|
+
/* @__PURE__ */ jsxs17("div", { children: [
|
|
4082
|
+
/* @__PURE__ */ jsx21("div", { className: "text-xs font-medium text-neutral-700 dark:text-neutral-300", children: "Plan Mode" }),
|
|
4083
|
+
/* @__PURE__ */ jsx21("div", { className: "text-[10px] text-neutral-500 dark:text-neutral-400", children: "Review first" })
|
|
3956
4084
|
] })
|
|
3957
4085
|
] }),
|
|
3958
|
-
/* @__PURE__ */
|
|
4086
|
+
/* @__PURE__ */ jsx21(
|
|
3959
4087
|
"button",
|
|
3960
4088
|
{
|
|
3961
4089
|
onClick: (e) => {
|
|
@@ -3967,7 +4095,7 @@ ${planToExecute}`;
|
|
|
3967
4095
|
internalPlanMode ? "bg-blue-600" : "bg-neutral-300 dark:bg-neutral-600"
|
|
3968
4096
|
),
|
|
3969
4097
|
type: "button",
|
|
3970
|
-
children: /* @__PURE__ */
|
|
4098
|
+
children: /* @__PURE__ */ jsx21(
|
|
3971
4099
|
"span",
|
|
3972
4100
|
{
|
|
3973
4101
|
className: cn(
|
|
@@ -3981,26 +4109,26 @@ ${planToExecute}`;
|
|
|
3981
4109
|
] }) })
|
|
3982
4110
|
] })
|
|
3983
4111
|
] }),
|
|
3984
|
-
uploadedFiles.length > 0 && /* @__PURE__ */
|
|
3985
|
-
file.type === "image" ? /* @__PURE__ */
|
|
4112
|
+
uploadedFiles.length > 0 && /* @__PURE__ */ jsx21("div", { className: "flex gap-1 flex-shrink-0", children: uploadedFiles.map((file, index) => /* @__PURE__ */ jsxs17("div", { className: "relative group", children: [
|
|
4113
|
+
file.type === "image" ? /* @__PURE__ */ jsx21(
|
|
3986
4114
|
"img",
|
|
3987
4115
|
{
|
|
3988
4116
|
src: file.preview,
|
|
3989
4117
|
alt: file.name,
|
|
3990
4118
|
className: "w-8 h-8 object-cover rounded border border-neutral-300 dark:border-neutral-600"
|
|
3991
4119
|
}
|
|
3992
|
-
) : /* @__PURE__ */
|
|
3993
|
-
/* @__PURE__ */
|
|
4120
|
+
) : /* @__PURE__ */ jsx21("div", { className: "w-8 h-8 flex items-center justify-center rounded border border-neutral-300 dark:border-neutral-600 bg-neutral-50 dark:bg-neutral-800", title: file.name, children: /* @__PURE__ */ jsx21("svg", { className: "w-4 h-4 text-neutral-500 dark:text-neutral-400", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx21("path", { fillRule: "evenodd", d: "M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z", clipRule: "evenodd" }) }) }),
|
|
4121
|
+
/* @__PURE__ */ jsx21(
|
|
3994
4122
|
"button",
|
|
3995
4123
|
{
|
|
3996
4124
|
onClick: () => removeFile(index),
|
|
3997
4125
|
className: "absolute -top-1 -right-1 w-4 h-4 bg-red-500 hover:bg-red-600 text-white rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity",
|
|
3998
4126
|
title: "Remove",
|
|
3999
|
-
children: /* @__PURE__ */
|
|
4127
|
+
children: /* @__PURE__ */ jsx21("svg", { className: "w-2.5 h-2.5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 3, children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) })
|
|
4000
4128
|
}
|
|
4001
4129
|
)
|
|
4002
4130
|
] }, index)) }),
|
|
4003
|
-
/* @__PURE__ */
|
|
4131
|
+
/* @__PURE__ */ jsx21(
|
|
4004
4132
|
"input",
|
|
4005
4133
|
{
|
|
4006
4134
|
type: "text",
|
|
@@ -4016,7 +4144,7 @@ ${planToExecute}`;
|
|
|
4016
4144
|
className: "flex-1 bg-transparent border-none focus:outline-none !text-neutral-900 dark:!text-neutral-100 placeholder-neutral-400 dark:placeholder-neutral-500 py-1"
|
|
4017
4145
|
}
|
|
4018
4146
|
),
|
|
4019
|
-
/* @__PURE__ */
|
|
4147
|
+
/* @__PURE__ */ jsx21(
|
|
4020
4148
|
"button",
|
|
4021
4149
|
{
|
|
4022
4150
|
onClick: () => executeCommand(),
|
|
@@ -4032,33 +4160,33 @@ ${planToExecute}`;
|
|
|
4032
4160
|
!command.trim() && "border-neutral-200 dark:border-neutral-700 !text-neutral-400 dark:!text-neutral-600"
|
|
4033
4161
|
),
|
|
4034
4162
|
title: "Execute",
|
|
4035
|
-
children: /* @__PURE__ */
|
|
4163
|
+
children: /* @__PURE__ */ jsx21("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx21("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
4036
4164
|
}
|
|
4037
4165
|
)
|
|
4038
4166
|
] }),
|
|
4039
|
-
state === "loading" && !isCompact && /* @__PURE__ */
|
|
4040
|
-
/* @__PURE__ */
|
|
4041
|
-
/* @__PURE__ */
|
|
4042
|
-
showProgress && /* @__PURE__ */
|
|
4043
|
-
/* @__PURE__ */
|
|
4167
|
+
state === "loading" && !isCompact && /* @__PURE__ */ jsxs17("div", { className: "flex-1 flex flex-col items-center justify-center space-y-4 py-8", children: [
|
|
4168
|
+
/* @__PURE__ */ jsx21("div", { className: "w-6 h-6 border-2 border-neutral-300 border-t-blue-500 rounded-full animate-spin" }),
|
|
4169
|
+
/* @__PURE__ */ jsx21("div", { className: "text-neutral-600 dark:text-neutral-400 text-sm text-center max-w-md", children: enableStreaming && streamedContent ? streamedContent : loadingText }),
|
|
4170
|
+
showProgress && /* @__PURE__ */ jsxs17("div", { className: "w-full max-w-sm", children: [
|
|
4171
|
+
/* @__PURE__ */ jsx21("div", { className: "w-full bg-neutral-200 dark:bg-neutral-700 rounded-full h-1.5", children: /* @__PURE__ */ jsx21(
|
|
4044
4172
|
"div",
|
|
4045
4173
|
{
|
|
4046
4174
|
className: "bg-blue-500 h-1.5 rounded-full transition-all duration-300",
|
|
4047
4175
|
style: { width: `${progress}%` }
|
|
4048
4176
|
}
|
|
4049
4177
|
) }),
|
|
4050
|
-
/* @__PURE__ */
|
|
4178
|
+
/* @__PURE__ */ jsxs17("p", { className: "text-xs text-neutral-500 mt-2 text-center", children: [
|
|
4051
4179
|
progress,
|
|
4052
4180
|
"%"
|
|
4053
4181
|
] })
|
|
4054
4182
|
] })
|
|
4055
4183
|
] }),
|
|
4056
|
-
state === "loading" && isCompact && /* @__PURE__ */
|
|
4057
|
-
/* @__PURE__ */
|
|
4058
|
-
/* @__PURE__ */
|
|
4059
|
-
/* @__PURE__ */
|
|
4184
|
+
state === "loading" && isCompact && /* @__PURE__ */ jsxs17(Fragment5, { children: [
|
|
4185
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex-1 flex items-center gap-3 py-1", children: [
|
|
4186
|
+
/* @__PURE__ */ jsx21("div", { className: "w-4 h-4 border-2 border-neutral-300 border-t-blue-500 rounded-full animate-spin" }),
|
|
4187
|
+
/* @__PURE__ */ jsx21("div", { className: "text-neutral-600 dark:text-neutral-400 text-sm truncate", children: enableStreaming && streamedContent ? streamedContent : loadingText })
|
|
4060
4188
|
] }),
|
|
4061
|
-
/* @__PURE__ */
|
|
4189
|
+
/* @__PURE__ */ jsx21(
|
|
4062
4190
|
"button",
|
|
4063
4191
|
{
|
|
4064
4192
|
disabled: true,
|
|
@@ -4070,20 +4198,20 @@ ${planToExecute}`;
|
|
|
4070
4198
|
"!text-lg",
|
|
4071
4199
|
"opacity-30 cursor-not-allowed"
|
|
4072
4200
|
),
|
|
4073
|
-
children: /* @__PURE__ */
|
|
4201
|
+
children: /* @__PURE__ */ jsx21("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx21("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
4074
4202
|
}
|
|
4075
4203
|
)
|
|
4076
4204
|
] }),
|
|
4077
|
-
state === "plan-pending" && !isCompact && /* @__PURE__ */
|
|
4078
|
-
/* @__PURE__ */
|
|
4079
|
-
/* @__PURE__ */
|
|
4080
|
-
/* @__PURE__ */
|
|
4081
|
-
/* @__PURE__ */
|
|
4082
|
-
/* @__PURE__ */
|
|
4205
|
+
state === "plan-pending" && !isCompact && /* @__PURE__ */ jsx21("div", { className: "flex-1 flex flex-col", children: /* @__PURE__ */ jsxs17("div", { className: "mb-4 p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg", children: [
|
|
4206
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex items-start gap-2 mb-3", children: [
|
|
4207
|
+
/* @__PURE__ */ jsx21("svg", { className: "w-5 h-5 text-blue-600 dark:text-blue-400 mt-0.5 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
4208
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex-1", children: [
|
|
4209
|
+
/* @__PURE__ */ jsx21("h3", { className: "text-sm font-semibold text-blue-800 dark:text-blue-300 mb-1", children: "Proposed Plan" }),
|
|
4210
|
+
/* @__PURE__ */ jsx21("div", { className: "text-blue-700 dark:text-blue-300 text-sm whitespace-pre-line leading-relaxed", children: plan })
|
|
4083
4211
|
] })
|
|
4084
4212
|
] }),
|
|
4085
|
-
/* @__PURE__ */
|
|
4086
|
-
/* @__PURE__ */
|
|
4213
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex gap-2 mt-4", children: [
|
|
4214
|
+
/* @__PURE__ */ jsx21(
|
|
4087
4215
|
"button",
|
|
4088
4216
|
{
|
|
4089
4217
|
onClick: approvePlan,
|
|
@@ -4091,7 +4219,7 @@ ${planToExecute}`;
|
|
|
4091
4219
|
children: "Approve & Execute"
|
|
4092
4220
|
}
|
|
4093
4221
|
),
|
|
4094
|
-
/* @__PURE__ */
|
|
4222
|
+
/* @__PURE__ */ jsx21(
|
|
4095
4223
|
"button",
|
|
4096
4224
|
{
|
|
4097
4225
|
onClick: rejectPlan,
|
|
@@ -4101,20 +4229,20 @@ ${planToExecute}`;
|
|
|
4101
4229
|
)
|
|
4102
4230
|
] })
|
|
4103
4231
|
] }) }),
|
|
4104
|
-
state === "plan-pending" && isCompact && /* @__PURE__ */
|
|
4105
|
-
/* @__PURE__ */
|
|
4232
|
+
state === "plan-pending" && isCompact && /* @__PURE__ */ jsxs17(Fragment5, { children: [
|
|
4233
|
+
/* @__PURE__ */ jsxs17(
|
|
4106
4234
|
"button",
|
|
4107
4235
|
{
|
|
4108
4236
|
onClick: () => setShowPlanDetails(true),
|
|
4109
4237
|
className: "flex-1 flex items-center gap-2 px-3 py-2 bg-blue-50 dark:bg-blue-900/30 hover:bg-blue-100 dark:hover:bg-blue-900/40 border border-blue-200 dark:border-blue-800 rounded-lg transition-colors",
|
|
4110
4238
|
children: [
|
|
4111
|
-
/* @__PURE__ */
|
|
4112
|
-
/* @__PURE__ */
|
|
4239
|
+
/* @__PURE__ */ jsx21("svg", { className: "w-4 h-4 text-blue-600 dark:text-blue-400 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
4240
|
+
/* @__PURE__ */ jsx21("span", { className: "text-sm font-medium text-blue-700 dark:text-blue-300 truncate flex-1", children: "View Execution Plan" })
|
|
4113
4241
|
]
|
|
4114
4242
|
}
|
|
4115
4243
|
),
|
|
4116
|
-
/* @__PURE__ */
|
|
4117
|
-
/* @__PURE__ */
|
|
4244
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex gap-2 flex-shrink-0", children: [
|
|
4245
|
+
/* @__PURE__ */ jsx21(
|
|
4118
4246
|
"button",
|
|
4119
4247
|
{
|
|
4120
4248
|
onClick: approvePlan,
|
|
@@ -4122,7 +4250,7 @@ ${planToExecute}`;
|
|
|
4122
4250
|
children: "Approve"
|
|
4123
4251
|
}
|
|
4124
4252
|
),
|
|
4125
|
-
/* @__PURE__ */
|
|
4253
|
+
/* @__PURE__ */ jsx21(
|
|
4126
4254
|
"button",
|
|
4127
4255
|
{
|
|
4128
4256
|
onClick: rejectPlan,
|
|
@@ -4132,15 +4260,15 @@ ${planToExecute}`;
|
|
|
4132
4260
|
)
|
|
4133
4261
|
] })
|
|
4134
4262
|
] }),
|
|
4135
|
-
state === "error" && /* @__PURE__ */
|
|
4136
|
-
/* @__PURE__ */
|
|
4137
|
-
/* @__PURE__ */
|
|
4138
|
-
/* @__PURE__ */
|
|
4139
|
-
/* @__PURE__ */
|
|
4140
|
-
/* @__PURE__ */
|
|
4263
|
+
state === "error" && /* @__PURE__ */ jsxs17("div", { className: "flex-1 flex flex-col", children: [
|
|
4264
|
+
/* @__PURE__ */ jsx21("div", { className: "mb-4 p-3 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg", children: /* @__PURE__ */ jsxs17("div", { className: "flex items-start gap-2", children: [
|
|
4265
|
+
/* @__PURE__ */ jsx21("svg", { className: "w-5 h-5 text-red-600 mt-0.5 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
4266
|
+
/* @__PURE__ */ jsxs17("div", { children: [
|
|
4267
|
+
/* @__PURE__ */ jsx21("h3", { className: "text-sm font-semibold text-red-800 dark:text-red-400", children: "Error" }),
|
|
4268
|
+
/* @__PURE__ */ jsx21("p", { className: "text-red-700 dark:text-red-300 text-sm mt-1", children: error?.message })
|
|
4141
4269
|
] })
|
|
4142
4270
|
] }) }),
|
|
4143
|
-
allowInput && /* @__PURE__ */
|
|
4271
|
+
allowInput && /* @__PURE__ */ jsx21(
|
|
4144
4272
|
"textarea",
|
|
4145
4273
|
{
|
|
4146
4274
|
value: command,
|
|
@@ -4157,16 +4285,16 @@ ${planToExecute}`;
|
|
|
4157
4285
|
}
|
|
4158
4286
|
)
|
|
4159
4287
|
] }),
|
|
4160
|
-
state === "success" && result && !isCompact && /* @__PURE__ */
|
|
4161
|
-
/* @__PURE__ */
|
|
4162
|
-
/* @__PURE__ */
|
|
4163
|
-
/* @__PURE__ */
|
|
4164
|
-
/* @__PURE__ */
|
|
4165
|
-
/* @__PURE__ */
|
|
4288
|
+
state === "success" && result && !isCompact && /* @__PURE__ */ jsx21("div", { className: "flex-1 overflow-auto", children: resultRenderer ? resultRenderer(result.data) : /* @__PURE__ */ jsxs17("div", { className: "space-y-4", children: [
|
|
4289
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex items-start gap-3 p-3 bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 rounded-lg", children: [
|
|
4290
|
+
/* @__PURE__ */ jsx21("svg", { className: "w-5 h-5 text-green-600 mt-0.5 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
4291
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex-1", children: [
|
|
4292
|
+
/* @__PURE__ */ jsx21("h3", { className: "text-sm font-semibold text-green-800 dark:text-green-400 mb-1", children: "Success" }),
|
|
4293
|
+
/* @__PURE__ */ jsx21("p", { className: "text-green-700 dark:text-green-300 text-sm", children: "Command executed successfully" })
|
|
4166
4294
|
] })
|
|
4167
4295
|
] }),
|
|
4168
|
-
result.data?.summary && /* @__PURE__ */
|
|
4169
|
-
result.widgets && result.widgets.length > 0 && /* @__PURE__ */
|
|
4296
|
+
result.data?.summary && /* @__PURE__ */ jsx21("div", { className: "text-neutral-700 dark:text-neutral-300 text-sm leading-relaxed whitespace-pre-line", children: result.data.summary }),
|
|
4297
|
+
result.widgets && result.widgets.length > 0 && /* @__PURE__ */ jsx21("div", { className: "space-y-3", children: result.widgets.map((widget) => /* @__PURE__ */ jsx21(
|
|
4170
4298
|
WidgetRenderer,
|
|
4171
4299
|
{
|
|
4172
4300
|
widget,
|
|
@@ -4175,8 +4303,8 @@ ${planToExecute}`;
|
|
|
4175
4303
|
widget.id
|
|
4176
4304
|
)) })
|
|
4177
4305
|
] }) }),
|
|
4178
|
-
state === "success" && result && isCompact && /* @__PURE__ */
|
|
4179
|
-
/* @__PURE__ */
|
|
4306
|
+
state === "success" && result && isCompact && /* @__PURE__ */ jsxs17(Fragment5, { children: [
|
|
4307
|
+
/* @__PURE__ */ jsxs17(
|
|
4180
4308
|
"div",
|
|
4181
4309
|
{
|
|
4182
4310
|
className: "flex-1 flex items-center gap-2 py-1 cursor-text min-w-0",
|
|
@@ -4185,12 +4313,12 @@ ${planToExecute}`;
|
|
|
4185
4313
|
setResult(null);
|
|
4186
4314
|
},
|
|
4187
4315
|
children: [
|
|
4188
|
-
/* @__PURE__ */
|
|
4189
|
-
/* @__PURE__ */
|
|
4316
|
+
/* @__PURE__ */ jsx21("svg", { className: "w-4 h-4 text-green-600 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
4317
|
+
/* @__PURE__ */ jsx21("div", { className: "text-green-700 dark:text-green-300 text-sm truncate flex-1 min-w-0", children: resultRenderer ? resultRenderer(result.data) : result.message || "Command executed successfully" })
|
|
4190
4318
|
]
|
|
4191
4319
|
}
|
|
4192
4320
|
),
|
|
4193
|
-
/* @__PURE__ */
|
|
4321
|
+
/* @__PURE__ */ jsx21(
|
|
4194
4322
|
"button",
|
|
4195
4323
|
{
|
|
4196
4324
|
onClick: () => {
|
|
@@ -4206,24 +4334,24 @@ ${planToExecute}`;
|
|
|
4206
4334
|
"!text-lg"
|
|
4207
4335
|
),
|
|
4208
4336
|
title: "New command",
|
|
4209
|
-
children: /* @__PURE__ */
|
|
4337
|
+
children: /* @__PURE__ */ jsx21("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx21("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
4210
4338
|
}
|
|
4211
4339
|
)
|
|
4212
4340
|
] })
|
|
4213
4341
|
] }),
|
|
4214
|
-
!isCompact && /* @__PURE__ */
|
|
4215
|
-
/* @__PURE__ */
|
|
4216
|
-
enableFileUpload && /* @__PURE__ */
|
|
4342
|
+
!isCompact && /* @__PURE__ */ jsxs17("div", { className: "p-3 flex items-center justify-between gap-2", children: [
|
|
4343
|
+
/* @__PURE__ */ jsx21("div", { className: "flex items-center gap-1", children: state === "idle" && allowInput && /* @__PURE__ */ jsxs17(Fragment5, { children: [
|
|
4344
|
+
enableFileUpload && /* @__PURE__ */ jsx21(
|
|
4217
4345
|
"button",
|
|
4218
4346
|
{
|
|
4219
4347
|
onClick: () => fileInputRef.current?.click(),
|
|
4220
4348
|
className: "w-8 h-8 rounded-lg flex items-center justify-center transition-all flex-shrink-0 !text-neutral-500 dark:!text-neutral-500 hover:bg-neutral-100 dark:hover:bg-neutral-800",
|
|
4221
4349
|
title: "Attach file",
|
|
4222
|
-
children: /* @__PURE__ */
|
|
4350
|
+
children: /* @__PURE__ */ jsx21("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx21("path", { d: "M8.4 2.8L4.4 6.8C3.736 7.464 3.736 8.536 4.4 9.2C5.064 9.864 6.136 9.864 6.8 9.2L11.6 4.4C12.704 3.296 12.704 1.504 11.6 0.4C10.496 -0.704 8.704 -0.704 7.6 0.4L2.8 5.2C1.256 6.744 1.256 9.256 2.8 10.8C4.344 12.344 6.856 12.344 8.4 10.8L12.4 6.8", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(1.6, 2.4)" }) })
|
|
4223
4351
|
}
|
|
4224
4352
|
),
|
|
4225
|
-
planMode && /* @__PURE__ */
|
|
4226
|
-
/* @__PURE__ */
|
|
4353
|
+
planMode && /* @__PURE__ */ jsxs17("div", { className: "relative settings-menu-container", children: [
|
|
4354
|
+
/* @__PURE__ */ jsx21(
|
|
4227
4355
|
"button",
|
|
4228
4356
|
{
|
|
4229
4357
|
onClick: () => setShowSettingsMenu(!showSettingsMenu),
|
|
@@ -4232,28 +4360,28 @@ ${planToExecute}`;
|
|
|
4232
4360
|
internalPlanMode ? "!text-blue-600 dark:!text-blue-400" : "!text-neutral-500 dark:!text-neutral-500"
|
|
4233
4361
|
),
|
|
4234
4362
|
title: "Settings",
|
|
4235
|
-
children: /* @__PURE__ */
|
|
4236
|
-
/* @__PURE__ */
|
|
4237
|
-
/* @__PURE__ */
|
|
4238
|
-
/* @__PURE__ */
|
|
4239
|
-
/* @__PURE__ */
|
|
4240
|
-
/* @__PURE__ */
|
|
4241
|
-
/* @__PURE__ */
|
|
4242
|
-
/* @__PURE__ */
|
|
4243
|
-
/* @__PURE__ */
|
|
4244
|
-
/* @__PURE__ */
|
|
4363
|
+
children: /* @__PURE__ */ jsxs17("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
4364
|
+
/* @__PURE__ */ jsx21("line", { x1: "4", y1: "21", x2: "4", y2: "14" }),
|
|
4365
|
+
/* @__PURE__ */ jsx21("line", { x1: "4", y1: "10", x2: "4", y2: "3" }),
|
|
4366
|
+
/* @__PURE__ */ jsx21("line", { x1: "12", y1: "21", x2: "12", y2: "12" }),
|
|
4367
|
+
/* @__PURE__ */ jsx21("line", { x1: "12", y1: "8", x2: "12", y2: "3" }),
|
|
4368
|
+
/* @__PURE__ */ jsx21("line", { x1: "20", y1: "21", x2: "20", y2: "16" }),
|
|
4369
|
+
/* @__PURE__ */ jsx21("line", { x1: "20", y1: "12", x2: "20", y2: "3" }),
|
|
4370
|
+
/* @__PURE__ */ jsx21("line", { x1: "1", y1: "14", x2: "7", y2: "14" }),
|
|
4371
|
+
/* @__PURE__ */ jsx21("line", { x1: "9", y1: "8", x2: "15", y2: "8" }),
|
|
4372
|
+
/* @__PURE__ */ jsx21("line", { x1: "17", y1: "16", x2: "23", y2: "16" })
|
|
4245
4373
|
] })
|
|
4246
4374
|
}
|
|
4247
4375
|
),
|
|
4248
|
-
showSettingsMenu && /* @__PURE__ */
|
|
4249
|
-
/* @__PURE__ */
|
|
4250
|
-
/* @__PURE__ */
|
|
4251
|
-
/* @__PURE__ */
|
|
4252
|
-
/* @__PURE__ */
|
|
4253
|
-
/* @__PURE__ */
|
|
4376
|
+
showSettingsMenu && /* @__PURE__ */ jsx21("div", { className: "absolute top-10 left-0 z-50 w-64 bg-white dark:bg-neutral-800 border border-neutral-200 dark:border-neutral-700 rounded-lg shadow-lg p-3 settings-menu-container", children: /* @__PURE__ */ jsxs17("label", { className: "flex items-center justify-between cursor-pointer group", children: [
|
|
4377
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
|
|
4378
|
+
/* @__PURE__ */ jsx21("svg", { className: "w-4 h-4 text-neutral-500 dark:text-neutral-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
4379
|
+
/* @__PURE__ */ jsxs17("div", { children: [
|
|
4380
|
+
/* @__PURE__ */ jsx21("div", { className: "text-sm font-medium text-neutral-700 dark:text-neutral-300", children: "Plan Mode" }),
|
|
4381
|
+
/* @__PURE__ */ jsx21("div", { className: "text-xs text-neutral-500 dark:text-neutral-400", children: "Review before executing" })
|
|
4254
4382
|
] })
|
|
4255
4383
|
] }),
|
|
4256
|
-
/* @__PURE__ */
|
|
4384
|
+
/* @__PURE__ */ jsx21(
|
|
4257
4385
|
"button",
|
|
4258
4386
|
{
|
|
4259
4387
|
onClick: (e) => {
|
|
@@ -4265,7 +4393,7 @@ ${planToExecute}`;
|
|
|
4265
4393
|
internalPlanMode ? "bg-blue-600" : "bg-neutral-300 dark:bg-neutral-600"
|
|
4266
4394
|
),
|
|
4267
4395
|
type: "button",
|
|
4268
|
-
children: /* @__PURE__ */
|
|
4396
|
+
children: /* @__PURE__ */ jsx21(
|
|
4269
4397
|
"span",
|
|
4270
4398
|
{
|
|
4271
4399
|
className: cn(
|
|
@@ -4279,9 +4407,9 @@ ${planToExecute}`;
|
|
|
4279
4407
|
] }) })
|
|
4280
4408
|
] })
|
|
4281
4409
|
] }) }),
|
|
4282
|
-
!(state === "idle" && allowInput) && /* @__PURE__ */
|
|
4283
|
-
/* @__PURE__ */
|
|
4284
|
-
(state === "success" || state === "error") && allowInput && /* @__PURE__ */
|
|
4410
|
+
!(state === "idle" && allowInput) && /* @__PURE__ */ jsx21("div", {}),
|
|
4411
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
|
|
4412
|
+
(state === "success" || state === "error") && allowInput && /* @__PURE__ */ jsx21(
|
|
4285
4413
|
"button",
|
|
4286
4414
|
{
|
|
4287
4415
|
onClick: resetCommand,
|
|
@@ -4289,7 +4417,7 @@ ${planToExecute}`;
|
|
|
4289
4417
|
children: "Reset"
|
|
4290
4418
|
}
|
|
4291
4419
|
),
|
|
4292
|
-
(state === "idle" || state === "error") && /* @__PURE__ */
|
|
4420
|
+
(state === "idle" || state === "error") && /* @__PURE__ */ jsx21(
|
|
4293
4421
|
"button",
|
|
4294
4422
|
{
|
|
4295
4423
|
onClick: () => executeCommand(),
|
|
@@ -4305,29 +4433,29 @@ ${planToExecute}`;
|
|
|
4305
4433
|
!command.trim() && "border-neutral-200 dark:border-neutral-700 !text-neutral-400 dark:!text-neutral-600"
|
|
4306
4434
|
),
|
|
4307
4435
|
title: state === "error" ? "Retry" : "Execute",
|
|
4308
|
-
children: state === "error" ? /* @__PURE__ */
|
|
4436
|
+
children: state === "error" ? /* @__PURE__ */ jsx21("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx21("path", { d: "M13 8C13 10.7614 10.7614 13 8 13C5.23858 13 3 10.7614 3 8C3 5.23858 5.23858 3 8 3C9.65685 3 11.1257 3.82818 12 5.09091M12 3V5.09091M12 5.09091H9.81818", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) : /* @__PURE__ */ jsx21("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx21("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
4309
4437
|
}
|
|
4310
4438
|
)
|
|
4311
4439
|
] })
|
|
4312
4440
|
] }),
|
|
4313
|
-
showPlanDetails && isCompact && state === "plan-pending" && /* @__PURE__ */
|
|
4314
|
-
/* @__PURE__ */
|
|
4315
|
-
/* @__PURE__ */
|
|
4316
|
-
/* @__PURE__ */
|
|
4317
|
-
/* @__PURE__ */
|
|
4441
|
+
showPlanDetails && isCompact && state === "plan-pending" && /* @__PURE__ */ jsx21("div", { className: "fixed inset-0 bg-black/50 flex items-center justify-center z-50 p-4", onClick: () => setShowPlanDetails(false), children: /* @__PURE__ */ jsxs17("div", { className: "bg-white dark:bg-neutral-900 rounded-2xl shadow-2xl max-w-2xl w-full max-h-[80vh] overflow-hidden", onClick: (e) => e.stopPropagation(), children: [
|
|
4442
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex items-center justify-between p-6 border-b border-neutral-200 dark:border-neutral-700", children: [
|
|
4443
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-3", children: [
|
|
4444
|
+
/* @__PURE__ */ jsx21("svg", { className: "w-6 h-6 text-blue-600 dark:text-blue-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
4445
|
+
/* @__PURE__ */ jsx21("h2", { className: "text-xl font-semibold text-neutral-900 dark:text-white", children: "Proposed Execution Plan" })
|
|
4318
4446
|
] }),
|
|
4319
|
-
/* @__PURE__ */
|
|
4447
|
+
/* @__PURE__ */ jsx21(
|
|
4320
4448
|
"button",
|
|
4321
4449
|
{
|
|
4322
4450
|
onClick: () => setShowPlanDetails(false),
|
|
4323
4451
|
className: "text-neutral-400 hover:text-neutral-600 dark:hover:text-neutral-300 transition-colors",
|
|
4324
|
-
children: /* @__PURE__ */
|
|
4452
|
+
children: /* @__PURE__ */ jsx21("svg", { className: "w-6 h-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx21("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
4325
4453
|
}
|
|
4326
4454
|
)
|
|
4327
4455
|
] }),
|
|
4328
|
-
/* @__PURE__ */
|
|
4329
|
-
/* @__PURE__ */
|
|
4330
|
-
/* @__PURE__ */
|
|
4456
|
+
/* @__PURE__ */ jsx21("div", { className: "p-6 overflow-y-auto max-h-[calc(80vh-180px)]", children: /* @__PURE__ */ jsx21("div", { className: "prose prose-sm dark:prose-invert max-w-none", children: /* @__PURE__ */ jsx21("div", { className: "text-neutral-700 dark:text-neutral-300 whitespace-pre-line leading-relaxed", children: plan }) }) }),
|
|
4457
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex items-center justify-end gap-3 p-6 border-t border-neutral-200 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-800/50", children: [
|
|
4458
|
+
/* @__PURE__ */ jsx21(
|
|
4331
4459
|
"button",
|
|
4332
4460
|
{
|
|
4333
4461
|
onClick: rejectPlan,
|
|
@@ -4335,7 +4463,7 @@ ${planToExecute}`;
|
|
|
4335
4463
|
children: "Modify Command"
|
|
4336
4464
|
}
|
|
4337
4465
|
),
|
|
4338
|
-
/* @__PURE__ */
|
|
4466
|
+
/* @__PURE__ */ jsx21(
|
|
4339
4467
|
"button",
|
|
4340
4468
|
{
|
|
4341
4469
|
onClick: approvePlan,
|
|
@@ -4345,7 +4473,7 @@ ${planToExecute}`;
|
|
|
4345
4473
|
)
|
|
4346
4474
|
] })
|
|
4347
4475
|
] }) }),
|
|
4348
|
-
/* @__PURE__ */
|
|
4476
|
+
/* @__PURE__ */ jsx21(
|
|
4349
4477
|
"input",
|
|
4350
4478
|
{
|
|
4351
4479
|
ref: fileInputRef,
|
|
@@ -4356,7 +4484,7 @@ ${planToExecute}`;
|
|
|
4356
4484
|
accept: "image/*,application/pdf,.doc,.docx,.txt"
|
|
4357
4485
|
}
|
|
4358
4486
|
),
|
|
4359
|
-
/* @__PURE__ */
|
|
4487
|
+
/* @__PURE__ */ jsx21("style", { dangerouslySetInnerHTML: {
|
|
4360
4488
|
__html: `
|
|
4361
4489
|
@keyframes pulse-border {
|
|
4362
4490
|
0%, 100% {
|
|
@@ -4378,7 +4506,7 @@ ${planToExecute}`;
|
|
|
4378
4506
|
|
|
4379
4507
|
// src/components/Prompt/Prompt.tsx
|
|
4380
4508
|
import { useState as useState9 } from "react";
|
|
4381
|
-
import { jsx as
|
|
4509
|
+
import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
4382
4510
|
function Prompt({
|
|
4383
4511
|
agentId,
|
|
4384
4512
|
placeholder = "Enter your prompt...",
|
|
@@ -4440,9 +4568,9 @@ function Prompt({
|
|
|
4440
4568
|
handleSubmit();
|
|
4441
4569
|
}
|
|
4442
4570
|
};
|
|
4443
|
-
return /* @__PURE__ */
|
|
4444
|
-
/* @__PURE__ */
|
|
4445
|
-
/* @__PURE__ */
|
|
4571
|
+
return /* @__PURE__ */ jsxs18("div", { className: cn("space-y-2", className), children: [
|
|
4572
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex gap-2", children: [
|
|
4573
|
+
/* @__PURE__ */ jsx22(
|
|
4446
4574
|
"input",
|
|
4447
4575
|
{
|
|
4448
4576
|
type: "text",
|
|
@@ -4455,7 +4583,7 @@ function Prompt({
|
|
|
4455
4583
|
className: "flex-1 px-4 py-2 border border-neutral-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-apteva-500 dark:bg-neutral-800 dark:border-neutral-600 dark:text-white"
|
|
4456
4584
|
}
|
|
4457
4585
|
),
|
|
4458
|
-
submitOn === "button" && /* @__PURE__ */
|
|
4586
|
+
submitOn === "button" && /* @__PURE__ */ jsx22(
|
|
4459
4587
|
"button",
|
|
4460
4588
|
{
|
|
4461
4589
|
onClick: handleSubmit,
|
|
@@ -4465,13 +4593,13 @@ function Prompt({
|
|
|
4465
4593
|
}
|
|
4466
4594
|
)
|
|
4467
4595
|
] }),
|
|
4468
|
-
maxLength && /* @__PURE__ */
|
|
4596
|
+
maxLength && /* @__PURE__ */ jsxs18("p", { className: "text-xs text-neutral-500", children: [
|
|
4469
4597
|
value.length,
|
|
4470
4598
|
" / ",
|
|
4471
4599
|
maxLength,
|
|
4472
4600
|
" characters"
|
|
4473
4601
|
] }),
|
|
4474
|
-
showSuggestions && !value && /* @__PURE__ */
|
|
4602
|
+
showSuggestions && !value && /* @__PURE__ */ jsx22("div", { className: "flex flex-wrap gap-2", children: suggestions.map((suggestion, idx) => /* @__PURE__ */ jsx22(
|
|
4475
4603
|
"button",
|
|
4476
4604
|
{
|
|
4477
4605
|
onClick: () => setValue(suggestion),
|
|
@@ -4480,16 +4608,16 @@ function Prompt({
|
|
|
4480
4608
|
},
|
|
4481
4609
|
idx
|
|
4482
4610
|
)) }),
|
|
4483
|
-
isLoading && /* @__PURE__ */
|
|
4484
|
-
/* @__PURE__ */
|
|
4485
|
-
/* @__PURE__ */
|
|
4611
|
+
isLoading && /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2 text-sm text-neutral-500", children: [
|
|
4612
|
+
/* @__PURE__ */ jsx22("div", { className: "w-4 h-4 border-2 border-apteva-500 border-t-transparent rounded-full animate-spin" }),
|
|
4613
|
+
/* @__PURE__ */ jsx22("span", { children: "AI is processing your request..." })
|
|
4486
4614
|
] })
|
|
4487
4615
|
] });
|
|
4488
4616
|
}
|
|
4489
4617
|
|
|
4490
4618
|
// src/components/Stream/Stream.tsx
|
|
4491
4619
|
import { useState as useState10, useEffect as useEffect8 } from "react";
|
|
4492
|
-
import { jsx as
|
|
4620
|
+
import { jsx as jsx23, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
4493
4621
|
function Stream({
|
|
4494
4622
|
agentId,
|
|
4495
4623
|
prompt,
|
|
@@ -4569,7 +4697,7 @@ function Stream({
|
|
|
4569
4697
|
plain: "text-neutral-900 dark:text-neutral-100"
|
|
4570
4698
|
};
|
|
4571
4699
|
if (!isStreaming && !isComplete) {
|
|
4572
|
-
return /* @__PURE__ */
|
|
4700
|
+
return /* @__PURE__ */ jsx23("div", { className: cn("p-4", className), children: /* @__PURE__ */ jsx23(
|
|
4573
4701
|
"button",
|
|
4574
4702
|
{
|
|
4575
4703
|
onClick: startStreaming,
|
|
@@ -4578,9 +4706,9 @@ function Stream({
|
|
|
4578
4706
|
}
|
|
4579
4707
|
) });
|
|
4580
4708
|
}
|
|
4581
|
-
return /* @__PURE__ */
|
|
4709
|
+
return /* @__PURE__ */ jsxs19("div", { className: cn(variantClasses[variant], className), children: [
|
|
4582
4710
|
text,
|
|
4583
|
-
isStreaming && showCursor && /* @__PURE__ */
|
|
4711
|
+
isStreaming && showCursor && /* @__PURE__ */ jsx23("span", { className: "apteva-stream-cursor" })
|
|
4584
4712
|
] });
|
|
4585
4713
|
}
|
|
4586
4714
|
|
|
@@ -4588,9 +4716,9 @@ function Stream({
|
|
|
4588
4716
|
import { useState as useState11 } from "react";
|
|
4589
4717
|
|
|
4590
4718
|
// src/components/Threads/ThreadItem.tsx
|
|
4591
|
-
import { jsx as
|
|
4719
|
+
import { jsx as jsx24, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
4592
4720
|
function ThreadItem({ thread, isActive = false, onSelect, onDelete }) {
|
|
4593
|
-
return /* @__PURE__ */
|
|
4721
|
+
return /* @__PURE__ */ jsxs20(
|
|
4594
4722
|
"div",
|
|
4595
4723
|
{
|
|
4596
4724
|
className: cn("apteva-thread-item", {
|
|
@@ -4598,19 +4726,19 @@ function ThreadItem({ thread, isActive = false, onSelect, onDelete }) {
|
|
|
4598
4726
|
}),
|
|
4599
4727
|
onClick: onSelect,
|
|
4600
4728
|
children: [
|
|
4601
|
-
/* @__PURE__ */
|
|
4602
|
-
/* @__PURE__ */
|
|
4603
|
-
thread.preview && /* @__PURE__ */
|
|
4604
|
-
/* @__PURE__ */
|
|
4605
|
-
/* @__PURE__ */
|
|
4729
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex-1 min-w-0", children: [
|
|
4730
|
+
/* @__PURE__ */ jsx24("h4", { className: "font-semibold text-neutral-900 dark:text-white truncate", children: thread.title }),
|
|
4731
|
+
thread.preview && /* @__PURE__ */ jsx24("p", { className: "text-sm text-neutral-600 dark:text-neutral-400 truncate", children: thread.preview }),
|
|
4732
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-2 mt-1 text-xs text-neutral-500", children: [
|
|
4733
|
+
/* @__PURE__ */ jsxs20("span", { children: [
|
|
4606
4734
|
thread.messageCount,
|
|
4607
4735
|
" messages"
|
|
4608
4736
|
] }),
|
|
4609
|
-
/* @__PURE__ */
|
|
4610
|
-
/* @__PURE__ */
|
|
4737
|
+
/* @__PURE__ */ jsx24("span", { children: "\u2022" }),
|
|
4738
|
+
/* @__PURE__ */ jsx24("span", { children: formatRelativeTime(thread.updatedAt) })
|
|
4611
4739
|
] })
|
|
4612
4740
|
] }),
|
|
4613
|
-
onDelete && /* @__PURE__ */
|
|
4741
|
+
onDelete && /* @__PURE__ */ jsx24(
|
|
4614
4742
|
"button",
|
|
4615
4743
|
{
|
|
4616
4744
|
onClick: (e) => {
|
|
@@ -4640,7 +4768,7 @@ function formatRelativeTime(date) {
|
|
|
4640
4768
|
}
|
|
4641
4769
|
|
|
4642
4770
|
// src/components/Threads/ThreadList.tsx
|
|
4643
|
-
import { jsx as
|
|
4771
|
+
import { jsx as jsx25, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
4644
4772
|
function ThreadList({
|
|
4645
4773
|
threads,
|
|
4646
4774
|
currentThreadId,
|
|
@@ -4654,8 +4782,8 @@ function ThreadList({
|
|
|
4654
4782
|
(thread) => thread.title.toLowerCase().includes(searchQuery.toLowerCase()) || thread.preview?.toLowerCase().includes(searchQuery.toLowerCase())
|
|
4655
4783
|
);
|
|
4656
4784
|
const groupedThreads = groupBy === "date" ? groupThreadsByDate(filteredThreads) : { All: filteredThreads };
|
|
4657
|
-
return /* @__PURE__ */
|
|
4658
|
-
showSearch && /* @__PURE__ */
|
|
4785
|
+
return /* @__PURE__ */ jsxs21("div", { className: "flex flex-col h-full", children: [
|
|
4786
|
+
showSearch && /* @__PURE__ */ jsx25("div", { className: "p-3 border-b border-neutral-200 dark:border-neutral-700", children: /* @__PURE__ */ jsx25(
|
|
4659
4787
|
"input",
|
|
4660
4788
|
{
|
|
4661
4789
|
type: "text",
|
|
@@ -4665,10 +4793,10 @@ function ThreadList({
|
|
|
4665
4793
|
className: "w-full px-3 py-2 text-sm border border-neutral-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-apteva-500 dark:bg-neutral-800 dark:border-neutral-600 dark:text-white"
|
|
4666
4794
|
}
|
|
4667
4795
|
) }),
|
|
4668
|
-
/* @__PURE__ */
|
|
4669
|
-
Object.entries(groupedThreads).map(([group, groupThreads]) => /* @__PURE__ */
|
|
4670
|
-
groupBy !== "none" && /* @__PURE__ */
|
|
4671
|
-
groupThreads.map((thread) => /* @__PURE__ */
|
|
4796
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex-1 overflow-y-auto", children: [
|
|
4797
|
+
Object.entries(groupedThreads).map(([group, groupThreads]) => /* @__PURE__ */ jsxs21("div", { children: [
|
|
4798
|
+
groupBy !== "none" && /* @__PURE__ */ jsx25("div", { className: "px-3 py-2 text-xs font-semibold text-neutral-500 uppercase", children: group }),
|
|
4799
|
+
groupThreads.map((thread) => /* @__PURE__ */ jsx25(
|
|
4672
4800
|
ThreadItem,
|
|
4673
4801
|
{
|
|
4674
4802
|
thread,
|
|
@@ -4679,9 +4807,9 @@ function ThreadList({
|
|
|
4679
4807
|
thread.id
|
|
4680
4808
|
))
|
|
4681
4809
|
] }, group)),
|
|
4682
|
-
filteredThreads.length === 0 && /* @__PURE__ */
|
|
4683
|
-
/* @__PURE__ */
|
|
4684
|
-
/* @__PURE__ */
|
|
4810
|
+
filteredThreads.length === 0 && /* @__PURE__ */ jsxs21("div", { className: "p-8 text-center text-neutral-500", children: [
|
|
4811
|
+
/* @__PURE__ */ jsx25("svg", { className: "w-10 h-10 mx-auto mb-2 opacity-50", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx25("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z" }) }),
|
|
4812
|
+
/* @__PURE__ */ jsx25("p", { children: "No conversations found" })
|
|
4685
4813
|
] })
|
|
4686
4814
|
] })
|
|
4687
4815
|
] });
|
|
@@ -4713,7 +4841,7 @@ function groupThreadsByDate(threads) {
|
|
|
4713
4841
|
}
|
|
4714
4842
|
|
|
4715
4843
|
// src/components/Threads/Threads.tsx
|
|
4716
|
-
import { jsx as
|
|
4844
|
+
import { jsx as jsx26, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
4717
4845
|
function Threads({
|
|
4718
4846
|
threads,
|
|
4719
4847
|
currentThreadId,
|
|
@@ -4732,8 +4860,8 @@ function Threads({
|
|
|
4732
4860
|
tabs: "flex gap-2 border-b border-neutral-200 dark:border-neutral-700 overflow-x-auto"
|
|
4733
4861
|
};
|
|
4734
4862
|
if (variant === "tabs") {
|
|
4735
|
-
return /* @__PURE__ */
|
|
4736
|
-
threads.slice(0, 5).map((thread) => /* @__PURE__ */
|
|
4863
|
+
return /* @__PURE__ */ jsxs22("div", { className: cn(variantClasses[variant], className), children: [
|
|
4864
|
+
threads.slice(0, 5).map((thread) => /* @__PURE__ */ jsx26(
|
|
4737
4865
|
"button",
|
|
4738
4866
|
{
|
|
4739
4867
|
onClick: () => onThreadSelect?.(thread.id),
|
|
@@ -4745,7 +4873,7 @@ function Threads({
|
|
|
4745
4873
|
},
|
|
4746
4874
|
thread.id
|
|
4747
4875
|
)),
|
|
4748
|
-
showNewButton && onNewThread && /* @__PURE__ */
|
|
4876
|
+
showNewButton && onNewThread && /* @__PURE__ */ jsx26(
|
|
4749
4877
|
"button",
|
|
4750
4878
|
{
|
|
4751
4879
|
onClick: onNewThread,
|
|
@@ -4755,8 +4883,8 @@ function Threads({
|
|
|
4755
4883
|
)
|
|
4756
4884
|
] });
|
|
4757
4885
|
}
|
|
4758
|
-
return /* @__PURE__ */
|
|
4759
|
-
showNewButton && onNewThread && /* @__PURE__ */
|
|
4886
|
+
return /* @__PURE__ */ jsxs22("div", { className: cn(variantClasses[variant], "flex flex-col", className), children: [
|
|
4887
|
+
showNewButton && onNewThread && /* @__PURE__ */ jsx26("div", { className: "p-3 border-b border-neutral-200 dark:border-neutral-700", children: /* @__PURE__ */ jsx26(
|
|
4760
4888
|
"button",
|
|
4761
4889
|
{
|
|
4762
4890
|
onClick: onNewThread,
|
|
@@ -4764,7 +4892,7 @@ function Threads({
|
|
|
4764
4892
|
children: "+ New Conversation"
|
|
4765
4893
|
}
|
|
4766
4894
|
) }),
|
|
4767
|
-
/* @__PURE__ */
|
|
4895
|
+
/* @__PURE__ */ jsx26(
|
|
4768
4896
|
ThreadList,
|
|
4769
4897
|
{
|
|
4770
4898
|
threads,
|