JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/gojs/1.7.22/go-debug.js"></script>
<div id=diagram></div>

CSS

#diagram {
  height: 100px;
  width: 222px;
  border: 1px solid;
}

JavaScript

var $ = go.GraphObject.make;
var diagram = $(go.Diagram, "diagram", {
  padding: 0, // No padding on diagram
});

diagram.nodeTemplate =
  $(go.Node, "Auto", {
      mouseEnter: function(e, n) { // mouse over node
        console.log('mouseEnter called on node', n.data.key);
        n.isHighlighted = true;
      },
      mouseLeave: function(e, n) { // moue out node
        n.isHighlighted = false;
      }
    },
    $(go.Shape, "Rectangle", { // main rectangle
      height: 100,
      width: 100,
    }),
    $(go.TextBlock, { // red X
        alignment: go.Spot.TopRight,
        stroke: 'red',
        font: '50px Arial',
        cursor: 'pointer',
        margin: 5,
        text: 'X',
      },
      new go.Binding("visible", "isHighlighted").ofObject()
    )
  );

diagram.model = new go.GraphLinksModel([{ // Add two nodes
  key: 1
}, {
  key: 2
}]);

document.getElementById('diagram').addEventListener('mouseleave', function(event) {
  diagram.startTransaction("no highlighteds");
  diagram.clearHighlighteds();
  diagram.commitTransaction("no highlighteds");
});