@xcanwin/manyoyo 6.2.5 → 6.2.7

package/lib/web/frontend/file-browser.js

@@ -104,6 +104,7 @@
                                 <div class="files-preview-meta" data-role="preview-meta">请选择左侧文件或目录</div>
                             </div>
                             <div class="files-preview-actions">
+                                <button type="button" class="secondary" data-action="toggle-markdown-view" hidden>查看源码</button>
                                 <button type="button" class="secondary" data-action="save" disabled>保存</button>
                             </div>
                         </header>
@@ -122,6 +123,7 @@
         const visitBtn = root.querySelector('[data-action="visit"]');
         const mkdirBtn = root.querySelector('[data-action="mkdir"]');
         const saveBtn = root.querySelector('[data-action="save"]');
+        const toggleMarkdownViewBtn = root.querySelector('[data-action="toggle-markdown-view"]');
 
         const state = {
             visible: false,
@@ -144,7 +146,8 @@
             editor: null,
             editorHost: null,
             previewReadOnly: true,
-            previewDirty: false
+            previewDirty: false,
+            markdownViewMode: 'rendered'
         };
 
         function setStatus(text) {
@@ -161,6 +164,12 @@
             state.editorHost = null;
         }
 
+        function getPreviewLanguage() {
+            return state.selectedFile
+                ? (state.selectedFile.language || inferLanguageFromPath(state.selectedFile.path))
+                : '';
+        }
+
         function isEditablePreview() {
             return Boolean(
                 state.selectedFile
@@ -168,6 +177,7 @@
                 && state.previewReadOnly === false
                 && state.historyOnly !== true
                 && state.savingFile !== true
+                && (getPreviewLanguage() !== 'markdown' || state.markdownViewMode === 'source')
             );
         }
 
@@ -179,6 +189,28 @@
             saveBtn.textContent = state.savingFile ? '保存中...' : '保存';
         }
 
+        function syncMarkdownToggleButton() {
+            if (!toggleMarkdownViewBtn) {
+                return;
+            }
+            const isMarkdown = Boolean(state.selectedFile)
+                && state.selectedFile.kind === 'text'
+                && getPreviewLanguage() === 'markdown';
+            toggleMarkdownViewBtn.hidden = !isMarkdown;
+            toggleMarkdownViewBtn.textContent = state.markdownViewMode === 'source' ? '查看渲染' : '查看源码';
+        }
+
+        function resolveMarkdownImageUrl(basePath, relativeHref) {
+            try {
+                const lastSlash = String(basePath || '').lastIndexOf('/');
+                const baseDir = lastSlash >= 0 ? basePath.slice(0, lastSlash + 1) : '/';
+                const resolvedPath = new URL(relativeHref, 'http://manyoyo-internal' + baseDir).pathname;
+                return '/api/sessions/' + encodeURIComponent(state.sessionName) + '/fs/raw?path=' + encodeURIComponent(resolvedPath);
+            } catch (e) {
+                return '';
+            }
+        }
+
         function renderPreviewEmpty(title, description) {
             state.selectedFile = null;
             state.previewReadOnly = true;
@@ -193,6 +225,7 @@
                 previewBodyNode.innerHTML = `<div class="files-empty">${escapeHtml(description)}</div>`;
             }
             destroyEditor();
+            syncMarkdownToggleButton();
             syncSaveButton();
         }
 
@@ -226,12 +259,34 @@
                 previewMetaNode.textContent = `${payload.kind === 'text' ? '文本文件' : '文件'} · ${formatBytes(payload.size)} · ${modeLabel}${payload.truncated ? ' · 已截断预览' : ''}`;
             }
             if (!previewBodyNode) {
+                syncMarkdownToggleButton();
                 syncSaveButton();
                 return;
             }
 
             if (payload.kind === 'text') {
                 const language = payload.language || inferLanguageFromPath(payload.path);
+                const showMarkdownRendered = language === 'markdown'
+                    && state.markdownViewMode !== 'source'
+                    && window.ManyoyoMarkdown
+                    && typeof window.ManyoyoMarkdown.render === 'function';
+
+                if (showMarkdownRendered) {
+                    destroyEditor();
+                    const markdownNode = document.createElement('div');
+                    markdownNode.className = 'md-content files-markdown-preview';
+                    markdownNode.innerHTML = window.ManyoyoMarkdown.render(String(payload.content || ''), {
+                        imageUrlResolver: function (relativeHref) {
+                            return resolveMarkdownImageUrl(payload.path, relativeHref);
+                        }
+                    });
+                    previewBodyNode.innerHTML = '';
+                    previewBodyNode.appendChild(markdownNode);
+                    syncMarkdownToggleButton();
+                    syncSaveButton();
+                    return;
+                }
+
                 if (window.ManyoyoCodeEditor && typeof window.ManyoyoCodeEditor.create === 'function') {
                     if (!state.editor || !state.editorHost || !previewBodyNode.contains(state.editorHost)) {
                         destroyEditor();
@@ -252,18 +307,31 @@
                         state.editor.setLanguage(language);
                         state.editor.setReadOnly(state.previewReadOnly);
                     }
+                    syncMarkdownToggleButton();
                     syncSaveButton();
                     return;
                 }
 
                 destroyEditor();
                 previewBodyNode.innerHTML = `<pre class="files-pre">${escapeHtml(String(payload.content || ''))}</pre>`;
+                syncMarkdownToggleButton();
+                syncSaveButton();
+                return;
+            }
+
+            if (payload.kind === 'image') {
+                destroyEditor();
+                const rawUrl = '/api/sessions/' + encodeURIComponent(state.sessionName) + '/fs/raw?path='
+                    + encodeURIComponent(payload.path);
+                previewBodyNode.innerHTML = `<div class="files-image-preview"><img src="${escapeHtml(rawUrl)}" alt="${escapeHtml(payload.path || '')}" /></div>`;
+                syncMarkdownToggleButton();
                 syncSaveButton();
                 return;
             }
 
             destroyEditor();
             previewBodyNode.innerHTML = `<div class="files-note">当前文件暂不支持在线预览。文件类型：${escapeHtml(payload.kind || 'unknown')}</div>`;
+            syncMarkdownToggleButton();
             syncSaveButton();
         }
 
@@ -397,6 +465,7 @@
             state.loadingFile = true;
             state.selectedPath = pathText;
             state.selectedEntry = selectedEntry;
+            state.markdownViewMode = 'rendered';
             renderList();
             renderPreviewEmpty(pathText, '正在读取文件内容...');
             try {
@@ -584,6 +653,13 @@
             });
         }
 
+        if (toggleMarkdownViewBtn) {
+            toggleMarkdownViewBtn.addEventListener('click', function () {
+                state.markdownViewMode = state.markdownViewMode === 'source' ? 'rendered' : 'source';
+                renderPreviewPayload(state.selectedFile);
+            });
+        }
+
         renderList();
 
         return {

package/lib/web/frontend/markdown-renderer.js

@@ -5,7 +5,8 @@
         configured: false,
         available: false,
         linkGuardBound: false,
-        linkOpenHandler: null
+        linkOpenHandler: null,
+        currentImageResolver: null
     };
 
     function escapeHtml(value) {
@@ -247,8 +248,14 @@
                         '[\uD83D\uDDBC\uFE0F点击查看图片:' + (safeText || escapeHtml(safeHref)) + ']'
                     );
                 }
-                // 相对路径：正常渲染为图片
-                let output = '<img src="' + escapeHtml(safeHref) + '" alt="' + escapeHtml(text || '') + '"';
+                // 相对路径：交给调用方按当前渲染上下文解析为可访问的 URL（未提供 resolver 时原样使用）
+                const resolvedHref = typeof runtime.currentImageResolver === 'function'
+                    ? runtime.currentImageResolver(safeHref)
+                    : safeHref;
+                if (!resolvedHref) {
+                    return safeText || escapeHtml(token ? token.text : text || '');
+                }
+                let output = '<img src="' + escapeHtml(resolvedHref) + '" alt="' + escapeHtml(text || '') + '"';
                 if (rawTitle) {
                     output += ' title="' + escapeHtml(rawTitle) + '"';
                 }
@@ -272,7 +279,7 @@
         return Boolean(msg && msg.mode === 'agent' && msg.role === 'assistant');
     }
 
-    function render(content) {
+    function render(content, options) {
         const source = String(content == null ? '' : content);
         if (!source) {
             return '';
@@ -284,10 +291,15 @@
         if (!markedApi) {
             return '';
         }
+        runtime.currentImageResolver = options && typeof options.imageUrlResolver === 'function'
+            ? options.imageUrlResolver
+            : null;
         try {
             return String(markedApi.parse(source) || '');
         } catch (e) {
             return '';
+        } finally {
+            runtime.currentImageResolver = null;
         }
     }
 

package/lib/web/frontend/markdown.css

@@ -1,33 +1,33 @@
-.bubble .md-content {
+.md-content {
     color: var(--text);
     font-size: 13px;
     line-height: 1.6;
     word-break: break-word;
 }
 
-.bubble .md-content > :first-child {
+.md-content > :first-child {
     margin-top: 0;
 }
 
-.bubble .md-content > :last-child {
+.md-content > :last-child {
     margin-bottom: 0;
 }
 
-.bubble .md-content p,
-.bubble .md-content ul,
-.bubble .md-content ol,
-.bubble .md-content blockquote,
-.bubble .md-content pre,
-.bubble .md-content table {
+.md-content p,
+.md-content ul,
+.md-content ol,
+.md-content blockquote,
+.md-content pre,
+.md-content table {
     margin: 0.6em 0;
 }
 
-.bubble .md-content ul,
-.bubble .md-content ol {
+.md-content ul,
+.md-content ol {
     padding-left: 1.4em;
 }
 
-.bubble .md-content code {
+.md-content code {
     font-family: var(--font-mono);
     font-size: 12px;
     padding: 1px 5px;
@@ -35,7 +35,7 @@
     background: rgba(194, 149, 79, 0.16);
 }
 
-.bubble .md-content pre {
+.md-content pre {
     border-radius: 8px;
     padding: 9px 10px;
     border: 1px solid #e6d2b7;
@@ -43,7 +43,7 @@
     overflow-x: auto;
 }
 
-.bubble .md-content pre code {
+.md-content pre code {
     background: transparent;
     border-radius: 0;
     padding: 0;
@@ -51,26 +51,26 @@
     line-height: 1.5;
 }
 
-.bubble .md-content blockquote {
+.md-content blockquote {
     margin-left: 0;
     padding-left: 10px;
     border-left: 3px solid #dcb788;
     color: #66492d;
 }
 
-.bubble .md-content table {
+.md-content table {
     border-collapse: collapse;
     width: 100%;
 }
 
-.bubble .md-content th,
-.bubble .md-content td {
+.md-content th,
+.md-content td {
     border: 1px solid #e6d2b7;
     padding: 4px 6px;
     text-align: left;
 }
 
-.bubble .md-content a {
+.md-content a {
     color: #8a4f17;
     text-decoration-line: underline;
     text-decoration-thickness: 2px;
@@ -78,7 +78,7 @@
     text-decoration-color: rgba(138, 79, 23, 0.8);
 }
 
-.bubble .md-content a:hover,
-.bubble .md-content a:focus-visible {
+.md-content a:hover,
+.md-content a:focus-visible {
     text-decoration-color: #8a4f17;
 }