@abot-ai/runtime 1.1.0 → 1.2.0

package/dist/src/web-ui/app/lib/web-sources.js

@@ -0,0 +1,177 @@
+import { parseWebSourceUrl } from "./source-url-policy.js";
+
+const MAX_SOURCES_PER_RECEIPT = 25;
+const RETRIEVAL_STATES = new Set(["not_attempted", "retrieved", "failed"]);
+const PRESENTATION_STATES = new Set([
+  "omitted",
+  "reference",
+  "snippet",
+  "content",
+]);
+
+function record(value) {
+  return value && typeof value === "object" && !Array.isArray(value)
+    ? value
+    : null;
+}
+
+function operationForTool(toolName) {
+  if (toolName === "web_search") return "search";
+  if (toolName === "web_fetch") return "fetch";
+  return "";
+}
+
+function sourceTitle(value, hostname) {
+  if (typeof value !== "string" || !value.trim()) return hostname;
+  return value.trim().slice(0, 256);
+}
+
+function normalizeSource(value, legacy = false) {
+  const source = record(value);
+  if (!source) return null;
+  const url = parseWebSourceUrl(source.url);
+  if (!url || !RETRIEVAL_STATES.has(source.retrieval)) return null;
+  const hasKnownPresentation = PRESENTATION_STATES.has(source.presentation);
+  const hasLegacyPresentation = legacy && source.presentation === "unknown";
+  if (!hasKnownPresentation && !hasLegacyPresentation) return null;
+  const hasUnretrievedContent =
+    source.presentation === "content" && source.retrieval !== "retrieved";
+  if (hasUnretrievedContent) return null;
+  if (typeof source.contentTruncated !== "boolean") return null;
+  const requestedUrl = parseWebSourceUrl(source.requestedUrl);
+  return {
+    url: url.href,
+    ...(requestedUrl ? { requestedUrl: requestedUrl.href } : {}),
+    title: sourceTitle(source.title, url.hostname),
+    retrieval: source.retrieval,
+    presentation: source.presentation,
+    contentTruncated: source.contentTruncated,
+  };
+}
+
+function normalizeReceipt(value, toolName, legacy = false) {
+  const receipt = record(value);
+  const operation = operationForTool(toolName);
+  if (!receipt || !operation || receipt.operation !== operation) return null;
+  if (receipt.version !== (legacy ? 0 : 1)) return null;
+  if (!Array.isArray(receipt.sources)) return null;
+  if (receipt.sources.length > MAX_SOURCES_PER_RECEIPT) return null;
+  const omittedSourceCount = legacy ? 0 : receipt.omittedSourceCount;
+  const hasOmittedSourceCount =
+    !legacy && Object.hasOwn(receipt, "omittedSourceCount");
+  if (hasOmittedSourceCount && !Number.isSafeInteger(omittedSourceCount))
+    return null;
+  if (hasOmittedSourceCount && omittedSourceCount < 0) return null;
+  if (
+    hasOmittedSourceCount &&
+    receipt.sources.length + omittedSourceCount > MAX_SOURCES_PER_RECEIPT
+  )
+    return null;
+  const sources = receipt.sources
+    .map((source) => normalizeSource(source, legacy))
+    .filter(Boolean);
+  const provider = ["brave", "light"].includes(receipt.provider)
+    ? receipt.provider
+    : undefined;
+  return {
+    version: receipt.version,
+    operation,
+    ...(provider ? { provider } : {}),
+    ...(omittedSourceCount > 0 ? { omittedSourceCount } : {}),
+    sources,
+  };
+}
+
+export function normalizeWebSources(value, toolName) {
+  return normalizeReceipt(value, toolName);
+}
+
+function normalizedUrlSet(values) {
+  if (!Array.isArray(values)) return new Set();
+  return new Set(
+    values
+      .slice(0, MAX_SOURCES_PER_RECEIPT)
+      .map((value) => parseWebSourceUrl(value)?.href)
+      .filter(Boolean),
+  );
+}
+
+export function normalizeLegacyWebSources(value, toolName) {
+  const meta = record(value);
+  const operation = operationForTool(toolName);
+  if (!meta || !operation || !Array.isArray(meta.urls)) return null;
+  if (meta.urls.length > MAX_SOURCES_PER_RECEIPT) return null;
+  const fetched = normalizedUrlSet(meta.fetchedUrls);
+  const partial = normalizedUrlSet(meta.partialFetchedUrls);
+  const sources = meta.urls.flatMap((value) => {
+    const url = parseWebSourceUrl(value);
+    if (!url) return [];
+    const wasFetched =
+      operation === "fetch" || fetched.has(url.href) || partial.has(url.href);
+    return [
+      {
+        url: url.href,
+        title: url.hostname,
+        retrieval: wasFetched ? "retrieved" : "not_attempted",
+        presentation: "unknown",
+        contentTruncated: false,
+      },
+    ];
+  });
+  return {
+    version: 0,
+    operation,
+    ...(record(meta.lightSearch)?.provider === "light"
+      ? { provider: "light" }
+      : {}),
+    sources,
+  };
+}
+
+function eventReceipt(event) {
+  const toolName = event.tool;
+  if (event.webSources?.version === 0) {
+    return normalizeReceipt(event.webSources, toolName, true);
+  }
+  return normalizeWebSources(event.webSources, toolName);
+}
+
+function replayIdentity(event) {
+  const requestId = typeof event.requestId === "string" ? event.requestId : "";
+  const callId = typeof event.callId === "string" ? event.callId : "";
+  const originalSequence = event.eventSequence;
+  if (Number.isSafeInteger(originalSequence) && originalSequence > 0) {
+    return `${requestId}|${callId}|event:${originalSequence}`;
+  }
+  const transportSequence = event.seqNo ?? event.lastSeqNo;
+  if (Number.isSafeInteger(transportSequence) && transportSequence > 0) {
+    return `${requestId}|${callId}|transport:${transportSequence}`;
+  }
+  return callId ? `${requestId}|${callId}` : "";
+}
+
+export function buildConversationSources(events = []) {
+  if (!Array.isArray(events)) return [];
+  const groups = [];
+  const seen = new Set();
+  for (const value of events) {
+    const event = record(value);
+    if (!event || (event.eventName || event.name) !== "tool.completed")
+      continue;
+    const receipt = eventReceipt(event);
+    if (!receipt) continue;
+    const hasSourceEvidence =
+      receipt.sources.length > 0 || receipt.omittedSourceCount > 0;
+    if (!hasSourceEvidence) continue;
+    const identity = replayIdentity(event);
+    const replayKey = identity ? `${identity}|${JSON.stringify(receipt)}` : "";
+    if (replayKey && seen.has(replayKey)) continue;
+    if (replayKey) seen.add(replayKey);
+    groups.push({
+      ...receipt,
+      id: identity || `source-call-${groups.length + 1}`,
+      callId: typeof event.callId === "string" ? event.callId : "",
+    });
+  }
+  return groups;
+}

package/dist/src/web-ui/app/styles/00-tokens-base.css

@@ -27,7 +27,19 @@
   --font-display:
     "Segoe UI Variable Display", "Segoe UI", Inter, system-ui, sans-serif;
   --font-mono: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
-  --sessions-panel-width: 282px;
+  /* Readable typography shared by every workspace, including mobile. */
+  --font-size-xs: 0.875rem;
+  --font-size-sm: 0.9375rem;
+  --font-size-md: 1rem;
+  --font-size-lg: 1.0625rem;
+  --font-size-xl: 1.125rem;
+  --font-size-2xl: 1.25rem;
+  --font-size-3xl: 1.375rem;
+  --font-size-4xl: 1.5rem;
+  --font-size-5xl: 1.625rem;
+  --font-size-6xl: 1.875rem;
+  --font-size-7xl: 2.25rem;
+  --sessions-panel-width: 320px;
   --chat-content-width: 900px;
   --scrollbar-thumb: rgba(95, 127, 158, 0.34);
   --scrollbar-thumb-active: rgba(118, 157, 194, 0.54);
@@ -56,7 +68,7 @@ body {
     var(--bg);
   color: var(--text);
   font-family: var(--font-ui);
-  font-size: 14px;
+  font-size: var(--font-size-xl);
 }
 
 button,
@@ -72,7 +84,7 @@ textarea {
 
 button {
   min-height: 36px;
-  font-size: 13px;
+  font-size: var(--font-size-lg);
   font-weight: 620;
   transition:
     border-color 150ms ease,

package/dist/src/web-ui/app/styles/10-shell-sessions.css

@@ -40,7 +40,7 @@
   border-radius: 12px;
   background: #2c6ee8;
   color: #fff;
-  font-size: 18px;
+  font-size: var(--font-size-4xl);
   font-weight: 700;
   box-shadow: none;
 }
@@ -125,7 +125,7 @@
   border-radius: 7px;
   background: #142234;
   color: var(--text);
-  font-size: 12px;
+  font-size: var(--font-size-md);
   font-weight: 500;
   white-space: nowrap;
   opacity: 0;
@@ -200,7 +200,7 @@
   color: var(--muted);
   text-overflow: ellipsis;
   white-space: nowrap;
-  font-size: 11px;
+  font-size: var(--font-size-sm);
   font-weight: 550;
 }
 
@@ -322,7 +322,7 @@
   border-radius: 9px;
   background: #2c6ee8;
   color: #fff;
-  font-size: 14px;
+  font-size: var(--font-size-xl);
   font-weight: 700;
   box-shadow: none;
 }
@@ -334,7 +334,7 @@
 #sessionsHeading {
   margin: 0;
   color: var(--text-strong);
-  font-size: 18px;
+  font-size: var(--font-size-4xl);
   font-weight: 400;
   letter-spacing: -0.02em;
 }
@@ -342,7 +342,7 @@
 .brand-row h1 {
   margin: 0;
   color: var(--text-strong);
-  font-size: 15px;
+  font-size: var(--font-size-2xl);
   font-weight: 650;
   letter-spacing: -0.01em;
 }
@@ -350,7 +350,7 @@
 .brand-row p {
   margin: 2px 0 0;
   color: var(--muted-2);
-  font-size: 12px;
+  font-size: var(--font-size-md);
 }
 
 .icon-button,
@@ -393,7 +393,7 @@
   border-radius: 10px;
   background: #2869dc;
   color: #f8fbff;
-  font-size: 13px;
+  font-size: var(--font-size-lg);
   font-weight: 600;
   box-shadow: none;
 }
@@ -420,13 +420,13 @@
 .sessions-heading-row h2 {
   margin: 0;
   color: var(--text);
-  font-size: 13px;
+  font-size: var(--font-size-lg);
   font-weight: 600;
 }
 
 .sessions-list-label {
   color: var(--muted);
-  font-size: 12px;
+  font-size: var(--font-size-md);
   font-weight: 400;
 }
 
@@ -437,7 +437,7 @@
   background: rgba(105, 147, 188, 0.1);
   color: var(--muted);
   text-align: center;
-  font-size: 11px;
+  font-size: var(--font-size-sm);
   font-weight: 400;
 }
 
@@ -465,7 +465,7 @@
   border-radius: 9px;
   background: rgba(92, 132, 172, 0.08);
   color: var(--text);
-  font-size: 13px;
+  font-size: var(--font-size-lg);
   box-shadow: none;
 }
 
@@ -496,12 +496,12 @@
 
 .sidebar-empty-state strong {
   color: var(--text);
-  font-size: 13px;
+  font-size: var(--font-size-lg);
   font-weight: 600;
 }
 
 .sidebar-empty-state span {
-  font-size: 12px;
+  font-size: var(--font-size-md);
   line-height: 1.5;
 }
 
@@ -556,7 +556,7 @@
   padding: 0 30px 0 0;
   border: 0;
   background: transparent;
-  text-align: left;
+  text-align: start;
   box-shadow: none;
 }
 
@@ -577,30 +577,20 @@
   color: var(--text);
   text-overflow: ellipsis;
   white-space: nowrap;
-  font-size: 13px;
+  font-size: var(--font-size-lg);
   font-weight: 400;
 }
 
-.session-preview {
-  display: -webkit-box;
-  overflow: hidden;
-  color: var(--muted-2);
-  font-size: 12px;
-  line-height: 1.4;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
-}
-
 .session-unread-badge {
   display: inline-grid;
   place-items: center;
-  min-width: 18px;
-  height: 18px;
+  min-width: 1.5rem;
+  height: 1.5rem;
   padding: 0 5px;
   border-radius: 999px;
   background: rgba(87, 148, 255, 0.18);
   color: #cfe0ff;
-  font-size: 10px;
+  font-size: var(--font-size-xs);
   font-weight: 650;
 }
 
@@ -630,7 +620,7 @@
   border-radius: 7px;
   background: rgba(10, 23, 37, 0.9);
   color: var(--muted);
-  font-size: 10px;
+  font-size: var(--font-size-xs);
   letter-spacing: -1px;
   box-shadow: none;
 }
@@ -662,7 +652,7 @@
   background: transparent;
   color: var(--text);
   text-align: left;
-  font-size: 12px;
+  font-size: var(--font-size-md);
   box-shadow: none;
 }
 
@@ -700,7 +690,7 @@
   align-items: center;
   gap: 7px;
   color: var(--muted);
-  font-size: 12px;
+  font-size: var(--font-size-md);
   font-weight: 500;
 }
 
@@ -723,7 +713,7 @@
 .field-label,
 .control-label {
   color: var(--muted-2);
-  font-size: 11px;
+  font-size: var(--font-size-sm);
   font-weight: 500;
 }
 
@@ -801,7 +791,7 @@
   border-radius: 6px;
   background: transparent;
   color: var(--muted);
-  font-size: 12px;
+  font-size: var(--font-size-md);
   font-weight: 550;
   text-align: center;
   text-transform: capitalize;

package/dist/src/web-ui/app/styles/12-conversation-sidebar.css

@@ -0,0 +1,93 @@
+/* Persistent conversation navigation; viewport policy lives in workspace-shell. */
+
+.app-shell.sessions-docked {
+  grid-template-columns: 72px var(--sessions-panel-width) minmax(0, 1fr);
+}
+
+.app-shell.sessions-docked .sessions-panel {
+  position: relative;
+  inset: auto;
+  z-index: 2;
+  grid-column: 2;
+  grid-row: 1;
+  width: auto;
+  height: 100%;
+  opacity: 1;
+  pointer-events: auto;
+  transform: none;
+  transition: none;
+  box-shadow: none;
+}
+
+.app-shell.sessions-docked .chat-panel {
+  grid-column: 3;
+}
+
+.session-item {
+  align-items: center;
+  min-height: 38px;
+  margin-block-end: 3px;
+  padding: 7px 9px 7px 12px;
+  border-radius: 8px;
+  background: transparent;
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--line) 35%, transparent);
+}
+
+.session-item:hover,
+.session-item:focus-within {
+  background: var(--control-bg-hover);
+}
+
+.session-item.active,
+.session-item.active:hover,
+.session-item.active:focus-within {
+  background: var(--accent-soft);
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent);
+}
+
+.session-open-button {
+  align-content: center;
+  min-height: 24px;
+  gap: 0;
+  padding: 0;
+  padding-inline-end: 30px;
+  border-radius: 4px;
+}
+
+.session-open-button:focus-visible {
+  outline: 2px solid var(--accent-strong);
+  outline-offset: 3px;
+}
+
+.session-title {
+  font-size: var(--font-size-sm);
+  line-height: 1.4;
+  text-align: start;
+}
+
+.session-item.active .session-title,
+.session-item.unread .session-title {
+  color: var(--text-strong);
+  font-weight: 550;
+}
+
+.session-item.pinned::before {
+  top: 50%;
+  left: auto;
+  inset-inline-start: 4px;
+  transform: translateY(-50%);
+}
+
+.session-actions {
+  top: 6px;
+}
+
+.session-menu-button {
+  background: transparent;
+}
+
+.session-menu-button:hover,
+.session-menu-button:focus-visible {
+  background: var(--control-bg-hover);
+  color: var(--text-strong);
+}