Setting content for "gutter" / non-isWholeLine decorations

[mattgodbolt]

monaco-editor npm version: 0.7.0 Browser: Chrome 55 OS: Linux

I'm trying to replicate the "gutters" of CodeMirror. To that end I'm increasing the lineDecorationsWidth to give a large space, and then I'm trying to place non-isWholeLine decorations on relevant lines. However, I can only specify the class; not the content of the <div>. I'm trying to place x86 opcodes in the gutter as per my current CodeMirror solution: https://godbolt.org/g/vJEc6y - the address and opcodes on the left of the right-hand assembly pane.

Is there a way of setting the decoration content? The IModelDecorationOptions doesn't appear to have any way of specifying it.

[alexdima]

Although not very nice, you could use the lineNumbers option and pass in a function that would return what should be painted.

Alternatively, you could look into some CSS tricks involving ::before, ::after, or content: "...".

Finally, margins are useful if you want the content to scroll and the margins to stay put. If it is OK for the margin information to scroll with the content, you could simply create a model that contains the margin information and use decorations to colorize each line after a certain offset, and skip tokenization until a certain offset in a line, etc.

[mattgodbolt]

Thanks for the ideas. I considered the lineNumbers and may still yet go back to that idea. Ideally I'd set a smaller font for the line numbers/addresses, and also have hover text (like I can do with gutters).

The CSS tricks are a little out as I need each line to have different content, and short of defining dynamic CSS for each individual line I don't get an easy way to use the content:.

Margins are interesting; but I need the content to scroll with the gutter. Essentially it works like an annotation at the beginning of every line, with extra per-line parsed information that is to be shown smaller than the "normal" line contents (and doesn't participate in the same syntax colouration).

Maybe I can use in-model glyphs/icons (I think monaco supports those?) and put one at the beginning of each line.

[mattgodbolt]

An update on this: I tried the lineNumbers options but, I can't style the line numbers, and seemingly can't handle overlong content well.

More importantly the data I place in the line numbers (the opcodes of the disassembly) changes when the model changes and I can't be certain that the line numbers are updated if only that part of the model changes.

[mattgodbolt]

For what it's worth I'm using the lineNumbers options and have fiddled the style a little to be acceptable. Unfortunately in the 0.9.x release the clamp of the width of the line numbers (see #515) has broken this a little.

[JacobEvelyn]

Also, as I mentioned here, another issue with using lineNumbers is that there's no way to control when they get re-rendered (as far as I'm aware).