$1');
+ html = html.replace(/\[([^\]]+)\]\((https?:\/\/[^)]+|mailto:[^)]+)\)/g, '$1');
+ html = html.replace(/\*\*\*(.+?)\*\*\*/g, '$1');
+ html = html.replace(/\*\*(.+?)\*\*/g, '$1');
+ html = html.replace(/\*(.+?)\*/g, '$1');
+ return html;
+ }
+
+ function renderMarkdown(markdown) {
+ var lines = String(markdown || '').replace(/\r\n/g, '\n').split('\n');
+ var html = [];
+ var inCode = false;
+ var code = [];
+ var inList = false;
+
+ function closeList() {
+ if (inList) {
+ html.push('');
+ inList = false;
+ }
+ }
+ function closeCode() {
+ if (inCode) {
+ html.push('' + escapeHtml(code.join('\n')) + '' + renderInline(quote[1]) + ''); + return; + } + var item = /^\s*[-*]\s+(.+)$/.exec(line); + if (item) { + if (!inList) { + html.push('
' + renderInline(line) + '
'); + }); + closeCode(); + closeList(); + return html.join('\n'); + } + + var MarkdownPreview = { + mount: function (containerEl, props, api) { + injectStyles(); + var request = props && props.request || {}; + var path = request.path || ''; + containerEl.innerHTML = ''; + containerEl.className = 'mp-root'; + containerEl.setAttribute('data-plugin-id', 'verstak.markdown-preview'); + containerEl.setAttribute('data-preview-path', path); + containerEl.appendChild(el('div', { className: 'mp-toolbar' }, [ + el('span', { className: 'mp-mode' }, ['Preview']), + el('span', { className: 'mp-path' }, [path]) + ])); + var body = el('div', { className: 'mp-loading' }, ['Loading...']); + containerEl.appendChild(body); + api.files.readText(path).then(function (text) { + body.className = 'mp-body'; + body.innerHTML = renderMarkdown(text); + }).catch(function (err) { + body.className = 'mp-error'; + body.textContent = 'Preview error: ' + (err && err.message ? err.message : String(err)); + }); + }, + unmount: function (containerEl) { + containerEl.innerHTML = ''; + } + }; + + window.VerstakPluginRegister('verstak.markdown-preview', { + components: { MarkdownPreview: MarkdownPreview } + }); +})(); diff --git a/plugins/markdown-preview/plugin.json b/plugins/markdown-preview/plugin.json new file mode 100644 index 0000000..57c89a1 --- /dev/null +++ b/plugins/markdown-preview/plugin.json @@ -0,0 +1,55 @@ +{ + "schemaVersion": 1, + "id": "verstak.markdown-preview", + "name": "Markdown Preview", + "version": "0.1.0", + "apiVersion": "0.1.0", + "description": "Read-only Markdown preview provider for vault Markdown files.", + "source": "official", + "icon": "eye", + "provides": [ + "verstak/markdown-preview/v1" + ], + "requires": [ + "verstak/core/files/v1", + "verstak/core/workbench/v1" + ], + "permissions": [ + "files.read" + ], + "frontend": { + "entry": "frontend/src/index.js" + }, + "contributes": { + "openProviders": [ + { + "id": "verstak.markdown-preview.generic", + "title": "Markdown Preview", + "priority": 80, + "component": "MarkdownPreview", + "supports": [ + { + "kind": "vault-file", + "extensions": [".md", ".markdown"], + "contexts": ["generic-markdown"], + "modes": ["view"] + } + ] + }, + { + "id": "verstak.markdown-preview.notes", + "title": "Notes Markdown Preview", + "priority": 80, + "component": "MarkdownPreview", + "supports": [ + { + "kind": "vault-file", + "extensions": [".md", ".markdown"], + "contexts": ["notes-markdown"], + "modes": ["view"] + } + ] + } + ] + } +} diff --git a/scripts/check.sh b/scripts/check.sh index 3a787a1..ee0656a 100755 --- a/scripts/check.sh +++ b/scripts/check.sh @@ -213,6 +213,8 @@ if command -v node &>/dev/null; then report "platform-test frontend components mount" $? node "$ROOT/scripts/smoke-notes-plugin.js" report "notes frontend behavior" $? + node "$ROOT/scripts/smoke-markdown-preview-plugin.js" + report "markdown-preview frontend behavior" $? node "$ROOT/scripts/smoke-files-plugin.js" report "files frontend behavior" $? node "$ROOT/scripts/smoke-browser-inbox-plugin.js" diff --git a/scripts/smoke-markdown-preview-plugin.js b/scripts/smoke-markdown-preview-plugin.js new file mode 100755 index 0000000..a66537e --- /dev/null +++ b/scripts/smoke-markdown-preview-plugin.js @@ -0,0 +1,138 @@ +#!/usr/bin/env node +const fs = require('fs'); +const path = require('path'); +const vm = require('vm'); + +const root = path.resolve(__dirname, '..'); +const sourcePath = path.join(root, 'plugins', 'markdown-preview', 'frontend', 'src', 'index.js'); +const source = fs.readFileSync(sourcePath, 'utf8'); + +class FakeNode { + constructor(tagName) { + this.tagName = String(tagName || '').toUpperCase(); + this.children = []; + this.attributes = {}; + this.listeners = {}; + this.style = {}; + this.className = ''; + this.id = ''; + this.parentNode = null; + this._innerHTML = ''; + this._textContent = ''; + } + + appendChild(node) { + if (!(node instanceof FakeNode)) throw new TypeError('appendChild expects FakeNode'); + this.children.push(node); + node.parentNode = this; + return node; + } + + setAttribute(name, value) { + this.attributes[name] = String(value); + if (name === 'id') this.id = String(value); + } + + getAttribute(name) { + return this.attributes[name]; + } + + addEventListener(type, handler) { + this.listeners[type] = this.listeners[type] || []; + this.listeners[type].push(handler); + } + + set innerHTML(value) { + this._innerHTML = String(value || ''); + this.children = []; + } + + get innerHTML() { + return this._innerHTML + this.children.map((child) => child.innerHTML).join(''); + } + + set textContent(value) { + this._textContent = String(value || ''); + this.children = []; + } + + get textContent() { + if (this.tagName === '#TEXT') return this._textContent; + return this._textContent + this.children.map((child) => child.textContent).join(''); + } +} + +function makeDocument() { + return { + body: new FakeNode('body'), + head: new FakeNode('head'), + createElement(tagName) { + return new FakeNode(tagName); + }, + createTextNode(text) { + const node = new FakeNode('#text'); + node.textContent = text; + return node; + }, + getElementById() { + return null; + }, + }; +} + +function loadComponent(document) { + const registry = {}; + const sandbox = { + console, + document, + window: { + VerstakPluginRegister(pluginId, bundle) { + registry[pluginId] = bundle.components || {}; + }, + }, + }; + sandbox.window.window = sandbox.window; + sandbox.window.document = document; + vm.runInNewContext(source, sandbox, { filename: sourcePath }); + const component = registry['verstak.markdown-preview'] && registry['verstak.markdown-preview'].MarkdownPreview; + if (!component) throw new Error('MarkdownPreview was not registered'); + return component; +} + +async function flush() { + for (let i = 0; i < 8; i++) await Promise.resolve(); +} + +(async () => { + const document = makeDocument(); + const component = loadComponent(document); + const container = new FakeNode('div'); + const readPaths = []; + component.mount(container, { + request: { path: 'Docs/readme.md', mode: 'view' }, + }, { + files: { + readText: async (relativePath) => { + readPaths.push(relativePath); + return '# Title\n\nParagraph with `code`.\n\n- one\n- two\n'; + }, + }, + }); + await flush(); + + if (container.getAttribute('data-plugin-id') !== 'verstak.markdown-preview') { + throw new Error('plugin id marker missing'); + } + if (readPaths[0] !== 'Docs/readme.md') { + throw new Error(`expected readText Docs/readme.md, got ${readPaths[0] || 'code')) throw new Error('inline code was not rendered');
+ if (!html.includes('