@stencil/core 4.26.0 → 4.27.0

package/internal/hydrate/index.js

@@ -1,5 +1,5 @@
 /*
- Stencil Hydrate Platform v4.26.0 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Platform v4.27.0 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -157,12 +157,11 @@ var FORM_ASSOCIATED_CUSTOM_ELEMENT_CALLBACKS = [
 
 // src/runtime/slot-polyfill-utils.ts
 var updateFallbackSlotVisibility = (elm) => {
-  const childNodes = elm.__childNodes || elm.childNodes;
+  const childNodes = internalCall(elm, "childNodes");
   if (elm.tagName && elm.tagName.includes("-") && elm["s-cr"] && elm.tagName !== "SLOT-FB") {
     getHostSlotNodes(childNodes, elm.tagName).forEach((slotNode) => {
-      var _a;
       if (slotNode.nodeType === 1 /* ElementNode */ && slotNode.tagName === "SLOT-FB") {
-        if ((_a = getHostSlotChildNodes(slotNode, slotNode["s-sn"], false)) == null ? void 0 : _a.length) {
+        if (getSlotChildSiblings(slotNode, getSlotName(slotNode), false).length) {
           slotNode.hidden = true;
         } else {
           slotNode.hidden = false;
@@ -170,8 +169,10 @@ var updateFallbackSlotVisibility = (elm) => {
       }
     });
   }
-  for (const childNode of childNodes) {
-    if (childNode.nodeType === 1 /* ElementNode */ && (childNode.__childNodes || childNode.childNodes).length) {
+  let i2 = 0;
+  for (i2 = 0; i2 < childNodes.length; i2++) {
+    const childNode = childNodes[i2];
+    if (childNode.nodeType === 1 /* ElementNode */ && internalCall(childNode, "childNodes").length) {
       updateFallbackSlotVisibility(childNode);
     }
   }
@@ -192,7 +193,7 @@ function getHostSlotNodes(childNodes, hostName, slotName) {
   let childNode;
   for (; i2 < childNodes.length; i2++) {
     childNode = childNodes[i2];
-    if (childNode["s-sr"] && childNode["s-hn"] === hostName && (slotName === void 0 || childNode["s-sn"] === slotName)) {
+    if (childNode["s-sr"] && (!hostName || childNode["s-hn"] === hostName) && (slotName === void 0 || getSlotName(childNode) === slotName)) {
       slottedNodes.push(childNode);
       if (typeof slotName !== "undefined") return slottedNodes;
     }
@@ -200,11 +201,12 @@ function getHostSlotNodes(childNodes, hostName, slotName) {
   }
   return slottedNodes;
 }
-var getHostSlotChildNodes = (node, slotName, includeSlot = true) => {
+var getSlotChildSiblings = (slot, slotName, includeSlot = true) => {
   const childNodes = [];
-  if (includeSlot && node["s-sr"] || !node["s-sr"]) childNodes.push(node);
-  while ((node = node.nextSibling) && node["s-sn"] === slotName) {
-    childNodes.push(node);
+  if (includeSlot && slot["s-sr"] || !slot["s-sr"]) childNodes.push(slot);
+  let node = slot;
+  while (node = node.nextSibling) {
+    if (getSlotName(node) === slotName && (includeSlot || !node["s-sr"])) childNodes.push(node);
   }
   return childNodes;
 };
@@ -224,38 +226,73 @@ var isNodeLocatedInSlot = (nodeToRelocate, slotName) => {
   return slotName === "";
 };
 var addSlotRelocateNode = (newChild, slotNode, prepend, position) => {
-  let slottedNodeLocation;
   if (newChild["s-ol"] && newChild["s-ol"].isConnected) {
-    slottedNodeLocation = newChild["s-ol"];
-  } else {
-    slottedNodeLocation = document.createTextNode("");
-    slottedNodeLocation["s-nr"] = newChild;
+    return;
   }
+  const slottedNodeLocation = document.createTextNode("");
+  slottedNodeLocation["s-nr"] = newChild;
   if (!slotNode["s-cr"] || !slotNode["s-cr"].parentNode) return;
   const parent = slotNode["s-cr"].parentNode;
-  const appendMethod = prepend ? parent.__prepend || parent.prepend : parent.__appendChild || parent.appendChild;
-  if (typeof position !== "undefined") {
-    if (BUILD2.hydrateClientSide) {
-      slottedNodeLocation["s-oo"] = position;
-      const childNodes = parent.__childNodes || parent.childNodes;
-      const slotRelocateNodes = [slottedNodeLocation];
-      childNodes.forEach((n) => {
-        if (n["s-nr"]) slotRelocateNodes.push(n);
-      });
-      slotRelocateNodes.sort((a, b) => {
-        if (!a["s-oo"] || a["s-oo"] < b["s-oo"]) return -1;
-        else if (!b["s-oo"] || b["s-oo"] < a["s-oo"]) return 1;
-        return 0;
-      });
-      slotRelocateNodes.forEach((n) => appendMethod.call(parent, n));
-    }
+  const appendMethod = prepend ? internalCall(parent, "prepend") : internalCall(parent, "appendChild");
+  if (BUILD2.hydrateClientSide && typeof position !== "undefined") {
+    slottedNodeLocation["s-oo"] = position;
+    const childNodes = internalCall(parent, "childNodes");
+    const slotRelocateNodes = [slottedNodeLocation];
+    childNodes.forEach((n) => {
+      if (n["s-nr"]) slotRelocateNodes.push(n);
+    });
+    slotRelocateNodes.sort((a, b) => {
+      if (!a["s-oo"] || a["s-oo"] < (b["s-oo"] || 0)) return -1;
+      else if (!b["s-oo"] || b["s-oo"] < a["s-oo"]) return 1;
+      return 0;
+    });
+    slotRelocateNodes.forEach((n) => appendMethod.call(parent, n));
   } else {
     appendMethod.call(parent, slottedNodeLocation);
   }
   newChild["s-ol"] = slottedNodeLocation;
   newChild["s-sh"] = slotNode["s-hn"];
 };
-var getSlotName = (node) => node["s-sn"] || node.nodeType === 1 && node.getAttribute("slot") || "";
+var getSlotName = (node) => typeof node["s-sn"] === "string" ? node["s-sn"] : node.nodeType === 1 && node.getAttribute("slot") || void 0;
+function patchSlotNode(node) {
+  if (node.assignedElements || node.assignedNodes || !node["s-sr"]) return;
+  const assignedFactory = (elementsOnly) => (function(opts) {
+    const toReturn = [];
+    const slotName = this["s-sn"];
+    if (opts == null ? void 0 : opts.flatten) {
+      console.error(`
+          Flattening is not supported for Stencil non-shadow slots. 
+          You can use \`.childNodes\` to nested slot fallback content.
+          If you have a particular use case, please open an issue on the Stencil repo.
+        `);
+    }
+    const parent = this["s-cr"].parentElement;
+    const slottedNodes = parent.__childNodes ? parent.childNodes : getSlottedChildNodes(parent.childNodes);
+    slottedNodes.forEach((n) => {
+      if (slotName === getSlotName(n)) {
+        toReturn.push(n);
+      }
+    });
+    if (elementsOnly) {
+      return toReturn.filter((n) => n.nodeType === 1 /* ElementNode */);
+    }
+    return toReturn;
+  }).bind(node);
+  node.assignedElements = assignedFactory(true);
+  node.assignedNodes = assignedFactory(false);
+}
+function dispatchSlotChangeEvent(elm) {
+  elm.dispatchEvent(new CustomEvent("slotchange", { bubbles: false, cancelable: false, composed: false }));
+}
+function findSlotFromSlottedNode(slottedNode, parentHost) {
+  var _a;
+  parentHost = parentHost || ((_a = slottedNode["s-ol"]) == null ? void 0 : _a.parentElement);
+  if (!parentHost) return { slotNode: null, slotName: "" };
+  const slotName = slottedNode["s-sn"] = getSlotName(slottedNode) || "";
+  const childNodes = internalCall(parentHost, "childNodes");
+  const slotNode = getHostSlotNodes(childNodes, parentHost.tagName, slotName)[0];
+  return { slotNode, slotName };
+}
 
 // src/runtime/dom-extras.ts
 var patchPseudoShadowDom = (hostElementPrototype) => {
@@ -319,19 +356,14 @@ var patchCloneNode = (HostElementPrototype) => {
 var patchSlotAppendChild = (HostElementPrototype) => {
   HostElementPrototype.__appendChild = HostElementPrototype.appendChild;
   HostElementPrototype.appendChild = function(newChild) {
-    const slotName = newChild["s-sn"] = getSlotName(newChild);
-    const slotNode = getHostSlotNodes(this.__childNodes || this.childNodes, this.tagName, slotName)[0];
+    const { slotName, slotNode } = findSlotFromSlottedNode(newChild, this);
     if (slotNode) {
       addSlotRelocateNode(newChild, slotNode);
-      const slotChildNodes = getHostSlotChildNodes(slotNode, slotName);
+      const slotChildNodes = getSlotChildSiblings(slotNode, slotName);
       const appendAfter = slotChildNodes[slotChildNodes.length - 1];
-      const parent = intrnlCall(appendAfter, "parentNode");
-      let insertedNode;
-      if (parent.__insertBefore) {
-        insertedNode = parent.__insertBefore(newChild, appendAfter.nextSibling);
-      } else {
-        insertedNode = parent.insertBefore(newChild, appendAfter.nextSibling);
-      }
+      const parent = internalCall(appendAfter, "parentNode");
+      const insertedNode = internalCall(parent, "insertBefore")(newChild, appendAfter.nextSibling);
+      dispatchSlotChangeEvent(slotNode);
       updateFallbackSlotVisibility(this);
       return insertedNode;
     }
@@ -360,19 +392,17 @@ var patchSlotPrepend = (HostElementPrototype) => {
       if (typeof newChild === "string") {
         newChild = this.ownerDocument.createTextNode(newChild);
       }
-      const slotName = newChild["s-sn"] = getSlotName(newChild);
-      const childNodes = this.__childNodes || this.childNodes;
+      const slotName = (newChild["s-sn"] = getSlotName(newChild)) || "";
+      const childNodes = internalCall(this, "childNodes");
       const slotNode = getHostSlotNodes(childNodes, this.tagName, slotName)[0];
       if (slotNode) {
         addSlotRelocateNode(newChild, slotNode, true);
-        const slotChildNodes = getHostSlotChildNodes(slotNode, slotName);
+        const slotChildNodes = getSlotChildSiblings(slotNode, slotName);
         const appendAfter = slotChildNodes[0];
-        const parent = intrnlCall(appendAfter, "parentNode");
-        if (parent.__insertBefore) {
-          return parent.__insertBefore(newChild, intrnlCall(appendAfter, "nextSibling"));
-        } else {
-          return parent.insertBefore(newChild, intrnlCall(appendAfter, "nextSibling"));
-        }
+        const parent = internalCall(appendAfter, "parentNode");
+        const toReturn = internalCall(parent, "insertBefore")(newChild, internalCall(appendAfter, "nextSibling"));
+        dispatchSlotChangeEvent(slotNode);
+        return toReturn;
       }
       if (newChild.nodeType === 1 && !!newChild.getAttribute("slot")) {
         newChild.hidden = true;
@@ -422,8 +452,7 @@ var patchInsertBefore = (HostElementPrototype) => {
   if (eleProto.__insertBefore) return;
   eleProto.__insertBefore = HostElementPrototype.insertBefore;
   HostElementPrototype.insertBefore = function(newChild, currentChild) {
-    const slotName = newChild["s-sn"] = getSlotName(newChild);
-    const slotNode = getHostSlotNodes(this.__childNodes, this.tagName, slotName)[0];
+    const { slotName, slotNode } = findSlotFromSlottedNode(newChild, this);
     const slottedNodes = this.__childNodes ? this.childNodes : getSlottedChildNodes(this.childNodes);
     if (slotNode) {
       let found = false;
@@ -436,18 +465,19 @@ var patchInsertBefore = (HostElementPrototype) => {
           }
           if (slotName === currentChild["s-sn"]) {
             addSlotRelocateNode(newChild, slotNode);
-            const parent = intrnlCall(currentChild, "parentNode");
-            if (parent.__insertBefore) {
-              parent.__insertBefore(newChild, currentChild);
-            } else {
-              parent.insertBefore(newChild, currentChild);
-            }
+            const parent = internalCall(currentChild, "parentNode");
+            internalCall(parent, "insertBefore")(newChild, currentChild);
+            dispatchSlotChangeEvent(slotNode);
           }
           return;
         }
       });
       if (found) return newChild;
     }
+    const parentNode = currentChild == null ? void 0 : currentChild.__parentNode;
+    if (parentNode && !this.isSameNode(parentNode)) {
+      return this.appendChild(newChild);
+    }
     return this.__insertBefore(newChild, currentChild);
   };
 };
@@ -525,7 +555,7 @@ var patchChildSlotNodes = (elm) => {
   });
 };
 var patchSlottedNode = (node) => {
-  if (!node || node.__nextSibling || !globalThis.Node) return;
+  if (!node || node.__nextSibling !== void 0 || !globalThis.Node) return;
   patchNextSibling(node);
   patchPreviousSibling(node);
   patchParentNode(node);
@@ -629,11 +659,14 @@ function patchHostOriginalAccessor(accessorName, node) {
   }
   if (accessor) Object.defineProperty(node, "__" + accessorName, accessor);
 }
-function intrnlCall(node, method) {
+function internalCall(node, method) {
   if ("__" + method in node) {
-    return node["__" + method];
+    const toReturn = node["__" + method];
+    if (typeof toReturn !== "function") return toReturn;
+    return toReturn.bind(node);
   } else {
-    return node[method];
+    if (typeof node[method] !== "function") return node[method];
+    return node[method].bind(node);
   }
 }
 
@@ -1229,6 +1262,7 @@ function addSlot(slotName, slotId, childVNode, node, parentVNode, childRenderNod
     const slot = childVNode.$elm$;
     const shouldMove = parentNodeId && parentNodeId !== childVNode.$hostId$ && parentVNode.$elm$.shadowRoot;
     addSlottedNodes(slottedNodes, slotId, slotName, node, shouldMove ? parentNodeId : childVNode.$hostId$);
+    patchSlotNode(node);
     if (shouldMove) {
       parentVNode.$elm$.insertBefore(slot, parentVNode.$elm$.children[0]);
     }
@@ -1795,112 +1829,113 @@ import { BUILD as BUILD12 } from "@stencil/core/internal/app-data";
 // src/runtime/vdom/set-accessor.ts
 import { BUILD as BUILD11 } from "@stencil/core/internal/app-data";
 var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRender) => {
-  if (oldValue !== newValue) {
-    let isProp = isMemberInElement(elm, memberName);
-    let ln = memberName.toLowerCase();
-    if (BUILD11.vdomClass && memberName === "class") {
-      const classList = elm.classList;
-      const oldClasses = parseClassList(oldValue);
-      let newClasses = parseClassList(newValue);
-      if (BUILD11.hydrateClientSide && elm["s-si"] && initialRender) {
-        newClasses.push(elm["s-si"]);
-        oldClasses.forEach((c) => {
-          if (c.startsWith(elm["s-si"])) newClasses.push(c);
-        });
-        newClasses = [...new Set(newClasses)];
-        classList.add(...newClasses);
-      } else {
-        classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
-        classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
-      }
-    } else if (BUILD11.vdomStyle && memberName === "style") {
-      if (BUILD11.updatable) {
-        for (const prop in oldValue) {
-          if (!newValue || newValue[prop] == null) {
-            if (!BUILD11.hydrateServerSide && prop.includes("-")) {
-              elm.style.removeProperty(prop);
-            } else {
-              elm.style[prop] = "";
-            }
-          }
-        }
-      }
-      for (const prop in newValue) {
-        if (!oldValue || newValue[prop] !== oldValue[prop]) {
+  if (oldValue === newValue) {
+    return;
+  }
+  let isProp = isMemberInElement(elm, memberName);
+  let ln = memberName.toLowerCase();
+  if (BUILD11.vdomClass && memberName === "class") {
+    const classList = elm.classList;
+    const oldClasses = parseClassList(oldValue);
+    let newClasses = parseClassList(newValue);
+    if (BUILD11.hydrateClientSide && elm["s-si"] && initialRender) {
+      newClasses.push(elm["s-si"]);
+      oldClasses.forEach((c) => {
+        if (c.startsWith(elm["s-si"])) newClasses.push(c);
+      });
+      newClasses = [...new Set(newClasses)];
+      classList.add(...newClasses);
+    } else {
+      classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
+      classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
+    }
+  } else if (BUILD11.vdomStyle && memberName === "style") {
+    if (BUILD11.updatable) {
+      for (const prop in oldValue) {
+        if (!newValue || newValue[prop] == null) {
           if (!BUILD11.hydrateServerSide && prop.includes("-")) {
-            elm.style.setProperty(prop, newValue[prop]);
+            elm.style.removeProperty(prop);
           } else {
-            elm.style[prop] = newValue[prop];
+            elm.style[prop] = "";
           }
         }
       }
-    } else if (BUILD11.vdomKey && memberName === "key") {
-    } else if (BUILD11.vdomRef && memberName === "ref") {
-      if (newValue) {
-        newValue(elm);
+    }
+    for (const prop in newValue) {
+      if (!oldValue || newValue[prop] !== oldValue[prop]) {
+        if (!BUILD11.hydrateServerSide && prop.includes("-")) {
+          elm.style.setProperty(prop, newValue[prop]);
+        } else {
+          elm.style[prop] = newValue[prop];
+        }
       }
-    } else if (BUILD11.vdomListener && (BUILD11.lazyLoad ? !isProp : !elm.__lookupSetter__(memberName)) && memberName[0] === "o" && memberName[1] === "n") {
-      if (memberName[2] === "-") {
-        memberName = memberName.slice(3);
-      } else if (isMemberInElement(win, ln)) {
-        memberName = ln.slice(2);
-      } else {
-        memberName = ln[2] + memberName.slice(3);
+    }
+  } else if (BUILD11.vdomKey && memberName === "key") {
+  } else if (BUILD11.vdomRef && memberName === "ref") {
+    if (newValue) {
+      newValue(elm);
+    }
+  } else if (BUILD11.vdomListener && (BUILD11.lazyLoad ? !isProp : !elm.__lookupSetter__(memberName)) && memberName[0] === "o" && memberName[1] === "n") {
+    if (memberName[2] === "-") {
+      memberName = memberName.slice(3);
+    } else if (isMemberInElement(win, ln)) {
+      memberName = ln.slice(2);
+    } else {
+      memberName = ln[2] + memberName.slice(3);
+    }
+    if (oldValue || newValue) {
+      const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
+      memberName = memberName.replace(CAPTURE_EVENT_REGEX, "");
+      if (oldValue) {
+        plt.rel(elm, memberName, oldValue, capture);
       }
-      if (oldValue || newValue) {
-        const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
-        memberName = memberName.replace(CAPTURE_EVENT_REGEX, "");
-        if (oldValue) {
-          plt.rel(elm, memberName, oldValue, capture);
-        }
-        if (newValue) {
-          plt.ael(elm, memberName, newValue, capture);
-        }
+      if (newValue) {
+        plt.ael(elm, memberName, newValue, capture);
       }
-    } else if (BUILD11.vdomPropOrAttr) {
-      const isComplex = isComplexType(newValue);
-      if ((isProp || isComplex && newValue !== null) && !isSvg) {
-        try {
-          if (!elm.tagName.includes("-")) {
-            const n = newValue == null ? "" : newValue;
-            if (memberName === "list") {
-              isProp = false;
-            } else if (oldValue == null || elm[memberName] != n) {
-              if (typeof elm.__lookupSetter__(memberName) === "function") {
-                elm[memberName] = n;
-              } else {
-                elm.setAttribute(memberName, n);
-              }
+    }
+  } else if (BUILD11.vdomPropOrAttr) {
+    const isComplex = isComplexType(newValue);
+    if ((isProp || isComplex && newValue !== null) && !isSvg) {
+      try {
+        if (!elm.tagName.includes("-")) {
+          const n = newValue == null ? "" : newValue;
+          if (memberName === "list") {
+            isProp = false;
+          } else if (oldValue == null || elm[memberName] != n) {
+            if (typeof elm.__lookupSetter__(memberName) === "function") {
+              elm[memberName] = n;
+            } else {
+              elm.setAttribute(memberName, n);
             }
-          } else if (elm[memberName] !== newValue) {
-            elm[memberName] = newValue;
           }
-        } catch (e) {
+        } else if (elm[memberName] !== newValue) {
+          elm[memberName] = newValue;
         }
+      } catch (e) {
       }
-      let xlink = false;
-      if (BUILD11.vdomXlink) {
-        if (ln !== (ln = ln.replace(/^xlink\:?/, ""))) {
-          memberName = ln;
-          xlink = true;
-        }
+    }
+    let xlink = false;
+    if (BUILD11.vdomXlink) {
+      if (ln !== (ln = ln.replace(/^xlink\:?/, ""))) {
+        memberName = ln;
+        xlink = true;
       }
-      if (newValue == null || newValue === false) {
-        if (newValue !== false || elm.getAttribute(memberName) === "") {
-          if (BUILD11.vdomXlink && xlink) {
-            elm.removeAttributeNS(XLINK_NS, memberName);
-          } else {
-            elm.removeAttribute(memberName);
-          }
-        }
-      } else if ((!isProp || flags & 4 /* isHost */ || isSvg) && !isComplex) {
-        newValue = newValue === true ? "" : newValue;
+    }
+    if (newValue == null || newValue === false) {
+      if (newValue !== false || elm.getAttribute(memberName) === "") {
         if (BUILD11.vdomXlink && xlink) {
-          elm.setAttributeNS(XLINK_NS, memberName, newValue);
+          elm.removeAttributeNS(XLINK_NS, memberName);
         } else {
-          elm.setAttribute(memberName, newValue);
+          elm.removeAttribute(memberName);
         }
       }
+    } else if ((!isProp || flags & 4 /* isHost */ || isSvg) && !isComplex && elm.nodeType === 1 /* ElementNode */) {
+      newValue = newValue === true ? "" : newValue;
+      if (BUILD11.vdomXlink && xlink) {
+        elm.setAttributeNS(XLINK_NS, memberName, newValue);
+      } else {
+        elm.setAttribute(memberName, newValue);
+      }
     }
   }
 };
@@ -1998,6 +2033,9 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
     elm = newVNode2.$elm$ = doc.createTextNode(newVNode2.$text$);
   } else if (BUILD13.slotRelocation && newVNode2.$flags$ & 1 /* isSlotReference */) {
     elm = newVNode2.$elm$ = BUILD13.isDebug || BUILD13.hydrateServerSide ? slotReferenceDebugNode(newVNode2) : doc.createTextNode("");
+    if (BUILD13.vdomAttribute) {
+      updateElement(null, newVNode2, isSvgMode);
+    }
   } else {
     if (BUILD13.svg && !isSvgMode) {
       isSvgMode = newVNode2.$tag$ === "svg";
@@ -2040,6 +2078,7 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
       elm["s-cr"] = contentRef;
       elm["s-sn"] = newVNode2.$name$ || "";
       elm["s-rf"] = (_a = newVNode2.$attrs$) == null ? void 0 : _a.ref;
+      patchSlotNode(elm);
       oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex];
       if (oldVNode && oldVNode.$tag$ === newVNode2.$tag$ && oldParentVNode.$elm$) {
         if (BUILD13.experimentalSlotFixes) {
@@ -2266,9 +2305,8 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
           newVNode2.$elm$["s-sn"] = newVNode2.$name$ || "";
           relocateToHostRoot(newVNode2.$elm$.parentElement);
         }
-      } else {
-        updateElement(oldVNode, newVNode2, isSvgMode, isInitialRender);
       }
+      updateElement(oldVNode, newVNode2, isSvgMode, isInitialRender);
     }
     if (BUILD13.updatable && oldChildren !== null && newChildren !== null) {
       updateChildren(elm, oldChildren, newVNode2, newChildren, isInitialRender);
@@ -2355,7 +2393,10 @@ var insertBefore = (parent, newNode, reference) => {
     if (parent.getRootNode().nodeType !== 11 /* DOCUMENT_FRAGMENT_NODE */) {
       patchParentNode(newNode);
     }
-    return parent.insertBefore(newNode, reference);
+    parent.insertBefore(newNode, reference);
+    const { slotNode } = findSlotFromSlottedNode(newNode);
+    if (slotNode) dispatchSlotChangeEvent(slotNode);
+    return newNode;
   }
   if (BUILD13.experimentalSlotFixes && parent.__insertBefore) {
     return parent.__insertBefore(newNode, reference);
@@ -2479,7 +2520,7 @@ render() {
               }
             }
           }
-          nodeToRelocate && typeof slotRefNode["s-rf"] === "function" && slotRefNode["s-rf"](nodeToRelocate);
+          nodeToRelocate && typeof slotRefNode["s-rf"] === "function" && slotRefNode["s-rf"](slotRefNode);
         } else {
           if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
             if (isInitialLoad) {
@@ -2560,19 +2601,13 @@ var dispatchHooks = (hostRef, isInitialLoad) => {
       }
     }
     emitLifecycleEvent(elm, "componentWillLoad");
-    if (BUILD14.cmpWillLoad) {
-      maybePromise = safeCall(instance, "componentWillLoad", void 0, elm);
-    }
+    maybePromise = safeCall(instance, "componentWillLoad", void 0, elm);
   } else {
     emitLifecycleEvent(elm, "componentWillUpdate");
-    if (BUILD14.cmpWillUpdate) {
-      maybePromise = safeCall(instance, "componentWillUpdate", void 0, elm);
-    }
+    maybePromise = safeCall(instance, "componentWillUpdate", void 0, elm);
   }
   emitLifecycleEvent(elm, "componentWillRender");
-  if (BUILD14.cmpWillRender) {
-    maybePromise = enqueue(maybePromise, () => safeCall(instance, "componentWillRender", void 0, elm));
-  }
+  maybePromise = enqueue(maybePromise, () => safeCall(instance, "componentWillRender", void 0, elm));
   endSchedule();
   return enqueue(maybePromise, () => updateComponent(hostRef, instance, isInitialLoad));
 };
@@ -2680,14 +2715,12 @@ var postUpdateComponent = (hostRef) => {
   const endPostUpdate = createTime("postUpdate", tagName);
   const instance = BUILD14.lazyLoad ? hostRef.$lazyInstance$ : elm;
   const ancestorComponent = hostRef.$ancestorComponent$;
-  if (BUILD14.cmpDidRender) {
-    if (BUILD14.isDev) {
-      hostRef.$flags$ |= 1024 /* devOnRender */;
-    }
-    safeCall(instance, "componentDidRender", void 0, elm);
-    if (BUILD14.isDev) {
-      hostRef.$flags$ &= ~1024 /* devOnRender */;
-    }
+  if (BUILD14.isDev) {
+    hostRef.$flags$ |= 1024 /* devOnRender */;
+  }
+  safeCall(instance, "componentDidRender", void 0, elm);
+  if (BUILD14.isDev) {
+    hostRef.$flags$ &= ~1024 /* devOnRender */;
   }
   emitLifecycleEvent(elm, "componentDidRender");
   if (!(hostRef.$flags$ & 64 /* hasLoadedComponent */)) {
@@ -2695,14 +2728,12 @@ var postUpdateComponent = (hostRef) => {
     if (BUILD14.asyncLoading && BUILD14.cssAnnotations) {
       addHydratedFlag(elm);
     }
-    if (BUILD14.cmpDidLoad) {
-      if (BUILD14.isDev) {
-        hostRef.$flags$ |= 2048 /* devOnDidLoad */;
-      }
-      safeCall(instance, "componentDidLoad", void 0, elm);
-      if (BUILD14.isDev) {
-        hostRef.$flags$ &= ~2048 /* devOnDidLoad */;
-      }
+    if (BUILD14.isDev) {
+      hostRef.$flags$ |= 2048 /* devOnDidLoad */;
+    }
+    safeCall(instance, "componentDidLoad", void 0, elm);
+    if (BUILD14.isDev) {
+      hostRef.$flags$ &= ~2048 /* devOnDidLoad */;
     }
     emitLifecycleEvent(elm, "componentDidLoad");
     endPostUpdate();
@@ -2713,14 +2744,12 @@ var postUpdateComponent = (hostRef) => {
       }
     }
   } else {
-    if (BUILD14.cmpDidUpdate) {
-      if (BUILD14.isDev) {
-        hostRef.$flags$ |= 1024 /* devOnRender */;
-      }
-      safeCall(instance, "componentDidUpdate", void 0, elm);
-      if (BUILD14.isDev) {
-        hostRef.$flags$ &= ~1024 /* devOnRender */;
-      }
+    if (BUILD14.isDev) {
+      hostRef.$flags$ |= 1024 /* devOnRender */;
+    }
+    safeCall(instance, "componentDidUpdate", void 0, elm);
+    if (BUILD14.isDev) {
+      hostRef.$flags$ &= ~1024 /* devOnRender */;
     }
     emitLifecycleEvent(elm, "componentDidUpdate");
     endPostUpdate();
@@ -2852,7 +2881,7 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
         }
       }
       if (BUILD15.updatable && (flags & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
-        if (BUILD15.cmpShouldUpdate && instance.componentShouldUpdate) {
+        if (instance.componentShouldUpdate) {
           if (instance.componentShouldUpdate(newVal, oldVal, propName) === false) {
             return;
           }
@@ -3134,7 +3163,7 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
   }
 };
 var fireConnectedCallback = (instance, elm) => {
-  if (BUILD17.lazyLoad && BUILD17.connectedCallback) {
+  if (BUILD17.lazyLoad) {
     safeCall(instance, "connectedCallback", void 0, elm);
   }
 };
@@ -3215,12 +3244,9 @@ var setContentReference = (elm) => {
 // src/runtime/disconnected-callback.ts
 import { BUILD as BUILD19 } from "@stencil/core/internal/app-data";
 var disconnectInstance = (instance, elm) => {
-  if (BUILD19.lazyLoad && BUILD19.disconnectedCallback) {
+  if (BUILD19.lazyLoad) {
     safeCall(instance, "disconnectedCallback", void 0, elm || instance);
   }
-  if (BUILD19.cmpDidUnload) {
-    safeCall(instance, "componentDidUnload", void 0, elm || instance);
-  }
 };
 var disconnectedCallback = async (elm) => {
   if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
@@ -3306,25 +3332,15 @@ var proxyCustomElement = (Cstr, compactMeta) => {
         this.__hasHostListenerAttached = true;
       }
       connectedCallback(this);
-      if (BUILD20.connectedCallback && originalConnectedCallback) {
+      if (originalConnectedCallback) {
         originalConnectedCallback.call(this);
       }
     },
     disconnectedCallback() {
       disconnectedCallback(this);
-      if (BUILD20.disconnectedCallback && originalDisconnectedCallback) {
+      if (originalDisconnectedCallback) {
         originalDisconnectedCallback.call(this);
       }
-      plt.raf(() => {
-        var _a;
-        const hostRef = getHostRef(this);
-        if (((_a = hostRef == null ? void 0 : hostRef.$vnode$) == null ? void 0 : _a.$elm$) instanceof Node && !hostRef.$vnode$.$elm$.isConnected) {
-          delete hostRef.$vnode$;
-        }
-        if (this instanceof Node && !this.isConnected) {
-          deleteHostRef(this);
-        }
-      });
     },
     __attachShadow() {
       if (supportsShadow) {
@@ -3844,16 +3860,18 @@ function proxyHostElement(elm, cstr) {
           }
           (_a = hostRef == null ? void 0 : hostRef.$instanceValues$) == null ? void 0 : _a.set(memberName, attrPropVal);
         }
-        Object.defineProperty(elm, memberName, {
+        const getterSetterDescriptor = {
           get: function() {
             return getValue(this, memberName);
           },
-          set(newValue) {
+          set: function(newValue) {
             setValue(this, memberName, newValue, cmpMeta);
           },
           configurable: true,
           enumerable: true
-        });
+        };
+        Object.defineProperty(elm, memberName, getterSetterDescriptor);
+        Object.defineProperty(elm, metaAttributeName, getterSetterDescriptor);
         if (!cstr.prototype.__stencilAugmented) {
           Object.defineProperty(cstr.prototype, memberName, {
             get: function() {
@@ -4260,15 +4278,19 @@ var setPlatformHelpers = (helpers) => {
 var supportsShadow = BUILD24.shadowDom;
 var supportsListenerOptions = false;
 var supportsConstructableStylesheets = false;
-var hostRefs = /* @__PURE__ */ new WeakMap();
-var getHostRef = (ref) => hostRefs.get(ref);
-var deleteHostRef = (ref) => hostRefs.delete(ref);
+var getHostRef = (ref) => {
+  if (ref.__stencil__getHostRef) {
+    return ref.__stencil__getHostRef();
+  }
+  return void 0;
+};
 var registerInstance = (lazyInstance, hostRef) => {
-  const ref = hostRefs.set(hostRef.$lazyInstance$ = lazyInstance, hostRef);
+  lazyInstance.__stencil__getHostRef = () => hostRef;
+  hostRef.$lazyInstance$ = lazyInstance;
   if (BUILD24.modernPropertyDecls && (BUILD24.state || BUILD24.prop)) {
     reWireGetterSetter(lazyInstance, hostRef);
   }
-  return ref;
+  return hostRef;
 };
 var registerHost = (elm, cmpMeta) => {
   const hostRef = {
@@ -4282,7 +4304,8 @@ var registerHost = (elm, cmpMeta) => {
   hostRef.$onReadyPromise$ = new Promise((r) => hostRef.$onReadyResolve$ = r);
   elm["s-p"] = [];
   elm["s-rc"] = [];
-  return hostRefs.set(elm, hostRef);
+  elm.__stencil__getHostRef = () => hostRef;
+  return hostRef;
 };
 var Build = {
   isDev: false,
@@ -4309,7 +4332,6 @@ export {
   consoleError,
   createEvent,
   defineCustomElement,
-  deleteHostRef,
   disconnectedCallback,
   doc,
   forceModeUpdate,