How does one declare the type of the incoming data?

When I write this:

<script>
  import { useSWR } from "sswr"

  const { data: posts } = useSWR("https://jsonplaceholder.typicode.com/posts")
</script>

<ul>
  {#each $posts as post}
    <li>{post.title}</li>
  {/each}
</ul>

Then typescript tells me that I can't use $posts in an {#each} block, because the type of $posts is unknown.

edit

Okay I figured it out, apparently I needed to write it like so:

<script>
  import Counter from "$components/Counter.svelte"
  import { createSWR } from "sswr"

  interface Post {
    id: number
    userId: number
    title: string
    body: string
  }

  const swr = createSWR<Post[]>()

  const { data: posts } = swr.useSWR("https://jsonplaceholder.typicode.com/posts")
</script>

<ul>
  {#each $posts as post}
    <li>{post.title}</li>
  {/each}
</ul>

But is there a good reason why this has to go through createSWR? Why can't I define a type directly on the useSWR() function? Like const { data: posts } = useSWR<Post[]>("https://jsonplaceholder.typicode.com/posts") ?

ConsoleTVs / sswr

How does one declare the type of the incoming data? #5

edit