feat: intergrate chii into playground

Author: trueadm

packages/repl/src/lib/Output/devtools/DevTools.svelte

@@ -0,0 +1,31 @@
+<script>
+	const { iframe } = $props();
+
+	let devtools_iframe;
+
+
+	$effect(() => {
+		if (iframe) {
+			const iframe_window = iframe.contentWindow;
+			iframe_window.addEventListener('preview_ready', () => {
+				iframe_window.ChiiDevtoolsIframe = devtools_iframe;
+				iframe_window.initialize();
+			})
+
+			window.addEventListener('message', event => {
+				if (typeof event.data === 'string') {
+					iframe_window.postMessage(event.data, event.origin);
+				}
+			});
+		}
+	})
+
+</script>
+
+<iframe title="Svelte Playground" bind:this={devtools_iframe}></iframe>
+
+<style>
+	iframe {
+		border: 0;
+	}
+</style>