@flemo/react 1.12.1 → 1.12.3

package/dist/index.mjs

@@ -1,7 +1,7 @@
 import e, { Activity as t, Children as n, createContext as r, isValidElement as i, useCallback as a, useContext as o, useEffect as s, useId as c, useImperativeHandle as l, useInsertionEffect as u, useLayoutEffect as d, useReducer as f, useRef as p, useState as m, useSyncExternalStore as ee } from "react";
-import { animHoldKey as te, appendParamsQuery as ne, buildRoutePath as re, computeBarRiding as ie, computeScreenFreeze as ae, computeScreenFreezeMode as oe, consumeSelfInducedPop as se, createAnimHoldCoordinator as h, createBrowserHistoryDriver as g, createBrowserHistoryDriver as _, createDecorator as v, createHistoryStore as y, createNavigateStore as ce, createNavigationController as b, createPartTransition as x, createRawDecorator as le, createRawPartTransition as S, createRawTransition as C, createRouterScope as w, createScreenSelector as T, createScreenStore as E, createStepController as D, createSwipeController as ue, createTransition as O, createTransitionEngine as de, createTransitionStore as k, decoratorMap as fe, detectBlinkEngine as A, eagerlyDecodeImages as pe, ensureGpuPipelinePrewarm as me, ensureImageDecodeOffloader as he, ensureScopeHistorySync as j, enteringInitialStyle as ge, getMatchedPathPattern as _e, governedCompiledActive as ve, holdCompositorWarm as M, isLegacyAndroidBlink as ye, isOpaqueColor as be, isServer as N, markSelfInducedPop as xe, matchesPathname as Se, observeBarHeight as Ce, observeViewportScrollHeight as we, partTransitionMap as Te, readImageOffloadOverride as Ee, readLayerPromotionFlag as De, readPrerasterFlag as Oe, readSettleGateFlag as ke, readStepParams as Ae, registerTransitionDefinitions as je, releaseScopeHistorySync as Me, resolveTransition as Ne, seedRouterEntry as Pe, sharedBarsMatch as Fe, steadySixtyPlayerEligible as Ie, subscribeStepParamsRestore as Le } from "@flemo/core";
-import { jsx as P, jsxs as Re } from "react/jsx-runtime";
-import { flushSync as ze } from "react-dom";
+import { animHoldKey as te, appendParamsQuery as ne, buildRoutePath as re, computeBarRiding as ie, computeScreenFreeze as ae, computeScreenFreezeMode as oe, consumeSelfInducedPop as se, createAnimHoldCoordinator as h, createBrowserHistoryDriver as g, createBrowserHistoryDriver as _, createDecorator as v, createHistoryStore as y, createNavigateStore as ce, createNavigationController as b, createPartTransition as x, createRawDecorator as le, createRawPartTransition as S, createRawTransition as C, createRouterScope as w, createScreenSelector as T, createScreenStore as E, createStepController as D, createSwipeController as ue, createTransition as O, createTransitionEngine as de, createTransitionStore as k, decoratorMap as fe, detectBlinkEngine as A, eagerlyDecodeImages as pe, ensureGpuPipelinePrewarm as me, ensureImageDecodeOffloader as he, ensureScopeHistorySync as j, enteringInitialStyle as ge, getMatchedPathPattern as _e, governedCompiledActive as ve, holdCompositorWarm as M, isDesktopBlink as ye, isLegacyAndroidBlink as N, isOpaqueColor as be, isServer as xe, markSelfInducedPop as Se, matchesPathname as Ce, observeBarHeight as we, observeViewportScrollHeight as Te, partTransitionMap as Ee, readDeferReleaseCommitFlag as De, readDesktopReleaseFlipFlag as Oe, readImageOffloadOverride as ke, readLayerPromotionFlag as Ae, readPrerasterFlag as je, readSettleGateFlag as Me, readStepParams as Ne, registerTransitionDefinitions as Pe, releaseScopeHistorySync as Fe, resolveTransition as Ie, seedRouterEntry as Le, sharedBarsMatch as Re, subscribeStepParamsRestore as ze } from "@flemo/core";
+import { jsx as P, jsxs as Be } from "react/jsx-runtime";
+import { flushSync as Ve } from "react-dom";
 //#region src/stores/StoreContext.ts
 var F = r(null);
 //#endregion
@@ -15,7 +15,7 @@ function I() {
 //#region src/history/HistoryListener.tsx
 function L() {
 	let e = I();
-	return s(() => (j(e), () => Me(e)), [e]), null;
+	return s(() => (j(e), () => Fe(e)), [e]), null;
 }
 //#endregion
 //#region src/screen/ScreenContext.ts
@@ -39,10 +39,10 @@ function z() {
 }
 //#endregion
 //#region src/screen/ParamsProvider/ParamsContext.ts
-var B = r({}), Be = r(() => {});
+var B = r({}), He = r(() => {});
 //#endregion
 //#region src/screen/ParamsProvider/ParamsReducer.ts
-function Ve(e, t) {
+function Ue(e, t) {
 	switch (t.type) {
 		case "SET": return t.params;
 		default: return e;
@@ -50,10 +50,10 @@ function Ve(e, t) {
 }
 //#endregion
 //#region src/screen/ParamsProvider/ParamsProvider.tsx
-function He({ children: e }) {
-	let { isActive: t, params: n } = z(), { driver: r } = I(), [i, a] = f(Ve, n);
+function We({ children: e }) {
+	let { isActive: t, params: n } = z(), { driver: r } = I(), [i, a] = f(Ue, n);
 	return s(() => {
-		if (t) return Le(r, (e) => a({
+		if (t) return ze(r, (e) => a({
 			type: "SET",
 			params: e
 		}));
@@ -61,7 +61,7 @@ function He({ children: e }) {
 		t,
 		a,
 		r
-	]), /* @__PURE__ */ P(Be.Provider, {
+	]), /* @__PURE__ */ P(He.Provider, {
 		value: a,
 		children: /* @__PURE__ */ P(B.Provider, {
 			value: i,
@@ -71,8 +71,8 @@ function He({ children: e }) {
 }
 //#endregion
 //#region ../../node_modules/.pnpm/zustand@5.0.14_@types+react@19.2.18_react@19.2.8/node_modules/zustand/esm/react.mjs
-var Ue = (e) => e;
-function V(t, n = Ue) {
+var Ge = (e) => e;
+function V(t, n = Ge) {
 	let r = e.useSyncExternalStore(t.subscribe, e.useCallback(() => n(t.getState()), [t, n]), e.useCallback(() => n(t.getInitialState()), [t, n]));
 	return e.useDebugValue(r), r;
 }
@@ -83,13 +83,13 @@ function H(e) {
 }
 //#endregion
 //#region src/RouterIdContext.ts
-var We = r(null);
+var Ke = r(null);
 //#endregion
 //#region src/renderer/Renderer.tsx
-function Ge({ children: e }) {
-	let t = H((e) => e.index), r = H((e) => e.histories), i = I(), a = o(R), s = o(We);
+function qe({ children: e }) {
+	let t = H((e) => e.index), r = H((e) => e.histories), i = I(), a = o(R), s = o(Ke);
 	return T(r, t).map((t) => {
-		let [r] = n.toArray(e).filter((e) => Se(e.props.path, t.pathname));
+		let [r] = n.toArray(e).filter((e) => Ce(e.props.path, t.pathname));
 		return r ? /* @__PURE__ */ P(R.Provider, {
 			value: {
 				...t,
@@ -98,20 +98,20 @@ function Ge({ children: e }) {
 				routerId: s ?? void 0,
 				routePath: _e(r.props.path, t.pathname)
 			},
-			children: /* @__PURE__ */ P(He, { children: r })
+			children: /* @__PURE__ */ P(We, { children: r })
 		}, t.id) : null;
 	});
 }
 //#endregion
 //#region src/screen/ScreenViewportContext.ts
-var Ke = r({ contained: !1 });
-function qe() {
-	return o(Ke);
+var Je = r({ contained: !1 });
+function Ye() {
+	return o(Je);
 }
 //#endregion
 //#region src/transition/styles.ts
-function Je(e, t, n = []) {
-	u(() => je(e, t, n), [
+function Xe(e, t, n = []) {
+	u(() => Pe(e, t, n), [
 		e,
 		t,
 		n
@@ -119,29 +119,29 @@ function Je(e, t, n = []) {
 }
 //#endregion
 //#region src/utils/devDiagnostics.ts
-function Ye() {
+function Ze() {
 	return typeof process < "u" && process.env.NODE_ENV !== "production";
 }
-function Xe(e) {
-	!Ye() || typeof console > "u" || console.error(`[flemo] ${e}`);
+function Qe(e) {
+	!Ze() || typeof console > "u" || console.error(`[flemo] ${e}`);
 }
-function Ze(e) {
-	if (Ye()) throw Error(`[flemo] ${e}`);
+function $e(e) {
+	if (Ze()) throw Error(`[flemo] ${e}`);
 }
 //#endregion
 //#region src/RouterDepthContext.ts
-var Qe = r(0), U = r(null), W = [
+var et = r(0), U = r(null), W = [
 	"current",
 	"parent",
 	"root",
 	"nearest-owner"
-], $e = (e) => W.includes(e), G = (e) => {
+], tt = (e) => W.includes(e), G = (e) => {
 	let t = [];
 	for (let n = e; n; n = n.parent) t.push(n);
 	return t;
 };
-function et(e, t, n) {
-	return e.routePaths.length === 0 || e.routePaths.some((e) => e === t) ? !0 : n ? Se(e.routePaths, n) : !1;
+function nt(e, t, n) {
+	return e.routePaths.length === 0 || e.routePaths.some((e) => e === t) ? !0 : n ? Ce(e.routePaths, n) : !1;
 }
 function K(e) {
 	return G(e).map((e, t) => {
@@ -155,7 +155,7 @@ function q({ from: e, target: t, path: n, pathname: r }) {
 		message: null
 	};
 	let i = null, a = null;
-	if (typeof t == "string" ? $e(t) ? i = t : a = t : "scope" in t ? i = t.scope : a = t.name, a !== null) {
+	if (typeof t == "string" ? tt(t) ? i = t : a = t : "scope" in t ? i = t.scope : a = t.name, a !== null) {
 		let t = G(e).find((e) => e.name === a);
 		return t ? {
 			node: t,
@@ -185,7 +185,7 @@ function q({ from: e, target: t, path: n, pathname: r }) {
 				node: e,
 				message: "router: \"nearest-owner\" needs a route to search for, and pop() carries none. Falling back to \"current\" — name the Router explicitly for a cross-Router pop."
 			};
-			let t = G(e).find((e) => et(e, n, r));
+			let t = G(e).find((e) => nt(e, n, r));
 			return t ? {
 				node: t,
 				message: null
@@ -200,15 +200,15 @@ function q({ from: e, target: t, path: n, pathname: r }) {
 		};
 	}
 }
-function tt(e) {
+function rt(e) {
 	if (!e.name) return null;
 	for (let t = e.parent; t; t = t.parent) if (t.name === e.name) return t;
 	return null;
 }
 //#endregion
 //#region src/Slot.tsx
-var nt = { contained: !0 };
-function rt({ children: e, className: t, style: n }) {
+var it = { contained: !0 };
+function at({ children: e, className: t, style: n }) {
 	return /* @__PURE__ */ P("div", {
 		className: t,
 		style: {
@@ -216,34 +216,34 @@ function rt({ children: e, className: t, style: n }) {
 			overflow: "hidden",
 			...n
 		},
-		children: /* @__PURE__ */ P(Ke.Provider, {
-			value: nt,
-			children: /* @__PURE__ */ P(Ge, { children: e })
+		children: /* @__PURE__ */ P(Je.Provider, {
+			value: it,
+			children: /* @__PURE__ */ P(qe, { children: e })
 		})
 	});
 }
 //#endregion
 //#region src/Router.tsx
-function it(e) {
+function ot(e) {
 	let t = null;
 	return n.forEach(e, (e) => {
 		if (t || !i(e)) return;
-		if (e.type === rt) {
+		if (e.type === at) {
 			t = n.toArray(e.props.children).filter(i);
 			return;
 		}
 		let r = e.props.children;
 		if (r) {
-			let e = it(r);
+			let e = ot(r);
 			e && (t = e);
 		}
 	}), t;
 }
-var J = typeof window > "u" ? s : d, at = typeof window > "u" ? s : u, Y = [], ot = [], st = [], ct = { contained: !0 }, lt = 500, ut = 3e3;
-function dt({ children: e, name: t, strictRoutes: r = !1, initPath: a = "/", defaultTransitionName: l = "cupertino", transitions: u = Y, decorators: d = ot, partTransitions: f = st, history: p = "browser", createDriver: ee, className: te, style: ne }) {
-	let re = o(Qe), ie = c(), [ae, oe] = m(!1);
+var J = typeof window > "u" ? s : d, st = typeof window > "u" ? s : u, Y = [], ct = [], lt = [], ut = { contained: !0 }, dt = 500, ft = 3e3;
+function pt({ children: e, name: t, strictRoutes: r = !1, initPath: a = "/", defaultTransitionName: l = "cupertino", transitions: u = Y, decorators: d = ct, partTransitions: f = lt, history: p = "browser", createDriver: ee, className: te, style: ne }) {
+	let re = o(et), ie = c(), [ae, oe] = m(!1);
 	s(() => oe(!0), []);
-	let se = ae ? ie : null, h = re > 0, g = p === "memory", v = c(), y = o(R), ce = o(F), b = h && y.id ? `_F_${ce?.routerKey ?? ""}${y.id}_` : v, x = it(e), le = x !== null, S = (x ?? n.toArray(e).filter(i)).flatMap((e) => e.props?.path ? [e.props.path].flat() : []), C = h ? null : ce, T = C !== null, E = ee ?? _, [D] = m(() => g ? null : E(T ? void 0 : b)), ue = !h && !g && !N(), O = ue && D ? D.readPathname() : a || "/", de = O.indexOf("?"), k = (de >= 0 ? O.slice(0, de) : O) || "/", fe = ue ? window.location.search : de >= 0 ? O.slice(de) : "", [A] = m(() => w({
+	let se = ae ? ie : null, h = re > 0, g = p === "memory", v = c(), y = o(R), ce = o(F), b = h && y.id ? `_F_${ce?.routerKey ?? ""}${y.id}_` : v, x = ot(e), le = x !== null, S = (x ?? n.toArray(e).filter(i)).flatMap((e) => e.props?.path ? [e.props.path].flat() : []), C = h ? null : ce, T = C !== null, E = ee ?? _, [D] = m(() => g ? null : E(T ? void 0 : b)), ue = !h && !g && !xe(), O = ue && D ? D.readPathname() : a || "/", de = O.indexOf("?"), k = (de >= 0 ? O.slice(0, de) : O) || "/", fe = ue ? window.location.search : de >= 0 ? O.slice(de) : "", [A] = m(() => w({
 		routePaths: S,
 		pathname: k,
 		search: fe,
@@ -266,25 +266,25 @@ function dt({ children: e, name: t, strictRoutes: r = !1, initPath: a = "/", def
 		parent: pe,
 		depth: re
 	}));
-	at(() => {
+	st(() => {
 		j.name = t, j.stores = A, j.routePaths = S, j.strictRoutes = r, j.parent = pe;
 	}), s(() => {
-		tt(j) && Xe(`duplicate <Router name="${j.name}">: an enclosing <Router> already uses that name, so \`router\` targets resolve to the nearer one. Give each nested Router a unique name.`);
+		rt(j) && Qe(`duplicate <Router name="${j.name}">: an enclosing <Router> already uses that name, so \`router\` targets resolve to the nearer one. Give each nested Router a unique name.`);
 	}, [j, t]), J(() => (A.life.alive = !0, () => {
 		A.life.alive = !1;
-	}), [A]), Je(u, d, f), s(() => {
-		let e = Ee();
-		if (e !== "off") return e === "on" || ye() ? he() : void 0;
+	}), [A]), Xe(u, d, f), s(() => {
+		let e = ke();
+		if (e !== "off") return e === "on" || N() ? he() : void 0;
 	}, []), s(() => me(), []), s(() => {
 		if (typeof document > "u") return;
 		let e = null, t = null, n = 0, r = () => {
 			let r = Date.now();
-			if (r - n < lt) return;
+			if (r - n < dt) return;
 			n = r, t && clearTimeout(t);
 			let i = e;
 			e = M(), i?.(), t = setTimeout(() => {
 				t = null, e?.(), e = null;
-			}, ut);
+			}, ft);
 		}, i = [
 			"pointerdown",
 			"pointermove",
@@ -298,7 +298,7 @@ function dt({ children: e, name: t, strictRoutes: r = !1, initPath: a = "/", def
 			t && clearTimeout(t), e?.();
 		};
 	}, []), s(() => {
-		g || !D || Pe({
+		g || !D || Le({
 			driver: D,
 			routerKey: T ? null : b,
 			nested: h && !T,
@@ -316,16 +316,16 @@ function dt({ children: e, name: t, strictRoutes: r = !1, initPath: a = "/", def
 		A.history,
 		D
 	]);
-	let ge = le ? e : /* @__PURE__ */ P(Ge, { children: e }), _e = /* @__PURE__ */ P(We.Provider, {
+	let ge = le ? e : /* @__PURE__ */ P(qe, { children: e }), _e = /* @__PURE__ */ P(Ke.Provider, {
 		value: se,
-		children: /* @__PURE__ */ P(Qe.Provider, {
+		children: /* @__PURE__ */ P(et.Provider, {
 			value: re + 1,
 			children: /* @__PURE__ */ P(U.Provider, {
 				value: j,
-				children: /* @__PURE__ */ Re(F.Provider, {
+				children: /* @__PURE__ */ Be(F.Provider, {
 					value: A,
-					children: [!g && /* @__PURE__ */ P(L, {}), h ? /* @__PURE__ */ P(Ke.Provider, {
-						value: ct,
+					children: [!g && /* @__PURE__ */ P(L, {}), h ? /* @__PURE__ */ P(Je.Provider, {
+						value: ut,
 						children: ge
 					}) : ge]
 				})
@@ -344,12 +344,12 @@ function dt({ children: e, name: t, strictRoutes: r = !1, initPath: a = "/", def
 }
 //#endregion
 //#region src/Route.tsx
-function ft({ element: e }) {
+function mt({ element: e }) {
 	return e;
 }
 //#endregion
 //#region src/utils/buildRoutePath.ts
-function pt(e, t) {
+function ht(e, t) {
 	return re(e, t);
 }
 //#endregion
@@ -364,7 +364,7 @@ function X(e) {
 	}, r = (t, r, i) => {
 		let a = t ?? e?.router, o;
 		if (r) try {
-			o = pt(r, i).toPathname;
+			o = ht(r, i).toPathname;
 		} catch {
 			o = void 0;
 		}
@@ -374,14 +374,14 @@ function X(e) {
 			path: r,
 			pathname: o
 		});
-		if (!s) return Ze(c ?? "the requested Router could not be resolved."), null;
-		if (c && Xe(c), r && !et(s, r, o)) {
+		if (!s) return $e(c ?? "the requested Router could not be resolved."), null;
+		if (c && Qe(c), r && !nt(s, r, o)) {
 			let e = `"${r}" is not declared by ${s.name ? `<Router name="${s.name}">` : "the target <Router>"}, so the navigation cannot mount a screen there. Declare a matching <Route>, target the Router that owns it, or use \`router: "nearest-owner"\`.`;
-			a !== void 0 || s.strictRoutes ? Ze(e) : Xe(e);
+			a !== void 0 || s.strictRoutes ? $e(e) : Qe(e);
 		}
 		return b({
 			stores: s.stores,
-			buildPathname: (e, t) => pt(e, t),
+			buildPathname: (e, t) => ht(e, t),
 			driver: s.stores.driver,
 			markSelfInduced: s.stores.markSelfInduced
 		});
@@ -403,21 +403,21 @@ function X(e) {
 }
 //#endregion
 //#region src/navigate/usePathname.ts
-function mt() {
+function gt() {
 	return H((e) => e.histories[e.pendingIndex]?.pathname ?? "/");
 }
 //#endregion
 //#region src/navigate/useStep.ts
-function ht() {
-	let { routePath: e } = z(), t = I(), n = o(Be), { driver: r, markSelfInduced: i } = t, [a, c] = m(null);
+function _t() {
+	let { routePath: e } = z(), t = I(), n = o(He), { driver: r, markSelfInduced: i } = t, [a, c] = m(null);
 	s(() => {
-		if (!e) return c(Ae(r.readState())), r.subscribe((e) => c(Ae(e.state)));
+		if (!e) return c(Ne(r.readState())), r.subscribe((e) => c(Ne(e.state)));
 	}, [e, r]);
 	let l = D({
 		stores: t,
 		driver: r,
 		markSelfInduced: i,
-		buildStepPathname: (t) => e ? pt(e, t).pathname : ne(r.readPathname(), t),
+		buildStepPathname: (t) => e ? ht(e, t).pathname : ne(r.readPathname(), t),
 		applyParams: (t) => {
 			n({
 				type: "SET",
@@ -434,23 +434,23 @@ function ht() {
 }
 //#endregion
 //#region src/screen/ParamsProvider/useParams.ts
-function gt() {
+function vt() {
 	return o(B);
 }
 //#endregion
 //#region src/screen/ScreenFreeze.tsx
-var _t = 3e3;
-function vt({ freeze: e, children: n }) {
+var yt = 3e3;
+function bt({ freeze: e, children: n }) {
 	let [r, i] = m(e), a = p(null);
 	return !e && r && i(!1), s(() => {
 		if (!(!e || r)) {
-			if (!Ie()) {
+			if (!ye()) {
 				i(!0);
 				return;
 			}
 			return a.current = setTimeout(() => {
 				a.current = null, i(!0);
-			}, _t), () => {
+			}, yt), () => {
 				a.current !== null && (clearTimeout(a.current), a.current = null);
 			};
 		}
@@ -461,22 +461,22 @@ function vt({ freeze: e, children: n }) {
 }
 //#endregion
 //#region src/screen/scopeAnimHoldCoordinator.ts
-var Z = /* @__PURE__ */ new WeakMap();
-function yt(e) {
-	let t = Z.get(e);
-	return t || (t = h(), Z.set(e, t)), t;
+var xt = /* @__PURE__ */ new WeakMap();
+function St(e) {
+	let t = xt.get(e);
+	return t || (t = h(), xt.set(e, t)), t;
 }
 //#endregion
 //#region src/stores/useNavigateStore.ts
-function bt(e) {
+function Ct(e) {
 	return V(I().navigate, e);
 }
 //#endregion
 //#region src/screen/ScreenDecorator.tsx
-function xt({ ref: e, style: t, ...n }) {
+function wt({ ref: e, style: t, ...n }) {
 	let { isActive: r, isPrev: i, transitionName: a } = z(), o = p(null);
 	l(e, () => o.current);
-	let s = bt((e) => i ? "COMPLETED" : e.status), { decoratorName: c } = Ne(a), u = fe.get(c);
+	let s = Ct((e) => i ? "COMPLETED" : e.status), { decoratorName: c } = Ie(a), u = fe.get(c);
 	return u ? /* @__PURE__ */ P("div", {
 		ref: o,
 		"data-flemo-decorator": !0,
@@ -498,9 +498,9 @@ function xt({ ref: e, style: t, ...n }) {
 }
 //#endregion
 //#region src/screen/useViewportScrollHeight.ts
-function St() {
+function Tt() {
 	let [e, t] = m(0), [n, r] = m(0);
-	return s(() => we((e, n) => {
+	return s(() => Te((e, n) => {
 		r(n), t(e);
 	}), []), {
 		viewportScrollHeight: e,
@@ -509,9 +509,9 @@ function St() {
 }
 //#endregion
 //#region src/utils/useHydrationSafeFlag.ts
-var Q = () => () => {}, Ct = () => !1;
-function wt(e) {
-	return ee(Q, e, Ct);
+var Z = () => () => {}, Q = () => !1;
+function Et(e) {
+	return ee(Z, e, Q);
 }
 //#endregion
 //#region src/stores/useScreenStore.ts
@@ -520,26 +520,26 @@ function $(e) {
 }
 //#endregion
 //#region src/screen/ScreenMotion.tsx
-function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigationBarHeight: r, systemNavigationBarColor: i, sharedTopBar: c, sharedTopBarId: l, sharedBottomBar: u, sharedBottomBarId: f, topBar: ee, bottomBar: ne, hideStatusBar: re, hideSystemNavigationBar: oe, backgroundColor: se = "white", contentScrollable: h = !0, ...g }) {
-	let { id: _, isActive: v, isRoot: y, isPrev: ce, zIndex: b, transitionName: x, prevTransitionName: le } = z(), { contained: S } = qe(), C = S ? "absolute" : "fixed", w = I(), T = o(We), E = H((e) => e.index), D = H((e) => e.histories), O = v || b === E - 1, k = bt((e) => O ? e.status : "COMPLETED"), me = $((e) => e.dragStatus), he = $((e) => e.replaceTransitionStatus), j = w.screen.getState().setDragStatus, _e = w.screen.getState().setReplaceTransitionStatus, M = v ? D[E - 1]?.id : D[E]?.id, ye = $((e) => M ? e.sharedBars[M] : void 0), N = $((e) => M ? e.sharedBarMetadata[M] : void 0), xe = $((e) => M ? e.screenSurfaces[M] : void 0), Se = p(null);
+function Dt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigationBarHeight: r, systemNavigationBarColor: i, sharedTopBar: c, sharedTopBarId: l, sharedBottomBar: u, sharedBottomBarId: f, topBar: ee, bottomBar: ne, hideStatusBar: re, hideSystemNavigationBar: oe, backgroundColor: se = "white", contentScrollable: h = !0, ...g }) {
+	let { id: _, isActive: v, isRoot: y, isPrev: ce, zIndex: b, transitionName: x, prevTransitionName: le } = z(), { contained: S } = Ye(), C = S ? "absolute" : "fixed", w = I(), T = o(Ke), E = H((e) => e.index), D = H((e) => e.histories), O = v || b === E - 1, k = Ct((e) => O ? e.status : "COMPLETED"), me = $((e) => e.dragStatus), he = $((e) => e.replaceTransitionStatus), j = w.screen.getState().setDragStatus, _e = w.screen.getState().setReplaceTransitionStatus, M = v ? D[E - 1]?.id : D[E]?.id, ye = $((e) => M ? e.sharedBars[M] : void 0), N = $((e) => M ? e.sharedBarMetadata[M] : void 0), xe = $((e) => M ? e.screenSurfaces[M] : void 0), Se = p(null);
 	Se.current ||= de({
 		getTransitionTaskId: () => w.navigate.getState().transitionTaskId,
 		setDragStatus: j,
 		setReplaceTransitionStatus: _e
 	});
-	let we = Se.current, Te = p(null);
-	Te.current ||= yt(w.navigate);
-	let Ee = Ne(x), { initial: Ae, swipeDirection: je, decoratorName: Me } = Ee, Pe = fe.get(Me), { viewportScrollHeight: Ie } = St(), Le = Ie > 0, F = !!c, L = !!u, R = F ? `${typeof l}:${String(l)}` : null, B = L ? `${typeof f}:${String(f)}` : null, [Be, Ve] = m({
+	let Ce = Se.current, Te = p(null);
+	Te.current ||= St(w.navigate);
+	let Ee = Ie(x), { initial: ke, swipeDirection: Ne, decoratorName: Pe } = Ee, Fe = fe.get(Pe), { viewportScrollHeight: Le } = Tt(), ze = Le > 0, F = !!c, L = !!u, R = F ? `${typeof l}:${String(l)}` : null, B = L ? `${typeof f}:${String(f)}` : null, [He, Ue] = m({
 		key: R,
 		height: 0
-	}), [He, Ue] = m({
+	}), [We, Ge] = m({
 		key: B,
 		height: 0
-	}), V = p(Be), Ge = p(He), Ke = Be.key === R ? Be.height : 0, Je = He.key === B ? He.height : 0, Ye = Fe(F ? { id: l } : void 0, N?.topBar) ? N?.topBar?.height ?? 0 : 0, Xe = Fe(L ? { id: f } : void 0, N?.bottomBar) ? N?.bottomBar?.height ?? 0 : 0, Ze = Ke || Ye, Qe = Je || Xe, U = p(null), W = p(null), $e = p(null), G = p(null), et = p(null), K = p(null), q = p(null), tt = a((e) => {
+	}), V = p(He), qe = p(We), Je = He.key === R ? He.height : 0, Xe = We.key === B ? We.height : 0, Ze = Re(F ? { id: l } : void 0, N?.topBar) ? N?.topBar?.height ?? 0 : 0, Qe = Re(L ? { id: f } : void 0, N?.bottomBar) ? N?.bottomBar?.height ?? 0 : 0, $e = Je || Ze, et = Xe || Qe, U = p(null), W = p(null), tt = p(null), G = p(null), nt = p(null), K = p(null), q = p(null), rt = a((e) => {
 		e <= 0 || R === null || (G.current && (G.current.style.minHeight = `${e}px`), V.current = {
 			key: R,
 			height: e
-		}, Ve((t) => t.key === R && t.height === e ? t : {
+		}, Ue((t) => t.key === R && t.height === e ? t : {
 			key: R,
 			height: e
 		}), w.screen.getState().updateSharedBarHeight(_, "topBar", e));
@@ -547,11 +547,11 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 		_,
 		w.screen,
 		R
-	]), nt = a((e) => {
-		e <= 0 || B === null || (et.current && (et.current.style.minHeight = `${e}px`), Ge.current = {
+	]), it = a((e) => {
+		e <= 0 || B === null || (nt.current && (nt.current.style.minHeight = `${e}px`), qe.current = {
 			key: B,
 			height: e
-		}, Ue((t) => t.key === B && t.height === e ? t : {
+		}, Ge((t) => t.key === B && t.height === e ? t : {
 			key: B,
 			height: e
 		}), w.screen.getState().updateSharedBarHeight(_, "bottomBar", e));
@@ -559,18 +559,18 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 		B,
 		_,
 		w.screen
-	]), rt = a((e) => {
-		K.current = e, e?.offsetHeight && tt(e.offsetHeight);
-	}, [tt]), it = a((e) => {
-		q.current = e, e?.offsetHeight && nt(e.offsetHeight);
-	}, [nt]), J = p({
+	]), at = a((e) => {
+		K.current = e, e?.offsetHeight && rt(e.offsetHeight);
+	}, [rt]), ot = a((e) => {
+		q.current = e, e?.offsetHeight && it(e.offsetHeight);
+	}, [it]), J = p({
 		transition: Ee,
-		decorator: Pe,
+		decorator: Fe,
 		hasSharedTopBar: !!c,
 		hasSharedBottomBar: !!u,
 		sharedTopBarId: l,
 		sharedBottomBarId: f,
-		viewportScrollHeight: Ie,
+		viewportScrollHeight: Le,
 		isRoot: y,
 		isActive: v,
 		status: k,
@@ -579,26 +579,26 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 	});
 	J.current = {
 		transition: Ee,
-		decorator: Pe,
+		decorator: Fe,
 		hasSharedTopBar: !!c,
 		hasSharedBottomBar: !!u,
 		sharedTopBarId: l,
 		sharedBottomBarId: f,
-		viewportScrollHeight: Ie,
+		viewportScrollHeight: Le,
 		isRoot: y,
 		isActive: v,
 		status: k,
 		dragStatus: me,
 		index: E
 	};
-	let at = p(null);
-	at.current ||= ue({
+	let st = p(null);
+	st.current ||= ue({
 		getTransition: () => J.current.transition,
 		getDecorator: () => J.current.decorator,
 		getElements: () => ({
 			scope: W.current,
 			screenContainer: U.current,
-			decorator: $e.current,
+			decorator: tt.current,
 			sharedTopBar: K.current,
 			sharedBottomBar: q.current
 		}),
@@ -622,7 +622,7 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 		setDragStatus: j,
 		back: () => window.history.back()
 	});
-	let Y = at.current, ot = (e) => Y.pointerDown(e.nativeEvent), st = (e) => Y.pointerMove(e.nativeEvent), ct = (e) => Y.pointerUp(e.nativeEvent), lt = (e) => Y.pointerCancel(e.nativeEvent), ut = (e) => {
+	let Y = st.current, ct = (e) => Y.pointerDown(e.nativeEvent), lt = (e) => Y.pointerMove(e.nativeEvent), ut = (e) => Y.pointerUp(e.nativeEvent), dt = (e) => Y.pointerCancel(e.nativeEvent), ft = (e) => {
 		(k === "PUSHING" || k === "REPLACING") && (e.preventDefault(), e.stopPropagation());
 	};
 	s(() => {
@@ -637,7 +637,7 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 			e.removeEventListener("touchmove", t);
 		};
 	}, [Y]), d(() => {
-		let { registerSharedBars: e, unregisterSharedBars: t } = w.screen.getState(), n = V.current, r = Ge.current;
+		let { registerSharedBars: e, unregisterSharedBars: t } = w.screen.getState(), n = V.current, r = qe.current;
 		return e(_, {
 			topBar: F,
 			bottomBar: L
@@ -662,11 +662,11 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 		R
 	]), d(() => {
 		let e = K.current;
-		if (e) return Ce(e, tt);
-	}, [tt, c]), d(() => {
+		if (e) return we(e, rt);
+	}, [rt, c]), d(() => {
 		let e = q.current;
-		if (e) return Ce(e, nt);
-	}, [nt, u]), d(() => {
+		if (e) return we(e, it);
+	}, [it, u]), d(() => {
 		let e = W.current;
 		if (!e) return;
 		let { registerScreenSurface: t, unregisterScreenSurface: n } = w.screen.getState();
@@ -677,9 +677,9 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 		k,
 		w.screen
 	]);
-	let dt = O, { app: ft, nav: pt } = ie({
+	let pt = O, { app: mt, nav: ht } = ie({
 		status: k,
-		isTopOrTopPrev: dt,
+		isTopOrTopPrev: pt,
 		hasTopBar: F,
 		hasNavBar: L,
 		topBarId: l,
@@ -688,9 +688,9 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 		partnerMetadata: N
 	}), X = te({
 		status: k,
-		isTopOrTopPrev: dt,
+		isTopOrTopPrev: pt,
 		transitionName: x
-	}), mt = ae({
+	}), gt = ae({
 		isActive: v,
 		isPrev: ce,
 		zIndex: b,
@@ -698,19 +698,19 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 		status: k,
 		dragStatus: me,
 		replaceTransitionStatus: he
-	}), ht = p(mt), gt = p(X !== null && mt), [_t, vt] = m({
+	}), _t = p(gt), vt = p(X !== null && gt), yt = p(null), [bt, xt] = m({
 		key: X,
 		released: X === null
 	});
-	_t.key !== X && (vt({
+	bt.key !== X && (xt({
 		key: X,
 		released: X === null
-	}), gt.current = X !== null && ht.current), ht.current = mt;
-	let Z = X !== null && _t.key === X && !_t.released, Q = Z ? !v && xe?.opaqueBackground ? "park" : v && (k === "PUSHING" || k === "REPLACING") && xe?.opaqueBackground ? Oe() ? "park-over" : "park-under" : "true" : "false", Ct = wt(De);
-	d(() => we.driveScreenLifecycle({
+	}), yt.current = null, vt.current = X !== null && _t.current), _t.current = gt;
+	let Z = X !== null && bt.key === X && !bt.released && yt.current !== X, Q = Z ? !v && xe?.opaqueBackground ? "park" : v && (k === "PUSHING" || k === "REPLACING") && xe?.opaqueBackground ? je() || ve() ? "park-over" : "park-under" : "true" : "false", Dt = Et(Ae);
+	d(() => Ce.driveScreenLifecycle({
 		getElements: () => ({
 			scope: W.current,
-			decorator: $e.current,
+			decorator: tt.current,
 			bars: [K.current, q.current]
 		}),
 		transitionName: x,
@@ -719,7 +719,7 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 		isActive: v,
 		animHoldReleased: !Z
 	}), [
-		we,
+		Ce,
 		k,
 		v,
 		le,
@@ -729,23 +729,27 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 		if (!Z || X === null) return;
 		let e = X, t = w.navigate.getState().transitionTaskId, n = t === null ? e : `${e}#${t}`;
 		return Te.current.join(n, () => {
-			if ((J.current.transition.driver === "native" || ve()) && !A()) {
+			let t = (J.current.transition.driver === "native" || ve() || Oe()) && !A();
+			if (t) {
 				for (let e of [
 					W.current,
 					K.current,
 					q.current,
-					$e.current
+					tt.current
 				]) e?.isConnected && e.getAttribute("data-flemo-anim-hold") !== null && e.setAttribute("data-flemo-anim-hold", "false");
-				U.current && (U.current.style.zIndex = "");
+				U.current && (U.current.style.zIndex = ""), yt.current = e;
+			}
+			{
+				let n = () => xt((t) => t.key === e && !t.released ? {
+					key: e,
+					released: !0
+				} : t);
+				t && De() && typeof requestAnimationFrame == "function" ? requestAnimationFrame(() => n()) : Ve(n);
 			}
-			ze(() => vt((t) => t.key === e && !t.released ? {
-				key: e,
-				released: !0
-			} : t));
 		}, {
 			scope: W.current,
-			decodeWait: gt.current,
-			contentSettle: ke() && (v && k === "PUSHING" || k === "POPPING") ? {
+			decodeWait: vt.current,
+			contentSettle: Me() && (v && k === "PUSHING" || k === "POPPING") ? {
 				firstWaitMs: 120,
 				capMs: 700,
 				graceMs: 60,
@@ -761,14 +765,14 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 		k,
 		w.navigate
 	]);
-	let Tt = Q === "park-under" || Q === "park-over" ? {} : ge({
-		initial: Ae,
+	let Ot = Q === "park-under" || Q === "park-over" ? {} : ge({
+		initial: ke,
 		isActive: v,
 		status: k
 	});
-	return /* @__PURE__ */ Re("div", {
+	return /* @__PURE__ */ Be("div", {
 		ref: U,
-		onClickCapture: ut,
+		onClickCapture: ft,
 		style: {
 			position: C,
 			top: 0,
@@ -783,13 +787,13 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 			overscrollBehavior: "contain"
 		},
 		children: [
-			/* @__PURE__ */ Re("div", {
+			/* @__PURE__ */ Be("div", {
 				ref: W,
 				...g,
-				onPointerDown: ot,
-				onPointerMove: st,
-				onPointerUp: ct,
-				onPointerCancel: lt,
+				onPointerDown: ct,
+				onPointerMove: lt,
+				onPointerUp: ut,
+				onPointerCancel: dt,
 				"data-flemo-screen": !0,
 				"data-flemo-router": T ?? void 0,
 				"data-flemo-transition": x,
@@ -802,9 +806,9 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 					height: "100%",
 					backgroundColor: se,
 					overflowY: h ? void 0 : "auto",
-					touchAction: je === "x" ? "pan-y" : je === "y" ? "pan-x" : "auto",
-					...Ct && (Q !== "false" || b === E && !S) ? { willChange: "transform" } : {},
-					...Tt,
+					touchAction: Ne === "x" ? "pan-y" : Ne === "y" ? "pan-x" : "auto",
+					...Dt && (Q !== "false" || b === E && !S) ? { willChange: "transform" } : {},
+					...Ot,
 					...g.style
 				},
 				children: [
@@ -823,7 +827,7 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 						"data-flemo-bar-spacer": "app",
 						style: {
 							width: "100%",
-							minHeight: Ze
+							minHeight: $e
 						}
 					}),
 					ee,
@@ -838,17 +842,17 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 					}),
 					ne,
 					u && /* @__PURE__ */ P("div", {
-						ref: et,
+						ref: nt,
 						"data-flemo-bar-spacer": "nav",
 						style: {
-							display: Le ? "none" : void 0,
+							display: ze ? "none" : void 0,
 							width: "100%",
-							minHeight: Qe
+							minHeight: et
 						}
 					}),
 					!oe && r && /* @__PURE__ */ P("div", {
 						style: {
-							display: Le ? "none" : void 0,
+							display: ze ? "none" : void 0,
 							minHeight: r
 						},
 						children: /* @__PURE__ */ P("div", { style: {
@@ -862,7 +866,7 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 				]
 			}),
 			c && /* @__PURE__ */ P("div", {
-				ref: rt,
+				ref: at,
 				"data-flemo-bar": "app",
 				"data-flemo-bar-id": l,
 				"data-flemo-bar-id-type": l === void 0 ? void 0 : typeof l,
@@ -870,7 +874,7 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 				"data-flemo-bar-transition": x,
 				"data-flemo-bar-status": k,
 				"data-flemo-bar-active": v ? "true" : "false",
-				"data-flemo-bar-riding": ft ? "true" : "false",
+				"data-flemo-bar-riding": mt ? "true" : "false",
 				"data-flemo-anim-hold": Q,
 				style: {
 					position: C,
@@ -882,7 +886,7 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 				children: c
 			}),
 			u && /* @__PURE__ */ P("div", {
-				ref: it,
+				ref: ot,
 				"data-flemo-bar": "nav",
 				"data-flemo-bar-id": f,
 				"data-flemo-bar-id-type": f === void 0 ? void 0 : typeof f,
@@ -890,10 +894,10 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 				"data-flemo-bar-transition": x,
 				"data-flemo-bar-status": k,
 				"data-flemo-bar-active": v ? "true" : "false",
-				"data-flemo-bar-riding": pt ? "true" : "false",
+				"data-flemo-bar-riding": ht ? "true" : "false",
 				"data-flemo-anim-hold": Q,
 				style: {
-					display: Le ? "none" : void 0,
+					display: ze ? "none" : void 0,
 					position: C,
 					bottom: oe ? 0 : r,
 					left: 0,
@@ -902,8 +906,8 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 				},
 				children: u
 			}),
-			Pe && /* @__PURE__ */ P(xt, {
-				ref: $e,
+			Fe && /* @__PURE__ */ P(wt, {
+				ref: tt,
 				"data-flemo-anim-hold": Q
 			})
 		]
@@ -911,8 +915,8 @@ function Tt({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
 }
 //#endregion
 //#region src/screen/Screen.tsx
-function Et({ children: e, ...t }) {
-	let { isActive: n, isPrev: r, zIndex: i } = z(), a = H((e) => e.index), o = bt((e) => e.status), c = $((e) => e.dragStatus), l = $((e) => e.replaceTransitionStatus), u = oe({
+function Ot({ children: e, ...t }) {
+	let { isActive: n, isPrev: r, zIndex: i } = z(), a = H((e) => e.index), o = Ct((e) => e.status), c = $((e) => e.dragStatus), l = $((e) => e.replaceTransitionStatus), u = oe({
 		isActive: n,
 		isPrev: r,
 		zIndex: i,
@@ -923,21 +927,21 @@ function Et({ children: e, ...t }) {
 	}), [d, f] = m(u !== "live");
 	return u === "live" && d && f(!1), u === "immediate" && !d && f(!0), s(() => {
 		if (u !== "deferred" || d) return;
-		let e = setTimeout(() => f(!0), Dt);
+		let e = setTimeout(() => f(!0), kt);
 		return () => clearTimeout(e);
-	}, [u, d]), /* @__PURE__ */ P(vt, {
+	}, [u, d]), /* @__PURE__ */ P(bt, {
 		freeze: d,
-		children: /* @__PURE__ */ P(Tt, {
+		children: /* @__PURE__ */ P(Dt, {
 			...t,
 			children: e
 		})
 	});
 }
-var Dt = 600;
+var kt = 600;
 //#endregion
 //#region src/screen/Part.tsx
-function Ot({ ref: e, name: t, style: n, children: r, ...i }) {
-	let { isActive: a, isPrev: s, navigateStore: c, routerId: l } = z(), u = o(We), d = l ?? u ?? void 0, f = I(), p = V(c ?? f.navigate, (e) => s ? "COMPLETED" : e.status);
+function At({ ref: e, name: t, style: n, children: r, ...i }) {
+	let { isActive: a, isPrev: s, navigateStore: c, routerId: l } = z(), u = o(Ke), d = l ?? u ?? void 0, f = I(), p = V(c ?? f.navigate, (e) => s ? "COMPLETED" : e.status);
 	return /* @__PURE__ */ P("div", {
 		ref: e,
 		"data-flemo-part-name": t,
@@ -951,14 +955,14 @@ function Ot({ ref: e, name: t, style: n, children: r, ...i }) {
 }
 //#endregion
 //#region src/stores/RouterScopeProvider.tsx
-function kt({ children: e }) {
+function jt({ children: e }) {
 	let [t] = m(() => ({
 		history: y(),
 		navigate: ce(),
 		transition: k(),
 		screen: E(),
 		driver: _(),
-		markSelfInduced: xe,
+		markSelfInduced: Se,
 		consume: se,
 		life: { alive: !0 }
 	}));
@@ -968,4 +972,4 @@ function kt({ children: e }) {
 	});
 }
 //#endregion
-export { Ot as Part, ft as Route, dt as Router, kt as RouterScopeProvider, Et as Screen, R as ScreenContext, xt as ScreenDecorator, vt as ScreenFreeze, Tt as ScreenMotion, rt as Slot, g as createBrowserHistoryDriver, v as createDecorator, x as createPartTransition, le as createRawDecorator, S as createRawPartTransition, C as createRawTransition, O as createTransition, Te as partTransitionMap, H as useHistoryStore, X as useNavigate, bt as useNavigateStore, gt as useParams, mt as usePathname, z as useScreen, $ as useScreenStore, ht as useStep, I as useStores, St as useViewportScrollHeight };
+export { At as Part, mt as Route, pt as Router, jt as RouterScopeProvider, Ot as Screen, R as ScreenContext, wt as ScreenDecorator, bt as ScreenFreeze, Dt as ScreenMotion, at as Slot, g as createBrowserHistoryDriver, v as createDecorator, x as createPartTransition, le as createRawDecorator, S as createRawPartTransition, C as createRawTransition, O as createTransition, Ee as partTransitionMap, H as useHistoryStore, X as useNavigate, Ct as useNavigateStore, vt as useParams, gt as usePathname, z as useScreen, $ as useScreenStore, _t as useStep, I as useStores, Tt as useViewportScrollHeight };

package/dist/screen/__tests__/ScreenMotion.desktopReleaseFlip.test.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flemo/react",
-  "version": "1.12.1",
+  "version": "1.12.3",
   "description": "React bindings for flemo: Router, Route, Screen, and the screen-transition runtime.",
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
@@ -36,7 +36,7 @@
   "dependencies": {
     "path-to-regexp": "^8.4.2",
     "zustand": "^5.0.14",
-    "@flemo/core": "1.25.1"
+    "@flemo/core": "1.27.0"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",