GameStat

Methods

.effectCallback({ stats })

.define(tag, registry)

.subscribe(context, callback)

Slots

Displays a single stat from the game state's stats map. Observes game signals and re-renders whenever the stat value changes. Place inside a HUD container or give it a when-some-scene attribute as a direct shell child.

Attributes

All attributes reflect as IDL properties of the same name.

key .key

string -- The key in the stats signal to display. Must match the key used in GameStatUpdateEvent dispatches.

format .format

string -- How to format the value. Defaults to "plain":

• "ms" -- Round to integer and append "ms" suffix (e.g. 342ms)
• "Ndp" -- Fixed-point decimal with N decimal places (e.g. "2dp" formats 0.1 as "0.10")
• "plain" -- Display the raw value as a string (default)

The stat only renders once the key exists in the stats signal. It updates live as new GameStatUpdateEvent events are dispatched.

Signal Access

Usage

<game-stat key="streak">Streak</game-stat>
<game-stat key="avgTime" format="ms">Avg</game-stat>

The label text is provided as slotted content (light DOM children), not via an attribute.

Stats are set from your game logic via events:

this.dispatchEvent(new GameStatUpdateEvent("streak", 5));
this.dispatchEvent(new GameStatUpdateEvent("avgTime", 342));