I had plans for this but it appears I never finished. Would a way for a highlighting style to scope rules to a specific language work for your use case?
Yeah that would work
The idea is that each theme will want to provide its own highlighter
One drawback of this is that if a person wanted to toggle between light and dark modes by adding a class to the root of their app, they would also have to write additional javascript to toggle the theme of codemirror instead of relying on css from the app toggle.
The problem with hardcoded values is that they’ll clash. And things like highlight styles don’t assign names to rules at all right now.
As long as each spec fed into HighlightStyle
is given a unique name, there shouldn’t be conflict right? For example,
export const oneDarkHighlightStyle = HighlightStyle.define(
{tag: t.keyword,
name: "cm-keyword",
color: violet},
{tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
name: "cm-meta",
color: coral},
{tag: t.string,
name: "cm-string",
color: sage},
}
Edit: A small, additional reason for having hardcoded / stable class-names is that it would make debugging styles a bit easier: e.g. given ͼ2, it’s hard to know looking at the class only which of the style tags were applied.