@lwc/engine-core 7.3.0-alpha.2 → 8.0.0-alpha.0

package/dist/framework/decorators/api.d.ts

@@ -1,9 +1,8 @@
-import { LightningElement } from '../base-lightning-element';
 /**
  * The `@api` decorator marks public fields and public methods in
  * LWC Components. This function implements the internals of this
  * decorator.
  */
-export default function api<Class extends LightningElement>(value: unknown, context: ClassFieldDecoratorContext<Class, unknown> | ClassMethodDecoratorContext<Class, (this: Class, ...args: any) => any> | ClassGetterDecoratorContext<Class, unknown> | ClassSetterDecoratorContext<Class, unknown>): void;
+export default function api(value: unknown, context: ClassMemberDecoratorContext | string | symbol): void;
 export declare function createPublicPropertyDescriptor(key: string): PropertyDescriptor;
 export declare function createPublicAccessorDescriptor(key: PropertyKey, descriptor: PropertyDescriptor): PropertyDescriptor;

package/dist/framework/decorators/track.d.ts

@@ -1,9 +1,7 @@
-import { LightningElement } from '../base-lightning-element';
 /**
  * The `@track` decorator function marks field values as reactive in
  * LWC Components. This function can also be invoked directly
  * with any value to obtain the trackable version of the value.
  */
-export default function track<Class extends LightningElement>(target: undefined, context: ClassFieldDecoratorContext<Class>): void;
-export default function track<T>(target: T, context?: never): T;
+export default function track(value: unknown, context: ClassMemberDecoratorContext | string | symbol): void;
 export declare function internalTrackDecorator(key: string): PropertyDescriptor;

package/dist/framework/decorators/wire.d.ts

@@ -1,5 +1,4 @@
-import type { LightningElement } from '../base-lightning-element';
-import type { ConfigValue, ContextValue, DataCallback, ReplaceReactiveValues, WireAdapterConstructor } from '../wiring';
+import { WireAdapterConstructor } from '../wiring';
 /**
  * Decorator factory to wire a property or method to a wire adapter data source.
  * @param adapter the adapter used to provision data
@@ -11,5 +10,5 @@ import type { ConfigValue, ContextValue, DataCallback, ReplaceReactiveValues, Wi
  *   \@wire(getBook, { id: '$bookId'}) book;
  * }
  */
-export default function wire<ReactiveConfig extends ConfigValue = ConfigValue, Value = any, Context extends ContextValue = ContextValue, Class extends LightningElement = LightningElement>(adapter: WireAdapterConstructor<ReplaceReactiveValues<ReactiveConfig, Class>, Value, Context>, config?: ReactiveConfig): (target: unknown, context: ClassFieldDecoratorContext<Class, Value | undefined> | ClassMethodDecoratorContext<Class, DataCallback<Value>>) => void;
+export default function wire(adapter: WireAdapterConstructor, config?: Record<string, any>): (value: unknown, context: ClassMemberDecoratorContext | string | symbol) => void;
 export declare function internalWireFieldDecorator(key: string): PropertyDescriptor;

package/dist/framework/fragment-cache.d.ts

@@ -0,0 +1,6 @@
+export declare const enum FragmentCacheKey {
+    HAS_SCOPED_STYLE = 1,
+    SHADOW_MODE_SYNTHETIC = 2
+}
+export declare function getFromFragmentCache(cacheKey: number, strings: string[]): Element | undefined;
+export declare function setInFragmentCache(cacheKey: number, strings: string[], element: Element): void;

package/dist/framework/wiring/index.d.ts

@@ -1,3 +1,3 @@
 export { createContextProviderWithRegister, createContextWatcher } from './context';
-export { ConfigCallback, ConfigValue, ContextConsumer, ContextProvider, ContextValue, DataCallback, ReplaceReactiveValues, WireAdapter, WireAdapterConstructor, WireAdapterSchemaValue, WireContextSubscriptionPayload, WireContextSubscriptionCallback, } from './types';
+export { ConfigCallback, ConfigValue, ContextConsumer, ContextProvider, ContextValue, DataCallback, WireAdapter, WireAdapterConstructor, WireAdapterSchemaValue, WireContextSubscriptionPayload, WireContextSubscriptionCallback, } from './types';
 export { connectWireAdapters, disconnectWireAdapters, installWireAdapters, storeWiredFieldMeta, storeWiredMethodMeta, } from './wiring';

package/dist/framework/wiring/types.d.ts

@@ -49,14 +49,3 @@ export interface ContextProviderOptions {
 }
 export type ContextProvider = (elmOrComponent: EventTarget, options: ContextProviderOptions) => void;
 export type RegisterContextProviderFn = (element: HostElement, adapterContextToken: string, onContextSubscription: WireContextSubscriptionCallback) => void;
-/** Resolves a property chain to the corresponding value on the target type. */
-type ResolveReactiveValue<Target, Keys> = Keys extends keyof Target ? Target[Keys] : Keys extends `${infer K}.${infer Rest}` ? K extends keyof Target ? ResolveReactiveValue<Target[K], Rest> : undefined : undefined;
-/**
- * Detects if the `Value` type is a property chain starting with "$". If so, it resolves the
- * properties to the corresponding value on the target type.
- */
-type ResolveValueIfReactive<Value, Target> = Value extends string ? string extends Value ? any : Value extends `$${infer Keys}` ? ResolveReactiveValue<Target, Keys> : Value : Value;
-export type ReplaceReactiveValues<Config extends ConfigValue, Component extends LightningElement> = {
-    [K in keyof Config]: ResolveValueIfReactive<Config[K], Component>;
-};
-export {};

package/dist/index.cjs.js

@@ -155,7 +155,7 @@ function log(method, message, vm, once) {
         }
         alreadyLoggedMessages.add(msg);
     }
-    // In Jest tests, reduce the warning and error verbosity by not printing the callstack
+    // In Vitest tests, reduce the warning and error verbosity by not printing the callstack
     if (process.env.NODE_ENV === 'test') {
         /* eslint-disable-next-line no-console */
         console[method](msg);
@@ -1456,7 +1456,7 @@ async function fetchStylesheet(elm) {
         try {
             return await (await fetch(href)).text();
         }
-        catch (err) {
+        catch (_err) {
             logWarnOnce(`Ignoring cross-origin stylesheet in migrate mode: ${href}`);
             // ignore errors with cross-origin stylesheets - nothing we can do for those
             return '';
@@ -2378,8 +2378,8 @@ function createPublicAccessorDescriptor(key, descriptor) {
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
-function track(target, context) {
-    if (shared.isUndefined(context)) {
+function track(target) {
+    if (arguments.length === 1) {
         return getReactiveProxy(target);
     }
     if (process.env.NODE_ENV !== 'production') {
@@ -5259,22 +5259,30 @@ function s(slotName, data, children, slotset) {
                     if (renderMode === 0 /* RenderMode.Light */ &&
                         shared.isAPIFeatureEnabled(6 /* APIFeature.USE_LIGHT_DOM_SLOT_FORWARDING */, apiVersion) &&
                         (isVBaseElement(vnode) || isVStatic(vnode)) &&
-                        // We only need to copy the vnodes when the slot assignment changes, copying every time causes issues with
-                        // disconnected/connected callback firing.
                         vnode.slotAssignment !== data.slotAssignment) {
-                        // When the light DOM slot assignment (slot attribute) changes we can't use the same reference
-                        // to the vnode because the current way the diffing algo works, it will replace the original reference
-                        // to the host element with a new one. This means the new element will be mounted and immediately unmounted.
-                        // Creating a copy of the vnode to preserve a reference to the previous host element.
-                        if (shared.isUndefined(vnode.elm)) {
-                            // vnode.elm is undefined during initial render.
-                            // We don't need to clone at this point because it doesn't need to be unmounted.
-                            vnode.slotAssignment = data.slotAssignment;
-                        }
-                        else {
-                            // Clone when the vnode.elm is defined to ensure we don't lose reference to the previous element.
-                            // This is specifically for slot forwarding.
-                            clonedVNode = { ...vnode, slotAssignment: data.slotAssignment };
+                        // When the light DOM slot assignment (slot attribute) changes, we can't use the same reference
+                        // to the vnode because the current way the diffing algo works, it will replace the original
+                        // reference to the host element with a new one. This means the new element will be mounted and
+                        // immediately unmounted. Creating a copy of the vnode preserves a reference to the previous
+                        // host element.
+                        clonedVNode = { ...vnode, slotAssignment: data.slotAssignment };
+                        // For disconnectedCallback to work correctly in synthetic lifecycle mode, we need to link the
+                        // current VM's velements to the clone, so that when the VM unmounts, the clone also unmounts.
+                        // Note this only applies to VCustomElements, since those are the elements that we manually need
+                        // to call disconnectedCallback for, when running in synthetic lifecycle mode.
+                        //
+                        // You might think it would make more sense to add the clonedVNode to the same velements array
+                        // as the original vnode's VM (i.e. `vnode.owner.velements`) rather than the current VM (i.e.
+                        // `vmBeingRendered.velements`), but this actually might not trigger disconnectedCallback
+                        // in synthetic lifecycle mode. The reason for this is that a reactivity change may cause
+                        // the slottable component to unmount, but _not_ the slotter component (see issue #4446).
+                        //
+                        // If this occurs, then the slottable component (i.e .this component we are rendering right
+                        // now) is the one that needs to own the clone. Whereas if a reactivity change higher in the
+                        // tree causes the slotter to unmount, then the slottable will also unmount. So using the
+                        // current VM works either way.
+                        if (isVCustomElement(vnode)) {
+                            addVNodeToChildLWC(clonedVNode);
                         }
                     }
                     // If the slot content is standard type, the content is static, no additional
@@ -5796,6 +5804,44 @@ function logGlobalOperationEnd(opId, vm) {
     }
 }
 
+/*
+ * 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
+ */
+// HAS_SCOPED_STYLE | SHADOW_MODE_SYNTHETIC = 3
+const MAX_CACHE_KEY = 3;
+// Mapping of cacheKeys to `string[]` (assumed to come from a tagged template literal) to an Element.
+// Note that every unique tagged template literal will have a unique `string[]`. So by using `string[]`
+// as the WeakMap key, we effectively associate each Element with a unique tagged template literal.
+// See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#tagged_templates
+// Also note that this array only needs to be large enough to account for the maximum possible cache key
+const fragmentCache = shared.ArrayFrom({ length: MAX_CACHE_KEY + 1 }, () => new WeakMap());
+// Only used in LWC's Karma tests
+if (process.env.NODE_ENV === 'test-karma-lwc') {
+    window.__lwcResetFragmentCache = () => {
+        for (let i = 0; i < fragmentCache.length; i++) {
+            fragmentCache[i] = new WeakMap();
+        }
+    };
+}
+function checkIsBrowser() {
+    // The fragment cache only serves prevent calling innerHTML multiple times which doesn't happen on the server.
+    /* istanbul ignore next */
+    if (!process.env.IS_BROWSER) {
+        throw new Error('The fragment cache is intended to only be used in @lwc/engine-dom, not @lwc/engine-server');
+    }
+}
+function getFromFragmentCache(cacheKey, strings) {
+    checkIsBrowser();
+    return fragmentCache[cacheKey].get(strings);
+}
+function setInFragmentCache(cacheKey, strings, element) {
+    checkIsBrowser();
+    fragmentCache[cacheKey].set(strings, element);
+}
+
 /*
  * Copyright (c) 2024, Salesforce, Inc.
  * All rights reserved.
@@ -5939,47 +5985,33 @@ function serializeClassAttribute(part, classToken) {
     const computedClassName = `${classToken} ${shared.keys(classMap).join(' ')}`.trim();
     return computedClassName.length ? ` class="${shared.htmlEscape(computedClassName, true)}"` : '';
 }
-// This should be a no-op outside of LWC's Karma tests, where it's not needed
-let registerFragmentCache = shared.noop;
-// Only used in LWC's Karma tests
-if (process.env.NODE_ENV === 'test-karma-lwc') {
-    // Keep track of fragmentCaches, so we can clear them in LWC's Karma tests
-    const fragmentCaches = [];
-    registerFragmentCache = (fragmentCache) => {
-        fragmentCaches.push(fragmentCache);
-    };
-    window.__lwcResetFragmentCaches = () => {
-        for (const fragmentCache of fragmentCaches) {
-            for (const key of shared.keys(fragmentCache)) {
-                delete fragmentCache[key];
-            }
-        }
-    };
-}
 function buildParseFragmentFn(createFragmentFn) {
-    return (strings, ...keys) => {
-        const cache = shared.create(null);
-        registerFragmentCache(cache);
-        return function (parts) {
+    return function parseFragment(strings, ...keys) {
+        return function applyFragmentParts(parts) {
             const { context: { hasScopedStyles, stylesheetToken, legacyStylesheetToken }, shadowMode, renderer, } = getVMBeingRendered();
             const hasStyleToken = !shared.isUndefined(stylesheetToken);
             const isSyntheticShadow = shadowMode === 1 /* ShadowMode.Synthetic */;
             const hasLegacyToken = lwcRuntimeFlags.ENABLE_LEGACY_SCOPE_TOKENS && !shared.isUndefined(legacyStylesheetToken);
             let cacheKey = 0;
             if (hasStyleToken && hasScopedStyles) {
-                cacheKey |= 1 /* FragmentCache.HAS_SCOPED_STYLE */;
+                cacheKey |= 1 /* FragmentCacheKey.HAS_SCOPED_STYLE */;
             }
             if (hasStyleToken && isSyntheticShadow) {
-                cacheKey |= 2 /* FragmentCache.SHADOW_MODE_SYNTHETIC */;
+                cacheKey |= 2 /* FragmentCacheKey.SHADOW_MODE_SYNTHETIC */;
             }
             // Cache is only here to prevent calling innerHTML multiple times which doesn't happen on the server.
             if (process.env.IS_BROWSER) {
                 // Disable this on the server to prevent cache poisoning when expressions are used.
-                const cached = cache[cacheKey];
+                const cached = getFromFragmentCache(cacheKey, strings);
                 if (!shared.isUndefined(cached)) {
                     return cached;
                 }
             }
+            // See W-16614556
+            if ((hasStyleToken && !shared.isString(stylesheetToken)) ||
+                (hasLegacyToken && !shared.isString(legacyStylesheetToken))) {
+                throw new Error('stylesheet token must be a string');
+            }
             // If legacy stylesheet tokens are required, then add them to the rendered string
             const stylesheetTokenToRender = stylesheetToken + (hasLegacyToken ? ` ${legacyStylesheetToken}` : '');
             const classToken = hasScopedStyles && hasStyleToken ? ' ' + stylesheetTokenToRender : '';
@@ -6015,8 +6047,12 @@ function buildParseFragmentFn(createFragmentFn) {
                 }
             }
             htmlFragment += strings[strings.length - 1];
-            cache[cacheKey] = createFragmentFn(htmlFragment, renderer);
-            return cache[cacheKey];
+            const element = createFragmentFn(htmlFragment, renderer);
+            // Cache is only here to prevent calling innerHTML multiple times which doesn't happen on the server.
+            if (process.env.IS_BROWSER) {
+                setInFragmentCache(cacheKey, strings, element);
+            }
+            return element;
         };
     };
 }
@@ -7799,7 +7835,13 @@ function setHooks(hooks) {
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
 // See @lwc/engine-core/src/framework/template.ts
-const TEMPLATE_PROPS = ['slots', 'stylesheetToken', 'stylesheets', 'renderMode'];
+const TEMPLATE_PROPS = [
+    'slots',
+    'stylesheetToken',
+    'stylesheets',
+    'renderMode',
+    'legacyStylesheetToken',
+];
 // Expandos that may be placed on a stylesheet factory function, and which are meaningful to LWC at runtime
 const STYLESHEET_PROPS = [
     // SEE `KEY__SCOPED_CSS` in @lwc/style-compiler
@@ -8092,5 +8134,5 @@ exports.swapTemplate = swapTemplate;
 exports.track = track;
 exports.unwrap = unwrap;
 exports.wire = wire;
-/** version: 7.3.0-alpha.2 */
+/** version: 7.2.4 */
 //# sourceMappingURL=index.cjs.js.map