@lwc/engine-core 2.23.4 → 2.23.5

package/dist/engine-core.cjs.js

@@ -3453,6 +3453,12 @@ function patch(n1, n2, parent, renderer) {
       n2.elm = n1.elm;
       break;
 
+    case 5
+    /* VNodeType.Fragment */
+    :
+      patchFragment(n1, n2, parent, renderer);
+      break;
+
     case 2
     /* VNodeType.Element */
     :
@@ -3492,6 +3498,12 @@ function mount(node, parent, renderer, anchor) {
       mountStatic(node, parent, anchor, renderer);
       break;
 
+    case 5
+    /* VNodeType.Fragment */
+    :
+      mountFragment(node, parent, anchor, renderer);
+      break;
+
     case 2
     /* VNodeType.Element */
     :
@@ -3549,6 +3561,31 @@ function mountComment(vnode, parent, anchor, renderer) {
   insertNode(commentNode, parent, anchor, renderer);
 }
 
+function mountFragment(vnode, parent, anchor, renderer) {
+  const {
+    children
+  } = vnode;
+  mountVNodes(children, parent, renderer, anchor); // children of a fragment will always have at least the two delimiters.
+
+  vnode.elm = children[children.length - 1].elm;
+}
+
+function patchFragment(n1, n2, parent, renderer) {
+  const {
+    children,
+    stable
+  } = n2;
+
+  if (stable) {
+    updateStaticChildren(n1.children, children, parent, renderer);
+  } else {
+    updateDynamicChildren(n1.children, children, parent, renderer);
+  } // Note: not reusing n1.elm, because during patching, it may be patched with another text node.
+
+
+  n2.elm = children[children.length - 1].elm;
+}
+
 function mountElement(vnode, parent, anchor, renderer) {
   const {
     sel,
@@ -3716,9 +3753,15 @@ function unmount(vnode, parent, renderer, doRemove = false) {
   // subtree root, is the only element worth unmounting from the subtree.
 
   if (doRemove) {
-    // The vnode might or might not have a data.renderer associated to it
-    // but the removal used here is from the owner instead.
-    removeNode(elm, parent, renderer);
+    if (type === 5
+    /* VNodeType.Fragment */
+    ) {
+      unmountVNodes(vnode.children, parent, renderer, doRemove);
+    } else {
+      // The vnode might or might not have a data.renderer associated to it
+      // but the removal used here is from the owner instead.
+      removeNode(elm, parent, renderer);
+    }
   }
 
   switch (type) {
@@ -4225,6 +4268,18 @@ function st(fragment, key) {
         owner: getVMBeingRendered(),
     };
 }
+// [fr]agment node
+function fr(key, children, stable) {
+    return {
+        type: 5 /* VNodeType.Fragment */,
+        sel: undefined,
+        key,
+        elm: undefined,
+        children: [t(''), ...children, t('')],
+        stable,
+        owner: getVMBeingRendered(),
+    };
+}
 // [h]tml node
 function h(sel, data, children = EmptyArray) {
     const vmBeingRendered = getVMBeingRendered();
@@ -4444,13 +4499,13 @@ function t(text) {
 }
 // [co]mment node
 function co(text) {
-    let sel, key, elm;
+    let sel, elm;
     return {
         type: 1 /* VNodeType.Comment */,
         sel,
         text,
         elm,
-        key,
+        key: 'c',
         owner: getVMBeingRendered(),
     };
 }
@@ -4595,6 +4650,7 @@ const api = shared.freeze({
     k,
     co,
     dc,
+    fr,
     ti,
     st,
     gid,
@@ -6151,6 +6207,10 @@ function hydrateNode(node, vnode, renderer) {
             // VStatic are cacheable and cannot have custom renderer associated to them
             hydratedNode = hydrateStaticElement(node, vnode, renderer);
             break;
+        case 5 /* VNodeType.Fragment */:
+            // a fragment does not represent any element, therefore there is no need to use a custom renderer.
+            hydratedNode = hydrateFragment(node, vnode, renderer);
+            break;
         case 2 /* VNodeType.Element */:
             hydratedNode = hydrateElement(node, vnode, (_a = vnode.data.renderer) !== null && _a !== void 0 ? _a : renderer);
             break;
@@ -6202,6 +6262,11 @@ function hydrateStaticElement(elm, vnode, renderer) {
     vnode.elm = elm;
     return elm;
 }
+function hydrateFragment(elm, vnode, renderer) {
+    const { children, owner } = vnode;
+    hydrateChildren(elm, children, renderer.getProperty(elm, 'parentNode'), owner);
+    return (vnode.elm = children[children.length - 1].elm);
+}
 function hydrateElement(elm, vnode, renderer) {
     if (!hasCorrectNodeType(vnode, elm, 1 /* EnvNodeTypes.ELEMENT */, renderer) ||
         !isMatchingElement(vnode, elm, renderer)) {
@@ -6660,4 +6725,4 @@ exports.swapTemplate = swapTemplate;
 exports.track = track;
 exports.unwrap = unwrap;
 exports.wire = wire;
-/* version: 2.23.4 */
+/* version: 2.23.5 */

package/dist/engine-core.js

@@ -3450,6 +3450,12 @@ function patch(n1, n2, parent, renderer) {
       n2.elm = n1.elm;
       break;
 
+    case 5
+    /* VNodeType.Fragment */
+    :
+      patchFragment(n1, n2, parent, renderer);
+      break;
+
     case 2
     /* VNodeType.Element */
     :
@@ -3489,6 +3495,12 @@ function mount(node, parent, renderer, anchor) {
       mountStatic(node, parent, anchor, renderer);
       break;
 
+    case 5
+    /* VNodeType.Fragment */
+    :
+      mountFragment(node, parent, anchor, renderer);
+      break;
+
     case 2
     /* VNodeType.Element */
     :
@@ -3546,6 +3558,31 @@ function mountComment(vnode, parent, anchor, renderer) {
   insertNode(commentNode, parent, anchor, renderer);
 }
 
+function mountFragment(vnode, parent, anchor, renderer) {
+  const {
+    children
+  } = vnode;
+  mountVNodes(children, parent, renderer, anchor); // children of a fragment will always have at least the two delimiters.
+
+  vnode.elm = children[children.length - 1].elm;
+}
+
+function patchFragment(n1, n2, parent, renderer) {
+  const {
+    children,
+    stable
+  } = n2;
+
+  if (stable) {
+    updateStaticChildren(n1.children, children, parent, renderer);
+  } else {
+    updateDynamicChildren(n1.children, children, parent, renderer);
+  } // Note: not reusing n1.elm, because during patching, it may be patched with another text node.
+
+
+  n2.elm = children[children.length - 1].elm;
+}
+
 function mountElement(vnode, parent, anchor, renderer) {
   const {
     sel,
@@ -3713,9 +3750,15 @@ function unmount(vnode, parent, renderer, doRemove = false) {
   // subtree root, is the only element worth unmounting from the subtree.
 
   if (doRemove) {
-    // The vnode might or might not have a data.renderer associated to it
-    // but the removal used here is from the owner instead.
-    removeNode(elm, parent, renderer);
+    if (type === 5
+    /* VNodeType.Fragment */
+    ) {
+      unmountVNodes(vnode.children, parent, renderer, doRemove);
+    } else {
+      // The vnode might or might not have a data.renderer associated to it
+      // but the removal used here is from the owner instead.
+      removeNode(elm, parent, renderer);
+    }
   }
 
   switch (type) {
@@ -4222,6 +4265,18 @@ function st(fragment, key) {
         owner: getVMBeingRendered(),
     };
 }
+// [fr]agment node
+function fr(key, children, stable) {
+    return {
+        type: 5 /* VNodeType.Fragment */,
+        sel: undefined,
+        key,
+        elm: undefined,
+        children: [t(''), ...children, t('')],
+        stable,
+        owner: getVMBeingRendered(),
+    };
+}
 // [h]tml node
 function h(sel, data, children = EmptyArray) {
     const vmBeingRendered = getVMBeingRendered();
@@ -4441,13 +4496,13 @@ function t(text) {
 }
 // [co]mment node
 function co(text) {
-    let sel, key, elm;
+    let sel, elm;
     return {
         type: 1 /* VNodeType.Comment */,
         sel,
         text,
         elm,
-        key,
+        key: 'c',
         owner: getVMBeingRendered(),
     };
 }
@@ -4592,6 +4647,7 @@ const api = freeze({
     k,
     co,
     dc,
+    fr,
     ti,
     st,
     gid,
@@ -6148,6 +6204,10 @@ function hydrateNode(node, vnode, renderer) {
             // VStatic are cacheable and cannot have custom renderer associated to them
             hydratedNode = hydrateStaticElement(node, vnode, renderer);
             break;
+        case 5 /* VNodeType.Fragment */:
+            // a fragment does not represent any element, therefore there is no need to use a custom renderer.
+            hydratedNode = hydrateFragment(node, vnode, renderer);
+            break;
         case 2 /* VNodeType.Element */:
             hydratedNode = hydrateElement(node, vnode, (_a = vnode.data.renderer) !== null && _a !== void 0 ? _a : renderer);
             break;
@@ -6199,6 +6259,11 @@ function hydrateStaticElement(elm, vnode, renderer) {
     vnode.elm = elm;
     return elm;
 }
+function hydrateFragment(elm, vnode, renderer) {
+    const { children, owner } = vnode;
+    hydrateChildren(elm, children, renderer.getProperty(elm, 'parentNode'), owner);
+    return (vnode.elm = children[children.length - 1].elm);
+}
 function hydrateElement(elm, vnode, renderer) {
     if (!hasCorrectNodeType(vnode, elm, 1 /* EnvNodeTypes.ELEMENT */, renderer) ||
         !isMatchingElement(vnode, elm, renderer)) {
@@ -6620,4 +6685,4 @@ function getComponentConstructor(elm) {
 }
 
 export { LightningElement, profilerControl as __unstable__ProfilerControl, api$1 as api, connectRootElement, createContextProvider, createVM, disconnectRootElement, freezeTemplate, getAssociatedVMIfPresent, getComponentConstructor, getComponentDef, getComponentHtmlPrototype, getUpgradableConstructor, hydrateRoot, isComponentConstructor, parseFragment, parseSVGFragment, readonly, register, registerComponent, registerDecorators, registerTemplate, sanitizeAttribute, setHooks, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };
-/* version: 2.23.4 */
+/* version: 2.23.5 */

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@lwc/engine-core",
-    "version": "2.23.4",
+    "version": "2.23.5",
     "description": "Core LWC engine APIs.",
     "homepage": "https://lwc.dev/",
     "repository": {
@@ -24,8 +24,8 @@
         "types/"
     ],
     "dependencies": {
-        "@lwc/features": "2.23.4",
-        "@lwc/shared": "2.23.4"
+        "@lwc/features": "2.23.5",
+        "@lwc/shared": "2.23.5"
     },
     "devDependencies": {
         "observable-membrane": "2.0.0"

package/types/framework/api.d.ts

@@ -1,7 +1,8 @@
 import { SlotSet } from './vm';
 import { LightningElementConstructor } from './base-lightning-element';
-import { VNode, VNodes, VElement, VText, VCustomElement, VComment, VElementData, VStatic, Key } from './vnodes';
+import { VNode, VNodes, VElement, VText, VCustomElement, VComment, VElementData, VStatic, Key, VFragment } from './vnodes';
 declare function st(fragment: Element, key: Key): VStatic;
+declare function fr(key: Key, children: VNodes, stable: 0 | 1): VFragment;
 declare function h(sel: string, data: VElementData, children?: VNodes): VElement;
 declare function ti(value: any): number;
 declare function s(slotName: string, data: VElementData, children: VNodes, slotset: SlotSet | undefined): VElement | VNodes;
@@ -40,6 +41,7 @@ declare const api: Readonly<{
     k: typeof k;
     co: typeof co;
     dc: typeof dc;
+    fr: typeof fr;
     ti: typeof ti;
     st: typeof st;
     gid: typeof gid;

package/types/framework/vnodes.d.ts

@@ -6,11 +6,15 @@ export declare const enum VNodeType {
     Comment = 1,
     Element = 2,
     CustomElement = 3,
-    Static = 4
+    Static = 4,
+    Fragment = 5
 }
-export declare type VNode = VText | VComment | VElement | VCustomElement | VStatic;
-export declare type VParentElement = VElement | VCustomElement;
+export declare type VNode = VText | VComment | VElement | VCustomElement | VStatic | VFragment;
+export declare type VParentElement = VElement | VCustomElement | VFragment;
 export declare type VNodes = Readonly<Array<VNode | null>>;
+export interface BaseVParent {
+    children: VNodes;
+}
 export interface BaseVNode {
     type: VNodeType;
     elm: Node | undefined;
@@ -24,6 +28,11 @@ export interface VStatic extends BaseVNode {
     key: Key;
     fragment: Element;
 }
+export interface VFragment extends BaseVNode, BaseVParent {
+    sel: undefined;
+    type: VNodeType.Fragment;
+    stable: 0 | 1;
+}
 export interface VText extends BaseVNode {
     type: VNodeType.Text;
     sel: undefined;
@@ -34,12 +43,11 @@ export interface VComment extends BaseVNode {
     type: VNodeType.Comment;
     sel: undefined;
     text: string;
-    key: undefined;
+    key: 'c';
 }
-export interface VBaseElement extends BaseVNode {
+export interface VBaseElement extends BaseVNode, BaseVParent {
     sel: string;
     data: VElementData;
-    children: VNodes;
     elm: Element | undefined;
     key: Key;
 }