@bhsd/codemirror-mediawiki 3.10.1 → 3.11.0

package/README.md

@@ -929,7 +929,7 @@ Refresh linting immediately.
 *version added: 3.8.0*
 
 **type**: `string`  
-By default, libraries such as [WikiParser-Node](https://www.npmjs.com/package/wikiparser-node) are loaded from `testingcf.jsdelivr.net`. You can change the [jsDelivr CDN](https://www.jsdelivr.com/network) by setting this property.
+By default, libraries such as [WikiParser-Node](https://www.npmjs.com/package/wikiparser-node) are loaded from `fastly.jsdelivr.net`. You can change the [jsDelivr CDN](https://www.jsdelivr.com/network) by setting this property.
 
 ```js
 CodeMirror6.CDN = 'https://cdn.jsdelivr.net';

package/dist/codemirror.d.ts

@@ -26,7 +26,7 @@ declare interface OptionalFunctions {
     foldHandler: typeof foldHandler;
 }
 export declare const plain: () => Extension;
-export declare const languages: Record<string, (config?: any) => Extension>;
+export declare const languages: Record<string, (config?: any, cm?: CodeMirror6) => Extension>;
 export declare const avail: Record<string, Addon<any>>;
 export declare const linterRegistry: Record<string, LintSourceGetter>;
 export declare const menuRegistry: MenuItem[];
@@ -57,6 +57,8 @@ export declare class CodeMirror6 {
     get lang(): string;
     /** whether the editor view is visible */
     get visible(): boolean;
+    /** @private */
+    get lintSources(): LintSource[];
     /**
      * @param textarea textarea element
      * @param lang language

package/dist/codemirror.js

@@ -3,7 +3,7 @@ import { EditorSelection, Compartment, EditorState, SelectionRange, } from '@cod
 import { syntaxHighlighting, defaultHighlightStyle, indentOnInput, indentUnit, ensureSyntaxTree, syntaxTree, } from '@codemirror/language';
 import { defaultKeymap, historyKeymap, history, redo, indentWithTab, insertNewlineKeepIndent, deleteCharBackwardStrict, } from '@codemirror/commands';
 import { search, searchKeymap } from '@codemirror/search';
-import { linter, lintGutter, lintKeymap } from '@codemirror/lint';
+import { linter, lintGutter, nextDiagnostic } from '@codemirror/lint';
 import elt from 'crelt';
 import { base, panelSelector, panelsSelector, diagnosticSelector, noDetectionLangs } from './constants.js';
 import { light } from './theme.js';
@@ -82,6 +82,7 @@ export class CodeMirror6 {
     #preferred = new Set();
     #indentStr = '\t';
     #nestedMWLanguage;
+    #lintSources = [];
     /** textarea element */
     get textarea() {
         return this.#textarea;
@@ -98,6 +99,10 @@ export class CodeMirror6 {
     get visible() {
         return this.#visible && this.textarea.isConnected;
     }
+    /** @private */
+    get lintSources() {
+        return this.#lintSources;
+    }
     /**
      * @param textarea textarea element
      * @param lang language
@@ -120,7 +125,7 @@ export class CodeMirror6 {
         if (isMW || this.#lang === 'html') {
             config ??= this.langConfig;
         }
-        const lang = (languages[this.#lang] ?? plain)(config);
+        const lang = (languages[this.#lang] ?? plain)(config, this);
         this.#nestedMWLanguage = lang.nestedMWLanguage;
         if (isMW) {
             this.langConfig = config;
@@ -307,14 +312,16 @@ export class CodeMirror6 {
                     return diagnostics;
                 })),
                 lintGutter(),
-                keymap.of(lintKeymap),
+                keymap.of([{ key: 'F8', run: nextDiagnostic }]),
                 optionalFunctions.statusBar(cm, lintSources[0].fixer),
             ]
             : [];
         if (lintSource) {
+            this.#lintSources = lintSources;
             linters[this.#lang] = linterExtension;
         }
         else {
+            this.#lintSources.length = 0;
             delete linters[this.#lang];
         }
         if (this.#view) {
@@ -434,7 +441,7 @@ export class CodeMirror6 {
             });
         }
         else if (!show && this.#visible) {
-            const { state: { selection: { main: { from, to, head } } }, hasFocus } = this.#view, { scrollDOM: { scrollTop } } = this.#view;
+            const { state: { selection: { main: { from, to, head } } }, hasFocus } = this.#view, { scrollTop } = this.#view.scrollDOM;
             this.#view.dom.style.setProperty('display', 'none', 'important');
             this.#textarea.style.display = '';
             this.#textarea.setSelectionRange(from, to, head === to ? 'forward' : 'backward');

package/dist/fold.js

@@ -141,7 +141,7 @@ const foldSelector = '.cm-tooltip-fold';
  * @param state
  */
 const create = (state) => {
-    const { selection: { main: { head } } } = state, range = foldable(state, head);
+    const { head } = state.selection.main, range = foldable(state, head);
     if (range) {
         const { from, to } = range;
         let folded = false;

package/dist/hover.js

@@ -24,16 +24,20 @@ export const getHoverFromApi = async (state, pos, side, paramSuggest, templateda
             return {
                 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>`),
+                    value: (description ? `<p>${escHTML(description)}</p>` : '')
+                        + ['Required', 'Suggested', 'Optional', 'Deprecated'].map(name => {
+                            const sectionResult = result.filter(([, , , section]) => section === name);
+                            return sectionResult.length === 0
+                                ? ''
+                                : `<h4>${name}</h4><ul>${sectionResult.map(([keys, , info]) => `<li>${keys.map(key => `<code>${escHTML(key)}</code>`).join('/')}${info && ` - ${escHTML(info)}`}</li>`).join('')}</ul>`;
+                        }).join(''),
                 },
                 range: { start: indexToPos(doc, node.from), end: indexToPos(doc, node.to) },
             };
         }
     }
     else if (node?.name.includes(tokens.templateArgumentName)) {
-        const name = findTemplateName(state, node);
+        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') {

package/dist/html.d.ts

@@ -1,4 +1,5 @@
 import { LanguageSupport } from '@codemirror/language';
 import type { MwConfig } from './token';
-declare const _default: (config: MwConfig) => LanguageSupport;
+import type { CodeMirror6 } from './codemirror';
+declare const _default: (config: MwConfig, cm?: CodeMirror6) => LanguageSupport;
 export default _default;

package/dist/html.js

@@ -4,10 +4,10 @@ import { javascript, javascriptLanguage } from '@codemirror/lang-javascript';
 import { cssLanguage } from '@codemirror/lang-css';
 import { LanguageSupport } from '@codemirror/language';
 import { cssCompletion } from './css.js';
-import { jsCompletion } from './javascript.js';
+import { jsCompletion, markGlobalsPlugin } from './javascript.js';
 import { mediawikiBase } from './mediawiki.js';
 import { getLightHighlightStyle } from './theme.js';
-export default (config) => {
+export default (config, cm) => {
     const { language, support } = mediawikiBase(config), 
     /** @test */
     lang = htmlLanguage.configure({
@@ -31,6 +31,7 @@ export default (config) => {
         cssCompletion(),
         support,
         getLightHighlightStyle(),
+        markGlobalsPlugin(cm),
     ]);
     Object.assign(langSupport, { nestedMWLanguage: language });
     return langSupport;

package/dist/inlay.js

@@ -22,7 +22,7 @@ const stateEffect = StateEffect.define(), field = StateField.define({
         const str = doc.toString();
         for (const effect of effects) {
             if (effect.is(stateEffect)) {
-                const { value: { text, inlayHints } } = effect;
+                const { text, inlayHints } = effect.value;
                 if (str === text) {
                     return inlayHints
                         ? Decoration.set(inlayHints.map(({ position, label }) => Decoration.widget({

package/dist/javascript.d.ts

@@ -2,12 +2,14 @@ import type { Extension, EditorState } from '@codemirror/state';
 import type { DecorationSet } from '@codemirror/view';
 import type { Tree } from '@lezer/common';
 import type { DocRange } from './fold';
+import type { CodeMirror6 } from './codemirror';
 export declare const jsCompletion: Extension;
 /**
  * 高亮显示全局变量
  * @ignore
  * @test
  */
-export declare const markGlobals: (tree: Tree, visibleRanges: readonly DocRange[], state: EditorState) => DecorationSet;
-declare const _default: () => Extension;
+export declare const markGlobals: (tree: Tree, visibleRanges: readonly DocRange[], state: EditorState, cm?: CodeMirror6) => DecorationSet;
+export declare const markGlobalsPlugin: (cm?: CodeMirror6) => Extension;
+declare const _default: (_?: unknown, cm?: CodeMirror6) => Extension;
 export default _default;

package/dist/javascript.js

@@ -1,23 +1,39 @@
 import { javascript as js, javascriptLanguage, scopeCompletionSource, localCompletionSource, } from '@codemirror/lang-javascript';
 import { ViewPlugin, Decoration } from '@codemirror/view';
 import { syntaxTree } from '@codemirror/language';
+import { setDiagnosticsEffect } from '@codemirror/lint';
 import { builtin } from 'globals/globals.json';
 export const jsCompletion = javascriptLanguage.data.of({ autocomplete: scopeCompletionSource(globalThis) });
-const globals = Decoration.mark({ class: 'cm-globals' });
+const globals = Decoration.mark({ class: 'cm-globals' }), builtinGlobals = new Set(Object.keys(builtin));
 /**
  * 高亮显示全局变量
  * @ignore
  * @test
  */
-export const markGlobals = (tree, visibleRanges, state) => {
+export const markGlobals = (tree, visibleRanges, state, cm) => {
     const decorations = [];
+    let allGlobals = builtinGlobals;
+    if (cm?.lintSources.length && typeof eslint === 'object' && 'environments' in eslint) {
+        const env = cm.lintSources[0]?.config?.env;
+        if (env) {
+            allGlobals = new Set(builtinGlobals);
+            for (const key of Object.keys(env)) {
+                const obj = eslint.environments.get(key)?.globals;
+                if (obj) {
+                    for (const k of Object.keys(obj)) {
+                        allGlobals.add(k);
+                    }
+                }
+            }
+        }
+    }
     for (const { from, to } of visibleRanges) {
         tree.iterate({
             from,
             to,
             enter({ type, from: f, to: t }) {
                 const name = state.sliceDoc(f, t);
-                if (type.is('VariableName') && name in builtin) {
+                if (type.is('VariableName') && javascriptLanguage.isActiveAt(state, f) && allGlobals.has(name)) {
                     const completions = localCompletionSource({ state, pos: t, explicit: true });
                     if (!completions?.options.some(({ label }) => label === name)) {
                         decorations.push(globals.range(f, t));
@@ -28,24 +44,32 @@ export const markGlobals = (tree, visibleRanges, state) => {
     }
     return Decoration.set(decorations);
 };
-export default () => [
-    js(),
-    jsCompletion,
-    ViewPlugin.fromClass(class {
-        constructor({ state, visibleRanges }) {
-            this.tree = syntaxTree(state);
-            this.decorations = markGlobals(this.tree, visibleRanges, state);
+export const markGlobalsPlugin = (cm) => ViewPlugin.fromClass(class {
+    constructor({ state, visibleRanges }) {
+        this.tree = syntaxTree(state);
+        this.decorations = markGlobals(this.tree, visibleRanges, state, cm);
+    }
+    update({ docChanged, viewportChanged, state, view: { visibleRanges }, transactions }) {
+        const tree = syntaxTree(state);
+        let flag;
+        if (docChanged || viewportChanged || tree !== this.tree) {
+            this.tree = tree;
+            flag = true;
         }
-        update({ docChanged, viewportChanged, state, view: { visibleRanges } }) {
-            const tree = syntaxTree(state);
-            if (docChanged || viewportChanged || tree !== this.tree) {
-                this.tree = tree;
-                this.decorations = markGlobals(tree, visibleRanges, state);
-            }
+        else {
+            flag = transactions.some(tr => tr.effects.some(e => e.is(setDiagnosticsEffect)));
+        }
+        if (flag) {
+            this.decorations = markGlobals(tree, visibleRanges, state, cm);
         }
-    }, {
-        decorations(v) {
-            return v.decorations;
-        },
-    }),
+    }
+}, {
+    decorations(v) {
+        return v.decorations;
+    },
+});
+export default (_, cm) => [
+    js(),
+    jsCompletion,
+    markGlobalsPlugin(cm),
 ];

package/dist/lintsource.d.ts

@@ -4,7 +4,8 @@ import type { Language } from '@codemirror/language';
 import type { Diagnostic, Action } from '@codemirror/lint';
 import type { Option, LiveOption } from './linter';
 import type { DocRange } from './fold';
-export type LintSource = ((state: EditorState) => readonly Diagnostic[] | Promise<readonly Diagnostic[]>) & {
+export type LintSource<T = unknown> = ((state: EditorState) => readonly Diagnostic[] | Promise<readonly Diagnostic[]>) & {
+    config?: T;
     fixer?: (doc: Text, rule?: string) => string | Promise<string>;
 };
 export type LintSources = LintSource | [LintSource, ...LintSource[]];

package/dist/lintsource.js

@@ -115,6 +115,11 @@ export const getJsLintSource = async (opt) => {
     const { CDN } = base, esLint = await getJsLinter(CDN && `${CDN}/${eslintRepo}`);
     const lintSource = async ({ doc }) => jsLintSource(esLint, doc.toString(), await getOpt(opt), doc);
     lintSource.fixer = (doc, rule) => esLint.fixer(doc.toString(), rule);
+    Object.defineProperty(lintSource, 'config', {
+        get() {
+            return esLint.config;
+        },
+    });
     return lintSource;
 };
 const cssLintSource = async (styleLint, code, opt, doc, f = 0, t) => {
@@ -153,6 +158,11 @@ export const getCssLintSource = async (opt) => {
     const { CDN } = base, styleLint = await getCssLinter(CDN && `${CDN}/${stylelintRepo}`);
     const lintSource = async ({ doc }) => cssLintSource(styleLint, doc.toString(), await getOpt(opt), doc);
     lintSource.fixer = async (doc, rule) => styleLint.fixer(doc.toString(), rule);
+    Object.defineProperty(lintSource, 'config', {
+        get() {
+            return styleLint.config;
+        },
+    });
     return lintSource;
 };
 /**
@@ -161,7 +171,7 @@ export const getCssLintSource = async (opt) => {
  */
 export const getVueLintSource = async (opt) => {
     const { CDN } = base, styleLint = await getCssLinter(CDN && `${CDN}/${stylelintRepo}`), esLint = await getJsLinter(CDN && `${CDN}/${eslintRepo}`);
-    return async (state) => {
+    const lintSource = async (state) => {
         const { doc } = state, option = await getOpt(opt, true) ?? {}, js = option['js'], css = option['css'];
         return [
             ...(await Promise.all(cssLanguage.findRegions(state).map(async ({ from, to }) => {
@@ -180,6 +190,12 @@ export const getVueLintSource = async (opt) => {
                 .flatMap(({ from, to }) => jsLintSource(esLint, state.sliceDoc(from, to), js, doc, from, to)),
         ];
     };
+    Object.defineProperty(lintSource, 'config', {
+        get() {
+            return esLint.config;
+        },
+    });
+    return lintSource;
 };
 /**
  * @implements
@@ -187,7 +203,7 @@ export const getVueLintSource = async (opt) => {
  */
 export const getHTMLLintSource = async (opt, view, language) => {
     const vueLintSource = await getVueLintSource(opt), wikiLint = await getWikiLinter({ include: false, ...await getOpt(opt), cdn: base.CDN }, view);
-    return async (state) => {
+    const lintSource = async (state) => {
         const { doc } = state, option = await getOpt(opt, true) ?? {}, wiki = option['wiki'];
         return [
             ...await vueLintSource(state),
@@ -195,6 +211,12 @@ export const getHTMLLintSource = async (opt, view, language) => {
                 .map(({ from, to }) => wikiLintSource(wikiLint, state.sliceDoc(from, to), wiki, doc, from, to)))).flat(),
         ];
     };
+    Object.defineProperty(lintSource, 'config', {
+        get() {
+            return vueLintSource.config;
+        },
+    });
+    return lintSource;
 };
 /**
  * @implements