@volter-ai-dev/supercode-ui 0.1.18 → 0.1.21
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/README.md +9 -0
- package/components.mjs +602 -348
- package/composer.mjs +209 -34
- package/controller.mjs +21 -2
- package/conversation.mjs +226 -201
- package/core.mjs +13 -1
- package/embed.mjs +604 -350
- package/icon.mjs +6 -0
- package/index.d.ts +17 -4
- package/messenger.mjs +602 -348
- package/package.json +1 -1
- package/sessions.mjs +47 -37
- package/styles.css +5 -1
package/conversation.mjs
CHANGED
|
@@ -575,6 +575,7 @@ function boundedSet(map, key, value) {
|
|
|
575
575
|
// src/icon.jsx
|
|
576
576
|
import { Fragment, jsx as jsx2, jsxs } from "preact/jsx-runtime";
|
|
577
577
|
var ICONS = {
|
|
578
|
+
attach: () => /* @__PURE__ */ jsx2("path", { d: "M6.25 9.75 10.6 5.4a2.1 2.1 0 0 1 2.97 2.97l-5.4 5.4a3.3 3.3 0 0 1-4.67-4.66l5.52-5.52" }),
|
|
578
579
|
back: () => /* @__PURE__ */ jsx2("path", { d: "m11.5 4.5-4.5 4.5 4.5 4.5" }),
|
|
579
580
|
check: () => /* @__PURE__ */ jsx2("path", { d: "m4 9 3.25 3.25L14 5.5" }),
|
|
580
581
|
chevron: () => /* @__PURE__ */ jsx2("path", { d: "m7 4.5 4.5 4.5L7 13.5" }),
|
|
@@ -590,6 +591,11 @@ var ICONS = {
|
|
|
590
591
|
/* @__PURE__ */ jsx2("path", { d: "M9 3.5v10" }),
|
|
591
592
|
/* @__PURE__ */ jsx2("path", { d: "m4.75 9.5 4.25 4 4.25-4" })
|
|
592
593
|
] }),
|
|
594
|
+
image: () => /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
595
|
+
/* @__PURE__ */ jsx2("rect", { x: "3", y: "3.5", width: "12", height: "11", rx: "1.75" }),
|
|
596
|
+
/* @__PURE__ */ jsx2("circle", { cx: "6.5", cy: "7", r: "1.25" }),
|
|
597
|
+
/* @__PURE__ */ jsx2("path", { d: "m4.5 13 3.25-3 2.1 1.85 1.65-1.5L14 13" })
|
|
598
|
+
] }),
|
|
593
599
|
menu: () => /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
594
600
|
/* @__PURE__ */ jsx2("circle", { cx: "4", cy: "9", r: "1.25", fill: "currentColor", stroke: "none" }),
|
|
595
601
|
/* @__PURE__ */ jsx2("circle", { cx: "9", cy: "9", r: "1.25", fill: "currentColor", stroke: "none" }),
|
|
@@ -615,8 +621,19 @@ function UiIcon({ name, size = 16, class: className = "" }) {
|
|
|
615
621
|
return /* @__PURE__ */ jsx2("svg", { class: `scui-icon ${className}`, style: { "--scui-icon-size": `${size}px` }, viewBox: "0 0 18 18", fill: "none", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx2(Glyph, {}) });
|
|
616
622
|
}
|
|
617
623
|
|
|
624
|
+
// src/context.jsx
|
|
625
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "preact/jsx-runtime";
|
|
626
|
+
var MAX_IMAGE_BYTES = 5 * 1024 * 1024;
|
|
627
|
+
function MessageImages({ items }) {
|
|
628
|
+
if (!items?.length) return null;
|
|
629
|
+
return /* @__PURE__ */ jsx3("div", { class: "scui-message-images", children: items.map((item, index) => item.url ? /* @__PURE__ */ jsx3("img", { src: item.url, alt: item.label }, item.id ?? `${item.label}:${index}`) : /* @__PURE__ */ jsxs2("span", { children: [
|
|
630
|
+
/* @__PURE__ */ jsx3(UiIcon, { name: "image", size: 14 }),
|
|
631
|
+
item.label
|
|
632
|
+
] }, item.id ?? `${item.label}:${index}`)) });
|
|
633
|
+
}
|
|
634
|
+
|
|
618
635
|
// src/conversation.jsx
|
|
619
|
-
import { Fragment as Fragment3, jsx as
|
|
636
|
+
import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs3 } from "preact/jsx-runtime";
|
|
620
637
|
function LoadingStatus({ state, compact = false }) {
|
|
621
638
|
const copy = {
|
|
622
639
|
connecting: ["Connecting to coding agents", "Checking installed harnesses and capabilities.", 0],
|
|
@@ -624,43 +641,43 @@ function LoadingStatus({ state, compact = false }) {
|
|
|
624
641
|
discovering: ["Loading recent sessions", "Scanning native session stores without loading full transcripts.", 2],
|
|
625
642
|
ready: ["Ready", "Coding sessions are up to date.", 3]
|
|
626
643
|
}[state.startup];
|
|
627
|
-
return /* @__PURE__ */
|
|
628
|
-
/* @__PURE__ */
|
|
629
|
-
/* @__PURE__ */
|
|
630
|
-
/* @__PURE__ */
|
|
631
|
-
/* @__PURE__ */
|
|
644
|
+
return /* @__PURE__ */ jsxs3("div", { class: `scui-loading${compact ? " scui-loading-compact" : ""}`, role: "status", "aria-busy": state.startup !== "ready", children: [
|
|
645
|
+
/* @__PURE__ */ jsx4("span", { class: "scui-orbit", "aria-hidden": "true", children: /* @__PURE__ */ jsx4("i", {}) }),
|
|
646
|
+
/* @__PURE__ */ jsxs3("span", { class: "scui-loading-copy", children: [
|
|
647
|
+
/* @__PURE__ */ jsx4("strong", { children: copy[0] }),
|
|
648
|
+
/* @__PURE__ */ jsx4("small", { children: copy[1] })
|
|
632
649
|
] }),
|
|
633
|
-
/* @__PURE__ */
|
|
650
|
+
/* @__PURE__ */ jsx4("span", { class: "scui-progress", "aria-hidden": "true", children: [1, 2, 3].map((step) => /* @__PURE__ */ jsx4("i", { "data-progress": step <= copy[2] ? "done" : step === copy[2] + 1 ? "current" : "waiting" }, step)) })
|
|
634
651
|
] });
|
|
635
652
|
}
|
|
636
653
|
function RequestCard({ entry, adapter, canRespond }) {
|
|
637
654
|
const request = entry.request;
|
|
638
655
|
if (!request) return null;
|
|
639
656
|
if (request.status === "responded") {
|
|
640
|
-
return /* @__PURE__ */
|
|
657
|
+
return /* @__PURE__ */ jsxs3("div", { class: "scui-request-done", children: [
|
|
641
658
|
"\u2713 Request answered \xB7 ",
|
|
642
659
|
request.resolution?.name ?? request.requestKind
|
|
643
660
|
] });
|
|
644
661
|
}
|
|
645
|
-
return /* @__PURE__ */
|
|
646
|
-
/* @__PURE__ */
|
|
647
|
-
/* @__PURE__ */
|
|
648
|
-
/* @__PURE__ */
|
|
649
|
-
request.options.map((option) => /* @__PURE__ */
|
|
650
|
-
request.cancellable ? /* @__PURE__ */
|
|
662
|
+
return /* @__PURE__ */ jsxs3("section", { class: "scui-request", role: "alert", "aria-label": `${request.requestKind} needs input`, children: [
|
|
663
|
+
/* @__PURE__ */ jsx4("strong", { children: "Agent needs input" }),
|
|
664
|
+
/* @__PURE__ */ jsx4(Markdown, { value: request.payloadText || entry.text, copyText: adapter?.copyText }),
|
|
665
|
+
/* @__PURE__ */ jsxs3("div", { class: "scui-request-actions", children: [
|
|
666
|
+
request.options.map((option) => /* @__PURE__ */ jsx4("button", { type: "button", disabled: !canRespond, onClick: () => adapter.onIntent({ action: "respond", requestId: request.requestId, optionId: option.optionId }), children: option.name }, option.optionId)),
|
|
667
|
+
request.cancellable ? /* @__PURE__ */ jsx4("button", { type: "button", disabled: !canRespond, onClick: () => adapter.onIntent({ action: "respond", requestId: request.requestId, optionId: null }), children: "Cancel" }) : null
|
|
651
668
|
] })
|
|
652
669
|
] });
|
|
653
670
|
}
|
|
654
671
|
function ContextDisclosure({ context }) {
|
|
655
672
|
if (!context?.length) return null;
|
|
656
|
-
return /* @__PURE__ */
|
|
657
|
-
/* @__PURE__ */
|
|
673
|
+
return /* @__PURE__ */ jsxs3("details", { class: "scui-context", children: [
|
|
674
|
+
/* @__PURE__ */ jsxs3("summary", { children: [
|
|
658
675
|
"Context \xB7 ",
|
|
659
676
|
context.length
|
|
660
677
|
] }),
|
|
661
|
-
/* @__PURE__ */
|
|
662
|
-
/* @__PURE__ */
|
|
663
|
-
/* @__PURE__ */
|
|
678
|
+
/* @__PURE__ */ jsx4("div", { children: context.map((item, index) => /* @__PURE__ */ jsxs3("p", { children: [
|
|
679
|
+
/* @__PURE__ */ jsx4("strong", { children: item.label }),
|
|
680
|
+
/* @__PURE__ */ jsx4("span", { children: item.detail })
|
|
664
681
|
] }, item.id ?? index)) })
|
|
665
682
|
] });
|
|
666
683
|
}
|
|
@@ -682,46 +699,46 @@ function MessageMeta({ entry, adapter }) {
|
|
|
682
699
|
reset.current = setTimeout(() => setCopyState2("idle"), 1500);
|
|
683
700
|
};
|
|
684
701
|
const copyLabel = copyState === "copied" ? "Message copied" : copyState === "failed" ? "Copy failed \xB7 retry" : "Copy message";
|
|
685
|
-
return /* @__PURE__ */
|
|
686
|
-
validDate ? /* @__PURE__ */
|
|
687
|
-
adapter?.copyText && entry.text ? /* @__PURE__ */
|
|
702
|
+
return /* @__PURE__ */ jsxs3("footer", { class: "scui-message-meta", children: [
|
|
703
|
+
validDate ? /* @__PURE__ */ jsx4("time", { dateTime: validDate.toISOString(), title: validDate.toLocaleString(), children: validDate.toLocaleTimeString([], { hour: "numeric", minute: "2-digit" }) }) : null,
|
|
704
|
+
adapter?.copyText && entry.text ? /* @__PURE__ */ jsx4("button", { type: "button", "aria-label": copyLabel, title: copyLabel, onClick: copy, "data-status": copyState, children: /* @__PURE__ */ jsx4(UiIcon, { name: "copy", size: 13 }) }) : null
|
|
688
705
|
] });
|
|
689
706
|
}
|
|
690
707
|
var TOOL_ICONS = {
|
|
691
|
-
read: () => /* @__PURE__ */
|
|
692
|
-
/* @__PURE__ */
|
|
693
|
-
/* @__PURE__ */
|
|
708
|
+
read: () => /* @__PURE__ */ jsxs3(Fragment3, { children: [
|
|
709
|
+
/* @__PURE__ */ jsx4("path", { d: "M5 2.75h7.25L15 5.5v7.75A1.75 1.75 0 0 1 13.25 15h-8.5A1.75 1.75 0 0 1 3 13.25v-8.5A2 2 0 0 1 5 2.75Z" }),
|
|
710
|
+
/* @__PURE__ */ jsx4("path", { d: "M12 2.9v3h2.85M6 9h6M6 12h4" })
|
|
694
711
|
] }),
|
|
695
|
-
search: () => /* @__PURE__ */
|
|
696
|
-
/* @__PURE__ */
|
|
697
|
-
/* @__PURE__ */
|
|
712
|
+
search: () => /* @__PURE__ */ jsxs3(Fragment3, { children: [
|
|
713
|
+
/* @__PURE__ */ jsx4("circle", { cx: "8", cy: "8", r: "4.5" }),
|
|
714
|
+
/* @__PURE__ */ jsx4("path", { d: "m11.5 11.5 3 3" })
|
|
698
715
|
] }),
|
|
699
|
-
edit: () => /* @__PURE__ */
|
|
700
|
-
/* @__PURE__ */
|
|
701
|
-
/* @__PURE__ */
|
|
716
|
+
edit: () => /* @__PURE__ */ jsxs3(Fragment3, { children: [
|
|
717
|
+
/* @__PURE__ */ jsx4("path", { d: "m11.75 3.25 3 3-8.5 8.5-3.75.75.75-3.75 8.5-8.5Z" }),
|
|
718
|
+
/* @__PURE__ */ jsx4("path", { d: "m10 5 3 3" })
|
|
702
719
|
] }),
|
|
703
|
-
command: () => /* @__PURE__ */
|
|
704
|
-
test: () => /* @__PURE__ */
|
|
705
|
-
/* @__PURE__ */
|
|
706
|
-
/* @__PURE__ */
|
|
720
|
+
command: () => /* @__PURE__ */ jsx4(Fragment3, { children: /* @__PURE__ */ jsx4("path", { d: "m3 5 3 3-3 3M8 12h6" }) }),
|
|
721
|
+
test: () => /* @__PURE__ */ jsxs3(Fragment3, { children: [
|
|
722
|
+
/* @__PURE__ */ jsx4("path", { d: "M6 2.5v3L3 12a2 2 0 0 0 1.8 3h8.4a2 2 0 0 0 1.8-3l-3-6.5v-3M5 9h8" }),
|
|
723
|
+
/* @__PURE__ */ jsx4("path", { d: "M5 2.5h8" })
|
|
707
724
|
] }),
|
|
708
|
-
web: () => /* @__PURE__ */
|
|
709
|
-
/* @__PURE__ */
|
|
710
|
-
/* @__PURE__ */
|
|
725
|
+
web: () => /* @__PURE__ */ jsxs3(Fragment3, { children: [
|
|
726
|
+
/* @__PURE__ */ jsx4("circle", { cx: "9", cy: "9", r: "6.5" }),
|
|
727
|
+
/* @__PURE__ */ jsx4("path", { d: "M2.75 9h12.5M9 2.5c2 1.8 3 4 3 6.5s-1 4.7-3 6.5c-2-1.8-3-4-3-6.5s1-4.7 3-6.5Z" })
|
|
711
728
|
] }),
|
|
712
|
-
agent: () => /* @__PURE__ */
|
|
713
|
-
/* @__PURE__ */
|
|
714
|
-
/* @__PURE__ */
|
|
729
|
+
agent: () => /* @__PURE__ */ jsxs3(Fragment3, { children: [
|
|
730
|
+
/* @__PURE__ */ jsx4("circle", { cx: "9", cy: "6", r: "2.5" }),
|
|
731
|
+
/* @__PURE__ */ jsx4("path", { d: "M4 15c.4-3 2-4.5 5-4.5s4.6 1.5 5 4.5" })
|
|
715
732
|
] }),
|
|
716
|
-
plan: () => /* @__PURE__ */
|
|
717
|
-
other: () => /* @__PURE__ */
|
|
718
|
-
/* @__PURE__ */
|
|
719
|
-
/* @__PURE__ */
|
|
733
|
+
plan: () => /* @__PURE__ */ jsx4(Fragment3, { children: /* @__PURE__ */ jsx4("path", { d: "m3 5 1 1 2-2M3 9l1 1 2-2M3 13l1 1 2-2M8 5h7M8 9h7M8 13h7" }) }),
|
|
734
|
+
other: () => /* @__PURE__ */ jsxs3(Fragment3, { children: [
|
|
735
|
+
/* @__PURE__ */ jsx4("path", { d: "M9 2.5v3M9 12.5v3M2.5 9h3M12.5 9h3" }),
|
|
736
|
+
/* @__PURE__ */ jsx4("circle", { cx: "9", cy: "9", r: "3.5" })
|
|
720
737
|
] })
|
|
721
738
|
};
|
|
722
739
|
function ToolIcon({ category }) {
|
|
723
740
|
const Glyph = TOOL_ICONS[category] ?? TOOL_ICONS.other;
|
|
724
|
-
return /* @__PURE__ */
|
|
741
|
+
return /* @__PURE__ */ jsx4("svg", { class: "scui-tool-icon", viewBox: "0 0 18 18", fill: "none", stroke: "currentColor", "stroke-width": "1.35", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx4(Glyph, {}) });
|
|
725
742
|
}
|
|
726
743
|
function toolAction2(entry, category, presentation) {
|
|
727
744
|
if (presentation?.action) return presentation.action;
|
|
@@ -776,7 +793,7 @@ function ToolMetrics({ presentation }) {
|
|
|
776
793
|
presentation.exitCode === null ? "" : `exit ${presentation.exitCode}`,
|
|
777
794
|
formatDuration(presentation.durationMs)
|
|
778
795
|
].filter(Boolean);
|
|
779
|
-
return metrics.length ? /* @__PURE__ */
|
|
796
|
+
return metrics.length ? /* @__PURE__ */ jsx4("div", { class: "scui-tool-metrics", children: metrics.map((metric) => /* @__PURE__ */ jsx4("span", { children: metric }, metric)) }) : null;
|
|
780
797
|
}
|
|
781
798
|
function PendingElapsed({ now }) {
|
|
782
799
|
const clock = now ?? Date.now;
|
|
@@ -786,74 +803,74 @@ function PendingElapsed({ now }) {
|
|
|
786
803
|
const timer = setInterval(() => setElapsed(Math.max(0, clock() - started.current)), 1e3);
|
|
787
804
|
return () => clearInterval(timer);
|
|
788
805
|
}, [clock]);
|
|
789
|
-
return /* @__PURE__ */
|
|
806
|
+
return /* @__PURE__ */ jsx4("small", { class: "scui-tool-elapsed", children: elapsed < 1e3 ? "now" : formatDuration(elapsed) });
|
|
790
807
|
}
|
|
791
808
|
function LinePreview({ value, kind }) {
|
|
792
809
|
if (!value) return null;
|
|
793
|
-
return /* @__PURE__ */
|
|
810
|
+
return /* @__PURE__ */ jsx4("ol", { class: "scui-code-preview", "data-kind": kind, children: stripAnsi(value).split("\n").map((line, index) => {
|
|
794
811
|
const tone = kind === "diff" ? line.startsWith("+") && !line.startsWith("+++") ? "add" : line.startsWith("-") && !line.startsWith("---") ? "remove" : line.startsWith("@@") ? "hunk" : "plain" : "plain";
|
|
795
|
-
return /* @__PURE__ */
|
|
796
|
-
/* @__PURE__ */
|
|
797
|
-
/* @__PURE__ */
|
|
812
|
+
return /* @__PURE__ */ jsxs3("li", { "data-tone": tone, children: [
|
|
813
|
+
/* @__PURE__ */ jsx4("span", { children: index + 1 }),
|
|
814
|
+
/* @__PURE__ */ jsx4("code", { children: line || " " })
|
|
798
815
|
] }, index);
|
|
799
816
|
}) });
|
|
800
817
|
}
|
|
801
818
|
function TerminalPreview({ presentation, pending, failed }) {
|
|
802
|
-
return /* @__PURE__ */
|
|
803
|
-
/* @__PURE__ */
|
|
804
|
-
/* @__PURE__ */
|
|
805
|
-
/* @__PURE__ */
|
|
806
|
-
/* @__PURE__ */
|
|
807
|
-
/* @__PURE__ */
|
|
819
|
+
return /* @__PURE__ */ jsxs3("section", { class: "scui-terminal", children: [
|
|
820
|
+
/* @__PURE__ */ jsxs3("header", { children: [
|
|
821
|
+
/* @__PURE__ */ jsxs3("span", { "aria-hidden": "true", children: [
|
|
822
|
+
/* @__PURE__ */ jsx4("i", {}),
|
|
823
|
+
/* @__PURE__ */ jsx4("i", {}),
|
|
824
|
+
/* @__PURE__ */ jsx4("i", {})
|
|
808
825
|
] }),
|
|
809
|
-
/* @__PURE__ */
|
|
826
|
+
/* @__PURE__ */ jsx4("code", { children: presentation.command ? `$ ${presentation.command}` : "Terminal" })
|
|
810
827
|
] }),
|
|
811
|
-
presentation.preview ? /* @__PURE__ */
|
|
812
|
-
/* @__PURE__ */
|
|
828
|
+
presentation.preview ? /* @__PURE__ */ jsx4("pre", { "data-error": failed, children: stripAnsi(presentation.preview) }) : pending ? /* @__PURE__ */ jsxs3("div", { class: "scui-terminal-wait", children: [
|
|
829
|
+
/* @__PURE__ */ jsx4("i", {}),
|
|
813
830
|
" Waiting for output"
|
|
814
|
-
] }) : /* @__PURE__ */
|
|
831
|
+
] }) : /* @__PURE__ */ jsx4("div", { class: "scui-terminal-empty", children: "No output" })
|
|
815
832
|
] });
|
|
816
833
|
}
|
|
817
834
|
function SearchPreview({ presentation }) {
|
|
818
835
|
const lines = stripAnsi(presentation.preview).split("\n").filter(Boolean);
|
|
819
|
-
return /* @__PURE__ */
|
|
820
|
-
presentation.query ? /* @__PURE__ */
|
|
821
|
-
/* @__PURE__ */
|
|
822
|
-
/* @__PURE__ */
|
|
836
|
+
return /* @__PURE__ */ jsxs3("section", { class: "scui-search-preview", children: [
|
|
837
|
+
presentation.query ? /* @__PURE__ */ jsxs3("header", { children: [
|
|
838
|
+
/* @__PURE__ */ jsx4("span", { children: "Search" }),
|
|
839
|
+
/* @__PURE__ */ jsx4("code", { children: presentation.query })
|
|
823
840
|
] }) : null,
|
|
824
|
-
lines.length ? /* @__PURE__ */
|
|
841
|
+
lines.length ? /* @__PURE__ */ jsx4("ol", { children: lines.map((line, index) => {
|
|
825
842
|
const match = /^(.*?):(\d+)(?::(\d+))?:(.*)$/.exec(line);
|
|
826
|
-
return /* @__PURE__ */
|
|
827
|
-
/* @__PURE__ */
|
|
828
|
-
/* @__PURE__ */
|
|
843
|
+
return /* @__PURE__ */ jsx4("li", { children: match ? /* @__PURE__ */ jsxs3(Fragment3, { children: [
|
|
844
|
+
/* @__PURE__ */ jsx4("code", { children: match[1] }),
|
|
845
|
+
/* @__PURE__ */ jsxs3("small", { children: [
|
|
829
846
|
match[2],
|
|
830
847
|
match[3] ? `:${match[3]}` : ""
|
|
831
848
|
] }),
|
|
832
|
-
/* @__PURE__ */
|
|
833
|
-
] }) : /* @__PURE__ */
|
|
834
|
-
}) }) : /* @__PURE__ */
|
|
849
|
+
/* @__PURE__ */ jsx4("span", { children: match[4] })
|
|
850
|
+
] }) : /* @__PURE__ */ jsx4("span", { children: line }) }, index);
|
|
851
|
+
}) }) : /* @__PURE__ */ jsx4("p", { children: "No textual results" })
|
|
835
852
|
] });
|
|
836
853
|
}
|
|
837
854
|
function ToolPreview({ presentation, entry }) {
|
|
838
855
|
const pending = entry.status === "pending";
|
|
839
856
|
const failed = entry.status === "error";
|
|
840
|
-
if (presentation.detail === "terminal") return /* @__PURE__ */
|
|
841
|
-
if (presentation.detail === "diff") return presentation.preview ? /* @__PURE__ */
|
|
842
|
-
if (presentation.detail === "file") return presentation.preview ? /* @__PURE__ */
|
|
843
|
-
if (presentation.detail === "matches") return /* @__PURE__ */
|
|
844
|
-
if (presentation.detail === "web") return /* @__PURE__ */
|
|
845
|
-
presentation.url ? /* @__PURE__ */
|
|
846
|
-
presentation.preview ? /* @__PURE__ */
|
|
857
|
+
if (presentation.detail === "terminal") return /* @__PURE__ */ jsx4(TerminalPreview, { presentation, pending, failed });
|
|
858
|
+
if (presentation.detail === "diff") return presentation.preview ? /* @__PURE__ */ jsx4(LinePreview, { value: presentation.preview, kind: "diff" }) : /* @__PURE__ */ jsx4("div", { class: "scui-tool-empty", children: "Edit completed without a textual diff" });
|
|
859
|
+
if (presentation.detail === "file") return presentation.preview ? /* @__PURE__ */ jsx4(LinePreview, { value: presentation.preview, kind: "file" }) : /* @__PURE__ */ jsx4("div", { class: "scui-tool-empty", children: "File contents were not included in this event" });
|
|
860
|
+
if (presentation.detail === "matches") return /* @__PURE__ */ jsx4(SearchPreview, { presentation });
|
|
861
|
+
if (presentation.detail === "web") return /* @__PURE__ */ jsxs3("section", { class: "scui-web-preview", children: [
|
|
862
|
+
presentation.url ? /* @__PURE__ */ jsx4("code", { children: presentation.url }) : null,
|
|
863
|
+
presentation.preview ? /* @__PURE__ */ jsx4("p", { children: stripAnsi(presentation.preview) }) : /* @__PURE__ */ jsx4("small", { children: pending ? "Waiting for the page" : "No page summary returned" })
|
|
847
864
|
] });
|
|
848
|
-
if (presentation.detail === "agent") return /* @__PURE__ */
|
|
849
|
-
/* @__PURE__ */
|
|
850
|
-
/* @__PURE__ */
|
|
851
|
-
] }, `${item.label}:${index}`)) }) : presentation.preview ? /* @__PURE__ */
|
|
852
|
-
if (presentation.detail === "plan") return /* @__PURE__ */
|
|
853
|
-
/* @__PURE__ */
|
|
854
|
-
/* @__PURE__ */
|
|
865
|
+
if (presentation.detail === "agent") return /* @__PURE__ */ jsx4("section", { class: "scui-agent-preview", children: presentation.items?.length ? /* @__PURE__ */ jsx4("ol", { class: "scui-agent-roster", children: presentation.items.map((item, index) => /* @__PURE__ */ jsxs3("li", { children: [
|
|
866
|
+
/* @__PURE__ */ jsx4("strong", { children: item.label }),
|
|
867
|
+
/* @__PURE__ */ jsx4("small", { children: item.status })
|
|
868
|
+
] }, `${item.label}:${index}`)) }) : presentation.preview ? /* @__PURE__ */ jsx4("pre", { children: stripAnsi(presentation.preview) }) : /* @__PURE__ */ jsx4("small", { children: pending ? "Agent is working" : "No textual handoff returned" }) });
|
|
869
|
+
if (presentation.detail === "plan") return /* @__PURE__ */ jsx4("ol", { class: "scui-plan-preview", children: presentation.items?.map((item, index) => /* @__PURE__ */ jsxs3("li", { "data-status": item.status, children: [
|
|
870
|
+
/* @__PURE__ */ jsx4("i", { "aria-hidden": "true" }),
|
|
871
|
+
/* @__PURE__ */ jsx4("span", { children: item.label })
|
|
855
872
|
] }, `${item.label}:${index}`)) });
|
|
856
|
-
return presentation.preview ? /* @__PURE__ */
|
|
873
|
+
return presentation.preview ? /* @__PURE__ */ jsx4("pre", { class: "scui-tool-output", "data-error": failed, children: stripAnsi(presentation.preview) }) : null;
|
|
857
874
|
}
|
|
858
875
|
function ToolActions({ presentation, adapter }) {
|
|
859
876
|
const [copied, setCopied] = useState(false);
|
|
@@ -867,27 +884,27 @@ function ToolActions({ presentation, adapter }) {
|
|
|
867
884
|
clearTimeout(reset.current);
|
|
868
885
|
reset.current = setTimeout(() => setCopied(false), 1500);
|
|
869
886
|
};
|
|
870
|
-
return action ? /* @__PURE__ */
|
|
887
|
+
return action ? /* @__PURE__ */ jsx4("div", { class: "scui-tool-actions", children: /* @__PURE__ */ jsx4("button", { type: "button", onClick: copy, children: copied ? "Copied" : action[0] }) }) : null;
|
|
871
888
|
}
|
|
872
889
|
function ToolStack({ tools }) {
|
|
873
890
|
if (tools.length < 2) return null;
|
|
874
|
-
return /* @__PURE__ */
|
|
891
|
+
return /* @__PURE__ */ jsx4("div", { class: "scui-tool-stack", "aria-label": "Coordinated tools", children: tools.map((tool) => /* @__PURE__ */ jsx4("span", { children: tool.replaceAll("__", " \xB7 ").replaceAll("_", " ") }, tool)) });
|
|
875
892
|
}
|
|
876
893
|
function TechnicalDetails({ entry }) {
|
|
877
894
|
if (!entry.arguments && !entry.resultText) return null;
|
|
878
|
-
return /* @__PURE__ */
|
|
879
|
-
/* @__PURE__ */
|
|
880
|
-
/* @__PURE__ */
|
|
881
|
-
entry.arguments ? /* @__PURE__ */
|
|
882
|
-
/* @__PURE__ */
|
|
883
|
-
/* @__PURE__ */
|
|
884
|
-
/* @__PURE__ */
|
|
885
|
-
/* @__PURE__ */
|
|
895
|
+
return /* @__PURE__ */ jsxs3("details", { class: "scui-tool-technical", children: [
|
|
896
|
+
/* @__PURE__ */ jsx4("summary", { children: "Technical details" }),
|
|
897
|
+
/* @__PURE__ */ jsxs3("div", { children: [
|
|
898
|
+
entry.arguments ? /* @__PURE__ */ jsxs3("section", { children: [
|
|
899
|
+
/* @__PURE__ */ jsx4("strong", { children: "Native arguments" }),
|
|
900
|
+
/* @__PURE__ */ jsx4("dl", { children: argumentRows(entry.arguments).map((row) => /* @__PURE__ */ jsxs3("div", { children: [
|
|
901
|
+
/* @__PURE__ */ jsx4("dt", { children: row.label }),
|
|
902
|
+
/* @__PURE__ */ jsx4("dd", { children: /* @__PURE__ */ jsx4("pre", { children: row.value }) })
|
|
886
903
|
] }, row.key)) })
|
|
887
904
|
] }) : null,
|
|
888
|
-
entry.resultText ? /* @__PURE__ */
|
|
889
|
-
/* @__PURE__ */
|
|
890
|
-
/* @__PURE__ */
|
|
905
|
+
entry.resultText ? /* @__PURE__ */ jsxs3("section", { children: [
|
|
906
|
+
/* @__PURE__ */ jsx4("strong", { children: "Native result" }),
|
|
907
|
+
/* @__PURE__ */ jsxs3("pre", { "data-error": entry.status === "error", children: [
|
|
891
908
|
entry.resultText,
|
|
892
909
|
entry.truncated ? "\n[truncated]" : ""
|
|
893
910
|
] })
|
|
@@ -896,19 +913,20 @@ function TechnicalDetails({ entry }) {
|
|
|
896
913
|
] });
|
|
897
914
|
}
|
|
898
915
|
function TranscriptEntry({ entry, state, adapter }) {
|
|
899
|
-
if (entry.role === "request") return /* @__PURE__ */
|
|
916
|
+
if (entry.role === "request") return /* @__PURE__ */ jsx4(RequestCard, { entry, adapter, canRespond: state.canRespond });
|
|
900
917
|
if (entry.role === "reasoning") {
|
|
901
|
-
return /* @__PURE__ */
|
|
902
|
-
/* @__PURE__ */
|
|
903
|
-
/* @__PURE__ */
|
|
918
|
+
return /* @__PURE__ */ jsxs3("details", { class: "scui-reasoning", open: entry.streaming, children: [
|
|
919
|
+
/* @__PURE__ */ jsx4("summary", { children: entry.streaming ? "Reasoning\u2026" : "Reasoning" }),
|
|
920
|
+
/* @__PURE__ */ jsx4(Markdown, { value: entry.text, copyText: adapter?.copyText })
|
|
904
921
|
] });
|
|
905
922
|
}
|
|
906
|
-
if (entry.role === "notice" || entry.role === "system") return /* @__PURE__ */
|
|
907
|
-
return /* @__PURE__ */
|
|
908
|
-
/* @__PURE__ */
|
|
909
|
-
/* @__PURE__ */
|
|
910
|
-
|
|
911
|
-
/* @__PURE__ */
|
|
923
|
+
if (entry.role === "notice" || entry.role === "system") return /* @__PURE__ */ jsx4("div", { class: "scui-notice", "data-code": entry.code, children: entry.text });
|
|
924
|
+
return /* @__PURE__ */ jsxs3("article", { class: "scui-message", "data-role": entry.role, "aria-label": `${entry.role === "user" ? "Your" : "Assistant"} message`, children: [
|
|
925
|
+
/* @__PURE__ */ jsx4(MessageImages, { items: entry.images }),
|
|
926
|
+
/* @__PURE__ */ jsx4(Markdown, { value: entry.text, copyText: adapter?.copyText }),
|
|
927
|
+
/* @__PURE__ */ jsx4(ContextDisclosure, { context: entry.context }),
|
|
928
|
+
entry.truncated ? /* @__PURE__ */ jsx4("small", { class: "scui-truncated", children: "Entry truncated by host \xB7 load native session for the complete value" }) : null,
|
|
929
|
+
/* @__PURE__ */ jsx4(MessageMeta, { entry, adapter })
|
|
912
930
|
] });
|
|
913
931
|
}
|
|
914
932
|
function ToolRow({ entry, workspace, open = false, adapter }) {
|
|
@@ -920,102 +938,102 @@ function ToolRow({ entry, workspace, open = false, adapter }) {
|
|
|
920
938
|
const target = compactToolTarget(presentation.target, workspace);
|
|
921
939
|
const hasDetail = Boolean(entry.arguments || entry.resultText || presentation.preview || presentation.fields.length);
|
|
922
940
|
const category = presentation.category ?? toolCategory(entry);
|
|
923
|
-
const summary = /* @__PURE__ */
|
|
924
|
-
/* @__PURE__ */
|
|
925
|
-
/* @__PURE__ */
|
|
926
|
-
target ? /* @__PURE__ */
|
|
927
|
-
/* @__PURE__ */
|
|
928
|
-
entry.status === "pending" ? /* @__PURE__ */
|
|
929
|
-
/* @__PURE__ */
|
|
930
|
-
hasDetail ? /* @__PURE__ */
|
|
941
|
+
const summary = /* @__PURE__ */ jsxs3(Fragment3, { children: [
|
|
942
|
+
/* @__PURE__ */ jsx4(ToolIcon, { category }),
|
|
943
|
+
/* @__PURE__ */ jsx4("strong", { children: toolAction2(entry, category, presentation) }),
|
|
944
|
+
target ? /* @__PURE__ */ jsx4("code", { class: "scui-tool-target", title: presentation.target, children: target }) : null,
|
|
945
|
+
/* @__PURE__ */ jsx4("span", { class: "scui-spacer" }),
|
|
946
|
+
entry.status === "pending" ? /* @__PURE__ */ jsx4(PendingElapsed, { now: adapter?.now }) : null,
|
|
947
|
+
/* @__PURE__ */ jsx4("span", { class: "scui-tool-status", role: "status", "data-status": entry.status ?? "completed", "aria-label": entry.status ?? "completed", children: entry.status === "pending" ? /* @__PURE__ */ jsx4("i", {}) : /* @__PURE__ */ jsx4(UiIcon, { name: entry.status === "error" ? "close" : "check", size: 12 }) }),
|
|
948
|
+
hasDetail ? /* @__PURE__ */ jsx4(UiIcon, { name: "chevron", size: 14, class: "scui-tool-chevron" }) : null
|
|
931
949
|
] });
|
|
932
|
-
if (!hasDetail) return /* @__PURE__ */
|
|
933
|
-
return /* @__PURE__ */
|
|
934
|
-
/* @__PURE__ */
|
|
935
|
-
/* @__PURE__ */
|
|
936
|
-
/* @__PURE__ */
|
|
937
|
-
/* @__PURE__ */
|
|
938
|
-
/* @__PURE__ */
|
|
939
|
-
presentation.fields.length ? /* @__PURE__ */
|
|
940
|
-
/* @__PURE__ */
|
|
941
|
-
/* @__PURE__ */
|
|
950
|
+
if (!hasDetail) return /* @__PURE__ */ jsx4("div", { class: "scui-tool", "data-status": entry.status ?? "completed", "data-category": category, children: /* @__PURE__ */ jsx4("div", { class: "scui-tool-head", children: summary }) });
|
|
951
|
+
return /* @__PURE__ */ jsxs3("details", { class: "scui-tool", "data-status": entry.status ?? "completed", "data-category": category, open: expanded, onToggle: (event) => setExpanded(event.currentTarget.open), children: [
|
|
952
|
+
/* @__PURE__ */ jsx4("summary", { class: "scui-tool-head", children: summary }),
|
|
953
|
+
/* @__PURE__ */ jsxs3("div", { class: "scui-tool-detail", children: [
|
|
954
|
+
/* @__PURE__ */ jsx4(ToolMetrics, { presentation }),
|
|
955
|
+
/* @__PURE__ */ jsx4(ToolStack, { tools: presentation.tools ?? [] }),
|
|
956
|
+
/* @__PURE__ */ jsx4(ToolPreview, { presentation, entry }),
|
|
957
|
+
presentation.fields.length ? /* @__PURE__ */ jsx4("dl", { class: "scui-tool-fields", children: presentation.fields.map((field) => /* @__PURE__ */ jsxs3("div", { children: [
|
|
958
|
+
/* @__PURE__ */ jsx4("dt", { children: field.label }),
|
|
959
|
+
/* @__PURE__ */ jsx4("dd", { children: field.value })
|
|
942
960
|
] }, field.label)) }) : null,
|
|
943
|
-
/* @__PURE__ */
|
|
944
|
-
/* @__PURE__ */
|
|
961
|
+
/* @__PURE__ */ jsx4(ToolActions, { presentation, adapter }),
|
|
962
|
+
/* @__PURE__ */ jsx4(TechnicalDetails, { entry })
|
|
945
963
|
] })
|
|
946
964
|
] });
|
|
947
965
|
}
|
|
948
966
|
function ActivityGroup({ entries, state, adapter }) {
|
|
949
|
-
if (entries.length === 1) return /* @__PURE__ */
|
|
967
|
+
if (entries.length === 1) return /* @__PURE__ */ jsx4("section", { class: "scui-activity", "data-single": "true", children: /* @__PURE__ */ jsx4(ToolRow, { entry: entries[0], workspace: state.workspace, adapter }) });
|
|
950
968
|
const active = entries.some((entry) => entry.status === "pending");
|
|
951
969
|
const [open, setOpen] = useState(active);
|
|
952
970
|
const id = useId();
|
|
953
971
|
useEffect2(() => {
|
|
954
972
|
if (active) setOpen(true);
|
|
955
973
|
}, [active]);
|
|
956
|
-
return /* @__PURE__ */
|
|
957
|
-
/* @__PURE__ */
|
|
958
|
-
/* @__PURE__ */
|
|
959
|
-
/* @__PURE__ */
|
|
960
|
-
/* @__PURE__ */
|
|
961
|
-
/* @__PURE__ */
|
|
974
|
+
return /* @__PURE__ */ jsxs3("section", { class: "scui-activity", children: [
|
|
975
|
+
/* @__PURE__ */ jsxs3("button", { class: "scui-activity-head", type: "button", "aria-expanded": open, "aria-controls": id, onClick: () => setOpen((value) => !value), children: [
|
|
976
|
+
/* @__PURE__ */ jsx4("span", { class: "scui-fold", "data-open": open, children: /* @__PURE__ */ jsx4(UiIcon, { name: "chevron", size: 14 }) }),
|
|
977
|
+
/* @__PURE__ */ jsx4("strong", { children: activitySummary(entries) }),
|
|
978
|
+
/* @__PURE__ */ jsx4("span", { class: "scui-spacer" }),
|
|
979
|
+
/* @__PURE__ */ jsxs3("small", { children: [
|
|
962
980
|
entries.filter((entry) => entry.status !== "pending").length,
|
|
963
981
|
"/",
|
|
964
982
|
entries.length
|
|
965
983
|
] })
|
|
966
984
|
] }),
|
|
967
|
-
open ? /* @__PURE__ */
|
|
985
|
+
open ? /* @__PURE__ */ jsx4("div", { id, children: entries.map((entry) => /* @__PURE__ */ jsx4(ToolRow, { entry, workspace: state.workspace, adapter }, entry.id)) }) : null
|
|
968
986
|
] });
|
|
969
987
|
}
|
|
970
988
|
function TaskPlan({ plan }) {
|
|
971
989
|
if (!plan.items.length) return null;
|
|
972
990
|
const complete = plan.items.filter((item) => item.status === "completed" || item.status === "cancelled").length;
|
|
973
|
-
return /* @__PURE__ */
|
|
974
|
-
/* @__PURE__ */
|
|
975
|
-
/* @__PURE__ */
|
|
976
|
-
/* @__PURE__ */
|
|
991
|
+
return /* @__PURE__ */ jsxs3("details", { class: "scui-plan", children: [
|
|
992
|
+
/* @__PURE__ */ jsxs3("summary", { children: [
|
|
993
|
+
/* @__PURE__ */ jsx4("span", { children: "Plan" }),
|
|
994
|
+
/* @__PURE__ */ jsxs3("small", { children: [
|
|
977
995
|
complete,
|
|
978
996
|
"/",
|
|
979
997
|
plan.items.length
|
|
980
998
|
] })
|
|
981
999
|
] }),
|
|
982
|
-
/* @__PURE__ */
|
|
983
|
-
/* @__PURE__ */
|
|
1000
|
+
/* @__PURE__ */ jsx4("ol", { tabIndex: 0, "aria-label": "Task plan steps", children: plan.items.map((item) => /* @__PURE__ */ jsxs3("li", { "data-status": item.status, children: [
|
|
1001
|
+
/* @__PURE__ */ jsx4("i", { "aria-hidden": "true" }),
|
|
984
1002
|
" ",
|
|
985
|
-
/* @__PURE__ */
|
|
1003
|
+
/* @__PURE__ */ jsx4("span", { children: item.title })
|
|
986
1004
|
] }, item.id)) })
|
|
987
1005
|
] });
|
|
988
1006
|
}
|
|
989
1007
|
function SessionDetails({ semantics }) {
|
|
990
1008
|
if (!semantics.fidelity && !semantics.residueCount && !semantics.parseErrors && !semantics.subagents.length) return null;
|
|
991
|
-
return /* @__PURE__ */
|
|
992
|
-
/* @__PURE__ */
|
|
993
|
-
/* @__PURE__ */
|
|
994
|
-
semantics.fidelity ? /* @__PURE__ */
|
|
995
|
-
/* @__PURE__ */
|
|
996
|
-
/* @__PURE__ */
|
|
1009
|
+
return /* @__PURE__ */ jsxs3("details", { class: "scui-details", children: [
|
|
1010
|
+
/* @__PURE__ */ jsx4("summary", { children: "Session details" }),
|
|
1011
|
+
/* @__PURE__ */ jsxs3("div", { children: [
|
|
1012
|
+
semantics.fidelity ? /* @__PURE__ */ jsxs3("p", { children: [
|
|
1013
|
+
/* @__PURE__ */ jsx4("strong", { children: "Fidelity" }),
|
|
1014
|
+
/* @__PURE__ */ jsx4("span", { children: semantics.fidelity.replaceAll("_", " ") })
|
|
997
1015
|
] }) : null,
|
|
998
|
-
/* @__PURE__ */
|
|
999
|
-
/* @__PURE__ */
|
|
1000
|
-
/* @__PURE__ */
|
|
1016
|
+
/* @__PURE__ */ jsxs3("p", { children: [
|
|
1017
|
+
/* @__PURE__ */ jsx4("strong", { children: "Native records" }),
|
|
1018
|
+
/* @__PURE__ */ jsx4("span", { children: semantics.rawRecords })
|
|
1001
1019
|
] }),
|
|
1002
|
-
semantics.residueCount ? /* @__PURE__ */
|
|
1003
|
-
/* @__PURE__ */
|
|
1004
|
-
/* @__PURE__ */
|
|
1020
|
+
semantics.residueCount ? /* @__PURE__ */ jsxs3("p", { children: [
|
|
1021
|
+
/* @__PURE__ */ jsx4("strong", { children: "Residue" }),
|
|
1022
|
+
/* @__PURE__ */ jsxs3("span", { children: [
|
|
1005
1023
|
semantics.residueCount,
|
|
1006
1024
|
" retained"
|
|
1007
1025
|
] })
|
|
1008
1026
|
] }) : null,
|
|
1009
|
-
semantics.parseErrors ? /* @__PURE__ */
|
|
1010
|
-
/* @__PURE__ */
|
|
1011
|
-
/* @__PURE__ */
|
|
1027
|
+
semantics.parseErrors ? /* @__PURE__ */ jsxs3("p", { children: [
|
|
1028
|
+
/* @__PURE__ */ jsx4("strong", { children: "Parse diagnostics" }),
|
|
1029
|
+
/* @__PURE__ */ jsx4("span", { children: semantics.parseErrors })
|
|
1012
1030
|
] }) : null,
|
|
1013
|
-
semantics.subagents.map((agent) => /* @__PURE__ */
|
|
1014
|
-
/* @__PURE__ */
|
|
1031
|
+
semantics.subagents.map((agent) => /* @__PURE__ */ jsxs3("p", { children: [
|
|
1032
|
+
/* @__PURE__ */ jsxs3("strong", { children: [
|
|
1015
1033
|
agent.source,
|
|
1016
1034
|
" subagent"
|
|
1017
1035
|
] }),
|
|
1018
|
-
/* @__PURE__ */
|
|
1036
|
+
/* @__PURE__ */ jsxs3("span", { children: [
|
|
1019
1037
|
agent.messages,
|
|
1020
1038
|
" messages \xB7 ",
|
|
1021
1039
|
agent.fidelity.replaceAll("_", " ")
|
|
@@ -1034,7 +1052,7 @@ function ConversationAnnouncements({ state }) {
|
|
|
1034
1052
|
}
|
|
1035
1053
|
previousBusy.current = state.busy;
|
|
1036
1054
|
}, [state.busy, state.error, state.harness]);
|
|
1037
|
-
return /* @__PURE__ */
|
|
1055
|
+
return /* @__PURE__ */ jsx4("span", { class: "scui-sr-only", role: "status", "aria-live": "polite", "aria-atomic": "true", children: announcement });
|
|
1038
1056
|
}
|
|
1039
1057
|
function Conversation({ state, adapter, components = {}, slots = {}, memoryKey = state.attached?.key || `${state.harness}:${state.workspace}`, pending = null, unreadAfterMessages = null }) {
|
|
1040
1058
|
const scroller = useRef2(null);
|
|
@@ -1066,65 +1084,72 @@ function Conversation({ state, adapter, components = {}, slots = {}, memoryKey =
|
|
|
1066
1084
|
const element = scroller.current;
|
|
1067
1085
|
if (!element) return;
|
|
1068
1086
|
const anchor = earlierAnchor.current;
|
|
1069
|
-
if (anchor
|
|
1070
|
-
|
|
1071
|
-
|
|
1072
|
-
|
|
1073
|
-
|
|
1087
|
+
if (anchor) {
|
|
1088
|
+
if (state.operation === "loadEarlier") anchor.seenOperation = true;
|
|
1089
|
+
const prepended = state.transcript.length > anchor.entries && state.transcript[0]?.id !== anchor.firstId;
|
|
1090
|
+
if (prepended) {
|
|
1091
|
+
element.scrollTop = anchor.top + (element.scrollHeight - anchor.height);
|
|
1092
|
+
earlierAnchor.current = null;
|
|
1093
|
+
remember({ top: element.scrollTop, atBottom: false });
|
|
1094
|
+
return;
|
|
1095
|
+
}
|
|
1096
|
+
if (state.error || anchor.seenOperation && state.operation !== "loadEarlier") earlierAnchor.current = null;
|
|
1074
1097
|
}
|
|
1075
1098
|
if (!restored.current) {
|
|
1076
1099
|
restored.current = true;
|
|
1077
1100
|
if (remembered.top !== null && !remembered.atBottom) element.scrollTop = remembered.top;
|
|
1078
1101
|
else pin();
|
|
1079
1102
|
} else if (atBottom) pin();
|
|
1080
|
-
}, [memoryKey, state.transcript, state.busy, state.operation, pendingMessage?.text, pendingMessage?.status]);
|
|
1081
|
-
return /* @__PURE__ */
|
|
1082
|
-
/* @__PURE__ */
|
|
1083
|
-
/* @__PURE__ */
|
|
1103
|
+
}, [memoryKey, state.transcript, state.busy, state.operation, state.error, pendingMessage?.text, pendingMessage?.status]);
|
|
1104
|
+
return /* @__PURE__ */ jsxs3("div", { class: "scui-conversation-wrap", children: [
|
|
1105
|
+
/* @__PURE__ */ jsx4(ConversationAnnouncements, { state }),
|
|
1106
|
+
/* @__PURE__ */ jsx4("div", { class: "scui-conversation", ref: scroller, tabIndex: 0, "aria-label": "Conversation", onScroll: (event) => {
|
|
1084
1107
|
const element = event.currentTarget;
|
|
1085
1108
|
const bottom = element.scrollHeight - element.scrollTop - element.clientHeight <= 64;
|
|
1086
1109
|
setAtBottom(bottom);
|
|
1087
1110
|
remember({ top: element.scrollTop, atBottom: bottom });
|
|
1088
|
-
}, children: /* @__PURE__ */
|
|
1089
|
-
Before ? /* @__PURE__ */
|
|
1090
|
-
/* @__PURE__ */
|
|
1091
|
-
/* @__PURE__ */
|
|
1092
|
-
state.history.hasEarlier ? /* @__PURE__ */
|
|
1111
|
+
}, children: /* @__PURE__ */ jsxs3("div", { children: [
|
|
1112
|
+
Before ? /* @__PURE__ */ jsx4(Before, { state, adapter, value: null }) : null,
|
|
1113
|
+
/* @__PURE__ */ jsx4(Plan, { plan: state.taskPlan, value: state.taskPlan, state, adapter }),
|
|
1114
|
+
/* @__PURE__ */ jsx4(SessionDetails, { semantics: state.semantics }),
|
|
1115
|
+
state.history.hasEarlier ? /* @__PURE__ */ jsx4("button", { class: "scui-load", type: "button", disabled: Boolean(state.operation), onClick: () => {
|
|
1093
1116
|
const element = scroller.current;
|
|
1094
|
-
if (element) earlierAnchor.current = { height: element.scrollHeight, top: element.scrollTop, entries: state.transcript.length };
|
|
1117
|
+
if (element) earlierAnchor.current = { height: element.scrollHeight, top: element.scrollTop, entries: state.transcript.length, firstId: state.transcript[0]?.id, seenOperation: false };
|
|
1095
1118
|
setAtBottom(false);
|
|
1096
1119
|
adapter.onIntent({ action: "loadEarlier" });
|
|
1097
1120
|
}, children: "Load earlier messages" }) : null,
|
|
1098
|
-
!blocks.length && state.startup !== "ready" ? /* @__PURE__ */
|
|
1099
|
-
!blocks.length && state.startup === "ready" ? Empty ? /* @__PURE__ */
|
|
1100
|
-
blocks.map((block, index) => /* @__PURE__ */
|
|
1101
|
-
index === unreadBlock ? /* @__PURE__ */
|
|
1102
|
-
block.kind === "activity" ? /* @__PURE__ */
|
|
1121
|
+
!blocks.length && state.startup !== "ready" ? /* @__PURE__ */ jsx4(LoadingStatus, { state }) : null,
|
|
1122
|
+
!blocks.length && state.startup === "ready" ? Empty ? /* @__PURE__ */ jsx4(Empty, { state, adapter, value: null }) : /* @__PURE__ */ jsx4("div", { class: "scui-empty", children: state.error ?? (state.harness ? `${harnessDisplayName(state.harness)} is listening. Say something.` : "No transcript yet.") }) : null,
|
|
1123
|
+
blocks.map((block, index) => /* @__PURE__ */ jsxs3(Fragment2, { children: [
|
|
1124
|
+
index === unreadBlock ? /* @__PURE__ */ jsx4("div", { class: "scui-unread-divider", role: "separator", "aria-label": "New messages", children: /* @__PURE__ */ jsx4("span", { children: "New" }) }) : null,
|
|
1125
|
+
block.kind === "activity" ? /* @__PURE__ */ jsx4(Group, { value: block.entries, entries: block.entries, state, adapter }) : /* @__PURE__ */ jsx4(Entry, { value: block.entry, entry: block.entry, state, adapter })
|
|
1103
1126
|
] }, block.id)),
|
|
1104
|
-
pendingMessage ? /* @__PURE__ */
|
|
1105
|
-
/* @__PURE__ */
|
|
1106
|
-
/* @__PURE__ */
|
|
1107
|
-
|
|
1108
|
-
|
|
1109
|
-
|
|
1110
|
-
|
|
1127
|
+
pendingMessage ? /* @__PURE__ */ jsxs3("article", { class: "scui-message scui-pending", "data-role": "user", "data-status": pendingMessage.status, "aria-label": "Your pending message", children: [
|
|
1128
|
+
/* @__PURE__ */ jsx4(MessageImages, { items: pendingMessage.images }),
|
|
1129
|
+
/* @__PURE__ */ jsx4(Markdown, { value: pendingMessage.text, copyText: adapter?.copyText }),
|
|
1130
|
+
/* @__PURE__ */ jsx4(ContextDisclosure, { context: pendingMessage.context }),
|
|
1131
|
+
/* @__PURE__ */ jsxs3("footer", { children: [
|
|
1132
|
+
/* @__PURE__ */ jsx4("small", { children: pendingMessage.status === "failed" ? "Not sent" : "Sending\u2026" }),
|
|
1133
|
+
pendingMessage.status === "failed" ? /* @__PURE__ */ jsxs3("span", { children: [
|
|
1134
|
+
/* @__PURE__ */ jsx4("button", { type: "button", onClick: pendingMessage.onRetry, children: "Retry" }),
|
|
1135
|
+
/* @__PURE__ */ jsx4("button", { type: "button", onClick: pendingMessage.onEdit, children: "Edit" })
|
|
1111
1136
|
] }) : null
|
|
1112
1137
|
] })
|
|
1113
1138
|
] }) : null,
|
|
1114
|
-
state.busy ? /* @__PURE__ */
|
|
1115
|
-
/* @__PURE__ */
|
|
1116
|
-
/* @__PURE__ */
|
|
1117
|
-
/* @__PURE__ */
|
|
1118
|
-
/* @__PURE__ */
|
|
1119
|
-
/* @__PURE__ */
|
|
1139
|
+
state.busy ? /* @__PURE__ */ jsxs3("div", { class: "scui-working", role: "status", children: [
|
|
1140
|
+
/* @__PURE__ */ jsx4("span", { "aria-hidden": "true", children: "\u2726" }),
|
|
1141
|
+
/* @__PURE__ */ jsx4("i", {}),
|
|
1142
|
+
/* @__PURE__ */ jsx4("i", {}),
|
|
1143
|
+
/* @__PURE__ */ jsx4("i", {}),
|
|
1144
|
+
/* @__PURE__ */ jsxs3("small", { children: [
|
|
1120
1145
|
harnessDisplayName(state.harness),
|
|
1121
1146
|
" is working"
|
|
1122
1147
|
] })
|
|
1123
1148
|
] }) : null,
|
|
1124
|
-
After ? /* @__PURE__ */
|
|
1149
|
+
After ? /* @__PURE__ */ jsx4(After, { state, adapter, value: null }) : null
|
|
1125
1150
|
] }) }),
|
|
1126
|
-
!atBottom ? /* @__PURE__ */
|
|
1127
|
-
/* @__PURE__ */
|
|
1151
|
+
!atBottom ? /* @__PURE__ */ jsxs3("button", { class: "scui-latest", type: "button", onClick: pin, children: [
|
|
1152
|
+
/* @__PURE__ */ jsx4(UiIcon, { name: "down", size: 13 }),
|
|
1128
1153
|
" Latest"
|
|
1129
1154
|
] }) : null
|
|
1130
1155
|
] });
|