@rxdi/lit-html 0.7.157 → 0.7.159

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (95) hide show
  1. package/dist/async.d.ts +3 -3
  2. package/dist/async.js +4 -4
  3. package/dist/decorators/component.decorator.d.ts +1 -2
  4. package/dist/decorators/component.decorator.js +3 -3
  5. package/dist/index.d.ts +28 -17
  6. package/dist/index.js +28 -17
  7. package/package.json +4 -2
  8. package/dist/lit-element/decorators.d.ts +0 -14
  9. package/dist/lit-element/decorators.js +0 -32
  10. package/dist/lit-element/experimental-hydrate-support.d.ts +0 -6
  11. package/dist/lit-element/experimental-hydrate-support.js +0 -65
  12. package/dist/lit-element/index.d.ts +0 -7
  13. package/dist/lit-element/index.js +0 -25
  14. package/dist/lit-element/lit-element.d.ts +0 -157
  15. package/dist/lit-element/lit-element.js +0 -258
  16. package/dist/lit-element/polyfill-support.d.ts +0 -24
  17. package/dist/lit-element/polyfill-support.js +0 -58
  18. package/dist/lit-element/private-ssr-support.d.ts +0 -21
  19. package/dist/lit-element/private-ssr-support.js +0 -25
  20. package/dist/lit-html/async-directive.d.ts +0 -170
  21. package/dist/lit-html/async-directive.js +0 -250
  22. package/dist/lit-html/directive-helpers.d.ts +0 -105
  23. package/dist/lit-html/directive-helpers.js +0 -192
  24. package/dist/lit-html/directive.d.ts +0 -65
  25. package/dist/lit-html/directive.js +0 -52
  26. package/dist/lit-html/directives/async-append.d.ts +0 -38
  27. package/dist/lit-html/directives/async-append.js +0 -55
  28. package/dist/lit-html/directives/async-replace.d.ts +0 -39
  29. package/dist/lit-html/directives/async-replace.js +0 -112
  30. package/dist/lit-html/directives/cache.d.ts +0 -34
  31. package/dist/lit-html/directives/cache.js +0 -80
  32. package/dist/lit-html/directives/class-map.d.ts +0 -44
  33. package/dist/lit-html/directives/class-map.js +0 -92
  34. package/dist/lit-html/directives/guard.d.ts +0 -59
  35. package/dist/lit-html/directives/guard.js +0 -82
  36. package/dist/lit-html/directives/if-defined.d.ts +0 -13
  37. package/dist/lit-html/directives/if-defined.js +0 -17
  38. package/dist/lit-html/directives/live.d.ts +0 -42
  39. package/dist/lit-html/directives/live.js +0 -79
  40. package/dist/lit-html/directives/private-async-helpers.d.ts +0 -57
  41. package/dist/lit-html/directives/private-async-helpers.js +0 -117
  42. package/dist/lit-html/directives/ref.d.ts +0 -65
  43. package/dist/lit-html/directives/ref.js +0 -113
  44. package/dist/lit-html/directives/repeat.d.ts +0 -63
  45. package/dist/lit-html/directives/repeat.js +0 -416
  46. package/dist/lit-html/directives/style-map.d.ts +0 -46
  47. package/dist/lit-html/directives/style-map.js +0 -102
  48. package/dist/lit-html/directives/template-content.d.ts +0 -25
  49. package/dist/lit-html/directives/template-content.js +0 -33
  50. package/dist/lit-html/directives/unsafe-html.d.ts +0 -26
  51. package/dist/lit-html/directives/unsafe-html.js +0 -64
  52. package/dist/lit-html/directives/unsafe-svg.d.ts +0 -26
  53. package/dist/lit-html/directives/unsafe-svg.js +0 -26
  54. package/dist/lit-html/directives/until.d.ts +0 -43
  55. package/dist/lit-html/directives/until.js +0 -137
  56. package/dist/lit-html/experimental-hydrate.d.ts +0 -50
  57. package/dist/lit-html/experimental-hydrate.js +0 -322
  58. package/dist/lit-html/lit-html.d.ts +0 -335
  59. package/dist/lit-html/lit-html.js +0 -1259
  60. package/dist/lit-html/polyfill-support.d.ts +0 -67
  61. package/dist/lit-html/polyfill-support.js +0 -185
  62. package/dist/lit-html/private-ssr-support.d.ts +0 -52
  63. package/dist/lit-html/private-ssr-support.js +0 -54
  64. package/dist/lit-html/static.d.ts +0 -58
  65. package/dist/lit-html/static.js +0 -114
  66. package/dist/reactive-element/css-tag.d.ts +0 -64
  67. package/dist/reactive-element/css-tag.js +0 -125
  68. package/dist/reactive-element/decorators/base.d.ts +0 -47
  69. package/dist/reactive-element/decorators/base.js +0 -70
  70. package/dist/reactive-element/decorators/custom-element.d.ts +0 -26
  71. package/dist/reactive-element/decorators/custom-element.js +0 -47
  72. package/dist/reactive-element/decorators/event-options.d.ts +0 -37
  73. package/dist/reactive-element/decorators/event-options.js +0 -47
  74. package/dist/reactive-element/decorators/index.d.ts +0 -14
  75. package/dist/reactive-element/decorators/index.js +0 -32
  76. package/dist/reactive-element/decorators/property.d.ts +0 -40
  77. package/dist/reactive-element/decorators/property.js +0 -92
  78. package/dist/reactive-element/decorators/query-all.d.ts +0 -31
  79. package/dist/reactive-element/decorators/query-all.js +0 -46
  80. package/dist/reactive-element/decorators/query-assigned-nodes.d.ts +0 -33
  81. package/dist/reactive-element/decorators/query-assigned-nodes.js +0 -55
  82. package/dist/reactive-element/decorators/query-async.d.ts +0 -39
  83. package/dist/reactive-element/decorators/query-async.js +0 -71
  84. package/dist/reactive-element/decorators/query.d.ts +0 -32
  85. package/dist/reactive-element/decorators/query.js +0 -60
  86. package/dist/reactive-element/decorators/state.d.ts +0 -24
  87. package/dist/reactive-element/decorators/state.js +0 -29
  88. package/dist/reactive-element/index.d.ts +0 -5
  89. package/dist/reactive-element/index.js +0 -17
  90. package/dist/reactive-element/polyfill-support.d.ts +0 -40
  91. package/dist/reactive-element/polyfill-support.js +0 -89
  92. package/dist/reactive-element/reactive-controller.d.ts +0 -76
  93. package/dist/reactive-element/reactive-controller.js +0 -7
  94. package/dist/reactive-element/reactive-element.d.ts +0 -653
  95. package/dist/reactive-element/reactive-element.js +0 -979
@@ -1,64 +0,0 @@
1
- "use strict";
2
- /**
3
- * @license
4
- * Copyright 2017 Google LLC
5
- * SPDX-License-Identifier: BSD-3-Clause
6
- */
7
- Object.defineProperty(exports, "__esModule", { value: true });
8
- exports.unsafeHTML = exports.UnsafeHTMLDirective = void 0;
9
- const lit_html_1 = require("../lit-html");
10
- const directive_1 = require("../directive");
11
- const HTML_RESULT = 1;
12
- class UnsafeHTMLDirective extends directive_1.Directive {
13
- constructor(partInfo) {
14
- super(partInfo);
15
- this._value = lit_html_1.nothing;
16
- if (partInfo.type !== directive_1.PartType.CHILD) {
17
- throw new Error(`${this.constructor.directiveName}() can only be used in child bindings`);
18
- }
19
- }
20
- render(value) {
21
- if (value === lit_html_1.nothing || value == null) {
22
- this._templateResult = undefined;
23
- return (this._value = value);
24
- }
25
- if (value === lit_html_1.noChange) {
26
- return value;
27
- }
28
- if (typeof value != 'string') {
29
- throw new Error(`${this.constructor.directiveName}() called with a non-string value`);
30
- }
31
- if (value === this._value) {
32
- return this._templateResult;
33
- }
34
- this._value = value;
35
- const strings = [value];
36
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
37
- strings.raw = strings;
38
- // WARNING: impersonating a TemplateResult like this is extremely
39
- // dangerous. Third-party directives should not do this.
40
- return (this._templateResult = {
41
- // Cast to a known set of integers that satisfy ResultType so that we
42
- // don't have to export ResultType and possibly encourage this pattern.
43
- // This property needs to remain unminified.
44
- ['_$litType$']: this.constructor
45
- .resultType,
46
- strings,
47
- values: [],
48
- });
49
- }
50
- }
51
- exports.UnsafeHTMLDirective = UnsafeHTMLDirective;
52
- UnsafeHTMLDirective.directiveName = 'unsafeHTML';
53
- UnsafeHTMLDirective.resultType = HTML_RESULT;
54
- /**
55
- * Renders the result as HTML, rather than text.
56
- *
57
- * The values `undefined`, `null`, and `nothing`, will all result in no content
58
- * (empty string) being rendered.
59
- *
60
- * Note, this is unsafe to use with any user-provided input that hasn't been
61
- * sanitized or escaped, as it may lead to cross-site-scripting
62
- * vulnerabilities.
63
- */
64
- exports.unsafeHTML = (0, directive_1.directive)(UnsafeHTMLDirective);
@@ -1,26 +0,0 @@
1
- /**
2
- * @license
3
- * Copyright 2017 Google LLC
4
- * SPDX-License-Identifier: BSD-3-Clause
5
- */
6
- import { UnsafeHTMLDirective } from './unsafe-html';
7
- declare class UnsafeSVGDirective extends UnsafeHTMLDirective {
8
- static directiveName: string;
9
- static resultType: number;
10
- }
11
- /**
12
- * Renders the result as SVG, rather than text.
13
- *
14
- * The values `undefined`, `null`, and `nothing`, will all result in no content
15
- * (empty string) being rendered.
16
- *
17
- * Note, this is unsafe to use with any user-provided input that hasn't been
18
- * sanitized or escaped, as it may lead to cross-site-scripting
19
- * vulnerabilities.
20
- */
21
- export declare const unsafeSVG: (value: string | typeof import("../lit-html").noChange | typeof import("../lit-html").nothing) => import("../directive").DirectiveResult<typeof UnsafeSVGDirective>;
22
- /**
23
- * The type of the class that powers this directive. Necessary for naming the
24
- * directive's return type.
25
- */
26
- export type { UnsafeSVGDirective };
@@ -1,26 +0,0 @@
1
- "use strict";
2
- /**
3
- * @license
4
- * Copyright 2017 Google LLC
5
- * SPDX-License-Identifier: BSD-3-Clause
6
- */
7
- Object.defineProperty(exports, "__esModule", { value: true });
8
- exports.unsafeSVG = void 0;
9
- const directive_1 = require("../directive");
10
- const unsafe_html_1 = require("./unsafe-html");
11
- const SVG_RESULT = 2;
12
- class UnsafeSVGDirective extends unsafe_html_1.UnsafeHTMLDirective {
13
- }
14
- UnsafeSVGDirective.directiveName = 'unsafeSVG';
15
- UnsafeSVGDirective.resultType = SVG_RESULT;
16
- /**
17
- * Renders the result as SVG, rather than text.
18
- *
19
- * The values `undefined`, `null`, and `nothing`, will all result in no content
20
- * (empty string) being rendered.
21
- *
22
- * Note, this is unsafe to use with any user-provided input that hasn't been
23
- * sanitized or escaped, as it may lead to cross-site-scripting
24
- * vulnerabilities.
25
- */
26
- exports.unsafeSVG = (0, directive_1.directive)(UnsafeSVGDirective);
@@ -1,43 +0,0 @@
1
- /**
2
- * @license
3
- * Copyright 2017 Google LLC
4
- * SPDX-License-Identifier: BSD-3-Clause
5
- */
6
- import { Part } from '../lit-html';
7
- import { AsyncDirective } from '../async-directive';
8
- export declare class UntilDirective extends AsyncDirective {
9
- private __lastRenderedIndex;
10
- private __values;
11
- private __weakThis;
12
- private __pauser;
13
- render(...args: Array<unknown>): unknown;
14
- update(_part: Part, args: Array<unknown>): unknown;
15
- disconnected(): void;
16
- reconnected(): void;
17
- }
18
- /**
19
- * Renders one of a series of values, including Promises, to a Part.
20
- *
21
- * Values are rendered in priority order, with the first argument having the
22
- * highest priority and the last argument having the lowest priority. If a
23
- * value is a Promise, low-priority values will be rendered until it resolves.
24
- *
25
- * The priority of values can be used to create placeholder content for async
26
- * data. For example, a Promise with pending content can be the first,
27
- * highest-priority, argument, and a non_promise loading indicator template can
28
- * be used as the second, lower-priority, argument. The loading indicator will
29
- * render immediately, and the primary content will render when the Promise
30
- * resolves.
31
- *
32
- * Example:
33
- *
34
- * ```js
35
- * const content = fetch('./content.txt').then(r => r.text());
36
- * html`${until(content, html`<span>Loading...</span>`)}`
37
- * ```
38
- */
39
- export declare const until: (...values: unknown[]) => import("../directive").DirectiveResult<typeof UntilDirective>;
40
- /**
41
- * The type of the class that powers this directive. Necessary for naming the
42
- * directive's return type.
43
- */
@@ -1,137 +0,0 @@
1
- "use strict";
2
- /**
3
- * @license
4
- * Copyright 2017 Google LLC
5
- * SPDX-License-Identifier: BSD-3-Clause
6
- */
7
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
8
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
9
- return new (P || (P = Promise))(function (resolve, reject) {
10
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
11
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
12
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
13
- step((generator = generator.apply(thisArg, _arguments || [])).next());
14
- });
15
- };
16
- Object.defineProperty(exports, "__esModule", { value: true });
17
- exports.until = exports.UntilDirective = void 0;
18
- const lit_html_1 = require("../lit-html");
19
- const directive_1 = require("../directive");
20
- const directive_helpers_1 = require("../directive-helpers");
21
- const async_directive_1 = require("../async-directive");
22
- const private_async_helpers_1 = require("./private-async-helpers");
23
- const isPromise = (x) => {
24
- return !(0, directive_helpers_1.isPrimitive)(x) && typeof x.then === 'function';
25
- };
26
- // Effectively infinity, but a SMI.
27
- const _infinity = 0x3fffffff;
28
- class UntilDirective extends async_directive_1.AsyncDirective {
29
- constructor() {
30
- super(...arguments);
31
- this.__lastRenderedIndex = _infinity;
32
- this.__values = [];
33
- this.__weakThis = new private_async_helpers_1.PseudoWeakRef(this);
34
- this.__pauser = new private_async_helpers_1.Pauser();
35
- }
36
- render(...args) {
37
- var _a;
38
- return (_a = args.find((x) => !isPromise(x))) !== null && _a !== void 0 ? _a : lit_html_1.noChange;
39
- }
40
- update(_part, args) {
41
- const previousValues = this.__values;
42
- let previousLength = previousValues.length;
43
- this.__values = args;
44
- const weakThis = this.__weakThis;
45
- const pauser = this.__pauser;
46
- // If our initial render occurs while disconnected, ensure that the pauser
47
- // and weakThis are in the disconnected state
48
- if (!this.isConnected) {
49
- this.disconnected();
50
- }
51
- for (let i = 0; i < args.length; i++) {
52
- // If we've rendered a higher-priority value already, stop.
53
- if (i > this.__lastRenderedIndex) {
54
- break;
55
- }
56
- const value = args[i];
57
- // Render non-Promise values immediately
58
- if (!isPromise(value)) {
59
- this.__lastRenderedIndex = i;
60
- // Since a lower-priority value will never overwrite a higher-priority
61
- // synchronous value, we can stop processing now.
62
- return value;
63
- }
64
- // If this is a Promise we've already handled, skip it.
65
- if (i < previousLength && value === previousValues[i]) {
66
- continue;
67
- }
68
- // We have a Promise that we haven't seen before, so priorities may have
69
- // changed. Forget what we rendered before.
70
- this.__lastRenderedIndex = _infinity;
71
- previousLength = 0;
72
- // Note, the callback avoids closing over `this` so that the directive
73
- // can be gc'ed before the promise resolves; instead `this` is retrieved
74
- // from `weakThis`, which can break the hard reference in the closure when
75
- // the directive disconnects
76
- Promise.resolve(value).then((result) => __awaiter(this, void 0, void 0, function* () {
77
- // If we're disconnected, wait until we're (maybe) reconnected
78
- // The while loop here handles the case that the connection state
79
- // thrashes, causing the pauser to resume and then get re-paused
80
- while (pauser.get()) {
81
- yield pauser.get();
82
- }
83
- // If the callback gets here and there is no `this`, it means that the
84
- // directive has been disconnected and garbage collected and we don't
85
- // need to do anything else
86
- const _this = weakThis.deref();
87
- if (_this !== undefined) {
88
- const index = _this.__values.indexOf(value);
89
- // If state.values doesn't contain the value, we've re-rendered without
90
- // the value, so don't render it. Then, only render if the value is
91
- // higher-priority than what's already been rendered.
92
- if (index > -1 && index < _this.__lastRenderedIndex) {
93
- _this.__lastRenderedIndex = index;
94
- _this.setValue(result);
95
- }
96
- }
97
- }));
98
- }
99
- return lit_html_1.noChange;
100
- }
101
- disconnected() {
102
- this.__weakThis.disconnect();
103
- this.__pauser.pause();
104
- }
105
- reconnected() {
106
- this.__weakThis.reconnect(this);
107
- this.__pauser.resume();
108
- }
109
- }
110
- exports.UntilDirective = UntilDirective;
111
- /**
112
- * Renders one of a series of values, including Promises, to a Part.
113
- *
114
- * Values are rendered in priority order, with the first argument having the
115
- * highest priority and the last argument having the lowest priority. If a
116
- * value is a Promise, low-priority values will be rendered until it resolves.
117
- *
118
- * The priority of values can be used to create placeholder content for async
119
- * data. For example, a Promise with pending content can be the first,
120
- * highest-priority, argument, and a non_promise loading indicator template can
121
- * be used as the second, lower-priority, argument. The loading indicator will
122
- * render immediately, and the primary content will render when the Promise
123
- * resolves.
124
- *
125
- * Example:
126
- *
127
- * ```js
128
- * const content = fetch('./content.txt').then(r => r.text());
129
- * html`${until(content, html`<span>Loading...</span>`)}`
130
- * ```
131
- */
132
- exports.until = (0, directive_1.directive)(UntilDirective);
133
- /**
134
- * The type of the class that powers this directive. Necessary for naming the
135
- * directive's return type.
136
- */
137
- // export type {UntilDirective};
@@ -1,50 +0,0 @@
1
- /**
2
- * @license
3
- * Copyright 2019 Google LLC
4
- * SPDX-License-Identifier: BSD-3-Clause
5
- */
6
- import type { TemplateResult } from './lit-html';
7
- import { RenderOptions } from './lit-html';
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;
@@ -1,322 +0,0 @@
1
- "use strict";
2
- /**
3
- * @license
4
- * Copyright 2019 Google LLC
5
- * SPDX-License-Identifier: BSD-3-Clause
6
- */
7
- Object.defineProperty(exports, "__esModule", { value: true });
8
- exports.digestForTemplateResult = exports.hydrate = void 0;
9
- const lit_html_1 = require("./lit-html");
10
- const directive_1 = require("./directive");
11
- const directive_helpers_1 = require("./directive-helpers");
12
- const { _TemplateInstance: TemplateInstance, _isIterable: isIterable, _resolveDirective: resolveDirective, _ChildPart: ChildPart, _ElementPart: ElementPart, } = lit_html_1._$LH;
13
- /**
14
- * hydrate() operates on a container with server-side rendered content and
15
- * restores the client side data structures needed for lit-html updates such as
16
- * TemplateInstances and Parts. After calling `hydrate`, lit-html will behave as
17
- * if it initially rendered the DOM, and any subsequent updates will update
18
- * efficiently, the same as if lit-html had rendered the DOM on the client.
19
- *
20
- * hydrate() must be called on DOM that adheres the to lit-ssr structure for
21
- * parts. ChildParts must be represented with both a start and end comment
22
- * marker, and ChildParts that contain a TemplateInstance must have the template
23
- * digest written into the comment data.
24
- *
25
- * Since render() encloses its output in a ChildPart, there must always be a root
26
- * ChildPart.
27
- *
28
- * Example (using for # ... for annotations in HTML)
29
- *
30
- * Given this input:
31
- *
32
- * html`<div class=${x}>${y}</div>`
33
- *
34
- * The SSR DOM is:
35
- *
36
- * <!--lit-part AEmR7W+R0Ak=--> # Start marker for the root ChildPart created
37
- * # by render(). Includes the digest of the
38
- * # template
39
- * <div class="TEST_X">
40
- * <!--lit-node 0--> # Indicates there are attribute bindings here
41
- * # The number is the depth-first index of the parent
42
- * # node in the template.
43
- * <!--lit-part--> # Start marker for the ${x} expression
44
- * TEST_Y
45
- * <!--/lit-part--> # End marker for the ${x} expression
46
- * </div>
47
- *
48
- * <!--/lit-part--> # End marker for the root ChildPart
49
- *
50
- * @param rootValue
51
- * @param container
52
- * @param userOptions
53
- */
54
- const hydrate = (rootValue, container, options = {}) => {
55
- // TODO(kschaaf): Do we need a helper for _$litPart$ ("part for node")?
56
- // This property needs to remain unminified.
57
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
58
- if (container['_$litPart$'] !== undefined) {
59
- throw new Error('container already contains a live render');
60
- }
61
- // Since render() creates a ChildPart to render into, we'll always have
62
- // exactly one root part. We need to hold a reference to it so we can set
63
- // it in the parts cache.
64
- let rootPart = undefined;
65
- // When we are in-between ChildPart markers, this is the current ChildPart.
66
- // It's needed to be able to set the ChildPart's endNode when we see a
67
- // close marker
68
- let currentChildPart = undefined;
69
- // Used to remember parent template state as we recurse into nested
70
- // templates
71
- const stack = [];
72
- const walker = document.createTreeWalker(container, NodeFilter.SHOW_COMMENT, null, false);
73
- let marker;
74
- // Walk the DOM looking for part marker comments
75
- while ((marker = walker.nextNode()) !== null) {
76
- const markerText = marker.data;
77
- if (markerText.startsWith('lit-part')) {
78
- if (stack.length === 0 && rootPart !== undefined) {
79
- throw new Error('there must be only one root part per container');
80
- }
81
- // Create a new ChildPart and push it onto the stack
82
- currentChildPart = openChildPart(rootValue, marker, stack, options);
83
- rootPart !== null && rootPart !== void 0 ? rootPart : (rootPart = currentChildPart);
84
- }
85
- else if (markerText.startsWith('lit-node')) {
86
- // Create and hydrate attribute parts into the current ChildPart on the
87
- // stack
88
- createAttributeParts(marker, stack, options);
89
- // Remove `defer-hydration` attribute, if any
90
- const parent = marker.parentElement;
91
- if (parent.hasAttribute('defer-hydration')) {
92
- parent.removeAttribute('defer-hydration');
93
- }
94
- }
95
- else if (markerText.startsWith('/lit-part')) {
96
- // Close the current ChildPart, and pop the previous one off the stack
97
- if (stack.length === 1 && currentChildPart !== rootPart) {
98
- throw new Error('internal error');
99
- }
100
- currentChildPart = closeChildPart(marker, currentChildPart, stack);
101
- }
102
- }
103
- console.assert(rootPart !== undefined, 'there should be exactly one root part in a render container');
104
- // This property needs to remain unminified.
105
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
106
- container['_$litPart$'] = rootPart;
107
- };
108
- exports.hydrate = hydrate;
109
- const openChildPart = (rootValue, marker, stack, options) => {
110
- let value;
111
- // We know the startNode now. We'll know the endNode when we get to
112
- // the matching marker and set it in closeChildPart()
113
- // TODO(kschaaf): Current constructor takes both nodes
114
- let part;
115
- if (stack.length === 0) {
116
- part = new ChildPart(marker, null, undefined, options);
117
- value = rootValue;
118
- }
119
- else {
120
- const state = stack[stack.length - 1];
121
- if (state.type === 'template-instance') {
122
- part = new ChildPart(marker, null, state.instance, options);
123
- state.instance._parts.push(part);
124
- value = state.result.values[state.instancePartIndex++];
125
- state.templatePartIndex++;
126
- }
127
- else if (state.type === 'iterable') {
128
- part = new ChildPart(marker, null, state.part, options);
129
- const result = state.iterator.next();
130
- if (result.done) {
131
- value = undefined;
132
- state.done = true;
133
- throw new Error('Unhandled shorter than expected iterable');
134
- }
135
- else {
136
- value = result.value;
137
- }
138
- state.part._$committedValue.push(part);
139
- }
140
- else {
141
- // state.type === 'leaf'
142
- // TODO(kschaaf): This is unexpected, and likely a result of a primitive
143
- // been rendered on the client when a TemplateResult was rendered on the
144
- // server; this part will be hydrated but not used. We can detect it, but
145
- // we need to decide what to do in this case. Note that this part won't be
146
- // retained by any parent TemplateInstance, since a primitive had been
147
- // rendered in its place.
148
- // https://github.com/lit/lit/issues/1434
149
- // throw new Error('Hydration value mismatch: Found a TemplateInstance' +
150
- // 'where a leaf value was expected');
151
- part = new ChildPart(marker, null, state.part, options);
152
- }
153
- }
154
- // Initialize the ChildPart state depending on the type of value and push
155
- // it onto the stack. This logic closely follows the ChildPart commit()
156
- // cascade order:
157
- // 1. directive
158
- // 2. noChange
159
- // 3. primitive (note strings must be handled before iterables, since they
160
- // are iterable)
161
- // 4. TemplateResult
162
- // 5. Node (not yet implemented, but fallback handling is fine)
163
- // 6. Iterable
164
- // 7. nothing (handled in fallback)
165
- // 8. Fallback for everything else
166
- value = resolveDirective(part, value);
167
- if (value === lit_html_1.noChange) {
168
- stack.push({ part, type: 'leaf' });
169
- }
170
- else if ((0, directive_helpers_1.isPrimitive)(value)) {
171
- stack.push({ part, type: 'leaf' });
172
- part._$committedValue = value;
173
- // TODO(kschaaf): We can detect when a primitive is being hydrated on the
174
- // client where a TemplateResult was rendered on the server, but we need to
175
- // decide on a strategy for what to do next.
176
- // https://github.com/lit/lit/issues/1434
177
- // if (marker.data !== 'lit-part') {
178
- // throw new Error('Hydration value mismatch: Primitive found where TemplateResult expected');
179
- // }
180
- }
181
- else if ((0, directive_helpers_1.isTemplateResult)(value)) {
182
- // Check for a template result digest
183
- const markerWithDigest = `lit-part ${(0, exports.digestForTemplateResult)(value)}`;
184
- if (marker.data === markerWithDigest) {
185
- const template = ChildPart.prototype._$getTemplate(value);
186
- const instance = new TemplateInstance(template, part);
187
- stack.push({
188
- type: 'template-instance',
189
- instance,
190
- part,
191
- templatePartIndex: 0,
192
- instancePartIndex: 0,
193
- result: value,
194
- });
195
- // For TemplateResult values, we set the part value to the
196
- // generated TemplateInstance
197
- part._$committedValue = instance;
198
- }
199
- else {
200
- // TODO: if this isn't the server-rendered template, do we
201
- // need to stop hydrating this subtree? Clear it? Add tests.
202
- throw new Error('Hydration value mismatch: Unexpected TemplateResult rendered to part');
203
- }
204
- }
205
- else if (isIterable(value)) {
206
- // currentChildPart.value will contain an array of ChildParts
207
- stack.push({
208
- part: part,
209
- type: 'iterable',
210
- value,
211
- iterator: value[Symbol.iterator](),
212
- done: false,
213
- });
214
- part._$committedValue = [];
215
- }
216
- else {
217
- // Fallback for everything else (nothing, Objects, Functions,
218
- // etc.): we just initialize the part's value
219
- // Note that `Node` value types are not currently supported during
220
- // SSR, so that part of the cascade is missing.
221
- stack.push({ part: part, type: 'leaf' });
222
- part._$committedValue = value == null ? '' : value;
223
- }
224
- return part;
225
- };
226
- const closeChildPart = (marker, part, stack) => {
227
- if (part === undefined) {
228
- throw new Error('unbalanced part marker');
229
- }
230
- part._$endNode = marker;
231
- const currentState = stack.pop();
232
- if (currentState.type === 'iterable') {
233
- if (!currentState.iterator.next().done) {
234
- throw new Error('unexpected longer than expected iterable');
235
- }
236
- }
237
- if (stack.length > 0) {
238
- const state = stack[stack.length - 1];
239
- return state.part;
240
- }
241
- else {
242
- return undefined;
243
- }
244
- };
245
- const createAttributeParts = (comment, stack, options) => {
246
- var _a;
247
- // Get the nodeIndex from DOM. We're only using this for an integrity
248
- // check right now, we might not need it.
249
- const match = /lit-node (\d+)/.exec(comment.data);
250
- const nodeIndex = parseInt(match[1]);
251
- // For void elements, the node the comment was referring to will be
252
- // the previousSibling; for non-void elements, the comment is guaranteed
253
- // to be the first child of the element (i.e. it won't have a previousSibling
254
- // meaning it should use the parentElement)
255
- const node = (_a = comment.previousSibling) !== null && _a !== void 0 ? _a : comment.parentElement;
256
- const state = stack[stack.length - 1];
257
- if (state.type === 'template-instance') {
258
- const instance = state.instance;
259
- // eslint-disable-next-line no-constant-condition
260
- while (true) {
261
- // If the next template part is in attribute-position on the current node,
262
- // create the instance part for it and prime its state
263
- const templatePart = instance._$template.parts[state.templatePartIndex];
264
- if (templatePart === undefined ||
265
- (templatePart.type !== directive_1.PartType.ATTRIBUTE &&
266
- templatePart.type !== directive_1.PartType.ELEMENT) ||
267
- templatePart.index !== nodeIndex) {
268
- break;
269
- }
270
- if (templatePart.type === directive_1.PartType.ATTRIBUTE) {
271
- // The instance part is created based on the constructor saved in the
272
- // template part
273
- const instancePart = new templatePart.ctor(node, templatePart.name, templatePart.strings, state.instance, options);
274
- const value = (0, directive_helpers_1.isSingleExpression)(instancePart)
275
- ? state.result.values[state.instancePartIndex]
276
- : state.result.values;
277
- // Setting the attribute value primes committed value with the resolved
278
- // directive value; we only then commit that value for event/property
279
- // parts since those were not serialized, and pass `noCommit` for the
280
- // others to avoid perf impact of touching the DOM unnecessarily
281
- const noCommit = !(instancePart.type === directive_1.PartType.EVENT ||
282
- instancePart.type === directive_1.PartType.PROPERTY);
283
- instancePart._$setValue(value, instancePart, state.instancePartIndex, noCommit);
284
- state.instancePartIndex += templatePart.strings.length - 1;
285
- instance._parts.push(instancePart);
286
- }
287
- else {
288
- // templatePart.type === PartType.ELEMENT
289
- const instancePart = new ElementPart(node, state.instance, options);
290
- resolveDirective(instancePart, state.result.values[state.instancePartIndex++]);
291
- instance._parts.push(instancePart);
292
- }
293
- state.templatePartIndex++;
294
- }
295
- }
296
- else {
297
- throw new Error('internal error');
298
- }
299
- };
300
- // Number of 32 bit elements to use to create template digests
301
- const digestSize = 2;
302
- // We need to specify a digest to use across rendering environments. This is a
303
- // simple digest build from a DJB2-ish hash modified from:
304
- // https://github.com/darkskyapp/string-hash/blob/master/index
305
- // It has been changed to an array of hashes to add additional bits.
306
- // Goals:
307
- // - Extremely low collision rate. We may not be able to detect collisions.
308
- // - Extremely fast.
309
- // - Extremely small code size.
310
- // - Safe to include in HTML comment text or attribute value.
311
- // - Easily specifiable and implementable in multiple languages.
312
- // We don't care about cryptographic suitability.
313
- const digestForTemplateResult = (templateResult) => {
314
- const hashes = new Uint32Array(digestSize).fill(5381);
315
- for (const s of templateResult.strings) {
316
- for (let i = 0; i < s.length; i++) {
317
- hashes[i % digestSize] = (hashes[i % digestSize] * 33) ^ s.charCodeAt(i);
318
- }
319
- }
320
- return btoa(String.fromCharCode(...new Uint8Array(hashes.buffer)));
321
- };
322
- exports.digestForTemplateResult = digestForTemplateResult;