@kasperrt/smolter 0.4.0 → 0.4.1

package/.generated/client/deployment.ts

@@ -1,4 +1,4 @@
-import type { NavigationRouter } from "../core/index.ts";
+import type { NavigationRouter, Router } from "../core/index.ts";
 import { deploymentCheck } from "./deployment-check.ts";
 
 /** Build identity and the fresh, non-cacheable manifest URL emitted by deploymentPlugin. */
@@ -11,7 +11,7 @@ export interface DeploymentOptions {
   reload?: (destination: URL) => void;
 }
 
-/** Check for deployment changes before navigation. Returns a cleanup function. */
+/** Check for deployment changes before navigation. Install before creating fetchers. Returns a cleanup function. */
 export function watchDeployment(
   router: NavigationRouter,
   options: DeploymentOptions | null,
@@ -26,7 +26,31 @@ export function watchDeployment(
   let sequence = 0;
   let stopped = false;
   let replay = false;
+  let mutations = 0;
+  const dataRouter = router as NavigationRouter &
+    Partial<Pick<Router, "createFetcher">>;
+  const createFetcher = dataRouter.createFetcher;
+  const guardedFetcher =
+    createFetcher &&
+    (() => {
+      const fetcher = createFetcher();
+      const submit = fetcher.submit;
+
+      fetcher.submit = (...args) => {
+        sequence++;
+        mutations++;
+
+        return submit(...args).finally(() => {
+          mutations--;
+        });
+      };
+
+      return fetcher;
+    });
+
+  if (guardedFetcher) dataRouter.createFetcher = guardedFetcher;
   const valid = (current: number) => current === sequence && !stopped;
+  const canReload = (current: number) => valid(current) && mutations === 0;
   const unsubscribe = router.subscribe(() => {
     if (read().state === "submitting") sequence++;
   });
@@ -42,7 +66,7 @@ export function watchDeployment(
         target.search !== currentURL.search) &&
       (await changed())
     ) {
-      if (!valid(current) || (await reload(target, () => valid(current))))
+      if (!valid(current) || (await reload(target, () => canReload(current))))
         return;
     }
 
@@ -65,7 +89,7 @@ export function watchDeployment(
     event.stopImmediatePropagation();
     void changed().then(async (updated) => {
       if (!valid(current)) return;
-      if (updated && (await reload(target, () => valid(current)))) return;
+      if (updated && (await reload(target, () => canReload(current)))) return;
       if (!valid(current)) return;
 
       replay = true;
@@ -88,7 +112,7 @@ export function watchDeployment(
         return reload(
           target,
           () =>
-            valid(current) &&
+            canReload(current) &&
             read().state !== "submitting" &&
             read().url === target.href,
         );
@@ -103,6 +127,8 @@ export function watchDeployment(
     window.removeEventListener("popstate", pop, true);
     window.removeEventListener("vite:preloadError", preloadError);
 
+    if (dataRouter.createFetcher === guardedFetcher)
+      dataRouter.createFetcher = createFetcher;
     if (router.navigate === guarded) router.navigate = navigate;
     if (router.dispose === guardedDispose) router.dispose = dispose;
   }

package/.generated/preact/deferred-hydration.ts

@@ -6,16 +6,14 @@ interface PendingValue {
   reject: (reason: Error) => void;
 }
 
-declare global {
-  interface Window {
-    __smolterDeferred?: Settlement[];
-  }
+export interface DeferredWindow extends Window {
+  __smolterDeferred?: Settlement[];
 }
 
 /** Restore promise identity before hydrating Suspense boundaries. */
 export function readHydration(json: string) {
   const pending = new Map<number, PendingValue>();
-  const queue = (window.__smolterDeferred ??= []);
+  const queue = ((window as DeferredWindow).__smolterDeferred ??= []);
 
   function revive(_key: string, value: unknown): unknown {
     if (!value || typeof value !== "object") return value;

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 0.4.1
+
+- Invalidate pending deployment recovery when an independent fetcher submits. Prevent recovery reloads while any tracked fetcher submission is pending, without blocking ordinary client navigation. Install the watcher before creating fetchers; mountApplication already does this.
+- Add regressions for two fetcher mutations completing before an older manifest check, overlapping pending submissions, unused recovery markers, later recovery, and watcher cleanup. These deterministic tests do not establish the complete streaming/offline browser matrix.
+- Clarify that root stylesheet URL imports rely on rendered stylesheet links and are outside route CSS discovery. Empty route styles arrays are expected in that setup; explicit host preload hints should be justified by measurements.
+
 ## 0.4.0
 
 - Add opt-in `earlyHydration: true` to Preact `renderApplication`: hydrate the shell before optional nested loader promises settle, using Preact Suspense and independently streamed values/errors. Default hydration timing is unchanged.

package/README.md

@@ -1,8 +1,8 @@
 # smolter _
 
 <!-- bundlejs:start -->
-[![react gzip size](https://deno.bundlejs.com/?q=%40kasperrt%2Fsmolter%400.4.0%2Freact&treeshake=%5B*%5D&config=%7B%22compression%22%3A%22gzip%22%2C%22esbuild%22%3A%7B%22external%22%3A%5B%22react%22%2C%22react%2F*%22%5D%7D%7D&badge)](https://bundlejs.com/?q=%40kasperrt%2Fsmolter%400.4.0%2Freact&treeshake=%5B*%5D&config=%7B%22compression%22%3A%22gzip%22%2C%22esbuild%22%3A%7B%22external%22%3A%5B%22react%22%2C%22react%2F*%22%5D%7D%7D&bundle)
-[![preact gzip size](https://deno.bundlejs.com/?q=%40kasperrt%2Fsmolter%400.4.0%2Fpreact&treeshake=%5B*%5D&config=%7B%22compression%22%3A%22gzip%22%2C%22esbuild%22%3A%7B%22external%22%3A%5B%22preact%22%2C%22preact%2F*%22%5D%7D%7D&badge)](https://bundlejs.com/?q=%40kasperrt%2Fsmolter%400.4.0%2Fpreact&treeshake=%5B*%5D&config=%7B%22compression%22%3A%22gzip%22%2C%22esbuild%22%3A%7B%22external%22%3A%5B%22preact%22%2C%22preact%2F*%22%5D%7D%7D&bundle)
+[![react gzip size](https://deno.bundlejs.com/?q=%40kasperrt%2Fsmolter%400.4.1%2Freact&treeshake=%5B*%5D&config=%7B%22compression%22%3A%22gzip%22%2C%22esbuild%22%3A%7B%22external%22%3A%5B%22react%22%2C%22react%2F*%22%5D%7D%7D&badge)](https://bundlejs.com/?q=%40kasperrt%2Fsmolter%400.4.1%2Freact&treeshake=%5B*%5D&config=%7B%22compression%22%3A%22gzip%22%2C%22esbuild%22%3A%7B%22external%22%3A%5B%22react%22%2C%22react%2F*%22%5D%7D%7D&bundle)
+[![preact gzip size](https://deno.bundlejs.com/?q=%40kasperrt%2Fsmolter%400.4.1%2Fpreact&treeshake=%5B*%5D&config=%7B%22compression%22%3A%22gzip%22%2C%22esbuild%22%3A%7B%22external%22%3A%5B%22preact%22%2C%22preact%2F*%22%5D%7D%7D&badge)](https://bundlejs.com/?q=%40kasperrt%2Fsmolter%400.4.1%2Fpreact&treeshake=%5B*%5D&config=%7B%22compression%22%3A%22gzip%22%2C%22esbuild%22%3A%7B%22external%22%3A%5B%22preact%22%2C%22preact%2F*%22%5D%7D%7D&bundle)
 <!-- bundlejs:end -->
 
 A typed data router for React and Preact. **Zero runtime dependencies.**
@@ -605,10 +605,10 @@ a claim of identical features.
 | `Preact: routing-only named exports` | 1405 |
 | `@kasperrt/smolter/react` | 2948 |
 | `@kasperrt/smolter/preact` | 4842 |
-| `@kasperrt/smolter/react + @kasperrt/smolter/react/client` | 4104 |
-| `@kasperrt/smolter/preact + server transport` | 5950 |
-| `@kasperrt/smolter/preact + client + document (application without lazy routes)` | 8949 |
-| `@kasperrt/smolter/preact + client + document + lazy-route (file-routed application)` | 9227 |
+| `@kasperrt/smolter/react + @kasperrt/smolter/react/client` | 4186 |
+| `@kasperrt/smolter/preact + server transport` | 6033 |
+| `@kasperrt/smolter/preact + client + document (application without lazy routes)` | 9034 |
+| `@kasperrt/smolter/preact + client + document + lazy-route (file-routed application)` | 9314 |
 | `@kasperrt/smolter/react/data (optional resource API)` | 2962 |
 | `React: common routing/data exports` | 2761 |
 | `Preact: common routing/data exports` | 3046 |
@@ -778,3 +778,5 @@ The generated route asset manifest follows static imports for each route and lea
 ### Matched-route asset hints
 
 The file-router build emits `.vite/route-assets.json` with each route's static JavaScript dependency closure and its CSS in `styles`. `routePreloads` from `@kasperrt/smolter/utils/assets` produces modulepreload hints for JavaScript and `preload; as=style; crossorigin` hints for CSS (matching Vite’s anonymous CORS mode), respecting your CDN/base URL. Set these hints on the document response or send Early Hints from your host. Stylesheet preloads fetch files; they do not apply styles. Keep the application stylesheet links and Vite's CSS handling in place. Optional dynamic imports are excluded, and unrelated routes stay lazy.
+
+Root stylesheet URL imports such as `import stylesUrl from "./index.css?url"` are not route CSS imports. Keep rendering `<link rel="stylesheet" href={stylesUrl}>` in the root document; an empty route `styles` array is expected when all CSS is loaded this way. Smolter does not infer stylesheet use from arbitrary asset URLs. If measurements show late root CSS discovery, your host can send an explicit preload or Early Hint for that same resolved URL, with the same CORS mode as the stylesheet link. Preloading does not replace the stylesheet link. Do not reorganize CSS merely to populate the route manifest.

package/dist/client/deployment.d.ts

@@ -8,7 +8,7 @@ export interface DeploymentOptions {
     /** Override document navigation, for example to ask about unsaved changes. */
     reload?: (destination: URL) => void;
 }
-/** Check for deployment changes before navigation. Returns a cleanup function. */
+/** Check for deployment changes before navigation. Install before creating fetchers. Returns a cleanup function. */
 export declare function watchDeployment(router: NavigationRouter, options: DeploymentOptions | null): () => void;
 /** Recover an initial lazy-import failure before a router has mounted. Returns whether a reload was requested. */
 export declare function recoverDeployment(options: DeploymentOptions | null, destination?: URL): Promise<boolean>;

package/dist/client/deployment.js

@@ -1,6 +1,6 @@
 import { deploymentCheck } from "./deployment-check.js";
 //#region .generated/client/deployment.ts
-/** Check for deployment changes before navigation. Returns a cleanup function. */
+/** Check for deployment changes before navigation. Install before creating fetchers. Returns a cleanup function. */
 function watchDeployment(router, options) {
 	if (!options || typeof window === "undefined") return () => {};
 	const check = deploymentCheck(options);
@@ -11,7 +11,24 @@ function watchDeployment(router, options) {
 	let sequence = 0;
 	let stopped = false;
 	let replay = false;
+	let mutations = 0;
+	const dataRouter = router;
+	const createFetcher = dataRouter.createFetcher;
+	const guardedFetcher = createFetcher && (() => {
+		const fetcher = createFetcher();
+		const submit = fetcher.submit;
+		fetcher.submit = (...args) => {
+			sequence++;
+			mutations++;
+			return submit(...args).finally(() => {
+				mutations--;
+			});
+		};
+		return fetcher;
+	});
+	if (guardedFetcher) dataRouter.createFetcher = guardedFetcher;
 	const valid = (current) => current === sequence && !stopped;
+	const canReload = (current) => valid(current) && mutations === 0;
 	const unsubscribe = router.subscribe(() => {
 		if (read().state === "submitting") sequence++;
 	});
@@ -20,7 +37,7 @@ function watchDeployment(router, options) {
 		const currentURL = new URL(router.getSnapshot().url);
 		const current = ++sequence;
 		if (target.origin === location.origin && (target.pathname !== currentURL.pathname || target.search !== currentURL.search) && await changed()) {
-			if (!valid(current) || await reload(target, () => valid(current))) return;
+			if (!valid(current) || await reload(target, () => canReload(current))) return;
 		}
 		if (current === sequence && !stopped) await navigate(href, operation);
 	};
@@ -33,7 +50,7 @@ function watchDeployment(router, options) {
 		event.stopImmediatePropagation();
 		changed().then(async (updated) => {
 			if (!valid(current)) return;
-			if (updated && await reload(target, () => valid(current))) return;
+			if (updated && await reload(target, () => canReload(current))) return;
 			if (!valid(current)) return;
 			replay = true;
 			window.dispatchEvent(new PopStateEvent("popstate", { state: event.state }));
@@ -45,7 +62,7 @@ function watchDeployment(router, options) {
 		const current = sequence;
 		const target = new URL(read().url);
 		changed().then((updated) => {
-			if (updated) return reload(target, () => valid(current) && read().state !== "submitting" && read().url === target.href);
+			if (updated) return reload(target, () => canReload(current) && read().state !== "submitting" && read().url === target.href);
 		});
 	};
 	function cleanup() {
@@ -55,6 +72,7 @@ function watchDeployment(router, options) {
 		unsubscribe();
 		window.removeEventListener("popstate", pop, true);
 		window.removeEventListener("vite:preloadError", preloadError);
+		if (dataRouter.createFetcher === guardedFetcher) dataRouter.createFetcher = createFetcher;
 		if (router.navigate === guarded) router.navigate = navigate;
 		if (router.dispose === guardedDispose) router.dispose = dispose;
 	}

package/dist/preact/deferred-hydration.d.ts

@@ -1,8 +1,6 @@
 type Settlement = [number, unknown, string | null];
-declare global {
-    interface Window {
-        __smolterDeferred?: Settlement[];
-    }
+export interface DeferredWindow extends Window {
+    __smolterDeferred?: Settlement[];
 }
 /** Restore promise identity before hydrating Suspense boundaries. */
 export declare function readHydration(json: string): {

package/jsr.json

@@ -1,6 +1,6 @@
 {
   "name": "@kasperrt/smolter",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "exports": {
     "./react": "./.generated/react/index.ts",
     "./preact": "./.generated/preact/index.ts",

package/package.json

@@ -56,7 +56,7 @@
     "wouter": "3.13.0",
     "wouter-preact": "3.13.0"
   },
-  "version": "0.4.0",
+  "version": "0.4.1",
   "description": "A tiny typed data router for React and Preact.",
   "sideEffects": false,
   "license": "MIT",