ngx-image-cropper 6.1.0 → 6.2.2

package/esm2020/lib/services/crop.service.mjs

@@ -20,13 +20,12 @@ export class CropService {
         }
         const scaleX = (settings.transform.scale || 1) * (settings.transform.flipH ? -1 : 1);
         const scaleY = (settings.transform.scale || 1) * (settings.transform.flipV ? -1 : 1);
+        const { translateH, translateV } = this.getCanvasTranslate(sourceImage, loadedImage, settings);
         const transformedImage = loadedImage.transformed;
-        ctx.setTransform(scaleX, 0, 0, scaleY, transformedImage.size.width / 2, transformedImage.size.height / 2);
+        ctx.setTransform(scaleX, 0, 0, scaleY, transformedImage.size.width / 2 + translateH, transformedImage.size.height / 2 + translateV);
         ctx.translate(-imagePosition.x1 / scaleX, -imagePosition.y1 / scaleY);
         ctx.rotate((settings.transform.rotate || 0) * Math.PI / 180);
-        const translateH = settings.transform.translateH ? percentage(settings.transform.translateH, transformedImage.size.width) : 0;
-        const translateV = settings.transform.translateV ? percentage(settings.transform.translateV, transformedImage.size.height) : 0;
-        ctx.drawImage(transformedImage.image, translateH - transformedImage.size.width / 2, translateV - transformedImage.size.height / 2);
+        ctx.drawImage(transformedImage.image, -transformedImage.size.width / 2, -transformedImage.size.height / 2);
         const output = {
             width, height,
             imagePosition,
@@ -46,9 +45,27 @@ export class CropService {
         output.base64 = cropCanvas.toDataURL('image/' + settings.format, this.getQuality(settings));
         return output;
     }
-    getImagePosition(sourceImage, loadedImage, cropper, settings) {
+    getCanvasTranslate(sourceImage, loadedImage, settings) {
+        if (settings.transform.translateUnit === 'px') {
+            const ratio = this.getRatio(sourceImage, loadedImage);
+            return {
+                translateH: (settings.transform.translateH || 0) * ratio,
+                translateV: (settings.transform.translateV || 0) * ratio
+            };
+        }
+        else {
+            return {
+                translateH: settings.transform.translateH ? percentage(settings.transform.translateH, loadedImage.transformed.size.width) : 0,
+                translateV: settings.transform.translateV ? percentage(settings.transform.translateV, loadedImage.transformed.size.height) : 0
+            };
+        }
+    }
+    getRatio(sourceImage, loadedImage) {
         const sourceImageElement = sourceImage.nativeElement;
-        const ratio = loadedImage.transformed.size.width / sourceImageElement.offsetWidth;
+        return loadedImage.transformed.size.width / sourceImageElement.offsetWidth;
+    }
+    getImagePosition(sourceImage, loadedImage, cropper, settings) {
+        const ratio = this.getRatio(sourceImage, loadedImage);
         const out = {
             x1: Math.round(cropper.x1 * ratio),
             y1: Math.round(cropper.y1 * ratio),
@@ -117,4 +134,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3JvcC5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWltYWdlLWNyb3BwZXIvc3JjL2xpYi9zZXJ2aWNlcy9jcm9wLnNlcnZpY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFjLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUd2RCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDckQsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLDJCQUEyQixDQUFDOztBQUd2RCxNQUFNLE9BQU8sV0FBVztJQUV0QixJQUFJLENBQUMsV0FBdUIsRUFBRSxXQUF3QixFQUFFLE9BQXdCLEVBQUUsUUFBeUI7UUFDekcsTUFBTSxhQUFhLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFdBQVcsRUFBRSxXQUFXLEVBQUUsT0FBTyxFQUFFLFFBQVEsQ0FBQyxDQUFDO1FBQ3pGLE1BQU0sS0FBSyxHQUFHLGFBQWEsQ0FBQyxFQUFFLEdBQUcsYUFBYSxDQUFDLEVBQUUsQ0FBQztRQUNsRCxNQUFNLE1BQU0sR0FBRyxhQUFhLENBQUMsRUFBRSxHQUFHLGFBQWEsQ0FBQyxFQUFFLENBQUM7UUFDbkQsTUFBTSxVQUFVLEdBQUcsUUFBUSxDQUFDLGFBQWEsQ0FBQyxRQUFRLENBQXNCLENBQUM7UUFDekUsVUFBVSxDQUFDLEtBQUssR0FBRyxLQUFLLENBQUM7UUFDekIsVUFBVSxDQUFDLE1BQU0sR0FBRyxNQUFNLENBQUM7UUFFM0IsTUFBTSxHQUFHLEdBQUcsVUFBVSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUN4QyxJQUFJLENBQUMsR0FBRyxFQUFFO1lBQ1IsT0FBTyxJQUFJLENBQUM7U0FDYjtRQUNELElBQUksUUFBUSxDQUFDLGVBQWUsSUFBSSxJQUFJLEVBQUU7WUFDcEMsR0FBRyxDQUFDLFNBQVMsR0FBRyxRQUFRLENBQUMsZUFBZSxDQUFD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VSxXQUFXOzRHQUFYLFdBQVcsY0FERSxNQUFNOzJGQUNuQixXQUFXO2tCQUR2QixVQUFVO21CQUFDLEVBQUUsVUFBVSxFQUFFLE1BQU0sRUFBRSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEVsZW1lbnRSZWYsIEluamVjdGFibGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENyb3BwZXJQb3NpdGlvbiwgSW1hZ2VDcm9wcGVkRXZlbnQsIExvYWRlZEltYWdlIH0gZnJvbSAnLi4vaW50ZXJmYWNlcyc7XG5pbXBvcnQgeyBDcm9wcGVyU2V0dGluZ3MgfSBmcm9tICcuLi9pbnRlcmZhY2VzL2Nyb3BwZXIuc2V0dGluZ3MnO1xuaW1wb3J0IHsgcmVzaXplQ2FudmFzIH0gZnJvbSAnLi4vdXRpbHMvcmVzaXplLnV0aWxzJztcbmltcG9ydCB7IHBlcmNlbnRhZ2UgfSBmcm9tICcuLi91dGlscy9wZXJjZW50YWdlLnV0aWxzJztcblxuQEluamVjdGFibGUoeyBwcm92aWRlZEluOiAncm9vdCcgfSlcbmV4cG9ydCBjbGFzcyBDcm9wU2VydmljZSB7XG5cbiAgY3JvcChzb3VyY2VJbWFnZTogRWxlbWVudFJlZiwgbG9hZGVkSW1hZ2U6IExvYWRlZEltYWdlLCBjcm9wcGVyOiBDcm9wcGVyUG9zaXRpb24sIHNldHRpbmdzOiBDcm9wcGVyU2V0dGluZ3MpOiBJbWFnZUNyb3BwZWRFdmVudCB8IG51bGwge1xuICAgIGNvbnN0IGltYWdlUG9zaXRpb24gPSB0aGlzLmdldEltYWdlUG9zaXRpb24oc291cmNlSW1hZ2UsIGxvYWRlZEltYWdlLCBjcm9wcGVyLCBzZXR0aW5ncyk7XG4gICAgY29uc3Qgd2lkdGggPSBpbWFnZVBvc2l0aW9uLngyIC0gaW1hZ2VQb3NpdGlvbi54MTtcbiAgICBjb25zdCBoZWlnaHQgPSBpbWFnZVBvc2l0aW9uLnkyIC0gaW1hZ2VQb3NpdGlvbi55MTtcbiAgICBjb25zdCBjcm9wQ2FudmFzID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnY2FudmFzJykgYXMgSFRNTENhbnZhc0VsZW1lbnQ7XG4gICAgY3JvcENhbnZhcy53aWR0aCA9IHdpZHRoO1xuICAgIGNyb3BDYW52YXMuaGVpZ2h0ID0gaGVpZ2h0O1xuXG4gICAgY29uc3QgY3R4ID0gY3JvcENhbnZhcy5nZXRDb250ZXh0KCcyZCcpO1xuICAgIGlmICghY3R4KSB7XG4gICAgICByZXR1cm4gbnVsbDtcbiAgICB9XG4gICAgaWYgKHNldHRpbmdzLmJhY2tncm91bmRDb2xvciAhPSBudWxsKSB7XG4gICAgICBjdHguZmlsbFN0eWxlID0gc2V0dGluZ3MuYmFja2dyb3VuZENvbG9yO1xuICAgICAgY3R4LmZpbGxSZWN0KDAsIDAsIHdpZHRoLCBoZWlnaHQpO1xuICAgIH1cblxuICAgIGNvbnN0IHNjYWxlWCA9IChzZXR0aW5ncy50cmFuc2Zvcm0uc2NhbGUgfHwgMSkgKiAoc2V0dGluZ3MudHJhbnNmb3JtLmZsaXBIID8gLTEgOiAxKTtcbiAgICBjb25zdCBzY2FsZVkgPSAoc2V0dGluZ3MudHJhbnNmb3JtLnNjYWxlIHx8IDEpICogKHNldHRpbmdzLnRyYW5zZm9ybS5mbGlwViA/IC0xIDogMSk7XG5cbiAgICBjb25zdCB0cmFuc2Zvcm1lZEltYWdlID0gbG9hZGVkSW1hZ2UudHJhbnNmb3JtZWQ7XG4gICAgY3R4LnNldFRyYW5zZm9ybShzY2FsZVgsIDAsIDAsIHNjYWxlWSwgdHJhbnNmb3JtZWRJbWFnZS5zaXplLndpZHRoIC8gMiwgdHJhbnNmb3JtZWRJbWFnZS5zaXplLmhlaWdodCAvIDIpO1xuICAgIGN0eC50cmFuc2xhdGUoLWltYWdlUG9zaXRpb24ueDEgLyBzY2FsZVgsIC1pbWFnZVBvc2l0aW9uLnkxIC8gc2NhbGVZKTtcbiAgICBjdHgucm90YXRlKChzZXR0aW5ncy50cmFuc2Zvcm0ucm90YXRlIHx8IDApICogTWF0aC5QSSAvIDE4MCk7XG5cbiAgICBjb25zdCB0cmFuc2xhdGVIID0gc2V0dGluZ3MudHJhbnNmb3JtLnRyYW5zbGF0ZUggPyBwZXJjZW50YWdlKHNldHRpbmdzLnRyYW5zZm9ybS50cmFuc2xhdGVILCB0cmFuc2Zvcm1lZEltYWdlLnNpemUud2lkdGgpIDogMDtcbiAgICBjb25zdCB0cmFuc2xhdGVWID0gc2V0dGluZ3MudHJhbnNmb3JtLnRyYW5zbGF0ZVYgPyBwZXJjZW50YWdlKHNldHRpbmdzLnRyYW5zZm9ybS50cmFuc2xhdGVWLCB0cmFuc2Zvcm1lZEltYWdlLnNpemUuaGVpZ2h0KSA6IDA7XG5cbiAgICBjdHguZHJhd0ltYWdlKFxuICAgICAgdHJhbnNmb3JtZWRJbWFnZS5pbWFnZSxcbiAgICAgIHRyYW5zbGF0ZUggLSB0cmFuc2Zvcm1lZEltYWdlLnNpemUud2lkdGggLyAyLFxuICAgICAgdHJhbnNsYXRlViAtIHRyYW5zZm9ybWVkSW1hZ2Uuc2l6ZS5oZWlnaHQgLyAyXG4gICAgKTtcblxuICAgIGNvbnN0IG91dHB1dDogSW1hZ2VDcm9wcGVkRXZlbnQgPSB7XG4gICAgICB3aWR0aCwgaGVpZ2h0LFxuICAgICAgaW1hZ2VQb3NpdGlvbixcbiAgICAgIGNyb3BwZXJQb3NpdGlvbjogeyAuLi5jcm9wcGVyIH1cbiAgICB9O1xuICAgIGlmIChzZXR0aW5ncy5jb250YWluV2l0aGluQXNwZWN0UmF0aW8pIHtcbiAgICAgIG91dHB1dC5vZmZzZXRJbWFnZVBvc2l0aW9uID0gdGhpcy5nZXRPZmZzZXRJbWFnZVBvc2l0aW9uKHNvdXJjZUltYWdlLCBsb2FkZWRJbWFnZSwgY3JvcHBlciwgc2V0dGluZ3MpO1xuICAgIH1cbiAgICBjb25zdCByZXNpemVSYXRpbyA9IHRoaXMuZ2V0UmVzaXplUmF0aW8od2lkdGgsIGhlaWdodCwgc2V0dGluZ3MpO1xuICAgIGlmIChyZXNpemVSYXRpbyAhPT0gMSkge1xuICAgICAgb3V0cHV0LndpZHRoID0gTWF0aC5yb3VuZCh3aWR0aCAqIHJlc2l6ZVJhdGlvKTtcbiAgICAgIG91dHB1dC5oZWlnaHQgPSBzZXR0aW5ncy5tYWludGFpbkFzcGVjdFJhdGlvXG4gICAgICAgID8gTWF0aC5yb3VuZChvdXRwdXQud2lkdGggLyBzZXR0aW5ncy5hc3BlY3RSYXRpbylcbiAgICAgICAgOiBNYXRoLnJvdW5kKGhlaWdodCAqIHJlc2l6ZVJhdGlvKTtcbiAgICAgIHJlc2l6ZUNhbnZhcyhjcm9wQ2FudmFzLCBvdXRwdXQud2lkdGgsIG91dHB1dC5oZWlnaHQpO1xuICAgIH1cbiAgICBvdXRwdXQuYmFzZTY0ID0gY3JvcENhbnZhcy50b0RhdGFVUkwoJ2ltYWdlLycgKyBzZXR0aW5ncy5mb3JtYXQsIHRoaXMuZ2V0UXVhbGl0eShzZXR0aW5ncykpO1xuICAgIHJldHVybiBvdXRwdXQ7XG4gIH1cblxuICBwcml2YXRlIGdldEltYWdlUG9zaXRpb24oc291cmNlSW1hZ2U6IEVsZW1lbnRSZWYsIGxvYWRlZEltYWdlOiBMb2FkZWRJbWFnZSwgY3JvcHBlcjogQ3JvcHBlclBvc2l0aW9uLCBzZXR0aW5nczogQ3JvcHBlclNldHRpbmdzKTogQ3JvcHBlclBvc2l0aW9uIHtcbiAgICBjb25zdCBzb3VyY2VJbWFnZUVsZW1lbnQgPSBzb3VyY2VJbWFnZS5uYXRpdmVFbGVtZW50O1xuICAgIGNvbnN0IHJhdGlvID0gbG9hZGVkSW1hZ2UudHJhbnNmb3JtZWQuc2l6ZS53aWR0aCAvIHNvdXJjZUltYWdlRWxlbWVudC5vZmZzZXRXaWR0aDtcblxuICAgIGNvbnN0IG91dDogQ3JvcHBlclBvc2l0aW9uID0ge1xuICAgICAgeDE6IE1hdGgucm91bmQoY3JvcHBlci54MSAqIHJhdGlvKSxcbiAgICAgIHkxOiBNYXRoLnJvdW5kKGNyb3BwZXIueTEgKiByYXRpbyksXG4gICAgICB4MjogTWF0aC5yb3VuZChjcm9wcGVyLngyICogcmF0aW8pLFxuICAgICAgeTI6IE1hdGgucm91bmQoY3JvcHBlci55MiAqIHJhdGlvKVxuICAgIH07XG5cbiAgICBpZiAoIXNldHRpbmdzLmNvbnRhaW5XaXRoaW5Bc3BlY3RSYXRpbykge1xuICAgICAgb3V0LngxID0gTWF0aC5tYXgob3V0LngxLCAwKTtcbiAgICAgIG91dC55MSA9IE1hdGgubWF4KG91dC55MSwgMCk7XG4gICAgICBvdXQueDIgPSBNYXRoLm1pbihvdXQueDIsIGxvYWRlZEltYWdlLnRyYW5zZm9ybWVkLnNpemUud2lkdGgpO1xuICAgICAgb3V0LnkyID0gTWF0aC5taW4ob3V0LnkyLCBsb2FkZWRJbWFnZS50cmFuc2Zvcm1lZC5zaXplLmhlaWdodCk7XG4gICAgfVxuXG4gICAgcmV0dXJuIG91dDtcbiAgfVxuXG4gIHByaXZhdGUgZ2V0T2Zmc2V0SW1hZ2VQb3NpdGlvbihzb3VyY2VJbWFnZTogRWxlbWVudFJlZiwgbG9hZGVkSW1hZ2U6IExvYWRlZEltYWdlLCBjcm9wcGVyOiBDcm9wcGVyUG9zaXRpb24sIHNldHRpbmdzOiBDcm9wcGVyU2V0dGluZ3MpOiBDcm9wcGVyUG9zaXRpb24ge1xuICAgIGNvbnN0IGNhbnZhc1JvdGF0aW9uID0gc2V0dGluZ3MuY2FudmFzUm90YXRpb24gKyBsb2FkZWRJbWFnZS5leGlmVHJhbnNmb3JtLnJvdGF0ZTtcbiAgICBjb25zdCBzb3VyY2VJbWFnZUVsZW1lbnQgPSBzb3VyY2VJbWFnZS5uYXRpdmVFbGVtZW50O1xuICAgIGNvbnN0IHJhdGlvID0gbG9hZGVkSW1hZ2UudHJhbnNmb3JtZWQuc2l6ZS53aWR0aCAvIHNvdXJjZUltYWdlRWxlbWVudC5vZmZzZXRXaWR0aDtcbiAgICBsZXQgb2Zmc2V0WDogbnVtYmVyO1xuICAgIGxldCBvZmZzZXRZOiBudW1iZXI7XG5cbiAgICBpZiAoY2FudmFzUm90YXRpb24gJSAyKSB7XG4gICAgICBvZmZzZXRYID0gKGxvYWRlZEltYWdlLnRyYW5zZm9ybWVkLnNpemUud2lkdGggLSBsb2FkZWRJbWFnZS5vcmlnaW5hbC5zaXplLmhlaWdodCkgLyAyO1xuICAgICAgb2Zmc2V0WSA9IChsb2FkZWRJbWFnZS50cmFuc2Zvcm1lZC5zaXplLmhlaWdodCAtIGxvYWRlZEltYWdlLm9yaWdpbmFsLnNpemUud2lkdGgpIC8gMjtcbiAgICB9IGVsc2Uge1xuICAgICAgb2Zmc2V0WCA9IChsb2FkZWRJbWFnZS50cmFuc2Zvcm1lZC5zaXplLndpZHRoIC0gbG9hZGVkSW1hZ2Uub3JpZ2luYWwuc2l6ZS53aWR0aCkgLyAyO1xuICAgICAgb2Zmc2V0WSA9IChsb2FkZWRJbWFnZS50cmFuc2Zvcm1lZC5zaXplLmhlaWdodCAtIGxvYWRlZEltYWdlLm9yaWdpbmFsLnNpemUuaGVpZ2h0KSAvIDI7XG4gICAgfVxuXG4gICAgY29uc3Qgb3V0OiBDcm9wcGVyUG9zaXRpb24gPSB7XG4gICAgICB4MTogTWF0aC5yb3VuZChjcm9wcGVyLngxICogcmF0aW8pIC0gb2Zmc2V0WCxcbiAgICAgIHkxOiBNYXRoLnJvdW5kKGNyb3BwZXIueTEgKiByYXRpbykgLSBvZmZzZXRZLFxuICAgICAgeDI6IE1hdGgucm91bmQoY3JvcHBlci54MiAqIHJhdGlvKSAtIG9mZnNldFgsXG4gICAgICB5MjogTWF0aC5yb3VuZChjcm9wcGVyLnkyICogcmF0aW8pIC0gb2Zmc2V0WVxuICAgIH07XG5cbiAgICBpZiAoIXNldHRpbmdzLmNvbnRhaW5XaXRoaW5Bc3BlY3RSYXRpbykge1xuICAgICAgb3V0LngxID0gTWF0aC5tYXgob3V0LngxLCAwKTtcbiAgICAgIG91dC55MSA9IE1hdGgubWF4KG91dC55MSwgMCk7XG4gICAgICBvdXQueDIgPSBNYXRoLm1pbihvdXQueDIsIGxvYWRlZEltYWdlLnRyYW5zZm9ybWVkLnNpemUud2lkdGgpO1xuICAgICAgb3V0LnkyID0gTWF0aC5taW4ob3V0LnkyLCBsb2FkZWRJbWFnZS50cmFuc2Zvcm1lZC5zaXplLmhlaWdodCk7XG4gICAgfVxuXG4gICAgcmV0dXJuIG91dDtcbiAgfVxuXG4gIGdldFJlc2l6ZVJhdGlvKHdpZHRoOiBudW1iZXIsIGhlaWdodDogbnVtYmVyLCBzZXR0aW5nczogQ3JvcHBlclNldHRpbmdzKTogbnVtYmVyIHtcbiAgICBjb25zdCByYXRpb1dpZHRoID0gc2V0dGluZ3MucmVzaXplVG9XaWR0aCAvIHdpZHRoO1xuICAgIGNvbnN0IHJhdGlvSGVpZ2h0ID0gc2V0dGluZ3MucmVzaXplVG9IZWlnaHQgLyBoZWlnaHQ7XG4gICAgY29uc3QgcmF0aW9zID0gbmV3IEFycmF5PG51bWJlcj4oKTtcblxuICAgIGlmIChzZXR0aW5ncy5yZXNpemVUb1dpZHRoID4gMCkge1xuICAgICAgcmF0aW9zLnB1c2gocmF0aW9XaWR0aCk7XG4gICAgfVxuICAgIGlmIChzZXR0aW5ncy5yZXNpemVUb0hlaWdodCA+IDApIHtcbiAgICAgIHJhdGlvcy5wdXNoKHJhdGlvSGVpZ2h0KTtcbiAgICB9XG5cbiAgICBjb25zdCByZXN1bHQgPSByYXRpb3MubGVuZ3RoID09PSAwID8gMSA6IE1hdGgubWluKC4uLnJhdGlvcyk7XG5cbiAgICBpZiAocmVzdWx0ID4gMSAmJiAhc2V0dGluZ3Mub25seVNjYWxlRG93bikge1xuICAgICAgcmV0dXJuIHJlc3VsdDtcbiAgICB9XG4gICAgcmV0dXJuIE1hdGgubWluKHJlc3VsdCwgMSk7XG4gIH1cblxuICBnZXRRdWFsaXR5KHNldHRpbmdzOiBDcm9wcGVyU2V0dGluZ3MpOiBudW1iZXIge1xuICAgIHJldHVybiBNYXRoLm1pbigxLCBNYXRoLm1heCgwLCBzZXR0aW5ncy5pbWFnZVF1YWxpdHkgLyAxMDApKTtcbiAgfVxufVxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3JvcC5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWltYWdlLWNyb3BwZXIvc3JjL2xpYi9zZXJ2aWNlcy9jcm9wLnNlcnZpY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFjLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUd2RCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDckQsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLDJCQUEyQixDQUFDOztBQUd2RCxNQUFNLE9BQU8sV0FBVztJQUV0QixJQUFJLENBQUMsV0FBdUIsRUFBRSxXQUF3QixFQUFFLE9BQXdCLEVBQUUsUUFBeUI7UUFDekcsTUFBTSxhQUFhLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFdBQVcsRUFBRSxXQUFXLEVBQUUsT0FBTyxFQUFFLFFBQVEsQ0FBQyxDQUFDO1FBQ3pGLE1BQU0sS0FBSyxHQUFHLGFBQWEsQ0FBQyxFQUFFLEdBQUcsYUFBYSxDQUFDLEVBQUUsQ0FBQztRQUNsRCxNQUFNLE1BQU0sR0FBRyxhQUFhLENBQUMsRUFBRSxHQUFHLGFBQWEsQ0FBQyxFQUFFLENBQUM7UUFDbkQsTUFBTSxVQUFVLEdBQUcsUUFBUSxDQUFDLGFBQWEsQ0FBQyxRQUFRLENBQXNCLENBQUM7UUFDekUsVUFBVSxDQUFDLEtBQUssR0FBRyxLQUFLLENBQUM7UUFDekIsVUFBVSxDQUFDLE1BQU0sR0FBRyxNQUFNLENBQUM7UUFFM0IsTUFBTSxHQUFHLEdBQUcsVUFBVSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUN4QyxJQUFJLENBQUMsR0FBRyxFQUFFO1lBQ1IsT0FBTyxJQUFJLENBQUM7U0FDYjtRQUNELElBQUksUUFBUSxDQUFDLGVBQWUsSUFBSSxJQUFJLEVBQUU7WUFDcEMsR0FBRyxDQUFDLFNBQVMsR0FBRyxRQUFRLENBQUMsZUFBZSxDQUFD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LENBQUMsYUFBYSxHQUFHLENBQUMsRUFBRTtZQUM5QixNQUFNLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1NBQ3pCO1FBQ0QsSUFBSSxRQUFRLENBQUMsY0FBYyxHQUFHLENBQUMsRUFBRTtZQUMvQixNQUFNLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1NBQzFCO1FBRUQsTUFBTSxNQUFNLEdBQUcsTUFBTSxDQUFDLE1BQU0sS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxHQUFHLE1BQU0sQ0FBQyxDQUFDO1FBRTdELElBQUksTUFBTSxHQUFHLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxhQUFhLEVBQUU7WUFDekMsT0FBTyxNQUFNLENBQUM7U0FDZjtRQUNELE9BQU8sSUFBSSxDQUFDLEdBQUcsQ0FBQyxNQUFNLEVBQUUsQ0FBQyxDQUFDLENBQUM7SUFDN0IsQ0FBQztJQUVELFVBQVUsQ0FBQyxRQUF5QjtRQUNsQyxPQUFPLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxFQUFFLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxFQUFFLFFBQVEsQ0FBQyxZQUFZLEdBQUcsR0FBRyxDQUFDLENBQUMsQ0FBQztJQUMvRCxDQUFDOzt3R0FuSlUsV0FBVzs0R0FBWCxXQUFXLGNBREMsTUFBTTsyRkFDbEIsV0FBVztrQkFEdkIsVUFBVTttQkFBQyxFQUFDLFVBQVUsRUFBRSxNQUFNLEVBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBFbGVtZW50UmVmLCBJbmplY3RhYmxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDcm9wcGVyUG9zaXRpb24sIEltYWdlQ3JvcHBlZEV2ZW50LCBMb2FkZWRJbWFnZSB9IGZyb20gJy4uL2ludGVyZmFjZXMnO1xuaW1wb3J0IHsgQ3JvcHBlclNldHRpbmdzIH0gZnJvbSAnLi4vaW50ZXJmYWNlcy9jcm9wcGVyLnNldHRpbmdzJztcbmltcG9ydCB7IHJlc2l6ZUNhbnZhcyB9IGZyb20gJy4uL3V0aWxzL3Jlc2l6ZS51dGlscyc7XG5pbXBvcnQgeyBwZXJjZW50YWdlIH0gZnJvbSAnLi4vdXRpbHMvcGVyY2VudGFnZS51dGlscyc7XG5cbkBJbmplY3RhYmxlKHtwcm92aWRlZEluOiAncm9vdCd9KVxuZXhwb3J0IGNsYXNzIENyb3BTZXJ2aWNlIHtcblxuICBjcm9wKHNvdXJjZUltYWdlOiBFbGVtZW50UmVmLCBsb2FkZWRJbWFnZTogTG9hZGVkSW1hZ2UsIGNyb3BwZXI6IENyb3BwZXJQb3NpdGlvbiwgc2V0dGluZ3M6IENyb3BwZXJTZXR0aW5ncyk6IEltYWdlQ3JvcHBlZEV2ZW50IHwgbnVsbCB7XG4gICAgY29uc3QgaW1hZ2VQb3NpdGlvbiA9IHRoaXMuZ2V0SW1hZ2VQb3NpdGlvbihzb3VyY2VJbWFnZSwgbG9hZGVkSW1hZ2UsIGNyb3BwZXIsIHNldHRpbmdzKTtcbiAgICBjb25zdCB3aWR0aCA9IGltYWdlUG9zaXRpb24ueDIgLSBpbWFnZVBvc2l0aW9uLngxO1xuICAgIGNvbnN0IGhlaWdodCA9IGltYWdlUG9zaXRpb24ueTIgLSBpbWFnZVBvc2l0aW9uLnkxO1xuICAgIGNvbnN0IGNyb3BDYW52YXMgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdjYW52YXMnKSBhcyBIVE1MQ2FudmFzRWxlbWVudDtcbiAgICBjcm9wQ2FudmFzLndpZHRoID0gd2lkdGg7XG4gICAgY3JvcENhbnZhcy5oZWlnaHQgPSBoZWlnaHQ7XG5cbiAgICBjb25zdCBjdHggPSBjcm9wQ2FudmFzLmdldENvbnRleHQoJzJkJyk7XG4gICAgaWYgKCFjdHgpIHtcbiAgICAgIHJldHVybiBudWxsO1xuICAgIH1cbiAgICBpZiAoc2V0dGluZ3MuYmFja2dyb3VuZENvbG9yICE9IG51bGwpIHtcbiAgICAgIGN0eC5maWxsU3R5bGUgPSBzZXR0aW5ncy5iYWNrZ3JvdW5kQ29sb3I7XG4gICAgICBjdHguZmlsbFJlY3QoMCwgMCwgd2lkdGgsIGhlaWdodCk7XG4gICAgfVxuXG4gICAgY29uc3Qgc2NhbGVYID0gKHNldHRpbmdzLnRyYW5zZm9ybS5zY2FsZSB8fCAxKSAqIChzZXR0aW5ncy50cmFuc2Zvcm0uZmxpcEggPyAtMSA6IDEpO1xuICAgIGNvbnN0IHNjYWxlWSA9IChzZXR0aW5ncy50cmFuc2Zvcm0uc2NhbGUgfHwgMSkgKiAoc2V0dGluZ3MudHJhbnNmb3JtLmZsaXBWID8gLTEgOiAxKTtcbiAgICBjb25zdCB7dHJhbnNsYXRlSCwgdHJhbnNsYXRlVn0gPSB0aGlzLmdldENhbnZhc1RyYW5zbGF0ZShzb3VyY2VJbWFnZSwgbG9hZGVkSW1hZ2UsIHNldHRpbmdzKTtcblxuICAgIGNvbnN0IHRyYW5zZm9ybWVkSW1hZ2UgPSBsb2FkZWRJbWFnZS50cmFuc2Zvcm1lZDtcbiAgICBjdHguc2V0VHJhbnNmb3JtKHNjYWxlWCwgMCwgMCwgc2NhbGVZLCB0cmFuc2Zvcm1lZEltYWdlLnNpemUud2lkdGggLyAyICsgdHJhbnNsYXRlSCwgdHJhbnNmb3JtZWRJbWFnZS5zaXplLmhlaWdodCAvIDIgKyB0cmFuc2xhdGVWKTtcbiAgICBjdHgudHJhbnNsYXRlKC1pbWFnZVBvc2l0aW9uLngxIC8gc2NhbGVYLCAtaW1hZ2VQb3NpdGlvbi55MSAvIHNjYWxlWSk7XG4gICAgY3R4LnJvdGF0ZSgoc2V0dGluZ3MudHJhbnNmb3JtLnJvdGF0ZSB8fCAwKSAqIE1hdGguUEkgLyAxODApO1xuXG4gICAgY3R4LmRyYXdJbWFnZShcbiAgICAgIHRyYW5zZm9ybWVkSW1hZ2UuaW1hZ2UsXG4gICAgICAtdHJhbnNmb3JtZWRJbWFnZS5zaXplLndpZHRoIC8gMixcbiAgICAgIC10cmFuc2Zvcm1lZEltYWdlLnNpemUuaGVpZ2h0IC8gMlxuICAgICk7XG5cbiAgICBjb25zdCBvdXRwdXQ6IEltYWdlQ3JvcHBlZEV2ZW50ID0ge1xuICAgICAgd2lkdGgsIGhlaWdodCxcbiAgICAgIGltYWdlUG9zaXRpb24sXG4gICAgICBjcm9wcGVyUG9zaXRpb246IHsuLi5jcm9wcGVyfVxuICAgIH07XG4gICAgaWYgKHNldHRpbmdzLmNvbnRhaW5XaXRoaW5Bc3BlY3RSYXRpbykge1xuICAgICAgb3V0cHV0Lm9mZnNldEltYWdlUG9zaXRpb24gPSB0aGlzLmdldE9mZnNldEltYWdlUG9zaXRpb24oc291cmNlSW1hZ2UsIGxvYWRlZEltYWdlLCBjcm9wcGVyLCBzZXR0aW5ncyk7XG4gICAgfVxuICAgIGNvbnN0IHJlc2l6ZVJhdGlvID0gdGhpcy5nZXRSZXNpemVSYXRpbyh3aWR0aCwgaGVpZ2h0LCBzZXR0aW5ncyk7XG4gICAgaWYgKHJlc2l6ZVJhdGlvICE9PSAxKSB7XG4gICAgICBvdXRwdXQud2lkdGggPSBNYXRoLnJvdW5kKHdpZHRoICogcmVzaXplUmF0aW8pO1xuICAgICAgb3V0cHV0LmhlaWdodCA9IHNldHRpbmdzLm1haW50YWluQXNwZWN0UmF0aW9cbiAgICAgICAgPyBNYXRoLnJvdW5kKG91dHB1dC53aWR0aCAvIHNldHRpbmdzLmFzcGVjdFJhdGlvKVxuICAgICAgICA6IE1hdGgucm91bmQoaGVpZ2h0ICogcmVzaXplUmF0aW8pO1xuICAgICAgcmVzaXplQ2FudmFzKGNyb3BDYW52YXMsIG91dHB1dC53aWR0aCwgb3V0cHV0LmhlaWdodCk7XG4gICAgfVxuICAgIG91dHB1dC5iYXNlNjQgPSBjcm9wQ2FudmFzLnRvRGF0YVVSTCgnaW1hZ2UvJyArIHNldHRpbmdzLmZvcm1hdCwgdGhpcy5nZXRRdWFsaXR5KHNldHRpbmdzKSk7XG4gICAgcmV0dXJuIG91dHB1dDtcbiAgfVxuXG4gIHByaXZhdGUgZ2V0Q2FudmFzVHJhbnNsYXRlKHNvdXJjZUltYWdlOiBFbGVtZW50UmVmLCBsb2FkZWRJbWFnZTogTG9hZGVkSW1hZ2UsIHNldHRpbmdzOiBDcm9wcGVyU2V0dGluZ3MpOiB7IHRyYW5zbGF0ZUg6IG51bWJlciwgdHJhbnNsYXRlVjogbnVtYmVyIH0ge1xuICAgIGlmIChzZXR0aW5ncy50cmFuc2Zvcm0udHJhbnNsYXRlVW5pdCA9PT0gJ3B4Jykge1xuICAgICAgY29uc3QgcmF0aW8gPSB0aGlzLmdldFJhdGlvKHNvdXJjZUltYWdlLCBsb2FkZWRJbWFnZSk7XG4gICAgICByZXR1cm4ge1xuICAgICAgICB0cmFuc2xhdGVIOiAoc2V0dGluZ3MudHJhbnNmb3JtLnRyYW5zbGF0ZUggfHwgMCkgKiByYXRpbyxcbiAgICAgICAgdHJhbnNsYXRlVjogKHNldHRpbmdzLnRyYW5zZm9ybS50cmFuc2xhdGVWIHx8IDApICogcmF0aW9cbiAgICAgIH07XG4gICAgfSBlbHNlIHtcbiAgICAgIHJldHVybiB7XG4gICAgICAgIHRyYW5zbGF0ZUg6IHNldHRpbmdzLnRyYW5zZm9ybS50cmFuc2xhdGVIID8gcGVyY2VudGFnZShzZXR0aW5ncy50cmFuc2Zvcm0udHJhbnNsYXRlSCwgbG9hZGVkSW1hZ2UudHJhbnNmb3JtZWQuc2l6ZS53aWR0aCkgOiAwLFxuICAgICAgICB0cmFuc2xhdGVWOiBzZXR0aW5ncy50cmFuc2Zvcm0udHJhbnNsYXRlViA/IHBlcmNlbnRhZ2Uoc2V0dGluZ3MudHJhbnNmb3JtLnRyYW5zbGF0ZVYsIGxvYWRlZEltYWdlLnRyYW5zZm9ybWVkLnNpemUuaGVpZ2h0KSA6IDBcbiAgICAgIH07XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBnZXRSYXRpbyhzb3VyY2VJbWFnZTogRWxlbWVudFJlZiwgbG9hZGVkSW1hZ2U6IExvYWRlZEltYWdlKTogbnVtYmVyIHtcbiAgICBjb25zdCBzb3VyY2VJbWFnZUVsZW1lbnQgPSBzb3VyY2VJbWFnZS5uYXRpdmVFbGVtZW50O1xuICAgIHJldHVybiBsb2FkZWRJbWFnZS50cmFuc2Zvcm1lZC5zaXplLndpZHRoIC8gc291cmNlSW1hZ2VFbGVtZW50Lm9mZnNldFdpZHRoO1xuICB9XG5cbiAgcHJpdmF0ZSBnZXRJbWFnZVBvc2l0aW9uKHNvdXJjZUltYWdlOiBFbGVtZW50UmVmLCBsb2FkZWRJbWFnZTogTG9hZGVkSW1hZ2UsIGNyb3BwZXI6IENyb3BwZXJQb3NpdGlvbiwgc2V0dGluZ3M6IENyb3BwZXJTZXR0aW5ncyk6IENyb3BwZXJQb3NpdGlvbiB7XG4gICAgY29uc3QgcmF0aW8gPSB0aGlzLmdldFJhdGlvKHNvdXJjZUltYWdlLCBsb2FkZWRJbWFnZSk7XG4gICAgY29uc3Qgb3V0OiBDcm9wcGVyUG9zaXRpb24gPSB7XG4gICAgICB4MTogTWF0aC5yb3VuZChjcm9wcGVyLngxICogcmF0aW8pLFxuICAgICAgeTE6IE1hdGgucm91bmQoY3JvcHBlci55MSAqIHJhdGlvKSxcbiAgICAgIHgyOiBNYXRoLnJvdW5kKGNyb3BwZXIueDIgKiByYXRpbyksXG4gICAgICB5MjogTWF0aC5yb3VuZChjcm9wcGVyLnkyICogcmF0aW8pXG4gICAgfTtcblxuICAgIGlmICghc2V0dGluZ3MuY29udGFpbldpdGhpbkFzcGVjdFJhdGlvKSB7XG4gICAgICBvdXQueDEgPSBNYXRoLm1heChvdXQueDEsIDApO1xuICAgICAgb3V0LnkxID0gTWF0aC5tYXgob3V0LnkxLCAwKTtcbiAgICAgIG91dC54MiA9IE1hdGgubWluKG91dC54MiwgbG9hZGVkSW1hZ2UudHJhbnNmb3JtZWQuc2l6ZS53aWR0aCk7XG4gICAgICBvdXQueTIgPSBNYXRoLm1pbihvdXQueTIsIGxvYWRlZEltYWdlLnRyYW5zZm9ybWVkLnNpemUuaGVpZ2h0KTtcbiAgICB9XG5cbiAgICByZXR1cm4gb3V0O1xuICB9XG5cbiAgcHJpdmF0ZSBnZXRPZmZzZXRJbWFnZVBvc2l0aW9uKHNvdXJjZUltYWdlOiBFbGVtZW50UmVmLCBsb2FkZWRJbWFnZTogTG9hZGVkSW1hZ2UsIGNyb3BwZXI6IENyb3BwZXJQb3NpdGlvbiwgc2V0dGluZ3M6IENyb3BwZXJTZXR0aW5ncyk6IENyb3BwZXJQb3NpdGlvbiB7XG4gICAgY29uc3QgY2FudmFzUm90YXRpb24gPSBzZXR0aW5ncy5jYW52YXNSb3RhdGlvbiArIGxvYWRlZEltYWdlLmV4aWZUcmFuc2Zvcm0ucm90YXRlO1xuICAgIGNvbnN0IHNvdXJjZUltYWdlRWxlbWVudCA9IHNvdXJjZUltYWdlLm5hdGl2ZUVsZW1lbnQ7XG4gICAgY29uc3QgcmF0aW8gPSBsb2FkZWRJbWFnZS50cmFuc2Zvcm1lZC5zaXplLndpZHRoIC8gc291cmNlSW1hZ2VFbGVtZW50Lm9mZnNldFdpZHRoO1xuICAgIGxldCBvZmZzZXRYOiBudW1iZXI7XG4gICAgbGV0IG9mZnNldFk6IG51bWJlcjtcblxuICAgIGlmIChjYW52YXNSb3RhdGlvbiAlIDIpIHtcbiAgICAgIG9mZnNldFggPSAobG9hZGVkSW1hZ2UudHJhbnNmb3JtZWQuc2l6ZS53aWR0aCAtIGxvYWRlZEltYWdlLm9yaWdpbmFsLnNpemUuaGVpZ2h0KSAvIDI7XG4gICAgICBvZmZzZXRZID0gKGxvYWRlZEltYWdlLnRyYW5zZm9ybWVkLnNpemUuaGVpZ2h0IC0gbG9hZGVkSW1hZ2Uub3JpZ2luYWwuc2l6ZS53aWR0aCkgLyAyO1xuICAgIH0gZWxzZSB7XG4gICAgICBvZmZzZXRYID0gKGxvYWRlZEltYWdlLnRyYW5zZm9ybWVkLnNpemUud2lkdGggLSBsb2FkZWRJbWFnZS5vcmlnaW5hbC5zaXplLndpZHRoKSAvIDI7XG4gICAgICBvZmZzZXRZID0gKGxvYWRlZEltYWdlLnRyYW5zZm9ybWVkLnNpemUuaGVpZ2h0IC0gbG9hZGVkSW1hZ2Uub3JpZ2luYWwuc2l6ZS5oZWlnaHQpIC8gMjtcbiAgICB9XG5cbiAgICBjb25zdCBvdXQ6IENyb3BwZXJQb3NpdGlvbiA9IHtcbiAgICAgIHgxOiBNYXRoLnJvdW5kKGNyb3BwZXIueDEgKiByYXRpbykgLSBvZmZzZXRYLFxuICAgICAgeTE6IE1hdGgucm91bmQoY3JvcHBlci55MSAqIHJhdGlvKSAtIG9mZnNldFksXG4gICAgICB4MjogTWF0aC5yb3VuZChjcm9wcGVyLngyICogcmF0aW8pIC0gb2Zmc2V0WCxcbiAgICAgIHkyOiBNYXRoLnJvdW5kKGNyb3BwZXIueTIgKiByYXRpbykgLSBvZmZzZXRZXG4gICAgfTtcblxuICAgIGlmICghc2V0dGluZ3MuY29udGFpbldpdGhpbkFzcGVjdFJhdGlvKSB7XG4gICAgICBvdXQueDEgPSBNYXRoLm1heChvdXQueDEsIDApO1xuICAgICAgb3V0LnkxID0gTWF0aC5tYXgob3V0LnkxLCAwKTtcbiAgICAgIG91dC54MiA9IE1hdGgubWluKG91dC54MiwgbG9hZGVkSW1hZ2UudHJhbnNmb3JtZWQuc2l6ZS53aWR0aCk7XG4gICAgICBvdXQueTIgPSBNYXRoLm1pbihvdXQueTIsIGxvYWRlZEltYWdlLnRyYW5zZm9ybWVkLnNpemUuaGVpZ2h0KTtcbiAgICB9XG5cbiAgICByZXR1cm4gb3V0O1xuICB9XG5cbiAgZ2V0UmVzaXplUmF0aW8od2lkdGg6IG51bWJlciwgaGVpZ2h0OiBudW1iZXIsIHNldHRpbmdzOiBDcm9wcGVyU2V0dGluZ3MpOiBudW1iZXIge1xuICAgIGNvbnN0IHJhdGlvV2lkdGggPSBzZXR0aW5ncy5yZXNpemVUb1dpZHRoIC8gd2lkdGg7XG4gICAgY29uc3QgcmF0aW9IZWlnaHQgPSBzZXR0aW5ncy5yZXNpemVUb0hlaWdodCAvIGhlaWdodDtcbiAgICBjb25zdCByYXRpb3MgPSBuZXcgQXJyYXk8bnVtYmVyPigpO1xuXG4gICAgaWYgKHNldHRpbmdzLnJlc2l6ZVRvV2lkdGggPiAwKSB7XG4gICAgICByYXRpb3MucHVzaChyYXRpb1dpZHRoKTtcbiAgICB9XG4gICAgaWYgKHNldHRpbmdzLnJlc2l6ZVRvSGVpZ2h0ID4gMCkge1xuICAgICAgcmF0aW9zLnB1c2gocmF0aW9IZWlnaHQpO1xuICAgIH1cblxuICAgIGNvbnN0IHJlc3VsdCA9IHJhdGlvcy5sZW5ndGggPT09IDAgPyAxIDogTWF0aC5taW4oLi4ucmF0aW9zKTtcblxuICAgIGlmIChyZXN1bHQgPiAxICYmICFzZXR0aW5ncy5vbmx5U2NhbGVEb3duKSB7XG4gICAgICByZXR1cm4gcmVzdWx0O1xuICAgIH1cbiAgICByZXR1cm4gTWF0aC5taW4ocmVzdWx0LCAxKTtcbiAgfVxuXG4gIGdldFF1YWxpdHkoc2V0dGluZ3M6IENyb3BwZXJTZXR0aW5ncyk6IG51bWJlciB7XG4gICAgcmV0dXJuIE1hdGgubWluKDEsIE1hdGgubWF4KDAsIHNldHRpbmdzLmltYWdlUXVhbGl0eSAvIDEwMCkpO1xuICB9XG59XG4iXX0=

package/esm2020/public-api.mjs

@@ -1,6 +1,2 @@
-export * from './lib/component/image-cropper.component';
-export * from './lib/image-cropper.module';
-export * from './lib/interfaces';
-export { base64ToFile } from './lib/utils/blob.utils';
-export { resizeCanvas } from './lib/utils/resize.utils';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL25neC1pbWFnZS1jcm9wcGVyL3NyYy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMseUNBQXlDLENBQUM7QUFDeEQsY0FBYyw0QkFBNEIsQ0FBQztBQUMzQyxjQUFjLGtCQUFrQixDQUFDO0FBQ2pDLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUN0RCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sMEJBQTBCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnQvaW1hZ2UtY3JvcHBlci5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvaW1hZ2UtY3JvcHBlci5tb2R1bGUnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvaW50ZXJmYWNlcyc7XG5leHBvcnQgeyBiYXNlNjRUb0ZpbGUgfSBmcm9tICcuL2xpYi91dGlscy9ibG9iLnV0aWxzJztcbmV4cG9ydCB7IHJlc2l6ZUNhbnZhcyB9IGZyb20gJy4vbGliL3V0aWxzL3Jlc2l6ZS51dGlscyc7XG4iXX0=
+export * from './index';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL25neC1pbWFnZS1jcm9wcGVyL3NyYy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsU0FBUyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9pbmRleCc7XG4iXX0=

package/fesm2015/ngx-image-cropper.mjs

@@ -58,6 +58,7 @@ class CropperSettings {
 
 var MoveTypes;
 (function (MoveTypes) {
+    MoveTypes["Drag"] = "drag";
     MoveTypes["Move"] = "move";
     MoveTypes["Resize"] = "resize";
     MoveTypes["Pinch"] = "pinch";
@@ -200,13 +201,12 @@ class CropService {
         }
         const scaleX = (settings.transform.scale || 1) * (settings.transform.flipH ? -1 : 1);
         const scaleY = (settings.transform.scale || 1) * (settings.transform.flipV ? -1 : 1);
+        const { translateH, translateV } = this.getCanvasTranslate(sourceImage, loadedImage, settings);
         const transformedImage = loadedImage.transformed;
-        ctx.setTransform(scaleX, 0, 0, scaleY, transformedImage.size.width / 2, transformedImage.size.height / 2);
+        ctx.setTransform(scaleX, 0, 0, scaleY, transformedImage.size.width / 2 + translateH, transformedImage.size.height / 2 + translateV);
         ctx.translate(-imagePosition.x1 / scaleX, -imagePosition.y1 / scaleY);
         ctx.rotate((settings.transform.rotate || 0) * Math.PI / 180);
-        const translateH = settings.transform.translateH ? percentage(settings.transform.translateH, transformedImage.size.width) : 0;
-        const translateV = settings.transform.translateV ? percentage(settings.transform.translateV, transformedImage.size.height) : 0;
-        ctx.drawImage(transformedImage.image, translateH - transformedImage.size.width / 2, translateV - transformedImage.size.height / 2);
+        ctx.drawImage(transformedImage.image, -transformedImage.size.width / 2, -transformedImage.size.height / 2);
         const output = {
             width, height,
             imagePosition,
@@ -226,9 +226,27 @@ class CropService {
         output.base64 = cropCanvas.toDataURL('image/' + settings.format, this.getQuality(settings));
         return output;
     }
-    getImagePosition(sourceImage, loadedImage, cropper, settings) {
+    getCanvasTranslate(sourceImage, loadedImage, settings) {
+        if (settings.transform.translateUnit === 'px') {
+            const ratio = this.getRatio(sourceImage, loadedImage);
+            return {
+                translateH: (settings.transform.translateH || 0) * ratio,
+                translateV: (settings.transform.translateV || 0) * ratio
+            };
+        }
+        else {
+            return {
+                translateH: settings.transform.translateH ? percentage(settings.transform.translateH, loadedImage.transformed.size.width) : 0,
+                translateV: settings.transform.translateV ? percentage(settings.transform.translateV, loadedImage.transformed.size.height) : 0
+            };
+        }
+    }
+    getRatio(sourceImage, loadedImage) {
         const sourceImageElement = sourceImage.nativeElement;
-        const ratio = loadedImage.transformed.size.width / sourceImageElement.offsetWidth;
+        return loadedImage.transformed.size.width / sourceImageElement.offsetWidth;
+    }
+    getImagePosition(sourceImage, loadedImage, cropper, settings) {
+        const ratio = this.getRatio(sourceImage, loadedImage);
         const out = {
             x1: Math.round(cropper.x1 * ratio),
             y1: Math.round(cropper.y1 * ratio),
@@ -795,6 +813,7 @@ class ImageCropperComponent {
         this.backgroundColor = this.settings.backgroundColor;
         this.containWithinAspectRatio = this.settings.containWithinAspectRatio;
         this.hideResizeSquares = this.settings.hideResizeSquares;
+        this.allowMoveImage = false;
         this.cropper = {
             x1: -100,
             y1: -100,
@@ -808,6 +827,7 @@ class ImageCropperComponent {
         this.imageLoaded = new EventEmitter();
         this.cropperReady = new EventEmitter();
         this.loadImageFailed = new EventEmitter();
+        this.transformChange = new EventEmitter();
         this.reset();
     }
     ngOnChanges(changes) {
@@ -837,6 +857,7 @@ class ImageCropperComponent {
             this.transform = this.transform || {};
             this.setCssTransform();
             this.doAutoCrop();
+            this.cd.markForCheck();
         }
     }
     onChangesUpdateSettings(changes) {
@@ -874,10 +895,12 @@ class ImageCropperComponent {
         return ((_c = (_b = (_a = this.imageChangedEvent) === null || _a === void 0 ? void 0 : _a.target) === null || _b === void 0 ? void 0 : _b.files) === null || _c === void 0 ? void 0 : _c.length) > 0;
     }
     setCssTransform() {
-        this.safeTransformStyle = this.sanitizer.bypassSecurityTrustStyle('scaleX(' + (this.transform.scale || 1) * (this.transform.flipH ? -1 : 1) + ')' +
-            'scaleY(' + (this.transform.scale || 1) * (this.transform.flipV ? -1 : 1) + ')' +
-            'rotate(' + (this.transform.rotate || 0) + 'deg)' +
-            `translate(${this.transform.translateH || 0}%, ${this.transform.translateV || 0}%)`);
+        var _a;
+        const translateUnit = ((_a = this.transform) === null || _a === void 0 ? void 0 : _a.translateUnit) || '%';
+        this.safeTransformStyle = this.sanitizer.bypassSecurityTrustStyle(`translate(${this.transform.translateH || 0}${translateUnit}, ${this.transform.translateV || 0}${translateUnit})` +
+            ' scaleX(' + (this.transform.scale || 1) * (this.transform.flipH ? -1 : 1) + ')' +
+            ' scaleY(' + (this.transform.scale || 1) * (this.transform.flipV ? -1 : 1) + ')' +
+            ' rotate(' + (this.transform.rotate || 0) + 'deg)');
     }
     ngOnInit() {
         this.settings.stepSize = this.initialStepSize;
@@ -1025,13 +1048,15 @@ class ImageCropperComponent {
     }
     startMove(event, moveType, position = null) {
         var _a, _b;
-        if (((_a = this.moveStart) === null || _a === void 0 ? void 0 : _a.active) && ((_b = this.moveStart) === null || _b === void 0 ? void 0 : _b.type) === MoveTypes.Pinch) {
+        if (this.disabled
+            || ((_a = this.moveStart) === null || _a === void 0 ? void 0 : _a.active) && ((_b = this.moveStart) === null || _b === void 0 ? void 0 : _b.type) === MoveTypes.Pinch
+            || moveType === MoveTypes.Drag && !this.allowMoveImage) {
             return;
         }
         if (event.preventDefault) {
             event.preventDefault();
         }
-        this.moveStart = Object.assign({ active: true, type: moveType, position, clientX: this.cropperPositionService.getClientX(event), clientY: this.cropperPositionService.getClientY(event) }, this.cropper);
+        this.moveStart = Object.assign({ active: true, type: moveType, position, transform: Object.assign({}, this.transform), clientX: this.cropperPositionService.getClientX(event), clientY: this.cropperPositionService.getClientY(event) }, this.cropper);
     }
     startPinch(event) {
         if (!this.safeImgDataUrl) {
@@ -1043,6 +1068,7 @@ class ImageCropperComponent {
         this.moveStart = Object.assign({ active: true, type: MoveTypes.Pinch, position: 'center', clientX: this.cropper.x1 + (this.cropper.x2 - this.cropper.x1) / 2, clientY: this.cropper.y1 + (this.cropper.y2 - this.cropper.y1) / 2 }, this.cropper);
     }
     moveImg(event) {
+        var _a, _b;
         if (this.moveStart.active) {
             if (event.stopPropagation) {
                 event.stopPropagation();
@@ -1060,6 +1086,12 @@ class ImageCropperComponent {
                 }
                 this.checkCropperPosition(false);
             }
+            else if (this.moveStart.type === MoveTypes.Drag) {
+                const diffX = this.cropperPositionService.getClientX(event) - this.moveStart.clientX;
+                const diffY = this.cropperPositionService.getClientY(event) - this.moveStart.clientY;
+                this.transform = Object.assign(Object.assign({}, this.transform), { translateH: (((_a = this.moveStart.transform) === null || _a === void 0 ? void 0 : _a.translateH) || 0) + diffX, translateV: (((_b = this.moveStart.transform) === null || _b === void 0 ? void 0 : _b.translateV) || 0) + diffY });
+                this.setCssTransform();
+            }
             this.cd.detectChanges();
         }
     }
@@ -1152,9 +1184,15 @@ class ImageCropperComponent {
         }
     }
     moveStop() {
+        var _a;
         if (this.moveStart.active) {
             this.moveStart.active = false;
-            this.doAutoCrop();
+            if (((_a = this.moveStart) === null || _a === void 0 ? void 0 : _a.type) === MoveTypes.Drag) {
+                this.transformChange.emit(this.transform);
+            }
+            else {
+                this.doAutoCrop();
+            }
         }
     }
     pinchStop() {
@@ -1182,10 +1220,10 @@ class ImageCropperComponent {
     }
 }
 ImageCropperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ImageCropperComponent, deps: [{ token: CropService }, { token: CropperPositionService }, { token: LoadImageService }, { token: i4.DomSanitizer }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-ImageCropperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: ImageCropperComponent, selector: "image-cropper", inputs: { imageChangedEvent: "imageChangedEvent", imageURL: "imageURL", imageBase64: "imageBase64", imageFile: "imageFile", format: "format", transform: "transform", maintainAspectRatio: "maintainAspectRatio", aspectRatio: "aspectRatio", resizeToWidth: "resizeToWidth", resizeToHeight: "resizeToHeight", cropperMinWidth: "cropperMinWidth", cropperMinHeight: "cropperMinHeight", cropperMaxHeight: "cropperMaxHeight", cropperMaxWidth: "cropperMaxWidth", cropperStaticWidth: "cropperStaticWidth", cropperStaticHeight: "cropperStaticHeight", canvasRotation: "canvasRotation", initialStepSize: "initialStepSize", roundCropper: "roundCropper", onlyScaleDown: "onlyScaleDown", imageQuality: "imageQuality", autoCrop: "autoCrop", backgroundColor: "backgroundColor", containWithinAspectRatio: "containWithinAspectRatio", hideResizeSquares: "hideResizeSquares", cropper: "cropper", alignImage: "alignImage", disabled: "disabled" }, outputs: { imageCropped: "imageCropped", startCropImage: "startCropImage", imageLoaded: "imageLoaded", cropperReady: "cropperReady", loadImageFailed: "loadImageFailed" }, host: { listeners: { "window:resize": "onResize()", "document:mousemove": "moveImg($event)", "document:touchmove": "moveImg($event)", "document:mouseup": "moveStop()", "document:touchend": "moveStop()" }, properties: { "style.text-align": "this.alignImage", "class.disabled": "this.disabled" } }, viewQueries: [{ propertyName: "wrapper", first: true, predicate: ["wrapper"], descendants: true, static: true }, { propertyName: "sourceImage", first: true, predicate: ["sourceImage"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [style.background]=\"imageVisible && backgroundColor\"\n     #wrapper\n>\n    <img\n      #sourceImage\n      class=\"ngx-ic-source-image\"\n      *ngIf=\"safeImgDataUrl\"\n      [src]=\"safeImgDataUrl\"\n      [style.visibility]=\"imageVisible ? 'visible' : 'hidden'\"\n      [style.transform]=\"safeTransformStyle\"\n      (load)=\"imageLoadedInView()\"\n    />\n    <div\n        class=\"ngx-ic-overlay\"\n        [style.width.px]=\"maxSize.width\"\n        [style.height.px]=\"maxSize.height\"\n        [style.margin-left]=\"alignImage === 'center' ? marginLeft : null\"\n    ></div>\n    <div class=\"ngx-ic-cropper\"\n         *ngIf=\"imageVisible\"\n         [class.ngx-ic-round]=\"roundCropper\"\n         [style.top.px]=\"cropper.y1\"\n         [style.left.px]=\"cropper.x1\"\n         [style.width.px]=\"cropper.x2 - cropper.x1\"\n         [style.height.px]=\"cropper.y2 - cropper.y1\"\n         [style.margin-left]=\"alignImage === 'center' ? marginLeft : null\"\n         [style.visibility]=\"imageVisible ? 'visible' : 'hidden'\"\n         (keydown)=\"keyboardAccess($event)\"\n         tabindex=\"0\"\n    >\n        <div\n            (mousedown)=\"startMove($event, moveTypes.Move)\"\n            (touchstart)=\"startMove($event, moveTypes.Move)\"\n            class=\"ngx-ic-move\">\n        </div>\n        <ng-container *ngIf=\"!hideResizeSquares\">\n            <span class=\"ngx-ic-resize ngx-ic-topleft\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'topleft')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'topleft')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-top\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-topright\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'topright')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'topright')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-right\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-bottomright\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'bottomright')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'bottomright')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-bottom\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-bottomleft\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'bottomleft')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'bottomleft')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-left\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize-bar ngx-ic-top\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'top')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'top')\">\n            </span>\n            <span class=\"ngx-ic-resize-bar ngx-ic-right\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'right')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'right')\">\n            </span>\n            <span class=\"ngx-ic-resize-bar ngx-ic-bottom\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'bottom')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'bottom')\">\n            </span>\n            <span class=\"ngx-ic-resize-bar ngx-ic-left\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'left')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'left')\">\n            </span>\n        </ng-container>\n    </div>\n</div>\n", styles: [":host{display:flex;position:relative;width:100%;max-width:100%;max-height:100%;overflow:hidden;padding:5px;text-align:center}:host>div{width:100%;position:relative}:host>div img.ngx-ic-source-image{max-width:100%;max-height:100%;transform-origin:center}:host .ngx-ic-overlay{position:absolute;pointer-events:none;touch-action:none;outline:var(--cropper-overlay-color, white) solid 100vw;top:0;left:0}:host .ngx-ic-cropper{position:absolute;display:flex;color:#53535c;background:transparent;outline:rgba(255,255,255,.3) solid 100vw;outline:var(--cropper-outline-color, rgba(255, 255, 255, .3)) solid 100vw;touch-action:none}@media (orientation: portrait){:host .ngx-ic-cropper{outline-width:100vh}}:host .ngx-ic-cropper:after{position:absolute;content:\"\";top:0;bottom:0;left:0;right:0;pointer-events:none;border:dashed 1px;opacity:.75;color:inherit;z-index:1}:host .ngx-ic-cropper .ngx-ic-move{width:100%;cursor:move;border:1px solid rgba(255,255,255,.5)}:host .ngx-ic-cropper:focus .ngx-ic-move{border-color:#1e90ff;border-width:2px}:host .ngx-ic-cropper .ngx-ic-resize{position:absolute;display:inline-block;line-height:6px;padding:8px;opacity:.85;z-index:1}:host .ngx-ic-cropper .ngx-ic-resize .ngx-ic-square{display:inline-block;background:#53535C;width:6px;height:6px;border:1px solid rgba(255,255,255,.5);box-sizing:content-box}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-topleft{top:-12px;left:-12px;cursor:nwse-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-top{top:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-topright{top:-12px;right:-12px;cursor:nesw-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-right{top:calc(50% - 12px);right:-12px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottomright{bottom:-12px;right:-12px;cursor:nwse-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottom{bottom:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottomleft{bottom:-12px;left:-12px;cursor:nesw-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-left{top:calc(50% - 12px);left:-12px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar{position:absolute;z-index:1}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-top{top:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-right{top:11px;right:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-bottom{bottom:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-left{top:11px;left:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .ngx-ic-cropper.ngx-ic-round{outline-color:transparent}:host .ngx-ic-cropper.ngx-ic-round:after{border-radius:100%;box-shadow:0 0 0 100vw #ffffff4d;box-shadow:0 0 0 100vw var(--cropper-outline-color, rgba(255, 255, 255, .3))}@media (orientation: portrait){:host .ngx-ic-cropper.ngx-ic-round:after{box-shadow:0 0 0 100vh #ffffff4d;box-shadow:0 0 0 100vh var(--cropper-outline-color, rgba(255, 255, 255, .3))}}:host .ngx-ic-cropper.ngx-ic-round .ngx-ic-move{border-radius:100%}:host.disabled .ngx-ic-cropper .ngx-ic-resize,:host.disabled .ngx-ic-cropper .ngx-ic-resize-bar,:host.disabled .ngx-ic-cropper .ngx-ic-move{display:none}\n"], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ImageCropperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: ImageCropperComponent, selector: "image-cropper", inputs: { imageChangedEvent: "imageChangedEvent", imageURL: "imageURL", imageBase64: "imageBase64", imageFile: "imageFile", format: "format", transform: "transform", maintainAspectRatio: "maintainAspectRatio", aspectRatio: "aspectRatio", resizeToWidth: "resizeToWidth", resizeToHeight: "resizeToHeight", cropperMinWidth: "cropperMinWidth", cropperMinHeight: "cropperMinHeight", cropperMaxHeight: "cropperMaxHeight", cropperMaxWidth: "cropperMaxWidth", cropperStaticWidth: "cropperStaticWidth", cropperStaticHeight: "cropperStaticHeight", canvasRotation: "canvasRotation", initialStepSize: "initialStepSize", roundCropper: "roundCropper", onlyScaleDown: "onlyScaleDown", imageQuality: "imageQuality", autoCrop: "autoCrop", backgroundColor: "backgroundColor", containWithinAspectRatio: "containWithinAspectRatio", hideResizeSquares: "hideResizeSquares", allowMoveImage: "allowMoveImage", cropper: "cropper", alignImage: "alignImage", disabled: "disabled" }, outputs: { imageCropped: "imageCropped", startCropImage: "startCropImage", imageLoaded: "imageLoaded", cropperReady: "cropperReady", loadImageFailed: "loadImageFailed", transformChange: "transformChange" }, host: { listeners: { "window:resize": "onResize()", "document:mousemove": "moveImg($event)", "document:touchmove": "moveImg($event)", "document:mouseup": "moveStop()", "document:touchend": "moveStop()" }, properties: { "style.text-align": "this.alignImage", "class.disabled": "this.disabled" } }, viewQueries: [{ propertyName: "wrapper", first: true, predicate: ["wrapper"], descendants: true, static: true }, { propertyName: "sourceImage", first: true, predicate: ["sourceImage"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  [style.background]=\"imageVisible && backgroundColor\"\n  #wrapper\n>\n  <img\n    #sourceImage\n    class=\"ngx-ic-source-image\"\n    *ngIf=\"safeImgDataUrl\"\n    [src]=\"safeImgDataUrl\"\n    [style.visibility]=\"imageVisible ? 'visible' : 'hidden'\"\n    [style.transform]=\"safeTransformStyle\"\n    [class.ngx-ic-draggable]=\"!disabled && allowMoveImage\"\n    (load)=\"imageLoadedInView()\"\n    (mousedown)=\"startMove($event, moveTypes.Drag)\"\n    (touchstart)=\"startMove($event, moveTypes.Drag)\"\n  >\n  <div\n    class=\"ngx-ic-overlay\"\n    [style.width.px]=\"maxSize.width\"\n    [style.height.px]=\"maxSize.height\"\n    [style.margin-left]=\"alignImage === 'center' ? marginLeft : null\"\n  ></div>\n  <div class=\"ngx-ic-cropper\"\n       *ngIf=\"imageVisible\"\n       [class.ngx-ic-round]=\"roundCropper\"\n       [style.top.px]=\"cropper.y1\"\n       [style.left.px]=\"cropper.x1\"\n       [style.width.px]=\"cropper.x2 - cropper.x1\"\n       [style.height.px]=\"cropper.y2 - cropper.y1\"\n       [style.margin-left]=\"alignImage === 'center' ? marginLeft : null\"\n       [style.visibility]=\"imageVisible ? 'visible' : 'hidden'\"\n       (keydown)=\"keyboardAccess($event)\"\n       tabindex=\"0\"\n  >\n    <div\n      (mousedown)=\"startMove($event, moveTypes.Move)\"\n      (touchstart)=\"startMove($event, moveTypes.Move)\"\n      class=\"ngx-ic-move\">\n    </div>\n    <ng-container *ngIf=\"!hideResizeSquares\">\n            <span class=\"ngx-ic-resize ngx-ic-topleft\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'topleft')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'topleft')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-top\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-topright\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'topright')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'topright')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-right\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-bottomright\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'bottomright')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'bottomright')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-bottom\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-bottomleft\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'bottomleft')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'bottomleft')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-left\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize-bar ngx-ic-top\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'top')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'top')\">\n            </span>\n      <span class=\"ngx-ic-resize-bar ngx-ic-right\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'right')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'right')\">\n            </span>\n      <span class=\"ngx-ic-resize-bar ngx-ic-bottom\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'bottom')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'bottom')\">\n            </span>\n      <span class=\"ngx-ic-resize-bar ngx-ic-left\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'left')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'left')\">\n            </span>\n    </ng-container>\n  </div>\n</div>\n", styles: [":host{display:flex;position:relative;width:100%;max-width:100%;max-height:100%;overflow:hidden;padding:5px;text-align:center}:host>div{width:100%;position:relative}:host>div img.ngx-ic-source-image{max-width:100%;max-height:100%;transform-origin:center}:host>div img.ngx-ic-source-image.ngx-ic-draggable{user-drag:none;-webkit-user-drag:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;cursor:grab}:host .ngx-ic-overlay{position:absolute;pointer-events:none;touch-action:none;outline:var(--cropper-overlay-color, white) solid 100vw;top:0;left:0}:host .ngx-ic-cropper{position:absolute;display:flex;color:#53535c;background:transparent;outline:rgba(255,255,255,.3) solid 100vw;outline:var(--cropper-outline-color, rgba(255, 255, 255, .3)) solid 100vw;touch-action:none}@media (orientation: portrait){:host .ngx-ic-cropper{outline-width:100vh}}:host .ngx-ic-cropper:after{position:absolute;content:\"\";top:0;bottom:0;left:0;right:0;pointer-events:none;border:dashed 1px;opacity:.75;color:inherit;z-index:1}:host .ngx-ic-cropper .ngx-ic-move{width:100%;cursor:move;border:1px solid rgba(255,255,255,.5)}:host .ngx-ic-cropper:focus .ngx-ic-move{border-color:#1e90ff;border-width:2px}:host .ngx-ic-cropper .ngx-ic-resize{position:absolute;display:inline-block;line-height:6px;padding:8px;opacity:.85;z-index:1}:host .ngx-ic-cropper .ngx-ic-resize .ngx-ic-square{display:inline-block;background:#53535C;width:6px;height:6px;border:1px solid rgba(255,255,255,.5);box-sizing:content-box}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-topleft{top:-12px;left:-12px;cursor:nwse-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-top{top:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-topright{top:-12px;right:-12px;cursor:nesw-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-right{top:calc(50% - 12px);right:-12px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottomright{bottom:-12px;right:-12px;cursor:nwse-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottom{bottom:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottomleft{bottom:-12px;left:-12px;cursor:nesw-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-left{top:calc(50% - 12px);left:-12px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar{position:absolute;z-index:1}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-top{top:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-right{top:11px;right:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-bottom{bottom:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-left{top:11px;left:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .ngx-ic-cropper.ngx-ic-round{outline-color:transparent}:host .ngx-ic-cropper.ngx-ic-round:after{border-radius:100%;box-shadow:0 0 0 100vw #ffffff4d;box-shadow:0 0 0 100vw var(--cropper-outline-color, rgba(255, 255, 255, .3))}@media (orientation: portrait){:host .ngx-ic-cropper.ngx-ic-round:after{box-shadow:0 0 0 100vh #ffffff4d;box-shadow:0 0 0 100vh var(--cropper-outline-color, rgba(255, 255, 255, .3))}}:host .ngx-ic-cropper.ngx-ic-round .ngx-ic-move{border-radius:100%}:host.disabled .ngx-ic-cropper .ngx-ic-resize,:host.disabled .ngx-ic-cropper .ngx-ic-resize-bar,:host.disabled .ngx-ic-cropper .ngx-ic-move{display:none}\n"], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ImageCropperComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'image-cropper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.background]=\"imageVisible && backgroundColor\"\n     #wrapper\n>\n    <img\n      #sourceImage\n      class=\"ngx-ic-source-image\"\n      *ngIf=\"safeImgDataUrl\"\n      [src]=\"safeImgDataUrl\"\n      [style.visibility]=\"imageVisible ? 'visible' : 'hidden'\"\n      [style.transform]=\"safeTransformStyle\"\n      (load)=\"imageLoadedInView()\"\n    />\n    <div\n        class=\"ngx-ic-overlay\"\n        [style.width.px]=\"maxSize.width\"\n        [style.height.px]=\"maxSize.height\"\n        [style.margin-left]=\"alignImage === 'center' ? marginLeft : null\"\n    ></div>\n    <div class=\"ngx-ic-cropper\"\n         *ngIf=\"imageVisible\"\n         [class.ngx-ic-round]=\"roundCropper\"\n         [style.top.px]=\"cropper.y1\"\n         [style.left.px]=\"cropper.x1\"\n         [style.width.px]=\"cropper.x2 - cropper.x1\"\n         [style.height.px]=\"cropper.y2 - cropper.y1\"\n         [style.margin-left]=\"alignImage === 'center' ? marginLeft : null\"\n         [style.visibility]=\"imageVisible ? 'visible' : 'hidden'\"\n         (keydown)=\"keyboardAccess($event)\"\n         tabindex=\"0\"\n    >\n        <div\n            (mousedown)=\"startMove($event, moveTypes.Move)\"\n            (touchstart)=\"startMove($event, moveTypes.Move)\"\n            class=\"ngx-ic-move\">\n        </div>\n        <ng-container *ngIf=\"!hideResizeSquares\">\n            <span class=\"ngx-ic-resize ngx-ic-topleft\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'topleft')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'topleft')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-top\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-topright\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'topright')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'topright')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-right\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-bottomright\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'bottomright')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'bottomright')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-bottom\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-bottomleft\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'bottomleft')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'bottomleft')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize ngx-ic-left\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n            <span class=\"ngx-ic-resize-bar ngx-ic-top\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'top')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'top')\">\n            </span>\n            <span class=\"ngx-ic-resize-bar ngx-ic-right\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'right')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'right')\">\n            </span>\n            <span class=\"ngx-ic-resize-bar ngx-ic-bottom\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'bottom')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'bottom')\">\n            </span>\n            <span class=\"ngx-ic-resize-bar ngx-ic-left\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'left')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'left')\">\n            </span>\n        </ng-container>\n    </div>\n</div>\n", styles: [":host{display:flex;position:relative;width:100%;max-width:100%;max-height:100%;overflow:hidden;padding:5px;text-align:center}:host>div{width:100%;position:relative}:host>div img.ngx-ic-source-image{max-width:100%;max-height:100%;transform-origin:center}:host .ngx-ic-overlay{position:absolute;pointer-events:none;touch-action:none;outline:var(--cropper-overlay-color, white) solid 100vw;top:0;left:0}:host .ngx-ic-cropper{position:absolute;display:flex;color:#53535c;background:transparent;outline:rgba(255,255,255,.3) solid 100vw;outline:var(--cropper-outline-color, rgba(255, 255, 255, .3)) solid 100vw;touch-action:none}@media (orientation: portrait){:host .ngx-ic-cropper{outline-width:100vh}}:host .ngx-ic-cropper:after{position:absolute;content:\"\";top:0;bottom:0;left:0;right:0;pointer-events:none;border:dashed 1px;opacity:.75;color:inherit;z-index:1}:host .ngx-ic-cropper .ngx-ic-move{width:100%;cursor:move;border:1px solid rgba(255,255,255,.5)}:host .ngx-ic-cropper:focus .ngx-ic-move{border-color:#1e90ff;border-width:2px}:host .ngx-ic-cropper .ngx-ic-resize{position:absolute;display:inline-block;line-height:6px;padding:8px;opacity:.85;z-index:1}:host .ngx-ic-cropper .ngx-ic-resize .ngx-ic-square{display:inline-block;background:#53535C;width:6px;height:6px;border:1px solid rgba(255,255,255,.5);box-sizing:content-box}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-topleft{top:-12px;left:-12px;cursor:nwse-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-top{top:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-topright{top:-12px;right:-12px;cursor:nesw-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-right{top:calc(50% - 12px);right:-12px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottomright{bottom:-12px;right:-12px;cursor:nwse-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottom{bottom:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottomleft{bottom:-12px;left:-12px;cursor:nesw-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-left{top:calc(50% - 12px);left:-12px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar{position:absolute;z-index:1}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-top{top:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-right{top:11px;right:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-bottom{bottom:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-left{top:11px;left:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .ngx-ic-cropper.ngx-ic-round{outline-color:transparent}:host .ngx-ic-cropper.ngx-ic-round:after{border-radius:100%;box-shadow:0 0 0 100vw #ffffff4d;box-shadow:0 0 0 100vw var(--cropper-outline-color, rgba(255, 255, 255, .3))}@media (orientation: portrait){:host .ngx-ic-cropper.ngx-ic-round:after{box-shadow:0 0 0 100vh #ffffff4d;box-shadow:0 0 0 100vh var(--cropper-outline-color, rgba(255, 255, 255, .3))}}:host .ngx-ic-cropper.ngx-ic-round .ngx-ic-move{border-radius:100%}:host.disabled .ngx-ic-cropper .ngx-ic-resize,:host.disabled .ngx-ic-cropper .ngx-ic-resize-bar,:host.disabled .ngx-ic-cropper .ngx-ic-move{display:none}\n"] }]
+            args: [{ selector: 'image-cropper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  [style.background]=\"imageVisible && backgroundColor\"\n  #wrapper\n>\n  <img\n    #sourceImage\n    class=\"ngx-ic-source-image\"\n    *ngIf=\"safeImgDataUrl\"\n    [src]=\"safeImgDataUrl\"\n    [style.visibility]=\"imageVisible ? 'visible' : 'hidden'\"\n    [style.transform]=\"safeTransformStyle\"\n    [class.ngx-ic-draggable]=\"!disabled && allowMoveImage\"\n    (load)=\"imageLoadedInView()\"\n    (mousedown)=\"startMove($event, moveTypes.Drag)\"\n    (touchstart)=\"startMove($event, moveTypes.Drag)\"\n  >\n  <div\n    class=\"ngx-ic-overlay\"\n    [style.width.px]=\"maxSize.width\"\n    [style.height.px]=\"maxSize.height\"\n    [style.margin-left]=\"alignImage === 'center' ? marginLeft : null\"\n  ></div>\n  <div class=\"ngx-ic-cropper\"\n       *ngIf=\"imageVisible\"\n       [class.ngx-ic-round]=\"roundCropper\"\n       [style.top.px]=\"cropper.y1\"\n       [style.left.px]=\"cropper.x1\"\n       [style.width.px]=\"cropper.x2 - cropper.x1\"\n       [style.height.px]=\"cropper.y2 - cropper.y1\"\n       [style.margin-left]=\"alignImage === 'center' ? marginLeft : null\"\n       [style.visibility]=\"imageVisible ? 'visible' : 'hidden'\"\n       (keydown)=\"keyboardAccess($event)\"\n       tabindex=\"0\"\n  >\n    <div\n      (mousedown)=\"startMove($event, moveTypes.Move)\"\n      (touchstart)=\"startMove($event, moveTypes.Move)\"\n      class=\"ngx-ic-move\">\n    </div>\n    <ng-container *ngIf=\"!hideResizeSquares\">\n            <span class=\"ngx-ic-resize ngx-ic-topleft\"\n                  (mousedown)=\"startMove($event, moveTypes.Resize, 'topleft')\"\n                  (touchstart)=\"startMove($event, moveTypes.Resize, 'topleft')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-top\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-topright\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'topright')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'topright')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-right\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-bottomright\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'bottomright')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'bottomright')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-bottom\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-bottomleft\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'bottomleft')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'bottomleft')\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize ngx-ic-left\">\n                <span class=\"ngx-ic-square\"></span>\n            </span>\n      <span class=\"ngx-ic-resize-bar ngx-ic-top\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'top')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'top')\">\n            </span>\n      <span class=\"ngx-ic-resize-bar ngx-ic-right\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'right')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'right')\">\n            </span>\n      <span class=\"ngx-ic-resize-bar ngx-ic-bottom\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'bottom')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'bottom')\">\n            </span>\n      <span class=\"ngx-ic-resize-bar ngx-ic-left\"\n            (mousedown)=\"startMove($event, moveTypes.Resize, 'left')\"\n            (touchstart)=\"startMove($event, moveTypes.Resize, 'left')\">\n            </span>\n    </ng-container>\n  </div>\n</div>\n", styles: [":host{display:flex;position:relative;width:100%;max-width:100%;max-height:100%;overflow:hidden;padding:5px;text-align:center}:host>div{width:100%;position:relative}:host>div img.ngx-ic-source-image{max-width:100%;max-height:100%;transform-origin:center}:host>div img.ngx-ic-source-image.ngx-ic-draggable{user-drag:none;-webkit-user-drag:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;cursor:grab}:host .ngx-ic-overlay{position:absolute;pointer-events:none;touch-action:none;outline:var(--cropper-overlay-color, white) solid 100vw;top:0;left:0}:host .ngx-ic-cropper{position:absolute;display:flex;color:#53535c;background:transparent;outline:rgba(255,255,255,.3) solid 100vw;outline:var(--cropper-outline-color, rgba(255, 255, 255, .3)) solid 100vw;touch-action:none}@media (orientation: portrait){:host .ngx-ic-cropper{outline-width:100vh}}:host .ngx-ic-cropper:after{position:absolute;content:\"\";top:0;bottom:0;left:0;right:0;pointer-events:none;border:dashed 1px;opacity:.75;color:inherit;z-index:1}:host .ngx-ic-cropper .ngx-ic-move{width:100%;cursor:move;border:1px solid rgba(255,255,255,.5)}:host .ngx-ic-cropper:focus .ngx-ic-move{border-color:#1e90ff;border-width:2px}:host .ngx-ic-cropper .ngx-ic-resize{position:absolute;display:inline-block;line-height:6px;padding:8px;opacity:.85;z-index:1}:host .ngx-ic-cropper .ngx-ic-resize .ngx-ic-square{display:inline-block;background:#53535C;width:6px;height:6px;border:1px solid rgba(255,255,255,.5);box-sizing:content-box}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-topleft{top:-12px;left:-12px;cursor:nwse-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-top{top:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-topright{top:-12px;right:-12px;cursor:nesw-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-right{top:calc(50% - 12px);right:-12px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottomright{bottom:-12px;right:-12px;cursor:nwse-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottom{bottom:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-bottomleft{bottom:-12px;left:-12px;cursor:nesw-resize}:host .ngx-ic-cropper .ngx-ic-resize.ngx-ic-left{top:calc(50% - 12px);left:-12px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar{position:absolute;z-index:1}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-top{top:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-right{top:11px;right:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-bottom{bottom:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .ngx-ic-cropper .ngx-ic-resize-bar.ngx-ic-left{top:11px;left:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .ngx-ic-cropper.ngx-ic-round{outline-color:transparent}:host .ngx-ic-cropper.ngx-ic-round:after{border-radius:100%;box-shadow:0 0 0 100vw #ffffff4d;box-shadow:0 0 0 100vw var(--cropper-outline-color, rgba(255, 255, 255, .3))}@media (orientation: portrait){:host .ngx-ic-cropper.ngx-ic-round:after{box-shadow:0 0 0 100vh #ffffff4d;box-shadow:0 0 0 100vh var(--cropper-outline-color, rgba(255, 255, 255, .3))}}:host .ngx-ic-cropper.ngx-ic-round .ngx-ic-move{border-radius:100%}:host.disabled .ngx-ic-cropper .ngx-ic-resize,:host.disabled .ngx-ic-cropper .ngx-ic-resize-bar,:host.disabled .ngx-ic-cropper .ngx-ic-move{display:none}\n"] }]
         }], ctorParameters: function () { return [{ type: CropService }, { type: CropperPositionService }, { type: LoadImageService }, { type: i4.DomSanitizer }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { wrapper: [{
                 type: ViewChild,
                 args: ['wrapper', { static: true }]
@@ -1242,6 +1280,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                 type: Input
             }], hideResizeSquares: [{
                 type: Input
+            }], allowMoveImage: [{
+                type: Input
             }], cropper: [{
                 type: Input
             }], alignImage: [{
@@ -1264,6 +1304,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                 type: Output
             }], loadImageFailed: [{
                 type: Output
+            }], transformChange: [{
+                type: Output
             }], onResize: [{
                 type: HostListener,
                 args: ['window:resize']
@@ -1295,7 +1337,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                         CommonModule
                     ],
                     declarations: [
-                        ImageCropperComponent
+                        ImageCropperComponent,
                     ],
                     exports: [
                         ImageCropperComponent
@@ -1319,5 +1361,5 @@ function base64ToFile(base64Image) {
  * Generated bundle index. Do not edit.
  */
 
-export { ImageCropperComponent, ImageCropperModule, base64ToFile, resizeCanvas };
+export { CropService, ImageCropperComponent, ImageCropperModule, base64ToFile, resizeCanvas };
 //# sourceMappingURL=ngx-image-cropper.mjs.map