dsh-linked-workspace 0.5.12 → 0.6.0

package/lib/client.js

@@ -2057,6 +2057,22 @@ function fileIconSpec(name, isDir) {
       openFileHint: '从工作区目录树中选择文件',
       toggleDirectory: '开启/关闭联动工作区目录面板',
       closeFile: '关闭文件标签',
+      resizeDirectory: '拖动调整目录面板宽度；双击恢复默认宽度',
+      docPreview: '预览',
+      docEdit: '编辑',
+      exportPdf: '导出 PDF',
+      docPages: '页',
+      docRotate: '旋转 90°',
+      docDeletePage: '删除当前页',
+      docParagraph: '段落',
+      docTable: '表格',
+      docSheet: '工作表',
+      docSlide: '幻灯片',
+      docPdfTitle: '标题',
+      docPdfAuthor: '作者',
+      docPageOf: '第 {page} / {total} 页',
+      docExportDone: '已导出 PDF：{path}',
+      docPreviewFailed: '预览失败',
       remoteTabTitle: '远程目录',
       remoteTabDesc: '只读查看已添加的远程目录及其文件，不允许编辑。',
       remoteDirsTitle: '远程目录',
@@ -2331,6 +2347,22 @@ function fileIconSpec(name, isDir) {
       openFileHint: 'Select a file from the workspace directory tree',
       toggleDirectory: 'Show or hide the linked workspace directory panel',
       closeFile: 'Close file tab',
+      resizeDirectory: 'Drag to resize the directory panel; double-click to reset',
+      docPreview: 'Preview',
+      docEdit: 'Edit',
+      exportPdf: 'Export PDF',
+      docPages: 'pages',
+      docRotate: 'Rotate 90°',
+      docDeletePage: 'Delete current page',
+      docParagraph: 'Paragraph',
+      docTable: 'Table',
+      docSheet: 'Sheet',
+      docSlide: 'Slide',
+      docPdfTitle: 'Title',
+      docPdfAuthor: 'Author',
+      docPageOf: 'Page {page} / {total}',
+      docExportDone: 'Exported PDF: {path}',
+      docPreviewFailed: 'Preview failed',
       remoteTabTitle: 'Remote directories',
       remoteTabDesc: 'Read-only view of configured remote directories and files; editing is disabled.',
       remoteDirsTitle: 'Remote directories',
@@ -2587,6 +2619,35 @@ function fileIconSpec(name, isDir) {
       return error.message || String(error);
     }
 
+    function documentKindOf(path) {
+      var ext = String(path || '').toLowerCase().match(/\.[^./\\]+$/);
+      if (!ext) return '';
+      var value = ext[0];
+      if (value === '.md' || value === '.markdown') return 'markdown';
+      if (value === '.pdf') return 'pdf';
+      if (value === '.docx') return 'docx';
+      if (value === '.xlsx') return 'xlsx';
+      if (value === '.pptx') return 'pptx';
+      return '';
+    }
+
+    function sanitizeDocumentHtml(html) {
+      try {
+        var parsed = new DOMParser().parseFromString(String(html || ''), 'text/html');
+        parsed.querySelectorAll('script,style,iframe,object,embed,link,meta,base,form').forEach(function (node) { node.remove(); });
+        parsed.querySelectorAll('*').forEach(function (element) {
+          Array.from(element.attributes).forEach(function (attribute) {
+            if (/^on/i.test(attribute.name) || /^javascript:/i.test(attribute.value) || /^data:text\/html/i.test(attribute.value)) {
+              element.removeAttribute(attribute.name);
+            }
+          });
+        });
+        return parsed.body.innerHTML;
+      } catch (error) {
+        return '';
+      }
+    }
+
     function basename(path) {
       if (!path) return '';
       var clean = path.replace(/[\\/]+$/, '');
@@ -2934,7 +2995,38 @@ function fileIconSpec(name, isDir) {
       '.rw-ctx-backdrop{position:fixed;inset:0;z-index:70}',
       '.rw-workspace-body{display:flex;flex:1 1 auto;min-height:0;min-width:0}',
       '.rw-content-pane{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0}',
-      '.rw-directory-pane{display:flex;flex-direction:column;flex:0 0 300px;max-width:48%;min-height:0;border-left:1px solid var(--dsw-alias-border-l1)}',
+      '.rw-directory-pane{display:flex;flex-direction:column;flex:0 0 auto;max-width:60%;min-width:240px;min-height:0;border-left:1px solid var(--dsw-alias-border-l1)}',
+      '.rw-pane-resizer{flex:0 0 6px;align-self:stretch;cursor:col-resize;background:transparent;position:relative;z-index:2;touch-action:none}',
+      '.rw-doc{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;min-width:0;background:var(--dsw-alias-bg-base)}',
+      '.rw-doc-toolbar{display:flex;align-items:center;gap:6px;padding:6px 8px;border-bottom:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);flex:none;flex-wrap:wrap}',
+      '.rw-doc-body{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;overflow:auto;padding:10px}',
+      '.rw-doc-textarea{width:100%;min-height:260px;flex:1 1 auto;resize:none;border:1px solid var(--dsw-alias-border-l2);border-radius:8px;padding:10px;background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-primary);font:12.5px/18px ui-monospace,"Cascadia Code",Consolas,monospace;outline:none;box-sizing:border-box}',
+      '.rw-doc-preview{max-width:920px;margin:0 auto;color:var(--dsw-alias-label-primary);font-size:14px;line-height:1.65;overflow-wrap:anywhere}',
+      '.rw-doc-preview h1,.rw-doc-preview h2,.rw-doc-preview h3{line-height:1.3;margin:1em 0 .5em}',
+      '.rw-doc-preview pre{background:var(--dsw-alias-bg-layer-2);padding:10px;border-radius:8px;overflow:auto}',
+      '.rw-doc-preview table{border-collapse:collapse;margin:.8em 0}',
+      '.rw-doc-preview th,.rw-doc-preview td{border:1px solid var(--dsw-alias-border-l2);padding:5px 8px}',
+      '.rw-doc-preview img{max-width:100%}',
+      '.rw-doc-preview blockquote{border-left:3px solid var(--dsw-alias-border-l2);margin:0;padding-left:10px;color:var(--dsw-alias-label-secondary)}',
+      '.rw-doc-pdf-page{display:block;max-width:100%;margin:0 auto 10px;border:1px solid var(--dsw-alias-border-l2);box-shadow:0 2px 10px rgba(0,0,0,.08);background:#fff}',
+      '.rw-doc-field{display:flex;align-items:center;gap:8px;margin:6px 0}',
+      '.rw-doc-field label{font-size:11.5px;color:var(--dsw-alias-label-tertiary);min-width:38px}',
+      '.rw-doc-input{height:28px;padding:0 8px;border-radius:6px;border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-base);color:var(--dsw-alias-label-primary);font:inherit;font-size:12px;box-sizing:border-box}',
+      '.rw-doc-block{border:1px solid var(--dsw-alias-border-l1);border-radius:8px;padding:7px;margin:0 0 8px;background:var(--dsw-alias-bg-layer-1)}',
+      '.rw-doc-block-label{font-size:10px;line-height:15px;color:var(--dsw-alias-label-tertiary);margin-bottom:3px}',
+      '.rw-doc-block textarea{width:100%;min-height:52px;resize:vertical;border:0;background:transparent;color:var(--dsw-alias-label-primary);font:inherit;font-size:13px;line-height:20px;outline:none;box-sizing:border-box}',
+      '.rw-doc-table{border-collapse:collapse;width:100%;margin:0 0 10px;font-size:12px}',
+      '.rw-doc-table td{border:1px solid var(--dsw-alias-border-l2);padding:0}',
+      '.rw-doc-table input{width:100%;border:0;background:transparent;padding:4px 5px;font:inherit;color:var(--dsw-alias-label-primary);outline:none;box-sizing:border-box}',
+      '.rw-doc-tabs{display:flex;gap:3px;padding:5px;border-bottom:1px solid var(--dsw-alias-border-l1);overflow:auto;flex:none}',
+      '.rw-doc-tab{padding:2px 8px;border:1px solid transparent;border-radius:5px;background:transparent;color:var(--dsw-alias-label-secondary);font:inherit;font-size:11.5px;cursor:pointer;white-space:nowrap}',
+      '.rw-doc-tab.is-on{background:var(--dsw-alias-bg-layer-2);border-color:var(--dsw-alias-border-l2);color:var(--dsw-alias-label-primary)}',
+      '.rw-doc-grid{width:100%;border-collapse:collapse;font-size:11.5px}',
+      '.rw-doc-grid th{position:sticky;top:0;background:var(--dsw-alias-bg-layer-2);font-weight:500;color:var(--dsw-alias-label-tertiary);padding:3px 4px;border:1px solid var(--dsw-alias-border-l1);z-index:1}',
+      '.rw-doc-grid td{border:1px solid var(--dsw-alias-border-l1);padding:0;min-width:60px}',
+      '.rw-doc-grid input{width:100%;border:0;background:transparent;padding:3px 4px;font:inherit;color:var(--dsw-alias-label-primary);outline:none;box-sizing:border-box}',
+      '.rw-doc-status{display:flex;align-items:center;gap:8px;padding:4px 8px;border-top:1px solid var(--dsw-alias-border-l1);font-size:10.5px;color:var(--dsw-alias-label-tertiary);background:var(--dsw-alias-bg-layer-1);flex:none}',
+      '.rw-pane-resizer:hover,.rw-pane-resizer:active{background:var(--dsw-alias-brand-primary)}',
       '.rw-directory-head{display:flex;align-items:center;gap:6px;padding:5px 8px;font-size:10.5px;line-height:16px;letter-spacing:.03em;text-transform:uppercase;color:var(--dsw-alias-label-tertiary);background:var(--dsw-alias-bg-layer-1);border-bottom:1px solid var(--dsw-alias-border-l1);flex:none}',
       '.rw-directory-body{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}',
       '.rw-file-tabs{display:flex;align-items:stretch;gap:2px;min-height:30px;padding:3px 5px;overflow:auto;background:var(--dsw-alias-bg-layer-1);border-bottom:1px solid var(--dsw-alias-border-l1);flex:none}',
@@ -3889,6 +3981,11 @@ function fileIconSpec(name, isDir) {
       var setCache = cacheState[1];
       var pending = useRef(new Set());
 
+      useEffect(function () {
+        if (!props.refreshTick) return;
+        Array.from(expanded).forEach(function (path) { load(path, true); });
+      }, [props.refreshTick]);
+
       function toggle(path) {
         setExpanded(function (previous) {
           var next = new Set(previous);
@@ -3898,13 +3995,13 @@ function fileIconSpec(name, isDir) {
         });
       }
 
-      function load(path) {
+      function load(path, silent) {
         if (pending.current.has(path)) return;
         pending.current.add(path);
         setCache(function (previous) {
           var entries = new Map(previous.entries);
           var existing = entries.get(path) || {};
-          entries.set(path, { loading: true, error: null, entries: existing.entries || [], loaded: existing.loaded });
+          entries.set(path, { loading: !silent, error: null, entries: existing.entries || [], loaded: existing.loaded });
           return { entries: entries };
         });
         var request = props.kind === 'local'
@@ -4310,6 +4407,243 @@ function fileIconSpec(name, isDir) {
           h('button', { type: 'button', className: 'rw-btn rw-btn-sm', onClick: props.onClose }, props.t('close'))));
     }
 
+    function DocumentPane(props) {
+      var ctx = props.ctx;
+      var t = props.t;
+      var locale = props.locale;
+      var scope = props.scope;
+      var path = props.path;
+      var local = props.local === true;
+      var onSaved = props.onSaved;
+      var kind = documentKindOf(path);
+      var stateRef = useState({
+        loading: true, error: '', data: null, text: '', dirty: false, saving: false,
+        preview: false, html: '', previewLoading: false, page: 0, sheet: 0, slide: 0,
+        updates: {}, pptxUpdates: {}, rotations: {}, deleted: {}, notice: '',
+      });
+      var state = stateRef[0];
+      var setState = stateRef[1];
+
+      function patch(next) {
+        setState(function (previous) { return Object.assign({}, previous, next); });
+      }
+
+      function params(extra) {
+        var base = local ? { path: path } : Object.assign({ path: path }, scopeParams(scope));
+        return Object.assign(base, extra || {});
+      }
+
+      function load() {
+        patch({ loading: true, error: '', notice: '' });
+        apiCall('docs.read', params()).then(function (result) {
+          patch({
+            loading: false, error: '', data: result,
+            text: result.kind === 'markdown' ? String(result.text || '') : '',
+            preview: false, html: '', page: 0, sheet: 0, slide: 0,
+            updates: {}, pptxUpdates: {}, rotations: {}, deleted: {}, dirty: false,
+          });
+        }).catch(function (error) {
+          patch({ loading: false, error: messageOf(error, t, locale) });
+        });
+      }
+
+      useEffect(function () { load(); }, [path, local, scope && scope.kind, scope && scope.id]);
+
+      useEffect(function () {
+        if (typeof props.onDirtyChange === 'function') props.onDirtyChange(state.dirty);
+      }, [state.dirty]);
+
+      function save() {
+        if (state.saving) return;
+        patch({ saving: true, error: '', notice: '' });
+        var data = {};
+        if (kind === 'markdown') data = { text: state.text };
+        if (kind === 'docx' && state.data) data = { paragraphs: state.data.paragraphs || [], tables: state.data.tables || [] };
+        if (kind === 'xlsx') data = { updates: Object.keys(state.updates).map(function (key) { return state.updates[key]; }) };
+        if (kind === 'pptx') data = { updates: Object.keys(state.pptxUpdates).map(function (key) { return state.pptxUpdates[key]; }) };
+        if (kind === 'pdf' && state.data) {
+          data = {
+            metadata: state.data.metadata || {},
+            rotations: Object.keys(state.rotations).map(function (index) { return { index: Number(index), degrees: state.rotations[index] }; }),
+            deleted: Object.keys(state.deleted).filter(function (index) { return state.deleted[index]; }).map(Number),
+          };
+        }
+        apiCall('docs.write', params({ data: data, expectedMtime: state.data ? state.data.mtime : undefined })).then(function () {
+          patch({ saving: false, dirty: false, notice: t('saved') });
+          if (onSaved) onSaved();
+          load();
+        }).catch(function (error) {
+          patch({ saving: false, error: messageOf(error, t, locale) });
+        });
+      }
+
+      function showPreview() {
+        var next = !state.preview;
+        patch({ preview: next, previewLoading: next && !state.html });
+        if (!next || state.html) return;
+        apiCall('docs.mdPreview', params({ text: state.text })).then(function (result) {
+          patch({ previewLoading: false, html: sanitizeDocumentHtml(result.html) });
+        }).catch(function (error) {
+          patch({ previewLoading: false, error: messageOf(error, t, locale) });
+        });
+      }
+
+      function exportPdf() {
+        patch({ saving: true, error: '', notice: '' });
+        apiCall('docs.mdPdf', params({ text: state.text })).then(function (result) {
+          patch({ saving: false, notice: t('docExportDone', { path: result.path }) });
+          if (onSaved) onSaved();
+        }).catch(function (error) {
+          patch({ saving: false, error: messageOf(error, t, locale) });
+        });
+      }
+
+      function updateParagraph(index, value) {
+        var data = state.data || {};
+        var paragraphs = (data.paragraphs || []).slice();
+        paragraphs[index] = Object.assign({}, paragraphs[index], { text: value });
+        patch({ data: Object.assign({}, data, { paragraphs: paragraphs }), dirty: true });
+      }
+
+      function updateTableCell(tableIndex, rowIndex, cellIndex, value) {
+        var data = state.data || {};
+        var tables = (data.tables || []).map(function (rows) { return rows.map(function (row) { return row.slice(); }); });
+        if (!tables[tableIndex] || !tables[tableIndex][rowIndex]) return;
+        tables[tableIndex][rowIndex][cellIndex] = value;
+        patch({ data: Object.assign({}, data, { tables: tables }), dirty: true });
+      }
+
+      function updateCell(sheetName, cell, value) {
+        var key = sheetName + '!' + cell;
+        var updates = Object.assign({}, state.updates);
+        updates[key] = { sheet: sheetName, cell: cell, value: value };
+        patch({ updates: updates, dirty: true });
+      }
+
+      function updateSlideText(slideIndex, shapeIndex, value) {
+        var key = slideIndex + ':' + shapeIndex;
+        var updates = Object.assign({}, state.pptxUpdates);
+        updates[key] = { slide: slideIndex, shape: shapeIndex, text: value };
+        patch({ pptxUpdates: updates, dirty: true });
+      }
+
+      var toolbar = h('div', { className: 'rw-doc-toolbar' },
+        h('span', { className: 'rw-chip' }, kind.toUpperCase()),
+        h('span', { className: 'rw-hint', style: { flex: '1 1 auto', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, title: path }, path),
+        kind === 'markdown' ? h('button', { type: 'button', className: 'rw-btn rw-btn-sm', onClick: showPreview }, state.preview ? t('docEdit') : t('docPreview')) : null,
+        kind === 'markdown' ? h('button', { type: 'button', className: 'rw-btn rw-btn-sm', onClick: exportPdf, disabled: state.saving }, IconDownload(12), t('exportPdf')) : null,
+        h('button', { type: 'button', className: 'rw-btn rw-btn-sm rw-btn-primary', onClick: save, disabled: state.saving || !state.dirty }, state.saving ? Spinner(12) : IconSave(12), state.saving ? t('saving') : t('save')));
+
+      if (state.loading) {
+        return h('div', { className: 'rw-doc' }, toolbar, h('div', { className: 'rw-editor-message' }, Spinner(14), t('loading')));
+      }
+      if (state.error && !state.data) {
+        return h('div', { className: 'rw-doc' }, toolbar,
+          h('div', { className: 'rw-editor-message' },
+            h(Banner, { kind: 'error' }, state.error),
+            h('button', { type: 'button', className: 'rw-btn', onClick: load }, IconRefresh(13), t('reload'))));
+      }
+
+      var body = null;
+      if (kind === 'markdown') {
+        body = state.preview
+          ? h('div', { className: 'rw-doc-body' },
+            state.previewLoading ? h('div', { className: 'rw-editor-message' }, Spinner(14), t('loading')) : null,
+            state.html ? h('div', { className: 'rw-doc-preview', dangerouslySetInnerHTML: { __html: state.html } }) : null)
+          : h('div', { className: 'rw-doc-body' },
+            h('textarea', {
+              className: 'rw-doc-textarea', value: state.text, spellCheck: false,
+              onChange: function (event) { patch({ text: event.currentTarget.value, dirty: true, html: '' }); },
+            }));
+      } else if (kind === 'pdf' && state.data) {
+        var pages = state.data.pages || [];
+        var visible = pages.filter(function (page) { return !state.deleted[page.index]; });
+        var current = visible[Math.min(state.page, Math.max(visible.length - 1, 0))] || null;
+        body = h('div', { className: 'rw-doc-body' },
+          h('div', { className: 'rw-doc-field' },
+            h('label', null, t('docPdfTitle')),
+            h('input', { className: 'rw-doc-input', style: { flex: '1 1 auto' }, value: (state.data.metadata && state.data.metadata.title) || '', onChange: function (event) { patch({ data: Object.assign({}, state.data, { metadata: Object.assign({}, state.data.metadata, { title: event.currentTarget.value }) }), dirty: true }); } }),
+            h('label', null, t('docPdfAuthor')),
+            h('input', { className: 'rw-doc-input', style: { flex: '1 1 auto' }, value: (state.data.metadata && state.data.metadata.author) || '', onChange: function (event) { patch({ data: Object.assign({}, state.data, { metadata: Object.assign({}, state.data.metadata, { author: event.currentTarget.value }) }), dirty: true }); } })),
+          h('div', { className: 'rw-inline', style: { justifyContent: 'space-between', margin: '6px 0' } },
+            h('div', { className: 'rw-inline' },
+              h('button', { type: 'button', className: 'rw-btn rw-btn-sm', disabled: state.page <= 0, onClick: function () { patch({ page: state.page - 1 }); } }, '‹'),
+              h('span', { className: 'rw-hint' }, current ? t('docPageOf', { page: current.index + 1, total: state.data.pageCount }) : ''),
+              h('button', { type: 'button', className: 'rw-btn rw-btn-sm', disabled: state.page >= visible.length - 1, onClick: function () { patch({ page: state.page + 1 }); } }, '›')),
+            h('div', { className: 'rw-inline' },
+              h('button', { type: 'button', className: 'rw-btn rw-btn-sm', disabled: !current, onClick: function () { var rotations = Object.assign({}, state.rotations); rotations[current.index] = ((rotations[current.index] || current.rotation || 0) + 90) % 360; patch({ rotations: rotations, dirty: true }); } }, t('docRotate')),
+              h('button', { type: 'button', className: 'rw-btn rw-btn-sm rw-btn-danger', disabled: !current || visible.length <= 1, onClick: function () { var deleted = Object.assign({}, state.deleted); deleted[current.index] = true; patch({ deleted: deleted, page: Math.max(0, state.page - 1), dirty: true }); } }, t('docDeletePage')))),
+          current ? h('img', { className: 'rw-doc-pdf-page', src: current.png, style: { transform: 'rotate(' + ((state.rotations[current.index] || current.rotation || 0) % 360) + 'deg)' } }) : h('div', { className: 'rw-empty' }, t('noEntries')));
+      } else if (kind === 'docx' && state.data) {
+        var paragraphs = state.data.paragraphs || [];
+        var tables = state.data.tables || [];
+        body = h('div', { className: 'rw-doc-body' },
+          paragraphs.map(function (paragraph, index) {
+            return h('div', { key: 'p' + index, className: 'rw-doc-block' },
+              h('div', { className: 'rw-doc-block-label' }, (paragraph.style || t('docParagraph')) + ' · ' + (index + 1)),
+              h('textarea', { value: paragraph.text || '', onChange: function (event) { updateParagraph(index, event.currentTarget.value); } }));
+          }),
+          tables.map(function (rows, tableIndex) {
+            return h('div', { key: 't' + tableIndex },
+              h('div', { className: 'rw-doc-block-label' }, t('docTable') + ' ' + (tableIndex + 1)),
+              h('table', { className: 'rw-doc-table' }, h('tbody', null,
+                rows.map(function (row, rowIndex) {
+                  return h('tr', { key: rowIndex }, row.map(function (cell, cellIndex) {
+                    return h('td', { key: cellIndex }, h('input', { value: cell || '', onChange: function (event) { updateTableCell(tableIndex, rowIndex, cellIndex, event.currentTarget.value); } }));
+                  }));
+                }))));
+          }));
+      } else if (kind === 'xlsx' && state.data) {
+        var sheets = state.data.sheets || [];
+        var active = sheets[Math.min(state.sheet, Math.max(sheets.length - 1, 0))] || { name: '', rows: [] };
+        var columns = Math.max(active.maxCol || 0, 8);
+        var header = h('tr', null, h('th', null, ''), Array.from({ length: columns }, function (_, index) { return h('th', { key: index }, String.fromCharCode(65 + index)); }));
+        var gridRows = (active.rows || []).map(function (row, rowIndex) {
+          return h('tr', { key: rowIndex },
+            h('th', null, String(rowIndex + 1)),
+            Array.from({ length: columns }, function (_, colIndex) {
+              var cell = String.fromCharCode(65 + colIndex) + (rowIndex + 1);
+              var value = row[colIndex];
+              return h('td', { key: colIndex }, h('input', {
+                value: value === null || value === undefined ? '' : String(value),
+                onChange: function (event) { updateCell(active.name, cell, event.currentTarget.value); },
+              }));
+            }));
+        });
+        body = h('div', { className: 'rw-doc-body', style: { padding: 0, overflow: 'hidden' } },
+          h('div', { className: 'rw-doc-tabs' }, sheets.map(function (sheet, index) {
+            return h('button', { key: sheet.name, type: 'button', className: 'rw-doc-tab' + (index === state.sheet ? ' is-on' : ''), onClick: function () { patch({ sheet: index }); } }, sheet.name);
+          })),
+          h('div', { style: { flex: '1 1 auto', overflow: 'auto', padding: 8 } },
+            h('table', { className: 'rw-doc-grid' },
+              h('thead', null, header),
+              h('tbody', null, gridRows))));
+      } else if (kind === 'pptx' && state.data) {
+        var slides = state.data.slides || [];
+        var slide = slides[Math.min(state.slide, Math.max(slides.length - 1, 0))] || { texts: [] };
+        body = h('div', { className: 'rw-doc-body' },
+          h('div', { className: 'rw-inline', style: { justifyContent: 'space-between', marginBottom: 6 } },
+            h('div', { className: 'rw-inline' },
+              h('button', { type: 'button', className: 'rw-btn rw-btn-sm', disabled: state.slide <= 0, onClick: function () { patch({ slide: state.slide - 1 }); } }, '‹'),
+              h('span', { className: 'rw-hint' }, (state.slide + 1) + ' / ' + slides.length),
+              h('button', { type: 'button', className: 'rw-btn rw-btn-sm', disabled: state.slide >= slides.length - 1, onClick: function () { patch({ slide: state.slide + 1 }); } }, '›'))),
+          (slide.texts || []).map(function (item) {
+            return h('div', { key: item.shape, className: 'rw-doc-block' },
+              h('div', { className: 'rw-doc-block-label' }, (item.name || t('docSlide')) + ' · ' + item.shape),
+              h('textarea', { value: (state.pptxUpdates[state.slide + ':' + item.shape] || item).text || '', onChange: function (event) { updateSlideText(state.slide, item.shape, event.currentTarget.value); } }));
+          }));
+      }
+
+      return h('div', { className: 'rw-doc' }, toolbar,
+        state.notice ? h('div', { style: { padding: '6px 10px 0' } }, h(Banner, { kind: 'success' }, state.notice)) : null,
+        state.error ? h('div', { style: { padding: '6px 10px 0' } }, h(Banner, { kind: 'error' }, state.error)) : null,
+        body,
+        h('div', { className: 'rw-doc-status' },
+          h('span', null, kind.toUpperCase()),
+          h('span', null, path),
+          state.dirty ? h('span', { className: 'rw-status-chip rw-status-warn' }, t('dirty')) : null));
+    }
+
     function RemoteDirectoryTab(props) {
       var ctx = props.ctx;
       var t = props.t;
@@ -4445,10 +4779,68 @@ function fileIconSpec(name, isDir) {
       var directoryOpenState = useState(true);
       var directoryOpen = directoryOpenState[0];
       var setDirectoryOpen = directoryOpenState[1];
+      var directoryWidthState = useState(function () {
+        try {
+          var saved = parseInt(window.localStorage.getItem('dsh-linked-workspace:directory-width'), 10);
+          return saved >= 240 && saved <= 900 ? saved : 300;
+        } catch (error) { return 300; }
+      });
+      var directoryWidth = directoryWidthState[0];
+      var setDirectoryWidth = directoryWidthState[1];
+      var directoryWidthRef = useRef(directoryWidth);
+      var workbenchRef = useRef(null);
+      var localTickState = useState(0);
+      var localTick = localTickState[0];
+      var setLocalTick = localTickState[1];
       var fileDirtyState = useState({});
       var fileDirty = fileDirtyState[0];
       var setFileDirty = fileDirtyState[1];
       var directoryTabId = props.tab && props.tab.id;
+
+      useEffect(function () {
+        directoryWidthRef.current = directoryWidth;
+        try { window.localStorage.setItem('dsh-linked-workspace:directory-width', String(directoryWidth)); } catch (error) { /* storage unavailable */ }
+      }, [directoryWidth]);
+
+      useEffect(function () {
+        if (!directoryOpen) return undefined;
+        var bump = function () {
+          if (typeof document !== 'undefined' && document.visibilityState === 'hidden') return;
+          setLocalTick(function (value) { return value + 1; });
+        };
+        var timer = setInterval(bump, 4000);
+        if (timer && typeof timer.unref === 'function') timer.unref();
+        window.addEventListener('focus', bump);
+        return function () {
+          clearInterval(timer);
+          window.removeEventListener('focus', bump);
+        };
+      }, [directoryOpen, selectedKey]);
+
+      function beginResize(event) {
+        if (event.button !== undefined && event.button !== 0) return;
+        event.preventDefault();
+        var startX = event.clientX;
+        var startWidth = directoryWidthRef.current;
+        var workbench = workbenchRef.current;
+        var maxWidth = workbench ? Math.max(260, workbench.clientWidth - 320) : 720;
+        document.body.style.cursor = 'col-resize';
+        document.body.style.userSelect = 'none';
+        function move(moveEvent) {
+          var next = Math.max(240, Math.min(maxWidth, startWidth + (startX - moveEvent.clientX)));
+          setDirectoryWidth(next);
+        }
+        function finish() {
+          document.removeEventListener('pointermove', move);
+          document.removeEventListener('pointerup', finish);
+          document.removeEventListener('pointercancel', finish);
+          document.body.style.cursor = '';
+          document.body.style.userSelect = '';
+        }
+        document.addEventListener('pointermove', move);
+        document.addEventListener('pointerup', finish);
+        document.addEventListener('pointercancel', finish);
+      }
       function restoreDirectoryTab() {
         if (!sidebar || typeof sidebar.activateTab !== 'function' || !directoryTabId) return;
         setTimeout(function () {
@@ -4667,19 +5059,25 @@ function fileIconSpec(name, isDir) {
 
       function submitNew(side, dirPath, name, isDir) {
         var target = joinChildPath(dirPath, name, side);
+        var docKind = documentKindOf(name);
         var promise;
-        if (side === 'remote') {
-          promise = isDir
+        if (isDir) {
+          promise = side === 'remote'
             ? apiCall('fs.mkdir', Object.assign({ path: target }, scopeParams(scopeRef)))
-            : apiCall('fs.write', Object.assign({ path: target, content: '' }, scopeParams(scopeRef)));
+            : apiCall('local.mkdir', { path: dirPath, name: name });
+        } else if (docKind) {
+          promise = side === 'remote'
+            ? apiCall('docs.create', Object.assign({ path: target, kind: docKind }, scopeParams(scopeRef)))
+            : apiCall('docs.create', { path: target, kind: docKind });
         } else {
-          promise = isDir
-            ? apiCall('local.mkdir', { path: dirPath, name: name })
+          promise = side === 'remote'
+            ? apiCall('fs.write', Object.assign({ path: target, content: '' }, scopeParams(scopeRef)))
             : apiCall('local.newFile', { path: target });
         }
         promise.then(function () {
           showNotice('success', t('newDone'));
           refreshTree();
+          if (!isDir && docKind) openInternalFile(side, target);
         }).catch(noticeError);
       }
 
@@ -4860,7 +5258,7 @@ function fileIconSpec(name, isDir) {
       }, [searchOpen, searchQuery, selectedKey, version]);
 
       if (!selected) {
-      return h('div', { className: 'rw-workbench rw-workspace' },
+      return h('div', { className: 'rw-workbench rw-workspace', ref: workbenchRef },
           h('div', { className: 'rw-tree-scroll' },
             data.data.loading
               ? h('div', { className: 'rw-row-msg' }, Spinner(13), t('loading'))
@@ -4923,14 +5321,32 @@ function fileIconSpec(name, isDir) {
               selectedPath: selectedEntry && selectedEntry.side === 'local' ? selectedEntry.path : '',
               onSelectPath: function (info) { setSelectedEntry(Object.assign({ side: 'local' }, info)); },
               onSelect: function (filePath) { openByMode('local', filePath); },
+              refreshTick: localTick,
               onContextMenu: function (info) { setSelectedEntry(Object.assign({ side: 'local' }, info)); openContextMenu('local', info); },
             }))
             : null);
       }
 
       var activeFile = openFiles.filter(function (file) { return file.key === activeFileKey; })[0] || null;
+      var activeDocKind = activeFile ? documentKindOf(activeFile.name) : '';
       var contentArea = activeFile
-        ? h(RemoteFileEditor, {
+        ? (activeDocKind
+          ? h(DocumentPane, {
+            ctx: ctx, t: t, locale: locale,
+            scope: activeFile.side === 'remote' ? sourceScopeOf(selected) : undefined,
+            path: activeFile.path,
+            local: activeFile.side === 'local',
+            onSaved: refreshTree,
+            onDirtyChange: function (dirty) {
+              setFileDirty(function (previous) {
+                if (Boolean(previous[activeFile.key]) === Boolean(dirty)) return previous;
+                var next = Object.assign({}, previous);
+                next[activeFile.key] = Boolean(dirty);
+                return next;
+              });
+            },
+          })
+          : h(RemoteFileEditor, {
           ctx: ctx, t: t, locale: locale,
           scope: activeFile.side === 'remote' ? sourceScopeOf(selected) : undefined,
           path: activeFile.path,
@@ -4945,7 +5361,7 @@ function fileIconSpec(name, isDir) {
               return next;
             });
           },
-        })
+        }))
         : h('div', { className: 'rw-placeholder' },
           h('span', { style: { display: 'inline-flex', opacity: 0.7 } }, IconFolder(30, false)),
           h('div', { className: 'rw-placeholder-title' }, t('openFileTitle')),
@@ -5024,7 +5440,17 @@ function fileIconSpec(name, isDir) {
               : null,
             h('div', { className: 'rw-content-body' }, contentArea)),
           directoryOpen
-            ? h('div', { className: 'rw-directory-pane' },
+            ? h('div', {
+              className: 'rw-pane-resizer',
+              role: 'separator',
+              'aria-orientation': 'vertical',
+              title: t('resizeDirectory'),
+              onPointerDown: beginResize,
+              onDoubleClick: function () { setDirectoryWidth(300); },
+            })
+            : null,
+          directoryOpen
+            ? h('div', { className: 'rw-directory-pane', style: { flexBasis: directoryWidth + 'px' } },
               h('div', { className: 'rw-directory-head' },
                 IconFolder(11, false),
                 h('span', { style: { flex: '1 1 auto', minWidth: 0 } }, remoteOnly ? t('remoteTabTitle') : t('tabTitle')),