@stencil/core 5.0.0-beta.11 → 5.0.0-beta.13

package/dist/runtime/client/runtime.d.ts

@@ -2277,8 +2277,8 @@ declare const setErrorHandler: (handler: ErrorHandler) => ErrorHandler;
 //#endregion
 //#region src/client/client-style.d.ts
 declare const styles: StyleMap;
-declare const modeResolutionChain: ResolutionHandler[];
-declare const setScopedSsr: (_opts: SsrFactoryOptions) => void;
+declare const modeResolver: ResolutionHandler[];
+declare const setScopedSSR: (_opts: SsrFactoryOptions) => void;
 declare const needsScopedSSR: () => boolean;
 //#endregion
 //#region src/client/client-task-queue.d.ts
@@ -2384,7 +2384,7 @@ type Ctor<T = {}> = new (...args: any[]) => T;
 declare function Mixin(...mixins: ((base: Ctor) => Ctor)[]): Ctor<{}>;
 //#endregion
 //#region src/runtime/mode.d.ts
-declare const setMode: (handler: ResolutionHandler) => number;
+declare const setMode: (handler: ResolutionHandler) => void;
 declare const getMode: (ref: RuntimeRef) => string;
 //#endregion
 //#region src/runtime/nonce.d.ts
@@ -2442,10 +2442,9 @@ declare const normalizeWatchers: (raw: ComponentConstructorChangeHandlers | unde
  *
  * @param propValue the new value to coerce to some type
  * @param propType the type of the prop, expressed as a binary number
- * @param isFormAssociated whether the component is form-associated (optional)
  * @returns the parsed/coerced value
  */
-declare const parsePropertyValue: (propValue: unknown, propType: number, isFormAssociated?: boolean) => any;
+declare const parsePropertyValue: (propValue: unknown, propType: number) => any;
 //#endregion
 //#region src/runtime/platform-options.d.ts
 interface SetPlatformOptions {
@@ -2542,4 +2541,4 @@ declare const jsxs: typeof jsx;
  */
 declare const jsxDEV: typeof jsx;
 //#endregion
-export { AttachInternals, AttrDeserialize, BUILD, Build, Component, Element$1 as Element, Env, Event, Fragment, H, H as HTMLElement, type HTMLStencilElement, HYDRATED_STYLE_ID, Host, type JSXBase, Listen, Method, Mixin, NAMESPACE, Prop, PropSerialize, ReactiveControllerHost, STENCIL_DEV_MODE, State, Watch, addHostEventListeners, bootstrapLazy, cmpModules, connectedCallback, consoleDevError, consoleDevInfo, consoleDevWarn, consoleError, createEvent, defineCustomElement, disconnectedCallback, forceModeUpdate, forceUpdate, getAssetPath, getElement, getHostRef, getMode, getRegistry, getRenderingRef, getShadowRoot, getValue, h, injectSideEffectStyle, isMemberInElement, jsx, jsxDEV, jsxs, loadModule, modeResolutionChain, needsScopedSSR, nextTick, normalizeWatchers, parsePropertyValue, plt, postUpdateComponent, promiseResolve, proxyComponent, proxyCustomElement, readTask, registerHost, registerInstance, registerSideEffectStyleTarget, render, resolveVar, setAssetPath, setErrorHandler, setLazyLoadBasePath, setMode, setNonce, setPlatformHelpers, setPlatformOptions, setRegistry, setScopedSsr, setTagTransformer, setValue, styles, supportsConstructableStylesheets, supportsListenerOptions, supportsMutableAdoptedStyleSheets, transformTag, unregisterSideEffectStyleTarget, win, writeTask };
+export { AttachInternals, AttrDeserialize, BUILD, Build, Component, Element$1 as Element, Env, Event, Fragment, H, H as HTMLElement, type HTMLStencilElement, HYDRATED_STYLE_ID, Host, type JSXBase, Listen, Method, Mixin, NAMESPACE, Prop, PropSerialize, ReactiveControllerHost, STENCIL_DEV_MODE, State, Watch, addHostEventListeners, bootstrapLazy, cmpModules, connectedCallback, consoleDevError, consoleDevInfo, consoleDevWarn, consoleError, createEvent, defineCustomElement, disconnectedCallback, forceModeUpdate, forceUpdate, getAssetPath, getElement, getHostRef, getMode, getRegistry, getRenderingRef, getShadowRoot, getValue, h, injectSideEffectStyle, isMemberInElement, jsx, jsxDEV, jsxs, loadModule, modeResolver, needsScopedSSR, nextTick, normalizeWatchers, parsePropertyValue, plt, postUpdateComponent, promiseResolve, proxyComponent, proxyCustomElement, readTask, registerHost, registerInstance, registerSideEffectStyleTarget, render, resolveVar, setAssetPath, setErrorHandler, setLazyLoadBasePath, setMode, setNonce, setPlatformHelpers, setPlatformOptions, setRegistry, setScopedSSR, setTagTransformer, setValue, styles, supportsConstructableStylesheets, supportsListenerOptions, supportsMutableAdoptedStyleSheets, transformTag, unregisterSideEffectStyleTarget, win, writeTask };

package/dist/runtime/client/runtime.js

@@ -488,8 +488,8 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
 //#endregion
 //#region src/client/client-style.ts
 const styles = /*@__PURE__*/ new Map();
-const modeResolutionChain = [];
-const setScopedSsr = (_opts) => {};
+const modeResolver = [];
+const setScopedSSR = (_opts) => {};
 const needsScopedSSR = () => false;
 //#endregion
 //#region src/runtime/runtime-constants.ts
@@ -1847,10 +1847,10 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialR
 		const isComplex = isComplexType(newValue);
 		if (!BUILD$1.lazyLoad) {
 			const isStandardAttr = ln.startsWith("aria-") || ln.startsWith("data-");
-			if (!isProp && !isStandardAttr && elm.tagName?.includes("-") && elm.tagName !== "SLOT-FB" && typeof customElements !== "undefined" && !customElements.get(elm.tagName.toLowerCase())) {
+			if (!isProp && !isStandardAttr && elm.tagName?.includes("-") && elm.tagName !== "SLOT-FB" && !customElements.get(elm.tagName.toLowerCase())) {
 				if (!elm["s-pp"]) elm["s-pp"] = /* @__PURE__ */ new Map();
 				elm["s-pp"].set(memberName, newValue);
-				return;
+				if (isComplex || /[A-Z]/.test(memberName)) return;
 			}
 		}
 		if ((isProp || isComplex && newValue !== null) && !isSvg) try {
@@ -4128,8 +4128,11 @@ const scopeCss = (cssText, scopeId, commentOriginalSelector) => {
 };
 //#endregion
 //#region src/runtime/mode.ts
-const computeMode = (elm) => modeResolutionChain.map((h) => h(elm)).find((m) => !!m);
-const setMode = (handler) => modeResolutionChain.push(handler);
+const computeMode = (elm) => modeResolver.map((h) => h(elm)).find((m) => !!m);
+const setMode = (handler) => {
+	modeResolver.length = 0;
+	modeResolver.push(handler);
+};
 const getMode = (ref) => getHostRef(ref)?.$modeName$;
 //#endregion
 //#region src/runtime/normalize-watchers.ts
@@ -4194,23 +4197,14 @@ const normalizeWatchers = (raw) => {
 *
 * @param propValue the new value to coerce to some type
 * @param propType the type of the prop, expressed as a binary number
-* @param isFormAssociated whether the component is form-associated (optional)
 * @returns the parsed/coerced value
 */
-const parsePropertyValue = (propValue, propType, isFormAssociated) => {
+const parsePropertyValue = (propValue, propType) => {
 	if (propValue != null && !isComplexType(propValue)) {
 		/**
 		* ensure this value is of the correct prop type
 		*/
-		if (BUILD$1.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$1.formAssociated && isFormAssociated && typeof propValue === "string") return propValue === "" || !!propValue;
-			else return propValue === "false" ? false : propValue === "" || !!propValue;
-		}
+		if (BUILD$1.propBoolean && propType & MEMBER_FLAGS.Boolean) return propValue === "" || !!propValue;
 		/**
 		* force it to be a number
 		*/
@@ -4252,7 +4246,7 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
 	if (BUILD$1.signalBacking) {
 		const sig = hostRef?.$signalValues$?.get(propName);
 		if (sig !== void 0) {
-			const parsed = parsePropertyValue(newVal, cmpMeta.$members$[propName][0], BUILD$1.formAssociated && !!(cmpMeta.$flags$ & CMP_FLAGS.formAssociated));
+			const parsed = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]);
 			if (BUILD$1.serializer && BUILD$1.reflect && cmpMeta.$attrsToReflect$ && cmpMeta.$serializers$?.[propName]) {
 				const elm = BUILD$1.lazyLoad ? hostRef.$hostElement$ : ref;
 				applySerializers(hostRef, cmpMeta, propName, parsed, BUILD$1.lazyLoad ? hostRef.$lazyInstance$ : elm);
@@ -4270,7 +4264,7 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
 	const oldVal = hostRef.$instanceValues$.get(propName);
 	const flags = hostRef.$flags$;
 	const instance = BUILD$1.lazyLoad ? hostRef.$lazyInstance$ : elm;
-	newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0], BUILD$1.formAssociated && !!(cmpMeta.$flags$ & CMP_FLAGS.formAssociated));
+	newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]);
 	const didValueChange = newVal !== oldVal && !(Number.isNaN(oldVal) && Number.isNaN(newVal));
 	if ((!BUILD$1.lazyLoad || !(flags & HOST_FLAGS.isConstructingInstance) || oldVal === void 0) && didValueChange) {
 		hostRef.$instanceValues$.set(propName, newVal);
@@ -4319,6 +4313,22 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
 */
 const reflectedAttrValue = (propValue) => propValue == null || propValue === false ? null : propValue === true ? "" : String(propValue);
 /**
+* Hand values written to a lazy component's element before its instance existed to the
+* instance's own `@Prop` setters. Must run as soon as the instance is constructed, so that
+* whenever `$lazyInstance$` is set, reads through it agree with the element's last write.
+*
+* @param hostRef the runtime bookkeeping object of a freshly constructed lazy instance
+* @param cmpMeta runtime metadata for the component (with any run-time only setters flagged)
+*/
+const replayPendingSetterValues = (hostRef, cmpMeta) => {
+	const instance = hostRef.$lazyInstance$;
+	if (!instance) return;
+	for (const [memberName, [memberFlags]] of Object.entries(cmpMeta.$members$ ?? {})) if (memberFlags & MEMBER_FLAGS.Setter && hostRef.$instanceValues$.has(memberName)) {
+		const pendingValue = hostRef.$instanceValues$.get(memberName);
+		if (instance[memberName] !== pendingValue) instance[memberName] = pendingValue;
+	}
+};
+/**
 * Attach a series of runtime constructs to a compiled Stencil component
 * constructor, including getters and setters for the `@Prop` and `@State`
 * decorators, callbacks for when attributes change, and so on.
@@ -4375,9 +4385,8 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 						if (BUILD$1.lazyLoad) {
 							if ((cmpMeta.$members$[memberName][0] & MEMBER_FLAGS.Getter) === 0) return getValue(this, memberName);
 							const ref = getHostRef(this);
-							const instance = ref ? ref.$lazyInstance$ : prototype;
-							if (!instance) return;
-							return instance[memberName];
+							if (!ref) return prototype[memberName];
+							return ref.$lazyInstance$ ? ref.$lazyInstance$[memberName] : getValue(this, memberName);
 						}
 						if (!BUILD$1.lazyLoad) return origGetter ? origGetter.apply(this) : getValue(this, memberName);
 					},
@@ -4392,7 +4401,7 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 					}
 					if (origSetter) {
 						if (typeof (memberFlags & MEMBER_FLAGS.State ? this[memberName] : ref.$hostElement$[memberName]) === "undefined" && ref.$instanceValues$.get(memberName)) newValue = ref.$instanceValues$.get(memberName);
-						origSetter.apply(this, [parsePropertyValue(newValue, memberFlags, BUILD$1.formAssociated && !!(cmpMeta.$flags$ & CMP_FLAGS.formAssociated))]);
+						origSetter.apply(this, [parsePropertyValue(newValue, memberFlags)]);
 						newValue = memberFlags & MEMBER_FLAGS.State ? this[memberName] : ref.$hostElement$[memberName];
 						setValue(this, memberName, newValue, cmpMeta);
 						return;
@@ -4404,26 +4413,15 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 					if (BUILD$1.lazyLoad) {
 						if ((flags & PROXY_FLAGS.isElementConstructor) === 0 || (cmpMeta.$members$[memberName][0] & MEMBER_FLAGS.Setter) === 0) {
 							setValue(this, memberName, newValue, cmpMeta);
-							if (flags & PROXY_FLAGS.isElementConstructor && !ref.$lazyInstance$) ref.$fetchedCbList$.push(() => {
-								if (cmpMeta.$members$[memberName][0] & MEMBER_FLAGS.Setter && ref.$lazyInstance$[memberName] !== ref.$instanceValues$.get(memberName)) ref.$lazyInstance$[memberName] = newValue;
-							});
 							return;
 						}
-						const parsedValue = parsePropertyValue(newValue, memberFlags, BUILD$1.formAssociated && !!(cmpMeta.$flags$ & CMP_FLAGS.formAssociated));
-						const setterSetVal = (val) => {
+						const parsedValue = parsePropertyValue(newValue, memberFlags);
+						if (ref.$lazyInstance$) {
 							const currentValue = ref.$lazyInstance$[memberName];
 							if (!ref.$instanceValues$.get(memberName) && currentValue) ref.$instanceValues$.set(memberName, currentValue);
-							ref.$lazyInstance$[memberName] = val;
+							ref.$lazyInstance$[memberName] = parsedValue;
 							setValue(this, memberName, ref.$lazyInstance$[memberName], cmpMeta);
-						};
-						if (ref.$lazyInstance$) setterSetVal(parsedValue);
-						else {
-							ref.$instanceValues$.set(memberName, parsedValue);
-							ref.$fetchedCbList$.push(() => {
-								const pendingValue = ref.$instanceValues$.get(memberName);
-								if (ref.$lazyInstance$[memberName] !== pendingValue) setterSetVal(pendingValue);
-							});
-						}
+						} else ref.$instanceValues$.set(memberName, parsedValue);
 					}
 				} });
 			} else if (BUILD$1.lazyLoad && BUILD$1.method && flags & PROXY_FLAGS.isElementConstructor && memberFlags & MEMBER_FLAGS.Method) Object.defineProperty(prototype, memberName, { value(...args) {
@@ -4475,10 +4473,12 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 					const isBooleanTarget = propMemberFlags & MEMBER_FLAGS.Boolean;
 					if (BUILD$1.reflect && propMemberFlags & MEMBER_FLAGS.ReflectAttr && propMemberFlags & MEMBER_FLAGS.Any && !isComplexType(this[propName]) && reflectedAttrValue(this[propName]) === newValue) return;
 					const isSpuriousBooleanRemoval = isBooleanTarget && newValue === null && this[propName] === void 0;
-					if (isBooleanTarget) newValue = !(newValue === null || newValue === "false");
-					const currentValue = BUILD$1.lazyLoad && propMemberFlags & MEMBER_FLAGS.Setter ? hostRef.$instanceValues$.get(propName) : this[propName];
+					if (isBooleanTarget) {
+						if (BUILD$1.isDev && newValue === "false") consoleDevWarn(`<${cmpMeta.$tagName$} ${attrName}="false">: boolean attributes are true when present, regardless of value. Remove the attribute or set the "${propName}" property to false instead.`);
+						newValue = newValue !== null;
+					}
 					const propDesc = Object.getOwnPropertyDescriptor(prototype, propName);
-					if (!isSpuriousBooleanRemoval && newValue != currentValue && (!propDesc.get || !!propDesc.set)) this[propName] = newValue;
+					if (!isSpuriousBooleanRemoval && newValue != this[propName] && (!propDesc.get || !!propDesc.set)) this[propName] = newValue;
 				});
 			};
 			Cstr.observedAttributes = Array.from(/* @__PURE__ */ new Set([...Object.keys(cmpMeta.$watchers$ ?? {}), ...members.filter(([_, m]) => m[0] & MEMBER_FLAGS.HasAttribute).map(([propName, m]) => {
@@ -4539,7 +4539,10 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
 				} catch (e) {
 					consoleError(e, elm);
 				}
-				if (BUILD$1.member) hostRef.$flags$ &= ~HOST_FLAGS.isConstructingInstance;
+				if (BUILD$1.member) {
+					hostRef.$flags$ &= ~HOST_FLAGS.isConstructingInstance;
+					replayPendingSetterValues(hostRef, cmpMeta);
+				}
 				endNewInstance();
 				if (BUILD$1.asyncLoading && hostRef.$ancestorComponent$) await awaitAncestorConnected(hostRef.$ancestorComponent$);
 				if (!(BUILD$1.slotRelocation && cmpMeta.$flags$ & CMP_FLAGS.hasSlotRelocation)) {
@@ -4759,48 +4762,45 @@ const hmrStandalone = async (hostElement, cmpMeta, hmrVersionId) => {
 			`${modulePath}?s-hmr=${hmrVersionId}`
 );
 		const NewClass = Object.values(newModule).find((v) => typeof v === "function" && v.is === cmpMeta.$tagName$) ?? newModule.default;
-		if (!NewClass) return;
-		const ctor = customElements.get(cmpMeta.$tagName$);
-		if (ctor) {
-			for (const key of Object.getOwnPropertyNames(NewClass.prototype)) {
-				if (key === "constructor") continue;
-				Object.defineProperty(ctor.prototype, key, Object.getOwnPropertyDescriptor(NewClass.prototype, key));
-			}
-			const styleDesc = Object.getOwnPropertyDescriptor(NewClass, "style");
-			if (styleDesc) {
-				Object.defineProperty(ctor, "style", styleDesc);
-				const newStyle = NewClass.style;
-				if (newStyle) {
-					const scopeId = getScopeId(cmpMeta);
-					const isShadow = !!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation);
-					console.log("[stencil-hmr] registerStyle", {
-						tag: cmpMeta.$tagName$,
-						scopeId,
-						isShadow,
-						cssLen: newStyle.length
-					});
-					registerStyle(scopeId, newStyle, isShadow);
-				}
-			}
-		}
-		const isShadow = !!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation);
-		document.querySelectorAll(cmpMeta.$tagName$).forEach((el) => {
-			const hostRef = getHostRef(el);
-			if (BUILD$1.hostListener && hostRef?.$rmListeners$) {
-				hostRef.$rmListeners$.map((rmListener) => rmListener());
-				hostRef.$rmListeners$ = void 0;
-				addHostEventListeners(el, hostRef, cmpMeta.$listeners$);
-			}
-			if (!isShadow && hostRef) {
-				console.log("[stencil-hmr] calling attachStyles for", cmpMeta.$tagName$);
-				attachStyles(hostRef);
-			}
-			forceUpdate(el);
-		});
+		if (NewClass) hmrApplyClass(cmpMeta, NewClass);
 	} catch (e) {
 		console.error(`[Stencil HMR] Failed to reload <${cmpMeta.$tagName$}>`, e);
 	}
 };
+/**
+* Patch a re-executed component class onto the registered one and re-render every live instance.
+* Shared by the standalone re-import above and bundlers that re-execute the module themselves
+* (webpack/rspack `module.hot`), which reach it via the constructor's `s-hmr-apply` hook.
+*
+* @param cmpMeta runtime metadata for the component
+* @param NewClass the component's newly executed class
+*/
+const hmrApplyClass = (cmpMeta, NewClass) => {
+	const ctor = customElements.get(cmpMeta.$tagName$);
+	const isShadow = !!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation);
+	if (ctor && ctor !== NewClass) {
+		for (const key of Object.getOwnPropertyNames(NewClass.prototype)) {
+			if (key === "constructor") continue;
+			Object.defineProperty(ctor.prototype, key, Object.getOwnPropertyDescriptor(NewClass.prototype, key));
+		}
+		const styleDesc = Object.getOwnPropertyDescriptor(NewClass, "style");
+		if (styleDesc) {
+			Object.defineProperty(ctor, "style", styleDesc);
+			const newStyle = NewClass.style;
+			if (newStyle) registerStyle(getScopeId(cmpMeta), newStyle, isShadow);
+		}
+	}
+	document.querySelectorAll(cmpMeta.$tagName$).forEach((el) => {
+		const hostRef = getHostRef(el);
+		if (BUILD$1.hostListener && hostRef?.$rmListeners$) {
+			hostRef.$rmListeners$.map((rmListener) => rmListener());
+			hostRef.$rmListeners$ = void 0;
+			addHostEventListeners(el, hostRef, cmpMeta.$listeners$);
+		}
+		if (!isShadow && hostRef) attachStyles(hostRef);
+		forceUpdate(el);
+	});
+};
 //#endregion
 //#region src/runtime/bootstrap-standalone.ts
 const defineCustomElement = (Cstr, compactMeta) => {
@@ -4823,9 +4823,12 @@ const proxyCustomElement = (Cstr, compactMeta) => {
 			cmpMeta.$serializers$ = Cstr.$serializers$;
 		}
 		if (BUILD$1.reflect) cmpMeta.$attrsToReflect$ = [];
-		if (BUILD$1.hotModuleReplacement) Cstr.prototype["s-hmr"] = function(hmrVersionId) {
-			hmrStart(this, cmpMeta, hmrVersionId);
-		};
+		if (BUILD$1.hotModuleReplacement) {
+			Cstr.prototype["s-hmr"] = function(hmrVersionId) {
+				hmrStart(this, cmpMeta, hmrVersionId);
+			};
+			Cstr["s-hmr-apply"] = (NewClass) => hmrApplyClass(cmpMeta, NewClass);
+		}
 		if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && (BUILD$1.slotCloneNode || BUILD$1.patchClone && cmpMeta.$flags$ & CMP_FLAGS.patchClone)) patchCloneNode(Cstr.prototype);
 		if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && cmpMeta.$flags$ & CMP_FLAGS.hasSlot) {
 			if (BUILD$1.lightDomPatches || BUILD$1.patchAll && cmpMeta.$flags$ & CMP_FLAGS.patchAll) applyLightDomPatches(Cstr.prototype);
@@ -5341,4 +5344,4 @@ function hasKeys(obj) {
 	return false;
 }
 //#endregion
-export { AttachInternals, AttrDeserialize, BUILD, Build, Component, Element$1 as Element, Env, Event, Fragment, H, H as HTMLElement, HYDRATED_STYLE_ID, Host, Listen, Method, Mixin, NAMESPACE, Prop, PropSerialize, ReactiveControllerHost, STENCIL_DEV_MODE, State, Watch, addHostEventListeners, bootstrapLazy, cmpModules, connectedCallback, consoleDevError, consoleDevInfo, consoleDevWarn, consoleError, createEvent, defineCustomElement, disconnectedCallback, forceModeUpdate, forceUpdate, getAssetPath, getElement, getHostRef, getMode, getRegistry, getRenderingRef, getShadowRoot, getValue, h, injectSideEffectStyle, isMemberInElement, jsx, jsxDEV, jsxs, loadModule, modeResolutionChain, needsScopedSSR, nextTick, normalizeWatchers, parsePropertyValue, plt, postUpdateComponent, promiseResolve, proxyComponent, proxyCustomElement, readTask, registerHost, registerInstance, registerSideEffectStyleTarget, render, resolveVar, setAssetPath, setErrorHandler, setLazyLoadBasePath, setMode, setNonce, setPlatformHelpers, setPlatformOptions, setRegistry, setScopedSsr, setTagTransformer, setValue, styles, supportsConstructableStylesheets, supportsListenerOptions, supportsMutableAdoptedStyleSheets, transformTag, unregisterSideEffectStyleTarget, win, writeTask };
+export { AttachInternals, AttrDeserialize, BUILD, Build, Component, Element$1 as Element, Env, Event, Fragment, H, H as HTMLElement, HYDRATED_STYLE_ID, Host, Listen, Method, Mixin, NAMESPACE, Prop, PropSerialize, ReactiveControllerHost, STENCIL_DEV_MODE, State, Watch, addHostEventListeners, bootstrapLazy, cmpModules, connectedCallback, consoleDevError, consoleDevInfo, consoleDevWarn, consoleError, createEvent, defineCustomElement, disconnectedCallback, forceModeUpdate, forceUpdate, getAssetPath, getElement, getHostRef, getMode, getRegistry, getRenderingRef, getShadowRoot, getValue, h, injectSideEffectStyle, isMemberInElement, jsx, jsxDEV, jsxs, loadModule, modeResolver, needsScopedSSR, nextTick, normalizeWatchers, parsePropertyValue, plt, postUpdateComponent, promiseResolve, proxyComponent, proxyCustomElement, readTask, registerHost, registerInstance, registerSideEffectStyleTarget, render, resolveVar, setAssetPath, setErrorHandler, setLazyLoadBasePath, setMode, setNonce, setPlatformHelpers, setPlatformOptions, setRegistry, setScopedSSR, setTagTransformer, setValue, styles, supportsConstructableStylesheets, supportsListenerOptions, supportsMutableAdoptedStyleSheets, transformTag, unregisterSideEffectStyleTarget, win, writeTask };

package/dist/runtime/index.d.ts

@@ -78,7 +78,7 @@ type Ctor<T = {}> = new (...args: any[]) => T;
 declare function Mixin(...mixins: ((base: Ctor) => Ctor)[]): Ctor<{}>;
 //#endregion
 //#region src/runtime/mode.d.ts
-declare const setMode: (handler: ResolutionHandler) => number;
+declare const setMode: (handler: ResolutionHandler) => void;
 declare const getMode: (ref: RuntimeRef) => string;
 //#endregion
 //#region src/runtime/nonce.d.ts
@@ -136,10 +136,9 @@ declare const normalizeWatchers: (raw: ComponentConstructorChangeHandlers | unde
  *
  * @param propValue the new value to coerce to some type
  * @param propType the type of the prop, expressed as a binary number
- * @param isFormAssociated whether the component is form-associated (optional)
  * @returns the parsed/coerced value
  */
-declare const parsePropertyValue: (propValue: unknown, propType: number, isFormAssociated?: boolean) => any;
+declare const parsePropertyValue: (propValue: unknown, propType: number) => any;
 //#endregion
 //#region src/runtime/platform-options.d.ts
 interface SetPlatformOptions {

package/dist/runtime/index.js

@@ -371,7 +371,7 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
 //#endregion
 //#region src/client/client-style.ts
 const styles = /*@__PURE__*/ new Map();
-const modeResolutionChain = [];
+const modeResolver = [];
 const needsScopedSSR = () => false;
 //#endregion
 //#region src/runtime/runtime-constants.ts
@@ -1719,10 +1719,10 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialR
 		const isComplex = isComplexType(newValue);
 		if (!BUILD.lazyLoad) {
 			const isStandardAttr = ln.startsWith("aria-") || ln.startsWith("data-");
-			if (!isProp && !isStandardAttr && elm.tagName?.includes("-") && elm.tagName !== "SLOT-FB" && typeof customElements !== "undefined" && !customElements.get(elm.tagName.toLowerCase())) {
+			if (!isProp && !isStandardAttr && elm.tagName?.includes("-") && elm.tagName !== "SLOT-FB" && !customElements.get(elm.tagName.toLowerCase())) {
 				if (!elm["s-pp"]) elm["s-pp"] = /* @__PURE__ */ new Map();
 				elm["s-pp"].set(memberName, newValue);
-				return;
+				if (isComplex || /[A-Z]/.test(memberName)) return;
 			}
 		}
 		if ((isProp || isComplex && newValue !== null) && !isSvg) try {
@@ -4000,8 +4000,11 @@ const scopeCss = (cssText, scopeId, commentOriginalSelector) => {
 };
 //#endregion
 //#region src/runtime/mode.ts
-const computeMode = (elm) => modeResolutionChain.map((h) => h(elm)).find((m) => !!m);
-const setMode = (handler) => modeResolutionChain.push(handler);
+const computeMode = (elm) => modeResolver.map((h) => h(elm)).find((m) => !!m);
+const setMode = (handler) => {
+	modeResolver.length = 0;
+	modeResolver.push(handler);
+};
 const getMode = (ref) => getHostRef(ref)?.$modeName$;
 //#endregion
 //#region src/runtime/normalize-watchers.ts
@@ -4066,23 +4069,14 @@ const normalizeWatchers = (raw) => {
 *
 * @param propValue the new value to coerce to some type
 * @param propType the type of the prop, expressed as a binary number
-* @param isFormAssociated whether the component is form-associated (optional)
 * @returns the parsed/coerced value
 */
-const parsePropertyValue = (propValue, propType, isFormAssociated) => {
+const parsePropertyValue = (propValue, propType) => {
 	if (propValue != null && !isComplexType(propValue)) {
 		/**
 		* 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) return propValue === "" || !!propValue;
 		/**
 		* force it to be a number
 		*/
@@ -4124,7 +4118,7 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
 	if (BUILD.signalBacking) {
 		const sig = hostRef?.$signalValues$?.get(propName);
 		if (sig !== void 0) {
-			const parsed = parsePropertyValue(newVal, cmpMeta.$members$[propName][0], BUILD.formAssociated && !!(cmpMeta.$flags$ & CMP_FLAGS.formAssociated));
+			const parsed = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]);
 			if (BUILD.serializer && BUILD.reflect && cmpMeta.$attrsToReflect$ && cmpMeta.$serializers$?.[propName]) {
 				const elm = BUILD.lazyLoad ? hostRef.$hostElement$ : ref;
 				applySerializers(hostRef, cmpMeta, propName, parsed, BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm);
@@ -4142,7 +4136,7 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
 	const oldVal = hostRef.$instanceValues$.get(propName);
 	const flags = hostRef.$flags$;
 	const instance = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
-	newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0], BUILD.formAssociated && !!(cmpMeta.$flags$ & CMP_FLAGS.formAssociated));
+	newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]);
 	const didValueChange = newVal !== oldVal && !(Number.isNaN(oldVal) && Number.isNaN(newVal));
 	if ((!BUILD.lazyLoad || !(flags & HOST_FLAGS.isConstructingInstance) || oldVal === void 0) && didValueChange) {
 		hostRef.$instanceValues$.set(propName, newVal);
@@ -4191,6 +4185,22 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
 */
 const reflectedAttrValue = (propValue) => propValue == null || propValue === false ? null : propValue === true ? "" : String(propValue);
 /**
+* Hand values written to a lazy component's element before its instance existed to the
+* instance's own `@Prop` setters. Must run as soon as the instance is constructed, so that
+* whenever `$lazyInstance$` is set, reads through it agree with the element's last write.
+*
+* @param hostRef the runtime bookkeeping object of a freshly constructed lazy instance
+* @param cmpMeta runtime metadata for the component (with any run-time only setters flagged)
+*/
+const replayPendingSetterValues = (hostRef, cmpMeta) => {
+	const instance = hostRef.$lazyInstance$;
+	if (!instance) return;
+	for (const [memberName, [memberFlags]] of Object.entries(cmpMeta.$members$ ?? {})) if (memberFlags & MEMBER_FLAGS.Setter && hostRef.$instanceValues$.has(memberName)) {
+		const pendingValue = hostRef.$instanceValues$.get(memberName);
+		if (instance[memberName] !== pendingValue) instance[memberName] = pendingValue;
+	}
+};
+/**
 * Attach a series of runtime constructs to a compiled Stencil component
 * constructor, including getters and setters for the `@Prop` and `@State`
 * decorators, callbacks for when attributes change, and so on.
@@ -4247,9 +4257,8 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 						if (BUILD.lazyLoad) {
 							if ((cmpMeta.$members$[memberName][0] & MEMBER_FLAGS.Getter) === 0) return getValue(this, memberName);
 							const ref = getHostRef(this);
-							const instance = ref ? ref.$lazyInstance$ : prototype;
-							if (!instance) return;
-							return instance[memberName];
+							if (!ref) return prototype[memberName];
+							return ref.$lazyInstance$ ? ref.$lazyInstance$[memberName] : getValue(this, memberName);
 						}
 						if (!BUILD.lazyLoad) return origGetter ? origGetter.apply(this) : getValue(this, memberName);
 					},
@@ -4264,7 +4273,7 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 					}
 					if (origSetter) {
 						if (typeof (memberFlags & MEMBER_FLAGS.State ? this[memberName] : ref.$hostElement$[memberName]) === "undefined" && ref.$instanceValues$.get(memberName)) newValue = ref.$instanceValues$.get(memberName);
-						origSetter.apply(this, [parsePropertyValue(newValue, memberFlags, BUILD.formAssociated && !!(cmpMeta.$flags$ & CMP_FLAGS.formAssociated))]);
+						origSetter.apply(this, [parsePropertyValue(newValue, memberFlags)]);
 						newValue = memberFlags & MEMBER_FLAGS.State ? this[memberName] : ref.$hostElement$[memberName];
 						setValue(this, memberName, newValue, cmpMeta);
 						return;
@@ -4276,26 +4285,15 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 					if (BUILD.lazyLoad) {
 						if ((flags & PROXY_FLAGS.isElementConstructor) === 0 || (cmpMeta.$members$[memberName][0] & MEMBER_FLAGS.Setter) === 0) {
 							setValue(this, memberName, newValue, cmpMeta);
-							if (flags & PROXY_FLAGS.isElementConstructor && !ref.$lazyInstance$) ref.$fetchedCbList$.push(() => {
-								if (cmpMeta.$members$[memberName][0] & MEMBER_FLAGS.Setter && ref.$lazyInstance$[memberName] !== ref.$instanceValues$.get(memberName)) ref.$lazyInstance$[memberName] = newValue;
-							});
 							return;
 						}
-						const parsedValue = parsePropertyValue(newValue, memberFlags, BUILD.formAssociated && !!(cmpMeta.$flags$ & CMP_FLAGS.formAssociated));
-						const setterSetVal = (val) => {
+						const parsedValue = parsePropertyValue(newValue, memberFlags);
+						if (ref.$lazyInstance$) {
 							const currentValue = ref.$lazyInstance$[memberName];
 							if (!ref.$instanceValues$.get(memberName) && currentValue) ref.$instanceValues$.set(memberName, currentValue);
-							ref.$lazyInstance$[memberName] = val;
+							ref.$lazyInstance$[memberName] = parsedValue;
 							setValue(this, memberName, ref.$lazyInstance$[memberName], cmpMeta);
-						};
-						if (ref.$lazyInstance$) setterSetVal(parsedValue);
-						else {
-							ref.$instanceValues$.set(memberName, parsedValue);
-							ref.$fetchedCbList$.push(() => {
-								const pendingValue = ref.$instanceValues$.get(memberName);
-								if (ref.$lazyInstance$[memberName] !== pendingValue) setterSetVal(pendingValue);
-							});
-						}
+						} else ref.$instanceValues$.set(memberName, parsedValue);
 					}
 				} });
 			} else if (BUILD.lazyLoad && BUILD.method && flags & PROXY_FLAGS.isElementConstructor && memberFlags & MEMBER_FLAGS.Method) Object.defineProperty(prototype, memberName, { value(...args) {
@@ -4347,10 +4345,12 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 					const isBooleanTarget = propMemberFlags & MEMBER_FLAGS.Boolean;
 					if (BUILD.reflect && propMemberFlags & MEMBER_FLAGS.ReflectAttr && propMemberFlags & MEMBER_FLAGS.Any && !isComplexType(this[propName]) && reflectedAttrValue(this[propName]) === newValue) return;
 					const isSpuriousBooleanRemoval = isBooleanTarget && newValue === null && this[propName] === void 0;
-					if (isBooleanTarget) newValue = !(newValue === null || newValue === "false");
-					const currentValue = BUILD.lazyLoad && propMemberFlags & MEMBER_FLAGS.Setter ? hostRef.$instanceValues$.get(propName) : this[propName];
+					if (isBooleanTarget) {
+						if (BUILD.isDev && newValue === "false") consoleDevWarn(`<${cmpMeta.$tagName$} ${attrName}="false">: boolean attributes are true when present, regardless of value. Remove the attribute or set the "${propName}" property to false instead.`);
+						newValue = newValue !== null;
+					}
 					const propDesc = Object.getOwnPropertyDescriptor(prototype, propName);
-					if (!isSpuriousBooleanRemoval && newValue != currentValue && (!propDesc.get || !!propDesc.set)) this[propName] = newValue;
+					if (!isSpuriousBooleanRemoval && newValue != this[propName] && (!propDesc.get || !!propDesc.set)) this[propName] = newValue;
 				});
 			};
 			Cstr.observedAttributes = Array.from(/* @__PURE__ */ new Set([...Object.keys(cmpMeta.$watchers$ ?? {}), ...members.filter(([_, m]) => m[0] & MEMBER_FLAGS.HasAttribute).map(([propName, m]) => {
@@ -4411,7 +4411,10 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
 				} catch (e) {
 					consoleError(e, elm);
 				}
-				if (BUILD.member) hostRef.$flags$ &= ~HOST_FLAGS.isConstructingInstance;
+				if (BUILD.member) {
+					hostRef.$flags$ &= ~HOST_FLAGS.isConstructingInstance;
+					replayPendingSetterValues(hostRef, cmpMeta);
+				}
 				endNewInstance();
 				if (BUILD.asyncLoading && hostRef.$ancestorComponent$) await awaitAncestorConnected(hostRef.$ancestorComponent$);
 				if (!(BUILD.slotRelocation && cmpMeta.$flags$ & CMP_FLAGS.hasSlotRelocation)) {
@@ -4631,48 +4634,45 @@ const hmrStandalone = async (hostElement, cmpMeta, hmrVersionId) => {
 			`${modulePath}?s-hmr=${hmrVersionId}`
 );
 		const NewClass = Object.values(newModule).find((v) => typeof v === "function" && v.is === cmpMeta.$tagName$) ?? newModule.default;
-		if (!NewClass) return;
-		const ctor = customElements.get(cmpMeta.$tagName$);
-		if (ctor) {
-			for (const key of Object.getOwnPropertyNames(NewClass.prototype)) {
-				if (key === "constructor") continue;
-				Object.defineProperty(ctor.prototype, key, Object.getOwnPropertyDescriptor(NewClass.prototype, key));
-			}
-			const styleDesc = Object.getOwnPropertyDescriptor(NewClass, "style");
-			if (styleDesc) {
-				Object.defineProperty(ctor, "style", styleDesc);
-				const newStyle = NewClass.style;
-				if (newStyle) {
-					const scopeId = getScopeId(cmpMeta);
-					const isShadow = !!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation);
-					console.log("[stencil-hmr] registerStyle", {
-						tag: cmpMeta.$tagName$,
-						scopeId,
-						isShadow,
-						cssLen: newStyle.length
-					});
-					registerStyle(scopeId, newStyle, isShadow);
-				}
-			}
-		}
-		const isShadow = !!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation);
-		document.querySelectorAll(cmpMeta.$tagName$).forEach((el) => {
-			const hostRef = getHostRef(el);
-			if (BUILD.hostListener && hostRef?.$rmListeners$) {
-				hostRef.$rmListeners$.map((rmListener) => rmListener());
-				hostRef.$rmListeners$ = void 0;
-				addHostEventListeners(el, hostRef, cmpMeta.$listeners$);
-			}
-			if (!isShadow && hostRef) {
-				console.log("[stencil-hmr] calling attachStyles for", cmpMeta.$tagName$);
-				attachStyles(hostRef);
-			}
-			forceUpdate(el);
-		});
+		if (NewClass) hmrApplyClass(cmpMeta, NewClass);
 	} catch (e) {
 		console.error(`[Stencil HMR] Failed to reload <${cmpMeta.$tagName$}>`, e);
 	}
 };
+/**
+* Patch a re-executed component class onto the registered one and re-render every live instance.
+* Shared by the standalone re-import above and bundlers that re-execute the module themselves
+* (webpack/rspack `module.hot`), which reach it via the constructor's `s-hmr-apply` hook.
+*
+* @param cmpMeta runtime metadata for the component
+* @param NewClass the component's newly executed class
+*/
+const hmrApplyClass = (cmpMeta, NewClass) => {
+	const ctor = customElements.get(cmpMeta.$tagName$);
+	const isShadow = !!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation);
+	if (ctor && ctor !== NewClass) {
+		for (const key of Object.getOwnPropertyNames(NewClass.prototype)) {
+			if (key === "constructor") continue;
+			Object.defineProperty(ctor.prototype, key, Object.getOwnPropertyDescriptor(NewClass.prototype, key));
+		}
+		const styleDesc = Object.getOwnPropertyDescriptor(NewClass, "style");
+		if (styleDesc) {
+			Object.defineProperty(ctor, "style", styleDesc);
+			const newStyle = NewClass.style;
+			if (newStyle) registerStyle(getScopeId(cmpMeta), newStyle, isShadow);
+		}
+	}
+	document.querySelectorAll(cmpMeta.$tagName$).forEach((el) => {
+		const hostRef = getHostRef(el);
+		if (BUILD.hostListener && hostRef?.$rmListeners$) {
+			hostRef.$rmListeners$.map((rmListener) => rmListener());
+			hostRef.$rmListeners$ = void 0;
+			addHostEventListeners(el, hostRef, cmpMeta.$listeners$);
+		}
+		if (!isShadow && hostRef) attachStyles(hostRef);
+		forceUpdate(el);
+	});
+};
 //#endregion
 //#region src/runtime/bootstrap-standalone.ts
 const defineCustomElement = (Cstr, compactMeta) => {
@@ -4695,9 +4695,12 @@ const proxyCustomElement = (Cstr, compactMeta) => {
 			cmpMeta.$serializers$ = Cstr.$serializers$;
 		}
 		if (BUILD.reflect) cmpMeta.$attrsToReflect$ = [];
-		if (BUILD.hotModuleReplacement) Cstr.prototype["s-hmr"] = function(hmrVersionId) {
-			hmrStart(this, cmpMeta, hmrVersionId);
-		};
+		if (BUILD.hotModuleReplacement) {
+			Cstr.prototype["s-hmr"] = function(hmrVersionId) {
+				hmrStart(this, cmpMeta, hmrVersionId);
+			};
+			Cstr["s-hmr-apply"] = (NewClass) => hmrApplyClass(cmpMeta, NewClass);
+		}
 		if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && (BUILD.slotCloneNode || BUILD.patchClone && cmpMeta.$flags$ & CMP_FLAGS.patchClone)) patchCloneNode(Cstr.prototype);
 		if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && cmpMeta.$flags$ & CMP_FLAGS.hasSlot) {
 			if (BUILD.lightDomPatches || BUILD.patchAll && cmpMeta.$flags$ & CMP_FLAGS.patchAll) applyLightDomPatches(Cstr.prototype);