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;