@stencil/core 5.0.0-alpha.1 → 5.0.0-alpha.11

package/dist/runtime/index.js

@@ -1,2 +1,4795 @@
-import { A as Host, C as postUpdateComponent, D as parsePropertyValue, E as getElement, M as getAssetPath, N as setAssetPath, O as getMode, P as HYDRATED_STYLE_ID, S as getRenderingRef, T as createEvent, _ as connectedCallback, a as transformTag, b as setValue, c as setNonce, d as Fragment, f as bootstrapLazy, g as disconnectedCallback, h as proxyCustomElement, i as setTagTransformer, j as h, k as setMode, l as Mixin, m as forceModeUpdate, n as jsx, o as render, p as defineCustomElement, r as jsxs, s as setPlatformOptions, t as insertVdomAnnotations, u as addHostEventListeners, v as proxyComponent, w as renderVdom, x as forceUpdate, y as getValue } from "../runtime-CF9DJtSu.js";
-export { Fragment, HYDRATED_STYLE_ID, Host, Mixin, addHostEventListeners, bootstrapLazy, connectedCallback, createEvent, defineCustomElement, disconnectedCallback, forceModeUpdate, forceUpdate, getAssetPath, getElement, getMode, getRenderingRef, getValue, h, insertVdomAnnotations, jsx, jsxs, parsePropertyValue, postUpdateComponent, proxyComponent, proxyCustomElement, render, renderVdom, setAssetPath, setMode, setNonce, setPlatformOptions, setTagTransformer, setValue, transformTag };
+import { BUILD } from "../app-data/index.js";
+import "../app-globals/index.js";
+import { effect, effect as effect$1, signal } from "@preact/signals-core";
+//#region src/client/client-build.ts
+const Build = {
+	isDev: BUILD.isDev,
+	isBrowser: true,
+	isServer: false,
+	isTesting: BUILD.isTesting
+};
+const MEMBER_FLAGS = {
+	String: 1,
+	Number: 2,
+	Boolean: 4,
+	Any: 8,
+	Unknown: 16,
+	State: 32,
+	Method: 64,
+	Event: 128,
+	Element: 256,
+	ReflectAttr: 512,
+	Mutable: 1024,
+	Getter: 2048,
+	Setter: 4096,
+	Prop: 31,
+	HasAttribute: 31,
+	PropLike: 63
+};
+const WATCH_FLAGS = { Immediate: 1 };
+const EVENT_FLAGS = {
+	Cancellable: 1,
+	Composed: 2,
+	Bubbles: 4
+};
+const LISTENER_FLAGS = {
+	Passive: 1,
+	Capture: 2,
+	TargetDocument: 4,
+	TargetWindow: 8,
+	TargetBody: 16
+};
+const HOST_FLAGS = {
+	hasConnected: 1,
+	hasRendered: 2,
+	isWaitingForChildren: 4,
+	isConstructingInstance: 8,
+	isQueuedForUpdate: 16,
+	hasInitializedComponent: 32,
+	hasLoadedComponent: 64,
+	isWatchReady: 128,
+	isListenReady: 256,
+	needsRerender: 512,
+	devOnRender: 1024,
+	devOnDidLoad: 2048
+};
+const CF_scopedCssEncapsulation = 2;
+/**
+* A set of flags used for bitwise calculations against {@link ComponentRuntimeMeta#$flags$}.
+*
+* These flags should only be used in conjunction with {@link ComponentRuntimeMeta#$flags$}.
+* They should _not_ be used for calculations against other fields/numbers
+*/
+const CMP_FLAGS = {
+	/**
+	* Used to determine if a component is using the shadow DOM.
+	* e.g. `shadow: true | {}` is set on the `@Component()` decorator
+	*/
+	shadowDomEncapsulation: 1,
+	/**
+	* Used to determine if a component is using scoped stylesheets
+	* e.g. `scoped: true` is set on the `@Component()` decorator
+	*/
+	scopedCssEncapsulation: CF_scopedCssEncapsulation,
+	/**
+	* Used to determine if a component does not use the shadow DOM _and_ has `<slot/>` tags in its markup.
+	*/
+	hasSlotRelocation: 4,
+	/**
+	* Determines if `delegatesFocus` is enabled for a component that uses the shadow DOM.
+	* e.g. `shadow: { delegatesFocus: true }` is set on the `@Component()` decorator
+	*/
+	shadowDelegatesFocus: 16,
+	/**
+	* Determines if `mode` is set on the `@Component()` decorator
+	*/
+	hasMode: 32,
+	/**
+	* Determines if styles must be scoped - i.e. the component uses scoped stylesheets.
+	*/
+	needsScopedEncapsulation: CF_scopedCssEncapsulation,
+	/**
+	* Determines if a component is form-associated or not. This is set based on
+	* options passed to the `@Component` decorator.
+	*/
+	formAssociated: 64,
+	/**
+	* Determines if a `shadow: true` component needs
+	* to have its styles scoped during SSR as opposed to using DSD.
+	*/
+	shadowNeedsScopedCss: 128,
+	/**
+	* Determines if a component has a `<slot>` in its template.
+	*/
+	hasSlot: 256,
+	/**
+	* Determines if a component uses modern class property declarations.
+	*/
+	hasModernPropertyDecls: 512,
+	/**
+	* Determines if `slotAssignment` is set to `'manual'` for a component that uses the shadow DOM.
+	* e.g. `shadow: { slotAssignment: 'manual' }` is set on the `@Component()` decorator
+	*/
+	shadowSlotAssignmentManual: 1024,
+	/**
+	* Determines if the shadow DOM mode is 'closed'.
+	* e.g. `encapsulation: { type: 'shadow', mode: 'closed' }` is set on the `@Component()` decorator
+	*/
+	shadowModeClosed: 2048,
+	/**
+	* Determines if the component should patch child node accessors for slot handling.
+	* e.g. `encapsulation: { type: 'none', patches: ['children'] }`
+	*/
+	patchChildren: 4096,
+	/**
+	* Determines if the component should patch cloneNode() for slot handling.
+	* e.g. `encapsulation: { type: 'none', patches: ['clone'] }`
+	*/
+	patchClone: 8192,
+	/**
+	* Determines if the component should patch appendChild/insertBefore for slot handling.
+	* e.g. `encapsulation: { type: 'none', patches: ['insert'] }`
+	*/
+	patchInsert: 16384,
+	/**
+	* Determines if the component should apply all slot patches.
+	* e.g. `encapsulation: { type: 'none', patches: ['all'] }`
+	* Equivalent to the global `experimentalSlotFixes` config option.
+	*/
+	patchAll: 32768
+};
+/**
+* Namespaces
+*/
+const SVG_NS = "http://www.w3.org/2000/svg";
+/**
+* DOM Node types
+*
+* See https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType
+*
+* Note: this is a duplicate of the `NODE_TYPES` enum in mock-doc, it's
+* copied over here so that we do not need to introduce a dependency on the
+* mock-doc bundle in the runtime. See
+* https://github.com/stenciljs/core/pull/5705 for more details.
+*/
+const NODE_TYPES = {
+	ELEMENT_NODE: 1,
+	ATTRIBUTE_NODE: 2,
+	TEXT_NODE: 3,
+	CDATA_SECTION_NODE: 4,
+	ENTITY_REFERENCE_NODE: 5,
+	ENTITY_NODE: 6,
+	PROCESSING_INSTRUCTION_NODE: 7,
+	COMMENT_NODE: 8,
+	DOCUMENT_NODE: 9,
+	DOCUMENT_TYPE_NODE: 10,
+	DOCUMENT_FRAGMENT_NODE: 11,
+	NOTATION_NODE: 12
+};
+//#endregion
+//#region src/utils/get-prop-descriptor.ts
+/**
+* Walks up a prototype chain to find a property descriptor.
+* Stops before reaching native DOM prototypes (HTMLElement, etc.) to avoid
+* treating native properties like `hidden` as component-defined getters.
+* @param obj - The object to search on.
+* @param memberName - The name of the member to find.
+* @param getOnly - If true, only returns descriptors with a getter (i.e. ignores properties that are only fields or have setters without getters).
+* @returns The property descriptor if found, otherwise undefined.
+*/
+function getPropertyDescriptor(obj, memberName, getOnly) {
+	const stopAt = typeof HTMLElement !== "undefined" ? HTMLElement.prototype : null;
+	while (obj && obj !== stopAt) {
+		const desc = Object.getOwnPropertyDescriptor(obj, memberName);
+		if (desc && (!getOnly || desc.get)) return desc;
+		obj = Object.getPrototypeOf(obj);
+	}
+}
+//#endregion
+//#region src/utils/es2022-rewire-class-members.ts
+/**
+* - Re-wires component prototype `get` / `set` with instance `@State` / `@Prop` decorated fields.
+* - Makes sure the initial value from the `Element` is synced to the instance `@Prop` decorated fields.
+*
+* Background:
+* During component init, Stencil loops through any `@Prop()` or `@State()` decorated properties
+* and sets up getters and setters for each (within `src/runtime/proxy-component.ts`) on a component prototype.
+*
+* These accessors sync-up class instances with their `Element` and controls re-renders.
+* With modern JS, compiled classes (e.g. `target: 'es2022'`) compiled Stencil components went from:
+*
+* ```ts
+* class MyComponent {
+*   constructor() {
+*     this.prop1 = 'value1';
+*   }
+* }
+* ```
+* To:
+* ```ts
+* class MyComponent {
+*  prop1 = 'value2';
+*  // ^^ These override the accessors originally set on the prototype
+* }
+* ```
+*
+* @param instance - class instance to re-wire
+* @param hostRef - component reference meta
+*/
+const reWireGetterSetter = (instance, hostRef) => {
+	const cmpMeta = hostRef.$cmpMeta$;
+	Object.entries(cmpMeta.$members$ ?? {}).map(([memberName, [memberFlags]]) => {
+		if ((BUILD.state || BUILD.prop) && (memberFlags & MEMBER_FLAGS.Prop || memberFlags & MEMBER_FLAGS.State)) {
+			const ogValue = instance[memberName];
+			const ogDescriptor = getPropertyDescriptor(Object.getPrototypeOf(instance), memberName, true) || Object.getOwnPropertyDescriptor(instance, memberName);
+			if (ogDescriptor) Object.defineProperty(instance, memberName, {
+				get() {
+					return ogDescriptor.get.call(this);
+				},
+				set(newValue) {
+					ogDescriptor.set.call(this, newValue);
+				},
+				configurable: true,
+				enumerable: true
+			});
+			if (hostRef.$instanceValues$.has(memberName)) instance[memberName] = hostRef.$instanceValues$.get(memberName);
+			else if (ogValue !== void 0 && instance[memberName] !== ogValue) instance[memberName] = ogValue;
+		}
+	});
+};
+//#endregion
+//#region src/client/client-host-ref.ts
+/**
+* Given a {@link d.RuntimeRef} retrieve the corresponding {@link d.HostRef}
+*
+* @param ref the runtime ref of interest
+* @returns the Host reference (if found) or undefined
+*/
+const getHostRef = (ref) => {
+	if (ref.__s_ghr) return ref.__s_ghr();
+};
+/**
+* Register a host element for a Stencil component, setting up various metadata
+* and callbacks based on {@link BUILD} flags as well as the component's runtime
+* metadata.
+*
+* @param hostElement the host element to register
+* @param cmpMeta runtime metadata for that component
+* @returns a reference to the host ref WeakMap
+*/
+const registerHost = (hostElement, cmpMeta) => {
+	const hostRef = {
+		$flags$: 0,
+		$hostElement$: hostElement,
+		$cmpMeta$: cmpMeta,
+		$instanceValues$: /* @__PURE__ */ new Map(),
+		$serializerValues$: /* @__PURE__ */ new Map()
+	};
+	if (BUILD.isDev) hostRef.$renderCount$ = 0;
+	if (BUILD.method && BUILD.lazyLoad) hostRef.$onInstancePromise$ = new Promise((r) => hostRef.$onInstanceResolve$ = r);
+	if (BUILD.asyncLoading) {
+		hostRef.$onReadyPromise$ = new Promise((r) => hostRef.$onReadyResolve$ = r);
+		hostElement["s-rp"] = hostRef.$onReadyPromise$;
+		if (!hostElement["s-p"]) hostElement["s-p"] = [];
+		if (!hostElement["s-rc"]) hostElement["s-rc"] = [];
+	}
+	if (BUILD.lazyLoad) hostRef.$fetchedCbList$ = [];
+	const ref = hostRef;
+	hostElement.__s_ghr = () => ref;
+	if (!BUILD.lazyLoad && cmpMeta.$flags$ & CMP_FLAGS.hasModernPropertyDecls && (BUILD.state || BUILD.prop)) reWireGetterSetter(hostElement, hostRef);
+	return ref;
+};
+const isMemberInElement = (elm, memberName) => memberName in elm;
+const consoleError = (e, el) => (0, console.error)(e, el);
+const STENCIL_DEV_MODE = BUILD.isTesting ? ["STENCIL:"] : ["%cstencil", "color: white;background:#4c47ff;font-weight: bold; font-size:10px; padding:2px 6px; border-radius: 5px"];
+const consoleDevError = (...m) => console.error(...STENCIL_DEV_MODE, ...m);
+const consoleDevWarn = (...m) => console.warn(...STENCIL_DEV_MODE, ...m);
+//#endregion
+//#region src/client/client-load-module.ts
+const cmpModules = /* @__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
+* emitted code.
+*
+* See here for details https://esbuild.github.io/api/#non-analyzable-imports
+*
+* We need to do this in order to prevent Esbuild from analyzing / transforming
+* the input. However some _other_ bundlers will _not_ work with such an import
+* if it _lacks_ a leading `"./"`, so we thus we have to do a little dance
+* where here in the source code it must be like this, so that an undesirable
+* transformation that Esbuild would otherwise carry out doesn't occur, but we
+* actually need to then manually edit the bundled Esbuild code later on to fix
+* that. We do this with plugins in the Esbuild and Rolldown bundles which
+* include this file.
+*/
+const MODULE_IMPORT_PREFIX = "./";
+const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
+	const exportName = cmpMeta.$tagName$.replace(/-/g, "_");
+	const bundleId = cmpMeta.$lazyBundleId$;
+	if (BUILD.isDev && typeof bundleId !== "string") {
+		consoleDevError(`Trying to lazily load component <${cmpMeta.$tagName$}> with style mode "${hostRef.$modeName$}", but it does not exist.`);
+		return;
+	} else if (!bundleId) return;
+	const module = !BUILD.hotModuleReplacement ? cmpModules.get(bundleId) : false;
+	if (module) return module[exportName];
+	/*!__STENCIL_STATIC_IMPORT_SWITCH__*/
+	const entryFile = `${bundleId}.entry.js${BUILD.hotModuleReplacement && hmrVersionId ? "?s-hmr=" + hmrVersionId : ""}`;
+	const onLoad = (importedModule) => {
+		if (!BUILD.hotModuleReplacement) cmpModules.set(bundleId, importedModule);
+		return importedModule[exportName];
+	};
+	const onError = (e) => consoleError(e, hostRef.$hostElement$);
+	return import(
+		/* @vite-ignore */
+		/* webpackInclude: /\.entry\.js$/ */
+		/* webpackExclude: /\.system\.entry\.js$/ */
+		/* webpackMode: "lazy" */
+		`${MODULE_IMPORT_PREFIX}${entryFile}`
+).then(onLoad, onError);
+};
+//#endregion
+//#region src/client/client-style.ts
+const styles = /* @__PURE__ */ new Map();
+const modeResolutionChain = [];
+const needsScopedSSR = () => false;
+//#endregion
+//#region src/runtime/runtime-constants.ts
+/**
+* Bit flags for recording various properties of VDom nodes
+*/
+const VNODE_FLAGS = {
+	/**
+	* Whether or not a vdom node is a slot reference
+	*/
+	isSlotReference: 1,
+	/**
+	* Whether or not a slot element has fallback content
+	*/
+	isSlotFallback: 2,
+	/**
+	* Whether or not an element is a host element
+	*/
+	isHost: 4
+};
+const PROXY_FLAGS = {
+	isElementConstructor: 1,
+	proxyState: 2
+};
+const PLATFORM_FLAGS = {
+	/**
+	* designates a node in the DOM as being actively moved by the runtime
+	*/
+	isTmpDisconnected: 1,
+	appLoaded: 2,
+	queueSync: 4,
+	queueMask: 6
+};
+/**
+* A (subset) of node types which are relevant for the Stencil runtime. These
+* values are based on the values which can possibly be returned by the
+* `.nodeType` property of a DOM node. See here for details:
+*
+* {@link https://dom.spec.whatwg.org/#ref-for-dom-node-nodetype%E2%91%A0}
+*/
+const NODE_TYPE = {
+	ElementNode: 1,
+	TextNode: 3,
+	CommentNode: 8,
+	DocumentNode: 9,
+	DocumentTypeNode: 10,
+	DocumentFragment: 11
+};
+const HYDRATE_ID = "s-id";
+const HYDRATED_STYLE_ID = "sty-id";
+const HYDRATE_CHILD_ID = "c-id";
+const HYDRATED_CSS = "{visibility:hidden}.hydrated{visibility:inherit}";
+/**
+* Constant for styles to be globally applied to `slot-fb` elements for pseudo-slot behavior.
+*
+* Two cascading rules must be used instead of a `:not()` selector due to Stencil browser
+* support as of Stencil v4.
+*/
+const SLOT_FB_CSS = "slot-fb{display:contents}slot-fb[hidden]{display:none}";
+const XLINK_NS = "http://www.w3.org/1999/xlink";
+const FORM_ASSOCIATED_CUSTOM_ELEMENT_CALLBACKS = [
+	"formAssociatedCallback",
+	"formResetCallback",
+	"formDisabledCallback",
+	"formStateRestoreCallback"
+];
+//#endregion
+//#region src/client/client-window.ts
+const win = typeof window !== "undefined" ? window : {};
+win.HTMLElement;
+const plt = {
+	$flags$: 0,
+	$resourcesUrl$: "",
+	jmp: (h) => h(),
+	raf: (h) => requestAnimationFrame(h),
+	ael: (el, eventName, listener, opts) => el.addEventListener(eventName, listener, opts),
+	rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
+	ce: (eventName, opts) => new CustomEvent(eventName, opts)
+};
+const supportsListenerOptions = /* @__PURE__ */ (() => {
+	let supported = false;
+	try {
+		win.document?.addEventListener("e", null, Object.defineProperty({}, "passive", { get() {
+			supported = true;
+		} }));
+	} catch {}
+	return supported;
+})();
+const promiseResolve = (v) => Promise.resolve(v);
+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;
+//#endregion
+//#region src/client/client-task-queue.ts
+let queueCongestion = 0;
+let queuePending = false;
+const queueDomReads = [];
+const queueDomWrites = [];
+const queueDomWritesLow = [];
+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);
+	}
+};
+const consume = (queue) => {
+	for (let i = 0; i < queue.length; i++) try {
+		queue[i](performance.now());
+	} catch (e) {
+		consoleError(e);
+	}
+	queue.length = 0;
+};
+const consumeTimeout = (queue, timeout) => {
+	let i = 0;
+	let ts = 0;
+	while (i < queue.length && (ts = performance.now()) < timeout) try {
+		queue[i++](ts);
+	} catch (e) {
+		consoleError(e);
+	}
+	if (i === queue.length) queue.length = 0;
+	else if (i !== 0) queue.splice(0, i);
+};
+const flush = () => {
+	if (BUILD.asyncQueue) queueCongestion++;
+	consume(queueDomReads);
+	if (BUILD.asyncQueue) {
+		const timeout = (plt.$flags$ & PLATFORM_FLAGS.queueMask) === PLATFORM_FLAGS.appLoaded ? performance.now() + 14 * Math.ceil(queueCongestion * (1 / 10)) : Infinity;
+		consumeTimeout(queueDomWrites, timeout);
+		consumeTimeout(queueDomWritesLow, timeout);
+		if (queueDomWrites.length > 0) {
+			queueDomWritesLow.push(...queueDomWrites);
+			queueDomWrites.length = 0;
+		}
+		if (queuePending = queueDomReads.length + queueDomWrites.length + queueDomWritesLow.length > 0) plt.raf(flush);
+		else queueCongestion = 0;
+	} else {
+		consume(queueDomWrites);
+		if (queuePending = queueDomReads.length > 0) plt.raf(flush);
+	}
+};
+const nextTick = (cb) => promiseResolve().then(cb);
+const writeTask = /* @__PURE__ */ queueTask(queueDomWrites, true);
+//#endregion
+//#region src/runtime/asset-path.ts
+const getAssetPath = (path) => {
+	const base = plt.$resourcesUrl$ || new URL(".", import.meta.url).href;
+	const assetUrl = new URL(path, base);
+	return assetUrl.origin !== win.location.origin ? assetUrl.href : assetUrl.pathname;
+};
+const setAssetPath = (path) => plt.$resourcesUrl$ = path;
+//#endregion
+//#region src/utils/style.ts
+/**
+* If (1) styles is not empty string, and (2) constructable stylesheets are supported,
+* then make a stylesheet.
+*
+* @param styles - The styles to add to the stylesheet. If empty string, then no stylesheet is returned.
+* @returns A stylesheet if it can be created, otherwise undefined.
+*/
+function createStyleSheetIfNeededAndSupported(styles) {
+	if (!styles || !supportsConstructableStylesheets) return void 0;
+	const sheet = new CSSStyleSheet();
+	sheet.replaceSync(styles);
+	return sheet;
+}
+//#endregion
+//#region src/utils/shadow-root.ts
+let globalStyleSheet;
+function createShadowRoot(cmpMeta) {
+	const isClosed = BUILD.shadowModeClosed && !!(cmpMeta.$flags$ & CMP_FLAGS.shadowModeClosed);
+	const opts = { mode: isClosed ? "closed" : "open" };
+	const reg = this.constructor._registry;
+	if (reg) opts.customElementRegistry = reg;
+	if (BUILD.shadowDelegatesFocus) opts.delegatesFocus = !!(cmpMeta.$flags$ & CMP_FLAGS.shadowDelegatesFocus);
+	if (BUILD.shadowSlotAssignmentManual) {
+		if (!!(cmpMeta.$flags$ & CMP_FLAGS.shadowSlotAssignmentManual)) opts.slotAssignment = "manual";
+	}
+	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];
+}
+//#endregion
+//#region src/runtime/slot-polyfill-utils.ts
+/**
+* Adjust the `.hidden` property as-needed on any nodes in a DOM subtree which
+* are slot fallback nodes - `<slot-fb>...</slot-fb>`
+*
+* A slot fallback node should be visible by default. Then, it should be
+* conditionally hidden if:
+*
+* - it has a sibling with a `slot` property set to its slot name or if
+* - it is a default fallback slot node, in which case we hide if it has any
+*   content
+*
+* @param elm the element of interest
+*/
+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;
+	});
+	let i = 0;
+	for (i = 0; i < childNodes.length; i++) {
+		const childNode = childNodes[i];
+		if (childNode.nodeType === NODE_TYPE.ElementNode && internalCall(childNode, "childNodes").length) updateFallbackSlotVisibility(childNode);
+	}
+};
+/**
+* Get's the child nodes of a component that are actually slotted.
+* It does this by using root nodes of a component; for each slotted node there is a
+* corresponding slot location node which points to the slotted node (via `['s-nr']`).
+*
+* This is only required until all patches are unified / switched on all the time (then we can rely on `childNodes`)
+* either under 'lightDomPatches' or on by default
+* @param childNodes all 'internal' child nodes of the component
+* @returns An array of slotted reference nodes.
+*/
+const getSlottedChildNodes = (childNodes) => {
+	const result = [];
+	for (let i = 0; i < childNodes.length; i++) {
+		const slottedNode = childNodes[i]["s-nr"] || void 0;
+		if (slottedNode && slottedNode.isConnected) result.push(slottedNode);
+	}
+	return result;
+};
+/**
+* Recursively searches a series of child nodes for slot node/s, optionally with a provided slot name.
+* @param childNodes the nodes to search for a slot with a specific name. Should be an element's root nodes.
+* @param hostName the host name of the slot to match on.
+* @param slotName the name of the slot to match on.
+* @returns a reference to the slot node that matches the provided name, `null` otherwise
+*/
+function getHostSlotNodes(childNodes, hostName, slotName) {
+	let i = 0;
+	let slottedNodes = [];
+	let childNode;
+	for (; i < childNodes.length; i++) {
+		childNode = childNodes[i];
+		if (childNode["s-sr"] && (!hostName || childNode["s-hn"] === hostName) && (slotName === void 0 || getSlotName(childNode) === slotName)) {
+			slottedNodes.push(childNode);
+			if (typeof slotName !== "undefined") return slottedNodes;
+		}
+		slottedNodes = [...slottedNodes, ...getHostSlotNodes(childNode.childNodes, hostName, slotName)];
+	}
+	return slottedNodes;
+}
+/**
+* Get all 'child' sibling nodes of a slot node
+* @param slot - the slot node to get the child nodes from
+* @param slotName - the name of the slot to match on
+* @param includeSlot - whether to include the slot node in the result
+* @returns child nodes of the slot node
+*/
+const getSlotChildSiblings = (slot, slotName, includeSlot = true) => {
+	const childNodes = [];
+	if (includeSlot && slot["s-sr"] || !slot["s-sr"]) childNodes.push(slot);
+	let node = slot;
+	while (node = node.nextSibling) if (getSlotName(node) === slotName && (includeSlot || !node["s-sr"])) childNodes.push(node);
+	return childNodes;
+};
+/**
+* Check whether a node is located in a given named slot.
+*
+* @param nodeToRelocate the node of interest
+* @param slotName the slot name to check
+* @returns whether the node is located in the slot or not
+*/
+const isNodeLocatedInSlot = (nodeToRelocate, slotName) => {
+	if (nodeToRelocate.nodeType === NODE_TYPE.ElementNode) {
+		if (nodeToRelocate.getAttribute("slot") === null && slotName === "") return true;
+		if (nodeToRelocate.getAttribute("slot") === slotName) return true;
+		return false;
+	}
+	if (nodeToRelocate["s-sn"] === slotName) return true;
+	return slotName === "";
+};
+/**
+* Creates an empty text node to act as a forwarding address to a slotted node:
+* 1) When non-shadow components re-render, they need a place to temporarily put 'lightDOM' elements.
+* 2) Patched dom methods and accessors use this node to calculate what 'lightDOM' nodes are in the host.
+*
+* @param newChild a node that's going to be added to the component
+* @param slotNode the slot node that the node will be added to
+* @param prepend move the slotted location node to the beginning of the host
+* @param position an ordered position to add the ref node which mirrors the lightDom nodes' order. Used during SSR hydration
+*  (the order of the slot location nodes determines the order of the slotted nodes in our patched accessors)
+*/
+const addSlotRelocateNode = (newChild, slotNode, prepend, position) => {
+	if (newChild["s-ol"] && newChild["s-ol"].isConnected) return;
+	const slottedNodeLocation = document.createTextNode("");
+	slottedNodeLocation["s-nr"] = newChild;
+	if (!slotNode["s-cr"] || !slotNode["s-cr"].parentNode) return;
+	const parent = slotNode["s-cr"].parentNode;
+	const appendMethod = prepend ? internalCall(parent, "prepend") : internalCall(parent, "appendChild");
+	if (BUILD.hydrateClientSide && typeof position !== "undefined") {
+		slottedNodeLocation["s-oo"] = position;
+		const childNodes = internalCall(parent, "childNodes");
+		const slotRelocateNodes = [slottedNodeLocation];
+		childNodes.forEach((n) => {
+			if (n["s-nr"]) slotRelocateNodes.push(n);
+		});
+		slotRelocateNodes.sort((a, b) => {
+			if (!a["s-oo"] || a["s-oo"] < (b["s-oo"] || 0)) return -1;
+			else if (!b["s-oo"] || b["s-oo"] < a["s-oo"]) return 1;
+			return 0;
+		});
+		slotRelocateNodes.forEach((n) => appendMethod.call(parent, n));
+	} else appendMethod.call(parent, slottedNodeLocation);
+	newChild["s-ol"] = slottedNodeLocation;
+	newChild["s-sh"] = slotNode["s-hn"];
+};
+const getSlotName = (node) => typeof node["s-sn"] === "string" ? node["s-sn"] : node.nodeType === 1 && node.getAttribute("slot") || void 0;
+/**
+* Add `assignedElements` and `assignedNodes` methods on a fake slot node
+*
+* @param node - slot node to patch
+*/
+function patchSlotNode(node) {
+	if (node.assignedElements || node.assignedNodes || !node["s-sr"]) return;
+	const assignedFactory = (elementsOnly) => function(opts) {
+		const toReturn = [];
+		const slotName = this["s-sn"];
+		if (opts?.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);
+		});
+		if (elementsOnly) return toReturn.filter((n) => n.nodeType === NODE_TYPE.ElementNode);
+		return toReturn;
+	}.bind(node);
+	node.assignedElements = assignedFactory(true);
+	node.assignedNodes = assignedFactory(false);
+}
+/**
+* Dispatches a `slotchange` event on a fake `<slot />` node.
+*
+* @param elm the slot node to dispatch the event from
+*/
+function dispatchSlotChangeEvent(elm) {
+	elm.name = elm["s-sn"] || "";
+	elm.dispatchEvent(new CustomEvent("slotchange", {
+		bubbles: false,
+		cancelable: false,
+		composed: false
+	}));
+}
+/**
+* Find the slot node that a slotted node belongs to
+*
+* @param slottedNode - the slotted node to find the slot for
+* @param parentHost - the parent host element of the slotted node
+* @returns the slot node and slot name
+*/
+function findSlotFromSlottedNode(slottedNode, parentHost) {
+	parentHost = parentHost || slottedNode["s-ol"]?.parentElement;
+	if (!parentHost) return {
+		slotNode: null,
+		slotName: ""
+	};
+	const slotName = slottedNode["s-sn"] = getSlotName(slottedNode) || "";
+	return {
+		slotNode: getHostSlotNodes(internalCall(parentHost, "childNodes"), parentHost.tagName, slotName)[0],
+		slotName
+	};
+}
+//#endregion
+//#region src/runtime/dom-extras.ts
+const applyLightDomPatches = (hostElementPrototype) => {
+	patchSlotAppendChild(hostElementPrototype);
+	patchSlotAppend(hostElementPrototype);
+	patchSlotPrepend(hostElementPrototype);
+	patchSlotInsertAdjacentHTML(hostElementPrototype);
+	patchInsertBefore(hostElementPrototype);
+	patchTextContent(hostElementPrototype);
+	patchChildSlotNodes(hostElementPrototype);
+	patchSlotRemoveChild(hostElementPrototype);
+};
+/**
+* Patches the `cloneNode` method on a `scoped` Stencil component.
+*
+* @param HostElementPrototype The Stencil component to be patched
+*/
+const patchCloneNode = (HostElementPrototype) => {
+	if (HostElementPrototype.__cloneNode) return;
+	const orgCloneNode = HostElementPrototype.__cloneNode = HostElementPrototype.cloneNode;
+	HostElementPrototype.cloneNode = function(deep) {
+		const srcNode = this;
+		const isShadowDom = BUILD.shadowDom ? !!srcNode.shadowRoot : false;
+		const clonedNode = orgCloneNode.call(srcNode, isShadowDom ? deep : false);
+		if (BUILD.slot && !isShadowDom && deep) {
+			let i = 0;
+			let slotted, nonStencilNode;
+			const stencilPrivates = [
+				"s-id",
+				"s-cr",
+				"s-lr",
+				"s-rc",
+				"s-sc",
+				"s-p",
+				"s-cn",
+				"s-sr",
+				"s-sn",
+				"s-hn",
+				"s-ol",
+				"s-nr",
+				"s-si",
+				"s-rf",
+				"s-scs"
+			];
+			const childNodes = this.__childNodes || this.childNodes;
+			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 (nonStencilNode) clonedNode.appendChild(childNodes[i].cloneNode(true));
+			}
+		}
+		return clonedNode;
+	};
+};
+/**
+* Patches the `appendChild` method on a `scoped` Stencil component.
+* The patch will attempt to find a slot with the same name as the node being appended
+* and insert it into the slot reference if found. Otherwise, it falls-back to the original
+* `appendChild` method.
+*
+* @param HostElementPrototype The Stencil component to be patched
+*/
+const patchSlotAppendChild = (HostElementPrototype) => {
+	if (HostElementPrototype.__appendChild) return;
+	HostElementPrototype.__appendChild = HostElementPrototype.appendChild;
+	HostElementPrototype.appendChild = function(newChild) {
+		const { slotName, slotNode } = findSlotFromSlottedNode(newChild, this);
+		if (slotNode) {
+			addSlotRelocateNode(newChild, slotNode);
+			const slotChildNodes = getSlotChildSiblings(slotNode, slotName);
+			const appendAfter = slotChildNodes[slotChildNodes.length - 1];
+			const insertedNode = internalCall(internalCall(appendAfter, "parentNode"), "insertBefore")(newChild, appendAfter.nextSibling);
+			dispatchSlotChangeEvent(slotNode);
+			updateFallbackSlotVisibility(this);
+			return insertedNode;
+		}
+		return this.__appendChild(newChild);
+	};
+};
+/**
+* Patches the `removeChild` method on a `scoped` Stencil component.
+* This patch attempts to remove the specified node from a slot reference
+* if the slot exists. Otherwise, it falls-back to the original `removeChild` method.
+*
+* @param ElementPrototype The Stencil component to be patched
+*/
+const patchSlotRemoveChild = (ElementPrototype) => {
+	if (ElementPrototype.__removeChild) return;
+	ElementPrototype.__removeChild = ElementPrototype.removeChild;
+	ElementPrototype.removeChild = function(toRemove) {
+		if (toRemove && typeof toRemove["s-sn"] !== "undefined") {
+			if (getHostSlotNodes(this.__childNodes || this.childNodes, this.tagName, toRemove["s-sn"]) && toRemove.isConnected) {
+				toRemove.remove();
+				updateFallbackSlotVisibility(this);
+				return;
+			}
+		}
+		return this.__removeChild(toRemove);
+	};
+};
+/**
+* Patches the `prepend` method for a slotted node inside a scoped component.
+*
+* @param HostElementPrototype the `Element` to be patched
+*/
+const patchSlotPrepend = (HostElementPrototype) => {
+	if (HostElementPrototype.__prepend) return;
+	HostElementPrototype.__prepend = HostElementPrototype.prepend;
+	HostElementPrototype.prepend = function(...newChildren) {
+		newChildren.forEach((newChild) => {
+			if (typeof newChild === "string") newChild = this.ownerDocument.createTextNode(newChild);
+			const slotName = (newChild["s-sn"] = getSlotName(newChild)) || "";
+			const slotNode = getHostSlotNodes(internalCall(this, "childNodes"), this.tagName, slotName)[0];
+			if (slotNode) {
+				addSlotRelocateNode(newChild, slotNode, true);
+				const appendAfter = getSlotChildSiblings(slotNode, slotName)[0];
+				const toReturn = internalCall(internalCall(appendAfter, "parentNode"), "insertBefore")(newChild, internalCall(appendAfter, "nextSibling"));
+				dispatchSlotChangeEvent(slotNode);
+				return toReturn;
+			}
+			if (newChild.nodeType === 1 && !!newChild.getAttribute("slot")) newChild.hidden = true;
+			return HostElementPrototype.__prepend(newChild);
+		});
+	};
+};
+/**
+* Patches the `append` method for a slotted node inside a scoped component. The patched method uses
+* `appendChild` under-the-hood while creating text nodes for any new children that passed as bare strings.
+*
+* @param HostElementPrototype the `Element` to be patched
+*/
+const patchSlotAppend = (HostElementPrototype) => {
+	if (HostElementPrototype.__append) return;
+	HostElementPrototype.__append = HostElementPrototype.append;
+	HostElementPrototype.append = function(...newChildren) {
+		newChildren.forEach((newChild) => {
+			if (typeof newChild === "string") newChild = this.ownerDocument.createTextNode(newChild);
+			this.appendChild(newChild);
+		});
+	};
+};
+/**
+* Patches the `insertAdjacentHTML` method for a slotted node inside a scoped component. Specifically,
+* we only need to patch the behavior for the specific `beforeend` and `afterbegin` positions so the element
+* gets inserted into the DOM in the correct location.
+*
+* @param HostElementPrototype the `Element` to be patched
+*/
+const patchSlotInsertAdjacentHTML = (HostElementPrototype) => {
+	if (HostElementPrototype.__insertAdjacentHTML) return;
+	const originalInsertAdjacentHtml = HostElementPrototype.insertAdjacentHTML;
+	HostElementPrototype.insertAdjacentHTML = function(position, text) {
+		if (position !== "afterbegin" && position !== "beforeend") return originalInsertAdjacentHtml.call(this, position, text);
+		const container = this.ownerDocument.createElement("_");
+		let node;
+		container.innerHTML = text;
+		if (position === "afterbegin") while (node = container.firstChild) this.prepend(node);
+		else if (position === "beforeend") while (node = container.firstChild) this.append(node);
+	};
+};
+/**
+* Patches the `insertBefore` of a non-shadow component.
+*
+* The *current* node to insert before may not be in the root of our component
+* (e.g. if it's 'slotted' it appears in the root, but isn't really)
+*
+* This tries to find where the *current* node lives within the component and insert the new node before it
+* *If* the new node is in the same slot as the *current* node. Otherwise the new node is appended to it's 'slot'
+*
+* @param HostElementPrototype the custom element prototype to patch
+*/
+const patchInsertBefore = (HostElementPrototype) => {
+	if (HostElementPrototype.__insertBefore) return;
+	const eleProto = HostElementPrototype;
+	if (eleProto.__insertBefore) return;
+	eleProto.__insertBefore = HostElementPrototype.insertBefore;
+	HostElementPrototype.insertBefore = function(newChild, currentChild) {
+		const { slotName, slotNode } = findSlotFromSlottedNode(newChild, this);
+		const slottedNodes = this.__childNodes ? this.childNodes : getSlottedChildNodes(this.childNodes);
+		if (slotNode) {
+			let found = false;
+			slottedNodes.forEach((childNode) => {
+				if (childNode === currentChild || currentChild === null) {
+					found = true;
+					if (currentChild === null || slotName !== currentChild["s-sn"]) {
+						this.appendChild(newChild);
+						return;
+					}
+					if (slotName === currentChild["s-sn"]) {
+						addSlotRelocateNode(newChild, slotNode);
+						internalCall(internalCall(currentChild, "parentNode"), "insertBefore")(newChild, currentChild);
+						dispatchSlotChangeEvent(slotNode);
+					}
+					return;
+				}
+			});
+			if (found) return newChild;
+		}
+		/**
+		* Fixes an issue where slotted elements are dynamically relocated in React, such as after data fetch.
+		*
+		* When a slotted element is passed to another scoped component (e.g., <A><C slot="header"/></A>),
+		* the child’s __parentNode (original parent node property) does not match this.
+		*
+		* To prevent errors, this checks if the current child's parent node differs from this.
+		* If so, appendChild(newChild) is called to ensure the child is correctly inserted,
+		* allowing Stencil to properly manage the slot placement.
+		*/
+		const parentNode = currentChild?.__parentNode;
+		if (parentNode && !this.isSameNode(parentNode)) return this.appendChild(newChild);
+		return this.__insertBefore(newChild, currentChild);
+	};
+};
+/**
+* Patches the `textContent` of an unnamed slotted node inside a scoped component
+*
+* @param hostElementPrototype the `Element` to be patched
+*/
+const patchTextContent = (hostElementPrototype) => {
+	patchHostOriginalAccessor("textContent", hostElementPrototype);
+	Object.defineProperty(hostElementPrototype, "textContent", {
+		get: function() {
+			let text = "";
+			(this.__childNodes ? this.childNodes : getSlottedChildNodes(this.childNodes)).forEach((node) => text += node.textContent || "");
+			return text;
+		},
+		set: function(value) {
+			(this.__childNodes ? this.childNodes : getSlottedChildNodes(this.childNodes)).forEach((node) => {
+				if (node["s-ol"]) node["s-ol"].remove();
+				node.remove();
+			});
+			this.insertAdjacentHTML("beforeend", value);
+		}
+	});
+};
+const patchChildSlotNodes = (elm) => {
+	class FakeNodeList extends Array {
+		item(n) {
+			return this[n];
+		}
+	}
+	patchHostOriginalAccessor("children", elm);
+	Object.defineProperty(elm, "children", { get() {
+		return this.childNodes.filter((n) => n.nodeType === 1);
+	} });
+	Object.defineProperty(elm, "childElementCount", { get() {
+		return this.children.length;
+	} });
+	patchHostOriginalAccessor("firstChild", elm);
+	Object.defineProperty(elm, "firstChild", { get() {
+		return this.childNodes[0];
+	} });
+	patchHostOriginalAccessor("lastChild", elm);
+	Object.defineProperty(elm, "lastChild", { get() {
+		return this.childNodes[this.childNodes.length - 1];
+	} });
+	patchHostOriginalAccessor("childNodes", elm);
+	Object.defineProperty(elm, "childNodes", { get() {
+		const result = new FakeNodeList();
+		if (!this["s-cr"]) {
+			result.push(...Array.from(this.__childNodes));
+			return result;
+		}
+		result.push(...getSlottedChildNodes(this.__childNodes));
+		return result;
+	} });
+};
+/**
+* Patches sibling accessors of a 'slotted' node within a non-shadow component.
+* Meaning whilst stepping through a non-shadow element's nodes, only the mock 'lightDOM' nodes are returned.
+* Especially relevant when rendering components via SSR... Frameworks will often try to reconcile their
+* VDOM with the real DOM by stepping through nodes with 'nextSibling' et al.
+* - `nextSibling`
+* - `nextElementSibling`
+* - `previousSibling`
+* - `previousElementSibling`
+*
+* @param node the slotted node to be patched
+*/
+const patchSlottedNode = (node) => {
+	if (!node || node.__nextSibling !== void 0 || !globalThis.Node) return;
+	patchNextSibling(node);
+	patchPreviousSibling(node);
+	patchParentNode(node);
+	if (node.nodeType === Node.ELEMENT_NODE) {
+		patchNextElementSibling(node);
+		patchPreviousElementSibling(node);
+	}
+};
+/**
+* Patches the `nextSibling` accessor of a non-shadow slotted node
+*
+* @param node the slotted node to be patched
+*/
+const patchNextSibling = (node) => {
+	if (!node || node.__nextSibling) return;
+	patchHostOriginalAccessor("nextSibling", 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];
+		return this.__nextSibling;
+	} });
+};
+/**
+* Patches the `nextElementSibling` accessor of a non-shadow slotted node
+*
+* @param element the slotted element node to be patched
+*/
+const patchNextElementSibling = (element) => {
+	if (!element || element.__nextElementSibling) return;
+	patchHostOriginalAccessor("nextElementSibling", 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];
+		return this.__nextElementSibling;
+	} });
+};
+/**
+* Patches the `previousSibling` accessor of a non-shadow slotted node
+*
+* @param node the slotted node to be patched
+*/
+const patchPreviousSibling = (node) => {
+	if (!node || node.__previousSibling) return;
+	patchHostOriginalAccessor("previousSibling", 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];
+		return this.__previousSibling;
+	} });
+};
+/**
+* Patches the `previousElementSibling` accessor of a non-shadow slotted node
+*
+* @param element the slotted element node to be patched
+*/
+const patchPreviousElementSibling = (element) => {
+	if (!element || element.__previousElementSibling) return;
+	patchHostOriginalAccessor("previousElementSibling", 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];
+		return this.__previousElementSibling;
+	} });
+};
+/**
+* Patches the `parentNode` accessor of a non-shadow slotted node
+*
+* @param node the slotted node to be patched
+*/
+const patchParentNode = (node) => {
+	if (!node || node.__parentNode) return;
+	patchHostOriginalAccessor("parentNode", node);
+	Object.defineProperty(node, "parentNode", {
+		get: function() {
+			return this["s-ol"]?.parentNode || this.__parentNode;
+		},
+		set: function(value) {
+			this.__parentNode = value;
+		}
+	});
+};
+const validElementPatches = [
+	"children",
+	"nextElementSibling",
+	"previousElementSibling"
+];
+const validNodesPatches = [
+	"childNodes",
+	"firstChild",
+	"lastChild",
+	"nextSibling",
+	"previousSibling",
+	"textContent",
+	"parentNode"
+];
+/**
+* Patches a node or element; making it's original accessor method available under a new name.
+* e.g. `nextSibling` -> `__nextSibling`
+*
+* @param accessorName - the name of the accessor to patch
+* @param node - the node to patch
+*/
+function patchHostOriginalAccessor(accessorName, node) {
+	/**
+	* skip this method if a component was imported from a non-browser environment
+	*/
+	if (!globalThis.Node || !globalThis.Element) return;
+	let accessor;
+	if (validElementPatches.includes(accessorName)) accessor = Object.getOwnPropertyDescriptor(Element.prototype, accessorName);
+	else if (validNodesPatches.includes(accessorName)) accessor = Object.getOwnPropertyDescriptor(Node.prototype, accessorName);
+	if (!accessor) accessor = Object.getOwnPropertyDescriptor(node, accessorName);
+	if (accessor) Object.defineProperty(node, "__" + accessorName, accessor);
+}
+/**
+* Get the original / internal accessor or method of a node or element.
+*
+* @param node - the node to get the accessor from
+* @param method - the name of the accessor to get
+*
+* @returns the original accessor or method of the node
+*/
+function internalCall(node, method) {
+	if ("__" + method in node) {
+		const toReturn = node["__" + method];
+		if (typeof toReturn !== "function") return toReturn;
+		return toReturn.bind(node);
+	} else {
+		if (typeof node[method] !== "function") return node[method];
+		return node[method].bind(node);
+	}
+}
+//#endregion
+//#region src/runtime/element.ts
+const getElement = (ref) => BUILD.lazyLoad ? getHostRef(ref)?.$hostElement$ : ref;
+/**
+* Get the shadow root for a Stencil component's host element.
+* This works for both open and closed shadow DOM modes.
+*
+* For closed shadow DOM, `element.shadowRoot` returns `null` by design,
+* but Stencil stores the reference internally so components can still
+* access their own shadow root.
+*
+* @param element The host element (from @Element() decorator)
+* @returns The shadow root, or null if no shadow root exists
+*/
+const getShadowRoot = (element) => {
+	if (BUILD.shadowModeClosed && element.__shadowRoot) return element.__shadowRoot;
+	return element.shadowRoot;
+};
+//#endregion
+//#region src/runtime/profile.ts
+let i = 0;
+const createTime = (fnName, tagName = "") => {
+	if (BUILD.profile && performance.mark) {
+		const key = `st:${fnName}:${tagName}:${i++}`;
+		performance.mark(key);
+		return () => performance.measure(`[Stencil] ${fnName}() <${tagName}>`, key);
+	} else return () => {};
+};
+const uniqueTime = (key, measureText) => {
+	if (BUILD.profile && performance.mark) {
+		if (performance.getEntriesByName(key, "mark").length === 0) performance.mark(key);
+		return () => {
+			if (performance.getEntriesByName(measureText, "measure").length === 0) performance.measure(measureText, key);
+		};
+	} else return () => {};
+};
+const inspect = (ref) => {
+	const hostRef = getHostRef(ref);
+	if (!hostRef) return;
+	const flags = hostRef.$flags$;
+	const hostElement = hostRef.$hostElement$;
+	return {
+		renderCount: hostRef.$renderCount$,
+		flags: {
+			hasRendered: !!(flags & HOST_FLAGS.hasRendered),
+			hasConnected: !!(flags & HOST_FLAGS.hasConnected),
+			isWaitingForChildren: !!(flags & HOST_FLAGS.isWaitingForChildren),
+			isConstructingInstance: !!(flags & HOST_FLAGS.isConstructingInstance),
+			isQueuedForUpdate: !!(flags & HOST_FLAGS.isQueuedForUpdate),
+			hasInitializedComponent: !!(flags & HOST_FLAGS.hasInitializedComponent),
+			hasLoadedComponent: !!(flags & HOST_FLAGS.hasLoadedComponent),
+			isWatchReady: !!(flags & HOST_FLAGS.isWatchReady),
+			isListenReady: !!(flags & HOST_FLAGS.isListenReady),
+			needsRerender: !!(flags & HOST_FLAGS.needsRerender)
+		},
+		instanceValues: hostRef.$instanceValues$,
+		serializerValues: hostRef.$serializerValues$,
+		ancestorComponent: hostRef.$ancestorComponent$,
+		hostElement,
+		lazyInstance: hostRef.$lazyInstance$,
+		vnode: hostRef.$vnode$,
+		modeName: hostRef.$modeName$,
+		fetchedCbList: hostRef.$fetchedCbList$,
+		onReadyPromise: hostRef.$onReadyPromise$,
+		onReadyResolve: hostRef.$onReadyResolve$,
+		onInstancePromise: hostRef.$onInstancePromise$,
+		onInstanceResolve: hostRef.$onInstanceResolve$,
+		onRenderResolve: hostRef.$onRenderResolve$,
+		queuedListeners: hostRef.$queuedListeners$,
+		rmListeners: hostRef.$rmListeners$,
+		["s-id"]: hostElement["s-id"],
+		["s-cr"]: hostElement["s-cr"],
+		["s-lr"]: hostElement["s-lr"],
+		["s-p"]: hostElement["s-p"],
+		["s-rc"]: hostElement["s-rc"],
+		["s-sc"]: hostElement["s-sc"]
+	};
+};
+const installDevTools = () => {
+	if (BUILD.devTools) {
+		const stencil = win.stencil = win.stencil || {};
+		const originalInspect = stencil.inspect;
+		stencil.inspect = (ref) => {
+			let result = inspect(ref);
+			if (!result && typeof originalInspect === "function") result = originalInspect(ref);
+			return result;
+		};
+	}
+};
+//#endregion
+//#region src/utils/query-nonce-meta-tag-content.ts
+/**
+* Helper method for querying a `meta` tag that contains a nonce value
+* out of a DOM's head.
+*
+* @param doc The DOM containing the `head` to query against
+* @returns The content of the meta tag representing the nonce value, or `undefined` if no tag
+* exists or the tag has no content.
+*/
+function queryNonceMetaTagContent(doc) {
+	return doc.head?.querySelector("meta[name=\"csp-nonce\"]")?.getAttribute("content") ?? void 0;
+}
+//#endregion
+//#region src/runtime/styles.ts
+const rootAppliedStyles = /* @__PURE__ */ new WeakMap();
+/**
+* Get or initialize the set of applied style scope IDs for a container element.
+*
+* @param container the container element to track styles for
+* @returns the set of applied scope IDs
+*/
+const getAppliedStyles = (container) => {
+	let applied = rootAppliedStyles.get(container);
+	if (!applied) {
+		applied = /* @__PURE__ */ new Set();
+		rootAppliedStyles.set(container, applied);
+	}
+	return applied;
+};
+/**
+* Safely adopt a stylesheet into a container's adoptedStyleSheets.
+* Handles both mutable and immutable adoptedStyleSheets arrays.
+*
+* @param container the shadow root or document to adopt styles into
+* @param sheet the CSSStyleSheet to adopt
+* @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];
+	else container.adoptedStyleSheets = [...container.adoptedStyleSheets, sheet];
+};
+/**
+* Create a CSSStyleSheet for the correct window context.
+* Constructable stylesheets can't be shared between windows,
+* so we need to create one for the current window.
+*
+* @param container the container node (used to determine the window context)
+* @param cssText the CSS text to populate the stylesheet with
+* @returns a new CSSStyleSheet for the correct window
+*/
+const createStylesheetForWindow = (container, cssText) => {
+	const sheet = new (container.defaultView ?? container.ownerDocument?.defaultView ?? win).CSSStyleSheet();
+	sheet.replaceSync(cssText);
+	return sheet;
+};
+/**
+* Get the style for a component, appending slot fallback CSS if needed.
+* Returns a new value without mutating the cached style.
+*
+* @param style - the style string or CSSStyleSheet to process
+* @returns the style (string or CSSStyleSheet) with slot CSS appended if needed, or undefined
+*/
+const getStyleWithSlotCss = (style) => {
+	if (!style) return SLOT_FB_CSS;
+	if (typeof style === "string") return style + SLOT_FB_CSS;
+	return style;
+};
+/**
+* Register the styles for a component by creating a stylesheet and then
+* registering it under the component's scope ID in a `WeakMap` for later use.
+*
+* If constructable stylesheet are not supported or `allowCS` is set to
+* `false` then the styles will be registered as a string instead.
+*
+* @param scopeId the scope ID for the component of interest
+* @param cssText styles for the component of interest
+* @param allowCS whether or not to use a constructable stylesheet
+*/
+const registerStyle = (scopeId, cssText, allowCS) => {
+	if (supportsConstructableStylesheets && allowCS) {
+		const sheet = styles.get(scopeId) ?? new CSSStyleSheet();
+		sheet.replaceSync(cssText);
+		styles.set(scopeId, sheet);
+	} else styles.set(scopeId, cssText);
+};
+/**
+* Attach the styles for a given component to the DOM
+*
+* If the element uses shadow or is already attached to the DOM then we can
+* create a stylesheet inside of its associated document fragment, otherwise
+* we'll stick the stylesheet into the document head.
+*
+* @param styleContainerNode the node within which a style element for the
+* component of interest should be added
+* @param cmpMeta runtime metadata for the component of interest
+* @param mode an optional current mode
+* @returns the scope ID for the component of interest
+*/
+const addStyle = (styleContainerNode, cmpMeta, mode) => {
+	const scopeId = getScopeId(cmpMeta, mode);
+	if (!win.document) return scopeId;
+	let style = styles.get(scopeId);
+	if (cmpMeta.$flags$ & CMP_FLAGS.hasSlotRelocation) style = getStyleWithSlotCss(style);
+	const isClosedShadowSSR = BUILD.hydrateServerSide && BUILD.shadowModeClosed && cmpMeta.$flags$ & CMP_FLAGS.shadowNeedsScopedCss && cmpMeta.$flags$ & CMP_FLAGS.shadowModeClosed;
+	if (styleContainerNode.nodeType !== NODE_TYPE.DocumentFragment && !isClosedShadowSSR) styleContainerNode = win.document;
+	if (style) {
+		if (typeof style === "string") {
+			styleContainerNode = styleContainerNode.head || styleContainerNode;
+			const appliedStyles = getAppliedStyles(styleContainerNode);
+			let styleElm;
+			const existingStyleElm = (BUILD.hydrateClientSide || BUILD.hotModuleReplacement) && styleContainerNode.querySelector(`[sty-id="${scopeId}"]`);
+			if (existingStyleElm) existingStyleElm.textContent = style;
+			else if (!appliedStyles.has(scopeId)) {
+				styleElm = win.document.createElement("style");
+				styleElm.textContent = style;
+				const nonce = plt.$nonce$ ?? queryNonceMetaTagContent(win.document);
+				if (nonce != null) styleElm.setAttribute("nonce", nonce);
+				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
+				*/
+				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);
+				/**
+				* 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 (appliedStyles) appliedStyles.add(scopeId);
+			}
+		} else if (BUILD.constructableCSS) {
+			const appliedStyles = getAppliedStyles(styleContainerNode);
+			if (!appliedStyles.has(scopeId)) {
+				const currentWindow = styleContainerNode.defaultView ?? styleContainerNode.ownerDocument.defaultView;
+				let stylesheet;
+				if (style.constructor === currentWindow.CSSStyleSheet) stylesheet = style;
+				else {
+					stylesheet = new currentWindow.CSSStyleSheet();
+					for (let i = 0; i < style.cssRules.length; i++) stylesheet.insertRule(style.cssRules[i].cssText, i);
+				}
+				adoptStylesheet(styleContainerNode, stylesheet);
+				appliedStyles.add(scopeId);
+				if (BUILD.hydrateClientSide && "host" in styleContainerNode) {
+					const ssrStyleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId}"]`);
+					if (ssrStyleElm) writeTask(() => ssrStyleElm.remove());
+				}
+			}
+		}
+	}
+	return scopeId;
+};
+/**
+* Add styles for a given component to the DOM, optionally handling 'scoped'
+* encapsulation by adding an appropriate class name to the host element.
+*
+* @param hostRef the host reference for the component of interest
+*/
+const attachStyles = (hostRef) => {
+	const cmpMeta = hostRef.$cmpMeta$;
+	const elm = hostRef.$hostElement$;
+	const flags = cmpMeta.$flags$;
+	const endAttachStyles = createTime("attachStyles", cmpMeta.$tagName$);
+	let styleContainerNode;
+	const shadowRoot = BUILD.shadowDom ? getShadowRoot(elm) : null;
+	if (shadowRoot) styleContainerNode = shadowRoot;
+	else if (BUILD.hydrateServerSide && BUILD.shadowModeClosed && flags & CMP_FLAGS.shadowNeedsScopedCss && flags & CMP_FLAGS.shadowModeClosed) styleContainerNode = elm;
+	else styleContainerNode = elm.getRootNode();
+	const scopeId = addStyle(styleContainerNode, cmpMeta, hostRef.$modeName$);
+	if ((BUILD.shadowDom || BUILD.scoped) && BUILD.cssAnnotations && flags & CMP_FLAGS.needsScopedEncapsulation) {
+		elm["s-sc"] = scopeId;
+		elm.classList.add(scopeId + "-h");
+	}
+	endAttachStyles();
+};
+/**
+* Get the scope ID for a given component
+*
+* @param cmp runtime metadata for the component of interest
+* @param mode the current mode (optional)
+* @returns a scope ID for the component of interest
+*/
+const getScopeId = (cmp, mode) => "sc-" + (BUILD.mode && mode && cmp.$flags$ & CMP_FLAGS.hasMode ? cmp.$tagName$ + "-" + mode : cmp.$tagName$);
+/**
+* Convert a 'scoped' CSS string to one appropriate for use in the shadow DOM.
+*
+* Given a 'scoped' CSS string that looks like this:
+*
+* ```
+* /*!@div*\/div.class-name { display: flex };
+* ```
+*
+* Convert it to a 'shadow' appropriate string, like so:
+*
+* ```
+*  /*!@div*\/div.class-name { display: flex }
+*      ─┬─                  ────────┬────────
+*       │                           │
+*       │         ┌─────────────────┘
+*       ▼         ▼
+*      div{ display: flex }
+* ```
+*
+* Note that forward-slashes in the above are escaped so they don't end the
+* comment.
+*
+* @param css a CSS string to convert
+* @returns the converted string
+*/
+const convertScopedToShadow = (css) => css.replace(/\/\*!@([^/]+)\*\/[^{]+\{/g, "$1{");
+/**
+* Hydrate styles after SSR for components *not* using DSD. Convert 'scoped' styles to 'shadow'
+* and add them to a constructable stylesheet.
+*
+* @returns void
+*/
+const hydrateScopedToShadow = () => {
+	if (!win.document) return;
+	const styleElements = win.document.querySelectorAll(`[${HYDRATED_STYLE_ID}]`);
+	let i = 0;
+	for (; i < styleElements.length; i++) registerStyle(styleElements[i].getAttribute(HYDRATED_STYLE_ID), convertScopedToShadow(styleElements[i].innerHTML), true);
+};
+//#endregion
+//#region src/utils/helpers.ts
+/**
+* Check if a value is defined (not null and not undefined).
+*
+* @param v - the value to check
+* @returns true if the value is defined
+*/
+const isDef = (v) => v != null && v !== void 0;
+/**
+* Check whether a value is a 'complex type', defined here as an object or a
+* function.
+*
+* @param o the value to check
+* @returns whether it's a complex type or not
+*/
+const isComplexType = (o) => {
+	o = typeof o;
+	return o === "object" || o === "function";
+};
+//#endregion
+//#region src/runtime/event-emitter.ts
+const createEvent = (ref, name, flags) => {
+	const elm = getElement(ref);
+	return { emit: (detail) => {
+		if (BUILD.isDev && !elm.isConnected) consoleDevWarn(`The "${name}" event was emitted, but the dispatcher node is no longer connected to the dom.`);
+		return emitEvent(elm, name, {
+			bubbles: !!(flags & EVENT_FLAGS.Bubbles),
+			composed: !!(flags & EVENT_FLAGS.Composed),
+			cancelable: !!(flags & EVENT_FLAGS.Cancellable),
+			detail
+		});
+	} };
+};
+/**
+* Helper function to create & dispatch a custom Event on a provided target
+* @param elm the target of the Event
+* @param name the name to give the custom Event
+* @param opts options for configuring a custom Event
+* @returns the custom Event
+*/
+const emitEvent = (elm, name, opts) => {
+	const ev = plt.ce(name, opts);
+	elm.dispatchEvent(ev);
+	return ev;
+};
+//#endregion
+//#region src/runtime/registry.ts
+let _registry;
+const setRegistry = (registry) => {
+	_registry = registry;
+};
+const getRegistry = () => _registry ?? customElements;
+//#endregion
+//#region src/runtime/vdom/set-accessor.ts
+/**
+* Production setAccessor() function based on Preact by
+* Jason Miller (@developit)
+* Licensed under the MIT License
+* https://github.com/developit/preact/blob/master/LICENSE
+*
+* Modified for Stencil's compiler and vdom
+*/
+/** Per-element, per-attribute signal subscription disposers. */
+const signalAttrDisposers = /* @__PURE__ */ new WeakMap();
+const disposeAllSignalAttrs = (elm) => {
+	if (!BUILD.vdomSignals) return;
+	const map = signalAttrDisposers.get(elm);
+	if (map) {
+		map.forEach((d) => d());
+		signalAttrDisposers.delete(elm);
+	}
+};
+/**
+* When running a VDom render set properties present on a VDom node onto the
+* corresponding HTML element.
+*
+* Note that this function has special functionality for the `class`,
+* `style`, `key`, and `ref` attributes, as well as event handlers (like
+* `onClick`, etc). All others are just passed through as-is.
+*
+* @param elm the HTMLElement onto which attributes should be set
+* @param memberName the name of the attribute to set
+* @param oldValue the old value for the attribute
+* @param newValue the new value for the attribute
+* @param isSvg whether we're in an svg context or not
+* @param flags bitflags for Vdom variables
+* @param initialRender whether this is the first render of the VDom
+*/
+const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRender) => {
+	if (oldValue === newValue) return;
+	if (BUILD.vdomSignals && isSignalLike(newValue)) {
+		const attrMap = signalAttrDisposers.get(elm) ?? /* @__PURE__ */ new Map();
+		attrMap.get(memberName)?.();
+		if (!signalAttrDisposers.has(elm)) signalAttrDisposers.set(elm, attrMap);
+		let prevVal = oldValue;
+		attrMap.set(memberName, effect$1(() => {
+			const curVal = newValue.value;
+			setAccessor(elm, memberName, prevVal, curVal, isSvg, flags);
+			prevVal = curVal;
+		}));
+		return;
+	}
+	if (BUILD.vdomSignals && isSignalLike(oldValue)) {
+		const attrMap = signalAttrDisposers.get(elm);
+		if (attrMap) {
+			attrMap.get(memberName)?.();
+			attrMap.delete(memberName);
+		}
+	}
+	let isProp = isMemberInElement(elm, memberName);
+	let ln = memberName.toLowerCase();
+	if (BUILD.vdomClass && memberName === "class") {
+		const classList = elm.classList;
+		const oldClasses = parseClassList(oldValue);
+		let newClasses = parseClassList(newValue);
+		if (BUILD.hydrateClientSide && (elm["s-si"] || elm["s-sc"]) && initialRender) {
+			const scopeId = elm["s-sc"] || elm["s-si"];
+			newClasses.push(scopeId);
+			oldClasses.forEach((c) => {
+				if (c.startsWith(scopeId)) newClasses.push(c);
+			});
+			newClasses = [...new Set(newClasses)].filter((c) => c);
+			classList.add(...newClasses);
+		} else {
+			classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
+			classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
+		}
+	} 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 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") {
+		if (memberName[2] === "-") memberName = memberName.slice(3);
+		else if (isMemberInElement(win, ln)) memberName = ln.slice(2);
+		else memberName = ln[2] + memberName.slice(3);
+		if (oldValue || newValue) {
+			const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
+			memberName = memberName.replace(/* @__PURE__ */ new RegExp(CAPTURE_EVENT_SUFFIX + "$"), "");
+			if (oldValue) plt.rel(elm, memberName, oldValue, capture);
+			if (newValue) plt.ael(elm, memberName, newValue, capture);
+		}
+	} else if (BUILD.vdomPropOrAttr && memberName[0] === "a" && memberName.startsWith("attr:")) {
+		const propName = memberName.slice(5);
+		let attrName;
+		if (BUILD.member) {
+			const hostRef = getHostRef(elm);
+			if (hostRef && hostRef.$cmpMeta$ && hostRef.$cmpMeta$.$members$) {
+				const memberMeta = hostRef.$cmpMeta$.$members$[propName];
+				if (memberMeta && memberMeta[1]) attrName = memberMeta[1];
+			}
+		}
+		if (!attrName) attrName = propName.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+		if (newValue == null || newValue === false) {
+			if (newValue !== false || elm.getAttribute(attrName) === "") elm.removeAttribute(attrName);
+		} else elm.setAttribute(attrName, newValue === true ? "" : newValue);
+		return;
+	} else if (BUILD.vdomPropOrAttr && memberName[0] === "p" && memberName.startsWith("prop:")) {
+		const propName = memberName.slice(5);
+		try {
+			elm[propName] = newValue;
+		} catch {}
+		return;
+	} else if (BUILD.vdomPropOrAttr) {
+		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 (!elm["s-pp"]) elm["s-pp"] = /* @__PURE__ */ new Map();
+				elm["s-pp"].set(memberName, newValue);
+				return;
+			}
+		}
+		if ((isProp || isComplex && newValue !== null) && !isSvg) try {
+			if (!elm.tagName.includes("-")) {
+				const n = newValue == null ? "" : newValue;
+				if (memberName === "list") isProp = false;
+				else if (oldValue == null || elm[memberName] !== n) if (typeof elm.__lookupSetter__(memberName) === "function") elm[memberName] = n;
+				else elm.setAttribute(memberName, n);
+			} else if (elm[memberName] !== newValue) elm[memberName] = newValue;
+		} catch {}
+		/**
+		* Need to manually update attribute if:
+		* - memberName is not an attribute
+		* - if we are rendering the host element in order to reflect attribute
+		* - if it's a SVG, since properties might not work in <svg>
+		* - if the newValue is null/undefined or 'false'.
+		*/
+		let xlink = false;
+		if (BUILD.vdomXlink) {
+			if (ln !== (ln = ln.replace(/^xlink:?/, ""))) {
+				memberName = ln;
+				xlink = true;
+			}
+		}
+		if (newValue == null || newValue === false) {
+			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);
+			else elm.setAttribute(memberName, newValue);
+		}
+	}
+};
+const parseClassListRegex = /\s/;
+/**
+* Parsed a string of classnames into an array
+* @param value className string, e.g. "foo bar baz"
+* @returns list of classes, e.g. ["foo", "bar", "baz"]
+*/
+const parseClassList = (value) => {
+	if (typeof value === "object" && value && "baseVal" in value) value = value.baseVal;
+	if (!value || typeof value !== "string") return [];
+	return value.split(parseClassListRegex);
+};
+const CAPTURE_EVENT_SUFFIX = "Capture";
+//#endregion
+//#region src/runtime/vdom/update-element.ts
+/**
+* Handle updating attributes on the component element based on the current
+* values present in the virtual DOM.
+*
+* If the component of interest uses shadow DOM these are added to the shadow
+* root's host element.
+*
+* @param oldVnode an old virtual DOM node or null
+* @param newVnode a new virtual DOM node
+* @param isSvgMode whether or not we're in an SVG context
+* @param isInitialRender whether this is the first render of the VDOM
+*/
+const updateElement = (oldVnode, newVnode, isSvgMode, isInitialRender) => {
+	const oldVnodeAttrs = oldVnode && oldVnode.$attrs$ || {};
+	const newVnodeAttrs = newVnode.$attrs$ || {};
+	const oldKeys = Object.keys(oldVnodeAttrs);
+	const newKeys = Object.keys(newVnodeAttrs);
+	if (!BUILD.updatable && newKeys.length === 0) return;
+	if (BUILD.updatable && oldKeys.length === 0 && newKeys.length === 0) return;
+	const elm = newVnode.$elm$.nodeType === NODE_TYPE.DocumentFragment && newVnode.$elm$.host ? newVnode.$elm$.host : newVnode.$elm$;
+	if (BUILD.updatable) {
+		for (const memberName of sortedAttrNames(oldKeys)) if (!(memberName in newVnodeAttrs)) setAccessor(elm, memberName, oldVnodeAttrs[memberName], void 0, isSvgMode, newVnode.$flags$, isInitialRender);
+	}
+	for (const memberName of sortedAttrNames(newKeys)) setAccessor(elm, memberName, oldVnodeAttrs[memberName], newVnodeAttrs[memberName], isSvgMode, newVnode.$flags$, isInitialRender);
+};
+/**
+* Sort a list of attribute names to ensure that all the attribute names which
+* are _not_ `"ref"` come before `"ref"`. Preserve the order of the non-ref
+* attributes.
+*
+* **Note**: if the supplied attributes do not include `'ref'` then the same
+* (by reference) array will be returned without modification.
+*
+* @param attrNames attribute names to sort
+* @returns a list of attribute names, sorted if they include `"ref"`
+*/
+function sortedAttrNames(attrNames) {
+	if (!BUILD.vdomRef) return attrNames;
+	return attrNames.includes("ref") ? [...attrNames.filter((attr) => attr !== "ref"), "ref"] : attrNames;
+}
+//#endregion
+//#region src/runtime/vdom/vdom-render.ts
+/**
+* Virtual DOM patching algorithm based on Snabbdom by
+* Simon Friis Vindum (@paldepind)
+* Licensed under the MIT License
+* https://github.com/snabbdom/snabbdom/blob/master/LICENSE
+*
+* Modified for Stencil's renderer and slot projection
+*/
+let scopeId;
+let contentRef;
+let hostTagName;
+let useNativeShadowDom = false;
+let checkSlotFallbackVisibility = false;
+let checkSlotRelocate = false;
+let isSvgMode = false;
+/**
+* Queues for ref callbacks that need to be called during rendering.
+* These ensure that ref callbacks are called in the correct order:
+* first all removal callbacks (with null), then all attachment callbacks (with elements).
+*/
+const refCallbacksToRemove = [];
+const refCallbacksToAttach = [];
+/** Disposers for signal subscriptions on individual DOM nodes (text nodes, <s-show> wrappers). */
+const signalNodeDisposers = /* @__PURE__ */ new WeakMap();
+const disposeSignalVNode = (vnode) => {
+	const elm = vnode.$elm$;
+	if (elm) {
+		const dispose = signalNodeDisposers.get(elm);
+		if (dispose) {
+			dispose();
+			signalNodeDisposers.delete(elm);
+		}
+		disposeAllSignalAttrs(elm);
+	}
+	vnode.$children$?.forEach(disposeSignalVNode);
+};
+/**
+* Create a DOM Node corresponding to one of the children of a given VNode.
+*
+* @param oldParentVNode the parent VNode from the previous render
+* @param newParentVNode the parent VNode from the current render
+* @param childIndex the index of the VNode, in the _new_ parent node's
+* children, for which we will create a new DOM node
+* @returns the newly created node
+*/
+const createElm = (oldParentVNode, newParentVNode, childIndex) => {
+	const newVNode = newParentVNode.$children$[childIndex];
+	let i = 0;
+	let elm;
+	let childNode;
+	let oldVNode;
+	if (BUILD.slotRelocation && !useNativeShadowDom) {
+		checkSlotRelocate = true;
+		if (newVNode.$tag$ === "slot") newVNode.$flags$ |= newVNode.$children$ ? VNODE_FLAGS.isSlotFallback : VNODE_FLAGS.isSlotReference;
+	}
+	if (BUILD.isDev && newVNode.$elm$) consoleDevError(`The JSX ${newVNode.$text$ !== null ? `"${newVNode.$text$}" text` : `"${String(newVNode.$tag$)}" element`} node should not be shared within the same renderer. The renderer caches element lookups in order to improve performance. However, a side effect from this is that the exact same JSX node should not be reused. For more information please see https://stenciljs.com/docs/templating-jsx#avoid-shared-jsx-nodes`);
+	if (BUILD.vdomText && newVNode.$text$ != null) {
+		elm = newVNode.$elm$ = win.document.createTextNode(newVNode.$text$);
+		if (BUILD.vdomSignals && newVNode.$signal$) {
+			const textSig = newVNode.$signal$;
+			const textNode = elm;
+			signalNodeDisposers.set(textNode, effect$1(() => {
+				textNode.data = String(textSig.value);
+			}));
+		}
+	} else if (BUILD.slotRelocation && newVNode.$flags$ & VNODE_FLAGS.isSlotReference) {
+		elm = newVNode.$elm$ = BUILD.isDebug || BUILD.hydrateServerSide ? slotReferenceDebugNode(newVNode) : win.document.createTextNode("");
+		if (BUILD.vdomAttribute) updateElement(null, newVNode, isSvgMode);
+	} else {
+		if (BUILD.svg && !isSvgMode) isSvgMode = newVNode.$tag$ === "svg";
+		if (!win.document) throw new Error("No DOM environment available for rendering.");
+		const tag = !useNativeShadowDom && BUILD.slotRelocation && newVNode.$flags$ & VNODE_FLAGS.isSlotFallback ? "slot-fb" : newVNode.$tag$;
+		const _reg = getRegistry();
+		const registryOpts = _reg !== win.customElements && tag.includes("-") ? { customElementRegistry: _reg } : void 0;
+		elm = newVNode.$elm$ = BUILD.svg && isSvgMode ? win.document.createElementNS(SVG_NS, tag) : win.document.createElement(tag, registryOpts);
+		if (BUILD.svg && isSvgMode && newVNode.$tag$ === "foreignObject") isSvgMode = false;
+		if (BUILD.vdomAttribute) updateElement(null, newVNode, isSvgMode);
+		if ((BUILD.scoped || BUILD.hydrateServerSide && CMP_FLAGS.shadowNeedsScopedCss) && isDef(scopeId) && elm["s-si"] !== scopeId) elm.classList.add(elm["s-si"] = scopeId);
+		if (newVNode.$children$) {
+			const appendTarget = newVNode.$tag$ === "template" ? elm.content : elm;
+			for (i = 0; i < newVNode.$children$.length; ++i) {
+				childNode = createElm(oldParentVNode, newVNode, i);
+				if (childNode) appendTarget.appendChild(childNode);
+			}
+		}
+		if (BUILD.svg) {
+			if (newVNode.$tag$ === "svg") isSvgMode = false;
+			else if (elm.tagName === "foreignObject") isSvgMode = true;
+		}
+	}
+	elm["s-hn"] = hostTagName;
+	if (BUILD.slotRelocation) {
+		if (newVNode.$flags$ & (VNODE_FLAGS.isSlotFallback | VNODE_FLAGS.isSlotReference)) {
+			elm["s-sr"] = true;
+			elm["s-cr"] = contentRef;
+			elm["s-sn"] = newVNode.$name$ || "";
+			elm["s-rf"] = newVNode.$attrs$?.ref;
+			patchSlotNode(elm);
+			oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex];
+			if (oldVNode && oldVNode.$tag$ === newVNode.$tag$ && oldParentVNode.$elm$) relocateToHostRoot(oldParentVNode.$elm$);
+			if (BUILD.scoped || BUILD.hydrateServerSide && CMP_FLAGS.shadowNeedsScopedCss) addRemoveSlotScopedClass(contentRef, elm, newParentVNode.$elm$, oldParentVNode?.$elm$);
+		}
+	}
+	return elm;
+};
+/**
+* Relocates all child nodes of an element that were a part of a previous slot relocation
+* to the root of the Stencil component currently being rendered. This happens when a parent
+* element of a slot reference node dynamically changes and triggers a re-render. We cannot use
+* `putBackInOriginalLocation()` because that may relocate nodes to elements that will not be re-rendered
+* and so they will not be relocated again.
+*
+* @param parentElm The element potentially containing relocated nodes.
+*/
+const relocateToHostRoot = (parentElm) => {
+	plt.$flags$ |= PLATFORM_FLAGS.isTmpDisconnected;
+	const host = parentElm.closest(hostTagName.toLowerCase());
+	if (host != null) {
+		const contentRefNode = Array.from(host.__childNodes || host.childNodes).find((ref) => ref["s-cr"]);
+		const childNodeArray = Array.from(parentElm.__childNodes || parentElm.childNodes);
+		for (const childNode of contentRefNode ? childNodeArray.reverse() : childNodeArray) if (childNode["s-sh"] != null) {
+			insertBefore(host, childNode, contentRefNode ?? null);
+			childNode["s-sh"] = void 0;
+			checkSlotRelocate = true;
+		}
+	}
+	plt.$flags$ &= ~PLATFORM_FLAGS.isTmpDisconnected;
+};
+/**
+* Puts `<slot>` nodes and any slotted nodes back to their original location (wherever they were before being slotted).
+*
+* @param parentElm - The parent element of the nodes to relocate.
+* @param recursive - Whether or not to relocate nodes in child nodes as well.
+*/
+const putBackInOriginalLocation = (parentElm, recursive) => {
+	plt.$flags$ |= PLATFORM_FLAGS.isTmpDisconnected;
+	const oldSlotChildNodes = Array.from(parentElm.__childNodes || parentElm.childNodes);
+	if (parentElm["s-sr"]) {
+		let node = parentElm;
+		while (node = node.nextSibling) if (node && node["s-sn"] === parentElm["s-sn"] && node["s-sh"] === hostTagName) oldSlotChildNodes.push(node);
+	}
+	for (let i = oldSlotChildNodes.length - 1; i >= 0; i--) {
+		const childNode = oldSlotChildNodes[i];
+		if (childNode["s-hn"] !== hostTagName && childNode["s-ol"]) {
+			insertBefore(referenceNode(childNode).parentNode, childNode, referenceNode(childNode));
+			childNode["s-ol"].remove();
+			childNode["s-ol"] = void 0;
+			childNode["s-sh"] = void 0;
+			checkSlotRelocate = true;
+		}
+		if (recursive) putBackInOriginalLocation(childNode, recursive);
+	}
+	plt.$flags$ &= ~PLATFORM_FLAGS.isTmpDisconnected;
+};
+/**
+* Create DOM nodes corresponding to a list of {@link d.Vnode} objects and
+* add them to the DOM in the appropriate place.
+*
+* @param parentElm the DOM node which should be used as a parent for the new
+* DOM nodes
+* @param before a child of the `parentElm` which the new children should be
+* inserted before (optional)
+* @param parentVNode the parent virtual DOM node
+* @param vnodes the new child virtual DOM nodes to produce DOM nodes for
+* @param startIdx the index in the child virtual DOM nodes at which to start
+* creating DOM nodes (inclusive)
+* @param endIdx the index in the child virtual DOM nodes at which to stop
+* creating DOM nodes (inclusive)
+*/
+const addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => {
+	let containerElm = BUILD.slotRelocation && parentElm["s-cr"] && parentElm["s-cr"].parentNode || parentElm;
+	let childNode;
+	if (BUILD.shadowDom && containerElm.tagName === hostTagName) {
+		const shadow = getShadowRoot(containerElm);
+		if (shadow) containerElm = shadow;
+	}
+	if (parentVNode.$tag$ === "template") containerElm = containerElm.content;
+	for (; startIdx <= endIdx; ++startIdx) if (vnodes[startIdx]) {
+		childNode = createElm(null, parentVNode, startIdx);
+		if (childNode) {
+			vnodes[startIdx].$elm$ = childNode;
+			insertBefore(containerElm, childNode, BUILD.slotRelocation ? referenceNode(before) : before);
+		}
+	}
+};
+/**
+* Remove the DOM elements corresponding to a list of {@link d.VNode} objects.
+* This can be used to, for instance, clean up after a list of children which
+* should no longer be shown.
+*
+* This function also handles some of Stencil's slot relocation logic.
+*
+* @param vnodes a list of virtual DOM nodes to remove
+* @param startIdx the index at which to start removing nodes (inclusive)
+* @param endIdx the index at which to stop removing nodes (inclusive)
+*/
+const removeVnodes = (vnodes, startIdx, endIdx) => {
+	for (let index = startIdx; index <= endIdx; ++index) {
+		const vnode = vnodes[index];
+		if (vnode) {
+			const elm = vnode.$elm$;
+			nullifyVNodeRefs(vnode);
+			if (BUILD.vdomSignals) disposeSignalVNode(vnode);
+			if (elm) {
+				if (BUILD.slotRelocation) {
+					checkSlotFallbackVisibility = true;
+					if (elm["s-ol"]) elm["s-ol"].remove();
+					else putBackInOriginalLocation(elm, true);
+				}
+				elm.remove();
+			}
+		}
+	}
+};
+/**
+* Reconcile the children of a new VNode with the children of an old VNode by
+* traversing the two collections of children, identifying nodes that are
+* conserved or changed, calling out to `patch` to make any necessary
+* updates to the DOM, and rearranging DOM nodes as needed.
+*
+* The algorithm for reconciling children works by analyzing two 'windows' onto
+* the two arrays of children (`oldCh` and `newCh`). We keep track of the
+* 'windows' by storing start and end indices and references to the
+* corresponding array entries. Initially the two 'windows' are basically equal
+* to the entire array, but we progressively narrow the windows until there are
+* no children left to update by doing the following:
+*
+* 1. Skip any `null` entries at the beginning or end of the two arrays, so
+*    that if we have an initial array like the following we'll end up dealing
+*    only with a window bounded by the highlighted elements:
+*
+*    [null, null, VNode1 , ... , VNode2, null, null]
+*                 ^^^^^^         ^^^^^^
+*
+* 2. Check to see if the elements at the head and tail positions are equal
+*    across the windows. This will basically detect elements which haven't
+*    been added, removed, or changed position, i.e. if you had the following
+*    VNode elements (represented as HTML):
+*
+*    oldVNode: `<div><p><span>HEY</span></p></div>`
+*    newVNode: `<div><p><span>THERE</span></p></div>`
+*
+*    Then when comparing the children of the `<div>` tag we check the equality
+*    of the VNodes corresponding to the `<p>` tags and, since they are the
+*    same tag in the same position, we'd be able to avoid completely
+*    re-rendering the subtree under them with a new DOM element and would just
+*    call out to `patch` to handle reconciling their children and so on.
+*
+* 3. Check, for both windows, to see if the element at the beginning of the
+*    window corresponds to the element at the end of the other window. This is
+*    a heuristic which will let us identify _some_ situations in which
+*    elements have changed position, for instance it _should_ detect that the
+*    children nodes themselves have not changed but merely moved in the
+*    following example:
+*
+*    oldVNode: `<div><element-one /><element-two /></div>`
+*    newVNode: `<div><element-two /><element-one /></div>`
+*
+*    If we find cases like this then we also need to move the concrete DOM
+*    elements corresponding to the moved children to write the re-order to the
+*    DOM.
+*
+* 4. Finally, if VNodes have the `key` attribute set on them we check for any
+*    nodes in the old children which have the same key as the first element in
+*    our window on the new children. If we find such a node we handle calling
+*    out to `patch`, moving relevant DOM nodes, and so on, in accordance with
+*    what we find.
+*
+* Finally, once we've narrowed our 'windows' to the point that either of them
+* collapse (i.e. they have length 0) we then handle any remaining VNode
+* insertion or deletion that needs to happen to get a DOM state that correctly
+* reflects the new child VNodes. If, for instance, after our window on the old
+* children has collapsed we still have more nodes on the new children that
+* we haven't dealt with yet then we need to add them, or if the new children
+* collapse but we still have unhandled _old_ children then we need to make
+* sure the corresponding DOM nodes are removed.
+*
+* @param parentElm the node into which the parent VNode is rendered
+* @param oldCh the old children of the parent node
+* @param newVNode the new VNode which will replace the parent
+* @param newCh the new children of the parent node
+* @param isInitialRender whether or not this is the first render of the vdom
+*/
+const updateChildren = (parentElm, oldCh, newVNode, newCh, isInitialRender = false) => {
+	let oldStartIdx = 0;
+	let newStartIdx = 0;
+	let idxInOld = 0;
+	let i = 0;
+	let oldEndIdx = oldCh.length - 1;
+	let oldStartVnode = oldCh[0];
+	let oldEndVnode = oldCh[oldEndIdx];
+	let newEndIdx = newCh.length - 1;
+	let newStartVnode = newCh[0];
+	let newEndVnode = newCh[newEndIdx];
+	let node;
+	let elmToMove;
+	const containerElm = newVNode.$tag$ === "template" ? parentElm.content : parentElm;
+	while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) if (oldStartVnode == null) oldStartVnode = oldCh[++oldStartIdx];
+	else if (oldEndVnode == null) oldEndVnode = oldCh[--oldEndIdx];
+	else if (newStartVnode == null) newStartVnode = newCh[++newStartIdx];
+	else if (newEndVnode == null) newEndVnode = newCh[--newEndIdx];
+	else if (isSameVnode(oldStartVnode, newStartVnode, isInitialRender)) {
+		patch(oldStartVnode, newStartVnode, isInitialRender);
+		oldStartVnode = oldCh[++oldStartIdx];
+		newStartVnode = newCh[++newStartIdx];
+	} else if (isSameVnode(oldEndVnode, newEndVnode, isInitialRender)) {
+		patch(oldEndVnode, newEndVnode, isInitialRender);
+		oldEndVnode = oldCh[--oldEndIdx];
+		newEndVnode = newCh[--newEndIdx];
+	} else if (isSameVnode(oldStartVnode, newEndVnode, isInitialRender)) {
+		if (BUILD.slotRelocation && (oldStartVnode.$tag$ === "slot" || newEndVnode.$tag$ === "slot")) putBackInOriginalLocation(oldStartVnode.$elm$.parentNode, false);
+		patch(oldStartVnode, newEndVnode, isInitialRender);
+		insertBefore(containerElm, oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling);
+		oldStartVnode = oldCh[++oldStartIdx];
+		newEndVnode = newCh[--newEndIdx];
+	} else if (isSameVnode(oldEndVnode, newStartVnode, isInitialRender)) {
+		if (BUILD.slotRelocation && (oldStartVnode.$tag$ === "slot" || newEndVnode.$tag$ === "slot")) putBackInOriginalLocation(oldEndVnode.$elm$.parentNode, false);
+		patch(oldEndVnode, newStartVnode, isInitialRender);
+		insertBefore(containerElm, oldEndVnode.$elm$, oldStartVnode.$elm$);
+		oldEndVnode = oldCh[--oldEndIdx];
+		newStartVnode = newCh[++newStartIdx];
+	} else {
+		idxInOld = -1;
+		if (BUILD.vdomKey) {
+			for (i = oldStartIdx; i <= oldEndIdx; ++i) if (oldCh[i] && oldCh[i].$key$ !== null && oldCh[i].$key$ === newStartVnode.$key$) {
+				idxInOld = i;
+				break;
+			}
+		}
+		if (BUILD.vdomKey && idxInOld >= 0) {
+			elmToMove = oldCh[idxInOld];
+			if (elmToMove.$tag$ !== newStartVnode.$tag$) node = createElm(oldCh && oldCh[newStartIdx], newVNode, idxInOld);
+			else {
+				patch(elmToMove, newStartVnode, isInitialRender);
+				oldCh[idxInOld] = void 0;
+				node = elmToMove.$elm$;
+			}
+			newStartVnode = newCh[++newStartIdx];
+		} else {
+			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 (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);
+};
+/**
+* Compare two VNodes to determine if they are the same
+*
+* **NB**: This function is an equality _heuristic_ based on the available
+* information set on the two VNodes and can be misleading under certain
+* circumstances. In particular, if the two nodes do not have `key` attrs
+* (available under `$key$` on VNodes) then the function falls back on merely
+* checking that they have the same tag.
+*
+* So, in other words, if `key` attrs are not set on VNodes which may be
+* changing order within a `children` array or something along those lines then
+* we could obtain a false negative and then have to do needless re-rendering
+* (i.e. we'd say two VNodes aren't equal when in fact they should be).
+*
+* @param leftVNode the first VNode to check
+* @param rightVNode the second VNode to check
+* @param isInitialRender whether or not this is the first render of the vdom
+* @returns whether they're equal or not
+*/
+const isSameVnode = (leftVNode, rightVNode, isInitialRender = false) => {
+	if (leftVNode.$tag$ === rightVNode.$tag$) {
+		if (BUILD.slotRelocation && leftVNode.$tag$ === "slot") return leftVNode.$name$ === rightVNode.$name$;
+		if (BUILD.vdomKey && !isInitialRender) return leftVNode.$key$ === rightVNode.$key$;
+		if (isInitialRender && !leftVNode.$key$ && rightVNode.$key$) leftVNode.$key$ = rightVNode.$key$;
+		return true;
+	}
+	return false;
+};
+/**
+* Returns the reference node (a comment which represents the
+* original location of a node in the vdom - before it was moved to its slot)
+* of a given node.
+*
+* (slot nodes can be relocated to a new location in the dom because of
+* some other component's slot)
+* @param node the node to find the original location reference node for
+* @returns reference node
+*/
+const referenceNode = (node) => node && node["s-ol"] || node;
+/**
+* Handle reconciling an outdated VNode with a new one which corresponds to
+* it. This function handles flushing updates to the DOM and reconciling the
+* children of the two nodes (if any).
+*
+* @param oldVNode an old VNode whose DOM element and children we want to update
+* @param newVNode a new VNode representing an updated version of the old one
+* @param isInitialRender whether or not this is the first render of the vdom
+*/
+const patch = (oldVNode, newVNode, isInitialRender = false) => {
+	const elm = newVNode.$elm$ = oldVNode.$elm$;
+	const oldChildren = oldVNode.$children$;
+	const newChildren = newVNode.$children$;
+	const tag = newVNode.$tag$;
+	const text = newVNode.$text$;
+	let defaultHolder;
+	if (!BUILD.vdomText || text == null) {
+		if (BUILD.svg) isSvgMode = tag === "svg" ? true : tag === "foreignObject" ? false : isSvgMode;
+		if (BUILD.vdomAttribute || BUILD.reflect) {
+			if (BUILD.slot && tag === "slot" && !useNativeShadowDom) {
+				if (oldVNode.$name$ !== newVNode.$name$) {
+					newVNode.$elm$["s-sn"] = newVNode.$name$ || "";
+					relocateToHostRoot(newVNode.$elm$.parentElement);
+				}
+			}
+			updateElement(oldVNode, newVNode, isSvgMode, isInitialRender);
+		}
+		if (BUILD.updatable && oldChildren !== null && newChildren !== null) updateChildren(elm, oldChildren, newVNode, newChildren, isInitialRender);
+		else if (newChildren !== null) {
+			if (BUILD.updatable && BUILD.vdomText && oldVNode.$text$ !== null) elm.textContent = "";
+			addVnodes(elm, null, newVNode, newChildren, 0, newChildren.length - 1);
+		} else if (!isInitialRender && BUILD.updatable && oldChildren !== null) removeVnodes(oldChildren, 0, oldChildren.length - 1);
+		else if (BUILD.hydrateClientSide && isInitialRender && BUILD.updatable && oldChildren !== null && newChildren === null) newVNode.$children$ = oldChildren;
+		if (BUILD.svg && isSvgMode && tag === "svg") isSvgMode = false;
+	} else if (BUILD.vdomText && BUILD.slotRelocation && (defaultHolder = elm["s-cr"])) defaultHolder.parentNode.textContent = text;
+	else if (BUILD.vdomText && oldVNode.$text$ !== text) elm.data = text;
+};
+/**
+* Component-global information about nodes which are either currently being
+* relocated or will be shortly.
+*/
+const relocateNodes = [];
+/**
+* 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}.
+*
+* @param elm a render node whose child nodes need to be relocated
+*/
+const markSlotContentForRelocation = (elm) => {
+	let node;
+	let hostContentNodes;
+	let j;
+	const children = elm.__childNodes || elm.childNodes;
+	for (const childNode of children) {
+		if (childNode["s-sr"] && (node = childNode["s-cr"]) && node.parentNode) {
+			hostContentNodes = node.parentNode.__childNodes || node.parentNode.childNodes;
+			const slotName = childNode["s-sn"];
+			for (j = hostContentNodes.length - 1; j >= 0; j--) {
+				node = hostContentNodes[j];
+				if (!node["s-cn"] && !node["s-nr"] && node["s-hn"] !== childNode["s-hn"] && (!node["s-sh"] || node["s-sh"] !== childNode["s-hn"])) {
+					if (isNodeLocatedInSlot(node, slotName)) {
+						let relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
+						checkSlotFallbackVisibility = true;
+						node["s-sn"] = node["s-sn"] || slotName;
+						if (relocateNodeData) {
+							relocateNodeData.$nodeToRelocate$["s-sh"] = childNode["s-hn"];
+							relocateNodeData.$slotRefNode$ = childNode;
+						} else {
+							node["s-sh"] = childNode["s-hn"];
+							relocateNodes.push({
+								$slotRefNode$: childNode,
+								$nodeToRelocate$: node
+							});
+						}
+						if (node["s-sr"]) relocateNodes.map((relocateNode) => {
+							if (isNodeLocatedInSlot(relocateNode.$nodeToRelocate$, node["s-sn"])) {
+								relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
+								if (relocateNodeData && !relocateNode.$slotRefNode$) relocateNode.$slotRefNode$ = relocateNodeData.$slotRefNode$;
+							}
+						});
+					} else if (!relocateNodes.some((r) => r.$nodeToRelocate$ === node)) relocateNodes.push({ $nodeToRelocate$: node });
+				}
+			}
+		}
+		if (childNode.nodeType === NODE_TYPE.ElementNode) markSlotContentForRelocation(childNode);
+	}
+};
+/**
+* 'Nullify' any VDom `ref` callbacks on a VDom node or its children by calling
+* them with `null`. This signals that the DOM element corresponding to the VDom
+* node has been removed from the DOM.
+*
+* @param vNode a virtual DOM node
+*/
+const nullifyVNodeRefs = (vNode) => {
+	if (BUILD.vdomRef) {
+		if (vNode.$attrs$ && vNode.$attrs$.ref) refCallbacksToRemove.push(() => vNode.$attrs$.ref(null));
+		if (vNode.$children$) vNode.$children$.map(nullifyVNodeRefs);
+	}
+};
+/**
+* Queue a ref callback to be called with an element during rendering.
+* This ensures ref callbacks are called in the correct order.
+*
+* @param refCallback the ref callback function to queue
+* @param elm the element to pass to the callback
+*/
+const queueRefAttachment = (refCallback, elm) => {
+	if (BUILD.vdomRef) refCallbacksToAttach.push(() => refCallback(elm));
+};
+/**
+* Flush all queued ref callbacks in the correct order:
+* first all removal callbacks (with null), then all attachment callbacks (with elements).
+* This ensures that when elements are replaced/reordered, the ref is always left
+* pointing to the current element, not null.
+*/
+const flushQueuedRefCallbacks = () => {
+	if (BUILD.vdomRef) {
+		refCallbacksToRemove.forEach((cb) => cb());
+		refCallbacksToRemove.length = 0;
+		refCallbacksToAttach.forEach((cb) => cb());
+		refCallbacksToAttach.length = 0;
+	}
+};
+/**
+* Inserts a node before a reference node as a child of a specified parent node.
+* Additionally, adds parent elements' scope ids as class names to the new node.
+*
+* @param parent parent node
+* @param newNode element to be inserted
+* @param reference anchor element
+* @param isInitialLoad whether or not this is the first render
+* @returns inserted node
+*/
+const insertBefore = (parent, newNode, reference, isInitialLoad) => {
+	if (BUILD.slotRelocation) {
+		if (BUILD.scoped && typeof newNode["s-sn"] === "string" && !!newNode["s-sr"] && !!newNode["s-cr"]) addRemoveSlotScopedClass(newNode["s-cr"], newNode, parent, newNode.parentElement);
+		else if (typeof newNode["s-sn"] === "string") {
+			const hostElm = newNode["s-hn"] && parent.closest?.(newNode["s-hn"]);
+			if ((BUILD.lightDomPatches || BUILD.slotChildNodes || BUILD.patchAll && !!(hostElm && getHostRef(hostElm)?.$cmpMeta$.$flags$ & CMP_FLAGS.patchAll)) && parent.getRootNode().nodeType !== NODE_TYPES.DOCUMENT_FRAGMENT_NODE) patchParentNode(newNode);
+			parent.insertBefore(newNode, reference);
+			const { slotNode } = findSlotFromSlottedNode(newNode);
+			if (slotNode && !isInitialLoad) dispatchSlotChangeEvent(slotNode);
+			return newNode;
+		}
+	}
+	if (parent.__insertBefore) return parent.__insertBefore(newNode, reference);
+	else return parent?.insertBefore(newNode, reference);
+};
+/**
+* Adds or removes a scoped class to the parent element of a slotted node.
+* This is used for styling slotted content (e.g. with `::scoped(...) {...}` selectors )
+* in `scoped: true` components.
+*
+* @param reference - Content Reference Node. Used to get the scope id of the parent component.
+* @param slotNode - the `<slot>` node to apply the class for
+* @param newParent - the slots' new parent element that requires the scoped class
+* @param oldParent - optionally, an old parent element that may no longer require the scoped class
+*/
+function addRemoveSlotScopedClass(reference, slotNode, newParent, oldParent) {
+	let slotScopeId;
+	if (reference && typeof slotNode["s-sn"] === "string" && !!slotNode["s-sr"] && reference.parentNode && reference.parentNode["s-sc"] && (slotScopeId = slotNode["s-si"] || reference.parentNode["s-sc"])) {
+		const scopeName = slotNode["s-sn"];
+		const hostName = slotNode["s-hn"];
+		newParent.classList?.add(slotScopeId + "-s");
+		if (oldParent && oldParent.classList?.contains(slotScopeId + "-s")) {
+			let child = (oldParent.__childNodes || oldParent.childNodes)[0];
+			let found = false;
+			while (child) {
+				if (child["s-sn"] !== scopeName && child["s-hn"] === hostName && !!child["s-sr"]) {
+					found = true;
+					break;
+				}
+				child = child.nextSibling;
+			}
+			if (!found) oldParent.classList.remove(slotScopeId + "-s");
+		}
+	}
+}
+/**
+* The main entry point for Stencil's virtual DOM-based rendering engine
+*
+* Given a {@link d.HostRef} container and some virtual DOM nodes, this
+* function will handle creating a virtual DOM tree with a single root, patching
+* the current virtual DOM tree onto an old one (if any), dealing with slot
+* relocation, and reflecting attributes.
+*
+* @param hostRef data needed to root and render the virtual DOM tree, such as
+* the DOM node into which it should be rendered.
+* @param renderFnResults the virtual DOM nodes to be rendered
+* @param isInitialLoad whether or not this is the first call after page load
+*/
+const renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
+	const hostElm = hostRef.$hostElement$;
+	const cmpMeta = hostRef.$cmpMeta$;
+	const oldVNode = hostRef.$vnode$ || newVNode(null, null);
+	const rootVnode = isHost(renderFnResults) ? renderFnResults : h(null, null, renderFnResults);
+	hostTagName = hostElm.tagName;
+	if (BUILD.isDev && Array.isArray(renderFnResults) && renderFnResults.some(isHost)) throw new Error(`The <Host> must be the single root component.
+Looks like the render() function of "${hostTagName.toLowerCase()}" is returning an array that contains the <Host>.
+
+The render() function should look like this instead:
+
+render() {
+  // Do not return an array
+  return (
+    <Host>{content}</Host>
+  );
+}
+  `);
+	if (BUILD.reflect && cmpMeta.$attrsToReflect$) {
+		rootVnode.$attrs$ = rootVnode.$attrs$ || {};
+		cmpMeta.$attrsToReflect$.forEach(([propName, attribute]) => {
+			if (BUILD.serializer && hostRef.$serializerValues$.has(propName)) rootVnode.$attrs$[attribute] = hostRef.$serializerValues$.get(propName);
+			else rootVnode.$attrs$[attribute] = hostElm[propName];
+		});
+	}
+	if (isInitialLoad && rootVnode.$attrs$) {
+		for (const key of Object.keys(rootVnode.$attrs$)) if (hostElm.hasAttribute(key) && ![
+			"key",
+			"ref",
+			"style",
+			"class"
+		].includes(key)) rootVnode.$attrs$[key] = hostElm[key];
+	}
+	rootVnode.$tag$ = null;
+	rootVnode.$flags$ |= VNODE_FLAGS.isHost;
+	hostRef.$vnode$ = rootVnode;
+	rootVnode.$elm$ = oldVNode.$elm$ = BUILD.shadowDom ? getShadowRoot(hostElm) || hostElm : hostElm;
+	if (BUILD.scoped || BUILD.shadowDom) scopeId = hostElm["s-sc"];
+	useNativeShadowDom = !!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && !(cmpMeta.$flags$ & CMP_FLAGS.shadowNeedsScopedCss);
+	if (BUILD.slotRelocation) {
+		contentRef = hostElm["s-cr"];
+		checkSlotFallbackVisibility = false;
+	}
+	patch(oldVNode, rootVnode, isInitialLoad);
+	if (BUILD.slotRelocation) {
+		plt.$flags$ |= PLATFORM_FLAGS.isTmpDisconnected;
+		if (checkSlotRelocate) {
+			markSlotContentForRelocation(rootVnode.$elm$);
+			for (const relocateData of relocateNodes) {
+				const nodeToRelocate = relocateData.$nodeToRelocate$;
+				if (!nodeToRelocate["s-ol"] && win.document) {
+					const orgLocationNode = BUILD.isDebug || BUILD.hydrateServerSide ? originalLocationDebugNode(nodeToRelocate) : win.document.createTextNode("");
+					orgLocationNode["s-nr"] = nodeToRelocate;
+					insertBefore(nodeToRelocate.parentNode, nodeToRelocate["s-ol"] = orgLocationNode, nodeToRelocate, isInitialLoad);
+				}
+			}
+			for (const relocateData of relocateNodes) {
+				const nodeToRelocate = relocateData.$nodeToRelocate$;
+				const slotRefNode = relocateData.$slotRefNode$;
+				if (nodeToRelocate.nodeType === NODE_TYPE.ElementNode && isInitialLoad) nodeToRelocate["s-ih"] = !!nodeToRelocate.hidden;
+				if (slotRefNode) {
+					const parentNodeRef = slotRefNode.parentNode;
+					let insertBeforeNode = slotRefNode.nextSibling;
+					if (!BUILD.hydrateServerSide && insertBeforeNode && insertBeforeNode.nodeType === NODE_TYPE.ElementNode) {
+						let orgLocationNode = nodeToRelocate["s-ol"]?.previousSibling;
+						while (orgLocationNode) {
+							let refNode = orgLocationNode["s-nr"] ?? null;
+							if (refNode && refNode["s-sn"] === nodeToRelocate["s-sn"] && parentNodeRef === (refNode.__parentNode || refNode.parentNode)) {
+								refNode = refNode.nextSibling;
+								while (refNode === nodeToRelocate || refNode?.["s-sr"]) refNode = refNode?.nextSibling;
+								if (!refNode || !refNode["s-nr"]) {
+									insertBeforeNode = refNode;
+									break;
+								}
+							}
+							orgLocationNode = orgLocationNode.previousSibling;
+						}
+					}
+					const parent = nodeToRelocate.__parentNode || nodeToRelocate.parentNode;
+					const nextSibling = nodeToRelocate.__nextSibling || nodeToRelocate.nextSibling;
+					if (!insertBeforeNode && parentNodeRef !== parent || nextSibling !== insertBeforeNode) {
+						if (nodeToRelocate !== insertBeforeNode) {
+							insertBefore(parentNodeRef, nodeToRelocate, insertBeforeNode, isInitialLoad);
+							if (nodeToRelocate.nodeType === NODE_TYPE.CommentNode && nodeToRelocate.nodeValue.startsWith("s-nt-")) {
+								const textNode = win.document.createTextNode(nodeToRelocate.nodeValue.replace(/^s-nt-/, ""));
+								textNode["s-hn"] = nodeToRelocate["s-hn"];
+								textNode["s-sn"] = nodeToRelocate["s-sn"];
+								textNode["s-sh"] = nodeToRelocate["s-sh"];
+								textNode["s-sr"] = nodeToRelocate["s-sr"];
+								textNode["s-ol"] = nodeToRelocate["s-ol"];
+								textNode["s-ol"]["s-nr"] = textNode;
+								insertBefore(nodeToRelocate.parentNode, textNode, nodeToRelocate, isInitialLoad);
+								nodeToRelocate.parentNode.removeChild(nodeToRelocate);
+							}
+							if (nodeToRelocate.nodeType === NODE_TYPE.ElementNode && nodeToRelocate.tagName !== "SLOT-FB") nodeToRelocate.hidden = nodeToRelocate["s-ih"] ?? false;
+						}
+					}
+					if (nodeToRelocate && typeof slotRefNode["s-rf"] === "function") slotRefNode["s-rf"](slotRefNode);
+				} else if (nodeToRelocate.nodeType === NODE_TYPE.ElementNode) nodeToRelocate.hidden = true;
+			}
+		}
+		if (checkSlotFallbackVisibility) updateFallbackSlotVisibility(rootVnode.$elm$);
+		plt.$flags$ &= ~PLATFORM_FLAGS.isTmpDisconnected;
+		relocateNodes.length = 0;
+	}
+	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"]) {
+			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()) {
+				const textCommentNode = win.document.createComment("s-nt-" + childNode.nodeValue);
+				textCommentNode["s-sn"] = childNode["s-sn"];
+				insertBefore(childNode.parentNode, textCommentNode, childNode, isInitialLoad);
+				childNode.parentNode.removeChild(childNode);
+			}
+		}
+	}
+	contentRef = void 0;
+	flushQueuedRefCallbacks();
+};
+const slotReferenceDebugNode = (slotVNode) => win.document?.createComment(`<slot${slotVNode.$name$ ? " name=\"" + slotVNode.$name$ + "\"" : ""}> (host=${hostTagName.toLowerCase()})`);
+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
+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();
+		}));
+	}
+};
+const scheduleUpdate = (hostRef, isInitialLoad) => {
+	if (BUILD.taskQueue && BUILD.updatable) hostRef.$flags$ |= HOST_FLAGS.isQueuedForUpdate;
+	if (BUILD.asyncLoading && hostRef.$flags$ & HOST_FLAGS.isWaitingForChildren) {
+		hostRef.$flags$ |= HOST_FLAGS.needsRerender;
+		return;
+	}
+	attachToAncestor(hostRef, hostRef.$ancestorComponent$);
+	const dispatch = () => dispatchHooks(hostRef, isInitialLoad);
+	if (isInitialLoad) {
+		queueMicrotask(() => {
+			dispatch();
+		});
+		return;
+	}
+	return BUILD.taskQueue ? writeTask(dispatch) : dispatch();
+};
+/**
+* Dispatch initial-render and update lifecycle hooks, enqueuing calls to
+* component lifecycle methods like `componentWillLoad` as well as
+* {@link updateComponent}, which will kick off the virtual DOM re-render.
+*
+* @param hostRef a reference to a host DOM node
+* @param isInitialLoad whether we're on the initial load or not
+* @returns an empty Promise which is used to enqueue a series of operations for
+* the component
+*/
+const dispatchHooks = (hostRef, isInitialLoad) => {
+	const elm = hostRef.$hostElement$;
+	const endSchedule = createTime("scheduleUpdate", hostRef.$cmpMeta$.$tagName$);
+	const instance = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
+	/**
+	* Given a user imports a component compiled with a `dist-custom-element`
+	* output target into a Stencil project compiled with a `dist` output target,
+	* then `instance` will be `undefined` as `hostRef` won't have a `lazyInstance`
+	* property. In this case, the component will fail to render in one of the
+	* subsequent functions.
+	*
+	* For this scenario to work the user needs to set the `externalRuntime` flag
+	* for the `dist-custom-element` component that is being imported into the `dist`
+	* Stencil project.
+	*/
+	if (!instance) {
+		if (BUILD.isDev) throw new Error(`Can't render <${elm.tagName.toLowerCase()} /> - compiled without externalRuntime: true. See https://stenciljs.com/docs/custom-elements#externalruntime`);
+		return;
+	}
+	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$) {
+					hostRef.$queuedListeners$.map(([methodName, event]) => safeCall(instance, methodName, event, elm));
+					hostRef.$queuedListeners$ = void 0;
+				}
+			}
+			if (hostRef.$fetchedCbList$.length) hostRef.$fetchedCbList$.forEach((cb) => cb(elm));
+		}
+		if (BUILD.lifecycleDOMEvents) emitLifecycleEvent(elm, "componentWillLoad");
+		maybePromise = safeCall(instance, "componentWillLoad", void 0, elm);
+	} else {
+		if (BUILD.lifecycleDOMEvents) emitLifecycleEvent(elm, "componentWillUpdate");
+		maybePromise = safeCall(instance, "componentWillUpdate", void 0, elm);
+	}
+	if (BUILD.lifecycleDOMEvents) emitLifecycleEvent(elm, "componentWillRender");
+	maybePromise = enqueue(maybePromise, () => safeCall(instance, "componentWillRender", void 0, elm));
+	endSchedule();
+	return enqueue(maybePromise, () => updateComponent(hostRef, instance, isInitialLoad));
+};
+/**
+* This function uses a Promise to implement a simple first-in, first-out queue
+* of functions to be called.
+*
+* The queue is ordered on the basis of the first argument. If it's
+* `undefined`, then nothing is on the queue yet, so the provided function can
+* be called synchronously (although note that this function may return a
+* `Promise`). The idea is that then the return value of that enqueueing
+* operation is kept around, so that if it was a `Promise` then subsequent
+* functions can be enqueued by calling this function again with that `Promise`
+* as the first argument.
+*
+* @param maybePromise either a `Promise` which should resolve before the next function is called or an 'empty' sentinel
+* @param fn a function to enqueue
+* @returns either a `Promise` or the return value of the provided function
+*/
+const enqueue = (maybePromise, fn) => {
+	if (isPromisey(maybePromise)) return maybePromise.then(fn).catch((err) => {
+		console.error(err);
+		fn();
+	});
+	const result = fn();
+	return isPromisey(result) ? result : void 0;
+};
+/**
+* Check that a value is a `Promise`. To check, we first see if the value is an
+* instance of the `Promise` global. In a few circumstances, in particular if
+* the global has been overwritten, this is could be misleading, so we also do
+* a little 'duck typing' check to see if the `.then` property of the value is
+* defined and a function.
+*
+* @param maybePromise it might be a promise!
+* @returns whether it is or not
+*/
+const isPromisey = (maybePromise) => maybePromise instanceof Promise || maybePromise && maybePromise.then && typeof maybePromise.then === "function";
+/**
+* Update a component given reference to its host elements and so on.
+*
+* @param hostRef an object containing references to the element's host node,
+* VDom nodes, and other metadata
+* @param instance a reference to the underlying host element where it will be
+* rendered
+* @param isInitialLoad whether or not this function is being called as part of
+* the first render cycle
+* @returns a `Promise` if the update is asynchronous, otherwise `void`
+*/
+const updateComponent = (hostRef, instance, isInitialLoad) => {
+	const elm = hostRef.$hostElement$;
+	const endUpdate = createTime("update", hostRef.$cmpMeta$.$tagName$);
+	const rc = elm["s-rc"];
+	if (BUILD.style && isInitialLoad) attachStyles(hostRef);
+	const endRender = createTime("render", hostRef.$cmpMeta$.$tagName$);
+	if (BUILD.isDev) hostRef.$flags$ |= HOST_FLAGS.devOnRender;
+	if (BUILD.hydrateServerSide) return callRender(hostRef, instance, elm, isInitialLoad).then(() => {
+		afterRender(hostRef, elm, rc, isInitialLoad, endRender, endUpdate);
+	});
+	callRender(hostRef, instance, elm, isInitialLoad);
+	afterRender(hostRef, elm, rc, isInitialLoad, endRender, endUpdate);
+};
+const afterRender = (hostRef, elm, rc, isInitialLoad, endRender, endUpdate) => {
+	if (BUILD.isDev) {
+		hostRef.$renderCount$ = hostRef.$renderCount$ === void 0 ? 1 : hostRef.$renderCount$ + 1;
+		hostRef.$flags$ &= ~HOST_FLAGS.devOnRender;
+	}
+	if (BUILD.hydrateServerSide) try {
+		serverSideConnected(elm);
+		if (isInitialLoad) {
+			if (hostRef.$cmpMeta$.$flags$ & CMP_FLAGS.shadowDomEncapsulation) elm["s-en"] = "";
+			else if (hostRef.$cmpMeta$.$flags$ & CMP_FLAGS.scopedCssEncapsulation) elm["s-en"] = "c";
+		}
+	} catch (e) {
+		consoleError(e, elm);
+	}
+	if (BUILD.asyncLoading && rc) {
+		rc.map((cb) => cb());
+		elm["s-rc"] = void 0;
+	}
+	endRender();
+	endUpdate();
+	if (BUILD.asyncLoading) {
+		const childrenPromises = elm["s-p"] ?? [];
+		const postUpdate = () => postUpdateComponent(hostRef);
+		if (childrenPromises.length === 0) postUpdate();
+		else {
+			Promise.all(childrenPromises).then(postUpdate).catch(postUpdate);
+			hostRef.$flags$ |= HOST_FLAGS.isWaitingForChildren;
+			childrenPromises.length = 0;
+		}
+	} else postUpdateComponent(hostRef);
+};
+let renderingRef = null;
+/**
+* Handle making the call to the VDom renderer with the proper context given
+* various build variables
+*
+* @param hostRef an object containing references to the element's host node,
+* VDom nodes, and other metadata
+* @param instance a reference to the underlying host element where it will be
+* rendered
+* @param elm the Host element for the component
+* @param isInitialLoad whether or not this function is being called as part of
+* @returns an empty promise
+*/
+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;
+		/**
+		* minification optimization: `allRenderFn` is `true` if all components have a `render`
+		* 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 || 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;
+		}
+	} catch (e) {
+		consoleError(e, hostRef.$hostElement$);
+	}
+	renderingRef = null;
+	return null;
+};
+const getRenderingRef = () => renderingRef;
+const postUpdateComponent = (hostRef) => {
+	const tagName = hostRef.$cmpMeta$.$tagName$;
+	const elm = hostRef.$hostElement$;
+	const endPostUpdate = createTime("postUpdate", tagName);
+	const instance = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
+	const ancestorComponent = hostRef.$ancestorComponent$;
+	if (BUILD.isDev) hostRef.$flags$ |= HOST_FLAGS.devOnRender;
+	safeCall(instance, "componentDidRender", void 0, elm);
+	if (BUILD.isDev) hostRef.$flags$ &= ~HOST_FLAGS.devOnRender;
+	if (BUILD.lifecycleDOMEvents) emitLifecycleEvent(elm, "componentDidRender");
+	if (!(hostRef.$flags$ & HOST_FLAGS.hasLoadedComponent)) {
+		hostRef.$flags$ |= HOST_FLAGS.hasLoadedComponent;
+		if (BUILD.asyncLoading && BUILD.cssAnnotations) addHydratedFlag(elm);
+		if (BUILD.isDev) hostRef.$flags$ |= HOST_FLAGS.devOnDidLoad;
+		safeCall(instance, "componentDidLoad", void 0, elm);
+		if (BUILD.isDev) hostRef.$flags$ &= ~HOST_FLAGS.devOnDidLoad;
+		if (BUILD.lifecycleDOMEvents) emitLifecycleEvent(elm, "componentDidLoad");
+		if (BUILD.propChangeCallback) hostRef.$flags$ |= HOST_FLAGS.isWatchReady;
+		endPostUpdate();
+		if (BUILD.asyncLoading) {
+			hostRef.$onReadyResolve$(elm);
+			if (!ancestorComponent) appDidLoad(tagName);
+		}
+	} else {
+		if (BUILD.isDev) hostRef.$flags$ |= HOST_FLAGS.devOnRender;
+		safeCall(instance, "componentDidUpdate", void 0, elm);
+		if (BUILD.isDev) hostRef.$flags$ &= ~HOST_FLAGS.devOnRender;
+		if (BUILD.lifecycleDOMEvents) emitLifecycleEvent(elm, "componentDidUpdate");
+		endPostUpdate();
+	}
+	if (BUILD.method && BUILD.lazyLoad) hostRef.$onInstanceResolve$(elm);
+	if (BUILD.asyncLoading) {
+		if (hostRef.$onRenderResolve$) {
+			hostRef.$onRenderResolve$();
+			hostRef.$onRenderResolve$ = void 0;
+		}
+		if (hostRef.$flags$ & HOST_FLAGS.needsRerender) nextTick(() => scheduleUpdate(hostRef, false));
+		hostRef.$flags$ &= ~(HOST_FLAGS.isWaitingForChildren | HOST_FLAGS.needsRerender);
+	}
+};
+const forceUpdate = (ref) => {
+	if (BUILD.updatable && (Build.isBrowser || Build.isTesting)) {
+		const hostRef = getHostRef(ref);
+		const isConnected = hostRef?.$hostElement$?.isConnected;
+		if (isConnected && (hostRef.$flags$ & (HOST_FLAGS.hasRendered | HOST_FLAGS.isQueuedForUpdate)) === HOST_FLAGS.hasRendered) scheduleUpdate(hostRef, false);
+		return isConnected;
+	}
+	return false;
+};
+const appDidLoad = (who) => {
+	if (BUILD.asyncQueue) plt.$flags$ |= PLATFORM_FLAGS.appLoaded;
+	nextTick(() => emitEvent(win, "appload", { detail: { namespace: "app" } }));
+	if (BUILD.hydrateClientSide) {
+		if (plt.$orgLocNodes$?.size) plt.$orgLocNodes$.clear();
+	}
+	if (BUILD.profile && performance.measure) performance.measure(`[Stencil] app initial load (by ${who})`, "st:app:start");
+};
+/**
+* Allows to safely call a method, e.g. `componentDidLoad`, on an instance,
+* e.g. custom element node. If a build figures out that e.g. no component
+* has a `componentDidLoad` method, the instance method gets removed from the
+* output bundle and this function returns `undefined`.
+* @param instance any object that may or may not contain methods
+* @param method method name
+* @param arg single arbitrary argument
+* @param elm the element which made the call
+* @returns result of method call if it exists, otherwise `undefined`
+*/
+const safeCall = (instance, method, arg, elm) => {
+	if (instance && instance[method]) try {
+		return instance[method](arg);
+	} catch (e) {
+		consoleError(e, elm);
+	}
+};
+/**
+* For debugging purposes as `BUILD.lifecycleDOMEvents` is `false` by default and will
+* get removed by the compiler. Used for timing events to see how long they take.
+* @param elm the target of the Event
+* @param lifecycleName name of the event
+*/
+const emitLifecycleEvent = (elm, lifecycleName) => {
+	if (BUILD.lifecycleDOMEvents) emitEvent(elm, "stencil_" + lifecycleName, {
+		bubbles: true,
+		composed: true,
+		detail: { namespace: "app" }
+	});
+};
+/**
+* Set the hydrated flag on a DOM element
+*
+* @param elm a reference to a DOM element
+* @returns undefined
+*/
+const addHydratedFlag = (elm) => BUILD.hydratedClass ? elm.classList.add(BUILD.hydratedSelectorName ?? "hydrated") : BUILD.hydratedAttribute ? elm.setAttribute(BUILD.hydratedSelectorName ?? "hydrated", "") : void 0;
+const serverSideConnected = (elm) => {
+	const children = elm.children;
+	if (children != null) for (let i = 0, ii = children.length; i < ii; i++) {
+		const childElm = children[i];
+		if (typeof childElm.connectedCallback === "function") childElm.connectedCallback();
+		serverSideConnected(childElm);
+	}
+};
+//#endregion
+//#region src/runtime/signals.ts
+const STENCIL_SIGNALS_SYMBOL = Symbol.for("stencil.signals");
+/**
+* Duck-type check for Signal objects. Cross-bundle-safe (no instanceof).
+* @param v value to test
+* @returns whether `v` implements the SignalLike interface
+*/
+const isSignalLike = (v) => v !== null && typeof v === "object" && typeof v.peek === "function" && typeof v.subscribe === "function";
+/**
+* Create Signal.State instances for every @Prop/@State member, copy initial
+* values from $instanceValues$, and wire up:
+*  - a per-prop scheduling effect  → calls scheduleUpdate when value changes
+*  - per-prop watcher effects      → call @Watch callbacks with old/new value
+*
+* All dispose functions are collected into hostRef.$signalCleanup$() for
+* teardown on disconnect.
+* @param elm the host element
+* @param hostRef the component's host reference
+* @param cmpMeta the component's runtime metadata
+*/
+const initializeSignals = (elm, hostRef, cmpMeta) => {
+	if (hostRef.$signalValues$) return;
+	hostRef.$signalValues$ = /* @__PURE__ */ new Map();
+	const disposers = [];
+	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));
+		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;
+					}
+				}
+				if (!(hostRef.$flags$ & HOST_FLAGS.isQueuedForUpdate)) scheduleUpdate(hostRef, false);
+			}
+			prevScheduleVal = newVal;
+		}));
+		if (BUILD.propChangeCallback && cmpMeta.$watchers$?.[memberName]) {
+			const watchMethods = cmpMeta.$watchers$[memberName];
+			let prevWatchVal = sig.peek();
+			disposers.push(effect(() => {
+				const newVal = sig.value;
+				const flags = hostRef.$flags$;
+				watchMethods.forEach((watcher) => {
+					try {
+						const [[watchMethodName, watcherFlags]] = Object.entries(watcher);
+						if (flags & HOST_FLAGS.isWatchReady || watcherFlags & WATCH_FLAGS.Immediate) {
+							const inst = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
+							if (inst) inst[watchMethodName](newVal, prevWatchVal, memberName);
+						}
+					} catch (e) {
+						consoleError(e, elm);
+					}
+				});
+				prevWatchVal = newVal;
+			}));
+		}
+	}
+	const effectMethods = instance?.["__stencilEffects"] ?? [];
+	for (const methodName of effectMethods) disposers.push(effect(() => {
+		try {
+			instance[methodName]();
+		} catch (e) {
+			consoleError(e, elm);
+		}
+	}));
+	elm[STENCIL_SIGNALS_SYMBOL] = new Map([...hostRef.$signalValues$].filter(([k]) => (cmpMeta.$members$?.[k]?.[0] ?? 0) & MEMBER_FLAGS.Prop));
+	hostRef.$signalCleanup$ = () => {
+		disposers.forEach((d) => d());
+		elm[STENCIL_SIGNALS_SYMBOL] = void 0;
+	};
+};
+/**
+* Sets up `@Effect()` method subscriptions without full signal-backing.
+* Called when `vdomSignals` is active but `signalBacking` is not - allows
+* reactive effects that track external signals with no @Prop/@State overhead.
+* @param elm the host element
+* @param hostRef the component's host reference
+*/
+const initializeEffects = (elm, hostRef) => {
+	const instance = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
+	const effectMethods = instance?.["__stencilEffects"] ?? [];
+	if (!effectMethods.length) return;
+	const disposers = [];
+	for (const methodName of effectMethods) disposers.push(effect(() => {
+		try {
+			instance[methodName]();
+		} catch (e) {
+			consoleError(e, elm);
+		}
+	}));
+	hostRef.$signalCleanup$ = () => disposers.forEach((d) => d());
+};
+//#endregion
+//#region src/runtime/vdom/h.ts
+/**
+* Production h() function based on Preact by
+* Jason Miller (@developit)
+* Licensed under the MIT License
+* https://github.com/developit/preact/blob/master/LICENSE
+*
+* Modified for Stencil's compiler and vdom
+*/
+const h = (nodeName, vnodeData, ...children) => {
+	if (typeof nodeName === "string") nodeName = transformTag(nodeName);
+	let child = null;
+	let key = null;
+	let slotName = null;
+	let simple = false;
+	let lastSimple = false;
+	const vNodeChildren = [];
+	const walk = (c) => {
+		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;
+			}
+		}
+	};
+	walk(children);
+	if (vnodeData) {
+		if (BUILD.isDev && nodeName === "input") validateInputProperties(vnodeData);
+		if (BUILD.vdomKey && vnodeData.key) key = vnodeData.key;
+		if (BUILD.slotRelocation && vnodeData.name) slotName = vnodeData.name;
+		if (BUILD.vdomClass) {
+			const classData = vnodeData.class;
+			if (classData && !(BUILD.vdomSignals && isSignalLike(classData))) vnodeData.class = typeof classData !== "object" ? classData : Object.keys(classData).filter((k) => classData[k]).join(" ");
+		}
+	}
+	if (BUILD.isDev && vNodeChildren.some(isHost)) consoleDevError(`The <Host> must be the single root component. Make sure:
+- You are NOT using hostData() and <Host> in the same component.
+- <Host> is used once, and it's the single root component of the render() function.`);
+	if (BUILD.vdomFunctional && typeof nodeName === "function") return nodeName(vnodeData === null ? {} : vnodeData, vNodeChildren, vdomFnUtils);
+	const vnode = newVNode(nodeName, null);
+	vnode.$attrs$ = vnodeData;
+	if (vNodeChildren.length > 0) vnode.$children$ = vNodeChildren;
+	if (BUILD.vdomKey) vnode.$key$ = key;
+	if (BUILD.slotRelocation) vnode.$name$ = slotName;
+	return vnode;
+};
+/**
+* A utility function for creating a virtual DOM node from a tag and some
+* possible text content.
+*
+* @param tag the tag for this element
+* @param text possible text content for the node
+* @returns a newly-minted virtual DOM node
+*/
+const newVNode = (tag, text) => {
+	const vnode = {
+		$flags$: 0,
+		$tag$: tag,
+		$text$: text ?? null,
+		$elm$: null,
+		$children$: null
+	};
+	if (BUILD.vdomAttribute) vnode.$attrs$ = null;
+	if (BUILD.vdomKey) vnode.$key$ = null;
+	if (BUILD.slotRelocation) vnode.$name$ = null;
+	return vnode;
+};
+const Host = {};
+/**
+* Check whether a given node is a Host node or not
+*
+* @param node the virtual DOM node to check
+* @returns whether it's a Host node or not
+*/
+const isHost = (node) => node && node.$tag$ === Host;
+/**
+* Implementation of {@link d.FunctionalUtilities} for Stencil's VDom.
+*
+* Note that these functions convert from {@link d.VNode} to
+* {@link d.ChildNode} to give functional component developers a friendly
+* interface.
+*/
+const vdomFnUtils = {
+	forEach: (children, cb) => children.map(convertToPublic).forEach(cb),
+	map: (children, cb) => children.map(convertToPublic).map(cb).map(convertToPrivate)
+};
+/**
+* Convert a {@link d.VNode} to a {@link d.ChildNode} in order to present a
+* friendlier public interface (hence, 'convertToPublic').
+*
+* @param node the virtual DOM node to convert
+* @returns a converted child node
+*/
+const convertToPublic = (node) => ({
+	vattrs: node.$attrs$,
+	vchildren: node.$children$,
+	vkey: node.$key$,
+	vname: node.$name$,
+	vtag: node.$tag$,
+	vtext: node.$text$
+});
+/**
+* Convert a {@link d.ChildNode} back to an equivalent {@link d.VNode} in
+* order to use the resulting object in the virtual DOM. The initial object was
+* likely created as part of presenting a public API, so converting it back
+* involved making it 'private' again (hence, `convertToPrivate`).
+*
+* @param node the child node to convert
+* @returns a converted virtual DOM node
+*/
+const convertToPrivate = (node) => {
+	if (typeof node.vtag === "function") {
+		const vnodeData = { ...node.vattrs };
+		if (node.vkey) vnodeData.key = node.vkey;
+		if (node.vname) vnodeData.name = node.vname;
+		return h(node.vtag, vnodeData, ...node.vchildren || []);
+	}
+	const vnode = newVNode(node.vtag, node.vtext);
+	vnode.$attrs$ = node.vattrs;
+	vnode.$children$ = node.vchildren;
+	vnode.$key$ = node.vkey;
+	vnode.$name$ = node.vname;
+	return vnode;
+};
+/**
+* Validates the ordering of attributes on an input element
+*
+* @param inputElm the element to validate
+*/
+const validateInputProperties = (inputElm) => {
+	const props = Object.keys(inputElm);
+	const value = props.indexOf("value");
+	if (value === -1) return;
+	const typeIndex = props.indexOf("type");
+	const minIndex = props.indexOf("min");
+	const maxIndex = props.indexOf("max");
+	const stepIndex = props.indexOf("step");
+	if (value < typeIndex || value < minIndex || value < maxIndex || value < stepIndex) consoleDevWarn(`The "value" prop of <input> should be set after "min", "max", "type" and "step"`);
+};
+//#endregion
+//#region src/runtime/client-hydrate.ts
+/**
+* Takes an SSR rendered document, as annotated by 'vdom-annotations.ts' and:
+*
+* 1) Recreate an accurate VDOM which is fed to 'vdom-render.ts'. A failure to do so can cause hydration errors; extra renders, duplicated nodes
+* 2) Add shadowDOM trees to their respective #document-fragment
+* 3) Move forwarded, slotted nodes out of shadowDOMs
+* 4) Add meta nodes to non-shadow DOMs and their 'slotted' nodes
+*
+* @param hostElm The element to hydrate.
+* @param tagName The element's tag name.
+* @param hostId The host ID assigned to the element by the server. e.g. `s-id="1"`
+* @param hostRef The host reference for the element.
+*/
+const initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
+	const endHydrate = createTime("hydrateClient", tagName);
+	const shadowRoot = getShadowRoot(hostElm);
+	const childRenderNodes = [];
+	const slotNodes = [];
+	const slottedNodes = [];
+	const shadowRootNodes = BUILD.shadowDom && shadowRoot ? [] : null;
+	const vnode = newVNode(tagName, null);
+	vnode.$elm$ = hostElm;
+	let scopeId;
+	if (BUILD.scoped) {
+		const cmpMeta = hostRef.$cmpMeta$;
+		if (cmpMeta && cmpMeta.$flags$ & CMP_FLAGS.needsScopedEncapsulation && hostElm["s-sc"]) {
+			scopeId = hostElm["s-sc"];
+			hostElm.classList.add(scopeId + "-h");
+		} else if (hostElm["s-sc"]) delete hostElm["s-sc"];
+	}
+	if (win.document && (!plt.$orgLocNodes$ || !plt.$orgLocNodes$.size)) initializeDocumentHydrate(win.document.body, plt.$orgLocNodes$ = /* @__PURE__ */ new Map());
+	hostElm[HYDRATE_ID] = hostId;
+	hostElm.removeAttribute(HYDRATE_ID);
+	hostRef.$vnode$ = clientHydrate(vnode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, hostElm, hostId, slottedNodes);
+	let crIndex = 0;
+	const crLength = childRenderNodes.length;
+	let childRenderNode;
+	for (; crIndex < crLength; crIndex++) {
+		childRenderNode = childRenderNodes[crIndex];
+		const orgLocationId = childRenderNode.$hostId$ + "." + childRenderNode.$nodeId$;
+		const orgLocationNode = plt.$orgLocNodes$.get(orgLocationId);
+		const node = childRenderNode.$elm$;
+		if (!shadowRoot) {
+			node["s-hn"] = transformTag(tagName).toUpperCase();
+			if (childRenderNode.$tag$ === "slot") node["s-cr"] = hostElm["s-cr"];
+		} else if (childRenderNode.$tag$?.toString().includes("-") && childRenderNode.$tag$ !== "slot-fb" && !childRenderNode.$elm$.shadowRoot) {
+			const cmpMeta = getHostRef(childRenderNode.$elm$);
+			if (cmpMeta) {
+				const childScopeId = getScopeId(cmpMeta.$cmpMeta$, BUILD.mode ? childRenderNode.$elm$.getAttribute("s-mode") : void 0);
+				const styleSheet = win.document.querySelector(`style[sty-id="${childScopeId}"]`);
+				if (styleSheet) shadowRootNodes.unshift(styleSheet.cloneNode(true));
+			}
+		}
+		if (childRenderNode.$tag$ === "slot") {
+			childRenderNode.$name$ = childRenderNode.$elm$["s-sn"] || childRenderNode.$elm$["name"] || null;
+			if (childRenderNode.$children$) {
+				childRenderNode.$flags$ |= VNODE_FLAGS.isSlotFallback;
+				if (!childRenderNode.$elm$.childNodes.length) childRenderNode.$children$.forEach((c) => {
+					childRenderNode.$elm$.appendChild(c.$elm$);
+				});
+			} else childRenderNode.$flags$ |= VNODE_FLAGS.isSlotReference;
+		}
+		if (orgLocationNode && orgLocationNode.isConnected) {
+			const orgParentNode = orgLocationNode.parentNode;
+			if (orgLocationNode.parentElement.shadowRoot && orgLocationNode["s-en"] === "") orgParentNode.insertBefore(node, orgLocationNode.nextSibling);
+			orgParentNode.removeChild(orgLocationNode);
+			if (!shadowRoot) node["s-oo"] = parseInt(childRenderNode.$nodeId$);
+		}
+		if (orgLocationNode && !orgLocationNode["s-id"]) plt.$orgLocNodes$.delete(orgLocationId);
+	}
+	const hosts = [];
+	const snLen = slottedNodes.length;
+	let snIndex = 0;
+	let slotGroup;
+	let snGroupIdx;
+	let snGroupLen;
+	let slottedItem;
+	let currentPos = 0;
+	for (; snIndex < snLen; snIndex++) {
+		slotGroup = slottedNodes[snIndex];
+		if (!slotGroup || !slotGroup.length) continue;
+		snGroupLen = slotGroup.length;
+		snGroupIdx = 0;
+		for (; snGroupIdx < snGroupLen; snGroupIdx++) {
+			slottedItem = slotGroup[snGroupIdx];
+			const hid = slottedItem.hostId;
+			if (!hosts[hid]) hosts[hid] = plt.$orgLocNodes$.get(slottedItem.hostId);
+			if (!hosts[hid]) continue;
+			const hostEle = hosts[hid];
+			const siNode = slottedItem.node;
+			const siSlot = slottedItem.slot;
+			if (hostEle.shadowRoot && siNode.parentElement !== hostEle) hostEle.insertBefore(siNode, slotGroup[snGroupIdx - 1]?.node?.nextSibling);
+			if (!hostEle.shadowRoot || !shadowRoot) {
+				if (!siSlot["s-cr"]) {
+					siSlot["s-cr"] = hostEle["s-cr"];
+					if (!siSlot["s-cr"] && hostEle.shadowRoot) siSlot["s-cr"] = hostEle;
+					else siSlot["s-cr"] = (hostEle.__childNodes || hostEle.childNodes)[0];
+				}
+				addSlotRelocateNode(siNode, siSlot, false, siNode["s-oo"] || currentPos);
+				if (siNode.parentElement?.shadowRoot && siNode["getAttribute"] && siNode.getAttribute("slot")) siNode.removeAttribute("slot");
+				if (BUILD.lightDomPatches || BUILD.slotChildNodes || BUILD.patchAll && hostRef.$cmpMeta$.$flags$ & CMP_FLAGS.patchAll) patchSlottedNode(siNode);
+			}
+			currentPos = (siNode["s-oo"] || currentPos) + 1;
+		}
+	}
+	if (BUILD.scoped && scopeId && slotNodes.length) slotNodes.forEach((slot) => {
+		slot.$elm$.parentElement.classList.add(scopeId + "-s");
+	});
+	if (BUILD.shadowDom && shadowRoot && !shadowRoot.childNodes.length) {
+		let rnIdex = 0;
+		const rnLen = shadowRootNodes.length;
+		if (rnLen) {
+			for (; rnIdex < rnLen; rnIdex++) {
+				const node = shadowRootNodes[rnIdex];
+				/**
+				* in apps with a lot of components the `shadowRootNodes` array can be modified while iterating over it
+				* so we need to check if the node is still in the array before appending it to avoid any errors like:
+				*
+				*   TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'
+				*/
+				if (node) shadowRoot.appendChild(node);
+			}
+			Array.from(hostElm.childNodes).forEach((node) => {
+				if (typeof node["s-en"] !== "string" && typeof node["s-sn"] !== "string") {
+					if (node.nodeType === NODE_TYPE.ElementNode && node.slot && node.hidden) node.removeAttribute("hidden");
+					else if (node.nodeType === NODE_TYPE.CommentNode && !node.nodeValue) node.parentNode.removeChild(node);
+				}
+			});
+		}
+	}
+	hostRef.$hostElement$ = hostElm;
+	endHydrate();
+};
+/**
+* Recursively constructs the virtual node tree for a host element and its children.
+* The tree is constructed by parsing the annotations set on the nodes by the server (`vdom-annotations.ts`).
+*
+* In addition to constructing the VNode tree, we also track information about the node's descendants:
+* - which are slots
+* - which should exist in the shadow root
+* - which are nodes that should be rendered as children of the parent node
+*
+* @param parentVNode The vNode representing the parent node.
+* @param childRenderNodes An array of all child nodes in the parent's node tree.
+* @param slotNodes An array of all slot nodes in the parent's node tree.
+* @param shadowRootNodes An array of nodes that should be rendered in the shadowDOM of the parent.
+* @param hostElm The parent element.
+* @param node The node to construct the vNode tree for.
+* @param hostId The host ID assigned to the element by the server.
+* @param slottedNodes - nodes that have been slotted
+* @returns - the constructed VNode
+*/
+const clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node, hostId, slottedNodes = []) => {
+	let childNodeType;
+	let childIdSplt;
+	let childVNode;
+	let i;
+	const scopeId = hostElm["s-sc"];
+	if (node.nodeType === NODE_TYPE.ElementNode) {
+		childNodeType = node.getAttribute(HYDRATE_CHILD_ID);
+		if (childNodeType) {
+			childIdSplt = childNodeType.split(".");
+			if (childIdSplt[0] === hostId || childIdSplt[0] === "0") {
+				childVNode = createSimpleVNode({
+					$hostId$: childIdSplt[0],
+					$nodeId$: childIdSplt[1],
+					$depth$: childIdSplt[2],
+					$index$: childIdSplt[3],
+					$tag$: node.tagName.toLowerCase(),
+					$elm$: node,
+					$attrs$: { class: node.className || "" }
+				});
+				childRenderNodes.push(childVNode);
+				node.removeAttribute(HYDRATE_CHILD_ID);
+				if (!parentVNode.$children$) parentVNode.$children$ = [];
+				if (BUILD.scoped && scopeId && childIdSplt[0] === hostId) {
+					node["s-si"] = scopeId;
+					childVNode.$attrs$.class += " " + scopeId;
+				}
+				const slotName = childVNode.$elm$.getAttribute("s-sn");
+				if (typeof slotName === "string") {
+					if (childVNode.$tag$ === "slot-fb") {
+						addSlot(slotName, childIdSplt[2], childVNode, node, parentVNode, childRenderNodes, slotNodes, shadowRootNodes, slottedNodes);
+						if (BUILD.scoped && scopeId) node.classList.add(scopeId);
+					}
+					childVNode.$elm$["s-sn"] = slotName;
+					childVNode.$elm$.removeAttribute("s-sn");
+				}
+				if (childVNode.$index$ !== void 0) parentVNode.$children$[childVNode.$index$] = childVNode;
+				parentVNode = childVNode;
+				if (shadowRootNodes && childVNode.$depth$ === "0") shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
+			}
+		}
+		if (node.shadowRoot) for (i = node.shadowRoot.childNodes.length - 1; i >= 0; i--) clientHydrate(parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node.shadowRoot.childNodes[i], hostId, slottedNodes);
+		const nonShadowNodes = node.__childNodes || node.childNodes;
+		for (i = nonShadowNodes.length - 1; i >= 0; i--) clientHydrate(parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, nonShadowNodes[i], hostId, slottedNodes);
+	} else if (node.nodeType === NODE_TYPE.CommentNode) {
+		childIdSplt = node.nodeValue.split(".");
+		if (childIdSplt[1] === hostId || childIdSplt[1] === "0") {
+			childNodeType = childIdSplt[0];
+			childVNode = createSimpleVNode({
+				$hostId$: childIdSplt[1],
+				$nodeId$: childIdSplt[2],
+				$depth$: childIdSplt[3],
+				$index$: childIdSplt[4] || "0",
+				$elm$: node
+			});
+			if (childNodeType === "t") {
+				childVNode.$elm$ = findCorrespondingNode(node, NODE_TYPE.TextNode);
+				if (childVNode.$elm$ && childVNode.$elm$.nodeType === NODE_TYPE.TextNode) {
+					childVNode.$text$ = childVNode.$elm$.textContent;
+					childRenderNodes.push(childVNode);
+					node.remove();
+					if (hostId === childVNode.$hostId$) {
+						if (!parentVNode.$children$) parentVNode.$children$ = [];
+						parentVNode.$children$[childVNode.$index$] = childVNode;
+					}
+					if (shadowRootNodes && childVNode.$depth$ === "0") shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
+				}
+			} else if (childNodeType === "c") {
+				childVNode.$elm$ = findCorrespondingNode(node, NODE_TYPE.CommentNode);
+				if (childVNode.$elm$ && childVNode.$elm$.nodeType === NODE_TYPE.CommentNode) {
+					childRenderNodes.push(childVNode);
+					node.remove();
+				}
+			} else if (childVNode.$hostId$ === hostId) {
+				if (childNodeType === "s") addSlot(node["s-sn"] = childIdSplt[5] || "", childIdSplt[2], childVNode, node, parentVNode, childRenderNodes, slotNodes, shadowRootNodes, slottedNodes);
+				else if (childNodeType === "r") {
+					if (BUILD.shadowDom && shadowRootNodes) node.remove();
+					else if (BUILD.slotRelocation) {
+						hostElm["s-cr"] = node;
+						node["s-cn"] = true;
+					}
+				}
+			}
+		}
+	} else if (parentVNode && parentVNode.$tag$ === "style") {
+		const vnode = newVNode(null, node.textContent);
+		vnode.$elm$ = node;
+		vnode.$index$ = "0";
+		parentVNode.$children$ = [vnode];
+	}
+	return parentVNode;
+};
+/**
+* Recursively locate any comments representing an 'original location' for a node; in a node's children or shadowRoot children.
+* Creates a map of component IDs and 'original location' ID's which are derived from comment nodes placed by 'vdom-annotations.ts'.
+* Each 'original location' relates to a lightDOM node that was moved deeper into the SSR markup. e.g. `<!--o.1-->` maps to `<div c-id="0.1">`
+*
+* @param node The node to search.
+* @param orgLocNodes A map of the original location annotations and the current node being searched.
+*/
+const initializeDocumentHydrate = (node, orgLocNodes) => {
+	if (node.nodeType === NODE_TYPE.ElementNode) {
+		const componentId = node["s-id"] || node.getAttribute("s-id");
+		if (componentId) orgLocNodes.set(componentId, node);
+		let i = 0;
+		if (node.shadowRoot) for (; i < node.shadowRoot.childNodes.length; i++) initializeDocumentHydrate(node.shadowRoot.childNodes[i], orgLocNodes);
+		const nonShadowNodes = node.__childNodes || node.childNodes;
+		for (i = 0; i < nonShadowNodes.length; i++) initializeDocumentHydrate(nonShadowNodes[i], orgLocNodes);
+	} else if (node.nodeType === NODE_TYPE.CommentNode) {
+		const childIdSplt = node.nodeValue.split(".");
+		if (childIdSplt[0] === "o") {
+			orgLocNodes.set(childIdSplt[1] + "." + childIdSplt[2], node);
+			node.nodeValue = "";
+			node["s-en"] = childIdSplt[3];
+		}
+	}
+};
+/**
+* Creates a VNode to add to a hydrated component VDOM
+*
+* @param vnode - a vnode partial which will be augmented
+* @returns an complete vnode
+*/
+const createSimpleVNode = (vnode) => ({
+	$flags$: 0,
+	$index$: "0",
+	...vnode
+});
+function addSlot(slotName, slotId, childVNode, node, parentVNode, childRenderNodes, slotNodes, shadowRootNodes, slottedNodes) {
+	node["s-sr"] = true;
+	childVNode.$name$ = slotName || null;
+	childVNode.$tag$ = "slot";
+	const parentNodeId = parentVNode?.$elm$ ? parentVNode.$elm$["s-id"] || parentVNode.$elm$.getAttribute("s-id") : "";
+	if (BUILD.shadowDom && shadowRootNodes && win.document) {
+		const slot = childVNode.$elm$ = win.document.createElement(childVNode.$tag$);
+		if (childVNode.$name$) childVNode.$elm$.setAttribute("name", slotName);
+		if (parentVNode.$elm$.shadowRoot && parentNodeId && parentNodeId !== childVNode.$hostId$) internalCall(parentVNode.$elm$, "insertBefore")(slot, internalCall(parentVNode.$elm$, "children")[0]);
+		else internalCall(internalCall(node, "parentNode"), "insertBefore")(slot, node);
+		addSlottedNodes(slottedNodes, slotId, slotName, node, childVNode.$hostId$);
+		node.remove();
+		if (childVNode.$depth$ === "0") shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
+	} else {
+		const slot = childVNode.$elm$;
+		const shouldMove = parentNodeId && parentNodeId !== childVNode.$hostId$ && parentVNode.$elm$.shadowRoot;
+		addSlottedNodes(slottedNodes, slotId, slotName, node, shouldMove ? parentNodeId : childVNode.$hostId$);
+		patchSlotNode(node);
+		if (shouldMove) parentVNode.$elm$.insertBefore(slot, parentVNode.$elm$.children[0]);
+	}
+	childRenderNodes.push(childVNode);
+	slotNodes.push(childVNode);
+	if (!parentVNode.$children$) parentVNode.$children$ = [];
+	parentVNode.$children$[childVNode.$index$] = childVNode;
+}
+/**
+* Adds groups of slotted nodes (grouped by slot ID) to this host element's 'master' array.
+* We'll use this after the host element's VDOM is completely constructed to finally position and add meta required by non-shadow slotted nodes
+*
+* @param slottedNodes - the main host element 'master' array to add to
+* @param slotNodeId - the slot node unique ID
+* @param slotName - the slot node name (can be '')
+* @param slotNode - the slot node
+* @param hostId - the host element id where this node should be slotted
+*/
+const addSlottedNodes = (slottedNodes, slotNodeId, slotName, slotNode, hostId) => {
+	let slottedNode = slotNode.nextSibling;
+	const group = slottedNodes[slotNodeId] ||= [];
+	if (!slottedNode || slottedNode.nodeValue?.startsWith("s.")) return;
+	do {
+		const sa = slottedNode["getAttribute"] && slottedNode.getAttribute("slot");
+		if ((sa || slottedNode["s-sn"]) === slotName || slotName === "" && !slottedNode["s-sn"] && !sa && (slottedNode.nodeType === NODE_TYPE.CommentNode || slottedNode.nodeType === NODE_TYPE.TextNode)) {
+			slottedNode["s-sn"] = slotName;
+			group.push({
+				slot: slotNode,
+				node: slottedNode,
+				hostId
+			});
+		}
+		slottedNode = slottedNode.nextSibling;
+	} while (slottedNode && !slottedNode.nodeValue?.startsWith("s."));
+};
+/**
+* Steps through the node's siblings to find the next node of a specific type, with a value.
+* e.g. when we find a position comment `<!--t.1-->`, we need to find the next text node with a value.
+* (it's a guard against whitespace which is never accounted for in the SSR output)
+* @param node - the starting node
+* @param type - the type of node to find
+* @returns the first corresponding node of the type
+*/
+const findCorrespondingNode = (node, type) => {
+	let sibling = node;
+	do
+		sibling = sibling.nextSibling;
+	while (sibling && (sibling.nodeType !== type || !sibling.nodeValue));
+	return sibling;
+};
+//#endregion
+//#region src/utils/regular-expression.ts
+/**
+* Utility function that will escape all regular expression special characters in a string.
+*
+* @param text The string potentially containing special characters.
+* @returns The string with all special characters escaped.
+*/
+const escapeRegExpSpecialCharacters = (text) => {
+	return text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+};
+//#endregion
+//#region src/utils/shadow-css.ts
+/**
+* @license
+* Copyright Google Inc. All Rights Reserved.
+*
+* Use of this source code is governed by an MIT-style license that can be
+* found in the LICENSE file at https://angular.io/license
+*
+* This file is a port of shadowCSS from `webcomponents.js` to TypeScript.
+* https://github.com/webcomponents/webcomponentsjs/blob/4efecd7e0e/src/ShadowCSS/ShadowCSS.js
+* https://github.com/angular/angular/blob/master/packages/compiler/src/shadow_css.ts
+*/
+const safeSelector = (selector) => {
+	const placeholders = [];
+	let index = 0;
+	selector = selector.replace(/(\[\s*part~=\s*("[^"]*"|'[^']*')\s*\])/g, (_, keep) => {
+		const replaceBy = `__part-${index}__`;
+		placeholders.push(keep);
+		index++;
+		return replaceBy;
+	});
+	selector = selector.replace(/(\[[^\]]*\])/g, (_, keep) => {
+		const replaceBy = `__ph-${index}__`;
+		placeholders.push(keep);
+		index++;
+		return replaceBy;
+	});
+	return {
+		content: selector.replace(/(:nth-[-\w]+)(\([^)]+\))/g, (_, pseudo, exp) => {
+			const replaceBy = `__ph-${index}__`;
+			placeholders.push(exp);
+			index++;
+			return pseudo + replaceBy;
+		}),
+		placeholders
+	};
+};
+const restoreSafeSelector = (placeholders, content) => {
+	content = content.replace(/__part-(\d+)__/g, (_, index) => placeholders[+index]);
+	return content.replace(/__ph-(\d+)__/g, (_, index) => placeholders[+index]);
+};
+const _polyfillHost = "-shadowcsshost";
+const _polyfillSlotted = "-shadowcssslotted";
+const _polyfillHostContext = "-shadowcsscontext";
+let _cssColonHostRe;
+let _cssColonHostContextRe;
+let _cssColonSlottedRe;
+const getCssColonHostRe = () => _cssColonHostRe ??= /* @__PURE__ */ new RegExp("(-shadowcsshost)(?:\\(((?:\\([^)(]*\\)|[^)(]*)+?)\\))?([^,{]*)", "gim");
+const getCssColonHostContextRe = () => _cssColonHostContextRe ??= /* @__PURE__ */ new RegExp("(-shadowcsscontext)(?:\\(((?:\\([^)(]*\\)|[^)(]*)+?)\\))?([^,{]*)", "gim");
+const getCssColonSlottedRe = () => _cssColonSlottedRe ??= /* @__PURE__ */ new RegExp("(-shadowcssslotted)(?:\\(((?:\\([^)(]*\\)|[^)(]*)+?)\\))?([^,{]*)", "gim");
+const _polyfillHostNoCombinator = "-shadowcsshost-no-combinator";
+const _polyfillHostNoCombinatorRe = /-shadowcsshost-no-combinator([^\s]*)/;
+const _shadowDOMSelectorsRe = [/::shadow/g, /::content/g];
+const _safePartRe = /__part-(\d+)__/g;
+const _polyfillHostRe = /-shadowcsshost/gim;
+/**
+* Little helper for generating a regex that will match a specified
+* CSS selector when that selector is _not_ a part of a `@supports` rule.
+*
+* The pattern will match the provided `selector` (i.e. ':host', ':host-context', etc.)
+* when that selector is not a part of a `@supports` selector rule _or_ if the selector
+* is a part of the rule's declaration.
+*
+* For instance, if we create the regex with the selector ':host-context':
+* - '@supports selector(:host-context())' will return no matches (starts with '@supports')
+* - '@supports selector(:host-context()) { :host-context() { ... }}' will match the second ':host-context' (part of declaration)
+* - ':host-context() { ... }' will match ':host-context' (selector is not a '@supports' rule)
+* - ':host() { ... }' will return no matches (selector doesn't match selector used to create regex)
+*
+* @param selector The CSS selector we want to match for replacement
+* @returns A look-behind regex containing the selector
+*/
+const createSupportsRuleRe = (selector) => {
+	const escapedSelector = escapeRegExpSpecialCharacters(selector);
+	return new RegExp(`(^|[^@]|@(?!supports\\s+selector\\s*\\([^{]*?${escapedSelector}))(${escapedSelector}\\b)`, "g");
+};
+const _commentRe = /\/\*\s*[\s\S]*?\*\//g;
+const stripComments = (input) => {
+	return input.replace(_commentRe, "");
+};
+const _commentWithHashRe = /\/\*\s*#\s*source(Mapping)?URL=[\s\S]+?\*\//g;
+const extractCommentsWithHash = (input) => {
+	return input.match(_commentWithHashRe) || [];
+};
+const _ruleRe = /(\s*)([^;{}]+?)(\s*)((?:{%BLOCK%}?\s*;?)|(?:\s*;))/g;
+const _curlyRe = /([{}])/g;
+const _selectorPartsRe = /(^.*?[^\\])??((:+)(.*)|$)/;
+const OPEN_CURLY = "{";
+const CLOSE_CURLY = "}";
+const BLOCK_PLACEHOLDER = "%BLOCK%";
+const processRules = (input, ruleCallback) => {
+	const inputWithEscapedBlocks = escapeBlocks(input);
+	let nextBlockIndex = 0;
+	return inputWithEscapedBlocks.escapedString.replace(_ruleRe, (...m) => {
+		const selector = m[2];
+		let content = "";
+		let suffix = m[4];
+		let contentPrefix = "";
+		if (suffix && suffix.startsWith("{%BLOCK%")) {
+			content = inputWithEscapedBlocks.blocks[nextBlockIndex++];
+			suffix = suffix.substring(8);
+			contentPrefix = "{";
+		}
+		const rule = ruleCallback({
+			selector,
+			content
+		});
+		return `${m[1]}${rule.selector}${m[3]}${contentPrefix}${rule.content}${suffix}`;
+	});
+};
+const escapeBlocks = (input) => {
+	const inputParts = input.split(_curlyRe);
+	const resultParts = [];
+	const escapedBlocks = [];
+	let bracketCount = 0;
+	let currentBlockParts = [];
+	for (let partIndex = 0; partIndex < inputParts.length; partIndex++) {
+		const part = inputParts[partIndex];
+		if (part === CLOSE_CURLY) bracketCount--;
+		if (bracketCount > 0) currentBlockParts.push(part);
+		else {
+			if (currentBlockParts.length > 0) {
+				escapedBlocks.push(currentBlockParts.join(""));
+				resultParts.push(BLOCK_PLACEHOLDER);
+				currentBlockParts = [];
+			}
+			resultParts.push(part);
+		}
+		if (part === OPEN_CURLY) bracketCount++;
+	}
+	if (currentBlockParts.length > 0) {
+		escapedBlocks.push(currentBlockParts.join(""));
+		resultParts.push(BLOCK_PLACEHOLDER);
+	}
+	return {
+		escapedString: resultParts.join(""),
+		blocks: escapedBlocks
+	};
+};
+/**
+* Replaces certain strings within the CSS with placeholders
+* that will later be replaced with class selectors appropriate
+* for the level of encapsulation (shadow or scoped).
+*
+* When performing these replacements, we want to ignore selectors that are a
+* part of an `@supports` rule. Replacing these selectors will result in invalid
+* CSS that gets passed to autoprefixer/postcss once the placeholders are replaced.
+* For example, a rule like:
+*
+* ```css
+* @supports selector(:host()) {
+*   :host {
+*     color: red;
+*   }
+* }
+* ```
+*
+* Should be converted to:
+*
+* ```css
+* @supports selector(:host()) {
+*   -shadowcsshost {
+*     color: red;
+*   }
+* }
+* ```
+*
+* The order the regex replacements happen in matters since we match
+* against a whole selector word so we need to match all of `:host-context`
+* before we try to replace `:host`. Otherwise the pattern for `:host` would match
+* `:host-context` resulting in something like `:-shadowcsshost-context`.
+*
+* @param cssText A CSS string for a component
+* @returns The modified CSS string
+*/
+const insertPolyfillHostInCssText = (cssText) => {
+	const supportsBlocks = [];
+	cssText = cssText.replace(/@supports\s+selector\s*\(\s*([^)]*)\s*\)/g, (_, selectorContent) => {
+		const placeholder = `__supports_${supportsBlocks.length}__`;
+		supportsBlocks.push(selectorContent);
+		return `@supports selector(${placeholder})`;
+	});
+	const _colonSlottedRe = createSupportsRuleRe("::slotted");
+	const _colonHostRe = createSupportsRuleRe(":host");
+	const _colonHostContextRe = createSupportsRuleRe(":host-context");
+	cssText = cssText.replace(_colonHostContextRe, `$1${_polyfillHostContext}`).replace(_colonHostRe, `$1${_polyfillHost}`).replace(_colonSlottedRe, `$1${_polyfillSlotted}`);
+	supportsBlocks.forEach((originalSelector, index) => {
+		cssText = cssText.replace(`__supports_${index}__`, originalSelector);
+	});
+	return cssText;
+};
+const convertColonRule = (cssText, regExp, partReplacer) => {
+	return cssText.replace(regExp, (...m) => {
+		if (m[2]) {
+			const parts = m[2].split(",");
+			const r = [];
+			for (let i = 0; i < parts.length; i++) {
+				const p = parts[i].trim();
+				if (!p) break;
+				r.push(partReplacer(_polyfillHostNoCombinator, p, m[3]));
+			}
+			return r.join(",");
+		} else return _polyfillHostNoCombinator + m[3];
+	});
+};
+const colonHostPartReplacer = (host, part, suffix) => {
+	return host + part.replace(_polyfillHost, "") + suffix;
+};
+const convertColonHost = (cssText) => {
+	return convertColonRule(cssText, getCssColonHostRe(), colonHostPartReplacer);
+};
+const colonHostContextPartReplacer = (host, part, suffix) => {
+	if (part.indexOf(_polyfillHost) > -1) return colonHostPartReplacer(host, part, suffix);
+	else return host + part + suffix + ", " + part + " " + host + suffix;
+};
+const convertColonSlotted = (cssText, slotScopeId) => {
+	const slotClass = "." + slotScopeId + " > ";
+	const selectors = [];
+	cssText = cssText.replace(getCssColonSlottedRe(), (...m) => {
+		if (m[2]) {
+			const compound = m[2].trim();
+			const suffix = m[3];
+			const slottedSelector = slotClass + compound + suffix;
+			let prefixSelector = "";
+			for (let i = m[4] - 1; i >= 0; i--) {
+				const char = m[5][i];
+				if (char === "}" || char === ",") break;
+				prefixSelector = char + prefixSelector;
+			}
+			const orgSelector = (prefixSelector + slottedSelector).trim();
+			const addedSelector = `${prefixSelector.trimEnd()}${slottedSelector.trim()}`.trim();
+			if (orgSelector !== addedSelector) {
+				const updatedSelector = `${addedSelector}, ${orgSelector}`;
+				selectors.push({
+					orgSelector,
+					updatedSelector
+				});
+			}
+			return slottedSelector;
+		} else return _polyfillHostNoCombinator + m[3];
+	});
+	return {
+		selectors,
+		cssText
+	};
+};
+const convertColonHostContext = (cssText) => {
+	return convertColonRule(cssText, getCssColonHostContextRe(), colonHostContextPartReplacer);
+};
+const convertShadowDOMSelectors = (cssText) => {
+	return _shadowDOMSelectorsRe.reduce((result, pattern) => result.replace(pattern, " "), cssText);
+};
+const makeScopeMatcher = (scopeSelector) => {
+	scopeSelector = scopeSelector.replace(/\[/g, "\\[").replace(/\]/g, "\\]");
+	return new RegExp("^(" + scopeSelector + ")([>\\s~+[.,{:][\\s\\S]*)?$", "m");
+};
+const selectorNeedsScoping = (selector, scopeSelector) => {
+	return !makeScopeMatcher(scopeSelector).test(selector);
+};
+const injectScopingSelector = (selector, scopingSelector) => {
+	return selector.replace(_selectorPartsRe, (_, before = "", _colonGroup, colon = "", after = "") => {
+		return before + scopingSelector + colon + after;
+	});
+};
+const applySimpleSelectorScope = (selector, scopeSelector, hostSelector) => {
+	_polyfillHostRe.lastIndex = 0;
+	if (_polyfillHostRe.test(selector)) {
+		const replaceBy = `.${hostSelector}`;
+		return selector.replace(_polyfillHostNoCombinatorRe, (_, sel) => injectScopingSelector(sel, replaceBy)).replace(_polyfillHostRe, replaceBy + " ");
+	}
+	return scopeSelector + " " + selector;
+};
+const applyStrictSelectorScope = (selector, scopeSelector, hostSelector) => {
+	scopeSelector = scopeSelector.replace(/\[is=([^\]]*)\]/g, (_, ...parts) => parts[0]);
+	const className = "." + scopeSelector;
+	const _scopeSelectorPart = (p) => {
+		let scopedP = p.trim();
+		if (!scopedP) return "";
+		if (p.indexOf(_polyfillHostNoCombinator) > -1) scopedP = applySimpleSelectorScope(p, scopeSelector, hostSelector);
+		else {
+			const t = p.replace(_polyfillHostRe, "");
+			if (t.length > 0) scopedP = injectScopingSelector(t, className);
+		}
+		return scopedP;
+	};
+	const safeContent = safeSelector(selector);
+	selector = safeContent.content;
+	let scopedSelector = "";
+	let startIndex = 0;
+	let res;
+	const sep = /( |>|\+|~(?!=))(?=(?:[^()]*\([^()]*\))*[^()]*$)\s*/g;
+	let shouldScope = !(selector.indexOf(_polyfillHostNoCombinator) > -1);
+	while ((res = sep.exec(selector)) !== null) {
+		const separator = res[1];
+		const part = selector.slice(startIndex, res.index).trim();
+		shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1;
+		const scopedPart = shouldScope ? _scopeSelectorPart(part) : part;
+		scopedSelector += `${scopedPart} ${separator} `;
+		startIndex = sep.lastIndex;
+	}
+	const part = selector.substring(startIndex);
+	shouldScope = !part.match(_safePartRe) && (shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1);
+	scopedSelector += shouldScope ? _scopeSelectorPart(part) : part;
+	return restoreSafeSelector(safeContent.placeholders, scopedSelector);
+};
+const scopeSelector = (selector, scopeSelectorText, hostSelector, slotSelector) => {
+	return selector.split(",").map((shallowPart) => {
+		if (slotSelector && shallowPart.indexOf("." + slotSelector) > -1) return shallowPart.trim();
+		if (selectorNeedsScoping(shallowPart, scopeSelectorText)) return applyStrictSelectorScope(shallowPart, scopeSelectorText, hostSelector).trim();
+		else return shallowPart.trim();
+	}).join(", ");
+};
+const scopeSelectors = (cssText, scopeSelectorText, hostSelector, slotSelector, commentOriginalSelector) => {
+	return processRules(cssText, (rule) => {
+		let selector = rule.selector;
+		let content = rule.content;
+		if (rule.selector[0] !== "@") selector = scopeSelector(rule.selector, scopeSelectorText, hostSelector, slotSelector);
+		else if (rule.selector.startsWith("@media") || rule.selector.startsWith("@supports") || rule.selector.startsWith("@page") || rule.selector.startsWith("@document")) content = scopeSelectors(rule.content, scopeSelectorText, hostSelector, slotSelector, commentOriginalSelector);
+		return {
+			selector: selector.replace(/\s{2,}/g, " ").trim(),
+			content
+		};
+	});
+};
+const scopeCssText = (cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector) => {
+	cssText = insertPolyfillHostInCssText(cssText);
+	cssText = convertColonHost(cssText);
+	cssText = convertColonHostContext(cssText);
+	const slotted = convertColonSlotted(cssText, slotScopeId);
+	cssText = slotted.cssText;
+	cssText = convertShadowDOMSelectors(cssText);
+	if (scopeId) cssText = scopeSelectors(cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector);
+	cssText = replaceShadowCssHost(cssText, hostScopeId);
+	cssText = cssText.replace(/>\s*\*\s+([^{, ]+)/gm, " $1 ");
+	return {
+		cssText: cssText.trim(),
+		slottedSelectors: slotted.selectors.map((ref) => ({
+			orgSelector: replaceShadowCssHost(ref.orgSelector, hostScopeId),
+			updatedSelector: replaceShadowCssHost(ref.updatedSelector, hostScopeId)
+		}))
+	};
+};
+/**
+* Helper function that replaces the interim string representing a `:host` selector with
+* the host scope selector class for the element.
+*
+* @param cssText The CSS string to make the replacement in
+* @param hostScopeId The scope ID that will be used as the class representing the host element
+* @returns CSS with the selector replaced
+*/
+const replaceShadowCssHost = (cssText, hostScopeId) => {
+	return cssText.replace(/-shadowcsshost-no-combinator/g, `.${hostScopeId}`);
+};
+/**
+* Expands selectors with ::part(...) to also include [part~="..."] selectors.
+* For example:
+* ```css
+*   selectors-like-this::part(demo) { ... }
+*   .something .selectors::part(demo demo2):hover { ... }
+* ```
+* Becomes:
+* ```
+* selectors-like-this::part(demo), selectors-like-this [part~="demo"] { ... }
+* .something .selectors::part(demo demo2):hover, .something .selectors [part~="demo"][part~="demo2"]:hover { ... }
+* ```
+*
+* @param cssText The CSS text to process
+* @returns The CSS text with expanded ::part(...) selectors
+*/
+const expandPartSelectors = (cssText) => {
+	const partSelectorRe = /([^\s,{][^,{]*?)::part\(\s*([^)]+?)\s*\)((?:[:.][^,{]*)*)/g;
+	return processRules(cssText, (rule) => {
+		if (rule.selector[0] === "@") return rule;
+		rule.selector = rule.selector.split(",").map((sel) => {
+			const out = [sel.trim()];
+			let m;
+			while ((m = partSelectorRe.exec(sel)) !== null) {
+				const before = m[1].trimEnd();
+				const partNames = m[2].trim().split(/\s+/);
+				const after = m[3] || "";
+				const partAttr = partNames.flatMap((p) => {
+					if (!rule.selector.includes(`[part~="${p}"]`)) return [`[part~="${p}"]`];
+					return [];
+				}).join("");
+				const expanded = `${before} ${partAttr}${after}`;
+				if (!!partAttr && expanded !== sel.trim()) out.push(expanded);
+			}
+			return out.join(", ");
+		}).join(", ");
+		return rule;
+	});
+};
+const scopeCss = (cssText, scopeId, commentOriginalSelector) => {
+	const hostScopeId = scopeId + "-h";
+	const slotScopeId = scopeId + "-s";
+	const commentsWithHash = extractCommentsWithHash(cssText);
+	cssText = stripComments(cssText);
+	const orgSelectors = [];
+	if (commentOriginalSelector) {
+		const processCommentedSelector = (rule) => {
+			const placeholder = `/*!@___${orgSelectors.length}___*/`;
+			const comment = `/*!@${rule.selector}*/`;
+			orgSelectors.push({
+				placeholder,
+				comment
+			});
+			rule.selector = placeholder + rule.selector;
+			return rule;
+		};
+		cssText = processRules(cssText, (rule) => {
+			if (rule.selector[0] !== "@") return processCommentedSelector(rule);
+			else if (rule.selector.startsWith("@media") || rule.selector.startsWith("@supports") || rule.selector.startsWith("@page") || rule.selector.startsWith("@document")) {
+				rule.content = processRules(rule.content, processCommentedSelector);
+				return rule;
+			}
+			return rule;
+		});
+	}
+	const scoped = scopeCssText(cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector);
+	cssText = [scoped.cssText, ...commentsWithHash].join("\n");
+	if (commentOriginalSelector) orgSelectors.forEach(({ placeholder, comment }) => {
+		cssText = cssText.replace(placeholder, comment);
+	});
+	scoped.slottedSelectors.forEach((slottedSelector) => {
+		const regex = new RegExp(escapeRegExpSpecialCharacters(slottedSelector.orgSelector) + "(?=\\s*[,{]|$)", "g");
+		cssText = cssText.replace(regex, slottedSelector.updatedSelector);
+	});
+	cssText = expandPartSelectors(cssText);
+	return cssText;
+};
+//#endregion
+//#region src/runtime/mode.ts
+const computeMode = (elm) => modeResolutionChain.map((h) => h(elm)).find((m) => !!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.
+*
+* While the prop value can reasonably be expected to be of `any` type as far as TypeScript's type checker is concerned,
+* it is not safe to assume that the string returned by evaluating `typeof propValue` matches:
+*   1. `any`, the type given to `propValue` in the function signature
+*   2. the type stored from `propType`.
+*
+* This function provides the capability to parse/coerce a property's value to potentially any other JavaScript type.
+*
+* Property values represented in TSX preserve their type information. In the example below, the number 0 is passed to
+* a component. This `propValue` will preserve its type information (`typeof propValue === 'number'`). Note that is
+* based on the type of the value being passed in, not the type declared of the class member decorated with `@Prop`.
+* ```tsx
+* <my-cmp prop-val={0}></my-cmp>
+* ```
+*
+* HTML prop values on the other hand, will always a string
+*
+* @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) => {
+	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;
+		/**
+		* force it to be a number
+		*/
+		if (BUILD.propNumber && propType & MEMBER_FLAGS.Number) return typeof propValue === "string" ? parseFloat(propValue) : typeof propValue === "number" ? propValue : NaN;
+		/**
+		* could have been passed as a number or boolean but we still want it as a string
+		*/
+		if (BUILD.propString && propType & MEMBER_FLAGS.String) return String(propValue);
+		return propValue;
+	}
+	/**
+	* not sure exactly what type we want so no need to change to a different type
+	*/
+	return propValue;
+};
+//#endregion
+//#region src/runtime/set-value.ts
+const applySerializers = (hostRef, cmpMeta, propName, val, instance) => {
+	const run = (inst) => {
+		let attrVal = val;
+		for (const serializer of cmpMeta.$serializers$[propName]) {
+			const [[methodName]] = Object.entries(serializer);
+			attrVal = inst[methodName](attrVal, propName);
+		}
+		hostRef.$serializerValues$.set(propName, attrVal);
+	};
+	if (instance) run(instance);
+	else hostRef.$fetchedCbList$.push(() => run(hostRef.$lazyInstance$));
+};
+const getValue = (ref, propName) => {
+	if (BUILD.signalBacking) {
+		const sig = getHostRef(ref)?.$signalValues$?.get(propName);
+		if (sig !== void 0) return sig.value;
+	}
+	return getHostRef(ref).$instanceValues$.get(propName);
+};
+const setValue = (ref, propName, newVal, cmpMeta) => {
+	const hostRef = getHostRef(ref);
+	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));
+			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);
+			}
+			if (!(Number.isNaN(sig.peek()) && Number.isNaN(parsed))) sig.value = parsed;
+			return;
+		}
+	}
+	if (!hostRef) {
+		if (BUILD.lazyLoad) throw new Error(BUILD.isDev ? `Couldn't find host element for "${cmpMeta.$tagName$}". This usually happens when integrating a 3rd party Stencil component with another Stencil runtime. See https://github.com/stenciljs/core/issues/5457` : `Host element not found for "${cmpMeta.$tagName$}"`);
+		return;
+	}
+	if (BUILD.serializer && hostRef.$serializerValues$.has(propName) && hostRef.$serializerValues$.get(propName) === newVal) return;
+	const elm = BUILD.lazyLoad ? hostRef.$hostElement$ : ref;
+	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));
+	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);
+		if (BUILD.serializer && BUILD.reflect && cmpMeta.$attrsToReflect$ && cmpMeta.$serializers$?.[propName]) applySerializers(hostRef, cmpMeta, propName, newVal, instance);
+		if (BUILD.isDev) {
+			if (hostRef.$flags$ & HOST_FLAGS.devOnRender) consoleDevWarn(`The state/prop "${propName}" changed during rendering. This can potentially lead to infinite-loops and other bugs.`, "\nElement", elm, "\nNew value", newVal, "\nOld value", oldVal);
+			else if (hostRef.$flags$ & HOST_FLAGS.devOnDidLoad) consoleDevWarn(`The state/prop "${propName}" changed during "componentDidLoad()", this triggers extra re-renders, try to setup on "componentWillLoad()"`, "\nElement", elm, "\nNew value", newVal, "\nOld value", oldVal);
+		}
+		if (BUILD.propChangeCallback && cmpMeta.$watchers$) {
+			const watchMethods = cmpMeta.$watchers$[propName];
+			if (watchMethods) watchMethods.map((watcher) => {
+				try {
+					const [[watchMethodName, watcherFlags]] = Object.entries(watcher);
+					if (flags & HOST_FLAGS.isWatchReady || watcherFlags & WATCH_FLAGS.Immediate) {
+						if (BUILD.signalBacking && !hostRef.$signalValues$) return;
+						if (!instance) hostRef.$fetchedCbList$.push(() => {
+							hostRef.$lazyInstance$[watchMethodName](newVal, oldVal, propName);
+						});
+						else instance[watchMethodName](newVal, oldVal, propName);
+					}
+				} catch (e) {
+					consoleError(e, elm);
+				}
+			});
+		}
+		if (BUILD.updatable && flags & HOST_FLAGS.hasRendered) {
+			if (instance.componentShouldUpdate) {
+				if (instance.componentShouldUpdate(newVal, oldVal, propName) === false && !(flags & HOST_FLAGS.isQueuedForUpdate)) return;
+			}
+			if (!(flags & HOST_FLAGS.isQueuedForUpdate)) scheduleUpdate(hostRef, false);
+		}
+	}
+};
+//#endregion
+//#region src/runtime/proxy-component.ts
+/**
+* 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.
+*
+* On a lazy loaded component, this is wired up to both the class instance
+* and the element separately. A `hostRef` keeps the 2 in sync.
+*
+* On a traditional component, this is wired up to the element only.
+*
+* @param Cstr - the constructor for a component that we need to process
+* @param cmpMeta - metadata collected previously about the component
+* @param flags - a number used to store a series of bit flags
+* @returns a reference to the same constructor passed in (but now mutated)
+*/
+const proxyComponent = (Cstr, cmpMeta, flags) => {
+	const prototype = Cstr.prototype;
+	if (BUILD.isTesting) {
+		if (prototype.__stencilAugmented) return;
+		prototype.__stencilAugmented = true;
+	}
+	/**
+	* proxy form associated custom element lifecycle callbacks
+	* @see https://web.dev/articles/more-capable-form-controls#lifecycle_callbacks
+	*/
+	if (BUILD.formAssociated && cmpMeta.$flags$ & CMP_FLAGS.formAssociated && flags & PROXY_FLAGS.isElementConstructor) FORM_ASSOCIATED_CUSTOM_ELEMENT_CALLBACKS.forEach((cbName) => {
+		const originalFormAssociatedCallback = prototype[cbName];
+		Object.defineProperty(prototype, cbName, { value(...args) {
+			const hostRef = getHostRef(this);
+			const instance = BUILD.lazyLoad ? hostRef?.$lazyInstance$ : this;
+			if (!instance) hostRef?.$onReadyPromise$?.then((asyncInstance) => {
+				const cb = asyncInstance[cbName];
+				if (typeof cb === "function") cb.call(asyncInstance, ...args);
+			});
+			else {
+				const cb = BUILD.lazyLoad ? instance[cbName] : originalFormAssociatedCallback;
+				if (typeof cb === "function") cb.call(instance, ...args);
+			}
+		} });
+	});
+	if (BUILD.member && cmpMeta.$members$ || BUILD.propChangeCallback) {
+		if (BUILD.propChangeCallback) {
+			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;
+		}
+		const members = Object.entries(cmpMeta.$members$ ?? {});
+		members.map(([memberName, [memberFlags]]) => {
+			if ((BUILD.prop || BUILD.state) && (memberFlags & MEMBER_FLAGS.Prop || (!BUILD.lazyLoad || flags & PROXY_FLAGS.proxyState) && memberFlags & MEMBER_FLAGS.State)) {
+				const { get: origGetter, set: origSetter } = getPropertyDescriptor(prototype, memberName) || {};
+				if (origGetter) cmpMeta.$members$[memberName][0] |= MEMBER_FLAGS.Getter;
+				if (origSetter) cmpMeta.$members$[memberName][0] |= MEMBER_FLAGS.Setter;
+				if (flags & PROXY_FLAGS.isElementConstructor || !origGetter) Object.defineProperty(prototype, memberName, {
+					get() {
+						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 (!BUILD.lazyLoad) return origGetter ? origGetter.apply(this) : getValue(this, memberName);
+					},
+					configurable: true,
+					enumerable: true
+				});
+				Object.defineProperty(prototype, memberName, { set(newValue) {
+					const ref = getHostRef(this);
+					if (!ref) return;
+					if (BUILD.isDev) {
+						if ((flags & PROXY_FLAGS.isElementConstructor) === 0 && (cmpMeta.$members$[memberName][0] & MEMBER_FLAGS.Setter) === 0 && (ref && ref.$flags$ & HOST_FLAGS.isConstructingInstance) === 0 && (memberFlags & MEMBER_FLAGS.Prop) !== 0 && (memberFlags & MEMBER_FLAGS.Mutable) === 0) consoleDevWarn(`@Prop() "${memberName}" on <${cmpMeta.$tagName$}> is immutable but was modified from within the component.\nMore information: https://stenciljs.com/docs/properties#prop-mutability`);
+					}
+					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))]);
+						newValue = memberFlags & MEMBER_FLAGS.State ? this[memberName] : ref.$hostElement$[memberName];
+						setValue(this, memberName, newValue, cmpMeta);
+						return;
+					}
+					if (!BUILD.lazyLoad) {
+						setValue(this, memberName, newValue, cmpMeta);
+						return;
+					}
+					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 setterSetVal = () => {
+							const currentValue = ref.$lazyInstance$[memberName];
+							if (!ref.$instanceValues$.get(memberName) && currentValue) ref.$instanceValues$.set(memberName, currentValue);
+							ref.$lazyInstance$[memberName] = parsePropertyValue(newValue, memberFlags, BUILD.formAssociated && !!(cmpMeta.$flags$ & CMP_FLAGS.formAssociated));
+							setValue(this, memberName, ref.$lazyInstance$[memberName], cmpMeta);
+						};
+						if (ref.$lazyInstance$) setterSetVal();
+						else ref.$fetchedCbList$.push(() => {
+							setterSetVal();
+						});
+					}
+				} });
+			} else if (BUILD.lazyLoad && BUILD.method && flags & PROXY_FLAGS.isElementConstructor && memberFlags & MEMBER_FLAGS.Method) Object.defineProperty(prototype, memberName, { value(...args) {
+				const ref = getHostRef(this);
+				return ref?.$onInstancePromise$?.then(() => ref.$lazyInstance$?.[memberName](...args));
+			} });
+		});
+		if (BUILD.observeAttribute && (!BUILD.lazyLoad || flags & PROXY_FLAGS.isElementConstructor)) {
+			const attrNameToPropName = /* @__PURE__ */ new Map();
+			prototype.attributeChangedCallback = function(attrName, oldValue, newValue) {
+				plt.jmp(() => {
+					const propName = attrNameToPropName.get(attrName);
+					const hostRef = getHostRef(this);
+					if (BUILD.serializer && hostRef.$serializerValues$.has(propName) && hostRef.$serializerValues$.get(propName) === newValue) return;
+					if (this.hasOwnProperty(propName) && BUILD.lazyLoad) {
+						newValue = this[propName];
+						delete this[propName];
+					}
+					if (BUILD.deserializer && cmpMeta.$deserializers$ && cmpMeta.$deserializers$[propName]) {
+						const setVal = (methodName, instance) => {
+							const deserializeVal = instance?.[methodName](newValue, propName);
+							if (deserializeVal !== this[propName]) this[propName] = deserializeVal;
+						};
+						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);
+						}
+						return;
+					} else if (prototype.hasOwnProperty(propName) && typeof this[propName] === "number" && this[propName] == newValue) return;
+					else if (propName == null) {
+						const hostFlags = hostRef?.$flags$;
+						if (hostRef && hostFlags && !(hostFlags & HOST_FLAGS.isConstructingInstance) && newValue !== oldValue) {
+							const elm = BUILD.lazyLoad ? hostRef.$hostElement$ : this;
+							const instance = BUILD.lazyLoad ? hostRef.$lazyInstance$ : elm;
+							(cmpMeta.$watchers$?.[attrName])?.forEach((watcher) => {
+								const [[watchMethodName, watcherFlags]] = Object.entries(watcher);
+								if (instance[watchMethodName] != null && (hostFlags & HOST_FLAGS.isWatchReady || watcherFlags & WATCH_FLAGS.Immediate)) instance[watchMethodName](newValue, oldValue, attrName);
+							});
+						}
+						return;
+					}
+					const propFlags = members.find(([m]) => m === propName);
+					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 (!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]) => {
+				const attrName = m[1] || propName;
+				attrNameToPropName.set(attrName, propName);
+				if (BUILD.reflect && m[0] & MEMBER_FLAGS.ReflectAttr) cmpMeta.$attrsToReflect$?.push([propName, attrName]);
+				return attrName;
+			})]));
+		}
+	}
+	return Cstr;
+};
+//#endregion
+//#region src/runtime/initialize-component.ts
+/**
+* Initialize a Stencil component given a reference to its host element, its
+* runtime bookkeeping data structure, runtime metadata about the component,
+* and (optionally) an HMR version ID.
+*
+* @param elm a host element
+* @param hostRef the element's runtime bookkeeping object
+* @param cmpMeta runtime metadata for the Stencil component
+* @param hmrVersionId an (optional) HMR version ID
+*/
+const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
+	let Cstr;
+	try {
+		if ((hostRef.$flags$ & HOST_FLAGS.hasInitializedComponent) === 0) {
+			hostRef.$flags$ |= HOST_FLAGS.hasInitializedComponent;
+			const bundleId = cmpMeta.$lazyBundleId$;
+			if (BUILD.lazyLoad && bundleId) {
+				const CstrImport = loadModule(cmpMeta, hostRef, hmrVersionId);
+				if (CstrImport && "then" in CstrImport) {
+					const endLoad = uniqueTime(`st:load:${cmpMeta.$tagName$}:${hostRef.$modeName$}`, `[Stencil] Load module for <${cmpMeta.$tagName$}>`);
+					Cstr = await CstrImport;
+					endLoad();
+				} else Cstr = CstrImport;
+				if (!Cstr) 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);
+						cmpMeta.$serializers$ = Cstr.serializers;
+						cmpMeta.$deserializers$ = Cstr.deserializers;
+					}
+					proxyComponent(Cstr, cmpMeta, PROXY_FLAGS.proxyState);
+					Cstr.isProxied = true;
+				}
+				const endNewInstance = createTime("createInstance", cmpMeta.$tagName$);
+				if (BUILD.member) hostRef.$flags$ |= HOST_FLAGS.isConstructingInstance;
+				try {
+					new Cstr(hostRef);
+				} catch (e) {
+					consoleError(e, elm);
+				}
+				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;
+			} else Cstr = elm.constructor;
+			if (BUILD.style && Cstr && Cstr.style) {
+				/**
+				* this component has styles but we haven't registered them yet
+				*/
+				let style;
+				if (typeof Cstr.style === "string")
+ /**
+				* in case the component has a `styleUrl` defined, e.g.
+				* ```ts
+				* @Component({
+				*   tag: 'my-component',
+				*   styleUrl: 'my-component.css'
+				* })
+				* ```
+				*/
+				style = Cstr.style;
+				else if (BUILD.mode && typeof Cstr.style !== "string") {
+					/**
+					* in case the component has a `styleUrl` object defined, e.g.
+					* ```ts
+					* @Component({
+					*   tag: 'my-component',
+					*   styleUrl: {
+					*     ios: 'my-component.ios.css',
+					*     md: 'my-component.md.css'
+					*   }
+					* })
+					* ```
+					*/
+					hostRef.$modeName$ = computeMode(elm);
+					if (hostRef.$modeName$) style = Cstr.style[hostRef.$modeName$];
+					if (BUILD.hydrateServerSide && hostRef.$modeName$) elm.setAttribute("s-mode", hostRef.$modeName$);
+				}
+				const scopeId = getScopeId(cmpMeta, hostRef.$modeName$);
+				if (!styles.has(scopeId) || BUILD.hotModuleReplacement && hmrVersionId) {
+					const endRegisterStyles = createTime("registerStyles", cmpMeta.$tagName$);
+					if (BUILD.hydrateServerSide && BUILD.shadowDom) {
+						if (cmpMeta.$flags$ & CMP_FLAGS.shadowNeedsScopedCss) style = scopeCss(style, scopeId, true);
+						else if (needsScopedSSR()) style = expandPartSelectors(style);
+					}
+					registerStyle(scopeId, style, !!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation));
+					endRegisterStyles();
+				}
+			}
+		}
+		if (BUILD.signalBacking && cmpMeta.$members$) initializeSignals(elm, hostRef, cmpMeta);
+		else if (BUILD.vdomSignals) initializeEffects(elm, hostRef);
+		const ancestorComponent = hostRef.$ancestorComponent$;
+		const schedule = () => scheduleUpdate(hostRef, true);
+		if (BUILD.asyncLoading && ancestorComponent && ancestorComponent["s-rc"]) ancestorComponent["s-rc"].push(schedule);
+		else schedule();
+	} catch (e) {
+		consoleError(e, elm);
+		if (BUILD.asyncLoading && hostRef.$onRenderResolve$) {
+			hostRef.$onRenderResolve$();
+			hostRef.$onRenderResolve$ = void 0;
+		}
+		if (BUILD.asyncLoading && hostRef.$onReadyResolve$) hostRef.$onReadyResolve$(elm);
+	}
+};
+const fireConnectedCallback = (instance, elm) => {
+	if (BUILD.lazyLoad) safeCall(instance, "connectedCallback", void 0, elm);
+};
+//#endregion
+//#region src/runtime/connected-callback.ts
+const connectedCallback = (elm) => {
+	if ((plt.$flags$ & PLATFORM_FLAGS.isTmpDisconnected) === 0) {
+		const hostRef = getHostRef(elm);
+		if (!hostRef) return;
+		const cmpMeta = hostRef.$cmpMeta$;
+		const endConnected = createTime("connectedCallback", cmpMeta.$tagName$);
+		if (!(hostRef.$flags$ & HOST_FLAGS.hasConnected)) {
+			hostRef.$flags$ |= HOST_FLAGS.hasConnected;
+			let hostId;
+			if (BUILD.hydrateClientSide) {
+				hostId = elm.getAttribute(HYDRATE_ID);
+				if (hostId) {
+					if (BUILD.shadowDom && cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) {
+						const shadowRoot = getShadowRoot(elm);
+						const scopeId = BUILD.mode ? addStyle(shadowRoot, cmpMeta, elm.getAttribute("s-mode")) : addStyle(shadowRoot, cmpMeta);
+						elm.classList.remove(scopeId + "-h", scopeId + "-s");
+					} else if (BUILD.scoped && cmpMeta.$flags$ & CMP_FLAGS.scopedCssEncapsulation) elm["s-sc"] = getScopeId(cmpMeta, BUILD.mode ? elm.getAttribute("s-mode") : void 0);
+					initializeClientHydrate(elm, cmpMeta.$tagName$, hostId, hostRef);
+				}
+			}
+			if (BUILD.slotRelocation && !hostId) {
+				if (BUILD.hydrateServerSide || (BUILD.slot || BUILD.shadowDom) && cmpMeta.$flags$ & CMP_FLAGS.hasSlotRelocation) setContentReference(elm);
+			}
+			if (BUILD.asyncLoading) {
+				let ancestorComponent = elm;
+				while (ancestorComponent = ancestorComponent.parentNode || ancestorComponent.host) if (BUILD.hydrateClientSide && ancestorComponent.nodeType === NODE_TYPE.ElementNode && ancestorComponent.hasAttribute("s-id") && ancestorComponent["s-p"] || ancestorComponent["s-p"]) {
+					attachToAncestor(hostRef, hostRef.$ancestorComponent$ = ancestorComponent);
+					break;
+				}
+			}
+			if (BUILD.prop && !BUILD.hydrateServerSide && cmpMeta.$members$) Object.entries(cmpMeta.$members$).map(([memberName, [memberFlags]]) => {
+				if (memberFlags & MEMBER_FLAGS.Prop && Object.prototype.hasOwnProperty.call(elm, memberName)) {
+					if (cmpMeta.$flags$ & CMP_FLAGS.hasModernPropertyDecls) {
+						const desc = Object.getOwnPropertyDescriptor(elm, memberName);
+						if (desc && (desc.get || desc.set)) return;
+					}
+					const value = elm[memberName];
+					delete elm[memberName];
+					elm[memberName] = value;
+				}
+			});
+			if (!BUILD.lazyLoad && BUILD.prop && !BUILD.hydrateServerSide) {
+				const pendingProps = elm["s-pp"];
+				if (pendingProps) {
+					delete elm["s-pp"];
+					pendingProps.forEach((value, propName) => {
+						elm[propName] = value;
+					});
+				}
+			}
+			if (BUILD.initializeNextTick) nextTick(() => initializeComponent(elm, hostRef, cmpMeta));
+			else initializeComponent(elm, hostRef, cmpMeta);
+		} else {
+			addHostEventListeners(elm, hostRef, cmpMeta.$listeners$);
+			if (hostRef?.$lazyInstance$) fireConnectedCallback(hostRef.$lazyInstance$, elm);
+			else if (hostRef?.$onReadyPromise$) hostRef.$onReadyPromise$.then(() => fireConnectedCallback(hostRef.$lazyInstance$, elm));
+		}
+		endConnected();
+	}
+};
+const setContentReference = (elm) => {
+	if (!win.document) return;
+	const contentRefElm = elm["s-cr"] = win.document.createComment(BUILD.isDebug ? `content-ref (host=${elm.localName})` : "");
+	contentRefElm["s-cn"] = true;
+	insertBefore(elm, contentRefElm, elm.firstChild);
+};
+//#endregion
+//#region src/runtime/disconnected-callback.ts
+const disconnectInstance = (instance, elm) => {
+	if (BUILD.lazyLoad) safeCall(instance, "disconnectedCallback", void 0, elm || instance);
+};
+const disconnectedCallback = async (elm) => {
+	if ((plt.$flags$ & PLATFORM_FLAGS.isTmpDisconnected) === 0) {
+		const hostRef = getHostRef(elm);
+		if (BUILD.hostListener) {
+			if (hostRef?.$rmListeners$) {
+				hostRef.$rmListeners$.map((rmListener) => rmListener());
+				hostRef.$rmListeners$ = void 0;
+			}
+		}
+		if (BUILD.vdomSignals && hostRef?.$signalCleanup$) {
+			hostRef.$signalCleanup$();
+			hostRef.$signalCleanup$ = void 0;
+		}
+		if (!BUILD.lazyLoad) disconnectInstance(elm);
+		else if (hostRef?.$lazyInstance$) disconnectInstance(hostRef.$lazyInstance$, elm);
+		else if (hostRef?.$onReadyPromise$) hostRef.$onReadyPromise$.then(() => disconnectInstance(hostRef.$lazyInstance$, elm));
+	}
+	/**
+	* Remove the element from the `rootAppliedStyles` WeakMap
+	*/
+	if (rootAppliedStyles.has(elm)) rootAppliedStyles.delete(elm);
+	/**
+	* Remove the shadow root from the `rootAppliedStyles` WeakMap
+	*/
+	if (elm.shadowRoot && rootAppliedStyles.has(elm.shadowRoot)) rootAppliedStyles.delete(elm.shadowRoot);
+};
+//#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})
+*
+* 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;
+		if (BUILD.hostListener && hostRef.$rmListeners$) {
+			hostRef.$rmListeners$.map((rmListener) => rmListener());
+			hostRef.$rmListeners$ = void 0;
+		}
+		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) => {
+			if (BUILD.hostListener) {
+				const hostRef = getHostRef(el);
+				if (hostRef?.$rmListeners$) {
+					hostRef.$rmListeners$.map((rmListener) => rmListener());
+					hostRef.$rmListeners$ = void 0;
+					addHostEventListeners(el, hostRef, cmpMeta.$listeners$);
+				}
+			}
+			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));
+};
+const proxyCustomElement = (Cstr, compactMeta) => {
+	if (BUILD.profile && performance.mark && performance.getEntriesByName("st:app:start", "mark").length === 0) performance.mark("st:app:start");
+	const cmpMeta = {
+		$flags$: compactMeta[0],
+		$tagName$: compactMeta[1]
+	};
+	try {
+		if (BUILD.member) cmpMeta.$members$ = compactMeta[2];
+		if (BUILD.hostListener) cmpMeta.$listeners$ = compactMeta[3];
+		if (BUILD.propChangeCallback) {
+			cmpMeta.$watchers$ = normalizeWatchers(Cstr.$watchers$);
+			cmpMeta.$deserializers$ = Cstr.$deserializers$;
+			cmpMeta.$serializers$ = Cstr.$serializers$;
+		}
+		if (BUILD.reflect) cmpMeta.$attrsToReflect$ = [];
+		if (BUILD.hotModuleReplacement) Cstr.prototype["s-hmr"] = function(hmrVersionId) {
+			hmrStart(this, cmpMeta, hmrVersionId);
+		};
+		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);
+		else {
+			if (BUILD.slotChildNodes || BUILD.patchChildren && cmpMeta.$flags$ & CMP_FLAGS.patchChildren) patchChildSlotNodes(Cstr.prototype);
+			if (BUILD.slotDomMutations || BUILD.patchInsert && cmpMeta.$flags$ & CMP_FLAGS.patchInsert) {
+				patchSlotAppendChild(Cstr.prototype);
+				patchSlotAppend(Cstr.prototype);
+				patchSlotPrepend(Cstr.prototype);
+				patchSlotInsertAdjacentHTML(Cstr.prototype);
+				patchInsertBefore(Cstr.prototype);
+				patchSlotRemoveChild(Cstr.prototype);
+			}
+			if (BUILD.slotTextContent) patchTextContent(Cstr.prototype);
+		}
+		if (BUILD.hydrateClientSide && BUILD.shadowDom) hydrateScopedToShadow();
+		const originalConnectedCallback = Cstr.prototype.connectedCallback;
+		const originalDisconnectedCallback = Cstr.prototype.disconnectedCallback;
+		Object.assign(Cstr.prototype, {
+			__hasHostListenerAttached: false,
+			__registerHost() {
+				registerHost(this, cmpMeta);
+			},
+			componentOnReady() {
+				return getHostRef(this)?.$onReadyPromise$;
+			},
+			connectedCallback() {
+				if (!this.__hasHostListenerAttached) {
+					const hostRef = getHostRef(this);
+					if (!hostRef) return;
+					addHostEventListeners(this, hostRef, cmpMeta.$listeners$);
+					this.__hasHostListenerAttached = true;
+				}
+				connectedCallback(this);
+				if (originalConnectedCallback) originalConnectedCallback.call(this);
+			},
+			disconnectedCallback() {
+				disconnectedCallback(this);
+				if (originalDisconnectedCallback) originalDisconnectedCallback.call(this);
+			},
+			__attachShadow() {
+				const isClosed = BUILD.shadowModeClosed && !!(cmpMeta.$flags$ & CMP_FLAGS.shadowModeClosed);
+				let existingRoot = this.shadowRoot;
+				if (BUILD.shadowModeClosed && isClosed) existingRoot = this.__shadowRoot ?? null;
+				if (!existingRoot) createShadowRoot.call(this, cmpMeta);
+				else if (BUILD.isDev && BUILD.shadowModeClosed && isClosed && existingRoot.mode !== "closed") throw new Error(`Unable to re-use existing shadow root for ${cmpMeta.$tagName$}! Mode is set to ${existingRoot.mode} but expected closed.`);
+			}
+		});
+		Object.defineProperty(Cstr, "is", {
+			value: cmpMeta.$tagName$,
+			configurable: true
+		});
+		return proxyComponent(Cstr, cmpMeta, PROXY_FLAGS.isElementConstructor | PROXY_FLAGS.proxyState);
+	} catch (e) {
+		consoleError(e);
+		return Cstr;
+	}
+};
+const forceModeUpdate = (elm) => {
+	if (BUILD.style && BUILD.mode && !BUILD.lazyLoad) {
+		const mode = computeMode(elm);
+		const hostRef = getHostRef(elm);
+		if (hostRef && hostRef.$modeName$ !== mode) {
+			const cmpMeta = hostRef.$cmpMeta$;
+			const oldScopeId = elm["s-sc"];
+			const scopeId = getScopeId(cmpMeta, mode);
+			const style = elm.constructor.style[mode];
+			const flags = cmpMeta.$flags$;
+			if (style) {
+				if (!styles.has(scopeId)) registerStyle(scopeId, style, !!(flags & CMP_FLAGS.shadowDomEncapsulation));
+				hostRef.$modeName$ = mode;
+				elm.classList.remove(oldScopeId + "-h", oldScopeId + "-s");
+				attachStyles(hostRef);
+				forceUpdate(elm);
+			}
+		}
+	}
+};
+//#endregion
+//#region src/runtime/bootstrap-loader.ts
+const bootstrapLazy = (lazyBundles, options = {}) => {
+	if (BUILD.profile && performance.mark) performance.mark("st:app:start");
+	installDevTools();
+	if (!win.document) {
+		console.warn("Stencil: No document found. Skipping");
+		return;
+	}
+	const endBootstrap = createTime("bootstrapLazy");
+	const cmpTags = [];
+	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 deferredConnectedCallbacks = [];
+	let appLoadFallback;
+	let isBootstrapping = true;
+	Object.assign(plt, options);
+	if (BUILD.asyncQueue && options.syncQueue) plt.$flags$ |= PLATFORM_FLAGS.queueSync;
+	if (BUILD.hydrateClientSide) plt.$flags$ |= PLATFORM_FLAGS.appLoaded;
+	if (BUILD.hydrateClientSide && BUILD.shadowDom) hydrateScopedToShadow();
+	lazyBundles.map((lazyBundle) => {
+		lazyBundle[1].map((compactMeta) => {
+			const cmpMeta = {
+				$flags$: compactMeta[0],
+				$tagName$: compactMeta[1],
+				$members$: compactMeta[2],
+				$listeners$: compactMeta[3]
+			};
+			if (BUILD.member) cmpMeta.$members$ = compactMeta[2];
+			if (BUILD.hostListener) cmpMeta.$listeners$ = compactMeta[3];
+			if (BUILD.reflect) cmpMeta.$attrsToReflect$ = [];
+			if (BUILD.propChangeCallback) {
+				cmpMeta.$watchers$ = normalizeWatchers(compactMeta[4]);
+				cmpMeta.$serializers$ = compactMeta[5] ?? {};
+				cmpMeta.$deserializers$ = compactMeta[6] ?? {};
+			}
+			const tagName = transformTag(cmpMeta.$tagName$);
+			const HostElement = class extends HTMLElement {
+				["s-p"];
+				["s-rc"];
+				hreListeners = false;
+				constructor(self) {
+					super(self);
+					self = this;
+					registerHost(self, cmpMeta);
+					if (BUILD.shadowDom && cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation && !(cmpMeta.$flags$ & CMP_FLAGS.shadowNeedsScopedCss)) {
+						if (!self.shadowRoot) createShadowRoot.call(self, cmpMeta);
+						else if (BUILD.isDev && self.shadowRoot.mode !== "open") throw new Error(`Unable to re-use existing shadow root for ${cmpMeta.$tagName$}! Mode is set to ${self.shadowRoot.mode} but DSD shadow roots must use open mode.`);
+					}
+				}
+				connectedCallback() {
+					const hostRef = getHostRef(this);
+					if (!hostRef) return;
+					/**
+					* The `connectedCallback` lifecycle event can potentially be fired multiple times
+					* if the element is removed from the DOM and re-inserted. This is not a common use case,
+					* but it can happen in some scenarios. To prevent registering the same event listeners
+					* multiple times, we will only register them once.
+					*/
+					if (!this.hreListeners) {
+						this.hreListeners = true;
+						addHostEventListeners(this, hostRef, cmpMeta.$listeners$);
+					}
+					if (appLoadFallback) {
+						clearTimeout(appLoadFallback);
+						appLoadFallback = null;
+					}
+					if (isBootstrapping) deferredConnectedCallbacks.push(this);
+					else plt.jmp(() => connectedCallback(this));
+				}
+				disconnectedCallback() {
+					plt.jmp(() => disconnectedCallback(this));
+					/**
+					* Clear up references within the `$vnode$` object to the DOM
+					* node that was removed. This is necessary to ensure that these
+					* references used as keys in the `hostRef` object can be properly
+					* garbage collected.
+					*
+					* Also remove the reference from `deferredConnectedCallbacks` array
+					* otherwise removed instances won't get garbage collected.
+					*/
+					plt.raf(() => {
+						const hostRef = getHostRef(this);
+						if (!hostRef) return;
+						const i = deferredConnectedCallbacks.findIndex((host) => host === this);
+						if (i > -1) deferredConnectedCallbacks.splice(i, 1);
+						if (hostRef?.$vnode$?.$elm$ instanceof Node && !hostRef.$vnode$.$elm$.isConnected) delete hostRef.$vnode$.$elm$;
+					});
+				}
+				componentOnReady() {
+					return getHostRef(this)?.$onReadyPromise$;
+				}
+			};
+			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 (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) {
+				hmrStart(this, cmpMeta, hmrVersionId);
+			};
+			cmpMeta.$lazyBundleId$ = lazyBundle[0];
+			if (!exclude.includes(tagName) && !_reg.get(tagName)) {
+				cmpTags.push(tagName);
+				const proxied = proxyComponent(HostElement, cmpMeta, PROXY_FLAGS.isElementConstructor);
+				proxied._registry = _reg;
+				_reg.define(tagName, proxied);
+			}
+		});
+	});
+	if (cmpTags.length > 0) {
+		if (BUILD.invisiblePrehydration && !BUILD.staticHydrationStyles && (BUILD.hydratedClass || BUILD.hydratedAttribute)) dataStyles.textContent += cmpTags.sort() + HYDRATED_CSS;
+		if (dataStyles.innerHTML.length) {
+			dataStyles.setAttribute("data-styles", "");
+			const nonce = plt.$nonce$ ?? queryNonceMetaTagContent(win.document);
+			if (nonce != null) dataStyles.setAttribute("nonce", nonce);
+			head.insertBefore(dataStyles, metaCharset ? metaCharset.nextSibling : head.firstChild);
+		}
+	}
+	isBootstrapping = false;
+	if (deferredConnectedCallbacks.length) deferredConnectedCallbacks.map((host) => host.connectedCallback());
+	else if (BUILD.profile) plt.jmp(() => appLoadFallback = setTimeout(appDidLoad, 30, "timeout"));
+	else plt.jmp(() => appLoadFallback = setTimeout(appDidLoad, 30));
+	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]) => {
+		const target = BUILD.hostListenerTarget ? getHostListenerTarget(win.document, elm, flags) : elm;
+		const handler = hostListenerProxy(hostRef, method);
+		const opts = hostListenerOpts(flags);
+		plt.ael(target, name, handler, opts);
+		(hostRef.$rmListeners$ = hostRef.$rmListeners$ || []).push(() => plt.rel(target, name, handler, opts));
+	});
+};
+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);
+	} catch (e) {
+		consoleError(e, hostRef.$hostElement$);
+	}
+};
+const getHostListenerTarget = (doc, elm, flags) => {
+	if (BUILD.hostListenerTargetDocument && flags & LISTENER_FLAGS.TargetDocument) return doc;
+	if (BUILD.hostListenerTargetWindow && flags & LISTENER_FLAGS.TargetWindow) return win;
+	if (BUILD.hostListenerTargetBody && flags & LISTENER_FLAGS.TargetBody) return doc.body;
+	return elm;
+};
+const hostListenerOpts = (flags) => supportsListenerOptions ? {
+	passive: (flags & LISTENER_FLAGS.Passive) !== 0,
+	capture: (flags & LISTENER_FLAGS.Capture) !== 0
+} : (flags & LISTENER_FLAGS.Capture) !== 0;
+//#endregion
+//#region src/runtime/mixin.ts
+const baseClass = BUILD.lazyLoad ? class {} : globalThis.HTMLElement || class {};
+function Mixin(...mixins) {
+	return mixins.reduceRight((acc, mixin) => mixin(acc), baseClass);
+}
+//#endregion
+//#region src/runtime/nonce.ts
+/**
+* Assigns the given value to the nonce property on the runtime platform object.
+* During runtime, this value is used to set the nonce attribute on all dynamically created script and style tags.
+* @param nonce The value to be assigned to the platform nonce property.
+* @returns void
+*/
+const setNonce = (nonce) => plt.$nonce$ = nonce;
+//#endregion
+//#region src/runtime/platform-options.ts
+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';
+*
+* const vnode = (
+*   <div>
+*     <h1>Hello, world!</h1>
+*   </div>
+* );
+* render(vnode, document.body);
+* ```
+*
+* @param vnode - The virtual DOM tree to render
+* @param container - The container element to render the virtual DOM tree to
+*/
+function render(vnode, container) {
+	let ref = hostRefCache.get(container);
+	if (!ref) {
+		ref = {
+			$flags$: 0,
+			$cmpMeta$: {
+				$flags$: 0,
+				$tagName$: container.tagName
+			},
+			$hostElement$: container
+		};
+		hostRefCache.set(container, ref);
+	}
+	renderVdom(ref, vnode);
+}
+//#endregion
+//#region src/runtime/tag-transform.ts
+let tagTransformer = void 0;
+/**
+* Transforms a tag name using the current tag transformer
+* @param tag - the tag to transform e.g. `my-tag`
+* @returns the transformed tag e.g. `new-my-tag`
+*/
+function transformTag(tag) {
+	if (!tagTransformer) return tag;
+	return tagTransformer(tag);
+}
+/**
+* Sets the tag transformer to be used when rendering custom elements
+* @param transformer the transformer function to use. Must return a string
+*/
+function setTagTransformer(transformer) {
+	tagTransformer = transformer;
+}
+//#endregion
+//#region src/runtime/vdom/jsx-runtime.ts
+function jsx(type, props, key) {
+	const { children, ...rest } = props ?? {};
+	if (key !== void 0 && !("key" in rest)) rest.key = key;
+	const attrs = hasKeys(rest) ? rest : null;
+	if (children !== void 0) return Array.isArray(children) ? h(type, attrs, ...children) : h(type, attrs, children);
+	return h(type, attrs);
+}
+/**
+* @alias
+*/
+const jsxs = jsx;
+/**
+* @alias
+*/
+const jsxDEV = jsx;
+function hasKeys(obj) {
+	for (const _ in obj) return true;
+	return false;
+}
+//#endregion
+export { Fragment, HYDRATED_STYLE_ID, Host, Mixin, addHostEventListeners, bootstrapLazy, connectedCallback, createEvent, defineCustomElement, disconnectedCallback, forceModeUpdate, forceUpdate, getAssetPath, getElement, getMode, getRegistry, getRenderingRef, getShadowRoot, getValue, h, jsx, jsxDEV, jsxs, normalizeWatchers, parsePropertyValue, postUpdateComponent, proxyComponent, proxyCustomElement, render, setAssetPath, setMode, setNonce, setPlatformOptions, setRegistry, setTagTransformer, setValue, transformTag };