lwc 2.26.2 → 2.28.0

package/dist/engine-dom/esm/es2017/engine-dom.js

@@ -43,7 +43,7 @@ var assert = /*#__PURE__*/Object.freeze({
  */
 const { assign, create, defineProperties, defineProperty, freeze, getOwnPropertyDescriptor: getOwnPropertyDescriptor$1, getOwnPropertyNames: getOwnPropertyNames$1, getPrototypeOf: getPrototypeOf$1, hasOwnProperty: hasOwnProperty$1, isFrozen, keys, seal, setPrototypeOf, } = Object;
 const { isArray: isArray$1 } = Array;
-const { copyWithin: ArrayCopyWithin, fill: ArrayFill, filter: ArrayFilter, find: ArrayFind, indexOf: ArrayIndexOf, join: ArrayJoin, map: ArrayMap, pop: ArrayPop, push: ArrayPush$1, reduce: ArrayReduce, reverse: ArrayReverse, shift: ArrayShift, slice: ArraySlice, sort: ArraySort, splice: ArraySplice, unshift: ArrayUnshift, forEach, } = Array.prototype;
+const { concat: ArrayConcat$1, copyWithin: ArrayCopyWithin, fill: ArrayFill, filter: ArrayFilter, find: ArrayFind, indexOf: ArrayIndexOf, join: ArrayJoin, map: ArrayMap, pop: ArrayPop, push: ArrayPush$1, reduce: ArrayReduce, reverse: ArrayReverse, shift: ArrayShift, slice: ArraySlice, some: ArraySome, sort: ArraySort, splice: ArraySplice, unshift: ArrayUnshift, forEach, } = Array.prototype;
 const { fromCharCode: StringFromCharCode } = String;
 const { charCodeAt: StringCharCodeAt, replace: StringReplace, slice: StringSlice, toLowerCase: StringToLowerCase, } = String.prototype;
 function isUndefined$1(obj) {
@@ -299,9 +299,9 @@ function htmlPropertyToAttribute(propName) {
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
 // Increment whenever the LWC template compiler changes
-const LWC_VERSION = "2.26.2";
+const LWC_VERSION = "2.28.0";
 const LWC_VERSION_COMMENT_REGEX = /\/\*LWC compiler v([\d.]+)\*\/\s*}/;
-/** version: 2.26.2 */
+/** version: 2.28.0 */
 
 /**
  * Copyright (C) 2018 salesforce.com, inc.
@@ -383,7 +383,7 @@ for (let i = 0, len = ElementPrototypeAriaPropertyNames.length; i < len; i += 1)
         patch$1(propName);
     }
 }
-/** version: 2.26.2 */
+/** version: 2.28.0 */
 
 /**
  * Copyright (C) 2018 salesforce.com, inc.
@@ -463,7 +463,7 @@ function setFeatureFlagForTest(name, value) {
         setFeatureFlag(name, value);
     }
 }
-/** version: 2.26.2 */
+/** version: 2.28.0 */
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -3686,6 +3686,9 @@ function isSameVnode(vnode1, vnode2) {
 function isVCustomElement(vnode) {
     return vnode.type === 3 /* VNodeType.CustomElement */;
 }
+function isVScopedSlotFragment(vnode) {
+    return vnode.type === 6 /* VNodeType.ScopedSlotFragment */;
+}
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -4519,13 +4522,24 @@ function allocateChildren(vnode, vm) {
     shadowMode
   } = vm;
 
+  if (process.env.NODE_ENV !== 'production') {
+    // If any of the children being allocated is a scoped slot fragment, make sure the receiving
+    // component is a light DOM component. This is mainly to validate light dom parent running
+    // in native shadow mode.
+    if (renderMode !== 0
+    /* RenderMode.Light */
+    && ArraySome.call(children, child => !isNull(child) && isVScopedSlotFragment(child))) {
+      logError(`Invalid usage of 'lwc:slot-data' on ${getComponentTag(vm)} tag. Scoped slot content can only be passed to a light dom child.`);
+    }
+  }
+
   if (shadowMode === 1
   /* ShadowMode.Synthetic */
   || renderMode === 0
   /* RenderMode.Light */
   ) {
     // slow path
-    allocateInSlot(vm, children); // save the allocated children in case this vnode is reused.
+    allocateInSlot(vm, children, vnode.owner); // save the allocated children in case this vnode is reused.
 
     vnode.aChildren = children; // every child vnode is now allocated, and the host should receive none directly, it receives them via the shadow!
 
@@ -4561,13 +4575,19 @@ function createViewModelHook(elm, vnode, renderer) {
   return vm;
 }
 
-function allocateInSlot(vm, children) {
-  var _a;
+function allocateInSlot(vm, children, owner) {
+  var _a, _b;
 
   const {
-    cmpSlots: oldSlots
+    cmpSlots: {
+      slotAssignments: oldSlotsMapping
+    }
   } = vm;
-  const cmpSlots = vm.cmpSlots = create(null);
+  const cmpSlotsMapping = create(null);
+  vm.cmpSlots = {
+    owner,
+    slotAssignments: cmpSlotsMapping
+  };
 
   for (let i = 0, len = children.length; i < len; i += 1) {
     const vnode = children[i];
@@ -4579,19 +4599,21 @@ function allocateInSlot(vm, children) {
     let slotName = '';
 
     if (isVBaseElement(vnode)) {
-      slotName = ((_a = vnode.data.attrs) === null || _a === void 0 ? void 0 : _a.slot) || '';
+      slotName = (_b = (_a = vnode.data.attrs) === null || _a === void 0 ? void 0 : _a.slot) !== null && _b !== void 0 ? _b : '';
+    } else if (isVScopedSlotFragment(vnode)) {
+      slotName = vnode.slotName;
     }
 
-    const vnodes = cmpSlots[slotName] = cmpSlots[slotName] || [];
+    const vnodes = cmpSlotsMapping[slotName] = cmpSlotsMapping[slotName] || [];
     ArrayPush$1.call(vnodes, vnode);
   }
 
   if (isFalse(vm.isDirty)) {
     // We need to determine if the old allocation is really different from the new one
     // and mark the vm as dirty
-    const oldKeys = keys(oldSlots);
+    const oldKeys = keys(oldSlotsMapping);
 
-    if (oldKeys.length !== keys(cmpSlots).length) {
+    if (oldKeys.length !== keys(cmpSlotsMapping).length) {
       markComponentAsDirty(vm);
       return;
     }
@@ -4599,15 +4621,15 @@ function allocateInSlot(vm, children) {
     for (let i = 0, len = oldKeys.length; i < len; i += 1) {
       const key = oldKeys[i];
 
-      if (isUndefined$1(cmpSlots[key]) || oldSlots[key].length !== cmpSlots[key].length) {
+      if (isUndefined$1(cmpSlotsMapping[key]) || oldSlotsMapping[key].length !== cmpSlotsMapping[key].length) {
         markComponentAsDirty(vm);
         return;
       }
 
-      const oldVNodes = oldSlots[key];
-      const vnodes = cmpSlots[key];
+      const oldVNodes = oldSlotsMapping[key];
+      const vnodes = cmpSlotsMapping[key];
 
-      for (let j = 0, a = cmpSlots[key].length; j < a; j += 1) {
+      for (let j = 0, a = cmpSlotsMapping[key].length; j < a; j += 1) {
         if (oldVNodes[j] !== vnodes[j]) {
           markComponentAsDirty(vm);
           return;
@@ -4807,6 +4829,18 @@ const SymbolIterator = Symbol.iterator;
 function addVNodeToChildLWC(vnode) {
     ArrayPush$1.call(getVMBeingRendered().velements, vnode);
 }
+// [s]coped [s]lot [f]actory
+function ssf(slotName, factory) {
+    return {
+        type: 6 /* VNodeType.ScopedSlotFragment */,
+        factory,
+        owner: getVMBeingRendered(),
+        elm: undefined,
+        sel: undefined,
+        key: undefined,
+        slotName,
+    };
+}
 // [st]atic node
 function st(fragment, key) {
     return {
@@ -4890,9 +4924,46 @@ function s(slotName, data, children, slotset) {
         assert.isTrue(isArray$1(children), `h() 3rd argument children must be an array.`);
     }
     if (!isUndefined$1(slotset) &&
-        !isUndefined$1(slotset[slotName]) &&
-        slotset[slotName].length !== 0) {
-        children = slotset[slotName];
+        !isUndefined$1(slotset.slotAssignments) &&
+        !isUndefined$1(slotset.slotAssignments[slotName]) &&
+        slotset.slotAssignments[slotName].length !== 0) {
+        children = slotset.slotAssignments[slotName].reduce((accumulator, vnode) => {
+            if (vnode) {
+                const assignedNodeIsScopedSlot = isVScopedSlotFragment(vnode);
+                // The only sniff test for a scoped <slot> element is the presence of `slotData`
+                const isScopedSlotElement = !isUndefined$1(data.slotData);
+                // Check if slot types of parent and child are matching
+                if (assignedNodeIsScopedSlot !== isScopedSlotElement) {
+                    if (process.env.NODE_ENV !== 'production') {
+                        logError(`Mismatched slot types for ${slotName === '' ? '(default)' : slotName} slot. Both parent and child component must use standard type or scoped type for a given slot.`, slotset.owner);
+                    }
+                    // Ignore slot content from parent
+                    return accumulator;
+                }
+                // If the passed slot content is factory, evaluate it and add the produced vnodes
+                if (assignedNodeIsScopedSlot) {
+                    const vmBeingRenderedInception = getVMBeingRendered();
+                    let scopedSlotChildren = [];
+                    // 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
+                    setVMBeingRendered(slotset.owner);
+                    try {
+                        scopedSlotChildren = vnode.factory(data.slotData);
+                    }
+                    finally {
+                        setVMBeingRendered(vmBeingRenderedInception);
+                    }
+                    return ArrayConcat$1.call(accumulator, scopedSlotChildren);
+                }
+                else {
+                    // If the slot content is standard type, the content is static, no additional
+                    // processing needed on the vnode
+                    return ArrayConcat$1.call(accumulator, vnode);
+                }
+            }
+            return accumulator;
+        }, []);
     }
     const vmBeingRendered = getVMBeingRendered();
     const { renderMode, shadowMode } = vmBeingRendered;
@@ -5212,6 +5283,7 @@ const api = freeze({
     gid,
     fid,
     shc,
+    ssf,
 });
 
 /*
@@ -5348,9 +5420,9 @@ function validateSlots(vm, html) {
     }
     const { cmpSlots } = vm;
     const { slots = EmptyArray } = html;
-    for (const slotName in cmpSlots) {
+    for (const slotName in cmpSlots.slotAssignments) {
         // eslint-disable-next-line @lwc/lwc-internal/no-production-assert
-        assert.isTrue(isArray$1(cmpSlots[slotName]), `Slots can only be set to an array, instead received ${toString$1(cmpSlots[slotName])} for slot "${slotName}" in ${vm}.`);
+        assert.isTrue(isArray$1(cmpSlots.slotAssignments[slotName]), `Slots can only be set to an array, instead received ${toString$1(cmpSlots.slotAssignments[slotName])} for slot "${slotName}" in ${vm}.`);
         if (slotName !== '' && ArrayIndexOf.call(slots, slotName) === -1) {
             // TODO [#1297]: this should never really happen because the compiler should always validate
             // eslint-disable-next-line @lwc/lwc-internal/no-production-assert
@@ -5847,7 +5919,9 @@ function createVM(elm, ctor, renderer, options) {
     velements: EmptyArray,
     cmpProps: create(null),
     cmpFields: create(null),
-    cmpSlots: create(null),
+    cmpSlots: {
+      slotAssignments: create(null)
+    },
     oar: create(null),
     cmpTemplate: null,
     hydrated: Boolean(hydrated),
@@ -7256,7 +7330,7 @@ function getComponentConstructor(elm) {
     }
     return ctor;
 }
-/* version: 2.26.2 */
+/* version: 2.28.0 */
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -7530,10 +7604,12 @@ function createScopedRegistry() {
     const pendingRegistryForElement = new WeakMap();
     const definitionForConstructor = new WeakMap();
     const registeredUserCtors = new WeakSet();
+    const registeredPivotCtors = new WeakSet();
     const pivotCtorByTag = new Map();
     const globalDefinitionsByTag = new Map();
     const globalDefinitionsByClass = new Map();
     const awaitingUpgrade = new Map();
+    const pendingWhenDefinedCallbacks = new Map();
     const EMPTY_SET = new Set();
     function createDefinitionRecord(constructor) {
         var _a;
@@ -7639,6 +7715,7 @@ function createScopedRegistry() {
             }
         }
         PivotCtor.observedAttributes = [...registeredDefinition.observedAttributes];
+        registeredPivotCtors.add(PivotCtor);
         return PivotCtor;
     }
     function getNewObservedAttributes(registeredDefinition, pivotDefinition) {
@@ -7772,6 +7849,27 @@ function createScopedRegistry() {
         }
         return createDefinitionRecord(constructor);
     }
+    // Defer a `whenDefined()` callback until an externally-visible custom element is defined
+    function createPendingWhenDefinedCallback(tagName) {
+        return new Promise((resolve) => {
+            let resolvers = pendingWhenDefinedCallbacks.get(tagName);
+            if (isUndefined$1(resolvers)) {
+                resolvers = [];
+                pendingWhenDefinedCallbacks.set(tagName, resolvers);
+            }
+            resolvers.push(resolve);
+        });
+    }
+    // Call any pending `whenDefined()` callbacks
+    function flushPendingWhenDefinedCallbacks(tagName, ctor) {
+        const resolvers = pendingWhenDefinedCallbacks.get(tagName);
+        if (!isUndefined$1(resolvers)) {
+            for (const resolver of resolvers) {
+                resolver(ctor);
+            }
+        }
+        pendingWhenDefinedCallbacks.delete(tagName);
+    }
     const { customElements: nativeRegistry } = window;
     const { define: nativeDefine, whenDefined: nativeWhenDefined, get: nativeGet } = nativeRegistry;
     // patch for the global registry define mechanism
@@ -7826,6 +7924,8 @@ function createScopedRegistry() {
                 }
             }
         }
+        // If anyone called customElements.whenDefined() and is still waiting for a promise resolution, resolve now
+        flushPendingWhenDefinedCallbacks(tagName, constructor);
     };
     CustomElementRegistry.prototype.get = function get(tagName) {
         const NativeCtor = nativeGet.call(nativeRegistry, tagName);
@@ -7834,8 +7934,10 @@ function createScopedRegistry() {
             if (!isUndefined$1(definition)) {
                 return definition.UserCtor; // defined by the patched custom elements registry
             }
-            // TODO [#3073]: return undefined rather than the pivot constructor (NativeCtor)
-            return NativeCtor; // return the pivot constructor or constructor that existed before patching
+            if (registeredPivotCtors.has(NativeCtor)) {
+                return undefined; // pivot constructors should not be observable, return undefined
+            }
+            return NativeCtor; // constructor that existed before patching
         }
     };
     CustomElementRegistry.prototype.whenDefined = function whenDefined(tagName) {
@@ -7844,13 +7946,17 @@ function createScopedRegistry() {
             if (!isUndefined$1(definition)) {
                 return definition.UserCtor;
             }
-            // TODO [#3073]: return undefined rather than the pivot constructor (NativeCtor)
             // In this case, the custom element must have been defined before the registry patches
             // were applied. So return the non-pivot constructor
             if (isUndefined$1(NativeCtor)) {
                 // Chromium bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1335247
                 // We can patch the correct behavior using customElements.get()
-                return nativeGet.call(nativeRegistry, tagName);
+                NativeCtor = nativeGet.call(nativeRegistry, tagName);
+            }
+            if (registeredPivotCtors.has(NativeCtor)) {
+                // Pivot constructors should not be observable. Wait to resolve the promise
+                // if a constructor is ever defined in userland
+                return createPendingWhenDefinedCallback(tagName);
             }
             return NativeCtor;
         });
@@ -8080,7 +8186,7 @@ function rendererFactory(baseRenderer) {
     function isNull(obj) {
         return obj === null;
     }
-    /** version: 2.26.2 */
+    /** version: 2.28.0 */
 
     /*
      * Copyright (c) 2018, salesforce.com, inc.
@@ -8659,6 +8765,6 @@ defineProperty(LightningElement, 'CustomElementConstructor', {
 });
 freeze(LightningElement);
 seal(LightningElement.prototype);
-/* version: 2.26.2 */
+/* version: 2.28.0 */
 
 export { LightningElement, profilerControl as __unstable__ProfilerControl, api$1 as api, deprecatedBuildCustomElementConstructor as buildCustomElementConstructor, createContextProvider, createElement, freezeTemplate, getComponentConstructor, getComponentDef, hydrateComponent, isComponentConstructor, isNodeShadowed as isNodeFromTemplate, parseFragment, parseSVGFragment, readonly, register, registerComponent, registerDecorators, registerTemplate, renderer, rendererFactory, sanitizeAttribute, setFeatureFlag, setFeatureFlagForTest, setHooks, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };