From f2313916b6a09c28b8a0b616f936f81a4433a236 Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Fri, 29 May 2020 16:50:59 +0200
Subject: [PATCH] feat(handle): add class name prop type

---
 README.md                       | 1 +
 src/components/Handle/index.tsx | 8 ++++++--
 src/types/index.ts              | 1 +
 3 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 5d0815a0..bd6cb6ab 100644
--- a/README.md
+++ b/README.md
@@ -188,6 +188,7 @@ const targetHandleWithValidation = (
 - `onConnect`: function that gets triggered on connect
 - `isValidConnection`: function receives a connection `{ target: 'some-id', source: 'another-id' }` as param, returns a boolean - true by default
 - `style`: css properties
+- `className`: additional class name
 
 #### Multiple Handles
 
diff --git a/src/components/Handle/index.tsx b/src/components/Handle/index.tsx
index 44d686d5..56a544c0 100644
--- a/src/components/Handle/index.tsx
+++ b/src/components/Handle/index.tsx
@@ -12,7 +12,9 @@ const Handle = memo(
     position = Position.Top,
     onConnect = () => {},
     isValidConnection = () => true,
-    ...rest
+    style,
+    className,
+    id,
   }: HandleProps) => {
     const nodeId = useContext(NodeIdContext) as ElementId;
     const setPosition = useStoreActions((a) => a.setConnectionPosition);
@@ -32,7 +34,9 @@ const Handle = memo(
         type={type}
         position={position}
         isValidConnection={isValidConnection}
-        {...rest}
+        style={style}
+        className={className}
+        id={id}
       />
     );
   }
diff --git a/src/types/index.ts b/src/types/index.ts
index 34b84d42..b45da6e4 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -168,6 +168,7 @@ export interface HandleProps {
   isValidConnection?: (connection: Connection) => boolean;
   id?: string;
   style?: CSSProperties;
+  className?: string;
 }
 
 export interface EdgeCompProps {