anentrypoint-design 0.0.383 → 0.0.385

package/src/components/freddie/shared.js

@@ -0,0 +1,32 @@
+// Shared render helpers used by every freddie page module: the `section`
+// Panel wrapper, the alert/refresh/live-region chrome, and the truncation
+// vocabulary (named widths + the span/JSON renderers that carry the full
+// text in a title tooltip).
+
+import * as webjsx from '../../../vendor/webjsx/index.js';
+import { Panel } from '../content.js';
+import { Btn, Icon } from '../shell.js';
+
+const h = webjsx.createElement;
+
+export const section = (title, ...children) => Panel({ title, children: children.flat().filter(Boolean) });
+export const noteAlert = (note) => note ? h('div', { class: 'ds-alert ds-alert-' + note.kind, role: 'alert' },
+    h('span', { class: 'ds-alert-icon' }, '!'),
+    h('div', { class: 'ds-alert-content' }, note.msg)) : null;
+// Manual refresh button for non-polling pages — parity with auto-refreshing ones.
+export const refreshBtn = (onClick, busy) => Btn({ children: busy ? 'refreshing…' : [Icon('refresh'), ' refresh'], disabled: !!busy, onClick, 'aria-label': 'refresh' });
+// Polite live region announcing async busy/done state to screen readers.
+export const liveRegion = (msg) => h('div', { class: 'fd-sr-live', role: 'status', 'aria-live': 'polite' }, msg || '');
+// Truncate with a title tooltip carrying the full text.
+export const trunc = (s, n = 90) => { const str = String(s || ''); return str.length > n ? { text: str.slice(0, n) + '…', title: str } : { text: str, title: null }; };
+// Named truncation widths so list pages cap display consistently (and any
+// raw .slice(0,N) on user text routes through trunc() for ellipsis + tooltip).
+export const TRUNC_TITLE = 60;   // session/skill/tool titles
+export const TRUNC_SUB = 80;     // row sub-text (prompts, descriptions)
+export const TRUNC_OUTPUT = 70;  // batch output cells
+export const TRUNC_DESC = 90;    // long descriptions
+export const TRUNC_PROMPT = 50;  // batch prompt cells
+// Render trunc() result as a span carrying the full text in its title tooltip.
+export const truncSpan = (s, n) => { const t = trunc(s, n); return h('span', { title: t.title }, t.text); };
+// Cap a raw JSON dump for an inline table cell without losing the data via tooltip.
+export const truncJson = (v, n = TRUNC_TITLE) => truncSpan(JSON.stringify(v), n);

package/src/components/freddie/sse.js

@@ -0,0 +1,85 @@
+// SSE transport for the freddie chat page: a generic POST-friendly
+// Server-Sent-Events frame decoder plus the two payload->AgentChat-part
+// mappers (streaming tool_progress, and the authoritative post-`done`
+// rebuild from freddie's persisted message list).
+
+// Parse a fetch Response body as a Server-Sent-Events frame stream. There is
+// no EventSource-over-POST in browsers (EventSource only does GET, no custom
+// headers/body), so a POST-based SSE consumer has to manually decode the
+// ReadableStream and split on blank-line-terminated `event: X\ndata: Y\n\n`
+// frames. No existing SSE-parsing utility exists elsewhere in this SDK
+// (checked idb-outbox.js and grepped src/ for `text/event-stream`) -- this is
+// the first, generic enough (event name + JSON.parse'd data) to reuse for any
+// future SSE endpoint, not freddie-chat-specific in shape.
+export async function* parseSseStream(response) {
+    const reader = response.body.getReader();
+    const decoder = new TextDecoder();
+    let buf = '';
+    try {
+        for (;;) {
+            const { done, value } = await reader.read();
+            if (done) break;
+            buf += decoder.decode(value, { stream: true });
+            // Frames are separated by a blank line; a frame may itself contain
+            // multiple `field: value` lines (event/data/id/retry) but this
+            // server only ever emits one `event:` + one `data:` line per frame.
+            let sep;
+            while ((sep = buf.indexOf('\n\n')) !== -1) {
+                const frame = buf.slice(0, sep);
+                buf = buf.slice(sep + 2);
+                let event = 'message', dataLines = [];
+                for (const line of frame.split('\n')) {
+                    if (line.startsWith('event:')) event = line.slice(6).trim();
+                    else if (line.startsWith('data:')) dataLines.push(line.slice(5).trim());
+                }
+                if (!dataLines.length) continue;
+                let data;
+                try { data = JSON.parse(dataLines.join('\n')); } catch { data = dataLines.join('\n'); }
+                yield { event, data };
+            }
+        }
+    } finally {
+        try { reader.releaseLock(); } catch { /* swallow: stream already closed/errored */ }
+    }
+}
+
+// Map a freddie tool_progress SSE payload ({name, args, partial}) to an
+// AgentChat tool part. There is no matching id to correlate a later
+// "done" state (freddie's stream has no discrete tool-start/tool-end pair --
+// tool_progress fires zero-or-more times per call while it runs, and the
+// authoritative role:'tool' result only arrives batched in the final
+// `message`/`done` events) so every progress part renders as 'running'; the
+// turn-settle pass below promotes matching parts to 'done'/'error' once the
+// real tool_call_id/content pairs are known.
+export function toolProgressPart(payload) {
+    return { kind: 'tool', name: payload.name || 'tool', args: payload.args || {}, status: 'running' };
+}
+
+// After `done`, freddie's persisted message list is the source of truth:
+// walk it and rebuild the assistant turn's parts as interleaved
+// text/tool/tool_result, replacing the provisional tool_progress-only parts
+// accumulated during streaming. assistant messages with tool_calls become
+// running tool parts (by call id); role:'tool' messages settle the matching
+// part to done/error by tool_call_id.
+export function partsFromMessages(assistantAndToolMessages) {
+    const parts = [];
+    const byId = new Map();
+    for (const m of assistantAndToolMessages) {
+        if (m.role === 'assistant') {
+            if (m.content) parts.push({ kind: 'md', text: m.content });
+            for (const tc of (m.tool_calls || [])) {
+                const part = { kind: 'tool', _id: tc.id, name: tc.name || tc.function?.name || 'tool', args: tc.arguments || tc.function?.arguments || {}, status: 'running' };
+                parts.push(part);
+                if (tc.id) byId.set(tc.id, part);
+            }
+        } else if (m.role === 'tool') {
+            const target = m.tool_call_id ? byId.get(m.tool_call_id) : null;
+            let content = m.content;
+            let isError = false;
+            try { const parsed = JSON.parse(content); if (parsed && parsed.error) { isError = true; } } catch { /* swallow: not JSON, leave as-is */ }
+            if (target) { target.result = content; target.status = isError ? 'error' : 'done'; target.error = isError || undefined; }
+            else parts.push({ kind: 'tool_result', name: 'result', result: content, error: isError || undefined, status: isError ? 'error' : 'done' });
+        }
+    }
+    return parts;
+}