@syncfusion/ej2-image-editor 26.1.41 → 26.2.4

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

@@ -9099,6 +9099,10 @@ var Selection = /** @__PURE__ @class */ (function () {
                 return;
             }
             var actObj = extend({}, obj[i], {}, true);
+            if (actObj.activePoint.width === 0 && actObj.activePoint.height === 0) {
+                obj.splice(i, 1);
+                return;
+            }
             this.cursorTargetId = actObj.currIndex;
             if (actObj.shape === 'line' || actObj.shape === 'arrow') {
                 this.setCursorForLineArrow(actObj, x, y, upperCanvas);
@@ -11688,7 +11692,6 @@ var Selection = /** @__PURE__ @class */ (function () {
                         var tempObj = extend({}, parent.objColl[parent.objColl.length - 1], {}, true);
                         parent.objColl.pop();
                         this.redrawShape(tempObj);
-                        parent.objColl.push(tempObj);
                         this.tempObjColl = undefined;
                     }
                     if (!this.isFhdEditing) {
@@ -18683,7 +18686,8 @@ var Transform = /** @__PURE__ @class */ (function () {
             if (freehandObj['bool']) {
                 parent.notify('toolbar', { prop: 'destroy-qa-toolbar', onPropertyChange: false });
             }
-            if (parent.activeObj.shape !== undefined) {
+            var actPoint = extend({}, parent.activeObj.activePoint, {}, true);
+            if (parent.activeObj.shape && (actPoint.width !== 0 || actPoint.height !== 0)) {
                 isActiveObj = true;
                 if (parent.textArea.style.display === 'block' || parent.textArea.style.display === 'inline-block') {
                     parent.notify('shape', { prop: 'redrawActObj', onPropertyChange: false,
@@ -22989,7 +22993,12 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
      * @returns {void}.
      */
     ImageEditor.prototype.updateArrow = function (type, id) {
+        var isObjPushed = false;
+        var collLength = this.objColl.length;
         this.notify('shape', { prop: 'pushActItemIntoObj' });
+        if (collLength !== this.objColl.length) {
+            isObjPushed = true;
+        }
         var prevCropObj = extend({}, this.cropObj, {}, true);
         var object = { currObj: {} };
         var objt = { shapeSettingsObj: {} };
@@ -23000,7 +23009,9 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         prevObj.objColl = extend([], this.objColl, [], true);
         prevObj.pointColl = extend([], this.pointColl, [], true);
         prevObj.afterCropActions = extend([], this.afterCropActions, [], true);
-        this.objColl.pop();
+        if (isObjPushed) {
+            this.objColl.pop();
+        }
         if (type === 'startArrow') {
             this.activeObj.start = this.getTextFromId(id);
         }
@@ -23044,7 +23055,12 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
      */
     ImageEditor.prototype.updateFontFamily = function (id) {
         this.notify('selection', { prop: 'setInitialTextEdit', value: { bool: false } });
+        var isObjPushed = false;
+        var collLength = this.objColl.length;
         this.notify('shape', { prop: 'pushActItemIntoObj' });
+        if (collLength !== this.objColl.length) {
+            isObjPushed = true;
+        }
         var objColl = extend([], this.objColl, [], true);
         var prevCropObj = extend({}, this.cropObj, {}, true);
         var objt = { shapeSettingsObj: {} };
@@ -23060,7 +23076,9 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         this.notify('freehand-draw', { prop: 'getSelPointColl', onPropertyChange: false,
             value: { obj: selPointCollObj } });
         prevObj.selPointColl = extend([], selPointCollObj['selPointColl'], [], true);
-        this.objColl.pop();
+        if (isObjPushed) {
+            this.objColl.pop();
+        }
         if (this.textArea.style.display === 'block' || this.textArea.style.display === 'inline-block') {
             this.notify('shape', { prop: 'updateFontRatio', onPropertyChange: false,
                 value: { obj: this.activeObj, isTextArea: true } });
@@ -23120,7 +23138,12 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
     ImageEditor.prototype.updateFontSize = function (text) {
         var itemText = text;
         this.notify('selection', { prop: 'setInitialTextEdit', value: { bool: false } });
+        var isObjPushed = false;
+        var collLength = this.objColl.length;
         this.notify('shape', { prop: 'pushActItemIntoObj' });
+        if (collLength !== this.objColl.length) {
+            isObjPushed = true;
+        }
         var prevCropObj = extend({}, this.cropObj, {}, true);
         var objt = { shapeSettingsObj: {} };
         this.notify('selection', { prop: 'updatePrevShapeSettings', onPropertyChange: false, value: { obj: objt } });
@@ -23135,7 +23158,9 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         this.notify('freehand-draw', { prop: 'getSelPointColl', onPropertyChange: false,
             value: { obj: selPointCollObj } });
         prevObj.selPointColl = extend([], selPointCollObj['selPointColl'], [], true);
-        this.objColl.pop();
+        if (isObjPushed) {
+            this.objColl.pop();
+        }
         if (this.textArea.style.display === 'block' || this.textArea.style.display === 'inline-block') {
             this.notify('shape', { prop: 'updateFontRatio', onPropertyChange: false,
                 value: { obj: this.activeObj, isTextArea: true } });
@@ -23223,7 +23248,12 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
      */
     ImageEditor.prototype.updateFontColor = function (value) {
         this.notify('selection', { prop: 'setInitialTextEdit', value: { bool: false } });
+        var isObjPushed = false;
+        var collLength = this.objColl.length;
         this.notify('shape', { prop: 'pushActItemIntoObj' });
+        if (collLength !== this.objColl.length) {
+            isObjPushed = true;
+        }
         var prevCropObj = extend({}, this.cropObj, {}, true);
         var objt = { shapeSettingsObj: {} };
         this.notify('selection', { prop: 'updatePrevShapeSettings', onPropertyChange: false, value: { obj: objt } });
@@ -23238,7 +23268,9 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         this.notify('freehand-draw', { prop: 'getSelPointColl', onPropertyChange: false,
             value: { obj: selPointCollObj } });
         prevObj.selPointColl = extend([], selPointCollObj['selPointColl'], [], true);
-        this.objColl.pop();
+        if (isObjPushed) {
+            this.objColl.pop();
+        }
         if (this.textArea.style.display === 'none') {
             this.activeObj.strokeSettings.strokeColor = value;
             this.notify('shape', { prop: 'setStrokeSettings', value: { strokeSettings: null,
@@ -23415,7 +23447,12 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
             var obj = { shapeSettingsObj: {} };
             this.notify('selection', { prop: 'updatePrevShapeSettings', onPropertyChange: false, value: { obj: obj } });
             var shapeSettings = obj['shapeSettingsObj'];
+            var isObjPushed = false;
+            var collLength = this.objColl.length;
             this.notify('shape', { prop: 'pushActItemIntoObj' });
+            if (collLength !== this.objColl.length) {
+                isObjPushed = true;
+            }
             var prevCropObj = extend({}, this.cropObj, {}, true);
             var object = { currObj: {} };
             this.notify('filter', { prop: 'getCurrentObj', onPropertyChange: false, value: { object: object } });
@@ -23427,7 +23464,9 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
             this.notify('freehand-draw', { prop: 'getSelPointColl', onPropertyChange: false,
                 value: { obj: selPointCollObj } });
             prevObj.selPointColl = extend([], selPointCollObj['selPointColl'], [], true);
-            this.objColl.pop();
+            if (isObjPushed) {
+                this.objColl.pop();
+            }
             this.activeObj.strokeSettings.strokeWidth = parseInt(id, 10);
             if (this.activeObj.shape === 'rectangle' || this.activeObj.shape === 'ellipse') {
                 this.activeObj.strokeSettings.strokeWidth = parseInt(id, 10) - 1;
@@ -23469,7 +23508,12 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         var shapeSettings = objt['shapeSettingsObj'];
         if (this.activeObj.shape && (this.activeObj.shape !== 'path' || (this.activeObj.shape === 'path' &&
             this.activeObj.pointColl.length > 0))) {
+            var isObjPushed = false;
+            var collLength = this.objColl.length;
             this.notify('shape', { prop: 'pushActItemIntoObj' });
+            if (collLength !== this.objColl.length) {
+                isObjPushed = true;
+            }
             var prevCropObj = extend({}, this.cropObj, {}, true);
             var object = { currObj: {} };
             this.notify('filter', { prop: 'getCurrentObj', onPropertyChange: false, value: { object: object } });
@@ -23481,7 +23525,9 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
             this.notify('freehand-draw', { prop: 'getSelPointColl', onPropertyChange: false,
                 value: { obj: selPointCollObj } });
             prevObj.selPointColl = extend([], selPointCollObj['selPointColl'], [], true);
-            this.objColl.pop();
+            if (isObjPushed) {
+                this.objColl.pop();
+            }
             this.activeObj.strokeSettings.strokeColor = value;
             this.notify('shape', { prop: 'setStrokeSettings', value: { strokeSettings: null, strokeColor: this.activeObj.strokeSettings.strokeColor, fillColor: null, strokeWidth: null } });
             if (!this.togglePen) {
@@ -23516,7 +23562,12 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         var obj = { shapeSettingsObj: {} };
         this.notify('selection', { prop: 'updatePrevShapeSettings', onPropertyChange: false, value: { obj: obj } });
         var shapeSettings = obj['shapeSettingsObj'];
+        var isObjPushed = false;
+        var collLength = this.objColl.length;
         this.notify('shape', { prop: 'pushActItemIntoObj' });
+        if (collLength !== this.objColl.length) {
+            isObjPushed = true;
+        }
         var prevCropObj = extend({}, this.cropObj, {}, true);
         var object = { currObj: {} };
         this.notify('filter', { prop: 'getCurrentObj', onPropertyChange: false, value: { object: object } });
@@ -23528,7 +23579,9 @@ var ImageEditor = /** @__PURE__ @class */ (function (_super) {
         this.notify('freehand-draw', { prop: 'getSelPointColl', onPropertyChange: false,
             value: { obj: selPointCollObj } });
         prevObj.selPointColl = extend([], selPointCollObj['selPointColl'], [], true);
-        this.objColl.pop();
+        if (isObjPushed) {
+            this.objColl.pop();
+        }
         this.activeObj.strokeSettings.fillColor = value;
         this.notify('shape', { prop: 'setStrokeSettings',
             value: { strokeSettings: null, strokeColor: null, fillColor: this.activeObj.strokeSettings.fillColor,
@@ -27328,6 +27381,15 @@ var ToolbarModule = /** @__PURE__ @class */ (function () {
                     args.toolbarItems = ['fillColor', 'strokeColor', 'strokeWidth', 'z-order', 'duplicate', 'remove'];
                 }
                 this.initShapesToolbarItem(args.toolbarItems);
+                if (parent.activeObj.shape === 'image') {
+                    var actObj = extend({}, parent.activeObj, {}, true);
+                    parent.notify('shape', { prop: 'refreshActiveObj', onPropertyChange: false });
+                    parent.notify('draw', { prop: 'render-image', value: { isMouseWheel: null, isPreventClearRect: null, isFrame: true } });
+                    parent.activeObj = actObj;
+                    parent.notify('draw', { prop: 'drawObject', onPropertyChange: false, value: { canvas: 'duplicate', obj: parent.activeObj,
+                            isCropRatio: null, points: null, isPreventDrag: true } });
+                    this.renderQAT(false);
+                }
                 break;
             case 'text':
                 if (Browser.isDevice) {
@@ -27411,14 +27473,14 @@ var ToolbarModule = /** @__PURE__ @class */ (function () {
                 parent.notify('draw', { prop: 'render-image', value: { isMouseWheel: null, isPreventClearRect: null, isFrame: true } });
                 break;
         }
-        this.currToolbar = type;
         this.refreshDropDownBtn(isCropping);
-        this.updateKBDNavigation(this.currToolbar);
+        this.updateKBDNavigation(type);
+        this.currToolbar = type;
     };
     ToolbarModule.prototype.updateKBDNavigation = function (type) {
         var parent = this.parent;
         var id = parent.element.id;
-        if (!parent.isKBDNavigation) {
+        if (!parent.isKBDNavigation || this.currToolbar === type) {
             return;
         }
         if (this.isToolbar()) {
@@ -29910,8 +29972,10 @@ var ToolbarModule = /** @__PURE__ @class */ (function () {
                 }
                 parent.notify('selection', { prop: 'setSliderActive', onPropertyChange: false, value: { bool: false } });
                 if (type === 'transparency') {
-                    parent.notify('undo-redo', { prop: 'updateUndoRedoStack', onPropertyChange: false });
-                    parent.element.querySelector('#' + parent.element.id + '_transparency').click();
+                    setTimeout(function () {
+                        parent.notify('undo-redo', { prop: 'updateUndoRedoStack', onPropertyChange: false });
+                        parent.element.querySelector('#' + parent.element.id + '_transparency').click();
+                    }, 50);
                 }
             }
         });