[SOLVED] Is there a way to set cursor to Konvajs transformer anchor

Is there a way to set cursor to Konvajs transformer anchor

I want to set cursor to anchor on mouse enter event. I tried the following code, but without success

const tr = new Konva.Transformer({
  nodes: [shape]
})

tr.update = function() { 
  Konva.Transformer.prototype.update.call(tr);
  var rot = this.findOne('.rotater');
  rot.on("mouseenter", () => {
    stage.container().style.cursor = 'move';
  })
  rot.on('mouseleave', () => {
    stage.container().style.cursor = 'default';
  })
  
}

tr.forceUpdate();

Solution

const stage = new Konva.Stage({
  container: 'container',
  width: window.innerWidth,
  height: window.innerHeight
});

const layer = new Konva.Layer();
stage.add(layer);

const shape = new Konva.Circle({
  x: stage.width() / 2,
  y: stage.height() / 2,
  radius: 50,
  fill: 'green'
});
layer.add(shape);

const tr = new Konva.Transformer({
  nodes: [shape]
})
layer.add(tr);


tr.findOne('.rotater').on('mouseenter', () => {
  // "content" property is not documented and private
  // but for now you can use it
  // it is element where transformer is applying its styles
  stage.content.style.cursor = 'move';
});

<script src="https://unpkg.com/konva@^8/konva.min.js"></script>
<div id="container"></div>