Create input node

nodeDev^2
Alex 2022-07-15 00:32:46 +03:00
parent d33ca318c9
commit 1c7ded5d6d
2 changed files with 39 additions and 0 deletions

View File

@ -0,0 +1,39 @@
import styles from "./Node.module.css";
import { Handle, Position } from "react-flow-renderer";
type InputNodeProps = {};
const InputNode = (props: InputNodeProps) => {
return (
// Базовый класс generic-node - прописана ширина и положение, цвет текста и фона
// Nandle - ручка для коннекта. Можно задать оформление при помощи className, тип (target / source) и позицию
// Label - подпись ноды. Можно стилизовать
// Select - DropDown меню, можно стилизовать. Стоит класс nodrag для предотвращения залипания
<div className="Input-node">
<Handle className="" type="target" position={Position.Top} />
<div className="generic-node-content">
<select className="nodrag">
<option>датчик газа</option>
<option>датчик температуры</option>
<option>датчик освещенности</option>
<option>логи</option>
</select>
<select className="nodrag">
<option>получить полный отчет</option>
<option>получить значение</option>
</select>
</div>
<Handle className="" type="source" position={Position.Bottom} />
</div>
);
};
export default InputNode;