Init commit

src/nodes.tsx

@@ -0,0 +1,46 @@
+import { Handle, Position, type Node, type NodeProps } from '@xyflow/react';
+import type { DiagramNodeData, NodeKind } from './types';
+
+type ShapeNode = Node<DiagramNodeData, NodeKind>;
+
+function ShapeHandles() {
+  return (
+    <>
+      <Handle type="target" position={Position.Left} />
+      <Handle type="source" position={Position.Right} />
+    </>
+  );
+}
+
+function TaskNode({ data }: NodeProps<ShapeNode>) {
+  return (
+    <div className="diagram-node diagram-node--task">
+      <ShapeHandles />
+      <span>{data.label}</span>
+    </div>
+  );
+}
+
+function GatewayNode({ data }: NodeProps<ShapeNode>) {
+  return (
+    <div className="diagram-node diagram-node--gateway">
+      <ShapeHandles />
+      <span>{data.label}</span>
+    </div>
+  );
+}
+
+function EventNode({ data }: NodeProps<ShapeNode>) {
+  return (
+    <div className="diagram-node diagram-node--event">
+      <ShapeHandles />
+      <span>{data.label}</span>
+    </div>
+  );
+}
+
+export const nodeTypes = {
+  task: TaskNode,
+  gateway: GatewayNode,
+  event: EventNode,
+};