mylingo3d/lib/editor/LingoEditor/index.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 register from "preact-custom-element";
import Toolbar from "../Toolbar";
import SceneGraph from "../SceneGraph";
import Editor from "../Editor";
import NodeEditor from "../NodeEditor";
import Library from "../Library";
import HUD from "../HUD";
import { useEffect, useRef } from "preact/hooks";
import settings from "../../api/settings";
import FileBrowser from "../FileBrowser";
import { useFileBrowser } from "../states";
const LingoEditor = ({ embedded }) => {
    const elRef = useRef(null);
    useEffect(() => {
        const el = elRef.current;
        if (!el || embedded)
            return;
        settings.autoMount = el;
    }, [embedded]);
    const [fileBrowser] = useFileBrowser();
    return (_jsxs("div", { className: "lingo3d-ui", style: embedded
            ? { display: "flex", flexWrap: "nowrap", height: "100vh" }
            : {
                width: "100%",
                height: "100%",
                position: "absolute",
                left: 0,
                top: 0,
                display: "flex",
                flexWrap: "nowrap"
            }, children: [_jsx(Toolbar, {}), _jsxs("div", { children: [_jsxs("div", { style: {
                            height: fileBrowser ? "calc(100% - 200px)" : "100%"
                        }, children: [_jsx(SceneGraph, {}), _jsx(Editor, {}), _jsx(NodeEditor, {}), _jsx(Library, {})] }), fileBrowser && _jsx(FileBrowser, {})] }), _jsx(HUD, {}), _jsx("div", { ref: elRef, style: { height: "100%", flexGrow: 1, position: "relative" } })] }));
};
export default LingoEditor;
register(LingoEditor, "lingo3d-lingoeditor");
//# sourceMappingURL=index.js.map