@assistant-ui/react 0.15.31 → 0.15.33

package/src/primitives/chainOfThought/ChainOfThoughtAccordionTrigger.test.tsx

@@ -0,0 +1,91 @@
+// @vitest-environment jsdom
+import { createRef, type MouseEvent, type Ref } from "react";
+import { cleanup, fireEvent, render, waitFor } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { AuiProvider, useAui, useAuiState } from "@assistant-ui/store";
+import { ChainOfThoughtClient } from "@assistant-ui/core/store";
+import { ChainOfThoughtPrimitiveAccordionTrigger } from "./ChainOfThoughtAccordionTrigger";
+
+afterEach(cleanup);
+
+const Content = () => {
+  const collapsed = useAuiState((s) => s.chainOfThought.collapsed);
+  return (
+    <div data-testid="reasoning" hidden={collapsed}>
+      Reasoning details
+    </div>
+  );
+};
+
+const App = ({
+  triggerRef,
+  ...props
+}: ChainOfThoughtPrimitiveAccordionTrigger.Props & {
+  triggerRef?: Ref<HTMLButtonElement>;
+}) => {
+  const aui = useAui({
+    chainOfThought: ChainOfThoughtClient({
+      parts: [
+        {
+          type: "reasoning",
+          text: "Reasoning details",
+          status: { type: "complete" },
+        },
+      ],
+      getMessagePart: () => {
+        throw new Error("Part lookup is not used by the toggle");
+      },
+    }),
+  });
+  return (
+    <AuiProvider value={aui}>
+      <ChainOfThoughtPrimitiveAccordionTrigger {...props} ref={triggerRef} />
+      <Content />
+    </AuiProvider>
+  );
+};
+
+describe("ChainOfThoughtPrimitiveAccordionTrigger", () => {
+  it.each(["button", "render", "asChild"] as const)(
+    "exposes expansion and forwards the ref with %s",
+    async (mode) => {
+      const ref = createRef<HTMLButtonElement>();
+      const { getByRole, getByTestId } = render(
+        <App
+          triggerRef={ref}
+          {...(mode === "render" ? { render: <button /> } : {})}
+          {...(mode === "asChild" ? { asChild: true } : {})}
+        >
+          {mode === "asChild" ? <button>Thinking</button> : "Thinking"}
+        </App>,
+      );
+      const button = getByRole("button", { name: "Thinking" });
+      const content = getByTestId("reasoning");
+      expect(ref.current).toBe(button);
+      expect(content.hidden).toBe(true);
+      expect(button.getAttribute("aria-expanded")).toBe("false");
+      fireEvent.click(button);
+      await waitFor(() => expect(content.hidden).toBe(false));
+      expect(button.getAttribute("aria-expanded")).toBe("true");
+      fireEvent.click(button);
+      await waitFor(() => expect(content.hidden).toBe(true));
+      expect(button.getAttribute("aria-expanded")).toBe("false");
+    },
+  );
+
+  it("lets the caller veto expansion", () => {
+    const onClick = vi.fn((event: MouseEvent) => event.preventDefault());
+    const { getByRole, getByTestId } = render(
+      <App onClick={onClick}>Thinking</App>,
+    );
+    fireEvent.click(getByRole("button"));
+    expect(onClick).toHaveBeenCalledOnce();
+    expect(getByTestId("reasoning").hidden).toBe(true);
+  });
+
+  it("does not expand a disabled trigger", () => {
+    const { getByRole, getByTestId } = render(<App disabled>Thinking</App>);
+    fireEvent.click(getByRole("button"));
+    expect(getByTestId("reasoning").hidden).toBe(true);
+  });
+});

package/src/primitives/chainOfThought/ChainOfThoughtAccordionTrigger.tsx

@@ -0,0 +1,54 @@
+"use client";
+
+import type { ActionButtonElement } from "../../utils/createActionButton";
+import { type ComponentPropsWithoutRef, forwardRef, useCallback } from "react";
+import { useAuiState, useAui } from "@assistant-ui/store";
+import { composeEventHandlers } from "radix-ui/internal";
+import { Primitive } from "../../utils/Primitive";
+
+export namespace ChainOfThoughtPrimitiveAccordionTrigger {
+  export type Element = ActionButtonElement;
+  /**
+   * Props for the ChainOfThoughtPrimitive.AccordionTrigger component.
+   * Inherits all button element props and action button functionality.
+   */
+  export type Props = ComponentPropsWithoutRef<typeof Primitive.button>;
+}
+
+/**
+ * A button component that toggles the collapsed state of the chain of thought accordion.
+ *
+ * This component automatically handles the toggle functionality, expanding or collapsing
+ * the chain of thought parts when clicked.
+ * Exposes the current disclosure state through `aria-expanded`.
+ *
+ * @example
+ * ```tsx
+ * <ChainOfThoughtPrimitive.AccordionTrigger>
+ *   Toggle Reasoning
+ * </ChainOfThoughtPrimitive.AccordionTrigger>
+ * ```
+ */
+export const ChainOfThoughtPrimitiveAccordionTrigger = forwardRef<
+  ChainOfThoughtPrimitiveAccordionTrigger.Element,
+  ChainOfThoughtPrimitiveAccordionTrigger.Props
+>(({ onClick, ...props }, ref) => {
+  const aui = useAui();
+  const collapsed = useAuiState((s) => s.chainOfThought.collapsed);
+  const toggle = useCallback(() => {
+    aui.chainOfThought.setCollapsed(!collapsed);
+  }, [aui, collapsed]);
+
+  return (
+    <Primitive.button
+      type="button"
+      {...props}
+      ref={ref}
+      aria-expanded={!collapsed}
+      onClick={composeEventHandlers(onClick, toggle)}
+    />
+  );
+});
+
+ChainOfThoughtPrimitiveAccordionTrigger.displayName =
+  "ChainOfThoughtPrimitive.AccordionTrigger";

package/src/primitives/reasoning/useScrollLock.test.tsx

@@ -31,9 +31,29 @@ function stubWidths(
 function lockWithin(container: HTMLElement) {
   const animated = document.createElement("div");
   container.appendChild(animated);
+  return createLock(animated).lock;
+}
+
+function createLock(animated: HTMLElement) {
   const ref = { current: animated };
-  const { result } = renderHook(() => useScrollLock(ref, 200));
-  return result.current;
+  const { result, unmount } = renderHook(() => useScrollLock(ref, 200));
+  return { lock: result.current, dispose: unmount };
+}
+
+function createSharedScroller() {
+  const scroller = document.createElement("div");
+  scroller.style.overflowY = "auto";
+  scroller.style.borderWidth = "0px";
+  scroller.style.paddingRight = "4px";
+  document.body.appendChild(scroller);
+  Object.defineProperty(scroller, "offsetWidth", { value: 306 });
+  Object.defineProperty(scroller, "clientWidth", {
+    get: () => (scroller.style.scrollbarWidth === "none" ? 306 : 300),
+  });
+  const first = document.createElement("div");
+  const second = document.createElement("div");
+  scroller.append(first, second);
+  return { scroller, first: createLock(first), second: createLock(second) };
 }
 
 describe("useScrollLock", () => {
@@ -115,6 +135,55 @@ describe("useScrollLock", () => {
     expect(scroller.style.scrollbarWidth).toBe("");
   });
 
+  it("keeps overlapping animations locked until the last one finishes", () => {
+    vi.useFakeTimers();
+    const { scroller, first, second } = createSharedScroller();
+    scroller.scrollTop = 120;
+
+    first.lock();
+    vi.advanceTimersByTime(100);
+    second.lock();
+    expect(scroller.style.paddingRight).toBe("10px");
+
+    vi.advanceTimersByTime(100);
+    expect(scroller.style.scrollbarWidth).toBe("none");
+    expect(scroller.style.paddingRight).toBe("10px");
+    scroller.scrollTop = 90;
+    scroller.dispatchEvent(new Event("scroll"));
+    expect(scroller.scrollTop).toBe(120);
+
+    vi.advanceTimersByTime(100);
+    expect(scroller.style.scrollbarWidth).toBe("");
+    expect(scroller.style.paddingRight).toBe("4px");
+    scroller.scrollTop = 90;
+    scroller.dispatchEvent(new Event("scroll"));
+    expect(scroller.scrollTop).toBe(90);
+  });
+
+  it.each(["first", "second"] as const)(
+    "preserves a restarted shared lock when the %s owner is disposed first",
+    (disposedFirst) => {
+      vi.useFakeTimers();
+      const shared = createSharedScroller();
+      const { scroller, first, second } = shared;
+      first.lock();
+      second.lock();
+      vi.advanceTimersByTime(100);
+      first.lock();
+
+      shared[disposedFirst].dispose();
+      expect(scroller.style.scrollbarWidth).toBe("none");
+      expect(scroller.style.paddingRight).toBe("10px");
+
+      shared[disposedFirst === "first" ? "second" : "first"].dispose();
+      expect(scroller.style.scrollbarWidth).toBe("");
+      expect(scroller.style.paddingRight).toBe("4px");
+      scroller.style.scrollbarWidth = "thin";
+      vi.advanceTimersByTime(200);
+      expect(scroller.style.scrollbarWidth).toBe("thin");
+    },
+  );
+
   it("leaves the padding alone when no scrollbar takes space", () => {
     const scroller = document.createElement("div");
     scroller.style.overflowY = "auto";

package/src/primitives/reasoning/useScrollLock.ts

@@ -12,6 +12,74 @@ const findScrollableAncestor = (element: HTMLElement | null) => {
   return null;
 };
 
+const scrollLocks = new WeakMap<
+  HTMLElement,
+  { count: number; restore: () => void }
+>();
+
+const acquireScrollLock = (scrollContainer: HTMLElement) => {
+  const existing = scrollLocks.get(scrollContainer);
+  if (existing) {
+    existing.count++;
+    return existing;
+  }
+
+  const scrollPosition = scrollContainer.scrollTop;
+  const scrollbarWidth = scrollContainer.style.scrollbarWidth;
+
+  // Hiding the scrollbar collapses its gutter on classic scrollbars, which
+  // shifts centered content horizontally; compensate with padding on the
+  // side the scrollbar occupies (the left side in RTL).
+  const computed = getComputedStyle(scrollContainer);
+  const paddingSide =
+    computed.direction === "rtl" ? "paddingLeft" : "paddingRight";
+  const previousPadding = scrollContainer.style[paddingSide];
+  const elementScrollbarSize =
+    scrollContainer.offsetWidth -
+    scrollContainer.clientWidth -
+    parseFloat(computed.borderLeftWidth) -
+    parseFloat(computed.borderRightWidth);
+  // A root element's offsetWidth already excludes the viewport scrollbar, so
+  // the element formula reports zero once the scroll propagates to the
+  // viewport, and only then does the viewport measure apply. A body that
+  // scrolls in its own right is measured by the element formula like any
+  // other scroller, whether or not the viewport is scrolling too.
+  const ownerDocument = scrollContainer.ownerDocument;
+  const isRootScroller =
+    scrollContainer === ownerDocument.documentElement ||
+    scrollContainer === ownerDocument.body;
+  const scrollbarSize =
+    isRootScroller && elementScrollbarSize <= 0
+      ? (ownerDocument.defaultView?.innerWidth ?? 0) -
+        ownerDocument.documentElement.clientWidth
+      : elementScrollbarSize;
+
+  scrollContainer.style.scrollbarWidth = "none";
+  if (scrollbarSize > 0) {
+    scrollContainer.style[paddingSide] = `${
+      parseFloat(computed[paddingSide]) + scrollbarSize
+    }px`;
+  }
+
+  const restoreStyles = () => {
+    scrollContainer.style.scrollbarWidth = scrollbarWidth;
+    scrollContainer.style[paddingSide] = previousPadding;
+  };
+
+  const resetPosition = () => (scrollContainer.scrollTop = scrollPosition);
+  scrollContainer.addEventListener("scroll", resetPosition);
+
+  const lock = {
+    count: 1,
+    restore: () => {
+      scrollContainer.removeEventListener("scroll", resetPosition);
+      restoreStyles();
+    },
+  };
+  scrollLocks.set(scrollContainer, lock);
+  return lock;
+};
+
 /**
  * Locks scroll position during collapsible/height animations and hides scrollbar.
  *
@@ -59,61 +127,20 @@ export const useScrollLock = <T extends HTMLElement = HTMLElement>(
       return;
     }
 
-    const scrollPosition = scrollContainer.scrollTop;
-    const scrollbarWidth = scrollContainer.style.scrollbarWidth;
-
-    // Hiding the scrollbar collapses its gutter on classic scrollbars, which
-    // shifts centered content horizontally; compensate with padding on the
-    // side the scrollbar occupies (the left side in RTL).
-    const computed = getComputedStyle(scrollContainer);
-    const paddingSide =
-      computed.direction === "rtl" ? "paddingLeft" : "paddingRight";
-    const previousPadding = scrollContainer.style[paddingSide];
-    const elementScrollbarSize =
-      scrollContainer.offsetWidth -
-      scrollContainer.clientWidth -
-      parseFloat(computed.borderLeftWidth) -
-      parseFloat(computed.borderRightWidth);
-    // A root element's offsetWidth already excludes the viewport scrollbar, so
-    // the element formula reports zero once the scroll propagates to the
-    // viewport, and only then does the viewport measure apply. A body that
-    // scrolls in its own right is measured by the element formula like any
-    // other scroller, whether or not the viewport is scrolling too.
-    const ownerDocument = scrollContainer.ownerDocument;
-    const isRootScroller =
-      scrollContainer === ownerDocument.documentElement ||
-      scrollContainer === ownerDocument.body;
-    const scrollbarSize =
-      isRootScroller && elementScrollbarSize <= 0
-        ? (ownerDocument.defaultView?.innerWidth ?? 0) -
-          ownerDocument.documentElement.clientWidth
-        : elementScrollbarSize;
-
-    scrollContainer.style.scrollbarWidth = "none";
-    if (scrollbarSize > 0) {
-      scrollContainer.style[paddingSide] = `${
-        parseFloat(computed[paddingSide]) + scrollbarSize
-      }px`;
-    }
-
-    const restoreStyles = () => {
-      scrollContainer.style.scrollbarWidth = scrollbarWidth;
-      scrollContainer.style[paddingSide] = previousPadding;
-    };
+    const lock = acquireScrollLock(scrollContainer);
 
-    const resetPosition = () => (scrollContainer.scrollTop = scrollPosition);
-    scrollContainer.addEventListener("scroll", resetPosition);
-
-    const timeoutId = setTimeout(() => {
-      scrollContainer.removeEventListener("scroll", resetPosition);
-      restoreStyles();
-      cleanupRef.current = null;
-    }, animationDuration);
+    const timeoutId = setTimeout(
+      () => cleanupRef.current?.(),
+      animationDuration,
+    );
 
     cleanupRef.current = () => {
       clearTimeout(timeoutId);
-      scrollContainer.removeEventListener("scroll", resetPosition);
-      restoreStyles();
+      if (--lock.count === 0) {
+        lock.restore();
+        scrollLocks.delete(scrollContainer);
+      }
+      cleanupRef.current = null;
     };
   }, [animationDuration, animatedElementRef]);
 

package/src/primitives/threadListItem/ThreadListItemRoot.tsx

@@ -51,7 +51,10 @@ export const ThreadListItemPrimitiveRoot = forwardRef<
       if (event.key === "ArrowDown" || event.key === "ArrowUp") {
         const triggers = getItems()
           .map((item) => item.ref.current)
-          .filter((node): node is HTMLButtonElement => node !== null);
+          .filter(
+            (node): node is HTMLButtonElement =>
+              node !== null && !node.disabled,
+          );
         const next =
           triggers[
             triggers.indexOf(trigger) + (event.key === "ArrowDown" ? 1 : -1)

package/src/primitives/threadListItem/ThreadListKeyboardNav.test.tsx

@@ -112,6 +112,31 @@ describe("thread list keyboard navigation", () => {
     expect(document.activeElement).toBe(first);
   });
 
+  it("skips disabled triggers in both directions without wrapping", () => {
+    const { container } = render(
+      <ThreadListPrimitiveRoot>
+        {[0, 1, 2].map((i) => (
+          <ThreadListItemPrimitiveRoot key={i}>
+            <ThreadListItemPrimitiveTrigger disabled={i === 1}>
+              item {i}
+            </ThreadListItemPrimitiveTrigger>
+          </ThreadListItemPrimitiveRoot>
+        ))}
+      </ThreadListPrimitiveRoot>,
+    );
+    const [first, , third] = triggers(container);
+
+    first!.focus();
+    expect(fireEvent.keyDown(first!, { key: "ArrowDown" })).toBe(false);
+    expect(document.activeElement).toBe(third);
+    expect(fireEvent.keyDown(third!, { key: "ArrowDown" })).toBe(true);
+    expect(document.activeElement).toBe(third);
+    expect(fireEvent.keyDown(third!, { key: "ArrowUp" })).toBe(false);
+    expect(document.activeElement).toBe(first);
+    expect(fireEvent.keyDown(first!, { key: "ArrowUp" })).toBe(true);
+    expect(document.activeElement).toBe(first);
+  });
+
   it("moves between an item and its More button with right/left arrows", () => {
     const { trigger, more } = renderItem();
 

package/src/utils/smooth/useSmooth.test.tsx

@@ -8,12 +8,14 @@ import type {
   TextMessagePart,
 } from "@assistant-ui/core";
 
-const part = {};
-vi.mock("@assistant-ui/store", () => ({
-  useAui: () => ({ part }),
+const aui = vi.hoisted(() => ({ part: {} }));
+vi.mock("@assistant-ui/store", async (importOriginal) => ({
+  ...(await importOriginal<typeof import("@assistant-ui/store")>()),
+  useAui: () => aui,
   useAuiState: (selector: () => unknown) => selector(),
 }));
-vi.mock("./SmoothContext", () => ({
+vi.mock("./SmoothContext", async (importOriginal) => ({
+  ...(await importOriginal<typeof import("./SmoothContext")>()),
   useSmoothStatusStore: () => null,
 }));
 
@@ -163,6 +165,113 @@ describe("useSmooth", () => {
     expect(result.current.status.type).toBe("running");
   });
 
+  it("keeps completed text visible when smoothing is enabled", () => {
+    vi.spyOn(performance, "now").mockReturnValue(1000);
+    vi.spyOn(globalThis, "requestAnimationFrame").mockReturnValue(1);
+    vi.spyOn(globalThis, "cancelAnimationFrame").mockImplementation(() => {});
+    const { result, rerender } = renderHook(
+      ({ state, smooth }) => useSmooth(state, smooth),
+      { initialProps: { state: textState("Hello"), smooth: false } },
+    );
+    rerender({ state: runningState("Hello world"), smooth: false });
+    rerender({ state: textState("Hello world"), smooth: false });
+    expect(result.current.text).toBe("Hello world");
+
+    rerender({ state: textState("Hello world"), smooth: true });
+    expect(result.current.text).toBe("Hello world");
+    expect(result.current.status.type).toBe("complete");
+  });
+
+  it("starts a new part from its own cursor when enabling smoothing in the same update", () => {
+    let now = 1000;
+    let queued: FrameRequestCallback | undefined;
+    vi.spyOn(performance, "now").mockImplementation(() => now);
+    vi.spyOn(globalThis, "requestAnimationFrame").mockImplementation((cb) => {
+      queued = cb;
+      return 1;
+    });
+    vi.spyOn(globalThis, "cancelAnimationFrame").mockImplementation(() => {
+      queued = undefined;
+    });
+    const { result, rerender } = renderHook(
+      ({ state, smooth }) => useSmooth(state, smooth),
+      {
+        initialProps: {
+          state: runningState("Hello"),
+          smooth: false as boolean | SmoothOptions,
+        },
+      },
+    );
+    expect(result.current.text).toBe("Hello");
+
+    aui.part = {};
+    rerender({
+      state: runningState("Hello world"),
+      smooth: { maxCharsPerFrame: 1 },
+    });
+    expect(result.current.text).toBe("");
+    act(() => {
+      now += 16;
+      const callback = queued;
+      queued = undefined;
+      callback?.(now);
+    });
+    expect(result.current.text).toBe("H");
+  });
+
+  it.each([false, true])(
+    "animates only new text after reduced motion is disabled, with a part switch: %s",
+    (switchPart) => {
+      let now = 1000;
+      let queued: FrameRequestCallback | undefined;
+      vi.spyOn(performance, "now").mockImplementation(() => now);
+      vi.spyOn(globalThis, "requestAnimationFrame").mockImplementation((cb) => {
+        queued = cb;
+        return 1;
+      });
+      vi.spyOn(globalThis, "cancelAnimationFrame").mockImplementation(() => {
+        queued = undefined;
+      });
+      const listeners = new Set<() => void>();
+      const media = {
+        matches: true,
+        addEventListener: (_event: string, listener: () => void) =>
+          listeners.add(listener),
+        removeEventListener: (_event: string, listener: () => void) =>
+          listeners.delete(listener),
+      };
+      Object.defineProperty(window, "matchMedia", {
+        configurable: true,
+        value: () => media,
+      });
+      const { result, rerender } = renderHook(
+        (state) => useSmooth(state, { maxCharsPerFrame: 1 }),
+        { initialProps: runningState("Hello") },
+      );
+      if (switchPart) aui.part = {};
+      rerender(runningState("Hello world"));
+      expect(result.current.text).toBe("Hello world");
+
+      act(() => {
+        media.matches = false;
+        for (const listener of listeners) listener();
+      });
+      expect(result.current.text).toBe("Hello world");
+
+      rerender(runningState("Hello world!"));
+      expect(result.current.text).toBe("Hello world");
+      act(() => {
+        now += 16;
+        const callback = queued;
+        queued = undefined;
+        callback?.(now);
+      });
+      expect(result.current.text).toBe("Hello world!");
+      rerender(textState("Hello world!"));
+      expect(result.current.status.type).toBe("complete");
+    },
+  );
+
   it.each([
     { name: "negative drain time", options: { drainMs: -1 } },
     { name: "NaN character interval", options: { maxCharIntervalMs: NaN } },

package/src/utils/smooth/useSmooth.ts

@@ -217,6 +217,17 @@ export const useSmooth = (
   const [animatorRef] = useState(
     () => new TextStreamAnimator(displayedText, setText),
   );
+  const [prevEnabled, setPrevEnabled] = useState(enabled);
+  if (enabled !== prevEnabled) {
+    setPrevEnabled(enabled);
+    if (
+      enabled &&
+      part === prevPart &&
+      text.startsWith(animatorRef.currentText)
+    ) {
+      setDisplayedText(animatorRef.currentText);
+    }
+  }
 
   useEffect(() => {
     animatorRef.drainMs = drainMs;
@@ -227,13 +238,16 @@ export const useSmooth = (
 
   const animatorPartRef = useRef(part);
   useEffect(() => {
+    const partChanged = animatorPartRef.current !== part;
+    animatorPartRef.current = part;
     if (!enabled) {
       animatorRef.stop();
+      animatorRef.currentText = text;
+      animatorRef.targetText = text;
+      animatorRef.lastCommitTime = -Infinity;
       return;
     }
 
-    const partChanged = animatorPartRef.current !== part;
-    animatorPartRef.current = part;
     // A new part whose text shares a prefix with the previous target would
     // keep the stale cursor and flicker without this reset.
     if (partChanged || !text.startsWith(animatorRef.targetText)) {

package/src/primitives/chainOfThought/ChainOfThoughtAccordionTrigger.ts

@@ -1,49 +0,0 @@
-"use client";
-
-import {
-  type ActionButtonElement,
-  type ActionButtonProps,
-  createActionButton,
-} from "../../utils/createActionButton";
-import { useCallback } from "react";
-import { useAuiState, useAui } from "@assistant-ui/store";
-
-const useChainOfThoughtAccordionTrigger = () => {
-  const aui = useAui();
-  const collapsed = useAuiState((s) => s.chainOfThought.collapsed);
-
-  const callback = useCallback(() => {
-    aui.chainOfThought.setCollapsed(!collapsed);
-  }, [aui, collapsed]);
-
-  return callback;
-};
-
-export namespace ChainOfThoughtPrimitiveAccordionTrigger {
-  export type Element = ActionButtonElement;
-  /**
-   * Props for the ChainOfThoughtPrimitive.AccordionTrigger component.
-   * Inherits all button element props and action button functionality.
-   */
-  export type Props = ActionButtonProps<
-    typeof useChainOfThoughtAccordionTrigger
-  >;
-}
-
-/**
- * A button component that toggles the collapsed state of the chain of thought accordion.
- *
- * This component automatically handles the toggle functionality, expanding or collapsing
- * the chain of thought parts when clicked.
- *
- * @example
- * ```tsx
- * <ChainOfThoughtPrimitive.AccordionTrigger>
- *   Toggle Reasoning
- * </ChainOfThoughtPrimitive.AccordionTrigger>
- * ```
- */
-export const ChainOfThoughtPrimitiveAccordionTrigger = createActionButton(
-  "ChainOfThoughtPrimitive.AccordionTrigger",
-  useChainOfThoughtAccordionTrigger,
-);