@syncfusion/ej2-image-editor 28.1.33 → 28.1.41

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 28.1.33
+*  version : 28.1.41
 *  Copyright Syncfusion Inc. 2001 - 2024. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-image-editor@*",
-  "_id": "@syncfusion/ej2-image-editor@27.1.50",
+  "_id": "@syncfusion/ej2-image-editor@28.1.39",
   "_inBundle": false,
-  "_integrity": "sha512-x622GmMcwomW7xoMMGdKgFdB1aohctBixqEe8Z3X8LB3IbfFNoLR8pnz8tUrucjlDRA4p/cfsudWrnzXBfMiMg==",
+  "_integrity": "sha512-xQHF72FchEUkyjfMwpG53hkesJSw5EjMiWnEsn1Ipr9nknumGsGvToRt3ld1YqOlb5WpNXmvzVoCJdmggI5eBg==",
   "_location": "/@syncfusion/ej2-image-editor",
   "_phantomChildren": {},
   "_requested": {
@@ -23,8 +23,8 @@
     "/@syncfusion/ej2-react-image-editor",
     "/@syncfusion/ej2-vue-image-editor"
   ],
-  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-release/@syncfusion/ej2-image-editor/-/ej2-image-editor-27.1.50.tgz",
-  "_shasum": "ed81a3b2eaa472e18ce7b776307ce73d73332a94",
+  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-image-editor/-/ej2-image-editor-28.1.39.tgz",
+  "_shasum": "ffd308de5770a4ef97575c825f1ab3aac82b61d1",
   "_spec": "@syncfusion/ej2-image-editor@*",
   "_where": "/jenkins/workspace/elease-automation_release_28.1.1/packages/included",
   "author": {
@@ -33,12 +33,12 @@
   "bundleDependencies": false,
   "dependencies": {
     "@syncfusion/ej2-base": "~28.1.33",
-    "@syncfusion/ej2-buttons": "~28.1.33",
-    "@syncfusion/ej2-dropdowns": "~28.1.33",
-    "@syncfusion/ej2-inputs": "~28.1.33",
-    "@syncfusion/ej2-navigations": "~28.1.33",
-    "@syncfusion/ej2-popups": "~28.1.33",
-    "@syncfusion/ej2-splitbuttons": "~28.1.33"
+    "@syncfusion/ej2-buttons": "~28.1.39",
+    "@syncfusion/ej2-dropdowns": "~28.1.41",
+    "@syncfusion/ej2-inputs": "~28.1.41",
+    "@syncfusion/ej2-navigations": "~28.1.41",
+    "@syncfusion/ej2-popups": "~28.1.39",
+    "@syncfusion/ej2-splitbuttons": "~28.1.41"
   },
   "deprecated": false,
   "description": "Essential JS 2 ImageEditor",
@@ -68,7 +68,7 @@
     "url": "https://github.com/syncfusion/ej2-javascript-ui-controls/tree/master/controls/imageeditor"
   },
   "typings": "index.d.ts",
-  "version": "28.1.33",
+  "version": "28.1.41",
   "sideEffects": false,
   "homepage": "https://www.syncfusion.com/javascript-ui-controls"
 }

package/src/image-editor/action/draw.js

@@ -4039,14 +4039,16 @@ var Draw = /** @class */ (function () {
             this.openImageData(dropArea);
             return;
         }
-        var fileType = this.getFileExtensionFromURL(this.openURL).toLowerCase();
+        var fileType = this.getFileExtensionFromURL(this.openURL);
         if (fileType) {
+            fileType = fileType.toLowerCase();
             fileType = (fileType === 'jpg' || fileType === 'jpeg') ? 'jpeg' : fileType;
         }
         var isAllowedFileType = (fileType ? (extension.indexOf(fileType) > -1 ||
             (fileType === 'jpeg' && (parent.uploadSettings.allowedExtensions.indexOf('jpg') > -1 ||
                 parent.uploadSettings.allowedExtensions.indexOf('jpeg') > -1))) : false) || this.isNullExtension;
-        if (this.openURL.indexOf('data:image/') > -1 && this.openURL.indexOf('base64') > -1) {
+        if ((this.openURL.indexOf('data:image/') > -1 && this.openURL.indexOf('base64') > -1) ||
+            this.openURL.indexOf('blob') > -1) {
             this.openImageData(dropArea, true);
         }
         else if (parent.uploadSettings.minFileSize || parent.uploadSettings.maxFileSize) {

package/src/image-editor/base/image-editor.js

@@ -576,7 +576,7 @@ var ImageEditor = /** @class */ (function (_super) {
             this.notify('toolbar', { prop: 'create-contextual-toolbar', onPropertyChange: false });
         }
         if (!this.uploadSettings.allowedExtensions) {
-            this.uploadSettings.allowedExtensions = '.jpg, .jpeg, .png, .svg, .webp';
+            this.setProperties({ uploadSettings: { allowedExtensions: '.jpg, .jpeg, .png, .svg, .webp' } }, true);
         }
         else {
             this.notify('draw', { prop: 'setNullExtension', value: { extension: false } });

package/src/image-editor/renderer/toolbar.js

@@ -1197,9 +1197,12 @@ var ToolbarModule = /** @class */ (function () {
             this.parent.notify('draw', { prop: 'fileSelect', value: { inputElement: inputElement, args: args } });
         }
         else {
-            if (!this.parent.isImageLoaded && !Browser.isDevice) {
+            if (!this.parent.isImageLoaded) {
                 this.destroyTopToolbar();
                 this.createToolbar();
+                if (Browser.isDevice) {
+                    this.destroyBottomToolbar();
+                }
             }
             this.parent.showDialogPopup('unsupported', !((filesTypes.indexOf(type) > -1 || isJPG || (type.indexOf('svg') > -1 && filesTypes.indexOf('svg') > -1))));
         }

package/styles/bds-lite.css

@@ -786,6 +786,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: var(--color-sf-border-secondary);
 }

package/styles/bds.css

@@ -786,6 +786,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: var(--color-sf-border-secondary);
 }

package/styles/bootstrap-dark-lite.css

@@ -673,6 +673,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #959595;
 }

package/styles/bootstrap-dark.css

@@ -673,6 +673,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #959595;
 }

package/styles/bootstrap-lite.css

@@ -674,6 +674,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #e6e6e6;
 }

package/styles/bootstrap.css

@@ -674,6 +674,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #e6e6e6;
 }

package/styles/bootstrap4-lite.css

@@ -672,6 +672,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #e9ecef;
 }

package/styles/bootstrap4.css

@@ -672,6 +672,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #e9ecef;
 }

package/styles/bootstrap5-dark-lite.css

@@ -679,6 +679,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #444c54;
 }

package/styles/bootstrap5-dark.css

@@ -679,6 +679,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #444c54;
 }

package/styles/bootstrap5-lite.css

@@ -679,6 +679,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #dee2e6;
 }

package/styles/bootstrap5.3-lite.css

@@ -683,6 +683,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: var(--color-sf-border-light);
 }

package/styles/bootstrap5.3.css

@@ -683,6 +683,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: var(--color-sf-border-light);
 }

package/styles/bootstrap5.css

@@ -679,6 +679,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #dee2e6;
 }

package/styles/fabric-dark-lite.css

@@ -675,6 +675,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #201f1f;
 }

package/styles/fabric-dark.css

@@ -675,6 +675,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #201f1f;
 }

package/styles/fabric-lite.css

@@ -677,6 +677,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #fff;
 }

package/styles/fabric.css

@@ -677,6 +677,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #fff;
 }

package/styles/fluent-dark-lite.css

@@ -682,6 +682,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #201f1e;
 }

package/styles/fluent-dark.css

@@ -682,6 +682,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #201f1e;
 }

package/styles/fluent-lite.css

@@ -682,6 +682,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #faf9f8;
 }

package/styles/fluent.css

@@ -682,6 +682,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #faf9f8;
 }

package/styles/fluent2-lite.css

@@ -705,6 +705,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: var(--color-sf-content-bg-color-alt1);
 }

package/styles/fluent2.css

@@ -705,6 +705,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: var(--color-sf-content-bg-color-alt1);
 }

package/styles/highcontrast-light-lite.css

@@ -672,6 +672,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #fff;
 }

package/styles/highcontrast-light.css

@@ -672,6 +672,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #fff;
 }

package/styles/highcontrast-lite.css

@@ -680,6 +680,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #000;
 }

package/styles/highcontrast.css

@@ -680,6 +680,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #000;
 }

package/styles/image-editor/_layout.scss

@@ -444,7 +444,7 @@
     @if $skin-name == 'Material3' {
       top: calc(50% - 11px) !important; /* stylelint-disable-line declaration-no-important */
     }
-    @else if $skin-name == 'tailwind' {
+    @else if $skin-name == 'tailwind' or $skin-name == 'tailwind3' {
       top: calc(50% - 12px) !important; /* stylelint-disable-line declaration-no-important */
     }
     @else {
@@ -809,4 +809,8 @@
   .e-device.e-image-editor .e-contextual-toolbar-wrapper .e-ie-finetune-value-span {
     margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
   }
+
+  .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+    top: calc(50% + 60px);
+  }
 }

package/styles/image-editor/_tailwind3-definition.scss

@@ -4,8 +4,8 @@ $image-editor-toolbar-icon-color: $icon-color !default;
 $img-editor-cp-preview-border-bottom-color: $black !default;
 $image-editor-icon-sel-bg-color: $secondary-bg-color-focus !default;
 $image-editor-ddbtn-margin-top: -1px !default;
-$image-editor-tbar-height: 40px !default;
-$image-editor-bigger-tbar-height: 46px !default;
+$image-editor-tbar-height: 48px !default;
+$image-editor-bigger-tbar-height: 56px !default;
 $image-editor-tbar-btn-fontsize: $text-base !default;
 $image-editor-bigger-tbar-btn-fontsize: $text-xl !default;
 $image-editor-contextual-toolbar: $content-bg-color-alt1 !default;
@@ -14,9 +14,9 @@ $image-editor-dropdown-btn-preview-top: -4px !default;
 $image-editor-dropdown-btn-preview-left: -4px !default;
 $image-editor-bigger-dropdown-btn-preview-top: -4px !default;
 $image-editor-bigger-dropdown-btn-preview-left: -4px !default;
-$image-editor-slider-handler: calc(50% - 5px) !default;
-$image-editor-bigger-slider-handler: calc(50% - 6px) !default;
-$image-editor-device-slider-handler: calc(50% - 8px) !default;
+$image-editor-slider-handler: calc(50% - 6px) !default;
+$image-editor-bigger-slider-handler: calc(50% - 8px) !default;
+$image-editor-device-slider-handler: calc(50% - 10px) !default;
 $image-editor-finetune-value-span: 29% !default;
 $image-editor-finetune-span: 29% !default;
 $image-editor-button-label: 13px !default;

package/styles/image-editor/bds.css

@@ -786,6 +786,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: var(--color-sf-border-secondary);
 }

package/styles/image-editor/bootstrap-dark.css

@@ -673,6 +673,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #959595;
 }

package/styles/image-editor/bootstrap.css

@@ -674,6 +674,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #e6e6e6;
 }

package/styles/image-editor/bootstrap4.css

@@ -672,6 +672,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #e9ecef;
 }

package/styles/image-editor/bootstrap5-dark.css

@@ -679,6 +679,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #444c54;
 }

package/styles/image-editor/bootstrap5.3.css

@@ -683,6 +683,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: var(--color-sf-border-light);
 }

package/styles/image-editor/bootstrap5.css

@@ -679,6 +679,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #dee2e6;
 }

package/styles/image-editor/fabric-dark.css

@@ -675,6 +675,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #201f1f;
 }

package/styles/image-editor/fabric.css

@@ -677,6 +677,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #fff;
 }

package/styles/image-editor/fluent-dark.css

@@ -682,6 +682,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #201f1e;
 }

package/styles/image-editor/fluent.css

@@ -682,6 +682,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #faf9f8;
 }

package/styles/image-editor/fluent2.css

@@ -705,6 +705,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: var(--color-sf-content-bg-color-alt1);
 }

package/styles/image-editor/highcontrast-light.css

@@ -672,6 +672,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #fff;
 }

package/styles/image-editor/highcontrast.css

@@ -680,6 +680,10 @@
   margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
 }
 
+.e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
+  top: calc(50% + 60px);
+}
+
 .e-image-editor {
   background: #000;
 }