@agent-native/toolkit 0.198.4 → 0.198.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agent-native/toolkit",
-  "version": "0.198.4",
+  "version": "0.198.5",
   "description": "Reusable app-building UI and helpers for Agent-Native apps.",
   "homepage": "https://github.com/BuilderIO/agent-native#readme",
   "bugs": {
@@ -665,7 +665,7 @@
     "y-protocols": "^1.0.7",
     "yjs": "^13.6.33",
     "zod": "^4.3.6",
-    "@agent-native/agentkit": "^0.198.4"
+    "@agent-native/agentkit": "^0.198.5"
   },
   "devDependencies": {
     "@excalidraw/excalidraw": "0.18.1",
@@ -686,7 +686,7 @@
     "typescript-7": "npm:typescript@^7.0.2",
     "vite": "8.1.0",
     "vitest": "^4.1.5",
-    "@agent-native/core": "^0.198.4"
+    "@agent-native/core": "^0.198.5"
   },
   "peerDependencies": {
     "@agent-native/core": ">=0.196.0",

package/src/app/agentkit/react/components.interaction.spec.tsx

@@ -95,6 +95,97 @@ describe("AgentKitChat interactions", () => {
     }
   });
 
+  it("announces async preflight when the transcript slot is custom", async () => {
+    const preflight = Promise.withResolvers<boolean>();
+    const client = new AgentKitClient({
+      transport: {
+        async startRun() {
+          return { runId: "run-preflight" };
+        },
+        async *subscribeToRun() {},
+        async cancelRun() {},
+      },
+    });
+    const composerRef = createRef<TiptapComposerHandle>();
+    const container = document.createElement("div");
+    document.body.appendChild(container);
+    const root = createRoot(container);
+    const actEnvironment = globalThis as typeof globalThis & {
+      IS_REACT_ACT_ENVIRONMENT?: boolean;
+    };
+    const previousActEnvironment = actEnvironment.IS_REACT_ACT_ENVIRONMENT;
+    actEnvironment.IS_REACT_ACT_ENVIRONMENT = true;
+
+    try {
+      await act(async () => {
+        root.render(
+          <AgentKitProvider
+            controller={client}
+            threadId="thread-preflight"
+            slots={{
+              transcript: ({ children }) =>
+                createElement(
+                  "div",
+                  { "data-custom-transcript": true },
+                  children,
+                ),
+            }}
+          >
+            <AgentKitChat
+              composerProps={{
+                composerRef,
+                autoFocus: false,
+                modelStatusChecksEnabled: false,
+                onBeforeSubmit: () => preflight.promise,
+                voiceEnabled: false,
+              }}
+            />
+          </AgentKitProvider>,
+        );
+      });
+      await act(async () => composerRef.current!.setText("Check this message"));
+
+      const editor = container.querySelector<HTMLElement>(
+        '[contenteditable="true"]',
+      )!;
+      const send = container.querySelector<HTMLButtonElement>(
+        '[data-agent-composer-slot="send-button"]',
+      )!;
+      await act(async () => {
+        send.click();
+        await Promise.resolve();
+      });
+
+      expect(editor.textContent).toBe("");
+      expect(container.querySelector('[role="status"]')?.textContent).toBe(
+        "Thinking",
+      );
+      expect(send.disabled).toBe(true);
+      expect(send.getAttribute("aria-busy")).toBeNull();
+      expect(send.querySelector(".animate-spin")).toBeNull();
+
+      await act(async () => {
+        preflight.resolve(false);
+        await preflight.promise;
+      });
+
+      expect(editor.textContent).toBe("Check this message");
+      expect(send.disabled).toBe(false);
+      expect(container.querySelector('[role="status"]')).toBeNull();
+    } finally {
+      preflight.resolve(false);
+      await act(async () => root.unmount());
+      await client.shutdown();
+      container.remove();
+      localStorage.removeItem(getComposerDraftKey("agentkit:thread-preflight"));
+      if (previousActEnvironment === undefined) {
+        delete actEnvironment.IS_REACT_ACT_ENVIRONMENT;
+      } else {
+        actEnvironment.IS_REACT_ACT_ENVIRONMENT = previousActEnvironment;
+      }
+    }
+  });
+
   it.each(["default", "compact"] as const)(
     "clears the %s composer before startRun resolves and preserves the next draft",
     async (layoutVariant) => {
@@ -160,6 +251,8 @@ describe("AgentKitChat interactions", () => {
         ).toContain("First prompt");
         expect(client.getThread("thread-latency").activeRunIds).toEqual([]);
         expect(editor.textContent).toBe("");
+        expect(send.getAttribute("aria-busy")).toBeNull();
+        expect(send.querySelector(".animate-spin")).toBeNull();
 
         await act(async () => composerRef.current!.setText("Next draft"));
         await act(async () => started.resolve({ runId: "run-latency" }));

package/src/app/agentkit/react/components.spec.tsx

@@ -476,8 +476,7 @@ describe("AgentKitChat", () => {
     expect(source).toContain(
       "const submissionBlocked = Boolean(submissionDisabled) || command.pending",
     );
-    expect(source).toContain("submitting={command.pending}");
-    expect(source).toContain("submissionDisabled={submissionBlocked}");
+    expect(source).not.toContain("submitting={command.pending}");
     expect(source).toContain("if (disabled)");
     expect(source).toContain(
       "willQueue={active && queueWhileRunning && canQueue}",

package/src/app/agentkit/react/components.tsx

@@ -3054,6 +3054,7 @@ export interface AgentKitComposerProps extends Omit<
     | "extraActionButton"
     | "onSubmit"
     | "onBeforeSubmit"
+    | "onSubmissionPendingChange"
     | "onAttachmentError"
     | "interceptBuildRequestsForBuilder"
     | "planModeDisabled"
@@ -3068,6 +3069,8 @@ export interface AgentKitComposerProps extends Omit<
   composerRef?: { current: TiptapComposerHandle | null };
   threadId?: string;
   className?: string;
+  /** The host transcript renders its own accessible submission status. */
+  announcePendingSubmission?: boolean;
   queueWhileRunning?: boolean;
   showModelSelector?: boolean;
   /** Controlled execution mode for agent-native act/plan workflows. */
@@ -3087,6 +3090,7 @@ function hasActiveRuns(thread: AgentThreadState): boolean {
 export function AgentKitComposer({
   threadId: requestedThreadId,
   className,
+  announcePendingSubmission = true,
   queueWhileRunning = true,
   showModelSelector = true,
   slashCommands,
@@ -3135,6 +3139,7 @@ export function AgentKitComposer({
   extraActionButton,
   onSubmit: onSubmitOverride,
   onBeforeSubmit,
+  onSubmissionPendingChange,
   onAttachmentError,
   interceptBuildRequestsForBuilder,
   planModeDisabled,
@@ -3191,6 +3196,15 @@ export function AgentKitComposer({
     threadId,
   );
   const submissionBlocked = Boolean(submissionDisabled) || command.pending;
+  const [submissionPending, setSubmissionPending] = useState(false);
+  const handleSubmissionPendingChange = useCallback(
+    (pending: boolean) => {
+      setSubmissionPending(pending);
+      onSubmissionPendingChange?.(pending);
+    },
+    [onSubmissionPendingChange],
+  );
+  const suggestionSubmitBlocked = submissionBlocked || submissionPending;
   const localComposerRef = useRef<TiptapComposerHandle>(null);
   const composerRef = hostComposerRef ?? localComposerRef;
   const selectedSuggestionRef = useRef<
@@ -3513,7 +3527,7 @@ export function AgentKitComposer({
   ) => {
     if (
       disabled ||
-      submissionBlocked ||
+      suggestionSubmitBlocked ||
       !suggestionsCapability.enabled ||
       selectedSuggestionRef.current ||
       !isCurrentAgentSuggestion(controller.getThread(threadId), suggestion)
@@ -3536,6 +3550,15 @@ export function AgentKitComposer({
   const suggestions = selectAgentSuggestions(thread);
   return (
     <div className={`agentkit-composer-stack ${className ?? ""}`}>
+      {announcePendingSubmission && submissionPending ? (
+        <span
+          className="agentkit-visually-hidden"
+          role="status"
+          aria-live="polite"
+        >
+          {labels.activityBuckets?.thinking ?? "Thinking"}
+        </span>
+      ) : null}
       {queueCapability.visible ? (
         Queue ? (
           <Queue
@@ -3611,14 +3634,14 @@ export function AgentKitComposer({
           <Suggestions
             suggestions={suggestions}
             threadId={threadId}
-            pending={submissionBlocked}
+            pending={suggestionSubmitBlocked}
             onSelect={selectSuggestion}
           />
         ) : (
           <AgentSuggestionBar
             suggestions={suggestions.map((suggestion) => ({
               ...suggestion,
-              disabled: submissionBlocked || Boolean(disabled),
+              disabled: suggestionSubmitBlocked || Boolean(disabled),
             }))}
             ariaLabel={labels.suggestions}
             onSelect={selectSuggestion}
@@ -3646,7 +3669,6 @@ export function AgentKitComposer({
         imageModelMenu={imageModelMenu}
         autoFocus={autoFocus}
         composerRef={composerRef}
-        submitting={command.pending}
         willQueue={active && queueWhileRunning && canQueue}
         showModelSelector={showModelSelector && canSelectModel}
         availableModels={availableModels}
@@ -3669,8 +3691,11 @@ export function AgentKitComposer({
         initialTextKey={composerInitialTextKey}
         onTextChange={onTextChange}
         extraActionButton={extraActionButton}
+        sendButtonDisabled={submissionPending}
         onBeforeSubmit={onBeforeSubmit}
+        onSubmissionPendingChange={handleSubmissionPendingChange}
         getSubmitFailureDraftScope={getSubmitFailureDraftScope}
+        clearOnSubmitImmediately
         onAttachmentError={reportAttachmentError}
         interceptBuildRequestsForBuilder={interceptBuildRequestsForBuilder}
         planModeDisabled={planModeDisabled}

package/src/app/agentkit/react/composer-context.spec.tsx

@@ -317,6 +317,7 @@ describe("AgentKit composer context submission", () => {
       expect(capture.props).toMatchObject({
         contextItems: source,
         contextMenuItems,
+        clearOnSubmitImmediately: true,
         onRemoveContextItem,
         onInspectContextItem,
         onRetryContextItem,
@@ -332,6 +333,7 @@ describe("AgentKit composer context submission", () => {
       ];
       let pending: void | Promise<void>;
       await act(async () => {
+        capture.props!.onSubmissionPendingChange?.(true);
         pending = capture.props!.onSubmit("Review", [], references, {
           contextItems: source,
           composerModeContext: "Use scheduling tools for this request.",
@@ -341,6 +343,9 @@ describe("AgentKit composer context submission", () => {
       expect(beforeSend).toHaveBeenCalledOnce();
       expect(runtime.startRun).not.toHaveBeenCalled();
       expect(runtime.queueMessage).not.toHaveBeenCalled();
+      expect(container.querySelector('[role="status"]')?.textContent).toBe(
+        "Thinking",
+      );
       expect(Object.isFrozen(saved)).toBe(true);
       expect(Object.isFrozen(saved!.contextItems![0])).toBe(true);
       expect(Object.isFrozen(saved!.references[0].metadata)).toBe(true);
@@ -349,7 +354,9 @@ describe("AgentKit composer context submission", () => {
       await act(async () => {
         release();
         await pending;
+        capture.props!.onSubmissionPendingChange?.(false);
       });
+      expect(container.querySelector('[role="status"]')).toBeNull();
       const input =
         intent === "queued"
           ? runtime.queueMessage.mock.calls[0][0]

package/src/app/chat/AgentKitAssistantChat.spec.tsx

@@ -796,11 +796,27 @@ describe("AgentKitAssistantChat host behavior", () => {
 
     expect(chatMocks.composerProps.disabled).toBe(false);
     expect(chatMocks.composerProps.submissionDisabled).toBe(true);
+    expect(chatMocks.composerProps.announcePendingSubmission).toBe(false);
     expect(container.querySelector('[role="status"]')?.textContent).toBe(
       "agentChat.status.thinking",
     );
   });
 
+  it("keeps the pending announcement when the transcript has no visible user message", async () => {
+    chatMocks.history = { isSubmissionInFlight: true };
+    chatMocks.thread.messages = [
+      {
+        id: "assistant-last",
+        role: "assistant",
+        parts: [{ type: "text", text: "Earlier response" }],
+      },
+    ];
+    await mount(baseProps());
+
+    expect(chatMocks.composerProps.announcePendingSubmission).toBe(true);
+    expect(container.querySelector('[role="status"]')).toBeNull();
+  });
+
   it("gives JS callers a migration error for the removed createAdapter prop", async () => {
     const errors: Error[] = [];
     container = document.createElement("div");
@@ -957,7 +973,6 @@ describe("AgentKitAssistantChat host behavior", () => {
             .querySelector<HTMLElement>("[contenteditable]")
             ?.getAttribute("contenteditable"),
         ).toBe("true");
-
         await act(async () => composer.setText("Next draft"));
         await act(async () => started.resolve({ runId: "run-latency" }));
 
@@ -1007,6 +1022,28 @@ describe("AgentKitAssistantChat host behavior", () => {
     },
   );
 
+  it("disables host suggestions while async submission is pending", async () => {
+    const suggestion = seedFollowup();
+    await mount(baseProps());
+    const chips = () =>
+      [...container.querySelectorAll("button")].filter(
+        (button) => button.textContent === suggestion.label,
+      );
+    expect(chips().length).toBeGreaterThan(0);
+    expect(chips().some((button) => button.disabled)).toBe(false);
+
+    await act(async () => {
+      chatMocks.composerProps.onSubmissionPendingChange(true);
+    });
+
+    expect(chips().every((button) => button.disabled)).toBe(true);
+
+    await act(async () => {
+      chatMocks.composerProps.onSubmissionPendingChange(false);
+    });
+    expect(chips().every((button) => !button.disabled)).toBe(true);
+  });
+
   it.each([undefined, "context-chips", "after-composer", "hidden"] as const)(
     "preserves initial starters with the real composer (placement: %s)",
     async (suggestionPlacement) => {

package/src/app/chat/AgentKitAssistantChat.tsx

@@ -511,6 +511,9 @@ interface AgentKitSurfaceContextValue {
   setupBouncePulse: number;
   bounceSetupCard: () => void;
   isSubmissionInFlight: boolean;
+  composerSubmissionPending: boolean;
+  onComposerSubmissionPendingChange: (pending: boolean) => void;
+  isThinkingVisibleInTranscript: boolean;
   contextItems: AgentChatContextItem[];
   suggestions: AgentSuggestionInput[];
   showSuggestions: boolean;
@@ -1149,6 +1152,8 @@ const AgentKitAssistantChatBody = forwardRef<
   const isRestoring =
     history?.isRestoring === true || props.threadRestore.status === "loading";
   const isSubmissionInFlight = history?.isSubmissionInFlight === true;
+  const [composerSubmissionPending, setComposerSubmissionPending] =
+    useState(false);
   const [authError, setAuthError] = useState<{
     sessionExpired?: boolean;
   } | null>(null);
@@ -1295,6 +1300,11 @@ const AgentKitAssistantChatBody = forwardRef<
     [thread.messages],
   );
   const isRunning = hasActiveAgentRuns(thread);
+  const lastMessage = thread.messages.at(-1);
+  const isThinkingVisibleInTranscript =
+    (isRunning || isSubmissionInFlight) &&
+    lastMessage?.role === "user" &&
+    lastMessage.metadata?.hideUserMessage !== true;
   const isThreadRunning = useCallback(
     () => hasActiveAgentRuns(controller.getThread(threadId)),
     [controller, threadId],
@@ -2597,13 +2607,14 @@ const AgentKitAssistantChatBody = forwardRef<
   );
   const submitSuggestion = useCallback(
     (suggestion: AgentSuggestionInput) => {
+      if (composerSubmissionPending) return;
       const handler = suggestionSubmitRef.current;
       if (!handler || handler.threadId !== threadId) return;
       void handler.submit(suggestion).catch((error) => {
         dispatchSetupRequiredEvent(error, props.tabId, threadId);
       });
     },
-    [props.tabId, threadId],
+    [composerSubmissionPending, props.tabId, threadId],
   );
   const retryDeferredSubmission = useCallback(async () => {
     if (!deferredProviderSubmissionFailureId) return;
@@ -2783,6 +2794,9 @@ const AgentKitAssistantChatBody = forwardRef<
     setupBouncePulse,
     bounceSetupCard,
     isSubmissionInFlight,
+    composerSubmissionPending,
+    onComposerSubmissionPendingChange: setComposerSubmissionPending,
+    isThinkingVisibleInTranscript,
     contextItems,
     voiceTranscriptMessages,
     selectionLength,
@@ -2967,7 +2981,8 @@ function AgentKitEmptyState({ threadId }: { threadId: string }) {
                     disabled={
                       !surface.canChat ||
                       surface.props.composerDisabled ||
-                      surface.props.composerSubmissionDisabled
+                      surface.props.composerSubmissionDisabled ||
+                      surface.composerSubmissionPending
                     }
                     onClick={() => surface.submitSuggestion(suggestion)}
                     className="w-full rounded-xl border border-border/70 bg-card/60 px-3 py-2.5 text-left text-[13px] text-muted-foreground shadow-sm transition-colors hover:border-border hover:bg-card hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
@@ -3065,11 +3080,6 @@ function AgentKitTranscript({ children, threadId }: AgentKitRegionRenderProps) {
   const threadMessageIds = new Set(
     thread.messages.map((message) => message.id),
   );
-  const lastMessage = thread.messages.at(-1);
-  const showThinking =
-    (surface.isRunning || surface.isSubmissionInFlight) &&
-    lastMessage?.role === "user" &&
-    lastMessage.metadata?.hideUserMessage !== true;
   const pendingVoiceMessages = surface.voiceTranscriptMessages.filter(
     (message) => !threadMessageIds.has(message.id),
   );
@@ -3090,7 +3100,8 @@ function AgentKitTranscript({ children, threadId }: AgentKitRegionRenderProps) {
           !surface.canChat ||
           surface.props.composerDisabled ||
           surface.props.composerSubmissionDisabled ||
-          surface.isSubmissionInFlight
+          surface.isSubmissionInFlight ||
+          surface.composerSubmissionPending
         }
         onSelect={surface.submitSuggestion}
         className="agentkit-host-suggestions"
@@ -3246,7 +3257,7 @@ function AgentKitTranscript({ children, threadId }: AgentKitRegionRenderProps) {
           threadId={threadId}
         />
       ))}
-      {showThinking ? (
+      {surface.isThinkingVisibleInTranscript ? (
         <div
           role="status"
           aria-live="polite"
@@ -3395,6 +3406,9 @@ function AgentKitComposerSurface({
   isRunning,
   isRestoring,
   isSubmissionInFlight,
+  composerSubmissionPending,
+  onComposerSubmissionPendingChange,
+  isThinkingVisibleInTranscript,
   hasRenderedMessages,
   threadRestore,
   suggestions,
@@ -3430,6 +3444,9 @@ function AgentKitComposerSurface({
   isRunning: boolean;
   isRestoring: boolean;
   isSubmissionInFlight: boolean;
+  composerSubmissionPending: boolean;
+  onComposerSubmissionPendingChange: (pending: boolean) => void;
+  isThinkingVisibleInTranscript: boolean;
   hasRenderedMessages: boolean;
   setupBouncePulse: number;
   bounceSetupCard: () => void;
@@ -3675,7 +3692,8 @@ function AgentKitComposerSurface({
             !canChat ||
             props.composerDisabled ||
             props.composerSubmissionDisabled ||
-            isSubmissionInFlight
+            isSubmissionInFlight ||
+            composerSubmissionPending
           }
           onSelect={submitSuggestion}
           className="agentkit-home-suggestions"
@@ -3749,6 +3767,8 @@ function AgentKitComposerSurface({
           requireAgentEngine={false}
           onTextChange={onTextChange}
           onBeforeSubmit={onBeforeSubmit}
+          announcePendingSubmission={!isThinkingVisibleInTranscript}
+          onSubmissionPendingChange={onComposerSubmissionPendingChange}
           contextItems={visibleContextItems}
           contextMenuItems={composerContext?.menuItems}
           onRemoveContextItem={(key) => {
@@ -3892,7 +3912,8 @@ function AgentKitComposerSurface({
             !canChat ||
             props.composerDisabled ||
             props.composerSubmissionDisabled ||
-            isSubmissionInFlight
+            isSubmissionInFlight ||
+            composerSubmissionPending
           }
           onSelect={submitSuggestion}
           className="agentkit-home-suggestions"

package/src/composer/PromptComposer.tsx

@@ -106,6 +106,7 @@ export interface PromptComposerProps {
   ) => void | Promise<void>;
   /** Return false to stop a submit before it reaches the host runtime. */
   onBeforeSubmit?: () => boolean | Promise<boolean>;
+  onSubmissionPendingChange?: (pending: boolean) => void;
   /** Scope where a failed submission should be recovered after the host forks. */
   getSubmitFailureDraftScope?: () => string | null;
   /** Handle file paste/drop errors in the host chat surface. */
@@ -118,6 +119,8 @@ export interface PromptComposerProps {
   disabled?: boolean;
   /** Block all submission paths while allowing draft, file, and context staging. */
   submissionDisabled?: boolean;
+  /** Disable only the send control while the submission is being accepted. */
+  sendButtonDisabled?: boolean;
   /** Prevent submission while preserving editor focus and draft entry. */
   submitting?: boolean;
   /** Present the primary action as queueing instead of immediate send. */
@@ -608,6 +611,7 @@ function PromptComposerInner({
   ariaLabel,
   disabled,
   submissionDisabled,
+  sendButtonDisabled,
   submitting,
   willQueue = false,
   onDisabledClick,
@@ -680,6 +684,7 @@ function PromptComposerInner({
   imageModelMenu,
   composerRef,
   onBeforeSubmit,
+  onSubmissionPendingChange,
   getSubmitFailureDraftScope,
   onAttachmentError,
   interceptBuildRequestsForBuilder,
@@ -890,6 +895,7 @@ function PromptComposerInner({
           disabled={disabled}
           contextControlsDisabled={engineSubmissionBlocked}
           submissionDisabled={submissionDisabled || engineSubmissionBlocked}
+          sendButtonDisabled={sendButtonDisabled}
           submitting={submitting}
           willQueue={willQueue}
           maxDocumentAttachmentBytes={maxDocumentAttachmentBytes}
@@ -899,6 +905,7 @@ function PromptComposerInner({
           initialTextKey={initialTextKey}
           onSubmit={handleSubmit}
           onBeforeSubmit={onBeforeSubmit}
+          onSubmissionPendingChange={onSubmissionPendingChange}
           getSubmitFailureDraftScope={getSubmitFailureDraftScope}
           onAttachmentError={onAttachmentError}
           interceptBuildRequestsForBuilder={interceptBuildRequestsForBuilder}

package/src/composer/TiptapComposer.spec.ts

@@ -2166,7 +2166,13 @@ describe("TiptapComposer slash commands", () => {
       resolveSubmit = resolve;
     });
     const onBeforeSubmit = vi.fn(() => preflight);
-    const onSubmit = vi.fn(() => submission);
+    const onSubmissionPendingChange = vi.fn();
+    const onSubmit = vi.fn<NonNullable<TiptapComposerProps["onSubmit"]>>(
+      async (_text, _references, _attachments, options) => {
+        await submission;
+        options?.onLocalSubmit?.();
+      },
+    );
     const focusRef = React.createRef<TiptapComposerHandle>();
 
     function Harness() {
@@ -2180,6 +2186,7 @@ describe("TiptapComposer slash commands", () => {
           React.createElement(TiptapComposer, {
             focusRef,
             onBeforeSubmit,
+            onSubmissionPendingChange,
             onSubmit,
             clearOnSubmitImmediately: true,
             includeDefaultSlashSkills: false,
@@ -2209,6 +2216,7 @@ describe("TiptapComposer slash commands", () => {
 
     expect(editor.textContent).toBe("");
     expect(onSubmit).not.toHaveBeenCalled();
+    expect(onSubmissionPendingChange).toHaveBeenLastCalledWith(true);
     act(() => focusRef.current?.setText("follow-up prompt"));
 
     await act(async () => {
@@ -2225,6 +2233,8 @@ describe("TiptapComposer slash commands", () => {
     );
     expect(editor.textContent).toBe("follow-up prompt");
     await act(async () => resolveSubmit());
+    expect(editor.textContent).toBe("follow-up prompt");
+    expect(onSubmissionPendingChange).toHaveBeenLastCalledWith(false);
   });
 
   it("restores a prompt when async preflight declines it", async () => {
@@ -2337,10 +2347,11 @@ describe("TiptapComposer slash commands", () => {
 
   it("clears immediately while submitting and restores the draft on failure", async () => {
     let rejectSubmit!: (error: Error) => void;
-    const onSubmit = vi.fn(
-      () =>
+    const onSubmit = vi.fn<NonNullable<TiptapComposerProps["onSubmit"]>>(
+      (_text, _references, _attachments, options) =>
         new Promise<void>((_resolve, reject) => {
           rejectSubmit = reject;
+          options?.onLocalSubmit?.();
         }),
     );
     const focusRef = React.createRef<TiptapComposerHandle>();
@@ -2384,6 +2395,7 @@ describe("TiptapComposer slash commands", () => {
 
     expect(onSubmit).toHaveBeenCalledOnce();
     expect(editor.textContent).toBe("");
+    act(() => focusRef.current?.setText("follow-up prompt"));
 
     await act(async () => {
       rejectSubmit(new Error("network unavailable"));
@@ -2391,7 +2403,17 @@ describe("TiptapComposer slash commands", () => {
       await Promise.resolve();
     });
 
-    expect(editor.textContent).toBe("send this once");
+    expect(
+      [...editor.querySelectorAll("p")].map(
+        (paragraph) => paragraph.textContent,
+      ),
+    ).toEqual(["send this once", "follow-up prompt"]);
+    expect(localStorage.getItem(getComposerDraftKey())).toContain(
+      "send this once",
+    );
+    expect(localStorage.getItem(getComposerDraftKey())).toContain(
+      "follow-up prompt",
+    );
   });
 
   it("restores the persisted draft when an immediate submit fails after unmount", async () => {