@assistant-ui/react 0.5.75 → 0.5.77

package/dist/index.mjs

@@ -632,13 +632,9 @@ var useActionBarStopSpeaking = () => {
 import { useCallback as useCallback8 } from "react";
 var useActionBarFeedbackPositive = () => {
   const messageRuntime = useMessageRuntime();
-  const messageUtilsStore = useMessageUtilsStore();
   const callback = useCallback8(() => {
-    messageRuntime.submitFeedback({
-      type: "positive"
-    });
-    messageUtilsStore.getState().setSubmittedFeedback("positive");
-  }, [messageUtilsStore, messageRuntime]);
+    messageRuntime.submitFeedback({ type: "positive" });
+  }, [messageRuntime]);
   return callback;
 };
 
@@ -646,13 +642,9 @@ var useActionBarFeedbackPositive = () => {
 import { useCallback as useCallback9 } from "react";
 var useActionBarFeedbackNegative = () => {
   const messageRuntime = useMessageRuntime();
-  const messageUtilsStore = useMessageUtilsStore();
   const callback = useCallback9(() => {
-    messageRuntime.submitFeedback({
-      type: "negative"
-    });
-    messageUtilsStore.getState().setSubmittedFeedback("negative");
-  }, [messageUtilsStore, messageRuntime]);
+    messageRuntime.submitFeedback({ type: "negative" });
+  }, [messageRuntime]);
   return callback;
 };
 
@@ -740,23 +732,21 @@ var useComposerSend = () => {
 import { useCallback as useCallback14 } from "react";
 var useComposerAddAttachment = () => {
   const disabled = useComposer((c) => !c.isEditing);
-  const threadComposerStore = useThreadComposerStore();
-  const threadRuntimeStore = useThreadComposerStore();
+  const composerRuntime = useComposerRuntime();
   const callback = useCallback14(() => {
-    const { addAttachment } = threadComposerStore.getState();
-    const { attachmentAccept } = threadRuntimeStore.getState();
     const input = document.createElement("input");
     input.type = "file";
+    const attachmentAccept = composerRuntime.getAttachmentAccept();
     if (attachmentAccept !== "*") {
       input.accept = attachmentAccept;
     }
     input.onchange = (e) => {
       const file = e.target.files?.[0];
       if (!file) return;
-      addAttachment(file);
+      composerRuntime.addAttachment(file);
     };
     input.click();
-  }, [threadComposerStore, threadRuntimeStore]);
+  }, [composerRuntime]);
   if (disabled) return null;
   return callback;
 };
@@ -803,7 +793,15 @@ var useMessageIf = (props) => {
   const messageUtilsStore = useMessageUtilsStore();
   return useCombinedStore(
     [messageStore, messageUtilsStore],
-    ({ role, attachments, branchCount, isLast, speech }, { isCopied, isHovering, submittedFeedback }) => {
+    ({
+      role,
+      attachments,
+      content,
+      branchCount,
+      isLast,
+      speech,
+      submittedFeedback
+    }, { isCopied, isHovering }) => {
       if (props.hasBranches === true && branchCount < 2) return false;
       if (props.user && role !== "user") return false;
       if (props.assistant && role !== "assistant") return false;
@@ -817,7 +815,9 @@ var useMessageIf = (props) => {
         return false;
       if (props.hasAttachments === false && role === "user" && !!attachments.length)
         return false;
-      if (props.submittedFeedback !== void 0 && submittedFeedback !== props.submittedFeedback)
+      if (props.hasContent === true && content.length === 0) return false;
+      if (props.hasContent === false && content.length > 0) return false;
+      if (props.submittedFeedback !== void 0 && (submittedFeedback?.type ?? null) !== props.submittedFeedback)
         return false;
       return true;
     }
@@ -913,7 +913,7 @@ var useActionBarFloatStatus = ({
       const autohideEnabled = autohide === "always" || autohide === "not-last" && !m.isLast;
       if (!autohideEnabled) return "normal" /* Normal */;
       if (!mu.isHovering) return "hidden" /* Hidden */;
-      if (autohideFloat === "always" || autohideFloat === "single-branch" && m.branches.length <= 1)
+      if (autohideFloat === "always" || autohideFloat === "single-branch" && m.branchCount <= 1)
         return "floating" /* Floating */;
       return "normal" /* Normal */;
     }
@@ -1051,8 +1051,8 @@ import { composeEventHandlers as composeEventHandlers4 } from "@radix-ui/primiti
 import { Primitive as Primitive5 } from "@radix-ui/react-primitive";
 import { jsx as jsx8 } from "react/jsx-runtime";
 var ActionBarPrimitiveFeedbackPositive = forwardRef5(({ onClick, disabled, ...props }, forwardedRef) => {
-  const isSubmitted = useMessageUtils(
-    (u) => u.submittedFeedback === "positive"
+  const isSubmitted = useMessage(
+    (u) => u.submittedFeedback?.type === "positive"
   );
   const callback = useActionBarFeedbackPositive();
   return /* @__PURE__ */ jsx8(
@@ -1077,8 +1077,8 @@ import { composeEventHandlers as composeEventHandlers5 } from "@radix-ui/primiti
 import { Primitive as Primitive6 } from "@radix-ui/react-primitive";
 import { jsx as jsx9 } from "react/jsx-runtime";
 var ActionBarPrimitiveFeedbackNegative = forwardRef6(({ onClick, disabled, ...props }, forwardedRef) => {
-  const isSubmitted = useMessageUtils(
-    (u) => u.submittedFeedback === "negative"
+  const isSubmitted = useMessage(
+    (u) => u.submittedFeedback?.type === "negative"
   );
   const callback = useActionBarFeedbackNegative();
   return /* @__PURE__ */ jsx9(
@@ -1302,9 +1302,9 @@ var { useAttachment: useMessageAttachment } = createContextStoreHook(
 // src/primitives/attachment/AttachmentThumb.tsx
 import { Primitive as Primitive8 } from "@radix-ui/react-primitive";
 import { jsxs } from "react/jsx-runtime";
-var AttachmentPrimitiveThumb = forwardRef11(() => {
+var AttachmentPrimitiveThumb = forwardRef11((props, ref) => {
   const ext = useAttachment((a) => a.name.split(".").pop());
-  return /* @__PURE__ */ jsxs(Primitive8.div, { children: [
+  return /* @__PURE__ */ jsxs(Primitive8.div, { ...props, ref, children: [
     ".",
     ext
   ] });
@@ -1438,9 +1438,9 @@ var useIsHoveringRef = () => {
   );
   return useManagedRef(callbackRef);
 };
-var MessagePrimitiveRoot = forwardRef12((props, forwardRef35) => {
+var MessagePrimitiveRoot = forwardRef12((props, forwardRef36) => {
   const isHoveringRef = useIsHoveringRef();
-  const ref = useComposedRefs(forwardRef35, isHoveringRef);
+  const ref = useComposedRefs(forwardRef36, isHoveringRef);
   return /* @__PURE__ */ jsx18(Primitive9.div, { ...props, ref });
 });
 MessagePrimitiveRoot.displayName = "MessagePrimitive.Root";
@@ -1845,7 +1845,6 @@ var getThreadComposerState = (runtime, focus, onFocus) => {
     isEmpty: runtime?.isEmpty ?? true,
     text: runtime?.text ?? "",
     attachments: runtime?.attachments ?? EMPTY_ARRAY,
-    attachmentAccept: runtime?.attachmentAccept ?? "*",
     value: runtime?.text ?? "",
     setValue: runtime?.setText.bind(runtime) ?? METHOD_NOT_SUPPORTED,
     setText: runtime?.setText.bind(runtime) ?? METHOD_NOT_SUPPORTED,
@@ -1867,7 +1866,6 @@ var getEditComposerState = (runtime, beginEdit) => {
     isEmpty: runtime?.isEmpty ?? true,
     text: runtime?.text ?? "",
     attachments: runtime?.attachments ?? EMPTY_ARRAY,
-    attachmentAccept: runtime?.attachmentAccept ?? "*",
     value: runtime?.text ?? "",
     setValue: runtime?.setText.bind(runtime) ?? METHOD_NOT_SUPPORTED,
     setText: runtime?.setText.bind(runtime) ?? METHOD_NOT_SUPPORTED,
@@ -1904,12 +1902,6 @@ var ComposerRuntimeImpl = class {
   get text() {
     return this.getState().text;
   }
-  /**
-   * @deprecated Use `getState().attachmentAccept` instead. This will be removed in 0.6.0.
-   */
-  get attachmentAccept() {
-    return this.getState().attachmentAccept;
-  }
   /**
    * @deprecated Use `getState().attachments` instead. This will be removed in 0.6.0.
    */
@@ -1964,6 +1956,11 @@ var ComposerRuntimeImpl = class {
   subscribe(callback) {
     return this._core.subscribe(callback);
   }
+  getAttachmentAccept() {
+    const core = this._core.getState();
+    if (!core) throw new Error("Composer is not available");
+    return core.getAttachmentAccept();
+  }
 };
 var ThreadComposerRuntimeImpl = class extends ComposerRuntimeImpl {
   get type() {
@@ -2828,10 +2825,6 @@ var makeMessageUtilsStore = () => create9((set) => {
     isHovering: false,
     setIsHovering: (value) => {
       set({ isHovering: value });
-    },
-    submittedFeedback: null,
-    setSubmittedFeedback: (feedback) => {
-      set({ submittedFeedback: feedback });
     }
   };
 });
@@ -3028,7 +3021,9 @@ __export(internal_exports, {
 var isAttachmentComplete = (a) => a.status.type === "complete";
 var BaseComposerRuntimeCore = class {
   isEditing = true;
-  attachmentAccept = "*";
+  getAttachmentAccept() {
+    return this.getAttachmentAdapter()?.accept ?? "*";
+  }
   _attachments = [];
   set attachments(value) {
     this._attachments = value;
@@ -3054,10 +3049,11 @@ var BaseComposerRuntimeCore = class {
     this.notifySubscribers();
   }
   async send() {
-    const attachments = this._attachmentAdapter ? await Promise.all(
+    const adapter = this.getAttachmentAdapter();
+    const attachments = adapter && this.attachments.length > 0 ? await Promise.all(
       this.attachments.map(async (a) => {
         if (isAttachmentComplete(a)) return a;
-        const result = await this._attachmentAdapter.send(a);
+        const result = await adapter.send(a);
         if (result.status?.type !== "complete") {
           result.status = { type: "complete" };
         }
@@ -3072,19 +3068,10 @@ var BaseComposerRuntimeCore = class {
     this.reset();
     this.handleSend(message);
   }
-  _attachmentAdapter;
-  setAttachmentAdapter(adapter) {
-    this._attachmentAdapter = adapter;
-    const accept = adapter?.accept ?? "*";
-    if (this.attachmentAccept !== accept) {
-      this.attachmentAccept = accept;
-      this.notifySubscribers();
-    }
-  }
   async addAttachment(file) {
-    if (!this._attachmentAdapter)
-      throw new Error("Attachments are not supported");
-    const attachment = await this._attachmentAdapter.add({ file });
+    const adapter = this.getAttachmentAdapter();
+    if (!adapter) throw new Error("Attachments are not supported");
+    const attachment = await adapter.add({ file });
     if (attachment.status === void 0) {
       attachment.status = { type: "requires-action", reason: "composer-send" };
     }
@@ -3092,12 +3079,12 @@ var BaseComposerRuntimeCore = class {
     this.notifySubscribers();
   }
   async removeAttachment(attachmentId) {
-    if (!this._attachmentAdapter)
-      throw new Error("Attachments are not supported");
+    const adapter = this.getAttachmentAdapter();
+    if (!adapter) throw new Error("Attachments are not supported");
     const index = this._attachments.findIndex((a) => a.id === attachmentId);
     if (index === -1) throw new Error("Attachment not found");
     const attachment = this._attachments[index];
-    await this._attachmentAdapter.remove(attachment);
+    await adapter.remove(attachment);
     this._attachments = this._attachments.toSpliced(index, 1);
     this.notifySubscribers();
   }
@@ -3125,6 +3112,9 @@ var DefaultThreadComposerRuntimeCore = class extends BaseComposerRuntimeCore {
   get attachments() {
     return super.attachments;
   }
+  getAttachmentAdapter() {
+    return this.runtime.adapters?.attachments;
+  }
   connect() {
     return this.runtime.subscribe(() => {
       if (this.canCancel !== this.runtime.capabilities.cancel) {
@@ -3503,36 +3493,6 @@ var TooltipIconButton = forwardRef23(({ children, tooltip, side = "bottom", ...r
 });
 TooltipIconButton.displayName = "TooltipIconButton";
 
-// src/api/AssistantRuntime.ts
-var AssistantRuntimeImpl = class {
-  constructor(_core, CustomThreadRuntime) {
-    this._core = _core;
-    this.thread = new CustomThreadRuntime(
-      new NestedSubscriptionSubject({
-        getState: () => this._core.thread,
-        subscribe: (callback) => this._core.subscribe(callback)
-      })
-    );
-  }
-  thread;
-  switchToNewThread() {
-    return this._core.switchToNewThread();
-  }
-  switchToThread(threadId) {
-    return this._core.switchToThread(threadId);
-  }
-  registerModelConfigProvider(provider) {
-    return this._core.registerModelConfigProvider(provider);
-  }
-  // TODO events for thread switching
-  /**
-   * @deprecated Thread is now static and never gets updated. This will be removed in 0.6.0.
-   */
-  subscribe(callback) {
-    return this._core.subscribe(callback);
-  }
-};
-
 // src/api/ThreadRuntime.ts
 var toAppendMessage = (messages2, message) => {
   if (typeof message === "string") {
@@ -3685,6 +3645,9 @@ var ThreadRuntimeImpl = class {
   stopSpeaking() {
     return this._threadBinding.getState().stopSpeaking();
   }
+  getSubmittedFeedback(messageId) {
+    return this._threadBinding.getState().getSubmittedFeedback(messageId);
+  }
   /**
    * @deprecated Use `getMesssageById(id).submitFeedback({ type })` instead. This will be removed in 0.6.0.
    */
@@ -3717,7 +3680,9 @@ var ThreadRuntimeImpl = class {
           const { messages: messages2, speech: speechState } = this.getState();
           const message = messages2[idx];
           if (!message) return SKIP_UPDATE;
-          const branches = this._threadBinding.getState().getBranches(message.id);
+          const thread = this._threadBinding.getState();
+          const branches = thread.getBranches(message.id);
+          const submittedFeedback = thread.getSubmittedFeedback(message.id);
           return {
             ...message,
             message,
@@ -3726,7 +3691,8 @@ var ThreadRuntimeImpl = class {
             branches,
             branchNumber: branches.indexOf(message.id) + 1,
             branchCount: branches.length,
-            speech: speechState?.messageId === message.id ? speechState : null
+            speech: speechState?.messageId === message.id ? speechState : void 0,
+            submittedFeedback
           };
         },
         subscribe: (callback) => this._threadBinding.subscribe(callback)
@@ -3736,6 +3702,47 @@ var ThreadRuntimeImpl = class {
   }
 };
 
+// src/api/AssistantRuntime.ts
+var AssistantRuntimeImpl = class _AssistantRuntimeImpl {
+  constructor(_core, _thread) {
+    this._core = _core;
+    this._thread = _thread;
+  }
+  get thread() {
+    return this._thread;
+  }
+  switchToNewThread() {
+    return this._core.switchToNewThread();
+  }
+  switchToThread(threadId) {
+    return this._core.switchToThread(threadId);
+  }
+  registerModelConfigProvider(provider) {
+    return this._core.registerModelConfigProvider(provider);
+  }
+  // TODO events for thread switching
+  /**
+   * @deprecated Thread is now static and never gets updated. This will be removed in 0.6.0.
+   */
+  subscribe(callback) {
+    return this._core.subscribe(callback);
+  }
+  static createThreadRuntime(_core, CustomThreadRuntime = ThreadRuntimeImpl) {
+    return new CustomThreadRuntime(
+      new NestedSubscriptionSubject({
+        getState: () => _core.thread,
+        subscribe: (callback) => _core.subscribe(callback)
+      })
+    );
+  }
+  static create(_core, CustomThreadRuntime = ThreadRuntimeImpl) {
+    return new _AssistantRuntimeImpl(
+      _core,
+      _AssistantRuntimeImpl.createThreadRuntime(_core, CustomThreadRuntime)
+    );
+  }
+};
+
 // src/runtimes/edge/converters/fromLanguageModelMessages.ts
 var fromLanguageModelMessages = (lm, { mergeSteps }) => {
   const messages2 = [];
@@ -4098,10 +4105,14 @@ var DefaultEditComposerRuntimeCore = class extends BaseComposerRuntimeCore {
     this._nonTextParts = message.content.filter(
       (part) => part.type !== "text" && part.type !== "ui"
     );
+    this.attachments = message.attachments ?? [];
   }
   get canCancel() {
     return true;
   }
+  getAttachmentAdapter() {
+    return this.runtime.adapters?.attachments;
+  }
   _nonTextParts;
   _previousText;
   _parentId;
@@ -4123,10 +4134,107 @@ var DefaultEditComposerRuntimeCore = class extends BaseComposerRuntimeCore {
   }
 };
 
+// src/runtimes/core/BaseThreadRuntimeCore.tsx
+var BaseThreadRuntimeCore = class {
+  constructor(configProvider) {
+    this.configProvider = configProvider;
+  }
+  _subscriptions = /* @__PURE__ */ new Set();
+  repository = new MessageRepository();
+  get messages() {
+    return this.repository.getMessages();
+  }
+  composer = new DefaultThreadComposerRuntimeCore(this);
+  getModelConfig() {
+    return this.configProvider.getModelConfig();
+  }
+  _editComposers = /* @__PURE__ */ new Map();
+  getEditComposer(messageId) {
+    return this._editComposers.get(messageId);
+  }
+  beginEdit(messageId) {
+    if (this._editComposers.has(messageId))
+      throw new Error("Edit already in progress");
+    this._editComposers.set(
+      messageId,
+      new DefaultEditComposerRuntimeCore(
+        this,
+        () => this._editComposers.delete(messageId),
+        this.repository.getMessage(messageId)
+      )
+    );
+    this.notifySubscribers();
+  }
+  getBranches(messageId) {
+    return this.repository.getBranches(messageId);
+  }
+  switchToBranch(branchId) {
+    this.repository.switchToBranch(branchId);
+    this.notifySubscribers();
+  }
+  notifySubscribers() {
+    for (const callback of this._subscriptions) callback();
+  }
+  subscribe(callback) {
+    this._subscriptions.add(callback);
+    return () => this._subscriptions.delete(callback);
+  }
+  _submittedFeedback = {};
+  getSubmittedFeedback(messageId) {
+    return this._submittedFeedback[messageId];
+  }
+  submitFeedback({ messageId, type }) {
+    const adapter = this.adapters?.feedback;
+    if (!adapter) throw new Error("Feedback adapter not configured");
+    const { message } = this.repository.getMessage(messageId);
+    adapter.submit({ message, type });
+    this._submittedFeedback[messageId] = { type };
+    this.notifySubscribers();
+  }
+  _stopSpeaking;
+  speech;
+  speak(messageId) {
+    const adapter = this.adapters?.speech;
+    if (!adapter) throw new Error("Speech adapter not configured");
+    const { message } = this.repository.getMessage(messageId);
+    this._stopSpeaking?.();
+    const utterance = adapter.speak(message);
+    const unsub = utterance.subscribe(() => {
+      if (utterance.status.type === "ended") {
+        this._stopSpeaking = void 0;
+        this.speech = void 0;
+      } else {
+        this.speech = { messageId, status: utterance.status };
+      }
+      this.notifySubscribers();
+    });
+    this.speech = { messageId, status: utterance.status };
+    this.notifySubscribers();
+    this._stopSpeaking = () => {
+      utterance.cancel();
+      unsub();
+      this.speech = void 0;
+      this._stopSpeaking = void 0;
+    };
+  }
+  stopSpeaking() {
+    if (!this._stopSpeaking) throw new Error("No message is being spoken");
+    this._stopSpeaking();
+    this.notifySubscribers();
+  }
+  export() {
+    return this.repository.export();
+  }
+  import(data) {
+    this.repository.import(data);
+    this.notifySubscribers();
+  }
+};
+
 // src/runtimes/local/LocalThreadRuntimeCore.tsx
-var LocalThreadRuntimeCore = class {
+var LocalThreadRuntimeCore = class extends BaseThreadRuntimeCore {
   constructor(configProvider, adapter, { initialMessages, ...options }) {
-    this.configProvider = configProvider;
+    super(configProvider);
     this.adapter = adapter;
     this.threadId = generateId();
     this.options = options;
@@ -4139,28 +4247,22 @@ var LocalThreadRuntimeCore = class {
       }
     }
   }
-  _subscriptions = /* @__PURE__ */ new Set();
-  abortController = null;
-  repository = new MessageRepository();
   capabilities = {
     switchToBranch: true,
     edit: true,
     reload: true,
     cancel: true,
     unstable_copy: true,
-    speak: false,
+    speech: false,
     attachments: false,
     feedback: false
   };
+  abortController = null;
   threadId;
   isDisabled = false;
   suggestions = [];
-  get messages() {
-    return this.repository.getMessages();
-  }
-  composer = new DefaultThreadComposerRuntimeCore(this);
-  getModelConfig() {
-    return this.configProvider.getModelConfig();
+  get adapters() {
+    return this.options.adapters;
   }
   _options;
   get options() {
@@ -4173,11 +4275,10 @@ var LocalThreadRuntimeCore = class {
     this._options = options;
     let hasUpdates = false;
     const canSpeak = options.adapters?.speech !== void 0;
-    if (this.capabilities.speak !== canSpeak) {
-      this.capabilities.speak = canSpeak;
+    if (this.capabilities.speech !== canSpeak) {
+      this.capabilities.speech = canSpeak;
       hasUpdates = true;
     }
-    this.composer.setAttachmentAdapter(options.adapters?.attachments);
     const canAttach = options.adapters?.attachments !== void 0;
     if (this.capabilities.attachments !== canAttach) {
       this.capabilities.attachments = canAttach;
@@ -4190,30 +4291,6 @@ var LocalThreadRuntimeCore = class {
     }
     if (hasUpdates) this.notifySubscribers();
   }
-  _editComposers = /* @__PURE__ */ new Map();
-  getEditComposer(messageId) {
-    return this._editComposers.get(messageId);
-  }
-  beginEdit(messageId) {
-    if (this._editComposers.has(messageId))
-      throw new Error("Edit already in progress");
-    this._editComposers.set(
-      messageId,
-      new DefaultEditComposerRuntimeCore(
-        this,
-        () => this._editComposers.delete(messageId),
-        this.repository.getMessage(messageId)
-      )
-    );
-    this.notifySubscribers();
-  }
-  getBranches(messageId) {
-    return this.repository.getBranches(messageId);
-  }
-  switchToBranch(branchId) {
-    this.repository.switchToBranch(branchId);
-    this.notifySubscribers();
-  }
   async append(message) {
     const newMessage = fromCoreMessage(message, {
       attachments: message.attachments
@@ -4290,7 +4367,7 @@ var LocalThreadRuntimeCore = class {
       const promiseOrGenerator = this.adapter.run({
         messages: messages2,
         abortSignal: this.abortController.signal,
-        config: this.configProvider.getModelConfig(),
+        config: this.getModelConfig(),
         onUpdate: updateMessage
       });
       if (Symbol.asyncIterator in promiseOrGenerator) {
@@ -4322,17 +4399,9 @@ var LocalThreadRuntimeCore = class {
     return message;
   }
   cancelRun() {
-    if (!this.abortController) return;
-    this.abortController.abort();
+    this.abortController?.abort();
     this.abortController = null;
   }
-  notifySubscribers() {
-    for (const callback of this._subscriptions) callback();
-  }
-  subscribe(callback) {
-    this._subscriptions.add(callback);
-    return () => this._subscriptions.delete(callback);
-  }
   addToolResult({
     messageId,
     toolCallId,
@@ -4366,49 +4435,6 @@ var LocalThreadRuntimeCore = class {
       this.performRoundtrip(parentId, message);
     }
   }
-  // TODO speech runtime?
-  _stopSpeaking;
-  speech = null;
-  speak(messageId) {
-    const adapter = this.options.adapters?.speech;
-    if (!adapter) throw new Error("Speech adapter not configured");
-    const { message } = this.repository.getMessage(messageId);
-    this._stopSpeaking?.();
-    const utterance = adapter.speak(message);
-    const unsub = utterance.subscribe(() => {
-      if (utterance.status.type === "ended") {
-        this._stopSpeaking = void 0;
-        this.speech = null;
-      } else {
-        this.speech = { messageId, status: utterance.status };
-      }
-      this.notifySubscribers();
-    });
-    this.speech = { messageId, status: utterance.status };
-    this._stopSpeaking = () => {
-      utterance.cancel();
-      unsub();
-      this.speech = null;
-      this._stopSpeaking = void 0;
-    };
-  }
-  stopSpeaking() {
-    if (!this._stopSpeaking) throw new Error("No message is being spoken");
-    this._stopSpeaking();
-  }
-  submitFeedback({ messageId, type }) {
-    const adapter = this.options.adapters?.feedback;
-    if (!adapter) throw new Error("Feedback adapter not configured");
-    const { message } = this.repository.getMessage(messageId);
-    adapter.submit({ message, type });
-  }
-  export() {
-    return this.repository.export();
-  }
-  import(data) {
-    this.repository.import(data);
-    this.notifySubscribers();
-  }
 };
 
 // src/runtimes/local/LocalRuntimeCore.tsx
@@ -4452,14 +4478,20 @@ var LocalRuntimeCore = class extends BaseAssistantRuntimeCore {
 };
 
 // src/runtimes/local/useLocalRuntime.tsx
-var LocalRuntime = class extends AssistantRuntimeImpl {
-  constructor(core) {
-    super(core, ThreadRuntimeImpl);
+var LocalRuntimeImpl = class _LocalRuntimeImpl extends AssistantRuntimeImpl {
+  constructor(core, thread) {
+    super(core, thread);
     this.core = core;
   }
   reset(options) {
     this.core.reset(options);
   }
+  static create(_core) {
+    return new _LocalRuntimeImpl(
+      _core,
+      AssistantRuntimeImpl.createThreadRuntime(_core, ThreadRuntimeImpl)
+    );
+  }
 };
 var useLocalRuntime = (adapter, options = {}) => {
   const [runtime] = useState11(() => new LocalRuntimeCore(adapter, options));
@@ -4467,7 +4499,7 @@ var useLocalRuntime = (adapter, options = {}) => {
     runtime.thread.adapter = adapter;
     runtime.thread.options = options;
   });
-  return useMemo11(() => new LocalRuntime(runtime), [runtime]);
+  return useMemo11(() => LocalRuntimeImpl.create(runtime), [runtime]);
 };
 
 // src/runtimes/external-store/useExternalStoreRuntime.tsx
@@ -4580,13 +4612,7 @@ var EMPTY_ARRAY2 = Object.freeze([]);
 var hasUpcomingMessage = (isRunning, messages2) => {
   return isRunning && messages2[messages2.length - 1]?.role !== "assistant";
 };
-var ExternalStoreThreadRuntimeCore = class {
-  constructor(configProvider, store) {
-    this.configProvider = configProvider;
-    this.store = store;
-  }
-  _subscriptions = /* @__PURE__ */ new Set();
-  repository = new MessageRepository();
+var ExternalStoreThreadRuntimeCore = class extends BaseThreadRuntimeCore {
   assistantOptimisticId = null;
   _capabilities = {
     switchToBranch: false,
@@ -4594,7 +4620,7 @@ var ExternalStoreThreadRuntimeCore = class {
     reload: false,
     cancel: false,
     unstable_copy: false,
-    speak: false,
+    speech: false,
     attachments: false,
     feedback: false
   };
@@ -4602,29 +4628,26 @@ var ExternalStoreThreadRuntimeCore = class {
     return this._capabilities;
   }
   threadId;
-  messages;
+  _messages;
   isDisabled;
+  get messages() {
+    return this._messages;
+  }
+  get adapters() {
+    return this._store.adapters;
+  }
   suggestions = [];
   extras = void 0;
   _converter = new ThreadMessageConverter();
   _store;
-  composer = new DefaultThreadComposerRuntimeCore(this);
-  _editComposers = /* @__PURE__ */ new Map();
-  getEditComposer(messageId) {
-    return this._editComposers.get(messageId);
-  }
   beginEdit(messageId) {
-    if (this._editComposers.has(messageId))
-      throw new Error("Edit already in progress");
-    this._editComposers.set(
-      messageId,
-      new DefaultEditComposerRuntimeCore(
-        this,
-        () => this._editComposers.delete(messageId),
-        this.repository.getMessage(messageId)
-      )
-    );
-    this.notifySubscribers();
+    if (!this.store.onEdit)
+      throw new Error("Runtime does not support editing.");
+    super.beginEdit(messageId);
+  }
+  constructor(configProvider, store) {
+    super(configProvider);
+    this.store = store;
   }
   get store() {
     return this._store;
@@ -4643,13 +4666,12 @@ var ExternalStoreThreadRuntimeCore = class {
       edit: this._store.onEdit !== void 0,
       reload: this._store.onReload !== void 0,
       cancel: this._store.onCancel !== void 0,
-      speak: this._store.onSpeak !== void 0,
+      speech: this._store.adapters?.speech !== void 0,
       unstable_copy: this._store.unstable_capabilities?.copy !== false,
       // default true
       attachments: !!this.store.adapters?.attachments,
       feedback: !!this.store.adapters?.feedback
     };
-    this.composer.setAttachmentAdapter(this._store.adapters?.attachments);
     if (oldStore) {
       if (oldStore.convertMessage !== store.convertMessage) {
         this._converter = new ThreadMessageConverter();
@@ -4693,18 +4715,9 @@ var ExternalStoreThreadRuntimeCore = class {
     this.repository.resetHead(
       this.assistantOptimisticId ?? messages2.at(-1)?.id ?? null
     );
-    this.messages = this.repository.getMessages();
+    this._messages = this.repository.getMessages();
     this.notifySubscribers();
   }
-  getModelConfig() {
-    return this.configProvider.getModelConfig();
-  }
-  notifySubscribers() {
-    for (const callback of this._subscriptions) callback();
-  }
-  getBranches(messageId) {
-    return this.repository.getBranches(messageId);
-  }
   switchToBranch(branchId) {
     if (!this._store.setMessages)
       throw new Error("Runtime does not support switching branches.");
@@ -4753,60 +4766,11 @@ var ExternalStoreThreadRuntimeCore = class {
       throw new Error("Runtime does not support tool results.");
     this._store.onAddToolResult(options);
   }
-  // TODO speech runtime?
-  _stopSpeaking;
-  speech = null;
-  speak(messageId) {
-    let adapter = this.store.adapters?.speech;
-    if (!adapter && this.store.onSpeak) {
-      adapter = { speak: this.store.onSpeak };
-    }
-    if (!adapter) throw new Error("Speech adapter not configured");
-    const { message } = this.repository.getMessage(messageId);
-    this._stopSpeaking?.();
-    const utterance = adapter.speak(message);
-    const unsub = utterance.subscribe(() => {
-      if (utterance.status.type === "ended") {
-        this._stopSpeaking = void 0;
-        this.speech = null;
-      } else {
-        this.speech = { messageId, status: utterance.status };
-      }
-      this.notifySubscribers();
-    });
-    this.speech = { messageId, status: utterance.status };
-    this._stopSpeaking = () => {
-      utterance.cancel();
-      unsub();
-      this.speech = null;
-      this._stopSpeaking = void 0;
-    };
-  }
-  stopSpeaking() {
-    if (!this._stopSpeaking) throw new Error("No message is being spoken");
-    this._stopSpeaking();
-  }
-  submitFeedback({ messageId, type }) {
-    const adapter = this._store.adapters?.feedback;
-    if (!adapter) throw new Error("Feedback adapter not configured");
-    const { message } = this.repository.getMessage(messageId);
-    adapter.submit({ message, type });
-  }
-  subscribe(callback) {
-    this._subscriptions.add(callback);
-    return () => this._subscriptions.delete(callback);
-  }
   updateMessages = (messages2) => {
     this._store.setMessages?.(
       messages2.flatMap(getExternalStoreMessage).filter((m) => m != null)
     );
   };
-  import(repository) {
-    this.repository.import(repository);
-  }
-  export() {
-    return this.repository.export();
-  }
 };
 
 // src/runtimes/external-store/ExternalStoreRuntimeCore.tsx
@@ -4861,7 +4825,7 @@ var useExternalStoreRuntime = (store) => {
     runtime.thread.store = store;
   });
   return useMemo12(
-    () => new AssistantRuntimeImpl(runtime, ThreadRuntimeImpl),
+    () => AssistantRuntimeImpl.create(runtime, ThreadRuntimeImpl),
     [runtime]
   );
 };
@@ -5281,8 +5245,8 @@ var useAllowCopy = (ensureCapability = false) => {
 };
 var useAllowSpeak = (ensureCapability = false) => {
   const { assistantMessage: { allowSpeak = true } = {} } = useThreadConfig();
-  const speakSupported = useThread((t) => t.capabilities.speak);
-  return allowSpeak && (!ensureCapability || speakSupported);
+  const speechSupported = useThread((t) => t.capabilities.speech);
+  return allowSpeak && (!ensureCapability || speechSupported);
 };
 var useAllowReload = (ensureCapability = false) => {
   const { assistantMessage: { allowReload = true } = {} } = useThreadConfig();
@@ -5598,15 +5562,15 @@ var assistant_message_default = Object.assign(
 );
 
 // src/ui/assistant-modal.tsx
-import { forwardRef as forwardRef34 } from "react";
+import { forwardRef as forwardRef35 } from "react";
 import { BotIcon, ChevronDownIcon } from "lucide-react";
 
 // src/ui/thread.tsx
-import { forwardRef as forwardRef33 } from "react";
+import { forwardRef as forwardRef34 } from "react";
 import { ArrowDownIcon } from "lucide-react";
 
 // src/ui/composer.tsx
-import { forwardRef as forwardRef28 } from "react";
+import { forwardRef as forwardRef29 } from "react";
 import { PaperclipIcon, SendHorizontalIcon } from "lucide-react";
 
 // src/ui/base/CircleStopIcon.tsx
@@ -5626,51 +5590,171 @@ var CircleStopIcon = () => {
 };
 CircleStopIcon.displayName = "CircleStopIcon";
 
-// src/ui/composer-attachment.tsx
-import { forwardRef as forwardRef27 } from "react";
-import { CircleXIcon } from "lucide-react";
+// src/ui/attachment.tsx
+import {
+  forwardRef as forwardRef28,
+  useEffect as useEffect15,
+  useState as useState14
+} from "react";
+import { CircleXIcon, FileIcon } from "lucide-react";
+
+// src/ui/base/dialog.tsx
+import * as React from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import classNames3 from "classnames";
 import { jsx as jsx45, jsxs as jsxs8 } from "react/jsx-runtime";
-var ComposerAttachmentRoot = withDefaults(attachment_exports.Root, {
-  className: "aui-composer-attachment-root"
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogPortal = DialogPrimitive.Portal;
+var DialogOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: classNames3("aui-dialog-overlay", className),
+    ...props
+  }
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var DialogContent = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs8(DialogPortal, { children: [
+  /* @__PURE__ */ jsx45(DialogOverlay, {}),
+  /* @__PURE__ */ jsx45(
+    DialogPrimitive.Content,
+    {
+      ref,
+      className: classNames3("aui-dialog-content", className),
+      ...props,
+      children
+    }
+  )
+] }));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+
+// src/ui/attachment.tsx
+import { AvatarFallback as AvatarFallback2 } from "@radix-ui/react-avatar";
+import { jsx as jsx46, jsxs as jsxs9 } from "react/jsx-runtime";
+var AttachmentRoot = withDefaults(attachment_exports.Root, {
+  className: "aui-attachment-root"
 });
-ComposerAttachmentRoot.displayName = "ComposerAttachmentRoot";
-var ComposerAttachment2 = () => {
-  return /* @__PURE__ */ jsxs8(ComposerAttachmentRoot, { children: [
-    /* @__PURE__ */ jsx45(attachment_exports.unstable_Thumb, {}),
-    /* @__PURE__ */ jsx45(ComposerAttachmentRemove, {})
+AttachmentRoot.displayName = "AttachmentRoot";
+var useFileSrc = (file) => {
+  const [src, setSrc] = useState14(void 0);
+  useEffect15(() => {
+    if (!file) {
+      setSrc(void 0);
+      return;
+    }
+    const objectUrl = URL.createObjectURL(file);
+    setSrc(objectUrl);
+    return () => {
+      URL.revokeObjectURL(objectUrl);
+    };
+  }, [file]);
+  return src;
+};
+var useAttachmentSrc = () => {
+  const { file, src } = useAttachment((a) => {
+    if (a.type !== "image") return {};
+    if (a.file) return { file: a.file };
+    const src2 = a.content?.filter((c) => c.type === "image")[0]?.image;
+    if (!src2) return {};
+    return { src: src2 };
+  });
+  return useFileSrc(file) ?? src;
+};
+var AttachmentPreview = ({ src }) => {
+  const [isLoaded, setIsLoaded] = useState14(false);
+  return (
+    // eslint-disable-next-line @next/next/no-img-element
+    /* @__PURE__ */ jsx46(
+      "img",
+      {
+        src,
+        style: {
+          width: "auto",
+          height: "auto",
+          maxWidth: "75dvh",
+          maxHeight: "75dvh",
+          display: isLoaded ? "block" : "none",
+          overflow: "clip"
+        },
+        onLoad: () => setIsLoaded(true),
+        alt: "Image Preview"
+      }
+    )
+  );
+};
+var AttachmentPreviewDialog = ({ children }) => {
+  const src = useAttachmentSrc();
+  if (!src) return children;
+  return /* @__PURE__ */ jsxs9(Dialog, { children: [
+    /* @__PURE__ */ jsx46(DialogTrigger, { className: "aui-attachment-preview-trigger", asChild: true, children }),
+    /* @__PURE__ */ jsx46(DialogContent, { children: /* @__PURE__ */ jsx46(AttachmentPreview, { src }) })
+  ] });
+};
+var AttachmentThumb = () => {
+  const isImage = useAttachment((a) => a.type === "image");
+  const src = useAttachmentSrc();
+  return /* @__PURE__ */ jsxs9(AvatarRoot, { className: "aui-attachment-thumb", children: [
+    /* @__PURE__ */ jsx46(AvatarFallback2, { delayMs: isImage ? 200 : 0, children: /* @__PURE__ */ jsx46(FileIcon, {}) }),
+    /* @__PURE__ */ jsx46(AvatarImage, { src })
   ] });
 };
-ComposerAttachment2.displayName = "ComposerAttachment";
-var ComposerAttachmentRemove = forwardRef27((props, ref) => {
+var Attachment = () => {
+  const canRemove = useAttachment((a) => a.source !== "message");
+  const typeLabel = useAttachment((a) => {
+    const type = a.type;
+    switch (type) {
+      case "image":
+        return "Image";
+      case "document":
+        return "Document";
+      case "file":
+        return "File";
+      default:
+        const _exhaustiveCheck = type;
+        throw new Error(`Unknown attachment type: ${_exhaustiveCheck}`);
+    }
+  });
+  return /* @__PURE__ */ jsxs9(Tooltip, { children: [
+    /* @__PURE__ */ jsx46(AttachmentPreviewDialog, { children: /* @__PURE__ */ jsx46(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs9(AttachmentRoot, { children: [
+      /* @__PURE__ */ jsx46(AttachmentThumb, {}),
+      /* @__PURE__ */ jsxs9("div", { className: "aui-attachment-text", children: [
+        /* @__PURE__ */ jsx46("p", { className: "aui-attachment-name", children: /* @__PURE__ */ jsx46(attachment_exports.Name, {}) }),
+        /* @__PURE__ */ jsx46("p", { className: "aui-attachment-type", children: typeLabel })
+      ] }),
+      canRemove && /* @__PURE__ */ jsx46(AttachmentRemove, {})
+    ] }) }) }),
+    /* @__PURE__ */ jsx46(TooltipContent, { side: "top", children: /* @__PURE__ */ jsx46(attachment_exports.Name, {}) })
+  ] });
+};
+Attachment.displayName = "Attachment";
+var AttachmentRemove = forwardRef28((props, ref) => {
   const {
     strings: {
       composer: { removeAttachment: { tooltip = "Remove file" } = {} } = {}
     } = {}
   } = useThreadConfig();
-  return /* @__PURE__ */ jsx45(attachment_exports.Remove, { asChild: true, children: /* @__PURE__ */ jsx45(
+  return /* @__PURE__ */ jsx46(attachment_exports.Remove, { asChild: true, children: /* @__PURE__ */ jsx46(
     TooltipIconButton,
     {
       tooltip,
-      className: "aui-composer-attachment-remove",
+      className: "aui-attachment-remove",
       side: "top",
       ...props,
       ref,
-      children: props.children ?? /* @__PURE__ */ jsx45(CircleXIcon, {})
+      children: props.children ?? /* @__PURE__ */ jsx46(CircleXIcon, {})
     }
   ) });
 });
-ComposerAttachmentRemove.displayName = "ComposerAttachmentRemove";
+AttachmentRemove.displayName = "AttachmentRemove";
 var exports5 = {
-  Root: ComposerAttachmentRoot,
-  Remove: ComposerAttachmentRemove
+  Root: AttachmentRoot,
+  Remove: AttachmentRemove
 };
-var composer_attachment_default = Object.assign(
-  ComposerAttachment2,
-  exports5
-);
+var attachment_default = Object.assign(Attachment, exports5);
 
 // src/ui/composer.tsx
-import { Fragment as Fragment6, jsx as jsx46, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx47, jsxs as jsxs10 } from "react/jsx-runtime";
 var useAllowAttachments = (ensureCapability = false) => {
   const { composer: { allowAttachments = true } = {} } = useThreadConfig();
   const attachmentsSupported = useThread((t) => t.capabilities.attachments);
@@ -5678,11 +5762,11 @@ var useAllowAttachments = (ensureCapability = false) => {
 };
 var Composer = () => {
   const allowAttachments = useAllowAttachments(true);
-  return /* @__PURE__ */ jsxs9(ComposerRoot, { children: [
-    allowAttachments && /* @__PURE__ */ jsx46(ComposerAttachments, {}),
-    allowAttachments && /* @__PURE__ */ jsx46(ComposerAddAttachment, {}),
-    /* @__PURE__ */ jsx46(ComposerInput, { autoFocus: true }),
-    /* @__PURE__ */ jsx46(ComposerAction, {})
+  return /* @__PURE__ */ jsxs10(ComposerRoot, { children: [
+    allowAttachments && /* @__PURE__ */ jsx47(ComposerAttachments, {}),
+    allowAttachments && /* @__PURE__ */ jsx47(ComposerAddAttachment, {}),
+    /* @__PURE__ */ jsx47(ComposerInput, { autoFocus: true }),
+    /* @__PURE__ */ jsx47(ComposerAction, {})
   ] });
 };
 Composer.displayName = "Composer";
@@ -5695,14 +5779,14 @@ var ComposerInputStyled = withDefaults(composer_exports.Input, {
   autoFocus: true,
   className: "aui-composer-input"
 });
-var ComposerInput = forwardRef28(
+var ComposerInput = forwardRef29(
   (props, ref) => {
     const {
       strings: {
         composer: { input: { placeholder = "Write a message..." } = {} } = {}
       } = {}
     } = useThreadConfig();
-    return /* @__PURE__ */ jsx46(ComposerInputStyled, { placeholder, ...props, ref });
+    return /* @__PURE__ */ jsx47(ComposerInputStyled, { placeholder, ...props, ref });
   }
 );
 ComposerInput.displayName = "ComposerInput";
@@ -5710,12 +5794,12 @@ var ComposerAttachmentsContainer = withDefaults("div", {
   className: "aui-composer-attachments"
 });
 var ComposerAttachments = ({ components }) => {
-  return /* @__PURE__ */ jsx46(ComposerAttachmentsContainer, { children: /* @__PURE__ */ jsx46(
+  return /* @__PURE__ */ jsx47(ComposerAttachmentsContainer, { children: /* @__PURE__ */ jsx47(
     composer_exports.Attachments,
     {
       components: {
         ...components,
-        Attachment: components?.Attachment ?? composer_attachment_default
+        Attachment: components?.Attachment ?? attachment_default
       }
     }
   ) });
@@ -5724,21 +5808,21 @@ var ComposerAttachButton = withDefaults(TooltipIconButton, {
   variant: "default",
   className: "aui-composer-attach"
 });
-var ComposerAddAttachment = forwardRef28((props, ref) => {
+var ComposerAddAttachment = forwardRef29((props, ref) => {
   const {
     strings: {
       composer: { addAttachment: { tooltip = "Attach file" } = {} } = {}
     } = {}
   } = useThreadConfig();
   const allowAttachments = useAllowAttachments();
-  return /* @__PURE__ */ jsx46(composer_exports.AddAttachment, { disabled: !allowAttachments, asChild: true, children: /* @__PURE__ */ jsx46(
+  return /* @__PURE__ */ jsx47(composer_exports.AddAttachment, { disabled: !allowAttachments, asChild: true, children: /* @__PURE__ */ jsx47(
     ComposerAttachButton,
     {
       tooltip,
       variant: "ghost",
       ...props,
       ref,
-      children: props.children ?? /* @__PURE__ */ jsx46(PaperclipIcon, {})
+      children: props.children ?? /* @__PURE__ */ jsx47(PaperclipIcon, {})
     }
   ) });
 });
@@ -5749,10 +5833,10 @@ var useAllowCancel = () => {
 };
 var ComposerAction = () => {
   const allowCancel = useAllowCancel();
-  if (!allowCancel) return /* @__PURE__ */ jsx46(ComposerSend, {});
-  return /* @__PURE__ */ jsxs9(Fragment6, { children: [
-    /* @__PURE__ */ jsx46(thread_exports.If, { running: false, children: /* @__PURE__ */ jsx46(ComposerSend, {}) }),
-    /* @__PURE__ */ jsx46(thread_exports.If, { running: true, children: /* @__PURE__ */ jsx46(ComposerCancel, {}) })
+  if (!allowCancel) return /* @__PURE__ */ jsx47(ComposerSend, {});
+  return /* @__PURE__ */ jsxs10(Fragment6, { children: [
+    /* @__PURE__ */ jsx47(thread_exports.If, { running: false, children: /* @__PURE__ */ jsx47(ComposerSend, {}) }),
+    /* @__PURE__ */ jsx47(thread_exports.If, { running: true, children: /* @__PURE__ */ jsx47(ComposerCancel, {}) })
   ] });
 };
 ComposerAction.displayName = "ComposerAction";
@@ -5760,12 +5844,12 @@ var ComposerSendButton = withDefaults(TooltipIconButton, {
   variant: "default",
   className: "aui-composer-send"
 });
-var ComposerSend = forwardRef28(
+var ComposerSend = forwardRef29(
   (props, ref) => {
     const {
       strings: { composer: { send: { tooltip = "Send" } = {} } = {} } = {}
     } = useThreadConfig();
-    return /* @__PURE__ */ jsx46(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ jsx46(ComposerSendButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx46(SendHorizontalIcon, {}) }) });
+    return /* @__PURE__ */ jsx47(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ jsx47(ComposerSendButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx47(SendHorizontalIcon, {}) }) });
   }
 );
 ComposerSend.displayName = "ComposerSend";
@@ -5773,12 +5857,12 @@ var ComposerCancelButton = withDefaults(TooltipIconButton, {
   variant: "default",
   className: "aui-composer-cancel"
 });
-var ComposerCancel = forwardRef28(
+var ComposerCancel = forwardRef29(
   (props, ref) => {
     const {
       strings: { composer: { cancel: { tooltip = "Cancel" } = {} } = {} } = {}
     } = useThreadConfig();
-    return /* @__PURE__ */ jsx46(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ jsx46(ComposerCancelButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx46(CircleStopIcon, {}) }) });
+    return /* @__PURE__ */ jsx47(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ jsx47(ComposerCancelButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx47(CircleStopIcon, {}) }) });
   }
 );
 ComposerCancel.displayName = "ComposerCancel";
@@ -5794,15 +5878,15 @@ var exports6 = {
 var composer_default = Object.assign(Composer, exports6);
 
 // src/ui/thread-welcome.tsx
-import { forwardRef as forwardRef29 } from "react";
-import { jsx as jsx47, jsxs as jsxs10 } from "react/jsx-runtime";
+import { forwardRef as forwardRef30 } from "react";
+import { jsx as jsx48, jsxs as jsxs11 } from "react/jsx-runtime";
 var ThreadWelcome = () => {
-  return /* @__PURE__ */ jsxs10(ThreadWelcomeRoot, { children: [
-    /* @__PURE__ */ jsxs10(ThreadWelcomeCenter, { children: [
-      /* @__PURE__ */ jsx47(ThreadWelcomeAvatar, {}),
-      /* @__PURE__ */ jsx47(ThreadWelcomeMessage, {})
+  return /* @__PURE__ */ jsxs11(ThreadWelcomeRoot, { children: [
+    /* @__PURE__ */ jsxs11(ThreadWelcomeCenter, { children: [
+      /* @__PURE__ */ jsx48(ThreadWelcomeAvatar, {}),
+      /* @__PURE__ */ jsx48(ThreadWelcomeMessage, {})
     ] }),
-    /* @__PURE__ */ jsx47(ThreadWelcomeSuggestions, {})
+    /* @__PURE__ */ jsx48(ThreadWelcomeSuggestions, {})
   ] });
 };
 ThreadWelcome.displayName = "ThreadWelcome";
@@ -5812,20 +5896,20 @@ var ThreadWelcomeRootStyled = withDefaults("div", {
 var ThreadWelcomeCenter = withDefaults("div", {
   className: "aui-thread-welcome-center"
 });
-var ThreadWelcomeRoot = forwardRef29((props, ref) => {
-  return /* @__PURE__ */ jsx47(thread_exports.Empty, { children: /* @__PURE__ */ jsx47(ThreadWelcomeRootStyled, { ...props, ref }) });
+var ThreadWelcomeRoot = forwardRef30((props, ref) => {
+  return /* @__PURE__ */ jsx48(thread_exports.Empty, { children: /* @__PURE__ */ jsx48(ThreadWelcomeRootStyled, { ...props, ref }) });
 });
 ThreadWelcomeRoot.displayName = "ThreadWelcomeRoot";
 var ThreadWelcomeAvatar = () => {
   const { assistantAvatar: avatar = { fallback: "A" } } = useThreadConfig();
-  return /* @__PURE__ */ jsx47(Avatar, { ...avatar });
+  return /* @__PURE__ */ jsx48(Avatar, { ...avatar });
 };
 var ThreadWelcomeMessageStyled = withDefaults("p", {
   className: "aui-thread-welcome-message"
 });
-var ThreadWelcomeMessage = forwardRef29(({ message: messageProp, ...rest }, ref) => {
+var ThreadWelcomeMessage = forwardRef30(({ message: messageProp, ...rest }, ref) => {
   const { welcome: { message = "How can I help you today?" } = {} } = useThreadConfig();
-  return /* @__PURE__ */ jsx47(ThreadWelcomeMessageStyled, { ...rest, ref, children: messageProp ?? message });
+  return /* @__PURE__ */ jsx48(ThreadWelcomeMessageStyled, { ...rest, ref, children: messageProp ?? message });
 });
 ThreadWelcomeMessage.displayName = "ThreadWelcomeMessage";
 var ThreadWelcomeSuggestionContainer = withDefaults("div", {
@@ -5837,15 +5921,15 @@ var ThreadWelcomeSuggestionStyled = withDefaults(thread_exports.Suggestion, {
 var ThreadWelcomeSuggestion = ({
   suggestion: { text, prompt }
 }) => {
-  return /* @__PURE__ */ jsx47(ThreadWelcomeSuggestionStyled, { prompt, method: "replace", autoSend: true, children: /* @__PURE__ */ jsx47("span", { className: "aui-thread-welcome-suggestion-text", children: text ?? prompt }) });
+  return /* @__PURE__ */ jsx48(ThreadWelcomeSuggestionStyled, { prompt, method: "replace", autoSend: true, children: /* @__PURE__ */ jsx48("span", { className: "aui-thread-welcome-suggestion-text", children: text ?? prompt }) });
 };
 var ThreadWelcomeSuggestions = () => {
   const suggestions2 = useThread((t) => t.suggestions);
   const { welcome: { suggestions } = {} } = useThreadConfig();
   const finalSuggestions = suggestions2.length ? suggestions2 : suggestions;
-  return /* @__PURE__ */ jsx47(ThreadWelcomeSuggestionContainer, { children: finalSuggestions?.map((suggestion, idx) => {
+  return /* @__PURE__ */ jsx48(ThreadWelcomeSuggestionContainer, { children: finalSuggestions?.map((suggestion, idx) => {
     const key = `${suggestion.prompt}-${idx}`;
-    return /* @__PURE__ */ jsx47(ThreadWelcomeSuggestion, { suggestion }, key);
+    return /* @__PURE__ */ jsx48(ThreadWelcomeSuggestion, { suggestion }, key);
   }) });
 };
 ThreadWelcomeSuggestions.displayName = "ThreadWelcomeSuggestions";
@@ -5860,12 +5944,12 @@ var exports7 = {
 var thread_welcome_default = Object.assign(ThreadWelcome, exports7);
 
 // src/ui/user-message.tsx
-import { forwardRef as forwardRef31 } from "react";
+import { forwardRef as forwardRef32 } from "react";
 
 // src/ui/user-action-bar.tsx
-import { forwardRef as forwardRef30 } from "react";
+import { forwardRef as forwardRef31 } from "react";
 import { PencilIcon } from "lucide-react";
-import { jsx as jsx48 } from "react/jsx-runtime";
+import { jsx as jsx49 } from "react/jsx-runtime";
 var useAllowEdit = (ensureCapability = false) => {
   const { userMessage: { allowEdit = true } = {} } = useThreadConfig();
   const editSupported = useThread((t) => t.capabilities.edit);
@@ -5874,19 +5958,19 @@ var useAllowEdit = (ensureCapability = false) => {
 var UserActionBar = () => {
   const allowEdit = useAllowEdit(true);
   if (!allowEdit) return null;
-  return /* @__PURE__ */ jsx48(UserActionBarRoot, { hideWhenRunning: true, autohide: "not-last", children: /* @__PURE__ */ jsx48(UserActionBarEdit, {}) });
+  return /* @__PURE__ */ jsx49(UserActionBarRoot, { hideWhenRunning: true, autohide: "not-last", children: /* @__PURE__ */ jsx49(UserActionBarEdit, {}) });
 };
 UserActionBar.displayName = "UserActionBar";
 var UserActionBarRoot = withDefaults(actionBar_exports.Root, {
   className: "aui-user-action-bar-root"
 });
 UserActionBarRoot.displayName = "UserActionBarRoot";
-var UserActionBarEdit = forwardRef30((props, ref) => {
+var UserActionBarEdit = forwardRef31((props, ref) => {
   const {
     strings: { userMessage: { edit: { tooltip = "Edit" } = {} } = {} } = {}
   } = useThreadConfig();
   const allowEdit = useAllowEdit();
-  return /* @__PURE__ */ jsx48(actionBar_exports.Edit, { disabled: !allowEdit, asChild: true, children: /* @__PURE__ */ jsx48(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx48(PencilIcon, {}) }) });
+  return /* @__PURE__ */ jsx49(actionBar_exports.Edit, { disabled: !allowEdit, asChild: true, children: /* @__PURE__ */ jsx49(TooltipIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx49(PencilIcon, {}) }) });
 });
 UserActionBarEdit.displayName = "UserActionBarEdit";
 var exports8 = {
@@ -5895,31 +5979,15 @@ var exports8 = {
 };
 var user_action_bar_default = Object.assign(UserActionBar, exports8);
 
-// src/ui/user-message-attachment.tsx
-import { jsx as jsx49 } from "react/jsx-runtime";
-var UserMessageAttachmentRoot = withDefaults(attachment_exports.Root, {
-  className: "aui-user-message-attachment-root"
-});
-UserMessageAttachmentRoot.displayName = "UserMessageAttachmentRoot";
-var UserMessageAttachment = () => {
-  return /* @__PURE__ */ jsx49(UserMessageAttachmentRoot, { children: /* @__PURE__ */ jsx49(attachment_exports.unstable_Thumb, {}) });
-};
-UserMessageAttachment.displayName = "UserMessageAttachment";
-var exports9 = {
-  Root: UserMessageAttachmentRoot
-};
-var user_message_attachment_default = Object.assign(
-  UserMessageAttachment,
-  exports9
-);
-
 // src/ui/user-message.tsx
-import { jsx as jsx50, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs12 } from "react/jsx-runtime";
 var UserMessage = () => {
-  return /* @__PURE__ */ jsxs11(UserMessageRoot, { children: [
+  return /* @__PURE__ */ jsxs12(UserMessageRoot, { children: [
     /* @__PURE__ */ jsx50(UserMessageAttachments, {}),
-    /* @__PURE__ */ jsx50(user_action_bar_default, {}),
-    /* @__PURE__ */ jsx50(UserMessageContent, {}),
+    /* @__PURE__ */ jsxs12(message_exports.If, { hasContent: true, children: [
+      /* @__PURE__ */ jsx50(user_action_bar_default, {}),
+      /* @__PURE__ */ jsx50(UserMessageContent, {})
+    ] }),
     /* @__PURE__ */ jsx50(branch_picker_default, {})
   ] });
 };
@@ -5931,7 +5999,7 @@ UserMessageRoot.displayName = "UserMessageRoot";
 var UserMessageContentWrapper = withDefaults("div", {
   className: "aui-user-message-content"
 });
-var UserMessageContent = forwardRef31(({ components, ...props }, ref) => {
+var UserMessageContent = forwardRef32(({ components, ...props }, ref) => {
   return /* @__PURE__ */ jsx50(UserMessageContentWrapper, { ...props, ref, children: /* @__PURE__ */ jsx50(
     message_exports.Content,
     {
@@ -5954,25 +6022,25 @@ var UserMessageAttachments = ({
     {
       components: {
         ...components,
-        Attachment: components?.Attachment ?? user_message_attachment_default
+        Attachment: components?.Attachment ?? attachment_default
       }
     }
   ) }) });
 };
-var exports10 = {
+var exports9 = {
   Root: UserMessageRoot,
   Content: UserMessageContent,
   Attachments: UserMessageAttachments
 };
-var user_message_default = Object.assign(UserMessage, exports10);
+var user_message_default = Object.assign(UserMessage, exports9);
 
 // src/ui/edit-composer.tsx
-import { forwardRef as forwardRef32 } from "react";
-import { jsx as jsx51, jsxs as jsxs12 } from "react/jsx-runtime";
+import { forwardRef as forwardRef33 } from "react";
+import { jsx as jsx51, jsxs as jsxs13 } from "react/jsx-runtime";
 var EditComposer = () => {
-  return /* @__PURE__ */ jsxs12(EditComposerRoot, { children: [
+  return /* @__PURE__ */ jsxs13(EditComposerRoot, { children: [
     /* @__PURE__ */ jsx51(EditComposerInput, {}),
-    /* @__PURE__ */ jsxs12(EditComposerFooter, { children: [
+    /* @__PURE__ */ jsxs13(EditComposerFooter, { children: [
       /* @__PURE__ */ jsx51(EditComposerCancel, {}),
       /* @__PURE__ */ jsx51(EditComposerSend, {})
     ] })
@@ -5991,31 +6059,31 @@ var EditComposerFooter = withDefaults("div", {
   className: "aui-edit-composer-footer"
 });
 EditComposerFooter.displayName = "EditComposerFooter";
-var EditComposerCancel = forwardRef32((props, ref) => {
+var EditComposerCancel = forwardRef33((props, ref) => {
   const {
     strings: { editComposer: { cancel: { label = "Cancel" } = {} } = {} } = {}
   } = useThreadConfig();
   return /* @__PURE__ */ jsx51(composer_exports.Cancel, { asChild: true, children: /* @__PURE__ */ jsx51(Button, { variant: "ghost", ...props, ref, children: props.children ?? label }) });
 });
 EditComposerCancel.displayName = "EditComposerCancel";
-var EditComposerSend = forwardRef32((props, ref) => {
+var EditComposerSend = forwardRef33((props, ref) => {
   const {
     strings: { editComposer: { send: { label = "Send" } = {} } = {} } = {}
   } = useThreadConfig();
   return /* @__PURE__ */ jsx51(composer_exports.Send, { asChild: true, children: /* @__PURE__ */ jsx51(Button, { ...props, ref, children: props.children ?? label }) });
 });
 EditComposerSend.displayName = "EditComposerSend";
-var exports11 = {
+var exports10 = {
   Root: EditComposerRoot,
   Input: EditComposerInput,
   Footer: EditComposerFooter,
   Cancel: EditComposerCancel,
   Send: EditComposerSend
 };
-var edit_composer_default = Object.assign(EditComposer, exports11);
+var edit_composer_default = Object.assign(EditComposer, exports10);
 
 // src/ui/thread.tsx
-import { Fragment as Fragment7, jsx as jsx52, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx52, jsxs as jsxs14 } from "react/jsx-runtime";
 var Thread = (config) => {
   const {
     components: {
@@ -6023,11 +6091,11 @@ var Thread = (config) => {
       ThreadWelcome: ThreadWelcomeComponent = thread_welcome_default
     } = {}
   } = config;
-  return /* @__PURE__ */ jsx52(ThreadRoot, { config, children: /* @__PURE__ */ jsxs13(ThreadViewport, { children: [
+  return /* @__PURE__ */ jsx52(ThreadRoot, { config, children: /* @__PURE__ */ jsxs14(ThreadViewport, { children: [
     /* @__PURE__ */ jsx52(ThreadWelcomeComponent, {}),
     /* @__PURE__ */ jsx52(ThreadMessages, {}),
     /* @__PURE__ */ jsx52(ThreadFollowupSuggestions, {}),
-    /* @__PURE__ */ jsxs13(ThreadViewportFooter, { children: [
+    /* @__PURE__ */ jsxs14(ThreadViewportFooter, { children: [
       /* @__PURE__ */ jsx52(ThreadScrollToBottom, {}),
       /* @__PURE__ */ jsx52(ComposerComponent, {})
     ] })
@@ -6036,7 +6104,7 @@ var Thread = (config) => {
 var ThreadRootStyled = withDefaults(thread_exports.Root, {
   className: "aui-root aui-thread-root"
 });
-var ThreadRoot = forwardRef33(
+var ThreadRoot = forwardRef34(
   ({ config, ...props }, ref) => {
     return /* @__PURE__ */ jsx52(ThreadConfigProvider, { config, children: /* @__PURE__ */ jsx52(ThreadRootStyled, { ...props, ref }) });
   }
@@ -6052,7 +6120,7 @@ var ThreadViewportFooter = withDefaults("div", {
 ThreadViewportFooter.displayName = "ThreadViewportFooter";
 var SystemMessage = () => null;
 var ThreadMessages = ({ components, unstable_flexGrowDiv: flexGrowDiv = true, ...rest }) => {
-  return /* @__PURE__ */ jsxs13(Fragment7, { children: [
+  return /* @__PURE__ */ jsxs14(Fragment7, { children: [
     /* @__PURE__ */ jsx52(
       thread_exports.Messages,
       {
@@ -6087,7 +6155,7 @@ var ThreadScrollToBottomIconButton = withDefaults(TooltipIconButton, {
   variant: "outline",
   className: "aui-thread-scroll-to-bottom"
 });
-var ThreadScrollToBottom = forwardRef33((props, ref) => {
+var ThreadScrollToBottom = forwardRef34((props, ref) => {
   const {
     strings: {
       thread: { scrollToBottom: { tooltip = "Scroll to bottom" } = {} } = {}
@@ -6096,7 +6164,7 @@ var ThreadScrollToBottom = forwardRef33((props, ref) => {
   return /* @__PURE__ */ jsx52(thread_exports.ScrollToBottom, { asChild: true, children: /* @__PURE__ */ jsx52(ThreadScrollToBottomIconButton, { tooltip, ...props, ref, children: props.children ?? /* @__PURE__ */ jsx52(ArrowDownIcon, {}) }) });
 });
 ThreadScrollToBottom.displayName = "ThreadScrollToBottom";
-var exports12 = {
+var exports11 = {
   Root: ThreadRoot,
   Viewport: ThreadViewport,
   Messages: ThreadMessages,
@@ -6104,12 +6172,12 @@ var exports12 = {
   ScrollToBottom: ThreadScrollToBottom,
   ViewportFooter: ThreadViewportFooter
 };
-var thread_default = Object.assign(Thread, exports12);
+var thread_default = Object.assign(Thread, exports11);
 
 // src/ui/assistant-modal.tsx
-import { Fragment as Fragment8, jsx as jsx53, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx53, jsxs as jsxs15 } from "react/jsx-runtime";
 var AssistantModal = (config) => {
-  return /* @__PURE__ */ jsxs14(AssistantModalRoot, { config, children: [
+  return /* @__PURE__ */ jsxs15(AssistantModalRoot, { config, children: [
     /* @__PURE__ */ jsx53(AssistantModalTrigger, {}),
     /* @__PURE__ */ jsx53(AssistantModalContent, { children: /* @__PURE__ */ jsx53(thread_default, {}) })
   ] });
@@ -6122,7 +6190,7 @@ var AssistantModalRoot = ({
   return /* @__PURE__ */ jsx53(ThreadConfigProvider, { config, children: /* @__PURE__ */ jsx53(assistantModal_exports.Root, { ...props }) });
 };
 AssistantModalRoot.displayName = "AssistantModalRoot";
-var AssistantModalTrigger = forwardRef34((props, ref) => {
+var AssistantModalTrigger = forwardRef35((props, ref) => {
   return /* @__PURE__ */ jsx53(AssistantModalAnchor, { children: /* @__PURE__ */ jsx53(assistantModal_exports.Trigger, { asChild: true, children: /* @__PURE__ */ jsx53(AssistantModalButton, { ...props, ref }) }) });
 });
 AssistantModalTrigger.displayName = "AssistantModalTrigger";
@@ -6134,7 +6202,7 @@ var ModalButtonStyled = withDefaults(TooltipIconButton, {
   variant: "default",
   className: "aui-modal-button"
 });
-var AssistantModalButton = forwardRef34(({ "data-state": state, ...rest }, ref) => {
+var AssistantModalButton = forwardRef35(({ "data-state": state, ...rest }, ref) => {
   const {
     strings: {
       assistantModal: {
@@ -6156,7 +6224,7 @@ var AssistantModalButton = forwardRef34(({ "data-state": state, ...rest }, ref)
       "data-state": state,
       ...rest,
       ref,
-      children: rest.children ?? /* @__PURE__ */ jsxs14(Fragment8, { children: [
+      children: rest.children ?? /* @__PURE__ */ jsxs15(Fragment8, { children: [
         /* @__PURE__ */ jsx53(
           BotIcon,
           {
@@ -6181,14 +6249,14 @@ var AssistantModalContent = withDefaults(assistantModal_exports.Content, {
   sideOffset: 16
 });
 AssistantModalContent.displayName = "AssistantModalContent";
-var exports13 = {
+var exports12 = {
   Root: AssistantModalRoot,
   Trigger: AssistantModalTrigger,
   Content: AssistantModalContent,
   Button: AssistantModalButton,
   Anchor: AssistantModalAnchor
 };
-var assistant_modal_default = Object.assign(AssistantModal, exports13);
+var assistant_modal_default = Object.assign(AssistantModal, exports12);
 export {
   actionBar_exports as ActionBarPrimitive,
   assistant_action_bar_default as AssistantActionBar,
@@ -6197,10 +6265,11 @@ export {
   assistantModal_exports as AssistantModalPrimitive,
   AssistantRuntimeProvider,
   attachment_exports as AttachmentPrimitive,
+  attachment_default as AttachmentUI,
   branch_picker_default as BranchPicker,
   branchPicker_exports as BranchPickerPrimitive,
   composer_default as Composer,
-  composer_attachment_default as ComposerAttachment,
+  attachment_default as ComposerAttachment,
   composer_exports as ComposerPrimitive,
   CompositeAttachmentAdapter,
   content_part_default as ContentPart,
@@ -6218,7 +6287,7 @@ export {
   thread_welcome_default as ThreadWelcome,
   user_action_bar_default as UserActionBar,
   user_message_default as UserMessage,
-  user_message_attachment_default as UserMessageAttachment,
+  attachment_default as UserMessageAttachment,
   WebSpeechSynthesisAdapter,
   fromCoreMessage,
   fromCoreMessages,