How can I implement my own code outline layout in vscode?

Okay, my request is now solved.

The CodeMap extension, is basically the extension I'm looking for.

I followed their guide on https://github.com/oleg-shilo/codemap.vscode/wiki/Adding-custom-mappers

I created a custom dedicated mapper "mapper_X.js" saved it to an arbitrary location, and in my vscode user-settings I pasted "codemap.X": "mylocation\\mapper_X.js", (as described in the github guide). I then opened up a new file, saved it as untitled.X and typed some syntax (the example code in my question), now I could see my custom outline.

As could be seen in the result-link below I have (deliberately) not defined my mapper to consider any other cases yet. My mapper is still in its infancy state. Just thought I'd share my findings before I forget I posted this question...

In recent versions of VS Code there is an API for populating the outline view without needing to depend on third party extensions (except the one you need to write yourself).

This works by registering a DocumentSymbolProvider.

export function activate(context: vscode.ExtensionContext) {
    context.subscriptions.push(
        vscode.languages.registerDocumentSymbolProvider(
            {scheme: "file", language: "swmf-config"}, 
            new SwmfConfigDocumentSymbolProvider())
    );
}

This permits a flat structure or a tree structure in the outline view (the two cannot be mixed).

class SwmfConfigDocumentSymbolProvider implements vscode.DocumentSymbolProvider {
    public provideDocumentSymbols(
        document: vscode.TextDocument,
        token: vscode.CancellationToken): Promise<vscode.DocumentSymbol[]> {
        return new Promise((resolve, reject) => {
            let symbols: vscode.DocumentSymbol[] = [];
            for (var i = 0; i < document.lineCount; i++) {
                var line = document.lineAt(i);
                if (line.text.startsWith("#")) {
                    let symbol = new vscode.DocumentSymbol(
                        line.text, 'Component',
                        vscode.SymbolKind.Function,
                        line.range, line.range)
                    symbols.push(symbol)
                }
            }
            resolve(symbols);
        });
    }
}

For a small, fully working example giving a tree structure in the outline view, see https://github.com/svaberg/SWMF-grammar