@agent-native/toolkit 0.198.6 → 0.198.7

package/src/composer/PromptComposer.context.spec.tsx

@@ -96,8 +96,9 @@ describe("controlled composer context", () => {
       ),
     );
     const menu = document.querySelector('[role="menu"]')!;
-    expect(menu.querySelector('[role="searchbox"]')).not.toBeNull();
+    expect(menu.querySelector('[role="searchbox"]')).toBeNull();
     expect(menu.textContent).toContain("Upload File");
+    expect(menu.textContent).toContain("Add context");
     await act(async () =>
       document.dispatchEvent(
         new KeyboardEvent("keydown", { key: "Escape", bubbles: true }),
@@ -129,18 +130,39 @@ describe("controlled composer context", () => {
 
     const mentionMenu = document.querySelector<HTMLElement>('[role="menu"]');
     expect(mentionMenu?.textContent).toContain("Upload File");
-    expect(mentionMenu?.textContent).toContain("Choose source");
+    expect(mentionMenu?.textContent).toContain("Add context");
+    expect(mentionMenu?.textContent).not.toContain("Choose source");
     expect(editor.textContent).toBe("");
-    const mentionOptions = Array.from(
-      mentionMenu!.querySelectorAll<HTMLElement>('[role^="menuitem"]'),
-    ).map((item) => item.textContent);
+    const openContext = async () => {
+      const trigger = Array.from(
+        document.querySelectorAll<HTMLElement>('[role^="menuitem"]'),
+      ).find((item) => item.textContent === "Add context")!;
+      await act(async () => {
+        trigger.focus();
+        trigger.dispatchEvent(
+          new KeyboardEvent("keydown", {
+            key: "ArrowRight",
+            bubbles: true,
+            cancelable: true,
+          }),
+        );
+      });
+    };
+    const nestedItems = () =>
+      Array.from(
+        Array.from(document.querySelectorAll<HTMLElement>('[role="menu"]'))
+          .at(-1)!
+          .querySelectorAll<HTMLElement>('[role^="menuitem"]'),
+      ).map((item) => item.textContent);
+    await openContext();
+    const mentionOptions = nestedItems();
 
     const plusButton = container.querySelector<HTMLButtonElement>(
       'button[aria-label="Add context"]',
     )!;
     await act(async () =>
-      mentionMenu!
-        .querySelector<HTMLElement>('[role^="menuitem"]')!
+      Array.from(document.querySelectorAll<HTMLElement>('[role^="menuitem"]'))
+        .find((item) => item.textContent === "Choose source")!
         .dispatchEvent(
           new KeyboardEvent("keydown", {
             key: "Escape",
@@ -149,6 +171,11 @@ describe("controlled composer context", () => {
           }),
         ),
     );
+    await act(async () =>
+      document.dispatchEvent(
+        new KeyboardEvent("keydown", { key: "Escape", bubbles: true }),
+      ),
+    );
     expect(document.querySelector('[role="menu"]')).toBeNull();
     await act(async () =>
       plusButton.dispatchEvent(
@@ -161,13 +188,11 @@ describe("controlled composer context", () => {
     );
 
     const plusMenu = document.querySelector<HTMLElement>('[role="menu"]');
-    expect(
-      Array.from(
-        plusMenu!.querySelectorAll<HTMLElement>('[role^="menuitem"]'),
-      ).map((item) => item.textContent),
-    ).toEqual(mentionOptions);
+    expect(plusMenu?.textContent).toContain("Add context");
+    await openContext();
+    expect(nestedItems()).toEqual(mentionOptions);
     const sourceAction = Array.from(
-      plusMenu!.querySelectorAll<HTMLElement>('[role^="menuitem"]'),
+      document.querySelectorAll<HTMLElement>('[role^="menuitem"]'),
     ).find((item) => item.textContent === "Choose source")!;
     await act(async () => sourceAction.click());
     expect(onSelect).toHaveBeenCalledOnce();
@@ -205,9 +230,22 @@ describe("controlled composer context", () => {
           }),
         );
       });
-      const integrations = document.querySelector<HTMLElement>(
-        '[role="menuitem"][aria-haspopup="menu"]',
-      )!;
+      const addContext = Array.from(
+        document.querySelectorAll<HTMLElement>('[role^="menuitem"]'),
+      ).find((item) => item.textContent === "Add context")!;
+      await act(async () => {
+        addContext.focus();
+        addContext.dispatchEvent(
+          new KeyboardEvent("keydown", {
+            key: "ArrowRight",
+            bubbles: true,
+            cancelable: true,
+          }),
+        );
+      });
+      const integrations = Array.from(
+        document.querySelectorAll<HTMLElement>('[role^="menuitem"]'),
+      ).find((item) => item.textContent === "Integrations")!;
       expect(integrations.textContent).toBe("Integrations");
       await act(async () => {
         integrations.focus();
@@ -268,6 +306,36 @@ describe("controlled composer context", () => {
           }),
         );
       });
+      const addContext = Array.from(
+        document.querySelectorAll<HTMLElement>('[role^="menuitem"]'),
+      ).find((item) => item.textContent === "Add context");
+      if (addContext) {
+        await act(async () => {
+          addContext.focus();
+          addContext.dispatchEvent(
+            new KeyboardEvent("keydown", {
+              key: "ArrowRight",
+              bubbles: true,
+              cancelable: true,
+            }),
+          );
+        });
+      }
+      const section = Array.from(
+        document.querySelectorAll<HTMLElement>('[role^="menuitem"]'),
+      ).find((item) => item.textContent === "Connected Agents");
+      if (section) {
+        await act(async () => {
+          section.focus();
+          section.dispatchEvent(
+            new KeyboardEvent("keydown", {
+              key: "ArrowRight",
+              bubbles: true,
+              cancelable: true,
+            }),
+          );
+        });
+      }
       const row = Array.from(
         document.querySelectorAll<HTMLElement>('[role="menuitem"]'),
       ).find(
@@ -398,15 +466,28 @@ describe("controlled composer context", () => {
         '[data-agent-native-composer-popover="true"]',
       )!;
       expect(panel).not.toBeNull();
-      expect(panel.style.width).toBe("700px");
+      if (plusMenu) {
+        expect(panel.classList.contains("w-64")).toBe(true);
+        expect(panel.style.width).toBe("");
+      } else {
+        expect(panel.style.width).toBe("700px");
+      }
       const observation = observations.find(({ target }) => target === frame)!;
       expect(observation).toBeDefined();
       for (const width of [324, 280, 700]) {
         bounds = { ...bounds, width };
         await act(async () => observation.resize());
-        expect(panel.style.width).toBe(`${width}px`);
+        if (plusMenu) {
+          expect(panel.style.width).toBe("");
+          expect(panel.classList.contains("w-64")).toBe(true);
+        } else {
+          expect(panel.style.width).toBe(`${width}px`);
+        }
         if (!plusMenu) expect(panel.style.left).toBe("100px");
       }
+      bounds = { ...bounds, y: window.innerHeight + 500 };
+      await act(async () => observation.resize());
+      if (plusMenu) expect(panel.style.maxHeight).toBe("280px");
       bounds = { ...bounds, x: 120, y: 160 };
       await act(async () => window.dispatchEvent(new Event("scroll")));
       if (!plusMenu) {
@@ -785,6 +866,19 @@ describe("controlled composer context", () => {
           new KeyboardEvent("keydown", { key: "ArrowDown", bubbles: true }),
         ),
       );
+      const addContext = Array.from(
+        document.querySelectorAll<HTMLElement>('[role^="menuitem"]'),
+      ).find((element) => element.textContent === "Add context")!;
+      await act(async () => {
+        addContext.focus();
+        addContext.dispatchEvent(
+          new KeyboardEvent("keydown", {
+            key: "ArrowRight",
+            bubbles: true,
+            cancelable: true,
+          }),
+        );
+      });
       const option = Array.from(
         document.querySelectorAll<HTMLElement>('[role="menuitem"]'),
       ).find((element) => element.textContent?.includes("Choose brief"))!;

package/src/composer/TiptapComposer.spec.ts

@@ -356,6 +356,17 @@ describe("createTiptapComposerExtensions", () => {
           }),
         );
     });
+    act(() => {
+      Array.from(document.querySelectorAll<HTMLElement>('[role="menuitem"]'))
+        .find((button) => button.textContent?.trim() === "Add context")
+        ?.dispatchEvent(
+          new KeyboardEvent("keydown", {
+            key: "ArrowRight",
+            bubbles: true,
+            cancelable: true,
+          }),
+        );
+    });
     act(() => {
       Array.from(document.querySelectorAll<HTMLElement>('[role="menuitem"]'))
         .find((button) => button.textContent?.trim() === "Schedule Task")
@@ -502,6 +513,10 @@ describe("createTiptapComposerExtensions", () => {
       );
       await new Promise((resolve) => setTimeout(resolve, 0));
     });
+    const addContextItem = Array.from(
+      document.querySelectorAll<HTMLElement>('[role="menuitem"]'),
+    ).find((item) => item.textContent?.trim() === "Add context");
+    await act(async () => addContextItem?.click());
     const clickMenuItem = async (label: string) => {
       const item = Array.from(
         document.querySelectorAll<HTMLElement>('[role^="menuitem"]'),

package/src/composer/TiptapComposer.tsx

@@ -2634,7 +2634,6 @@ export function TiptapComposer({
   });
   const [popover, setPopover] = useState<PopoverState>(null);
   const [contextMenuOpen, setContextMenuOpen] = useState(false);
-  const [contextMenuSearch, setContextMenuSearch] = useState("");
   const popoverRef = useRef<MentionPopoverRef>(null);
   const composerRuntime = useComposerRuntime();
   const lastComposerRuntimeSyncRef = useRef<{
@@ -2748,18 +2747,10 @@ export function TiptapComposer({
     error: mentionsError,
     retry: retryMentions,
   } = useMentionSearch(
-    contextMenuOpen
-      ? contextMenuSearch
-      : popover?.type === "@"
-        ? popover.query
-        : "",
+    popover?.type === "@" ? popover.query : "",
     includeDefaultMentionSearch && (contextMenuOpen || popover?.type === "@"),
   );
-  const mentionQuery = contextMenuOpen
-    ? contextMenuSearch
-    : popover?.type === "@"
-      ? popover.query
-      : "";
+  const mentionQuery = popover?.type === "@" ? popover.query : "";
   const filteredMentionItems = useMemo(
     () =>
       filterMentionItemsForSlots(
@@ -5302,7 +5293,6 @@ export function TiptapComposer({
             attachmentsEnabled={attachmentsEnabled}
             open={contextMenuOpen}
             onOpenChange={setContextMenuOpen}
-            onSearchChange={setContextMenuSearch}
             loading={mentionsLoading}
             error={
               mentionsError

package/src/composer/use-composer-panel-placement.ts

@@ -1,15 +1,15 @@
 import { useLayoutEffect, useState, type RefObject } from "react";
 
-// Leave room for the search field, group label, and at least one action.
+// Keep the compact menu's actions reachable in short viewports.
 const MIN_USABLE_PANEL_HEIGHT = 120;
+const MAX_COMPOSER_PANEL_HEIGHT = 280;
 
 export function useComposerPanelPlacement(
   triggerRef: RefObject<HTMLElement | null>,
   open: boolean,
 ) {
   const [placement, setPlacement] = useState({
-    width: 320,
-    maxHeight: 440,
+    maxHeight: MAX_COMPOSER_PANEL_HEIGHT,
     side: "top" as "top" | "bottom",
     sideOffset: 8,
     alignOffset: 0,
@@ -37,10 +37,12 @@ export function useComposerPanelPlacement(
           ? "bottom"
           : "top";
       setPlacement({
-        width: bounds.width,
         direction: rtl ? "rtl" : "ltr",
         side,
-        maxHeight: Math.min(440, side === "top" ? spaceAbove : spaceBelow),
+        maxHeight: Math.min(
+          MAX_COMPOSER_PANEL_HEIGHT,
+          side === "top" ? spaceAbove : spaceBelow,
+        ),
         sideOffset:
           side === "top"
             ? button.top - bounds.top + 8

package/dist/composer/asset-picker-url.d.ts

@@ -1,10 +0,0 @@
-export declare const ASSET_PICKER_HANDOFF_PARAM = "__an_asset_picker_handoff";
-export declare const ASSET_PICKER_RETURN_ORIGIN_PARAM = "__an_asset_picker_return_origin";
-export interface StandaloneAssetPickerOptions {
-    handoffId?: string;
-    returnOrigin?: string;
-}
-export declare function createAssetPickerHandoffId(): string;
-export declare function isExternalAssetPickerUrl(value: string, currentOrigin: string): boolean;
-export declare function standaloneAssetPickerUrl(value: string, baseUrl?: string, options?: StandaloneAssetPickerOptions): string;
-//# sourceMappingURL=asset-picker-url.d.ts.map

package/dist/composer/asset-picker-url.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"asset-picker-url.d.ts","sourceRoot":"","sources":["../../src/composer/asset-picker-url.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,0BAA0B,8BAA8B,CAAC;AACtE,eAAO,MAAM,gCAAgC,oCACV,CAAC;AAEpC,MAAM,WAAW,4BAA4B;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,0BAA0B,IAAI,MAAM,CAWnD;AAED,wBAAgB,wBAAwB,CACtC,KAAK,EAAE,MAAM,EACb,aAAa,EAAE,MAAM,GACpB,OAAO,CAMT;AAED,wBAAgB,wBAAwB,CACtC,KAAK,EAAE,MAAM,EACb,OAAO,SAAoB,EAC3B,OAAO,GAAE,4BAAiC,GACzC,MAAM,CAgCR"}

package/dist/composer/asset-picker-url.js

@@ -1,56 +0,0 @@
-const FALLBACK_BASE_URL = "http://agent-native.invalid";
-export const ASSET_PICKER_HANDOFF_PARAM = "__an_asset_picker_handoff";
-export const ASSET_PICKER_RETURN_ORIGIN_PARAM = "__an_asset_picker_return_origin";
-export function createAssetPickerHandoffId() {
-    if (typeof crypto !== "undefined" && crypto.randomUUID) {
-        return crypto.randomUUID();
-    }
-    if (typeof crypto !== "undefined" && crypto.getRandomValues) {
-        const bytes = crypto.getRandomValues(new Uint8Array(16));
-        return Array.from(bytes, (byte) => byte.toString(16).padStart(2, "0")).join("");
-    }
-    return `${Date.now().toString(36)}-${Math.random().toString(36).slice(2)}`;
-}
-export function isExternalAssetPickerUrl(value, currentOrigin) {
-    try {
-        return new URL(value, currentOrigin).origin !== currentOrigin;
-    }
-    catch {
-        return true;
-    }
-}
-export function standaloneAssetPickerUrl(value, baseUrl = FALLBACK_BASE_URL, options = {}) {
-    try {
-        const parsed = new URL(value, baseUrl);
-        parsed.searchParams.delete("embedded");
-        parsed.searchParams.delete("__an_embed_token");
-        parsed.searchParams.set("mediaType", "image");
-        let returnOrigin = null;
-        if (options.returnOrigin) {
-            try {
-                const parsedOrigin = new URL(options.returnOrigin);
-                if (parsedOrigin.protocol === "http:" ||
-                    parsedOrigin.protocol === "https:") {
-                    returnOrigin = parsedOrigin.origin;
-                }
-            }
-            catch {
-                // Omit an invalid return target rather than emitting an unverified
-                // cross-origin callback URL.
-            }
-        }
-        if (options.handoffId && returnOrigin) {
-            parsed.searchParams.set(ASSET_PICKER_HANDOFF_PARAM, options.handoffId);
-            parsed.searchParams.set(ASSET_PICKER_RETURN_ORIGIN_PARAM, returnOrigin);
-        }
-        else {
-            parsed.searchParams.delete(ASSET_PICKER_HANDOFF_PARAM);
-            parsed.searchParams.delete(ASSET_PICKER_RETURN_ORIGIN_PARAM);
-        }
-        return parsed.toString();
-    }
-    catch {
-        return value;
-    }
-}
-//# sourceMappingURL=asset-picker-url.js.map

package/dist/composer/asset-picker-url.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"asset-picker-url.js","sourceRoot":"","sources":["../../src/composer/asset-picker-url.ts"],"names":[],"mappings":"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"}

package/src/composer/asset-picker-url.spec.ts

@@ -1,56 +0,0 @@
-import { describe, expect, it } from "vitest";
-
-import {
-  isExternalAssetPickerUrl,
-  standaloneAssetPickerUrl,
-} from "./asset-picker-url.js";
-
-describe("asset picker auth handoff", () => {
-  it("treats the hosted Assets picker as external to the host app", () => {
-    expect(
-      isExternalAssetPickerUrl(
-        "https://assets.agent-native.com/picker",
-        "https://clips.agent-native.com",
-      ),
-    ).toBe(true);
-  });
-
-  it("keeps same-origin pickers eligible for inline rendering", () => {
-    expect(
-      isExternalAssetPickerUrl("/picker", "https://clips.agent-native.com"),
-    ).toBe(false);
-  });
-
-  it("removes iframe flags from the top-level fallback URL", () => {
-    expect(
-      standaloneAssetPickerUrl(
-        "https://assets.agent-native.com/picker?embedded=1&__an_embed_token=fake-token",
-      ),
-    ).toBe("https://assets.agent-native.com/picker?mediaType=image");
-  });
-
-  it("adds a nonce-bound exact-origin callback to the top-level URL", () => {
-    expect(
-      standaloneAssetPickerUrl(
-        "https://assets.agent-native.com/picker?embedded=1",
-        "https://clips.agent-native.com",
-        {
-          handoffId: "handoff-123",
-          returnOrigin: "https://clips.agent-native.com/chat",
-        },
-      ),
-    ).toBe(
-      "https://assets.agent-native.com/picker?mediaType=image&__an_asset_picker_handoff=handoff-123&__an_asset_picker_return_origin=https%3A%2F%2Fclips.agent-native.com",
-    );
-  });
-
-  it("omits an invalid callback target", () => {
-    expect(
-      standaloneAssetPickerUrl(
-        "https://assets.agent-native.com/picker",
-        "https://clips.agent-native.com",
-        { handoffId: "handoff-123", returnOrigin: "javascript:alert(1)" },
-      ),
-    ).toBe("https://assets.agent-native.com/picker?mediaType=image");
-  });
-});

package/src/composer/asset-picker-url.ts

@@ -1,72 +0,0 @@
-const FALLBACK_BASE_URL = "http://agent-native.invalid";
-
-export const ASSET_PICKER_HANDOFF_PARAM = "__an_asset_picker_handoff";
-export const ASSET_PICKER_RETURN_ORIGIN_PARAM =
-  "__an_asset_picker_return_origin";
-
-export interface StandaloneAssetPickerOptions {
-  handoffId?: string;
-  returnOrigin?: string;
-}
-
-export function createAssetPickerHandoffId(): string {
-  if (typeof crypto !== "undefined" && crypto.randomUUID) {
-    return crypto.randomUUID();
-  }
-  if (typeof crypto !== "undefined" && crypto.getRandomValues) {
-    const bytes = crypto.getRandomValues(new Uint8Array(16));
-    return Array.from(bytes, (byte) => byte.toString(16).padStart(2, "0")).join(
-      "",
-    );
-  }
-  return `${Date.now().toString(36)}-${Math.random().toString(36).slice(2)}`;
-}
-
-export function isExternalAssetPickerUrl(
-  value: string,
-  currentOrigin: string,
-): boolean {
-  try {
-    return new URL(value, currentOrigin).origin !== currentOrigin;
-  } catch {
-    return true;
-  }
-}
-
-export function standaloneAssetPickerUrl(
-  value: string,
-  baseUrl = FALLBACK_BASE_URL,
-  options: StandaloneAssetPickerOptions = {},
-): string {
-  try {
-    const parsed = new URL(value, baseUrl);
-    parsed.searchParams.delete("embedded");
-    parsed.searchParams.delete("__an_embed_token");
-    parsed.searchParams.set("mediaType", "image");
-    let returnOrigin: string | null = null;
-    if (options.returnOrigin) {
-      try {
-        const parsedOrigin = new URL(options.returnOrigin);
-        if (
-          parsedOrigin.protocol === "http:" ||
-          parsedOrigin.protocol === "https:"
-        ) {
-          returnOrigin = parsedOrigin.origin;
-        }
-      } catch {
-        // Omit an invalid return target rather than emitting an unverified
-        // cross-origin callback URL.
-      }
-    }
-    if (options.handoffId && returnOrigin) {
-      parsed.searchParams.set(ASSET_PICKER_HANDOFF_PARAM, options.handoffId);
-      parsed.searchParams.set(ASSET_PICKER_RETURN_ORIGIN_PARAM, returnOrigin);
-    } else {
-      parsed.searchParams.delete(ASSET_PICKER_HANDOFF_PARAM);
-      parsed.searchParams.delete(ASSET_PICKER_RETURN_ORIGIN_PARAM);
-    }
-    return parsed.toString();
-  } catch {
-    return value;
-  }
-}