Refactor @astrojs/prism, fix Prism component import not working (#4114)

* Upgrade @astrojs/prism to a real package, fix component import not working

* Remove `@astrojs/prism` as a dependency of `astro`

* Update lock file

* Refactor to multiple files

* Oops, can't have astro imports run inside node

* Follow Nate's suggestion on being minors instead of patchs

* Update lockfile

1 files changed, 2 insertions, 44 deletions

diff --git a/packages/integrations/mdx/src/remark-prism.ts b/packages/integrations/mdx/src/remark-prism.ts
index 4a324dd1d..7dc05f358 100644
--- a/packages/integrations/mdx/src/remark-prism.ts
+++ b/packages/integrations/mdx/src/remark-prism.ts
@@ -1,48 +1,6 @@
-// TODO: discuss extracting this file to @astrojs/prism
-import { addAstro } from '@astrojs/prism/internal';
-import Prism from 'prismjs';
-import loadLanguages from 'prismjs/components/index.js';
+import { runHighlighterWithAstro } from '@astrojs/prism/dist/highlighter';
 import { visit } from 'unist-util-visit';
 
-const languageMap = new Map([['ts', 'typescript']]);
-
-function runHighlighter(lang: string, code: string) {
-	let classLanguage = `language-${lang}`;
-
-	if (lang == null) {
-		lang = 'plaintext';
-	}
-
-	const ensureLoaded = (language: string) => {
-		if (language && !Prism.languages[language]) {
-			loadLanguages([language]);
-		}
-	};
-
-	if (languageMap.has(lang)) {
-		ensureLoaded(languageMap.get(lang)!);
-	} else if (lang === 'astro') {
-		ensureLoaded('typescript');
-		addAstro(Prism);
-	} else {
-		ensureLoaded('markup-templating'); // Prism expects this to exist for a number of other langs
-		ensureLoaded(lang);
-	}
-
-	if (lang && !Prism.languages[lang]) {
-		// eslint-disable-next-line no-console
-		console.warn(`Unable to load the language: ${lang}`);
-	}
-
-	const grammar = Prism.languages[lang];
-	let html = code;
-	if (grammar) {
-		html = Prism.highlight(code, grammar, lang);
-	}
-
-	return { classLanguage, html };
-}
-
 /**  */
 export default function remarkPrism() {
 	return (tree: any) =>
@@ -50,7 +8,7 @@ export default function remarkPrism() {
 			let { lang, value } = node;
 			node.type = 'html';
 
-			let { html, classLanguage } = runHighlighter(lang, value);
+			let { html, classLanguage } = runHighlighterWithAstro(lang, value);
 			let classes = [classLanguage];
 			node.value = `<pre class="${classes.join(
 				' '