Add editor integrations to language integrations (#3864)

2 files changed, 27 insertions, 2 deletions

diff --git a/packages/integrations/svelte/package.json b/packages/integrations/svelte/package.json
index 755fbc8d3..fe0e6976b 100644
--- a/packages/integrations/svelte/package.json
+++ b/packages/integrations/svelte/package.json
@@ -21,20 +21,22 @@
   "homepage": "https://astro.build",
   "exports": {
     ".": "./dist/index.js",
+    "./editor": "./dist/editor.cjs",
     "./*": "./*",
     "./client.js": "./client.js",
     "./server.js": "./server.js",
     "./package.json": "./package.json"
   },
   "scripts": {
-    "build": "astro-scripts build \"src/**/*.ts\" && tsc",
-    "build:ci": "astro-scripts build \"src/**/*.ts\"",
+    "build": "astro-scripts build \"src/index.ts\" && astro-scripts build \"src/editor.cts\" --force-cjs --no-clean-dist && tsc",
+    "build:ci": "astro-scripts build \"src/**/*.ts\" && astro-scripts build \"src/editor.cts\" --force-cjs --no-clean-dist",
     "dev": "astro-scripts dev \"src/**/*.ts\""
   },
   "dependencies": {
     "@sveltejs/vite-plugin-svelte": "^1.0.0-next.48",
     "postcss-load-config": "^3.1.4",
     "svelte-preprocess": "^4.10.7",
+    "svelte2tsx": "^0.5.11",
     "vite": "^2.9.10"
   },
   "devDependencies": {
diff --git a/packages/integrations/svelte/src/editor.cts b/packages/integrations/svelte/src/editor.cts
new file mode 100644
index 000000000..202609d33
--- /dev/null
+++ b/packages/integrations/svelte/src/editor.cts
@@ -0,0 +1,23 @@
+import { svelte2tsx } from 'svelte2tsx';
+
+export function toTSX(code: string, className: string): string {
+	let result = `
+		let ${className}__AstroComponent_: Error
+		export default ${className}__AstroComponent_
+	`;
+
+	try {
+		let tsx = svelte2tsx(code).code;
+		tsx = 'let Props = render().props;\n' + tsx;
+
+		// Replace Svelte's class export with a function export
+		result = tsx.replace(
+			/^export default[\S\s]*/gm,
+			`export default function ${className}__AstroComponent_(_props: typeof Props): any {}`
+		);
+	} catch (e: any) {
+		return result;
+	}
+
+	return result;
+}