lwc 2.7.2 → 2.7.3

package/dist/engine-dom/umd/es5/engine-dom_debug.js

@@ -344,7 +344,7 @@
     CACHED_PROPERTY_ATTRIBUTE_MAPPING.set(propName, attributeName);
     return attributeName;
   }
-  /** version: 2.7.2 */
+  /** version: 2.7.3 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -514,7 +514,7 @@
 
   function setFeatureFlagForTest(name, value) {
   }
-  /** version: 2.7.2 */
+  /** version: 2.7.3 */
 
   /* proxy-compat-disable */
 
@@ -1007,52 +1007,205 @@
    */
 
 
-  function handleEvent(event, vnode) {
-    var type = event.type;
-    var on = vnode.data.on;
-    var 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) {
+    var map = {};
+    var j, key, ch; // TODO [#1637]: simplify this by assuming that all vnodes has keys
+
+    for (j = beginIdx; j <= endIdx; ++j) {
+      ch = children[j];
+
+      if (isVNode(ch)) {
+        key = ch.key;
 
-    if (handler) {
-      handler.call(undefined, event);
+        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) {
+      var 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) {
+      var ch = vnodes[startIdx]; // text nodes do not have logic associated to them
+
+      if (isVNode(ch)) {
+        ch.hook.remove(ch, parentElm);
+      }
     }
   }
 
-  function createAllEventListeners(vnode) {
-    var elm = vnode.elm,
-        on = vnode.data.on;
+  function updateDynamicChildren(parentElm, oldCh, newCh) {
+    var oldStartIdx = 0;
+    var newStartIdx = 0;
+    var oldEndIdx = oldCh.length - 1;
+    var oldStartVnode = oldCh[0];
+    var oldEndVnode = oldCh[oldEndIdx];
+    var newChEnd = newCh.length - 1;
+    var newEndIdx = newChEnd;
+    var newStartVnode = newCh[0];
+    var newEndVnode = newCh[newEndIdx];
+    var oldKeyToIdx;
+    var idxInOld;
+    var elmToMove;
+    var before;
 
-    if (isUndefined$1(on)) {
+    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.
+        var _i6 = newEndIdx;
+        var n;
+
+        do {
+          n = newCh[++_i6];
+        } while (!isVNode(n) && _i6 < newChEnd);
+
+        before = isVNode(n) ? n.elm : null;
+        addVnodes(parentElm, before, newCh, newStartIdx, newEndIdx);
+      } else {
+        removeVnodes(parentElm, oldCh, oldStartIdx, oldEndIdx);
+      }
+    }
+  }
+
+  function updateStaticChildren(parentElm, oldCh, newCh) {
+    var oldChLength = oldCh.length;
+    var newChLength = newCh.length;
+
+    if (oldChLength === 0) {
+      // the old list is empty, we can directly insert anything new
+      addVnodes(parentElm, null, newCh, 0, newChLength);
       return;
     }
 
-    var listener = vnode.listener = createListener();
-    listener.vnode = vnode;
-    var 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
+
+
+    var referenceElm = null;
+
+    for (var _i7 = newChLength - 1; _i7 >= 0; _i7 -= 1) {
+      var vnode = newCh[_i7];
+      var oldVNode = oldCh[_i7];
+
+      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.
@@ -1060,6 +1213,7 @@
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
 
+
   var defaultDefHTMLPropertyNames = ['accessKey', 'dir', 'draggable', 'hidden', 'id', 'lang', 'spellcheck', 'tabIndex', 'title'];
 
   function offsetPropertyErrorMessage(name) {
@@ -1177,64 +1331,12 @@
    * 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.
 
 
-  var xlinkNS = 'http://www.w3.org/1999/xlink';
-  var xmlNS = 'http://www.w3.org/XML/1998/namespace';
-  var ColonCharCode = 58;
-
-  function updateAttrs(oldVnode, vnode) {
-    var attrs = vnode.data.attrs;
-
-    if (isUndefined$1(attrs)) {
-      return;
-    }
-
-    var oldAttrs = oldVnode.data.attrs;
-
-    if (oldAttrs === attrs) {
-      return;
-    }
-
-    var elm = vnode.elm;
-    var 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)
-
-    for (key in attrs) {
-      var cur = attrs[key];
-      var 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();
-      }
-    }
-  }
-
-  var emptyVNode$3 = {
-    data: {}
-  };
-  var modAttrs = {
-    create: function create(vnode) {
-      return updateAttrs(emptyVNode$3, vnode);
-    },
-    update: updateAttrs
-  };
+  var HTMLElementConstructor$1 = typeof HTMLElement !== 'undefined' ? HTMLElement : function () {};
+  var HTMLElementPrototype = HTMLElementConstructor$1.prototype;
   /*
    * Copyright (c) 2018, salesforce.com, inc.
    * All rights reserved.
@@ -1242,1109 +1344,1077 @@
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
 
-  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');
-  }
+  /**
+   * 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.
+   */
 
-  function update(oldVnode, vnode) {
-    var props = vnode.data.props;
+  var HTMLElementOriginalDescriptors = create(null);
+  forEach.call(keys(AriaPropNameToAttrNameMap), function (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.
+    var descriptor = getPropertyDescriptor(HTMLElementPrototype, propName);
 
-    if (isUndefined$1(props)) {
-      return;
+    if (!isUndefined$1(descriptor)) {
+      HTMLElementOriginalDescriptors[propName] = descriptor;
     }
-
-    var oldProps = oldVnode.data.props;
-
-    if (oldProps === props) {
-      return;
+  });
+  forEach.call(defaultDefHTMLPropertyNames, function (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.
+    var descriptor = getPropertyDescriptor(HTMLElementPrototype, propName);
+
+    if (!isUndefined$1(descriptor)) {
+      HTMLElementOriginalDescriptors[propName] = descriptor;
     }
+  });
+  /**
+   * Copyright (C) 2017 salesforce.com, inc.
+   */
 
-    var isFirstPatch = isUndefined$1(oldProps);
-    var elm = vnode.elm,
-        sel = vnode.sel;
+  var isArray = Array.isArray;
+  var ObjectDotPrototype = Object.prototype,
+      _getPrototypeOf = Object.getPrototypeOf,
+      ObjectCreate = Object.create,
+      ObjectDefineProperty = Object.defineProperty,
+      _isExtensible = Object.isExtensible,
+      _getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor,
+      getOwnPropertyNames = Object.getOwnPropertyNames,
+      getOwnPropertySymbols = Object.getOwnPropertySymbols,
+      _preventExtensions = Object.preventExtensions,
+      hasOwnProperty = Object.hasOwnProperty;
+  var _Array$prototype2 = Array.prototype,
+      ArrayPush = _Array$prototype2.push,
+      ArrayConcat = _Array$prototype2.concat;
 
-    for (var key in props) {
-      var cur = props[key]; // if it is the first time this element is patched, or the current value is different to the previous value...
+  function isUndefined(obj) {
+    return obj === undefined;
+  }
 
-      if (isFirstPatch || cur !== (isLiveBindingProp(sel, key) ? getProperty$1(elm, key) : oldProps[key])) {
-        setProperty$1(elm, key, cur);
-      }
-    }
+  function isFunction(obj) {
+    return typeof obj === 'function';
   }
 
-  var emptyVNode$2 = {
-    data: {}
-  };
-  var modProps = {
-    create: function create(vnode) {
-      return update(emptyVNode$2, vnode);
-    },
-    update: 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
-   */
+  var proxyToValueMap = new WeakMap();
 
-  var classNameToClassMap = create(null);
+  function registerProxy(proxy, value) {
+    proxyToValueMap.set(proxy, value);
+  }
 
-  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
+  var unwrap$1 = function unwrap$1(replicaOrAny) {
+    return proxyToValueMap.get(replicaOrAny) || replicaOrAny;
+  };
+
+  var BaseProxyHandler = /*#__PURE__*/function () {
+    function BaseProxyHandler(membrane, value) {
+      _classCallCheck(this, BaseProxyHandler);
 
+      this.originalTarget = value;
+      this.membrane = membrane;
+    } // Shared utility methods
 
-    className = isString(className) ? className : className + '';
-    var map = classNameToClassMap[className];
 
-    if (map) {
-      return map;
-    }
+    _createClass(BaseProxyHandler, [{
+      key: "wrapDescriptor",
+      value: function wrapDescriptor(descriptor) {
+        if (hasOwnProperty.call(descriptor, 'value')) {
+          descriptor.value = this.wrapValue(descriptor.value);
+        } else {
+          var originalSet = descriptor.set,
+              originalGet = descriptor.get;
 
-    map = create(null);
-    var start = 0;
-    var o;
-    var len = className.length;
+          if (!isUndefined(originalGet)) {
+            descriptor.get = this.wrapGetter(originalGet);
+          }
 
-    for (o = 0; o < len; o++) {
-      if (StringCharCodeAt.call(className, o) === SPACE_CHAR) {
-        if (o > start) {
-          map[StringSlice.call(className, start, o)] = true;
+          if (!isUndefined(originalSet)) {
+            descriptor.set = this.wrapSetter(originalSet);
+          }
         }
 
-        start = o + 1;
+        return descriptor;
       }
-    }
-
-    if (o > start) {
-      map[StringSlice.call(className, start, o)] = true;
-    }
+    }, {
+      key: "copyDescriptorIntoShadowTarget",
+      value: function copyDescriptorIntoShadowTarget(shadowTarget, key) {
+        var originalTarget = this.originalTarget; // Note: a property might get defined multiple times in the shadowTarget
+        //       but it will always be compatible with the previous descriptor
+        //       to preserve the object invariants, which makes these lines safe.
 
-    classNameToClassMap[className] = map;
+        var originalDescriptor = _getOwnPropertyDescriptor(originalTarget, key); // TODO: it should be impossible for the originalDescriptor to ever be undefined, this `if` can be removed
 
-    return map;
-  }
+        /* istanbul ignore else */
 
-  function updateClassAttribute(oldVnode, vnode) {
-    var elm = vnode.elm,
-        newClass = vnode.data.className;
-    var oldClass = oldVnode.data.className;
 
-    if (oldClass === newClass) {
-      return;
-    }
+        if (!isUndefined(originalDescriptor)) {
+          var wrappedDesc = this.wrapDescriptor(originalDescriptor);
+          ObjectDefineProperty(shadowTarget, key, wrappedDesc);
+        }
+      }
+    }, {
+      key: "lockShadowTarget",
+      value: function lockShadowTarget(shadowTarget) {
+        var _this = this;
 
-    var classList = getClassList$1(elm);
-    var newClassMap = getMapFromClassName(newClass);
-    var oldClassMap = getMapFromClassName(oldClass);
-    var name;
+        var originalTarget = this.originalTarget;
+        var targetKeys = ArrayConcat.call(getOwnPropertyNames(originalTarget), getOwnPropertySymbols(originalTarget));
+        targetKeys.forEach(function (key) {
+          _this.copyDescriptorIntoShadowTarget(shadowTarget, key);
+        });
+        var tagPropertyKey = this.membrane.tagPropertyKey;
 
-    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);
-      }
-    }
+        if (!isUndefined(tagPropertyKey) && !hasOwnProperty.call(shadowTarget, tagPropertyKey)) {
+          ObjectDefineProperty(shadowTarget, tagPropertyKey, ObjectCreate(null));
+        }
 
-    for (name in newClassMap) {
-      if (isUndefined$1(oldClassMap[name])) {
-        classList.add(name);
-      }
-    }
-  }
+        _preventExtensions(shadowTarget);
+      } // Shared Traps
+      // TODO: apply() is never called
 
-  var emptyVNode$1 = {
-    data: {}
-  };
-  var modComputedClassName = {
-    create: function create(vnode) {
-      return 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
-   */
+      /* istanbul ignore next */
 
-  function updateStyleAttribute(oldVnode, vnode) {
-    var elm = vnode.elm,
-        newStyle = vnode.data.style;
+    }, {
+      key: "apply",
+      value: function apply(shadowTarget, thisArg, argArray) {
+        /* No op */
+      } // TODO: construct() is never called
 
-    if (oldVnode.data.style === newStyle) {
-      return;
-    }
+      /* istanbul ignore next */
 
-    if (!isString(newStyle) || newStyle === '') {
-      removeAttribute$1(elm, 'style');
-    } else {
-      setAttribute$1(elm, 'style', newStyle);
-    }
-  }
+    }, {
+      key: "construct",
+      value: function construct(shadowTarget, argArray, newTarget) {
+        /* No op */
+      }
+    }, {
+      key: "get",
+      value: function get(shadowTarget, key) {
+        var originalTarget = this.originalTarget,
+            valueObserved = this.membrane.valueObserved;
+        var value = originalTarget[key];
+        valueObserved(originalTarget, key);
+        return this.wrapValue(value);
+      }
+    }, {
+      key: "has",
+      value: function has(shadowTarget, key) {
+        var originalTarget = this.originalTarget,
+            _this$membrane = this.membrane,
+            tagPropertyKey = _this$membrane.tagPropertyKey,
+            valueObserved = _this$membrane.valueObserved;
+        valueObserved(originalTarget, key); // since key is never going to be undefined, and tagPropertyKey might be undefined
+        // we can simply compare them as the second part of the condition.
 
-  var emptyVNode = {
-    data: {}
-  };
-  var modComputedStyle = {
-    create: function create(vnode) {
-      return 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.
+        return key in originalTarget || key === tagPropertyKey;
+      }
+    }, {
+      key: "ownKeys",
+      value: function ownKeys(shadowTarget) {
+        var originalTarget = this.originalTarget,
+            tagPropertyKey = this.membrane.tagPropertyKey; // if the membrane tag key exists and it is not in the original target, we add it to the keys.
 
-  function createClassAttribute(vnode) {
-    var elm = vnode.elm,
-        classMap = vnode.data.classMap;
+        var keys = isUndefined(tagPropertyKey) || hasOwnProperty.call(originalTarget, tagPropertyKey) ? [] : [tagPropertyKey]; // small perf optimization using push instead of concat to avoid creating an extra array
 
-    if (isUndefined$1(classMap)) {
-      return;
-    }
+        ArrayPush.apply(keys, getOwnPropertyNames(originalTarget));
+        ArrayPush.apply(keys, getOwnPropertySymbols(originalTarget));
+        return keys;
+      }
+    }, {
+      key: "isExtensible",
+      value: function isExtensible(shadowTarget) {
+        var originalTarget = this.originalTarget; // optimization to avoid attempting to lock down the shadowTarget multiple times
 
-    var classList = getClassList$1(elm);
+        if (!_isExtensible(shadowTarget)) {
+          return false; // was already locked down
+        }
 
-    for (var name in classMap) {
-      classList.add(name);
-    }
-  }
+        if (!_isExtensible(originalTarget)) {
+          this.lockShadowTarget(shadowTarget);
+          return false;
+        }
 
-  var modStaticClassName = {
-    create: createClassAttribute
-  };
-  /*
-   * 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.
+        return true;
+      }
+    }, {
+      key: "getPrototypeOf",
+      value: function getPrototypeOf(shadowTarget) {
+        var originalTarget = this.originalTarget;
+        return _getPrototypeOf(originalTarget);
+      }
+    }, {
+      key: "getOwnPropertyDescriptor",
+      value: function getOwnPropertyDescriptor(shadowTarget, key) {
+        var originalTarget = this.originalTarget,
+            _this$membrane2 = this.membrane,
+            valueObserved = _this$membrane2.valueObserved,
+            tagPropertyKey = _this$membrane2.tagPropertyKey; // keys looked up via getOwnPropertyDescriptor need to be reactive
 
-  function createStyleAttribute(vnode) {
-    var elm = vnode.elm,
-        styleDecls = vnode.data.styleDecls;
+        valueObserved(originalTarget, key);
 
-    if (isUndefined$1(styleDecls)) {
-      return;
-    }
+        var desc = _getOwnPropertyDescriptor(originalTarget, key);
 
-    for (var _i6 = 0; _i6 < styleDecls.length; _i6++) {
-      var _styleDecls$_i = _slicedToArray(styleDecls[_i6], 3),
-          prop = _styleDecls$_i[0],
-          value = _styleDecls$_i[1],
-          important = _styleDecls$_i[2];
+        if (isUndefined(desc)) {
+          if (key !== tagPropertyKey) {
+            return undefined;
+          } // if the key is the membrane tag key, and is not in the original target,
+          // we produce a synthetic descriptor and install it on the shadow target
 
-      setCSSStyleProperty$1(elm, prop, value, important);
-    }
-  }
 
-  var modStaticStyle = {
-    create: createStyleAttribute
-  };
-  /*
-   * 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
-   */
+          desc = {
+            value: undefined,
+            writable: false,
+            configurable: false,
+            enumerable: false
+          };
+          ObjectDefineProperty(shadowTarget, tagPropertyKey, desc);
+          return desc;
+        }
 
-  function isUndef(s) {
-    return s === undefined;
-  }
+        if (desc.configurable === false) {
+          // updating the descriptor to non-configurable on the shadow
+          this.copyDescriptorIntoShadowTarget(shadowTarget, key);
+        } // Note: by accessing the descriptor, the key is marked as observed
+        // but access to the value, setter or getter (if available) cannot observe
+        // mutations, just like regular methods, in which case we just do nothing.
 
-  function sameVnode(vnode1, vnode2) {
-    return vnode1.key === vnode2.key && vnode1.sel === vnode2.sel;
-  }
 
-  function isVNode(vnode) {
-    return vnode != null;
-  }
+        return this.wrapDescriptor(desc);
+      }
+    }]);
 
-  function createKeyToOldIdx(children, beginIdx, endIdx) {
-    var map = {};
-    var j, key, ch; // TODO [#1637]: simplify this by assuming that all vnodes has keys
+    return BaseProxyHandler;
+  }();
 
-    for (j = beginIdx; j <= endIdx; ++j) {
-      ch = children[j];
+  var getterMap$1 = new WeakMap();
+  var setterMap$1 = new WeakMap();
+  var reverseGetterMap = new WeakMap();
+  var reverseSetterMap = new WeakMap();
 
-      if (isVNode(ch)) {
-        key = ch.key;
+  var ReactiveProxyHandler = /*#__PURE__*/function (_BaseProxyHandler) {
+    _inherits(ReactiveProxyHandler, _BaseProxyHandler);
 
-        if (key !== undefined) {
-          map[key] = j;
-        }
-      }
-    }
+    var _super = _createSuper(ReactiveProxyHandler);
 
-    return map;
-  }
+    function ReactiveProxyHandler() {
+      _classCallCheck(this, ReactiveProxyHandler);
 
-  function addVnodes(parentElm, before, vnodes, startIdx, endIdx) {
-    for (; startIdx <= endIdx; ++startIdx) {
-      var ch = vnodes[startIdx];
+      return _super.apply(this, arguments);
+    }
 
-      if (isVNode(ch)) {
-        ch.hook.create(ch);
-        ch.hook.insert(ch, parentElm, before);
+    _createClass(ReactiveProxyHandler, [{
+      key: "wrapValue",
+      value: function wrapValue(value) {
+        return this.membrane.getProxy(value);
       }
-    }
-  }
+    }, {
+      key: "wrapGetter",
+      value: function wrapGetter(originalGet) {
+        var wrappedGetter = getterMap$1.get(originalGet);
 
-  function removeVnodes(parentElm, vnodes, startIdx, endIdx) {
-    for (; startIdx <= endIdx; ++startIdx) {
-      var ch = vnodes[startIdx]; // text nodes do not have logic associated to them
+        if (!isUndefined(wrappedGetter)) {
+          return wrappedGetter;
+        }
 
-      if (isVNode(ch)) {
-        ch.hook.remove(ch, parentElm);
-      }
-    }
-  }
+        var handler = this;
 
-  function updateDynamicChildren(parentElm, oldCh, newCh) {
-    var oldStartIdx = 0;
-    var newStartIdx = 0;
-    var oldEndIdx = oldCh.length - 1;
-    var oldStartVnode = oldCh[0];
-    var oldEndVnode = oldCh[oldEndIdx];
-    var newChEnd = newCh.length - 1;
-    var newEndIdx = newChEnd;
-    var newStartVnode = newCh[0];
-    var newEndVnode = newCh[newEndIdx];
-    var oldKeyToIdx;
-    var idxInOld;
-    var elmToMove;
-    var before;
+        var get = function get() {
+          // invoking the original getter with the original target
+          return handler.wrapValue(originalGet.call(unwrap$1(this)));
+        };
 
-    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);
+        getterMap$1.set(originalGet, get);
+        reverseGetterMap.set(get, originalGet);
+        return get;
+      }
+    }, {
+      key: "wrapSetter",
+      value: function wrapSetter(originalSet) {
+        var wrappedSetter = setterMap$1.get(originalSet);
+
+        if (!isUndefined(wrappedSetter)) {
+          return wrappedSetter;
         }
 
-        idxInOld = oldKeyToIdx[newStartVnode.key];
+        var set = function set(v) {
+          // invoking the original setter with the original target
+          originalSet.call(unwrap$1(this), unwrap$1(v));
+        };
 
-        if (isUndef(idxInOld)) {
-          // New element
-          newStartVnode.hook.create(newStartVnode);
-          newStartVnode.hook.insert(newStartVnode, parentElm, oldStartVnode.elm);
-          newStartVnode = newCh[++newStartIdx];
+        setterMap$1.set(originalSet, set);
+        reverseSetterMap.set(set, originalSet);
+        return set;
+      }
+    }, {
+      key: "unwrapDescriptor",
+      value: function unwrapDescriptor(descriptor) {
+        if (hasOwnProperty.call(descriptor, 'value')) {
+          // dealing with a data descriptor
+          descriptor.value = unwrap$1(descriptor.value);
         } else {
-          elmToMove = oldCh[idxInOld];
+          var set = descriptor.set,
+              get = descriptor.get;
 
-          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);
-            }
+          if (!isUndefined(get)) {
+            descriptor.get = this.unwrapGetter(get);
           }
 
-          newStartVnode = newCh[++newStartIdx];
+          if (!isUndefined(set)) {
+            descriptor.set = this.unwrapSetter(set);
+          }
         }
+
+        return descriptor;
       }
-    }
+    }, {
+      key: "unwrapGetter",
+      value: function unwrapGetter(redGet) {
+        var reverseGetter = reverseGetterMap.get(redGet);
 
-    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.
-        var _i7 = newEndIdx;
-        var n;
+        if (!isUndefined(reverseGetter)) {
+          return reverseGetter;
+        }
 
-        do {
-          n = newCh[++_i7];
-        } while (!isVNode(n) && _i7 < newChEnd);
+        var handler = this;
 
-        before = isVNode(n) ? n.elm : null;
-        addVnodes(parentElm, before, newCh, newStartIdx, newEndIdx);
-      } else {
-        removeVnodes(parentElm, oldCh, oldStartIdx, oldEndIdx);
-      }
-    }
-  }
-
-  function updateStaticChildren(parentElm, oldCh, newCh) {
-    var oldChLength = oldCh.length;
-    var 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
+        var get = function get() {
+          // invoking the red getter with the proxy of this
+          return unwrap$1(redGet.call(handler.wrapValue(this)));
+        };
 
+        getterMap$1.set(get, redGet);
+        reverseGetterMap.set(redGet, get);
+        return get;
+      }
+    }, {
+      key: "unwrapSetter",
+      value: function unwrapSetter(redSet) {
+        var reverseSetter = reverseSetterMap.get(redSet);
 
-    var referenceElm = null;
+        if (!isUndefined(reverseSetter)) {
+          return reverseSetter;
+        }
 
-    for (var _i8 = newChLength - 1; _i8 >= 0; _i8 -= 1) {
-      var vnode = newCh[_i8];
-      var oldVNode = oldCh[_i8];
+        var handler = this;
 
-      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
+        var set = function set(v) {
+          // invoking the red setter with the proxy of this
+          redSet.call(handler.wrapValue(this), handler.wrapValue(v));
+        };
 
-          vnode.hook.insert(vnode, parentElm, referenceElm);
-          referenceElm = vnode.elm;
-        }
+        setterMap$1.set(set, redSet);
+        reverseSetterMap.set(redSet, set);
+        return set;
       }
-    }
-  }
-
-  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
-   */
-  // This is a temporary workaround to get the @lwc/engine-server to evaluate in node without having
-  // to inject at runtime.
+    }, {
+      key: "set",
+      value: function set(shadowTarget, key, value) {
+        var originalTarget = this.originalTarget,
+            valueMutated = this.membrane.valueMutated;
+        var oldValue = originalTarget[key];
 
+        if (oldValue !== value) {
+          originalTarget[key] = value;
+          valueMutated(originalTarget, key);
+        } else if (key === 'length' && isArray(originalTarget)) {
+          // fix for issue #236: push will add the new index, and by the time length
+          // is updated, the internal length is already equal to the new length value
+          // therefore, the oldValue is equal to the value. This is the forking logic
+          // to support this use case.
+          valueMutated(originalTarget, key);
+        }
 
-  var HTMLElementConstructor$1 = typeof HTMLElement !== 'undefined' ? HTMLElement : function () {};
-  var 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
-   */
+        return true;
+      }
+    }, {
+      key: "deleteProperty",
+      value: function deleteProperty(shadowTarget, key) {
+        var originalTarget = this.originalTarget,
+            valueMutated = this.membrane.valueMutated;
+        delete originalTarget[key];
+        valueMutated(originalTarget, key);
+        return true;
+      }
+    }, {
+      key: "setPrototypeOf",
+      value: function setPrototypeOf(shadowTarget, prototype) {
+      }
+    }, {
+      key: "preventExtensions",
+      value: function preventExtensions(shadowTarget) {
+        if (_isExtensible(shadowTarget)) {
+          var originalTarget = this.originalTarget;
 
-  /**
-   * 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.
-   */
+          _preventExtensions(originalTarget); // if the originalTarget is a proxy itself, it might reject
+          // the preventExtension call, in which case we should not attempt to lock down
+          // the shadow target.
+          // TODO: It should not actually be possible to reach this `if` statement.
+          // If a proxy rejects extensions, then calling preventExtensions will throw an error:
+          // https://codepen.io/nolanlawson-the-selector/pen/QWMOjbY
 
-  var HTMLElementOriginalDescriptors = create(null);
-  forEach.call(keys(AriaPropNameToAttrNameMap), function (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.
-    var descriptor = getPropertyDescriptor(HTMLElementPrototype, propName);
+          /* istanbul ignore if */
 
-    if (!isUndefined$1(descriptor)) {
-      HTMLElementOriginalDescriptors[propName] = descriptor;
-    }
-  });
-  forEach.call(defaultDefHTMLPropertyNames, function (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.
-    var descriptor = getPropertyDescriptor(HTMLElementPrototype, propName);
 
-    if (!isUndefined$1(descriptor)) {
-      HTMLElementOriginalDescriptors[propName] = descriptor;
-    }
-  });
-  /**
-   * Copyright (C) 2017 salesforce.com, inc.
-   */
+          if (_isExtensible(originalTarget)) {
+            return false;
+          }
 
-  var isArray = Array.isArray;
-  var ObjectDotPrototype = Object.prototype,
-      _getPrototypeOf = Object.getPrototypeOf,
-      ObjectCreate = Object.create,
-      ObjectDefineProperty = Object.defineProperty,
-      _isExtensible = Object.isExtensible,
-      _getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor,
-      getOwnPropertyNames = Object.getOwnPropertyNames,
-      getOwnPropertySymbols = Object.getOwnPropertySymbols,
-      _preventExtensions = Object.preventExtensions,
-      hasOwnProperty = Object.hasOwnProperty;
-  var _Array$prototype2 = Array.prototype,
-      ArrayPush = _Array$prototype2.push,
-      ArrayConcat = _Array$prototype2.concat;
+          this.lockShadowTarget(shadowTarget);
+        }
 
-  function isUndefined(obj) {
-    return obj === undefined;
-  }
+        return true;
+      }
+    }, {
+      key: "defineProperty",
+      value: function defineProperty(shadowTarget, key, descriptor) {
+        var originalTarget = this.originalTarget,
+            _this$membrane3 = this.membrane,
+            valueMutated = _this$membrane3.valueMutated,
+            tagPropertyKey = _this$membrane3.tagPropertyKey;
 
-  function isFunction(obj) {
-    return typeof obj === 'function';
-  }
+        if (key === tagPropertyKey && !hasOwnProperty.call(originalTarget, key)) {
+          // To avoid leaking the membrane tag property into the original target, we must
+          // be sure that the original target doesn't have yet.
+          // NOTE: we do not return false here because Object.freeze and equivalent operations
+          // will attempt to set the descriptor to the same value, and expect no to throw. This
+          // is an small compromise for the sake of not having to diff the descriptors.
+          return true;
+        }
 
-  var proxyToValueMap = new WeakMap();
+        ObjectDefineProperty(originalTarget, key, this.unwrapDescriptor(descriptor)); // intentionally testing if false since it could be undefined as well
 
-  function registerProxy(proxy, value) {
-    proxyToValueMap.set(proxy, value);
-  }
+        if (descriptor.configurable === false) {
+          this.copyDescriptorIntoShadowTarget(shadowTarget, key);
+        }
 
-  var unwrap$1 = function unwrap$1(replicaOrAny) {
-    return proxyToValueMap.get(replicaOrAny) || replicaOrAny;
-  };
+        valueMutated(originalTarget, key);
+        return true;
+      }
+    }]);
 
-  var BaseProxyHandler = /*#__PURE__*/function () {
-    function BaseProxyHandler(membrane, value) {
-      _classCallCheck(this, BaseProxyHandler);
+    return ReactiveProxyHandler;
+  }(BaseProxyHandler);
 
-      this.originalTarget = value;
-      this.membrane = membrane;
-    } // Shared utility methods
+  var getterMap = new WeakMap();
+  var setterMap = new WeakMap();
 
+  var ReadOnlyHandler = /*#__PURE__*/function (_BaseProxyHandler2) {
+    _inherits(ReadOnlyHandler, _BaseProxyHandler2);
 
-    _createClass(BaseProxyHandler, [{
-      key: "wrapDescriptor",
-      value: function wrapDescriptor(descriptor) {
-        if (hasOwnProperty.call(descriptor, 'value')) {
-          descriptor.value = this.wrapValue(descriptor.value);
-        } else {
-          var originalSet = descriptor.set,
-              originalGet = descriptor.get;
+    var _super2 = _createSuper(ReadOnlyHandler);
 
-          if (!isUndefined(originalGet)) {
-            descriptor.get = this.wrapGetter(originalGet);
-          }
+    function ReadOnlyHandler() {
+      _classCallCheck(this, ReadOnlyHandler);
 
-          if (!isUndefined(originalSet)) {
-            descriptor.set = this.wrapSetter(originalSet);
-          }
-        }
+      return _super2.apply(this, arguments);
+    }
 
-        return descriptor;
+    _createClass(ReadOnlyHandler, [{
+      key: "wrapValue",
+      value: function wrapValue(value) {
+        return this.membrane.getReadOnlyProxy(value);
       }
     }, {
-      key: "copyDescriptorIntoShadowTarget",
-      value: function copyDescriptorIntoShadowTarget(shadowTarget, key) {
-        var originalTarget = this.originalTarget; // Note: a property might get defined multiple times in the shadowTarget
-        //       but it will always be compatible with the previous descriptor
-        //       to preserve the object invariants, which makes these lines safe.
+      key: "wrapGetter",
+      value: function wrapGetter(originalGet) {
+        var wrappedGetter = getterMap.get(originalGet);
 
-        var originalDescriptor = _getOwnPropertyDescriptor(originalTarget, key); // TODO: it should be impossible for the originalDescriptor to ever be undefined, this `if` can be removed
+        if (!isUndefined(wrappedGetter)) {
+          return wrappedGetter;
+        }
 
-        /* istanbul ignore else */
+        var handler = this;
 
+        var get = function get() {
+          // invoking the original getter with the original target
+          return handler.wrapValue(originalGet.call(unwrap$1(this)));
+        };
 
-        if (!isUndefined(originalDescriptor)) {
-          var wrappedDesc = this.wrapDescriptor(originalDescriptor);
-          ObjectDefineProperty(shadowTarget, key, wrappedDesc);
-        }
+        getterMap.set(originalGet, get);
+        return get;
       }
     }, {
-      key: "lockShadowTarget",
-      value: function lockShadowTarget(shadowTarget) {
-        var _this = this;
-
-        var originalTarget = this.originalTarget;
-        var targetKeys = ArrayConcat.call(getOwnPropertyNames(originalTarget), getOwnPropertySymbols(originalTarget));
-        targetKeys.forEach(function (key) {
-          _this.copyDescriptorIntoShadowTarget(shadowTarget, key);
-        });
-        var tagPropertyKey = this.membrane.tagPropertyKey;
+      key: "wrapSetter",
+      value: function wrapSetter(originalSet) {
+        var wrappedSetter = setterMap.get(originalSet);
 
-        if (!isUndefined(tagPropertyKey) && !hasOwnProperty.call(shadowTarget, tagPropertyKey)) {
-          ObjectDefineProperty(shadowTarget, tagPropertyKey, ObjectCreate(null));
+        if (!isUndefined(wrappedSetter)) {
+          return wrappedSetter;
         }
 
-        _preventExtensions(shadowTarget);
-      } // Shared Traps
-      // TODO: apply() is never called
-
-      /* istanbul ignore next */
+        var set = function set(v) {
+        };
 
+        setterMap.set(originalSet, set);
+        return set;
+      }
     }, {
-      key: "apply",
-      value: function apply(shadowTarget, thisArg, argArray) {
-        /* No op */
-      } // TODO: construct() is never called
+      key: "set",
+      value: function set(shadowTarget, key, value) {
+        /* istanbul ignore next */
 
-      /* istanbul ignore next */
 
-    }, {
-      key: "construct",
-      value: function construct(shadowTarget, argArray, newTarget) {
-        /* No op */
+        return false;
       }
     }, {
-      key: "get",
-      value: function get(shadowTarget, key) {
-        var originalTarget = this.originalTarget,
-            valueObserved = this.membrane.valueObserved;
-        var value = originalTarget[key];
-        valueObserved(originalTarget, key);
-        return this.wrapValue(value);
+      key: "deleteProperty",
+      value: function deleteProperty(shadowTarget, key) {
+        /* istanbul ignore next */
+
+
+        return false;
       }
     }, {
-      key: "has",
-      value: function has(shadowTarget, key) {
-        var originalTarget = this.originalTarget,
-            _this$membrane = this.membrane,
-            tagPropertyKey = _this$membrane.tagPropertyKey,
-            valueObserved = _this$membrane.valueObserved;
-        valueObserved(originalTarget, key); // since key is never going to be undefined, and tagPropertyKey might be undefined
-        // we can simply compare them as the second part of the condition.
-
-        return key in originalTarget || key === tagPropertyKey;
+      key: "setPrototypeOf",
+      value: function setPrototypeOf(shadowTarget, prototype) {
       }
     }, {
-      key: "ownKeys",
-      value: function ownKeys(shadowTarget) {
-        var originalTarget = this.originalTarget,
-            tagPropertyKey = this.membrane.tagPropertyKey; // if the membrane tag key exists and it is not in the original target, we add it to the keys.
+      key: "preventExtensions",
+      value: function preventExtensions(shadowTarget) {
+        /* istanbul ignore next */
 
-        var keys = isUndefined(tagPropertyKey) || hasOwnProperty.call(originalTarget, tagPropertyKey) ? [] : [tagPropertyKey]; // small perf optimization using push instead of concat to avoid creating an extra array
 
-        ArrayPush.apply(keys, getOwnPropertyNames(originalTarget));
-        ArrayPush.apply(keys, getOwnPropertySymbols(originalTarget));
-        return keys;
+        return false;
       }
     }, {
-      key: "isExtensible",
-      value: function isExtensible(shadowTarget) {
-        var originalTarget = this.originalTarget; // optimization to avoid attempting to lock down the shadowTarget multiple times
-
-        if (!_isExtensible(shadowTarget)) {
-          return false; // was already locked down
-        }
+      key: "defineProperty",
+      value: function defineProperty(shadowTarget, key, descriptor) {
+        /* istanbul ignore next */
 
-        if (!_isExtensible(originalTarget)) {
-          this.lockShadowTarget(shadowTarget);
-          return false;
-        }
 
-        return true;
-      }
-    }, {
-      key: "getPrototypeOf",
-      value: function getPrototypeOf(shadowTarget) {
-        var originalTarget = this.originalTarget;
-        return _getPrototypeOf(originalTarget);
+        return false;
       }
-    }, {
-      key: "getOwnPropertyDescriptor",
-      value: function getOwnPropertyDescriptor(shadowTarget, key) {
-        var originalTarget = this.originalTarget,
-            _this$membrane2 = this.membrane,
-            valueObserved = _this$membrane2.valueObserved,
-            tagPropertyKey = _this$membrane2.tagPropertyKey; // keys looked up via getOwnPropertyDescriptor need to be reactive
+    }]);
 
-        valueObserved(originalTarget, key);
+    return ReadOnlyHandler;
+  }(BaseProxyHandler);
 
-        var desc = _getOwnPropertyDescriptor(originalTarget, key);
+  function defaultValueIsObservable(value) {
+    // intentionally checking for null
+    if (value === null) {
+      return false;
+    } // treat all non-object types, including undefined, as non-observable values
 
-        if (isUndefined(desc)) {
-          if (key !== tagPropertyKey) {
-            return undefined;
-          } // if the key is the membrane tag key, and is not in the original target,
-          // we produce a synthetic descriptor and install it on the shadow target
 
+    if (_typeof(value) !== 'object') {
+      return false;
+    }
 
-          desc = {
-            value: undefined,
-            writable: false,
-            configurable: false,
-            enumerable: false
-          };
-          ObjectDefineProperty(shadowTarget, tagPropertyKey, desc);
-          return desc;
-        }
+    if (isArray(value)) {
+      return true;
+    }
 
-        if (desc.configurable === false) {
-          // updating the descriptor to non-configurable on the shadow
-          this.copyDescriptorIntoShadowTarget(shadowTarget, key);
-        } // Note: by accessing the descriptor, the key is marked as observed
-        // but access to the value, setter or getter (if available) cannot observe
-        // mutations, just like regular methods, in which case we just do nothing.
+    var proto = _getPrototypeOf(value);
 
+    return proto === ObjectDotPrototype || proto === null || _getPrototypeOf(proto) === null;
+  }
 
-        return this.wrapDescriptor(desc);
-      }
-    }]);
+  var defaultValueObserved = function defaultValueObserved(obj, key) {
+    /* do nothing */
+  };
 
-    return BaseProxyHandler;
-  }();
+  var defaultValueMutated = function defaultValueMutated(obj, key) {
+    /* do nothing */
+  };
+
+  function createShadowTarget(value) {
+    return isArray(value) ? [] : {};
+  }
+
+  var ObservableMembrane = /*#__PURE__*/function () {
+    function ObservableMembrane() {
+      var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
 
-  var getterMap$1 = new WeakMap();
-  var setterMap$1 = new WeakMap();
-  var reverseGetterMap = new WeakMap();
-  var reverseSetterMap = new WeakMap();
+      _classCallCheck(this, ObservableMembrane);
 
-  var ReactiveProxyHandler = /*#__PURE__*/function (_BaseProxyHandler) {
-    _inherits(ReactiveProxyHandler, _BaseProxyHandler);
+      this.readOnlyObjectGraph = new WeakMap();
+      this.reactiveObjectGraph = new WeakMap();
+      var valueMutated = options.valueMutated,
+          valueObserved = options.valueObserved,
+          valueIsObservable = options.valueIsObservable,
+          tagPropertyKey = options.tagPropertyKey;
+      this.valueMutated = isFunction(valueMutated) ? valueMutated : defaultValueMutated;
+      this.valueObserved = isFunction(valueObserved) ? valueObserved : defaultValueObserved;
+      this.valueIsObservable = isFunction(valueIsObservable) ? valueIsObservable : defaultValueIsObservable;
+      this.tagPropertyKey = tagPropertyKey;
+    }
 
-    var _super = _createSuper(ReactiveProxyHandler);
+    _createClass(ObservableMembrane, [{
+      key: "getProxy",
+      value: function getProxy(value) {
+        var unwrappedValue = unwrap$1(value);
 
-    function ReactiveProxyHandler() {
-      _classCallCheck(this, ReactiveProxyHandler);
+        if (this.valueIsObservable(unwrappedValue)) {
+          // When trying to extract the writable version of a readonly we return the readonly.
+          if (this.readOnlyObjectGraph.get(unwrappedValue) === value) {
+            return value;
+          }
 
-      return _super.apply(this, arguments);
-    }
+          return this.getReactiveHandler(unwrappedValue);
+        }
 
-    _createClass(ReactiveProxyHandler, [{
-      key: "wrapValue",
-      value: function wrapValue(value) {
-        return this.membrane.getProxy(value);
+        return unwrappedValue;
       }
     }, {
-      key: "wrapGetter",
-      value: function wrapGetter(originalGet) {
-        var wrappedGetter = getterMap$1.get(originalGet);
+      key: "getReadOnlyProxy",
+      value: function getReadOnlyProxy(value) {
+        value = unwrap$1(value);
 
-        if (!isUndefined(wrappedGetter)) {
-          return wrappedGetter;
+        if (this.valueIsObservable(value)) {
+          return this.getReadOnlyHandler(value);
         }
 
-        var handler = this;
-
-        var get = function get() {
-          // invoking the original getter with the original target
-          return handler.wrapValue(originalGet.call(unwrap$1(this)));
-        };
-
-        getterMap$1.set(originalGet, get);
-        reverseGetterMap.set(get, originalGet);
-        return get;
+        return value;
       }
     }, {
-      key: "wrapSetter",
-      value: function wrapSetter(originalSet) {
-        var wrappedSetter = setterMap$1.get(originalSet);
+      key: "unwrapProxy",
+      value: function unwrapProxy(p) {
+        return unwrap$1(p);
+      }
+    }, {
+      key: "getReactiveHandler",
+      value: function getReactiveHandler(value) {
+        var proxy = this.reactiveObjectGraph.get(value);
 
-        if (!isUndefined(wrappedSetter)) {
-          return wrappedSetter;
+        if (isUndefined(proxy)) {
+          // caching the proxy after the first time it is accessed
+          var handler = new ReactiveProxyHandler(this, value);
+          proxy = new Proxy(createShadowTarget(value), handler);
+          registerProxy(proxy, value);
+          this.reactiveObjectGraph.set(value, proxy);
         }
 
-        var set = function set(v) {
-          // invoking the original setter with the original target
-          originalSet.call(unwrap$1(this), unwrap$1(v));
-        };
-
-        setterMap$1.set(originalSet, set);
-        reverseSetterMap.set(set, originalSet);
-        return set;
+        return proxy;
       }
     }, {
-      key: "unwrapDescriptor",
-      value: function unwrapDescriptor(descriptor) {
-        if (hasOwnProperty.call(descriptor, 'value')) {
-          // dealing with a data descriptor
-          descriptor.value = unwrap$1(descriptor.value);
-        } else {
-          var set = descriptor.set,
-              get = descriptor.get;
-
-          if (!isUndefined(get)) {
-            descriptor.get = this.unwrapGetter(get);
-          }
+      key: "getReadOnlyHandler",
+      value: function getReadOnlyHandler(value) {
+        var proxy = this.readOnlyObjectGraph.get(value);
 
-          if (!isUndefined(set)) {
-            descriptor.set = this.unwrapSetter(set);
-          }
+        if (isUndefined(proxy)) {
+          // caching the proxy after the first time it is accessed
+          var handler = new ReadOnlyHandler(this, value);
+          proxy = new Proxy(createShadowTarget(value), handler);
+          registerProxy(proxy, value);
+          this.readOnlyObjectGraph.set(value, proxy);
         }
 
-        return descriptor;
+        return proxy;
       }
-    }, {
-      key: "unwrapGetter",
-      value: function unwrapGetter(redGet) {
-        var reverseGetter = reverseGetterMap.get(redGet);
+    }]);
 
-        if (!isUndefined(reverseGetter)) {
-          return reverseGetter;
-        }
+    return ObservableMembrane;
+  }();
+  /** version: 2.0.0 */
 
-        var handler = this;
+  /*
+   * Copyright (c) 2018, salesforce.com, inc.
+   * All rights reserved.
+   * SPDX-License-Identifier: MIT
+   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+   */
 
-        var get = function get() {
-          // invoking the red getter with the proxy of this
-          return unwrap$1(redGet.call(handler.wrapValue(this)));
-        };
 
-        getterMap$1.set(get, redGet);
-        reverseGetterMap.set(redGet, get);
-        return get;
-      }
-    }, {
-      key: "unwrapSetter",
-      value: function unwrapSetter(redSet) {
-        var reverseSetter = reverseSetterMap.get(redSet);
+  var lockerLivePropertyKey = Symbol.for('@@lockerLiveValue');
+  var reactiveMembrane = new ObservableMembrane({
+    valueObserved: valueObserved,
+    valueMutated: valueMutated,
+    tagPropertyKey: lockerLivePropertyKey
+  });
+  /**
+   * EXPERIMENTAL: This function implements an unwrap mechanism that
+   * works for observable membrane objects. This API is subject to
+   * change or being removed.
+   */
 
-        if (!isUndefined(reverseSetter)) {
-          return reverseSetter;
-        }
+  function unwrap(value) {
+    return reactiveMembrane.unwrapProxy(value);
+  }
+  /*
+   * 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
+   */
 
-        var handler = this;
+  /**
+   * This operation is called with a descriptor of an standard html property
+   * that a Custom Element can support (including AOM properties), which
+   * determines what kind of capabilities the Base Lightning Element should support. When producing the new descriptors
+   * for the Base Lightning Element, it also include the reactivity bit, so the standard property is reactive.
+   */
 
-        var set = function set(v) {
-          // invoking the red setter with the proxy of this
-          redSet.call(handler.wrapValue(this), handler.wrapValue(v));
-        };
 
-        setterMap$1.set(set, redSet);
-        reverseSetterMap.set(redSet, set);
-        return set;
-      }
-    }, {
-      key: "set",
-      value: function set(shadowTarget, key, value) {
-        var originalTarget = this.originalTarget,
-            valueMutated = this.membrane.valueMutated;
-        var oldValue = originalTarget[key];
+  function createBridgeToElementDescriptor(propName, descriptor) {
+    var _get = descriptor.get,
+        _set = descriptor.set,
+        enumerable = descriptor.enumerable,
+        configurable = descriptor.configurable;
 
-        if (oldValue !== value) {
-          originalTarget[key] = value;
-          valueMutated(originalTarget, key);
-        } else if (key === 'length' && isArray(originalTarget)) {
-          // fix for issue #236: push will add the new index, and by the time length
-          // is updated, the internal length is already equal to the new length value
-          // therefore, the oldValue is equal to the value. This is the forking logic
-          // to support this use case.
-          valueMutated(originalTarget, key);
+    if (!isFunction$1(_get)) {
+
+      throw new TypeError();
+    }
+
+    if (!isFunction$1(_set)) {
+
+      throw new TypeError();
+    }
+
+    return {
+      enumerable: enumerable,
+      configurable: configurable,
+      get: function get() {
+        var vm = getAssociatedVM(this);
+
+        if (isBeingConstructed(vm)) {
+
+          return;
         }
 
-        return true;
-      }
-    }, {
-      key: "deleteProperty",
-      value: function deleteProperty(shadowTarget, key) {
-        var originalTarget = this.originalTarget,
-            valueMutated = this.membrane.valueMutated;
-        delete originalTarget[key];
-        valueMutated(originalTarget, key);
-        return true;
-      }
-    }, {
-      key: "setPrototypeOf",
-      value: function setPrototypeOf(shadowTarget, prototype) {
+        componentValueObserved(vm, propName);
+        return _get.call(vm.elm);
+      },
+      set: function set(newValue) {
+        var vm = getAssociatedVM(this);
+
+        if (newValue !== vm.cmpProps[propName]) {
+          vm.cmpProps[propName] = newValue;
+          componentValueMutated(vm, propName);
+        }
+
+        return _set.call(vm.elm, newValue);
       }
-    }, {
-      key: "preventExtensions",
-      value: function preventExtensions(shadowTarget) {
-        if (_isExtensible(shadowTarget)) {
-          var originalTarget = this.originalTarget;
+    };
+  }
+  /**
+   * This class is the base class for any LWC element.
+   * Some elements directly extends this class, others implement it via inheritance.
+   **/
+  // @ts-ignore
 
-          _preventExtensions(originalTarget); // if the originalTarget is a proxy itself, it might reject
-          // the preventExtension call, in which case we should not attempt to lock down
-          // the shadow target.
-          // TODO: It should not actually be possible to reach this `if` statement.
-          // If a proxy rejects extensions, then calling preventExtensions will throw an error:
-          // https://codepen.io/nolanlawson-the-selector/pen/QWMOjbY
 
-          /* istanbul ignore if */
+  var LightningElement = function LightningElement() {
+    // This should be as performant as possible, while any initialization should be done lazily
+    if (isNull(vmBeingConstructed)) {
+      throw new ReferenceError('Illegal constructor');
+    }
 
+    var vm = vmBeingConstructed;
+    var def = vm.def,
+        elm = vm.elm;
+    var bridge = def.bridge;
 
-          if (_isExtensible(originalTarget)) {
-            return false;
-          }
+    var component = this;
+    setPrototypeOf(elm, bridge.prototype);
+    vm.component = this; // Locker hooks assignment. When the LWC engine run with Locker, Locker intercepts all the new
+    // component creation and passes hooks to instrument all the component interactions with the
+    // engine. We are intentionally hiding this argument from the formal API of LightningElement
+    // because we don't want folks to know about it just yet.
 
-          this.lockShadowTarget(shadowTarget);
-        }
+    if (arguments.length === 1) {
+      var _arguments$ = arguments[0],
+          _callHook = _arguments$.callHook,
+          _setHook = _arguments$.setHook,
+          _getHook = _arguments$.getHook;
+      vm.callHook = _callHook;
+      vm.setHook = _setHook;
+      vm.getHook = _getHook;
+    } // Making the component instance a live value when using Locker to support expandos.
 
-        return true;
-      }
-    }, {
-      key: "defineProperty",
-      value: function defineProperty(shadowTarget, key, descriptor) {
-        var originalTarget = this.originalTarget,
-            _this$membrane3 = this.membrane,
-            valueMutated = _this$membrane3.valueMutated,
-            tagPropertyKey = _this$membrane3.tagPropertyKey;
 
-        if (key === tagPropertyKey && !hasOwnProperty.call(originalTarget, key)) {
-          // To avoid leaking the membrane tag property into the original target, we must
-          // be sure that the original target doesn't have yet.
-          // NOTE: we do not return false here because Object.freeze and equivalent operations
-          // will attempt to set the descriptor to the same value, and expect no to throw. This
-          // is an small compromise for the sake of not having to diff the descriptors.
-          return true;
-        }
+    this[lockerLivePropertyKey] = undefined; // Linking elm, shadow root and component with the VM.
 
-        ObjectDefineProperty(originalTarget, key, this.unwrapDescriptor(descriptor)); // intentionally testing if false since it could be undefined as well
+    associateVM(component, vm);
+    associateVM(elm, vm);
 
-        if (descriptor.configurable === false) {
-          this.copyDescriptorIntoShadowTarget(shadowTarget, key);
-        }
+    if (vm.renderMode === 1
+    /* Shadow */
+    ) {
+      doAttachShadow(vm);
+    } // Adding extra guard rails in DEV mode.
 
-        valueMutated(originalTarget, key);
-        return true;
-      }
-    }]);
+    return this;
+  };
 
-    return ReactiveProxyHandler;
-  }(BaseProxyHandler);
+  function doAttachShadow(vm) {
+    var _attachShadow$;
 
-  var getterMap = new WeakMap();
-  var setterMap = new WeakMap();
+    var elm = vm.elm,
+        mode = vm.mode,
+        shadowMode = vm.shadowMode,
+        ctor = vm.def.ctor;
+    var cmpRoot = attachShadow$1(elm, (_attachShadow$ = {}, _defineProperty(_attachShadow$, KEY__SYNTHETIC_MODE, shadowMode === 1), _defineProperty(_attachShadow$, "delegatesFocus", Boolean(ctor.delegatesFocus)), _defineProperty(_attachShadow$, "mode", mode), _attachShadow$));
+    vm.cmpRoot = cmpRoot;
+    associateVM(cmpRoot, vm);
+  }
 
-  var ReadOnlyHandler = /*#__PURE__*/function (_BaseProxyHandler2) {
-    _inherits(ReadOnlyHandler, _BaseProxyHandler2);
 
-    var _super2 = _createSuper(ReadOnlyHandler);
+  LightningElement.prototype = {
+    constructor: LightningElement,
+    dispatchEvent: function dispatchEvent(event) {
+      var _getAssociatedVM = getAssociatedVM(this),
+          elm = _getAssociatedVM.elm;
 
-    function ReadOnlyHandler() {
-      _classCallCheck(this, ReadOnlyHandler);
+      return dispatchEvent$1(elm, event);
+    },
+    addEventListener: function addEventListener(type, listener, options) {
+      var vm = getAssociatedVM(this);
+      var elm = vm.elm;
 
-      return _super2.apply(this, arguments);
-    }
+      var wrappedListener = getWrappedComponentsListener(vm, listener);
+      addEventListener$1(elm, type, wrappedListener, options);
+    },
+    removeEventListener: function removeEventListener(type, listener, options) {
+      var vm = getAssociatedVM(this);
+      var elm = vm.elm;
+      var wrappedListener = getWrappedComponentsListener(vm, listener);
+      removeEventListener$1(elm, type, wrappedListener, options);
+    },
+    hasAttribute: function hasAttribute(name) {
+      var _getAssociatedVM2 = getAssociatedVM(this),
+          elm = _getAssociatedVM2.elm;
 
-    _createClass(ReadOnlyHandler, [{
-      key: "wrapValue",
-      value: function wrapValue(value) {
-        return this.membrane.getReadOnlyProxy(value);
-      }
-    }, {
-      key: "wrapGetter",
-      value: function wrapGetter(originalGet) {
-        var wrappedGetter = getterMap.get(originalGet);
+      return !isNull(getAttribute$1(elm, name));
+    },
+    hasAttributeNS: function hasAttributeNS(namespace, name) {
+      var _getAssociatedVM3 = getAssociatedVM(this),
+          elm = _getAssociatedVM3.elm;
 
-        if (!isUndefined(wrappedGetter)) {
-          return wrappedGetter;
-        }
+      return !isNull(getAttribute$1(elm, name, namespace));
+    },
+    removeAttribute: function removeAttribute(name) {
+      var _getAssociatedVM4 = getAssociatedVM(this),
+          elm = _getAssociatedVM4.elm;
 
-        var handler = this;
+      unlockAttribute(elm, name);
+      removeAttribute$1(elm, name);
+      lockAttribute();
+    },
+    removeAttributeNS: function removeAttributeNS(namespace, name) {
+      var _getAssociatedVM5 = getAssociatedVM(this),
+          elm = _getAssociatedVM5.elm;
 
-        var get = function get() {
-          // invoking the original getter with the original target
-          return handler.wrapValue(originalGet.call(unwrap$1(this)));
-        };
+      unlockAttribute(elm, name);
+      removeAttribute$1(elm, name, namespace);
+      lockAttribute();
+    },
+    getAttribute: function getAttribute(name) {
+      var _getAssociatedVM6 = getAssociatedVM(this),
+          elm = _getAssociatedVM6.elm;
 
-        getterMap.set(originalGet, get);
-        return get;
-      }
-    }, {
-      key: "wrapSetter",
-      value: function wrapSetter(originalSet) {
-        var wrappedSetter = setterMap.get(originalSet);
+      return getAttribute$1(elm, name);
+    },
+    getAttributeNS: function getAttributeNS(namespace, name) {
+      var _getAssociatedVM7 = getAssociatedVM(this),
+          elm = _getAssociatedVM7.elm;
 
-        if (!isUndefined(wrappedSetter)) {
-          return wrappedSetter;
-        }
+      return getAttribute$1(elm, name, namespace);
+    },
+    setAttribute: function setAttribute(name, value) {
+      var vm = getAssociatedVM(this);
+      var elm = vm.elm;
 
-        var set = function set(v) {
-        };
+      unlockAttribute(elm, name);
+      setAttribute$1(elm, name, value);
+      lockAttribute();
+    },
+    setAttributeNS: function setAttributeNS(namespace, name, value) {
+      var vm = getAssociatedVM(this);
+      var elm = vm.elm;
 
-        setterMap.set(originalSet, set);
-        return set;
-      }
-    }, {
-      key: "set",
-      value: function set(shadowTarget, key, value) {
-        /* istanbul ignore next */
+      unlockAttribute(elm, name);
+      setAttribute$1(elm, name, value, namespace);
+      lockAttribute();
+    },
+    getBoundingClientRect: function getBoundingClientRect() {
+      var vm = getAssociatedVM(this);
+      var elm = vm.elm;
 
+      return getBoundingClientRect$1(elm);
+    },
 
-        return false;
-      }
-    }, {
-      key: "deleteProperty",
-      value: function deleteProperty(shadowTarget, key) {
-        /* istanbul ignore next */
+    get isConnected() {
+      var _getAssociatedVM8 = getAssociatedVM(this),
+          elm = _getAssociatedVM8.elm;
 
+      return isConnected$1(elm);
+    },
 
-        return false;
-      }
-    }, {
-      key: "setPrototypeOf",
-      value: function setPrototypeOf(shadowTarget, prototype) {
-      }
-    }, {
-      key: "preventExtensions",
-      value: function preventExtensions(shadowTarget) {
-        /* istanbul ignore next */
+    get classList() {
+      var vm = getAssociatedVM(this);
+      var elm = vm.elm;
 
+      return getClassList$1(elm);
+    },
 
-        return false;
-      }
-    }, {
-      key: "defineProperty",
-      value: function defineProperty(shadowTarget, key, descriptor) {
-        /* istanbul ignore next */
+    get template() {
+      var vm = getAssociatedVM(this);
+
+      return vm.cmpRoot;
+    },
+
+    get shadowRoot() {
+      // From within the component instance, the shadowRoot is always reported as "closed".
+      // Authors should rely on this.template instead.
+      return null;
+    },
+
+    render: function render() {
+      var vm = getAssociatedVM(this);
+      return vm.def.template;
+    },
+    toString: function toString() {
+      var vm = getAssociatedVM(this);
+      return "[object ".concat(vm.def.name, "]");
+    }
+  };
+  var queryAndChildGetterDescriptors = create(null); // The reason we don't just call `import * as renderer from '../renderer'` here is that the bundle size
+  // is smaller if we reference each function individually. Otherwise Rollup will create one big frozen
+  // object representing the renderer, with a lot of methods we don't actually need.
 
+  var childGetters = ['children', 'childNodes', 'firstChild', 'firstElementChild', 'lastChild', 'lastElementChild'];
 
-        return false;
-      }
-    }]);
+  function getChildGetter(methodName) {
+    switch (methodName) {
+      case 'children':
+        return getChildren$1;
 
-    return ReadOnlyHandler;
-  }(BaseProxyHandler);
+      case 'childNodes':
+        return getChildNodes$1;
 
-  function defaultValueIsObservable(value) {
-    // intentionally checking for null
-    if (value === null) {
-      return false;
-    } // treat all non-object types, including undefined, as non-observable values
+      case 'firstChild':
+        return getFirstChild$1;
 
+      case 'firstElementChild':
+        return getFirstElementChild$1;
 
-    if (_typeof(value) !== 'object') {
-      return false;
-    }
+      case 'lastChild':
+        return getLastChild$1;
 
-    if (isArray(value)) {
-      return true;
+      case 'lastElementChild':
+        return getLastElementChild$1;
     }
+  } // Generic passthrough for child getters on HTMLElement to the relevant Renderer APIs
 
-    var proto = _getPrototypeOf(value);
-
-    return proto === ObjectDotPrototype || proto === null || _getPrototypeOf(proto) === null;
-  }
 
-  var defaultValueObserved = function defaultValueObserved(obj, key) {
-    /* do nothing */
-  };
+  var _loop = function _loop() {
+    var childGetter = _childGetters[_i8];
+    queryAndChildGetterDescriptors[childGetter] = {
+      get: function get() {
+        var vm = getAssociatedVM(this);
+        var elm = vm.elm;
 
-  var defaultValueMutated = function defaultValueMutated(obj, key) {
-    /* do nothing */
+        return getChildGetter(childGetter)(elm);
+      },
+      configurable: true,
+      enumerable: true
+    };
   };
 
-  function createShadowTarget(value) {
-    return isArray(value) ? [] : {};
+  for (var _i8 = 0, _childGetters = childGetters; _i8 < _childGetters.length; _i8++) {
+    _loop();
   }
 
-  var ObservableMembrane = /*#__PURE__*/function () {
-    function ObservableMembrane() {
-      var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var queryMethods = ['getElementsByClassName', 'getElementsByTagName', 'querySelector', 'querySelectorAll'];
 
-      _classCallCheck(this, ObservableMembrane);
+  function getQueryMethod(methodName) {
+    switch (methodName) {
+      case 'getElementsByClassName':
+        return getElementsByClassName$1;
 
-      this.readOnlyObjectGraph = new WeakMap();
-      this.reactiveObjectGraph = new WeakMap();
-      var valueMutated = options.valueMutated,
-          valueObserved = options.valueObserved,
-          valueIsObservable = options.valueIsObservable,
-          tagPropertyKey = options.tagPropertyKey;
-      this.valueMutated = isFunction(valueMutated) ? valueMutated : defaultValueMutated;
-      this.valueObserved = isFunction(valueObserved) ? valueObserved : defaultValueObserved;
-      this.valueIsObservable = isFunction(valueIsObservable) ? valueIsObservable : defaultValueIsObservable;
-      this.tagPropertyKey = tagPropertyKey;
+      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
 
-    _createClass(ObservableMembrane, [{
-      key: "getProxy",
-      value: function getProxy(value) {
-        var unwrappedValue = unwrap$1(value);
 
-        if (this.valueIsObservable(unwrappedValue)) {
-          // When trying to extract the writable version of a readonly we return the readonly.
-          if (this.readOnlyObjectGraph.get(unwrappedValue) === value) {
-            return value;
-          }
+  var _loop2 = function _loop2() {
+    var queryMethod = _queryMethods[_i9];
+    queryAndChildGetterDescriptors[queryMethod] = {
+      value: function value(arg) {
+        var vm = getAssociatedVM(this);
+        var elm = vm.elm;
 
-          return this.getReactiveHandler(unwrappedValue);
-        }
+        return getQueryMethod(queryMethod)(elm, arg);
+      },
+      configurable: true,
+      enumerable: true,
+      writable: true
+    };
+  };
 
-        return unwrappedValue;
-      }
-    }, {
-      key: "getReadOnlyProxy",
-      value: function getReadOnlyProxy(value) {
-        value = unwrap$1(value);
+  for (var _i9 = 0, _queryMethods = queryMethods; _i9 < _queryMethods.length; _i9++) {
+    _loop2();
+  }
 
-        if (this.valueIsObservable(value)) {
-          return this.getReadOnlyHandler(value);
-        }
+  defineProperties(LightningElement.prototype, queryAndChildGetterDescriptors);
+  var lightningBasedDescriptors = create(null);
 
-        return value;
-      }
-    }, {
-      key: "unwrapProxy",
-      value: function unwrapProxy(p) {
-        return unwrap$1(p);
-      }
-    }, {
-      key: "getReactiveHandler",
-      value: function getReactiveHandler(value) {
-        var proxy = this.reactiveObjectGraph.get(value);
+  for (var _propName in HTMLElementOriginalDescriptors) {
+    lightningBasedDescriptors[_propName] = createBridgeToElementDescriptor(_propName, HTMLElementOriginalDescriptors[_propName]);
+  }
 
-        if (isUndefined(proxy)) {
-          // caching the proxy after the first time it is accessed
-          var handler = new ReactiveProxyHandler(this, value);
-          proxy = new Proxy(createShadowTarget(value), handler);
-          registerProxy(proxy, value);
-          this.reactiveObjectGraph.set(value, proxy);
-        }
+  defineProperties(LightningElement.prototype, lightningBasedDescriptors);
+  defineProperty(LightningElement, 'CustomElementConstructor', {
+    get: function get() {
+      // If required, a runtime-specific implementation must be defined.
+      throw new ReferenceError('The current runtime does not support CustomElementConstructor.');
+    },
+    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
+   */
 
-        return proxy;
-      }
-    }, {
-      key: "getReadOnlyHandler",
-      value: function getReadOnlyHandler(value) {
-        var proxy = this.readOnlyObjectGraph.get(value);
+  /**
+   * @wire decorator to wire fields and methods to a wire adapter in
+   * LWC Components. This function implements the internals of this
+   * decorator.
+   */
 
-        if (isUndefined(proxy)) {
-          // caching the proxy after the first time it is accessed
-          var handler = new ReadOnlyHandler(this, value);
-          proxy = new Proxy(createShadowTarget(value), handler);
-          registerProxy(proxy, value);
-          this.readOnlyObjectGraph.set(value, proxy);
-        }
 
-        return proxy;
-      }
-    }]);
+  function wire(_adapter, _config) {
 
-    return ObservableMembrane;
-  }();
-  /** version: 2.0.0 */
+    throw new Error();
+  }
+
+  function internalWireFieldDecorator(key) {
+    return {
+      get: function get() {
+        var vm = getAssociatedVM(this);
+        componentValueObserved(vm, key);
+        return vm.cmpFields[key];
+      },
+      set: function set(value) {
+        var 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.
@@ -2353,20 +2423,34 @@
    */
 
 
-  var lockerLivePropertyKey = Symbol.for('@@lockerLiveValue');
-  var reactiveMembrane = new ObservableMembrane({
-    valueObserved: valueObserved,
-    valueMutated: valueMutated,
-    tagPropertyKey: lockerLivePropertyKey
-  });
-  /**
-   * EXPERIMENTAL: This function implements an unwrap mechanism that
-   * works for observable membrane objects. This API is subject to
-   * change or being removed.
-   */
+  function track(target) {
+    if (arguments.length === 1) {
+      return reactiveMembrane.getProxy(target);
+    }
 
-  function unwrap(value) {
-    return reactiveMembrane.unwrapProxy(value);
+    throw new Error();
+  }
+
+  function internalTrackDecorator(key) {
+    return {
+      get: function get() {
+        var vm = getAssociatedVM(this);
+        componentValueObserved(vm, key);
+        return vm.cmpFields[key];
+      },
+      set: function set(newValue) {
+        var vm = getAssociatedVM(this);
+
+        var 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.
@@ -2375,33 +2459,14 @@
    * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
    */
 
-  /**
-   * This operation is called with a descriptor of an standard html property
-   * that a Custom Element can support (including AOM properties), which
-   * determines what kind of capabilities the Base Lightning Element should support. When producing the new descriptors
-   * for the Base Lightning Element, it also include the reactivity bit, so the standard property is reactive.
-   */
-
 
-  function createBridgeToElementDescriptor(propName, descriptor) {
-    var _get = descriptor.get,
-        _set = descriptor.set,
-        enumerable = descriptor.enumerable,
-        configurable = descriptor.configurable;
-
-    if (!isFunction$1(_get)) {
-
-      throw new TypeError();
-    }
-
-    if (!isFunction$1(_set)) {
+  function api$1() {
 
-      throw new TypeError();
-    }
+    throw new Error();
+  }
 
+  function createPublicPropertyDescriptor(key) {
     return {
-      enumerable: enumerable,
-      configurable: configurable,
       get: function get() {
         var vm = getAssociatedVM(this);
 
@@ -2410,383 +2475,323 @@
           return;
         }
 
-        componentValueObserved(vm, propName);
-        return _get.call(vm.elm);
+        componentValueObserved(vm, key);
+        return vm.cmpProps[key];
       },
       set: function set(newValue) {
         var vm = getAssociatedVM(this);
 
-        if (newValue !== vm.cmpProps[propName]) {
-          vm.cmpProps[propName] = newValue;
-          componentValueMutated(vm, propName);
-        }
-
-        return _set.call(vm.elm, newValue);
-      }
+        vm.cmpProps[key] = newValue;
+        componentValueMutated(vm, key);
+      },
+      enumerable: true,
+      configurable: true
     };
   }
-  /**
-   * This class is the base class for any LWC element.
-   * Some elements directly extends this class, others implement it via inheritance.
-   **/
-  // @ts-ignore
 
+  var AccessorReactiveObserver = /*#__PURE__*/function (_ReactiveObserver) {
+    _inherits(AccessorReactiveObserver, _ReactiveObserver);
 
-  var LightningElement = function LightningElement() {
-    // This should be as performant as possible, while any initialization should be done lazily
-    if (isNull(vmBeingConstructed)) {
-      throw new ReferenceError('Illegal constructor');
-    }
+    var _super3 = _createSuper(AccessorReactiveObserver);
 
-    var vm = vmBeingConstructed;
-    var def = vm.def,
-        elm = vm.elm;
-    var bridge = def.bridge;
+    function AccessorReactiveObserver(vm, set) {
+      var _this2;
 
-    var component = this;
-    setPrototypeOf(elm, bridge.prototype);
-    vm.component = this; // Locker hooks assignment. When the LWC engine run with Locker, Locker intercepts all the new
-    // component creation and passes hooks to instrument all the component interactions with the
-    // engine. We are intentionally hiding this argument from the formal API of LightningElement
-    // because we don't want folks to know about it just yet.
+      _classCallCheck(this, AccessorReactiveObserver);
 
-    if (arguments.length === 1) {
-      var _arguments$ = arguments[0],
-          _callHook = _arguments$.callHook,
-          _setHook = _arguments$.setHook,
-          _getHook = _arguments$.getHook;
-      vm.callHook = _callHook;
-      vm.setHook = _setHook;
-      vm.getHook = _getHook;
-    } // Making the component instance a live value when using Locker to support expandos.
+      _this2 = _super3.call(this, function () {
+        if (isFalse(_this2.debouncing)) {
+          _this2.debouncing = true;
+          addCallbackToNextTick(function () {
+            if (isTrue(_this2.debouncing)) {
+              var _assertThisInitialize = _assertThisInitialized(_this2),
+                  value = _assertThisInitialize.value;
 
+              var dirtyStateBeforeSetterCall = vm.isDirty,
+                  component = vm.component,
+                  _idx = vm.idx;
+              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[lockerLivePropertyKey] = undefined; // Linking elm, shadow root and component with the VM.
+              _this2.debouncing = false;
 
-    associateVM(component, vm);
-    associateVM(elm, vm);
+              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);
+              }
+            }
+          });
+        }
+      });
+      _this2.debouncing = false;
+      return _this2;
+    }
 
-    if (vm.renderMode === 1
-    /* Shadow */
-    ) {
-      doAttachShadow(vm);
-    } // Adding extra guard rails in DEV mode.
+    _createClass(AccessorReactiveObserver, [{
+      key: "reset",
+      value: function reset(value) {
+        _get2(_getPrototypeOf2(AccessorReactiveObserver.prototype), "reset", this).call(this);
 
-    return this;
-  };
+        this.debouncing = false;
 
-  function doAttachShadow(vm) {
-    var _attachShadow$;
+        if (arguments.length > 0) {
+          this.value = value;
+        }
+      }
+    }]);
 
-    var elm = vm.elm,
-        mode = vm.mode,
-        shadowMode = vm.shadowMode,
-        ctor = vm.def.ctor;
-    var cmpRoot = attachShadow$1(elm, (_attachShadow$ = {}, _defineProperty(_attachShadow$, KEY__SYNTHETIC_MODE, shadowMode === 1), _defineProperty(_attachShadow$, "delegatesFocus", Boolean(ctor.delegatesFocus)), _defineProperty(_attachShadow$, "mode", mode), _attachShadow$));
-    vm.cmpRoot = cmpRoot;
-    associateVM(cmpRoot, vm);
-  }
+    return AccessorReactiveObserver;
+  }(ReactiveObserver);
 
+  function createPublicAccessorDescriptor(key, descriptor) {
+    var _get3 = descriptor.get,
+        _set2 = descriptor.set,
+        enumerable = descriptor.enumerable,
+        configurable = descriptor.configurable;
 
-  LightningElement.prototype = {
-    constructor: LightningElement,
-    dispatchEvent: function dispatchEvent(event) {
-      var _getAssociatedVM = getAssociatedVM(this),
-          elm = _getAssociatedVM.elm;
+    if (!isFunction$1(_get3)) {
 
-      return dispatchEvent$1(elm, event);
-    },
-    addEventListener: function addEventListener(type, listener, options) {
-      var vm = getAssociatedVM(this);
-      var elm = vm.elm;
+      throw new Error();
+    }
 
-      var wrappedListener = getWrappedComponentsListener(vm, listener);
-      addEventListener$1(elm, type, wrappedListener, options);
-    },
-    removeEventListener: function removeEventListener(type, listener, options) {
-      var vm = getAssociatedVM(this);
-      var elm = vm.elm;
-      var wrappedListener = getWrappedComponentsListener(vm, listener);
-      removeEventListener$1(elm, type, wrappedListener, options);
-    },
-    hasAttribute: function hasAttribute(name) {
-      var _getAssociatedVM2 = getAssociatedVM(this),
-          elm = _getAssociatedVM2.elm;
+    return {
+      get: function get() {
 
-      return !isNull(getAttribute$1(elm, name));
-    },
-    hasAttributeNS: function hasAttributeNS(namespace, name) {
-      var _getAssociatedVM3 = getAssociatedVM(this),
-          elm = _getAssociatedVM3.elm;
+        return _get3.call(this);
+      },
+      set: function set(newValue) {
+        var _this3 = this;
 
-      return !isNull(getAttribute$1(elm, name, namespace));
-    },
-    removeAttribute: function removeAttribute(name) {
-      var _getAssociatedVM4 = getAssociatedVM(this),
-          elm = _getAssociatedVM4.elm;
+        var vm = getAssociatedVM(this);
 
-      unlockAttribute(elm, name);
-      removeAttribute$1(elm, name);
-      lockAttribute();
-    },
-    removeAttributeNS: function removeAttributeNS(namespace, name) {
-      var _getAssociatedVM5 = getAssociatedVM(this),
-          elm = _getAssociatedVM5.elm;
+        if (_set2) {
+          if (runtimeFlags.ENABLE_REACTIVE_SETTER) {
+            var ro = vm.oar[key];
 
-      unlockAttribute(elm, name);
-      removeAttribute$1(elm, name, namespace);
-      lockAttribute();
-    },
-    getAttribute: function getAttribute(name) {
-      var _getAssociatedVM6 = getAssociatedVM(this),
-          elm = _getAssociatedVM6.elm;
+            if (isUndefined$1(ro)) {
+              ro = vm.oar[key] = new AccessorReactiveObserver(vm, _set2);
+            } // 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.
 
-      return getAttribute$1(elm, name);
-    },
-    getAttributeNS: function getAttributeNS(namespace, name) {
-      var _getAssociatedVM7 = getAssociatedVM(this),
-          elm = _getAssociatedVM7.elm;
 
-      return getAttribute$1(elm, name, namespace);
-    },
-    setAttribute: function setAttribute(name, value) {
-      var vm = getAssociatedVM(this);
-      var elm = vm.elm;
+            ro.reset(newValue);
+            ro.observe(function () {
+              _set2.call(_this3, newValue);
+            });
+          } else {
+            _set2.call(this, newValue);
+          }
+        }
+      },
+      enumerable: enumerable,
+      configurable: configurable
+    };
+  }
 
-      unlockAttribute(elm, name);
-      setAttribute$1(elm, name, value);
-      lockAttribute();
-    },
-    setAttributeNS: function setAttributeNS(namespace, name, value) {
-      var vm = getAssociatedVM(this);
-      var elm = vm.elm;
+  function createObservedFieldPropertyDescriptor(key) {
+    return {
+      get: function get() {
+        var vm = getAssociatedVM(this);
+        componentValueObserved(vm, key);
+        return vm.cmpFields[key];
+      },
+      set: function set(newValue) {
+        var vm = getAssociatedVM(this);
 
-      unlockAttribute(elm, name);
-      setAttribute$1(elm, name, value, namespace);
-      lockAttribute();
-    },
-    getBoundingClientRect: function getBoundingClientRect() {
-      var vm = getAssociatedVM(this);
-      var elm = vm.elm;
+        if (newValue !== vm.cmpFields[key]) {
+          vm.cmpFields[key] = newValue;
+          componentValueMutated(vm, key);
+        }
+      },
+      enumerable: true,
+      configurable: true
+    };
+  }
+  /**
+   * INTERNAL: This function can only be invoked by compiled code. The compiler
+   * will prevent this function from being imported by user-land code.
+   */
 
-      return getBoundingClientRect$1(elm);
-    },
 
-    get isConnected() {
-      var _getAssociatedVM8 = getAssociatedVM(this),
-          elm = _getAssociatedVM8.elm;
+  function registerDecorators(Ctor, meta) {
+    var proto = Ctor.prototype;
+    var publicProps = meta.publicProps,
+        publicMethods = meta.publicMethods,
+        wire = meta.wire,
+        track = meta.track,
+        fields = meta.fields;
+    var apiMethods = create(null);
+    var apiFields = create(null);
+    var wiredMethods = create(null);
+    var wiredFields = create(null);
+    var observedFields = create(null);
+    var apiFieldsConfig = create(null);
+    var descriptor;
 
-      return isConnected$1(elm);
-    },
+    if (!isUndefined$1(publicProps)) {
+      for (var fieldName in publicProps) {
+        var propConfig = publicProps[fieldName];
+        apiFieldsConfig[fieldName] = propConfig.config;
+        descriptor = getOwnPropertyDescriptor$1(proto, fieldName);
 
-    get classList() {
-      var vm = getAssociatedVM(this);
-      var elm = vm.elm;
+        if (propConfig.config > 0) {
 
-      return getClassList$1(elm);
-    },
+          if (isUndefined$1(descriptor)) {
+            throw new Error();
+          }
 
-    get template() {
-      var vm = getAssociatedVM(this);
+          descriptor = createPublicAccessorDescriptor(fieldName, descriptor);
+        } else {
+          // with the same name, the property is defined as a public accessor. This branch is
+          // only here for backward compatibility reasons.
 
-      return vm.cmpRoot;
-    },
 
-    get shadowRoot() {
-      // From within the component instance, the shadowRoot is always reported as "closed".
-      // Authors should rely on this.template instead.
-      return null;
-    },
+          if (!isUndefined$1(descriptor) && !isUndefined$1(descriptor.get)) {
+            descriptor = createPublicAccessorDescriptor(fieldName, descriptor);
+          } else {
+            descriptor = createPublicPropertyDescriptor(fieldName);
+          }
+        }
 
-    render: function render() {
-      var vm = getAssociatedVM(this);
-      return vm.def.template;
-    },
-    toString: function toString() {
-      var vm = getAssociatedVM(this);
-      return "[object ".concat(vm.def.name, "]");
+        apiFields[fieldName] = descriptor;
+        defineProperty(proto, fieldName, descriptor);
+      }
     }
-  };
-  var queryAndChildGetterDescriptors = create(null); // The reason we don't just call `import * as renderer from '../renderer'` here is that the bundle size
-  // is smaller if we reference each function individually. Otherwise Rollup will create one big frozen
-  // object representing the renderer, with a lot of methods we don't actually need.
-
-  var childGetters = ['children', 'childNodes', 'firstChild', 'firstElementChild', 'lastChild', 'lastElementChild'];
-
-  function getChildGetter(methodName) {
-    switch (methodName) {
-      case 'children':
-        return getChildren$1;
-
-      case 'childNodes':
-        return getChildNodes$1;
-
-      case 'firstChild':
-        return getFirstChild$1;
 
-      case 'firstElementChild':
-        return getFirstElementChild$1;
+    if (!isUndefined$1(publicMethods)) {
+      forEach.call(publicMethods, function (methodName) {
+        descriptor = getOwnPropertyDescriptor$1(proto, methodName);
 
-      case 'lastChild':
-        return getLastChild$1;
+        if (isUndefined$1(descriptor)) {
+          throw new Error();
+        }
 
-      case 'lastElementChild':
-        return getLastElementChild$1;
+        apiMethods[methodName] = descriptor;
+      });
     }
-  } // Generic passthrough for child getters on HTMLElement to the relevant Renderer APIs
-
-
-  var _loop = function _loop() {
-    var childGetter = _childGetters[_i9];
-    queryAndChildGetterDescriptors[childGetter] = {
-      get: function get() {
-        var vm = getAssociatedVM(this);
-        var elm = vm.elm;
 
-        return getChildGetter(childGetter)(elm);
-      },
-      configurable: true,
-      enumerable: true
-    };
-  };
+    if (!isUndefined$1(wire)) {
+      for (var fieldOrMethodName in wire) {
+        var _wire$fieldOrMethodNa = wire[fieldOrMethodName],
+            adapter = _wire$fieldOrMethodNa.adapter,
+            method = _wire$fieldOrMethodNa.method,
+            configCallback = _wire$fieldOrMethodNa.config,
+            _wire$fieldOrMethodNa2 = _wire$fieldOrMethodNa.dynamic,
+            dynamic = _wire$fieldOrMethodNa2 === void 0 ? [] : _wire$fieldOrMethodNa2;
+        descriptor = getOwnPropertyDescriptor$1(proto, fieldOrMethodName);
 
-  for (var _i9 = 0, _childGetters = childGetters; _i9 < _childGetters.length; _i9++) {
-    _loop();
-  }
+        if (method === 1) {
 
-  var queryMethods = ['getElementsByClassName', 'getElementsByTagName', 'querySelector', 'querySelectorAll'];
+          if (isUndefined$1(descriptor)) {
+            throw new Error();
+          }
 
-  function getQueryMethod(methodName) {
-    switch (methodName) {
-      case 'getElementsByClassName':
-        return getElementsByClassName$1;
+          wiredMethods[fieldOrMethodName] = descriptor;
+          storeWiredMethodMeta(descriptor, adapter, configCallback, dynamic);
+        } else {
 
-      case 'getElementsByTagName':
-        return getElementsByTagName$1;
+          descriptor = internalWireFieldDecorator(fieldOrMethodName);
+          wiredFields[fieldOrMethodName] = descriptor;
+          storeWiredFieldMeta(descriptor, adapter, configCallback, dynamic);
+          defineProperty(proto, fieldOrMethodName, descriptor);
+        }
+      }
+    }
 
-      case 'querySelector':
-        return querySelector$1;
+    if (!isUndefined$1(track)) {
+      for (var _fieldName in track) {
+        descriptor = getOwnPropertyDescriptor$1(proto, _fieldName);
 
-      case 'querySelectorAll':
-        return querySelectorAll$1;
+        descriptor = internalTrackDecorator(_fieldName);
+        defineProperty(proto, _fieldName, descriptor);
+      }
     }
-  } // Generic passthrough for query APIs on HTMLElement to the relevant Renderer APIs
 
+    if (!isUndefined$1(fields)) {
+      for (var _i10 = 0, n = fields.length; _i10 < n; _i10++) {
+        var _fieldName2 = fields[_i10];
+        descriptor = getOwnPropertyDescriptor$1(proto, _fieldName2);
+        // tracked property. This is only here for backward compatibility purposes.
 
-  var _loop2 = function _loop2() {
-    var queryMethod = _queryMethods[_i10];
-    queryAndChildGetterDescriptors[queryMethod] = {
-      value: function value(arg) {
-        var vm = getAssociatedVM(this);
-        var elm = vm.elm;
 
-        return getQueryMethod(queryMethod)(elm, arg);
-      },
-      configurable: true,
-      enumerable: true,
-      writable: true
-    };
-  };
+        var isDuplicatePublicProp = !isUndefined$1(publicProps) && _fieldName2 in publicProps;
+        var isDuplicateTrackedProp = !isUndefined$1(track) && _fieldName2 in track;
 
-  for (var _i10 = 0, _queryMethods = queryMethods; _i10 < _queryMethods.length; _i10++) {
-    _loop2();
+        if (!isDuplicatePublicProp && !isDuplicateTrackedProp) {
+          observedFields[_fieldName2] = createObservedFieldPropertyDescriptor(_fieldName2);
+        }
+      }
+    }
+
+    setDecoratorsMeta(Ctor, {
+      apiMethods: apiMethods,
+      apiFields: apiFields,
+      apiFieldsConfig: apiFieldsConfig,
+      wiredMethods: wiredMethods,
+      wiredFields: wiredFields,
+      observedFields: observedFields
+    });
+    return Ctor;
   }
 
-  defineProperties(LightningElement.prototype, queryAndChildGetterDescriptors);
-  var lightningBasedDescriptors = create(null);
+  var signedDecoratorToMetaMap = new Map();
 
-  for (var _propName in HTMLElementOriginalDescriptors) {
-    lightningBasedDescriptors[_propName] = createBridgeToElementDescriptor(_propName, HTMLElementOriginalDescriptors[_propName]);
+  function setDecoratorsMeta(Ctor, meta) {
+    signedDecoratorToMetaMap.set(Ctor, meta);
   }
 
-  defineProperties(LightningElement.prototype, lightningBasedDescriptors);
-  defineProperty(LightningElement, 'CustomElementConstructor', {
-    get: function get() {
-      // If required, a runtime-specific implementation must be defined.
-      throw new ReferenceError('The current runtime does not support CustomElementConstructor.');
-    },
-    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
-   */
-
-  /**
-   * @wire decorator to wire fields and methods to a wire adapter in
-   * LWC Components. This function implements the internals of this
-   * decorator.
-   */
+  var defaultMeta = {
+    apiMethods: EmptyObject,
+    apiFields: EmptyObject,
+    apiFieldsConfig: EmptyObject,
+    wiredMethods: EmptyObject,
+    wiredFields: EmptyObject,
+    observedFields: EmptyObject
+  };
 
+  function getDecoratorsMeta(Ctor) {
+    var meta = signedDecoratorToMetaMap.get(Ctor);
+    return isUndefined$1(meta) ? defaultMeta : meta;
+  }
 
-  function wire(_adapter, _config) {
+  var signedTemplateSet = new Set();
 
-    throw new Error();
+  function defaultEmptyTemplate() {
+    return [];
   }
 
-  function internalWireFieldDecorator(key) {
-    return {
-      get: function get() {
-        var vm = getAssociatedVM(this);
-        componentValueObserved(vm, key);
-        return vm.cmpFields[key];
-      },
-      set: function set(value) {
-        var 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
-    };
+  signedTemplateSet.add(defaultEmptyTemplate);
+
+  function isTemplateRegistered(tpl) {
+    return signedTemplateSet.has(tpl);
   }
-  /*
-   * 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
+  /**
+   * INTERNAL: This function can only be invoked by compiled code. The compiler
+   * will prevent this function from being imported by userland code.
    */
 
 
-  function track(target) {
-    if (arguments.length === 1) {
-      return reactiveMembrane.getProxy(target);
-    }
+  function registerTemplate(tpl) {
+    signedTemplateSet.add(tpl); // chaining this method as a way to wrap existing
+    // assignment of templates easily, without too much transformation
 
-    throw new Error();
+    return tpl;
   }
+  /**
+   * EXPERIMENTAL: This function acts like a hook for Lightning Locker Service and other similar
+   * libraries to sanitize vulnerable attributes.
+   */
 
-  function internalTrackDecorator(key) {
-    return {
-      get: function get() {
-        var vm = getAssociatedVM(this);
-        componentValueObserved(vm, key);
-        return vm.cmpFields[key];
-      },
-      set: function set(newValue) {
-        var vm = getAssociatedVM(this);
-
-        var reactiveOrAnyValue = reactiveMembrane.getProxy(newValue);
 
-        if (reactiveOrAnyValue !== vm.cmpFields[key]) {
-          vm.cmpFields[key] = reactiveOrAnyValue;
-          componentValueMutated(vm, key);
-        }
-      },
-      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.
@@ -2794,569 +2799,545 @@
    * 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 api$1() {
+  var cachedGetterByKey = create(null);
+  var cachedSetterByKey = create(null);
 
-    throw new Error();
-  }
+  function createGetter(key) {
+    var fn = cachedGetterByKey[key];
 
-  function createPublicPropertyDescriptor(key) {
-    return {
-      get: function get() {
+    if (isUndefined$1(fn)) {
+      fn = cachedGetterByKey[key] = function () {
         var vm = getAssociatedVM(this);
+        var getHook = vm.getHook;
+        return getHook(vm.component, key);
+      };
+    }
 
-        if (isBeingConstructed(vm)) {
+    return fn;
+  }
 
-          return;
-        }
+  function createSetter(key) {
+    var fn = cachedSetterByKey[key];
 
-        componentValueObserved(vm, key);
-        return vm.cmpProps[key];
-      },
-      set: function set(newValue) {
+    if (isUndefined$1(fn)) {
+      fn = cachedSetterByKey[key] = function (newValue) {
         var vm = getAssociatedVM(this);
+        var setHook = vm.setHook;
+        newValue = reactiveMembrane.getReadOnlyProxy(newValue);
+        setHook(vm.component, key, newValue);
+      };
+    }
 
-        vm.cmpProps[key] = newValue;
-        componentValueMutated(vm, key);
-      },
-      enumerable: true,
-      configurable: true
-    };
+    return fn;
   }
 
-  var AccessorReactiveObserver = /*#__PURE__*/function (_ReactiveObserver) {
-    _inherits(AccessorReactiveObserver, _ReactiveObserver);
-
-    var _super3 = _createSuper(AccessorReactiveObserver);
-
-    function AccessorReactiveObserver(vm, set) {
-      var _this2;
-
-      _classCallCheck(this, AccessorReactiveObserver);
-
-      _this2 = _super3.call(this, function () {
-        if (isFalse(_this2.debouncing)) {
-          _this2.debouncing = true;
-          addCallbackToNextTick(function () {
-            if (isTrue(_this2.debouncing)) {
-              var _assertThisInitialize = _assertThisInitialized(_this2),
-                  value = _assertThisInitialize.value;
+  function createMethodCaller(methodName) {
+    return function () {
+      var vm = getAssociatedVM(this);
+      var callHook = vm.callHook,
+          component = vm.component;
+      var fn = component[methodName];
+      return callHook(vm.component, fn, ArraySlice.call(arguments));
+    };
+  }
 
-              var dirtyStateBeforeSetterCall = vm.isDirty,
-                  component = vm.component,
-                  _idx = vm.idx;
-              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.
+  function createAttributeChangedCallback(attributeToPropMap, superAttributeChangedCallback) {
+    return function attributeChangedCallback(attrName, oldValue, newValue) {
+      if (oldValue === newValue) {
+        // Ignore same values.
+        return;
+      }
 
-              _this2.debouncing = false;
+      var propName = attributeToPropMap[attrName];
 
-              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);
-              }
-            }
-          });
+      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);
         }
-      });
-      _this2.debouncing = false;
-      return _this2;
-    }
-
-    _createClass(AccessorReactiveObserver, [{
-      key: "reset",
-      value: function reset(value) {
-        _get2(_getPrototypeOf2(AccessorReactiveObserver.prototype), "reset", this).call(this);
-
-        this.debouncing = false;
 
-        if (arguments.length > 0) {
-          this.value = value;
-        }
+        return;
       }
-    }]);
-
-    return AccessorReactiveObserver;
-  }(ReactiveObserver);
-
-  function createPublicAccessorDescriptor(key, descriptor) {
-    var _get3 = descriptor.get,
-        _set2 = descriptor.set,
-        enumerable = descriptor.enumerable,
-        configurable = descriptor.configurable;
-
-    if (!isFunction$1(_get3)) {
-
-      throw new Error();
-    }
 
-    return {
-      get: function get() {
-
-        return _get3.call(this);
-      },
-      set: function set(newValue) {
-        var _this3 = this;
+      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.
 
-        var vm = getAssociatedVM(this);
 
-        if (_set2) {
-          if (runtimeFlags.ENABLE_REACTIVE_SETTER) {
-            var ro = vm.oar[key];
+      this[propName] = newValue;
+    };
+  }
 
-            if (isUndefined$1(ro)) {
-              ro = vm.oar[key] = new AccessorReactiveObserver(vm, _set2);
-            } // 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 HTMLBridgeElementFactory(SuperClass, props, methods) {
+    var 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 = /*#__PURE__*/function (_SuperClass) {
+        _inherits(HTMLBridgeElement, _SuperClass);
 
-            ro.reset(newValue);
-            ro.observe(function () {
-              _set2.call(_this3, newValue);
-            });
-          } else {
-            _set2.call(this, newValue);
-          }
-        }
-      },
-      enumerable: enumerable,
-      configurable: configurable
-    };
-  }
+        var _super4 = _createSuper(HTMLBridgeElement);
 
-  function createObservedFieldPropertyDescriptor(key) {
-    return {
-      get: function get() {
-        var vm = getAssociatedVM(this);
-        componentValueObserved(vm, key);
-        return vm.cmpFields[key];
-      },
-      set: function set(newValue) {
-        var vm = getAssociatedVM(this);
+        function HTMLBridgeElement() {
+          _classCallCheck(this, HTMLBridgeElement);
 
-        if (newValue !== vm.cmpFields[key]) {
-          vm.cmpFields[key] = newValue;
-          componentValueMutated(vm, key);
-        }
-      },
-      enumerable: true,
-      configurable: true
-    };
-  }
-  /**
-   * INTERNAL: This function can only be invoked by compiled code. The compiler
-   * will prevent this function from being imported by user-land code.
-   */
+          return _super4.apply(this, arguments);
+        }
 
+        return _createClass(HTMLBridgeElement);
+      }(SuperClass);
+    } else {
+      HTMLBridgeElement = function HTMLBridgeElement() {
+        // 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
 
-  function registerDecorators(Ctor, meta) {
-    var proto = Ctor.prototype;
-    var publicProps = meta.publicProps,
-        publicMethods = meta.publicMethods,
-        wire = meta.wire,
-        track = meta.track,
-        fields = meta.fields;
-    var apiMethods = create(null);
-    var apiFields = create(null);
-    var wiredMethods = create(null);
-    var wiredFields = create(null);
-    var observedFields = create(null);
-    var apiFieldsConfig = create(null);
-    var descriptor;
 
-    if (!isUndefined$1(publicProps)) {
-      for (var fieldName in publicProps) {
-        var propConfig = publicProps[fieldName];
-        apiFieldsConfig[fieldName] = propConfig.config;
-        descriptor = getOwnPropertyDescriptor$1(proto, fieldName);
+      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 (propConfig.config > 0) {
 
-          if (isUndefined$1(descriptor)) {
-            throw new Error();
-          }
+    var attributeToPropMap = create(null);
+    var superAttributeChangedCallback = SuperClass.prototype.attributeChangedCallback;
+    var _SuperClass$observedA = SuperClass.observedAttributes,
+        superObservedAttributes = _SuperClass$observedA === void 0 ? [] : _SuperClass$observedA;
+    var descriptors = create(null); // expose getters and setters for each public props on the new Element Bridge
 
-          descriptor = createPublicAccessorDescriptor(fieldName, descriptor);
-        } else {
-          // with the same name, the property is defined as a public accessor. This branch is
-          // only here for backward compatibility reasons.
+    for (var _i11 = 0, _len3 = props.length; _i11 < _len3; _i11 += 1) {
+      var _propName2 = props[_i11];
+      attributeToPropMap[htmlPropertyToAttribute(_propName2)] = _propName2;
+      descriptors[_propName2] = {
+        get: createGetter(_propName2),
+        set: createSetter(_propName2),
+        enumerable: true,
+        configurable: true
+      };
+    } // expose public methods as props on the new Element Bridge
 
 
-          if (!isUndefined$1(descriptor) && !isUndefined$1(descriptor.get)) {
-            descriptor = createPublicAccessorDescriptor(fieldName, descriptor);
-          } else {
-            descriptor = createPublicPropertyDescriptor(fieldName);
-          }
-        }
+    for (var _i12 = 0, _len4 = methods.length; _i12 < _len4; _i12 += 1) {
+      var methodName = methods[_i12];
+      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.
 
-        apiFields[fieldName] = descriptor;
-        defineProperty(proto, fieldName, descriptor);
+
+    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: function get() {
+        return [].concat(_toConsumableArray(superObservedAttributes), _toConsumableArray(keys(attributeToPropMap)));
       }
-    }
+    });
+    defineProperties(HTMLBridgeElement.prototype, descriptors);
+    return HTMLBridgeElement;
+  }
 
-    if (!isUndefined$1(publicMethods)) {
-      forEach.call(publicMethods, function (methodName) {
-        descriptor = getOwnPropertyDescriptor$1(proto, methodName);
+  var 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
+   */
 
-        if (isUndefined$1(descriptor)) {
-          throw new Error();
-        }
+  function resolveCircularModuleDependency(fn) {
+    var module = fn();
+    return (module === null || module === void 0 ? void 0 : module.__esModule) ? module.default : module;
+  }
 
-        apiMethods[methodName] = descriptor;
-      });
+  function isCircularModuleDependency(obj) {
+    return isFunction$1(obj) && hasOwnProperty$1.call(obj, '__circular__');
+  }
+
+  function setActiveVM(vm) {
+    {
+      // this method should never leak to prod
+      throw new ReferenceError();
     }
+  }
 
-    if (!isUndefined$1(wire)) {
-      for (var fieldOrMethodName in wire) {
-        var _wire$fieldOrMethodNa = wire[fieldOrMethodName],
-            adapter = _wire$fieldOrMethodNa.adapter,
-            method = _wire$fieldOrMethodNa.method,
-            configCallback = _wire$fieldOrMethodNa.config,
-            _wire$fieldOrMethodNa2 = _wire$fieldOrMethodNa.dynamic,
-            dynamic = _wire$fieldOrMethodNa2 === void 0 ? [] : _wire$fieldOrMethodNa2;
-        descriptor = getOwnPropertyDescriptor$1(proto, fieldOrMethodName);
+  function swapTemplate(oldTpl, newTpl) {
 
-        if (method === 1) {
+    if (!runtimeFlags.ENABLE_HMR) {
+      throw new Error('HMR is not enabled');
+    }
 
-          if (isUndefined$1(descriptor)) {
-            throw new Error();
-          }
+    return false;
+  }
 
-          wiredMethods[fieldOrMethodName] = descriptor;
-          storeWiredMethodMeta(descriptor, adapter, configCallback, dynamic);
-        } else {
+  function swapComponent(oldComponent, newComponent) {
 
-          descriptor = internalWireFieldDecorator(fieldOrMethodName);
-          wiredFields[fieldOrMethodName] = descriptor;
-          storeWiredFieldMeta(descriptor, adapter, configCallback, dynamic);
-          defineProperty(proto, fieldOrMethodName, descriptor);
-        }
-      }
+    if (!runtimeFlags.ENABLE_HMR) {
+      throw new Error('HMR is not enabled');
     }
 
-    if (!isUndefined$1(track)) {
-      for (var _fieldName in track) {
-        descriptor = getOwnPropertyDescriptor$1(proto, _fieldName);
+    return false;
+  }
 
-        descriptor = internalTrackDecorator(_fieldName);
-        defineProperty(proto, _fieldName, descriptor);
-      }
+  function swapStyle(oldStyle, newStyle) {
+
+    if (!runtimeFlags.ENABLE_HMR) {
+      throw new Error('HMR is not enabled');
     }
 
-    if (!isUndefined$1(fields)) {
-      for (var _i11 = 0, n = fields.length; _i11 < n; _i11++) {
-        var _fieldName2 = fields[_i11];
-        descriptor = getOwnPropertyDescriptor$1(proto, _fieldName2);
-        // tracked property. This is only here for backward compatibility purposes.
+    return false;
+  }
+  /*
+   * Copyright (c) 2018, salesforce.com, inc.
+   * All rights reserved.
+   * SPDX-License-Identifier: MIT
+   * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+   */
 
 
-        var isDuplicatePublicProp = !isUndefined$1(publicProps) && _fieldName2 in publicProps;
-        var isDuplicateTrackedProp = !isUndefined$1(track) && _fieldName2 in track;
+  var CtorToDefMap = new WeakMap();
 
-        if (!isDuplicatePublicProp && !isDuplicateTrackedProp) {
-          observedFields[_fieldName2] = createObservedFieldPropertyDescriptor(_fieldName2);
-        }
-      }
-    }
+  function getCtorProto(Ctor) {
+    var proto = getPrototypeOf$1(Ctor);
 
-    setDecoratorsMeta(Ctor, {
-      apiMethods: apiMethods,
-      apiFields: apiFields,
-      apiFieldsConfig: apiFieldsConfig,
-      wiredMethods: wiredMethods,
-      wiredFields: wiredFields,
-      observedFields: observedFields
-    });
-    return Ctor;
-  }
+    if (isNull(proto)) {
+      throw new ReferenceError("Invalid prototype chain for ".concat(Ctor.name, ", you must extend LightningElement."));
+    } // covering the cases where the ref is circular in AMD
 
-  var signedDecoratorToMetaMap = new Map();
 
-  function setDecoratorsMeta(Ctor, meta) {
-    signedDecoratorToMetaMap.set(Ctor, meta);
-  }
+    if (isCircularModuleDependency(proto)) {
+      var p = resolveCircularModuleDependency(proto);
+      // 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.
 
-  var defaultMeta = {
-    apiMethods: EmptyObject,
-    apiFields: EmptyObject,
-    apiFieldsConfig: EmptyObject,
-    wiredMethods: EmptyObject,
-    wiredFields: EmptyObject,
-    observedFields: EmptyObject
-  };
 
-  function getDecoratorsMeta(Ctor) {
-    var meta = signedDecoratorToMetaMap.get(Ctor);
-    return isUndefined$1(meta) ? defaultMeta : meta;
+      proto = p === proto ? LightningElement : p;
+    }
+
+    return proto;
   }
 
-  var signedTemplateSet = new Set();
+  function createComponentDef(Ctor) {
+    var ctorShadowSupportMode = Ctor.shadowSupportMode,
+        ctorRenderMode = Ctor.renderMode;
 
-  function defaultEmptyTemplate() {
-    return [];
-  }
+    var decoratorsMeta = getDecoratorsMeta(Ctor);
+    var apiFields = decoratorsMeta.apiFields,
+        apiFieldsConfig = decoratorsMeta.apiFieldsConfig,
+        apiMethods = decoratorsMeta.apiMethods,
+        wiredFields = decoratorsMeta.wiredFields,
+        wiredMethods = decoratorsMeta.wiredMethods,
+        observedFields = decoratorsMeta.observedFields;
+    var proto = Ctor.prototype;
+    var connectedCallback = proto.connectedCallback,
+        disconnectedCallback = proto.disconnectedCallback,
+        renderedCallback = proto.renderedCallback,
+        errorCallback = proto.errorCallback,
+        render = proto.render;
+    var superProto = getCtorProto(Ctor);
+    var superDef = superProto !== LightningElement ? getComponentInternalDef(superProto) : lightingElementDef;
+    var bridge = HTMLBridgeElementFactory(superDef.bridge, keys(apiFields), keys(apiMethods));
+    var props = assign(create(null), superDef.props, apiFields);
+    var propsConfig = assign(create(null), superDef.propsConfig, apiFieldsConfig);
+    var methods = assign(create(null), superDef.methods, apiMethods);
+    var 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;
+    var shadowSupportMode = superDef.shadowSupportMode;
+
+    if (!isUndefined$1(ctorShadowSupportMode)) {
+      shadowSupportMode = ctorShadowSupportMode;
+    }
 
-  signedTemplateSet.add(defaultEmptyTemplate);
+    var renderMode = superDef.renderMode;
 
-  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.
-   */
+    if (!isUndefined$1(ctorRenderMode)) {
+      renderMode = ctorRenderMode === 'light' ? 0
+      /* Light */
+      : 1
+      /* Shadow */
+      ;
+    }
 
+    var template = getComponentRegisteredTemplate(Ctor) || superDef.template;
+    var name = Ctor.name || superDef.name; // installing observed fields into the prototype.
 
-  function registerTemplate(tpl) {
-    signedTemplateSet.add(tpl); // chaining this method as a way to wrap existing
-    // assignment of templates easily, without too much transformation
+    defineProperties(proto, observedFields);
+    var def = {
+      ctor: Ctor,
+      name: name,
+      wire: wire,
+      props: props,
+      propsConfig: propsConfig,
+      methods: methods,
+      bridge: bridge,
+      template: template,
+      renderMode: renderMode,
+      shadowSupportMode: shadowSupportMode,
+      connectedCallback: connectedCallback,
+      disconnectedCallback: disconnectedCallback,
+      renderedCallback: renderedCallback,
+      errorCallback: errorCallback,
+      render: render
+    };
 
-    return tpl;
+    return def;
   }
   /**
-   * EXPERIMENTAL: This function acts like a hook for Lightning Locker Service and other similar
-   * libraries to sanitize vulnerable attributes.
+   * EXPERIMENTAL: This function allows for the identification of LWC constructors. This API is
+   * subject to change or being removed.
    */
 
 
-  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:
+  function isComponentConstructor(ctor) {
+    if (!isFunction$1(ctor)) {
+      return false;
+    } // Fast path: LightningElement is part of the prototype chain of the constructor.
 
 
-  var cachedGetterByKey = create(null);
-  var cachedSetterByKey = create(null);
+    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.
 
-  function createGetter(key) {
-    var fn = cachedGetterByKey[key];
 
-    if (isUndefined$1(fn)) {
-      fn = cachedGetterByKey[key] = function () {
-        var vm = getAssociatedVM(this);
-        var getHook = vm.getHook;
-        return getHook(vm.component, key);
-      };
-    }
+    var current = ctor;
 
-    return fn;
-  }
+    do {
+      if (isCircularModuleDependency(current)) {
+        var 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.
 
-  function createSetter(key) {
-    var fn = cachedSetterByKey[key];
+        if (circularResolved === current) {
+          return true;
+        }
 
-    if (isUndefined$1(fn)) {
-      fn = cachedSetterByKey[key] = function (newValue) {
-        var vm = getAssociatedVM(this);
-        var setHook = vm.setHook;
-        newValue = reactiveMembrane.getReadOnlyProxy(newValue);
-        setHook(vm.component, key, newValue);
-      };
-    }
+        current = circularResolved;
+      }
 
-    return fn;
-  }
+      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.
 
-  function createMethodCaller(methodName) {
-    return function () {
-      var vm = getAssociatedVM(this);
-      var callHook = vm.callHook,
-          component = vm.component;
-      var fn = component[methodName];
-      return callHook(vm.component, fn, ArraySlice.call(arguments));
-    };
+
+    return false;
   }
 
-  function createAttributeChangedCallback(attributeToPropMap, superAttributeChangedCallback) {
-    return function attributeChangedCallback(attrName, oldValue, newValue) {
-      if (oldValue === newValue) {
-        // Ignore same values.
-        return;
-      }
+  function getComponentInternalDef(Ctor) {
 
-      var propName = attributeToPropMap[attrName];
+    var def = CtorToDefMap.get(Ctor);
 
-      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);
-        }
+    if (isUndefined$1(def)) {
+      if (isCircularModuleDependency(Ctor)) {
+        var 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.
 
-        return;
+        CtorToDefMap.set(Ctor, def);
+        return def;
       }
 
-      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.
+      if (!isComponentConstructor(Ctor)) {
+        throw new TypeError("".concat(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);
+    }
 
-      this[propName] = newValue;
-    };
+    return def;
   }
 
-  function HTMLBridgeElementFactory(SuperClass, props, methods) {
-    var 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.
-     */
+  var 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 (isFunction$1(SuperClass)) {
-      HTMLBridgeElement = /*#__PURE__*/function (_SuperClass) {
-        _inherits(HTMLBridgeElement, _SuperClass);
+  function getComponentDef(Ctor) {
+    var 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.
 
-        var _super4 = _createSuper(HTMLBridgeElement);
+    var ctor = def.ctor,
+        name = def.name,
+        props = def.props,
+        propsConfig = def.propsConfig,
+        methods = def.methods;
+    var publicProps = {};
 
-        function HTMLBridgeElement() {
-          _classCallCheck(this, HTMLBridgeElement);
+    for (var key in props) {
+      // avoid leaking the reference to the public props descriptors
+      publicProps[key] = {
+        config: propsConfig[key] || 0,
+        type: "any"
+        /* any */
+        ,
+        attr: htmlPropertyToAttribute(key)
+      };
+    }
 
-          return _super4.apply(this, arguments);
-        }
+    var publicMethods = {};
 
-        return _createClass(HTMLBridgeElement);
-      }(SuperClass);
-    } else {
-      HTMLBridgeElement = function HTMLBridgeElement() {
-        // 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
+    for (var _key2 in methods) {
+      // avoid leaking the reference to the public method descriptors
+      publicMethods[_key2] = methods[_key2].value;
+    }
 
+    return {
+      ctor: ctor,
+      name: 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
+   */
 
-      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.
 
+  var xlinkNS = 'http://www.w3.org/1999/xlink';
+  var xmlNS = 'http://www.w3.org/XML/1998/namespace';
+  var ColonCharCode = 58;
 
-    var attributeToPropMap = create(null);
-    var superAttributeChangedCallback = SuperClass.prototype.attributeChangedCallback;
-    var _SuperClass$observedA = SuperClass.observedAttributes,
-        superObservedAttributes = _SuperClass$observedA === void 0 ? [] : _SuperClass$observedA;
-    var descriptors = create(null); // expose getters and setters for each public props on the new Element Bridge
+  function patchAttributes(oldVnode, vnode) {
+    var attrs = vnode.data.attrs;
 
-    for (var _i12 = 0, _len3 = props.length; _i12 < _len3; _i12 += 1) {
-      var _propName2 = props[_i12];
-      attributeToPropMap[htmlPropertyToAttribute(_propName2)] = _propName2;
-      descriptors[_propName2] = {
-        get: createGetter(_propName2),
-        set: createSetter(_propName2),
-        enumerable: true,
-        configurable: true
-      };
-    } // expose public methods as props on the new Element Bridge
+    if (isUndefined$1(attrs)) {
+      return;
+    }
 
+    var oldAttrs = isNull(oldVnode) ? EmptyObject : oldVnode.data.attrs;
 
-    for (var _i13 = 0, _len4 = methods.length; _i13 < _len4; _i13 += 1) {
-      var methodName = methods[_i13];
-      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 (oldAttrs === attrs) {
+      return;
+    }
 
+    var elm = vnode.elm;
 
-    descriptors.attributeChangedCallback = {
-      value: createAttributeChangedCallback(attributeToPropMap, superAttributeChangedCallback)
-    }; // Specify attributes for which we want to reflect changes back to their corresponding
-    // properties via attributeChangedCallback.
+    for (var key in attrs) {
+      var cur = attrs[key];
+      var old = oldAttrs[key];
 
-    defineProperty(HTMLBridgeElement, 'observedAttributes', {
-      get: function get() {
-        return [].concat(_toConsumableArray(superObservedAttributes), _toConsumableArray(keys(attributeToPropMap)));
+      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();
       }
-    });
-    defineProperties(HTMLBridgeElement.prototype, descriptors);
-    return HTMLBridgeElement;
+    }
   }
-
-  var BaseBridgeElement = HTMLBridgeElementFactory(HTMLElementConstructor$1, getOwnPropertyNames$1(HTMLElementOriginalDescriptors), []);
-  freeze(BaseBridgeElement);
-  seal(BaseBridgeElement.prototype);
   /*
-   * 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
    */
 
-  function resolveCircularModuleDependency(fn) {
-    var module = fn();
-    return (module === null || module === void 0 ? void 0 : module.__esModule) ? module.default : module;
-  }
-
-  function isCircularModuleDependency(obj) {
-    return isFunction$1(obj) && hasOwnProperty$1.call(obj, '__circular__');
-  }
 
-  function setActiveVM(vm) {
-    {
-      // this method should never leak to prod
-      throw new ReferenceError();
-    }
+  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 swapTemplate(oldTpl, newTpl) {
+  function patchProps(oldVnode, vnode) {
+    var props = vnode.data.props;
 
-    if (!runtimeFlags.ENABLE_HMR) {
-      throw new Error('HMR is not enabled');
+    if (isUndefined$1(props)) {
+      return;
     }
 
-    return false;
-  }
-
-  function swapComponent(oldComponent, newComponent) {
+    var oldProps = isNull(oldVnode) ? EmptyObject : oldVnode.data.props;
 
-    if (!runtimeFlags.ENABLE_HMR) {
-      throw new Error('HMR is not enabled');
+    if (oldProps === props) {
+      return;
     }
 
-    return false;
-  }
+    var isFirstPatch = isNull(oldVnode);
+    var elm = vnode.elm,
+        sel = vnode.sel;
 
-  function swapStyle(oldStyle, newStyle) {
+    for (var key in props) {
+      var 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 (!runtimeFlags.ENABLE_HMR) {
-      throw new Error('HMR is not enabled');
+      if (isFirstPatch || cur !== (isLiveBindingProp(sel, key) ? getProperty$1(elm, key) : oldProps[key])) {
+        setProperty$1(elm, key, cur);
+      }
     }
-
-    return false;
   }
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -3366,224 +3347,167 @@
    */
 
 
-  var CtorToDefMap = new WeakMap();
-
-  function getCtorProto(Ctor) {
-    var proto = getPrototypeOf$1(Ctor);
-
-    if (isNull(proto)) {
-      throw new ReferenceError("Invalid prototype chain for ".concat(Ctor.name, ", you must extend LightningElement."));
-    } // covering the cases where the ref is circular in AMD
+  var classNameToClassMap = create(null);
 
+  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 (isCircularModuleDependency(proto)) {
-      var p = resolveCircularModuleDependency(proto);
-      // 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.
 
+    className = isString(className) ? className : className + '';
+    var map = classNameToClassMap[className];
 
-      proto = p === proto ? LightningElement : p;
+    if (map) {
+      return map;
     }
 
-    return proto;
-  }
-
-  function createComponentDef(Ctor) {
-    var ctorShadowSupportMode = Ctor.shadowSupportMode,
-        ctorRenderMode = Ctor.renderMode;
+    map = create(null);
+    var start = 0;
+    var o;
+    var len = className.length;
 
-    var decoratorsMeta = getDecoratorsMeta(Ctor);
-    var apiFields = decoratorsMeta.apiFields,
-        apiFieldsConfig = decoratorsMeta.apiFieldsConfig,
-        apiMethods = decoratorsMeta.apiMethods,
-        wiredFields = decoratorsMeta.wiredFields,
-        wiredMethods = decoratorsMeta.wiredMethods,
-        observedFields = decoratorsMeta.observedFields;
-    var proto = Ctor.prototype;
-    var connectedCallback = proto.connectedCallback,
-        disconnectedCallback = proto.disconnectedCallback,
-        renderedCallback = proto.renderedCallback,
-        errorCallback = proto.errorCallback,
-        render = proto.render;
-    var superProto = getCtorProto(Ctor);
-    var superDef = superProto !== LightningElement ? getComponentInternalDef(superProto) : lightingElementDef;
-    var bridge = HTMLBridgeElementFactory(superDef.bridge, keys(apiFields), keys(apiMethods));
-    var props = assign(create(null), superDef.props, apiFields);
-    var propsConfig = assign(create(null), superDef.propsConfig, apiFieldsConfig);
-    var methods = assign(create(null), superDef.methods, apiMethods);
-    var 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;
-    var shadowSupportMode = superDef.shadowSupportMode;
+    for (o = 0; o < len; o++) {
+      if (StringCharCodeAt.call(className, o) === SPACE_CHAR) {
+        if (o > start) {
+          map[StringSlice.call(className, start, o)] = true;
+        }
 
-    if (!isUndefined$1(ctorShadowSupportMode)) {
-      shadowSupportMode = ctorShadowSupportMode;
+        start = o + 1;
+      }
     }
 
-    var renderMode = superDef.renderMode;
-
-    if (!isUndefined$1(ctorRenderMode)) {
-      renderMode = ctorRenderMode === 'light' ? 0
-      /* Light */
-      : 1
-      /* Shadow */
-      ;
+    if (o > start) {
+      map[StringSlice.call(className, start, o)] = true;
     }
 
-    var template = getComponentRegisteredTemplate(Ctor) || superDef.template;
-    var name = Ctor.name || superDef.name; // installing observed fields into the prototype.
-
-    defineProperties(proto, observedFields);
-    var def = {
-      ctor: Ctor,
-      name: name,
-      wire: wire,
-      props: props,
-      propsConfig: propsConfig,
-      methods: methods,
-      bridge: bridge,
-      template: template,
-      renderMode: renderMode,
-      shadowSupportMode: shadowSupportMode,
-      connectedCallback: connectedCallback,
-      disconnectedCallback: disconnectedCallback,
-      renderedCallback: renderedCallback,
-      errorCallback: errorCallback,
-      render: render
-    };
+    classNameToClassMap[className] = map;
 
-    return def;
+    return map;
   }
-  /**
-   * EXPERIMENTAL: This function allows for the identification of LWC constructors. This API is
-   * subject to change or being removed.
-   */
 
+  function patchClassAttribute(oldVnode, vnode) {
+    var elm = vnode.elm,
+        newClass = vnode.data.className;
+    var oldClass = isNull(oldVnode) ? undefined : oldVnode.data.className;
 
-  function isComponentConstructor(ctor) {
-    if (!isFunction$1(ctor)) {
-      return false;
-    } // Fast path: LightningElement is part of the prototype chain of the constructor.
+    if (oldClass === newClass) {
+      return;
+    }
 
+    var classList = getClassList$1(elm);
+    var newClassMap = getMapFromClassName(newClass);
+    var oldClassMap = getMapFromClassName(oldClass);
+    var name;
 
-    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.
+    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);
+      }
+    }
+
+    for (name in newClassMap) {
+      if (isUndefined$1(oldClassMap[name])) {
+        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
+   */
 
 
-    var current = ctor;
+  function patchStyleAttribute(oldVnode, vnode) {
+    var elm = vnode.elm,
+        newStyle = vnode.data.style;
+    var oldStyle = isNull(oldVnode) ? undefined : oldVnode.data.style;
 
-    do {
-      if (isCircularModuleDependency(current)) {
-        var 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 (oldStyle === newStyle) {
+      return;
+    }
 
-        if (circularResolved === current) {
-          return true;
-        }
+    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
+   */
 
-        current = circularResolved;
-      }
 
-      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.
+  function applyEventListeners(vnode) {
+    var elm = vnode.elm,
+        on = vnode.data.on;
 
+    if (isUndefined$1(on)) {
+      return;
+    }
 
-    return false;
+    for (var name in on) {
+      var 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.
 
-  function getComponentInternalDef(Ctor) {
-
-    var def = CtorToDefMap.get(Ctor);
 
-    if (isUndefined$1(def)) {
-      if (isCircularModuleDependency(Ctor)) {
-        var 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.
+  function applyStaticClassAttribute(vnode) {
+    var elm = vnode.elm,
+        classMap = vnode.data.classMap;
 
-        CtorToDefMap.set(Ctor, def);
-        return def;
-      }
+    if (isUndefined$1(classMap)) {
+      return;
+    }
 
-      if (!isComponentConstructor(Ctor)) {
-        throw new TypeError("".concat(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."));
-      }
+    var classList = getClassList$1(elm);
 
-      def = createComponentDef(Ctor);
-      CtorToDefMap.set(Ctor, def);
+    for (var name in classMap) {
+      classList.add(name);
     }
-
-    return def;
   }
-
-  var 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.
+  /*
+   * 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) {
-    var 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.
 
-    var ctor = def.ctor,
-        name = def.name,
-        props = def.props,
-        propsConfig = def.propsConfig,
-        methods = def.methods;
-    var publicProps = {};
+  function applyStaticStyleAttribute(vnode) {
+    var elm = vnode.elm,
+        styleDecls = vnode.data.styleDecls;
 
-    for (var 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;
     }
 
-    var publicMethods = {};
+    for (var _i13 = 0; _i13 < styleDecls.length; _i13++) {
+      var _styleDecls$_i = _slicedToArray(styleDecls[_i13], 3),
+          prop = _styleDecls$_i[0],
+          value = _styleDecls$_i[1],
+          important = _styleDecls$_i[2];
 
-    for (var _key2 in methods) {
-      // avoid leaking the reference to the public method descriptors
-      publicMethods[_key2] = methods[_key2].value;
+      setCSSStyleProperty$1(elm, prop, value, important);
     }
-
-    return {
-      ctor: ctor,
-      name: name,
-      props: publicProps,
-      methods: publicMethods
-    };
   }
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -3632,28 +3556,24 @@
     remove$1(vnode.elm, parentNode);
   }
 
-  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) {
@@ -3679,24 +3599,11 @@
     }
   }
 
-  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) {
-    var elm = vnode.elm,
-        children = vnode.children;
-
-    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);
     }
   }
 
@@ -3761,19 +3668,6 @@
     });
   }
 
-  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) {
     var elm = vnode.elm,
         children = vnode.children;
@@ -3804,16 +3698,6 @@
     }
   }
 
-  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
@@ -3828,6 +3712,62 @@
         ch.hook.remove(ch, elm);
       }
     }
+  }
+
+  function allocateInSlot(vm, children) {
+    var oldSlots = vm.cmpSlots;
+    var cmpSlots = vm.cmpSlots = create(null);
+
+    for (var _i16 = 0, _len6 = children.length; _i16 < _len6; _i16 += 1) {
+      var vnode = children[_i16];
+
+      if (isNull(vnode)) {
+        continue;
+      }
+
+      var data = vnode.data;
+      var slotName = data.attrs && data.attrs.slot || '';
+      var 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 = "@".concat(slotName, ":").concat(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
+      var oldKeys = keys(oldSlots);
+
+      if (oldKeys.length !== keys(cmpSlots).length) {
+        markComponentAsDirty(vm);
+        return;
+      }
+
+      for (var _i17 = 0, _len7 = oldKeys.length; _i17 < _len7; _i17 += 1) {
+        var key = oldKeys[_i17];
+
+        if (isUndefined$1(cmpSlots[key]) || oldSlots[key].length !== cmpSlots[key].length) {
+          markComponentAsDirty(vm);
+          return;
+        }
+
+        var oldVNodes = oldSlots[key];
+        var _vnodes = cmpSlots[key];
+
+        for (var 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 :(
 
 
@@ -3954,11 +3894,11 @@
       linkNodeToShadow(elm, owner);
       fallbackElmHook(elm, vnode);
       vnode.elm = elm;
-      createElmHook(vnode);
+      patchElementPropsAndAttrs(null, vnode);
     },
     update: function update(oldVnode, vnode) {
-      updateElmHook(oldVnode, vnode);
-      updateChildrenHook(oldVnode, vnode);
+      patchElementPropsAndAttrs(oldVnode, vnode);
+      patchChildren(vnode.elm, oldVnode.children, vnode.children);
     },
     insert: function insert(vnode, parentNode, referenceNode) {
       insertNodeHook(vnode, parentNode, referenceNode);
@@ -4026,10 +3966,10 @@
         throw new TypeError("Incorrect Component Constructor");
       }
 
-      createCustomElmHook(vnode);
+      patchElementPropsAndAttrs(null, vnode);
     },
     update: function update(oldVnode, vnode) {
-      updateCustomElmHook(oldVnode, vnode);
+      patchElementPropsAndAttrs(oldVnode, vnode);
       var vm = getAssociatedVMIfPresent(vnode.elm);
 
       if (vm) {
@@ -4040,7 +3980,7 @@
       // will happen, but in native, it does allocate the light dom
 
 
-      updateChildrenHook(oldVnode, vnode);
+      patchChildren(vnode.elm, oldVnode.children, vnode.children);
 
       if (vm) {
         // this is important to preserve the top to bottom synchronous rendering phase.
@@ -4566,8 +4506,8 @@
     var content = [];
     var root;
 
-    for (var _i16 = 0; _i16 < stylesheets.length; _i16++) {
-      var stylesheet = stylesheets[_i16];
+    for (var _i18 = 0; _i18 < stylesheets.length; _i18++) {
+      var stylesheet = stylesheets[_i18];
 
       if (isArray$1(stylesheet)) {
         ArrayPush$1.apply(content, evaluateStylesheetsContent(stylesheet, stylesheetToken, vm));
@@ -4671,8 +4611,8 @@
     && shadowMode === 1
     /* Synthetic */
     ) {
-      for (var _i17 = 0; _i17 < stylesheets.length; _i17++) {
-        insertGlobalStylesheet$1(stylesheets[_i17]);
+      for (var _i19 = 0; _i19 < stylesheets.length; _i19++) {
+        insertGlobalStylesheet$1(stylesheets[_i19]);
       }
     } else if (ssr$1 || isHydrating$1()) {
       // Note: We need to ensure that during hydration, the stylesheets method is the same as those in ssr.
@@ -4686,12 +4626,12 @@
       var root = getNearestNativeShadowComponent(vm);
       var isGlobal = isNull(root);
 
-      for (var _i18 = 0; _i18 < stylesheets.length; _i18++) {
+      for (var _i20 = 0; _i20 < stylesheets.length; _i20++) {
         if (isGlobal) {
-          insertGlobalStylesheet$1(stylesheets[_i18]);
+          insertGlobalStylesheet$1(stylesheets[_i20]);
         } else {
           // local level
-          insertStylesheet$1(stylesheets[_i18], root.cmpRoot);
+          insertStylesheet$1(stylesheets[_i20], root.cmpRoot);
         }
       }
     }
@@ -4876,8 +4816,8 @@
     var stylesheets = template.stylesheets;
 
     if (!isUndefined$1(stylesheets)) {
-      for (var _i19 = 0; _i19 < stylesheets.length; _i19++) {
-        if (isTrue(stylesheets[_i19][KEY__SCOPED_CSS])) {
+      for (var _i21 = 0; _i21 < stylesheets.length; _i21++) {
+        if (isTrue(stylesheets[_i21][KEY__SCOPED_CSS])) {
           return true;
         }
       }
@@ -5078,8 +5018,8 @@
 
   function register(service) {
 
-    for (var _i20 = 0; _i20 < hooks.length; ++_i20) {
-      var hookName = hooks[_i20];
+    for (var _i22 = 0; _i22 < hooks.length; ++_i22) {
+      var hookName = hooks[_i22];
 
       if (hookName in service) {
         var l = Services[hookName];
@@ -5099,8 +5039,8 @@
         def = vm.def,
         context = vm.context;
 
-    for (var _i21 = 0, _len6 = cbs.length; _i21 < _len6; ++_i21) {
-      cbs[_i21].call(undefined, component, {}, def, context);
+    for (var _i23 = 0, _len8 = cbs.length; _i23 < _len8; ++_i23) {
+      cbs[_i23].call(undefined, component, {}, def, context);
     }
   }
   /*
@@ -5374,7 +5314,6 @@
       // patch function mutates vnodes by adding the element reference,
       // however, if patching fails it contains partial changes.
       if (oldCh !== newCh) {
-        var fn = hasDynamicChildren(newCh) ? updateDynamicChildren : updateStaticChildren;
         runWithBoundaryProtection(vm, vm, function () {
           // pre
           logOperationStart(2
@@ -5382,8 +5321,8 @@
           , vm);
         }, function () {
           // job
-          var elementToRenderTo = getRenderRoot(vm);
-          fn(elementToRenderTo, oldCh, newCh);
+          var renderRoot = getRenderRoot(vm);
+          patchChildren(renderRoot, oldCh, newCh);
         }, function () {
           // post
           logOperationEnd(2
@@ -5440,19 +5379,19 @@
     });
     rehydrateQueue = []; // reset to a new queue
 
-    for (var _i22 = 0, _len7 = vms.length; _i22 < _len7; _i22 += 1) {
-      var vm = vms[_i22];
+    for (var _i24 = 0, _len9 = vms.length; _i24 < _len9; _i24 += 1) {
+      var vm = vms[_i24];
 
       try {
         rehydrate(vm);
       } catch (error) {
-        if (_i22 + 1 < _len7) {
+        if (_i24 + 1 < _len9) {
           // pieces of the queue are still pending to be rehydrated, those should have priority
           if (rehydrateQueue.length === 0) {
             addCallbackToNextTick(flushRehydrationQueue);
           }
 
-          ArrayUnshift.apply(rehydrateQueue, ArraySlice.call(vms, _i22 + 1));
+          ArrayUnshift.apply(rehydrateQueue, ArraySlice.call(vms, _i24 + 1));
         } // we need to end the measure before throwing.
 
 
@@ -5551,8 +5490,8 @@
     var vCustomElementCollection = vm.velements; // Reporting disconnection for every child in inverse order since they are
     // inserted in reserved order.
 
-    for (var _i23 = vCustomElementCollection.length - 1; _i23 >= 0; _i23 -= 1) {
-      var elm = vCustomElementCollection[_i23].elm; // There are two cases where the element could be undefined:
+    for (var _i25 = vCustomElementCollection.length - 1; _i25 >= 0; _i25 -= 1) {
+      var elm = vCustomElementCollection[_i25].elm; // There are two cases where the element could be undefined:
       // * when there is an error during the construction phase, and an error
       //   boundary picks it, there is a possibility that the VCustomElement
       //   is not properly initialized, and therefore is should be ignored.
@@ -5586,8 +5525,8 @@
 
 
   function recursivelyDisconnectChildren(vnodes) {
-    for (var _i24 = 0, _len8 = vnodes.length; _i24 < _len8; _i24 += 1) {
-      var vnode = vnodes[_i24];
+    for (var _i26 = 0, _len10 = vnodes.length; _i26 < _len10; _i26 += 1) {
+      var vnode = vnodes[_i26];
 
       if (!isNull(vnode) && isArray$1(vnode.children) && !isUndefined$1(vnode.elm)) {
         // vnode is a VElement with children
@@ -5610,8 +5549,8 @@
     var children = vm.children;
     var rootNode = getRenderRoot(vm);
 
-    for (var _i25 = 0, _len9 = children.length; _i25 < _len9; _i25++) {
-      var child = children[_i25];
+    for (var _i27 = 0, _len11 = children.length; _i27 < _len11; _i27++) {
+      var child = children[_i27];
 
       if (!isNull(child) && !isUndefined$1(child.elm)) {
         remove$1(child.elm, rootNode);
@@ -5647,65 +5586,6 @@
 
       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) {
-    var oldSlots = vm.cmpSlots;
-    var cmpSlots = vm.cmpSlots = create(null);
-
-    for (var _i26 = 0, _len10 = children.length; _i26 < _len10; _i26 += 1) {
-      var vnode = children[_i26];
-
-      if (isNull(vnode)) {
-        continue;
-      }
-
-      var data = vnode.data;
-      var slotName = data.attrs && data.attrs.slot || '';
-      var 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 = "@".concat(slotName, ":").concat(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
-      var oldKeys = keys(oldSlots);
-
-      if (oldKeys.length !== keys(cmpSlots).length) {
-        markComponentAsDirty(vm);
-        return;
-      }
-
-      for (var _i27 = 0, _len11 = oldKeys.length; _i27 < _len11; _i27 += 1) {
-        var key = oldKeys[_i27];
-
-        if (isUndefined$1(cmpSlots[key]) || oldSlots[key].length !== cmpSlots[key].length) {
-          markComponentAsDirty(vm);
-          return;
-        }
-
-        var oldVNodes = oldSlots[key];
-        var _vnodes = cmpSlots[key];
-
-        for (var 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) {
@@ -6120,7 +6000,7 @@
     hooksAreSet = true;
     setSanitizeHtmlContentHook(hooks.sanitizeHtmlContent);
   }
-  /* version: 2.7.2 */
+  /* version: 2.7.3 */
 
   /*
    * Copyright (c) 2018, salesforce.com, inc.
@@ -6820,7 +6700,7 @@
   });
   freeze(LightningElement);
   seal(LightningElement.prototype);
-  /* version: 2.7.2 */
+  /* version: 2.7.3 */
 
   exports.LightningElement = LightningElement;
   exports.__unstable__ProfilerControl = profilerControl;