npm - @stencil/core - Versions diffs - 5.0.0-alpha.3 → 5.0.0-alpha.5 - Mend

@stencil/core 5.0.0-alpha.3 → 5.0.0-alpha.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (36) hide show

package/dist/{client-CSm3x5ke.mjs → client-Dnio47yQ.mjs} +108 -19
package/dist/compiler/index.d.mts +2 -2
package/dist/compiler/index.mjs +2 -2
package/dist/compiler/utils/index.d.mts +2 -2
package/dist/compiler/utils/index.mjs +3 -3
package/dist/{compiler-D6iP7Bzb.mjs → compiler-Dxri2g8Z.mjs} +14994 -14303
package/dist/declarations/stencil-public-compiler.d.ts +342 -132
package/dist/declarations/stencil-public-compiler.js +2 -3
package/dist/declarations/stencil-public-runtime.d.ts +2 -0
package/dist/{index-hS-KBdAP.d.ts → index-D-XN9HW_.d.ts} +1 -1
package/dist/{index-tUR6pD3J.d.mts → index-D5zaocDq.d.mts} +411 -189
package/dist/{index-CyrGY82h.d.ts → index-D61XZw0f.d.ts} +2 -2
package/dist/{index-CXHCTQNt.d.mts → index-Dat4djoo.d.mts} +5 -1
package/dist/index.mjs +1 -1
package/dist/{jsx-runtime-DlDkTqps.d.ts → jsx-runtime-B3vQbWIW.d.ts} +1 -1
package/dist/jsx-runtime.d.ts +1 -1
package/dist/jsx-runtime.js +1 -1
package/dist/{node-Bg-mO5dw.mjs → node-pj6rF4Wt.mjs} +66 -69
package/dist/{regular-expression-D5pGVpCu.mjs → regular-expression-D0_N0PGa.mjs} +44 -26
package/dist/runtime/app-data/index.d.ts +1 -1
package/dist/runtime/client/index.d.ts +45 -8
package/dist/runtime/client/index.js +132 -40
package/dist/runtime/index.d.ts +33 -5
package/dist/runtime/index.js +2 -2
package/dist/runtime/server/index.d.mts +72 -28
package/dist/runtime/server/index.mjs +146 -46
package/dist/runtime/server/runner.d.mts +40 -26
package/dist/runtime/server/runner.mjs +28 -22
package/dist/{runtime-BBCnuprF.js → runtime-CKyUrF4i.js} +131 -39
package/dist/sys/node/index.d.mts +1 -1
package/dist/sys/node/index.mjs +1 -1
package/dist/sys/node/worker.mjs +2 -2
package/dist/testing/index.d.mts +2 -2
package/dist/testing/index.mjs +17 -16
package/dist/{validation-Byxie0Uk.mjs → validation-BA8nzXu_.mjs} +82 -58
package/package.json +11 -12

package/dist/runtime/server/runner.d.mts CHANGED Viewed

@@ -7,7 +7,7 @@ type ResolutionHandler = (elm: HTMLElement) => string | undefined | null;
 type TagTransformer = (tag: string) => string;
 //#endregion
 //#region src/declarations/stencil-public-compiler.d.ts
-interface HydrateDocumentOptions {
+interface SsrDocumentOptions {
   /**
    * Build ID that will be added to `<html data-stencil-build="BUILD_ID">`. By default
    * a random ID will be generated
@@ -24,7 +24,7 @@ interface HydrateDocumentOptions {
    * JavaScript to read the structure of the HTML and rebuild each
    * component. Defaults to `true`.
    */
-  clientHydrateAnnotations?: boolean;
+  clientSsrAnnotations?: boolean;
   /**
    * Constrain `setTimeout()` to 1ms, but still async. Also
    * only allows `setInterval()` to fire once, also constrained to 1ms.
@@ -123,10 +123,14 @@ interface HydrateDocumentOptions {
     default: 'declarative-shadow-dom' | 'scoped';
   } | boolean;
 }
-interface SerializeDocumentOptions extends HydrateDocumentOptions {
+interface SerializeDocumentOptions extends SsrDocumentOptions {
   /**
    * Runs after the `document` has been hydrated.
    */
+  afterSsr?(document: any): any | Promise<any>;
+  /**
+   * @deprecated Use `afterSsr` instead.
+   */
   afterHydrate?(document: any): any | Promise<any>;
   /**
    * Sets an approximate line width the HTML should attempt to stay within.
@@ -139,6 +143,10 @@ interface SerializeDocumentOptions extends HydrateDocumentOptions {
   /**
    * Runs before the `document` has been hydrated.
    */
+  beforeSsr?(document: any): any | Promise<any>;
+  /**
+   * @deprecated Use `beforeSsr` instead.
+   */
   beforeHydrate?(document: any): any | Promise<any>;
   /**
    * Format the HTML in a nicely indented format.
@@ -176,7 +184,7 @@ interface SerializeDocumentOptions extends HydrateDocumentOptions {
    */
   modes?: ResolutionHandler[];
 }
-interface HydrateFactoryOptions extends SerializeDocumentOptions {
+interface SsrFactoryOptions extends SerializeDocumentOptions {
   serializeToHtml: boolean;
   destroyWindow: boolean;
   destroyDocument: boolean;
@@ -204,7 +212,7 @@ interface PrintLine {
   errorCharStart: number;
   errorLength?: number;
 }
-interface HydrateResults {
+interface SsrResults {
   buildId: string;
   diagnostics: Diagnostic[];
   url: string;
@@ -216,42 +224,42 @@ interface HydrateResults {
   search: string | null;
   hash: string | null;
   html: string | null;
-  components: HydrateComponent[];
-  anchors: HydrateAnchorElement[];
-  imgs: HydrateImgElement[];
-  scripts: HydrateScriptElement[];
-  styles: HydrateStyleElement[];
-  staticData: HydrateStaticData[];
+  components: SsrComponent[];
+  anchors: SsrAnchorElement[];
+  imgs: SsrImgElement[];
+  scripts: SsrScriptElement[];
+  styles: SsrStyleElement[];
+  staticData: SsrStaticData[];
   title: string | null;
   hydratedCount: number;
   httpStatus: number | null;
 }
-interface HydrateComponent {
+interface SsrComponent {
   tag: string;
   mode: string;
   count: number;
   depth: number;
 }
-interface HydrateElement {
+interface SsrElement {
   [attrName: string]: string | undefined;
 }
-interface HydrateAnchorElement extends HydrateElement {
+interface SsrAnchorElement extends SsrElement {
   href?: string;
   target?: string;
 }
-interface HydrateImgElement extends HydrateElement {
+interface SsrImgElement extends SsrElement {
   src?: string;
 }
-interface HydrateScriptElement extends HydrateElement {
+interface SsrScriptElement extends SsrElement {
   src?: string;
   type?: string;
 }
-interface HydrateStyleElement extends HydrateElement {
+interface SsrStyleElement extends SsrElement {
   id?: string;
   href?: string;
   content?: string;
 }
-interface HydrateStaticData {
+interface SsrStaticData {
   id: string;
   type: string;
   content: string;
@@ -265,7 +273,7 @@ interface HydrateStaticData {
  * @param options - serialization options
  * @returns the hydration results
  */
-declare function renderToString(html: string | any, options?: SerializeDocumentOptions): Promise<HydrateResults>;
+declare function renderToString(html: string | any, options?: SerializeDocumentOptions): Promise<SsrResults>;
 /**
  * Renders HTML and returns a Node.js Readable stream.
  * This is a Node.js-specific convenience wrapper around renderToString.
@@ -276,20 +284,26 @@ declare function renderToString(html: string | any, options?: SerializeDocumentO
  */
 declare function streamToString(html: string | any, options?: SerializeDocumentOptions): Readable;
 /**
- * Hydrates a document or HTML string, returning the full hydration results.
+ * Server side renders a document or HTML string, returning the full render results.
  * This is portable (no Node.js dependencies).
- * @param doc - the document or HTML string to hydrate
+ * @param doc - the document or HTML string to render
  * @param options - hydration options
- * @returns the hydration results
+ * @returns the render results
+ */
+declare function ssrDocument(doc: any | string, options?: SsrDocumentOptions): Promise<SsrResults>;
+/**
+ * v4 Compat
+ * @alias
+ * @deprecated Use `ssrDocument()` instead
  */
-declare function hydrateDocument(doc: any | string, options?: HydrateDocumentOptions): Promise<HydrateResults>;
-declare function serializeDocumentToString(doc: Document, opts: HydrateFactoryOptions): string;
+declare const hydrateDocument: typeof ssrDocument;
+declare function serializeDocumentToString(doc: Document, opts: SsrFactoryOptions): string;
 //#endregion
 //#region src/server/runner/window-initialize.d.ts
 /**
  * Reset the docData counters. Useful for testing to ensure deterministic IDs.
  */
-declare function resetHydrateDocData(): void;
+declare function resetSsrDocData(): void;
 //#endregion
 //#region src/runtime/tag-transform.d.ts
 /**
@@ -304,4 +318,4 @@ declare function transformTag<T extends string>(tag: T): T;
  */
 declare function setTagTransformer(transformer: TagTransformer): void;
 //#endregion
-export { createWindowFromHtml, hydrateDocument, renderToString, resetHydrateDocData, serializeDocumentToString, setTagTransformer, streamToString, transformTag };
+export { createWindowFromHtml, hydrateDocument, renderToString, resetSsrDocData, serializeDocumentToString, setTagTransformer, ssrDocument, streamToString, transformTag };

package/dist/runtime/server/runner.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import { Readable } from "node:stream";
-import { hydrateFactory } from "@stencil/core/runtime/server/hydrate-factory";
+import { ssrFactory } from "@stencil/core/runtime/server/ssr-factory";
 import { BUILD } from "@stencil/core/runtime/app-data";
 //#region ../../node_modules/.pnpm/parse5@7.2.1/node_modules/parse5/dist/common/unicode.js
 const UNDEFINED_CODE_POINTS = new Set([
@@ -8899,7 +8899,7 @@ function insertBefore(parentNode, newNode, referenceNode) {
 var MockHTMLElement = class extends MockElement {
 	__namespaceURI = "http://www.w3.org/1999/xhtml";
 	constructor(ownerDocument, nodeName) {
-		super(ownerDocument, typeof nodeName === "string" ? nodeName.toUpperCase() : null);
+		super(ownerDocument, nodeName ? nodeName.toUpperCase() : null);
 	}
 	get tagName() {
 		return this.nodeName ?? "";
@@ -13300,7 +13300,7 @@ function normalizeHydrateOptions(inputOpts) {
 		destroyWindow: false,
 		destroyDocument: false
 	}, inputOpts || {});
-	if (typeof outputOpts.clientHydrateAnnotations !== "boolean") outputOpts.clientHydrateAnnotations = true;
+	if (typeof outputOpts.clientSsrAnnotations !== "boolean") outputOpts.clientSsrAnnotations = true;
 	if (typeof outputOpts.constrainTimeouts !== "boolean") outputOpts.constrainTimeouts = true;
 	if (typeof outputOpts.maxHydrateCount !== "number") outputOpts.maxHydrateCount = 300;
 	if (typeof outputOpts.runtimeLogging !== "boolean") outputOpts.runtimeLogging = false;
@@ -13319,7 +13319,7 @@ function mapValidTags(tag) {
 }
 function generateHydrateResults(opts) {
 	if (typeof opts.url !== "string") opts.url = `https://hydrate.stenciljs.com/`;
-	if (typeof opts.buildId !== "string") opts.buildId = createHydrateBuildId();
+	if (typeof opts.buildId !== "string") opts.buildId = createSsrBuildId();
 	const results = {
 		buildId: opts.buildId,
 		diagnostics: [],
@@ -13357,7 +13357,7 @@ function generateHydrateResults(opts) {
 	}
 	return results;
 }
-const createHydrateBuildId = () => {
+const createSsrBuildId = () => {
 	let chars = "abcdefghijklmnopqrstuvwxyz";
 	let buildId = "";
 	while (buildId.length < 8) {
@@ -13447,7 +13447,7 @@ const docData = {
 /**
 * Reset the docData counters. Useful for testing to ensure deterministic IDs.
 */
-function resetHydrateDocData() {
+function resetSsrDocData() {
 	docData.hostIds = 0;
 	docData.rootLevelIds = 0;
 	docData.staticComponents.clear();
@@ -13510,7 +13510,7 @@ function renderToString(html, options) {
 	* Make sure we wait for components to be hydrated.
 	*/
 	opts.constrainTimeouts = false;
-	return hydrateDocument(html, opts);
+	return ssrDocument(html, opts);
 }
 /**
 * Renders HTML and returns a Node.js Readable stream.
@@ -13527,13 +13527,13 @@ function streamToString(html, options) {
 	return Readable.from(generateStream());
 }
 /**
-* Hydrates a document or HTML string, returning the full hydration results.
+* Server side renders a document or HTML string, returning the full render results.
 * This is portable (no Node.js dependencies).
-* @param doc - the document or HTML string to hydrate
+* @param doc - the document or HTML string to render
 * @param options - hydration options
-* @returns the hydration results
+* @returns the render results
 */
-function hydrateDocument(doc, options) {
+function ssrDocument(doc, options) {
 	const opts = normalizeHydrateOptions(options);
 	/**
 	* Defines whether we render the shadow root as a declarative shadow root or as scoped shadow root.
@@ -13566,6 +13566,12 @@ function hydrateDocument(doc, options) {
 	renderBuildError(results, `Invalid html or document. Must be either a valid "html" string, or DOM "document".`);
 	return Promise.resolve(results);
 }
+/**
+* v4 Compat
+* @alias
+* @deprecated Use `ssrDocument()` instead
+*/
+const hydrateDocument = ssrDocument;
 async function render(win, opts, results) {
 	if ("process" in globalThis && typeof process.on === "function" && !process.__stencilErrors) {
 		process.__stencilErrors = true;
@@ -13574,7 +13580,7 @@ async function render(win, opts, results) {
 		});
 	}
 	initializeWindow(win, win.document, opts, results);
-	const beforeHydrateFn = typeof opts.beforeHydrate === "function" ? opts.beforeHydrate : NOOP;
+	const beforeHydrateFn = typeof (opts.beforeSsr || opts.beforeHydrate) === "function" ? opts.beforeSsr || opts.beforeHydrate : NOOP;
 	try {
 		await Promise.resolve(beforeHydrateFn(win.document));
 		return new Promise((resolve) => {
@@ -13586,24 +13592,24 @@ async function render(win, opts, results) {
 				modeResolutionChain.length = 0;
 				opts.modes.forEach((mode) => setMode(mode));
 			}
-			return hydrateFactory(win, opts, results, afterHydrate, resolve);
+			return ssrFactory(win, opts, results, afterSsr, resolve);
 		});
 	} catch (e) {
 		renderCatchError(results, e);
-		return finalizeHydrate(win, win.document, opts, results);
+		return finalizeSsr(win, win.document, opts, results);
 	}
 }
-async function afterHydrate(win, opts, results, resolve) {
-	const afterHydrateFn = typeof opts.afterHydrate === "function" ? opts.afterHydrate : NOOP;
+async function afterSsr(win, opts, results, resolve) {
+	const afterSsrFn = typeof (opts.afterSsr || opts.afterHydrate) === "function" ? opts.afterSsr || opts.afterHydrate : NOOP;
 	try {
-		await Promise.resolve(afterHydrateFn(win.document));
-		return resolve(finalizeHydrate(win, win.document, opts, results));
+		await Promise.resolve(afterSsrFn(win.document));
+		return resolve(finalizeSsr(win, win.document, opts, results));
 	} catch (e) {
 		renderCatchError(results, e);
-		return resolve(finalizeHydrate(win, win.document, opts, results));
+		return resolve(finalizeSsr(win, win.document, opts, results));
 	}
 }
-function finalizeHydrate(win, doc, opts, results) {
+function finalizeSsr(win, doc, opts, results) {
 	try {
 		inspectElement(results, doc.documentElement, 0);
 		if (opts.removeUnusedStyles !== false) try {
@@ -13642,7 +13648,7 @@ function finalizeHydrate(win, doc, opts, results) {
 		} catch (e) {
 			renderCatchError(results, e);
 		}
-		if (opts.clientHydrateAnnotations) doc.documentElement.classList.add("hydrated");
+		if (opts.clientSsrAnnotations) doc.documentElement.classList.add("hydrated");
 		if (opts.serializeToHtml) results.html = serializeDocumentToString(doc, opts);
 	} catch (e) {
 		renderCatchError(results, e);
@@ -13687,4 +13693,4 @@ function removeScripts(elm) {
 	}
 }
 //#endregion
-export { createWindowFromHtml, hydrateDocument, renderToString, resetHydrateDocData, serializeDocumentToString, setTagTransformer, streamToString, transformTag };
+export { createWindowFromHtml, hydrateDocument, renderToString, resetSsrDocData, serializeDocumentToString, setTagTransformer, ssrDocument, streamToString, transformTag };

package/dist/{runtime-BBCnuprF.js → runtime-CKyUrF4i.js} RENAMED Viewed

@@ -1309,7 +1309,8 @@ const addStyle = (styleContainerNode, cmpMeta, mode) => {
 				styleElm.textContent = style;
 				const nonce = plt.$nonce$ ?? queryNonceMetaTagContent(win.document);
 				if (nonce != null) styleElm.setAttribute("nonce", nonce);
-				if ((BUILD.hydrateServerSide || BUILD.hotModuleReplacement) && (cmpMeta.$flags$ & CMP_FLAGS.scopedCssEncapsulation || cmpMeta.$flags$ & CMP_FLAGS.shadowNeedsScopedCss || cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation)) styleElm.setAttribute(HYDRATED_STYLE_ID, scopeId);
+				if (BUILD.hydrateServerSide && (cmpMeta.$flags$ & CMP_FLAGS.scopedCssEncapsulation || cmpMeta.$flags$ & CMP_FLAGS.shadowNeedsScopedCss || cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) || BUILD.hotModuleReplacement) styleElm.setAttribute(HYDRATED_STYLE_ID, scopeId);
+				if (BUILD.hotModuleReplacement && cmpMeta.$flags$ & CMP_FLAGS.hasSlotRelocation) styleElm.setAttribute("data-slot-fb", "");
 				/**
 				* attach styles at the end of the head tag if we render scoped components
 				*/
@@ -2420,6 +2421,46 @@ const computeMode = (elm) => modeResolutionChain.map((h) => h(elm)).find((m) =>
 const setMode = (handler) => modeResolutionChain.push(handler);
 const getMode = (ref) => getHostRef(ref)?.$modeName$;
 //#endregion
+//#region src/runtime/normalize-watchers.ts
+/**
+* Normalizes watcher metadata to the current `{ [methodName]: flags }[]` format.
+*
+* Prior to Stencil 4.39.x (PR #6484), the `@Watch()` compiler emitted watcher
+* handlers as a plain string array: `{ "min": ["minChanged"] }`. The new format
+* wraps each entry in an object that carries option flags (e.g. `immediate`):
+* `{ "min": [{ "minChanged": 0 }] }`.
+*
+* When a library (e.g. Ionic Framework) was compiled with an older Stencil compiler
+* but consumed by an app using a newer Stencil runtime, the runtime's
+* `Object.entries(watcher)` call receives a string and misinterprets its character
+* indices as method names, causing:
+*   `TypeError: instance[watchMethodName] is not a function`
+*
+* This helper should be used at `$watchers$` assignment sites that need to
+* accept both legacy and current compiler metadata so downstream code on those
+* paths can safely assume the new object format.
+*
+* @param raw The raw watcher map from compiled metadata (new or legacy format).
+* @returns A normalized watcher map in the `{ [methodName]: flags }[]` format, or `undefined` if `raw` is `undefined` or empty.
+*/
+const normalizeWatchers = (raw) => {
+	if (!raw) return void 0;
+	const keys = Object.keys(raw);
+	if (keys.length === 0) return void 0;
+	let hasLegacy = false;
+	for (const propName of keys) {
+		if (hasLegacy) break;
+		for (const h of raw[propName]) if (typeof h === "string") {
+			hasLegacy = true;
+			break;
+		}
+	}
+	if (!hasLegacy) return raw;
+	const out = {};
+	for (const propName of keys) out[propName] = raw[propName].map((h) => typeof h === "string" ? { [h]: 0 } : h);
+	return out;
+};
+//#endregion
 //#region src/runtime/parse-property-value.ts
 /**
 * Parse a new property value for a given property type.
@@ -3770,7 +3811,7 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 	});
 	if (BUILD.member && cmpMeta.$members$ || BUILD.propChangeCallback) {
 		if (BUILD.propChangeCallback) {
-			if (Cstr.watchers && !cmpMeta.$watchers$) cmpMeta.$watchers$ = Cstr.watchers;
+			if (Cstr.watchers && !cmpMeta.$watchers$) cmpMeta.$watchers$ = normalizeWatchers(Cstr.watchers);
 			if (Cstr.deserializers && !cmpMeta.$deserializers$) cmpMeta.$deserializers$ = Cstr.deserializers;
 			if (Cstr.serializers && !cmpMeta.$serializers$) cmpMeta.$serializers$ = Cstr.serializers;
 		}
@@ -3875,9 +3916,11 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
 						return;
 					}
 					const propFlags = members.find(([m]) => m === propName);
-					if (propFlags && propFlags[1][0] & MEMBER_FLAGS.Boolean) newValue = newValue !== null && newValue !== "false";
+					const isBooleanTarget = propFlags && propFlags[1][0] & MEMBER_FLAGS.Boolean;
+					const isSpuriousBooleanRemoval = isBooleanTarget && newValue === null && this[propName] === void 0;
+					if (isBooleanTarget) newValue = !(newValue === null || newValue === "false");
 					const propDesc = Object.getOwnPropertyDescriptor(prototype, propName);
-					if (newValue != this[propName] && (!propDesc.get || !!propDesc.set)) this[propName] = newValue;
+					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]) => {
@@ -3918,7 +3961,7 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
 				if (!Cstr) throw new Error(`Constructor for "${cmpMeta.$tagName$}#${hostRef.$modeName$}" was not found`);
 				if (BUILD.member && !Cstr.isProxied) {
 					if (BUILD.propChangeCallback) {
-						cmpMeta.$watchers$ = Cstr.watchers;
+						cmpMeta.$watchers$ = normalizeWatchers(Cstr.watchers);
 						cmpMeta.$serializers$ = Cstr.serializers;
 						cmpMeta.$deserializers$ = Cstr.deserializers;
 					}
@@ -4094,7 +4137,59 @@ const disconnectedCallback = async (elm) => {
 	if (elm.shadowRoot && rootAppliedStyles.has(elm.shadowRoot)) rootAppliedStyles.delete(elm.shadowRoot);
 };
 //#endregion
-//#region src/runtime/bootstrap-custom-element.ts
+//#region src/runtime/hmr-component.ts
+/**
+* Kick off hot-module-replacement for a component. In order to replace the
+* component in-place we:
+*
+* 1. get a reference to the {@link d.HostRef} for the element
+* 2. reset the element's runtime flags
+* 3. re-run the initialization logic for the element (via
+*    {@link initializeComponent})
+*
+* For standalone (non-lazy) builds, we instead re-import the component module
+* and patch the prototype of the registered constructor in-place, then
+* force a re-render of all existing instances in the DOM.
+*
+* @param hostElement the host element for the component which we want to start
+* doing HMR
+* @param cmpMeta runtime metadata for the component
+* @param hmrVersionId the current HMR version ID
+*/
+const hmrStart = (hostElement, cmpMeta, hmrVersionId) => {
+	if (BUILD.lazyLoad) {
+		const hostRef = getHostRef(hostElement);
+		if (!hostRef) return;
+		hostRef.$flags$ = HOST_FLAGS.hasConnected;
+		initializeComponent(hostElement, hostRef, cmpMeta, hmrVersionId);
+	} else hmrStandalone(hostElement, cmpMeta, hmrVersionId);
+};
+const hmrStandalone = async (hostElement, cmpMeta, hmrVersionId) => {
+	const modulePath = hostElement.constructor.__stencil_module__;
+	console.log(`[Stencil HMR] hmrStandalone <${cmpMeta.$tagName$}> modulePath:`, modulePath);
+	if (!modulePath) {
+		console.warn(`[Stencil HMR] No __stencil_module__ on <${cmpMeta.$tagName$}> constructor — was this built with devMode?`);
+		return;
+	}
+	try {
+		const newModule = await import(
+			/* @vite-ignore */
+			`${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));
+		}
+		document.querySelectorAll(cmpMeta.$tagName$).forEach((el) => forceUpdate(el));
+	} catch (e) {
+		console.error(`[Stencil HMR] Failed to reload <${cmpMeta.$tagName$}>`, e);
+	}
+};
+//#endregion
+//#region src/runtime/bootstrap-standalone.ts
 const defineCustomElement = (Cstr, compactMeta) => {
 	customElements.define(transformTag(compactMeta[1]), proxyCustomElement(Cstr, compactMeta));
 };
@@ -4108,12 +4203,15 @@ const proxyCustomElement = (Cstr, compactMeta) => {
 		if (BUILD.member) cmpMeta.$members$ = compactMeta[2];
 		if (BUILD.hostListener) cmpMeta.$listeners$ = compactMeta[3];
 		if (BUILD.propChangeCallback) {
-			cmpMeta.$watchers$ = Cstr.$watchers$;
+			cmpMeta.$watchers$ = normalizeWatchers(Cstr.$watchers$);
 			cmpMeta.$deserializers$ = Cstr.$deserializers$;
 			cmpMeta.$serializers$ = Cstr.$serializers$;
 		}
 		if (BUILD.reflect) cmpMeta.$attrsToReflect$ = [];
 		if (BUILD.shadowDom && !supportsShadow && cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) cmpMeta.$flags$ |= CMP_FLAGS.needsShadowDomShim;
+		if (BUILD.hotModuleReplacement) Cstr.prototype["s-hmr"] = function(hmrVersionId) {
+			hmrStart(this, cmpMeta, hmrVersionId);
+		};
 		if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && cmpMeta.$flags$ & CMP_FLAGS.hasSlot) if (BUILD.experimentalSlotFixes || BUILD.patchAll && cmpMeta.$flags$ & CMP_FLAGS.patchAll) patchPseudoShadowDom(Cstr.prototype);
 		else {
 			if (BUILD.slotChildNodesFix || BUILD.patchChildren && cmpMeta.$flags$ & CMP_FLAGS.patchChildren) patchChildSlotNodes(Cstr.prototype);
@@ -4194,29 +4292,7 @@ const forceModeUpdate = (elm) => {
 	}
 };
 //#endregion
-//#region src/runtime/hmr-component.ts
-/**
-* Kick off hot-module-replacement for a component. In order to replace the
-* component in-place we:
-*
-* 1. get a reference to the {@link d.HostRef} for the element
-* 2. reset the element's runtime flags
-* 3. re-run the initialization logic for the element (via
-*    {@link initializeComponent})
-*
-* @param hostElement the host element for the component which we want to start
-* doing HMR
-* @param cmpMeta runtime metadata for the component
-* @param hmrVersionId the current HMR version ID
-*/
-const hmrStart = (hostElement, cmpMeta, hmrVersionId) => {
-	const hostRef = getHostRef(hostElement);
-	if (!hostRef) return;
-	hostRef.$flags$ = HOST_FLAGS.hasConnected;
-	initializeComponent(hostElement, hostRef, cmpMeta, hmrVersionId);
-};
-//#endregion
-//#region src/runtime/bootstrap-lazy.ts
+//#region src/runtime/bootstrap-loader.ts
 const bootstrapLazy = (lazyBundles, options = {}) => {
 	if (BUILD.profile && performance.mark) performance.mark("st:app:start");
 	installDevTools();
@@ -4250,7 +4326,7 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
 			if (BUILD.hostListener) cmpMeta.$listeners$ = compactMeta[3];
 			if (BUILD.reflect) cmpMeta.$attrsToReflect$ = [];
 			if (BUILD.propChangeCallback) {
-				cmpMeta.$watchers$ = compactMeta[4] ?? {};
+				cmpMeta.$watchers$ = normalizeWatchers(compactMeta[4]);
 				cmpMeta.$serializers$ = compactMeta[5] ?? {};
 				cmpMeta.$deserializers$ = compactMeta[6] ?? {};
 			}
@@ -4406,8 +4482,19 @@ const setPlatformOptions = (opts) => Object.assign(plt, opts);
 //#endregion
 //#region src/runtime/render.ts
 /**
+* A WeakMap to persist HostRef objects across multiple render() calls to the
+* same container. This enables VNode diffing on re-renders — without it, each
+* call creates a fresh HostRef with no previous VNode, causing renderVdom to
+* replace the entire DOM subtree instead of patching only what changed.
+*/
+const hostRefCache = /* @__PURE__ */ new WeakMap();
+/**
 * Method to render a virtual DOM tree to a container element.
 *
+* Supports efficient re-renders: calling `render()` again on the same container
+* will diff the new VNode tree against the previous one and only update what changed,
+* preserving existing DOM elements and their state.
+*
 * @example
 * ```tsx
 * import { render } from '@stencil/core';
@@ -4424,14 +4511,19 @@ const setPlatformOptions = (opts) => Object.assign(plt, opts);
 * @param container - The container element to render the virtual DOM tree to
 */
 function render(vnode, container) {
-	renderVdom({
-		$flags$: 0,
-		$cmpMeta$: {
+	let ref = hostRefCache.get(container);
+	if (!ref) {
+		ref = {
 			$flags$: 0,
-			$tagName$: container.tagName
-		},
-		$hostElement$: container
-	}, vnode);
+			$cmpMeta$: {
+				$flags$: 0,
+				$tagName$: container.tagName
+			},
+			$hostElement$: container
+		};
+		hostRefCache.set(container, ref);
+	}
+	renderVdom(ref, vnode);
 }
 //#endregion
 //#region src/runtime/tag-transform.ts
@@ -4656,4 +4748,4 @@ const insertChildVNodeAnnotations = (doc, vnodeChild, cmpData, hostId, depth, in
 	}
 };
 //#endregion
-export { h as A, postUpdateComponent as C, getMode as D, parsePropertyValue as E, HYDRATED_STYLE_ID as F, getShadowRoot as M, getAssetPath as N, setMode as O, setAssetPath as P, getRenderingRef as S, createEvent as T, connectedCallback as _, transformTag as a, setValue as b, setNonce as c, Fragment as d, bootstrapLazy as f, disconnectedCallback as g, proxyCustomElement as h, setTagTransformer as i, getElement as j, Host as k, Mixin as l, forceModeUpdate as m, jsx as n, render as o, defineCustomElement as p, jsxs as r, setPlatformOptions as s, insertVdomAnnotations as t, addHostEventListeners as u, proxyComponent as v, renderVdom as w, forceUpdate as x, getValue as y };
+export { Host as A, postUpdateComponent as C, normalizeWatchers as D, parsePropertyValue as E, setAssetPath as F, HYDRATED_STYLE_ID as I, getElement as M, getShadowRoot as N, getMode as O, getAssetPath as P, getRenderingRef as S, createEvent as T, connectedCallback as _, transformTag as a, setValue as b, setNonce as c, Fragment as d, bootstrapLazy as f, disconnectedCallback as g, proxyCustomElement as h, setTagTransformer as i, h as j, setMode as k, Mixin as l, forceModeUpdate as m, jsx as n, render as o, defineCustomElement as p, jsxs as r, setPlatformOptions as s, insertVdomAnnotations as t, addHostEventListeners as u, proxyComponent as v, renderVdom as w, forceUpdate as x, getValue as y };

package/dist/sys/node/index.d.mts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { Qr as Logger, gr as CompilerSystem } from "../../index-tUR6pD3J.mjs";
+import { Qr as Logger, _r as CompilerSystem } from "../../index-D5zaocDq.mjs";
 //#region src/sys/node/logger/index.d.ts
 /**

package/dist/sys/node/index.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import { n as setupNodeProcess, r as createNodeLogger, t as createNodeSys } from "../../node-Bg-mO5dw.mjs";
+import { n as setupNodeProcess, r as createNodeLogger, t as createNodeSys } from "../../node-pj6rF4Wt.mjs";
 export { createNodeLogger, createNodeSys, setupNodeProcess };

package/dist/sys/node/worker.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
-import { l as createWorkerMessageHandler } from "../../compiler-D6iP7Bzb.mjs";
-import { t as createNodeSys } from "../../node-Bg-mO5dw.mjs";
+import { l as createWorkerMessageHandler } from "../../compiler-Dxri2g8Z.mjs";
+import { t as createNodeSys } from "../../node-pj6rF4Wt.mjs";
 //#region src/sys/node/node-worker-thread.ts
 /**
 * Initialize a worker thread, setting up various machinery for managing

package/dist/testing/index.d.mts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { B as ComponentCompilerMeta, E as CompilerCtx, Qr as Logger, Rr as Diagnostic, Tt as HostRef, Wt as NewSpecPageOptions, Yr as LoadConfigInit, Zr as LogLevel, a as BuildCtx, ca as RafCallback, da as UserBuildConditionals, ei as LoggerTimeSpan, gr as CompilerSystem, mn as RuntimeRef, na as ValidatedConfig, oa as ErrorHandler, pt as ComponentRuntimeMeta, ta as UnvalidatedConfig, wt as HostElement, yn as SpecPage, zt as Module } from "../index-tUR6pD3J.mjs";
-import { _ as Env, c as getMode, d as Fragment, f as createEvent, g as setAssetPath, h as getAssetPath, i as getRenderingRef, n as h, p as getElement, r as forceUpdate, t as Host, u as Mixin } from "../index-CXHCTQNt.mjs";
+import { B as ComponentCompilerMeta, E as CompilerCtx, Et as HostRef, Lt as NewSpecPageOptions, Mt as Module, Qr as Logger, Tt as HostElement, Yr as LoadConfigInit, Zr as LogLevel, _r as CompilerSystem, a as BuildCtx, aa as ValidatedConfig, da as RafCallback, ei as LoggerTimeSpan, fn as SpecPage, ia as UnvalidatedConfig, la as ErrorHandler, ma as UserBuildConditionals, pt as ComponentRuntimeMeta, sn as RuntimeRef, zr as Diagnostic } from "../index-D5zaocDq.mjs";
+import { _ as Env, c as getMode, d as Fragment, f as createEvent, g as setAssetPath, h as getAssetPath, i as getRenderingRef, n as h, p as getElement, r as forceUpdate, t as Host, u as Mixin } from "../index-Dat4djoo.mjs";
 import { Mock } from "vitest";
 //#region src/testing/testing-logger.d.ts