@void/svelte 1.2.1 → 1.4.0

package/dist/plugin.mjs

@@ -1,5 +1,5 @@
 import { svelte } from "@sveltejs/vite-plugin-svelte";
-import { generateComponentManifest, resolveEffectiveLayoutChain, resolvePagesDir, resolveStaticPageDataBuildOptions, scanPages } from "void/pages";
+import { createPagesPlugin, generateComponentManifest, resolveEffectiveLayoutChain, resolvePagesDir, scanPages } from "void/pages";
 import { existsSync, readFileSync, readdirSync } from "node:fs";
 import nodePath from "node:path";
 import { preprocess } from "svelte/compiler";
@@ -95,7 +95,10 @@ function islandsPlugin(pagesDir, options) {
 			},
 			async buildStart() {
 				if (existsSync(pagesDir)) {
-					pageScan = await scanPages(root, { pagesDir });
+					pageScan = await scanPages(root, {
+						pagesDir,
+						environment: isDev ? "dev" : "prod"
+					});
 					const filesToScan = [
 						...pageScan.pages.map((page) => ({
 							filePath: page.componentPath,
@@ -326,7 +329,6 @@ initIslands(islands, hydrateIsland);
 }
 //#endregion
 //#region src/plugin-pages.ts
-const RENDERER_ID = "virtual:void-pages-renderer";
 const CLIENT_ENTRY_ID = "virtual:void-pages-client";
 const SVELTE_OPTIMIZE_DEPS = {
 	exclude: ["@void/svelte"],
@@ -353,92 +355,27 @@ function hasNonIslandPages(dir) {
 	return false;
 }
 function pagesPlugin(pagesDir, options) {
-	let pageScan = null;
-	let isDev = false;
-	let viteConfig;
-	const root = options?.root ?? dirname(pagesDir);
-	const normalizedPagesDir = normalizePath(pagesDir);
-	let pendingRescan = null;
-	const rescanPages = async () => {
-		pageScan = existsSync(pagesDir) ? await scanPages(root, { pagesDir }) : null;
-	};
-	const runRescan = () => {
-		pendingRescan ??= rescanPages().finally(() => {
-			pendingRescan = null;
-		});
-		return pendingRescan;
-	};
-	const invalidatePageModules = (server) => {
-		for (const env of Object.values(server.environments)) for (const id of ["\0" + RENDERER_ID, "\0" + CLIENT_ENTRY_ID]) {
-			const mod = env.moduleGraph.getModuleById(id);
-			if (mod) env.moduleGraph.invalidateModule(mod);
-		}
-	};
-	return {
+	return createPagesPlugin(pagesDir, {
 		name: "void-svelte:pages",
-		async buildStart() {
-			await runRescan();
-		},
-		resolveId: {
-			filter: { id: /^virtual:void-pages-(renderer|client)$/ },
-			handler(id) {
-				return "\0" + id;
-			}
+		root: options?.root,
+		generateRenderer(scan) {
+			return generateRendererModule(scan, pagesDir);
 		},
-		load: {
-			filter: { id: /^\0virtual:void-pages-(renderer|client)$/ },
-			async handler(id) {
-				if (isDev && pendingRescan) await pendingRescan;
-				if (!pageScan && existsSync(pagesDir)) await runRescan();
-				if (id === "\0" + RENDERER_ID) {
-					if (!pageScan) return "export function renderPage() { throw new Error('No pages found'); }";
-					return generateRendererModule(pageScan, pagesDir);
-				}
-				if (id === "\0" + CLIENT_ENTRY_ID) {
-					if (!pageScan) return "";
-					return generateClientEntry(pageScan, pagesDir, options?.viewTransitions, options?.prefetch, resolveStaticPageDataBuildOptions(root, { publicDir: viteConfig?.publicDir }));
-				}
-			}
+		generateClient(scan, staticPageData) {
+			return generateClientEntry(scan, pagesDir, options?.viewTransitions, options?.prefetch, staticPageData);
 		},
-		configureServer(server) {
-			const handlePagesChange = async (path, event) => {
-				const normalizedPath = normalizePath(path);
-				if (normalizedPath !== normalizedPagesDir && !normalizedPath.startsWith(normalizedPagesDir + "/")) return;
-				if (event === "change" && !normalizedPath.endsWith(".md")) return;
-				try {
-					await runRescan();
-				} catch (error) {
-					server.config.logger.error(error instanceof Error ? error.message : String(error), {
-						error: error instanceof Error ? error : void 0,
-						timestamp: true
-					});
-					return;
-				}
-				invalidatePageModules(server);
+		config({ isDev }) {
+			if (isDev) return {
+				optimizeDeps: SVELTE_OPTIMIZE_DEPS,
+				environments: { void_worker: { optimizeDeps: { exclude: ["@void/svelte"] } } }
 			};
-			server.watcher.on("add", (path) => handlePagesChange(path, "add"));
-			server.watcher.on("change", (path) => handlePagesChange(path, "change"));
-			server.watcher.on("unlink", (path) => handlePagesChange(path, "unlink"));
-		},
-		configResolved(config) {
-			viteConfig = config;
-		},
-		config(_, env) {
-			if (!existsSync(pagesDir)) return;
-			if (env.command === "serve") {
-				isDev = true;
-				return {
-					optimizeDeps: SVELTE_OPTIMIZE_DEPS,
-					environments: { void_worker: { optimizeDeps: { exclude: ["@void/svelte"] } } }
-				};
-			}
 			if (!hasNonIslandPages(pagesDir)) return;
 			return { build: {
 				manifest: true,
 				rollupOptions: { input: { "pages-client": CLIENT_ENTRY_ID } }
 			} };
 		}
-	};
+	});
 }
 function generateRendererModule(scan, pagesDir) {
 	return `

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@void/svelte",
-  "version": "1.2.1",
+  "version": "1.4.0",
   "description": "Svelte pages, server rendering, forms, and navigation for Void.",
   "homepage": "https://void.cloud",
   "bugs": {
@@ -43,12 +43,12 @@
     "svelte": "^5.57.2",
     "vite": "npm:@voidzero-dev/vite-plus-core@1.3.0",
     "vite-plus": "1.3.0",
-    "void": "1.2.1"
+    "void": "1.4.0"
   },
   "peerDependencies": {
     "svelte": "^5.0.0",
     "vite": "^8.0.0",
-    "void": "1.2.1"
+    "void": "1.4.0"
   },
   "scripts": {
     "build": "vp pack",

package/src/runtime/App.svelte

@@ -30,12 +30,13 @@
   let navigation = $state(init.navigation || idleNavigationState());
   const router = createRouterFacade(init.router, () => routeUrl, () => params);
 
-  // Layouts can keep the object returned by useShared() across navigations.
-  function replaceShared(next) {
-    for (const key of Object.keys(shared)) {
-      delete shared[key];
+  // Pages and layouts keep the objects returned by useShared() and useParams()
+  // across navigations, so update them in place.
+  function replaceInPlace(target, next) {
+    for (const key of Object.keys(target)) {
+      delete target[key];
     }
-    Object.assign(shared, next || {});
+    Object.assign(target, next || {});
   }
 
   // Capitalized alias for dynamic component rendering
@@ -65,8 +66,8 @@
       init.stores.page.subscribe((v) => { currentPage = v; }),
       init.stores.props.subscribe((v) => { currentPageProps = v; }),
       init.stores.layouts.subscribe((v) => { currentLayouts = v; }),
-      init.stores.shared.subscribe(replaceShared),
-      init.stores.params.subscribe((v) => { params = v; }),
+      init.stores.shared.subscribe((v) => replaceInPlace(shared, v)),
+      init.stores.params.subscribe((v) => replaceInPlace(params, v)),
       init.stores.route.subscribe((v) => { routeUrl = v; }),
       init.stores.navigation.subscribe((v) => { navigation = v; }),
     ];

package/src/runtime/use-form.svelte.ts

@@ -1,11 +1,14 @@
-import { getContext } from 'svelte';
+import { getContext, untrack } from 'svelte';
 import {
   VoidActionError,
+  cloneFormValue,
   getValidationErrors,
   interpolateRouteParams,
   isAbortError,
   isEqualFormValue,
+  parseFormResetArgs,
   submitAction,
+  type FormResetOptions,
   type VisitOptions,
   type VoidRouter,
 } from 'void/pages-client';
@@ -26,7 +29,9 @@ type UntypedForm = {
   put(opts?: FormSubmitOptions): Promise<void>;
   patch(opts?: FormSubmitOptions): Promise<void>;
   delete(opts?: FormSubmitOptions): Promise<void>;
+  reset(options: FormResetOptions, ...fields: ReadonlyArray<string>): void;
   reset(...fields: ReadonlyArray<string>): void;
+  setError(field: string, message: string): void;
   clearErrors(...fields: ReadonlyArray<string>): void;
   clearError(): void;
 };
@@ -48,7 +53,12 @@ export function useForm<U extends ActionUrl & string>(
   put(opts?: FormSubmitOptions): Promise<void>;
   patch(opts?: FormSubmitOptions): Promise<void>;
   delete(opts?: FormSubmitOptions): Promise<void>;
+  reset(
+    options: FormResetOptions,
+    ...fields: ReadonlyArray<keyof ResolveActionBody<U> & string>
+  ): void;
   reset(...fields: ReadonlyArray<keyof ResolveActionBody<U> & string>): void;
+  setError(field: keyof ResolveActionBody<U> & string, message: string): void;
   clearErrors(...fields: ReadonlyArray<keyof ResolveActionBody<U> & string>): void;
   clearError(): void;
 };
@@ -56,32 +66,50 @@ export function useForm<U extends ActionUrl & string>(
 export function useForm(
   url: string,
   defaults: Record<string, unknown>,
-  options?: { params?: Record<string, string> },
+  options?: { params?: Record<string, string>; resetOnSuccess?: boolean },
 ): UntypedForm {
   const router = getContext<VoidRouter>('__void_router');
 
-  let data = $state({ ...defaults });
+  const initialDefaults = cloneFormValue(defaults);
+  let data = $state(cloneFormValue(initialDefaults));
   let errors: Record<string, string> = $state({});
   let error: VoidActionError | null = $state(null);
   let pending = $state(false);
   let wasSuccessful = $state(false);
   let recentlySuccessful = $state(false);
 
-  let defaults_ = { ...defaults };
+  let defaults_ = $state.raw(initialDefaults);
   let successTimeout: ReturnType<typeof setTimeout> | null = null;
+  let dataSnapshot = cloneFormValue(initialDefaults);
+
+  $effect(() => {
+    // Read nested values even after an earlier edit, without subscribing to errors.
+    const current = cloneFormValue(data);
+    untrack(() => {
+      for (const key of new Set([...Object.keys(dataSnapshot), ...Object.keys(current)])) {
+        if (!isEqualFormValue(current[key], dataSnapshot[key])) {
+          delete errors[key];
+        }
+      }
+      dataSnapshot = current;
+    });
+  });
 
   const hasChanges = $derived(
     Object.keys(defaults_).some((key) => !isEqualFormValue(data[key], defaults_[key])),
   );
 
-  function reset(...fields: ReadonlyArray<string>) {
+  function reset(...args: ReadonlyArray<string | FormResetOptions>) {
+    const { initial, fields } = parseFormResetArgs(args);
+    const source = initial ? initialDefaults : defaults_;
     if (fields.length === 0) {
-      data = { ...defaults_ };
+      data = cloneFormValue(source);
     } else {
       for (const field of fields) {
-        data[field] = defaults_[field];
+        data[field] = cloneFormValue(source[field]);
       }
     }
+    dataSnapshot = cloneFormValue(data);
   }
 
   function clearErrors(...fields: ReadonlyArray<string>) {
@@ -94,6 +122,12 @@ export function useForm(
     }
   }
 
+  function setError(field: string, message: string) {
+    // An input handler may validate its new value before the change effect runs.
+    dataSnapshot = { ...dataSnapshot, [field]: cloneFormValue(data[field]) };
+    errors = { ...errors, [field]: message };
+  }
+
   function clearError() {
     error = null;
   }
@@ -120,7 +154,9 @@ export function useForm(
       if (!result.ok) {
         const validationErrors = getValidationErrors(result.error.body);
         if (validationErrors) {
-          Object.assign(errors, validationErrors);
+          for (const [field, message] of Object.entries(validationErrors)) {
+            setError(field, message);
+          }
         } else {
           error = result.error;
         }
@@ -129,7 +165,12 @@ export function useForm(
 
       wasSuccessful = true;
       recentlySuccessful = true;
-      defaults_ = { ...data };
+      if (options?.resetOnSuccess) {
+        data = cloneFormValue(initialDefaults);
+        defaults_ = cloneFormValue(initialDefaults);
+      } else {
+        defaults_ = cloneFormValue(data);
+      }
       successTimeout = setTimeout(() => {
         recentlySuccessful = false;
       }, 2000);
@@ -166,6 +207,7 @@ export function useForm(
       return recentlySuccessful;
     },
     reset,
+    setError,
     clearErrors,
     clearError,
     post: (opts?: FormSubmitOptions) => submit('POST', opts),

package/src/runtime/use-island-form.svelte.ts

@@ -1,9 +1,4 @@
-import {
-  VoidActionError,
-  categorizeActionError,
-  getValidationErrors,
-  isEqualFormValue,
-} from 'void/pages-client';
+import { isEqualFormValue, submitIslandAction, type VoidActionError } from 'void/pages-client';
 
 type UntypedIslandForm = {
   readonly data: Record<string, unknown>;
@@ -23,19 +18,6 @@ type UntypedIslandForm = {
   clearError(): void;
 };
 
-async function readActionErrorBody(response: Response): Promise<unknown> {
-  const contentType = response.headers.get('content-type') || '';
-  try {
-    if (contentType.includes('application/json')) {
-      return await response.json();
-    }
-    const text = await response.text();
-    return text || null;
-  } catch {
-    return null;
-  }
-}
-
 /**
  * Form composable for island pages. Uses fetch + page reload instead of the
  * Void Router (which is not available in island mode).
@@ -90,18 +72,14 @@ export function useIslandForm(defaults: Record<string, unknown>): UntypedIslandF
     clearError();
 
     try {
-      const response = await fetch(url, {
-        method,
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(data),
-      });
+      const result = await submitIslandAction(url, method, data);
 
-      if (response.redirected) {
-        window.location.href = response.url;
+      if (result.kind === 'redirect') {
+        window.location.href = result.url;
         return;
       }
 
-      if (response.ok) {
+      if (result.kind === 'success') {
         wasSuccessful = true;
         recentlySuccessful = true;
         defaults_ = { ...data };
@@ -109,23 +87,10 @@ export function useIslandForm(defaults: Record<string, unknown>): UntypedIslandF
           recentlySuccessful = false;
         }, 2000);
         window.location.reload();
+      } else if (result.kind === 'validation') {
+        Object.assign(errors, result.errors);
       } else {
-        const body = await readActionErrorBody(response);
-        const actionError = new VoidActionError({
-          body,
-          status: response.status,
-          statusText: response.statusText,
-          url,
-        });
-        const validationErrors = response.status === 422 ? getValidationErrors(body) : null;
-        if (validationErrors) {
-          Object.assign(errors, validationErrors);
-          return;
-        }
-        if (categorizeActionError(response.status) === 'boundary') {
-          throw actionError;
-        }
-        error = actionError;
+        error = result.error;
       }
     } finally {
       pending = false;