r-flow / your-app-namenpx /src /nodes /PositionLoggerNode.tsx
ruv's picture
Add application file
e95c1c4
raw
history blame contribute delete
630 Bytes
import type { NodeProps } from "reactflow";
import { Handle, Position } from "reactflow";
export type PositionLoggerNodeData = {
label?: string;
};
export function PositionLoggerNode({
xPos,
yPos,
data,
}: NodeProps<PositionLoggerNodeData>) {
const x = `${Math.round(xPos)}px`;
const y = `${Math.round(yPos)}px`;
return (
// We add this class to use the same styles as React Flow's default nodes.
<div className="react-flow__node-default">
{data.label && <div>{data.label}</div>}
<div>
{x} {y}
</div>
<Handle type="source" position={Position.Bottom} />
</div>
);
}