@m6d/cortex-angular 0.1.0 → 0.2.0

package/fesm2022/m6d-cortex-angular.mjs

@@ -44,6 +44,9 @@ function checkAttachmentPolicy(contentType, sizeBytes) {
     return "size";
   return "ok";
 }
+function toUiMessage(message) {
+  return { ...message, role: message.role === "trigger" ? "user" : message.role };
+}
 var CLIENT_TOOL_ANSWERS_KEY = "clientToolAnswers";
 var TIMEZONE_HEADER = "X-Cortex-Timezone";
 
@@ -412,10 +415,6 @@ import {
   EventType
 } from "@tanstack/ai";
 import { fetchServerSentEvents } from "@tanstack/ai-client";
-function toUiMessage(message) {
-  const role = message.role === "trigger" ? "user" : message.role;
-  return { id: message.id, role, parts: message.parts };
-}
 function newestUnsent(messages) {
   for (let index = messages.length - 1;index >= 0; index -= 1) {
     const message = messages[index];
@@ -454,8 +453,22 @@ function clientToolAnswers(tail) {
   });
   return answers.length > 0 ? answers : null;
 }
-function metadataByMessageId(rows) {
-  return new Map(rows.flatMap((row) => row.metadata ? [[row.id, row.metadata]] : []));
+async function* withCommittedTranscript(stream, options, lastSent) {
+  for await (const chunk of stream) {
+    if (chunk.type !== EventType.MESSAGES_SNAPSHOT) {
+      yield chunk;
+      continue;
+    }
+    const local = options.localMessages();
+    const boundary = local.findIndex((message) => message.id === lastSent);
+    const queued = boundary === -1 ? [] : local.slice(boundary + 1).filter((message) => message.role === "user");
+    options.onTranscriptCarried?.(chunk.timestamp ?? Date.now());
+    const merged = {
+      ...chunk,
+      messages: [...chunk.messages, ...queued]
+    };
+    yield merged;
+  }
 }
 function createCortexConnection(options) {
   const { api, thread } = options;
@@ -464,7 +477,8 @@ function createCortexConnection(options) {
   const connect = function(messages, data, abortSignal, runContext) {
     const tail = newestUnsent(messages);
     const answers = clientToolAnswers(tail);
-    return answers ? turn.connect([], { ...data, [CLIENT_TOOL_ANSWERS_KEY]: answers }, abortSignal, runContext) : turn.connect(tail, data, abortSignal, runContext);
+    const stream = answers ? turn.connect([], { ...data, [CLIENT_TOOL_ANSWERS_KEY]: answers }, abortSignal, runContext) : turn.connect(tail, data, abortSignal, runContext);
+    return withCommittedTranscript(stream, options, messages.at(-1)?.id);
   };
   const join = fetchServerSentEvents(() => api.resolveUrl(`/chat/${thread.id}/stream`), requestOptions);
   let replayBase = [];
@@ -476,7 +490,7 @@ function createCortexConnection(options) {
         timestamp: Date.now(),
         messages: replayBase
       };
-      yield* join.joinRun(runId, abortSignal);
+      yield* withCommittedTranscript(join.joinRun(runId, abortSignal), options, replayBase.at(-1)?.id);
     },
     hydrate: async () => {
       const hydration = await hydrateThread(options);
@@ -495,19 +509,18 @@ async function hydrateThread(options) {
   try {
     const rows = await api.listMessages(thread.id);
     const messages = rows.map(toUiMessage);
-    options.onHydrated?.(rows, messages);
+    options.onHydrated?.(messages);
     return { messages, activeRun, interrupts: null };
   } finally {
     options.setLoadingMessages?.(false);
   }
 }
 async function settleTurn(options) {
+  if (options.isStale?.() || options.isStreaming())
+    return;
   try {
     const rows = await options.api.listMessages(options.threadId);
-    if (options.isStale?.())
-      return;
-    options.absorbMetadata(metadataByMessageId(rows));
-    if (options.isStreaming())
+    if (options.isStale?.() || options.isStreaming())
       return;
     const messages = rows.map(toUiMessage);
     options.setMessages(messages);
@@ -2000,23 +2013,16 @@ function localized(value, locale) {
   const byLocale = value;
   return byLocale[locale] ?? byLocale.en ?? Object.values(byLocale)[0];
 }
-// src/internal/client/src/format/relative-time.ts
-var UNITS = [
-  ["year", 31536000000],
-  ["month", 2592000000],
-  ["week", 604800000],
-  ["day", 86400000],
-  ["hour", 3600000],
-  ["minute", 60000],
-  ["second", 1000]
-];
-function relativeTimeLabel(iso, locale, now = Date.now()) {
-  const at = Date.parse(iso);
-  if (Number.isNaN(at))
+// src/internal/client/src/format/time-label.ts
+function timeLabel(iso, locale, now = Date.now()) {
+  const at = new Date(iso);
+  if (Number.isNaN(at.getTime()))
     return "";
-  const elapsed = at - now;
-  const [unit, ms] = UNITS.find(([, size]) => Math.abs(elapsed) >= size) ?? UNITS[UNITS.length - 1];
-  return new Intl.RelativeTimeFormat(locale, { numeric: "auto" }).format(Math.round(elapsed / ms), unit);
+  const isToday = at.toDateString() === new Date(now).toDateString();
+  return new Intl.DateTimeFormat(locale, {
+    ...isToday ? {} : { dateStyle: "medium" },
+    timeStyle: "short"
+  }).format(at);
 }
 // src/internal/client/src/format/save-blob.ts
 function saveBlob(blob, name) {
@@ -2095,6 +2101,8 @@ function createTurnLifecycle(options) {
   let streamDropped = false;
   let wasAborted = false;
   let wasWorking = false;
+  let carriedTranscript = false;
+  let owedSince;
   const dispatched = new Set;
   let adoptedInFlight = 0;
   let adoptedDelivered = false;
@@ -2170,11 +2178,9 @@ function createTurnLifecycle(options) {
     return pending.length > 0;
   }
   async function settle(messages) {
-    if (wasAborted) {
-      wasAborted = false;
-      return;
-    }
-    if (ownsRun) {
+    const aborted = wasAborted;
+    wasAborted = false;
+    if (!aborted && ownsRun) {
       if (dispatchToolCalls(messages()))
         return;
       if (streamDropped)
@@ -2182,14 +2188,29 @@ function createTurnLifecycle(options) {
       else
         options.setRunning(false);
     }
+    if (owedSince === undefined && (carriedTranscript || aborted))
+      return;
+    owedSince = undefined;
     const transcript = await options.refreshMessages();
-    if (ownsRun && transcript)
+    if (!aborted && ownsRun && transcript)
       dispatchToolCalls(transcript);
   }
   return {
     chunkArrived() {
       serverAnswered = true;
     },
+    transcriptCarried(at) {
+      carriedTranscript = true;
+      if (owedSince !== undefined && owedSince <= at)
+        owedSince = undefined;
+    },
+    transcriptUpdated(updatedAt) {
+      if (!wasWorking) {
+        options.refreshMessages();
+        return;
+      }
+      owedSince = Math.max(owedSince ?? 0, Date.parse(updatedAt));
+    },
     streamFailed() {
       streamDropped = true;
       if (serverAnswered)
@@ -2201,6 +2222,7 @@ function createTurnLifecycle(options) {
       if (isLoading) {
         wasWorking = true;
         streamDropped = false;
+        carriedTranscript = false;
         return;
       }
       if (!wasWorking)
@@ -2437,7 +2459,6 @@ var CortexChatService = class CortexChatService2 {
       return false;
     return unansweredToolCalls(chat.messages()).length > 0;
   }, ...ngDevMode ? [{ debugName: "hasPendingToolCalls" }] : []);
-  messageMetadata = signal(/* @__PURE__ */ new Map, ...ngDevMode ? [{ debugName: "messageMetadata" }] : []);
   capabilities = signal(undefined, ...ngDevMode ? [{ debugName: "capabilities" }] : []);
   events = new Subject;
   selectedThreadSnapshot = signal(undefined, ...ngDevMode ? [{ debugName: "selectedThreadSnapshot" }] : []);
@@ -2488,7 +2509,6 @@ var CortexChatService = class CortexChatService2 {
     this.chatInjector = undefined;
     this.lifecycle = undefined;
     this.isLoadingMessages.set(false);
-    this.messageMetadata.set(/* @__PURE__ */ new Map);
     const previousThread = this.selectedThread();
     if (!previousThread && !this.chat())
       return;
@@ -2524,12 +2544,12 @@ var CortexChatService = class CortexChatService2 {
         parts: [{
           type: "text",
           content: prompt
-        }]
+        }],
+        metadata: {
+          createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+          attachments
+        }
       };
-      this.setMetadata(message.id, {
-        createdAt: (/* @__PURE__ */ new Date()).toISOString(),
-        attachments
-      });
       return from(this.chat().append(message));
     }));
   }
@@ -2579,8 +2599,6 @@ var CortexChatService = class CortexChatService2 {
   mountChat(thread, mode) {
     const initialMessages = mode === "reload" ? this.chat()?.messages() : undefined;
     this.chatInjector?.destroy();
-    if (mode !== "reload")
-      this.messageMetadata.set(/* @__PURE__ */ new Map);
     const injector = createEnvironmentInjector([], this.environmentInjector, "cortex-chat");
     this.chatInjector = injector;
     this.selectedThreadSnapshot.set(thread);
@@ -2631,11 +2649,14 @@ var CortexChatService = class CortexChatService2 {
       api: this.api,
       thread,
       mode,
-      onHydrated: (rows, messages) => {
-        if (this.chatInjector !== injector)
-          return;
-        this.absorbMetadata(metadataByMessageId(rows));
-        this.lifecycle?.hydrated(messages, thread.isRunning);
+      localMessages: () => this.chat()?.messages() ?? [],
+      onHydrated: (messages) => {
+        if (this.chatInjector === injector)
+          this.lifecycle?.hydrated(messages, thread.isRunning);
+      },
+      onTranscriptCarried: (at) => {
+        if (this.chatInjector === injector)
+          this.lifecycle?.transcriptCarried(at);
       },
       setLoadingMessages: (loading) => {
         if (this.chatInjector === injector)
@@ -2656,18 +2677,11 @@ var CortexChatService = class CortexChatService2 {
       threadId,
       isStale: () => this.chat() !== chat,
       isStreaming: () => this.isAgentWorking(),
-      absorbMetadata: (fresh) => this.absorbMetadata(fresh),
       setMessages: (messages) => {
         chat.setMessages(messages);
       }
     });
   }
-  absorbMetadata(fresh) {
-    this.messageMetadata.update((previous) => new Map([...previous, ...fresh]));
-  }
-  setMetadata(messageId, metadata) {
-    this.messageMetadata.update((current) => new Map(current).set(messageId, metadata));
-  }
   subscribeToWsEvents() {
     this.wsService.events.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((event) => {
       this.onWsEvent(event);
@@ -2684,7 +2698,8 @@ var CortexChatService = class CortexChatService2 {
           this.reattach(event.payload.thread);
         break;
       case "thread:messages-updated":
-        this.refreshMessages(event.payload.thread.id);
+        if (this.selectedThread()?.id === event.payload.thread.id)
+          this.lifecycle?.transcriptUpdated(event.payload.thread.updatedAt);
     }
   }
   subscribeToWsConnections() {
@@ -3430,7 +3445,7 @@ var ChatLandingComponent = class ChatLandingComponent2 {
     this.chatService.send(suggestion.prompt).subscribe();
   }
   relativeTime(iso) {
-    return relativeTimeLabel(iso, this.locale());
+    return timeLabel(iso, this.locale());
   }
   static ɵfac = i0.ɵɵngDeclareFactory({
     minVersion: "12.0.0",
@@ -8412,7 +8427,6 @@ var MessageBodyComponent = class MessageBodyComponent2 {
   fold = input(...ngDevMode ? [undefined, { debugName: "fold" }] : []);
   openRun = output();
   locale = inject(CORTEX_LOCALE);
-  revealedAt = signal(Date.now(), ...ngDevMode ? [{ debugName: "revealedAt" }] : []);
   isAssistant = computed(() => this.message().role === "assistant", ...ngDevMode ? [{ debugName: "isAssistant" }] : []);
   isUser = computed(() => this.message().role === "user", ...ngDevMode ? [{ debugName: "isUser" }] : []);
   streamingPartIndex = computed(() => this.isStreaming() ? this.parts().length - 1 : -1, ...ngDevMode ? [{ debugName: "streamingPartIndex" }] : []);
@@ -8426,13 +8440,17 @@ var MessageBodyComponent = class MessageBodyComponent2 {
       return;
     return lastTextIndex < parts.length - 1 ? lastTextIndex : -1;
   }, ...ngDevMode ? [{ debugName: "actionsAfterPart" }] : []);
-  sentAgo = computed(() => {
+  keyedParts = computed(() => {
+    const source = this.message().parts;
+    return this.parts().map((part) => ({
+      part,
+      key: source.indexOf(part)
+    }));
+  }, ...ngDevMode ? [{ debugName: "keyedParts" }] : []);
+  sentAt = computed(() => {
     const at = this.createdAt();
-    return at ? relativeTimeLabel(at, this.locale(), this.revealedAt()) : "";
-  }, ...ngDevMode ? [{ debugName: "sentAgo" }] : []);
-  reveal() {
-    this.revealedAt.set(Date.now());
-  }
+    return at ? timeLabel(at, this.locale()) : "";
+  }, ...ngDevMode ? [{ debugName: "sentAt" }] : []);
   foldedSteps(part) {
     const mark = this.fold()?.get(part);
     if (mark?.kind !== "more")
@@ -8444,9 +8462,6 @@ var MessageBodyComponent = class MessageBodyComponent2 {
       key
     };
   }
-  partKey(part) {
-    return this.message().parts.indexOf(part);
-  }
   tokenUsage = computed(() => this.metadata()?.tokenUsage, ...ngDevMode ? [{ debugName: "tokenUsage" }] : []);
   showsDebugZone = computed(() => this.debugMode() && Boolean(this.metadata()) && (Boolean(this.tokenUsage()) || this.isAssistant()), ...ngDevMode ? [{ debugName: "showsDebugZone" }] : []);
   static ɵfac = i0.ɵɵngDeclareFactory({
@@ -8515,15 +8530,10 @@ var MessageBodyComponent = class MessageBodyComponent2 {
       }
     },
     outputs: { openRun: "openRun" },
-    host: {
-      listeners: {
-        mouseenter: "reveal()",
-        focusin: "reveal()"
-      },
-      classAttribute: "cortex-message-parts"
-    },
+    host: { classAttribute: "cortex-message-parts" },
     ngImport: i0,
-    template: `@for (part of parts(); track partKey(part)) {
+    template: `@for (drawn of keyedParts(); track drawn.key) {
+  @let part = drawn.part;
   <cortex-message-part
     [part]="part"
     [message]="message()"
@@ -8565,7 +8575,7 @@ var MessageBodyComponent = class MessageBodyComponent2 {
       <cortex-copy-button [value]="text" />
     }
     @if (createdAt(); as at) {
-      <time class="cortex-message-actions__time" [attr.datetime]="at">{{ sentAgo() }}</time>
+      <time class="cortex-message-actions__time" [attr.datetime]="at">{{ sentAt() }}</time>
     }
   </div>
 </ng-template>
@@ -8666,12 +8676,9 @@ i0.ɵɵngDeclareClassMetadata({
         NgTemplateOutlet,
         TranslatePipe
       ],
-      host: {
-        class: "cortex-message-parts",
-        "(mouseenter)": "reveal()",
-        "(focusin)": "reveal()"
-      },
-      template: `@for (part of parts(); track partKey(part)) {
+      host: { class: "cortex-message-parts" },
+      template: `@for (drawn of keyedParts(); track drawn.key) {
+  @let part = drawn.part;
   <cortex-message-part
     [part]="part"
     [message]="message()"
@@ -8713,7 +8720,7 @@ i0.ɵɵngDeclareClassMetadata({
       <cortex-copy-button [value]="text" />
     }
     @if (createdAt(); as at) {
-      <time class="cortex-message-actions__time" [attr.datetime]="at">{{ sentAgo() }}</time>
+      <time class="cortex-message-actions__time" [attr.datetime]="at">{{ sentAt() }}</time>
     }
   </div>
 </ng-template>
@@ -8799,7 +8806,7 @@ var TriggerBlockComponent = class TriggerBlockComponent2 {
   firing = input.required(...ngDevMode ? [{ debugName: "firing" }] : []);
   debugMode = input(false, ...ngDevMode ? [{ debugName: "debugMode" }] : []);
   locale = inject(CORTEX_LOCALE);
-  firedAgo = computed(() => relativeTimeLabel(this.firing().firedAt, this.locale()), ...ngDevMode ? [{ debugName: "firedAgo" }] : []);
+  firedAgo = computed(() => timeLabel(this.firing().firedAt, this.locale()), ...ngDevMode ? [{ debugName: "firedAgo" }] : []);
   static ɵfac = i0.ɵɵngDeclareFactory({
     minVersion: "12.0.0",
     version: "22.2.0",
@@ -8936,7 +8943,7 @@ var MessageComponent = class MessageComponent2 {
       return false;
     return streamingMessage(this.chatService.messages())?.id === this.message().id;
   }, ...ngDevMode ? [{ debugName: "isStreaming" }] : []);
-  metadata = computed(() => this.chatService.messageMetadata().get(this.message().id), ...ngDevMode ? [{ debugName: "metadata" }] : []);
+  metadata = computed(() => this.message().metadata, ...ngDevMode ? [{ debugName: "metadata" }] : []);
   visibleParts = computed(() => visibleMessageParts(this.message().parts, {
     debugMode: this.debugMode(),
     isStreaming: this.isStreaming(),
@@ -9395,7 +9402,7 @@ var ThreadListComponent = class ThreadListComponent2 {
     return count2 === 1 ? "translate_one_conversation" : "translate_n_conversations";
   }
   relativeTime(iso) {
-    return relativeTimeLabel(iso, this.locale());
+    return timeLabel(iso, this.locale());
   }
   static ɵfac = i0.ɵɵngDeclareFactory({
     minVersion: "12.0.0",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m6d/cortex-angular",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Reusable AI agent chat UI library for Angular",
   "license": "MIT",
   "sideEffects": false,

package/types/m6d-cortex-angular.d.ts

@@ -10,11 +10,6 @@ declare const LOCALES: readonly [
 	"ar"
 ];
 export type Locale = (typeof LOCALES)[number];
-declare const TOOL_SURFACES: readonly [
-	"inline",
-	"modal"
-];
-export type ToolSurface = (typeof TOOL_SURFACES)[number];
 declare const ATTACHMENT_STATUSES: readonly [
 	"pending",
 	"described",
@@ -47,32 +42,6 @@ export type ThreadSummary = {
 		name: string;
 	};
 };
-export type TokenUsage = {
-	input: {
-		noCache: number;
-		cacheRead: number;
-		cacheWrite: number;
-		total: number;
-	};
-	output: {
-		reasoning: number;
-		text: number;
-		total: number;
-	};
-	total: number;
-};
-/**
- * How to launch one client tool: stamped by the server, per tool name, on
- * the metadata of an assistant message that may carry its pending call. Kept in
- * the message so the binding survives server restarts while a run is parked.
- */
-export type ClientToolBinding = {
-	toolId: string;
-	surface: ToolSurface;
-	embedOrigin: string;
-	/** Variables the initiate call's input reads. */
-	variables: string[];
-};
 /**
  * What the server offers this agent's clients, fetched once at widget startup.
  * The widget hides UI for anything absent; enforcement stays server-side.
@@ -86,18 +55,6 @@ export type AgentCapabilities = {
 	/** Headline of the blank-chat landing per locale; "" falls back to the widget's built-in copy. */
 	greeting: Greeting;
 };
-export type MessageMetadata = {
-	/** ISO time the server stored the message; stamped from the row when a transcript is served. */
-	createdAt?: string;
-	modelId?: string;
-	providerMetadata?: unknown;
-	isAborted?: boolean;
-	tokenUsage?: TokenUsage;
-	attachments?: AttachmentSummary[];
-	clientTools?: Record<string, ClientToolBinding>;
-	/** Set on `trigger` messages: the firing that wrote them. */
-	trigger?: TriggerFiringSummary;
-};
 /**
  * One landing-page chip: the widget shows `title` and sends `prompt` as the
  * first message when clicked. The two may be the same text.
@@ -109,12 +66,6 @@ export type Suggestion = {
 /** The runtime contract's `suggestionsSchema` and `greetingSchema` are built from these. */
 export type Suggestions = Record<Locale, Suggestion[]>;
 export type Greeting = Record<Locale, string>;
-export type TriggerFiringSummary = {
-	name: string;
-	firingId: string;
-	firedAt: string;
-	payload: unknown;
-};
 export type CortexHeaders = Record<string, string>;
 /**
  * How the widget reaches its cortex server. `baseUrl` may be a thunk so a host
@@ -287,13 +238,6 @@ declare class CortexChatService {
 	 * only resolves once the continuation turn ends, far too late to gate UI on.
 	 */
 	readonly hasPendingToolCalls: import("@angular/core").Signal<boolean>;
-	/**
-	 * The per-message facts the SDK's `UIMessage` has no room for — usage, model
-	 * id, the aborted flag, attachments. They are cortex's own envelope around the
-	 * stored parts, so they arrive with the persisted transcript rather than over
-	 * the stream, and are merged back in by message id at render time.
-	 */
-	readonly messageMetadata: import("@angular/core").WritableSignal<ReadonlyMap<string, MessageMetadata>>;
 	/** What the server offers this agent's clients; undefined until the handshake answers. */
 	readonly capabilities: import("@angular/core").WritableSignal<AgentCapabilities | undefined>;
 	private readonly events;
@@ -361,13 +305,6 @@ declare class CortexChatService {
 	private createConnection;
 	private refreshMessages;
 	private readBackMessages;
-	/**
-	 * Server rows are merged over what is held, never swapped in: the entry this
-	 * client seeded for a message it just sent must outlive a hydration or
-	 * read-back that started before the send.
-	 */
-	private absorbMetadata;
-	private setMetadata;
 	private subscribeToWsEvents;
 	/**
 	 * Only what these events mean for the open conversation — their list-shaped