mylingo3d/lib/editor/SceneGraph/TreeItem.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 { Fragment } from "preact";
import { useMemo } from "preact/hooks";
import { hiddenAppendables } from "../../api/core/Appendable";
import { useMultipleSelectionTargets, useSceneGraphExpanded, useSelectionTarget } from "../states";
import Model from "../../display/Model";
import ModelTreeItem from "./ModelTreeItem";
import { emitSelectionTarget } from "../../events/onSelectionTarget";
import { isPositionedItem } from "../../api/core/PositionedItem";
import { Object3D } from "three";
import { setSceneGraphTarget } from "../../states/useSceneGraphTarget";
import { getSelectionTarget } from "../../states/useSelectionTarget";
import getComponentName from "../utils/getComponentName";
import { getEditing } from "../../states/useEditing";
import { setEditorMode } from "../../states/useEditorMode";
import BaseTreeItem from "../component/BaseTreeItem";
import CubeIcon from "./icons/CubeIcon";
export const makeTreeItemCallbacks = (target, parent) => () => {
    !getEditing() && setEditorMode("translate");
    isPositionedItem(parent) &&
        getSelectionTarget() !== parent &&
        emitSelectionTarget(parent);
    if (target instanceof Object3D)
        queueMicrotask(() => setSceneGraphTarget(target));
    else
        emitSelectionTarget(target);
};
const TreeItem = ({ appendable, children, expandable }) => {
    const appendableChildren = useMemo(() => {
        return appendable.children
            ? [...appendable.children].filter((item) => !hiddenAppendables.has(item))
            : undefined;
    }, [appendable.children?.size]);
    const [selectionTarget] = useSelectionTarget();
    const [multipleSelectionTargets] = useMultipleSelectionTargets();
    const selected = selectionTarget === appendable ||
        multipleSelectionTargets.includes(appendable);
    const handleClick = useMemo(() => makeTreeItemCallbacks(appendable), []);
    const [sceneGraphExpanded, setSceneGraphExpanded] = useSceneGraphExpanded();
    return (_jsx(BaseTreeItem, { label: getComponentName(appendable), selected: selected, draggable: true, myDraggingItem: appendable, onDrop: (draggingItem) => appendable.attach(draggingItem), expanded: sceneGraphExpanded?.has(appendable.outerObject3d), onCollapse: () => setSceneGraphExpanded(undefined), expandable: expandable ?? !!appendableChildren?.length, onClick: handleClick, IconComponent: CubeIcon, children: () => (_jsxs(Fragment, { children: [appendableChildren?.map((childAppendable) => childAppendable instanceof Model ? (_jsx(ModelTreeItem, { appendable: childAppendable }, childAppendable.uuid)) : (_jsx(TreeItem, { appendable: childAppendable }, childAppendable.uuid))), children] })) }));
};
export default TreeItem;
//# sourceMappingURL=TreeItem.js.map