@rpgjs/client 5.0.0-beta.2 → 5.0.0-beta.22

package/dist/components/scenes/canvas.ce.js

@@ -1,60 +1,238 @@
 import { inject } from "../../core/inject.js";
-import component$1 from "./draw-map.ce.js";
 import { RpgGui } from "../../Gui/Gui.js";
 import { RpgClientEngine } from "../../RpgClientEngine.js";
-import { Canvas, Container, Viewport, computed, cond, effect, h, loop, useDefineProps, useProps } from "canvasengine";
-import { delay } from "@rpgjs/common";
+import { Canvas, Container, Viewport, computed, cond, effect, h, loop, useDefineEmits, useDefineProps, useProps } from "canvasengine";
+import { shouldRenderLightingShadows } from "@rpgjs/common";
+import { NightAmbiant, SpriteShadows } from "@canvasengine/presets";
 //#region src/components/scenes/canvas.ce
 function component($$props) {
 	useProps($$props);
 	useDefineProps($$props);
-	var engine = inject(RpgClientEngine);
-	var guiService = inject(RpgGui);
-	var sceneData = engine.sceneMap.data;
-	var guiList = computed(function() {
-		return Object.values(guiService.gui()).filter(function(gui) {
-			return !gui.attachToSprite;
-		});
+	useDefineEmits($$props);
+	const engine = inject(RpgClientEngine);
+	const SceneMap = engine.sceneMapComponent;
+	const guiService = inject(RpgGui);
+	const sceneData = engine.sceneMap.data;
+	const lighting = engine.sceneMap.lighting;
+	const guiList = computed(() => {
+		return Object.values(guiService.gui()).filter((gui) => !gui.attachToSprite);
 	});
-	var worldWidth = computed(function() {
-		var _a;
-		return (_a = sceneData()) === null || _a === void 0 ? void 0 : _a.width;
+	const worldWidth = computed(() => {
+		const data = sceneData?.();
+		const scale = Number(data?.params?.scale ?? 1) || 1;
+		return Number(data?.width ?? data?.params?.width ?? 2048) * scale;
 	});
-	var worldHeight = computed(function() {
-		var _a;
-		return (_a = sceneData()) === null || _a === void 0 ? void 0 : _a.height;
+	const worldHeight = computed(() => {
+		const data = sceneData?.();
+		const scale = Number(data?.params?.scale ?? 1) || 1;
+		return Number(data?.height ?? data?.params?.height ?? 2048) * scale;
 	});
-	effect(function() {
+	effect(() => {
 		if (sceneData() && !sceneData().component) throw new Error("Warning ! You need to define a component for the scene. Use provideLoadMap() to define a component for the scene.");
 	});
-	var onGuiFinish = function(gui, data) {
-		delay(function() {
-			guiService.guiClose(gui.name, data);
-		});
+	const normalizeOpenId = (value) => {
+		const resolved = typeof value === "function" ? value() : value;
+		return typeof resolved === "string" && resolved.length > 0 ? resolved : void 0;
+	};
+	const onGuiFinish = (gui, data, guiOpenId) => {
+		const completedOpenId = normalizeOpenId(guiOpenId);
+		const currentOpenId = normalizeOpenId(gui.openId);
+		if (completedOpenId && currentOpenId && completedOpenId !== currentOpenId) return;
+		guiService.guiClose(gui.name, data, completedOpenId ?? currentOpenId);
 	};
-	var onGuiInteraction = function(gui, name, data) {
+	const onGuiInteraction = (gui, name, data) => {
 		guiService.guiInteraction(gui.name, name, data);
 	};
+	const clamp = { direction: "all" };
+	const NIGHT_SPOT_RADIUS_SCALE = 4.25;
+	const NIGHT_SPOT_MIN_RADIUS = 170;
+	const NIGHT_SPOT_MIN_INTENSITY = 1;
+	const SHADOW_SPOT_RADIUS_SCALE = 12;
+	const SHADOW_SPOT_MIN_RADIUS = 480;
+	const toFiniteNumber = (value, fallback = null) => {
+		const number = Number(value);
+		return Number.isFinite(number) ? number : fallback;
+	};
+	const clampNumber = (value, min, max) => Math.max(min, Math.min(max, value));
+	const nightSpotRadius = (radius) => Math.max(radius * NIGHT_SPOT_RADIUS_SCALE, NIGHT_SPOT_MIN_RADIUS);
+	const shadowSpotRadius = (radius) => Math.max(radius * SHADOW_SPOT_RADIUS_SCALE, SHADOW_SPOT_MIN_RADIUS);
+	const nightSpotIntensity = (intensity, fallback) => Math.max(intensity ?? fallback, NIGHT_SPOT_MIN_INTENSITY);
+	const shadowLightIntensity = (intensity, fallback = 1) => {
+		const value = Number(intensity ?? fallback);
+		return Number.isFinite(value) ? Math.max(0, value) : fallback;
+	};
+	const shadowSpotIntensity = (intensity) => shadowLightIntensity(intensity, 1);
+	const lightingAmbient = computed(() => {
+		return (lighting?.())?.ambient ?? {};
+	});
+	const nightLights = computed(() => {
+		return ((lighting?.())?.spots ?? []).map((spot, index) => {
+			const radius = spot.radius ?? 180;
+			return {
+				x: spot.x,
+				y: spot.y,
+				radius: nightSpotRadius(radius),
+				intensity: nightSpotIntensity(spot.intensity, index === 0 ? 1 : .92),
+				flicker: spot.flicker,
+				flickerSpeed: spot.flickerSpeed ?? 14,
+				pulse: spot.pulse,
+				pulseSpeed: spot.pulseSpeed,
+				phase: spot.phase
+			};
+		});
+	});
+	const lightingDarkness = computed(() => {
+		const darkness = lightingAmbient().darkness;
+		return typeof darkness === "number" ? darkness : 0;
+	});
+	const lightingAmbientEnabled = computed(() => {
+		const state = lighting?.();
+		return Boolean(state && lightingDarkness() > 0);
+	});
+	const lightingDarknessProps = computed(() => ({
+		opacity: lightingDarkness(),
+		color: lightingAmbient().darkColor ?? "#080a12"
+	}));
+	const lightingHaze = computed(() => ({
+		color: lightingAmbient().fogColor ?? "#12182a",
+		radius: lightingAmbient().fogRadius ?? .44,
+		softness: lightingAmbient().fogSoftness ?? .3,
+		opacity: lightingAmbient().fogOpacity ?? .35
+	}));
+	const defaultSunLight = () => {
+		const data = sceneData?.();
+		const width = Number(data?.width ?? data?.params?.width ?? 2048);
+		const height = Number(data?.height ?? data?.params?.height ?? 2048);
+		const scale = Number(data?.params?.scale ?? 1) || 1;
+		const mapWidth = width * scale;
+		const mapHeight = height * scale;
+		const projectionBase = Math.max(1, mapWidth, mapHeight);
+		return {
+			x: -projectionBase * 24,
+			y: -projectionBase * 24,
+			z: 520,
+			radius: projectionBase * 160,
+			intensity: .85,
+			shadowWeight: lightingDarkness() > 0 ? 2.2 : 1,
+			enabled: true
+		};
+	};
+	const normalizeSunDirection = (sun) => {
+		const x = toFiniteNumber(sun?.x, null);
+		const y = toFiniteNumber(sun?.y, null);
+		if (x !== null && y !== null && Math.hypot(x, y) > .001) return {
+			x,
+			y
+		};
+		return {
+			x: -.45,
+			y: -1
+		};
+	};
+	const defaultSunAmbientLight = () => {
+		const state = lighting?.();
+		if (!state?.sun || state.sun.enabled === false) return null;
+		const defaultSun = defaultSunLight();
+		const sun = {
+			...defaultSun,
+			...state.sun,
+			intensity: shadowLightIntensity(state.sun.intensity, defaultSun.intensity),
+			shadowWeight: state.sun.shadowWeight ?? defaultSun.shadowWeight
+		};
+		if (sun.intensity <= 0) return null;
+		const direction = normalizeSunDirection(sun);
+		const shadowWeight = clampNumber(toFiniteNumber(sun.shadowWeight, lightingDarkness() > 0 ? 1.35 : 1) ?? 1, 0, 4);
+		const length = clampNumber(30 + sun.intensity * 38 * Math.max(.75, shadowWeight), 30, 86);
+		return {
+			x: direction.x,
+			y: direction.y,
+			z: toFiniteNumber(sun.z, 520) ?? 520,
+			intensity: clampNumber(sun.intensity, 0, 2),
+			shadowWeight,
+			length
+		};
+	};
+	const shadowState = computed(() => {
+		return (lighting?.())?.shadows ?? null;
+	});
+	const shadowLights = computed(() => {
+		return ((lighting?.())?.spots ?? []).map((spot) => {
+			const radius = spot.radius ?? 180;
+			return {
+				x: spot.x,
+				y: spot.y,
+				z: 170,
+				radius: shadowSpotRadius(radius),
+				intensity: shadowSpotIntensity(spot.intensity),
+				shadowWeight: 1,
+				enabled: true
+			};
+		});
+	});
+	const shadowAmbientLight = computed(() => {
+		const shadows = shadowState();
+		if (shadows?.ambientLight === null || shadows?.ambientLight?.enabled === false) return null;
+		return shadows?.ambientLight ?? defaultSunAmbientLight();
+	});
+	const shadowEnabled = computed(() => {
+		const state = lighting?.();
+		return Boolean(shouldRenderLightingShadows(state) && (shadowLights().length > 0 || shadowAmbientLight()));
+	});
+	const shadowMode = computed(() => shadowState()?.mode ?? "strongest");
+	const shadowUpdateHz = computed(() => shadowState()?.updateHz ?? 60);
+	const shadowScanHz = computed(() => shadowState()?.scanHz ?? 8);
+	const shadowCullToViewport = computed(() => shadowState()?.cullToViewport ?? true);
+	const shadowMinInfluence = computed(() => shadowState()?.minInfluence ?? .24);
+	const shadowFalloffPower = computed(() => shadowState()?.falloffPower ?? .85);
+	const shadowColor = computed(() => shadowState()?.shadowColor ?? "#05070d");
 	return h(Canvas, {
 		width: engine.width,
 		height: engine.height
 	}, [h(Viewport, {
 		worldWidth,
 		worldHeight,
-		clamp: { direction: "all" },
+		clamp,
 		sortableChildren: true
-	}, cond(sceneData, () => h(component$1))), loop(guiList, (gui) => h(Container, { display: "flex" }, cond(gui.display, () => h(gui.component, {
+	}, [
+		cond(computed(() => lightingAmbientEnabled()), () => h(NightAmbiant, {
+			spots: nightLights,
+			darkness: lightingDarknessProps,
+			haze: lightingHaze
+		})),
+		cond(computed(() => shadowEnabled()), () => h(SpriteShadows, {
+			lights: shadowLights,
+			ambientLight: shadowAmbientLight,
+			minInfluence: shadowMinInfluence,
+			falloffPower: shadowFalloffPower,
+			mode: shadowMode,
+			updateHz: shadowUpdateHz,
+			scanHz: shadowScanHz,
+			cullToViewport: shadowCullToViewport,
+			shadowColor
+		})),
+		h(SceneMap)
+	]), loop(guiList, (gui) => h(Container, {
+		positionType: "absolute",
+		top: 0,
+		left: 0,
+		right: 0,
+		bottom: 0,
+		width: engine.width,
+		height: engine.height
+	}, cond(gui.display, () => h(gui.component, {
 		data: gui.data,
 		dependencies: gui.dependencies,
-		onFinish: (data) => {
-			onGuiFinish(gui, data);
+		guiOpenId: gui.openId,
+		onFinish: (data, guiOpenId) => {
+			onGuiFinish(gui, data, guiOpenId);
 		},
 		onInteraction: (name, data) => {
 			onGuiInteraction(gui, name, data);
 		}
 	}))))]);
 }
+var __ce_component = component;
 //#endregion
-export { component as default };
+export { __ce_component as default };
 
 //# sourceMappingURL=canvas.ce.js.map

package/dist/components/scenes/canvas.ce.js.map

@@ -1 +1 @@
-{"version":3,"file":"canvas.ce.js","names":[],"sources":["../../../src/components/scenes/canvas.ce"],"sourcesContent":["<Canvas width={engine.width} height={engine.height}>\n  <Viewport worldWidth worldHeight clamp sortableChildren={true}>\n    @if (sceneData) {\n      <SceneMap />\n    }\n  </Viewport>\n  @for (gui of guiList) {\n      <Container display=\"flex\">\n        @if (gui.display) {\n          <gui.component data={gui.data} dependencies={gui.dependencies} onFinish={(data) => {\n            onGuiFinish(gui, data)\n          }} onInteraction={(name, data) => {\n            onGuiInteraction(gui, name, data)\n          }} /> \n        }\n      </Container>\n  }\n</Canvas>\n\n<script>\n  import { signal, computed, effect } from \"canvasengine\";\n  import { inject } from \"../../core/inject\";\n  import { RpgClientEngine } from \"../../RpgClientEngine\";\n  import SceneMap from './draw-map.ce'\n  import { RpgGui } from \"../../Gui/Gui\";\n  import { delay } from \"@rpgjs/common\";\n\n  const engine = inject(RpgClientEngine);\n  const guiService = inject(RpgGui);\n  const sceneData = engine.sceneMap.data\n  const guiList = computed(() => {\n    return Object.values(guiService.gui()).filter((gui) => !gui.attachToSprite)\n  })\n  const worldWidth = computed(() => sceneData()?.width)\n  const worldHeight = computed(() => sceneData()?.height)\n\n  effect(() => {\n     if (sceneData() && !sceneData().component) {\n       throw new Error(\"Warning ! You need to define a component for the scene. Use provideLoadMap() to define a component for the scene.\")\n     }\n  })\n\n  const onGuiFinish = (gui, data) => {\n    delay(() => {\n      guiService.guiClose(gui.name, data)\n    })\n  }\n\n  const onGuiInteraction = (gui, name, data) => {\n    guiService.guiInteraction(gui.name, name, data)\n  }\n  \n  const clamp = {\n    direction: \"all\"\n  }\n</script>\n"],"mappings":";;;;;;;AAaM,SAAS,UAAA,SAAA;AACP,UAAA,QAAA;AACS,gBAAA,QAAA;CACf,IAAA,SAAA,OAAA,gBAAA;CACF,IAAE,aAAM,OAAA,OAAA;;CAER,IAAC,UAAM,SAAA,WAAA;AACL,SAAS,OAAO,OAAC,WAAiB,KAAE,CAAI,CAAC,OAAC,SAAa,KAAA;AAAA,UAAA,CAAA,IAAA;IAAA;GACvD;CACF,IAAE,aAAS,SAAe,WAAY;EAAE,IAAC;AAAA,UAAe,KAAC,WAAA,MAAA,QAAA,OAAA,KAAA,IAAA,KAAA,IAAA,GAAA;GAAA;CACzD,IAAE,cAAgB,SAAQ,WAAW;EAAA,IAAA;AAAA,UAAA,KAAA,WAAA,MAAA,QAAA,OAAA,KAAA,IAAA,KAAA,IAAA,GAAA;GAAA;AACrC,QAAE,WAAiB;AACjB,MAAM,WAAW,IAAI,CAAC,WAAQ,CAAA,UAAA,OAAA,IAAA,MAAA,oHAAA;GAG9B;CACF,IAAE,cAAgB,SAAS,KAAA,MAAS;AAClC,QAAM,WAAU;AACd,cAAc,SAAO,IAAA,MAAW,KAAO;IACxC;;CAEH,IAAE,mBAAoB,SAAW,KAAI,MAAA,MAAa;;;AAW7C,QALF,EAAA,QAAA;EAAA,OAAA,OAAA;EAAA,QAAA,OAAA;EAAA,EAAA,CAAA,EAAA,UAAA;EAAA;EAAA;EAAA,OAHM,EACL,WAAS,OACZ;EACE,kBAAA;EAAA,EAAA,KAAA,iBAAA,EAAA,YAAA,CAAA,CAAA,EAAA,KAAA,UAAA,QAAA,EAAA,WAAA,EAAA,SAAA,QAAA,EAAA,KAAA,IAAA,eAAA,EAAA,IAAA,WAAA;EAAA,MAAA,IAAA;EAAA,cAAA,IAAA;EAAA,WAAA,SAAA;;;EAEK,gBAAoB,MAAO,SAAE;AACzB,oBAAI,KAAA,MAAA,KAAA;;EACV,CAAA,CAAA,CAAU,CAAC,CAAA,CAAA"}
+{"version":3,"file":"canvas.ce.js","names":[],"sources":["../../../src/components/scenes/canvas.ce"],"sourcesContent":["<Canvas width={engine.width} height={engine.height}>\n  <Viewport worldWidth worldHeight clamp sortableChildren={true}>\n    @if (lightingAmbientEnabled()) {\n      <NightAmbiant\n        spots={nightLights}\n        darkness={lightingDarknessProps}\n        haze={lightingHaze}\n      />\n    }\n    @if (shadowEnabled()) {\n      <SpriteShadows\n        lights={shadowLights}\n        ambientLight={shadowAmbientLight}\n        minInfluence={shadowMinInfluence}\n        falloffPower={shadowFalloffPower}\n        mode={shadowMode}\n        updateHz={shadowUpdateHz}\n        scanHz={shadowScanHz}\n        cullToViewport={shadowCullToViewport}\n        shadowColor={shadowColor}\n      />\n    }\n    <SceneMap />\n  </Viewport>\n  @for (gui of guiList) {\n      <Container\n        positionType=\"absolute\"\n        top={0}\n        left={0}\n        right={0}\n        bottom={0}\n        width={engine.width}\n        height={engine.height}\n      >\n        @if (gui.display) {\n          <gui.component data={gui.data} dependencies={gui.dependencies} guiOpenId={gui.openId} onFinish={(data, guiOpenId) => {\n            onGuiFinish(gui, data, guiOpenId)\n          }} onInteraction={(name, data) => {\n            onGuiInteraction(gui, name, data)\n          }} /> \n        }\n      </Container>\n  }\n</Canvas>\n\n<script>\n  import { computed, effect } from \"canvasengine\";\n  import { inject } from \"../../core/inject\";\n  import { RpgClientEngine } from \"../../RpgClientEngine\";\n  import { RpgGui } from \"../../Gui/Gui\";\n  import { NightAmbiant, SpriteShadows } from '@canvasengine/presets'\n  import { shouldRenderLightingShadows } from \"@rpgjs/common\";\n\n  const engine = inject(RpgClientEngine);\n  const SceneMap = engine.sceneMapComponent;\n  const guiService = inject(RpgGui);\n  const sceneData = engine.sceneMap.data\n  const lighting = engine.sceneMap.lighting\n  const guiList = computed(() => {\n    return Object.values(guiService.gui()).filter((gui) => !gui.attachToSprite)\n  })\n  const worldWidth = computed(() => {\n    const data = sceneData?.()\n    const scale = Number(data?.params?.scale ?? 1) || 1\n    return Number(data?.width ?? data?.params?.width ?? 2048) * scale\n  })\n  const worldHeight = computed(() => {\n    const data = sceneData?.()\n    const scale = Number(data?.params?.scale ?? 1) || 1\n    return Number(data?.height ?? data?.params?.height ?? 2048) * scale\n  })\n\n  effect(() => {\n     if (sceneData() && !sceneData().component) {\n       throw new Error(\"Warning ! You need to define a component for the scene. Use provideLoadMap() to define a component for the scene.\")\n     }\n  })\n\n  const normalizeOpenId = (value) => {\n    const resolved = typeof value === \"function\" ? value() : value\n    return typeof resolved === \"string\" && resolved.length > 0 ? resolved : undefined\n  }\n\n  const onGuiFinish = (gui, data, guiOpenId) => {\n    const completedOpenId = normalizeOpenId(guiOpenId)\n    const currentOpenId = normalizeOpenId(gui.openId)\n    if (completedOpenId && currentOpenId && completedOpenId !== currentOpenId) return\n    guiService.guiClose(gui.name, data, completedOpenId ?? currentOpenId)\n  }\n\n  const onGuiInteraction = (gui, name, data) => {\n    guiService.guiInteraction(gui.name, name, data)\n  }\n\n  const clamp = {\n    direction: \"all\"\n  }\n  const NIGHT_SPOT_RADIUS_SCALE = 4.25\n  const NIGHT_SPOT_MIN_RADIUS = 170\n  const NIGHT_SPOT_MIN_INTENSITY = 1\n  const SHADOW_SPOT_RADIUS_SCALE = 12\n  const SHADOW_SPOT_MIN_RADIUS = 480\n\n  const toFiniteNumber = (value, fallback = null) => {\n    const number = Number(value)\n    return Number.isFinite(number) ? number : fallback\n  }\n  const clampNumber = (value, min, max) => Math.max(min, Math.min(max, value))\n  const nightSpotRadius = (radius) => Math.max(radius * NIGHT_SPOT_RADIUS_SCALE, NIGHT_SPOT_MIN_RADIUS)\n  const shadowSpotRadius = (radius) => Math.max(radius * SHADOW_SPOT_RADIUS_SCALE, SHADOW_SPOT_MIN_RADIUS)\n  const nightSpotIntensity = (intensity, fallback) => Math.max(intensity ?? fallback, NIGHT_SPOT_MIN_INTENSITY)\n  const shadowLightIntensity = (intensity, fallback = 1) => {\n    const value = Number(intensity ?? fallback)\n    return Number.isFinite(value) ? Math.max(0, value) : fallback\n  }\n  const shadowSpotIntensity = (intensity) => shadowLightIntensity(intensity, 1)\n\n  const lightingAmbient = computed(() => {\n    const state = lighting?.()\n    return state?.ambient ?? {}\n  })\n\n  const nightLights = computed(() => {\n    const state = lighting?.()\n    return (state?.spots ?? []).map((spot, index) => {\n      const radius = spot.radius ?? 180\n      return {\n        x: spot.x,\n        y: spot.y,\n        radius: nightSpotRadius(radius),\n        intensity: nightSpotIntensity(spot.intensity, index === 0 ? 1 : 0.92),\n        flicker: spot.flicker,\n        flickerSpeed: spot.flickerSpeed ?? 14,\n        pulse: spot.pulse,\n        pulseSpeed: spot.pulseSpeed,\n        phase: spot.phase,\n      }\n    })\n  })\n  const lightingDarkness = computed(() => {\n    const darkness = lightingAmbient().darkness\n    return typeof darkness === \"number\" ? darkness : 0\n  })\n\n  const lightingAmbientEnabled = computed(() => {\n    const state = lighting?.()\n    return Boolean(state && lightingDarkness() > 0)\n  })\n\n  const lightingDarknessProps = computed(() => ({\n    opacity: lightingDarkness(),\n    color: lightingAmbient().darkColor ?? \"#080a12\",\n  }))\n  const lightingHaze = computed(() => ({\n    color: lightingAmbient().fogColor ?? \"#12182a\",\n    radius: lightingAmbient().fogRadius ?? 0.44,\n    softness: lightingAmbient().fogSoftness ?? 0.3,\n    opacity: lightingAmbient().fogOpacity ?? 0.35,\n  }))\n\n  const defaultSunLight = () => {\n    const data = sceneData?.()\n    const width = Number(data?.width ?? data?.params?.width ?? 2048)\n    const height = Number(data?.height ?? data?.params?.height ?? 2048)\n    const scale = Number(data?.params?.scale ?? 1) || 1\n    const mapWidth = width * scale\n    const mapHeight = height * scale\n    const projectionBase = Math.max(1, mapWidth, mapHeight)\n\n    return {\n      x: -projectionBase * 24,\n      y: -projectionBase * 24,\n      z: 520,\n      radius: projectionBase * 160,\n      intensity: 0.85,\n      shadowWeight: lightingDarkness() > 0 ? 2.2 : 1,\n      enabled: true,\n    }\n  }\n\n  const normalizeSunDirection = (sun) => {\n    const x = toFiniteNumber(sun?.x, null)\n    const y = toFiniteNumber(sun?.y, null)\n    if (x !== null && y !== null && Math.hypot(x, y) > 0.001) {\n      return { x, y }\n    }\n    return { x: -0.45, y: -1 }\n  }\n\n  const defaultSunAmbientLight = () => {\n    const state = lighting?.()\n    if (!state?.sun || state.sun.enabled === false) return null\n\n    const defaultSun = defaultSunLight()\n    const sun = {\n      ...defaultSun,\n      ...state.sun,\n      intensity: shadowLightIntensity(state.sun.intensity, defaultSun.intensity),\n      shadowWeight: state.sun.shadowWeight ?? defaultSun.shadowWeight,\n    }\n    if (sun.intensity <= 0) return null\n\n    const direction = normalizeSunDirection(sun)\n    const shadowWeight = clampNumber(toFiniteNumber(sun.shadowWeight, lightingDarkness() > 0 ? 1.35 : 1) ?? 1, 0, 4)\n    const length = clampNumber(30 + sun.intensity * 38 * Math.max(0.75, shadowWeight), 30, 86)\n\n    return {\n      x: direction.x,\n      y: direction.y,\n      z: toFiniteNumber(sun.z, 520) ?? 520,\n      intensity: clampNumber(sun.intensity, 0, 2),\n      shadowWeight,\n      length,\n    }\n  }\n\n  const shadowState = computed(() => {\n    const state = lighting?.()\n    return state?.shadows ?? null\n  })\n\n  const shadowLights = computed(() => {\n    const state = lighting?.()\n    const spotLights = (state?.spots ?? []).map((spot) => {\n      const radius = spot.radius ?? 180\n      return {\n        x: spot.x,\n        y: spot.y,\n        z: 170,\n        radius: shadowSpotRadius(radius),\n        intensity: shadowSpotIntensity(spot.intensity),\n        shadowWeight: 1,\n        enabled: true,\n      }\n    })\n\n    return spotLights\n  })\n\n  const shadowAmbientLight = computed(() => {\n    const shadows = shadowState()\n    if (shadows?.ambientLight === null || shadows?.ambientLight?.enabled === false) {\n      return null\n    }\n    return shadows?.ambientLight ?? defaultSunAmbientLight()\n  })\n\n  const shadowEnabled = computed(() => {\n    const state = lighting?.()\n    return Boolean(shouldRenderLightingShadows(state) && (shadowLights().length > 0 || shadowAmbientLight()))\n  })\n\n  const shadowMode = computed(() => shadowState()?.mode ?? \"strongest\")\n  const shadowUpdateHz = computed(() => shadowState()?.updateHz ?? 60)\n  const shadowScanHz = computed(() => shadowState()?.scanHz ?? 8)\n  const shadowCullToViewport = computed(() => shadowState()?.cullToViewport ?? true)\n  const shadowMinInfluence = computed(() => shadowState()?.minInfluence ?? 0.24)\n  const shadowFalloffPower = computed(() => shadowState()?.falloffPower ?? 0.85)\n  const shadowColor = computed(() => shadowState()?.shadowColor ?? \"#05070d\")\n</script>\n"],"mappings":"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"}

package/dist/components/scenes/draw-map.ce.js

@@ -1,47 +1,44 @@
 import { inject } from "../../core/inject.js";
 import { RpgClientEngine } from "../../RpgClientEngine.js";
-import { Container, computed, cond, h, loop, signal, useDefineProps, useProps } from "canvasengine";
+import { Container, computed, cond, h, loop, useDefineEmits, useDefineProps, useProps } from "canvasengine";
 import { Weather } from "@canvasengine/presets";
 //#region src/components/scenes/draw-map.ce
 function component($$props) {
 	useProps($$props);
-	useDefineProps($$props);
-	var _a, _b, _c, _d;
-	var engine = inject(RpgClientEngine);
-	var componentAnimations = engine.componentAnimations;
-	var map = (_a = engine.sceneMap) === null || _a === void 0 ? void 0 : _a.data;
-	var sceneComponent = computed(function() {
-		var _a;
-		return (_a = map()) === null || _a === void 0 ? void 0 : _a.component;
+	const defineProps = useDefineProps($$props);
+	useDefineEmits($$props);
+	const { children } = defineProps();
+	const engine = inject(RpgClientEngine);
+	const componentAnimations = engine.componentAnimations;
+	const projectiles = engine.projectiles.current;
+	const map = engine.sceneMap?.data;
+	const sceneComponent = computed(() => map()?.component);
+	const weather = engine.sceneMap.weather;
+	const backgroundMusic = computed(() => {
+		const src = map()?.params?.backgroundMusic;
+		return src ? {
+			src,
+			autoplay: true,
+			loop: true
+		} : void 0;
 	});
-	(_b = map()) === null || _b === void 0 || _b.params;
-	var mapParams = (_c = map()) === null || _c === void 0 ? void 0 : _c.params;
-	engine.sceneMap.animations;
-	var weather = engine.sceneMap.weather;
-	var backgroundMusic = {
-		src: mapParams === null || mapParams === void 0 ? void 0 : mapParams.backgroundMusic,
-		autoplay: true,
-		loop: true
-	};
-	var backgroundAmbientSound = {
-		src: mapParams === null || mapParams === void 0 ? void 0 : mapParams.backgroundAmbientSound,
-		autoplay: true,
-		loop: true
-	};
-	signal((_d = map()) === null || _d === void 0 ? void 0 : _d.data);
-	var scale = (mapParams === null || mapParams === void 0 ? void 0 : mapParams.scale) || 1;
-	((mapParams === null || mapParams === void 0 ? void 0 : mapParams.width) || 2048) * scale;
-	((mapParams === null || mapParams === void 0 ? void 0 : mapParams.height) || 2048) * scale;
-	var shakeConfig = {
+	const backgroundAmbientSound = computed(() => {
+		const src = map()?.params?.backgroundAmbientSound;
+		return src ? {
+			src,
+			autoplay: true,
+			loop: true
+		} : void 0;
+	});
+	const shakeConfig = {
 		trigger: engine.mapShakeTrigger,
 		intensity: 10,
 		duration: 500,
 		frequency: 10,
 		direction: "both"
 	};
-	var weatherProps = computed(function() {
-		var _a, _b;
-		var state = weather === null || weather === void 0 ? void 0 : weather();
+	const weatherProps = computed(() => {
+		const state = weather?.();
 		if (!state) return null;
 		if (![
 			"rain",
@@ -49,7 +46,7 @@ function component($$props) {
 			"fog",
 			"cloud"
 		].includes(state.effect)) return null;
-		var params = (_a = state.params) !== null && _a !== void 0 ? _a : {};
+		const params = state.params ?? {};
 		return {
 			effect: state.effect,
 			speed: params.speed,
@@ -64,26 +61,29 @@ function component($$props) {
 			raySpread: params.raySpread,
 			rayTwinkle: params.rayTwinkle,
 			rayTwinkleSpeed: params.rayTwinkleSpeed,
-			zIndex: (_b = params.zIndex) !== null && _b !== void 0 ? _b : 1e3,
+			zIndex: params.zIndex ?? 1e3,
 			alpha: params.alpha,
 			blendMode: params.blendMode
 		};
 	});
 	return h(Container, {
-		sound: backgroundMusic,
 		shake: shakeConfig,
 		freeze: engine.gamePause
 	}, [
-		h(Container, { sound: backgroundAmbientSound }),
-		cond(computed(() => map() && sceneComponent()), () => h(sceneComponent(), {
+		cond(computed(() => backgroundMusic()), () => h(Container, { sound: computed(() => backgroundMusic()) })),
+		cond(computed(() => backgroundAmbientSound()), () => h(Container, { sound: computed(() => backgroundAmbientSound()) })),
+		h(Container, null, cond(computed(() => map() && sceneComponent()), () => h(sceneComponent(), {
 			data: computed(() => map().data),
 			params: computed(() => map().params)
-		})),
+		}))),
+		loop(children, (child) => h(child)),
 		loop(componentAnimations, (componentAnimation) => h(Container, null, loop(componentAnimation.current, (animation) => h(componentAnimation.component, animation)))),
-		cond(weatherProps, () => h(Weather, weatherProps()))
+		h(Container, { sortableChildren: true }, loop(computed(() => projectiles()), (projectile) => h(projectile.component, projectile.props), { track: (projectile) => projectile.props.id })),
+		cond(computed(() => weatherProps()), () => h(Weather, weatherProps()))
 	]);
 }
+var __ce_component = component;
 //#endregion
-export { component as default };
+export { __ce_component as default };
 
 //# sourceMappingURL=draw-map.ce.js.map

package/dist/components/scenes/draw-map.ce.js.map

@@ -1 +1 @@
-{"version":3,"file":"draw-map.ce.js","names":[],"sources":["../../../src/components/scenes/draw-map.ce"],"sourcesContent":["<Container sound={backgroundMusic} shake={shakeConfig} freeze={engine.gamePause}>\n  <Container sound={backgroundAmbientSound} />\n\n  @if (map() && sceneComponent()) {\n    <sceneComponent() data={map().data} params={map().params} />\n  }\n\n  @for (componentAnimation of componentAnimations) {\n    <Container>\n      @for (animation of componentAnimation.current) {\n        <componentAnimation.component ...animation />\n      }\n    </Container>\n  }\n\n  @if (weatherProps) {\n    <Weather ...weatherProps() />\n  }\n</Container>\n\n<script>\n    import { NoiseFilter } from 'pixi-filters';\n    import { effect, signal, computed, mount, on, tick } from 'canvasengine'\n    import { inject } from \"../../core/inject\";\n    import { RpgClientEngine } from \"../../RpgClientEngine\";\n    import { Weather } from '@canvasengine/presets'\n\n    const engine = inject(RpgClientEngine);\n    const componentAnimations = engine.componentAnimations\n    const map = engine.sceneMap?.data\n    const sceneComponent = computed(() => map()?.component)\n    const sceneParams = map()?.params\n    const mapParams = map()?.params\n    const animations = engine.sceneMap.animations\n    const weather = engine.sceneMap.weather\n    const backgroundMusic = { src: mapParams?.backgroundMusic, autoplay: true, loop: true }\n    const backgroundAmbientSound = { src: mapParams?.backgroundAmbientSound, autoplay: true, loop: true }\n\n    const data = signal(map()?.data)\n\n    const scale = mapParams?.scale || 1\n    const worldWidth = (mapParams?.width || 2048) * scale\n    const worldHeight = (mapParams?.height || 2048) * scale\n   \n    const clamp = {\n      direction: \"all\"\n    }\n\n    const shakeConfig = {\n      trigger: engine.mapShakeTrigger,\n      intensity: 10,\n      duration: 500,\n      frequency: 10,\n      direction: 'both'\n    }\n\n    const weatherProps = computed(() => {\n      const state = weather?.()\n      if (!state) {\n        return null\n      }\n      const validEffects = ['rain', 'snow', 'fog', 'cloud']\n      if (!validEffects.includes(state.effect)) {\n        return null\n      }\n      const params = state.params ?? {}\n      return {\n        effect: state.effect,\n        speed: params.speed,\n        windDirection: params.windDirection,\n        windStrength: params.windStrength,\n        density: params.density,\n        maxDrops: params.maxDrops,\n        height: params.height,\n        scale: params.scale,\n        sunIntensity: params.sunIntensity,\n        sunAngle: params.sunAngle,\n        raySpread: params.raySpread,\n        rayTwinkle: params.rayTwinkle,\n        rayTwinkleSpeed: params.rayTwinkleSpeed,\n        zIndex: params.zIndex ?? 1000,\n        alpha: params.alpha,\n        blendMode: params.blendMode,\n      }\n    })\n</script>\n"],"mappings":";;;;;AASM,SAAmB,UAAA,SAAmB;AACnC,UAAmB,QAAY;AAClC,gBAAA,QAAA;CACA,IAAA,IAAS,IAAA,IAAA;CACf,IAAE,SAAA,OAAA,gBAAA;;CAEF,IAAG,OAAI,KAAA,OAAc,cAAA,QAAA,OAAA,KAAA,IAAA,KAAA,IAAA,GAAA;CACrB,IAAI,iBAAY,SAAc,WAAE;EAAA,IAAA;AAAA,UAAA,KAAA,KAAA,MAAA,QAAA,OAAA,KAAA,IAAA,KAAA,IAAA,GAAA;GAAA;AAC9B,EAAA,KAAA,KAAA,MAAA,QAAA,OAAA,KAAA,KAAA,GAAA;CACF,IAAE,aAAS,KAAA,KAAA,MAAA,QAAA,OAAA,KAAA,IAAA,KAAA,IAAA,GAAA;;CAEX,IAAC,UAAM,OAAA,SAAA;CACP,IAAI,kBAAS;EAAW,KAAG,cAAW,QAAQ,cAAA,KAAA,IAAA,KAAA,IAAA,UAAA;EAAA,UAAA;EAAA,MAAA;EAAA;CAC9C,IAAI,yBAAyB;EAAA,KAAA,cAAqB,QAAO,cAAM,KAAY,IAAA,KAAA,IAAA,UAAA;EAAA,UAAA;EAAA,MAAA;EAAA;AAChE,SAAQ,KAAG,KAAO,MAAK,QAAK,OAAO,KAAA,IAAA,KAAA,IAAA,GAAA,KAAA;CAC9C,IAAI,SAAS,cAAA,QAAsB,cAAQ,KAAA,IAAe,KAAC,IAAA,UAAA,UAAA;AAC9C,GAAA,cAAiB,QAAA,cAAoB,KAAA,IAAA,KAAA,IAAA,UAAA,UAAA,QAAA;;CAKlD,IAAI,cAAM;EACN,SAAM,OAAA;EACN,WAAM;EACN,UAAM;EACN,WAAM;EACN,WAAM;EACT;;EAEG,IAAA,IAAM;;AAEN,MAAA,CAAK,MACL,QAAM;AAGN,MAAA,CADF;GAAA;GAAA;GAAA;GAAA;GAAA,CACgB,SAAA,MAAA,OAAA,CACZ,QAAS;;AAGX,SAAM;GACJ,QAAS,MAAO;GAChB,OAAS,OAAI;GACb,eAAa,OAAA;GACb,cAAa,OAAA;GACb,SAAW,OAAK;GAClB,UAAA,OAAA;;GAEA,OAAM,OAAY;GAChB,cAAc,OAAS;GACrB,UAAU,OAAA;GACV,WAAO,OAAA;GACT,YAAA,OAAA;GACA,iBAAmB,OAAI;GACrB,SAAG,KAAA,OAAa,YAAe,QAAS,OAAA,KAAA,IAAA,KAAA;GACxC,OAAO,OAAA;GACT,WAAA,OAAA;GACD;GACH;AAEM,QADQ,EAAM,WAAM;EAAA,OAAA;EAAA,OAAA;EAAA,QAAA,OAAA;EAAA,EAAA;EAAA,EAAA,WAAA,EAAA,OAAA,wBAAA,CAAA;EAAA,KAAA,eAAA,KAAA,IAAA,gBAAA,CAAA,QAAA,EAAA,gBAAA,EAAA;GAAA,MAAA,eAAA,KAAA,CAAA,KAAA;GAAA,QAAA,eAAA,KAAA,CAAA,OAAA;GAAA,CAAA,CAAA;EAAA,KAAA,sBAAA,uBAAA,EAAA,WAAA,MAAA,KAAA,mBAAA,UAAA,cAAA,EAAA,mBAAA,WAAA,UAAA,CAAA,CAAA,CAAA;EAAA,KAAA,oBAAA,EAAA,SAAA,cAAA,CAAA,CAAA;EAAA,CAAA"}
+{"version":3,"file":"draw-map.ce.js","names":[],"sources":["../../../src/components/scenes/draw-map.ce"],"sourcesContent":["<Container shake={shakeConfig} freeze={engine.gamePause}>\n  @if (backgroundMusic()) {\n    <Container sound={backgroundMusic()} />\n  }\n\n  @if (backgroundAmbientSound()) {\n    <Container sound={backgroundAmbientSound()} />\n  }\n\n  <Container>\n    @if (map() && sceneComponent()) {\n      <sceneComponent() data={map().data} params={map().params} />\n    }\n  </Container>\n\n  @for (child of children) {\n    <child />\n  }\n\n  @for (componentAnimation of componentAnimations) {\n    <Container>\n      @for (animation of componentAnimation.current) {\n        <componentAnimation.component ...animation />\n      }\n    </Container>\n  }\n\n  <Container sortableChildren={true}>\n    @for (projectile of projectiles() ; track projectile.props.id) {\n      <projectile.component ...projectile.props />\n    }\n  </Container>\n\n  @if (weatherProps()) {\n    <Weather ...weatherProps() />\n  }\n</Container>\n\n<script>\n    import { computed, effect } from 'canvasengine'\n    import { inject } from \"../../core/inject\";\n    import { RpgClientEngine } from \"../../RpgClientEngine\";\n    import { Weather } from '@canvasengine/presets'\n\n    const { children } = defineProps()\n    const engine = inject(RpgClientEngine);\n    const componentAnimations = engine.componentAnimations\n    const projectiles = engine.projectiles.current\n    const map = engine.sceneMap?.data\n    const sceneComponent = computed(() => map()?.component)\n    const weather = engine.sceneMap.weather\n    const backgroundMusic = computed(() => {\n      const src = map()?.params?.backgroundMusic\n      return src ? { src, autoplay: true, loop: true } : undefined\n    })\n    const backgroundAmbientSound = computed(() => {\n      const src = map()?.params?.backgroundAmbientSound\n      return src ? { src, autoplay: true, loop: true } : undefined\n    })\n\n    const shakeConfig = {\n      trigger: engine.mapShakeTrigger,\n      intensity: 10,\n      duration: 500,\n      frequency: 10,\n      direction: 'both'\n    }\n\n    const weatherProps = computed(() => {\n      const state = weather?.()\n      if (!state) {\n        return null\n      }\n      const validEffects = ['rain', 'snow', 'fog', 'cloud']\n      if (!validEffects.includes(state.effect)) {\n        return null\n      }\n      const params = state.params ?? {}\n      return {\n        effect: state.effect,\n        speed: params.speed,\n        windDirection: params.windDirection,\n        windStrength: params.windStrength,\n        density: params.density,\n        maxDrops: params.maxDrops,\n        height: params.height,\n        scale: params.scale,\n        sunIntensity: params.sunIntensity,\n        sunAngle: params.sunAngle,\n        raySpread: params.raySpread,\n        rayTwinkle: params.rayTwinkle,\n        rayTwinkleSpeed: params.rayTwinkleSpeed,\n        zIndex: params.zIndex ?? 1000,\n        alpha: params.alpha,\n        blendMode: params.blendMode,\n      }\n    })\n</script>\n"],"mappings":";;;;;AASG,SAAS,UAAA,SAAA;CACM,SAAc,OAAI;CAC7B,MAAA,cAAqB,eAAc,OAAQ;CAC9C,eAAA,OAAA;CACA,MAAS,EAAA,aAAA,YAAA;;CAEb,MAAM,sBAAqB,OAAA;CAC3B,MAAK,cAAO,OAAA,YAAA;CACZ,MAAE,MAAA,OAAA,UAAA;;CAEF,MAAM,UAAE,OAAA,SAAsB;CAC9B,MAAK,kBAAS,eAAA;EACV,MAAM,MAAE,IAAA,GAAU,QAAG;EACrB,OAAK,MAAA;GAAA;GAAA,UAAmB;GAAY,MAAC;EAAU,IAAC,KAAA;CACpD,CAAC;CACD,MAAM,yBAAS,eAAA;EACb,MAAA,MAAA,IAAA,GAAA,QAAA;;;;;;CAEF,CAAC;CACD,MAAK,cAAe;EAChB,SAAG,OAAW;EACd,WAAA;EACA,UAAS;;EAEV,WAAI;CACP;CACA,MAAE,eAAA,eAAA;EACA,MAAA,QAAS,UAAA;cAEJ,OAAA;EAGH,IAAA,CAAA;GADsB;GAAQ;GAAK;GAAO;EACjC,EAAA,SAAkB,MAAM,MAAM,GACvC,OAAS;EAET,MAAM,SAAE,MAAa,UAAA,CAAW;EAChC,OAAM;GACN,QAAM,MAAA;GACN,OAAM,OAAY;GAClB,eAAmB,OAAA;GACnB,cAAM,OAAiB;GACvB,SAAa,OAAG;GAChB,UAAM,OAAe;GACnB,QAAU,OAAO;GACjB,OAAO,OAAQ;GAChB,cAAA,OAAA;GACD,UAAM,OAAA;GACJ,WAAY,OAAO;GACnB,YAAc,OAAM;GACrB,iBAAA,OAAA;;GAED,OAAM,OAAY;GAChB,WAAS,OAAO;EAClB;CACJ,CAAC;CAEK,OADa,EAAA,WAAA;EAAA,OAAA;EAAA,QAAA,OAAA;CAAA,GAAA;EAAA,KAAA,eAAA,gBAAA,CAAA,SAAA,EAAA,WAAA,EAAA,OAAA,eAAA,gBAAA,CAAA,EAAA,CAAA,CAAA;EAAA,KAAA,eAAA,uBAAA,CAAA,SAAA,EAAA,WAAA,EAAA,OAAA,eAAA,uBAAA,CAAA,EAAA,CAAA,CAAA;EAAA,EAAA,WAAA,MAAA,KAAA,eAAA,IAAA,KAAA,eAAA,CAAA,SAAA,EAAA,eAAA,GAAA;GAAA,MAAA,eAAA,IAAA,EAAA,IAAA;GAAA,QAAA,eAAA,IAAA,EAAA,MAAA;EAAA,CAAA,CAAA,CAAA;EAAA,KAAA,WAAA,UAAA,EAAA,KAAA,CAAA;EAAA,KAAA,sBAAA,uBAAA,EAAA,WAAA,MAAA,KAAA,mBAAA,UAAA,cAAA,EAAA,mBAAA,WAAA,SAAA,CAAA,CAAA,CAAA;EAAA,EAAA,WAAA,EAAA,kBAAA,KAAA,GAAA,KAAA,eAAA,YAAA,CAAA,IAAA,eAAA,EAAA,WAAA,WAAA,WAAA,KAAA,GAAA,EAAA,QAAA,eAAA,WAAA,MAAA,GAAA,CAAA,CAAA;EAAA,KAAA,eAAA,aAAA,CAAA,SAAA,EAAA,SAAA,aAAA,CAAA,CAAA;CAAA,CACD;AACd;AAEA,IAAM,iBAAe"}

package/dist/components/scenes/event-layer.ce.js

@@ -1,28 +1,69 @@
 import { inject } from "../../core/inject.js";
 import { RpgClientEngine } from "../../RpgClientEngine.js";
-import component$1 from "../character.ce.js";
-import { Container, h, loop, useDefineProps, useProps } from "canvasengine";
+import __ce_component$1 from "../character.ce.js";
+import { Container, effect, h, loop, mount, useDefineEmits, useDefineProps, useProps } from "canvasengine";
 //#region src/components/scenes/event-layer.ce
 function component($$props) {
 	useProps($$props);
 	const defineProps = useDefineProps($$props);
-	var engine = inject(RpgClientEngine);
-	var children = defineProps().children;
-	var players = engine.sceneMap.players;
-	var events = engine.sceneMap.events;
-	return h(Container, { sortableChildren: true }, [
-		loop(events, (event, id) => h(component$1, {
+	useDefineEmits($$props);
+	const engine = inject(RpgClientEngine);
+	const { children, pixiChildren } = defineProps({ pixiChildren: { default: [] } });
+	const readValue = (value) => typeof value === "function" ? value() : value;
+	let rootContainer = null;
+	let mountedPixiChildren = [];
+	const players = engine.sceneMap.players;
+	const events = engine.sceneMap.events;
+	const getPixiChildren = () => {
+		const value = readValue(pixiChildren);
+		return Array.isArray(value) ? value.filter(Boolean) : [];
+	};
+	const syncPixiChildren = () => {
+		if (!rootContainer) return;
+		const nextPixiChildren = getPixiChildren();
+		mountedPixiChildren.forEach((child) => {
+			if (!nextPixiChildren.includes(child) && child.parent === rootContainer) rootContainer.removeChild(child);
+		});
+		nextPixiChildren.forEach((child) => {
+			if (child.parent === rootContainer) return;
+			if (child.parent) child.parent.removeChild(child);
+			rootContainer.addChild(child);
+		});
+		mountedPixiChildren = nextPixiChildren;
+	};
+	const detachPixiChildren = () => {
+		if (!rootContainer) return;
+		mountedPixiChildren.forEach((child) => {
+			if (child.parent === rootContainer) rootContainer.removeChild(child);
+		});
+		mountedPixiChildren = [];
+	};
+	effect(() => {
+		readValue(pixiChildren);
+		syncPixiChildren();
+	});
+	mount((element) => {
+		rootContainer = element.componentInstance;
+		syncPixiChildren();
+		return detachPixiChildren;
+	});
+	return h(Container, {
+		sortableChildren: true,
+		onBeforeDestroy: detachPixiChildren
+	}, [
+		loop(events, (event, id) => h(__ce_component$1, {
 			id,
 			object: event
 		})),
-		loop(players, (player, id) => h(component$1, {
+		loop(players, (player, id) => h(__ce_component$1, {
 			id,
 			object: player
 		})),
 		loop(children, (child) => h(child))
 	]);
 }
+var __ce_component = component;
 //#endregion
-export { component as default };
+export { __ce_component as default };
 
 //# sourceMappingURL=event-layer.ce.js.map

package/dist/components/scenes/event-layer.ce.js.map

@@ -1 +1 @@
-{"version":3,"file":"event-layer.ce.js","names":[],"sources":["../../../src/components/scenes/event-layer.ce"],"sourcesContent":["<Container sortableChildren={true}>\n    @for ((event,id) of events) {\n        <Character id={id} object={event}  />\n    }\n\n    @for ((player,id) of players) {\n        <Character id={id} object={player} />\n    }\n\n    @for (child of children) {\n        <child />\n    }\n</Container>\n\n<script>\n    import { effect, signal } from 'canvasengine'\n    import { inject } from \"../../core/inject\";\n    import { RpgClientEngine } from \"../../RpgClientEngine\";\n    import Character from \"../character.ce\";\n    import LightHalo from \"../prebuilt/light-halo.ce\";\n   \n    const engine = inject(RpgClientEngine);\n    const { children } = defineProps()\n    \n    const players = engine.sceneMap.players\n    const events = engine.sceneMap.events\n</script>"],"mappings":";;;;;;AASmB,UAAU,QAAA;CACrB,MAAM,cAAE,eAAA,QAAA;CACZ,IAAA,SAAA,OAAA,gBAAA;CACJ,IAAE,WAAS,aAAA,CAAA;;CAEX,IAAC,SAAM,OAAA,SAAA;AAEH,QADgB,EAAC,WAAS,EAAK,kBAAa,MAAA,EAAA;EAAA,KAAA,SAAA,OAAA,OAAA,EAAA,aAAA;GAAA;GAAA,QAAA;GAAA,CAAA,CAAA;EAAA,KAAA,UAAA,QAAA,OAAA,EAAA,aAAA;GAAA;GAAA,QAAA;GAAA,CAAA,CAAA;EAAA,KAAA,WAAA,UAAA,EAAA,MAAA,CAAA;EAAA,CAAA"}
+{"version":3,"file":"event-layer.ce.js","names":[],"sources":["../../../src/components/scenes/event-layer.ce"],"sourcesContent":["<Container sortableChildren={true} onBeforeDestroy={detachPixiChildren}>\n    @for ((event,id) of events) {\n        <Character id={id} object={event}  />\n    }\n\n    @for ((player,id) of players) {\n        <Character id={id} object={player} />\n    }\n\n    @for (child of children) {\n        <child />\n    }\n</Container>\n\n<script>\n    import { effect, mount } from \"canvasengine\";\n    import { inject } from \"../../core/inject\";\n    import { RpgClientEngine } from \"../../RpgClientEngine\";\n    import Character from \"../character.ce\";\n    import LightHalo from \"../prebuilt/light-halo.ce\";\n   \n    const engine = inject(RpgClientEngine);\n    const { children, pixiChildren } = defineProps({\n        pixiChildren: {\n            default: []\n        }\n    })\n    const readValue = (value) => typeof value === \"function\" ? value() : value\n    let rootContainer = null\n    let mountedPixiChildren = []\n    \n    const players = engine.sceneMap.players\n    const events = engine.sceneMap.events\n\n    const getPixiChildren = () => {\n        const value = readValue(pixiChildren)\n        return Array.isArray(value) ? value.filter(Boolean) : []\n    }\n\n    const syncPixiChildren = () => {\n        if (!rootContainer) return\n        const nextPixiChildren = getPixiChildren()\n        mountedPixiChildren.forEach((child) => {\n            if (!nextPixiChildren.includes(child) && child.parent === rootContainer) {\n                rootContainer.removeChild(child)\n            }\n        })\n        nextPixiChildren.forEach((child) => {\n            if (child.parent === rootContainer) return\n            if (child.parent) {\n                child.parent.removeChild(child)\n            }\n            rootContainer.addChild(child)\n        })\n        mountedPixiChildren = nextPixiChildren\n    }\n\n    const detachPixiChildren = () => {\n        if (!rootContainer) return\n        mountedPixiChildren.forEach((child) => {\n            if (child.parent === rootContainer) {\n                rootContainer.removeChild(child)\n            }\n        })\n        mountedPixiChildren = []\n    }\n\n    effect(() => {\n        readValue(pixiChildren)\n        syncPixiChildren()\n    })\n\n    mount((element) => {\n        rootContainer = element.componentInstance\n        syncPixiChildren()\n        return detachPixiChildren\n    })\n</script>\n"],"mappings":";;;;;AASK,SAAU,UAAI,SAAU;CACb,SAAA,OAAA;CACZ,MAAA,cAAA,eAAA,OAAA;CACO,eAAA,OAAA;;CAEX,MAAC,EAAM,UAAA,iBAAA,YAAA,EACH,cAAS,EACT,SAAS,CAAA,EACT,EACJ,CAAC;CACD,MAAI,aAAO,UAAkB,OAAC,UAAe,aAAQ,MAAA,IAAA;CACrD,IAAE,gBAAA;CACF,IAAI,sBAAsB,CAAA;CAC1B,MAAI,UAAQ,OAAU,SAAA;CACtB,MAAM,SAAE,OAAc,SAAA;CACtB,MAAM,wBAAgB;EAClB,MAAI,QAAA,UAAA,YAAA;EACJ,OAAC,MAAA,QAAA,KAAA,IAAA,MAAA,OAAA,OAAA,IAAA,CAAA;CACL;CACA,MAAI,yBAAoB;EACpB,IAAI,CAAA,eACL;EACC,MAAM,mBAAiB,gBAAS;EAChC,oBAAe,SAAO,UAAS;4EAEzB,cAAgB,YAAQ,KAAA;EAE9B,CAAC;EACD,iBAAA,SAAA,UAAA;uCAEM;GACF,IAAI,MAAC,QACL,MAAM,OAAA,YAAmB,KAAA;GAEzB,cAAS,SAAA,KAAiB;EAC9B,CAAC;EACD,sBAAQ;CACZ;CACA,MAAM,2BAA2B;EAC7B,IAAI,CAAC,eACD;EACJ,oBAAkB,SAAO,UAAY;GACjC,IAAI,MAAA,WAAA,eACA,cAAc,YAAS,KAAK;EAEpC,CAAC;EACD,sBAAA,CAAA;;CAEJ,aAAU;EACN,UAAS,YAAa;EACtB,iBAAI;CACR,CAAC;CACD,OAAO,YAAS;EACZ,gBAAQ,QAAA;EACR,iBAAK;EACL,OAAI;CACR,CAAC;CAEG,OAAA,EAAA,WAAA;;;;;;;;;;;;;EAAa;AACX;AAED,IAAA,iBAAA"}

package/dist/core/inject.js

@@ -1,4 +1,4 @@
-import { inject as inject$1 } from "../node_modules/.pnpm/@signe_di@2.9.0/node_modules/@signe/di/dist/index.js";
+import { inject as inject$1 } from "../node_modules/.pnpm/@signe_di@3.1.0/node_modules/@signe/di/dist/index.js";
 //#region src/core/inject.ts
 var context = null;
 function inject(service, _context) {

package/dist/core/inject.js.map

@@ -1 +1 @@
-{"version":3,"file":"inject.js","names":[],"sources":["../../src/core/inject.ts"],"sourcesContent":["import { Context, inject as injector } from \"@signe/di\";\n\nexport let context: Context | null = null\n\nexport function inject<T>(service: (new (...args: any[]) => T) | string, _context?: Context): T {\n    const c = _context ?? context\n    if (!c) throw new Error(\"Context is not set. use setInject() to set the context\");\n    return injector(c, service);\n}\n\nexport function setInject(_context: Context) {\n    context = _context;\n}\n\nexport function clearInject() {\n    context = null\n}"],"mappings":";;AAEA,IAAW,UAA0B;AAErC,SAAgB,OAAU,SAA+C,UAAuB;CAC5F,MAAM,IAAI,YAAY;AACtB,KAAI,CAAC,EAAG,OAAM,IAAI,MAAM,yDAAyD;AACjF,QAAO,SAAS,GAAG,QAAQ;;AAG/B,SAAgB,UAAU,UAAmB;AACzC,WAAU;;AAGd,SAAgB,cAAc;AAC1B,WAAU"}
+{"version":3,"file":"inject.js","names":[],"sources":["../../src/core/inject.ts"],"sourcesContent":["import { Context, inject as injector } from \"@signe/di\";\n\nexport let context: Context | null = null\n\nexport function inject<T>(service: (new (...args: any[]) => T) | string, _context?: Context): T {\n    const c = _context ?? context\n    if (!c) throw new Error(\"Context is not set. use setInject() to set the context\");\n    return injector(c, service);\n}\n\nexport function setInject(_context: Context) {\n    context = _context;\n}\n\nexport function clearInject() {\n    context = null\n}"],"mappings":";;AAEA,IAAW,UAA0B;AAErC,SAAgB,OAAU,SAA+C,UAAuB;CAC5F,MAAM,IAAI,YAAY;CACtB,IAAI,CAAC,GAAG,MAAM,IAAI,MAAM,wDAAwD;CAChF,OAAO,SAAS,GAAG,OAAO;AAC9B;AAEA,SAAgB,UAAU,UAAmB;CACzC,UAAU;AACd;AAEA,SAAgB,cAAc;CAC1B,UAAU;AACd"}

package/dist/core/setup.js

@@ -1,4 +1,4 @@
-import { Context, inject, injector } from "../node_modules/.pnpm/@signe_di@2.9.0/node_modules/@signe/di/dist/index.js";
+import { Context, inject, injector } from "../node_modules/.pnpm/@signe_di@3.1.0/node_modules/@signe/di/dist/index.js";
 import { setInject } from "./inject.js";
 import { RpgClientEngine } from "../RpgClientEngine.js";
 //#region src/core/setup.ts

package/dist/core/setup.js.map

@@ -1 +1 @@
-{"version":3,"file":"setup.js","names":[],"sources":["../../src/core/setup.ts"],"sourcesContent":["import { Context, FactoryProvider, findProvider, findProviders, inject, injector, Providers } from \"@signe/di\";\nimport { RpgClientEngine } from \"../RpgClientEngine\";\nimport { setInject } from \"./inject\";\n\ninterface SetupOptions {\n  providers: Providers;\n}\n\n\nexport async function startGame(options: SetupOptions) {\n  const context = new Context();\n  context['side'] = 'client'\n  setInject(context);\n\n  await injector(context, options.providers);\n\n  const engine = inject(context, RpgClientEngine);\n  await engine.start();\n  return context;\n}"],"mappings":";;;;AASA,eAAsB,UAAU,SAAuB;CACrD,MAAM,UAAU,IAAI,SAAS;AAC7B,SAAQ,UAAU;AAClB,WAAU,QAAQ;AAElB,OAAM,SAAS,SAAS,QAAQ,UAAU;AAG1C,OADe,OAAO,SAAS,gBAAgB,CAClC,OAAO;AACpB,QAAO"}
+{"version":3,"file":"setup.js","names":[],"sources":["../../src/core/setup.ts"],"sourcesContent":["import { Context, FactoryProvider, findProvider, findProviders, inject, injector, Providers } from \"@signe/di\";\nimport { RpgClientEngine } from \"../RpgClientEngine\";\nimport { setInject } from \"./inject\";\n\ninterface SetupOptions {\n  providers: Providers;\n}\n\n\nexport async function startGame(options: SetupOptions) {\n  const context = new Context();\n  context['side'] = 'client'\n  setInject(context);\n\n  await injector(context, options.providers);\n\n  const engine = inject<RpgClientEngine>(context, RpgClientEngine);\n  await engine.start();\n  return context;\n}\n"],"mappings":";;;;AASA,eAAsB,UAAU,SAAuB;CACrD,MAAM,UAAU,IAAI,QAAQ;CAC5B,QAAQ,UAAU;CAClB,UAAU,OAAO;CAEjB,MAAM,SAAS,SAAS,QAAQ,SAAS;CAGzC,MADe,OAAwB,SAAS,eAC1C,EAAO,MAAM;CACnB,OAAO;AACT"}

package/dist/decorators/spritesheet.d.ts

@@ -0,0 +1 @@
+export declare function Spritesheet(options?: Record<string, any>): (target: any) => void;

package/dist/decorators/spritesheet.js

@@ -0,0 +1,11 @@
+//#region src/decorators/spritesheet.ts
+function Spritesheet(options = {}) {
+	return (target) => {
+		Object.assign(target, options);
+		if (target.prototype) Object.assign(target.prototype, options);
+	};
+}
+//#endregion
+export { Spritesheet };
+
+//# sourceMappingURL=spritesheet.js.map

package/dist/decorators/spritesheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spritesheet.js","names":[],"sources":["../../src/decorators/spritesheet.ts"],"sourcesContent":["export function Spritesheet(options: Record<string, any> = {}) {\n  return (target: any) => {\n    Object.assign(target, options);\n    if (target.prototype) {\n      Object.assign(target.prototype, options);\n    }\n  };\n}\n"],"mappings":";AAAA,SAAgB,YAAY,UAA+B,CAAC,GAAG;CAC7D,QAAQ,WAAgB;EACtB,OAAO,OAAO,QAAQ,OAAO;EAC7B,IAAI,OAAO,WACT,OAAO,OAAO,OAAO,WAAW,OAAO;CAE3C;AACF"}