JSFiddle - React, Tailwind, and code Playground

HTML

<body>
  
</body>

CSS

svg { width: 600px; height: 500px; border: 1px solid black}

JavaScript

var NS="http://www.w3.org/2000/svg"; // global name space
var width=500;                      // width of svg
var height=500;                     //hieght of svg 
var cx= width/2;                    // taking centre points
var cy=height/2;
var rwidth=50; var rheight=80;      // rect size
var limit=3;                        // no of
var irh=40; var irw=60;            // input rect size
var arrowpoint_x= cx;  
var arrowpoint_y= cy+(rheight/2);
var SVG=function(h,w){             // fun create SVG
	var svg=document.createElementNS(NS,"svg");
	svg.width=w;
	svg.height=h; 
	createMarkerDef(svg);
	return svg;
}
var rect=function(x,y,h,w){        // fun create Rectangle
  var rectSVGObj = document.createElementNS(NS, 'rect');
  rectSVGObj.setAttributeNS(null, "id", "rectId");
  rectSVGObj.setAttributeNS(null, 'x',x);
  rectSVGObj.setAttributeNS(null, 'y', y);
  rectSVGObj.setAttributeNS(null, 'height', h);
  rectSVGObj.setAttributeNS(null, 'width', w);
  rectSVGObj.setAttributeNS(null, 'fill', 'none');
  rectSVGObj.setAttributeNS(null, "stroke", "black");
	return rectSVGObj;
}
var arrow= function(){                   // fun for arrow 
  console.log("ARROW IN");
  var arrowObj=document.createElementNS(NS,"path"); 
  arrowObj.setAttributeNS(null, "id", "markerArrow");
  arrowObj.setAttributeNS(null, "d","M2,2 L2,13 L8,7 L2,2" );
	arrowObj.setAttributeNS(null, "marker-end", "url(#markerArrow1)");
  return arrowObj;
}
var lines= function(x1,y1,x2,y2){        // lines
  var lineSVGObj = document.createElementNS(NS, 'line');
  lineSVGObj.setAttributeNS(null, "id", "lineId");
  lineSVGObj.setAttributeNS(null, 'x1',x1);
  lineSVGObj.setAttributeNS(null, 'y1', y1);
  lineSVGObj.setAttributeNS(null, 'x2', x2);
  lineSVGObj.setAttributeNS(null, 'y2', y2);
  lineSVGObj.setAttributeNS(null, "stroke", "blue");
  lineSVGObj.setAttributeNS(null,'marker-end',       'url(#markerArrow1)');
	return lineSVGObj;
}
var svg=SVG(height,width);
document.body.appendChild(svg);      // append svg...