@copilotkitnext/react 1.52.0-next.6 → 1.52.0-next.7

package/dist/hooks/use-interrupt.d.cts

@@ -0,0 +1,102 @@
+import { InterruptEvent, InterruptHandlerProps, InterruptRenderProps } from "../types/interrupt.cjs";
+import React from "react";
+
+//#region src/hooks/use-interrupt.d.ts
+type InterruptHandlerFn<TValue, TResult> = (props: InterruptHandlerProps<TValue>) => TResult | PromiseLike<TResult>;
+type InterruptResultFromHandler<THandler> = THandler extends ((...args: never[]) => infer TResult) ? TResult extends PromiseLike<infer TResolved> ? TResolved | null : TResult | null : null;
+type InterruptResult<TValue, TResult> = InterruptResultFromHandler<InterruptHandlerFn<TValue, TResult>>;
+type InterruptRenderInChat = boolean | undefined;
+type UseInterruptReturn<TRenderInChat extends InterruptRenderInChat> = TRenderInChat extends false ? React.ReactElement | null : TRenderInChat extends true | undefined ? void : React.ReactElement | null | void;
+/**
+ * Configuration options for `useInterrupt`.
+ */
+interface UseInterruptConfigBase<TValue = unknown, TResult = never> {
+  /**
+   * Render function for the interrupt UI.
+   *
+   * This is called once an interrupt is finalized and accepted by `enabled` (if provided).
+   * Use `resolve` from render props to resume the agent run with user input.
+   */
+  render: (props: InterruptRenderProps<TValue, InterruptResult<TValue, TResult>>) => React.ReactElement;
+  /**
+   * Optional pre-render handler invoked when an interrupt is received.
+   *
+   * Return either a sync value or an async value to pass into `render` as `result`.
+   * Rejecting/throwing falls back to `result = null`.
+   */
+  handler?: InterruptHandlerFn<TValue, TResult>;
+  /**
+   * Optional predicate to filter which interrupts should be handled by this hook.
+   * Return `false` to ignore an interrupt.
+   */
+  enabled?: (event: InterruptEvent<TValue>) => boolean;
+  /** Optional agent id. Defaults to the current configured chat agent. */
+  agentId?: string;
+}
+type UseInterruptConfig<TValue = unknown, TResult = never, TRenderInChat extends InterruptRenderInChat = undefined> = UseInterruptConfigBase<TValue, TResult> & {
+  /** When true (default), the interrupt UI renders inside `<CopilotChat>` automatically. Set to false to render it yourself. */renderInChat?: TRenderInChat;
+};
+/**
+ * Handles agent interrupts (`on_interrupt`) with optional filtering, preprocessing, and resume behavior.
+ *
+ * The hook listens to custom events on the active agent, stores interrupt payloads per run,
+ * and surfaces a render callback once the run finalizes. Call `resolve` from your UI to resume
+ * execution with user-provided data.
+ *
+ * - `renderInChat: true` (default): the element is published into `<CopilotChat>` and this hook returns `void`.
+ * - `renderInChat: false`: the hook returns the interrupt element so you can place it anywhere in your component tree.
+ *
+ * `event.value` is typed as `any` since the interrupt payload shape depends on your agent.
+ * Type-narrow it in your callbacks (e.g. `handler`, `enabled`, `render`) as needed.
+ *
+ * @typeParam TResult - Inferred from `handler` return type. Exposed as `result` in `render`.
+ * @param config - Interrupt configuration (renderer, optional handler/filter, and render mode).
+ * @returns When `renderInChat` is `false`, returns the interrupt element (or `null` when idle).
+ * Otherwise returns `void` and publishes the element into chat. In `render`, `result` is always
+ * either the handler's resolved return value or `null` (including when no handler is provided,
+ * when filtering skips the interrupt, or when handler execution fails).
+ *
+ * @example
+ * ```tsx
+ * import { useInterrupt } from "@copilotkitnext/react";
+ *
+ * function InterruptUI() {
+ *   useInterrupt({
+ *     render: ({ event, resolve }) => (
+ *       <div>
+ *         <p>{event.value.question}</p>
+ *         <button onClick={() => resolve({ approved: true })}>Approve</button>
+ *         <button onClick={() => resolve({ approved: false })}>Reject</button>
+ *       </div>
+ *     ),
+ *   });
+ *
+ *   return null;
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * import { useInterrupt } from "@copilotkitnext/react";
+ *
+ * function CustomPanel() {
+ *   const interruptElement = useInterrupt({
+ *     renderInChat: false,
+ *     enabled: (event) => event.value.startsWith("approval:"),
+ *     handler: async ({ event }) => ({ label: event.value.toUpperCase() }),
+ *     render: ({ event, result, resolve }) => (
+ *       <aside>
+ *         <strong>{result?.label ?? ""}</strong>
+ *         <button onClick={() => resolve({ value: event.value })}>Continue</button>
+ *       </aside>
+ *     ),
+ *   });
+ *
+ *   return <>{interruptElement}</>;
+ * }
+ * ```
+ */
+declare function useInterrupt<TResult = never, TRenderInChat extends InterruptRenderInChat = undefined>(config: UseInterruptConfig<any, TResult, TRenderInChat>): UseInterruptReturn<TRenderInChat>;
+//#endregion
+export { UseInterruptConfig, useInterrupt };
+//# sourceMappingURL=use-interrupt.d.cts.map

package/dist/hooks/use-interrupt.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-interrupt.d.cts","names":[],"sources":["../../src/hooks/use-interrupt.tsx"],"mappings":";;;;KAaK,kBAAA,qBACH,KAAA,EAAO,qBAAA,CAAsB,MAAA,MAC1B,OAAA,GAAU,WAAA,CAAY,OAAA;AAAA,KAEtB,0BAAA,aAAuC,QAAA,cACvC,IAAA,+BAED,OAAA,SAAgB,WAAA,oBACd,SAAA,UACA,OAAA;AAAA,KAGD,eAAA,oBAAmC,0BAAA,CACtC,kBAAA,CAAmB,MAAA,EAAQ,OAAA;AAAA,KAGxB,qBAAA;AAAA,KAEA,kBAAA,uBAAyC,qBAAA,IAC5C,aAAA,iBACI,KAAA,CAAM,YAAA,UACN,aAAA,mCAEE,KAAA,CAAM,YAAA;;;;UAeJ,sBAAA;EApCgB;;;;;;EA2CxB,MAAA,GACE,KAAA,EAAO,oBAAA,CAAqB,MAAA,EAAQ,eAAA,CAAgB,MAAA,EAAQ,OAAA,OACzD,KAAA,CAAM,YAAA;EA7CE;;;;AAAmB;;EAoDhC,OAAA,GAAU,kBAAA,CAAmB,MAAA,EAAQ,OAAA;EAlDK;;;;EAuD1C,OAAA,IAAW,KAAA,EAAO,cAAA,CAAe,MAAA;EAlDtB;EAoDX,OAAA;AAAA;AAAA,KA2BU,kBAAA,0DAGY,qBAAA,gBACpB,sBAAA,CAAuB,MAAA,EAAQ,OAAA;EA/EN,8HAiF3B,YAAA,GAAe,aAAA;AAAA;;;;;;;;;;;AAjFmB;;;;;AAGV;;;;;;;;;;;;;;;;;;;;AAiBzB;;;;;;;;;;;;;;;;;;;;;;;;;iBA6He,YAAA,wCAEQ,qBAAA,aAAA,CAEtB,MAAA,EAAQ,kBAAA,MAAwB,OAAA,EAAS,aAAA,IACxC,kBAAA,CAAmB,aAAA"}

package/dist/hooks/use-interrupt.d.mts

@@ -0,0 +1,102 @@
+import { InterruptEvent, InterruptHandlerProps, InterruptRenderProps } from "../types/interrupt.mjs";
+import React from "react";
+
+//#region src/hooks/use-interrupt.d.ts
+type InterruptHandlerFn<TValue, TResult> = (props: InterruptHandlerProps<TValue>) => TResult | PromiseLike<TResult>;
+type InterruptResultFromHandler<THandler> = THandler extends ((...args: never[]) => infer TResult) ? TResult extends PromiseLike<infer TResolved> ? TResolved | null : TResult | null : null;
+type InterruptResult<TValue, TResult> = InterruptResultFromHandler<InterruptHandlerFn<TValue, TResult>>;
+type InterruptRenderInChat = boolean | undefined;
+type UseInterruptReturn<TRenderInChat extends InterruptRenderInChat> = TRenderInChat extends false ? React.ReactElement | null : TRenderInChat extends true | undefined ? void : React.ReactElement | null | void;
+/**
+ * Configuration options for `useInterrupt`.
+ */
+interface UseInterruptConfigBase<TValue = unknown, TResult = never> {
+  /**
+   * Render function for the interrupt UI.
+   *
+   * This is called once an interrupt is finalized and accepted by `enabled` (if provided).
+   * Use `resolve` from render props to resume the agent run with user input.
+   */
+  render: (props: InterruptRenderProps<TValue, InterruptResult<TValue, TResult>>) => React.ReactElement;
+  /**
+   * Optional pre-render handler invoked when an interrupt is received.
+   *
+   * Return either a sync value or an async value to pass into `render` as `result`.
+   * Rejecting/throwing falls back to `result = null`.
+   */
+  handler?: InterruptHandlerFn<TValue, TResult>;
+  /**
+   * Optional predicate to filter which interrupts should be handled by this hook.
+   * Return `false` to ignore an interrupt.
+   */
+  enabled?: (event: InterruptEvent<TValue>) => boolean;
+  /** Optional agent id. Defaults to the current configured chat agent. */
+  agentId?: string;
+}
+type UseInterruptConfig<TValue = unknown, TResult = never, TRenderInChat extends InterruptRenderInChat = undefined> = UseInterruptConfigBase<TValue, TResult> & {
+  /** When true (default), the interrupt UI renders inside `<CopilotChat>` automatically. Set to false to render it yourself. */renderInChat?: TRenderInChat;
+};
+/**
+ * Handles agent interrupts (`on_interrupt`) with optional filtering, preprocessing, and resume behavior.
+ *
+ * The hook listens to custom events on the active agent, stores interrupt payloads per run,
+ * and surfaces a render callback once the run finalizes. Call `resolve` from your UI to resume
+ * execution with user-provided data.
+ *
+ * - `renderInChat: true` (default): the element is published into `<CopilotChat>` and this hook returns `void`.
+ * - `renderInChat: false`: the hook returns the interrupt element so you can place it anywhere in your component tree.
+ *
+ * `event.value` is typed as `any` since the interrupt payload shape depends on your agent.
+ * Type-narrow it in your callbacks (e.g. `handler`, `enabled`, `render`) as needed.
+ *
+ * @typeParam TResult - Inferred from `handler` return type. Exposed as `result` in `render`.
+ * @param config - Interrupt configuration (renderer, optional handler/filter, and render mode).
+ * @returns When `renderInChat` is `false`, returns the interrupt element (or `null` when idle).
+ * Otherwise returns `void` and publishes the element into chat. In `render`, `result` is always
+ * either the handler's resolved return value or `null` (including when no handler is provided,
+ * when filtering skips the interrupt, or when handler execution fails).
+ *
+ * @example
+ * ```tsx
+ * import { useInterrupt } from "@copilotkitnext/react";
+ *
+ * function InterruptUI() {
+ *   useInterrupt({
+ *     render: ({ event, resolve }) => (
+ *       <div>
+ *         <p>{event.value.question}</p>
+ *         <button onClick={() => resolve({ approved: true })}>Approve</button>
+ *         <button onClick={() => resolve({ approved: false })}>Reject</button>
+ *       </div>
+ *     ),
+ *   });
+ *
+ *   return null;
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * import { useInterrupt } from "@copilotkitnext/react";
+ *
+ * function CustomPanel() {
+ *   const interruptElement = useInterrupt({
+ *     renderInChat: false,
+ *     enabled: (event) => event.value.startsWith("approval:"),
+ *     handler: async ({ event }) => ({ label: event.value.toUpperCase() }),
+ *     render: ({ event, result, resolve }) => (
+ *       <aside>
+ *         <strong>{result?.label ?? ""}</strong>
+ *         <button onClick={() => resolve({ value: event.value })}>Continue</button>
+ *       </aside>
+ *     ),
+ *   });
+ *
+ *   return <>{interruptElement}</>;
+ * }
+ * ```
+ */
+declare function useInterrupt<TResult = never, TRenderInChat extends InterruptRenderInChat = undefined>(config: UseInterruptConfig<any, TResult, TRenderInChat>): UseInterruptReturn<TRenderInChat>;
+//#endregion
+export { UseInterruptConfig, useInterrupt };
+//# sourceMappingURL=use-interrupt.d.mts.map

package/dist/hooks/use-interrupt.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-interrupt.d.mts","names":[],"sources":["../../src/hooks/use-interrupt.tsx"],"mappings":";;;;KAaK,kBAAA,qBACH,KAAA,EAAO,qBAAA,CAAsB,MAAA,MAC1B,OAAA,GAAU,WAAA,CAAY,OAAA;AAAA,KAEtB,0BAAA,aAAuC,QAAA,cACvC,IAAA,+BAED,OAAA,SAAgB,WAAA,oBACd,SAAA,UACA,OAAA;AAAA,KAGD,eAAA,oBAAmC,0BAAA,CACtC,kBAAA,CAAmB,MAAA,EAAQ,OAAA;AAAA,KAGxB,qBAAA;AAAA,KAEA,kBAAA,uBAAyC,qBAAA,IAC5C,aAAA,iBACI,KAAA,CAAM,YAAA,UACN,aAAA,mCAEE,KAAA,CAAM,YAAA;;;;UAeJ,sBAAA;EApCgB;;;;;;EA2CxB,MAAA,GACE,KAAA,EAAO,oBAAA,CAAqB,MAAA,EAAQ,eAAA,CAAgB,MAAA,EAAQ,OAAA,OACzD,KAAA,CAAM,YAAA;EA7CE;;;;AAAmB;;EAoDhC,OAAA,GAAU,kBAAA,CAAmB,MAAA,EAAQ,OAAA;EAlDK;;;;EAuD1C,OAAA,IAAW,KAAA,EAAO,cAAA,CAAe,MAAA;EAlDtB;EAoDX,OAAA;AAAA;AAAA,KA2BU,kBAAA,0DAGY,qBAAA,gBACpB,sBAAA,CAAuB,MAAA,EAAQ,OAAA;EA/EN,8HAiF3B,YAAA,GAAe,aAAA;AAAA;;;;;;;;;;;AAjFmB;;;;;AAGV;;;;;;;;;;;;;;;;;;;;AAiBzB;;;;;;;;;;;;;;;;;;;;;;;;;iBA6He,YAAA,wCAEQ,qBAAA,aAAA,CAEtB,MAAA,EAAQ,kBAAA,MAAwB,OAAA,EAAS,aAAA,IACxC,kBAAA,CAAmB,aAAA"}

package/dist/hooks/use-interrupt.mjs

@@ -0,0 +1,170 @@
+import { useCopilotKit } from "../providers/CopilotKitProvider.mjs";
+import { useAgent } from "./use-agent.mjs";
+import { useCallback, useEffect, useMemo, useState } from "react";
+
+//#region src/hooks/use-interrupt.tsx
+const INTERRUPT_EVENT_NAME = "on_interrupt";
+function isPromiseLike(value) {
+	return (typeof value === "object" || typeof value === "function") && value !== null && typeof Reflect.get(value, "then") === "function";
+}
+/**
+* Handles agent interrupts (`on_interrupt`) with optional filtering, preprocessing, and resume behavior.
+*
+* The hook listens to custom events on the active agent, stores interrupt payloads per run,
+* and surfaces a render callback once the run finalizes. Call `resolve` from your UI to resume
+* execution with user-provided data.
+*
+* - `renderInChat: true` (default): the element is published into `<CopilotChat>` and this hook returns `void`.
+* - `renderInChat: false`: the hook returns the interrupt element so you can place it anywhere in your component tree.
+*
+* `event.value` is typed as `any` since the interrupt payload shape depends on your agent.
+* Type-narrow it in your callbacks (e.g. `handler`, `enabled`, `render`) as needed.
+*
+* @typeParam TResult - Inferred from `handler` return type. Exposed as `result` in `render`.
+* @param config - Interrupt configuration (renderer, optional handler/filter, and render mode).
+* @returns When `renderInChat` is `false`, returns the interrupt element (or `null` when idle).
+* Otherwise returns `void` and publishes the element into chat. In `render`, `result` is always
+* either the handler's resolved return value or `null` (including when no handler is provided,
+* when filtering skips the interrupt, or when handler execution fails).
+*
+* @example
+* ```tsx
+* import { useInterrupt } from "@copilotkitnext/react";
+*
+* function InterruptUI() {
+*   useInterrupt({
+*     render: ({ event, resolve }) => (
+*       <div>
+*         <p>{event.value.question}</p>
+*         <button onClick={() => resolve({ approved: true })}>Approve</button>
+*         <button onClick={() => resolve({ approved: false })}>Reject</button>
+*       </div>
+*     ),
+*   });
+*
+*   return null;
+* }
+* ```
+*
+* @example
+* ```tsx
+* import { useInterrupt } from "@copilotkitnext/react";
+*
+* function CustomPanel() {
+*   const interruptElement = useInterrupt({
+*     renderInChat: false,
+*     enabled: (event) => event.value.startsWith("approval:"),
+*     handler: async ({ event }) => ({ label: event.value.toUpperCase() }),
+*     render: ({ event, result, resolve }) => (
+*       <aside>
+*         <strong>{result?.label ?? ""}</strong>
+*         <button onClick={() => resolve({ value: event.value })}>Continue</button>
+*       </aside>
+*     ),
+*   });
+*
+*   return <>{interruptElement}</>;
+* }
+* ```
+*/
+function useInterrupt(config) {
+	const { copilotkit } = useCopilotKit();
+	const { agent } = useAgent({ agentId: config.agentId });
+	const [pendingEvent, setPendingEvent] = useState(null);
+	const [handlerResult, setHandlerResult] = useState(null);
+	useEffect(() => {
+		let localInterrupt = null;
+		const subscription = agent.subscribe({
+			onCustomEvent: ({ event }) => {
+				if (event.name === INTERRUPT_EVENT_NAME) localInterrupt = {
+					name: event.name,
+					value: event.value
+				};
+			},
+			onRunStartedEvent: () => {
+				localInterrupt = null;
+				setPendingEvent(null);
+			},
+			onRunFinalized: () => {
+				if (localInterrupt) {
+					setPendingEvent(localInterrupt);
+					localInterrupt = null;
+				}
+			},
+			onRunFailed: () => {
+				localInterrupt = null;
+			}
+		});
+		return () => subscription.unsubscribe();
+	}, [agent]);
+	const resolve = useCallback((response) => {
+		setPendingEvent(null);
+		copilotkit.runAgent({
+			agent,
+			forwardedProps: { command: { resume: response } }
+		});
+	}, [agent, copilotkit]);
+	useEffect(() => {
+		if (!pendingEvent) {
+			setHandlerResult(null);
+			return;
+		}
+		if (config.enabled && !config.enabled(pendingEvent)) {
+			setHandlerResult(null);
+			return;
+		}
+		const handler = config.handler;
+		if (!handler) {
+			setHandlerResult(null);
+			return;
+		}
+		let cancelled = false;
+		const maybePromise = handler({
+			event: pendingEvent,
+			resolve
+		});
+		if (isPromiseLike(maybePromise)) Promise.resolve(maybePromise).then((resolved) => {
+			if (!cancelled) setHandlerResult(resolved);
+		}).catch(() => {
+			if (!cancelled) setHandlerResult(null);
+		});
+		else setHandlerResult(maybePromise);
+		return () => {
+			cancelled = true;
+		};
+	}, [
+		pendingEvent,
+		config.enabled,
+		config.handler,
+		resolve
+	]);
+	const element = useMemo(() => {
+		if (!pendingEvent) return null;
+		if (config.enabled && !config.enabled(pendingEvent)) return null;
+		return config.render({
+			event: pendingEvent,
+			result: handlerResult,
+			resolve
+		});
+	}, [
+		pendingEvent,
+		handlerResult,
+		config.enabled,
+		config.render,
+		resolve
+	]);
+	useEffect(() => {
+		if (config.renderInChat === false) return;
+		copilotkit.setInterruptElement(element);
+		return () => copilotkit.setInterruptElement(null);
+	}, [
+		element,
+		config.renderInChat,
+		copilotkit
+	]);
+	if (config.renderInChat === false) return element;
+}
+
+//#endregion
+export { useInterrupt };
+//# sourceMappingURL=use-interrupt.mjs.map

package/dist/hooks/use-interrupt.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-interrupt.mjs","names":[],"sources":["../../src/hooks/use-interrupt.tsx"],"sourcesContent":["import React, { useState, useEffect, useCallback, useMemo } from \"react\";\nimport { useCopilotKit } from \"@/providers/CopilotKitProvider\";\nimport { useAgent } from \"./use-agent\";\nimport type {\n  InterruptEvent,\n  InterruptRenderProps,\n  InterruptHandlerProps,\n} from \"../types/interrupt\";\n\nexport type { InterruptEvent, InterruptRenderProps, InterruptHandlerProps };\n\nconst INTERRUPT_EVENT_NAME = \"on_interrupt\";\n\ntype InterruptHandlerFn<TValue, TResult> = (\n  props: InterruptHandlerProps<TValue>,\n) => TResult | PromiseLike<TResult>;\n\ntype InterruptResultFromHandler<THandler> = THandler extends (\n  ...args: never[]\n) => infer TResult\n  ? TResult extends PromiseLike<infer TResolved>\n    ? TResolved | null\n    : TResult | null\n  : null;\n\ntype InterruptResult<TValue, TResult> = InterruptResultFromHandler<\n  InterruptHandlerFn<TValue, TResult>\n>;\n\ntype InterruptRenderInChat = boolean | undefined;\n\ntype UseInterruptReturn<TRenderInChat extends InterruptRenderInChat> =\n  TRenderInChat extends false\n    ? React.ReactElement | null\n    : TRenderInChat extends true | undefined\n      ? void\n      : React.ReactElement | null | void;\n\nexport function isPromiseLike<TValue>(\n  value: TValue | PromiseLike<TValue>,\n): value is PromiseLike<TValue> {\n  return (\n    (typeof value === \"object\" || typeof value === \"function\") &&\n    value !== null &&\n    typeof Reflect.get(value, \"then\") === \"function\"\n  );\n}\n\n/**\n * Configuration options for `useInterrupt`.\n */\ninterface UseInterruptConfigBase<TValue = unknown, TResult = never> {\n  /**\n   * Render function for the interrupt UI.\n   *\n   * This is called once an interrupt is finalized and accepted by `enabled` (if provided).\n   * Use `resolve` from render props to resume the agent run with user input.\n   */\n  render: (\n    props: InterruptRenderProps<TValue, InterruptResult<TValue, TResult>>,\n  ) => React.ReactElement;\n  /**\n   * Optional pre-render handler invoked when an interrupt is received.\n   *\n   * Return either a sync value or an async value to pass into `render` as `result`.\n   * Rejecting/throwing falls back to `result = null`.\n   */\n  handler?: InterruptHandlerFn<TValue, TResult>;\n  /**\n   * Optional predicate to filter which interrupts should be handled by this hook.\n   * Return `false` to ignore an interrupt.\n   */\n  enabled?: (event: InterruptEvent<TValue>) => boolean;\n  /** Optional agent id. Defaults to the current configured chat agent. */\n  agentId?: string;\n}\n\nexport interface UseInterruptInChatConfig<\n  TValue = unknown,\n  TResult = never,\n> extends UseInterruptConfigBase<TValue, TResult> {\n  /** When true (default), the interrupt UI renders inside `<CopilotChat>` automatically. Set to false to render it yourself. */\n  renderInChat?: true;\n}\n\nexport interface UseInterruptExternalConfig<\n  TValue = unknown,\n  TResult = never,\n> extends UseInterruptConfigBase<TValue, TResult> {\n  /** When true (default), the interrupt UI renders inside `<CopilotChat>` automatically. Set to false to render it yourself. */\n  renderInChat: false;\n}\n\nexport interface UseInterruptDynamicConfig<\n  TValue = unknown,\n  TResult = never,\n> extends UseInterruptConfigBase<TValue, TResult> {\n  /** Dynamic boolean mode. When non-literal, return type is a union. */\n  renderInChat: boolean;\n}\n\nexport type UseInterruptConfig<\n  TValue = unknown,\n  TResult = never,\n  TRenderInChat extends InterruptRenderInChat = undefined,\n> = UseInterruptConfigBase<TValue, TResult> & {\n  /** When true (default), the interrupt UI renders inside `<CopilotChat>` automatically. Set to false to render it yourself. */\n  renderInChat?: TRenderInChat;\n};\n\n/**\n * Handles agent interrupts (`on_interrupt`) with optional filtering, preprocessing, and resume behavior.\n *\n * The hook listens to custom events on the active agent, stores interrupt payloads per run,\n * and surfaces a render callback once the run finalizes. Call `resolve` from your UI to resume\n * execution with user-provided data.\n *\n * - `renderInChat: true` (default): the element is published into `<CopilotChat>` and this hook returns `void`.\n * - `renderInChat: false`: the hook returns the interrupt element so you can place it anywhere in your component tree.\n *\n * `event.value` is typed as `any` since the interrupt payload shape depends on your agent.\n * Type-narrow it in your callbacks (e.g. `handler`, `enabled`, `render`) as needed.\n *\n * @typeParam TResult - Inferred from `handler` return type. Exposed as `result` in `render`.\n * @param config - Interrupt configuration (renderer, optional handler/filter, and render mode).\n * @returns When `renderInChat` is `false`, returns the interrupt element (or `null` when idle).\n * Otherwise returns `void` and publishes the element into chat. In `render`, `result` is always\n * either the handler's resolved return value or `null` (including when no handler is provided,\n * when filtering skips the interrupt, or when handler execution fails).\n *\n * @example\n * ```tsx\n * import { useInterrupt } from \"@copilotkitnext/react\";\n *\n * function InterruptUI() {\n *   useInterrupt({\n *     render: ({ event, resolve }) => (\n *       <div>\n *         <p>{event.value.question}</p>\n *         <button onClick={() => resolve({ approved: true })}>Approve</button>\n *         <button onClick={() => resolve({ approved: false })}>Reject</button>\n *       </div>\n *     ),\n *   });\n *\n *   return null;\n * }\n * ```\n *\n * @example\n * ```tsx\n * import { useInterrupt } from \"@copilotkitnext/react\";\n *\n * function CustomPanel() {\n *   const interruptElement = useInterrupt({\n *     renderInChat: false,\n *     enabled: (event) => event.value.startsWith(\"approval:\"),\n *     handler: async ({ event }) => ({ label: event.value.toUpperCase() }),\n *     render: ({ event, result, resolve }) => (\n *       <aside>\n *         <strong>{result?.label ?? \"\"}</strong>\n *         <button onClick={() => resolve({ value: event.value })}>Continue</button>\n *       </aside>\n *     ),\n *   });\n *\n *   return <>{interruptElement}</>;\n * }\n * ```\n */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nexport function useInterrupt<\n  TResult = never,\n  TRenderInChat extends InterruptRenderInChat = undefined,\n>(\n  config: UseInterruptConfig<any, TResult, TRenderInChat>,\n): UseInterruptReturn<TRenderInChat> {\n  /* eslint-enable @typescript-eslint/no-explicit-any */\n  const { copilotkit } = useCopilotKit();\n  const { agent } = useAgent({ agentId: config.agentId });\n  const [pendingEvent, setPendingEvent] = useState<InterruptEvent | null>(null);\n  const [handlerResult, setHandlerResult] =\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    useState<InterruptResult<any, TResult>>(null);\n\n  useEffect(() => {\n    let localInterrupt: InterruptEvent | null = null;\n\n    const subscription = agent.subscribe({\n      onCustomEvent: ({ event }) => {\n        if (event.name === INTERRUPT_EVENT_NAME) {\n          localInterrupt = { name: event.name, value: event.value };\n        }\n      },\n      onRunStartedEvent: () => {\n        localInterrupt = null;\n        setPendingEvent(null);\n      },\n      onRunFinalized: () => {\n        if (localInterrupt) {\n          setPendingEvent(localInterrupt);\n          localInterrupt = null;\n        }\n      },\n      onRunFailed: () => {\n        localInterrupt = null;\n      },\n    });\n\n    return () => subscription.unsubscribe();\n  }, [agent]);\n\n  const resolve = useCallback(\n    (response: unknown) => {\n      setPendingEvent(null);\n      copilotkit.runAgent({\n        agent,\n        forwardedProps: { command: { resume: response } },\n      });\n    },\n    [agent, copilotkit],\n  );\n\n  useEffect(() => {\n    // No interrupt to process — reset any stale handler result from a previous interrupt\n    if (!pendingEvent) {\n      setHandlerResult(null);\n      return;\n    }\n    // Interrupt exists but the consumer's filter rejects it — treat as no-op\n    if (config.enabled && !config.enabled(pendingEvent)) {\n      setHandlerResult(null);\n      return;\n    }\n    const handler = config.handler;\n    // No handler provided — skip straight to rendering with a null result\n    if (!handler) {\n      setHandlerResult(null);\n      return;\n    }\n\n    let cancelled = false;\n    const maybePromise = handler({\n      event: pendingEvent,\n      resolve,\n    });\n\n    // If the handler returns a promise/thenable, wait for resolution before setting result.\n    if (isPromiseLike(maybePromise)) {\n      Promise.resolve(maybePromise)\n        .then((resolved) => {\n          if (!cancelled) setHandlerResult(resolved);\n        })\n        .catch(() => {\n          if (!cancelled) setHandlerResult(null);\n        });\n    } else {\n      setHandlerResult(maybePromise);\n    }\n\n    return () => {\n      cancelled = true;\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [pendingEvent, config.enabled, config.handler, resolve]);\n\n  const element = useMemo(() => {\n    if (!pendingEvent) return null;\n    if (config.enabled && !config.enabled(pendingEvent)) return null;\n\n    return config.render({\n      event: pendingEvent,\n      result: handlerResult,\n      resolve,\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [pendingEvent, handlerResult, config.enabled, config.render, resolve]);\n\n  // Publish to core for in-chat rendering\n  useEffect(() => {\n    if (config.renderInChat === false) return;\n    copilotkit.setInterruptElement(element);\n    return () => copilotkit.setInterruptElement(null);\n  }, [element, config.renderInChat, copilotkit]);\n\n  // Only return element when rendering outside chat\n  if (config.renderInChat === false) {\n    return element as UseInterruptReturn<TRenderInChat>;\n  }\n\n  return undefined as UseInterruptReturn<TRenderInChat>;\n}\n"],"mappings":";;;;;AAWA,MAAM,uBAAuB;AA2B7B,SAAgB,cACd,OAC8B;AAC9B,SACG,OAAO,UAAU,YAAY,OAAO,UAAU,eAC/C,UAAU,QACV,OAAO,QAAQ,IAAI,OAAO,OAAO,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+H1C,SAAgB,aAId,QACmC;CAEnC,MAAM,EAAE,eAAe,eAAe;CACtC,MAAM,EAAE,UAAU,SAAS,EAAE,SAAS,OAAO,SAAS,CAAC;CACvD,MAAM,CAAC,cAAc,mBAAmB,SAAgC,KAAK;CAC7E,MAAM,CAAC,eAAe,oBAEpB,SAAwC,KAAK;AAE/C,iBAAgB;EACd,IAAI,iBAAwC;EAE5C,MAAM,eAAe,MAAM,UAAU;GACnC,gBAAgB,EAAE,YAAY;AAC5B,QAAI,MAAM,SAAS,qBACjB,kBAAiB;KAAE,MAAM,MAAM;KAAM,OAAO,MAAM;KAAO;;GAG7D,yBAAyB;AACvB,qBAAiB;AACjB,oBAAgB,KAAK;;GAEvB,sBAAsB;AACpB,QAAI,gBAAgB;AAClB,qBAAgB,eAAe;AAC/B,sBAAiB;;;GAGrB,mBAAmB;AACjB,qBAAiB;;GAEpB,CAAC;AAEF,eAAa,aAAa,aAAa;IACtC,CAAC,MAAM,CAAC;CAEX,MAAM,UAAU,aACb,aAAsB;AACrB,kBAAgB,KAAK;AACrB,aAAW,SAAS;GAClB;GACA,gBAAgB,EAAE,SAAS,EAAE,QAAQ,UAAU,EAAE;GAClD,CAAC;IAEJ,CAAC,OAAO,WAAW,CACpB;AAED,iBAAgB;AAEd,MAAI,CAAC,cAAc;AACjB,oBAAiB,KAAK;AACtB;;AAGF,MAAI,OAAO,WAAW,CAAC,OAAO,QAAQ,aAAa,EAAE;AACnD,oBAAiB,KAAK;AACtB;;EAEF,MAAM,UAAU,OAAO;AAEvB,MAAI,CAAC,SAAS;AACZ,oBAAiB,KAAK;AACtB;;EAGF,IAAI,YAAY;EAChB,MAAM,eAAe,QAAQ;GAC3B,OAAO;GACP;GACD,CAAC;AAGF,MAAI,cAAc,aAAa,CAC7B,SAAQ,QAAQ,aAAa,CAC1B,MAAM,aAAa;AAClB,OAAI,CAAC,UAAW,kBAAiB,SAAS;IAC1C,CACD,YAAY;AACX,OAAI,CAAC,UAAW,kBAAiB,KAAK;IACtC;MAEJ,kBAAiB,aAAa;AAGhC,eAAa;AACX,eAAY;;IAGb;EAAC;EAAc,OAAO;EAAS,OAAO;EAAS;EAAQ,CAAC;CAE3D,MAAM,UAAU,cAAc;AAC5B,MAAI,CAAC,aAAc,QAAO;AAC1B,MAAI,OAAO,WAAW,CAAC,OAAO,QAAQ,aAAa,CAAE,QAAO;AAE5D,SAAO,OAAO,OAAO;GACnB,OAAO;GACP,QAAQ;GACR;GACD,CAAC;IAED;EAAC;EAAc;EAAe,OAAO;EAAS,OAAO;EAAQ;EAAQ,CAAC;AAGzE,iBAAgB;AACd,MAAI,OAAO,iBAAiB,MAAO;AACnC,aAAW,oBAAoB,QAAQ;AACvC,eAAa,WAAW,oBAAoB,KAAK;IAChD;EAAC;EAAS,OAAO;EAAc;EAAW,CAAC;AAG9C,KAAI,OAAO,iBAAiB,MAC1B,QAAO"}

package/dist/index.cjs

@@ -22,6 +22,7 @@ const require_use_agent = require('./hooks/use-agent.cjs');
 const require_use_agent_context = require('./hooks/use-agent-context.cjs');
 const require_use_suggestions = require('./hooks/use-suggestions.cjs');
 const require_use_configure_suggestions = require('./hooks/use-configure-suggestions.cjs');
+const require_use_interrupt = require('./hooks/use-interrupt.cjs');
 require('./hooks/index.cjs');
 const require_CopilotChatToolCallsView = require('./components/chat/CopilotChatToolCallsView.cjs');
 const require_CopilotChatAssistantMessage = require('./components/chat/CopilotChatAssistantMessage.cjs');
@@ -101,6 +102,7 @@ exports.useCopilotKit = require_CopilotKitProvider.useCopilotKit;
 exports.useDefaultRenderTool = require_use_default_render_tool.useDefaultRenderTool;
 exports.useFrontendTool = require_use_frontend_tool.useFrontendTool;
 exports.useHumanInTheLoop = require_use_human_in_the_loop.useHumanInTheLoop;
+exports.useInterrupt = require_use_interrupt.useInterrupt;
 exports.useRenderActivityMessage = require_use_render_activity_message.useRenderActivityMessage;
 exports.useRenderCustomMessages = require_use_render_custom_messages.useRenderCustomMessages;
 exports.useRenderTool = require_use_render_tool.useRenderTool;

package/dist/index.d.cts

@@ -28,6 +28,7 @@ import { ReactActivityMessageRenderer } from "./types/react-activity-message-ren
 import { ReactFrontendTool } from "./types/frontend-tool.cjs";
 import { ReactHumanInTheLoop } from "./types/human-in-the-loop.cjs";
 import { defineToolCallRenderer } from "./types/defineToolCallRenderer.cjs";
+import { InterruptEvent, InterruptHandlerProps, InterruptRenderProps } from "./types/interrupt.cjs";
 import "./types/index.cjs";
 import { useRenderActivityMessage } from "./hooks/use-render-activity-message.cjs";
 import { useFrontendTool } from "./hooks/use-frontend-tool.cjs";
@@ -39,9 +40,10 @@ import { UseAgentUpdate, useAgent } from "./hooks/use-agent.cjs";
 import { AgentContextInput, JsonSerializable, useAgentContext } from "./hooks/use-agent-context.cjs";
 import { useSuggestions } from "./hooks/use-suggestions.cjs";
 import { useConfigureSuggestions } from "./hooks/use-configure-suggestions.cjs";
+import { UseInterruptConfig, useInterrupt } from "./hooks/use-interrupt.cjs";
 import "./hooks/index.cjs";
 import { CopilotKitCoreReact, CopilotKitCoreReactConfig, CopilotKitCoreReactSubscriber } from "./lib/react-core.cjs";
 import { CopilotKitContextValue, CopilotKitProvider, CopilotKitProviderProps, useCopilotKit } from "./providers/CopilotKitProvider.cjs";
 import "./providers/index.cjs";
 export * from "@ag-ui/client";
-export { AgentContextInput, AudioRecorderError, AudioRecorderState, CopilotChat, CopilotChatAssistantMessage, CopilotChatAssistantMessageProps, CopilotChatAudioRecorder, CopilotChatConfigurationProvider, CopilotChatConfigurationProviderProps, CopilotChatConfigurationValue, CopilotChatInput, CopilotChatInputProps, CopilotChatLabels, CopilotChatMessageView, CopilotChatMessageViewProps, CopilotChatProps, CopilotChatReasoningMessage, CopilotChatReasoningMessageProps, CopilotChatSuggestionPill, CopilotChatSuggestionPillProps, CopilotChatSuggestionView, CopilotChatSuggestionViewProps, CopilotChatToggleButton, DefaultCloseIcon as CopilotChatToggleButtonCloseIcon, DefaultOpenIcon as CopilotChatToggleButtonOpenIcon, CopilotChatToggleButtonProps, CopilotChatToolCallsView, CopilotChatToolCallsViewProps, CopilotChatUserMessage, CopilotChatUserMessageProps, CopilotChatView, CopilotChatViewProps, CopilotKitContextValue, CopilotKitCoreReact, CopilotKitCoreReactConfig, CopilotKitCoreReactSubscriber, CopilotKitInspector, CopilotKitInspectorProps, CopilotKitProvider, CopilotKitProviderProps, CopilotModalHeader, CopilotModalHeaderProps, CopilotPopup, CopilotPopupProps, CopilotPopupView, CopilotPopupViewProps, CopilotSidebar, CopilotSidebarProps, CopilotSidebarView, CopilotSidebarViewProps, JsonSerializable, MCPAppsActivityContent, MCPAppsActivityContentSchema, MCPAppsActivityRenderer, MCPAppsActivityType, ReactActivityMessageRenderer, ReactCustomMessageRenderer, ReactCustomMessageRendererPosition, ReactFrontendTool, ReactHumanInTheLoop, ReactToolCallRenderer, ToolsMenuItem, UseAgentUpdate, WildcardToolCallRender, defineToolCallRenderer, useAgent, useAgentContext, useComponent, useConfigureSuggestions, useCopilotChatConfiguration, useCopilotKit, useDefaultRenderTool, useFrontendTool, useHumanInTheLoop, useRenderActivityMessage, useRenderCustomMessages, useRenderTool, useRenderToolCall, useSuggestions };
+export { AgentContextInput, AudioRecorderError, AudioRecorderState, CopilotChat, CopilotChatAssistantMessage, CopilotChatAssistantMessageProps, CopilotChatAudioRecorder, CopilotChatConfigurationProvider, CopilotChatConfigurationProviderProps, CopilotChatConfigurationValue, CopilotChatInput, CopilotChatInputProps, CopilotChatLabels, CopilotChatMessageView, CopilotChatMessageViewProps, CopilotChatProps, CopilotChatReasoningMessage, CopilotChatReasoningMessageProps, CopilotChatSuggestionPill, CopilotChatSuggestionPillProps, CopilotChatSuggestionView, CopilotChatSuggestionViewProps, CopilotChatToggleButton, DefaultCloseIcon as CopilotChatToggleButtonCloseIcon, DefaultOpenIcon as CopilotChatToggleButtonOpenIcon, CopilotChatToggleButtonProps, CopilotChatToolCallsView, CopilotChatToolCallsViewProps, CopilotChatUserMessage, CopilotChatUserMessageProps, CopilotChatView, CopilotChatViewProps, CopilotKitContextValue, CopilotKitCoreReact, CopilotKitCoreReactConfig, CopilotKitCoreReactSubscriber, CopilotKitInspector, CopilotKitInspectorProps, CopilotKitProvider, CopilotKitProviderProps, CopilotModalHeader, CopilotModalHeaderProps, CopilotPopup, CopilotPopupProps, CopilotPopupView, CopilotPopupViewProps, CopilotSidebar, CopilotSidebarProps, CopilotSidebarView, CopilotSidebarViewProps, InterruptEvent, InterruptHandlerProps, InterruptRenderProps, JsonSerializable, MCPAppsActivityContent, MCPAppsActivityContentSchema, MCPAppsActivityRenderer, MCPAppsActivityType, ReactActivityMessageRenderer, ReactCustomMessageRenderer, ReactCustomMessageRendererPosition, ReactFrontendTool, ReactHumanInTheLoop, ReactToolCallRenderer, ToolsMenuItem, UseAgentUpdate, UseInterruptConfig, WildcardToolCallRender, defineToolCallRenderer, useAgent, useAgentContext, useComponent, useConfigureSuggestions, useCopilotChatConfiguration, useCopilotKit, useDefaultRenderTool, useFrontendTool, useHumanInTheLoop, useInterrupt, useRenderActivityMessage, useRenderCustomMessages, useRenderTool, useRenderToolCall, useSuggestions };

package/dist/index.d.mts

@@ -28,6 +28,7 @@ import { ReactActivityMessageRenderer } from "./types/react-activity-message-ren
 import { ReactFrontendTool } from "./types/frontend-tool.mjs";
 import { ReactHumanInTheLoop } from "./types/human-in-the-loop.mjs";
 import { defineToolCallRenderer } from "./types/defineToolCallRenderer.mjs";
+import { InterruptEvent, InterruptHandlerProps, InterruptRenderProps } from "./types/interrupt.mjs";
 import "./types/index.mjs";
 import { useRenderActivityMessage } from "./hooks/use-render-activity-message.mjs";
 import { useFrontendTool } from "./hooks/use-frontend-tool.mjs";
@@ -39,9 +40,10 @@ import { UseAgentUpdate, useAgent } from "./hooks/use-agent.mjs";
 import { AgentContextInput, JsonSerializable, useAgentContext } from "./hooks/use-agent-context.mjs";
 import { useSuggestions } from "./hooks/use-suggestions.mjs";
 import { useConfigureSuggestions } from "./hooks/use-configure-suggestions.mjs";
+import { UseInterruptConfig, useInterrupt } from "./hooks/use-interrupt.mjs";
 import "./hooks/index.mjs";
 import { CopilotKitCoreReact, CopilotKitCoreReactConfig, CopilotKitCoreReactSubscriber } from "./lib/react-core.mjs";
 import { CopilotKitContextValue, CopilotKitProvider, CopilotKitProviderProps, useCopilotKit } from "./providers/CopilotKitProvider.mjs";
 import "./providers/index.mjs";
 export * from "@ag-ui/client";
-export { AgentContextInput, AudioRecorderError, AudioRecorderState, CopilotChat, CopilotChatAssistantMessage, CopilotChatAssistantMessageProps, CopilotChatAudioRecorder, CopilotChatConfigurationProvider, CopilotChatConfigurationProviderProps, CopilotChatConfigurationValue, CopilotChatInput, CopilotChatInputProps, CopilotChatLabels, CopilotChatMessageView, CopilotChatMessageViewProps, CopilotChatProps, CopilotChatReasoningMessage, CopilotChatReasoningMessageProps, CopilotChatSuggestionPill, CopilotChatSuggestionPillProps, CopilotChatSuggestionView, CopilotChatSuggestionViewProps, CopilotChatToggleButton, DefaultCloseIcon as CopilotChatToggleButtonCloseIcon, DefaultOpenIcon as CopilotChatToggleButtonOpenIcon, CopilotChatToggleButtonProps, CopilotChatToolCallsView, CopilotChatToolCallsViewProps, CopilotChatUserMessage, CopilotChatUserMessageProps, CopilotChatView, CopilotChatViewProps, CopilotKitContextValue, CopilotKitCoreReact, CopilotKitCoreReactConfig, CopilotKitCoreReactSubscriber, CopilotKitInspector, CopilotKitInspectorProps, CopilotKitProvider, CopilotKitProviderProps, CopilotModalHeader, CopilotModalHeaderProps, CopilotPopup, CopilotPopupProps, CopilotPopupView, CopilotPopupViewProps, CopilotSidebar, CopilotSidebarProps, CopilotSidebarView, CopilotSidebarViewProps, JsonSerializable, MCPAppsActivityContent, MCPAppsActivityContentSchema, MCPAppsActivityRenderer, MCPAppsActivityType, ReactActivityMessageRenderer, ReactCustomMessageRenderer, ReactCustomMessageRendererPosition, ReactFrontendTool, ReactHumanInTheLoop, ReactToolCallRenderer, ToolsMenuItem, UseAgentUpdate, WildcardToolCallRender, defineToolCallRenderer, useAgent, useAgentContext, useComponent, useConfigureSuggestions, useCopilotChatConfiguration, useCopilotKit, useDefaultRenderTool, useFrontendTool, useHumanInTheLoop, useRenderActivityMessage, useRenderCustomMessages, useRenderTool, useRenderToolCall, useSuggestions };
+export { AgentContextInput, AudioRecorderError, AudioRecorderState, CopilotChat, CopilotChatAssistantMessage, CopilotChatAssistantMessageProps, CopilotChatAudioRecorder, CopilotChatConfigurationProvider, CopilotChatConfigurationProviderProps, CopilotChatConfigurationValue, CopilotChatInput, CopilotChatInputProps, CopilotChatLabels, CopilotChatMessageView, CopilotChatMessageViewProps, CopilotChatProps, CopilotChatReasoningMessage, CopilotChatReasoningMessageProps, CopilotChatSuggestionPill, CopilotChatSuggestionPillProps, CopilotChatSuggestionView, CopilotChatSuggestionViewProps, CopilotChatToggleButton, DefaultCloseIcon as CopilotChatToggleButtonCloseIcon, DefaultOpenIcon as CopilotChatToggleButtonOpenIcon, CopilotChatToggleButtonProps, CopilotChatToolCallsView, CopilotChatToolCallsViewProps, CopilotChatUserMessage, CopilotChatUserMessageProps, CopilotChatView, CopilotChatViewProps, CopilotKitContextValue, CopilotKitCoreReact, CopilotKitCoreReactConfig, CopilotKitCoreReactSubscriber, CopilotKitInspector, CopilotKitInspectorProps, CopilotKitProvider, CopilotKitProviderProps, CopilotModalHeader, CopilotModalHeaderProps, CopilotPopup, CopilotPopupProps, CopilotPopupView, CopilotPopupViewProps, CopilotSidebar, CopilotSidebarProps, CopilotSidebarView, CopilotSidebarViewProps, InterruptEvent, InterruptHandlerProps, InterruptRenderProps, JsonSerializable, MCPAppsActivityContent, MCPAppsActivityContentSchema, MCPAppsActivityRenderer, MCPAppsActivityType, ReactActivityMessageRenderer, ReactCustomMessageRenderer, ReactCustomMessageRendererPosition, ReactFrontendTool, ReactHumanInTheLoop, ReactToolCallRenderer, ToolsMenuItem, UseAgentUpdate, UseInterruptConfig, WildcardToolCallRender, defineToolCallRenderer, useAgent, useAgentContext, useComponent, useConfigureSuggestions, useCopilotChatConfiguration, useCopilotKit, useDefaultRenderTool, useFrontendTool, useHumanInTheLoop, useInterrupt, useRenderActivityMessage, useRenderCustomMessages, useRenderTool, useRenderToolCall, useSuggestions };

package/dist/index.mjs

@@ -21,6 +21,7 @@ import { UseAgentUpdate, useAgent } from "./hooks/use-agent.mjs";
 import { useAgentContext } from "./hooks/use-agent-context.mjs";
 import { useSuggestions } from "./hooks/use-suggestions.mjs";
 import { useConfigureSuggestions } from "./hooks/use-configure-suggestions.mjs";
+import { useInterrupt } from "./hooks/use-interrupt.mjs";
 import "./hooks/index.mjs";
 import CopilotChatToolCallsView from "./components/chat/CopilotChatToolCallsView.mjs";
 import CopilotChatAssistantMessage_default from "./components/chat/CopilotChatAssistantMessage.mjs";
@@ -43,4 +44,4 @@ import "./types/index.mjs";
 
 export * from "@ag-ui/client"
 
-export { AudioRecorderError, CopilotChat, CopilotChatAssistantMessage_default as CopilotChatAssistantMessage, CopilotChatAudioRecorder, CopilotChatConfigurationProvider, CopilotChatInput_default as CopilotChatInput, CopilotChatMessageView, CopilotChatReasoningMessage_default as CopilotChatReasoningMessage, CopilotChatSuggestionPill, CopilotChatSuggestionView, CopilotChatToggleButton, DefaultCloseIcon as CopilotChatToggleButtonCloseIcon, DefaultOpenIcon as CopilotChatToggleButtonOpenIcon, CopilotChatToolCallsView, CopilotChatUserMessage_default as CopilotChatUserMessage, CopilotChatView_default as CopilotChatView, CopilotKitCoreReact, CopilotKitInspector, CopilotKitProvider, CopilotModalHeader, CopilotPopup, CopilotPopupView, CopilotSidebar, CopilotSidebarView, MCPAppsActivityContentSchema, MCPAppsActivityRenderer, MCPAppsActivityType, UseAgentUpdate, WildcardToolCallRender, defineToolCallRenderer, useAgent, useAgentContext, useComponent, useConfigureSuggestions, useCopilotChatConfiguration, useCopilotKit, useDefaultRenderTool, useFrontendTool, useHumanInTheLoop, useRenderActivityMessage, useRenderCustomMessages, useRenderTool, useRenderToolCall, useSuggestions };
+export { AudioRecorderError, CopilotChat, CopilotChatAssistantMessage_default as CopilotChatAssistantMessage, CopilotChatAudioRecorder, CopilotChatConfigurationProvider, CopilotChatInput_default as CopilotChatInput, CopilotChatMessageView, CopilotChatReasoningMessage_default as CopilotChatReasoningMessage, CopilotChatSuggestionPill, CopilotChatSuggestionView, CopilotChatToggleButton, DefaultCloseIcon as CopilotChatToggleButtonCloseIcon, DefaultOpenIcon as CopilotChatToggleButtonOpenIcon, CopilotChatToolCallsView, CopilotChatUserMessage_default as CopilotChatUserMessage, CopilotChatView_default as CopilotChatView, CopilotKitCoreReact, CopilotKitInspector, CopilotKitProvider, CopilotModalHeader, CopilotPopup, CopilotPopupView, CopilotSidebar, CopilotSidebarView, MCPAppsActivityContentSchema, MCPAppsActivityRenderer, MCPAppsActivityType, UseAgentUpdate, WildcardToolCallRender, defineToolCallRenderer, useAgent, useAgentContext, useComponent, useConfigureSuggestions, useCopilotChatConfiguration, useCopilotKit, useDefaultRenderTool, useFrontendTool, useHumanInTheLoop, useInterrupt, useRenderActivityMessage, useRenderCustomMessages, useRenderTool, useRenderToolCall, useSuggestions };