@lwrjs/everywhere 0.12.0-alpha.2 → 0.12.0-alpha.4

package/README.md

@@ -110,7 +110,7 @@ counter.properties = { count: 9 };
 
 ### Client-side Navigation
 
-If the embedded component uses the [LWR Client-side Router](https://github.com/salesforce-experience-platform-emu/lwr-recipes/blob/main/doc/navigation.md), turn on the `navigation` setting. Then you can navigate programmatically and subscribe to navigation events and errors. For example:
+If the embedded component uses the [LWR Client-side Router](../router/README.md), turn on the `navigation` setting. Then you can navigate programmatically and subscribe to navigation events and errors. For example:
 
 ```js
 import { createComponent } from 'https://lwr-server.com/resource/path/lwr-everywhere.js';

package/build/__generated_site_amd_modules__/1/application/amd/l/en-US/ai/amd-bootstrap/configuration/ci/-/-/s/1acd458a2d969105f87cecce5be6675c/config.js

@@ -0,0 +1,11 @@
+/* This script is generated */
+/* Client Bootstrap configuration */
+globalThis.LWR = globalThis.LWR || {};
+Object.assign(globalThis.LWR, {"appId":"amd-bootstrap","bootstrapModule":"@lwrjs/app-service/amd-bootstrap/module/amd/v/0_12_0-alpha_4","autoBoot":true,"imports":{"/1/module/amd/1/l/en-US/mi/%40lwrjs%2Fapp-service%2Famd-bootstrap%2Fmodule%2Famd%2Fv%2F0_12_0-alpha_4/s/8bce578258518655194bd71d1d72aad5/@lwrjs_app-service_amd-bootstrap_module_amd.js":["@lwrjs/app-service/amd-bootstrap/module/amd/v/0_12_0-alpha_4"],"/1/module/amd/1/l/en-US/mi/lwr%2FpreInit%2Fv%2F0_12_0-alpha_4/s/f3a204ef43fb3057d910f80d7e9f9ba7/lwr_preInit.js":["lwr/preInit/v/0_12_0-alpha_4"],"/1/module/amd/1/l/en-US/mi/lwr%2Finit%2Fv%2F0_12_0-alpha_4/s/f30361ad8ff7af505bf4d465c8499181/lwr_init.js":["lwr/init/v/0_12_0-alpha_4"],"/1/module/amd/1/l/en-US/mi/lwr%2Fmetrics%2Fv%2F0_12_0-alpha_4/s/274c8343f810353bbad085a79709395f/lwr_metrics.js":["lwr/metrics/v/0_12_0-alpha_4"],"/1/module/amd/1/l/en-US/mi/lwr%2Fprofiler%2Fv%2F0_12_0-alpha_4/s/a152b8d35f12ca1b5147c5cd1ee155fb/lwr_profiler.js":["lwr/profiler/v/0_12_0-alpha_4"],"/1/module/amd/1/l/en-US/mi/lwc%2Fv%2F5_3_0/s/d6928cae62ba4c18e61fa9c234830c2a/lwc.js":["lwc/v/5_3_0"],"/1/module/amd/1/l/en-US/mi/lwr%2FeverywhereAmd%2Fv%2F0_12_0-alpha_4/s/cb931ebef2b89dcf8ab51456e3a68864/lwr_everywhereAmd.js":["lwr/everywhereAmd/v/0_12_0-alpha_4"],"/1/module/amd/1/l/en-US/mi/lwr%2Fvault%2Fv%2F0_12_0-alpha_4/s/c92abd8c1fec2d7eff62e4b097abbe14/lwr_vault.js":["lwr/vault/v/0_12_0-alpha_4"]},"index":{"@lwrjs/app-service/amd-bootstrap/module/amd/v/0_12_0-alpha_4":"/1/module/amd/1/l/en-US/mi/%40lwrjs%2Fapp-service%2Famd-bootstrap%2Fmodule%2Famd%2Fv%2F0_12_0-alpha_4/s/8bce578258518655194bd71d1d72aad5/@lwrjs_app-service_amd-bootstrap_module_amd.js","lwr/preInit/v/0_12_0-alpha_4":"/1/module/amd/1/l/en-US/mi/lwr%2FpreInit%2Fv%2F0_12_0-alpha_4/s/f3a204ef43fb3057d910f80d7e9f9ba7/lwr_preInit.js","lwr/init/v/0_12_0-alpha_4":"/1/module/amd/1/l/en-US/mi/lwr%2Finit%2Fv%2F0_12_0-alpha_4/s/f30361ad8ff7af505bf4d465c8499181/lwr_init.js","lwr/metrics/v/0_12_0-alpha_4":"/1/module/amd/1/l/en-US/mi/lwr%2Fmetrics%2Fv%2F0_12_0-alpha_4/s/274c8343f810353bbad085a79709395f/lwr_metrics.js","lwr/profiler/v/0_12_0-alpha_4":"/1/module/amd/1/l/en-US/mi/lwr%2Fprofiler%2Fv%2F0_12_0-alpha_4/s/a152b8d35f12ca1b5147c5cd1ee155fb/lwr_profiler.js","lwc/v/5_3_0":"/1/module/amd/1/l/en-US/mi/lwc%2Fv%2F5_3_0/s/d6928cae62ba4c18e61fa9c234830c2a/lwc.js","lwr/everywhereAmd/v/0_12_0-alpha_4":"/1/module/amd/1/l/en-US/mi/lwr%2FeverywhereAmd%2Fv%2F0_12_0-alpha_4/s/cb931ebef2b89dcf8ab51456e3a68864/lwr_everywhereAmd.js","lwr/vault/v/0_12_0-alpha_4":"/1/module/amd/1/l/en-US/mi/lwr%2Fvault%2Fv%2F0_12_0-alpha_4/s/c92abd8c1fec2d7eff62e4b097abbe14/lwr_vault.js"},"rootComponents":["lwr/everywhereAmd/v/0_12_0-alpha_4"],"serverData":{},"requiredModules":["@lwrjs/app-service/amd-bootstrap/module/amd/v/0_12_0-alpha_4"],"preloadModules":["lwr/preInit/v/0_12_0-alpha_4","lwr/init/v/0_12_0-alpha_4","lwr/metrics/v/0_12_0-alpha_4","lwc/v/5_3_0","lwr/everywhereAmd/v/0_12_0-alpha_4"],"endpoints":{"uris":{"mapping":"/1/mapping/amd/1/l/en-US/mp/"}}});
+globalThis.process = { env: {"NODE_ENV":"compat","SSR":false,"basePath":"","locale":"en-US","assetBasePath":"","uiBasePath":""} };
+globalThis.lwcRuntimeFlags = { ENABLE_MIXED_SHADOW_MODE: false };
+// Appended by Static Site Generator
+if (!globalThis.LWR.imports) { globalThis.LWR.imports = {}; }
+Object.assign(globalThis.LWR.imports, {"/1/module/amd/1/l/en-US/mi/lwr%2Floader%2Fv%2F0_12_0-alpha_4/s/5c5d9084a8557502d4eed0d5788db05d/lwr_loader.js":["lwr/loader/v/0_12_0-alpha_4"]})
+if (!globalThis.LWR.index) { globalThis.LWR.index = {}; }
+Object.assign(globalThis.LWR.index, {"lwr/loader/v/0_12_0-alpha_4":"/1/module/amd/1/l/en-US/mi/lwr%2Floader%2Fv%2F0_12_0-alpha_4/s/5c5d9084a8557502d4eed0d5788db05d/lwr_loader.js"})

package/build/__generated_site_amd_modules__/1/module/amd/1/l/en-US/mi/@lwrjs/app-service/amd-bootstrap/module/amd/v/0_12_0-alpha_4/s/8bce578258518655194bd71d1d72aad5/@lwrjs_app-service_amd-bootstrap_module_amd.js

@@ -0,0 +1,14 @@
+LWR.define('@lwrjs/app-service/amd-bootstrap/module/amd/v/0_12_0-alpha_4', ['lwr/loader/v/0_12_0-alpha_4', 'lwr/preInit/v/0_12_0-alpha_4', 'lwr/init/v/0_12_0-alpha_4'], (function (_0_12_0Alpha_4$2, _0_12_0Alpha_4, _0_12_0Alpha_4$1) { 'use strict';
+
+    const clientBootstrapConfig = _0_12_0Alpha_4.getClientBootstrapConfig();
+
+    // initialize additional non-configured root components
+    const { rootComponents, serverData } = clientBootstrapConfig;
+    Promise.all(rootComponents.map(async (rootSpecifier) => {
+        const element = _0_12_0Alpha_4$1.toKebabCase(rootSpecifier);
+        return _0_12_0Alpha_4$2.load(rootSpecifier, '@lwrjs/app-service/amd-bootstrap/module/amd/v/0_12_0-alpha_4').then(({default: Ctor}) => {
+            _0_12_0Alpha_4$1.init([[element, Ctor]], serverData);
+        });
+    }));
+
+}));

package/build/__generated_site_amd_modules__/1/module/amd/1/l/en-US/mi/lwc/v/{5_1_0/s/aff256c8afef6eb76ff8626ad5f54e3b → 5_3_0/s/d6928cae62ba4c18e61fa9c234830c2a}/lwc.js

@@ -1,4 +1,4 @@
-LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
+LWR.define('lwc/v/5_3_0', ['exports'], (function (exports) { 'use strict';
 
   /**
    * Copyright (C) 2023 salesforce.com, inc.
@@ -316,9 +316,9 @@ LWR.define('lwc/v/5_1_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 = "5.1.0";
+  const LWC_VERSION = "5.3.0";
   const LWC_VERSION_COMMENT_REGEX = /\/\*LWC compiler v([\d.]+)\*\/\s*}/;
-  /** version: 5.1.0 */
+  /** version: 5.3.0 */
 
   /**
    * Copyright (C) 2023 salesforce.com, inc.
@@ -340,7 +340,8 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
     ENABLE_WIRE_SYNC_EMIT: null,
     DISABLE_LIGHT_DOM_UNSCOPED_CSS: null,
     ENABLE_FROZEN_TEMPLATE: null,
-    ENABLE_LEGACY_SCOPE_TOKENS: null
+    ENABLE_LEGACY_SCOPE_TOKENS: null,
+    ENABLE_FORCE_SHADOW_MIGRATE_MODE: null
   };
   // eslint-disable-next-line no-restricted-properties
   if (!_globalThis.lwcRuntimeFlags) {
@@ -397,7 +398,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       setFeatureFlag(name, value);
     }
   }
-  /** version: 5.1.0 */
+  /** version: 5.3.0 */
 
   /**
    * Copyright (C) 2023 salesforce.com, inc.
@@ -797,53 +798,52 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
   const instrumentInstance = (_b = _globalThis.__lwc_instrument_cmp_instance) !== null && _b !== void 0 ? _b : noop;
 
   /*
-   * 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
    */
-  // Apply ARIA string reflection behavior to a prototype.
-  // This is deliberately kept separate from @lwc/aria-reflection. @lwc/aria-reflection is a global polyfill that is
-  // needed for backwards compatibility in LEX, whereas `applyAriaReflection` is designed to only apply to our own
-  // LightningElement/BaseBridgeElement prototypes.
-  function applyAriaReflection(prototype) {
-    for (const propName of keys(AriaPropNameToAttrNameMap)) {
-      const attrName = AriaPropNameToAttrNameMap[propName];
-      if (isUndefined$1(getOwnPropertyDescriptor$1(prototype, propName))) {
-        // Note that we need to call this.{get,set,has,remove}Attribute rather than dereferencing
-        // from Element.prototype, because these methods are overridden in LightningElement.
-        defineProperty(prototype, propName, {
-          get() {
-            return this.getAttribute(attrName);
-          },
-          set(newValue) {
-            // TODO [#3284]: there is disagreement between browsers and the spec on how to treat undefined
-            // Our historical behavior is to only treat null as removing the attribute
-            // See also https://github.com/w3c/aria/issues/1858
-            if (isNull(newValue)) {
-              this.removeAttribute(attrName);
-            } else {
-              this.setAttribute(attrName, newValue);
-            }
-          },
-          // configurable and enumerable to allow it to be overridden – this mimics Safari's/Chrome's behavior
-          configurable: true,
-          enumerable: true
-        });
-      }
-    }
-  }
+  // This is a temporary workaround to get the @lwc/engine-server to evaluate in node without having
+  // to inject at runtime.
+  const HTMLElementConstructor = typeof HTMLElement !== 'undefined' ? HTMLElement : function () {};
+  const HTMLElementPrototype = HTMLElementConstructor.prototype;
 
   /*
-   * 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
    */
-  // This is a temporary workaround to get the @lwc/engine-server to evaluate in node without having
-  // to inject at runtime.
-  const HTMLElementConstructor = typeof HTMLElement !== 'undefined' ? HTMLElement : function () {};
-  const HTMLElementPrototype = HTMLElementConstructor.prototype;
+  // Apply ARIA string reflection behavior to a prototype.
+  // This is deliberately kept separate from @lwc/aria-reflection. @lwc/aria-reflection is a global polyfill that is
+  // needed for backwards compatibility in LEX, whereas this is designed to only apply to our own
+  // LightningElement/BaseBridgeElement prototypes.
+  // Note we only need to handle ARIA reflections that aren't already in Element.prototype
+  const ariaReflectionPolyfillDescriptors = create(null);
+  for (const [propName, attrName] of entries(AriaPropNameToAttrNameMap)) {
+    if (isUndefined$1(getPropertyDescriptor(HTMLElementPrototype, propName))) {
+      // Note that we need to call this.{get,set,has,remove}Attribute rather than dereferencing
+      // from Element.prototype, because these methods are overridden in LightningElement.
+      ariaReflectionPolyfillDescriptors[propName] = {
+        get() {
+          return this.getAttribute(attrName);
+        },
+        set(newValue) {
+          // TODO [#3284]: there is disagreement between browsers and the spec on how to treat undefined
+          // Our historical behavior is to only treat null as removing the attribute
+          // See also https://github.com/w3c/aria/issues/1858
+          if (isNull(newValue)) {
+            this.removeAttribute(attrName);
+          } else {
+            this.setAttribute(attrName, newValue);
+          }
+        },
+        // configurable and enumerable to allow it to be overridden – this mimics Safari's/Chrome's behavior
+        configurable: true,
+        enumerable: true
+      };
+    }
+  }
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -1504,7 +1504,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       valueMutated(originalTarget, key);
       return true;
     }
-    /*LWC compiler v5.1.0*/
+    /*LWC compiler v5.3.0*/
   }
   const getterMap = new WeakMap();
   const setterMap = new WeakMap();
@@ -1597,7 +1597,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       /* istanbul ignore next */
       return false;
     }
-    /*LWC compiler v5.1.0*/
+    /*LWC compiler v5.3.0*/
   }
   function extract(objectOrArray) {
     if (isArray(objectOrArray)) {
@@ -1805,6 +1805,77 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
     }
   }
 
+  /*
+   * 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
+   */
+  let globalStylesheet;
+  function isStyleElement(elm) {
+    return elm.tagName === 'STYLE';
+  }
+  async function fetchStylesheet(elm) {
+    if (isStyleElement(elm)) {
+      return elm.textContent;
+    } else {
+      // <link>
+      const {
+        href
+      } = elm;
+      try {
+        return await (await fetch(href)).text();
+      } catch (err) {
+        logWarnOnce(`Ignoring cross-origin stylesheet in migrate mode: ${href}`);
+        // ignore errors with cross-origin stylesheets - nothing we can do for those
+        return '';
+      }
+    }
+  }
+  function initGlobalStylesheet() {
+    const stylesheet = new CSSStyleSheet();
+    const elmsToPromises = new Map();
+    let lastSeenLength = 0;
+    const copyToGlobalStylesheet = () => {
+      const elms = document.head.querySelectorAll('style:not([data-rendered-by-lwc]),link[rel="stylesheet"]');
+      if (elms.length === lastSeenLength) {
+        return; // nothing to update
+      }
+      lastSeenLength = elms.length;
+      const promises = [...elms].map(elm => {
+        let promise = elmsToPromises.get(elm);
+        if (!promise) {
+          // Cache the promise
+          promise = fetchStylesheet(elm);
+          elmsToPromises.set(elm, promise);
+        }
+        return promise;
+      });
+      Promise.all(promises).then(stylesheetTexts => {
+        // When replaceSync() is called, the entire contents of the constructable stylesheet are replaced
+        // with the copied+concatenated styles. This means that any shadow root's adoptedStyleSheets that
+        // contains this constructable stylesheet will immediately get the new styles.
+        stylesheet.replaceSync(stylesheetTexts.join('\n'));
+      });
+    };
+    const headObserver = new MutationObserver(copyToGlobalStylesheet);
+    // By observing only the childList, note that we are not covering the case where someone changes an `href`
+    // on an existing <link>`, or the textContent on an existing `<style>`. This is assumed to be an uncommon
+    // case and not worth covering.
+    headObserver.observe(document.head, {
+      childList: true
+    });
+    copyToGlobalStylesheet();
+    return stylesheet;
+  }
+  function applyShadowMigrateMode(shadowRoot) {
+    if (!globalStylesheet) {
+      globalStylesheet = initGlobalStylesheet();
+    }
+    shadowRoot.synthetic = true; // pretend to be synthetic mode
+    shadowRoot.adoptedStyleSheets.push(globalStylesheet);
+  }
+
   /*
    * Copyright (c) 2018, salesforce.com, inc.
    * All rights reserved.
@@ -1957,6 +2028,9 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
     if (process.env.NODE_ENV !== 'production') {
       patchShadowRootWithRestrictions(shadowRoot);
     }
+    if (lwcRuntimeFlags.ENABLE_FORCE_SHADOW_MIGRATE_MODE && vm.shadowMigrateMode) {
+      applyShadowMigrateMode(shadowRoot);
+    }
     return shadowRoot;
   }
   function warnIfInvokedDuringConstruction(vm, methodOrPropName) {
@@ -2387,11 +2461,17 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
   for (const propName in HTMLElementOriginalDescriptors) {
     lightningBasedDescriptors[propName] = createBridgeToElementDescriptor(propName, HTMLElementOriginalDescriptors[propName]);
   }
-  defineProperties(LightningElement.prototype, lightningBasedDescriptors);
   // Apply ARIA reflection to LightningElement.prototype, on both the browser and server.
   // This allows `this.aria*` property accessors to work from inside a component, and to reflect `aria-*` attrs.
   // Note this works regardless of whether the global ARIA reflection polyfill is applied or not.
-  applyAriaReflection(LightningElement.prototype);
+  {
+    // In the browser, we use createBridgeToElementDescriptor, so we can get the normal reactivity lifecycle for
+    // aria* properties
+    for (const [propName, descriptor] of entries(ariaReflectionPolyfillDescriptors)) {
+      lightningBasedDescriptors[propName] = createBridgeToElementDescriptor(propName, descriptor);
+    }
+  }
+  defineProperties(LightningElement.prototype, lightningBasedDescriptors);
   defineProperty(LightningElement, 'CustomElementConstructor', {
     get() {
       // If required, a runtime-specific implementation must be defined.
@@ -3272,7 +3352,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
   }
   function HTMLBridgeElementFactory(SuperClass, publicProperties, methods, observedFields, proto, hasCustomSuperClass) {
     const HTMLBridgeElement = class extends SuperClass {
-      /*LWC compiler v5.1.0*/
+      /*LWC compiler v5.3.0*/
     };
     // generating the hash table for attributes to avoid duplicate fields and facilitate validation
     // and false positives in case of inheritance.
@@ -3297,7 +3377,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
         // and can break tooling that expects it to be iterable or defined, e.g. Jest:
         // https://github.com/jestjs/jest/blob/b4c9587/packages/pretty-format/src/plugins/DOMElement.ts#L95
         // It also doesn't make sense to override e.g. "constructor".
-        .filter(propName => !(propName in HTMLElementPrototype)));
+        .filter(propName => !(propName in HTMLElementPrototype) && !(propName in ariaReflectionPolyfillDescriptors)));
         for (const propName of nonPublicPropertiesToWarnOn) {
           if (ArrayIndexOf.call(publicProperties, propName) === -1) {
             descriptors[propName] = createAccessorThatWarns(propName);
@@ -3367,21 +3447,19 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
     defineProperties(HTMLBridgeElement.prototype, descriptors);
     return HTMLBridgeElement;
   }
-  const BaseBridgeElement = HTMLBridgeElementFactory(HTMLElementConstructor, getOwnPropertyNames$1(HTMLElementOriginalDescriptors), [], [], null, false);
-  {
-    // This ARIA reflection only really makes sense in the browser. On the server, there is no `renderedCallback()`,
-    // so you cannot do e.g. `this.template.querySelector('x-child').ariaBusy = 'true'`. So we don't need to expose
-    // ARIA props outside the LightningElement
-    //
-    // Apply ARIA reflection to HTMLBridgeElement.prototype. This allows `elm.aria*` property accessors to work from
-    // outside a component, and to reflect `aria-*` attrs. This is especially important because the template compiler
-    // compiles aria-* attrs on components to aria* props.
-    // Note this works regardless of whether the global ARIA reflection polyfill is applied or not.
-    //
-    // Also note that we apply this to BaseBridgeElement.prototype to avoid excessively redefining property
-    // accessors inside the HTMLBridgeElementFactory.
-    applyAriaReflection(BaseBridgeElement.prototype);
-  }
+  // We do some special handling of non-standard ARIA props like ariaLabelledBy as well as props without (as of this
+  // writing) broad cross-browser support like ariaBrailleLabel. This is so the reflection works correctly and preserves
+  // backwards compatibility with the previous global polyfill approach.
+  //
+  // The goal here is to expose `elm.aria*` property accessors to work from outside a component, and to reflect `aria-*`
+  // attrs. This is especially important because the template compiler compiles aria-* attrs on components to aria* props.
+  // Note this works regardless of whether the global ARIA reflection polyfill is applied or not.
+  //
+  // Also note this ARIA reflection only really makes sense in the browser. On the server, there is no
+  // `renderedCallback()`, so you cannot do e.g. `this.template.querySelector('x-child').ariaBusy = 'true'`. So we don't
+  // need to expose ARIA props outside the LightningElement
+  const basePublicProperties = [...getOwnPropertyNames$1(HTMLElementOriginalDescriptors), ...getOwnPropertyNames$1(ariaReflectionPolyfillDescriptors)];
+  const BaseBridgeElement = HTMLBridgeElementFactory(HTMLElementConstructor, basePublicProperties, [], [], null, false);
   freeze(BaseBridgeElement);
   seal(BaseBridgeElement.prototype);
 
@@ -3863,7 +3941,9 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       // 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)
       };
     }
@@ -3893,6 +3973,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
   function createInlineStyleVNode(content) {
     return api.h('style', {
       key: 'style',
+      // special key
       attrs: {
         type: 'text/css'
       }
@@ -5603,6 +5684,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       ctor: Ctor,
       owner: vmBeingRendered,
       mode: 'open',
+      // TODO [#1294]: this should be defined in Ctor
       aChildren,
       vm
     };
@@ -6545,6 +6627,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       // Properties set right after VM creation.
       tro: null,
       shadowMode: null,
+      shadowMigrateMode: false,
       stylesheets: null,
       // Properties set by the LightningElement constructor.
       component: null,
@@ -6560,8 +6643,21 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       vm.debugInfo = create(null);
     }
     vm.stylesheets = computeStylesheets(vm, def.ctor);
-    vm.shadowMode = computeShadowMode(def, vm.owner, renderer);
+    const computedShadowMode = computeShadowMode(def, vm.owner, renderer);
+    if (lwcRuntimeFlags.ENABLE_FORCE_SHADOW_MIGRATE_MODE) {
+      vm.shadowMode = 0 /* ShadowMode.Native */;
+      vm.shadowMigrateMode = computedShadowMode === 1 /* ShadowMode.Synthetic */;
+    } else {
+      vm.shadowMode = computedShadowMode;
+    }
     vm.tro = getTemplateReactiveObserver(vm);
+    // We don't need to report the shadow mode if we're rendering in light DOM
+    if (isReportingEnabled() && vm.renderMode === 1 /* RenderMode.Shadow */) {
+      report("ShadowModeUsage" /* ReportingEventId.ShadowModeUsage */, {
+        tagName: vm.tagName,
+        mode: vm.shadowMode
+      });
+    }
     if (process.env.NODE_ENV !== 'production') {
       vm.toString = () => {
         return `[object:vm ${def.name} (${vm.idx})]`;
@@ -6651,7 +6747,8 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       isSyntheticShadowDefined
     } = renderer;
     let shadowMode;
-    if (isSyntheticShadowDefined) {
+    // If ENABLE_FORCE_SHADOW_MIGRATE_MODE is true, then ShadowMode.Synthetic here will mean "force-migrate" mode.
+    if (isSyntheticShadowDefined || lwcRuntimeFlags.ENABLE_FORCE_SHADOW_MIGRATE_MODE) {
       if (def.renderMode === 0 /* RenderMode.Light */) {
         // ShadowMode.Native implies "not synthetic shadow" which is consistent with how
         // everything defaults to native when the synthetic shadow polyfill is unavailable.
@@ -8139,7 +8236,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
     }
     return getReadOnlyProxy(obj);
   }
-  /** version: 5.1.0 */
+  /** version: 5.3.0 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -8246,6 +8343,8 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
     const elm = document.createElement('style');
     elm.type = 'text/css';
     elm.textContent = content;
+    // Add an attribute to distinguish global styles added by LWC as opposed to other frameworks/libraries on the page
+    elm.setAttribute('data-rendered-by-lwc', '');
     return elm;
   }
   function createStyleElement(content, cacheData) {
@@ -8386,7 +8485,7 @@ LWR.define('lwc/v/5_1_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 v5.1.0*/
+      /*LWC compiler v5.3.0*/
     }
     UpgradableConstructor.formAssociated = true;
     // Do not unnecessarily add a connectedCallback/disconnectedCallback/etc., as it introduces perf overhead
@@ -8482,7 +8581,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       function isNull(obj) {
         return obj === null;
       }
-      /** version: 5.1.0 */
+      /** version: 5.3.0 */
 
       /*
        * Copyright (c) 2023, salesforce.com, inc.
@@ -8502,7 +8601,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
           this.setNewContext = setNewContext;
           this.setDisconnectedCallback = setDisconnectedCallback;
         }
-        /*LWC compiler v5.1.0*/
+        /*LWC compiler v5.3.0*/
       }
       function registerContextConsumer(elm, adapterContextToken, subscriptionPayload) {
         dispatchEvent(elm, new WireContextSubscriptionEvent(adapterContextToken, subscriptionPayload));
@@ -8882,7 +8981,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       attributeChangedCallback(name, oldValue, newValue) {
         attributeChangedCallback.call(this, name, oldValue, newValue);
       }
-      /*LWC compiler v5.1.0*/
+      /*LWC compiler v5.3.0*/
     }, _a.observedAttributes = observedAttributes, _a;
   }
 
@@ -9085,7 +9184,7 @@ LWR.define('lwc/v/5_1_0', ['exports'], (function (exports) { 'use strict';
       });
     });
   }
-  /** version: 5.1.0 */
+  /** version: 5.3.0 */
 
   exports.LightningElement = LightningElement;
   exports.__unstable__ProfilerControl = profilerControl;

package/build/__generated_site_amd_modules__/1/module/amd/1/l/en-US/mi/lwr/everywhereAmd/v/{0_12_0-alpha_2 → 0_12_0-alpha_4}/s/cb931ebef2b89dcf8ab51456e3a68864/lwr_everywhereAmd.js

@@ -1,10 +1,10 @@
-LWR.define('lwr/everywhereAmd/v/0_12_0-alpha_2', ['exports', 'lwr/vault/v/0_12_0-alpha_2'], (function (exports, _0_12_0Alpha_2) { 'use strict';
+LWR.define('lwr/everywhereAmd/v/0_12_0-alpha_4', ['exports', 'lwr/vault/v/0_12_0-alpha_4'], (function (exports, _0_12_0Alpha_4) { 'use strict';
 
   // IMPORTANT: Do not add any static imports to this file that are not bundled with the amd-client
 
   // Do an OAuthed fetch
   async function authFetch(url, accept = 'javascript') {
-    const authInfo = _0_12_0Alpha_2.getAuthInfo();
+    const authInfo = _0_12_0Alpha_4.getAuthInfo();
     if (authInfo) {
       return fetch(url, {
         headers: {
@@ -53,7 +53,7 @@ LWR.define('lwr/everywhereAmd/v/0_12_0-alpha_2', ['exports', 'lwr/vault/v/0_12_0
   function authenticate(authInfo) {
     // Put OAuth info into the vault
     if (authInfo) {
-      _0_12_0Alpha_2.setAuthInfo(authInfo);
+      _0_12_0Alpha_4.setAuthInfo(authInfo);
     }
   }
 

package/build/__generated_site_amd_modules__/1/module/amd/1/l/en-US/mi/lwr/init/v/{0_12_0-alpha_2 → 0_12_0-alpha_4}/s/f30361ad8ff7af505bf4d465c8499181/lwr_init.js

@@ -1,16 +1,16 @@
-LWR.define('lwr/init/v/0_12_0-alpha_2', ['exports', 'lwr/metrics/v/0_12_0-alpha_2', 'lwr/profiler/v/0_12_0-alpha_2', 'lwc/v/5_1_0'], (function (exports, _0_12_0Alpha_2$1, _0_12_0Alpha_2, _5_1_0) { 'use strict';
+LWR.define('lwr/init/v/0_12_0-alpha_4', ['exports', 'lwr/metrics/v/0_12_0-alpha_4', 'lwr/profiler/v/0_12_0-alpha_4', 'lwc/v/5_3_0'], (function (exports, _0_12_0Alpha_4$1, _0_12_0Alpha_4, _5_3_0) { 'use strict';
 
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 
   // <hydrateComponentProxy> - This code is removed in core
 
   function hydrateComponentProxy(customElement, Ctor, props) {
-    _5_1_0.hydrateComponent(customElement, Ctor, props);
+    _5_3_0.hydrateComponent(customElement, Ctor, props);
   }
   // </hydrateComponentProxy>
 
   function initializeWebComponent(elementName, Ctor) {
-    return _5_1_0.createElement(elementName, {
+    return _5_3_0.createElement(elementName, {
       is: Ctor
     });
   }
@@ -47,13 +47,13 @@ LWR.define('lwr/init/v/0_12_0-alpha_2', ['exports', 'lwr/metrics/v/0_12_0-alpha_
    */
   function init(rootModules, serverData = {}) {
     if (typeof customElements === 'undefined' || typeof document === 'undefined') {
-      _0_12_0Alpha_2.logOperationStart({
-        id: _0_12_0Alpha_2$1.BOOTSTRAP_END
+      _0_12_0Alpha_4.logOperationStart({
+        id: _0_12_0Alpha_4$1.BOOTSTRAP_END
       });
       return;
     }
-    _0_12_0Alpha_2.logOperationStart({
-      id: _0_12_0Alpha_2$1.INIT
+    _0_12_0Alpha_4.logOperationStart({
+      id: _0_12_0Alpha_4$1.INIT
     });
     let index = 0;
     for (const [specifier, ctor] of rootModules) {
@@ -61,8 +61,8 @@ LWR.define('lwr/init/v/0_12_0-alpha_2', ['exports', 'lwr/metrics/v/0_12_0-alpha_
 
       // initialize and inject the root module into the LWR Root or DOM if it is missing
       if (!document.body.querySelector(elementName)) {
-        _0_12_0Alpha_2.logOperationStart({
-          id: _0_12_0Alpha_2$1.INIT_MODULE,
+        _0_12_0Alpha_4.logOperationStart({
+          id: _0_12_0Alpha_4$1.INIT_MODULE,
           specifier,
           specifierIndex: ++index
         });
@@ -71,8 +71,8 @@ LWR.define('lwr/init/v/0_12_0-alpha_2', ['exports', 'lwr/metrics/v/0_12_0-alpha_
         const component = initializeWebComponent(elementName, ctor);
         const container = document.querySelector('[lwr-root]');
         container ? container.appendChild(component) : document.body.appendChild(component);
-        _0_12_0Alpha_2.logOperationEnd({
-          id: _0_12_0Alpha_2$1.INIT_MODULE,
+        _0_12_0Alpha_4.logOperationEnd({
+          id: _0_12_0Alpha_4$1.INIT_MODULE,
           specifier,
           specifierIndex: index,
           metadata: {
@@ -85,8 +85,8 @@ LWR.define('lwr/init/v/0_12_0-alpha_2', ['exports', 'lwr/metrics/v/0_12_0-alpha_
       // the page has been rendered or SSR'd, and each component needs to initialized(or hydrated)
       const elements = document.querySelectorAll(elementName);
       for (const element of elements) {
-        _0_12_0Alpha_2.logOperationStart({
-          id: _0_12_0Alpha_2$1.INIT_MODULE,
+        _0_12_0Alpha_4.logOperationStart({
+          id: _0_12_0Alpha_4$1.INIT_MODULE,
           specifier,
           specifierIndex: ++index
         });
@@ -97,8 +97,8 @@ LWR.define('lwr/init/v/0_12_0-alpha_2', ['exports', 'lwr/metrics/v/0_12_0-alpha_
           // eslint-disable-next-line @typescript-eslint/ban-ts-comment
           // @ts-ignore
           hydrateComponentProxy(element, ctor, serverData[propsId] || {});
-          _0_12_0Alpha_2.logOperationEnd({
-            id: _0_12_0Alpha_2$1.INIT_MODULE,
+          _0_12_0Alpha_4.logOperationEnd({
+            id: _0_12_0Alpha_4$1.INIT_MODULE,
             specifier,
             specifierIndex: index,
             metadata: {
@@ -136,8 +136,8 @@ LWR.define('lwr/init/v/0_12_0-alpha_2', ['exports', 'lwr/metrics/v/0_12_0-alpha_
         if (parent) {
           parent.replaceChild(component, element);
         }
-        _0_12_0Alpha_2.logOperationEnd({
-          id: _0_12_0Alpha_2$1.INIT_MODULE,
+        _0_12_0Alpha_4.logOperationEnd({
+          id: _0_12_0Alpha_4$1.INIT_MODULE,
           specifier,
           specifierIndex: index,
           metadata: {
@@ -146,11 +146,11 @@ LWR.define('lwr/init/v/0_12_0-alpha_2', ['exports', 'lwr/metrics/v/0_12_0-alpha_
         });
       }
     }
-    _0_12_0Alpha_2.logOperationEnd({
-      id: _0_12_0Alpha_2$1.INIT
+    _0_12_0Alpha_4.logOperationEnd({
+      id: _0_12_0Alpha_4$1.INIT
     });
-    _0_12_0Alpha_2.logOperationStart({
-      id: _0_12_0Alpha_2$1.BOOTSTRAP_END
+    _0_12_0Alpha_4.logOperationStart({
+      id: _0_12_0Alpha_4$1.BOOTSTRAP_END
     });
   }
 

package/build/__generated_site_amd_modules__/1/module/amd/1/l/en-US/mi/lwr/loader/v/{0_12_0-alpha_2/s/e11ffe74ed86b1153c4eb8b001587909 → 0_12_0-alpha_4/s/5c5d9084a8557502d4eed0d5788db05d}/lwr_loader.js

@@ -1,4 +1,4 @@
-LWR.define('lwr/loader/v/0_12_0-alpha_2', ['exports'], (function (exports) { 'use strict';
+LWR.define('lwr/loader/v/0_12_0-alpha_4', ['exports'], (function (exports) { 'use strict';
 
   /**
   * Copyright (c) 2021, salesforce.com, inc.
@@ -6,7 +6,7 @@ LWR.define('lwr/loader/v/0_12_0-alpha_2', ['exports'], (function (exports) { 'us
   * SPDX-License-Identifier: MIT
   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
   */
-  /* LWR Module Loader v0.12.0-alpha.2 */
+  /* LWR Module Loader v0.12.0-alpha.4 */
   const templateRegex = /\{([0-9]+)\}/g;
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   function templateString(template, args) {
@@ -25,7 +25,7 @@ LWR.define('lwr/loader/v/0_12_0-alpha_2', ['exports'], (function (exports) { 'us
       super();
       this.message = generateErrorMessage(errorInfo, errorArgs);
     }
-    /*LWC compiler v5.1.0*/
+    /*LWC compiler v5.3.0*/
   }
   function invariant(condition, errorInfo) {
     if (!condition) {
@@ -609,7 +609,7 @@ LWR.define('lwr/loader/v/0_12_0-alpha_2', ['exports'], (function (exports) { 'us
     // swallow
   }
   const trusted = createPolicy('trusted', policyOptions);
-  /*! version: 0.20.8 */
+  /*! version: 0.21.0 */
 
   /* global console,process */
 

package/build/__generated_site_amd_modules__/1/module/amd/1/l/en-US/mi/lwr/metrics/v/{0_12_0-alpha_2 → 0_12_0-alpha_4}/s/274c8343f810353bbad085a79709395f/lwr_metrics.js

@@ -1,4 +1,4 @@
-LWR.define('lwr/metrics/v/0_12_0-alpha_2', ['exports'], (function (exports) { 'use strict';
+LWR.define('lwr/metrics/v/0_12_0-alpha_4', ['exports'], (function (exports) { 'use strict';
 
 	// Bootstrap / shim
 	const BOOTSTRAP_PREFIX = 'lwr.bootstrap.';