import { Handle, Position } from "@xyflow/react";
import type { NodeProps } from "@xyflow/react";

import type { DiagramNode } from "../graph";

export function BpmnAnnotationNode({ data }: NodeProps) {
  const d = data as unknown as DiagramNode & { label: string };

  return (
    <div className="bpmn-annotation">
      <div className="bpmn-annotation-text">{d.label}</div>
      <Handle type="target" position={Position.Left} style={{ opacity: 0 }} />
      <Handle type="source" position={Position.Right} style={{ opacity: 0 }} />
    </div>
  );
}
