@syncfusion/ej2-image-editor 25.2.3 → 26.1.35

package/src/image-editor/base/image-editor-model.d.ts

@@ -1,4 +1,4 @@
-import { Component, NotifyPropertyChanges, INotifyPropertyChanged, Property, addClass, removeClass, ModuleDeclaration, extend } from '@syncfusion/ej2-base';
+import { Component, NotifyPropertyChanges, INotifyPropertyChanged, Property, addClass, removeClass, ModuleDeclaration, extend } from '@syncfusion/ej2-base';
 import {ComponentModel} from '@syncfusion/ej2-base';
 
 /**
@@ -265,6 +265,7 @@ export interface ImageEditorModel extends ComponentModel{
      * - `MaterialDark`
      * - `FabricDark`
      * - `HighContrastDark`
+     * - `Fluent2`
      *
      * The default value is set to `Theme.Bootstrap5`.
      *
@@ -618,8 +619,9 @@ export interface ImageEditorModel extends ComponentModel{
     click?: EmitType<ImageEditorClickEventArgs>
 
     /**
-     * Event callback that is raised after shape changing action is performed in an image editor. 
-     * @remarks 
+     * Event callback that is raised after shape changing action is performed in an image editor.
+     *
+     * @remarks
      * This event is triggered after changing stroke color, fill Color, and stroke width property for the shapes and after the shape is applied to the canvas while clicking the OK button in toolbar.
      *
      * @event shapeChange
@@ -656,10 +658,10 @@ export interface ImageEditorModel extends ComponentModel{
     quickAccessToolbarOpen?: EmitType<QuickAccessToolbarEventArgs>
 
     /**
-     * Event callback that is raised while resizing an image. 
+     * Event callback that is raised while resizing an image.
      *
-     * @event resizing 
-     */ 
+     * @event resizing
+     */
     resizing?: EmitType<ResizeEventArgs>
 
     /**

package/src/image-editor/base/image-editor.d.ts

@@ -3,7 +3,7 @@ import { EmitType } from '@syncfusion/ej2-base';
 import { ItemModel, ClickEventArgs } from '@syncfusion/ej2-navigations';
 import { ChildProperty } from '@syncfusion/ej2-base';
 import { ImageEditorModel, FinetuneSettingsModel, ZoomSettingsModel, SelectionSettingsModel, FontFamilyModel } from './image-editor-model';
-import { SelectionChangeEventArgs, Transition, ArrowheadType, ResizeEventArgs, FrameType, FrameLineStyle, FrameChangeEventArgs } from './../index';
+import { SelectionChangeEventArgs, Transition, ArrowheadType, ResizeEventArgs, FrameType, FrameLineStyle, FrameChangeEventArgs, 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';
@@ -362,6 +362,18 @@ export declare class ImageEditor extends Component<HTMLDivElement> implements IN
     curFrameObjEvent: object;
     /** @hidden */
     isChangesSaved: boolean;
+    /** @hidden */
+    drawingShape: string;
+    /** @hidden */
+    isShapeDrawing: boolean;
+    /** @hidden */
+    noPushUndo: boolean;
+    /** @hidden */
+    isUndoRedoStack: boolean;
+    /** @hidden */
+    shapeColl: any;
+    /** @hidden */
+    imgSrc: string;
     private lowerContext;
     private upperContext;
     private inMemoryContext;
@@ -412,6 +424,7 @@ export declare class ImageEditor extends Component<HTMLDivElement> implements IN
      * - `MaterialDark`
      * - `FabricDark`
      * - `HighContrastDark`
+     * - `Fluent2`
      *
      * The default value is set to `Theme.Bootstrap5`.
      *
@@ -734,6 +747,7 @@ export declare class ImageEditor extends Component<HTMLDivElement> implements IN
     click: EmitType<ImageEditorClickEventArgs>;
     /**
      * Event callback that is raised after shape changing action is performed in an image editor.
+     *
      * @remarks
      * This event is triggered after changing stroke color, fill Color, and stroke width property for the shapes and after the shape is applied to the canvas while clicking the OK button in toolbar.
      *
@@ -1119,10 +1133,11 @@ export declare class ImageEditor extends Component<HTMLDivElement> implements IN
      * @param {boolean} italic - Specifies whether the text is italic or not.
      * @param {string} color - Specifies font color of the text.
      * @param {boolean} isSelected - Specifies to show the text in the selected state.
+     * @param {number} degree - Specifies the degree to rotate the text.
      * @returns {boolean}.
      *
      */
-    drawText(x?: number, y?: number, text?: string, fontFamily?: string, fontSize?: number, bold?: boolean, italic?: boolean, color?: string, isSelected?: boolean): boolean;
+    drawText(x?: number, y?: number, text?: string, fontFamily?: string, fontSize?: number, bold?: boolean, italic?: boolean, color?: string, isSelected?: boolean, degree?: number): boolean;
     /**
      * Draw an image as annotation on an image.
      *
@@ -1320,6 +1335,79 @@ export declare class ImageEditor extends Component<HTMLDivElement> implements IN
      *
      */
     canRedo(): boolean;
+    /**
+     * Applies the operations performed in the Image Editor, such as annotation drawings.
+     *
+     * @returns{void}
+     * @remarks
+     * This method applies the actions performed after enabling annotation drawings, ensuring that the drawn annotations are applied to the image.
+     */
+    apply(): void;
+    /**
+     * Discards the operations performed in the Image Editor, such as annotation drawings.
+     *
+     * @returns{void}
+     * @remarks
+     * This method discards the actions performed after enabling annotation drawings, ensuring that the drawn annotations are not applied to the image.
+     */
+    discard(): void;
+    /**
+     * Enable or disable a shape drawing option in an Image Editor.
+     *
+     * @param {ShapeType} shapeType - Specifies the type of shape to be enabled or disabled for drawing.
+     * @param {boolean} isEnabled - Optional. Specifies a value to indicate whether to enable or disable shape drawing. The default value is true.
+     *
+     * @remarks This function allows the user to toggle the shape drawing feature in the Image Editor. When enabled, users can draw shapes on the image. When disabled, the shape drawing functionality is not available.
+     *
+     * @returns {void}.
+     */
+    enableShapeDrawing(shapeType: ShapeType, isEnabled: boolean): void;
+    /**
+     * Moves a shape to the front of all other shapes based on the given shape id.
+     * Use 'getShapeSettings' method to get the shape id which is then passed to perform moving.
+     *
+     * @param {string} shapeId - Specifies the shape id to move the shape on an image.
+     * @returns {void}.
+     *
+     */
+    bringToFront(shapeId: string): void;
+    /**
+     * Moves a shape to ahead of one shape based on the given shape id.
+     * Use 'getShapeSettings' method to get the shape id which is then passed to perform moving.
+     *
+     * @param {string} shapeId - Specifies the shape id to move the shape on an image.
+     * @returns {void}.
+     *
+     */
+    bringForward(shapeId: string): void;
+    /**
+     * Moves a shape to behind all other shapes based on the given shape id.
+     * Use 'getShapeSettings' method to get the shape id which is then passed to perform moving.
+     *
+     * @param {string} shapeId - Specifies the shape id to move the shape on an image.
+     * @returns {void}.
+     *
+     */
+    sendToBack(shapeId: string): void;
+    /**
+     * Moves a shape to behind one shape based on the given shape id.
+     * Use 'getShapeSettings' method to get the shape id which is then passed to perform moving.
+     *
+     * @param {string} shapeId - Specifies the shape id to move the shape on an image.
+     * @returns {void}.
+     *
+     */
+    sendBackward(shapeId: string): void;
+    /**
+     * Clears the loaded image in the Image Editor.
+     *
+     * @returns{void}
+     * @remarks
+     * This method clears the loaded image and updates the component's user interface to its initial state (the initial user interface without a loaded image).
+     */
+    clearImage(): void;
+    private applyShapes;
+    private closeOverlayTbar;
     private toolbarTemplateFn;
     private quickAccessToolbarTemplateFn;
     private templateParser;
@@ -1359,10 +1447,19 @@ export declare class ImageEditor extends Component<HTMLDivElement> implements IN
      * Handles the OK button operation
      *
      * @param { boolean } isMouseDown - Specifies whether it is a mouse down.
+     * @param { boolean } isFinalApply - Specifies whether it is a final apply.
      * @hidden
      * @returns {void}.
      */
-    okBtn(isMouseDown?: boolean): void;
+    okBtn(isMouseDown?: boolean, isFinalApply?: boolean): void;
+    /**
+     * Handles the OK button operation
+     *
+     * @param { string } id - Specifies shape id to return.
+     * @hidden
+     * @returns {SelectionPoint | Object}.
+     */
+    getObjFromId(id: string): SelectionPoint | Object;
     /**
      * Set the temporary filter properties.
      *
@@ -1514,7 +1611,6 @@ export declare class ImageEditor extends Component<HTMLDivElement> implements IN
      * Apply rotate image.
      *
      * @param { string } rotate - Specifies the direction of rotation.
-     * @param { boolean } isPreventURC - Specifies to update undo redo collection.
      * @hidden
      * @returns {void}.
      */
@@ -1553,10 +1649,11 @@ export declare class ImageEditor extends Component<HTMLDivElement> implements IN
     /**
      * Performs Straightening action.
      *
+     * @param { number } value - Specifies the degree of straightening.
      * @hidden
-     * @returns {void}.
+     * @returns {void} .
      */
-    setStraighten(value: number, isMethod?: boolean): void;
+    setStraighten(value: number): void;
     private duplicateImage;
     private performStraighten;
     /**
@@ -1569,10 +1666,22 @@ export declare class ImageEditor extends Component<HTMLDivElement> implements IN
     /**
      * Returns rotated canvas dimension.
      *
+     * @param { number } width - Specifies the width of the canvas.
+     * @param { number } height - Specifies the height of the canvas.
+     * @param { number } angle - Specifies the angle of rotation in degrees.
      * @hidden
-     * @returns {void}.
+     * @returns {void} .
      */
     getRotatedCanvasDim(width: number, height: number, angle: number): Dimension;
+    /**
+     * Apply Shape order.
+     *
+     * @param { string } id - Specifies the id of the shape to change the order.
+     * @param { string } value - Specifies the order of the shapes.
+     * @hidden
+     * @returns {void}.
+     */
+    updateShapeOrder(id: string, value: string): void;
     private getStraightenFlipState;
     private initializeZoomSettings;
     private initializeThemeColl;