lwc 2.9.0 → 2.10.0

package/dist/engine-dom/iife/es2017/engine-dom.js

@@ -306,7 +306,17 @@ var LWC = (function (exports) {
   const XML_NAMESPACE = 'http://www.w3.org/XML/1998/namespace';
   const SVG_NAMESPACE = 'http://www.w3.org/2000/svg';
   const XLINK_NAMESPACE = 'http://www.w3.org/1999/xlink';
-  /** version: 2.9.0 */
+  /*
+   * Copyright (c) 2018, salesforce.com, inc.
+   * All rights reserved.
+   * SPDX-License-Identifier: MIT
+   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+   */
+  // Increment whenever the LWC template compiler changes
+
+  const LWC_VERSION = "2.10.0";
+  const LWC_VERSION_COMMENT_REGEX = /\/\*LWC compiler v([\d.]+)\*\/\s*}/;
+  /** version: 2.10.0 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -373,7 +383,7 @@ var LWC = (function (exports) {
     };
   }
 
-  function patch(propName) {
+  function patch$1(propName) {
     // Typescript is inferring the wrong function type for this particular
     // overloaded method: https://github.com/Microsoft/TypeScript/issues/27972
     // @ts-ignore type-mismatch
@@ -395,7 +405,7 @@ var LWC = (function (exports) {
     const propName = ElementPrototypeAriaPropertyNames[i];
 
     if (detect(propName)) {
-      patch(propName);
+      patch$1(propName);
     }
   }
   /**
@@ -411,14 +421,15 @@ var LWC = (function (exports) {
 
 
   const features = {
-    ENABLE_REACTIVE_SETTER: null,
-    ENABLE_HMR: null,
-    ENABLE_INNER_OUTER_TEXT_PATCH: null,
+    DISABLE_MIXED_SHADOW_MODE: null,
     ENABLE_ELEMENT_PATCH: null,
     ENABLE_FORCE_NATIVE_SHADOW_MODE_FOR_TEST: null,
-    ENABLE_NODE_LIST_PATCH: null,
+    ENABLE_HMR: null,
     ENABLE_HTML_COLLECTIONS_PATCH: null,
+    ENABLE_INNER_OUTER_TEXT_PATCH: null,
+    ENABLE_NODE_LIST_PATCH: null,
     ENABLE_NODE_PATCH: null,
+    ENABLE_REACTIVE_SETTER: null,
     ENABLE_WIRE_SYNC_EMIT: null
   };
 
@@ -483,7 +494,7 @@ var LWC = (function (exports) {
       setFeatureFlag(name, value);
     }
   }
-  /** version: 2.9.0 */
+  /** version: 2.10.0 */
 
   /* proxy-compat-disable */
 
@@ -570,6 +581,20 @@ var LWC = (function (exports) {
     }
 
     return result;
+  }
+
+  function flattenStylesheets(stylesheets) {
+    const list = [];
+
+    for (const stylesheet of stylesheets) {
+      if (!Array.isArray(stylesheet)) {
+        list.push(stylesheet);
+      } else {
+        list.push(...flattenStylesheets(stylesheet));
+      }
+    }
+
+    return list;
   } //
   // Primitives
   //
@@ -3375,6 +3400,47 @@ var LWC = (function (exports) {
     const meta = signedDecoratorToMetaMap.get(Ctor);
     return isUndefined$1(meta) ? defaultMeta : meta;
   }
+  /*
+   * Copyright (c) 2018, salesforce.com, inc.
+   * All rights reserved.
+   * SPDX-License-Identifier: MIT
+   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+   */
+
+
+  let warned = false;
+
+  if (process.env.NODE_ENV === 'development') {
+    // @ts-ignore
+    window.__lwcResetWarnedOnVersionMismatch = () => {
+      warned = false;
+    };
+  }
+
+  function checkVersionMismatch(func, type) {
+    const versionMatcher = func.toString().match(LWC_VERSION_COMMENT_REGEX);
+
+    if (!isNull(versionMatcher) && !warned) {
+      const version = versionMatcher[1];
+      const [major, minor] = version.split('.');
+      const [expectedMajor, expectedMinor] = LWC_VERSION.split('.');
+
+      if (major !== expectedMajor || minor !== expectedMinor) {
+        warned = true; // only warn once to avoid flooding the console
+        // stylesheets and templates do not have user-meaningful names, but components do
+
+        const friendlyName = type === 'component' ? `${type} ${func.name}` : type;
+        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.`);
+      }
+    }
+  }
+  /*
+   * Copyright (c) 2018, salesforce.com, inc.
+   * All rights reserved.
+   * SPDX-License-Identifier: MIT
+   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+   */
+
 
   const signedTemplateSet = new Set();
 
@@ -3387,6 +3453,16 @@ var LWC = (function (exports) {
   function isTemplateRegistered(tpl) {
     return signedTemplateSet.has(tpl);
   }
+
+  function checkTemplateVersionMismatch(template) {
+    checkVersionMismatch(template, 'template');
+
+    if (!isUndefined$1(template.stylesheets)) {
+      for (const stylesheet of flattenStylesheets(template.stylesheets)) {
+        checkVersionMismatch(stylesheet, 'stylesheet');
+      }
+    }
+  }
   /**
    * INTERNAL: This function can only be invoked by compiled code. The compiler
    * will prevent this function from being imported by userland code.
@@ -3394,6 +3470,10 @@ var LWC = (function (exports) {
 
 
   function registerTemplate(tpl) {
+    if (process.env.NODE_ENV !== 'production') {
+      checkTemplateVersionMismatch(tpl);
+    }
+
     signedTemplateSet.add(tpl); // chaining this method as a way to wrap existing
     // assignment of templates easily, without too much transformation
 
@@ -3689,20 +3769,6 @@ var LWC = (function (exports) {
     return canRefreshAllInstances;
   }
 
-  function flattenStylesheets(stylesheets) {
-    const list = [];
-
-    for (const stylesheet of stylesheets) {
-      if (!Array.isArray(stylesheet)) {
-        list.push(stylesheet);
-      } else {
-        list.push(...flattenStylesheets(stylesheet));
-      }
-    }
-
-    return list;
-  }
-
   function getTemplateOrSwappedTemplate(tpl) {
     if (process.env.NODE_ENV === 'production') {
       // this method should never leak to prod
@@ -4533,156 +4599,268 @@ var LWC = (function (exports) {
    */
 
 
-  const TextHook = {
-    create: vnode => {
-      const {
-        owner
-      } = vnode;
-      const elm = createText$1(vnode.text);
-      linkNodeToShadow(elm, owner);
-      vnode.elm = elm;
-    },
-    update: updateNodeHook,
-    insert: insertNode,
-    move: insertNode,
-    remove: removeNode
-  };
-  const CommentHook = {
-    create: vnode => {
-      const {
-        owner,
-        text
-      } = vnode;
-      const elm = createComment$1(text);
-      linkNodeToShadow(elm, owner);
-      vnode.elm = elm;
-    },
-    update: updateNodeHook,
-    insert: insertNode,
-    move: insertNode,
-    remove: removeNode
-  }; // insert is called after update, which is used somewhere else (via a module)
-  // to mark the vm as inserted, that means we cannot use update as the main channel
-  // to rehydrate when dirty, because sometimes the element is not inserted just yet,
-  // which breaks some invariants. For that reason, we have the following for any
-  // Custom Element that is inserted via a template.
-
-  const ElementHook = {
-    create: vnode => {
-      const {
-        sel,
-        owner,
-        data: {
-          svg
-        }
-      } = vnode;
-      const namespace = isTrue(svg) ? SVG_NAMESPACE : undefined;
-      const elm = createElement$2(sel, namespace);
-      linkNodeToShadow(elm, owner);
-      fallbackElmHook(elm, vnode);
-      vnode.elm = elm;
-      patchElementPropsAndAttrs$1(null, vnode);
-    },
-    update: (oldVnode, vnode) => {
-      patchElementPropsAndAttrs$1(oldVnode, vnode);
-      patchChildren(vnode.elm, oldVnode.children, vnode.children);
-    },
-    insert: (vnode, parentNode, referenceNode) => {
-      insertNode(vnode, parentNode, referenceNode);
-      createChildrenHook(vnode);
-    },
-    move: insertNode,
-    remove: (vnode, parentNode) => {
-      removeNode(vnode, parentNode);
-      removeChildren(vnode);
+  function patchChildren(c1, c2, parent) {
+    if (hasDynamicChildren(c2)) {
+      updateDynamicChildren(c1, c2, parent);
+    } else {
+      updateStaticChildren(c1, c2, parent);
+    }
+  }
+
+  function patch(n1, n2) {
+    if (n1 === n2) {
+      return;
     }
-  };
-  const CustomElementHook = {
-    create: vnode => {
-      const {
-        sel,
-        owner
-      } = vnode;
-      const UpgradableConstructor = getUpgradableConstructor(sel);
-      /**
-       * Note: if the upgradable constructor does not expect, or throw when we new it
-       * with a callback as the first argument, we could implement a more advanced
-       * mechanism that only passes that argument if the constructor is known to be
-       * an upgradable custom element.
-       */
-
-      let vm;
-      const elm = new UpgradableConstructor(elm => {
-        // the custom element from the registry is expecting an upgrade callback
-        vm = createViewModelHook(elm, vnode);
-      });
-      linkNodeToShadow(elm, owner);
-      vnode.elm = elm;
 
-      if (vm) {
-        allocateChildren(vnode, vm);
-      } else if (vnode.ctor !== UpgradableConstructor) {
-        throw new TypeError(`Incorrect Component Constructor`);
+    if (process.env.NODE_ENV !== 'production') {
+      if (!isSameVnode(n1, n2)) {
+        throw new Error('Expected these VNodes to be the same: ' + JSON.stringify({
+          sel: n1.sel,
+          key: n1.key
+        }) + ', ' + JSON.stringify({
+          sel: n2.sel,
+          key: n2.key
+        }));
       }
+    }
 
-      patchElementPropsAndAttrs$1(null, vnode);
-    },
-    update: (oldVnode, vnode) => {
-      patchElementPropsAndAttrs$1(oldVnode, vnode);
-      const vm = getAssociatedVMIfPresent(vnode.elm);
+    switch (n2.type) {
+      case 0
+      /* Text */
+      :
+        patchText(n1, n2);
+        break;
+
+      case 1
+      /* Comment */
+      :
+        patchComment(n1, n2);
+        break;
 
-      if (vm) {
-        // in fallback mode, the allocation will always set children to
-        // empty and delegate the real allocation to the slot elements
-        allocateChildren(vnode, vm);
-      } // in fallback mode, the children will be always empty, so, nothing
-      // will happen, but in native, it does allocate the light dom
+      case 2
+      /* Element */
+      :
+        patchElement(n1, n2);
+        break;
 
+      case 3
+      /* CustomElement */
+      :
+        patchCustomElement(n1, n2);
+        break;
+    }
+  }
 
-      patchChildren(vnode.elm, oldVnode.children, vnode.children);
+  function mount(node, parent, anchor) {
+    switch (node.type) {
+      case 0
+      /* Text */
+      :
+        mountText(node, parent, anchor);
+        break;
 
-      if (vm) {
-        if (process.env.NODE_ENV !== 'production') {
-          assert.isTrue(isArray$1(vnode.children), `Invalid vnode for a custom element, it must have children defined.`);
-        } // this will probably update the shadowRoot, but only if the vm is in a dirty state
-        // this is important to preserve the top to bottom synchronous rendering phase.
+      case 1
+      /* Comment */
+      :
+        mountComment(node, parent, anchor);
+        break;
+
+      case 2
+      /* Element */
+      :
+        mountElement(node, parent, anchor);
+        break;
+
+      case 3
+      /* CustomElement */
+      :
+        mountCustomElement(node, parent, anchor);
+        break;
+    }
+  }
 
+  function patchText(n1, n2) {
+    n2.elm = n1.elm;
 
-        rerenderVM(vm);
+    if (n2.text !== n1.text) {
+      updateTextContent(n2);
+    }
+  }
+
+  function mountText(node, parent, anchor) {
+    const {
+      owner
+    } = node;
+    const textNode = node.elm = createText$1(node.text);
+    linkNodeToShadow(textNode, owner);
+    insertNode(textNode, parent, anchor);
+  }
+
+  function patchComment(n1, n2) {
+    n2.elm = n1.elm; // FIXME: Comment nodes should be static, we shouldn't need to diff them together. However
+    // it is the case today.
+
+    if (n2.text !== n1.text) {
+      updateTextContent(n2);
+    }
+  }
+
+  function mountComment(node, parent, anchor) {
+    const {
+      owner
+    } = node;
+    const commentNode = node.elm = createComment$1(node.text);
+    linkNodeToShadow(commentNode, owner);
+    insertNode(commentNode, parent, anchor);
+  }
+
+  function mountElement(vnode, parent, anchor) {
+    const {
+      sel,
+      owner,
+      data: {
+        svg
       }
-    },
-    insert: (vnode, parentNode, referenceNode) => {
-      insertNode(vnode, parentNode, referenceNode);
-      const vm = getAssociatedVMIfPresent(vnode.elm);
+    } = vnode;
+    const namespace = isTrue(svg) ? SVG_NAMESPACE : undefined;
+    const elm = createElement$2(sel, namespace);
+    linkNodeToShadow(elm, owner);
+    fallbackElmHook(elm, vnode);
+    vnode.elm = elm;
+    patchElementPropsAndAttrs$1(null, vnode);
+    insertNode(elm, parent, anchor);
+    mountVNodes(vnode.children, elm, null);
+  }
 
-      if (vm) {
-        if (process.env.NODE_ENV !== 'production') {
-          assert.isTrue(vm.state === 0
-          /* created */
-          , `${vm} cannot be recycled.`);
-        }
+  function patchElement(n1, n2) {
+    const elm = n2.elm = n1.elm;
+    patchElementPropsAndAttrs$1(n1, n2);
+    patchChildren(n1.children, n2.children, elm);
+  }
+
+  function mountCustomElement(vnode, parent, anchor) {
+    const {
+      sel,
+      owner
+    } = vnode;
+    const UpgradableConstructor = getUpgradableConstructor(sel);
+    /**
+     * Note: if the upgradable constructor does not expect, or throw when we new it
+     * with a callback as the first argument, we could implement a more advanced
+     * mechanism that only passes that argument if the constructor is known to be
+     * an upgradable custom element.
+     */
+
+    let vm;
+    const elm = new UpgradableConstructor(elm => {
+      // the custom element from the registry is expecting an upgrade callback
+      vm = createViewModelHook(elm, vnode);
+    });
+    linkNodeToShadow(elm, owner);
+    vnode.elm = elm;
+    vnode.vm = vm;
+
+    if (vm) {
+      allocateChildren(vnode, vm);
+    } else if (vnode.ctor !== UpgradableConstructor) {
+      throw new TypeError(`Incorrect Component Constructor`);
+    }
+
+    patchElementPropsAndAttrs$1(null, vnode);
+    insertNode(elm, parent, anchor);
 
-        runConnectedCallback(vm);
+    if (vm) {
+      if (process.env.NODE_ENV !== 'production') {
+        assert.isTrue(vm.state === 0
+        /* created */
+        , `${vm} cannot be recycled.`);
       }
 
-      createChildrenHook(vnode);
+      runConnectedCallback(vm);
+    }
+
+    mountVNodes(vnode.children, elm, null);
+
+    if (vm) {
+      appendVM(vm);
+    }
+  }
+
+  function patchCustomElement(n1, n2) {
+    const elm = n2.elm = n1.elm;
+    const vm = n2.vm = n1.vm;
+    patchElementPropsAndAttrs$1(n1, n2);
+
+    if (!isUndefined$1(vm)) {
+      // in fallback mode, the allocation will always set children to
+      // empty and delegate the real allocation to the slot elements
+      allocateChildren(n2, vm);
+    } // in fallback mode, the children will be always empty, so, nothing
+    // will happen, but in native, it does allocate the light dom
+
+
+    patchChildren(n1.children, n2.children, elm);
+
+    if (!isUndefined$1(vm)) {
+      // this will probably update the shadowRoot, but only if the vm is in a dirty state
+      // this is important to preserve the top to bottom synchronous rendering phase.
+      rerenderVM(vm);
+    }
+  }
+
+  function mountVNodes(vnodes, parent, anchor, start = 0, end = vnodes.length) {
+    for (; start < end; ++start) {
+      const vnode = vnodes[start];
 
-      if (vm) {
-        appendVM(vm);
+      if (isVNode(vnode)) {
+        mount(vnode, parent, anchor);
       }
-    },
-    move: insertNode,
-    remove: (vnode, parentNode) => {
-      removeNode(vnode, parentNode);
-      const vm = getAssociatedVMIfPresent(vnode.elm);
+    }
+  }
+
+  function unmount(vnode, parent, doRemove = false) {
+    const {
+      type,
+      elm
+    } = vnode; // When unmounting a VNode subtree not all the elements have to removed from the DOM. The
+    // subtree root, is the only element worth unmounting from the subtree.
+
+    if (doRemove) {
+      removeNode(elm, parent);
+    }
+
+    switch (type) {
+      case 2
+      /* Element */
+      :
+        unmountVNodes(vnode.children, elm);
+        break;
+
+      case 3
+      /* CustomElement */
+      :
+        {
+          const {
+            vm
+          } = vnode; // No need to unmount the children here, `removeVM` will take care of removing the
+          // children.
+
+          if (!isUndefined$1(vm)) {
+            removeVM(vm);
+          }
+        }
+    }
+  }
+
+  function unmountVNodes(vnodes, parent, doRemove = false, start = 0, end = vnodes.length) {
+    for (; start < end; ++start) {
+      const ch = vnodes[start];
 
-      if (vm) {
-        // for custom elements we don't have to go recursively because the removeVM routine
-        // will take care of disconnecting any child VM attached to its shadow as well.
-        removeVM(vm);
+      if (isVNode(ch)) {
+        unmount(ch, parent, doRemove);
       }
     }
-  };
+  }
 
   function isVNode(vnode) {
     return vnode != null;
@@ -4727,43 +4905,41 @@ var LWC = (function (exports) {
     }
   }
 
-  function updateNodeHook(oldVnode, vnode) {
+  function updateTextContent(vnode) {
     const {
       elm,
       text
     } = vnode;
 
-    if (oldVnode.text !== text) {
-      if (process.env.NODE_ENV !== 'production') {
-        unlockDomMutation();
-      }
+    if (process.env.NODE_ENV !== 'production') {
+      unlockDomMutation();
+    }
 
-      setText$1(elm, text);
+    setText$1(elm, text);
 
-      if (process.env.NODE_ENV !== 'production') {
-        lockDomMutation();
-      }
+    if (process.env.NODE_ENV !== 'production') {
+      lockDomMutation();
     }
   }
 
-  function insertNode(vnode, parentNode, referenceNode) {
+  function insertNode(node, parent, anchor) {
     if (process.env.NODE_ENV !== 'production') {
       unlockDomMutation();
     }
 
-    insert$1(vnode.elm, parentNode, referenceNode);
+    insert$1(node, parent, anchor);
 
     if (process.env.NODE_ENV !== 'production') {
       lockDomMutation();
     }
   }
 
-  function removeNode(vnode, parentNode) {
+  function removeNode(node, parent) {
     if (process.env.NODE_ENV !== 'production') {
       unlockDomMutation();
     }
 
-    remove$1(vnode.elm, parentNode);
+    remove$1(node, parent);
 
     if (process.env.NODE_ENV !== 'production') {
       lockDomMutation();
@@ -4836,14 +5012,6 @@ var LWC = (function (exports) {
     }
   }
 
-  function patchChildren(parent, oldCh, newCh) {
-    if (hasDynamicChildren(newCh)) {
-      updateDynamicChildren(parent, oldCh, newCh);
-    } else {
-      updateStaticChildren(parent, oldCh, newCh);
-    }
-  }
-
   function allocateChildren(vnode, vm) {
     // A component with slots will re-render because:
     // 1- There is a change of the internal state.
@@ -4919,50 +5087,16 @@ var LWC = (function (exports) {
     return vm;
   }
 
-  function createChildrenHook(vnode) {
+  function allocateInSlot(vm, children) {
+    var _a;
+
     const {
-      elm,
-      children
-    } = vnode;
+      cmpSlots: oldSlots
+    } = vm;
+    const cmpSlots = vm.cmpSlots = create(null);
 
-    for (let j = 0; j < children.length; ++j) {
-      const ch = children[j];
-
-      if (ch != null) {
-        ch.hook.create(ch);
-        ch.hook.insert(ch, elm, null);
-      }
-    }
-  }
-
-  function removeChildren(vnode) {
-    // this method only needs to search on child vnodes from template
-    // to trigger the remove hook just in case some of those children
-    // are custom elements.
-    const {
-      children,
-      elm
-    } = vnode;
-
-    for (let j = 0, len = children.length; j < len; ++j) {
-      const ch = children[j];
-
-      if (!isNull(ch)) {
-        ch.hook.remove(ch, elm);
-      }
-    }
-  }
-
-  function allocateInSlot(vm, children) {
-    var _a;
-
-    const {
-      cmpSlots: oldSlots
-    } = vm;
-    const cmpSlots = vm.cmpSlots = create(null);
-
-    for (let i = 0, len = children.length; i < len; i += 1) {
-      const vnode = children[i];
+    for (let i = 0, len = children.length; i < len; i += 1) {
+      const vnode = children[i];
 
       if (isNull(vnode)) {
         continue;
@@ -5049,28 +5183,7 @@ var LWC = (function (exports) {
     return map;
   }
 
-  function addVnodes(parentElm, before, vnodes, startIdx, endIdx) {
-    for (; startIdx <= endIdx; ++startIdx) {
-      const ch = vnodes[startIdx];
-
-      if (isVNode(ch)) {
-        ch.hook.create(ch);
-        ch.hook.insert(ch, parentElm, before);
-      }
-    }
-  }
-
-  function removeVnodes(parentElm, vnodes, startIdx, endIdx) {
-    for (; startIdx <= endIdx; ++startIdx) {
-      const ch = vnodes[startIdx]; // text nodes do not have logic associated to them
-
-      if (isVNode(ch)) {
-        ch.hook.remove(ch, parentElm);
-      }
-    }
-  }
-
-  function updateDynamicChildren(parentElm, oldCh, newCh) {
+  function updateDynamicChildren(oldCh, newCh, parent) {
     let oldStartIdx = 0;
     let newStartIdx = 0;
     let oldEndIdx = oldCh.length - 1;
@@ -5096,23 +5209,23 @@ var LWC = (function (exports) {
       } else if (!isVNode(newEndVnode)) {
         newEndVnode = newCh[--newEndIdx];
       } else if (isSameVnode(oldStartVnode, newStartVnode)) {
-        patchVnode(oldStartVnode, newStartVnode);
+        patch(oldStartVnode, newStartVnode);
         oldStartVnode = oldCh[++oldStartIdx];
         newStartVnode = newCh[++newStartIdx];
       } else if (isSameVnode(oldEndVnode, newEndVnode)) {
-        patchVnode(oldEndVnode, newEndVnode);
+        patch(oldEndVnode, newEndVnode);
         oldEndVnode = oldCh[--oldEndIdx];
         newEndVnode = newCh[--newEndIdx];
       } else if (isSameVnode(oldStartVnode, newEndVnode)) {
         // Vnode moved right
-        patchVnode(oldStartVnode, newEndVnode);
-        newEndVnode.hook.move(oldStartVnode, parentElm, nextSibling$1(oldEndVnode.elm));
+        patch(oldStartVnode, newEndVnode);
+        insertNode(oldStartVnode.elm, parent, nextSibling$1(oldEndVnode.elm));
         oldStartVnode = oldCh[++oldStartIdx];
         newEndVnode = newCh[--newEndIdx];
       } else if (isSameVnode(oldEndVnode, newStartVnode)) {
         // Vnode moved left
-        patchVnode(oldEndVnode, newStartVnode);
-        newStartVnode.hook.move(oldEndVnode, parentElm, oldStartVnode.elm);
+        patch(oldEndVnode, newStartVnode);
+        insertNode(newStartVnode.elm, parent, oldStartVnode.elm);
         oldEndVnode = oldCh[--oldEndIdx];
         newStartVnode = newCh[++newStartIdx];
       } else {
@@ -5124,8 +5237,7 @@ var LWC = (function (exports) {
 
         if (isUndefined$1(idxInOld)) {
           // New element
-          newStartVnode.hook.create(newStartVnode);
-          newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm);
+          mount(newStartVnode, parent, oldStartVnode.elm);
           newStartVnode = newCh[++newStartIdx];
         } else {
           elmToMove = oldCh[idxInOld];
@@ -5133,10 +5245,9 @@ var LWC = (function (exports) {
           if (isVNode(elmToMove)) {
             if (elmToMove.sel !== newStartVnode.sel) {
               // New element
-              newStartVnode.hook.create(newStartVnode);
-              newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm);
+              mount(newStartVnode, parent, oldStartVnode.elm);
             } else {
-              patchVnode(elmToMove, newStartVnode); // Delete the old child, but copy the array since it is read-only.
+              patch(elmToMove, newStartVnode); // Delete the old child, but copy the array since it is read-only.
               // The `oldCh` will be GC'ed after `updateDynamicChildren` is complete,
               // so we only care about the `oldCh` object inside this function.
               // To avoid cloning over and over again, we check `clonedOldCh`
@@ -5149,7 +5260,7 @@ var LWC = (function (exports) {
 
 
               oldCh[idxInOld] = undefined;
-              newStartVnode.hook.move(elmToMove, parentElm, oldStartVnode.elm);
+              insertNode(elmToMove.elm, parent, oldStartVnode.elm);
             }
           }
 
@@ -5170,65 +5281,55 @@ var LWC = (function (exports) {
         } while (!isVNode(n) && i < newChEnd);
 
         before = isVNode(n) ? n.elm : null;
-        addVnodes(parentElm, before, newCh, newStartIdx, newEndIdx);
+        mountVNodes(newCh, parent, before, newStartIdx, newEndIdx + 1);
       } else {
-        removeVnodes(parentElm, oldCh, oldStartIdx, oldEndIdx);
+        unmountVNodes(oldCh, parent, true, oldStartIdx, oldEndIdx + 1);
       }
     }
   }
 
-  function updateStaticChildren(parentElm, oldCh, newCh) {
-    const oldChLength = oldCh.length;
-    const newChLength = newCh.length;
+  function updateStaticChildren(c1, c2, parent) {
+    const c1Length = c1.length;
+    const c2Length = c2.length;
 
-    if (oldChLength === 0) {
+    if (c1Length === 0) {
       // the old list is empty, we can directly insert anything new
-      addVnodes(parentElm, null, newCh, 0, newChLength);
+      mountVNodes(c2, parent, null);
       return;
     }
 
-    if (newChLength === 0) {
+    if (c2Length === 0) {
       // the old list is nonempty and the new list is empty so we can directly remove all old nodes
       // this is the case in which the dynamic children of an if-directive should be removed
-      removeVnodes(parentElm, oldCh, 0, oldChLength);
+      unmountVNodes(c1, parent, true);
       return;
     } // if the old list is not empty, the new list MUST have the same
     // amount of nodes, that's why we call this static children
 
 
-    let referenceElm = null;
+    let anchor = null;
 
-    for (let i = newChLength - 1; i >= 0; i -= 1) {
-      const vnode = newCh[i];
-      const oldVNode = oldCh[i];
+    for (let i = c2Length - 1; i >= 0; i -= 1) {
+      const n1 = c1[i];
+      const n2 = c2[i];
 
-      if (vnode !== oldVNode) {
-        if (isVNode(oldVNode)) {
-          if (isVNode(vnode)) {
-            // both vnodes must be equivalent, and se just need to patch them
-            patchVnode(oldVNode, vnode);
-            referenceElm = vnode.elm;
+      if (n2 !== n1) {
+        if (isVNode(n1)) {
+          if (isVNode(n2)) {
+            // both vnodes are equivalent, and we just need to patch them
+            patch(n1, n2);
+            anchor = n2.elm;
           } else {
             // removing the old vnode since the new one is null
-            oldVNode.hook.remove(oldVNode, parentElm);
+            unmount(n1, parent, true);
           }
-        } else if (isVNode(vnode)) {
-          // this condition is unnecessary
-          vnode.hook.create(vnode); // insert the new node one since the old one is null
-
-          vnode.hook.insert(vnode, parentElm, referenceElm);
-          referenceElm = vnode.elm;
+        } else if (isVNode(n2)) {
+          mount(n2, parent, anchor);
+          anchor = n2.elm;
         }
       }
     }
   }
-
-  function patchVnode(oldVnode, vnode) {
-    if (oldVnode !== vnode) {
-      vnode.elm = oldVnode.elm;
-      vnode.hook.update(oldVnode, vnode);
-    }
-  }
   /*
    * Copyright (c) 2018, salesforce.com, inc.
    * All rights reserved.
@@ -5280,7 +5381,6 @@ var LWC = (function (exports) {
       children,
       elm,
       key,
-      hook: ElementHook,
       owner: vmBeingRendered
     };
   } // [t]ab[i]ndex function
@@ -5367,7 +5467,7 @@ var LWC = (function (exports) {
     const {
       key
     } = data;
-    let elm;
+    let elm, aChildren, vm;
     const vnode = {
       type: 3
       /* CustomElement */
@@ -5377,11 +5477,11 @@ var LWC = (function (exports) {
       children,
       elm,
       key,
-      hook: CustomElementHook,
       ctor: Ctor,
       owner: vmBeingRendered,
-      mode: 'open' // TODO [#1294]: this should be defined in Ctor
-
+      mode: 'open',
+      aChildren,
+      vm
     };
     addVNodeToChildLWC(vnode);
     return vnode;
@@ -5511,7 +5611,6 @@ var LWC = (function (exports) {
       text,
       elm,
       key,
-      hook: TextHook,
       owner: getVMBeingRendered()
     };
   } // [co]mment node
@@ -5527,7 +5626,6 @@ var LWC = (function (exports) {
       text,
       elm,
       key,
-      hook: CommentHook,
       owner: getVMBeingRendered()
     };
   } // [d]ynamic text
@@ -6394,6 +6492,10 @@ var LWC = (function (exports) {
   function registerComponent(Ctor, {
     tmpl
   }) {
+    if (process.env.NODE_ENV !== 'production') {
+      checkVersionMismatch(Ctor, 'component');
+    }
+
     signedTemplateMap.set(Ctor, tmpl); // chaining this method as a way to wrap existing assignment of component constructor easily,
     // without too much transformation
 
@@ -6518,7 +6620,7 @@ var LWC = (function (exports) {
    */
 
 
-  function hydrate$1(vnode, node) {
+  function hydrate(vnode, node) {
     switch (vnode.type) {
       case 0
       /* Text */
@@ -6550,16 +6652,18 @@ var LWC = (function (exports) {
     var _a;
 
     if (process.env.NODE_ENV !== 'production') {
-      // eslint-disable-next-line lwc-internal/no-global-node
-      validateNodeType(vnode, node, Node.TEXT_NODE);
+      validateNodeType(vnode, node, 3
+      /* TEXT */
+      );
+      const nodeValue = getProperty$1(node, 'nodeValue');
 
-      if (node.nodeValue !== vnode.text && !(node.nodeValue === '\u200D' && vnode.text === '')) {
+      if (nodeValue !== vnode.text && !(nodeValue === '\u200D' && vnode.text === '')) {
         logWarn('Hydration mismatch: text values do not match, will recover from the difference', vnode.owner);
       }
     } // always set the text value to the one from the vnode.
 
 
-    node.nodeValue = (_a = vnode.text) !== null && _a !== void 0 ? _a : null;
+    setText$1(node, (_a = vnode.text) !== null && _a !== void 0 ? _a : null);
     vnode.elm = node;
   }
 
@@ -6567,23 +6671,25 @@ var LWC = (function (exports) {
     var _a;
 
     if (process.env.NODE_ENV !== 'production') {
-      // eslint-disable-next-line lwc-internal/no-global-node
-      validateNodeType(vnode, node, Node.COMMENT_NODE);
+      validateNodeType(vnode, node, 8
+      /* COMMENT */
+      );
 
-      if (node.nodeValue !== vnode.text) {
+      if (getProperty$1(node, 'nodeValue') !== vnode.text) {
         logWarn('Hydration mismatch: comment values do not match, will recover from the difference', vnode.owner);
       }
     } // always set the text value to the one from the vnode.
 
 
-    node.nodeValue = (_a = vnode.text) !== null && _a !== void 0 ? _a : null;
+    setProperty$1(node, 'nodeValue', (_a = vnode.text) !== null && _a !== void 0 ? _a : null);
     vnode.elm = node;
   }
 
   function hydrateElement(vnode, node) {
     if (process.env.NODE_ENV !== 'production') {
-      // eslint-disable-next-line lwc-internal/no-global-node
-      validateNodeType(vnode, node, Node.ELEMENT_NODE);
+      validateNodeType(vnode, node, 1
+      /* ELEMENT */
+      );
       validateElement(vnode, node);
     }
 
@@ -6604,13 +6710,13 @@ var LWC = (function (exports) {
       } = vnode.data;
 
       if (!isUndefined$1(props) && !isUndefined$1(props.innerHTML)) {
-        if (elm.innerHTML === props.innerHTML) {
+        if (getProperty$1(elm, 'innerHTML') === props.innerHTML) {
           // Do a shallow clone since VNodeData may be shared across VNodes due to hoist optimization
           vnode.data = Object.assign(Object.assign({}, vnode.data), {
             props: cloneAndOmitKey(props, 'innerHTML')
           });
         } else {
-          logWarn(`Mismatch hydrating element <${elm.tagName.toLowerCase()}>: innerHTML values do not match for element, will recover from the difference`, vnode.owner);
+          logWarn(`Mismatch hydrating element <${getProperty$1(elm, 'tagName').toLowerCase()}>: innerHTML values do not match for element, will recover from the difference`, vnode.owner);
         }
       }
     }
@@ -6618,19 +6724,19 @@ var LWC = (function (exports) {
     patchElementPropsAndAttrs(vnode);
 
     if (!isDomManual) {
-      hydrateChildren(vnode.elm.childNodes, vnode.children, vnode.owner);
+      hydrateChildren(getChildNodes$1(vnode.elm), vnode.children, vnode.owner);
     }
   }
 
   function hydrateCustomElement(vnode, node) {
     if (process.env.NODE_ENV !== 'production') {
-      // eslint-disable-next-line lwc-internal/no-global-node
-      validateNodeType(vnode, node, Node.ELEMENT_NODE);
+      validateNodeType(vnode, node, 1
+      /* ELEMENT */
+      );
       validateElement(vnode, node);
     }
 
     const elm = node;
-    vnode.elm = elm;
     const {
       sel,
       mode,
@@ -6642,6 +6748,8 @@ var LWC = (function (exports) {
       owner,
       tagName: sel
     });
+    vnode.elm = elm;
+    vnode.vm = vm;
     allocateChildren(vnode, vm);
     patchElementPropsAndAttrs(vnode); // Insert hook section:
 
@@ -6658,7 +6766,7 @@ var LWC = (function (exports) {
     ) {
       // VM is not rendering in Light DOM, we can proceed and hydrate the slotted content.
       // Note: for Light DOM, this is handled while hydrating the VM
-      hydrateChildren(vnode.elm.childNodes, vnode.children, vm);
+      hydrateChildren(getChildNodes$1(vnode.elm), vnode.children, vm);
     }
 
     hydrateVM(vm);
@@ -6681,7 +6789,7 @@ var LWC = (function (exports) {
 
       if (!isNull(childVnode)) {
         const childNode = elmChildren[childNodeIndex];
-        hydrate$1(childVnode, childNode);
+        hydrate(childVnode, childNode);
         childNodeIndex++;
       }
     }
@@ -6697,15 +6805,15 @@ var LWC = (function (exports) {
   }
 
   function validateNodeType(vnode, node, nodeType) {
-    if (node.nodeType !== nodeType) {
+    if (getProperty$1(node, 'nodeType') !== nodeType) {
       logError('Hydration mismatch: incorrect node type received', vnode.owner);
       assert.fail('Hydration mismatch: incorrect node type received.');
     }
   }
 
   function validateElement(vnode, elm) {
-    if (vnode.sel.toLowerCase() !== elm.tagName.toLowerCase()) {
-      logError(`Hydration mismatch: expecting element with tag "${vnode.sel.toLowerCase()}" but found "${elm.tagName.toLowerCase()}".`, vnode.owner);
+    if (vnode.sel.toLowerCase() !== getProperty$1(elm, 'tagName').toLowerCase()) {
+      logError(`Hydration mismatch: expecting element with tag "${vnode.sel.toLowerCase()}" but found "${getProperty$1(elm, 'tagName').toLowerCase()}".`, vnode.owner);
       throwHydrationError();
     }
 
@@ -6732,7 +6840,7 @@ var LWC = (function (exports) {
       const elmAttrValue = getAttribute$1(elm, attrName);
 
       if (String(attrValue) !== elmAttrValue) {
-        logError(`Mismatch hydrating element <${elm.tagName.toLowerCase()}>: attribute "${attrName}" has different values, expected "${attrValue}" but found "${elmAttrValue}"`, vnode.owner);
+        logError(`Mismatch hydrating element <${getProperty$1(elm, 'tagName').toLowerCase()}>: attribute "${attrName}" has different values, expected "${attrValue}" but found "${elmAttrValue}"`, vnode.owner);
         nodesAreCompatible = false;
       }
     }
@@ -6750,7 +6858,7 @@ var LWC = (function (exports) {
     let nodesAreCompatible = true;
     let vnodeClassName;
 
-    if (!isUndefined$1(className) && String(className) !== elm.className) {
+    if (!isUndefined$1(className) && String(className) !== getProperty$1(elm, 'className')) {
       // className is used when class is bound to an expr.
       nodesAreCompatible = false;
       vnodeClassName = className;
@@ -6775,7 +6883,7 @@ var LWC = (function (exports) {
     }
 
     if (!nodesAreCompatible) {
-      logError(`Mismatch hydrating element <${elm.tagName.toLowerCase()}>: attribute "class" has different values, expected "${vnodeClassName}" but found "${elm.className}"`, vnode.owner);
+      logError(`Mismatch hydrating element <${getProperty$1(elm, 'tagName').toLowerCase()}>: attribute "class" has different values, expected "${vnodeClassName}" but found "${getProperty$1(elm, 'className')}"`, vnode.owner);
     }
 
     return nodesAreCompatible;
@@ -6822,7 +6930,7 @@ var LWC = (function (exports) {
 
     if (!nodesAreCompatible) {
       // style is used when class is bound to an expr.
-      logError(`Mismatch hydrating element <${elm.tagName.toLowerCase()}>: attribute "style" has different values, expected "${vnodeStyle}" but found "${elmStyle}".`, vnode.owner);
+      logError(`Mismatch hydrating element <${getProperty$1(elm, 'tagName').toLowerCase()}>: attribute "style" has different values, expected "${vnodeStyle}" but found "${elmStyle}".`, vnode.owner);
     }
 
     return nodesAreCompatible;
@@ -6892,7 +7000,19 @@ var LWC = (function (exports) {
   }
 
   function hydrateVM(vm) {
-    hydrate(vm);
+    if (isTrue(vm.isDirty)) {
+      // manually diffing/patching here.
+      // This routine is:
+      // patchShadowRoot(vm, children);
+      //  -> addVnodes.
+      const children = renderComponent(vm);
+      vm.children = children;
+      const vmChildren = vm.renderMode === 0
+      /* Light */
+      ? getChildNodes$1(vm.elm) : getChildNodes$1(vm.elm.shadowRoot);
+      hydrateChildren(vmChildren, children, vm);
+      runRenderedCallback(vm);
+    }
   } // just in case the component comes back, with this we guarantee re-rendering it
   // while preventing any attempt to rehydration until after reinsertion.
 
@@ -7043,7 +7163,11 @@ var LWC = (function (exports) {
         /* Native */
         ;
       } else if (isNativeShadowDefined$1) {
-        if (def.shadowSupportMode === "any"
+        if (runtimeFlags.DISABLE_MIXED_SHADOW_MODE) {
+          shadowMode = 1
+          /* Synthetic */
+          ;
+        } else if (def.shadowSupportMode === "any"
         /* Any */
         ) {
           shadowMode = 0
@@ -7123,22 +7247,6 @@ var LWC = (function (exports) {
     }
   }
 
-  function hydrate(vm) {
-    if (isTrue(vm.isDirty)) {
-      // manually diffing/patching here.
-      // This routine is:
-      // patchShadowRoot(vm, children);
-      //  -> addVnodes.
-      const children = renderComponent(vm);
-      vm.children = children;
-      const vmChildren = vm.renderMode === 0
-      /* Light */
-      ? vm.elm.childNodes : vm.elm.shadowRoot.childNodes;
-      hydrateChildren(vmChildren, children, vm);
-      runRenderedCallback(vm);
-    }
-  }
-
   function patchShadowRoot(vm, newCh) {
     const {
       renderRoot,
@@ -7158,7 +7266,7 @@ var LWC = (function (exports) {
           , vm);
         }, () => {
           // job
-          patchChildren(renderRoot, oldCh, newCh);
+          patchChildren(oldCh, newCh, renderRoot);
         }, () => {
           // post
           logOperationEnd(2
@@ -7905,7 +8013,7 @@ var LWC = (function (exports) {
     hooksAreSet = true;
     setSanitizeHtmlContentHook(hooks.sanitizeHtmlContent);
   }
-  /* version: 2.9.0 */
+  /* version: 2.10.0 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -7931,6 +8039,7 @@ var LWC = (function (exports) {
   // See also: https://github.com/whatwg/webidl/issues/1027#issuecomment-934510070
 
   const supportsConstructableStyleSheets = isFunction$1(CSSStyleSheet.prototype.replaceSync) && isArray$1(document.adoptedStyleSheets);
+  const supportsMutableAdoptedStyleSheets = supportsConstructableStyleSheets && getOwnPropertyDescriptor$1(document.adoptedStyleSheets, 'length').writable;
   const styleElements = create(null);
   const styleSheets = create(null);
   const nodesToStyleSheets = new WeakMap();
@@ -7974,7 +8083,13 @@ var LWC = (function (exports) {
     }
 
     if (!target.adoptedStyleSheets.includes(styleSheet)) {
-      target.adoptedStyleSheets = [...target.adoptedStyleSheets, styleSheet];
+      if (supportsMutableAdoptedStyleSheets) {
+        // This is only supported in later versions of Chromium:
+        // https://chromestatus.com/feature/5638996492288000
+        target.adoptedStyleSheets.push(styleSheet);
+      } else {
+        target.adoptedStyleSheets = [...target.adoptedStyleSheets, styleSheet];
+      }
     }
   }
 
@@ -8276,6 +8391,156 @@ var LWC = (function (exports) {
   setSetText(setText);
   setSsr(ssr);
   setAddEventListener(addEventListener);
+  /*
+   * Copyright (c) 2018, salesforce.com, inc.
+   * All rights reserved.
+   * SPDX-License-Identifier: MIT
+   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+   */
+
+  function resetShadowRootAndLightDom(element, Ctor) {
+    if (element.shadowRoot) {
+      const shadowRoot = element.shadowRoot;
+
+      while (!isNull(shadowRoot.firstChild)) {
+        shadowRoot.removeChild(shadowRoot.firstChild);
+      }
+    }
+
+    if (Ctor.renderMode === 'light') {
+      while (!isNull(element.firstChild)) {
+        element.removeChild(element.firstChild);
+      }
+    }
+  }
+
+  function createVMWithProps(element, Ctor, props) {
+    createVM(element, Ctor, {
+      mode: 'open',
+      owner: null,
+      tagName: element.tagName.toLowerCase()
+    });
+
+    for (const [key, value] of Object.entries(props)) {
+      element[key] = value;
+    }
+  }
+
+  function hydrateComponent(element, Ctor, props = {}) {
+    if (!(element instanceof Element)) {
+      throw new TypeError(`"hydrateComponent" expects a valid DOM element as the first parameter but instead received ${element}.`);
+    }
+
+    if (!isFunction$1(Ctor)) {
+      throw new TypeError(`"hydrateComponent" expects a valid component constructor as the second parameter but instead received ${Ctor}.`);
+    }
+
+    if (!isObject(props) || isNull(props)) {
+      throw new TypeError(`"hydrateComponent" expects an object as the third parameter but instead received ${props}.`);
+    }
+
+    if (getAssociatedVMIfPresent(element)) {
+      /* eslint-disable-next-line no-console */
+      console.warn(`"hydrateComponent" expects an element that is not hydrated.`, element);
+      return;
+    }
+
+    try {
+      // Let the renderer know we are hydrating, so it does not replace the existing shadowRoot
+      // and uses the same algo to create the stylesheets as in SSR.
+      setIsHydrating(true);
+      createVMWithProps(element, Ctor, props);
+      hydrateRootElement(element); // set it back since now we finished hydration.
+
+      setIsHydrating(false);
+    } catch (e) {
+      // Fallback: In case there's an error while hydrating, let's log the error, and replace the element content
+      //           with the client generated DOM.
+
+      /* eslint-disable-next-line no-console */
+      console.error('Recovering from error while hydrating: ', e); // We want to preserve the element, so we need to reset the shadowRoot and light dom.
+
+      resetShadowRootAndLightDom(element, Ctor); // we need to recreate the vm with the hydration flag on, so it re-uses the existing shadowRoot.
+
+      createVMWithProps(element, Ctor, props);
+      setIsHydrating(false);
+      connectRootElement(element);
+    } finally {
+      // in case there's an error during recovery
+      setIsHydrating(false);
+    }
+  }
+  /*
+   * Copyright (c) 2018, salesforce.com, inc.
+   * All rights reserved.
+   * SPDX-License-Identifier: MIT
+   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+   */
+
+  /**
+   * This function builds a Web Component class from a LWC constructor so it can be
+   * registered as a new element via customElements.define() at any given time.
+   *
+   * @deprecated since version 1.3.11
+   *
+   * @example
+   * ```
+   * import { buildCustomElementConstructor } from 'lwc';
+   * import Foo from 'ns/foo';
+   * const WC = buildCustomElementConstructor(Foo);
+   * customElements.define('x-foo', WC);
+   * const elm = document.createElement('x-foo');
+   * ```
+   */
+
+
+  function deprecatedBuildCustomElementConstructor(Ctor) {
+    if (process.env.NODE_ENV !== 'production') {
+      /* eslint-disable-next-line no-console */
+      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.`);
+    }
+
+    return Ctor.CustomElementConstructor;
+  } // Note: WeakSet is not supported in IE11, and the polyfill is not performant enough.
+  //       This WeakSet usage is valid because this functionality is not meant to run in IE11.
+
+
+  const hydratedCustomElements = new WeakSet();
+
+  function buildCustomElementConstructor(Ctor) {
+    const HtmlPrototype = getComponentHtmlPrototype(Ctor);
+    return class extends HtmlPrototype {
+      constructor() {
+        super();
+
+        if (this.isConnected) {
+          // this if block is hit when there's already an un-upgraded element in the DOM with the same tag name.
+          hydrateComponent(this, Ctor, {});
+          hydratedCustomElements.add(this);
+        } else {
+          createVM(this, Ctor, {
+            mode: 'open',
+            owner: null,
+            tagName: this.tagName
+          });
+        }
+      }
+
+      connectedCallback() {
+        if (hydratedCustomElements.has(this)) {
+          // This is an un-upgraded element that was hydrated in the constructor.
+          hydratedCustomElements.delete(this);
+        } else {
+          connectRootElement(this);
+        }
+      }
+
+      disconnectedCallback() {
+        disconnectRootElement(this);
+      }
+
+    };
+  }
   /*
    * Copyright (c) 2018, salesforce.com, inc.
    * All rights reserved.
@@ -8285,6 +8550,7 @@ var LWC = (function (exports) {
   // TODO [#2472]: Remove this workaround when appropriate.
   // eslint-disable-next-line lwc-internal/no-global-node
 
+
   const _Node$1 = Node;
   const ConnectingSlot = new WeakMap();
   const DisconnectingSlot = new WeakMap();
@@ -8393,118 +8659,6 @@ var LWC = (function (exports) {
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
 
-
-  function hydrateComponent(element, Ctor, props = {}) {
-    if (!(element instanceof Element)) {
-      throw new TypeError(`"hydrateComponent" expects a valid DOM element as the first parameter but instead received ${element}.`);
-    }
-
-    if (!isFunction$1(Ctor)) {
-      throw new TypeError(`"hydrateComponent" expects a valid component constructor as the second parameter but instead received ${Ctor}.`);
-    }
-
-    if (!isObject(props) || isNull(props)) {
-      throw new TypeError(`"hydrateComponent" expects an object as the third parameter but instead received ${props}.`);
-    }
-
-    try {
-      // Let the renderer know we are hydrating, so it does not replace the existing shadowRoot
-      // and uses the same algo to create the stylesheets as in SSR.
-      setIsHydrating(true);
-      createVM(element, Ctor, {
-        mode: 'open',
-        owner: null,
-        tagName: element.tagName.toLowerCase()
-      });
-
-      for (const [key, value] of Object.entries(props)) {
-        element[key] = value;
-      }
-
-      hydrateRootElement(element); // set it back since now we finished hydration.
-
-      setIsHydrating(false);
-    } catch (e) {
-      // Fallback: In case there's an error while hydrating, let's log the error, and replace the element with
-      //           the client generated DOM.
-
-      /* eslint-disable-next-line no-console */
-      console.error('Recovering from error while hydrating: ', e);
-      setIsHydrating(false);
-      const newElem = createElement(element.tagName, {
-        is: Ctor,
-        mode: 'open'
-      });
-
-      for (const [key, value] of Object.entries(props)) {
-        newElem[key] = value;
-      }
-
-      element.parentNode.replaceChild(newElem, element);
-    }
-  }
-  /*
-   * Copyright (c) 2018, salesforce.com, inc.
-   * All rights reserved.
-   * SPDX-License-Identifier: MIT
-   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
-   */
-
-  /**
-   * This function builds a Web Component class from a LWC constructor so it can be
-   * registered as a new element via customElements.define() at any given time.
-   *
-   * @deprecated since version 1.3.11
-   *
-   * @example
-   * ```
-   * import { buildCustomElementConstructor } from 'lwc';
-   * import Foo from 'ns/foo';
-   * const WC = buildCustomElementConstructor(Foo);
-   * customElements.define('x-foo', WC);
-   * const elm = document.createElement('x-foo');
-   * ```
-   */
-
-
-  function deprecatedBuildCustomElementConstructor(Ctor) {
-    if (process.env.NODE_ENV !== 'production') {
-      /* eslint-disable-next-line no-console */
-      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.`);
-    }
-
-    return Ctor.CustomElementConstructor;
-  }
-
-  function buildCustomElementConstructor(Ctor) {
-    const HtmlPrototype = getComponentHtmlPrototype(Ctor);
-    return class extends HtmlPrototype {
-      constructor() {
-        super();
-        createVM(this, Ctor, {
-          mode: 'open',
-          owner: null,
-          tagName: this.tagName
-        });
-      }
-
-      connectedCallback() {
-        connectRootElement(this);
-      }
-
-      disconnectedCallback() {
-        disconnectRootElement(this);
-      }
-
-    };
-  }
-  /*
-   * Copyright (c) 2018, salesforce.com, inc.
-   * All rights reserved.
-   * SPDX-License-Identifier: MIT
-   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
-   */
-
   /**
    * EXPERIMENTAL: This function provides access to the component constructor, given an HTMLElement.
    * This API is subject to change or being removed.
@@ -8605,7 +8759,7 @@ var LWC = (function (exports) {
   });
   freeze(LightningElement);
   seal(LightningElement.prototype);
-  /* version: 2.9.0 */
+  /* version: 2.10.0 */
 
   exports.LightningElement = LightningElement;
   exports.__unstable__ProfilerControl = profilerControl;