@rdlabo/capacitor-native-ui 0.0.0-stage → 2.0.0-1

package/dist/native/runtime.js

@@ -0,0 +1,776 @@
+import { controlSelected } from "./shared/control-options.js";
+import { inVerticalBarsSurface, modalUsesVerticalBars, modalVerticalBarFrame, topModal } from "./shared/modal.js";
+import { createCrossfade, fadeMarker } from "./shared/crossfade.js";
+import { activateProjectedElement, createVerticalBarsPageState, isVerticalBarsSource, marker, preferredVerticalBarsBack, prehideOnlyMutation, rejectedClass, syncToolbarText, unprojected } from "./shared/dom.js";
+import { createDiagnostics } from "./shared/diagnostics.js";
+import { projectionAncestors } from "./shared/clipping.js";
+import { createIconRenderer } from "./shared/icons.js";
+import { htmlSelector, readHTMLControl } from "./html.js";
+import { readExtension } from "./extensions.js";
+import { VERTICAL_BARS_TRANSITION_CANCELED, getNativeSearchBindings, setNativeUIIntegration } from "../native-integration/index.js";
+import { bounded, boundedListener } from "./shared/bridge.js";
+import { projectionIds } from "./shared/projection-id.js";
+import { popoverTrigger } from "./overlays/popover.js";
+import { alignVerticalTabBar, forgetVerticalBarFrame, rememberVerticalBarFrame, validVerticalBarFrame } from "./shared/vertical-bars-geometry.js";
+import { CSS_MOTION_EVENTS, LIFECYCLE_DID_ENTER, LIFECYCLE_DID_LEAVE, LIFECYCLE_WILL_ENTER, LIFECYCLE_WILL_LEAVE } from "./shared/events.js";
+import { createSearchSupport } from "./components/searchable-tabs.js";
+import { isVerticalBarsCandidate, motionSelector, readCandidate, selector, shadowSelector } from "./components/index.js";
+//#region src/native/runtime.ts
+const overlays = "ion-modal, ion-popover, ion-alert, ion-action-sheet, ion-loading, ion-picker, ion-toast, ion-menu";
+const railPreservingOverlays = "ion-toast, ion-popover, ion-picker";
+const overlayNames = [
+	"Modal",
+	"Popover",
+	"Alert",
+	"ActionSheet",
+	"Loading",
+	"Picker",
+	"Toast"
+];
+const verticalBarsMarker = "data-native-ui-vertical-bars";
+const verticalBarsMemberMarker = "data-native-ui-vertical-bars-member";
+const createRuntime = async (doc, plugin, options = {}, nativeVerticalBars = () => true, onStop) => {
+	const win = doc.defaultView;
+	const extensions = options.extensions ?? [];
+	const diagnose = createDiagnostics(options.debug);
+	const scope = options.root ?? doc;
+	const discovery = [options.source === "extensions" ? ":not(*)" : options.source === "html" ? htmlSelector : options.source === "auto" ? `${selector}, ${htmlSelector}` : selector, ...extensions.map((extension) => extension.selector)].join(", ");
+	const icons = createIconRenderer();
+	const crossfade = createCrossfade(win);
+	const ids = /* @__PURE__ */ new WeakMap();
+	let rejected = /* @__PURE__ */ new WeakMap();
+	const sources = /* @__PURE__ */ new Map();
+	const verticalBarsOwners = /* @__PURE__ */ new Set();
+	const verticalBarsMembers = /* @__PURE__ */ new Set();
+	const suspended = /* @__PURE__ */ new Set();
+	const pages = /* @__PURE__ */ new Set();
+	const verticalBarsPages = createVerticalBarsPageState();
+	const presented = /* @__PURE__ */ new Set();
+	const railPopovers = /* @__PURE__ */ new WeakSet();
+	const manualSuspensions = /* @__PURE__ */ new Set();
+	const moving = /* @__PURE__ */ new Map();
+	const observed = /* @__PURE__ */ new Set();
+	const listeners = new AbortController();
+	let actions = /* @__PURE__ */ new Map();
+	let nextId = 0;
+	let revision = 0;
+	const tabGeometry = /* @__PURE__ */ new Map();
+	let acceptedRevision = 0;
+	let updatingRevision;
+	let pendingActivations = [];
+	let lastSequence = 0;
+	let lastSnapshot = "";
+	let viewport = `${win.innerWidth}:${win.innerHeight}`;
+	let forceRefresh = false;
+	let dirty = false;
+	let pending = false;
+	let stopped = false;
+	let destruction;
+	const retentions = /* @__PURE__ */ new Set();
+	/** True while a tab-switch handoff should skip crossfade. */
+	let tabSwitchHandoff = false;
+	/** Keep instant updates until this time — DidLeave often precedes the retire sync. */
+	let handoffUntil = 0;
+	/** Tab switch armed while a sync was already in flight; extend instant past that sync. */
+	let handoffAcrossPending = false;
+	/** Captured at the start of each sync so an in-flight update keeps a stable duration. */
+	let handoffInstant = false;
+	/** Retire native controls immediately as a modal starts covering the page. */
+	let modalPresentHandoff = false;
+	let frame = 0;
+	let updates = 0;
+	let reason;
+	let listener;
+	let searchListener;
+	let waiters = [];
+	const controlEnabled = (candidate) => {
+		const kind = candidate.control.kind;
+		const key = kind === "tab-bar" ? "tabs" : kind === "segment" ? "segment" : kind === "floating-action-button" ? "fab" : void 0;
+		return !key || controlSelected(candidate.element, options, key, candidate.control.placement === "vertical-bars");
+	};
+	const id = (element) => {
+		let value = ids.get(element);
+		if (!value) {
+			value = `native-ui-${++nextId}`;
+			ids.set(element, value);
+			projectionIds.set(element, value);
+		}
+		return value;
+	};
+	const style = doc.createElement("style");
+	const hidden = `[${marker}]:not([${fadeMarker}])`;
+	style.textContent = `${hidden}, ${hidden} *, ${hidden}::before, ${hidden}::after, ${hidden}::part(native) { visibility: hidden !important; }
+    [${marker}], [${marker}] * { pointer-events: none !important; }
+    /* Ionic disables the covered page while a menu is open. VerticalBars rail
+       controls remain outside that page; zero specificity preserves any
+       pointer-events rule supplied by the application itself. */
+    :where(.menu-content-open) :where([${verticalBarsMarker}]) {
+      pointer-events: auto;
+    }
+    :where(.menu-content-open) :where([${verticalBarsMarker}]) > :where(:not([${verticalBarsMemberMarker}])) {
+      pointer-events: none;
+    }`;
+	const restore = (element) => {
+		lastSnapshot = "";
+		search.release(element);
+		element.removeAttribute(marker);
+		if (!stopped) crossfade.play(element, false, handoffInstant || isVerticalBarsSource(element) && !element.matches("ion-tab-bar"));
+		if (element.getAttribute("aria-hidden") === "true") {
+			const previous = sources.get(element);
+			if (previous == null) element.removeAttribute("aria-hidden");
+			else element.setAttribute("aria-hidden", previous);
+		}
+		sources.delete(element);
+		element.dispatchEvent(new CustomEvent("nativeUIChange"));
+	};
+	const restoreAll = () => {
+		Array.from(sources.keys()).forEach(restore);
+		verticalBarsOwners.forEach((element) => element.removeAttribute(verticalBarsMarker));
+		verticalBarsOwners.clear();
+		verticalBarsMembers.forEach((element) => element.removeAttribute(verticalBarsMemberMarker));
+		verticalBarsMembers.clear();
+	};
+	const finishWaiters = () => {
+		const current = waiters;
+		waiters = [];
+		current.forEach((resolve) => resolve());
+	};
+	const schedule = () => {
+		if (stopped) return;
+		dirty = true;
+		if (!pending && !frame) frame = win.requestAnimationFrame(() => void sync());
+	};
+	const search = createSearchSupport(doc, id, schedule);
+	const candidateSources = (candidate) => candidate.sources ?? [candidate.element];
+	const setRejected = (element, value) => {
+		element.classList.toggle(rejectedClass, value);
+	};
+	const measuringPointerPages = /* @__PURE__ */ new WeakSet();
+	const readEnabledCandidate = (element) => {
+		if (options.root && !options.root.contains(element)) return;
+		if (element.matches("ion-back-button") && element.closest("ion-app.ios-theme-vertical-bars") && !isVerticalBarsCandidate(element)) return;
+		if (extensions.some((extension) => element.matches(extension.selector))) {
+			const extension = extensions.find((definition) => element.matches(definition.selector));
+			const unavailable = options.unavailableExtensions?.get(extension.name);
+			if (unavailable) {
+				diagnose(`${extension.name}: ${unavailable}`, element);
+				return;
+			}
+			return readExtension(element, extensions, id, (reason) => diagnose(`${extension.name}: ${reason}`, element));
+		}
+		if (options.source === "extensions") return;
+		if (options.source === "html" || element.matches("[data-native-ui=\"button\"], [data-native-ui=\"back-button\"]")) {
+			const candidate = readHTMLControl(element, id, options);
+			if (!candidate) {
+				diagnose("unsupported-control: check the source visibility, accessible name, disabled ancestors, and supported HTML markup.", element);
+				return;
+			}
+			if (candidate.control.placement === "vertical-bars" && !nativeVerticalBars()) return;
+			return candidate;
+		}
+		if (element.querySelector("[data-native-ui=\"button\"], [data-native-ui=\"back-button\"]")) return;
+		if (options.ionic?.auto === false) return;
+		if (options.verticalBars?.enabled === false && isVerticalBarsCandidate(element)) return;
+		const pointerPage = isVerticalBarsCandidate(element) ? element.closest(".ion-page") : void 0;
+		let candidate;
+		if (pointerPage && getComputedStyle(pointerPage).pointerEvents === "none") {
+			const previous = pointerPage.style.getPropertyValue("pointer-events");
+			const priority = pointerPage.style.getPropertyPriority("pointer-events");
+			const hadStyle = pointerPage.hasAttribute("style");
+			measuringPointerPages.add(pointerPage);
+			pointerPage.style.setProperty("pointer-events", "auto", "important");
+			try {
+				candidate = readCandidate(element, id, options);
+			} finally {
+				if (previous) pointerPage.style.setProperty("pointer-events", previous, priority);
+				else pointerPage.style.removeProperty("pointer-events");
+				if (!hadStyle && !pointerPage.style.length) pointerPage.removeAttribute("style");
+				win.setTimeout(() => measuringPointerPages.delete(pointerPage), 0);
+			}
+		} else candidate = readCandidate(element, id, options);
+		if (candidate && isVerticalBarsCandidate(element) && !element.closest("[data-native-ui-placement=\"element\"]")) {
+			if (!nativeVerticalBars()) return void 0;
+			candidate.control.placement = "vertical-bars";
+			if ([
+				"button",
+				"button-group",
+				"menu-button"
+			].includes(candidate.control.kind)) {
+				const slot = (element.matches("ion-buttons") ? element : element.closest("ion-buttons") ?? element).getAttribute("slot");
+				if (slot === "start" || slot === "end") candidate.control.toolbarSlot = slot;
+			}
+		}
+		if (!candidate) diagnose("unsupported-control: check the supported Ionic markup, fixed placement, and styling requirements.", element);
+		return candidate && controlEnabled(candidate) ? candidate : void 0;
+	};
+	const flush = async () => {
+		if (stopped) return;
+		schedule();
+		try {
+			await bounded(new Promise((resolve) => waiters.push(resolve)));
+		} catch (error) {
+			await fail(error);
+		}
+	};
+	const blocked = (element) => verticalBarsPages.isDeparted(element) || !isVerticalBarsSource(element) && (Array.from(suspended).some((scopes) => scopes.some((scope) => scope.contains(element))) || Array.from(pages).some((scope) => scope.contains(element)) || Array.from(moving.keys()).some((surface) => surface.contains(element)));
+	const painted = () => new Promise((resolve) => win.requestAnimationFrame(() => win.requestAnimationFrame(() => resolve())));
+	const overlayOpen = (includeMenu = true, allowModal = false, ignoredSelector) => {
+		const modal = topModal(doc);
+		const ignored = (element) => !!ignoredSelector && element.matches(ignoredSelector) && !railPopovers.has(element) || allowModal && !!modal && modalUsesVerticalBars(modal) && element.matches("ion-modal");
+		for (const element of presented) if (!element.isConnected) presented.delete(element);
+		const presentedOverlayOpen = Array.from(presented).some((element) => !ignored(element) && (includeMenu || !element.matches("ion-menu")));
+		return manualSuspensions.size > 0 || presentedOverlayOpen || Array.from(doc.querySelectorAll(overlays)).some((element) => !ignored(element) && (includeMenu || !element.matches("ion-menu")) && (element.presented || element.classList.contains("show-menu")));
+	};
+	const signature = (candidate) => JSON.stringify({
+		control: candidate.control,
+		icons: candidate.icons.map(({ source }) => source),
+		assets: candidate.assets?.signature
+	});
+	const read = () => {
+		search.keepSearchTabsVisible();
+		for (const page of pages) if (!page.isConnected) pages.delete(page);
+		for (const surface of moving.keys()) if (!surface.isConnected) moving.delete(surface);
+		if (doc.hidden || overlayOpen(false, true, railPreservingOverlays)) return [];
+		if (win.visualViewport && (win.visualViewport.scale !== 1 || win.visualViewport.offsetTop !== 0) && !search.hasActive()) return [];
+		const overlayVisible = overlayOpen();
+		const measurableSources = /* @__PURE__ */ new Set([...sources.keys(), ...Array.from(scope.querySelectorAll(`[${marker}], [data-native-ui-web-source]`)).filter(isVerticalBarsSource)]);
+		const candidates = unprojected(measurableSources, () => search.decorate(Array.from(scope.querySelectorAll(discovery)).filter((element) => inVerticalBarsSurface(element) && !verticalBarsPages.isDeparted(element) && (!blocked(element) || overlayVisible && isVerticalBarsSource(element))).map(readEnabledCandidate).filter((candidate) => !!candidate), blocked).filter((candidate) => !rejected.has(candidate.element) || rejected.get(candidate.element) !== signature(candidate)));
+		const extensionSources = candidates.filter((candidate) => candidate.control.kind === "extension");
+		const exclusive = candidates.filter((candidate) => {
+			if (extensionSources.some((owner) => owner !== candidate && owner.element.contains(candidate.element))) return false;
+			const tabBarId = candidate.control.extension?.tabBarId;
+			if (!tabBarId) return true;
+			return candidates.some((owner) => owner.control.id === tabBarId && owner.control.kind === "tab-bar" && owner.control.placement === "vertical-bars") && extensionSources.filter((source) => source.control.extension?.tabBarId === tabBarId).length === 1;
+		});
+		const back = preferredVerticalBarsBack(candidates.filter((candidate) => candidate.control.kind === "back-button" && isVerticalBarsCandidate(candidate.element)).map((candidate) => candidate.element), doc);
+		const selected = exclusive.filter((candidate) => candidate.control.kind !== "back-button" || !isVerticalBarsCandidate(candidate.element) || candidate.element === back);
+		return overlayVisible ? selected.filter((candidate) => isVerticalBarsCandidate(candidate.element)) : selected;
+	};
+	const observe = () => {
+		const wanted = /* @__PURE__ */ new Set();
+		for (const element of Array.from(scope.querySelectorAll(discovery))) {
+			wanted.add(element);
+			if (element.parentElement) wanted.add(element.parentElement);
+			if (extensions.some((extension) => element.matches(extension.selector))) for (const ancestor of projectionAncestors(element)) {
+				wanted.add(ancestor);
+				const root = ancestor.getRootNode();
+				if (root instanceof ShadowRoot) wanted.add(root);
+			}
+			const inspectShadow = (node) => {
+				if (node.shadowRoot) {
+					wanted.add(node.shadowRoot);
+					node.shadowRoot.querySelectorAll("ion-icon").forEach(inspectShadow);
+				}
+			};
+			inspectShadow(element);
+			element.querySelectorAll(shadowSelector).forEach(inspectShadow);
+		}
+		if (wanted.size === observed.size && Array.from(wanted).every((element) => observed.has(element))) return;
+		observer.disconnect();
+		resize.disconnect();
+		for (const element of observed) if (element instanceof ShadowRoot) element.removeEventListener("scroll", schedule, true);
+		observed.clear();
+		observer.observe(doc.documentElement, observation);
+		for (const element of wanted) {
+			observed.add(element);
+			if (element instanceof ShadowRoot) {
+				observer.observe(element, observation);
+				on(element, "scroll");
+			} else resize.observe(element);
+		}
+	};
+	const fail = async (error) => {
+		reason = error instanceof Error ? error.message : String(error);
+		console.warn("[Native UI] Returning to Web:", reason);
+		const destruction = handle.destroy();
+		onStop?.("failure");
+		await destruction;
+		win.dispatchEvent(new Event("nativeUIRefresh"));
+	};
+	const sync = async () => {
+		frame = 0;
+		dirty = false;
+		pending = true;
+		if (options.source !== "extensions") syncToolbarText(doc);
+		handoffInstant = tabSwitchHandoff || handoffAcrossPending || modalPresentHandoff || win.performance.now() < handoffUntil;
+		try {
+			if (retentions.size && !manualSuspensions.size) return;
+			modalPresentHandoff = false;
+			const size = `${win.innerWidth}:${win.innerHeight}`;
+			if (viewport !== size) {
+				viewport = size;
+				dirty = true;
+				return;
+			}
+			observe();
+			let candidates = read();
+			const signatures = new Map(candidates.map((candidate) => [candidate.element, signature(candidate)]));
+			const failedAssets = /* @__PURE__ */ new Set();
+			for (const candidate of candidates) {
+				try {
+					await candidate.assets?.render(icons);
+				} catch {
+					failedAssets.add(candidate);
+					diagnose("invalid-assets: image conversion or serialized extension props failed.", candidate.element);
+				}
+				for (const icon of candidate.icons) {
+					const field = icon.field ?? "icon";
+					icon.item[field] = await icons.render(icon.source, field === "icon" ? icon.item.iconWidth : icon.item.closeIconWidth, field === "icon" ? icon.item.iconHeight : icon.item.closeIconHeight);
+				}
+			}
+			candidates = candidates.filter((candidate) => !failedAssets.has(candidate));
+			if (stopped || dirty || retentions.size && !manualSuspensions.size) return;
+			const retained = new Set(candidates.flatMap(candidateSources));
+			const removed = Array.from(sources.keys()).filter((element) => !retained.has(element));
+			if (removed.some(isVerticalBarsSource)) {
+				actions.forEach(forgetVerticalBarFrame);
+				try {
+					const geometry = await bounded(plugin.getVerticalBarsGeometry({
+						viewportWidth: win.innerWidth,
+						ids: [
+							...actions.keys(),
+							"BackButton",
+							"__tabBar"
+						]
+					}));
+					if (stopped || dirty || retentions.size && !manualSuspensions.size) return;
+					if (geometry.revision === acceptedRevision && size === `${win.innerWidth}:${win.innerHeight}`) {
+						for (const tabBar of removed.filter((element) => element.matches("ion-tab-bar"))) {
+							tabGeometry.get(tabBar)?.();
+							tabGeometry.delete(tabBar);
+							const items = new Map([...actions].filter(([id, element]) => element.parentElement === tabBar && geometry.items[id] && validVerticalBarFrame(geometry.items[id])).map(([id, element]) => [element, geometry.items[id]]));
+							if (geometry.items["__tabBar"] && validVerticalBarFrame(geometry.items["__tabBar"]) && items.size === tabBar.querySelectorAll("ion-tab-button").length) tabGeometry.set(tabBar, alignVerticalTabBar(tabBar, geometry.items["__tabBar"], items));
+						}
+						for (const [id, element] of actions) {
+							const frame = geometry.items[element.matches("ion-back-button") ? "BackButton" : id];
+							if (frame) rememberVerticalBarFrame(element, frame);
+						}
+					}
+				} catch {}
+			}
+			if (removed.length) {
+				removed.forEach(restore);
+				if (removed.some(isVerticalBarsSource)) win.dispatchEvent(new CustomEvent("nativeUIVerticalBarsRelease", { detail: { instant: handoffInstant } }));
+				if (!handoffInstant) {
+					await painted();
+					if (stopped || dirty) return;
+				}
+			}
+			const root = doc.querySelector("ion-app.ios-theme-vertical-bars");
+			const verticalBarEdge = options.nativeState?.edge ? options.nativeState.edge : options.rail ? options.rail.edge : root ? root.classList.contains("ios-theme-vertical-bars-left") ? "left" : "right" : void 0;
+			const modal = topModal(doc);
+			const data = {
+				verticalBarFrame: modal && modalUsesVerticalBars(modal) ? modalVerticalBarFrame(modal) : void 0,
+				viewportWidth: win.innerWidth,
+				verticalBarEdge,
+				controls: candidates.map((candidate) => candidate.control)
+			};
+			const serialized = JSON.stringify(data);
+			if (serialized === lastSnapshot && !forceRefresh) return;
+			const snapshot = {
+				...data,
+				revision: ++revision,
+				transitionDuration: crossfade.duration(handoffInstant)
+			};
+			forceRefresh = false;
+			updates++;
+			updatingRevision = snapshot.revision;
+			const result = await bounded(plugin.update(snapshot));
+			if (stopped || retentions.size && !manualSuspensions.size) return;
+			if (result.revision !== snapshot.revision) throw new Error("Native UI revision mismatch");
+			if (`${win.innerWidth}:${win.innerHeight}` !== size) {
+				lastSnapshot = "";
+				dirty = true;
+				return;
+			}
+			if (result.rejectedSearches?.length) {
+				search.reject(result.rejectedSearches);
+				lastSnapshot = "";
+				dirty = true;
+			}
+			for (const candidate of candidates) if (result.rejectedControls?.includes(candidate.control.id)) {
+				diagnose("native-rejected: the native renderer rejected this source; check decoded props, placement, and device support.", candidate.element);
+				rejected.set(candidate.element, signatures.get(candidate.element));
+				setRejected(candidate.element, true);
+				dirty = true;
+			}
+			const currentCandidates = dirty ? read() : candidates;
+			const current = dirty ? new Map(currentCandidates.map((candidate) => [candidate.element, signature(candidate)])) : signatures;
+			const currentSources = new Set(currentCandidates.flatMap(candidateSources));
+			const accepted = candidates.filter((candidate) => current.get(candidate.element) === signatures.get(candidate.element));
+			accepted.forEach((candidate) => setRejected(candidate.element, false));
+			const acceptedVerticalBarsOwners = new Set(accepted.filter((candidate) => candidate.control.placement === "vertical-bars").map((candidate) => candidate.element));
+			const acceptedVerticalBarsMembers = new Set(accepted.filter((candidate) => candidate.control.placement === "vertical-bars").flatMap((candidate) => Array.from(candidate.actions.values())));
+			const invalidated = candidates.length !== accepted.length;
+			acceptedRevision = result.revision;
+			lastSnapshot = invalidated ? "" : serialized;
+			actions = new Map(candidates.filter((candidate) => current.has(candidate.element)).flatMap((candidate) => Array.from(candidate.actions)));
+			for (const element of sources.keys()) if (!currentSources.has(element)) restore(element);
+			for (const element of verticalBarsOwners) {
+				if (acceptedVerticalBarsOwners.has(element)) continue;
+				element.removeAttribute(verticalBarsMarker);
+				verticalBarsOwners.delete(element);
+			}
+			if (acceptedVerticalBarsOwners.size) win.dispatchEvent(new CustomEvent("nativeUIVerticalBarsAcquire", { detail: { instant: handoffInstant } }));
+			for (const element of acceptedVerticalBarsOwners) {
+				element.setAttribute(verticalBarsMarker, "");
+				verticalBarsOwners.add(element);
+			}
+			for (const element of verticalBarsMembers) {
+				if (acceptedVerticalBarsMembers.has(element)) continue;
+				element.removeAttribute(verticalBarsMemberMarker);
+				verticalBarsMembers.delete(element);
+			}
+			for (const element of acceptedVerticalBarsMembers) {
+				element.setAttribute(verticalBarsMemberMarker, "");
+				verticalBarsMembers.add(element);
+			}
+			for (const element of accepted.flatMap(candidateSources)) {
+				const newlyProjected = !sources.has(element) || !element.hasAttribute("data-native-ui-projected");
+				if (!sources.has(element)) {
+					sources.set(element, element.getAttribute("aria-hidden"));
+					crossfade.play(element, true, handoffInstant || isVerticalBarsSource(element) && !element.matches("ion-tab-bar"));
+				}
+				element.setAttribute(marker, "");
+				element.setAttribute("aria-hidden", "true");
+				if (newlyProjected) element.dispatchEvent(new CustomEvent("nativeUIChange"));
+			}
+			const received = pendingActivations;
+			pendingActivations = [];
+			received.forEach(activate);
+			await crossfade.settled();
+			for (const [tabBar, restore] of tabGeometry) if (!tabBar.isConnected || acceptedVerticalBarsOwners.has(tabBar)) {
+				restore();
+				tabGeometry.delete(tabBar);
+			}
+			if (invalidated) {
+				dirty = true;
+				await painted();
+			}
+		} catch (error) {
+			await fail(error);
+		} finally {
+			updatingRevision = void 0;
+			pendingActivations = [];
+			if (forceRefresh) rejected = /* @__PURE__ */ new WeakMap();
+			if (!stopped && (handoffAcrossPending || handoffInstant && dirty)) handoffUntil = Math.max(handoffUntil, win.performance.now() + 400);
+			handoffAcrossPending = false;
+			pending = false;
+			if (dirty && !stopped) schedule();
+			else finishWaiters();
+		}
+	};
+	const observation = {
+		subtree: true,
+		childList: true,
+		characterData: true,
+		attributes: true,
+		attributeOldValue: true
+	};
+	const observer = new MutationObserver((records) => {
+		if (records.some((record) => record.attributeName !== "data-native-ui-projected" && record.attributeName !== "data-native-ui-web-source" && record.attributeName !== "data-native-ui-toolbar-text" && record.attributeName !== "data-native-ui-fading" && !prehideOnlyMutation(record) && !(record.attributeName === "style" && measuringPointerPages.has(record.target)) && !(record.attributeName === "aria-hidden" && sources.has(record.target) && record.target.getAttribute("aria-hidden") === "true"))) schedule();
+	});
+	const resize = new ResizeObserver(schedule);
+	const on = (target, name, callback = schedule) => target.addEventListener(name, callback, {
+		capture: true,
+		signal: listeners.signal
+	});
+	const pageWill = (event) => {
+		const page = event.target;
+		verticalBarsPages.lifecycle(event);
+		getNativeSearchBindings(doc).filter((binding) => page.contains(binding.footer)).forEach((binding) => search.retire(binding));
+		if (event.type === "ionViewWillLeave") beginTabSwitchHandoffIfNeeded(page);
+		pages.add(page);
+		schedule();
+	};
+	const pageDid = (event) => {
+		const page = event.target;
+		verticalBarsPages.lifecycle(event);
+		pages.delete(page);
+		schedule();
+		if (tabSwitchHandoff && pages.size === 0) endTabSwitchHandoff();
+	};
+	const tabOfPath = (tabs, pathname) => {
+		let best;
+		for (const button of Array.from(tabs.querySelectorAll("ion-tab-button"))) {
+			const tab = button.getAttribute("tab");
+			const href = button.getAttribute("href")?.split(/[?#]/)[0];
+			if (!tab || !href) continue;
+			if (pathname === href || pathname.startsWith(`${href}/`)) {
+				if (!best || href.length > best.length) best = {
+					tab,
+					length: href.length
+				};
+			}
+		}
+		return best?.tab;
+	};
+	const armTabSwitchHandoff = () => {
+		tabSwitchHandoff = true;
+		handoffUntil = Math.max(handoffUntil, win.performance.now() + 400);
+		if (pending) handoffAcrossPending = true;
+	};
+	const beginTabSwitchHandoffIfNeeded = (page) => {
+		const tabs = page.closest("ion-tabs");
+		if (!tabs) return;
+		const bar = tabs.querySelector("ion-tab-bar");
+		const selected = (bar && "selectedTab" in bar ? String(bar.selectedTab ?? "") : "") || tabs.querySelector("ion-tab-button.tab-selected")?.getAttribute("tab") || void 0;
+		const destination = tabOfPath(tabs, win.location.pathname);
+		if (selected && destination && selected !== destination) armTabSwitchHandoff();
+	};
+	const endTabSwitchHandoff = () => {
+		win.requestAnimationFrame(() => {
+			if (stopped || !tabSwitchHandoff) return;
+			tabSwitchHandoff = false;
+			schedule();
+		});
+	};
+	const motion = (event) => {
+		const target = event.target;
+		if (!target.matches?.(`${motionSelector}, ${discovery}`) && !(options.source !== "ionic" && target.querySelector?.(discovery))) return;
+		const key = event.propertyName ?? event.animationName;
+		if (event.type === CSS_MOTION_EVENTS.transitionRun || event.type === CSS_MOTION_EVENTS.animationStart) {
+			const keys = moving.get(target) ?? /* @__PURE__ */ new Set();
+			keys.add(key);
+			moving.set(target, keys);
+		} else {
+			moving.get(target)?.delete(key);
+			if (!moving.get(target)?.size) moving.delete(target);
+		}
+		schedule();
+	};
+	for (const name of Object.values(CSS_MOTION_EVENTS)) on(doc, name, motion);
+	for (const name of [LIFECYCLE_WILL_ENTER, LIFECYCLE_WILL_LEAVE]) on(doc, name, pageWill);
+	for (const name of [LIFECYCLE_DID_ENTER, LIFECYCLE_DID_LEAVE]) on(doc, name, pageDid);
+	on(doc, VERTICAL_BARS_TRANSITION_CANCELED, (event) => {
+		const leaving = event.target;
+		const entering = event.detail?.entering;
+		verticalBarsPages.cancel(entering, leaving);
+		pages.delete(leaving);
+		if (entering) pages.delete(entering);
+		schedule();
+	});
+	on(doc, "ionTabsWillChange", () => {
+		armTabSwitchHandoff();
+		schedule();
+	});
+	on(doc, "ionTabsDidChange", endTabSwitchHandoff);
+	const overlayPresenting = (element) => {
+		presented.add(element);
+		if (element.matches("ion-popover")) {
+			const trigger = popoverTrigger(element);
+			if (trigger?.matches("ion-button") && isVerticalBarsSource(trigger)) railPopovers.add(element);
+			else railPopovers.delete(element);
+		}
+		if (element.matches("ion-modal")) {
+			modalPresentHandoff = true;
+			if (pending) handoffInstant = true;
+		}
+		schedule();
+	};
+	on(doc, "nativeUIOverlayAdopted", (event) => overlayPresenting(event.detail));
+	for (const name of overlayNames) {
+		on(doc, `ion${name}WillPresent`, (event) => overlayPresenting(event.target));
+		on(doc, `ion${name}DidDismiss`, (event) => {
+			presented.delete(event.target);
+			railPopovers.delete(event.target);
+			schedule();
+		});
+	}
+	const eventMenu = (event) => event.composedPath().find((target) => target instanceof HTMLElement && target.matches("ion-menu"));
+	on(doc, "ionWillOpen", (event) => {
+		const menu = eventMenu(event);
+		if (menu) presented.add(menu);
+		schedule();
+	});
+	on(doc, "ionDidClose", (event) => {
+		const menu = eventMenu(event);
+		if (menu) presented.delete(menu);
+		schedule();
+	});
+	for (const name of [
+		"ionChange",
+		"ionSelect",
+		"ionImgDidLoad",
+		CSS_MOTION_EVENTS.transitionEnd,
+		CSS_MOTION_EVENTS.animationEnd,
+		"focusin",
+		"focusout"
+	]) on(doc, name);
+	const refreshLayout = () => {
+		rejected = /* @__PURE__ */ new WeakMap();
+		forceRefresh = true;
+		schedule();
+	};
+	on(doc, "visibilitychange", () => {
+		if (doc.hidden) {
+			getNativeSearchBindings(doc).forEach((binding) => search.retire(binding));
+			schedule();
+		} else refreshLayout();
+	});
+	on(win, "resize", refreshLayout);
+	on(win, "keyboardWillShow", () => search.keyboard(true));
+	on(win, "keyboardWillHide", () => search.keyboard(false));
+	on(win, "scroll");
+	on(win.matchMedia("(prefers-color-scheme: dark)"), "change");
+	on(win, "nativeUIRefresh", (event) => {
+		if (event.retireSearch) getNativeSearchBindings(doc).forEach((binding) => search.retire(binding));
+		refreshLayout();
+	});
+	if (win.visualViewport) {
+		on(win.visualViewport, "resize", refreshLayout);
+		on(win.visualViewport, "scroll");
+	}
+	const handle = {
+		retain(deferActivation) {
+			const retention = { accepts: deferActivation };
+			retentions.add(retention);
+			return () => {
+				if (!retentions.delete(retention)) return;
+				const activation = retention.activation;
+				if (activation && retention.accepts?.(activation.id)) win.queueMicrotask(() => activate(activation));
+				schedule();
+			};
+		},
+		markForCheck: schedule,
+		getStatus: () => ({
+			state: stopped ? "stopped" : sources.size ? "native" : "web",
+			projected: sources.size,
+			updates,
+			reason
+		}),
+		async suspend() {
+			const token = Symbol();
+			let resumed = false;
+			if (!stopped) {
+				manualSuspensions.add(token);
+				getNativeSearchBindings(doc).forEach((binding) => search.retire(binding));
+				await flush();
+			}
+			return { async resume() {
+				if (resumed) return;
+				resumed = true;
+				if (stopped || !manualSuspensions.delete(token)) return;
+				await flush();
+			} };
+		},
+		destroy() {
+			if (destruction) return destruction;
+			stopped = true;
+			destruction = Promise.resolve().then(async () => {
+				tabGeometry.forEach((restore) => restore());
+				tabGeometry.clear();
+				setNativeUIIntegration(doc);
+				win.cancelAnimationFrame(frame);
+				listeners.abort();
+				observer.disconnect();
+				resize.disconnect();
+				observed.clear();
+				actions.clear();
+				pendingActivations = [];
+				search.destroy();
+				crossfade.destroy();
+				restoreAll();
+				if (!doc.hidden) await painted();
+				try {
+					await bounded(plugin.clear({ revision: ++revision }));
+				} catch {}
+				style.remove();
+				doc.querySelectorAll(`.${rejectedClass}`).forEach((element) => setRejected(element, false));
+				icons.clear();
+				pages.clear();
+				presented.clear();
+				manualSuspensions.clear();
+				moving.clear();
+				suspended.clear();
+				if (listener) await bounded(listener.remove()).catch(() => {});
+				if (searchListener) await bounded(searchListener.remove()).catch(() => {});
+				finishWaiters();
+			});
+			return destruction;
+		}
+	};
+	const activate = (event) => {
+		const accepted = dispatchActivation(event);
+		if (event.requestId && accepted !== void 0) bounded(plugin.completeExtensionAction({
+			requestId: event.requestId,
+			accepted
+		})).catch(() => {});
+	};
+	const dispatchActivation = (event) => {
+		if (stopped || doc.hidden || event.revision < acceptedRevision || event.revision > revision || event.sequence <= lastSequence) return false;
+		const element = actions.get(event.id);
+		const owner = element && Array.from(sources.keys()).find((source) => source === element || source.contains(element));
+		const ignored = owner && isVerticalBarsSource(owner) ? retentions.size ? "ion-toast, ion-picker" : railPreservingOverlays : void 0;
+		if (overlayOpen(false, true, ignored)) {
+			if (!manualSuspensions.size) {
+				for (const retention of retentions) if (retention.accepts?.(event.id) && (!retention.activation || event.sequence > retention.activation.sequence)) retention.activation = event;
+			}
+			return false;
+		}
+		if (event.revision > acceptedRevision && event.revision === updatingRevision) {
+			pendingActivations.push(event);
+			return;
+		}
+		lastSequence = event.sequence;
+		if (!element) return false;
+		if (!owner || !inVerticalBarsSurface(owner)) return false;
+		const candidate = !blocked(owner) && unprojected(sources.keys(), () => readEnabledCandidate(owner)) || read().find((candidate) => candidate.actions.has(event.id));
+		const item = candidate?.control.items.find((item) => item.id === event.id);
+		const searchAction = candidate?.control.search && [candidate.control.search.trigger.id, candidate.control.search.closeId].includes(event.id);
+		if (!(candidate?.control.kind === "extension" && candidate.actions.get(event.id) === element) && !searchAction && (!item || item.disabled || item.visible === false)) return false;
+		activateProjectedElement(element);
+		lastSnapshot = "";
+		schedule();
+		return true;
+	};
+	try {
+		listener = await boundedListener(plugin.addListener("activate", activate));
+		searchListener = await boundedListener(plugin.addListener("search", (event) => {
+			if (stopped || doc.hidden || event.revision < acceptedRevision || event.revision > revision || overlayOpen(true, false, nativeVerticalBars() ? retentions.size ? "ion-toast, ion-picker" : railPreservingOverlays : void 0)) return;
+			search.event(event);
+		}));
+		doc.head.append(style);
+		observer.observe(doc.documentElement, observation);
+		setNativeUIIntegration(doc, {
+			async search(binding, active, focus) {
+				if (!getNativeSearchBindings(doc).includes(binding) || !search.projected(binding)) return false;
+				if (!active) search.setStatus(binding, false);
+				else {
+					const entering = !binding.active;
+					if (entering) search.begin(binding, revision + 1);
+					const nextFocused = focus === true ? true : focus === false ? false : entering ? false : binding.focused;
+					search.setStatus(binding, true, nextFocused);
+				}
+				await flush();
+				return !stopped && search.projected(binding);
+			},
+			async suspend(scopes) {
+				getNativeSearchBindings(doc).filter((binding) => scopes.some((scope) => scope.contains(binding.footer) || scope.contains(binding.tabBar))).forEach((binding) => search.retire(binding));
+				suspended.add(scopes);
+				await flush();
+				await new Promise((resolve) => win.requestAnimationFrame(() => resolve()));
+				return (canceled = false) => {
+					suspended.delete(scopes);
+					if (canceled || !scopes.some((scope) => scope.closest("ion-app.ios-theme-vertical-bars"))) {
+						scopes.forEach((scope) => pages.delete(scope));
+						if (canceled) verticalBarsPages.cancel(scopes[0], scopes[1]);
+					}
+					schedule();
+				};
+			}
+		});
+		on(win, "pagehide", () => {
+			handle.destroy();
+			onStop?.("pagehide");
+		});
+		schedule();
+	} catch (error) {
+		await fail(error);
+	}
+	return handle;
+};
+//#endregion
+export { createRuntime };
+
+//# sourceMappingURL=runtime.js.map