Add support for dynamic components

[bfanger]

The following snippet doesn't work:

<script lang="ts">
import  ComponentX from "react-libx"
import  ComponentY from "react-liby"

export let condition: boolean;

$: Component = condition ? ComponentX : ComponentY;
</script>

<react:Component />

[mermail]

This would also make dynamic imports simpler, as far as I can tell. i.e.

<script lang="ts">
  import { onMount } from "svelte";

  let Comp;
  onMount(async () => {
    Comp = (await import('some-component')).default;
  });
</script>

<react:Comp />

[bfanger]

@mermail As workaround you could use React's lazy utility:

<script lang="ts">
  import { browser } from "$app/environment";
  import { lazy } from "react";

  const Comp = lazy(() => import("some-component"));
</script>

{#if browser}
  <react:Comp />
{/if}

Needs the browser check because lazy doesn't work with React's renderToString (Used in SSR)

[mermail]

Cheers, thanks @bfanger