@bhsd/codemirror-mediawiki 2.1.11 → 2.1.12

package/mediawiki.css

@@ -161,85 +161,85 @@
 /* backgrounds */
 .cm-mw-tag-pre,
 .cm-mw-tag-nowiki {
-	background-color: rgba( 0, 0, 0, 0.04 );
+	background-color: rgba(0, 0, 0, .04);
 }
 .cm-mw-template-ground {
-	background-color: rgba( 170, 17, 17, 0.04 );
+	background-color: rgba(170, 17, 17, .04);
 }
 .cm-mw-template2-ground {
-	background-color: rgba( 170, 17, 17, 0.08 );
+	background-color: rgba(170, 17, 17, .08);
 }
 .cm-mw-template3-ground {
-	background-color: rgba( 170, 17, 17, 0.12 );
+	background-color: rgba(170, 17, 17, .12);
 }
 .cm-mw-template-ext-ground,
 .cm-mw-ext-ground,
 .cm-mw-exttag {
-	background-color: rgba( 119, 0, 170, 0.04 );
+	background-color: rgba(119, 0, 170, .04);
 }
 .cm-mw-template-ext2-ground,
 .cm-mw-ext2-ground {
-	background-color: rgba( 119, 0, 170, 0.08 );
+	background-color: rgba(119, 0, 170, .08);
 }
 .cm-mw-template-ext3-ground,
 .cm-mw-ext3-ground {
-	background-color: rgba( 119, 0, 170, 0.12 );
+	background-color: rgba(119, 0, 170, .12);
 }
 .cm-mw-template-link-ground,
 .cm-mw-ext-link-ground,
 .cm-mw-link-ground {
-	background-color: rgba( 34, 17, 153, 0.04 );
+	background-color: rgba(34, 17, 153, .04);
 }
 .cm-mw-template-ext-link-ground,
 .cm-mw-ext2-link-ground {
-	background-color: rgba( 77, 9, 162, 0.08 );
+	background-color: rgba(77, 9, 162, .08);
 }
 .cm-mw-template-ext2-link-ground,
 .cm-mw-ext3-link-ground {
-	background-color: rgba( 91, 6, 164, 0.12 );
+	background-color: rgba(91, 6, 164, .12);
 }
 .cm-mw-template-ext3-link-ground {
-	background-color: rgba( 98, 4, 166, 0.16 );
+	background-color: rgba(98, 4, 166, .16);
 }
 .cm-mw-template2-ext-ground {
-	background-color: rgba( 145, 9, 94, 0.08 );
+	background-color: rgba(145, 9, 94, .08);
 }
 .cm-mw-template2-ext2-ground {
-	background-color: rgba( 136, 6, 119, 0.12 );
+	background-color: rgba(136, 6, 119, .12);
 }
 .cm-mw-template2-ext3-ground {
-	background-color: rgba( 132, 4, 132, 0.16 );
+	background-color: rgba(132, 4, 132, .16);
 }
 .cm-mw-template2-link-ground {
-	background-color: rgba( 102, 17, 85, 0.08 );
+	background-color: rgba(102, 17, 85, .08);
 }
 .cm-mw-template2-ext-link-ground {
-	background-color: rgba( 108, 11, 113, 0.12 );
+	background-color: rgba(108, 11, 113, .12);
 }
 .cm-mw-template2-ext2-link-ground {
-	background-color: rgba( 111, 9, 128, 0.16 );
+	background-color: rgba(111, 9, 128, .16);
 }
 .cm-mw-template2-ext3-link-ground {
-	background-color: rgba( 112, 7, 136, 0.2 );
+	background-color: rgba(112, 7, 136, .2);
 }
 .cm-mw-template3-ext-ground {
-	background-color: rgba( 153, 11, 68, 0.12 );
+	background-color: rgba(153, 11, 68, .12);
 }
 .cm-mw-template3-ext2-ground {
-	background-color: rgba( 145, 9, 94, 0.16 );
+	background-color: rgba(145, 9, 94, .16);
 }
 .cm-mw-template3-ext3-ground {
-	background-color: rgba( 139, 7, 109, 0.2 );
+	background-color: rgba(139, 7, 109, .2);
 }
 .cm-mw-template3-link-ground {
-	background-color: rgba( 125, 17, 62, 0.12 );
+	background-color: rgba(125, 17, 62, .12);
 }
 .cm-mw-template3-ext-link-ground {
-	background-color: rgba( 123, 13, 89, 0.16 );
+	background-color: rgba(123, 13, 89, .16);
 }
 .cm-mw-template3-ext2-link-ground {
-	background-color: rgba( 122, 10, 105, 0.2 );
+	background-color: rgba(122, 10, 105, .2);
 }
 .cm-mw-template3-ext3-link-ground {
-	background-color: rgba( 122, 9, 116, 0.24 );
+	background-color: rgba(122, 9, 116, .24);
 }

package/mw/dist/base.js

@@ -1,7 +1,7 @@
-import { CodeMirror6 } from 'https://testingcf.jsdelivr.net/npm/@bhsd/codemirror-mediawiki@2.1.11/dist/main.min.js';
+import { CodeMirror6 } from 'https://testingcf.jsdelivr.net/npm/@bhsd/codemirror-mediawiki@2.1.12/dist/main.min.js';
 (() => {
     var _a;
-    mw.loader.load('https://testingcf.jsdelivr.net/npm/@bhsd/codemirror-mediawiki@2.1.11/mediawiki.min.css', 'text/css');
+    mw.loader.load('https://testingcf.jsdelivr.net/npm/@bhsd/codemirror-mediawiki@2.1.12/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]);
@@ -180,6 +180,15 @@ import { CodeMirror6 } from 'https://testingcf.jsdelivr.net/npm/@bhsd/codemirror
                 opt = optOrNs;
             }
             if (!(lang in linters)) {
+                if (lang === 'mediawiki') {
+                    const i18n = mw.config.get('wgUserLanguage');
+                    if (['zh', 'zh-hans', 'zh-cn', 'zh-sg', 'zh-my'].includes(i18n)) {
+                        opt = { ...opt, i18n: 'zh-hans' };
+                    }
+                    else if (['zh-hant', 'zh-tw', 'zh-hk', 'zh-mo'].includes(i18n)) {
+                        opt = { ...opt, i18n: 'zh-hant' };
+                    }
+                }
                 await this.getLinter(opt);
                 if (lang === 'mediawiki') {
                     const mwConfig = await getMwConfig(), config = {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bhsd/codemirror-mediawiki",
-	"version": "2.1.11",
+	"version": "2.1.12",
 	"description": "Modified CodeMirror mode based on wikimedia/mediawiki-extensions-CodeMirror",
 	"keywords": [
 		"mediawiki",
@@ -35,7 +35,7 @@
 		"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 &",
+		"server": "npm run test:end; http-server .. -c-1 --cors &",
 		"test": "npm run build:core && npm run build:gh-page && npm run server",
 		"test:end": "pkill -x http-server"
 	},
@@ -52,24 +52,24 @@
 		"@codemirror/state": "^6.3.3",
 		"@codemirror/view": "^6.22.2",
 		"@lezer/highlight": "^1.2.0",
-		"@stylistic/eslint-plugin": "^1.5.3",
+		"@stylistic/eslint-plugin": "^1.5.4",
 		"@stylistic/stylelint-plugin": "^2.0.0",
 		"@types/jquery": "^3.5.29",
 		"@types/oojs-ui": "^0.47.6",
-		"@typescript-eslint/eslint-plugin": "^6.12.0",
-		"@typescript-eslint/parser": "^6.12.0",
-		"esbuild": "^0.19.7",
+		"@typescript-eslint/eslint-plugin": "^6.19.1",
+		"@typescript-eslint/parser": "^6.19.1",
+		"esbuild": "^0.19.12",
 		"eslint": "^8.56.0",
-		"eslint-plugin-es-x": "^7.3.0",
+		"eslint-plugin-es-x": "^7.5.0",
 		"eslint-plugin-eslint-comments": "^3.2.0",
 		"eslint-plugin-promise": "^6.1.1",
-		"eslint-plugin-regexp": "^2.1.2",
+		"eslint-plugin-regexp": "^2.2.0",
 		"eslint-plugin-unicorn": "^50.0.1",
 		"http-server": "^14.1.0",
 		"stylelint": "^16.1.0",
 		"stylelint-config-recommended": "^14.0.0",
 		"types-mediawiki": "^1.4.0",
-		"typescript": "^5.1.6",
-		"wikilint": "^2.3.2"
+		"typescript": "^5.3.3",
+		"wikilint": "^2.4.1"
 	}
 }

package/src/codemirror.ts

@@ -61,6 +61,7 @@ const avail: Record<string, [(config?: any) => Extension, Record<string, unknown
 		{},
 	],
 };
+const CDN = 'https://testingcf.jsdelivr.net';
 
 /**
  * 使用传统方法加载脚本
@@ -73,7 +74,7 @@ const loadScript = (src: string, target: string): Promise<void> => new Promise(r
 		return;
 	}
 	const script = document.createElement('script');
-	script.src = `https://testingcf.jsdelivr.net/${src}`;
+	script.src = `${CDN}/${src}`;
 	script.onload = (): void => {
 		resolve();
 	};
@@ -96,7 +97,7 @@ export class CodeMirror6 {
 	readonly #indent;
 	readonly #view;
 	#lang;
-	#visible = true;
+	#visible = false;
 
 	get textarea(): HTMLTextAreaElement {
 		return this.#textarea;
@@ -162,25 +163,12 @@ export class CodeMirror6 {
 			extensions,
 			doc: textarea.value,
 		});
-		const {selectionStart, selectionEnd, scrollTop} = textarea,
-			{fontSize, lineHeight} = getComputedStyle(textarea),
-			hasFocus = document.activeElement === textarea;
+		const {fontSize, lineHeight} = getComputedStyle(textarea);
 		textarea.parentNode!.insertBefore(this.#view.dom, textarea);
 		this.#minHeight();
-		this.#refresh();
 		this.#view.dom.style.fontSize = fontSize;
 		this.#view.scrollDOM.style.lineHeight = lineHeight;
-		this.#view.requestMeasure();
-		this.#view.dispatch({
-			selection: {anchor: selectionStart, head: selectionEnd},
-		});
-		textarea.style.display = 'none';
-		if (hasFocus) {
-			this.#view.focus();
-		}
-		requestAnimationFrame(() => {
-			this.#view.scrollDOM.scrollTop = scrollTop;
-		});
+		this.toggle(true);
 	}
 
 	/** 刷新编辑器高度 */
@@ -293,11 +281,21 @@ export class CodeMirror6 {
 	async getLinter(opt?: Record<string, unknown>): Promise<LintSource | undefined> {
 		switch (this.#lang) {
 			case 'mediawiki': {
-				const CDN = 'npm/wikiparser-node@1.3.4-b/extensions/dist',
-					src = `combine/${CDN}/base.min.js,${CDN}/lint.min.js`;
+				const REPO = 'npm/wikiparser-node@1.4.1-b',
+					DIR = `${REPO}/extensions/dist`,
+					src = `combine/${DIR}/base.min.js,${DIR}/lint.min.js`,
+					lang = opt?.['i18n'];
 				await loadScript(src, 'wikiparse');
-				const wikiLinter = new wikiparse.Linter(opt?.['include'] as boolean);
-				return doc => wikiLinter.codemirror(doc.toString());
+				if (typeof lang === 'string') {
+					try {
+						const i18n: Record<string, string>
+							= await (await fetch(`${CDN}/${REPO}/i18n/${lang.toLowerCase()}.json`)).json();
+						wikiparse.setI18N(i18n);
+					} catch {}
+				}
+				const wikiLinter = new wikiparse.Linter(opt?.['include'] as boolean | undefined);
+				return async doc =>
+					(await wikiLinter.codemirror(doc.toString())).filter(({severity}) => severity === 'error');
 			}
 			case 'javascript': {
 				await loadScript('npm/eslint-linter-browserify', 'eslint');
@@ -434,11 +432,39 @@ export class CodeMirror6 {
 	 */
 	toggle(show = !this.#visible): void {
 		if (show && !this.#visible) {
-			this.setContent(this.#textarea.value);
+			const {value, selectionStart, selectionEnd, scrollTop} = this.#textarea,
+				hasFocus = document.activeElement === this.#textarea;
+			this.setContent(value);
 			this.#refresh();
+			this.#view.dom.style.setProperty('display', '');
+			this.#textarea.style.display = 'none';
+			this.#view.requestMeasure();
+			this.#view.dispatch({
+				selection: {anchor: selectionStart, head: selectionEnd},
+			});
+			if (hasFocus) {
+				this.#view.focus();
+			}
+			requestAnimationFrame(() => {
+				this.#view.scrollDOM.scrollTop = scrollTop;
+			});
+		} else if (!show && this.#visible) {
+			const {state: {selection: {main: {from, to}}}, hasFocus} = this.#view,
+				{scrollDOM: {scrollTop}} = this.#view;
+			this.#view.dom.style.setProperty('display', 'none', 'important');
+			this.#textarea.style.display = '';
+			this.#textarea.setSelectionRange(
+				Math.min(from, to),
+				Math.max(from, to),
+				from > to ? 'backward' : 'forward',
+			);
+			if (hasFocus) {
+				this.#textarea.focus();
+			}
+			requestAnimationFrame(() => {
+				this.#textarea.scrollTop = scrollTop;
+			});
 		}
 		this.#visible = show;
-		this.#view.dom.style.setProperty('display', show ? '' : 'none', 'important');
-		this.#textarea.style.display = show ? 'none' : '';
 	}
 }