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

package/dist/native/vertical-bars-web.js

@@ -0,0 +1,422 @@
+import { controlSelected } from "./shared/control-options.js";
+import { inVerticalBarsSurface, topModal } from "./shared/modal.js";
+import { createCrossfade } from "./shared/crossfade.js";
+import { activateProjectedElement, createVerticalBarsPageState, isExcluded, isNativeUIDisabled, isVerticalBarsToolbarGroup, marker, preferredVerticalBarsBack, prehiddenClass, prehideOnlyMutation, syncToolbarText, unprojected, verticalBarsActionCandidate, verticalBarsBackCandidate, verticalBarsEnteringPage, verticalBarsOwned, verticalBarsToolbarActions, withoutPrehide } from "./shared/dom.js";
+import { VERTICAL_BARS_TRANSITION_CANCELED } from "../native-integration/index.js";
+import { alignVerticalBarClone, verticalBarFrame } from "./shared/vertical-bars-geometry.js";
+import { createVerticalBarsWebSearch, searchProjectionClass } from "./vertical-bars-web-search.js";
+//#region src/native/vertical-bars-web.ts
+const backProjectionClass = "ios-theme-vertical-bars-back-button-projection";
+const toolbarProjectionClass = "ios-theme-vertical-bars-toolbar-projection";
+const readyClass = "ios-theme-vertical-bars-toolbar-ready";
+const toolbarControlSize = 46;
+const toolbarControlGap = 10;
+const createVerticalBarsWebProjection = (doc, options, enabled = () => true) => {
+	const win = doc.defaultView;
+	const crossfade = createCrossfade(win);
+	let incomingInstant;
+	const toolbarEnabled = options.ionic?.auto !== false;
+	let root;
+	let backSource;
+	let backProjection;
+	let previousBackAriaHidden = null;
+	let toolbarProjections = [];
+	let suspended = 0;
+	let stopped = false;
+	let frame = 0;
+	let updates = 0;
+	let observingVerticalBars = false;
+	const verticalBarsPages = createVerticalBarsPageState();
+	let sourceObserver;
+	let waiters = [];
+	const listeners = new AbortController();
+	const verticalBarsRoot = () => doc.querySelector("ion-app.ios-theme-vertical-bars");
+	const projectedSources = () => [
+		backSource,
+		search.source,
+		...toolbarProjections.flatMap(({ actions }) => actions.map(({ source }) => source))
+	].filter((source) => !!source);
+	const isRendered = (element) => withoutPrehide(element, () => {
+		const style = getComputedStyle(element);
+		const rect = element.getBoundingClientRect();
+		return element.isConnected && style.display !== "none" && style.visibility === "visible" && rect.width > 0 && rect.height > 0;
+	});
+	const search = createVerticalBarsWebSearch(doc, (element) => options.ionic?.auto !== false && controlSelected(element, options, "tabs", true) && !!verticalBarsRoot()?.contains(element) && (!options.root || options.root.contains(element)) && !element.closest("[data-native-ui-placement=\"element\"]") && inVerticalBarsSurface(element) && !isExcluded(element, verticalBarsEnteringPage(element)) && !isNativeUIDisabled(element) && !verticalBarsPages.isDeparted(element) && isRendered(element), () => {
+		schedule();
+	});
+	const inEligibleToolbar = (element) => !!verticalBarsRoot()?.contains(element) && (!options.root || options.root.contains(element)) && !element.closest("[data-native-ui-placement=\"element\"]") && inVerticalBarsSurface(element) && verticalBarsActionCandidate(element) && !isExcluded(element, verticalBarsEnteringPage(element)) && !verticalBarsPages.isDeparted(element);
+	const isEligibleBack = (element) => !!verticalBarsRoot()?.contains(element) && (!options.root || options.root.contains(element)) && !element.closest("[data-native-ui-placement=\"element\"]") && inVerticalBarsSurface(element) && verticalBarsOwned(element) && verticalBarsBackCandidate(element) && !isExcluded(element, verticalBarsEnteringPage(element)) && !verticalBarsPages.isDeparted(element) && unprojected(projectedSources(), () => isRendered(element));
+	const pageOrder = (element) => Array.from(doc.querySelectorAll(".ion-page")).indexOf(element.closest(".ion-page"));
+	const findBack = () => {
+		const candidates = Array.from(doc.querySelectorAll(`ion-back-button:not(.${backProjectionClass})`)).filter(isEligibleBack);
+		return preferredVerticalBarsBack(candidates, doc);
+	};
+	const findToolbarGroups = () => {
+		const candidates = Array.from(doc.querySelectorAll(`ion-buttons:not(.${toolbarProjectionClass})`)).flatMap((group) => {
+			const actions = verticalBarsToolbarActions(group).filter((action) => unprojected(projectedSources(), () => isRendered(action)));
+			if (!actions.length) return [];
+			if (!isVerticalBarsToolbarGroup(group)) return actions.filter(inEligibleToolbar).map((action) => ({
+				group,
+				actions: [action]
+			}));
+			return inEligibleToolbar(group) && unprojected(projectedSources(), () => isRendered(group)) ? [{
+				group,
+				actions
+			}] : [];
+		});
+		for (const action of Array.from(doc.querySelectorAll("ion-button, ion-menu-button"))) {
+			if (action.closest("ion-buttons") || !verticalBarsOwned(action) || !inEligibleToolbar(action)) continue;
+			if (unprojected(projectedSources(), () => isRendered(action))) candidates.push({
+				group: action,
+				actions: [action]
+			});
+		}
+		const highestPage = Math.max(...candidates.map(({ group }) => pageOrder(group)));
+		return candidates.filter(({ group }) => pageOrder(group) === highestPage);
+	};
+	const isCurrentToolbarAction = (source) => findToolbarGroups().some(({ actions }) => actions.includes(source));
+	const restore = (retire) => {
+		search.restore(retire);
+		if (backProjection) {
+			if (retire) retire(backProjection);
+			else backProjection.remove();
+		}
+		backProjection = void 0;
+		if (backSource) {
+			backSource.removeAttribute(marker);
+			if (previousBackAriaHidden === null) backSource.removeAttribute("aria-hidden");
+			else backSource.setAttribute("aria-hidden", previousBackAriaHidden);
+			backSource.dispatchEvent(new CustomEvent("nativeUIChange"));
+		}
+		backSource = void 0;
+		previousBackAriaHidden = null;
+		for (const { projection, actions } of toolbarProjections) {
+			if (retire) retire(projection);
+			else projection.remove();
+			for (const { source, previousAriaHidden } of actions) {
+				source.removeAttribute(marker);
+				if (previousAriaHidden === null) source.removeAttribute("aria-hidden");
+				else source.setAttribute("aria-hidden", previousAriaHidden);
+				source.dispatchEvent(new CustomEvent("nativeUIChange"));
+			}
+		}
+		toolbarProjections = [];
+		sourceObserver?.disconnect();
+		sourceObserver = void 0;
+		root?.classList.remove(readyClass);
+		root = void 0;
+	};
+	const copyAttributes = (target, original) => {
+		for (const name of [
+			"id",
+			"slot",
+			marker,
+			"aria-hidden"
+		]) target.removeAttribute(name);
+		for (const attribute of Array.from(target.attributes)) if (![
+			"class",
+			"data-native-ui-projected",
+			"data-native-ui-fading"
+		].includes(attribute.name) && !original.hasAttribute(attribute.name)) target.removeAttribute(attribute.name);
+		for (const attribute of Array.from(original.attributes)) if (![
+			"id",
+			"slot",
+			"data-native-ui-projected",
+			"aria-hidden"
+		].includes(attribute.name)) target.setAttribute(attribute.name, attribute.value);
+		target.classList.remove(prehiddenClass);
+	};
+	const syncBack = (target, original) => {
+		copyAttributes(target, original);
+		target.classList.add(backProjectionClass, "ion-cloned-element");
+		target.disabled = original.disabled;
+		target.defaultHref = original.defaultHref;
+		target.icon = original.icon;
+		target.color = original.color;
+		target.mode = original.mode;
+		target.text = "";
+		if (root) alignVerticalBarClone(target, original, root);
+	};
+	const syncAction = (target, original) => {
+		copyAttributes(target, original);
+		target.classList.add("ios-theme-vertical-bars-toolbar-action", "ion-cloned-element");
+		const label = original.getAttribute("aria-label") ?? original.shadowRoot?.querySelector("[part~=native]")?.getAttribute("aria-label") ?? original.textContent?.trim();
+		if (label) target.setAttribute("aria-label", label);
+		if ("disabled" in original) target.disabled = original.disabled;
+		if (original.matches("ion-button")) {
+			const clonedIcon = original.querySelector("ion-icon, svg")?.cloneNode(true);
+			clonedIcon?.setAttribute("slot", "icon-only");
+			target.replaceChildren(...clonedIcon ? [clonedIcon] : [document.createTextNode(original.textContent?.trim() || label || "")]);
+		}
+	};
+	const sameSources = (back, groups) => back === backSource && groups.length === toolbarProjections.length && groups.every(({ group, actions }, index) => {
+		const current = toolbarProjections[index];
+		return group === current.source && actions.length === current.actions.length && actions.every((action, actionIndex) => action === current.actions[actionIndex].source);
+	});
+	const syncExisting = () => {
+		if (backSource && backProjection) syncBack(backProjection, backSource);
+		let topOffset = backSource ? 56 : 0;
+		for (const { projection, source, actions } of toolbarProjections) {
+			if (actions.length === 1 && !projection.matches("ion-buttons")) syncAction(projection, actions[0].source);
+			else copyAttributes(projection, source);
+			projection.classList.add(toolbarProjectionClass, "ion-cloned-element");
+			projection.style.setProperty("--ios-theme-vertical-bars-toolbar-offset", `${topOffset}px`);
+			if (projection.matches("ion-buttons")) actions.forEach(({ source: action, projection: clone }) => syncAction(clone, action));
+			const frames = actions.map(({ source }) => verticalBarFrame(source));
+			if (root && frames.every((frame) => !!frame)) {
+				if (actions.length === 1) alignVerticalBarClone(projection, actions[0].source, root);
+				else {
+					const left = Math.min(...frames.map((frame) => frame.x));
+					const top = Math.min(...frames.map((frame) => frame.y));
+					const right = Math.max(...frames.map((frame) => frame.x + frame.width));
+					const bottom = Math.max(...frames.map((frame) => frame.y + frame.height));
+					const origin = root.getBoundingClientRect();
+					Object.assign(projection.style, {
+						left: `${left - origin.left}px`,
+						top: `${top - origin.top}px`,
+						right: "auto",
+						bottom: "auto",
+						width: `${right - left}px`,
+						height: `${bottom - top}px`,
+						padding: "0"
+					});
+					actions.forEach(({ source, projection: clone }) => alignVerticalBarClone(clone, source, projection));
+				}
+			}
+			topOffset += actions.length * toolbarControlSize + toolbarControlGap;
+		}
+	};
+	const project = (nextBack, groups) => {
+		root = topModal(doc) ?? verticalBarsRoot();
+		let topOffset = 0;
+		if (nextBack) {
+			backSource = nextBack;
+			previousBackAriaHidden = nextBack.getAttribute("aria-hidden");
+			backProjection = nextBack.cloneNode(false);
+			syncBack(backProjection, nextBack);
+			backProjection.addEventListener("click", (event) => {
+				event.preventDefault();
+				event.stopImmediatePropagation();
+				if (backSource && backSource === findBack()) activateProjectedElement(backSource);
+			}, { capture: true });
+			root.append(backProjection);
+			nextBack.setAttribute(marker, "");
+			nextBack.setAttribute("aria-hidden", "true");
+			nextBack.dispatchEvent(new CustomEvent("nativeUIChange"));
+			topOffset = 56;
+		}
+		for (const { group, actions: sources } of groups) {
+			const projection = (sources.length === 1 ? sources[0] : group).cloneNode(false);
+			if (sources.length === 1) syncAction(projection, sources[0]);
+			else copyAttributes(projection, group);
+			projection.classList.add(toolbarProjectionClass, "ion-cloned-element");
+			projection.style.setProperty("--ios-theme-vertical-bars-toolbar-offset", `${topOffset}px`);
+			const actions = sources.map((source) => {
+				const clone = sources.length === 1 ? projection : source.cloneNode(false);
+				if (sources.length > 1) syncAction(clone, source);
+				clone.addEventListener("click", (event) => {
+					event.preventDefault();
+					event.stopImmediatePropagation();
+					if (isCurrentToolbarAction(source)) activateProjectedElement(source);
+				}, { capture: true });
+				if (sources.length > 1) projection.append(clone);
+				const previousAriaHidden = source.getAttribute("aria-hidden");
+				source.setAttribute(marker, "");
+				source.setAttribute("aria-hidden", "true");
+				source.dispatchEvent(new CustomEvent("nativeUIChange"));
+				return {
+					source,
+					projection: clone,
+					previousAriaHidden
+				};
+			});
+			root.append(projection);
+			toolbarProjections.push({
+				source: group,
+				projection,
+				actions
+			});
+			topOffset += actions.length * toolbarControlSize + toolbarControlGap;
+		}
+		syncExisting();
+		if (nextBack || toolbarProjections.length) root.classList.add(readyClass);
+		sourceObserver = new MutationObserver((records) => {
+			if (records.some((record) => record.type !== "attributes" || !["data-native-ui-projected", "aria-hidden"].includes(record.attributeName ?? "") && !prehideOnlyMutation(record))) schedule();
+		});
+		if (nextBack?.shadowRoot) sourceObserver.observe(nextBack.shadowRoot, {
+			subtree: true,
+			childList: true,
+			attributes: true,
+			attributeOldValue: true
+		});
+		for (const { group } of groups) sourceObserver.observe(group, {
+			subtree: true,
+			childList: true,
+			attributes: true,
+			attributeOldValue: true
+		});
+	};
+	const reveal = () => {
+		if (incomingInstant === void 0) return;
+		for (const surface of [
+			backProjection,
+			...toolbarProjections.map(({ projection }) => projection),
+			search.surface
+		]) if (surface) crossfade.play(surface, false, incomingInstant);
+		incomingInstant = void 0;
+	};
+	const performUpdate = () => {
+		frame = 0;
+		syncToolbarText(doc);
+		const currentRoot = verticalBarsRoot();
+		if (observingVerticalBars !== !!currentRoot) {
+			observingVerticalBars = !!currentRoot;
+			observer.disconnect();
+			observer.observe(doc.documentElement, {
+				subtree: true,
+				childList: true,
+				characterData: observingVerticalBars,
+				attributes: true,
+				attributeOldValue: true,
+				attributeFilter: observingVerticalBars ? void 0 : ["class"]
+			});
+		}
+		if (stopped || suspended || !currentRoot || !enabled()) return restore();
+		const nextBack = toolbarEnabled ? findBack() : void 0;
+		const groups = toolbarEnabled ? findToolbarGroups() : [];
+		const projectionRoot = topModal(doc) ?? currentRoot;
+		search.update(projectionRoot);
+		if (!nextBack && !groups.length && !search.source) return restore();
+		if (root === (topModal(doc) ?? currentRoot) && sameSources(nextBack, groups)) {
+			syncExisting();
+			reveal();
+			return;
+		}
+		restore();
+		project(nextBack, groups);
+		search.update(projectionRoot);
+		reveal();
+		updates++;
+	};
+	const update = () => {
+		try {
+			performUpdate();
+		} catch {
+			restore();
+		} finally {
+			const pending = waiters;
+			waiters = [];
+			pending.forEach((resolve) => resolve());
+		}
+	};
+	const schedule = () => {
+		if (stopped) return Promise.resolve();
+		if (!enabled()) restore();
+		const done = new Promise((resolve) => waiters.push(resolve));
+		if (!frame) frame = win.requestAnimationFrame(update);
+		return done;
+	};
+	const observer = new MutationObserver((records) => {
+		const insideProjection = (target) => {
+			const element = target instanceof Element ? target : target.parentNode instanceof Element ? target.parentNode : void 0;
+			const rootNode = target.getRootNode();
+			return !![element, rootNode instanceof ShadowRoot ? rootNode.host : void 0].some((candidate) => candidate?.closest(`.${backProjectionClass}, .${toolbarProjectionClass}, .${searchProjectionClass}`));
+		};
+		const verticalBarsChanged = records.some((record) => record.type === "attributes" && record.target.matches("ion-app") || record.type === "childList" && Array.from(record.addedNodes).some((node) => node instanceof Element && (node.matches("ion-app.ios-theme-vertical-bars") || !!node.querySelector("ion-app.ios-theme-vertical-bars"))));
+		if (observingVerticalBars && records.some((record) => record.attributeName !== "data-native-ui-projected" && record.attributeName !== "data-native-ui-toolbar-text" && !prehideOnlyMutation(record) && !insideProjection(record.target)) || !observingVerticalBars && verticalBarsChanged && records.some((record) => !prehideOnlyMutation(record))) schedule();
+	});
+	observer.observe(doc.documentElement, {
+		subtree: true,
+		childList: true,
+		attributes: true,
+		attributeOldValue: true,
+		attributeFilter: ["class"]
+	});
+	const pageLifecycle = (event) => {
+		const page = event.target;
+		if (!(page instanceof HTMLElement) || !page.matches(".ion-page")) return;
+		if (event.type === "iosThemeVerticalBarsTransitionCanceled") {
+			const entering = event.detail?.entering;
+			verticalBarsPages.cancel(entering, page);
+		} else verticalBarsPages.lifecycle(event);
+		if (verticalBarsRoot()) schedule();
+	};
+	for (const name of [
+		"ionViewWillEnter",
+		"ionViewWillLeave",
+		"ionViewDidEnter",
+		"ionViewDidLeave"
+	]) doc.addEventListener(name, pageLifecycle, {
+		capture: true,
+		signal: listeners.signal
+	});
+	doc.addEventListener(VERTICAL_BARS_TRANSITION_CANCELED, pageLifecycle, {
+		capture: true,
+		signal: listeners.signal
+	});
+	for (const name of ["ionModalWillPresent", "ionModalDidDismiss"]) doc.addEventListener(name, schedule, {
+		capture: true,
+		signal: listeners.signal
+	});
+	win.addEventListener("nativeUIVerticalBarsAcquire", (event) => {
+		const instant = event.detail?.instant ?? true;
+		incomingInstant = void 0;
+		restore((surface) => {
+			const box = surface.getBoundingClientRect();
+			surface.style.setProperty("position", "fixed", "important");
+			surface.style.setProperty("display", "block", "important");
+			surface.style.setProperty("left", `${box.left}px`, "important");
+			surface.style.setProperty("top", `${box.top}px`, "important");
+			surface.style.setProperty("right", "auto", "important");
+			surface.style.setProperty("bottom", "auto", "important");
+			surface.style.setProperty("width", `${box.width}px`, "important");
+			surface.style.setProperty("height", `${box.height}px`, "important");
+			crossfade.retire(surface, instant);
+		});
+	}, { signal: listeners.signal });
+	win.addEventListener("nativeUIVerticalBarsRelease", (event) => {
+		incomingInstant = event.detail.instant;
+		schedule();
+	}, { signal: listeners.signal });
+	win.addEventListener("resize", schedule, { signal: listeners.signal });
+	win.addEventListener("nativeUIRefresh", schedule, { signal: listeners.signal });
+	schedule();
+	return {
+		markForCheck: () => {
+			schedule();
+		},
+		getStatus: () => ({
+			state: stopped ? "stopped" : "web",
+			projected: Number(!!backSource) + Number(!!search.source) + toolbarProjections.reduce((count, group) => count + group.actions.length, 0),
+			updates
+		}),
+		async suspend() {
+			suspended++;
+			restore();
+			let resumed = false;
+			return { async resume() {
+				if (resumed) return;
+				resumed = true;
+				suspended = Math.max(0, suspended - 1);
+				if (!suspended) await schedule();
+			} };
+		},
+		async destroy() {
+			if (stopped) return;
+			stopped = true;
+			win.cancelAnimationFrame(frame);
+			frame = 0;
+			waiters.forEach((resolve) => resolve());
+			waiters = [];
+			observer.disconnect();
+			sourceObserver?.disconnect();
+			listeners.abort();
+			crossfade.destroy();
+			restore();
+		}
+	};
+};
+//#endregion
+export { createVerticalBarsWebProjection };
+
+//# sourceMappingURL=vertical-bars-web.js.map

package/dist/native/vertical-bars-web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vertical-bars-web.js","names":[],"sources":["../../src/native/vertical-bars-web.ts"],"sourcesContent":["import { controlSelected } from './shared/control-options';\nimport { createCrossfade, fadeMarker } from './shared/crossfade';\nimport { alignVerticalBarClone, verticalBarFrame } from './shared/vertical-bars-geometry';\nimport { createVerticalBarsWebSearch, searchProjectionClass } from './vertical-bars-web-search';\nimport { inVerticalBarsSurface, topModal } from './shared/modal';\nimport type { NativeUIRuntimeHandle, NativeUIOptions, NativeUIStatus } from './definitions';\nimport { VERTICAL_BARS_TRANSITION_CANCELED } from '../native-integration';\nimport {\n  activateProjectedElement,\n  createVerticalBarsPageState,\n  verticalBarsActionCandidate,\n  verticalBarsBackCandidate,\n  verticalBarsEnteringPage,\n  verticalBarsToolbarActions,\n  isExcluded,\n  isNativeUIDisabled,\n  isVerticalBarsToolbarGroup,\n  preferredVerticalBarsBack,\n  verticalBarsOwned,\n  marker,\n  syncToolbarText,\n  toolbarTextMarker,\n  prehideOnlyMutation,\n  prehiddenClass,\n  unprojected,\n  withoutPrehide,\n} from './shared/dom';\n\nconst backProjectionClass = 'ios-theme-vertical-bars-back-button-projection';\nconst toolbarProjectionClass = 'ios-theme-vertical-bars-toolbar-projection';\nconst readyClass = 'ios-theme-vertical-bars-toolbar-ready';\nconst toolbarControlSize = 46;\nconst toolbarControlGap = 10;\n\ninterface ToolbarProjection {\n  source: HTMLElement;\n  projection: HTMLElement;\n  actions: { source: HTMLElement; projection: HTMLElement; previousAriaHidden: string | null }[];\n}\n\ninterface ToolbarSource {\n  group: HTMLElement;\n  actions: HTMLElement[];\n}\n\nexport const createVerticalBarsWebProjection = (\n  doc: Document,\n  options: NativeUIOptions,\n  enabled: () => boolean = () => true,\n): NativeUIRuntimeHandle => {\n  const win = doc.defaultView!;\n  const crossfade = createCrossfade(win);\n  let incomingInstant: boolean | undefined;\n  const toolbarEnabled = options.ionic?.auto !== false;\n  let root: HTMLElement | undefined;\n  let backSource: HTMLIonBackButtonElement | undefined;\n  let backProjection: HTMLIonBackButtonElement | undefined;\n  let previousBackAriaHidden: string | null = null;\n  let toolbarProjections: ToolbarProjection[] = [];\n  let suspended = 0;\n  let stopped = false;\n  let frame = 0;\n  let updates = 0;\n  let observingVerticalBars = false;\n  const verticalBarsPages = createVerticalBarsPageState();\n  let sourceObserver: MutationObserver | undefined;\n  let waiters: (() => void)[] = [];\n  const listeners = new AbortController();\n  const verticalBarsRoot = () => doc.querySelector<HTMLElement>('ion-app.ios-theme-vertical-bars');\n  const projectedSources = () =>\n    [backSource, search.source, ...toolbarProjections.flatMap(({ actions }) => actions.map(({ source }) => source))].filter(\n      (source): source is HTMLElement => !!source,\n    );\n  const isRendered = (element: HTMLElement) =>\n    withoutPrehide(element, () => {\n      const style = getComputedStyle(element);\n      const rect = element.getBoundingClientRect();\n      return element.isConnected && style.display !== 'none' && style.visibility === 'visible' && rect.width > 0 && rect.height > 0;\n    });\n  const search = createVerticalBarsWebSearch(\n    doc,\n    (element) =>\n      options.ionic?.auto !== false &&\n      controlSelected(element, options, 'tabs', true) &&\n      !!verticalBarsRoot()?.contains(element) &&\n      (!options.root || options.root.contains(element)) &&\n      !element.closest('[data-native-ui-placement=\"element\"]') &&\n      inVerticalBarsSurface(element) &&\n      !isExcluded(element, verticalBarsEnteringPage(element)) &&\n      !isNativeUIDisabled(element) &&\n      !verticalBarsPages.isDeparted(element) &&\n      isRendered(element),\n    () => {\n      void schedule();\n    },\n  );\n  const inEligibleToolbar = (element: HTMLElement) =>\n    !!verticalBarsRoot()?.contains(element) &&\n    (!options.root || options.root.contains(element)) &&\n    !element.closest('[data-native-ui-placement=\"element\"]') &&\n    inVerticalBarsSurface(element) &&\n    verticalBarsActionCandidate(element) &&\n    !isExcluded(element, verticalBarsEnteringPage(element)) &&\n    !verticalBarsPages.isDeparted(element);\n  const isEligibleBack = (element: HTMLIonBackButtonElement) =>\n    !!verticalBarsRoot()?.contains(element) &&\n    (!options.root || options.root.contains(element)) &&\n    !element.closest('[data-native-ui-placement=\"element\"]') &&\n    inVerticalBarsSurface(element) &&\n    verticalBarsOwned(element) &&\n    verticalBarsBackCandidate(element) &&\n    !isExcluded(element, verticalBarsEnteringPage(element)) &&\n    !verticalBarsPages.isDeparted(element) &&\n    unprojected(projectedSources(), () => isRendered(element));\n  const pageOrder = (element: Element) => Array.from(doc.querySelectorAll('.ion-page')).indexOf(element.closest('.ion-page')!);\n  const findBack = () => {\n    const candidates = Array.from(doc.querySelectorAll<HTMLIonBackButtonElement>(`ion-back-button:not(.${backProjectionClass})`)).filter(\n      isEligibleBack,\n    );\n    return preferredVerticalBarsBack(candidates, doc);\n  };\n  const findToolbarGroups = () => {\n    const candidates = Array.from(doc.querySelectorAll<HTMLIonButtonsElement>(`ion-buttons:not(.${toolbarProjectionClass})`)).flatMap(\n      (group): ToolbarSource[] => {\n        const actions = verticalBarsToolbarActions(group).filter((action) => unprojected(projectedSources(), () => isRendered(action)));\n        if (!actions.length) return [];\n        if (!isVerticalBarsToolbarGroup(group)) return actions.filter(inEligibleToolbar).map((action) => ({ group, actions: [action] }));\n        return inEligibleToolbar(group) && unprojected(projectedSources(), () => isRendered(group)) ? [{ group, actions }] : [];\n      },\n    );\n    for (const action of Array.from(doc.querySelectorAll<HTMLElement>('ion-button, ion-menu-button'))) {\n      if (action.closest('ion-buttons') || !verticalBarsOwned(action) || !inEligibleToolbar(action)) continue;\n      if (unprojected(projectedSources(), () => isRendered(action))) candidates.push({ group: action, actions: [action] });\n    }\n    const highestPage = Math.max(...candidates.map(({ group }) => pageOrder(group)));\n    return candidates.filter(({ group }) => pageOrder(group) === highestPage);\n  };\n  const isCurrentToolbarAction = (source: HTMLElement) => findToolbarGroups().some(({ actions }) => actions.includes(source));\n  const restore = (retire?: (surface: HTMLElement) => void) => {\n    search.restore(retire);\n    if (backProjection) {\n      if (retire) retire(backProjection);\n      else backProjection.remove();\n    }\n    backProjection = undefined;\n    if (backSource) {\n      backSource.removeAttribute(marker);\n      if (previousBackAriaHidden === null) backSource.removeAttribute('aria-hidden');\n      else backSource.setAttribute('aria-hidden', previousBackAriaHidden);\n      backSource.dispatchEvent(new CustomEvent('nativeUIChange'));\n    }\n    backSource = undefined;\n    previousBackAriaHidden = null;\n    for (const { projection, actions } of toolbarProjections) {\n      if (retire) retire(projection);\n      else projection.remove();\n      for (const { source, previousAriaHidden } of actions) {\n        source.removeAttribute(marker);\n        if (previousAriaHidden === null) source.removeAttribute('aria-hidden');\n        else source.setAttribute('aria-hidden', previousAriaHidden);\n        source.dispatchEvent(new CustomEvent('nativeUIChange'));\n      }\n    }\n    toolbarProjections = [];\n    sourceObserver?.disconnect();\n    sourceObserver = undefined;\n    root?.classList.remove(readyClass);\n    root = undefined;\n  };\n  const copyAttributes = (target: HTMLElement, original: HTMLElement) => {\n    for (const name of ['id', 'slot', marker, 'aria-hidden']) target.removeAttribute(name);\n    for (const attribute of Array.from(target.attributes))\n      if (!['class', marker, fadeMarker].includes(attribute.name) && !original.hasAttribute(attribute.name))\n        target.removeAttribute(attribute.name);\n    for (const attribute of Array.from(original.attributes))\n      if (!['id', 'slot', marker, 'aria-hidden'].includes(attribute.name)) target.setAttribute(attribute.name, attribute.value);\n    target.classList.remove(prehiddenClass);\n  };\n  const syncBack = (target: HTMLIonBackButtonElement, original: HTMLIonBackButtonElement) => {\n    copyAttributes(target, original);\n    target.classList.add(backProjectionClass, 'ion-cloned-element');\n    target.disabled = original.disabled;\n    target.defaultHref = original.defaultHref;\n    target.icon = original.icon;\n    target.color = original.color;\n    target.mode = original.mode;\n    target.text = '';\n    if (root) alignVerticalBarClone(target, original, root);\n  };\n  const syncAction = (target: HTMLElement, original: HTMLElement) => {\n    copyAttributes(target, original);\n    target.classList.add('ios-theme-vertical-bars-toolbar-action', 'ion-cloned-element');\n    const label =\n      original.getAttribute('aria-label') ??\n      original.shadowRoot?.querySelector('[part~=native]')?.getAttribute('aria-label') ??\n      original.textContent?.trim();\n    if (label) target.setAttribute('aria-label', label);\n    if ('disabled' in original) (target as HTMLIonButtonElement).disabled = (original as HTMLIonButtonElement).disabled;\n    if (original.matches('ion-button')) {\n      const icon = original.querySelector<HTMLElement>('ion-icon, svg');\n      const clonedIcon = icon?.cloneNode(true) as HTMLElement | undefined;\n      clonedIcon?.setAttribute('slot', 'icon-only');\n      target.replaceChildren(...(clonedIcon ? [clonedIcon] : [document.createTextNode(original.textContent?.trim() || label || '')]));\n    }\n  };\n  const sameSources = (back: HTMLIonBackButtonElement | undefined, groups: ToolbarSource[]) =>\n    back === backSource &&\n    groups.length === toolbarProjections.length &&\n    groups.every(({ group, actions }, index) => {\n      const current = toolbarProjections[index];\n      return (\n        group === current.source &&\n        actions.length === current.actions.length &&\n        actions.every((action, actionIndex) => action === current.actions[actionIndex].source)\n      );\n    });\n  const syncExisting = () => {\n    if (backSource && backProjection) syncBack(backProjection, backSource);\n    let topOffset = backSource ? toolbarControlSize + toolbarControlGap : 0;\n    for (const { projection, source, actions } of toolbarProjections) {\n      if (actions.length === 1 && !projection.matches('ion-buttons')) syncAction(projection, actions[0].source);\n      else copyAttributes(projection, source);\n      projection.classList.add(toolbarProjectionClass, 'ion-cloned-element');\n      projection.style.setProperty('--ios-theme-vertical-bars-toolbar-offset', `${topOffset}px`);\n      if (projection.matches('ion-buttons')) actions.forEach(({ source: action, projection: clone }) => syncAction(clone, action));\n      const frames = actions.map(({ source }) => verticalBarFrame(source));\n      if (root && frames.every((frame) => !!frame)) {\n        if (actions.length === 1) alignVerticalBarClone(projection, actions[0].source, root);\n        else {\n          const left = Math.min(...frames.map((frame) => frame!.x));\n          const top = Math.min(...frames.map((frame) => frame!.y));\n          const right = Math.max(...frames.map((frame) => frame!.x + frame!.width));\n          const bottom = Math.max(...frames.map((frame) => frame!.y + frame!.height));\n          const origin = root.getBoundingClientRect();\n          Object.assign(projection.style, {\n            left: `${left - origin.left}px`,\n            top: `${top - origin.top}px`,\n            right: 'auto',\n            bottom: 'auto',\n            width: `${right - left}px`,\n            height: `${bottom - top}px`,\n            padding: '0',\n          });\n          actions.forEach(({ source, projection: clone }) => alignVerticalBarClone(clone, source, projection));\n        }\n      }\n      topOffset += actions.length * toolbarControlSize + toolbarControlGap;\n    }\n  };\n  const project = (nextBack: HTMLIonBackButtonElement | undefined, groups: ToolbarSource[]) => {\n    root = topModal(doc) ?? verticalBarsRoot()!;\n    let topOffset = 0;\n    if (nextBack) {\n      backSource = nextBack;\n      previousBackAriaHidden = nextBack.getAttribute('aria-hidden');\n      backProjection = nextBack.cloneNode(false) as HTMLIonBackButtonElement;\n      syncBack(backProjection, nextBack);\n      backProjection.addEventListener(\n        'click',\n        (event) => {\n          event.preventDefault();\n          event.stopImmediatePropagation();\n          if (backSource && backSource === findBack()) activateProjectedElement(backSource);\n        },\n        { capture: true },\n      );\n      root.append(backProjection);\n      nextBack.setAttribute(marker, '');\n      nextBack.setAttribute('aria-hidden', 'true');\n      nextBack.dispatchEvent(new CustomEvent('nativeUIChange'));\n      topOffset = toolbarControlSize + toolbarControlGap;\n    }\n    for (const { group, actions: sources } of groups) {\n      const projection = (sources.length === 1 ? sources[0] : group).cloneNode(false) as HTMLElement;\n      if (sources.length === 1) syncAction(projection, sources[0]);\n      else copyAttributes(projection, group);\n      projection.classList.add(toolbarProjectionClass, 'ion-cloned-element');\n      projection.style.setProperty('--ios-theme-vertical-bars-toolbar-offset', `${topOffset}px`);\n      const actions = sources.map((source) => {\n        const clone = sources.length === 1 ? projection : (source.cloneNode(false) as HTMLElement);\n        if (sources.length > 1) syncAction(clone, source);\n        clone.addEventListener(\n          'click',\n          (event) => {\n            event.preventDefault();\n            event.stopImmediatePropagation();\n            if (isCurrentToolbarAction(source)) activateProjectedElement(source);\n          },\n          { capture: true },\n        );\n        if (sources.length > 1) projection.append(clone);\n        const previousAriaHidden = source.getAttribute('aria-hidden');\n        source.setAttribute(marker, '');\n        source.setAttribute('aria-hidden', 'true');\n        source.dispatchEvent(new CustomEvent('nativeUIChange'));\n        return { source, projection: clone, previousAriaHidden };\n      });\n      root.append(projection);\n      toolbarProjections.push({ source: group, projection, actions });\n      topOffset += actions.length * toolbarControlSize + toolbarControlGap;\n    }\n    syncExisting();\n    if (nextBack || toolbarProjections.length) root.classList.add(readyClass);\n    sourceObserver = new MutationObserver((records) => {\n      if (\n        records.some(\n          (record) =>\n            record.type !== 'attributes' || (![marker, 'aria-hidden'].includes(record.attributeName ?? '') && !prehideOnlyMutation(record)),\n        )\n      )\n        schedule();\n    });\n    if (nextBack?.shadowRoot)\n      sourceObserver.observe(nextBack.shadowRoot, { subtree: true, childList: true, attributes: true, attributeOldValue: true });\n    for (const { group } of groups)\n      sourceObserver.observe(group, { subtree: true, childList: true, attributes: true, attributeOldValue: true });\n  };\n  const reveal = () => {\n    if (incomingInstant === undefined) return;\n    for (const surface of [backProjection, ...toolbarProjections.map(({ projection }) => projection), search.surface])\n      if (surface) crossfade.play(surface, false, incomingInstant);\n    incomingInstant = undefined;\n  };\n  const performUpdate = () => {\n    frame = 0;\n    syncToolbarText(doc);\n    const currentRoot = verticalBarsRoot();\n    if (observingVerticalBars !== !!currentRoot) {\n      observingVerticalBars = !!currentRoot;\n      observer.disconnect();\n      observer.observe(doc.documentElement, {\n        subtree: true,\n        childList: true,\n        characterData: observingVerticalBars,\n        attributes: true,\n        attributeOldValue: true,\n        attributeFilter: observingVerticalBars ? undefined : ['class'],\n      });\n    }\n    if (stopped || suspended || !currentRoot || !enabled()) return restore();\n    const nextBack = toolbarEnabled ? findBack() : undefined;\n    const groups = toolbarEnabled ? findToolbarGroups() : [];\n    const projectionRoot = topModal(doc) ?? currentRoot;\n    search.update(projectionRoot);\n    if (!nextBack && !groups.length && !search.source) return restore();\n    if (root === (topModal(doc) ?? currentRoot) && sameSources(nextBack, groups)) {\n      syncExisting();\n      reveal();\n      return;\n    }\n    restore();\n    project(nextBack, groups);\n    search.update(projectionRoot);\n    reveal();\n    updates++;\n  };\n  const update = () => {\n    try {\n      performUpdate();\n    } catch {\n      restore();\n    } finally {\n      const pending = waiters;\n      waiters = [];\n      pending.forEach((resolve) => resolve());\n    }\n  };\n  const schedule = (): Promise<void> => {\n    if (stopped) return Promise.resolve();\n    // Release Web ownership before the native runtime can acknowledge its next frame.\n    if (!enabled()) restore();\n    const done = new Promise<void>((resolve) => waiters.push(resolve));\n    if (!frame) frame = win.requestAnimationFrame(update);\n    return done;\n  };\n  const observer = new MutationObserver((records) => {\n    const insideProjection = (target: Node) => {\n      const element = target instanceof Element ? target : target.parentNode instanceof Element ? target.parentNode : undefined;\n      const rootNode = target.getRootNode();\n      const shadowHost = rootNode instanceof ShadowRoot ? rootNode.host : undefined;\n      return !![element, shadowHost].some((candidate) =>\n        candidate?.closest(`.${backProjectionClass}, .${toolbarProjectionClass}, .${searchProjectionClass}`),\n      );\n    };\n    const verticalBarsChanged = records.some(\n      (record) =>\n        (record.type === 'attributes' && (record.target as Element).matches('ion-app')) ||\n        (record.type === 'childList' &&\n          Array.from(record.addedNodes).some(\n            (node) =>\n              node instanceof Element &&\n              (node.matches('ion-app.ios-theme-vertical-bars') || !!node.querySelector('ion-app.ios-theme-vertical-bars')),\n          )),\n    );\n    if (\n      (observingVerticalBars &&\n        records.some(\n          (record) =>\n            record.attributeName !== marker &&\n            record.attributeName !== toolbarTextMarker &&\n            !prehideOnlyMutation(record) &&\n            !insideProjection(record.target),\n        )) ||\n      (!observingVerticalBars && verticalBarsChanged && records.some((record) => !prehideOnlyMutation(record)))\n    )\n      schedule();\n  });\n  observer.observe(doc.documentElement, {\n    subtree: true,\n    childList: true,\n    attributes: true,\n    attributeOldValue: true,\n    attributeFilter: ['class'],\n  });\n  const pageLifecycle = (event: Event) => {\n    const page = event.target;\n    if (!(page instanceof HTMLElement) || !page.matches('.ion-page')) return;\n    if (event.type === VERTICAL_BARS_TRANSITION_CANCELED) {\n      const entering = (event as CustomEvent<{ entering?: HTMLElement }>).detail?.entering;\n      verticalBarsPages.cancel(entering, page);\n    } else verticalBarsPages.lifecycle(event);\n    if (verticalBarsRoot()) schedule();\n  };\n  for (const name of ['ionViewWillEnter', 'ionViewWillLeave', 'ionViewDidEnter', 'ionViewDidLeave'])\n    doc.addEventListener(name, pageLifecycle, { capture: true, signal: listeners.signal });\n  doc.addEventListener(VERTICAL_BARS_TRANSITION_CANCELED, pageLifecycle, { capture: true, signal: listeners.signal });\n  for (const name of ['ionModalWillPresent', 'ionModalDidDismiss'])\n    doc.addEventListener(name, schedule, { capture: true, signal: listeners.signal });\n  win.addEventListener(\n    'nativeUIVerticalBarsAcquire',\n    (event) => {\n      const instant = (event as CustomEvent<{ instant: boolean }>).detail?.instant ?? true;\n      incomingInstant = undefined;\n      restore((surface) => {\n        // Keep only the outgoing visual at its last rectangle after Web ownership\n        // is released. The native acknowledgement transfers input exactly once.\n        const box = surface.getBoundingClientRect();\n        surface.style.setProperty('position', 'fixed', 'important');\n        surface.style.setProperty('display', 'block', 'important');\n        surface.style.setProperty('left', `${box.left}px`, 'important');\n        surface.style.setProperty('top', `${box.top}px`, 'important');\n        surface.style.setProperty('right', 'auto', 'important');\n        surface.style.setProperty('bottom', 'auto', 'important');\n        surface.style.setProperty('width', `${box.width}px`, 'important');\n        surface.style.setProperty('height', `${box.height}px`, 'important');\n        crossfade.retire(surface, instant);\n      });\n    },\n    { signal: listeners.signal },\n  );\n  win.addEventListener(\n    'nativeUIVerticalBarsRelease',\n    (event) => {\n      incomingInstant = (event as CustomEvent<{ instant: boolean }>).detail.instant;\n      void schedule();\n    },\n    { signal: listeners.signal },\n  );\n  win.addEventListener('resize', schedule, { signal: listeners.signal });\n  win.addEventListener('nativeUIRefresh', schedule, { signal: listeners.signal });\n  schedule();\n\n  return {\n    markForCheck: () => {\n      void schedule();\n    },\n    getStatus: (): NativeUIStatus => ({\n      state: stopped ? 'stopped' : 'web',\n      projected:\n        Number(!!backSource) + Number(!!search.source) + toolbarProjections.reduce((count, group) => count + group.actions.length, 0),\n      updates,\n    }),\n    async suspend() {\n      suspended++;\n      restore();\n      let resumed = false;\n      return {\n        async resume() {\n          if (resumed) return;\n          resumed = true;\n          suspended = Math.max(0, suspended - 1);\n          if (!suspended) await schedule();\n        },\n      };\n    },\n    async destroy() {\n      if (stopped) return;\n      stopped = true;\n      win.cancelAnimationFrame(frame);\n      frame = 0;\n      waiters.forEach((resolve) => resolve());\n      waiters = [];\n      observer.disconnect();\n      sourceObserver?.disconnect();\n      listeners.abort();\n      crossfade.destroy();\n      restore();\n    },\n  };\n};\n"],"mappings":"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"}

package/dist/native-integration/index.d.ts

@@ -0,0 +1,25 @@
+//#region src/native-integration/index.d.ts
+export interface NativeUIIntegration {
+  suspend(scopes: HTMLElement[]): Promise<(canceled?: boolean) => void>;
+  search?(binding: NativeSearchBinding, active: boolean, focus?: boolean): Promise<boolean>;
+}
+export interface NativeSearchBinding {
+  tabBar: HTMLElement;
+  trigger: HTMLElement;
+  footer: HTMLElement;
+  active: boolean;
+  focused: boolean;
+}
+export declare const registerNativeSearch: (tabBar: HTMLElement, trigger: HTMLElement, footer: HTMLElement) => NativeSearchBinding;
+export declare const getNativeSearchBindings: (doc: Document) => NativeSearchBinding[];
+export declare const requestNativeSearch: (binding: NativeSearchBinding, active: boolean, focus?: boolean) => Promise<boolean>;
+export declare const VERTICAL_BARS_TRANSITION_CANCELED = "iosThemeVerticalBarsTransitionCanceled";
+export declare const setNativeUIIntegration: (doc: Document, runtime?: NativeUIIntegration) => void;
+export declare const hasNativeUIIntegration: (doc: Document) => boolean;
+export declare const isNativeUI: (element: HTMLElement) => boolean;
+export declare const suspendNativeUI: (scopes: HTMLElement[]) => Promise<(canceled?: boolean) => void>;
+export declare const nativeWebViewMetrics: {
+  radius: number;
+};
+//#endregion
+//# sourceMappingURL=index.d.ts.map

package/dist/native-integration/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/native-integration/index.ts"],"mappings":";iBAEiB;EACf,QAAQ,QAAQ,gBAAgB,SAAS;EACzC,QAAQ,SAAS,qBAAqB,iBAAiB,kBAAkB;;iBAG1D;EACf,QAAQ;EACR,SAAS;EACT,QAAQ;EACR;EACA;;qBAKW,uBAAwB,QAAQ,aAAa,SAAS,aAAa,QAAQ,gBAAc;qBASzF,0BAA2B,KAAK,aAAW;qBAG3C,sBAA6B,SAAS,qBAAqB,iBAAiB,oBAAkB;qBAI9F;qBAEA,yBAA0B,KAAK,UAAU,UAAU;qBAKnD,yBAA0B,KAAK;qBAE/B,aAAc,SAAS;qBAEvB,kBAAyB,QAAQ,kBAAgB,SAAS;qBAI1D;EAAA"}

package/dist/native-integration/index.js

@@ -0,0 +1,33 @@
+//#region src/native-integration/index.ts
+const searches = /* @__PURE__ */ new WeakMap();
+const registerNativeSearch = (tabBar, trigger, footer) => {
+	const binding = {
+		tabBar,
+		trigger,
+		footer,
+		active: false,
+		focused: false
+	};
+	const entries = (searches.get(tabBar.ownerDocument) ?? []).filter((entry) => entry.deref() && entry.deref()?.footer !== footer);
+	entries.push(new WeakRef(binding));
+	searches.set(tabBar.ownerDocument, entries);
+	tabBar.ownerDocument.defaultView?.dispatchEvent(new Event("nativeUIRefresh"));
+	return binding;
+};
+const getNativeSearchBindings = (doc) => (searches.get(doc) ?? []).flatMap((entry) => entry.deref() ?? []);
+const requestNativeSearch = async (binding, active, focus) => await runtimes.get(binding.tabBar.ownerDocument)?.search?.(binding, active, focus) ?? false;
+const runtimes = /* @__PURE__ */ new WeakMap();
+const VERTICAL_BARS_TRANSITION_CANCELED = "iosThemeVerticalBarsTransitionCanceled";
+const setNativeUIIntegration = (doc, runtime) => {
+	if (runtime) runtimes.set(doc, runtime);
+	else runtimes.delete(doc);
+};
+const hasNativeUIIntegration = (doc) => runtimes.has(doc);
+const isNativeUI = (element) => element.hasAttribute("data-native-ui-projected");
+const suspendNativeUI = async (scopes) => await runtimes.get(scopes[0]?.ownerDocument)?.suspend(scopes) ?? (() => {});
+/** Shared geometry used by the theme's transition adapter; no theme import in the plugin. */
+const nativeWebViewMetrics = { radius: 0 };
+//#endregion
+export { VERTICAL_BARS_TRANSITION_CANCELED, getNativeSearchBindings, hasNativeUIIntegration, isNativeUI, nativeWebViewMetrics, registerNativeSearch, requestNativeSearch, setNativeUIIntegration, suspendNativeUI };
+
+//# sourceMappingURL=index.js.map

package/dist/native-integration/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/native-integration/index.ts"],"sourcesContent":["/// <reference lib=\"es2021.weakref\" />\n\nexport interface NativeUIIntegration {\n  suspend(scopes: HTMLElement[]): Promise<(canceled?: boolean) => void>;\n  search?(binding: NativeSearchBinding, active: boolean, focus?: boolean): Promise<boolean>;\n}\n\nexport interface NativeSearchBinding {\n  tabBar: HTMLElement;\n  trigger: HTMLElement;\n  footer: HTMLElement;\n  active: boolean;\n  focused: boolean;\n}\n\nconst searches = new WeakMap<Document, WeakRef<NativeSearchBinding>[]>();\n\nexport const registerNativeSearch = (tabBar: HTMLElement, trigger: HTMLElement, footer: HTMLElement): NativeSearchBinding => {\n  const binding = { tabBar, trigger, footer, active: false, focused: false };\n  const entries = (searches.get(tabBar.ownerDocument) ?? []).filter((entry) => entry.deref() && entry.deref()?.footer !== footer);\n  entries.push(new WeakRef(binding));\n  searches.set(tabBar.ownerDocument, entries);\n  tabBar.ownerDocument.defaultView?.dispatchEvent(new Event('nativeUIRefresh'));\n  return binding;\n};\n\nexport const getNativeSearchBindings = (doc: Document): NativeSearchBinding[] =>\n  (searches.get(doc) ?? []).flatMap((entry) => entry.deref() ?? []);\n\nexport const requestNativeSearch = async (binding: NativeSearchBinding, active: boolean, focus?: boolean): Promise<boolean> =>\n  (await runtimes.get(binding.tabBar.ownerDocument)?.search?.(binding, active, focus)) ?? false;\n\nconst runtimes = new WeakMap<Document, NativeUIIntegration>();\nexport const VERTICAL_BARS_TRANSITION_CANCELED = 'iosThemeVerticalBarsTransitionCanceled';\n\nexport const setNativeUIIntegration = (doc: Document, runtime?: NativeUIIntegration) => {\n  if (runtime) runtimes.set(doc, runtime);\n  else runtimes.delete(doc);\n};\n\nexport const hasNativeUIIntegration = (doc: Document): boolean => runtimes.has(doc);\n\nexport const isNativeUI = (element: HTMLElement) => element.hasAttribute('data-native-ui-projected');\n\nexport const suspendNativeUI = async (scopes: HTMLElement[]): Promise<(canceled?: boolean) => void> =>\n  (await runtimes.get(scopes[0]?.ownerDocument)?.suspend(scopes)) ?? (() => {});\n\n/** Shared geometry used by the theme's transition adapter; no theme import in the plugin. */\nexport const nativeWebViewMetrics = { radius: 0 };\n"],"mappings":";AAeA,MAAM,2BAAW,IAAI,QAAkD;AAEvE,MAAa,wBAAwB,QAAqB,SAAsB,WAA6C;CAC3H,MAAM,UAAU;EAAE;EAAQ;EAAS;EAAQ,QAAQ;EAAO,SAAS;CAAM;CACzE,MAAM,WAAW,SAAS,IAAI,OAAO,aAAa,KAAK,CAAC,EAAA,CAAG,QAAQ,UAAU,MAAM,MAAM,KAAK,MAAM,MAAM,CAAC,EAAE,WAAW,MAAM;CAC9H,QAAQ,KAAK,IAAI,QAAQ,OAAO,CAAC;CACjC,SAAS,IAAI,OAAO,eAAe,OAAO;CAC1C,OAAO,cAAc,aAAa,cAAc,IAAI,MAAM,iBAAiB,CAAC;CAC5E,OAAO;AACT;AAEA,MAAa,2BAA2B,SACrC,SAAS,IAAI,GAAG,KAAK,CAAC,EAAA,CAAG,SAAS,UAAU,MAAM,MAAM,KAAK,CAAC,CAAC;AAElE,MAAa,sBAAsB,OAAO,SAA8B,QAAiB,UACtF,MAAM,SAAS,IAAI,QAAQ,OAAO,aAAa,CAAC,EAAE,SAAS,SAAS,QAAQ,KAAK,KAAM;AAE1F,MAAM,2BAAW,IAAI,QAAuC;AAC5D,MAAa,oCAAoC;AAEjD,MAAa,0BAA0B,KAAe,YAAkC;CACtF,IAAI,SAAS,SAAS,IAAI,KAAK,OAAO;MACjC,SAAS,OAAO,GAAG;AAC1B;AAEA,MAAa,0BAA0B,QAA2B,SAAS,IAAI,GAAG;AAElF,MAAa,cAAc,YAAyB,QAAQ,aAAa,0BAA0B;AAEnG,MAAa,kBAAkB,OAAO,WACnC,MAAM,SAAS,IAAI,OAAO,EAAE,EAAE,aAAa,CAAC,EAAE,QAAQ,MAAM,YAAa,CAAC;;AAG7E,MAAa,uBAAuB,EAAE,QAAQ,EAAE"}

package/dist/vertical-bars.d.ts

@@ -0,0 +1,6 @@
+import { ControlProjection, NativeUIControls, NativeUIStatus, NativeUISuspension, VerticalBarEdge, VerticalControlAreaHandle, VerticalControlAreaOptions } from "./native/definitions.js";
+import { NativeUI } from "./native/activation.js";
+import { applyFoldStateClasses } from "./native/foldable/fold-state.js";
+import { setVerticalControlAreaPlacement } from "./native/legacy-layout.js";
+import { enableVerticalControlArea } from "./native/index.js";
+export { type ControlProjection, NativeUI, type NativeUIControls, type NativeUIStatus, type NativeUISuspension, type VerticalBarEdge, type VerticalControlAreaHandle, type VerticalControlAreaOptions, applyFoldStateClasses, enableVerticalControlArea, setVerticalControlAreaPlacement };

package/dist/vertical-bars.js

@@ -0,0 +1,5 @@
+import { NativeUI } from "./native/activation.js";
+import { setVerticalControlAreaPlacement } from "./native/legacy-layout.js";
+import { enableVerticalControlArea } from "./native/index.js";
+import { applyFoldStateClasses } from "./native/foldable/fold-state.js";
+export { NativeUI, applyFoldStateClasses, enableVerticalControlArea, setVerticalControlAreaPlacement };

package/docs/appearance.md

@@ -0,0 +1,45 @@
+# Light and dark appearance
+
+Native UI reads the computed style of each projected source element and sends its light/dark appearance to the native renderer. Configure appearance in your Web CSS; there is no separate native dark-mode startup option.
+
+## How appearance is resolved
+
+The first applicable row wins:
+
+| Priority | Computed source style                                    | Result                                                                                                                        |
+| -------- | -------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------- |
+| 1        | Theme-provided `--ios27-color-scheme` is non-empty       | `dark` selects dark; other values select light. The iOS 27 theme supplies this marker through its light and dark stylesheets. |
+| 2        | `--ion-background-color-rgb` supplies three RGB channels | Infers dark or light from the background brightness.                                                                          |
+| 3        | CSS `color-scheme` contains only `dark` or only `light`  | Uses that scheme. `light dark` does not select a single appearance.                                                           |
+| 4        | None of the above                                        | Uses the system's `prefers-color-scheme: dark` setting.                                                                       |
+
+Theme markers and Ionic background values take precedence over `color-scheme`. Changing only an arbitrary CSS background or text color does not select native light/dark appearance.
+
+## Match your Web theme
+
+| Web setup                          | What to configure                                                                                                                                                |
+| ---------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| iOS 27 theme                       | Load the matching [System, Class or Always dark-mode pair](../../theme-ios27/docs/setup.md#choose-one-dark-mode-pair). The theme supplies the appearance marker. |
+| Ionic with an existing theme       | Keep `--ion-background-color-rgb` consistent with the active palette; native appearance uses it when no theme marker is present.                                 |
+| HTML without those theme variables | Set `color-scheme: light` or `color-scheme: dark` to match the active Web theme.                                                                                 |
+| System-managed HTML appearance     | Use system-responsive CSS; when no single scheme is selected, native appearance falls back to the system setting.                                                |
+
+For example, a plain HTML app with a manual dark-mode class can declare:
+
+```css
+:root {
+  color-scheme: light;
+}
+
+:root.app-dark {
+  color-scheme: dark;
+}
+```
+
+Use the same class for your application's dark palette. This example assumes neither of the higher-priority theme variables is supplied. Class/style mutations and system appearance changes trigger re-evaluation while the runtime is active. For style changes without an observed DOM mutation, call `shell.markForCheck()` after applying them.
+
+## Shared Vertical Bars appearance
+
+Ordinary controls resolve appearance from their own source styles. Vertical Bars shares one native rail appearance: **if any projected control is dark, the whole rail uses dark appearance**. It does not render separate light and dark rail regions. Keep sources projected into the same rail on a consistent Web palette.
+
+Native light/dark appearance selects the system material and control appearance; it does not reproduce arbitrary application CSS. Vertical button fill and tint remain governed by the separate [button appearance settings](vertical-bars.md#choose-button-appearance).