added port type "any"

src/components/IoPorts/IoPorts.js

@@ -14,6 +14,7 @@ import { PortTypesContext } from "../../context";
 import usePrevious from "../../hooks/usePrevious";
 import { calculateCurve, getPortRect } from "../../connectionCalculator";
 import { STAGE_ID, DRAG_CONNECTION_ID } from '../../constants'
+import { getPort } from "../../utilities";
 
 function useTransputs (transputsFn, transputType, nodeId, inputData, connections) {
   const nodesDispatch = React.useContext(NodeDispatchContext);
@@ -54,7 +55,7 @@ const IoPorts = ({
   const triggerRecalculation = React.useContext(ConnectionRecalculateContext);
   const resolvedInputs = useTransputs(inputs, 'input', nodeId, inputData, connections);
   const resolvedOutputs = useTransputs(outputs, 'output', nodeId, inputData, connections);
-  
+
   return (
     <div className={styles.wrapper}>
       {resolvedInputs.length ? (
@@ -265,29 +266,39 @@ const Port = ({
     const droppedOnPort = !!e.target.dataset.portName;
 
     if (isInput) {
+
       const {
         inputNodeId,
         inputPortName,
         outputNodeId,
-        outputPortName
+        outputPortName,
       } = lineInToPort.current.dataset;
+
       nodesDispatch({
         type: "REMOVE_CONNECTION",
         input: { nodeId: inputNodeId, portName: inputPortName },
         output: { nodeId: outputNodeId, portName: outputPortName }
       });
       if (droppedOnPort) {
+
         const {
           portName: connectToPortName,
           nodeId: connectToNodeId,
           portType: connectToPortType,
           portTransputType: connectToTransputType
         } = e.target.dataset;
         const isNotSameNode = outputNodeId !== connectToNodeId;
+
         if (isNotSameNode && connectToTransputType !== "output") {
-          const inputWillAcceptConnection = inputTypes[
-            connectToPortType
-          ].acceptTypes.includes(type);
+
+            const outputPortType = getPort(outputNodeId, outputPortName, "output").dataset.portType
+
+            const inputWillAcceptConnection = inputTypes[
+                    connectToPortType
+                ].acceptTypes.includes(outputPortType) || inputTypes[
+                    connectToPortType
+                ].acceptTypes.includes('any');
+
           if (inputWillAcceptConnection) {
             nodesDispatch({
               type: "ADD_CONNECTION",
@@ -308,8 +319,12 @@ const Port = ({
         const isNotSameNode = inputNodeId !== nodeId;
         if (isNotSameNode && inputTransputType !== "output") {
           const inputWillAcceptConnection = inputTypes[
-            inputNodeType
-          ].acceptTypes.includes(type);
+                    inputNodeType
+                ].acceptTypes.includes(type) || inputTypes[
+                    inputNodeType
+                ].acceptTypes.includes('any')
+
+
           if (inputWillAcceptConnection) {
             nodesDispatch({
               type: "ADD_CONNECTION",
@@ -340,6 +355,7 @@ const Port = ({
       );
       const portIsConnected = !!lineInToPort.current;
       if (portIsConnected) {
+
         lineInToPort.current.parentNode.style.zIndex = 9999;
         const outputPort = getPortRect(
           lineInToPort.current.dataset.outputNodeId,
@@ -381,6 +397,7 @@ const Port = ({
     }
   };
 
+
   return (
     <React.Fragment>
       <div

src/connectionCalculator.js

@@ -1,11 +1,7 @@
 import styles from "./components/Connection/Connection.css";
 import { CONNECTIONS_ID } from './constants'
 import { line, curveBasis } from 'd3-shape'
-
-const getPort = (nodeId, portName, transputType = "input") => document
-  .querySelector(
-    `[data-node-id="${nodeId}"] [data-port-name="${portName}"][data-port-transput-type="${transputType}"]`
-  )
+import { getPort } from "./utilities";
 
 export const getPortRect = (nodeId, portName, transputType = "input", cache) => {
   if(cache){

src/utilities.js

@@ -21,3 +21,8 @@ export const checkForCircularNodes = (nodes, startNodeId) => {
   walk(startNodeId)
   return isCircular;
 }
+
+export const getPort = (nodeId, portName, transputType = "input") => document
+              .querySelector(
+                `[data-node-id="${nodeId}"] [data-port-name="${portName}"][data-port-transput-type="${transputType}"]`
+              )