Kevin Renskers
Kevin Renskers

Reputation: 5940

What is the type of a Svelte component?

When you look at this code:

<script lang="ts">
  import RedThing from "./RedThing.svelte";
  import GreenThing from "./GreenThing.svelte";

  const things: Record<string, typeof RedThing> = {
    red: RedThing,
    green: GreenThing,
  };
</script>

Then everything works and is strongly typed. But in my mind it would make more sense to replace typeof RedThing with SvelteComponent or something similar? But that causes TS errors: Type 'typeof RedThing__SvelteComponent_' is missing the following properties from type 'SvelteComponentDev': $set, $on, $destroy, $$prop_def, and 5 more.

So what is the "generic" type for a Svelte component?

Or when looking at <svelte:component this={expression}/>, what type does this accept?

Upvotes: 6

Views: 3607

Answers (1)

brunnerh
brunnerh

Reputation: 185117

In Svelte 4, the common type is ComponentType (which has optional generic parameters).

In Svelte 5 it is Component.

Upvotes: 15

Related Questions