@syncfusion/ej2-image-editor 31.1.22 → 31.2.5

package/dist/es6/ej2-image-editor.es2015.js

@@ -12223,6 +12223,29 @@ class Selection {
         const cursor = parent.activeObj.shape && parent.activeObj.shape === 'text' ?
             parent.cursor : 'default';
         const tempCursor = parent.upperCanvas.style.cursor;
+        const textArea = document.querySelector('#' + parent.element.id + '_textArea');
+        if (textArea.style.display === 'block' || textArea.style.display === 'inline-block') {
+            let isShapeUnderCursor = false;
+            for (let i = 0; i < parent.objColl.length; i++) {
+                const actObj = parent.objColl[i];
+                if (actObj && actObj.shape && actObj.activePoint) {
+                    const activePoint = actObj.activePoint;
+                    const startX = activePoint.startX;
+                    const startY = activePoint.startY;
+                    const endX = activePoint.endX;
+                    const endY = activePoint.endY;
+                    const radius = actObj.topLeftCircle && actObj.topLeftCircle.radius ? actObj.topLeftCircle.radius : 0;
+                    let isCursorWithinBounds = (x >= (startX - (radius * 2)) && x <= (endX + (radius * 2)) &&
+                        y >= (startY - (radius * 2)) && y <= (endY + (radius * 2)));
+                    if (isCursorWithinBounds) {
+                        isShapeUnderCursor = true;
+                    }
+                }
+            }
+            if (isShapeUnderCursor) {
+                parent.okBtn();
+            }
+        }
         if (parent.isResize) {
             this.performEnterAction(e);
             parent.upperCanvas.style.cursor = 'default';
@@ -14659,6 +14682,7 @@ class Shape {
         this.keyHistory = ''; // text history
         this.preventFrameAnnotation = false;
         this.redactType = 'blur';
+        this.isPublicUpdateShape = false;
         this.parent = parent;
         this.addEventListener();
     }
@@ -14932,6 +14956,9 @@ class Shape {
             case 'setRedactType':
                 this.redactType = args.value['redactType'];
                 break;
+            case 'setPublicUpdateShape':
+                this.isPublicUpdateShape = args.value['isPublicUpdateShape'];
+                break;
         }
     }
     getModuleName() {
@@ -14958,7 +14985,7 @@ class Shape {
         this.textSettings =
             { text: 'Enter Text', fontFamily: this.parent.fontFamily.default, fontSize: null, fontRatio: null, bold: false, italic: false, underline: false, strikethrough: false };
         this.strokeSettings = { strokeColor: '#fff', fillColor: '', strokeWidth: null, radius: null, outlineColor: '', outlineWidth: null };
-        this.preventFrameAnnotation = false;
+        this.preventFrameAnnotation = this.isPublicUpdateShape = false;
     }
     drawEllipse(x, y, radiusX, radiusY, strokeWidth, strokeColor, fillColor, degree, isSelected) {
         this.initializeShape('ellipse');
@@ -15670,7 +15697,7 @@ class Shape {
         }
         parent.notify('selection', { prop: 'setTextSelection', onPropertyChange: false,
             value: { width: width, height: height } });
-        if (parent.activeObj.rotatedAngle !== 0) {
+        if (parent.activeObj.rotatedAngle !== 0 && !this.isPublicUpdateShape) {
             const width = parent.activeObj.activePoint.width - tempActiveObj.activePoint.width;
             const height = parent.activeObj.activePoint.height - tempActiveObj.activePoint.height;
             let value = '';
@@ -15689,6 +15716,20 @@ class Shape {
             parent.notify('shape', { prop: 'updateFontSize', onPropertyChange: false,
                 value: { obj: parent.activeObj } });
         }
+        else if (this.isPublicUpdateShape) {
+            const width = parent.activeObj.activePoint.width - tempActiveObj.activePoint.width;
+            const height = parent.activeObj.activePoint.height - tempActiveObj.activePoint.height;
+            let value = '';
+            if (parent.transform.degree === 0 || parent.transform.degree === 180) {
+                value = 'width';
+            }
+            else if (parent.transform.degree === 90 || parent.transform.degree === 270) {
+                value = 'height';
+            }
+            parent.activeObj.activePoint = extend({}, tempActiveObj.activePoint, {}, true);
+            parent.notify('selection', { prop: 'adjustRotationPoints', onPropertyChange: false, value: { rectangle: parent.activeObj.activePoint,
+                    x: width, y: height, angle: parent.activeObj.rotatedAngle, type: 'text', elem: value } });
+        }
         parent.notify('draw', { prop: 'updateActiveObject', onPropertyChange: false, value: { actPoint: parent.activeObj.activePoint, obj: parent.activeObj,
                 isMouseMove: null, x: null, y: null } });
         this.updImgRatioForActObj();
@@ -24112,6 +24153,9 @@ let ImageEditor = ImageEditor_1 = class ImageEditor extends Component {
      *
      */
     updateShape(setting, isSelected) {
+        if (setting.type.toLowerCase() === 'text') {
+            this.notify('shape', { prop: 'setPublicUpdateShape', onPropertyChange: false, value: { isPublicUpdateShape: true } });
+        }
         const obj = { isSelected: false };
         let isTextArea = false;
         const freehandObj = { bool: false };
@@ -24183,6 +24227,9 @@ let ImageEditor = ImageEditor_1 = class ImageEditor extends Component {
                 }
             }
         }
+        if (setting.type.toLowerCase() === 'text') {
+            this.notify('shape', { prop: 'setPublicUpdateShape', onPropertyChange: false, value: { isPublicUpdateShape: false } });
+        }
         return obj['isSelected'];
     }
     /**