indentation guides

I’m working on indentation guides in the codemirror 6 and I have an implementation that works well(ish).

It uses the Decoration.mark at various indents.
so If I have an indent of 8 on a particular line.
I might include an indent mark at range 0, 4 and 4, 8. (offset by line.from)

But indentation marks should also be visible on empty lines when it’s part of indentation block.
With the Decoration.mark I can’t put those on empty lines so I’m a bit stuck.

Any suggestions much appreciated!

1 Like

Does putting a widget decoration holding the styled spaces at the end of lines that aren’t long enough work?

1 Like

Perfect - thanks @marijn - just what I was looking for. Works great.

@stu Would you be willing to share your code for indentation guides? I’m looking to implement something similar.


here is my implement.
Hope to help you.

@mgmeyers sorry for the delay - needed to check whether I was able to share the code - and because of the holidays it took a while to get the all clear.

Below is our python indentation guides extension.
We only show the second level indentation or greater (easily changed to show the first one).
We also don’t do any highlighting of the current indentation guide (like vs code might - though that might not be too difficult to add).

1 Like

Thanks for releasing this @stu! I’m going to adapt this for Nota and you’ve saved me a lot of time :slight_smile:

Hello CodeMirror folks,

I’m inquiring about indentation guides on behalf of Project Jupyter. Right now, there are no indentation lines in JupyterLab, so any basic functionality would be an improvement here. The team is in the middle of upgrading to CodeMirror v6.

Taking a look at the official list of CodeMirror extensions and the indent service, I do not see indentation guides explicitly called out:

Have people been generally satisfied with the behavior of either @stu or @wuxuweilalala 's implementations?

The library does not come with a built-in indentation guides extension (mostly because I find them an exceedingly pointless feature), but it should be possible to build them as an extension (view plugin that adds the appropriate 1px border, -1px margin widgets after whitespace at the start of each viewport line), so I do hope someone publishes a package for this at some point.

I think the team already made such extension and it works quite well.