@assistant-ui/core 0.2.18 → 0.2.20

package/src/react/primitives/thread/ThreadMessages.tsx

@@ -7,6 +7,7 @@ import {
 } from "react";
 import { RenderChildrenWithAccessor, useAuiState } from "@assistant-ui/store";
 import { MessageByIndexProvider } from "../../providers/MessageByIndexProvider";
+import { MessageByIdProvider } from "../../providers/MessageByIdProvider";
 import type { MessageState } from "../../../store";
 
 type MessagesComponentConfig =
@@ -79,6 +80,20 @@ const isComponentsSame = (
 
 const DEFAULT_SYSTEM_MESSAGE = () => null;
 
+const messageIdSetCache = new WeakMap<
+  readonly MessageState[],
+  ReadonlySet<string>
+>();
+
+const hasMessageId = (messages: readonly MessageState[], messageId: string) => {
+  let ids = messageIdSetCache.get(messages);
+  if (!ids) {
+    ids = new Set(messages.map((m) => m.id));
+    messageIdSetCache.set(messages, ids);
+  }
+  return ids.has(messageId);
+};
+
 const getComponent = (
   components: MessagesComponentConfig,
   role: MessageState["role"],
@@ -170,6 +185,58 @@ export const ThreadPrimitiveMessageByIndex: FC<ThreadPrimitiveMessageByIndex.Pro
 
 ThreadPrimitiveMessageByIndex.displayName = "ThreadPrimitive.MessageByIndex";
 
+export namespace ThreadPrimitiveUnstable_MessageById {
+  export type Props = {
+    messageId: string;
+    components: MessagesComponentConfig;
+  };
+}
+
+/**
+ * Renders the message with the given id in the current thread.
+ *
+ * Unlike {@link ThreadPrimitiveMessageByIndex}, this keys off the message id,
+ * so it stays attached to the same message across reordering and windowing -
+ * the shape needed to drive a virtualized or custom message list together with
+ * `unstable_useThreadMessageIds`. A missing or removed id renders `null` rather
+ * than throwing.
+ *
+ * @deprecated Unstable / Experimental - may change in any release.
+ *
+ * @example
+ * ```tsx
+ * const messageIds = unstable_useThreadMessageIds();
+ * return messageIds.map((messageId) => (
+ *   <ThreadPrimitive.Unstable_MessageById
+ *     key={messageId}
+ *     messageId={messageId}
+ *     components={MESSAGE_COMPONENTS}
+ *   />
+ * ));
+ * ```
+ */
+export const ThreadPrimitiveUnstable_MessageById: FC<ThreadPrimitiveUnstable_MessageById.Props> =
+  memo(
+    ({ messageId, components }) => {
+      const exists = useAuiState((s) =>
+        hasMessageId(s.thread.messages, messageId),
+      );
+      if (!exists) return null;
+
+      return (
+        <MessageByIdProvider id={messageId}>
+          <ThreadMessageComponent components={components} />
+        </MessageByIdProvider>
+      );
+    },
+    (prev, next) =>
+      prev.messageId === next.messageId &&
+      isComponentsSame(prev.components, next.components),
+  );
+
+ThreadPrimitiveUnstable_MessageById.displayName =
+  "ThreadPrimitive.Unstable_MessageById";
+
 const ThreadPrimitiveMessagesInner: FC<{
   children: (value: { message: MessageState }) => ReactNode;
 }> = ({ children }) => {

package/src/react/providers/MessageByIdProvider.tsx

@@ -0,0 +1,23 @@
+import type { FC, PropsWithChildren } from "react";
+import { useAui, AuiProvider, Derived } from "@assistant-ui/store";
+
+export const MessageByIdProvider: FC<
+  PropsWithChildren<{
+    id: string;
+  }>
+> = ({ id, children }) => {
+  const aui = useAui({
+    message: Derived({
+      source: "thread",
+      query: { type: "id", id },
+      get: (aui) => aui.thread().message({ id }),
+    }),
+    composer: Derived({
+      source: "message",
+      query: {},
+      get: (aui) => aui.thread().message({ id }).composer(),
+    }),
+  });
+
+  return <AuiProvider value={aui}>{children}</AuiProvider>;
+};

package/src/react/runtimes/RemoteThreadListThreadListRuntimeCore.tsx

@@ -163,7 +163,10 @@ export class RemoteThreadListThreadListRuntimeCore
     super();
     this.contextProvider = contextProvider;
 
-    this._state.subscribe(() => this._notifySubscribers());
+    this._state.subscribe(() => {
+      this._notifySubscribers();
+      this._notifyThreadIdChange();
+    });
     this._hookManager = new RemoteThreadListHookInstanceManager(
       options.runtimeHook,
       this,
@@ -253,6 +256,22 @@ export class RemoteThreadListThreadListRuntimeCore
     return this._mainThreadId;
   }
 
+  // The settled remote ID of the active thread, or undefined while it is still
+  // a new/optimistic thread. This is the value surfaced to `onThreadIdChange`.
+  private get _mainThreadRemoteId(): string | undefined {
+    if (this._mainThreadId === undefined) return undefined;
+    return getThreadData(this._state.value, this._mainThreadId)?.remoteId;
+  }
+
+  private _lastNotifiedThreadId: string | undefined = undefined;
+
+  private _notifyThreadIdChange() {
+    const threadId = this._mainThreadRemoteId;
+    if (this._lastNotifiedThreadId === threadId) return;
+    this._lastNotifiedThreadId = threadId;
+    this._options.onThreadIdChange?.(threadId);
+  }
+
   public getMainThreadRuntimeCore() {
     const result = this._hookManager.getThreadRuntimeCore(this._mainThreadId);
     if (!result) return EMPTY_THREAD_CORE;
@@ -351,6 +370,7 @@ export class RemoteThreadListThreadListRuntimeCore
     this._mainThreadId = data.id;
 
     this._notifySubscribers();
+    this._notifyThreadIdChange();
   }
 
   public async switchToNewThread(): Promise<void> {

package/src/react/runtimes/createRuntimeExtras.test.ts

@@ -0,0 +1,58 @@
+import { describe, it, expect } from "vitest";
+import type { AssistantClient } from "@assistant-ui/store";
+import { createRuntimeExtras } from "./createRuntimeExtras";
+
+type Extras = { value: number; greet: () => string };
+
+const clientWith = (extras: unknown) =>
+  ({
+    thread: () => ({ getState: () => ({ extras }) }),
+  }) as unknown as AssistantClient;
+
+describe("createRuntimeExtras", () => {
+  it("brands a value so its own guards recognize it", () => {
+    const channel = createRuntimeExtras<Extras>("useTestRuntime");
+    const branded = channel.provide({ value: 1, greet: () => "hi" });
+
+    expect(channel.is(branded)).toBe(true);
+    expect(channel.tryGet(branded)).toBe(branded);
+  });
+
+  it("returns the same object reference from provide (stable identity)", () => {
+    const channel = createRuntimeExtras<Extras>("useTestRuntime");
+    const value = { value: 1, greet: () => "hi" };
+    expect(channel.provide(value)).toBe(value);
+  });
+
+  it("keeps the brand non-enumerable so it stays out of serialization", () => {
+    const channel = createRuntimeExtras<Extras>("useTestRuntime");
+    const branded = channel.provide({ value: 1, greet: () => "hi" });
+
+    expect(Object.keys(branded)).toEqual(["value", "greet"]);
+    expect(JSON.parse(JSON.stringify(branded))).toEqual({ value: 1 });
+  });
+
+  it("rejects unbranded and foreign values", () => {
+    const channel = createRuntimeExtras<Extras>("useTestRuntime");
+    const other = createRuntimeExtras<Extras>("useOtherRuntime");
+    const foreign = other.provide({ value: 2, greet: () => "yo" });
+
+    expect(channel.is(undefined)).toBe(false);
+    expect(channel.is({ value: 1 })).toBe(false);
+    expect(channel.is(foreign)).toBe(false);
+    expect(channel.tryGet(foreign)).toBeUndefined();
+  });
+
+  it("get reads the current snapshot off an AssistantClient", () => {
+    const channel = createRuntimeExtras<Extras>("useTestRuntime");
+    const branded = channel.provide({ value: 7, greet: () => "hi" });
+
+    expect(channel.get(clientWith(branded)).value).toBe(7);
+  });
+
+  it("get throws with the runtime name when the thread is not backed by it", () => {
+    const channel = createRuntimeExtras<Extras>("useTestRuntime");
+
+    expect(() => channel.get(clientWith(undefined))).toThrow("useTestRuntime");
+  });
+});

package/src/react/runtimes/createRuntimeExtras.ts

@@ -0,0 +1,68 @@
+"use client";
+
+import { useAuiState } from "@assistant-ui/store";
+import type { AssistantClient } from "@assistant-ui/store";
+
+/** @deprecated Internal API for external-store adapter authors. Not part of the public API; may change or be removed without notice. */
+export type RuntimeExtras<T extends object> = {
+  provide: (value: T) => T;
+  is: (extras: unknown) => extras is T;
+  tryGet: (extras: unknown) => T | undefined;
+  get: (client: AssistantClient) => T;
+  use: {
+    (): T;
+    <S>(select: (extras: T) => S): S;
+    <S>(select: (extras: T) => S, fallback: S): S;
+  };
+};
+
+/** @deprecated Internal API for external-store adapter authors. Not part of the public API; may change or be removed without notice. */
+export const createRuntimeExtras = <T extends object>(
+  runtimeName: string,
+): RuntimeExtras<T> => {
+  const brand = Symbol(`${runtimeName} extras`);
+
+  const is = (extras: unknown): extras is T =>
+    typeof extras === "object" && extras !== null && brand in extras;
+
+  const assert = (extras: unknown): T => {
+    if (!is(extras))
+      throw new Error(
+        `The current thread is not backed by the ${runtimeName} runtime.`,
+      );
+    return extras;
+  };
+
+  const provide = (value: T): T => {
+    Object.defineProperty(value, brand, {
+      value: true,
+      enumerable: false,
+      configurable: true,
+    });
+    return value;
+  };
+
+  const tryGet = (extras: unknown): T | undefined =>
+    is(extras) ? extras : undefined;
+
+  const get = (client: AssistantClient): T =>
+    assert(client.thread().getState().extras);
+
+  function use<S>(
+    select?: (extras: T) => S,
+    ...rest: [fallback: S] | []
+  ): S | T {
+    // Detect a provided fallback by arity, not value: callers pass an explicit
+    // `undefined` fallback, which must return `undefined` rather than throw.
+    const hasFallback = rest.length > 0;
+    const fallback = rest[0] as S;
+    return useAuiState((s) => {
+      const extras = s.thread.extras;
+      if (is(extras)) return select ? select(extras) : extras;
+      if (hasFallback) return fallback;
+      return assert(extras);
+    });
+  }
+
+  return { provide, is, tryGet, get, use: use as RuntimeExtras<T>["use"] };
+};

package/src/react/runtimes/createRuntimeExtras.use.test.ts

@@ -0,0 +1,50 @@
+import { describe, it, expect, vi } from "vitest";
+
+const { mockUseAuiState } = vi.hoisted(() => ({ mockUseAuiState: vi.fn() }));
+
+vi.mock("@assistant-ui/store", async (importOriginal) => ({
+  ...(await importOriginal<typeof import("@assistant-ui/store")>()),
+  useAuiState: ((selector: (s: unknown) => unknown) =>
+    mockUseAuiState(
+      selector,
+    )) as typeof import("@assistant-ui/store").useAuiState,
+}));
+
+import { createRuntimeExtras } from "./createRuntimeExtras";
+
+type Extras = { value: number };
+
+const against = (extras: unknown) =>
+  mockUseAuiState.mockImplementationOnce((selector: (s: unknown) => unknown) =>
+    selector({ thread: { extras } }),
+  );
+
+describe("createRuntimeExtras.use", () => {
+  const channel = createRuntimeExtras<Extras>("useTestRuntime");
+
+  it("projects the extras when the thread is backed by the runtime", () => {
+    against(channel.provide({ value: 5 }));
+    expect(channel.use((e) => e.value, 0)).toBe(5);
+  });
+
+  it("returns the whole extras when called without a selector", () => {
+    const extras = channel.provide({ value: 9 });
+    against(extras);
+    expect(channel.use()).toBe(extras);
+  });
+
+  it("returns the fallback when the thread is not backed by the runtime", () => {
+    against(undefined);
+    expect(channel.use((e) => e.value, 0)).toBe(0);
+  });
+
+  it("returns an explicit undefined fallback instead of throwing", () => {
+    against(undefined);
+    expect(channel.use((e) => e.value, undefined)).toBeUndefined();
+  });
+
+  it("throws when no fallback is given and the runtime is absent", () => {
+    against(undefined);
+    expect(() => channel.use((e) => e.value)).toThrow("useTestRuntime");
+  });
+});

package/src/react/runtimes/useRemoteThreadListRuntime.ts

@@ -1,4 +1,11 @@
-import { useState, useEffect, useMemo, useRef, useCallback } from "react";
+import {
+  useState,
+  useEffect,
+  useMemo,
+  useRef,
+  useCallback,
+  useEffectEvent,
+} from "react";
 import { BaseAssistantRuntimeCore } from "../../runtime/base/base-assistant-runtime-core";
 import { AssistantRuntimeImpl } from "../../runtime/api/assistant-runtime";
 import type { RemoteThreadListOptions } from "../../runtimes/remote-thread-list/types";
@@ -51,12 +58,17 @@ export const useRemoteThreadListRuntime = (
     return runtimeHookRef.current();
   }, []);
 
+  const onThreadIdChange = useEffectEvent((threadId: string | undefined) => {
+    options.onThreadIdChange?.(threadId);
+  });
+
   const stableOptions = useMemo<RemoteThreadListOptions>(
     () => ({
       adapter: options.adapter,
       allowNesting: options.allowNesting,
       initialThreadId: startThreadIdRef.current,
       runtimeHook: stableRuntimeHook,
+      onThreadIdChange,
     }),
     [options.adapter, options.allowNesting, stableRuntimeHook],
   );

package/src/react/runtimes/useStreamingTiming.ts

@@ -0,0 +1,68 @@
+"use client";
+
+import { useEffect, useRef, useState } from "react";
+import type { MessageTiming } from "../../types/message";
+import {
+  stepStreamingTiming,
+  type StreamingTimingAccessors,
+  type StreamingTimingOptions,
+  type StreamingTimingState,
+} from "../../runtime/utils/streaming-timing";
+
+export type {
+  StreamingTimingAccessors,
+  StreamingTimingOptions,
+  StreamingTimingState,
+};
+
+/**
+ * Tracks per-message streaming timing client-side and returns finalized
+ * `MessageTiming` keyed by message id.
+ *
+ * Observes `isRunning` transitions and content growth through the provided
+ * `accessors`, which adapt the hook to a runtime's message shape. Timing is
+ * finalized when streaming ends; adapters thread the result into
+ * `useExternalMessageConverter` metadata as `messageTiming`.
+ *
+ * @example
+ * ```ts
+ * const messageTiming = useStreamingTiming(messages, isRunning, {
+ *   getAssistantMessageId: (msgs) => msgs.findLast((m) => m.role === "assistant")?.id,
+ *   getTextLength: (msgs, id) => msgs.find((m) => m.id === id)?.content?.length ?? 0,
+ *   getToolCallCount: (msgs, id) => msgs.find((m) => m.id === id)?.tool_calls?.length ?? 0,
+ * });
+ * ```
+ */
+export const useStreamingTiming = <TMessage>(
+  messages: readonly TMessage[],
+  isRunning: boolean,
+  accessors: StreamingTimingAccessors<TMessage>,
+  options?: StreamingTimingOptions,
+): Record<string, MessageTiming> => {
+  const [timings, setTimings] = useState<Record<string, MessageTiming>>({});
+  const stateRef = useRef<StreamingTimingState | null>(null);
+  // Read the latest accessors/options from refs so the effect keeps the
+  // original `[messages, isRunning]` reactivity of the adapter hooks this
+  // replaces (a stable timings object while streaming, a single new reference
+  // at finalize).
+  const accessorsRef = useRef(accessors);
+  accessorsRef.current = accessors;
+  const optionsRef = useRef(options);
+  optionsRef.current = options;
+
+  useEffect(() => {
+    const result = stepStreamingTiming(
+      stateRef.current,
+      messages,
+      isRunning,
+      accessorsRef.current,
+      optionsRef.current,
+    );
+    stateRef.current = result.state;
+    if (Object.keys(result.timings).length > 0) {
+      setTimings((prev) => ({ ...prev, ...result.timings }));
+    }
+  }, [messages, isRunning]);
+
+  return timings;
+};

package/src/react/types/scopes/interactables.ts

@@ -1,66 +1,88 @@
 import type { Tool } from "assistant-stream";
 import type { Unsubscribe } from "../../..";
+import type { ToolCallMessagePartComponent } from "../MessagePartComponentTypes";
 
 /**
  * Schema type matching Tool["parameters"] from assistant-stream.
  * Accepts both StandardSchemaV1 and JSONSchema7.
  */
-export type InteractableStateSchema = NonNullable<
+export type Unstable_InteractableStateSchema = NonNullable<
   Extract<Tool, { parameters: unknown }>["parameters"]
 >;
 
-export type InteractableDefinition = {
+type InteractableScope = "app" | "thread";
+
+export type Unstable_InteractableDefinition = {
   id: string;
   name: string;
   description: string;
-  stateSchema: InteractableStateSchema;
+  stateSchema: Unstable_InteractableStateSchema;
   state: unknown;
-  selected?: boolean | undefined;
+  initialState: unknown;
+  scope?: InteractableScope | undefined;
 };
 
-export type InteractableRegistration = {
+export type Unstable_InteractableRegistration = {
   id: string;
   name: string;
   description: string;
-  stateSchema: InteractableStateSchema;
+  stateSchema: Unstable_InteractableStateSchema;
   initialState: unknown;
-  selected?: boolean | undefined;
+  /**
+   * Component installed as the tool UI for this interactable's `update_{name}`
+   * tool calls, so a model edit re-renders the interactable at the message
+   * that made it. Registered once per name; requires the `tools` scope.
+   */
+  updateRender?: ToolCallMessagePartComponent | undefined;
 };
 
-export type InteractablePersistenceStatus = {
+export type Unstable_InteractablePersistenceStatus = {
   isPending: boolean;
   error: unknown;
 };
 
-export type InteractablesState = {
+export type Unstable_InteractablesState = {
   /** Keyed by instance id */
-  definitions: Record<string, InteractableDefinition>;
+  definitions: Record<string, Unstable_InteractableDefinition>;
   /** Per-id persistence sync status */
-  persistence: Record<string, InteractablePersistenceStatus>;
+  persistence: Record<string, Unstable_InteractablePersistenceStatus>;
 };
 
-export type InteractablePersistedState = Record<
+export type Unstable_InteractablePersistedState = Record<
   string,
   { name: string; state: unknown }
 >;
 
-export type InteractablePersistenceAdapter = {
-  save(state: InteractablePersistedState): void | Promise<void>;
+export type Unstable_InteractablePersistenceAdapter = {
+  save(state: Unstable_InteractablePersistedState): void | Promise<void>;
+  /**
+   * Restores previously saved state. Called when the adapter is attached;
+   * loaded state seeds app-scoped interactables that have not been locally
+   * edited yet (a local edit always wins over a slow load).
+   */
+  load?():
+    | Unstable_InteractablePersistedState
+    | null
+    | undefined
+    | Promise<Unstable_InteractablePersistedState | null | undefined>;
+};
+
+export type Unstable_InteractablesConfig = {
+  persistence?: Unstable_InteractablePersistenceAdapter | undefined;
 };
 
-export type InteractablesMethods = {
-  getState(): InteractablesState;
-  register(def: InteractableRegistration): Unsubscribe;
+export type Unstable_InteractablesMethods = {
+  getState(): Unstable_InteractablesState;
+  register(def: Unstable_InteractableRegistration): Unsubscribe;
   setState(id: string, updater: (prev: unknown) => unknown): void;
-  setSelected(id: string, selected: boolean): void;
-  exportState(): InteractablePersistedState;
-  importState(saved: InteractablePersistedState): void;
+  exportState(): Unstable_InteractablePersistedState;
+  importState(saved: Unstable_InteractablePersistedState): void;
   setPersistenceAdapter(
-    adapter: InteractablePersistenceAdapter | undefined,
+    adapter: Unstable_InteractablePersistenceAdapter | undefined,
   ): void;
   flush(): Promise<void>;
 };
 
-export type InteractablesClientSchema = {
-  methods: InteractablesMethods;
+export type Unstable_InteractablesClientSchema = {
+  methods: Unstable_InteractablesMethods;
 };

package/src/react/types/store-augmentation.ts

@@ -1,11 +1,13 @@
 import type { ToolsClientSchema } from "./scopes/tools";
 import type { DataRenderersClientSchema } from "./scopes/dataRenderers";
-import type { InteractablesClientSchema } from "./scopes/interactables";
+import type { InteractablesClientSchema as LegacyInteractablesClientSchema } from "../interactables-legacy/scopes";
+import type { Unstable_InteractablesClientSchema } from "./scopes/interactables";
 
 declare module "@assistant-ui/store" {
   interface ScopeRegistry {
     tools: ToolsClientSchema;
     dataRenderers: DataRenderersClientSchema;
-    interactables: InteractablesClientSchema;
+    interactables: LegacyInteractablesClientSchema;
+    unstable_interactables: Unstable_InteractablesClientSchema;
   }
 }

package/src/react/utils/useJSONEqual.ts

@@ -0,0 +1,20 @@
+import { useRef } from "react";
+import { isJSONValueEqual } from "../../utils/json/is-json-equal";
+
+/**
+ * Like `useShallow`, but with JSON deep-equality. Use when a selector derives an
+ * equal-but-fresh value on every store update — e.g. folding over
+ * `thread.messages`, whose identity changes on every streaming token — where a
+ * shallow compare would re-render regardless.
+ */
+export function useJSONEqual<S, U>(selector: (state: S) => U): (state: S) => U {
+  const prev = useRef<U | undefined>(undefined);
+  return (state) => {
+    const next = selector(state);
+    if (prev.current !== undefined && isJSONValueEqual(prev.current, next)) {
+      return prev.current;
+    }
+    prev.current = next;
+    return next;
+  };
+}

package/src/runtime/base/base-composer-runtime-core.ts

@@ -41,6 +41,19 @@ export abstract class BaseComposerRuntimeCore
   protected abstract getAttachmentAdapter(): AttachmentAdapter | undefined;
   protected abstract getDictationAdapter(): DictationAdapter | undefined;
 
+  protected enrichWithComposerMetadata<
+    T extends { metadata?: { custom?: Record<string, unknown> } },
+  >(message: T, composerMetadata: Record<string, unknown> | undefined): T {
+    if (!composerMetadata) return message;
+    return {
+      ...message,
+      metadata: {
+        ...message.metadata,
+        custom: { ...message.metadata?.custom, ...composerMetadata },
+      },
+    } as T;
+  }
+
   public get attachmentAccept(): string {
     return this.getAttachmentAdapter()?.accept ?? "*";
   }

package/src/runtime/base/default-edit-composer-runtime-core.ts

@@ -7,6 +7,7 @@ import type { DictationAdapter } from "../../adapters/speech";
 import type { SendOptions } from "../interfaces/composer-runtime-core";
 import type { ThreadRuntimeCore } from "../interfaces/thread-runtime-core";
 import { BaseComposerRuntimeCore } from "./base-composer-runtime-core";
+import { gateInteractableComposerMetadata } from "../../model-context/interactable-composer-metadata";
 
 export class DefaultEditComposerRuntimeCore extends BaseComposerRuntimeCore {
   public get canCancel() {
@@ -97,8 +98,24 @@ export class DefaultEditComposerRuntimeCore extends BaseComposerRuntimeCore {
               ...this._nonTextPassthrough,
             ] as AppendMessage["content"])
           : message.content;
+      // Gate live state against the new branch's prefix (messages up to the
+      // parent): an unchanged interactable re-stamps the prior baseline, an
+      // interactable edited since the original message stamps its newest state.
+      const messages = this.runtime.messages;
+      const parentIndex =
+        this._parentId === null
+          ? -1
+          : messages.findIndex((m) => m.id === this._parentId);
+      const composerMetadata = gateInteractableComposerMetadata(
+        this.runtime.getModelContext().unstable_composerMetadata,
+        messages.slice(0, parentIndex + 1),
+      );
+      const enriched = this.enrichWithComposerMetadata(
+        message,
+        composerMetadata,
+      );
       this.runtime.append({
-        ...message,
+        ...enriched,
         content,
         parentId: this._parentId,
         sourceId: this._sourceId,

package/src/runtime/base/default-thread-composer-runtime-core.ts

@@ -11,6 +11,7 @@ import {
   type QueueItemState,
 } from "../../store/scopes/queue-item";
 import { BaseComposerRuntimeCore } from "./base-composer-runtime-core";
+import { gateInteractableComposerMetadata } from "../../model-context/interactable-composer-metadata";
 
 export class DefaultThreadComposerRuntimeCore
   extends BaseComposerRuntimeCore
@@ -84,8 +85,17 @@ export class DefaultThreadComposerRuntimeCore
     message: Omit<AppendMessage, "parentId" | "sourceId">,
     options?: SendOptions,
   ) {
+    // Merge provider-contributed metadata onto the outgoing user message
+    // (same metadata.custom append path quotes ride). The interactables gate
+    // runs here because it needs thread history, unavailable to the provider.
+    const composerMetadata = gateInteractableComposerMetadata(
+      this.runtime.getModelContext().unstable_composerMetadata,
+      this.runtime.messages,
+    );
+    const enriched = this.enrichWithComposerMetadata(message, composerMetadata);
+
     this.runtime.append({
-      ...(message as AppendMessage),
+      ...(enriched as AppendMessage),
       parentId: this.runtime.messages.at(-1)?.id ?? null,
       sourceId: null,
       startRun: options?.startRun,