feat: add <Prism/> to @astrojs/prism/components

packages/astro-prism/components/Prism.astro

@@ -0,0 +1,49 @@
+---
+import Prism from 'prismjs';
+import { addAstro } from '../';
+import loadLanguages from 'prismjs/components/index.js';
+
+export interface Props {
+	class?: string;
+	lang?: string;
+	code: string;
+}
+
+const { class: className, lang, code } = Astro.props as Props;
+
+let classLanguage = `language-${lang}`;
+
+const languageMap = new Map([['ts', 'typescript']]);
+
+if (lang == null) {
+	console.warn('Prism.astro: No language provided.');
+}
+
+const ensureLoaded = (lang) => {
+	if (lang && !Prism.languages[lang]) {
+		loadLanguages([lang]);
+	}
+};
+
+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]) {
+	console.warn(`Unable to load the language: ${lang}`);
+}
+
+const grammar = Prism.languages[lang];
+let html = code;
+if (grammar) {
+	html = Prism.highlight(code, grammar, lang);
+}
+---
+
+<pre class={[className, classLanguage].join(' ')}><code class={classLanguage}><Fragment set:html={html} /></code></pre>

packages/astro-prism/components/index.js

@@ -0,0 +1 @@
+export { default as Prism } from './Prism.astro';

packages/astro-prism/package.json

@@ -13,8 +13,13 @@
   "homepage": "https://astro.build",
   "main": "index.mjs",
   "scripts": {},
+  "files": [
+    "components"
+  ],
   "exports": {
-    ".": "./index.mjs"
+    ".": "./index.mjs",
+    "./components": "./components/index.js",
+    "./components/*": "./components/*"
   },
   "types": "./index.d.ts",
   "keywords": [],