Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@syncfusion/ej2-image-editor

Package Overview
Dependencies
Maintainers
3
Versions
76
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@syncfusion/ej2-image-editor - npm Package Compare versions

Comparing version 24.2.8 to 25.1.35

styles/image-editor/_bds-definition.scss

54

CHANGELOG.md

@@ -9,6 +9,4 @@ # Changelog

- `#I555243` - The issue with "Text area not applied while using GetImageData method" has been resolved.
- The issue with "Resizing event argument value not proper while resizing " has been resolved.
## 24.2.5 (2024-02-13)
### Image Editor

@@ -18,8 +16,4 @@

- The issue with "Shape Settings not updated properly for annotations" has been resolved.
- `#I555243` - The issue with "Text area not applied while using GetImageData method" has been resolved.
- `#I550096` - The issue with "The Image Editor rendered over a dialog, reloads the page while selecting the browse here content of the image editor" has been resolved.
## 24.2.4 (2024-02-06)
### Image Editor

@@ -29,46 +23,4 @@

- The issue with "Undo redo not proper with annotations and frame" has been resolved.
- Issue with "Toolbar not refreshing while using select public method" has been resolved.
- The issue with "Toolbar updating event argument values are not updated properly" has been resolved.
- The issue with "Text area is unable to deselect while placing an external text area with Image Editor" has been resolved.
- The issue with "Slider mouse up event not proper" has been resolved.
## 24.1.46 (2024-01-17)
### Image Editor
#### Bug Fixes
- The issue with "Zoom events not triggered while using Zoom method" has been resolved.
- The issue with "Ratio Selection dimension not proper" has been resolved.
- The issue with "Get Shape Settings method returns duplicate shape id" has been resolved.
## 24.1.45 (2024-01-09)
### Image Editor
#### Bug Fixes
- The issue with "Image alignment while cancelling contextual toolbar" has been resolved.
## 24.1.44 (2024-01-03)
### Image Editor
#### Bug Fixes
- The issue with "Image alignment issue in rotated state" has been resolved.
## 24.1.43 (2023-12-27)
### Image Editor
#### Bug Fixes
- `#I531361` - The issue with "Zoom toolbar button not shown in ImageEditor while using ZoomSettings property in MVC platform" has been resolved.
## 24.1.41 (2023-12-18)

@@ -75,0 +27,0 @@

/*!
* filename: index.d.ts
* version : 24.2.8
* version : 25.1.35
* Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.

@@ -5,0 +5,0 @@ * Use of this code is subject to the terms of our license.

{
"_from": "@syncfusion/ej2-image-editor@*",
"_id": "@syncfusion/ej2-image-editor@24.2.5",
"_id": "@syncfusion/ej2-image-editor@23.1.39",
"_inBundle": false,
"_integrity": "sha512-HL71/r90EJJh5CG9XlV11LJ6co+jnhvw1gvx+KaOA2CJuBdtjEoWdwY1yOyb8mTrutqV2/7i2Bg8hA0890GxFw==",
"_integrity": "sha512-Bdm3mWoAozafsWzcwq/tVWXF5iazfTB4cNKx2CpLf8lgCwTIBF99Dhb44pQWnbmLi3n3iJQh1XO2cr19ZeAjEA==",
"_location": "/@syncfusion/ej2-image-editor",

@@ -26,6 +26,6 @@ "_phantomChildren": {},

],
"_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-image-editor/-/ej2-image-editor-24.2.5.tgz",
"_shasum": "d0df1fb621600b316772fa681cbea96a24fcee5a",
"_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-release/@syncfusion/ej2-image-editor/-/ej2-image-editor-23.1.39.tgz",
"_shasum": "5bb6d65f3282fb4af0523a82d81f9c0d54121e8f",
"_spec": "@syncfusion/ej2-image-editor@*",
"_where": "/jenkins/workspace/elease-automation_release_24.1.1/packages/included",
"_where": "/jenkins/workspace/elease-automation_release_25.1.1/packages/included",
"author": {

@@ -36,8 +36,8 @@ "name": "Syncfusion Inc."

"dependencies": {
"@syncfusion/ej2-base": "~24.2.7",
"@syncfusion/ej2-buttons": "~24.2.7",
"@syncfusion/ej2-inputs": "~24.2.7",
"@syncfusion/ej2-navigations": "~24.2.8",
"@syncfusion/ej2-popups": "~24.2.8",
"@syncfusion/ej2-splitbuttons": "~24.2.7"
"@syncfusion/ej2-base": "~25.1.35",
"@syncfusion/ej2-buttons": "~25.1.35",
"@syncfusion/ej2-inputs": "~25.1.35",
"@syncfusion/ej2-navigations": "~25.1.35",
"@syncfusion/ej2-popups": "~25.1.35",
"@syncfusion/ej2-splitbuttons": "~25.1.35"
},

@@ -72,5 +72,5 @@ "deprecated": false,

"typings": "index.d.ts",
"version": "24.2.8",
"version": "25.1.35",
"sideEffects": false,
"homepage": "https://www.syncfusion.com/javascript-ui-controls"
}

@@ -1,2 +0,2 @@

import { Browser, extend, isBlazor, isNullOrUndefined } from '@syncfusion/ej2-base';
import { Browser, extend, isNullOrUndefined } from '@syncfusion/ej2-base';
var Crop = /** @class */ (function () {

@@ -848,8 +848,7 @@ function Crop(parent) {

Crop.prototype.crop = function (obj) {
var _this = this;
var parent = this.parent;
var _a = parent.activeObj.activePoint, startX = _a.startX, startY = _a.startY, endX = _a.endX, endY = _a.endY;
if (!parent.disabled && parent.isImageLoaded) {
var object_1 = { isCropToolbar: parent.isCropToolbar };
if (parent.currObjType.isUndoAction && !object_1['isCropToolbar']) {
var object = { isCropToolbar: parent.isCropToolbar };
if (parent.currObjType.isUndoAction && !object['isCropToolbar']) {
parent.notify('undo-redo', { prop: 'refreshUrc', value: { bool: null } });

@@ -859,21 +858,6 @@ }

endPoint: { x: endX, y: endY }, preventScaling: false };
if (!object_1['isCropToolbar'] && isBlazor() && parent.events && parent.events.cropping.hasDelegate === true) {
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
if (parent.currentToolbar === 'resize-toolbar') {
parent.dotNetRef.invokeMethodAsync('CropEventAsync', 'OnCrop', transitionArgs, null);
this.cropEvent(transitionArgs, obj, object_1);
}
else {
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
parent.dotNetRef.invokeMethodAsync('CropEventAsync', 'OnCrop', transitionArgs, null).then(function (args) {
_this.cropEvent(args, obj, object_1);
});
}
if (!object['isCropToolbar']) {
parent.trigger('cropping', transitionArgs);
}
else {
if (!object_1['isCropToolbar']) {
parent.trigger('cropping', transitionArgs);
}
this.cropEvent(transitionArgs, obj, object_1);
}
this.cropEvent(transitionArgs, obj, object);
}

@@ -913,12 +897,6 @@ };

parent.notify('draw', { prop: 'render-image', value: { isMouseWheel: false } });
if (!isBlazor() && !object['isCropToolbar'] && (isNullOrUndefined(aspectIcon) && isNullOrUndefined(nonAspectIcon))) {
if (!object['isCropToolbar'] && (isNullOrUndefined(aspectIcon) && isNullOrUndefined(nonAspectIcon))) {
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'main',
isApplyBtn: false, isCropping: false, isZooming: null, cType: null } });
}
else if (!object['isCropToolbar']) {
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
if (parent.currentToolbar !== 'resize-toolbar') {
parent.updateToolbar(parent.element, 'imageLoaded');
}
}
this.resizeWrapper();

@@ -928,7 +906,2 @@ if (Browser.isDevice) {

}
transitionArgs = { startPoint: transitionArgs.startPoint, endPoint: transitionArgs.endPoint };
if (!object['isCropToolbar'] && isBlazor() && parent.events && parent.events.cropped.hasDelegate === true) {
parent.dotNetRef.invokeMethodAsync('CropEventAsync', 'Cropped', null, transitionArgs);
}
else { }
}

@@ -952,6 +925,6 @@ }

var parent = this.parent;
if (Browser.isDevice && !isBlazor()) {
if (Browser.isDevice) {
var elem = parent.element;
var ctxToolbar = elem.querySelector('#' + elem.id + '_contextualToolbarArea');
if (ctxToolbar.style.position === '' && !this.isTransformCrop) {
if (ctxToolbar && ctxToolbar.style.position === '' && !this.isTransformCrop) {
ctxToolbar.style.position = 'absolute';

@@ -963,11 +936,2 @@ parent.isStraightening = false;

}
else if (Browser.isDevice && isBlazor() && !this.isTransformCrop) {
parent.isStraightening = false;
parent.update();
var canvasWrapper = parent.element.querySelector('#' + parent.element.id + '_canvasWrapper');
if (canvasWrapper) {
canvasWrapper.style.height = (parseInt(canvasWrapper.style.height) + 2) + 'px';
}
parent.notify('filter', { prop: 'setAdjustmentValue', value: { adjustmentValue: parent.canvasFilter } });
}
};

@@ -974,0 +938,0 @@ Crop.prototype.calcRatio = function (obj, dimension) {

@@ -1,2 +0,2 @@

import { extend, isBlazor, isNullOrUndefined } from '@syncfusion/ej2-base';
import { extend, isNullOrUndefined } from '@syncfusion/ej2-base';
import { hideSpinner, showSpinner } from '@syncfusion/ej2-popups';

@@ -23,13 +23,3 @@ var Export = /** @class */ (function () {

Export.prototype.export = function (args) {
if (isBlazor()) {
var obj = { shape: '' };
this.parent.notify('selection', { prop: 'getCurrentDrawingShape', onPropertyChange: false, value: { obj: obj } });
if (obj['shape'] !== '') {
this.parent.notify('selection', { prop: 'setCurrentDrawingShape', onPropertyChange: false, value: { value: '' } });
this.parent.notify('shape', { prop: 'refreshActiveObj', onPropertyChange: false });
}
}
else {
this.parent.notify('toolbar', { prop: 'refreshShapeDrawing', onPropertyChange: false });
}
this.parent.notify('toolbar', { prop: 'refreshShapeDrawing', onPropertyChange: false });
this.updatePvtVar();

@@ -61,3 +51,2 @@ switch (args.prop) {

Export.prototype.exportImg = function (type, fileName) {
var _this = this;
var parent = this.parent;

@@ -89,12 +78,4 @@ var obj = { fileName: '' };

fileType: type };
if (isBlazor() && parent.events && parent.events.saving.hasDelegate === true) {
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
parent.dotNetRef.invokeMethodAsync('BeforeSaveEventAsync', 'BeforeSave', beforeSave).then(function (beforeSave) {
_this.beforeSaveEvent(beforeSave, type, fileName, imageName);
});
}
else {
parent.trigger('beforeSave', beforeSave);
this.beforeSaveEvent(beforeSave, type, fileName, imageName);
}
parent.trigger('beforeSave', beforeSave);
this.beforeSaveEvent(beforeSave, type, fileName, imageName);
}

@@ -117,5 +98,3 @@ };

parent.trigger('saved', saved);
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
}
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
parent.lowerCanvas.style.left = parent.upperCanvas.style.left = '';

@@ -190,11 +169,3 @@ parent.lowerCanvas.style.top = parent.upperCanvas.style.top = '';

parent.notify('undo-redo', { prop: 'setPreventUR', value: { bool: true } });
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'resizeClick', value: { bool: false } });
}
else {
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
parent.performResizeClick();
}
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
parent.currentToolbar = 'resize-toolbar';
parent.notify('toolbar', { prop: 'resizeClick', value: { bool: false } });
parent.okBtn();

@@ -201,0 +172,0 @@ if (parent.transform.degree % 90 === 0 && parent.transform.degree % 180 !== 0) {

@@ -1,2 +0,2 @@

import { EventHandler, extend, isBlazor, isNullOrUndefined } from '@syncfusion/ej2-base';
import { EventHandler, extend, isNullOrUndefined } from '@syncfusion/ej2-base';
import { ShapeType } from '../index';

@@ -630,11 +630,7 @@ var FreehandDrawing = /** @class */ (function () {

}
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'setSelectedFreehandColor', value: { color: '#42a5f5' } });
}
parent.notify('toolbar', { prop: 'setSelectedFreehandColor', value: { color: '#42a5f5' } });
this.upperContext.clearRect(0, 0, parent.upperCanvas.width, parent.upperCanvas.height);
this.lowerContext.clearRect(0, 0, parent.lowerCanvas.width, parent.lowerCanvas.height);
parent.notify('draw', { prop: 'render-image', value: { isMouseWheel: null } });
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
}
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
if (selectedPoint) {

@@ -650,5 +646,3 @@ selectedPoint.isSelected = false;

var selectedPoint = parent.pointColl[this.fhdSelIdx];
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'setSelectedFreehandColor', value: { color: '#42a5f5' } });
}
parent.notify('toolbar', { prop: 'setSelectedFreehandColor', value: { color: '#42a5f5' } });
this.upperContext.clearRect(0, 0, parent.upperCanvas.width, parent.upperCanvas.height);

@@ -668,8 +662,3 @@ this.lowerContext.clearRect(0, 0, parent.upperCanvas.width, parent.upperCanvas.height);

parent.notify('draw', { prop: 'render-image', value: { isMouseWheel: null } });
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
}
else {
parent.updateToolbar(parent.element, 'imageLoaded');
}
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
};

@@ -712,6 +701,2 @@ FreehandDrawing.prototype.selectFhd = function (index) {

}
if (isBlazor()) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
parent.getShapeValue('pen');
}
};

@@ -751,5 +736,3 @@ FreehandDrawing.prototype.deleteFhd = function (index, isId) {

parent.notify('draw', { prop: 'render-image', value: { isMouseWheel: null } });
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
}
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
}

@@ -1094,9 +1077,4 @@ };

}
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'pen',
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
}
else {
parent.updateToolbar(parent.element, 'pen');
}
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'pen',
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
}

@@ -1106,9 +1084,4 @@ else {

parent.notify('shape', { prop: 'apply', onPropertyChange: false, value: { shape: null, obj: null, canvas: null } });
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
parent.notify('toolbar', { prop: 'setCurrentToolbar', value: { type: 'main' } });
}
else {
parent.updateToolbar(parent.element, 'imageLoaded');
}
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
parent.notify('toolbar', { prop: 'setCurrentToolbar', value: { type: 'main' } });
parent.notify('selection', { prop: 'setFreehandDrawCustomized', value: { isFreehandDrawCustomized: false } });

@@ -1149,49 +1122,22 @@ }

FreehandDrawing.prototype.triggerShapeChanging = function (shapeChangingArgs) {
var _this = this;
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
var parent = this.parent;
var point = parent.pointColl[this.fhdSelIdx];
if (isBlazor() && parent.events && parent.events.shapeChanging.hasDelegate === true) {
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
parent.dotNetRef.invokeMethodAsync('ShapeEventAsync', 'OnShape', shapeChangingArgs, null).then(function (shapeChangingArgs) {
_this.penStrokeWidth = shapeChangingArgs.currentShapeSettings.strokeWidth;
if (parent.activeObj.strokeSettings.strokeColor !== shapeChangingArgs.currentShapeSettings.strokeColor) {
parent.activeObj.strokeSettings.strokeColor = shapeChangingArgs.currentShapeSettings.strokeColor;
var penColorElement = parent.element.querySelector('.e-ie-toolbar-e-pen-color .e-dropdownbtn-preview');
if (penColorElement) {
penColorElement.style.background = shapeChangingArgs.currentShapeSettings.strokeColor;
}
}
if (_this.fhdSelID) {
point.strokeColor = shapeChangingArgs.currentShapeSettings.strokeColor;
point.strokeWidth = shapeChangingArgs.currentShapeSettings.strokeWidth;
point.points = shapeChangingArgs.currentShapeSettings.points;
point.opacity = shapeChangingArgs.currentShapeSettings.opacity;
}
if (shapeChangingArgs.action === 'select') {
_this.freehandRedraw(_this.upperContext);
parent.updateToolbar(parent.element, 'imageLoaded');
parent.updateToolbar(parent.element, 'pen');
}
});
parent.trigger('shapeChanging', shapeChangingArgs);
this.penStrokeWidth = shapeChangingArgs.currentShapeSettings.strokeWidth;
if (parent.activeObj.strokeSettings.strokeColor !== shapeChangingArgs.currentShapeSettings.strokeColor) {
parent.activeObj.strokeSettings.strokeColor = shapeChangingArgs.currentShapeSettings.strokeColor;
parent.notify('toolbar', { prop: 'update-toolbar-items', onPropertyChange: false });
}
else {
parent.trigger('shapeChanging', shapeChangingArgs);
this.penStrokeWidth = shapeChangingArgs.currentShapeSettings.strokeWidth;
if (parent.activeObj.strokeSettings.strokeColor !== shapeChangingArgs.currentShapeSettings.strokeColor) {
parent.activeObj.strokeSettings.strokeColor = shapeChangingArgs.currentShapeSettings.strokeColor;
parent.notify('toolbar', { prop: 'update-toolbar-items', onPropertyChange: false });
}
if (this.fhdSelID) {
point.strokeColor = shapeChangingArgs.currentShapeSettings.strokeColor;
point.strokeWidth = shapeChangingArgs.currentShapeSettings.strokeWidth;
point.points = shapeChangingArgs.currentShapeSettings.points;
point.opacity = shapeChangingArgs.currentShapeSettings.opacity;
}
if (shapeChangingArgs.action === 'select') {
this.freehandRedraw(this.upperContext);
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'pen',
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
}
if (this.fhdSelID && point && shapeChangingArgs.currentShapeSettings) {
point.strokeColor = shapeChangingArgs.currentShapeSettings.strokeColor;
point.strokeWidth = shapeChangingArgs.currentShapeSettings.strokeWidth;
point.points = shapeChangingArgs.currentShapeSettings.points;
point.opacity = shapeChangingArgs.currentShapeSettings.opacity;
}
if (shapeChangingArgs.action === 'select') {
this.freehandRedraw(this.upperContext);
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'pen',
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
}
};

@@ -1198,0 +1144,0 @@ FreehandDrawing.prototype.setCenterSelPoints = function () {

@@ -45,3 +45,2 @@ import { ImageEditor } from '../index';

private zoomAction;
private getZoomTriggerType;
private zoomEvent;

@@ -48,0 +47,0 @@ private disableZoomOutBtn;

@@ -1,2 +0,2 @@

import { isNullOrUndefined, extend, isBlazor } from '@syncfusion/ej2-base';
import { isNullOrUndefined, extend } from '@syncfusion/ej2-base';
var UndoRedo = /** @class */ (function () {

@@ -102,20 +102,11 @@ function UndoRedo(parent) {

if (refreshToolbar) {
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'setEnableDisableUndoRedo', value: { isPrevent: true } });
}
parent.notify('toolbar', { prop: 'setEnableDisableUndoRedo', value: { isPrevent: true } });
this.tempUndoRedoColl = extend([], this.appliedUndoRedoColl, [], true);
this.tempUndoRedoStep = this.undoRedoStep;
}
else if (!isBlazor()) {
parent.notify('toolbar', { prop: 'setEnableDisableUndoRedo', value: { isPrevent: false } });
}
parent.notify('toolbar', { prop: 'setEnableDisableUndoRedo', value: { isPrevent: false } });
this.undoRedoColl = this.undoRedoColl.slice(0, this.undoRedoStep);
this.appliedUndoRedoColl = this.appliedUndoRedoColl.slice(0, this.undoRedoStep);
parent.isUndoRedo = parent.currObjType.isUndoAction = false;
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'enable-disable-btns' });
}
else {
parent.updateToolbar(parent.element, 'enableDisableToolbarBtn');
}
parent.notify('toolbar', { prop: 'enable-disable-btns' });
};

@@ -127,5 +118,3 @@ UndoRedo.prototype.updateCurrUrc = function (type) {

}
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'setEnableDisableUndoRedo', value: { isPrevent: false } });
}
parent.notify('toolbar', { prop: 'setEnableDisableUndoRedo', value: { isPrevent: false } });
if (type === 'ok') {

@@ -190,8 +179,3 @@ parent.notify('draw', { prop: 'setShapeTextInsert', onPropertyChange: false, value: { bool: false } });

this.undoRedoStep = this.undoRedoColl.length;
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'enable-disable-btns' });
}
else {
parent.updateToolbar(parent.element, 'enableDisableToolbarBtn');
}
parent.notify('toolbar', { prop: 'enable-disable-btns' });
}

@@ -222,5 +206,3 @@ if (parent.transform.zoomFactor > 0) {

this.tempUndoRedoStep = 0;
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'setEnableDisableUndoRedo', value: { isPrevent: false } });
}
parent.notify('toolbar', { prop: 'setEnableDisableUndoRedo', value: { isPrevent: false } });
}

@@ -230,14 +212,9 @@ };

var parent = this.parent;
if (!isBlazor()) {
if (parent.activeObj.shape) {
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'shapes',
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
parent.notify('toolbar', { prop: 'update-toolbar-items', onPropertyChange: false });
}
else {
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
}
if (parent.activeObj.shape) {
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'shapes',
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
parent.notify('toolbar', { prop: 'update-toolbar-items', onPropertyChange: false });
}
else if (isNullOrUndefined(parent.activeObj.shape)) {
parent.updateToolbar(parent.element, 'imageLoaded');
else {
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
}

@@ -252,3 +229,3 @@ };

}
if (parent.element.querySelector('.e-contextual-toolbar-wrapper') && !isBlazor()) {
if (parent.element.querySelector('.e-contextual-toolbar-wrapper')) {
parent.element.querySelector('.e-contextual-toolbar-wrapper').classList.add('e-hide');

@@ -285,11 +262,6 @@ }

this.undoRedoStep--;
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'enable-disable-btns' });
if (parent.element.querySelector('.e-contextual-toolbar-wrapper')) {
parent.element.querySelector('.e-contextual-toolbar-wrapper').classList.add('e-hide');
}
parent.notify('toolbar', { prop: 'enable-disable-btns' });
if (parent.element.querySelector('.e-contextual-toolbar-wrapper')) {
parent.element.querySelector('.e-contextual-toolbar-wrapper').classList.add('e-hide');
}
else {
parent.updateToolbar(parent.element, 'enableDisableToolbarBtn');
}
parent.isUndoRedo = true;

@@ -421,8 +393,3 @@ var obj = this.undoRedoColl[this.undoRedoStep];

this.undoRedoStep++;
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'enable-disable-btns' });
}
else {
parent.updateToolbar(parent.element, 'enableDisableToolbarBtn');
}
parent.notify('toolbar', { prop: 'enable-disable-btns' });
parent.isUndoRedo = true;

@@ -444,3 +411,3 @@ var obj = this.undoRedoColl[this.undoRedoStep - 1];

this.lowerContext.filter = obj.currentObj.filter;
if (!isBlazor() && parent.element.querySelector('.e-contextual-toolbar-wrapper')) {
if (parent.element.querySelector('.e-contextual-toolbar-wrapper')) {
parent.element.querySelector('.e-contextual-toolbar-wrapper').classList.add('e-hide');

@@ -717,8 +684,3 @@ }

parent.notify('draw', { prop: 'redrawImgWithObj', onPropertyChange: false });
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'destroy-qa-toolbar', onPropertyChange: false });
}
else {
parent.updateToolbar(parent.element, 'destroyQuickAccessToolbar');
}
parent.notify('toolbar', { prop: 'destroy-qa-toolbar', onPropertyChange: false });
var textArea = parent.textArea;

@@ -785,25 +747,14 @@ textArea.style.display = 'block';

parent.notify('draw', { prop: 'setCancelAction', onPropertyChange: false, value: { bool: false } });
if (!isBlazor()) {
if (parent.activeObj.shape && parent.activeObj.shape.split('-')[0] === 'crop') {
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'main',
isApplyBtn: true, isCropping: true, isZooming: null, cType: null } });
}
else {
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
}
parent.notify('toolbar', { prop: 'enable-disable-btns' });
if (parent.activeObj.shape && parent.activeObj.shape.split('-')[0] === 'crop') {
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'main',
isApplyBtn: true, isCropping: true, isZooming: null, cType: null } });
}
else if (isNullOrUndefined(parent.activeObj.shape) || parent.activeObj.shape.split('-')[0] !== 'crop') {
parent.updateToolbar(parent.element, 'imageLoaded');
parent.updateToolbar(parent.element, 'enableDisableToolbarBtn');
else {
parent.notify('toolbar', { prop: 'refresh-main-toolbar', onPropertyChange: false });
}
parent.notify('toolbar', { prop: 'enable-disable-btns' });
if (document.getElementById(parent.element.id + '_quickAccessToolbarArea')) {
document.getElementById(parent.element.id + '_quickAccessToolbarArea').style.display = 'none';
}
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'enable-disable-btns' });
}
else {
parent.updateToolbar(parent.element, 'enableDisableToolbarBtn');
}
parent.notify('toolbar', { prop: 'enable-disable-btns' });
if (parent.transform.degree !== 0) {

@@ -815,7 +766,2 @@ parent.notify('transform', { prop: 'drawPannedImage', onPropertyChange: false,

parent.currObjType.isCustomCrop = false;
if (isBlazor() && parent.events && parent.events.historyChanged.hasDelegate === true) {
var imageAction = this.getImageAction(operation);
var args = { length: this.undoRedoColl.length, index: this.undoRedoStep, actionTrigger: isUndo ? 'Undo' : 'Redo', imageAction: imageAction };
parent.dotNetRef.invokeMethodAsync('OnHistoryChangedAsync', args);
}
};

@@ -901,13 +847,3 @@ UndoRedo.prototype.getImageAction = function (operation) {

previousText: previousText, currentText: currentText, filter: previousFilter, isCircleCrop: isCircleCrop });
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'enable-disable-btns', onPropertyChange: false });
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
}
else if (parent.currentToolbar !== 'pen-toolbar') {
var toolbarValue = null;
if (parent.currentToolbar === 'text-toolbar' && operation === 'textAreaCustomization') {
toolbarValue = 'textAreaClicked';
}
parent.updateToolbar(parent.element, 'enableDisableToolbarBtn', toolbarValue);
}
parent.notify('toolbar', { prop: 'enable-disable-btns', onPropertyChange: false });
}

@@ -968,11 +904,6 @@ };

parent.notify('shape', { prop: 'refreshActiveObj', onPropertyChange: false });
if (!isBlazor()) {
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'shapes',
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'main',
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
}
else {
parent.updateToolbar(parent.element, 'imageLoaded');
}
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'shapes',
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
parent.notify('toolbar', { prop: 'refresh-toolbar', onPropertyChange: false, value: { type: 'main',
isApplyBtn: null, isCropping: null, isZooming: null, cType: null } });
};

@@ -979,0 +910,0 @@ UndoRedo.prototype.getZeroZoomObjPointValue = function (obj, point) {

@@ -1,2 +0,2 @@

import { Component, NotifyPropertyChanges, INotifyPropertyChanged, Property, addClass, removeClass, ModuleDeclaration, extend, isBlazor, BlazorDotnetObject } from '@syncfusion/ej2-base'; import { Event, EmitType, EventHandler, getComponent, isNullOrUndefined, getUniqueID } from '@syncfusion/ej2-base'; import { ItemModel, Toolbar, ClickEventArgs } from '@syncfusion/ej2-navigations'; import { Dialog, createSpinner } from '@syncfusion/ej2-popups'; import { Complex, Browser, ChildProperty, compile as templateCompiler, compile } from '@syncfusion/ej2-base'; import { ToolbarModule, Crop, Draw, Filter, FreehandDrawing, Selection, Shape, Transform, UndoRedo, Export, SelectionChangeEventArgs, Transition, ArrowheadType, ResizeEventArgs, FrameType, FrameLineStyle, FrameChangeEventArgs, FrameSettings, ShapeType } from './../index'; import { ZoomEventArgs, PanEventArgs, CropEventArgs, RotateEventArgs, FlipEventArgs, ShapeChangeEventArgs } from './../index'; import { ToolbarEventArgs, OpenEventArgs, SaveEventArgs, BeforeSaveEventArgs, Point, ShapeSettings, ImageFilterEventArgs } from './../index'; import { FinetuneEventArgs, QuickAccessToolbarEventArgs, CurrentObject, ImageDimension, TransformValue, PanPoint } from './../index'; import { Interaction, SelectionPoint, ImageFinetuneValue, Dimension, ActivePoint, ImageEditorClickEventArgs, FrameValue } from './../index'; import { Direction, ZoomTrigger, Theme, ImageEditorCommand, ImageFilterOption, ImageFinetuneOption } from './../index'; import { ItemModel as DropDownButtonItemModel } from '@syncfusion/ej2-splitbuttons'; import { ChangeEventArgs, NumericTextBox, Uploader } from '@syncfusion/ej2-inputs';
import { Component, NotifyPropertyChanges, INotifyPropertyChanged, Property, addClass, removeClass, ModuleDeclaration, extend } from '@syncfusion/ej2-base'; import { Event, EmitType, EventHandler, getComponent, isNullOrUndefined, getUniqueID } from '@syncfusion/ej2-base'; import { ItemModel, Toolbar, ClickEventArgs } from '@syncfusion/ej2-navigations'; import { Dialog, createSpinner } from '@syncfusion/ej2-popups'; import { Complex, Browser, ChildProperty, compile as templateCompiler, compile } from '@syncfusion/ej2-base'; import { ToolbarModule, Crop, Draw, Filter, FreehandDrawing, Selection, Shape, Transform, UndoRedo, Export, SelectionChangeEventArgs, Transition, ArrowheadType, ResizeEventArgs, FrameType, FrameLineStyle, FrameChangeEventArgs, FrameSettings, ShapeType } from './../index'; import { ZoomEventArgs, PanEventArgs, CropEventArgs, RotateEventArgs, FlipEventArgs, ShapeChangeEventArgs } from './../index'; import { ToolbarEventArgs, OpenEventArgs, SaveEventArgs, BeforeSaveEventArgs, Point, ShapeSettings, ImageFilterEventArgs } from './../index'; import { FinetuneEventArgs, QuickAccessToolbarEventArgs, CurrentObject, ImageDimension, TransformValue, PanPoint } from './../index'; import { Interaction, SelectionPoint, ImageFinetuneValue, Dimension, ActivePoint, ImageEditorClickEventArgs, FrameValue } from './../index'; import { Direction, ZoomTrigger, Theme, ImageEditorCommand, ImageFilterOption, ImageFinetuneOption } from './../index'; import { ItemModel as DropDownButtonItemModel } from '@syncfusion/ej2-splitbuttons'; import { ChangeEventArgs, NumericTextBox, Uploader } from '@syncfusion/ej2-inputs';
import {ComponentModel} from '@syncfusion/ej2-base';

@@ -3,0 +3,0 @@

@@ -1,2 +0,2 @@

import { Component, INotifyPropertyChanged, ModuleDeclaration, BlazorDotnetObject } from '@syncfusion/ej2-base';
import { Component, INotifyPropertyChanged, ModuleDeclaration } from '@syncfusion/ej2-base';
import { EmitType } from '@syncfusion/ej2-base';

@@ -274,4 +274,2 @@ import { ItemModel, ClickEventArgs } from '@syncfusion/ej2-navigations';

/** @hidden */
dotNetRef: BlazorDotnetObject;
/** @hidden */
toolbarHeight: number;

@@ -882,5 +880,7 @@ /** @hidden */

*
* @param { boolean } resetCrop - Specifies to reset last cropped image.
*
* @returns {void}.
*/
clearSelection(): void;
clearSelection(resetCrop?: boolean): void;
/**

@@ -1045,6 +1045,7 @@ * Crops an image based on the selection done in the image editor.

* @param {number} degree - Specifies the degree to rotate the ellipse.
* @param {boolean} isSelected - Specifies to show the ellipse in the selected state.
* @returns {boolean}.
*
*/
drawEllipse(x?: number, y?: number, radiusX?: number, radiusY?: number, strokeWidth?: number, strokeColor?: string, fillColor?: string, degree?: number): boolean;
drawEllipse(x?: number, y?: number, radiusX?: number, radiusY?: number, strokeWidth?: number, strokeColor?: string, fillColor?: string, degree?: number, isSelected?: boolean): boolean;
/**

@@ -1059,5 +1060,6 @@ * Draw line on an image.

* @param {string} strokeColor - Specifies the stroke color of line.
* @param {boolean} isSelected - Specifies to show the line in the selected state.
* @returns {boolean}.
*/
drawLine(startX?: number, startY?: number, endX?: number, endY?: number, strokeWidth?: number, strokeColor?: string): boolean;
drawLine(startX?: number, startY?: number, endX?: number, endY?: number, strokeWidth?: number, strokeColor?: string, isSelected?: boolean): boolean;
/**

@@ -1074,5 +1076,6 @@ * Draw arrow on an image.

* @param {ArrowheadType} arrowEnd – Specifies the type of arrowhead for end position. The default value is ‘SolidArrow’.
* @param {boolean} isSelected - Specifies to show the arrow in the selected state.
* @returns {boolean}.
*/
drawArrow(startX?: number, startY?: number, endX?: number, endY?: number, strokeWidth?: number, strokeColor?: string, arrowStart?: ArrowheadType, arrowEnd?: ArrowheadType): boolean;
drawArrow(startX?: number, startY?: number, endX?: number, endY?: number, strokeWidth?: number, strokeColor?: string, arrowStart?: ArrowheadType, arrowEnd?: ArrowheadType, isSelected?: boolean): boolean;
/**

@@ -1084,5 +1087,6 @@ * Draw path on an image.

* @param {string} strokeColor - Specifies the stroke color of path.
* @param {boolean} isSelected - Specifies to show the path in the selected state.
* @returns {boolean}.
*/
drawPath(pointColl: Point[], strokeWidth?: number, strokeColor?: string, opacity?: number): boolean;
drawPath(pointColl: Point[], strokeWidth?: number, strokeColor?: string, isSelected?: boolean): boolean;
/**

@@ -1099,5 +1103,6 @@ * Draw a rectangle on an image.

* @param {number} degree - Specifies the degree to rotate the rectangle.
* @param {boolean} isSelected - Specifies to show the rectangle in the selected state.
* @returns {boolean}.
*/
drawRectangle(x?: number, y?: number, width?: number, height?: number, strokeWidth?: number, strokeColor?: string, fillColor?: string, degree?: number): boolean;
drawRectangle(x?: number, y?: number, width?: number, height?: number, strokeWidth?: number, strokeColor?: string, fillColor?: string, degree?: number, isSelected?: boolean): boolean;
/**

@@ -1116,6 +1121,7 @@ * Draw a text on an image.

* @param {string} color - Specifies font color of the text.
* @param {boolean} isSelected - Specifies to show the text in the selected state.
* @returns {boolean}.
*
*/
drawText(x?: number, y?: number, text?: string, fontFamily?: string, fontSize?: number, bold?: boolean, italic?: boolean, color?: string): boolean;
drawText(x?: number, y?: number, text?: string, fontFamily?: string, fontSize?: number, bold?: boolean, italic?: boolean, color?: string, isSelected?: boolean): boolean;
/**

@@ -1133,6 +1139,7 @@ * Draw an image as annotation on an image.

* @param {number} opacity - Specifies the value for the image.
* @param {boolean} isSelected - Specifies to show the image in the selected state.
* @returns {boolean}.
*
*/
drawImage(data: string | ImageData, x?: number, y?: number, width?: number, height?: number, isAspectRatio?: boolean, degree?: number, opacity?: number): boolean;
drawImage(data: string | ImageData, x?: number, y?: number, width?: number, height?: number, isAspectRatio?: boolean, degree?: number, opacity?: number, isSelected?: boolean): boolean;
/**

@@ -1274,6 +1281,7 @@ * Select a shape based on the given shape id.

* @param {ShapeSettings} setting - Specifies the shape settings to be updated for the shape on an image.
* @param {boolean} isSelected - Specifies to show the shape in the selected state.
* @returns {boolean}.
*
*/
updateShape(setting: ShapeSettings): boolean;
updateShape(setting: ShapeSettings, isSelected?: boolean): boolean;
/**

@@ -1288,2 +1296,32 @@ * Duplicates a shape based on the given shape ID in the ImageEditor.

cloneShape(shapeId: string): boolean;
/**
* Update filter to the canvas in the ImageEditor.
*
* @param {ImageFilterOption } filterOption - Specifies the filter options to the image.
*
* @returns {string}.
*
*/
getImageFilter(filterOption: ImageFilterOption): string;
/**
* Enable text area editing in the ImageEditor.
*
* @returns {void}.
*
*/
enableTextEditing(): void;
/**
* Specifies if it's possible to undo the last recent action made in an Image Editor.
*
* @returns {boolean}.
*
*/
canUndo(): boolean;
/**
* Specifies if it's possible to redo the last recent action made in an Image Editor.
*
* @returns {boolean}.
*
*/
canRedo(): boolean;
private toolbarTemplateFn;

@@ -1296,2 +1334,3 @@ private quickAccessToolbarTemplateFn;

private updateFreehandDrawColorChange;
private getUndoRedoColl;
private updateImageTransformColl;

@@ -1543,34 +1582,4 @@ private setInitialZoomState;

private getStraightenFlipState;
/**
* To Initialize the component rendering
*
* @private
* @param {HTMLCanvasElement} element - Specifies the canvas element.
* @param {BlazorDotnetObject} dotnetRef - Specifies for blazor client to server communication.
* @returns {void}
*/
initializeImageEditor(element: HTMLDivElement, dotnetRef?: BlazorDotnetObject): void;
private prerender;
private initializeZoomSettings;
private initializeThemeColl;
/**
* Get the square point for path.
*
* @param { HTMLDivElement } element - Specifies element.
* @param { string } type - Specifies the type.
* @param { string } value - Specifies the value.
* @hidden
* @private
* @returns {void}.
*/
updateToolbar(element: HTMLDivElement, type: string, value?: string): void;
/**
* Trigger the shapeChanging event for after the shape applied.
*
* @param { ShapeChangeEventArgs } shapeChangedArgs - Specifies the shapeChaning event args.
* @hidden
* @returns {void}.
*/
triggerShapeChanged(shapeChangedArgs: ShapeChangeEventArgs): void;
private triggerActionComplete;
}

@@ -109,2 +109,3 @@ import { ImageEditor } from '../index';

private quickAccessToolbarClicked;
private editText;
private duplicateShape;

@@ -111,0 +112,0 @@ private defToolbarClicked;

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc