@playcanvas/react/dist/hooks/use-component.js

A React renderer for PlayCanvas – build interactive 3D applications using React's declarative paradigm.

import { useLayoutEffect, useRef } from "react";
import { useParent } from "./use-parent.js";
import { useApp } from "./use-app.js";
import { applyProps } from "../utils/validation.js";
export function useComponent(ctype, props, schema) {
    const componentRef = useRef(null);
    const parent = useParent();
    const app = useApp();
    useLayoutEffect(() => {
        if (!ctype) {
            return;
        }
        if (parent) {
            // Only add the component if it hasn't been added yet
            if (!componentRef.current) {
                componentRef.current = parent.addComponent(ctype);
            }
        }
        return () => {
            const comp = componentRef.current;
            componentRef.current = null;
            if (!app || !app.root)
                return;
            if (comp) {
                if (app.systems[ctype] && parent.c[ctype]) {
                    parent.removeComponent(ctype);
                }
            }
        };
    }, [app, parent, ctype]);
    // Update component props
    useLayoutEffect(() => {
        if (!ctype) {
            return;
        }
        const comp = componentRef.current;
        // Ensure componentRef.current exists before updating props
        if (!comp)
            return;
        const filteredProps = Object.fromEntries(Object.entries(props).filter(([key]) => key in comp));
        applyProps(comp, schema, filteredProps);
    });
}
;
//# sourceMappingURL=use-component.js.map