htmlbars.js 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352
  1. /**
  2. * @param {string} value
  3. * @returns {RegExp}
  4. * */
  5. /**
  6. * @param {RegExp | string } re
  7. * @returns {string}
  8. */
  9. function source(re) {
  10. if (!re) return null;
  11. if (typeof re === "string") return re;
  12. return re.source;
  13. }
  14. /**
  15. * @param {RegExp | string } re
  16. * @returns {string}
  17. */
  18. function anyNumberOfTimes(re) {
  19. return concat('(', re, ')*');
  20. }
  21. /**
  22. * @param {RegExp | string } re
  23. * @returns {string}
  24. */
  25. function optional(re) {
  26. return concat('(', re, ')?');
  27. }
  28. /**
  29. * @param {...(RegExp | string) } args
  30. * @returns {string}
  31. */
  32. function concat(...args) {
  33. const joined = args.map((x) => source(x)).join("");
  34. return joined;
  35. }
  36. /**
  37. * Any of the passed expresssions may match
  38. *
  39. * Creates a huge this | this | that | that match
  40. * @param {(RegExp | string)[] } args
  41. * @returns {string}
  42. */
  43. function either(...args) {
  44. const joined = '(' + args.map((x) => source(x)).join("|") + ")";
  45. return joined;
  46. }
  47. /*
  48. Language: Handlebars
  49. Requires: xml.js
  50. Author: Robin Ward <robin.ward@gmail.com>
  51. Description: Matcher for Handlebars as well as EmberJS additions.
  52. Website: https://handlebarsjs.com
  53. Category: template
  54. */
  55. function handlebars(hljs) {
  56. const BUILT_INS = {
  57. 'builtin-name': [
  58. 'action',
  59. 'bindattr',
  60. 'collection',
  61. 'component',
  62. 'concat',
  63. 'debugger',
  64. 'each',
  65. 'each-in',
  66. 'get',
  67. 'hash',
  68. 'if',
  69. 'in',
  70. 'input',
  71. 'link-to',
  72. 'loc',
  73. 'log',
  74. 'lookup',
  75. 'mut',
  76. 'outlet',
  77. 'partial',
  78. 'query-params',
  79. 'render',
  80. 'template',
  81. 'textarea',
  82. 'unbound',
  83. 'unless',
  84. 'view',
  85. 'with',
  86. 'yield'
  87. ]
  88. };
  89. const LITERALS = {
  90. literal: [
  91. 'true',
  92. 'false',
  93. 'undefined',
  94. 'null'
  95. ]
  96. };
  97. // as defined in https://handlebarsjs.com/guide/expressions.html#literal-segments
  98. // this regex matches literal segments like ' abc ' or [ abc ] as well as helpers and paths
  99. // like a/b, ./abc/cde, and abc.bcd
  100. const DOUBLE_QUOTED_ID_REGEX = /""|"[^"]+"/;
  101. const SINGLE_QUOTED_ID_REGEX = /''|'[^']+'/;
  102. const BRACKET_QUOTED_ID_REGEX = /\[\]|\[[^\]]+\]/;
  103. const PLAIN_ID_REGEX = /[^\s!"#%&'()*+,.\/;<=>@\[\\\]^`{|}~]+/;
  104. const PATH_DELIMITER_REGEX = /(\.|\/)/;
  105. const ANY_ID = either(
  106. DOUBLE_QUOTED_ID_REGEX,
  107. SINGLE_QUOTED_ID_REGEX,
  108. BRACKET_QUOTED_ID_REGEX,
  109. PLAIN_ID_REGEX
  110. );
  111. const IDENTIFIER_REGEX = concat(
  112. optional(/\.|\.\/|\//), // relative or absolute path
  113. ANY_ID,
  114. anyNumberOfTimes(concat(
  115. PATH_DELIMITER_REGEX,
  116. ANY_ID
  117. ))
  118. );
  119. // identifier followed by a equal-sign (without the equal sign)
  120. const HASH_PARAM_REGEX = concat(
  121. '(',
  122. BRACKET_QUOTED_ID_REGEX, '|',
  123. PLAIN_ID_REGEX,
  124. ')(?==)'
  125. );
  126. const HELPER_NAME_OR_PATH_EXPRESSION = {
  127. begin: IDENTIFIER_REGEX,
  128. lexemes: /[\w.\/]+/
  129. };
  130. const HELPER_PARAMETER = hljs.inherit(HELPER_NAME_OR_PATH_EXPRESSION, {
  131. keywords: LITERALS
  132. });
  133. const SUB_EXPRESSION = {
  134. begin: /\(/,
  135. end: /\)/
  136. // the "contains" is added below when all necessary sub-modes are defined
  137. };
  138. const HASH = {
  139. // fka "attribute-assignment", parameters of the form 'key=value'
  140. className: 'attr',
  141. begin: HASH_PARAM_REGEX,
  142. relevance: 0,
  143. starts: {
  144. begin: /=/,
  145. end: /=/,
  146. starts: {
  147. contains: [
  148. hljs.NUMBER_MODE,
  149. hljs.QUOTE_STRING_MODE,
  150. hljs.APOS_STRING_MODE,
  151. HELPER_PARAMETER,
  152. SUB_EXPRESSION
  153. ]
  154. }
  155. }
  156. };
  157. const BLOCK_PARAMS = {
  158. // parameters of the form '{{#with x as | y |}}...{{/with}}'
  159. begin: /as\s+\|/,
  160. keywords: {
  161. keyword: 'as'
  162. },
  163. end: /\|/,
  164. contains: [
  165. {
  166. // define sub-mode in order to prevent highlighting of block-parameter named "as"
  167. begin: /\w+/
  168. }
  169. ]
  170. };
  171. const HELPER_PARAMETERS = {
  172. contains: [
  173. hljs.NUMBER_MODE,
  174. hljs.QUOTE_STRING_MODE,
  175. hljs.APOS_STRING_MODE,
  176. BLOCK_PARAMS,
  177. HASH,
  178. HELPER_PARAMETER,
  179. SUB_EXPRESSION
  180. ],
  181. returnEnd: true
  182. // the property "end" is defined through inheritance when the mode is used. If depends
  183. // on the surrounding mode, but "endsWithParent" does not work here (i.e. it includes the
  184. // end-token of the surrounding mode)
  185. };
  186. const SUB_EXPRESSION_CONTENTS = hljs.inherit(HELPER_NAME_OR_PATH_EXPRESSION, {
  187. className: 'name',
  188. keywords: BUILT_INS,
  189. starts: hljs.inherit(HELPER_PARAMETERS, {
  190. end: /\)/
  191. })
  192. });
  193. SUB_EXPRESSION.contains = [SUB_EXPRESSION_CONTENTS];
  194. const OPENING_BLOCK_MUSTACHE_CONTENTS = hljs.inherit(HELPER_NAME_OR_PATH_EXPRESSION, {
  195. keywords: BUILT_INS,
  196. className: 'name',
  197. starts: hljs.inherit(HELPER_PARAMETERS, {
  198. end: /\}\}/
  199. })
  200. });
  201. const CLOSING_BLOCK_MUSTACHE_CONTENTS = hljs.inherit(HELPER_NAME_OR_PATH_EXPRESSION, {
  202. keywords: BUILT_INS,
  203. className: 'name'
  204. });
  205. const BASIC_MUSTACHE_CONTENTS = hljs.inherit(HELPER_NAME_OR_PATH_EXPRESSION, {
  206. className: 'name',
  207. keywords: BUILT_INS,
  208. starts: hljs.inherit(HELPER_PARAMETERS, {
  209. end: /\}\}/
  210. })
  211. });
  212. const ESCAPE_MUSTACHE_WITH_PRECEEDING_BACKSLASH = {
  213. begin: /\\\{\{/,
  214. skip: true
  215. };
  216. const PREVENT_ESCAPE_WITH_ANOTHER_PRECEEDING_BACKSLASH = {
  217. begin: /\\\\(?=\{\{)/,
  218. skip: true
  219. };
  220. return {
  221. name: 'Handlebars',
  222. aliases: [
  223. 'hbs',
  224. 'html.hbs',
  225. 'html.handlebars',
  226. 'htmlbars'
  227. ],
  228. case_insensitive: true,
  229. subLanguage: 'xml',
  230. contains: [
  231. ESCAPE_MUSTACHE_WITH_PRECEEDING_BACKSLASH,
  232. PREVENT_ESCAPE_WITH_ANOTHER_PRECEEDING_BACKSLASH,
  233. hljs.COMMENT(/\{\{!--/, /--\}\}/),
  234. hljs.COMMENT(/\{\{!/, /\}\}/),
  235. {
  236. // open raw block "{{{{raw}}}} content not evaluated {{{{/raw}}}}"
  237. className: 'template-tag',
  238. begin: /\{\{\{\{(?!\/)/,
  239. end: /\}\}\}\}/,
  240. contains: [OPENING_BLOCK_MUSTACHE_CONTENTS],
  241. starts: {
  242. end: /\{\{\{\{\//,
  243. returnEnd: true,
  244. subLanguage: 'xml'
  245. }
  246. },
  247. {
  248. // close raw block
  249. className: 'template-tag',
  250. begin: /\{\{\{\{\//,
  251. end: /\}\}\}\}/,
  252. contains: [CLOSING_BLOCK_MUSTACHE_CONTENTS]
  253. },
  254. {
  255. // open block statement
  256. className: 'template-tag',
  257. begin: /\{\{#/,
  258. end: /\}\}/,
  259. contains: [OPENING_BLOCK_MUSTACHE_CONTENTS]
  260. },
  261. {
  262. className: 'template-tag',
  263. begin: /\{\{(?=else\}\})/,
  264. end: /\}\}/,
  265. keywords: 'else'
  266. },
  267. {
  268. className: 'template-tag',
  269. begin: /\{\{(?=else if)/,
  270. end: /\}\}/,
  271. keywords: 'else if'
  272. },
  273. {
  274. // closing block statement
  275. className: 'template-tag',
  276. begin: /\{\{\//,
  277. end: /\}\}/,
  278. contains: [CLOSING_BLOCK_MUSTACHE_CONTENTS]
  279. },
  280. {
  281. // template variable or helper-call that is NOT html-escaped
  282. className: 'template-variable',
  283. begin: /\{\{\{/,
  284. end: /\}\}\}/,
  285. contains: [BASIC_MUSTACHE_CONTENTS]
  286. },
  287. {
  288. // template variable or helper-call that is html-escaped
  289. className: 'template-variable',
  290. begin: /\{\{/,
  291. end: /\}\}/,
  292. contains: [BASIC_MUSTACHE_CONTENTS]
  293. }
  294. ]
  295. };
  296. }
  297. /*
  298. Language: HTMLBars (legacy)
  299. Requires: xml.js
  300. Description: Matcher for Handlebars as well as EmberJS additions.
  301. Website: https://github.com/tildeio/htmlbars
  302. Category: template
  303. */
  304. function htmlbars(hljs) {
  305. const definition = handlebars(hljs);
  306. definition.name = "HTMLbars";
  307. // HACK: This lets handlebars do the auto-detection if it's been loaded (by
  308. // default the build script will load in alphabetical order) and if not (perhaps
  309. // an install is only using `htmlbars`, not `handlebars`) then this will still
  310. // allow HTMLBars to participate in the auto-detection
  311. // worse case someone will have HTMLbars and handlebars competing for the same
  312. // content and will need to change their setup to only require handlebars, but
  313. // I don't consider this a breaking change
  314. if (hljs.getLanguage("handlebars")) {
  315. definition.disableAutodetect = true;
  316. }
  317. return definition;
  318. }
  319. module.exports = htmlbars;