();\n\n/**\n * Map a {@link ToolCallStatus} enum value to the documented string-union\n * status the {@link DefaultRenderProps} contract exposes. Unknown / future\n * enum members log a warning (once per distinct value) and fall back to\n * `\"inProgress\"`.\n */\nfunction mapToolCallStatus(\n status: ToolCallStatus,\n): DefaultRenderProps[\"status\"] {\n switch (status) {\n case ToolCallStatus.Complete:\n return \"complete\";\n case ToolCallStatus.Executing:\n return \"executing\";\n case ToolCallStatus.InProgress:\n return \"inProgress\";\n default: {\n const key = String(status);\n if (!warnedUnknownStatuses.has(key)) {\n warnedUnknownStatuses.add(key);\n console.warn(\n `[CopilotKit] Unknown ToolCallStatus \"${key}\" in default tool-call renderer; falling back to \"inProgress\".`,\n );\n }\n return \"inProgress\";\n }\n }\n}\n\n/**\n * Convert framework-internal raw renderer props (`args`, enum status) to the\n * documented DefaultRenderProps shape. Idempotent on already-documented input\n * — if the caller passes `parameters` and a string-union `status`, those win.\n */\ntype AdaptInput = {\n name?: unknown;\n toolCallId?: unknown;\n args?: unknown;\n parameters?: unknown;\n status?: unknown;\n result?: unknown;\n};\n\nfunction adaptRendererProps(raw: AdaptInput): DefaultRenderProps {\n const parameters = raw.parameters !== undefined ? raw.parameters : raw.args;\n const rawStatus = raw.status;\n const status: DefaultRenderProps[\"status\"] =\n rawStatus === \"inProgress\" ||\n rawStatus === \"executing\" ||\n rawStatus === \"complete\"\n ? rawStatus\n : mapToolCallStatus(rawStatus as ToolCallStatus);\n return {\n name: raw.name as string,\n toolCallId: raw.toolCallId as string,\n parameters,\n status,\n result: raw.result as string | undefined,\n };\n}\n\n/**\n * Guarded JSON.stringify for the expanded `` blocks. A circular reference\n * would otherwise crash the Vue render.\n */\nfunction safeStringifyForPre(value: unknown): string {\n try {\n return JSON.stringify(value, null, 2);\n } catch (err) {\n console.warn(\n \"[CopilotKit] Failed to JSON.stringify tool-call payload for default renderer; falling back to String():\",\n err,\n );\n try {\n return String(value);\n } catch (innerErr) {\n console.warn(\n \"[CopilotKit] safeStringifyForPre: value could not be stringified:\",\n innerErr,\n );\n return \"[unserializable]\";\n }\n }\n}\n\nconst DefaultToolCallRenderer = defineComponent({\n props: {\n name: {\n type: String,\n required: true,\n },\n toolCallId: {\n type: String,\n required: true,\n },\n parameters: {\n type: null,\n required: false,\n default: undefined,\n },\n status: {\n type: String as () => \"inProgress\" | \"executing\" | \"complete\",\n required: true,\n },\n result: {\n // Typeless on purpose: the renderer body handles both string results\n // and structured (object) results via `safeStringifyForPre`. Declaring\n // `type: String` would trip Vue's dev-mode prop-type warning on every\n // non-string result and make the defensive branch unreachable.\n type: null,\n required: false,\n default: undefined,\n },\n },\n setup(props) {\n const isExpanded = ref(false);\n\n return () => {\n const isActive =\n props.status === \"inProgress\" || props.status === \"executing\";\n const isComplete = props.status === \"complete\";\n const statusLabel = isActive\n ? \"Running\"\n : isComplete\n ? \"Done\"\n : props.status;\n\n return h(\n \"div\",\n {\n \"data-testid\": \"copilot-tool-render\",\n \"data-tool-name\": props.name,\n \"data-tool-call-id\": props.toolCallId,\n \"data-status\": props.status,\n \"data-args\": safeStringifyForAttr(props.parameters),\n \"data-result\": safeStringifyForAttr(props.result),\n style: { marginTop: \"8px\", paddingBottom: \"8px\" },\n },\n [\n h(\n \"div\",\n {\n style: {\n borderRadius: \"12px\",\n border: \"1px solid #e4e4e7\",\n backgroundColor: \"#fafafa\",\n padding: \"14px 16px\",\n },\n },\n [\n h(\n \"button\",\n {\n type: \"button\",\n \"aria-expanded\": String(isExpanded.value),\n onClick: () => {\n isExpanded.value = !isExpanded.value;\n },\n style: {\n width: \"100%\",\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n gap: \"10px\",\n cursor: \"pointer\",\n border: \"none\",\n padding: 0,\n margin: 0,\n background: \"transparent\",\n textAlign: \"left\",\n },\n },\n [\n h(\n \"span\",\n {\n \"data-testid\": \"copilot-tool-render-name\",\n style: { fontWeight: \"600\" },\n },\n props.name,\n ),\n h(\n \"span\",\n { \"data-testid\": \"copilot-tool-render-status\" },\n statusLabel,\n ),\n ],\n ),\n isExpanded.value\n ? h(\"div\", { style: { marginTop: \"12px\" } }, [\n h(\"div\", \"Arguments\"),\n h(\"pre\", safeStringifyForPre(props.parameters ?? {})),\n props.result !== undefined\n ? h(\"div\", [\n h(\"div\", \"Result\"),\n h(\n \"pre\",\n typeof props.result === \"string\"\n ? props.result\n : safeStringifyForPre(props.result),\n ),\n ])\n : null,\n ])\n : null,\n ],\n ),\n ],\n );\n };\n },\n});\n\nfunction safeStringifyForAttr(value: unknown): string {\n if (value === undefined || value === null) return \"\";\n if (typeof value === \"string\") return value;\n try {\n return JSON.stringify(value);\n } catch (err) {\n console.warn(\n \"[CopilotKit] Failed to JSON.stringify tool-call payload for data-* attribute; falling back to String():\",\n err,\n );\n try {\n return String(value);\n } catch (innerErr) {\n console.warn(\n \"[CopilotKit] safeStringifyForAttr: value could not be stringified:\",\n innerErr,\n );\n return \"\";\n }\n }\n}\n\nexport function useDefaultRenderTool(\n config?: {\n render?:\n | ((props: DefaultRenderProps) => VNodeChild)\n | Component;\n },\n deps?: WatchSource[],\n): void {\n const userRender = config?.render;\n\n // When the user supplies a function render, wrap it so they receive the\n // documented {@link DefaultRenderProps} shape regardless of whether the\n // call site passes `args + enum status` (CopilotChatToolCallsView's core\n // path) or `parameters + string status` (an already-adapted call site).\n // Component-typed renders are also wrapped — Vue would bind whatever attrs\n // the call site passes, which means a component-typed render would receive\n // the raw `{ args, status: }` shape instead of the documented\n // `{ parameters, status: }` shape. Wrap so the user\n // component sees `DefaultRenderProps`.\n let registeredRender:\n | ((props: DefaultRenderProps) => VNodeChild)\n | Component;\n\n if (typeof userRender === \"function\") {\n const fn = userRender as (props: DefaultRenderProps) => VNodeChild;\n registeredRender = ((rawProps: AdaptInput) => {\n const adapted = adaptRendererProps(rawProps);\n return fn(adapted);\n }) as (props: DefaultRenderProps) => VNodeChild;\n } else if (userRender) {\n const userComponent = userRender;\n registeredRender = ((rawProps: AdaptInput) => {\n const adapted = adaptRendererProps(rawProps);\n return h(userComponent as Component, {\n name: adapted.name,\n toolCallId: adapted.toolCallId,\n parameters: adapted.parameters,\n status: adapted.status,\n result: adapted.result,\n });\n }) as (props: DefaultRenderProps) => VNodeChild;\n } else {\n registeredRender = ((rawProps: AdaptInput) => {\n const adapted = adaptRendererProps(rawProps);\n return h(DefaultToolCallRenderer, {\n name: adapted.name,\n toolCallId: adapted.toolCallId,\n parameters: adapted.parameters,\n status: adapted.status,\n result: adapted.result,\n });\n }) as (props: DefaultRenderProps) => VNodeChild;\n }\n\n useRenderTool(\n {\n name: \"*\",\n render: registeredRender,\n },\n deps,\n );\n}\n","import { onScopeDispose, ref } from \"vue\";\nimport type { WatchSource } from \"vue\";\nimport { h } from \"vue\";\nimport { useCopilotKit } from \"../providers/useCopilotKit\";\nimport { useFrontendTool } from \"./use-frontend-tool\";\nimport type {\n VueFrontendTool,\n VueHumanInTheLoop,\n VueToolCallRenderer,\n VueToolCallRendererRenderProps,\n} from \"../types\";\n\n/**\n * Registers a human-in-the-loop frontend tool.\n *\n * The tool pauses execution until `respond` is called from the rendered\n * component during the `executing` phase.\n *\n * @example\n * ```ts\n * useHumanInTheLoop({\n * name: \"approveAction\",\n * parameters: z.object({ reason: z.string() }),\n * render: ApprovalCard,\n * });\n * ```\n */\nexport function useHumanInTheLoop>(\n tool: VueHumanInTheLoop,\n deps?: WatchSource[],\n) {\n const { copilotkit } = useCopilotKit();\n const resolvePromiseRef = ref<((result: unknown) => void) | null>(null);\n\n const respond = async (result: unknown) => {\n if (resolvePromiseRef.value) {\n resolvePromiseRef.value(result);\n resolvePromiseRef.value = null;\n }\n };\n\n const handler = async () => {\n return new Promise((resolve) => {\n resolvePromiseRef.value = resolve;\n });\n };\n\n const RenderComponent: VueToolCallRenderer[\"render\"] = (\n props: VueToolCallRendererRenderProps,\n ) => {\n const ToolComponent = tool.render;\n if (props.status === \"inProgress\") {\n return h(ToolComponent as Parameters[0], {\n ...props,\n name: tool.name,\n description: tool.description || \"\",\n respond: undefined,\n });\n }\n if (props.status === \"executing\") {\n return h(ToolComponent as Parameters[0], {\n ...props,\n name: tool.name,\n description: tool.description || \"\",\n respond,\n });\n }\n if (props.status === \"complete\") {\n return h(ToolComponent as Parameters[0], {\n ...props,\n name: tool.name,\n description: tool.description || \"\",\n respond: undefined,\n });\n }\n return h(ToolComponent as Parameters[0], props);\n };\n\n const frontendTool: VueFrontendTool = {\n ...tool,\n handler,\n render: RenderComponent,\n };\n\n useFrontendTool(frontendTool, deps);\n\n onScopeDispose(() => {\n copilotkit.value.removeHookRenderToolCall(tool.name, tool.agentId);\n });\n}\n","import { computed, ref, watch } from \"vue\";\nimport type { WatchSource } from \"vue\";\nimport { useCopilotKit } from \"../providers/useCopilotKit\";\nimport { useCopilotChatConfiguration } from \"../providers/useCopilotChatConfiguration\";\nimport { DEFAULT_AGENT_ID } from \"@copilotkit/shared\";\nimport type {\n DynamicSuggestionsConfig,\n Suggestion,\n StaticSuggestionsConfig,\n SuggestionsConfig,\n} from \"@copilotkit/core\";\n\ntype StaticSuggestionInput = Omit &\n Partial>;\n\ntype StaticSuggestionsConfigInput = Omit<\n StaticSuggestionsConfig,\n \"suggestions\"\n> & {\n suggestions: StaticSuggestionInput[];\n};\n\ntype SuggestionsConfigInput =\n | DynamicSuggestionsConfig\n | StaticSuggestionsConfigInput;\n\nfunction isDynamicConfig(\n config: SuggestionsConfigInput,\n): config is DynamicSuggestionsConfig {\n return \"instructions\" in config;\n}\n\nfunction normalizeStaticSuggestions(\n suggestions: StaticSuggestionInput[],\n): Suggestion[] {\n return suggestions.map((s) => ({\n ...s,\n isLoading: s.isLoading ?? false,\n }));\n}\n\n/**\n * Registers a suggestions configuration (dynamic or static) for the current\n * chat context.\n *\n * Configuration is kept in sync reactively and removed on scope cleanup.\n *\n * @example\n * ```ts\n * useConfigureSuggestions({\n * instructions: \"Suggest concise next steps for the user\",\n * available: \"always\",\n * });\n * ```\n */\nexport function useConfigureSuggestions(\n config: SuggestionsConfigInput | null | undefined,\n deps?: WatchSource[],\n): void {\n const { copilotkit } = useCopilotKit();\n const chatConfig = useCopilotChatConfiguration();\n const extraDeps = deps ?? [];\n\n const resolvedConsumerAgentId = computed(\n () => chatConfig.value?.agentId ?? DEFAULT_AGENT_ID,\n );\n const rawConsumerAgentId = computed(() =>\n config ? (config as SuggestionsConfigInput).consumerAgentId : undefined,\n );\n\n const normalizedConfig = computed(() => {\n if (\n !config ||\n (config as { available?: string }).available === \"disabled\"\n ) {\n return null;\n }\n if (isDynamicConfig(config)) {\n return { ...config };\n }\n const normalizedSuggestions = normalizeStaticSuggestions(\n config.suggestions,\n );\n return { ...config, suggestions: normalizedSuggestions };\n });\n const serializedConfig = computed(() =>\n normalizedConfig.value ? JSON.stringify(normalizedConfig.value) : null,\n );\n\n const targetAgentId = computed(() => {\n if (!normalizedConfig.value) return resolvedConsumerAgentId.value;\n const consumer = (\n normalizedConfig.value as\n | StaticSuggestionsConfig\n | DynamicSuggestionsConfig\n ).consumerAgentId;\n if (!consumer || consumer === \"*\") return resolvedConsumerAgentId.value;\n return consumer;\n });\n\n const isGlobalConfig = computed(\n () =>\n rawConsumerAgentId.value === undefined ||\n rawConsumerAgentId.value === \"*\",\n );\n const pendingGlobalReload = ref(false);\n const pendingReloadTimer = ref | null>(null);\n const previousSerializedConfig = ref(null);\n\n const flushPendingGlobalReload = () => {\n if (!pendingGlobalReload.value || !isGlobalConfig.value) {\n return;\n }\n const hasRunning = Object.values(copilotkit.value.agents ?? {}).some(\n (entry) => !!entry.agentId && entry.isRunning,\n );\n if (hasRunning) {\n pendingReloadTimer.value = setTimeout(() => {\n pendingReloadTimer.value = null;\n flushPendingGlobalReload();\n }, 0);\n return;\n }\n\n pendingGlobalReload.value = false;\n requestReload();\n };\n\n const requestReload = () => {\n if (!normalizedConfig.value) {\n return;\n }\n\n if (isGlobalConfig.value) {\n let skippedBecauseRunning = false;\n const agents = Object.values(copilotkit.value.agents ?? {});\n for (const entry of agents) {\n const aid = entry.agentId;\n if (!aid) {\n continue;\n }\n if (!entry.isRunning) {\n copilotkit.value.reloadSuggestions(aid);\n } else {\n skippedBecauseRunning = true;\n }\n }\n pendingGlobalReload.value = skippedBecauseRunning;\n if (skippedBecauseRunning && pendingReloadTimer.value === null) {\n pendingReloadTimer.value = setTimeout(() => {\n pendingReloadTimer.value = null;\n flushPendingGlobalReload();\n }, 0);\n }\n return;\n }\n\n if (targetAgentId.value) {\n copilotkit.value.reloadSuggestions(targetAgentId.value);\n }\n };\n\n watch(\n [() => copilotkit.value, serializedConfig],\n ([_core, serialized], _old, onCleanup) => {\n if (!serialized || !normalizedConfig.value) {\n return;\n }\n\n const core = copilotkit.value;\n const cfg = normalizedConfig.value;\n const id = core.addSuggestionsConfig(cfg);\n requestReload();\n\n onCleanup(() => core.removeSuggestionsConfig(id));\n },\n { immediate: true },\n );\n\n watch(\n [normalizedConfig, serializedConfig],\n ([cfg, serialized]) => {\n if (!cfg) {\n previousSerializedConfig.value = null;\n return;\n }\n\n if (serialized && previousSerializedConfig.value === serialized) {\n return;\n }\n\n if (serialized) {\n previousSerializedConfig.value = serialized;\n }\n\n requestReload();\n },\n { immediate: false },\n );\n\n watch(\n [normalizedConfig, () => extraDeps.length, ...extraDeps],\n ([cfg]) => {\n if (!cfg || extraDeps.length === 0) {\n return;\n }\n requestReload();\n },\n { immediate: true },\n );\n\n watch(\n [() => copilotkit.value, pendingGlobalReload],\n (_vals, _old, onCleanup) => {\n onCleanup(() => {\n if (pendingReloadTimer.value !== null) {\n clearTimeout(pendingReloadTimer.value);\n pendingReloadTimer.value = null;\n }\n });\n },\n { immediate: true },\n );\n\n watch(\n [() => copilotkit.value, isGlobalConfig],\n ([core, global], _old, onCleanup) => {\n if (!global) {\n return;\n }\n\n const agentSubscriptions = Object.values(core.agents ?? {})\n .filter((agent): agent is NonNullable => !!agent)\n .map((agent) =>\n agent.subscribe({\n onRunStartedEvent: flushPendingGlobalReload,\n onRunFinishedEvent: flushPendingGlobalReload,\n onRunFinalized: flushPendingGlobalReload,\n onRunFailed: flushPendingGlobalReload,\n onRunErrorEvent: flushPendingGlobalReload,\n }),\n );\n\n onCleanup(() => {\n for (const sub of agentSubscriptions) {\n sub.unsubscribe();\n }\n });\n },\n { immediate: true },\n );\n}\n","import { computed, onScopeDispose, shallowRef, watch } from \"vue\";\nimport type { ComputedRef, Ref } from \"vue\";\nimport { useCopilotKit } from \"../providers/useCopilotKit\";\nimport { useAgent } from \"./use-agent\";\nimport type {\n InterruptEvent,\n InterruptHandlerProps,\n InterruptRenderProps,\n} from \"../types/interrupt\";\n\nexport type { InterruptEvent, InterruptHandlerProps, InterruptRenderProps };\n\nconst INTERRUPT_EVENT_NAME = \"on_interrupt\";\n\ntype InterruptHandlerFn = (\n props: InterruptHandlerProps