lwc 2.33.0 → 2.35.0

package/dist/engine-server/esm/es2017/engine-server.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;
 }
@@ -231,6 +231,8 @@ const KEY__SHADOW_RESOLVER = '$shadowResolver$';
 const KEY__SHADOW_STATIC = '$shadowStaticNode$';
 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$';
 
 /*
  * Copyright (c) 2022, salesforce.com, inc.
@@ -470,9 +472,9 @@ function htmlEscape(str, attrMode = false) {
  * 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) 2020, salesforce.com, inc.
@@ -527,6 +529,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) });
@@ -580,7 +583,7 @@ function setFeatureFlagForTest(name, value) {
         setFeatureFlag(name, value);
     }
 }
-/** version: 2.33.0 */
+/** version: 2.35.0 */
 
 /**
  * Copyright (C) 2018 salesforce.com, inc.
@@ -644,7 +647,7 @@ function applyAriaReflection(prototype = Element.prototype) {
         }
     }
 }
-/** version: 2.33.0 */
+/** version: 2.35.0 */
 
 /* proxy-compat-disable */
 
@@ -670,87 +673,6 @@ if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
     }));
   });
 }
-const SPACE_CHAR = 32;
-const EmptyObject = seal(create(null));
-const EmptyArray = seal([]);
-function guid() {
-    function s4() {
-        return Math.floor((1 + Math.random()) * 0x10000)
-            .toString(16)
-            .substring(1);
-    }
-    return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
-}
-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) 2019, 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 TargetToReactiveRecordMap = new WeakMap();
-function valueMutated(target, key) {
-    const reactiveRecord = TargetToReactiveRecordMap.get(target);
-    if (!isUndefined$1(reactiveRecord)) {
-        const reactiveObservers = reactiveRecord[key];
-        if (!isUndefined$1(reactiveObservers)) {
-            for (let i = 0, len = reactiveObservers.length; i < len; i += 1) {
-                const ro = reactiveObservers[i];
-                ro.notify();
-            }
-        }
-    }
-}
-function valueObserved(target, key) {
-    // We should determine if an active Observing Record is present to track mutations.
-    {
-        return;
-    }
-}
-
-/*
- * 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 DUMMY_REACTIVE_OBSERVER = {
-    observe(job) {
-        job();
-    },
-    reset() { },
-    link() { },
-};
-function createReactiveObserver(callback) {
-    // On the server side, we don't need mutation tracking. Skipping it improves performance.
-    return DUMMY_REACTIVE_OBSERVER;
-}
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -805,11 +727,26 @@ function addErrorComponentStack(vm, error) {
  * 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) {
+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);
+    }
+    // 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);
@@ -824,7 +761,88 @@ function log(method, message, vm) {
     }
 }
 function logError(message, vm) {
-    log('error', message, vm);
+    log('error', message, vm, false);
+}
+
+/*
+ * Copyright (c) 2019, 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 TargetToReactiveRecordMap = new WeakMap();
+function valueMutated(target, key) {
+    const reactiveRecord = TargetToReactiveRecordMap.get(target);
+    if (!isUndefined$1(reactiveRecord)) {
+        const reactiveObservers = reactiveRecord[key];
+        if (!isUndefined$1(reactiveObservers)) {
+            for (let i = 0, len = reactiveObservers.length; i < len; i += 1) {
+                const ro = reactiveObservers[i];
+                ro.notify();
+            }
+        }
+    }
+}
+function valueObserved(target, key) {
+    // We should determine if an active Observing Record is present to track mutations.
+    {
+        return;
+    }
+}
+
+/*
+ * 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 DUMMY_REACTIVE_OBSERVER = {
+    observe(job) {
+        job();
+    },
+    reset() { },
+    link() { },
+};
+function createReactiveObserver(callback) {
+    // On the server side, we don't need mutation tracking. Skipping it improves performance.
+    return DUMMY_REACTIVE_OBSERVER;
+}
+const SPACE_CHAR = 32;
+const EmptyObject = seal(create(null));
+const EmptyArray = seal([]);
+function guid() {
+    function s4() {
+        return Math.floor((1 + Math.random()) * 0x10000)
+            .toString(16)
+            .substring(1);
+    }
+    return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
+}
+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;
+    }
 }
 
 /*
@@ -876,7 +894,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',
     },
@@ -961,7 +982,7 @@ const globalHTMLProperties = assign(create(null), {
     role: {
         attribute: 'role',
     },
-});
+};
 let controlledElement = null;
 let controlledAttributeName;
 function isAttributeLocked(elm, attrName) {
@@ -2414,70 +2435,273 @@ 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;
-            }
-            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;
-        },
-        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();
-    }
-    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,
-    };
+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) {
+  // creating the reactive observer for reactive params when needed
+  const ro = createReactiveObserver();
+  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;
+      }
+      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);
 }
 
 /*
@@ -2486,23 +2710,95 @@ function createPublicAccessorDescriptor(key, descriptor) {
  * 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);
-    }
+function api$1() {
     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.`);
+        assert.fail(`@api decorator can only be used as a decorator function.`);
     }
     throw new Error();
 }
-function internalTrackDecorator(key) {
+function createPublicPropertyDescriptor(key) {
     return {
         get() {
             const vm = getAssociatedVM(this);
-            return vm.cmpFields[key];
-        },
-        set(newValue) {
-            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;
+            }
+            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;
+        },
+        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() {
+            const vm = getAssociatedVM(this);
+            return vm.cmpFields[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)}`);
@@ -3344,6 +3640,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
@@ -3367,7 +3666,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
@@ -3439,10 +3740,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
@@ -4048,6 +4356,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
@@ -4240,7 +4570,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
@@ -4253,15 +4582,61 @@ 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;
   }
 }
+/**
+ * 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
@@ -4286,22 +4661,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 : '';
@@ -4311,15 +4684,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
@@ -4350,14 +4714,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 = {};
@@ -5184,7 +5548,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
@@ -5227,9 +5591,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;
@@ -5238,6 +5601,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.
@@ -5547,6 +5919,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,
@@ -5559,6 +5932,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();
   if (process.env.NODE_ENV !== 'production') {
@@ -5577,6 +5951,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
@@ -5672,466 +6082,207 @@ function patchShadowRoot(vm, newCh) {
         // job
         patchChildren(oldCh, newCh, renderRoot, renderer);
       }, () => {
-        // post
-        logOperationEnd(2 /* OperationId.Patch */, vm);
-      });
-    }
-  }
-  if (vm.state === 1 /* VMState.connected */) ;
-}
-
-function runConnectedCallback(vm) {
-  const {
-    state
-  } = vm;
-  if (state === 1 /* VMState.connected */) {
-    return; // nothing to do since it was already connected
-  }
-
-  vm.state = 1 /* VMState.connected */;
-  // reporting connection
-  const {
-    connected
-  } = Services;
-  if (connected) {
-    invokeServiceHook(vm, connected);
-  }
-  if (hasWireAdapters(vm)) {
-    connectWireAdapters(vm);
-  }
-  const {
-    connectedCallback
-  } = vm.def;
-  if (!isUndefined$1(connectedCallback)) {
-    logOperationStart(3 /* OperationId.ConnectedCallback */, vm);
-    invokeComponentCallback(vm, connectedCallback);
-    logOperationEnd(3 /* OperationId.ConnectedCallback */, vm);
-  }
-}
-function hasWireAdapters(vm) {
-  return getOwnPropertyNames$1(vm.def.wire).length > 0;
-}
-function runDisconnectedCallback(vm) {
-  if (process.env.NODE_ENV !== 'production') {
-    assert.isTrue(vm.state !== 2 /* VMState.disconnected */, `${vm} must be inserted.`);
-  }
-  if (isFalse(vm.isDirty)) {
-    // this guarantees that if the component is reused/reinserted,
-    // it will be re-rendered because we are disconnecting the reactivity
-    // linking, so mutations are not automatically reflected on the state
-    // of disconnected components.
-    vm.isDirty = true;
-  }
-  vm.state = 2 /* VMState.disconnected */;
-  // reporting disconnection
-  const {
-    disconnected
-  } = Services;
-  if (disconnected) {
-    invokeServiceHook(vm, disconnected);
-  }
-  if (hasWireAdapters(vm)) {
-    disconnectWireAdapters(vm);
-  }
-  const {
-    disconnectedCallback
-  } = vm.def;
-  if (!isUndefined$1(disconnectedCallback)) {
-    logOperationStart(5 /* OperationId.DisconnectedCallback */, vm);
-    invokeComponentCallback(vm, disconnectedCallback);
-    logOperationEnd(5 /* OperationId.DisconnectedCallback */, vm);
-  }
-}
-function runChildNodesDisconnectedCallback(vm) {
-  const {
-    velements: vCustomElementCollection
-  } = vm;
-  // Reporting disconnection for every child in inverse order since they are
-  // inserted in reserved order.
-  for (let i = vCustomElementCollection.length - 1; i >= 0; i -= 1) {
-    const {
-      elm
-    } = vCustomElementCollection[i];
-    // There are two cases where the element could be undefined:
-    // * when there is an error during the construction phase, and an error
-    //   boundary picks it, there is a possibility that the VCustomElement
-    //   is not properly initialized, and therefore is should be ignored.
-    // * when slotted custom element is not used by the element where it is
-    //   slotted into it, as  a result, the custom element was never
-    //   initialized.
-    if (!isUndefined$1(elm)) {
-      const childVM = getAssociatedVMIfPresent(elm);
-      // The VM associated with the element might be associated undefined
-      // 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 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);
-    }
-  }
-}
-
-/*
- * 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) {
-  // creating the reactive observer for reactive params when needed
-  const ro = createReactiveObserver();
-  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;
-      }
-      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();
-        }
-      }
-    });
+        // post
+        logOperationEnd(2 /* OperationId.Patch */, vm);
+      });
+    }
   }
-  return {
-    // @ts-ignore the boundary protection executes sync, connector is always defined
-    connector,
-    computeConfigAndUpdate,
-    resetConfigWatcher: () => ro.reset()
-  };
+  if (vm.state === 1 /* VMState.connected */) ;
 }
-const AdapterToTokenMap = new Map();
-function getAdapterToken(adapter) {
-  return AdapterToTokenMap.get(adapter);
+
+function runConnectedCallback(vm) {
+  const {
+    state
+  } = vm;
+  if (state === 1 /* VMState.connected */) {
+    return; // nothing to do since it was already connected
+  }
+
+  vm.state = 1 /* VMState.connected */;
+  // reporting connection
+  const {
+    connected
+  } = Services;
+  if (connected) {
+    invokeServiceHook(vm, connected);
+  }
+  if (hasWireAdapters(vm)) {
+    connectWireAdapters(vm);
+  }
+  const {
+    connectedCallback
+  } = vm.def;
+  if (!isUndefined$1(connectedCallback)) {
+    logOperationStart(3 /* OperationId.ConnectedCallback */, vm);
+    invokeComponentCallback(vm, connectedCallback);
+    logOperationEnd(3 /* OperationId.ConnectedCallback */, vm);
+  }
 }
-function setAdapterToken(adapter, token) {
-  AdapterToTokenMap.set(adapter, token);
+function hasWireAdapters(vm) {
+  return getOwnPropertyNames$1(vm.def.wire).length > 0;
 }
-function storeWiredMethodMeta(descriptor, adapter, configCallback, dynamic) {
-  // support for callable adapters
-  if (adapter.adapter) {
-    adapter = adapter.adapter;
+function runDisconnectedCallback(vm) {
+  if (process.env.NODE_ENV !== 'production') {
+    assert.isTrue(vm.state !== 2 /* VMState.disconnected */, `${vm} must be inserted.`);
   }
-  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;
+  if (isFalse(vm.isDirty)) {
+    // this guarantees that if the component is reused/reinserted,
+    // it will be re-rendered because we are disconnecting the reactivity
+    // linking, so mutations are not automatically reflected on the state
+    // of disconnected components.
+    vm.isDirty = true;
+  }
+  vm.state = 2 /* VMState.disconnected */;
+  // reporting disconnection
+  const {
+    disconnected
+  } = Services;
+  if (disconnected) {
+    invokeServiceHook(vm, disconnected);
+  }
+  if (hasWireAdapters(vm)) {
+    disconnectWireAdapters(vm);
+  }
+  const {
+    disconnectedCallback
+  } = vm.def;
+  if (!isUndefined$1(disconnectedCallback)) {
+    logOperationStart(5 /* OperationId.DisconnectedCallback */, vm);
+    invokeComponentCallback(vm, disconnectedCallback);
+    logOperationEnd(5 /* OperationId.DisconnectedCallback */, vm);
   }
-  const def = {
-    adapter,
-    configCallback,
-    dynamic
-  };
-  WireMetaMap.set(descriptor, def);
 }
-function installWireAdapters(vm) {
+function runChildNodesDisconnectedCallback(vm) {
   const {
-    context,
-    def: {
-      wire
-    }
+    velements: vCustomElementCollection
   } = 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.`);
+  // Reporting disconnection for every child in inverse order since they are
+  // inserted in reserved order.
+  for (let i = vCustomElementCollection.length - 1; i >= 0; i -= 1) {
+    const {
+      elm
+    } = vCustomElementCollection[i];
+    // There are two cases where the element could be undefined:
+    // * when there is an error during the construction phase, and an error
+    //   boundary picks it, there is a possibility that the VCustomElement
+    //   is not properly initialized, and therefore is should be ignored.
+    // * when slotted custom element is not used by the element where it is
+    //   slotted into it, as  a result, the custom element was never
+    //   initialized.
+    if (!isUndefined$1(elm)) {
+      const childVM = getAssociatedVMIfPresent(elm);
+      // The VM associated with the element might be associated undefined
+      // 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);
+      }
     }
-    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;
+  }
+}
+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;
           }
-        }
-        computeConfigAndUpdate();
-      });
-      ArrayPush$1.call(wiredDisconnecting, () => {
-        connector.disconnect();
-        resetConfigWatcher();
-      });
+      }
     }
   }
 }
-function connectWireAdapters(vm) {
+// 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 {
-    wiredConnecting
-  } = vm.context;
-  for (let i = 0, len = wiredConnecting.length; i < len; i += 1) {
-    wiredConnecting[i]();
+    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 disconnectWireAdapters(vm) {
-  const {
-    wiredDisconnecting
-  } = vm.context;
-  runWithBoundaryProtection(vm, vm, noop, () => {
-    // job
-    for (let i = 0, len = wiredDisconnecting.length; i < len; i += 1) {
-      wiredDisconnecting[i]();
+function getErrorBoundaryVM(vm) {
+  let currentVm = vm;
+  while (!isNull(currentVm)) {
+    if (!isUndefined$1(currentVm.def.errorCallback)) {
+      return currentVm;
     }
-  }, noop);
+    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);
+    }
+  }
+}
+
+/*
+ * 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
+_globalThis[KEY__NATIVE_GET_ELEMENT_BY_ID];
+_globalThis[KEY__NATIVE_QUERY_SELECTOR_ALL];
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -6377,7 +6528,7 @@ function freezeTemplate(tmpl) {
     }
   }
 }
-/* version: 2.33.0 */
+/* version: 2.35.0 */
 
 /*
  * Copyright (c) 2020, salesforce.com, inc.
@@ -6848,6 +6999,6 @@ function renderComponent(tagName, Ctor, props = {}) {
  */
 freeze(LightningElement);
 seal(LightningElement.prototype);
-/* version: 2.33.0 */
+/* version: 2.35.0 */
 
 export { LightningElement, api$1 as api, createContextProvider, freezeTemplate, getComponentDef, isComponentConstructor, parseFragment, parseFragment as parseSVGFragment, readonly, register, registerComponent, registerDecorators, registerTemplate, renderComponent, renderer, sanitizeAttribute, setFeatureFlag, setFeatureFlagForTest, setHooks, track, unwrap, wire };