From 3495ee0f7c32fc9abc5ab260751540ce40a30bb9 Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Wed, 7 Oct 2020 18:10:36 +0200
Subject: [PATCH] docs(website): example flow

---
 website/src/components/TeaserFlow/B.js | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/website/src/components/TeaserFlow/B.js b/website/src/components/TeaserFlow/B.js
index a3c72fc8..e92bd4cc 100644
--- a/website/src/components/TeaserFlow/B.js
+++ b/website/src/components/TeaserFlow/B.js
@@ -33,7 +33,7 @@ const InputLabel = styled.div`
   color: ${(p) => p.theme.colors.violetLighten60};
 `;
 
-const InputNode = ({ id, data }) => {
+const InputNode = ({ id, data, isConnectable }) => {
   return (
     <NodeWrapper>
       <InputLabel>{data.label}:</InputLabel>
@@ -42,17 +42,29 @@ const InputNode = ({ id, data }) => {
         value={data.value}
         onChange={(event) => data.onChange(event, id)}
       />
-      <Handle type="source" position="bottom" />
+      <Handle type="source" position="bottom" isConnectable={isConnectable} />
     </NodeWrapper>
   );
 };
 
-const ResultNode = ({ data }) => {
+const ResultNode = ({ data, isConnectable }) => {
   return (
     <NodeWrapper>
       <div>{data.value}</div>
-      <Handle type="target" position="top" id="a" style={{ left: '40%' }} />
-      <Handle type="target" position="top" id="b" style={{ left: '60%' }} />
+      <Handle
+        type="target"
+        position="top"
+        id="a"
+        style={{ left: '40%' }}
+        isConnectable={isConnectable}
+      />
+      <Handle
+        type="target"
+        position="top"
+        id="b"
+        style={{ left: '60%' }}
+        isConnectable={isConnectable}
+      />
     </NodeWrapper>
   );
 };