@lwrjs/everywhere 0.9.0-alpha.23 → 0.9.0-alpha.26

package/build/__generated_site_amd_modules__/1/module/amd/1/l/en-US/mi/lwc/v/{2_33_0/s/90a5f16131da45cef1653112862ca9dc → 2_38_1/s/8cf6b94d9c0b398c70c97fdca2759caa}/lwc.js

@@ -1,4 +1,4 @@
-LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
+LWR.define('lwc/v/2_38_1', ['exports'], function (exports) { 'use strict';
 
   /* proxy-compat-disable */
   /**
@@ -30,10 +30,10 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   }
   var assert = /*#__PURE__*/Object.freeze({
     __proto__: null,
+    fail: fail,
     invariant: invariant,
-    isTrue: isTrue$1,
     isFalse: isFalse$1,
-    fail: fail
+    isTrue: isTrue$1
   });
 
   /*
@@ -87,6 +87,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   const {
     charCodeAt: StringCharCodeAt,
     replace: StringReplace,
+    split: StringSplit,
     slice: StringSlice,
     toLowerCase: StringToLowerCase
   } = String.prototype;
@@ -182,6 +183,9 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       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.
@@ -189,39 +193,11 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    * SPDX-License-Identifier: MIT
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
-  // Inspired from: https://mathiasbynens.be/notes/globalthis
-  const _globalThis = /*@__PURE__*/function () {
-    // On recent browsers, `globalThis` is already defined. In this case return it directly.
-    if (typeof globalThis === 'object') {
-      return globalThis;
-    }
-    let _globalThis;
-    try {
-      // eslint-disable-next-line no-extend-native
-      Object.defineProperty(Object.prototype, '__magic__', {
-        get: function () {
-          return this;
-        },
-        configurable: true
-      });
-      // __magic__ is undefined in Safari 10 and IE10 and older.
-      // @ts-ignore
-      // eslint-disable-next-line no-undef
-      _globalThis = __magic__;
-      // @ts-ignore
-      delete Object.prototype.__magic__;
-    } catch (ex) {
-      // In IE8, Object.defineProperty only works on DOM objects.
-    } finally {
-      // If the magic above fails for some reason we assume that we are in a legacy browser.
-      // Assume `window` exists in this case.
-      if (typeof _globalThis === 'undefined') {
-        // @ts-ignore
-        _globalThis = window;
-      }
-    }
-    return _globalThis;
-  }();
+  // See browser support for globalThis:
+  // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/globalThis#browser_compatibility
+  /* istanbul ignore next */
+  // @ts-ignore
+  const _globalThis = typeof globalThis === 'object' ? globalThis : window;
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -235,6 +211,8 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   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';
@@ -320,6 +298,24 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     return propertyName;
   }
 
+  /*
+   * 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
+   */
+  const ESCAPED_CHARS = {
+    '"': '"',
+    "'": ''',
+    '<': '&lt;',
+    '>': '&gt;',
+    '&': '&amp;'
+  };
+  function htmlEscape(str, attrMode = false) {
+    const searchValue = attrMode ? /["&]/g : /["'<>&]/g;
+    return str.replace(searchValue, char => ESCAPED_CHARS[char]);
+  }
+
   /*
    * Copyright (c) 2018, salesforce.com, inc.
    * All rights reserved.
@@ -327,9 +323,9 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    * 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.38.1";
   const LWC_VERSION_COMMENT_REGEX = /\/\*LWC compiler v([\d.]+)\*\/\s*}/;
-  /** version: 2.33.0 */
+  /** version: 2.38.1 */
 
   /**
    * Copyright (C) 2018 salesforce.com, inc.
@@ -349,16 +345,17 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     ENABLE_WIRE_SYNC_EMIT: null,
     ENABLE_LIGHT_GET_ROOT_NODE_PATCH: null,
     DISABLE_LIGHT_DOM_UNSCOPED_CSS: null,
-    ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY: null,
     ENABLE_FROZEN_TEMPLATE: null,
     DISABLE_ARIA_REFLECTION_POLYFILL: null
   };
+  // eslint-disable-next-line no-restricted-properties
   if (!_globalThis.lwcRuntimeFlags) {
     Object.defineProperty(_globalThis, 'lwcRuntimeFlags', {
       value: create(null)
     });
   }
-  const lwcRuntimeFlags = _globalThis.lwcRuntimeFlags;
+  // eslint-disable-next-line no-restricted-properties
+  const flags = _globalThis.lwcRuntimeFlags;
   /**
    * Set the value at runtime of a given feature flag. This method only be invoked once per feature
    * flag. It is meant to be used during the app initialization.
@@ -380,18 +377,19 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       console.warn(`Failed to set the value "${value}" for the runtime feature flag "${name}" because it is undefined. Available flags: ${availableFlags}.`);
       return;
     }
-    if (process.env.NODE_ENV !== 'production') {
+    // This may seem redundant, but `process.env.NODE_ENV === 'test-karma-lwc'` is replaced by Karma tests
+    if (process.env.NODE_ENV === 'test-karma-lwc' || process.env.NODE_ENV !== 'production') {
       // Allow the same flag to be set more than once outside of production to enable testing
-      lwcRuntimeFlags[name] = value;
+      flags[name] = value;
     } else {
       // Disallow the same flag to be set more than once in production
-      const runtimeValue = lwcRuntimeFlags[name];
+      const runtimeValue = flags[name];
       if (!isUndefined$1(runtimeValue)) {
         // eslint-disable-next-line no-console
         console.error(`Failed to set the value "${value}" for the runtime feature flag "${name}". "${name}" has already been set with the value "${runtimeValue}".`);
         return;
       }
-      defineProperty(lwcRuntimeFlags, name, {
+      defineProperty(flags, name, {
         value
       });
     }
@@ -401,11 +399,12 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    * purposes. It is a no-op when invoked in production mode.
    */
   function setFeatureFlagForTest(name, value) {
-    if (process.env.NODE_ENV !== 'production') {
+    // This may seem redundant, but `process.env.NODE_ENV === 'test-karma-lwc'` is replaced by Karma tests
+    if (process.env.NODE_ENV === 'test-karma-lwc' || process.env.NODE_ENV !== 'production') {
       setFeatureFlag(name, value);
     }
   }
-  /** version: 2.33.0 */
+  /** version: 2.38.1 */
 
   /**
    * Copyright (C) 2018 salesforce.com, inc.
@@ -468,7 +467,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       }
     }
   }
-  /** version: 2.33.0 */
+  /** version: 2.38.1 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -482,30 +481,77 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     applyAriaReflection();
   }
 
+  /* proxy-compat-disable */
+
   /*
    * 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
    */
-  // Only used in LWC's Karma tests
-  // @ts-ignore
-  if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
-    window.addEventListener('test-dummy-flag', () => {
-      let hasFlag = false;
-      if (lwcRuntimeFlags.DUMMY_TEST_FLAG) {
-        hasFlag = true;
-      }
-      window.dispatchEvent(new CustomEvent('has-dummy-flag', {
-        detail: {
-          package: '@lwc/engine-dom',
-          hasFlag
-        }
-      }));
-    });
-  }
+  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
+    },
 
-  /* proxy-compat-disable */
+    /**
+     * 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();
+    } else {
+      // call later
+      onReportingEnabledCallbacks.push(callback);
+    }
+  }
+  /**
+   * Report to the current dispatcher, if there is one.
+   * @param reportingEventId
+   * @param payload - data to report
+   */
+  function report(reportingEventId, payload) {
+    if (enabled$1) {
+      currentDispatcher$1(reportingEventId, payload);
+    }
+  }
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -513,21 +559,28 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    * SPDX-License-Identifier: MIT
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
-  // Only used in LWC's Karma tests
-  // @ts-ignore
-  if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
-    window.addEventListener('test-dummy-flag', () => {
-      let hasFlag = false;
-      if (lwcRuntimeFlags.DUMMY_TEST_FLAG) {
-        hasFlag = true;
-      }
-      window.dispatchEvent(new CustomEvent('has-dummy-flag', {
-        detail: {
-          package: '@lwc/engine-core',
-          hasFlag
-        }
-      }));
-    });
+  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;
+    }
+    return wcStack.reverse().join('\n\t');
   }
 
   /*
@@ -536,90 +589,63 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    * 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.`);
-      }
-    }
-    const callbacks = nextTickCallbackQueue;
-    nextTickCallbackQueue = []; // reset to a new queue
-    for (let i = 0, len = callbacks.length; i < len; i += 1) {
-      callbacks[i]();
+  function addErrorComponentStack(vm, error) {
+    if (!isFrozen(error) && isUndefined$1(error.wcStack)) {
+      const wcStack = getErrorComponentStack(vm);
+      defineProperty(error, 'wcStack', {
+        get() {
+          return wcStack;
+        }
+      });
     }
   }
-  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);
-    }
-    ArrayPush$1.call(nextTickCallbackQueue, callback);
+
+  /*
+   * 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();
+  // Only used in LWC's Karma tests
+  if (process.env.NODE_ENV === 'test-karma-lwc') {
+    // @ts-ignore
+    window.__lwcResetAlreadyLoggedMessages = () => {
+      alreadyLoggedMessages.clear();
+    };
   }
-  function guid() {
-    function s4() {
-      return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
+  function log(method, message, vm, once) {
+    let msg = `[LWC ${method}]: ${message}`;
+    if (!isUndefined$1(vm)) {
+      msg = `${msg}\n${getComponentStack(vm)}`;
     }
-    return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
-  }
-  // 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();
-        }
+    if (once) {
+      if (alreadyLoggedMessages.has(msg)) {
+        return;
       }
+      alreadyLoggedMessages.add(msg);
     }
-    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];
-      }
+    // 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;
     }
-    return result;
-  }
-  function flattenStylesheets(stylesheets) {
-    const list = [];
-    for (const stylesheet of stylesheets) {
-      if (!Array.isArray(stylesheet)) {
-        list.push(stylesheet);
-      } else {
-        list.push(...flattenStylesheets(stylesheet));
-      }
+    try {
+      throw new Error(msg);
+    } catch (e) {
+      /* eslint-disable-next-line no-console */
+      console[method](e);
     }
-    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;
-    }
+  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);
   }
 
   /*
@@ -742,75 +768,98 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    * 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';
+  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.`);
+      }
+    }
+    const callbacks = nextTickCallbackQueue;
+    nextTickCallbackQueue = []; // reset to a new queue
+    for (let i = 0, len = callbacks.length; i < len; i += 1) {
+      callbacks[i]();
     }
-    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;
+  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`);
+      }
     }
-    return wcStack.reverse().join('\n\t');
+    if (nextTickCallbackQueue.length === 0) {
+      Promise.resolve().then(flushCallbackQueue);
+    }
+    ArrayPush$1.call(nextTickCallbackQueue, callback);
   }
-
-  /*
-   * 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;
-        }
-      });
+  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) 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)}`;
+  // 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();
+        }
+      }
     }
-    if (process.env.NODE_ENV === 'test') {
-      /* eslint-disable-next-line no-console */
-      console[method](msg);
-      return;
+    return styleMap;
+  }
+  // Make a shallow copy of an object but omit the given key
+  function cloneAndOmitKey(object, keyToOmit) {
+    const result = {};
+    for (const key of keys(object)) {
+      if (key !== keyToOmit) {
+        result[key] = object[key];
+      }
     }
-    try {
-      throw new Error(msg);
-    } catch (e) {
-      /* eslint-disable-next-line no-console */
-      console[method](e);
+    return result;
+  }
+  function flattenStylesheets(stylesheets) {
+    const list = [];
+    for (const stylesheet of stylesheets) {
+      if (!isArray$1(stylesheet)) {
+        list.push(stylesheet);
+      } else {
+        list.push(...flattenStylesheets(stylesheet));
+      }
     }
+    return list;
   }
-  function logError(message, vm) {
-    log('error', message, vm);
+  // 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;
+    }
   }
-  function logWarn(message, vm) {
-    log('warn', message, vm);
+  // Throw an error if we're running in prod mode. Ensures code is truly removed from prod mode.
+  function assertNotProd() {
+    /* istanbul ignore if */
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
+    }
   }
 
   /*
@@ -852,7 +901,10 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   // 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'
     },
@@ -937,7 +989,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     role: {
       attribute: 'role'
     }
-  });
+  };
   let controlledElement = null;
   let controlledAttributeName;
   function isAttributeLocked(elm, attrName) {
@@ -1004,27 +1056,18 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   }
   let isDomMutationAllowed = false;
   function unlockDomMutation() {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     isDomMutationAllowed = true;
   }
   function lockDomMutation() {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     isDomMutationAllowed = false;
   }
   function logMissingPortalError(name, type) {
     return logError(`The \`${name}\` ${type} is available only on elements that use the \`lwc:dom="manual"\` directive.`);
   }
   function patchElementWithRestrictions(elm, options) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     const originalOuterHTMLDescriptor = getPropertyDescriptor(elm, 'outerHTML');
     const descriptors = {
       outerHTML: generateAccessorDescriptor({
@@ -1110,10 +1153,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     defineProperties(elm, descriptors);
   }
   function getShadowRootRestrictionsDescriptors(sr) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     // Disallowing properties in dev mode only to avoid people doing the wrong
     // thing when using the real shadow root, because if that's the case,
     // the component will not work when running with synthetic shadow.
@@ -1154,10 +1194,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   // Custom Elements Restrictions:
   // -----------------------------
   function getCustomElementRestrictionsDescriptors(elm) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     const originalAddEventListener = elm.addEventListener;
     const originalInnerHTMLDescriptor = getPropertyDescriptor(elm, 'innerHTML');
     const originalOuterHTMLDescriptor = getPropertyDescriptor(elm, 'outerHTML');
@@ -1202,10 +1239,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     };
   }
   function getComponentRestrictionsDescriptors() {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     return {
       tagName: generateAccessorDescriptor({
         get() {
@@ -1218,10 +1252,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   }
 
   function getLightningElementPrototypeRestrictionsDescriptors(proto) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     const originalDispatchEvent = proto.dispatchEvent;
     const descriptors = {
       dispatchEvent: generateDataDescriptor({
@@ -1666,7 +1697,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       valueMutated(originalTarget, key);
       return true;
     }
-    /*LWC compiler v2.33.0*/
+    /*LWC compiler v2.38.1*/
   }
   const getterMap = new WeakMap();
   const setterMap = new WeakMap();
@@ -1759,7 +1790,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       /* istanbul ignore next */
       return false;
     }
-    /*LWC compiler v2.33.0*/
+    /*LWC compiler v2.38.1*/
   }
   function extract(objectOrArray) {
     if (isArray(objectOrArray)) {
@@ -2026,7 +2057,6 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       }
     };
   }
-  const EMPTY_REFS = freeze(create(null));
   const refsCache = new WeakMap();
   /**
    * This class is the base class for any LWC element.
@@ -2314,7 +2344,6 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       }
       const {
         refVNodes,
-        hasRefVNodes,
         cmpTemplate
       } = vm;
       // If the `cmpTemplate` is null, that means that the template has not been rendered yet. Most likely this occurs
@@ -2328,15 +2357,9 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       // were introduced, we return undefined if the template has no refs defined
       // anywhere. This fixes components that may want to add an expando called `refs`
       // and are checking if it exists with `if (this.refs)`  before adding it.
-      // Note it is not sufficient to just check if `refVNodes` is null or empty,
-      // because a template may have `lwc:ref` defined within a falsy `if:true` block.
-      if (!hasRefVNodes) {
-        return;
-      }
-      // For templates that are using `lwc:ref`, if there are no refs currently available
-      // (e.g. refs inside of a falsy `if:true` block), we return an empty object.
+      // Note we use a null refVNodes to indicate that the template has no refs defined.
       if (isNull(refVNodes)) {
-        return EMPTY_REFS;
+        return;
       }
       // The refNodes can be cached based on the refVNodes, since the refVNodes
       // are recreated from scratch every time the template is rendered.
@@ -2414,6 +2437,14 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       }
       return renderer.getLastElementChild(vm.elm);
     },
+    get ownerDocument() {
+      const vm = getAssociatedVM(this);
+      const renderer = vm.renderer;
+      if (process.env.NODE_ENV !== 'production') {
+        warnIfInvokedDuringConstruction(vm, 'ownerDocument');
+      }
+      return renderer.ownerDocument(vm.elm);
+    },
     render() {
       const vm = getAssociatedVM(this);
       return vm.def.template;
@@ -2456,8 +2487,6 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     // This allows `this.aria*` property accessors to work from inside a component, and to reflect `aria-*` attrs.
     applyAriaReflection(LightningElement.prototype);
   }
-  // The reason for this odd if/else branching is limitations in @lwc/features:
-  // https://github.com/salesforce/lwc/blob/master/packages/%40lwc/features/README.md#only-works-with-if-statements
   if (lwcRuntimeFlags.DISABLE_ARIA_REFLECTION_POLYFILL) {
     applyAriaReflectionToLightningElement();
   }
@@ -2488,172 +2517,480 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   }
 
   /*
-   * Copyright (c) 2018, salesforce.com, inc.
+   * Copyright (c) 2023, 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.`);
+  const AdapterToTokenMap = new Map();
+  function createContextProviderWithRegister(adapter, registerContextProvider) {
+    let adapterContextToken = AdapterToTokenMap.get(adapter);
+    if (!isUndefined$1(adapterContextToken)) {
+      throw new Error(`Adapter already has a context provider.`);
     }
-    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);
+    adapterContextToken = guid();
+    AdapterToTokenMap.set(adapter, adapterContextToken);
+    const providers = new WeakSet();
+    return (elmOrComponent, options) => {
+      if (providers.has(elmOrComponent)) {
+        throw new Error(`Adapter was already installed on ${elmOrComponent}.`);
+      }
+      providers.add(elmOrComponent);
+      const {
+        consumerConnectedCallback,
+        consumerDisconnectedCallback
+      } = options;
+      registerContextProvider(elmOrComponent, adapterContextToken, subscriptionPayload => {
+        const {
+          setNewContext,
+          setDisconnectedCallback
+        } = subscriptionPayload;
+        const consumer = {
+          provide(newContext) {
+            setNewContext(newContext);
           }
-          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
+        };
+        const disconnectCallback = () => {
+          if (!isUndefined$1(consumerDisconnectedCallback)) {
+            consumerDisconnectedCallback(consumer);
+          }
+        };
+        setDisconnectedCallback(disconnectCallback);
+        consumerConnectedCallback(consumer);
+      });
     };
   }
-  function createPublicAccessorDescriptor(key, descriptor) {
+  function createContextWatcher(vm, wireDef, callbackWhenContextIsReady) {
     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();
+      adapter
+    } = wireDef;
+    const adapterContextToken = AdapterToTokenMap.get(adapter);
+    if (isUndefined$1(adapterContextToken)) {
+      return; // no provider found, nothing to be done
     }
-    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);
+
+    const {
+      elm,
+      context: {
+        wiredConnecting,
+        wiredDisconnecting
       },
-      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.`);
+      renderer: {
+        registerContextConsumer
+      }
+    } = vm;
+    // waiting for the component to be connected to formally request the context via the token
+    ArrayPush$1.call(wiredConnecting, () => {
+      // This will attempt to connect the current element with one of its anscestors
+      // that can provide context for the given wire adapter. This relationship is
+      // keyed on the secret & internal value of `adapterContextToken`, which is unique
+      // to a given wire adapter.
+      //
+      // Depending on the runtime environment, this connection is made using either DOM
+      // events (in the browser) or a custom traversal (on the server).
+      registerContextConsumer(elm, 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);
         }
-      },
-      enumerable,
-      configurable
-    };
+      });
+    });
   }
 
   /*
-   * Copyright (c) 2018, salesforce.com, inc.
+   * Copyright (c) 2023, 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);
-        componentValueObserved(vm, key);
-        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)}`);
-          assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
-        }
-        const reactiveOrAnyValue = getReactiveProxy(newValue);
-        updateComponentValue(vm, key, reactiveOrAnyValue);
-      },
-      enumerable: true,
-      configurable: true
+  const DeprecatedWiredElementHost = '$$DeprecatedWiredElementHostKey$$';
+  const DeprecatedWiredParamsMeta = '$$DeprecatedWiredParamsMetaKey$$';
+  const WIRE_DEBUG_ENTRY = '@wire';
+  const WireMetaMap = new Map();
+  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 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()
+    };
+  }
+  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
    */
-  /**
-   * @wire decorator to wire fields and methods to a wire adapter in
-   * LWC Components. This function implements the internals of this
-   * decorator.
-   */
-  function wire(_adapter, _config) {
+  function api$1() {
     if (process.env.NODE_ENV !== 'production') {
-      assert.fail('@wire(adapter, config?) may only be used as a decorator.');
+      assert.fail(`@api decorator can only be used as a decorator function.`);
     }
     throw new Error();
   }
-  function internalWireFieldDecorator(key) {
+  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.cmpFields[key];
+        return vm.cmpProps[key];
       },
-      set(value) {
+      set(newValue) {
         const vm = getAssociatedVM(this);
-        /**
-         * Reactivity for wired fields is provided in wiring.
-         * We intentionally add reactivity here since this is just
-         * letting the author to do the wrong thing, but it will keep our
-         * system to be backward compatible.
-         */
-        updateComponentValue(vm, key, value);
+        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
     };
   }
-
-  /*
-   * 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 getClassDescriptorType(descriptor) {
-    if (isFunction$1(descriptor.value)) {
-      return "method" /* DescriptorType.Method */;
-    } else if (isFunction$1(descriptor.set) || isFunction$1(descriptor.get)) {
-      return "accessor" /* DescriptorType.Accessor */;
-    } else {
-      return "field" /* DescriptorType.Field */;
+  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);
+        componentValueObserved(vm, key);
+        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)}`);
+          assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
+        }
+        const reactiveOrAnyValue = getReactiveProxy(newValue);
+        updateComponentValue(vm, key, reactiveOrAnyValue);
+      },
+      enumerable: true,
+      configurable: true
+    };
+  }
+
+  /*
+   * 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
+   */
+  /**
+   * @wire decorator to wire fields and methods to a wire adapter in
+   * LWC Components. This function implements the internals of this
+   * decorator.
+   */
+  function wire(_adapter, _config) {
+    if (process.env.NODE_ENV !== 'production') {
+      assert.fail('@wire(adapter, config?) may only be used as a decorator.');
+    }
+    throw new Error();
+  }
+  function internalWireFieldDecorator(key) {
+    return {
+      get() {
+        const vm = getAssociatedVM(this);
+        componentValueObserved(vm, key);
+        return vm.cmpFields[key];
+      },
+      set(value) {
+        const vm = getAssociatedVM(this);
+        /**
+         * Reactivity for wired fields is provided in wiring.
+         * We intentionally add reactivity here since this is just
+         * letting the author to do the wrong thing, but it will keep our
+         * system to be backward compatible.
+         */
+        updateComponentValue(vm, key, value);
+      },
+      enumerable: true,
+      configurable: true
+    };
+  }
+
+  /*
+   * 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 getClassDescriptorType(descriptor) {
+    if (isFunction$1(descriptor.value)) {
+      return "method" /* DescriptorType.Method */;
+    } else if (isFunction$1(descriptor.set) || isFunction$1(descriptor.get)) {
+      return "accessor" /* DescriptorType.Accessor */;
+    } else {
+      return "field" /* DescriptorType.Field */;
     }
   }
 
@@ -2869,8 +3206,8 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
   let warned = false;
-  // @ts-ignore
-  if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
+  // Only used in LWC's Karma tests
+  if (process.env.NODE_ENV === 'test-karma-lwc') {
     // @ts-ignore
     window.__lwcResetWarnedOnVersionMismatch = () => {
       warned = false;
@@ -2887,6 +3224,10 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
         // stylesheets and templates do not have user-meaningful names, but components do
         const friendlyName = type === 'component' ? `${type} ${func.name}` : type;
         logError(`LWC WARNING: current engine is v${LWC_VERSION}, but ${friendlyName} was compiled with v${version}.\nPlease update your compiled code or LWC engine so that the versions match.\nNo further warnings will appear.`);
+        report("CompilerRuntimeVersionMismatch" /* ReportingEventId.CompilerRuntimeVersionMismatch */, {
+          compilerVersion: version,
+          runtimeVersion: LWC_VERSION
+        });
       }
     }
   }
@@ -3012,7 +3353,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
      */
     if (isFunction$1(SuperClass)) {
       HTMLBridgeElement = class extends SuperClass {
-        /*LWC compiler v2.33.0*/
+        /*LWC compiler v2.38.1*/
       };
     } else {
       HTMLBridgeElement = function () {
@@ -3168,10 +3509,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     return canRefreshAllInstances;
   }
   function getTemplateOrSwappedTemplate(tpl) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     const visited = new Set();
     while (swappedTemplateMap.has(tpl) && !visited.has(tpl)) {
       visited.add(tpl);
@@ -3180,10 +3518,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     return tpl;
   }
   function getComponentOrSwappedComponent(Ctor) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     const visited = new Set();
     while (swappedComponentMap.has(Ctor) && !visited.has(Ctor)) {
       visited.add(Ctor);
@@ -3192,10 +3527,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     return Ctor;
   }
   function getStyleOrSwappedStyle(style) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     const visited = new Set();
     while (swappedStyleMap.has(style) && !visited.has(style)) {
       visited.add(style);
@@ -3204,10 +3536,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     return style;
   }
   function setActiveVM(vm) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     // tracking active component
     const Ctor = vm.def.ctor;
     let componentVMs = activeComponents.get(Ctor);
@@ -3250,10 +3579,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     }
   }
   function removeActiveVM(vm) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     // tracking inactive component
     const Ctor = vm.def.ctor;
     let list = activeComponents.get(Ctor);
@@ -3567,6 +3893,9 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       stylesheets: newStylesheets,
       stylesheetToken: newStylesheetToken
     } = template;
+    const {
+      stylesheets: newVmStylesheets
+    } = vm;
     const isSyntheticShadow = renderMode === 1 /* RenderMode.Shadow */ && shadowMode === 1 /* ShadowMode.Synthetic */;
     const {
       hasScopedStyles
@@ -3590,7 +3919,9 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     }
     // 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
@@ -3626,11 +3957,9 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
           stylesheet = getStyleOrSwappedStyle(stylesheet);
         }
         const isScopedCss = stylesheet[KEY__SCOPED_CSS];
-        if (lwcRuntimeFlags.DISABLE_LIGHT_DOM_UNSCOPED_CSS) {
-          if (!isScopedCss && vm.renderMode === 0 /* RenderMode.Light */) {
-            logError('Unscoped CSS is not supported in Light DOM. Please use scoped CSS (*.scoped.css) instead of unscoped CSS (*.css).');
-            continue;
-          }
+        if (lwcRuntimeFlags.DISABLE_LIGHT_DOM_UNSCOPED_CSS && !isScopedCss && vm.renderMode === 0 /* RenderMode.Light */) {
+          logError('Unscoped CSS is not supported in Light DOM. Please use scoped CSS (*.scoped.css) instead of unscoped CSS (*.css).');
+          continue;
         }
         // Apply the scope token only if the stylesheet itself is scoped, or if we're rendering synthetic shadow.
         const scopeToken = isScopedCss || vm.shadowMode === 1 /* ShadowMode.Synthetic */ && vm.renderMode === 1 /* RenderMode.Shadow */ ? stylesheetToken : undefined;
@@ -3662,10 +3991,17 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       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
@@ -3703,10 +4039,13 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     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);
@@ -4376,6 +4715,28 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
         // 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
@@ -4568,7 +4929,6 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     //
     // In case #2, we will always get a fresh VCustomElement.
     const children = vnode.aChildren || vnode.children;
-    vm.aChildren = children;
     const {
       renderMode,
       shadowMode
@@ -4581,15 +4941,61 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
         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
@@ -4614,40 +5020,34 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     }
     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 : '';
       } else if (isVScopedSlotFragment(vnode)) {
         slotName = vnode.slotName;
       }
-      const vnodes = cmpSlotsMapping[slotName] = cmpSlotsMapping[slotName] || [];
+      // Can't use toString here because Symbol(1).toString() is 'Symbol(1)'
+      // but elm.setAttribute('slot', Symbol(1)) is an error.
+      // the following line also throws same error for symbols
+      // Similar for Object.create(null)
+      const normalizedSlotName = '' + slotName;
+      const vnodes = cmpSlotsMapping[normalizedSlotName] = cmpSlotsMapping[normalizedSlotName] || [];
       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
@@ -4678,14 +5078,14 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     }
   }
   // 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 = {};
@@ -5420,10 +5820,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     vmBeingRendered = vm;
   }
   function validateSlots(vm, html) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    assertNotProd(); // this method should never leak to prod
     const {
       cmpSlots
     } = vm;
@@ -5565,7 +5962,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
           // 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
@@ -5580,9 +5977,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
           setActiveVM(vm);
         }
         // reset the refs; they will be set during the tmpl() instantiation
-        const hasRefVNodes = Boolean(html.hasRefs);
-        vm.hasRefVNodes = hasRefVNodes;
-        vm.refVNodes = hasRefVNodes ? create(null) : null;
+        vm.refVNodes = html.hasRefs ? create(null) : null;
         // right before producing the vnodes, we clear up all internal references
         // to custom elements from the template.
         vm.velements = [];
@@ -5607,11 +6002,8 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     }
     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;
@@ -5620,6 +6012,16 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     }
     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.
@@ -5738,6 +6140,8 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   }) {
     if (isFunction$1(Ctor)) {
       if (process.env.NODE_ENV !== 'production') {
+        // There is no point in running this in production, because the version mismatch check relies
+        // on code comments which are stripped out in production by minifiers
         checkVersionMismatch(Ctor, 'component');
       }
       signedTemplateMap.set(Ctor, tmpl);
@@ -5782,7 +6186,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   const cmpEventListenerMap = new WeakMap();
   function getWrappedComponentsListener(vm, listener) {
     if (!isFunction$1(listener)) {
-      throw new TypeError(); // avoiding problems with non-valid listeners
+      throw new TypeError('Expected an EventListener but received ' + typeof listener); // avoiding problems with non-valid listeners
     }
 
     let wrappedListener = cmpEventListenerMap.get(listener);
@@ -5932,7 +6336,6 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       mode,
       owner,
       refVNodes: null,
-      hasRefVNodes: false,
       children: EmptyArray,
       aChildren: EmptyArray,
       velements: EmptyArray,
@@ -5957,6 +6360,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       // Properties set right after VM creation.
       tro: null,
       shadowMode: null,
+      stylesheets: null,
       // Properties set by the LightningElement constructor.
       component: null,
       shadowRoot: null,
@@ -5969,6 +6373,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     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') {
@@ -5987,6 +6392,59 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     }
     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) {
+    warnOnStylesheetsMutation(ctor);
+    const {
+      stylesheets
+    } = ctor;
+    if (!isUndefined$1(stylesheets)) {
+      const valid = validateComponentStylesheets(vm, stylesheets);
+      if (valid) {
+        return flattenStylesheets(stylesheets);
+      } else if (process.env.NODE_ENV !== 'production') {
+        logError(`static stylesheets must be an array of CSS stylesheets. Found invalid stylesheets on <${vm.tagName}>`, vm);
+      }
+    }
+    return null;
+  }
+  function warnOnStylesheetsMutation(ctor) {
+    if (process.env.NODE_ENV !== 'production') {
+      let {
+        stylesheets
+      } = ctor;
+      defineProperty(ctor, 'stylesheets', {
+        enumerable: true,
+        configurable: true,
+        get() {
+          return stylesheets;
+        },
+        set(newValue) {
+          logWarnOnce(`Dynamically setting the "stylesheets" static property on ${ctor.name} ` + 'will not affect the stylesheets injected.');
+          stylesheets = newValue;
+        }
+      });
+    }
+  }
   function computeShadowMode(vm, renderer) {
     const {
       def
@@ -6253,388 +6711,110 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       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
-        }
-      });
-    }
-    /*LWC compiler v2.33.0*/
-  }
-  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;
-        }
-        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;
+            recursivelyDisconnectChildren(vnode.children);
+            break;
+          case 3 /* VNodeType.CustomElement */:
+            {
+              const vm = getAssociatedVM(vnode.elm);
+              resetComponentStateWhenRemoved(vm);
+              break;
+            }
+        }
+      }
     }
-    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);
+  // 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) {
+    recursivelyRemoveChildren(vm.children, vm);
+    vm.children = EmptyArray;
+    runChildNodesDisconnectedCallback(vm);
+    vm.velements = EmptyArray;
   }
-  function installWireAdapters(vm) {
+  // Helper function to remove all children of the root node.
+  // If the set of children includes VFragment nodes, we need to remove the children of those nodes too.
+  // Since VFragments can contain other VFragments, we need to traverse the entire of tree of VFragments.
+  // If the set contains no VFragment nodes, no traversal is needed.
+  function recursivelyRemoveChildren(vnodes, vm) {
     const {
-      context,
-      def: {
-        wire
+      renderRoot,
+      renderer: {
+        remove
       }
     } = 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();
-        });
+    for (let i = 0, len = vnodes.length; i < len; i += 1) {
+      const vnode = vnodes[i];
+      if (!isNull(vnode)) {
+        // VFragments are special; their .elm property does not point to the root element since they have no single root.
+        if (isVFragment(vnode)) {
+          recursivelyRemoveChildren(vnode.children, vm);
+        } else if (!isUndefined$1(vnode.elm)) {
+          remove(vnode.elm, renderRoot);
+        }
       }
     }
   }
-  function connectWireAdapters(vm) {
-    const {
-      wiredConnecting
-    } = vm.context;
-    for (let i = 0, len = wiredConnecting.length; i < len; i += 1) {
-      wiredConnecting[i]();
+  function scheduleRehydration(vm) {
+    if (isTrue(vm.isScheduled)) {
+      return;
     }
+    vm.isScheduled = true;
+    if (rehydrateQueue.length === 0) {
+      addCallbackToNextTick(flushRehydrationQueue);
+    }
+    ArrayPush$1.call(rehydrateQueue, vm);
   }
-  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);
+      }
+    }
+  }
+  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);
+    }
   }
 
   /*
@@ -6643,44 +6823,152 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    * SPDX-License-Identifier: MIT
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
-  // this is lwc internal implementation
-  function createContextProvider(adapter) {
-    let adapterContextToken = getAdapterToken(adapter);
-    if (!isUndefined$1(adapterContextToken)) {
-      throw new Error(`Adapter already has a context provider.`);
+  //
+  // 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://sfdc.co/synthetic-aria
+  //
+  // 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];
+  // This is a "handoff" from synthetic-shadow to engine-core – we want to clean up after ourselves
+  // so nobody else can misuse these global APIs.
+  delete _globalThis[KEY__NATIVE_GET_ELEMENT_BY_ID];
+  delete _globalThis[KEY__NATIVE_QUERY_SELECTOR_ALL];
+  function isSyntheticShadowRootInstance(rootNode) {
+    return rootNode !== document && isTrue(rootNode.synthetic);
+  }
+  function reportViolation$1(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;
     }
-    adapterContextToken = guid();
-    setAdapterToken(adapter, adapterContextToken);
-    const providers = new WeakSet();
-    return (elm, options) => {
-      if (providers.has(elm)) {
-        throw new Error(`Adapter was already installed on ${elm}.`);
+    report("CrossRootAriaInSyntheticShadow" /* ReportingEventId.CrossRootAriaInSyntheticShadow */, {
+      tagName: vm.tagName,
+      attributeName: attrName
+    });
+    if (process.env.NODE_ENV !== 'production') {
+      // 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://sfdc.co/synthetic-aria`, vm);
+    }
+  }
+  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;
       }
-      providers.add(elm);
-      const {
-        consumerConnectedCallback,
-        consumerDisconnectedCallback
-      } = options;
-      elm.addEventListener(adapterContextToken, evt => {
-        const {
-          setNewContext,
-          setDisconnectedCallback
-        } = evt;
-        const consumer = {
-          provide(newContext) {
-            setNewContext(newContext);
+      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$1(sourceElement, elm, idRefAttrName);
+            break;
           }
-        };
-        const disconnectCallback = () => {
-          if (!isUndefined$1(consumerDisconnectedCallback)) {
-            consumerDisconnectedCallback(consumer);
+        }
+      }
+    } 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$1(elm, target, attrName);
           }
-        };
-        setDisconnectedCallback(disconnectCallback);
-        consumerConnectedCallback(consumer);
-        evt.stopImmediatePropagation();
-      });
-    };
+        }
+      }
+    }
+  }
+  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$1() {
+    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
+        });
+      }
+    }
+  }
+  // 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$1();
+    } else {
+      // In prod mode, only enable detection if reporting is enabled
+      onReportingEnabled(enableDetection$1);
+    }
   }
 
   /*
@@ -6689,19 +6977,105 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    * SPDX-License-Identifier: MIT
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
-  /**
-   * EXPERIMENTAL: This function allows you to create a reactive readonly
-   * membrane around any object value. This API is subject to change or
-   * being removed.
-   */
-  function readonly(obj) {
-    if (process.env.NODE_ENV !== 'production') {
-      // TODO [#1292]: Remove the readonly decorator
-      if (arguments.length !== 1) {
-        assert.fail('@readonly cannot be used as a decorator just yet, use it as a function with one argument to produce a readonly version of the provided value.');
+  //
+  // The goal of this code is to detect usages of non-standard reflected ARIA properties. These are caused by
+  // legacy non-standard Element.prototype extensions added by the @lwc/aria-reflection package.
+  //
+  // See the README for @lwc/aria-reflection
+  const NON_STANDARD_ARIA_PROPS = ['ariaActiveDescendant', 'ariaControls', 'ariaDescribedBy', 'ariaDetails', 'ariaErrorMessage', 'ariaFlowTo', 'ariaLabelledBy', 'ariaOwns'];
+  function isLightningElement(elm) {
+    // The former case is for `this.prop` (inside component) and the latter is for `element.prop` (outside component).
+    // In both cases, we apply the non-standard prop even when the global polyfill is disabled, so this is kosher.
+    return elm instanceof LightningElement || elm instanceof BaseBridgeElement;
+  }
+  function findVM(elm) {
+    // If it's a shadow DOM component, then it has a host
+    const {
+      host
+    } = elm.getRootNode();
+    const vm = isUndefined$1(host) ? undefined : getAssociatedVMIfPresent(host);
+    if (!isUndefined$1(vm)) {
+      return vm;
+    }
+    // Else it might be a light DOM component. Walk up the tree trying to find the owner
+    let parentElement = elm;
+    while (!isNull(parentElement = parentElement.parentElement)) {
+      if (isLightningElement(parentElement)) {
+        const vm = getAssociatedVMIfPresent(parentElement);
+        if (!isUndefined$1(vm)) {
+          return vm;
+        }
+      }
+    }
+    // If we return undefined, it's because the element was rendered wholly outside a LightningElement
+  }
+
+  function checkAndReportViolation(elm, prop, isSetter, setValue) {
+    if (!isLightningElement(elm)) {
+      const vm = findVM(elm);
+      if (process.env.NODE_ENV !== 'production') {
+        logWarnOnce(`Element <${elm.tagName.toLowerCase()}> ` + (isUndefined$1(vm) ? '' : `owned by <${vm.elm.tagName.toLowerCase()}> `) + `uses non-standard property "${prop}". This will be removed in a future version of LWC. ` + `See https://sfdc.co/deprecated-aria`);
+      }
+      let setValueType;
+      if (isSetter) {
+        // `typeof null` is "object" which is not very useful for detecting null.
+        // We mostly want to know null vs undefined vs other types here, due to
+        // https://github.com/salesforce/lwc/issues/3284
+        setValueType = isNull(setValue) ? 'null' : typeof setValue;
+      }
+      report("NonStandardAriaReflection" /* ReportingEventId.NonStandardAriaReflection */, {
+        tagName: vm === null || vm === void 0 ? void 0 : vm.tagName,
+        propertyName: prop,
+        isSetter,
+        setValueType
+      });
+    }
+  }
+  function enableDetection() {
+    const {
+      prototype
+    } = Element;
+    for (const prop of NON_STANDARD_ARIA_PROPS) {
+      const descriptor = getOwnPropertyDescriptor$1(prototype, prop);
+      // The descriptor should exist because the @lwc/aria-reflection polyfill has run by now.
+      // This happens automatically because of the ordering of imports.
+      if (process.env.NODE_ENV !== 'production') {
+        /* istanbul ignore if */
+        if (isUndefined$1(descriptor) || isUndefined$1(descriptor.get) || isUndefined$1(descriptor.set)) {
+          // should never happen
+          throw new Error('detect-non-standard-aria.ts loaded before @lwc/aria-reflection');
+        }
+      }
+      // @ts-ignore
+      const {
+        get,
+        set
+      } = descriptor;
+      defineProperty(prototype, prop, {
+        get() {
+          checkAndReportViolation(this, prop, false, undefined);
+          return get.call(this);
+        },
+        set(val) {
+          checkAndReportViolation(this, prop, true, val);
+          return set.call(this, val);
+        },
+        configurable: true,
+        enumerable: true
+      });
+    }
+  }
+  // No point in running this code if we're not in a browser, or if the global polyfill is not loaded
+  {
+    if (!lwcRuntimeFlags.DISABLE_ARIA_REFLECTION_POLYFILL) {
+      // 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);
       }
     }
-    return getReadOnlyProxy(obj);
   }
 
   /*
@@ -6762,17 +7136,46 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     return renderer.nextSibling(hydratedNode);
   }
   const NODE_VALUE_PROP = 'nodeValue';
+  const PARENT_NODE_PROP = 'parentNode';
+  const TAG_NAME_PROP = 'tagName';
+  function textNodeContentsAreEqual(node, vnode, renderer) {
+    const {
+      getProperty
+    } = renderer;
+    const nodeValue = getProperty(node, NODE_VALUE_PROP);
+    if (nodeValue === vnode.text) {
+      return true;
+    }
+    // Special case for empty text nodes – these are serialized differently on the server
+    // See https://github.com/salesforce/lwc/pull/2656
+    if (nodeValue === '\u200D' && vnode.text === '') {
+      return true;
+    }
+    // Special case for text nodes inside `<style>` tags – these are escaped when rendered server-size,
+    // but not when generated by the engine client-side.
+    const parentNode = getProperty(node, PARENT_NODE_PROP);
+    // Should never be null, but just to be safe, we check.
+    /* istanbul ignore else */
+    if (!isNull(parentNode)) {
+      const tagName = getProperty(parentNode, TAG_NAME_PROP);
+      // If the tagName is STYLE, then the following condition should always be true.
+      // The LWC compiler blocks using `<style>`s inside of templates, so it should be impossible
+      // for component authors to render different `<style>` text content on the client and server.
+      // But just to be safe, we check.
+      /* istanbul ignore next */
+      if (tagName === 'STYLE' && htmlEscape(vnode.text) === nodeValue) {
+        return true;
+      }
+    }
+    return false;
+  }
   function hydrateText(node, vnode, renderer) {
     var _a;
     if (!hasCorrectNodeType(vnode, node, 3 /* EnvNodeTypes.TEXT */, renderer)) {
       return handleMismatch(node, vnode, renderer);
     }
     if (process.env.NODE_ENV !== 'production') {
-      const {
-        getProperty
-      } = renderer;
-      const nodeValue = getProperty(node, NODE_VALUE_PROP);
-      if (nodeValue !== vnode.text && !(nodeValue === '\u200D' && vnode.text === '')) {
+      if (!textNodeContentsAreEqual(node, vnode, renderer)) {
         logWarn('Hydration mismatch: text values do not match, will recover from the difference', vnode.owner);
       }
     }
@@ -6988,6 +7391,19 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     const hasIncompatibleStyle = validateStyleAttr(vnode, elm, renderer);
     return hasIncompatibleAttrs && hasIncompatibleClass && hasIncompatibleStyle;
   }
+  function attributeValuesAreEqual(vnodeValue, value) {
+    const vnodeValueAsString = String(vnodeValue);
+    if (vnodeValueAsString === value) {
+      return true;
+    }
+    // If the expected value is null, this means that the attribute does not exist. In that case,
+    // we accept any nullish value (undefined or null).
+    if (isNull(value) && (isUndefined$1(vnodeValue) || isNull(vnodeValue))) {
+      return true;
+    }
+    // In all other cases, the two values are not considered equal
+    return false;
+  }
   function validateAttrs(vnode, elm, renderer) {
     const {
       data: {
@@ -7005,12 +7421,12 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
         getAttribute
       } = renderer;
       const elmAttrValue = getAttribute(elm, attrName);
-      if (String(attrValue) !== elmAttrValue) {
+      if (!attributeValuesAreEqual(attrValue, elmAttrValue)) {
         if (process.env.NODE_ENV !== 'production') {
           const {
             getProperty
           } = renderer;
-          logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "${attrName}" has different values, expected "${attrValue}" but found "${elmAttrValue}"`, owner);
+          logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "${attrName}" has different values, expected "${attrValue}" but found ${isNull(elmAttrValue) ? 'null' : `"${elmAttrValue}"`}`, owner);
         }
         nodesAreCompatible = false;
       }
@@ -7198,12 +7614,13 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    */
   // See @lwc/engine-core/src/framework/template.ts
   const TEMPLATE_PROPS = ['slots', 'stylesheetToken', 'stylesheets', 'renderMode'];
-  // Via https://www.npmjs.com/package/object-observer
-  const ARRAY_MUTATION_METHODS = ['pop', 'push', 'shift', 'unshift', 'reverse', 'sort', 'fill', 'splice', 'copyWithin'];
   // Expandos that may be placed on a stylesheet factory function, and which are meaningful to LWC at runtime
-  const STYLESHEET_FUNCTION_EXPANDOS = [
+  const STYLESHEET_PROPS = [
   // SEE `KEY__SCOPED_CSS` in @lwc/style-compiler
   '$scoped$'];
+  // Via https://www.npmjs.com/package/object-observer
+  const ARRAY_MUTATION_METHODS = ['pop', 'push', 'shift', 'unshift', 'reverse', 'sort', 'fill', 'splice', 'copyWithin'];
+  let mutationTrackingDisabled = false;
   function getOriginalArrayMethod(prop) {
     switch (prop) {
       case 'pop':
@@ -7226,7 +7643,20 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
         return ArrayCopyWithin;
     }
   }
-  let mutationWarningsSilenced = false;
+  function reportViolation(type, eventId, prop) {
+    if (process.env.NODE_ENV !== 'production') {
+      logWarnOnce(`Mutating the "${prop}" property on a ${type} ` + `is deprecated and will be removed in a future version of LWC. ` + `See: https://sfdc.co/template-mutation`);
+    }
+    report(eventId, {
+      propertyName: prop
+    });
+  }
+  function reportTemplateViolation(prop) {
+    reportViolation('template', "TemplateMutation" /* ReportingEventId.TemplateMutation */, prop);
+  }
+  function reportStylesheetViolation(prop) {
+    reportViolation('stylesheet', "StylesheetMutation" /* ReportingEventId.StylesheetMutation */, prop);
+  }
   // Warn if the user tries to mutate a stylesheets array, e.g.:
   // `tmpl.stylesheets.push(someStylesheetFunction)`
   function warnOnArrayMutation(stylesheets) {
@@ -7235,7 +7665,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     for (const prop of ARRAY_MUTATION_METHODS) {
       const originalArrayMethod = getOriginalArrayMethod(prop);
       stylesheets[prop] = function arrayMutationWarningWrapper() {
-        logError(`Mutating the "stylesheets" array on a template function ` + `is deprecated and may be removed in a future version of LWC.`);
+        reportTemplateViolation('stylesheets');
         // @ts-ignore
         return originalArrayMethod.apply(this, arguments);
       };
@@ -7244,8 +7674,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   // Warn if the user tries to mutate a stylesheet factory function, e.g.:
   // `stylesheet.$scoped$ = true`
   function warnOnStylesheetFunctionMutation(stylesheet) {
-    // We could warn on other properties, but in practice only certain expandos are meaningful to LWC at runtime
-    for (const prop of STYLESHEET_FUNCTION_EXPANDOS) {
+    for (const prop of STYLESHEET_PROPS) {
       let value = stylesheet[prop];
       defineProperty(stylesheet, prop, {
         enumerable: true,
@@ -7254,14 +7683,14 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
           return value;
         },
         set(newValue) {
-          logError(`Dynamically setting the "${prop}" property on a stylesheet function ` + `is deprecated and may be removed in a future version of LWC.`);
+          reportStylesheetViolation(prop);
           value = newValue;
         }
       });
     }
   }
   // Warn on either array or stylesheet (function) mutation, in a deeply-nested array
-  function warnOnStylesheetsMutation(stylesheets) {
+  function trackStylesheetsMutation(stylesheets) {
     traverseStylesheets(stylesheets, subStylesheets => {
       if (isArray$1(subStylesheets)) {
         warnOnArrayMutation(subStylesheets);
@@ -7288,7 +7717,70 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       }
     }
   }
+  function trackMutations(tmpl) {
+    if (!isUndefined$1(tmpl.stylesheets)) {
+      trackStylesheetsMutation(tmpl.stylesheets);
+    }
+    for (const prop of TEMPLATE_PROPS) {
+      let value = tmpl[prop];
+      defineProperty(tmpl, prop, {
+        enumerable: true,
+        configurable: true,
+        get() {
+          return value;
+        },
+        set(newValue) {
+          if (!mutationTrackingDisabled) {
+            reportTemplateViolation(prop);
+          }
+          value = newValue;
+        }
+      });
+    }
+    const originalDescriptor = getOwnPropertyDescriptor$1(tmpl, 'stylesheetTokens');
+    defineProperty(tmpl, 'stylesheetTokens', {
+      enumerable: true,
+      configurable: true,
+      get: originalDescriptor.get,
+      set(value) {
+        reportTemplateViolation('stylesheetTokens');
+        // Avoid logging/reporting twice (for both stylesheetToken and stylesheetTokens)
+        mutationTrackingDisabled = true;
+        originalDescriptor.set.call(this, value);
+        mutationTrackingDisabled = false;
+      }
+    });
+  }
+  function addLegacyStylesheetTokensShim(tmpl) {
+    // When ENABLE_FROZEN_TEMPLATE is false, then we shim stylesheetTokens on top of stylesheetToken for anyone who
+    // is accessing the old internal API (backwards compat). Details: https://salesforce.quip.com/v1rmAFu2cKAr
+    defineProperty(tmpl, 'stylesheetTokens', {
+      enumerable: true,
+      configurable: true,
+      get() {
+        const {
+          stylesheetToken
+        } = this;
+        if (isUndefined$1(stylesheetToken)) {
+          return stylesheetToken;
+        }
+        // Shim for the old `stylesheetTokens` property
+        // See https://github.com/salesforce/lwc/pull/2332/files#diff-7901555acef29969adaa6583185b3e9bce475cdc6f23e799a54e0018cb18abaa
+        return {
+          hostAttribute: `${stylesheetToken}-host`,
+          shadowAttribute: stylesheetToken
+        };
+      },
+      set(value) {
+        // If the value is null or some other exotic object, you would be broken anyway in the past
+        // because the engine would try to access hostAttribute/shadowAttribute, which would throw an error.
+        // However it may be undefined in newer versions of LWC, so we need to guard against that case.
+        this.stylesheetToken = isUndefined$1(value) ? undefined : value.shadowAttribute;
+      }
+    });
+  }
   function freezeTemplate(tmpl) {
+    // TODO [#2782]: remove this flag and delete the legacy behavior
     if (lwcRuntimeFlags.ENABLE_FROZEN_TEMPLATE) {
       // Deep freeze the template
       freeze(tmpl);
@@ -7296,66 +7788,16 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
         deepFreeze(tmpl.stylesheets);
       }
     } else {
-      // TODO [#2782]: remove this flag and delete the legacy behavior
-      // When ENABLE_FROZEN_TEMPLATE is false, then we shim stylesheetTokens on top of stylesheetToken for anyone who
-      // is accessing the old internal API (backwards compat). Details: https://salesforce.quip.com/v1rmAFu2cKAr
-      defineProperty(tmpl, 'stylesheetTokens', {
-        enumerable: true,
-        configurable: true,
-        get() {
-          const {
-            stylesheetToken
-          } = this;
-          if (isUndefined$1(stylesheetToken)) {
-            return stylesheetToken;
-          }
-          // Shim for the old `stylesheetTokens` property
-          // See https://github.com/salesforce/lwc/pull/2332/files#diff-7901555acef29969adaa6583185b3e9bce475cdc6f23e799a54e0018cb18abaa
-          return {
-            hostAttribute: `${stylesheetToken}-host`,
-            shadowAttribute: stylesheetToken
-          };
-        },
-        set(value) {
-          // If the value is null or some other exotic object, you would be broken anyway in the past
-          // because the engine would try to access hostAttribute/shadowAttribute, which would throw an error.
-          // However it may be undefined in newer versions of LWC, so we need to guard against that case.
-          this.stylesheetToken = isUndefined$1(value) ? undefined : value.shadowAttribute;
-        }
-      });
-      // When ENABLE_FROZEN_TEMPLATE is false, warn in dev mode whenever someone is mutating the template
+      // template is not frozen - shim, report, and warn
+      // this shim should be applied in both dev and prod
+      addLegacyStylesheetTokensShim(tmpl);
+      // When ENABLE_FROZEN_TEMPLATE is false, we want to warn in dev mode whenever someone is mutating the template
       if (process.env.NODE_ENV !== 'production') {
-        if (!isUndefined$1(tmpl.stylesheets)) {
-          warnOnStylesheetsMutation(tmpl.stylesheets);
-        }
-        for (const prop of TEMPLATE_PROPS) {
-          let value = tmpl[prop];
-          defineProperty(tmpl, prop, {
-            enumerable: true,
-            configurable: true,
-            get() {
-              return value;
-            },
-            set(newValue) {
-              if (!mutationWarningsSilenced) {
-                logError(`Dynamically setting the "${prop}" property on a template function ` + `is deprecated and may be removed in a future version of LWC.`);
-              }
-              value = newValue;
-            }
-          });
-        }
-        const originalDescriptor = getOwnPropertyDescriptor$1(tmpl, 'stylesheetTokens');
-        defineProperty(tmpl, 'stylesheetTokens', {
-          enumerable: true,
-          configurable: true,
-          get: originalDescriptor.get,
-          set(value) {
-            logError(`Dynamically setting the "stylesheetTokens" property on a template function ` + `is deprecated and may be removed in a future version of LWC.`);
-            // Avoid logging twice (for both stylesheetToken and stylesheetTokens)
-            mutationWarningsSilenced = true;
-            originalDescriptor.set.call(this, value);
-            mutationWarningsSilenced = false;
-          }
+        trackMutations(tmpl);
+      } else {
+        // In prod mode, we only track mutations if reporting is enabled
+        onReportingEnabled(() => {
+          trackMutations(tmpl);
         });
       }
     }
@@ -7383,7 +7825,28 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     }
     return ctor;
   }
-  /* version: 2.33.0 */
+
+  /*
+   * 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
+   */
+  /**
+   * EXPERIMENTAL: This function allows you to create a reactive readonly
+   * membrane around any object value. This API is subject to change or
+   * being removed.
+   */
+  function readonly(obj) {
+    if (process.env.NODE_ENV !== 'production') {
+      // TODO [#1292]: Remove the readonly decorator
+      if (arguments.length !== 1) {
+        assert.fail('@readonly cannot be used as a decorator just yet, use it as a function with one argument to produce a readonly version of the provided value.');
+      }
+    }
+    return getReadOnlyProxy(obj);
+  }
+  /* version: 2.38.1 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -7486,7 +7949,8 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   //
   // Test utilities
   //
-  if (process.env.NODE_ENV === 'development') {
+  // Only used in LWC's Karma tests
+  if (process.env.NODE_ENV === 'test-karma-lwc') {
     // @ts-ignore
     window.__lwcResetGlobalStylesheets = () => {
       stylesheetCache.clear();
@@ -7627,7 +8091,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       // invokes the DOM api with an .apply() or .call() to initialize any DOM api sub-classing,
       // which are not equipped to be initialized that way.
       class clazz extends HTMLElementAlias {
-        /*LWC compiler v2.33.0*/
+        /*LWC compiler v2.38.1*/
       }
       customElements.define('lwc-test-' + Math.floor(Math.random() * 1000000), clazz);
       new clazz();
@@ -7660,7 +8124,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   const cachedConstructors = new Map();
   const elementsUpgradedOutsideLWC = new WeakSet();
   let elementBeingUpgradedByLWC = false;
-  // Creates a constructor that is intended to be used as a vanilla custom element, except that the upgradeCallback is
+  // Creates a constructor that is intended to be used directly as a custom element, except that the upgradeCallback is
   // passed in to the constructor so LWC can reuse the same custom element constructor for multiple components.
   // Another benefit is that only LWC can create components that actually do anything – if you do
   // `customElements.define('x-foo')`, then you don't have access to the upgradeCallback, so it's a dummy custom element.
@@ -7685,7 +8149,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
           // Do we want to support this? Throw an error? Currently for backwards compat it's a no-op.
         }
       }
-      /*LWC compiler v2.33.0*/
+      /*LWC compiler v2.38.1*/
     }
     // Do not unnecessarily add a connectedCallback/disconnectedCallback, as it introduces perf overhead
     // See: https://github.com/salesforce/lwc/pull/3162#issuecomment-1311851174
@@ -7705,7 +8169,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     }
     return UpgradableConstructor;
   };
-  const createCustomElementVanilla = (tagName, upgradeCallback, connectedCallback, disconnectedCallback) => {
+  const createCustomElementUsingUpgradableConstructor = (tagName, upgradeCallback, connectedCallback, disconnectedCallback) => {
     // use global custom elements registry
     let UpgradableConstructor = cachedConstructors.get(tagName);
     if (isUndefined$1(UpgradableConstructor)) {
@@ -7724,574 +8188,6 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
     }
   };
 
-  /*
-   * Copyright (c) 2020, salesforce.com, inc.
-   * All rights reserved.
-   * SPDX-License-Identifier: MIT
-   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
-   */
-  /**
-   * Create a scoped registry, i.e. a function that can create custom elements whose tag names
-   * do not conflict with vanilla custom elements having the same tag name.
-   */
-  function createScopedRegistry() {
-    if (!hasCustomElements) {
-      // This code should never be reached, because we don't use the pivot registry if
-      // custom elements are unavailable.
-      throw new Error('Custom elements are not supported in this environment.');
-    }
-    const {
-      HTMLElement: NativeHTMLElement
-    } = window;
-    const {
-      hasAttribute: nativeHasAttribute,
-      setAttribute: nativeSetAttribute,
-      removeAttribute: nativeRemoveAttribute,
-      getAttribute: nativeGetAttribute
-    } = NativeHTMLElement.prototype;
-    const definitionForElement = new WeakMap();
-    const pendingRegistryForElement = new WeakMap();
-    const definitionForConstructor = new WeakMap();
-    const registeredUserCtors = new WeakSet();
-    const registeredPivotCtors = new WeakSet();
-    const pivotCtorByTag = new Map();
-    const globalDefinitionsByTag = new Map();
-    const globalDefinitionsByClass = new Map();
-    const awaitingUpgrade = new Map();
-    const pendingWhenDefinedCallbacks = new Map();
-    const EMPTY_SET = new Set();
-    function createDefinitionRecord(constructor) {
-      var _a;
-      const {
-        connectedCallback,
-        disconnectedCallback,
-        formAssociatedCallback,
-        formDisabledCallback,
-        formResetCallback,
-        formStateRestoreCallback,
-        adoptedCallback,
-        attributeChangedCallback
-      } = constructor.prototype;
-      const formAssociated = Boolean(constructor.formAssociated);
-      const observedAttributes = new Set((_a = constructor.observedAttributes) !== null && _a !== void 0 ? _a : []);
-      return {
-        UserCtor: constructor,
-        PivotCtor: undefined,
-        connectedCallback,
-        disconnectedCallback,
-        formAssociatedCallback,
-        formDisabledCallback,
-        formResetCallback,
-        formStateRestoreCallback,
-        adoptedCallback,
-        attributeChangedCallback,
-        observedAttributes,
-        formAssociated
-      };
-    }
-    // Helper to create stand-in element for each tagName registered that delegates out to the registry for the given
-    // element. Note that the `registeredDefinition` represents the constructor that was used to register during
-    // `customElements.define()`. Whereas the `pivotDefinition` represents the constructor that is passed when the pivot
-    // constructor is invoked with another constructor.
-    function createPivotingClass(tagName, registeredDefinition) {
-      class PivotCtor extends NativeHTMLElement {
-        constructor(UserCtor) {
-          // This constructor can only be invoked by:
-          // a) the browser instantiating  an element from parsing or via document.createElement.
-          // b) LWC new PivotClass (This constructor is NOT observable/accessible in user-land).
-          // b) new UserClass.
-          // When LWC instantiates it, it will pass the upgrading definition as an argument
-          // If the caller signals via UserCtor that this is in fact a controlled
-          // definition, we use that one, otherwise fallback to the global
-          // internal registry.
-          super();
-          const userCtorIsDefined = !isUndefined$1(UserCtor);
-          if (userCtorIsDefined) {
-            if (!isConstructor(UserCtor)) {
-              throw new TypeError(`Failed to create custom element: the provided constructor is not a constructor.`);
-            }
-            if (!registeredUserCtors.has(UserCtor)) {
-              throw new Error(`Failed to create custom element: the provided constructor is unregistered: ${UserCtor.name}.`);
-            }
-          }
-          const definition = userCtorIsDefined ? getOrCreateDefinitionForConstructor(UserCtor) : globalDefinitionsByTag.get(tagName);
-          if (!isUndefined$1(definition)) {
-            internalUpgrade(this, registeredDefinition, definition);
-          } else {
-            // This is the case in which there is no global definition, and
-            // it is not handled by LWC (otherwise it will have a valid UserCtor)
-            // so we need to add it to the pending queue just in case it eventually
-            // gets defined in the global registry.
-            pendingRegistryForElement.set(this, registeredDefinition);
-          }
-        }
-        connectedCallback() {
-          var _a;
-          const definition = definitionForElement.get(this);
-          if (!isUndefined$1(definition)) {
-            // Delegate out to user callback
-            (_a = definition.connectedCallback) === null || _a === void 0 ? void 0 : _a.call(this);
-          } else {
-            // Register for upgrade when defined (only when connected, so we don't leak)
-            let awaiting = awaitingUpgrade.get(tagName);
-            if (isUndefined$1(awaiting)) {
-              awaitingUpgrade.set(tagName, awaiting = new Set());
-            }
-            awaiting.add(this);
-          }
-        }
-        disconnectedCallback() {
-          var _a;
-          const definition = definitionForElement.get(this);
-          if (!isUndefined$1(definition)) {
-            // Delegate out to user callback
-            (_a = definition.disconnectedCallback) === null || _a === void 0 ? void 0 : _a.call(this);
-          } else {
-            // Un-register for upgrade when defined (so we don't leak)
-            const awaiting = awaitingUpgrade.get(tagName);
-            // At this point, awaiting should never be undefined, because connectedCallback
-            // must have been called before disconnectedCallback. But just to be safe, we check
-            if (!isUndefined$1(awaiting)) {
-              awaiting.delete(this);
-            }
-          }
-        }
-        formAssociatedCallback(form) {
-          var _a;
-          const definition = definitionForElement.get(this);
-          (_a = definition === null || definition === void 0 ? void 0 : definition.formAssociatedCallback) === null || _a === void 0 ? void 0 : _a.call(this, form);
-        }
-        formDisabledCallback(disabled) {
-          var _a;
-          const definition = definitionForElement.get(this);
-          (_a = definition === null || definition === void 0 ? void 0 : definition.formDisabledCallback) === null || _a === void 0 ? void 0 : _a.call(this, disabled);
-        }
-        formResetCallback() {
-          var _a;
-          const definition = definitionForElement.get(this);
-          (_a = definition === null || definition === void 0 ? void 0 : definition.formResetCallback) === null || _a === void 0 ? void 0 : _a.call(this);
-        }
-        formStateRestoreCallback(state, mode) {
-          var _a;
-          const definition = definitionForElement.get(this);
-          (_a = definition === null || definition === void 0 ? void 0 : definition.formStateRestoreCallback) === null || _a === void 0 ? void 0 : _a.call(this, state, mode);
-        }
-        adoptedCallback() {
-          var _a;
-          const definition = definitionForElement.get(this);
-          (_a = definition === null || definition === void 0 ? void 0 : definition.adoptedCallback) === null || _a === void 0 ? void 0 : _a.call(this);
-        }
-        attributeChangedCallback(name, oldValue, newValue) {
-          var _a;
-          const definition = definitionForElement.get(this);
-          // if both definitions are the same, then the observedAttributes is the same,
-          // but if they are different, only if the runtime definition has the attribute
-          // marked as observed, then it should invoke attributeChangedCallback.
-          if (registeredDefinition === definition || (definition === null || definition === void 0 ? void 0 : definition.observedAttributes.has(name))) {
-            (_a = definition.attributeChangedCallback) === null || _a === void 0 ? void 0 : _a.apply(this, [name, oldValue, newValue]);
-          }
-        }
-        /*LWC compiler v2.33.0*/
-      }
-      PivotCtor.observedAttributes = [...registeredDefinition.observedAttributes];
-      // TODO [#3000]: support case where registeredDefinition is not form-associated, but later definition is.
-      PivotCtor.formAssociated = registeredDefinition.formAssociated;
-      registeredPivotCtors.add(PivotCtor);
-      return PivotCtor;
-    }
-    function getNewObservedAttributes(registeredDefinition, pivotDefinition) {
-      const {
-        observedAttributes,
-        attributeChangedCallback
-      } = pivotDefinition;
-      if (observedAttributes.size === 0 || isUndefined$1(attributeChangedCallback)) {
-        // This instance does not need to observe any attributes, no need to patch
-        return EMPTY_SET;
-      }
-      // Natively, the attributes observed by the registered definition are going to be taken
-      // care of by the browser, only the difference between the two sets has to be taken
-      // care by the patched version.
-      return new Set([...pivotDefinition.observedAttributes].filter(x => !registeredDefinition.observedAttributes.has(x)));
-    }
-    function throwAsyncError(error) {
-      // Per native custom element behavior, errors thrown in attributeChangedCallback
-      // become unhandled async errors. We use setTimeout() instead of Promise.resolve()
-      // to make it an unhandled error rather than an unhandled rejection.
-      setTimeout(() => {
-        throw error;
-      });
-    }
-    // Helper to patch `setAttribute`/`getAttribute` to implement `attributeChangedCallback`.
-    // Why is this necessary? Well basically, you can't change the `observedAttributes` after
-    // a custom element is defined. So with pivots, if two classes share the same tag name,
-    // and the second class observes attributes that aren't observed by the first one,
-    // then those attributes can never be observed by the native `observedAttributes` system.
-    // So we have to simulate it by patching `getAttribute`/`removeAttribute`. Note that
-    // we only do this when absolutely necessary, though; i.e. because we've determined
-    // that we aren't observing the attributes we need to.
-    function patchAttributes(instance, registeredDefinition, pivotDefinition) {
-      const newObservedAttributes = getNewObservedAttributes(registeredDefinition, pivotDefinition);
-      if (newObservedAttributes.size === 0) {
-        return;
-      }
-      const {
-        attributeChangedCallback
-      } = pivotDefinition;
-      // Patch the instance.
-      // Note we use the native `getAttribute` rather than the super's `getAttribute` because
-      // we don't actually want it to be observable that we're calling `getAttribute` from
-      // `setAttribute` and `removeAttribute`.
-      // TODO [#2994]: this should handle reflected properties such as `ariaLabel` and `role`.
-      defineProperties(instance, {
-        setAttribute: {
-          value: function setAttribute(name, value) {
-            if (newObservedAttributes.has(name)) {
-              const old = nativeGetAttribute.call(this, name);
-              nativeSetAttribute.call(this, name, value);
-              try {
-                attributeChangedCallback.call(this, name, old, value + '');
-              } catch (error) {
-                throwAsyncError(error);
-              }
-            } else {
-              nativeSetAttribute.call(this, name, value);
-            }
-          },
-          writable: true,
-          enumerable: true,
-          configurable: true
-        },
-        removeAttribute: {
-          value: function removeAttribute(name) {
-            if (newObservedAttributes.has(name)) {
-              const old = nativeGetAttribute.call(this, name);
-              nativeRemoveAttribute.call(this, name);
-              try {
-                attributeChangedCallback.call(this, name, old, null);
-              } catch (error) {
-                throwAsyncError(error);
-              }
-            } else {
-              nativeRemoveAttribute.call(this, name);
-            }
-          },
-          writable: true,
-          enumerable: true,
-          configurable: true
-        }
-      });
-    }
-    function patchAttributesDuringUpgrade(instance, registeredDefinition, pivotDefinition) {
-      // The below case patches observed attributes for the case where the HTML element is upgraded
-      // from a pre-existing one in the DOM.
-      const newObservedAttributes = getNewObservedAttributes(registeredDefinition, pivotDefinition);
-      if (getNewObservedAttributes(registeredDefinition, pivotDefinition).size === 0) {
-        return;
-      }
-      const {
-        attributeChangedCallback
-      } = pivotDefinition;
-      // Approximate observedAttributes from the user class, but only for the new observed attributes
-      newObservedAttributes.forEach(name => {
-        if (nativeHasAttribute.call(instance, name)) {
-          const newValue = nativeGetAttribute.call(instance, name);
-          attributeChangedCallback.call(instance, name, null, newValue);
-        }
-      });
-    }
-    // User extends this HTMLElement, which returns the CE being upgraded
-    let upgradingInstance;
-    // Helper to upgrade an instance with a CE definition using "constructor call trick"
-    function internalUpgrade(instance, registeredDefinition, pivotDefinition) {
-      setPrototypeOf(instance, pivotDefinition.UserCtor.prototype);
-      definitionForElement.set(instance, pivotDefinition);
-      // attributes patches when needed
-      if (pivotDefinition !== registeredDefinition) {
-        patchAttributes(instance, registeredDefinition, pivotDefinition);
-      }
-      // Tricking the construction path to believe that a new instance is being created,
-      // that way it will execute the super initialization mechanism but the HTMLElement
-      // constructor will reuse the instance by returning the upgradingInstance.
-      // This is by far the most important piece of the puzzle
-      upgradingInstance = instance;
-      // By `new`ing the UserCtor, we now jump to the constructor for the overridden global HTMLElement
-      // The reason this happens is that the UserCtor extends HTMLElement, so it calls the `super()`.
-      // Note that `upgradingInstance` is explicitly handled in the HTMLElement constructor.
-      new pivotDefinition.UserCtor();
-      patchAttributesDuringUpgrade(instance, registeredDefinition, pivotDefinition);
-    }
-    function isConstructor(constructor) {
-      return isFunction$1(constructor) && isObject(constructor.prototype);
-    }
-    function getOrCreateDefinitionForConstructor(constructor) {
-      if (!isConstructor(constructor)) {
-        throw new TypeError('The referenced constructor is not a constructor.');
-      }
-      const definition = definitionForConstructor.get(constructor);
-      if (!isUndefined$1(definition)) {
-        return definition;
-      }
-      return createDefinitionRecord(constructor);
-    }
-    // Defer a `whenDefined()` callback until an externally-visible custom element is defined
-    function createPendingWhenDefinedCallback(tagName) {
-      return new Promise(resolve => {
-        let resolvers = pendingWhenDefinedCallbacks.get(tagName);
-        if (isUndefined$1(resolvers)) {
-          resolvers = [];
-          pendingWhenDefinedCallbacks.set(tagName, resolvers);
-        }
-        resolvers.push(resolve);
-      });
-    }
-    // Call any pending `whenDefined()` callbacks
-    function flushPendingWhenDefinedCallbacks(tagName, ctor) {
-      const resolvers = pendingWhenDefinedCallbacks.get(tagName);
-      if (!isUndefined$1(resolvers)) {
-        for (const resolver of resolvers) {
-          resolver(ctor);
-        }
-      }
-      pendingWhenDefinedCallbacks.delete(tagName);
-    }
-    const {
-      customElements: nativeRegistry
-    } = window;
-    const {
-      define: nativeDefine,
-      whenDefined: nativeWhenDefined,
-      get: nativeGet
-    } = nativeRegistry;
-    // patch for the global registry define mechanism
-    CustomElementRegistry.prototype.define = function define(tagName, constructor, options) {
-      if (options && options.extends) {
-        // TODO [#2983]: should we support `extends`?
-        throw new DOMException('NotSupportedError: "extends" key in customElements.define() options is not supported.');
-      }
-      if (globalDefinitionsByTag.has(tagName)) {
-        throw new DOMException(`Failed to execute 'define' on 'CustomElementRegistry': the name "${tagName}" has already been used with this registry`);
-      }
-      if (!isUndefined$1(globalDefinitionsByClass.get(constructor))) {
-        throw new DOMException(`Failed to execute 'define' on 'CustomElementRegistry': this constructor has already been used with this registry`);
-      }
-      const definition = getOrCreateDefinitionForConstructor(constructor);
-      registeredUserCtors.add(constructor);
-      let PivotCtor = pivotCtorByTag.get(tagName);
-      if (isUndefined$1(PivotCtor)) {
-        PivotCtor = createPivotingClass(tagName, definition);
-        // Register a pivoting class which will handle global registry initializations
-        nativeDefine.call(nativeRegistry, tagName, PivotCtor);
-      }
-      // Only cache after nativeDefine has been called, because if it throws an error
-      // (e.g. for an invalid tag name), then we don't want to cache anything.
-      definitionForConstructor.set(constructor, definition);
-      pivotCtorByTag.set(tagName, PivotCtor);
-      globalDefinitionsByTag.set(tagName, definition);
-      globalDefinitionsByClass.set(constructor, definition);
-      // For globally defined custom elements, the definition associated
-      // to the UserCtor has a back-pointer to PivotCtor in case the user
-      // new the UserCtor, so we know how to create the underlying element.
-      definition.PivotCtor = PivotCtor;
-      // Upgrade any elements created in this scope before customElements.define
-      // was called, which should be exhibited by the following steps:
-      // 1) LWC registers a tagName for an LWC component.
-      // 2) Element with same tagName is created with document.createElement()
-      //    and inserted into DOM.
-      // 3) customElements.define() is called with tagName and non-LWC constructor.
-      // This requires immediate upgrade when the new global tagName is defined.
-      const awaiting = awaitingUpgrade.get(tagName);
-      if (!isUndefined$1(awaiting)) {
-        awaitingUpgrade.delete(tagName);
-        for (const element of awaiting) {
-          const registeredDefinition = pendingRegistryForElement.get(element);
-          // At this point, registeredDefinition should never be undefined because awaitingUpgrade
-          // is only populated when we haven't run internalUpgrade yet, and we only populate
-          // pendingRegistryForElement when internalUpgrade hasn't run yet.
-          // But just to be safe, we check.
-          if (!isUndefined$1(registeredDefinition)) {
-            pendingRegistryForElement.delete(element);
-            internalUpgrade(element, registeredDefinition, definition);
-          }
-        }
-      }
-      // If anyone called customElements.whenDefined() and is still waiting for a promise resolution, resolve now
-      flushPendingWhenDefinedCallbacks(tagName, constructor);
-    };
-    CustomElementRegistry.prototype.get = function get(tagName) {
-      const NativeCtor = nativeGet.call(nativeRegistry, tagName);
-      if (!isUndefined$1(NativeCtor)) {
-        const definition = globalDefinitionsByTag.get(tagName);
-        if (!isUndefined$1(definition)) {
-          return definition.UserCtor; // defined by the patched custom elements registry
-        }
-
-        if (registeredPivotCtors.has(NativeCtor)) {
-          return undefined; // pivot constructors should not be observable, return undefined
-        }
-
-        return NativeCtor; // constructor that existed before patching
-      }
-    };
-
-    CustomElementRegistry.prototype.whenDefined = function whenDefined(tagName) {
-      return nativeWhenDefined.call(nativeRegistry, tagName).then(NativeCtor => {
-        const definition = globalDefinitionsByTag.get(tagName);
-        if (!isUndefined$1(definition)) {
-          return definition.UserCtor;
-        }
-        // In this case, the custom element must have been defined before the registry patches
-        // were applied. So return the non-pivot constructor
-        if (isUndefined$1(NativeCtor)) {
-          // Chromium bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1335247
-          // We can patch the correct behavior using customElements.get()
-          NativeCtor = nativeGet.call(nativeRegistry, tagName);
-        }
-        if (registeredPivotCtors.has(NativeCtor)) {
-          // Pivot constructors should not be observable. Wait to resolve the promise
-          // if a constructor is ever defined in userland
-          return createPendingWhenDefinedCallback(tagName);
-        }
-        return NativeCtor;
-      });
-    };
-    // This constructor is invoked when we call `new pivotDefinition.UserCtor()`
-    // @ts-ignore
-    window.HTMLElement = function HTMLElement() {
-      // Upgrading case: the pivoting class constructor was run by the browser's
-      // native custom elements and we're in the process of running the
-      // "constructor-call trick" on the natively constructed instance, so just
-      // return that here.
-      // This code path is also called when LWC `new`s a PivotCtor.
-      const instance = upgradingInstance;
-      if (!isUndefined$1(instance)) {
-        upgradingInstance = undefined;
-        return instance;
-      }
-      // Construction case: we need to construct the pivoting instance and return it.
-      // This is possible when the user register it via global registry and instantiate
-      // it via `new Ctor()`.
-      const {
-        constructor
-      } = this;
-      const definition = globalDefinitionsByClass.get(constructor);
-      if (isUndefined$1(definition) || isUndefined$1(definition.PivotCtor)) {
-        // This code path is hit if someone `new`s a class that extends `HTMLElement` without
-        // doing `customElements.define()` first. This matches native browser behavior:
-        // https://stackoverflow.com/a/61883392
-        throw new TypeError('Illegal constructor');
-      }
-      // This constructor is ONLY invoked when it is the user instantiating
-      // an element via new Ctor while Ctor is a registered global constructor.
-      const {
-        PivotCtor,
-        UserCtor
-      } = definition;
-      return new PivotCtor(UserCtor);
-    };
-    HTMLElement.prototype = NativeHTMLElement.prototype;
-    /**
-     * Create a new PivotConstructor for the given tagName, which is capable of being constructed
-     * with a UserConstructor defining the behavior. Passing in the UserConstructor here
-     * is a hint that can be used when registering a custom element with the global custom elements
-     * registry for the first time, which provides certain optimizations. It also marks the UserConstructor
-     * as "safe" to be used when passed in to a PivotConstructor.
-     *
-     * @param tagName - element tag name
-     * @param UserCtor - userland custom element constructor
-     * @returns a new custom element constructor
-     */
-    return function createPivotConstructor(tagName, UserCtor) {
-      tagName = StringToLowerCase.call(tagName);
-      let PivotCtor = pivotCtorByTag.get(tagName);
-      if (isUndefined$1(PivotCtor)) {
-        const definition = getOrCreateDefinitionForConstructor(UserCtor);
-        PivotCtor = createPivotingClass(tagName, definition);
-        // Register a pivoting class as a global custom element
-        nativeDefine.call(nativeRegistry, tagName, PivotCtor);
-        definition.PivotCtor = PivotCtor;
-        // Only cache after nativeDefine has been called, because if it throws an error
-        // (e.g. for an invalid tag name), then we don't want to cache anything.
-        definitionForConstructor.set(UserCtor, definition);
-        pivotCtorByTag.set(tagName, PivotCtor);
-      }
-      // Register a UserConstructor as "safe" to be used within a PivotConstructor
-      registeredUserCtors.add(UserCtor);
-      return PivotCtor;
-    };
-  }
-
-  /*
-   * Copyright (c) 2018, salesforce.com, inc.
-   * All rights reserved.
-   * SPDX-License-Identifier: MIT
-   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
-   */
-  let createScopedConstructor;
-  let CachedHTMLElement;
-  // We only call `createScopedRegistry()` if the browser supports custom elements and
-  // ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY is enabled, because we don't want to patch eagerly if the flag is disabled
-  // or we're in a legacy browser.
-  if (lwcRuntimeFlags.ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY) {
-    if (hasCustomElements) {
-      // If ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY is true, then we eagerly initialize the scoped registry.
-      // It's assumed that ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY is set *before* LWC loads, and never changes.
-      //
-      // Why not lazily patch in `createCustomElement`? Well, this could lead to subtle bugs, e.g.:
-      //
-      // 1. LWC loads
-      // 2. `const Ctor = class extends HTMLElement {}`
-      // 3. `lwc.createElement(...)` // here we lazily patch
-      // 4. `customElements.define('x-foo', Ctor)` // throws error because class is bound to stale HTMLElement
-      //
-      // To reduce the risk of this, it's safer to patch the registry eagerly.
-      createScopedConstructor = createScopedRegistry();
-      // It's important to cache window.HTMLElement here. Otherwise, someone else could overwrite window.HTMLElement (e.g.
-      // another copy of the engine, or another scoping implementation) and we would get "Illegal constructor" errors
-      // because the HTMLElement prototypes are mixed up.
-      //
-      // The reason this happens is that the scoping implementation overwrites window.HTMLElement and expects to work
-      // with that version of HTMLElement. So if you load two copies of the scoping implementation in the same environment,
-      // the second one may accidentally grab window.HTMLElement from the first (when doing `class extends HTMLElement`).
-      // Caching avoids this problem.
-      CachedHTMLElement = window.HTMLElement;
-    }
-  }
-  // Creates a constructor that is intended to be used as the UserConstructor in a scoped (pivots) registry.
-  // In this case, the upgradeCallback only needs to be defined once because we create these on-demand,
-  // multiple times per tag name.
-  const createUserConstructor = (HTMLElementToExtend, upgradeCallback, connectedCallback, disconnectedCallback) => {
-    // TODO [#2972]: this class should expose observedAttributes as necessary
-    return class UserConstructor extends HTMLElementToExtend {
-      constructor() {
-        super();
-        upgradeCallback(this);
-      }
-      // Note that there is no need to do the "avoid defining connectedCallback/disconnectedCallback" optimization
-      // here, because in create-scoped-registry.ts, the registered class will always have these callbacks anyway.
-      // See: https://github.com/salesforce/lwc/pull/3162#issuecomment-1311851174
-      connectedCallback() {
-        if (!isUndefined$1(connectedCallback)) {
-          connectedCallback(this);
-        }
-      }
-      disconnectedCallback() {
-        if (!isUndefined$1(disconnectedCallback)) {
-          disconnectedCallback(this);
-        }
-      }
-      /*LWC compiler v2.33.0*/
-    };
-  };
-  function createCustomElementScoped(tagName, upgradeCallback, connectedCallback, disconnectedCallback) {
-    if (isUndefined$1(createScopedConstructor) || isUndefined$1(CachedHTMLElement)) {
-      // This error should be impossible to hit
-      throw new Error('The flag ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY must be set to true to use this feature');
-    }
-    const UserConstructor = createUserConstructor(CachedHTMLElement, upgradeCallback, connectedCallback, disconnectedCallback);
-    const ScopedConstructor = createScopedConstructor(tagName, UserConstructor);
-    return new ScopedConstructor(UserConstructor);
-  }
-
   /*
    * Copyright (c) 2018, salesforce.com, inc.
    * All rights reserved.
@@ -8299,26 +8195,18 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
   /**
-   * We have three modes for creating custom elements:
+   * We have two modes for creating custom elements:
    *
    * 1. Compat (legacy) browser support (e.g. IE11). Totally custom, doesn't rely on native browser APIs.
-   * 2. "Vanilla" custom elements registry. This system actually still allows us to have two LWC components with the
-   *    same tag name, via a simple trick: every custom element constructor we define in the registry is basically
-   *    the same. It's essentially a dummy `class extends HTMLElement` that accepts an `upgradeCallback` in its
-   *    constructor, which allows us to have completely customized functionality for different components.
-   * 3. "Scoped" (or "pivot") custom elements. This relies on a sophisticated system that emulates the "scoped custom
-   *    elements registry" proposal, with support for avoiding conflicts in tag names both between LWC components and
-   *    between LWC components and third-party elements. This uses a similar trick to #2, but is much more complex
-   *    because it must patch the global `customElements` and `HTMLElement` objects.
+   * 2. "Upgradable constructor" custom element. This allows us to have two LWC components with the same tag name,
+   *    via a trick: every custom element constructor we define in the registry is basically the same. It's essentially
+   *    a dummy `class extends HTMLElement` that accepts an `upgradeCallback` in its constructor ("upgradable
+   *    constructor"), which allows us to have completely customized functionality for different components.
    */
   let createCustomElement;
   if (hasCustomElements) {
-    if (lwcRuntimeFlags.ENABLE_SCOPED_CUSTOM_ELEMENT_REGISTRY) {
-      createCustomElement = createCustomElementScoped;
-    } else {
-      // use global custom elements registry (vanilla)
-      createCustomElement = createCustomElementVanilla;
-    }
+    // use the global registry, with an upgradable constructor for the defined custom element
+    createCustomElement = createCustomElementUsingUpgradableConstructor;
   } else {
     // no registry available here
     createCustomElement = createCustomElementCompat;
@@ -8371,10 +8259,10 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       }
       var assert = /*#__PURE__*/Object.freeze({
         __proto__: null,
+        fail: fail,
         invariant: invariant,
-        isTrue: isTrue$1,
         isFalse: isFalse$1,
-        fail: fail
+        isTrue: isTrue$1
       });
       function isUndefined(obj) {
         return obj === undefined;
@@ -8382,7 +8270,44 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       function isNull(obj) {
         return obj === null;
       }
-      /** version: 2.33.0 */
+      /** version: 2.38.1 */
+
+      /*
+       * Copyright (c) 2023, 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
+       */
+      class WireContextSubscriptionEvent extends CustomEvent {
+        constructor(adapterToken, {
+          setNewContext,
+          setDisconnectedCallback
+        }) {
+          super(adapterToken, {
+            bubbles: true,
+            composed: true
+          });
+          this.setNewContext = setNewContext;
+          this.setDisconnectedCallback = setDisconnectedCallback;
+        }
+        /*LWC compiler v2.38.1*/
+      }
+      function registerContextConsumer(elm, adapterContextToken, subscriptionPayload) {
+        dispatchEvent(elm, new WireContextSubscriptionEvent(adapterContextToken, subscriptionPayload));
+      }
+      function registerContextProvider(elm, adapterContextToken, onContextSubscription) {
+        addEventListener(elm, adapterContextToken, evt => {
+          evt.stopImmediatePropagation();
+          const {
+            setNewContext,
+            setDisconnectedCallback
+          } = evt;
+          onContextSubscription({
+            setNewContext,
+            setDisconnectedCallback
+          });
+        });
+      }
 
       /*
        * Copyright (c) 2018, salesforce.com, inc.
@@ -8555,6 +8480,9 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       function assertInstanceOfHTMLElement(elm, msg) {
         assert.invariant(elm instanceof HTMLElement, msg);
       }
+      function ownerDocument(element) {
+        return element.ownerDocument;
+      }
       exports.addEventListener = addEventListener;
       exports.assertInstanceOfHTMLElement = assertInstanceOfHTMLElement;
       exports.attachShadow = attachShadow;
@@ -8578,8 +8506,11 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       exports.insert = insert;
       exports.isConnected = isConnected;
       exports.nextSibling = nextSibling;
+      exports.ownerDocument = ownerDocument;
       exports.querySelector = querySelector;
       exports.querySelectorAll = querySelectorAll;
+      exports.registerContextConsumer = registerContextConsumer;
+      exports.registerContextProvider = registerContextProvider;
       exports.remove = remove;
       exports.removeAttribute = removeAttribute;
       exports.removeEventListener = removeEventListener;
@@ -8749,7 +8680,7 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
       attributeChangedCallback(name, oldValue, newValue) {
         attributeChangedCallback.call(this, name, oldValue, newValue);
       }
-      /*LWC compiler v2.33.0*/
+      /*LWC compiler v2.38.1*/
     }, _a.observedAttributes = observedAttributes, _a;
   }
 
@@ -8930,10 +8861,44 @@ LWR.define('lwc/v/2_33_0', ['exports'], function (exports) { 'use strict';
   });
   freeze(LightningElement);
   seal(LightningElement.prototype);
-  /* version: 2.33.0 */
+
+  /*
+   * 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 addEventListener(target, type, callback, options) {
+    target.addEventListener(type, callback, options);
+  }
+
+  /*
+   * Copyright (c) 2023, 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 createContextProvider(adapter) {
+    return createContextProviderWithRegister(adapter, registerContextProvider);
+  }
+  function registerContextProvider(elm, adapterContextToken, onContextSubscription) {
+    addEventListener(elm, adapterContextToken, evt => {
+      evt.stopImmediatePropagation();
+      const {
+        setNewContext,
+        setDisconnectedCallback
+      } = evt;
+      onContextSubscription({
+        setNewContext,
+        setDisconnectedCallback
+      });
+    });
+  }
+  /* version: 2.38.1 */
 
   exports.LightningElement = LightningElement;
   exports.__unstable__ProfilerControl = profilerControl;
+  exports.__unstable__ReportingControl = reportingControl;
   exports.api = api$1;
   exports.buildCustomElementConstructor = deprecatedBuildCustomElementConstructor;
   exports.createContextProvider = createContextProvider;