@lwrjs/everywhere 0.13.0-alpha.1 → 0.13.0-alpha.2

package/build/__generated_site_amd_modules__/1/module/amd/1/l/en-US/mi/lwc/v/{6_5_2/s/b04b0848c889e153c4119373afa73a21 → 6_6_1/s/eeee3bb1f188f86a6a28e9d5c983706c}/lwc.js

@@ -1,4 +1,4 @@
-LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
+LWR.define('lwc/v/6_6_1', ['exports'], (function (exports) { 'use strict';
 
   /**
    * Copyright (c) 2024 Salesforce, Inc.
@@ -442,9 +442,9 @@ LWR.define('lwc/v/6_5_2', ['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 = "6.5.2";
+  const LWC_VERSION = "6.6.1";
   const LWC_VERSION_COMMENT_REGEX = /\/\*LWC compiler v([\d.]+)\*\/\s*}/;
-  /** version: 6.5.2 */
+  /** version: 6.6.1 */
 
   /**
    * Copyright (c) 2024 Salesforce, Inc.
@@ -530,7 +530,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
       setFeatureFlag(name, value);
     }
   }
-  /** version: 6.5.2 */
+  /** version: 6.6.1 */
 
   /**
    * Copyright (c) 2024 Salesforce, Inc.
@@ -1722,7 +1722,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
       valueMutated(originalTarget, key);
       return true;
     }
-    /*LWC compiler v6.5.2*/
+    /*LWC compiler v6.6.1*/
   }
   const getterMap = new WeakMap();
   const setterMap = new WeakMap();
@@ -1815,7 +1815,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
       /* istanbul ignore next */
       return false;
     }
-    /*LWC compiler v6.5.2*/
+    /*LWC compiler v6.6.1*/
   }
   function extract(objectOrArray) {
     if (isArray(objectOrArray)) {
@@ -3522,7 +3522,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
   }
   function HTMLBridgeElementFactory(SuperClass, publicProperties, methods, observedFields, proto, hasCustomSuperClass) {
     const HTMLBridgeElement = class extends SuperClass {
-      /*LWC compiler v6.5.2*/
+      /*LWC compiler v6.6.1*/
     };
     // generating the hash table for attributes to avoid duplicate fields and facilitate validation
     // and false positives in case of inheritance.
@@ -3634,130 +3634,453 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
   seal(BaseBridgeElement.prototype);
 
   /*
-   * Copyright (c) 2023, salesforce.com, inc.
+   * 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 supportsWeakRefs = typeof WeakRef === 'function' && typeof FinalizationRegistry === 'function';
-  // In browsers that doesn't support WeakRefs, the values will still leak, but at least the keys won't
-  class LegacyWeakMultiMap {
-    constructor() {
-      this._map = new WeakMap();
+  // These are only used for HMR in dev mode
+  // The "pure" annotations are so that Rollup knows for sure it can remove these from prod mode
+  let stylesheetsToCssContent = /*@__PURE__@*/new WeakMap();
+  let cssContentToAbortControllers = /*@__PURE__@*/new Map();
+  // Only used in LWC's Karma tests
+  if (process.env.NODE_ENV === 'test-karma-lwc') {
+    // Used to reset the global state between test runs
+    window.__lwcResetStylesheetCache = () => {
+      stylesheetsToCssContent = new WeakMap();
+      cssContentToAbortControllers = new Map();
+    };
+  }
+  function linkStylesheetToCssContentInDevMode(stylesheet, cssContent) {
+    // Should never leak to prod; only used for HMR
+    assertNotProd();
+    let cssContents = stylesheetsToCssContent.get(stylesheet);
+    if (isUndefined$1(cssContents)) {
+      cssContents = new Set();
+      stylesheetsToCssContent.set(stylesheet, cssContents);
     }
-    _getValues(key) {
-      let values = this._map.get(key);
-      if (isUndefined$1(values)) {
-        values = new Set();
-        this._map.set(key, values);
+    cssContents.add(cssContent);
+  }
+  function getOrCreateAbortControllerInDevMode(cssContent) {
+    // Should never leak to prod; only used for HMR
+    assertNotProd();
+    let abortController = cssContentToAbortControllers.get(cssContent);
+    if (isUndefined$1(abortController)) {
+      abortController = new AbortController();
+      cssContentToAbortControllers.set(cssContent, abortController);
+    }
+    return abortController;
+  }
+  function getOrCreateAbortSignal(cssContent) {
+    // abort controller/signal is only used for HMR in development
+    if (process.env.NODE_ENV !== 'production') {
+      return getOrCreateAbortControllerInDevMode(cssContent).signal;
+    }
+    return undefined;
+  }
+  function makeHostToken(token) {
+    // Note: if this ever changes, update the `cssScopeTokens` returned by `@lwc/compiler`
+    return `${token}-host`;
+  }
+  function createInlineStyleVNode(content) {
+    return api.h('style', {
+      key: 'style',
+      // special key
+      attrs: {
+        type: 'text/css'
       }
-      return values;
+    }, [api.t(content)]);
+  }
+  // TODO [#3733]: remove support for legacy scope tokens
+  function updateStylesheetToken(vm, template, legacy) {
+    const {
+      elm,
+      context,
+      renderMode,
+      shadowMode,
+      renderer: {
+        getClassList,
+        removeAttribute,
+        setAttribute
+      }
+    } = vm;
+    const {
+      stylesheets: newStylesheets
+    } = template;
+    const newStylesheetToken = legacy ? template.legacyStylesheetToken : template.stylesheetToken;
+    const {
+      stylesheets: newVmStylesheets
+    } = vm;
+    const isSyntheticShadow = renderMode === 1 /* RenderMode.Shadow */ && shadowMode === 1 /* ShadowMode.Synthetic */;
+    const {
+      hasScopedStyles
+    } = context;
+    let newToken;
+    let newHasTokenInClass;
+    let newHasTokenInAttribute;
+    // Reset the styling token applied to the host element.
+    let oldToken;
+    let oldHasTokenInClass;
+    let oldHasTokenInAttribute;
+    if (legacy) {
+      oldToken = context.legacyStylesheetToken;
+      oldHasTokenInClass = context.hasLegacyTokenInClass;
+      oldHasTokenInAttribute = context.hasLegacyTokenInAttribute;
+    } else {
+      oldToken = context.stylesheetToken;
+      oldHasTokenInClass = context.hasTokenInClass;
+      oldHasTokenInAttribute = context.hasTokenInAttribute;
     }
-    get(key) {
-      return this._getValues(key);
+    if (!isUndefined$1(oldToken)) {
+      if (oldHasTokenInClass) {
+        getClassList(elm).remove(makeHostToken(oldToken));
+      }
+      if (oldHasTokenInAttribute) {
+        removeAttribute(elm, makeHostToken(oldToken));
+      }
     }
-    add(key, vm) {
-      const set = this._getValues(key);
-      set.add(vm);
+    // 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.
+    const hasNewStylesheets = hasStyles(newStylesheets);
+    const hasNewVmStylesheets = hasStyles(newVmStylesheets);
+    if (hasNewStylesheets || hasNewVmStylesheets) {
+      newToken = newStylesheetToken;
     }
-    delete(key) {
-      this._map.delete(key);
+    // Set the new styling token on the host element
+    if (!isUndefined$1(newToken)) {
+      if (hasScopedStyles) {
+        getClassList(elm).add(makeHostToken(newToken));
+        newHasTokenInClass = true;
+      }
+      if (isSyntheticShadow) {
+        setAttribute(elm, makeHostToken(newToken), '');
+        newHasTokenInAttribute = true;
+      }
+    }
+    // Update the styling tokens present on the context object.
+    if (legacy) {
+      context.legacyStylesheetToken = newToken;
+      context.hasLegacyTokenInClass = newHasTokenInClass;
+      context.hasLegacyTokenInAttribute = newHasTokenInAttribute;
+    } else {
+      context.stylesheetToken = newToken;
+      context.hasTokenInClass = newHasTokenInClass;
+      context.hasTokenInAttribute = newHasTokenInAttribute;
     }
   }
-  // This implementation relies on the WeakRef/FinalizationRegistry proposal.
-  // For some background, see: https://github.com/tc39/proposal-weakrefs
-  class ModernWeakMultiMap {
-    constructor() {
-      this._map = new WeakMap();
-      this._registry = new FinalizationRegistry(weakRefs => {
-        // This should be considered an optional cleanup method to remove GC'ed values from their respective arrays.
-        // JS VMs are not obligated to call FinalizationRegistry callbacks.
-        // Work backwards, removing stale VMs
-        for (let i = weakRefs.length - 1; i >= 0; i--) {
-          const vm = weakRefs[i].deref();
-          if (isUndefined$1(vm)) {
-            ArraySplice.call(weakRefs, i, 1); // remove
+  function evaluateStylesheetsContent(stylesheets, stylesheetToken, vm) {
+    const content = [];
+    let root;
+    for (let i = 0; i < stylesheets.length; i++) {
+      let stylesheet = stylesheets[i];
+      if (isArray$1(stylesheet)) {
+        ArrayPush$1.apply(content, evaluateStylesheetsContent(stylesheet, stylesheetToken, vm));
+      } else {
+        if (process.env.NODE_ENV !== 'production') {
+          // Check for compiler version mismatch in dev mode only
+          checkVersionMismatch(stylesheet, 'stylesheet');
+          // in dev-mode, we support hot swapping of stylesheet, which means that
+          // the component instance might be attempting to use an old version of
+          // the stylesheet, while internally, we have a replacement for it.
+          stylesheet = getStyleOrSwappedStyle(stylesheet);
+        }
+        const isScopedCss = stylesheet[KEY__SCOPED_CSS];
+        if (lwcRuntimeFlags.DISABLE_LIGHT_DOM_UNSCOPED_CSS && !isScopedCss && vm.renderMode === 0 /* RenderMode.Light */) {
+          logError('Unscoped CSS is not supported in Light DOM in this environment. Please use scoped CSS ' + '(*.scoped.css) instead of unscoped CSS (*.css). See also: https://sfdc.co/scoped-styles-light-dom');
+          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;
+        // Use the actual `:host` selector if we're rendering global CSS for light DOM, or if we're rendering
+        // native shadow DOM. Synthetic shadow DOM never uses `:host`.
+        const useActualHostSelector = vm.renderMode === 0 /* RenderMode.Light */ ? !isScopedCss : vm.shadowMode === 0 /* ShadowMode.Native */;
+        // Use the native :dir() pseudoclass only in native shadow DOM. Otherwise, in synthetic shadow,
+        // we use an attribute selector on the host to simulate :dir().
+        let useNativeDirPseudoclass;
+        if (vm.renderMode === 1 /* RenderMode.Shadow */) {
+          useNativeDirPseudoclass = vm.shadowMode === 0 /* ShadowMode.Native */;
+        } else {
+          // Light DOM components should only render `[dir]` if they're inside of a synthetic shadow root.
+          // At the top level (root is null) or inside of a native shadow root, they should use `:dir()`.
+          if (isUndefined$1(root)) {
+            // Only calculate the root once as necessary
+            root = getNearestShadowComponent(vm);
           }
+          useNativeDirPseudoclass = isNull(root) || root.shadowMode === 0 /* ShadowMode.Native */;
         }
-      });
-    }
-    _getWeakRefs(key) {
-      let weakRefs = this._map.get(key);
-      if (isUndefined$1(weakRefs)) {
-        weakRefs = [];
-        this._map.set(key, weakRefs);
-      }
-      return weakRefs;
-    }
-    get(key) {
-      const weakRefs = this._getWeakRefs(key);
-      const result = new Set();
-      for (const weakRef of weakRefs) {
-        const vm = weakRef.deref();
-        if (!isUndefined$1(vm)) {
-          result.add(vm);
+        const cssContent = stylesheet(scopeToken, useActualHostSelector, useNativeDirPseudoclass);
+        if (process.env.NODE_ENV !== 'production') {
+          linkStylesheetToCssContentInDevMode(stylesheet, cssContent);
         }
+        ArrayPush$1.call(content, cssContent);
       }
-      return result;
     }
-    add(key, value) {
-      const weakRefs = this._getWeakRefs(key);
-      // We could check for duplicate values here, but it doesn't seem worth it.
-      // We transform the output into a Set anyway
-      ArrayPush$1.call(weakRefs, new WeakRef(value));
-      // It's important here not to leak the second argument, which is the "held value." The FinalizationRegistry
-      // effectively creates a strong reference between the first argument (the "target") and the held value. When
-      // the target is GC'ed, the callback is called, and then the held value is GC'ed.
-      // Putting the key here would mean the key is not GC'ed until the value is GC'ed, which defeats the purpose
-      // of the WeakMap. Whereas putting the weakRefs array here is fine, because it doesn't have a strong reference
-      // to anything. See also this example:
-      // https://gist.github.com/nolanlawson/79a3d36e8e6cc25c5048bb17c1795aea
-      this._registry.register(value, weakRefs);
+    return content;
+  }
+  function getStylesheetsContent(vm, template) {
+    const {
+      stylesheets,
+      stylesheetToken
+    } = template;
+    const {
+      stylesheets: vmStylesheets
+    } = vm;
+    let content = [];
+    if (hasStyles(stylesheets)) {
+      content = evaluateStylesheetsContent(stylesheets, stylesheetToken, vm);
     }
-    delete(key) {
-      this._map.delete(key);
+    // VM (component) stylesheets apply after template stylesheets
+    if (hasStyles(vmStylesheets)) {
+      ArrayPush$1.apply(content, evaluateStylesheetsContent(vmStylesheets, stylesheetToken, vm));
     }
+    return content;
   }
-  const WeakMultiMap = supportsWeakRefs ? ModernWeakMultiMap : LegacyWeakMultiMap;
-
-  /*
-   * 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 swappedTemplateMap = new WeakMap();
-  const swappedComponentMap = new WeakMap();
-  const swappedStyleMap = new WeakMap();
-  // The important thing here is the weak values – VMs are transient (one per component instance) and should be GC'ed,
-  // so we don't want to create strong references to them.
-  // The weak keys are kind of useless, because Templates, LightningElementConstructors, and StylesheetFactories are
-  // never GC'ed. But maybe they will be someday, so we may as well use weak keys too.
-  const activeTemplates = new WeakMultiMap();
-  const activeComponents = new WeakMultiMap();
-  const activeStyles = new WeakMultiMap();
-  function rehydrateHotTemplate(tpl) {
-    const list = activeTemplates.get(tpl);
-    for (const vm of list) {
-      if (isFalse(vm.isDirty)) {
-        // forcing the vm to rehydrate in the micro-task:
-        markComponentAsDirty(vm);
-        scheduleRehydration(vm);
+  // It might be worth caching this to avoid doing the lookup repeatedly, but
+  // perf testing has not shown it to be a huge improvement yet:
+  // https://github.com/salesforce/lwc/pull/2460#discussion_r691208892
+  function getNearestShadowComponent(vm) {
+    let owner = vm;
+    while (!isNull(owner)) {
+      if (owner.renderMode === 1 /* RenderMode.Shadow */) {
+        return owner;
       }
+      owner = owner.owner;
     }
-    // Resetting the Set since these VMs are no longer related to this template, instead
-    // they will get re-associated once these instances are rehydrated.
-    activeTemplates.delete(tpl);
-    return true;
+    return owner;
   }
-  function rehydrateHotStyle(style) {
-    const list = activeStyles.get(style);
-    for (const vm of list) {
-      // if a style definition is swapped, we must reset
-      // vm's template content in the next micro-task:
-      forceRehydration(vm);
-    }
-    // Resetting the Set since these VMs are no longer related to this style, instead
+  /**
+   * If the component that is currently being rendered uses scoped styles,
+   * this returns the unique token for that scoped stylesheet. Otherwise
+   * it returns null.
+   * @param owner
+   * @param legacy
+   */
+  // TODO [#3733]: remove support for legacy scope tokens
+  function getScopeTokenClass(owner, legacy) {
+    const {
+      cmpTemplate,
+      context
+    } = owner;
+    return context.hasScopedStyles && (legacy ? cmpTemplate?.legacyStylesheetToken : cmpTemplate?.stylesheetToken) || null;
+  }
+  /**
+   * This function returns the host style token for a custom element if it
+   * exists. Otherwise it returns null.
+   *
+   * A host style token is applied to the component if scoped styles are used.
+   * @param vnode
+   */
+  function getStylesheetTokenHost(vnode) {
+    const {
+      template
+    } = getComponentInternalDef(vnode.ctor);
+    const {
+      vm
+    } = vnode;
+    const {
+      stylesheetToken
+    } = template;
+    return !isUndefined$1(stylesheetToken) && computeHasScopedStyles(template, vm) ? makeHostToken(stylesheetToken) : null;
+  }
+  function getNearestNativeShadowComponent(vm) {
+    const owner = getNearestShadowComponent(vm);
+    if (!isNull(owner) && owner.shadowMode === 1 /* ShadowMode.Synthetic */) {
+      // Synthetic-within-native is impossible. So if the nearest shadow component is
+      // synthetic, we know we won't find a native component if we go any further.
+      return null;
+    }
+    return owner;
+  }
+  function createStylesheet(vm, stylesheets) {
+    const {
+      renderMode,
+      shadowMode,
+      renderer: {
+        insertStylesheet
+      }
+    } = vm;
+    if (renderMode === 1 /* RenderMode.Shadow */ && shadowMode === 1 /* ShadowMode.Synthetic */) {
+      for (let i = 0; i < stylesheets.length; i++) {
+        const stylesheet = stylesheets[i];
+        insertStylesheet(stylesheet, undefined, getOrCreateAbortSignal(stylesheet));
+      }
+    } else if (vm.hydrated) {
+      // Note: We need to ensure that during hydration, the stylesheets method is the same as those in ssr.
+      //       This works in the client, because the stylesheets are created, and cached in the VM
+      //       the first time the VM renders.
+      // native shadow or light DOM, SSR
+      return ArrayMap.call(stylesheets, createInlineStyleVNode);
+    } else {
+      // native shadow or light DOM, DOM renderer
+      const root = getNearestNativeShadowComponent(vm);
+      // null root means a global style
+      const target = isNull(root) ? undefined : root.shadowRoot;
+      for (let i = 0; i < stylesheets.length; i++) {
+        const stylesheet = stylesheets[i];
+        insertStylesheet(stylesheet, target, getOrCreateAbortSignal(stylesheet));
+      }
+    }
+    return null;
+  }
+  function unrenderStylesheet(stylesheet) {
+    // should never leak to prod; only used for HMR
+    assertNotProd();
+    const cssContents = stylesheetsToCssContent.get(stylesheet);
+    /* istanbul ignore if */
+    if (isUndefined$1(cssContents)) {
+      throw new Error('Cannot unrender stylesheet which was never rendered');
+    }
+    for (const cssContent of cssContents) {
+      const abortController = cssContentToAbortControllers.get(cssContent);
+      /* istanbul ignore if */
+      if (isUndefined$1(abortController)) {
+        throw new Error('Cannot find AbortController for CSS content');
+      }
+      abortController.abort();
+      // remove association with AbortController in case stylesheet is rendered again
+      cssContentToAbortControllers.delete(cssContent);
+    }
+  }
+
+  /*
+   * 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
+   */
+  const supportsWeakRefs = typeof WeakRef === 'function' && typeof FinalizationRegistry === 'function';
+  // In browsers that doesn't support WeakRefs, the values will still leak, but at least the keys won't
+  class LegacyWeakMultiMap {
+    constructor() {
+      this._map = new WeakMap();
+    }
+    _getValues(key) {
+      let values = this._map.get(key);
+      if (isUndefined$1(values)) {
+        values = new Set();
+        this._map.set(key, values);
+      }
+      return values;
+    }
+    get(key) {
+      return this._getValues(key);
+    }
+    add(key, vm) {
+      const set = this._getValues(key);
+      set.add(vm);
+    }
+    delete(key) {
+      this._map.delete(key);
+    }
+  }
+  // This implementation relies on the WeakRef/FinalizationRegistry proposal.
+  // For some background, see: https://github.com/tc39/proposal-weakrefs
+  class ModernWeakMultiMap {
+    constructor() {
+      this._map = new WeakMap();
+      this._registry = new FinalizationRegistry(weakRefs => {
+        // This should be considered an optional cleanup method to remove GC'ed values from their respective arrays.
+        // JS VMs are not obligated to call FinalizationRegistry callbacks.
+        // Work backwards, removing stale VMs
+        for (let i = weakRefs.length - 1; i >= 0; i--) {
+          const vm = weakRefs[i].deref();
+          if (isUndefined$1(vm)) {
+            ArraySplice.call(weakRefs, i, 1); // remove
+          }
+        }
+      });
+    }
+    _getWeakRefs(key) {
+      let weakRefs = this._map.get(key);
+      if (isUndefined$1(weakRefs)) {
+        weakRefs = [];
+        this._map.set(key, weakRefs);
+      }
+      return weakRefs;
+    }
+    get(key) {
+      const weakRefs = this._getWeakRefs(key);
+      const result = new Set();
+      for (const weakRef of weakRefs) {
+        const vm = weakRef.deref();
+        if (!isUndefined$1(vm)) {
+          result.add(vm);
+        }
+      }
+      return result;
+    }
+    add(key, value) {
+      const weakRefs = this._getWeakRefs(key);
+      // We could check for duplicate values here, but it doesn't seem worth it.
+      // We transform the output into a Set anyway
+      ArrayPush$1.call(weakRefs, new WeakRef(value));
+      // It's important here not to leak the second argument, which is the "held value." The FinalizationRegistry
+      // effectively creates a strong reference between the first argument (the "target") and the held value. When
+      // the target is GC'ed, the callback is called, and then the held value is GC'ed.
+      // Putting the key here would mean the key is not GC'ed until the value is GC'ed, which defeats the purpose
+      // of the WeakMap. Whereas putting the weakRefs array here is fine, because it doesn't have a strong reference
+      // to anything. See also this example:
+      // https://gist.github.com/nolanlawson/79a3d36e8e6cc25c5048bb17c1795aea
+      this._registry.register(value, weakRefs);
+    }
+    delete(key) {
+      this._map.delete(key);
+    }
+  }
+  const WeakMultiMap = supportsWeakRefs ? ModernWeakMultiMap : LegacyWeakMultiMap;
+
+  /*
+   * 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
+   */
+  let swappedTemplateMap = /*@__PURE__@*/new WeakMap();
+  let swappedComponentMap = /*@__PURE__@*/new WeakMap();
+  let swappedStyleMap = /*@__PURE__@*/new WeakMap();
+  // The important thing here is the weak values – VMs are transient (one per component instance) and should be GC'ed,
+  // so we don't want to create strong references to them.
+  // The weak keys are kind of useless, because Templates, LightningElementConstructors, and StylesheetFactories are
+  // never GC'ed. But maybe they will be someday, so we may as well use weak keys too.
+  // The "pure" annotations are so that Rollup knows for sure it can remove these from prod mode
+  let activeTemplates = /*@__PURE__@*/new WeakMultiMap();
+  let activeComponents = /*@__PURE__@*/new WeakMultiMap();
+  let activeStyles = /*@__PURE__@*/new WeakMultiMap();
+  // Only used in LWC's Karma tests
+  if (process.env.NODE_ENV === 'test-karma-lwc') {
+    // Used to reset the global state between test runs
+    window.__lwcResetHotSwaps = () => {
+      swappedTemplateMap = new WeakMap();
+      swappedComponentMap = new WeakMap();
+      swappedStyleMap = new WeakMap();
+      activeTemplates = new WeakMultiMap();
+      activeComponents = new WeakMultiMap();
+      activeStyles = new WeakMultiMap();
+    };
+  }
+  function rehydrateHotTemplate(tpl) {
+    const list = activeTemplates.get(tpl);
+    for (const vm of list) {
+      if (isFalse(vm.isDirty)) {
+        // forcing the vm to rehydrate in the micro-task:
+        markComponentAsDirty(vm);
+        scheduleRehydration(vm);
+      }
+    }
+    // Resetting the Set since these VMs are no longer related to this template, instead
+    // they will get re-associated once these instances are rehydrated.
+    activeTemplates.delete(tpl);
+    return true;
+  }
+  function rehydrateHotStyle(style) {
+    const activeVMs = activeStyles.get(style);
+    unrenderStylesheet(style);
+    for (const vm of activeVMs) {
+      // if a style definition is swapped, we must reset
+      // vm's template content in the next micro-task:
+      forceRehydration(vm);
+    }
+    // Resetting the Set since these VMs are no longer related to this style, instead
     // they will get re-associated once these instances are rehydrated.
     activeStyles.delete(style);
     return true;
@@ -3790,6 +4113,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
   }
   function getTemplateOrSwappedTemplate(tpl) {
     assertNotProd(); // this method should never leak to prod
+    // TODO [#4154]: shows stale content when swapping content back and forth multiple times
     const visited = new Set();
     while (swappedTemplateMap.has(tpl) && !visited.has(tpl)) {
       visited.add(tpl);
@@ -3799,6 +4123,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
   }
   function getComponentOrSwappedComponent(Ctor) {
     assertNotProd(); // this method should never leak to prod
+    // TODO [#4154]: shows stale content when swapping content back and forth multiple times
     const visited = new Set();
     while (swappedComponentMap.has(Ctor) && !visited.has(Ctor)) {
       visited.add(Ctor);
@@ -3808,6 +4133,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
   }
   function getStyleOrSwappedStyle(style) {
     assertNotProd(); // this method should never leak to prod
+    // TODO [#4154]: shows stale content when swapping content back and forth multiple times
     const visited = new Set();
     while (swappedStyleMap.has(style) && !visited.has(style)) {
       visited.add(style);
@@ -3815,6 +4141,22 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     }
     return style;
   }
+  function addActiveStylesheets(stylesheets, vm) {
+    if (isUndefined$1(stylesheets) || isNull(stylesheets)) {
+      // Ignore non-existent stylesheets
+      return;
+    }
+    for (const stylesheet of flattenStylesheets(stylesheets)) {
+      // this is necessary because we don't hold the list of styles
+      // in the vm, we only hold the selected (already swapped template)
+      // but the styles attached to the template might not be the actual
+      // active ones, but the swapped versions of those.
+      const swappedStylesheet = getStyleOrSwappedStyle(stylesheet);
+      // this will allow us to keep track of the stylesheet that are
+      // being used by a hot component
+      activeStyles.add(swappedStylesheet, vm);
+    }
+  }
   function setActiveVM(vm) {
     assertNotProd(); // this method should never leak to prod
     // tracking active component
@@ -3822,25 +4164,15 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     // this will allow us to keep track of the hot components
     activeComponents.add(Ctor, vm);
     // tracking active template
-    const tpl = vm.cmpTemplate;
-    if (tpl) {
+    const template = vm.cmpTemplate;
+    if (!isNull(template)) {
       // this will allow us to keep track of the templates that are
       // being used by a hot component
-      activeTemplates.add(tpl, vm);
-      // tracking active styles associated to template
-      const stylesheets = tpl.stylesheets;
-      if (!isUndefined$1(stylesheets)) {
-        for (const stylesheet of flattenStylesheets(stylesheets)) {
-          // this is necessary because we don't hold the list of styles
-          // in the vm, we only hold the selected (already swapped template)
-          // but the styles attached to the template might not be the actual
-          // active ones, but the swapped versions of those.
-          const swappedStylesheet = getStyleOrSwappedStyle(stylesheet);
-          // this will allow us to keep track of the stylesheet that are
-          // being used by a hot component
-          activeStyles.add(swappedStylesheet, vm);
-        }
-      }
+      activeTemplates.add(template, vm);
+      // Tracking active styles from the template or the VM. `template.stylesheets` are implicitly associated
+      // (e.g. `foo.css` associated with `foo.html`), whereas `vm.stylesheets` are from `static stylesheets`.
+      addActiveStylesheets(template.stylesheets, vm);
+      addActiveStylesheets(vm.stylesheets, vm);
     }
   }
   function swapTemplate(oldTpl, newTpl) {
@@ -3977,414 +4309,169 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     render = render || superDef.render;
     let shadowSupportMode = superDef.shadowSupportMode;
     if (!isUndefined$1(ctorShadowSupportMode)) {
-      shadowSupportMode = ctorShadowSupportMode;
-      if (isReportingEnabled() && (shadowSupportMode === "any" /* ShadowSupportMode.Any */ || shadowSupportMode === "native" /* ShadowSupportMode.Native */)) {
-        report("ShadowSupportModeUsage" /* ReportingEventId.ShadowSupportModeUsage */, {
-          tagName: Ctor.name,
-          mode: shadowSupportMode
-        });
-      }
-    }
-    let renderMode = superDef.renderMode;
-    if (!isUndefined$1(ctorRenderMode)) {
-      renderMode = ctorRenderMode === 'light' ? 0 /* RenderMode.Light */ : 1 /* RenderMode.Shadow */;
-    }
-    let formAssociated = superDef.formAssociated;
-    if (!isUndefined$1(ctorFormAssociated)) {
-      formAssociated = ctorFormAssociated;
-    }
-    const template = getComponentRegisteredTemplate(Ctor) || superDef.template;
-    const name = Ctor.name || superDef.name;
-    // installing observed fields into the prototype.
-    defineProperties(proto, observedFields);
-    const def = {
-      ctor: Ctor,
-      name,
-      wire,
-      props,
-      propsConfig,
-      methods,
-      bridge,
-      template,
-      renderMode,
-      shadowSupportMode,
-      formAssociated,
-      connectedCallback,
-      disconnectedCallback,
-      errorCallback,
-      formAssociatedCallback,
-      formDisabledCallback,
-      formResetCallback,
-      formStateRestoreCallback,
-      renderedCallback,
-      render
-    };
-    // This is a no-op unless Lightning DevTools are enabled.
-    instrumentDef(def);
-    if (process.env.NODE_ENV !== 'production') {
-      freeze(Ctor.prototype);
-    }
-    return def;
-  }
-  /**
-   * EXPERIMENTAL: This function allows for the identification of LWC constructors. This API is
-   * subject to change or being removed.
-   * @param ctor
-   */
-  function isComponentConstructor(ctor) {
-    if (!isFunction$1(ctor)) {
-      return false;
-    }
-    // Fast path: LightningElement is part of the prototype chain of the constructor.
-    if (ctor.prototype instanceof LightningElement) {
-      return true;
-    }
-    // Slow path: LightningElement is not part of the prototype chain of the constructor, we need
-    // climb up the constructor prototype chain to check in case there are circular dependencies
-    // to resolve.
-    let current = ctor;
-    do {
-      if (isCircularModuleDependency(current)) {
-        const circularResolved = resolveCircularModuleDependency(current);
-        // If the circular function returns itself, that's the signal that we have hit the end
-        // of the proto chain, which must always be a valid base constructor.
-        if (circularResolved === current) {
-          return true;
-        }
-        current = circularResolved;
-      }
-      if (current === LightningElement) {
-        return true;
-      }
-    } while (!isNull(current) && (current = getPrototypeOf$1(current)));
-    // Finally return false if the LightningElement is not part of the prototype chain.
-    return false;
-  }
-  function getComponentInternalDef(Ctor) {
-    if (process.env.NODE_ENV !== 'production') {
-      Ctor = getComponentOrSwappedComponent(Ctor);
-    }
-    let def = CtorToDefMap.get(Ctor);
-    if (isUndefined$1(def)) {
-      if (isCircularModuleDependency(Ctor)) {
-        const resolvedCtor = resolveCircularModuleDependency(Ctor);
-        def = getComponentInternalDef(resolvedCtor);
-        // Cache the unresolved component ctor too. The next time if the same unresolved ctor is used,
-        // look up the definition in cache instead of re-resolving and recreating the def.
-        CtorToDefMap.set(Ctor, def);
-        return def;
-      }
-      if (!isComponentConstructor(Ctor)) {
-        throw new TypeError(`${Ctor} is not a valid component, or does not extends LightningElement from "lwc". You probably forgot to add the extend clause on the class declaration.`);
-      }
-      def = createComponentDef(Ctor);
-      CtorToDefMap.set(Ctor, def);
-    }
-    return def;
-  }
-  function getComponentHtmlPrototype(Ctor) {
-    const def = getComponentInternalDef(Ctor);
-    return def.bridge;
-  }
-  const lightingElementDef = {
-    ctor: LightningElement,
-    name: LightningElement.name,
-    props: lightningBasedDescriptors,
-    propsConfig: EmptyObject,
-    methods: EmptyObject,
-    renderMode: 1 /* RenderMode.Shadow */,
-    shadowSupportMode: "reset" /* ShadowSupportMode.Default */,
-    formAssociated: undefined,
-    wire: EmptyObject,
-    bridge: BaseBridgeElement,
-    template: defaultEmptyTemplate,
-    render: LightningElement.prototype.render
-  };
-  /**
-   * EXPERIMENTAL: This function allows for the collection of internal component metadata. This API is
-   * subject to change or being removed.
-   * @param Ctor
-   */
-  function getComponentDef(Ctor) {
-    const def = getComponentInternalDef(Ctor);
-    // From the internal def object, we need to extract the info that is useful
-    // for some external services, e.g.: Locker Service, usually, all they care
-    // is about the shape of the constructor, the internals of it are not relevant
-    // because they don't have a way to mess with that.
-    const {
-      ctor,
-      name,
-      props,
-      propsConfig,
-      methods
-    } = def;
-    const publicProps = {};
-    for (const key in props) {
-      // avoid leaking the reference to the public props descriptors
-      publicProps[key] = {
-        config: propsConfig[key] || 0,
-        // a property by default
-        type: "any" /* PropDefType.any */,
-        // no type inference for public services
-        attr: htmlPropertyToAttribute(key)
-      };
-    }
-    const publicMethods = {};
-    for (const key in methods) {
-      // avoid leaking the reference to the public method descriptors
-      publicMethods[key] = methods[key].value;
-    }
-    return {
-      ctor,
-      name,
-      props: publicProps,
-      methods: publicMethods
-    };
-  }
-
-  /*
-   * 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 makeHostToken(token) {
-    // Note: if this ever changes, update the `cssScopeTokens` returned by `@lwc/compiler`
-    return `${token}-host`;
-  }
-  function createInlineStyleVNode(content) {
-    return api.h('style', {
-      key: 'style',
-      // special key
-      attrs: {
-        type: 'text/css'
-      }
-    }, [api.t(content)]);
-  }
-  // TODO [#3733]: remove support for legacy scope tokens
-  function updateStylesheetToken(vm, template, legacy) {
-    const {
-      elm,
-      context,
-      renderMode,
-      shadowMode,
-      renderer: {
-        getClassList,
-        removeAttribute,
-        setAttribute
-      }
-    } = vm;
-    const {
-      stylesheets: newStylesheets
-    } = template;
-    const newStylesheetToken = legacy ? template.legacyStylesheetToken : template.stylesheetToken;
-    const {
-      stylesheets: newVmStylesheets
-    } = vm;
-    const isSyntheticShadow = renderMode === 1 /* RenderMode.Shadow */ && shadowMode === 1 /* ShadowMode.Synthetic */;
-    const {
-      hasScopedStyles
-    } = context;
-    let newToken;
-    let newHasTokenInClass;
-    let newHasTokenInAttribute;
-    // Reset the styling token applied to the host element.
-    let oldToken;
-    let oldHasTokenInClass;
-    let oldHasTokenInAttribute;
-    if (legacy) {
-      oldToken = context.legacyStylesheetToken;
-      oldHasTokenInClass = context.hasLegacyTokenInClass;
-      oldHasTokenInAttribute = context.hasLegacyTokenInAttribute;
-    } else {
-      oldToken = context.stylesheetToken;
-      oldHasTokenInClass = context.hasTokenInClass;
-      oldHasTokenInAttribute = context.hasTokenInAttribute;
-    }
-    if (!isUndefined$1(oldToken)) {
-      if (oldHasTokenInClass) {
-        getClassList(elm).remove(makeHostToken(oldToken));
-      }
-      if (oldHasTokenInAttribute) {
-        removeAttribute(elm, makeHostToken(oldToken));
-      }
-    }
-    // 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.
-    const hasNewStylesheets = hasStyles(newStylesheets);
-    const hasNewVmStylesheets = hasStyles(newVmStylesheets);
-    if (hasNewStylesheets || hasNewVmStylesheets) {
-      newToken = newStylesheetToken;
-    }
-    // Set the new styling token on the host element
-    if (!isUndefined$1(newToken)) {
-      if (hasScopedStyles) {
-        getClassList(elm).add(makeHostToken(newToken));
-        newHasTokenInClass = true;
-      }
-      if (isSyntheticShadow) {
-        setAttribute(elm, makeHostToken(newToken), '');
-        newHasTokenInAttribute = true;
-      }
-    }
-    // Update the styling tokens present on the context object.
-    if (legacy) {
-      context.legacyStylesheetToken = newToken;
-      context.hasLegacyTokenInClass = newHasTokenInClass;
-      context.hasLegacyTokenInAttribute = newHasTokenInAttribute;
-    } else {
-      context.stylesheetToken = newToken;
-      context.hasTokenInClass = newHasTokenInClass;
-      context.hasTokenInAttribute = newHasTokenInAttribute;
-    }
-  }
-  function evaluateStylesheetsContent(stylesheets, stylesheetToken, vm) {
-    const content = [];
-    let root;
-    for (let i = 0; i < stylesheets.length; i++) {
-      let stylesheet = stylesheets[i];
-      if (isArray$1(stylesheet)) {
-        ArrayPush$1.apply(content, evaluateStylesheetsContent(stylesheet, stylesheetToken, vm));
-      } else {
-        if (process.env.NODE_ENV !== 'production') {
-          // Check for compiler version mismatch in dev mode only
-          checkVersionMismatch(stylesheet, 'stylesheet');
-          // in dev-mode, we support hot swapping of stylesheet, which means that
-          // the component instance might be attempting to use an old version of
-          // the stylesheet, while internally, we have a replacement for it.
-          stylesheet = getStyleOrSwappedStyle(stylesheet);
-        }
-        const isScopedCss = stylesheet[KEY__SCOPED_CSS];
-        if (lwcRuntimeFlags.DISABLE_LIGHT_DOM_UNSCOPED_CSS && !isScopedCss && vm.renderMode === 0 /* RenderMode.Light */) {
-          logError('Unscoped CSS is not supported in Light DOM in this environment. Please use scoped CSS ' + '(*.scoped.css) instead of unscoped CSS (*.css). See also: https://sfdc.co/scoped-styles-light-dom');
-          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;
-        // Use the actual `:host` selector if we're rendering global CSS for light DOM, or if we're rendering
-        // native shadow DOM. Synthetic shadow DOM never uses `:host`.
-        const useActualHostSelector = vm.renderMode === 0 /* RenderMode.Light */ ? !isScopedCss : vm.shadowMode === 0 /* ShadowMode.Native */;
-        // Use the native :dir() pseudoclass only in native shadow DOM. Otherwise, in synthetic shadow,
-        // we use an attribute selector on the host to simulate :dir().
-        let useNativeDirPseudoclass;
-        if (vm.renderMode === 1 /* RenderMode.Shadow */) {
-          useNativeDirPseudoclass = vm.shadowMode === 0 /* ShadowMode.Native */;
-        } else {
-          // Light DOM components should only render `[dir]` if they're inside of a synthetic shadow root.
-          // At the top level (root is null) or inside of a native shadow root, they should use `:dir()`.
-          if (isUndefined$1(root)) {
-            // Only calculate the root once as necessary
-            root = getNearestShadowComponent(vm);
-          }
-          useNativeDirPseudoclass = isNull(root) || root.shadowMode === 0 /* ShadowMode.Native */;
-        }
-        ArrayPush$1.call(content, stylesheet(scopeToken, useActualHostSelector, useNativeDirPseudoclass));
+      shadowSupportMode = ctorShadowSupportMode;
+      if (isReportingEnabled() && (shadowSupportMode === "any" /* ShadowSupportMode.Any */ || shadowSupportMode === "native" /* ShadowSupportMode.Native */)) {
+        report("ShadowSupportModeUsage" /* ReportingEventId.ShadowSupportModeUsage */, {
+          tagName: Ctor.name,
+          mode: shadowSupportMode
+        });
       }
     }
-    return content;
+    let renderMode = superDef.renderMode;
+    if (!isUndefined$1(ctorRenderMode)) {
+      renderMode = ctorRenderMode === 'light' ? 0 /* RenderMode.Light */ : 1 /* RenderMode.Shadow */;
+    }
+    let formAssociated = superDef.formAssociated;
+    if (!isUndefined$1(ctorFormAssociated)) {
+      formAssociated = ctorFormAssociated;
+    }
+    const template = getComponentRegisteredTemplate(Ctor) || superDef.template;
+    const name = Ctor.name || superDef.name;
+    // installing observed fields into the prototype.
+    defineProperties(proto, observedFields);
+    const def = {
+      ctor: Ctor,
+      name,
+      wire,
+      props,
+      propsConfig,
+      methods,
+      bridge,
+      template,
+      renderMode,
+      shadowSupportMode,
+      formAssociated,
+      connectedCallback,
+      disconnectedCallback,
+      errorCallback,
+      formAssociatedCallback,
+      formDisabledCallback,
+      formResetCallback,
+      formStateRestoreCallback,
+      renderedCallback,
+      render
+    };
+    // This is a no-op unless Lightning DevTools are enabled.
+    instrumentDef(def);
+    if (process.env.NODE_ENV !== 'production') {
+      freeze(Ctor.prototype);
+    }
+    return def;
   }
-  function getStylesheetsContent(vm, template) {
-    const {
-      stylesheets,
-      stylesheetToken
-    } = template;
-    const {
-      stylesheets: vmStylesheets
-    } = vm;
-    let content = [];
-    if (hasStyles(stylesheets)) {
-      content = evaluateStylesheetsContent(stylesheets, stylesheetToken, vm);
+  /**
+   * EXPERIMENTAL: This function allows for the identification of LWC constructors. This API is
+   * subject to change or being removed.
+   * @param ctor
+   */
+  function isComponentConstructor(ctor) {
+    if (!isFunction$1(ctor)) {
+      return false;
     }
-    // VM (component) stylesheets apply after template stylesheets
-    if (hasStyles(vmStylesheets)) {
-      ArrayPush$1.apply(content, evaluateStylesheetsContent(vmStylesheets, stylesheetToken, vm));
+    // Fast path: LightningElement is part of the prototype chain of the constructor.
+    if (ctor.prototype instanceof LightningElement) {
+      return true;
     }
-    return content;
+    // Slow path: LightningElement is not part of the prototype chain of the constructor, we need
+    // climb up the constructor prototype chain to check in case there are circular dependencies
+    // to resolve.
+    let current = ctor;
+    do {
+      if (isCircularModuleDependency(current)) {
+        const circularResolved = resolveCircularModuleDependency(current);
+        // If the circular function returns itself, that's the signal that we have hit the end
+        // of the proto chain, which must always be a valid base constructor.
+        if (circularResolved === current) {
+          return true;
+        }
+        current = circularResolved;
+      }
+      if (current === LightningElement) {
+        return true;
+      }
+    } while (!isNull(current) && (current = getPrototypeOf$1(current)));
+    // Finally return false if the LightningElement is not part of the prototype chain.
+    return false;
   }
-  // It might be worth caching this to avoid doing the lookup repeatedly, but
-  // perf testing has not shown it to be a huge improvement yet:
-  // https://github.com/salesforce/lwc/pull/2460#discussion_r691208892
-  function getNearestShadowComponent(vm) {
-    let owner = vm;
-    while (!isNull(owner)) {
-      if (owner.renderMode === 1 /* RenderMode.Shadow */) {
-        return owner;
+  function getComponentInternalDef(Ctor) {
+    if (process.env.NODE_ENV !== 'production') {
+      Ctor = getComponentOrSwappedComponent(Ctor);
+    }
+    let def = CtorToDefMap.get(Ctor);
+    if (isUndefined$1(def)) {
+      if (isCircularModuleDependency(Ctor)) {
+        const resolvedCtor = resolveCircularModuleDependency(Ctor);
+        def = getComponentInternalDef(resolvedCtor);
+        // Cache the unresolved component ctor too. The next time if the same unresolved ctor is used,
+        // look up the definition in cache instead of re-resolving and recreating the def.
+        CtorToDefMap.set(Ctor, def);
+        return def;
       }
-      owner = owner.owner;
+      if (!isComponentConstructor(Ctor)) {
+        throw new TypeError(`${Ctor} is not a valid component, or does not extends LightningElement from "lwc". You probably forgot to add the extend clause on the class declaration.`);
+      }
+      def = createComponentDef(Ctor);
+      CtorToDefMap.set(Ctor, def);
     }
-    return owner;
+    return def;
   }
-  /**
-   * If the component that is currently being rendered uses scoped styles,
-   * this returns the unique token for that scoped stylesheet. Otherwise
-   * it returns null.
-   * @param owner
-   * @param legacy
-   */
-  // TODO [#3733]: remove support for legacy scope tokens
-  function getScopeTokenClass(owner, legacy) {
-    const {
-      cmpTemplate,
-      context
-    } = owner;
-    return context.hasScopedStyles && (legacy ? cmpTemplate?.legacyStylesheetToken : cmpTemplate?.stylesheetToken) || null;
+  function getComponentHtmlPrototype(Ctor) {
+    const def = getComponentInternalDef(Ctor);
+    return def.bridge;
   }
+  const lightingElementDef = {
+    ctor: LightningElement,
+    name: LightningElement.name,
+    props: lightningBasedDescriptors,
+    propsConfig: EmptyObject,
+    methods: EmptyObject,
+    renderMode: 1 /* RenderMode.Shadow */,
+    shadowSupportMode: "reset" /* ShadowSupportMode.Default */,
+    formAssociated: undefined,
+    wire: EmptyObject,
+    bridge: BaseBridgeElement,
+    template: defaultEmptyTemplate,
+    render: LightningElement.prototype.render
+  };
   /**
-   * This function returns the host style token for a custom element if it
-   * exists. Otherwise it returns null.
-   *
-   * A host style token is applied to the component if scoped styles are used.
-   * @param vnode
+   * EXPERIMENTAL: This function allows for the collection of internal component metadata. This API is
+   * subject to change or being removed.
+   * @param Ctor
    */
-  function getStylesheetTokenHost(vnode) {
-    const {
-      template
-    } = getComponentInternalDef(vnode.ctor);
-    const {
-      vm
-    } = vnode;
+  function getComponentDef(Ctor) {
+    const def = getComponentInternalDef(Ctor);
+    // From the internal def object, we need to extract the info that is useful
+    // for some external services, e.g.: Locker Service, usually, all they care
+    // is about the shape of the constructor, the internals of it are not relevant
+    // because they don't have a way to mess with that.
     const {
-      stylesheetToken
-    } = template;
-    return !isUndefined$1(stylesheetToken) && computeHasScopedStyles(template, vm) ? makeHostToken(stylesheetToken) : null;
-  }
-  function getNearestNativeShadowComponent(vm) {
-    const owner = getNearestShadowComponent(vm);
-    if (!isNull(owner) && owner.shadowMode === 1 /* ShadowMode.Synthetic */) {
-      // Synthetic-within-native is impossible. So if the nearest shadow component is
-      // synthetic, we know we won't find a native component if we go any further.
-      return null;
+      ctor,
+      name,
+      props,
+      propsConfig,
+      methods
+    } = def;
+    const publicProps = {};
+    for (const key in props) {
+      // avoid leaking the reference to the public props descriptors
+      publicProps[key] = {
+        config: propsConfig[key] || 0,
+        // a property by default
+        type: "any" /* PropDefType.any */,
+        // no type inference for public services
+        attr: htmlPropertyToAttribute(key)
+      };
     }
-    return owner;
-  }
-  function createStylesheet(vm, stylesheets) {
-    const {
-      renderMode,
-      shadowMode,
-      renderer: {
-        insertStylesheet
-      }
-    } = vm;
-    if (renderMode === 1 /* RenderMode.Shadow */ && shadowMode === 1 /* ShadowMode.Synthetic */) {
-      for (let i = 0; i < stylesheets.length; i++) {
-        insertStylesheet(stylesheets[i]);
-      }
-    } else if (vm.hydrated) {
-      // Note: We need to ensure that during hydration, the stylesheets method is the same as those in ssr.
-      //       This works in the client, because the stylesheets are created, and cached in the VM
-      //       the first time the VM renders.
-      // native shadow or light DOM, SSR
-      return ArrayMap.call(stylesheets, createInlineStyleVNode);
-    } else {
-      // native shadow or light DOM, DOM renderer
-      const root = getNearestNativeShadowComponent(vm);
-      // null root means a global style
-      const target = isNull(root) ? undefined : root.shadowRoot;
-      for (let i = 0; i < stylesheets.length; i++) {
-        insertStylesheet(stylesheets[i], target);
-      }
+    const publicMethods = {};
+    for (const key in methods) {
+      // avoid leaking the reference to the public method descriptors
+      publicMethods[key] = methods[key].value;
     }
-    return null;
+    return {
+      ctor,
+      name,
+      props: publicProps,
+      methods: publicMethods
+    };
   }
 
   /*
@@ -4810,7 +4897,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
   }
 
   /*
-   * Copyright (c) 2023, salesforce.com, inc.
+   * Copyright (c) 2024, Salesforce, 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
@@ -4836,34 +4923,59 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     for (const staticPart of parts) {
       partIdsToParts.set(staticPart.partId, staticPart);
     }
-    let numFoundParts = 0;
+    // Note that we traverse using `*Child`/`*Sibling` rather than `children` because the browser uses a linked
+    // list under the hood to represent the DOM tree, so it's faster to do this than to create an underlying array
+    // by calling `children`.
     const {
-      previousSibling,
-      getLastChild
+      nextSibling,
+      getFirstChild,
+      getParentNode
     } = renderer;
-    const stack = [root];
+    let numFoundParts = 0;
     let partId = -1;
+    // We should never traverse up to the root. We should exit early due to numFoundParts === numParts.
+    // This is just a sanity check, in case the static parts generated by @lwc/template-compiler are wrong.
+    function assertNotRoot(node) {
+      if (process.env.NODE_ENV !== 'production') {
+        assert.isFalse(node === root, `Reached the root without finding all parts. Found ${numFoundParts}, needed ${numParts}.`);
+      }
+    }
     // Depth-first traversal. We assign a partId to each element, which is an integer based on traversal order.
-    while (stack.length > 0) {
-      const elm = ArrayShift.call(stack);
+    // This function is very hot, which is why it's micro-optimized. Note we don't use a stack at all; we traverse
+    // using an algorithm that relies on the parentNode getter: https://stackoverflow.com/a/5285417
+    // This is very slightly faster than a TreeWalker (~0.5% on js-framework-benchmark create-10k), but basically
+    // the same idea.
+    let node = root;
+    while (!isNull(node)) {
+      // visit node
       partId++;
       const part = partIdsToParts.get(partId);
       if (!isUndefined$1(part)) {
-        part.elm = elm;
-        if (++numFoundParts === numParts) {
+        part.elm = node;
+        numFoundParts++;
+        if (numFoundParts === numParts) {
           return; // perf optimization - stop traversing once we've found everything we need
         }
       }
-      // For depth-first traversal, prepend to the stack in reverse order
-      // Note that we traverse using `*Child`/`*Sibling` rather than `children` because the browser uses a linked
-      // list under the hood to represent the DOM tree, so it's faster to do this than to create an underlying array
-      // by calling `children`.
-      let child = getLastChild(elm);
-      while (!isNull(child)) {
-        ArrayUnshift.call(stack, child);
-        child = previousSibling(child);
+      const child = getFirstChild(node);
+      if (!isNull(child)) {
+        // walk down
+        node = child;
+      } else {
+        let sibling;
+        while (isNull(sibling = nextSibling(node))) {
+          // we never want to walk up from the root
+          assertNotRoot(node);
+          // walk up
+          node = getParentNode(node);
+        }
+        // we never want to walk right from the root
+        assertNotRoot(node);
+        // walk right
+        node = sibling;
       }
     }
+    /* istanbul ignore next */
     if (process.env.NODE_ENV !== 'production') {
       assert.isTrue(numFoundParts === numParts, `Should have found all parts by now. Found ${numFoundParts}, needed ${numParts}.`);
     }
@@ -8726,7 +8838,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     }
     return getReadOnlyProxy(obj);
   }
-  /** version: 6.5.2 */
+  /** version: 6.6.1 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -8856,7 +8968,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     stylesheet.replaceSync(content);
     return stylesheet;
   }
-  function insertConstructableStylesheet(content, target, cacheData) {
+  function insertConstructableStylesheet(content, target, cacheData, signal) {
     const {
       adoptedStyleSheets
     } = target;
@@ -8865,10 +8977,32 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     } = cacheData;
     // The reason we prefer .push() rather than reassignment is for perf: https://github.com/salesforce/lwc/pull/2683
     adoptedStyleSheets.push(stylesheet);
+    if (process.env.NODE_ENV !== 'production') {
+      /* istanbul ignore if */
+      if (isUndefined$1(signal)) {
+        throw new Error('Expected AbortSignal to be defined in dev mode');
+      }
+      // TODO [#4155]: unrendering should account for stylesheet content collisions
+      signal.addEventListener('abort', () => {
+        adoptedStyleSheets.splice(adoptedStyleSheets.indexOf(stylesheet), 1);
+        stylesheetCache.delete(content);
+      });
+    }
   }
-  function insertStyleElement(content, target, cacheData) {
+  function insertStyleElement(content, target, cacheData, signal) {
     const elm = createStyleElement(content, cacheData);
     target.appendChild(elm);
+    if (process.env.NODE_ENV !== 'production') {
+      /* istanbul ignore if */
+      if (isUndefined$1(signal)) {
+        throw new Error('Expected AbortSignal to be defined in dev mode');
+      }
+      // TODO [#4155]: unrendering should account for stylesheet content collisions
+      signal.addEventListener('abort', () => {
+        target.removeChild(elm);
+        stylesheetCache.delete(content);
+      });
+    }
   }
   function getCacheData(content, useConstructableStylesheet) {
     let cacheData = stylesheetCache.get(content);
@@ -8890,7 +9024,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     }
     return cacheData;
   }
-  function insertGlobalStylesheet(content) {
+  function insertGlobalStylesheet(content, signal) {
     // Force a <style> element for global stylesheets. See comment below.
     const cacheData = getCacheData(content, false);
     if (cacheData.global) {
@@ -8899,9 +9033,9 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     }
     cacheData.global = true; // mark inserted
     // TODO [#2922]: use document.adoptedStyleSheets in supported browsers. Currently we can't, due to backwards compat.
-    insertStyleElement(content, document.head, cacheData);
+    insertStyleElement(content, document.head, cacheData, signal);
   }
-  function insertLocalStylesheet(content, target) {
+  function insertLocalStylesheet(content, target, signal) {
     const cacheData = getCacheData(content, supportsConstructableStylesheets);
     let {
       roots
@@ -8917,19 +9051,25 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     // https://caniuse.com/mdn-api_document_adoptedstylesheets
     // The reason we use it is for perf: https://github.com/salesforce/lwc/pull/2460
     if (supportsConstructableStylesheets) {
-      insertConstructableStylesheet(content, target, cacheData);
+      insertConstructableStylesheet(content, target, cacheData, signal);
     } else {
       // Fall back to <style> element
-      insertStyleElement(content, target, cacheData);
+      insertStyleElement(content, target, cacheData, signal);
     }
   }
-  function insertStylesheet(content, target) {
+  /**
+   * Injects a stylesheet into the global (document) level or inside a shadow root.
+   * @param content CSS content to insert
+   * @param target ShadowRoot to insert into, or undefined if global (document) level
+   * @param signal AbortSignal for aborting the stylesheet render. Used in dev mode for HMR to unrender stylesheets.
+   */
+  function insertStylesheet(content, target, signal) {
     if (isUndefined$1(target)) {
       // global
-      insertGlobalStylesheet(content);
+      insertGlobalStylesheet(content, signal);
     } else {
       // local
-      insertLocalStylesheet(content, target);
+      insertLocalStylesheet(content, target, signal);
     }
   }
 
@@ -8998,7 +9138,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
           runFormStateRestoreCallback(this, state, reason);
         }
       }
-      /*LWC compiler v6.5.2*/
+      /*LWC compiler v6.6.1*/
     };
     BaseHTMLElement = HTMLElement; // cache to track if it changes
   }
@@ -9013,7 +9153,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
     // Using a BaseUpgradableConstructor superclass here is a perf optimization to avoid
     // re-defining the same logic (connectedCallback, disconnectedCallback, etc.) over and over.
     class UpgradableConstructor extends BaseUpgradableConstructor {
-      /*LWC compiler v6.5.2*/
+      /*LWC compiler v6.6.1*/
     }
     if (isFormAssociated) {
       // Perf optimization - the vast majority of components have formAssociated=false,
@@ -9136,7 +9276,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
       function isNull(obj) {
         return obj === null;
       }
-      /** version: 6.5.2 */
+      /** version: 6.6.1 */
 
       /*
        * Copyright (c) 2023, salesforce.com, inc.
@@ -9156,7 +9296,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
           this.setNewContext = setNewContext;
           this.setDisconnectedCallback = setDisconnectedCallback;
         }
-        /*LWC compiler v6.5.2*/
+        /*LWC compiler v6.6.1*/
       }
       function registerContextConsumer(elm, adapterContextToken, subscriptionPayload) {
         dispatchEvent(elm, new WireContextSubscriptionEvent(adapterContextToken, subscriptionPayload));
@@ -9211,6 +9351,9 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
       function previousSibling(node) {
         return node.previousSibling;
       }
+      function getParentNode(node) {
+        return node.parentNode;
+      }
       function attachShadow(element, options) {
         // `shadowRoot` will be non-null in two cases:
         //   1. upon initial load with an SSR-generated DOM, while in Shadow render mode
@@ -9335,6 +9478,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
       exports.getFirstElementChild = getFirstElementChild;
       exports.getLastChild = getLastChild;
       exports.getLastElementChild = getLastElementChild;
+      exports.getParentNode = getParentNode;
       exports.getProperty = getProperty;
       exports.getTagName = getTagName;
       exports.insert = insert;
@@ -9566,7 +9710,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
       formStateRestoreCallback(state, reason) {
         runFormStateRestoreCallback(this, state, reason);
       }
-      /*LWC compiler v6.5.2*/
+      /*LWC compiler v6.6.1*/
     }, _a.observedAttributes = observedAttributes,
     // Note CustomElementConstructor is not upgraded by LWC and inherits directly from HTMLElement which means it calls the native
     // attachInternals API.
@@ -9630,9 +9774,6 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
       }
     });
   }
-  // For some reason, JSDOC says "options.is" is a syntax error. And we can't disable the rule using
-  // `eslint-disable-next-line` because that gets included in the JSDOC, so we need this workaround.
-  /* eslint-disable jsdoc/valid-types */
   /**
    * EXPERIMENTAL: This function is almost identical to document.createElement with the slightly
    * difference that in the options, you can pass the `is` property set to a Constructor instead of
@@ -9647,8 +9788,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
    * @example
    * const el = createElement('x-foo', { is: FooCtor });
    */
-  function createElement( /* eslint-enable jsdoc/valid-types */
-  sel, options) {
+  function createElement(sel, options) {
     if (!isObject(options) || isNull(options)) {
       throw new TypeError(`"createElement" function expects an object as second parameter but received "${toString$1(options)}".`);
     }
@@ -9799,7 +9939,7 @@ LWR.define('lwc/v/6_5_2', ['exports'], (function (exports) { 'use strict';
       });
     });
   }
-  /** version: 6.5.2 */
+  /** version: 6.6.1 */
 
   exports.LightningElement = LightningElement;
   exports.__unstable__ProfilerControl = profilerControl;