lwc 2.36.0 → 2.37.0

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

@@ -329,9 +329,9 @@ function htmlAttributeToProperty(attrName) {
  * 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.36.0";
+const LWC_VERSION = "2.37.0";
 const LWC_VERSION_COMMENT_REGEX = /\/\*LWC compiler v([\d.]+)\*\/\s*}/;
-/** version: 2.36.0 */
+/** version: 2.37.0 */
 
 /**
  * Copyright (C) 2018 salesforce.com, inc.
@@ -351,10 +351,8 @@ const features = {
     ENABLE_WIRE_SYNC_EMIT: null,
     ENABLE_LIGHT_GET_ROOT_NODE_PATCH: null,
     DISABLE_LIGHT_DOM_UNSCOPED_CSS: null,
-    ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY: null,
     ENABLE_FROZEN_TEMPLATE: null,
     DISABLE_ARIA_REFLECTION_POLYFILL: null,
-    ENABLE_PROGRAMMATIC_STYLESHEETS: null,
 };
 if (!_globalThis.lwcRuntimeFlags) {
     Object.defineProperty(_globalThis, 'lwcRuntimeFlags', { value: create(null) });
@@ -410,7 +408,7 @@ function setFeatureFlagForTest(name, value) {
         setFeatureFlag(name, value);
     }
 }
-/** version: 2.36.0 */
+/** version: 2.37.0 */
 
 /**
  * Copyright (C) 2018 salesforce.com, inc.
@@ -474,7 +472,7 @@ function applyAriaReflection(prototype = Element.prototype) {
         }
     }
 }
-/** version: 2.36.0 */
+/** version: 2.37.0 */
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -6239,18 +6237,16 @@ function validateComponentStylesheets(vm, stylesheets) {
 }
 // Validate and flatten any stylesheets defined as `static stylesheets`
 function computeStylesheets(vm, ctor) {
-  if (lwcRuntimeFlags.ENABLE_PROGRAMMATIC_STYLESHEETS) {
-    warnOnStylesheetsMutation(ctor);
-    const {
-      stylesheets
-    } = ctor;
-    if (!isUndefined$1(stylesheets)) {
-      const valid = validateComponentStylesheets(vm, stylesheets);
-      if (valid) {
-        return flattenStylesheets(stylesheets);
-      } else if (process.env.NODE_ENV !== 'production') {
-        logError(`static stylesheets must be an array of CSS stylesheets. Found invalid stylesheets on <${vm.tagName}>`, vm);
-      }
+  warnOnStylesheetsMutation(ctor);
+  const {
+    stylesheets
+  } = ctor;
+  if (!isUndefined$1(stylesheets)) {
+    const valid = validateComponentStylesheets(vm, stylesheets);
+    if (valid) {
+      return flattenStylesheets(stylesheets);
+    } else if (process.env.NODE_ENV !== 'production') {
+      logError(`static stylesheets must be an array of CSS stylesheets. Found invalid stylesheets on <${vm.tagName}>`, vm);
     }
   }
   return null;
@@ -6644,7 +6640,7 @@ function forceRehydration(vm) {
 // The goal of this code is to detect invalid cross-root ARIA references in synthetic shadow DOM.
 // These invalid references should be fixed before the offending components can be migrated to native shadow DOM.
 // When invalid usage is detected, we warn in dev mode and call the reporting API if enabled.
-// See: https://lwc.dev/guide/accessibility#link-ids-and-aria-attributes-from-different-templates
+// See: https://sfdc.co/synthetic-aria
 //
 // Use the unpatched native getElementById/querySelectorAll rather than the synthetic one
 const getElementById = _globalThis[KEY__NATIVE_GET_ELEMENT_BY_ID];
@@ -6671,7 +6667,7 @@ function reportViolation$1(source, target, attrName) {
         // Avoid excessively logging to the console in the case of duplicates.
         logWarnOnce(`Element <${source.tagName.toLowerCase()}> uses attribute "${attrName}" to reference element ` +
             `<${target.tagName.toLowerCase()}>, which is not in the same shadow root. This will break in native shadow DOM. ` +
-            `For details, see: https://lwc.dev/guide/accessibility#link-ids-and-aria-attributes-from-different-templates`, vm);
+            `For details, see: https://sfdc.co/synthetic-aria`, vm);
     }
 }
 function parseIdRefAttributeValue(attrValue) {
@@ -6825,7 +6821,7 @@ function checkAndReportViolation(elm, prop) {
   if (!isLightningElement(elm)) {
     const vm = findVM(elm);
     if (process.env.NODE_ENV !== 'production') {
-      logWarnOnce(`Element <${elm.tagName.toLowerCase()}> ` + (isUndefined$1(vm) ? '' : `owned by <${vm.elm.tagName.toLowerCase()}> `) + `uses non-standard property "${prop}". This will be removed in a future version of LWC. ` + `See https://lwc.dev/guide/accessibility#deprecated-aria-reflected-properties`);
+      logWarnOnce(`Element <${elm.tagName.toLowerCase()}> ` + (isUndefined$1(vm) ? '' : `owned by <${vm.elm.tagName.toLowerCase()}> `) + `uses non-standard property "${prop}". This will be removed in a future version of LWC. ` + `See https://sfdc.co/deprecated-aria`);
     }
     report(2 /* ReportingEventId.NonStandardAriaReflection */, {
       tagName: vm === null || vm === void 0 ? void 0 : vm.tagName,
@@ -7395,7 +7391,7 @@ function getOriginalArrayMethod(prop) {
 }
 function reportViolation(type, eventId, prop) {
   if (process.env.NODE_ENV !== 'production') {
-    logWarnOnce(`Mutating the "${prop}" property on a ${type} ` + `is deprecated and will be removed in a future version of LWC. ` + `See: https://lwc.dev/guide/css#deprecated-template-mutation`);
+    logWarnOnce(`Mutating the "${prop}" property on a ${type} ` + `is deprecated and will be removed in a future version of LWC. ` + `See: https://sfdc.co/template-mutation`);
   }
   report(eventId, {
     propertyName: prop
@@ -7575,7 +7571,7 @@ function getComponentConstructor(elm) {
     }
     return ctor;
 }
-/* version: 2.36.0 */
+/* version: 2.37.0 */
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -7918,545 +7914,6 @@ const createCustomElementUsingUpgradableConstructor = (tagName, upgradeCallback,
     }
 };
 
-/*
- * Copyright (c) 2020, salesforce.com, inc.
- * All rights reserved.
- * SPDX-License-Identifier: MIT
- * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
- */
-/**
- * Create a scoped registry, i.e. a function that can create custom elements whose tag names
- * do not conflict with third-party custom elements having the same tag name.
- */
-function createScopedRegistry() {
-    if (!hasCustomElements) {
-        // This code should never be reached, because we don't use the pivot registry if
-        // custom elements are unavailable.
-        throw new Error('Custom elements are not supported in this environment.');
-    }
-    const { HTMLElement: NativeHTMLElement } = window;
-    const { hasAttribute: nativeHasAttribute, setAttribute: nativeSetAttribute, removeAttribute: nativeRemoveAttribute, getAttribute: nativeGetAttribute, } = NativeHTMLElement.prototype;
-    const definitionForElement = new WeakMap();
-    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;
-        const { connectedCallback, disconnectedCallback, formAssociatedCallback, formDisabledCallback, formResetCallback, formStateRestoreCallback, adoptedCallback, attributeChangedCallback, } = constructor.prototype;
-        const formAssociated = Boolean(constructor.formAssociated);
-        const observedAttributes = new Set((_a = constructor.observedAttributes) !== null && _a !== void 0 ? _a : []);
-        return {
-            UserCtor: constructor,
-            PivotCtor: undefined,
-            connectedCallback,
-            disconnectedCallback,
-            formAssociatedCallback,
-            formDisabledCallback,
-            formResetCallback,
-            formStateRestoreCallback,
-            adoptedCallback,
-            attributeChangedCallback,
-            observedAttributes,
-            formAssociated,
-        };
-    }
-    // Helper to create stand-in element for each tagName registered that delegates out to the registry for the given
-    // element. Note that the `registeredDefinition` represents the constructor that was used to register during
-    // `customElements.define()`. Whereas the `pivotDefinition` represents the constructor that is passed when the pivot
-    // constructor is invoked with another constructor.
-    function createPivotingClass(tagName, registeredDefinition) {
-        class PivotCtor extends NativeHTMLElement {
-            constructor(UserCtor) {
-                // This constructor can only be invoked by:
-                // a) the browser instantiating  an element from parsing or via document.createElement.
-                // b) LWC new PivotClass (This constructor is NOT observable/accessible in user-land).
-                // b) new UserClass.
-                // When LWC instantiates it, it will pass the upgrading definition as an argument
-                // If the caller signals via UserCtor that this is in fact a controlled
-                // definition, we use that one, otherwise fallback to the global
-                // internal registry.
-                super();
-                const userCtorIsDefined = !isUndefined$1(UserCtor);
-                if (userCtorIsDefined) {
-                    if (!isConstructor(UserCtor)) {
-                        throw new TypeError(`Failed to create custom element: the provided constructor is not a constructor.`);
-                    }
-                    if (!registeredUserCtors.has(UserCtor)) {
-                        throw new Error(`Failed to create custom element: the provided constructor is unregistered: ${UserCtor.name}.`);
-                    }
-                }
-                const definition = userCtorIsDefined
-                    ? getOrCreateDefinitionForConstructor(UserCtor)
-                    : globalDefinitionsByTag.get(tagName);
-                if (!isUndefined$1(definition)) {
-                    internalUpgrade(this, registeredDefinition, definition);
-                }
-                else {
-                    // This is the case in which there is no global definition, and
-                    // it is not handled by LWC (otherwise it will have a valid UserCtor)
-                    // so we need to add it to the pending queue just in case it eventually
-                    // gets defined in the global registry.
-                    pendingRegistryForElement.set(this, registeredDefinition);
-                }
-            }
-            connectedCallback() {
-                var _a;
-                const definition = definitionForElement.get(this);
-                if (!isUndefined$1(definition)) {
-                    // Delegate out to user callback
-                    (_a = definition.connectedCallback) === null || _a === void 0 ? void 0 : _a.call(this);
-                }
-                else {
-                    // Register for upgrade when defined (only when connected, so we don't leak)
-                    let awaiting = awaitingUpgrade.get(tagName);
-                    if (isUndefined$1(awaiting)) {
-                        awaitingUpgrade.set(tagName, (awaiting = new Set()));
-                    }
-                    awaiting.add(this);
-                }
-            }
-            disconnectedCallback() {
-                var _a;
-                const definition = definitionForElement.get(this);
-                if (!isUndefined$1(definition)) {
-                    // Delegate out to user callback
-                    (_a = definition.disconnectedCallback) === null || _a === void 0 ? void 0 : _a.call(this);
-                }
-                else {
-                    // Un-register for upgrade when defined (so we don't leak)
-                    const awaiting = awaitingUpgrade.get(tagName);
-                    // At this point, awaiting should never be undefined, because connectedCallback
-                    // must have been called before disconnectedCallback. But just to be safe, we check
-                    if (!isUndefined$1(awaiting)) {
-                        awaiting.delete(this);
-                    }
-                }
-            }
-            formAssociatedCallback(form) {
-                var _a;
-                const definition = definitionForElement.get(this);
-                (_a = definition === null || definition === void 0 ? void 0 : definition.formAssociatedCallback) === null || _a === void 0 ? void 0 : _a.call(this, form);
-            }
-            formDisabledCallback(disabled) {
-                var _a;
-                const definition = definitionForElement.get(this);
-                (_a = definition === null || definition === void 0 ? void 0 : definition.formDisabledCallback) === null || _a === void 0 ? void 0 : _a.call(this, disabled);
-            }
-            formResetCallback() {
-                var _a;
-                const definition = definitionForElement.get(this);
-                (_a = definition === null || definition === void 0 ? void 0 : definition.formResetCallback) === null || _a === void 0 ? void 0 : _a.call(this);
-            }
-            formStateRestoreCallback(state, mode) {
-                var _a;
-                const definition = definitionForElement.get(this);
-                (_a = definition === null || definition === void 0 ? void 0 : definition.formStateRestoreCallback) === null || _a === void 0 ? void 0 : _a.call(this, state, mode);
-            }
-            adoptedCallback() {
-                var _a;
-                const definition = definitionForElement.get(this);
-                (_a = definition === null || definition === void 0 ? void 0 : definition.adoptedCallback) === null || _a === void 0 ? void 0 : _a.call(this);
-            }
-            attributeChangedCallback(name, oldValue, newValue) {
-                var _a;
-                const definition = definitionForElement.get(this);
-                // if both definitions are the same, then the observedAttributes is the same,
-                // but if they are different, only if the runtime definition has the attribute
-                // marked as observed, then it should invoke attributeChangedCallback.
-                if (registeredDefinition === definition ||
-                    (definition === null || definition === void 0 ? void 0 : definition.observedAttributes.has(name))) {
-                    (_a = definition.attributeChangedCallback) === null || _a === void 0 ? void 0 : _a.apply(this, [name, oldValue, newValue]);
-                }
-            }
-        }
-        PivotCtor.observedAttributes = [...registeredDefinition.observedAttributes];
-        // TODO [#3000]: support case where registeredDefinition is not form-associated, but later definition is.
-        PivotCtor.formAssociated = registeredDefinition.formAssociated;
-        registeredPivotCtors.add(PivotCtor);
-        return PivotCtor;
-    }
-    function getNewObservedAttributes(registeredDefinition, pivotDefinition) {
-        const { observedAttributes, attributeChangedCallback } = pivotDefinition;
-        if (observedAttributes.size === 0 || isUndefined$1(attributeChangedCallback)) {
-            // This instance does not need to observe any attributes, no need to patch
-            return EMPTY_SET;
-        }
-        // Natively, the attributes observed by the registered definition are going to be taken
-        // care of by the browser, only the difference between the two sets has to be taken
-        // care by the patched version.
-        return new Set([...pivotDefinition.observedAttributes].filter((x) => !registeredDefinition.observedAttributes.has(x)));
-    }
-    function throwAsyncError(error) {
-        // Per native custom element behavior, errors thrown in attributeChangedCallback
-        // become unhandled async errors. We use setTimeout() instead of Promise.resolve()
-        // to make it an unhandled error rather than an unhandled rejection.
-        setTimeout(() => {
-            throw error;
-        });
-    }
-    // Helper to patch `setAttribute`/`getAttribute` to implement `attributeChangedCallback`.
-    // Why is this necessary? Well basically, you can't change the `observedAttributes` after
-    // a custom element is defined. So with pivots, if two classes share the same tag name,
-    // and the second class observes attributes that aren't observed by the first one,
-    // then those attributes can never be observed by the native `observedAttributes` system.
-    // So we have to simulate it by patching `getAttribute`/`removeAttribute`. Note that
-    // we only do this when absolutely necessary, though; i.e. because we've determined
-    // that we aren't observing the attributes we need to.
-    function patchAttributes(instance, registeredDefinition, pivotDefinition) {
-        const newObservedAttributes = getNewObservedAttributes(registeredDefinition, pivotDefinition);
-        if (newObservedAttributes.size === 0) {
-            return;
-        }
-        const { attributeChangedCallback } = pivotDefinition;
-        // Patch the instance.
-        // Note we use the native `getAttribute` rather than the super's `getAttribute` because
-        // we don't actually want it to be observable that we're calling `getAttribute` from
-        // `setAttribute` and `removeAttribute`.
-        // TODO [#2994]: this should handle reflected properties such as `ariaLabel` and `role`.
-        defineProperties(instance, {
-            setAttribute: {
-                value: function setAttribute(name, value) {
-                    if (newObservedAttributes.has(name)) {
-                        const old = nativeGetAttribute.call(this, name);
-                        nativeSetAttribute.call(this, name, value);
-                        try {
-                            attributeChangedCallback.call(this, name, old, value + '');
-                        }
-                        catch (error) {
-                            throwAsyncError(error);
-                        }
-                    }
-                    else {
-                        nativeSetAttribute.call(this, name, value);
-                    }
-                },
-                writable: true,
-                enumerable: true,
-                configurable: true,
-            },
-            removeAttribute: {
-                value: function removeAttribute(name) {
-                    if (newObservedAttributes.has(name)) {
-                        const old = nativeGetAttribute.call(this, name);
-                        nativeRemoveAttribute.call(this, name);
-                        try {
-                            attributeChangedCallback.call(this, name, old, null);
-                        }
-                        catch (error) {
-                            throwAsyncError(error);
-                        }
-                    }
-                    else {
-                        nativeRemoveAttribute.call(this, name);
-                    }
-                },
-                writable: true,
-                enumerable: true,
-                configurable: true,
-            },
-        });
-    }
-    function patchAttributesDuringUpgrade(instance, registeredDefinition, pivotDefinition) {
-        // The below case patches observed attributes for the case where the HTML element is upgraded
-        // from a pre-existing one in the DOM.
-        const newObservedAttributes = getNewObservedAttributes(registeredDefinition, pivotDefinition);
-        if (getNewObservedAttributes(registeredDefinition, pivotDefinition).size === 0) {
-            return;
-        }
-        const { attributeChangedCallback } = pivotDefinition;
-        // Approximate observedAttributes from the user class, but only for the new observed attributes
-        newObservedAttributes.forEach((name) => {
-            if (nativeHasAttribute.call(instance, name)) {
-                const newValue = nativeGetAttribute.call(instance, name);
-                attributeChangedCallback.call(instance, name, null, newValue);
-            }
-        });
-    }
-    // User extends this HTMLElement, which returns the CE being upgraded
-    let upgradingInstance;
-    // Helper to upgrade an instance with a CE definition using "constructor call trick"
-    function internalUpgrade(instance, registeredDefinition, pivotDefinition) {
-        setPrototypeOf(instance, pivotDefinition.UserCtor.prototype);
-        definitionForElement.set(instance, pivotDefinition);
-        // attributes patches when needed
-        if (pivotDefinition !== registeredDefinition) {
-            patchAttributes(instance, registeredDefinition, pivotDefinition);
-        }
-        // Tricking the construction path to believe that a new instance is being created,
-        // that way it will execute the super initialization mechanism but the HTMLElement
-        // constructor will reuse the instance by returning the upgradingInstance.
-        // This is by far the most important piece of the puzzle
-        upgradingInstance = instance;
-        // By `new`ing the UserCtor, we now jump to the constructor for the overridden global HTMLElement
-        // The reason this happens is that the UserCtor extends HTMLElement, so it calls the `super()`.
-        // Note that `upgradingInstance` is explicitly handled in the HTMLElement constructor.
-        new pivotDefinition.UserCtor();
-        patchAttributesDuringUpgrade(instance, registeredDefinition, pivotDefinition);
-    }
-    function isConstructor(constructor) {
-        return isFunction$1(constructor) && isObject(constructor.prototype);
-    }
-    function getOrCreateDefinitionForConstructor(constructor) {
-        if (!isConstructor(constructor)) {
-            throw new TypeError('The referenced constructor is not a constructor.');
-        }
-        const definition = definitionForConstructor.get(constructor);
-        if (!isUndefined$1(definition)) {
-            return definition;
-        }
-        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
-    CustomElementRegistry.prototype.define = function define(tagName, constructor, options) {
-        if (options && options.extends) {
-            // TODO [#2983]: should we support `extends`?
-            throw new DOMException('NotSupportedError: "extends" key in customElements.define() options is not supported.');
-        }
-        if (globalDefinitionsByTag.has(tagName)) {
-            throw new DOMException(`Failed to execute 'define' on 'CustomElementRegistry': the name "${tagName}" has already been used with this registry`);
-        }
-        if (!isUndefined$1(globalDefinitionsByClass.get(constructor))) {
-            throw new DOMException(`Failed to execute 'define' on 'CustomElementRegistry': this constructor has already been used with this registry`);
-        }
-        const definition = getOrCreateDefinitionForConstructor(constructor);
-        registeredUserCtors.add(constructor);
-        let PivotCtor = pivotCtorByTag.get(tagName);
-        if (isUndefined$1(PivotCtor)) {
-            PivotCtor = createPivotingClass(tagName, definition);
-            // Register a pivoting class which will handle global registry initializations
-            nativeDefine.call(nativeRegistry, tagName, PivotCtor);
-        }
-        // Only cache after nativeDefine has been called, because if it throws an error
-        // (e.g. for an invalid tag name), then we don't want to cache anything.
-        definitionForConstructor.set(constructor, definition);
-        pivotCtorByTag.set(tagName, PivotCtor);
-        globalDefinitionsByTag.set(tagName, definition);
-        globalDefinitionsByClass.set(constructor, definition);
-        // For globally defined custom elements, the definition associated
-        // to the UserCtor has a back-pointer to PivotCtor in case the user
-        // new the UserCtor, so we know how to create the underlying element.
-        definition.PivotCtor = PivotCtor;
-        // Upgrade any elements created in this scope before customElements.define
-        // was called, which should be exhibited by the following steps:
-        // 1) LWC registers a tagName for an LWC component.
-        // 2) Element with same tagName is created with document.createElement()
-        //    and inserted into DOM.
-        // 3) customElements.define() is called with tagName and non-LWC constructor.
-        // This requires immediate upgrade when the new global tagName is defined.
-        const awaiting = awaitingUpgrade.get(tagName);
-        if (!isUndefined$1(awaiting)) {
-            awaitingUpgrade.delete(tagName);
-            for (const element of awaiting) {
-                const registeredDefinition = pendingRegistryForElement.get(element);
-                // At this point, registeredDefinition should never be undefined because awaitingUpgrade
-                // is only populated when we haven't run internalUpgrade yet, and we only populate
-                // pendingRegistryForElement when internalUpgrade hasn't run yet.
-                // But just to be safe, we check.
-                if (!isUndefined$1(registeredDefinition)) {
-                    pendingRegistryForElement.delete(element);
-                    internalUpgrade(element, registeredDefinition, definition);
-                }
-            }
-        }
-        // 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);
-        if (!isUndefined$1(NativeCtor)) {
-            const definition = globalDefinitionsByTag.get(tagName);
-            if (!isUndefined$1(definition)) {
-                return definition.UserCtor; // defined by the patched custom elements registry
-            }
-            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) {
-        return nativeWhenDefined.call(nativeRegistry, tagName).then((NativeCtor) => {
-            const definition = globalDefinitionsByTag.get(tagName);
-            if (!isUndefined$1(definition)) {
-                return definition.UserCtor;
-            }
-            // 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()
-                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;
-        });
-    };
-    // This constructor is invoked when we call `new pivotDefinition.UserCtor()`
-    // @ts-ignore
-    window.HTMLElement = function HTMLElement() {
-        // Upgrading case: the pivoting class constructor was run by the browser's
-        // native custom elements and we're in the process of running the
-        // "constructor-call trick" on the natively constructed instance, so just
-        // return that here.
-        // This code path is also called when LWC `new`s a PivotCtor.
-        const instance = upgradingInstance;
-        if (!isUndefined$1(instance)) {
-            upgradingInstance = undefined;
-            return instance;
-        }
-        // Construction case: we need to construct the pivoting instance and return it.
-        // This is possible when the user register it via global registry and instantiate
-        // it via `new Ctor()`.
-        const { constructor } = this;
-        const definition = globalDefinitionsByClass.get(constructor);
-        if (isUndefined$1(definition) || isUndefined$1(definition.PivotCtor)) {
-            // This code path is hit if someone `new`s a class that extends `HTMLElement` without
-            // doing `customElements.define()` first. This matches native browser behavior:
-            // https://stackoverflow.com/a/61883392
-            throw new TypeError('Illegal constructor');
-        }
-        // This constructor is ONLY invoked when it is the user instantiating
-        // an element via new Ctor while Ctor is a registered global constructor.
-        const { PivotCtor, UserCtor } = definition;
-        return new PivotCtor(UserCtor);
-    };
-    HTMLElement.prototype = NativeHTMLElement.prototype;
-    /**
-     * Create a new PivotConstructor for the given tagName, which is capable of being constructed
-     * with a UserConstructor defining the behavior. Passing in the UserConstructor here
-     * is a hint that can be used when registering a custom element with the global custom elements
-     * registry for the first time, which provides certain optimizations. It also marks the UserConstructor
-     * as "safe" to be used when passed in to a PivotConstructor.
-     *
-     * @param tagName - element tag name
-     * @param UserCtor - userland custom element constructor
-     * @returns a new custom element constructor
-     */
-    return function createPivotConstructor(tagName, UserCtor) {
-        tagName = StringToLowerCase.call(tagName);
-        let PivotCtor = pivotCtorByTag.get(tagName);
-        if (isUndefined$1(PivotCtor)) {
-            const definition = getOrCreateDefinitionForConstructor(UserCtor);
-            PivotCtor = createPivotingClass(tagName, definition);
-            // Register a pivoting class as a global custom element
-            nativeDefine.call(nativeRegistry, tagName, PivotCtor);
-            definition.PivotCtor = PivotCtor;
-            // Only cache after nativeDefine has been called, because if it throws an error
-            // (e.g. for an invalid tag name), then we don't want to cache anything.
-            definitionForConstructor.set(UserCtor, definition);
-            pivotCtorByTag.set(tagName, PivotCtor);
-        }
-        // Register a UserConstructor as "safe" to be used within a PivotConstructor
-        registeredUserCtors.add(UserCtor);
-        return PivotCtor;
-    };
-}
-
-/*
- * Copyright (c) 2018, salesforce.com, inc.
- * All rights reserved.
- * SPDX-License-Identifier: MIT
- * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
- */
-let createScopedConstructor;
-let CachedHTMLElement;
-// We only call `createScopedRegistry()` if the browser supports custom elements and
-// ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY is enabled, because we don't want to patch eagerly if the flag is disabled
-// or we're in a legacy browser.
-if (lwcRuntimeFlags.ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY) {
-  if (hasCustomElements) {
-    // If ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY is true, then we eagerly initialize the scoped registry.
-    // It's assumed that ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY is set *before* LWC loads, and never changes.
-    //
-    // Why not lazily patch in `createCustomElement`? Well, this could lead to subtle bugs, e.g.:
-    //
-    // 1. LWC loads
-    // 2. `const Ctor = class extends HTMLElement {}`
-    // 3. `lwc.createElement(...)` // here we lazily patch
-    // 4. `customElements.define('x-foo', Ctor)` // throws error because class is bound to stale HTMLElement
-    //
-    // To reduce the risk of this, it's safer to patch the registry eagerly.
-    createScopedConstructor = createScopedRegistry();
-    // It's important to cache window.HTMLElement here. Otherwise, someone else could overwrite window.HTMLElement (e.g.
-    // another copy of the engine, or another scoping implementation) and we would get "Illegal constructor" errors
-    // because the HTMLElement prototypes are mixed up.
-    //
-    // The reason this happens is that the scoping implementation overwrites window.HTMLElement and expects to work
-    // with that version of HTMLElement. So if you load two copies of the scoping implementation in the same environment,
-    // the second one may accidentally grab window.HTMLElement from the first (when doing `class extends HTMLElement`).
-    // Caching avoids this problem.
-    CachedHTMLElement = window.HTMLElement;
-  }
-}
-// Creates a constructor that is intended to be used as the UserConstructor in a scoped (pivots) registry.
-// In this case, the upgradeCallback only needs to be defined once because we create these on-demand,
-// multiple times per tag name.
-const createUserConstructor = (HTMLElementToExtend, upgradeCallback, connectedCallback, disconnectedCallback) => {
-  // TODO [#2972]: this class should expose observedAttributes as necessary
-  return class UserConstructor extends HTMLElementToExtend {
-    constructor() {
-      super();
-      upgradeCallback(this);
-    }
-    // Note that there is no need to do the "avoid defining connectedCallback/disconnectedCallback" optimization
-    // here, because in create-scoped-registry.ts, the registered class will always have these callbacks anyway.
-    // See: https://github.com/salesforce/lwc/pull/3162#issuecomment-1311851174
-    connectedCallback() {
-      if (!isUndefined$1(connectedCallback)) {
-        connectedCallback(this);
-      }
-    }
-    disconnectedCallback() {
-      if (!isUndefined$1(disconnectedCallback)) {
-        disconnectedCallback(this);
-      }
-    }
-  };
-};
-function createCustomElementScoped(tagName, upgradeCallback, connectedCallback, disconnectedCallback) {
-  if (isUndefined$1(createScopedConstructor) || isUndefined$1(CachedHTMLElement)) {
-    // This error should be impossible to hit
-    throw new Error('The flag ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY must be set to true to use this feature');
-  }
-  const UserConstructor = createUserConstructor(CachedHTMLElement, upgradeCallback, connectedCallback, disconnectedCallback);
-  const ScopedConstructor = createScopedConstructor(tagName, UserConstructor);
-  return new ScopedConstructor(UserConstructor);
-}
-
 /*
  * Copyright (c) 2018, salesforce.com, inc.
  * All rights reserved.
@@ -8464,29 +7921,22 @@ function createCustomElementScoped(tagName, upgradeCallback, connectedCallback,
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
 /**
- * We have three modes for creating custom elements:
+ * We have two modes for creating custom elements:
  *
  * 1. Compat (legacy) browser support (e.g. IE11). Totally custom, doesn't rely on native browser APIs.
  * 2. "Upgradable constructor" custom element. This allows us to have two LWC components with the same tag name,
  *    via a trick: every custom element constructor we define in the registry is basically the same. It's essentially
  *    a dummy `class extends HTMLElement` that accepts an `upgradeCallback` in its constructor ("upgradable
  *    constructor"), which allows us to have completely customized functionality for different components.
- * 3. "Scoped" (or "pivot") custom elements. This relies on a sophisticated system that emulates the "scoped custom
- *    elements registry" proposal, with support for avoiding conflicts in tag names both between LWC components and
- *    between LWC components and third-party elements. This uses a similar trick to #2, but is much more complex
- *    because it must patch the global `customElements` and `HTMLElement` objects.
  */
 let createCustomElement;
 if (hasCustomElements) {
-  if (lwcRuntimeFlags.ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY) {
-    createCustomElement = createCustomElementScoped;
-  } else {
     // use the global registry, with an upgradable constructor for the defined custom element
     createCustomElement = createCustomElementUsingUpgradableConstructor;
-  }
-} else {
-  // no registry available here
-  createCustomElement = createCustomElementCompat;
+}
+else {
+    // no registry available here
+    createCustomElement = createCustomElementCompat;
 }
 
 /*
@@ -8549,7 +7999,7 @@ function rendererFactory(baseRenderer) {
     function isNull(obj) {
         return obj === null;
     }
-    /** version: 2.36.0 */
+    /** version: 2.37.0 */
 
     /*
      * Copyright (c) 2018, salesforce.com, inc.
@@ -9110,6 +8560,6 @@ defineProperty(LightningElement, 'CustomElementConstructor', {
 });
 freeze(LightningElement);
 seal(LightningElement.prototype);
-/* version: 2.36.0 */
+/* version: 2.37.0 */
 
 export { LightningElement, profilerControl as __unstable__ProfilerControl, reportingControl as __unstable__ReportingControl, 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 };