Something went wrong. Try again.
Monorepo for Tangled tangled.org
Something went wrong. Try again.
Svelte
12345678910111213141516171819202122232425262728293031323334<script lang="ts"> // agentation ships as a react component, so we hand it a throwaway react root. // it portals its toolbar into <body>, so this host div stays empty. // everything is dynamically imported and gated on dev, so prod never sees react. import { onMount } from "svelte"; import type { Root } from "react-dom/client";
let host: HTMLDivElement;
onMount(() => { let disposed = false; let root: Root | undefined;
void (async () => { const [react, client, agentation] = await Promise.all([ import("react"), import("react-dom/client"), import("agentation") ]); if (disposed) return; root = client.createRoot(host); root.render(react.createElement(agentation.Agentation)); })();
return () => { disposed = true; // react yells if you unmount while it is still rendering, so let it finish queueMicrotask(() => root?.unmount()); }; });</script>
<div bind:this={host}></div>