Unable to use the signOut method (SvelteKit)

[tildezero]

Hello!

I am currently following the AuthJS sveltekit tutorial, but when I do <button on:click={signOut}>Button</button>, I am getting an error with the following text:

Type '(options?: SignOutParams<true> | undefined) => Promise<void>' is not assignable to type 'MouseEventHandler<HTMLButtonElement>'.
  Types of parameters 'options' and 'event' are incompatible.
    Type 'MouseEvent & { currentTarget: EventTarget & HTMLButtonElement; }' is not assignable to type 'SignOutParams<true> | undefined'

Is there a way to fix this?

Full code:

<script>
  import { page } from "$app/stores";
  import { signIn, signOut } from '@auth/sveltekit/client'

</script>
<svelte:head>
	<title>GPTutor</title>
	<meta name="description" content="App that tutors people using GPT4" />
</svelte:head>

<section class="h-screen items-center flex flex-col">
	<h2 class="h2 mt-14 font-bold text-center">Myheading</h2>
	<p class="p mt-5 text-center max-w-prose">Prose goes here.</p>
	<button class="btn variant-filled-primary w-auto mt-3 rounded-lg">Get Started →</button>
	{#if $page.data.session?.user}
		<p>Signed in as {$page.data.session.user.email}</p>
		<button on:click={signOut} class="btn variant-filled-warning">Sign out</button>
		<img alt="the user's PFP" src="https://cdn.pixabay.com/photo/2017/08/11/19/36/vw-2632486_1280.png" />
	{:else}
		<p>Not signed in.</p>
		<button on:click={() => signIn('github')}>Sign In</button>
	{/if}
</section>

[Wundero]

You probably need to wrap signOut in an arrow function to get it to work.
Try this:

<button on:click={() => signOut()} class="btn variant-filled-warning">Sign out</button>

[demhadais]

This should be marked as the answer! Super helpful. This should def be fixed in the documentation as well