42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
import { VscArrowLeft, VscArrowRight } from "react-icons/vsc";
|
|
import useStore from "../../lib/FlowEditor/FlowEditorStore";
|
|
import { LedNodeComponent, SensorNodeComponent } from "./nodes/IO/IO";
|
|
import { DelayNodeComponent, MathNodeComponent , StartNodeComponent, FinishNodeComponent } from "./nodes/Logic/Logic";
|
|
|
|
const Panel = () => {
|
|
const { panelClosed, togglePanelState } = useStore();
|
|
|
|
const PanelButton = () => {
|
|
return (
|
|
<div
|
|
className={`flow-panel-button ${panelClosed ? "rotate-180" : ""}`}
|
|
onClick={togglePanelState}
|
|
>
|
|
<VscArrowLeft size={40} />
|
|
</div>
|
|
);
|
|
};
|
|
|
|
return (
|
|
<aside
|
|
className={`flow-panel ${panelClosed ? "w-0" : "w-60"} duration-300`}
|
|
>
|
|
<PanelButton />
|
|
{!panelClosed && (
|
|
<div className="flex flex-col">
|
|
<SensorNodeComponent />
|
|
<LedNodeComponent />
|
|
|
|
<MathNodeComponent />
|
|
<DelayNodeComponent />
|
|
|
|
<StartNodeComponent />
|
|
<FinishNodeComponent />
|
|
</div>
|
|
)}
|
|
</aside>
|
|
);
|
|
};
|
|
|
|
export default Panel;
|