From dbb178b2226c9d233e8137449c8e7148d94b0b62 Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Thu, 25 Jul 2019 00:27:00 +0200
Subject: [PATCH] refactor(edges): dont add width and height params

---
 dist/ReactGraph.css                    |  2 +-
 dist/ReactGraph.js                     |  5 +++++
 example/index.html                     |  1 +
 src/NodeRenderer/NodeTypes/wrapNode.js |  2 +-
 src/graph-utils.js                     | 20 +++++++++++++-------
 src/style.css                          |  2 +-
 6 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/dist/ReactGraph.css b/dist/ReactGraph.css
index c9f1d064..1ab30709 100644
--- a/dist/ReactGraph.css
+++ b/dist/ReactGraph.css
@@ -60,7 +60,7 @@
   width: 100%;
   height: 100%;
   position: absolute;
-  z-index: 2;
+  z-index: 3;
   pointer-events: none;
   transform-origin: 0 0;
 }
diff --git a/dist/ReactGraph.js b/dist/ReactGraph.js
index 542ddbcd..32b33fec 100644
--- a/dist/ReactGraph.js
+++ b/dist/ReactGraph.js
@@ -204,6 +204,10 @@
     return element.data && element.data.source && element.data.target;
   };
   var parseElements = function parseElements(e) {
+    if (isEdge(e)) {
+      return e;
+    }
+
     return _objectSpread2({}, e, {
       __rg: {
         position: e.position,
@@ -32893,6 +32897,7 @@
         className: nodeClasses,
         ref: nodeElement,
         style: {
+          zIndex: selected ? 10 : 3,
           transform: "translate(".concat(position.x, "px,").concat(position.y, "px)")
         },
         onClick: function onClick(e) {
diff --git a/example/index.html b/example/index.html
index 8ac422f9..323a4f14 100644
--- a/example/index.html
+++ b/example/index.html
@@ -4,6 +4,7 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <link rel="stylesheet" type="text/css" href="../dist/ReactGraph.css">
   <title>Document</title>
   <style>
     html, body {
diff --git a/src/NodeRenderer/NodeTypes/wrapNode.js b/src/NodeRenderer/NodeTypes/wrapNode.js
index 65507006..20388428 100644
--- a/src/NodeRenderer/NodeTypes/wrapNode.js
+++ b/src/NodeRenderer/NodeTypes/wrapNode.js
@@ -64,7 +64,7 @@ export default NodeComponent => (props) => {
       <div
         className={nodeClasses}
         ref={nodeElement}
-        style={{ transform: `translate(${position.x}px,${position.y}px)` }}
+        style={{ zIndex: selected ? 10 : 3, transform: `translate(${position.x}px,${position.y}px)` }}
         onClick={(e) => {
           if (isInputTarget(e)) {
             return false;
diff --git a/src/graph-utils.js b/src/graph-utils.js
index f97169db..51c7315a 100644
--- a/src/graph-utils.js
+++ b/src/graph-utils.js
@@ -1,13 +1,19 @@
 export const isEdge = element => element.data && element.data.source && element.data.target;
 
-export const parseElements = e => ({
-  ...e,
-  __rg: {
-    position: e.position,
-    width: null,
-    height: null
+export const parseElements = e => {
+  if (isEdge(e)) {
+    return e;
   }
-});
+
+  return {
+    ...e,
+    __rg: {
+      position: e.position,
+      width: null,
+      height: null
+    }
+  }
+};
 
 export const separateElements = (res, element) => {
   res.edges = res.edges ? res.edges : [];
diff --git a/src/style.css b/src/style.css
index 0213e9be..fa284b5c 100644
--- a/src/style.css
+++ b/src/style.css
@@ -60,7 +60,7 @@
   width: 100%;
   height: 100%;
   position: absolute;
-  z-index: 2;
+  z-index: 3;
   pointer-events: none;
   transform-origin: 0 0;
 }