@rpgjs/client 5.0.0-beta.7 → 5.0.0-beta.9

package/CHANGELOG.md

@@ -0,0 +1,27 @@
+# @rpgjs/client
+
+## 5.0.0-beta.9
+
+### Major Changes
+
+- c456d25: beta.9
+
+### Patch Changes
+
+- Updated dependencies [c456d25]
+  - @rpgjs/common@5.0.0-beta.9
+  - @rpgjs/server@5.0.0-beta.9
+  - @rpgjs/ui-css@5.0.0-beta.9
+
+## 5.0.0-beta.8
+
+### Major Changes
+
+- 35e7fa4: beta.8
+
+### Patch Changes
+
+- Updated dependencies [35e7fa4]
+  - @rpgjs/common@5.0.0-beta.8
+  - @rpgjs/server@5.0.0-beta.8
+  - @rpgjs/ui-css@5.0.0-beta.8

package/dist/Game/AnimationManager.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnimationManager.js","names":[],"sources":["../../src/Game/AnimationManager.ts"],"sourcesContent":["import { generateUID, RpgCommonPlayer } from \"@rpgjs/common\";\nimport { signal } from \"canvasengine\";\n\nexport class AnimationManager {\n  current = signal<any[]>([]);\n\n  displayEffect(params: any, player: RpgCommonPlayer | { x: number, y: number }): Promise<void> {\n    const id = generateUID();\n    const effectParams = params ?? {};\n    return new Promise<void>((resolve) => {\n      let finished = false;\n      const finish = (data?: any) => {\n        if (finished) return;\n        finished = true;\n        const index = this.current().findIndex((value) => value.id === id);\n        if (index !== -1) {\n          this.current().splice(index, 1);\n        }\n        effectParams.onFinish?.(data);\n        resolve();\n      };\n\n      this.current().push({\n        ...effectParams,\n        id,\n        x: player.x,\n        y: player.y,\n        object: player,\n        onFinish: finish,\n      });\n    });\n  }\n}\n"],"mappings":";;;AAGA,IAAa,mBAAb,MAA8B;;iBAClB,OAAc,EAAE,CAAC;;CAE3B,cAAc,QAAa,QAAmE;EAC5F,MAAM,KAAK,aAAa;EACxB,MAAM,eAAe,UAAU,EAAE;EACjC,OAAO,IAAI,SAAe,YAAY;GACpC,IAAI,WAAW;GACf,MAAM,UAAU,SAAe;IAC7B,IAAI,UAAU;IACd,WAAW;IACX,MAAM,QAAQ,KAAK,SAAS,CAAC,WAAW,UAAU,MAAM,OAAO,GAAG;IAClE,IAAI,UAAU,IACZ,KAAK,SAAS,CAAC,OAAO,OAAO,EAAE;IAEjC,aAAa,WAAW,KAAK;IAC7B,SAAS;;GAGX,KAAK,SAAS,CAAC,KAAK;IAClB,GAAG;IACH;IACA,GAAG,OAAO;IACV,GAAG,OAAO;IACV,QAAQ;IACR,UAAU;IACX,CAAC;IACF"}
+{"version":3,"file":"AnimationManager.js","names":[],"sources":["../../src/Game/AnimationManager.ts"],"sourcesContent":["import { generateUID, RpgCommonPlayer } from \"@rpgjs/common\";\nimport { signal } from \"canvasengine\";\n\nexport class AnimationManager {\n  current = signal<any[]>([]);\n\n  displayEffect(params: any, player: RpgCommonPlayer | { x: number, y: number }): Promise<void> {\n    const id = generateUID();\n    const effectParams = params ?? {};\n    return new Promise<void>((resolve) => {\n      let finished = false;\n      const finish = (data?: any) => {\n        if (finished) return;\n        finished = true;\n        const index = this.current().findIndex((value) => value.id === id);\n        if (index !== -1) {\n          this.current().splice(index, 1);\n        }\n        effectParams.onFinish?.(data);\n        resolve();\n      };\n\n      this.current().push({\n        ...effectParams,\n        id,\n        x: player.x,\n        y: player.y,\n        object: player,\n        onFinish: finish,\n      });\n    });\n  }\n}\n"],"mappings":";;;AAGA,IAAa,mBAAb,MAA8B;;iBAClB,OAAc,CAAC,CAAC;;CAE1B,cAAc,QAAa,QAAmE;EAC5F,MAAM,KAAK,YAAY;EACvB,MAAM,eAAe,UAAU,CAAC;EAChC,OAAO,IAAI,SAAe,YAAY;GACpC,IAAI,WAAW;GACf,MAAM,UAAU,SAAe;IAC7B,IAAI,UAAU;IACd,WAAW;IACX,MAAM,QAAQ,KAAK,QAAQ,EAAE,WAAW,UAAU,MAAM,OAAO,EAAE;IACjE,IAAI,UAAU,IACZ,KAAK,QAAQ,EAAE,OAAO,OAAO,CAAC;IAEhC,aAAa,WAAW,IAAI;IAC5B,QAAQ;GACV;GAEA,KAAK,QAAQ,EAAE,KAAK;IAClB,GAAG;IACH;IACA,GAAG,OAAO;IACV,GAAG,OAAO;IACV,QAAQ;IACR,UAAU;GACZ,CAAC;EACH,CAAC;CACH;AACF"}

package/dist/Game/Event.js.map

@@ -1 +1 @@
-{"version":3,"file":"Event.js","names":[],"sources":["../../src/Game/Event.ts"],"sourcesContent":["import { RpgClientObject } from \"./Object\"; \n\nexport class RpgClientEvent extends RpgClientObject {\n    _type = 'event'\n}   "],"mappings":";;AAEA,IAAa,iBAAb,cAAoC,gBAAgB;;;eACxC"}
+{"version":3,"file":"Event.js","names":[],"sources":["../../src/Game/Event.ts"],"sourcesContent":["import { RpgClientObject } from \"./Object\"; \n\nexport class RpgClientEvent extends RpgClientObject {\n    _type = 'event'\n}   "],"mappings":";;AAEA,IAAa,iBAAb,cAAoC,gBAAgB;;;eACxC;;AACZ"}

package/dist/Game/Map.d.ts

@@ -1,4 +1,4 @@
-import { RpgCommonMap, WeatherState, MapPhysicsInitContext, MapPhysicsEntityContext } from '@rpgjs/common';
+import { RpgCommonMap, LightSpot, LightingState, WeatherState, MapPhysicsInitContext, MapPhysicsEntityContext } from '@rpgjs/common';
 import { RpgClientEngine } from '../RpgClientEngine';
 export declare class RpgClientMap extends RpgCommonMap<any> {
     engine: RpgClientEngine;
@@ -7,7 +7,10 @@ export declare class RpgClientMap extends RpgCommonMap<any> {
     currentPlayer: any;
     weatherState: any;
     localWeatherOverride: any;
+    lightingState: any;
+    localLightSpots: any;
     weather: any;
+    lighting: any;
     private manualClientPhysicsTick;
     private readonly isTestEnvironment;
     constructor();
@@ -17,6 +20,11 @@ export declare class RpgClientMap extends RpgCommonMap<any> {
     getWeather(): WeatherState | null;
     setLocalWeather(next: WeatherState | null): void;
     clearLocalWeather(): void;
+    getLighting(): LightingState | null;
+    addLightSpot(id: string, spot: LightSpot): void;
+    patchLightSpot(id: string, patch: Partial<LightSpot>): void;
+    removeLightSpot(id: string): void;
+    clearLightSpots(): void;
     stepClientPhysics(deltaMs: number): number;
     stepPredictionTick(): void;
     protected emitPhysicsInit(context: MapPhysicsInitContext): void;

package/dist/Game/Map.js

@@ -1,12 +1,12 @@
 import { inject } from "../core/inject.js";
-import { sync, users } from "../node_modules/.pnpm/@signe_sync@2.10.0/node_modules/@signe/sync/dist/index.js";
+import { sync, users } from "../node_modules/.pnpm/@signe_sync@3.0.1/node_modules/@signe/sync/dist/index.js";
 import { RpgClientPlayer } from "./Player.js";
 import { RpgClientEvent } from "./Event.js";
-import { __decorateMetadata } from "../_virtual/_@oxc-project_runtime@0.128.0/helpers/decorateMetadata.js";
-import { __decorate } from "../_virtual/_@oxc-project_runtime@0.128.0/helpers/decorate.js";
+import { __decorateMetadata } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorateMetadata.js";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
 import { RpgClientEngine } from "../RpgClientEngine.js";
 import { computed, signal } from "canvasengine";
-import { RpgCommonMap } from "@rpgjs/common";
+import { RpgCommonMap, cloneLightingState, normalizeLightingState } from "@rpgjs/common";
 //#region src/Game/Map.ts
 var RpgClientMap = class extends RpgCommonMap {
 	constructor() {
@@ -17,13 +17,28 @@ var RpgClientMap = class extends RpgCommonMap {
 		this.currentPlayer = computed(() => this.players()[this.engine.playerIdSignal()]);
 		this.weatherState = signal(null);
 		this.localWeatherOverride = signal(null);
+		this.lightingState = signal(null);
+		this.localLightSpots = signal({});
 		this.weather = computed(() => {
 			const local = this.localWeatherOverride();
 			const state = this.weatherState();
 			return local ?? state;
 		});
+		this.lighting = computed(() => {
+			const state = cloneLightingState(this.lightingState());
+			const localSpots = Object.entries(this.localLightSpots()).map(([id, spot]) => ({
+				...spot,
+				id: spot.id ?? id
+			}));
+			if (!state && localSpots.length === 0) return null;
+			const next = { ...state ?? {} };
+			if (!state?.ambient) delete next.ambient;
+			next.spots = [...state?.spots ?? [], ...localSpots];
+			return next;
+		});
 		this.manualClientPhysicsTick = false;
-		const isTest = typeof process !== "undefined" && process.env?.TEST === "true" || typeof window !== "undefined" && window.__RPGJS_TEST__ === true;
+		const testGlobal = globalThis;
+		const isTest = testGlobal.process?.env?.TEST === "true" || testGlobal.__RPGJS_TEST__ === true;
 		this.isTestEnvironment = isTest;
 		if (isTest) this.autoTickEnabled = false;
 	}
@@ -41,6 +56,8 @@ var RpgClientMap = class extends RpgCommonMap {
 		this.events.set({});
 		this.weatherState.set(null);
 		this.localWeatherOverride.set(null);
+		this.lightingState.set(null);
+		this.localLightSpots.set({});
 		this.clearPhysic();
 	}
 	getWeather() {
@@ -52,6 +69,47 @@ var RpgClientMap = class extends RpgCommonMap {
 	clearLocalWeather() {
 		this.localWeatherOverride.set(null);
 	}
+	getLighting() {
+		return this.lighting();
+	}
+	addLightSpot(id, spot) {
+		const nextSpot = normalizeLightingState({ spots: [{
+			...spot,
+			id
+		}] })?.spots?.[0];
+		if (!nextSpot) return;
+		this.localLightSpots.update((spots) => ({
+			...spots,
+			[id]: nextSpot
+		}));
+	}
+	patchLightSpot(id, patch) {
+		this.localLightSpots.update((spots) => {
+			const current = spots[id];
+			if (!current) return spots;
+			return {
+				...spots,
+				[id]: {
+					...current,
+					...patch,
+					id,
+					x: patch.x ?? current.x,
+					y: patch.y ?? current.y
+				}
+			};
+		});
+	}
+	removeLightSpot(id) {
+		this.localLightSpots.update((spots) => {
+			if (!(id in spots)) return spots;
+			const next = { ...spots };
+			delete next[id];
+			return next;
+		});
+	}
+	clearLightSpots() {
+		this.localLightSpots.set({});
+	}
 	stepClientPhysics(deltaMs) {
 		if (!this.manualClientPhysicsTick) return 0;
 		return this.nextTick(deltaMs);

package/dist/Game/Map.js.map

@@ -1 +1 @@
-{"version":3,"file":"Map.js","names":[],"sources":["../../src/Game/Map.ts"],"sourcesContent":["import {\n  RpgCommonMap,\n  type WeatherState,\n  type MapPhysicsInitContext,\n  type MapPhysicsEntityContext,\n} from \"@rpgjs/common\";\nimport { sync, users } from \"@signe/sync\";\nimport { RpgClientPlayer } from \"./Player\";\nimport { Signal, signal, computed, effect } from \"canvasengine\";\nimport { RpgClientEvent } from \"./Event\";\nimport { RpgClientEngine } from \"../RpgClientEngine\";\nimport { inject } from \"../core/inject\";\n\nexport class RpgClientMap extends RpgCommonMap<any> {\n  engine: RpgClientEngine = inject(RpgClientEngine)\n  @users(RpgClientPlayer) players = signal<Record<string, RpgClientPlayer>>({});\n  @sync(RpgClientEvent) events = signal<Record<string, RpgClientEvent>>({});\n  currentPlayer = computed(() => this.players()[this.engine.playerIdSignal()!])\n  weatherState = signal<WeatherState | null>(null);\n  localWeatherOverride = signal<WeatherState | null>(null);\n  weather = computed<WeatherState | null>(() => {\n    const local = this.localWeatherOverride() \n    const state = this.weatherState()\n    return local ?? state\n  });\n  private manualClientPhysicsTick = false;\n  private readonly isTestEnvironment: boolean;\n\n  constructor() {\n    super();\n    // Détecter l'environnement de test\n    const isTest = (typeof process !== 'undefined' && process.env?.TEST === 'true')\n      || (typeof window !== 'undefined' && (window as any).__RPGJS_TEST__ === true);\n    this.isTestEnvironment = isTest;\n    if (isTest) {\n      this.autoTickEnabled = false;\n    }\n  }\n\n  configureClientPrediction(enabled: boolean): void {\n    this.manualClientPhysicsTick = enabled;\n    this.autoTickEnabled = enabled ? false : !this.isTestEnvironment;\n  }\n\n  getCurrentPlayer() {\n    return this.currentPlayer()\n  }\n\n  reset(force = false) {\n    const currentPlayerId = this.engine.playerIdSignal();\n    const currentPlayer = !force && currentPlayerId\n      ? this.players()[currentPlayerId]\n      : undefined;\n\n    this.players.set(\n      currentPlayerId && currentPlayer ? { [currentPlayerId]: currentPlayer } : {}\n    );\n    this.events.set({})\n    this.weatherState.set(null);\n    this.localWeatherOverride.set(null);\n    this.clearPhysic()\n  }\n\n  getWeather(): WeatherState | null {\n    return this.weather();\n  }\n\n  setLocalWeather(next: WeatherState | null): void {\n    this.localWeatherOverride.set(next);\n  }\n\n  clearLocalWeather(): void {\n    this.localWeatherOverride.set(null);\n  }\n\n  stepClientPhysics(deltaMs: number): number {\n    if (!this.manualClientPhysicsTick) {\n      return 0;\n    }\n    return this.nextTick(deltaMs);\n  }\n\n  stepPredictionTick(): void {\n    this.forceSingleTick();\n  }\n\n  protected emitPhysicsInit(context: MapPhysicsInitContext): void {\n    this.engine?.emitSceneMapHook?.(\"onPhysicsInit\", this, context);\n  }\n\n  protected emitPhysicsEntityAdd(context: MapPhysicsEntityContext): void {\n    this.engine?.emitSceneMapHook?.(\"onPhysicsEntityAdd\", this, context);\n  }\n\n  protected emitPhysicsEntityRemove(context: MapPhysicsEntityContext): void {\n    this.engine?.emitSceneMapHook?.(\"onPhysicsEntityRemove\", this, context);\n  }\n\n  protected emitPhysicsReset(): void {\n    this.engine?.emitSceneMapHook?.(\"onPhysicsReset\", this);\n  }\n}\n"],"mappings":";;;;;;;;;;AAaA,IAAa,eAAb,cAAkC,aAAkB;CAelD,cAAc;EACZ,OAAO;gBAfiB,OAAO,gBAAgB;iBACf,OAAwC,EAAE,CAAC;gBAC9C,OAAuC,EAAE,CAAC;uBACzD,eAAe,KAAK,SAAS,CAAC,KAAK,OAAO,gBAAgB,EAAG;sBAC9D,OAA4B,KAAK;8BACzB,OAA4B,KAAK;iBAC9C,eAAoC;GAC5C,MAAM,QAAQ,KAAK,sBAAsB;GACzC,MAAM,QAAQ,KAAK,cAAc;GACjC,OAAO,SAAS;IAChB;iCACgC;EAMhC,MAAM,SAAU,OAAO,YAAY,eAAe,QAAQ,KAAK,SAAS,UAClE,OAAO,WAAW,eAAgB,OAAe,mBAAmB;EAC1E,KAAK,oBAAoB;EACzB,IAAI,QACF,KAAK,kBAAkB;;CAI3B,0BAA0B,SAAwB;EAChD,KAAK,0BAA0B;EAC/B,KAAK,kBAAkB,UAAU,QAAQ,CAAC,KAAK;;CAGjD,mBAAmB;EACjB,OAAO,KAAK,eAAe;;CAG7B,MAAM,QAAQ,OAAO;EACnB,MAAM,kBAAkB,KAAK,OAAO,gBAAgB;EACpD,MAAM,gBAAgB,CAAC,SAAS,kBAC5B,KAAK,SAAS,CAAC,mBACf,KAAA;EAEJ,KAAK,QAAQ,IACX,mBAAmB,gBAAgB,GAAG,kBAAkB,eAAe,GAAG,EAAE,CAC7E;EACD,KAAK,OAAO,IAAI,EAAE,CAAC;EACnB,KAAK,aAAa,IAAI,KAAK;EAC3B,KAAK,qBAAqB,IAAI,KAAK;EACnC,KAAK,aAAa;;CAGpB,aAAkC;EAChC,OAAO,KAAK,SAAS;;CAGvB,gBAAgB,MAAiC;EAC/C,KAAK,qBAAqB,IAAI,KAAK;;CAGrC,oBAA0B;EACxB,KAAK,qBAAqB,IAAI,KAAK;;CAGrC,kBAAkB,SAAyB;EACzC,IAAI,CAAC,KAAK,yBACR,OAAO;EAET,OAAO,KAAK,SAAS,QAAQ;;CAG/B,qBAA2B;EACzB,KAAK,iBAAiB;;CAGxB,gBAA0B,SAAsC;EAC9D,KAAK,QAAQ,mBAAmB,iBAAiB,MAAM,QAAQ;;CAGjE,qBAA+B,SAAwC;EACrE,KAAK,QAAQ,mBAAmB,sBAAsB,MAAM,QAAQ;;CAGtE,wBAAkC,SAAwC;EACxE,KAAK,QAAQ,mBAAmB,yBAAyB,MAAM,QAAQ;;CAGzE,mBAAmC;EACjC,KAAK,QAAQ,mBAAmB,kBAAkB,KAAK;;;YApFxD,MAAM,gBAAgB,EAAA,mBAAA,eAAA,OAAA,CAAA,EAAA,aAAA,WAAA,WAAA,KAAA,EAAA;YACtB,KAAK,eAAe,EAAA,mBAAA,eAAA,OAAA,CAAA,EAAA,aAAA,WAAA,UAAA,KAAA,EAAA"}
+{"version":3,"file":"Map.js","names":[],"sources":["../../src/Game/Map.ts"],"sourcesContent":["import {\n  RpgCommonMap,\n  cloneLightingState,\n  normalizeLightingState,\n  type LightSpot,\n  type LightingState,\n  type WeatherState,\n  type MapPhysicsInitContext,\n  type MapPhysicsEntityContext,\n} from \"@rpgjs/common\";\nimport { sync, users } from \"@signe/sync\";\nimport { RpgClientPlayer } from \"./Player\";\nimport { Signal, signal, computed, effect } from \"canvasengine\";\nimport { RpgClientEvent } from \"./Event\";\nimport { RpgClientEngine } from \"../RpgClientEngine\";\nimport { inject } from \"../core/inject\";\n\ntype TestGlobalScope = typeof globalThis & {\n  process?: {\n    env?: {\n      TEST?: string;\n    };\n  };\n  __RPGJS_TEST__?: boolean;\n};\n\nexport class RpgClientMap extends RpgCommonMap<any> {\n  engine: RpgClientEngine = inject(RpgClientEngine)\n  @users(RpgClientPlayer) players = signal<Record<string, RpgClientPlayer>>({});\n  @sync(RpgClientEvent) events = signal<Record<string, RpgClientEvent>>({});\n  currentPlayer = computed(() => this.players()[this.engine.playerIdSignal()!])\n  weatherState = signal<WeatherState | null>(null);\n  localWeatherOverride = signal<WeatherState | null>(null);\n  lightingState = signal<LightingState | null>(null);\n  localLightSpots = signal<Record<string, LightSpot>>({});\n  weather = computed<WeatherState | null>(() => {\n    const local = this.localWeatherOverride() \n    const state = this.weatherState()\n    return local ?? state\n  });\n  lighting = computed<LightingState | null>(() => {\n    const state = cloneLightingState(this.lightingState());\n    const localSpots = Object.entries(this.localLightSpots()).map(([id, spot]) => ({\n      ...spot,\n      id: spot.id ?? id,\n    }));\n\n    if (!state && localSpots.length === 0) {\n      return null;\n    }\n\n    const next: LightingState = { ...(state ?? {}) };\n    if (!state?.ambient) {\n      delete next.ambient;\n    }\n    next.spots = [\n      ...(state?.spots ?? []),\n      ...localSpots,\n    ];\n    return next;\n  });\n  private manualClientPhysicsTick = false;\n  private readonly isTestEnvironment: boolean;\n\n  constructor() {\n    super();\n    // Détecter l'environnement de test\n    const testGlobal = globalThis as TestGlobalScope;\n    const isTest = testGlobal.process?.env?.TEST === 'true'\n      || testGlobal.__RPGJS_TEST__ === true;\n    this.isTestEnvironment = isTest;\n    if (isTest) {\n      this.autoTickEnabled = false;\n    }\n  }\n\n  configureClientPrediction(enabled: boolean): void {\n    this.manualClientPhysicsTick = enabled;\n    this.autoTickEnabled = enabled ? false : !this.isTestEnvironment;\n  }\n\n  getCurrentPlayer() {\n    return this.currentPlayer()\n  }\n\n  reset(force = false) {\n    const currentPlayerId = this.engine.playerIdSignal();\n    const currentPlayer = !force && currentPlayerId\n      ? this.players()[currentPlayerId]\n      : undefined;\n\n    this.players.set(\n      currentPlayerId && currentPlayer ? { [currentPlayerId]: currentPlayer } : {}\n    );\n    this.events.set({})\n    this.weatherState.set(null);\n    this.localWeatherOverride.set(null);\n    this.lightingState.set(null);\n    this.localLightSpots.set({});\n    this.clearPhysic()\n  }\n\n  getWeather(): WeatherState | null {\n    return this.weather();\n  }\n\n  setLocalWeather(next: WeatherState | null): void {\n    this.localWeatherOverride.set(next);\n  }\n\n  clearLocalWeather(): void {\n    this.localWeatherOverride.set(null);\n  }\n\n  getLighting(): LightingState | null {\n    return this.lighting();\n  }\n\n  addLightSpot(id: string, spot: LightSpot): void {\n    const normalized = normalizeLightingState({ spots: [{ ...spot, id }] });\n    const nextSpot = normalized?.spots?.[0];\n    if (!nextSpot) {\n      return;\n    }\n    this.localLightSpots.update((spots) => ({\n      ...spots,\n      [id]: nextSpot,\n    }));\n  }\n\n  patchLightSpot(id: string, patch: Partial<LightSpot>): void {\n    this.localLightSpots.update((spots) => {\n      const current = spots[id];\n      if (!current) {\n        return spots;\n      }\n      return {\n        ...spots,\n        [id]: {\n          ...current,\n          ...patch,\n          id,\n          x: patch.x ?? current.x,\n          y: patch.y ?? current.y,\n        },\n      };\n    });\n  }\n\n  removeLightSpot(id: string): void {\n    this.localLightSpots.update((spots) => {\n      if (!(id in spots)) {\n        return spots;\n      }\n      const next = { ...spots };\n      delete next[id];\n      return next;\n    });\n  }\n\n  clearLightSpots(): void {\n    this.localLightSpots.set({});\n  }\n\n  stepClientPhysics(deltaMs: number): number {\n    if (!this.manualClientPhysicsTick) {\n      return 0;\n    }\n    return this.nextTick(deltaMs);\n  }\n\n  stepPredictionTick(): void {\n    this.forceSingleTick();\n  }\n\n  protected emitPhysicsInit(context: MapPhysicsInitContext): void {\n    this.engine?.emitSceneMapHook?.(\"onPhysicsInit\", this, context);\n  }\n\n  protected emitPhysicsEntityAdd(context: MapPhysicsEntityContext): void {\n    this.engine?.emitSceneMapHook?.(\"onPhysicsEntityAdd\", this, context);\n  }\n\n  protected emitPhysicsEntityRemove(context: MapPhysicsEntityContext): void {\n    this.engine?.emitSceneMapHook?.(\"onPhysicsEntityRemove\", this, context);\n  }\n\n  protected emitPhysicsReset(): void {\n    this.engine?.emitSceneMapHook?.(\"onPhysicsReset\", this);\n  }\n}\n"],"mappings":"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"}

package/dist/Game/Object.d.ts

@@ -1,4 +1,5 @@
 import { Hooks, RpgCommonPlayer } from '@rpgjs/common';
+import { Trigger } from 'canvasengine';
 import { RpgClientEngine } from '../RpgClientEngine';
 type Frame = {
     x: number;
@@ -10,6 +11,20 @@ type AnimationRestoreOptions = {
     restoreGraphics?: any[];
     timeoutMs?: number;
 };
+type FlashType = 'alpha' | 'tint' | 'both';
+type FlashOptions = {
+    type?: FlashType;
+    duration?: number;
+    cycles?: number;
+    alpha?: number;
+    tint?: number | string;
+};
+type FlashTriggerOptions = Omit<FlashOptions, "tint"> & {
+    tint: number;
+};
+type ConfigurableTrigger<T> = Omit<Trigger<T>, "start"> & {
+    start(config?: T): Promise<void>;
+};
 export declare abstract class RpgClientObject extends RpgCommonPlayer {
     abstract _type: string;
     emitParticleTrigger: any;
@@ -19,8 +34,7 @@ export declare abstract class RpgClientObject extends RpgCommonPlayer {
     _param: any;
     frames: Frame[];
     graphicsSignals: any;
-    _component: {};
-    flashTrigger: any;
+    flashTrigger: ConfigurableTrigger<FlashTriggerOptions>;
     private animationRestoreState?;
     constructor();
     /**
@@ -87,13 +101,7 @@ export declare abstract class RpgClientObject extends RpgCommonPlayer {
      * });
      * ```
      */
-    flash(options?: {
-        type?: 'alpha' | 'tint' | 'both';
-        duration?: number;
-        cycles?: number;
-        alpha?: number;
-        tint?: number | string;
-    }): void;
+    flash(options?: FlashOptions): void;
     /**
      * Reset animation state when animation changes externally
      *

package/dist/Game/Object.js

@@ -1,11 +1,9 @@
 import { inject } from "../core/inject.js";
-import __ce_component from "../components/dynamics/text.ce.js";
 import { RpgClientEngine } from "../RpgClientEngine.js";
 import { signal, trigger } from "canvasengine";
 import { ModulesToken, RpgCommonPlayer } from "@rpgjs/common";
-import { filter, from, map, of, switchMap } from "rxjs";
+import { from, map, of, switchMap } from "rxjs";
 //#region src/Game/Object.ts
-var DYNAMIC_COMPONENTS = { text: __ce_component };
 var RpgClientObject = class extends RpgCommonPlayer {
 	constructor() {
 		super();
@@ -16,7 +14,6 @@ var RpgClientObject = class extends RpgCommonPlayer {
 		this._param = signal({});
 		this.frames = [];
 		this.graphicsSignals = signal([]);
-		this._component = {};
 		this.flashTrigger = trigger();
 		this.hooks.callHooks("client-sprite-onInit", this).subscribe();
 		this._frames.observable.subscribe(({ items }) => {
@@ -30,14 +27,6 @@ var RpgClientObject = class extends RpgCommonPlayer {
 		})).subscribe((sheets) => {
 			this.graphicsSignals.set(sheets);
 		});
-		this.componentsTop.observable.pipe(filter((value) => value !== null && value !== void 0), map((value) => typeof value === "string" ? JSON.parse(value) : value)).subscribe(({ components }) => {
-			for (const component of components) for (const [key, value] of Object.entries(component)) {
-				this._component = value;
-				console.log(value);
-				const type = value.type;
-				if (DYNAMIC_COMPONENTS[type]) this.engine.addSpriteComponentInFront(DYNAMIC_COMPONENTS[type]);
-			}
-		});
 		this.engine.tick.pipe().subscribe(() => {
 			const frame = this.frames.shift();
 			if (frame) {

package/dist/Game/Object.js.map

@@ -1 +1 @@
-{"version":3,"file":"Object.js","names":[],"sources":["../../src/Game/Object.ts"],"sourcesContent":["import { Hooks, ModulesToken, RpgCommonPlayer } from \"@rpgjs/common\";\nimport { trigger, signal, effect } from \"canvasengine\";\nimport { filter, from, map, of, Subscription, switchMap } from \"rxjs\";\nimport { inject } from \"../core/inject\";\nimport { RpgClientEngine } from \"../RpgClientEngine\";\nimport TextComponent from \"../components/dynamics/text.ce\";\n\nconst DYNAMIC_COMPONENTS = {\n  text: TextComponent,\n}\n\ntype Frame = { x: number; y: number; ts: number };\n\ntype AnimationRestoreOptions = {\n  restoreAnimationName?: string;\n  restoreGraphics?: any[];\n  timeoutMs?: number;\n};\n\nexport abstract class RpgClientObject extends RpgCommonPlayer {\n  abstract _type: string;\n  emitParticleTrigger = trigger();\n  particleName = signal(\"\");\n  animationCurrentIndex = signal(0);\n  animationIsPlaying = signal(false);\n  _param = signal({});\n  frames: Frame[] = [];\n  graphicsSignals = signal<any[]>([]);\n  _component = {} // temporary component memory\n  flashTrigger = trigger();\n  private animationRestoreState?: {\n    animationName: string;\n    graphics: any[];\n  };\n\n  constructor() {\n    super();\n    this.hooks.callHooks(\"client-sprite-onInit\", this).subscribe();\n\n    this._frames.observable.subscribe(({ items }) => {\n      if (!this.id) return;\n      //if (this.id == this.engine.playerIdSignal()!) return;\n      const nextFrames = items.flatMap((item): Frame[] =>\n        Array.isArray(item) ? item : [item]\n      );\n      this.frames = [...this.frames, ...nextFrames];\n    });\n\n    this.graphics.observable\n    .pipe(\n      map(({ items }) => items),\n      switchMap(graphics => {\n        if (graphics.length === 0) return of([]);\n        return from(Promise.all(graphics.map(graphic => this.engine.getSpriteSheet(graphic))));\n      })\n    )\n    .subscribe((sheets) => {  \n      this.graphicsSignals.set(sheets);\n    });\n\n    this.componentsTop.observable\n    .pipe(\n      filter(value => value !== null && value !== undefined),\n      map((value) => typeof value === 'string' ? JSON.parse(value) : value),\n    )\n    .subscribe(({components}) => {\n      for (const component of components) {\n        for (const [key, value] of Object.entries(component)) {\n          this._component = value as any; // temporary component memory\n          console.log(value)\n          const type = (value as any).type as keyof typeof DYNAMIC_COMPONENTS;\n          if (DYNAMIC_COMPONENTS[type]) {\n            this.engine.addSpriteComponentInFront(DYNAMIC_COMPONENTS[type]);\n          }\n        }\n      }\n    });\n\n    this.engine.tick\n      .pipe\n      //throttleTime(10)\n      ()\n      .subscribe(() => {\n        const frame = this.frames.shift();\n        if (frame) {\n          if (typeof frame.x !== \"number\" || typeof frame.y !== \"number\") return;\n          this.engine.scene.setBodyPosition(\n            this.id,\n            frame.x,\n            frame.y,\n            \"top-left\"\n          );\n        }\n      });\n  }\n\n  /**\n   * Access the shared client hook registry.\n   *\n   * @returns The hook service used to register and trigger client-side hooks.\n   */\n  get hooks() {\n    return inject<Hooks>(ModulesToken);\n  }\n\n  /**\n   * Access the current client engine instance.\n   *\n   * @returns The active {@link RpgClientEngine} instance.\n   */\n  get engine() {\n    return inject(RpgClientEngine);\n  }\n\n  private animationSubscription?: Subscription;\n  private animationResetTimeout?: ReturnType<typeof setTimeout>;\n  private animationWaitResolve?: () => void;\n\n  private clearAnimationControls() {\n    if (this.animationSubscription) {\n      this.animationSubscription.unsubscribe();\n      this.animationSubscription = undefined;\n    }\n    if (this.animationResetTimeout) {\n      clearTimeout(this.animationResetTimeout);\n      this.animationResetTimeout = undefined;\n    }\n  }\n\n  private resolveAnimationWait() {\n    const resolve = this.animationWaitResolve;\n    this.animationWaitResolve = undefined;\n    resolve?.();\n  }\n\n  private finishTemporaryAnimation() {\n    const restoreState = this.animationRestoreState;\n    this.clearAnimationControls();\n    this.animationCurrentIndex.set(0);\n    if (restoreState) {\n      this.animationName.set(restoreState.animationName);\n      this.graphics.set([...restoreState.graphics]);\n    }\n    this.animationRestoreState = undefined;\n    this.animationIsPlaying.set(false);\n    this.resolveAnimationWait();\n  }\n\n  /**\n   * Trigger a flash animation on this sprite\n   * \n   * This method triggers a flash effect using CanvasEngine's flash directive.\n   * The flash can be configured with various options including type (alpha, tint, or both),\n   * duration, cycles, and color.\n   * \n   * ## Design\n   * \n   * The flash uses a trigger system that is connected to the flash directive in the\n   * character component. This allows for flexible configuration and can be triggered\n   * from both server events and client-side code.\n   * \n   * @param options - Flash configuration options\n   * @param options.type - Type of flash effect: 'alpha' (opacity), 'tint' (color), or 'both' (default: 'alpha')\n   * @param options.duration - Duration of the flash animation in milliseconds (default: 300)\n   * @param options.cycles - Number of flash cycles (flash on/off) (default: 1)\n   * @param options.alpha - Alpha value when flashing, from 0 to 1 (default: 0.3)\n   * @param options.tint - Tint color when flashing as hex value or color name (default: 0xffffff - white)\n   * \n   * @example\n   * ```ts\n   * // Simple flash with default settings (alpha flash)\n   * player.flash();\n   * \n   * // Flash with red tint\n   * player.flash({ type: 'tint', tint: 0xff0000 });\n   * \n   * // Flash with both alpha and tint\n   * player.flash({ \n   *   type: 'both', \n   *   alpha: 0.5, \n   *   tint: 0xff0000,\n   *   duration: 200,\n   *   cycles: 2\n   * });\n   * \n   * // Quick damage flash\n   * player.flash({ \n   *   type: 'tint', \n   *   tint: 0xff0000, \n   *   duration: 150,\n   *   cycles: 1\n   * });\n   * ```\n   */\n  flash(options?: {\n    type?: 'alpha' | 'tint' | 'both';\n    duration?: number;\n    cycles?: number;\n    alpha?: number;\n    tint?: number | string;\n  }): void {\n    const flashOptions = {\n      type: options?.type || 'alpha',\n      duration: options?.duration ?? 300,\n      cycles: options?.cycles ?? 1,\n      alpha: options?.alpha ?? 0.3,\n      tint: options?.tint ?? 0xffffff,\n    };\n    \n    // Convert color name to hex if needed\n    let tintValue = flashOptions.tint;\n    if (typeof tintValue === 'string') {\n      // Common color name to hex mapping\n      const colorMap: Record<string, number> = {\n        'white': 0xffffff,\n        'red': 0xff0000,\n        'green': 0x00ff00,\n        'blue': 0x0000ff,\n        'yellow': 0xffff00,\n        'cyan': 0x00ffff,\n        'magenta': 0xff00ff,\n        'black': 0x000000,\n      };\n      tintValue = colorMap[tintValue.toLowerCase()] ?? 0xffffff;\n    }\n    \n    this.flashTrigger.start({\n      ...flashOptions,\n      tint: tintValue,\n    });\n  }\n\n  /**\n   * Reset animation state when animation changes externally\n   *\n   * This method should be called when the animation changes due to movement\n   * or other external factors to ensure the animation system doesn't get stuck\n   *\n   * @example\n   * ```ts\n   * // Reset when player starts moving\n   * player.resetAnimationState();\n   * ```\n   */\n  resetAnimationState() {\n    if (this.animationRestoreState) {\n      this.finishTemporaryAnimation();\n      return;\n    }\n    this.animationIsPlaying.set(false);\n    this.animationCurrentIndex.set(0);\n    this.clearAnimationControls();\n    this.resolveAnimationWait();\n  }\n\n  /**\n   * Set a custom animation for a specific number of times\n   *\n   * Plays a custom animation for the specified number of repetitions.\n   * The animation system prevents overlapping animations and automatically\n   * returns to the previous animation when complete.\n   *\n   * @param animationName - Name of the animation to play\n   * @param nbTimes - Number of times to repeat the animation (default: Infinity for continuous)\n   * @param options - Restore and timeout options\n   * @returns A promise resolved when a finite animation finishes, is interrupted, or times out\n   *\n   * @example\n   * ```ts\n   * // Play attack animation 3 times\n   * await player.setAnimation('attack', 3);\n   *\n   * // Play continuous spell animation\n   * player.setAnimation('spell');\n   * ```\n   */\n  setAnimation(animationName: string, nbTimes?: number, options?: AnimationRestoreOptions): Promise<void>;\n  /**\n   * Set a custom animation with temporary graphic change\n   *\n   * Plays a custom animation for the specified number of repetitions and temporarily\n   * changes the player's graphic (sprite sheet) during the animation. The graphic\n   * is automatically reset when the animation finishes.\n   *\n   * @param animationName - Name of the animation to play\n   * @param graphic - The graphic(s) to temporarily use during the animation\n   * @param nbTimes - Number of times to repeat the animation (default: Infinity for continuous)\n   * @param options - Restore and timeout options\n   * @returns A promise resolved when a finite animation finishes, is interrupted, or times out\n   *\n   * @example\n   * ```ts\n   * // Play attack animation with temporary graphic change\n   * await player.setAnimation('attack', 'hero_attack', 3);\n   * ```\n   */\n  setAnimation(animationName: string, graphic?: string | string[], nbTimes?: number, options?: AnimationRestoreOptions): Promise<void>;\n  setAnimation(\n    animationName: string,\n    graphicOrNbTimes?: string | string[] | number,\n    nbTimesOrOptions?: number | AnimationRestoreOptions,\n    options?: AnimationRestoreOptions\n  ): Promise<void> {\n    let graphic: string | string[] | undefined;\n    let finalNbTimes: number = Infinity;\n    let restoreOptions: AnimationRestoreOptions | undefined = options;\n\n    // Handle overloads\n    if (typeof graphicOrNbTimes === 'number') {\n      // setAnimation(animationName, nbTimes)\n      finalNbTimes = graphicOrNbTimes;\n      restoreOptions = typeof nbTimesOrOptions === 'object' ? nbTimesOrOptions : options;\n    } else if (graphicOrNbTimes !== undefined) {\n      // setAnimation(animationName, graphic, nbTimes)\n      graphic = graphicOrNbTimes;\n      if (typeof nbTimesOrOptions === 'number') {\n        finalNbTimes = nbTimesOrOptions;\n      } else {\n        finalNbTimes = Infinity;\n        restoreOptions = nbTimesOrOptions ?? options;\n      }\n    } else {\n      // setAnimation(animationName) - nbTimes remains Infinity\n      finalNbTimes = Infinity;\n    }\n\n    if (this.animationIsPlaying()) {\n      this.finishTemporaryAnimation();\n    }\n\n    const waitPromise =\n      finalNbTimes === Infinity\n        ? Promise.resolve()\n        : new Promise<void>((resolve) => {\n            this.animationWaitResolve = resolve;\n          });\n\n    this.animationIsPlaying.set(true);\n    const previousAnimationName =\n      restoreOptions?.restoreAnimationName ?? this.animationName();\n    const previousGraphics = restoreOptions?.restoreGraphics\n      ? [...restoreOptions.restoreGraphics]\n      : [...this.graphics()];\n    this.animationRestoreState = {\n      animationName: previousAnimationName,\n      graphics: previousGraphics,\n    };\n    this.animationCurrentIndex.set(0);\n\n    // Temporarily change graphic if provided\n    if (graphic !== undefined) {\n      if (Array.isArray(graphic)) {\n        this.graphics.set(graphic);\n      } else {\n        this.graphics.set([graphic]);\n      }\n    }\n\n    this.clearAnimationControls();\n\n    this.animationSubscription =\n      this.animationCurrentIndex.observable.subscribe((index) => {\n        if (index >= finalNbTimes) {\n          this.finishTemporaryAnimation();\n        }\n      });\n\n    if (finalNbTimes !== Infinity) {\n      this.animationResetTimeout = setTimeout(() => {\n        if (this.animationIsPlaying()) {\n          this.finishTemporaryAnimation();\n        }\n      }, restoreOptions?.timeoutMs ?? Math.max(1000, finalNbTimes * 1000));\n    }\n\n    this.animationName.set(animationName);\n\n    return waitPromise;\n  }\n\n  /**\n   * Display a registered component animation effect on this object.\n   *\n   * @param id - Identifier of the component animation to play.\n   * @param params - Parameters forwarded to the animation effect.\n   * @returns A promise resolved when the animation component calls `onFinish`.\n   */\n  showComponentAnimation(id: string, params: any): Promise<void> {\n    const engine = inject(RpgClientEngine);\n    return engine.getComponentAnimation(id).displayEffect(params, this);\n  }\n\n  /**\n   * Display a registered spritesheet animation effect on this object.\n   *\n   * @param graphic - Identifier of the spritesheet to use.\n   * @param animationName - Name of the animation inside the spritesheet.\n   * @returns A promise resolved when the animation component calls `onFinish`.\n   */\n  showAnimation(graphic: string, animationName: string = 'default'): Promise<void> {\n    return this.showComponentAnimation('animation', {\n      graphic,\n      animationName,\n    });\n  }\n  \n  /**\n   * Check whether this client object represents an event.\n   *\n   * @returns `true` if the object type is `event`, otherwise `false`.\n   */\n  isEvent(): boolean {\n    return this._type === 'event';\n  }\n\n  /**\n   * Check whether this client object represents a player.\n   *\n   * @returns `true` if the object type is `player`, otherwise `false`.\n   */\n  isPlayer(): boolean {\n    return this._type === 'player';\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"Object.js","names":[],"sources":["../../src/Game/Object.ts"],"sourcesContent":["import { Hooks, ModulesToken, RpgCommonPlayer } from \"@rpgjs/common\";\nimport { trigger, signal, type Trigger } from \"canvasengine\";\nimport { from, map, of, Subscription, switchMap } from \"rxjs\";\nimport { inject } from \"../core/inject\";\nimport { RpgClientEngine } from \"../RpgClientEngine\";\ntype Frame = { x: number; y: number; ts: number };\n\ntype AnimationRestoreOptions = {\n  restoreAnimationName?: string;\n  restoreGraphics?: any[];\n  timeoutMs?: number;\n};\n\ntype FlashType = 'alpha' | 'tint' | 'both';\n\ntype FlashOptions = {\n  type?: FlashType;\n  duration?: number;\n  cycles?: number;\n  alpha?: number;\n  tint?: number | string;\n};\n\ntype FlashTriggerOptions = Omit<FlashOptions, \"tint\"> & {\n  tint: number;\n};\n\ntype ConfigurableTrigger<T> = Omit<Trigger<T>, \"start\"> & {\n  start(config?: T): Promise<void>;\n};\n\nexport abstract class RpgClientObject extends RpgCommonPlayer {\n  abstract _type: string;\n  emitParticleTrigger = trigger();\n  particleName = signal(\"\");\n  animationCurrentIndex = signal(0);\n  animationIsPlaying = signal(false);\n  _param = signal({});\n  frames: Frame[] = [];\n  graphicsSignals = signal<any[]>([]);\n  flashTrigger: ConfigurableTrigger<FlashTriggerOptions> = trigger<FlashTriggerOptions>();\n  private animationRestoreState?: {\n    animationName: string;\n    graphics: any[];\n  };\n\n  constructor() {\n    super();\n    this.hooks.callHooks(\"client-sprite-onInit\", this).subscribe();\n\n    this._frames.observable.subscribe(({ items }) => {\n      if (!this.id) return;\n      //if (this.id == this.engine.playerIdSignal()!) return;\n      const nextFrames = items.flatMap((item): Frame[] =>\n        Array.isArray(item) ? item : [item]\n      );\n      this.frames = [...this.frames, ...nextFrames];\n    });\n\n    this.graphics.observable\n    .pipe(\n      map(({ items }) => items),\n      switchMap(graphics => {\n        if (graphics.length === 0) return of([]);\n        return from(Promise.all(graphics.map(graphic => this.engine.getSpriteSheet(graphic))));\n      })\n    )\n    .subscribe((sheets) => {  \n      this.graphicsSignals.set(sheets);\n    });\n\n    this.engine.tick\n      .pipe\n      //throttleTime(10)\n      ()\n      .subscribe(() => {\n        const frame = this.frames.shift();\n        if (frame) {\n          if (typeof frame.x !== \"number\" || typeof frame.y !== \"number\") return;\n          this.engine.scene.setBodyPosition(\n            this.id,\n            frame.x,\n            frame.y,\n            \"top-left\"\n          );\n        }\n      });\n  }\n\n  /**\n   * Access the shared client hook registry.\n   *\n   * @returns The hook service used to register and trigger client-side hooks.\n   */\n  get hooks() {\n    return inject<Hooks>(ModulesToken);\n  }\n\n  /**\n   * Access the current client engine instance.\n   *\n   * @returns The active {@link RpgClientEngine} instance.\n   */\n  get engine() {\n    return inject(RpgClientEngine);\n  }\n\n  private animationSubscription?: Subscription;\n  private animationResetTimeout?: ReturnType<typeof setTimeout>;\n  private animationWaitResolve?: () => void;\n\n  private clearAnimationControls() {\n    if (this.animationSubscription) {\n      this.animationSubscription.unsubscribe();\n      this.animationSubscription = undefined;\n    }\n    if (this.animationResetTimeout) {\n      clearTimeout(this.animationResetTimeout);\n      this.animationResetTimeout = undefined;\n    }\n  }\n\n  private resolveAnimationWait() {\n    const resolve = this.animationWaitResolve;\n    this.animationWaitResolve = undefined;\n    resolve?.();\n  }\n\n  private finishTemporaryAnimation() {\n    const restoreState = this.animationRestoreState;\n    this.clearAnimationControls();\n    this.animationCurrentIndex.set(0);\n    if (restoreState) {\n      this.animationName.set(restoreState.animationName);\n      this.graphics.set([...restoreState.graphics]);\n    }\n    this.animationRestoreState = undefined;\n    this.animationIsPlaying.set(false);\n    this.resolveAnimationWait();\n  }\n\n  /**\n   * Trigger a flash animation on this sprite\n   * \n   * This method triggers a flash effect using CanvasEngine's flash directive.\n   * The flash can be configured with various options including type (alpha, tint, or both),\n   * duration, cycles, and color.\n   * \n   * ## Design\n   * \n   * The flash uses a trigger system that is connected to the flash directive in the\n   * character component. This allows for flexible configuration and can be triggered\n   * from both server events and client-side code.\n   * \n   * @param options - Flash configuration options\n   * @param options.type - Type of flash effect: 'alpha' (opacity), 'tint' (color), or 'both' (default: 'alpha')\n   * @param options.duration - Duration of the flash animation in milliseconds (default: 300)\n   * @param options.cycles - Number of flash cycles (flash on/off) (default: 1)\n   * @param options.alpha - Alpha value when flashing, from 0 to 1 (default: 0.3)\n   * @param options.tint - Tint color when flashing as hex value or color name (default: 0xffffff - white)\n   * \n   * @example\n   * ```ts\n   * // Simple flash with default settings (alpha flash)\n   * player.flash();\n   * \n   * // Flash with red tint\n   * player.flash({ type: 'tint', tint: 0xff0000 });\n   * \n   * // Flash with both alpha and tint\n   * player.flash({ \n   *   type: 'both', \n   *   alpha: 0.5, \n   *   tint: 0xff0000,\n   *   duration: 200,\n   *   cycles: 2\n   * });\n   * \n   * // Quick damage flash\n   * player.flash({ \n   *   type: 'tint', \n   *   tint: 0xff0000, \n   *   duration: 150,\n   *   cycles: 1\n   * });\n   * ```\n   */\n  flash(options?: FlashOptions): void {\n    const flashOptions = {\n      type: options?.type || 'alpha',\n      duration: options?.duration ?? 300,\n      cycles: options?.cycles ?? 1,\n      alpha: options?.alpha ?? 0.3,\n      tint: options?.tint ?? 0xffffff,\n    };\n    \n    // Convert color name to hex if needed\n    let tintValue = flashOptions.tint;\n    if (typeof tintValue === 'string') {\n      // Common color name to hex mapping\n      const colorMap: Record<string, number> = {\n        'white': 0xffffff,\n        'red': 0xff0000,\n        'green': 0x00ff00,\n        'blue': 0x0000ff,\n        'yellow': 0xffff00,\n        'cyan': 0x00ffff,\n        'magenta': 0xff00ff,\n        'black': 0x000000,\n      };\n      tintValue = colorMap[tintValue.toLowerCase()] ?? 0xffffff;\n    }\n    \n    this.flashTrigger.start({\n      ...flashOptions,\n      tint: tintValue,\n    });\n  }\n\n  /**\n   * Reset animation state when animation changes externally\n   *\n   * This method should be called when the animation changes due to movement\n   * or other external factors to ensure the animation system doesn't get stuck\n   *\n   * @example\n   * ```ts\n   * // Reset when player starts moving\n   * player.resetAnimationState();\n   * ```\n   */\n  resetAnimationState() {\n    if (this.animationRestoreState) {\n      this.finishTemporaryAnimation();\n      return;\n    }\n    this.animationIsPlaying.set(false);\n    this.animationCurrentIndex.set(0);\n    this.clearAnimationControls();\n    this.resolveAnimationWait();\n  }\n\n  /**\n   * Set a custom animation for a specific number of times\n   *\n   * Plays a custom animation for the specified number of repetitions.\n   * The animation system prevents overlapping animations and automatically\n   * returns to the previous animation when complete.\n   *\n   * @param animationName - Name of the animation to play\n   * @param nbTimes - Number of times to repeat the animation (default: Infinity for continuous)\n   * @param options - Restore and timeout options\n   * @returns A promise resolved when a finite animation finishes, is interrupted, or times out\n   *\n   * @example\n   * ```ts\n   * // Play attack animation 3 times\n   * await player.setAnimation('attack', 3);\n   *\n   * // Play continuous spell animation\n   * player.setAnimation('spell');\n   * ```\n   */\n  setAnimation(animationName: string, nbTimes?: number, options?: AnimationRestoreOptions): Promise<void>;\n  /**\n   * Set a custom animation with temporary graphic change\n   *\n   * Plays a custom animation for the specified number of repetitions and temporarily\n   * changes the player's graphic (sprite sheet) during the animation. The graphic\n   * is automatically reset when the animation finishes.\n   *\n   * @param animationName - Name of the animation to play\n   * @param graphic - The graphic(s) to temporarily use during the animation\n   * @param nbTimes - Number of times to repeat the animation (default: Infinity for continuous)\n   * @param options - Restore and timeout options\n   * @returns A promise resolved when a finite animation finishes, is interrupted, or times out\n   *\n   * @example\n   * ```ts\n   * // Play attack animation with temporary graphic change\n   * await player.setAnimation('attack', 'hero_attack', 3);\n   * ```\n   */\n  setAnimation(animationName: string, graphic?: string | string[], nbTimes?: number, options?: AnimationRestoreOptions): Promise<void>;\n  setAnimation(\n    animationName: string,\n    graphicOrNbTimes?: string | string[] | number,\n    nbTimesOrOptions?: number | AnimationRestoreOptions,\n    options?: AnimationRestoreOptions\n  ): Promise<void> {\n    let graphic: string | string[] | undefined;\n    let finalNbTimes: number = Infinity;\n    let restoreOptions: AnimationRestoreOptions | undefined = options;\n\n    // Handle overloads\n    if (typeof graphicOrNbTimes === 'number') {\n      // setAnimation(animationName, nbTimes)\n      finalNbTimes = graphicOrNbTimes;\n      restoreOptions = typeof nbTimesOrOptions === 'object' ? nbTimesOrOptions : options;\n    } else if (graphicOrNbTimes !== undefined) {\n      // setAnimation(animationName, graphic, nbTimes)\n      graphic = graphicOrNbTimes;\n      if (typeof nbTimesOrOptions === 'number') {\n        finalNbTimes = nbTimesOrOptions;\n      } else {\n        finalNbTimes = Infinity;\n        restoreOptions = nbTimesOrOptions ?? options;\n      }\n    } else {\n      // setAnimation(animationName) - nbTimes remains Infinity\n      finalNbTimes = Infinity;\n    }\n\n    if (this.animationIsPlaying()) {\n      this.finishTemporaryAnimation();\n    }\n\n    const waitPromise =\n      finalNbTimes === Infinity\n        ? Promise.resolve()\n        : new Promise<void>((resolve) => {\n            this.animationWaitResolve = resolve;\n          });\n\n    this.animationIsPlaying.set(true);\n    const previousAnimationName =\n      restoreOptions?.restoreAnimationName ?? this.animationName();\n    const previousGraphics = restoreOptions?.restoreGraphics\n      ? [...restoreOptions.restoreGraphics]\n      : [...this.graphics()];\n    this.animationRestoreState = {\n      animationName: previousAnimationName,\n      graphics: previousGraphics,\n    };\n    this.animationCurrentIndex.set(0);\n\n    // Temporarily change graphic if provided\n    if (graphic !== undefined) {\n      if (Array.isArray(graphic)) {\n        this.graphics.set(graphic);\n      } else {\n        this.graphics.set([graphic]);\n      }\n    }\n\n    this.clearAnimationControls();\n\n    this.animationSubscription =\n      this.animationCurrentIndex.observable.subscribe((index) => {\n        if (index >= finalNbTimes) {\n          this.finishTemporaryAnimation();\n        }\n      });\n\n    if (finalNbTimes !== Infinity) {\n      this.animationResetTimeout = setTimeout(() => {\n        if (this.animationIsPlaying()) {\n          this.finishTemporaryAnimation();\n        }\n      }, restoreOptions?.timeoutMs ?? Math.max(1000, finalNbTimes * 1000));\n    }\n\n    this.animationName.set(animationName);\n\n    return waitPromise;\n  }\n\n  /**\n   * Display a registered component animation effect on this object.\n   *\n   * @param id - Identifier of the component animation to play.\n   * @param params - Parameters forwarded to the animation effect.\n   * @returns A promise resolved when the animation component calls `onFinish`.\n   */\n  showComponentAnimation(id: string, params: any): Promise<void> {\n    const engine = inject(RpgClientEngine);\n    return engine.getComponentAnimation(id).displayEffect(params, this);\n  }\n\n  /**\n   * Display a registered spritesheet animation effect on this object.\n   *\n   * @param graphic - Identifier of the spritesheet to use.\n   * @param animationName - Name of the animation inside the spritesheet.\n   * @returns A promise resolved when the animation component calls `onFinish`.\n   */\n  showAnimation(graphic: string, animationName: string = 'default'): Promise<void> {\n    return this.showComponentAnimation('animation', {\n      graphic,\n      animationName,\n    });\n  }\n  \n  /**\n   * Check whether this client object represents an event.\n   *\n   * @returns `true` if the object type is `event`, otherwise `false`.\n   */\n  isEvent(): boolean {\n    return this._type === 'event';\n  }\n\n  /**\n   * Check whether this client object represents a player.\n   *\n   * @returns `true` if the object type is `player`, otherwise `false`.\n   */\n  isPlayer(): boolean {\n    return this._type === 'player';\n  }\n}\n"],"mappings":"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"}

package/dist/Game/Player.js.map

@@ -1 +1 @@
-{"version":3,"file":"Player.js","names":[],"sources":["../../src/Game/Player.ts"],"sourcesContent":["import { RpgClientObject } from \"./Object\";\n\nexport class RpgClientPlayer extends RpgClientObject {\n    _type = 'player'\n}   "],"mappings":";;AAEA,IAAa,kBAAb,cAAqC,gBAAgB;;;eACzC"}
+{"version":3,"file":"Player.js","names":[],"sources":["../../src/Game/Player.ts"],"sourcesContent":["import { RpgClientObject } from \"./Object\";\n\nexport class RpgClientPlayer extends RpgClientObject {\n    _type = 'player'\n}   "],"mappings":";;AAEA,IAAa,kBAAb,cAAqC,gBAAgB;;;eACzC;;AACZ"}

package/dist/Gui/Gui.d.ts

@@ -4,7 +4,7 @@ import { Subscription } from 'rxjs';
 interface GuiOptions {
     name?: string;
     id?: string;
-    component: any;
+    component?: any;
     display?: boolean;
     data?: any;
     /**
@@ -24,14 +24,18 @@ interface GuiOptions {
      * @default false
      */
     attachToSprite?: boolean;
+    /**
+     * Vue v4 compatibility flag. Prefer attachToSprite in v5 projects.
+     */
+    rpgAttachToSprite?: boolean;
 }
-interface GuiInstance {
+export interface GuiInstance {
     name: string;
     component: any;
     display: WritableSignal<boolean>;
     data: WritableSignal<any>;
     autoDisplay: boolean;
-    dependencies?: () => Signal[];
+    dependencies?: Signal[];
     subscription?: Subscription;
     attachToSprite?: boolean;
 }
@@ -113,7 +117,7 @@ export declare class RpgGui {
      * });
      * ```
      */
-    add(gui: GuiOptions): void;
+    add(gui: GuiOptions | any): void;
     registerOptimisticReducer(guiId: string, reducer: OptimisticReducer): void;
     /**
      * Get all attached GUI components (attachToSprite: true)
@@ -130,6 +134,8 @@ export declare class RpgGui {
      * ```
      */
     getAttachedGuis(): GuiInstance[];
+    getVueGuis(): GuiInstance[];
+    getAttachedVueGuis(): GuiInstance[];
     /**
      * Check if a player should display attached GUIs
      *
@@ -187,6 +193,13 @@ export declare class RpgGui {
      */
     hide(id: string): void;
     private isVueComponent;
+    private isVueComponentInstance;
+    private removeCanvasGui;
+    private removeVueGui;
+    private resolveComponent;
+    private resolveGuiId;
+    private resolveAttachToSprite;
+    private toGuiState;
     private clearPendingActions;
     private applyReducers;
     private applyOptimisticAction;

package/dist/Gui/Gui.js

@@ -1,4 +1,4 @@
-import { inject } from "../node_modules/.pnpm/@signe_di@2.10.0/node_modules/@signe/di/dist/index.js";
+import { inject } from "../node_modules/.pnpm/@signe_di@3.0.1/node_modules/@signe/di/dist/index.js";
 import { WebSocketToken } from "../services/AbstractSocket.js";
 import __ce_component from "../components/gui/dialogbox/index.ce.js";
 import __ce_component$1 from "../components/gui/shop/shop.ce.js";
@@ -146,6 +146,7 @@ var RpgGui = class {
 	*/
 	_setVueGuiInstance(vueGuiInstance) {
 		this.vueGuiInstance = vueGuiInstance;
+		this._initializeVueComponents();
 	}
 	/**
 	* Notify VueGui about GUI state changes
@@ -156,35 +157,16 @@ var RpgGui = class {
 	* @param data - Component data
 	*/
 	_notifyVueGui(guiId, display, data = {}) {
-		if (this.vueGuiInstance && this.vueGuiInstance.vm) {
-			const extraGui = this.extraGuis.find((gui) => gui.name === guiId);
-			if (extraGui) {
-				this.vueGuiInstance.vm.gui[guiId] = {
-					name: guiId,
-					display,
-					data,
-					attachToSprite: extraGui.attachToSprite || false
-				};
-				this.vueGuiInstance.vm.gui = Object.assign({}, this.vueGuiInstance.vm.gui);
-			}
-		}
+		const extraGui = this.extraGuis.find((gui) => gui.name === guiId);
+		if (!extraGui) return;
+		this.vueGuiInstance?.updateGuiState?.(this.toGuiState(extraGui, display, data));
 	}
 	/**
 	* Initialize Vue components in the VueGui instance
 	* This should be called after VueGui is mounted
 	*/
 	_initializeVueComponents() {
-		if (this.vueGuiInstance && this.vueGuiInstance.vm) {
-			this.extraGuis.forEach((gui) => {
-				this.vueGuiInstance.vm.gui[gui.name] = {
-					name: gui.name,
-					display: gui.display(),
-					data: gui.data(),
-					attachToSprite: gui.attachToSprite || false
-				};
-			});
-			this.vueGuiInstance.vm.gui = Object.assign({}, this.vueGuiInstance.vm.gui);
-		}
+		this.vueGuiInstance?.initializeGuiStates?.(this.extraGuis.map((gui) => this.toGuiState(gui)));
 	}
 	guiInteraction(guiId, name, data) {
 		const clientActionId = globalThis.crypto?.randomUUID?.() || `${Date.now()}-${Math.random()}`;
@@ -244,24 +226,34 @@ var RpgGui = class {
 	* ```
 	*/
 	add(gui) {
-		const guiId = gui.name || gui.id;
+		const component = this.resolveComponent(gui);
+		const guiId = this.resolveGuiId(gui, component);
 		if (!guiId) throw new Error("GUI must have a name or id");
+		const attachToSprite = this.resolveAttachToSprite(gui, component);
 		const guiInstance = {
 			name: guiId,
-			component: gui.component,
+			component,
 			display: signal(gui.display || false),
 			data: signal(gui.data || {}),
 			autoDisplay: gui.autoDisplay || false,
 			dependencies: gui.dependencies ? gui.dependencies() : [],
-			attachToSprite: gui.attachToSprite || false
+			attachToSprite
 		};
-		if (typeof gui.component !== "function") {
-			guiInstance.component = gui;
-			this.extraGuis.push(guiInstance);
-			if (guiInstance.autoDisplay) this._notifyVueGui(guiId, true, gui.data || {});
+		if (this.isVueComponentInstance(guiInstance)) {
+			this.removeCanvasGui(guiId);
+			const existingIndex = this.extraGuis.findIndex((existing) => existing.name === guiId);
+			if (existingIndex >= 0) {
+				this.extraGuis[existingIndex].subscription?.unsubscribe();
+				this.extraGuis[existingIndex] = guiInstance;
+			} else this.extraGuis.push(guiInstance);
+			this._initializeVueComponents();
+			if (guiInstance.autoDisplay) this.display(guiId, gui.data);
+			else this._notifyVueGui(guiId, guiInstance.display(), guiInstance.data());
 			return;
 		}
+		this.removeVueGui(guiId);
 		this.gui()[guiId] = guiInstance;
+		this._initializeVueComponents();
 		if (guiInstance.autoDisplay && typeof gui.component === "function") this.display(guiId, gui.data);
 	}
 	registerOptimisticReducer(guiId, reducer) {
@@ -283,8 +275,13 @@ var RpgGui = class {
 	* ```
 	*/
 	getAttachedGuis() {
-		const allGuis = this.getAll();
-		return Object.values(allGuis).filter((gui) => gui.attachToSprite === true);
+		return Object.values(this.gui()).filter((gui) => gui.attachToSprite === true);
+	}
+	getVueGuis() {
+		return [...this.extraGuis];
+	}
+	getAttachedVueGuis() {
+		return this.extraGuis.filter((gui) => gui.attachToSprite === true);
 	}
 	/**
 	* Check if a player should display attached GUIs
@@ -358,7 +355,7 @@ var RpgGui = class {
 			guiInstance.subscription.unsubscribe();
 			guiInstance.subscription = void 0;
 		}
-		const deps = dependencies.length > 0 ? dependencies : guiInstance.dependencies ? guiInstance.dependencies() : [];
+		const deps = dependencies.length > 0 ? dependencies : guiInstance.dependencies ?? [];
 		if (deps.length > 0) {
 			guiInstance.subscription = combineLatest(deps.map((dependency) => dependency.observable)).subscribe((values) => {
 				if (values.every((value) => value !== void 0)) {
@@ -399,6 +396,39 @@ var RpgGui = class {
 	isVueComponent(id) {
 		return this.extraGuis.some((gui) => gui.name === id);
 	}
+	isVueComponentInstance(gui) {
+		return typeof gui.component !== "function";
+	}
+	removeCanvasGui(guiId) {
+		const current = this.gui();
+		if (!(guiId in current)) return;
+		const next = { ...current };
+		delete next[guiId];
+		this.gui.set(next);
+	}
+	removeVueGui(guiId) {
+		const removed = this.extraGuis.filter((existing) => existing.name === guiId);
+		removed.forEach((gui) => gui.subscription?.unsubscribe());
+		if (removed.length > 0) this.extraGuis = this.extraGuis.filter((existing) => existing.name !== guiId);
+	}
+	resolveComponent(gui) {
+		return gui?.component ?? gui;
+	}
+	resolveGuiId(gui, component) {
+		return gui?.name || gui?.id || component?.name || component?.__name;
+	}
+	resolveAttachToSprite(gui, component) {
+		return !!(gui?.attachToSprite || gui?.rpgAttachToSprite || component?.attachToSprite || component?.rpgAttachToSprite);
+	}
+	toGuiState(gui, display = gui.display(), data = gui.data()) {
+		return {
+			name: gui.name,
+			component: gui.component,
+			display,
+			data,
+			attachToSprite: gui.attachToSprite || false
+		};
+	}
 	clearPendingActions(guiId) {
 		this.pendingActions.delete(guiId);
 	}