Custom class: Added mapper functions for language specific transformations (#1873) This adds support for mapper function to the `map` function, allowing for language-specific transformations.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122
diff --git a/plugins/custom-class/index.html b/plugins/custom-class/index.html
index 1d5de4f..2b56f21 100644
--- a/plugins/custom-class/index.html
+++ b/plugins/custom-class/index.html
@@ -52,10 +52,20 @@
keyword: 'special-keyword',
string: 'string_ch29s',
comment: 'comment_93jsa'
-})</code></pre>
+});</code></pre>
<p>Object's keys are the tokens you want to replace (eg: <code>comment</code>), with their values being the classes you want to use (eg: <code>my-comment</code>). Tokens which are not specified will stay the same.</p>
+ <p>Alternatively you can also pass a function that takes the original class and returns the mapped class. This function can also be used implement language specific mapped classes.<br>Example:</p>
+
+ <pre class="language-js"><code>Prism.plugins.customClass.map(function (className, language) {
+ if (language === 'css') {
+ return cssSpecificMap[className] || className;
+ } else {
+ return className;
+ }
+});</code></pre>
+
<h1>Notes</h1>
<ul>
@@ -113,14 +123,6 @@ Prism.plugins.customClass.prefix('pr-');</code></pre>
</code></pre></code></pre>
</section>
-<section>
- <h1>Todo</h1>
- <ul>
- <li>Take a function as the transformation (<a href="https://github.com/PrismJS/prism/pull/950#issuecomment-224289585">Comment in #950</a></li>
- <li>Allow to custom tokens per language, using nested object (<a href="https://github.com/PrismJS/prism/issues/947#issuecomment-216979932">Comment in #947</a>)</li>
- </ul>
-</section>
-
<footer data-src="templates/footer.html" data-type="text/html"></footer>
<script src="prism.js"></script>
diff --git a/plugins/custom-class/prism-custom-class.js b/plugins/custom-class/prism-custom-class.js
index bb5bd6a..3b5e6c1 100644
--- a/plugins/custom-class/prism-custom-class.js
+++ b/plugins/custom-class/prism-custom-class.js
@@ -7,24 +7,61 @@ if (
return;
}
+/**
+ * @callback ClassMapper
+ * @param {string} className
+ * @param {string} language
+ * @returns {string}
+ */
+/**
+ * @typedef CustomClassOptions
+ * @property {ClassMapper} classMap
+ * @property {string} prefixString
+ */
+
+/** @type {ClassMapper} */
+var defaultClassMap = function (className) { return className; };
+
+/** @type {CustomClassOptions} */
var options = {
- classMap: {}
+ classMap: defaultClassMap,
+ prefixString: ''
};
+
Prism.plugins.customClass = {
- map: function map(cm) {
- options.classMap = cm;
+ /**
+ * Maps all class names using the given object or map function.
+ *
+ * This does not affect the prefix.
+ *
+ * @param {Object<string, string> | ClassMapper} classMap
+ */
+ map: function map(classMap) {
+ if (typeof classMap === 'function') {
+ options.classMap = classMap;
+ } else {
+ options.classMap = function (className) {
+ return classMap[className] || className;
+ };
+ }
},
+ /**
+ * Adds the given prefix to all class names.
+ *
+ * @param {string} string
+ */
prefix: function prefix(string) {
options.prefixString = string;
}
}
Prism.hooks.add('wrap', function (env) {
- if (!options.classMap && !options.prefixString) {
+ if (options.classMap === defaultClassMap && !options.prefixString) {
return;
}
- env.classes = env.classes.map(function(c) {
- return (options.prefixString || '') + (options.classMap[c] || c);
+
+ env.classes = env.classes.map(function (c) {
+ return options.prefixString + options.classMap(c, env.language);
});
});
diff --git a/plugins/custom-class/prism-custom-class.min.js b/plugins/custom-class/prism-custom-class.min.js
index eee4b3e..a087f0e 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 self&&self.Prism||"undefined"!=typeof global&&global.Prism){var i={classMap:{}};Prism.plugins.customClass={map:function(s){i.classMap=s},prefix:function(s){i.prefixString=s}},Prism.hooks.add("wrap",function(s){(i.classMap||i.prefixString)&&(s.classes=s.classes.map(function(s){return(i.prefixString||"")+(i.classMap[s]||s)}))})}}();
\ No newline at end of file
+!function(){if("undefined"!=typeof self&&self.Prism||"undefined"!=typeof global&&global.Prism){var n=function(n){return n},s={classMap:n,prefixString:""};Prism.plugins.customClass={map:function(i){s.classMap="function"==typeof i?i:function(n){return i[n]||n}},prefix:function(n){s.prefixString=n}},Prism.hooks.add("wrap",function(i){(s.classMap!==n||s.prefixString)&&(i.classes=i.classes.map(function(n){return s.prefixString+s.classMap(n,i.language)}))})}}();
\ No newline at end of file