monaco-editor icon indicating copy to clipboard operation
monaco-editor copied to clipboard

Highlight JSX in TypeScript.

Open sdegutis opened this issue 1 year ago • 1 comments

This PR adds JSX highlighting to TypeScript natively using Monaco's Monarch tokenizer, along with a few other nice to have changes:

  1. Highlight ... as a keyword
  2. Highlight export/etc as control-flow keywords
  3. Highlight class fields
  4. Highlight function/class names
  5. Highlight var/let/const names
  6. Highlight new Foo
  7. Highlight function/method calls
  8. Highlight JSX
  9. Highlight type names as type.identifier

It has been thoroughly tested on https://vanillajsx.com/monarch/ but it would be useful to have more people test for edge cases.

A few unrelated tests are failing such as PHP and Less, which I don't understand how they're related since my code is isolated to one file. The failures look to just be whitespace errors, but it's hard to tell.

I didn't update the TypeScript tests yet, so they're failing too.

sdegutis avatar Aug 23 '24 14:08 sdegutis

Hey, is there any followup to this PR? @thesoftwarephilosopher

raflymln avatar Jan 09 '25 09:01 raflymln

@microsoft-github-policy-service agree

sdegutis avatar Jan 09 '25 15:01 sdegutis

community PR approvals Started 101007m ago! Anyway this could be merged? It would be so useful to have built-in JSX/TSX highlighting. 😄

brianzinn avatar Jan 16 '25 01:01 brianzinn