experimental-hydrate.d.ts 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  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