@real-router/solid 0.6.0 → 0.8.0

package/dist/esm/index.mjs

@@ -9,6 +9,7 @@ import { UNKNOWN_ROUTE, getNavigator } from '@real-router/core';
 // Local (non-global) Symbols — Symbol.for() would expose markers to spoofing
 // via the global Symbol registry. See Gotchas section "RouteView Marker Objects".
 const MATCH_MARKER = Symbol("RouteView.Match");
+const SELF_MARKER = Symbol("RouteView.Self");
 const NOT_FOUND_MARKER = Symbol("RouteView.NotFound");
 function Match(props) {
   const result = {
@@ -27,6 +28,19 @@ function Match(props) {
   return result;
 }
 Match.displayName = "RouteView.Match";
+function Self(props) {
+  const result = {
+    $$type: SELF_MARKER,
+    fallback: props.fallback,
+    get children() {
+      return props.children;
+    }
+  };
+
+  // See Match for the marker-pattern rationale.
+  return result;
+}
+Self.displayName = "RouteView.Self";
 function NotFound(props) {
   const result = {
     $$type: NOT_FOUND_MARKER,
@@ -49,6 +63,9 @@ function isSegmentMatch(routeName, fullSegmentName, exact) {
 function isMatchMarker(value) {
   return value != null && typeof value === "object" && "$$type" in value && value.$$type === MATCH_MARKER;
 }
+function isSelfMarker(value) {
+  return value != null && typeof value === "object" && "$$type" in value && value.$$type === SELF_MARKER;
+}
 function isNotFoundMarker(value) {
   return value != null && typeof value === "object" && "$$type" in value && value.$$type === NOT_FOUND_MARKER;
 }
@@ -62,11 +79,48 @@ function collectElements(children, result) {
     }
     return;
   }
-  if (isMatchMarker(children) || isNotFoundMarker(children)) {
+  if (isMatchMarker(children) || isSelfMarker(children) || isNotFoundMarker(children)) {
     result.push(children);
   }
 }
+
+// child.children is a getter — read it INSIDE the JSX expression so Solid
+// creates a reactive dependency. Pulling it into a variable freezes the
+// value at template-build time and breaks Suspense fallback transitions
+// (lazy() resolution).
+function renderMatch(child) {
+  return child.fallback === undefined ? child.children : createComponent(Suspense, {
+    get fallback() {
+      return child.fallback;
+    },
+    get children() {
+      return child.children;
+    }
+  });
+}
+function renderSelf(self) {
+  return self.fallback === undefined ? self.children : createComponent(Suspense, {
+    get fallback() {
+      return self.fallback;
+    },
+    get children() {
+      return self.children;
+    }
+  });
+}
+function processMatchChild(child, routeName, nodeName) {
+  const {
+    segment,
+    exact
+  } = child;
+  const fullSegmentName = nodeName ? `${nodeName}.${segment}` : segment;
+  if (!isSegmentMatch(routeName, fullSegmentName, exact)) {
+    return null;
+  }
+  return renderMatch(child);
+}
 function buildRenderList(elements, routeName, nodeName) {
+  let selfMarker = null;
   let notFoundChildren = null;
   let activeMatchFound = false;
   const rendered = [];
@@ -75,28 +129,25 @@ function buildRenderList(elements, routeName, nodeName) {
       notFoundChildren = child.children;
       continue;
     }
-    if (activeMatchFound) {
+    if (isSelfMarker(child)) {
+      selfMarker ??= child;
       continue;
     }
-    const {
-      segment,
-      exact,
-      fallback
-    } = child;
-    const fullSegmentName = nodeName ? `${nodeName}.${segment}` : segment;
-    if (!isSegmentMatch(routeName, fullSegmentName, exact)) {
+    if (activeMatchFound) {
       continue;
     }
-    activeMatchFound = true;
-    rendered.push(fallback === undefined ? child.children : createComponent(Suspense, {
-      fallback: fallback,
-      get children() {
-        return child.children;
-      }
-    }));
+    const matchRendered = processMatchChild(child, routeName, nodeName);
+    if (matchRendered !== null) {
+      activeMatchFound = true;
+      rendered.push(matchRendered);
+    }
   }
-  if (!activeMatchFound && routeName === UNKNOWN_ROUTE && notFoundChildren !== null) {
-    rendered.push(notFoundChildren);
+  if (!activeMatchFound) {
+    if (selfMarker !== null && routeName === nodeName) {
+      rendered.push(renderSelf(selfMarker));
+    } else if (routeName === UNKNOWN_ROUTE && notFoundChildren !== null) {
+      rendered.push(notFoundChildren);
+    }
   }
   return rendered;
 }
@@ -155,6 +206,7 @@ function RouteViewRoot(props) {
 RouteViewRoot.displayName = "RouteView";
 const RouteView = Object.assign(RouteViewRoot, {
   Match,
+  Self,
   NotFound
 });
 
@@ -265,7 +317,7 @@ function removeAnnouncer() {
   document.querySelector(`[${ANNOUNCER_ATTR}]`)?.remove();
 }
 function resolveText(route, prefix, getCustomText, h1) {
-  const h1Text = h1?.textContent.trim() ?? "";
+  const h1Text = (h1?.textContent ?? "").trim();
   const routeName = route.name.startsWith(INTERNAL_ROUTE_PREFIX) ? "" : route.name;
   const rawText = h1Text || document.title || routeName || globalThis.location.pathname;
   return `${prefix}${rawText}`;
@@ -283,14 +335,14 @@ function manageFocus(h1) {
 }
 
 const STORAGE_KEY = "real-router:scroll";
-const NOOP_INSTANCE = Object.freeze({
+const NOOP_INSTANCE$1 = Object.freeze({
   destroy: () => {
     /* no-op */
   }
 });
 function createScrollRestoration(router, options) {
   if (typeof globalThis.window === "undefined") {
-    return NOOP_INSTANCE;
+    return NOOP_INSTANCE$1;
   }
   const mode = options?.mode ?? "restore";
 
@@ -298,7 +350,7 @@ function createScrollRestoration(router, options) {
   // don't subscribe, don't register pagehide — leave the browser's native
   // auto-restore intact for the app to override if it wants to.
   if (mode === "manual") {
-    return NOOP_INSTANCE;
+    return NOOP_INSTANCE$1;
   }
   const anchorEnabled = options?.anchorScrolling ?? true;
   const getContainer = options?.scrollContainer;
@@ -439,6 +491,128 @@ function canonicalReplacer(_key, val) {
   return val;
 }
 
+const NOOP_INSTANCE = Object.freeze({
+  destroy: () => {
+    /* no-op */
+  }
+});
+function createViewTransitions(router) {
+  if (typeof document === "undefined" || typeof document.startViewTransition !== "function") {
+    return NOOP_INSTANCE;
+  }
+  let closeVT = null;
+  let currentVT = null;
+  // Tracks whether TRANSITION_SUCCESS fired for the current leave. Used to
+  // distinguish "benign cleanup abort" (router's async path aborts its own
+  // controller in a finally block after successful navigation) from "real
+  // cancellation" (concurrent navigate, guard rejection, dispose).
+  let successFired = false;
+  const resolveAndClear = () => {
+    closeVT?.();
+    closeVT = null;
+  };
+  const offLeave = router.subscribeLeave(({
+    signal
+  }) => {
+    // Reentrant abort: signal already aborted when we're called. Open no VT
+    // — router will fall through to TRANSITION_CANCELLED via isCurrentNav()
+    // after leave resolves. addEventListener("abort", ...) does not re-fire
+    // for past events, so skipping startViewTransition is the safe path.
+    if (signal.aborted) {
+      return;
+    }
+    successFired = false;
+    resolveAndClear();
+
+    // Return a Promise so the router awaits until the browser invokes
+    // updateCallback. This ensures old DOM snapshot is captured BEFORE the
+    // router commits the new state — giving correct exit→state→entry
+    // ordering (vs fire-and-forget, where URL changes before VT captures).
+    return new Promise(resolveLeave => {
+      // Capture the resolver synchronously BEFORE startViewTransition() is
+      // called. The browser invokes updateCallback in a later task, but
+      // router.subscribe (TRANSITION_SUCCESS) can fire before that. If we
+      // captured `resolve` inside the callback, subscribe would see closeVT
+      // still null and skip resolving — the deferred would hang for 4s
+      // until the VT API aborts with TimeoutError.
+      const deferred = new Promise(resolve => {
+        closeVT = resolve;
+      });
+      signal.addEventListener("abort", () => {
+        if (successFired) {
+          // Router's async path (#finishAsyncNavigation) aborts its own
+          // controller in a finally block AFTER completeTransition (and
+          // thus AFTER subscribe fired). This is cleanup, not
+          // cancellation — VT is progressing normally, do nothing.
+          return;
+        }
+
+        // Real cancellation (concurrent navigate, dispose). Resolve the
+        // deferred so updateCallback can complete, skip the VT so no
+        // stale animation leaks, and unblock the router if the abort
+        // fires before updateCallback was invoked.
+        resolveAndClear();
+        currentVT?.skipTransition?.();
+        resolveLeave();
+      }, {
+        once: true
+      });
+      try {
+        currentVT = document.startViewTransition(() => {
+          // Resolving here unblocks the router at the moment the browser
+          // enters updateCallback — by spec, old DOM snapshot is captured
+          // before this callback runs. Router now proceeds through
+          // activation guards and setState; the VT animation waits on
+          // `deferred`, which is resolved from router.subscribe after a
+          // task-queue tick (see NOTE on setTimeout below).
+          resolveLeave();
+          return deferred;
+        });
+      } catch {
+        // Defensive: spec says startViewTransition doesn't throw under
+        // normal conditions, but Chromium has had edge cases (detached
+        // document, extension interference). Clean up and unblock router.
+        resolveAndClear();
+        resolveLeave();
+      }
+    });
+  });
+  const offSuccess = router.subscribe(() => {
+    const resolver = closeVT;
+    successFired = true;
+    closeVT = null;
+    if (resolver === null) {
+      currentVT = null;
+    } else {
+      // CRITICAL: CANNOT use requestAnimationFrame here. When the router
+      // takes the async path (leave returned a Promise), subscribe fires
+      // AFTER the browser has already transitioned VT into the
+      // "update-callback-called" phase. In that phase Chromium sets
+      // rendering suppression to true, which ALSO blocks rAF callbacks.
+      // rAF would never fire → deferred never resolves → browser aborts
+      // vt.ready with TimeoutError after 4s (observed in Chromium).
+      //
+      // setTimeout runs on the task queue independent of the rendering
+      // pipeline, so it fires regardless of suppression. React's scheduler
+      // uses MessageChannel tasks, which are queued before our setTimeout,
+      // so the new DOM is committed by the time our callback runs.
+      setTimeout(() => {
+        resolver();
+        currentVT = null;
+      }, 0);
+    }
+  });
+  return {
+    destroy: () => {
+      offLeave();
+      offSuccess();
+      currentVT?.skipTransition?.();
+      currentVT = null;
+      resolveAndClear();
+    }
+  };
+}
+
 function shouldNavigate(evt) {
   return evt.button === 0 && !evt.metaKey && !evt.altKey && !evt.ctrlKey && !evt.shiftKey;
 }
@@ -656,6 +830,206 @@ function useRouterTransition() {
   return createSignalFromSource(source);
 }
 
+/**
+ * Subscribe to the router's leave-window with the universal guards baked
+ * in. Wraps `router.subscribeLeave` so consumers don't repeat the same
+ * boilerplate every time:
+ *
+ *   - **Reentrant abort pre-check**: if `signal.aborted` is already `true`
+ *     when the handler would run (rapid navigation superseded a slower
+ *     one), the handler is skipped entirely. `signal.addEventListener(
+ *     "abort", ...)` does not fire retroactively, so without this guard
+ *     downstream cleanup would never trigger.
+ *   - **Same-route skip**: by default, `route.name === nextRoute.name`
+ *     short-circuits the handler — query-only navigations (sort, filter,
+ *     pagination) skip the work. Opt out with `skipSameRoute: false`.
+ *
+ * Returns nothing — the subscription's lifecycle is bound to the
+ * component via `onCleanup`.
+ *
+ * If the handler returns a Promise, the router blocks on it. If the
+ * Promise resolves, navigation proceeds. If it rejects, the router emits
+ * `TRANSITION_CANCELLED`.
+ *
+ * **Handler reactivity (Solid)**: Solid components run **once** at mount;
+ * `handler` is captured in closure at the call site. If you need
+ * different behavior across renders, derive it from a signal inside the
+ * handler body — do not rely on swapping the handler reference.
+ *
+ * @example Animation
+ * ```tsx
+ * let ref: HTMLDivElement | undefined;
+ *
+ * useRouteExit(async ({ signal }) => {
+ *   const el = ref;
+ *   if (!el) return;
+ *   el.classList.add("fade-out");
+ *   const cleanup = () => el.classList.remove("fade-out");
+ *   signal.addEventListener("abort", cleanup, { once: true });
+ *   try {
+ *     el.getBoundingClientRect();   // style flush
+ *     await Promise.allSettled(el.getAnimations().map((a) => a.finished));
+ *   } finally {
+ *     cleanup();
+ *   }
+ * });
+ * ```
+ *
+ * @example Auto-save form draft
+ * ```tsx
+ * useRouteExit(async ({ signal }) => {
+ *   if (formState.dirty) await api.saveDraft(formState, { signal });
+ * });
+ * ```
+ *
+ * @example Reading rich transition metadata via `nextRoute.transition`
+ * ```tsx
+ * useRouteExit(({ route, nextRoute }) => {
+ *   if (nextRoute.transition.segments.deactivated.includes("products")) {
+ *     productCache.clear();
+ *   }
+ *   if (nextRoute.transition.redirected) {
+ *     return;
+ *   }
+ * });
+ * ```
+ */
+function useRouteExit(handler, options) {
+  const router = useRouter();
+  const skipSameRoute = options?.skipSameRoute ?? true;
+  const off = router.subscribeLeave(({
+    route,
+    nextRoute,
+    signal
+  }) => {
+    if (skipSameRoute && route.name === nextRoute.name) {
+      return;
+    }
+
+    // Reentrant abort: signal is already aborted when listener fires
+    // (e.g. a newer navigate superseded this one before subscribeLeave
+    // even ran). addEventListener("abort", ...) does not fire
+    // retroactively, so we skip the handler entirely.
+    if (signal.aborted) {
+      return;
+    }
+    return handler({
+      route,
+      nextRoute,
+      signal
+    });
+  });
+  onCleanup(off);
+}
+
+/**
+ * Fire `handler` once when the component mounts as a result of a
+ * navigation. Mirror of `useRouteExit` for the entry side.
+ *
+ * What this hook covers that an ad-hoc `createEffect` + `useRoute()`
+ * doesn't:
+ *
+ *   - **Skip-initial**: handler is skipped when there is no
+ *     `transition.from` (i.e. first-load mount). Most consumers want to
+ *     fire side effects only on real navigations, not on hydration.
+ *   - **Same-route skip** (default): handler is skipped when
+ *     `route.transition.from === route.name`. Sort/filter/query-only
+ *     navigations re-trigger the effect (because the `route` reference
+ *     changes), but they are not "entries" in the animation / analytics
+ *     sense — the component instance has stayed mounted throughout.
+ *     Opt out with `skipSameRoute: false`.
+ *   - **Mount-time `route` / `previousRoute` snapshot**: the handler
+ *     receives the values that were live at the moment of effect
+ *     activation, not the latest ones (which may have moved on if the
+ *     user navigated again before the effect drained).
+ *
+ * **Handler reactivity (Solid)**: Solid components run **once** at mount;
+ * `handler` is captured in closure when the hook is called. If you need
+ * different behavior across renders, derive it from a signal inside the
+ * handler body — do not rely on swapping the handler reference.
+ *
+ * @example Direction-aware entry animation
+ * ```tsx
+ * useRouteEnter(({ route }) => {
+ *   const direction = route.context.browser?.direction;
+ *   ref?.classList.add(
+ *     direction === "back" ? "slide-from-left" : "slide-from-right",
+ *   );
+ * });
+ * ```
+ *
+ * @example Analytics page-enter event (skip-initial built-in)
+ * ```tsx
+ * useRouteEnter(({ route, previousRoute }) => {
+ *   analytics.track("page_enter", {
+ *     route: route.name,
+ *     from: previousRoute.name,
+ *   });
+ * });
+ * ```
+ *
+ * @example Reading rich transition metadata via `route.transition`
+ * ```tsx
+ * useRouteEnter(({ route }) => {
+ *   if (route.transition.redirected) {
+ *     showToast(`Redirected from ${route.transition.from}`);
+ *   }
+ *   if (route.transition.segments.activated.includes("products")) {
+ *     // products subtree just became active
+ *   }
+ * });
+ * ```
+ */
+function useRouteEnter(handler, options) {
+  const routeState = useRoute();
+  const skipSameRoute = options?.skipSameRoute ?? true;
+  let lastHandledRoute = null;
+  createEffect(() => {
+    const {
+      route,
+      previousRoute
+    } = routeState();
+
+    // Early-exit guards, top-down:
+    //
+    //   - **Defensive**: `route` may be undefined during SSR or
+    //     pre-start hydration. Not testable from vitest (tests start
+    //     the router before render), so v8-ignored.
+    //   - **Skip-initial**: `state.transition.from` is undefined only
+    //     for the very first state committed by `router.start()`.
+    //   - **Skip-same-route**: query-only navigations have
+    //     `transition.from === route.name`. Opt-out via
+    //     `skipSameRoute: false`.
+    //   - **Defensive dedupe + missing `previousRoute`**: same `route`
+    //     ref between effect activations is unexpected on Solid (effects
+    //     run once per dependency change); `!previousRoute` is unreachable
+    //     once `transition.from` is set (the two are populated together by
+    //     core). Both kept for parity with React; v8-ignored.
+    /* v8 ignore start */
+    if (!route) {
+      return;
+    }
+    /* v8 ignore stop */
+    if (!route.transition.from) {
+      return;
+    }
+    if (skipSameRoute && route.transition.from === route.name) {
+      return;
+    }
+    /* v8 ignore start */
+    if (lastHandledRoute === route || !previousRoute) {
+      return;
+    }
+    /* v8 ignore stop */
+
+    lastHandledRoute = route;
+    handler({
+      route,
+      previousRoute
+    });
+  });
+}
+
 function isRouteActive(linkRouteName, currentRouteName) {
   return currentRouteName === linkRouteName || currentRouteName.startsWith(`${linkRouteName}.`);
 }
@@ -678,6 +1052,15 @@ function RouterProvider(props) {
       sr.destroy();
     });
   });
+  onMount(() => {
+    if (!props.viewTransitions) {
+      return;
+    }
+    const vt = createViewTransitions(props.router);
+    onCleanup(() => {
+      vt.destroy();
+    });
+  });
   const navigator = getNavigator(props.router);
   const routeSource = createRouteSource(props.router);
   const routeSignal = createSignalFromSource(routeSource);
@@ -701,4 +1084,4 @@ function RouterProvider(props) {
   });
 }
 
-export { Link, RouteContext, RouteView, RouterContext, RouterErrorBoundary, RouterProvider, createSignalFromSource, createStoreFromSource, link, useNavigator, useRoute, useRouteNode, useRouteNodeStore, useRouteStore, useRouteUtils, useRouter, useRouterTransition };
+export { Link, RouteContext, RouteView, RouterContext, RouterErrorBoundary, RouterProvider, createSignalFromSource, createStoreFromSource, link, useNavigator, useRoute, useRouteEnter, useRouteExit, useRouteNode, useRouteNodeStore, useRouteStore, useRouteUtils, useRouter, useRouterTransition };

package/dist/types/RouterProvider.d.ts

@@ -5,6 +5,7 @@ export interface RouteProviderProps {
     router: Router;
     announceNavigation?: boolean;
     scrollRestoration?: ScrollRestorationOptions;
+    viewTransitions?: boolean;
 }
 export declare function isRouteActive(linkRouteName: string, currentRouteName: string): boolean;
 export declare function RouterProvider(props: ParentProps<RouteProviderProps>): JSX.Element;

package/dist/types/RouterProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RouterProvider.d.ts","sourceRoot":"","sources":["../../src/RouterProvider.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAC;AAC5D,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAEjD,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,MAAM,CAAC;IACf,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,iBAAiB,CAAC,EAAE,wBAAwB,CAAC;CAC9C;AAED,wBAAgB,aAAa,CAC3B,aAAa,EAAE,MAAM,EACrB,gBAAgB,EAAE,MAAM,GACvB,OAAO,CAKT;AAED,wBAAgB,cAAc,CAC5B,KAAK,EAAE,WAAW,CAAC,kBAAkB,CAAC,GACrC,GAAG,CAAC,OAAO,CA2Cb"}
+{"version":3,"file":"RouterProvider.d.ts","sourceRoot":"","sources":["../../src/RouterProvider.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAC;AAC5D,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAEjD,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,MAAM,CAAC;IACf,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,iBAAiB,CAAC,EAAE,wBAAwB,CAAC;IAC7C,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,wBAAgB,aAAa,CAC3B,aAAa,EAAE,MAAM,EACrB,gBAAgB,EAAE,MAAM,GACvB,OAAO,CAKT;AAED,wBAAgB,cAAc,CAC5B,KAAK,EAAE,WAAW,CAAC,kBAAkB,CAAC,GACrC,GAAG,CAAC,OAAO,CAuDb"}

package/dist/types/components/RouteView/RouteView.d.ts

@@ -1,4 +1,4 @@
-import { Match, NotFound } from "./components";
+import { Match, NotFound, Self } from "./components";
 import type { RouteViewProps } from "./types";
 import type { JSX } from "solid-js";
 declare function RouteViewRoot(props: Readonly<RouteViewProps>): JSX.Element;
@@ -7,7 +7,8 @@ declare namespace RouteViewRoot {
 }
 export declare const RouteView: typeof RouteViewRoot & {
     Match: typeof Match;
+    Self: typeof Self;
     NotFound: typeof NotFound;
 };
-export type { RouteViewProps, MatchProps as RouteViewMatchProps, NotFoundProps as RouteViewNotFoundProps, } from "./types";
+export type { RouteViewProps, MatchProps as RouteViewMatchProps, SelfProps as RouteViewSelfProps, NotFoundProps as RouteViewNotFoundProps, } from "./types";
 //# sourceMappingURL=RouteView.d.ts.map

package/dist/types/components/RouteView/RouteView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RouteView.d.ts","sourceRoot":"","sources":["../../../../src/components/RouteView/RouteView.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAK/C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAEpC,iBAAS,aAAa,CAAC,KAAK,EAAE,QAAQ,CAAC,cAAc,CAAC,GAAG,GAAG,CAAC,OAAO,CAgCnE;kBAhCQ,aAAa;;;AAoCtB,eAAO,MAAM,SAAS;;;CAAoD,CAAC;AAE3E,YAAY,EACV,cAAc,EACd,UAAU,IAAI,mBAAmB,EACjC,aAAa,IAAI,sBAAsB,GACxC,MAAM,SAAS,CAAC"}
+{"version":3,"file":"RouteView.d.ts","sourceRoot":"","sources":["../../../../src/components/RouteView/RouteView.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAKrD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAEpC,iBAAS,aAAa,CAAC,KAAK,EAAE,QAAQ,CAAC,cAAc,CAAC,GAAG,GAAG,CAAC,OAAO,CAgCnE;kBAhCQ,aAAa;;;AAoCtB,eAAO,MAAM,SAAS;;;;CAIpB,CAAC;AAEH,YAAY,EACV,cAAc,EACd,UAAU,IAAI,mBAAmB,EACjC,SAAS,IAAI,kBAAkB,EAC/B,aAAa,IAAI,sBAAsB,GACxC,MAAM,SAAS,CAAC"}

package/dist/types/components/RouteView/components.d.ts

@@ -1,6 +1,7 @@
-import type { MatchProps, NotFoundProps } from "./types";
+import type { MatchProps, NotFoundProps, SelfProps } from "./types";
 import type { JSX } from "solid-js";
 export declare const MATCH_MARKER: unique symbol;
+export declare const SELF_MARKER: unique symbol;
 export declare const NOT_FOUND_MARKER: unique symbol;
 export interface MatchMarker {
     $$type: typeof MATCH_MARKER;
@@ -9,15 +10,24 @@ export interface MatchMarker {
     fallback?: JSX.Element;
     children: JSX.Element;
 }
+export interface SelfMarker {
+    $$type: typeof SELF_MARKER;
+    fallback?: JSX.Element;
+    children: JSX.Element;
+}
 export interface NotFoundMarker {
     $$type: typeof NOT_FOUND_MARKER;
     children: JSX.Element;
 }
-export type RouteViewMarker = MatchMarker | NotFoundMarker;
+export type RouteViewMarker = MatchMarker | SelfMarker | NotFoundMarker;
 export declare function Match(props: MatchProps): JSX.Element;
 export declare namespace Match {
     var displayName: string;
 }
+export declare function Self(props: SelfProps): JSX.Element;
+export declare namespace Self {
+    var displayName: string;
+}
 export declare function NotFound(props: NotFoundProps): JSX.Element;
 export declare namespace NotFound {
     var displayName: string;

package/dist/types/components/RouteView/components.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../../src/components/RouteView/components.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACzD,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAIpC,eAAO,MAAM,YAAY,eAA4B,CAAC;AAEtD,eAAO,MAAM,gBAAgB,eAA+B,CAAC;AAE7D,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,OAAO,YAAY,CAAC;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,cAAc;IAC7B,MAAM,EAAE,OAAO,gBAAgB,CAAC;IAChC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG,cAAc,CAAC;AAE3D,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,GAAG,GAAG,CAAC,OAAO,CAepD;yBAfe,KAAK;;;AAmBrB,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,GAAG,CAAC,OAAO,CAU1D;yBAVe,QAAQ"}
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../../src/components/RouteView/components.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAIpC,eAAO,MAAM,YAAY,eAA4B,CAAC;AAEtD,eAAO,MAAM,WAAW,eAA2B,CAAC;AAEpD,eAAO,MAAM,gBAAgB,eAA+B,CAAC;AAE7D,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,OAAO,YAAY,CAAC;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,UAAU;IACzB,MAAM,EAAE,OAAO,WAAW,CAAC;IAC3B,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,cAAc;IAC7B,MAAM,EAAE,OAAO,gBAAgB,CAAC;IAChC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG,UAAU,GAAG,cAAc,CAAC;AAExE,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,GAAG,GAAG,CAAC,OAAO,CAepD;yBAfe,KAAK;;;AAmBrB,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,GAAG,GAAG,CAAC,OAAO,CAWlD;yBAXe,IAAI;;;AAepB,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,GAAG,CAAC,OAAO,CAU1D;yBAVe,QAAQ"}

package/dist/types/components/RouteView/helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../src/components/RouteView/helpers.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAGV,eAAe,EAChB,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAEpC,wBAAgB,cAAc,CAC5B,SAAS,EAAE,MAAM,EACjB,eAAe,EAAE,MAAM,EACvB,KAAK,EAAE,OAAO,GACb,OAAO,CAMT;AAoBD,wBAAgB,eAAe,CAC7B,QAAQ,EAAE,OAAO,EACjB,MAAM,EAAE,eAAe,EAAE,GACxB,IAAI,CAgBN;AAED,wBAAgB,eAAe,CAC7B,QAAQ,EAAE,eAAe,EAAE,EAC3B,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,MAAM,GACf,GAAG,CAAC,OAAO,EAAE,CAyCf"}
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../src/components/RouteView/helpers.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAGV,eAAe,EAEhB,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAEpC,wBAAgB,cAAc,CAC5B,SAAS,EAAE,MAAM,EACjB,eAAe,EAAE,MAAM,EACvB,KAAK,EAAE,OAAO,GACb,OAAO,CAMT;AA6BD,wBAAgB,eAAe,CAC7B,QAAQ,EAAE,OAAO,EACjB,MAAM,EAAE,eAAe,EAAE,GACxB,IAAI,CAoBN;AAqCD,wBAAgB,eAAe,CAC7B,QAAQ,EAAE,eAAe,EAAE,EAC3B,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,MAAM,GACf,GAAG,CAAC,OAAO,EAAE,CAsCf"}

package/dist/types/components/RouteView/index.d.ts

@@ -1,3 +1,3 @@
 export { RouteView } from "./RouteView";
-export type { RouteViewProps, RouteViewMatchProps, RouteViewNotFoundProps, } from "./RouteView";
+export type { RouteViewProps, RouteViewMatchProps, RouteViewSelfProps, RouteViewNotFoundProps, } from "./RouteView";
 //# sourceMappingURL=index.d.ts.map

package/dist/types/components/RouteView/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/RouteView/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,YAAY,EACV,cAAc,EACd,mBAAmB,EACnB,sBAAsB,GACvB,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/RouteView/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,YAAY,EACV,cAAc,EACd,mBAAmB,EACnB,kBAAkB,EAClB,sBAAsB,GACvB,MAAM,aAAa,CAAC"}

package/dist/types/components/RouteView/types.d.ts

@@ -9,6 +9,12 @@ export interface MatchProps {
     readonly fallback?: JSX.Element;
     readonly children: JSX.Element;
 }
+export interface SelfProps {
+    /** Fallback content while children are suspended. */
+    readonly fallback?: JSX.Element;
+    /** Content to render when the active route name equals the parent RouteView's nodeName. */
+    readonly children: JSX.Element;
+}
 export interface NotFoundProps {
     readonly children: JSX.Element;
 }

package/dist/types/components/RouteView/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/RouteView/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAEpC,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CAChC;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAChC,QAAQ,CAAC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CAChC;AAED,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CAChC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/RouteView/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAEpC,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CAChC;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAChC,QAAQ,CAAC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CAChC;AAED,MAAM,WAAW,SAAS;IACxB,qDAAqD;IACrD,QAAQ,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAChC,2FAA2F;IAC3F,QAAQ,CAAC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CAChC;AAED,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CAChC"}

package/dist/types/dom-utils/direction-tracker.d.ts

@@ -0,0 +1,27 @@
+import type { Router } from "@real-router/core";
+export interface DirectionTracker {
+    destroy: () => void;
+}
+/**
+ * Track navigation direction (forward / back) and write it to
+ * `<html data-nav-direction>` on every leave. CSS / JS readers consume
+ * the attribute via `html[data-nav-direction="back"]` selectors or
+ * `document.documentElement.dataset.navDirection`.
+ *
+ * Mechanism-agnostic — works identically whether downstream UI uses CSS
+ * `@keyframes`, View Transitions pseudo-elements, or library state
+ * (motion's `motion.div initial={{ x: ... }}`).
+ *
+ * Implementation:
+ *   - On install, set `data-nav-direction="forward"` baseline.
+ *   - Attach a `popstate` listener that flips an internal flag to
+ *     `true`. Browser back/forward navigation triggers popstate; user
+ *     clicks on `<Link>` / programmatic `router.navigate(...)` do not.
+ *   - On every `subscribeLeave`, write
+ *     `popstateFlag ? "back" : "forward"` and reset the flag.
+ *
+ * Returns `{ destroy }` to clean up the listener and clear the dataset
+ * attribute.
+ */
+export declare function createDirectionTracker(router: Router): DirectionTracker;
+//# sourceMappingURL=direction-tracker.d.ts.map

package/dist/types/dom-utils/direction-tracker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"direction-tracker.d.ts","sourceRoot":"","sources":["../../../src/dom-utils/direction-tracker.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAEhD,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAQD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,MAAM,GAAG,gBAAgB,CAoCvE"}