@stencil/core 2.8.0 → 2.10.0

package/internal/client/index.js

@@ -11,7 +11,7 @@ let renderingRef = null;
 let queueCongestion = 0;
 let queuePending = false;
 /*
- Stencil Client Platform v2.8.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Platform v2.10.0 | MIT Licensed | https://stenciljs.com
  */
 import { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';
 const win = typeof window !== 'undefined' ? window : {};
@@ -594,7 +594,6 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
                         // Workaround for Safari, moving the <input> caret when re-assigning the same valued
                         if (memberName === 'list') {
                             isProp = false;
-                            // tslint:disable-next-line: triple-equals
                         }
                         else if (oldValue == null || elm[memberName] != n) {
                             elm[memberName] = n;
@@ -1289,6 +1288,13 @@ const createEvent = (ref, name, flags) => {
         },
     };
 };
+/**
+ * Helper function to create & dispatch a custom Event on a provided target
+ * @param elm the target of the Event
+ * @param name the name to give the custom Event
+ * @param opts options for configuring a custom Event
+ * @returns the custom Event
+ */
 const emitEvent = (elm, name, opts) => {
     const ev = plt.ce(name, opts);
     elm.dispatchEvent(ev);
@@ -1945,14 +1951,14 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
             prototype.attributeChangedCallback = function (attrName, _oldValue, newValue) {
                 plt.jmp(() => {
                     const propName = attrNameToPropName.get(attrName);
-                    //  In a webcomponent lifecyle the attributeChangedCallback runs prior to connectedCallback
+                    //  In a web component lifecycle the attributeChangedCallback runs prior to connectedCallback
                     //  in the case where an attribute was set inline.
                     //  ```html
                     //    <my-component some-attribute="some-value"></my-component>
                     //  ```
                     //
-                    //  There is an edge case where a developer sets the attribute inline on a custom element and then programatically
-                    //  changes it before it has been upgraded as shown below:
+                    //  There is an edge case where a developer sets the attribute inline on a custom element and then
+                    //  programmatically changes it before it has been upgraded as shown below:
                     //
                     //  ```html
                     //    <!-- this component has _not_ been upgraded yet -->
@@ -1962,13 +1968,13 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
                     //      el = document.querySelector("#test");
                     //      el.someAttribute = "another-value";
                     //      // upgrade component
-                    //      cutsomElements.define('my-component', MyComponent);
+                    //      customElements.define('my-component', MyComponent);
                     //    </script>
                     //  ```
                     //  In this case if we do not unshadow here and use the value of the shadowing property, attributeChangedCallback
                     //  will be called with `newValue = "some-value"` and will set the shadowed property (this.someAttribute = "another-value")
                     //  to the value that was set inline i.e. "some-value" from above example. When
-                    //  the connectedCallback attempts to unshadow it will use "some-value" as the intial value rather than "another-value"
+                    //  the connectedCallback attempts to unshadow it will use "some-value" as the initial value rather than "another-value"
                     //
                     //  The case where the attribute was NOT set inline but was not set programmatically shall be handled/unshadowed
                     //  by connectedCallback as this attributeChangedCallback will not fire.
@@ -1982,6 +1988,14 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
                         newValue = this[propName];
                         delete this[propName];
                     }
+                    else if (prototype.hasOwnProperty(propName) &&
+                        typeof this[propName] === 'number' &&
+                        this[propName] == newValue) {
+                        // if the propName exists on the prototype of `Cstr`, this update may be a result of Stencil using native
+                        // APIs to reflect props as attributes. Calls to `setAttribute(someElement, propName)` will result in
+                        // `propName` to be converted to a `DOMString`, which may not be what we want for other primitive props.
+                        return;
+                    }
                     this[propName] = newValue === null && typeof this[propName] === 'boolean' ? false : newValue;
                 });
             };
@@ -2093,7 +2107,7 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) =>
     const ancestorComponent = hostRef.$ancestorComponent$;
     const schedule = () => scheduleUpdate(hostRef, true);
     if (BUILD.asyncLoading && ancestorComponent && ancestorComponent['s-rc']) {
-        // this is the intial load and this component it has an ancestor component
+        // this is the initial load and this component it has an ancestor component
         // but the ancestor component has NOT fired its will update lifecycle yet
         // so let's just cool our jets and wait for the ancestor to continue first
         // this will get fired off when the ancestor component
@@ -2272,6 +2286,22 @@ const proxyCustomElement = (Cstr, compactMeta) => {
                 originalDisconnectedCallback.call(this);
             }
         },
+        __attachShadow() {
+            if (supportsShadow) {
+                if (BUILD.shadowDelegatesFocus) {
+                    this.attachShadow({
+                        mode: 'open',
+                        delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */),
+                    });
+                }
+                else {
+                    this.attachShadow({ mode: 'open' });
+                }
+            }
+            else {
+                this.shadowRoot = this;
+            }
+        },
     });
     Cstr.is = cmpMeta.$tagName$;
     return proxyComponent(Cstr, cmpMeta, 1 /* isElementConstructor */ | 2 /* proxyState */);
@@ -2298,14 +2328,6 @@ const forceModeUpdate = (elm) => {
         }
     }
 };
-const attachShadow = (el) => {
-    if (supportsShadow) {
-        el.attachShadow({ mode: 'open' });
-    }
-    else {
-        el.shadowRoot = el;
-    }
-};
 const hmrStart = (elm, cmpMeta, hmrVersionId) => {
     // ¯\_(ツ)_/¯
     const hostRef = getHostRef(elm);
@@ -2379,6 +2401,62 @@ const patchSlotAppendChild = (HostElementPrototype) => {
         return this.__appendChild(newChild);
     };
 };
+/**
+ * Patches the text content of an unnamed slotted node inside a scoped component
+ * @param hostElementPrototype the `Element` to be patched
+ * @param cmpMeta component runtime metadata used to determine if the component should be patched or not
+ */
+const patchTextContent = (hostElementPrototype, cmpMeta) => {
+    if (BUILD.scoped && cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */) {
+        const descriptor = Object.getOwnPropertyDescriptor(Node.prototype, 'textContent');
+        Object.defineProperty(hostElementPrototype, '__textContent', descriptor);
+        Object.defineProperty(hostElementPrototype, 'textContent', {
+            get() {
+                var _a;
+                // get the 'default slot', which would be the first slot in a shadow tree (if we were using one), whose name is
+                // the empty string
+                const slotNode = getHostSlotNode(this.childNodes, '');
+                // when a slot node is found, the textContent _may_ be found in the next sibling (text) node, depending on how
+                // nodes were reordered during the vdom render. first try to get the text content from the sibling.
+                if (((_a = slotNode === null || slotNode === void 0 ? void 0 : slotNode.nextSibling) === null || _a === void 0 ? void 0 : _a.nodeType) === 3 /* TEXT_NODE */) {
+                    return slotNode.nextSibling.textContent;
+                }
+                else if (slotNode) {
+                    return slotNode.textContent;
+                }
+                else {
+                    // fallback to the original implementation
+                    return this.__textContent;
+                }
+            },
+            set(value) {
+                var _a;
+                // get the 'default slot', which would be the first slot in a shadow tree (if we were using one), whose name is
+                // the empty string
+                const slotNode = getHostSlotNode(this.childNodes, '');
+                // when a slot node is found, the textContent _may_ need to be placed in the next sibling (text) node,
+                // depending on how nodes were reordered during the vdom render. first try to set the text content on the
+                // sibling.
+                if (((_a = slotNode === null || slotNode === void 0 ? void 0 : slotNode.nextSibling) === null || _a === void 0 ? void 0 : _a.nodeType) === 3 /* TEXT_NODE */) {
+                    slotNode.nextSibling.textContent = value;
+                }
+                else if (slotNode) {
+                    slotNode.textContent = value;
+                }
+                else {
+                    // we couldn't find a slot, but that doesn't mean that there isn't one. if this check ran before the DOM
+                    // loaded, we could have missed it. check for a content reference element on the scoped component and insert
+                    // it there
+                    this.__textContent = value;
+                    const contentRefElm = this['s-cr'];
+                    if (contentRefElm) {
+                        this.insertBefore(contentRefElm, this.firstChild);
+                    }
+                }
+            },
+        });
+    }
+};
 const patchChildSlotNodes = (elm, cmpMeta) => {
     class FakeNodeList extends Array {
         item(n) {
@@ -2417,6 +2495,12 @@ const patchChildSlotNodes = (elm, cmpMeta) => {
     }
 };
 const getSlotName = (node) => node['s-sn'] || (node.nodeType === 1 && node.getAttribute('slot')) || '';
+/**
+ * Recursively searches a series of child nodes for a slot with the provided name.
+ * @param childNodes the nodes to search for a slot with a specific name.
+ * @param slotName the name of the slot to match on.
+ * @returns a reference to the slot node that matches the provided name, `null` otherwise
+ */
 const getHostSlotNode = (childNodes, slotName) => {
     let i = 0;
     let childNode;
@@ -2473,99 +2557,104 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
             registerStyle(styles[i].getAttribute(HYDRATED_STYLE_ID), convertScopedToShadow(styles[i].innerHTML), true);
         }
     }
-    lazyBundles.map((lazyBundle) => lazyBundle[1].map((compactMeta) => {
-        const cmpMeta = {
-            $flags$: compactMeta[0],
-            $tagName$: compactMeta[1],
-            $members$: compactMeta[2],
-            $listeners$: compactMeta[3],
-        };
-        if (BUILD.member) {
-            cmpMeta.$members$ = compactMeta[2];
-        }
-        if (BUILD.hostListener) {
-            cmpMeta.$listeners$ = compactMeta[3];
-        }
-        if (BUILD.reflect) {
-            cmpMeta.$attrsToReflect$ = [];
-        }
-        if (BUILD.watchCallback) {
-            cmpMeta.$watchers$ = {};
-        }
-        if (BUILD.shadowDom && !supportsShadow && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
-            cmpMeta.$flags$ |= 8 /* needsShadowDomShim */;
-        }
-        const tagName = BUILD.transformTagName && options.transformTagName
-            ? options.transformTagName(cmpMeta.$tagName$)
-            : cmpMeta.$tagName$;
-        const HostElement = class extends HTMLElement {
-            // StencilLazyHost
-            constructor(self) {
-                // @ts-ignore
-                super(self);
-                self = this;
-                registerHost(self, cmpMeta);
-                if (BUILD.shadowDom && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
-                    // this component is using shadow dom
-                    // and this browser supports shadow dom
-                    // add the read-only property "shadowRoot" to the host element
-                    // adding the shadow root build conditionals to minimize runtime
-                    if (supportsShadow) {
-                        if (BUILD.shadowDelegatesFocus) {
-                            self.attachShadow({
-                                mode: 'open',
-                                delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */),
-                            });
+    lazyBundles.map((lazyBundle) => {
+        lazyBundle[1].map((compactMeta) => {
+            const cmpMeta = {
+                $flags$: compactMeta[0],
+                $tagName$: compactMeta[1],
+                $members$: compactMeta[2],
+                $listeners$: compactMeta[3],
+            };
+            if (BUILD.member) {
+                cmpMeta.$members$ = compactMeta[2];
+            }
+            if (BUILD.hostListener) {
+                cmpMeta.$listeners$ = compactMeta[3];
+            }
+            if (BUILD.reflect) {
+                cmpMeta.$attrsToReflect$ = [];
+            }
+            if (BUILD.watchCallback) {
+                cmpMeta.$watchers$ = {};
+            }
+            if (BUILD.shadowDom && !supportsShadow && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
+                cmpMeta.$flags$ |= 8 /* needsShadowDomShim */;
+            }
+            const tagName = BUILD.transformTagName && options.transformTagName
+                ? options.transformTagName(cmpMeta.$tagName$)
+                : cmpMeta.$tagName$;
+            const HostElement = class extends HTMLElement {
+                // StencilLazyHost
+                constructor(self) {
+                    // @ts-ignore
+                    super(self);
+                    self = this;
+                    registerHost(self, cmpMeta);
+                    if (BUILD.shadowDom && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
+                        // this component is using shadow dom
+                        // and this browser supports shadow dom
+                        // add the read-only property "shadowRoot" to the host element
+                        // adding the shadow root build conditionals to minimize runtime
+                        if (supportsShadow) {
+                            if (BUILD.shadowDelegatesFocus) {
+                                self.attachShadow({
+                                    mode: 'open',
+                                    delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */),
+                                });
+                            }
+                            else {
+                                self.attachShadow({ mode: 'open' });
+                            }
                         }
-                        else {
-                            self.attachShadow({ mode: 'open' });
+                        else if (!BUILD.hydrateServerSide && !('shadowRoot' in self)) {
+                            self.shadowRoot = self;
                         }
                     }
-                    else if (!BUILD.hydrateServerSide && !('shadowRoot' in self)) {
-                        self.shadowRoot = self;
+                    if (BUILD.slotChildNodesFix) {
+                        patchChildSlotNodes(self, cmpMeta);
                     }
                 }
-                if (BUILD.slotChildNodesFix) {
-                    patchChildSlotNodes(self, cmpMeta);
-                }
-            }
-            connectedCallback() {
-                if (appLoadFallback) {
-                    clearTimeout(appLoadFallback);
-                    appLoadFallback = null;
+                connectedCallback() {
+                    if (appLoadFallback) {
+                        clearTimeout(appLoadFallback);
+                        appLoadFallback = null;
+                    }
+                    if (isBootstrapping) {
+                        // connectedCallback will be processed once all components have been registered
+                        deferredConnectedCallbacks.push(this);
+                    }
+                    else {
+                        plt.jmp(() => connectedCallback(this));
+                    }
                 }
-                if (isBootstrapping) {
-                    // connectedCallback will be processed once all components have been registered
-                    deferredConnectedCallbacks.push(this);
+                disconnectedCallback() {
+                    plt.jmp(() => disconnectedCallback(this));
                 }
-                else {
-                    plt.jmp(() => connectedCallback(this));
+                componentOnReady() {
+                    return getHostRef(this).$onReadyPromise$;
                 }
+            };
+            if (BUILD.cloneNodeFix) {
+                patchCloneNode(HostElement.prototype);
             }
-            disconnectedCallback() {
-                plt.jmp(() => disconnectedCallback(this));
+            if (BUILD.appendChildSlotFix) {
+                patchSlotAppendChild(HostElement.prototype);
             }
-            componentOnReady() {
-                return getHostRef(this).$onReadyPromise$;
+            if (BUILD.hotModuleReplacement) {
+                HostElement.prototype['s-hmr'] = function (hmrVersionId) {
+                    hmrStart(this, cmpMeta, hmrVersionId);
+                };
             }
-        };
-        if (BUILD.cloneNodeFix) {
-            patchCloneNode(HostElement.prototype);
-        }
-        if (BUILD.appendChildSlotFix) {
-            patchSlotAppendChild(HostElement.prototype);
-        }
-        if (BUILD.hotModuleReplacement) {
-            HostElement.prototype['s-hmr'] = function (hmrVersionId) {
-                hmrStart(this, cmpMeta, hmrVersionId);
-            };
-        }
-        cmpMeta.$lazyBundleId$ = lazyBundle[0];
-        if (!exclude.includes(tagName) && !customElements.get(tagName)) {
-            cmpTags.push(tagName);
-            customElements.define(tagName, proxyComponent(HostElement, cmpMeta, 1 /* isElementConstructor */));
-        }
-    }));
+            if (BUILD.scopedSlotTextContentFix) {
+                patchTextContent(HostElement.prototype, cmpMeta);
+            }
+            cmpMeta.$lazyBundleId$ = lazyBundle[0];
+            if (!exclude.includes(tagName) && !customElements.get(tagName)) {
+                cmpTags.push(tagName);
+                customElements.define(tagName, proxyComponent(HostElement, cmpMeta, 1 /* isElementConstructor */));
+            }
+        });
+    });
     if (BUILD.invisiblePrehydration && (BUILD.hydratedClass || BUILD.hydratedAttribute)) {
         visibilityStyle.innerHTML = cmpTags + HYDRATED_CSS;
         visibilityStyle.setAttribute('data-styles', '');
@@ -2935,4 +3024,4 @@ const Build = {
     isTesting: BUILD.isTesting ? true : false,
 };
 export { BUILD, Env, NAMESPACE } from '@stencil/core/internal/app-data';
-export { Build, CSS, Context, Fragment, H, H as HTMLElement, Host, STENCIL_DEV_MODE, addHostEventListeners, attachShadow, bootstrapLazy, cmpModules, connectedCallback, consoleDevError, consoleDevInfo, consoleDevWarn, consoleError, createEvent, defineCustomElement, disconnectedCallback, doc, forceModeUpdate, forceUpdate, getAssetPath, getConnect, getContext, getElement, getHostRef, getMode, getRenderingRef, getValue, h, insertVdomAnnotations, isMemberInElement, loadModule, modeResolutionChain, nextTick, parsePropertyValue, plt, postUpdateComponent, promiseResolve, proxyComponent, proxyCustomElement, readTask, registerHost, registerInstance, renderVdom, setAssetPath, setErrorHandler, setMode, setPlatformHelpers, setPlatformOptions, setValue, styles, supportsConstructibleStylesheets, supportsListenerOptions, supportsShadow, win, writeTask };
+export { Build, CSS, Context, Fragment, H, H as HTMLElement, Host, STENCIL_DEV_MODE, addHostEventListeners, bootstrapLazy, cmpModules, connectedCallback, consoleDevError, consoleDevInfo, consoleDevWarn, consoleError, createEvent, defineCustomElement, disconnectedCallback, doc, forceModeUpdate, forceUpdate, getAssetPath, getConnect, getContext, getElement, getHostRef, getMode, getRenderingRef, getValue, h, insertVdomAnnotations, isMemberInElement, loadModule, modeResolutionChain, nextTick, parsePropertyValue, plt, postUpdateComponent, promiseResolve, proxyComponent, proxyCustomElement, readTask, registerHost, registerInstance, renderVdom, setAssetPath, setErrorHandler, setMode, setPlatformHelpers, setPlatformOptions, setValue, styles, supportsConstructibleStylesheets, supportsListenerOptions, supportsShadow, win, writeTask };

package/internal/client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal/client",
-  "version": "2.8.0",
+  "version": "2.10.0",
   "description": "Stencil internal client platform to be imported by the Stencil Compiler and internal runtime. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "private": true,

package/internal/client/patch-browser.js

@@ -1,5 +1,5 @@
 /*
- Stencil Client Patch Browser v2.8.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v2.10.0 | MIT Licensed | https://stenciljs.com
  */
 import { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';
 import { consoleDevInfo, plt, win, doc, promiseResolve, H } from '@stencil/core';

package/internal/client/patch-esm.js

@@ -1,5 +1,5 @@
 /*
- Stencil Client Patch Esm v2.8.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Esm v2.10.0 | MIT Licensed | https://stenciljs.com
  */
 import { BUILD } from '@stencil/core/internal/app-data';
 import { CSS, plt, win, promiseResolve } from '@stencil/core';

package/internal/client/shadow-css.js

@@ -1,5 +1,5 @@
 /*
- Stencil Client Platform v2.8.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Platform v2.10.0 | MIT Licensed | https://stenciljs.com
  */
 /**
  * @license

package/internal/hydrate/index.js

@@ -639,7 +639,8 @@ const callRender = (e, t, o) => {
    s.attributeChangedCallback = function(e, t, n) {
     plt.jmp((() => {
      const t = o.get(e);
-     this.hasOwnProperty(t) && (n = this[t], delete this[t]), this[t] = (null !== n || "boolean" != typeof this[t]) && n;
+     if (this.hasOwnProperty(t)) n = this[t], delete this[t]; else if (s.hasOwnProperty(t) && "number" == typeof this[t] && this[t] == n) return;
+     this[t] = (null !== n || "boolean" != typeof this[t]) && n;
     }));
    }, e.observedAttributes = n.filter((([e, t]) => 15 & t[0])).map((([e, n]) => {
     const s = n[1] || e;
@@ -759,6 +760,9 @@ const callRender = (e, t, o) => {
   },
   disconnectedCallback() {
    disconnectedCallback(this), BUILD.disconnectedCallback && s && s.call(this);
+  },
+  __attachShadow() {
+   this.shadowRoot = this;
   }
  }), e.is = o.$tagName$, proxyComponent(e, o, 3);
 }, forceModeUpdate = e => {
@@ -770,8 +774,6 @@ const callRender = (e, t, o) => {
    attachStyles(o), forceUpdate$1(e));
   }
  }
-}, attachShadow = e => {
- e.shadowRoot = e;
 }, patchCloneNode = e => {
  const t = e.cloneNode;
  e.cloneNode = function(e) {
@@ -793,6 +795,26 @@ const callRender = (e, t, o) => {
   }
   return this.__appendChild(e);
  };
+}, patchTextContent = (e, t) => {
+ if (BUILD.scoped && 2 & t.$flags$) {
+  const t = Object.getOwnPropertyDescriptor(Node.prototype, "textContent");
+  Object.defineProperty(e, "__textContent", t), Object.defineProperty(e, "textContent", {
+   get() {
+    var e;
+    const t = getHostSlotNode(this.childNodes, "");
+    return 3 === (null === (e = null == t ? void 0 : t.nextSibling) || void 0 === e ? void 0 : e.nodeType) ? t.nextSibling.textContent : t ? t.textContent : this.__textContent;
+   },
+   set(e) {
+    var t;
+    const o = getHostSlotNode(this.childNodes, "");
+    if (3 === (null === (t = null == o ? void 0 : o.nextSibling) || void 0 === t ? void 0 : t.nodeType)) o.nextSibling.textContent = e; else if (o) o.textContent = e; else {
+     this.__textContent = e;
+     const t = this["s-cr"];
+     t && this.insertBefore(t, this.firstChild);
+    }
+   }
+  });
+ }
 }, patchChildSlotNodes = (e, t) => {
  class o extends Array {
   item(e) {
@@ -886,41 +908,44 @@ const callRender = (e, t, o) => {
  if (Object.assign(plt, t), plt.$resourcesUrl$ = new URL(t.resourcesUrl || "./", doc.baseURI).href, 
  BUILD.asyncQueue && t.syncQueue && (plt.$flags$ |= 4), BUILD.hydrateClientSide && (plt.$flags$ |= 2), 
  BUILD.hydrateClientSide && BUILD.shadowDom) for (;p < c.length; p++) registerStyle(c[p].getAttribute("sty-id"), c[p].innerHTML.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g, "$1{"));
- e.map((e => e[1].map((o => {
-  const a = {
-   $flags$: o[0],
-   $tagName$: o[1],
-   $members$: o[2],
-   $listeners$: o[3]
-  };
-  BUILD.member && (a.$members$ = o[2]), BUILD.hostListener && (a.$listeners$ = o[3]), 
-  BUILD.reflect && (a.$attrsToReflect$ = []), BUILD.watchCallback && (a.$watchers$ = {}), 
-  BUILD.shadowDom && !supportsShadow && 1 & a.$flags$ && (a.$flags$ |= 8);
-  const r = BUILD.transformTagName && t.transformTagName ? t.transformTagName(a.$tagName$) : a.$tagName$, i = class extends HTMLElement {
-   constructor(e) {
-    super(e), registerHost(e = this, a), BUILD.shadowDom && 1 & a.$flags$ && (BUILD.hydrateServerSide || "shadowRoot" in e || (e.shadowRoot = e)), 
-    BUILD.slotChildNodesFix && patchChildSlotNodes(e, a);
-   }
-   connectedCallback() {
-    $ && (clearTimeout($), $ = null), m ? d.push(this) : plt.jmp((() => connectedCallback(this)));
-   }
-   disconnectedCallback() {
-    plt.jmp((() => disconnectedCallback(this)));
-   }
-   componentOnReady() {
-    return getHostRef(this).$onReadyPromise$;
-   }
-  };
-  BUILD.cloneNodeFix && patchCloneNode(i.prototype), BUILD.appendChildSlotFix && patchSlotAppendChild(i.prototype), 
-  BUILD.hotModuleReplacement && (i.prototype["s-hmr"] = function(e) {
-   ((e, t, o) => {
-    const n = getHostRef(e);
-    n.$flags$ = 1, e["s-hmr-load"] = () => {
-     delete e["s-hmr-load"];
-    }, initializeComponent(e, n, t);
-   })(this, a);
-  }), a.$lazyBundleId$ = e[0], s.includes(r) || l.get(r) || (n.push(r), l.define(r, proxyComponent(i, a, 1)));
- })))), BUILD.invisiblePrehydration && (BUILD.hydratedClass || BUILD.hydratedAttribute) && (i.innerHTML = n + "{visibility:hidden}.hydrated{visibility:inherit}", 
+ e.map((e => {
+  e[1].map((o => {
+   const a = {
+    $flags$: o[0],
+    $tagName$: o[1],
+    $members$: o[2],
+    $listeners$: o[3]
+   };
+   BUILD.member && (a.$members$ = o[2]), BUILD.hostListener && (a.$listeners$ = o[3]), 
+   BUILD.reflect && (a.$attrsToReflect$ = []), BUILD.watchCallback && (a.$watchers$ = {}), 
+   BUILD.shadowDom && !supportsShadow && 1 & a.$flags$ && (a.$flags$ |= 8);
+   const r = BUILD.transformTagName && t.transformTagName ? t.transformTagName(a.$tagName$) : a.$tagName$, i = class extends HTMLElement {
+    constructor(e) {
+     super(e), registerHost(e = this, a), BUILD.shadowDom && 1 & a.$flags$ && (BUILD.hydrateServerSide || "shadowRoot" in e || (e.shadowRoot = e)), 
+     BUILD.slotChildNodesFix && patchChildSlotNodes(e, a);
+    }
+    connectedCallback() {
+     $ && (clearTimeout($), $ = null), m ? d.push(this) : plt.jmp((() => connectedCallback(this)));
+    }
+    disconnectedCallback() {
+     plt.jmp((() => disconnectedCallback(this)));
+    }
+    componentOnReady() {
+     return getHostRef(this).$onReadyPromise$;
+    }
+   };
+   BUILD.cloneNodeFix && patchCloneNode(i.prototype), BUILD.appendChildSlotFix && patchSlotAppendChild(i.prototype), 
+   BUILD.hotModuleReplacement && (i.prototype["s-hmr"] = function(e) {
+    ((e, t, o) => {
+     const n = getHostRef(e);
+     n.$flags$ = 1, e["s-hmr-load"] = () => {
+      delete e["s-hmr-load"];
+     }, initializeComponent(e, n, t);
+    })(this, a);
+   }), BUILD.scopedSlotTextContentFix && patchTextContent(i.prototype, a), a.$lazyBundleId$ = e[0], 
+   s.includes(r) || l.get(r) || (n.push(r), l.define(r, proxyComponent(i, a, 1)));
+  }));
+ })), BUILD.invisiblePrehydration && (BUILD.hydratedClass || BUILD.hydratedAttribute) && (i.innerHTML = n + "{visibility:hidden}.hydrated{visibility:inherit}", 
  i.setAttribute("data-styles", ""), a.insertBefore(i, r ? r.nextSibling : a.firstChild)), 
  m = !1, d.length ? d.map((e => e.connectedCallback())) : BUILD.profile ? plt.jmp((() => $ = setTimeout(appDidLoad, 30, "timeout"))) : plt.jmp((() => $ = setTimeout(appDidLoad, 30))), 
  o();
@@ -1096,4 +1121,4 @@ const cmpModules = new Map, getModule = e => {
  isTesting: !1
 }, styles = new Map, modeResolutionChain = [];
 
-export { Build, Context, Fragment, Host, addHostEventListeners, attachShadow, bootstrapLazy, cmpModules, connectedCallback, consoleDevError, consoleDevInfo, consoleDevWarn, consoleError, createEvent, defineCustomElement, disconnectedCallback, doc, forceModeUpdate, forceUpdate$1 as forceUpdate, getAssetPath, getConnect, getContext, getElement, getHostRef, getMode, getRenderingRef, getValue, hAsync as h, hydrateApp, insertVdomAnnotations, isMemberInElement, loadModule, modeResolutionChain, nextTick, parsePropertyValue, plt, postUpdateComponent, proxyComponent, proxyCustomElement, readTask, registerComponents, registerHost, registerInstance, renderVdom, setAssetPath, setErrorHandler, setMode, setPlatformHelpers, setValue, styles, supportsConstructibleStylesheets, supportsListenerOptions, supportsShadow, win, writeTask };
+export { Build, Context, Fragment, Host, addHostEventListeners, bootstrapLazy, cmpModules, connectedCallback, consoleDevError, consoleDevInfo, consoleDevWarn, consoleError, createEvent, defineCustomElement, disconnectedCallback, doc, forceModeUpdate, forceUpdate$1 as forceUpdate, getAssetPath, getConnect, getContext, getElement, getHostRef, getMode, getRenderingRef, getValue, hAsync as h, hydrateApp, insertVdomAnnotations, isMemberInElement, loadModule, modeResolutionChain, nextTick, parsePropertyValue, plt, postUpdateComponent, proxyComponent, proxyCustomElement, readTask, registerComponents, registerHost, registerInstance, renderVdom, setAssetPath, setErrorHandler, setMode, setPlatformHelpers, setValue, styles, supportsConstructibleStylesheets, supportsListenerOptions, supportsShadow, win, writeTask };

package/internal/hydrate/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal/hydrate",
-  "version": "2.8.0",
+  "version": "2.10.0",
   "description": "Stencil internal hydrate platform to be imported by the Stencil Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "private": true

package/internal/index.js

@@ -1 +1,2 @@
 export * from '@stencil/core/internal/client';
+//# sourceMappingURL=default.js.map

package/internal/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal",
-  "version": "2.8.0",
+  "version": "2.10.0",
   "description": "Stencil internals only to be imported by the Stencil Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "types": "./index.d.ts",