Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat!: add Svelte 5 runes compiler support #347

Merged
merged 9 commits into from
May 1, 2024
Merged

feat!: add Svelte 5 runes compiler support #347

Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
649118c
feat: add Svelte 5 runes compiler
userquin Feb 6, 2024
7b91149
chore: include svelte extension for new compiler
userquin Feb 6, 2024
5752370
chore: include script for runes
userquin Feb 6, 2024
c6a0a36
chore: simpley runes code
userquin Feb 6, 2024
93b3096
chore: minify runes code
userquin Feb 6, 2024
b7641b9
chore: remove svelte-runes compiler (will be auto)
userquin Feb 6, 2024
9d6d706
perf: memoize svelte runes
userquin Feb 6, 2024
b2f095c
perf: use null check
userquin Feb 6, 2024
3fc1d3d
perf: include runes optimization
userquin Feb 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 21 additions & 5 deletions src/core/compilers/svelte.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,28 @@
import type { Compiler } from './types'

export const SvelteCompiler = ((svg: string) => {
let svelteRunes: boolean | null

export const SvelteCompiler = (async (svg: string) => {
if (svelteRunes == null) {
try {
// @ts-expect-error we don't have svelte as dependency
const { VERSION } = await import('svelte/compiler')
svelteRunes = Number(VERSION.split('.')[0]) >= 5
}
catch {
svelteRunes = false
}
}
const openTagEnd = svg.indexOf('>', svg.indexOf('<svg '))
const closeTagStart = svg.lastIndexOf('</svg')
const openTag = `${svg.slice(0, openTagEnd)} {...$$props}>`
const content = `{@html \`${escapeSvelte(svg.slice(openTagEnd + 1, closeTagStart))}\`}`
const closeTag = svg.slice(closeTagStart)
return `${openTag}${content}${closeTag}`
let sfc = `${svg.slice(0, openTagEnd)} {...${svelteRunes ? 'p' : '$$props'}}>`
if (svelteRunes)
sfc += svg.slice(openTagEnd + 1, closeTagStart)
else
sfc += `{@html \`${escapeSvelte(svg.slice(openTagEnd + 1, closeTagStart))}\`}`

sfc += svg.slice(closeTagStart)
return svelteRunes ? `<script>const{...p}=$props()</script>${sfc}` : sfc
}) as Compiler

// escape curlies, backtick, \t, \r, \n to avoid breaking output of {@html `here`} in .svelte
Expand Down