How to put a text inside a rect using konva.js?

I have a project with some rects and I need to put text inside them. Is there a Konva class that does this? I have tried using Konva.group (), label ...

This was my last attempt, at the beginning the text stands as it should but when moving the Rect the position is not updated.

var rect = new Konva.Rect({
  x: 20,
  y: 60,
  stroke: '#123456',
  strokeWidth: 5,
  fill: '#ddd',
  width: 600,
  height: 450,
  shadowColor: 'black',
  shadowBlur: 10,
  shadowOffset: [10, 10],
  shadowOpacity: 0.2,
  cornerRadius: 10,
  draggable: true,

})

var complexText = new Konva.Text({
  x: ((rect.attrs.width + rect.attrs.x) - 300)/2 ,
  y: ((rect.attrs.height + rect.attrs.y))/2,
  text:
  "COMPLEX TEXT\n\nAll the world's a stage, and all the men and women merely players. They have their exits and their entrances.",
  fontSize: 18,
  fontFamily: 'Calibri',
  fill: '#555',
  width: 300,
  height:300,
  align: 'center',
  draggable: true,


});

Solution

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

var rectangleLayer = new Konva.Layer();
 
function spawnRectangle(angle){
    var rectangle = new Konva.Group({
        x: 25, 
        y: 25, 
        width: 130,
        height: 25,
        rotation: angle, 
        draggable: true,
    }); 

    rectangle.add(new Konva.Rect({
        width: 130,
        height: 25,
        fill: 'lightblue'
    }));

    rectangle.add(new Konva.Text({
        text:'123',
        fontSize: 18,
        fontFamily: 'Calibri',
        fill: '#000',
        width: 130,
        padding: 5,
        align: 'center'
    }));
    rectangleLayer.add(rectangle);
    stage.add(rectangleLayer);
}

body {
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #D3D3D3;
    background-size: cover;
 }
 
#desc {
    position : absolute;
    top: 5px;
    left: 5px;
}

<script src="https://unpkg.com/[email protected]/konva.min.js"></script>
 
<body>
    <div id="container"></div>
    <div id="desc">
          <button onclick="spawnRectangle(0)">spawn rectangle</button>
          <button onclick="spawnRectangle(90)">spawn rotated rectangle</button>
    </div>
</body>