Canvas: build application infrastructure with drag and drop
Change-Id: I5cfd12e67794f3376c5c025af29470d52d77cf16
diff --git a/apps/canvas/src/components/handle-port-out.tsx b/apps/canvas/src/components/handle-port-out.tsx
new file mode 100644
index 0000000..c8cbd7a
--- /dev/null
+++ b/apps/canvas/src/components/handle-port-out.tsx
@@ -0,0 +1,26 @@
+import { Handle, Position } from "@xyflow/react";
+import { ReactElement } from "react";
+import { v4 as uuidv4 } from "uuid";
+
+export class PortOut {
+ public readonly id: string;
+ // private name: string;
+ // private value: number;
+
+ constructor() {
+ this.id = uuidv4();
+ // this.name = "";
+ // this.value = 0;
+ }
+
+ public handle(): ReactElement {
+ return (
+ <Handle
+ id={this.id}
+ type={"source"}
+ position={Position.Top}
+ />
+ )
+ }
+}
+