lingo3d/lib/editor/WorldBar/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 AppBar from "../component/bars/AppBar";
import useInitCSS from "../hooks/useInitCSS";
import WorldControls from "./WorldControls";
import useInitEditor from "../hooks/useInitEditor";
import Switch from "../component/Switch";
import useSyncState from "../hooks/useSyncState";
import { getSplitView, setSplitView } from "../../states/useSplitView";
import { getUILayer, setUILayer } from "../../states/useUILayer";
import { getWorldExpanded } from "../../states/useWorldExpanded";
import SelectBox from "../component/SelectBox";
import { getCameraList } from "../../states/useCameraList";
import getDisplayName from "../utils/getDisplayName";
import { getManager } from "../../display/core/utils/getManager";
import { setEditorCamera } from "../../states/useEditorCamera";
const Tabs = () => {
    useInitCSS();
    useInitEditor();
    const splitView = useSyncState(getSplitView);
    const uiLayer = useSyncState(getUILayer);
    const cameraList = useSyncState(getCameraList);
    const worldExpanded = useSyncState(getWorldExpanded);
    return (_jsx("div", { className: "lingo3d-ui lingo3d-bg-dark lingo3d-tabs", style: {
            width: "100%",
            borderBottom: "1px solid rgba(255, 255, 255, 0.1)"
        }, children: _jsxs(AppBar, { style: { gap: 4 }, children: [_jsx(SelectBox, { width: 100, options: cameraList.map((cam) => getDisplayName(getManager(cam))), onChange: (index) => setEditorCamera(cameraList[index]) }), _jsx(Switch, { label: "split", on: splitView, onChange: (val) => setSplitView(val) }), _jsx(Switch, { label: "ui", on: uiLayer, onChange: (val) => setUILayer(val) }), _jsx("div", { style: { flexGrow: 1, minWidth: 4 } }), _jsx(WorldControls, {})] }) }));
};
export default Tabs;
//# sourceMappingURL=index.js.map