Combine syntax highlighting and diff highlighting

[Janosh Riebesell]

I think I may have run into a use case for a new line transformer. I'd like to combine syntax highlighting and diff highlighting. As an example, this

```js-diff
- export const oldNoop = () => {}
+ export const newNoop = () => {}
```

should render as a combination of regular highlights

export const oldNoop = () => {}
export const newNoop = () => {}

plus added lines in green and removed lines in red.

- export const oldNoop = () => {}
+ export const newNoop = () => {}

What's your take on this? Would a line transformer be the best way to accomplish this?

[Andrew Branch]

Would a line transformer be the best way to accomplish this?

I would think so! I would probably recommend using ```js {diff} instead of ```js-diff because you’d have to set up a language name alias for every language you want to diff, and while the language name currently gets passed to line transformers however you’ve typed it, aliases are supposed to be transparent.

[Janosh Riebesell]

@andrewbranch I know you're not a big fan of those but I was thinking maybe the diff line transformer should support similar comment directives (// add-line, // del-line, etc.) to the line highlighting transformer (// highlight-line, // highlight-next-line, etc.). Reason for this being that I noticed some code formatters don't seem to like + and - signs at the start of a line and either auto-indent them or wrap them around to the end of the previous line. Can't remember where I had that problem now though.