@bhsd/codemirror-mediawiki 2.1.8 → 2.1.10

package/mw/dist/base.js

@@ -1,7 +1,8 @@
-import { CodeMirror6 } from 'https://testingcf.jsdelivr.net/npm/@bhsd/codemirror-mediawiki@2.1.8/dist/main.min.js';
+import { CodeMirror6 } from 'https://testingcf.jsdelivr.net/npm/@bhsd/codemirror-mediawiki@2.1.10/dist/main.min.js';
 (() => {
     var _a;
-    mw.loader.load('https://testingcf.jsdelivr.net/npm/@bhsd/codemirror-mediawiki@2.1.8/mediawiki.min.css', 'text/css');
+    mw.loader.load('https://testingcf.jsdelivr.net/npm/@bhsd/codemirror-mediawiki@2.1.10/mediawiki.min.css', 'text/css');
+    mw.loader.addStyleTag('.wikiEditor-ui-toolbar{z-index:7}');
     const instances = new WeakMap();
     const getInstance = ($ele) => instances.get($ele[0]);
     $.valHooks['textarea'] = {
@@ -157,12 +158,27 @@ import { CodeMirror6 } from 'https://testingcf.jsdelivr.net/npm/@bhsd/codemirror
             linters[this.lang] = linter;
             return linter;
         }
-        async defaultLint(on, opt) {
+        async defaultLint(on, optOrNs) {
             if (!on) {
                 this.lint();
                 return;
             }
             const { lang } = this;
+            let opt;
+            if (typeof optOrNs === 'number') {
+                if (lang === 'mediawiki' && (optOrNs === 10 || optOrNs === 828)) {
+                    opt = { include: true };
+                }
+                else if (lang === 'javascript' && (optOrNs === 8 || optOrNs === 2300)) {
+                    opt = {
+                        env: { browser: true, es6: true },
+                        parserOptions: { ecmaVersion: 6 },
+                    };
+                }
+            }
+            else {
+                opt = optOrNs;
+            }
             if (!(lang in linters)) {
                 await this.getLinter(opt);
                 if (lang === 'mediawiki') {
@@ -241,17 +257,7 @@ import { CodeMirror6 } from 'https://testingcf.jsdelivr.net/npm/@bhsd/codemirror
                     }
                 }
                 const cm = await CodeMirror.fromTextArea(e.target, lang);
-                let opt;
-                if (lang === 'mediawiki' && wgNamespaceNumber === 10) {
-                    opt = { include: true };
-                }
-                else if (lang === 'javascript' && (wgNamespaceNumber === 8 || wgNamespaceNumber === 2300)) {
-                    opt = {
-                        env: { browser: true, es6: true },
-                        parserOptions: { ecmaVersion: 6 },
-                    };
-                }
-                await cm.defaultLint(true, opt);
+                void cm.defaultLint(true, wgNamespaceNumber);
             })();
         }
     });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bhsd/codemirror-mediawiki",
-	"version": "2.1.8",
+	"version": "2.1.10",
 	"description": "Modified CodeMirror mode based on wikimedia/mediawiki-extensions-CodeMirror",
 	"keywords": [
 		"mediawiki",
@@ -28,15 +28,14 @@
 		"url": "git+https://github.com/bhsd-harry/codemirror-mediawiki.git"
 	},
 	"scripts": {
-		"build:core": "esbuild ./src/codemirror.ts --bundle --minify --target=es2018 --format=esm --sourcemap --outfile=dist/main.min.js; tsc --emitDeclarationOnly; rm dist/gh-page.d.ts",
+		"build:core": "esbuild ./src/codemirror.ts --bundle --minify --target=es2018 --format=esm --sourcemap --outfile=dist/main.min.js && tsc --emitDeclarationOnly && rm dist/gh-page.d.ts",
 		"build:mw": "bash build.sh mw/base.ts mw/dist/base.js",
 		"build:gh-page": "bash build.sh src/gh-page.ts gh-page.js",
 		"build": "npm run build:core && npm run build:mw",
 		"lint:ts": "tsc --noEmit && tsc --project mw/tsconfig.json --noEmit && eslint --cache .",
 		"lint:css": "stylelint *.css",
 		"lint": "npm run lint:ts && npm run lint:css",
-		"server": "http-server .. -c-1 --cors &",
-		"test": "npm run server; open http://127.0.0.1:8080/codemirror-mediawiki/index.html",
+		"test": "npm run build:core && npm run build:gh-page && http-server .. -c-1 --cors &",
 		"test:end": "pkill -x http-server"
 	},
 	"engines": {

package/src/codemirror.ts

@@ -19,7 +19,7 @@ import {
 } from '@codemirror/language';
 import {defaultKeymap, historyKeymap, history} from '@codemirror/commands';
 import {searchKeymap} from '@codemirror/search';
-import {linter, lintGutter, openLintPanel, closeLintPanel} from '@codemirror/lint';
+import {linter, lintGutter, openLintPanel, closeLintPanel, lintKeymap} from '@codemirror/lint';
 import {closeBrackets} from '@codemirror/autocomplete';
 import {mediawiki, html} from './mediawiki';
 import * as plugins from './plugins';
@@ -32,6 +32,8 @@ import type {Linter} from 'eslint';
 export type {MwConfig} from './mediawiki';
 export type LintSource = (doc: Text) => Diagnostic[] | Promise<Diagnostic[]>;
 
+declare type LintExtension = [unknown, ViewPlugin<{set: boolean, force(): void}>];
+
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const languages: Record<string, (config?: any) => LanguageSupport | []> = {
 	plain: () => [],
@@ -43,7 +45,7 @@ for (const [language, parser] of Object.entries(plugins)) {
 }
 const linters: Record<string, Extension> = {};
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-const avail: Record<string, [ (config?: any) => Extension, Record<string, unknown> ]> = {
+const avail: Record<string, [(config?: any) => Extension, Record<string, unknown>]> = {
 	highlightSpecialChars: [highlightSpecialChars, {}],
 	highlightActiveLine: [highlightActiveLine, {}],
 	highlightWhitespace: [highlightWhitespace, {}],
@@ -137,6 +139,7 @@ export class CodeMirror6 {
 				...defaultKeymap,
 				...historyKeymap,
 				...searchKeymap,
+				...lintKeymap,
 			]),
 			EditorView.updateListener.of(({state: {doc}, docChanged}) => {
 				if (docChanged) {
@@ -186,6 +189,21 @@ export class CodeMirror6 {
 		this.#view.dom.style.minHeight = linting ? 'calc(100px + 2em)' : '2em';
 	}
 
+	/**
+	 * 开关语法检查面板
+	 * @param show 是否显示
+	 */
+	#toggleLintPanel(show: boolean): void {
+		(show ? openLintPanel : closeLintPanel)(this.#view);
+		document.querySelector<HTMLUListElement>('.cm-panel-lint ul')?.blur();
+		this.#minHeight(show);
+	}
+
+	/** 获取语法检查扩展 */
+	#getLintExtension(): LintExtension | undefined {
+		return (this.#linter.get(this.#view.state) as LintExtension[])[0];
+	}
+
 	/**
 	 * 设置语言
 	 * @param lang 语言
@@ -199,7 +217,7 @@ export class CodeMirror6 {
 			],
 		});
 		this.#lang = lang;
-		(linters[lang] ? openLintPanel : closeLintPanel)(this.#view);
+		this.#toggleLintPanel(Boolean(linters[lang]));
 	}
 
 	/**
@@ -215,25 +233,20 @@ export class CodeMirror6 {
 			: [];
 		if (lintSource) {
 			linters[this.#lang] = linterExtension;
-			this.#minHeight(true);
 		} else {
 			delete linters[this.#lang];
-			this.#minHeight();
 		}
 		this.#view.dispatch({
 			effects: [this.#linter.reconfigure(linterExtension)],
 		});
-		(lintSource ? openLintPanel : closeLintPanel)(this.#view);
+		this.#toggleLintPanel(Boolean(lintSource));
 	}
 
 	/** 立即更新语法检查 */
 	update(): void {
-		const extension = this.#linter.get(this.#view.state) as [[ unknown, ViewPlugin<{
-			set: boolean;
-			force(): void;
-		}> ]] | [];
-		if (extension.length > 0) {
-			const plugin = this.#view.plugin(extension[0]![1])!;
+		const extension = this.#getLintExtension();
+		if (extension) {
+			const plugin = this.#view.plugin(extension[1])!;
 			plugin.set = true;
 			plugin.force();
 		}
@@ -281,10 +294,10 @@ export class CodeMirror6 {
 					conf: Linter.Config = {
 						env: {
 							browser: true,
-							es2018: true,
+							es2024: true,
 						},
 						parserOptions: {
-							ecmaVersion: 9,
+							ecmaVersion: 15,
 							sourceType: 'module',
 						},
 						rules: {},

package/src/mediawiki.ts

@@ -48,6 +48,12 @@ export interface MwConfig {
 	implicitlyClosedHtmlTags?: string[];
 }
 
+const enum TableCell {
+	Td,
+	Th,
+	Caption,
+}
+
 const copyState = (state: State): State => {
 	const newState = {} as State;
 	for (const [key, val] of Object.entries(state)) {
@@ -85,7 +91,7 @@ class MediaWiki {
 	constructor(config: MwConfig) {
 		this.config = config;
 		// eslint-disable-next-line require-unicode-regexp
-		this.urlProtocols = new RegExp(`^(?:${config.urlProtocols})`, 'i');
+		this.urlProtocols = new RegExp(`^(?:${config.urlProtocols})(?=[^\\s[\\]<>])`, 'i');
 		this.isBold = false;
 		this.wasBold = false;
 		this.isItalic = false;
@@ -235,7 +241,7 @@ class MediaWiki {
 		return (ground && `mw${ground}-ground `) + style;
 	}
 
-	inBlock(style: string, terminator: string, consumeLast = true): Tokenizer {
+	inBlock(style: string, terminator: string, consumeLast?: boolean): Tokenizer {
 		return (stream, state) => {
 			if (stream.skipTo(terminator)) {
 				if (consumeLast) {
@@ -278,7 +284,7 @@ class MediaWiki {
 				} else if (stream.match(/^<!--(?!.*?-->.*?=)/u, false)) {
 					// T171074: handle trailing comments
 					stream.backUp(count);
-					state.tokenize = this.inBlock(modeConfig.tags.sectionHeader, '<!--', false);
+					state.tokenize = this.inBlock(modeConfig.tags.sectionHeader, '<!--');
 				}
 				return this.makeLocalStyle(modeConfig.tags.section, state);
 			}
@@ -303,7 +309,7 @@ class MediaWiki {
 		return this.makeLocalStyle(modeConfig.tags.templateVariableName, state);
 	}
 
-	inVariableDefault(isFirst: boolean): Tokenizer {
+	inVariableDefault(isFirst?: boolean): Tokenizer {
 		const style = modeConfig.tags[isFirst ? 'templateVariable' : 'comment'];
 		return (stream, state) => {
 			if (stream.match(/^[^{}[<&~|]+/u)) {
@@ -312,7 +318,7 @@ class MediaWiki {
 				state.tokenize = state.stack.pop()!;
 				return this.makeLocalStyle(modeConfig.tags.templateVariableBracket, state);
 			} else if (stream.eat('|')) {
-				state.tokenize = this.inVariableDefault(false);
+				state.tokenize = this.inVariableDefault();
 				return this.makeLocalStyle(modeConfig.tags.templateVariableDelimiter, state);
 			}
 			return this.eatWikiText(style)(stream, state);
@@ -345,7 +351,7 @@ class MediaWiki {
 		return this.eatWikiText(modeConfig.tags.parserFunction)(stream, state);
 	}
 
-	inTemplatePageName(haveAte: boolean): Tokenizer {
+	inTemplatePageName(haveAte?: boolean): Tokenizer {
 		return (stream, state) => {
 			if (stream.match(/^\s*\|\s*/u)) {
 				state.tokenize = this.inTemplateArgument(true);
@@ -372,11 +378,11 @@ class MediaWiki {
 		};
 	}
 
-	inTemplateArgument(expectArgName: boolean): Tokenizer {
+	inTemplateArgument(expectArgName?: boolean): Tokenizer {
 		return (stream, state) => {
 			if (expectArgName && stream.eatWhile(/[^=|}{[<&~]/u)) {
 				if (stream.eat('=')) {
-					state.tokenize = this.inTemplateArgument(false);
+					state.tokenize = this.inTemplateArgument();
 					return this.makeLocalStyle(modeConfig.tags.templateArgumentName, state);
 				}
 				return this.makeLocalStyle(modeConfig.tags.template, state);
@@ -531,7 +537,7 @@ class MediaWiki {
 		};
 	}
 
-	eatTagName(chars: number, isCloseTag: boolean, isHtmlTag: boolean): Tokenizer {
+	eatTagName(chars: number, isCloseTag: boolean, isHtmlTag?: boolean): Tokenizer {
 		return (stream, state) => {
 			let name = '';
 			for (let i = 0; i < chars; i++) {
@@ -556,7 +562,7 @@ class MediaWiki {
 
 	inHtmlTagAttribute(name: string): Tokenizer {
 		return (stream, state) => {
-			if (stream.match(/^[^>/<{]+/u)) {
+			if (stream.match(/^(?:"[^<">]*"|'[^<'>]*'[^>/<{])+/u)) {
 				return this.makeLocalStyle(modeConfig.tags.htmlTagAttribute, state);
 			} else if (stream.match(/^\/?>/u)) {
 				if (!this.implicitlyClosedHtmlTags.has(name)) {
@@ -582,7 +588,7 @@ class MediaWiki {
 
 	inExtTagAttribute(name: string): Tokenizer {
 		return (stream, state) => {
-			if (stream.match(/^[^>/]+/u)) {
+			if (stream.match(/^(?:"[^">]*"|'[^'>]*'|[^>/])+/u)) {
 				return this.makeLocalStyle(modeConfig.tags.extTagAttribute, state);
 			} else if (stream.eat('>')) {
 				state.extName = name;
@@ -642,7 +648,7 @@ class MediaWiki {
 		return (stream, state) => {
 			stream.next(); // eat <
 			stream.next(); // eat /
-			state.tokenize = this.eatTagName(name.length, true, false);
+			state.tokenize = this.eatTagName(name.length, true);
 			return this.makeLocalStyle(modeConfig.tags.extTagBracket, state);
 		};
 	}
@@ -680,17 +686,6 @@ class MediaWiki {
 		return this.eatWikiText(modeConfig.tags.tableDefinition)(stream, state);
 	}
 
-	inTableCaption(stream: StringStream, state: State): string {
-		if (stream.sol() && stream.match(/^\s*(?:[|!]|\{\{\s*!\s*\}\})/u, false)) {
-			state.tokenize = this.inTable.bind(this);
-			return this.inTable(stream, state);
-		} else if (stream.match(/^\s*(?:\||\{\{\s*!\s*\}\}){2}/u, false)) {
-			state.tokenize = this.inTableRow(false, false);
-			return '';
-		}
-		return this.eatWikiText(modeConfig.tags.tableCaption)(stream, state);
-	}
-
 	inTable(stream: StringStream, state: State): string {
 		if (stream.sol()) {
 			stream.eatSpace();
@@ -700,25 +695,31 @@ class MediaWiki {
 					return this.makeLocalStyle(modeConfig.tags.tableDelimiter, state);
 				} else if (stream.eat('+')) {
 					stream.eatSpace();
-					state.tokenize = this.inTableCaption.bind(this);
+					state.tokenize = this.inTableRow(true, TableCell.Caption);
 					return this.makeLocalStyle(modeConfig.tags.tableDelimiter, state);
 				} else if (stream.eat('}')) {
 					state.tokenize = state.stack.pop()!;
 					return this.makeLocalStyle(modeConfig.tags.tableBracket, state);
 				}
 				stream.eatSpace();
-				state.tokenize = this.inTableRow(true, false);
+				state.tokenize = this.inTableRow(true, TableCell.Td);
 				return this.makeLocalStyle(modeConfig.tags.tableDelimiter, state);
 			} else if (stream.eat('!')) {
 				stream.eatSpace();
-				state.tokenize = this.inTableRow(true, true);
+				state.tokenize = this.inTableRow(true, TableCell.Th);
 				return this.makeLocalStyle(modeConfig.tags.tableDelimiter, state);
 			}
 		}
 		return this.eatWikiText('')(stream, state);
 	}
 
-	inTableRow(isStart: boolean, isHead: boolean): Tokenizer {
+	inTableRow(isStart: boolean, type: TableCell): Tokenizer {
+		let style = '';
+		if (type === TableCell.Caption) {
+			style = modeConfig.tags.tableCaption;
+		} else if (type === TableCell.Th) {
+			style = modeConfig.tags.strong;
+		}
 		return (stream, state) => {
 			if (stream.sol()) {
 				if (stream.match(/^\s*(?:[|!]|\{\{\s*!\s*\}\})/u, false)) {
@@ -726,19 +727,17 @@ class MediaWiki {
 					return this.inTable(stream, state);
 				}
 			} else if (stream.match(/^[^'|{[<&~!]+/u)) {
-				return this.makeStyle(isHead ? modeConfig.tags.strong : '', state);
-			} else if (
-				stream.match(/^(?:\||\{\{\s*!\s*\}\}){2}/u) || isHead && stream.match('!!')
-				|| isStart && stream.match(/^(?:\||\{\{\s*!\s*\}\})/u)
-			) {
+				return this.makeStyle(style, state);
+			} else if (stream.match(/^(?:\||\{\{\s*!\s*\}\}){2}/u) || type === TableCell.Th && stream.match('!!')) {
 				this.isBold = false;
 				this.isItalic = false;
-				if (isStart) {
-					state.tokenize = this.inTableRow(false, isHead);
-				}
+				state.tokenize = this.inTableRow(true, type);
+				return this.makeLocalStyle(modeConfig.tags.tableDelimiter, state);
+			} else if (isStart && stream.match(/^(?:\||\{\{\s*!\s*\}\})/u)) {
+				state.tokenize = this.inTableRow(false, type);
 				return this.makeLocalStyle(modeConfig.tags.tableDelimiter, state);
 			}
-			return this.eatWikiText(isHead ? modeConfig.tags.strong : '')(stream, state);
+			return this.eatWikiText(style)(stream, state);
 		};
 	}
 
@@ -938,14 +937,14 @@ class MediaWiki {
 						// Template
 						state.nTemplate++;
 						state.stack.push(state.tokenize);
-						state.tokenize = this.inTemplatePageName(false);
+						state.tokenize = this.inTemplatePageName();
 						return this.makeLocalStyle(modeConfig.tags.templateBracket, state);
 					}
 					break;
 				case '<': {
 					if (stream.match('!--')) { // comment
 						state.stack.push(state.tokenize);
-						state.tokenize = this.inBlock(modeConfig.tags.comment, '-->');
+						state.tokenize = this.inBlock(modeConfig.tags.comment, '-->', true);
 						return this.makeLocalStyle(modeConfig.tags.comment, state);
 					}
 					const isCloseTag = Boolean(stream.eat('/')),
@@ -954,17 +953,18 @@ class MediaWiki {
 						const tagname = mt[0]!.toLowerCase();
 						if (tagname in this.config.tags) {
 							// Parser function
+							state.stack.push(state.tokenize);
 							if (isCloseTag) {
 								state.tokenize = this.inChar('>', modeConfig.tags.error);
 								return this.makeLocalStyle(modeConfig.tags.error, state);
 							}
 							stream.backUp(tagname.length);
-							state.stack.push(state.tokenize);
-							state.tokenize = this.eatTagName(tagname.length, isCloseTag, false);
+							state.tokenize = this.eatTagName(tagname.length, isCloseTag);
 							return this.makeLocalStyle(modeConfig.tags.extTagBracket, state);
 						} else if (this.permittedHtmlTags.has(tagname)) {
 							// Html tag
 							if (isCloseTag && tagname !== state.inHtmlTag.pop()) {
+								state.stack.push(state.tokenize);
 								state.tokenize = this.inChar('>', modeConfig.tags.error);
 								return this.makeLocalStyle(modeConfig.tags.error, state);
 							} else if (isCloseTag && this.implicitlyClosedHtmlTags.has(tagname)) {