@postnord/pn-marketweb-components 4.1.0 → 4.1.2

package/umd/modules/@postnord/web-components/node_modules/@stencil/core/internal/client/index.js

@@ -1,11 +1,6 @@
 /*
- Stencil Client Platform v4.38.3 | MIT Licensed | https://stenciljs.com
+ Stencil Client Platform v4.41.3 | MIT Licensed | https://stenciljs.com
  */
-var __defProp = Object.defineProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
 
 // src/client/client-build.ts
 import { BUILD } from "@stencil/core/internal/app-data";
@@ -255,6 +250,9 @@ var supportsListenerOptions = /* @__PURE__ */ (() => {
 var promiseResolve = (v) => Promise.resolve(v);
 var supportsConstructableStylesheets = BUILD6.constructableCSS ? /* @__PURE__ */ (() => {
   try {
+    if (!win.document.adoptedStyleSheets) {
+      return false;
+    }
     new CSSStyleSheet();
     return typeof new CSSStyleSheet().replaceSync === "function";
   } catch (e) {
@@ -348,176 +346,6 @@ var setAssetPath = (path) => plt.$resourcesUrl$ = path;
 // src/runtime/bootstrap-custom-element.ts
 import { BUILD as BUILD27 } from "@stencil/core/internal/app-data";
 
-// src/utils/helpers.ts
-var isDef = (v) => v != null && v !== void 0;
-var isComplexType = (o) => {
-  o = typeof o;
-  return o === "object" || o === "function";
-};
-
-// src/utils/query-nonce-meta-tag-content.ts
-function queryNonceMetaTagContent(doc) {
-  var _a, _b, _c;
-  return (_c = (_b = (_a = doc.head) == null ? void 0 : _a.querySelector('meta[name="csp-nonce"]')) == null ? void 0 : _b.getAttribute("content")) != null ? _c : void 0;
-}
-
-// src/utils/regular-expression.ts
-var escapeRegExpSpecialCharacters = (text) => {
-  return text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-};
-
-// src/utils/remote-value.ts
-var RemoteValue = class _RemoteValue {
-  /**
-   * Deserializes a LocalValue serialized object back to its original JavaScript representation
-   *
-   * @param serialized The serialized LocalValue object
-   * @returns The original JavaScript value/object
-   */
-  static fromLocalValue(serialized) {
-    const type = serialized[TYPE_CONSTANT];
-    const value = VALUE_CONSTANT in serialized ? serialized[VALUE_CONSTANT] : void 0;
-    switch (type) {
-      case "string" /* String */:
-        return value;
-      case "boolean" /* Boolean */:
-        return value;
-      case "bigint" /* BigInt */:
-        return BigInt(value);
-      case "undefined" /* Undefined */:
-        return void 0;
-      case "null" /* Null */:
-        return null;
-      case "number" /* Number */:
-        if (value === "NaN") return NaN;
-        if (value === "-0") return -0;
-        if (value === "Infinity") return Infinity;
-        if (value === "-Infinity") return -Infinity;
-        return value;
-      case "array" /* Array */:
-        return value.map((item) => _RemoteValue.fromLocalValue(item));
-      case "date" /* Date */:
-        return new Date(value);
-      case "map" /* Map */:
-        const map2 = /* @__PURE__ */ new Map();
-        for (const [key, val] of value) {
-          const deserializedKey = typeof key === "object" && key !== null ? _RemoteValue.fromLocalValue(key) : key;
-          const deserializedValue = _RemoteValue.fromLocalValue(val);
-          map2.set(deserializedKey, deserializedValue);
-        }
-        return map2;
-      case "object" /* Object */:
-        const obj = {};
-        for (const [key, val] of value) {
-          obj[key] = _RemoteValue.fromLocalValue(val);
-        }
-        return obj;
-      case "regexp" /* RegularExpression */:
-        const { pattern, flags } = value;
-        return new RegExp(pattern, flags);
-      case "set" /* Set */:
-        const set = /* @__PURE__ */ new Set();
-        for (const item of value) {
-          set.add(_RemoteValue.fromLocalValue(item));
-        }
-        return set;
-      case "symbol" /* Symbol */:
-        return Symbol(value);
-      default:
-        throw new Error(`Unsupported type: ${type}`);
-    }
-  }
-  /**
-   * Utility method to deserialize multiple LocalValues at once
-   *
-   * @param serializedValues Array of serialized LocalValue objects
-   * @returns Array of deserialized JavaScript values
-   */
-  static fromLocalValueArray(serializedValues) {
-    return serializedValues.map((value) => _RemoteValue.fromLocalValue(value));
-  }
-  /**
-   * Verifies if the given object matches the structure of a serialized LocalValue
-   *
-   * @param obj Object to verify
-   * @returns boolean indicating if the object has LocalValue structure
-   */
-  static isLocalValueObject(obj) {
-    if (typeof obj !== "object" || obj === null) {
-      return false;
-    }
-    if (!obj.hasOwnProperty(TYPE_CONSTANT)) {
-      return false;
-    }
-    const type = obj[TYPE_CONSTANT];
-    const hasTypeProperty = Object.values({ ...PrimitiveType, ...NonPrimitiveType }).includes(type);
-    if (!hasTypeProperty) {
-      return false;
-    }
-    if (type !== "null" /* Null */ && type !== "undefined" /* Undefined */) {
-      return obj.hasOwnProperty(VALUE_CONSTANT);
-    }
-    return true;
-  }
-};
-
-// src/utils/result.ts
-var result_exports = {};
-__export(result_exports, {
-  err: () => err,
-  map: () => map,
-  ok: () => ok,
-  unwrap: () => unwrap,
-  unwrapErr: () => unwrapErr
-});
-var ok = (value) => ({
-  isOk: true,
-  isErr: false,
-  value
-});
-var err = (value) => ({
-  isOk: false,
-  isErr: true,
-  value
-});
-function map(result, fn) {
-  if (result.isOk) {
-    const val = fn(result.value);
-    if (val instanceof Promise) {
-      return val.then((newVal) => ok(newVal));
-    } else {
-      return ok(val);
-    }
-  }
-  if (result.isErr) {
-    const value = result.value;
-    return err(value);
-  }
-  throw "should never get here";
-}
-var unwrap = (result) => {
-  if (result.isOk) {
-    return result.value;
-  } else {
-    throw result.value;
-  }
-};
-var unwrapErr = (result) => {
-  if (result.isErr) {
-    return result.value;
-  } else {
-    throw result.value;
-  }
-};
-
-// src/utils/serialize.ts
-function deserializeProperty(value) {
-  if (typeof value !== "string" || !value.startsWith(SERIALIZED_PREFIX)) {
-    return value;
-  }
-  return RemoteValue.fromLocalValue(JSON.parse(atob(value.slice(SERIALIZED_PREFIX.length))));
-}
-
 // src/utils/shadow-root.ts
 import { BUILD as BUILD8 } from "@stencil/core/internal/app-data";
 import { globalStyles } from "@stencil/core/internal/app-globals";
@@ -532,12 +360,20 @@ function createStyleSheetIfNeededAndSupported(styles2) {
 
 // src/utils/shadow-root.ts
 var globalStyleSheet;
+var GLOBAL_STYLE_ID = "sc-global";
 function createShadowRoot(cmpMeta) {
   var _a;
-  const shadowRoot = BUILD8.shadowDelegatesFocus ? this.attachShadow({
-    mode: "open",
-    delegatesFocus: !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */)
-  }) : this.attachShadow({ mode: "open" });
+  const opts = { mode: "open" };
+  if (BUILD8.shadowDelegatesFocus) {
+    opts.delegatesFocus = !!(cmpMeta.$flags$ & 16 /* shadowDelegatesFocus */);
+  }
+  if (BUILD8.shadowSlotAssignmentManual) {
+    const isManual = !!(cmpMeta.$flags$ & 1024 /* shadowSlotAssignmentManual */);
+    if (isManual) {
+      opts.slotAssignment = "manual";
+    }
+  }
+  const shadowRoot = this.attachShadow(opts);
   if (globalStyleSheet === void 0) globalStyleSheet = (_a = createStyleSheetIfNeededAndSupported(globalStyles)) != null ? _a : null;
   if (globalStyleSheet) {
     if (supportsMutableAdoptedStyleSheets) {
@@ -545,23 +381,16 @@ function createShadowRoot(cmpMeta) {
     } else {
       shadowRoot.adoptedStyleSheets = [...shadowRoot.adoptedStyleSheets, globalStyleSheet];
     }
+  } else if (globalStyles && !supportsConstructableStylesheets) {
+    const styleElm = document.createElement("style");
+    styleElm.innerHTML = globalStyles;
+    if (BUILD8.hotModuleReplacement) {
+      styleElm.setAttribute(HYDRATED_STYLE_ID, GLOBAL_STYLE_ID);
+    }
+    shadowRoot.prepend(styleElm);
   }
 }
 
-// src/utils/util.ts
-var lowerPathParam = (fn) => (p) => fn(p.toLowerCase());
-var isDtsFile = lowerPathParam((p) => p.endsWith(".d.ts") || p.endsWith(".d.mts") || p.endsWith(".d.cts"));
-var isTsFile = lowerPathParam(
-  (p) => !isDtsFile(p) && (p.endsWith(".ts") || p.endsWith(".mts") || p.endsWith(".cts"))
-);
-var isTsxFile = lowerPathParam(
-  (p) => p.endsWith(".tsx") || p.endsWith(".mtsx") || p.endsWith(".ctsx")
-);
-var isJsxFile = lowerPathParam(
-  (p) => p.endsWith(".jsx") || p.endsWith(".mjsx") || p.endsWith(".cjsx")
-);
-var isJsFile = lowerPathParam((p) => p.endsWith(".js") || p.endsWith(".mjs") || p.endsWith(".cjs"));
-
 // src/runtime/connected-callback.ts
 import { BUILD as BUILD25 } from "@stencil/core/internal/app-data";
 
@@ -726,7 +555,8 @@ var patchPseudoShadowDom = (hostElementPrototype) => {
   patchSlotRemoveChild(hostElementPrototype);
 };
 var patchCloneNode = (HostElementPrototype) => {
-  const orgCloneNode = HostElementPrototype.cloneNode;
+  if (HostElementPrototype.__cloneNode) return;
+  const orgCloneNode = HostElementPrototype.__cloneNode = HostElementPrototype.cloneNode;
   HostElementPrototype.cloneNode = function(deep) {
     const srcNode = this;
     const isShadowDom = BUILD10.shadowDom ? srcNode.shadowRoot && supportsShadow : false;
@@ -771,6 +601,7 @@ var patchCloneNode = (HostElementPrototype) => {
   };
 };
 var patchSlotAppendChild = (HostElementPrototype) => {
+  if (HostElementPrototype.__appendChild) return;
   HostElementPrototype.__appendChild = HostElementPrototype.appendChild;
   HostElementPrototype.appendChild = function(newChild) {
     const { slotName, slotNode } = findSlotFromSlottedNode(newChild, this);
@@ -788,6 +619,7 @@ var patchSlotAppendChild = (HostElementPrototype) => {
   };
 };
 var patchSlotRemoveChild = (ElementPrototype) => {
+  if (ElementPrototype.__removeChild) return;
   ElementPrototype.__removeChild = ElementPrototype.removeChild;
   ElementPrototype.removeChild = function(toRemove) {
     if (toRemove && typeof toRemove["s-sn"] !== "undefined") {
@@ -803,6 +635,7 @@ var patchSlotRemoveChild = (ElementPrototype) => {
   };
 };
 var patchSlotPrepend = (HostElementPrototype) => {
+  if (HostElementPrototype.__prepend) return;
   HostElementPrototype.__prepend = HostElementPrototype.prepend;
   HostElementPrototype.prepend = function(...newChildren) {
     newChildren.forEach((newChild) => {
@@ -829,6 +662,7 @@ var patchSlotPrepend = (HostElementPrototype) => {
   };
 };
 var patchSlotAppend = (HostElementPrototype) => {
+  if (HostElementPrototype.__append) return;
   HostElementPrototype.__append = HostElementPrototype.append;
   HostElementPrototype.append = function(...newChildren) {
     newChildren.forEach((newChild) => {
@@ -840,6 +674,7 @@ var patchSlotAppend = (HostElementPrototype) => {
   };
 };
 var patchSlotInsertAdjacentHTML = (HostElementPrototype) => {
+  if (HostElementPrototype.__insertAdjacentHTML) return;
   const originalInsertAdjacentHtml = HostElementPrototype.insertAdjacentHTML;
   HostElementPrototype.insertAdjacentHTML = function(position, text) {
     if (position !== "afterbegin" && position !== "beforeend") {
@@ -865,6 +700,7 @@ var patchSlotInsertAdjacentText = (HostElementPrototype) => {
   };
 };
 var patchInsertBefore = (HostElementPrototype) => {
+  if (HostElementPrototype.__insertBefore) return;
   const eleProto = HostElementPrototype;
   if (eleProto.__insertBefore) return;
   eleProto.__insertBefore = HostElementPrototype.insertBefore;
@@ -899,6 +735,7 @@ var patchInsertBefore = (HostElementPrototype) => {
   };
 };
 var patchSlotInsertAdjacentElement = (HostElementPrototype) => {
+  if (HostElementPrototype.__insertAdjacentElement) return;
   const originalInsertAdjacentElement = HostElementPrototype.insertAdjacentElement;
   HostElementPrototype.insertAdjacentElement = function(position, element) {
     if (position !== "afterbegin" && position !== "beforeend") {
@@ -1180,6 +1017,14 @@ var installDevTools = () => {
 
 // src/runtime/styles.ts
 import { BUILD as BUILD12 } from "@stencil/core/internal/app-data";
+
+// src/utils/query-nonce-meta-tag-content.ts
+function queryNonceMetaTagContent(doc) {
+  var _a, _b, _c;
+  return (_c = (_b = (_a = doc.head) == null ? void 0 : _a.querySelector('meta[name="csp-nonce"]')) == null ? void 0 : _b.getAttribute("content")) != null ? _c : void 0;
+}
+
+// src/runtime/styles.ts
 var rootAppliedStyles = /* @__PURE__ */ new WeakMap();
 var registerStyle = (scopeId2, cssText, allowCS) => {
   let style = styles.get(scopeId2);
@@ -1196,7 +1041,7 @@ var registerStyle = (scopeId2, cssText, allowCS) => {
   styles.set(scopeId2, style);
 };
 var addStyle = (styleContainerNode, cmpMeta, mode) => {
-  var _a;
+  var _a, _b, _c;
   const scopeId2 = getScopeId(cmpMeta, mode);
   const style = styles.get(scopeId2);
   if (!BUILD12.attachStyles || !win.document) {
@@ -1211,64 +1056,81 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
       if (!appliedStyles) {
         rootAppliedStyles.set(styleContainerNode, appliedStyles = /* @__PURE__ */ new Set());
       }
-      if (!appliedStyles.has(scopeId2)) {
-        if (BUILD12.hydrateClientSide && styleContainerNode.host && (styleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`))) {
-          styleElm.innerHTML = style;
-        } else {
-          styleElm = win.document.createElement("style");
-          styleElm.innerHTML = style;
-          const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(win.document);
-          if (nonce != null) {
-            styleElm.setAttribute("nonce", nonce);
-          }
-          if ((BUILD12.hydrateServerSide || BUILD12.hotModuleReplacement) && (cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */ || cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */)) {
-            styleElm.setAttribute(HYDRATED_STYLE_ID, scopeId2);
-          }
-          if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */)) {
-            if (styleContainerNode.nodeName === "HEAD") {
-              const preconnectLinks = styleContainerNode.querySelectorAll("link[rel=preconnect]");
-              const referenceNode2 = preconnectLinks.length > 0 ? preconnectLinks[preconnectLinks.length - 1].nextSibling : styleContainerNode.querySelector("style");
-              styleContainerNode.insertBefore(
-                styleElm,
-                (referenceNode2 == null ? void 0 : referenceNode2.parentNode) === styleContainerNode ? referenceNode2 : null
-              );
-            } else if ("host" in styleContainerNode) {
-              if (supportsConstructableStylesheets) {
-                const stylesheet = new CSSStyleSheet();
-                stylesheet.replaceSync(style);
-                if (supportsMutableAdoptedStyleSheets) {
-                  styleContainerNode.adoptedStyleSheets.unshift(stylesheet);
-                } else {
-                  styleContainerNode.adoptedStyleSheets = [stylesheet, ...styleContainerNode.adoptedStyleSheets];
-                }
+      const existingStyleElm = (BUILD12.hydrateClientSide || BUILD12.hotModuleReplacement) && styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`);
+      if (existingStyleElm) {
+        existingStyleElm.textContent = style;
+      } else if (!appliedStyles.has(scopeId2)) {
+        styleElm = win.document.createElement("style");
+        styleElm.textContent = style;
+        const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(win.document);
+        if (nonce != null) {
+          styleElm.setAttribute("nonce", nonce);
+        }
+        if ((BUILD12.hydrateServerSide || BUILD12.hotModuleReplacement) && (cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */ || cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */ || cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */)) {
+          styleElm.setAttribute(HYDRATED_STYLE_ID, scopeId2);
+        }
+        if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */)) {
+          if (styleContainerNode.nodeName === "HEAD") {
+            const preconnectLinks = styleContainerNode.querySelectorAll("link[rel=preconnect]");
+            const referenceNode2 = preconnectLinks.length > 0 ? preconnectLinks[preconnectLinks.length - 1].nextSibling : styleContainerNode.querySelector("style");
+            styleContainerNode.insertBefore(
+              styleElm,
+              (referenceNode2 == null ? void 0 : referenceNode2.parentNode) === styleContainerNode ? referenceNode2 : null
+            );
+          } else if ("host" in styleContainerNode) {
+            if (supportsConstructableStylesheets) {
+              const currentWindow = (_b = styleContainerNode.defaultView) != null ? _b : styleContainerNode.ownerDocument.defaultView;
+              const stylesheet = new currentWindow.CSSStyleSheet();
+              stylesheet.replaceSync(style);
+              if (supportsMutableAdoptedStyleSheets) {
+                styleContainerNode.adoptedStyleSheets.unshift(stylesheet);
               } else {
-                const existingStyleContainer = styleContainerNode.querySelector("style");
-                if (existingStyleContainer) {
-                  existingStyleContainer.innerHTML = style + existingStyleContainer.innerHTML;
-                } else {
-                  styleContainerNode.prepend(styleElm);
-                }
+                styleContainerNode.adoptedStyleSheets = [stylesheet, ...styleContainerNode.adoptedStyleSheets];
               }
             } else {
-              styleContainerNode.append(styleElm);
+              const existingStyleContainer = styleContainerNode.querySelector("style");
+              if (existingStyleContainer) {
+                existingStyleContainer.textContent = style + existingStyleContainer.textContent;
+              } else {
+                styleContainerNode.prepend(styleElm);
+              }
             }
-          }
-          if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
-            styleContainerNode.insertBefore(styleElm, null);
+          } else {
+            styleContainerNode.append(styleElm);
           }
         }
+        if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
+          styleContainerNode.insertBefore(styleElm, null);
+        }
         if (cmpMeta.$flags$ & 4 /* hasSlotRelocation */) {
-          styleElm.innerHTML += SLOT_FB_CSS;
+          styleElm.textContent += SLOT_FB_CSS;
         }
         if (appliedStyles) {
           appliedStyles.add(scopeId2);
         }
       }
-    } else if (BUILD12.constructableCSS && !styleContainerNode.adoptedStyleSheets.includes(style)) {
-      if (supportsMutableAdoptedStyleSheets) {
-        styleContainerNode.adoptedStyleSheets.push(style);
-      } else {
-        styleContainerNode.adoptedStyleSheets = [...styleContainerNode.adoptedStyleSheets, style];
+    } else if (BUILD12.constructableCSS) {
+      let appliedStyles = rootAppliedStyles.get(styleContainerNode);
+      if (!appliedStyles) {
+        rootAppliedStyles.set(styleContainerNode, appliedStyles = /* @__PURE__ */ new Set());
+      }
+      if (!appliedStyles.has(scopeId2)) {
+        const currentWindow = (_c = styleContainerNode.defaultView) != null ? _c : styleContainerNode.ownerDocument.defaultView;
+        let stylesheet;
+        if (style.constructor === currentWindow.CSSStyleSheet) {
+          stylesheet = style;
+        } else {
+          stylesheet = new currentWindow.CSSStyleSheet();
+          for (let i2 = 0; i2 < style.cssRules.length; i2++) {
+            stylesheet.insertRule(style.cssRules[i2].cssText, i2);
+          }
+        }
+        if (supportsMutableAdoptedStyleSheets) {
+          styleContainerNode.adoptedStyleSheets.push(stylesheet);
+        } else {
+          styleContainerNode.adoptedStyleSheets = [...styleContainerNode.adoptedStyleSheets, stylesheet];
+        }
+        appliedStyles.add(scopeId2);
       }
     }
   }
@@ -1305,7 +1167,19 @@ var hydrateScopedToShadow = () => {
 
 // src/runtime/vdom/h.ts
 import { BUILD as BUILD13 } from "@stencil/core/internal/app-data";
+
+// src/utils/helpers.ts
+var isDef = (v) => v != null && v !== void 0;
+var isComplexType = (o) => {
+  o = typeof o;
+  return o === "object" || o === "function";
+};
+
+// src/runtime/vdom/h.ts
 var h = (nodeName, vnodeData, ...children) => {
+  if (typeof nodeName === "string") {
+    nodeName = transformTag(nodeName);
+  }
   let child = null;
   let key = null;
   let slotName = null;
@@ -1381,7 +1255,8 @@ var newVNode = (tag, text) => {
   const vnode = {
     $flags$: 0,
     $tag$: tag,
-    $text$: text,
+    // Normalize undefined to null to prevent rendering "undefined" as text
+    $text$: text != null ? text : null,
     $elm$: null,
     $children$: null
   };
@@ -1445,7 +1320,7 @@ var validateInputProperties = (inputElm) => {
 
 // src/runtime/client-hydrate.ts
 var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   const endHydrate = createTime("hydrateClient", tagName);
   const shadowRoot = hostElm.shadowRoot;
   const childRenderNodes = [];
@@ -1488,7 +1363,7 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
     const orgLocationNode = plt.$orgLocNodes$.get(orgLocationId);
     const node = childRenderNode.$elm$;
     if (!shadowRoot) {
-      node["s-hn"] = tagName.toUpperCase();
+      node["s-hn"] = transformTag(tagName).toUpperCase();
       if (childRenderNode.$tag$ === "slot") {
         node["s-cr"] = hostElm["s-cr"];
       }
@@ -1501,7 +1376,7 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
         );
         const styleSheet = win.document.querySelector(`style[sty-id="${scopeId3}"]`);
         if (styleSheet) {
-          hostElm.shadowRoot.append(styleSheet.cloneNode(true));
+          shadowRootNodes.unshift(styleSheet.cloneNode(true));
         }
       }
     }
@@ -1538,6 +1413,7 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
   let snGroupIdx;
   let snGroupLen;
   let slottedItem;
+  let currentPos = 0;
   for (snIndex; snIndex < snLen; snIndex++) {
     slotGroup = slottedNodes[snIndex];
     if (!slotGroup || !slotGroup.length) continue;
@@ -1551,7 +1427,7 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
       if (!hosts[slottedItem.hostId]) continue;
       const hostEle = hosts[slottedItem.hostId];
       if (hostEle.shadowRoot && slottedItem.node.parentElement !== hostEle) {
-        hostEle.appendChild(slottedItem.node);
+        hostEle.insertBefore(slottedItem.node, (_c = (_b = slotGroup[snGroupIdx - 1]) == null ? void 0 : _b.node) == null ? void 0 : _c.nextSibling);
       }
       if (!hostEle.shadowRoot || !shadowRoot) {
         if (!slottedItem.slot["s-cr"]) {
@@ -1562,14 +1438,15 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
             slottedItem.slot["s-cr"] = (hostEle.__childNodes || hostEle.childNodes)[0];
           }
         }
-        addSlotRelocateNode(slottedItem.node, slottedItem.slot, false, slottedItem.node["s-oo"]);
-        if (((_b = slottedItem.node.parentElement) == null ? void 0 : _b.shadowRoot) && slottedItem.node["getAttribute"] && slottedItem.node.getAttribute("slot")) {
+        addSlotRelocateNode(slottedItem.node, slottedItem.slot, false, slottedItem.node["s-oo"] || currentPos);
+        if (((_d = slottedItem.node.parentElement) == null ? void 0 : _d.shadowRoot) && slottedItem.node["getAttribute"] && slottedItem.node.getAttribute("slot")) {
           slottedItem.node.removeAttribute("slot");
         }
         if (BUILD14.experimentalSlotFixes) {
           patchSlottedNode(slottedItem.node);
         }
       }
+      currentPos = (slottedItem.node["s-oo"] || currentPos) + 1;
     }
   }
   if (BUILD14.scoped && scopeId2 && slotNodes.length) {
@@ -1577,7 +1454,7 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
       slot.$elm$.parentElement.classList.add(scopeId2 + "-s");
     });
   }
-  if (BUILD14.shadowDom && shadowRoot) {
+  if (BUILD14.shadowDom && shadowRoot && !shadowRoot.childNodes.length) {
     let rnIdex = 0;
     const rnLen = shadowRootNodes.length;
     if (rnLen) {
@@ -1591,7 +1468,7 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
         if (typeof node["s-en"] !== "string" && typeof node["s-sn"] !== "string") {
           if (node.nodeType === 1 /* ElementNode */ && node.slot && node.hidden) {
             node.removeAttribute("hidden");
-          } else if (node.nodeType === 8 /* CommentNode */ && !node.nodeValue || node.nodeType === 3 /* TextNode */ && !node.wholeText.trim()) {
+          } else if (node.nodeType === 8 /* CommentNode */ && !node.nodeValue) {
             node.parentNode.removeChild(node);
           }
         }
@@ -1758,10 +1635,6 @@ var clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes,
     vnode.$elm$ = node;
     vnode.$index$ = "0";
     parentVNode.$children$ = [vnode];
-  } else {
-    if (node.nodeType === 3 /* TextNode */ && !node.wholeText.trim() && !node["s-nr"]) {
-      node.remove();
-    }
   }
   return parentVNode;
 };
@@ -1867,6 +1740,11 @@ var findCorrespondingNode = (node, type) => {
 // src/runtime/initialize-component.ts
 import { BUILD as BUILD24 } from "@stencil/core/internal/app-data";
 
+// src/utils/regular-expression.ts
+var escapeRegExpSpecialCharacters = (text) => {
+  return text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+};
+
 // src/utils/shadow-css.ts
 /**
  * @license
@@ -1932,9 +1810,6 @@ var createSupportsRuleRe = (selector) => {
     "g"
   );
 };
-var _colonSlottedRe = createSupportsRuleRe("::slotted");
-var _colonHostRe = createSupportsRuleRe(":host");
-var _colonHostContextRe = createSupportsRuleRe(":host-context");
 var _commentRe = /\/\*\s*[\s\S]*?\*\//g;
 var stripComments = (input) => {
   return input.replace(_commentRe, "");
@@ -2012,6 +1887,9 @@ var insertPolyfillHostInCssText = (cssText) => {
     supportsBlocks.push(selectorContent);
     return `@supports selector(${placeholder})`;
   });
+  const _colonSlottedRe = createSupportsRuleRe("::slotted");
+  const _colonHostRe = createSupportsRuleRe(":host");
+  const _colonHostContextRe = createSupportsRuleRe(":host-context");
   cssText = cssText.replace(_colonHostContextRe, `$1${_polyfillHostContext}`).replace(_colonHostRe, `$1${_polyfillHost}`).replace(_colonSlottedRe, `$1${_polyfillSlotted}`);
   supportsBlocks.forEach((originalSelector, index) => {
     cssText = cssText.replace(`__supports_${index}__`, originalSelector);
@@ -2289,6 +2167,111 @@ import { BUILD as BUILD22 } from "@stencil/core/internal/app-data";
 
 // src/runtime/parse-property-value.ts
 import { BUILD as BUILD15 } from "@stencil/core/internal/app-data";
+
+// src/utils/remote-value.ts
+var RemoteValue = class _RemoteValue {
+  /**
+   * Deserializes a LocalValue serialized object back to its original JavaScript representation
+   *
+   * @param serialized The serialized LocalValue object
+   * @returns The original JavaScript value/object
+   */
+  static fromLocalValue(serialized) {
+    const type = serialized[TYPE_CONSTANT];
+    const value = VALUE_CONSTANT in serialized ? serialized[VALUE_CONSTANT] : void 0;
+    switch (type) {
+      case "string" /* String */:
+        return value;
+      case "boolean" /* Boolean */:
+        return value;
+      case "bigint" /* BigInt */:
+        return BigInt(value);
+      case "undefined" /* Undefined */:
+        return void 0;
+      case "null" /* Null */:
+        return null;
+      case "number" /* Number */:
+        if (value === "NaN") return NaN;
+        if (value === "-0") return -0;
+        if (value === "Infinity") return Infinity;
+        if (value === "-Infinity") return -Infinity;
+        return value;
+      case "array" /* Array */:
+        return value.map((item) => _RemoteValue.fromLocalValue(item));
+      case "date" /* Date */:
+        return new Date(value);
+      case "map" /* Map */:
+        const map = /* @__PURE__ */ new Map();
+        for (const [key, val] of value) {
+          const deserializedKey = typeof key === "object" && key !== null ? _RemoteValue.fromLocalValue(key) : key;
+          const deserializedValue = _RemoteValue.fromLocalValue(val);
+          map.set(deserializedKey, deserializedValue);
+        }
+        return map;
+      case "object" /* Object */:
+        const obj = {};
+        for (const [key, val] of value) {
+          obj[key] = _RemoteValue.fromLocalValue(val);
+        }
+        return obj;
+      case "regexp" /* RegularExpression */:
+        const { pattern, flags } = value;
+        return new RegExp(pattern, flags);
+      case "set" /* Set */:
+        const set = /* @__PURE__ */ new Set();
+        for (const item of value) {
+          set.add(_RemoteValue.fromLocalValue(item));
+        }
+        return set;
+      case "symbol" /* Symbol */:
+        return Symbol(value);
+      default:
+        throw new Error(`Unsupported type: ${type}`);
+    }
+  }
+  /**
+   * Utility method to deserialize multiple LocalValues at once
+   *
+   * @param serializedValues Array of serialized LocalValue objects
+   * @returns Array of deserialized JavaScript values
+   */
+  static fromLocalValueArray(serializedValues) {
+    return serializedValues.map((value) => _RemoteValue.fromLocalValue(value));
+  }
+  /**
+   * Verifies if the given object matches the structure of a serialized LocalValue
+   *
+   * @param obj Object to verify
+   * @returns boolean indicating if the object has LocalValue structure
+   */
+  static isLocalValueObject(obj) {
+    if (typeof obj !== "object" || obj === null) {
+      return false;
+    }
+    if (!obj.hasOwnProperty(TYPE_CONSTANT)) {
+      return false;
+    }
+    const type = obj[TYPE_CONSTANT];
+    const hasTypeProperty = Object.values({ ...PrimitiveType, ...NonPrimitiveType }).includes(type);
+    if (!hasTypeProperty) {
+      return false;
+    }
+    if (type !== "null" /* Null */ && type !== "undefined" /* Undefined */) {
+      return obj.hasOwnProperty(VALUE_CONSTANT);
+    }
+    return true;
+  }
+};
+
+// src/utils/serialize.ts
+function deserializeProperty(value) {
+  if (typeof value !== "string" || !value.startsWith(SERIALIZED_PREFIX)) {
+    return value;
+  }
+  return RemoteValue.fromLocalValue(JSON.parse(atob(value.slice(SERIALIZED_PREFIX.length))));
+}
+
+// src/runtime/parse-property-value.ts
 var parsePropertyValue = (propValue, propType, isFormAssociated) => {
   if ((BUILD15.hydrateClientSide || BUILD15.hydrateServerSide) && typeof propValue === "string" && propValue.startsWith(SERIALIZED_PREFIX)) {
     propValue = deserializeProperty(propValue);
@@ -2403,7 +2386,7 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRen
   } else if (BUILD18.vdomKey && memberName === "key") {
   } else if (BUILD18.vdomRef && memberName === "ref") {
     if (newValue) {
-      newValue(elm);
+      queueRefAttachment(newValue, elm);
     }
   } else if (BUILD18.vdomListener && (BUILD18.lazyLoad ? !isProp : !elm.__lookupSetter__(memberName)) && memberName[0] === "o" && memberName[1] === "n") {
     if (memberName[2] === "-") {
@@ -2532,6 +2515,8 @@ var useNativeShadowDom = false;
 var checkSlotFallbackVisibility = false;
 var checkSlotRelocate = false;
 var isSvgMode = false;
+var refCallbacksToRemove = [];
+var refCallbacksToAttach = [];
 var createElm = (oldParentVNode, newParentVNode, childIndex) => {
   var _a;
   const newVNode2 = newParentVNode.$children$[childIndex];
@@ -2559,7 +2544,7 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
       `The JSX ${newVNode2.$text$ !== null ? `"${newVNode2.$text$}" text` : `"${newVNode2.$tag$}" element`} node should not be shared within the same renderer. The renderer caches element lookups in order to improve performance. However, a side effect from this is that the exact same JSX node should not be reused. For more information please see https://stenciljs.com/docs/templating-jsx#avoid-shared-jsx-nodes`
     );
   }
-  if (BUILD20.vdomText && newVNode2.$text$ !== null) {
+  if (BUILD20.vdomText && newVNode2.$text$ != null) {
     elm = newVNode2.$elm$ = win.document.createTextNode(newVNode2.$text$);
   } else if (BUILD20.slotRelocation && newVNode2.$flags$ & 1 /* isSlotReference */) {
     elm = newVNode2.$elm$ = BUILD20.isDebug || BUILD20.hydrateServerSide ? slotReferenceDebugNode(newVNode2) : win.document.createTextNode("");
@@ -2571,9 +2556,7 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
       isSvgMode = newVNode2.$tag$ === "svg";
     }
     if (!win.document) {
-      throw new Error(
-        "You are trying to render a Stencil component in an environment that doesn't support the DOM. Make sure to populate the [`window`](https://developer.mozilla.org/en-US/docs/Web/API/Window/window) object before rendering a component."
-      );
+      throw new Error("You are trying to render a Stencil component in an environment that doesn't support the DOM.");
     }
     elm = newVNode2.$elm$ = BUILD20.svg ? win.document.createElementNS(
       isSvgMode ? SVG_NS : HTML_NS,
@@ -2591,10 +2574,11 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
       elm.classList.add(elm["s-si"] = scopeId);
     }
     if (newVNode2.$children$) {
+      const appendTarget = newVNode2.$tag$ === "template" ? elm.content : elm;
       for (i2 = 0; i2 < newVNode2.$children$.length; ++i2) {
         childNode = createElm(oldParentVNode, newVNode2, i2);
         if (childNode) {
-          elm.appendChild(childNode);
+          appendTarget.appendChild(childNode);
         }
       }
     }
@@ -2616,11 +2600,7 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
       patchSlotNode(elm);
       oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex];
       if (oldVNode && oldVNode.$tag$ === newVNode2.$tag$ && oldParentVNode.$elm$) {
-        if (BUILD20.experimentalSlotFixes) {
-          relocateToHostRoot(oldParentVNode.$elm$);
-        } else {
-          putBackInOriginalLocation(oldParentVNode.$elm$, false);
-        }
+        relocateToHostRoot(oldParentVNode.$elm$);
       }
       if (BUILD20.scoped || BUILD20.hydrateServerSide && 128 /* shadowNeedsScopedCss */) {
         addRemoveSlotScopedClass(contentRef, elm, newParentVNode.$elm$, oldParentVNode == null ? void 0 : oldParentVNode.$elm$);
@@ -2652,7 +2632,7 @@ var relocateToHostRoot = (parentElm) => {
 var putBackInOriginalLocation = (parentElm, recursive) => {
   plt.$flags$ |= 1 /* isTmpDisconnected */;
   const oldSlotChildNodes = Array.from(parentElm.__childNodes || parentElm.childNodes);
-  if (parentElm["s-sr"] && BUILD20.experimentalSlotFixes) {
+  if (parentElm["s-sr"]) {
     let node = parentElm;
     while (node = node.nextSibling) {
       if (node && node["s-sn"] === parentElm["s-sn"] && node["s-sh"] === hostTagName) {
@@ -2681,6 +2661,9 @@ var addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => {
   if (BUILD20.shadowDom && containerElm.shadowRoot && containerElm.tagName === hostTagName) {
     containerElm = containerElm.shadowRoot;
   }
+  if (parentVNode.$tag$ === "template") {
+    containerElm = containerElm.content;
+  }
   for (; startIdx <= endIdx; ++startIdx) {
     if (vnodes[startIdx]) {
       childNode = createElm(null, parentVNode, startIdx);
@@ -2724,6 +2707,7 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
   let newEndVnode = newCh[newEndIdx];
   let node;
   let elmToMove;
+  const containerElm = newVNode2.$tag$ === "template" ? parentElm.content : parentElm;
   while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
     if (oldStartVnode == null) {
       oldStartVnode = oldCh[++oldStartIdx];
@@ -2746,7 +2730,7 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
         putBackInOriginalLocation(oldStartVnode.$elm$.parentNode, false);
       }
       patch(oldStartVnode, newEndVnode, isInitialRender);
-      insertBefore(parentElm, oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling);
+      insertBefore(containerElm, oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling);
       oldStartVnode = oldCh[++oldStartIdx];
       newEndVnode = newCh[--newEndIdx];
     } else if (isSameVnode(oldEndVnode, newStartVnode, isInitialRender)) {
@@ -2754,7 +2738,7 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
         putBackInOriginalLocation(oldEndVnode.$elm$.parentNode, false);
       }
       patch(oldEndVnode, newStartVnode, isInitialRender);
-      insertBefore(parentElm, oldEndVnode.$elm$, oldStartVnode.$elm$);
+      insertBefore(containerElm, oldEndVnode.$elm$, oldStartVnode.$elm$);
       oldEndVnode = oldCh[--oldEndIdx];
       newStartVnode = newCh[++newStartIdx];
     } else {
@@ -2830,13 +2814,13 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
   const tag = newVNode2.$tag$;
   const text = newVNode2.$text$;
   let defaultHolder;
-  if (!BUILD20.vdomText || text === null) {
+  if (!BUILD20.vdomText || text == null) {
     if (BUILD20.svg) {
       isSvgMode = tag === "svg" ? true : tag === "foreignObject" ? false : isSvgMode;
     }
     if (BUILD20.vdomAttribute || BUILD20.reflect) {
       if (BUILD20.slot && tag === "slot" && !useNativeShadowDom) {
-        if (BUILD20.experimentalSlotFixes && oldVNode.$name$ !== newVNode2.$name$) {
+        if (oldVNode.$name$ !== newVNode2.$name$) {
           newVNode2.$elm$["s-sn"] = newVNode2.$name$ || "";
           relocateToHostRoot(newVNode2.$elm$.parentElement);
         }
@@ -2879,7 +2863,7 @@ var markSlotContentForRelocation = (elm) => {
       const slotName = childNode["s-sn"];
       for (j = hostContentNodes.length - 1; j >= 0; j--) {
         node = hostContentNodes[j];
-        if (!node["s-cn"] && !node["s-nr"] && node["s-hn"] !== childNode["s-hn"] && (!BUILD20.experimentalSlotFixes || !node["s-sh"] || node["s-sh"] !== childNode["s-hn"])) {
+        if (!node["s-cn"] && !node["s-nr"] && node["s-hn"] !== childNode["s-hn"] && (!node["s-sh"] || node["s-sh"] !== childNode["s-hn"])) {
           if (isNodeLocatedInSlot(node, slotName)) {
             let relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
             checkSlotFallbackVisibility = true;
@@ -2919,23 +2903,40 @@ var markSlotContentForRelocation = (elm) => {
 };
 var nullifyVNodeRefs = (vNode) => {
   if (BUILD20.vdomRef) {
-    vNode.$attrs$ && vNode.$attrs$.ref && vNode.$attrs$.ref(null);
+    if (vNode.$attrs$ && vNode.$attrs$.ref) {
+      refCallbacksToRemove.push(() => vNode.$attrs$.ref(null));
+    }
     vNode.$children$ && vNode.$children$.map(nullifyVNodeRefs);
   }
 };
-var insertBefore = (parent, newNode, reference) => {
-  if (BUILD20.scoped && typeof newNode["s-sn"] === "string" && !!newNode["s-sr"] && !!newNode["s-cr"]) {
-    addRemoveSlotScopedClass(newNode["s-cr"], newNode, parent, newNode.parentElement);
-  } else if (BUILD20.experimentalSlotFixes && typeof newNode["s-sn"] === "string") {
-    if (parent.getRootNode().nodeType !== 11 /* DOCUMENT_FRAGMENT_NODE */) {
-      patchParentNode(newNode);
+var queueRefAttachment = (refCallback, elm) => {
+  if (BUILD20.vdomRef) {
+    refCallbacksToAttach.push(() => refCallback(elm));
+  }
+};
+var flushQueuedRefCallbacks = () => {
+  if (BUILD20.vdomRef) {
+    refCallbacksToRemove.forEach((cb) => cb());
+    refCallbacksToRemove.length = 0;
+    refCallbacksToAttach.forEach((cb) => cb());
+    refCallbacksToAttach.length = 0;
+  }
+};
+var insertBefore = (parent, newNode, reference, isInitialLoad) => {
+  if (BUILD20.slotRelocation) {
+    if (BUILD20.scoped && typeof newNode["s-sn"] === "string" && !!newNode["s-sr"] && !!newNode["s-cr"]) {
+      addRemoveSlotScopedClass(newNode["s-cr"], newNode, parent, newNode.parentElement);
+    } else if (typeof newNode["s-sn"] === "string") {
+      if (BUILD20.experimentalSlotFixes && parent.getRootNode().nodeType !== 11 /* DOCUMENT_FRAGMENT_NODE */) {
+        patchParentNode(newNode);
+      }
+      parent.insertBefore(newNode, reference);
+      const { slotNode } = findSlotFromSlottedNode(newNode);
+      if (slotNode && !isInitialLoad) dispatchSlotChangeEvent(slotNode);
+      return newNode;
     }
-    parent.insertBefore(newNode, reference);
-    const { slotNode } = findSlotFromSlottedNode(newNode);
-    if (slotNode) dispatchSlotChangeEvent(slotNode);
-    return newNode;
   }
-  if (BUILD20.experimentalSlotFixes && parent.__insertBefore) {
+  if (parent.__insertBefore) {
     return parent.__insertBefore(newNode, reference);
   } else {
     return parent == null ? void 0 : parent.insertBefore(newNode, reference);
@@ -3023,19 +3024,27 @@ render() {
         if (!nodeToRelocate["s-ol"] && win.document) {
           const orgLocationNode = BUILD20.isDebug || BUILD20.hydrateServerSide ? originalLocationDebugNode(nodeToRelocate) : win.document.createTextNode("");
           orgLocationNode["s-nr"] = nodeToRelocate;
-          insertBefore(nodeToRelocate.parentNode, nodeToRelocate["s-ol"] = orgLocationNode, nodeToRelocate);
+          insertBefore(
+            nodeToRelocate.parentNode,
+            nodeToRelocate["s-ol"] = orgLocationNode,
+            nodeToRelocate,
+            isInitialLoad
+          );
         }
       }
       for (const relocateData of relocateNodes) {
         const nodeToRelocate = relocateData.$nodeToRelocate$;
         const slotRefNode = relocateData.$slotRefNode$;
+        if (nodeToRelocate.nodeType === 1 /* ElementNode */ && isInitialLoad) {
+          nodeToRelocate["s-ih"] = (_a = nodeToRelocate.hidden) != null ? _a : false;
+        }
         if (slotRefNode) {
           const parentNodeRef = slotRefNode.parentNode;
           let insertBeforeNode = slotRefNode.nextSibling;
-          if (!BUILD20.hydrateServerSide && (!BUILD20.experimentalSlotFixes || insertBeforeNode && insertBeforeNode.nodeType === 1 /* ElementNode */)) {
-            let orgLocationNode = (_a = nodeToRelocate["s-ol"]) == null ? void 0 : _a.previousSibling;
+          if (!BUILD20.hydrateServerSide && insertBeforeNode && insertBeforeNode.nodeType === 1 /* ElementNode */) {
+            let orgLocationNode = (_b = nodeToRelocate["s-ol"]) == null ? void 0 : _b.previousSibling;
             while (orgLocationNode) {
-              let refNode = (_b = orgLocationNode["s-nr"]) != null ? _b : null;
+              let refNode = (_c = orgLocationNode["s-nr"]) != null ? _c : null;
               if (refNode && refNode["s-sn"] === nodeToRelocate["s-sn"] && parentNodeRef === (refNode.__parentNode || refNode.parentNode)) {
                 refNode = refNode.nextSibling;
                 while (refNode === nodeToRelocate || (refNode == null ? void 0 : refNode["s-sr"])) {
@@ -3053,23 +3062,26 @@ render() {
           const nextSibling = nodeToRelocate.__nextSibling || nodeToRelocate.nextSibling;
           if (!insertBeforeNode && parentNodeRef !== parent || nextSibling !== insertBeforeNode) {
             if (nodeToRelocate !== insertBeforeNode) {
-              if (!BUILD20.experimentalSlotFixes && !nodeToRelocate["s-hn"] && nodeToRelocate["s-ol"]) {
-                nodeToRelocate["s-hn"] = nodeToRelocate["s-ol"].parentNode.nodeName;
+              insertBefore(parentNodeRef, nodeToRelocate, insertBeforeNode, isInitialLoad);
+              if (nodeToRelocate.nodeType === 8 /* CommentNode */ && nodeToRelocate.nodeValue.startsWith("s-nt-")) {
+                const textNode = win.document.createTextNode(nodeToRelocate.nodeValue.replace(/^s-nt-/, ""));
+                textNode["s-hn"] = nodeToRelocate["s-hn"];
+                textNode["s-sn"] = nodeToRelocate["s-sn"];
+                textNode["s-sh"] = nodeToRelocate["s-sh"];
+                textNode["s-sr"] = nodeToRelocate["s-sr"];
+                textNode["s-ol"] = nodeToRelocate["s-ol"];
+                textNode["s-ol"]["s-nr"] = textNode;
+                insertBefore(nodeToRelocate.parentNode, textNode, nodeToRelocate, isInitialLoad);
+                nodeToRelocate.parentNode.removeChild(nodeToRelocate);
               }
-              insertBefore(parentNodeRef, nodeToRelocate, insertBeforeNode);
               if (nodeToRelocate.nodeType === 1 /* ElementNode */ && nodeToRelocate.tagName !== "SLOT-FB") {
-                nodeToRelocate.hidden = (_c = nodeToRelocate["s-ih"]) != null ? _c : false;
+                nodeToRelocate.hidden = (_d = nodeToRelocate["s-ih"]) != null ? _d : false;
               }
             }
           }
           nodeToRelocate && typeof slotRefNode["s-rf"] === "function" && slotRefNode["s-rf"](slotRefNode);
-        } else {
-          if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
-            if (isInitialLoad) {
-              nodeToRelocate["s-ih"] = (_d = nodeToRelocate.hidden) != null ? _d : false;
-            }
-            nodeToRelocate.hidden = true;
-          }
+        } else if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
+          nodeToRelocate.hidden = true;
         }
       }
     }
@@ -3079,18 +3091,26 @@ render() {
     plt.$flags$ &= ~1 /* isTmpDisconnected */;
     relocateNodes.length = 0;
   }
-  if (BUILD20.experimentalScopedSlotChanges && cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */) {
+  if (BUILD20.slotRelocation && !useNativeShadowDom && !(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) && hostElm["s-cr"]) {
     const children = rootVnode.$elm$.__childNodes || rootVnode.$elm$.childNodes;
     for (const childNode of children) {
       if (childNode["s-hn"] !== hostTagName && !childNode["s-sh"]) {
         if (isInitialLoad && childNode["s-ih"] == null) {
           childNode["s-ih"] = (_e = childNode.hidden) != null ? _e : false;
         }
-        childNode.hidden = true;
+        if (childNode.nodeType === 1 /* ElementNode */) {
+          childNode.hidden = true;
+        } else if (childNode.nodeType === 3 /* TextNode */ && !!childNode.nodeValue.trim()) {
+          const textCommentNode = win.document.createComment("s-nt-" + childNode.nodeValue);
+          textCommentNode["s-sn"] = childNode["s-sn"];
+          insertBefore(childNode.parentNode, textCommentNode, childNode, isInitialLoad);
+          childNode.parentNode.removeChild(childNode);
+        }
       }
     }
   }
   contentRef = void 0;
+  flushQueuedRefCallbacks();
 };
 var slotReferenceDebugNode = (slotVNode) => {
   var _a;
@@ -3148,6 +3168,10 @@ var dispatchHooks = (hostRef, isInitialLoad) => {
   let maybePromise;
   if (isInitialLoad) {
     if (BUILD21.lazyLoad) {
+      if (BUILD21.slotRelocation && hostRef.$deferredConnectedCallback$) {
+        hostRef.$deferredConnectedCallback$ = false;
+        safeCall(instance, "connectedCallback", void 0, elm);
+      }
       if (BUILD21.hostListener) {
         hostRef.$flags$ |= 256 /* isListenReady */;
         if (hostRef.$queuedListeners$) {
@@ -3170,8 +3194,8 @@ var dispatchHooks = (hostRef, isInitialLoad) => {
   endSchedule();
   return enqueue(maybePromise, () => updateComponent(hostRef, instance, isInitialLoad));
 };
-var enqueue = (maybePromise, fn) => isPromisey(maybePromise) ? maybePromise.then(fn).catch((err2) => {
-  console.error(err2);
+var enqueue = (maybePromise, fn) => isPromisey(maybePromise) ? maybePromise.then(fn).catch((err) => {
+  console.error(err);
   fn();
 }) : fn();
 var isPromisey = (maybePromise) => maybePromise instanceof Promise || maybePromise && maybePromise.then && typeof maybePromise.then === "function";
@@ -3421,12 +3445,22 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
   if ((!BUILD22.lazyLoad || !(flags & 8 /* isConstructingInstance */) || oldVal === void 0) && didValueChange) {
     hostRef.$instanceValues$.set(propName, newVal);
     if (BUILD22.serializer && BUILD22.reflect && cmpMeta.$attrsToReflect$) {
-      if (instance && cmpMeta.$serializers$ && cmpMeta.$serializers$[propName]) {
-        let attrVal = newVal;
-        for (const methodName of cmpMeta.$serializers$[propName]) {
-          attrVal = instance[methodName](attrVal, propName);
+      if (cmpMeta.$serializers$ && cmpMeta.$serializers$[propName]) {
+        const runSerializer = (inst) => {
+          let attrVal = newVal;
+          for (const serializer of cmpMeta.$serializers$[propName]) {
+            const [[methodName]] = Object.entries(serializer);
+            attrVal = inst[methodName](attrVal, propName);
+          }
+          hostRef.$serializerValues$.set(propName, attrVal);
+        };
+        if (instance) {
+          runSerializer(instance);
+        } else {
+          hostRef.$fetchedCbList$.push(() => {
+            runSerializer(hostRef.$lazyInstance$);
+          });
         }
-        hostRef.$serializerValues$.set(propName, attrVal);
       }
     }
     if (BUILD22.isDev) {
@@ -3452,27 +3486,34 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
         );
       }
     }
-    if (!BUILD22.lazyLoad || instance) {
-      if (BUILD22.propChangeCallback && cmpMeta.$watchers$ && flags & 128 /* isWatchReady */) {
-        const watchMethods = cmpMeta.$watchers$[propName];
-        if (watchMethods) {
-          watchMethods.map((watchMethodName) => {
-            try {
-              instance[watchMethodName](newVal, oldVal, propName);
-            } catch (e) {
-              consoleError(e, elm);
+    if (BUILD22.propChangeCallback && cmpMeta.$watchers$) {
+      const watchMethods = cmpMeta.$watchers$[propName];
+      if (watchMethods) {
+        watchMethods.map((watcher) => {
+          try {
+            const [[watchMethodName, watcherFlags]] = Object.entries(watcher);
+            if (flags & 128 /* isWatchReady */ || watcherFlags & 1 /* Immediate */) {
+              if (!instance) {
+                hostRef.$fetchedCbList$.push(() => {
+                  hostRef.$lazyInstance$[watchMethodName](newVal, oldVal, propName);
+                });
+              } else {
+                instance[watchMethodName](newVal, oldVal, propName);
+              }
             }
-          });
-        }
-      }
-      if (BUILD22.updatable && (flags & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
-        if (instance.componentShouldUpdate) {
-          if (instance.componentShouldUpdate(newVal, oldVal, propName) === false) {
-            return;
+          } catch (e) {
+            consoleError(e, elm);
           }
+        });
+      }
+    }
+    if (BUILD22.updatable && (flags & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
+      if (instance.componentShouldUpdate) {
+        if (instance.componentShouldUpdate(newVal, oldVal, propName) === false) {
+          return;
         }
-        scheduleUpdate(hostRef, false);
       }
+      scheduleUpdate(hostRef, false);
     }
   }
 };
@@ -3655,7 +3696,8 @@ More information: https://stenciljs.com/docs/properties#prop-mutability`
                 this[propName] = deserializeVal;
               }
             };
-            for (const methodName of cmpMeta.$deserializers$[propName]) {
+            for (const deserializer of cmpMeta.$deserializers$[propName]) {
+              const [[methodName]] = Object.entries(deserializer);
               if (BUILD23.lazyLoad) {
                 if (hostRef.$lazyInstance$) {
                   setVal(methodName, hostRef.$lazyInstance$);
@@ -3674,13 +3716,14 @@ More information: https://stenciljs.com/docs/properties#prop-mutability`
             return;
           } else if (propName == null) {
             const flags2 = hostRef == null ? void 0 : hostRef.$flags$;
-            if (hostRef && flags2 && !(flags2 & 8 /* isConstructingInstance */) && flags2 & 128 /* isWatchReady */ && newValue !== oldValue) {
+            if (hostRef && flags2 && !(flags2 & 8 /* isConstructingInstance */) && newValue !== oldValue) {
               const elm = BUILD23.lazyLoad ? hostRef.$hostElement$ : this;
               const instance = BUILD23.lazyLoad ? hostRef.$lazyInstance$ : elm;
               const entry = (_a2 = cmpMeta.$watchers$) == null ? void 0 : _a2[attrName];
-              entry == null ? void 0 : entry.forEach((callbackName) => {
-                if (instance[callbackName] != null) {
-                  instance[callbackName].call(instance, newValue, oldValue, attrName);
+              entry == null ? void 0 : entry.forEach((watcher) => {
+                const [[watchMethodName, watcherFlags]] = Object.entries(watcher);
+                if (instance[watchMethodName] != null && (flags2 & 128 /* isWatchReady */ || watcherFlags & 1 /* Immediate */)) {
+                  instance[watchMethodName].call(instance, newValue, oldValue, attrName);
                 }
               });
             }
@@ -3761,7 +3804,12 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
         hostRef.$flags$ |= 128 /* isWatchReady */;
       }
       endNewInstance();
-      fireConnectedCallback(hostRef.$lazyInstance$, elm);
+      const needsDeferredCallback = BUILD24.slotRelocation && cmpMeta.$flags$ & 4 /* hasSlotRelocation */;
+      if (!needsDeferredCallback) {
+        fireConnectedCallback(hostRef.$lazyInstance$, elm);
+      } else {
+        hostRef.$deferredConnectedCallback$ = true;
+      }
     } else {
       Cstr = elm.constructor;
       const cmpTag = elm.localName;
@@ -3781,7 +3829,7 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
         }
       }
       const scopeId2 = getScopeId(cmpMeta, hostRef.$modeName$);
-      if (!styles.has(scopeId2)) {
+      if (!styles.has(scopeId2) || BUILD24.hotModuleReplacement && hmrVersionId) {
         const endRegisterStyles = createTime("registerStyles", cmpMeta.$tagName$);
         if (BUILD24.hydrateServerSide && BUILD24.shadowDom) {
           if (cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */) {
@@ -3922,7 +3970,10 @@ var disconnectedCallback = async (elm) => {
 
 // src/runtime/bootstrap-custom-element.ts
 var defineCustomElement = (Cstr, compactMeta) => {
-  customElements.define(compactMeta[1], proxyCustomElement(Cstr, compactMeta));
+  customElements.define(
+    transformTag(compactMeta[1]),
+    proxyCustomElement(Cstr, compactMeta)
+  );
 };
 var proxyCustomElement = (Cstr, compactMeta) => {
   const cmpMeta = {
@@ -3946,7 +3997,7 @@ var proxyCustomElement = (Cstr, compactMeta) => {
   if (BUILD27.shadowDom && !supportsShadow && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
     cmpMeta.$flags$ |= 8 /* needsShadowDomShim */;
   }
-  if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) && cmpMeta.$flags$ & 256 /* hasRenderFn */) {
+  if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) && cmpMeta.$flags$ & 256 /* hasSlot */) {
     if (BUILD27.experimentalSlotFixes) {
       patchPseudoShadowDom(Cstr.prototype);
     } else {
@@ -3963,6 +4014,8 @@ var proxyCustomElement = (Cstr, compactMeta) => {
         patchTextContent(Cstr.prototype);
       }
     }
+  } else if (BUILD27.cloneNodeFix) {
+    patchCloneNode(Cstr.prototype);
   }
   if (BUILD27.hydrateClientSide && BUILD27.shadowDom) {
     hydrateScopedToShadow();
@@ -4113,12 +4166,14 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
       if (BUILD28.shadowDom && !supportsShadow && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
         cmpMeta.$flags$ |= 8 /* needsShadowDomShim */;
       }
-      const tagName = BUILD28.transformTagName && options.transformTagName ? options.transformTagName(cmpMeta.$tagName$) : cmpMeta.$tagName$;
+      const tagName = BUILD28.transformTagName && options.transformTagName ? options.transformTagName(cmpMeta.$tagName$) : transformTag(cmpMeta.$tagName$);
       const HostElement = class extends HTMLElement {
+        ["s-p"];
+        ["s-rc"];
+        hasRegisteredEventListeners = false;
         // StencilLazyHost
         constructor(self) {
           super(self);
-          this.hasRegisteredEventListeners = false;
           self = this;
           registerHost(self, cmpMeta);
           if (BUILD28.shadowDom && cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
@@ -4178,7 +4233,7 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
           return (_a3 = getHostRef(this)) == null ? void 0 : _a3.$onReadyPromise$;
         }
       };
-      if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) && cmpMeta.$flags$ & 256 /* hasRenderFn */) {
+      if (!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) && cmpMeta.$flags$ & 256 /* hasSlot */) {
         if (BUILD28.experimentalSlotFixes) {
           patchPseudoShadowDom(HostElement.prototype);
         } else {
@@ -4195,6 +4250,8 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
             patchTextContent(HostElement.prototype);
           }
         }
+      } else if (BUILD28.cloneNodeFix) {
+        patchCloneNode(HostElement.prototype);
       }
       if (BUILD28.formAssociated && cmpMeta.$flags$ & 64 /* formAssociated */) {
         HostElement.formAssociated = true;
@@ -4215,7 +4272,7 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
     });
   });
   if (cmpTags.length > 0) {
-    if (hasSlotRelocation) {
+    if (BUILD28.slotRelocation && hasSlotRelocation) {
       dataStyles.textContent += SLOT_FB_CSS;
     }
     if (BUILD28.invisiblePrehydration && (BUILD28.hydratedClass || BUILD28.hydratedAttribute)) {
@@ -4331,6 +4388,71 @@ function render(vnode, container) {
   renderVdom(ref, vnode);
 }
 
+// src/runtime/tag-transform.ts
+var tagTransformer = void 0;
+function transformTag(tag) {
+  if (!tagTransformer) return tag;
+  return tagTransformer(tag);
+}
+function setTagTransformer(transformer) {
+  if (tagTransformer) {
+    console.warn(`
+      A tagTransformer has already been set. 
+      Overwriting it may lead to error and unexpected results if your components have already been defined.
+    `);
+  }
+  tagTransformer = transformer;
+}
+
+// src/runtime/vdom/jsx-dev-runtime.ts
+function jsxDEV(type, props, key, _isStaticChildren, _source, _self) {
+  const propsObj = props || {};
+  const { children, ...rest } = propsObj;
+  let vnodeData = rest;
+  if (key !== void 0 && !("key" in rest)) {
+    vnodeData = { ...rest, key };
+  }
+  if (vnodeData && Object.keys(vnodeData).length === 0) {
+    vnodeData = null;
+  }
+  if (children !== void 0) {
+    if (Array.isArray(children)) {
+      return h(type, vnodeData, ...children);
+    }
+    if (typeof children === "object" && children !== null && "$flags$" in children) {
+      return h(type, vnodeData, children);
+    }
+    return h(type, vnodeData, children);
+  }
+  return h(type, vnodeData);
+}
+
+// src/runtime/vdom/jsx-runtime.ts
+function jsx(type, props, key) {
+  const propsObj = props || {};
+  const { children, ...rest } = propsObj;
+  let vnodeData = rest;
+  if (key !== void 0 && !("key" in rest)) {
+    vnodeData = { ...rest, key };
+  }
+  if (vnodeData && Object.keys(vnodeData).length === 0) {
+    vnodeData = null;
+  }
+  if (children !== void 0) {
+    if (Array.isArray(children)) {
+      return h(type, vnodeData, ...children);
+    }
+    if (typeof children === "object" && children !== null && "$flags$" in children) {
+      return h(type, vnodeData, children);
+    }
+    return h(type, vnodeData, children);
+  }
+  return h(type, vnodeData);
+}
+function jsxs(type, props, key) {
+  return jsx(type, props, key);
+}
+
 // src/runtime/vdom/vdom-annotations.ts
 var insertVdomAnnotations = (doc, staticComponents) => {
   if (doc != null) {
@@ -4509,6 +4631,9 @@ export {
   h,
   insertVdomAnnotations,
   isMemberInElement,
+  jsx,
+  jsxDEV,
+  jsxs,
   loadModule,
   modeResolutionChain,
   needsScopedSSR,
@@ -4531,12 +4656,14 @@ export {
   setPlatformHelpers,
   setPlatformOptions,
   setScopedSSR,
+  setTagTransformer,
   setValue,
   styles,
   supportsConstructableStylesheets,
   supportsListenerOptions,
   supportsMutableAdoptedStyleSheets,
   supportsShadow,
+  transformTag,
   win,
   writeTask
 };