@lwc/engine-core 2.5.10 → 2.6.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.
@@ -1,5 +1,5 @@
1
1
  /* proxy-compat-disable */
2
- import { seal, create, isFunction as isFunction$1, ArrayPush as ArrayPush$1, isUndefined as isUndefined$1, ArrayIndexOf, ArraySplice, StringToLowerCase, ArrayJoin, isNull, assign, assert, keys, StringCharCodeAt, isString, StringSlice, freeze, defineProperties, forEach, getOwnPropertyNames as getOwnPropertyNames$1, getPrototypeOf as getPrototypeOf$1, setPrototypeOf, getPropertyDescriptor, isObject, AriaPropNameToAttrNameMap, defineProperty, KEY__SYNTHETIC_MODE, toString as toString$1, isFalse, isTrue, getOwnPropertyDescriptor as getOwnPropertyDescriptor$1, htmlPropertyToAttribute, ArraySlice, hasOwnProperty as hasOwnProperty$1, ArrayFilter, noop, isArray as isArray$1, isNumber, StringReplace, KEY__SHADOW_RESOLVER, KEY__SCOPED_CSS, ArrayUnshift, isFrozen } from '@lwc/shared';
2
+ import { seal, create, isFunction as isFunction$1, ArrayPush as ArrayPush$1, isUndefined as isUndefined$1, ArrayIndexOf, ArraySplice, StringToLowerCase, ArrayJoin, isNull, assign, assert, keys, StringCharCodeAt, isString, StringSlice, freeze, defineProperties, forEach, getOwnPropertyNames as getOwnPropertyNames$1, getPrototypeOf as getPrototypeOf$1, setPrototypeOf, getPropertyDescriptor, isObject, AriaPropNameToAttrNameMap, defineProperty, KEY__SYNTHETIC_MODE, toString as toString$1, isFalse, isTrue, getOwnPropertyDescriptor as getOwnPropertyDescriptor$1, htmlPropertyToAttribute, ArraySlice, hasOwnProperty as hasOwnProperty$1, ArrayFilter, isArray as isArray$1, isNumber, StringReplace, KEY__SHADOW_RESOLVER, KEY__SCOPED_CSS, noop, ArrayUnshift, isFrozen } from '@lwc/shared';
3
3
  import { runtimeFlags } from '@lwc/features';
4
4
  export { setFeatureFlag, setFeatureFlagForTest } from '@lwc/features';
5
5
 
@@ -70,6 +70,170 @@ function parseStyleText(cssText) {
70
70
  return styleMap;
71
71
  }
72
72
 
73
+ //
74
+ // Primitives
75
+ //
76
+ let ssr;
77
+ function setSsr(ssrImpl) {
78
+ ssr = ssrImpl;
79
+ }
80
+ let isNativeShadowDefined;
81
+ function setIsNativeShadowDefined(isNativeShadowDefinedImpl) {
82
+ isNativeShadowDefined = isNativeShadowDefinedImpl;
83
+ }
84
+ let isSyntheticShadowDefined;
85
+ function setIsSyntheticShadowDefined(isSyntheticShadowDefinedImpl) {
86
+ isSyntheticShadowDefined = isSyntheticShadowDefinedImpl;
87
+ }
88
+ let HTMLElementExported;
89
+ function setHTMLElement(HTMLElementImpl) {
90
+ HTMLElementExported = HTMLElementImpl;
91
+ }
92
+ let isHydrating;
93
+ function setIsHydrating(isHydratingImpl) {
94
+ isHydrating = isHydratingImpl;
95
+ }
96
+ let insert;
97
+ function setInsert(insertImpl) {
98
+ insert = insertImpl;
99
+ }
100
+ let remove;
101
+ function setRemove(removeImpl) {
102
+ remove = removeImpl;
103
+ }
104
+ let createElement;
105
+ function setCreateElement(createElementImpl) {
106
+ createElement = createElementImpl;
107
+ }
108
+ let createText;
109
+ function setCreateText(createTextImpl) {
110
+ createText = createTextImpl;
111
+ }
112
+ let createComment;
113
+ function setCreateComment(createCommentImpl) {
114
+ createComment = createCommentImpl;
115
+ }
116
+ let nextSibling;
117
+ function setNextSibling(nextSiblingImpl) {
118
+ nextSibling = nextSiblingImpl;
119
+ }
120
+ let attachShadow;
121
+ function setAttachShadow(attachShadowImpl) {
122
+ attachShadow = attachShadowImpl;
123
+ }
124
+ let getProperty;
125
+ function setGetProperty(getPropertyImpl) {
126
+ getProperty = getPropertyImpl;
127
+ }
128
+ let setProperty;
129
+ function setSetProperty(setPropertyImpl) {
130
+ setProperty = setPropertyImpl;
131
+ }
132
+ let setText;
133
+ function setSetText(setTextImpl) {
134
+ setText = setTextImpl;
135
+ }
136
+ let getAttribute;
137
+ function setGetAttribute(getAttributeImpl) {
138
+ getAttribute = getAttributeImpl;
139
+ }
140
+ let setAttribute;
141
+ function setSetAttribute(setAttributeImpl) {
142
+ setAttribute = setAttributeImpl;
143
+ }
144
+ let removeAttribute;
145
+ function setRemoveAttribute(removeAttributeImpl) {
146
+ removeAttribute = removeAttributeImpl;
147
+ }
148
+ let addEventListener;
149
+ function setAddEventListener(addEventListenerImpl) {
150
+ addEventListener = addEventListenerImpl;
151
+ }
152
+ let removeEventListener;
153
+ function setRemoveEventListener(removeEventListenerImpl) {
154
+ removeEventListener = removeEventListenerImpl;
155
+ }
156
+ let dispatchEvent;
157
+ function setDispatchEvent(dispatchEventImpl) {
158
+ dispatchEvent = dispatchEventImpl;
159
+ }
160
+ let getClassList;
161
+ function setGetClassList(getClassListImpl) {
162
+ getClassList = getClassListImpl;
163
+ }
164
+ let setCSSStyleProperty;
165
+ function setSetCSSStyleProperty(setCSSStylePropertyImpl) {
166
+ setCSSStyleProperty = setCSSStylePropertyImpl;
167
+ }
168
+ let getBoundingClientRect;
169
+ function setGetBoundingClientRect(getBoundingClientRectImpl) {
170
+ getBoundingClientRect = getBoundingClientRectImpl;
171
+ }
172
+ let querySelector;
173
+ function setQuerySelector(querySelectorImpl) {
174
+ querySelector = querySelectorImpl;
175
+ }
176
+ let querySelectorAll;
177
+ function setQuerySelectorAll(querySelectorAllImpl) {
178
+ querySelectorAll = querySelectorAllImpl;
179
+ }
180
+ let getElementsByTagName;
181
+ function setGetElementsByTagName(getElementsByTagNameImpl) {
182
+ getElementsByTagName = getElementsByTagNameImpl;
183
+ }
184
+ let getElementsByClassName;
185
+ function setGetElementsByClassName(getElementsByClassNameImpl) {
186
+ getElementsByClassName = getElementsByClassNameImpl;
187
+ }
188
+ let getChildren;
189
+ function setGetChildren(getChildrenImpl) {
190
+ getChildren = getChildrenImpl;
191
+ }
192
+ let getChildNodes;
193
+ function setGetChildNodes(getChildNodesImpl) {
194
+ getChildNodes = getChildNodesImpl;
195
+ }
196
+ let getFirstChild;
197
+ function setGetFirstChild(getFirstChildImpl) {
198
+ getFirstChild = getFirstChildImpl;
199
+ }
200
+ let getFirstElementChild;
201
+ function setGetFirstElementChild(getFirstElementChildImpl) {
202
+ getFirstElementChild = getFirstElementChildImpl;
203
+ }
204
+ let getLastChild;
205
+ function setGetLastChild(getLastChildImpl) {
206
+ getLastChild = getLastChildImpl;
207
+ }
208
+ let getLastElementChild;
209
+ function setGetLastElementChild(getLastElementChildImpl) {
210
+ getLastElementChild = getLastElementChildImpl;
211
+ }
212
+ let isConnected;
213
+ function setIsConnected(isConnectedImpl) {
214
+ isConnected = isConnectedImpl;
215
+ }
216
+ let insertGlobalStylesheet;
217
+ function setInsertGlobalStylesheet(insertGlobalStylesheetImpl) {
218
+ insertGlobalStylesheet = insertGlobalStylesheetImpl;
219
+ }
220
+ let insertStylesheet;
221
+ function setInsertStylesheet(insertStylesheetImpl) {
222
+ insertStylesheet = insertStylesheetImpl;
223
+ }
224
+ let assertInstanceOfHTMLElement;
225
+ function setAssertInstanceOfHTMLElement(assertInstanceOfHTMLElementImpl) {
226
+ assertInstanceOfHTMLElement = assertInstanceOfHTMLElementImpl;
227
+ }
228
+ let defineCustomElement;
229
+ function setDefineCustomElement(defineCustomElementImpl) {
230
+ defineCustomElement = defineCustomElementImpl;
231
+ }
232
+ let getCustomElement;
233
+ function setGetCustomElement(getCustomElementImpl) {
234
+ getCustomElement = getCustomElementImpl;
235
+ }
236
+
73
237
  /*
74
238
  * Copyright (c) 2019, salesforce.com, inc.
75
239
  * All rights reserved.
@@ -311,9 +475,6 @@ function createAllEventListeners(vnode) {
311
475
  elm,
312
476
  data: {
313
477
  on
314
- },
315
- owner: {
316
- renderer
317
478
  }
318
479
  } = vnode;
319
480
 
@@ -326,7 +487,7 @@ function createAllEventListeners(vnode) {
326
487
  let name;
327
488
 
328
489
  for (name in on) {
329
- renderer.addEventListener(elm, name, listener);
490
+ addEventListener(elm, name, listener);
330
491
  }
331
492
  }
332
493
 
@@ -465,9 +626,6 @@ function updateAttrs(oldVnode, vnode) {
465
626
  const {
466
627
  data: {
467
628
  attrs
468
- },
469
- owner: {
470
- renderer
471
629
  }
472
630
  } = vnode;
473
631
 
@@ -490,10 +648,6 @@ function updateAttrs(oldVnode, vnode) {
490
648
  }
491
649
 
492
650
  const elm = vnode.elm;
493
- const {
494
- setAttribute,
495
- removeAttribute
496
- } = renderer;
497
651
  let key;
498
652
  oldAttrs = isUndefined$1(oldAttrs) ? EmptyObject : oldAttrs; // update modified attributes, add new attributes
499
653
  // this routine is only useful for data-* attributes in all kind of elements
@@ -512,7 +666,7 @@ function updateAttrs(oldVnode, vnode) {
512
666
  } else if (StringCharCodeAt.call(key, 5) === ColonCharCode) {
513
667
  // Assume xlink namespace
514
668
  setAttribute(elm, key, cur, xlinkNS);
515
- } else if (isNull(cur)) {
669
+ } else if (isNull(cur) || isUndefined$1(cur)) {
516
670
  removeAttribute(elm, key);
517
671
  } else {
518
672
  setAttribute(elm, key, cur);
@@ -564,17 +718,14 @@ function update(oldVnode, vnode) {
564
718
  const isFirstPatch = isUndefined$1(oldProps);
565
719
  const {
566
720
  elm,
567
- sel,
568
- owner: {
569
- renderer
570
- }
721
+ sel
571
722
  } = vnode;
572
723
 
573
724
  for (const key in props) {
574
725
  const cur = props[key]; // if it is the first time this element is patched, or the current value is different to the previous value...
575
726
 
576
- if (isFirstPatch || cur !== (isLiveBindingProp(sel, key) ? renderer.getProperty(elm, key) : oldProps[key])) {
577
- renderer.setProperty(elm, key, cur);
727
+ if (isFirstPatch || cur !== (isLiveBindingProp(sel, key) ? getProperty(elm, key) : oldProps[key])) {
728
+ setProperty(elm, key, cur);
578
729
  }
579
730
  }
580
731
  }
@@ -643,9 +794,6 @@ function updateClassAttribute(oldVnode, vnode) {
643
794
  elm,
644
795
  data: {
645
796
  className: newClass
646
- },
647
- owner: {
648
- renderer
649
797
  }
650
798
  } = vnode;
651
799
  const {
@@ -658,7 +806,7 @@ function updateClassAttribute(oldVnode, vnode) {
658
806
  return;
659
807
  }
660
808
 
661
- const classList = renderer.getClassList(elm);
809
+ const classList = getClassList(elm);
662
810
  const newClassMap = getMapFromClassName(newClass);
663
811
  const oldClassMap = getMapFromClassName(oldClass);
664
812
  let name;
@@ -697,15 +845,8 @@ function updateStyleAttribute(oldVnode, vnode) {
697
845
  elm,
698
846
  data: {
699
847
  style: newStyle
700
- },
701
- owner: {
702
- renderer
703
848
  }
704
849
  } = vnode;
705
- const {
706
- setAttribute,
707
- removeAttribute
708
- } = renderer;
709
850
 
710
851
  if (oldVnode.data.style === newStyle) {
711
852
  return;
@@ -740,9 +881,6 @@ function createClassAttribute(vnode) {
740
881
  elm,
741
882
  data: {
742
883
  classMap
743
- },
744
- owner: {
745
- renderer
746
884
  }
747
885
  } = vnode;
748
886
 
@@ -750,7 +888,7 @@ function createClassAttribute(vnode) {
750
888
  return;
751
889
  }
752
890
 
753
- const classList = renderer.getClassList(elm);
891
+ const classList = getClassList(elm);
754
892
 
755
893
  for (const name in classMap) {
756
894
  classList.add(name);
@@ -775,9 +913,6 @@ function createStyleAttribute(vnode) {
775
913
  elm,
776
914
  data: {
777
915
  styleDecls
778
- },
779
- owner: {
780
- renderer
781
916
  }
782
917
  } = vnode;
783
918
 
@@ -787,7 +922,7 @@ function createStyleAttribute(vnode) {
787
922
 
788
923
  for (let i = 0; i < styleDecls.length; i++) {
789
924
  const [prop, value, important] = styleDecls[i];
790
- renderer.setCSSStyleProperty(elm, prop, value, important);
925
+ setCSSStyleProperty(elm, prop, value, important);
791
926
  }
792
927
  }
793
928
 
@@ -802,14 +937,6 @@ var modStaticStyle = {
802
937
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
803
938
  */
804
939
 
805
- /**
806
- @license
807
- Copyright (c) 2015 Simon Friis Vindum.
808
- This code may only be used under the MIT License found at
809
- https://github.com/snabbdom/snabbdom/blob/master/LICENSE
810
- Code distributed by Snabbdom as part of the Snabbdom project at
811
- https://github.com/snabbdom/snabbdom/
812
- */
813
940
  function isUndef(s) {
814
941
  return s === undefined;
815
942
  }
@@ -897,7 +1024,7 @@ function updateDynamicChildren(parentElm, oldCh, newCh) {
897
1024
  } else if (sameVnode(oldStartVnode, newEndVnode)) {
898
1025
  // Vnode moved right
899
1026
  patchVnode(oldStartVnode, newEndVnode);
900
- newEndVnode.hook.move(oldStartVnode, parentElm, oldEndVnode.owner.renderer.nextSibling(oldEndVnode.elm));
1027
+ newEndVnode.hook.move(oldStartVnode, parentElm, nextSibling(oldEndVnode.elm));
901
1028
  oldStartVnode = oldCh[++oldStartIdx];
902
1029
  newEndVnode = newCh[--newEndIdx];
903
1030
  } else if (sameVnode(oldEndVnode, newStartVnode)) {
@@ -1374,7 +1501,7 @@ function patchLightningElementPrototypeWithRestrictions(proto) {
1374
1501
  }
1375
1502
 
1376
1503
  /*
1377
- * Copyright (c) 2020, salesforce.com, inc.
1504
+ * Copyright (c) 2018, salesforce.com, inc.
1378
1505
  * All rights reserved.
1379
1506
  * SPDX-License-Identifier: MIT
1380
1507
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
@@ -1425,6 +1552,7 @@ const {
1425
1552
  isArray
1426
1553
  } = Array;
1427
1554
  const {
1555
+ prototype: ObjectDotPrototype,
1428
1556
  getPrototypeOf,
1429
1557
  create: ObjectCreate,
1430
1558
  defineProperty: ObjectDefineProperty,
@@ -2074,8 +2202,6 @@ if (process.env.NODE_ENV !== 'production') {
2074
2202
  init();
2075
2203
  }
2076
2204
 
2077
- const ObjectDotPrototype = Object.prototype;
2078
-
2079
2205
  function defaultValueIsObservable(value) {
2080
2206
  // intentionally checking for null
2081
2207
  if (value === null) {
@@ -2103,99 +2229,85 @@ const defaultValueMutated = (obj, key) => {
2103
2229
  /* do nothing */
2104
2230
  };
2105
2231
 
2106
- const defaultValueDistortion = value => value;
2107
-
2108
2232
  function createShadowTarget(value) {
2109
2233
  return isArray(value) ? [] : {};
2110
2234
  }
2111
2235
 
2112
- class ReactiveMembrane {
2113
- constructor(options) {
2114
- this.valueDistortion = defaultValueDistortion;
2115
- this.valueMutated = defaultValueMutated;
2116
- this.valueObserved = defaultValueObserved;
2117
- this.valueIsObservable = defaultValueIsObservable;
2236
+ class ObservableMembrane {
2237
+ constructor(options = {}) {
2118
2238
  this.readOnlyObjectGraph = new WeakMap();
2119
2239
  this.reactiveObjectGraph = new WeakMap();
2120
-
2121
- if (!isUndefined(options)) {
2122
- const {
2123
- valueDistortion,
2124
- valueMutated,
2125
- valueObserved,
2126
- valueIsObservable,
2127
- tagPropertyKey
2128
- } = options;
2129
- this.valueDistortion = isFunction(valueDistortion) ? valueDistortion : defaultValueDistortion;
2130
- this.valueMutated = isFunction(valueMutated) ? valueMutated : defaultValueMutated;
2131
- this.valueObserved = isFunction(valueObserved) ? valueObserved : defaultValueObserved;
2132
- this.valueIsObservable = isFunction(valueIsObservable) ? valueIsObservable : defaultValueIsObservable;
2133
- this.tagPropertyKey = tagPropertyKey;
2134
- }
2240
+ const {
2241
+ valueMutated,
2242
+ valueObserved,
2243
+ valueIsObservable,
2244
+ tagPropertyKey
2245
+ } = options;
2246
+ this.valueMutated = isFunction(valueMutated) ? valueMutated : defaultValueMutated;
2247
+ this.valueObserved = isFunction(valueObserved) ? valueObserved : defaultValueObserved;
2248
+ this.valueIsObservable = isFunction(valueIsObservable) ? valueIsObservable : defaultValueIsObservable;
2249
+ this.tagPropertyKey = tagPropertyKey;
2135
2250
  }
2136
2251
 
2137
2252
  getProxy(value) {
2138
2253
  const unwrappedValue = unwrap$1(value);
2139
- const distorted = this.valueDistortion(unwrappedValue);
2140
2254
 
2141
- if (this.valueIsObservable(distorted)) {
2142
- if (this.readOnlyObjectGraph.get(distorted) === value) {
2143
- // when trying to extract the writable version of a readonly
2144
- // we return the readonly.
2255
+ if (this.valueIsObservable(unwrappedValue)) {
2256
+ // When trying to extract the writable version of a readonly we return the readonly.
2257
+ if (this.readOnlyObjectGraph.get(unwrappedValue) === value) {
2145
2258
  return value;
2146
2259
  }
2147
2260
 
2148
- return this.getReactiveHandler(unwrappedValue, distorted);
2261
+ return this.getReactiveHandler(unwrappedValue);
2149
2262
  }
2150
2263
 
2151
- return distorted;
2264
+ return unwrappedValue;
2152
2265
  }
2153
2266
 
2154
2267
  getReadOnlyProxy(value) {
2155
2268
  value = unwrap$1(value);
2156
- const distorted = this.valueDistortion(value);
2157
2269
 
2158
- if (this.valueIsObservable(distorted)) {
2159
- return this.getReadOnlyHandler(value, distorted);
2270
+ if (this.valueIsObservable(value)) {
2271
+ return this.getReadOnlyHandler(value);
2160
2272
  }
2161
2273
 
2162
- return distorted;
2274
+ return value;
2163
2275
  }
2164
2276
 
2165
2277
  unwrapProxy(p) {
2166
2278
  return unwrap$1(p);
2167
2279
  }
2168
2280
 
2169
- getReactiveHandler(value, distortedValue) {
2170
- let proxy = this.reactiveObjectGraph.get(distortedValue);
2281
+ getReactiveHandler(value) {
2282
+ let proxy = this.reactiveObjectGraph.get(value);
2171
2283
 
2172
2284
  if (isUndefined(proxy)) {
2173
2285
  // caching the proxy after the first time it is accessed
2174
- const handler = new ReactiveProxyHandler(this, distortedValue);
2175
- proxy = new Proxy(createShadowTarget(distortedValue), handler);
2286
+ const handler = new ReactiveProxyHandler(this, value);
2287
+ proxy = new Proxy(createShadowTarget(value), handler);
2176
2288
  registerProxy(proxy, value);
2177
- this.reactiveObjectGraph.set(distortedValue, proxy);
2289
+ this.reactiveObjectGraph.set(value, proxy);
2178
2290
  }
2179
2291
 
2180
2292
  return proxy;
2181
2293
  }
2182
2294
 
2183
- getReadOnlyHandler(value, distortedValue) {
2184
- let proxy = this.readOnlyObjectGraph.get(distortedValue);
2295
+ getReadOnlyHandler(value) {
2296
+ let proxy = this.readOnlyObjectGraph.get(value);
2185
2297
 
2186
2298
  if (isUndefined(proxy)) {
2187
2299
  // caching the proxy after the first time it is accessed
2188
- const handler = new ReadOnlyHandler(this, distortedValue);
2189
- proxy = new Proxy(createShadowTarget(distortedValue), handler);
2300
+ const handler = new ReadOnlyHandler(this, value);
2301
+ proxy = new Proxy(createShadowTarget(value), handler);
2190
2302
  registerProxy(proxy, value);
2191
- this.readOnlyObjectGraph.set(distortedValue, proxy);
2303
+ this.readOnlyObjectGraph.set(value, proxy);
2192
2304
  }
2193
2305
 
2194
2306
  return proxy;
2195
2307
  }
2196
2308
 
2197
2309
  }
2198
- /** version: 1.1.5 */
2310
+ /** version: 2.0.0 */
2199
2311
 
2200
2312
  /*
2201
2313
  * Copyright (c) 2018, salesforce.com, inc.
@@ -2204,15 +2316,9 @@ class ReactiveMembrane {
2204
2316
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
2205
2317
  */
2206
2318
  const lockerLivePropertyKey = Symbol.for('@@lockerLiveValue');
2207
-
2208
- function valueDistortion(value) {
2209
- return value;
2210
- }
2211
-
2212
- const reactiveMembrane = new ReactiveMembrane({
2319
+ const reactiveMembrane = new ObservableMembrane({
2213
2320
  valueObserved,
2214
2321
  valueMutated,
2215
- valueDistortion,
2216
2322
  tagPropertyKey: lockerLivePropertyKey
2217
2323
  });
2218
2324
  /**
@@ -2221,16 +2327,9 @@ const reactiveMembrane = new ReactiveMembrane({
2221
2327
  * change or being removed.
2222
2328
  */
2223
2329
 
2224
- const unwrap = function (value) {
2225
- const unwrapped = reactiveMembrane.unwrapProxy(value);
2226
-
2227
- if (unwrapped !== value) {
2228
- // if value is a proxy, unwrap to access original value and apply distortion
2229
- return valueDistortion(unwrapped);
2230
- }
2231
-
2232
- return value;
2233
- };
2330
+ function unwrap(value) {
2331
+ return reactiveMembrane.unwrapProxy(value);
2332
+ }
2234
2333
 
2235
2334
  /*
2236
2335
  * Copyright (c) 2018, salesforce.com, inc.
@@ -2317,9 +2416,7 @@ function createBridgeToElementDescriptor(propName, descriptor) {
2317
2416
 
2318
2417
 
2319
2418
  const LightningElement = function () {
2320
- var _a; // This should be as performant as possible, while any initialization should be done lazily
2321
-
2322
-
2419
+ // This should be as performant as possible, while any initialization should be done lazily
2323
2420
  if (isNull(vmBeingConstructed)) {
2324
2421
  throw new ReferenceError('Illegal constructor');
2325
2422
  }
@@ -2327,15 +2424,14 @@ const LightningElement = function () {
2327
2424
  const vm = vmBeingConstructed;
2328
2425
  const {
2329
2426
  def,
2330
- elm,
2331
- renderer
2427
+ elm
2332
2428
  } = vm;
2333
2429
  const {
2334
2430
  bridge
2335
2431
  } = def;
2336
2432
 
2337
2433
  if (process.env.NODE_ENV !== 'production') {
2338
- (_a = renderer.assertInstanceOfHTMLElement) === null || _a === void 0 ? void 0 : _a.call(renderer, vm.elm, `Component creation requires a DOM element to be associated to ${vm}.`);
2434
+ assertInstanceOfHTMLElement(vm.elm, `Component creation requires a DOM element to be associated to ${vm}.`);
2339
2435
  }
2340
2436
 
2341
2437
  const component = this;
@@ -2365,7 +2461,7 @@ const LightningElement = function () {
2365
2461
  if (vm.renderMode === 1
2366
2462
  /* Shadow */
2367
2463
  ) {
2368
- attachShadow(vm);
2464
+ doAttachShadow(vm);
2369
2465
  } // Adding extra guard rails in DEV mode.
2370
2466
 
2371
2467
 
@@ -2377,17 +2473,16 @@ const LightningElement = function () {
2377
2473
  return this;
2378
2474
  };
2379
2475
 
2380
- function attachShadow(vm) {
2476
+ function doAttachShadow(vm) {
2381
2477
  const {
2382
2478
  elm,
2383
2479
  mode,
2384
- renderer,
2385
2480
  shadowMode,
2386
2481
  def: {
2387
2482
  ctor
2388
2483
  }
2389
2484
  } = vm;
2390
- const cmpRoot = renderer.attachShadow(elm, {
2485
+ const cmpRoot = attachShadow(elm, {
2391
2486
  [KEY__SYNTHETIC_MODE]: shadowMode === 1
2392
2487
  /* Synthetic */
2393
2488
  ,
@@ -2414,10 +2509,7 @@ LightningElement.prototype = {
2414
2509
 
2415
2510
  dispatchEvent(event) {
2416
2511
  const {
2417
- elm,
2418
- renderer: {
2419
- dispatchEvent
2420
- }
2512
+ elm
2421
2513
  } = getAssociatedVM(this);
2422
2514
  return dispatchEvent(elm, event);
2423
2515
  },
@@ -2425,10 +2517,7 @@ LightningElement.prototype = {
2425
2517
  addEventListener(type, listener, options) {
2426
2518
  const vm = getAssociatedVM(this);
2427
2519
  const {
2428
- elm,
2429
- renderer: {
2430
- addEventListener
2431
- }
2520
+ elm
2432
2521
  } = vm;
2433
2522
 
2434
2523
  if (process.env.NODE_ENV !== 'production') {
@@ -2445,10 +2534,7 @@ LightningElement.prototype = {
2445
2534
  removeEventListener(type, listener, options) {
2446
2535
  const vm = getAssociatedVM(this);
2447
2536
  const {
2448
- elm,
2449
- renderer: {
2450
- removeEventListener
2451
- }
2537
+ elm
2452
2538
  } = vm;
2453
2539
  const wrappedListener = getWrappedComponentsListener(vm, listener);
2454
2540
  removeEventListener(elm, type, wrappedListener, options);
@@ -2456,30 +2542,21 @@ LightningElement.prototype = {
2456
2542
 
2457
2543
  hasAttribute(name) {
2458
2544
  const {
2459
- elm,
2460
- renderer: {
2461
- getAttribute
2462
- }
2545
+ elm
2463
2546
  } = getAssociatedVM(this);
2464
2547
  return !isNull(getAttribute(elm, name));
2465
2548
  },
2466
2549
 
2467
2550
  hasAttributeNS(namespace, name) {
2468
2551
  const {
2469
- elm,
2470
- renderer: {
2471
- getAttribute
2472
- }
2552
+ elm
2473
2553
  } = getAssociatedVM(this);
2474
2554
  return !isNull(getAttribute(elm, name, namespace));
2475
2555
  },
2476
2556
 
2477
2557
  removeAttribute(name) {
2478
2558
  const {
2479
- elm,
2480
- renderer: {
2481
- removeAttribute
2482
- }
2559
+ elm
2483
2560
  } = getAssociatedVM(this);
2484
2561
  unlockAttribute(elm, name);
2485
2562
  removeAttribute(elm, name);
@@ -2488,10 +2565,7 @@ LightningElement.prototype = {
2488
2565
 
2489
2566
  removeAttributeNS(namespace, name) {
2490
2567
  const {
2491
- elm,
2492
- renderer: {
2493
- removeAttribute
2494
- }
2568
+ elm
2495
2569
  } = getAssociatedVM(this);
2496
2570
  unlockAttribute(elm, name);
2497
2571
  removeAttribute(elm, name, namespace);
@@ -2500,20 +2574,14 @@ LightningElement.prototype = {
2500
2574
 
2501
2575
  getAttribute(name) {
2502
2576
  const {
2503
- elm,
2504
- renderer: {
2505
- getAttribute
2506
- }
2577
+ elm
2507
2578
  } = getAssociatedVM(this);
2508
2579
  return getAttribute(elm, name);
2509
2580
  },
2510
2581
 
2511
2582
  getAttributeNS(namespace, name) {
2512
2583
  const {
2513
- elm,
2514
- renderer: {
2515
- getAttribute
2516
- }
2584
+ elm
2517
2585
  } = getAssociatedVM(this);
2518
2586
  return getAttribute(elm, name, namespace);
2519
2587
  },
@@ -2521,10 +2589,7 @@ LightningElement.prototype = {
2521
2589
  setAttribute(name, value) {
2522
2590
  const vm = getAssociatedVM(this);
2523
2591
  const {
2524
- elm,
2525
- renderer: {
2526
- setAttribute
2527
- }
2592
+ elm
2528
2593
  } = vm;
2529
2594
 
2530
2595
  if (process.env.NODE_ENV !== 'production') {
@@ -2539,10 +2604,7 @@ LightningElement.prototype = {
2539
2604
  setAttributeNS(namespace, name, value) {
2540
2605
  const vm = getAssociatedVM(this);
2541
2606
  const {
2542
- elm,
2543
- renderer: {
2544
- setAttribute
2545
- }
2607
+ elm
2546
2608
  } = vm;
2547
2609
 
2548
2610
  if (process.env.NODE_ENV !== 'production') {
@@ -2557,10 +2619,7 @@ LightningElement.prototype = {
2557
2619
  getBoundingClientRect() {
2558
2620
  const vm = getAssociatedVM(this);
2559
2621
  const {
2560
- elm,
2561
- renderer: {
2562
- getBoundingClientRect
2563
- }
2622
+ elm
2564
2623
  } = vm;
2565
2624
 
2566
2625
  if (process.env.NODE_ENV !== 'production') {
@@ -2572,10 +2631,7 @@ LightningElement.prototype = {
2572
2631
 
2573
2632
  get isConnected() {
2574
2633
  const {
2575
- elm,
2576
- renderer: {
2577
- isConnected
2578
- }
2634
+ elm
2579
2635
  } = getAssociatedVM(this);
2580
2636
  return isConnected(elm);
2581
2637
  },
@@ -2583,10 +2639,7 @@ LightningElement.prototype = {
2583
2639
  get classList() {
2584
2640
  const vm = getAssociatedVM(this);
2585
2641
  const {
2586
- elm,
2587
- renderer: {
2588
- getClassList
2589
- }
2642
+ elm
2590
2643
  } = vm;
2591
2644
 
2592
2645
  if (process.env.NODE_ENV !== 'production') {
@@ -2629,23 +2682,48 @@ LightningElement.prototype = {
2629
2682
  }
2630
2683
 
2631
2684
  };
2632
- const queryAndChildGetterDescriptors = create(null);
2633
- const childGetters = [['children', 'getChildren'], ['childNodes', 'getChildNodes'], ['firstChild', 'getFirstChild'], ['firstElementChild', 'getFirstElementChild'], ['lastChild', 'getLastChild'], ['lastElementChild', 'getLastElementChild']]; // Generic passthrough for child getters on HTMLElement to the relevant Renderer APIs
2685
+ const queryAndChildGetterDescriptors = create(null); // The reason we don't just call `import * as renderer from '../renderer'` here is that the bundle size
2686
+ // is smaller if we reference each function individually. Otherwise Rollup will create one big frozen
2687
+ // object representing the renderer, with a lot of methods we don't actually need.
2688
+
2689
+ const childGetters = ['children', 'childNodes', 'firstChild', 'firstElementChild', 'lastChild', 'lastElementChild'];
2690
+
2691
+ function getChildGetter(methodName) {
2692
+ switch (methodName) {
2693
+ case 'children':
2694
+ return getChildren;
2695
+
2696
+ case 'childNodes':
2697
+ return getChildNodes;
2698
+
2699
+ case 'firstChild':
2700
+ return getFirstChild;
2701
+
2702
+ case 'firstElementChild':
2703
+ return getFirstElementChild;
2634
2704
 
2635
- for (const [elementProp, rendererMethod] of childGetters) {
2636
- queryAndChildGetterDescriptors[elementProp] = {
2705
+ case 'lastChild':
2706
+ return getLastChild;
2707
+
2708
+ case 'lastElementChild':
2709
+ return getLastElementChild;
2710
+ }
2711
+ } // Generic passthrough for child getters on HTMLElement to the relevant Renderer APIs
2712
+
2713
+
2714
+ for (const childGetter of childGetters) {
2715
+ queryAndChildGetterDescriptors[childGetter] = {
2637
2716
  get() {
2638
2717
  const vm = getAssociatedVM(this);
2639
2718
  const {
2640
- elm,
2641
- renderer
2719
+ elm
2642
2720
  } = vm;
2643
2721
 
2644
2722
  if (process.env.NODE_ENV !== 'production') {
2645
- warnIfInvokedDuringConstruction(vm, elementProp);
2723
+ warnIfInvokedDuringConstruction(vm, childGetter);
2646
2724
  }
2647
2725
 
2648
- return renderer[rendererMethod](elm);
2726
+ return getChildGetter(childGetter)(elm);
2649
2727
  },
2650
2728
 
2651
2729
  configurable: true,
@@ -2653,22 +2731,38 @@ for (const [elementProp, rendererMethod] of childGetters) {
2653
2731
  };
2654
2732
  }
2655
2733
 
2656
- const queryMethods = ['getElementsByClassName', 'getElementsByTagName', 'querySelector', 'querySelectorAll']; // Generic passthrough for query APIs on HTMLElement to the relevant Renderer APIs
2734
+ const queryMethods = ['getElementsByClassName', 'getElementsByTagName', 'querySelector', 'querySelectorAll'];
2735
+
2736
+ function getQueryMethod(methodName) {
2737
+ switch (methodName) {
2738
+ case 'getElementsByClassName':
2739
+ return getElementsByClassName;
2740
+
2741
+ case 'getElementsByTagName':
2742
+ return getElementsByTagName;
2743
+
2744
+ case 'querySelector':
2745
+ return querySelector;
2746
+
2747
+ case 'querySelectorAll':
2748
+ return querySelectorAll;
2749
+ }
2750
+ } // Generic passthrough for query APIs on HTMLElement to the relevant Renderer APIs
2751
+
2657
2752
 
2658
2753
  for (const queryMethod of queryMethods) {
2659
2754
  queryAndChildGetterDescriptors[queryMethod] = {
2660
2755
  value(arg) {
2661
2756
  const vm = getAssociatedVM(this);
2662
2757
  const {
2663
- elm,
2664
- renderer
2758
+ elm
2665
2759
  } = vm;
2666
2760
 
2667
2761
  if (process.env.NODE_ENV !== 'production') {
2668
2762
  warnIfInvokedDuringConstruction(vm, `${queryMethod}()`);
2669
2763
  }
2670
2764
 
2671
- return renderer[queryMethod](elm, arg);
2765
+ return getQueryMethod(queryMethod)(elm, arg);
2672
2766
  },
2673
2767
 
2674
2768
  configurable: true,
@@ -3798,10 +3892,6 @@ function createComponentDef(Ctor) {
3798
3892
 
3799
3893
  assert.isTrue(Ctor.constructor, `Missing ${ctorName}.constructor, ${ctorName} should have a "constructor" property.`);
3800
3894
 
3801
- if (!runtimeFlags.ENABLE_MIXED_SHADOW_MODE) {
3802
- assert.isFalse('shadowSupportMode' in Ctor, `${ctorName || 'Anonymous class'} is an invalid LWC component. The shadowSupportMode static property is not available in this environment.`);
3803
- }
3804
-
3805
3895
  if (!isUndefined$1(ctorShadowSupportMode)) {
3806
3896
  assert.invariant(ctorShadowSupportMode === "any"
3807
3897
  /* Any */
@@ -4043,17 +4133,14 @@ function setScopeTokenClassIfNecessary(elm, owner) {
4043
4133
  const token = cmpTemplate === null || cmpTemplate === void 0 ? void 0 : cmpTemplate.stylesheetToken;
4044
4134
 
4045
4135
  if (!isUndefined$1(token) && context.hasScopedStyles) {
4046
- owner.renderer.getClassList(elm).add(token);
4136
+ getClassList(elm).add(token);
4047
4137
  }
4048
4138
  }
4049
4139
 
4050
4140
  function updateNodeHook(oldVnode, vnode) {
4051
4141
  const {
4052
4142
  elm,
4053
- text,
4054
- owner: {
4055
- renderer
4056
- }
4143
+ text
4057
4144
  } = vnode;
4058
4145
 
4059
4146
  if (oldVnode.text !== text) {
@@ -4061,7 +4148,7 @@ function updateNodeHook(oldVnode, vnode) {
4061
4148
  unlockDomMutation();
4062
4149
  }
4063
4150
 
4064
- renderer.setText(elm, text);
4151
+ setText(elm, text);
4065
4152
 
4066
4153
  if (process.env.NODE_ENV !== 'production') {
4067
4154
  lockDomMutation();
@@ -4069,30 +4156,22 @@ function updateNodeHook(oldVnode, vnode) {
4069
4156
  }
4070
4157
  }
4071
4158
  function insertNodeHook(vnode, parentNode, referenceNode) {
4072
- const {
4073
- renderer
4074
- } = vnode.owner;
4075
-
4076
4159
  if (process.env.NODE_ENV !== 'production') {
4077
4160
  unlockDomMutation();
4078
4161
  }
4079
4162
 
4080
- renderer.insert(vnode.elm, parentNode, referenceNode);
4163
+ insert(vnode.elm, parentNode, referenceNode);
4081
4164
 
4082
4165
  if (process.env.NODE_ENV !== 'production') {
4083
4166
  lockDomMutation();
4084
4167
  }
4085
4168
  }
4086
4169
  function removeNodeHook(vnode, parentNode) {
4087
- const {
4088
- renderer
4089
- } = vnode.owner;
4090
-
4091
4170
  if (process.env.NODE_ENV !== 'production') {
4092
4171
  unlockDomMutation();
4093
4172
  }
4094
4173
 
4095
- renderer.remove(vnode.elm, parentNode);
4174
+ remove(vnode.elm, parentNode);
4096
4175
 
4097
4176
  if (process.env.NODE_ENV !== 'production') {
4098
4177
  lockDomMutation();
@@ -4179,13 +4258,15 @@ function updateElmHook(oldVnode, vnode) {
4179
4258
  }
4180
4259
  function updateChildrenHook(oldVnode, vnode) {
4181
4260
  const {
4182
- children,
4183
- owner
4261
+ elm,
4262
+ children
4184
4263
  } = vnode;
4185
- const fn = hasDynamicChildren(children) ? updateDynamicChildren : updateStaticChildren;
4186
- runWithBoundaryProtection(owner, owner.owner, noop, () => {
4187
- fn(vnode.elm, oldVnode.children, children);
4188
- }, noop);
4264
+
4265
+ if (hasDynamicChildren(children)) {
4266
+ updateDynamicChildren(elm, oldVnode.children, children);
4267
+ } else {
4268
+ updateStaticChildren(elm, oldVnode.children, children);
4269
+ }
4189
4270
  }
4190
4271
  function allocateChildrenHook(vnode, vm) {
4191
4272
  // A component with slots will re-render because:
@@ -4249,8 +4330,7 @@ function createViewModelHook(elm, vnode) {
4249
4330
  createVM(elm, def, {
4250
4331
  mode,
4251
4332
  owner,
4252
- tagName: sel,
4253
- renderer: owner.renderer
4333
+ tagName: sel
4254
4334
  });
4255
4335
 
4256
4336
  if (process.env.NODE_ENV !== 'production') {
@@ -4294,16 +4374,13 @@ function vnodesAndElementHaveCompatibleAttrs(vnode, elm) {
4294
4374
  const {
4295
4375
  data: {
4296
4376
  attrs = {}
4297
- },
4298
- owner: {
4299
- renderer
4300
4377
  }
4301
4378
  } = vnode;
4302
4379
  let nodesAreCompatible = true; // Validate attributes, though we could always recovery from those by running the update mods.
4303
4380
  // Note: intentionally ONLY matching vnodes.attrs to elm.attrs, in case SSR is adding extra attributes.
4304
4381
 
4305
4382
  for (const [attrName, attrValue] of Object.entries(attrs)) {
4306
- const elmAttrValue = renderer.getAttribute(elm, attrName);
4383
+ const elmAttrValue = getAttribute(elm, attrName);
4307
4384
 
4308
4385
  if (String(attrValue) !== elmAttrValue) {
4309
4386
  logError(`Mismatch hydrating element <${elm.tagName.toLowerCase()}>: attribute "${attrName}" has different values, expected "${attrValue}" but found "${elmAttrValue}"`, vnode.owner);
@@ -4319,9 +4396,6 @@ function vnodesAndElementHaveCompatibleClass(vnode, elm) {
4319
4396
  data: {
4320
4397
  className,
4321
4398
  classMap
4322
- },
4323
- owner: {
4324
- renderer
4325
4399
  }
4326
4400
  } = vnode;
4327
4401
  let nodesAreCompatible = true;
@@ -4333,7 +4407,7 @@ function vnodesAndElementHaveCompatibleClass(vnode, elm) {
4333
4407
  vnodeClassName = className;
4334
4408
  } else if (!isUndefined$1(classMap)) {
4335
4409
  // classMap is used when class is set to static value.
4336
- const classList = renderer.getClassList(elm);
4410
+ const classList = getClassList(elm);
4337
4411
  let computedClassName = ''; // all classes from the vnode should be in the element.classList
4338
4412
 
4339
4413
  for (const name in classMap) {
@@ -4363,12 +4437,9 @@ function vnodesAndElementHaveCompatibleStyle(vnode, elm) {
4363
4437
  data: {
4364
4438
  style,
4365
4439
  styleDecls
4366
- },
4367
- owner: {
4368
- renderer
4369
4440
  }
4370
4441
  } = vnode;
4371
- const elmStyle = renderer.getAttribute(elm, 'style') || '';
4442
+ const elmStyle = getAttribute(elm, 'style') || '';
4372
4443
  let vnodeStyle;
4373
4444
  let nodesAreCompatible = true;
4374
4445
 
@@ -4500,12 +4571,12 @@ function hasDynamicChildren(children) {
4500
4571
  * SPDX-License-Identifier: MIT
4501
4572
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
4502
4573
  */
4503
- function getUpgradableConstructor(tagName, renderer) {
4574
+ function getUpgradableConstructor(tagName) {
4504
4575
  // Should never get a tag with upper case letter at this point, the compiler should
4505
4576
  // produce only tags with lowercase letters
4506
4577
  // But, for backwards compatibility, we will lower case the tagName
4507
4578
  tagName = tagName.toLowerCase();
4508
- let CE = renderer.getCustomElement(tagName);
4579
+ let CE = getCustomElement(tagName);
4509
4580
 
4510
4581
  if (!isUndefined$1(CE)) {
4511
4582
  return CE;
@@ -4516,7 +4587,7 @@ function getUpgradableConstructor(tagName, renderer) {
4516
4587
  */
4517
4588
 
4518
4589
 
4519
- CE = class LWCUpgradableElement extends renderer.HTMLElement {
4590
+ CE = class LWCUpgradableElement extends HTMLElementExported {
4520
4591
  constructor(upgradeCallback) {
4521
4592
  super();
4522
4593
 
@@ -4526,7 +4597,7 @@ function getUpgradableConstructor(tagName, renderer) {
4526
4597
  }
4527
4598
 
4528
4599
  };
4529
- renderer.defineCustomElement(tagName, CE);
4600
+ defineCustomElement(tagName, CE);
4530
4601
  return CE;
4531
4602
  }
4532
4603
 
@@ -4543,10 +4614,7 @@ const TextHook = {
4543
4614
  const {
4544
4615
  owner
4545
4616
  } = vnode;
4546
- const {
4547
- renderer
4548
- } = owner;
4549
- const elm = renderer.createText(vnode.text);
4617
+ const elm = createText(vnode.text);
4550
4618
  linkNodeToShadow(elm, owner);
4551
4619
  vnode.elm = elm;
4552
4620
  },
@@ -4580,10 +4648,7 @@ const CommentHook = {
4580
4648
  owner,
4581
4649
  text
4582
4650
  } = vnode;
4583
- const {
4584
- renderer
4585
- } = owner;
4586
- const elm = renderer.createComment(text);
4651
+ const elm = createComment(text);
4587
4652
  linkNodeToShadow(elm, owner);
4588
4653
  vnode.elm = elm;
4589
4654
  },
@@ -4625,11 +4690,8 @@ const ElementHook = {
4625
4690
  svg
4626
4691
  }
4627
4692
  } = vnode;
4628
- const {
4629
- renderer
4630
- } = owner;
4631
4693
  const namespace = isTrue(svg) ? SVG_NAMESPACE : undefined;
4632
- const elm = renderer.createElement(sel, namespace);
4694
+ const elm = createElement(sel, namespace);
4633
4695
  linkNodeToShadow(elm, owner);
4634
4696
  fallbackElmHook(elm, vnode);
4635
4697
  vnode.elm = elm;
@@ -4689,10 +4751,7 @@ const CustomElementHook = {
4689
4751
  sel,
4690
4752
  owner
4691
4753
  } = vnode;
4692
- const {
4693
- renderer
4694
- } = owner;
4695
- const UpgradableConstructor = getUpgradableConstructor(sel, renderer);
4754
+ const UpgradableConstructor = getUpgradableConstructor(sel);
4696
4755
  /**
4697
4756
  * Note: if the upgradable constructor does not expect, or throw when we new it
4698
4757
  * with a callback as the first argument, we could implement a more advanced
@@ -4785,8 +4844,7 @@ const CustomElementHook = {
4785
4844
  createVM(elm, def, {
4786
4845
  mode,
4787
4846
  owner,
4788
- tagName: sel,
4789
- renderer: owner.renderer
4847
+ tagName: sel
4790
4848
  });
4791
4849
  vnode.elm = elm;
4792
4850
  const vm = getAssociatedVM(elm);
@@ -4815,12 +4873,11 @@ const CustomElementHook = {
4815
4873
 
4816
4874
  function linkNodeToShadow(elm, owner) {
4817
4875
  const {
4818
- renderer,
4819
4876
  renderMode,
4820
4877
  shadowMode
4821
4878
  } = owner; // TODO [#1164]: this should eventually be done by the polyfill directly
4822
4879
 
4823
- if (renderer.isSyntheticShadowDefined) {
4880
+ if (isSyntheticShadowDefined) {
4824
4881
  if (shadowMode === 1
4825
4882
  /* Synthetic */
4826
4883
  || renderMode === 0
@@ -5352,7 +5409,6 @@ function updateStylesheetToken(vm, template) {
5352
5409
  const {
5353
5410
  elm,
5354
5411
  context,
5355
- renderer,
5356
5412
  renderMode,
5357
5413
  shadowMode
5358
5414
  } = vm;
@@ -5379,11 +5435,11 @@ function updateStylesheetToken(vm, template) {
5379
5435
  } = context;
5380
5436
 
5381
5437
  if (oldHasTokenInClass) {
5382
- renderer.getClassList(elm).remove(makeHostToken(oldToken));
5438
+ getClassList(elm).remove(makeHostToken(oldToken));
5383
5439
  }
5384
5440
 
5385
5441
  if (oldHasTokenInAttribute) {
5386
- renderer.removeAttribute(elm, makeHostToken(oldToken));
5442
+ removeAttribute(elm, makeHostToken(oldToken));
5387
5443
  } // Apply the new template styling token to the host element, if the new template has any
5388
5444
  // associated stylesheets. In the case of light DOM, also ensure there is at least one scoped stylesheet.
5389
5445
 
@@ -5395,12 +5451,12 @@ function updateStylesheetToken(vm, template) {
5395
5451
 
5396
5452
  if (!isUndefined$1(newToken)) {
5397
5453
  if (hasScopedStyles) {
5398
- renderer.getClassList(elm).add(makeHostToken(newToken));
5454
+ getClassList(elm).add(makeHostToken(newToken));
5399
5455
  newHasTokenInClass = true;
5400
5456
  }
5401
5457
 
5402
5458
  if (isSyntheticShadow) {
5403
- renderer.setAttribute(elm, makeHostToken(newToken), '');
5459
+ setAttribute(elm, makeHostToken(newToken), '');
5404
5460
  newHasTokenInAttribute = true;
5405
5461
  }
5406
5462
  } // Update the styling tokens present on the context object.
@@ -5413,6 +5469,7 @@ function updateStylesheetToken(vm, template) {
5413
5469
 
5414
5470
  function evaluateStylesheetsContent(stylesheets, stylesheetToken, vm) {
5415
5471
  const content = [];
5472
+ let root;
5416
5473
 
5417
5474
  for (let i = 0; i < stylesheets.length; i++) {
5418
5475
  let stylesheet = stylesheets[i];
@@ -5425,23 +5482,46 @@ function evaluateStylesheetsContent(stylesheets, stylesheetToken, vm) {
5425
5482
  // the component instance might be attempting to use an old version of
5426
5483
  // the stylesheet, while internally, we have a replacement for it.
5427
5484
  stylesheet = getStyleOrSwappedStyle(stylesheet);
5428
- } // Use the actual `:host` selector if we're rendering global CSS for light DOM, or if we're rendering
5429
- // native shadow DOM. Synthetic shadow DOM never uses `:host`.
5485
+ }
5430
5486
 
5487
+ const isScopedCss = stylesheet[KEY__SCOPED_CSS]; // Apply the scope token only if the stylesheet itself is scoped, or if we're rendering synthetic shadow.
5488
+
5489
+ const scopeToken = isScopedCss || vm.shadowMode === 1
5490
+ /* Synthetic */
5491
+ && vm.renderMode === 1
5492
+ /* Shadow */
5493
+ ? stylesheetToken : undefined; // Use the actual `:host` selector if we're rendering global CSS for light DOM, or if we're rendering
5494
+ // native shadow DOM. Synthetic shadow DOM never uses `:host`.
5431
5495
 
5432
- const isScopedCss = stylesheet[KEY__SCOPED_CSS];
5433
5496
  const useActualHostSelector = vm.renderMode === 0
5434
5497
  /* Light */
5435
5498
  ? !isScopedCss : vm.shadowMode === 0
5436
5499
  /* Native */
5437
- ; // Apply the scope token only if the stylesheet itself is scoped, or if we're rendering synthetic shadow.
5500
+ ; // Use the native :dir() pseudoclass only in native shadow DOM. Otherwise, in synthetic shadow,
5501
+ // we use an attribute selector on the host to simulate :dir().
5438
5502
 
5439
- const scopeToken = isScopedCss || vm.shadowMode === 1
5440
- /* Synthetic */
5441
- && vm.renderMode === 1
5503
+ let useNativeDirPseudoclass;
5504
+
5505
+ if (vm.renderMode === 1
5442
5506
  /* Shadow */
5443
- ? stylesheetToken : undefined;
5444
- ArrayPush$1.call(content, stylesheet(useActualHostSelector, scopeToken));
5507
+ ) {
5508
+ useNativeDirPseudoclass = vm.shadowMode === 0
5509
+ /* Native */
5510
+ ;
5511
+ } else {
5512
+ // Light DOM components should only render `[dir]` if they're inside of a synthetic shadow root.
5513
+ // At the top level (root is null) or inside of a native shadow root, they should use `:dir()`.
5514
+ if (isUndefined$1(root)) {
5515
+ // Only calculate the root once as necessary
5516
+ root = getNearestShadowComponent(vm);
5517
+ }
5518
+
5519
+ useNativeDirPseudoclass = isNull(root) || root.shadowMode === 0
5520
+ /* Native */
5521
+ ;
5522
+ }
5523
+
5524
+ ArrayPush$1.call(content, stylesheet(scopeToken, useActualHostSelector, useNativeDirPseudoclass));
5445
5525
  }
5446
5526
  }
5447
5527
 
@@ -5464,14 +5544,12 @@ function getStylesheetsContent(vm, template) {
5464
5544
  // perf testing has not shown it to be a huge improvement yet:
5465
5545
  // https://github.com/salesforce/lwc/pull/2460#discussion_r691208892
5466
5546
 
5467
- function getNearestNativeShadowComponent(vm) {
5547
+ function getNearestShadowComponent(vm) {
5468
5548
  let owner = vm;
5469
5549
 
5470
5550
  while (!isNull(owner)) {
5471
5551
  if (owner.renderMode === 1
5472
5552
  /* Shadow */
5473
- && owner.shadowMode === 0
5474
- /* Native */
5475
5553
  ) {
5476
5554
  return owner;
5477
5555
  }
@@ -5482,9 +5560,22 @@ function getNearestNativeShadowComponent(vm) {
5482
5560
  return owner;
5483
5561
  }
5484
5562
 
5563
+ function getNearestNativeShadowComponent(vm) {
5564
+ const owner = getNearestShadowComponent(vm);
5565
+
5566
+ if (!isNull(owner) && owner.shadowMode === 1
5567
+ /* Synthetic */
5568
+ ) {
5569
+ // Synthetic-within-native is impossible. So if the nearest shadow component is
5570
+ // synthetic, we know we won't find a native component if we go any further.
5571
+ return null;
5572
+ }
5573
+
5574
+ return owner;
5575
+ }
5576
+
5485
5577
  function createStylesheet(vm, stylesheets) {
5486
5578
  const {
5487
- renderer,
5488
5579
  renderMode,
5489
5580
  shadowMode
5490
5581
  } = vm;
@@ -5495,9 +5586,9 @@ function createStylesheet(vm, stylesheets) {
5495
5586
  /* Synthetic */
5496
5587
  ) {
5497
5588
  for (let i = 0; i < stylesheets.length; i++) {
5498
- renderer.insertGlobalStylesheet(stylesheets[i]);
5589
+ insertGlobalStylesheet(stylesheets[i]);
5499
5590
  }
5500
- } else if (renderer.ssr || renderer.isHydrating()) {
5591
+ } else if (ssr || isHydrating()) {
5501
5592
  // Note: We need to ensure that during hydration, the stylesheets method is the same as those in ssr.
5502
5593
  // This works in the client, because the stylesheets are created, and cached in the VM
5503
5594
  // the first time the VM renders.
@@ -5511,10 +5602,10 @@ function createStylesheet(vm, stylesheets) {
5511
5602
 
5512
5603
  for (let i = 0; i < stylesheets.length; i++) {
5513
5604
  if (isGlobal) {
5514
- renderer.insertGlobalStylesheet(stylesheets[i]);
5605
+ insertGlobalStylesheet(stylesheets[i]);
5515
5606
  } else {
5516
5607
  // local level
5517
- renderer.insertStylesheet(stylesheets[i], root.cmpRoot);
5608
+ insertStylesheet(stylesheets[i], root.cmpRoot);
5518
5609
  }
5519
5610
  }
5520
5611
  }
@@ -5597,7 +5688,7 @@ function logOperationStart(opId, vm) {
5597
5688
  if (isProfilerEnabled) {
5598
5689
  currentDispatcher(opId, 0
5599
5690
  /* Start */
5600
- , vm.tagName, vm.idx);
5691
+ , vm.tagName, vm.idx, vm.renderMode, vm.shadowMode);
5601
5692
  }
5602
5693
  }
5603
5694
  function logOperationEnd(opId, vm) {
@@ -5610,7 +5701,7 @@ function logOperationEnd(opId, vm) {
5610
5701
  if (isProfilerEnabled) {
5611
5702
  currentDispatcher(opId, 1
5612
5703
  /* Stop */
5613
- , vm.tagName, vm.idx);
5704
+ , vm.tagName, vm.idx, vm.renderMode, vm.shadowMode);
5614
5705
  }
5615
5706
  }
5616
5707
  function logGlobalOperationStart(opId, vm) {
@@ -5623,7 +5714,7 @@ function logGlobalOperationStart(opId, vm) {
5623
5714
  if (isProfilerEnabled) {
5624
5715
  currentDispatcher(opId, 0
5625
5716
  /* Start */
5626
- , vm === null || vm === void 0 ? void 0 : vm.tagName, vm === null || vm === void 0 ? void 0 : vm.idx);
5717
+ , vm === null || vm === void 0 ? void 0 : vm.tagName, vm === null || vm === void 0 ? void 0 : vm.idx, vm === null || vm === void 0 ? void 0 : vm.renderMode, vm === null || vm === void 0 ? void 0 : vm.shadowMode);
5627
5718
  }
5628
5719
  }
5629
5720
  function logGlobalOperationEnd(opId, vm) {
@@ -5636,7 +5727,7 @@ function logGlobalOperationEnd(opId, vm) {
5636
5727
  if (isProfilerEnabled) {
5637
5728
  currentDispatcher(opId, 1
5638
5729
  /* Stop */
5639
- , vm === null || vm === void 0 ? void 0 : vm.tagName, vm === null || vm === void 0 ? void 0 : vm.idx);
5730
+ , vm === null || vm === void 0 ? void 0 : vm.tagName, vm === null || vm === void 0 ? void 0 : vm.idx, vm === null || vm === void 0 ? void 0 : vm.renderMode, vm === null || vm === void 0 ? void 0 : vm.shadowMode);
5640
5731
  }
5641
5732
  }
5642
5733
 
@@ -5789,6 +5880,7 @@ function evaluateTemplate(vm, html) {
5789
5880
 
5790
5881
  return vnodes;
5791
5882
  }
5883
+
5792
5884
  function computeHasScopedStyles(template) {
5793
5885
  const {
5794
5886
  stylesheets
@@ -6174,7 +6266,6 @@ function createVM(elm, def, options) {
6174
6266
  const {
6175
6267
  mode,
6176
6268
  owner,
6177
- renderer,
6178
6269
  tagName
6179
6270
  } = options;
6180
6271
  const vm = {
@@ -6189,7 +6280,6 @@ function createVM(elm, def, options) {
6189
6280
  tagName,
6190
6281
  mode,
6191
6282
  owner,
6192
- renderer,
6193
6283
  children: EmptyArray,
6194
6284
  aChildren: EmptyArray,
6195
6285
  velements: EmptyArray,
@@ -6244,13 +6334,8 @@ function createVM(elm, def, options) {
6244
6334
 
6245
6335
  function computeShadowMode(vm) {
6246
6336
  const {
6247
- def,
6248
- renderer
6337
+ def
6249
6338
  } = vm;
6250
- const {
6251
- isNativeShadowDefined,
6252
- isSyntheticShadowDefined
6253
- } = renderer;
6254
6339
  let shadowMode;
6255
6340
 
6256
6341
  if (isSyntheticShadowDefined) {
@@ -6400,13 +6485,12 @@ function patchShadowRoot(vm, newCh) {
6400
6485
 
6401
6486
  function runRenderedCallback(vm) {
6402
6487
  const {
6403
- renderer,
6404
6488
  def: {
6405
6489
  renderedCallback
6406
6490
  }
6407
6491
  } = vm;
6408
6492
 
6409
- if (isTrue(renderer.ssr)) {
6493
+ if (isTrue(ssr)) {
6410
6494
  return;
6411
6495
  }
6412
6496
 
@@ -6632,8 +6716,7 @@ function recursivelyDisconnectChildren(vnodes) {
6632
6716
 
6633
6717
  function resetComponentRoot(vm) {
6634
6718
  const {
6635
- children,
6636
- renderer
6719
+ children
6637
6720
  } = vm;
6638
6721
  const rootNode = getRenderRoot(vm);
6639
6722
 
@@ -6641,7 +6724,7 @@ function resetComponentRoot(vm) {
6641
6724
  const child = children[i];
6642
6725
 
6643
6726
  if (!isNull(child) && !isUndefined$1(child.elm)) {
6644
- renderer.remove(child.elm, rootNode);
6727
+ remove(child.elm, rootNode);
6645
6728
  }
6646
6729
  }
6647
6730
 
@@ -6650,7 +6733,7 @@ function resetComponentRoot(vm) {
6650
6733
  vm.velements = EmptyArray;
6651
6734
  }
6652
6735
  function scheduleRehydration(vm) {
6653
- if (isTrue(vm.renderer.ssr) || isTrue(vm.isScheduled)) {
6736
+ if (isTrue(ssr) || isTrue(vm.isScheduled)) {
6654
6737
  return;
6655
6738
  }
6656
6739
 
@@ -6890,7 +6973,6 @@ function createContextWatcher(vm, wireDef, callbackWhenContextIsReady) {
6890
6973
 
6891
6974
  const {
6892
6975
  elm,
6893
- renderer,
6894
6976
  context: {
6895
6977
  wiredConnecting,
6896
6978
  wiredDisconnecting
@@ -6917,7 +6999,7 @@ function createContextWatcher(vm, wireDef, callbackWhenContextIsReady) {
6917
6999
  }
6918
7000
 
6919
7001
  });
6920
- renderer.dispatchEvent(elm, contextRegistrationEvent);
7002
+ dispatchEvent(elm, contextRegistrationEvent);
6921
7003
  });
6922
7004
  }
6923
7005
 
@@ -7173,5 +7255,5 @@ function setHooks(hooks) {
7173
7255
  setSanitizeHtmlContentHook(hooks.sanitizeHtmlContent);
7174
7256
  }
7175
7257
 
7176
- export { LightningElement, profilerControl as __unstable__ProfilerControl, api$1 as api, connectRootElement, createContextProvider, createVM, disconnectRootElement, getAssociatedVMIfPresent, getComponentDef, getComponentInternalDef, getUpgradableConstructor, hydrateRootElement, isComponentConstructor, readonly, register, registerComponent, registerDecorators, registerTemplate, sanitizeAttribute, setHooks, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };
7177
- /* version: 2.5.10 */
7258
+ export { LightningElement, profilerControl as __unstable__ProfilerControl, api$1 as api, connectRootElement, createContextProvider, createVM, disconnectRootElement, getAssociatedVMIfPresent, getComponentDef, getComponentInternalDef, getUpgradableConstructor, hydrateRootElement, isComponentConstructor, readonly, register, registerComponent, registerDecorators, registerTemplate, sanitizeAttribute, setAddEventListener, setAssertInstanceOfHTMLElement, setAttachShadow, setCreateComment, setCreateElement, setCreateText, setDefineCustomElement, setDispatchEvent, setGetAttribute, setGetBoundingClientRect, setGetChildNodes, setGetChildren, setGetClassList, setGetCustomElement, setGetElementsByClassName, setGetElementsByTagName, setGetFirstChild, setGetFirstElementChild, setGetLastChild, setGetLastElementChild, setGetProperty, setHTMLElement, setHooks, setInsert, setInsertGlobalStylesheet, setInsertStylesheet, setIsConnected, setIsHydrating, setIsNativeShadowDefined, setIsSyntheticShadowDefined, setNextSibling, setQuerySelector, setQuerySelectorAll, setRemove, setRemoveAttribute, setRemoveEventListener, setSetAttribute, setSetCSSStyleProperty, setSetProperty, setSetText, setSsr, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };
7259
+ /* version: 2.6.3 */