Classify template braces as special braces #3

Closed
karlhorky wants to merge 1 commit from patch-1 into main
karlhorky commented 2022-01-15 18:05:59 +01:00 (Migrated from github.com)

Hi @marijnh ! 👋

Not sure if I did this correctly (and also not sure whether you want to accept this change), but I thought I'd give it a try to classify template braces (including the starting dollar brace) as a "special brace".

I did this by looking at the Lezer parser grammar for JavaScript and finding that there was this templateDollarBrace and templateClosingBrace.

github.com/lezer-parser/javascript@afdc2da197/src/javascript.grammar (L442)

However, I'm not sure if those are accessible how I have it in this PR.

If you are amenable to this change, but it is not working, feel free to let me know and I can fix it (I may need a bit of a hint how).


This is to improve the communication to developers that the dollar and braces are not a string literal part of the template string (and also improve the color contrast):

Prism.js / VS Code:

Screen Shot 2022-01-15 at 18 09 00

CodeMirror:

Screen Shot 2022-01-15 at 18 09 38

Hi @marijnh ! 👋 Not sure if I did this correctly (and also not sure whether you want to accept this change), but I thought I'd give it a try to classify template braces (including the starting dollar brace) as a "special brace". I did this by looking at the Lezer parser grammar for JavaScript and finding that there was this `templateDollarBrace` and `templateClosingBrace`. https://github.com/lezer-parser/javascript/blob/afdc2da19789486e8f42c966a2daddd54907614c/src/javascript.grammar#L442 However, I'm not sure if those are accessible how I have it in this PR. If you are amenable to this change, but it is not working, feel free to let me know and I can fix it (I may need a bit of a hint how). --- This is to improve the communication to developers that the dollar and braces are not a string literal part of the template string (and also improve the color contrast): Prism.js / VS Code: ![Screen Shot 2022-01-15 at 18 09 00](https://user-images.githubusercontent.com/1935696/149630936-55df0d3a-27e3-4778-8da6-2de90f73a7f4.png) CodeMirror: ![Screen Shot 2022-01-15 at 18 09 38](https://user-images.githubusercontent.com/1935696/149630944-709c9179-5a1d-4986-88d8-52ff092dcaf1.png)
marijnh commented 2022-01-17 11:44:14 +01:00 (Migrated from github.com)

That node, because it doesn't start with an upper-case letter, wasn't included in the tree, and thus can't be styled. Attached patches should add this properly.

That node, because it doesn't start with an upper-case letter, wasn't included in the tree, and thus can't be styled. Attached patches should add this properly.
karlhorky commented 2022-01-25 11:18:41 +01:00 (Migrated from github.com)

Ah great, thanks! Would this be included in a new version soon (I'm assuming either @codemirror/lang-javascript@0.19.7 or @codemirror/lang-javascript@0.20.0)?

I looked in the current version 0.19.6, but I couldn't see it: https://unpkg.com/browse/@codemirror/lang-javascript@0.19.6/dist/index.js

Ah great, thanks! Would this be included in a new version soon (I'm assuming either `@codemirror/lang-javascript@0.19.7` or `@codemirror/lang-javascript@0.20.0`)? I looked in the current version `0.19.6`, but I couldn't see it: https://unpkg.com/browse/@codemirror/lang-javascript@0.19.6/dist/index.js
marijnh commented 2022-01-28 11:17:49 +01:00 (Migrated from github.com)

I've tagged @codemirror/lang-javascript 0.19.7 and @lezer/javascript 0.15.3

I've tagged @codemirror/lang-javascript 0.19.7 and @lezer/javascript 0.15.3
karlhorky commented 2022-01-29 18:29:04 +01:00 (Migrated from github.com)

Thanks for publishing! Just tried it out in github.com/upleveled/theme-vs-code-dark-plus@b3fdce6106 , works! 🙌

Thanks for publishing! Just tried it out in https://github.com/upleveled/theme-vs-code-dark-plus/commit/b3fdce61066a6bb81396aa9fccaea64ef1f20f78 , works! 🙌

Pull request closed

Sign in to join this conversation.
No reviewers
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
codemirror/lang-javascript!3
No description provided.