Hello,
I want to add a special background for our internal language in the editor. The internal language parser is connected using parseMixed. What would be the easiest way to do so? To get access to EditorView from parseMixed I have to pass thru several abstraction layers of my system, can I possibly specify some languageData in parseMixed?
Styling all content that has a given language is done with a highlight style with the scope and all options.
My structure is following: {{ return "some_typescript_here" }}, where I would have a typescriptLanguage between brackets “{{ }}”, and plaintext outside of the brackets.
My question is
→ what would be the way to specify styling for the whole block {{ return "some_typescript_here" }} ?
So, for instance, it would have the same backgrounColor, despite having typescriptLanguage active inside?
So - if I understood correctly:
I have to do following: use HiglightStyle to define a new highlight for a top node and pass “all” as a parameter so style would be applied to everything within the node, right?
@marijn thank you so much for your dirrection!
Not sure how I achieved that, but I got backgrounColor for the whole content inside the brackets, and I got typescript highlighting working as well. However → it doesn’t highlight spaces
with a following code:
I couldn’t use twigLanguage for a scope, nor parser.topNode. Ony this weird construction worked
Try scope: twigLanguage. Not sure what indexing the array of types with an empty string is supposed to do, but that won’t give you a scope.
That’s exactly my issue.
When I do
I’m getting no backgroundColor as well as now highlight for typescriptLanguage
I suspect I have a bad setup of twigLanguage, even when I try twigLanguage.parser.isActiveAt - for the range where it actually should be active - it’s always false
I would investigate more in the morning and report if the problem is on my side
Hello @marijn
Today I’ve cleaned my language configuration, and it feels like I have to pass highlight style for both languages if I have mixed languages. So I’m doing the following:
And I’m receiving those highlight styling appropriately, except for the spaces which are being skipped.
Is there anything I’m missing to target whitespaces?
Thank you so much!
Ahh, indeed, I tested this out and it was broken. @lezer/highlight 1.1.1 should fix it.
As for losing highlighting, I guess you’re only including the basic setup, which adds a fallback highlighter, but that will be ignored as soon as you add any other highlighters. Include syntaxHighlighting(defaultHighlightStyle) to get it back.
Thank you very much!
Finally I got my portion of quick from you, always impressive!
Appreciate it a lot
@marijn I don’t use a basic setup. I have built several extensions, including custom highlighters.
I’ve upgraded to lezer/highlight 1.1.1, but unfortunately, all my highlighters went missing. I would look into it, and would post if it’s my mistake or probably something off with the current update
How are you adding syntax highlighters to your extensions?
Yes, I’ve probably missed some changes
I’m doing the following:
I had an issue with versions conflict in my packages, that’s why I was loosing highlight
@marijn thank you so much for this update! now it works smoothly
Tagging onto this… I’m trying to do the same, but with the Markdown language, and having a lot of trouble. My best guess is that the Markdown language actually doesn’t have the same idea of a topNode as other languages? I’ve tried quite a lot of different variations and can’t find any way to get a highlighter to treat the Markdown tree differently from the TypeScript tree around it. Similar to the OP, I’m using parseMixed, giving it a Markdown parser for the parts of the tree we want to highlight as Markdown (specifically, comments).
Markdown is different.
I haven’t done this for Markdown yet
