Hey there- I’m from Replit and looking into the @codemirror/lint plugin that we’re currently using. I noticed it has a (currently somewhat hidden) feature to display a panel of all the lint warnings. However, the panel doesn’t match the rest of our our site theming.
Ideally we can use the @codemirror/lint plugin but override the diagnostic pane with our own theming and components. I built a simple react component that uses forEachDiagnostic and renders each diagnostic message the way we’d like to. Right now the implementation feels a bit clunky - I listen to setDiagnosticsEffects and map the latest StateView to React state.
Any thoughts on any API improvements to make it easier to override the default lint panel with custom components?
Any of the CSS used in the panel can be overridden with custom themes, if that helps. The panel implementation does a bunch of accessibility things that aren’t trivial to duplicate, so ideally you’d be able to use it. What kind of modifications, beyond CSS, were you looking to make?
Thanks for the reply. I think you’re right that we could get pretty far by overriding the CSS alone, but we may also want to add custom icons, show additional secondary text, or add context menus onclick.
Thanks for the reply. I think you’re right that we could get pretty far by overriding the CSS alone, but we may also want to add custom icons, show additional secondary text, or add context menus onclick.