CODEWITHSUNDEEP
monaco-editor
Harshad Sindhav
Harshad Sindhav

Reputation: 181

Monaco-diff-editor: View only changed lines in monaco difference editor side by side view

In monaco code diff editor, complete content is shown in original and modified section for side by side view. Can anyone please help in a way to show only changed lines in code difference editor without unchanged contents in the diff editor.enter image description here

Upvotes: 4

Views: 8079

Answers (2)

Aleksey L.
Aleksey L.

Reputation: 38046

There's hideUnchangedRegions option:

const diffEditor = monaco.editor.createDiffEditor(
    document.getElementById("container"),
    {
        hideUnchangedRegions: {
            enabled: true
        },
    }
);

enter image description here

Docs

Playground

Upvotes: 1

pom
pom

Reputation: 483

Maybe you are looking for inline version?

https://microsoft.github.io/monaco-editor/playground.html#creating-the-diffeditor-inline-diff-example

key is setting renderSideBySide option to true


var diffEditor = monaco.editor.createDiffEditor(containerEl, {
    // Render the diff inline
    renderSideBySide: false
});

Upvotes: 3

Related Questions