lwc 2.7.2 → 2.7.3

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

@@ -302,7 +302,7 @@ var LWC = (function (exports) {
     CACHED_PROPERTY_ATTRIBUTE_MAPPING.set(propName, attributeName);
     return attributeName;
   }
-  /** version: 2.7.2 */
+  /** version: 2.7.3 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -480,7 +480,7 @@ var LWC = (function (exports) {
       setFeatureFlag(name, value);
     }
   }
-  /** version: 2.7.2 */
+  /** version: 2.7.3 */
 
   /* proxy-compat-disable */
 
@@ -1014,62 +1014,205 @@ var LWC = (function (exports) {
    */
 
 
-  function handleEvent(event, vnode) {
-    const {
-      type
-    } = event;
-    const {
-      data: {
-        on
-      }
-    } = vnode;
-    const handler = on && on[type]; // call event handler if exists
+  function isUndef(s) {
+    return s === undefined;
+  }
+
+  function sameVnode(vnode1, vnode2) {
+    return vnode1.key === vnode2.key && vnode1.sel === vnode2.sel;
+  }
+
+  function isVNode(vnode) {
+    return vnode != null;
+  }
+
+  function createKeyToOldIdx(children, beginIdx, endIdx) {
+    const map = {};
+    let j, key, ch; // TODO [#1637]: simplify this by assuming that all vnodes has keys
+
+    for (j = beginIdx; j <= endIdx; ++j) {
+      ch = children[j];
 
-    if (handler) {
-      handler.call(undefined, event);
+      if (isVNode(ch)) {
+        key = ch.key;
+
+        if (key !== undefined) {
+          map[key] = j;
+        }
+      }
     }
+
+    return map;
   }
 
-  function createListener() {
-    return function handler(event) {
-      handleEvent(event, handler.vnode);
-    };
+  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 updateAllEventListeners(oldVnode, vnode) {
-    if (isUndefined$1(oldVnode.listener)) {
-      createAllEventListeners(vnode);
-    } else {
-      vnode.listener = oldVnode.listener;
-      vnode.listener.vnode = vnode;
+  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 createAllEventListeners(vnode) {
-    const {
-      elm,
-      data: {
-        on
+  function updateDynamicChildren(parentElm, oldCh, newCh) {
+    let oldStartIdx = 0;
+    let newStartIdx = 0;
+    let oldEndIdx = oldCh.length - 1;
+    let oldStartVnode = oldCh[0];
+    let oldEndVnode = oldCh[oldEndIdx];
+    const newChEnd = newCh.length - 1;
+    let newEndIdx = newChEnd;
+    let newStartVnode = newCh[0];
+    let newEndVnode = newCh[newEndIdx];
+    let oldKeyToIdx;
+    let idxInOld;
+    let elmToMove;
+    let before;
+
+    while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
+      if (!isVNode(oldStartVnode)) {
+        oldStartVnode = oldCh[++oldStartIdx]; // Vnode might have been moved left
+      } else if (!isVNode(oldEndVnode)) {
+        oldEndVnode = oldCh[--oldEndIdx];
+      } else if (!isVNode(newStartVnode)) {
+        newStartVnode = newCh[++newStartIdx];
+      } else if (!isVNode(newEndVnode)) {
+        newEndVnode = newCh[--newEndIdx];
+      } else if (sameVnode(oldStartVnode, newStartVnode)) {
+        patchVnode(oldStartVnode, newStartVnode);
+        oldStartVnode = oldCh[++oldStartIdx];
+        newStartVnode = newCh[++newStartIdx];
+      } else if (sameVnode(oldEndVnode, newEndVnode)) {
+        patchVnode(oldEndVnode, newEndVnode);
+        oldEndVnode = oldCh[--oldEndIdx];
+        newEndVnode = newCh[--newEndIdx];
+      } else if (sameVnode(oldStartVnode, newEndVnode)) {
+        // Vnode moved right
+        patchVnode(oldStartVnode, newEndVnode);
+        newEndVnode.hook.move(oldStartVnode, parentElm, nextSibling$1(oldEndVnode.elm));
+        oldStartVnode = oldCh[++oldStartIdx];
+        newEndVnode = newCh[--newEndIdx];
+      } else if (sameVnode(oldEndVnode, newStartVnode)) {
+        // Vnode moved left
+        patchVnode(oldEndVnode, newStartVnode);
+        newStartVnode.hook.move(oldEndVnode, parentElm, oldStartVnode.elm);
+        oldEndVnode = oldCh[--oldEndIdx];
+        newStartVnode = newCh[++newStartIdx];
+      } else {
+        if (oldKeyToIdx === undefined) {
+          oldKeyToIdx = createKeyToOldIdx(oldCh, oldStartIdx, oldEndIdx);
+        }
+
+        idxInOld = oldKeyToIdx[newStartVnode.key];
+
+        if (isUndef(idxInOld)) {
+          // New element
+          newStartVnode.hook.create(newStartVnode);
+          newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm);
+          newStartVnode = newCh[++newStartIdx];
+        } else {
+          elmToMove = oldCh[idxInOld];
+
+          if (isVNode(elmToMove)) {
+            if (elmToMove.sel !== newStartVnode.sel) {
+              // New element
+              newStartVnode.hook.create(newStartVnode);
+              newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm);
+            } else {
+              patchVnode(elmToMove, newStartVnode);
+              oldCh[idxInOld] = undefined;
+              newStartVnode.hook.move(elmToMove, parentElm, oldStartVnode.elm);
+            }
+          }
+
+          newStartVnode = newCh[++newStartIdx];
+        }
       }
-    } = vnode;
+    }
 
-    if (isUndefined$1(on)) {
+    if (oldStartIdx <= oldEndIdx || newStartIdx <= newEndIdx) {
+      if (oldStartIdx > oldEndIdx) {
+        // There's some cases in which the sub array of vnodes to be inserted is followed by null(s) and an
+        // already processed vnode, in such cases the vnodes to be inserted should be before that processed vnode.
+        let i = newEndIdx;
+        let n;
+
+        do {
+          n = newCh[++i];
+        } while (!isVNode(n) && i < newChEnd);
+
+        before = isVNode(n) ? n.elm : null;
+        addVnodes(parentElm, before, newCh, newStartIdx, newEndIdx);
+      } else {
+        removeVnodes(parentElm, oldCh, oldStartIdx, oldEndIdx);
+      }
+    }
+  }
+
+  function updateStaticChildren(parentElm, oldCh, newCh) {
+    const oldChLength = oldCh.length;
+    const newChLength = newCh.length;
+
+    if (oldChLength === 0) {
+      // the old list is empty, we can directly insert anything new
+      addVnodes(parentElm, null, newCh, 0, newChLength);
       return;
     }
 
-    const listener = vnode.listener = createListener();
-    listener.vnode = vnode;
-    let name;
+    if (newChLength === 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);
+      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;
+
+    for (let i = newChLength - 1; i >= 0; i -= 1) {
+      const vnode = newCh[i];
+      const oldVNode = oldCh[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;
+          } else {
+            // removing the old vnode since the new one is null
+            oldVNode.hook.remove(oldVNode, parentElm);
+          }
+        } else if (isVNode(vnode)) {
+          // this condition is unnecessary
+          vnode.hook.create(vnode); // insert the new node one since the old one is null
 
-    for (name in on) {
-      addEventListener$1(elm, name, listener);
+          vnode.hook.insert(vnode, parentElm, referenceElm);
+          referenceElm = vnode.elm;
+        }
+      }
     }
   }
 
-  var modEvents = {
-    update: updateAllEventListeners,
-    create: createAllEventListeners
-  };
+  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.
@@ -1077,6 +1220,7 @@ var LWC = (function (exports) {
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
 
+
   const defaultDefHTMLPropertyNames = ['accessKey', 'dir', 'draggable', 'hidden', 'id', 'lang', 'spellcheck', 'tabIndex', 'title'];
 
   function offsetPropertyErrorMessage(name) {
@@ -1196,313 +1340,379 @@ var LWC = (function (exports) {
    */
 
 
-  const xlinkNS = 'http://www.w3.org/1999/xlink';
-  const xmlNS = 'http://www.w3.org/XML/1998/namespace';
-  const ColonCharCode = 58;
-
-  function updateAttrs(oldVnode, vnode) {
-    const {
-      data: {
-        attrs
-      }
-    } = vnode;
+  function generateDataDescriptor(options) {
+    return assign({
+      configurable: true,
+      enumerable: true,
+      writable: true
+    }, options);
+  }
 
-    if (isUndefined$1(attrs)) {
-      return;
-    }
+  function generateAccessorDescriptor(options) {
+    return assign({
+      configurable: true,
+      enumerable: true
+    }, options);
+  }
 
-    let {
-      data: {
-        attrs: oldAttrs
-      }
-    } = oldVnode;
+  let isDomMutationAllowed = false;
 
-    if (oldAttrs === attrs) {
-      return;
+  function unlockDomMutation() {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
     }
 
-    if (process.env.NODE_ENV !== 'production') {
-      assert.invariant(isUndefined$1(oldAttrs) || keys(oldAttrs).join(',') === keys(attrs).join(','), `vnode.data.attrs cannot change shape.`);
+    isDomMutationAllowed = true;
+  }
+
+  function lockDomMutation() {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
     }
 
-    const elm = vnode.elm;
-    let key;
-    oldAttrs = isUndefined$1(oldAttrs) ? EmptyObject : oldAttrs; // update modified attributes, add new attributes
-    // this routine is only useful for data-* attributes in all kind of elements
-    // and aria-* in standard elements (custom elements will use props for these)
+    isDomMutationAllowed = false;
+  }
 
-    for (key in attrs) {
-      const cur = attrs[key];
-      const old = oldAttrs[key];
+  function logMissingPortalError(name, type) {
+    return logError(`The \`${name}\` ${type} is available only on elements that use the \`lwc:dom="manual"\` directive.`);
+  }
 
-      if (old !== cur) {
-        unlockAttribute(elm, key);
+  function patchElementWithRestrictions(elm, options) {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
+    }
 
-        if (StringCharCodeAt.call(key, 3) === ColonCharCode) {
-          // Assume xml namespace
-          setAttribute$1(elm, key, cur, xmlNS);
-        } else if (StringCharCodeAt.call(key, 5) === ColonCharCode) {
-          // Assume xlink namespace
-          setAttribute$1(elm, key, cur, xlinkNS);
-        } else if (isNull(cur) || isUndefined$1(cur)) {
-          removeAttribute$1(elm, key);
-        } else {
-          setAttribute$1(elm, key, cur);
+    const originalOuterHTMLDescriptor = getPropertyDescriptor(elm, 'outerHTML');
+    const descriptors = {
+      outerHTML: generateAccessorDescriptor({
+        get() {
+          return originalOuterHTMLDescriptor.get.call(this);
+        },
+
+        set(_value) {
+          throw new TypeError(`Invalid attempt to set outerHTML on Element.`);
         }
 
-        lockAttribute();
-      }
-    }
-  }
+      })
+    }; // Apply extra restriction related to DOM manipulation if the element is not a portal.
 
-  const emptyVNode$3 = {
-    data: {}
-  };
-  var modAttrs = {
-    create: vnode => updateAttrs(emptyVNode$3, vnode),
-    update: updateAttrs
-  };
-  /*
-   * 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
-   */
+    if (!options.isLight && !options.isPortal) {
+      const {
+        appendChild,
+        insertBefore,
+        removeChild,
+        replaceChild
+      } = elm;
+      const originalNodeValueDescriptor = getPropertyDescriptor(elm, 'nodeValue');
+      const originalInnerHTMLDescriptor = getPropertyDescriptor(elm, 'innerHTML');
+      const originalTextContentDescriptor = getPropertyDescriptor(elm, 'textContent');
+      assign(descriptors, {
+        appendChild: generateDataDescriptor({
+          value(aChild) {
+            logMissingPortalError('appendChild', 'method');
+            return appendChild.call(this, aChild);
+          }
 
-  function isLiveBindingProp(sel, key) {
-    // For properties with live bindings, we read values from the DOM element
-    // instead of relying on internally tracked values.
-    return sel === 'input' && (key === 'value' || key === 'checked');
-  }
+        }),
+        insertBefore: generateDataDescriptor({
+          value(newNode, referenceNode) {
+            if (!isDomMutationAllowed) {
+              logMissingPortalError('insertBefore', 'method');
+            }
 
-  function update(oldVnode, vnode) {
-    const props = vnode.data.props;
+            return insertBefore.call(this, newNode, referenceNode);
+          }
 
-    if (isUndefined$1(props)) {
-      return;
-    }
+        }),
+        removeChild: generateDataDescriptor({
+          value(aChild) {
+            if (!isDomMutationAllowed) {
+              logMissingPortalError('removeChild', 'method');
+            }
 
-    const oldProps = oldVnode.data.props;
+            return removeChild.call(this, aChild);
+          }
 
-    if (oldProps === props) {
-      return;
-    }
+        }),
+        replaceChild: generateDataDescriptor({
+          value(newChild, oldChild) {
+            logMissingPortalError('replaceChild', 'method');
+            return replaceChild.call(this, newChild, oldChild);
+          }
 
-    if (process.env.NODE_ENV !== 'production') {
-      assert.invariant(isUndefined$1(oldProps) || keys(oldProps).join(',') === keys(props).join(','), 'vnode.data.props cannot change shape.');
-    }
+        }),
+        nodeValue: generateAccessorDescriptor({
+          get() {
+            return originalNodeValueDescriptor.get.call(this);
+          },
 
-    const isFirstPatch = isUndefined$1(oldProps);
-    const {
-      elm,
-      sel
-    } = vnode;
+          set(value) {
+            if (!isDomMutationAllowed) {
+              logMissingPortalError('nodeValue', 'property');
+            }
 
-    for (const key in props) {
-      const cur = props[key]; // if it is the first time this element is patched, or the current value is different to the previous value...
+            originalNodeValueDescriptor.set.call(this, value);
+          }
 
-      if (isFirstPatch || cur !== (isLiveBindingProp(sel, key) ? getProperty$1(elm, key) : oldProps[key])) {
-        setProperty$1(elm, key, cur);
-      }
-    }
-  }
+        }),
+        textContent: generateAccessorDescriptor({
+          get() {
+            return originalTextContentDescriptor.get.call(this);
+          },
 
-  const emptyVNode$2 = {
-    data: {}
-  };
-  var modProps = {
-    create: vnode => update(emptyVNode$2, vnode),
-    update
-  };
-  /*
-   * 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
-   */
+          set(value) {
+            logMissingPortalError('textContent', 'property');
+            originalTextContentDescriptor.set.call(this, value);
+          }
 
-  const classNameToClassMap = create(null);
+        }),
+        innerHTML: generateAccessorDescriptor({
+          get() {
+            return originalInnerHTMLDescriptor.get.call(this);
+          },
 
-  function getMapFromClassName(className) {
-    // Intentionally using == to match undefined and null values from computed style attribute
-    if (className == null) {
-      return EmptyObject;
-    } // computed class names must be string
+          set(value) {
+            logMissingPortalError('innerHTML', 'property');
+            return originalInnerHTMLDescriptor.set.call(this, value);
+          }
 
+        })
+      });
+    }
 
-    className = isString(className) ? className : className + '';
-    let map = classNameToClassMap[className];
+    defineProperties(elm, descriptors);
+  }
 
-    if (map) {
-      return map;
-    }
+  function getShadowRootRestrictionsDescriptors(sr) {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
+    } // Disallowing properties in dev mode only to avoid people doing the wrong
+    // thing when using the real shadow root, because if that's the case,
+    // the component will not work when running with synthetic shadow.
 
-    map = create(null);
-    let start = 0;
-    let o;
-    const len = className.length;
 
-    for (o = 0; o < len; o++) {
-      if (StringCharCodeAt.call(className, o) === SPACE_CHAR) {
-        if (o > start) {
-          map[StringSlice.call(className, start, o)] = true;
+    const originalAddEventListener = sr.addEventListener;
+    const originalInnerHTMLDescriptor = getPropertyDescriptor(sr, 'innerHTML');
+    const originalTextContentDescriptor = getPropertyDescriptor(sr, 'textContent');
+    return {
+      innerHTML: generateAccessorDescriptor({
+        get() {
+          return originalInnerHTMLDescriptor.get.call(this);
+        },
+
+        set(_value) {
+          throw new TypeError(`Invalid attempt to set innerHTML on ShadowRoot.`);
         }
 
-        start = o + 1;
-      }
-    }
+      }),
+      textContent: generateAccessorDescriptor({
+        get() {
+          return originalTextContentDescriptor.get.call(this);
+        },
 
-    if (o > start) {
-      map[StringSlice.call(className, start, o)] = true;
-    }
+        set(_value) {
+          throw new TypeError(`Invalid attempt to set textContent on ShadowRoot.`);
+        }
 
-    classNameToClassMap[className] = map;
+      }),
+      addEventListener: generateDataDescriptor({
+        value(type, listener, options) {
+          // TODO [#420]: this is triggered when the component author attempts to add a listener
+          // programmatically into its Component's shadow root
+          if (!isUndefined$1(options)) {
+            logError('The `addEventListener` method on ShadowRoot does not support any options.', getAssociatedVMIfPresent(this));
+          } // Typescript does not like it when you treat the `arguments` object as an array
+          // @ts-ignore type-mismatch
 
-    if (process.env.NODE_ENV !== 'production') {
-      // just to make sure that this object never changes as part of the diffing algo
-      freeze(map);
-    }
 
-    return map;
-  }
+          return originalAddEventListener.apply(this, arguments);
+        }
 
-  function updateClassAttribute(oldVnode, vnode) {
-    const {
-      elm,
-      data: {
-        className: newClass
-      }
-    } = vnode;
-    const {
-      data: {
-        className: oldClass
-      }
-    } = oldVnode;
+      })
+    };
+  } // Custom Elements Restrictions:
+  // -----------------------------
 
-    if (oldClass === newClass) {
-      return;
+
+  function getCustomElementRestrictionsDescriptors(elm) {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
     }
 
-    const classList = getClassList$1(elm);
-    const newClassMap = getMapFromClassName(newClass);
-    const oldClassMap = getMapFromClassName(oldClass);
-    let name;
+    const originalAddEventListener = elm.addEventListener;
+    const originalInnerHTMLDescriptor = getPropertyDescriptor(elm, 'innerHTML');
+    const originalOuterHTMLDescriptor = getPropertyDescriptor(elm, 'outerHTML');
+    const originalTextContentDescriptor = getPropertyDescriptor(elm, 'textContent');
+    return {
+      innerHTML: generateAccessorDescriptor({
+        get() {
+          return originalInnerHTMLDescriptor.get.call(this);
+        },
 
-    for (name in oldClassMap) {
-      // remove only if it is not in the new class collection and it is not set from within the instance
-      if (isUndefined$1(newClassMap[name])) {
-        classList.remove(name);
-      }
-    }
+        set(_value) {
+          throw new TypeError(`Invalid attempt to set innerHTML on HTMLElement.`);
+        }
 
-    for (name in newClassMap) {
-      if (isUndefined$1(oldClassMap[name])) {
-        classList.add(name);
-      }
-    }
-  }
+      }),
+      outerHTML: generateAccessorDescriptor({
+        get() {
+          return originalOuterHTMLDescriptor.get.call(this);
+        },
 
-  const emptyVNode$1 = {
-    data: {}
-  };
-  var modComputedClassName = {
-    create: vnode => updateClassAttribute(emptyVNode$1, vnode),
-    update: updateClassAttribute
-  };
-  /*
-   * 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
-   */
+        set(_value) {
+          throw new TypeError(`Invalid attempt to set outerHTML on HTMLElement.`);
+        }
 
-  function updateStyleAttribute(oldVnode, vnode) {
-    const {
-      elm,
-      data: {
-        style: newStyle
-      }
-    } = vnode;
+      }),
+      textContent: generateAccessorDescriptor({
+        get() {
+          return originalTextContentDescriptor.get.call(this);
+        },
 
-    if (oldVnode.data.style === newStyle) {
-      return;
-    }
+        set(_value) {
+          throw new TypeError(`Invalid attempt to set textContent on HTMLElement.`);
+        }
 
-    if (!isString(newStyle) || newStyle === '') {
-      removeAttribute$1(elm, 'style');
-    } else {
-      setAttribute$1(elm, 'style', newStyle);
+      }),
+      addEventListener: generateDataDescriptor({
+        value(type, listener, options) {
+          // TODO [#420]: this is triggered when the component author attempts to add a listener
+          // programmatically into a lighting element node
+          if (!isUndefined$1(options)) {
+            logError('The `addEventListener` method in `LightningElement` does not support any options.', getAssociatedVMIfPresent(this));
+          } // Typescript does not like it when you treat the `arguments` object as an array
+          // @ts-ignore type-mismatch
+
+
+          return originalAddEventListener.apply(this, arguments);
+        }
+
+      })
+    };
+  }
+
+  function getComponentRestrictionsDescriptors() {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
     }
+
+    return {
+      tagName: generateAccessorDescriptor({
+        get() {
+          throw new Error(`Usage of property \`tagName\` is disallowed because the component itself does` + ` not know which tagName will be used to create the element, therefore writing` + ` code that check for that value is error prone.`);
+        },
+
+        configurable: true,
+        enumerable: false // no enumerable properties on component
+
+      })
+    };
   }
 
-  const emptyVNode = {
-    data: {}
-  };
-  var modComputedStyle = {
-    create: vnode => updateStyleAttribute(emptyVNode, vnode),
-    update: updateStyleAttribute
-  };
-  /*
-   * 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
-   */
-  // The compiler takes care of transforming the inline classnames into an object. It's faster to set the
-  // different classnames properties individually instead of via a string.
+  function getLightningElementPrototypeRestrictionsDescriptors(proto) {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
+    }
 
-  function createClassAttribute(vnode) {
-    const {
-      elm,
-      data: {
-        classMap
+    const originalDispatchEvent = proto.dispatchEvent;
+    const descriptors = {
+      dispatchEvent: generateDataDescriptor({
+        value(event) {
+          const vm = getAssociatedVM(this);
+
+          if (!isNull(event) && isObject(event)) {
+            const {
+              type
+            } = event;
+
+            if (!/^[a-z][a-z0-9_]*$/.test(type)) {
+              logError(`Invalid event type "${type}" dispatched in element ${getComponentTag(vm)}.` + ` Event name must start with a lowercase letter and followed only lowercase` + ` letters, numbers, and underscores`, vm);
+            }
+          } // Typescript does not like it when you treat the `arguments` object as an array
+          // @ts-ignore type-mismatch
+
+
+          return originalDispatchEvent.apply(this, arguments);
+        }
+
+      })
+    };
+    forEach.call(getOwnPropertyNames$1(globalHTMLProperties), propName => {
+      if (propName in proto) {
+        return; // no need to redefine something that we are already exposing
       }
-    } = vnode;
 
-    if (isUndefined$1(classMap)) {
-      return;
-    }
+      descriptors[propName] = generateAccessorDescriptor({
+        get() {
+          const {
+            error,
+            attribute
+          } = globalHTMLProperties[propName];
+          const msg = [];
+          msg.push(`Accessing the global HTML property "${propName}" is disabled.`);
 
-    const classList = getClassList$1(elm);
+          if (error) {
+            msg.push(error);
+          } else if (attribute) {
+            msg.push(`Instead access it via \`this.getAttribute("${attribute}")\`.`);
+          }
 
-    for (const name in classMap) {
-      classList.add(name);
-    }
+          logError(msg.join('\n'), getAssociatedVM(this));
+        },
+
+        set() {
+          const {
+            readOnly
+          } = globalHTMLProperties[propName];
+
+          if (readOnly) {
+            logError(`The global HTML property \`${propName}\` is read-only.`, getAssociatedVM(this));
+          }
+        }
+
+      });
+    });
+    return descriptors;
+  } // This routine will prevent access to certain properties on a shadow root instance to guarantee
+  // that all components will work fine in IE11 and other browsers without shadow dom support.
+
+
+  function patchShadowRootWithRestrictions(sr) {
+    defineProperties(sr, getShadowRootRestrictionsDescriptors(sr));
   }
 
-  var modStaticClassName = {
-    create: createClassAttribute
-  };
+  function patchCustomElementWithRestrictions(elm) {
+    const restrictionsDescriptors = getCustomElementRestrictionsDescriptors(elm);
+    const elmProto = getPrototypeOf$1(elm);
+    setPrototypeOf(elm, create(elmProto, restrictionsDescriptors));
+  }
+
+  function patchComponentWithRestrictions(cmp) {
+    defineProperties(cmp, getComponentRestrictionsDescriptors());
+  }
+
+  function patchLightningElementPrototypeWithRestrictions(proto) {
+    defineProperties(proto, getLightningElementPrototypeRestrictionsDescriptors(proto));
+  }
   /*
    * 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
    */
-  // The compiler takes care of transforming the inline style into an object. It's faster to set the
-  // different style properties individually instead of via a string.
-
-  function createStyleAttribute(vnode) {
-    const {
-      elm,
-      data: {
-        styleDecls
-      }
-    } = vnode;
-
-    if (isUndefined$1(styleDecls)) {
-      return;
-    }
+  // This is a temporary workaround to get the @lwc/engine-server to evaluate in node without having
+  // to inject at runtime.
 
-    for (let i = 0; i < styleDecls.length; i++) {
-      const [prop, value, important] = styleDecls[i];
-      setCSSStyleProperty$1(elm, prop, value, important);
-    }
-  }
 
-  var modStaticStyle = {
-    create: createStyleAttribute
-  };
+  const HTMLElementConstructor$1 = typeof HTMLElement !== 'undefined' ? HTMLElement : function () {};
+  const HTMLElementPrototype = HTMLElementConstructor$1.prototype;
   /*
    * Copyright (c) 2018, salesforce.com, inc.
    * All rights reserved.
@@ -1510,623 +1720,36 @@ var LWC = (function (exports) {
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
 
-  function isUndef(s) {
-    return s === undefined;
-  }
-
-  function sameVnode(vnode1, vnode2) {
-    return vnode1.key === vnode2.key && vnode1.sel === vnode2.sel;
-  }
-
-  function isVNode(vnode) {
-    return vnode != null;
-  }
-
-  function createKeyToOldIdx(children, beginIdx, endIdx) {
-    const map = {};
-    let j, key, ch; // TODO [#1637]: simplify this by assuming that all vnodes has keys
-
-    for (j = beginIdx; j <= endIdx; ++j) {
-      ch = children[j];
+  /**
+   * This is a descriptor map that contains
+   * all standard properties that a Custom Element can support (including AOM properties), which
+   * determines what kind of capabilities the Base HTML Element and
+   * Base Lightning Element should support.
+   */
 
-      if (isVNode(ch)) {
-        key = ch.key;
+  const HTMLElementOriginalDescriptors = create(null);
+  forEach.call(keys(AriaPropNameToAttrNameMap), propName => {
+    // Note: intentionally using our in-house getPropertyDescriptor instead of getOwnPropertyDescriptor here because
+    // in IE11, some properties are on Element.prototype instead of HTMLElement, just to be sure.
+    const descriptor = getPropertyDescriptor(HTMLElementPrototype, propName);
 
-        if (key !== undefined) {
-          map[key] = j;
-        }
-      }
+    if (!isUndefined$1(descriptor)) {
+      HTMLElementOriginalDescriptors[propName] = descriptor;
     }
+  });
+  forEach.call(defaultDefHTMLPropertyNames, propName => {
+    // Note: intentionally using our in-house getPropertyDescriptor instead of getOwnPropertyDescriptor here because
+    // in IE11, id property is on Element.prototype instead of HTMLElement, and we suspect that more will fall into
+    // this category, so, better to be sure.
+    const descriptor = getPropertyDescriptor(HTMLElementPrototype, propName);
 
-    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);
-      }
+    if (!isUndefined$1(descriptor)) {
+      HTMLElementOriginalDescriptors[propName] = descriptor;
     }
-  }
-
-  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) {
-    let oldStartIdx = 0;
-    let newStartIdx = 0;
-    let oldEndIdx = oldCh.length - 1;
-    let oldStartVnode = oldCh[0];
-    let oldEndVnode = oldCh[oldEndIdx];
-    const newChEnd = newCh.length - 1;
-    let newEndIdx = newChEnd;
-    let newStartVnode = newCh[0];
-    let newEndVnode = newCh[newEndIdx];
-    let oldKeyToIdx;
-    let idxInOld;
-    let elmToMove;
-    let before;
-
-    while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
-      if (!isVNode(oldStartVnode)) {
-        oldStartVnode = oldCh[++oldStartIdx]; // Vnode might have been moved left
-      } else if (!isVNode(oldEndVnode)) {
-        oldEndVnode = oldCh[--oldEndIdx];
-      } else if (!isVNode(newStartVnode)) {
-        newStartVnode = newCh[++newStartIdx];
-      } else if (!isVNode(newEndVnode)) {
-        newEndVnode = newCh[--newEndIdx];
-      } else if (sameVnode(oldStartVnode, newStartVnode)) {
-        patchVnode(oldStartVnode, newStartVnode);
-        oldStartVnode = oldCh[++oldStartIdx];
-        newStartVnode = newCh[++newStartIdx];
-      } else if (sameVnode(oldEndVnode, newEndVnode)) {
-        patchVnode(oldEndVnode, newEndVnode);
-        oldEndVnode = oldCh[--oldEndIdx];
-        newEndVnode = newCh[--newEndIdx];
-      } else if (sameVnode(oldStartVnode, newEndVnode)) {
-        // Vnode moved right
-        patchVnode(oldStartVnode, newEndVnode);
-        newEndVnode.hook.move(oldStartVnode, parentElm, nextSibling$1(oldEndVnode.elm));
-        oldStartVnode = oldCh[++oldStartIdx];
-        newEndVnode = newCh[--newEndIdx];
-      } else if (sameVnode(oldEndVnode, newStartVnode)) {
-        // Vnode moved left
-        patchVnode(oldEndVnode, newStartVnode);
-        newStartVnode.hook.move(oldEndVnode, parentElm, oldStartVnode.elm);
-        oldEndVnode = oldCh[--oldEndIdx];
-        newStartVnode = newCh[++newStartIdx];
-      } else {
-        if (oldKeyToIdx === undefined) {
-          oldKeyToIdx = createKeyToOldIdx(oldCh, oldStartIdx, oldEndIdx);
-        }
-
-        idxInOld = oldKeyToIdx[newStartVnode.key];
-
-        if (isUndef(idxInOld)) {
-          // New element
-          newStartVnode.hook.create(newStartVnode);
-          newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm);
-          newStartVnode = newCh[++newStartIdx];
-        } else {
-          elmToMove = oldCh[idxInOld];
-
-          if (isVNode(elmToMove)) {
-            if (elmToMove.sel !== newStartVnode.sel) {
-              // New element
-              newStartVnode.hook.create(newStartVnode);
-              newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm);
-            } else {
-              patchVnode(elmToMove, newStartVnode);
-              oldCh[idxInOld] = undefined;
-              newStartVnode.hook.move(elmToMove, parentElm, oldStartVnode.elm);
-            }
-          }
-
-          newStartVnode = newCh[++newStartIdx];
-        }
-      }
-    }
-
-    if (oldStartIdx <= oldEndIdx || newStartIdx <= newEndIdx) {
-      if (oldStartIdx > oldEndIdx) {
-        // There's some cases in which the sub array of vnodes to be inserted is followed by null(s) and an
-        // already processed vnode, in such cases the vnodes to be inserted should be before that processed vnode.
-        let i = newEndIdx;
-        let n;
-
-        do {
-          n = newCh[++i];
-        } while (!isVNode(n) && i < newChEnd);
-
-        before = isVNode(n) ? n.elm : null;
-        addVnodes(parentElm, before, newCh, newStartIdx, newEndIdx);
-      } else {
-        removeVnodes(parentElm, oldCh, oldStartIdx, oldEndIdx);
-      }
-    }
-  }
-
-  function updateStaticChildren(parentElm, oldCh, newCh) {
-    const oldChLength = oldCh.length;
-    const newChLength = newCh.length;
-
-    if (oldChLength === 0) {
-      // the old list is empty, we can directly insert anything new
-      addVnodes(parentElm, null, newCh, 0, newChLength);
-      return;
-    }
-
-    if (newChLength === 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);
-      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;
-
-    for (let i = newChLength - 1; i >= 0; i -= 1) {
-      const vnode = newCh[i];
-      const oldVNode = oldCh[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;
-          } else {
-            // removing the old vnode since the new one is null
-            oldVNode.hook.remove(oldVNode, parentElm);
-          }
-        } 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;
-        }
-      }
-    }
-  }
-
-  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.
-   * SPDX-License-Identifier: MIT
-   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
-   */
-
-
-  function generateDataDescriptor(options) {
-    return assign({
-      configurable: true,
-      enumerable: true,
-      writable: true
-    }, options);
-  }
-
-  function generateAccessorDescriptor(options) {
-    return assign({
-      configurable: true,
-      enumerable: true
-    }, options);
-  }
-
-  let isDomMutationAllowed = false;
-
-  function unlockDomMutation() {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
-
-    isDomMutationAllowed = true;
-  }
-
-  function lockDomMutation() {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
-
-    isDomMutationAllowed = false;
-  }
-
-  function logMissingPortalError(name, type) {
-    return logError(`The \`${name}\` ${type} is available only on elements that use the \`lwc:dom="manual"\` directive.`);
-  }
-
-  function patchElementWithRestrictions(elm, options) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
-
-    const originalOuterHTMLDescriptor = getPropertyDescriptor(elm, 'outerHTML');
-    const descriptors = {
-      outerHTML: generateAccessorDescriptor({
-        get() {
-          return originalOuterHTMLDescriptor.get.call(this);
-        },
-
-        set(_value) {
-          throw new TypeError(`Invalid attempt to set outerHTML on Element.`);
-        }
-
-      })
-    }; // Apply extra restriction related to DOM manipulation if the element is not a portal.
-
-    if (!options.isLight && !options.isPortal) {
-      const {
-        appendChild,
-        insertBefore,
-        removeChild,
-        replaceChild
-      } = elm;
-      const originalNodeValueDescriptor = getPropertyDescriptor(elm, 'nodeValue');
-      const originalInnerHTMLDescriptor = getPropertyDescriptor(elm, 'innerHTML');
-      const originalTextContentDescriptor = getPropertyDescriptor(elm, 'textContent');
-      assign(descriptors, {
-        appendChild: generateDataDescriptor({
-          value(aChild) {
-            logMissingPortalError('appendChild', 'method');
-            return appendChild.call(this, aChild);
-          }
-
-        }),
-        insertBefore: generateDataDescriptor({
-          value(newNode, referenceNode) {
-            if (!isDomMutationAllowed) {
-              logMissingPortalError('insertBefore', 'method');
-            }
-
-            return insertBefore.call(this, newNode, referenceNode);
-          }
-
-        }),
-        removeChild: generateDataDescriptor({
-          value(aChild) {
-            if (!isDomMutationAllowed) {
-              logMissingPortalError('removeChild', 'method');
-            }
-
-            return removeChild.call(this, aChild);
-          }
-
-        }),
-        replaceChild: generateDataDescriptor({
-          value(newChild, oldChild) {
-            logMissingPortalError('replaceChild', 'method');
-            return replaceChild.call(this, newChild, oldChild);
-          }
-
-        }),
-        nodeValue: generateAccessorDescriptor({
-          get() {
-            return originalNodeValueDescriptor.get.call(this);
-          },
-
-          set(value) {
-            if (!isDomMutationAllowed) {
-              logMissingPortalError('nodeValue', 'property');
-            }
-
-            originalNodeValueDescriptor.set.call(this, value);
-          }
-
-        }),
-        textContent: generateAccessorDescriptor({
-          get() {
-            return originalTextContentDescriptor.get.call(this);
-          },
-
-          set(value) {
-            logMissingPortalError('textContent', 'property');
-            originalTextContentDescriptor.set.call(this, value);
-          }
-
-        }),
-        innerHTML: generateAccessorDescriptor({
-          get() {
-            return originalInnerHTMLDescriptor.get.call(this);
-          },
-
-          set(value) {
-            logMissingPortalError('innerHTML', 'property');
-            return originalInnerHTMLDescriptor.set.call(this, value);
-          }
-
-        })
-      });
-    }
-
-    defineProperties(elm, descriptors);
-  }
-
-  function getShadowRootRestrictionsDescriptors(sr) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    } // Disallowing properties in dev mode only to avoid people doing the wrong
-    // thing when using the real shadow root, because if that's the case,
-    // the component will not work when running with synthetic shadow.
-
-
-    const originalAddEventListener = sr.addEventListener;
-    const originalInnerHTMLDescriptor = getPropertyDescriptor(sr, 'innerHTML');
-    const originalTextContentDescriptor = getPropertyDescriptor(sr, 'textContent');
-    return {
-      innerHTML: generateAccessorDescriptor({
-        get() {
-          return originalInnerHTMLDescriptor.get.call(this);
-        },
-
-        set(_value) {
-          throw new TypeError(`Invalid attempt to set innerHTML on ShadowRoot.`);
-        }
-
-      }),
-      textContent: generateAccessorDescriptor({
-        get() {
-          return originalTextContentDescriptor.get.call(this);
-        },
-
-        set(_value) {
-          throw new TypeError(`Invalid attempt to set textContent on ShadowRoot.`);
-        }
-
-      }),
-      addEventListener: generateDataDescriptor({
-        value(type, listener, options) {
-          // TODO [#420]: this is triggered when the component author attempts to add a listener
-          // programmatically into its Component's shadow root
-          if (!isUndefined$1(options)) {
-            logError('The `addEventListener` method on ShadowRoot does not support any options.', getAssociatedVMIfPresent(this));
-          } // Typescript does not like it when you treat the `arguments` object as an array
-          // @ts-ignore type-mismatch
-
-
-          return originalAddEventListener.apply(this, arguments);
-        }
-
-      })
-    };
-  } // Custom Elements Restrictions:
-  // -----------------------------
-
-
-  function getCustomElementRestrictionsDescriptors(elm) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
-
-    const originalAddEventListener = elm.addEventListener;
-    const originalInnerHTMLDescriptor = getPropertyDescriptor(elm, 'innerHTML');
-    const originalOuterHTMLDescriptor = getPropertyDescriptor(elm, 'outerHTML');
-    const originalTextContentDescriptor = getPropertyDescriptor(elm, 'textContent');
-    return {
-      innerHTML: generateAccessorDescriptor({
-        get() {
-          return originalInnerHTMLDescriptor.get.call(this);
-        },
-
-        set(_value) {
-          throw new TypeError(`Invalid attempt to set innerHTML on HTMLElement.`);
-        }
-
-      }),
-      outerHTML: generateAccessorDescriptor({
-        get() {
-          return originalOuterHTMLDescriptor.get.call(this);
-        },
-
-        set(_value) {
-          throw new TypeError(`Invalid attempt to set outerHTML on HTMLElement.`);
-        }
-
-      }),
-      textContent: generateAccessorDescriptor({
-        get() {
-          return originalTextContentDescriptor.get.call(this);
-        },
-
-        set(_value) {
-          throw new TypeError(`Invalid attempt to set textContent on HTMLElement.`);
-        }
-
-      }),
-      addEventListener: generateDataDescriptor({
-        value(type, listener, options) {
-          // TODO [#420]: this is triggered when the component author attempts to add a listener
-          // programmatically into a lighting element node
-          if (!isUndefined$1(options)) {
-            logError('The `addEventListener` method in `LightningElement` does not support any options.', getAssociatedVMIfPresent(this));
-          } // Typescript does not like it when you treat the `arguments` object as an array
-          // @ts-ignore type-mismatch
-
-
-          return originalAddEventListener.apply(this, arguments);
-        }
-
-      })
-    };
-  }
-
-  function getComponentRestrictionsDescriptors() {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
-
-    return {
-      tagName: generateAccessorDescriptor({
-        get() {
-          throw new Error(`Usage of property \`tagName\` is disallowed because the component itself does` + ` not know which tagName will be used to create the element, therefore writing` + ` code that check for that value is error prone.`);
-        },
-
-        configurable: true,
-        enumerable: false // no enumerable properties on component
-
-      })
-    };
-  }
-
-  function getLightningElementPrototypeRestrictionsDescriptors(proto) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
-
-    const originalDispatchEvent = proto.dispatchEvent;
-    const descriptors = {
-      dispatchEvent: generateDataDescriptor({
-        value(event) {
-          const vm = getAssociatedVM(this);
-
-          if (!isNull(event) && isObject(event)) {
-            const {
-              type
-            } = event;
-
-            if (!/^[a-z][a-z0-9_]*$/.test(type)) {
-              logError(`Invalid event type "${type}" dispatched in element ${getComponentTag(vm)}.` + ` Event name must start with a lowercase letter and followed only lowercase` + ` letters, numbers, and underscores`, vm);
-            }
-          } // Typescript does not like it when you treat the `arguments` object as an array
-          // @ts-ignore type-mismatch
-
-
-          return originalDispatchEvent.apply(this, arguments);
-        }
-
-      })
-    };
-    forEach.call(getOwnPropertyNames$1(globalHTMLProperties), propName => {
-      if (propName in proto) {
-        return; // no need to redefine something that we are already exposing
-      }
-
-      descriptors[propName] = generateAccessorDescriptor({
-        get() {
-          const {
-            error,
-            attribute
-          } = globalHTMLProperties[propName];
-          const msg = [];
-          msg.push(`Accessing the global HTML property "${propName}" is disabled.`);
-
-          if (error) {
-            msg.push(error);
-          } else if (attribute) {
-            msg.push(`Instead access it via \`this.getAttribute("${attribute}")\`.`);
-          }
-
-          logError(msg.join('\n'), getAssociatedVM(this));
-        },
-
-        set() {
-          const {
-            readOnly
-          } = globalHTMLProperties[propName];
-
-          if (readOnly) {
-            logError(`The global HTML property \`${propName}\` is read-only.`, getAssociatedVM(this));
-          }
-        }
-
-      });
-    });
-    return descriptors;
-  } // This routine will prevent access to certain properties on a shadow root instance to guarantee
-  // that all components will work fine in IE11 and other browsers without shadow dom support.
-
-
-  function patchShadowRootWithRestrictions(sr) {
-    defineProperties(sr, getShadowRootRestrictionsDescriptors(sr));
-  }
-
-  function patchCustomElementWithRestrictions(elm) {
-    const restrictionsDescriptors = getCustomElementRestrictionsDescriptors(elm);
-    const elmProto = getPrototypeOf$1(elm);
-    setPrototypeOf(elm, create(elmProto, restrictionsDescriptors));
-  }
-
-  function patchComponentWithRestrictions(cmp) {
-    defineProperties(cmp, getComponentRestrictionsDescriptors());
-  }
-
-  function patchLightningElementPrototypeWithRestrictions(proto) {
-    defineProperties(proto, getLightningElementPrototypeRestrictionsDescriptors(proto));
-  }
-  /*
-   * 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 is a temporary workaround to get the @lwc/engine-server to evaluate in node without having
-  // to inject at runtime.
-
-
-  const HTMLElementConstructor$1 = typeof HTMLElement !== 'undefined' ? HTMLElement : function () {};
-  const HTMLElementPrototype = HTMLElementConstructor$1.prototype;
-  /*
-   * 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 is a descriptor map that contains
-   * all standard properties that a Custom Element can support (including AOM properties), which
-   * determines what kind of capabilities the Base HTML Element and
-   * Base Lightning Element should support.
-   */
-
-  const HTMLElementOriginalDescriptors = create(null);
-  forEach.call(keys(AriaPropNameToAttrNameMap), propName => {
-    // Note: intentionally using our in-house getPropertyDescriptor instead of getOwnPropertyDescriptor here because
-    // in IE11, some properties are on Element.prototype instead of HTMLElement, just to be sure.
-    const descriptor = getPropertyDescriptor(HTMLElementPrototype, propName);
-
-    if (!isUndefined$1(descriptor)) {
-      HTMLElementOriginalDescriptors[propName] = descriptor;
-    }
-  });
-  forEach.call(defaultDefHTMLPropertyNames, propName => {
-    // Note: intentionally using our in-house getPropertyDescriptor instead of getOwnPropertyDescriptor here because
-    // in IE11, id property is on Element.prototype instead of HTMLElement, and we suspect that more will fall into
-    // this category, so, better to be sure.
-    const descriptor = getPropertyDescriptor(HTMLElementPrototype, propName);
-
-    if (!isUndefined$1(descriptor)) {
-      HTMLElementOriginalDescriptors[propName] = descriptor;
-    }
-  });
-  /**
-   * Copyright (C) 2017 salesforce.com, inc.
-   */
+  });
+  /**
+   * Copyright (C) 2017 salesforce.com, inc.
+   */
 
   const {
     isArray
@@ -3306,97 +2929,333 @@ var LWC = (function (exports) {
           warnIfInvokedDuringConstruction(vm, childGetter);
         }
 
-        return getChildGetter(childGetter)(elm);
-      },
-
-      configurable: true,
-      enumerable: true
-    };
-  }
+        return getChildGetter(childGetter)(elm);
+      },
+
+      configurable: true,
+      enumerable: true
+    };
+  }
+
+  const queryMethods = ['getElementsByClassName', 'getElementsByTagName', 'querySelector', 'querySelectorAll'];
+
+  function getQueryMethod(methodName) {
+    switch (methodName) {
+      case 'getElementsByClassName':
+        return getElementsByClassName$1;
+
+      case 'getElementsByTagName':
+        return getElementsByTagName$1;
+
+      case 'querySelector':
+        return querySelector$1;
+
+      case 'querySelectorAll':
+        return querySelectorAll$1;
+    }
+  } // Generic passthrough for query APIs on HTMLElement to the relevant Renderer APIs
+
+
+  for (const queryMethod of queryMethods) {
+    queryAndChildGetterDescriptors[queryMethod] = {
+      value(arg) {
+        const vm = getAssociatedVM(this);
+        const {
+          elm
+        } = vm;
+
+        if (process.env.NODE_ENV !== 'production') {
+          warnIfInvokedDuringConstruction(vm, `${queryMethod}()`);
+        }
+
+        return getQueryMethod(queryMethod)(elm, arg);
+      },
+
+      configurable: true,
+      enumerable: true,
+      writable: true
+    };
+  }
+
+  defineProperties(LightningElement.prototype, queryAndChildGetterDescriptors);
+  const lightningBasedDescriptors = create(null);
+
+  for (const propName in HTMLElementOriginalDescriptors) {
+    lightningBasedDescriptors[propName] = createBridgeToElementDescriptor(propName, HTMLElementOriginalDescriptors[propName]);
+  }
+
+  defineProperties(LightningElement.prototype, lightningBasedDescriptors);
+  defineProperty(LightningElement, 'CustomElementConstructor', {
+    get() {
+      // If required, a runtime-specific implementation must be defined.
+      throw new ReferenceError('The current runtime does not support CustomElementConstructor.');
+    },
+
+    configurable: true
+  });
+
+  if (process.env.NODE_ENV !== 'production') {
+    patchLightningElementPrototypeWithRestrictions(LightningElement.prototype);
+  }
+  /*
+   * 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
+   */
+
+  /**
+   * @wire decorator to wire fields and methods to a wire adapter in
+   * LWC Components. This function implements the internals of this
+   * decorator.
+   */
+
+
+  function wire(_adapter, _config) {
+    if (process.env.NODE_ENV !== 'production') {
+      assert.fail('@wire(adapter, config?) may only be used as a decorator.');
+    }
+
+    throw new Error();
+  }
+
+  function internalWireFieldDecorator(key) {
+    return {
+      get() {
+        const vm = getAssociatedVM(this);
+        componentValueObserved(vm, key);
+        return vm.cmpFields[key];
+      },
+
+      set(value) {
+        const vm = getAssociatedVM(this);
+        /**
+         * Reactivity for wired fields is provided in wiring.
+         * We intentionally add reactivity here since this is just
+         * letting the author to do the wrong thing, but it will keep our
+         * system to be backward compatible.
+         */
+
+        if (value !== vm.cmpFields[key]) {
+          vm.cmpFields[key] = value;
+          componentValueMutated(vm, key);
+        }
+      },
+
+      enumerable: true,
+      configurable: true
+    };
+  }
+  /*
+   * 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 track(target) {
+    if (arguments.length === 1) {
+      return reactiveMembrane.getProxy(target);
+    }
+
+    if (process.env.NODE_ENV !== 'production') {
+      assert.fail(`@track decorator can only be used with one argument to return a trackable object, or as a decorator function.`);
+    }
+
+    throw new Error();
+  }
+
+  function internalTrackDecorator(key) {
+    return {
+      get() {
+        const vm = getAssociatedVM(this);
+        componentValueObserved(vm, key);
+        return vm.cmpFields[key];
+      },
+
+      set(newValue) {
+        const vm = getAssociatedVM(this);
+
+        if (process.env.NODE_ENV !== 'production') {
+          const vmBeingRendered = getVMBeingRendered();
+          assert.invariant(!isInvokingRender, `${vmBeingRendered}.render() method has side effects on the state of ${vm}.${toString$1(key)}`);
+          assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
+        }
+
+        const reactiveOrAnyValue = reactiveMembrane.getProxy(newValue);
+
+        if (reactiveOrAnyValue !== vm.cmpFields[key]) {
+          vm.cmpFields[key] = reactiveOrAnyValue;
+          componentValueMutated(vm, key);
+        }
+      },
+
+      enumerable: true,
+      configurable: true
+    };
+  }
+  /*
+   * 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 api$1() {
+    if (process.env.NODE_ENV !== 'production') {
+      assert.fail(`@api decorator can only be used as a decorator function.`);
+    }
+
+    throw new Error();
+  }
+
+  function createPublicPropertyDescriptor(key) {
+    return {
+      get() {
+        const vm = getAssociatedVM(this);
+
+        if (isBeingConstructed(vm)) {
+          if (process.env.NODE_ENV !== 'production') {
+            logError(`Can’t read the value of property \`${toString$1(key)}\` from the constructor because the owner component hasn’t set the value yet. Instead, use the constructor to set a default value for the property.`, vm);
+          }
+
+          return;
+        }
+
+        componentValueObserved(vm, key);
+        return vm.cmpProps[key];
+      },
+
+      set(newValue) {
+        const vm = getAssociatedVM(this);
+
+        if (process.env.NODE_ENV !== 'production') {
+          const vmBeingRendered = getVMBeingRendered();
+          assert.invariant(!isInvokingRender, `${vmBeingRendered}.render() method has side effects on the state of ${vm}.${toString$1(key)}`);
+          assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
+        }
+
+        vm.cmpProps[key] = newValue;
+        componentValueMutated(vm, key);
+      },
+
+      enumerable: true,
+      configurable: true
+    };
+  }
+
+  class AccessorReactiveObserver extends ReactiveObserver {
+    constructor(vm, set) {
+      super(() => {
+        if (isFalse(this.debouncing)) {
+          this.debouncing = true;
+          addCallbackToNextTick(() => {
+            if (isTrue(this.debouncing)) {
+              const {
+                value
+              } = this;
+              const {
+                isDirty: dirtyStateBeforeSetterCall,
+                component,
+                idx
+              } = vm;
+              set.call(component, value); // de-bouncing after the call to the original setter to prevent
+              // infinity loop if the setter itself is mutating things that
+              // were accessed during the previous invocation.
+
+              this.debouncing = false;
+
+              if (isTrue(vm.isDirty) && isFalse(dirtyStateBeforeSetterCall) && idx > 0) {
+                // immediate rehydration due to a setter driven mutation, otherwise
+                // the component will get rendered on the second tick, which it is not
+                // desirable.
+                rerenderVM(vm);
+              }
+            }
+          });
+        }
+      });
+      this.debouncing = false;
+    }
+
+    reset(value) {
+      super.reset();
+      this.debouncing = false;
 
-  const queryMethods = ['getElementsByClassName', 'getElementsByTagName', 'querySelector', 'querySelectorAll'];
+      if (arguments.length > 0) {
+        this.value = value;
+      }
+    }
 
-  function getQueryMethod(methodName) {
-    switch (methodName) {
-      case 'getElementsByClassName':
-        return getElementsByClassName$1;
+  }
 
-      case 'getElementsByTagName':
-        return getElementsByTagName$1;
+  function createPublicAccessorDescriptor(key, descriptor) {
+    const {
+      get,
+      set,
+      enumerable,
+      configurable
+    } = descriptor;
 
-      case 'querySelector':
-        return querySelector$1;
+    if (!isFunction$1(get)) {
+      if (process.env.NODE_ENV !== 'production') {
+        assert.invariant(isFunction$1(get), `Invalid compiler output for public accessor ${toString$1(key)} decorated with @api`);
+      }
 
-      case 'querySelectorAll':
-        return querySelectorAll$1;
+      throw new Error();
     }
-  } // Generic passthrough for query APIs on HTMLElement to the relevant Renderer APIs
-
-
-  for (const queryMethod of queryMethods) {
-    queryAndChildGetterDescriptors[queryMethod] = {
-      value(arg) {
-        const vm = getAssociatedVM(this);
-        const {
-          elm
-        } = vm;
 
+    return {
+      get() {
         if (process.env.NODE_ENV !== 'production') {
-          warnIfInvokedDuringConstruction(vm, `${queryMethod}()`);
+          // Assert that the this value is an actual Component with an associated VM.
+          getAssociatedVM(this);
         }
 
-        return getQueryMethod(queryMethod)(elm, arg);
+        return get.call(this);
       },
 
-      configurable: true,
-      enumerable: true,
-      writable: true
-    };
-  }
-
-  defineProperties(LightningElement.prototype, queryAndChildGetterDescriptors);
-  const lightningBasedDescriptors = create(null);
-
-  for (const propName in HTMLElementOriginalDescriptors) {
-    lightningBasedDescriptors[propName] = createBridgeToElementDescriptor(propName, HTMLElementOriginalDescriptors[propName]);
-  }
-
-  defineProperties(LightningElement.prototype, lightningBasedDescriptors);
-  defineProperty(LightningElement, 'CustomElementConstructor', {
-    get() {
-      // If required, a runtime-specific implementation must be defined.
-      throw new ReferenceError('The current runtime does not support CustomElementConstructor.');
-    },
+      set(newValue) {
+        const vm = getAssociatedVM(this);
 
-    configurable: true
-  });
+        if (process.env.NODE_ENV !== 'production') {
+          const vmBeingRendered = getVMBeingRendered();
+          assert.invariant(!isInvokingRender, `${vmBeingRendered}.render() method has side effects on the state of ${vm}.${toString$1(key)}`);
+          assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
+        }
 
-  if (process.env.NODE_ENV !== 'production') {
-    patchLightningElementPrototypeWithRestrictions(LightningElement.prototype);
-  }
-  /*
-   * 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
-   */
+        if (set) {
+          if (runtimeFlags.ENABLE_REACTIVE_SETTER) {
+            let ro = vm.oar[key];
 
-  /**
-   * @wire decorator to wire fields and methods to a wire adapter in
-   * LWC Components. This function implements the internals of this
-   * decorator.
-   */
+            if (isUndefined$1(ro)) {
+              ro = vm.oar[key] = new AccessorReactiveObserver(vm, set);
+            } // every time we invoke this setter from outside (through this wrapper setter)
+            // we should reset the value and then debounce just in case there is a pending
+            // invocation the next tick that is not longer relevant since the value is changing
+            // from outside.
 
 
-  function wire(_adapter, _config) {
-    if (process.env.NODE_ENV !== 'production') {
-      assert.fail('@wire(adapter, config?) may only be used as a decorator.');
-    }
+            ro.reset(newValue);
+            ro.observe(() => {
+              set.call(this, newValue);
+            });
+          } else {
+            set.call(this, newValue);
+          }
+        } else if (process.env.NODE_ENV !== 'production') {
+          assert.fail(`Invalid attempt to set a new value for property ${toString$1(key)} of ${vm} that does not has a setter decorated with @api.`);
+        }
+      },
 
-    throw new Error();
+      enumerable,
+      configurable
+    };
   }
 
-  function internalWireFieldDecorator(key) {
+  function createObservedFieldPropertyDescriptor(key) {
     return {
       get() {
         const vm = getAssociatedVM(this);
@@ -3404,17 +3263,11 @@ var LWC = (function (exports) {
         return vm.cmpFields[key];
       },
 
-      set(value) {
+      set(newValue) {
         const vm = getAssociatedVM(this);
-        /**
-         * Reactivity for wired fields is provided in wiring.
-         * We intentionally add reactivity here since this is just
-         * letting the author to do the wrong thing, but it will keep our
-         * system to be backward compatible.
-         */
 
-        if (value !== vm.cmpFields[key]) {
-          vm.cmpFields[key] = value;
+        if (newValue !== vm.cmpFields[key]) {
+          vm.cmpFields[key] = newValue;
           componentValueMutated(vm, key);
         }
       },
@@ -3431,227 +3284,299 @@ var LWC = (function (exports) {
    */
 
 
-  function track(target) {
-    if (arguments.length === 1) {
-      return reactiveMembrane.getProxy(target);
-    }
+  function getClassDescriptorType(descriptor) {
+    if (isFunction$1(descriptor.value)) {
+      return "method"
+      /* Method */
+      ;
+    } else if (isFunction$1(descriptor.set) || isFunction$1(descriptor.get)) {
+      return "accessor"
+      /* Accessor */
+      ;
+    } else {
+      return "field"
+      /* Field */
+      ;
+    }
+  }
+
+  function validateObservedField(Ctor, fieldName, descriptor) {
+    if (!isUndefined$1(descriptor)) {
+      const type = getClassDescriptorType(descriptor);
+      const message = `Invalid observed ${fieldName} field. Found a duplicate ${type} with the same name.`; // [W-9927596] Ideally we always throw an error when detecting duplicate observed field.
+      // This branch is only here for backward compatibility reasons.
+
+      if (type === "accessor"
+      /* Accessor */
+      ) {
+        logError(message);
+      } else {
+        assert.fail(message);
+      }
+    }
+  }
+
+  function validateFieldDecoratedWithTrack(Ctor, fieldName, descriptor) {
+    if (!isUndefined$1(descriptor)) {
+      const type = getClassDescriptorType(descriptor);
+      assert.fail(`Invalid @track ${fieldName} field. Found a duplicate ${type} with the same name.`);
+    }
+  }
+
+  function validateFieldDecoratedWithWire(Ctor, fieldName, descriptor) {
+    if (!isUndefined$1(descriptor)) {
+      const type = getClassDescriptorType(descriptor);
+      assert.fail(`Invalid @wire ${fieldName} field. Found a duplicate ${type} with the same name.`);
+    }
+  }
+
+  function validateMethodDecoratedWithWire(Ctor, methodName, descriptor) {
+    if (isUndefined$1(descriptor) || !isFunction$1(descriptor.value) || isFalse(descriptor.writable)) {
+      assert.fail(`Invalid @wire ${methodName} method.`);
+    }
+  }
+
+  function validateFieldDecoratedWithApi(Ctor, fieldName, descriptor) {
+    if (!isUndefined$1(descriptor)) {
+      const type = getClassDescriptorType(descriptor);
+      const message = `Invalid @api ${fieldName} field. Found a duplicate ${type} with the same name.`; // [W-9927596] Ideally we always throw an error when detecting duplicate public properties.
+      // This branch is only here for backward compatibility reasons.
+
+      if (type === "accessor"
+      /* Accessor */
+      ) {
+        logError(message);
+      } else {
+        assert.fail(message);
+      }
+    }
+  }
+
+  function validateAccessorDecoratedWithApi(Ctor, fieldName, descriptor) {
+    if (isUndefined$1(descriptor)) {
+      assert.fail(`Invalid @api get ${fieldName} accessor.`);
+    } else if (isFunction$1(descriptor.set)) {
+      assert.isTrue(isFunction$1(descriptor.get), `Missing getter for property ${fieldName} decorated with @api in ${Ctor}. You cannot have a setter without the corresponding getter.`);
+    } else if (!isFunction$1(descriptor.get)) {
+      assert.fail(`Missing @api get ${fieldName} accessor.`);
+    }
+  }
+
+  function validateMethodDecoratedWithApi(Ctor, methodName, descriptor) {
+    if (isUndefined$1(descriptor) || !isFunction$1(descriptor.value) || isFalse(descriptor.writable)) {
+      assert.fail(`Invalid @api ${methodName} method.`);
+    }
+  }
+  /**
+   * INTERNAL: This function can only be invoked by compiled code. The compiler
+   * will prevent this function from being imported by user-land code.
+   */
+
+
+  function registerDecorators(Ctor, meta) {
+    const proto = Ctor.prototype;
+    const {
+      publicProps,
+      publicMethods,
+      wire,
+      track,
+      fields
+    } = meta;
+    const apiMethods = create(null);
+    const apiFields = create(null);
+    const wiredMethods = create(null);
+    const wiredFields = create(null);
+    const observedFields = create(null);
+    const apiFieldsConfig = create(null);
+    let descriptor;
+
+    if (!isUndefined$1(publicProps)) {
+      for (const fieldName in publicProps) {
+        const propConfig = publicProps[fieldName];
+        apiFieldsConfig[fieldName] = propConfig.config;
+        descriptor = getOwnPropertyDescriptor$1(proto, fieldName);
+
+        if (propConfig.config > 0) {
+          // accessor declaration
+          if (process.env.NODE_ENV !== 'production') {
+            validateAccessorDecoratedWithApi(Ctor, fieldName, descriptor);
+          }
+
+          if (isUndefined$1(descriptor)) {
+            throw new Error();
+          }
 
-    if (process.env.NODE_ENV !== 'production') {
-      assert.fail(`@track decorator can only be used with one argument to return a trackable object, or as a decorator function.`);
-    }
+          descriptor = createPublicAccessorDescriptor(fieldName, descriptor);
+        } else {
+          // field declaration
+          if (process.env.NODE_ENV !== 'production') {
+            validateFieldDecoratedWithApi(Ctor, fieldName, descriptor);
+          } // [W-9927596] If a component has both a public property and a private setter/getter
+          // with the same name, the property is defined as a public accessor. This branch is
+          // only here for backward compatibility reasons.
 
-    throw new Error();
-  }
 
-  function internalTrackDecorator(key) {
-    return {
-      get() {
-        const vm = getAssociatedVM(this);
-        componentValueObserved(vm, key);
-        return vm.cmpFields[key];
-      },
+          if (!isUndefined$1(descriptor) && !isUndefined$1(descriptor.get)) {
+            descriptor = createPublicAccessorDescriptor(fieldName, descriptor);
+          } else {
+            descriptor = createPublicPropertyDescriptor(fieldName);
+          }
+        }
 
-      set(newValue) {
-        const vm = getAssociatedVM(this);
+        apiFields[fieldName] = descriptor;
+        defineProperty(proto, fieldName, descriptor);
+      }
+    }
+
+    if (!isUndefined$1(publicMethods)) {
+      forEach.call(publicMethods, methodName => {
+        descriptor = getOwnPropertyDescriptor$1(proto, methodName);
 
         if (process.env.NODE_ENV !== 'production') {
-          const vmBeingRendered = getVMBeingRendered();
-          assert.invariant(!isInvokingRender, `${vmBeingRendered}.render() method has side effects on the state of ${vm}.${toString$1(key)}`);
-          assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
+          validateMethodDecoratedWithApi(Ctor, methodName, descriptor);
         }
 
-        const reactiveOrAnyValue = reactiveMembrane.getProxy(newValue);
-
-        if (reactiveOrAnyValue !== vm.cmpFields[key]) {
-          vm.cmpFields[key] = reactiveOrAnyValue;
-          componentValueMutated(vm, key);
+        if (isUndefined$1(descriptor)) {
+          throw new Error();
         }
-      },
-
-      enumerable: true,
-      configurable: true
-    };
-  }
-  /*
-   * 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 api$1() {
-    if (process.env.NODE_ENV !== 'production') {
-      assert.fail(`@api decorator can only be used as a decorator function.`);
+        apiMethods[methodName] = descriptor;
+      });
     }
 
-    throw new Error();
-  }
+    if (!isUndefined$1(wire)) {
+      for (const fieldOrMethodName in wire) {
+        const {
+          adapter,
+          method,
+          config: configCallback,
+          dynamic = []
+        } = wire[fieldOrMethodName];
+        descriptor = getOwnPropertyDescriptor$1(proto, fieldOrMethodName);
 
-  function createPublicPropertyDescriptor(key) {
-    return {
-      get() {
-        const vm = getAssociatedVM(this);
+        if (method === 1) {
+          if (process.env.NODE_ENV !== 'production') {
+            assert.isTrue(adapter, `@wire on method "${fieldOrMethodName}": adapter id must be truthy.`);
+            validateMethodDecoratedWithWire(Ctor, fieldOrMethodName, descriptor);
+          }
 
-        if (isBeingConstructed(vm)) {
+          if (isUndefined$1(descriptor)) {
+            throw new Error();
+          }
+
+          wiredMethods[fieldOrMethodName] = descriptor;
+          storeWiredMethodMeta(descriptor, adapter, configCallback, dynamic);
+        } else {
           if (process.env.NODE_ENV !== 'production') {
-            logError(`Can’t read the value of property \`${toString$1(key)}\` from the constructor because the owner component hasn’t set the value yet. Instead, use the constructor to set a default value for the property.`, vm);
+            assert.isTrue(adapter, `@wire on field "${fieldOrMethodName}": adapter id must be truthy.`);
+            validateFieldDecoratedWithWire(Ctor, fieldOrMethodName, descriptor);
           }
 
-          return;
+          descriptor = internalWireFieldDecorator(fieldOrMethodName);
+          wiredFields[fieldOrMethodName] = descriptor;
+          storeWiredFieldMeta(descriptor, adapter, configCallback, dynamic);
+          defineProperty(proto, fieldOrMethodName, descriptor);
         }
+      }
+    }
 
-        componentValueObserved(vm, key);
-        return vm.cmpProps[key];
-      },
-
-      set(newValue) {
-        const vm = getAssociatedVM(this);
+    if (!isUndefined$1(track)) {
+      for (const fieldName in track) {
+        descriptor = getOwnPropertyDescriptor$1(proto, fieldName);
 
         if (process.env.NODE_ENV !== 'production') {
-          const vmBeingRendered = getVMBeingRendered();
-          assert.invariant(!isInvokingRender, `${vmBeingRendered}.render() method has side effects on the state of ${vm}.${toString$1(key)}`);
-          assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
+          validateFieldDecoratedWithTrack(Ctor, fieldName, descriptor);
         }
 
-        vm.cmpProps[key] = newValue;
-        componentValueMutated(vm, key);
-      },
-
-      enumerable: true,
-      configurable: true
-    };
-  }
-
-  class AccessorReactiveObserver extends ReactiveObserver {
-    constructor(vm, set) {
-      super(() => {
-        if (isFalse(this.debouncing)) {
-          this.debouncing = true;
-          addCallbackToNextTick(() => {
-            if (isTrue(this.debouncing)) {
-              const {
-                value
-              } = this;
-              const {
-                isDirty: dirtyStateBeforeSetterCall,
-                component,
-                idx
-              } = vm;
-              set.call(component, value); // de-bouncing after the call to the original setter to prevent
-              // infinity loop if the setter itself is mutating things that
-              // were accessed during the previous invocation.
-
-              this.debouncing = false;
-
-              if (isTrue(vm.isDirty) && isFalse(dirtyStateBeforeSetterCall) && idx > 0) {
-                // immediate rehydration due to a setter driven mutation, otherwise
-                // the component will get rendered on the second tick, which it is not
-                // desirable.
-                rerenderVM(vm);
-              }
-            }
-          });
-        }
-      });
-      this.debouncing = false;
+        descriptor = internalTrackDecorator(fieldName);
+        defineProperty(proto, fieldName, descriptor);
+      }
     }
 
-    reset(value) {
-      super.reset();
-      this.debouncing = false;
+    if (!isUndefined$1(fields)) {
+      for (let i = 0, n = fields.length; i < n; i++) {
+        const fieldName = fields[i];
+        descriptor = getOwnPropertyDescriptor$1(proto, fieldName);
 
-      if (arguments.length > 0) {
-        this.value = value;
-      }
-    }
+        if (process.env.NODE_ENV !== 'production') {
+          validateObservedField(Ctor, fieldName, descriptor);
+        } // [W-9927596] Only mark a field as observed whenever it isn't a duplicated public nor
+        // tracked property. This is only here for backward compatibility purposes.
 
-  }
 
-  function createPublicAccessorDescriptor(key, descriptor) {
-    const {
-      get,
-      set,
-      enumerable,
-      configurable
-    } = descriptor;
+        const isDuplicatePublicProp = !isUndefined$1(publicProps) && fieldName in publicProps;
+        const isDuplicateTrackedProp = !isUndefined$1(track) && fieldName in track;
 
-    if (!isFunction$1(get)) {
-      if (process.env.NODE_ENV !== 'production') {
-        assert.invariant(isFunction$1(get), `Invalid compiler output for public accessor ${toString$1(key)} decorated with @api`);
+        if (!isDuplicatePublicProp && !isDuplicateTrackedProp) {
+          observedFields[fieldName] = createObservedFieldPropertyDescriptor(fieldName);
+        }
       }
-
-      throw new Error();
     }
 
-    return {
-      get() {
-        if (process.env.NODE_ENV !== 'production') {
-          // Assert that the this value is an actual Component with an associated VM.
-          getAssociatedVM(this);
-        }
+    setDecoratorsMeta(Ctor, {
+      apiMethods,
+      apiFields,
+      apiFieldsConfig,
+      wiredMethods,
+      wiredFields,
+      observedFields
+    });
+    return Ctor;
+  }
 
-        return get.call(this);
-      },
+  const signedDecoratorToMetaMap = new Map();
 
-      set(newValue) {
-        const vm = getAssociatedVM(this);
+  function setDecoratorsMeta(Ctor, meta) {
+    signedDecoratorToMetaMap.set(Ctor, meta);
+  }
 
-        if (process.env.NODE_ENV !== 'production') {
-          const vmBeingRendered = getVMBeingRendered();
-          assert.invariant(!isInvokingRender, `${vmBeingRendered}.render() method has side effects on the state of ${vm}.${toString$1(key)}`);
-          assert.invariant(!isUpdatingTemplate, `Updating the template of ${vmBeingRendered} has side effects on the state of ${vm}.${toString$1(key)}`);
-        }
+  const defaultMeta = {
+    apiMethods: EmptyObject,
+    apiFields: EmptyObject,
+    apiFieldsConfig: EmptyObject,
+    wiredMethods: EmptyObject,
+    wiredFields: EmptyObject,
+    observedFields: EmptyObject
+  };
 
-        if (set) {
-          if (runtimeFlags.ENABLE_REACTIVE_SETTER) {
-            let ro = vm.oar[key];
+  function getDecoratorsMeta(Ctor) {
+    const meta = signedDecoratorToMetaMap.get(Ctor);
+    return isUndefined$1(meta) ? defaultMeta : meta;
+  }
 
-            if (isUndefined$1(ro)) {
-              ro = vm.oar[key] = new AccessorReactiveObserver(vm, set);
-            } // every time we invoke this setter from outside (through this wrapper setter)
-            // we should reset the value and then debounce just in case there is a pending
-            // invocation the next tick that is not longer relevant since the value is changing
-            // from outside.
+  const signedTemplateSet = new Set();
 
+  function defaultEmptyTemplate() {
+    return [];
+  }
 
-            ro.reset(newValue);
-            ro.observe(() => {
-              set.call(this, newValue);
-            });
-          } else {
-            set.call(this, newValue);
-          }
-        } else if (process.env.NODE_ENV !== 'production') {
-          assert.fail(`Invalid attempt to set a new value for property ${toString$1(key)} of ${vm} that does not has a setter decorated with @api.`);
-        }
-      },
+  signedTemplateSet.add(defaultEmptyTemplate);
 
-      enumerable,
-      configurable
-    };
+  function isTemplateRegistered(tpl) {
+    return signedTemplateSet.has(tpl);
   }
+  /**
+   * INTERNAL: This function can only be invoked by compiled code. The compiler
+   * will prevent this function from being imported by userland code.
+   */
 
-  function createObservedFieldPropertyDescriptor(key) {
-    return {
-      get() {
-        const vm = getAssociatedVM(this);
-        componentValueObserved(vm, key);
-        return vm.cmpFields[key];
-      },
 
-      set(newValue) {
-        const vm = getAssociatedVM(this);
+  function registerTemplate(tpl) {
+    signedTemplateSet.add(tpl); // chaining this method as a way to wrap existing
+    // assignment of templates easily, without too much transformation
 
-        if (newValue !== vm.cmpFields[key]) {
-          vm.cmpFields[key] = newValue;
-          componentValueMutated(vm, key);
-        }
-      },
+    return tpl;
+  }
+  /**
+   * EXPERIMENTAL: This function acts like a hook for Lightning Locker Service and other similar
+   * libraries to sanitize vulnerable attributes.
+   */
 
-      enumerable: true,
-      configurable: true
-    };
+
+  function sanitizeAttribute(tagName, namespaceUri, attrName, attrValue) {
+    // locker-service patches this function during runtime to sanitize vulnerable attributes. When
+    // ran off-core this function becomes a noop and returns the user authored value.
+    return attrValue;
   }
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -3659,798 +3584,861 @@ var LWC = (function (exports) {
    * SPDX-License-Identifier: MIT
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
+  // from the element instance, and get the value or set a new value on the component.
+  // This means that across different elements, similar names can get the exact same
+  // descriptor, so we can cache them:
 
 
-  function getClassDescriptorType(descriptor) {
-    if (isFunction$1(descriptor.value)) {
-      return "method"
-      /* Method */
-      ;
-    } else if (isFunction$1(descriptor.set) || isFunction$1(descriptor.get)) {
-      return "accessor"
-      /* Accessor */
-      ;
-    } else {
-      return "field"
-      /* Field */
-      ;
-    }
-  }
+  const cachedGetterByKey = create(null);
+  const cachedSetterByKey = create(null);
 
-  function validateObservedField(Ctor, fieldName, descriptor) {
-    if (!isUndefined$1(descriptor)) {
-      const type = getClassDescriptorType(descriptor);
-      const message = `Invalid observed ${fieldName} field. Found a duplicate ${type} with the same name.`; // [W-9927596] Ideally we always throw an error when detecting duplicate observed field.
-      // This branch is only here for backward compatibility reasons.
+  function createGetter(key) {
+    let fn = cachedGetterByKey[key];
 
-      if (type === "accessor"
-      /* Accessor */
-      ) {
-        logError(message);
-      } else {
-        assert.fail(message);
-      }
+    if (isUndefined$1(fn)) {
+      fn = cachedGetterByKey[key] = function () {
+        const vm = getAssociatedVM(this);
+        const {
+          getHook
+        } = vm;
+        return getHook(vm.component, key);
+      };
     }
-  }
 
-  function validateFieldDecoratedWithTrack(Ctor, fieldName, descriptor) {
-    if (!isUndefined$1(descriptor)) {
-      const type = getClassDescriptorType(descriptor);
-      assert.fail(`Invalid @track ${fieldName} field. Found a duplicate ${type} with the same name.`);
-    }
+    return fn;
   }
 
-  function validateFieldDecoratedWithWire(Ctor, fieldName, descriptor) {
-    if (!isUndefined$1(descriptor)) {
-      const type = getClassDescriptorType(descriptor);
-      assert.fail(`Invalid @wire ${fieldName} field. Found a duplicate ${type} with the same name.`);
+  function createSetter(key) {
+    let fn = cachedSetterByKey[key];
+
+    if (isUndefined$1(fn)) {
+      fn = cachedSetterByKey[key] = function (newValue) {
+        const vm = getAssociatedVM(this);
+        const {
+          setHook
+        } = vm;
+        newValue = reactiveMembrane.getReadOnlyProxy(newValue);
+        setHook(vm.component, key, newValue);
+      };
     }
+
+    return fn;
   }
 
-  function validateMethodDecoratedWithWire(Ctor, methodName, descriptor) {
-    if (isUndefined$1(descriptor) || !isFunction$1(descriptor.value) || isFalse(descriptor.writable)) {
-      assert.fail(`Invalid @wire ${methodName} method.`);
-    }
+  function createMethodCaller(methodName) {
+    return function () {
+      const vm = getAssociatedVM(this);
+      const {
+        callHook,
+        component
+      } = vm;
+      const fn = component[methodName];
+      return callHook(vm.component, fn, ArraySlice.call(arguments));
+    };
   }
 
-  function validateFieldDecoratedWithApi(Ctor, fieldName, descriptor) {
-    if (!isUndefined$1(descriptor)) {
-      const type = getClassDescriptorType(descriptor);
-      const message = `Invalid @api ${fieldName} field. Found a duplicate ${type} with the same name.`; // [W-9927596] Ideally we always throw an error when detecting duplicate public properties.
-      // This branch is only here for backward compatibility reasons.
+  function createAttributeChangedCallback(attributeToPropMap, superAttributeChangedCallback) {
+    return function attributeChangedCallback(attrName, oldValue, newValue) {
+      if (oldValue === newValue) {
+        // Ignore same values.
+        return;
+      }
 
-      if (type === "accessor"
-      /* Accessor */
-      ) {
-        logError(message);
-      } else {
-        assert.fail(message);
+      const propName = attributeToPropMap[attrName];
+
+      if (isUndefined$1(propName)) {
+        if (!isUndefined$1(superAttributeChangedCallback)) {
+          // delegate unknown attributes to the super.
+          // Typescript does not like it when you treat the `arguments` object as an array
+          // @ts-ignore type-mismatch
+          superAttributeChangedCallback.apply(this, arguments);
+        }
+
+        return;
       }
-    }
+
+      if (!isAttributeLocked(this, attrName)) {
+        // Ignore changes triggered by the engine itself during:
+        // * diffing when public props are attempting to reflect to the DOM
+        // * component via `this.setAttribute()`, should never update the prop
+        // Both cases, the setAttribute call is always wrapped by the unlocking of the
+        // attribute to be changed
+        return;
+      } // Reflect attribute change to the corresponding property when changed from outside.
+
+
+      this[propName] = newValue;
+    };
   }
 
-  function validateAccessorDecoratedWithApi(Ctor, fieldName, descriptor) {
-    if (isUndefined$1(descriptor)) {
-      assert.fail(`Invalid @api get ${fieldName} accessor.`);
-    } else if (isFunction$1(descriptor.set)) {
-      assert.isTrue(isFunction$1(descriptor.get), `Missing getter for property ${fieldName} decorated with @api in ${Ctor}. You cannot have a setter without the corresponding getter.`);
-    } else if (!isFunction$1(descriptor.get)) {
-      assert.fail(`Missing @api get ${fieldName} accessor.`);
-    }
+  function HTMLBridgeElementFactory(SuperClass, props, methods) {
+    let HTMLBridgeElement;
+    /**
+     * Modern browsers will have all Native Constructors as regular Classes
+     * and must be instantiated with the new keyword. In older browsers,
+     * specifically IE11, those are objects with a prototype property defined,
+     * since they are not supposed to be extended or instantiated with the
+     * new keyword. This forking logic supports both cases, specifically because
+     * wc.ts relies on the construction path of the bridges to create new
+     * fully qualifying web components.
+     */
+
+    if (isFunction$1(SuperClass)) {
+      HTMLBridgeElement = class extends SuperClass {};
+    } else {
+      HTMLBridgeElement = function () {
+        // Bridge classes are not supposed to be instantiated directly in
+        // browsers that do not support web components.
+        throw new TypeError('Illegal constructor');
+      }; // prototype inheritance dance
+
+
+      setPrototypeOf(HTMLBridgeElement, SuperClass);
+      setPrototypeOf(HTMLBridgeElement.prototype, SuperClass.prototype);
+      defineProperty(HTMLBridgeElement.prototype, 'constructor', {
+        writable: true,
+        configurable: true,
+        value: HTMLBridgeElement
+      });
+    } // generating the hash table for attributes to avoid duplicate fields and facilitate validation
+    // and false positives in case of inheritance.
+
+
+    const attributeToPropMap = create(null);
+    const {
+      attributeChangedCallback: superAttributeChangedCallback
+    } = SuperClass.prototype;
+    const {
+      observedAttributes: superObservedAttributes = []
+    } = SuperClass;
+    const descriptors = create(null); // expose getters and setters for each public props on the new Element Bridge
+
+    for (let i = 0, len = props.length; i < len; i += 1) {
+      const propName = props[i];
+      attributeToPropMap[htmlPropertyToAttribute(propName)] = propName;
+      descriptors[propName] = {
+        get: createGetter(propName),
+        set: createSetter(propName),
+        enumerable: true,
+        configurable: true
+      };
+    } // expose public methods as props on the new Element Bridge
+
+
+    for (let i = 0, len = methods.length; i < len; i += 1) {
+      const methodName = methods[i];
+      descriptors[methodName] = {
+        value: createMethodCaller(methodName),
+        writable: true,
+        configurable: true
+      };
+    } // creating a new attributeChangedCallback per bridge because they are bound to the corresponding
+    // map of attributes to props. We do this after all other props and methods to avoid the possibility
+    // of getting overrule by a class declaration in user-land, and we make it non-writable, non-configurable
+    // to preserve this definition.
+
+
+    descriptors.attributeChangedCallback = {
+      value: createAttributeChangedCallback(attributeToPropMap, superAttributeChangedCallback)
+    }; // Specify attributes for which we want to reflect changes back to their corresponding
+    // properties via attributeChangedCallback.
+
+    defineProperty(HTMLBridgeElement, 'observedAttributes', {
+      get() {
+        return [...superObservedAttributes, ...keys(attributeToPropMap)];
+      }
+
+    });
+    defineProperties(HTMLBridgeElement.prototype, descriptors);
+    return HTMLBridgeElement;
   }
 
-  function validateMethodDecoratedWithApi(Ctor, methodName, descriptor) {
-    if (isUndefined$1(descriptor) || !isFunction$1(descriptor.value) || isFalse(descriptor.writable)) {
-      assert.fail(`Invalid @api ${methodName} method.`);
-    }
-  }
-  /**
-   * INTERNAL: This function can only be invoked by compiled code. The compiler
-   * will prevent this function from being imported by user-land code.
+  const BaseBridgeElement = HTMLBridgeElementFactory(HTMLElementConstructor$1, getOwnPropertyNames$1(HTMLElementOriginalDescriptors), []);
+  freeze(BaseBridgeElement);
+  seal(BaseBridgeElement.prototype);
+  /*
+   * Copyright (c) 2020, 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 resolveCircularModuleDependency(fn) {
+    const module = fn();
+    return (module === null || module === void 0 ? void 0 : module.__esModule) ? module.default : module;
+  }
 
-  function registerDecorators(Ctor, meta) {
-    const proto = Ctor.prototype;
-    const {
-      publicProps,
-      publicMethods,
-      wire,
-      track,
-      fields
-    } = meta;
-    const apiMethods = create(null);
-    const apiFields = create(null);
-    const wiredMethods = create(null);
-    const wiredFields = create(null);
-    const observedFields = create(null);
-    const apiFieldsConfig = create(null);
-    let descriptor;
-
-    if (!isUndefined$1(publicProps)) {
-      for (const fieldName in publicProps) {
-        const propConfig = publicProps[fieldName];
-        apiFieldsConfig[fieldName] = propConfig.config;
-        descriptor = getOwnPropertyDescriptor$1(proto, fieldName);
-
-        if (propConfig.config > 0) {
-          // accessor declaration
-          if (process.env.NODE_ENV !== 'production') {
-            validateAccessorDecoratedWithApi(Ctor, fieldName, descriptor);
-          }
+  function isCircularModuleDependency(obj) {
+    return isFunction$1(obj) && hasOwnProperty$1.call(obj, '__circular__');
+  }
+  /*
+   * Copyright (c) 2020, 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
+   */
 
-          if (isUndefined$1(descriptor)) {
-            throw new Error();
-          }
 
-          descriptor = createPublicAccessorDescriptor(fieldName, descriptor);
-        } else {
-          // field declaration
-          if (process.env.NODE_ENV !== 'production') {
-            validateFieldDecoratedWithApi(Ctor, fieldName, descriptor);
-          } // [W-9927596] If a component has both a public property and a private setter/getter
-          // with the same name, the property is defined as a public accessor. This branch is
-          // only here for backward compatibility reasons.
+  const swappedTemplateMap = new WeakMap();
+  const swappedComponentMap = new WeakMap();
+  const swappedStyleMap = new WeakMap();
+  const activeTemplates = new WeakMap();
+  const activeComponents = new WeakMap();
+  const activeStyles = new WeakMap();
 
+  function rehydrateHotTemplate(tpl) {
+    const list = activeTemplates.get(tpl);
 
-          if (!isUndefined$1(descriptor) && !isUndefined$1(descriptor.get)) {
-            descriptor = createPublicAccessorDescriptor(fieldName, descriptor);
-          } else {
-            descriptor = createPublicPropertyDescriptor(fieldName);
-          }
+    if (!isUndefined$1(list)) {
+      list.forEach(vm => {
+        if (isFalse(vm.isDirty)) {
+          // forcing the vm to rehydrate in the micro-task:
+          markComponentAsDirty(vm);
+          scheduleRehydration(vm);
         }
+      }); // resetting the Set to release the memory of those vm references
+      // since they are not longer related to this template, instead
+      // they will get re-associated once these instances are rehydrated.
 
-        apiFields[fieldName] = descriptor;
-        defineProperty(proto, fieldName, descriptor);
-      }
+      list.clear();
     }
 
-    if (!isUndefined$1(publicMethods)) {
-      forEach.call(publicMethods, methodName => {
-        descriptor = getOwnPropertyDescriptor$1(proto, methodName);
+    return true;
+  }
 
-        if (process.env.NODE_ENV !== 'production') {
-          validateMethodDecoratedWithApi(Ctor, methodName, descriptor);
-        }
+  function rehydrateHotStyle(style) {
+    const list = activeStyles.get(style);
 
-        if (isUndefined$1(descriptor)) {
-          throw new Error();
-        }
+    if (!isUndefined$1(list)) {
+      list.forEach(vm => {
+        // if a style definition is swapped, we must reset
+        // vm's template content in the next micro-task:
+        forceRehydration(vm);
+      }); // resetting the Set to release the memory of those vm references
+      // since they are not longer related to this style, instead
+      // they will get re-associated once these instances are rehydrated.
 
-        apiMethods[methodName] = descriptor;
-      });
+      list.clear();
     }
 
-    if (!isUndefined$1(wire)) {
-      for (const fieldOrMethodName in wire) {
-        const {
-          adapter,
-          method,
-          config: configCallback,
-          dynamic = []
-        } = wire[fieldOrMethodName];
-        descriptor = getOwnPropertyDescriptor$1(proto, fieldOrMethodName);
+    return true;
+  }
 
-        if (method === 1) {
-          if (process.env.NODE_ENV !== 'production') {
-            assert.isTrue(adapter, `@wire on method "${fieldOrMethodName}": adapter id must be truthy.`);
-            validateMethodDecoratedWithWire(Ctor, fieldOrMethodName, descriptor);
-          }
+  function rehydrateHotComponent(Ctor) {
+    const list = activeComponents.get(Ctor);
+    let canRefreshAllInstances = true;
 
-          if (isUndefined$1(descriptor)) {
-            throw new Error();
-          }
+    if (!isUndefined$1(list)) {
+      list.forEach(vm => {
+        const {
+          owner
+        } = vm;
 
-          wiredMethods[fieldOrMethodName] = descriptor;
-          storeWiredMethodMeta(descriptor, adapter, configCallback, dynamic);
+        if (!isNull(owner)) {
+          // if a component class definition is swapped, we must reset
+          // owner's template content in the next micro-task:
+          forceRehydration(owner);
         } else {
-          if (process.env.NODE_ENV !== 'production') {
-            assert.isTrue(adapter, `@wire on field "${fieldOrMethodName}": adapter id must be truthy.`);
-            validateFieldDecoratedWithWire(Ctor, fieldOrMethodName, descriptor);
-          }
-
-          descriptor = internalWireFieldDecorator(fieldOrMethodName);
-          wiredFields[fieldOrMethodName] = descriptor;
-          storeWiredFieldMeta(descriptor, adapter, configCallback, dynamic);
-          defineProperty(proto, fieldOrMethodName, descriptor);
-        }
-      }
-    }
-
-    if (!isUndefined$1(track)) {
-      for (const fieldName in track) {
-        descriptor = getOwnPropertyDescriptor$1(proto, fieldName);
-
-        if (process.env.NODE_ENV !== 'production') {
-          validateFieldDecoratedWithTrack(Ctor, fieldName, descriptor);
+          // the hot swapping for components only work for instances of components
+          // created from a template, root elements can't be swapped because we
+          // don't have a way to force the creation of the element with the same state
+          // of the current element.
+          // Instead, we can report the problem to the caller so it can take action,
+          // for example: reload the entire page.
+          canRefreshAllInstances = false;
         }
+      }); // resetting the Set to release the memory of those vm references
+      // since they are not longer related to this constructor, instead
+      // they will get re-associated once these instances are rehydrated.
 
-        descriptor = internalTrackDecorator(fieldName);
-        defineProperty(proto, fieldName, descriptor);
-      }
+      list.clear();
     }
 
-    if (!isUndefined$1(fields)) {
-      for (let i = 0, n = fields.length; i < n; i++) {
-        const fieldName = fields[i];
-        descriptor = getOwnPropertyDescriptor$1(proto, fieldName);
-
-        if (process.env.NODE_ENV !== 'production') {
-          validateObservedField(Ctor, fieldName, descriptor);
-        } // [W-9927596] Only mark a field as observed whenever it isn't a duplicated public nor
-        // tracked property. This is only here for backward compatibility purposes.
-
+    return canRefreshAllInstances;
+  }
 
-        const isDuplicatePublicProp = !isUndefined$1(publicProps) && fieldName in publicProps;
-        const isDuplicateTrackedProp = !isUndefined$1(track) && fieldName in track;
+  function flattenStylesheets(stylesheets) {
+    const list = [];
 
-        if (!isDuplicatePublicProp && !isDuplicateTrackedProp) {
-          observedFields[fieldName] = createObservedFieldPropertyDescriptor(fieldName);
-        }
+    for (const stylesheet of stylesheets) {
+      if (!Array.isArray(stylesheet)) {
+        list.push(stylesheet);
+      } else {
+        list.push(...flattenStylesheets(stylesheet));
       }
     }
 
-    setDecoratorsMeta(Ctor, {
-      apiMethods,
-      apiFields,
-      apiFieldsConfig,
-      wiredMethods,
-      wiredFields,
-      observedFields
-    });
-    return Ctor;
+    return list;
   }
 
-  const signedDecoratorToMetaMap = new Map();
+  function getTemplateOrSwappedTemplate(tpl) {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
+    }
 
-  function setDecoratorsMeta(Ctor, meta) {
-    signedDecoratorToMetaMap.set(Ctor, meta);
-  }
+    if (runtimeFlags.ENABLE_HMR) {
+      const visited = new Set();
 
-  const defaultMeta = {
-    apiMethods: EmptyObject,
-    apiFields: EmptyObject,
-    apiFieldsConfig: EmptyObject,
-    wiredMethods: EmptyObject,
-    wiredFields: EmptyObject,
-    observedFields: EmptyObject
-  };
+      while (swappedTemplateMap.has(tpl) && !visited.has(tpl)) {
+        visited.add(tpl);
+        tpl = swappedTemplateMap.get(tpl);
+      }
+    }
 
-  function getDecoratorsMeta(Ctor) {
-    const meta = signedDecoratorToMetaMap.get(Ctor);
-    return isUndefined$1(meta) ? defaultMeta : meta;
+    return tpl;
   }
 
-  const signedTemplateSet = new Set();
+  function getComponentOrSwappedComponent(Ctor) {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
+    }
 
-  function defaultEmptyTemplate() {
-    return [];
-  }
+    if (runtimeFlags.ENABLE_HMR) {
+      const visited = new Set();
 
-  signedTemplateSet.add(defaultEmptyTemplate);
+      while (swappedComponentMap.has(Ctor) && !visited.has(Ctor)) {
+        visited.add(Ctor);
+        Ctor = swappedComponentMap.get(Ctor);
+      }
+    }
 
-  function isTemplateRegistered(tpl) {
-    return signedTemplateSet.has(tpl);
+    return Ctor;
   }
-  /**
-   * INTERNAL: This function can only be invoked by compiled code. The compiler
-   * will prevent this function from being imported by userland code.
-   */
 
+  function getStyleOrSwappedStyle(style) {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
+    }
 
-  function registerTemplate(tpl) {
-    signedTemplateSet.add(tpl); // chaining this method as a way to wrap existing
-    // assignment of templates easily, without too much transformation
+    if (runtimeFlags.ENABLE_HMR) {
+      const visited = new Set();
 
-    return tpl;
+      while (swappedStyleMap.has(style) && !visited.has(style)) {
+        visited.add(style);
+        style = swappedStyleMap.get(style);
+      }
+    }
+
+    return style;
   }
-  /**
-   * EXPERIMENTAL: This function acts like a hook for Lightning Locker Service and other similar
-   * libraries to sanitize vulnerable attributes.
-   */
 
+  function setActiveVM(vm) {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
+    }
 
-  function sanitizeAttribute(tagName, namespaceUri, attrName, attrValue) {
-    // locker-service patches this function during runtime to sanitize vulnerable attributes. When
-    // ran off-core this function becomes a noop and returns the user authored value.
-    return attrValue;
-  }
-  /*
-   * 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
-   */
-  // from the element instance, and get the value or set a new value on the component.
-  // This means that across different elements, similar names can get the exact same
-  // descriptor, so we can cache them:
+    if (runtimeFlags.ENABLE_HMR) {
+      // tracking active component
+      const Ctor = vm.def.ctor;
+      let componentVMs = activeComponents.get(Ctor);
 
+      if (isUndefined$1(componentVMs)) {
+        componentVMs = new Set();
+        activeComponents.set(Ctor, componentVMs);
+      } // this will allow us to keep track of the hot components
 
-  const cachedGetterByKey = create(null);
-  const cachedSetterByKey = create(null);
 
-  function createGetter(key) {
-    let fn = cachedGetterByKey[key];
+      componentVMs.add(vm); // tracking active template
 
-    if (isUndefined$1(fn)) {
-      fn = cachedGetterByKey[key] = function () {
-        const vm = getAssociatedVM(this);
-        const {
-          getHook
-        } = vm;
-        return getHook(vm.component, key);
-      };
-    }
+      const tpl = vm.cmpTemplate;
 
-    return fn;
-  }
+      if (tpl) {
+        let templateVMs = activeTemplates.get(tpl);
 
-  function createSetter(key) {
-    let fn = cachedSetterByKey[key];
+        if (isUndefined$1(templateVMs)) {
+          templateVMs = new Set();
+          activeTemplates.set(tpl, templateVMs);
+        } // this will allow us to keep track of the templates that are
+        // being used by a hot component
 
-    if (isUndefined$1(fn)) {
-      fn = cachedSetterByKey[key] = function (newValue) {
-        const vm = getAssociatedVM(this);
-        const {
-          setHook
-        } = vm;
-        newValue = reactiveMembrane.getReadOnlyProxy(newValue);
-        setHook(vm.component, key, newValue);
-      };
-    }
 
-    return fn;
-  }
+        templateVMs.add(vm); // tracking active styles associated to template
 
-  function createMethodCaller(methodName) {
-    return function () {
-      const vm = getAssociatedVM(this);
-      const {
-        callHook,
-        component
-      } = vm;
-      const fn = component[methodName];
-      return callHook(vm.component, fn, ArraySlice.call(arguments));
-    };
-  }
+        const stylesheets = tpl.stylesheets;
 
-  function createAttributeChangedCallback(attributeToPropMap, superAttributeChangedCallback) {
-    return function attributeChangedCallback(attrName, oldValue, newValue) {
-      if (oldValue === newValue) {
-        // Ignore same values.
-        return;
-      }
+        if (!isUndefined$1(stylesheets)) {
+          flattenStylesheets(stylesheets).forEach(stylesheet => {
+            // this is necessary because we don't hold the list of styles
+            // in the vm, we only hold the selected (already swapped template)
+            // but the styles attached to the template might not be the actual
+            // active ones, but the swapped versions of those.
+            stylesheet = getStyleOrSwappedStyle(stylesheet);
+            let stylesheetVMs = activeStyles.get(stylesheet);
 
-      const propName = attributeToPropMap[attrName];
+            if (isUndefined$1(stylesheetVMs)) {
+              stylesheetVMs = new Set();
+              activeStyles.set(stylesheet, stylesheetVMs);
+            } // this will allow us to keep track of the stylesheet that are
+            // being used by a hot component
 
-      if (isUndefined$1(propName)) {
-        if (!isUndefined$1(superAttributeChangedCallback)) {
-          // delegate unknown attributes to the super.
-          // Typescript does not like it when you treat the `arguments` object as an array
-          // @ts-ignore type-mismatch
-          superAttributeChangedCallback.apply(this, arguments);
-        }
 
-        return;
+            stylesheetVMs.add(vm);
+          });
+        }
       }
+    }
+  }
 
-      if (!isAttributeLocked(this, attrName)) {
-        // Ignore changes triggered by the engine itself during:
-        // * diffing when public props are attempting to reflect to the DOM
-        // * component via `this.setAttribute()`, should never update the prop
-        // Both cases, the setAttribute call is always wrapped by the unlocking of the
-        // attribute to be changed
-        return;
-      } // Reflect attribute change to the corresponding property when changed from outside.
-
+  function removeActiveVM(vm) {
+    if (process.env.NODE_ENV === 'production') {
+      // this method should never leak to prod
+      throw new ReferenceError();
+    }
 
-      this[propName] = newValue;
-    };
-  }
+    if (runtimeFlags.ENABLE_HMR) {
+      // tracking inactive component
+      const Ctor = vm.def.ctor;
+      let list = activeComponents.get(Ctor);
 
-  function HTMLBridgeElementFactory(SuperClass, props, methods) {
-    let HTMLBridgeElement;
-    /**
-     * Modern browsers will have all Native Constructors as regular Classes
-     * and must be instantiated with the new keyword. In older browsers,
-     * specifically IE11, those are objects with a prototype property defined,
-     * since they are not supposed to be extended or instantiated with the
-     * new keyword. This forking logic supports both cases, specifically because
-     * wc.ts relies on the construction path of the bridges to create new
-     * fully qualifying web components.
-     */
+      if (!isUndefined$1(list)) {
+        // deleting the vm from the set to avoid leaking memory
+        list.delete(vm);
+      } // removing inactive template
 
-    if (isFunction$1(SuperClass)) {
-      HTMLBridgeElement = class extends SuperClass {};
-    } else {
-      HTMLBridgeElement = function () {
-        // Bridge classes are not supposed to be instantiated directly in
-        // browsers that do not support web components.
-        throw new TypeError('Illegal constructor');
-      }; // prototype inheritance dance
 
+      const tpl = vm.cmpTemplate;
 
-      setPrototypeOf(HTMLBridgeElement, SuperClass);
-      setPrototypeOf(HTMLBridgeElement.prototype, SuperClass.prototype);
-      defineProperty(HTMLBridgeElement.prototype, 'constructor', {
-        writable: true,
-        configurable: true,
-        value: HTMLBridgeElement
-      });
-    } // generating the hash table for attributes to avoid duplicate fields and facilitate validation
-    // and false positives in case of inheritance.
+      if (tpl) {
+        list = activeTemplates.get(tpl);
 
+        if (!isUndefined$1(list)) {
+          // deleting the vm from the set to avoid leaking memory
+          list.delete(vm);
+        } // removing active styles associated to template
 
-    const attributeToPropMap = create(null);
-    const {
-      attributeChangedCallback: superAttributeChangedCallback
-    } = SuperClass.prototype;
-    const {
-      observedAttributes: superObservedAttributes = []
-    } = SuperClass;
-    const descriptors = create(null); // expose getters and setters for each public props on the new Element Bridge
 
-    for (let i = 0, len = props.length; i < len; i += 1) {
-      const propName = props[i];
-      attributeToPropMap[htmlPropertyToAttribute(propName)] = propName;
-      descriptors[propName] = {
-        get: createGetter(propName),
-        set: createSetter(propName),
-        enumerable: true,
-        configurable: true
-      };
-    } // expose public methods as props on the new Element Bridge
+        const styles = tpl.stylesheets;
 
+        if (!isUndefined$1(styles)) {
+          flattenStylesheets(styles).forEach(style => {
+            list = activeStyles.get(style);
 
-    for (let i = 0, len = methods.length; i < len; i += 1) {
-      const methodName = methods[i];
-      descriptors[methodName] = {
-        value: createMethodCaller(methodName),
-        writable: true,
-        configurable: true
-      };
-    } // creating a new attributeChangedCallback per bridge because they are bound to the corresponding
-    // map of attributes to props. We do this after all other props and methods to avoid the possibility
-    // of getting overrule by a class declaration in user-land, and we make it non-writable, non-configurable
-    // to preserve this definition.
+            if (!isUndefined$1(list)) {
+              // deleting the vm from the set to avoid leaking memory
+              list.delete(vm);
+            }
+          });
+        }
+      }
+    }
+  }
 
+  function swapTemplate(oldTpl, newTpl) {
+    if (process.env.NODE_ENV !== 'production') {
+      if (isTemplateRegistered(oldTpl) && isTemplateRegistered(newTpl)) {
+        swappedTemplateMap.set(oldTpl, newTpl);
+        return rehydrateHotTemplate(oldTpl);
+      } else {
+        throw new TypeError(`Invalid Template`);
+      }
+    }
 
-    descriptors.attributeChangedCallback = {
-      value: createAttributeChangedCallback(attributeToPropMap, superAttributeChangedCallback)
-    }; // Specify attributes for which we want to reflect changes back to their corresponding
-    // properties via attributeChangedCallback.
+    if (!runtimeFlags.ENABLE_HMR) {
+      throw new Error('HMR is not enabled');
+    }
 
-    defineProperty(HTMLBridgeElement, 'observedAttributes', {
-      get() {
-        return [...superObservedAttributes, ...keys(attributeToPropMap)];
+    return false;
+  }
+
+  function swapComponent(oldComponent, newComponent) {
+    if (process.env.NODE_ENV !== 'production') {
+      if (isComponentConstructor(oldComponent) && isComponentConstructor(newComponent)) {
+        swappedComponentMap.set(oldComponent, newComponent);
+        return rehydrateHotComponent(oldComponent);
+      } else {
+        throw new TypeError(`Invalid Component`);
       }
+    }
 
-    });
-    defineProperties(HTMLBridgeElement.prototype, descriptors);
-    return HTMLBridgeElement;
+    if (!runtimeFlags.ENABLE_HMR) {
+      throw new Error('HMR is not enabled');
+    }
+
+    return false;
   }
 
-  const BaseBridgeElement = HTMLBridgeElementFactory(HTMLElementConstructor$1, getOwnPropertyNames$1(HTMLElementOriginalDescriptors), []);
-  freeze(BaseBridgeElement);
-  seal(BaseBridgeElement.prototype);
-  /*
-   * Copyright (c) 2020, 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 swapStyle(oldStyle, newStyle) {
+    if (process.env.NODE_ENV !== 'production') {
+      // TODO [#1887]: once the support for registering styles is implemented
+      // we can add the validation of both styles around this block.
+      swappedStyleMap.set(oldStyle, newStyle);
+      return rehydrateHotStyle(oldStyle);
+    }
 
-  function resolveCircularModuleDependency(fn) {
-    const module = fn();
-    return (module === null || module === void 0 ? void 0 : module.__esModule) ? module.default : module;
-  }
+    if (!runtimeFlags.ENABLE_HMR) {
+      throw new Error('HMR is not enabled');
+    }
 
-  function isCircularModuleDependency(obj) {
-    return isFunction$1(obj) && hasOwnProperty$1.call(obj, '__circular__');
+    return false;
   }
   /*
-   * Copyright (c) 2020, salesforce.com, inc.
+   * 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 swappedTemplateMap = new WeakMap();
-  const swappedComponentMap = new WeakMap();
-  const swappedStyleMap = new WeakMap();
-  const activeTemplates = new WeakMap();
-  const activeComponents = new WeakMap();
-  const activeStyles = new WeakMap();
+  const CtorToDefMap = new WeakMap();
 
-  function rehydrateHotTemplate(tpl) {
-    const list = activeTemplates.get(tpl);
+  function getCtorProto(Ctor) {
+    let proto = getPrototypeOf$1(Ctor);
 
-    if (!isUndefined$1(list)) {
-      list.forEach(vm => {
-        if (isFalse(vm.isDirty)) {
-          // forcing the vm to rehydrate in the micro-task:
-          markComponentAsDirty(vm);
-          scheduleRehydration(vm);
-        }
-      }); // resetting the Set to release the memory of those vm references
-      // since they are not longer related to this template, instead
-      // they will get re-associated once these instances are rehydrated.
+    if (isNull(proto)) {
+      throw new ReferenceError(`Invalid prototype chain for ${Ctor.name}, you must extend LightningElement.`);
+    } // covering the cases where the ref is circular in AMD
 
-      list.clear();
-    }
 
-    return true;
-  }
+    if (isCircularModuleDependency(proto)) {
+      const p = resolveCircularModuleDependency(proto);
 
-  function rehydrateHotStyle(style) {
-    const list = activeStyles.get(style);
+      if (process.env.NODE_ENV !== 'production') {
+        if (isNull(p)) {
+          throw new ReferenceError(`Circular module dependency for ${Ctor.name}, must resolve to a constructor that extends LightningElement.`);
+        }
+      } // escape hatch for Locker and other abstractions to provide their own base class instead
+      // of our Base class without having to leak it to user-land. If the circular function returns
+      // itself, that's the signal that we have hit the end of the proto chain, which must always
+      // be base.
 
-    if (!isUndefined$1(list)) {
-      list.forEach(vm => {
-        // if a style definition is swapped, we must reset
-        // vm's template content in the next micro-task:
-        forceRehydration(vm);
-      }); // resetting the Set to release the memory of those vm references
-      // since they are not longer related to this style, instead
-      // they will get re-associated once these instances are rehydrated.
 
-      list.clear();
+      proto = p === proto ? LightningElement : p;
     }
 
-    return true;
+    return proto;
   }
 
-  function rehydrateHotComponent(Ctor) {
-    const list = activeComponents.get(Ctor);
-    let canRefreshAllInstances = true;
-
-    if (!isUndefined$1(list)) {
-      list.forEach(vm => {
-        const {
-          owner
-        } = vm;
-
-        if (!isNull(owner)) {
-          // if a component class definition is swapped, we must reset
-          // owner's template content in the next micro-task:
-          forceRehydration(owner);
-        } else {
-          // the hot swapping for components only work for instances of components
-          // created from a template, root elements can't be swapped because we
-          // don't have a way to force the creation of the element with the same state
-          // of the current element.
-          // Instead, we can report the problem to the caller so it can take action,
-          // for example: reload the entire page.
-          canRefreshAllInstances = false;
-        }
-      }); // resetting the Set to release the memory of those vm references
-      // since they are not longer related to this constructor, instead
-      // they will get re-associated once these instances are rehydrated.
+  function createComponentDef(Ctor) {
+    const {
+      shadowSupportMode: ctorShadowSupportMode,
+      renderMode: ctorRenderMode
+    } = Ctor;
 
-      list.clear();
-    }
+    if (process.env.NODE_ENV !== 'production') {
+      const ctorName = Ctor.name; // Removing the following assert until https://bugs.webkit.org/show_bug.cgi?id=190140 is fixed.
+      // assert.isTrue(ctorName && isString(ctorName), `${toString(Ctor)} should have a "name" property with string value, but found ${ctorName}.`);
 
-    return canRefreshAllInstances;
-  }
+      assert.isTrue(Ctor.constructor, `Missing ${ctorName}.constructor, ${ctorName} should have a "constructor" property.`);
 
-  function flattenStylesheets(stylesheets) {
-    const list = [];
+      if (!isUndefined$1(ctorShadowSupportMode)) {
+        assert.invariant(ctorShadowSupportMode === "any"
+        /* Any */
+        || ctorShadowSupportMode === "reset"
+        /* Default */
+        , `Invalid value for static property shadowSupportMode: '${ctorShadowSupportMode}'`);
+      }
 
-    for (const stylesheet of stylesheets) {
-      if (!Array.isArray(stylesheet)) {
-        list.push(stylesheet);
-      } else {
-        list.push(...flattenStylesheets(stylesheet));
+      if (!isUndefined$1(ctorRenderMode)) {
+        assert.invariant(ctorRenderMode === 'light' || ctorRenderMode === 'shadow', `Invalid value for static property renderMode: '${ctorRenderMode}'. renderMode must be either 'light' or 'shadow'.`);
       }
     }
 
-    return list;
-  }
+    const decoratorsMeta = getDecoratorsMeta(Ctor);
+    const {
+      apiFields,
+      apiFieldsConfig,
+      apiMethods,
+      wiredFields,
+      wiredMethods,
+      observedFields
+    } = decoratorsMeta;
+    const proto = Ctor.prototype;
+    let {
+      connectedCallback,
+      disconnectedCallback,
+      renderedCallback,
+      errorCallback,
+      render
+    } = proto;
+    const superProto = getCtorProto(Ctor);
+    const superDef = superProto !== LightningElement ? getComponentInternalDef(superProto) : lightingElementDef;
+    const bridge = HTMLBridgeElementFactory(superDef.bridge, keys(apiFields), keys(apiMethods));
+    const props = assign(create(null), superDef.props, apiFields);
+    const propsConfig = assign(create(null), superDef.propsConfig, apiFieldsConfig);
+    const methods = assign(create(null), superDef.methods, apiMethods);
+    const wire = assign(create(null), superDef.wire, wiredFields, wiredMethods);
+    connectedCallback = connectedCallback || superDef.connectedCallback;
+    disconnectedCallback = disconnectedCallback || superDef.disconnectedCallback;
+    renderedCallback = renderedCallback || superDef.renderedCallback;
+    errorCallback = errorCallback || superDef.errorCallback;
+    render = render || superDef.render;
+    let shadowSupportMode = superDef.shadowSupportMode;
 
-  function getTemplateOrSwappedTemplate(tpl) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
+    if (!isUndefined$1(ctorShadowSupportMode)) {
+      shadowSupportMode = ctorShadowSupportMode;
     }
 
-    if (runtimeFlags.ENABLE_HMR) {
-      const visited = new Set();
+    let renderMode = superDef.renderMode;
 
-      while (swappedTemplateMap.has(tpl) && !visited.has(tpl)) {
-        visited.add(tpl);
-        tpl = swappedTemplateMap.get(tpl);
-      }
+    if (!isUndefined$1(ctorRenderMode)) {
+      renderMode = ctorRenderMode === 'light' ? 0
+      /* Light */
+      : 1
+      /* Shadow */
+      ;
     }
 
-    return tpl;
-  }
-
-  function getComponentOrSwappedComponent(Ctor) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+    const template = getComponentRegisteredTemplate(Ctor) || superDef.template;
+    const name = Ctor.name || superDef.name; // installing observed fields into the prototype.
 
-    if (runtimeFlags.ENABLE_HMR) {
-      const visited = new Set();
+    defineProperties(proto, observedFields);
+    const def = {
+      ctor: Ctor,
+      name,
+      wire,
+      props,
+      propsConfig,
+      methods,
+      bridge,
+      template,
+      renderMode,
+      shadowSupportMode,
+      connectedCallback,
+      disconnectedCallback,
+      renderedCallback,
+      errorCallback,
+      render
+    };
 
-      while (swappedComponentMap.has(Ctor) && !visited.has(Ctor)) {
-        visited.add(Ctor);
-        Ctor = swappedComponentMap.get(Ctor);
-      }
+    if (process.env.NODE_ENV !== 'production') {
+      freeze(Ctor.prototype);
     }
 
-    return Ctor;
+    return def;
   }
+  /**
+   * EXPERIMENTAL: This function allows for the identification of LWC constructors. This API is
+   * subject to change or being removed.
+   */
 
-  function getStyleOrSwappedStyle(style) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
-
-    if (runtimeFlags.ENABLE_HMR) {
-      const visited = new Set();
-
-      while (swappedStyleMap.has(style) && !visited.has(style)) {
-        visited.add(style);
-        style = swappedStyleMap.get(style);
-      }
-    }
 
-    return style;
-  }
+  function isComponentConstructor(ctor) {
+    if (!isFunction$1(ctor)) {
+      return false;
+    } // Fast path: LightningElement is part of the prototype chain of the constructor.
 
-  function setActiveVM(vm) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
 
-    if (runtimeFlags.ENABLE_HMR) {
-      // tracking active component
-      const Ctor = vm.def.ctor;
-      let componentVMs = activeComponents.get(Ctor);
+    if (ctor.prototype instanceof LightningElement) {
+      return true;
+    } // Slow path: LightningElement is not part of the prototype chain of the constructor, we need
+    // climb up the constructor prototype chain to check in case there are circular dependencies
+    // to resolve.
 
-      if (isUndefined$1(componentVMs)) {
-        componentVMs = new Set();
-        activeComponents.set(Ctor, componentVMs);
-      } // this will allow us to keep track of the hot components
 
+    let current = ctor;
 
-      componentVMs.add(vm); // tracking active template
+    do {
+      if (isCircularModuleDependency(current)) {
+        const circularResolved = resolveCircularModuleDependency(current); // If the circular function returns itself, that's the signal that we have hit the end
+        // of the proto chain, which must always be a valid base constructor.
 
-      const tpl = vm.cmpTemplate;
+        if (circularResolved === current) {
+          return true;
+        }
 
-      if (tpl) {
-        let templateVMs = activeTemplates.get(tpl);
+        current = circularResolved;
+      }
 
-        if (isUndefined$1(templateVMs)) {
-          templateVMs = new Set();
-          activeTemplates.set(tpl, templateVMs);
-        } // this will allow us to keep track of the templates that are
-        // being used by a hot component
+      if (current === LightningElement) {
+        return true;
+      }
+    } while (!isNull(current) && (current = getPrototypeOf$1(current))); // Finally return false if the LightningElement is not part of the prototype chain.
 
 
-        templateVMs.add(vm); // tracking active styles associated to template
+    return false;
+  }
 
-        const stylesheets = tpl.stylesheets;
+  function getComponentInternalDef(Ctor) {
+    if (process.env.NODE_ENV !== 'production') {
+      Ctor = getComponentOrSwappedComponent(Ctor);
+    }
 
-        if (!isUndefined$1(stylesheets)) {
-          flattenStylesheets(stylesheets).forEach(stylesheet => {
-            // this is necessary because we don't hold the list of styles
-            // in the vm, we only hold the selected (already swapped template)
-            // but the styles attached to the template might not be the actual
-            // active ones, but the swapped versions of those.
-            stylesheet = getStyleOrSwappedStyle(stylesheet);
-            let stylesheetVMs = activeStyles.get(stylesheet);
+    let def = CtorToDefMap.get(Ctor);
 
-            if (isUndefined$1(stylesheetVMs)) {
-              stylesheetVMs = new Set();
-              activeStyles.set(stylesheet, stylesheetVMs);
-            } // this will allow us to keep track of the stylesheet that are
-            // being used by a hot component
+    if (isUndefined$1(def)) {
+      if (isCircularModuleDependency(Ctor)) {
+        const resolvedCtor = resolveCircularModuleDependency(Ctor);
+        def = getComponentInternalDef(resolvedCtor); // Cache the unresolved component ctor too. The next time if the same unresolved ctor is used,
+        // look up the definition in cache instead of re-resolving and recreating the def.
 
+        CtorToDefMap.set(Ctor, def);
+        return def;
+      }
 
-            stylesheetVMs.add(vm);
-          });
-        }
+      if (!isComponentConstructor(Ctor)) {
+        throw new TypeError(`${Ctor} is not a valid component, or does not extends LightningElement from "lwc". You probably forgot to add the extend clause on the class declaration.`);
       }
+
+      def = createComponentDef(Ctor);
+      CtorToDefMap.set(Ctor, def);
     }
+
+    return def;
   }
 
-  function removeActiveVM(vm) {
-    if (process.env.NODE_ENV === 'production') {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+  const lightingElementDef = {
+    ctor: LightningElement,
+    name: LightningElement.name,
+    props: lightningBasedDescriptors,
+    propsConfig: EmptyObject,
+    methods: EmptyObject,
+    renderMode: 1
+    /* Shadow */
+    ,
+    shadowSupportMode: "reset"
+    /* Default */
+    ,
+    wire: EmptyObject,
+    bridge: BaseBridgeElement,
+    template: defaultEmptyTemplate,
+    render: LightningElement.prototype.render
+  };
+  /**
+   * EXPERIMENTAL: This function allows for the collection of internal component metadata. This API is
+   * subject to change or being removed.
+   */
 
-    if (runtimeFlags.ENABLE_HMR) {
-      // tracking inactive component
-      const Ctor = vm.def.ctor;
-      let list = activeComponents.get(Ctor);
+  function getComponentDef(Ctor) {
+    const def = getComponentInternalDef(Ctor); // From the internal def object, we need to extract the info that is useful
+    // for some external services, e.g.: Locker Service, usually, all they care
+    // is about the shape of the constructor, the internals of it are not relevant
+    // because they don't have a way to mess with that.
 
-      if (!isUndefined$1(list)) {
-        // deleting the vm from the set to avoid leaking memory
-        list.delete(vm);
-      } // removing inactive template
+    const {
+      ctor,
+      name,
+      props,
+      propsConfig,
+      methods
+    } = def;
+    const publicProps = {};
 
+    for (const key in props) {
+      // avoid leaking the reference to the public props descriptors
+      publicProps[key] = {
+        config: propsConfig[key] || 0,
+        type: "any"
+        /* any */
+        ,
+        attr: htmlPropertyToAttribute(key)
+      };
+    }
 
-      const tpl = vm.cmpTemplate;
+    const publicMethods = {};
 
-      if (tpl) {
-        list = activeTemplates.get(tpl);
+    for (const key in methods) {
+      // avoid leaking the reference to the public method descriptors
+      publicMethods[key] = methods[key].value;
+    }
 
-        if (!isUndefined$1(list)) {
-          // deleting the vm from the set to avoid leaking memory
-          list.delete(vm);
-        } // removing active styles associated to template
+    return {
+      ctor,
+      name,
+      props: publicProps,
+      methods: publicMethods
+    };
+  }
+  /*
+   * 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 styles = tpl.stylesheets;
+  const xlinkNS = 'http://www.w3.org/1999/xlink';
+  const xmlNS = 'http://www.w3.org/XML/1998/namespace';
+  const ColonCharCode = 58;
 
-        if (!isUndefined$1(styles)) {
-          flattenStylesheets(styles).forEach(style => {
-            list = activeStyles.get(style);
+  function patchAttributes(oldVnode, vnode) {
+    const {
+      attrs
+    } = vnode.data;
 
-            if (!isUndefined$1(list)) {
-              // deleting the vm from the set to avoid leaking memory
-              list.delete(vm);
-            }
-          });
-        }
-      }
+    if (isUndefined$1(attrs)) {
+      return;
     }
-  }
 
-  function swapTemplate(oldTpl, newTpl) {
-    if (process.env.NODE_ENV !== 'production') {
-      if (isTemplateRegistered(oldTpl) && isTemplateRegistered(newTpl)) {
-        swappedTemplateMap.set(oldTpl, newTpl);
-        return rehydrateHotTemplate(oldTpl);
-      } else {
-        throw new TypeError(`Invalid Template`);
-      }
-    }
+    const oldAttrs = isNull(oldVnode) ? EmptyObject : oldVnode.data.attrs;
 
-    if (!runtimeFlags.ENABLE_HMR) {
-      throw new Error('HMR is not enabled');
+    if (oldAttrs === attrs) {
+      return;
     }
 
-    return false;
-  }
+    const {
+      elm
+    } = vnode;
 
-  function swapComponent(oldComponent, newComponent) {
-    if (process.env.NODE_ENV !== 'production') {
-      if (isComponentConstructor(oldComponent) && isComponentConstructor(newComponent)) {
-        swappedComponentMap.set(oldComponent, newComponent);
-        return rehydrateHotComponent(oldComponent);
-      } else {
-        throw new TypeError(`Invalid Component`);
+    for (const key in attrs) {
+      const cur = attrs[key];
+      const old = oldAttrs[key];
+
+      if (old !== cur) {
+        unlockAttribute(elm, key);
+
+        if (StringCharCodeAt.call(key, 3) === ColonCharCode) {
+          // Assume xml namespace
+          setAttribute$1(elm, key, cur, xmlNS);
+        } else if (StringCharCodeAt.call(key, 5) === ColonCharCode) {
+          // Assume xlink namespace
+          setAttribute$1(elm, key, cur, xlinkNS);
+        } else if (isNull(cur) || isUndefined$1(cur)) {
+          removeAttribute$1(elm, key);
+        } else {
+          setAttribute$1(elm, key, cur);
+        }
+
+        lockAttribute();
       }
     }
+  }
+  /*
+   * 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
+   */
 
-    if (!runtimeFlags.ENABLE_HMR) {
-      throw new Error('HMR is not enabled');
-    }
 
-    return false;
+  function isLiveBindingProp(sel, key) {
+    // For properties with live bindings, we read values from the DOM element
+    // instead of relying on internally tracked values.
+    return sel === 'input' && (key === 'value' || key === 'checked');
   }
 
-  function swapStyle(oldStyle, newStyle) {
-    if (process.env.NODE_ENV !== 'production') {
-      // TODO [#1887]: once the support for registering styles is implemented
-      // we can add the validation of both styles around this block.
-      swappedStyleMap.set(oldStyle, newStyle);
-      return rehydrateHotStyle(oldStyle);
+  function patchProps(oldVnode, vnode) {
+    const {
+      props
+    } = vnode.data;
+
+    if (isUndefined$1(props)) {
+      return;
     }
 
-    if (!runtimeFlags.ENABLE_HMR) {
-      throw new Error('HMR is not enabled');
+    const oldProps = isNull(oldVnode) ? EmptyObject : oldVnode.data.props;
+
+    if (oldProps === props) {
+      return;
     }
 
-    return false;
+    const isFirstPatch = isNull(oldVnode);
+    const {
+      elm,
+      sel
+    } = vnode;
+
+    for (const key in props) {
+      const cur = props[key]; // Set the property if it's the first time is is patched or if the previous property is
+      // different than the one previously set.
+
+      if (isFirstPatch || cur !== (isLiveBindingProp(sel, key) ? getProperty$1(elm, key) : oldProps[key])) {
+        setProperty$1(elm, key, cur);
+      }
+    }
   }
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -4460,264 +4448,188 @@ var LWC = (function (exports) {
    */
 
 
-  const CtorToDefMap = new WeakMap();
+  const classNameToClassMap = create(null);
 
-  function getCtorProto(Ctor) {
-    let proto = getPrototypeOf$1(Ctor);
+  function getMapFromClassName(className) {
+    // Intentionally using == to match undefined and null values from computed style attribute
+    if (className == null) {
+      return EmptyObject;
+    } // computed class names must be string
 
-    if (isNull(proto)) {
-      throw new ReferenceError(`Invalid prototype chain for ${Ctor.name}, you must extend LightningElement.`);
-    } // covering the cases where the ref is circular in AMD
 
+    className = isString(className) ? className : className + '';
+    let map = classNameToClassMap[className];
 
-    if (isCircularModuleDependency(proto)) {
-      const p = resolveCircularModuleDependency(proto);
+    if (map) {
+      return map;
+    }
 
-      if (process.env.NODE_ENV !== 'production') {
-        if (isNull(p)) {
-          throw new ReferenceError(`Circular module dependency for ${Ctor.name}, must resolve to a constructor that extends LightningElement.`);
-        }
-      } // escape hatch for Locker and other abstractions to provide their own base class instead
-      // of our Base class without having to leak it to user-land. If the circular function returns
-      // itself, that's the signal that we have hit the end of the proto chain, which must always
-      // be base.
+    map = create(null);
+    let start = 0;
+    let o;
+    const len = className.length;
 
+    for (o = 0; o < len; o++) {
+      if (StringCharCodeAt.call(className, o) === SPACE_CHAR) {
+        if (o > start) {
+          map[StringSlice.call(className, start, o)] = true;
+        }
 
-      proto = p === proto ? LightningElement : p;
+        start = o + 1;
+      }
     }
 
-    return proto;
-  }
+    if (o > start) {
+      map[StringSlice.call(className, start, o)] = true;
+    }
 
-  function createComponentDef(Ctor) {
-    const {
-      shadowSupportMode: ctorShadowSupportMode,
-      renderMode: ctorRenderMode
-    } = Ctor;
+    classNameToClassMap[className] = map;
 
     if (process.env.NODE_ENV !== 'production') {
-      const ctorName = Ctor.name; // Removing the following assert until https://bugs.webkit.org/show_bug.cgi?id=190140 is fixed.
-      // assert.isTrue(ctorName && isString(ctorName), `${toString(Ctor)} should have a "name" property with string value, but found ${ctorName}.`);
-
-      assert.isTrue(Ctor.constructor, `Missing ${ctorName}.constructor, ${ctorName} should have a "constructor" property.`);
-
-      if (!isUndefined$1(ctorShadowSupportMode)) {
-        assert.invariant(ctorShadowSupportMode === "any"
-        /* Any */
-        || ctorShadowSupportMode === "reset"
-        /* Default */
-        , `Invalid value for static property shadowSupportMode: '${ctorShadowSupportMode}'`);
-      }
-
-      if (!isUndefined$1(ctorRenderMode)) {
-        assert.invariant(ctorRenderMode === 'light' || ctorRenderMode === 'shadow', `Invalid value for static property renderMode: '${ctorRenderMode}'. renderMode must be either 'light' or 'shadow'.`);
-      }
+      // just to make sure that this object never changes as part of the diffing algo
+      freeze(map);
     }
 
-    const decoratorsMeta = getDecoratorsMeta(Ctor);
+    return map;
+  }
+
+  function patchClassAttribute(oldVnode, vnode) {
     const {
-      apiFields,
-      apiFieldsConfig,
-      apiMethods,
-      wiredFields,
-      wiredMethods,
-      observedFields
-    } = decoratorsMeta;
-    const proto = Ctor.prototype;
-    let {
-      connectedCallback,
-      disconnectedCallback,
-      renderedCallback,
-      errorCallback,
-      render
-    } = proto;
-    const superProto = getCtorProto(Ctor);
-    const superDef = superProto !== LightningElement ? getComponentInternalDef(superProto) : lightingElementDef;
-    const bridge = HTMLBridgeElementFactory(superDef.bridge, keys(apiFields), keys(apiMethods));
-    const props = assign(create(null), superDef.props, apiFields);
-    const propsConfig = assign(create(null), superDef.propsConfig, apiFieldsConfig);
-    const methods = assign(create(null), superDef.methods, apiMethods);
-    const wire = assign(create(null), superDef.wire, wiredFields, wiredMethods);
-    connectedCallback = connectedCallback || superDef.connectedCallback;
-    disconnectedCallback = disconnectedCallback || superDef.disconnectedCallback;
-    renderedCallback = renderedCallback || superDef.renderedCallback;
-    errorCallback = errorCallback || superDef.errorCallback;
-    render = render || superDef.render;
-    let shadowSupportMode = superDef.shadowSupportMode;
+      elm,
+      data: {
+        className: newClass
+      }
+    } = vnode;
+    const oldClass = isNull(oldVnode) ? undefined : oldVnode.data.className;
 
-    if (!isUndefined$1(ctorShadowSupportMode)) {
-      shadowSupportMode = ctorShadowSupportMode;
+    if (oldClass === newClass) {
+      return;
     }
 
-    let renderMode = superDef.renderMode;
+    const classList = getClassList$1(elm);
+    const newClassMap = getMapFromClassName(newClass);
+    const oldClassMap = getMapFromClassName(oldClass);
+    let name;
 
-    if (!isUndefined$1(ctorRenderMode)) {
-      renderMode = ctorRenderMode === 'light' ? 0
-      /* Light */
-      : 1
-      /* Shadow */
-      ;
+    for (name in oldClassMap) {
+      // remove only if it is not in the new class collection and it is not set from within the instance
+      if (isUndefined$1(newClassMap[name])) {
+        classList.remove(name);
+      }
     }
 
-    const template = getComponentRegisteredTemplate(Ctor) || superDef.template;
-    const name = Ctor.name || superDef.name; // installing observed fields into the prototype.
-
-    defineProperties(proto, observedFields);
-    const def = {
-      ctor: Ctor,
-      name,
-      wire,
-      props,
-      propsConfig,
-      methods,
-      bridge,
-      template,
-      renderMode,
-      shadowSupportMode,
-      connectedCallback,
-      disconnectedCallback,
-      renderedCallback,
-      errorCallback,
-      render
-    };
-
-    if (process.env.NODE_ENV !== 'production') {
-      freeze(Ctor.prototype);
+    for (name in newClassMap) {
+      if (isUndefined$1(oldClassMap[name])) {
+        classList.add(name);
+      }
     }
-
-    return def;
   }
-  /**
-   * EXPERIMENTAL: This function allows for the identification of LWC constructors. This API is
-   * subject to change or being removed.
+  /*
+   * 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 isComponentConstructor(ctor) {
-    if (!isFunction$1(ctor)) {
-      return false;
-    } // Fast path: LightningElement is part of the prototype chain of the constructor.
-
-
-    if (ctor.prototype instanceof LightningElement) {
-      return true;
-    } // Slow path: LightningElement is not part of the prototype chain of the constructor, we need
-    // climb up the constructor prototype chain to check in case there are circular dependencies
-    // to resolve.
-
-
-    let current = ctor;
-
-    do {
-      if (isCircularModuleDependency(current)) {
-        const circularResolved = resolveCircularModuleDependency(current); // If the circular function returns itself, that's the signal that we have hit the end
-        // of the proto chain, which must always be a valid base constructor.
-
-        if (circularResolved === current) {
-          return true;
-        }
-
-        current = circularResolved;
+  function patchStyleAttribute(oldVnode, vnode) {
+    const {
+      elm,
+      data: {
+        style: newStyle
       }
+    } = vnode;
+    const oldStyle = isNull(oldVnode) ? undefined : oldVnode.data.style;
 
-      if (current === LightningElement) {
-        return true;
-      }
-    } while (!isNull(current) && (current = getPrototypeOf$1(current))); // Finally return false if the LightningElement is not part of the prototype chain.
+    if (oldStyle === newStyle) {
+      return;
+    }
+
+    if (!isString(newStyle) || newStyle === '') {
+      removeAttribute$1(elm, 'style');
+    } else {
+      setAttribute$1(elm, 'style', newStyle);
+    }
+  }
+  /*
+   * 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
+   */
 
 
-    return false;
-  }
+  function applyEventListeners(vnode) {
+    const {
+      elm,
+      data: {
+        on
+      }
+    } = vnode;
 
-  function getComponentInternalDef(Ctor) {
-    if (process.env.NODE_ENV !== 'production') {
-      Ctor = getComponentOrSwappedComponent(Ctor);
+    if (isUndefined$1(on)) {
+      return;
     }
 
-    let def = CtorToDefMap.get(Ctor);
-
-    if (isUndefined$1(def)) {
-      if (isCircularModuleDependency(Ctor)) {
-        const resolvedCtor = resolveCircularModuleDependency(Ctor);
-        def = getComponentInternalDef(resolvedCtor); // Cache the unresolved component ctor too. The next time if the same unresolved ctor is used,
-        // look up the definition in cache instead of re-resolving and recreating the def.
+    for (const name in on) {
+      const handler = on[name];
+      addEventListener$1(elm, name, handler);
+    }
+  }
+  /*
+   * 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
+   */
+  // The compiler takes care of transforming the inline classnames into an object. It's faster to set the
+  // different classnames properties individually instead of via a string.
 
-        CtorToDefMap.set(Ctor, def);
-        return def;
-      }
 
-      if (!isComponentConstructor(Ctor)) {
-        throw new TypeError(`${Ctor} is not a valid component, or does not extends LightningElement from "lwc". You probably forgot to add the extend clause on the class declaration.`);
+  function applyStaticClassAttribute(vnode) {
+    const {
+      elm,
+      data: {
+        classMap
       }
+    } = vnode;
 
-      def = createComponentDef(Ctor);
-      CtorToDefMap.set(Ctor, def);
+    if (isUndefined$1(classMap)) {
+      return;
     }
 
-    return def;
-  }
+    const classList = getClassList$1(elm);
 
-  const lightingElementDef = {
-    ctor: LightningElement,
-    name: LightningElement.name,
-    props: lightningBasedDescriptors,
-    propsConfig: EmptyObject,
-    methods: EmptyObject,
-    renderMode: 1
-    /* Shadow */
-    ,
-    shadowSupportMode: "reset"
-    /* Default */
-    ,
-    wire: EmptyObject,
-    bridge: BaseBridgeElement,
-    template: defaultEmptyTemplate,
-    render: LightningElement.prototype.render
-  };
-  /**
-   * EXPERIMENTAL: This function allows for the collection of internal component metadata. This API is
-   * subject to change or being removed.
+    for (const name in classMap) {
+      classList.add(name);
+    }
+  }
+  /*
+   * 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
    */
+  // The compiler takes care of transforming the inline style into an object. It's faster to set the
+  // different style properties individually instead of via a string.
 
-  function getComponentDef(Ctor) {
-    const def = getComponentInternalDef(Ctor); // From the internal def object, we need to extract the info that is useful
-    // for some external services, e.g.: Locker Service, usually, all they care
-    // is about the shape of the constructor, the internals of it are not relevant
-    // because they don't have a way to mess with that.
 
+  function applyStaticStyleAttribute(vnode) {
     const {
-      ctor,
-      name,
-      props,
-      propsConfig,
-      methods
-    } = def;
-    const publicProps = {};
+      elm,
+      data: {
+        styleDecls
+      }
+    } = vnode;
 
-    for (const key in props) {
-      // avoid leaking the reference to the public props descriptors
-      publicProps[key] = {
-        config: propsConfig[key] || 0,
-        type: "any"
-        /* any */
-        ,
-        attr: htmlPropertyToAttribute(key)
-      };
+    if (isUndefined$1(styleDecls)) {
+      return;
     }
 
-    const publicMethods = {};
-
-    for (const key in methods) {
-      // avoid leaking the reference to the public method descriptors
-      publicMethods[key] = methods[key].value;
+    for (let i = 0; i < styleDecls.length; i++) {
+      const [prop, value, important] = styleDecls[i];
+      setCSSStyleProperty$1(elm, prop, value, important);
     }
-
-    return {
-      ctor,
-      name,
-      props: publicProps,
-      methods: publicMethods
-    };
   }
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -4791,28 +4703,24 @@ var LWC = (function (exports) {
     }
   }
 
-  function createElmHook(vnode) {
-    modEvents.create(vnode); // Attrs need to be applied to element before props
-    // IE11 will wipe out value on radio inputs if value
-    // is set before type=radio.
+  function patchElementPropsAndAttrs(oldVnode, vnode) {
+    if (isNull(oldVnode)) {
+      applyEventListeners(vnode);
+      applyStaticClassAttribute(vnode);
+      applyStaticStyleAttribute(vnode);
+    } // Attrs need to be applied to element before props IE11 will wipe out value on radio inputs if
+    // value is set before type=radio.
 
-    modAttrs.create(vnode);
-    modProps.create(vnode);
-    modStaticClassName.create(vnode);
-    modStaticStyle.create(vnode);
-    modComputedClassName.create(vnode);
-    modComputedStyle.create(vnode);
+
+    patchClassAttribute(oldVnode, vnode);
+    patchStyleAttribute(oldVnode, vnode);
+    patchAttributes(oldVnode, vnode);
+    patchProps(oldVnode, vnode);
   }
 
   function hydrateElmHook(vnode) {
-    modEvents.create(vnode); // Attrs are already on the element.
-    // modAttrs.create(vnode);
-
-    modProps.create(vnode); // Already set.
-    // modStaticClassName.create(vnode);
-    // modStaticStyle.create(vnode);
-    // modComputedClassName.create(vnode);
-    // modComputedStyle.create(vnode);
+    applyEventListeners(vnode);
+    patchProps(null, vnode);
   }
 
   function fallbackElmHook(elm, vnode) {
@@ -4864,26 +4772,11 @@ var LWC = (function (exports) {
     }
   }
 
-  function updateElmHook(oldVnode, vnode) {
-    // Attrs need to be applied to element before props
-    // IE11 will wipe out value on radio inputs if value
-    // is set before type=radio.
-    modAttrs.update(oldVnode, vnode);
-    modProps.update(oldVnode, vnode);
-    modComputedClassName.update(oldVnode, vnode);
-    modComputedStyle.update(oldVnode, vnode);
-  }
-
-  function updateChildrenHook(oldVnode, vnode) {
-    const {
-      elm,
-      children
-    } = vnode;
-
-    if (hasDynamicChildren(children)) {
-      updateDynamicChildren(elm, oldVnode.children, children);
+  function patchChildren(parent, oldCh, newCh) {
+    if (hasDynamicChildren(newCh)) {
+      updateDynamicChildren(parent, oldCh, newCh);
     } else {
-      updateStaticChildren(elm, oldVnode.children, children);
+      updateStaticChildren(parent, oldCh, newCh);
     }
   }
 
@@ -4958,19 +4851,6 @@ var LWC = (function (exports) {
     }
   }
 
-  function createCustomElmHook(vnode) {
-    modEvents.create(vnode); // Attrs need to be applied to element before props
-    // IE11 will wipe out value on radio inputs if value
-    // is set before type=radio.
-
-    modAttrs.create(vnode);
-    modProps.create(vnode);
-    modStaticClassName.create(vnode);
-    modStaticStyle.create(vnode);
-    modComputedClassName.create(vnode);
-    modComputedStyle.create(vnode);
-  }
-
   function createChildrenHook(vnode) {
     const {
       elm,
@@ -5151,16 +5031,6 @@ var LWC = (function (exports) {
     }
   }
 
-  function updateCustomElmHook(oldVnode, vnode) {
-    // Attrs need to be applied to element before props
-    // IE11 will wipe out value on radio inputs if value
-    // is set before type=radio.
-    modAttrs.update(oldVnode, vnode);
-    modProps.update(oldVnode, vnode);
-    modComputedClassName.update(oldVnode, vnode);
-    modComputedStyle.update(oldVnode, vnode);
-  }
-
   function removeElmHook(vnode) {
     // this method only needs to search on child vnodes from template
     // to trigger the remove hook just in case some of those children
@@ -5177,6 +5047,66 @@ var LWC = (function (exports) {
         ch.hook.remove(ch, elm);
       }
     }
+  }
+
+  function allocateInSlot(vm, children) {
+    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];
+
+      if (isNull(vnode)) {
+        continue;
+      }
+
+      const {
+        data
+      } = vnode;
+      const slotName = data.attrs && data.attrs.slot || '';
+      const vnodes = cmpSlots[slotName] = cmpSlots[slotName] || []; // re-keying the vnodes is necessary to avoid conflicts with default content for the slot
+      // which might have similar keys. Each vnode will always have a key that
+      // starts with a numeric character from compiler. In this case, we add a unique
+      // notation for slotted vnodes keys, e.g.: `@foo:1:1`
+
+      if (!isUndefined$1(vnode.key)) {
+        vnode.key = `@${slotName}:${vnode.key}`;
+      }
+
+      ArrayPush$1.call(vnodes, vnode);
+    }
+
+    if (isFalse(vm.isDirty)) {
+      // We need to determine if the old allocation is really different from the new one
+      // and mark the vm as dirty
+      const oldKeys = keys(oldSlots);
+
+      if (oldKeys.length !== keys(cmpSlots).length) {
+        markComponentAsDirty(vm);
+        return;
+      }
+
+      for (let i = 0, len = oldKeys.length; i < len; i += 1) {
+        const key = oldKeys[i];
+
+        if (isUndefined$1(cmpSlots[key]) || oldSlots[key].length !== cmpSlots[key].length) {
+          markComponentAsDirty(vm);
+          return;
+        }
+
+        const oldVNodes = oldSlots[key];
+        const vnodes = cmpSlots[key];
+
+        for (let j = 0, a = cmpSlots[key].length; j < a; j += 1) {
+          if (oldVNodes[j] !== vnodes[j]) {
+            markComponentAsDirty(vm);
+            return;
+          }
+        }
+      }
+    }
   } // Using a WeakMap instead of a WeakSet because this one works in IE11 :(
 
 
@@ -5323,11 +5253,11 @@ var LWC = (function (exports) {
       linkNodeToShadow(elm, owner);
       fallbackElmHook(elm, vnode);
       vnode.elm = elm;
-      createElmHook(vnode);
+      patchElementPropsAndAttrs(null, vnode);
     },
     update: (oldVnode, vnode) => {
-      updateElmHook(oldVnode, vnode);
-      updateChildrenHook(oldVnode, vnode);
+      patchElementPropsAndAttrs(oldVnode, vnode);
+      patchChildren(vnode.elm, oldVnode.children, vnode.children);
     },
     insert: (vnode, parentNode, referenceNode) => {
       insertNodeHook(vnode, parentNode, referenceNode);
@@ -5401,10 +5331,10 @@ var LWC = (function (exports) {
         throw new TypeError(`Incorrect Component Constructor`);
       }
 
-      createCustomElmHook(vnode);
+      patchElementPropsAndAttrs(null, vnode);
     },
     update: (oldVnode, vnode) => {
-      updateCustomElmHook(oldVnode, vnode);
+      patchElementPropsAndAttrs(oldVnode, vnode);
       const vm = getAssociatedVMIfPresent(vnode.elm);
 
       if (vm) {
@@ -5415,7 +5345,7 @@ var LWC = (function (exports) {
       // will happen, but in native, it does allocate the light dom
 
 
-      updateChildrenHook(oldVnode, vnode);
+      patchChildren(vnode.elm, oldVnode.children, vnode.children);
 
       if (vm) {
         if (process.env.NODE_ENV !== 'production') {
@@ -7115,7 +7045,6 @@ var LWC = (function (exports) {
       // patch function mutates vnodes by adding the element reference,
       // however, if patching fails it contains partial changes.
       if (oldCh !== newCh) {
-        const fn = hasDynamicChildren(newCh) ? updateDynamicChildren : updateStaticChildren;
         runWithBoundaryProtection(vm, vm, () => {
           // pre
           logOperationStart(2
@@ -7123,8 +7052,8 @@ var LWC = (function (exports) {
           , vm);
         }, () => {
           // job
-          const elementToRenderTo = getRenderRoot(vm);
-          fn(elementToRenderTo, oldCh, newCh);
+          const renderRoot = getRenderRoot(vm);
+          patchChildren(renderRoot, oldCh, newCh);
         }, () => {
           // post
           logOperationEnd(2
@@ -7419,69 +7348,6 @@ var LWC = (function (exports) {
 
       currentVm = currentVm.owner;
     }
-  } // slow path routine
-  // NOTE: we should probably more this routine to the synthetic shadow folder
-  // and get the allocation to be cached by in the elm instead of in the VM
-
-
-  function allocateInSlot(vm, children) {
-    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];
-
-      if (isNull(vnode)) {
-        continue;
-      }
-
-      const {
-        data
-      } = vnode;
-      const slotName = data.attrs && data.attrs.slot || '';
-      const vnodes = cmpSlots[slotName] = cmpSlots[slotName] || []; // re-keying the vnodes is necessary to avoid conflicts with default content for the slot
-      // which might have similar keys. Each vnode will always have a key that
-      // starts with a numeric character from compiler. In this case, we add a unique
-      // notation for slotted vnodes keys, e.g.: `@foo:1:1`
-
-      if (!isUndefined$1(vnode.key)) {
-        vnode.key = `@${slotName}:${vnode.key}`;
-      }
-
-      ArrayPush$1.call(vnodes, vnode);
-    }
-
-    if (isFalse(vm.isDirty)) {
-      // We need to determine if the old allocation is really different from the new one
-      // and mark the vm as dirty
-      const oldKeys = keys(oldSlots);
-
-      if (oldKeys.length !== keys(cmpSlots).length) {
-        markComponentAsDirty(vm);
-        return;
-      }
-
-      for (let i = 0, len = oldKeys.length; i < len; i += 1) {
-        const key = oldKeys[i];
-
-        if (isUndefined$1(cmpSlots[key]) || oldSlots[key].length !== cmpSlots[key].length) {
-          markComponentAsDirty(vm);
-          return;
-        }
-
-        const oldVNodes = oldSlots[key];
-        const vnodes = cmpSlots[key];
-
-        for (let j = 0, a = cmpSlots[key].length; j < a; j += 1) {
-          if (oldVNodes[j] !== vnodes[j]) {
-            markComponentAsDirty(vm);
-            return;
-          }
-        }
-      }
-    }
   }
 
   function runWithBoundaryProtection(vm, owner, pre, job, post) {
@@ -7932,7 +7798,7 @@ var LWC = (function (exports) {
     hooksAreSet = true;
     setSanitizeHtmlContentHook(hooks.sanitizeHtmlContent);
   }
-  /* version: 2.7.2 */
+  /* version: 2.7.3 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -8634,7 +8500,7 @@ var LWC = (function (exports) {
   });
   freeze(LightningElement);
   seal(LightningElement.prototype);
-  /* version: 2.7.2 */
+  /* version: 2.7.3 */
 
   exports.LightningElement = LightningElement;
   exports.__unstable__ProfilerControl = profilerControl;