lwc 2.33.0 → 2.35.0

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

@@ -45,7 +45,7 @@ const { assign, create, defineProperties, defineProperty, freeze, getOwnProperty
 const { isArray: isArray$1 } = Array;
 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;
+const { charCodeAt: StringCharCodeAt, replace: StringReplace, split: StringSplit, slice: StringSlice, toLowerCase: StringToLowerCase, } = String.prototype;
 function isUndefined$1(obj) {
     return obj === undefined;
 }
@@ -182,6 +182,19 @@ const { AriaAttrNameToPropNameMap, AriaPropNameToAttrNameMap } = /*@__PURE__*/ (
     });
     return { AriaAttrNameToPropNameMap, AriaPropNameToAttrNameMap };
 })();
+// These attributes take either an ID or a list of IDs as values.
+// This includes aria-* attributes as well as the special non-ARIA "for" attribute
+const ID_REFERENCING_ATTRIBUTES_SET = new Set([
+    'aria-activedescendant',
+    'aria-controls',
+    'aria-describedby',
+    'aria-details',
+    'aria-errormessage',
+    'aria-flowto',
+    'aria-labelledby',
+    'aria-owns',
+    'for',
+]);
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -237,6 +250,8 @@ const KEY__SHADOW_STATIC = '$shadowStaticNode$';
 const KEY__SHADOW_TOKEN = '$shadowToken$';
 const KEY__SYNTHETIC_MODE = '$$lwc-synthetic-mode';
 const KEY__SCOPED_CSS = '$scoped$';
+const KEY__NATIVE_GET_ELEMENT_BY_ID = '$nativeGetElementById$';
+const KEY__NATIVE_QUERY_SELECTOR_ALL = '$nativeQuerySelectorAll$';
 const XML_NAMESPACE = 'http://www.w3.org/XML/1998/namespace';
 const SVG_NAMESPACE = 'http://www.w3.org/2000/svg';
 const XLINK_NAMESPACE = 'http://www.w3.org/1999/xlink';
@@ -344,9 +359,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.33.0";
+const LWC_VERSION = "2.35.0";
 const LWC_VERSION_COMMENT_REGEX = /\/\*LWC compiler v([\d.]+)\*\/\s*}/;
-/** version: 2.33.0 */
+/** version: 2.35.0 */
 
 /**
  * Copyright (C) 2018 salesforce.com, inc.
@@ -369,6 +384,7 @@ const features = {
     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) });
@@ -422,7 +438,7 @@ function setFeatureFlagForTest(name, value) {
         setFeatureFlag(name, value);
     }
 }
-/** version: 2.33.0 */
+/** version: 2.35.0 */
 
 /**
  * Copyright (C) 2018 salesforce.com, inc.
@@ -486,7 +502,7 @@ function applyAriaReflection(prototype = Element.prototype) {
         }
     }
 }
-/** version: 2.33.0 */
+/** version: 2.35.0 */
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -554,94 +570,167 @@ if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
-let nextTickCallbackQueue = [];
-const SPACE_CHAR = 32;
-const EmptyObject = seal(create(null));
-const EmptyArray = seal([]);
-function flushCallbackQueue() {
-    if (process.env.NODE_ENV !== 'production') {
-        if (nextTickCallbackQueue.length === 0) {
-            throw new Error(`Internal Error: If callbackQueue is scheduled, it is because there must be at least one callback on this pending queue.`);
+/** Callbacks to invoke when reporting is enabled **/
+const onReportingEnabledCallbacks = [];
+/** The currently assigned reporting dispatcher. */
+let currentDispatcher$1 = noop;
+/**
+ * Whether reporting is enabled.
+ *
+ * Note that this may seem redundant, given you can just check if the currentDispatcher is undefined,
+ * but it turns out that Terser only strips out unused code if we use this explicit boolean.
+ */
+let enabled$1 = false;
+const reportingControl = {
+    /**
+     * Attach a new reporting control (aka dispatcher).
+     *
+     * @param dispatcher - reporting control
+     */
+    attachDispatcher(dispatcher) {
+        enabled$1 = true;
+        currentDispatcher$1 = dispatcher;
+        for (const callback of onReportingEnabledCallbacks) {
+            try {
+                callback();
+            }
+            catch (err) {
+                // This should never happen. But if it does, we don't want one callback to cause another to fail
+                // eslint-disable-next-line no-console
+                console.error('Could not invoke callback', err);
+            }
         }
+        onReportingEnabledCallbacks.length = 0; // clear the array
+    },
+    /**
+     * Detach the current reporting control (aka dispatcher).
+     */
+    detachDispatcher() {
+        enabled$1 = false;
+        currentDispatcher$1 = noop;
+    },
+};
+/**
+ * Call a callback when reporting is enabled, or immediately if reporting is already enabled.
+ * Will only ever be called once.
+ * @param callback
+ */
+function onReportingEnabled(callback) {
+    if (enabled$1) {
+        // call immediately
+        callback();
     }
-    const callbacks = nextTickCallbackQueue;
-    nextTickCallbackQueue = []; // reset to a new queue
-    for (let i = 0, len = callbacks.length; i < len; i += 1) {
-        callbacks[i]();
+    else {
+        // call later
+        onReportingEnabledCallbacks.push(callback);
     }
 }
-function addCallbackToNextTick(callback) {
-    if (process.env.NODE_ENV !== 'production') {
-        if (!isFunction$1(callback)) {
-            throw new Error(`Internal Error: addCallbackToNextTick() can only accept a function callback`);
-        }
-    }
-    if (nextTickCallbackQueue.length === 0) {
-        Promise.resolve().then(flushCallbackQueue);
+/**
+ * Report to the current dispatcher, if there is one.
+ * @param reportingEventId
+ * @param vm
+ */
+function report(reportingEventId, vm) {
+    if (enabled$1) {
+        currentDispatcher$1(reportingEventId, vm.tagName, vm.idx);
     }
-    ArrayPush$1.call(nextTickCallbackQueue, callback);
 }
-function guid() {
-    function s4() {
-        return Math.floor((1 + Math.random()) * 0x10000)
-            .toString(16)
-            .substring(1);
+
+/*
+ * 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
+ */
+function getComponentTag(vm) {
+    return `<${StringToLowerCase.call(vm.tagName)}>`;
+}
+// TODO [#1695]: Unify getComponentStack and getErrorComponentStack
+function getComponentStack(vm) {
+    const stack = [];
+    let prefix = '';
+    while (!isNull(vm.owner)) {
+        ArrayPush$1.call(stack, prefix + getComponentTag(vm));
+        vm = vm.owner;
+        prefix += '\t';
     }
-    return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
+    return ArrayJoin.call(stack, '\n');
 }
-// Borrowed from Vue template compiler.
-// https://github.com/vuejs/vue/blob/531371b818b0e31a989a06df43789728f23dc4e8/src/platforms/web/util/style.js#L5-L16
-const DECLARATION_DELIMITER = /;(?![^(]*\))/g;
-const PROPERTY_DELIMITER = /:(.+)/;
-function parseStyleText(cssText) {
-    const styleMap = {};
-    const declarations = cssText.split(DECLARATION_DELIMITER);
-    for (const declaration of declarations) {
-        if (declaration) {
-            const [prop, value] = declaration.split(PROPERTY_DELIMITER);
-            if (prop !== undefined && value !== undefined) {
-                styleMap[prop.trim()] = value.trim();
-            }
-        }
+function getErrorComponentStack(vm) {
+    const wcStack = [];
+    let currentVm = vm;
+    while (!isNull(currentVm)) {
+        ArrayPush$1.call(wcStack, getComponentTag(currentVm));
+        currentVm = currentVm.owner;
     }
-    return styleMap;
+    return wcStack.reverse().join('\n\t');
 }
-// Make a shallow copy of an object but omit the given key
-function cloneAndOmitKey(object, keyToOmit) {
-    const result = {};
-    for (const key of Object.keys(object)) {
-        if (key !== keyToOmit) {
-            result[key] = object[key];
-        }
+
+/*
+ * 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
+ */
+function addErrorComponentStack(vm, error) {
+    if (!isFrozen(error) && isUndefined$1(error.wcStack)) {
+        const wcStack = getErrorComponentStack(vm);
+        defineProperty(error, 'wcStack', {
+            get() {
+                return wcStack;
+            },
+        });
     }
-    return result;
 }
-function flattenStylesheets(stylesheets) {
-    const list = [];
-    for (const stylesheet of stylesheets) {
-        if (!Array.isArray(stylesheet)) {
-            list.push(stylesheet);
-        }
-        else {
-            list.push(...flattenStylesheets(stylesheet));
+
+/*
+ * 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
+ */
+const alreadyLoggedMessages = new Set();
+// @ts-ignore
+if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
+    // @ts-ignore
+    window.__lwcResetAlreadyLoggedMessages = () => {
+        alreadyLoggedMessages.clear();
+    };
+}
+function log(method, message, vm, once) {
+    let msg = `[LWC ${method}]: ${message}`;
+    if (!isUndefined$1(vm)) {
+        msg = `${msg}\n${getComponentStack(vm)}`;
+    }
+    if (once) {
+        if (alreadyLoggedMessages.has(msg)) {
+            return;
         }
+        alreadyLoggedMessages.add(msg);
     }
-    return list;
-}
-// Set a ref (lwc:ref) on a VM, from a template API
-function setRefVNode(vm, ref, vnode) {
-    if (process.env.NODE_ENV !== 'production' && isUndefined$1(vm.refVNodes)) {
-        throw new Error('refVNodes must be defined when setting a ref');
+    // In Jest tests, reduce the warning and error verbosity by not printing the callstack
+    if (process.env.NODE_ENV === 'test') {
+        /* eslint-disable-next-line no-console */
+        console[method](msg);
+        return;
     }
-    // If this method is called, then vm.refVNodes is set as the template has refs.
-    // If not, then something went wrong and we threw an error above.
-    const refVNodes = vm.refVNodes;
-    // In cases of conflict (two elements with the same ref), prefer, the last one,
-    // in depth-first traversal order.
-    if (!(ref in refVNodes) || refVNodes[ref].key < vnode.key) {
-        refVNodes[ref] = vnode;
+    try {
+        throw new Error(msg);
+    }
+    catch (e) {
+        /* eslint-disable-next-line no-console */
+        console[method](e);
     }
 }
+function logError(message, vm) {
+    log('error', message, vm, false);
+}
+function logWarn(message, vm) {
+    log('warn', message, vm, false);
+}
+function logWarnOnce(message, vm) {
+    log('warn', message, vm, true);
+}
 
 /*
  * Copyright (c) 2019, salesforce.com, inc.
@@ -763,80 +852,97 @@ function createReactiveObserver(callback) {
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
-function getComponentTag(vm) {
-    return `<${StringToLowerCase.call(vm.tagName)}>`;
-}
-// TODO [#1695]: Unify getComponentStack and getErrorComponentStack
-function getComponentStack(vm) {
-    const stack = [];
-    let prefix = '';
-    while (!isNull(vm.owner)) {
-        ArrayPush$1.call(stack, prefix + getComponentTag(vm));
-        vm = vm.owner;
-        prefix += '\t';
-    }
-    return ArrayJoin.call(stack, '\n');
-}
-function getErrorComponentStack(vm) {
-    const wcStack = [];
-    let currentVm = vm;
-    while (!isNull(currentVm)) {
-        ArrayPush$1.call(wcStack, getComponentTag(currentVm));
-        currentVm = currentVm.owner;
+let nextTickCallbackQueue = [];
+const SPACE_CHAR = 32;
+const EmptyObject = seal(create(null));
+const EmptyArray = seal([]);
+function flushCallbackQueue() {
+    if (process.env.NODE_ENV !== 'production') {
+        if (nextTickCallbackQueue.length === 0) {
+            throw new Error(`Internal Error: If callbackQueue is scheduled, it is because there must be at least one callback on this pending queue.`);
+        }
     }
-    return wcStack.reverse().join('\n\t');
-}
-
-/*
- * 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
- */
-function addErrorComponentStack(vm, error) {
-    if (!isFrozen(error) && isUndefined$1(error.wcStack)) {
-        const wcStack = getErrorComponentStack(vm);
-        defineProperty(error, 'wcStack', {
-            get() {
-                return wcStack;
-            },
-        });
+    const callbacks = nextTickCallbackQueue;
+    nextTickCallbackQueue = []; // reset to a new queue
+    for (let i = 0, len = callbacks.length; i < len; i += 1) {
+        callbacks[i]();
     }
 }
-
-/*
- * 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
- */
-function log(method, message, vm) {
-    let msg = `[LWC ${method}]: ${message}`;
-    if (!isUndefined$1(vm)) {
-        msg = `${msg}\n${getComponentStack(vm)}`;
-    }
-    if (process.env.NODE_ENV === 'test') {
-        /* eslint-disable-next-line no-console */
-        console[method](msg);
-        return;
-    }
-    try {
-        throw new Error(msg);
+function addCallbackToNextTick(callback) {
+    if (process.env.NODE_ENV !== 'production') {
+        if (!isFunction$1(callback)) {
+            throw new Error(`Internal Error: addCallbackToNextTick() can only accept a function callback`);
+        }
     }
-    catch (e) {
-        /* eslint-disable-next-line no-console */
-        console[method](e);
+    if (nextTickCallbackQueue.length === 0) {
+        Promise.resolve().then(flushCallbackQueue);
     }
+    ArrayPush$1.call(nextTickCallbackQueue, callback);
 }
-function logError(message, vm) {
-    log('error', message, vm);
-}
-function logWarn(message, vm) {
-    log('warn', message, vm);
+function guid() {
+    function s4() {
+        return Math.floor((1 + Math.random()) * 0x10000)
+            .toString(16)
+            .substring(1);
+    }
+    return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
 }
-
-/*
- * Copyright (c) 2020, salesforce.com, inc.
+// Borrowed from Vue template compiler.
+// https://github.com/vuejs/vue/blob/531371b818b0e31a989a06df43789728f23dc4e8/src/platforms/web/util/style.js#L5-L16
+const DECLARATION_DELIMITER = /;(?![^(]*\))/g;
+const PROPERTY_DELIMITER = /:(.+)/;
+function parseStyleText(cssText) {
+    const styleMap = {};
+    const declarations = cssText.split(DECLARATION_DELIMITER);
+    for (const declaration of declarations) {
+        if (declaration) {
+            const [prop, value] = declaration.split(PROPERTY_DELIMITER);
+            if (prop !== undefined && value !== undefined) {
+                styleMap[prop.trim()] = value.trim();
+            }
+        }
+    }
+    return styleMap;
+}
+// Make a shallow copy of an object but omit the given key
+function cloneAndOmitKey(object, keyToOmit) {
+    const result = {};
+    for (const key of Object.keys(object)) {
+        if (key !== keyToOmit) {
+            result[key] = object[key];
+        }
+    }
+    return result;
+}
+function flattenStylesheets(stylesheets) {
+    const list = [];
+    for (const stylesheet of stylesheets) {
+        if (!Array.isArray(stylesheet)) {
+            list.push(stylesheet);
+        }
+        else {
+            list.push(...flattenStylesheets(stylesheet));
+        }
+    }
+    return list;
+}
+// Set a ref (lwc:ref) on a VM, from a template API
+function setRefVNode(vm, ref, vnode) {
+    if (process.env.NODE_ENV !== 'production' && isUndefined$1(vm.refVNodes)) {
+        throw new Error('refVNodes must be defined when setting a ref');
+    }
+    // If this method is called, then vm.refVNodes is set as the template has refs.
+    // If not, then something went wrong and we threw an error above.
+    const refVNodes = vm.refVNodes;
+    // In cases of conflict (two elements with the same ref), prefer, the last one,
+    // in depth-first traversal order.
+    if (!(ref in refVNodes) || refVNodes[ref].key < vnode.key) {
+        refVNodes[ref] = vnode;
+    }
+}
+
+/*
+ * 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
@@ -884,7 +990,10 @@ function offsetPropertyErrorMessage(name) {
 // Global HTML Attributes & Properties
 // https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes
 // https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement
-const globalHTMLProperties = assign(create(null), {
+//
+// If you update this list, check for test files that recapitulate the same list. Searching the codebase
+// for e.g. "dropzone" should suffice.
+const globalHTMLProperties = {
     accessKey: {
         attribute: 'accesskey',
     },
@@ -969,7 +1078,7 @@ const globalHTMLProperties = assign(create(null), {
     role: {
         attribute: 'role',
     },
-});
+};
 let controlledElement = null;
 let controlledAttributeName;
 function isAttributeLocked(elm, attrName) {
@@ -2431,89 +2540,377 @@ function createObservedFieldPropertyDescriptor(key) {
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
-function api$1() {
-    if (process.env.NODE_ENV !== 'production') {
-        assert.fail(`@api decorator can only be used as a decorator function.`);
-    }
-    throw new Error();
+const DeprecatedWiredElementHost = '$$DeprecatedWiredElementHostKey$$';
+const DeprecatedWiredParamsMeta = '$$DeprecatedWiredParamsMetaKey$$';
+const WIRE_DEBUG_ENTRY = '@wire';
+const WireMetaMap = new Map();
+class WireContextRegistrationEvent extends CustomEvent {
+  constructor(adapterToken, {
+    setNewContext,
+    setDisconnectedCallback
+  }) {
+    super(adapterToken, {
+      bubbles: true,
+      composed: true
+    });
+    defineProperties(this, {
+      setNewContext: {
+        value: setNewContext
+      },
+      setDisconnectedCallback: {
+        value: setDisconnectedCallback
+      }
+    });
+  }
 }
-function createPublicPropertyDescriptor(key) {
-    return {
-        get() {
-            const vm = getAssociatedVM(this);
-            if (isBeingConstructed(vm)) {
-                if (process.env.NODE_ENV !== 'production') {
-                    logError(`Can’t read the value of property \`${toString$1(key)}\` from the constructor because the owner component hasn’t set the value yet. Instead, use the constructor to set a default value for the property.`, vm);
-                }
-                return;
-            }
-            componentValueObserved(vm, key);
-            return vm.cmpProps[key];
-        },
-        set(newValue) {
-            const vm = getAssociatedVM(this);
-            if (process.env.NODE_ENV !== 'production') {
-                const vmBeingRendered = getVMBeingRendered();
-                assert.invariant(!isInvokingRender, `${vmBeingRendered}.render() method has side effects on the state of ${vm}.${toString$1(key)}`);
-                assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
-            }
-            vm.cmpProps[key] = newValue;
-            componentValueMutated(vm, key);
-        },
-        enumerable: true,
-        configurable: true,
-    };
+function createFieldDataCallback(vm, name) {
+  return value => {
+    updateComponentValue(vm, name, value);
+  };
 }
-function createPublicAccessorDescriptor(key, descriptor) {
-    const { get, set, enumerable, configurable } = descriptor;
-    if (!isFunction$1(get)) {
-        if (process.env.NODE_ENV !== 'production') {
-            assert.invariant(isFunction$1(get), `Invalid compiler output for public accessor ${toString$1(key)} decorated with @api`);
-        }
-        throw new Error();
+function createMethodDataCallback(vm, method) {
+  return value => {
+    // dispatching new value into the wired method
+    runWithBoundaryProtection(vm, vm.owner, noop, () => {
+      // job
+      method.call(vm.component, value);
+    }, noop);
+  };
+}
+function createConfigWatcher(component, configCallback, callbackWhenConfigIsReady) {
+  let hasPendingConfig = false;
+  // creating the reactive observer for reactive params when needed
+  const ro = createReactiveObserver(() => {
+    if (hasPendingConfig === false) {
+      hasPendingConfig = true;
+      // collect new config in the micro-task
+      Promise.resolve().then(() => {
+        hasPendingConfig = false;
+        // resetting current reactive params
+        ro.reset();
+        // dispatching a new config due to a change in the configuration
+        computeConfigAndUpdate();
+      });
     }
-    return {
-        get() {
-            if (process.env.NODE_ENV !== 'production') {
-                // Assert that the this value is an actual Component with an associated VM.
-                getAssociatedVM(this);
-            }
-            return get.call(this);
-        },
-        set(newValue) {
-            const vm = getAssociatedVM(this);
-            if (process.env.NODE_ENV !== 'production') {
-                const vmBeingRendered = getVMBeingRendered();
-                assert.invariant(!isInvokingRender, `${vmBeingRendered}.render() method has side effects on the state of ${vm}.${toString$1(key)}`);
-                assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
-            }
-            if (set) {
-                set.call(this, newValue);
-            }
-            else if (process.env.NODE_ENV !== 'production') {
-                assert.fail(`Invalid attempt to set a new value for property ${toString$1(key)} of ${vm} that does not has a setter decorated with @api.`);
-            }
-        },
-        enumerable,
-        configurable,
-    };
+  });
+  const computeConfigAndUpdate = () => {
+    let config;
+    ro.observe(() => config = configCallback(component));
+    // eslint-disable-next-line @lwc/lwc-internal/no-invalid-todo
+    // TODO: dev-mode validation of config based on the adapter.configSchema
+    // @ts-ignore it is assigned in the observe() callback
+    callbackWhenConfigIsReady(config);
+  };
+  return {
+    computeConfigAndUpdate,
+    ro
+  };
 }
+function createContextWatcher(vm, wireDef, callbackWhenContextIsReady) {
+  const {
+    adapter
+  } = wireDef;
+  const adapterContextToken = getAdapterToken(adapter);
+  if (isUndefined$1(adapterContextToken)) {
+    return; // no provider found, nothing to be done
+  }
 
-/*
- * 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
- */
-function track(target) {
-    if (arguments.length === 1) {
-        return getReactiveProxy(target);
+  const {
+    elm,
+    context: {
+      wiredConnecting,
+      wiredDisconnecting
+    },
+    renderer: {
+      dispatchEvent
     }
+  } = vm;
+  // waiting for the component to be connected to formally request the context via the token
+  ArrayPush$1.call(wiredConnecting, () => {
+    // This event is responsible for connecting the host element with another
+    // element in the composed path that is providing contextual data. The provider
+    // must be listening for a special dom event with the name corresponding to the value of
+    // `adapterContextToken`, which will remain secret and internal to this file only to
+    // guarantee that the linkage can be forged.
+    const contextRegistrationEvent = new WireContextRegistrationEvent(adapterContextToken, {
+      setNewContext(newContext) {
+        // eslint-disable-next-line @lwc/lwc-internal/no-invalid-todo
+        // TODO: dev-mode validation of config based on the adapter.contextSchema
+        callbackWhenContextIsReady(newContext);
+      },
+      setDisconnectedCallback(disconnectCallback) {
+        // adds this callback into the disconnect bucket so it gets disconnected from parent
+        // the the element hosting the wire is disconnected
+        ArrayPush$1.call(wiredDisconnecting, disconnectCallback);
+      }
+    });
+    dispatchEvent(elm, contextRegistrationEvent);
+  });
+}
+function createConnector(vm, name, wireDef) {
+  const {
+    method,
+    adapter,
+    configCallback,
+    dynamic
+  } = wireDef;
+  let debugInfo;
+  if (process.env.NODE_ENV !== 'production') {
+    const wiredPropOrMethod = isUndefined$1(method) ? name : method.name;
+    debugInfo = create(null);
+    debugInfo.wasDataProvisionedForConfig = false;
+    vm.debugInfo[WIRE_DEBUG_ENTRY][wiredPropOrMethod] = debugInfo;
+  }
+  const fieldOrMethodCallback = isUndefined$1(method) ? createFieldDataCallback(vm, name) : createMethodDataCallback(vm, method);
+  const dataCallback = value => {
     if (process.env.NODE_ENV !== 'production') {
-        assert.fail(`@track decorator can only be used with one argument to return a trackable object, or as a decorator function.`);
+      debugInfo.data = value;
+      // Note: most of the time, the data provided is for the current config, but there may be
+      // some conditions in which it does not, ex:
+      // race conditions in a poor network while the adapter does not cancel a previous request.
+      debugInfo.wasDataProvisionedForConfig = true;
     }
-    throw new Error();
-}
+    fieldOrMethodCallback(value);
+  };
+  let context;
+  let connector;
+  // Workaround to pass the component element associated to this wire adapter instance.
+  defineProperty(dataCallback, DeprecatedWiredElementHost, {
+    value: vm.elm
+  });
+  defineProperty(dataCallback, DeprecatedWiredParamsMeta, {
+    value: dynamic
+  });
+  runWithBoundaryProtection(vm, vm, noop, () => {
+    // job
+    connector = new adapter(dataCallback);
+  }, noop);
+  const updateConnectorConfig = config => {
+    // every time the config is recomputed due to tracking,
+    // this callback will be invoked with the new computed config
+    runWithBoundaryProtection(vm, vm, noop, () => {
+      // job
+      if (process.env.NODE_ENV !== 'production') {
+        debugInfo.config = config;
+        debugInfo.context = context;
+        debugInfo.wasDataProvisionedForConfig = false;
+      }
+      connector.update(config, context);
+    }, noop);
+  };
+  // Computes the current wire config and calls the update method on the wire adapter.
+  // If it has params, we will need to observe changes in the next tick.
+  const {
+    computeConfigAndUpdate,
+    ro
+  } = createConfigWatcher(vm.component, configCallback, updateConnectorConfig);
+  // if the adapter needs contextualization, we need to watch for new context and push it alongside the config
+  if (!isUndefined$1(adapter.contextSchema)) {
+    createContextWatcher(vm, wireDef, newContext => {
+      // every time the context is pushed into this component,
+      // this callback will be invoked with the new computed context
+      if (context !== newContext) {
+        context = newContext;
+        // Note: when new context arrives, the config will be recomputed and pushed along side the new
+        // context, this is to preserve the identity characteristics, config should not have identity
+        // (ever), while context can have identity
+        if (vm.state === 1 /* VMState.connected */) {
+          computeConfigAndUpdate();
+        }
+      }
+    });
+  }
+  return {
+    // @ts-ignore the boundary protection executes sync, connector is always defined
+    connector,
+    computeConfigAndUpdate,
+    resetConfigWatcher: () => ro.reset()
+  };
+}
+const AdapterToTokenMap = new Map();
+function getAdapterToken(adapter) {
+  return AdapterToTokenMap.get(adapter);
+}
+function setAdapterToken(adapter, token) {
+  AdapterToTokenMap.set(adapter, token);
+}
+function storeWiredMethodMeta(descriptor, adapter, configCallback, dynamic) {
+  // support for callable adapters
+  if (adapter.adapter) {
+    adapter = adapter.adapter;
+  }
+  const method = descriptor.value;
+  const def = {
+    adapter,
+    method,
+    configCallback,
+    dynamic
+  };
+  WireMetaMap.set(descriptor, def);
+}
+function storeWiredFieldMeta(descriptor, adapter, configCallback, dynamic) {
+  // support for callable adapters
+  if (adapter.adapter) {
+    adapter = adapter.adapter;
+  }
+  const def = {
+    adapter,
+    configCallback,
+    dynamic
+  };
+  WireMetaMap.set(descriptor, def);
+}
+function installWireAdapters(vm) {
+  const {
+    context,
+    def: {
+      wire
+    }
+  } = vm;
+  if (process.env.NODE_ENV !== 'production') {
+    vm.debugInfo[WIRE_DEBUG_ENTRY] = create(null);
+  }
+  const wiredConnecting = context.wiredConnecting = [];
+  const wiredDisconnecting = context.wiredDisconnecting = [];
+  for (const fieldNameOrMethod in wire) {
+    const descriptor = wire[fieldNameOrMethod];
+    const wireDef = WireMetaMap.get(descriptor);
+    if (process.env.NODE_ENV !== 'production') {
+      assert.invariant(wireDef, `Internal Error: invalid wire definition found.`);
+    }
+    if (!isUndefined$1(wireDef)) {
+      const {
+        connector,
+        computeConfigAndUpdate,
+        resetConfigWatcher
+      } = createConnector(vm, fieldNameOrMethod, wireDef);
+      const hasDynamicParams = wireDef.dynamic.length > 0;
+      ArrayPush$1.call(wiredConnecting, () => {
+        connector.connect();
+        if (!lwcRuntimeFlags.ENABLE_WIRE_SYNC_EMIT) {
+          if (hasDynamicParams) {
+            Promise.resolve().then(computeConfigAndUpdate);
+            return;
+          }
+        }
+        computeConfigAndUpdate();
+      });
+      ArrayPush$1.call(wiredDisconnecting, () => {
+        connector.disconnect();
+        resetConfigWatcher();
+      });
+    }
+  }
+}
+function connectWireAdapters(vm) {
+  const {
+    wiredConnecting
+  } = vm.context;
+  for (let i = 0, len = wiredConnecting.length; i < len; i += 1) {
+    wiredConnecting[i]();
+  }
+}
+function disconnectWireAdapters(vm) {
+  const {
+    wiredDisconnecting
+  } = vm.context;
+  runWithBoundaryProtection(vm, vm, noop, () => {
+    // job
+    for (let i = 0, len = wiredDisconnecting.length; i < len; i += 1) {
+      wiredDisconnecting[i]();
+    }
+  }, noop);
+}
+
+/*
+ * 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
+ */
+function api$1() {
+    if (process.env.NODE_ENV !== 'production') {
+        assert.fail(`@api decorator can only be used as a decorator function.`);
+    }
+    throw new Error();
+}
+function createPublicPropertyDescriptor(key) {
+    return {
+        get() {
+            const vm = getAssociatedVM(this);
+            if (isBeingConstructed(vm)) {
+                if (process.env.NODE_ENV !== 'production') {
+                    logError(`Can’t read the value of property \`${toString$1(key)}\` from the constructor because the owner component hasn’t set the value yet. Instead, use the constructor to set a default value for the property.`, vm);
+                }
+                return;
+            }
+            componentValueObserved(vm, key);
+            return vm.cmpProps[key];
+        },
+        set(newValue) {
+            const vm = getAssociatedVM(this);
+            if (process.env.NODE_ENV !== 'production') {
+                const vmBeingRendered = getVMBeingRendered();
+                assert.invariant(!isInvokingRender, `${vmBeingRendered}.render() method has side effects on the state of ${vm}.${toString$1(key)}`);
+                assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
+            }
+            vm.cmpProps[key] = newValue;
+            componentValueMutated(vm, key);
+        },
+        enumerable: true,
+        configurable: true,
+    };
+}
+function createPublicAccessorDescriptor(key, descriptor) {
+    const { get, set, enumerable, configurable } = descriptor;
+    if (!isFunction$1(get)) {
+        if (process.env.NODE_ENV !== 'production') {
+            assert.invariant(isFunction$1(get), `Invalid compiler output for public accessor ${toString$1(key)} decorated with @api`);
+        }
+        throw new Error();
+    }
+    return {
+        get() {
+            if (process.env.NODE_ENV !== 'production') {
+                // Assert that the this value is an actual Component with an associated VM.
+                getAssociatedVM(this);
+            }
+            return get.call(this);
+        },
+        set(newValue) {
+            const vm = getAssociatedVM(this);
+            if (process.env.NODE_ENV !== 'production') {
+                const vmBeingRendered = getVMBeingRendered();
+                assert.invariant(!isInvokingRender, `${vmBeingRendered}.render() method has side effects on the state of ${vm}.${toString$1(key)}`);
+                assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
+            }
+            if (set) {
+                set.call(this, newValue);
+            }
+            else if (process.env.NODE_ENV !== 'production') {
+                assert.fail(`Invalid attempt to set a new value for property ${toString$1(key)} of ${vm} that does not has a setter decorated with @api.`);
+            }
+        },
+        enumerable,
+        configurable,
+    };
+}
+
+/*
+ * 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
+ */
+function track(target) {
+    if (arguments.length === 1) {
+        return getReactiveProxy(target);
+    }
+    if (process.env.NODE_ENV !== 'production') {
+        assert.fail(`@track decorator can only be used with one argument to return a trackable object, or as a decorator function.`);
+    }
+    throw new Error();
+}
 function internalTrackDecorator(key) {
     return {
         get() {
@@ -3476,6 +3873,9 @@ function updateStylesheetToken(vm, template) {
     stylesheets: newStylesheets,
     stylesheetToken: newStylesheetToken
   } = template;
+  const {
+    stylesheets: newVmStylesheets
+  } = vm;
   const isSyntheticShadow = renderMode === 1 /* RenderMode.Shadow */ && shadowMode === 1 /* ShadowMode.Synthetic */;
   const {
     hasScopedStyles
@@ -3499,7 +3899,9 @@ function updateStylesheetToken(vm, template) {
   }
   // Apply the new template styling token to the host element, if the new template has any
   // associated stylesheets. In the case of light DOM, also ensure there is at least one scoped stylesheet.
-  if (!isUndefined$1(newStylesheets) && newStylesheets.length !== 0) {
+  const hasNewStylesheets = hasStyles(newStylesheets);
+  const hasNewVmStylesheets = hasStyles(newVmStylesheets);
+  if (hasNewStylesheets || hasNewVmStylesheets) {
     newToken = newStylesheetToken;
   }
   // Set the new styling token on the host element
@@ -3571,10 +3973,17 @@ function getStylesheetsContent(vm, template) {
     stylesheets,
     stylesheetToken
   } = template;
+  const {
+    stylesheets: vmStylesheets
+  } = vm;
   let content = [];
-  if (!isUndefined$1(stylesheets) && stylesheets.length !== 0) {
+  if (hasStyles(stylesheets)) {
     content = evaluateStylesheetsContent(stylesheets, stylesheetToken, vm);
   }
+  // VM (component) stylesheets apply after template stylesheets
+  if (hasStyles(vmStylesheets)) {
+    ArrayPush$1.apply(content, evaluateStylesheetsContent(vmStylesheets, stylesheetToken, vm));
+  }
   return content;
 }
 // It might be worth caching this to avoid doing the lookup repeatedly, but
@@ -3612,10 +4021,13 @@ function getStylesheetTokenHost(vnode) {
   const {
     template
   } = getComponentInternalDef(vnode.ctor);
+  const {
+    vm
+  } = vnode;
   const {
     stylesheetToken
   } = template;
-  return !isUndefined$1(stylesheetToken) && computeHasScopedStyles(template) ? makeHostToken(stylesheetToken) : null;
+  return !isUndefined$1(stylesheetToken) && computeHasScopedStyles(template, vm) ? makeHostToken(stylesheetToken) : null;
 }
 function getNearestNativeShadowComponent(vm) {
   const owner = getNearestShadowComponent(vm);
@@ -4228,6 +4640,28 @@ function patchCustomElement(n1, n2, parent, renderer) {
       // in fallback mode, the allocation will always set children to
       // empty and delegate the real allocation to the slot elements
       allocateChildren(n2, vm);
+      // Solves an edge case with slotted VFragments in native shadow mode.
+      //
+      // During allocation, in native shadow, slotted VFragment nodes are flattened and their text delimiters are removed
+      // to avoid interfering with native slot behavior. When this happens, if any of the fragments
+      // were not stable, the children must go through the dynamic diffing algo.
+      //
+      // If the new children (n2.children) contain no VFragments, but the previous children (n1.children) were dynamic,
+      // the new nodes must be marked dynamic so that all nodes are properly updated. The only indicator that the new
+      // nodes need to be dynamic comes from the previous children, so we check that to determine whether we need to
+      // mark the new children dynamic.
+      //
+      // Example:
+      // n1.children: [div, VFragment('', div, null, ''), div] => [div, div, null, div]; // marked dynamic
+      // n2.children: [div, null, div] => [div, null, div] // marked ???
+      const {
+        shadowMode,
+        renderMode
+      } = vm;
+      if (shadowMode == 0 /* ShadowMode.Native */ && renderMode !== 0 /* RenderMode.Light */ && hasDynamicChildren(n1.children)) {
+        // No-op if children has already been marked dynamic by 'allocateChildren()'.
+        markAsDynamicChildren(n2.children);
+      }
     }
     // in fallback mode, the children will be always empty, so, nothing
     // will happen, but in native, it does allocate the light dom
@@ -4420,7 +4854,6 @@ function allocateChildren(vnode, vm) {
   //
   // In case #2, we will always get a fresh VCustomElement.
   const children = vnode.aChildren || vnode.children;
-  vm.aChildren = children;
   const {
     renderMode,
     shadowMode
@@ -4433,20 +4866,66 @@ function allocateChildren(vnode, vm) {
       logError(`Invalid usage of 'lwc:slot-data' on ${getComponentTag(vm)} tag. Scoped slot content can only be passed to a light dom child.`);
     }
   }
+  // If any of the children being allocated are VFragments, we remove the text delimiters and flatten all immediate
+  // children VFragments to avoid them interfering with default slot behavior.
+  const allocatedChildren = flattenFragmentsInChildren(children);
+  vnode.children = allocatedChildren;
+  vm.aChildren = allocatedChildren;
   if (shadowMode === 1 /* ShadowMode.Synthetic */ || renderMode === 0 /* RenderMode.Light */) {
     // slow path
-    allocateInSlot(vm, children, vnode.owner);
+    allocateInSlot(vm, allocatedChildren, vnode.owner);
     // save the allocated children in case this vnode is reused.
-    vnode.aChildren = children;
+    vnode.aChildren = allocatedChildren;
     // every child vnode is now allocated, and the host should receive none directly, it receives them via the shadow!
     vnode.children = EmptyArray;
   }
 }
-function createViewModelHook(elm, vnode, renderer) {
-  let vm = getAssociatedVMIfPresent(elm);
-  // There is a possibility that a custom element is registered under tagName, in which case, the
-  // initialization is already carry on, and there is nothing else to do here since this hook is
-  // called right after invoking `document.createElement`.
+/**
+ * Flattens the contents of all VFragments in an array of VNodes, removes the text delimiters on those VFragments, and
+ * marks the resulting children array as dynamic. Uses a stack (array) to iteratively traverse the nested VFragments
+ * and avoid the perf overhead of creating/destroying throwaway arrays/objects in a recursive approach.
+ *
+ * With the delimiters removed, the contents are marked dynamic so they are diffed correctly.
+ *
+ * This function is used for slotted VFragments to avoid the text delimiters interfering with slotting functionality.
+ */
+function flattenFragmentsInChildren(children) {
+  const flattenedChildren = [];
+  // Initialize our stack with the direct children of the custom component and check whether we have a VFragment.
+  // If no VFragment is found in children, we don't need to traverse anything or mark the children dynamic and can return early.
+  const nodeStack = [];
+  let fragmentFound = false;
+  for (let i = children.length - 1; i > -1; i -= 1) {
+    const child = children[i];
+    ArrayPush$1.call(nodeStack, child);
+    fragmentFound = fragmentFound || !!(child && isVFragment(child));
+  }
+  if (!fragmentFound) {
+    return children;
+  }
+  let currentNode;
+  while (!isUndefined$1(currentNode = ArrayPop.call(nodeStack))) {
+    if (!isNull(currentNode) && isVFragment(currentNode)) {
+      const fChildren = currentNode.children;
+      // Ignore the start and end text node delimiters
+      for (let i = fChildren.length - 2; i > 0; i -= 1) {
+        ArrayPush$1.call(nodeStack, fChildren[i]);
+      }
+    } else {
+      ArrayPush$1.call(flattenedChildren, currentNode);
+    }
+  }
+  // We always mark the children as dynamic because nothing generates stable VFragments yet.
+  // If/when stable VFragments are generated by the compiler, this code should be updated to
+  // not mark dynamic if all flattened VFragments were stable.
+  markAsDynamicChildren(flattenedChildren);
+  return flattenedChildren;
+}
+function createViewModelHook(elm, vnode, renderer) {
+  let vm = getAssociatedVMIfPresent(elm);
+  // There is a possibility that a custom element is registered under tagName, in which case, the
+  // initialization is already carry on, and there is nothing else to do here since this hook is
+  // called right after invoking `document.createElement`.
   if (!isUndefined$1(vm)) {
     return vm;
   }
@@ -4466,22 +4945,20 @@ function createViewModelHook(elm, vnode, renderer) {
   }
   return vm;
 }
-/**
- * Collects all slots into a SlotSet, traversing through VFragment Nodes
- */
-function collectSlots(vm, children, cmpSlotsMapping) {
+function allocateInSlot(vm, children, owner) {
   var _a, _b;
+  const {
+    cmpSlots: {
+      slotAssignments: oldSlotsMapping
+    }
+  } = vm;
+  const cmpSlotsMapping = create(null);
+  // Collect all slots into cmpSlotsMapping
   for (let i = 0, len = children.length; i < len; i += 1) {
     const vnode = children[i];
     if (isNull(vnode)) {
       continue;
     }
-    // Dive further iff the content is wrapped in a VFragment
-    if (isVFragment(vnode)) {
-      // Remove the text delimiter nodes to avoid overriding default slot content
-      collectSlots(vm, vnode.children.slice(1, -1), cmpSlotsMapping);
-      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 : '';
@@ -4491,15 +4968,6 @@ function collectSlots(vm, children, cmpSlotsMapping) {
     const vnodes = cmpSlotsMapping[slotName] = cmpSlotsMapping[slotName] || [];
     ArrayPush$1.call(vnodes, vnode);
   }
-}
-function allocateInSlot(vm, children, owner) {
-  const {
-    cmpSlots: {
-      slotAssignments: oldSlotsMapping
-    }
-  } = vm;
-  const cmpSlotsMapping = create(null);
-  collectSlots(vm, children, cmpSlotsMapping);
   vm.cmpSlots = {
     owner,
     slotAssignments: cmpSlotsMapping
@@ -4530,14 +4998,14 @@ function allocateInSlot(vm, children, owner) {
   }
 }
 // Using a WeakMap instead of a WeakSet because this one works in IE11 :(
-const FromIteration = new WeakMap();
-// dynamic children means it was generated by an iteration
-// in a template, and will require a more complex diffing algo.
+const DynamicChildren = new WeakMap();
+// dynamic children means it was either generated by an iteration in a template
+// or part of an unstable fragment, and will require a more complex diffing algo.
 function markAsDynamicChildren(children) {
-  FromIteration.set(children, 1);
+  DynamicChildren.set(children, 1);
 }
 function hasDynamicChildren(children) {
-  return FromIteration.has(children);
+  return DynamicChildren.has(children);
 }
 function createKeyToOldIdx(children, beginIdx, endIdx) {
   const map = {};
@@ -5403,7 +5871,7 @@ function evaluateTemplate(vm, html) {
                 // Create a brand new template cache for the swapped templated.
                 context.tplCache = create(null);
                 // Set the computeHasScopedStyles property in the context, to avoid recomputing it repeatedly.
-                context.hasScopedStyles = computeHasScopedStyles(html);
+                context.hasScopedStyles = computeHasScopedStyles(html, vm);
                 // Update the scoping token on the host element.
                 updateStylesheetToken(vm, html);
                 // Evaluate, create stylesheet and cache the produced VNode for future
@@ -5446,9 +5914,8 @@ function evaluateTemplate(vm, html) {
     }
     return vnodes;
 }
-function computeHasScopedStyles(template) {
-    const { stylesheets } = template;
-    if (!isUndefined$1(stylesheets)) {
+function computeHasScopedStylesInStylesheets(stylesheets) {
+    if (hasStyles(stylesheets)) {
         for (let i = 0; i < stylesheets.length; i++) {
             if (isTrue(stylesheets[i][KEY__SCOPED_CSS])) {
                 return true;
@@ -5457,6 +5924,15 @@ function computeHasScopedStyles(template) {
     }
     return false;
 }
+function computeHasScopedStyles(template, vm) {
+    const { stylesheets } = template;
+    const vmStylesheets = !isUndefined$1(vm) ? vm.stylesheets : null;
+    return (computeHasScopedStylesInStylesheets(stylesheets) ||
+        computeHasScopedStylesInStylesheets(vmStylesheets));
+}
+function hasStyles(stylesheets) {
+    return !isUndefined$1(stylesheets) && !isNull(stylesheets) && stylesheets.length > 0;
+}
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -5772,6 +6248,7 @@ function createVM(elm, ctor, renderer, options) {
     // Properties set right after VM creation.
     tro: null,
     shadowMode: null,
+    stylesheets: null,
     // Properties set by the LightningElement constructor.
     component: null,
     shadowRoot: null,
@@ -5784,6 +6261,7 @@ function createVM(elm, ctor, renderer, options) {
   if (process.env.NODE_ENV !== 'production') {
     vm.debugInfo = create(null);
   }
+  vm.stylesheets = computeStylesheets(vm, def.ctor);
   vm.shadowMode = computeShadowMode(vm, renderer);
   vm.tro = getTemplateReactiveObserver(vm);
   if (process.env.NODE_ENV !== 'production') {
@@ -5802,6 +6280,42 @@ function createVM(elm, ctor, renderer, options) {
   }
   return vm;
 }
+function validateComponentStylesheets(vm, stylesheets) {
+  let valid = true;
+  const validate = arrayOrStylesheet => {
+    if (isArray$1(arrayOrStylesheet)) {
+      for (let i = 0; i < arrayOrStylesheet.length; i++) {
+        validate(arrayOrStylesheet[i]);
+      }
+    } else if (!isFunction$1(arrayOrStylesheet)) {
+      // function assumed to be a stylesheet factory
+      valid = false;
+    }
+  };
+  if (!isArray$1(stylesheets)) {
+    valid = false;
+  } else {
+    validate(stylesheets);
+  }
+  return valid;
+}
+// Validate and flatten any stylesheets defined as `static stylesheets`
+function computeStylesheets(vm, ctor) {
+  if (lwcRuntimeFlags.ENABLE_PROGRAMMATIC_STYLESHEETS) {
+    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;
+}
 function computeShadowMode(vm, renderer) {
   const {
     def
@@ -6044,411 +6558,268 @@ function runChildNodesDisconnectedCallback(vm) {
       // in the case where the VM failed in the middle of its creation,
       // eg: constructor throwing before invoking super().
       if (!isUndefined$1(childVM)) {
-        resetComponentStateWhenRemoved(childVM);
-      }
-    }
-  }
-}
-function runLightChildNodesDisconnectedCallback(vm) {
-  const {
-    aChildren: adoptedChildren
-  } = vm;
-  recursivelyDisconnectChildren(adoptedChildren);
-}
-/**
- * The recursion doesn't need to be a complete traversal of the vnode graph,
- * instead it can be partial, when a custom element vnode is found, we don't
- * need to continue into its children because by attempting to disconnect the
- * custom element itself will trigger the removal of anything slotted or anything
- * defined on its shadow.
- */
-function recursivelyDisconnectChildren(vnodes) {
-  for (let i = 0, len = vnodes.length; i < len; i += 1) {
-    const vnode = vnodes[i];
-    if (!isNull(vnode) && !isUndefined$1(vnode.elm)) {
-      switch (vnode.type) {
-        case 2 /* VNodeType.Element */:
-          recursivelyDisconnectChildren(vnode.children);
-          break;
-        case 3 /* VNodeType.CustomElement */:
-          {
-            const vm = getAssociatedVM(vnode.elm);
-            resetComponentStateWhenRemoved(vm);
-            break;
-          }
-      }
-    }
-  }
-}
-// This is a super optimized mechanism to remove the content of the root node (shadow root
-// for shadow DOM components and the root element itself for light DOM) without having to go
-// into snabbdom. Especially useful when the reset is a consequence of an error, in which case the
-// children VNodes might not be representing the current state of the DOM.
-function resetComponentRoot(vm) {
-  const {
-    children,
-    renderRoot,
-    renderer: {
-      remove
-    }
-  } = vm;
-  for (let i = 0, len = children.length; i < len; i++) {
-    const child = children[i];
-    if (!isNull(child) && !isUndefined$1(child.elm)) {
-      remove(child.elm, renderRoot);
-    }
-  }
-  vm.children = EmptyArray;
-  runChildNodesDisconnectedCallback(vm);
-  vm.velements = EmptyArray;
-}
-function scheduleRehydration(vm) {
-  if (isTrue(vm.isScheduled)) {
-    return;
-  }
-  vm.isScheduled = true;
-  if (rehydrateQueue.length === 0) {
-    addCallbackToNextTick(flushRehydrationQueue);
-  }
-  ArrayPush$1.call(rehydrateQueue, vm);
-}
-function getErrorBoundaryVM(vm) {
-  let currentVm = vm;
-  while (!isNull(currentVm)) {
-    if (!isUndefined$1(currentVm.def.errorCallback)) {
-      return currentVm;
-    }
-    currentVm = currentVm.owner;
-  }
-}
-function runWithBoundaryProtection(vm, owner, pre, job, post) {
-  let error;
-  pre();
-  try {
-    job();
-  } catch (e) {
-    error = Object(e);
-  } finally {
-    post();
-    if (!isUndefined$1(error)) {
-      addErrorComponentStack(vm, error);
-      const errorBoundaryVm = isNull(owner) ? undefined : getErrorBoundaryVM(owner);
-      if (isUndefined$1(errorBoundaryVm)) {
-        throw error; // eslint-disable-line no-unsafe-finally
-      }
-
-      resetComponentRoot(vm); // remove offenders
-      logOperationStart(6 /* OperationId.ErrorCallback */, vm);
-      // error boundaries must have an ErrorCallback
-      const errorCallback = errorBoundaryVm.def.errorCallback;
-      invokeComponentCallback(errorBoundaryVm, errorCallback, [error, error.wcStack]);
-      logOperationEnd(6 /* OperationId.ErrorCallback */, vm);
-    }
-  }
-}
-function forceRehydration(vm) {
-  // if we must reset the shadowRoot content and render the template
-  // from scratch on an active instance, the way to force the reset
-  // is by replacing the value of old template, which is used during
-  // to determine if the template has changed or not during the rendering
-  // process. If the template returned by render() is different from the
-  // previous stored template, the styles will be reset, along with the
-  // content of the shadowRoot, this way we can guarantee that all children
-  // elements will be throw away, and new instances will be created.
-  vm.cmpTemplate = () => [];
-  if (isFalse(vm.isDirty)) {
-    // forcing the vm to rehydrate in the next tick
-    markComponentAsDirty(vm);
-    scheduleRehydration(vm);
-  }
-}
-
-/*
- * 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
- */
-const DeprecatedWiredElementHost = '$$DeprecatedWiredElementHostKey$$';
-const DeprecatedWiredParamsMeta = '$$DeprecatedWiredParamsMetaKey$$';
-const WIRE_DEBUG_ENTRY = '@wire';
-const WireMetaMap = new Map();
-class WireContextRegistrationEvent extends CustomEvent {
-  constructor(adapterToken, {
-    setNewContext,
-    setDisconnectedCallback
-  }) {
-    super(adapterToken, {
-      bubbles: true,
-      composed: true
-    });
-    defineProperties(this, {
-      setNewContext: {
-        value: setNewContext
-      },
-      setDisconnectedCallback: {
-        value: setDisconnectedCallback
-      }
-    });
-  }
-}
-function createFieldDataCallback(vm, name) {
-  return value => {
-    updateComponentValue(vm, name, value);
-  };
-}
-function createMethodDataCallback(vm, method) {
-  return value => {
-    // dispatching new value into the wired method
-    runWithBoundaryProtection(vm, vm.owner, noop, () => {
-      // job
-      method.call(vm.component, value);
-    }, noop);
-  };
-}
-function createConfigWatcher(component, configCallback, callbackWhenConfigIsReady) {
-  let hasPendingConfig = false;
-  // creating the reactive observer for reactive params when needed
-  const ro = createReactiveObserver(() => {
-    if (hasPendingConfig === false) {
-      hasPendingConfig = true;
-      // collect new config in the micro-task
-      Promise.resolve().then(() => {
-        hasPendingConfig = false;
-        // resetting current reactive params
-        ro.reset();
-        // dispatching a new config due to a change in the configuration
-        computeConfigAndUpdate();
-      });
-    }
-  });
-  const computeConfigAndUpdate = () => {
-    let config;
-    ro.observe(() => config = configCallback(component));
-    // eslint-disable-next-line @lwc/lwc-internal/no-invalid-todo
-    // TODO: dev-mode validation of config based on the adapter.configSchema
-    // @ts-ignore it is assigned in the observe() callback
-    callbackWhenConfigIsReady(config);
-  };
-  return {
-    computeConfigAndUpdate,
-    ro
-  };
-}
-function createContextWatcher(vm, wireDef, callbackWhenContextIsReady) {
-  const {
-    adapter
-  } = wireDef;
-  const adapterContextToken = getAdapterToken(adapter);
-  if (isUndefined$1(adapterContextToken)) {
-    return; // no provider found, nothing to be done
-  }
-
-  const {
-    elm,
-    context: {
-      wiredConnecting,
-      wiredDisconnecting
-    },
-    renderer: {
-      dispatchEvent
-    }
-  } = vm;
-  // waiting for the component to be connected to formally request the context via the token
-  ArrayPush$1.call(wiredConnecting, () => {
-    // This event is responsible for connecting the host element with another
-    // element in the composed path that is providing contextual data. The provider
-    // must be listening for a special dom event with the name corresponding to the value of
-    // `adapterContextToken`, which will remain secret and internal to this file only to
-    // guarantee that the linkage can be forged.
-    const contextRegistrationEvent = new WireContextRegistrationEvent(adapterContextToken, {
-      setNewContext(newContext) {
-        // eslint-disable-next-line @lwc/lwc-internal/no-invalid-todo
-        // TODO: dev-mode validation of config based on the adapter.contextSchema
-        callbackWhenContextIsReady(newContext);
-      },
-      setDisconnectedCallback(disconnectCallback) {
-        // adds this callback into the disconnect bucket so it gets disconnected from parent
-        // the the element hosting the wire is disconnected
-        ArrayPush$1.call(wiredDisconnecting, disconnectCallback);
-      }
-    });
-    dispatchEvent(elm, contextRegistrationEvent);
-  });
-}
-function createConnector(vm, name, wireDef) {
-  const {
-    method,
-    adapter,
-    configCallback,
-    dynamic
-  } = wireDef;
-  let debugInfo;
-  if (process.env.NODE_ENV !== 'production') {
-    const wiredPropOrMethod = isUndefined$1(method) ? name : method.name;
-    debugInfo = create(null);
-    debugInfo.wasDataProvisionedForConfig = false;
-    vm.debugInfo[WIRE_DEBUG_ENTRY][wiredPropOrMethod] = debugInfo;
-  }
-  const fieldOrMethodCallback = isUndefined$1(method) ? createFieldDataCallback(vm, name) : createMethodDataCallback(vm, method);
-  const dataCallback = value => {
-    if (process.env.NODE_ENV !== 'production') {
-      debugInfo.data = value;
-      // Note: most of the time, the data provided is for the current config, but there may be
-      // some conditions in which it does not, ex:
-      // race conditions in a poor network while the adapter does not cancel a previous request.
-      debugInfo.wasDataProvisionedForConfig = true;
-    }
-    fieldOrMethodCallback(value);
-  };
-  let context;
-  let connector;
-  // Workaround to pass the component element associated to this wire adapter instance.
-  defineProperty(dataCallback, DeprecatedWiredElementHost, {
-    value: vm.elm
-  });
-  defineProperty(dataCallback, DeprecatedWiredParamsMeta, {
-    value: dynamic
-  });
-  runWithBoundaryProtection(vm, vm, noop, () => {
-    // job
-    connector = new adapter(dataCallback);
-  }, noop);
-  const updateConnectorConfig = config => {
-    // every time the config is recomputed due to tracking,
-    // this callback will be invoked with the new computed config
-    runWithBoundaryProtection(vm, vm, noop, () => {
-      // job
-      if (process.env.NODE_ENV !== 'production') {
-        debugInfo.config = config;
-        debugInfo.context = context;
-        debugInfo.wasDataProvisionedForConfig = false;
+        resetComponentStateWhenRemoved(childVM);
       }
-      connector.update(config, context);
-    }, noop);
-  };
-  // Computes the current wire config and calls the update method on the wire adapter.
-  // If it has params, we will need to observe changes in the next tick.
+    }
+  }
+}
+function runLightChildNodesDisconnectedCallback(vm) {
   const {
-    computeConfigAndUpdate,
-    ro
-  } = createConfigWatcher(vm.component, configCallback, updateConnectorConfig);
-  // if the adapter needs contextualization, we need to watch for new context and push it alongside the config
-  if (!isUndefined$1(adapter.contextSchema)) {
-    createContextWatcher(vm, wireDef, newContext => {
-      // every time the context is pushed into this component,
-      // this callback will be invoked with the new computed context
-      if (context !== newContext) {
-        context = newContext;
-        // Note: when new context arrives, the config will be recomputed and pushed along side the new
-        // context, this is to preserve the identity characteristics, config should not have identity
-        // (ever), while context can have identity
-        if (vm.state === 1 /* VMState.connected */) {
-          computeConfigAndUpdate();
-        }
+    aChildren: adoptedChildren
+  } = vm;
+  recursivelyDisconnectChildren(adoptedChildren);
+}
+/**
+ * The recursion doesn't need to be a complete traversal of the vnode graph,
+ * instead it can be partial, when a custom element vnode is found, we don't
+ * need to continue into its children because by attempting to disconnect the
+ * custom element itself will trigger the removal of anything slotted or anything
+ * defined on its shadow.
+ */
+function recursivelyDisconnectChildren(vnodes) {
+  for (let i = 0, len = vnodes.length; i < len; i += 1) {
+    const vnode = vnodes[i];
+    if (!isNull(vnode) && !isUndefined$1(vnode.elm)) {
+      switch (vnode.type) {
+        case 2 /* VNodeType.Element */:
+          recursivelyDisconnectChildren(vnode.children);
+          break;
+        case 3 /* VNodeType.CustomElement */:
+          {
+            const vm = getAssociatedVM(vnode.elm);
+            resetComponentStateWhenRemoved(vm);
+            break;
+          }
       }
-    });
+    }
   }
-  return {
-    // @ts-ignore the boundary protection executes sync, connector is always defined
-    connector,
-    computeConfigAndUpdate,
-    resetConfigWatcher: () => ro.reset()
-  };
-}
-const AdapterToTokenMap = new Map();
-function getAdapterToken(adapter) {
-  return AdapterToTokenMap.get(adapter);
 }
-function setAdapterToken(adapter, token) {
-  AdapterToTokenMap.set(adapter, token);
+// This is a super optimized mechanism to remove the content of the root node (shadow root
+// for shadow DOM components and the root element itself for light DOM) without having to go
+// into snabbdom. Especially useful when the reset is a consequence of an error, in which case the
+// children VNodes might not be representing the current state of the DOM.
+function resetComponentRoot(vm) {
+  const {
+    children,
+    renderRoot,
+    renderer: {
+      remove
+    }
+  } = vm;
+  for (let i = 0, len = children.length; i < len; i++) {
+    const child = children[i];
+    if (!isNull(child) && !isUndefined$1(child.elm)) {
+      remove(child.elm, renderRoot);
+    }
+  }
+  vm.children = EmptyArray;
+  runChildNodesDisconnectedCallback(vm);
+  vm.velements = EmptyArray;
 }
-function storeWiredMethodMeta(descriptor, adapter, configCallback, dynamic) {
-  // support for callable adapters
-  if (adapter.adapter) {
-    adapter = adapter.adapter;
+function scheduleRehydration(vm) {
+  if (isTrue(vm.isScheduled)) {
+    return;
   }
-  const method = descriptor.value;
-  const def = {
-    adapter,
-    method,
-    configCallback,
-    dynamic
-  };
-  WireMetaMap.set(descriptor, def);
+  vm.isScheduled = true;
+  if (rehydrateQueue.length === 0) {
+    addCallbackToNextTick(flushRehydrationQueue);
+  }
+  ArrayPush$1.call(rehydrateQueue, vm);
 }
-function storeWiredFieldMeta(descriptor, adapter, configCallback, dynamic) {
-  // support for callable adapters
-  if (adapter.adapter) {
-    adapter = adapter.adapter;
+function getErrorBoundaryVM(vm) {
+  let currentVm = vm;
+  while (!isNull(currentVm)) {
+    if (!isUndefined$1(currentVm.def.errorCallback)) {
+      return currentVm;
+    }
+    currentVm = currentVm.owner;
   }
-  const def = {
-    adapter,
-    configCallback,
-    dynamic
-  };
-  WireMetaMap.set(descriptor, def);
 }
-function installWireAdapters(vm) {
-  const {
-    context,
-    def: {
-      wire
+function runWithBoundaryProtection(vm, owner, pre, job, post) {
+  let error;
+  pre();
+  try {
+    job();
+  } catch (e) {
+    error = Object(e);
+  } finally {
+    post();
+    if (!isUndefined$1(error)) {
+      addErrorComponentStack(vm, error);
+      const errorBoundaryVm = isNull(owner) ? undefined : getErrorBoundaryVM(owner);
+      if (isUndefined$1(errorBoundaryVm)) {
+        throw error; // eslint-disable-line no-unsafe-finally
+      }
+
+      resetComponentRoot(vm); // remove offenders
+      logOperationStart(6 /* OperationId.ErrorCallback */, vm);
+      // error boundaries must have an ErrorCallback
+      const errorCallback = errorBoundaryVm.def.errorCallback;
+      invokeComponentCallback(errorBoundaryVm, errorCallback, [error, error.wcStack]);
+      logOperationEnd(6 /* OperationId.ErrorCallback */, vm);
     }
-  } = vm;
-  if (process.env.NODE_ENV !== 'production') {
-    vm.debugInfo[WIRE_DEBUG_ENTRY] = create(null);
   }
-  const wiredConnecting = context.wiredConnecting = [];
-  const wiredDisconnecting = context.wiredDisconnecting = [];
-  for (const fieldNameOrMethod in wire) {
-    const descriptor = wire[fieldNameOrMethod];
-    const wireDef = WireMetaMap.get(descriptor);
+}
+function forceRehydration(vm) {
+  // if we must reset the shadowRoot content and render the template
+  // from scratch on an active instance, the way to force the reset
+  // is by replacing the value of old template, which is used during
+  // to determine if the template has changed or not during the rendering
+  // process. If the template returned by render() is different from the
+  // previous stored template, the styles will be reset, along with the
+  // content of the shadowRoot, this way we can guarantee that all children
+  // elements will be throw away, and new instances will be created.
+  vm.cmpTemplate = () => [];
+  if (isFalse(vm.isDirty)) {
+    // forcing the vm to rehydrate in the next tick
+    markComponentAsDirty(vm);
+    scheduleRehydration(vm);
+  }
+}
+
+/*
+ * 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
+ */
+//
+// 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
+//
+// Use the unpatched native getElementById/querySelectorAll rather than the synthetic one
+const getElementById = _globalThis[KEY__NATIVE_GET_ELEMENT_BY_ID];
+const querySelectorAll = _globalThis[KEY__NATIVE_QUERY_SELECTOR_ALL];
+function isSyntheticShadowRootInstance(rootNode) {
+    return rootNode !== document && isTrue(rootNode.synthetic);
+}
+function reportViolation(source, target, attrName) {
+    // The vm is either for the source, the target, or both. Either one or both must be using synthetic
+    // shadow for a violation to be detected.
+    let vm = getAssociatedVMIfPresent(source.getRootNode().host);
+    if (isUndefined$1(vm)) {
+        vm = getAssociatedVMIfPresent(target.getRootNode().host);
+    }
+    if (isUndefined$1(vm)) {
+        // vm should never be undefined here, but just to be safe, bail out and don't report
+        return;
+    }
+    report(0 /* ReportingEventId.CrossRootAriaInSyntheticShadow */, vm);
     if (process.env.NODE_ENV !== 'production') {
-      assert.invariant(wireDef, `Internal Error: invalid wire definition found.`);
+        // 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);
     }
-    if (!isUndefined$1(wireDef)) {
-      const {
-        connector,
-        computeConfigAndUpdate,
-        resetConfigWatcher
-      } = createConnector(vm, fieldNameOrMethod, wireDef);
-      const hasDynamicParams = wireDef.dynamic.length > 0;
-      ArrayPush$1.call(wiredConnecting, () => {
-        connector.connect();
-        if (!lwcRuntimeFlags.ENABLE_WIRE_SYNC_EMIT) {
-          if (hasDynamicParams) {
-            Promise.resolve().then(computeConfigAndUpdate);
+}
+function parseIdRefAttributeValue(attrValue) {
+    // split on whitespace and skip empty strings after splitting
+    return isString(attrValue) ? ArrayFilter.call(StringSplit.call(attrValue, /\s+/), Boolean) : [];
+}
+function detectSyntheticCrossRootAria(elm, attrName, attrValue) {
+    const root = elm.getRootNode();
+    if (!isSyntheticShadowRootInstance(root)) {
+        return;
+    }
+    if (attrName === 'id') {
+        // elm is the target, find the source
+        if (!isString(attrValue) || attrValue.length === 0) {
+            // if our id is null or empty, nobody can reference us
             return;
-          }
         }
-        computeConfigAndUpdate();
-      });
-      ArrayPush$1.call(wiredDisconnecting, () => {
-        connector.disconnect();
-        resetConfigWatcher();
-      });
+        for (const idRefAttrName of ID_REFERENCING_ATTRIBUTES_SET) {
+            // Query all global elements with this attribute. The attribute selector syntax `~=` is for values
+            // that reference multiple IDs, separated by whitespace.
+            const query = `[${idRefAttrName}~="${CSS.escape(attrValue)}"]`;
+            const sourceElements = querySelectorAll.call(document, query);
+            for (let i = 0; i < sourceElements.length; i++) {
+                const sourceElement = sourceElements[i];
+                const sourceRoot = sourceElement.getRootNode();
+                if (sourceRoot !== root) {
+                    reportViolation(sourceElement, elm, idRefAttrName);
+                    break;
+                }
+            }
+        }
+    }
+    else {
+        // elm is the source, find the target
+        const ids = parseIdRefAttributeValue(attrValue);
+        for (const id of ids) {
+            const target = getElementById.call(document, id);
+            if (!isNull(target)) {
+                const targetRoot = target.getRootNode();
+                if (targetRoot !== root) {
+                    // target element's shadow root is not the same as ours
+                    reportViolation(elm, target, attrName);
+                }
+            }
+        }
     }
-  }
 }
-function connectWireAdapters(vm) {
-  const {
-    wiredConnecting
-  } = vm.context;
-  for (let i = 0, len = wiredConnecting.length; i < len; i += 1) {
-    wiredConnecting[i]();
-  }
+let enabled = false;
+// We want to avoid patching globals whenever possible, so this should be tree-shaken out in prod-mode and if
+// reporting is not enabled. It should also only run once
+function enableDetection() {
+    if (enabled) {
+        return; // don't double-apply the patches
+    }
+    enabled = true;
+    const { setAttribute } = Element.prototype;
+    // Detect calling `setAttribute` to set an idref or an id
+    assign(Element.prototype, {
+        setAttribute(attrName, attrValue) {
+            setAttribute.call(this, attrName, attrValue);
+            if (attrName === 'id' || ID_REFERENCING_ATTRIBUTES_SET.has(attrName)) {
+                detectSyntheticCrossRootAria(this, attrName, attrValue);
+            }
+        },
+    });
+    // Detect `elm.id = 'foo'`
+    const idDescriptor = getOwnPropertyDescriptor$1(Element.prototype, 'id');
+    if (!isUndefined$1(idDescriptor)) {
+        const { get, set } = idDescriptor;
+        // These should always be a getter and a setter, but if someone is monkeying with the global descriptor, ignore it
+        if (isFunction$1(get) && isFunction$1(set)) {
+            defineProperty(Element.prototype, 'id', {
+                get() {
+                    return get.call(this);
+                },
+                set(value) {
+                    set.call(this, value);
+                    detectSyntheticCrossRootAria(this, 'id', value);
+                },
+                // On the default descriptor for 'id', enumerable and configurable are true
+                enumerable: true,
+                configurable: true,
+            });
+        }
+    }
 }
-function disconnectWireAdapters(vm) {
-  const {
-    wiredDisconnecting
-  } = vm.context;
-  runWithBoundaryProtection(vm, vm, noop, () => {
-    // job
-    for (let i = 0, len = wiredDisconnecting.length; i < len; i += 1) {
-      wiredDisconnecting[i]();
+// Our detection logic relies on some modern browser features. We can just skip reporting the data
+// for unsupported browsers
+function supportsCssEscape() {
+    return typeof CSS !== 'undefined' && isFunction$1(CSS.escape);
+}
+// If this page is not using synthetic shadow, then we don't need to install detection. Note
+// that we are assuming synthetic shadow is loaded before LWC.
+function isSyntheticShadowLoaded() {
+    // We should probably be calling `renderer.isSyntheticShadowDefined`, but 1) we don't have access to the renderer,
+    // and 2) this code needs to run in @lwc/engine-core, so it can access `logWarn()` and `report()`.
+    return hasOwnProperty$1.call(Element.prototype, KEY__SHADOW_TOKEN);
+}
+// Detecting cross-root ARIA in synthetic shadow only makes sense for the browser
+if (supportsCssEscape() && isSyntheticShadowLoaded()) {
+    // Always run detection in dev mode, so we can at least print to the console
+    if (process.env.NODE_ENV !== 'production') {
+        enableDetection();
+    }
+    else {
+        // In prod mode, only enable detection if reporting is enabled
+        onReportingEnabled(enableDetection);
     }
-  }, noop);
 }
 
 /*
@@ -7120,7 +7491,7 @@ function getComponentConstructor(elm) {
     }
     return ctor;
 }
-/* version: 2.33.0 */
+/* version: 2.35.0 */
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -7227,7 +7598,9 @@ const stylesheetCache = new Map();
 //
 // Test utilities
 //
-if (process.env.NODE_ENV === 'development') {
+// Only used in LWC's Karma tests
+// @ts-ignore
+if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
     // @ts-ignore
     window.__lwcResetGlobalStylesheets = () => {
         stylesheetCache.clear();
@@ -8093,7 +8466,7 @@ function rendererFactory(baseRenderer) {
     function isNull(obj) {
         return obj === null;
     }
-    /** version: 2.33.0 */
+    /** version: 2.35.0 */
 
     /*
      * Copyright (c) 2018, salesforce.com, inc.
@@ -8654,6 +9027,6 @@ defineProperty(LightningElement, 'CustomElementConstructor', {
 });
 freeze(LightningElement);
 seal(LightningElement.prototype);
-/* version: 2.33.0 */
+/* version: 2.35.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 };
+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 };