Lit UI Router

lit-ui-router-ssr / uiViewSlot

Variable: uiViewSlot ​

ts
const uiViewSlot: typeof renderLight;

Defined in: packages/lit-ui-router-ssr/src/client.ts:173

The hole a <ui-view> fills, written at the use site.

On the server @lit-labs/ssr reaches the renderer's renderLight() only through this directive in the element's child part, so the routed markup goes where the template puts it. On the client it wakes the <ui-view> it sits in — the enclosing template hydrating is what reaches the directive, parent template first — and resolves to noChange, so the walk reads past the interior the server prefixed and a later render of that template leaves the view's own nodes alone. A view holding a served pair is also pinned to hydrateRoot's adopter, so a view the app detaches before its own update — which sleeps until it is attached again — is adopted on its return; the pin answers for that one view, once, and comes off. On a cold render there is no pair to adopt and no attribute to remove.

Example ​

ts
html`<ui-router .uiRouter=${router}><ui-view>${uiViewSlot()}</ui-view></ui-router>`;