Commit 4b55bd6af88559d430fc195fbe5845364ade8df1

Michael Schmidt 2021-06-27T21:23:05

Made Match Braces and Custom Class compatible (#2947)

diff --git a/plugins/custom-class/prism-custom-class.js b/plugins/custom-class/prism-custom-class.js
index a9a2326..a8dca48 100644
--- a/plugins/custom-class/prism-custom-class.js
+++ b/plugins/custom-class/prism-custom-class.js
@@ -30,6 +30,15 @@
 	var prefixString = '';
 
 
+	/**
+	 * @param {string} className
+	 * @param {string} language
+	 */
+	function apply(className, language) {
+		return prefixString + (mapper ? mapper(className, language) : className);
+	}
+
+
 	Prism.plugins.customClass = {
 		/**
 		 * Sets the function which can be used to add custom aliases to any token.
@@ -62,7 +71,16 @@
 		 */
 		prefix: function prefix(string) {
 			prefixString = string || '';
-		}
+		},
+		/**
+		 * Applies the current mapping and prefix to the given class name.
+		 *
+		 * @param {string} className A single class name.
+		 * @param {string} language The language of the code that contains this class name.
+		 *
+		 * If the language is unknown, pass `"none"`.
+		 */
+		apply: apply
 	};
 
 	Prism.hooks.add('wrap', function (env) {
@@ -85,7 +103,7 @@
 		}
 
 		env.classes = env.classes.map(function (c) {
-			return prefixString + (mapper ? mapper(c, env.language) : c);
+			return apply(c, env.language);
 		});
 	});
 
diff --git a/plugins/custom-class/prism-custom-class.min.js b/plugins/custom-class/prism-custom-class.min.js
index 2b09f50..e6331f9 100644
--- a/plugins/custom-class/prism-custom-class.min.js
+++ b/plugins/custom-class/prism-custom-class.min.js
@@ -1 +1 @@
-!function(){if("undefined"!=typeof Prism){var a,e,t="";Prism.plugins.customClass={add:function(n){a=n},map:function(s){e="function"==typeof s?s:function(n){return s[n]||n}},prefix:function(n){t=n||""}},Prism.hooks.add("wrap",function(s){if(a){var n=a({content:s.content,type:s.type,language:s.language});Array.isArray(n)?s.classes.push.apply(s.classes,n):n&&s.classes.push(n)}(e||t)&&(s.classes=s.classes.map(function(n){return t+(e?e(n,s.language):n)}))})}}();
\ No newline at end of file
+!function(){if("undefined"!=typeof Prism){var a,t,e="";Prism.plugins.customClass={add:function(n){a=n},map:function(s){t="function"==typeof s?s:function(n){return s[n]||n}},prefix:function(n){e=n||""},apply:u},Prism.hooks.add("wrap",function(s){if(a){var n=a({content:s.content,type:s.type,language:s.language});Array.isArray(n)?s.classes.push.apply(s.classes,n):n&&s.classes.push(n)}(t||e)&&(s.classes=s.classes.map(function(n){return u(n,s.language)}))})}function u(n,s){return e+(t?t(n,s):n)}}();
\ No newline at end of file
diff --git a/plugins/match-braces/prism-match-braces.js b/plugins/match-braces/prism-match-braces.js
index 97d7c77..bb3faf4 100644
--- a/plugins/match-braces/prism-match-braces.js
+++ b/plugins/match-braces/prism-match-braces.js
@@ -4,6 +4,15 @@
 		return;
 	}
 
+	function mapClassName(name) {
+		var customClass = Prism.plugins.customClass;
+		if (customClass) {
+			return customClass.apply(name, 'none');
+		} else {
+			return name;
+		}
+	}
+
 	var PARTNER = {
 		'(': ')',
 		'[': ']',
@@ -51,7 +60,7 @@
 		}
 
 		[this, getPartnerBrace(this)].forEach(function (e) {
-			e.classList.add('brace-hover');
+			e.classList.add(mapClassName('brace-hover'));
 		});
 	}
 	/**
@@ -59,7 +68,7 @@
 	 */
 	function leaveBrace() {
 		[this, getPartnerBrace(this)].forEach(function (e) {
-			e.classList.remove('brace-hover');
+			e.classList.remove(mapClassName('brace-hover'));
 		});
 	}
 	/**
@@ -71,7 +80,7 @@
 		}
 
 		[this, getPartnerBrace(this)].forEach(function (e) {
-			e.classList.add('brace-selected');
+			e.classList.add(mapClassName('brace-selected'));
 		});
 	}
 
@@ -102,22 +111,25 @@
 			pre.addEventListener('mousedown', function removeBraceSelected() {
 				// the code element might have been replaced
 				var code = pre.querySelector('code');
-				Array.prototype.slice.call(code.querySelectorAll('.brace-selected')).forEach(function (e) {
-					e.classList.remove('brace-selected');
+				var className = mapClassName('brace-selected');
+				Array.prototype.slice.call(code.querySelectorAll('.' + className)).forEach(function (e) {
+					e.classList.remove(className);
 				});
 			});
 			Object.defineProperty(pre, '__listenerAdded', { value: true });
 		}
 
 		/** @type {HTMLSpanElement[]} */
-		var punctuation = Array.prototype.slice.call(code.querySelectorAll('span.token.punctuation'));
+		var punctuation = Array.prototype.slice.call(
+			code.querySelectorAll('span.' + mapClassName('token') + '.' + mapClassName('punctuation'))
+		);
 
 		/** @type {{ index: number, open: boolean, element: HTMLElement }[]} */
 		var allBraces = [];
 
 		toMatch.forEach(function (open) {
 			var close = PARTNER[open];
-			var name = NAMES[open];
+			var name = mapClassName(NAMES[open]);
 
 			/** @type {[number, number][]} */
 			var pairs = [];
@@ -132,12 +144,12 @@
 					if (text === open) {
 						allBraces.push({ index: i, open: true, element: element });
 						element.classList.add(name);
-						element.classList.add('brace-open');
+						element.classList.add(mapClassName('brace-open'));
 						openStack.push(i);
 					} else if (text === close) {
 						allBraces.push({ index: i, open: false, element: element });
 						element.classList.add(name);
-						element.classList.add('brace-close');
+						element.classList.add(mapClassName('brace-close'));
 						if (openStack.length) {
 							pairs.push([i, openStack.pop()]);
 						}
@@ -166,11 +178,11 @@
 		allBraces.sort(function (a, b) { return a.index - b.index; });
 		allBraces.forEach(function (brace) {
 			if (brace.open) {
-				brace.element.classList.add('brace-level-' + (level % LEVEL_WARP + 1));
+				brace.element.classList.add(mapClassName('brace-level-' + (level % LEVEL_WARP + 1)));
 				level++;
 			} else {
 				level = Math.max(0, level - 1);
-				brace.element.classList.add('brace-level-' + (level % LEVEL_WARP + 1));
+				brace.element.classList.add(mapClassName('brace-level-' + (level % LEVEL_WARP + 1)));
 			}
 		});
 	});
diff --git a/plugins/match-braces/prism-match-braces.min.js b/plugins/match-braces/prism-match-braces.min.js
index 8dc9ec4..990b94a 100644
--- a/plugins/match-braces/prism-match-braces.min.js
+++ b/plugins/match-braces/prism-match-braces.min.js
@@ -1 +1 @@
-!function(){if("undefined"!=typeof Prism&&"undefined"!=typeof document){var d={"(":")","[":"]","{":"}"},u={"(":"brace-round","[":"brace-square","{":"brace-curly"},f={"${":"{"},h=0,n=/^(pair-\d+-)(open|close)$/;Prism.hooks.add("complete",function(e){var t=e.element,n=t.parentElement;if(n&&"PRE"==n.tagName){var c=[];if(Prism.util.isActive(t,"match-braces")&&c.push("(","[","{"),0!=c.length){n.__listenerAdded||(n.addEventListener("mousedown",function(){var e=n.querySelector("code");Array.prototype.slice.call(e.querySelectorAll(".brace-selected")).forEach(function(e){e.classList.remove("brace-selected")})}),Object.defineProperty(n,"__listenerAdded",{value:!0}));var o=Array.prototype.slice.call(t.querySelectorAll("span.token.punctuation")),l=[];c.forEach(function(e){for(var t=d[e],n=u[e],c=[],r=[],i=0;i<o.length;i++){var s=o[i];if(0==s.childElementCount){var a=s.textContent;(a=f[a]||a)===e?(l.push({index:i,open:!0,element:s}),s.classList.add(n),s.classList.add("brace-open"),r.push(i)):a===t&&(l.push({index:i,open:!1,element:s}),s.classList.add(n),s.classList.add("brace-close"),r.length&&c.push([i,r.pop()]))}}c.forEach(function(e){var t="pair-"+h+++"-",n=o[e[0]],c=o[e[1]];n.id=t+"open",c.id=t+"close",[n,c].forEach(function(e){e.addEventListener("mouseenter",p),e.addEventListener("mouseleave",v),e.addEventListener("click",m)})})});var r=0;l.sort(function(e,t){return e.index-t.index}),l.forEach(function(e){e.open?(e.element.classList.add("brace-level-"+(r%12+1)),r++):(r=Math.max(0,r-1),e.element.classList.add("brace-level-"+(r%12+1)))})}}})}function e(e){var t=n.exec(e.id);return document.querySelector("#"+t[1]+("open"==t[2]?"close":"open"))}function p(){Prism.util.isActive(this,"brace-hover",!0)&&[this,e(this)].forEach(function(e){e.classList.add("brace-hover")})}function v(){[this,e(this)].forEach(function(e){e.classList.remove("brace-hover")})}function m(){Prism.util.isActive(this,"brace-select",!0)&&[this,e(this)].forEach(function(e){e.classList.add("brace-selected")})}}();
\ No newline at end of file
+!function(){if("undefined"!=typeof Prism&&"undefined"!=typeof document){var d={"(":")","[":"]","{":"}"},u={"(":"brace-round","[":"brace-square","{":"brace-curly"},f={"${":"{"},h=0,n=/^(pair-\d+-)(open|close)$/;Prism.hooks.add("complete",function(e){var t=e.element,n=t.parentElement;if(n&&"PRE"==n.tagName){var r=[];if(Prism.util.isActive(t,"match-braces")&&r.push("(","[","{"),0!=r.length){n.__listenerAdded||(n.addEventListener("mousedown",function(){var e=n.querySelector("code"),t=p("brace-selected");Array.prototype.slice.call(e.querySelectorAll("."+t)).forEach(function(e){e.classList.remove(t)})}),Object.defineProperty(n,"__listenerAdded",{value:!0}));var o=Array.prototype.slice.call(t.querySelectorAll("span."+p("token")+"."+p("punctuation"))),l=[];r.forEach(function(e){for(var t=d[e],n=p(u[e]),r=[],c=[],s=0;s<o.length;s++){var i=o[s];if(0==i.childElementCount){var a=i.textContent;(a=f[a]||a)===e?(l.push({index:s,open:!0,element:i}),i.classList.add(n),i.classList.add(p("brace-open")),c.push(s)):a===t&&(l.push({index:s,open:!1,element:i}),i.classList.add(n),i.classList.add(p("brace-close")),c.length&&r.push([s,c.pop()]))}}r.forEach(function(e){var t="pair-"+h+++"-",n=o[e[0]],r=o[e[1]];n.id=t+"open",r.id=t+"close",[n,r].forEach(function(e){e.addEventListener("mouseenter",v),e.addEventListener("mouseleave",m),e.addEventListener("click",b)})})});var c=0;l.sort(function(e,t){return e.index-t.index}),l.forEach(function(e){e.open?(e.element.classList.add(p("brace-level-"+(c%12+1))),c++):(c=Math.max(0,c-1),e.element.classList.add(p("brace-level-"+(c%12+1))))})}}})}function p(e){var t=Prism.plugins.customClass;return t?t.apply(e,"none"):e}function e(e){var t=n.exec(e.id);return document.querySelector("#"+t[1]+("open"==t[2]?"close":"open"))}function v(){Prism.util.isActive(this,"brace-hover",!0)&&[this,e(this)].forEach(function(e){e.classList.add(p("brace-hover"))})}function m(){[this,e(this)].forEach(function(e){e.classList.remove(p("brace-hover"))})}function b(){Prism.util.isActive(this,"brace-select",!0)&&[this,e(this)].forEach(function(e){e.classList.add(p("brace-selected"))})}}();
\ No newline at end of file