Svelte 5: Minimalest upgrade

[jamesst20]

• Upgraded playground to Svelte 5
• Fixed SSR breaking changes
• packages.json: Allow Svelte 5 installation
• Improvements: Render CSS properly for Svelte 3 & 4 https://github.com/inertiajs/inertia/pull/1761
• Svelte 5 conventions used: None

Half-Breaking change

Svelte 5 changed how SSR rendering works. Under Svelte 3&4, you can call MyComponent.render. Under Svelte 5 you must import the render method from a package that doesn't exist under Svelte 3 & 4 making impossible to have compatibility for both unless we extract the component rendering outside.

I have updated the setup function to return the rendered result when in SSR mode.

// ssr.js
createServer((page) =>
  createInertiaApp({
    page,
    resolve: (name) => { ... },
    setup({ App, props }) {
      // Svelte 4: return App.render(props)
      // Svelte 5:
      return render(App, { props })
    },
  }),
)

I have added a warning when the implementation is not ok.

throw new Error(`setup(...) must return rendered result when in SSR mode.`)

I call this an half-breaking change because Svelte 4 apps will not break. I added a fallback with warning:

    if (!result && typeof (SSR as SSRComponentType).render !== 'function') {
      throw new Error(`setup(...) must return rendered result when in SSR mode.`)
    } else if (!result) {
      console.warn('Deprecated: in SSR mode setup(...) must be defined and must return rendered result in SSR mode.')
      console.warn('For Svelte 5: `return render(App, { props })` or for Svelte 4: `return App.render(props)`')
      result ||= (SSR as SSRComponentType).render!({ id, initialPage })
    }

Warning to Svelte 5 users

• You still need to use $ syntax when importing reactive state from Inertia such as $page
• Super reactive state will not work! Meaning $form.something.push({...}) will not trigger state refresh. This is likely a really huge bummer so you may consider using my fork adapter instead @jamesst20/inertia-svelte5. Hopefully Inertia maintainers change their mind about having a separate Svelte 5 adapter.
• You still need to do stuff like $form.something = $form.something to trigger state refresh on updated object without creating a full copy before updating even if you use Svelte 5