fix: improve text wrapping in ellipse and alignment (#6172)

* fix: improve text wrapping in ellipse

* compute height when font properties updated

* fix alignment

* fix alignment when resizing

* fix

* ad padding

* always compute height when redrawing bounding box and refactor

* lint

* fix specs

* fix

* redraw text bounding box when pasted or refreshed

* fix

* Add specs

* fix

* restore on font load

* add comments

src/element/textWysiwyg.tsx

@@ -25,6 +25,7 @@ import {
   getApproxLineHeight,
   getBoundTextElementId,
   getBoundTextElementOffset,
+  getContainerCoords,
   getContainerDims,
   getContainerElement,
   getTextElementAngle,
@@ -230,19 +231,22 @@ export const textWysiwyg = ({
         // Start pushing text upward until a diff of 30px (padding)
         // is reached
         else {
+          const padding =
+            container.type === "ellipse"
+              ? 0
+              : getBoundTextElementOffset(updatedTextElement);
+          const containerCoords = getContainerCoords(container);
+
           // vertically center align the text
           if (verticalAlign === VERTICAL_ALIGN.MIDDLE) {
             if (!isArrowElement(container)) {
               coordY =
-                container.y + containerDims.height / 2 - textElementHeight / 2;
+                containerCoords.y + maxHeight / 2 - textElementHeight / 2;
             }
           }
           if (verticalAlign === VERTICAL_ALIGN.BOTTOM) {
             coordY =
-              container.y +
-              containerDims.height -
-              textElementHeight -
-              getBoundTextElementOffset(updatedTextElement);
+              containerCoords.y + (maxHeight - textElementHeight + padding);
           }
         }
       }