@assistant-ui/react 0.15.24 → 0.15.25

package/src/index.ts

@@ -333,6 +333,11 @@ export * as ThreadListItemMorePrimitive from "./primitives/threadListItemMore";
 export * as SelectionToolbarPrimitive from "./primitives/selectionToolbar";
 
 export { groupPartByType, type GroupByContext } from "@assistant-ui/core/react";
+export {
+  createThreadRowsSelector,
+  type ThreadRow,
+  type ThreadRowsOptions,
+} from "@assistant-ui/core/react";
 export { unstable_useThreadMessageIds } from "@assistant-ui/core/react";
 export { useMessagePartText } from "./primitives/messagePart/useMessagePartText";
 export { useMessagePartReasoning } from "./primitives/messagePart/useMessagePartReasoning";
@@ -375,8 +380,12 @@ export type {
   ToolApprovalDisplay,
   ToolApprovalOption,
   ToolApprovalOptionKind,
+  ToolApprovalAnswer,
+  ToolApprovalQuestion,
+  ToolApprovalQuestionOption,
   ToolApprovalResponse,
   ToolCallMessagePart,
+  MessagePartTiming,
   ToolCallTiming,
   ToolModelContentPart,
   MessageStatus,
@@ -494,16 +503,32 @@ export {
   useTriggerPopoverTriggers as unstable_useTriggerPopoverTriggers,
   useTriggerPopoverTriggersOptional as unstable_useTriggerPopoverTriggersOptional,
   type RegisteredTrigger as Unstable_RegisteredTrigger,
-  type TriggerMatch as Unstable_TriggerMatch,
-  type TriggerMatcher as Unstable_TriggerMatcher,
+  type TriggerMatch,
+  type TriggerMatcher,
   type TriggerBehavior as Unstable_TriggerBehavior,
 } from "./primitives/composer/trigger";
+import type {
+  TriggerMatch,
+  TriggerMatcher,
+} from "./primitives/composer/trigger";
+/** @deprecated Use `TriggerMatch` instead. */
+export type Unstable_TriggerMatch = TriggerMatch;
+/** @deprecated Use `TriggerMatcher` instead. */
+export type Unstable_TriggerMatcher = TriggerMatcher;
 export type {
+  DirectiveFormatter,
+  DirectiveSegment,
+  TriggerAdapter,
+  TriggerCategory,
+  TriggerItem,
   Unstable_DirectiveFormatter,
   Unstable_DirectiveSegment,
   Unstable_TriggerItem,
 } from "@assistant-ui/core";
-export { unstable_defaultDirectiveFormatter } from "@assistant-ui/core";
+export {
+  defaultDirectiveFormatter,
+  unstable_defaultDirectiveFormatter,
+} from "@assistant-ui/core";
 
 // Unstable - composer input history (terminal-style ArrowUp/ArrowDown recall)
 export {

package/src/model-context/makeAssistantVisible.test.tsx

@@ -8,6 +8,11 @@ import {
   type ChangeEvent,
 } from "react";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import {
+  mergeModelContexts,
+  type ModelContextProvider,
+} from "@assistant-ui/core";
+import type { Tool } from "assistant-stream";
 
 const { registerMock, auiMock } = vi.hoisted(() => {
   const register = vi.fn((_provider: unknown) => () => {});
@@ -30,10 +35,15 @@ type EditTool = {
   execute: (args: { editId: string; value: string }) => Promise<unknown>;
 };
 
-type ModelContextProvider = {
+type ClickTool = {
+  execute: (args: { clickId: string }) => Promise<unknown>;
+};
+
+type VisibleToolsProvider = {
   getModelContext: () => {
     tools: {
-      edit: EditTool;
+      edit?: EditTool;
+      click?: ClickTool;
     };
   };
 };
@@ -79,6 +89,36 @@ const ControlledTextarea = forwardRef<
   );
 });
 
+const Button = forwardRef<HTMLButtonElement, ComponentProps<"button">>(
+  (props, ref) => <button {...props} ref={ref} />,
+);
+
+const SplitRefButton = forwardRef<HTMLButtonElement, ComponentProps<"div">>(
+  ({ children, ...props }, ref) => (
+    <div {...props}>
+      <button ref={ref}>{children}</button>
+    </div>
+  ),
+);
+
+const getRegisteredTools = () => {
+  const provider = registerMock.mock.calls[0]![0] as VisibleToolsProvider;
+  return provider.getModelContext().tools;
+};
+
+const executeTool = (tool: Tool | undefined, args: Record<string, unknown>) => {
+  if (!tool?.execute) throw new Error("Missing executable tool");
+  return Promise.resolve(
+    tool.execute(args, {
+      toolCallId: "test-call",
+      abortSignal: new AbortController().signal,
+      human: async () => {
+        throw new Error("Unexpected human input request");
+      },
+    }),
+  );
+};
+
 const runEditTool = async (
   element: HTMLInputElement | HTMLTextAreaElement,
   value: string,
@@ -86,8 +126,9 @@ const runEditTool = async (
   const editId = element.dataset.editId;
   if (editId === undefined) throw new Error("Missing edit id");
 
-  const provider = registerMock.mock.calls[0]![0] as ModelContextProvider;
-  const task = provider.getModelContext().tools.edit.execute({
+  const edit = getRegisteredTools().edit;
+  if (!edit) throw new Error("Missing edit tool");
+  const task = edit.execute({
     editId,
     value,
   });
@@ -95,7 +136,7 @@ const runEditTool = async (
   await task;
 };
 
-describe("makeAssistantVisible editable components", () => {
+describe("makeAssistantVisible", () => {
   beforeEach(() => {
     registerMock.mockClear();
     vi.stubGlobal("CSS", { escape: (value: string) => value });
@@ -143,4 +184,273 @@ describe("makeAssistantVisible editable components", () => {
     expect(textarea.getAttribute("data-react-value")).toBe("updated");
     expect(onChange).toHaveBeenCalledOnce();
   });
+
+  it("preserves the default action settle delay", async () => {
+    const EditableInput = makeAssistantVisible(ControlledInput, {
+      editable: true,
+    });
+    const input = render(<EditableInput />).getByRole("textbox");
+    const editId = (input as HTMLInputElement).dataset.editId!;
+    const setTimeoutSpy = vi.spyOn(globalThis, "setTimeout");
+
+    expect(
+      (input as HTMLInputElement).dataset.actionSettleDelay,
+    ).toBeUndefined();
+
+    const task = getRegisteredTools().edit!.execute({
+      editId,
+      value: "updated",
+    });
+
+    expect(setTimeoutSpy).toHaveBeenCalledWith(expect.any(Function), 2000);
+    await vi.runAllTimersAsync();
+    await task;
+    setTimeoutSpy.mockRestore();
+  });
+
+  it("uses the default when the rendered settle delay is invalid", async () => {
+    const ClickableButton = makeAssistantVisible(Button, {
+      clickable: true,
+      settleDelayMs: 25,
+    });
+    const button = render(<ClickableButton>Run</ClickableButton>).getByRole(
+      "button",
+    );
+    const clickId = (button as HTMLButtonElement).dataset.clickId!;
+    (button as HTMLButtonElement).dataset.actionSettleDelay = "invalid";
+    const setTimeoutSpy = vi.spyOn(globalThis, "setTimeout");
+
+    const task = getRegisteredTools().click!.execute({ clickId });
+
+    expect(setTimeoutSpy).toHaveBeenCalledWith(expect.any(Function), 2000);
+    await vi.runAllTimersAsync();
+    await task;
+    setTimeoutSpy.mockRestore();
+  });
+
+  it.each(["", "   "])(
+    "uses the default for a blank rendered settle delay of %j",
+    async (renderedDelay) => {
+      const VisibleInput = makeAssistantVisible(ControlledInput, {
+        clickable: true,
+        editable: true,
+        settleDelayMs: 25,
+      });
+      const input = render(<VisibleInput />).getByRole("textbox");
+      const clickId = (input as HTMLInputElement).dataset.clickId!;
+      const editId = (input as HTMLInputElement).dataset.editId!;
+      const setTimeoutSpy = vi.spyOn(globalThis, "setTimeout");
+      input.dataset.actionSettleDelay = renderedDelay;
+
+      const clickTask = getRegisteredTools().click!.execute({ clickId });
+      expect(setTimeoutSpy).toHaveBeenLastCalledWith(
+        expect.any(Function),
+        2000,
+      );
+      await vi.runAllTimersAsync();
+      await clickTask;
+
+      setTimeoutSpy.mockClear();
+      const editTask = getRegisteredTools().edit!.execute({
+        editId,
+        value: "updated",
+      });
+      expect(setTimeoutSpy).toHaveBeenLastCalledWith(
+        expect.any(Function),
+        2000,
+      );
+      await vi.runAllTimersAsync();
+      await editTask;
+      setTimeoutSpy.mockRestore();
+    },
+  );
+
+  it("uses the configured settle delay for click actions", async () => {
+    const ClickableButton = makeAssistantVisible(Button, {
+      clickable: true,
+      settleDelayMs: 25,
+    });
+    const onClick = vi.fn();
+    const button = render(
+      <ClickableButton onClick={onClick}>Run</ClickableButton>,
+    ).getByRole("button");
+    const clickId = (button as HTMLButtonElement).dataset.clickId!;
+    const settled = vi.fn();
+
+    const task = getRegisteredTools().click!.execute({ clickId });
+    void task.then(settled);
+
+    expect(onClick).toHaveBeenCalledOnce();
+    await vi.advanceTimersByTimeAsync(24);
+    expect(settled).not.toHaveBeenCalled();
+
+    await vi.advanceTimersByTimeAsync(1);
+    await task;
+    expect(settled).toHaveBeenCalledOnce();
+  });
+
+  it("uses the action id when the forwarded ref targets a child", async () => {
+    const ClickableButton = makeAssistantVisible(SplitRefButton, {
+      clickable: true,
+      settleDelayMs: 25,
+    });
+    const onClick = vi.fn();
+    const view = render(
+      <ClickableButton data-testid="action" onClick={onClick}>
+        Run
+      </ClickableButton>,
+    );
+    const action = view.getByTestId("action");
+    const clickId = action.dataset.clickId!;
+    const settled = vi.fn();
+
+    const task = getRegisteredTools().click!.execute({ clickId });
+    void task.then(settled);
+
+    expect(onClick).toHaveBeenCalledOnce();
+    await vi.advanceTimersByTimeAsync(24);
+    expect(settled).not.toHaveBeenCalled();
+
+    await vi.advanceTimersByTimeAsync(1);
+    await task;
+    expect(settled).toHaveBeenCalledOnce();
+  });
+
+  it("shares tools across wrappers while keeping per-element delays", async () => {
+    const SlowButton = makeAssistantVisible(Button, {
+      clickable: true,
+      editable: true,
+      settleDelayMs: 25,
+    });
+    const ImmediateButton = makeAssistantVisible(Button, {
+      clickable: true,
+      editable: true,
+      settleDelayMs: 0,
+    });
+    const view = render(
+      <>
+        <SlowButton>Slow</SlowButton>
+        <ImmediateButton>Immediate</ImmediateButton>
+      </>,
+    );
+    const providers = registerMock.mock.calls.map(
+      ([provider]) => provider as ModelContextProvider,
+    );
+    const mergedContext = mergeModelContexts(new Set(providers));
+
+    expect(mergedContext.tools?.click).toBe(
+      providers[0]!.getModelContext().tools?.click,
+    );
+    expect(mergedContext.tools?.click).toBe(
+      providers[1]!.getModelContext().tools?.click,
+    );
+    expect(mergedContext.tools?.edit).toBe(
+      providers[0]!.getModelContext().tools?.edit,
+    );
+    expect(mergedContext.tools?.edit).toBe(
+      providers[1]!.getModelContext().tools?.edit,
+    );
+
+    const [slowButton, immediateButton] = view.getAllByRole("button");
+    const click = mergedContext.tools!.click!;
+    const slowTask = executeTool(click, {
+      clickId: (slowButton as HTMLButtonElement).dataset.clickId!,
+    });
+    const immediateTask = executeTool(click, {
+      clickId: (immediateButton as HTMLButtonElement).dataset.clickId!,
+    });
+
+    await immediateTask;
+    let slowSettled = false;
+    void slowTask.then(() => {
+      slowSettled = true;
+    });
+    await vi.advanceTimersByTimeAsync(24);
+    expect(slowSettled).toBe(false);
+    await vi.advanceTimersByTimeAsync(1);
+    await slowTask;
+  });
+
+  it("shares the edit tool across wrappers while keeping per-element delays", async () => {
+    const SlowInput = makeAssistantVisible(ControlledInput, {
+      editable: true,
+      settleDelayMs: 25,
+    });
+    const ImmediateInput = makeAssistantVisible(ControlledInput, {
+      editable: true,
+      settleDelayMs: 0,
+    });
+    const view = render(
+      <>
+        <SlowInput aria-label="Slow" />
+        <ImmediateInput aria-label="Immediate" />
+      </>,
+    );
+    const providers = registerMock.mock.calls.map(
+      ([provider]) => provider as ModelContextProvider,
+    );
+    const mergedContext = mergeModelContexts(new Set(providers));
+
+    expect(mergedContext.tools?.edit).toBe(
+      providers[0]!.getModelContext().tools?.edit,
+    );
+    expect(mergedContext.tools?.edit).toBe(
+      providers[1]!.getModelContext().tools?.edit,
+    );
+
+    const slowInput = view.getByRole("textbox", { name: "Slow" });
+    const immediateInput = view.getByRole("textbox", { name: "Immediate" });
+    const edit = mergedContext.tools!.edit!;
+    const slowTask = executeTool(edit, {
+      editId: (slowInput as HTMLInputElement).dataset.editId!,
+      value: "slow update",
+    });
+    const immediateTask = executeTool(edit, {
+      editId: (immediateInput as HTMLInputElement).dataset.editId!,
+      value: "immediate update",
+    });
+
+    await immediateTask;
+    expect(immediateInput).toHaveProperty("value", "immediate update");
+    let slowSettled = false;
+    void slowTask.then(() => {
+      slowSettled = true;
+    });
+    await vi.advanceTimersByTimeAsync(24);
+    expect(slowSettled).toBe(false);
+
+    await vi.advanceTimersByTimeAsync(1);
+    await slowTask;
+    expect(slowInput).toHaveProperty("value", "slow update");
+  });
+
+  it("allows the action settle delay to be disabled", async () => {
+    const EditableInput = makeAssistantVisible(ControlledInput, {
+      editable: true,
+      settleDelayMs: 0,
+    });
+    const input = render(<EditableInput />).getByRole("textbox");
+    const editId = (input as HTMLInputElement).dataset.editId!;
+    const timersBefore = vi.getTimerCount();
+
+    const task = getRegisteredTools().edit!.execute({
+      editId,
+      value: "updated",
+    });
+
+    expect(vi.getTimerCount()).toBe(timersBefore);
+    await task;
+    expect(input).toHaveProperty("value", "updated");
+  });
+
+  it.each([-1, Number.NaN, Number.POSITIVE_INFINITY, 2_147_483_648])(
+    "rejects an invalid action settle delay of %s",
+    (settleDelayMs) => {
+      expect(() =>
+        makeAssistantVisible(Button, { clickable: true, settleDelayMs }),
+      ).toThrow(
+        new RangeError("settleDelayMs must be between 0 and 2147483647"),
+      );
+    },
+  );
 });

package/src/model-context/makeAssistantVisible.tsx

@@ -15,6 +15,27 @@ import { useAui } from "@assistant-ui/store";
 import { useComposedRefs } from "radix-ui/internal";
 import { tool } from "@assistant-ui/core";
 
+const DEFAULT_ACTION_SETTLE_DELAY_MS = 2000;
+const MAX_ACTION_SETTLE_DELAY_MS = 2_147_483_647;
+
+const waitForSettle = async (settleDelayMs: number) => {
+  const delay =
+    Number.isFinite(settleDelayMs) &&
+    settleDelayMs >= 0 &&
+    settleDelayMs <= MAX_ACTION_SETTLE_DELAY_MS
+      ? settleDelayMs
+      : DEFAULT_ACTION_SETTLE_DELAY_MS;
+  if (delay === 0) return;
+  await new Promise<void>((resolve) => setTimeout(resolve, delay));
+};
+
+const readActionSettleDelay = (element: HTMLElement) => {
+  const value = element.dataset.actionSettleDelay;
+  return value === undefined || value.trim() === ""
+    ? DEFAULT_ACTION_SETTLE_DELAY_MS
+    : Number(value);
+};
+
 const click = tool({
   parameters: {
     type: "object",
@@ -30,9 +51,7 @@ const click = tool({
     const el = document.querySelector(`[data-click-id='${escapedClickId}']`);
     if (el instanceof HTMLElement) {
       el.click();
-
-      // todo make adjustable
-      await new Promise((resolve) => setTimeout(resolve, 2000));
+      await waitForSettle(readActionSettleDelay(el));
       return {};
     } else {
       return "Element not found";
@@ -77,9 +96,7 @@ const edit = tool({
       setNativeValue(el, value);
       el.dispatchEvent(new Event("input", { bubbles: true }));
       el.dispatchEvent(new Event("change", { bubbles: true }));
-
-      // todo make adjustable
-      await new Promise((resolve) => setTimeout(resolve, 2000));
+      await waitForSettle(readActionSettleDelay(el));
       return {};
     } else {
       return "Element not found";
@@ -91,8 +108,23 @@ const ReadableContext = createContext<boolean>(false);
 
 export const makeAssistantVisible = <T extends ComponentType<any>>(
   Component: T,
-  config?: { clickable?: boolean | undefined; editable?: boolean | undefined },
+  config?: {
+    clickable?: boolean | undefined;
+    editable?: boolean | undefined;
+    settleDelayMs?: number | undefined;
+  },
 ) => {
+  const settleDelayMs = config?.settleDelayMs ?? DEFAULT_ACTION_SETTLE_DELAY_MS;
+  if (
+    !Number.isFinite(settleDelayMs) ||
+    settleDelayMs < 0 ||
+    settleDelayMs > MAX_ACTION_SETTLE_DELAY_MS
+  ) {
+    throw new RangeError(
+      `settleDelayMs must be between 0 and ${MAX_ACTION_SETTLE_DELAY_MS}`,
+    );
+  }
+
   const ReadableComponent = forwardRef(
     (props: PropsWithoutRef<T>, outerRef: ForwardedRef<any>) => {
       const isNestedReadable = useContext(ReadableContext);
@@ -127,6 +159,10 @@ export const makeAssistantVisible = <T extends ComponentType<any>>(
             {...(props as any)}
             {...(config?.clickable ? { "data-click-id": clickId } : {})}
             {...(config?.editable ? { "data-edit-id": clickId } : {})}
+            {...(config?.settleDelayMs !== undefined &&
+            (config.clickable || config.editable)
+              ? { "data-action-settle-delay": settleDelayMs }
+              : {})}
             ref={ref}
           />
         </ReadableContext.Provider>

package/src/primitives/composer/ComposerInput.tsx

@@ -119,7 +119,7 @@ export namespace ComposerPrimitiveInput {
  * keyboard shortcuts, file paste support, and intelligent focus management.
  * It integrates with the composer context to manage message state and submission.
  *
- * When rendered inside `Unstable_TriggerPopoverRoot` and a popover is open, the
+ * When rendered inside `TriggerPopoverRoot` and a popover is open, the
  * underlying `<textarea>` automatically receives `aria-controls`,
  * `aria-expanded`, `aria-haspopup`, and `aria-activedescendant` for the
  * combobox relationship. These computed attributes override user-provided

package/src/primitives/composer/trigger/TriggerPopover.tsx

@@ -2,7 +2,7 @@
 
 import { useAui, useAuiState } from "@assistant-ui/store";
 import { useResource } from "@assistant-ui/tap";
-import type { Unstable_TriggerAdapter } from "@assistant-ui/core";
+import type { TriggerAdapter } from "@assistant-ui/core";
 import {
   createContext,
   forwardRef,
@@ -74,7 +74,7 @@ export namespace ComposerPrimitiveTriggerPopover {
     /** Overrides trigger detection for both textarea and Lexical inputs. `endOffset` is the exclusive replace bound. */
     readonly matcher?: TriggerMatcher | undefined;
     /** Adapter providing categories and items. */
-    readonly adapter?: Unstable_TriggerAdapter | undefined;
+    readonly adapter?: TriggerAdapter | undefined;
     /** Whether the adapter is resolving items, surfaced to the popover scope for async sources. @default false */
     readonly isLoading?: boolean | undefined;
   };
@@ -89,22 +89,22 @@ export namespace ComposerPrimitiveTriggerPopover {
  * `<TriggerPopover.Directive>` or `<TriggerPopover.Action>` as a child. Without
  * a behavior the trigger stays closed.
  *
- * Must be placed inside `ComposerPrimitive.Unstable_TriggerPopoverRoot`.
+ * Must be placed inside `ComposerPrimitive.TriggerPopoverRoot`.
  *
  * @example
  * ```tsx
- * <ComposerPrimitive.Unstable_TriggerPopover
+ * <ComposerPrimitive.TriggerPopover
  *   char="@"
  *   adapter={mentionAdapter}
  * >
- *   <ComposerPrimitive.Unstable_TriggerPopover.Directive formatter={formatter} />
- *   <ComposerPrimitive.Unstable_TriggerPopoverCategories>
+ *   <ComposerPrimitive.TriggerPopover.Directive formatter={formatter} />
+ *   <ComposerPrimitive.TriggerPopoverCategories>
  *     {(cats) => cats.map(...)}
- *   </ComposerPrimitive.Unstable_TriggerPopoverCategories>
- *   <ComposerPrimitive.Unstable_TriggerPopoverItems>
+ *   </ComposerPrimitive.TriggerPopoverCategories>
+ *   <ComposerPrimitive.TriggerPopoverItems>
  *     {(items) => items.map(...)}
- *   </ComposerPrimitive.Unstable_TriggerPopoverItems>
- * </ComposerPrimitive.Unstable_TriggerPopover>
+ *   </ComposerPrimitive.TriggerPopoverItems>
+ * </ComposerPrimitive.TriggerPopover>
  * ```
  */
 export const ComposerPrimitiveTriggerPopover = forwardRef<
@@ -196,7 +196,7 @@ export const ComposerPrimitiveTriggerPopover = forwardRef<
         ...(behavior ? { behavior } : {}),
         resource: getResource(),
       });
-    }, [root, char, hasMatcher, behavior]);
+    }, [root, char, hasMatcher, registeredMatcher, behavior]);
 
     const pluginRegistry = useComposerInputPluginRegistryOptional();
     useEffect(() => {

package/src/primitives/composer/trigger/TriggerPopoverAction.tsx

@@ -1,20 +1,17 @@
 "use client";
 
-import type {
-  Unstable_DirectiveFormatter,
-  Unstable_TriggerItem,
-} from "@assistant-ui/core";
-import { unstable_defaultDirectiveFormatter } from "@assistant-ui/core";
+import type { DirectiveFormatter, TriggerItem } from "@assistant-ui/core";
+import { defaultDirectiveFormatter } from "@assistant-ui/core";
 import { useEffect, useInsertionEffect, useRef, type FC } from "react";
 import { useTriggerBehaviorRegistration } from "./TriggerPopover";
 import type { TriggerBehavior } from "./triggerSelectionResource";
 
 export namespace ComposerPrimitiveTriggerPopoverAction {
   export type Props = {
-    /** Defaults to `unstable_defaultDirectiveFormatter`. */
-    readonly formatter?: Unstable_DirectiveFormatter | undefined;
+    /** Defaults to `defaultDirectiveFormatter`. */
+    readonly formatter?: DirectiveFormatter | undefined;
     /** Fires the moment an item is selected; runs regardless of `removeOnExecute`. */
-    readonly onExecute: (item: Unstable_TriggerItem) => void;
+    readonly onExecute: (item: TriggerItem) => void;
     /** When true, strips the trigger text after executing. Defaults to `false` (keeps audit-trail chip). */
     readonly removeOnExecute?: boolean | undefined;
   };
@@ -25,16 +22,16 @@ export namespace ComposerPrimitiveTriggerPopoverAction {
  * optionally leaving a directive chip behind as an audit trail. Render exactly
  * one behavior sub-primitive per `<TriggerPopover>`.
  *
- * Exposed as `ComposerPrimitive.Unstable_TriggerPopover.Action`.
+ * Exposed as `ComposerPrimitive.TriggerPopover.Action`.
  *
  * @example
  * ```tsx
- * <ComposerPrimitive.Unstable_TriggerPopover char="/" adapter={slashAdapter}>
- *   <ComposerPrimitive.Unstable_TriggerPopover.Action
+ * <ComposerPrimitive.TriggerPopover char="/" adapter={slashAdapter}>
+ *   <ComposerPrimitive.TriggerPopover.Action
  *     onExecute={(item) => commandHandlers[item.id]?.()}
  *     removeOnExecute={false}
  *   />
- * </ComposerPrimitive.Unstable_TriggerPopover>
+ * </ComposerPrimitive.TriggerPopover>
  * ```
  */
 export const ComposerPrimitiveTriggerPopoverAction: FC<
@@ -49,7 +46,7 @@ export const ComposerPrimitiveTriggerPopoverAction: FC<
   useEffect(() => {
     const behavior: TriggerBehavior = {
       kind: "action",
-      formatter: formatter ?? unstable_defaultDirectiveFormatter,
+      formatter: formatter ?? defaultDirectiveFormatter,
       onExecute: (item) => onExecuteRef.current(item),
       ...(removeOnExecute !== undefined ? { removeOnExecute } : {}),
     };

package/src/primitives/composer/trigger/TriggerPopoverCategories.tsx

@@ -10,7 +10,7 @@ import {
 } from "react";
 import { composeEventHandlers } from "radix-ui/internal";
 import { useTriggerPopoverScopeContext } from "./TriggerPopover";
-import type { Unstable_TriggerCategory } from "@assistant-ui/core";
+import type { TriggerCategory } from "@assistant-ui/core";
 
 export namespace ComposerPrimitiveTriggerPopoverCategories {
   export type Element = ComponentRef<typeof Primitive.div>;
@@ -18,7 +18,7 @@ export namespace ComposerPrimitiveTriggerPopoverCategories {
     ComponentPropsWithoutRef<typeof Primitive.div>,
     "children"
   > & {
-    children: (categories: readonly Unstable_TriggerCategory[]) => ReactNode;
+    children: (categories: readonly TriggerCategory[]) => ReactNode;
   };
 }