lwc 2.14.2 → 2.15.0

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.
Files changed (39) hide show
  1. package/dist/engine-dom/esm/es2017/engine-dom.js +155 -13
  2. package/dist/engine-dom/iife/es2017/engine-dom.js +156 -12
  3. package/dist/engine-dom/iife/es2017/engine-dom.min.js +1 -1
  4. package/dist/engine-dom/iife/es2017/engine-dom_debug.js +147 -10
  5. package/dist/engine-dom/iife/es5/engine-dom.js +268 -40
  6. package/dist/engine-dom/iife/es5/engine-dom.min.js +1 -1
  7. package/dist/engine-dom/iife/es5/engine-dom_debug.js +253 -38
  8. package/dist/engine-dom/umd/es2017/engine-dom.js +156 -12
  9. package/dist/engine-dom/umd/es2017/engine-dom.min.js +1 -1
  10. package/dist/engine-dom/umd/es2017/engine-dom_debug.js +147 -10
  11. package/dist/engine-dom/umd/es5/engine-dom.js +268 -40
  12. package/dist/engine-dom/umd/es5/engine-dom.min.js +1 -1
  13. package/dist/engine-dom/umd/es5/engine-dom_debug.js +253 -38
  14. package/dist/engine-server/commonjs/es2017/engine-server.js +129 -29
  15. package/dist/engine-server/commonjs/es2017/engine-server.min.js +1 -1
  16. package/dist/engine-server/esm/es2017/engine-server.js +128 -30
  17. package/dist/synthetic-shadow/esm/es2017/synthetic-shadow.js +24 -4
  18. package/dist/synthetic-shadow/iife/es2017/synthetic-shadow.js +24 -4
  19. package/dist/synthetic-shadow/iife/es2017/synthetic-shadow.min.js +2 -2
  20. package/dist/synthetic-shadow/iife/es2017/synthetic-shadow_debug.js +24 -4
  21. package/dist/synthetic-shadow/iife/es5/synthetic-shadow.js +29 -3
  22. package/dist/synthetic-shadow/iife/es5/synthetic-shadow.min.js +2 -2
  23. package/dist/synthetic-shadow/iife/es5/synthetic-shadow_debug.js +29 -3
  24. package/dist/synthetic-shadow/umd/es2017/synthetic-shadow.js +24 -4
  25. package/dist/synthetic-shadow/umd/es2017/synthetic-shadow.min.js +2 -2
  26. package/dist/synthetic-shadow/umd/es2017/synthetic-shadow_debug.js +24 -4
  27. package/dist/synthetic-shadow/umd/es5/synthetic-shadow.js +29 -3
  28. package/dist/synthetic-shadow/umd/es5/synthetic-shadow.min.js +2 -2
  29. package/dist/synthetic-shadow/umd/es5/synthetic-shadow_debug.js +29 -3
  30. package/dist/wire-service/esm/es2017/wire-service.js +2 -2
  31. package/dist/wire-service/iife/es2017/wire-service.js +2 -2
  32. package/dist/wire-service/iife/es2017/wire-service_debug.js +2 -2
  33. package/dist/wire-service/iife/es5/wire-service.js +2 -2
  34. package/dist/wire-service/iife/es5/wire-service_debug.js +2 -2
  35. package/dist/wire-service/umd/es2017/wire-service.js +2 -2
  36. package/dist/wire-service/umd/es2017/wire-service_debug.js +2 -2
  37. package/dist/wire-service/umd/es5/wire-service.js +2 -2
  38. package/dist/wire-service/umd/es5/wire-service_debug.js +2 -2
  39. package/package.json +7 -7
@@ -230,6 +230,7 @@ const _globalThis = /*@__PURE__*/ (function () {
230
230
  */
231
231
  const KEY__IS_NATIVE_SHADOW_ROOT_DEFINED = '$isNativeShadowRootDefined$';
232
232
  const KEY__SHADOW_RESOLVER = '$shadowResolver$';
233
+ const KEY__SHADOW_STATIC = '$shadowStaticNode$';
233
234
  const KEY__SHADOW_TOKEN = '$shadowToken$';
234
235
  const KEY__SYNTHETIC_MODE = '$$lwc-synthetic-mode';
235
236
  const KEY__SCOPED_CSS = '$scoped$';
@@ -298,9 +299,9 @@ const XLINK_NAMESPACE = 'http://www.w3.org/1999/xlink';
298
299
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
299
300
  */
300
301
  // Increment whenever the LWC template compiler changes
301
- const LWC_VERSION = "2.14.2";
302
+ const LWC_VERSION = "2.15.0";
302
303
  const LWC_VERSION_COMMENT_REGEX = /\/\*LWC compiler v([\d.]+)\*\/\s*}/;
303
- /** version: 2.14.2 */
304
+ /** version: 2.15.0 */
304
305
 
305
306
  /*
306
307
  * Copyright (c) 2018, salesforce.com, inc.
@@ -454,7 +455,7 @@ function setFeatureFlagForTest(name, value) {
454
455
  setFeatureFlag(name, value);
455
456
  }
456
457
  }
457
- /** version: 2.14.2 */
458
+ /** version: 2.15.0 */
458
459
 
459
460
  /*
460
461
  * Copyright (c) 2018, salesforce.com, inc.
@@ -3659,6 +3660,9 @@ function patch(n1, n2, renderer) {
3659
3660
  // VComment has no special capability, fallback to the owner's renderer
3660
3661
  patchComment(n1, n2, renderer);
3661
3662
  break;
3663
+ case 4 /* Static */:
3664
+ n2.elm = n1.elm;
3665
+ break;
3662
3666
  case 2 /* Element */:
3663
3667
  patchElement(n1, n2, (_a = n2.data.renderer) !== null && _a !== void 0 ? _a : renderer);
3664
3668
  break;
@@ -3678,6 +3682,10 @@ function mount(node, parent, renderer, anchor) {
3678
3682
  // VComment has no special capability, fallback to the owner's renderer
3679
3683
  mountComment(node, parent, anchor, renderer);
3680
3684
  break;
3685
+ case 4 /* Static */:
3686
+ // VStatic cannot have a custom renderer associated to them, using owner's renderer
3687
+ mountStatic(node, parent, anchor, renderer);
3688
+ break;
3681
3689
  case 2 /* Element */:
3682
3690
  // If the vnode data has a renderer override use it, else fallback to owner's renderer
3683
3691
  mountElement(node, parent, anchor, (_a = node.data.renderer) !== null && _a !== void 0 ? _a : renderer);
@@ -3733,6 +3741,24 @@ function patchElement(n1, n2, renderer) {
3733
3741
  patchElementPropsAndAttrs$1(n1, n2, renderer);
3734
3742
  patchChildren(n1.children, n2.children, elm, renderer);
3735
3743
  }
3744
+ function mountStatic(vnode, parent, anchor, renderer) {
3745
+ const { owner } = vnode;
3746
+ const { cloneNode, isSyntheticShadowDefined } = renderer;
3747
+ const elm = (vnode.elm = cloneNode(vnode.fragment, true));
3748
+ linkNodeToShadow(elm, owner, renderer);
3749
+ // Marks this node as Static to propagate the shadow resolver. must happen after elm is assigned to the proper shadow
3750
+ const { renderMode, shadowMode } = owner;
3751
+ if (isSyntheticShadowDefined) {
3752
+ if (shadowMode === 1 /* Synthetic */ || renderMode === 0 /* Light */) {
3753
+ elm[KEY__SHADOW_STATIC] = true;
3754
+ }
3755
+ }
3756
+ if (process.env.NODE_ENV !== 'production') {
3757
+ const isLight = renderMode === 0 /* Light */;
3758
+ patchElementWithRestrictions(elm, { isPortal: false, isLight });
3759
+ }
3760
+ insertNode(elm, parent, anchor, renderer);
3761
+ }
3736
3762
  function mountCustomElement(vnode, parent, anchor, renderer) {
3737
3763
  const { sel, owner } = vnode;
3738
3764
  const UpgradableConstructor = getUpgradableConstructor(sel, renderer);
@@ -4201,6 +4227,17 @@ const SymbolIterator = Symbol.iterator;
4201
4227
  function addVNodeToChildLWC(vnode) {
4202
4228
  ArrayPush$1.call(getVMBeingRendered().velements, vnode);
4203
4229
  }
4230
+ // [st]atic node
4231
+ function st(fragment, key) {
4232
+ return {
4233
+ type: 4 /* Static */,
4234
+ sel: undefined,
4235
+ key,
4236
+ elm: undefined,
4237
+ fragment,
4238
+ owner: getVMBeingRendered(),
4239
+ };
4240
+ }
4204
4241
  // [h]tml node
4205
4242
  function h(sel, data, children = EmptyArray) {
4206
4243
  const vmBeingRendered = getVMBeingRendered();
@@ -4590,6 +4627,7 @@ const api = freeze({
4590
4627
  co,
4591
4628
  dc,
4592
4629
  ti,
4630
+ st,
4593
4631
  gid,
4594
4632
  fid,
4595
4633
  shc,
@@ -4741,8 +4779,7 @@ function createStylesheet(vm, stylesheets) {
4741
4779
  // This works in the client, because the stylesheets are created, and cached in the VM
4742
4780
  // the first time the VM renders.
4743
4781
  // native shadow or light DOM, SSR
4744
- const combinedStylesheetContent = ArrayJoin.call(stylesheets, '\n');
4745
- return createInlineStyleVNode(combinedStylesheetContent);
4782
+ return ArrayMap.call(stylesheets, createInlineStyleVNode);
4746
4783
  }
4747
4784
  else {
4748
4785
  // native shadow or light DOM, DOM renderer
@@ -4910,6 +4947,59 @@ function validateLightDomTemplate(template, vm) {
4910
4947
  assert.isTrue(isUndefined$1(template.renderMode), `Shadow DOM components template can't render light DOM templates. Either remove the 'lwc:render-mode' directive from ${getComponentTag(vm)} or set it to 'lwc:render-mode="shadow"`);
4911
4948
  }
4912
4949
  }
4950
+ function buildParseFragmentFn(createFragmentFn) {
4951
+ return (strings, ...keys) => {
4952
+ const cache = create(null);
4953
+ return function () {
4954
+ const { context: { hasScopedStyles, stylesheetToken }, shadowMode, renderer, } = getVMBeingRendered();
4955
+ const hasStyleToken = !isUndefined$1(stylesheetToken);
4956
+ const isSyntheticShadow = shadowMode === 1 /* Synthetic */;
4957
+ let cacheKey = 0;
4958
+ if (hasStyleToken && hasScopedStyles) {
4959
+ cacheKey |= 1 /* HAS_SCOPED_STYLE */;
4960
+ }
4961
+ if (hasStyleToken && isSyntheticShadow) {
4962
+ cacheKey |= 2 /* SHADOW_MODE_SYNTHETIC */;
4963
+ }
4964
+ if (!isUndefined$1(cache[cacheKey])) {
4965
+ return cache[cacheKey];
4966
+ }
4967
+ const classToken = hasScopedStyles && hasStyleToken ? ' ' + stylesheetToken : '';
4968
+ const classAttrToken = hasScopedStyles && hasStyleToken ? ` class="${stylesheetToken}"` : '';
4969
+ const attrToken = hasStyleToken && isSyntheticShadow ? ' ' + stylesheetToken : '';
4970
+ let htmlFragment = '';
4971
+ for (let i = 0, n = keys.length; i < n; i++) {
4972
+ switch (keys[i]) {
4973
+ case 0: // styleToken in existing class attr
4974
+ htmlFragment += strings[i] + classToken;
4975
+ break;
4976
+ case 1: // styleToken for added class attr
4977
+ htmlFragment += strings[i] + classAttrToken;
4978
+ break;
4979
+ case 2: // styleToken as attr
4980
+ htmlFragment += strings[i] + attrToken;
4981
+ break;
4982
+ case 3: // ${1}${2}
4983
+ htmlFragment += strings[i] + classAttrToken + attrToken;
4984
+ break;
4985
+ }
4986
+ }
4987
+ htmlFragment += strings[strings.length - 1];
4988
+ cache[cacheKey] = createFragmentFn(htmlFragment, renderer);
4989
+ return cache[cacheKey];
4990
+ };
4991
+ };
4992
+ }
4993
+ // Note: at the moment this code executes, we don't have a renderer yet.
4994
+ const parseFragment = buildParseFragmentFn((html, renderer) => {
4995
+ const { createFragment } = renderer;
4996
+ return createFragment(html);
4997
+ });
4998
+ const parseSVGFragment = buildParseFragmentFn((html, renderer) => {
4999
+ const { createFragment, getFirstChild } = renderer;
5000
+ const fragment = createFragment('<svg>' + html + '</svg>');
5001
+ return getFirstChild(fragment);
5002
+ });
4913
5003
  function evaluateTemplate(vm, html) {
4914
5004
  if (process.env.NODE_ENV !== 'production') {
4915
5005
  assert.isTrue(isFunction$1(html), `evaluateTemplate() second argument must be an imported template instead of ${toString$1(html)}`);
@@ -4956,7 +5046,7 @@ function evaluateTemplate(vm, html) {
4956
5046
  // Evaluate, create stylesheet and cache the produced VNode for future
4957
5047
  // re-rendering.
4958
5048
  const stylesheetsContent = getStylesheetsContent(vm, html);
4959
- context.styleVNode =
5049
+ context.styleVNodes =
4960
5050
  stylesheetsContent.length === 0
4961
5051
  ? null
4962
5052
  : createStylesheet(vm, stylesheetsContent);
@@ -4973,9 +5063,9 @@ function evaluateTemplate(vm, html) {
4973
5063
  // Set the global flag that template is being updated
4974
5064
  isUpdatingTemplate = true;
4975
5065
  vnodes = html.call(undefined, api, component, cmpSlots, context.tplCache);
4976
- const { styleVNode } = context;
4977
- if (!isNull(styleVNode)) {
4978
- ArrayUnshift.call(vnodes, styleVNode);
5066
+ const { styleVNodes } = context;
5067
+ if (!isNull(styleVNodes)) {
5068
+ ArrayUnshift.apply(vnodes, styleVNodes);
4979
5069
  }
4980
5070
  });
4981
5071
  }, () => {
@@ -5340,7 +5430,7 @@ function createVM(elm, ctor, renderer, options) {
5340
5430
  hasTokenInClass: undefined,
5341
5431
  hasTokenInAttribute: undefined,
5342
5432
  hasScopedStyles: undefined,
5343
- styleVNode: null,
5433
+ styleVNodes: null,
5344
5434
  tplCache: EmptyObject,
5345
5435
  wiredConnecting: EmptyArray,
5346
5436
  wiredDisconnecting: EmptyArray
@@ -6264,6 +6354,10 @@ function hydrateNode(node, vnode, renderer) {
6264
6354
  // VComment has no special capability, fallback to the owner's renderer
6265
6355
  hydratedNode = hydrateComment(node, vnode, renderer);
6266
6356
  break;
6357
+ case 4 /* Static */:
6358
+ // VStatic are cacheable and cannot have custom renderer associated to them
6359
+ hydratedNode = hydrateStaticElement(node, vnode, renderer);
6360
+ break;
6267
6361
  case 2 /* Element */:
6268
6362
  hydratedNode = hydrateElement(node, vnode, (_a = vnode.data.renderer) !== null && _a !== void 0 ? _a : renderer);
6269
6363
  break;
@@ -6307,6 +6401,13 @@ function hydrateComment(node, vnode, renderer) {
6307
6401
  vnode.elm = node;
6308
6402
  return node;
6309
6403
  }
6404
+ function hydrateStaticElement(elm, vnode, renderer) {
6405
+ if (!areCompatibleNodes(vnode.fragment, elm, vnode, renderer)) {
6406
+ return handleMismatch(elm, vnode, renderer);
6407
+ }
6408
+ vnode.elm = elm;
6409
+ return elm;
6410
+ }
6310
6411
  function hydrateElement(elm, vnode, renderer) {
6311
6412
  if (!hasCorrectNodeType(vnode, elm, 1 /* ELEMENT */, renderer) ||
6312
6413
  !isMatchingElement(vnode, elm, renderer)) {
@@ -6542,6 +6643,39 @@ function validateStyleAttr(vnode, elm, renderer) {
6542
6643
  }
6543
6644
  return nodesAreCompatible;
6544
6645
  }
6646
+ function areCompatibleNodes(client, ssr, vnode, renderer) {
6647
+ const { getProperty, getAttribute } = renderer;
6648
+ if (getProperty(client, 'nodeType') === 3 /* TEXT */) {
6649
+ if (!hasCorrectNodeType(vnode, ssr, 3 /* TEXT */, renderer)) {
6650
+ return false;
6651
+ }
6652
+ return getProperty(client, 'nodeValue') === getProperty(ssr, 'nodeValue');
6653
+ }
6654
+ if (getProperty(client, 'nodeType') === 8 /* COMMENT */) {
6655
+ if (!hasCorrectNodeType(vnode, ssr, 8 /* COMMENT */, renderer)) {
6656
+ return false;
6657
+ }
6658
+ return getProperty(client, 'nodeValue') === getProperty(ssr, 'nodeValue');
6659
+ }
6660
+ if (!hasCorrectNodeType(vnode, ssr, 1 /* ELEMENT */, renderer)) {
6661
+ return false;
6662
+ }
6663
+ let isCompatibleElements = true;
6664
+ if (getProperty(client, 'tagName') !== getProperty(ssr, 'tagName')) {
6665
+ if (process.env.NODE_ENV !== 'production') {
6666
+ logError(`Hydration mismatch: expecting element with tag "${getProperty(client, 'tagName').toLowerCase()}" but found "${getProperty(ssr, 'tagName').toLowerCase()}".`, vnode.owner);
6667
+ }
6668
+ return false;
6669
+ }
6670
+ const clientAttrsNames = getProperty(client, 'getAttributeNames').call(client);
6671
+ clientAttrsNames.forEach((attrName) => {
6672
+ if (getAttribute(client, attrName) !== getAttribute(ssr, attrName)) {
6673
+ logError(`Mismatch hydrating element <${getProperty(client, 'tagName').toLowerCase()}>: attribute "${attrName}" has different values, expected "${getAttribute(client, attrName)}" but found "${getAttribute(ssr, attrName)}"`, vnode.owner);
6674
+ isCompatibleElements = false;
6675
+ }
6676
+ });
6677
+ return isCompatibleElements;
6678
+ }
6545
6679
 
6546
6680
  /*
6547
6681
  * Copyright (c) 2018, salesforce.com, inc.
@@ -6677,7 +6811,7 @@ function getComponentConstructor(elm) {
6677
6811
  }
6678
6812
  return ctor;
6679
6813
  }
6680
- /* version: 2.14.2 */
6814
+ /* version: 2.15.0 */
6681
6815
 
6682
6816
  /*
6683
6817
  * Copyright (c) 2018, salesforce.com, inc.
@@ -6895,6 +7029,12 @@ function isHydrating() {
6895
7029
  }
6896
7030
  const isNativeShadowDefined = _globalThis[KEY__IS_NATIVE_SHADOW_ROOT_DEFINED];
6897
7031
  const isSyntheticShadowDefined = hasOwnProperty$1.call(Element.prototype, KEY__SHADOW_TOKEN);
7032
+ function cloneNode(node, deep) {
7033
+ return node.cloneNode(deep);
7034
+ }
7035
+ function createFragment(html) {
7036
+ return document.createRange().createContextualFragment(html).firstChild;
7037
+ }
6898
7038
  function createElement$1(tagName, namespace) {
6899
7039
  return isUndefined$1(namespace)
6900
7040
  ? document.createElement(tagName)
@@ -7019,6 +7159,8 @@ const renderer = {
7019
7159
  isHydrating,
7020
7160
  insert,
7021
7161
  remove,
7162
+ cloneNode,
7163
+ createFragment,
7022
7164
  createElement: createElement$1,
7023
7165
  createText,
7024
7166
  createComment,
@@ -7348,6 +7490,6 @@ defineProperty(LightningElement, 'CustomElementConstructor', {
7348
7490
  });
7349
7491
  freeze(LightningElement);
7350
7492
  seal(LightningElement.prototype);
7351
- /* version: 2.14.2 */
7493
+ /* version: 2.15.0 */
7352
7494
 
7353
- export { LightningElement, profilerControl as __unstable__ProfilerControl, api$1 as api, deprecatedBuildCustomElementConstructor as buildCustomElementConstructor, createContextProvider, createElement, freezeTemplate, getComponentConstructor, getComponentDef, hydrateComponent, isComponentConstructor, isNodeShadowed as isNodeFromTemplate, readonly, register, registerComponent, registerDecorators, registerTemplate, renderer, sanitizeAttribute, setFeatureFlag, setFeatureFlagForTest, setHooks, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };
7495
+ export { LightningElement, profilerControl as __unstable__ProfilerControl, api$1 as api, deprecatedBuildCustomElementConstructor as buildCustomElementConstructor, createContextProvider, createElement, freezeTemplate, getComponentConstructor, getComponentDef, hydrateComponent, isComponentConstructor, isNodeShadowed as isNodeFromTemplate, parseFragment, parseSVGFragment, readonly, register, registerComponent, registerDecorators, registerTemplate, renderer, sanitizeAttribute, setFeatureFlag, setFeatureFlagForTest, setHooks, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };
@@ -233,6 +233,7 @@ var LWC = (function (exports) {
233
233
  */
234
234
  const KEY__IS_NATIVE_SHADOW_ROOT_DEFINED = '$isNativeShadowRootDefined$';
235
235
  const KEY__SHADOW_RESOLVER = '$shadowResolver$';
236
+ const KEY__SHADOW_STATIC = '$shadowStaticNode$';
236
237
  const KEY__SHADOW_TOKEN = '$shadowToken$';
237
238
  const KEY__SYNTHETIC_MODE = '$$lwc-synthetic-mode';
238
239
  const KEY__SCOPED_CSS = '$scoped$';
@@ -301,9 +302,9 @@ var LWC = (function (exports) {
301
302
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
302
303
  */
303
304
  // Increment whenever the LWC template compiler changes
304
- const LWC_VERSION = "2.14.2";
305
+ const LWC_VERSION = "2.15.0";
305
306
  const LWC_VERSION_COMMENT_REGEX = /\/\*LWC compiler v([\d.]+)\*\/\s*}/;
306
- /** version: 2.14.2 */
307
+ /** version: 2.15.0 */
307
308
 
308
309
  /*
309
310
  * Copyright (c) 2018, salesforce.com, inc.
@@ -457,7 +458,7 @@ var LWC = (function (exports) {
457
458
  setFeatureFlag(name, value);
458
459
  }
459
460
  }
460
- /** version: 2.14.2 */
461
+ /** version: 2.15.0 */
461
462
 
462
463
  /*
463
464
  * Copyright (c) 2018, salesforce.com, inc.
@@ -3662,6 +3663,9 @@ var LWC = (function (exports) {
3662
3663
  // VComment has no special capability, fallback to the owner's renderer
3663
3664
  patchComment(n1, n2, renderer);
3664
3665
  break;
3666
+ case 4 /* Static */:
3667
+ n2.elm = n1.elm;
3668
+ break;
3665
3669
  case 2 /* Element */:
3666
3670
  patchElement(n1, n2, (_a = n2.data.renderer) !== null && _a !== void 0 ? _a : renderer);
3667
3671
  break;
@@ -3681,6 +3685,10 @@ var LWC = (function (exports) {
3681
3685
  // VComment has no special capability, fallback to the owner's renderer
3682
3686
  mountComment(node, parent, anchor, renderer);
3683
3687
  break;
3688
+ case 4 /* Static */:
3689
+ // VStatic cannot have a custom renderer associated to them, using owner's renderer
3690
+ mountStatic(node, parent, anchor, renderer);
3691
+ break;
3684
3692
  case 2 /* Element */:
3685
3693
  // If the vnode data has a renderer override use it, else fallback to owner's renderer
3686
3694
  mountElement(node, parent, anchor, (_a = node.data.renderer) !== null && _a !== void 0 ? _a : renderer);
@@ -3736,6 +3744,24 @@ var LWC = (function (exports) {
3736
3744
  patchElementPropsAndAttrs$1(n1, n2, renderer);
3737
3745
  patchChildren(n1.children, n2.children, elm, renderer);
3738
3746
  }
3747
+ function mountStatic(vnode, parent, anchor, renderer) {
3748
+ const { owner } = vnode;
3749
+ const { cloneNode, isSyntheticShadowDefined } = renderer;
3750
+ const elm = (vnode.elm = cloneNode(vnode.fragment, true));
3751
+ linkNodeToShadow(elm, owner, renderer);
3752
+ // Marks this node as Static to propagate the shadow resolver. must happen after elm is assigned to the proper shadow
3753
+ const { renderMode, shadowMode } = owner;
3754
+ if (isSyntheticShadowDefined) {
3755
+ if (shadowMode === 1 /* Synthetic */ || renderMode === 0 /* Light */) {
3756
+ elm[KEY__SHADOW_STATIC] = true;
3757
+ }
3758
+ }
3759
+ if (process.env.NODE_ENV !== 'production') {
3760
+ const isLight = renderMode === 0 /* Light */;
3761
+ patchElementWithRestrictions(elm, { isPortal: false, isLight });
3762
+ }
3763
+ insertNode(elm, parent, anchor, renderer);
3764
+ }
3739
3765
  function mountCustomElement(vnode, parent, anchor, renderer) {
3740
3766
  const { sel, owner } = vnode;
3741
3767
  const UpgradableConstructor = getUpgradableConstructor(sel, renderer);
@@ -4204,6 +4230,17 @@ var LWC = (function (exports) {
4204
4230
  function addVNodeToChildLWC(vnode) {
4205
4231
  ArrayPush$1.call(getVMBeingRendered().velements, vnode);
4206
4232
  }
4233
+ // [st]atic node
4234
+ function st(fragment, key) {
4235
+ return {
4236
+ type: 4 /* Static */,
4237
+ sel: undefined,
4238
+ key,
4239
+ elm: undefined,
4240
+ fragment,
4241
+ owner: getVMBeingRendered(),
4242
+ };
4243
+ }
4207
4244
  // [h]tml node
4208
4245
  function h(sel, data, children = EmptyArray) {
4209
4246
  const vmBeingRendered = getVMBeingRendered();
@@ -4593,6 +4630,7 @@ var LWC = (function (exports) {
4593
4630
  co,
4594
4631
  dc,
4595
4632
  ti,
4633
+ st,
4596
4634
  gid,
4597
4635
  fid,
4598
4636
  shc,
@@ -4744,8 +4782,7 @@ var LWC = (function (exports) {
4744
4782
  // This works in the client, because the stylesheets are created, and cached in the VM
4745
4783
  // the first time the VM renders.
4746
4784
  // native shadow or light DOM, SSR
4747
- const combinedStylesheetContent = ArrayJoin.call(stylesheets, '\n');
4748
- return createInlineStyleVNode(combinedStylesheetContent);
4785
+ return ArrayMap.call(stylesheets, createInlineStyleVNode);
4749
4786
  }
4750
4787
  else {
4751
4788
  // native shadow or light DOM, DOM renderer
@@ -4913,6 +4950,59 @@ var LWC = (function (exports) {
4913
4950
  assert.isTrue(isUndefined$1(template.renderMode), `Shadow DOM components template can't render light DOM templates. Either remove the 'lwc:render-mode' directive from ${getComponentTag(vm)} or set it to 'lwc:render-mode="shadow"`);
4914
4951
  }
4915
4952
  }
4953
+ function buildParseFragmentFn(createFragmentFn) {
4954
+ return (strings, ...keys) => {
4955
+ const cache = create(null);
4956
+ return function () {
4957
+ const { context: { hasScopedStyles, stylesheetToken }, shadowMode, renderer, } = getVMBeingRendered();
4958
+ const hasStyleToken = !isUndefined$1(stylesheetToken);
4959
+ const isSyntheticShadow = shadowMode === 1 /* Synthetic */;
4960
+ let cacheKey = 0;
4961
+ if (hasStyleToken && hasScopedStyles) {
4962
+ cacheKey |= 1 /* HAS_SCOPED_STYLE */;
4963
+ }
4964
+ if (hasStyleToken && isSyntheticShadow) {
4965
+ cacheKey |= 2 /* SHADOW_MODE_SYNTHETIC */;
4966
+ }
4967
+ if (!isUndefined$1(cache[cacheKey])) {
4968
+ return cache[cacheKey];
4969
+ }
4970
+ const classToken = hasScopedStyles && hasStyleToken ? ' ' + stylesheetToken : '';
4971
+ const classAttrToken = hasScopedStyles && hasStyleToken ? ` class="${stylesheetToken}"` : '';
4972
+ const attrToken = hasStyleToken && isSyntheticShadow ? ' ' + stylesheetToken : '';
4973
+ let htmlFragment = '';
4974
+ for (let i = 0, n = keys.length; i < n; i++) {
4975
+ switch (keys[i]) {
4976
+ case 0: // styleToken in existing class attr
4977
+ htmlFragment += strings[i] + classToken;
4978
+ break;
4979
+ case 1: // styleToken for added class attr
4980
+ htmlFragment += strings[i] + classAttrToken;
4981
+ break;
4982
+ case 2: // styleToken as attr
4983
+ htmlFragment += strings[i] + attrToken;
4984
+ break;
4985
+ case 3: // ${1}${2}
4986
+ htmlFragment += strings[i] + classAttrToken + attrToken;
4987
+ break;
4988
+ }
4989
+ }
4990
+ htmlFragment += strings[strings.length - 1];
4991
+ cache[cacheKey] = createFragmentFn(htmlFragment, renderer);
4992
+ return cache[cacheKey];
4993
+ };
4994
+ };
4995
+ }
4996
+ // Note: at the moment this code executes, we don't have a renderer yet.
4997
+ const parseFragment = buildParseFragmentFn((html, renderer) => {
4998
+ const { createFragment } = renderer;
4999
+ return createFragment(html);
5000
+ });
5001
+ const parseSVGFragment = buildParseFragmentFn((html, renderer) => {
5002
+ const { createFragment, getFirstChild } = renderer;
5003
+ const fragment = createFragment('<svg>' + html + '</svg>');
5004
+ return getFirstChild(fragment);
5005
+ });
4916
5006
  function evaluateTemplate(vm, html) {
4917
5007
  if (process.env.NODE_ENV !== 'production') {
4918
5008
  assert.isTrue(isFunction$1(html), `evaluateTemplate() second argument must be an imported template instead of ${toString$1(html)}`);
@@ -4959,7 +5049,7 @@ var LWC = (function (exports) {
4959
5049
  // Evaluate, create stylesheet and cache the produced VNode for future
4960
5050
  // re-rendering.
4961
5051
  const stylesheetsContent = getStylesheetsContent(vm, html);
4962
- context.styleVNode =
5052
+ context.styleVNodes =
4963
5053
  stylesheetsContent.length === 0
4964
5054
  ? null
4965
5055
  : createStylesheet(vm, stylesheetsContent);
@@ -4976,9 +5066,9 @@ var LWC = (function (exports) {
4976
5066
  // Set the global flag that template is being updated
4977
5067
  isUpdatingTemplate = true;
4978
5068
  vnodes = html.call(undefined, api, component, cmpSlots, context.tplCache);
4979
- const { styleVNode } = context;
4980
- if (!isNull(styleVNode)) {
4981
- ArrayUnshift.call(vnodes, styleVNode);
5069
+ const { styleVNodes } = context;
5070
+ if (!isNull(styleVNodes)) {
5071
+ ArrayUnshift.apply(vnodes, styleVNodes);
4982
5072
  }
4983
5073
  });
4984
5074
  }, () => {
@@ -5343,7 +5433,7 @@ var LWC = (function (exports) {
5343
5433
  hasTokenInClass: undefined,
5344
5434
  hasTokenInAttribute: undefined,
5345
5435
  hasScopedStyles: undefined,
5346
- styleVNode: null,
5436
+ styleVNodes: null,
5347
5437
  tplCache: EmptyObject,
5348
5438
  wiredConnecting: EmptyArray,
5349
5439
  wiredDisconnecting: EmptyArray
@@ -6267,6 +6357,10 @@ var LWC = (function (exports) {
6267
6357
  // VComment has no special capability, fallback to the owner's renderer
6268
6358
  hydratedNode = hydrateComment(node, vnode, renderer);
6269
6359
  break;
6360
+ case 4 /* Static */:
6361
+ // VStatic are cacheable and cannot have custom renderer associated to them
6362
+ hydratedNode = hydrateStaticElement(node, vnode, renderer);
6363
+ break;
6270
6364
  case 2 /* Element */:
6271
6365
  hydratedNode = hydrateElement(node, vnode, (_a = vnode.data.renderer) !== null && _a !== void 0 ? _a : renderer);
6272
6366
  break;
@@ -6310,6 +6404,13 @@ var LWC = (function (exports) {
6310
6404
  vnode.elm = node;
6311
6405
  return node;
6312
6406
  }
6407
+ function hydrateStaticElement(elm, vnode, renderer) {
6408
+ if (!areCompatibleNodes(vnode.fragment, elm, vnode, renderer)) {
6409
+ return handleMismatch(elm, vnode, renderer);
6410
+ }
6411
+ vnode.elm = elm;
6412
+ return elm;
6413
+ }
6313
6414
  function hydrateElement(elm, vnode, renderer) {
6314
6415
  if (!hasCorrectNodeType(vnode, elm, 1 /* ELEMENT */, renderer) ||
6315
6416
  !isMatchingElement(vnode, elm, renderer)) {
@@ -6545,6 +6646,39 @@ var LWC = (function (exports) {
6545
6646
  }
6546
6647
  return nodesAreCompatible;
6547
6648
  }
6649
+ function areCompatibleNodes(client, ssr, vnode, renderer) {
6650
+ const { getProperty, getAttribute } = renderer;
6651
+ if (getProperty(client, 'nodeType') === 3 /* TEXT */) {
6652
+ if (!hasCorrectNodeType(vnode, ssr, 3 /* TEXT */, renderer)) {
6653
+ return false;
6654
+ }
6655
+ return getProperty(client, 'nodeValue') === getProperty(ssr, 'nodeValue');
6656
+ }
6657
+ if (getProperty(client, 'nodeType') === 8 /* COMMENT */) {
6658
+ if (!hasCorrectNodeType(vnode, ssr, 8 /* COMMENT */, renderer)) {
6659
+ return false;
6660
+ }
6661
+ return getProperty(client, 'nodeValue') === getProperty(ssr, 'nodeValue');
6662
+ }
6663
+ if (!hasCorrectNodeType(vnode, ssr, 1 /* ELEMENT */, renderer)) {
6664
+ return false;
6665
+ }
6666
+ let isCompatibleElements = true;
6667
+ if (getProperty(client, 'tagName') !== getProperty(ssr, 'tagName')) {
6668
+ if (process.env.NODE_ENV !== 'production') {
6669
+ logError(`Hydration mismatch: expecting element with tag "${getProperty(client, 'tagName').toLowerCase()}" but found "${getProperty(ssr, 'tagName').toLowerCase()}".`, vnode.owner);
6670
+ }
6671
+ return false;
6672
+ }
6673
+ const clientAttrsNames = getProperty(client, 'getAttributeNames').call(client);
6674
+ clientAttrsNames.forEach((attrName) => {
6675
+ if (getAttribute(client, attrName) !== getAttribute(ssr, attrName)) {
6676
+ logError(`Mismatch hydrating element <${getProperty(client, 'tagName').toLowerCase()}>: attribute "${attrName}" has different values, expected "${getAttribute(client, attrName)}" but found "${getAttribute(ssr, attrName)}"`, vnode.owner);
6677
+ isCompatibleElements = false;
6678
+ }
6679
+ });
6680
+ return isCompatibleElements;
6681
+ }
6548
6682
 
6549
6683
  /*
6550
6684
  * Copyright (c) 2018, salesforce.com, inc.
@@ -6680,7 +6814,7 @@ var LWC = (function (exports) {
6680
6814
  }
6681
6815
  return ctor;
6682
6816
  }
6683
- /* version: 2.14.2 */
6817
+ /* version: 2.15.0 */
6684
6818
 
6685
6819
  /*
6686
6820
  * Copyright (c) 2018, salesforce.com, inc.
@@ -6898,6 +7032,12 @@ var LWC = (function (exports) {
6898
7032
  }
6899
7033
  const isNativeShadowDefined = _globalThis[KEY__IS_NATIVE_SHADOW_ROOT_DEFINED];
6900
7034
  const isSyntheticShadowDefined = hasOwnProperty$1.call(Element.prototype, KEY__SHADOW_TOKEN);
7035
+ function cloneNode(node, deep) {
7036
+ return node.cloneNode(deep);
7037
+ }
7038
+ function createFragment(html) {
7039
+ return document.createRange().createContextualFragment(html).firstChild;
7040
+ }
6901
7041
  function createElement$1(tagName, namespace) {
6902
7042
  return isUndefined$1(namespace)
6903
7043
  ? document.createElement(tagName)
@@ -7022,6 +7162,8 @@ var LWC = (function (exports) {
7022
7162
  isHydrating,
7023
7163
  insert,
7024
7164
  remove,
7165
+ cloneNode,
7166
+ createFragment,
7025
7167
  createElement: createElement$1,
7026
7168
  createText,
7027
7169
  createComment,
@@ -7351,7 +7493,7 @@ var LWC = (function (exports) {
7351
7493
  });
7352
7494
  freeze(LightningElement);
7353
7495
  seal(LightningElement.prototype);
7354
- /* version: 2.14.2 */
7496
+ /* version: 2.15.0 */
7355
7497
 
7356
7498
  exports.LightningElement = LightningElement;
7357
7499
  exports.__unstable__ProfilerControl = profilerControl;
@@ -7365,6 +7507,8 @@ var LWC = (function (exports) {
7365
7507
  exports.hydrateComponent = hydrateComponent;
7366
7508
  exports.isComponentConstructor = isComponentConstructor;
7367
7509
  exports.isNodeFromTemplate = isNodeShadowed;
7510
+ exports.parseFragment = parseFragment;
7511
+ exports.parseSVGFragment = parseSVGFragment;
7368
7512
  exports.readonly = readonly;
7369
7513
  exports.register = register;
7370
7514
  exports.registerComponent = registerComponent;