Svelte 4 support

[Gautier Ben Aïm]

Describe the bug

types/svelte.d.ts uses deprecated types. I don't know if this library intends to keep supporting Svelte 3, but the type declaration should now be written like this:

declare module '~icons/*' {
  import { SvelteComponent } from 'svelte'
  import type { SVGAttributes } from 'svelte/elements'
  export default class extends SvelteComponent<SVGAttributes<EventTarget>> {}
}

Here is how it currently looks

• svelte/internal is not exposed anymore
• SvelteComponentTyped is deprecated
• svelte does not exist

I can open a merge request with these changes if breaking changes are accepted

Reproduction

/

System Info

/

Used Package Manager

npm

Validations

• Follow our Code of Conduct
• Read the Contributing Guide.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
• The provided reproduction is a minimal reproducible of the bug.

[Gautier Ben Aïm]

Slight update to the type declaration:

declare module '~icons/*' {
  import { SvelteComponent } from 'svelte'
  import type { SvelteHTMLElements } from 'svelte/elements'
  export default class extends SvelteComponent<SvelteHTMLElements['svg']> {}
}

Ping @benmccann, sorry to disturb you but I saw you contributed to this repo, you might have some tips to do this the right way

[Joaquín Sánchez]

@GauBen I've sent this to help in Svelte Discord Server: https://discord.com/channels/457912077277855764/1131342890526851072/1131342890526851072

[Joaquín Sánchez]

We're trying to add Svelte 4 support in unplugin-icons, how can we replace the SvelteComponentDev type?

Svelte 3:

// svelte.d.ts => svelte3.d.ts
declare module 'virtual:icons/*' {
  export { SvelteComponentDev as default } from 'svelte/internal'
}

declare module '~icons/*' {
  import { SvelteComponentTyped } from 'svelte'
  export default class extends SvelteComponentTyped<svelte.JSX.IntrinsicElements['svg']> {}
}

I'm using this one for Svelte 4:

// new svelte.d.ts
declare module 'virtual:icons/*' {
  import { SvelteComponent } from 'svelte'
  import type { SvelteHTMLElements } from 'svelte/elements'
  export default class extends SvelteComponent<SvelteHTMLElements['svg']> {}
}

declare module '~icons/*' {
  import { SvelteComponent } from 'svelte'
  import type { SvelteHTMLElements } from 'svelte/elements'
  export default class extends SvelteComponent<SvelteHTMLElements['svg']> {}
}

[leerobert]

Lot of //@ts-ignore waiting for svelte4 support for unplugin-icons in the codebase rn :D

[Gautier Ben Aïm]

@leerobert You may use yarn patch or pnpm patch to update the type definitions until the new ones are merged