Revert "Add Svelte TypeScript support (#1866)"

This reverts commit c01b56e.

.github/workflows/build.yml

@@ -8,7 +8,7 @@ jobs:
 
     strategy:
       matrix:
-        adapter: ['react', 'vue2', 'vue3', 'svelte']
+        adapter: ['react', 'vue2', 'vue3']
 
     steps:
       - name: Checkout

packages/svelte/.gitignore

@@ -1,6 +1,4 @@
 dist
-types
 node_modules
 package-lock.json
 yarn.lock
-.svelte-kit

packages/svelte/package.json

@@ -5,8 +5,7 @@
   "description": "The Svelte adapter for Inertia.js",
   "contributors": [
     "Jonathan Reinink <jonathan@reinink.ca>",
-    "Pedro Borges <oi@pedroborg.es>",
-    "Dmytro Morozov <puny.flash@gmail.com>"
+    "Pedro Borges <oi@pedroborg.es>"
   ],
   "homepage": "https://inertiajs.com/",
   "repository": {
@@ -20,54 +19,17 @@
   "keywords": [
     "svelte"
   ],
-  "scripts": {
-    "build": "svelte-kit sync && svelte-package && publint",
-    "prepublishOnly": "npm run build",
-    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
-    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
+  "exports": {
+    ".": "./src/index.js",
+    "./server": "./src/server.js"
   },
-  "files": [
-    "dist",
-    "!dist/**/*.test.*",
-    "!dist/**/*.spec.*"
-  ],
+  "main": "src/index.js",
   "peerDependencies": {
     "svelte": "^3.20.0 || ^4.0.0"
   },
-  "devDependencies": {
-    "@sveltejs/adapter-auto": "^3.2.0",
-    "@sveltejs/kit": "^2.5.5",
-    "@sveltejs/package": "^2.3.0",
-    "@sveltejs/vite-plugin-svelte": "^3.0.2",
-    "publint": "^0.2.7",
-    "svelte": "^4.2.12",
-    "svelte-check": "^3.6.8",
-    "tslib": "^2.6.2",
-    "typescript": "^5.4.3",
-    "vite": "^5.2.7"
-  },
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "svelte": "./dist/index.js"
-    },
-    "./server": {
-      "types": "./dist/server.d.ts",
-      "svelte": "./dist/server.js"
-    }
-  },
-  "import": "./dist/index.js",
-  "types": "./dist/index.d.ts",
-  "type": "module",
-  "typesVersions": {
-    ">4.0": {
-      ".": [
-        "./dist/index.d.ts"
-      ]
-    }
-  },
   "dependencies": {
-    "@inertiajs/core": "^1.1.0",
-    "lodash": "^4.5.0"
+    "@inertiajs/core": "1.1.0",
+    "lodash.clonedeep": "^4.5.0",
+    "lodash.isequal": "^4.5.0"
   }
 }

packages/svelte/src/lib/components/App.svelte → packages/svelte/src/App.svelte

@@ -1,18 +1,16 @@
-<script lang="ts">
+<script>
   import Render, { h } from './Render.svelte'
-  import store from '../store'
+  import store from './store'
 
-  $$props
-
-  $: child = $store.component && h($store.component.default, $store.page?.props)
+  $: child = $store.component && h($store.component.default, $store.page.props)
   $: layout = $store.component && $store.component.layout
   $: components = layout
     ? Array.isArray(layout)
       ? layout
           .concat(child)
           .reverse()
-          .reduce((child, layout) => h(layout, $store.page?.props, [child]))
-      : h(layout, $store.page?.props, [child])
+          .reduce((child, layout) => h(layout, $store.page.props, [child]))
+      : h(layout, $store.page.props, [child])
     : child
 </script>
 

packages/svelte/src/lib/components/Link.svelte → packages/svelte/src/Link.svelte

@@ -1,19 +1,18 @@
-<script lang="ts">
-  import type { Method, PreserveStateOption, RequestPayload } from '@inertiajs/core'
+<script>
   import { beforeUpdate } from 'svelte'
-  import { inertia } from '../index'
+  import { default as inertia } from './link'
 
-  export let href: string
-  export let as: keyof HTMLElementTagNameMap = 'a'
-  export let data: RequestPayload = {}
-  export let method: Method = 'get'
-  export let replace: boolean = false
-  export let preserveScroll: PreserveStateOption = false
-  export let preserveState: PreserveStateOption | null = null
-  export let only: string[] = []
-  export let except: string[] = []
-  export let headers: Record<string, string> = {}
-  export let queryStringArrayFormat: 'brackets' | 'indices' = 'brackets'
+  export let href
+  export let as = 'a'
+  export let data = {}
+  export let method = 'get'
+  export let replace = false
+  export let preserveScroll = false
+  export let preserveState = null
+  export let only = []
+  export let except = []
+  export let headers = {}
+  export let queryStringArrayFormat = 'brackets'
 
   beforeUpdate(() => {
     if (as === 'a' && method.toLowerCase() !== 'get') {

packages/svelte/src/Render.svelte

@@ -0,0 +1,36 @@
+<script context="module">
+  export const h = (component, props, children) => {
+    return {
+      component,
+      ...(props ? { props } : {}),
+      ...(children ? { children } : {}),
+    }
+  }
+</script>
+
+<script>
+  import store from './store'
+
+  export let component
+  export let props = {}
+  export let children = []
+
+  let prevComponent
+  let key
+  $: {
+    if (prevComponent !== component) {
+      key = Date.now()
+      prevComponent = component
+    }
+  }
+</script>
+
+{#if $store.component}
+  {#key key}
+    <svelte:component this={component} {...props}>
+      {#each children as child, index (component && component.length === index ? $store.key : null)}
+        <svelte:self {...child} />
+      {/each}
+    </svelte:component>
+  {/key}
+{/if}

packages/svelte/src/lib/components/SSR.svelte → packages/svelte/src/SSR.svelte

@@ -1,9 +1,6 @@
-<script lang="ts">
-  import type { Page } from '@inertiajs/core'
+<script>
   import App from './App.svelte'
-
-  export let id: string
-  export let initialPage: Page
+  export let id, initialPage
 </script>
 
 <div data-server-rendered="true" {id} data-page={JSON.stringify(initialPage)}>

packages/svelte/src/createInertiaApp.js

@@ -0,0 +1,54 @@
+import { router, setupProgress } from '@inertiajs/core'
+import App from './App.svelte'
+import SSR from './SSR.svelte'
+import store from './store'
+
+export default async function createInertiaApp({ id = 'app', resolve, setup, progress = {}, page }) {
+  const isServer = typeof window === 'undefined'
+  const el = isServer ? null : document.getElementById(id)
+  const initialPage = page || JSON.parse(el.dataset.page)
+  const resolveComponent = (name) => Promise.resolve(resolve(name))
+
+  await resolveComponent(initialPage.component).then((initialComponent) => {
+    store.set({
+      component: initialComponent,
+      page: initialPage,
+    })
+  })
+
+  if (!isServer) {
+    router.init({
+      initialPage,
+      resolveComponent,
+      swapComponent: async ({ component, page, preserveState }) => {
+        store.update((current) => ({
+          component,
+          page,
+          key: preserveState ? current.key : Date.now(),
+        }))
+      },
+    })
+
+    if (progress) {
+      setupProgress(progress)
+    }
+
+    return setup({
+      el,
+      App,
+      props: {
+        initialPage,
+        resolveComponent,
+      },
+    })
+  }
+
+  if (isServer) {
+    const { html, head } = SSR.render({ id, initialPage })
+
+    return {
+      body: html,
+      head: [head],
+    }
+  }
+}

packages/svelte/src/lib/index.ts → packages/svelte/src/index.js

@@ -1,5 +1,5 @@
 export { router } from '@inertiajs/core'
-export { default as Link } from './components/Link.svelte'
+export { default as Link } from './Link.svelte'
 export { default as createInertiaApp } from './createInertiaApp'
 export { default as inertia } from './link'
 export { default as page } from './page'