@agent-native/toolkit 0.219.0 → 0.220.0-nightly-20261023212848

package/src/app/chat/chat/surface-types.ts

@@ -62,6 +62,8 @@ export interface AssistantChatSendOptions {
   approvedToolCalls?: string[];
   /** Send as a protocol continuation that stays out of visible history. */
   hideUserMessage?: boolean;
+  /** The app surface this send came from, reported with the turn's analytics. */
+  surface?: string;
 }
 
 export type AssistantChatSubmitResult =

package/src/composer/ComposerContextMenu.tsx

@@ -215,7 +215,7 @@ function ContextSubmenu({
   icon?: ReactNode;
   disabled?: boolean;
   open: boolean;
-  onOpenChange: (open: boolean) => void;
+  onOpenChange: (open: boolean, reason?: "escape") => void;
   children: ReactNode;
 }) {
   const trigger = useRef<HTMLDivElement>(null);
@@ -244,7 +244,7 @@ function ContextSubmenu({
         onEscapeKeyDown={(event) => {
           event.preventDefault();
           event.stopPropagation();
-          onOpenChange(false);
+          onOpenChange(false, "escape");
           trigger.current?.focus();
         }}
       >
@@ -312,10 +312,14 @@ export function ComposerContextMenu({
   const onDisabledFocusRef = useRef(onDisabledFocus);
   onDisabledFocusRef.current = onDisabledFocus;
   const disabledFocusFrame = useRef<number | null>(null);
+  const resumedPageClose = useRef<string | null>(null);
+  const resumedPageCloseFrame = useRef<number | null>(null);
   useEffect(
     () => () => {
       if (disabledFocusFrame.current !== null)
         window.cancelAnimationFrame(disabledFocusFrame.current);
+      if (resumedPageCloseFrame.current !== null)
+        window.cancelAnimationFrame(resumedPageCloseFrame.current);
     },
     [],
   );
@@ -545,7 +549,19 @@ export function ComposerContextMenu({
               label={entry.label}
               disabled={entry.disabled}
               open={expanded}
-              onOpenChange={(next) => {
+              onOpenChange={(next, reason) => {
+                if (
+                  !next &&
+                  reason !== "escape" &&
+                  resumedPageClose.current === entry.id
+                ) {
+                  resumedPageClose.current = null;
+                  if (resumedPageCloseFrame.current !== null) {
+                    window.cancelAnimationFrame(resumedPageCloseFrame.current);
+                    resumedPageCloseFrame.current = null;
+                  }
+                  return;
+                }
                 const isOpen = branch.every(
                   (id, index) => pathRef.current[index] === id,
                 );
@@ -588,6 +604,19 @@ export function ComposerContextMenu({
                         );
                         return;
                       }
+                      // Radix can emit one stale close after native-picker focus returns.
+                      resumedPageClose.current = entry.id;
+                      if (resumedPageCloseFrame.current !== null)
+                        window.cancelAnimationFrame(
+                          resumedPageCloseFrame.current,
+                        );
+                      resumedPageCloseFrame.current =
+                        window.requestAnimationFrame(() => {
+                          resumedPageCloseFrame.current = null;
+                          if (resumedPageClose.current === entry.id)
+                            resumedPageClose.current = null;
+                        });
+                      triggerRef.current?.focus();
                       changeOpen(true);
                       activate(action, origin, false);
                     },

package/src/composer/ComposerPlusMenu.parity.spec.tsx

@@ -71,7 +71,10 @@ afterEach(() => {
 async function settle() {
   await new Promise((resolve) => setTimeout(resolve, 0));
 }
-async function mount(props: Partial<PromptComposerProps> = {}) {
+async function mount(
+  props: Partial<PromptComposerProps> = {},
+  settleAfterRender = true,
+) {
   const composerRef = React.createRef<TiptapComposerHandle>();
   const onSubmit = vi.fn();
   await act(async () => {
@@ -92,7 +95,7 @@ async function mount(props: Partial<PromptComposerProps> = {}) {
         />
       </ComposerRuntimeAdaptersProvider>,
     );
-    await settle();
+    if (settleAfterRender) await settle();
   });
   return { composerRef, onSubmit };
 }
@@ -722,4 +725,95 @@ describe("shared default action preservation", () => {
     expect(document.querySelector('[role="status"]')).toBeNull();
     expect(item("Upload skill file")).toBeDefined();
   });
+
+  it("resumes skill-file review after the native picker dismisses the menu", async () => {
+    await mount();
+    await open();
+    await choose("Create Skill");
+    await choose("Upload skill file");
+
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 120));
+    });
+
+    const input = container.querySelector<HTMLInputElement>(
+      'input[accept=".md,text/markdown"]',
+    )!;
+    const file = new File(["# Test skill\nDo the test."], "Test Skill.md", {
+      type: "text/markdown",
+    });
+    Object.defineProperty(input, "files", {
+      configurable: true,
+      value: [file],
+    });
+    await act(async () => {
+      input.dispatchEvent(new Event("change", { bubbles: true }));
+      await settle();
+    });
+
+    const form = document.querySelector<HTMLFormElement>("[role=menu] form");
+    expect(form).not.toBeNull();
+    expect(form?.textContent).toContain(
+      "Review the content from Test Skill.md before saving.",
+    );
+    expect(form?.querySelector("textarea")?.value).toBe(
+      "# Test skill\nDo the test.",
+    );
+  });
+
+  it("restores the skill submenu when the native picker is canceled", async () => {
+    await mount();
+    await open();
+    await choose("Create Skill");
+    await choose("Upload skill file");
+
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 120));
+    });
+
+    const input = container.querySelector<HTMLInputElement>(
+      'input[accept=".md,text/markdown"]',
+    )!;
+    await act(async () => {
+      input.dispatchEvent(new Event("cancel"));
+      await settle();
+    });
+
+    expect(labels()).toContain("Upload skill file");
+  });
+
+  it("does not resume the skill page if the composer is disabled", async () => {
+    await mount();
+    await open();
+    await choose("Create Skill");
+    await choose("Upload skill file");
+
+    const input = container.querySelector<HTMLInputElement>(
+      'input[accept=".md,text/markdown"]',
+    )!;
+    vi.useFakeTimers();
+    try {
+      const scheduledTimeouts = vi.spyOn(globalThis, "setTimeout");
+      const clearedTimeouts = vi.spyOn(globalThis, "clearTimeout");
+      const timersBeforeCancel = vi.getTimerCount();
+      const timeoutCallIndex = scheduledTimeouts.mock.calls.length;
+      act(() => input.dispatchEvent(new Event("cancel")));
+      expect(vi.getTimerCount()).toBe(timersBeforeCancel + 1);
+      const resumeTimer =
+        scheduledTimeouts.mock.results[timeoutCallIndex]?.value;
+      expect(resumeTimer).toBeDefined();
+
+      await mount({ disabled: true }, false);
+      expect(clearedTimeouts).toHaveBeenCalledWith(resumeTimer);
+
+      await act(async () => {
+        await vi.advanceTimersByTimeAsync(0);
+      });
+
+      expect(document.querySelector("[role=menu] form")).toBeNull();
+      expect(labels()).not.toContain("Upload skill file");
+    } finally {
+      vi.useRealTimers();
+    }
+  });
 });

package/src/composer/ComposerPlusMenu.tsx

@@ -92,6 +92,9 @@ export function useComposerDefaultActions({
   const [view, setView] = useState<View>("menu");
   const skillFileInputRef = useRef<HTMLInputElement>(null);
   const skillControls = useRef<ComposerContextPageControls | null>(null);
+  const skillFilePickerOpen = useRef(false);
+  const skillPageDismissedWhilePickerOpen = useRef(false);
+  const skillResumeTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
   const skillEpoch = useRef(0);
   const skillRequest = useRef<AbortController | null>(null);
   const skillCloseTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
@@ -104,13 +107,48 @@ export function useComposerDefaultActions({
   } | null>(null);
   const [skillUploadBusy, setSkillUploadBusy] = useState(false);
   const formId = useId();
-  const cancelSkillWork = useCallback(() => {
+  const invalidateSkillWork = useCallback(() => {
     skillEpoch.current++;
     skillRequest.current?.abort();
     skillRequest.current = null;
     if (skillCloseTimer.current !== null) clearTimeout(skillCloseTimer.current);
     skillCloseTimer.current = null;
   }, []);
+  const cancelSkillWork = useCallback(() => {
+    skillFilePickerOpen.current = false;
+    skillPageDismissedWhilePickerOpen.current = false;
+    if (skillResumeTimer.current !== null)
+      clearTimeout(skillResumeTimer.current);
+    skillResumeTimer.current = null;
+    invalidateSkillWork();
+  }, [invalidateSkillWork]);
+  const finishSkillFilePicker = useCallback(() => {
+    skillFilePickerOpen.current = false;
+    if (!skillPageDismissedWhilePickerOpen.current) return;
+    skillPageDismissedWhilePickerOpen.current = false;
+    if (skillResumeTimer.current !== null)
+      clearTimeout(skillResumeTimer.current);
+    skillResumeTimer.current = setTimeout(() => {
+      skillResumeTimer.current = null;
+      skillControls.current?.onResume();
+    }, 0);
+  }, []);
+  const dismissSkillPage = useCallback(() => {
+    if (skillFilePickerOpen.current) {
+      skillPageDismissedWhilePickerOpen.current = true;
+      return;
+    }
+    cancelSkillWork();
+  }, [cancelSkillWork]);
+  useEffect(() => {
+    const input = skillFileInputRef.current;
+    input?.addEventListener("cancel", finishSkillFilePicker);
+    return () => {
+      input?.removeEventListener("cancel", finishSkillFilePicker);
+      if (skillResumeTimer.current !== null)
+        clearTimeout(skillResumeTimer.current);
+    };
+  }, [finishSkillFilePicker]);
   useEffect(() => cancelSkillWork, [cancelSkillWork, adapters.resolvePath]);
   useEffect(() => {
     if (!disabled) return;
@@ -128,7 +166,7 @@ export function useComposerDefaultActions({
     setSkillUploadBusy(false);
   };
   const handleSkillFileSelected = async (file: File) => {
-    cancelSkillWork();
+    invalidateSkillWork();
     const epoch = skillEpoch.current;
     setSkillUploadStatus(null);
     try {
@@ -298,7 +336,7 @@ export function useComposerDefaultActions({
         }),
       ],
       onSelect: resetSkillUpload,
-      onDismiss: cancelSkillWork,
+      onDismiss: dismissSkillPage,
       render: (controls) => {
         skillControls.current = controls;
         return view === "menu" ? (
@@ -317,7 +355,12 @@ export function useComposerDefaultActions({
             <DropdownMenuItem
               onSelect={(event) => {
                 event.preventDefault();
-                skillFileInputRef.current?.click();
+                const input = skillFileInputRef.current;
+                if (!input) return;
+                skillPageDismissedWhilePickerOpen.current = false;
+                skillFilePickerOpen.current = true;
+                controls.onClose({ restoreFocus: false });
+                input.click();
               }}
             >
               {t("agentChat.composer.skill.uploadFile", {
@@ -451,6 +494,7 @@ export function useComposerDefaultActions({
           onChange={(event) => {
             const file = event.target.files?.[0];
             event.target.value = "";
+            finishSkillFilePicker();
             if (file) void handleSkillFileSelected(file);
           }}
         />