Apply `@typescript-eslint/no-misused-promises` to Svelte components

Motivation

If you pass a function returning a promise to a component property not expecting a promise, eslint should error.

Description

I can configure eslint to detect this as an error:

const promiseFunc: () => Promise<void> = async () => {};

// pnpm lint will identify this as an issue as it should
const func: () => void = promiseFunc;

But if I do the same thing with a Svelte component property I can't get it to detect it.

Examples

<!-- file: Child.svelte -->
<script lang="ts">
    export let func: () => void;
    func();
</script>

<!-- file: +page.svelte -->
<script lang="ts">
    import Child from './Child.svelte';
    const promiseFunc: () => Promise<void> = async () => {};
</script>

<!-- ✗ BAD -->
<Child func={promiseFunc} />

Additional comments

I don't know if this should be considered a new rule or just apply @typescript-eslint/no-misused-promises somehow.

See here for an example of the existing eslint rule and what I'd like eslint-plugin-svelte to catch: https://github.com/benmccann/promise-linting/blob/master/src/routes/%2Bpage.svelte

I hit this issue a lot while trying to migrate a large project to Svelte 5 where I was replacing components events with component callback props and it became very hard to keep track of what should be asynchronous vs synchronous: https://github.com/immich-app/immich/pull/7187#discussion_r1504663631

sveltejs / eslint-plugin-svelte