"use client";

import { type NodeProps } from "@xyflow/react";
import { ListOrderedIcon } from "lucide-react";
import { NodeHandles } from "./NodeHandles";

export function SequenceNode(_props: NodeProps) {
  return (
    <div className="bg-fuchsia-950/80 border border-fuchsia-500/50 rounded-lg shadow-md min-w-32">
      <NodeHandles nodeType="sequence" />
      <div className="flex items-center gap-2 px-3 py-2 border-b border-fuchsia-500/30">
        <ListOrderedIcon className="size-4 text-fuchsia-400 shrink-0" />
        <span className="text-sm font-medium text-fuchsia-200 flex-1">
          Sequence
        </span>
      </div>
      <div className="px-3 py-2 flex justify-between text-xs text-fuchsia-300/80">
        <span>1</span>
        <span>2</span>
        <span>3</span>
      </div>
    </div>
  );
}