import Draggable from "../../../DragNDrop/Draggable";

const groupColor = "bg-blue-800";

const DelayNodeComponent = () => {
  return (
    <Draggable data={{ type: "delay" }}>
      <div className="node-component">
        <div className={`node-component-handle ${groupColor}`} />
        Задержка
      </div>
    </Draggable>
  );
};

const MathNodeComponent = () => {
  return (
    <Draggable data={{ type: "math" }}>
      <div className="node-component">
        <div className={`node-component-handle ${groupColor}`} />
        Математика
      </div>
    </Draggable>
  );
};

const FinishNodeComponent = () => {
  return (
    <Draggable data={{ type: "finish" }}>
      <div className="node-component">
        <div className={`node-component-handle ${groupColor}`} />
        Конец
      </div>
    </Draggable>
  );
};

const StartNodeComponent = () => {
  return (
    <Draggable data={{ type: "start" }}>
      <div className="node-component">
        <div className={`node-component-handle ${groupColor}`} />
        Начало
      </div>
    </Draggable>
  );
};

export {
  StartNodeComponent,
  FinishNodeComponent,
  DelayNodeComponent,
  MathNodeComponent,
};