@primate/svelte 0.22.0 → 0.24.0

package/lib/app.d.ts

@@ -0,0 +1,5 @@
+declare module "app:svelte" {
+  import type { RequestPublic } from "@primate/core";
+  import type { Writable } from "svelte/store";
+  export const request: Writable<RequestPublic>;
+}

package/lib/index.d.ts

@@ -0,0 +1,3 @@
+import "./app.d.ts";
+export { default } from "#default";
+export { default as client } from "#client/index";

package/lib/private/client/Data.d.ts

@@ -0,0 +1,5 @@
+import type Payload from "#client/Payload";
+import type { Data } from "@primate/core/client";
+type SvelteData = Data<Payload>;
+export type { SvelteData as default };
+//# sourceMappingURL=Data.d.ts.map

package/lib/private/client/Data.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Data.js.map

package/lib/private/client/Payload.d.ts

@@ -0,0 +1,7 @@
+import type { Dict } from "@rcompat/type";
+type Payload = {
+    views: string[];
+    props: Dict[];
+};
+export type { Payload as default };
+//# sourceMappingURL=Payload.d.ts.map

package/lib/private/client/Payload.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Payload.js.map

package/lib/private/client/app.d.ts

@@ -1,11 +1,5 @@
-import type ClientData from "@primate/core/client/Data";
-import type { Dict } from "@rcompat/type";
-type Data = ClientData<{
-    views: string[];
-    props: Dict[];
-}>;
+import type Data from "#client/Data";
 export default class SvelteApp {
-    static mount(_view: string, data: ClientData<Data>): void;
+    static mount(_view: string, data: Data): void;
 }
-export {};
 //# sourceMappingURL=app.d.ts.map

package/lib/private/client/app.js

@@ -1,27 +1,26 @@
-import spa from "@primate/core/client/spa";
-import { hydrate, mount } from "svelte";
-import root from "svelte:root";
-import * as views from "svelte:views";
-const make_props = (data) => ({
-    views: data.views.map(name => views[name]),
-    props: data.props,
-    request: {
-        ...data.request,
-        url: new URL(location.href),
-    },
-    update: () => undefined,
-});
+import root from "#client/root";
+import client from "@primate/core/client";
+import RootView from "svelte:root";
 export default class SvelteApp {
     static mount(_view, data) {
-        const _root = (data.ssr ? hydrate : mount)(root, {
-            props: {
-                p: make_props(data),
-            },
+        const interactive = !data.ssr || data.csr;
+        if (!interactive)
+            return;
+        const Root = root[data.ssr ? "ssr" : "csr"](RootView, {
+            props: { p: root.toProps(data) },
             target: document.body,
         });
-        data.spa && window.addEventListener("DOMContentLoaded", () => spa((_data, update) => {
-            _root.p = { ...make_props(_data), update };
-        }));
+        if (data.csr) {
+            const start = () => client.boot((_data, update) => {
+                Root.p = { ...root.toProps(_data), update };
+            });
+            if (document.readyState === "loading") {
+                window.addEventListener("DOMContentLoaded", start, { once: true });
+            }
+            else {
+                start();
+            }
+        }
     }
 }
 //# sourceMappingURL=app.js.map

package/lib/private/client/form.d.ts

@@ -1,9 +1,10 @@
-import { type FormInit } from "@primate/core/client";
+import type { ClientMethod, FormInit } from "@primate/core/client";
 import type { Dict } from "@rcompat/type";
-import { type Readable } from "svelte/store";
+import type { Readable } from "svelte/store";
 type SvelteFormView<Values extends Dict> = {
     id: string;
     submitting: boolean;
+    submitted: boolean;
     submit: (event?: Event) => Promise<void>;
     errors: readonly string[];
     field: <K extends keyof Values & string>(name: K) => {
@@ -16,6 +17,7 @@ type SvelteFormView<Values extends Dict> = {
 type Initial<Values extends Dict> = FormInit & {
     initial?: Values;
 };
+declare function form<Values extends Dict>(action: ClientMethod<Values>, init?: Initial<Values>): Readable<SvelteFormView<Values>>;
 declare function form<Values extends Dict>(init: Initial<Values>): Readable<SvelteFormView<Values>>;
 declare function form(init?: FormInit): Readable<SvelteFormView<Dict>>;
 export default form;

package/lib/private/client/form.js

@@ -1,14 +1,26 @@
 import client from "@primate/core/client";
 import { writable } from "svelte/store";
-function form(init) {
-    const { initial, ...form_init } = init ?? {};
-    const controller = client.createForm(form_init);
+function form(action_or_init, maybe_init) {
+    const is_action = typeof action_or_init === "function";
+    const { initial, ...form_init } = (is_action ? (maybe_init ?? {}) : (action_or_init ?? {}));
+    const action = is_action ? action_or_init : undefined;
+    const contentType = is_action
+        ? action_or_init.contentType
+        : undefined;
+    const controller = client.createForm({
+        ...form_init,
+        ...(action !== undefined && {
+            action: action,
+            contentType,
+        }),
+    });
     const values = initial ?? {};
     const make_view = (snapshot) => {
         const form_errors = snapshot.errors.form;
         return {
             id: snapshot.id,
             submitting: snapshot.submitting,
+            submitted: snapshot.submitted,
             submit: controller.submit,
             errors: form_errors,
             field(name) {
@@ -28,7 +40,7 @@ function form(init) {
         submit: controller.submit,
     });
     const { subscribe, set } = writable(initial_view);
-    controller.subscribe((snapshot) => {
+    controller.subscribe(snapshot => {
         set(make_view({
             ...snapshot,
             submit: controller.submit,

package/lib/{public/client.d.ts → private/client/index.d.ts}

@@ -49,4 +49,4 @@ declare const client: {
     };
 };
 export default client;
-//# sourceMappingURL=client.d.ts.map
+//# sourceMappingURL=index.d.ts.map

package/lib/{public/client.js → private/client/index.js}

@@ -2,4 +2,4 @@ import form from "#client/form";
 import field from "#client/field";
 const client = { form, field };
 export default client;
-//# sourceMappingURL=client.js.map
+//# sourceMappingURL=index.js.map

package/lib/private/client/root.d.ts

@@ -0,0 +1,33 @@
+import type Data from "#client/Data";
+import type { Dict } from "@rcompat/type";
+import { hydrate, mount } from "svelte";
+import type { Component } from "svelte";
+type ViewComponent = Component<any>;
+export type RootProps = {
+    views: ViewComponent[];
+    props: Dict[];
+    request: Data["request"] & {
+        url: URL;
+    };
+    update?: () => void;
+};
+declare function toProps(data: Data): {
+    views: Component<{}, {}, string>[];
+    props: Dict[];
+    request: {
+        url: URL;
+        context: Dict;
+        cookies: Dict<string>;
+        headers: Dict<string>;
+        path: Dict<string>;
+        query: Dict<string>;
+    };
+    update: () => undefined;
+};
+declare const root: {
+    toProps: typeof toProps;
+    ssr: typeof hydrate;
+    csr: typeof mount;
+};
+export default root;
+//# sourceMappingURL=root.d.ts.map

package/lib/private/client/root.js

@@ -0,0 +1,20 @@
+import { hydrate, mount } from "svelte";
+import * as views from "svelte:views";
+function toProps(data) {
+    return {
+        views: data.views.map(name => views[name]),
+        props: data.props,
+        request: {
+            ...data.request,
+            url: new URL(data.request.url),
+        },
+        update: () => undefined,
+    };
+}
+const root = {
+    toProps,
+    ssr: hydrate,
+    csr: mount,
+};
+export default root;
+//# sourceMappingURL=root.js.map

package/lib/private/create-root.js

@@ -3,13 +3,13 @@ export default (depth, i18n_active) => {
     const body = Array.from({ length: n }, (_, i) => i - 1)
         .reduceRight((child, _, i) => `
       {#if p.views[${i + 1}]}
-        <svelte:component this={p.views[${i}]} request={p.request} {...p.props[${i}]}>
+        <svelte:component this={p.views[${i}]} {...p.props[${i}]}>
           ${child}
         </svelte:component>
       {:else}
-        <svelte:component this={p.views[${i}]} request={p.request} {...p.props[${i}]}/>
+        <svelte:component this={p.views[${i}]} {...p.props[${i}]}/>
       {/if}
-    `, `<svelte:component this={p.views[${n}]} request={p.request} {...p.props[${n}]}/>`);
+    `, `<svelte:component this={p.views[${n}]} {...p.props[${n}]}/>`);
     const i18nImports = i18n_active
         ? `
       import t from "#i18n";
@@ -30,15 +30,21 @@ export default (depth, i18n_active) => {
     <script>
       import { afterUpdate, setContext } from "svelte";
       import context_name from "@primate/svelte/context-name";
+      import { request } from "@primate/svelte/app";
       ${i18nImports}
 
       export let p;
 
       setContext(context_name, p.request.context);
 
+      const { context, path, ...public_request } = p.request;
+      request.set(public_request);
+
       ${i18nInit}
 
       afterUpdate(() => {
+         const { context, path, ...public_request } = p.request;
+         request.set(public_request);
          p.update?.();
       });
     </script>

package/lib/private/default.d.ts

@@ -0,0 +1,7 @@
+declare const _default: (input?: {
+    extensions?: string[] | undefined;
+    csr?: boolean | undefined;
+    ssr?: boolean | undefined;
+} | undefined) => import("@primate/core/frontend").Module;
+export default _default;
+//# sourceMappingURL=default.d.ts.map

package/lib/private/{Default.js → default.js}

@@ -1,5 +1,6 @@
 import create_root from "#create-root";
-import Runtime from "#Runtime";
+import init from "#init";
+import frontend from "@primate/core/frontend";
 import esbuild from "esbuild";
 import { compile, compileModule } from "svelte/compiler";
 const strip = (code) => {
@@ -8,29 +9,33 @@ const strip = (code) => {
         format: "esm",
     }).code;
 };
-export default class Default extends Runtime {
-    root = {
+const options = {
+    experimental: { async: true },
+};
+export default frontend({
+    ...init,
+    root: {
         create: create_root,
-    };
-    css = {
+    },
+    css: {
         filter: /\.sveltecss$/,
-    };
-    compile = {
+    },
+    compile: {
         client: (text, file) => {
             const accessors = true;
             const { css, js } = file.path.endsWith(".js") || file.path.endsWith(".ts")
                 // runes in .svelte.[j|t]s
-                ? compileModule(strip(text), { generate: "client" })
-                : compile(text, { accessors, generate: "client" });
+                ? compileModule(strip(text), { generate: "client", ...options })
+                : compile(text, { accessors, generate: "client", ...options });
             return { css: css?.code ?? "", js: js.code };
         },
         server: (text, file) => {
             const { js } = file?.path.endsWith(".js") || file?.path.endsWith(".ts")
                 // runes in .svelte.[j|t]s
-                ? compileModule(strip(text), { generate: "server" })
-                : compile(text, { generate: "server" });
+                ? compileModule(strip(text), { generate: "server", ...options })
+                : compile(text, { generate: "server", ...options });
             return js.code;
         },
-    };
-}
-//# sourceMappingURL=Default.js.map
+    },
+});
+//# sourceMappingURL=default.js.map

package/lib/private/init.d.ts

@@ -0,0 +1,5 @@
+import type { Init } from "@primate/core/frontend";
+import type { Component } from "svelte";
+declare const module: Init<Component>;
+export default module;
+//# sourceMappingURL=init.d.ts.map

package/lib/private/init.js

@@ -0,0 +1,14 @@
+import { render } from "svelte/server";
+const module = {
+    name: "svelte",
+    extensions: [".svelte.js", ".svelte.ts", ".svelte"],
+    layouts: true,
+    client: true,
+    async render(view, props) {
+        const { body, head } = await render(view, { props: { p: { ...props } } });
+        return { body, head };
+    },
+    conditions: ["svelte"],
+};
+export default module;
+//# sourceMappingURL=init.js.map

package/lib/private/request/store.d.ts

@@ -0,0 +1,4 @@
+import type { RequestPublic } from "@primate/core";
+declare const _default: import("svelte/store").Writable<RequestPublic>;
+export default _default;
+//# sourceMappingURL=store.d.ts.map

package/lib/private/request/store.js

@@ -0,0 +1,3 @@
+import { writable } from "svelte/store";
+export default writable();
+//# sourceMappingURL=store.js.map

package/lib/private/runtime.d.ts

@@ -0,0 +1,7 @@
+declare const _default: (input?: {
+    extensions?: string[] | undefined;
+    csr?: boolean | undefined;
+    ssr?: boolean | undefined;
+} | undefined) => import("@primate/core/frontend").Module;
+export default _default;
+//# sourceMappingURL=runtime.d.ts.map

package/lib/private/runtime.js

@@ -0,0 +1,4 @@
+import init from "#init";
+import frontend from "@primate/core/frontend";
+export default frontend(init);
+//# sourceMappingURL=runtime.js.map

package/lib/public/app.d.ts

@@ -0,0 +1,2 @@
+export { default as request } from "#request/store";
+//# sourceMappingURL=app.d.ts.map

package/lib/public/app.js

@@ -0,0 +1,2 @@
+export { default as request } from "#request/store";
+//# sourceMappingURL=app.js.map

package/lib/public/browser.d.ts

@@ -1,2 +1,3 @@
 export { default } from "#client/app";
+export { default as client } from "#client/index";
 //# sourceMappingURL=browser.d.ts.map

package/lib/public/browser.js

@@ -1,2 +1,3 @@
 export { default } from "#client/app";
+export { default as client } from "#client/index";
 //# sourceMappingURL=browser.js.map

package/lib/public/default.d.ts

@@ -1,4 +1,2 @@
-import Default from "#Default";
-declare const _default: (options?: typeof Default.input) => Default;
-export default _default;
+export { default } from "#default";
 //# sourceMappingURL=default.d.ts.map

package/lib/public/default.js

@@ -1,3 +1,2 @@
-import Default from "#Default";
-export default (options) => new Default(options);
+export { default } from "#default";
 //# sourceMappingURL=default.js.map

package/lib/public/runtime.d.ts

@@ -1,4 +1,3 @@
-import Runtime from "#Runtime";
-declare const _default: (options?: typeof Runtime.input) => Runtime;
-export default _default;
+export { default as client } from "#client/index";
+export { default } from "#runtime";
 //# sourceMappingURL=runtime.d.ts.map

package/lib/public/runtime.js

@@ -1,3 +1,3 @@
-import Runtime from "#Runtime";
-export default (options) => new Runtime(options);
+export { default as client } from "#client/index";
+export { default } from "#runtime";
 //# sourceMappingURL=runtime.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primate/svelte",
-  "version": "0.22.0",
+  "version": "0.24.0",
   "description": "Svelte for Primate",
   "homepage": "https://primate.run/docs/frontend/svelte",
   "bugs": "https://github.com/primate-run/primate/issues",
@@ -16,37 +16,41 @@
     "/lib/**/*.d.ts",
     "!/**/*.spec.*"
   ],
+  "types": "lib/index.d.ts",
   "dependencies": {
-    "@rcompat/fs": "^0.25.2",
-    "esbuild": "^0.27.3",
-    "@primate/core": "^0.5.0"
+    "@rcompat/fs": "^0.33.2",
+    "esbuild": "^0.28.0",
+    "@primate/core": "^0.7.0"
   },
   "devDependencies": {
-    "@rcompat/type": "^0.9.0"
+    "@rcompat/type": "^0.17.0"
   },
   "peerDependencies": {
     "svelte": "5",
-    "primate": "^0.36.0"
+    "primate": "^0.38.0"
   },
   "imports": {
     "#*": {
-      "apekit": "./src/private/*.ts",
+      "@primate/source": "./src/private/*.ts",
       "default": "./lib/private/*.js"
     }
   },
   "exports": {
     ".": {
+      "types": "./lib/index.d.ts",
+      "@primate/runtime": "./src/public/runtime.ts",
+      "@primate/source": "./src/public/default.ts",
       "browser": "./lib/public/browser.js",
       "runtime": "./lib/public/runtime.js",
       "default": "./lib/public/default.js"
     },
     "./*": {
-      "apekit": "./src/public/*.ts",
+      "@primate/source": "./src/public/*.ts",
       "default": "./lib/public/*.js"
     }
   },
   "scripts": {
-    "build": "npm run clean && tsc",
+    "build": "npm run clean && tsc && cp src/types/app.d.ts lib && cp src/types/index.d.ts lib",
     "clean": "rm -rf ./lib",
     "lint": "eslint ."
   }

package/lib/private/Default.d.ts

@@ -1,18 +0,0 @@
-import Runtime from "#Runtime";
-import type { FileRef } from "@rcompat/fs";
-export default class Default extends Runtime {
-    root: {
-        create: (depth: number, i18n_active: boolean) => string;
-    };
-    css: {
-        filter: RegExp;
-    };
-    compile: {
-        client: (text: string, file: FileRef) => {
-            css: string;
-            js: string;
-        };
-        server: (text: string, file?: FileRef) => string;
-    };
-}
-//# sourceMappingURL=Default.d.ts.map

package/lib/private/Runtime.d.ts

@@ -1,12 +0,0 @@
-import FrontendModule from "@primate/core/frontend/Module";
-import type Render from "@primate/core/frontend/Render";
-import type { Component } from "svelte";
-export default class Runtime extends FrontendModule<Component> {
-    name: string;
-    defaultExtensions: string[];
-    layouts: boolean;
-    client: boolean;
-    render: Render<Component>;
-    conditions: string[];
-}
-//# sourceMappingURL=Runtime.d.ts.map

package/lib/private/Runtime.js

@@ -1,14 +0,0 @@
-import FrontendModule from "@primate/core/frontend/Module";
-import { render } from "svelte/server";
-export default class Runtime extends FrontendModule {
-    name = "svelte";
-    defaultExtensions = [".svelte.js", ".svelte.ts", ".svelte"];
-    layouts = true;
-    client = true;
-    render = (view, props) => {
-        const { head, html } = render(view, { props: { p: { ...props } } });
-        return { body: html, head };
-    };
-    conditions = ["svelte"];
-}
-//# sourceMappingURL=Runtime.js.map