Icon

<Icon name> draws one icon from lucide, white with a dark edge, as Text draws words. A game names the icon rather than importing it, because a game imports nothing but the engine. Each icon loads on its own, so a game downloads only the icons it names.

Its props are in IconProps.

import { Hud, Icon, Panel, Slot, Text } from "@daniel-zarinski/engine";

export function Coins({ coins }: { coins: number }) {
    return (
        <Hud>
            <Panel slot={Slot.TopRight}>
                <Icon name="coins" className="size-6" />
                <Text>{coins}</Text>
            </Panel>
        </Hud>
    );
}