@spacecorexdev/core 0.0.2 → 0.0.5

package/src/ui/UIFilePreview/MarkdownEditor/types.ts

@@ -0,0 +1,15 @@
+export interface MarkdownEditorProps {
+  value?: string;
+  visible?: boolean;
+  onClose?: () => void;
+  onSave?: (value: string) => void;
+  placeholder?: string;
+  readOnly?: boolean;
+  allowFullscreen?: boolean;
+  defaultPreviewMode?: boolean;
+}
+
+export interface MarkdownEditorState {
+  content: string;
+  isPreviewMode: boolean;
+}

package/src/ui/UIFilePreview/PPTXEditor/index.tsx

@@ -0,0 +1,602 @@
+import React, { useCallback, useRef, useEffect, useState } from 'react';
+import { Modal, Button, Space, message, Popconfirm, Tag } from 'antd';
+import { SaveOutlined, FilePptFilled, UploadOutlined, DeleteOutlined, CloseOutlined, CloudOutlined, CloudServerOutlined } from '@ant-design/icons';
+import { PptEditor, PptxBlobExporter, PptxParser, Presentation } from 'slidecanvas';
+import { ArrowLeft } from 'lucide-react';
+import { saveFile, loadFile, deleteFile } from '../IndexedDBUtils';
+import { exportPptxPdf } from '../filetypes/pptExportPdf';
+import { ExportDropdown } from '../ExportDropdown';
+import { downloadBlob } from '../previewUtils';
+import { CacheUserInfo } from '../../../utils/CacheUserInfo';
+import uiLoading from '../../UILoading';
+import uiConfirm from '../../UIConfirm';
+
+interface PPTXEditorProps {
+  visible: boolean;
+  hiddenClose?: boolean;
+  isCreate?: boolean; // 是否为新建模式 
+  onClose: () => void;
+  fileName: string;
+  onUpload?: (initialBlob: Blob | undefined, blob: Blob, fileName: string) => Promise<void>;
+  initialBlob?: Blob;
+  readOnly?: boolean;
+  uploadPercent?: number;
+  uploadSuccess?: boolean
+  // ---- 新增：本地文件 / 离线模式支持 ----
+  isOffline?: boolean;
+  isLocalOnly?: boolean;
+  hasUnsyncedChanges?: boolean;
+  onSaveLocalBlob?: (blob: Blob, fileName: string, markUnsynced?: boolean) => Promise<void>;
+}
+
+const PPTX_BUILTIN_TEXT_TRANSLATIONS: Record<string, string> = {
+  'Create stunning presentations in seconds.': '快速创建精美演示文稿',
+  'Start New Deck': '新建演示文稿',
+  'Upload PPTX': '上传 PPTX',
+  'Paste presentation URL...': '粘贴演示文稿链接...',
+  'Load': '加载',
+  'Supports S3, public links, and versioned assets': '支持 S3、公开链接和版本化资源',
+  'Present': '放映',
+  'Delete': '删除',
+  'Generate Image': '生成图片',
+  'Describe the image you want to create for this slide.': '描述要为当前幻灯片创建的图片。',
+  'A futuristic city in the style of cyberpunk with neon lights...': '带有霓虹灯的赛博朋克风未来城市...',
+  'Cancel': '取消',
+  'Generate': '生成',
+  'Generating...': '生成中...',
+  'Preview Image': '预览图片',
+  'Failed to load preview': '预览加载失败',
+  "The URL might be invalid or restricted. Ensure it's a valid image format.": '链接可能无效或受限，请确认它是有效的图片格式。',
+  'Insert image': '插入图片',
+  'Replace existing': '替换现有内容',
+  'Discard': '放弃',
+  'Generate Infographic': '生成信息图',
+  'Describe the infographic you want to create for this slide.': '描述要为当前幻灯片创建的信息图。',
+  'A pie chart showing market share distribution...': '展示市场份额分布的饼图...',
+  'Generating Infographic...': '正在生成信息图...',
+  'Polishing your prompt with AI...': '正在优化提示词...',
+  'Step 1: AI Refinement': '第 1 步：AI 优化',
+  'The AI has refined your selected text into a visual prompt. You can adjust it below.': 'AI 已将选中文本优化为视觉提示词，你可以在下方调整。',
+  'Preview Infographic': '预览信息图',
+  'Generated': '已生成',
+  'Generated Infographic': '已生成信息图',
+  'Insert infographic': '插入信息图',
+};
+
+export const PPTXEditor: React.FC<PPTXEditorProps> = ({ visible, hiddenClose = false, isCreate, onClose, fileName, onUpload, initialBlob, readOnly, uploadPercent, uploadSuccess, isOffline, isLocalOnly, hasUnsyncedChanges, onSaveLocalBlob }) => {
+  const presentationRef = useRef<Presentation | null>(null);
+  const editorContentRef = useRef<HTMLDivElement>(null);
+  const saveTimerRef = useRef<NodeJS.Timeout | null>(null);
+  const changeTimerRef = useRef<NodeJS.Timeout | null>(null);
+  const [initialPresentation, setInitialPresentation] = useState<Presentation | undefined>(undefined);
+  const [editorKey, setEditorKey] = useState(0);
+  const [userId, setUserId] = useState<string | null>(null);
+  const [hasLocalCache, setHasLocalCache] = useState(false);
+  const [hasUploaded, setHasUploaded] = useState(!isCreate);
+  const [loadingInitialBlob, setLoadingInitialBlob] = useState(false);
+  // 跟踪"标记为未同步"的调用是否已在本次编辑会话中执行过，避免每次 onChange 都写 IndexedDB
+  const markUnsyncedTriggeredRef = useRef(false);
+  // 跟踪编辑器是否已完成初始加载。编辑器初始化时会触发 onChange，需抑制以免误标"有修改未同步"。
+  const isEditorReadyRef = useRef(false);
+  // 跟踪当前差分上传的基准 blob（即服务器上最新的文件内容）。
+  // 上传成功后会更新为本次上传的 blob，确保下次差分基准与服务器一致。
+  const baseBlobRef = useRef<Blob | undefined>(initialBlob);
+
+  // 用 ref 跟踪这些"状态标记"属性，避免它们的变化（如保存/上传后更新标记）
+  // 触发编辑器相关 useEffect 重新执行，导致画面闪动。
+  const hasUnsyncedChangesRef = useRef(hasUnsyncedChanges);
+  const onSaveLocalBlobRef = useRef(onSaveLocalBlob);
+  hasUnsyncedChangesRef.current = hasUnsyncedChanges;
+  onSaveLocalBlobRef.current = onSaveLocalBlob;
+
+  // 获取当前登录用户
+  useEffect(() => {
+    if (visible) {
+      const getUserId = async () => {
+        try {
+          const userInfo = CacheUserInfo.currentLocalUser();
+          if (userInfo?.id) {
+            setUserId(userInfo.id);
+          } else {
+            setUserId(null);
+          }
+        } catch (error) {
+          console.error('获取用户信息失败:', error);
+          setUserId(null);
+        }
+      };
+      getUserId();
+    }
+  }, [visible]);
+
+  // 加载初始文件
+  useEffect(() => {
+    const loadInitialFile = async () => {
+      if (visible && userId) {
+        // 如果有传入的 initialBlob，优先加载它
+        if (initialBlob) {
+          try {
+            setLoadingInitialBlob(true);
+            const parser = new PptxParser();
+            
+            // 需求3：彻底移除旧缓存检查。既然有了 initialBlob，直接解析
+            const presentation = await parser.parse(initialBlob);
+            setInitialPresentation(presentation);
+            setEditorKey((prev) => prev + 1);
+            setHasLocalCache(false);
+          } catch (error) {
+            console.error('加载文件失败:', error);
+            message.error('加载文件失败');
+            setInitialPresentation(undefined);
+            setHasLocalCache(false);
+          } finally {
+            setLoadingInitialBlob(false);
+          }
+        } else if (isCreate && userId) {
+          // 需求3：新建模式下不再自动检查/加载旧的本地缓存
+          // 新建的本地文件会通过 initialBlob 从 localFiles store 传入内容
+          setInitialPresentation(undefined);
+          setHasLocalCache(false);
+        } else {
+          // 没有用户ID，重置状态
+          setInitialPresentation(undefined);
+          setHasLocalCache(false);
+        }
+      }
+    };
+
+    loadInitialFile();
+  }, [visible, fileName, userId, initialBlob, isCreate, readOnly]);
+
+  // 将 presentation 导出为 blob
+  const exportToBlob = useCallback(async (): Promise<Blob | null> => {
+    if (!presentationRef.current) {
+      message.error('编辑器未初始化');
+      return null;
+    }
+    try {
+      const exporter = new PptxBlobExporter();
+      const blob = await exporter.exportToBlob(presentationRef.current);
+      return blob;
+    } catch (error) {
+      console.error('导出失败:', error);
+      message.error('导出失败');
+      return null;
+    }
+  }, []);
+
+  // 自动保存到 IndexedDB（防抖）+ 同步 localFiles store
+  const autoSaveToIndexedDB = useCallback((presentation: Presentation) => {
+    if (!fileName || !userId) return;
+
+    // 清除之前的定时器
+    if (saveTimerRef.current) {
+      clearTimeout(saveTimerRef.current);
+    }
+
+    setHasLocalCache(true);
+
+    // 设置新的定时器保存
+    saveTimerRef.current = setTimeout(async () => {
+      try {
+        uiLoading.show({tip: '正在导出文件'});
+        await saveFile(userId, fileName, 'pptx', presentation);
+        setHasLocalCache(false);
+        // 同步更新 localFiles store，确保自动保存也持久化到 localFiles
+        const fn = onSaveLocalBlobRef.current;
+        if (fn) {
+          try {
+            const blob = await exportToBlob();
+            if (blob) {
+              await fn(blob, fileName, false);
+            }
+          } catch (err) {
+            console.warn('自动保存时同步 localFiles store 失败（不影响本地保存）:', err);
+          }
+        }
+      } catch (error) {
+        console.error('自动保存到 IndexedDB 失败:', error);
+      } finally {
+        uiLoading.hide();
+      }
+    }, 100000);
+  }, [fileName, userId, exportToBlob]);
+
+  // 清除本地缓存
+  const handleClearCache = useCallback(async () => {
+    try {
+      if (!userId) {
+        message.error('无法获取用户信息');
+        return;
+      }
+      await deleteFile(userId, fileName, 'pptx');
+      setHasLocalCache(false);
+      message.success('已清除本地缓存');
+      // 重新加载页面以清除编辑器中的数据
+      setInitialPresentation(undefined);
+      setEditorKey((prev) => prev + 1);
+    } catch (error) {
+      console.error('清除本地缓存失败:', error);
+      message.error('清除本地缓存失败');
+    }
+  }, [fileName, userId]);
+
+  // 保存到 IndexedDB
+  const handleSave = useCallback(async () => {
+    try {
+      if (!presentationRef.current) {
+        message.error('编辑器未初始化');
+        return;
+      }
+      if (!userId) {
+        message.error('无法获取用户信息');
+        return;
+      }
+
+      uiLoading.show({tip: '正在导出文件'});
+
+      await saveFile(userId, fileName, 'pptx', presentationRef.current);
+      setHasLocalCache(false);
+
+      // 通知父组件更新 localFiles store
+      const fn = onSaveLocalBlobRef.current;
+      if (fn) {
+        try {
+          const blob = await exportToBlob();
+          if (blob) {
+            await fn(blob, fileName, false);
+          }
+        } catch (err) {
+          console.warn('同步本地文件内容到 localFiles store 失败（不影响本地保存）:', err);
+        }
+      }
+
+      message.success('已保存到本地缓存');
+    } catch (error) {
+      console.error('保存到本地缓存失败:', error);
+      message.error('保存失败');
+    } finally {
+      uiLoading.hide();
+    }
+  }, [fileName, userId]);
+
+  // 上传到服务器
+  const handleUpload = useCallback(async () => {
+    if (!onUpload) {
+      message.error('未提供上传功能');
+      return;
+    }
+    try {
+      uiLoading.show({tip: '正在导出文件'});
+      const pptxBlob = await exportToBlob();
+      if (!pptxBlob) return;
+
+      // 使用 baseBlobRef 作为差分基准，而非 initialBlob。
+      // 上传成功后 baseBlobRef 会更新为本次上传的 blob，确保下次差分基准与服务端一致。
+      const baseBlob = baseBlobRef.current ?? initialBlob;
+      await onUpload(baseBlob, pptxBlob, fileName);
+
+      // 上传成功后更新差分基准，使下次上传的差分基准与服务器一致
+      baseBlobRef.current = pptxBlob;
+
+      // 上传成功后，清空本地缓存
+      if (userId) {
+        await deleteFile(userId, fileName, 'pptx');
+        setHasLocalCache(false);
+        setHasUploaded(true);
+      }
+      // 上传成功后重置"立即标记未同步"触发器，使后续编辑可再次立即触发
+      markUnsyncedTriggeredRef.current = false;
+    } catch (error) {
+      console.error('上传失败:', error);
+      message.error('上传失败');
+    } finally {
+      uiLoading.hide();
+    }
+  }, [fileName, onUpload, exportToBlob, userId, initialBlob]);
+
+  // ============================================================================
+  // 导出 PDF：
+  // slidecanvas 编辑器本身没有 PDF 能力，先导出含最新修改的 pptx blob，
+  // 再离屏挂载 @file-viewer/pptx 逐页 SVG foreignObject 光栅化直接下载 PDF。
+  // ============================================================================
+  const [exportingPdf, setExportingPdf] = useState(false);
+  const handleExportPdf = useCallback(async () => {
+    setExportingPdf(true);
+    message.loading({ key: 'ppt-export-pdf', content: '正在保存演示文稿内容…', duration: 0 });
+    try {
+      const blob = await exportToBlob();
+      if (!blob) {
+        message.error('导出失败：无法获取文档内容');
+        return;
+      }
+      await exportPptxPdf({
+        file: blob,
+        fileName,
+        onProgress: (page, total) => {
+          message.loading({ key: 'ppt-export-pdf', content: `正在导出第 ${page} / ${total} 页…`, duration: 0 });
+        },
+      });
+    } catch (error) {
+      console.error('PPT 导出 PDF 失败:', error);
+      message.error(`导出 PDF 失败：${(error as Error)?.message || '未知错误'}`);
+    } finally {
+      message.destroy('ppt-export-pdf');
+      setExportingPdf(false);
+    }
+  }, [exportToBlob, fileName]);
+
+  // 下载原始文件：直接下载上传时的原始 pptx（initialBlob），不是编辑后的内容
+  const handleDownloadOriginal = useCallback(() => {
+    if (!initialBlob) return;
+    downloadBlob(initialBlob, fileName);
+  }, [initialBlob, fileName]);
+  const onDownload = !isCreate && initialBlob ? handleDownloadOriginal : undefined;
+
+  // 监听 presentation 变化
+  const handleChange = useCallback((presentation: Presentation) => {
+    // 抑制编辑器初始化期间触发的 onChange，避免误标"有修改未同步"
+    if (!isEditorReadyRef.current) return;
+    if (changeTimerRef.current) {
+      clearTimeout(changeTimerRef.current);
+    }
+
+    // slidecanvas 可能在内部组件 render 阶段触发 onChange，延迟更新避免 React 跨组件 render 更新警告。
+    changeTimerRef.current = setTimeout(() => {
+      setHasUploaded(false);
+      presentationRef.current = presentation;
+      autoSaveToIndexedDB(presentation);
+
+      // 首次编辑（且 hasUnsyncedChanges 目前为 false）时，立即标记未同步。
+      // 上传成功后 hasUnsyncedChanges 被清除，用户继续编辑后应立即重新显示"有未同步修改"。
+      if (!markUnsyncedTriggeredRef.current && !hasUnsyncedChangesRef.current && onSaveLocalBlobRef.current) {
+        markUnsyncedTriggeredRef.current = true;
+        const fn = onSaveLocalBlobRef.current;
+        (async () => {
+          try {
+            const blob = await exportToBlob();
+            if (blob) {
+              await fn(blob, fileName);
+            } else {
+              markUnsyncedTriggeredRef.current = false;
+            }
+          } catch (err) {
+            markUnsyncedTriggeredRef.current = false;
+            console.warn('编辑时立即标记未同步失败（不影响编辑，等待自动/手动保存即可）:', err);
+          }
+        })();
+      }
+    }, 0);
+  }, [autoSaveToIndexedDB, exportToBlob, fileName]);
+
+  useEffect(() => {
+    if (!visible || !editorContentRef.current) return;
+
+    const editorRoot = editorContentRef.current;
+    const normalizeText = (value: string) => value.replace(/\s+/g, ' ').trim();
+    const translateText = (value: string) => PPTX_BUILTIN_TEXT_TRANSLATIONS[normalizeText(value)];
+    const isBuiltinExportText = (value: string) => /^export(?:\s*\(?pptx\)?)?$/i.test(normalizeText(value));
+    const isBuiltinSavedText = (value: string) => /^saved$/i.test(normalizeText(value));
+    const applyBuiltinChineseText = () => {
+      const elements = Array.from(editorRoot.querySelectorAll('button, [role="button"], span, div, input, textarea, img'));
+
+      elements.forEach((item) => {
+        const text = item.textContent || '';
+        const label = item.getAttribute('aria-label') || item.getAttribute('title') || '';
+
+        if (isBuiltinExportText(text) || isBuiltinExportText(label) || isBuiltinSavedText(text) || isBuiltinSavedText(label)) {
+          (item as HTMLElement).style.display = 'none';
+          item.setAttribute('aria-hidden', 'true');
+          return;
+        }
+
+        ['aria-label', 'title', 'placeholder', 'alt'].forEach((attributeName) => {
+          const attributeValue = item.getAttribute(attributeName);
+          const translatedValue = attributeValue ? translateText(attributeValue) : '';
+          if (translatedValue) {
+            item.setAttribute(attributeName, translatedValue);
+          }
+        });
+      });
+
+      const textWalker = document.createTreeWalker(editorRoot, NodeFilter.SHOW_TEXT);
+      let currentNode = textWalker.nextNode();
+
+      while (currentNode) {
+        const translatedValue = translateText(currentNode.nodeValue || '');
+        if (translatedValue) {
+          currentNode.nodeValue = translatedValue;
+        }
+
+        currentNode = textWalker.nextNode();
+      }
+    };
+
+    applyBuiltinChineseText();
+    const observer = new MutationObserver(applyBuiltinChineseText);
+    observer.observe(editorRoot, {
+      childList: true,
+      subtree: true,
+    });
+
+    return () => observer.disconnect();
+  }, [visible, editorKey]);
+
+  // 编辑器初始化后，延迟标记为"就绪"，让初始化期间的 onChange 事件先过去
+  useEffect(() => {
+    if (!visible || loadingInitialBlob) return;
+    const timer = setTimeout(() => {
+      isEditorReadyRef.current = true;
+    }, 2000);
+    return () => {
+      clearTimeout(timer);
+      isEditorReadyRef.current = false;
+    };
+  }, [editorKey, visible, loadingInitialBlob]);
+
+  // initialBlob 变化时（文件切换/加载）重置差分基准
+  useEffect(() => {
+    baseBlobRef.current = initialBlob;
+  }, [initialBlob]);
+
+  // Ctrl+S / Cmd+S 保存到本地缓存
+  useEffect(() => {
+    if (!visible) return;
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if ((e.ctrlKey || e.metaKey) && e.key === 's') {
+        e.preventDefault();
+        handleSave();
+      }
+    };
+    window.addEventListener('keydown', handleKeyDown);
+    return () => window.removeEventListener('keydown', handleKeyDown);
+  }, [visible, handleSave]);
+
+  // 重置状态和清理定时器（当编辑器打开/关闭时）
+  useEffect(() => {
+    if (visible) {
+      setHasUploaded(!isCreate);
+      // 重置"立即标记未同步"触发器
+      markUnsyncedTriggeredRef.current = false;
+      // 清理之前的定时器
+      if (saveTimerRef.current) {
+        clearTimeout(saveTimerRef.current);
+        saveTimerRef.current = null;
+      }
+    }
+
+    // 组件卸载时清理定时器
+    return () => {
+      if (changeTimerRef.current) {
+        clearTimeout(changeTimerRef.current);
+        changeTimerRef.current = null;
+      }
+      if (saveTimerRef.current) {
+        clearTimeout(saveTimerRef.current);
+        saveTimerRef.current = null;
+      }
+    };
+  }, [visible, isCreate]);
+
+  // 处理关闭确认
+  const handleClose = useCallback(() => {
+    // 如果没有上传过且有本地缓存，显示确认
+    if (!hasUploaded && hasLocalCache) {
+      // 直接调用 onClose，使用 Popconfirm 处理确认
+      onClose();
+    } else {
+      onClose();
+    }
+  }, [hasUploaded, hasLocalCache, onClose]);
+
+  return (
+    <Modal
+      open={visible}
+      onCancel={onClose}
+      keyboard={false}
+      closeIcon={null}
+      footer={null}
+      width="100%"
+      style={{ top: 0, maxWidth: '100vw' }}
+      styles={{
+        body: {
+          height: '100dvh',
+          padding: 0,
+        },
+      }}
+      className="ant-modal-nopadding ant-modal-fullscreen"
+      transitionName='none'
+    >
+      <div className="h-full flex flex-col bg-white p-0 m-0">
+        {/* 工具栏 */}
+        <div className={`flex items-center justify-between px-4 py-2 pr-0 border-b flex-shrink-0 ${isOffline ? 'bg-orange-50 border-orange-200' : 'bg-gray-50 border-gray-200'}`}>
+          {/* 只读模式下直接关闭，不需要提示保存 */}
+          <span>&nbsp;</span>
+          {!readOnly && <span>&nbsp;</span>}
+          <div className="flex items-center gap-2 flex-wrap min-w-[40%]">
+            {!isOffline && isLocalOnly && (
+              <Tag icon={<CloudOutlined />} color="orange" style={{ margin: 0 }}>
+                本地文件
+              </Tag>
+            )}
+            {!isOffline && !isLocalOnly && hasUnsyncedChanges && (
+              <Tag icon={<CloudOutlined />} color="warning" style={{ margin: 0 }}>
+                有未同步修改
+              </Tag>
+            )}
+            {!isOffline && !isLocalOnly && !hasUnsyncedChanges && !onUpload ? (
+              <Tag icon={<CloudServerOutlined />} color="default" style={{ margin: 0 }}>
+                同步完成
+              </Tag>
+            ) : null}
+            <FilePptFilled className="text-orange-500" />
+            <span className="text-sm font-medium">{hasLocalCache ? '*' : ''}{fileName}</span>
+          </div>
+          {!readOnly && !hiddenClose && (
+            <Space wrap={true} align="center" direction="horizontal">
+              {/* <Button icon={<DeleteOutlined />} onClick={handleClearCache}>
+                清除缓存
+              </Button> */}
+              <ExportDropdown
+                onExportPdf={handleExportPdf}
+                onDownload={onDownload}
+                exportingPdf={exportingPdf}
+                buttonProps={{ style: { paddingLeft: 4, paddingRight: 4 } }}
+              />
+              {onUpload && (
+                <Button type="text" style={{ paddingLeft: 4, paddingRight: 4 }} title="每次上传将保留一个历史版本，最多保留10个版本" icon={<UploadOutlined />} onClick={handleUpload} disabled={uploadPercent !== undefined && uploadPercent < 1}>
+                  {uploadPercent !== undefined && uploadPercent < 1 ? `上传中 ${Math.round(uploadPercent * 100)}%` : '上传'}
+                </Button>
+              )}
+              <Button type="primary" icon={<SaveOutlined />} onClick={handleSave}>
+                保存
+              </Button>
+              {(!readOnly && (hasLocalCache || !hasUploaded)) ?
+                (<Popconfirm
+                  title="确定要退出吗？"
+                  description={hasLocalCache ? "修改未保存，确定要退出吗？" : "修改未上传，确定要退出吗？"}
+                  onConfirm={onClose}
+                  okText="确定"
+                  cancelText="取消"
+                >
+                  <Button type="text" className="ml-3 mr-2" icon={<CloseOutlined className="w-6 h-6" />} />
+                </Popconfirm>) : (<CloseOutlined onClick={onClose} className='ml-3 mr-2 w-6 h-6' />)}
+            </Space>
+          )}
+          {readOnly && !hiddenClose && (
+            <Space>
+              <ExportDropdown
+                onExportPdf={handleExportPdf}
+                onDownload={onDownload}
+                exportingPdf={exportingPdf}
+                buttonProps={{ style: { paddingLeft: 4, paddingRight: 4 } }}
+              />
+              <CloseOutlined onClick={onClose} className='ml-3 mr-2 w-6 h-6' />
+            </Space>)
+          }
+          {hiddenClose && <span>&nbsp;</span>}
+        </div>
+
+        {/* SlideCanvas 编辑器容器 */}
+        <div
+          ref={editorContentRef}
+          className="relative flex-1 overflow-hidden"
+          style={{ height: 'calc(100% - 48px)', minHeight: 0 }}
+        >
+          {visible && (
+            <PptEditor
+              key={editorKey}
+              appName="PPT 编辑器"
+              width="100%"
+              height="100%"
+              initialPresentation={initialPresentation}
+              onChange={handleChange}
+            />
+          )}
+        </div>
+      </div>
+    </Modal>
+  );
+};
+
+export default PPTXEditor;

package/src/ui/UIFilePreview/RichDocEditor/exportRDocMarkdown.ts

@@ -0,0 +1,77 @@
+/**
+ * 将块文档（.rdoc）导出为 Markdown 文件。
+ *
+ * 图片块不参与导出：.rdoc 里的图片是 base64 内嵌在 JSON 中，直接写进 Markdown
+ * 会让 .md 文件体积暴涨且难以在其他编辑器里使用，因此导出时整体跳过图片块。
+ */
+
+import type { Block } from '@blocknote/core';
+
+/** 只需要改造文档为 Markdown 的能力，避免依赖编辑器的完整类型 */
+interface MarkdownSerializableEditor {
+  blocksToMarkdownLossy(blocks?: Block[]): string;
+}
+
+export interface ExportRDocMarkdownResult {
+  /** 生成的 Markdown 文本 */
+  markdown: string;
+  /** 被跳过的图片块数量 */
+  skippedImages: number;
+}
+
+const IMAGE_BLOCK_TYPE = 'image';
+
+/** 递归剔除图片块（图片也可能挂在列表项等块的 children 里） */
+const stripImageBlocks = (blocks: Block[], skipped: { count: number }): Block[] =>
+  blocks
+    .filter((block) => {
+      if ((block.type as string) === IMAGE_BLOCK_TYPE) {
+        skipped.count += 1;
+        return false;
+      }
+      return true;
+    })
+    .map((block) =>
+      block.children && block.children.length > 0
+        ? { ...block, children: stripImageBlocks(block.children, skipped) }
+        : block,
+    );
+
+const toMarkdownFileName = (fileName: string): string => {
+  const base = fileName.replace(/\.rdoc$/i, '').trim() || 'document';
+  return `${base}.md`;
+};
+
+/** 触发浏览器下载（a[download] 方式，导出量小，无需分片） */
+const downloadMarkdown = (markdown: string, fileName: string): void => {
+  const blob = new Blob([markdown], { type: 'text/markdown;charset=utf-8' });
+  const url = URL.createObjectURL(blob);
+  const anchor = document.createElement('a');
+  anchor.href = url;
+  anchor.download = toMarkdownFileName(fileName);
+  anchor.style.display = 'none';
+  document.body.appendChild(anchor);
+  anchor.click();
+  anchor.remove();
+  window.setTimeout(() => URL.revokeObjectURL(url), 0);
+};
+
+/**
+ * 将块文档导出为 Markdown 并触发浏览器下载。
+ * @throws 没有可导出内容时抛出异常，由调用方提示用户
+ */
+export const exportRDocMarkdown = (
+  editor: MarkdownSerializableEditor,
+  blocks: Block[],
+  fileName: string,
+): ExportRDocMarkdownResult => {
+  const skipped = { count: 0 };
+  const markdown = editor.blocksToMarkdownLossy(stripImageBlocks(blocks, skipped));
+
+  if (!markdown.trim()) {
+    throw new Error('没有可导出的内容（图片不参与导出）');
+  }
+
+  downloadMarkdown(markdown, fileName);
+  return { markdown, skippedImages: skipped.count };
+};