lingo3d/lib/editor/GameGraphEditor/GameGraphEditPanel.js

Lingo3D is a React/Vue 3d game development framework that ships with a complete visual editor

import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
import { useEffect, useState } from "preact/hooks";
import getStaticProperties from "../../display/utils/getStaticProperties";
import { EDITOR_WIDTH } from "../../globals";
import Drawer from "../component/Drawer";
import TextBox from "../component/TextBox";
import addTargetInputs from "../Editor/addTargetInputs";
import usePane from "../Editor/usePane";
const GameGraphEditPanel = ({ targetSignal }) => {
    const [pane, setContainer] = usePane();
    const [includeKeys, setIncludeKeys] = useState();
    const [target, setTarget] = useState(targetSignal.value);
    useEffect(() => {
        if (targetSignal.value) {
            setTarget(targetSignal.value);
            return;
        }
        const timeout = setTimeout(() => setTarget(undefined), 500);
        return () => {
            clearTimeout(timeout);
        };
    }, [targetSignal.value]);
    useEffect(() => {
        if (!target || !pane)
            return;
        const handle = addTargetInputs(pane, target, includeKeys, undefined, true);
        return () => {
            handle.cancel();
        };
    }, [target, pane, includeKeys]);
    return (_jsxs(Drawer, { show: !!targetSignal.value, onHide: () => (targetSignal.value = undefined), className: "lingo3d-flexcol lingo3d-bg", width: EDITOR_WIDTH + 50, children: [_jsx(TextBox, { style: { marginTop: 8 }, onChange: (val) => {
                    if (!val || !targetSignal.value) {
                        setIncludeKeys(undefined);
                        return;
                    }
                    val = val.toLowerCase();
                    setIncludeKeys(Object.keys(getStaticProperties(targetSignal.value).schema).filter((key) => key.toLowerCase().includes(val)));
                }, clearOnChange: targetSignal.value }), _jsx("div", { ref: setContainer, style: {
                    overflowY: "scroll",
                    flexGrow: 1,
                    paddingLeft: 8,
                    paddingRight: 8
                } })] }));
};
export default GameGraphEditPanel;
//# sourceMappingURL=GameGraphEditPanel.js.map