felte icon indicating copy to clipboard operation
felte copied to clipboard

ValidationMessage should be a SvelteComponentTyped

Open gl-aagostino opened this issue 1 year ago • 2 comments

Describe the bug

I started receiving this error upon using ValidationMessage

Argument of type 'typeof ValidationMessage' is not assignable to parameter of type 'ConstructorOfATypedSvelteComponent'.
  Type 'typeof ValidationMessage' provides no match for the signature 'new (args: { target: any; props?: any; }): ATypedSvelteComponent'.

Possible causes:
- You use the instance type of a component where you should use the constructor type
- Type definitions are missing for this Svelte Component. If you are using Svelte 3.31+, use SvelteComponentTyped to add a definition:
  import type { SvelteComponentTyped } from "svelte";
  class ComponentName extends SvelteComponentTyped<{propertyName: string;}> {}ts(2345)

I think it can be fixed by changing this

export default class ValidationMessage extends SvelteComponent

to this

export default class ValidationMessage extends SvelteComponentTyped

Which package/s are you using?

@felte/reporter-svelte

Environment

  • OS:
  • Browser:
  • Version:

To reproduce

No response

Small reproduction example

No response

Screenshots

No response

Additional context

No response

gl-aagostino avatar Jul 12 '24 18:07 gl-aagostino

Apologies for the delay! Is this still happening to you? If I remember correctly, newer versions of Svelte use SvelteComponent instead of SvelteComponentTyped. Does it still happen with more recent versions of Svelte?

pablo-abc avatar Oct 29 '24 20:10 pablo-abc

Yes, we patched it with a custom type. But on that note, if you upgrade to svelte 5...

**
 * This was the base class for Svelte components in Svelte 4. Svelte 5+ components
 * are completely different under the hood. For typing, use `Component` instead.
 * To instantiate components, use `mount` instead`.
 * See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more info.
 */
export class SvelteComponent<
	Props extends Record<string, any> = Record<string, any>,
	Events extends Record<string, any> = any,
	Slots extends Record<string, any> = any
>

gl-aagostino avatar Oct 29 '24 20:10 gl-aagostino