*page / n-page

Summary

*page marks an element as a navigation target inside the current Sercrod host. The value is evaluated as a Sercrod expression and compared with the final target received from the navigation adapter.

*page is the page side of Navigate Pager. It is not a router entry, id, hash, CSS selector, or public data-* API.

Routing discipline

Use *page with an explicit *navigate target in the same host. It does not parse route parameters, authorize access, redirect, or own application loading policy. Keep those decisions in explicit application logic; ordinary and external navigation remain platform concerns.

The normative routing boundary is docs/spec/navigation-adapter-design.md.

Basic example

<serc-rod>
  <button type="button" *navigate="'/spa/home.html'">Home</button>
  <button type="button" *navigate="'/spa/a.html'">A</button>

  <section *page="'/spa/home.html'"></section>
  <section *page="'/spa/a.html'"></section>
</serc-rod>

In this form, each *page value is a navigation target. When the current target is /spa/a.html, the matching page becomes active and the other pages in the same host become inactive.

Lazy partial loading

A URL-like *page value can also be used as the partial HTML source:

<section *page="'/spa/settings/profile.html'"></section>

The partial is not fetched during initial registration. It is fetched only when that target first becomes active. After the HTML is inserted, Sercrod processes that inserted scope synchronously through the normal render path. Later visits reuse the already loaded content.

Partial files are fragments. They do not need doctype, html, head, body, or a nested serc-rod.

View Transitions

Handled page activation uses document.startViewTransition() when the browser supports it and navigation view transitions are enabled. Sercrod wraps the page visibility change and the first partial insertion in the transition update callback, then continues through the same activation path.

This is a progressive enhancement. Sercrod skips it and uses the normal path when the API is unavailable, the user prefers reduced motion, the host has no-view-transition or n-no-view-transition, configuration sets window.__Sercrod.config.navigation.view_transitions = false, the host is doing initial activation, or the requested target is already current.

Lazy load timeout

By default, lazy partial loading does not add its own timeout. It follows the browser fetch() behavior or an adapter-provided abort signal.

Set window.__Sercrod.config.navigation.page_timeout or pageTimeout to a positive millisecond value to abort lazy *page partial fetches after that duration. 0, negative values, missing values, and invalid values preserve the default no-timeout behavior.

Behavior

• *page and n-page are aliases.
• The value is evaluated as an expression; use quoted string values such as *page="'/spa/a.html'".
• Duplicate targets warn. The first matching page wins.
• Inactive pages are hidden.
• *import keeps its existing behavior and is not the Navigate Pager lazy-load mechanism.

Boundary

*page only reacts to a target that the navigation adapter gives to the host. It does not inspect href, element id, hash fragments, or CSS selectors.

Sercrod does not own route matching, route params, redirects, nested route layouts, or application history. Those belong to the browser, Capacitor, or a project navigation adapter.