inertiax-svelte 2.1.0 → 2.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "inertiax-svelte",
-  "version": "2.1.0",
+  "version": "2.1.2",
   "license": "MIT",
   "description": "The Svelte adapter for Inertia.js",
   "contributors": [

package/src/Render.svelte

@@ -12,28 +12,28 @@
 <script>
   import store from './store'
 
-  let {component, props = {}, children = []} = $props()
+  let {component: Component, props = {}, children = []} = $props()
 
   let key = $state(new Date().getTime())
   
-  let prev = component
+  let prev = Component
 
-  function updateKey(component) {
-    if (prev !== component) {
-      prev = component
+  function updateKey(Component) {
+    if (prev !== Component) {
+      prev = Component
       key = new Date().getTime()
     }
   }
 
-  $effect(() => updateKey(component))
+  $effect(() => updateKey(Component))
 </script>
 
 {#if $store.component}
   {#key key}
-    <svelte:component this={component} {...props}>
-      {#each children as child, index (component && component.length === index ? $store.key : null)}
+    <Component {...props}>
+      {#each children as child, index (Component && Component.length === index ? $store.key : null)}
         <svelte:self {...child} />
       {/each}
-    </svelte:component>
+    </Component>
   {/key}
 {/if}

package/src/createInertiaApp.js

@@ -1,4 +1,5 @@
 import { router, setupProgress } from 'inertiax-core'
+import escape from 'html-escape'
 import { render } from 'svelte/server';
 import App from './App.svelte'
 import store from './store'
@@ -16,47 +17,46 @@ export default async function createInertiaApp({ id = 'app', resolve, setup, pro
     })
   })
 
-  if (!isServer) {
-    router.init({
-      initialPage,
-      resolveComponent,
-      swapComponent: async ({ component, page, preserveState }) => {
-        const targetFrame = page.target
-        if (targetFrame) store.update((current) => ({
-          ...current,
-          frames: { ...current.frames, [targetFrame]: {component, props: page.props} }
-        }))
-        else store.update((current) => ({
-          component,
-          page,
-          frames: current.frames,
-          key: preserveState ? current.key : Date.now(),
-        }))
-      },
-    })
-
-    if (progress) {
-      setupProgress(progress)
-    }
-
-    return setup({
-      el,
-      App,
-      props: {
-        initialPage,
-        resolveComponent,
-      },
-    })
-  }
-
   if (isServer) {
     const { html, head } = render(App)
 
     return {
-      body: html,
+      body: `<div data-server-rendered="true" data-page="${escape(JSON.stringify(initialPage))}">${html}</div>`,
       head: [
         head
       ],
     }
   }
+
+  router.init({
+    initialPage,
+    resolveComponent,
+    swapComponent: async ({ component, page, preserveState }) => {
+      const targetFrame = page.target
+      if (targetFrame) store.update((current) => ({
+        ...current,
+        frames: { ...current.frames, [targetFrame]: {component, props: page.props} }
+      }))
+      else store.update((current) => ({
+        component,
+        page,
+        frames: current.frames,
+        key: preserveState ? current.key : Date.now(),
+      }))
+    },
+  })
+
+  if (progress) {
+    setupProgress(progress)
+  }
+
+  return setup({
+    el,
+    App,
+    props: {
+      initialPage,
+      resolveComponent,
+    },
+  })
+
 }