marko 6.0.0-next.3.25 → 6.0.0-next.3.26

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.
@@ -3,6 +3,7 @@ export type Falsy = undefined | null | false | 0 | "";
3
3
  export type CommentWalker = TreeWalker & Record<string, Comment>;
4
4
  export interface BranchScope extends Scope {
5
5
  ___parentBranch: BranchScope | undefined;
6
+ ___branchDepth: number;
6
7
  ___destroyed: 1 | undefined;
7
8
  ___abortScopes: Set<Scope> | undefined;
8
9
  ___branchScopes: Set<BranchScope> | undefined;
package/dist/debug/dom.js CHANGED
@@ -194,21 +194,23 @@ function finishPendingScopes() {
194
194
  }
195
195
  pendingScopes = [];
196
196
  }
197
- var emptyScope = createScope({});
198
- function getEmptyScope(marker) {
199
- emptyScope.___startNode = emptyScope.___endNode = marker;
200
- return emptyScope;
197
+ var emptyBranch = createScope({});
198
+ function getEmptyBranch(marker) {
199
+ emptyBranch.___startNode = emptyBranch.___endNode = marker;
200
+ return emptyBranch;
201
201
  }
202
202
  function destroyBranch(branch) {
203
+ branch.___parentBranch?.___branchScopes?.delete(branch);
204
+ destroyNestedBranches(branch);
205
+ }
206
+ function destroyNestedBranches(branch) {
203
207
  branch.___destroyed = 1;
204
- branch.___branchScopes?.forEach(destroyBranch);
205
- if (branch.___abortScopes) {
206
- for (const scope of branch.___abortScopes) {
207
- for (const id in scope.___abortControllers) {
208
- scope.___abortControllers[id]?.abort();
209
- }
208
+ branch.___branchScopes?.forEach(destroyNestedBranches);
209
+ branch.___abortScopes?.forEach((scope) => {
210
+ for (const id in scope.___abortControllers) {
211
+ scope.___abortControllers[id]?.abort();
210
212
  }
211
- }
213
+ });
212
214
  }
213
215
  function removeAndDestroyBranch(branch) {
214
216
  destroyBranch(branch);
@@ -220,9 +222,9 @@ function removeAndDestroyBranch(branch) {
220
222
  current = next;
221
223
  }
222
224
  }
223
- function insertBefore(scope, parent, nextSibling) {
224
- let current = scope.___startNode;
225
- const stop = scope.___endNode.nextSibling;
225
+ function insertBranchBefore(branch, parent, nextSibling) {
226
+ let current = branch.___startNode;
227
+ const stop = branch.___endNode.nextSibling;
226
228
  while (current !== stop) {
227
229
  const next = current.nextSibling;
228
230
  parent.insertBefore(current, nextSibling);
@@ -327,7 +329,7 @@ function reconcile(parent, oldBranches, newBranches, afterReference) {
327
329
  k = newEnd + 1;
328
330
  nextSibling = k < newBranches.length ? newBranches[k].___startNode : afterReference;
329
331
  do {
330
- insertBefore(newBranches[newStart++], parent, nextSibling);
332
+ insertBranchBefore(newBranches[newStart++], parent, nextSibling);
331
333
  } while (newStart <= newEnd);
332
334
  }
333
335
  } else if (newStart > newEnd) {
@@ -361,7 +363,7 @@ function reconcile(parent, oldBranches, newBranches, afterReference) {
361
363
  }
362
364
  if (oldLength === oldBranches.length && synced === 0) {
363
365
  for (; newStart < newLength; ++newStart) {
364
- insertBefore(newBranches[newStart], parent, afterReference);
366
+ insertBranchBefore(newBranches[newStart], parent, afterReference);
365
367
  }
366
368
  for (; oldStart < oldLength; ++oldStart) {
367
369
  removeAndDestroyBranch(oldBranches[oldStart]);
@@ -384,13 +386,13 @@ function reconcile(parent, oldBranches, newBranches, afterReference) {
384
386
  pos = i + newStart;
385
387
  newBranch = newBranches[pos++];
386
388
  nextSibling = pos < k ? newBranches[pos].___startNode : afterReference;
387
- insertBefore(newBranch, parent, nextSibling);
389
+ insertBranchBefore(newBranch, parent, nextSibling);
388
390
  } else {
389
391
  if (j < 0 || i !== seq[j]) {
390
392
  pos = i + newStart;
391
393
  newBranch = newBranches[pos++];
392
394
  nextSibling = pos < k ? newBranches[pos].___startNode : afterReference;
393
- insertBefore(newBranch, parent, nextSibling);
395
+ insertBranchBefore(newBranch, parent, nextSibling);
394
396
  } else {
395
397
  --j;
396
398
  }
@@ -403,7 +405,7 @@ function reconcile(parent, oldBranches, newBranches, afterReference) {
403
405
  pos = i + newStart;
404
406
  newBranch = newBranches[pos++];
405
407
  nextSibling = pos < k ? newBranches[pos].___startNode : afterReference;
406
- insertBefore(newBranch, parent, nextSibling);
408
+ insertBranchBefore(newBranch, parent, nextSibling);
407
409
  }
408
410
  }
409
411
  }
@@ -652,6 +654,7 @@ var Render = class {
652
654
  if (branchIds.has(scopeId)) {
653
655
  const branch = scope;
654
656
  const parentBranch = branch.___closestBranch;
657
+ branch.___branchDepth = +scopeId;
655
658
  scope.___closestBranch = branch;
656
659
  if (parentBranch) {
657
660
  branch.___parentBranch = parentBranch;
@@ -1337,7 +1340,7 @@ function createBranchScopeWithRenderer(renderer, $global, parentScope) {
1337
1340
  if (true) {
1338
1341
  branch.___renderer = renderer;
1339
1342
  }
1340
- initRenderer(renderer, branch);
1343
+ initBranch(renderer, branch);
1341
1344
  return branch;
1342
1345
  }
1343
1346
  function createBranchScopeWithTagNameOrRenderer(tagNameOrRenderer, $global, parentScope) {
@@ -1358,22 +1361,25 @@ function createBranch($global, ownerScope, parentScope) {
1358
1361
  branch._ = ownerScope;
1359
1362
  branch.___closestBranch = branch;
1360
1363
  if (parentBranch) {
1364
+ branch.___branchDepth = parentBranch.___branchDepth + 1;
1361
1365
  branch.___parentBranch = parentBranch;
1362
1366
  (parentBranch.___branchScopes ||= /* @__PURE__ */ new Set()).add(branch);
1367
+ } else {
1368
+ branch.___branchDepth = 1;
1363
1369
  }
1364
1370
  return branch;
1365
1371
  }
1366
- function initRenderer(renderer, scope) {
1372
+ function initBranch(renderer, branch) {
1367
1373
  const dom = renderer.___clone();
1368
1374
  walk(
1369
1375
  dom.nodeType === 11 /* DocumentFragment */ ? dom.firstChild : dom,
1370
1376
  renderer.___walks,
1371
- scope
1377
+ branch
1372
1378
  );
1373
- scope.___startNode = dom.nodeType === 11 /* DocumentFragment */ ? dom.firstChild : dom;
1374
- scope.___endNode = dom.nodeType === 11 /* DocumentFragment */ ? dom.lastChild : dom;
1379
+ branch.___startNode = dom.nodeType === 11 /* DocumentFragment */ ? dom.firstChild : dom;
1380
+ branch.___endNode = dom.nodeType === 11 /* DocumentFragment */ ? dom.lastChild : dom;
1375
1381
  if (renderer.___setup) {
1376
- queueRender(scope, renderer.___setup);
1382
+ queueRender(branch, renderer.___setup);
1377
1383
  }
1378
1384
  return dom;
1379
1385
  }
@@ -1454,6 +1460,7 @@ var conditional = function conditional2(nodeAccessor, fn, getIntersection) {
1454
1460
  if (newRendererOrOp !== MARK && newRendererOrOp !== CLEAN) {
1455
1461
  const normalizedRenderer = normalizeDynamicRenderer(newRendererOrOp);
1456
1462
  if (isDifferentRenderer(normalizedRenderer, currentRenderer)) {
1463
+ scope[rendererAccessor] = normalizedRenderer;
1457
1464
  setConditionalRenderer(scope, nodeAccessor, normalizedRenderer);
1458
1465
  fn && fn(scope);
1459
1466
  op = DIRTY;
@@ -1465,16 +1472,15 @@ var conditional = function conditional2(nodeAccessor, fn, getIntersection) {
1465
1472
  };
1466
1473
  };
1467
1474
  function setConditionalRenderer(scope, nodeAccessor, newRenderer) {
1468
- const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(newRenderer, scope.$global, scope) : void 0;
1469
- const prevBranch = scope[nodeAccessor + "!" /* ConditionalScope */] || getEmptyScope(scope[nodeAccessor]);
1470
- insertBefore(
1471
- newBranch || getEmptyScope(scope[nodeAccessor]),
1475
+ const prevBranch = scope[nodeAccessor + "!" /* ConditionalScope */] || getEmptyBranch(scope[nodeAccessor]);
1476
+ const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(newRenderer, scope.$global, scope) : getEmptyBranch(scope[nodeAccessor]);
1477
+ insertBranchBefore(
1478
+ newBranch,
1472
1479
  prevBranch.___startNode.parentNode,
1473
1480
  prevBranch.___startNode
1474
1481
  );
1475
1482
  removeAndDestroyBranch(prevBranch);
1476
- scope[nodeAccessor + "(" /* ConditionalRenderer */] = newRenderer;
1477
- scope[nodeAccessor + "!" /* ConditionalScope */] = newBranch;
1483
+ scope[nodeAccessor + "!" /* ConditionalScope */] = newRenderer && newBranch;
1478
1484
  }
1479
1485
  var conditionalOnlyChild = function conditional3(nodeAccessor, fn, getIntersection) {
1480
1486
  const rendererAccessor = nodeAccessor + "(" /* ConditionalRenderer */;
@@ -1507,16 +1513,16 @@ function setConditionalRendererOnlyChild(scope, nodeAccessor, newRenderer) {
1507
1513
  const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(newRenderer, scope.$global, scope) : void 0;
1508
1514
  referenceNode.textContent = "";
1509
1515
  if (newBranch) {
1510
- insertBefore(newBranch, referenceNode, null);
1516
+ insertBranchBefore(newBranch, referenceNode, null);
1511
1517
  }
1512
1518
  prevBranch && destroyBranch(prevBranch);
1513
1519
  scope[nodeAccessor + "!" /* ConditionalScope */] = newBranch;
1514
1520
  }
1515
1521
  var emptyMarkerMap = /* @__PURE__ */ new Map([
1516
- [Symbol(), getEmptyScope(void 0)]
1522
+ [Symbol(), getEmptyBranch(void 0)]
1517
1523
  ]);
1518
1524
  var emptyMarkerArray = [
1519
- /* @__PURE__ */ getEmptyScope(void 0)
1525
+ /* @__PURE__ */ getEmptyBranch(void 0)
1520
1526
  ];
1521
1527
  var emptyMap = /* @__PURE__ */ new Map();
1522
1528
  var emptyArray = [];
@@ -1594,7 +1600,7 @@ function loop(nodeAccessor, renderer, forEach) {
1594
1600
  if (referenceIsMarker) {
1595
1601
  newMap = emptyMarkerMap;
1596
1602
  newArray = emptyMarkerArray;
1597
- getEmptyScope(referenceNode);
1603
+ getEmptyBranch(referenceNode);
1598
1604
  } else {
1599
1605
  oldArray.forEach(destroyBranch);
1600
1606
  referenceNode.textContent = "";
@@ -1606,7 +1612,7 @@ function loop(nodeAccessor, renderer, forEach) {
1606
1612
  if (needsReconciliation) {
1607
1613
  if (referenceIsMarker) {
1608
1614
  if (oldMap === emptyMarkerMap) {
1609
- getEmptyScope(referenceNode);
1615
+ getEmptyBranch(referenceNode);
1610
1616
  }
1611
1617
  const oldLastChild = oldArray[oldArray.length - 1];
1612
1618
  afterReference = oldLastChild.___endNode.nextSibling;
@@ -1745,8 +1751,8 @@ function conditionalClosure(ownerConditionalNodeAccessor, getRenderer, fn, getIn
1745
1751
  return helperSignal;
1746
1752
  }
1747
1753
  var defaultGetOwnerScope = (scope) => scope._;
1748
- function dynamicClosure(ownerValueAccessor, fn, getOwnerScope = defaultGetOwnerScope, getIntersection) {
1749
- const ownerSubscribersAccessor = ownerValueAccessor + "*" /* Subscribers */;
1754
+ function dynamicClosure(fn, getOwnerScope = defaultGetOwnerScope, getIntersection) {
1755
+ const ownerSubscribersAccessor = "?" /* Dynamic */ + accessorId++;
1750
1756
  const _signal = closure(fn, getIntersection);
1751
1757
  const helperSignal = (ownerScope, value2) => {
1752
1758
  const subscribers = ownerScope[ownerSubscribersAccessor];
@@ -1806,7 +1812,7 @@ function effect(id, fn) {
1806
1812
  }
1807
1813
 
1808
1814
  // src/dom/queue.ts
1809
- var pendingRender;
1815
+ var pendingRenders = [];
1810
1816
  var pendingEffects = [];
1811
1817
  var rendering = false;
1812
1818
  function queueSource(scope, signal, value2) {
@@ -1819,30 +1825,22 @@ function queueSource(scope, signal, value2) {
1819
1825
  return value2;
1820
1826
  }
1821
1827
  function queueRender(scope, signal, value2) {
1822
- const nextRender = {
1828
+ let i = pendingRenders.length;
1829
+ const render = {
1823
1830
  ___scope: scope,
1824
1831
  ___signal: signal,
1825
1832
  ___value: value2,
1826
- ___next: void 0
1833
+ ___index: i
1827
1834
  };
1828
- if (!pendingRender) {
1829
- pendingRender = nextRender;
1830
- } else if (comparePendingRenders(pendingRender, nextRender) < 0) {
1831
- if (rendering) {
1832
- throw new Error(
1833
- "attempted to queue a render before the currently executing render"
1834
- );
1835
- }
1836
- nextRender.___next = pendingRender;
1837
- pendingRender = nextRender;
1838
- } else {
1839
- let curRender = pendingRender;
1840
- while (curRender.___next && comparePendingRenders(curRender.___next, nextRender) >= 0) {
1841
- curRender = curRender.___next;
1842
- }
1843
- nextRender.___next = curRender.___next;
1844
- curRender.___next = nextRender;
1835
+ pendingRenders.push(render);
1836
+ while (i) {
1837
+ const parentIndex = i - 1 >> 1;
1838
+ const parent = pendingRenders[parentIndex];
1839
+ if (comparePendingRenders(render, parent) >= 0) break;
1840
+ pendingRenders[i] = parent;
1841
+ i = parentIndex;
1845
1842
  }
1843
+ pendingRenders[i] = render;
1846
1844
  }
1847
1845
  function queueEffect(scope, fn) {
1848
1846
  pendingEffects.push(scope, fn);
@@ -1853,24 +1851,24 @@ function run() {
1853
1851
  rendering = true;
1854
1852
  runRenders();
1855
1853
  } finally {
1856
- pendingRender = void 0;
1854
+ pendingRenders = [];
1855
+ pendingEffects = [];
1857
1856
  rendering = false;
1858
1857
  }
1859
- pendingEffects = [];
1860
1858
  runEffects(effects);
1861
1859
  }
1862
1860
  function prepareEffects(fn) {
1863
- const prevRender = pendingRender;
1861
+ const prevRenders = pendingRenders;
1864
1862
  const prevEffects = pendingEffects;
1865
1863
  const preparedEffects = pendingEffects = [];
1866
- pendingRender = void 0;
1864
+ pendingRenders = [];
1867
1865
  try {
1868
1866
  rendering = true;
1869
1867
  fn();
1870
1868
  runRenders();
1871
1869
  } finally {
1872
1870
  rendering = false;
1873
- pendingRender = prevRender;
1871
+ pendingRenders = prevRenders;
1874
1872
  pendingEffects = prevEffects;
1875
1873
  }
1876
1874
  return preparedEffects;
@@ -1883,22 +1881,42 @@ function runEffects(effects = pendingEffects) {
1883
1881
  }
1884
1882
  }
1885
1883
  function runRenders() {
1886
- while (pendingRender) {
1887
- if (!pendingRender.___scope.___closestBranch?.___destroyed) {
1888
- pendingRender.___signal(pendingRender.___scope, pendingRender.___value);
1884
+ while (pendingRenders.length) {
1885
+ const render = pendingRenders[0];
1886
+ const next = pendingRenders.pop();
1887
+ if (render !== next) {
1888
+ let i = 0;
1889
+ const mid = pendingRenders.length >> 1;
1890
+ const item = pendingRenders[0] = next;
1891
+ while (i < mid) {
1892
+ let bestChild = (i << 1) + 1;
1893
+ const right = bestChild + 1;
1894
+ if (right < pendingRenders.length && comparePendingRenders(
1895
+ pendingRenders[right],
1896
+ pendingRenders[bestChild]
1897
+ ) < 0) {
1898
+ bestChild = right;
1899
+ }
1900
+ if (comparePendingRenders(pendingRenders[bestChild], item) >= 0) {
1901
+ break;
1902
+ } else {
1903
+ pendingRenders[i] = pendingRenders[bestChild];
1904
+ i = bestChild;
1905
+ }
1906
+ }
1907
+ pendingRenders[i] = item;
1908
+ }
1909
+ if (!render.___scope.___closestBranch?.___destroyed) {
1910
+ render.___signal(render.___scope, render.___value);
1889
1911
  }
1890
- pendingRender = pendingRender.___next;
1891
1912
  }
1892
1913
  finishPendingScopes();
1893
1914
  }
1894
1915
  function comparePendingRenders(a, b) {
1895
- if (a.___scope.___pending || b.___scope.___pending) return 0;
1896
- const aStart = ownerStartNode(a.___scope);
1897
- const bStart = ownerStartNode(b.___scope);
1898
- return aStart === bStart ? 0 : aStart ? bStart ? aStart.compareDocumentPosition(bStart) & 2 ? -1 : 1 : -1 : 1;
1916
+ return getBranchDepth(a) - getBranchDepth(b) || a.___index - b.___index;
1899
1917
  }
1900
- function ownerStartNode(scope) {
1901
- return (scope.___closestBranch || scope).___startNode;
1918
+ function getBranchDepth(render) {
1919
+ return render.___scope.___closestBranch?.___branchDepth || 0;
1902
1920
  }
1903
1921
 
1904
1922
  // src/dom/abort-signal.ts
@@ -1997,7 +2015,7 @@ var compat = {
1997
2015
  if (!scope) {
1998
2016
  scope = component.scope = createScope(out.global);
1999
2017
  scope._ = renderer.___owner;
2000
- initRenderer(renderer, scope);
2018
+ initBranch(renderer, scope);
2001
2019
  } else {
2002
2020
  applyArgs(scope, MARK);
2003
2021
  existing = true;
@@ -2028,6 +2046,8 @@ var createTemplate = (templateId, ...rendererArgs) => {
2028
2046
  };
2029
2047
  function mount(input = {}, reference, position) {
2030
2048
  let branch, dom;
2049
+ let parentNode = reference;
2050
+ let nextSibling = null;
2031
2051
  let { $global } = input;
2032
2052
  if ($global) {
2033
2053
  ({ $global, ...input } = input);
@@ -2042,28 +2062,26 @@ function mount(input = {}, reference, position) {
2042
2062
  renderId: DEFAULT_RENDER_ID
2043
2063
  };
2044
2064
  }
2045
- const args = this.___args;
2046
- const effects = prepareEffects(() => {
2047
- branch = createScope($global);
2048
- dom = initRenderer(this, branch);
2049
- if (args) {
2050
- args(branch, [input]);
2051
- }
2052
- });
2053
2065
  switch (position) {
2054
2066
  case "beforebegin":
2055
- reference.parentNode.insertBefore(dom, reference);
2067
+ parentNode = reference.parentNode;
2068
+ nextSibling = reference;
2056
2069
  break;
2057
2070
  case "afterbegin":
2058
- reference.insertBefore(dom, reference.firstChild);
2071
+ nextSibling = reference.firstChild;
2059
2072
  break;
2060
2073
  case "afterend":
2061
- reference.parentNode.insertBefore(dom, reference.nextSibling);
2062
- break;
2063
- default:
2064
- reference.appendChild(dom);
2074
+ parentNode = reference.parentNode;
2075
+ nextSibling = reference.nextSibling;
2065
2076
  break;
2066
2077
  }
2078
+ const args = this.___args;
2079
+ const effects = prepareEffects(() => {
2080
+ branch = createScope($global);
2081
+ dom = initBranch(this, branch);
2082
+ args?.(branch, [input]);
2083
+ });
2084
+ parentNode.insertBefore(dom, nextSibling);
2067
2085
  runEffects(effects);
2068
2086
  return {
2069
2087
  update: (newInput) => {