[Bug]: type error while importing svelte 5 component due to recent change in svelte-check

[bhvngt]

Describe the bug

Due to recent change in svelte-check v4.0.3, following type error occurs while importing Svelte 5 component in svelte storybook file. This also ends up causing multiple type errors in the story args definition.

Error: Type 'Component<Props, {}, "">' is not assignable to type 'ComponentType<Component<Props, {}, "">, any>'.
  Type 'Component<Props, {}, "">' provides no match for the signature 'new (options: ComponentConstructorOptions<Component<Props, {}, "">>): { [x: string]: any; $destroy: () => void; $on: <K extends string>(type: K, callback: (e: any) => void) => () => void; $set: (props: Partial<...>) => void; }'. 

As per PR, In svelte 5, components are functions. Hence with this PR only function type is exported in runes mode.

I tried to supply svelte 5 component to Meta as Meta<ReturnType<typeof Button>>. However, it throws following error after that change.

Error: Type '{ $on?(type: string, callback: (e: any) => void): () => void; $set?(props: Partial<Props>): void; }' is not assignable to type 'ComponentType<{ $on?(type: string, callback: (e: any) => void): () => void; $set?(props: Partial<Props>): void; }, any>'.
  Type '{ $on?(type: string, callback: (e: any) => void): () => void; $set?(props: Partial<Props>): void; }' provides no match for the signature 'new (options: ComponentConstructorOptions<{ $on?(type: string, callback: (e: any) => void): () => void; $set?(props: Partial<Props>): void; }>): { ...; }'. 
  title: "Example/Button",
  component: Button as ReturnType<typeof Button>,
  tags: ["autodocs"],

Reproduction link

https://codesandbox.io/p/devbox/8p9rrz

Reproduction steps

1. Run pnpm install
2. Run pnpm check
3. Type error will be thrown
4. If svelte-check is reverted to 4.0.2, svelte-check passes with no errors.

System

  System:
    OS: Linux 6.1 Debian GNU/Linux 12 (bookworm) 12 (bookworm)
    CPU: (2) x64 AMD EPYC
    Shell: Unknown
  Binaries:
    Node: 20.9.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn <----- active
    npm: 9.8.1 - /usr/local/bin/npm
    pnpm: 8.10.2 - /usr/local/share/npm-global/bin/pnpm
  npmPackages:
    @storybook/addon-essentials: ^8.3.5 => 8.3.5 
    @storybook/addon-interactions: ^8.3.5 => 8.3.5 
    @storybook/addon-links: ^8.3.5 => 8.3.5 
    @storybook/addon-svelte-csf: ^4.1.7 => 4.1.7 
    @storybook/blocks: ^8.3.5 => 8.3.5 
    @storybook/svelte: ^8.3.5 => 8.3.5 
    @storybook/sveltekit: ^8.3.5 => 8.3.5 
    @storybook/test: ^8.3.5 => 8.3.5 
    storybook: ^8.3.5 => 8.3.5 

Additional context

No response

[ThorFjelldalen]

Also getting this

[doolijb]

Getting this as well.

[KieranP]

Am experiencing this as well. My 40+ storybook files are failing type checking, though they continue to display fine in the UI.

[bhvngt]

I have a following workaround that seemed to be working fine with my story.ts files when run against the latest svelte-check release.

I have created a separate storybook.d.ts type declaration file where I am overriding the type inference for Meta

import type { Component, SvelteComponent } from "svelte";
import type { Args, ComponentAnnotations } from "storybook/internal/types";

declare module "@storybook/svelte" {

  export type Meta<CmpOrArgs = Args> = CmpOrArgs extends SvelteComponent<infer Props>
                                       ? ComponentAnnotations<SvelteRenderer<CmpOrArgs>, Props>
                                       : CmpOrArgs extends Component<infer Props>
                                         ? ComponentAnnotations<SvelteRenderer, Props>
                                         : ComponentAnnotations<SvelteRenderer, CmpOrArgs>

}