feat: Svelte renderer

[mattcroat]

Here's my Svelte renderer contribution. 🙏

The only thing I need help with is solving a cryptic error when trying to run npm build about importing files that aren't JavaScript — which probably has to do with importing .svelte files, but I don't know how to pass it a plugin to compile the Svelte components with Rollup.

Everything else works! 😄

svelte-renderer.mp4

[mattcroat]

@antfu can you please have a look when you have time? 😄

[timscodebase]

I support this addition. Svelte is becoming a major player.

[antfu]

I will ship .svelte file directly to npm. Hope that would work.

[mattcroat]

@antfu The imports inside the Svelte component can't be resolved after the build, and require the file extension to be included at the end:

-import { codeToKeyedTokens, createMagicMoveMachine } from '../core'
-import type { MagicMoveRenderOptions, MagicMoveDifferOptions } from '../types'
+import { codeToKeyedTokens, createMagicMoveMachine } from '../core.mjs'
+import type { MagicMoveRenderOptions, MagicMoveDifferOptions } from '../types.d.ts'

This fixes the problem but I'm not sure if that's the best solution because it only works for the build — TypeScript also complains about the ShikiMagicMove import:

<script lang="ts">
  import { ShikiMagicMove } from 'shiki-magic-move/svelte'
</script>

Module '"shiki-magic-move/svelte"' has no
exported member 'ShikiMagicMove'.ts(2305)

What do you propose?