@fluixi/core 1.0.0-alpha.92 → 1.0.0-alpha.94

package/dist/src/lib/router/index.d.ts

@@ -6,6 +6,10 @@ interface RouterCtxValue {
     router: CoreRouter<any>;
     location: () => RouterLocation;
     params: () => Record<string, string>;
+    /** True from a navigation's start until the route it lands on has its modules and data. */
+    isRouting: () => boolean;
+    /** Counts a layer's data load toward `isRouting` until the promise settles. */
+    trackLoad: <T>(result: T) => T;
 }
 export interface RouterProps<C = any> {
     routes: RouteDefinition<C>[];
@@ -45,6 +49,22 @@ export interface RouterProps<C = any> {
 export declare function Router<C = any>(props: RouterProps<C>): any;
 /** Renders this layout's child route, inside this layout's context. */
 export declare function Outlet(): any;
+/**
+ * Whether a navigation is in progress: from the moment it starts until the route it lands on
+ * has loaded its modules and its route data. For a progress bar or a busy cursor.
+ *
+ * `delay` holds the `true` back until the navigation has lasted that many milliseconds, so a
+ * navigation that settles at once shows nothing. It still turns `false` the moment it ends.
+ *
+ * @example
+ * ```tsx
+ * const routing = useIsRouting({ delay: 120 });
+ * <div class="progress" data-active={() => (routing() ? '' : undefined)} />
+ * ```
+ */
+export declare function useIsRouting(options?: {
+    delay?: number;
+}): () => boolean;
 /** Navigate to `to` on mount (replace by default). Renders nothing. */
 export declare function Redirect(props: {
     to: string;
@@ -243,8 +263,8 @@ export declare function Form(props: FormProps): any;
 export declare function preloadRoutes<C = any>(routes: RouteDefinition<C>[], pathname: string): Promise<void>;
 export { createMemoryHistory, createBrowserHistory, matchRoutes, matchPath, } from '@fluixi/router';
 export type { RouteDefinition, RouteMatch, MatchedRoute, RouterLocation, NavigateOptions, HistoryAdapter, } from '@fluixi/router';
-export { cache, action, revalidate, createAsync, useSubmission, useAction, } from './data.js';
-export type { RouteDataArgs, RouteLoadFunc, Action, Submission, CacheFn, } from './data.js';
+export { cache, action, revalidate, createAsync, useSubmission, useSubmissions, useAction, } from './data.js';
+export type { RouteDataArgs, RouteLoadFunc, Action, ActionOptions, CacheOptions, Submission, CacheFn, } from './data.js';
 export { lazy } from '../render/lazy.js';
 export { supportsViewTransitions, prefersReducedMotion, type TransitionMode, } from './transition.js';
 export { runWithOwner } from '@fluixi/reactive/signal';

package/dist/src/lib/router/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/router/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/router/index.ts"],"names":[],"mappings":"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"}

package/dist/src/lib/router/index.js

@@ -11,7 +11,7 @@
  * matched array, never by re-entering a still-building parent, so deeply nested
  * <Outlet/> works at any depth.
  */
-import { createSignal, createMemo, createResource, createEffect, getOwner, onCleanup, untrack, flush, } from '@fluixi/reactive/signal';
+import { createSignal, createMemo, createResource, createEffect, createRoot, getOwner, onCleanup, runWithOwner, untrack, flush, } from '@fluixi/reactive/signal';
 import { prepareComponents, runTransition, } from './transition.js';
 import { insert, createComponent, createNativeElement, setAttribute, } from '@fluixi/dom';
 // Reactive context (not fluixi createProvider, which destructures children
@@ -24,7 +24,6 @@ const RouterContext = createContext(undefined, 'router');
 const OutletContext = createContext(undefined, 'outlet');
 const LevelParamsContext = createContext(undefined, 'route-params');
 const RouteDataContext = createContext(undefined, 'route-data');
-// ─── Rendering ────────────────────────────────────────────────────────────────
 /** Render one matched layer: load its data, stamp its contexts, run its component. */
 function renderLayer(m, depth, base) {
     // Load this layer's data once. createResource integrates with the nearest
@@ -38,8 +37,41 @@ function renderLayer(m, depth, base) {
             cancelled = true;
         });
         const owner = getOwner();
-        const [resource] = createResource(() => loader({ params: base.params, location: base.location }, owner, () => cancelled));
-        data = resource;
+        const router = useContext(RouterContext);
+        // The route's `routeDeps`, once its module has loaded: a change loads the layer again.
+        let watching = false;
+        const trackDeps = (deps) => {
+            if (watching || cancelled)
+                return;
+            watching = true;
+            runWithOwner(owner, () => {
+                let first = true;
+                createEffect(() => {
+                    deps();
+                    if (first)
+                        first = false;
+                    else
+                        untrack(() => void refetch());
+                });
+            });
+        };
+        const [resource, { refetch }] = createResource(() => {
+            const result = loader({ params: base.params, location: base.location }, owner, () => cancelled, trackDeps);
+            return router ? router.trackLoad(result) : result;
+        });
+        // A revalidated cache entry: load again. The page stays on screen with its current data.
+        onCleanup(onRevalidate(() => void refetch()));
+        // A failed load throws where the page reads it, so the nearest ErrorBoundary shows it.
+        // A resource reads as undefined once it has failed, which left the page empty and gave
+        // nothing a chance to catch the error.
+        data = () => {
+            const error = resource.error;
+            if (error !== undefined && error !== null)
+                throw error;
+            return resource();
+        };
+        Object.defineProperty(data, 'loading', { get: () => resource.loading });
+        Object.defineProperty(data, 'state', { get: () => resource.state });
     }
     const buildPage = () => RouteDataContext.Provider({
         value: data,
@@ -58,18 +90,22 @@ function renderLayer(m, depth, base) {
         },
     });
     if (!data)
-        return buildPage();
+        return { view: buildPage(), ready: () => true };
     // Gate on the data being resolved, like the old router, so the page reads
     // ready data (rd() returns the value, not a thrown promise) and works without a
     // Suspense boundary. Signal-gated (`ready` only flips when loading actually
     // changes) so navigation re-renders don't re-run this and rebuild the page.
     const res = data;
-    const isLoading = () => res.loading;
+    // The first load only. A refetch after revalidate keeps the page, showing the old data until the new arrives.
+    const isLoading = () => {
+        const state = res.state;
+        return state === undefined ? res.loading : state === 'pending' || state === 'unresolved';
+    };
     // untrack the initial read so the enclosing render memo doesn't subscribe to the
     // resource state (that would re-run renderLayer and recreate the resource, a loop).
     const [ready, setReady] = createSignal(untrack(() => !isLoading()));
     createEffect(() => setReady(!isLoading()));
-    return createMemo(() => (ready() ? buildPage() : null));
+    return { view: createMemo(() => (ready() ? buildPage() : null)), ready };
 }
 /**
  * Renders the next matched layer, reactively but keyed on its component ref so the
@@ -84,8 +120,8 @@ function renderChild(ctx) {
     // every navigation and re-render the child. A signal only notifies when its value
     // actually changes, so the render memo below re-runs only when the route at this
     // depth changes: sibling navigation reuses the layout, deeper navigation leaves
-    // this level untouched. The child is rendered INLINE (no detached createRoot), so
-    // it stays connected to the Suspense / context owner chain.
+    // this level untouched. Each child renders in a root attached to this owner (below),
+    // so it stays connected to the Suspense / context owner chain.
     const [childComp, setChildComp] = createSignal(untrack(() => ctx.matched()[childIdx]?.component));
     createEffect(() => {
         const c = ctx.matched()[childIdx]?.component;
@@ -95,20 +131,53 @@ function renderChild(ctx) {
         if (untrack(childComp) !== c)
             setChildComp(() => c);
     });
-    return createMemo(() => {
+    // Each layer lives in its own root under this Outlet's owner: attached, so context and
+    // Suspense reach it, but not owned by the memo below, so a newer layer does not dispose it.
+    // That is what lets the page on screen stay there while the next one loads its data.
+    const owner = getOwner();
+    let shown = null;
+    let pending = null;
+    const drop = (layer) => layer?.dispose();
+    onCleanup(() => {
+        drop(shown);
+        drop(pending);
+        shown = pending = null;
+    });
+    const incoming = createMemo(() => {
         const component = childComp();
-        if (!component) {
+        if (!component)
+            return null;
+        const m = untrack(() => ctx.matched())[childIdx];
+        return runWithOwner(owner, () => createRoot((dispose) => ({
+            ...renderLayer(m, childIdx, { matched: ctx.matched, params: ctx.params, location: ctx.location }),
+            dispose,
+        })));
+    });
+    return createMemo(() => {
+        const next = incoming();
+        if (!next) {
+            drop(shown);
+            drop(pending);
+            shown = pending = null;
             // No route at this depth. At the root (the only ctx carrying `notFound`) that means the
             // URL matched nothing: render the not-found fallback instead of a blank page. Nested
             // Outlets have no `notFound`, so they stay null (a missing child is just an empty Outlet).
             return ctx.notFound ? ctx.notFound() : null;
         }
-        const m = untrack(() => ctx.matched())[childIdx];
-        return renderLayer(m, childIdx, {
-            matched: ctx.matched,
-            params: ctx.params,
-            location: ctx.location,
-        });
+        if (next === shown)
+            return shown.view;
+        // A newer navigation superseded the one still loading.
+        if (pending && pending !== next)
+            drop(pending);
+        pending = next;
+        // Keep the current page until the next one has its data. Nothing on screen yet (first
+        // render, hydration): show the next one straight away, its own gate handles loading.
+        if (shown && !next.ready())
+            return shown.view;
+        drop(shown);
+        shown = next;
+        pending = null;
+        return shown.view;
     });
 }
 /**
@@ -166,6 +235,10 @@ export function Router(props) {
         history,
     });
     const [state, setState] = createSignal(router.state());
+    // A navigation in flight, and the layer data loads it started: together they are
+    // `useIsRouting()`, what a progress bar reads.
+    const [navigating, setNavigating] = createSignal(false);
+    const [loads, setLoads] = createSignal(0);
     /**
      * Which navigation is allowed to commit.
      *
@@ -194,6 +267,7 @@ export function Router(props) {
     const unsub = router.subscribe((next) => {
         const id = ++navigationId;
         const mode = takeMode();
+        setNavigating(true);
         // Load the modules the next route needs before anything is torn down, so a lazy
         // route renders straight through instead of suspending into a fallback with the
         // old page already gone.
@@ -201,8 +275,12 @@ export function Router(props) {
         const commit = () => {
             setState(next);
             // The write only queues; effects are scheduled. Flushing here is what lets the
-            // browser snapshot a settled DOM rather than a half-built one.
-            return flush();
+            // browser snapshot a settled DOM rather than a half-built one. The layers built by
+            // the flush have registered their data loads, so `isRouting` stays true through them.
+            const flushed = flush();
+            if (id === navigationId)
+                setNavigating(false);
+            return flushed;
         };
         if (!prepared) {
             // Nothing to wait for: stay on the tick this navigation was already on.
@@ -230,6 +308,16 @@ export function Router(props) {
         router: router,
         location: createMemo(() => state().location),
         params: createMemo(() => state().match?.params ?? {}),
+        isRouting: () => navigating() || loads() > 0,
+        // Counted by the promise, not by an owner: a load a newer navigation superseded still
+        // settles and uncounts itself, and a resource seeded from the server never calls it.
+        trackLoad(result) {
+            if (result && typeof result.finally === 'function') {
+                setLoads((n) => n + 1);
+                void result.finally(() => setLoads((n) => n - 1)).catch(() => { });
+            }
+            return result;
+        },
     };
     // Render depth 0 (a virtual parent at depth -1 so the root reuses the same path).
     const root = {
@@ -260,6 +348,35 @@ export function Outlet() {
         return null;
     return renderChild(ctx);
 }
+/**
+ * Whether a navigation is in progress: from the moment it starts until the route it lands on
+ * has loaded its modules and its route data. For a progress bar or a busy cursor.
+ *
+ * `delay` holds the `true` back until the navigation has lasted that many milliseconds, so a
+ * navigation that settles at once shows nothing. It still turns `false` the moment it ends.
+ *
+ * @example
+ * ```tsx
+ * const routing = useIsRouting({ delay: 120 });
+ * <div class="progress" data-active={() => (routing() ? '' : undefined)} />
+ * ```
+ */
+export function useIsRouting(options = {}) {
+    const routing = useContext(RouterContext)?.isRouting ?? (() => false);
+    const delay = options.delay ?? 0;
+    if (delay <= 0)
+        return routing;
+    const [late, setLate] = createSignal(false);
+    createEffect(() => {
+        if (!routing()) {
+            setLate(false);
+            return;
+        }
+        const timer = setTimeout(() => setLate(true), delay);
+        onCleanup(() => clearTimeout(timer));
+    });
+    return () => routing() && late();
+}
 /** Navigate to `to` on mount (replace by default). Renders nothing. */
 export function Redirect(props) {
     const ctx = useContext(RouterContext);
@@ -288,6 +405,8 @@ const _ssrRouterStub = {
     router: { navigate: () => { } },
     location: () => ({ pathname: '', search: '', hash: '', query: {} }),
     params: () => ({}),
+    isRouting: () => false,
+    trackLoad: (result) => result,
 };
 /**
  * The router context: the router itself, the current match, and the location.
@@ -523,7 +642,7 @@ const LINK_OWN_PROPS = new Set([
  */
 export function Link(props) {
     const ctx = useContext(RouterContext);
-    const navigate = () => ctx?.router.navigate(read(props.href) ?? '', { replace: read(props.replace) });
+    const navigate = () => ctx.router.navigate(read(props.href) ?? '', { replace: read(props.replace) });
     // createNativeElement branches on isServer() -> a real ServerNode <a> (serialized as a true
     // element, not an escaped string) on the server, a real DOM <a> on the client.
     const a = createNativeElement('a');
@@ -545,7 +664,26 @@ export function Link(props) {
         if (LINK_OWN_PROPS.has(k))
             continue;
         const v = props[k];
-        if (v != null && typeof v !== 'function')
+        if (typeof v === 'function') {
+            // An accessor (`title={() => t('…')}`, `aria-current={() => …}`): followed on the client,
+            // read once for the server's markup. Event handlers are not attributes.
+            if (/^on[A-Z]/.test(k))
+                continue;
+            const read = v;
+            const apply = () => {
+                const value = read();
+                if (value == null || value === false)
+                    a.removeAttribute?.(k);
+                else
+                    setAttribute(a, k, String(value));
+            };
+            if (typeof a.addEventListener === 'function')
+                createEffect(apply);
+            else
+                apply();
+            continue;
+        }
+        if (v != null)
             setAttribute(a, k, String(v));
     }
     // Client only (ServerNode has no addEventListener). Direct listener (not delegated) so
@@ -554,6 +692,10 @@ export function Link(props) {
         a.addEventListener('click', (e) => {
             if (e.metaKey || e.ctrlKey || e.shiftKey || e.altKey)
                 return;
+            // No router above this link: let the browser follow it rather than cancel the click
+            // and go nowhere.
+            if (!ctx)
+                return;
             e.preventDefault();
             navigate();
         });
@@ -584,6 +726,7 @@ export function Link(props) {
 }
 /** Alias for {@link Link}. */
 export const A = Link;
+import { onRevalidate } from './data.js';
 /**
  * A `<form>` wired to an action: on submit it builds `FormData` from the form and calls
  * `action(formData)` (which tracks submission state via `useSubmission`), without a full
@@ -665,7 +808,7 @@ export async function preloadRoutes(routes, pathname) {
 export { createMemoryHistory, createBrowserHistory, matchRoutes, matchPath, } from '@fluixi/router';
 // Action/cache/lazy layer is orthogonal to routing: re-export so a route file can
 // swap its import path wholesale. (Routing hooks above are the router ones.)
-export { cache, action, revalidate, createAsync, useSubmission, useAction, } from './data.js';
+export { cache, action, revalidate, createAsync, useSubmission, useSubmissions, useAction, } from './data.js';
 export { lazy } from '../render/lazy.js';
 // Navigation presentation. The router owns the integration; these are exported for
 // apps that need to ask what the environment supports.