pixi-fusion/src/hooks/useSprite.ts

This module offers a set of common components needed for playing games.

import { useMemo } from "react";

import { Sprite, SpriteOptions } from "pixi.js";
import { useTextures } from "./useTexture";
import { useObject } from "./useObject";

type UseSpriteOptions = Omit<SpriteOptions, "texture"> & {
    texture: string;
};

export const useSprite = ({ texture = "", ...options }: UseSpriteOptions) => {
    const textureKeys = useMemo(() => {
        return [...(texture ? [texture] : [])];
    }, [texture]);

    const { isFetched } = useTextures({ keys: textureKeys });

    const sprite = useMemo(() => {
        if (!isFetched) {
            return null;
        }

        if (texture) {
            return Sprite.from(texture);
        }

        return new Sprite({});
    }, [texture, frames, isFetched]);

    useObject({ object: sprite, ...options });

    return sprite;
};