tsdoc icon indicating copy to clipboard operation
tsdoc copied to clipboard

TSDoc tag for tagged template literal declaring a language syntax it accepts?

Open eyelidlessness opened this issue 4 years ago • 0 comments

It's become somewhat common for tagged literals to be used to embed markup or other languages within a string, for instance a wide variety of CSS-in-JS solutions. By default, these are not syntax highlighted, linted, type checked etc in most tooling. There are some tooling extensions that are either syntax-specific (like this one for Sass) or fussy to use (like this one which must be repetitively used at a tagged literal call site and looks quite odd in that position).

It would be nice to be able to add a TSDoc tag to indicate that a template literal accepts a given language syntax. This would allow tooling to automatically/opt-in inject/perform functionality associated with that nested syntax. A contrived example:

/**
 * Renders EsotericMarkupLang to CompileTargetLang.
 *
 * @syntax esoteric
 */
const esoteric = (
  strings:     TemplateStringsArray,
  expressions: readonly any[]
) => {
  // ...
};

esoteric`
  #️⃣  This is an EsotericMarkupLang block

  My tooling knows about me!

  #️⃣#️⃣  For some reason...

  ... in EsotericMarkupLang, headings are declared with emoji 🤷
`

eyelidlessness avatar Mar 17 '21 19:03 eyelidlessness