Editor

[A1Liu]

Add nice little editor thing using I guess monaco.

Got this code from https://github.com/microsoft/monaco-editor/issues/794 Svelte integration example here: https://dev.to/lawrencecchen/monaco-editor-svelte-kit-572

const width = 300;
const container = document.getElementById('container');
container.style.border = '1px solid #f00';
const editor = monaco.editor.create(container, {
    value: "function hello() {\n\talert('Hello world!');\n}",
    language: "javascript",
    scrollBeyondLastLine: false,
    wordWrap: 'on',
    wrappingStrategy: 'advanced',
    minimap: {
        enabled: false
    },
    overviewRulerLanes: 0,
    lineNumbers: "off",
    folding: false,
});
let ignoreEvent = false;
const updateHeight = () => {
    const contentHeight = Math.max(70, editor.getContentHeight());
    container.style.width = `${width}px`;
    container.style.height = `${contentHeight}px`;
    try {
        ignoreEvent = true;
        editor.layout({ width, height: contentHeight });
    } finally {
        ignoreEvent = false;
    }
};
editor.onDidContentSizeChange(updateHeight);
updateHeight();

[A1Liu]

20