lwc 2.9.0 → 2.10.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 (35) hide show
  1. package/dist/engine-dom/esm/es2017/engine-dom.js +603 -449
  2. package/dist/engine-dom/iife/es2017/engine-dom.js +603 -449
  3. package/dist/engine-dom/iife/es2017/engine-dom.min.js +1 -1
  4. package/dist/engine-dom/iife/es2017/engine-dom_debug.js +477 -398
  5. package/dist/engine-dom/iife/es5/engine-dom.js +657 -479
  6. package/dist/engine-dom/iife/es5/engine-dom.min.js +1 -1
  7. package/dist/engine-dom/iife/es5/engine-dom_debug.js +509 -425
  8. package/dist/engine-dom/umd/es2017/engine-dom.js +603 -449
  9. package/dist/engine-dom/umd/es2017/engine-dom.min.js +1 -1
  10. package/dist/engine-dom/umd/es2017/engine-dom_debug.js +477 -398
  11. package/dist/engine-dom/umd/es5/engine-dom.js +657 -479
  12. package/dist/engine-dom/umd/es5/engine-dom.min.js +1 -1
  13. package/dist/engine-dom/umd/es5/engine-dom_debug.js +509 -425
  14. package/dist/engine-server/commonjs/es2017/engine-server.js +391 -285
  15. package/dist/engine-server/commonjs/es2017/engine-server.min.js +1 -1
  16. package/dist/engine-server/esm/es2017/engine-server.js +391 -285
  17. package/dist/synthetic-shadow/esm/es2017/synthetic-shadow.js +3 -3
  18. package/dist/synthetic-shadow/iife/es2017/synthetic-shadow.js +3 -3
  19. package/dist/synthetic-shadow/iife/es2017/synthetic-shadow_debug.js +3 -3
  20. package/dist/synthetic-shadow/iife/es5/synthetic-shadow.js +3 -3
  21. package/dist/synthetic-shadow/iife/es5/synthetic-shadow_debug.js +3 -3
  22. package/dist/synthetic-shadow/umd/es2017/synthetic-shadow.js +3 -3
  23. package/dist/synthetic-shadow/umd/es2017/synthetic-shadow_debug.js +3 -3
  24. package/dist/synthetic-shadow/umd/es5/synthetic-shadow.js +3 -3
  25. package/dist/synthetic-shadow/umd/es5/synthetic-shadow_debug.js +3 -3
  26. package/dist/wire-service/esm/es2017/wire-service.js +2 -2
  27. package/dist/wire-service/iife/es2017/wire-service.js +2 -2
  28. package/dist/wire-service/iife/es2017/wire-service_debug.js +2 -2
  29. package/dist/wire-service/iife/es5/wire-service.js +2 -2
  30. package/dist/wire-service/iife/es5/wire-service_debug.js +2 -2
  31. package/dist/wire-service/umd/es2017/wire-service.js +2 -2
  32. package/dist/wire-service/umd/es2017/wire-service_debug.js +2 -2
  33. package/dist/wire-service/umd/es5/wire-service.js +2 -2
  34. package/dist/wire-service/umd/es5/wire-service_debug.js +2 -2
  35. package/package.json +7 -7
@@ -303,7 +303,17 @@ function htmlPropertyToAttribute(propName) {
303
303
  const XML_NAMESPACE = 'http://www.w3.org/XML/1998/namespace';
304
304
  const SVG_NAMESPACE = 'http://www.w3.org/2000/svg';
305
305
  const XLINK_NAMESPACE = 'http://www.w3.org/1999/xlink';
306
- /** version: 2.9.0 */
306
+ /*
307
+ * Copyright (c) 2018, salesforce.com, inc.
308
+ * All rights reserved.
309
+ * SPDX-License-Identifier: MIT
310
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
311
+ */
312
+ // Increment whenever the LWC template compiler changes
313
+
314
+ const LWC_VERSION = "2.10.0";
315
+ const LWC_VERSION_COMMENT_REGEX = /\/\*LWC compiler v([\d.]+)\*\/\s*}/;
316
+ /** version: 2.10.0 */
307
317
 
308
318
  /*
309
319
  * Copyright (c) 2018, salesforce.com, inc.
@@ -370,7 +380,7 @@ function createAriaPropertyPropertyDescriptor(propName, attrName) {
370
380
  };
371
381
  }
372
382
 
373
- function patch(propName) {
383
+ function patch$1(propName) {
374
384
  // Typescript is inferring the wrong function type for this particular
375
385
  // overloaded method: https://github.com/Microsoft/TypeScript/issues/27972
376
386
  // @ts-ignore type-mismatch
@@ -392,7 +402,7 @@ for (let i = 0, len = ElementPrototypeAriaPropertyNames.length; i < len; i += 1)
392
402
  const propName = ElementPrototypeAriaPropertyNames[i];
393
403
 
394
404
  if (detect(propName)) {
395
- patch(propName);
405
+ patch$1(propName);
396
406
  }
397
407
  }
398
408
  /**
@@ -408,14 +418,15 @@ for (let i = 0, len = ElementPrototypeAriaPropertyNames.length; i < len; i += 1)
408
418
 
409
419
 
410
420
  const features = {
411
- ENABLE_REACTIVE_SETTER: null,
412
- ENABLE_HMR: null,
413
- ENABLE_INNER_OUTER_TEXT_PATCH: null,
421
+ DISABLE_MIXED_SHADOW_MODE: null,
414
422
  ENABLE_ELEMENT_PATCH: null,
415
423
  ENABLE_FORCE_NATIVE_SHADOW_MODE_FOR_TEST: null,
416
- ENABLE_NODE_LIST_PATCH: null,
424
+ ENABLE_HMR: null,
417
425
  ENABLE_HTML_COLLECTIONS_PATCH: null,
426
+ ENABLE_INNER_OUTER_TEXT_PATCH: null,
427
+ ENABLE_NODE_LIST_PATCH: null,
418
428
  ENABLE_NODE_PATCH: null,
429
+ ENABLE_REACTIVE_SETTER: null,
419
430
  ENABLE_WIRE_SYNC_EMIT: null
420
431
  };
421
432
 
@@ -480,7 +491,7 @@ function setFeatureFlagForTest(name, value) {
480
491
  setFeatureFlag(name, value);
481
492
  }
482
493
  }
483
- /** version: 2.9.0 */
494
+ /** version: 2.10.0 */
484
495
 
485
496
  /* proxy-compat-disable */
486
497
 
@@ -567,6 +578,20 @@ function cloneAndOmitKey(object, keyToOmit) {
567
578
  }
568
579
 
569
580
  return result;
581
+ }
582
+
583
+ function flattenStylesheets(stylesheets) {
584
+ const list = [];
585
+
586
+ for (const stylesheet of stylesheets) {
587
+ if (!Array.isArray(stylesheet)) {
588
+ list.push(stylesheet);
589
+ } else {
590
+ list.push(...flattenStylesheets(stylesheet));
591
+ }
592
+ }
593
+
594
+ return list;
570
595
  } //
571
596
  // Primitives
572
597
  //
@@ -3372,6 +3397,47 @@ function getDecoratorsMeta(Ctor) {
3372
3397
  const meta = signedDecoratorToMetaMap.get(Ctor);
3373
3398
  return isUndefined$1(meta) ? defaultMeta : meta;
3374
3399
  }
3400
+ /*
3401
+ * Copyright (c) 2018, salesforce.com, inc.
3402
+ * All rights reserved.
3403
+ * SPDX-License-Identifier: MIT
3404
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
3405
+ */
3406
+
3407
+
3408
+ let warned = false;
3409
+
3410
+ if (process.env.NODE_ENV === 'development') {
3411
+ // @ts-ignore
3412
+ window.__lwcResetWarnedOnVersionMismatch = () => {
3413
+ warned = false;
3414
+ };
3415
+ }
3416
+
3417
+ function checkVersionMismatch(func, type) {
3418
+ const versionMatcher = func.toString().match(LWC_VERSION_COMMENT_REGEX);
3419
+
3420
+ if (!isNull(versionMatcher) && !warned) {
3421
+ const version = versionMatcher[1];
3422
+ const [major, minor] = version.split('.');
3423
+ const [expectedMajor, expectedMinor] = LWC_VERSION.split('.');
3424
+
3425
+ if (major !== expectedMajor || minor !== expectedMinor) {
3426
+ warned = true; // only warn once to avoid flooding the console
3427
+ // stylesheets and templates do not have user-meaningful names, but components do
3428
+
3429
+ const friendlyName = type === 'component' ? `${type} ${func.name}` : type;
3430
+ logError(`LWC WARNING: current engine is v${LWC_VERSION}, but ${friendlyName} was compiled with v${version}.\nPlease update your compiled code or LWC engine so that the versions match.\nNo further warnings will appear.`);
3431
+ }
3432
+ }
3433
+ }
3434
+ /*
3435
+ * Copyright (c) 2018, salesforce.com, inc.
3436
+ * All rights reserved.
3437
+ * SPDX-License-Identifier: MIT
3438
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
3439
+ */
3440
+
3375
3441
 
3376
3442
  const signedTemplateSet = new Set();
3377
3443
 
@@ -3384,6 +3450,16 @@ signedTemplateSet.add(defaultEmptyTemplate);
3384
3450
  function isTemplateRegistered(tpl) {
3385
3451
  return signedTemplateSet.has(tpl);
3386
3452
  }
3453
+
3454
+ function checkTemplateVersionMismatch(template) {
3455
+ checkVersionMismatch(template, 'template');
3456
+
3457
+ if (!isUndefined$1(template.stylesheets)) {
3458
+ for (const stylesheet of flattenStylesheets(template.stylesheets)) {
3459
+ checkVersionMismatch(stylesheet, 'stylesheet');
3460
+ }
3461
+ }
3462
+ }
3387
3463
  /**
3388
3464
  * INTERNAL: This function can only be invoked by compiled code. The compiler
3389
3465
  * will prevent this function from being imported by userland code.
@@ -3391,6 +3467,10 @@ function isTemplateRegistered(tpl) {
3391
3467
 
3392
3468
 
3393
3469
  function registerTemplate(tpl) {
3470
+ if (process.env.NODE_ENV !== 'production') {
3471
+ checkTemplateVersionMismatch(tpl);
3472
+ }
3473
+
3394
3474
  signedTemplateSet.add(tpl); // chaining this method as a way to wrap existing
3395
3475
  // assignment of templates easily, without too much transformation
3396
3476
 
@@ -3686,20 +3766,6 @@ function rehydrateHotComponent(Ctor) {
3686
3766
  return canRefreshAllInstances;
3687
3767
  }
3688
3768
 
3689
- function flattenStylesheets(stylesheets) {
3690
- const list = [];
3691
-
3692
- for (const stylesheet of stylesheets) {
3693
- if (!Array.isArray(stylesheet)) {
3694
- list.push(stylesheet);
3695
- } else {
3696
- list.push(...flattenStylesheets(stylesheet));
3697
- }
3698
- }
3699
-
3700
- return list;
3701
- }
3702
-
3703
3769
  function getTemplateOrSwappedTemplate(tpl) {
3704
3770
  if (process.env.NODE_ENV === 'production') {
3705
3771
  // this method should never leak to prod
@@ -4530,156 +4596,268 @@ function applyStaticStyleAttribute(vnode) {
4530
4596
  */
4531
4597
 
4532
4598
 
4533
- const TextHook = {
4534
- create: vnode => {
4535
- const {
4536
- owner
4537
- } = vnode;
4538
- const elm = createText$1(vnode.text);
4539
- linkNodeToShadow(elm, owner);
4540
- vnode.elm = elm;
4541
- },
4542
- update: updateNodeHook,
4543
- insert: insertNode,
4544
- move: insertNode,
4545
- remove: removeNode
4546
- };
4547
- const CommentHook = {
4548
- create: vnode => {
4549
- const {
4550
- owner,
4551
- text
4552
- } = vnode;
4553
- const elm = createComment$1(text);
4554
- linkNodeToShadow(elm, owner);
4555
- vnode.elm = elm;
4556
- },
4557
- update: updateNodeHook,
4558
- insert: insertNode,
4559
- move: insertNode,
4560
- remove: removeNode
4561
- }; // insert is called after update, which is used somewhere else (via a module)
4562
- // to mark the vm as inserted, that means we cannot use update as the main channel
4563
- // to rehydrate when dirty, because sometimes the element is not inserted just yet,
4564
- // which breaks some invariants. For that reason, we have the following for any
4565
- // Custom Element that is inserted via a template.
4566
-
4567
- const ElementHook = {
4568
- create: vnode => {
4569
- const {
4570
- sel,
4571
- owner,
4572
- data: {
4573
- svg
4574
- }
4575
- } = vnode;
4576
- const namespace = isTrue(svg) ? SVG_NAMESPACE : undefined;
4577
- const elm = createElement$2(sel, namespace);
4578
- linkNodeToShadow(elm, owner);
4579
- fallbackElmHook(elm, vnode);
4580
- vnode.elm = elm;
4581
- patchElementPropsAndAttrs$1(null, vnode);
4582
- },
4583
- update: (oldVnode, vnode) => {
4584
- patchElementPropsAndAttrs$1(oldVnode, vnode);
4585
- patchChildren(vnode.elm, oldVnode.children, vnode.children);
4586
- },
4587
- insert: (vnode, parentNode, referenceNode) => {
4588
- insertNode(vnode, parentNode, referenceNode);
4589
- createChildrenHook(vnode);
4590
- },
4591
- move: insertNode,
4592
- remove: (vnode, parentNode) => {
4593
- removeNode(vnode, parentNode);
4594
- removeChildren(vnode);
4599
+ function patchChildren(c1, c2, parent) {
4600
+ if (hasDynamicChildren(c2)) {
4601
+ updateDynamicChildren(c1, c2, parent);
4602
+ } else {
4603
+ updateStaticChildren(c1, c2, parent);
4604
+ }
4605
+ }
4606
+
4607
+ function patch(n1, n2) {
4608
+ if (n1 === n2) {
4609
+ return;
4595
4610
  }
4596
- };
4597
- const CustomElementHook = {
4598
- create: vnode => {
4599
- const {
4600
- sel,
4601
- owner
4602
- } = vnode;
4603
- const UpgradableConstructor = getUpgradableConstructor(sel);
4604
- /**
4605
- * Note: if the upgradable constructor does not expect, or throw when we new it
4606
- * with a callback as the first argument, we could implement a more advanced
4607
- * mechanism that only passes that argument if the constructor is known to be
4608
- * an upgradable custom element.
4609
- */
4610
-
4611
- let vm;
4612
- const elm = new UpgradableConstructor(elm => {
4613
- // the custom element from the registry is expecting an upgrade callback
4614
- vm = createViewModelHook(elm, vnode);
4615
- });
4616
- linkNodeToShadow(elm, owner);
4617
- vnode.elm = elm;
4618
4611
 
4619
- if (vm) {
4620
- allocateChildren(vnode, vm);
4621
- } else if (vnode.ctor !== UpgradableConstructor) {
4622
- throw new TypeError(`Incorrect Component Constructor`);
4612
+ if (process.env.NODE_ENV !== 'production') {
4613
+ if (!isSameVnode(n1, n2)) {
4614
+ throw new Error('Expected these VNodes to be the same: ' + JSON.stringify({
4615
+ sel: n1.sel,
4616
+ key: n1.key
4617
+ }) + ', ' + JSON.stringify({
4618
+ sel: n2.sel,
4619
+ key: n2.key
4620
+ }));
4623
4621
  }
4622
+ }
4624
4623
 
4625
- patchElementPropsAndAttrs$1(null, vnode);
4626
- },
4627
- update: (oldVnode, vnode) => {
4628
- patchElementPropsAndAttrs$1(oldVnode, vnode);
4629
- const vm = getAssociatedVMIfPresent(vnode.elm);
4624
+ switch (n2.type) {
4625
+ case 0
4626
+ /* Text */
4627
+ :
4628
+ patchText(n1, n2);
4629
+ break;
4630
+
4631
+ case 1
4632
+ /* Comment */
4633
+ :
4634
+ patchComment(n1, n2);
4635
+ break;
4630
4636
 
4631
- if (vm) {
4632
- // in fallback mode, the allocation will always set children to
4633
- // empty and delegate the real allocation to the slot elements
4634
- allocateChildren(vnode, vm);
4635
- } // in fallback mode, the children will be always empty, so, nothing
4636
- // will happen, but in native, it does allocate the light dom
4637
+ case 2
4638
+ /* Element */
4639
+ :
4640
+ patchElement(n1, n2);
4641
+ break;
4637
4642
 
4643
+ case 3
4644
+ /* CustomElement */
4645
+ :
4646
+ patchCustomElement(n1, n2);
4647
+ break;
4648
+ }
4649
+ }
4638
4650
 
4639
- patchChildren(vnode.elm, oldVnode.children, vnode.children);
4651
+ function mount(node, parent, anchor) {
4652
+ switch (node.type) {
4653
+ case 0
4654
+ /* Text */
4655
+ :
4656
+ mountText(node, parent, anchor);
4657
+ break;
4640
4658
 
4641
- if (vm) {
4642
- if (process.env.NODE_ENV !== 'production') {
4643
- assert.isTrue(isArray$1(vnode.children), `Invalid vnode for a custom element, it must have children defined.`);
4644
- } // this will probably update the shadowRoot, but only if the vm is in a dirty state
4645
- // this is important to preserve the top to bottom synchronous rendering phase.
4659
+ case 1
4660
+ /* Comment */
4661
+ :
4662
+ mountComment(node, parent, anchor);
4663
+ break;
4664
+
4665
+ case 2
4666
+ /* Element */
4667
+ :
4668
+ mountElement(node, parent, anchor);
4669
+ break;
4670
+
4671
+ case 3
4672
+ /* CustomElement */
4673
+ :
4674
+ mountCustomElement(node, parent, anchor);
4675
+ break;
4676
+ }
4677
+ }
4646
4678
 
4679
+ function patchText(n1, n2) {
4680
+ n2.elm = n1.elm;
4647
4681
 
4648
- rerenderVM(vm);
4682
+ if (n2.text !== n1.text) {
4683
+ updateTextContent(n2);
4684
+ }
4685
+ }
4686
+
4687
+ function mountText(node, parent, anchor) {
4688
+ const {
4689
+ owner
4690
+ } = node;
4691
+ const textNode = node.elm = createText$1(node.text);
4692
+ linkNodeToShadow(textNode, owner);
4693
+ insertNode(textNode, parent, anchor);
4694
+ }
4695
+
4696
+ function patchComment(n1, n2) {
4697
+ n2.elm = n1.elm; // FIXME: Comment nodes should be static, we shouldn't need to diff them together. However
4698
+ // it is the case today.
4699
+
4700
+ if (n2.text !== n1.text) {
4701
+ updateTextContent(n2);
4702
+ }
4703
+ }
4704
+
4705
+ function mountComment(node, parent, anchor) {
4706
+ const {
4707
+ owner
4708
+ } = node;
4709
+ const commentNode = node.elm = createComment$1(node.text);
4710
+ linkNodeToShadow(commentNode, owner);
4711
+ insertNode(commentNode, parent, anchor);
4712
+ }
4713
+
4714
+ function mountElement(vnode, parent, anchor) {
4715
+ const {
4716
+ sel,
4717
+ owner,
4718
+ data: {
4719
+ svg
4649
4720
  }
4650
- },
4651
- insert: (vnode, parentNode, referenceNode) => {
4652
- insertNode(vnode, parentNode, referenceNode);
4653
- const vm = getAssociatedVMIfPresent(vnode.elm);
4721
+ } = vnode;
4722
+ const namespace = isTrue(svg) ? SVG_NAMESPACE : undefined;
4723
+ const elm = createElement$2(sel, namespace);
4724
+ linkNodeToShadow(elm, owner);
4725
+ fallbackElmHook(elm, vnode);
4726
+ vnode.elm = elm;
4727
+ patchElementPropsAndAttrs$1(null, vnode);
4728
+ insertNode(elm, parent, anchor);
4729
+ mountVNodes(vnode.children, elm, null);
4730
+ }
4654
4731
 
4655
- if (vm) {
4656
- if (process.env.NODE_ENV !== 'production') {
4657
- assert.isTrue(vm.state === 0
4658
- /* created */
4659
- , `${vm} cannot be recycled.`);
4660
- }
4732
+ function patchElement(n1, n2) {
4733
+ const elm = n2.elm = n1.elm;
4734
+ patchElementPropsAndAttrs$1(n1, n2);
4735
+ patchChildren(n1.children, n2.children, elm);
4736
+ }
4737
+
4738
+ function mountCustomElement(vnode, parent, anchor) {
4739
+ const {
4740
+ sel,
4741
+ owner
4742
+ } = vnode;
4743
+ const UpgradableConstructor = getUpgradableConstructor(sel);
4744
+ /**
4745
+ * Note: if the upgradable constructor does not expect, or throw when we new it
4746
+ * with a callback as the first argument, we could implement a more advanced
4747
+ * mechanism that only passes that argument if the constructor is known to be
4748
+ * an upgradable custom element.
4749
+ */
4750
+
4751
+ let vm;
4752
+ const elm = new UpgradableConstructor(elm => {
4753
+ // the custom element from the registry is expecting an upgrade callback
4754
+ vm = createViewModelHook(elm, vnode);
4755
+ });
4756
+ linkNodeToShadow(elm, owner);
4757
+ vnode.elm = elm;
4758
+ vnode.vm = vm;
4759
+
4760
+ if (vm) {
4761
+ allocateChildren(vnode, vm);
4762
+ } else if (vnode.ctor !== UpgradableConstructor) {
4763
+ throw new TypeError(`Incorrect Component Constructor`);
4764
+ }
4765
+
4766
+ patchElementPropsAndAttrs$1(null, vnode);
4767
+ insertNode(elm, parent, anchor);
4661
4768
 
4662
- runConnectedCallback(vm);
4769
+ if (vm) {
4770
+ if (process.env.NODE_ENV !== 'production') {
4771
+ assert.isTrue(vm.state === 0
4772
+ /* created */
4773
+ , `${vm} cannot be recycled.`);
4663
4774
  }
4664
4775
 
4665
- createChildrenHook(vnode);
4776
+ runConnectedCallback(vm);
4777
+ }
4778
+
4779
+ mountVNodes(vnode.children, elm, null);
4780
+
4781
+ if (vm) {
4782
+ appendVM(vm);
4783
+ }
4784
+ }
4785
+
4786
+ function patchCustomElement(n1, n2) {
4787
+ const elm = n2.elm = n1.elm;
4788
+ const vm = n2.vm = n1.vm;
4789
+ patchElementPropsAndAttrs$1(n1, n2);
4790
+
4791
+ if (!isUndefined$1(vm)) {
4792
+ // in fallback mode, the allocation will always set children to
4793
+ // empty and delegate the real allocation to the slot elements
4794
+ allocateChildren(n2, vm);
4795
+ } // in fallback mode, the children will be always empty, so, nothing
4796
+ // will happen, but in native, it does allocate the light dom
4797
+
4798
+
4799
+ patchChildren(n1.children, n2.children, elm);
4800
+
4801
+ if (!isUndefined$1(vm)) {
4802
+ // this will probably update the shadowRoot, but only if the vm is in a dirty state
4803
+ // this is important to preserve the top to bottom synchronous rendering phase.
4804
+ rerenderVM(vm);
4805
+ }
4806
+ }
4807
+
4808
+ function mountVNodes(vnodes, parent, anchor, start = 0, end = vnodes.length) {
4809
+ for (; start < end; ++start) {
4810
+ const vnode = vnodes[start];
4666
4811
 
4667
- if (vm) {
4668
- appendVM(vm);
4812
+ if (isVNode(vnode)) {
4813
+ mount(vnode, parent, anchor);
4669
4814
  }
4670
- },
4671
- move: insertNode,
4672
- remove: (vnode, parentNode) => {
4673
- removeNode(vnode, parentNode);
4674
- const vm = getAssociatedVMIfPresent(vnode.elm);
4815
+ }
4816
+ }
4817
+
4818
+ function unmount(vnode, parent, doRemove = false) {
4819
+ const {
4820
+ type,
4821
+ elm
4822
+ } = vnode; // When unmounting a VNode subtree not all the elements have to removed from the DOM. The
4823
+ // subtree root, is the only element worth unmounting from the subtree.
4824
+
4825
+ if (doRemove) {
4826
+ removeNode(elm, parent);
4827
+ }
4828
+
4829
+ switch (type) {
4830
+ case 2
4831
+ /* Element */
4832
+ :
4833
+ unmountVNodes(vnode.children, elm);
4834
+ break;
4835
+
4836
+ case 3
4837
+ /* CustomElement */
4838
+ :
4839
+ {
4840
+ const {
4841
+ vm
4842
+ } = vnode; // No need to unmount the children here, `removeVM` will take care of removing the
4843
+ // children.
4844
+
4845
+ if (!isUndefined$1(vm)) {
4846
+ removeVM(vm);
4847
+ }
4848
+ }
4849
+ }
4850
+ }
4851
+
4852
+ function unmountVNodes(vnodes, parent, doRemove = false, start = 0, end = vnodes.length) {
4853
+ for (; start < end; ++start) {
4854
+ const ch = vnodes[start];
4675
4855
 
4676
- if (vm) {
4677
- // for custom elements we don't have to go recursively because the removeVM routine
4678
- // will take care of disconnecting any child VM attached to its shadow as well.
4679
- removeVM(vm);
4856
+ if (isVNode(ch)) {
4857
+ unmount(ch, parent, doRemove);
4680
4858
  }
4681
4859
  }
4682
- };
4860
+ }
4683
4861
 
4684
4862
  function isVNode(vnode) {
4685
4863
  return vnode != null;
@@ -4724,43 +4902,41 @@ function linkNodeToShadow(elm, owner) {
4724
4902
  }
4725
4903
  }
4726
4904
 
4727
- function updateNodeHook(oldVnode, vnode) {
4905
+ function updateTextContent(vnode) {
4728
4906
  const {
4729
4907
  elm,
4730
4908
  text
4731
4909
  } = vnode;
4732
4910
 
4733
- if (oldVnode.text !== text) {
4734
- if (process.env.NODE_ENV !== 'production') {
4735
- unlockDomMutation();
4736
- }
4911
+ if (process.env.NODE_ENV !== 'production') {
4912
+ unlockDomMutation();
4913
+ }
4737
4914
 
4738
- setText$1(elm, text);
4915
+ setText$1(elm, text);
4739
4916
 
4740
- if (process.env.NODE_ENV !== 'production') {
4741
- lockDomMutation();
4742
- }
4917
+ if (process.env.NODE_ENV !== 'production') {
4918
+ lockDomMutation();
4743
4919
  }
4744
4920
  }
4745
4921
 
4746
- function insertNode(vnode, parentNode, referenceNode) {
4922
+ function insertNode(node, parent, anchor) {
4747
4923
  if (process.env.NODE_ENV !== 'production') {
4748
4924
  unlockDomMutation();
4749
4925
  }
4750
4926
 
4751
- insert$1(vnode.elm, parentNode, referenceNode);
4927
+ insert$1(node, parent, anchor);
4752
4928
 
4753
4929
  if (process.env.NODE_ENV !== 'production') {
4754
4930
  lockDomMutation();
4755
4931
  }
4756
4932
  }
4757
4933
 
4758
- function removeNode(vnode, parentNode) {
4934
+ function removeNode(node, parent) {
4759
4935
  if (process.env.NODE_ENV !== 'production') {
4760
4936
  unlockDomMutation();
4761
4937
  }
4762
4938
 
4763
- remove$1(vnode.elm, parentNode);
4939
+ remove$1(node, parent);
4764
4940
 
4765
4941
  if (process.env.NODE_ENV !== 'production') {
4766
4942
  lockDomMutation();
@@ -4833,14 +5009,6 @@ function fallbackElmHook(elm, vnode) {
4833
5009
  }
4834
5010
  }
4835
5011
 
4836
- function patchChildren(parent, oldCh, newCh) {
4837
- if (hasDynamicChildren(newCh)) {
4838
- updateDynamicChildren(parent, oldCh, newCh);
4839
- } else {
4840
- updateStaticChildren(parent, oldCh, newCh);
4841
- }
4842
- }
4843
-
4844
5012
  function allocateChildren(vnode, vm) {
4845
5013
  // A component with slots will re-render because:
4846
5014
  // 1- There is a change of the internal state.
@@ -4916,50 +5084,16 @@ function createViewModelHook(elm, vnode) {
4916
5084
  return vm;
4917
5085
  }
4918
5086
 
4919
- function createChildrenHook(vnode) {
5087
+ function allocateInSlot(vm, children) {
5088
+ var _a;
5089
+
4920
5090
  const {
4921
- elm,
4922
- children
4923
- } = vnode;
5091
+ cmpSlots: oldSlots
5092
+ } = vm;
5093
+ const cmpSlots = vm.cmpSlots = create(null);
4924
5094
 
4925
- for (let j = 0; j < children.length; ++j) {
4926
- const ch = children[j];
4927
-
4928
- if (ch != null) {
4929
- ch.hook.create(ch);
4930
- ch.hook.insert(ch, elm, null);
4931
- }
4932
- }
4933
- }
4934
-
4935
- function removeChildren(vnode) {
4936
- // this method only needs to search on child vnodes from template
4937
- // to trigger the remove hook just in case some of those children
4938
- // are custom elements.
4939
- const {
4940
- children,
4941
- elm
4942
- } = vnode;
4943
-
4944
- for (let j = 0, len = children.length; j < len; ++j) {
4945
- const ch = children[j];
4946
-
4947
- if (!isNull(ch)) {
4948
- ch.hook.remove(ch, elm);
4949
- }
4950
- }
4951
- }
4952
-
4953
- function allocateInSlot(vm, children) {
4954
- var _a;
4955
-
4956
- const {
4957
- cmpSlots: oldSlots
4958
- } = vm;
4959
- const cmpSlots = vm.cmpSlots = create(null);
4960
-
4961
- for (let i = 0, len = children.length; i < len; i += 1) {
4962
- const vnode = children[i];
5095
+ for (let i = 0, len = children.length; i < len; i += 1) {
5096
+ const vnode = children[i];
4963
5097
 
4964
5098
  if (isNull(vnode)) {
4965
5099
  continue;
@@ -5046,28 +5180,7 @@ function createKeyToOldIdx(children, beginIdx, endIdx) {
5046
5180
  return map;
5047
5181
  }
5048
5182
 
5049
- function addVnodes(parentElm, before, vnodes, startIdx, endIdx) {
5050
- for (; startIdx <= endIdx; ++startIdx) {
5051
- const ch = vnodes[startIdx];
5052
-
5053
- if (isVNode(ch)) {
5054
- ch.hook.create(ch);
5055
- ch.hook.insert(ch, parentElm, before);
5056
- }
5057
- }
5058
- }
5059
-
5060
- function removeVnodes(parentElm, vnodes, startIdx, endIdx) {
5061
- for (; startIdx <= endIdx; ++startIdx) {
5062
- const ch = vnodes[startIdx]; // text nodes do not have logic associated to them
5063
-
5064
- if (isVNode(ch)) {
5065
- ch.hook.remove(ch, parentElm);
5066
- }
5067
- }
5068
- }
5069
-
5070
- function updateDynamicChildren(parentElm, oldCh, newCh) {
5183
+ function updateDynamicChildren(oldCh, newCh, parent) {
5071
5184
  let oldStartIdx = 0;
5072
5185
  let newStartIdx = 0;
5073
5186
  let oldEndIdx = oldCh.length - 1;
@@ -5093,23 +5206,23 @@ function updateDynamicChildren(parentElm, oldCh, newCh) {
5093
5206
  } else if (!isVNode(newEndVnode)) {
5094
5207
  newEndVnode = newCh[--newEndIdx];
5095
5208
  } else if (isSameVnode(oldStartVnode, newStartVnode)) {
5096
- patchVnode(oldStartVnode, newStartVnode);
5209
+ patch(oldStartVnode, newStartVnode);
5097
5210
  oldStartVnode = oldCh[++oldStartIdx];
5098
5211
  newStartVnode = newCh[++newStartIdx];
5099
5212
  } else if (isSameVnode(oldEndVnode, newEndVnode)) {
5100
- patchVnode(oldEndVnode, newEndVnode);
5213
+ patch(oldEndVnode, newEndVnode);
5101
5214
  oldEndVnode = oldCh[--oldEndIdx];
5102
5215
  newEndVnode = newCh[--newEndIdx];
5103
5216
  } else if (isSameVnode(oldStartVnode, newEndVnode)) {
5104
5217
  // Vnode moved right
5105
- patchVnode(oldStartVnode, newEndVnode);
5106
- newEndVnode.hook.move(oldStartVnode, parentElm, nextSibling$1(oldEndVnode.elm));
5218
+ patch(oldStartVnode, newEndVnode);
5219
+ insertNode(oldStartVnode.elm, parent, nextSibling$1(oldEndVnode.elm));
5107
5220
  oldStartVnode = oldCh[++oldStartIdx];
5108
5221
  newEndVnode = newCh[--newEndIdx];
5109
5222
  } else if (isSameVnode(oldEndVnode, newStartVnode)) {
5110
5223
  // Vnode moved left
5111
- patchVnode(oldEndVnode, newStartVnode);
5112
- newStartVnode.hook.move(oldEndVnode, parentElm, oldStartVnode.elm);
5224
+ patch(oldEndVnode, newStartVnode);
5225
+ insertNode(newStartVnode.elm, parent, oldStartVnode.elm);
5113
5226
  oldEndVnode = oldCh[--oldEndIdx];
5114
5227
  newStartVnode = newCh[++newStartIdx];
5115
5228
  } else {
@@ -5121,8 +5234,7 @@ function updateDynamicChildren(parentElm, oldCh, newCh) {
5121
5234
 
5122
5235
  if (isUndefined$1(idxInOld)) {
5123
5236
  // New element
5124
- newStartVnode.hook.create(newStartVnode);
5125
- newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm);
5237
+ mount(newStartVnode, parent, oldStartVnode.elm);
5126
5238
  newStartVnode = newCh[++newStartIdx];
5127
5239
  } else {
5128
5240
  elmToMove = oldCh[idxInOld];
@@ -5130,10 +5242,9 @@ function updateDynamicChildren(parentElm, oldCh, newCh) {
5130
5242
  if (isVNode(elmToMove)) {
5131
5243
  if (elmToMove.sel !== newStartVnode.sel) {
5132
5244
  // New element
5133
- newStartVnode.hook.create(newStartVnode);
5134
- newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm);
5245
+ mount(newStartVnode, parent, oldStartVnode.elm);
5135
5246
  } else {
5136
- patchVnode(elmToMove, newStartVnode); // Delete the old child, but copy the array since it is read-only.
5247
+ patch(elmToMove, newStartVnode); // Delete the old child, but copy the array since it is read-only.
5137
5248
  // The `oldCh` will be GC'ed after `updateDynamicChildren` is complete,
5138
5249
  // so we only care about the `oldCh` object inside this function.
5139
5250
  // To avoid cloning over and over again, we check `clonedOldCh`
@@ -5146,7 +5257,7 @@ function updateDynamicChildren(parentElm, oldCh, newCh) {
5146
5257
 
5147
5258
 
5148
5259
  oldCh[idxInOld] = undefined;
5149
- newStartVnode.hook.move(elmToMove, parentElm, oldStartVnode.elm);
5260
+ insertNode(elmToMove.elm, parent, oldStartVnode.elm);
5150
5261
  }
5151
5262
  }
5152
5263
 
@@ -5167,65 +5278,55 @@ function updateDynamicChildren(parentElm, oldCh, newCh) {
5167
5278
  } while (!isVNode(n) && i < newChEnd);
5168
5279
 
5169
5280
  before = isVNode(n) ? n.elm : null;
5170
- addVnodes(parentElm, before, newCh, newStartIdx, newEndIdx);
5281
+ mountVNodes(newCh, parent, before, newStartIdx, newEndIdx + 1);
5171
5282
  } else {
5172
- removeVnodes(parentElm, oldCh, oldStartIdx, oldEndIdx);
5283
+ unmountVNodes(oldCh, parent, true, oldStartIdx, oldEndIdx + 1);
5173
5284
  }
5174
5285
  }
5175
5286
  }
5176
5287
 
5177
- function updateStaticChildren(parentElm, oldCh, newCh) {
5178
- const oldChLength = oldCh.length;
5179
- const newChLength = newCh.length;
5288
+ function updateStaticChildren(c1, c2, parent) {
5289
+ const c1Length = c1.length;
5290
+ const c2Length = c2.length;
5180
5291
 
5181
- if (oldChLength === 0) {
5292
+ if (c1Length === 0) {
5182
5293
  // the old list is empty, we can directly insert anything new
5183
- addVnodes(parentElm, null, newCh, 0, newChLength);
5294
+ mountVNodes(c2, parent, null);
5184
5295
  return;
5185
5296
  }
5186
5297
 
5187
- if (newChLength === 0) {
5298
+ if (c2Length === 0) {
5188
5299
  // the old list is nonempty and the new list is empty so we can directly remove all old nodes
5189
5300
  // this is the case in which the dynamic children of an if-directive should be removed
5190
- removeVnodes(parentElm, oldCh, 0, oldChLength);
5301
+ unmountVNodes(c1, parent, true);
5191
5302
  return;
5192
5303
  } // if the old list is not empty, the new list MUST have the same
5193
5304
  // amount of nodes, that's why we call this static children
5194
5305
 
5195
5306
 
5196
- let referenceElm = null;
5307
+ let anchor = null;
5197
5308
 
5198
- for (let i = newChLength - 1; i >= 0; i -= 1) {
5199
- const vnode = newCh[i];
5200
- const oldVNode = oldCh[i];
5309
+ for (let i = c2Length - 1; i >= 0; i -= 1) {
5310
+ const n1 = c1[i];
5311
+ const n2 = c2[i];
5201
5312
 
5202
- if (vnode !== oldVNode) {
5203
- if (isVNode(oldVNode)) {
5204
- if (isVNode(vnode)) {
5205
- // both vnodes must be equivalent, and se just need to patch them
5206
- patchVnode(oldVNode, vnode);
5207
- referenceElm = vnode.elm;
5313
+ if (n2 !== n1) {
5314
+ if (isVNode(n1)) {
5315
+ if (isVNode(n2)) {
5316
+ // both vnodes are equivalent, and we just need to patch them
5317
+ patch(n1, n2);
5318
+ anchor = n2.elm;
5208
5319
  } else {
5209
5320
  // removing the old vnode since the new one is null
5210
- oldVNode.hook.remove(oldVNode, parentElm);
5321
+ unmount(n1, parent, true);
5211
5322
  }
5212
- } else if (isVNode(vnode)) {
5213
- // this condition is unnecessary
5214
- vnode.hook.create(vnode); // insert the new node one since the old one is null
5215
-
5216
- vnode.hook.insert(vnode, parentElm, referenceElm);
5217
- referenceElm = vnode.elm;
5323
+ } else if (isVNode(n2)) {
5324
+ mount(n2, parent, anchor);
5325
+ anchor = n2.elm;
5218
5326
  }
5219
5327
  }
5220
5328
  }
5221
5329
  }
5222
-
5223
- function patchVnode(oldVnode, vnode) {
5224
- if (oldVnode !== vnode) {
5225
- vnode.elm = oldVnode.elm;
5226
- vnode.hook.update(oldVnode, vnode);
5227
- }
5228
- }
5229
5330
  /*
5230
5331
  * Copyright (c) 2018, salesforce.com, inc.
5231
5332
  * All rights reserved.
@@ -5277,7 +5378,6 @@ function h(sel, data, children = EmptyArray) {
5277
5378
  children,
5278
5379
  elm,
5279
5380
  key,
5280
- hook: ElementHook,
5281
5381
  owner: vmBeingRendered
5282
5382
  };
5283
5383
  } // [t]ab[i]ndex function
@@ -5364,7 +5464,7 @@ function c(sel, Ctor, data, children = EmptyArray) {
5364
5464
  const {
5365
5465
  key
5366
5466
  } = data;
5367
- let elm;
5467
+ let elm, aChildren, vm;
5368
5468
  const vnode = {
5369
5469
  type: 3
5370
5470
  /* CustomElement */
@@ -5374,11 +5474,11 @@ function c(sel, Ctor, data, children = EmptyArray) {
5374
5474
  children,
5375
5475
  elm,
5376
5476
  key,
5377
- hook: CustomElementHook,
5378
5477
  ctor: Ctor,
5379
5478
  owner: vmBeingRendered,
5380
- mode: 'open' // TODO [#1294]: this should be defined in Ctor
5381
-
5479
+ mode: 'open',
5480
+ aChildren,
5481
+ vm
5382
5482
  };
5383
5483
  addVNodeToChildLWC(vnode);
5384
5484
  return vnode;
@@ -5508,7 +5608,6 @@ function t(text) {
5508
5608
  text,
5509
5609
  elm,
5510
5610
  key,
5511
- hook: TextHook,
5512
5611
  owner: getVMBeingRendered()
5513
5612
  };
5514
5613
  } // [co]mment node
@@ -5524,7 +5623,6 @@ function co(text) {
5524
5623
  text,
5525
5624
  elm,
5526
5625
  key,
5527
- hook: CommentHook,
5528
5626
  owner: getVMBeingRendered()
5529
5627
  };
5530
5628
  } // [d]ynamic text
@@ -6391,6 +6489,10 @@ const signedTemplateMap = new Map();
6391
6489
  function registerComponent(Ctor, {
6392
6490
  tmpl
6393
6491
  }) {
6492
+ if (process.env.NODE_ENV !== 'production') {
6493
+ checkVersionMismatch(Ctor, 'component');
6494
+ }
6495
+
6394
6496
  signedTemplateMap.set(Ctor, tmpl); // chaining this method as a way to wrap existing assignment of component constructor easily,
6395
6497
  // without too much transformation
6396
6498
 
@@ -6515,7 +6617,7 @@ function invokeServiceHook(vm, cbs) {
6515
6617
  */
6516
6618
 
6517
6619
 
6518
- function hydrate$1(vnode, node) {
6620
+ function hydrate(vnode, node) {
6519
6621
  switch (vnode.type) {
6520
6622
  case 0
6521
6623
  /* Text */
@@ -6547,16 +6649,18 @@ function hydrateText(vnode, node) {
6547
6649
  var _a;
6548
6650
 
6549
6651
  if (process.env.NODE_ENV !== 'production') {
6550
- // eslint-disable-next-line lwc-internal/no-global-node
6551
- validateNodeType(vnode, node, Node.TEXT_NODE);
6652
+ validateNodeType(vnode, node, 3
6653
+ /* TEXT */
6654
+ );
6655
+ const nodeValue = getProperty$1(node, 'nodeValue');
6552
6656
 
6553
- if (node.nodeValue !== vnode.text && !(node.nodeValue === '\u200D' && vnode.text === '')) {
6657
+ if (nodeValue !== vnode.text && !(nodeValue === '\u200D' && vnode.text === '')) {
6554
6658
  logWarn('Hydration mismatch: text values do not match, will recover from the difference', vnode.owner);
6555
6659
  }
6556
6660
  } // always set the text value to the one from the vnode.
6557
6661
 
6558
6662
 
6559
- node.nodeValue = (_a = vnode.text) !== null && _a !== void 0 ? _a : null;
6663
+ setText$1(node, (_a = vnode.text) !== null && _a !== void 0 ? _a : null);
6560
6664
  vnode.elm = node;
6561
6665
  }
6562
6666
 
@@ -6564,23 +6668,25 @@ function hydrateComment(vnode, node) {
6564
6668
  var _a;
6565
6669
 
6566
6670
  if (process.env.NODE_ENV !== 'production') {
6567
- // eslint-disable-next-line lwc-internal/no-global-node
6568
- validateNodeType(vnode, node, Node.COMMENT_NODE);
6671
+ validateNodeType(vnode, node, 8
6672
+ /* COMMENT */
6673
+ );
6569
6674
 
6570
- if (node.nodeValue !== vnode.text) {
6675
+ if (getProperty$1(node, 'nodeValue') !== vnode.text) {
6571
6676
  logWarn('Hydration mismatch: comment values do not match, will recover from the difference', vnode.owner);
6572
6677
  }
6573
6678
  } // always set the text value to the one from the vnode.
6574
6679
 
6575
6680
 
6576
- node.nodeValue = (_a = vnode.text) !== null && _a !== void 0 ? _a : null;
6681
+ setProperty$1(node, 'nodeValue', (_a = vnode.text) !== null && _a !== void 0 ? _a : null);
6577
6682
  vnode.elm = node;
6578
6683
  }
6579
6684
 
6580
6685
  function hydrateElement(vnode, node) {
6581
6686
  if (process.env.NODE_ENV !== 'production') {
6582
- // eslint-disable-next-line lwc-internal/no-global-node
6583
- validateNodeType(vnode, node, Node.ELEMENT_NODE);
6687
+ validateNodeType(vnode, node, 1
6688
+ /* ELEMENT */
6689
+ );
6584
6690
  validateElement(vnode, node);
6585
6691
  }
6586
6692
 
@@ -6601,13 +6707,13 @@ function hydrateElement(vnode, node) {
6601
6707
  } = vnode.data;
6602
6708
 
6603
6709
  if (!isUndefined$1(props) && !isUndefined$1(props.innerHTML)) {
6604
- if (elm.innerHTML === props.innerHTML) {
6710
+ if (getProperty$1(elm, 'innerHTML') === props.innerHTML) {
6605
6711
  // Do a shallow clone since VNodeData may be shared across VNodes due to hoist optimization
6606
6712
  vnode.data = Object.assign(Object.assign({}, vnode.data), {
6607
6713
  props: cloneAndOmitKey(props, 'innerHTML')
6608
6714
  });
6609
6715
  } else {
6610
- logWarn(`Mismatch hydrating element <${elm.tagName.toLowerCase()}>: innerHTML values do not match for element, will recover from the difference`, vnode.owner);
6716
+ logWarn(`Mismatch hydrating element <${getProperty$1(elm, 'tagName').toLowerCase()}>: innerHTML values do not match for element, will recover from the difference`, vnode.owner);
6611
6717
  }
6612
6718
  }
6613
6719
  }
@@ -6615,19 +6721,19 @@ function hydrateElement(vnode, node) {
6615
6721
  patchElementPropsAndAttrs(vnode);
6616
6722
 
6617
6723
  if (!isDomManual) {
6618
- hydrateChildren(vnode.elm.childNodes, vnode.children, vnode.owner);
6724
+ hydrateChildren(getChildNodes$1(vnode.elm), vnode.children, vnode.owner);
6619
6725
  }
6620
6726
  }
6621
6727
 
6622
6728
  function hydrateCustomElement(vnode, node) {
6623
6729
  if (process.env.NODE_ENV !== 'production') {
6624
- // eslint-disable-next-line lwc-internal/no-global-node
6625
- validateNodeType(vnode, node, Node.ELEMENT_NODE);
6730
+ validateNodeType(vnode, node, 1
6731
+ /* ELEMENT */
6732
+ );
6626
6733
  validateElement(vnode, node);
6627
6734
  }
6628
6735
 
6629
6736
  const elm = node;
6630
- vnode.elm = elm;
6631
6737
  const {
6632
6738
  sel,
6633
6739
  mode,
@@ -6639,6 +6745,8 @@ function hydrateCustomElement(vnode, node) {
6639
6745
  owner,
6640
6746
  tagName: sel
6641
6747
  });
6748
+ vnode.elm = elm;
6749
+ vnode.vm = vm;
6642
6750
  allocateChildren(vnode, vm);
6643
6751
  patchElementPropsAndAttrs(vnode); // Insert hook section:
6644
6752
 
@@ -6655,7 +6763,7 @@ function hydrateCustomElement(vnode, node) {
6655
6763
  ) {
6656
6764
  // VM is not rendering in Light DOM, we can proceed and hydrate the slotted content.
6657
6765
  // Note: for Light DOM, this is handled while hydrating the VM
6658
- hydrateChildren(vnode.elm.childNodes, vnode.children, vm);
6766
+ hydrateChildren(getChildNodes$1(vnode.elm), vnode.children, vm);
6659
6767
  }
6660
6768
 
6661
6769
  hydrateVM(vm);
@@ -6678,7 +6786,7 @@ function hydrateChildren(elmChildren, children, vm) {
6678
6786
 
6679
6787
  if (!isNull(childVnode)) {
6680
6788
  const childNode = elmChildren[childNodeIndex];
6681
- hydrate$1(childVnode, childNode);
6789
+ hydrate(childVnode, childNode);
6682
6790
  childNodeIndex++;
6683
6791
  }
6684
6792
  }
@@ -6694,15 +6802,15 @@ function throwHydrationError() {
6694
6802
  }
6695
6803
 
6696
6804
  function validateNodeType(vnode, node, nodeType) {
6697
- if (node.nodeType !== nodeType) {
6805
+ if (getProperty$1(node, 'nodeType') !== nodeType) {
6698
6806
  logError('Hydration mismatch: incorrect node type received', vnode.owner);
6699
6807
  assert.fail('Hydration mismatch: incorrect node type received.');
6700
6808
  }
6701
6809
  }
6702
6810
 
6703
6811
  function validateElement(vnode, elm) {
6704
- if (vnode.sel.toLowerCase() !== elm.tagName.toLowerCase()) {
6705
- logError(`Hydration mismatch: expecting element with tag "${vnode.sel.toLowerCase()}" but found "${elm.tagName.toLowerCase()}".`, vnode.owner);
6812
+ if (vnode.sel.toLowerCase() !== getProperty$1(elm, 'tagName').toLowerCase()) {
6813
+ logError(`Hydration mismatch: expecting element with tag "${vnode.sel.toLowerCase()}" but found "${getProperty$1(elm, 'tagName').toLowerCase()}".`, vnode.owner);
6706
6814
  throwHydrationError();
6707
6815
  }
6708
6816
 
@@ -6729,7 +6837,7 @@ function validateAttrs(vnode, elm) {
6729
6837
  const elmAttrValue = getAttribute$1(elm, attrName);
6730
6838
 
6731
6839
  if (String(attrValue) !== elmAttrValue) {
6732
- logError(`Mismatch hydrating element <${elm.tagName.toLowerCase()}>: attribute "${attrName}" has different values, expected "${attrValue}" but found "${elmAttrValue}"`, vnode.owner);
6840
+ logError(`Mismatch hydrating element <${getProperty$1(elm, 'tagName').toLowerCase()}>: attribute "${attrName}" has different values, expected "${attrValue}" but found "${elmAttrValue}"`, vnode.owner);
6733
6841
  nodesAreCompatible = false;
6734
6842
  }
6735
6843
  }
@@ -6747,7 +6855,7 @@ function validateClassAttr(vnode, elm) {
6747
6855
  let nodesAreCompatible = true;
6748
6856
  let vnodeClassName;
6749
6857
 
6750
- if (!isUndefined$1(className) && String(className) !== elm.className) {
6858
+ if (!isUndefined$1(className) && String(className) !== getProperty$1(elm, 'className')) {
6751
6859
  // className is used when class is bound to an expr.
6752
6860
  nodesAreCompatible = false;
6753
6861
  vnodeClassName = className;
@@ -6772,7 +6880,7 @@ function validateClassAttr(vnode, elm) {
6772
6880
  }
6773
6881
 
6774
6882
  if (!nodesAreCompatible) {
6775
- logError(`Mismatch hydrating element <${elm.tagName.toLowerCase()}>: attribute "class" has different values, expected "${vnodeClassName}" but found "${elm.className}"`, vnode.owner);
6883
+ logError(`Mismatch hydrating element <${getProperty$1(elm, 'tagName').toLowerCase()}>: attribute "class" has different values, expected "${vnodeClassName}" but found "${getProperty$1(elm, 'className')}"`, vnode.owner);
6776
6884
  }
6777
6885
 
6778
6886
  return nodesAreCompatible;
@@ -6819,7 +6927,7 @@ function validateStyleAttr(vnode, elm) {
6819
6927
 
6820
6928
  if (!nodesAreCompatible) {
6821
6929
  // style is used when class is bound to an expr.
6822
- logError(`Mismatch hydrating element <${elm.tagName.toLowerCase()}>: attribute "style" has different values, expected "${vnodeStyle}" but found "${elmStyle}".`, vnode.owner);
6930
+ logError(`Mismatch hydrating element <${getProperty$1(elm, 'tagName').toLowerCase()}>: attribute "style" has different values, expected "${vnodeStyle}" but found "${elmStyle}".`, vnode.owner);
6823
6931
  }
6824
6932
 
6825
6933
  return nodesAreCompatible;
@@ -6889,7 +6997,19 @@ function appendVM(vm) {
6889
6997
  }
6890
6998
 
6891
6999
  function hydrateVM(vm) {
6892
- hydrate(vm);
7000
+ if (isTrue(vm.isDirty)) {
7001
+ // manually diffing/patching here.
7002
+ // This routine is:
7003
+ // patchShadowRoot(vm, children);
7004
+ // -> addVnodes.
7005
+ const children = renderComponent(vm);
7006
+ vm.children = children;
7007
+ const vmChildren = vm.renderMode === 0
7008
+ /* Light */
7009
+ ? getChildNodes$1(vm.elm) : getChildNodes$1(vm.elm.shadowRoot);
7010
+ hydrateChildren(vmChildren, children, vm);
7011
+ runRenderedCallback(vm);
7012
+ }
6893
7013
  } // just in case the component comes back, with this we guarantee re-rendering it
6894
7014
  // while preventing any attempt to rehydration until after reinsertion.
6895
7015
 
@@ -7040,7 +7160,11 @@ function computeShadowMode(vm) {
7040
7160
  /* Native */
7041
7161
  ;
7042
7162
  } else if (isNativeShadowDefined$1) {
7043
- if (def.shadowSupportMode === "any"
7163
+ if (runtimeFlags.DISABLE_MIXED_SHADOW_MODE) {
7164
+ shadowMode = 1
7165
+ /* Synthetic */
7166
+ ;
7167
+ } else if (def.shadowSupportMode === "any"
7044
7168
  /* Any */
7045
7169
  ) {
7046
7170
  shadowMode = 0
@@ -7120,22 +7244,6 @@ function rehydrate(vm) {
7120
7244
  }
7121
7245
  }
7122
7246
 
7123
- function hydrate(vm) {
7124
- if (isTrue(vm.isDirty)) {
7125
- // manually diffing/patching here.
7126
- // This routine is:
7127
- // patchShadowRoot(vm, children);
7128
- // -> addVnodes.
7129
- const children = renderComponent(vm);
7130
- vm.children = children;
7131
- const vmChildren = vm.renderMode === 0
7132
- /* Light */
7133
- ? vm.elm.childNodes : vm.elm.shadowRoot.childNodes;
7134
- hydrateChildren(vmChildren, children, vm);
7135
- runRenderedCallback(vm);
7136
- }
7137
- }
7138
-
7139
7247
  function patchShadowRoot(vm, newCh) {
7140
7248
  const {
7141
7249
  renderRoot,
@@ -7155,7 +7263,7 @@ function patchShadowRoot(vm, newCh) {
7155
7263
  , vm);
7156
7264
  }, () => {
7157
7265
  // job
7158
- patchChildren(renderRoot, oldCh, newCh);
7266
+ patchChildren(oldCh, newCh, renderRoot);
7159
7267
  }, () => {
7160
7268
  // post
7161
7269
  logOperationEnd(2
@@ -7902,7 +8010,7 @@ function setHooks(hooks) {
7902
8010
  hooksAreSet = true;
7903
8011
  setSanitizeHtmlContentHook(hooks.sanitizeHtmlContent);
7904
8012
  }
7905
- /* version: 2.9.0 */
8013
+ /* version: 2.10.0 */
7906
8014
 
7907
8015
  /*
7908
8016
  * Copyright (c) 2018, salesforce.com, inc.
@@ -7928,6 +8036,7 @@ const globalStylesheetsParentElement = document.head || document.body || documen
7928
8036
  // See also: https://github.com/whatwg/webidl/issues/1027#issuecomment-934510070
7929
8037
 
7930
8038
  const supportsConstructableStyleSheets = isFunction$1(CSSStyleSheet.prototype.replaceSync) && isArray$1(document.adoptedStyleSheets);
8039
+ const supportsMutableAdoptedStyleSheets = supportsConstructableStyleSheets && getOwnPropertyDescriptor$1(document.adoptedStyleSheets, 'length').writable;
7931
8040
  const styleElements = create(null);
7932
8041
  const styleSheets = create(null);
7933
8042
  const nodesToStyleSheets = new WeakMap();
@@ -7971,7 +8080,13 @@ function insertConstructableStyleSheet(content, target) {
7971
8080
  }
7972
8081
 
7973
8082
  if (!target.adoptedStyleSheets.includes(styleSheet)) {
7974
- target.adoptedStyleSheets = [...target.adoptedStyleSheets, styleSheet];
8083
+ if (supportsMutableAdoptedStyleSheets) {
8084
+ // This is only supported in later versions of Chromium:
8085
+ // https://chromestatus.com/feature/5638996492288000
8086
+ target.adoptedStyleSheets.push(styleSheet);
8087
+ } else {
8088
+ target.adoptedStyleSheets = [...target.adoptedStyleSheets, styleSheet];
8089
+ }
7975
8090
  }
7976
8091
  }
7977
8092
 
@@ -8273,6 +8388,156 @@ setSetProperty(setProperty);
8273
8388
  setSetText(setText);
8274
8389
  setSsr(ssr);
8275
8390
  setAddEventListener(addEventListener);
8391
+ /*
8392
+ * Copyright (c) 2018, salesforce.com, inc.
8393
+ * All rights reserved.
8394
+ * SPDX-License-Identifier: MIT
8395
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
8396
+ */
8397
+
8398
+ function resetShadowRootAndLightDom(element, Ctor) {
8399
+ if (element.shadowRoot) {
8400
+ const shadowRoot = element.shadowRoot;
8401
+
8402
+ while (!isNull(shadowRoot.firstChild)) {
8403
+ shadowRoot.removeChild(shadowRoot.firstChild);
8404
+ }
8405
+ }
8406
+
8407
+ if (Ctor.renderMode === 'light') {
8408
+ while (!isNull(element.firstChild)) {
8409
+ element.removeChild(element.firstChild);
8410
+ }
8411
+ }
8412
+ }
8413
+
8414
+ function createVMWithProps(element, Ctor, props) {
8415
+ createVM(element, Ctor, {
8416
+ mode: 'open',
8417
+ owner: null,
8418
+ tagName: element.tagName.toLowerCase()
8419
+ });
8420
+
8421
+ for (const [key, value] of Object.entries(props)) {
8422
+ element[key] = value;
8423
+ }
8424
+ }
8425
+
8426
+ function hydrateComponent(element, Ctor, props = {}) {
8427
+ if (!(element instanceof Element)) {
8428
+ throw new TypeError(`"hydrateComponent" expects a valid DOM element as the first parameter but instead received ${element}.`);
8429
+ }
8430
+
8431
+ if (!isFunction$1(Ctor)) {
8432
+ throw new TypeError(`"hydrateComponent" expects a valid component constructor as the second parameter but instead received ${Ctor}.`);
8433
+ }
8434
+
8435
+ if (!isObject(props) || isNull(props)) {
8436
+ throw new TypeError(`"hydrateComponent" expects an object as the third parameter but instead received ${props}.`);
8437
+ }
8438
+
8439
+ if (getAssociatedVMIfPresent(element)) {
8440
+ /* eslint-disable-next-line no-console */
8441
+ console.warn(`"hydrateComponent" expects an element that is not hydrated.`, element);
8442
+ return;
8443
+ }
8444
+
8445
+ try {
8446
+ // Let the renderer know we are hydrating, so it does not replace the existing shadowRoot
8447
+ // and uses the same algo to create the stylesheets as in SSR.
8448
+ setIsHydrating(true);
8449
+ createVMWithProps(element, Ctor, props);
8450
+ hydrateRootElement(element); // set it back since now we finished hydration.
8451
+
8452
+ setIsHydrating(false);
8453
+ } catch (e) {
8454
+ // Fallback: In case there's an error while hydrating, let's log the error, and replace the element content
8455
+ // with the client generated DOM.
8456
+
8457
+ /* eslint-disable-next-line no-console */
8458
+ console.error('Recovering from error while hydrating: ', e); // We want to preserve the element, so we need to reset the shadowRoot and light dom.
8459
+
8460
+ resetShadowRootAndLightDom(element, Ctor); // we need to recreate the vm with the hydration flag on, so it re-uses the existing shadowRoot.
8461
+
8462
+ createVMWithProps(element, Ctor, props);
8463
+ setIsHydrating(false);
8464
+ connectRootElement(element);
8465
+ } finally {
8466
+ // in case there's an error during recovery
8467
+ setIsHydrating(false);
8468
+ }
8469
+ }
8470
+ /*
8471
+ * Copyright (c) 2018, salesforce.com, inc.
8472
+ * All rights reserved.
8473
+ * SPDX-License-Identifier: MIT
8474
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
8475
+ */
8476
+
8477
+ /**
8478
+ * This function builds a Web Component class from a LWC constructor so it can be
8479
+ * registered as a new element via customElements.define() at any given time.
8480
+ *
8481
+ * @deprecated since version 1.3.11
8482
+ *
8483
+ * @example
8484
+ * ```
8485
+ * import { buildCustomElementConstructor } from 'lwc';
8486
+ * import Foo from 'ns/foo';
8487
+ * const WC = buildCustomElementConstructor(Foo);
8488
+ * customElements.define('x-foo', WC);
8489
+ * const elm = document.createElement('x-foo');
8490
+ * ```
8491
+ */
8492
+
8493
+
8494
+ function deprecatedBuildCustomElementConstructor(Ctor) {
8495
+ if (process.env.NODE_ENV !== 'production') {
8496
+ /* eslint-disable-next-line no-console */
8497
+ console.warn('Deprecated function called: "buildCustomElementConstructor" function is deprecated and it will be removed.' + `Use "${Ctor.name}.CustomElementConstructor" static property of the component constructor to access the corresponding custom element constructor instead.`);
8498
+ }
8499
+
8500
+ return Ctor.CustomElementConstructor;
8501
+ } // Note: WeakSet is not supported in IE11, and the polyfill is not performant enough.
8502
+ // This WeakSet usage is valid because this functionality is not meant to run in IE11.
8503
+
8504
+
8505
+ const hydratedCustomElements = new WeakSet();
8506
+
8507
+ function buildCustomElementConstructor(Ctor) {
8508
+ const HtmlPrototype = getComponentHtmlPrototype(Ctor);
8509
+ return class extends HtmlPrototype {
8510
+ constructor() {
8511
+ super();
8512
+
8513
+ if (this.isConnected) {
8514
+ // this if block is hit when there's already an un-upgraded element in the DOM with the same tag name.
8515
+ hydrateComponent(this, Ctor, {});
8516
+ hydratedCustomElements.add(this);
8517
+ } else {
8518
+ createVM(this, Ctor, {
8519
+ mode: 'open',
8520
+ owner: null,
8521
+ tagName: this.tagName
8522
+ });
8523
+ }
8524
+ }
8525
+
8526
+ connectedCallback() {
8527
+ if (hydratedCustomElements.has(this)) {
8528
+ // This is an un-upgraded element that was hydrated in the constructor.
8529
+ hydratedCustomElements.delete(this);
8530
+ } else {
8531
+ connectRootElement(this);
8532
+ }
8533
+ }
8534
+
8535
+ disconnectedCallback() {
8536
+ disconnectRootElement(this);
8537
+ }
8538
+
8539
+ };
8540
+ }
8276
8541
  /*
8277
8542
  * Copyright (c) 2018, salesforce.com, inc.
8278
8543
  * All rights reserved.
@@ -8282,6 +8547,7 @@ setAddEventListener(addEventListener);
8282
8547
  // TODO [#2472]: Remove this workaround when appropriate.
8283
8548
  // eslint-disable-next-line lwc-internal/no-global-node
8284
8549
 
8550
+
8285
8551
  const _Node$1 = Node;
8286
8552
  const ConnectingSlot = new WeakMap();
8287
8553
  const DisconnectingSlot = new WeakMap();
@@ -8390,118 +8656,6 @@ function createElement(sel, options) {
8390
8656
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
8391
8657
  */
8392
8658
 
8393
-
8394
- function hydrateComponent(element, Ctor, props = {}) {
8395
- if (!(element instanceof Element)) {
8396
- throw new TypeError(`"hydrateComponent" expects a valid DOM element as the first parameter but instead received ${element}.`);
8397
- }
8398
-
8399
- if (!isFunction$1(Ctor)) {
8400
- throw new TypeError(`"hydrateComponent" expects a valid component constructor as the second parameter but instead received ${Ctor}.`);
8401
- }
8402
-
8403
- if (!isObject(props) || isNull(props)) {
8404
- throw new TypeError(`"hydrateComponent" expects an object as the third parameter but instead received ${props}.`);
8405
- }
8406
-
8407
- try {
8408
- // Let the renderer know we are hydrating, so it does not replace the existing shadowRoot
8409
- // and uses the same algo to create the stylesheets as in SSR.
8410
- setIsHydrating(true);
8411
- createVM(element, Ctor, {
8412
- mode: 'open',
8413
- owner: null,
8414
- tagName: element.tagName.toLowerCase()
8415
- });
8416
-
8417
- for (const [key, value] of Object.entries(props)) {
8418
- element[key] = value;
8419
- }
8420
-
8421
- hydrateRootElement(element); // set it back since now we finished hydration.
8422
-
8423
- setIsHydrating(false);
8424
- } catch (e) {
8425
- // Fallback: In case there's an error while hydrating, let's log the error, and replace the element with
8426
- // the client generated DOM.
8427
-
8428
- /* eslint-disable-next-line no-console */
8429
- console.error('Recovering from error while hydrating: ', e);
8430
- setIsHydrating(false);
8431
- const newElem = createElement(element.tagName, {
8432
- is: Ctor,
8433
- mode: 'open'
8434
- });
8435
-
8436
- for (const [key, value] of Object.entries(props)) {
8437
- newElem[key] = value;
8438
- }
8439
-
8440
- element.parentNode.replaceChild(newElem, element);
8441
- }
8442
- }
8443
- /*
8444
- * Copyright (c) 2018, salesforce.com, inc.
8445
- * All rights reserved.
8446
- * SPDX-License-Identifier: MIT
8447
- * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
8448
- */
8449
-
8450
- /**
8451
- * This function builds a Web Component class from a LWC constructor so it can be
8452
- * registered as a new element via customElements.define() at any given time.
8453
- *
8454
- * @deprecated since version 1.3.11
8455
- *
8456
- * @example
8457
- * ```
8458
- * import { buildCustomElementConstructor } from 'lwc';
8459
- * import Foo from 'ns/foo';
8460
- * const WC = buildCustomElementConstructor(Foo);
8461
- * customElements.define('x-foo', WC);
8462
- * const elm = document.createElement('x-foo');
8463
- * ```
8464
- */
8465
-
8466
-
8467
- function deprecatedBuildCustomElementConstructor(Ctor) {
8468
- if (process.env.NODE_ENV !== 'production') {
8469
- /* eslint-disable-next-line no-console */
8470
- console.warn('Deprecated function called: "buildCustomElementConstructor" function is deprecated and it will be removed.' + `Use "${Ctor.name}.CustomElementConstructor" static property of the component constructor to access the corresponding custom element constructor instead.`);
8471
- }
8472
-
8473
- return Ctor.CustomElementConstructor;
8474
- }
8475
-
8476
- function buildCustomElementConstructor(Ctor) {
8477
- const HtmlPrototype = getComponentHtmlPrototype(Ctor);
8478
- return class extends HtmlPrototype {
8479
- constructor() {
8480
- super();
8481
- createVM(this, Ctor, {
8482
- mode: 'open',
8483
- owner: null,
8484
- tagName: this.tagName
8485
- });
8486
- }
8487
-
8488
- connectedCallback() {
8489
- connectRootElement(this);
8490
- }
8491
-
8492
- disconnectedCallback() {
8493
- disconnectRootElement(this);
8494
- }
8495
-
8496
- };
8497
- }
8498
- /*
8499
- * Copyright (c) 2018, salesforce.com, inc.
8500
- * All rights reserved.
8501
- * SPDX-License-Identifier: MIT
8502
- * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
8503
- */
8504
-
8505
8659
  /**
8506
8660
  * EXPERIMENTAL: This function provides access to the component constructor, given an HTMLElement.
8507
8661
  * This API is subject to change or being removed.
@@ -8602,6 +8756,6 @@ defineProperty(LightningElement, 'CustomElementConstructor', {
8602
8756
  });
8603
8757
  freeze(LightningElement);
8604
8758
  seal(LightningElement.prototype);
8605
- /* version: 2.9.0 */
8759
+ /* version: 2.10.0 */
8606
8760
 
8607
8761
  export { LightningElement, profilerControl as __unstable__ProfilerControl, api$1 as api, deprecatedBuildCustomElementConstructor as buildCustomElementConstructor, createContextProvider, createElement, getComponentConstructor, getComponentDef, hydrateComponent, isComponentConstructor, isNodeShadowed as isNodeFromTemplate, readonly, register, registerComponent, registerDecorators, registerTemplate, sanitizeAttribute, setFeatureFlag, setFeatureFlagForTest, setHooks, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };