@runtypelabs/persona 4.25.0 → 4.26.0

package/src/ui-extras-loader.ts

@@ -0,0 +1,26 @@
+import { createChunkLoader } from "./utils/chunk-loader";
+
+/**
+ * Loader indirection for the `ui-extras` chunk (`ui-extras-entry.ts`): UI glue
+ * for opt-in or interaction-only features. The ESM/CJS fallback imports
+ * `./ui-extras-entry` directly (inlined by `--splitting false`); the IIFE/CDN
+ * build marks it external and registers a loader for the sibling
+ * `ui-extras.js` chunk (see `index-global.ts`).
+ */
+export type UiExtrasModule = typeof import("./ui-extras-entry");
+
+const { setLoader, load, provide, getSync } = createChunkLoader<UiExtrasModule>({
+  fallbackImport: () => import("./ui-extras-entry"),
+});
+
+/** Override how the chunk is fetched (the IIFE build registers a sibling-URL loader). */
+export const setUiExtrasLoader = setLoader;
+
+/** Load the chunk. Memoized; retries after rejection. */
+export const loadUiExtras = load;
+
+/** Eagerly supply the module (`ui-extras-eager.ts`: npm builds and tests). */
+export const provideUiExtras = provide;
+
+/** Synchronous access once loaded/provided; null before that. */
+export const getUiExtrasSync = getSync;

package/src/ui.artifact-rail-resize.test.ts

@@ -11,6 +11,7 @@ import { afterEach, beforeAll, beforeEach, describe, expect, it, vi } from "vite
 
 import { createAgentExperience } from "./ui";
 import { createHistoryView } from "./components/history-view";
+import { showHistoryConfirm } from "./components/history-confirm-dialog";
 import { setHistoryViewLoader } from "./history-view-loader";
 import { setHistoryProviderFactory } from "./internal/history-provider-registry";
 import {
@@ -162,7 +163,7 @@ const dragArtifact = (mount: HTMLElement, dx: number) => {
 describe("history rail beside a resizable artifact split", () => {
   beforeEach(() => {
     window.scrollTo = vi.fn();
-    setHistoryViewLoader(async () => ({ createHistoryView }));
+    setHistoryViewLoader(async () => ({ createHistoryView, showHistoryConfirm }));
   });
 
   afterEach(() => {

package/src/ui.ask-user-chunk.test.ts

@@ -0,0 +1,93 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi } from "vitest";
+
+// Simulate the IIFE/CDN path: the ui-extras chunk is not provided up front and
+// each test controls when its load resolves.
+const chunk = vi.hoisted(() => {
+  const click = vi.fn();
+  const keydown = vi.fn();
+  let release: () => void = () => {};
+  let promise: Promise<unknown> = Promise.resolve();
+  const reset = () => {
+    click.mockClear();
+    keydown.mockClear();
+    promise = new Promise((resolve) => {
+      release = () =>
+        resolve({
+          createAskUserSheetHandlers: () => ({ click, keydown }),
+          createContextMentionOrchestrator: () => null,
+        });
+    });
+  };
+  return { click, keydown, reset, release: () => release(), load: () => promise };
+});
+
+vi.mock("./ui-extras-loader", () => ({
+  getUiExtrasSync: () => null,
+  loadUiExtras: () => chunk.load(),
+  setUiExtrasLoader: () => {},
+  provideUiExtras: () => {},
+}));
+
+import { createAgentExperience } from "./ui";
+
+const mountWithSheet = () => {
+  const mount = document.createElement("div");
+  document.body.appendChild(mount);
+  const controller = createAgentExperience(mount, {
+    apiUrl: "https://api.example.com/chat",
+    launcher: { enabled: false },
+  });
+  const overlay = mount.querySelector<HTMLElement>("[data-persona-composer-overlay]")!;
+  const sheet = document.createElement("div");
+  sheet.setAttribute("data-persona-ask-sheet-for", "tool-1");
+  const pill = document.createElement("button");
+  pill.setAttribute("data-ask-user-action", "pick");
+  sheet.appendChild(pill);
+  overlay.appendChild(sheet);
+  return { controller, sheet, pill };
+};
+
+const flush = () => new Promise((resolve) => setTimeout(resolve, 0));
+
+describe("ask-user sheet events waiting on the lazy chunk", () => {
+  it("handles only the first of repeated early clicks", async () => {
+    chunk.reset();
+    const { controller, pill } = mountWithSheet();
+    pill.click();
+    pill.click();
+    chunk.release();
+    await flush();
+    expect(chunk.click).toHaveBeenCalledTimes(1);
+    controller.destroy();
+  });
+
+  it("typing in the free-text input does not block the Enter that submits", async () => {
+    chunk.reset();
+    const { controller, sheet } = mountWithSheet();
+    const input = document.createElement("input");
+    input.setAttribute("data-ask-free-text-input", "true");
+    sheet.appendChild(input);
+    const key = (k: string) =>
+      input.dispatchEvent(new KeyboardEvent("keydown", { key: k, bubbles: true }));
+    key("h");
+    key("i");
+    key("Enter");
+    chunk.release();
+    await flush();
+    expect(chunk.keydown).toHaveBeenCalledTimes(1);
+    expect((chunk.keydown.mock.calls[0][0] as KeyboardEvent).key).toBe("Enter");
+    controller.destroy();
+  });
+
+  it("drops a queued click whose sheet was removed before the chunk loaded", async () => {
+    chunk.reset();
+    const { controller, sheet, pill } = mountWithSheet();
+    pill.click();
+    sheet.remove();
+    chunk.release();
+    await flush();
+    expect(chunk.click).not.toHaveBeenCalled();
+    controller.destroy();
+  });
+});

package/src/ui.history-chunk.test.ts

@@ -10,6 +10,7 @@ import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
 import { createAgentExperience } from "./ui";
 import { createHistoryView } from "./components/history-view";
+import { showHistoryConfirm } from "./components/history-confirm-dialog";
 import { setHistoryViewLoader } from "./history-view-loader";
 import { setHistoryProviderFactory } from "./internal/history-provider-registry";
 import { createDemoHistoryProvider } from "./internal/demo-history-provider";
@@ -63,7 +64,7 @@ describe("history lazy chunk", () => {
     expect(body.hasAttribute("inert")).toBe(false);
 
     // A dropped fetch must not disable the feature for the session.
-    setHistoryViewLoader(async () => ({ createHistoryView }));
+    setHistoryViewLoader(async () => ({ createHistoryView, showHistoryConfirm }));
     mount.querySelector<HTMLButtonElement>("[data-persona-history-toggle]")!.click();
     await flush();
     expect(mount.querySelector(".persona-history-view")).not.toBeNull();

package/src/ui.history-config-provider.test.ts

@@ -11,6 +11,7 @@ import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
 import { createAgentExperience } from "./ui";
 import { createHistoryView } from "./components/history-view";
+import { showHistoryConfirm } from "./components/history-confirm-dialog";
 import { setHistoryViewLoader } from "./history-view-loader";
 import { setHistoryProviderFactory } from "./internal/history-provider-registry";
 import {
@@ -118,7 +119,7 @@ describe("features.history.provider", () => {
     window.scrollTo = vi.fn();
     // No registry override: this suite exercises the public config path only.
     setHistoryProviderFactory(null);
-    setHistoryViewLoader(async () => ({ createHistoryView }));
+    setHistoryViewLoader(async () => ({ createHistoryView, showHistoryConfirm }));
   });
 
   afterEach(() => {

package/src/ui.history-confirm-fallback.test.ts

@@ -0,0 +1,142 @@
+// @vitest-environment jsdom
+
+/**
+ * Version skew on the CDN: a fresh `index.global.js` paired with a cached
+ * `history-view.js` that predates the `showHistoryConfirm` export. Own file
+ * because `loadHistoryView` memoizes the resolved module per module graph.
+ */
+
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import { createAgentExperience } from "./ui";
+import { createHistoryView } from "./components/history-view";
+import { setHistoryViewLoader } from "./history-view-loader";
+import type { HistoryViewOptions } from "./history-view-entry";
+import { setHistoryProviderFactory } from "./internal/history-provider-registry";
+import {
+  createDemoHistoryProvider,
+  type DemoHistoryConversationSeed,
+} from "./internal/demo-history-provider";
+
+const SEEDS: DemoHistoryConversationSeed[] = [
+  {
+    id: "conv-a",
+    title: "Order status",
+    targetId: null,
+    messages: [{ id: "a1", role: "user", content: "where is my order" }],
+  },
+];
+
+const flush = async (times = 12) => {
+  for (let i = 0; i < times; i += 1) {
+    // eslint-disable-next-line no-await-in-loop
+    await Promise.resolve();
+  }
+};
+
+type HistoryViewModule = Awaited<
+  ReturnType<Parameters<typeof setHistoryViewLoader>[0]>
+>;
+
+describe("history confirm with a stale chunk", () => {
+  let controller: ReturnType<typeof createAgentExperience> | null = null;
+  let mount: HTMLElement | null = null;
+
+  beforeEach(() => {
+    window.scrollTo = vi.fn();
+    setHistoryProviderFactory(() =>
+      createDemoHistoryProvider({ conversations: SEEDS })
+    );
+  });
+
+  afterEach(() => {
+    setHistoryProviderFactory(null);
+    controller?.destroy();
+    controller = null;
+    mount?.remove();
+    mount = null;
+    document.body.innerHTML = "";
+    vi.restoreAllMocks();
+  });
+
+  // Runs first: a resolved chunk is memoized for the rest of the module graph,
+  // so the rejecting loader only takes effect before any successful load.
+  it("falls back to the native confirm when the chunk fails to load", async () => {
+    setHistoryViewLoader(async () => {
+      throw new Error("chunk fetch failed");
+    });
+    mount = document.createElement("div");
+    document.body.appendChild(mount);
+    controller = createAgentExperience(mount, {
+      apiUrl: "https://api.example.com/chat",
+      launcher: { enabled: false },
+      persistState: false,
+      features: { history: { enabled: true } },
+    } as unknown as Parameters<typeof createAgentExperience>[1]);
+    await controller.openConversation("conv-a");
+    await flush();
+
+    // The title-menu delete needs no history view: it goes straight to the
+    // confirm, whose chunk load rejects.
+    const deleteFromTitleMenu = () =>
+      mount!
+        .querySelector('[data-persona-theme-zone="header"]')!
+        .dispatchEvent(
+          new CustomEvent("persona:title-menu-builtin", {
+            bubbles: true,
+            detail: { actionId: "delete" },
+          })
+        );
+    const listIds = async () =>
+      (await controller!.listConversations({ limit: 10 })).items.map(
+        (item) => item.id
+      );
+
+    const confirmSpy = vi.spyOn(window, "confirm").mockReturnValue(false);
+    deleteFromTitleMenu();
+    await flush();
+    expect(confirmSpy).toHaveBeenCalledTimes(1);
+    expect(await listIds()).toContain("conv-a");
+
+    confirmSpy.mockReturnValue(true);
+    deleteFromTitleMenu();
+    await flush();
+    expect(confirmSpy).toHaveBeenCalledTimes(2);
+    expect(await listIds()).not.toContain("conv-a");
+  });
+
+  it("falls back to the native confirm when the chunk lacks showHistoryConfirm", async () => {
+    let viewOptions: HistoryViewOptions | null = null;
+    // Older chunk shape: no showHistoryConfirm export.
+    setHistoryViewLoader(
+      async () =>
+        ({
+          createHistoryView: (options: HistoryViewOptions) => {
+            viewOptions = options;
+            return createHistoryView(options);
+          },
+        }) as unknown as HistoryViewModule
+    );
+    mount = document.createElement("div");
+    document.body.appendChild(mount);
+    controller = createAgentExperience(mount, {
+      apiUrl: "https://api.example.com/chat",
+      launcher: { enabled: false },
+      persistState: false,
+      features: { history: { enabled: true } },
+    } as unknown as Parameters<typeof createAgentExperience>[1]);
+
+    mount.querySelector<HTMLButtonElement>("[data-persona-history-toggle]")!.click();
+    await flush();
+    expect(viewOptions).not.toBeNull();
+    const requestClear = viewOptions!.onRequestClearHistory!;
+
+    const confirmSpy = vi.spyOn(window, "confirm").mockReturnValue(false);
+    await expect(requestClear()).resolves.toBe("cancelled");
+    expect(confirmSpy).toHaveBeenCalledTimes(1);
+
+    confirmSpy.mockReturnValue(true);
+    await expect(requestClear()).resolves.toBe("cleared");
+    expect(confirmSpy).toHaveBeenCalledTimes(2);
+  });
+});

package/src/ui.history-controller.test.ts

@@ -13,6 +13,7 @@ import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 import { createAgentExperience } from "./ui";
 import { initAgentWidget } from "./runtime/init";
 import { createHistoryView } from "./components/history-view";
+import { showHistoryConfirm } from "./components/history-confirm-dialog";
 import { setHistoryViewLoader } from "./history-view-loader";
 import { setHistoryProviderFactory } from "./internal/history-provider-registry";
 import {
@@ -87,7 +88,7 @@ const setup = (
 describe("history controller API", () => {
   beforeEach(() => {
     window.scrollTo = vi.fn();
-    setHistoryViewLoader(async () => ({ createHistoryView }));
+    setHistoryViewLoader(async () => ({ createHistoryView, showHistoryConfirm }));
   });
 
   afterEach(() => {

package/src/ui.history-lifecycle.test.ts

@@ -52,6 +52,7 @@ vi.mock("./utils/visitor-store", async (importOriginal) => {
 
 import { createAgentExperience } from "./ui";
 import { createHistoryView } from "./components/history-view";
+import { showHistoryConfirm } from "./components/history-confirm-dialog";
 import { setHistoryViewLoader } from "./history-view-loader";
 import { setHistoryProviderFactory } from "./internal/history-provider-registry";
 import { createDemoHistoryProvider } from "./internal/demo-history-provider";
@@ -109,7 +110,7 @@ const mount = (config: Record<string, unknown>) => {
 describe("history controller lifecycle", () => {
   beforeEach(() => {
     window.scrollTo = vi.fn();
-    setHistoryViewLoader(async () => ({ createHistoryView }));
+    setHistoryViewLoader(async () => ({ createHistoryView, showHistoryConfirm }));
     installFetch();
   });
 

package/src/ui.history-render-hooks.test.ts

@@ -11,6 +11,7 @@ import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
 import { createAgentExperience } from "./ui";
 import { createHistoryView } from "./components/history-view";
+import { showHistoryConfirm } from "./components/history-confirm-dialog";
 import { setHistoryViewLoader } from "./history-view-loader";
 import { setHistoryProviderFactory } from "./internal/history-provider-registry";
 import {
@@ -127,7 +128,7 @@ const fullViewPlugin = (
 describe("history render hooks", () => {
   beforeEach(() => {
     window.scrollTo = vi.fn();
-    setHistoryViewLoader(async () => ({ createHistoryView }));
+    setHistoryViewLoader(async () => ({ createHistoryView, showHistoryConfirm }));
   });
 
   afterEach(() => {

package/src/ui.history-shell.test.ts

@@ -13,6 +13,7 @@ import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
 import { createAgentExperience } from "./ui";
 import { createHistoryView } from "./components/history-view";
+import { showHistoryConfirm } from "./components/history-confirm-dialog";
 import { setHistoryViewLoader } from "./history-view-loader";
 import { setHistoryProviderFactory } from "./internal/history-provider-registry";
 import {
@@ -169,7 +170,7 @@ describe("history shell", () => {
   beforeEach(() => {
     window.scrollTo = vi.fn();
     // The loader's production path is a sibling-URL / external-subpath import.
-    setHistoryViewLoader(async () => ({ createHistoryView }));
+    setHistoryViewLoader(async () => ({ createHistoryView, showHistoryConfirm }));
   });
 
   afterEach(() => {

package/src/ui.rail-overlay.test.ts

@@ -12,6 +12,7 @@ import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
 import { createAgentExperience } from "./ui";
 import { createHistoryView } from "./components/history-view";
+import { showHistoryConfirm } from "./components/history-confirm-dialog";
 import { setHistoryViewLoader } from "./history-view-loader";
 import { setHistoryProviderFactory } from "./internal/history-provider-registry";
 import {
@@ -53,7 +54,7 @@ const wait = (ms: number) =>
 /** Past the 300ms pointer-out grace. */
 const GRACE = 380;
 
-const loadHistoryChunk = vi.fn(async () => ({ createHistoryView }));
+const loadHistoryChunk = vi.fn(async () => ({ createHistoryView, showHistoryConfirm }));
 
 const setup = (
   options: {

package/src/ui.rail-resize.test.ts

@@ -10,6 +10,7 @@ import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
 import { createAgentExperience } from "./ui";
 import { createHistoryView } from "./components/history-view";
+import { showHistoryConfirm } from "./components/history-confirm-dialog";
 import { setHistoryViewLoader } from "./history-view-loader";
 import { setHistoryProviderFactory } from "./internal/history-provider-registry";
 import {
@@ -103,7 +104,7 @@ const drag = (handle: HTMLElement, dx: number, opts?: { hold?: boolean }) => {
 describe("rail resize handle", () => {
   beforeEach(() => {
     window.scrollTo = vi.fn();
-    setHistoryViewLoader(async () => ({ createHistoryView }));
+    setHistoryViewLoader(async () => ({ createHistoryView, showHistoryConfirm }));
   });
 
   afterEach(() => {

package/src/ui.rail-trigger-pending.test.ts

@@ -13,6 +13,7 @@ import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
 import { createAgentExperience } from "./ui";
 import { createHistoryView } from "./components/history-view";
+import { showHistoryConfirm } from "./components/history-confirm-dialog";
 import { setHistoryViewLoader } from "./history-view-loader";
 import { setHistoryProviderFactory } from "./internal/history-provider-registry";
 import { createDemoHistoryProvider } from "./internal/demo-history-provider";
@@ -103,7 +104,7 @@ describe("rail trigger during a docking open", () => {
     setHistoryViewLoader(
       () =>
         new Promise((resolve) => {
-          release = () => resolve({ createHistoryView });
+          release = () => resolve({ createHistoryView, showHistoryConfirm });
         })
     );
     const { controller: ctl } = setup();