graflow, autoplacement 1.6, wires with arrows

app/assets/html/bzGraflow/nodesTest2.html

@@ -27,6 +27,7 @@
         width: 6px;
         background: #FFF; 
         z-index: 99;
+        opacity: 0.3;
     }
 
     .bzgf-node [data-direction="w"]{ left: -7px; top: 50%; transform: translateY(-50%);}
@@ -149,9 +150,26 @@
         place-items: center;
         color: white;
     }
-    .bzgf-wire{ stroke: #AAA; stroke-width: 4; }
+    .bzgf-wire{ stroke: #FF0; stroke-width: 2; }
 </style>
 
+<svg style="display:none" aria-hidden="true">
+  <template id="svg-arrows">
+    <defs>
+      <marker id="arrow"
+              viewBox="0 0 15 15"
+              refX="15"
+              refY="7"
+              markerWidth="15"
+              markerHeight="15"
+              orient="auto-start-reverse"
+              markerUnits="userSpaceOnUse">
+        <path d="M0,0 L15,7 L0,15 Z" fill="#FF0"/>
+      </marker>
+    </defs>
+  </template>
+</svg>
+
 <template>
     <div class="bzgf-node" data-nodetype="start">
         <div class="text"></div>
@@ -209,5 +227,7 @@
         </div>
         <div class="port" data-id="inp1" data-direction="n"></div>
         <div class="port" data-id="out1" data-direction="s"></div>
+        <div class="port" data-id="inout1" data-direction="w"></div>
+        <div class="port" data-id="inout2" data-direction="e"></div>
     </div>
 </template>