@moku-labs/game 0.15.11 → 0.15.13

package/dist/{src-0m2mjRDI.mjs → src-3_HjYegY.mjs}

@@ -2,9 +2,10 @@ import { t as __exportAll } from "./rolldown-runtime-8H4AJuhK.mjs";
 import { r as systemSource, t as memory } from "./memory-CWlqhS7l.mjs";
 import { a as finishDrafts, i as enableDraftPatches, n as deepFreeze$1, o as openDrafts, r as dropDrafts } from "./drafts-BawpSaVp.mjs";
 import { d as graphHash, f as isRestCheckpoint, h as pushEntry, i as servePaused, l as findNode, m as compact, n as captureFrame, o as collectFlows, p as slotNames, r as serveCaptures, s as describeGraph, t as cancelCaptures, u as framePath } from "./capture-D7XvoHdH.mjs";
-import { A as Now, C as Sprite, E as componentsFor, F as resource, I as system, L as systemsFor, M as Tree, N as component, O as Exiting, R as tag, S as Shape, T as arcDefaults, _ as HudPart, b as OverlayLevel, c as Countdown, d as builtInStyles, g as Display, h as textFor, i as samePose, j as Order, k as Layer, l as Text, m as readStyle, n as drawnRect, o as visualOf$1, r as fitScaleOf, s as visualRectOf, t as CONTENT$1, v as NineSlice, w as Transform, x as Parent, y as Overlay } from "./visual-Dwfy9wDb.mjs";
+import { $ as component, A as localPoseOf, B as OverlayLevel, C as builtInStyles, D as textFor, E as readStyle, F as rootPoseOf, G as arcDefaults, H as Shape, I as Display, J as Exiting, K as componentsFor, L as HudPart, M as poseUnder, N as rootPointOf, O as applyPose, P as rootPoseInto, Q as Tree, R as NineSlice, U as Sprite, V as Parent, W as Transform, X as Now, Y as Layer, Z as Order, _ as uiFor, a as visualOf$1, b as Countdown, c as Covered, d as LocalWrite, f as Scroll, h as UiCounters, i as samePose, it as tag, j as parentOf$1, k as isLeaving, l as DebugTrigger, m as UI_OWNER, n as drawnRect, nt as system, o as visualRectOf, p as ScrollState, r as fitScaleOf, rt as systemsFor, s as Box, t as CONTENT$1, tt as resource, u as Escapable, x as Text, z as Overlay } from "./visual-CbGKzlj0.mjs";
 import { a as isDev } from "./dev-BNndV-hU.mjs";
-import { i as isComponentDefinition, n as flatten, r as defineComponent } from "./flatten-BkXuscAV.mjs";
+import { n as isComponentDefinition } from "./component-DGg5DqKK.mjs";
+import { n as flatten } from "./flatten-nUX9PpGo.mjs";
 import { envPlugin, logPlugin } from "@moku-labs/common/browser";
 import { createCoreConfig } from "@moku-labs/core";
 /**
@@ -8797,6 +8798,8 @@ function schemaOf(types) {
 //#region src/plugins/world/ecs/systems.ts
 /** The one phase that runs in every mode, because `renderer.sync` lives in it. */
 const ALWAYS = "sync";
+/** The system that hands the world to Pixi: the last of its phase, so a frame draws what every system wrote. */
+const DRAWS = "renderer.sync";
 /** Rows a timing table holds before it first grows. */
 const TIMING_ROWS = 16;
 /** The four phases, in frame order. */
@@ -8895,7 +8898,7 @@ function storeSlots(count) {
 	return slots;
 }
 /**
-* Registers a system at the end of its phase list and returns the remover. Its query and its
+* Registers a system at the end of its phase list, before `renderer.sync` in phase `sync`, and returns the remover. Its query and its
 * `scenes` are read here, once: a later change to the definition is not seen. A dev build checks
 * the `scenes` against the scenes the features declare, once the world started.
 *
@@ -8925,7 +8928,9 @@ function registerSystem(ctx, definition) {
 		walk: plan.names.length === 0 ? void 0 : new SystemWalk(ctx, plan)
 	};
 	const list = state.systems[definition.phase];
-	list.push(entry);
+	const draws = list.findIndex((known) => known.definition.name === DRAWS);
+	if (draws === -1) list.push(entry);
+	else list.splice(draws, 0, entry);
 	if (state.timing !== void 0) giveRow(state, state.timing, definition.name);
 	return () => {
 		const at = list.indexOf(entry);
@@ -24379,250 +24384,6 @@ function destroyPools(state) {
 	state.pooled = 0;
 }
 //#endregion
-//#region src/plugins/renderer/sync/pose.ts
-/**
-* @file renderer/sync — the pose helpers: where an entity really is, in root (reference) space,
-* and the local pose that puts it there under a parent. Pure component math over `world.ecs.get`,
-* the same math the renderer draws with: `position` is where the `pivot` lands, and the pivot is
-* the local point the view turns and scales around.
-*
-* Engine-internal, not a root export. `input`, `anim` and `ui` import `rootPoseOf` and
-* `localPoseOf` from this module path (`../renderer/sync/pose`) and never walk the `Parent` chain
-* themselves; a per-frame reader (`effects`' following emitters) writes the root pose into its own
-* object with `rootPoseInto`, which allocates nothing; `input` places a carried view under the last pose of a despawned held view with
-* `poseUnder`; `sync` places a box with `rootPointOf`. `input` places the drop lookup of an aimed
-* view with `applyPose`.
-*/
-/** How deep a parent chain is followed; deeper is treated as a loop. */
-const MAX_DEPTH$6 = 32;
-/**
-* The parent an entity moves with.
-*
-* @param ecs - The world read.
-* @param entity - The entity.
-* @returns The parent entity, or `0` when it has none or names itself.
-*/
-function parentOf$1(ecs, entity) {
-	const parent = ecs.get(entity, Parent)?.entity ?? 0;
-	return parent === entity ? 0 : parent;
-}
-/**
-* Tells whether an entity is on its way out: it or an ancestor of its `Parent` chain carries `Exiting` (a ui element
-* whose exit plays, a world view in its exit queue). Its despawn is coming; nothing else of the teardown is owed.
-*
-* @param ecs - The world read.
-* @param entity - The entity.
-* @returns True while it, or what it hangs under, leaves.
-*/
-function isLeaving(ecs, entity) {
-	let current = entity;
-	for (let depth = 0; depth < MAX_DEPTH$6 && current !== 0; depth += 1) {
-		if (ecs.has(current, Exiting)) return true;
-		current = parentOf$1(ecs, current);
-	}
-	return false;
-}
-/**
-* A fresh copy of a pose, so a caller may change what it got without touching the world.
-*
-* @param pose - The pose to copy.
-* @returns The same numbers in new objects.
-* @example
-* ```ts
-* copyPose({ x: 1, y: 2, rotation: 0, scale: 1, pivot: { x: 0, y: 0 } }).pivot.x; // 0
-* ```
-*/
-function copyPose(pose) {
-	return {
-		x: pose.x,
-		y: pose.y,
-		rotation: pose.rotation,
-		scale: pose.scale,
-		pivot: {
-			x: pose.pivot.x,
-			y: pose.pivot.y
-		}
-	};
-}
-/**
-* Moves a point out of the local space of a pose, into the space the pose sits in.
-*
-* @param pose - The pose whose local space the point is in.
-* @param point - The local point.
-* @returns The point one space higher.
-* @example
-* ```ts
-* applyPose({ x: 10, y: 0, rotation: 0, scale: 2, pivot: { x: 5, y: 0 } }, { x: 5, y: 1 });
-* // { x: 10, y: 2 }
-* ```
-*/
-function applyPose(pose, point) {
-	const cos = Math.cos(pose.rotation);
-	const sin = Math.sin(pose.rotation);
-	const dx = point.x - pose.pivot.x;
-	const dy = point.y - pose.pivot.y;
-	return {
-		x: pose.x + pose.scale * (dx * cos - dy * sin),
-		y: pose.y + pose.scale * (dx * sin + dy * cos)
-	};
-}
-/**
-* Places a local pose under a parent pose: the pose in the space the parent sits in. The step
-* `rootPoseOf` takes once per parent: the position through the parent's pivot, rotation, scale
-* and position, the rotations added and the scales multiplied.
-*
-* @param above - The parent pose.
-* @param local - The pose under it.
-* @returns The composed pose; it keeps the local pivot.
-* @example
-* ```ts
-* poseUnder(
-*   { x: 400, y: 300, rotation: 0, scale: 2, pivot: { x: 0, y: 0 } },
-*   { x: 0, y: 30, rotation: 0, scale: 1, pivot: { x: 0, y: 0 } }
-* ); // { x: 400, y: 360, rotation: 0, scale: 2, pivot: { x: 0, y: 0 } }
-* ```
-*/
-function poseUnder(above, local) {
-	const landed = applyPose(above, local);
-	return {
-		x: landed.x,
-		y: landed.y,
-		rotation: local.rotation + above.rotation,
-		scale: local.scale * above.scale,
-		pivot: {
-			x: local.pivot.x,
-			y: local.pivot.y
-		}
-	};
-}
-/**
-* Where an entity really is, written into the caller's pose: its `Transform` composed through the `Parent` chain,
-* every pivot on the way applied, the numbers of `rootPoseOf` (the same steps in the same order). The answer keeps the
-* entity's own pivot. Allocates nothing: a reader that asks every frame passes the same object.
-*
-* @param ecs - The world read, `world.ecs`.
-* @param entity - The entity to place.
-* @param out - The pose to write, its `pivot` object included; it may be `own`.
-* @param own - A pose to use in place of the entity's own `Transform`, such as its rest pose.
-* @returns `out`, in root space. An entity without a `Transform` sits at the identity pose.
-* @example
-* ```ts
-* // `effects` follows a host every frame: the slot sits at (40, 60) scaled 0.5, the host at (100, 200) inside it.
-* const pose = { x: 0, y: 0, rotation: 0, scale: 1, pivot: { x: 0, y: 0 } };
-* rootPoseInto(ctx.require(worldPlugin).ecs, host, pose);
-* // pose is { x: 90, y: 160, rotation: 0, scale: 0.5, pivot: { x: 0, y: 0 } }
-* ```
-*/
-function rootPoseInto(ecs, entity, out, own) {
-	const start = own ?? ecs.get(entity, Transform) ?? Transform.defaults;
-	out.x = start.x;
-	out.y = start.y;
-	out.rotation = start.rotation;
-	out.scale = start.scale;
-	out.pivot.x = start.pivot.x;
-	out.pivot.y = start.pivot.y;
-	let current = entity;
-	for (let depth = 0; depth < MAX_DEPTH$6; depth += 1) {
-		const parent = parentOf$1(ecs, current);
-		if (parent === 0) break;
-		const above = ecs.get(parent, Transform) ?? Transform.defaults;
-		const cos = Math.cos(above.rotation);
-		const sin = Math.sin(above.rotation);
-		const dx = out.x - above.pivot.x;
-		const dy = out.y - above.pivot.y;
-		out.x = above.x + above.scale * (dx * cos - dy * sin);
-		out.y = above.y + above.scale * (dx * sin + dy * cos);
-		out.rotation = out.rotation + above.rotation;
-		out.scale = out.scale * above.scale;
-		current = parent;
-	}
-	return out;
-}
-/**
-* Where an entity really is: its `Transform` composed through the `Parent` chain, every pivot on
-* the way applied. The answer keeps the entity's own pivot, so it can be written straight into the
-* `Transform` of an entity without a parent and the view does not move.
-*
-* @param ecs - The world read, `world.ecs`.
-* @param entity - The entity to place.
-* @param own - A pose to use in place of the entity's own `Transform`, such as its rest pose.
-* @returns The pose in root space, a fresh object. An entity without a `Transform` sits at the identity pose.
-* @example
-* ```ts
-* // `input` lifts a board cell out of its slot: the slot sits at (40, 60) scaled 0.5,
-* // the cell at (100, 200) inside it.
-* rootPoseOf(ctx.require(worldPlugin).ecs, cell);
-* // { x: 90, y: 160, rotation: 0, scale: 0.5, pivot: { x: 0, y: 0 } }
-* ```
-*/
-function rootPoseOf(ecs, entity, own) {
-	return rootPoseInto(ecs, entity, {
-		x: 0,
-		y: 0,
-		rotation: 0,
-		scale: 1,
-		pivot: {
-			x: 0,
-			y: 0
-		}
-	}, own);
-}
-/**
-* The inverse of `rootPoseOf`: the local pose under `parent` that puts an entity at a root pose.
-* The pivot is kept, as it is a local point of the entity itself.
-*
-* @param ecs - The world read, `world.ecs`.
-* @param parent - The entity to hang under; `0` for none, which answers the root pose itself.
-* @param root - The pose in root space.
-* @returns The local pose. A parent collapsed to scale 0 counts as scale 1, so the answer stays
-*   finite.
-* @example
-* ```ts
-* // `input` drops the cell back into the slot at (40, 60) scaled 0.5, where the finger left it.
-* localPoseOf(ctx.require(worldPlugin).ecs, slot, {
-*   x: 90, y: 160, rotation: 0, scale: 0.5, pivot: { x: 0, y: 0 }
-* });
-* // { x: 100, y: 200, rotation: 0, scale: 1, pivot: { x: 0, y: 0 } }
-* ```
-*/
-function localPoseOf(ecs, parent, root) {
-	if (parent === 0) return copyPose(root);
-	const above = rootPoseOf(ecs, parent);
-	const scale = above.scale === 0 ? 1 : above.scale;
-	const cos = Math.cos(-above.rotation);
-	const sin = Math.sin(-above.rotation);
-	const dx = root.x - above.x;
-	const dy = root.y - above.y;
-	return {
-		x: above.pivot.x + (dx * cos - dy * sin) / scale,
-		y: above.pivot.y + (dx * sin + dy * cos) / scale,
-		rotation: root.rotation - above.rotation,
-		scale: root.scale / scale,
-		pivot: {
-			x: root.pivot.x,
-			y: root.pivot.y
-		}
-	};
-}
-/**
-* Where a local point of an entity lands in root (reference) space: the point posed through the
-* entity's own `Transform` and its whole `Parent` chain, the forward walk of the hit test's
-* `localPoseOf`. The scale is the real one, so a view collapsed to scale 0 lands on one point.
-*
-* @param ecs - The world read, `world.ecs`.
-* @param entity - The entity whose local space the point is in.
-* @param point - The local point.
-* @returns The point in root space, a fresh object.
-* @example
-* ```ts
-* // The corner of a 64 x 64 cell at (100, 200) inside a slot at (40, 60) scaled 0.5.
-* rootPointOf(ctx.require(worldPlugin).ecs, cell, { x: -32, y: -32 }); // { x: 74, y: 144 }
-* ```
-*/
-function rootPointOf(ecs, entity, point) {
-	return applyPose(rootPoseOf(ecs, entity), point);
-}
-//#endregion
 //#region src/plugins/renderer/sync/layers.ts
 /**
 * @file renderer/sync — the layers. `scenes` declares them through `world.projection.setLayers`;
@@ -32186,13 +31947,14 @@ function localTargetOf(ecs, entity, component, to) {
 	const parent = parentOf$1(ecs, entity);
 	if (component !== asComponent(Transform) || parent === 0) return local;
 	const now = rootPoseOf(ecs, entity);
-	const landed = localPoseOf(ecs, parent, {
+	const root = {
 		x: to.x ?? now.x,
 		y: to.y ?? now.y,
 		rotation: to.rotation ?? now.rotation,
 		scale: to.scale ?? now.scale,
 		pivot: now.pivot
-	});
+	};
+	const landed = localPoseOf(ecs, parent, root);
 	for (const field of POSE_FIELDS) if (to[field] !== void 0) local[field] = landed[field];
 	return local;
 }
@@ -50454,204 +50216,6 @@ const textPlugin = /*#__PURE__*/ createPlugin$1("text", {
 	onStop: ({ state }) => stopText(state)
 });
 //#endregion
-//#region src/plugins/ui/styles/define.ts
-/**
-* Declares one style. The work is the type: a field outside the vocabulary, or a value outside
-* its union, is an error where the style is written, not where it is used.
-*
-* @param style - The style, with its `is` and `when` variants.
-* @returns The same object, frozen.
-* @example
-* ```ts
-* defineStyle({ direction: "row", gap: 12 }).gap; // 12
-* ```
-*/
-function defineStyle(style) {
-	return Object.freeze(style);
-}
-//#endregion
-//#region src/plugins/ui/styles/tokens.ts
-/**
-* Declares the design tokens of a game: spaces, colours, radii and font keys, flat and plain.
-*
-* @param tokens - The four groups; every key inside them is the game's own.
-* @returns The same object, frozen.
-* @example
-* ```ts
-* defineTokens({ space: { md: 16 } }).space.md; // 16
-* ```
-*/
-function defineTokens(tokens) {
-	return Object.freeze(tokens);
-}
-//#endregion
-//#region src/plugins/ui/components.ts
-/**
-* Who owns every entity `ui` spawns. The projection module checks it before it hands out a view
-* handle, so only `ui` may move a ui element.
-*/
-const UI_OWNER = {
-	kind: "plugin",
-	name: "ui"
-};
-/** Fresh defaults for the patch, so no two buttons share one object. */
-const localWriteDefaults = { patch: {} };
-/**
-* The rect of a ui element in root coordinates. Written by the solve, read by `tree()`, `lint()`
-* and the hit test of `guide`.
-*/
-const Box = /*#__PURE__*/ component("Box", {
-	x: 0,
-	y: 0,
-	w: 0,
-	h: 0
-});
-/**
-* On a button that writes local state instead of naming an intent. `input.onTap` reports the tap
-* and `ui` merges the patch into the nearest component instance.
-*/
-const LocalWrite = /*#__PURE__*/ component("LocalWrite", localWriteDefaults);
-/**
-* On a scroll container. Internal to `ui`: not exported from the package root.
-*/
-const Scroll = /*#__PURE__*/ component("Scroll", {
-	axis: "y",
-	offset: 0,
-	min: 0
-});
-/**
-* On every scroll container: where it stands and whether it moves, for a game system and the
-* read door. `ui` writes it in a frame where the offset or `max` changed, and once more with
-* `moving: false` when it stops; a game reads it and never writes it.
-*
-* @example
-* ```ts
-* // A board system dims the events of the order strip while it rests on the orders.
-* export const stripMist = system({
-*   name: "board.stripMist",
-*   phase: "animate",
-*   query: [ScrollState, OrderStrip],
-*   run: entities => {
-*     for (const [entity, scroll] of entities) {
-*       // scroll: { offset: 318, max: 390, moving: false }
-*     }
-*   }
-* });
-* ```
-*/
-const ScrollState = /*#__PURE__*/ component("ScrollState", {
-	offset: 0,
-	max: 0,
-	moving: false
-});
-/**
-* On the root entity of a popup kept beneath another popup (`popup(..., { over })`). Internal to
-* `ui`: not exported from the package root. Every element of that root resolves `is.covered`.
-*/
-const Covered = /*#__PURE__*/ tag("Covered");
-/**
-* On a button with the `escape` prop: the control the Escape key taps while its root is the top
-* one, meant for the close button or the backdrop of a dismissable popup. Internal to `ui`: the
-* game writes the prop, never the tag.
-*/
-const Escapable = /*#__PURE__*/ tag("Escapable");
-/**
-* On the view a player taps five times within three seconds to open the editor's overlay on a debug build: the
-* version line of the settings, usually. One helper on top of `app.debug.overlay.open()`; a game that wants another
-* gesture calls that itself. The view must take a press (a `button`, or any element with `Touchable`); a `button`
-* that names no intent is the plain choice. Without the agent flag the tag does nothing.
-*
-* @example
-* ```tsx
-* // The version line of the settings sheet. Five taps open the overlay of `moku-game build --debug` on the phone.
-* <button key="versionLine" style={versionLineStyle} components={[DebugTrigger()]}>
-*   <text key="version" style="settings.version" content={tr("settings.version", { version: "1.4.0" })} />
-* </button>
-* ```
-*/
-const DebugTrigger = /*#__PURE__*/ tag("DebugTrigger");
-/**
-* The three Yoga counters, the reconcile count of the frame, the range re-renders of the windowed
-* lists, and the style and write passes of the reconcile. Written by the two systems of `ui`, read
-* by the acceptance tests. Not part of `app.ui`.
-*/
-const UiCounters = /*#__PURE__*/ resource("UiCounters", {
-	solves: 0,
-	nodes: 0,
-	measured: 0,
-	reconciles: 0,
-	windowRenders: 0,
-	styled: 0,
-	written: 0
-});
-/**
-* Builds the effect a node awaits to show a popup. The gate opens for the outcomes of the
-* component, so the node resolves with the intent one of its buttons answered. `over` names the
-* component of a popup that stays mounted beneath this one, drawn covered, until this one is gone.
-*
-* @param component - A component declared with `outcomes`.
-* @param props - What its view is called with.
-* @param options - How the popup stands to the others.
-* @param options.over - The component name of the popup kept beneath this one.
-* @returns The descriptor `fx()` takes.
-* @example
-* ```ts
-* const Reward = defineComponent("Reward", {
-*   outcomes: { claim: {} },
-*   view: () => ({ type: "panel", props: {}, children: [] })
-* });
-* popup(Reward, { gold: 5 });
-* // { kind: "popup", payload: { component: "Reward", props: { gold: 5 } }, answers: ["claim"] }
-* await fx(popup(Reward, { gold: 5 })); // Answer<"claim">: { intent: "claim" }
-* ```
-* @example
-* ```ts
-* // The settings node asks before a reset; the settings stay beneath, covered.
-* const Confirm = defineComponent("Confirm", {
-*   outcomes: { reset: {}, cancel: {} },
-*   view: () => ({ type: "panel", props: {}, children: [] })
-* });
-* popup(Confirm, {}, { over: "Settings" });
-* // { kind: "popup", payload: { component: "Confirm", props: {}, over: "Settings" },
-* //   answers: ["reset", "cancel"] }
-* ```
-*/
-function popup(component, props, options) {
-	const over = options?.over;
-	return {
-		kind: "popup",
-		payload: over === void 0 ? {
-			component: component.name,
-			props
-		} : {
-			component: component.name,
-			props,
-			over
-		},
-		answers: Object.keys(component.outcomes)
-	};
-}
-/**
-* Binds the four ui helpers to one game. Type-only: the same four functions, plus the intrinsic
-* table this game's tags are checked against.
-*
-* @returns The helpers and the intrinsic type carrier.
-* @example
-* ```ts
-* const { defineStyle } = uiFor<"ui.coin", "digits", "hud.coins">();
-* defineStyle({ gap: 8 }).gap; // 8
-* ```
-*/
-function uiFor() {
-	return {
-		defineComponent,
-		defineStyle,
-		defineTokens,
-		popup,
-		intrinsics: {}
-	};
-}
-//#endregion
 //#region src/plugins/ui/jsx/field-layout.ts
 /**
 * The four edges of a resolved padding.
@@ -56155,10 +55719,35 @@ function createReconciler(ctx, modules, fields) {
 		ctx.log.error("ui:slot-cycle", { projection: root.name });
 	}
 	/**
-	* Plays the enter hook of an element whose spawn has just been applied. The world calls it from
-	* the `Box` hook, at the flush of phase `layout`, so the entity carries every component and the
-	* first `sync` has not run: the element is never drawn at its rest pose by mistake. A row a
-	* range change scrolled in is not new: it plays no `enter` hook, only its loop starts.
+	* Keeps an element whose spawn has just been applied: the world calls it from the `Box` hook, at
+	* the flush of phase `layout`. Its enter hook waits for `playEntered`, so the game's systems see
+	* the entity first (F48).
+	*
+	* @param entity - The entity the `Box` was attached to.
+	*/
+	function queueEnter(entity) {
+		const entering = state.entering;
+		if (entering.count < entering.list.length) entering.list[entering.count] = entity;
+		else entering.list.push(entity);
+		entering.count += 1;
+	}
+	/**
+	* Plays the enter hooks queued since the last call, in the order the elements came. The `ui.enter`
+	* system calls it in phase `sync`: after the game's systems, which may have written what a hook
+	* reads (a list's scroll), and before `renderer.sync`, so an element is never drawn at its rest
+	* pose by mistake. An element despawned in between plays nothing.
+	*/
+	function playEntered() {
+		const entering = state.entering;
+		for (let index = 0; index < entering.count; index += 1) {
+			const entity = entering.list[index];
+			if (entity !== void 0) playEnter(entity);
+		}
+		entering.count = 0;
+	}
+	/**
+	* Plays the enter hook of an element whose spawn has been applied, once. A row a range change
+	* scrolled in is not new: it plays no `enter` hook, only its loop starts.
 	*
 	* @param entity - The entity the `Box` was attached to.
 	*/
@@ -56483,7 +56072,8 @@ function createReconciler(ctx, modules, fields) {
 		mountRoot,
 		unmountRoot,
 		markPointer,
-		playEnter,
+		queueEnter,
+		playEntered,
 		sweep,
 		converged
 	};
@@ -56638,7 +56228,8 @@ function createJsxApi(ctx, modules) {
 		releaseHosted: () => releaseHosted(ctx, state),
 		applyTap: (entity) => applyTap(ctx, entity),
 		markPointer: frame.markPointer,
-		playEnter: frame.playEnter,
+		queueEnter: frame.queueEnter,
+		playEntered: frame.playEntered,
 		converged: frame.converged,
 		key: (input) => focus.key(input),
 		blur: focus.blur
@@ -59177,7 +58768,8 @@ function registerComponents(ctx, jsx) {
 	for (const feature of ctx.deps.flow.features.all()) for (const entry of feature.description.ui ?? []) if (isComponent(entry)) jsx.register(entry);
 }
 /**
-* Opens the two systems of phase `layout`, the seven world hooks of `Tree`, `Box`, `Pressed` and
+* Opens the two systems of phase `layout`, the `ui.enter` system of phase `sync`, which plays the
+* enter hooks after the game's systems (F48), the seven world hooks of `Tree`, `Box`, `Pressed` and
 * `PointerOver`, the two that tell the hosting step a view lost its `Parent` or its `Held` (a
 * view freed so may hang under its host again), the listener that asks for every root to be built again after a restore or a
 * load, the two effect handlers, the hint listener that buffers every released hint for
@@ -59206,10 +58798,15 @@ function openRegistrations(ctx, jsx, layout) {
 		phase: "layout",
 		query: [],
 		run: (_rows, frame) => jsx.solve(frame.time)
+	})), ecs.system(system({
+		name: "ui.enter",
+		phase: "sync",
+		query: [],
+		run: () => jsx.playEntered()
 	})), ecs.onAdded(Tree, (entity) => {
 		const place = projection.keyOf(entity);
 		jsx.mountRoot(entity, place?.projection ?? "ui", ecs.get(entity, Layer)?.name ?? "ui");
-	}), ecs.onRemoved(Tree, (entity) => jsx.unmountRoot(entity)), ecs.onAdded(Box, (entity) => jsx.playEnter(entity)), projection.onConverged(jsx.converged), ecs.onAdded(Pressed, (entity) => jsx.markPointer(entity, "pressed", true)), ecs.onRemoved(Pressed, (entity) => jsx.markPointer(entity, "pressed", false)), ecs.onAdded(PointerOver, (entity) => jsx.markPointer(entity, "hover", true)), ecs.onRemoved(PointerOver, (entity) => jsx.markPointer(entity, "hover", false)), ecs.onRemoved(Parent, () => hostsMoved(ctx.state.jsx)), ecs.onRemoved(Held, () => hostsMoved(ctx.state.jsx)), ctx.deps.flow.fx.handle("popup", layout.popupHandler(jsx)), ctx.deps.flow.fx.handle("guide", layout.guideHandler()), ctx.deps.flow.fx.onHint((hint) => {
+	}), ecs.onRemoved(Tree, (entity) => jsx.unmountRoot(entity)), ecs.onAdded(Box, (entity) => jsx.queueEnter(entity)), projection.onConverged(jsx.converged), ecs.onAdded(Pressed, (entity) => jsx.markPointer(entity, "pressed", true)), ecs.onRemoved(Pressed, (entity) => jsx.markPointer(entity, "pressed", false)), ecs.onAdded(PointerOver, (entity) => jsx.markPointer(entity, "hover", true)), ecs.onRemoved(PointerOver, (entity) => jsx.markPointer(entity, "hover", false)), ecs.onRemoved(Parent, () => hostsMoved(ctx.state.jsx)), ecs.onRemoved(Held, () => hostsMoved(ctx.state.jsx)), ctx.deps.flow.fx.handle("popup", layout.popupHandler(jsx)), ctx.deps.flow.fx.handle("guide", layout.guideHandler()), ctx.deps.flow.fx.onHint((hint) => {
 		ctx.state.jsx.hints.push(hint);
 	}), ctx.deps.input.onTap(jsx.applyTap), ctx.deps.input.onTap(() => jsx.blur()), ctx.deps.input.onTap(jsx.tapped), ctx.deps.input.onPointer(jsx.pointer), ctx.deps.input.onKey(jsx.key), ctx.deps.input.controls.add(LocalWrite), () => jsx.releaseHosted(), () => ecs.despawnOwnedBy(UI_OWNER));
 	if (typeof __MOKU_GAME_AGENT__ !== "undefined" && __MOKU_GAME_AGENT__) ctx.state.layout.cleanups.push(ctx.deps.input.onTap((entity) => debugTap(ctx, entity)), ecs.onAdded(DebugTrigger, (entity) => checkTrigger(ctx, entity)));
@@ -59269,6 +58866,8 @@ function stopUi(state) {
 	state.jsx.scrolls.clear();
 	state.jsx.remount = false;
 	state.jsx.hints.length = 0;
+	state.jsx.entering.list.length = 0;
+	state.jsx.entering.count = 0;
 	state.jsx.debugTaps.length = 0;
 	state.jsx.debugWarned = false;
 	state.jsx.focus.entity = void 0;
@@ -59643,6 +59242,10 @@ function createJsxState() {
 		fields: emptyMap$1(),
 		text: createTextState(),
 		hints: [],
+		entering: {
+			list: [],
+			count: 0
+		},
 		scrolls: emptySet(),
 		windowRenders: 0,
 		remount: false,
@@ -61349,4 +60952,4 @@ const screen = [
 	uiPlugin
 ];
 //#endregion
-export { haptic as $, PERF_LOG_VERSION as $t, types_exports$11 as A, Emitter as At, Box as B, audioPlugin as Bt, types_exports$4 as C, Touchable as Ct, types_exports$8 as D, messageArgument as Dt, types_exports$7 as E, i18nPlugin as Et, types_exports$16 as F, Glow as Ft, defineTokens as G, Animation as Gt, LocalWrite as H, assetsPlugin as Ht, types_exports$17 as I, Noise as It, platformPlugin as J, PASS_KINDS as Jt, defineStyle as K, Frames as Kt, uiPlugin as L, Outline as Lt, types_exports$13 as M, Blur as Mt, types_exports$14 as N, ColorMatrix as Nt, types_exports$9 as O, messageDuration as Ot, types_exports$15 as P, Displacement as Pt, frames as Q, PERF_GAP_BUCKETS as Qt, resolve as R, defineFilter as Rt, types_exports$3 as S, Tappable as St, types_exports$6 as T, Traced as Tt, ScrollState as U, animPlugin as Ut, DebugTrigger as V, scenesPlugin as Vt, popup as W, AnimPlayer as Wt, defineAnimation as X, MONITOR_SECTIONS as Xt, HAPTIC_KINDS as Y, frameAt as Yt, external as Z, PERF_CAUSES as Zt, defineBundles as _, Pointer as _t, cubicBezier as a, refuseStart as an, sfx as at, types_exports$1 as b, Pressed as bt, hint as c, to as cn, stagger as ct, defineScene as d, SaveUnreadableError as dn, wait as dt, PROBLEM_RULES as en, mark as et, tr as f, lifecyclePlugin as fn, inputPlugin as ft, music as g, Hovered as gt, defineEmitter as h, Held as ht, screen as i, flowPlugin as in, set as it, types_exports$12 as j, Alpha as jt, types_exports$10 as k, effectsPlugin as kt, schedule as l, type as ln, tween as lt, flattenFeatures as m, clockPlugin as mn, DropTarget as mt, createPlugin as n, DEMAND_REASONS as nn, play$1 as nt, defineEffect as o, exit as on, spawn as ot, defineFeature as p, timePlugin as pn, Draggable as pt, textPlugin as q, rendererPlugin as qt, defineGame as r, worldPlugin as rn, sequence as rt, guide as s, slot as sn, spawned as st, createApp as t, SHADER_WHATS as tn, parallel as tt, projection as u, modelPlugin as un, use as ut, load as v, PointerOver as vt, types_exports$5 as w, Traceable as wt, types_exports$2 as x, Swipeable as xt, types_exports as y, Pressable as yt, defineMotion as z, debugPlugin as zt };
+export { spawn as $, exit as $t, types_exports$11 as A, Outline as At, textPlugin as B, rendererPlugin as Bt, types_exports$4 as C, Emitter as Ct, types_exports$8 as D, Displacement as Dt, types_exports$7 as E, ColorMatrix as Et, types_exports$16 as F, assetsPlugin as Ft, frames as G, PERF_GAP_BUCKETS as Gt, HAPTIC_KINDS as H, frameAt as Ht, types_exports$17 as I, animPlugin as It, parallel as J, SHADER_WHATS as Jt, haptic as K, PERF_LOG_VERSION as Kt, uiPlugin as L, AnimPlayer as Lt, types_exports$13 as M, debugPlugin as Mt, types_exports$14 as N, audioPlugin as Nt, types_exports$9 as O, Glow as Ot, types_exports$15 as P, scenesPlugin as Pt, sfx as Q, refuseStart as Qt, resolve as R, Animation as Rt, types_exports$3 as S, effectsPlugin as St, types_exports$6 as T, Blur as Tt, defineAnimation as U, MONITOR_SECTIONS as Ut, platformPlugin as V, PASS_KINDS as Vt, external as W, PERF_CAUSES as Wt, sequence as X, worldPlugin as Xt, play$1 as Y, DEMAND_REASONS as Yt, set as Z, flowPlugin as Zt, defineBundles as _, Traceable as _t, cubicBezier as a, lifecyclePlugin as an, inputPlugin as at, types_exports$1 as b, messageArgument as bt, hint as c, Held as ct, defineScene as d, PointerOver as dt, slot as en, spawned as et, tr as f, Pressable as ft, music as g, Touchable as gt, defineEmitter as h, Tappable as ht, screen as i, SaveUnreadableError as in, wait as it, types_exports$12 as j, defineFilter as jt, types_exports$10 as k, Noise as kt, schedule as l, Hovered as lt, flattenFeatures as m, Swipeable as mt, createPlugin as n, type as nn, tween as nt, defineEffect as o, timePlugin as on, Draggable as ot, defineFeature as p, Pressed as pt, mark as q, PROBLEM_RULES as qt, defineGame as r, modelPlugin as rn, use as rt, guide as s, clockPlugin as sn, DropTarget as st, createApp as t, to as tn, stagger as tt, projection as u, Pointer as ut, load as v, Traced as vt, types_exports$5 as w, Alpha as wt, types_exports$2 as x, messageDuration as xt, types_exports as y, i18nPlugin as yt, defineMotion as z, Frames as zt };

package/dist/testing.d.mts

@@ -1,6 +1,6 @@
 import { Qn as AnyFlow, Xn as FeaturePlugin, cr as Descriptor, fr as Hint, gr as ClockSource, ir as NodeTable, pr as NodeFx, vr as FakeClock, wr as Json } from "./types-CuEK0Vam.mjs";
-import { t as createApp } from "./index-CsTMiO0x.mjs";
-import { b as saveOf, v as WithGameState, y as memory } from "./types-CveBhKTs.mjs";
+import { t as createApp } from "./index-YUceiUFm.mjs";
+import { b as saveOf, v as WithGameState, y as memory } from "./types-Dm4tM5nH.mjs";
 import { a as createHeadless, i as ReproResult, n as HeadlessGame, o as runRepro, r as Repro, s as stepFrames, t as HeadlessApp } from "./headless-DHtavbqk.mjs";
 import { AnyPluginInstance } from "@moku-labs/core";
 

package/dist/testing.mjs

@@ -1,4 +1,4 @@
-import { an as refuseStart, ln as type, m as flattenFeatures, on as exit, t as createApp } from "./src-0m2mjRDI.mjs";
+import { $t as exit, Qt as refuseStart, m as flattenFeatures, nn as type, t as createApp } from "./src-3_HjYegY.mjs";
 import { n as saveOf, t as memory } from "./memory-CWlqhS7l.mjs";
 import { t as fakeClock } from "./fake-6mazmHK3.mjs";
 import { i as stepFrames, r as runRepro, t as createHeadless } from "./headless-BA6ffzqD.mjs";

package/dist/{types-CpBnGqDU.d.mts → types-3bEK86Z1.d.mts}

@@ -1,5 +1,5 @@
 import { $r as Events$2, $t as Api$3, An as ReducedMotion, Br as Events$5, Cn as Ease, Cr as Events$3, D as FilterSlotInputs, Dn as NumericFields, E as FilterSlot, En as MotionHandle, K as Api$4, Mn as TrackSegment, O as SyncApi, Pn as Api$2, Q as PixiTexture, Wr as Api$1, X as PixiModule, Y as PixiFilter, Z as PixiSprite, cr as Descriptor, dn as Entity, ei as Require, in as AnyComponent, jn as TrackOptions, ln as ComponentType, lt as FilterCache, on as AnyComponentValue, s as Events$1, sn as ComponentHandle, sr as TypeTag, st as Point, t as Api$5, v as Events$4, wr as Json, xr as Api$6 } from "./types-CuEK0Vam.mjs";
-import { C as TextApi, L as I18nApi, M as InputApi, Y as StylesState, c as UiNode, i as Finding, n as ElementChange, o as JsxState, r as ElementMotion } from "./types-D5Pmo8BD.mjs";
+import { C as TextApi, L as I18nApi, M as InputApi, Y as StylesState, c as UiNode, i as Finding, n as ElementChange, o as JsxState, r as ElementMotion } from "./types-xmH1X8qd.mjs";
 import { Log } from "@moku-labs/common/browser";
 import { PluginCtx } from "@moku-labs/core";
 import { Node, Yoga } from "yoga-layout/load";

package/dist/{types-CveBhKTs.d.mts → types-Dm4tM5nH.d.mts}

@@ -1,7 +1,7 @@
 import { Ar as ProviderCall, In as Config$1, Pr as SnapshotOf, Qn as AnyFlow, Sr as Config, X as PixiModule, Xn as FeaturePlugin, a as Config$3, d as Manifest, gr as ClockSource, jr as SaveDoc, kr as PlayerStateProvider, n as AssetsIo, ot as Orientation, q as Config$2, sr as TypeTag, vr as FakeClock, wr as Json } from "./types-CuEK0Vam.mjs";
-import { o as AudioContextLike, s as Config$4 } from "./types-CpBnGqDU.mjs";
-import { H as StringTable, L as I18nApi, U as TextKey } from "./types-D5Pmo8BD.mjs";
-import { ft as platformPlugin, i as screen, mt as PlatformProvider, t as createApp, wt as audioPlugin, xt as effectsPlugin } from "./index-CsTMiO0x.mjs";
+import { o as AudioContextLike, s as Config$4 } from "./types-3bEK86Z1.mjs";
+import { H as StringTable, L as I18nApi, U as TextKey } from "./types-xmH1X8qd.mjs";
+import { ft as platformPlugin, i as screen, mt as PlatformProvider, t as createApp, wt as audioPlugin, xt as effectsPlugin } from "./index-YUceiUFm.mjs";
 import { AnyPluginInstance } from "@moku-labs/core";
 
 //#region src/plugins/model/store/providers/memory.d.ts