@stencil/core 5.0.0-alpha.27 → 5.0.0-alpha.29

package/dist/{client-CvcvHKz4.mjs → client-D1MsT-Rp.mjs}

@@ -1,4 +1,4 @@
-import { B as HOST_FLAGS, G as NODE_TYPES, H as LISTENER_FLAGS, L as EVENT_FLAGS, S as queryNonceMetaTagContent, W as MEMBER_FLAGS, Z as SVG_NS, c as isDef, et as WATCH_FLAGS, s as isComplexType, t as escapeRegExpSpecialCharacters, w as CMP_FLAGS } from "./regular-expression-CFVJOTUh.mjs";
+import { G as MEMBER_FLAGS, K as NODE_TYPES, Q as SVG_NS, R as EVENT_FLAGS, S as queryNonceMetaTagContent, U as LISTENER_FLAGS, V as HOST_FLAGS, c as isDef, s as isComplexType, t as escapeRegExpSpecialCharacters, tt as WATCH_FLAGS, w as CMP_FLAGS } from "./regular-expression-XqU5zmPp.mjs";
 import { effect, effect as effect$1, signal } from "@preact/signals-core";
 //#region src/app-data/index.ts
 /**
@@ -110,94 +110,6 @@ const Build = {
 	isTesting: BUILD.isTesting
 };
 //#endregion
-//#region src/client/client-decorators.ts
-/**
-* Runtime stubs for Stencil decorators.
-*
-* These decorators are compile-time metadata flags that Stencil's compiler parses
-* and transforms. At runtime, they do nothing - the actual component behavior is
-* wired up by the compiled output, not by these decorators.
-*
-* These stubs exist so that:
-* 1. Component classes can be instantiated directly in tests without going through
-*    Stencil's full compilation pipeline
-* 2. The decorators don't throw "X is not a function" errors when used outside
-*    of Stencil's build process
-*/
-/**
-* No-op class decorator stub for @Component()
-* @param _opts - component options (ignored at runtime)
-* @returns a class decorator that returns the target unchanged
-*/
-const Component = (_opts) => (target) => target;
-/**
-* No-op property decorator stub for @Element()
-* @returns a property decorator that does nothing
-*/
-const Element$1 = () => () => {};
-/**
-* No-op property decorator stub for @Event()
-* @param _opts - event options (ignored at runtime)
-* @returns a property decorator that does nothing
-*/
-const Event = (_opts) => () => {};
-/**
-* No-op property decorator stub for @AttachInternals()
-* @param _opts - attach internals options (ignored at runtime)
-* @returns a property decorator that does nothing
-*/
-const AttachInternals = (_opts) => () => {};
-/**
-* No-op method decorator stub for @Listen()
-* @param _eventName - event name to listen for (ignored at runtime)
-* @param _opts - listen options (ignored at runtime)
-* @returns a method decorator that does nothing
-*/
-const Listen = (_eventName, _opts) => () => {};
-/**
-* No-op method decorator stub for @Method()
-* @param _opts - method options (ignored at runtime)
-* @returns a method decorator that does nothing
-*/
-const Method = (_opts) => () => {};
-/**
-* No-op property decorator stub for @Prop()
-* @param _opts - prop options (ignored at runtime)
-* @returns a property decorator that does nothing
-*/
-const Prop = (_opts) => () => {};
-/**
-* No-op property decorator stub for @State()
-* @returns a property decorator that does nothing
-*/
-const State = () => () => {};
-/**
-* No-op method decorator stub for @Watch()
-* @param _propName - property name to watch (ignored at runtime)
-* @param _opts - watch options (ignored at runtime)
-* @returns a method decorator that does nothing
-*/
-const Watch = (_propName, _opts) => () => {};
-/**
-* No-op method decorator stub for @PropSerialize()
-* @param _propName - property name to serialize (ignored at runtime)
-* @returns a method decorator that does nothing
-*/
-const PropSerialize = (_propName) => () => {};
-/**
-* No-op method decorator stub for @AttrDeserialize()
-* @param _propName - property name to deserialize (ignored at runtime)
-* @returns a method decorator that does nothing
-*/
-const AttrDeserialize = (_propName) => () => {};
-/**
-* No-op compile-time utility stub for resolveVar()
-* At runtime, this just returns the string representation of whatever is passed in.
-* @param variable - the variable to resolve
-* @returns the string representation of the variable
-*/
-const resolveVar = (variable) => String(variable);
-//#endregion
 //#region src/utils/get-prop-descriptor.ts
 /**
 * Walks up a prototype chain to find a property descriptor.
@@ -301,8 +213,13 @@ const registerHost = (hostElement, cmpMeta) => {
 	if (BUILD.asyncLoading) {
 		hostRef.$onReadyPromise$ = new Promise((r) => hostRef.$onReadyResolve$ = r);
 		hostElement["s-rp"] = hostRef.$onReadyPromise$;
+		if (!BUILD.lazyLoad) {
+			hostRef.$onFirstConnectPromise$ = new Promise((r) => hostRef.$onFirstConnectResolve$ = r);
+			hostElement["s-fc"] = hostRef.$onFirstConnectPromise$;
+		}
 		if (!hostElement["s-p"]) hostElement["s-p"] = [];
 		if (!hostElement["s-rc"]) hostElement["s-rc"] = [];
+		if (!hostElement["s-pc"]) hostElement["s-pc"] = [];
 	}
 	if (BUILD.lazyLoad) hostRef.$fetchedCbList$ = [];
 	const ref = hostRef;
@@ -321,7 +238,12 @@ const consoleDevWarn = (...m) => console.warn(...STENCIL_DEV_MODE, ...m);
 const setErrorHandler = (handler) => customError = handler;
 //#endregion
 //#region src/client/client-load-module.ts
-const cmpModules = /* @__PURE__ */ new Map();
+const cmpModules = /*@__PURE__*/ new Map();
+/**
+* Tracks how many times a dynamic `import()` for a given lazy bundle has failed.
+* Used to cache bust the retry attempt in connected-callback.ts
+*/
+const failedLoadAttempts = /*@__PURE__*/ new Map();
 /**
 * We need to separate out this prefix so that Esbuild doesn't try to resolve
 * the below, but instead retains a dynamic `import()` statement in the
@@ -348,13 +270,21 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
 	} else if (!bundleId) return;
 	const module = !BUILD.hotModuleReplacement ? cmpModules.get(bundleId) : false;
 	if (module) return module[exportName];
+	const retryCount = failedLoadAttempts.get(bundleId) ?? 0;
+	const cacheBustParams = [retryCount > 0 ? `s-retry=${retryCount}` : "", BUILD.hotModuleReplacement && hmrVersionId ? `s-hmr=${hmrVersionId}` : ""].filter(Boolean).join("&");
 	/*!__STENCIL_STATIC_IMPORT_SWITCH__*/
-	const entryFile = `${bundleId}.entry.js${BUILD.hotModuleReplacement && hmrVersionId ? "?s-hmr=" + hmrVersionId : ""}`;
+	const entryFile = `${bundleId}.entry.js${cacheBustParams ? "?" + cacheBustParams : ""}`;
 	const onLoad = (importedModule) => {
-		if (!BUILD.hotModuleReplacement) cmpModules.set(bundleId, importedModule);
+		if (!BUILD.hotModuleReplacement) {
+			failedLoadAttempts.delete(bundleId);
+			cmpModules.set(bundleId, importedModule);
+		}
 		return importedModule[exportName];
 	};
-	const onError = (e) => consoleError(e, hostRef.$hostElement$);
+	const onError = (e) => {
+		failedLoadAttempts.set(bundleId, retryCount + 1);
+		consoleError(e, hostRef.$hostElement$);
+	};
 	return import(
 		/* @vite-ignore */
 		/* webpackInclude: /\.entry\.js$/ */
@@ -365,7 +295,7 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
 };
 //#endregion
 //#region src/client/client-style.ts
-const styles = /* @__PURE__ */ new Map();
+const styles = /*@__PURE__*/ new Map();
 const modeResolutionChain = [];
 const needsScopedSSR = () => false;
 //#endregion
@@ -433,6 +363,10 @@ const DEFAULT_DOC_DATA = {
 */
 const SLOT_FB_CSS = "slot-fb{display:contents}slot-fb[hidden]{display:none}";
 const XLINK_NS = "http://www.w3.org/1999/xlink";
+/**
+* Minimum delay, in milliseconds, before retrying a failed lazy component load.
+*/
+const LAZY_LOAD_RETRY_INTERVAL_MS = 1e3;
 const FORM_ASSOCIATED_CUSTOM_ELEMENT_CALLBACKS = [
 	"formAssociatedCallback",
 	"formResetCallback",
@@ -455,7 +389,7 @@ const plt = {
 const setPlatformHelpers = (helpers) => {
 	Object.assign(plt, helpers);
 };
-const supportsListenerOptions = /* @__PURE__ */ (() => {
+const supportsListenerOptions = /*@__PURE__*/ (() => {
 	let supported = false;
 	try {
 		win.document?.addEventListener("e", null, Object.defineProperty({}, "passive", { get() {
@@ -465,14 +399,14 @@ const supportsListenerOptions = /* @__PURE__ */ (() => {
 	return supported;
 })();
 const promiseResolve = (v) => Promise.resolve(v);
-const supportsConstructableStylesheets = BUILD.constructableCSS ? /* @__PURE__ */ (() => {
+const supportsConstructableStylesheets = BUILD.constructableCSS ? /*@__PURE__*/ (() => {
 	try {
 		if (!win.document.adoptedStyleSheets) return false;
 		return typeof new CSSStyleSheet().replaceSync === "function";
 	} catch {}
 	return false;
 })() : false;
-const supportsMutableAdoptedStyleSheets = supportsConstructableStylesheets ? /* @__PURE__ */ (() => !!win.document && Object.getOwnPropertyDescriptor(win.document.adoptedStyleSheets, "length").writable)() : false;
+const supportsMutableAdoptedStyleSheets = supportsConstructableStylesheets ? /*@__PURE__*/ (() => !!win.document && Object.getOwnPropertyDescriptor(win.document.adoptedStyleSheets, "length").writable)() : false;
 //#endregion
 //#region src/client/client-task-queue.ts
 let queueCongestion = 0;
@@ -480,12 +414,13 @@ let queuePending = false;
 const queueDomReads = [];
 const queueDomWrites = [];
 const queueDomWritesLow = [];
+const scheduleFlush = () => win.document?.hidden ? nextTick(flush) : plt.raf(flush);
 const queueTask = (queue, write) => (cb) => {
 	queue.push(cb);
 	if (!queuePending) {
 		queuePending = true;
 		if (write && plt.$flags$ & PLATFORM_FLAGS.queueSync) nextTick(flush);
-		else plt.raf(flush);
+		else scheduleFlush();
 	}
 };
 const consume = (queue) => {
@@ -518,16 +453,16 @@ const flush = () => {
 			queueDomWritesLow.push(...queueDomWrites);
 			queueDomWrites.length = 0;
 		}
-		if (queuePending = queueDomReads.length + queueDomWrites.length + queueDomWritesLow.length > 0) plt.raf(flush);
+		if (queuePending = queueDomReads.length + queueDomWrites.length + queueDomWritesLow.length > 0) scheduleFlush();
 		else queueCongestion = 0;
 	} else {
 		consume(queueDomWrites);
-		if (queuePending = queueDomReads.length > 0) plt.raf(flush);
+		if (queuePending = queueDomReads.length > 0) scheduleFlush();
 	}
 };
 const nextTick = (cb) => promiseResolve().then(cb);
-const readTask = /* @__PURE__ */ queueTask(queueDomReads, false);
-const writeTask = /* @__PURE__ */ queueTask(queueDomWrites, true);
+const readTask = /*@__PURE__*/ queueTask(queueDomReads, false);
+const writeTask = /*@__PURE__*/ queueTask(queueDomWrites, true);
 //#endregion
 //#region src/runtime/asset-path.ts
 const getAssetPath = (path) => {
@@ -566,8 +501,10 @@ function createShadowRoot(cmpMeta) {
 	const shadowRoot = this.attachShadow(opts);
 	if (BUILD.shadowModeClosed && isClosed) this.__shadowRoot = shadowRoot;
 	if (globalStyleSheet === void 0) globalStyleSheet = createStyleSheetIfNeededAndSupported("") ?? null;
-	if (globalStyleSheet) if (supportsMutableAdoptedStyleSheets) shadowRoot.adoptedStyleSheets.push(globalStyleSheet);
-	else shadowRoot.adoptedStyleSheets = [...shadowRoot.adoptedStyleSheets, globalStyleSheet];
+	if (globalStyleSheet) {
+		if (supportsMutableAdoptedStyleSheets) shadowRoot.adoptedStyleSheets.push(globalStyleSheet);
+		else shadowRoot.adoptedStyleSheets = [...shadowRoot.adoptedStyleSheets, globalStyleSheet];
+	}
 }
 //#endregion
 //#region src/runtime/slot-polyfill-utils.ts
@@ -587,8 +524,10 @@ function createShadowRoot(cmpMeta) {
 const updateFallbackSlotVisibility = (elm) => {
 	const childNodes = internalCall(elm, "childNodes");
 	if (elm.tagName && elm.tagName.includes("-") && elm["s-cr"] && elm.tagName !== "SLOT-FB") getHostSlotNodes(childNodes, elm.tagName).forEach((slotNode) => {
-		if (slotNode.nodeType === NODE_TYPE.ElementNode && slotNode.tagName === "SLOT-FB") if (getSlotChildSiblings(slotNode, getSlotName(slotNode), false).length) slotNode.hidden = true;
-		else slotNode.hidden = false;
+		if (slotNode.nodeType === NODE_TYPE.ElementNode && slotNode.tagName === "SLOT-FB") {
+			if (getSlotChildSiblings(slotNode, getSlotName(slotNode), false).length) slotNode.hidden = true;
+			else slotNode.hidden = false;
+		}
 	});
 	let i = 0;
 	for (i = 0; i < childNodes.length; i++) {
@@ -631,7 +570,7 @@ function getHostSlotNodes(childNodes, hostName, slotName) {
 			slottedNodes.push(childNode);
 			if (typeof slotName !== "undefined") return slottedNodes;
 		}
-		slottedNodes = [...slottedNodes, ...getHostSlotNodes(childNode.childNodes, hostName, slotName)];
+		slottedNodes = [...slottedNodes, ...getHostSlotNodes(internalCall(childNode, "childNodes"), hostName, slotName)];
 	}
 	return slottedNodes;
 }
@@ -662,7 +601,7 @@ const isNodeLocatedInSlot = (nodeToRelocate, slotName) => {
 		if (nodeToRelocate.getAttribute("slot") === slotName) return true;
 		return false;
 	}
-	if (nodeToRelocate["s-sn"] === slotName) return true;
+	if (typeof nodeToRelocate["s-sa"] === "string") return nodeToRelocate["s-sa"] === slotName;
 	return slotName === "";
 };
 /**
@@ -711,8 +650,10 @@ function patchSlotNode(node) {
 	const assignedFactory = (elementsOnly) => function(opts) {
 		const toReturn = [];
 		const slotName = this["s-sn"];
-		if (opts?.flatten) if (BUILD.isDev) console.error("Flattening is not supported for Stencil non-shadow slots. You can use `.childNodes` for nested slot fallback content.");
-		else console.error("Flattening not supported for Stencil non-shadow slots");
+		if (opts?.flatten) {
+			if (BUILD.isDev) console.error("Flattening is not supported for Stencil non-shadow slots. You can use `.childNodes` for nested slot fallback content.");
+			else console.error("Flattening not supported for Stencil non-shadow slots");
+		}
 		const parent = this["s-cr"].parentElement;
 		(parent.__childNodes ? parent.childNodes : getSlottedChildNodes(parent.childNodes)).forEach((n) => {
 			if (slotName === getSlotName(n)) toReturn.push(n);
@@ -803,8 +744,10 @@ const patchCloneNode = (HostElementPrototype) => {
 			for (; i < childNodes.length; i++) {
 				slotted = childNodes[i]["s-nr"];
 				nonStencilNode = stencilPrivates.every((privateField) => !childNodes[i][privateField]);
-				if (slotted) if (clonedNode.__appendChild) clonedNode.__appendChild(slotted.cloneNode(true));
-				else clonedNode.appendChild(slotted.cloneNode(true));
+				if (slotted) {
+					if (clonedNode.__appendChild) clonedNode.__appendChild(slotted.cloneNode(true));
+					else clonedNode.appendChild(slotted.cloneNode(true));
+				}
 				if (nonStencilNode) clonedNode.appendChild(childNodes[i].cloneNode(true));
 			}
 		}
@@ -1007,11 +950,11 @@ const patchChildSlotNodes = (elm) => {
 	} });
 	patchHostOriginalAccessor("firstChild", elm);
 	Object.defineProperty(elm, "firstChild", { get() {
-		return this.childNodes[0];
+		return this.childNodes[0] || null;
 	} });
 	patchHostOriginalAccessor("lastChild", elm);
 	Object.defineProperty(elm, "lastChild", { get() {
-		return this.childNodes[this.childNodes.length - 1];
+		return this.childNodes[this.childNodes.length - 1] || null;
 	} });
 	patchHostOriginalAccessor("childNodes", elm);
 	Object.defineProperty(elm, "childNodes", { get() {
@@ -1057,7 +1000,7 @@ const patchNextSibling = (node) => {
 	Object.defineProperty(node, "nextSibling", { get: function() {
 		const parentNodes = this["s-ol"]?.parentNode.childNodes;
 		const index = parentNodes?.indexOf(this);
-		if (parentNodes && index > -1) return parentNodes[index + 1];
+		if (parentNodes && index > -1) return parentNodes[index + 1] || null;
 		return this.__nextSibling;
 	} });
 };
@@ -1072,7 +1015,7 @@ const patchNextElementSibling = (element) => {
 	Object.defineProperty(element, "nextElementSibling", { get: function() {
 		const parentEles = this["s-ol"]?.parentNode.children;
 		const index = parentEles?.indexOf(this);
-		if (parentEles && index > -1) return parentEles[index + 1];
+		if (parentEles && index > -1) return parentEles[index + 1] || null;
 		return this.__nextElementSibling;
 	} });
 };
@@ -1087,7 +1030,7 @@ const patchPreviousSibling = (node) => {
 	Object.defineProperty(node, "previousSibling", { get: function() {
 		const parentNodes = this["s-ol"]?.parentNode.childNodes;
 		const index = parentNodes?.indexOf(this);
-		if (parentNodes && index > -1) return parentNodes[index - 1];
+		if (parentNodes && index > -1) return parentNodes[index - 1] || null;
 		return this.__previousSibling;
 	} });
 };
@@ -1102,7 +1045,7 @@ const patchPreviousElementSibling = (element) => {
 	Object.defineProperty(element, "previousElementSibling", { get: function() {
 		const parentNodes = this["s-ol"]?.parentNode.children;
 		const index = parentNodes?.indexOf(this);
-		if (parentNodes && index > -1) return parentNodes[index - 1];
+		if (parentNodes && index > -1) return parentNodes[index - 1] || null;
 		return this.__previousElementSibling;
 	} });
 };
@@ -1264,7 +1207,7 @@ const installDevTools = () => {
 };
 //#endregion
 //#region src/runtime/styles.ts
-const rootAppliedStyles = /* @__PURE__ */ new WeakMap();
+const rootAppliedStyles = /*@__PURE__*/ new WeakMap();
 /**
 * Get or initialize the set of applied style scope IDs for a container element.
 *
@@ -1288,9 +1231,10 @@ const getAppliedStyles = (container) => {
 * @param prepend if true, add to beginning; if false, add to end
 */
 const adoptStylesheet = (container, sheet, prepend = false) => {
-	if (supportsMutableAdoptedStyleSheets) if (prepend) container.adoptedStyleSheets.unshift(sheet);
-	else container.adoptedStyleSheets.push(sheet);
-	else if (prepend) container.adoptedStyleSheets = [sheet, ...container.adoptedStyleSheets];
+	if (supportsMutableAdoptedStyleSheets) {
+		if (prepend) container.adoptedStyleSheets.unshift(sheet);
+		else container.adoptedStyleSheets.push(sheet);
+	} else if (prepend) container.adoptedStyleSheets = [sheet, ...container.adoptedStyleSheets];
 	else container.adoptedStyleSheets = [...container.adoptedStyleSheets, sheet];
 };
 /**
@@ -1303,7 +1247,7 @@ const adoptStylesheet = (container, sheet, prepend = false) => {
 * @returns a new CSSStyleSheet for the correct window
 */
 const createStylesheetForWindow = (container, cssText) => {
-	const sheet = new (container.defaultView ?? container.ownerDocument?.defaultView ?? win).CSSStyleSheet();
+	const sheet = new (container.defaultView ?? (container.ownerDocument?.defaultView) ?? win).CSSStyleSheet();
 	sheet.replaceSync(cssText);
 	return sheet;
 };
@@ -1374,41 +1318,46 @@ const addStyle = (styleContainerNode, cmpMeta, mode) => {
 				/**
 				* attach styles at the end of the head tag if we render scoped components
 				*/
-				if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation)) if (styleContainerNode.nodeName === "HEAD") {
-					/**
-					* if the page contains preconnect links, we want to insert the styles
-					* after the last preconnect link to ensure the styles are preloaded
-					*/
-					const preconnectLinks = styleContainerNode.querySelectorAll("link[rel=preconnect]");
-					const referenceNode = preconnectLinks.length > 0 ? preconnectLinks[preconnectLinks.length - 1].nextSibling : styleContainerNode.querySelector("style");
-					styleContainerNode.insertBefore(styleElm, referenceNode?.parentNode === styleContainerNode ? referenceNode : null);
-				} else if ("host" in styleContainerNode) if (supportsConstructableStylesheets) {
-					const stylesheet = createStylesheetForWindow(styleContainerNode, style);
-					adoptStylesheet(styleContainerNode, stylesheet, true);
-				} else {
-					/**
-					* If a scoped component is used within a shadow root and constructable stylesheets are
-					* not supported, we want to insert the styles at the beginning of the shadow root node.
-					*
-					* However, if there is already a style node in the shadow root, we just append
-					* the styles to the existing node.
-					*
-					* Note: order of how styles are applied is important. The new style node
-					* should be inserted before the existing style node.
-					*
-					* During HMR, create separate style elements for scoped components so they can be
-					* updated independently without affecting other components' styles.
-					*/
-					const existingStyleContainer = styleContainerNode.querySelector("style");
-					if (existingStyleContainer && !BUILD.hotModuleReplacement) existingStyleContainer.textContent = style + existingStyleContainer.textContent;
-					else styleContainerNode.prepend(styleElm);
+				if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation)) {
+					if (styleContainerNode.nodeName === "HEAD") {
+						/**
+						* if the page contains preconnect links, we want to insert the styles
+						* after the last preconnect link to ensure the styles are preloaded
+						*/
+						const preconnectLinks = styleContainerNode.querySelectorAll("link[rel=preconnect]");
+						const referenceNode = preconnectLinks.length > 0 ? preconnectLinks[preconnectLinks.length - 1].nextSibling : styleContainerNode.querySelector("style");
+						styleContainerNode.insertBefore(styleElm, referenceNode?.parentNode === styleContainerNode ? referenceNode : null);
+					} else if ("host" in styleContainerNode) {
+						if (supportsConstructableStylesheets) {
+							const stylesheet = createStylesheetForWindow(styleContainerNode, style);
+							adoptStylesheet(styleContainerNode, stylesheet, true);
+						} else {
+							/**
+							* If a scoped component is used within a shadow root and constructable stylesheets are
+							* not supported, we want to insert the styles at the beginning of the shadow root node.
+							*
+							* However, if there is already a style node in the shadow root, we just append
+							* the styles to the existing node.
+							*
+							* Note: order of how styles are applied is important. The new style node
+							* should be inserted before the existing style node.
+							*
+							* During HMR, create separate style elements for scoped components so they can be
+							* updated independently without affecting other components' styles.
+							*/
+							const existingStyleContainer = styleContainerNode.querySelector("style");
+							if (existingStyleContainer && !BUILD.hotModuleReplacement) existingStyleContainer.textContent = style + existingStyleContainer.textContent;
+							else styleContainerNode.prepend(styleElm);
+						}
+					} else styleContainerNode.append(styleElm);
 				}
-				else styleContainerNode.append(styleElm);
 				/**
 				* attach styles at the beginning of a shadow root node if we render shadow components
 				*/
-				if (cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) if (isClosedShadowSSR) styleContainerNode.prepend(styleElm);
-				else styleContainerNode.insertBefore(styleElm, null);
+				if (cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) {
+					if (isClosedShadowSSR) styleContainerNode.prepend(styleElm);
+					else styleContainerNode.insertBefore(styleElm, null);
+				}
 				if (appliedStyles) appliedStyles.add(scopeId);
 			}
 		} else if (BUILD.constructableCSS) {
@@ -1611,11 +1560,15 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialR
 		}
 	} else if (BUILD.vdomStyle && memberName === "style") {
 		if (BUILD.updatable) {
-			for (const prop in oldValue) if (!newValue || newValue[prop] == null) if (!BUILD.hydrateServerSide && prop.includes("-")) elm.style.removeProperty(prop);
-			else elm.style[prop] = "";
+			for (const prop in oldValue) if (!newValue || newValue[prop] == null) {
+				if (!BUILD.hydrateServerSide && prop.includes("-")) elm.style.removeProperty(prop);
+				else elm.style[prop] = "";
+			}
+		}
+		for (const prop in newValue) if (!oldValue || newValue[prop] !== oldValue[prop]) {
+			if (!BUILD.hydrateServerSide && prop.includes("-")) elm.style.setProperty(prop, newValue[prop]);
+			else elm.style[prop] = newValue[prop];
 		}
-		for (const prop in newValue) if (!oldValue || newValue[prop] !== oldValue[prop]) if (!BUILD.hydrateServerSide && prop.includes("-")) elm.style.setProperty(prop, newValue[prop]);
-		else elm.style[prop] = newValue[prop];
 	} else if (BUILD.vdomKey && memberName === "key") {} else if (BUILD.vdomRef && memberName === "ref") {
 		if (newValue) queueRefAttachment(newValue, elm);
 	} else if (BUILD.vdomListener && (BUILD.lazyLoad ? !isProp : !elm.__lookupSetter__(memberName)) && memberName[0] === "o" && memberName[1] === "n") {
@@ -1624,7 +1577,7 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialR
 		else memberName = ln[2] + memberName.slice(3);
 		if (oldValue || newValue) {
 			const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
-			memberName = memberName.replace(/* @__PURE__ */ new RegExp(CAPTURE_EVENT_SUFFIX + "$"), "");
+			memberName = memberName.replace(/*@__PURE__*/ new RegExp(CAPTURE_EVENT_SUFFIX + "$"), "");
 			if (oldValue) plt.rel(elm, memberName, oldValue, capture);
 			if (newValue) plt.ael(elm, memberName, newValue, capture);
 		}
@@ -1663,8 +1616,10 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialR
 			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 (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 {}
 		/**
@@ -1682,8 +1637,10 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialR
 			}
 		}
 		if (newValue == null || newValue === false) {
-			if (newValue !== false || elm.getAttribute(memberName) === "") if (BUILD.vdomXlink && xlink) elm.removeAttributeNS(XLINK_NS, memberName);
-			else elm.removeAttribute(memberName);
+			if (newValue !== false || elm.getAttribute(memberName) === "") {
+				if (BUILD.vdomXlink && xlink) elm.removeAttributeNS(XLINK_NS, memberName);
+				else elm.removeAttribute(memberName);
+			}
 		} else if ((!isProp || flags & VNODE_FLAGS.isHost || isSvg) && !isComplex && elm.nodeType === NODE_TYPE.ElementNode) {
 			newValue = newValue === true ? "" : newValue;
 			if (BUILD.vdomXlink && xlink) elm.setAttributeNS(XLINK_NS, memberName, newValue);
@@ -1814,6 +1771,7 @@ const createElm = (oldParentVNode, newParentVNode, childIndex) => {
 		}
 	} else if (BUILD.slotRelocation && newVNode.$flags$ & VNODE_FLAGS.isSlotReference) {
 		elm = newVNode.$elm$ = BUILD.isDebug || BUILD.hydrateServerSide ? slotReferenceDebugNode(newVNode) : win.document.createTextNode("");
+		if (typeof newVNode.$attrs$?.slot === "string") elm["s-sa"] = newVNode.$attrs$.slot;
 		if (BUILD.vdomAttribute) updateElement(null, newVNode, isSvgMode);
 	} else {
 		if (BUILD.svg && !isSvgMode) isSvgMode = newVNode.$tag$ === "svg";
@@ -2089,8 +2047,10 @@ const updateChildren = (parentElm, oldCh, newVNode, newCh, isInitialRender = fal
 			node = createElm(oldCh && oldCh[newStartIdx], newVNode, newStartIdx);
 			newStartVnode = newCh[++newStartIdx];
 		}
-		if (node) if (BUILD.slotRelocation) insertBefore(referenceNode(oldStartVnode.$elm$).parentNode, node, referenceNode(oldStartVnode.$elm$));
-		else insertBefore(oldStartVnode.$elm$.parentNode, node, oldStartVnode.$elm$);
+		if (node) {
+			if (BUILD.slotRelocation) insertBefore(referenceNode(oldStartVnode.$elm$).parentNode, node, referenceNode(oldStartVnode.$elm$));
+			else insertBefore(oldStartVnode.$elm$.parentNode, node, oldStartVnode.$elm$);
+		}
 	}
 	if (oldStartIdx > oldEndIdx) addVnodes(parentElm, newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].$elm$, newVNode, newCh, newStartIdx, newEndIdx);
 	else if (BUILD.updatable && newStartIdx > newEndIdx) removeVnodes(oldCh, oldStartIdx, oldEndIdx);
@@ -2177,6 +2137,30 @@ const patch = (oldVNode, newVNode, isInitialRender = false) => {
 */
 const relocateNodes = [];
 /**
+* When a forwarded `<slot>` gets relocated, drag along any content already forwarded through it,
+* to wherever it just landed (or nowhere, to be hidden, if it didn't match anything).
+*
+* Runs as its own pass after {@link markSlotContentForRelocation} rather than inside it, so that
+* function's matching order - which hydration's node/comment ordering depends on - is untouched.
+*/
+const carryContentWithRelocatedSlotRefs = () => {
+	for (const relocateData of relocateNodes.slice()) {
+		const marker = relocateData.$nodeToRelocate$;
+		if (!marker["s-sr"]) continue;
+		const carriedSiblings = getSlotChildSiblings(marker, marker["s-sn"] || "", false);
+		for (const carriedSibling of carriedSiblings) {
+			if (!carriedSibling["s-ol"]) continue;
+			let siblingRelocateData = relocateNodes.find((r) => r.$nodeToRelocate$ === carriedSibling);
+			if (!siblingRelocateData) {
+				siblingRelocateData = { $nodeToRelocate$: carriedSibling };
+				relocateNodes.push(siblingRelocateData);
+			}
+			siblingRelocateData.$slotRefNode$ = relocateData.$slotRefNode$;
+			if (relocateData.$slotRefNode$) carriedSibling["s-sh"] = relocateData.$slotRefNode$["s-hn"];
+		}
+	}
+};
+/**
 * Mark the contents of a slot for relocation via adding references to them to
 * the {@link relocateNodes} data structure. The actual work of relocating them
 * will then be handled in {@link renderVdom}.
@@ -2375,6 +2359,7 @@ render() {
 		plt.$flags$ |= PLATFORM_FLAGS.isTmpDisconnected;
 		if (checkSlotRelocate) {
 			markSlotContentForRelocation(rootVnode.$elm$);
+			carryContentWithRelocatedSlotRefs();
 			for (const relocateData of relocateNodes) {
 				const nodeToRelocate = relocateData.$nodeToRelocate$;
 				if (!nodeToRelocate["s-ol"] && win.document) {
@@ -2434,7 +2419,7 @@ render() {
 	}
 	if (BUILD.slotRelocation && !useNativeShadowDom && !(cmpMeta.$flags$ & CMP_FLAGS.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"]) {
+		for (const childNode of children) if (childNode["s-hn"] !== hostTagName && childNode["s-sh"] !== hostTagName) {
 			if (isInitialLoad && childNode["s-ih"] == null) childNode["s-ih"] = childNode.hidden ?? false;
 			if (childNode.nodeType === NODE_TYPE.ElementNode) childNode.hidden = true;
 			else if (childNode.nodeType === NODE_TYPE.TextNode && !!childNode.nodeValue.trim()) {
@@ -2452,16 +2437,58 @@ const slotReferenceDebugNode = (slotVNode) => win.document?.createComment(`<slot
 const originalLocationDebugNode = (nodeToRelocate) => win.document?.createComment(`org-location for ` + (nodeToRelocate.localName ? `<${nodeToRelocate.localName}> (host=${nodeToRelocate["s-hn"]})` : `[${nodeToRelocate.textContent}]`));
 //#endregion
 //#region src/runtime/update-component.ts
+/**
+* Get a promise that resolves once `hostRef`'s real `connectedCallback` has fired for the first time.
+*
+* @param hostRef the component's host reference
+* @returns a promise that resolves once the component's real `connectedCallback` has fired
+*/
+const ensureFirstConnectPromise = (hostRef) => {
+	if (!hostRef.$onFirstConnectPromise$) hostRef.$onFirstConnectPromise$ = new Promise((r) => hostRef.$onFirstConnectResolve$ = r);
+	return hostRef.$onFirstConnectPromise$;
+};
+/**
+* Resolve `hostRef`'s first-connect promise and flag it connected. Called once this
+* component's real `connectedCallback` fires, plus from error/disconnect cleanup so a
+* component that never connects can't hang an ancestor or descendant forever.
+*
+* @param hostRef the component's host reference
+*/
+const markFirstConnected = (hostRef) => {
+	hostRef.$flags$ |= HOST_FLAGS.hasFiredConnected;
+	hostRef.$onFirstConnectResolve$?.();
+	hostRef.$onFirstConnectResolve$ = void 0;
+};
+/**
+* Wait for `ancestorElm` to be defined and its real `connectedCallback` to have completed.
+* Shared by the lazy ({@link initializeComponent}) and standalone (`bootstrap-standalone.ts`)
+* `connectedCallback` paths so a component never connects before its nearest Stencil
+* ancestor, regardless of load order. Both call sites already check `BUILD.asyncLoading` and
+* that an ancestor exists before calling this. Lazy's proxy classes are always pre-defined,
+* so the `whenDefined` wait is a no-op there - it only does real work for standalone's
+* autoloader, where the ancestor tag may not be defined yet.
+*
+* @param ancestorElm the nearest Stencil ancestor element
+*/
+const awaitAncestorConnected = async (ancestorElm) => {
+	let ancestorHostRef = getHostRef(ancestorElm);
+	if (!BUILD.lazyLoad && !ancestorHostRef) {
+		await getRegistry().whenDefined(ancestorElm.tagName.toLowerCase());
+		ancestorHostRef = getHostRef(ancestorElm);
+	}
+	if (ancestorHostRef && !(ancestorHostRef.$flags$ & HOST_FLAGS.hasFiredConnected)) await ensureFirstConnectPromise(ancestorHostRef);
+};
 const attachToAncestor = (hostRef, ancestorComponent) => {
 	if (BUILD.asyncLoading && ancestorComponent && !hostRef.$onRenderResolve$ && ancestorComponent["s-p"]) {
 		const index = ancestorComponent["s-p"].push(new Promise((r) => hostRef.$onRenderResolve$ = () => {
 			ancestorComponent["s-p"].splice(index - 1, 1);
 			r();
 		}));
+		if (ancestorComponent["s-pc"]) ancestorComponent["s-pc"].push(ensureFirstConnectPromise(hostRef));
 	}
 };
 const scheduleUpdate = (hostRef, isInitialLoad) => {
-	if (BUILD.taskQueue && BUILD.updatable) hostRef.$flags$ |= HOST_FLAGS.isQueuedForUpdate;
+	if (BUILD.updatable) hostRef.$flags$ |= HOST_FLAGS.isQueuedForUpdate;
 	if (BUILD.asyncLoading && hostRef.$flags$ & HOST_FLAGS.isWaitingForChildren) {
 		hostRef.$flags$ |= HOST_FLAGS.needsRerender;
 		return;
@@ -2469,6 +2496,8 @@ const scheduleUpdate = (hostRef, isInitialLoad) => {
 	attachToAncestor(hostRef, hostRef.$ancestorComponent$);
 	const dispatch = () => dispatchHooks(hostRef, isInitialLoad);
 	if (isInitialLoad) {
+		const pendingConnects = BUILD.asyncLoading ? hostRef.$hostElement$["s-pc"] : void 0;
+		if (pendingConnects && pendingConnects.length > 0) return Promise.all(pendingConnects).then(dispatch).catch(dispatch);
 		queueMicrotask(() => {
 			dispatch();
 		});
@@ -2508,10 +2537,6 @@ const dispatchHooks = (hostRef, isInitialLoad) => {
 	let maybePromise;
 	if (isInitialLoad) {
 		if (BUILD.lazyLoad) {
-			if (BUILD.slotRelocation && hostRef.$deferredConnectedCallback$) {
-				hostRef.$deferredConnectedCallback$ = false;
-				safeCall(instance, "connectedCallback", void 0, elm);
-			}
 			if (BUILD.hostListener) {
 				hostRef.$flags$ |= HOST_FLAGS.isListenReady;
 				if (hostRef.$queuedListeners$) {
@@ -2524,6 +2549,14 @@ const dispatchHooks = (hostRef, isInitialLoad) => {
 		if (BUILD.lifecycleDOMEvents) emitLifecycleEvent(elm, "componentWillLoad");
 		maybePromise = safeCall(instance, "componentWillLoad", void 0, elm);
 	} else {
+		if (BUILD.updatable && hostRef.$queuedPropChanges$) {
+			const changes = hostRef.$queuedPropChanges$;
+			hostRef.$queuedPropChanges$ = void 0;
+			if (safeCall(instance, "componentShouldUpdate", changes, elm) === false) {
+				hostRef.$flags$ &= ~HOST_FLAGS.isQueuedForUpdate;
+				return;
+			}
+		}
 		if (BUILD.lifecycleDOMEvents) emitLifecycleEvent(elm, "componentWillUpdate");
 		maybePromise = safeCall(instance, "componentWillUpdate", void 0, elm);
 	}
@@ -2638,7 +2671,6 @@ let renderingRef = null;
 const callRender = (hostRef, instance, elm, isInitialLoad) => {
 	const allRenderFn = !!BUILD.allRenderFn;
 	const lazyLoad = !!BUILD.lazyLoad;
-	const taskQueue = !!BUILD.taskQueue;
 	const updatable = !!BUILD.updatable;
 	try {
 		renderingRef = instance;
@@ -2647,14 +2679,17 @@ const callRender = (hostRef, instance, elm, isInitialLoad) => {
 		* method, so we can call the method immediately. If not, check before calling it.
 		*/
 		instance = allRenderFn ? instance.render() : instance.render && instance.render();
-		if (updatable && taskQueue) hostRef.$flags$ &= ~HOST_FLAGS.isQueuedForUpdate;
+		if (updatable) hostRef.$flags$ &= ~HOST_FLAGS.isQueuedForUpdate;
 		if (updatable || lazyLoad) hostRef.$flags$ |= HOST_FLAGS.hasRendered;
-		if (BUILD.hasRenderFn || BUILD.reflect) if (BUILD.vdomRender || BUILD.reflect) if (BUILD.hydrateServerSide) return Promise.resolve(instance).then((value) => renderVdom(hostRef, value, isInitialLoad));
-		else renderVdom(hostRef, instance, isInitialLoad);
-		else {
-			const shadowRoot = elm.shadowRoot;
-			if (hostRef.$cmpMeta$.$flags$ & CMP_FLAGS.shadowDomEncapsulation) shadowRoot.textContent = instance;
-			else elm.textContent = instance;
+		if (BUILD.hasRenderFn || BUILD.reflect) {
+			if (BUILD.vdomRender || BUILD.reflect) {
+				if (BUILD.hydrateServerSide) return Promise.resolve(instance).then((value) => renderVdom(hostRef, value, isInitialLoad));
+				else renderVdom(hostRef, instance, isInitialLoad);
+			} else {
+				const shadowRoot = elm.shadowRoot;
+				if (hostRef.$cmpMeta$.$flags$ & CMP_FLAGS.shadowDomEncapsulation) shadowRoot.textContent = instance;
+				else elm.textContent = instance;
+			}
 		}
 	} catch (e) {
 		consoleError(e, hostRef.$hostElement$);
@@ -2794,17 +2829,19 @@ const initializeSignals = (elm, hostRef, cmpMeta) => {
 	const instance = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
 	for (const [memberName, [memberFlags]] of Object.entries(cmpMeta.$members$ ?? {})) {
 		if (!(memberFlags & MEMBER_FLAGS.PropLike)) continue;
-		const sig = signal(hostRef.$instanceValues$.get(memberName));
+		const initialVal = hostRef.$instanceValues$.get(memberName);
+		const sig = signal(initialVal);
 		hostRef.$signalValues$.set(memberName, sig);
 		let prevScheduleVal = sig.peek();
 		disposers.push(effect(() => {
 			const newVal = sig.value;
 			if (hostRef.$flags$ & HOST_FLAGS.hasRendered) {
 				if (instance?.componentShouldUpdate) {
-					if (instance.componentShouldUpdate(newVal, prevScheduleVal, memberName) === false && !(hostRef.$flags$ & HOST_FLAGS.isQueuedForUpdate)) {
-						prevScheduleVal = newVal;
-						return;
-					}
+					const changes = hostRef.$queuedPropChanges$ ||= {};
+					changes[memberName] = {
+						newVal,
+						oldVal: changes[memberName]?.oldVal ?? prevScheduleVal
+					};
 				}
 				if (!(hostRef.$flags$ & HOST_FLAGS.isQueuedForUpdate)) scheduleUpdate(hostRef, false);
 			}
@@ -2839,7 +2876,8 @@ const initializeSignals = (elm, hostRef, cmpMeta) => {
 			consoleError(e, elm);
 		}
 	}));
-	elm[STENCIL_SIGNALS_SYMBOL] = new Map([...hostRef.$signalValues$].filter(([k]) => (cmpMeta.$members$?.[k]?.[0] ?? 0) & MEMBER_FLAGS.Prop));
+	const publicSignals = new Map([...hostRef.$signalValues$].filter(([k]) => (cmpMeta.$members$?.[k]?.[0] ?? 0) & MEMBER_FLAGS.Prop));
+	elm[STENCIL_SIGNALS_SYMBOL] = publicSignals;
 	hostRef.$signalCleanup$ = () => {
 		disposers.forEach((d) => d());
 		elm[STENCIL_SIGNALS_SYMBOL] = void 0;
@@ -2888,19 +2926,25 @@ const h = (nodeName, vnodeData, ...children) => {
 		for (let i = 0; i < c.length; i++) {
 			child = c[i];
 			if (Array.isArray(child)) walk(child);
-			else if (child != null && typeof child !== "boolean") if (BUILD.vdomSignals && isSignalLike(child)) {
-				const sigVNode = newVNode(null, String(child.peek()));
-				sigVNode.$signal$ = child;
-				vNodeChildren.push(sigVNode);
-				lastSimple = false;
-			} else {
-				if (simple = typeof nodeName !== "function" && !isComplexType(child)) child = String(child);
-				else if (BUILD.isDev && typeof nodeName !== "function" && child.$flags$ === void 0) consoleDevError(`vNode passed as children has unexpected type.
-Make sure it's using the correct h() function.
-Empty objects can also be the cause, look for JSX comments that became objects.`);
-				if (simple && lastSimple) vNodeChildren[vNodeChildren.length - 1].$text$ += child;
-				else vNodeChildren.push(simple ? newVNode(null, child) : child);
-				lastSimple = simple;
+			else if (child != null && typeof child !== "boolean") {
+				if (BUILD.vdomSignals && isSignalLike(child)) {
+					const sigVNode = newVNode(null, String(child.peek()));
+					sigVNode.$signal$ = child;
+					vNodeChildren.push(sigVNode);
+					lastSimple = false;
+				} else {
+					if (simple = typeof nodeName !== "function" && !isComplexType(child)) child = String(child);
+					else if (typeof nodeName !== "function" && child.$flags$ === void 0) {
+						if (BUILD.isDev) consoleDevError(`vNode passed as children has unexpected type.
+  Make sure it's using the correct h() function.
+  Empty objects can also be the cause, look for JSX comments that became objects.`);
+						else consoleError("Invalid vNode child");
+						continue;
+					}
+					if (simple && lastSimple) vNodeChildren[vNodeChildren.length - 1].$text$ += child;
+					else vNodeChildren.push(simple ? newVNode(null, child) : child);
+					lastSimple = simple;
+				}
 			}
 		}
 	};
@@ -3874,14 +3918,15 @@ const parsePropertyValue = (propValue, propType, isFormAssociated) => {
 		/**
 		* ensure this value is of the correct prop type
 		*/
-		if (BUILD.propBoolean && propType & MEMBER_FLAGS.Boolean)
- /**
-		* For form-associated components, according to HTML spec, the presence of any boolean attribute
-		* (regardless of its value, even "false") should make the property true.
-		* For non-form-associated components, we maintain the legacy behavior where "false" becomes false.
-		*/
-		if (BUILD.formAssociated && isFormAssociated && typeof propValue === "string") return propValue === "" || !!propValue;
-		else return propValue === "false" ? false : propValue === "" || !!propValue;
+		if (BUILD.propBoolean && propType & MEMBER_FLAGS.Boolean) {
+			/**
+			* For form-associated components, according to HTML spec, the presence of any boolean attribute
+			* (regardless of its value, even "false") should make the property true.
+			* For non-form-associated components, we maintain the legacy behavior where "false" becomes false.
+			*/
+			if (BUILD.formAssociated && isFormAssociated && typeof propValue === "string") return propValue === "" || !!propValue;
+			else return propValue === "false" ? false : propValue === "" || !!propValue;
+		}
 		/**
 		* force it to be a number
 		*/
@@ -3969,7 +4014,11 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
 		}
 		if (BUILD.updatable && flags & HOST_FLAGS.hasRendered) {
 			if (instance.componentShouldUpdate) {
-				if (instance.componentShouldUpdate(newVal, oldVal, propName) === false && !(flags & HOST_FLAGS.isQueuedForUpdate)) return;
+				const changes = hostRef.$queuedPropChanges$ ||= {};
+				changes[propName] = {
+					newVal,
+					oldVal: changes[propName]?.oldVal ?? oldVal
+				};
 			}
 			if (!(flags & HOST_FLAGS.isQueuedForUpdate)) scheduleUpdate(hostRef, false);
 		}
@@ -4103,11 +4152,12 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 						};
 						for (const deserializer of cmpMeta.$deserializers$[propName]) {
 							const [[methodName]] = Object.entries(deserializer);
-							if (BUILD.lazyLoad) if (hostRef.$lazyInstance$) setVal(methodName, hostRef.$lazyInstance$);
-							else hostRef.$fetchedCbList$.push(() => {
-								setVal(methodName, hostRef.$lazyInstance$);
-							});
-							else setVal(methodName, this);
+							if (BUILD.lazyLoad) {
+								if (hostRef.$lazyInstance$) setVal(methodName, hostRef.$lazyInstance$);
+								else hostRef.$fetchedCbList$.push(() => {
+									setVal(methodName, hostRef.$lazyInstance$);
+								});
+							} else setVal(methodName, this);
 						}
 						return;
 					} else if (prototype.hasOwnProperty(propName) && typeof this[propName] === "number" && this[propName] == newValue) return;
@@ -4131,7 +4181,7 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 					if (!isSpuriousBooleanRemoval && newValue != this[propName] && (!propDesc.get || !!propDesc.set)) this[propName] = newValue;
 				});
 			};
-			Cstr.observedAttributes = Array.from(new Set([...Object.keys(cmpMeta.$watchers$ ?? {}), ...members.filter(([_, m]) => m[0] & MEMBER_FLAGS.HasAttribute).map(([propName, m]) => {
+			Cstr.observedAttributes = Array.from(/* @__PURE__ */ new Set([...Object.keys(cmpMeta.$watchers$ ?? {}), ...members.filter(([_, m]) => m[0] & MEMBER_FLAGS.HasAttribute).map(([propName, m]) => {
 				const attrName = m[1] || propName;
 				attrNameToPropName.set(attrName, propName);
 				if (BUILD.reflect && m[0] & MEMBER_FLAGS.ReflectAttr) cmpMeta.$attrsToReflect$?.push([propName, attrName]);
@@ -4158,6 +4208,7 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
 	try {
 		if ((hostRef.$flags$ & HOST_FLAGS.hasInitializedComponent) === 0) {
 			hostRef.$flags$ |= HOST_FLAGS.hasInitializedComponent;
+			hostRef.$flags$ &= ~HOST_FLAGS.hasFailedLoad;
 			const bundleId = cmpMeta.$lazyBundleId$;
 			if (BUILD.lazyLoad && bundleId) {
 				const CstrImport = loadModule(cmpMeta, hostRef, hmrVersionId);
@@ -4166,7 +4217,12 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
 					Cstr = await CstrImport;
 					endLoad();
 				} else Cstr = CstrImport;
-				if (!Cstr) throw new Error(`Constructor for "${cmpMeta.$tagName$}#${hostRef.$modeName$}" was not found`);
+				if (!Cstr) {
+					hostRef.$flags$ &= ~HOST_FLAGS.hasInitializedComponent;
+					hostRef.$loadRetryCount$ = (hostRef.$loadRetryCount$ ?? 0) + 1;
+					if (hostRef.$loadRetryCount$ < 3) hostRef.$flags$ |= HOST_FLAGS.hasFailedLoad;
+					throw new Error(`Constructor for "${cmpMeta.$tagName$}#${hostRef.$modeName$}" was not found`);
+				}
 				if (BUILD.member && !Cstr.isProxied) {
 					if (BUILD.propChangeCallback) {
 						cmpMeta.$watchers$ = normalizeWatchers(Cstr.watchers);
@@ -4185,8 +4241,14 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
 				}
 				if (BUILD.member) hostRef.$flags$ &= ~HOST_FLAGS.isConstructingInstance;
 				endNewInstance();
-				if (!(BUILD.slotRelocation && cmpMeta.$flags$ & CMP_FLAGS.hasSlotRelocation)) fireConnectedCallback(hostRef.$lazyInstance$, elm);
-				else hostRef.$deferredConnectedCallback$ = true;
+				if (BUILD.asyncLoading && hostRef.$ancestorComponent$) await awaitAncestorConnected(hostRef.$ancestorComponent$);
+				if (!(BUILD.slotRelocation && cmpMeta.$flags$ & CMP_FLAGS.hasSlotRelocation)) {
+					fireConnectedCallback(hostRef.$lazyInstance$, elm);
+					if (BUILD.asyncLoading) markFirstConnected(hostRef);
+				} else queueMicrotask(() => {
+					fireConnectedCallback(hostRef.$lazyInstance$, elm);
+					if (BUILD.asyncLoading) markFirstConnected(hostRef);
+				});
 			} else Cstr = elm.constructor;
 			if (BUILD.style && Cstr && Cstr.style) {
 				/**
@@ -4245,7 +4307,8 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
 			hostRef.$onRenderResolve$();
 			hostRef.$onRenderResolve$ = void 0;
 		}
-		if (BUILD.asyncLoading && hostRef.$onReadyResolve$) hostRef.$onReadyResolve$(elm);
+		if (BUILD.asyncLoading) markFirstConnected(hostRef);
+		if (BUILD.asyncLoading && hostRef.$onReadyResolve$ && !(hostRef.$flags$ & HOST_FLAGS.hasFailedLoad)) hostRef.$onReadyResolve$(elm);
 	}
 };
 const fireConnectedCallback = (instance, elm) => {
@@ -4308,6 +4371,7 @@ const connectedCallback = (elm) => {
 		} else {
 			addHostEventListeners(elm, hostRef, cmpMeta.$listeners$);
 			if (hostRef?.$lazyInstance$) fireConnectedCallback(hostRef.$lazyInstance$, elm);
+			else if (hostRef.$flags$ & HOST_FLAGS.hasFailedLoad) setTimeout(() => initializeComponent(elm, hostRef, cmpMeta), LAZY_LOAD_RETRY_INTERVAL_MS);
 			else if (hostRef?.$onReadyPromise$) hostRef.$onReadyPromise$.then(() => fireConnectedCallback(hostRef.$lazyInstance$, elm));
 		}
 		endConnected();
@@ -4337,6 +4401,7 @@ const disconnectedCallback = async (elm) => {
 			hostRef.$signalCleanup$();
 			hostRef.$signalCleanup$ = void 0;
 		}
+		if (BUILD.asyncLoading && hostRef && !(hostRef.$flags$ & HOST_FLAGS.hasFiredConnected)) markFirstConnected(hostRef);
 		if (!BUILD.lazyLoad) disconnectInstance(elm);
 		else if (hostRef?.$lazyInstance$) disconnectInstance(hostRef.$lazyInstance$, elm);
 		else if (hostRef?.$onReadyPromise$) hostRef.$onReadyPromise$.then(() => disconnectInstance(hostRef.$lazyInstance$, elm));
@@ -4450,8 +4515,8 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
 	const exclude = options.exclude || [];
 	const _reg = options.registry ?? getRegistry();
 	const head = win.document.head;
-	const metaCharset = /* @__PURE__ */ head.querySelector("meta[charset]");
-	const dataStyles = /* @__PURE__ */ win.document.createElement("style");
+	const metaCharset = /*@__PURE__*/ head.querySelector("meta[charset]");
+	const dataStyles = /*@__PURE__*/ win.document.createElement("style");
 	const deferredConnectedCallbacks = [];
 	let appLoadFallback;
 	let isBootstrapping = true;
@@ -4519,8 +4584,11 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
 					*
 					* Also remove the reference from `deferredConnectedCallbacks` array
 					* otherwise removed instances won't get garbage collected.
+					*
+					* Use `nextTick` (microtask) rather than `plt.raf` since
+					* `requestAnimationFrame` callbacks do not fire while `document.hidden`
 					*/
-					plt.raf(() => {
+					nextTick(() => {
 						const hostRef = getHostRef(this);
 						if (!hostRef) return;
 						const i = deferredConnectedCallbacks.findIndex((host) => host === this);
@@ -4533,18 +4601,20 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
 				}
 			};
 			if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && (BUILD.slotCloneNode || BUILD.patchClone && cmpMeta.$flags$ & CMP_FLAGS.patchClone)) patchCloneNode(HostElement.prototype);
-			if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && cmpMeta.$flags$ & CMP_FLAGS.hasSlot) if (BUILD.lightDomPatches || BUILD.patchAll && cmpMeta.$flags$ & CMP_FLAGS.patchAll) applyLightDomPatches(HostElement.prototype);
-			else {
-				if (BUILD.slotChildNodes || BUILD.patchChildren && cmpMeta.$flags$ & CMP_FLAGS.patchChildren) patchChildSlotNodes(HostElement.prototype);
-				if (BUILD.slotDomMutations || BUILD.patchInsert && cmpMeta.$flags$ & CMP_FLAGS.patchInsert) {
-					patchSlotAppendChild(HostElement.prototype);
-					patchSlotAppend(HostElement.prototype);
-					patchSlotPrepend(HostElement.prototype);
-					patchSlotInsertAdjacentHTML(HostElement.prototype);
-					patchInsertBefore(HostElement.prototype);
-					patchSlotRemoveChild(HostElement.prototype);
+			if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && cmpMeta.$flags$ & CMP_FLAGS.hasSlot) {
+				if (BUILD.lightDomPatches || BUILD.patchAll && cmpMeta.$flags$ & CMP_FLAGS.patchAll) applyLightDomPatches(HostElement.prototype);
+				else {
+					if (BUILD.slotChildNodes || BUILD.patchChildren && cmpMeta.$flags$ & CMP_FLAGS.patchChildren) patchChildSlotNodes(HostElement.prototype);
+					if (BUILD.slotDomMutations || BUILD.patchInsert && cmpMeta.$flags$ & CMP_FLAGS.patchInsert) {
+						patchSlotAppendChild(HostElement.prototype);
+						patchSlotAppend(HostElement.prototype);
+						patchSlotPrepend(HostElement.prototype);
+						patchSlotInsertAdjacentHTML(HostElement.prototype);
+						patchInsertBefore(HostElement.prototype);
+						patchSlotRemoveChild(HostElement.prototype);
+					}
+					if (BUILD.slotTextContent) patchTextContent(HostElement.prototype);
 				}
-				if (BUILD.slotTextContent) patchTextContent(HostElement.prototype);
 			}
 			if (BUILD.formAssociated && cmpMeta.$flags$ & CMP_FLAGS.formAssociated) HostElement.formAssociated = true;
 			if (BUILD.hotModuleReplacement) HostElement.prototype["s-hmr"] = function(hmrVersionId) {
@@ -4575,9 +4645,6 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
 	endBootstrap();
 };
 //#endregion
-//#region src/runtime/fragment.ts
-const Fragment = (_, children) => children;
-//#endregion
 //#region src/runtime/host-listener.ts
 const addHostEventListeners = (elm, hostRef, listeners) => {
 	if (BUILD.hostListener && listeners && win.document) listeners.map(([flags, name, method]) => {
@@ -4590,9 +4657,10 @@ const addHostEventListeners = (elm, hostRef, listeners) => {
 };
 const hostListenerProxy = (hostRef, methodName) => (ev) => {
 	try {
-		if (BUILD.lazyLoad) if (hostRef.$flags$ & HOST_FLAGS.isListenReady) hostRef.$lazyInstance$?.[methodName](ev);
-		else (hostRef.$queuedListeners$ = hostRef.$queuedListeners$ || []).push([methodName, ev]);
-		else hostRef.$hostElement$[methodName](ev);
+		if (BUILD.lazyLoad) {
+			if (hostRef.$flags$ & HOST_FLAGS.isListenReady) hostRef.$lazyInstance$?.[methodName](ev);
+			else (hostRef.$queuedListeners$ = hostRef.$queuedListeners$ || []).push([methodName, ev]);
+		} else hostRef.$hostElement$[methodName](ev);
 	} catch (e) {
 		consoleError(e, hostRef.$hostElement$);
 	}
@@ -4614,6 +4682,73 @@ function Mixin(...mixins) {
 	return mixins.reduceRight((acc, mixin) => mixin(acc), baseClass);
 }
 //#endregion
+//#region src/runtime/reactive-controller.ts
+const ReactiveControllerHost = (Base) => class ReactiveControllerHostMixin extends Base {
+	controllers = /* @__PURE__ */ new Set();
+	#connected = false;
+	#updateCompleteResolvers = [];
+	addController(controller) {
+		this.controllers.add(controller);
+		if (this.#connected) controller.hostConnected?.();
+	}
+	removeController(controller) {
+		this.controllers.delete(controller);
+	}
+	requestUpdate() {
+		forceUpdate(this);
+	}
+	get updateComplete() {
+		return new Promise((resolve) => this.#updateCompleteResolvers.push(resolve));
+	}
+	connectedCallback() {
+		super.connectedCallback?.();
+		this.#connected = true;
+		const el = getElement(this);
+		if (el && el !== this) {
+			el.addController = (controller) => this.addController(controller);
+			el.removeController = (controller) => this.removeController(controller);
+			el.requestUpdate = () => this.requestUpdate();
+			Object.defineProperty(el, "updateComplete", {
+				configurable: true,
+				get: () => this.updateComplete
+			});
+		}
+		this.controllers.forEach((c) => c.hostConnected?.());
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback?.();
+		this.#connected = false;
+		this.controllers.forEach((c) => c.hostDisconnected?.());
+	}
+	async componentWillLoad() {
+		await super.componentWillLoad?.();
+		await Promise.all([...this.controllers].map((c) => c.hostWillLoad?.()));
+	}
+	componentDidLoad() {
+		super.componentDidLoad?.();
+		this.controllers.forEach((c) => c.hostDidLoad?.());
+	}
+	async componentWillRender() {
+		await super.componentWillRender?.();
+		await Promise.all([...this.controllers].map((c) => c.hostWillRender?.()));
+	}
+	componentDidRender() {
+		super.componentDidRender?.();
+		this.controllers.forEach((c) => c.hostDidRender?.());
+		const resolvers = this.#updateCompleteResolvers;
+		this.#updateCompleteResolvers = [];
+		resolvers.forEach((resolve) => resolve(true));
+	}
+	async componentWillUpdate() {
+		await super.componentWillUpdate?.();
+		await Promise.all([...this.controllers].map((c) => c.hostWillUpdate?.()));
+	}
+	componentDidUpdate() {
+		super.componentDidUpdate?.();
+		this.controllers.forEach((c) => c.hostDidUpdate?.());
+	}
+};
+//#endregion
 //#region src/runtime/render.ts
 /**
 * A WeakMap to persist HostRef objects across multiple render() calls to the
@@ -4700,4 +4835,4 @@ function hasKeys(obj) {
 	return false;
 }
 //#endregion
-export { HYDRATE_ID as A, Event as B, setAssetPath as C, DEFAULT_DOC_DATA as D, setPlatformHelpers as E, reWireGetterSetter as F, State as G, Method as H, AttachInternals as I, Build as J, Watch as K, AttrDeserialize as L, STENCIL_DOC_DATA as M, setErrorHandler as N, HYDRATED_CSS as O, getHostRef as P, Component as R, getAssetPath as S, writeTask as T, Prop as U, Listen as V, PropSerialize as W, Env as X, BUILD as Y, insertBefore as _, transformTag as a, getElement as b, Fragment as c, setMode as d, scopeCss as f, getRenderingRef as g, forceUpdate as h, setTagTransformer as i, NODE_TYPE as j, HYDRATE_CHILD_ID as k, bootstrapLazy as l, h as m, jsxDEV as n, render as o, Host as p, resolveVar as q, jsxs as r, Mixin as s, jsx as t, getMode as u, renderVdom as v, readTask as w, getShadowRoot as x, createEvent as y, Element$1 as z };
+export { HYDRATE_ID as A, setAssetPath as C, DEFAULT_DOC_DATA as D, setPlatformHelpers as E, reWireGetterSetter as F, Build as I, BUILD as L, STENCIL_DOC_DATA as M, setErrorHandler as N, HYDRATED_CSS as O, getHostRef as P, Env as R, getAssetPath as S, writeTask as T, insertBefore as _, transformTag as a, getElement as b, Mixin as c, setMode as d, scopeCss as f, getRenderingRef as g, forceUpdate as h, setTagTransformer as i, NODE_TYPE as j, HYDRATE_CHILD_ID as k, bootstrapLazy as l, h as m, jsxDEV as n, render as o, Host as p, jsxs as r, ReactiveControllerHost as s, jsx as t, getMode as u, renderVdom as v, readTask as w, getShadowRoot as x, createEvent as y };