@primate/svelte 0.15.1 → 0.15.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primate/svelte",
-  "version": "0.15.1",
+  "version": "0.15.3",
   "description": "Primate Svelte module",
   "homepage": "https://primatejs.com/modules/svelte",
   "bugs": "https://github.com/primatejs/primate/issues",
@@ -16,8 +16,8 @@
     "directory": "packages/svelte"
   },
   "dependencies": {
-    "runtime-compat": "^0.24.1",
-    "svelte": "^4.1.1"
+    "runtime-compat": "^0.25.1",
+    "svelte": "^4.1.2"
   },
   "peerDependencies": {
     "primate": "0.21"

package/src/client/client.js

@@ -3,15 +3,11 @@ import liveview from "./liveview.js";
 
 export default ({names, data}, options) => `
   import * as components from "app";
-  const getComponents = names =>
-    Object.entries(components).filter(([name, component]) =>
-      names.includes(name))
-      .map(([, component]) => component);
   let root = new components.${rootname}({
     target: document.body,
     hydrate: true,
     props: {
-      components: getComponents([${names.map(name => `"${name}"`)}]),
+      components: [${names.map(name => `components.${name}`).join(", ")}],
       data: JSON.parse(${JSON.stringify(JSON.stringify(data))}),
     },
   });

package/src/client/liveview.js

@@ -8,7 +8,7 @@ window.addEventListener("DOMContentLoaded", _ => liveview((props, update) => {
     target: document.body,
     hydrate: true,
     props: {
-      components: getComponents(props.names),
+      components: props.names.map(name => components[name]),
       data: props.data,
       update,
     },

package/src/module.js

@@ -11,6 +11,7 @@ const endings = {
   js: ".svelte.js",
 };
 
+const encoder = new TextEncoder();
 const hash = async (string, algorithm = "sha-256") => {
   const base = 16;
   const target_pad_length = 2;
@@ -34,8 +35,6 @@ const load = async path =>
 const make_component = base => async (name, props) =>
   ({name, component: await load(base.join(name)), props});
 
-const encoder = new TextEncoder();
-
 const handler = (name, props = {}, {status = Status.OK, page} = {}) =>
   async (app, {layouts = [], as_layout} = {}, request) => {
     const options = {
@@ -56,7 +55,6 @@ const handler = (name, props = {}, {status = Status.OK, page} = {}) =>
     const data = components.map(component => component.props);
     const names = await Promise.all(components.map(component =>
       normalize(component.name)));
-
     if (options.liveview && headers.get(app.liveview.header) !== undefined) {
       return new Response(JSON.stringify({names, data}), {
         status,
@@ -64,9 +62,10 @@ const handler = (name, props = {}, {status = Status.OK, page} = {}) =>
           "Content-Type": MediaType.APPLICATION_JSON},
       });
     }
+
     const root = paths.server.join(filename);
     const imported = (await import(root)).default;
-    const {html} = imported.render({
+    const {html: body} = imported.render({
       components: components.map(({component}) => component),
       data,
     });
@@ -74,10 +73,10 @@ const handler = (name, props = {}, {status = Status.OK, page} = {}) =>
     const code = client({names, data}, options);
 
     await app.publish({code, type, inline: true});
-
+    // needs to be called before app.render
     const headers$ = await app.headers();
 
-    return new Response(await app.render({body: html, page}), {
+    return new Response(await app.render({body, page}), {
       status,
       headers: {...headers$, "Content-Type": MediaType.TEXT_HTML},
     });
@@ -89,7 +88,9 @@ const options = {
 };
 
 const {svelte, js} = endings;
-export default ({dynamicProps = "data"} = {}) => ({
+export default ({
+  dynamicProps = "data",
+} = {}) => ({
   name: "@primate/svelte",
   register(app, next) {
     app.register("svelte", handler);
@@ -123,13 +124,6 @@ export default ({dynamicProps = "data"} = {}) => ({
     const components = await source.collect(/^.*.svelte$/u);
     await app.import("svelte");
 
-    // liveview
-    if (app.liveview !== undefined) {
-      app.bootstrap({
-        type: "script",
-        code: "export {default as liveview} from \"@primate/liveview\";\n",
-      });
-    }
     await Promise.all(components.map(async component => {
       const name = component.path.replace(`${source}/`, "");
       const file = await component.file.read();