JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.kineticjs.com/download/kinetic-v3.8.1.js"></script>
<div id="container"></div>

JavaScript

var cleared = false;
        
            window.onload = function(){
                var stage = new Kinetic.Stage("container", 400, 400);
                var circleLayer = new Kinetic.Layer();
                var squareLayer = new Kinetic.Layer();
                
                var rect = new Kinetic.Rect({
                    x: 50,
                    y: 50,
                    width: 100,
                    height: 50,
                    fill: "#00D2FF",
                    stroke: "black",
                    strokeWidth: 4
                });
        
                var circle = new Kinetic.Circle({
                    x: stage.width / 2,
                    y: stage.height / 2,
                    radius: 70,
                    fill: "red",
                    stroke: "black",
                    strokeWidth: 4
                });
                
                rect.on("mousedown",function(){
                    if(!cleared)
                    {
                        circleLayer.clear();
                        cleared = true;
                    } 
                    else 
                    {
                        circleLayer.draw();
                        cleared = false;
                    }
                    
                })
            
                circleLayer.add(circle);
                squareLayer.add(rect);
                stage.add(squareLayer);
                stage.add(circleLayer);
            }