| 1 | /**
|
| 2 | * @license
|
| 3 | * Copyright 2019 Google LLC
|
| 4 | * SPDX-License-Identifier: BSD-3-Clause
|
| 5 | */
|
| 6 | import type { TemplateResult } from './lit-html.js';
|
| 7 | import { RenderOptions } from './lit-html.js';
|
| 8 | /**
|
| 9 | * hydrate() operates on a container with server-side rendered content and
|
| 10 | * restores the client side data structures needed for lit-html updates such as
|
| 11 | * TemplateInstances and Parts. After calling `hydrate`, lit-html will behave as
|
| 12 | * if it initially rendered the DOM, and any subsequent updates will update
|
| 13 | * efficiently, the same as if lit-html had rendered the DOM on the client.
|
| 14 | *
|
| 15 | * hydrate() must be called on DOM that adheres the to lit-ssr structure for
|
| 16 | * parts. ChildParts must be represented with both a start and end comment
|
| 17 | * marker, and ChildParts that contain a TemplateInstance must have the template
|
| 18 | * digest written into the comment data.
|
| 19 | *
|
| 20 | * Since render() encloses its output in a ChildPart, there must always be a root
|
| 21 | * ChildPart.
|
| 22 | *
|
| 23 | * Example (using for # ... for annotations in HTML)
|
| 24 | *
|
| 25 | * Given this input:
|
| 26 | *
|
| 27 | * html`<div class=${x}>${y}</div>`
|
| 28 | *
|
| 29 | * The SSR DOM is:
|
| 30 | *
|
| 31 | * <!--lit-part AEmR7W+R0Ak=--> # Start marker for the root ChildPart created
|
| 32 | * # by render(). Includes the digest of the
|
| 33 | * # template
|
| 34 | * <div class="TEST_X">
|
| 35 | * <!--lit-node 0--> # Indicates there are attribute bindings here
|
| 36 | * # The number is the depth-first index of the parent
|
| 37 | * # node in the template.
|
| 38 | * <!--lit-part--> # Start marker for the ${x} expression
|
| 39 | * TEST_Y
|
| 40 | * <!--/lit-part--> # End marker for the ${x} expression
|
| 41 | * </div>
|
| 42 | *
|
| 43 | * <!--/lit-part--> # End marker for the root ChildPart
|
| 44 | *
|
| 45 | * @param rootValue
|
| 46 | * @param container
|
| 47 | * @param userOptions
|
| 48 | */
|
| 49 | export declare const hydrate: (rootValue: unknown, container: Element | DocumentFragment, options?: Partial<RenderOptions>) => void;
|
| 50 | export declare const digestForTemplateResult: (templateResult: TemplateResult) => string;
|
| 51 | //# sourceMappingURL=experimental-hydrate.d.ts.map |
| \ | No newline at end of file |