Cropped hover markdown description using Monaco

Using Firefox and the Angular wrapper for Monaco, I get this behaviour :



The content is not displayed properly : it is cropped by the parent component. How should I handle this case ? I registred the suggestion using the following code :

monaco.languages.registerHoverProvider(this.language, {
provideHover: function (model: any, position: any) {

const word = model.getWordAtPosition(position);
if (!word) return;

const info = suggestionsFromApi.filter(item => item.label === word.word)[0];

if (info) {
let documentationContent = []
documentationContent = info.documentationMarkdownArray.map(item => ({value: item}));
return {
range: new monaco.Range(
position.lineNumber,
word.startColumn,
position.lineNumber,
word.endColumn
),
contents: documentationContent
};
}
return null;
}
});

Continue reading...