SystemSh0cker/monaco-editor
1
0
Fork 0
mirror of https://github.com/microsoft/monaco-editor.git synced 2025-12-22 17:25:39 +01:00
Code Issues Projects Releases Packages Activity

add example for inlay hints

Browse source
This commit is contained in:
hamidreza kalbasi 2021-08-27 12:53:29 +04:30
parent 14965508c7
commit 104b0cb587
4 changed files with 41 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

2
website/playground/new-samples/customizing-the-appearence/exposed-colors/sample.js
View file

@ -107,6 +107,8 @@ monaco.editor.create(document.getElementById("container"), {
'editorLineNumber.activeForeground' // Color of editor active line number.
'editorRuler.foreground' // Color of the editor rulers.
'editorCodeLens.foreground' // Foreground color of editor code lenses
'editorInlayHint.foreground' // Foreground color of editor inlay hints
'editorInlayHint.background' // Background color of editor inlay hints
'editorBracketMatch.background' // Background color behind matching brackets
'editorBracketMatch.border' // Color for matching brackets boxes
'editorOverviewRuler.border' // Color of the overview ruler border.

0
website/playground/new-samples/extending-language-services/inlay-hints-provider-example/sample.css Normal file
View file

1
website/playground/new-samples/extending-language-services/inlay-hints-provider-example/sample.html Normal file
View file

@ -0,0 +1 @@
<div id="container" style="height:100%;"></div>

38
website/playground/new-samples/extending-language-services/inlay-hints-provider-example/sample.js Normal file
View file

@ -0,0 +1,38 @@
const value = `
const f = (a, b) => a + b;
const result = f(2, 5);
`;
const editor = monaco.editor.create(document.getElementById("container"), {
value,
language: "javascript"
});
monaco.languages.registerInlayHintsProvider('javascript', {
provideInlayHints(model, range, token) {
return [{
kind: monaco.languages.InlayHintKind.Type,
position: { column: 13, lineNumber: 4 },
text: `: Number`,
}, {
kind: monaco.languages.InlayHintKind.Type,
position: { column: 13, lineNumber: 2 },
text: `: Number`,
}, {
kind: monaco.languages.InlayHintKind.Type,
position: { column: 16, lineNumber: 2 },
text: `: Number`,
whitespaceBefore: true, // see difference between a and b parameter
}, {
kind: monaco.languages.InlayHintKind.Parameter,
position: { column: 18, lineNumber: 4 },
text: `a:`,
}, {
kind: monaco.languages.InlayHintKind.Parameter,
position: { column: 21, lineNumber: 4 },
text: `b:`,
whitespaceAfter: true, // similar to whitespaceBefore
}]
}
});