@lwc/engine-core 6.5.1 → 6.5.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * Copyright (c) 2024 Salesforce, Inc.
3
3
  */
4
- import { noop, StringToLowerCase, isNull, ArrayPush as ArrayPush$1, ArrayJoin, isFrozen, isUndefined as isUndefined$1, defineProperty, ArrayIndexOf, ArrayPop, create, isFalse, isFunction as isFunction$1, isObject, seal, isAPIFeatureEnabled, isArray as isArray$1, keys, hasOwnProperty as hasOwnProperty$1, entries, AriaPropNameToAttrNameMap, getPropertyDescriptor, forEach, defineProperties, getPrototypeOf as getPrototypeOf$1, setPrototypeOf, assign, freeze, KEY__SYNTHETIC_MODE, assert, toString as toString$1, getOwnPropertyDescriptor as getOwnPropertyDescriptor$1, LWC_VERSION_COMMENT_REGEX, LWC_VERSION, getOwnPropertyNames as getOwnPropertyNames$1, getOwnPropertyDescriptors, htmlPropertyToAttribute, ArraySlice, ArraySplice, ArrayMap, KEY__SCOPED_CSS, kebabCaseToCamelCase, StringCharCodeAt, XML_NAMESPACE, XLINK_NAMESPACE, isString, StringSlice, ArrayShift, ArrayUnshift, isTrue, SVG_NAMESPACE, KEY__SHADOW_STATIC, KEY__SHADOW_RESOLVER, ArraySome, isNumber, StringReplace, htmlEscape, StringCharAt, LOWEST_API_VERSION, KEY__NATIVE_GET_ELEMENT_BY_ID, KEY__NATIVE_QUERY_SELECTOR_ALL, ID_REFERENCING_ATTRIBUTES_SET, KEY__SHADOW_TOKEN, ArrayFilter, StringSplit, arrayEvery, ArrayIncludes, ArrayCopyWithin, ArrayFill, ArraySort, ArrayReverse } from '@lwc/shared';
4
+ import { noop, StringToLowerCase, isNull, ArrayPush as ArrayPush$1, ArrayJoin, isFrozen, isUndefined as isUndefined$1, defineProperty, ArrayIndexOf, ArrayPop, create, isFalse, isFunction as isFunction$1, isObject, seal, isAPIFeatureEnabled, isArray as isArray$1, keys, hasOwnProperty as hasOwnProperty$1, entries, AriaPropNameToAttrNameMap, getPropertyDescriptor, forEach, defineProperties, getPrototypeOf as getPrototypeOf$1, setPrototypeOf, assign, freeze, KEY__SYNTHETIC_MODE, assert, toString as toString$1, getOwnPropertyDescriptor as getOwnPropertyDescriptor$1, LWC_VERSION_COMMENT_REGEX, LWC_VERSION, getOwnPropertyNames as getOwnPropertyNames$1, getOwnPropertyDescriptors, htmlPropertyToAttribute, ArraySlice, ArrayMap, KEY__SCOPED_CSS, ArraySplice, kebabCaseToCamelCase, StringCharCodeAt, XML_NAMESPACE, XLINK_NAMESPACE, isString, StringSlice, ArrayShift, ArrayUnshift, isTrue, SVG_NAMESPACE, KEY__SHADOW_STATIC, KEY__SHADOW_RESOLVER, ArraySome, isNumber, StringReplace, htmlEscape, StringCharAt, LOWEST_API_VERSION, KEY__NATIVE_GET_ELEMENT_BY_ID, KEY__NATIVE_QUERY_SELECTOR_ALL, ID_REFERENCING_ATTRIBUTES_SET, KEY__SHADOW_TOKEN, ArrayFilter, StringSplit, arrayEvery, ArrayIncludes, ArrayCopyWithin, ArrayFill, ArraySort, ArrayReverse } from '@lwc/shared';
5
5
  export { setFeatureFlag, setFeatureFlagForTest } from '@lwc/features';
6
6
 
7
7
  /*
@@ -2053,7 +2053,7 @@ function createContextWatcher(vm, wireDef, callbackWhenContextIsReady) {
2053
2053
  }
2054
2054
 
2055
2055
  /*
2056
- * Copyright (c) 2023, salesforce.com, inc.
2056
+ * Copyright (c) 2024, Salesforce, Inc.
2057
2057
  * All rights reserved.
2058
2058
  * SPDX-License-Identifier: MIT
2059
2059
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
@@ -2212,7 +2212,8 @@ function installWireAdapters(vm) {
2212
2212
  vm.debugInfo[WIRE_DEBUG_ENTRY] = create(null);
2213
2213
  }
2214
2214
  const wiredConnecting = (context.wiredConnecting = []);
2215
- const wiredDisconnecting = (context.wiredDisconnecting = []);
2215
+ const wiredDisconnecting = (context.wiredDisconnecting =
2216
+ []);
2216
2217
  for (const fieldNameOrMethod in wire) {
2217
2218
  const descriptor = wire[fieldNameOrMethod];
2218
2219
  const wireDef = WireMetaMap.get(descriptor);
@@ -2713,7 +2714,7 @@ function sanitizeAttribute(tagName, namespaceUri, attrName, attrValue) {
2713
2714
  }
2714
2715
 
2715
2716
  /*
2716
- * Copyright (c) 2018, salesforce.com, inc.
2717
+ * Copyright (c) 2024, Salesforce, Inc.
2717
2718
  * All rights reserved.
2718
2719
  * SPDX-License-Identifier: MIT
2719
2720
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
@@ -2907,6 +2908,296 @@ const BaseBridgeElement = HTMLBridgeElementFactory(HTMLElementConstructor, baseP
2907
2908
  freeze(BaseBridgeElement);
2908
2909
  seal(BaseBridgeElement.prototype);
2909
2910
 
2911
+ /*
2912
+ * Copyright (c) 2018, salesforce.com, inc.
2913
+ * All rights reserved.
2914
+ * SPDX-License-Identifier: MIT
2915
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
2916
+ */
2917
+ // These are only used for HMR in dev mode
2918
+ // The "pure" annotations are so that Rollup knows for sure it can remove these from prod mode
2919
+ let stylesheetsToCssContent = /*@__PURE__@*/ new WeakMap();
2920
+ let cssContentToAbortControllers = /*@__PURE__@*/ new Map();
2921
+ // Only used in LWC's Karma tests
2922
+ if (process.env.NODE_ENV === 'test-karma-lwc') {
2923
+ // Used to reset the global state between test runs
2924
+ window.__lwcResetStylesheetCache = () => {
2925
+ stylesheetsToCssContent = new WeakMap();
2926
+ cssContentToAbortControllers = new Map();
2927
+ };
2928
+ }
2929
+ function linkStylesheetToCssContentInDevMode(stylesheet, cssContent) {
2930
+ // Should never leak to prod; only used for HMR
2931
+ assertNotProd();
2932
+ let cssContents = stylesheetsToCssContent.get(stylesheet);
2933
+ if (isUndefined$1(cssContents)) {
2934
+ cssContents = new Set();
2935
+ stylesheetsToCssContent.set(stylesheet, cssContents);
2936
+ }
2937
+ cssContents.add(cssContent);
2938
+ }
2939
+ function getOrCreateAbortControllerInDevMode(cssContent) {
2940
+ // Should never leak to prod; only used for HMR
2941
+ assertNotProd();
2942
+ let abortController = cssContentToAbortControllers.get(cssContent);
2943
+ if (isUndefined$1(abortController)) {
2944
+ abortController = new AbortController();
2945
+ cssContentToAbortControllers.set(cssContent, abortController);
2946
+ }
2947
+ return abortController;
2948
+ }
2949
+ function getOrCreateAbortSignal(cssContent) {
2950
+ // abort controller/signal is only used for HMR in development
2951
+ if (process.env.NODE_ENV !== 'production') {
2952
+ return getOrCreateAbortControllerInDevMode(cssContent).signal;
2953
+ }
2954
+ return undefined;
2955
+ }
2956
+ function makeHostToken(token) {
2957
+ // Note: if this ever changes, update the `cssScopeTokens` returned by `@lwc/compiler`
2958
+ return `${token}-host`;
2959
+ }
2960
+ function createInlineStyleVNode(content) {
2961
+ return api.h('style', {
2962
+ key: 'style', // special key
2963
+ attrs: {
2964
+ type: 'text/css',
2965
+ },
2966
+ }, [api.t(content)]);
2967
+ }
2968
+ // TODO [#3733]: remove support for legacy scope tokens
2969
+ function updateStylesheetToken(vm, template, legacy) {
2970
+ const { elm, context, renderMode, shadowMode, renderer: { getClassList, removeAttribute, setAttribute }, } = vm;
2971
+ const { stylesheets: newStylesheets } = template;
2972
+ const newStylesheetToken = legacy ? template.legacyStylesheetToken : template.stylesheetToken;
2973
+ const { stylesheets: newVmStylesheets } = vm;
2974
+ const isSyntheticShadow = renderMode === 1 /* RenderMode.Shadow */ && shadowMode === 1 /* ShadowMode.Synthetic */;
2975
+ const { hasScopedStyles } = context;
2976
+ let newToken;
2977
+ let newHasTokenInClass;
2978
+ let newHasTokenInAttribute;
2979
+ // Reset the styling token applied to the host element.
2980
+ let oldToken;
2981
+ let oldHasTokenInClass;
2982
+ let oldHasTokenInAttribute;
2983
+ if (legacy) {
2984
+ oldToken = context.legacyStylesheetToken;
2985
+ oldHasTokenInClass = context.hasLegacyTokenInClass;
2986
+ oldHasTokenInAttribute = context.hasLegacyTokenInAttribute;
2987
+ }
2988
+ else {
2989
+ oldToken = context.stylesheetToken;
2990
+ oldHasTokenInClass = context.hasTokenInClass;
2991
+ oldHasTokenInAttribute = context.hasTokenInAttribute;
2992
+ }
2993
+ if (!isUndefined$1(oldToken)) {
2994
+ if (oldHasTokenInClass) {
2995
+ getClassList(elm).remove(makeHostToken(oldToken));
2996
+ }
2997
+ if (oldHasTokenInAttribute) {
2998
+ removeAttribute(elm, makeHostToken(oldToken));
2999
+ }
3000
+ }
3001
+ // Apply the new template styling token to the host element, if the new template has any
3002
+ // associated stylesheets. In the case of light DOM, also ensure there is at least one scoped stylesheet.
3003
+ const hasNewStylesheets = hasStyles(newStylesheets);
3004
+ const hasNewVmStylesheets = hasStyles(newVmStylesheets);
3005
+ if (hasNewStylesheets || hasNewVmStylesheets) {
3006
+ newToken = newStylesheetToken;
3007
+ }
3008
+ // Set the new styling token on the host element
3009
+ if (!isUndefined$1(newToken)) {
3010
+ if (hasScopedStyles) {
3011
+ getClassList(elm).add(makeHostToken(newToken));
3012
+ newHasTokenInClass = true;
3013
+ }
3014
+ if (isSyntheticShadow) {
3015
+ setAttribute(elm, makeHostToken(newToken), '');
3016
+ newHasTokenInAttribute = true;
3017
+ }
3018
+ }
3019
+ // Update the styling tokens present on the context object.
3020
+ if (legacy) {
3021
+ context.legacyStylesheetToken = newToken;
3022
+ context.hasLegacyTokenInClass = newHasTokenInClass;
3023
+ context.hasLegacyTokenInAttribute = newHasTokenInAttribute;
3024
+ }
3025
+ else {
3026
+ context.stylesheetToken = newToken;
3027
+ context.hasTokenInClass = newHasTokenInClass;
3028
+ context.hasTokenInAttribute = newHasTokenInAttribute;
3029
+ }
3030
+ }
3031
+ function evaluateStylesheetsContent(stylesheets, stylesheetToken, vm) {
3032
+ const content = [];
3033
+ let root;
3034
+ for (let i = 0; i < stylesheets.length; i++) {
3035
+ let stylesheet = stylesheets[i];
3036
+ if (isArray$1(stylesheet)) {
3037
+ ArrayPush$1.apply(content, evaluateStylesheetsContent(stylesheet, stylesheetToken, vm));
3038
+ }
3039
+ else {
3040
+ if (process.env.NODE_ENV !== 'production') {
3041
+ // Check for compiler version mismatch in dev mode only
3042
+ checkVersionMismatch(stylesheet, 'stylesheet');
3043
+ // in dev-mode, we support hot swapping of stylesheet, which means that
3044
+ // the component instance might be attempting to use an old version of
3045
+ // the stylesheet, while internally, we have a replacement for it.
3046
+ stylesheet = getStyleOrSwappedStyle(stylesheet);
3047
+ }
3048
+ const isScopedCss = stylesheet[KEY__SCOPED_CSS];
3049
+ if (lwcRuntimeFlags.DISABLE_LIGHT_DOM_UNSCOPED_CSS &&
3050
+ !isScopedCss &&
3051
+ vm.renderMode === 0 /* RenderMode.Light */) {
3052
+ logError('Unscoped CSS is not supported in Light DOM in this environment. Please use scoped CSS ' +
3053
+ '(*.scoped.css) instead of unscoped CSS (*.css). See also: https://sfdc.co/scoped-styles-light-dom');
3054
+ continue;
3055
+ }
3056
+ // Apply the scope token only if the stylesheet itself is scoped, or if we're rendering synthetic shadow.
3057
+ const scopeToken = isScopedCss ||
3058
+ (vm.shadowMode === 1 /* ShadowMode.Synthetic */ && vm.renderMode === 1 /* RenderMode.Shadow */)
3059
+ ? stylesheetToken
3060
+ : undefined;
3061
+ // Use the actual `:host` selector if we're rendering global CSS for light DOM, or if we're rendering
3062
+ // native shadow DOM. Synthetic shadow DOM never uses `:host`.
3063
+ const useActualHostSelector = vm.renderMode === 0 /* RenderMode.Light */
3064
+ ? !isScopedCss
3065
+ : vm.shadowMode === 0 /* ShadowMode.Native */;
3066
+ // Use the native :dir() pseudoclass only in native shadow DOM. Otherwise, in synthetic shadow,
3067
+ // we use an attribute selector on the host to simulate :dir().
3068
+ let useNativeDirPseudoclass;
3069
+ if (vm.renderMode === 1 /* RenderMode.Shadow */) {
3070
+ useNativeDirPseudoclass = vm.shadowMode === 0 /* ShadowMode.Native */;
3071
+ }
3072
+ else {
3073
+ // Light DOM components should only render `[dir]` if they're inside of a synthetic shadow root.
3074
+ // At the top level (root is null) or inside of a native shadow root, they should use `:dir()`.
3075
+ if (isUndefined$1(root)) {
3076
+ // Only calculate the root once as necessary
3077
+ root = getNearestShadowComponent(vm);
3078
+ }
3079
+ useNativeDirPseudoclass = isNull(root) || root.shadowMode === 0 /* ShadowMode.Native */;
3080
+ }
3081
+ const cssContent = stylesheet(scopeToken, useActualHostSelector, useNativeDirPseudoclass);
3082
+ if (process.env.NODE_ENV !== 'production') {
3083
+ linkStylesheetToCssContentInDevMode(stylesheet, cssContent);
3084
+ }
3085
+ ArrayPush$1.call(content, cssContent);
3086
+ }
3087
+ }
3088
+ return content;
3089
+ }
3090
+ function getStylesheetsContent(vm, template) {
3091
+ const { stylesheets, stylesheetToken } = template;
3092
+ const { stylesheets: vmStylesheets } = vm;
3093
+ let content = [];
3094
+ if (hasStyles(stylesheets)) {
3095
+ content = evaluateStylesheetsContent(stylesheets, stylesheetToken, vm);
3096
+ }
3097
+ // VM (component) stylesheets apply after template stylesheets
3098
+ if (hasStyles(vmStylesheets)) {
3099
+ ArrayPush$1.apply(content, evaluateStylesheetsContent(vmStylesheets, stylesheetToken, vm));
3100
+ }
3101
+ return content;
3102
+ }
3103
+ // It might be worth caching this to avoid doing the lookup repeatedly, but
3104
+ // perf testing has not shown it to be a huge improvement yet:
3105
+ // https://github.com/salesforce/lwc/pull/2460#discussion_r691208892
3106
+ function getNearestShadowComponent(vm) {
3107
+ let owner = vm;
3108
+ while (!isNull(owner)) {
3109
+ if (owner.renderMode === 1 /* RenderMode.Shadow */) {
3110
+ return owner;
3111
+ }
3112
+ owner = owner.owner;
3113
+ }
3114
+ return owner;
3115
+ }
3116
+ /**
3117
+ * If the component that is currently being rendered uses scoped styles,
3118
+ * this returns the unique token for that scoped stylesheet. Otherwise
3119
+ * it returns null.
3120
+ * @param owner
3121
+ * @param legacy
3122
+ */
3123
+ // TODO [#3733]: remove support for legacy scope tokens
3124
+ function getScopeTokenClass(owner, legacy) {
3125
+ const { cmpTemplate, context } = owner;
3126
+ return ((context.hasScopedStyles &&
3127
+ (legacy ? cmpTemplate?.legacyStylesheetToken : cmpTemplate?.stylesheetToken)) ||
3128
+ null);
3129
+ }
3130
+ /**
3131
+ * This function returns the host style token for a custom element if it
3132
+ * exists. Otherwise it returns null.
3133
+ *
3134
+ * A host style token is applied to the component if scoped styles are used.
3135
+ * @param vnode
3136
+ */
3137
+ function getStylesheetTokenHost(vnode) {
3138
+ const { template } = getComponentInternalDef(vnode.ctor);
3139
+ const { vm } = vnode;
3140
+ const { stylesheetToken } = template;
3141
+ return !isUndefined$1(stylesheetToken) && computeHasScopedStyles(template, vm)
3142
+ ? makeHostToken(stylesheetToken)
3143
+ : null;
3144
+ }
3145
+ function getNearestNativeShadowComponent(vm) {
3146
+ const owner = getNearestShadowComponent(vm);
3147
+ if (!isNull(owner) && owner.shadowMode === 1 /* ShadowMode.Synthetic */) {
3148
+ // Synthetic-within-native is impossible. So if the nearest shadow component is
3149
+ // synthetic, we know we won't find a native component if we go any further.
3150
+ return null;
3151
+ }
3152
+ return owner;
3153
+ }
3154
+ function createStylesheet(vm, stylesheets) {
3155
+ const { renderMode, shadowMode, renderer: { insertStylesheet }, } = vm;
3156
+ if (renderMode === 1 /* RenderMode.Shadow */ && shadowMode === 1 /* ShadowMode.Synthetic */) {
3157
+ for (let i = 0; i < stylesheets.length; i++) {
3158
+ const stylesheet = stylesheets[i];
3159
+ insertStylesheet(stylesheet, undefined, getOrCreateAbortSignal(stylesheet));
3160
+ }
3161
+ }
3162
+ else if (!process.env.IS_BROWSER || vm.hydrated) {
3163
+ // Note: We need to ensure that during hydration, the stylesheets method is the same as those in ssr.
3164
+ // This works in the client, because the stylesheets are created, and cached in the VM
3165
+ // the first time the VM renders.
3166
+ // native shadow or light DOM, SSR
3167
+ return ArrayMap.call(stylesheets, createInlineStyleVNode);
3168
+ }
3169
+ else {
3170
+ // native shadow or light DOM, DOM renderer
3171
+ const root = getNearestNativeShadowComponent(vm);
3172
+ // null root means a global style
3173
+ const target = isNull(root) ? undefined : root.shadowRoot;
3174
+ for (let i = 0; i < stylesheets.length; i++) {
3175
+ const stylesheet = stylesheets[i];
3176
+ insertStylesheet(stylesheet, target, getOrCreateAbortSignal(stylesheet));
3177
+ }
3178
+ }
3179
+ return null;
3180
+ }
3181
+ function unrenderStylesheet(stylesheet) {
3182
+ // should never leak to prod; only used for HMR
3183
+ assertNotProd();
3184
+ const cssContents = stylesheetsToCssContent.get(stylesheet);
3185
+ /* istanbul ignore if */
3186
+ if (isUndefined$1(cssContents)) {
3187
+ throw new Error('Cannot unrender stylesheet which was never rendered');
3188
+ }
3189
+ for (const cssContent of cssContents) {
3190
+ const abortController = cssContentToAbortControllers.get(cssContent);
3191
+ /* istanbul ignore if */
3192
+ if (isUndefined$1(abortController)) {
3193
+ throw new Error('Cannot find AbortController for CSS content');
3194
+ }
3195
+ abortController.abort();
3196
+ // remove association with AbortController in case stylesheet is rendered again
3197
+ cssContentToAbortControllers.delete(cssContent);
3198
+ }
3199
+ }
3200
+
2910
3201
  /*
2911
3202
  * Copyright (c) 2023, salesforce.com, inc.
2912
3203
  * All rights reserved.
@@ -3000,16 +3291,31 @@ const WeakMultiMap = supportsWeakRefs ? ModernWeakMultiMap : LegacyWeakMultiMap;
3000
3291
  * SPDX-License-Identifier: MIT
3001
3292
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
3002
3293
  */
3003
- const swappedTemplateMap = new WeakMap();
3004
- const swappedComponentMap = new WeakMap();
3005
- const swappedStyleMap = new WeakMap();
3294
+ let swappedTemplateMap = /*@__PURE__@*/ new WeakMap();
3295
+ let swappedComponentMap =
3296
+ /*@__PURE__@*/ new WeakMap();
3297
+ let swappedStyleMap = /*@__PURE__@*/ new WeakMap();
3006
3298
  // The important thing here is the weak values – VMs are transient (one per component instance) and should be GC'ed,
3007
3299
  // so we don't want to create strong references to them.
3008
3300
  // The weak keys are kind of useless, because Templates, LightningElementConstructors, and StylesheetFactories are
3009
3301
  // never GC'ed. But maybe they will be someday, so we may as well use weak keys too.
3010
- const activeTemplates = new WeakMultiMap();
3011
- const activeComponents = new WeakMultiMap();
3012
- const activeStyles = new WeakMultiMap();
3302
+ // The "pure" annotations are so that Rollup knows for sure it can remove these from prod mode
3303
+ let activeTemplates = /*@__PURE__@*/ new WeakMultiMap();
3304
+ let activeComponents =
3305
+ /*@__PURE__@*/ new WeakMultiMap();
3306
+ let activeStyles = /*@__PURE__@*/ new WeakMultiMap();
3307
+ // Only used in LWC's Karma tests
3308
+ if (process.env.NODE_ENV === 'test-karma-lwc') {
3309
+ // Used to reset the global state between test runs
3310
+ window.__lwcResetHotSwaps = () => {
3311
+ swappedTemplateMap = new WeakMap();
3312
+ swappedComponentMap = new WeakMap();
3313
+ swappedStyleMap = new WeakMap();
3314
+ activeTemplates = new WeakMultiMap();
3315
+ activeComponents = new WeakMultiMap();
3316
+ activeStyles = new WeakMultiMap();
3317
+ };
3318
+ }
3013
3319
  function rehydrateHotTemplate(tpl) {
3014
3320
  const list = activeTemplates.get(tpl);
3015
3321
  for (const vm of list) {
@@ -3025,8 +3331,9 @@ function rehydrateHotTemplate(tpl) {
3025
3331
  return true;
3026
3332
  }
3027
3333
  function rehydrateHotStyle(style) {
3028
- const list = activeStyles.get(style);
3029
- for (const vm of list) {
3334
+ const activeVMs = activeStyles.get(style);
3335
+ unrenderStylesheet(style);
3336
+ for (const vm of activeVMs) {
3030
3337
  // if a style definition is swapped, we must reset
3031
3338
  // vm's template content in the next micro-task:
3032
3339
  forceRehydration(vm);
@@ -3063,6 +3370,7 @@ function rehydrateHotComponent(Ctor) {
3063
3370
  }
3064
3371
  function getTemplateOrSwappedTemplate(tpl) {
3065
3372
  assertNotProd(); // this method should never leak to prod
3373
+ // TODO [#4154]: shows stale content when swapping content back and forth multiple times
3066
3374
  const visited = new Set();
3067
3375
  while (swappedTemplateMap.has(tpl) && !visited.has(tpl)) {
3068
3376
  visited.add(tpl);
@@ -3072,6 +3380,7 @@ function getTemplateOrSwappedTemplate(tpl) {
3072
3380
  }
3073
3381
  function getComponentOrSwappedComponent(Ctor) {
3074
3382
  assertNotProd(); // this method should never leak to prod
3383
+ // TODO [#4154]: shows stale content when swapping content back and forth multiple times
3075
3384
  const visited = new Set();
3076
3385
  while (swappedComponentMap.has(Ctor) && !visited.has(Ctor)) {
3077
3386
  visited.add(Ctor);
@@ -3081,6 +3390,7 @@ function getComponentOrSwappedComponent(Ctor) {
3081
3390
  }
3082
3391
  function getStyleOrSwappedStyle(style) {
3083
3392
  assertNotProd(); // this method should never leak to prod
3393
+ // TODO [#4154]: shows stale content when swapping content back and forth multiple times
3084
3394
  const visited = new Set();
3085
3395
  while (swappedStyleMap.has(style) && !visited.has(style)) {
3086
3396
  visited.add(style);
@@ -3088,6 +3398,22 @@ function getStyleOrSwappedStyle(style) {
3088
3398
  }
3089
3399
  return style;
3090
3400
  }
3401
+ function addActiveStylesheets(stylesheets, vm) {
3402
+ if (isUndefined$1(stylesheets) || isNull(stylesheets)) {
3403
+ // Ignore non-existent stylesheets
3404
+ return;
3405
+ }
3406
+ for (const stylesheet of flattenStylesheets(stylesheets)) {
3407
+ // this is necessary because we don't hold the list of styles
3408
+ // in the vm, we only hold the selected (already swapped template)
3409
+ // but the styles attached to the template might not be the actual
3410
+ // active ones, but the swapped versions of those.
3411
+ const swappedStylesheet = getStyleOrSwappedStyle(stylesheet);
3412
+ // this will allow us to keep track of the stylesheet that are
3413
+ // being used by a hot component
3414
+ activeStyles.add(swappedStylesheet, vm);
3415
+ }
3416
+ }
3091
3417
  function setActiveVM(vm) {
3092
3418
  assertNotProd(); // this method should never leak to prod
3093
3419
  // tracking active component
@@ -3095,25 +3421,15 @@ function setActiveVM(vm) {
3095
3421
  // this will allow us to keep track of the hot components
3096
3422
  activeComponents.add(Ctor, vm);
3097
3423
  // tracking active template
3098
- const tpl = vm.cmpTemplate;
3099
- if (tpl) {
3424
+ const template = vm.cmpTemplate;
3425
+ if (!isNull(template)) {
3100
3426
  // this will allow us to keep track of the templates that are
3101
3427
  // being used by a hot component
3102
- activeTemplates.add(tpl, vm);
3103
- // tracking active styles associated to template
3104
- const stylesheets = tpl.stylesheets;
3105
- if (!isUndefined$1(stylesheets)) {
3106
- for (const stylesheet of flattenStylesheets(stylesheets)) {
3107
- // this is necessary because we don't hold the list of styles
3108
- // in the vm, we only hold the selected (already swapped template)
3109
- // but the styles attached to the template might not be the actual
3110
- // active ones, but the swapped versions of those.
3111
- const swappedStylesheet = getStyleOrSwappedStyle(stylesheet);
3112
- // this will allow us to keep track of the stylesheet that are
3113
- // being used by a hot component
3114
- activeStyles.add(swappedStylesheet, vm);
3115
- }
3116
- }
3428
+ activeTemplates.add(template, vm);
3429
+ // Tracking active styles from the template or the VM. `template.stylesheets` are implicitly associated
3430
+ // (e.g. `foo.css` associated with `foo.html`), whereas `vm.stylesheets` are from `static stylesheets`.
3431
+ addActiveStylesheets(template.stylesheets, vm);
3432
+ addActiveStylesheets(vm.stylesheets, vm);
3117
3433
  }
3118
3434
  }
3119
3435
  function swapTemplate(oldTpl, newTpl) {
@@ -3396,233 +3712,7 @@ function getComponentDef(Ctor) {
3396
3712
  }
3397
3713
 
3398
3714
  /*
3399
- * Copyright (c) 2018, salesforce.com, inc.
3400
- * All rights reserved.
3401
- * SPDX-License-Identifier: MIT
3402
- * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
3403
- */
3404
- function makeHostToken(token) {
3405
- // Note: if this ever changes, update the `cssScopeTokens` returned by `@lwc/compiler`
3406
- return `${token}-host`;
3407
- }
3408
- function createInlineStyleVNode(content) {
3409
- return api.h('style', {
3410
- key: 'style', // special key
3411
- attrs: {
3412
- type: 'text/css',
3413
- },
3414
- }, [api.t(content)]);
3415
- }
3416
- // TODO [#3733]: remove support for legacy scope tokens
3417
- function updateStylesheetToken(vm, template, legacy) {
3418
- const { elm, context, renderMode, shadowMode, renderer: { getClassList, removeAttribute, setAttribute }, } = vm;
3419
- const { stylesheets: newStylesheets } = template;
3420
- const newStylesheetToken = legacy ? template.legacyStylesheetToken : template.stylesheetToken;
3421
- const { stylesheets: newVmStylesheets } = vm;
3422
- const isSyntheticShadow = renderMode === 1 /* RenderMode.Shadow */ && shadowMode === 1 /* ShadowMode.Synthetic */;
3423
- const { hasScopedStyles } = context;
3424
- let newToken;
3425
- let newHasTokenInClass;
3426
- let newHasTokenInAttribute;
3427
- // Reset the styling token applied to the host element.
3428
- let oldToken;
3429
- let oldHasTokenInClass;
3430
- let oldHasTokenInAttribute;
3431
- if (legacy) {
3432
- oldToken = context.legacyStylesheetToken;
3433
- oldHasTokenInClass = context.hasLegacyTokenInClass;
3434
- oldHasTokenInAttribute = context.hasLegacyTokenInAttribute;
3435
- }
3436
- else {
3437
- oldToken = context.stylesheetToken;
3438
- oldHasTokenInClass = context.hasTokenInClass;
3439
- oldHasTokenInAttribute = context.hasTokenInAttribute;
3440
- }
3441
- if (!isUndefined$1(oldToken)) {
3442
- if (oldHasTokenInClass) {
3443
- getClassList(elm).remove(makeHostToken(oldToken));
3444
- }
3445
- if (oldHasTokenInAttribute) {
3446
- removeAttribute(elm, makeHostToken(oldToken));
3447
- }
3448
- }
3449
- // Apply the new template styling token to the host element, if the new template has any
3450
- // associated stylesheets. In the case of light DOM, also ensure there is at least one scoped stylesheet.
3451
- const hasNewStylesheets = hasStyles(newStylesheets);
3452
- const hasNewVmStylesheets = hasStyles(newVmStylesheets);
3453
- if (hasNewStylesheets || hasNewVmStylesheets) {
3454
- newToken = newStylesheetToken;
3455
- }
3456
- // Set the new styling token on the host element
3457
- if (!isUndefined$1(newToken)) {
3458
- if (hasScopedStyles) {
3459
- getClassList(elm).add(makeHostToken(newToken));
3460
- newHasTokenInClass = true;
3461
- }
3462
- if (isSyntheticShadow) {
3463
- setAttribute(elm, makeHostToken(newToken), '');
3464
- newHasTokenInAttribute = true;
3465
- }
3466
- }
3467
- // Update the styling tokens present on the context object.
3468
- if (legacy) {
3469
- context.legacyStylesheetToken = newToken;
3470
- context.hasLegacyTokenInClass = newHasTokenInClass;
3471
- context.hasLegacyTokenInAttribute = newHasTokenInAttribute;
3472
- }
3473
- else {
3474
- context.stylesheetToken = newToken;
3475
- context.hasTokenInClass = newHasTokenInClass;
3476
- context.hasTokenInAttribute = newHasTokenInAttribute;
3477
- }
3478
- }
3479
- function evaluateStylesheetsContent(stylesheets, stylesheetToken, vm) {
3480
- const content = [];
3481
- let root;
3482
- for (let i = 0; i < stylesheets.length; i++) {
3483
- let stylesheet = stylesheets[i];
3484
- if (isArray$1(stylesheet)) {
3485
- ArrayPush$1.apply(content, evaluateStylesheetsContent(stylesheet, stylesheetToken, vm));
3486
- }
3487
- else {
3488
- if (process.env.NODE_ENV !== 'production') {
3489
- // Check for compiler version mismatch in dev mode only
3490
- checkVersionMismatch(stylesheet, 'stylesheet');
3491
- // in dev-mode, we support hot swapping of stylesheet, which means that
3492
- // the component instance might be attempting to use an old version of
3493
- // the stylesheet, while internally, we have a replacement for it.
3494
- stylesheet = getStyleOrSwappedStyle(stylesheet);
3495
- }
3496
- const isScopedCss = stylesheet[KEY__SCOPED_CSS];
3497
- if (lwcRuntimeFlags.DISABLE_LIGHT_DOM_UNSCOPED_CSS &&
3498
- !isScopedCss &&
3499
- vm.renderMode === 0 /* RenderMode.Light */) {
3500
- logError('Unscoped CSS is not supported in Light DOM in this environment. Please use scoped CSS ' +
3501
- '(*.scoped.css) instead of unscoped CSS (*.css). See also: https://sfdc.co/scoped-styles-light-dom');
3502
- continue;
3503
- }
3504
- // Apply the scope token only if the stylesheet itself is scoped, or if we're rendering synthetic shadow.
3505
- const scopeToken = isScopedCss ||
3506
- (vm.shadowMode === 1 /* ShadowMode.Synthetic */ && vm.renderMode === 1 /* RenderMode.Shadow */)
3507
- ? stylesheetToken
3508
- : undefined;
3509
- // Use the actual `:host` selector if we're rendering global CSS for light DOM, or if we're rendering
3510
- // native shadow DOM. Synthetic shadow DOM never uses `:host`.
3511
- const useActualHostSelector = vm.renderMode === 0 /* RenderMode.Light */
3512
- ? !isScopedCss
3513
- : vm.shadowMode === 0 /* ShadowMode.Native */;
3514
- // Use the native :dir() pseudoclass only in native shadow DOM. Otherwise, in synthetic shadow,
3515
- // we use an attribute selector on the host to simulate :dir().
3516
- let useNativeDirPseudoclass;
3517
- if (vm.renderMode === 1 /* RenderMode.Shadow */) {
3518
- useNativeDirPseudoclass = vm.shadowMode === 0 /* ShadowMode.Native */;
3519
- }
3520
- else {
3521
- // Light DOM components should only render `[dir]` if they're inside of a synthetic shadow root.
3522
- // At the top level (root is null) or inside of a native shadow root, they should use `:dir()`.
3523
- if (isUndefined$1(root)) {
3524
- // Only calculate the root once as necessary
3525
- root = getNearestShadowComponent(vm);
3526
- }
3527
- useNativeDirPseudoclass = isNull(root) || root.shadowMode === 0 /* ShadowMode.Native */;
3528
- }
3529
- ArrayPush$1.call(content, stylesheet(scopeToken, useActualHostSelector, useNativeDirPseudoclass));
3530
- }
3531
- }
3532
- return content;
3533
- }
3534
- function getStylesheetsContent(vm, template) {
3535
- const { stylesheets, stylesheetToken } = template;
3536
- const { stylesheets: vmStylesheets } = vm;
3537
- let content = [];
3538
- if (hasStyles(stylesheets)) {
3539
- content = evaluateStylesheetsContent(stylesheets, stylesheetToken, vm);
3540
- }
3541
- // VM (component) stylesheets apply after template stylesheets
3542
- if (hasStyles(vmStylesheets)) {
3543
- ArrayPush$1.apply(content, evaluateStylesheetsContent(vmStylesheets, stylesheetToken, vm));
3544
- }
3545
- return content;
3546
- }
3547
- // It might be worth caching this to avoid doing the lookup repeatedly, but
3548
- // perf testing has not shown it to be a huge improvement yet:
3549
- // https://github.com/salesforce/lwc/pull/2460#discussion_r691208892
3550
- function getNearestShadowComponent(vm) {
3551
- let owner = vm;
3552
- while (!isNull(owner)) {
3553
- if (owner.renderMode === 1 /* RenderMode.Shadow */) {
3554
- return owner;
3555
- }
3556
- owner = owner.owner;
3557
- }
3558
- return owner;
3559
- }
3560
- /**
3561
- * If the component that is currently being rendered uses scoped styles,
3562
- * this returns the unique token for that scoped stylesheet. Otherwise
3563
- * it returns null.
3564
- * @param owner
3565
- * @param legacy
3566
- */
3567
- // TODO [#3733]: remove support for legacy scope tokens
3568
- function getScopeTokenClass(owner, legacy) {
3569
- const { cmpTemplate, context } = owner;
3570
- return ((context.hasScopedStyles &&
3571
- (legacy ? cmpTemplate?.legacyStylesheetToken : cmpTemplate?.stylesheetToken)) ||
3572
- null);
3573
- }
3574
- /**
3575
- * This function returns the host style token for a custom element if it
3576
- * exists. Otherwise it returns null.
3577
- *
3578
- * A host style token is applied to the component if scoped styles are used.
3579
- * @param vnode
3580
- */
3581
- function getStylesheetTokenHost(vnode) {
3582
- const { template } = getComponentInternalDef(vnode.ctor);
3583
- const { vm } = vnode;
3584
- const { stylesheetToken } = template;
3585
- return !isUndefined$1(stylesheetToken) && computeHasScopedStyles(template, vm)
3586
- ? makeHostToken(stylesheetToken)
3587
- : null;
3588
- }
3589
- function getNearestNativeShadowComponent(vm) {
3590
- const owner = getNearestShadowComponent(vm);
3591
- if (!isNull(owner) && owner.shadowMode === 1 /* ShadowMode.Synthetic */) {
3592
- // Synthetic-within-native is impossible. So if the nearest shadow component is
3593
- // synthetic, we know we won't find a native component if we go any further.
3594
- return null;
3595
- }
3596
- return owner;
3597
- }
3598
- function createStylesheet(vm, stylesheets) {
3599
- const { renderMode, shadowMode, renderer: { insertStylesheet }, } = vm;
3600
- if (renderMode === 1 /* RenderMode.Shadow */ && shadowMode === 1 /* ShadowMode.Synthetic */) {
3601
- for (let i = 0; i < stylesheets.length; i++) {
3602
- insertStylesheet(stylesheets[i]);
3603
- }
3604
- }
3605
- else if (!process.env.IS_BROWSER || vm.hydrated) {
3606
- // Note: We need to ensure that during hydration, the stylesheets method is the same as those in ssr.
3607
- // This works in the client, because the stylesheets are created, and cached in the VM
3608
- // the first time the VM renders.
3609
- // native shadow or light DOM, SSR
3610
- return ArrayMap.call(stylesheets, createInlineStyleVNode);
3611
- }
3612
- else {
3613
- // native shadow or light DOM, DOM renderer
3614
- const root = getNearestNativeShadowComponent(vm);
3615
- // null root means a global style
3616
- const target = isNull(root) ? undefined : root.shadowRoot;
3617
- for (let i = 0; i < stylesheets.length; i++) {
3618
- insertStylesheet(stylesheets[i], target);
3619
- }
3620
- }
3621
- return null;
3622
- }
3623
-
3624
- /*
3625
- * Copyright (c) 2018, salesforce.com, inc.
3715
+ * Copyright (c) 2024, Salesforce, Inc.
3626
3716
  * All rights reserved.
3627
3717
  * SPDX-License-Identifier: MIT
3628
3718
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
@@ -4142,7 +4232,7 @@ function hydrateStaticParts(vnode, renderer) {
4142
4232
  }
4143
4233
 
4144
4234
  /*
4145
- * Copyright (c) 2018, salesforce.com, inc.
4235
+ * Copyright (c) 2024, Salesforce, Inc.
4146
4236
  * All rights reserved.
4147
4237
  * SPDX-License-Identifier: MIT
4148
4238
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
@@ -4912,7 +5002,7 @@ function updateStaticChildren(c1, c2, parent, renderer) {
4912
5002
  }
4913
5003
 
4914
5004
  /*
4915
- * Copyright (c) 2018, salesforce.com, inc.
5005
+ * Copyright (c) 2024, Salesforce, Inc.
4916
5006
  * All rights reserved.
4917
5007
  * SPDX-License-Identifier: MIT
4918
5008
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
@@ -5194,6 +5284,7 @@ function i(iterable, factory) {
5194
5284
  ArrayPush$1.apply(list, vnode);
5195
5285
  }
5196
5286
  else {
5287
+ // `isArray` doesn't narrow this block properly...
5197
5288
  ArrayPush$1.call(list, vnode);
5198
5289
  }
5199
5290
  if (process.env.NODE_ENV !== 'production') {
@@ -5245,6 +5336,7 @@ function f(items) {
5245
5336
  ArrayPush$1.apply(flattened, item);
5246
5337
  }
5247
5338
  else {
5339
+ // `isArray` doesn't narrow this block properly...
5248
5340
  ArrayPush$1.call(flattened, item);
5249
5341
  }
5250
5342
  }
@@ -5574,7 +5666,7 @@ function logGlobalOperationEnd(opId, vm) {
5574
5666
  }
5575
5667
 
5576
5668
  /*
5577
- * Copyright (c) 2018, salesforce.com, inc.
5669
+ * Copyright (c) 2024, Salesforce, Inc.
5578
5670
  * All rights reserved.
5579
5671
  * SPDX-License-Identifier: MIT
5580
5672
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
@@ -7545,7 +7637,7 @@ function setHooks(hooks) {
7545
7637
  }
7546
7638
 
7547
7639
  /*
7548
- * Copyright (c) 2018, salesforce.com, inc.
7640
+ * Copyright (c) 2024, Salesforce, Inc.
7549
7641
  * All rights reserved.
7550
7642
  * SPDX-License-Identifier: MIT
7551
7643
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
@@ -7613,9 +7705,9 @@ function warnOnArrayMutation(stylesheets) {
7613
7705
  // we can at least warn when they use the most common mutation methods.
7614
7706
  for (const prop of ARRAY_MUTATION_METHODS) {
7615
7707
  const originalArrayMethod = getOriginalArrayMethod(prop);
7708
+ // Assertions used here because TypeScript can't handle mapping over our types
7616
7709
  stylesheets[prop] = function arrayMutationWarningWrapper() {
7617
7710
  reportTemplateViolation('stylesheets');
7618
- // @ts-expect-error can't properly determine the right `this`
7619
7711
  return originalArrayMethod.apply(this, arguments);
7620
7712
  };
7621
7713
  }
@@ -7801,5 +7893,5 @@ function readonly(obj) {
7801
7893
  }
7802
7894
 
7803
7895
  export { LightningElement, profilerControl as __unstable__ProfilerControl, reportingControl as __unstable__ReportingControl, api$1 as api, computeShadowAndRenderMode, connectRootElement, createContextProviderWithRegister, createVM, disconnectRootElement, freezeTemplate, getAssociatedVMIfPresent, getComponentAPIVersion, getComponentConstructor, getComponentDef, getComponentHtmlPrototype, hydrateRoot, isComponentConstructor, parseFragment, parseSVGFragment, readonly, registerComponent, registerDecorators, registerTemplate, runFormAssociatedCallback, runFormDisabledCallback, runFormResetCallback, runFormStateRestoreCallback, sanitizeAttribute, setHooks, shouldBeFormAssociated, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };
7804
- /** version: 6.5.1 */
7896
+ /** version: 6.5.3 */
7805
7897
  //# sourceMappingURL=index.js.map