@bhsd/codemirror-mediawiki 3.9.2 → 3.10.1

package/dist/fold.js

@@ -6,9 +6,9 @@ import elt from 'crelt';
 import { tokens } from './config.js';
 import { bgDark } from './constants.js';
 import { matchTag, getTag } from './matchTag.js';
-import { braceStackUpdate } from './util.js';
+import { braceStackUpdate, sliceDoc } from './util.js';
 const getExtRegex = /* @__PURE__ */ getRegex(tag => new RegExp(`mw-tag-${tag}(?![a-z])`, 'u'));
-const updateSelection = (pos, { to }) => Math.max(pos, to), updateAll = (pos, { from, to }) => from <= pos && to > pos ? to : pos;
+export const updateSelection = (pos, { to }) => Math.max(pos, to), updateAll = (pos, { from, to }) => from <= pos && to > pos ? to : pos;
 /**
  * Check if a SyntaxNode is among the specified components
  * @param keys The keys of the tokens to check
@@ -45,6 +45,7 @@ const refNames = new Set(['ref', 'references']);
  * @param posOrNode 字符位置或语法树节点
  * @param tree 语法树
  * @param refOnly 是否仅检查`<ref>`标签
+ * @test
  */
 export const foldable = (state, posOrNode, tree, refOnly = false) => {
     if (typeof posOrNode === 'number') {
@@ -98,7 +99,7 @@ export const foldable = (state, posOrNode, tree, refOnly = false) => {
             if (stack <= 0) {
                 // The closing bracket of the current template
                 to = nextSibling.from
-                    + state.sliceDoc(nextSibling.from, nextSibling.to)
+                    + sliceDoc(state, nextSibling)
                         .split('}}').slice(0, stack - 1).join('}}').length;
                 break;
             }
@@ -200,9 +201,12 @@ const getAnchor = (state) => Math.max(...state.selection.ranges.map(({ to }) =>
  * @param anchor 光标位置
  * @param update 更新光标位置
  * @param refOnly 是否仅检查`<ref>`标签
+ * @test
  */
-const traverse = (state, tree, effects, node, end, anchor, update, refOnly) => {
-    while (node && node.from <= end) {
+export const traverse = (state, tree, effects, node, end, anchor, update, refOnly) => {
+    while (node && (node.from < end
+        || node.from === end
+            && !(isTemplateBracket(node) && sliceDoc(state, node).startsWith('}}')))) {
         const range = foldable(state, node, tree, refOnly);
         if (range) {
             effects.push(foldEffect.of(range));
@@ -237,8 +241,13 @@ const findFold = ({ state }, line) => {
     });
     return found;
 };
-export const foldableLine = ({ state, viewport: { to: end }, viewportLineBlocks }, { from: f, to: t }) => {
-    const tree = syntaxTree(state);
+/**
+ * 寻找可折叠的行范围
+ * @ignore
+ * @test
+ */
+export const foldableLine = ({ state, viewportLineBlocks }, { from: f, to: t }) => {
+    const tree = syntaxTree(state), { doc } = state, { length } = viewportLineBlocks;
     /**
      * 获取标题层级
      * @param pos 行首位置
@@ -253,40 +262,64 @@ export const foldableLine = ({ state, viewport: { to: end }, viewportLineBlocks
      * @param to 行尾位置
      */
     getTable = (from, to) => {
-        const line = state.sliceDoc(from, to), bracket = /^\s*(?:(?::+\s*)?\{\||\|\})/u.exec(line)?.[0];
+        const node = tree.resolve(from, 1), { nextSibling } = node, bracket = node.name.includes(tokens.tableBracket)
+            ? node
+            : node.to < to && nextSibling?.name.includes(tokens.tableBracket) && nextSibling;
         if (bracket) {
-            const { name } = tree.resolve(from + bracket.length, -1);
-            if (name.includes(tokens.tableBracket)) {
-                return bracket.endsWith('|}') ? -1 : 1;
-            }
+            return /\|\}$|\{\{\s*!(?:\s*\}|\)\s*)\}\}$/u.test(sliceDoc(state, bracket)) ? -1 : 1;
         }
         return 0;
+    }, 
+    /**
+     * 逐行检查是否是折叠终点
+     * @param checkLine 检查函数
+     * @returns 折叠范围或是否继续查找
+     */
+    loop = (checkLine) => {
+        let i = 0;
+        while (i <= doc.lines) {
+            const { from, to } = i < length ? viewportLineBlocks[i] : doc.line(i);
+            if (from >= tree.topNode.to) {
+                return from === doc.length;
+            }
+            else if (from > f) {
+                /** 折叠范围或是否继续查找 */
+                const result = checkLine(from, to);
+                if (result !== true) {
+                    return result;
+                }
+            }
+            i++;
+            if (i === length) {
+                i = doc.lineAt(to).number + 1;
+            }
+        }
+        return true;
     };
     const level = getLevel(f);
     if (level < 7) {
-        for (const { from } of viewportLineBlocks) {
-            if (from > f && getLevel(from) <= level) {
-                return t < from - 1 && { from: t, to: from - 1 };
-            }
-        }
-        return end === state.doc.length && end > t && { from: t, to: end };
+        const checkLine = from => getLevel(from) > level || t < from - 1 && { from: t, to: from - 1 };
+        const /** 折叠范围或是否继续查找 */ result = loop(checkLine);
+        return result === true
+            ? t < doc.length && { from: t, to: doc.length }
+            : result;
     }
     else if (getTable(f, t) === 1) {
-        for (const { from, to } of viewportLineBlocks) {
-            if (from > f) {
-                const bracket = getTable(from, to);
-                if (bracket === -1) {
-                    return t < from - 1 && { from: t, to: from - 1 };
-                }
-                else if (bracket === 1 || getLevel(from) < 7) {
-                    break;
-                }
-            }
-        }
+        const checkLine = (from, to) => {
+            const bracket = getTable(from, to);
+            return bracket === -1 ? t < from - 1 && { from: t, to: from - 1 } : bracket !== 1 && getLevel(from) === 7;
+        };
+        const /** 折叠范围或是否继续查找 */ result = loop(checkLine);
+        return typeof result === 'object' && result;
     }
     return false;
 };
-const buildMarkers = (view) => {
+/**
+ * 生成行号旁的折叠标记
+ * @param view
+ * @test
+ */
+export const buildMarkers = (view) => {
     const builder = new RangeSetBuilder();
     for (const line of view.viewportLineBlocks) {
         let mark;
@@ -320,9 +353,21 @@ const defaultFoldExtension = /* @__PURE__ */ (() => [foldGutter(), keymap.of(fol
 /**
  * 生成折叠命令
  * @param refOnly 是否仅检查`<ref>`标签
+ * @test
  */
-const foldCommand = (refOnly) => view => {
-    const { state } = view, tree = ensureSyntaxTree(state, state.doc.length, 1e3) ?? syntaxTree(state), effects = [], anchor = traverse(state, tree, effects, tree.topNode.firstChild, Infinity, getAnchor(state), updateAll, refOnly);
+export const foldCommand = (refOnly) => view => {
+    const { state } = view, tree = ensureSyntaxTree(state, state.doc.length, 1e3) ?? syntaxTree(state), effects = [];
+    let anchor = traverse(state, tree, effects, tree.topNode.firstChild, Infinity, getAnchor(state), updateAll, refOnly);
+    if (!refOnly) {
+        for (let pos = 0; pos < state.doc.length;) {
+            const line = view.lineBlockAt(pos), range = foldableLine(view, line);
+            if (range) {
+                effects.push(foldEffect.of(range));
+                anchor = updateAll(anchor, range);
+            }
+            pos = (range ? view.lineBlockAt(range.to) : line).to + 1;
+        }
+    }
     return execute(view, effects, anchor);
 };
 export const foldRef = /* @__PURE__ */ foldCommand(true);
@@ -340,6 +385,62 @@ export const unfoldRef = (view) => {
     }
     return false;
 };
+/**
+ * 获取所有光标所在的行
+ * @param view
+ * @test
+ */
+export const selectedLines = (view) => {
+    const lines = [];
+    for (const { head } of view.state.selection.ranges) {
+        if (lines.some(({ from, to }) => from <= head && to >= head)) {
+            continue;
+        }
+        lines.push(view.lineBlockAt(head));
+    }
+    return lines;
+};
+const foldCode = (view, line) => {
+    const range = foldableLine(view, line);
+    if (range) {
+        view.dispatch({ effects: foldEffect.of(range) });
+        return true;
+    }
+    return false;
+};
+const unfoldCode = (view, line) => {
+    const folded = findFold(view, line);
+    return folded && unfoldEffect.of(folded);
+};
+/**
+ * Fold the template at the selection/cursor
+ * @param view
+ * @test
+ */
+export const foldAt = view => {
+    const { state } = view, tree = syntaxTree(state), effects = [];
+    let anchor = getAnchor(state);
+    for (const { from, to, empty } of state.selection.ranges) {
+        let node;
+        if (empty) {
+            // No selection, try both sides of the cursor position
+            node = tree.resolve(from, -1);
+        }
+        if (!node || node.name === 'Document') {
+            node = tree.resolve(from, 1);
+        }
+        anchor = traverse(state, tree, effects, node, to, anchor, updateSelection);
+    }
+    if (effects.length > 0) {
+        return execute(view, effects, anchor);
+    }
+    for (const line of selectedLines(view)) {
+        if (foldCode(view, line)) {
+            return true;
+        }
+    }
+    return false;
+};
 export default ((e = defaultFoldExtension) => [
     e,
     EditorView.theme({
@@ -348,7 +449,7 @@ export default ((e = defaultFoldExtension) => [
         },
     }),
 ]);
-export const mediaWikiFold = /* @__PURE__ */ (() => [
+export const mediawikiFold = /* @__PURE__ */ (() => [
     codeFolding({
         placeholderDOM(view) {
             const element = elt('span', { 'aria-label': 'folded code', title: view.state.phrase('unfold'), class: 'cm-foldPlaceholder' }, '…');
@@ -382,22 +483,7 @@ export const mediaWikiFold = /* @__PURE__ */ (() => [
             // Fold the template at the selection/cursor
             key: 'Ctrl-Shift-[',
             mac: 'Cmd-Alt-[',
-            run(view) {
-                const { state } = view, tree = syntaxTree(state), effects = [];
-                let anchor = getAnchor(state);
-                for (const { from, to, empty } of state.selection.ranges) {
-                    let node;
-                    if (empty) {
-                        // No selection, try both sides of the cursor position
-                        node = tree.resolve(from, -1);
-                    }
-                    if (!node || node.name === 'Document') {
-                        node = tree.resolve(from, 1);
-                    }
-                    anchor = traverse(state, tree, effects, node, to, anchor, updateSelection);
-                }
-                return execute(view, effects, anchor);
-            },
+            run: foldAt,
         },
         {
             // Fold all templates in the document
@@ -426,6 +512,16 @@ export const mediaWikiFold = /* @__PURE__ */ (() => [
                     view.dispatch({ effects, selection });
                     return true;
                 }
+                for (const line of selectedLines(view)) {
+                    const effect = unfoldCode(view, line);
+                    if (effect) {
+                        effects.push(effect);
+                    }
+                }
+                if (effects.length > 0) {
+                    view.dispatch({ effects });
+                    return true;
+                }
                 return false;
             },
         },
@@ -442,17 +538,12 @@ export const mediaWikiFold = /* @__PURE__ */ (() => [
         },
         domEventHandlers: {
             click(view, line) {
-                const folded = findFold(view, line);
-                if (folded) {
-                    view.dispatch({ effects: unfoldEffect.of(folded) });
+                const effects = unfoldCode(view, line);
+                if (effects) {
+                    view.dispatch({ effects });
                     return true;
                 }
-                const range = foldableLine(view, line);
-                if (range) {
-                    view.dispatch({ effects: foldEffect.of(range) });
-                    return true;
-                }
-                return false;
+                return foldCode(view, line);
             },
         },
     }),

package/dist/hover.d.ts

@@ -1,4 +1,17 @@
-import type { Extension } from '@codemirror/state';
-import type { CodeMirror6 } from './codemirror.js';
-declare const _default: (cm: CodeMirror6) => Extension;
+import type { Extension, EditorState } from '@codemirror/state';
+import type { Hover } from 'vscode-languageserver-types';
+import type { CodeMirror6 } from './codemirror';
+import type { CompletionSectionName, ApiSuggest } from './token';
+/**
+ * @ignore
+ * @test
+ */
+export declare const getDoc: (section: CompletionSectionName, info?: string) => string;
+/**
+ * 从TemplateData API获取hover信息
+ * @ignore
+ * @test
+ */
+export declare const getHoverFromApi: (state: EditorState, pos: number, side: 1 | -1, paramSuggest: ApiSuggest, templatedata?: boolean) => Promise<Hover | undefined>;
+declare const _default: (articlePath?: string, templatedata?: boolean) => (cm: CodeMirror6) => Extension;
 export default _default;

package/dist/hover.js

@@ -3,75 +3,92 @@ import { ensureSyntaxTree } from '@codemirror/language';
 import { getLSP, loadScript, } from '@bhsd/browser';
 import { tokens } from './config.js';
 import { base, hoverSelector, bgDark } from './constants.js';
-import { indexToPos, posToIndex, createTooltipView, escHTML, } from './util.js';
+import { indexToPos, posToIndex, createTooltipView, toConfigGetter, escHTML, sliceDoc, findTemplateName, } from './util.js';
 const code = `${hoverSelector} code`;
-export default (cm) => [
-    hoverTooltip(async (view, pos, side) => {
-        const { state } = view, { doc } = state;
-        const { paramSuggest, tags } = cm.langConfig;
-        let hover = await getLSP(view, false, cm.getWikiConfig, base.CDN)
-            ?.provideHover(doc.toString(), indexToPos(doc, pos));
-        if (!hover && paramSuggest && 'templatedata' in tags) {
-            const node = ensureSyntaxTree(state, pos + Math.max(side, 0))?.resolve(pos, side);
-            if (node?.name.includes(tokens.templateName)) {
-                const result = await paramSuggest(state.sliceDoc(node.from, node.to), false), { description, length } = result;
-                if (description || length > 0) {
-                    // eslint-disable-next-line require-atomic-updates
-                    hover = {
-                        contents: {
-                            kind: 'plaintext',
-                            value: (description ? `<p>${escHTML(description)}</p>` : '') + (length === 0
-                                ? ''
-                                : `<ul>${result.map(([key, details]) => `<li><code>${escHTML(key)}</code>${details ? ` — ${escHTML(details)}` : ''}</li>`).join('')}</ul>`),
-                        },
-                        range: { start: indexToPos(doc, node.from), end: indexToPos(doc, node.to) },
-                    };
-                }
-            }
-        }
-        if (hover) {
-            const { CDN = '' } = base;
-            await loadScript(`${CDN}${CDN && '/'}npm/marked/lib/marked.umd.js`, 'marked', true);
-            const { end } = hover.range;
+/**
+ * @ignore
+ * @test
+ */
+export const getDoc = (section, info = '') => escHTML(info)
+    + (section === 'Optional' ? '' : `<br><b><i>@${section.toLowerCase()}</i></b>`);
+/**
+ * 从TemplateData API获取hover信息
+ * @ignore
+ * @test
+ */
+export const getHoverFromApi = async (state, pos, side, paramSuggest, templatedata) => {
+    const node = ensureSyntaxTree(state, pos + Math.max(side, 0))?.resolve(pos, side), { doc } = state;
+    if (node?.name.includes(tokens.templateName)) {
+        const result = await paramSuggest(sliceDoc(state, node), templatedata), { description, length } = result;
+        if (description || length > 0) {
             return {
-                pos,
-                end: posToIndex(doc, end),
-                above: true,
-                create() {
-                    const { kind, value } = hover.contents;
-                    return createTooltipView(view, kind === 'plaintext' ? value : marked.parse(value));
+                contents: {
+                    kind: 'plaintext',
+                    value: (description ? `<p>${escHTML(description)}</p>` : '') + (length === 0
+                        ? ''
+                        : `<ul>${result.map(([keys, , info, section]) => `<li>${keys.map(key => `<code>${escHTML(key)}</code>`).join('/')}${info && ' - '}${getDoc(section, info)}</li>`).join('')}</ul>`),
                 },
+                range: { start: indexToPos(doc, node.from), end: indexToPos(doc, node.to) },
             };
         }
-        return null;
-    }),
-    EditorView.theme({
-        [hoverSelector]: {
-            padding: '2px 5px',
-            width: 'max-content',
-            maxWidth: '60vw',
-            overflowY: 'auto',
-        },
-        [`${hoverSelector} *`]: {
-            marginTop: '0!important',
-            marginBottom: '0!important',
-        },
-        [`${hoverSelector}>div`]: {
-            fontSize: '90%',
-            lineHeight: 1.4,
-        },
-        [code]: {
-            color: 'inherit',
-            padding: '.1em .4em',
-            borderRadius: '.4em',
-        },
-    }),
-    EditorView.baseTheme({
-        [`&light ${code}`]: {
-            backgroundColor: '#e0e6eb',
-        },
-        [`&dark ${code}`]: {
-            backgroundColor: bgDark,
-        },
-    }),
-];
+    }
+    else if (node?.name.includes(tokens.templateArgumentName)) {
+        const name = findTemplateName(state, node);
+        if (name) {
+            const result = await paramSuggest(name, templatedata), param = sliceDoc(state, node).trim().slice(0, -1).trim(), [, , info, section] = result.find(([keys]) => keys.includes(param)) ?? [];
+            if (info || section && section !== 'Optional') {
+                return {
+                    contents: {
+                        kind: 'plaintext',
+                        value: getDoc(section, info).replace(/^<br>/u, ''),
+                    },
+                    range: { start: indexToPos(doc, node.from), end: indexToPos(doc, node.to) },
+                };
+            }
+        }
+    }
+    return undefined;
+};
+export default (articlePath, templatedata) => (cm) => {
+    return [
+        hoverTooltip(async (view, pos, side) => {
+            const { state } = view, { doc } = state;
+            const { paramSuggest, tags } = cm.langConfig;
+            let hover = await getLSP(view, false, toConfigGetter(cm.getWikiConfig, articlePath), base.CDN)?.provideHover(doc.toString(), indexToPos(doc, pos));
+            if (!hover && paramSuggest && 'templatedata' in tags) {
+                // eslint-disable-next-line require-atomic-updates
+                hover = await getHoverFromApi(state, pos, side, paramSuggest, templatedata);
+            }
+            if (hover) {
+                const { CDN = '' } = base;
+                await loadScript(`${CDN}${CDN && '/'}npm/marked/lib/marked.umd.js`, 'marked', true);
+                const { end } = hover.range;
+                return {
+                    pos,
+                    end: posToIndex(doc, end),
+                    above: true,
+                    create() {
+                        const { kind, value } = hover.contents;
+                        return createTooltipView(view, kind === 'plaintext' ? value : marked.parse(value));
+                    },
+                };
+            }
+            return null;
+        }),
+        EditorView.theme({
+            [code]: {
+                color: 'inherit',
+                padding: '.1em .4em',
+                borderRadius: '.4em',
+            },
+        }),
+        EditorView.baseTheme({
+            [`&light ${code}`]: {
+                backgroundColor: '#e0e6eb',
+            },
+            [`&dark ${code}`]: {
+                backgroundColor: bgDark,
+            },
+        }),
+    ];
+};

package/dist/html.js

@@ -2,31 +2,36 @@ import { configureNesting } from '@lezer/html';
 import { htmlLanguage, htmlCompletionSourceWith } from '@codemirror/lang-html';
 import { javascript, javascriptLanguage } from '@codemirror/lang-javascript';
 import { cssLanguage } from '@codemirror/lang-css';
-import { LanguageSupport, syntaxHighlighting, defaultHighlightStyle, HighlightStyle } from '@codemirror/language';
+import { LanguageSupport } from '@codemirror/language';
 import { cssCompletion } from './css.js';
 import { jsCompletion } from './javascript.js';
 import { mediawikiBase } from './mediawiki.js';
+import { getLightHighlightStyle } from './theme.js';
 export default (config) => {
-    const { language, support } = mediawikiBase(config), lang = new LanguageSupport(htmlLanguage.configure({
+    const { language, support } = mediawikiBase(config), 
+    /** @test */
+    lang = htmlLanguage.configure({
         wrap: configureNesting([
             { tag: 'script', parser: javascriptLanguage.parser },
             { tag: 'style', parser: cssLanguage.parser },
             { tag: 'noinclude', parser: language.parser },
         ], [{ name: 'style', parser: cssLanguage.parser.configure({ top: 'Styles' }) }]),
-    }), [
-        htmlLanguage.data.of({
-            autocomplete: htmlCompletionSourceWith({
-                extraTags: {
-                    noinclude: { globalAttrs: false },
-                },
-            }),
+    }), 
+    /** @test */
+    autocomplete = htmlLanguage.data.of({
+        autocomplete: htmlCompletionSourceWith({
+            extraTags: {
+                noinclude: { globalAttrs: false },
+            },
         }),
+    }), langSupport = new LanguageSupport(lang, [
+        autocomplete,
         javascript().support,
         jsCompletion,
         cssCompletion(),
         support,
-        syntaxHighlighting(HighlightStyle.define(defaultHighlightStyle.specs, { themeType: 'light' })),
+        getLightHighlightStyle(),
     ]);
-    Object.assign(lang, { nestedMWLanguage: language });
-    return lang;
+    Object.assign(langSupport, { nestedMWLanguage: language });
+    return langSupport;
 };

package/dist/indent.d.ts

@@ -3,10 +3,17 @@ export interface Text extends TextBase {
     children: readonly Text[] | null;
     text?: string[];
 }
+/**
+ * 获取逐行文本内容
+ * @param text
+ * @test
+ */
+export declare const getLines: (text: Text) => string[];
 /**
  * 检测文本的缩进方式
  * @param text 文本内容
  * @param defaultIndent 默认缩进方式
  * @param lang 语言
+ * @test
  */
 export declare const detectIndent: (text: string | Text, defaultIndent: string, lang: string) => string;

package/dist/indent.js

@@ -1,10 +1,16 @@
 import { noDetectionLangs } from './constants.js';
-const getLines = (text) => text.children?.flatMap(getLines) ?? text.text;
+/**
+ * 获取逐行文本内容
+ * @param text
+ * @test
+ */
+export const getLines = (text) => text.children?.flatMap(getLines) ?? text.text;
 /**
  * 检测文本的缩进方式
  * @param text 文本内容
  * @param defaultIndent 默认缩进方式
  * @param lang 语言
+ * @test
  */
 export const detectIndent = (text, defaultIndent, lang) => {
     if (noDetectionLangs.has(lang)) {