@lwc/engine-core 5.1.0 → 5.1.1-alpha.0

package/dist/framework/modules/attrs.d.ts

@@ -1,3 +1,4 @@
 import { RendererAPI } from '../renderer';
-import { VBaseElement } from '../vnodes';
+import { VBaseElement, VStatic } from '../vnodes';
 export declare function patchAttributes(oldVnode: VBaseElement | null, vnode: VBaseElement, renderer: RendererAPI): void;
+export declare function patchSlotAssignment(oldVnode: VBaseElement | VStatic | null, vnode: VBaseElement | VStatic, renderer: RendererAPI): void;

package/dist/framework/vnodes.d.ts

@@ -40,6 +40,7 @@ export interface VStatic extends BaseVNode {
     readonly fragment: Element;
     readonly parts: VStaticPart[] | undefined;
     elm: Element | undefined;
+    slotAssignment: string | undefined;
 }
 export interface VFragment extends BaseVNode, BaseVParent {
     sel: undefined;
@@ -65,6 +66,7 @@ export interface VBaseElement extends BaseVNode, BaseVParent {
     data: VElementData;
     elm: Element | undefined;
     key: Key;
+    slotAssignment: string | undefined;
 }
 export interface VElement extends VBaseElement {
     type: VNodeType.Element;
@@ -93,9 +95,11 @@ export interface VElementData extends VNodeData {
     readonly external?: boolean;
     readonly ref?: string;
     readonly slotData?: any;
+    readonly slotAssignment?: string;
 }
 export declare function isVBaseElement(vnode: VNode): vnode is VElement | VCustomElement;
 export declare function isSameVnode(vnode1: VNode, vnode2: VNode): boolean;
 export declare function isVCustomElement(vnode: VNode | VBaseElement): vnode is VCustomElement;
 export declare function isVFragment(vnode: VNode): vnode is VFragment;
 export declare function isVScopedSlotFragment(vnode: VNode): vnode is VScopedSlotFragment;
+export declare function isVStatic(vnode: VNode): vnode is VStatic;

package/dist/index.cjs.js

@@ -3507,6 +3507,9 @@ function isVFragment(vnode) {
 function isVScopedSlotFragment(vnode) {
     return vnode.type === 6 /* VNodeType.ScopedSlotFragment */;
 }
+function isVStatic(vnode) {
+    return vnode.type === 4 /* VNodeType.Static */;
+}
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -3555,6 +3558,19 @@ function patchAttributes(oldVnode, vnode, renderer) {
         }
     }
 }
+function patchSlotAssignment(oldVnode, vnode, renderer) {
+    if ((oldVnode === null || oldVnode === void 0 ? void 0 : oldVnode.slotAssignment) === vnode.slotAssignment) {
+        return;
+    }
+    const { elm } = vnode;
+    const { setAttribute, removeAttribute } = renderer;
+    if (shared.isUndefined(vnode.slotAssignment) || shared.isNull(vnode.slotAssignment)) {
+        removeAttribute(elm, 'slot');
+    }
+    else {
+        setAttribute(elm, 'slot', vnode.slotAssignment);
+    }
+}
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -4004,6 +4020,8 @@ function mountElement(vnode, parent, anchor, renderer) {
 }
 function patchStatic(n1, n2, renderer) {
     const elm = (n2.elm = n1.elm);
+    // slotAssignments can only apply to the top level element, never to a static part.
+    patchSlotAssignment(n1, n2, renderer);
     // The `refs` object is blown away in every re-render, so we always need to re-apply them
     applyStaticParts(elm, n2, renderer, false);
 }
@@ -4025,6 +4043,8 @@ function mountStatic(vnode, parent, anchor, renderer) {
             elm[shared.KEY__SHADOW_STATIC] = true;
         }
     }
+    // slotAssignments can only apply to the top level element, never to a static part.
+    patchSlotAssignment(null, vnode, renderer);
     insertNode(elm, parent, anchor, renderer);
     applyStaticParts(elm, vnode, renderer, true);
 }
@@ -4250,6 +4270,7 @@ function patchElementPropsAndAttrsAndRefs$1(oldVnode, vnode, renderer) {
     patchStyleAttribute(oldVnode, vnode, renderer);
     patchAttributes(oldVnode, vnode, renderer);
     patchProps(oldVnode, vnode, renderer);
+    patchSlotAssignment(oldVnode, vnode, renderer);
     // The `refs` object is blown away in every re-render, so we always need to re-apply them
     applyRefs(vnode, vnode.owner);
 }
@@ -4403,7 +4424,7 @@ function createViewModelHook(elm, vnode, renderer) {
     return vm;
 }
 function allocateInSlot(vm, children, owner) {
-    var _a, _b;
+    var _a;
     const { cmpSlots: { slotAssignments: oldSlotsMapping }, } = vm;
     const cmpSlotsMapping = shared.create(null);
     // Collect all slots into cmpSlotsMapping
@@ -4413,8 +4434,8 @@ function allocateInSlot(vm, children, owner) {
             continue;
         }
         let slotName = '';
-        if (isVBaseElement(vnode)) {
-            slotName = (_b = (_a = vnode.data.attrs) === null || _a === void 0 ? void 0 : _a.slot) !== null && _b !== void 0 ? _b : '';
+        if (isVBaseElement(vnode) || isVStatic(vnode)) {
+            slotName = (_a = vnode.slotAssignment) !== null && _a !== void 0 ? _a : '';
         }
         else if (isVScopedSlotFragment(vnode)) {
             slotName = vnode.slotName;
@@ -4684,6 +4705,7 @@ function st(fragment, key, parts) {
         fragment,
         owner,
         parts,
+        slotAssignment: undefined,
     };
     return vnode;
 }
@@ -4728,7 +4750,7 @@ function h(sel, data, children = EmptyArray) {
             }
         });
     }
-    const { key } = data;
+    const { key, slotAssignment } = data;
     const vnode = {
         type: 2 /* VNodeType.Element */,
         sel,
@@ -4737,6 +4759,7 @@ function h(sel, data, children = EmptyArray) {
         elm: undefined,
         key,
         owner: vmBeingRendered,
+        slotAssignment,
     };
     return vnode;
 }
@@ -4761,6 +4784,8 @@ function s(slotName, data, children, slotset) {
         shared.assert.isTrue(shared.isObject(data), `s() 2nd argument data must be an object.`);
         shared.assert.isTrue(shared.isArray(children), `h() 3rd argument children must be an array.`);
     }
+    const vmBeingRendered = getVMBeingRendered();
+    const { renderMode } = vmBeingRendered;
     if (!shared.isUndefined(slotset) &&
         !shared.isUndefined(slotset.slotAssignments) &&
         !shared.isUndefined(slotset.slotAssignments[slotName]) &&
@@ -4783,7 +4808,6 @@ function s(slotName, data, children, slotset) {
                 }
                 // If the passed slot content is factory, evaluate it and add the produced vnodes
                 if (assignedNodeIsScopedSlot) {
-                    const vmBeingRenderedInception = getVMBeingRendered();
                     // Evaluate in the scope of the slot content's owner
                     // if a slotset is provided, there will always be an owner. The only case where owner is
                     // undefined is for root components, but root components cannot accept slotted content
@@ -4797,20 +4821,32 @@ function s(slotName, data, children, slotset) {
                         });
                     }
                     finally {
-                        setVMBeingRendered(vmBeingRenderedInception);
+                        setVMBeingRendered(vmBeingRendered);
                     }
                 }
                 else {
+                    // This block is for standard slots (non-scoped slots)
+                    let clonedVNode;
+                    if (renderMode === 0 /* RenderMode.Light */ &&
+                        (isVBaseElement(vnode) || isVStatic(vnode)) &&
+                        // We only need to copy the vnodes when the slot assignment changes, copying every time causes issues with
+                        // disconnected/connected callback firing.
+                        vnode.slotAssignment !== data.slotAssignment) {
+                        // When the light DOM slot assignment (slot attribute) changes we can't use the same reference
+                        // to the vnode because the current way the diffing algo works, it will replace the original reference
+                        // to the host element with a new one. This means the new element will be mounted and immediately unmounted.
+                        // Creating a copy of the vnode to preserve a reference to the previous host element.
+                        clonedVNode = Object.assign(Object.assign({}, vnode), { slotAssignment: data.slotAssignment });
+                    }
                     // If the slot content is standard type, the content is static, no additional
                     // processing needed on the vnode
-                    shared.ArrayPush.call(newChildren, vnode);
+                    shared.ArrayPush.call(newChildren, clonedVNode !== null && clonedVNode !== void 0 ? clonedVNode : vnode);
                 }
             }
         }
         children = newChildren;
     }
-    const vmBeingRendered = getVMBeingRendered();
-    const { renderMode, shadowMode, apiVersion } = vmBeingRendered;
+    const { shadowMode, apiVersion } = vmBeingRendered;
     if (renderMode === 0 /* RenderMode.Light */) {
         // light DOM slots - backwards-compatible behavior uses flattening, new behavior uses fragments
         if (shared.isAPIFeatureEnabled(2 /* APIFeature.USE_FRAGMENTS_FOR_LIGHT_DOM_SLOTS */, apiVersion)) {
@@ -4852,7 +4888,7 @@ function c(sel, Ctor, data, children = EmptyArray) {
             });
         }
     }
-    const { key } = data;
+    const { key, slotAssignment } = data;
     let elm, aChildren, vm;
     const vnode = {
         type: 3 /* VNodeType.CustomElement */,
@@ -4861,6 +4897,7 @@ function c(sel, Ctor, data, children = EmptyArray) {
         children,
         elm,
         key,
+        slotAssignment,
         ctor: Ctor,
         owner: vmBeingRendered,
         mode: 'open',