From c05e7cd74cda267c3f6f4dd85c5bacfa83621f96 Mon Sep 17 00:00:00 2001
From: Claude AI <claude@anthropic.com>
Date: Thu, 19 Mar 2026 05:11:45 +0000
Subject: [PATCH] =?UTF-8?q?fix:=20=E9=9D=99=E6=80=81=E6=AC=A2=E8=BF=8E?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E6=8C=89=E9=92=AE=E7=82=B9=E5=87=BB=E6=97=A0?=
 =?UTF-8?q?=E5=93=8D=E5=BA=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 问题：renderChildren 没有传递 emit 函数给子组件
- 修复：Card 和 Stack 组件正确传递 emit 函数
- 结果：suggestion-buttons 按钮现在可以正常发送消息

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 frontend-v2/components/JsonRenderer.tsx  |  5 +++--
 frontend-v2/lib/json-render-registry.tsx | 27 ++++++++++++++++--------
 2 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/frontend-v2/components/JsonRenderer.tsx b/frontend-v2/components/JsonRenderer.tsx
index 06b6daf..b61970b 100644
--- a/frontend-v2/components/JsonRenderer.tsx
+++ b/frontend-v2/components/JsonRenderer.tsx
@@ -187,9 +187,10 @@ export default function JsonRenderer({
             ...(actionContext && { emit: actionContext.emit }),
           };
 
-          // 为 Card 和 Stack 组件添加 renderChildren 函数
+          // 为 Card 和 Stack 组件添加 renderChildren 函数（绑定 emit）
           if (componentType === 'card' || componentType === 'stack') {
-            props.renderChildren = renderChildren;
+            const emitFn = actionContext?.emit;
+            props.renderChildren = (children: any) => renderChildren(children, emitFn);
           }
 
           return <CustomComponent key={index} {...props} />;
diff --git a/frontend-v2/lib/json-render-registry.tsx b/frontend-v2/lib/json-render-registry.tsx
index e31372e..068881f 100644
--- a/frontend-v2/lib/json-render-registry.tsx
+++ b/frontend-v2/lib/json-render-registry.tsx
@@ -12,22 +12,22 @@ import { useState } from 'react';
 // ============ React 组件实现 ============
 
 // Card 组件
-const Card = ({ title, children, className, renderChildren }: any) => (
+const Card = ({ title, children, className, renderChildren, emit }: any) => (
   <div className={`bg-white dark:bg-gray-800 rounded-lg border dark:border-gray-700 shadow-sm p-4 ${className || ''}`}>
     {title && <h3 className="text-lg font-semibold mb-3 text-gray-900 dark:text-white">{title}</h3>}
-    {renderChildren ? renderChildren(children) : null}
+    {renderChildren ? renderChildren(children, emit) : null}
   </div>
 );
 
 // Stack 组件
-const Stack = ({ direction = 'column', spacing = 2, align = 'start', children, className, renderChildren }: any) => {
+const Stack = ({ direction = 'column', spacing = 2, align = 'start', children, className, renderChildren, emit }: any) => {
   const directionClass = direction === 'row' ? 'flex-row' : 'flex-col';
   const spacingClass = spacing > 0 ? `gap-${spacing}` : '';
   const alignClass = align === 'center' ? 'items-center' : align === 'end' ? 'items-end' : align === 'stretch' ? 'items-stretch' : 'items-start';
 
   return (
     <div className={`flex ${directionClass} ${spacingClass} ${alignClass} ${className || ''}`}>
-      {renderChildren ? renderChildren(children) : null}
+      {renderChildren ? renderChildren(children, emit) : null}
     </div>
   );
 };
@@ -499,8 +499,10 @@ export const jsonRenderRegistry: Record<string, React.ComponentType<any>> = {
 /**
  * 递归渲染子组件
  * 用于 Card 和 Stack 组件中渲染 children 数组
+ * @param children - 子组件数组
+ * @param emit - ActionContext emit 函数（用于组件交互）
  */
-export function renderChildren(children: any): React.ReactNode {
+export function renderChildren(children: any, emit?: (eventName: string, payload?: any) => void): React.ReactNode {
   if (!children) return null;
   if (!Array.isArray(children)) return null;
 
@@ -512,11 +514,18 @@ export function renderChildren(children: any): React.ReactNode {
     const Component = (jsonRenderRegistry as any)[componentType];
 
     if (Component) {
-      // 如果组件需要渲染子组件，传入 renderChildren 函数
-      if (componentType === 'card' || componentType === 'stack') {
-        return <Component key={idx} {...child} renderChildren={renderChildren} />;
+      // 合并 props：原始 child props + emit 函数
+      const props: any = { ...child };
+      if (emit) {
+        props.emit = emit;
       }
-      return <Component key={idx} {...child} />;
+
+      // 如果组件需要渲染子组件，传入 renderChildren 函数（并传递 emit）
+      if (componentType === 'card' || componentType === 'stack') {
+        props.renderChildren = (grandchildren: any) => renderChildren(grandchildren, emit);
+      }
+
+      return <Component key={idx} {...props} />;
     }
 
     return (