2020-04-30 00:09:37 +00:00
|
|
|
/* eslint-disable consistent-return */
|
2016-12-14 05:26:26 +00:00
|
|
|
|
2016-07-27 03:32:10 +00:00
|
|
|
// Syntax Highlighter
|
|
|
|
//
|
|
|
|
// Applies a syntax highlighting color scheme CSS class to any element with the
|
|
|
|
// `js-syntax-highlight` class
|
|
|
|
//
|
|
|
|
// ### Example Markup
|
|
|
|
//
|
|
|
|
// <div class="js-syntax-highlight"></div>
|
|
|
|
//
|
2016-12-09 00:15:08 +00:00
|
|
|
|
2021-08-11 12:10:59 +00:00
|
|
|
export default function syntaxHighlight($els = null) {
|
|
|
|
if (!$els) return;
|
|
|
|
|
|
|
|
const els = $els.get ? $els.get() : $els;
|
|
|
|
const handler = (el) => {
|
|
|
|
if (el.classList.contains('js-syntax-highlight')) {
|
|
|
|
// Given the element itself, apply highlighting
|
|
|
|
return el.classList.add(gon.user_color_scheme);
|
|
|
|
}
|
|
|
|
// Given a parent element, recurse to any of its applicable children
|
|
|
|
const children = el.querySelectorAll('.js-syntax-highlight');
|
|
|
|
if (children.length) {
|
|
|
|
return syntaxHighlight(children);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
// In order to account for NodeList returned by document.querySelectorAll,
|
|
|
|
// we should rather check whether the els object is iterable
|
|
|
|
// instead of relying on Array.isArray()
|
|
|
|
const isIterable = typeof els[Symbol.iterator] === 'function';
|
|
|
|
|
|
|
|
if (isIterable) {
|
|
|
|
els.forEach((el) => handler(el));
|
|
|
|
} else {
|
|
|
|
handler(els);
|
2017-07-05 17:20:41 +00:00
|
|
|
}
|
2017-12-13 09:26:44 +00:00
|
|
|
}
|