marko 5.23.0 → 5.25.0

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 (64) hide show
  1. package/dist/runtime/components/entry/index-browser.js +2 -6
  2. package/dist/runtime/components/registry/index-browser.js +444 -20
  3. package/dist/runtime/components/registry/index.js +1 -1
  4. package/dist/runtime/components/renderer.js +6 -5
  5. package/dist/runtime/components/update-manager.js +7 -7
  6. package/dist/runtime/components/util/index-browser.js +4 -4
  7. package/dist/runtime/components/util/index.js +2 -2
  8. package/dist/runtime/createOut.js +1 -1
  9. package/dist/runtime/dom-insert.js +4 -4
  10. package/dist/runtime/helpers/_change-case.js +2 -2
  11. package/dist/runtime/helpers/dynamic-tag.js +4 -4
  12. package/dist/runtime/helpers/repeatable.js +12 -0
  13. package/dist/runtime/helpers/self-iterator.js +3 -0
  14. package/dist/runtime/helpers/style-value.js +1 -1
  15. package/dist/runtime/html/AsyncStream.js +14 -14
  16. package/dist/runtime/html/BufferedWriter.js +2 -2
  17. package/dist/runtime/html/create-readable/index-browser.js +1 -1
  18. package/dist/runtime/html/create-readable/index.js +9 -9
  19. package/dist/runtime/html/helpers/_dynamic-attr.js +2 -2
  20. package/dist/runtime/html/helpers/attr.js +3 -3
  21. package/dist/runtime/html/helpers/data-marko.js +1 -1
  22. package/dist/runtime/html/helpers/escape-quotes.js +1 -1
  23. package/dist/runtime/html/helpers/escape-xml.js +1 -1
  24. package/dist/runtime/html/index.js +2 -2
  25. package/dist/runtime/renderable.js +5 -5
  26. package/dist/runtime/setImmediate/index-browser.js +1 -1
  27. package/dist/runtime/setImmediate/index-worker.js +2 -2
  28. package/dist/runtime/setImmediate/index.js +2 -2
  29. package/dist/runtime/vdom/AsyncVDOMBuilder.js +74 -74
  30. package/dist/runtime/vdom/VComponent.js +3 -3
  31. package/dist/runtime/vdom/VDocumentFragment.js +7 -7
  32. package/dist/runtime/vdom/VElement.js +44 -44
  33. package/dist/runtime/vdom/VFragment.js +5 -5
  34. package/dist/runtime/vdom/VNode.js +32 -32
  35. package/dist/runtime/vdom/VText.js +8 -8
  36. package/dist/runtime/vdom/helpers/v-element.js +1 -1
  37. package/dist/runtime/vdom/helpers/v-text.js +1 -1
  38. package/dist/runtime/vdom/hot-reload.js +4 -4
  39. package/dist/runtime/vdom/index.js +2 -2
  40. package/dist/runtime/vdom/morphdom/fragment.js +4 -4
  41. package/dist/runtime/vdom/morphdom/helpers.js +4 -4
  42. package/dist/runtime/vdom/morphdom/index.js +36 -36
  43. package/dist/runtime/vdom/morphdom/specialElHandlers.js +6 -6
  44. package/dist/runtime/vdom/preserve-attrs.js +1 -1
  45. package/dist/runtime/vdom/vdom.js +14 -14
  46. package/docs/body-content.md +37 -18
  47. package/docs/class-components.md +1 -1
  48. package/docs/express.md +2 -2
  49. package/docs/fastify.md +1 -1
  50. package/docs/rendering.md +14 -4
  51. package/docs/typescript.md +13 -13
  52. package/index.d.ts +4 -2
  53. package/package.json +3 -3
  54. package/src/runtime/components/entry/index-browser.js +2 -6
  55. package/src/runtime/components/registry/index-browser.js +451 -27
  56. package/src/runtime/components/renderer.js +2 -1
  57. package/src/runtime/helpers/repeatable.js +12 -0
  58. package/src/runtime/helpers/self-iterator.js +3 -0
  59. package/dist/runtime/components/init-components/index-browser.js +0 -453
  60. package/dist/runtime/components/init-components/index.js +0 -2
  61. package/dist/runtime/components/init-components/package.json +0 -11
  62. package/src/runtime/components/init-components/index-browser.js +0 -453
  63. package/src/runtime/components/init-components/index.js +0 -1
  64. package/src/runtime/components/init-components/package.json +0 -11
@@ -1,453 +0,0 @@
1
- "use strict";
2
-
3
- var warp10Finalize = require("warp10/finalize");
4
- var eventDelegation = require("../event-delegation");
5
- var win = window;
6
- var createFragmentNode =
7
- require("../../vdom/morphdom/fragment").ap_;
8
- var componentsUtil = require("../util");
9
- var componentLookup = componentsUtil.D_;
10
- var addComponentRootToKeyedElements =
11
- componentsUtil.aq_;
12
- var ComponentDef = require("../ComponentDef");
13
- var registry = require("../registry");
14
- var domData = require("../dom-data");
15
- var keyedElementsByComponentId = domData.G_;
16
- var componentsByDOMNode = domData.F_;
17
- var serverComponentRootNodes = {};
18
- var serverRenderedMeta = {};
19
-
20
- var DEFAULT_RUNTIME_ID = "M";
21
- var FLAG_WILL_RERENDER_IN_BROWSER = 1;
22
- // var FLAG_HAS_RENDER_BODY = 2;
23
-
24
- var deferredDefs;
25
-
26
- function indexServerComponentBoundaries(node, runtimeId, stack) {
27
- var componentId;
28
- var ownerId;
29
- var ownerComponent;
30
- var keyedElements;
31
- var nextSibling;
32
- var runtimeLength = runtimeId.length;
33
- stack = stack || [];
34
-
35
- node = node.firstChild;
36
- while (node) {
37
- nextSibling = node.nextSibling;
38
- if (node.nodeType === 8) {
39
- // Comment node
40
- var commentValue = node.nodeValue;
41
- if (commentValue.slice(0, runtimeLength) === runtimeId) {
42
- var firstChar = commentValue[runtimeLength];
43
-
44
- if (firstChar === "^" || firstChar === "#") {
45
- stack.push(node);
46
- } else if (firstChar === "/") {
47
- var endNode = node;
48
- var startNode = stack.pop();
49
- var rootNode;
50
-
51
- if (startNode.parentNode === endNode.parentNode) {
52
- rootNode = createFragmentNode(startNode.nextSibling, endNode);
53
- } else {
54
- rootNode = createFragmentNode(
55
- endNode.parentNode.firstChild,
56
- endNode);
57
-
58
- }
59
-
60
- componentId = startNode.nodeValue.substring(runtimeLength + 1);
61
- firstChar = startNode.nodeValue[runtimeLength];
62
-
63
- if (firstChar === "^") {
64
- var parts = componentId.split(/ /g);
65
- var key = parts[2];
66
- ownerId = parts[1];
67
- componentId = parts[0];
68
- if (ownerComponent = componentLookup[ownerId]) {
69
- keyedElements = ownerComponent.k_;
70
- } else {
71
- keyedElements =
72
- keyedElementsByComponentId[ownerId] || (
73
- keyedElementsByComponentId[ownerId] = {});
74
- }
75
- addComponentRootToKeyedElements(
76
- keyedElements,
77
- key,
78
- rootNode,
79
- componentId);
80
-
81
- }
82
-
83
- serverComponentRootNodes[componentId] = rootNode;
84
-
85
- startNode.parentNode.removeChild(startNode);
86
- endNode.parentNode.removeChild(endNode);
87
- }
88
- }
89
- } else if (node.nodeType === 1) {
90
- // HTML element node
91
- var markoKey = node.getAttribute("data-marko-key");
92
- var markoProps = componentsUtil.an_(node);
93
- if (markoKey) {
94
- var separatorIndex = markoKey.indexOf(" ");
95
- ownerId = markoKey.substring(separatorIndex + 1);
96
- markoKey = markoKey.substring(0, separatorIndex);
97
- if (ownerComponent = componentLookup[ownerId]) {
98
- keyedElements = ownerComponent.k_;
99
- } else {
100
- keyedElements =
101
- keyedElementsByComponentId[ownerId] || (
102
- keyedElementsByComponentId[ownerId] = {});
103
- }
104
- keyedElements[markoKey] = node;
105
- }
106
- if (markoProps) {
107
- Object.keys(markoProps).forEach(function (key) {
108
- if (key.slice(0, 2) === "on") {
109
- eventDelegation._E_(key.slice(2));
110
- }
111
- });
112
- }
113
- indexServerComponentBoundaries(node, runtimeId, stack);
114
- }
115
-
116
- node = nextSibling;
117
- }
118
- }
119
-
120
- function invokeComponentEventHandler(component, targetMethodName, args) {
121
- var method = component[targetMethodName];
122
- if (!method) {
123
- throw Error("Method not found: " + targetMethodName);
124
- }
125
-
126
- method.apply(component, args);
127
- }
128
-
129
- function addEventListenerHelper(el, eventType, isOnce, listener) {
130
- var eventListener = listener;
131
- if (isOnce) {
132
- eventListener = function (event) {
133
- listener(event);
134
- el.removeEventListener(eventType, eventListener);
135
- };
136
- }
137
-
138
- el.addEventListener(eventType, eventListener, false);
139
-
140
- return function remove() {
141
- el.removeEventListener(eventType, eventListener);
142
- };
143
- }
144
-
145
- function addDOMEventListeners(
146
- component,
147
- el,
148
- eventType,
149
- targetMethodName,
150
- isOnce,
151
- extraArgs,
152
- handles)
153
- {
154
- var removeListener = addEventListenerHelper(
155
- el,
156
- eventType,
157
- isOnce,
158
- function (event) {
159
- var args = [event, el];
160
- if (extraArgs) {
161
- args = extraArgs.concat(args);
162
- }
163
-
164
- invokeComponentEventHandler(component, targetMethodName, args);
165
- });
166
-
167
- handles.push(removeListener);
168
- }
169
-
170
- function initComponent(componentDef, host) {
171
- var component = componentDef.h_;
172
-
173
- component.J_();
174
- component.Y_ = host;
175
-
176
- var isExisting = componentDef._H_;
177
-
178
- if (isExisting) {
179
- component._c_();
180
- }
181
-
182
- var domEvents = componentDef._G_;
183
- if (domEvents) {
184
- var eventListenerHandles = [];
185
-
186
- domEvents.forEach(function (domEventArgs) {
187
- // The event mapping is for a direct DOM event (not a custom event and not for bubblign dom events)
188
-
189
- var eventType = domEventArgs[0];
190
- var targetMethodName = domEventArgs[1];
191
- var eventEl = component.k_[domEventArgs[2]];
192
- var isOnce = domEventArgs[3];
193
- var extraArgs = domEventArgs[4];
194
-
195
- addDOMEventListeners(
196
- component,
197
- eventEl,
198
- eventType,
199
- targetMethodName,
200
- isOnce,
201
- extraArgs,
202
- eventListenerHandles);
203
-
204
- });
205
-
206
- if (eventListenerHandles.length) {
207
- component.N_ = eventListenerHandles;
208
- }
209
- }
210
-
211
- if (component.S_) {
212
- component.I_();
213
- } else {
214
- component.S_ = true;
215
- component._A_();
216
- }
217
- }
218
-
219
- /**
220
- * This method is used to initialized components associated with UI components
221
- * rendered in the browser. While rendering UI components a "components context"
222
- * is added to the rendering context to keep up with which components are rendered.
223
- * When ready, the components can then be initialized by walking the component tree
224
- * in the components context (nested components are initialized before ancestor components).
225
- * @param {Array<marko-components/lib/ComponentDef>} componentDefs An array of ComponentDef instances
226
- */
227
- function initClientRendered(componentDefs, host) {
228
- if (!host) host = document;
229
- // Ensure that event handlers to handle delegating events are
230
- // always attached before initializing any components
231
- eventDelegation.ao_(host);
232
- var len = componentDefs.length;
233
- var componentDef;
234
- var i;
235
-
236
- for (i = len; i--;) {
237
- componentDef = componentDefs[i];
238
- trackComponent(componentDef);
239
- }
240
-
241
- for (i = len; i--;) {
242
- componentDef = componentDefs[i];
243
- initComponent(componentDef, host);
244
- }
245
- }
246
-
247
- /**
248
- * This method initializes all components that were rendered on the server by iterating over all
249
- * of the component IDs.
250
- */
251
- function initServerRendered(renderedComponents, host) {
252
- var type = typeof renderedComponents;
253
- var globalKey = "$";
254
- var runtimeId;
255
-
256
- if (type !== "object") {
257
- if (type === "string") {
258
- runtimeId = renderedComponents;
259
- globalKey += runtimeId + "_C";
260
- } else {
261
- globalKey += (runtimeId = DEFAULT_RUNTIME_ID) + "C";
262
- }
263
-
264
- renderedComponents = win[globalKey];
265
-
266
- // eslint-disable-next-line no-constant-condition
267
-
268
-
269
-
270
-
271
-
272
-
273
-
274
-
275
-
276
-
277
-
278
-
279
- var fakeArray = win[globalKey] = {
280
- r: runtimeId,
281
- concat: initServerRendered
282
- };
283
-
284
- // eslint-disable-next-line no-constant-condition
285
-
286
-
287
-
288
-
289
- if (renderedComponents && renderedComponents.forEach) {
290
- renderedComponents.forEach(function (renderedComponent) {
291
- fakeArray.concat(renderedComponent);
292
- });
293
- }
294
-
295
- return fakeArray;
296
- }
297
-
298
- var isFromSerializedGlobals = this.concat === initServerRendered;
299
- renderedComponents = warp10Finalize(renderedComponents);
300
-
301
- if (isFromSerializedGlobals) {
302
- runtimeId = this.r;
303
- host = document;
304
- } else {
305
- runtimeId = renderedComponents.r || DEFAULT_RUNTIME_ID;
306
- if (!host) host = document;
307
-
308
- // eslint-disable-next-line no-constant-condition
309
-
310
-
311
-
312
-
313
-
314
- }
315
-
316
- // eslint-disable-next-line no-constant-condition
317
-
318
-
319
-
320
-
321
-
322
-
323
-
324
-
325
- var prefix = renderedComponents.p || "";
326
- var meta = serverRenderedMeta[prefix];
327
- var isLast = renderedComponents.l;
328
-
329
- if (meta) {
330
- if (isLast) {
331
- delete serverRenderedMeta[prefix];
332
- }
333
- } else {
334
- meta = {};
335
-
336
- if (!isLast) {
337
- serverRenderedMeta[prefix] = meta;
338
- }
339
- }
340
-
341
- // Ensure that event handlers to handle delegating events are
342
- // always attached before initializing any components
343
- indexServerComponentBoundaries(host, runtimeId);
344
- eventDelegation.ao_(host);
345
-
346
- if (renderedComponents.g) {
347
- meta.ar_ = renderedComponents.g;
348
- }
349
-
350
- if (renderedComponents.t) {
351
- meta.as_ = meta.as_ ?
352
- meta.as_.concat(renderedComponents.t) :
353
- renderedComponents.t;
354
- }
355
-
356
- // hydrate components top down (leaf nodes last)
357
- // and return an array of functions to mount these components
358
- (renderedComponents.w || []).
359
- map(function (componentDef) {
360
- var typeName = meta.as_[componentDef[1]];
361
-
362
- return registry.at_(typeName) ?
363
- tryHydrateComponent(componentDef, meta, host, runtimeId) :
364
- registry.au_(
365
- componentDef,
366
- typeName,
367
- meta,
368
- host,
369
- runtimeId);
370
-
371
- }).
372
- reverse().
373
- forEach(tryInvoke);
374
-
375
- return this;
376
- }
377
-
378
- function tryHydrateComponent(rawDef, meta, host, runtimeId) {
379
- var componentDef = ComponentDef._P_(
380
- rawDef,
381
- meta.as_,
382
- meta.ar_,
383
- registry);
384
-
385
- var mount = hydrateComponentAndGetMount(componentDef, host);
386
-
387
- if (!mount) {
388
- // hydrateComponentAndGetMount will return false if there is not rootNode
389
- // for the component. If this is the case, we'll wait until the
390
- // DOM has fully loaded to attempt to init the component again.
391
- if (deferredDefs) {
392
- deferredDefs.push(componentDef);
393
- } else {
394
- deferredDefs = [componentDef];
395
- document.addEventListener("DOMContentLoaded", function () {
396
- indexServerComponentBoundaries(host, runtimeId);
397
- deferredDefs.
398
- map(function (componentDef) {
399
- return hydrateComponentAndGetMount(componentDef, host);
400
- }).
401
- reverse().
402
- forEach(tryInvoke);
403
- deferredDefs = undefined;
404
- });
405
- }
406
- }
407
-
408
- return mount;
409
- }
410
-
411
- function hydrateComponentAndGetMount(componentDef, host) {
412
- var componentId = componentDef.id;
413
- var component = componentDef.h_;
414
- var rootNode = serverComponentRootNodes[componentId];
415
- var renderResult;
416
-
417
- if (rootNode) {
418
- delete serverComponentRootNodes[componentId];
419
-
420
- component.L_ = rootNode;
421
- componentsByDOMNode.set(rootNode, component);
422
-
423
- if (componentDef._J_ & FLAG_WILL_RERENDER_IN_BROWSER) {
424
- component.Y_ = host;
425
- renderResult = component._q_(component.R_, true);
426
- trackComponent(componentDef);
427
- return function mount() {
428
- renderResult.afterInsert(host);
429
- };
430
- } else {
431
- trackComponent(componentDef);
432
- }
433
-
434
- return function mount() {
435
- initComponent(componentDef, host);
436
- };
437
- }
438
- }
439
-
440
- function trackComponent(componentDef) {
441
- var component = componentDef.h_;
442
- if (component) {
443
- componentLookup[component.id] = component;
444
- }
445
- }
446
-
447
- function tryInvoke(fn) {
448
- if (fn) fn();
449
- }
450
-
451
- exports._S_ = initClientRendered;
452
- exports.aj_ = initServerRendered;
453
- exports.av_ = tryHydrateComponent;
@@ -1,2 +0,0 @@
1
- // The server-side implementation of this module is intentionally empty
2
- "use strict";
@@ -1,11 +0,0 @@
1
- {
2
- "main": "./index.js",
3
- "browser": "./index-browser.js",
4
- "exports": {
5
- ".": {
6
- "worker": "./index.js",
7
- "browser": "./index-browser.js",
8
- "default": "./index.js"
9
- }
10
- }
11
- }