svelte - Slot props and typescript, how to handle types?

Question

I'm using slot props in a project. I'm having a generic component that takes an Array as input.

MyComponent:

<script lang="ts">
    export let data: Array<any>;
</script>

<div>
    <!-- some stuff ... -->
    {#each data as item}
        <slot {item} />
    {/each}
    <!-- ... and other stuff ... -->
</div>

Caller:

<script lang="ts">
    let myData : Array<MyType> = ...
</script>

<MyComponent data={myData} let:item>
    <li>{item.myVerySpecificField}
</MyComponent>

I can't get my head around how to force the item to be typed as MyType. Any ideas?

It works as is, but I don't get any checks at compile time.

question from:https://stackoverflow.com/questions/65906478/slot-props-and-typescript-how-to-handle-types

Answer 1

Waitting for answers