Better notebook markup renderer api (#121882)

* Better notebook markup renderer api

For #121256

- Use js modules for notebook output renderers
- Rename apis from `markdown` to `markup`
- Use imports and exports for apis instead of globals for apis
- Use esbuild instead of webpack so we can emit js modules
- Clearly split top level markup renderes from renderers that extend other renderers

* Use constant instead of comment for replacement

extensions/markdown-language-features/notebook/index.ts

@@ -3,31 +3,37 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import * as MarkdownIt from 'markdown-it';
+const MarkdownIt = require('markdown-it');
 
-declare const acquireNotebookRendererApi: any;
-type extendMarkdownItFnType = (
-	(f: (md: MarkdownIt.MarkdownIt) => void) => void
-);
-
-(function () {
-	const markdownIt = new MarkdownIt({
+export async function activate(ctx: {
+	dependencies: ReadonlyArray<{ entrypoint: string }>
+}) {
+	let markdownIt = new MarkdownIt({
 		html: true
 	});
 
-	(globalThis as any).extendMarkdownIt = ((f: (md: MarkdownIt.MarkdownIt) => void) => {
-		f(markdownIt);
-	}) as extendMarkdownItFnType;
-
-	const notebook = acquireNotebookRendererApi('notebookCoreTestRenderer');
-
-	notebook.onDidCreateMarkdown(({ element, content }: any) => {
-		const rendered = markdownIt.render(content);
-		element.innerHTML = rendered;
-
-		// Insert styles into markdown preview shadow dom so that they are applied
-		for (const markdownStyleNode of document.getElementsByClassName('markdown-style')) {
-			element.appendChild(markdownStyleNode.cloneNode(true));
+	// Should we load the deps before this point?
+	// Also could we await inside `renderMarkup`?
+	await Promise.all(ctx.dependencies.map(async (dep) => {
+		try {
+			const api = await import(dep.entrypoint);
+			if (api?.extendMarkdownIt) {
+				markdownIt = api.extendMarkdownIt(markdownIt);
+			}
+		} catch (e) {
+			console.error('Could not load markdown entryPoint', e);
 		}
-	});
-}());
+	}));
+
+	return {
+		renderMarkup: (context: { element: HTMLElement, content: string }) => {
+			const rendered = markdownIt.render(context.content);
+			context.element.innerHTML = rendered;
+
+			// Insert styles into markdown preview shadow dom so that they are applied
+			for (const markdownStyleNode of document.getElementsByClassName('markdown-style')) {
+				context.element.appendChild(markdownStyleNode.cloneNode(true));
+			}
+		}
+	};
+}

extensions/markdown-language-features/notebook/tsconfig.json

@@ -3,6 +3,7 @@
 	"compilerOptions": {
 		"outDir": "./dist/",
 		"jsx": "react",
+		"module": "es2020",
 		"lib": [
 			"es2018",
 			"DOM",