feat(ui): 权限确认对话框支持 Diff 预览

- 添加 Diff 按钮，点击可展开/折叠文件变更预览
- Server 端生成 diff 信息并传递到前端
- 默认折叠，用户可按需查看

packages/ui/src/components/PermissionDialog.tsx

@@ -15,6 +15,9 @@ import {
   X,
   Check,
   AlertTriangle,
+  ChevronDown,
+  ChevronUp,
+  Diff,
 } from 'lucide-react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { cn } from '../utils/cn';
@@ -166,6 +169,7 @@ export function PermissionDialog({
   responsive = false,
 }: PermissionDialogProps) {
   const [remember, setRemember] = useState(false);
+  const [showDiff, setShowDiff] = useState(false);
   const { requestId, permissionType, context, diff } = request;
 
   const handleAllow = () => {
@@ -205,22 +209,39 @@ export function PermissionDialog({
       case 'file':
         return (
           <div className="space-y-2">
-            <div className="flex items-center gap-2 text-sm">
-              <span className="text-fg-muted">Operation:</span>
-              <span className={cn(
-                'px-2 py-0.5 rounded text-xs font-medium',
-                context.operation === 'delete' ? 'bg-red-500/20 text-red-400' :
-                context.operation === 'write' ? 'bg-yellow-500/20 text-yellow-400' :
-                'bg-blue-500/20 text-blue-400'
-              )}>
-                {context.operation?.toUpperCase()}
-              </span>
+            <div className="flex items-center justify-between">
+              <div className="flex items-center gap-2 text-sm">
+                <span className="text-fg-muted">Operation:</span>
+                <span className={cn(
+                  'px-2 py-0.5 rounded text-xs font-medium',
+                  context.operation === 'delete' ? 'bg-red-500/20 text-red-400' :
+                  context.operation === 'write' ? 'bg-yellow-500/20 text-yellow-400' :
+                  'bg-blue-500/20 text-blue-400'
+                )}>
+                  {context.operation?.toUpperCase()}
+                </span>
+              </div>
+              {diff && (
+                <button
+                  onClick={() => setShowDiff(!showDiff)}
+                  className={cn(
+                    'flex items-center gap-1.5 px-2 py-1 rounded text-xs font-medium transition-colors',
+                    showDiff
+                      ? 'bg-blue-500/20 text-blue-400'
+                      : 'bg-surface-base text-fg-muted hover:text-fg-default hover:bg-surface-emphasis'
+                  )}
+                >
+                  <Diff size={14} />
+                  <span>Diff</span>
+                  {showDiff ? <ChevronUp size={14} /> : <ChevronDown size={14} />}
+                </button>
+              )}
             </div>
             <div className="text-sm text-fg-muted">Path:</div>
             <code className="block px-3 py-2 bg-surface-base rounded-lg font-mono text-sm text-blue-300 break-all">
               {context.path}
             </code>
-            {diff && <DiffViewer diff={diff} />}
+            {diff && showDiff && <DiffViewer diff={diff} />}
           </div>
         );