How can I wrap words in g6-react-node <Text> like CSS word-wrap

Question

When create a custom node using g6-react-node in antv/g6, how can I break text lines to multiple lines when it's exceed the max width of node like CSS word-wrap?

I hope someone can help me on this. Thank you.

This is the custom node layout what I have tried.

<Group>
 <Rect
  style={{
   width: 100,
   height: 70, 
   fill: 'l(0) 0:#D67200 1:#FABD55',
   radius: 6,
  }}
 >
  <Text 
   style={{
    fill: "#FFF", 
    maxWidth: 100, 
    display: 'flex',
    flexWrap: 'wrap'
   }} 
  >
  {label}
  </Text>
 </Rect>
</Group>

This is my current output. enter image description here