marko 6.0.0-next.3.28 → 6.0.0-next.3.29
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.
- package/dist/debug/dom.js +93 -62
- package/dist/debug/dom.mjs +93 -62
- package/dist/dom/compat.d.ts +1 -1
- package/dist/dom/dom.d.ts +2 -1
- package/dist/dom/parse-html.d.ts +4 -2
- package/dist/dom/renderer.d.ts +4 -4
- package/dist/dom.js +101 -78
- package/dist/dom.mjs +101 -78
- package/package.json +1 -1
package/dist/debug/dom.js
CHANGED
@@ -789,25 +789,12 @@ function toValueProp(it) {
|
|
789
789
|
}
|
790
790
|
|
791
791
|
// src/dom/parse-html.ts
|
792
|
-
var
|
793
|
-
function parseHTML(html2) {
|
794
|
-
parser
|
795
|
-
|
796
|
-
|
797
|
-
|
798
|
-
const content = parseHTML(html2);
|
799
|
-
if (content.firstChild) {
|
800
|
-
if (content.firstChild === content.lastChild && // If the firstChild is a comment it's possible its
|
801
|
-
// a single replaced node, in which case the walker can't replace
|
802
|
-
// the node itself.
|
803
|
-
content.firstChild.nodeType !== 8) {
|
804
|
-
return content.firstChild;
|
805
|
-
}
|
806
|
-
const fragment = new DocumentFragment();
|
807
|
-
fragment.appendChild(content);
|
808
|
-
return fragment;
|
809
|
-
}
|
810
|
-
return new Text();
|
792
|
+
var parsers = {};
|
793
|
+
function parseHTML(html2, ns) {
|
794
|
+
const parser = parsers[ns] ||= document.createElementNS(ns, "template");
|
795
|
+
const content = (parser.innerHTML = html2, parser.content || parser);
|
796
|
+
if (!content.firstChild) content.appendChild(new Text());
|
797
|
+
return content;
|
811
798
|
}
|
812
799
|
|
813
800
|
// src/dom/dom.ts
|
@@ -983,14 +970,18 @@ function attrsEvents(scope, nodeAccessor) {
|
|
983
970
|
}
|
984
971
|
function html(scope, value2, accessor) {
|
985
972
|
const firstChild = scope[accessor];
|
973
|
+
const parentNode = firstChild.parentNode;
|
986
974
|
const lastChild = scope[accessor + "-" /* DynamicPlaceholderLastChild */] || firstChild;
|
987
975
|
const newContent = parseHTML(
|
988
|
-
value2 || value2 === 0 ? value2 + "" : "
|
989
|
-
|
976
|
+
value2 || value2 === 0 ? value2 + "" : "",
|
977
|
+
parentNode.namespaceURI
|
978
|
+
);
|
979
|
+
insertChildNodes(
|
980
|
+
parentNode,
|
981
|
+
firstChild,
|
982
|
+
scope[accessor] = newContent.firstChild,
|
983
|
+
scope[accessor + "-" /* DynamicPlaceholderLastChild */] = newContent.lastChild
|
990
984
|
);
|
991
|
-
scope[accessor] = newContent.firstChild;
|
992
|
-
scope[accessor + "-" /* DynamicPlaceholderLastChild */] = newContent.lastChild;
|
993
|
-
firstChild.parentNode.insertBefore(newContent, firstChild);
|
994
985
|
removeChildNodes(firstChild, lastChild);
|
995
986
|
}
|
996
987
|
function props(scope, nodeIndex, index) {
|
@@ -1040,6 +1031,21 @@ function removeChildNodes(startNode, endNode) {
|
|
1040
1031
|
current = next;
|
1041
1032
|
}
|
1042
1033
|
}
|
1034
|
+
function insertChildNodes(parentNode, referenceNode, startNode, endNode) {
|
1035
|
+
parentNode.insertBefore(toInsertNode(startNode, endNode), referenceNode);
|
1036
|
+
}
|
1037
|
+
function toInsertNode(startNode, endNode) {
|
1038
|
+
if (startNode === endNode) return startNode;
|
1039
|
+
const parent = new DocumentFragment();
|
1040
|
+
const stop = endNode.nextSibling;
|
1041
|
+
let current = startNode;
|
1042
|
+
while (current !== stop) {
|
1043
|
+
const next = current.nextSibling;
|
1044
|
+
parent.appendChild(current);
|
1045
|
+
current = next;
|
1046
|
+
}
|
1047
|
+
return parent;
|
1048
|
+
}
|
1043
1049
|
|
1044
1050
|
// src/dom/scope.ts
|
1045
1051
|
var pendingScopes = [];
|
@@ -1084,13 +1090,12 @@ function removeAndDestroyBranch(branch) {
|
|
1084
1090
|
removeChildNodes(branch.___startNode, branch.___endNode);
|
1085
1091
|
}
|
1086
1092
|
function insertBranchBefore(branch, parentNode, nextSibling) {
|
1087
|
-
|
1088
|
-
|
1089
|
-
|
1090
|
-
|
1091
|
-
|
1092
|
-
|
1093
|
-
}
|
1093
|
+
insertChildNodes(
|
1094
|
+
parentNode,
|
1095
|
+
nextSibling,
|
1096
|
+
branch.___startNode,
|
1097
|
+
branch.___endNode
|
1098
|
+
);
|
1094
1099
|
}
|
1095
1100
|
|
1096
1101
|
// src/dom/reconcile.ts
|
@@ -1333,7 +1338,7 @@ function getDebugKey(index, node) {
|
|
1333
1338
|
}
|
1334
1339
|
|
1335
1340
|
// src/dom/renderer.ts
|
1336
|
-
function createBranchScopeWithRenderer(renderer, $global, parentScope) {
|
1341
|
+
function createBranchScopeWithRenderer(renderer, $global, parentScope, parentNode) {
|
1337
1342
|
const branch = createBranch(
|
1338
1343
|
$global,
|
1339
1344
|
renderer.___owner || parentScope,
|
@@ -1342,19 +1347,23 @@ function createBranchScopeWithRenderer(renderer, $global, parentScope) {
|
|
1342
1347
|
if (true) {
|
1343
1348
|
branch.___renderer = renderer;
|
1344
1349
|
}
|
1345
|
-
initBranch(renderer, branch);
|
1350
|
+
initBranch(renderer, branch, parentNode);
|
1346
1351
|
return branch;
|
1347
1352
|
}
|
1348
|
-
function createBranchScopeWithTagNameOrRenderer(tagNameOrRenderer, $global, parentScope) {
|
1353
|
+
function createBranchScopeWithTagNameOrRenderer(tagNameOrRenderer, $global, parentScope, parentNode) {
|
1349
1354
|
if (typeof tagNameOrRenderer !== "string") {
|
1350
1355
|
return createBranchScopeWithRenderer(
|
1351
1356
|
tagNameOrRenderer,
|
1352
1357
|
$global,
|
1353
|
-
parentScope
|
1358
|
+
parentScope,
|
1359
|
+
parentNode
|
1354
1360
|
);
|
1355
1361
|
}
|
1356
1362
|
const branch = createBranch($global, parentScope, parentScope);
|
1357
|
-
branch[true ? `#${tagNameOrRenderer}/0` : 0] = branch.___startNode = branch.___endNode = document.
|
1363
|
+
branch[true ? `#${tagNameOrRenderer}/0` : 0] = branch.___startNode = branch.___endNode = document.createElementNS(
|
1364
|
+
tagNameOrRenderer === "svg" ? "http://www.w3.org/2000/svg" : tagNameOrRenderer === "math" ? "http://www.w3.org/1998/Math/MathML" : parentNode.namespaceURI,
|
1365
|
+
tagNameOrRenderer
|
1366
|
+
);
|
1358
1367
|
return branch;
|
1359
1368
|
}
|
1360
1369
|
function createBranch($global, ownerScope, parentScope) {
|
@@ -1371,19 +1380,15 @@ function createBranch($global, ownerScope, parentScope) {
|
|
1371
1380
|
}
|
1372
1381
|
return branch;
|
1373
1382
|
}
|
1374
|
-
function initBranch(renderer, branch) {
|
1375
|
-
const
|
1376
|
-
|
1377
|
-
|
1378
|
-
|
1379
|
-
|
1380
|
-
);
|
1381
|
-
branch.___startNode = dom.nodeType === 11 /* DocumentFragment */ ? dom.firstChild : dom;
|
1382
|
-
branch.___endNode = dom.nodeType === 11 /* DocumentFragment */ ? dom.lastChild : dom;
|
1383
|
+
function initBranch(renderer, branch, parentNode) {
|
1384
|
+
const clone = renderer.___clone(parentNode.namespaceURI);
|
1385
|
+
const cloneParent = clone.parentNode;
|
1386
|
+
walk(cloneParent?.firstChild || clone, renderer.___walks, branch);
|
1387
|
+
branch.___startNode = cloneParent?.firstChild || clone;
|
1388
|
+
branch.___endNode = cloneParent?.lastChild || clone;
|
1383
1389
|
if (renderer.___setup) {
|
1384
1390
|
queueRender(branch, renderer.___setup);
|
1385
1391
|
}
|
1386
|
-
return dom;
|
1387
1392
|
}
|
1388
1393
|
function dynamicTagAttrs(nodeAccessor, getContent, inputIsArgs) {
|
1389
1394
|
return (scope, attrsOrOp) => {
|
@@ -1441,10 +1446,18 @@ function createRendererWithOwner(template, rawWalks, setup, getArgs) {
|
|
1441
1446
|
function createRenderer(template, walks, setup, getArgs) {
|
1442
1447
|
return createRendererWithOwner(template, walks, setup, getArgs)();
|
1443
1448
|
}
|
1444
|
-
function _clone() {
|
1445
|
-
return (this.
|
1446
|
-
this.___template
|
1447
|
-
|
1449
|
+
function _clone(ns) {
|
1450
|
+
return ((cloneCache[ns] ||= {})[this.___template] ||= createCloneableHTML(
|
1451
|
+
this.___template,
|
1452
|
+
ns
|
1453
|
+
))();
|
1454
|
+
}
|
1455
|
+
var cloneCache = {};
|
1456
|
+
function createCloneableHTML(html2, ns) {
|
1457
|
+
const { firstChild, lastChild } = parseHTML(html2, ns);
|
1458
|
+
const parent = document.createElementNS(ns, "t");
|
1459
|
+
insertChildNodes(parent, null, firstChild, lastChild);
|
1460
|
+
return firstChild === lastChild && firstChild.nodeType < 8 /* Comment */ ? () => firstChild.cloneNode(true) : () => parent.cloneNode(true).firstChild;
|
1448
1461
|
}
|
1449
1462
|
|
1450
1463
|
// src/dom/control-flow.ts
|
@@ -1475,7 +1488,12 @@ var conditional = function conditional2(nodeAccessor, fn, getIntersection) {
|
|
1475
1488
|
};
|
1476
1489
|
function setConditionalRenderer(scope, nodeAccessor, newRenderer) {
|
1477
1490
|
const prevBranch = scope[nodeAccessor + "!" /* ConditionalScope */] || getEmptyBranch(scope[nodeAccessor]);
|
1478
|
-
const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(
|
1491
|
+
const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(
|
1492
|
+
newRenderer,
|
1493
|
+
scope.$global,
|
1494
|
+
scope,
|
1495
|
+
prevBranch.___endNode.parentNode
|
1496
|
+
) : getEmptyBranch(scope[nodeAccessor]);
|
1479
1497
|
insertBranchBefore(
|
1480
1498
|
newBranch,
|
1481
1499
|
prevBranch.___endNode.parentNode,
|
@@ -1512,7 +1530,12 @@ var conditionalOnlyChild = function conditional3(nodeAccessor, fn, getIntersecti
|
|
1512
1530
|
function setConditionalRendererOnlyChild(scope, nodeAccessor, newRenderer) {
|
1513
1531
|
const prevBranch = scope[nodeAccessor + "!" /* ConditionalScope */];
|
1514
1532
|
const referenceNode = scope[nodeAccessor];
|
1515
|
-
const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(
|
1533
|
+
const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(
|
1534
|
+
newRenderer,
|
1535
|
+
scope.$global,
|
1536
|
+
scope,
|
1537
|
+
referenceNode
|
1538
|
+
) : void 0;
|
1516
1539
|
referenceNode.textContent = "";
|
1517
1540
|
if (newBranch) {
|
1518
1541
|
insertBranchBefore(newBranch, referenceNode, null);
|
@@ -1573,18 +1596,23 @@ function loop(nodeAccessor, renderer, forEach) {
|
|
1573
1596
|
return;
|
1574
1597
|
}
|
1575
1598
|
const referenceNode = scope[nodeAccessor];
|
1576
|
-
const referenceIsMarker = referenceNode.nodeType
|
1599
|
+
const referenceIsMarker = referenceNode.nodeType > 1 /* Element */;
|
1577
1600
|
const oldMap = scope[nodeAccessor + "(" /* LoopScopeMap */] || (referenceIsMarker ? emptyMarkerMap : emptyMap);
|
1578
1601
|
const oldArray = scope[nodeAccessor + "!" /* LoopScopeArray */] || Array.from(oldMap.values());
|
1602
|
+
const parentNode = referenceIsMarker ? referenceNode.parentNode || oldArray[0].___startNode.parentNode : referenceNode;
|
1579
1603
|
let newMap;
|
1580
1604
|
let newArray;
|
1581
1605
|
let afterReference;
|
1582
|
-
let parentNode;
|
1583
1606
|
let needsReconciliation = true;
|
1584
1607
|
forEach(valueOrOp, (key, args) => {
|
1585
1608
|
let branch = oldMap.get(key);
|
1586
1609
|
if (!branch) {
|
1587
|
-
branch = createBranchScopeWithRenderer(
|
1610
|
+
branch = createBranchScopeWithRenderer(
|
1611
|
+
renderer,
|
1612
|
+
scope.$global,
|
1613
|
+
scope,
|
1614
|
+
parentNode
|
1615
|
+
);
|
1588
1616
|
} else {
|
1589
1617
|
}
|
1590
1618
|
if (params) {
|
@@ -1618,10 +1646,8 @@ function loop(nodeAccessor, renderer, forEach) {
|
|
1618
1646
|
}
|
1619
1647
|
const oldLastChild = oldArray[oldArray.length - 1];
|
1620
1648
|
afterReference = oldLastChild.___endNode.nextSibling;
|
1621
|
-
parentNode = oldLastChild.___startNode.parentNode;
|
1622
1649
|
} else {
|
1623
1650
|
afterReference = null;
|
1624
|
-
parentNode = referenceNode;
|
1625
1651
|
}
|
1626
1652
|
reconcile(parentNode, oldArray, newArray, afterReference);
|
1627
1653
|
}
|
@@ -2019,7 +2045,7 @@ var compat = {
|
|
2019
2045
|
if (!branch) {
|
2020
2046
|
branch = component.scope = createScope(out.global);
|
2021
2047
|
branch._ = renderer.___owner;
|
2022
|
-
initBranch(renderer, branch);
|
2048
|
+
initBranch(renderer, branch, document.body);
|
2023
2049
|
} else {
|
2024
2050
|
applyArgs(branch, MARK);
|
2025
2051
|
existing = true;
|
@@ -2027,7 +2053,7 @@ var compat = {
|
|
2027
2053
|
applyArgs(branch, args);
|
2028
2054
|
});
|
2029
2055
|
if (!existing) {
|
2030
|
-
return branch.___startNode
|
2056
|
+
return toInsertNode(branch.___startNode, branch.___endNode);
|
2031
2057
|
}
|
2032
2058
|
}
|
2033
2059
|
};
|
@@ -2049,7 +2075,7 @@ var createTemplate = (templateId, ...rendererArgs) => {
|
|
2049
2075
|
return register(templateId, renderer);
|
2050
2076
|
};
|
2051
2077
|
function mount(input = {}, reference, position) {
|
2052
|
-
let branch
|
2078
|
+
let branch;
|
2053
2079
|
let parentNode = reference;
|
2054
2080
|
let nextSibling = null;
|
2055
2081
|
let { $global } = input;
|
@@ -2082,10 +2108,15 @@ function mount(input = {}, reference, position) {
|
|
2082
2108
|
const args = this.___args;
|
2083
2109
|
const effects = prepareEffects(() => {
|
2084
2110
|
branch = createScope($global);
|
2085
|
-
|
2111
|
+
initBranch(this, branch, parentNode);
|
2086
2112
|
args?.(branch, [input]);
|
2087
2113
|
});
|
2088
|
-
|
2114
|
+
insertChildNodes(
|
2115
|
+
parentNode,
|
2116
|
+
nextSibling,
|
2117
|
+
branch.___startNode,
|
2118
|
+
branch.___endNode
|
2119
|
+
);
|
2089
2120
|
runEffects(effects);
|
2090
2121
|
return {
|
2091
2122
|
update: (newInput) => {
|
package/dist/debug/dom.mjs
CHANGED
@@ -702,25 +702,12 @@ function toValueProp(it) {
|
|
702
702
|
}
|
703
703
|
|
704
704
|
// src/dom/parse-html.ts
|
705
|
-
var
|
706
|
-
function parseHTML(html2) {
|
707
|
-
parser
|
708
|
-
|
709
|
-
|
710
|
-
|
711
|
-
const content = parseHTML(html2);
|
712
|
-
if (content.firstChild) {
|
713
|
-
if (content.firstChild === content.lastChild && // If the firstChild is a comment it's possible its
|
714
|
-
// a single replaced node, in which case the walker can't replace
|
715
|
-
// the node itself.
|
716
|
-
content.firstChild.nodeType !== 8) {
|
717
|
-
return content.firstChild;
|
718
|
-
}
|
719
|
-
const fragment = new DocumentFragment();
|
720
|
-
fragment.appendChild(content);
|
721
|
-
return fragment;
|
722
|
-
}
|
723
|
-
return new Text();
|
705
|
+
var parsers = {};
|
706
|
+
function parseHTML(html2, ns) {
|
707
|
+
const parser = parsers[ns] ||= document.createElementNS(ns, "template");
|
708
|
+
const content = (parser.innerHTML = html2, parser.content || parser);
|
709
|
+
if (!content.firstChild) content.appendChild(new Text());
|
710
|
+
return content;
|
724
711
|
}
|
725
712
|
|
726
713
|
// src/dom/dom.ts
|
@@ -896,14 +883,18 @@ function attrsEvents(scope, nodeAccessor) {
|
|
896
883
|
}
|
897
884
|
function html(scope, value2, accessor) {
|
898
885
|
const firstChild = scope[accessor];
|
886
|
+
const parentNode = firstChild.parentNode;
|
899
887
|
const lastChild = scope[accessor + "-" /* DynamicPlaceholderLastChild */] || firstChild;
|
900
888
|
const newContent = parseHTML(
|
901
|
-
value2 || value2 === 0 ? value2 + "" : "
|
902
|
-
|
889
|
+
value2 || value2 === 0 ? value2 + "" : "",
|
890
|
+
parentNode.namespaceURI
|
891
|
+
);
|
892
|
+
insertChildNodes(
|
893
|
+
parentNode,
|
894
|
+
firstChild,
|
895
|
+
scope[accessor] = newContent.firstChild,
|
896
|
+
scope[accessor + "-" /* DynamicPlaceholderLastChild */] = newContent.lastChild
|
903
897
|
);
|
904
|
-
scope[accessor] = newContent.firstChild;
|
905
|
-
scope[accessor + "-" /* DynamicPlaceholderLastChild */] = newContent.lastChild;
|
906
|
-
firstChild.parentNode.insertBefore(newContent, firstChild);
|
907
898
|
removeChildNodes(firstChild, lastChild);
|
908
899
|
}
|
909
900
|
function props(scope, nodeIndex, index) {
|
@@ -953,6 +944,21 @@ function removeChildNodes(startNode, endNode) {
|
|
953
944
|
current = next;
|
954
945
|
}
|
955
946
|
}
|
947
|
+
function insertChildNodes(parentNode, referenceNode, startNode, endNode) {
|
948
|
+
parentNode.insertBefore(toInsertNode(startNode, endNode), referenceNode);
|
949
|
+
}
|
950
|
+
function toInsertNode(startNode, endNode) {
|
951
|
+
if (startNode === endNode) return startNode;
|
952
|
+
const parent = new DocumentFragment();
|
953
|
+
const stop = endNode.nextSibling;
|
954
|
+
let current = startNode;
|
955
|
+
while (current !== stop) {
|
956
|
+
const next = current.nextSibling;
|
957
|
+
parent.appendChild(current);
|
958
|
+
current = next;
|
959
|
+
}
|
960
|
+
return parent;
|
961
|
+
}
|
956
962
|
|
957
963
|
// src/dom/scope.ts
|
958
964
|
var pendingScopes = [];
|
@@ -997,13 +1003,12 @@ function removeAndDestroyBranch(branch) {
|
|
997
1003
|
removeChildNodes(branch.___startNode, branch.___endNode);
|
998
1004
|
}
|
999
1005
|
function insertBranchBefore(branch, parentNode, nextSibling) {
|
1000
|
-
|
1001
|
-
|
1002
|
-
|
1003
|
-
|
1004
|
-
|
1005
|
-
|
1006
|
-
}
|
1006
|
+
insertChildNodes(
|
1007
|
+
parentNode,
|
1008
|
+
nextSibling,
|
1009
|
+
branch.___startNode,
|
1010
|
+
branch.___endNode
|
1011
|
+
);
|
1007
1012
|
}
|
1008
1013
|
|
1009
1014
|
// src/dom/reconcile.ts
|
@@ -1246,7 +1251,7 @@ function getDebugKey(index, node) {
|
|
1246
1251
|
}
|
1247
1252
|
|
1248
1253
|
// src/dom/renderer.ts
|
1249
|
-
function createBranchScopeWithRenderer(renderer, $global, parentScope) {
|
1254
|
+
function createBranchScopeWithRenderer(renderer, $global, parentScope, parentNode) {
|
1250
1255
|
const branch = createBranch(
|
1251
1256
|
$global,
|
1252
1257
|
renderer.___owner || parentScope,
|
@@ -1255,19 +1260,23 @@ function createBranchScopeWithRenderer(renderer, $global, parentScope) {
|
|
1255
1260
|
if (true) {
|
1256
1261
|
branch.___renderer = renderer;
|
1257
1262
|
}
|
1258
|
-
initBranch(renderer, branch);
|
1263
|
+
initBranch(renderer, branch, parentNode);
|
1259
1264
|
return branch;
|
1260
1265
|
}
|
1261
|
-
function createBranchScopeWithTagNameOrRenderer(tagNameOrRenderer, $global, parentScope) {
|
1266
|
+
function createBranchScopeWithTagNameOrRenderer(tagNameOrRenderer, $global, parentScope, parentNode) {
|
1262
1267
|
if (typeof tagNameOrRenderer !== "string") {
|
1263
1268
|
return createBranchScopeWithRenderer(
|
1264
1269
|
tagNameOrRenderer,
|
1265
1270
|
$global,
|
1266
|
-
parentScope
|
1271
|
+
parentScope,
|
1272
|
+
parentNode
|
1267
1273
|
);
|
1268
1274
|
}
|
1269
1275
|
const branch = createBranch($global, parentScope, parentScope);
|
1270
|
-
branch[true ? `#${tagNameOrRenderer}/0` : 0] = branch.___startNode = branch.___endNode = document.
|
1276
|
+
branch[true ? `#${tagNameOrRenderer}/0` : 0] = branch.___startNode = branch.___endNode = document.createElementNS(
|
1277
|
+
tagNameOrRenderer === "svg" ? "http://www.w3.org/2000/svg" : tagNameOrRenderer === "math" ? "http://www.w3.org/1998/Math/MathML" : parentNode.namespaceURI,
|
1278
|
+
tagNameOrRenderer
|
1279
|
+
);
|
1271
1280
|
return branch;
|
1272
1281
|
}
|
1273
1282
|
function createBranch($global, ownerScope, parentScope) {
|
@@ -1284,19 +1293,15 @@ function createBranch($global, ownerScope, parentScope) {
|
|
1284
1293
|
}
|
1285
1294
|
return branch;
|
1286
1295
|
}
|
1287
|
-
function initBranch(renderer, branch) {
|
1288
|
-
const
|
1289
|
-
|
1290
|
-
|
1291
|
-
|
1292
|
-
|
1293
|
-
);
|
1294
|
-
branch.___startNode = dom.nodeType === 11 /* DocumentFragment */ ? dom.firstChild : dom;
|
1295
|
-
branch.___endNode = dom.nodeType === 11 /* DocumentFragment */ ? dom.lastChild : dom;
|
1296
|
+
function initBranch(renderer, branch, parentNode) {
|
1297
|
+
const clone = renderer.___clone(parentNode.namespaceURI);
|
1298
|
+
const cloneParent = clone.parentNode;
|
1299
|
+
walk(cloneParent?.firstChild || clone, renderer.___walks, branch);
|
1300
|
+
branch.___startNode = cloneParent?.firstChild || clone;
|
1301
|
+
branch.___endNode = cloneParent?.lastChild || clone;
|
1296
1302
|
if (renderer.___setup) {
|
1297
1303
|
queueRender(branch, renderer.___setup);
|
1298
1304
|
}
|
1299
|
-
return dom;
|
1300
1305
|
}
|
1301
1306
|
function dynamicTagAttrs(nodeAccessor, getContent, inputIsArgs) {
|
1302
1307
|
return (scope, attrsOrOp) => {
|
@@ -1354,10 +1359,18 @@ function createRendererWithOwner(template, rawWalks, setup, getArgs) {
|
|
1354
1359
|
function createRenderer(template, walks, setup, getArgs) {
|
1355
1360
|
return createRendererWithOwner(template, walks, setup, getArgs)();
|
1356
1361
|
}
|
1357
|
-
function _clone() {
|
1358
|
-
return (this.
|
1359
|
-
this.___template
|
1360
|
-
|
1362
|
+
function _clone(ns) {
|
1363
|
+
return ((cloneCache[ns] ||= {})[this.___template] ||= createCloneableHTML(
|
1364
|
+
this.___template,
|
1365
|
+
ns
|
1366
|
+
))();
|
1367
|
+
}
|
1368
|
+
var cloneCache = {};
|
1369
|
+
function createCloneableHTML(html2, ns) {
|
1370
|
+
const { firstChild, lastChild } = parseHTML(html2, ns);
|
1371
|
+
const parent = document.createElementNS(ns, "t");
|
1372
|
+
insertChildNodes(parent, null, firstChild, lastChild);
|
1373
|
+
return firstChild === lastChild && firstChild.nodeType < 8 /* Comment */ ? () => firstChild.cloneNode(true) : () => parent.cloneNode(true).firstChild;
|
1361
1374
|
}
|
1362
1375
|
|
1363
1376
|
// src/dom/control-flow.ts
|
@@ -1388,7 +1401,12 @@ var conditional = function conditional2(nodeAccessor, fn, getIntersection) {
|
|
1388
1401
|
};
|
1389
1402
|
function setConditionalRenderer(scope, nodeAccessor, newRenderer) {
|
1390
1403
|
const prevBranch = scope[nodeAccessor + "!" /* ConditionalScope */] || getEmptyBranch(scope[nodeAccessor]);
|
1391
|
-
const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(
|
1404
|
+
const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(
|
1405
|
+
newRenderer,
|
1406
|
+
scope.$global,
|
1407
|
+
scope,
|
1408
|
+
prevBranch.___endNode.parentNode
|
1409
|
+
) : getEmptyBranch(scope[nodeAccessor]);
|
1392
1410
|
insertBranchBefore(
|
1393
1411
|
newBranch,
|
1394
1412
|
prevBranch.___endNode.parentNode,
|
@@ -1425,7 +1443,12 @@ var conditionalOnlyChild = function conditional3(nodeAccessor, fn, getIntersecti
|
|
1425
1443
|
function setConditionalRendererOnlyChild(scope, nodeAccessor, newRenderer) {
|
1426
1444
|
const prevBranch = scope[nodeAccessor + "!" /* ConditionalScope */];
|
1427
1445
|
const referenceNode = scope[nodeAccessor];
|
1428
|
-
const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(
|
1446
|
+
const newBranch = newRenderer ? createBranchScopeWithTagNameOrRenderer(
|
1447
|
+
newRenderer,
|
1448
|
+
scope.$global,
|
1449
|
+
scope,
|
1450
|
+
referenceNode
|
1451
|
+
) : void 0;
|
1429
1452
|
referenceNode.textContent = "";
|
1430
1453
|
if (newBranch) {
|
1431
1454
|
insertBranchBefore(newBranch, referenceNode, null);
|
@@ -1486,18 +1509,23 @@ function loop(nodeAccessor, renderer, forEach) {
|
|
1486
1509
|
return;
|
1487
1510
|
}
|
1488
1511
|
const referenceNode = scope[nodeAccessor];
|
1489
|
-
const referenceIsMarker = referenceNode.nodeType
|
1512
|
+
const referenceIsMarker = referenceNode.nodeType > 1 /* Element */;
|
1490
1513
|
const oldMap = scope[nodeAccessor + "(" /* LoopScopeMap */] || (referenceIsMarker ? emptyMarkerMap : emptyMap);
|
1491
1514
|
const oldArray = scope[nodeAccessor + "!" /* LoopScopeArray */] || Array.from(oldMap.values());
|
1515
|
+
const parentNode = referenceIsMarker ? referenceNode.parentNode || oldArray[0].___startNode.parentNode : referenceNode;
|
1492
1516
|
let newMap;
|
1493
1517
|
let newArray;
|
1494
1518
|
let afterReference;
|
1495
|
-
let parentNode;
|
1496
1519
|
let needsReconciliation = true;
|
1497
1520
|
forEach(valueOrOp, (key, args) => {
|
1498
1521
|
let branch = oldMap.get(key);
|
1499
1522
|
if (!branch) {
|
1500
|
-
branch = createBranchScopeWithRenderer(
|
1523
|
+
branch = createBranchScopeWithRenderer(
|
1524
|
+
renderer,
|
1525
|
+
scope.$global,
|
1526
|
+
scope,
|
1527
|
+
parentNode
|
1528
|
+
);
|
1501
1529
|
} else {
|
1502
1530
|
}
|
1503
1531
|
if (params) {
|
@@ -1531,10 +1559,8 @@ function loop(nodeAccessor, renderer, forEach) {
|
|
1531
1559
|
}
|
1532
1560
|
const oldLastChild = oldArray[oldArray.length - 1];
|
1533
1561
|
afterReference = oldLastChild.___endNode.nextSibling;
|
1534
|
-
parentNode = oldLastChild.___startNode.parentNode;
|
1535
1562
|
} else {
|
1536
1563
|
afterReference = null;
|
1537
|
-
parentNode = referenceNode;
|
1538
1564
|
}
|
1539
1565
|
reconcile(parentNode, oldArray, newArray, afterReference);
|
1540
1566
|
}
|
@@ -1932,7 +1958,7 @@ var compat = {
|
|
1932
1958
|
if (!branch) {
|
1933
1959
|
branch = component.scope = createScope(out.global);
|
1934
1960
|
branch._ = renderer.___owner;
|
1935
|
-
initBranch(renderer, branch);
|
1961
|
+
initBranch(renderer, branch, document.body);
|
1936
1962
|
} else {
|
1937
1963
|
applyArgs(branch, MARK);
|
1938
1964
|
existing = true;
|
@@ -1940,7 +1966,7 @@ var compat = {
|
|
1940
1966
|
applyArgs(branch, args);
|
1941
1967
|
});
|
1942
1968
|
if (!existing) {
|
1943
|
-
return branch.___startNode
|
1969
|
+
return toInsertNode(branch.___startNode, branch.___endNode);
|
1944
1970
|
}
|
1945
1971
|
}
|
1946
1972
|
};
|
@@ -1962,7 +1988,7 @@ var createTemplate = (templateId, ...rendererArgs) => {
|
|
1962
1988
|
return register(templateId, renderer);
|
1963
1989
|
};
|
1964
1990
|
function mount(input = {}, reference, position) {
|
1965
|
-
let branch
|
1991
|
+
let branch;
|
1966
1992
|
let parentNode = reference;
|
1967
1993
|
let nextSibling = null;
|
1968
1994
|
let { $global } = input;
|
@@ -1995,10 +2021,15 @@ function mount(input = {}, reference, position) {
|
|
1995
2021
|
const args = this.___args;
|
1996
2022
|
const effects = prepareEffects(() => {
|
1997
2023
|
branch = createScope($global);
|
1998
|
-
|
2024
|
+
initBranch(this, branch, parentNode);
|
1999
2025
|
args?.(branch, [input]);
|
2000
2026
|
});
|
2001
|
-
|
2027
|
+
insertChildNodes(
|
2028
|
+
parentNode,
|
2029
|
+
nextSibling,
|
2030
|
+
branch.___startNode,
|
2031
|
+
branch.___endNode
|
2032
|
+
);
|
2002
2033
|
runEffects(effects);
|
2003
2034
|
return {
|
2004
2035
|
update: (newInput) => {
|
package/dist/dom/compat.d.ts
CHANGED
@@ -17,5 +17,5 @@ export declare const compat: {
|
|
17
17
|
componentIdPrefix: string;
|
18
18
|
}): any;
|
19
19
|
createRenderer(setup: Renderer["___setup"], clone: Renderer["___clone"], args: Renderer["___args"]): Renderer;
|
20
|
-
render(out: any, component: any, renderer: Renderer, args: any):
|
20
|
+
render(out: any, component: any, renderer: Renderer, args: any): Node | undefined;
|
21
21
|
};
|
package/dist/dom/dom.d.ts
CHANGED
@@ -1,5 +1,4 @@
|
|
1
1
|
import { type Accessor, type Scope } from "../common/types";
|
2
|
-
export declare function isDocumentFragment(node: Node): node is DocumentFragment;
|
3
2
|
export declare function attr(element: Element, name: string, value: unknown): void;
|
4
3
|
export declare function setAttribute(element: Element, name: string, value: string | undefined): void;
|
5
4
|
export declare function classAttr(element: Element, value: unknown): void;
|
@@ -18,3 +17,5 @@ export declare function lifecycle(scope: Scope, index: string | number, thisObj:
|
|
18
17
|
onDestroy?: (this: unknown) => void;
|
19
18
|
}): void;
|
20
19
|
export declare function removeChildNodes(startNode: ChildNode, endNode: ChildNode): void;
|
20
|
+
export declare function insertChildNodes(parentNode: ParentNode, referenceNode: Node | null, startNode: Node, endNode: Node): void;
|
21
|
+
export declare function toInsertNode(startNode: Node, endNode: Node): Node;
|
package/dist/dom/parse-html.d.ts
CHANGED
@@ -1,2 +1,4 @@
|
|
1
|
-
export declare function parseHTML(html: string): DocumentFragment
|
2
|
-
|
1
|
+
export declare function parseHTML(html: string, ns: string): (DocumentFragment | Element) & {
|
2
|
+
firstChild: ChildNode;
|
3
|
+
lastChild: ChildNode;
|
4
|
+
};
|
package/dist/dom/renderer.d.ts
CHANGED
@@ -5,15 +5,15 @@ export type Renderer = {
|
|
5
5
|
___template: string;
|
6
6
|
___walks: string;
|
7
7
|
___setup: SetupFn | undefined;
|
8
|
-
___clone: () =>
|
8
|
+
___clone: (ns: string) => ChildNode;
|
9
9
|
___sourceNode: Node | undefined;
|
10
10
|
___args: Signal<unknown> | undefined;
|
11
11
|
___owner: Scope | undefined;
|
12
12
|
};
|
13
13
|
type SetupFn = (scope: Scope) => void;
|
14
|
-
export declare function createBranchScopeWithRenderer(renderer: Renderer, $global: Scope["$global"], parentScope: Scope): BranchScope;
|
15
|
-
export declare function createBranchScopeWithTagNameOrRenderer(tagNameOrRenderer: Renderer | string, $global: Scope["$global"], parentScope: Scope): BranchScope;
|
16
|
-
export declare function initBranch(renderer: Renderer, branch: BranchScope):
|
14
|
+
export declare function createBranchScopeWithRenderer(renderer: Renderer, $global: Scope["$global"], parentScope: Scope, parentNode: ParentNode): BranchScope;
|
15
|
+
export declare function createBranchScopeWithTagNameOrRenderer(tagNameOrRenderer: Renderer | string, $global: Scope["$global"], parentScope: Scope, parentNode: ParentNode): BranchScope;
|
16
|
+
export declare function initBranch(renderer: Renderer, branch: BranchScope, parentNode: ParentNode): void;
|
17
17
|
export declare function dynamicTagAttrs(nodeAccessor: Accessor, getContent?: (scope: Scope) => Renderer, inputIsArgs?: boolean): (scope: Scope, attrsOrOp: (() => Record<string, unknown>) | SignalOp) => void;
|
18
18
|
export declare function createRendererWithOwner(template: string, rawWalks?: string, setup?: SetupFn, getArgs?: () => Signal<unknown>): (owner?: Scope) => Renderer;
|
19
19
|
export declare function createRenderer(template: string, walks?: string, setup?: SetupFn, getArgs?: () => Signal<unknown>): Renderer;
|