incanto 0.4.2 → 0.5.0

package/dist/{register-BuUV1_KB.js → register-Dl_ixIJe.js}

@@ -1,4 +1,4 @@
-import { f as Node } from "./loader-CGs_G-r0.js";
+import { f as Node } from "./loader-B4OEXDZ8.js";
 import { t as IncantoError } from "./errors-BpWbnbb_.js";
 import { t as Rng } from "./rng-DP-SR7eg.js";
 import { l as registerNode } from "./registry-BVJ2HbCn.js";
@@ -500,6 +500,275 @@ var AudioPlayer = class extends Node {
 	}
 };
 //#endregion
+//#region src/core/nodes/hud.ts
+const ANCHOR_CSS = {
+	topLeft: "left:16px;top:16px;align-items:flex-start;",
+	top: "left:50%;top:16px;transform:translateX(-50%);align-items:center;",
+	topRight: "right:16px;top:16px;align-items:flex-end;",
+	left: "left:16px;top:50%;transform:translateY(-50%);align-items:flex-start;",
+	center: "left:50%;top:50%;transform:translate(-50%,-50%);align-items:center;",
+	right: "right:16px;top:50%;transform:translateY(-50%);align-items:flex-end;",
+	bottomLeft: "left:16px;bottom:16px;align-items:flex-start;",
+	bottom: "left:50%;bottom:16px;transform:translateX(-50%);align-items:center;",
+	bottomRight: "right:16px;bottom:16px;align-items:flex-end;"
+};
+const FONT = "600 14px system-ui, -apple-system, 'Segoe UI', sans-serif";
+function hasDom() {
+	return typeof document !== "undefined";
+}
+/**
+* The overlay container. One per scene is plenty; widgets mount into its
+* anchor slots. `zIndex` lifts it above game canvases; the layer never eats
+* pointer events (widgets that need clicks opt in individually).
+*/
+var HudLayer = class extends Node {
+	static typeName = "HudLayer";
+	static props = {
+		zIndex: { default: 100 },
+		visible: { default: true }
+	};
+	zIndex = 100;
+	visible = true;
+	/** @internal root overlay element (null headless). */
+	_element = null;
+	slots = /* @__PURE__ */ new Map();
+	onEnterTree() {
+		if (!hasDom()) return;
+		const el = document.createElement("div");
+		el.dataset.incantoHud = this.name;
+		el.style.cssText = `position:fixed;inset:0;pointer-events:none;z-index:${this.zIndex};font:${FONT};`;
+		document.body.appendChild(el);
+		this._element = el;
+	}
+	onExitTree() {
+		this._element?.remove();
+		this._element = null;
+		this.slots.clear();
+	}
+	update() {
+		if (this._element) this._element.style.display = this.visible ? "" : "none";
+	}
+	/** @internal Widgets mount into per-anchor flex columns. */
+	_slot(anchor) {
+		if (!this._element) return null;
+		let slot = this.slots.get(anchor);
+		if (!slot) {
+			slot = document.createElement("div");
+			slot.style.cssText = `position:absolute;display:flex;flex-direction:column;gap:8px;${ANCHOR_CSS[anchor] ?? ANCHOR_CSS.topLeft}`;
+			this._element.appendChild(slot);
+			this.slots.set(anchor, slot);
+		}
+		return slot;
+	}
+};
+/** Shared plumbing: mount into the parent HudLayer's anchor slot. */
+var HudWidget = class extends Node {
+	static props = {
+		anchor: {
+			default: "topLeft",
+			options: [
+				"topLeft",
+				"top",
+				"topRight",
+				"left",
+				"center",
+				"right",
+				"bottomLeft",
+				"bottom",
+				"bottomRight"
+			]
+		},
+		visible: { default: true }
+	};
+	anchor = "topLeft";
+	visible = true;
+	/** @internal */
+	_element = null;
+	layer() {
+		for (let p = this.parent; p; p = p.parent) if (p instanceof HudLayer) return p;
+		return null;
+	}
+	onReady() {
+		if (!hasDom()) return;
+		const slot = this.layer()?._slot(this.anchor);
+		if (!slot) return;
+		this._element = this._build();
+		slot.appendChild(this._element);
+	}
+	onExitTree() {
+		this._element?.remove();
+		this._element = null;
+	}
+	update(_dt) {
+		if (!this._element) return;
+		this._element.style.display = this.visible ? "" : "none";
+		this._sync();
+	}
+	_sync() {}
+};
+/** A text line (score, timer, hints). Set `.text` from behaviors. */
+var UiText = class extends HudWidget {
+	static typeName = "UiText";
+	static props = {
+		...HudWidget.props,
+		text: { default: "" },
+		size: { default: 16 },
+		color: { default: "#ffffff" },
+		shadow: { default: true }
+	};
+	text = "";
+	size = 16;
+	color = "#ffffff";
+	shadow = true;
+	last = "\0";
+	_build() {
+		const el = document.createElement("div");
+		el.style.cssText = `font-size:${this.size}px;color:${this.color};${this.shadow ? "text-shadow:0 1px 3px rgba(0,0,0,.7);" : ""}white-space:pre;`;
+		return el;
+	}
+	_sync() {
+		if (this.text !== this.last && this._element) {
+			this.last = this.text;
+			this._element.textContent = this.text;
+		}
+	}
+};
+/** A labeled progress bar (health, stamina, reload, boss HP). */
+var UiBar = class extends HudWidget {
+	static typeName = "UiBar";
+	static props = {
+		...HudWidget.props,
+		value: { default: 100 },
+		max: { default: 100 },
+		width: { default: 180 },
+		height: { default: 14 },
+		color: { default: "#4ade80" },
+		lowColor: { default: "#ef4444" },
+		lowThreshold: { default: .3 },
+		background: { default: "rgba(0,0,0,0.5)" },
+		label: { default: "" }
+	};
+	value = 100;
+	max = 100;
+	width = 180;
+	height = 14;
+	color = "#4ade80";
+	lowColor = "#ef4444";
+	lowThreshold = .3;
+	background = "rgba(0,0,0,0.5)";
+	label = "";
+	fill = null;
+	lastRatio = -1;
+	/** Current fill ratio 0..1 (what the bar shows). */
+	get ratio() {
+		return this.max > 0 ? Math.min(1, Math.max(0, this.value / this.max)) : 0;
+	}
+	_build() {
+		const wrap = document.createElement("div");
+		wrap.style.cssText = "display:flex;align-items:center;gap:6px;";
+		if (this.label) {
+			const tag = document.createElement("span");
+			tag.textContent = this.label;
+			tag.style.cssText = "color:#fff;font-size:12px;text-shadow:0 1px 3px rgba(0,0,0,.7);";
+			wrap.appendChild(tag);
+		}
+		const track = document.createElement("div");
+		track.style.cssText = `width:${this.width}px;height:${this.height}px;background:${this.background};border-radius:${this.height / 2}px;overflow:hidden;`;
+		this.fill = document.createElement("div");
+		this.fill.style.cssText = `height:100%;width:100%;background:${this.color};border-radius:inherit;transition:width .15s;`;
+		track.appendChild(this.fill);
+		wrap.appendChild(track);
+		return wrap;
+	}
+	_sync() {
+		const r = this.ratio;
+		if (r === this.lastRatio || !this.fill) return;
+		this.lastRatio = r;
+		this.fill.style.width = `${r * 100}%`;
+		this.fill.style.background = r <= this.lowThreshold ? this.lowColor : this.color;
+	}
+};
+/**
+* Center-screen announcements ("WAVE 2", "YOU DIED", "LEVEL UP") with fade
+* in/out and a queue — call `.show(text, { color, seconds })`; `sticky:true`
+* (seconds: 0) keeps it until the next show(). Emits `bannerShown(text)`.
+*/
+var UiBanner = class extends HudWidget {
+	static typeName = "UiBanner";
+	static signals = ["bannerShown"];
+	static props = {
+		...HudWidget.props,
+		anchor: {
+			default: "center",
+			options: [
+				"topLeft",
+				"top",
+				"topRight",
+				"left",
+				"center",
+				"right",
+				"bottomLeft",
+				"bottom",
+				"bottomRight"
+			]
+		},
+		size: { default: 42 },
+		seconds: { default: 2 }
+	};
+	anchor = "center";
+	size = 42;
+	/** Default display time (per-show override via options). */
+	seconds = 2;
+	queue = [];
+	current = null;
+	remaining = 0;
+	/** What the banner is showing right now ('' when idle) — test-friendly. */
+	get showing() {
+		return this.current?.text ?? "";
+	}
+	show(text, opts) {
+		this.queue.push({
+			text,
+			color: opts?.color ?? "#ffffff",
+			seconds: opts?.seconds ?? this.seconds
+		});
+	}
+	/** Drop everything (scene transitions). */
+	clear() {
+		this.queue.length = 0;
+		this.current = null;
+		this.remaining = 0;
+		if (this._element) this._element.style.opacity = "0";
+	}
+	_build() {
+		const el = document.createElement("div");
+		el.style.cssText = `font-size:${this.size}px;font-weight:800;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.8);opacity:0;transition:opacity .25s;text-align:center;`;
+		return el;
+	}
+	update(dt) {
+		super.update(dt);
+		if (this.current) {
+			if (this.current.seconds > 0) {
+				this.remaining -= dt;
+				if (this.remaining <= 0) {
+					this.current = null;
+					if (this._element) this._element.style.opacity = "0";
+				}
+			} else if (this.queue.length > 0) this.current = null;
+		}
+		if (!this.current && this.queue.length > 0) {
+			this.current = this.queue.shift();
+			this.remaining = this.current.seconds;
+			if (this._element) {
+				this._element.textContent = this.current.text;
+				this._element.style.color = this.current.color;
+				this._element.style.opacity = "1";
+			}
+			this.emit("bannerShown", this.current.text);
+		}
+	}
+};
+//#endregion
 //#region src/core/nodes/timer.ts
 /**
 * The canonical serializable game clock — never `setTimeout` in game logic.
@@ -556,6 +825,10 @@ function registerCoreNodes() {
 	registerNode(Node);
 	registerNode(Timer);
 	registerNode(AudioPlayer);
+	registerNode(HudLayer);
+	registerNode(UiText);
+	registerNode(UiBar);
+	registerNode(UiBanner);
 }
 //#endregion
-export { spatialGain as a, SFX_PRESET_NAMES as c, ROLLOFF_MODELS as i, synthSfx as l, Timer as n, spatialPan as o, AudioPlayer as r, SFX_PRESETS as s, registerCoreNodes as t };
+export { UiBar as a, ROLLOFF_MODELS as c, SFX_PRESETS as d, SFX_PRESET_NAMES as f, UiBanner as i, spatialGain as l, Timer as n, UiText as o, synthSfx as p, HudLayer as r, AudioPlayer as s, registerCoreNodes as t, spatialPan as u };