CODEWITHSUNDEEP
javascriptmonaco-editorngx-monaco-editorreact-monaco-editor
SigGP
SigGP

Reputation: 786

How to embed custom HTML inside monaco editor?

I need to embed custom HTML (which represents system variable) inside monaco editor. Adding image to visualize (user_name).

enter image description here

HTML should behave like a single element (on backspace/delete the whole element should be removed - not character by character of text inside the variable) and shouldn't break caret.

I tried to achieve it via deltaDecorations but the problem is that it only allows to define some basic styles (such variable is still treated like a stadard text, not a single block) and adding paddings breaks the caret. I tried also to achieve it via DOM operations but editor clears such changes on any event (like scroll, selecting modified line, etc).

Has somebody any experience or advice how to handle it?

Upvotes: 0

Views: 250

Answers (0)

Related Questions